:root{color:#162019;background:#f3f6f0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:repeating-linear-gradient(90deg,rgba(43,134,80,.04) 0,rgba(43,134,80,.04) 1px,transparent 1px,transparent 28px),linear-gradient(180deg,#fbfcf8,#eef4f0 44%,#f7efe4),#f4f5ef}button,input{font:inherit}button{border:0;cursor:pointer}button:disabled{cursor:not-allowed}.app-shell{width:min(880px,100%);min-height:100vh;margin:0 auto;padding:18px 16px 36px}.hero-panel{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 180px;gap:18px;min-height:218px;overflow:hidden;padding:24px;border-radius:8px;color:#f8fff9;background:linear-gradient(135deg,rgba(242,189,103,.16),rgba(52,104,189,.08) 42%,transparent 74%),repeating-linear-gradient(135deg,rgba(255,255,255,.07) 0,rgba(255,255,255,.07) 1px,transparent 1px,transparent 18px),#17251e;box-shadow:0 26px 80px #17251e33}.hero-panel:before{position:absolute;inset:0 0 auto;height:5px;background:linear-gradient(90deg,#f2bd67,#2b8650 48%,#3468bd);content:""}.hero-copy{position:relative;z-index:1;display:grid;align-content:center}.brand-row{display:inline-flex;align-items:center;gap:9px;width:fit-content;margin-bottom:18px;padding:7px 10px 7px 7px;border:1px solid rgba(255,255,255,.18);border-radius:8px;color:#f8fff9;background:#ffffff14;font-size:13px;font-weight:900}.brand-mark{display:grid;width:34px;height:28px;place-items:center;border-radius:7px;color:#17251e;background:#f2bd67;font-size:11px}.hero-copy h1,.section-heading h2,.login-copy h2,.profile-panel h2,.modal-heading h3{margin:0;letter-spacing:0}.hero-copy h1{max-width:520px;font-size:38px;line-height:1.05}.hero-text{max-width:470px;margin:12px 0 0;color:#d9e7dd;font-size:15px;line-height:1.5}.hero-points{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.hero-points span{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 9px;border:1px solid rgba(255,255,255,.14);border-radius:999px;color:#edf8f0;background:#ffffff14;font-size:12px;font-weight:800}.eyebrow{margin:0 0 6px;color:#66806f;font-size:12px;font-weight:800;letter-spacing:0;text-transform:uppercase}.hero-panel .eyebrow{color:#f2bd67}.hero-visual{display:grid;place-items:center;position:relative}.phone-plate{display:grid;width:112px;height:136px;place-items:center;border:2px solid rgba(255,255,255,.28);border-radius:8px;color:#17251e;background:#f8fff9;box-shadow:inset 0 -14px #f2bd6757,0 18px 45px #0003}.phone-plate span{display:grid;width:34px;height:24px;place-items:center;border-radius:8px;color:#fff;background:#2b8650;font-weight:900}.hub-card{position:absolute;right:0;bottom:10px;display:grid;gap:2px;width:112px;padding:10px;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#17251e;background:#fff;box-shadow:0 18px 36px #0000002e}.hub-card strong{font-size:18px}.hub-card span{color:#66746a;font-size:12px;font-weight:800}.signal-bars{display:flex;align-items:end;gap:5px;margin-top:-28px;margin-left:82px}.signal-bars span{width:8px;border-radius:8px 8px 0 0;background:#f2bd67}.signal-bars span:nth-child(1){height:14px}.signal-bars span:nth-child(2){height:24px}.signal-bars span:nth-child(3){height:34px}.signal-bars span:nth-child(4){height:44px}.account-strip,.login-panel,.segmented,.banner,.inventory-row,.order-row,.profile-panel,.modal{border:1px solid rgba(207,219,210,.92);background:#fffffff5;box-shadow:0 12px 35px #26342b14}.account-strip{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:14px;padding:13px;border-radius:8px}.account-identity{display:flex;align-items:center;gap:10px;min-width:0}.account-identity>div:last-child,.inventory-main,.order-row>div,.profile-panel>div{min-width:0}.account-identity>div:last-child{display:grid;gap:2px}.account-identity strong,.inventory-main strong,.order-row strong,.profile-panel h2{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.account-identity span,.inventory-main p,.inventory-main span,.order-row span,.order-row small,.profile-panel span,.login-copy p,.payment-copy{color:#66746a;font-size:14px;line-height:1.45}.avatar,.phone-mark{display:grid;flex:0 0 auto;width:42px;height:42px;place-items:center;border-radius:8px}.avatar{color:#17251e;background:linear-gradient(135deg,#f2bd67eb,#dcefe2fa),#dcefe2}.account-actions{display:flex;align-items:center;gap:8px}.icon-button,.ghost-button,.segmented button,.chip,.inventory-action button,.modal-actions button,.primary-wide{min-height:40px;border-radius:8px;font-weight:800}.icon-button{display:grid;width:42px;place-items:center;color:#17251e;background:#eef4ef;transition:transform .16s ease,background .16s ease}.ghost-button{display:flex;align-items:center;justify-content:center;gap:7px;padding:0 12px;color:#17251e;background:#eef4ef;transition:transform .16s ease,background .16s ease}.icon-button:hover,.ghost-button:hover,.chip:hover,.inventory-action button:hover,.primary-wide:hover,.modal-actions button:hover{transform:translateY(-1px)}.login-panel{display:grid;gap:14px;margin-top:12px;padding:15px;border-radius:8px;border-color:#f1d09a;background:#fffaf1}.login-copy{display:flex;gap:12px}.login-copy svg{flex:0 0 auto;color:#c1731a}.login-form{display:grid;gap:10px}.login-form label{display:grid;gap:6px;color:#3e4b43;font-size:13px;font-weight:800}.login-form input,.search-box input{width:100%;min-width:0;border:0;outline:0;color:#162019;background:transparent}.login-form input{min-height:42px;padding:0 12px;border:1px solid #d8e1d9;border-radius:8px;background:#fff}.primary-wide{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;color:#fff;background:#1f7a3f;box-shadow:0 10px 24px #1f7a3f2e;text-decoration:none}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.metric-grid div{display:grid;gap:5px;min-height:88px;padding:12px;border-radius:8px;color:#17251e;background:linear-gradient(180deg,#fffffffa,#f7faf7fa),#fff;border:1px solid #d8e1d9;box-shadow:0 10px 26px #26342b12}.metric-grid div:nth-child(1){border-top:3px solid #2b8650}.metric-grid div:nth-child(2){border-top:3px solid #c1731a}.metric-grid div:nth-child(3){border-top:3px solid #3468bd}.metric-grid div:nth-child(1) svg{color:#2b8650}.metric-grid div:nth-child(2) svg{color:#c1731a}.metric-grid div:nth-child(3) svg{color:#3468bd}.metric-grid strong{font-size:20px}.metric-grid span{color:#66746a;font-size:13px;font-weight:700}.segmented{display:grid;grid-template-columns:repeat(auto-fit,minmax(76px,1fr));gap:4px;margin-top:14px;padding:4px;border-radius:8px}.segmented button{display:flex;align-items:center;justify-content:center;gap:8px;color:#5c6c61;background:transparent}.segmented button.active{color:#102117;background:linear-gradient(180deg,#eef8f1,#dcefe2),#dcefe2;box-shadow:inset 0 0 0 1px #2b865014}.banner{display:flex;align-items:center;gap:10px;margin-top:12px;padding:12px;border-radius:8px;font-size:14px}.banner.error{color:#7f1d1d;background:#fee2e2;border-color:#fecaca}.banner.success{color:#14532d;background:#dcfce7;border-color:#bbf7d0}.content{padding-top:22px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.section-heading h2{font-size:23px}.section-heading svg{color:#2b8650}.catalog-tools{display:grid;gap:10px;margin-bottom:14px}.search-box{display:flex;align-items:center;gap:9px;min-height:44px;padding:0 12px;border:1px solid #d8e1d9;border-radius:8px;color:#66746a;background:#fff;box-shadow:0 10px 26px #26342b0f}.chip-row{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px}.chip{flex:0 0 auto;padding:0 12px;color:#536257;background:#fff;border:1px solid #d8e1d9;transition:transform .16s ease,border-color .16s ease,background .16s ease}.chip.active{color:#fff;background:#17251e;border-color:#17251e;box-shadow:0 10px 22px #17251e29}.inventory-list,.order-list,.profile-grid,.wallet-list{display:grid;gap:10px}.inventory-row,.order-row,.wallet-row{display:grid;align-items:center;gap:12px;min-height:104px;padding:13px;border-radius:8px;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.inventory-row:hover,.order-row:hover,.wallet-row:hover,.profile-panel:hover{transform:translateY(-2px);border-color:#bdd4c4;box-shadow:0 18px 42px #26342b1f}.inventory-row{grid-template-columns:auto minmax(0,1fr) auto}.order-row,.wallet-row{grid-template-columns:minmax(0,1fr)}.phone-mark{color:#fff;background:linear-gradient(135deg,#2b8650,#3468bd),#2b8650;box-shadow:inset 0 -10px #ffffff1f}.inventory-main,.order-row>div{display:grid;gap:5px}.inventory-main p{margin:0}.row-title{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}.row-title>span:not(.pill){flex:0 0 auto;padding:4px 7px;border-radius:999px;color:#1f5a33;background:#dcefe2;font-size:12px;font-weight:900}.mini-meta{display:flex;flex-wrap:wrap;gap:8px}.mini-meta span{display:inline-flex;align-items:center;gap:4px;width:fit-content;padding:4px 7px;border-radius:999px;color:#405047;background:#f4f6f3;border:1px solid #e5ece6}.inventory-action{display:grid;justify-items:end;gap:9px}.inventory-action>span{color:#17251e;font-size:16px;font-weight:900}.inventory-action small{color:#c1731a;font-size:12px;font-weight:900}.inventory-action button,.modal-actions button{padding:0 14px;color:#fff;background:linear-gradient(180deg,#2b8650,#1f6d3a),#1f7a3f;box-shadow:0 10px 24px #1f7a3f2b}.empty{margin:24px 0;color:#66746a}code{display:inline-block;width:fit-content;padding:5px 8px;border-radius:6px;color:#17251e;background:#f2f5f3;font-family:SFMono-Regular,Consolas,monospace;font-size:13px}.pill{flex:0 0 auto;padding:6px 8px;border-radius:999px;font-size:12px;font-weight:900;text-transform:capitalize;white-space:nowrap}.pill.pending-payment{color:#7c2d12;background:#ffedd5}.pill.delivered{color:#14532d;background:#dcfce7}.pill.paid{color:#1d4ed8;background:#dbeafe}.pill.cancelled{color:#7f1d1d;background:#fee2e2}.order-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}.inline-pay-button,.inline-wallet-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;width:fit-content;min-height:36px;padding:0 12px;border-radius:8px;color:#fff;font-weight:900}.inline-pay-button{background:linear-gradient(180deg,#3468bd,#244d91),#3468bd}.inline-wallet-button{background:linear-gradient(180deg,#2b8650,#1f6d3a),#1f7a3f}.inline-wallet-button:disabled{opacity:.52}.wallet-layout{display:grid;gap:14px}.section-heading.compact{margin-bottom:4px}.topup-panel{display:grid;gap:12px;padding:14px;border:1px solid #d8e1d9;border-radius:8px;background:#fffffff5;box-shadow:0 12px 32px #26342b12}.topup-panel label{display:grid;gap:6px;color:#3e4b43;font-size:13px;font-weight:800}.topup-panel input,.topup-panel textarea{width:100%;min-width:0;border:1px solid #d8e1d9;outline:0;color:#162019;background:#fff;font:inherit}.topup-panel input{min-height:42px;padding:0 12px;border-radius:8px}.topup-panel textarea{min-height:76px;resize:vertical;padding:10px 12px;border-radius:8px}.payment-methods{display:grid;grid-template-columns:1fr 1fr;gap:8px}.payment-methods button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:42px;border-radius:8px;color:#536257;background:#eef4ef;font-weight:900}.payment-methods button.active{color:#fff;background:#17251e}.wallet-row{align-items:stretch}.wallet-row>div{display:flex;justify-content:space-between;gap:10px}.wallet-row small{color:#66746a;font-weight:800;text-transform:capitalize}.profile-panel{display:flex;gap:12px;padding:14px;border-radius:8px;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.profile-panel>svg{flex:0 0 auto;color:#3468bd;filter:drop-shadow(0 8px 14px rgba(52,104,189,.16))}.profile-panel h2{margin-bottom:3px;font-size:20px}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;align-items:end;padding:16px;background:#0f171275}.modal{width:min(540px,100%);margin:0 auto;padding:16px;border-radius:8px;box-shadow:0 24px 80px #0a140f3d}.modal-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}.modal-heading strong{flex:0 0 auto;white-space:nowrap}dl{display:grid;gap:8px;margin:0 0 14px}dl div{display:flex;justify-content:space-between;gap:12px;padding:10px;border-radius:8px;background:#f6f8f6;border:1px solid #e5ece6}dt{color:#66746a}dd{min-width:0;margin:0;overflow-wrap:anywhere;font-weight:900}.checkbox-line{display:flex;align-items:flex-start;gap:10px;margin-bottom:12px;color:#17251e;font-size:14px;line-height:1.4}.checkbox-line input{width:18px;height:18px;margin-top:1px;accent-color:#1f7a3f}.payment-copy{margin:0 0 14px;padding:12px;border-radius:8px;background:#fff7ed;border:1px solid #fed7aa}.modal-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.modal-actions button.secondary{color:#17251e;background:#e8ede9}.admin-layout{display:grid;gap:14px}.admin-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.admin-stats div,.admin-panel{border:1px solid rgba(218,165,32,.28);border-radius:8px;background:linear-gradient(180deg,#ffffff17,#ffffff06),#0d0d0dc2;box-shadow:0 18px 42px #0000004d;backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%)}.admin-stats div{display:grid;gap:4px;min-height:78px;padding:13px}.admin-stats strong{color:#f5c968;font-size:24px}.admin-stats span{color:#b9b0a0;font-size:12px;font-weight:800}.admin-panel{display:grid;gap:12px;padding:14px}.admin-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.admin-panel label{display:grid;gap:6px;color:#d7cfbd;font-size:13px;font-weight:800}.admin-panel input,.admin-panel textarea{width:100%;min-width:0;border:1px solid rgba(218,165,32,.28);outline:0;color:#fff9ea;background:#060606b8;font:inherit}.preset-row{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}.preset-row button{flex:0 0 auto;min-height:30px;padding:0 10px;border:1px solid rgba(218,165,32,.22);border-radius:999px;color:#d7cfbd;background:#ffffff0b;font-size:12px;font-weight:900}.preset-row button.active{color:#160f05;background:linear-gradient(180deg,#f9d978,#c99427);border-color:#f5c968}.admin-panel input{min-height:42px;padding:0 12px;border-radius:8px}.admin-panel textarea{min-height:82px;resize:vertical;padding:10px 12px;border-radius:8px}.admin-list{display:grid;gap:9px}.admin-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px;border:1px solid rgba(218,165,32,.2);border-radius:8px;background:#060606}.admin-row>div:first-child{display:grid;gap:4px;min-width:0}.admin-row strong{color:#fff6da}.admin-row span,.admin-row small{color:#b9b0a0}.admin-actions{display:flex;flex-wrap:wrap;justify-content:end;gap:8px}.admin-actions button{min-height:36px;padding:0 12px;border-radius:8px;color:#160f05;background:#f5c968;font-weight:900}.admin-actions button.danger{color:#fff1f1;background:#8b1e1e}:root{color:#fff7df;background:#030303}body{background:linear-gradient(115deg,transparent 0%,rgba(245,201,104,.075) 48%,transparent 58%),linear-gradient(90deg,rgba(212,175,55,.05) 1px,transparent 1px),linear-gradient(180deg,#050505,#0d0b08 45%,#030303),#030303;background-size:auto,34px 34px,auto,auto}.hero-panel{border:1px solid rgba(245,201,104,.34);color:#fff8e8;background:linear-gradient(118deg,rgba(255,255,255,.16),transparent 29%),linear-gradient(135deg,rgba(245,201,104,.14),transparent 42%),repeating-linear-gradient(135deg,rgba(245,201,104,.08) 0,rgba(245,201,104,.08) 1px,transparent 1px,transparent 19px),#070707c7;box-shadow:0 28px 90px #00000085;backdrop-filter:blur(20px) saturate(145%);-webkit-backdrop-filter:blur(20px) saturate(145%)}.hero-panel:before{background:linear-gradient(90deg,#a77418,#f5c968 45%,#fff0a8)}.hero-panel:after{position:absolute;top:1px;right:1px;bottom:1px;left:1px;border-radius:7px;background:linear-gradient(125deg,rgba(255,255,255,.18),transparent 32%),linear-gradient(305deg,rgba(245,201,104,.1),transparent 42%);content:"";pointer-events:none}.hero-visual{z-index:1}.brand-row,.hero-points span{border-color:#f5c96847;background:#f5c96814}.brand-mark,.phone-plate span,.signal-bars span{color:#140e04;background:#f5c968}.hero-panel .eyebrow,.eyebrow,.inventory-action small,.section-heading svg,.profile-panel>svg{color:#f5c968}.hero-text,.hero-points span,.account-identity span,.inventory-main p,.inventory-main span,.order-row span,.order-row small,.profile-panel span,.payment-copy,.metric-grid span,.empty,.search-box,dt{color:#b9b0a0}.account-strip,.login-panel,.metric-grid div,.inventory-row,.order-row,.wallet-row,.profile-panel,.modal,.topup-panel,.search-box{border-color:#daa5203d;background:linear-gradient(180deg,#ffffff1a,#ffffff06),#0b0b0bb8;box-shadow:0 18px 42px #0000004d;backdrop-filter:blur(18px) saturate(138%);-webkit-backdrop-filter:blur(18px) saturate(138%)}.login-panel,.payment-copy{border-color:#f5c96857;background:#f5c96814}.account-identity strong,.inventory-main strong,.metric-grid strong,.section-heading h2,.login-copy h2,.profile-panel h2,.modal-heading h3,.inventory-action>span,dd,code{color:#fff7df}.avatar{color:#160f05;background:linear-gradient(135deg,#f5c968,#8d641b),#f5c968}.phone-mark{color:#160f05;background:linear-gradient(135deg,#f5c968,#8d641b),#f5c968;box-shadow:inset 0 -10px #00000029}.hub-card,.segmented,.chip,.row-title>span:not(.pill),.mini-meta span,dl div,code,.icon-button,.ghost-button{border-color:#daa52038;color:#fff7df;background:#11100dc2;backdrop-filter:blur(14px) saturate(132%);-webkit-backdrop-filter:blur(14px) saturate(132%)}.segmented button{color:#b9b0a0}.segmented button.active,.chip.active{color:#160f05;background:#f5c968;border-color:#f5c968}.chip{color:#d7cfbd}.search-box input,.login-form input,.topup-panel input,.topup-panel textarea{color:#fff7df;background:#050505b8}.login-form input,.topup-panel input,.topup-panel textarea{border-color:#daa5203d}.primary-wide,.primary-wide.gold,.inventory-action button,.modal-actions button,.inline-wallet-button{color:#160f05;background:linear-gradient(180deg,#f9d978,#c99427),#f5c968;box-shadow:0 12px 28px #daa5202e}.inline-pay-button{color:#f8f4ea;background:linear-gradient(180deg,#2b2b2b,#111),#111;border:1px solid rgba(245,201,104,.22)}.payment-methods button{color:#d7cfbd;background:#11100d}.payment-methods button.active{color:#160f05;background:#f5c968}.banner.success{color:#d8ffd8;background:#22642d61;border-color:#4ade8047}.banner.error{color:#ffd5d5;background:#7f1d1d6b;border-color:#f8717147}.modal-backdrop{background:#000000ad}@media(max-width:640px){.hero-panel{grid-template-columns:minmax(0,1fr);min-height:0}.hero-visual{display:none}.hero-copy h1{font-size:30px}.account-strip{align-items:stretch;flex-direction:column}.account-actions{justify-content:space-between}.inventory-row{grid-template-columns:auto minmax(0,1fr)}.inventory-action{grid-column:1 / -1;grid-template-columns:1fr auto;align-items:center;justify-items:start}.inventory-action button{justify-self:end}.admin-form-grid,.admin-stats,.admin-row{grid-template-columns:1fr}.admin-actions{justify-content:stretch}.admin-actions button{flex:1 1 auto}}@media(max-width:430px){.app-shell{padding-inline:12px}.hero-panel{padding:18px}.hero-copy h1{font-size:28px}.metric-grid{grid-template-columns:1fr}.segmented button{gap:5px;font-size:13px}.row-title{align-items:flex-start;flex-direction:column}}