*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
:root{
 --blue:#011f7b;--yellow:#FFBA09;--bg:#f0f2f7;
 --text:#111;--sub:#6b7280;--border:#e5e7eb;
 --green:#059669;--red:#dc2626;--orange:#d97706;--purple:#7c3aed;
 --dark-bg:#0d1117;--dark-card:#161b22;--dark-border:#30363d;
 /* RGB channels for alpha variants (rgba can't use hex vars directly) */
 --blue-rgb:1,31,123;
 --yellow-rgb:255,186,9;
 /* Brand gradient stops — all true shades of brand blue #011f7b */
 --brand-deep:#011060;
 --brand-mid:#011f7b;
 --brand-light:#01277a;
}
html,body{height:100%;overflow-x:hidden;}
body{font-family:'Segoe UI',system-ui,sans-serif;background:var(--bg);color:var(--text);transition:background .3s,color .3s;}
body.dark{background:#0f0f0f;color:#f0f0f0;}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:translateY(0);}}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
@keyframes slideUp{from{transform:translateY(60px);opacity:0;}to{transform:translateY(0);opacity:1;}}
@keyframes pulse{0%,100%{transform:scale(1);}50%{transform:scale(1.03);}}
@keyframes shimmer{0%,100%{opacity:.75;}50%{opacity:1;}}
@keyframes spin{to{transform:rotate(360deg);}}
@keyframes paypinPop{from{opacity:0;transform:scale(.4);}to{opacity:1;transform:scale(1);}}
.view{display:none;min-height:100vh;}
.view.active{display:block;animation:fadeUp .35s ease;}
#landingView.active{display:flex;flex-direction:column;min-height:100vh;animation:fadeIn .4s ease;}
/* LOADING OVERLAY */
.loading-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:9999;display:none;align-items:center;justify-content:center;flex-direction:column;gap:14px;}
.loading-overlay.active{display:flex;animation:fadeIn .2s ease;}
.loading-spinner{width:44px;height:44px;border:4px solid rgba(255,186,9,.3);border-top-color:var(--yellow);border-radius:50%;animation:spin .8s linear infinite;}
.loading-text{color:#fff;font-size:14px;font-weight:600;}
/* HEADER */
.dash-header{background:var(--blue);padding:13px 16px;display:flex;align-items:center;gap:10px;position:sticky;top:0;z-index:200;box-shadow:0 2px 16px rgba(0,0,0,.25);}
.avatar-c{width:40px;height:40px;min-width:40px;background:var(--yellow);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:17px;font-weight:800;color:#111;flex-shrink:0;}
.hdr-info{flex:1;min-width:0;}
.hdr-name{color:var(--yellow);font-size:16px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.hdr-sub{color:rgba(255,255,255,.7);font-size:12px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.hdr-right{display:flex;align-items:center;gap:6px;flex-shrink:0;margin-left:auto;}
.role-badge{background:var(--yellow);color:#111;font-size:10px;font-weight:800;padding:4px 9px;border-radius:6px;letter-spacing:.5px;white-space:nowrap;}
.theme-btn{background:rgba(255,255,255,.12);border:1.5px solid rgba(255,255,255,.2);color:#fff;width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:13px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s;}
.theme-btn:hover{background:rgba(255,255,255,.22);transform:rotate(20deg);}
.signout-btn{background:rgba(255,255,255,.1);color:#fff;border:1.5px solid rgba(255,255,255,.2);padding:5px 10px;border-radius:7px;font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap;}
/* LANDING */
.land-hero{background:var(--blue);padding:50px 24px 38px;text-align:center;flex-shrink:0;}
.land-theme-btn{position:absolute;top:16px;right:16px;background:rgba(255,255,255,.15);border:1.5px solid rgba(255,255,255,.25);color:#fff;width:34px;height:34px;border-radius:50%;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;}
.land-hero{position:relative;}
.land-logo{width:82px;height:82px;background:var(--yellow);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 20px;font-size:36px;box-shadow:0 0 0 10px rgba(255,186,9,.16),0 0 0 22px rgba(255,186,9,.07);animation:shimmer 2.5s ease-in-out infinite;}
.land-title{color:var(--yellow);font-size:28px;font-weight:800;line-height:1.2;margin-bottom:7px;}
.land-sub{color:rgba(255,255,255,.68);font-size:11px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;margin-bottom:26px;}
.land-role-row{display:flex;gap:10px;justify-content:center;}
.land-role-btn{flex:1;max-width:175px;padding:11px 14px;border-radius:11px;border:none;font-size:14px;font-weight:700;cursor:pointer;transition:all .22s;display:flex;align-items:center;justify-content:center;gap:6px;}
.land-role-btn.active{background:var(--yellow);color:#111;box-shadow:0 4px 14px rgba(255,186,9,.4);}
.land-role-btn:not(.active){background:rgba(255,255,255,.1);color:rgba(255,255,255,.7);border:1.5px solid rgba(255,255,255,.2);}
.land-card-wrap{background:#fff;flex:1;padding:0 20px 32px;border-radius:26px 26px 0 0;margin-top:-18px;position:relative;z-index:1;transition:background .3s;}
body.dark .land-card-wrap{background:#181818;}
.auth-tab-row{display:flex;background:#f1f3f7;border-radius:11px;padding:4px;margin:26px 0 22px;transition:background .3s;}
body.dark .auth-tab-row{background:#252525;}
.auth-tab-btn{flex:1;padding:11px;border:none;background:transparent;border-radius:8px;font-size:14px;font-weight:700;cursor:pointer;color:var(--sub);transition:all .22s;}
.auth-tab-btn.active{background:var(--blue);color:#fff;}
.field-label{font-size:10px;font-weight:800;color:var(--sub);letter-spacing:.9px;text-transform:uppercase;margin-bottom:7px;display:block;}
.field-input{width:100%;padding:14px 15px;border:2px solid var(--border);border-radius:11px;font-size:16px;background:#fff;color:var(--text);transition:border .2s;}
body.dark .field-input{background:#111;color:#f0f0f0;border-color:#2a2a2a;}
.field-input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(1,31,123,.09);}
.pin-wrap{position:relative;display:flex;align-items:center;}
.pin-wrap .field-input{padding-right:46px;letter-spacing:5px;font-size:20px;}
.pw-eye{position:absolute;right:13px;background:none;border:none;font-size:16px;cursor:pointer;color:var(--sub);}
.form-group{margin-bottom:16px;}
.land-submit-btn{width:100%;padding:16px;background:var(--yellow);color:#111;border:none;border-radius:13px;font-size:16px;font-weight:800;cursor:pointer;margin-top:6px;transition:all .22s;animation:pulse 2.2s ease-in-out infinite;}
.land-submit-btn:hover{background:#e6a800;transform:scale(1.02);animation:none;}
.land-submit-btn:active{transform:scale(.98);}
.land-submit-btn:disabled{opacity:.6;cursor:not-allowed;animation:none;}
.land-features{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px;}
.feat-card{background:#f7f8fc;border-radius:13px;padding:16px 13px;text-align:center;transition:all .2s;}
body.dark .feat-card{background:#1e1e1e;}
.feat-card:hover{transform:translateY(-2px);}
.feat-ico{font-size:26px;margin-bottom:7px;}
.feat-title{font-size:12px;font-weight:700;margin-bottom:3px;}
.feat-sub{font-size:11px;color:var(--sub);line-height:1.4;}
/* BUTTONS */
.btn{width:100%;padding:14px;border:none;border-radius:12px;font-size:15px;font-weight:700;cursor:pointer;transition:all .2s;margin-bottom:10px;}
.btn-blue{background:var(--blue);color:#fff;}
.btn-blue:hover{opacity:.88;transform:translateY(-1px);}
.btn-yellow{background:var(--yellow);color:#111;}
.btn-yellow:hover{background:#e6a800;}
.btn-outline{background:transparent;border:2px solid var(--blue);color:var(--blue);}
body.dark .btn-outline{border-color:var(--yellow);color:var(--yellow);}
.btn:active{transform:scale(.98);}
.btn:disabled{opacity:.5;cursor:not-allowed;}
.btn-sm{padding:8px 13px;font-size:12px;font-weight:700;border-radius:8px;border:none;cursor:pointer;transition:all .2s;}
.btn-sm-blue{background:var(--blue);color:#fff;}
.btn-sm-green{background:var(--green);color:#fff;}
.btn-sm-ghost{background:rgba(100,100,100,.12);color:var(--sub);border-radius:8px;padding:8px 13px;font-size:12px;font-weight:600;cursor:pointer;border:none;}
/* MESSAGES */
.msg-ok{background:#d1fae5;border-left:3px solid var(--green);padding:10px 12px;border-radius:7px;font-size:13px;color:#065f46;margin:8px 0;animation:fadeUp .22s ease;}
.msg-err{background:#fee2e2;border-left:3px solid var(--red);padding:10px 12px;border-radius:7px;font-size:13px;color:#991b1b;margin:8px 0;animation:fadeUp .22s ease;}
.msg-info{background:#dbeafe;border-left:3px solid #3b82f6;padding:10px 12px;border-radius:7px;font-size:13px;color:#1e40af;margin:8px 0;}
.msg-warn{background:#fef3c7;border-left:3px solid var(--orange);padding:10px 12px;border-radius:7px;font-size:13px;color:#92400e;margin:8px 0;}
body.dark .msg-ok{background:rgba(5,150,105,.15);color:#6ee7b7;}
body.dark .msg-err{background:rgba(220,38,38,.15);color:#fca5a5;}
body.dark .msg-info{background:rgba(59,130,246,.15);color:#93c5fd;}
body.dark .msg-warn{background:rgba(217,119,6,.15);color:#fcd34d;}
.wcard{background:#fff;border-radius:15px;padding:16px;box-shadow:0 2px 10px rgba(0,0,0,.06);margin-bottom:11px;transition:background .3s;}
body.dark .wcard{background:#1c1c1c;}
/* DISBURSEMENT STAGE BAR */
.dis-stage-bar{display:flex;align-items:flex-start;gap:0;margin:12px 0;}
.stage-step{flex:1;text-align:center;position:relative;}
.stage-step::after{content:'';position:absolute;top:9px;left:50%;width:100%;height:2px;background:var(--border);z-index:0;}
.stage-step:last-child::after{display:none;}
.stage-dot{width:18px;height:18px;border-radius:50%;border:2px solid var(--border);background:#fff;margin:0 auto 4px;position:relative;z-index:1;transition:all .3s;}
body.dark .stage-dot{background:#1c1c1c;}
.stage-dot.done{background:var(--green);border-color:var(--green);}
.stage-dot.active{background:var(--yellow);border-color:var(--yellow);}
body.dark .stage-dot.done{background:var(--green);border-color:var(--green);}
body.dark .stage-dot.active{background:var(--yellow);border-color:var(--yellow);}
.stage-label{font-size:9px;color:var(--sub);font-weight:600;text-transform:uppercase;}
/* RECEIPT */
.receipt-wrap{background:linear-gradient(135deg,var(--blue) 0%,#023396 100%);border-radius:16px;padding:22px;color:#fff;text-align:center;margin:14px 0;}
.receipt-logo{font-size:28px;margin-bottom:6px;}
.receipt-title{font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;opacity:.8;margin-bottom:16px;}
.receipt-amount{font-size:36px;font-weight:800;color:var(--yellow);margin-bottom:4px;}
.receipt-plan{font-size:13px;opacity:.8;margin-bottom:16px;}
.receipt-row{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.12);font-size:13px;}
.receipt-row:last-of-type{border-bottom:none;}
.receipt-lbl{opacity:.7;}
.receipt-val{font-weight:700;}
.receipt-ref{background:rgba(255,255,255,.12);border-radius:8px;padding:10px;margin-top:12px;font-family:monospace;font-size:13px;letter-spacing:1px;font-weight:700;color:var(--yellow);}
/* AUDIT LOG */
.audit-item{padding:11px 0;border-bottom:1px solid var(--border);}
body.dark .audit-item{border-color:#2a2a2a;}
.audit-item:last-child{border-bottom:none;}
.audit-action{font-size:11px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;margin-bottom:3px;}
.audit-action.deposit{color:#2563eb;}
.audit-action.payout{color:var(--orange);}
.audit-action.approve{color:var(--green);}
.audit-action.reject{color:var(--red);}
.audit-action.elevate{color:var(--purple);}
.audit-action.login{color:var(--sub);}
.audit-action.delete{color:var(--red);}
.audit-action.flag{color:var(--red);}
.audit-desc{font-size:12px;color:var(--sub);}
.audit-time{font-size:11px;color:var(--sub);margin-top:2px;}
/* ANALYTICS */
.analytics-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px;}
.analytics-card{background:#fff;border-radius:13px;padding:14px;box-shadow:0 2px 8px rgba(0,0,0,.06);transition:background .3s;}
body.dark .analytics-card{background:#1c1c1c;}
.ac-label{font-size:10px;font-weight:700;color:var(--sub);text-transform:uppercase;letter-spacing:.7px;margin-bottom:6px;}
.ac-value{font-size:22px;font-weight:800;color:var(--blue);}
body.dark .ac-value{color:var(--yellow);}
.ac-sub{font-size:11px;color:var(--sub);margin-top:3px;}
.ac-value.green{color:var(--green);}
.ac-value.red{color:var(--red);}
.ac-value.orange{color:var(--orange);}
.bar-chart-wrap{background:#fff;border-radius:13px;padding:14px;box-shadow:0 2px 8px rgba(0,0,0,.06);margin-bottom:14px;transition:background .3s;}
body.dark .bar-chart-wrap{background:#1c1c1c;}
.bar-chart-title{font-size:13px;font-weight:700;color:var(--blue);margin-bottom:14px;}
body.dark .bar-chart-title{color:var(--yellow);}
.bar-chart{display:flex;align-items:flex-end;gap:6px;height:80px;}
.bar-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;}
.bar{width:100%;background:var(--blue);border-radius:4px 4px 0 0;transition:height .5s ease;min-height:4px;}
body.dark .bar{background:var(--yellow);}
.bar-label{font-size:9px;color:var(--sub);text-align:center;}
/* CUSTOMER */
.plan-tabs-bar{background:#fff;border-bottom:1px solid var(--border);padding:9px 13px;overflow-x:auto;white-space:nowrap;display:flex;gap:7px;scrollbar-width:none;transition:background .3s;}
.plan-tabs-bar::-webkit-scrollbar{display:none;}
body.dark .plan-tabs-bar{background:#151515;border-color:#2a2a2a;}
.plan-tab{display:inline-flex;align-items:center;gap:5px;padding:7px 14px;border-radius:50px;border:2px solid var(--border);font-size:13px;font-weight:600;cursor:pointer;transition:all .22s;white-space:nowrap;background:#fff;color:var(--sub);}
body.dark .plan-tab{background:#2a2a2a;border-color:#444;color:#aaa;}
.plan-tab.active{background:var(--blue);color:#fff;border-color:var(--blue);}
body.dark .plan-tab.active{background:var(--yellow);color:#111;border-color:var(--yellow);}
.plan-tab.add-tab{border-color:var(--yellow);color:var(--yellow);background:transparent;}
.plan-tab.overdue-tab{border-color:var(--orange);}
.bal-hero{background:var(--blue);border-radius:18px;padding:20px;margin:11px 13px;position:relative;overflow:hidden;}
.bal-hero::after{content:'';position:absolute;right:-20px;top:-20px;width:120px;height:120px;background:rgba(255,255,255,.04);border-radius:50%;}
.bal-lbl{color:rgba(255,255,255,.6);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;margin-bottom:5px;display:flex;align-items:center;gap:8px;}
.eye-btn{background:none;border:none;color:rgba(255,255,255,.6);font-size:14px;cursor:pointer;}
.bal-amt{color:var(--yellow);font-size:32px;font-weight:800;margin-bottom:4px;letter-spacing:-1px;}
.bal-target{color:rgba(255,255,255,.55);font-size:12px;margin-bottom:12px;}
.prog-bar{background:rgba(255,255,255,.16);border-radius:4px;height:5px;margin-bottom:9px;overflow:hidden;}
.prog-fill{height:100%;background:var(--yellow);border-radius:4px;transition:width .6s ease;}
.bal-footer{display:flex;justify-content:space-between;align-items:center;}
.bal-pct{color:rgba(255,255,255,.55);font-size:11px;}
.bal-badge{padding:3px 11px;border-radius:50px;font-size:10px;font-weight:700;letter-spacing:.5px;}
.badge-active{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.3);}
.badge-done{background:var(--yellow);color:#111;}
.badge-overdue{background:rgba(217,119,6,.3);color:#fcd34d;border:1px solid rgba(217,119,6,.5);}
.overdue-banner{background:linear-gradient(135deg,#92400e,#b45309);border-radius:11px;padding:12px 14px;margin:0 13px 10px;display:flex;align-items:center;gap:10px;animation:fadeUp .3s ease;}
.overdue-banner-icon{font-size:20px;flex-shrink:0;}
.overdue-banner-text{font-size:12px;font-weight:600;color:#fff;}
.overdue-banner-count{font-size:18px;font-weight:800;color:var(--yellow);}
.sched-row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--border);}
body.dark .sched-row{border-color:#2a2a2a;}
.sched-row:last-child{border-bottom:none;}
.sched-label{font-size:12px;color:var(--sub);}
.sched-val{font-size:13px;font-weight:700;}
.sched-val.ok{color:var(--green);}
.sched-val.warn{color:var(--orange);}
.sched-val.bad{color:var(--red);}
.info-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 13px;margin-bottom:11px;}
.icard{background:#fff;border-radius:12px;padding:13px;box-shadow:0 2px 7px rgba(0,0,0,.05);transition:all .22s,background .3s;}
body.dark .icard{background:#1c1c1c;}
.icard-lbl{color:var(--sub);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;margin-bottom:5px;}
.icard-val{color:var(--blue);font-size:14px;font-weight:700;}
body.dark .icard-val{color:var(--yellow);}
.cust-btns{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:0 13px;margin-bottom:11px;}
.cbtn{padding:12px;border-radius:11px;border:none;font-size:13px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:5px;transition:all .2s;}
.cbtn:hover{transform:translateY(-1px);}
.cbtn:active{transform:scale(.97);}
.cbtn-wd{background:#fee2e2;color:var(--red);}
.cbtn-del{background:#f3f4f6;color:#374151;border:2px solid var(--border);}
body.dark .cbtn-wd{background:rgba(220,38,38,.18);}
body.dark .cbtn-del{background:#222;border-color:#333;color:#aaa;}
.tx-section{background:#fff;border-radius:15px;padding:16px;margin:0 13px 22px;box-shadow:0 2px 7px rgba(0,0,0,.05);transition:background .3s;}
body.dark .tx-section{background:#1c1c1c;}
.tx-title{font-size:15px;font-weight:700;color:var(--blue);margin-bottom:13px;}
body.dark .tx-title{color:var(--yellow);}
.tx-row{display:flex;align-items:center;gap:11px;padding:10px 0;border-bottom:1px solid var(--border);animation:fadeUp .22s ease;}
.tx-row:last-child{border-bottom:none;}
body.dark .tx-row{border-color:#2a2a2a;}
.tx-ico{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0;font-weight:900;}
.tx-ico-g{background:#d1fae5;color:#065f46;}
.tx-ico-r{background:#fee2e2;color:#991b1b;}
body.dark .tx-ico-g{background:#064e3b;color:#6ee7b7;}
body.dark .tx-ico-r{background:#450a0a;color:#fca5a5;}
.tx-body{flex:1;min-width:0;}
.tx-name{font-size:13px;font-weight:700;}
.tx-dt{font-size:11px;color:var(--sub);margin-top:2px;}
.tx-ref{font-size:10px;color:var(--sub);font-family:monospace;}
.tx-amt-g{color:var(--green);font-size:13px;font-weight:700;white-space:nowrap;}
.tx-amt-r{color:var(--red);font-size:13px;font-weight:700;white-space:nowrap;}
.tx-empty{text-align:center;padding:28px;color:var(--sub);font-size:13px;}
.no-plan{text-align:center;padding:65px 24px;animation:fadeUp .4s ease;}
.no-plan-ico{font-size:44px;margin-bottom:12px;}
/* REP */
.rep-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:11px 13px 0;}
.stat-dark{background:var(--blue);border-radius:14px;padding:16px;transition:transform .2s;}
.stat-dark:hover{transform:translateY(-2px);}
.stat-dark .sl{color:rgba(255,255,255,.6);font-size:10px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;margin-bottom:7px;}
.stat-dark .sa{color:var(--yellow);font-size:19px;font-weight:800;}
.stat-dark .ss{color:rgba(255,255,255,.5);font-size:11px;margin-top:3px;}
.stat-light{background:#fff;border-radius:14px;padding:16px;box-shadow:0 2px 7px rgba(0,0,0,.06);transition:all .22s,background .3s;}
body.dark .stat-light{background:#1c1c1c;}
.stat-light:hover{transform:translateY(-2px);}
.stat-light .sl{color:var(--sub);font-size:10px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;margin-bottom:7px;}
.stat-light .sa{color:var(--blue);font-size:19px;font-weight:800;}
body.dark .stat-light .sa{color:var(--yellow);}
.stat-light .ss{color:var(--sub);font-size:11px;margin-top:3px;}
.search-card{background:#fff;border-radius:15px;padding:16px;margin:11px 13px;box-shadow:0 2px 7px rgba(0,0,0,.06);transition:background .3s;}
body.dark .search-card{background:#1c1c1c;}
.search-card-title{font-size:15px;font-weight:700;color:var(--blue);margin-bottom:11px;}
body.dark .search-card-title{color:var(--yellow);}
.search-row{display:flex;gap:8px;}
.search-inp{flex:1;padding:12px 14px;border:2px solid var(--border);border-radius:10px;font-size:15px;background:#fff;color:var(--text);transition:border .2s;}
body.dark .search-inp{background:#111;color:#f0f0f0;border-color:#2a2a2a;}
.search-inp:focus{outline:none;border-color:var(--blue);}
.search-btn{background:var(--yellow);color:#111;border:none;padding:12px 18px;border-radius:10px;font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap;transition:all .2s;}
.search-btn:hover{background:#e6a800;}
.cust-result-card{background:#fff;border-radius:15px;padding:16px;margin:0 13px 11px;box-shadow:0 2px 7px rgba(0,0,0,.06);animation:fadeUp .28s ease;transition:background .3s;}
body.dark .cust-result-card{background:#1c1c1c;}
.crc-top{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.crc-av{width:40px;height:40px;background:var(--blue);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px;font-weight:800;flex-shrink:0;}
.crc-nm{font-size:14px;font-weight:700;}
.crc-ph{color:var(--sub);font-size:11px;margin-top:1px;}
.plan-sel-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:var(--sub);margin-bottom:6px;}
.plan-sel-dd{width:100%;padding:11px 12px;border:2px solid var(--border);border-radius:10px;font-size:14px;background:#fff;color:var(--text);cursor:pointer;transition:border .2s;}
body.dark .plan-sel-dd{background:#111;color:#f0f0f0;border-color:#2a2a2a;}
.bt-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--border);}
body.dark .bt-row{border-color:#2a2a2a;}
.bt-lbl{color:var(--sub);font-size:13px;}
.bt-val{color:var(--blue);font-size:14px;font-weight:700;}
body.dark .bt-val{color:var(--yellow);}
.bt-val-s{color:var(--sub);font-size:14px;font-weight:700;}
/* ── SAVE MONEY (deposit) button — green, safe ── */
.collect-btn{width:100%;background:var(--green);color:#fff;border:none;padding:13px;border-radius:10px;font-size:14px;font-weight:700;cursor:pointer;margin-top:12px;display:flex;align-items:center;justify-content:center;gap:6px;transition:all .2s;box-shadow:0 3px 10px rgba(5,150,105,.25);}
.collect-btn:hover{background:#047857;transform:translateY(-1px);}
.collect-btn:active{transform:scale(.97);}
/* ── WITHDRAW MONEY button — bold red/orange, clearly distinct ── */
.cbtn-wd{background:linear-gradient(135deg,#dc2626,#b91c1c);color:#fff;border:none;box-shadow:0 3px 10px rgba(220,38,38,.3);}
.cbtn-wd:hover{background:linear-gradient(135deg,#b91c1c,#991b1b);transform:translateY(-1px);}
body.dark .cbtn-wd{background:linear-gradient(135deg,#7f1d1d,#991b1b);color:#fca5a5;box-shadow:0 3px 10px rgba(220,38,38,.2);}
.dis-card{background:#fff;border-radius:13px;padding:14px;box-shadow:0 2px 7px rgba(0,0,0,.06);margin-bottom:9px;animation:fadeUp .28s ease;transition:background .3s;}
body.dark .dis-card{background:#1c1c1c;}
.dis-type{font-size:11px;font-weight:700;color:var(--sub);text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px;}
.dis-amt{font-size:19px;font-weight:800;color:var(--blue);margin-bottom:4px;}
body.dark .dis-amt{color:var(--yellow);}
.dis-reason{font-size:12px;color:var(--sub);margin-bottom:11px;}
.dis-acts{display:grid;grid-template-columns:1fr 1fr;gap:7px;}
/* ADMIN */
.admin-wrap{background:var(--dark-bg);min-height:100vh;padding-bottom:40px;}
.admin-hdr{background:var(--dark-card);border-bottom:1px solid var(--dark-border);padding:13px 15px;display:flex;align-items:center;gap:11px;position:sticky;top:0;z-index:200;}
.admin-logo{width:42px;height:42px;min-width:42px;background:var(--yellow);border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0;}
.admin-hdr-info{flex:1;}
.admin-hdr-title{color:var(--yellow);font-size:12px;font-weight:800;letter-spacing:1.3px;text-transform:uppercase;}
.admin-hdr-sub{color:#8b949e;font-size:10px;margin-top:1px;}
.admin-stats-pill{background:rgba(255,255,255,.07);border:1px solid var(--dark-border);border-radius:7px;padding:5px 10px;display:flex;align-items:center;gap:5px;font-size:12px;font-weight:700;color:#e6edf3;}
.admin-exit-btn{background:rgba(255,255,255,.07);border:1px solid var(--dark-border);color:#e6edf3;padding:6px 12px;border-radius:7px;font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap;}
.admin-exit-btn:hover{background:rgba(255,255,255,.12);}
.admin-tabs-row{display:flex;gap:5px;padding:12px 13px 0;overflow-x:auto;scrollbar-width:none;position:sticky;top:70px;z-index:150;background:var(--dark-bg);}
.admin-tabs-row::-webkit-scrollbar{display:none;}
.admin-tab{padding:9px 12px;border-radius:9px;border:none;font-size:12px;font-weight:700;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:5px;white-space:nowrap;flex-shrink:0;}
.admin-tab.active{background:var(--yellow);color:#111;}
.admin-tab:not(.active){background:rgba(255,255,255,.05);color:#8b949e;border:1px solid var(--dark-border);}
.admin-tab:hover:not(.active){background:rgba(255,255,255,.09);}
.admin-tab-content{display:none;padding:13px;}
.admin-tab-content.active{display:block;animation:fadeUp .28s ease;}
.admin-sub-toggle{display:flex;gap:7px;margin-bottom:13px;}
.admin-sub-btn{flex:1;padding:10px 9px;border-radius:9px;border:none;font-size:12px;font-weight:700;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:5px;}
.admin-sub-btn.active{background:var(--blue);color:var(--yellow);}
.admin-sub-btn:not(.active){background:rgba(255,255,255,.05);color:#8b949e;border:1px solid var(--dark-border);}
.admin-search-row{display:flex;gap:7px;margin-bottom:13px;}
.admin-inp{flex:1;padding:12px 14px;border:1px solid var(--dark-border);border-radius:9px;font-size:14px;background:rgba(255,255,255,.05);color:#e6edf3;transition:border .2s;}
.admin-inp::placeholder{color:#8b949e;}
.admin-inp:focus{outline:none;border-color:var(--yellow);}
.admin-search-btn{background:var(--yellow);color:#111;border:none;padding:12px 18px;border-radius:9px;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;}
.admin-search-btn:hover{background:#e6a800;}
.admin-section-lbl{font-size:10px;font-weight:700;color:#8b949e;letter-spacing:1px;text-transform:uppercase;margin:14px 0 9px;}
.elevate-card{background:rgba(255,255,255,.04);border:1px solid var(--dark-border);border-radius:11px;padding:13px;margin-bottom:14px;}
.elevate-title{color:#8b949e;font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-bottom:9px;}
.agent-card{background:rgba(255,255,255,.04);border:1px solid var(--dark-border);border-radius:11px;padding:13px;margin-bottom:9px;display:flex;justify-content:space-between;align-items:center;transition:background .2s;animation:fadeUp .22s ease;}
.agent-card:hover{background:rgba(255,255,255,.07);}
.agent-card-name{color:#e6edf3;font-size:14px;font-weight:700;margin-bottom:2px;}
body:not(.dark) .agent-card-name{color:#111;}
.agent-card-sub{color:#8b949e;font-size:11px;}
body:not(.dark) .agent-card-sub{color:#6b7280;}
.agent-card-id{color:var(--yellow);font-size:17px;font-weight:800;font-family:monospace;}
.gen-tok-btn{width:100%;background:var(--yellow);color:#111;border:none;padding:15px;border-radius:11px;font-size:14px;font-weight:800;cursor:pointer;margin-bottom:18px;display:flex;align-items:center;justify-content:center;gap:7px;transition:all .2s;}
.gen-tok-btn:hover{background:#e6a800;}
.tok-row{background:rgba(255,255,255,.04);border:1px solid var(--dark-border);border-radius:9px;padding:13px 14px;margin-bottom:7px;display:flex;justify-content:space-between;align-items:center;animation:fadeUp .2s ease;}
.tok-val{color:#e6edf3;font-size:13px;font-weight:700;font-family:monospace;letter-spacing:.5px;}
.tok-used{background:rgba(255,255,255,.07);color:#8b949e;font-size:10px;font-weight:700;padding:3px 9px;border-radius:5px;text-transform:uppercase;}
.tok-active{background:rgba(5,150,105,.18);color:#6ee7b7;font-size:10px;font-weight:700;padding:3px 9px;border-radius:5px;text-transform:uppercase;}
.adr-profile{background:rgba(255,255,255,.04);border:1px solid var(--dark-border);border-radius:13px;padding:15px;margin-bottom:11px;display:flex;justify-content:space-between;align-items:flex-start;animation:fadeUp .28s ease;}
.adr-name{color:#e6edf3;font-size:17px;font-weight:700;margin-bottom:3px;}
.adr-phone{color:#8b949e;font-size:12px;margin-bottom:3px;}
.adr-since{color:#8b949e;font-size:11px;}
.adr-cust-badge{background:rgba(1,31,123,.55);color:var(--yellow);font-size:10px;font-weight:800;padding:4px 10px;border-radius:6px;white-space:nowrap;}
.adr-plan-card{background:rgba(255,255,255,.04);border:1px solid var(--dark-border);border-radius:13px;padding:15px;margin-bottom:9px;animation:fadeUp .28s ease;}
.adr-plan-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:3px;}
.adr-plan-name{color:#e6edf3;font-size:15px;font-weight:700;}
.adr-plan-bal{color:var(--yellow);font-size:15px;font-weight:800;}
.adr-plan-of{color:#8b949e;font-size:11px;margin-top:1px;text-align:right;}
.adr-plan-meta{color:#8b949e;font-size:11px;margin-bottom:11px;}
.adr-plan-tx{display:flex;justify-content:space-between;align-items:center;padding:6px 0;border-top:1px solid var(--dark-border);}
.adr-tx-info{color:#8b949e;font-size:11px;}
.adr-tx-green{color:var(--green);font-size:12px;font-weight:700;}
.adr-tx-red{color:var(--red);font-size:12px;font-weight:700;}
.adr-elevate-section{background:rgba(255,186,9,.05);border:1px solid rgba(255,186,9,.18);border-radius:11px;padding:13px;margin-top:7px;animation:fadeUp .28s ease;}
.adr-elevate-label{color:#8b949e;font-size:11px;margin-bottom:9px;}
.adr-elevate-row{display:flex;gap:7px;}
.aar-wrap{background:rgba(255,255,255,.04);border:1px solid var(--dark-border);border-radius:13px;padding:15px;animation:fadeUp .28s ease;}
.aar-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px;}
.aar-name{color:#e6edf3;font-size:19px;font-weight:700;margin-bottom:3px;}
.aar-phone{color:#8b949e;font-size:12px;}
.aar-id{color:var(--yellow);font-size:24px;font-weight:800;font-family:monospace;}
.aar-stats{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:14px;}
.aar-stat{background:rgba(0,0,0,.25);border-radius:9px;padding:12px;}
.aar-stat-lbl{color:#8b949e;font-size:9px;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-bottom:6px;}
.aar-stat-green{color:var(--green);font-size:19px;font-weight:800;}
.aar-stat-red{color:var(--red);font-size:19px;font-weight:800;}
.aar-score-row{display:flex;align-items:center;justify-content:space-between;background:rgba(0,0,0,.25);border-radius:9px;padding:12px;margin-bottom:14px;}
.aar-score-lbl{color:#8b949e;font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-bottom:4px;}
.aar-score-val{font-size:24px;font-weight:800;}
.aar-score-sub{color:#8b949e;font-size:10px;}
.aar-audit-title{color:#8b949e;font-size:12px;margin-bottom:9px;}
.aar-audit-item{padding:9px 0;border-top:1px solid var(--dark-border);}
.aar-audit-type{font-size:10px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;margin-bottom:2px;}
.aar-audit-type.deposit{color:#58a6ff;}
.aar-audit-type.approve{color:var(--green);}
.aar-audit-desc{color:#8b949e;font-size:11px;}
.fraud-flag-card{background:rgba(220,38,38,.1);border:1px solid rgba(220,38,38,.3);border-radius:11px;padding:13px;margin-bottom:9px;animation:fadeUp .22s ease;}
.ff-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;}
.ff-type{color:var(--red);font-size:11px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;}
.ff-time{color:#8b949e;font-size:10px;}
.ff-desc{color:#fca5a5;font-size:12px;}
/* MODAL */
.modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:1000;align-items:flex-end;justify-content:center;}
.modal.active{display:flex;animation:fadeIn .2s ease;}
.msheet{background:#fff;border-radius:20px 20px 0 0;padding:18px 17px 38px;width:100%;max-width:480px;max-height:90vh;overflow-y:auto;animation:slideUp .28s ease;}
body.dark .msheet{background:#181818;}
.m-handle{width:36px;height:4px;background:var(--border);border-radius:2px;margin:0 auto 16px;}
body.dark .m-handle{background:#333;}
.m-title{font-size:19px;font-weight:800;margin-bottom:16px;color:var(--blue);}
body.dark .m-title{color:var(--yellow);}
.m-close{position:absolute;top:17px;right:15px;background:none;border:none;font-size:21px;cursor:pointer;color:var(--sub);}
.form-lbl{display:block;font-size:12px;font-weight:700;margin-bottom:6px;color:var(--text);}
body.dark .form-lbl{color:#d0d0d0;}
.form-inp{width:100%;padding:12px 14px;border:2px solid var(--border);border-radius:10px;font-size:15px;background:#fff;color:var(--text);transition:border .2s;}
body.dark .form-inp{background:#111;color:#f0f0f0;border-color:#2a2a2a;}
.form-inp:focus{outline:none;border-color:var(--blue);}
.mform-group{margin-bottom:14px;}
.agentid-card{background:var(--blue);border-radius:13px;padding:20px;text-align:center;margin:16px 0;}
.agentid-lbl{color:rgba(255,255,255,.75);font-size:10px;text-transform:uppercase;letter-spacing:1px;margin-bottom:5px;}
.agentid-val{color:var(--yellow);font-size:34px;font-weight:800;letter-spacing:4px;font-family:monospace;}
.mile-body{text-align:center;padding:10px 0;}
.mile-ico{font-size:46px;margin-bottom:10px;}
.mile-title{font-size:20px;font-weight:800;color:var(--blue);margin-bottom:7px;}
body.dark .mile-title{color:var(--yellow);}
.mile-msg{font-size:13px;color:var(--sub);margin-bottom:20px;line-height:1.6;}

.tx-hist-filters{background:#fff;border-bottom:1px solid var(--border);padding:10px 13px;display:flex;gap:8px;position:sticky;top:70px;z-index:100;}
body.dark .tx-hist-filters{background:#151515;border-color:#2a2a2a;}
.tx-hist-select{flex:1;padding:9px 11px;border:2px solid var(--border);border-radius:9px;font-size:13px;background:#fff;color:var(--text);}
body.dark .tx-hist-select{background:#1c1c1c;color:#f0f0f0;border-color:#333;}
.tx-hist-empty{text-align:center;padding:48px 24px;color:var(--sub);font-size:14px;}
.tx-full-row{background:#fff;border-radius:12px;padding:12px 14px;margin-bottom:8px;box-shadow:0 2px 6px rgba(0,0,0,.05);display:flex;align-items:center;gap:11px;}
body.dark .tx-full-row{background:#1c1c1c;box-shadow:none;border:1px solid #2a2a2a;}
.section-heading{font-size:14px;font-weight:700;color:var(--blue);margin-bottom:11px;}
body.dark .section-heading{color:var(--yellow);}
.tx-viewall{background:none;border:none;color:var(--blue);font-size:13px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:4px;}
body.dark .tx-viewall{color:var(--yellow);}
.audit-search-row{display:flex;gap:7px;margin-bottom:13px;}
.verify-section{display:none;}
.verify-code-inp{width:100%;padding:16px;border:2px solid var(--border);border-radius:11px;font-size:24px;text-align:center;letter-spacing:8px;font-weight:800;background:#fff;color:var(--text);}
body.dark .verify-code-inp{background:#111;color:#f0f0f0;border-color:#2a2a2a;}

.footer{padding:28px 18px;text-align:center;font-size:11px;color:var(--sub);cursor:pointer;user-select:none;}
.footer:hover{color:var(--blue);}

/* ── BOTTOM NAV ── */
.bnav{position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1.5px solid var(--border);display:none;align-items:stretch;z-index:400;height:60px;max-width:480px;margin:0 auto;}
body.dark .bnav{background:#111;border-color:#2a2a2a;}
.bnav.visible{display:flex;}
.bnav-tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:none;background:transparent;cursor:pointer;padding:6px 0;color:var(--sub);font-size:10px;font-weight:700;letter-spacing:.3px;transition:color .18s;-webkit-tap-highlight-color:transparent;}
.bnav-tab svg{flex-shrink:0;}
.bnav-tab.active{color:var(--blue);}
body.dark .bnav-tab.active{color:var(--yellow);}
.bnav-tab.active svg{stroke:var(--blue);}
body.dark .bnav-tab.active svg{stroke:var(--yellow);}

/* ── SUB-PAGES (hidden by default, fullscreen overlay) ── */
.subpage{display:none;position:fixed;inset:0;background:var(--bg);z-index:350;overflow-y:auto;-webkit-overflow-scrolling:touch;}
.subpage.active{display:block;}
body.dark .subpage{background:#0f0f0f;}

/* ── PROFILE PAGE STYLES ── */
.profile-wrap{padding:16px 13px 80px;}
.profile-card{background:#fff;border-radius:15px;padding:16px;box-shadow:0 2px 8px rgba(0,0,0,.06);margin-bottom:13px;}
body.dark .profile-card{background:#1c1c1c;}
.profile-card-title{font-size:14px;font-weight:700;color:var(--blue);margin-bottom:13px;display:flex;align-items:center;gap:7px;}
body.dark .profile-card-title{color:var(--yellow);}
.profile-row{display:flex;justify-content:space-between;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--border);}
body.dark .profile-row{border-color:#2a2a2a;}
.profile-row:last-child{border-bottom:none;}
.profile-lbl{font-size:11px;font-weight:700;color:var(--sub);text-transform:uppercase;letter-spacing:.5px;flex-shrink:0;margin-right:12px;}
.profile-val{font-size:13px;font-weight:600;color:var(--text);text-align:right;word-break:break-all;}
body.dark .profile-val{color:#f0f0f0;}

/* ── THEME SELECTOR ── */
.theme-selector{display:flex;gap:8px;margin-top:4px;}
.theme-opt{flex:1;padding:10px 6px;border:2px solid var(--border);border-radius:10px;background:#fff;color:var(--sub);font-size:12px;font-weight:700;cursor:pointer;text-align:center;transition:all .2s;}
body.dark .theme-opt{background:#1c1c1c;border-color:#333;color:#aaa;}
.theme-opt.active{border-color:var(--blue);color:var(--blue);background:rgba(1,31,123,.06);}
body.dark .theme-opt.active{border-color:var(--yellow);color:var(--yellow);background:rgba(255,186,9,.08);}

/* ── PAYMENT PIN SETUP MODAL (post-registration) ── */
.paypin-setup-wrap{text-align:center;padding:10px 0 4px;}
.paypin-setup-ico{width:56px;height:56px;background:rgba(1,31,123,.1);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;}
body.dark .paypin-setup-ico{background:rgba(255,186,9,.12);}

/* NOTE: admin-portal theming (fraud-flag-card, tok-row, adr-*, audit-*, etc.)
   is fully handled by css/admin.css via :root + body.light-mode. The old
   body:not(.dark) overrides that used to live here belonged to the legacy
   single-SPA admin (which used the .dark convention) and conflicted with
   admin.css's .light-mode convention, forcing white/light backgrounds with
   unreadable text on admin's dark theme. Removed.
body:not(.dark) .adr-elevate-section{background:rgba(255,186,9,.08);border-color:rgba(255,186,9,.3);}


.mini-cal-wrap{touch-action:pan-y;}
.mini-cal-hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:6px;}
.mini-cal-wrap{touch-action:pan-y;}
.mini-cal-month-lbl{font-size:15px;font-weight:800;color:var(--text);flex:1;text-align:center;}
body.dark .mini-cal-month-lbl{color:#f0f0f0;}
.cal-nav-btn{background:var(--border);border:none;color:var(--text);cursor:pointer;width:30px;height:30px;min-width:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;padding:0;font-size:22px;line-height:1;font-family:system-ui,sans-serif;transition:background .18s;}
.cal-nav-btn:hover{background:#d1d5db;}
body.dark .cal-nav-btn{color:#f0f0f0;background:#2a2a2a;}
body.dark .cal-nav-btn:hover{background:#3a3a3a;}
/* Calendar table — border-spacing controls gap between day cells */
.mini-cal-table{width:100%;border-collapse:separate;border-spacing:4px 5px;table-layout:fixed;}
.mini-cal-days-hdr{border:1.5px solid #111;border-radius:10px;padding:6px 0;margin-bottom:8px;overflow:hidden;}
body.dark .mini-cal-days-hdr{border-color:#fff;}
.mini-cal-days-hdr .mini-cal-table{border-spacing:0;}
.cal-day-hdr{font-size:10px;font-weight:700;color:#111;text-align:center;padding:0;}
body.dark .cal-day-hdr{color:#fff;}
.cal-cell{height:38px;border-radius:10px;font-size:12px;font-weight:700;border:1px solid #111;color:#111;text-align:center;vertical-align:middle;}
body.dark .cal-cell{border-color:#fff;color:#fff;}
.cal-cell.c-green{background:#d1fae5;color:#111;border-color:#111;}
body.dark .cal-cell.c-green{background:#064e3b;color:#fff;border-color:#fff;}
.cal-cell.c-red{background:#fee2e2;color:#111;border-color:#111;}
body.dark .cal-cell.c-red{background:#450a0a;color:#fff;border-color:#fff;}
.cal-cell.c-grey{color:#111;border-color:#111;}
body.dark .cal-cell.c-grey{color:#fff;border-color:#fff;}
.cal-cell.c-today{border-color:var(--blue);color:var(--blue);font-weight:900;border-width:2px;}
body.dark .cal-cell.c-today{border-color:var(--yellow);color:var(--yellow);}
.cal-cell.c-payout{background:#FFBA09;color:#111;border-color:#111;font-weight:900;}
body.dark .cal-cell.c-payout{background:#FFBA09;color:#111;border-color:#111;font-weight:900;}
.cal-legend{margin-top:10px;}
.cal-legend-item{display:inline-block;margin:0 14px 6px 0;font-size:11px;color:var(--sub);vertical-align:middle;}
.cal-dot{display:inline-block;width:10px;height:10px;border-radius:3px;vertical-align:middle;margin-right:5px;}


.ic{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;}
.ic svg{width:1em;height:1em;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;}
button .ic, a .ic{vertical-align:middle;}