:root{--brand:#2563eb;--brand2:#06b6d4;--accent:#22c55e;--app-bg:#020617;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);color-scheme:light}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}body{background:var(--app-bg)}button,input,select,textarea{font:inherit}.safe-top{padding-top:calc(16px + var(--safe-top))}.safe-bottom{padding-bottom:calc(16px + var(--safe-bottom))}.app-gradient{background:radial-gradient(circle at 12% 0, color-mix(in srgb,var(--brand) 35%,transparent),transparent 30%),radial-gradient(circle at 95% 18%,color-mix(in srgb,var(--brand2) 24%,transparent),transparent 24%),linear-gradient(155deg,var(--app-bg),#0f172a 60%,#111827)}.glass{background:rgba(255,255,255,.93);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,.62);box-shadow:0 28px 80px rgba(2,6,23,.26)}.dark-glass{background:rgba(15,23,42,.78);backdrop-filter:blur(20px);border:1px solid rgba(148,163,184,.18)}.brand-bg{background:linear-gradient(135deg,var(--brand),var(--brand2))}.brand-text{color:var(--brand)}.brand-ring:focus{border-color:var(--brand);box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 16%,transparent)}.app-input{width:100%;border:1px solid #dbe4f0;border-radius:16px;background:#fff;padding:13px 14px;outline:none;transition:.2s}.app-input:focus{border-color:var(--brand);box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 14%,transparent)}.app-label{display:block;font-size:11px;font-weight:900;color:#475569;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}.btn-brand{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:16px;padding:13px 17px;background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;font-weight:900;box-shadow:0 14px 32px color-mix(in srgb,var(--brand) 25%,transparent);cursor:pointer}.btn-brand:disabled{opacity:.55;cursor:not-allowed}.btn-soft{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid #dbe4f0;border-radius:16px;padding:12px 16px;background:#fff;color:#334155;font-weight:850}.auth-switch.active{background:#fff;color:#0f172a;box-shadow:0 5px 16px rgba(15,23,42,.1)}.account-choice.active{background:color-mix(in srgb,var(--brand) 10%,white);color:var(--brand);border-color:color-mix(in srgb,var(--brand) 35%,white)}.photo-drop{border:2px dashed #cbd5e1;border-radius:22px;background:#f8fafc;min-height:180px;display:grid;place-items:center;text-align:center;padding:18px;cursor:pointer;overflow:hidden}.photo-preview{width:100%;height:240px;object-fit:cover;border-radius:18px}.bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:40;background:rgba(255,255,255,.95);backdrop-filter:blur(22px);border-top:1px solid #e2e8f0;padding-bottom:var(--safe-bottom)}.nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:9px 4px;color:#64748b;font-size:10px;font-weight:900}.nav-item.active{color:var(--brand)}.screen{display:none}.screen.active{display:block;animation:fadeUp .25s ease}.toast-host{position:fixed;z-index:120;left:14px;right:14px;top:calc(14px + var(--safe-top));display:grid;gap:8px;pointer-events:none}.toast{padding:13px 15px;border-radius:16px;background:#0f172a;color:#fff;box-shadow:0 18px 50px rgba(2,6,23,.28);animation:fadeUp .22s ease}.toast.success{background:#047857}.toast.error{background:#b91c1c}.modal-layer{position:fixed;z-index:90;inset:0;background:rgba(2,6,23,.7);backdrop-filter:blur(8px);display:none;align-items:flex-end;justify-content:center}.modal-layer.open{display:flex}.modal-sheet{width:min(680px,100%);max-height:92dvh;overflow:auto;background:#f8fafc;border-radius:30px 30px 0 0;padding-bottom:calc(20px + var(--safe-bottom));box-shadow:0 -30px 90px rgba(2,6,23,.38);animation:sheetUp .25s ease}.splash-logo{animation:pulseSoft 1.8s ease-in-out infinite}.status-pill{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}.status-active,.status-approved,.status-successful{background:#dcfce7;color:#166534}.status-pending,.status-submitted,.status-processing,.status-manual_review{background:#fef3c7;color:#92400e}.status-rejected,.status-failed,.status-suspended{background:#fee2e2;color:#991b1b}.hide-scrollbar{scrollbar-width:none}.hide-scrollbar::-webkit-scrollbar{display:none}@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes sheetUp{from{opacity:.4;transform:translateY(28px)}to{opacity:1;transform:none}}@keyframes pulseSoft{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}@media(min-width:760px){.app-frame{max-width:560px;margin:0 auto;min-height:100dvh;box-shadow:0 0 90px rgba(2,6,23,.48)}.bottom-nav{max-width:560px;margin:auto}.modal-sheet{border-radius:30px;margin-bottom:20px}}

.toast-leave{opacity:0;transform:translateY(-8px);transition:opacity .22s ease,transform .22s ease}

/* v11 complete mobile visual system */
html,body{width:100%;max-width:100%;overflow-x:hidden}body{overscroll-behavior-x:none}.app-frame,.mobile-canvas,.screen,.screen>*{max-width:100%}.mobile-canvas{background:linear-gradient(180deg,#eef5ff 0,#f8fafc 220px,#f8fafc 100%);color:#0f172a;overflow-x:hidden}.mobile-header{position:relative;overflow:hidden;min-height:208px;padding-left:20px;padding-right:20px;padding-bottom:44px;background:linear-gradient(145deg,#071427 0,color-mix(in srgb,var(--brand) 67%,#071427) 64%,color-mix(in srgb,var(--brand2) 72%,#0c263f));color:#fff;border-radius:0 0 32px 32px;box-shadow:0 22px 55px rgba(15,23,42,.20)}.header-orb{position:absolute;border-radius:50%;pointer-events:none}.header-orb-one{width:220px;height:220px;right:-105px;top:-115px;background:rgba(255,255,255,.10)}.header-orb-two{width:135px;height:135px;left:-75px;bottom:-55px;background:rgba(34,211,238,.12)}.mobile-logo{border-radius:16px!important;background:#fff!important;padding:5px!important;box-shadow:0 10px 28px rgba(2,6,23,.18)}.eyebrow-light{margin:0;font-size:9px;font-weight:950;text-transform:uppercase;letter-spacing:.13em;color:#bfdbfe}.header-label{margin:0;color:#bfdbfe;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.header-icon,.header-avatar{width:40px;height:40px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.09);color:#fff;border-radius:14px;display:grid;place-items:center;font-weight:950}.header-avatar{background:#fff;color:var(--brand);font-size:13px}.bottom-nav{left:50%;right:auto;transform:translateX(-50%);width:100%;max-width:560px;padding:7px 10px var(--safe-bottom);border-top:1px solid rgba(226,232,240,.86);box-shadow:0 -12px 38px rgba(15,23,42,.08)}.nav-item{border:0;background:transparent;min-width:0}.nav-symbol{width:30px;height:27px;border-radius:10px;display:grid;place-items:center;font-size:15px}.nav-item.active .nav-symbol{background:color-mix(in srgb,var(--brand) 11%,#fff);color:var(--brand)}
.hero-wallet,.wallet-page-hero{position:relative;overflow:hidden;padding:23px;border-radius:25px;background:linear-gradient(135deg,#0d2b50 0,color-mix(in srgb,var(--brand) 62%,#0d2b50) 55%,#0a6472);color:#fff;box-shadow:0 20px 45px rgba(15,23,42,.16)}.hero-pattern{position:absolute;inset:0;background:radial-gradient(circle at 85% 10%,rgba(255,255,255,.16),transparent 27%),linear-gradient(120deg,transparent 50%,rgba(255,255,255,.04) 50%)}.wallet-amount{font-size:clamp(28px,9vw,40px);line-height:1;font-weight:1000;letter-spacing:-1.4px;margin:7px 0 0}.hero-action{border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.12);color:#fff;border-radius:13px;padding:9px 11px;font-size:10px;font-weight:950}.hero-footer{display:flex;justify-content:space-between;gap:10px;margin-top:25px;padding-top:13px;border-top:1px solid rgba(255,255,255,.13);font-size:8px;color:#bfdbfe;font-weight:800}.metric-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.metric-card{min-width:0;padding:13px 10px;border-radius:19px;background:#fff;border:1px solid #e5eaf2;box-shadow:0 10px 30px rgba(15,23,42,.05);display:flex;align-items:center;gap:8px}.metric-icon{width:31px;height:31px;flex:0 0 31px;border-radius:11px;display:grid;place-items:center;font-size:11px;font-weight:1000}.metric-icon.success{background:#dcfce7;color:#15803d}.metric-icon.today{background:#dbeafe;color:#1d4ed8}.metric-icon.total{background:#ede9fe;color:#6d28d9}.metric-card p{margin:0;color:#94a3b8;font-size:8px;font-weight:900;text-transform:uppercase}.metric-card strong{display:block;margin-top:2px;font-size:15px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:12px}.section-heading h2{font-size:18px;line-height:1.15;font-weight:1000;letter-spacing:-.4px;margin:3px 0 0}.section-kicker{margin:0;color:var(--brand);font-size:8px;font-weight:1000;text-transform:uppercase;letter-spacing:.12em}.text-link{border:0;background:transparent;color:var(--brand);font-size:9px;font-weight:950;padding:5px}.action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:13px}.action-card{min-width:0;display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:9px;text-align:left;border:1px solid #e3e9f2;border-radius:20px;background:#fff;padding:14px 12px;color:#0f172a;box-shadow:0 9px 25px rgba(15,23,42,.04)}.action-card.action-primary{grid-column:1/-1;background:linear-gradient(135deg,#eff6ff,#f0fdff);border-color:#bfdbfe}.action-card b{color:#94a3b8}.action-card strong{display:block;font-size:10px;line-height:1.25}.action-card small{display:block;color:#7b8798;font-size:8px;line-height:1.35;margin-top:3px}.action-icon{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:#f1f5f9;color:var(--brand);font-size:16px}.action-primary .action-icon{background:var(--brand);color:#fff}.surface-card{padding:18px;border:1px solid #e5eaf2;border-radius:23px;background:#fff;box-shadow:0 10px 32px rgba(15,23,42,.05)}.activity-row,.update-row,.notification-item,.transaction-row,.service-item,.report-item{width:100%;min-width:0;border:1px solid #e8edf4!important;background:#fff!important;border-radius:16px!important;box-shadow:none!important}.activity-row{display:flex;align-items:center;gap:10px;padding:11px;text-align:left}.activity-icon,.transaction-icon{width:31px;height:31px;flex:0 0 31px;border-radius:11px;display:grid;place-items:center;background:#dcfce7;color:#15803d;font-weight:1000}.activity-row strong{display:block;font-size:9px}.activity-row small{display:block;margin-top:3px;color:#94a3b8;font-size:8px}.empty-mini{padding:18px;text-align:center;border:1px dashed #d6dee9;border-radius:15px;color:#7b8798;font-size:9px}.skeleton-line{height:11px;border-radius:999px;background:linear-gradient(90deg,#eef2f7,#f8fafc,#eef2f7);background-size:200% 100%;animation:shimmer 1.4s infinite}.skeleton-line.short{width:65%}@keyframes shimmer{to{background-position:-200% 0}}.install-banner{width:100%;display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:10px;text-align:left;border:0;border-radius:20px;padding:14px 15px;background:#071427;color:#fff}.install-banner>span{width:35px;height:35px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.09)}.install-banner strong{display:block;font-size:10px}.install-banner small{display:block;font-size:8px;color:#94a3b8;margin-top:3px}.profile-card{text-align:center;padding:25px 18px;border-radius:25px;background:linear-gradient(145deg,#071427,#0d3156);color:#fff;box-shadow:0 20px 48px rgba(15,23,42,.18)}.profile-card h2{font-size:20px;font-weight:1000;margin:12px 0 3px}.profile-card p{font-size:9px;color:#bfdbfe}.profile-detail{display:flex;justify-content:space-between;gap:15px;padding:13px 0;border-bottom:1px solid #eef2f7;font-size:9px}.profile-detail:last-child{border-bottom:0}.profile-detail span{color:#64748b}.profile-detail strong{text-align:right;overflow-wrap:anywhere}.menu-list{overflow:hidden;border:1px solid #e5eaf2;border-radius:23px;background:#fff}.menu-list>button{width:100%;display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:10px;text-align:left;padding:13px 15px;border:0;border-bottom:1px solid #eef2f7;background:#fff}.menu-list>button:last-child{border-bottom:0}.menu-list>button>span{width:35px;height:35px;border-radius:12px;display:grid;place-items:center;background:#f1f5f9}.menu-list strong{display:block;font-size:9px}.menu-list small{display:block;font-size:8px;color:#94a3b8;margin-top:2px}.menu-list b{color:#94a3b8}.version-card{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:13px 15px;border-radius:16px;background:#eef2f7;color:#64748b;font-size:8px}.version-card strong{color:#334155}.logout-button{width:100%;border:1px solid #fecaca;border-radius:16px;background:#fff1f2;color:#be123c;padding:13px;font-size:9px;font-weight:1000}.payment-method-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.payment-method{min-width:0;border:1px solid #e2e8f0;border-radius:17px;background:#fff;padding:13px 8px;text-align:center;font-size:9px;font-weight:900}.payment-method.active{border-color:var(--brand);background:#eff6ff;color:var(--brand)}.amount-input-wrap{position:relative}.quick-amounts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.quick-amounts button{border:1px solid #e2e8f0;border-radius:12px;background:#fff;padding:9px 5px;font-size:9px;font-weight:900}.payment-note,.secure-chip,.funding-status-card,.release-card,.page-error,.page-loader{border-radius:18px;padding:14px}.payment-note,.secure-chip{background:#eff6ff;border:1px solid #dbeafe;color:#1e40af;font-size:9px}.funding-status-card{background:#fff;border:1px solid #e2e8f0}.release-card{background:#f8fafc;border:1px solid #e2e8f0}.update-dot{width:8px;height:8px;border-radius:50%;background:var(--brand);flex:0 0 8px}.page-error{background:#fff1f2;border:1px solid #fecdd3;color:#9f1239}.page-loader{text-align:center;color:#64748b}.report-item,.service-item,.transaction-row,.notification-item,.update-row{overflow:hidden;overflow-wrap:anywhere}.modal-sheet{overscroll-behavior:contain}.modal-sheet>*{max-width:100%}.toast{max-width:100%;overflow-wrap:anywhere}
/* Auth refresh */
.app-gradient{position:relative;overflow:hidden;background:radial-gradient(circle at 10% 4%,color-mix(in srgb,var(--brand) 42%,transparent),transparent 28%),radial-gradient(circle at 95% 28%,color-mix(in srgb,var(--brand2) 25%,transparent),transparent 24%),linear-gradient(155deg,#020817,#07172a 62%,#0b2434)}.app-gradient:after{content:"";position:absolute;width:280px;height:280px;border-radius:50%;right:-170px;bottom:-70px;background:rgba(255,255,255,.04);pointer-events:none}.glass{position:relative;z-index:2;border-radius:28px!important;box-shadow:0 30px 80px rgba(0,0,0,.32)!important}.app-input{min-height:47px;border-radius:14px}.btn-brand,.btn-soft{min-height:46px}.photo-drop{min-height:170px;background:linear-gradient(180deg,#f8fafc,#f1f5f9)}
@media(max-width:420px){#registrationForm .grid-cols-2{grid-template-columns:1fr!important}.metric-grid{gap:6px}.metric-card{padding:11px 8px;gap:6px}.metric-icon{display:none}.metric-card strong{font-size:14px}.action-grid{grid-template-columns:1fr}.action-card.action-primary{grid-column:auto}.hero-footer{font-size:7px}.wallet-amount{font-size:31px}.surface-card{padding:15px}.mobile-header{padding-left:16px;padding-right:16px}main.px-4{padding-left:13px!important;padding-right:13px!important}.payment-method-grid{gap:6px}.payment-method{padding:11px 5px}.quick-amounts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:760px){body{background:linear-gradient(135deg,#06101f,#0c2238)}.app-frame{border-left:1px solid rgba(255,255,255,.08);border-right:1px solid rgba(255,255,255,.08)}.bottom-nav{border-radius:20px 20px 0 0}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important;transition:none!important}}

/* Patch 032 auth/login visual refinement */
.mobile-auth-visual{margin-top:22px;border:1px solid rgba(255,255,255,.12);border-radius:24px;overflow:hidden;box-shadow:0 24px 60px rgba(2,6,23,.32);max-height:220px}.mobile-auth-visual img{display:block;width:100%;height:220px;object-fit:cover;object-position:center}.glass form>div{min-width:0}.glass .app-input{min-height:48px}.glass form{scroll-margin-top:20px}@media(max-width:420px){.mobile-auth-visual{max-height:150px;border-radius:18px}.mobile-auth-visual img{height:150px}.app-input{font-size:16px}}