@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap";.auth-page{background:#f7f9fc;grid-template-columns:minmax(320px,42%) 1fr;display:grid;max-width:none!important;min-height:100vh!important;margin:0!important;padding:0!important}.auth-brand{color:#fff;background:linear-gradient(150deg,#071733,#0d2a58);flex-direction:column;justify-content:space-between;padding:46px 56px;display:flex}.auth-brand .brand{color:#fff;margin:0}.auth-brand h2{margin:20px 0 12px;font-size:42px;line-height:1.08}.auth-brand p{color:#aebcd4}.auth-brand svg{color:#ff6b35;width:42px;height:42px}.auth-panel{place-items:center;padding:40px;display:grid}.welcome-copy,.auth-form{width:min(100%,460px)}.welcome-copy h1,.auth-form h1{color:#091a38;margin:10px 0 14px;font-size:42px;line-height:1.1}.welcome-copy>p:not(.eyebrow),.auth-form>p:not(.eyebrow){color:#6e7890;margin-bottom:26px;line-height:1.6}.auth-icon{color:#ff6433;background:#fff0ea;border-radius:18px;place-items:center;width:58px;height:58px;margin-bottom:30px;display:grid}.auth-form{flex-direction:column;gap:14px;display:flex}.auth-form label{color:#1a2741;font-size:14px;font-weight:700}.auth-form input{width:100%;font:inherit;border:1px solid #d8deea;border-radius:11px;outline:none;margin-top:7px;padding:14px 15px}.auth-form input:focus{border-color:#ff6433;box-shadow:0 0 0 3px #ff64331c}.primary,.secondary{cursor:pointer;border:0;border-radius:11px;padding:14px 18px;font-size:15px;font-weight:800}.primary{color:#fff;background:#ff6433;margin-top:8px}.secondary{color:#0a1c3c;background:#fff;border:1px solid #dbe1eb;margin-top:10px}.primary:disabled{opacity:.6}.back{color:#66728a;cursor:pointer;background:0 0;border:0;align-self:flex-start;padding:0 0 18px}.form-error{background:#fff0f0;border-radius:9px;padding:11px 13px;color:#bd2525!important;margin:0!important}.demo-banner{color:#765600;background:#fff6dd;border:1px solid #f3d689;border-radius:10px;justify-content:space-between;padding:13px 15px;display:flex}.otp-input{letter-spacing:10px;text-align:center;font-size:28px!important}.centered{align-self:center}.page-loader{text-align:center;color:#60708b;place-content:center;gap:14px;min-height:100vh;display:grid}.spin{animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.customer-dashboard{background:#f5f7fb;min-height:100vh}.customer-dashboard>header{background:#fff;border-bottom:1px solid #e6e9ef;justify-content:space-between;align-items:center;height:76px;margin:0;padding:0 max(28px,50vw - 525px);display:flex}.customer-dashboard>header .brand{margin:0}.customer-dashboard main{max-width:1050px;margin:auto;padding:56px 28px}.customer-dashboard h1{margin:8px 0 30px;font-size:38px}.compact{align-items:center;gap:8px;margin:0;padding:10px 14px;display:flex}.compact svg{width:17px}.setup-card,.profile-card{background:#fff;border:1px solid #e0e5ed;border-radius:18px;margin-bottom:22px;padding:32px}.setup-card{text-align:center;padding:55px}.setup-card>svg{color:#ff6433;width:36px;height:36px}.setup-card p{color:#69758a}.setup-card .primary{width:auto;display:inline-block}.wallet-card{color:#fff;background:linear-gradient(145deg,#071834,#112f61);border-radius:20px;max-width:580px;margin-bottom:24px;padding:30px;position:relative;box-shadow:0 16px 36px #0718342b}.wallet-card>svg{color:#ff7043;position:absolute;top:30px;right:30px}.wallet-card p{color:#8fa4c5;letter-spacing:.1em;font-size:11px;font-weight:800}.wallet-card h2{font-size:18px}.wallet-card>strong{letter-spacing:.12em;margin:40px 0 6px;font-size:34px;display:block}.wallet-card>span{color:#aab9d1}.wallet-card button{color:#fff;background:#ffffff18;border:1px solid #ffffff2e;border-radius:9px;align-items:center;gap:6px;margin-top:24px;padding:9px 12px;display:flex}.wallet-card button svg{width:16px}.profile-card{max-width:580px}.profile-card dl div{border-bottom:1px solid #edf0f5;justify-content:space-between;padding:14px 0;display:flex}.profile-card dt{color:#6f7b8f}.profile-card dd{font-weight:700}.status-pill{color:#128148;background:#e8f8ef;border-radius:20px;padding:5px 9px;font-size:12px}@media (width<=760px){.auth-page{grid-template-columns:1fr!important}.auth-brand{min-height:220px;padding:28px}.auth-brand h2{font-size:28px}.auth-panel{padding:34px 22px}.welcome-copy h1,.auth-form h1{font-size:34px}.wallet-card>strong{font-size:25px}.customer-dashboard main{padding-top:35px}}:root{color:#0f172a;font-synthesis:none;--navy:#0e1b38;--orange:#ff6b00;--muted:#64748b;--border:#e2e8f0;background:#f8fafc;font-family:Inter,system-ui,sans-serif}*{box-sizing:border-box}body{min-width:320px;margin:0}button{font:inherit}.app-shell{min-height:100vh}.sidebar{border-right:1px solid var(--border);z-index:2;background:#fff;flex-direction:column;width:244px;padding:28px 18px;display:flex;position:fixed;inset:0 auto 0 0}.brand{color:var(--navy);align-items:center;gap:10px;margin:0 10px 42px;font-size:20px;font-weight:800;display:flex}.brand>span:last-child span{color:var(--orange);font-weight:500}.brand-mark{color:#fff;background:var(--navy);border-radius:11px;place-items:center;width:36px;height:36px;display:grid}.sidebar nav{gap:6px;display:grid}.sidebar nav button{color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:10px;align-items:center;gap:12px;padding:12px 14px;font-weight:600;display:flex}.sidebar nav button.active{color:#d95900;background:#fff2e8}.mode-card{border:1px solid var(--border);background:#f8fafc;border-radius:12px;align-items:flex-start;gap:10px;margin-top:auto;padding:14px;display:flex}.mode-card strong,.mode-card small{font-size:12px;display:block}.mode-card small{color:var(--muted);margin-top:3px}.pulse{background:#10b981;border-radius:50%;width:8px;height:8px;margin-top:3px;box-shadow:0 0 0 4px #d1fae5}main{max-width:1500px;margin-left:244px;padding:34px 5vw 80px}header{justify-content:space-between;align-items:center;margin-bottom:32px;display:flex}h1,h2,h3,p{margin:0}h1{letter-spacing:-.03em;font-size:28px}.eyebrow{color:#94a3b8;letter-spacing:.11em;margin-bottom:6px;font-size:11px;font-weight:700}.icon-button{border:1px solid var(--border);background:#fff;border-radius:12px;place-items:center;width:42px;height:42px;display:grid;position:relative}.dot{background:var(--orange);border:2px solid #fff;border-radius:50%;width:8px;height:8px;position:absolute;top:8px;right:8px}.hero-grid{grid-template-columns:1.35fr 1fr;gap:20px;display:grid}.balance-card{color:#fff;background:linear-gradient(135deg,#0e1b38,#1c315e);border-radius:20px;padding:28px;box-shadow:0 18px 45px #0e1b3820}.balance-top{color:#cbd5e1;justify-content:space-between;font-size:13px;display:flex}.verified{color:#a7f3d0;align-items:center;gap:5px;display:flex}.balance-card h2{letter-spacing:-.04em;margin:18px 0 6px;font-size:42px}.balance-card h2 small{font-size:22px}.balance-card h2 sup{font-size:20px}.balance-card>p{color:#94a3b8;font-size:12px}.actions{gap:12px;margin-top:30px;display:flex}.actions button{color:var(--navy);background:#fff;border:0;border-radius:12px;flex:1;justify-content:center;align-items:center;gap:8px;padding:12px;font-weight:700;display:flex}.actions button:last-child{color:#fff;background:#ffffff18}.account-card{border:1px solid var(--border);background:#fff;border-radius:20px;padding:26px}.section-title{justify-content:space-between;display:flex}.section-title svg{color:var(--orange)}.account-card h3{font-size:18px}.account-number{letter-spacing:.06em;margin-top:30px;font-size:26px;font-weight:800}.account-number button{color:var(--muted);vertical-align:middle;background:0 0;border:0}.muted{color:var(--muted);margin-top:7px;font-size:13px}.copy-note{border-top:1px solid var(--border);color:#94a3b8;margin-top:24px;padding-top:15px;font-size:11px;display:block}.section-heading{justify-content:space-between;align-items:end;margin:36px 0 16px;display:flex}.section-heading h2{font-size:20px}.product-grid{grid-template-columns:repeat(4,1fr);gap:12px;display:grid}.product{border:1px solid var(--border);text-align:left;color:var(--navy);cursor:pointer;background:#fff;border-radius:16px;align-items:center;gap:12px;padding:16px;display:flex}.product>svg{color:#94a3b8;width:16px;margin-left:auto}.product div{gap:4px;display:grid}.product strong{font-size:13px}.product small{color:var(--muted);font-size:10px}.soft{border-radius:12px;flex:0 0 42px;place-items:center;width:42px;height:42px;font-size:19px;font-weight:800;display:grid}.soft svg{width:20px}.soft.orange{color:#e65f00;background:#fff2e8}.soft.navy{color:var(--navy);background:#eaf0fb}.soft.green{color:#16895b;background:#e8f6ef}.soft.purple{color:#7e22ce;background:#f3e8ff}.text-button{color:var(--orange);background:0 0;border:0;align-items:center;font-size:12px;font-weight:700;display:flex}.transaction-list{border:1px solid var(--border);background:#fff;border-radius:16px;overflow:hidden}.transaction{border-bottom:1px solid #eef2f7;align-items:center;padding:16px 18px;display:flex}.transaction:last-child{border:0}.transaction-icon{border-radius:12px;place-items:center;width:40px;height:40px;margin-right:12px;display:grid}.transaction-icon svg{width:19px}.transaction-icon.credit{color:#16895b;background:#e8f6ef}.transaction-icon.debit{color:#d95900;background:#fff2e8}.transaction-info,.transaction-value{gap:4px;display:grid}.transaction-info strong,.transaction-value strong{font-size:13px}.transaction-info small,.transaction-value small{color:var(--muted);font-size:10px}.transaction-value{text-align:right;margin-left:auto}.transaction-value strong.credit{color:#16895b}.transaction-value .pending{color:#b7791f}.bottom-nav{display:none}@media (width<=1050px){.product-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=760px){.sidebar{display:none}main{margin:0;padding:24px 18px 100px}header{margin-bottom:24px}h1{font-size:24px}.hero-grid{grid-template-columns:1fr}.balance-card{padding:22px}.balance-card h2{font-size:36px}.account-card{padding:22px}.product-grid{grid-template-columns:1fr 1fr}.product{grid-template-columns:auto 1fr;padding:13px;display:grid}.product>svg{display:none}.bottom-nav{border-top:1px solid var(--border);z-index:4;padding:9px 5px max(9px,env(safe-area-inset-bottom));background:#fff;justify-content:space-around;display:flex;position:fixed;inset:auto 0 0}.bottom-nav button{color:#94a3b8;background:0 0;border:0;justify-items:center;gap:3px;display:grid}.bottom-nav button svg{width:20px}.bottom-nav button small{font-size:9px}.bottom-nav button.active{color:var(--orange)}}@media (width<=420px){.product-grid{grid-template-columns:1fr}.actions button{font-size:12px}.account-number{font-size:23px}}
