:root {
  --bg: #080B10;
  --bg2: #0E1218;
  --card: #111722;
  --card2: #161D2A;
  --border: #1E2A3A;
  --border2: #2A3A50;
  --gold: #C8A84B;
  --gold2: #E8C97A;
  --gold3: #8B6B20;
  --gold-glow: rgba(200,168,75,0.15);
  --text: #EEF2F8;
  --text2: #8A9BB5;
  --text3: #4A5A70;
  --green: #2ED47A;
  --green-dim: rgba(46,212,122,0.12);
  --red: #FF5757;
  --red-dim: rgba(255,87,87,0.12);
  --blue: #4A90D9;
  --sidebar: 240px;
  --radius: 14px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html,body{height:100%;background:var(--bg);color:var(--text);font-family:'Syne',sans-serif;transition:background-color .3s ease,color .3s ease;}
h1,h2,h3,.serif{font-family:'Cormorant Garamond',serif;}
.mono{font-family:'DM Mono',monospace;}

/* ─── SCROLLBAR ─── */
::-webkit-scrollbar{width:5px;height:5px;}
::-webkit-scrollbar-track{background:var(--bg2);}
::-webkit-scrollbar-thumb{background:var(--border2);border-radius:3px;}

/* ─── AUTH SCREEN ─── */
#auth-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:var(--bg);position:relative;overflow:hidden;}
#auth-screen::before{content:'';position:absolute;width:600px;height:600px;background:radial-gradient(circle,rgba(200,168,75,0.06) 0%,transparent 70%);top:-100px;right:-100px;pointer-events:none;}
#auth-screen::after{content:'';position:absolute;width:400px;height:400px;background:radial-gradient(circle,rgba(74,144,217,0.04) 0%,transparent 70%);bottom:-50px;left:-50px;pointer-events:none;}

.auth-card{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:48px 40px;width:100%;max-width:440px;position:relative;z-index:1;}
.auth-card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);border-radius:20px 20px 0 0;}

.auth-logo{text-align:center;margin-bottom:36px;}
.auth-logo .mark{font-family:'Cormorant Garamond',serif;font-size:32px;font-weight:600;color:var(--gold);letter-spacing:2px;}
.auth-logo .sub{font-size:11px;color:var(--text3);letter-spacing:4px;text-transform:uppercase;margin-top:4px;}

.auth-tabs{display:flex;gap:0;background:var(--bg2);border-radius:10px;padding:4px;margin-bottom:32px;}
.auth-tab{flex:1;padding:8px;text-align:center;font-size:13px;font-weight:600;border-radius:7px;cursor:pointer;color:var(--text2);transition:all .2s;}
.auth-tab.active{background:var(--card2);color:var(--text);box-shadow:0 2px 8px rgba(0,0,0,.3);}

.form-group{margin-bottom:18px;}
.form-group label{display:block;font-size:11px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--text3);margin-bottom:8px;}
.form-group input, .form-group select{width:100%;background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:12px 14px;font-size:14px;font-family:'Syne',sans-serif;color:var(--text);outline:none;transition:border-color .2s;}
.form-group input:focus,.form-group select:focus{border-color:var(--gold3);}
.form-group input::placeholder{color:var(--text3);}
.form-group select option{background:var(--card2);}

.btn-primary{width:100%;background:var(--gold);color:#080B10;border:none;border-radius:8px;padding:13px;font-size:14px;font-weight:700;font-family:'Syne',sans-serif;cursor:pointer;letter-spacing:1px;text-transform:uppercase;transition:all .2s;margin-top:8px;}
.btn-primary:hover{background:var(--gold2);transform:translateY(-1px);box-shadow:0 4px 20px var(--gold-glow);}
.btn-ghost{background:transparent;border:1px solid var(--border2);color:var(--text2);border-radius:8px;padding:10px 18px;font-size:13px;font-family:'Syne',sans-serif;cursor:pointer;transition:all .2s;}
.btn-ghost:hover{border-color:var(--gold3);color:var(--text);}

.auth-link{text-align:center;margin-top:20px;font-size:13px;color:var(--text2);}
.auth-divider{display:flex;align-items:center;gap:12px;margin:18px 0;color:var(--text3);font-size:12px;}
.auth-divider::before,.auth-divider::after{content:'';flex:1;height:1px;background:var(--border);}
.btn-google{width:100%;background:var(--bg2);color:var(--text);border:1px solid var(--border2);border-radius:8px;padding:12px;font-size:14px;font-weight:600;font-family:'Syne',sans-serif;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;transition:all .2s;}
.btn-google:hover{border-color:var(--gold3);background:var(--card2);}
.auth-link a{color:var(--gold);text-decoration:none;cursor:pointer;}
.auth-link a:hover{color:var(--gold2);}
.auth-error{background:var(--red-dim);border:1px solid rgba(255,87,87,0.3);border-radius:8px;padding:10px 14px;font-size:13px;color:var(--red);margin-bottom:16px;display:none;}
.auth-success{background:var(--green-dim);border:1px solid rgba(46,212,122,0.3);border-radius:8px;padding:10px 14px;font-size:13px;color:var(--green);margin-bottom:16px;display:none;}

/* ─── APP SHELL ─── */
#app-screen{display:none;height:100vh;overflow:hidden;}
#app-screen.active{display:flex;}

/* ─── SIDEBAR ─── */
#sidebar{width:var(--sidebar);background:var(--card);border-right:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0;overflow-y:auto;}
.sidebar-logo{padding:28px 24px 20px;border-bottom:1px solid var(--border);}
.sidebar-logo .mark{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:600;color:var(--gold);}
.sidebar-logo .user{font-size:11px;color:var(--text3);margin-top:2px;}

.sidebar-nav{padding:16px 12px;flex:1;}
.nav-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:9px;cursor:pointer;font-size:13px;font-weight:500;color:var(--text2);transition:all .2s;margin-bottom:2px;}
.nav-item:hover{background:var(--bg2);color:var(--text);}
.nav-item.active{background:var(--gold-glow);color:var(--gold);border:1px solid rgba(200,168,75,0.2);}
.nav-item .icon{width:18px;height:18px;flex-shrink:0;}
.nav-section{font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--text3);padding:16px 12px 8px;font-weight:600;}

.sidebar-bottom{padding:16px 12px;border-top:1px solid var(--border);}
.currency-toggle{background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:10px 12px;display:flex;align-items:center;justify-content:space-between;font-size:12px;cursor:pointer;}
.currency-toggle .label{color:var(--text2);}
.currency-toggle .val{color:var(--gold);font-weight:600;}
.toggle-switch{display:flex;background:var(--border);border-radius:6px;padding:2px;gap:2px;margin-top:8px;}
.toggle-opt{flex:1;text-align:center;padding:5px 0;border-radius:4px;font-size:11px;font-weight:600;cursor:pointer;color:var(--text3);transition:all .2s;}
.toggle-opt.active{background:var(--gold);color:#080B10;}

/* ─── MAIN CONTENT ─── */
#main-content{flex:1;overflow-y:auto;background:var(--bg);}
.page{display:none;padding:32px;min-height:100%;}
.page.active{display:block;}

.page-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:32px;gap:16px;}
.page-title{font-family:'Cormorant Garamond',serif;font-size:36px;font-weight:600;line-height:1.1;}
.page-title span{color:var(--gold);}
.page-sub{font-size:13px;color:var(--text2);margin-top:4px;}

.btn-add{background:var(--gold);color:#080B10;border:none;border-radius:8px;padding:10px 20px;font-size:13px;font-weight:700;font-family:'Syne',sans-serif;cursor:pointer;display:flex;align-items:center;gap:6px;transition:all .2s;white-space:nowrap;}
.btn-add:hover{background:var(--gold2);transform:translateY(-1px);}

/* ─── CARDS ─── */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:24px;}
.grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;margin-bottom:24px;}
.grid-auto{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;}
.card{background:linear-gradient(135deg,#0D1117 0%,#080B10 100%);border:1px solid rgba(200,168,75,0.2);border-radius:var(--radius);padding:24px;transition:background .3s ease,border-color .3s ease,box-shadow .3s ease;}
.card.elevated{background:linear-gradient(135deg,#161D2A 0%,#0E1218 100%);}
.card-label{font-size:11px;letter-spacing:2.5px;text-transform:uppercase;color:var(--text3);font-weight:600;margin-bottom:8px;}
.card-value{font-family:'Cormorant Garamond',serif;font-size:40px;font-weight:600;color:var(--text);line-height:1;}
.card-sub{font-size:12px;color:var(--text2);margin-top:6px;}
.card-badge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:20px;font-size:11px;font-weight:600;margin-top:8px;}
.card-badge.up{background:var(--green-dim);color:var(--green);}
.card-badge.down{background:var(--red-dim);color:var(--red);}
.card-badge.neutral{background:rgba(74,144,217,0.12);color:var(--blue);}

/* ─── WEALTH RING ─── */
.ring-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px 0;}
.ring-wrap{position:relative;display:inline-block;}
.ring-wrap svg{transform:rotate(-90deg);}
.ring-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;}
.ring-pct{font-family:'Cormorant Garamond',serif;font-size:32px;font-weight:700;color:var(--text);line-height:1;}
.ring-tag{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--text3);margin-top:2px;}
.ring-label{margin-top:12px;text-align:center;}
.ring-label .title{font-size:13px;font-weight:600;color:var(--text);}
.ring-label .sub{font-size:11px;color:var(--text2);margin-top:2px;}
.rings-row{display:flex;gap:24px;justify-content:space-around;flex-wrap:wrap;}

/* ─── ASSET ITEMS ─── */
.asset-list{display:flex;flex-direction:column;gap:10px;}
.asset-item{background:linear-gradient(135deg,#161D2A 0%,#0E1218 100%);border:1px solid rgba(200,168,75,0.15);border-radius:10px;padding:16px 18px;display:flex;align-items:center;gap:14px;cursor:pointer;transition:all .3s ease;}
.asset-item:hover{border-color:rgba(200,168,75,0.4);transform:translateX(2px);box-shadow:0 0 12px rgba(200,168,75,0.1);}
.asset-icon{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0;}
.asset-info{flex:1;min-width:0;}
.asset-name{font-size:14px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.asset-type{font-size:11px;color:var(--text3);margin-top:2px;}
.asset-right{text-align:right;flex-shrink:0;}
.asset-val{font-family:'DM Mono',monospace;font-size:14px;font-weight:500;color:var(--text);}
.asset-chg{font-size:11px;margin-top:2px;}
.asset-chg.up{color:var(--green);}
.asset-chg.down{color:var(--red);}

/* ─── TYPE BADGES ─── */
.type-badge{display:inline-block;padding:2px 8px;border-radius:4px;font-size:10px;font-weight:600;letter-spacing:1px;text-transform:uppercase;}
.type-mmf{background:rgba(200,168,75,0.15);color:var(--gold);}
.type-sacco{background:rgba(46,212,122,0.12);color:var(--green);}
.type-stock{background:rgba(74,144,217,0.12);color:var(--blue);}
.type-crypto{background:rgba(168,85,247,0.12);color:#a855f7;}
.type-re{background:rgba(249,115,22,0.12);color:#f97316;}
.type-tbill{background:rgba(236,72,153,0.12);color:#ec4899;}
.type-fd{background:rgba(20,184,166,0.12);color:#14b8a6;}
.type-debt{background:var(--red-dim);color:var(--red);}
.type-other{background:rgba(148,163,184,0.12);color:#94a3b8;}

/* ─── CALCULATOR ─── */
.calc-tabs{display:flex;gap:0;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:4px;margin-bottom:28px;max-width:400px;}
.calc-tab{flex:1;padding:10px 16px;text-align:center;font-size:13px;font-weight:600;border-radius:9px;cursor:pointer;color:var(--text2);transition:all .2s;}
.calc-tab.active{background:var(--gold);color:#080B10;}

.calc-layout{display:grid;grid-template-columns:380px 1fr;gap:24px;align-items:start;}
.calc-inputs{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:24px;}
.calc-results{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:24px;}

.input-row{margin-bottom:16px;}
.input-row label{display:block;font-size:11px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--text3);margin-bottom:6px;}
.input-row input[type=number],.input-row input[type=text],.input-row select{width:100%;background:var(--bg2);border:1px solid var(--border);border-radius:7px;padding:10px 12px;font-size:14px;font-family:'DM Mono',monospace;color:var(--text);outline:none;transition:border-color .2s;}
.input-row input:focus,.input-row select:focus{border-color:var(--gold3);}
.input-row input[type=range]{width:100%;accent-color:var(--gold);margin-top:4px;cursor:pointer;}
.input-row .range-labels{display:flex;justify-content:space-between;font-size:11px;color:var(--text3);margin-top:4px;}
.range-val{display:inline-block;background:var(--gold-glow);border:1px solid rgba(200,168,75,0.3);border-radius:5px;padding:3px 10px;font-family:'DM Mono',monospace;font-size:14px;color:var(--gold);font-weight:500;margin-top:4px;}

.result-row{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--border);}
.result-row:last-child{border-bottom:none;}
.result-label{font-size:13px;color:var(--text2);}
.result-val{font-family:'DM Mono',monospace;font-size:15px;font-weight:500;color:var(--text);}
.result-val.gold{color:var(--gold);}
.result-val.green{color:var(--green);}
.result-val.red{color:var(--red);}

.highlight-box{background:var(--gold-glow);border:1px solid rgba(200,168,75,0.3);border-radius:10px;padding:16px 20px;margin-bottom:16px;text-align:center;}
.highlight-box .hl-label{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin-bottom:4px;}
.highlight-box .hl-val{font-family:'Cormorant Garamond',serif;font-size:36px;font-weight:600;color:var(--text);}
.highlight-box .hl-sub{font-size:12px;color:var(--text2);margin-top:4px;}

.savings-banner{background:var(--green-dim);border:1px solid rgba(46,212,122,0.3);border-radius:10px;padding:14px 16px;margin-bottom:16px;}
.savings-banner .s-title{font-size:12px;font-weight:600;color:var(--green);margin-bottom:6px;}
.savings-banner .s-row{display:flex;justify-content:space-between;font-size:12px;color:var(--text2);padding:3px 0;}
.savings-banner .s-row span{font-family:'DM Mono',monospace;color:var(--green);}

/* ─── SCHEDULE TABLE ─── */
.sched-wrap{max-height:280px;overflow-y:auto;margin-top:12px;}
.sched-table{width:100%;border-collapse:collapse;font-size:12px;}
.sched-table th{background:var(--bg2);color:var(--text3);font-weight:600;letter-spacing:1px;text-transform:uppercase;padding:8px 10px;text-align:right;font-size:10px;position:sticky;top:0;}
.sched-table th:first-child{text-align:left;}
.sched-table td{padding:7px 10px;border-bottom:1px solid var(--border);font-family:'DM Mono',monospace;text-align:right;color:var(--text2);}
.sched-table td:first-child{text-align:left;color:var(--text);}
.sched-table tr.extra td{background:rgba(46,212,122,0.05);color:var(--green);}
.sched-table tr.payoff td{background:rgba(200,168,75,0.08);font-weight:600;color:var(--gold);}

/* ─── PROJECTION CHART ─── */
.chart-wrap{
  position:relative;
  width:100%;
  border-radius:10px;
  overflow:hidden;
  background:var(--bg2);
  border:1px solid var(--border);
  padding:12px;
  box-sizing:border-box;
}
.chart-wrap canvas{
  display:block;
  width:100% !important;
  height:auto !important;
  max-width:100%;
  border-radius:6px;
}

/* ─── PROGRESS BAR ─── */
.progress-bar{background:var(--bg2);border-radius:999px;height:6px;overflow:hidden;margin-top:8px;}
.progress-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--gold),var(--gold2));transition:width .6s ease;}

/* ─── DEBT DETAIL MODAL ─── */
.loan-modal{max-width:840px!important;}
.loan-tabs{display:flex;gap:0;background:var(--bg2);border-radius:10px;padding:4px;margin-bottom:24px;}
.loan-tab{flex:1;padding:9px 12px;text-align:center;font-size:12px;font-weight:600;border-radius:7px;cursor:pointer;color:var(--text2);transition:all .2s;}
.loan-tab.active{background:var(--gold);color:#080B10;}
.loan-stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px;}
.loan-stat{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:14px;}
.loan-stat .ls-label{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--text3);font-weight:600;margin-bottom:4px;}
.loan-stat .ls-val{font-family:'DM Mono',monospace;font-size:15px;font-weight:500;color:var(--text);}
.loan-stat .ls-sub{font-size:10px;color:var(--text3);margin-top:2px;}

/* ─── STATEMENT UPLOAD ─── */
.stmt-upload-zone{border:2px dashed var(--border2);border-radius:12px;padding:32px;text-align:center;cursor:pointer;transition:all .2s;}
.stmt-upload-zone:hover{border-color:var(--gold3);background:var(--gold-glow);}
.uz-icon{font-size:36px;margin-bottom:10px;}
.uz-title{font-size:15px;font-weight:600;color:var(--text);margin-bottom:4px;}
.uz-sub{font-size:12px;color:var(--text2);}
.stmt-parsing{text-align:center;padding:24px;}
.parse-spinner{font-size:32px;animation:spin 1.5s linear infinite;display:inline-block;margin-bottom:12px;}
@keyframes spin{to{transform:rotate(360deg);}}
.parse-title{font-size:15px;font-weight:600;color:var(--text);margin-bottom:4px;}
.parse-sub{font-size:12px;color:var(--text2);}
.stmt-extracted{background:var(--green-dim);border:1px solid rgba(46,212,122,0.3);border-radius:10px;padding:14px 16px;margin-bottom:16px;}
.se-title{font-size:12px;font-weight:600;color:var(--green);margin-bottom:8px;}
.se-row{display:flex;justify-content:space-between;font-size:12px;color:var(--text2);padding:3px 0;}
.se-row span{font-family:'DM Mono',monospace;color:var(--text);}

/* ─── SIM RESULT ─── */
.sim-result-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-bottom:20px;}
.sim-card{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:14px;text-align:center;}
.sim-card.highlight{border-color:rgba(46,212,122,0.4);background:var(--green-dim);}
.sc-label{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--text3);font-weight:600;margin-bottom:6px;}
.sc-val{font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:600;color:var(--text);}
.sim-card.highlight .sc-val{color:var(--green);}
.sc-sub{font-size:10px;color:var(--text3);margin-top:3px;}

/* ─── TRAN TABLE ─── */
.tran-wrap{max-height:300px;overflow-y:auto;margin-top:12px;}
.tran-table{width:100%;border-collapse:collapse;font-size:12px;}
.tran-table th{background:var(--bg2);color:var(--text3);font-weight:600;letter-spacing:1px;text-transform:uppercase;padding:8px 10px;font-size:10px;position:sticky;top:0;}
.tran-table td{padding:7px 10px;border-bottom:1px solid var(--border);font-family:'DM Mono',monospace;color:var(--text2);}
.tran-table tr.projected td{color:var(--text3);font-style:italic;}
.tran-table tr.highlight-actual td{background:rgba(200,168,75,0.04);}
.debt-analyze-btn{background:rgba(200,168,75,0.12);border:1px solid rgba(200,168,75,0.3);color:var(--gold);border-radius:6px;padding:4px 10px;font-size:11px;font-weight:600;font-family:'Syne',sans-serif;cursor:pointer;transition:all .2s;margin-left:8px;white-space:nowrap;}
.debt-analyze-btn:hover{background:rgba(200,168,75,0.22);}

/* ─── API KEY BANNER ─── */
.api-key-banner{background:rgba(200,168,75,0.08);border:1px solid rgba(200,168,75,0.25);border-radius:10px;padding:14px 18px;margin-bottom:20px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.api-key-banner .akb-icon{font-size:22px;flex-shrink:0;}
.api-key-banner .akb-text{flex:1;min-width:200px;}
.api-key-banner .akb-title{font-size:13px;font-weight:600;color:var(--gold);margin-bottom:2px;}
.api-key-banner .akb-sub{font-size:12px;color:var(--text2);}
.api-key-banner .akb-input{display:flex;gap:8px;flex:2;min-width:260px;}
.api-key-banner .akb-input input{flex:1;background:var(--bg2);border:1px solid var(--border2);border-radius:7px;padding:9px 12px;font-size:13px;font-family:'DM Mono',monospace;color:var(--text);outline:none;transition:border-color .2s;}
.api-key-banner .akb-input input:focus{border-color:var(--gold3);}
.api-key-banner .akb-save{background:var(--gold);color:#080B10;border:none;border-radius:7px;padding:9px 16px;font-size:12px;font-weight:700;font-family:'Syne',sans-serif;cursor:pointer;white-space:nowrap;}
.api-key-banner .akb-save:hover{background:var(--gold2);}
.api-key-set{background:var(--green-dim);border:1px solid rgba(46,212,122,0.25);border-radius:10px;padding:10px 16px;margin-bottom:20px;display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--green);}
.api-key-set span{color:var(--text2);}
.api-key-set a{color:var(--text3);cursor:pointer;text-decoration:underline;margin-left:12px;}

/* ─── MODAL ─── */
.modal-overlay{position:fixed;inset:0;background:rgba(8,11,16,0.85);z-index:100;display:flex;align-items:center;justify-content:center;padding:24px;backdrop-filter:blur(4px);opacity:0;pointer-events:none;transition:opacity .2s;}
.modal-overlay.open{opacity:1;pointer-events:all;}
.modal{background:var(--card);border:1px solid var(--border);border-radius:20px;width:100%;max-width:520px;max-height:85vh;overflow-y:auto;position:relative;}
.modal::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);border-radius:20px 20px 0 0;}
.modal-header{padding:24px 28px 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);}
.modal-title{font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:600;}
.modal-close{background:none;border:none;color:var(--text2);font-size:20px;cursor:pointer;padding:4px;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:6px;transition:all .2s;}
.modal-close:hover{background:var(--bg2);color:var(--text);}
.modal-body{padding:24px 28px 28px;}

.asset-type-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:20px;}
.asset-type-btn{background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:10px 8px;text-align:center;cursor:pointer;transition:all .2s;}
.asset-type-btn:hover,.asset-type-btn.selected{border-color:var(--gold3);background:var(--gold-glow);}
.asset-type-btn .emoji{font-size:18px;display:block;margin-bottom:4px;}
.asset-type-btn .lbl{font-size:10px;color:var(--text3);font-weight:600;letter-spacing:1px;text-transform:uppercase;}

.tax-info{background:rgba(74,144,217,0.08);border:1px solid rgba(74,144,217,0.2);border-radius:8px;padding:12px 14px;margin-top:8px;font-size:12px;color:var(--text2);line-height:1.6;}
.tax-info strong{color:var(--blue);}

/* ─── NET WORTH HEADER ─── */
.nw-hero{background:linear-gradient(135deg,#0D1117 0%,#080B10 100%);border:1px solid rgba(200,168,75,0.2);border-radius:var(--radius);padding:32px;margin-bottom:24px;position:relative;overflow:hidden;box-shadow:0 0 20px rgba(200,168,75,0.15);transition:background .3s ease,border-color .3s ease,box-shadow .3s ease;}
.nw-hero::before{content:'';position:absolute;right:-80px;top:-80px;width:300px;height:300px;background:radial-gradient(circle,rgba(200,168,75,0.08) 0%,transparent 70%);}
.nw-hero .nw-label{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--text3);font-weight:600;}
.nw-hero .nw-val{font-family:'Cormorant Garamond',serif;font-size:56px;font-weight:600;color:var(--text);line-height:1;margin:8px 0;}
.nw-hero .nw-sub{font-size:13px;color:var(--text2);}
.nw-hero .nw-split{display:flex;gap:32px;margin-top:20px;}
.nw-split-item .label{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--text3);font-weight:600;}
.nw-split-item .val{font-family:'DM Mono',monospace;font-size:16px;font-weight:500;margin-top:4px;}
.nw-split-item .val.green{color:var(--green);}
.nw-split-item .val.red{color:var(--red);}

/* ─── GOAL SETUP ─── */
.goal-setup{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:28px;text-align:center;}
.goal-setup h3{font-family:'Cormorant Garamond',serif;font-size:24px;margin-bottom:8px;}
.goal-setup p{font-size:13px;color:var(--text2);margin-bottom:24px;}
.goal-form-row{display:flex;gap:12px;}
.goal-form-row input,.goal-form-row select{flex:1;background:var(--bg2);border:1px solid var(--border);border-radius:7px;padding:10px 12px;font-size:14px;font-family:'Syne',sans-serif;color:var(--text);outline:none;}
.goal-form-row input:focus,.goal-form-row select:focus{border-color:var(--gold3);}

/* ─── EXPORT PAGE ─── */
.export-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:32px;max-width:700px;}
.export-actions{display:flex;gap:12px;margin-bottom:28px;}
.preview-doc{background:white;color:#111;border-radius:10px;padding:40px;font-family:'Syne',sans-serif;font-size:13px;line-height:1.6;}
.preview-doc h1{font-family:'Cormorant Garamond',serif;font-size:28px;color:#C8A84B;border-bottom:2px solid #C8A84B;padding-bottom:10px;margin-bottom:20px;}
.preview-doc .prow{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #eee;}
.preview-doc .psec{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#888;margin:16px 0 8px;font-weight:700;}

/* ─── VELOCITY SECTION ─── */
.velocity-row{display:flex;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--border);}
.velocity-row:last-child{border-bottom:none;}
.velocity-month{font-size:11px;font-weight:600;color:var(--text3);width:28px;text-align:center;}
.velocity-bar-wrap{flex:1;}
.velocity-bar{height:6px;border-radius:3px;background:var(--gold);transition:width .6s;}
.velocity-val{font-family:'DM Mono',monospace;font-size:12px;color:var(--text2);width:100px;text-align:right;}

/* ─── RESPONSIVE ─── */
@media(max-width:768px){
  #sidebar{display:none;}
  .page{padding:20px;}
  .calc-layout{grid-template-columns:1fr;}
  .grid-2,.grid-3{grid-template-columns:1fr;}
  .nw-hero .nw-val{font-size:38px;}
}

/* ─── TOAST ─── */
.toast{position:fixed;bottom:24px;right:24px;background:var(--card2);border:1px solid var(--border);border-radius:10px;padding:12px 18px;font-size:13px;color:var(--text);z-index:999;transform:translateY(20px);opacity:0;transition:all .3s;pointer-events:none;}
.toast.show{transform:translateY(0);opacity:1;}
.toast.success{border-color:rgba(46,212,122,0.4);color:var(--green);}

/* ─── EMPTY STATE ─── */
.empty{text-align:center;padding:60px 24px;color:var(--text3);}
.empty .e-icon{font-size:40px;margin-bottom:16px;opacity:.4;}
.empty .e-title{font-family:'Cormorant Garamond',serif;font-size:22px;color:var(--text2);margin-bottom:8px;}
.empty .e-sub{font-size:13px;}

.divider{height:1px;background:var(--border);margin:20px 0;}

/* Print */
@media print{
  #sidebar,#main-content > .page:not(#page-export){display:none!important;}
  #app-screen{display:block!important;}
  #page-export{display:block!important;padding:0;}
  .export-actions{display:none!important;}
  .preview-doc{box-shadow:none!important;}
}

/* ─── INVESTMENT ANALYSIS ADDITIONS ─── */
.invest-modal{max-width:860px!important;}
.invest-tabs{display:flex;gap:0;background:var(--bg2);border-radius:10px;padding:4px;margin-bottom:24px;}
.invest-tab{flex:1;padding:9px 12px;text-align:center;font-size:12px;font-weight:600;border-radius:7px;cursor:pointer;color:var(--text2);transition:all .2s;}
.invest-tab.active{background:var(--gold);color:#080B10;}
.invest-stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px;}
.invest-stat{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:14px;}
.invest-stat .is-label{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--text3);font-weight:600;margin-bottom:4px;}
.invest-stat .is-val{font-family:'DM Mono',monospace;font-size:15px;font-weight:500;color:var(--text);}
.invest-stat .is-sub{font-size:10px;color:var(--text3);margin-top:2px;}
.invest-goal-banner{background:var(--gold-glow);border:1px solid rgba(200,168,75,0.3);border-radius:10px;padding:14px 16px;margin-bottom:16px;}
.invest-goal-banner .igb-label{font-size:11px;font-weight:600;color:var(--gold);margin-bottom:6px;}
.invest-goal-banner .igb-row{display:flex;justify-content:space-between;font-size:12px;color:var(--text2);padding:3px 0;}
.invest-goal-banner .igb-row span{font-family:'DM Mono',monospace;color:var(--gold);}
.inv-tran-wrap{max-height:300px;overflow-y:auto;margin-top:12px;}
.inv-analyze-btn{background:rgba(200,168,75,0.12);border:1px solid rgba(200,168,75,0.3);color:var(--gold);border-radius:6px;padding:4px 10px;font-size:11px;font-weight:600;font-family:'Syne',sans-serif;cursor:pointer;transition:all .2s;margin-left:8px;white-space:nowrap;}
.inv-analyze-btn:hover{background:rgba(200,168,75,0.22);}
.inv-sim-card{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:14px;text-align:center;}
.inv-sim-card.highlight{border-color:rgba(46,212,122,0.4);background:var(--green-dim);}
.inv-sim-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-bottom:20px;}
/* Investment statement upload uses existing .stmt-* classes */

/* ══════════════════════════════════════
   COLOR THEMES
══════════════════════════════════════ */

/* ══════════════════════════════════════
   LIGHT THEMES — 7 premium palettes
══════════════════════════════════════ */

/* 1. Ivory & Emerald — Luxury Wealth Light */
[data-theme="ivory"] {
  --bg:#F8F6F1;--bg2:#EDE8DF;--card:#FFFFFF;--card2:#F5F3EE;
  --border:#E6E2D8;--border2:#D4CEBD;
  --gold:#0F5132;--gold2:#198754;--gold3:#083D22;
  --gold-glow:rgba(15,81,50,0.12);
  --text:#1C1C1C;--text2:#4A4A4A;--text3:#8A8A80;
  --green:#198754;--green-dim:rgba(25,135,84,0.12);
  --red:#B91C1C;--red-dim:rgba(185,28,28,0.10);
  --blue:#1565C0;
}

/* 2. Pearl White & Royal Blue — Modern Financial Authority */
[data-theme="pearl"] {
  --bg:#FAFBFF;--bg2:#EEF2FF;--card:#FFFFFF;--card2:#F5F8FF;
  --border:#E2E8F0;--border2:#CBD5E1;
  --gold:#1E3A8A;--gold2:#3B82F6;--gold3:#1E40AF;
  --gold-glow:rgba(30,58,138,0.10);
  --text:#0F172A;--text2:#475569;--text3:#94A3B8;
  --green:#16A34A;--green-dim:rgba(22,163,74,0.10);
  --red:#DC2626;--red-dim:rgba(220,38,38,0.10);
  --blue:#3B82F6;
}

/* 3. Cream & Terracotta Gold — African Wealth Heritage */
[data-theme="cream"] {
  --bg:#FBF3E8;--bg2:#F2E4D0;--card:#FFFFFF;--card2:#FDF8F0;
  --border:#EADBC8;--border2:#D9C5A8;
  --gold:#8B5E34;--gold2:#E6A817;--gold3:#6B4420;
  --gold-glow:rgba(139,94,52,0.14);
  --text:#2A2A2A;--text2:#5A4A3A;--text3:#9A8A78;
  --green:#2E7D32;--green-dim:rgba(46,125,50,0.10);
  --red:#C2410C;--red-dim:rgba(194,65,12,0.10);
  --blue:#1565C0;
}

/* 4. Frost White & Teal — Fresh & Optimistic Growth */
[data-theme="frost"] {
  --bg:#F4FAFA;--bg2:#E4F4F4;--card:#FFFFFF;--card2:#F0FAFA;
  --border:#CCEBE8;--border2:#99D6D0;
  --gold:#0F766E;--gold2:#14B8A6;--gold3:#0C5D57;
  --gold-glow:rgba(15,118,110,0.12);
  --text:#0F172A;--text2:#334155;--text3:#64748B;
  --green:#22C55E;--green-dim:rgba(34,197,94,0.12);
  --red:#F97316;--red-dim:rgba(249,115,22,0.12);
  --blue:#14B8A6;
}

/* 5. Champagne & Charcoal — Ultra Premium Executive */
[data-theme="champagne"] {
  --bg:#F7EFE5;--bg2:#EEE4D8;--card:#FFFFFF;--card2:#FAF5EE;
  --border:#E8E0D4;--border2:#D4C8B8;
  --gold:#C6A75E;--gold2:#D9BA7A;--gold3:#A88840;
  --gold-glow:rgba(198,167,94,0.18);
  --text:#1A1A1A;--text2:#4A4A4A;--text3:#8A8A80;
  --green:#1F7A4C;--green-dim:rgba(31,122,76,0.10);
  --red:#B45309;--red-dim:rgba(180,83,9,0.10);
  --blue:#2B2B2B;
}

/* 6. Minimal White & Midnight Blue — Apple-clean SaaS */
[data-theme="minimal"] {
  --bg:#FFFFFF;--bg2:#F9FAFB;--card:#F9FAFB;--card2:#F3F4F6;
  --border:#E5E7EB;--border2:#D1D5DB;
  --gold:#2563EB;--gold2:#3B82F6;--gold3:#1D4ED8;
  --gold-glow:rgba(37,99,235,0.10);
  --text:#111827;--text2:#6B7280;--text3:#9CA3AF;
  --green:#10B981;--green-dim:rgba(16,185,129,0.10);
  --red:#EF4444;--red-dim:rgba(239,68,68,0.10);
  --blue:#2563EB;
}

/* 7. Sand & Forest — Wealth & Stability */
[data-theme="sand"] {
  --bg:#F5EFE6;--bg2:#E8DFD0;--card:#FFFFFF;--card2:#FAF5EC;
  --border:#E0D4C0;--border2:#CCBAA0;
  --gold:#1B4332;--gold2:#40916C;--gold3:#143327;
  --gold-glow:rgba(27,67,50,0.14);
  --text:#2D2D2D;--text2:#5A4A3A;--text3:#8A7868;
  --green:#40916C;--green-dim:rgba(64,145,108,0.12);
  --red:#BC6C25;--red-dim:rgba(188,108,37,0.12);
  --blue:#A68A64;
}

/* 8. Tajiri Light — New Default (matches landing page) */
[data-theme="tajiri-light"] {
  --bg:#e8f5f0;--bg2:#f4faf7;--card:#ffffff;--card2:#f4faf7;
  --border:rgba(26,107,74,0.18);--border2:rgba(26,107,74,0.30);
  --gold:#1a6b4a;--gold2:#2dd4aa;--gold3:#0d5038;
  --gold-glow:rgba(26,107,74,0.12);
  --text:#0d2b22;--text2:#1a3d2e;--text3:#5a7a6e;
  --green:#1a6b4a;--green-dim:rgba(26,107,74,0.12);
  --red:#dc2626;--red-dim:rgba(220,38,38,0.10);
  --blue:#2dd4aa;
}

/* ── LIGHT THEME: Sidebar background ── */
[data-theme-mode="light"] #sidebar { background:var(--bg2); }
/* tajiri-light sidebar stays white (var(--card) = #ffffff via #sidebar default) */
[data-theme="tajiri-light"] #sidebar { background:var(--card); }

/* ── LIGHT THEME: Form inputs — crisp white ── */
[data-theme-mode="light"] .form-group input,[data-theme-mode="light"] .form-group select,
[data-theme-mode="light"] .input-row input,[data-theme-mode="light"] .input-row select
{ background:#FFFFFF; }

/* ── LIGHT THEME: Nav active — per-theme accent ── */
[data-theme="ivory"]     .nav-item.active{background:rgba(15,81,50,0.10);color:#0F5132;border-color:rgba(15,81,50,0.22);}
[data-theme="pearl"]     .nav-item.active{background:rgba(30,58,138,0.10);color:#1E3A8A;border-color:rgba(30,58,138,0.22);}
[data-theme="cream"]     .nav-item.active{background:rgba(139,94,52,0.10);color:#8B5E34;border-color:rgba(139,94,52,0.22);}
[data-theme="frost"]     .nav-item.active{background:rgba(15,118,110,0.10);color:#0F766E;border-color:rgba(15,118,110,0.22);}
[data-theme="champagne"] .nav-item.active{background:rgba(198,167,94,0.16);color:#8B6830;border-color:rgba(198,167,94,0.35);}
[data-theme="minimal"]   .nav-item.active{background:rgba(37,99,235,0.10);color:#2563EB;border-color:rgba(37,99,235,0.22);}
[data-theme="sand"]         .nav-item.active{background:rgba(27,67,50,0.10);color:#1B4332;border-color:rgba(27,67,50,0.22);}
[data-theme="tajiri-light"] .nav-item.active{background:rgba(26,107,74,0.10);color:#1a6b4a;border-color:rgba(26,107,74,0.22);}

/* ── LIGHT THEME: Card & panel shadows ── */
[data-theme-mode="light"] .card { box-shadow:0 1px 4px rgba(0,0,0,0.06); }
[data-theme-mode="light"] .modal { box-shadow:0 20px 60px rgba(0,0,0,0.18); }

/* ── LIGHT THEME: White text on dark primary buttons ── */
[data-theme-mode="light"] .btn-primary,[data-theme-mode="light"] .btn-add,
[data-theme-mode="light"] .calc-tab.active,[data-theme-mode="light"] .loan-tab.active,
[data-theme-mode="light"] .settings-tab.active,[data-theme-mode="light"] .invest-tab.active,
[data-theme-mode="light"] .toggle-opt.active,[data-theme-mode="light"] .api-row .btn-save,
[data-theme-mode="light"] .theme-selected-badge,[data-theme-mode="light"] .akb-save { color:#FFFFFF; }
/* champagne uses dark text on its gold primary button */
[data-theme="champagne"] .btn-primary,[data-theme="champagne"] .btn-add { color:#080B10; }

/* ── LIGHT THEME: Auth card on light bg needs soft shadow ── */
[data-theme-mode="light"] .auth-card { box-shadow:0 8px 40px rgba(0,0,0,0.12); }

/* ── LIGHT THEME: Scrollbar ── */
[data-theme-mode="light"]::-webkit-scrollbar-thumb { background:var(--border2); }

/* ══════════════════════════════════════
   MIDNIGHT GOLD DARK MODE — override luxury defaults
   Restores the original solid-card midnight styling
══════════════════════════════════════ */
[data-theme="midnight"] .card {
  background: #111722;
  border-color: #1E2A3A;
  box-shadow: none;
}
[data-theme="midnight"] .card.elevated {
  background: #161D2A;
}
[data-theme="midnight"] .nw-hero {
  background: linear-gradient(135deg,#111722,#161D2A);
  border-color: #1E2A3A;
  box-shadow: none;
}
[data-theme="midnight"] .asset-item {
  background: #161D2A;
  border-color: #1E2A3A;
}
[data-theme="midnight"] .asset-item:hover {
  border-color: #2A3A50;
  box-shadow: none;
}

/* ══════════════════════════════════════
   TAJIRI LIGHT — Fix hardcoded dark backgrounds
   (base .card/.nw-hero/.asset-item use hardcoded dark gradients)
══════════════════════════════════════ */
[data-theme="tajiri-light"] .card {
  background: var(--card);
  border-color: var(--border);
}
[data-theme="tajiri-light"] .card.elevated {
  background: var(--card2);
}
[data-theme="tajiri-light"] .nw-hero {
  background: var(--card);
  border-color: var(--border);
  box-shadow: 0 1px 8px rgba(26,107,74,0.08);
}
[data-theme="tajiri-light"] .nw-hero::before {
  background: radial-gradient(circle,rgba(26,107,74,0.06) 0%,transparent 70%);
}
[data-theme="tajiri-light"] .asset-item {
  background: var(--card);
  border-color: rgba(26,107,74,0.15);
}
[data-theme="tajiri-light"] .asset-item:hover {
  border-color: rgba(26,107,74,0.4);
  box-shadow: 0 0 12px rgba(26,107,74,0.10);
  transform: translateX(2px);
}
[data-theme="tajiri-light"] .dark-mode-toggle {
  border-color: rgba(26,107,74,0.25);
}
/* Wealth Goal keeps actual gold accent */
[data-theme="tajiri-light"] #dash-goal { color: #C8A84B !important; }
/* Portfolio stat card values → green */
[data-theme="tajiri-light"] #p-total { color: var(--green) !important; }
[data-theme="tajiri-light"] #p-fixed { color: var(--green) !important; }
/* Debt card value overrides */
[data-theme="tajiri-light"] #d-monthly { color: var(--text3) !important; }
[data-theme="tajiri-light"] #d-ratio   { color: var(--green) !important; }
[data-theme="tajiri-light"] #debt-quality-card .card-value { color: #C8A84B !important; }
/* Upload Statement / ghost button → visible green */
[data-theme="tajiri-light"] .btn-ghost {
  border-color: rgba(26,107,74,0.35);
  color: #1a6b4a;
}
[data-theme="tajiri-light"] .btn-ghost:hover {
  border-color: #1a6b4a;
  color: #0d5038;
  background: rgba(26,107,74,0.06);
}

/* ── DARK MODE TOGGLE BUTTON ── */
.dark-mode-toggle{background:transparent;border:1px solid rgba(200,168,75,0.25);border-radius:8px;padding:8px 14px;font-size:12px;font-weight:600;font-family:'Syne',sans-serif;color:var(--text2);cursor:pointer;display:flex;align-items:center;gap:7px;transition:all .3s ease;white-space:nowrap;}
.dark-mode-toggle:hover{border-color:var(--gold);color:var(--text);background:var(--gold-glow);}
.dark-mode-toggle .dmt-icon{font-size:15px;line-height:1;transition:transform .3s ease;}
.dark-mode-toggle.midnight-active{border-color:rgba(200,168,75,0.5);color:var(--gold);}
.dark-mode-toggle.midnight-active .dmt-icon{transform:rotate(180deg);}

/* ══════════════════════════════════════
   SETTINGS PAGE STYLES
══════════════════════════════════════ */
.settings-tabs{display:flex;gap:0;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:4px;margin-bottom:32px;width:540px;max-width:100%;}
.settings-tab{flex:1;padding:10px 16px;text-align:center;font-size:13px;font-weight:600;border-radius:9px;cursor:pointer;color:var(--text2);transition:all .2s;}
.settings-tab.active{background:var(--gold);color:#080B10;}
.settings-section{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:28px;margin-bottom:20px;}
.settings-section-title{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:600;color:var(--text);margin-bottom:4px;}
.settings-section-sub{font-size:12px;color:var(--text2);margin-bottom:24px;}
.settings-divider{height:1px;background:var(--border);margin:20px 0;}

/* Theme cards */
.theme-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:8px;}
.theme-grid + .theme-grid{margin-top:0;}
.theme-card{border-radius:12px;overflow:hidden;cursor:pointer;border:2px solid transparent;transition:all .25s;position:relative;}
.theme-card:hover{transform:translateY(-3px);box-shadow:0 8px 28px rgba(0,0,0,0.15);}
.theme-card.selected{border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-glow);}
.theme-row-label{font-size:10px;letter-spacing:2.5px;text-transform:uppercase;font-weight:600;color:var(--text3);margin:20px 0 10px;display:flex;align-items:center;gap:10px;}
.theme-row-label::after{content:'';flex:1;height:1px;background:var(--border);}
.theme-preview{height:72px;position:relative;overflow:hidden;}
.theme-preview-bar{position:absolute;left:0;top:0;bottom:0;width:36px;display:flex;flex-direction:column;gap:3px;padding:6px 4px;justify-content:space-between;}
.theme-preview-dot{width:20px;height:6px;border-radius:3px;}
.theme-preview-main{position:absolute;left:36px;right:0;top:0;bottom:0;padding:8px 10px;display:flex;flex-direction:column;justify-content:space-between;}
.theme-preview-title{height:8px;border-radius:4px;width:70%;opacity:.85;}
.theme-preview-card{height:28px;border-radius:6px;padding:5px 8px;}
.theme-preview-val{height:7px;border-radius:3px;width:55%;}
.theme-footer{padding:10px 12px;}
.theme-name{font-size:13px;font-weight:700;color:var(--text);margin-bottom:1px;}
.theme-desc{font-size:10px;color:var(--text3);letter-spacing:.5px;}
.theme-selected-badge{position:absolute;top:6px;right:6px;background:var(--gold);color:#080B10;border-radius:20px;font-size:10px;font-weight:700;padding:2px 7px;display:none;}
.theme-card.selected .theme-selected-badge{display:block;}

/* Password strength bar */
.pw-strength{height:4px;border-radius:3px;margin-top:6px;transition:all .3s;}
.pw-strength.weak{background:var(--red);width:33%;}
.pw-strength.fair{background:var(--gold);width:66%;}
.pw-strength.strong{background:var(--green);width:100%;}
.pw-strength-label{font-size:10px;margin-top:3px;}

/* API key row */
.api-row{display:flex;gap:10px;align-items:center;margin-bottom:14px;}
.api-row input{flex:1;background:var(--bg2);border:1px solid var(--border);border-radius:7px;padding:10px 12px;font-size:13px;font-family:'DM Mono',monospace;color:var(--text);outline:none;transition:border-color .2s;}
.api-row input:focus{border-color:var(--gold3);}
.api-row .btn-save{background:var(--gold);color:#080B10;border:none;border-radius:7px;padding:10px 16px;font-size:12px;font-weight:700;font-family:'Syne',sans-serif;cursor:pointer;white-space:nowrap;}
.api-row .btn-save:hover{background:var(--gold2);}
.api-status{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:6px;font-size:12px;font-weight:600;margin-top:4px;}
.api-status.set{background:var(--green-dim);color:var(--green);}
.api-status.unset{background:var(--red-dim);color:var(--red);}

@media(max-width:900px){.theme-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px){.theme-grid{grid-template-columns:1fr 1fr;}}

/* ── INTELLIGENCE MODULE ── */
.intel-cta{display:flex;align-items:center;justify-content:space-between;gap:16px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:16px 20px;margin-bottom:24px;}
.intel-cta-icon{font-size:22px;flex-shrink:0;}
.intel-cta-text{flex:1;}
.intel-cta-title{font-size:13px;font-weight:600;color:var(--text);}
.intel-cta-sub{font-size:12px;color:var(--text2);margin-top:2px;}
.intel-panel{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:20px 24px;margin-bottom:24px;}
.intel-panel-label{font-size:11px;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:var(--text3);margin-bottom:16px;}
.intel-metrics-row{display:flex;flex-wrap:wrap;}
.intel-metric{flex:1;min-width:120px;padding:0 18px;border-right:1px solid var(--border);}
.intel-metric:first-child{padding-left:0;}
.intel-metric:last-child{border-right:none;}
.intel-metric-label{font-size:10px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--text3);margin-bottom:6px;}
.intel-metric-val{font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:600;color:var(--text);line-height:1.1;}
.intel-metric-note{font-size:11px;color:var(--text2);margin-top:4px;line-height:1.4;}
.divers-badge{display:flex;align-items:flex-start;gap:10px;background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:12px 14px;margin-top:16px;}
.divers-badge-icon{font-size:15px;line-height:1.4;flex-shrink:0;}
.divers-badge-body{flex:1;}
.divers-badge-title{font-size:10px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:3px;}
.divers-badge-sub{font-size:11px;color:var(--text2);line-height:1.5;}
.type-chama{background:rgba(168,85,247,0.12);color:#c084fc;}
.chama-box{background:var(--gold-glow);border:1px solid rgba(200,168,75,0.25);border-radius:10px;padding:16px;margin-bottom:16px;display:none;}
.chama-box-title{font-size:11px;font-weight:600;color:var(--gold);letter-spacing:2px;text-transform:uppercase;margin-bottom:12px;}
.chama-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px;}
.chama-proj{font-size:12px;color:var(--text2);line-height:1.6;margin-top:12px;padding-top:12px;border-top:1px solid rgba(200,168,75,0.2);display:none;}
.chama-inp{width:100%;background:var(--bg2);border:1px solid rgba(200,168,75,0.35);border-radius:7px;padding:10px 12px;font-size:14px;font-family:'DM Mono',monospace;color:var(--text);outline:none;box-sizing:border-box;}
.chama-inp:focus{border-color:var(--gold);}
.income-preview-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px;}
.income-preview-card{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:14px;}
.income-preview-card-title{font-size:12px;font-weight:600;color:var(--gold);margin-bottom:4px;}
.income-preview-card-desc{font-size:12px;color:var(--text2);line-height:1.6;}
.income-saved-ok{display:none;background:var(--green-dim);border:1px solid rgba(46,212,122,0.3);border-radius:10px;padding:12px 16px;font-size:13px;color:var(--green);margin-bottom:20px;}
.intel-inp{width:100%;background:var(--bg2);border:1px solid var(--border);border-radius:7px;padding:10px 12px;font-size:14px;font-family:'DM Mono',monospace;color:var(--text);outline:none;transition:border-color .2s;box-sizing:border-box;}
.intel-inp:focus{border-color:var(--gold3);}
.intel-sel{width:100%;background:var(--bg2);border:1px solid var(--border);border-radius:7px;padding:10px 12px;font-size:14px;font-family:'Syne',sans-serif;color:var(--text);outline:none;}
.intel-sel option{background:var(--card2);}

/* ══════════════════════════════════════════════════════
   LANDING PAGE — Isolated styles (--lp-* prefix)
══════════════════════════════════════════════════════ */
:root {
  --lp-teal: #0d7c66;
  --lp-teal-dark: #0a6354;
  --lp-teal-light: #e6f5f1;
  --lp-amber: #e8a020;
  --lp-amber-light: #fdf3e0;
  --lp-bg: #fafaf8;
  --lp-white: #ffffff;
  --lp-dark: #111827;
  --lp-dark2: #1a2332;
  --lp-text: #374151;
  --lp-text2: #6b7280;
  --lp-text3: #9ca3af;
  --lp-border: #e5e7eb;
  --lp-heading: 'Fraunces', serif;
  --lp-body: 'Plus Jakarta Sans', sans-serif;
  --lp-radius: 16px;
}

#landing-page{display:none;font-family:var(--lp-body);color:var(--lp-text);background:var(--lp-bg);line-height:1.6;}
#landing-page.active{display:block;}
#landing-page *{box-sizing:border-box;}
#landing-page h1,#landing-page h2,#landing-page h3,#landing-page h4{font-family:var(--lp-heading);color:var(--lp-dark);line-height:1.2;font-weight:600;}
#landing-page p{color:var(--lp-text);font-size:15px;}
#landing-page section{padding:80px 0;}
#landing-page .lp-container{max-width:1140px;margin:0 auto;padding:0 24px;}

/* ── Nav ── */
.lp-nav{position:sticky;top:0;z-index:100;background:rgba(255,255,255,0.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--lp-border);padding:0 24px;}
.lp-nav-inner{max-width:1140px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:64px;}
.lp-nav-brand{font-family:var(--lp-heading);font-size:22px;font-weight:700;color:var(--lp-teal);text-decoration:none;}
.lp-nav-brand span{color:var(--lp-amber);}
.lp-nav-links{display:flex;align-items:center;gap:28px;}
.lp-nav-links a{font-size:14px;font-weight:500;color:var(--lp-text2);text-decoration:none;transition:color .2s;cursor:pointer;}
.lp-nav-links a:hover{color:var(--lp-teal);}
.lp-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-family:var(--lp-body);font-weight:600;font-size:14px;border:none;border-radius:10px;padding:10px 22px;cursor:pointer;transition:all .25s;text-decoration:none;}
.lp-btn-outline{background:transparent;border:1.5px solid var(--lp-teal);color:var(--lp-teal);}
.lp-btn-outline:hover{background:var(--lp-teal);color:#fff;}
.lp-btn-primary{background:var(--lp-teal);color:#fff;box-shadow:0 2px 12px rgba(13,124,102,0.25);}
.lp-btn-primary:hover{background:var(--lp-teal-dark);transform:translateY(-1px);box-shadow:0 4px 20px rgba(13,124,102,0.35);}
.lp-btn-amber{background:var(--lp-amber);color:#fff;box-shadow:0 2px 12px rgba(232,160,32,0.3);}
.lp-btn-amber:hover{background:#d4910d;transform:translateY(-1px);}
.lp-btn-lg{padding:14px 32px;font-size:16px;border-radius:12px;}

/* ── Hero ── */
.lp-hero{padding:100px 0 60px;text-align:center;position:relative;overflow:hidden;background:linear-gradient(180deg,var(--lp-teal-light) 0%,var(--lp-bg) 100%);}
.lp-hero-badge{display:inline-flex;align-items:center;gap:6px;background:var(--lp-white);border:1px solid var(--lp-border);border-radius:50px;padding:6px 16px 6px 8px;font-size:12px;font-weight:600;color:var(--lp-teal);margin-bottom:24px;}
.lp-hero-badge .dot{width:8px;height:8px;background:var(--lp-amber);border-radius:50%;animation:lp-pulse 2s infinite;}
@keyframes lp-pulse{0%,100%{opacity:1}50%{opacity:.4}}
.lp-hero h1{font-size:clamp(36px,5vw,60px);margin-bottom:20px;letter-spacing:-0.02em;}
.lp-hero h1 .lp-hl{color:var(--lp-teal);}
.lp-hero h1 .lp-hl2{color:var(--lp-amber);}
.lp-hero-sub{font-size:18px;color:var(--lp-text2);max-width:580px;margin:0 auto 36px;}
.lp-hero-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:60px;}

/* Floating mockup cards */
.lp-mockup-area{position:relative;max-width:900px;margin:0 auto;height:260px;}
.lp-mock-card{position:absolute;background:var(--lp-white);border-radius:16px;box-shadow:0 8px 40px rgba(0,0,0,0.08);padding:24px;border:1px solid var(--lp-border);transition:transform .4s;}
.lp-mock-card:hover{transform:translateY(-4px);}
.lp-mock-card.mc1{left:0;top:20px;width:260px;}
.lp-mock-card.mc2{left:50%;transform:translateX(-50%);top:0;width:320px;z-index:2;border-color:var(--lp-teal);box-shadow:0 12px 48px rgba(13,124,102,0.12);}
.lp-mock-card.mc2:hover{transform:translateX(-50%) translateY(-4px);}
.lp-mock-card.mc3{right:0;top:30px;width:240px;}
.mc-label{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--lp-text3);margin-bottom:6px;font-weight:600;}
.mc-val{font-family:var(--lp-heading);font-size:32px;font-weight:700;color:var(--lp-dark);}
.mc-val.teal{color:var(--lp-teal);}
.mc-sub{font-size:12px;color:var(--lp-text2);margin-top:4px;}
.mc-bar-row{display:flex;gap:4px;margin-top:12px;height:6px;}
.mc-bar-row span{border-radius:3px;flex:1;}
.mc-mini-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--lp-border);font-size:13px;}
.mc-mini-row:last-child{border-bottom:none;}
.mc-mini-row .name{color:var(--lp-text2);}
.mc-mini-row .val{font-weight:600;color:var(--lp-dark);}

/* ── Proof strip ── */
.lp-proof{background:var(--lp-dark);padding:40px 0;}
.lp-proof-grid{display:flex;justify-content:center;gap:60px;flex-wrap:wrap;}
.lp-proof-item{text-align:center;}
.lp-proof-item .num{font-family:var(--lp-heading);font-size:36px;font-weight:700;color:var(--lp-amber);}
.lp-proof-item .label{font-size:13px;color:rgba(255,255,255,0.6);margin-top:4px;}

/* ── How it works ── */
.lp-steps{background:var(--lp-bg);}
.lp-section-title{text-align:center;margin-bottom:48px;}
.lp-section-title h2{font-size:clamp(28px,3.5vw,42px);margin-bottom:12px;}
.lp-section-title p{font-size:16px;color:var(--lp-text2);max-width:520px;margin:0 auto;}
.lp-steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.lp-step-card{background:var(--lp-white);border:1px solid var(--lp-border);border-radius:var(--lp-radius);padding:32px 28px;text-align:center;transition:transform .3s,box-shadow .3s;}
.lp-step-card:hover{transform:translateY(-4px);box-shadow:0 8px 32px rgba(0,0,0,0.06);}
.lp-step-num{display:inline-flex;width:44px;height:44px;align-items:center;justify-content:center;background:var(--lp-teal-light);color:var(--lp-teal);font-family:var(--lp-heading);font-weight:700;font-size:18px;border-radius:12px;margin-bottom:16px;}
.lp-step-card h3{font-size:20px;margin-bottom:8px;}
.lp-step-card p{font-size:14px;color:var(--lp-text2);}

/* ── Philosophy ── */
.lp-philosophy{background:var(--lp-dark2);color:#fff;position:relative;overflow:hidden;}
.lp-philosophy::before{content:'';position:absolute;width:500px;height:500px;background:radial-gradient(circle,rgba(13,124,102,0.15) 0%,transparent 70%);top:-150px;right:-100px;}
.lp-philosophy .lp-section-title h2{color:#fff;}
.lp-philosophy .lp-section-title p{color:rgba(255,255,255,0.55);}
.lp-rules-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;max-width:800px;margin:0 auto;}
.lp-rule{background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);border-radius:14px;padding:24px;display:flex;gap:16px;align-items:flex-start;}
.lp-rule-icon{width:40px;height:40px;background:rgba(13,124,102,0.2);border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:18px;}
.lp-rule h4{font-size:16px;color:#fff;margin-bottom:4px;}
.lp-rule p{font-size:13px;color:rgba(255,255,255,0.55);margin:0;}

/* ── Calculator ── */
.lp-calculator{background:var(--lp-bg);}
.lp-calc-box{background:var(--lp-white);border:1px solid var(--lp-border);border-radius:var(--lp-radius);padding:40px;max-width:720px;margin:0 auto;}
.lp-calc-row{margin-bottom:24px;}
.lp-calc-row label{display:block;font-size:13px;font-weight:600;color:var(--lp-dark);margin-bottom:8px;}
.lp-calc-row input[type=range]{width:100%;accent-color:var(--lp-teal);cursor:pointer;height:6px;}
.lp-calc-vals{display:flex;justify-content:space-between;font-size:12px;color:var(--lp-text3);margin-top:4px;}
.lp-calc-current{display:inline-block;background:var(--lp-teal-light);color:var(--lp-teal);font-weight:700;font-size:14px;padding:4px 12px;border-radius:6px;margin-top:4px;font-family:var(--lp-heading);}
.lp-calc-result{background:var(--lp-teal-light);border-radius:14px;padding:28px;text-align:center;margin-top:20px;}
.lp-calc-result .label{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--lp-teal);margin-bottom:4px;font-weight:600;}
.lp-calc-result .val{font-family:var(--lp-heading);font-size:40px;font-weight:700;color:var(--lp-teal);}
.lp-calc-result .sub{font-size:13px;color:var(--lp-text2);margin-top:4px;}

/* ── Testimonials ── */
.lp-testimonials{background:var(--lp-white);}
.lp-test-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.lp-test-card{background:var(--lp-bg);border:1px solid var(--lp-border);border-radius:var(--lp-radius);padding:28px;}
.lp-test-stars{color:var(--lp-amber);font-size:14px;margin-bottom:12px;}
.lp-test-quote{font-size:14px;color:var(--lp-text);margin-bottom:16px;font-style:italic;}
.lp-test-author{display:flex;align-items:center;gap:10px;}
.lp-test-avatar{width:36px;height:36px;border-radius:50%;background:var(--lp-teal-light);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--lp-teal);font-size:14px;}
.lp-test-name{font-weight:600;font-size:13px;color:var(--lp-dark);}
.lp-test-role{font-size:11px;color:var(--lp-text3);}

/* ── Pricing ── */
.lp-pricing{background:var(--lp-bg);}
.lp-pricing-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;max-width:760px;margin:0 auto;}
.lp-price-card{background:var(--lp-white);border:1px solid var(--lp-border);border-radius:var(--lp-radius);padding:36px 32px;position:relative;}
.lp-price-card.featured{border-color:var(--lp-teal);box-shadow:0 8px 40px rgba(13,124,102,0.12);}
.lp-price-card.featured::before{content:'Most Popular';position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--lp-teal);color:#fff;font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:4px 16px;border-radius:20px;}
.lp-price-name{font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:var(--lp-text3);margin-bottom:8px;}
.lp-price-amount{font-family:var(--lp-heading);font-size:44px;font-weight:700;color:var(--lp-dark);margin-bottom:4px;}
.lp-price-amount span{font-size:16px;font-weight:400;color:var(--lp-text3);}
.lp-price-desc{font-size:13px;color:var(--lp-text2);margin-bottom:24px;}
.lp-price-features{list-style:none;padding:0;margin:0 0 28px;}
.lp-price-features li{padding:8px 0;font-size:14px;color:var(--lp-text);display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--lp-border);}
.lp-price-features li:last-child{border-bottom:none;}
.lp-price-features li::before{content:'✓';color:var(--lp-teal);font-weight:700;}

/* ── Final CTA ── */
.lp-cta{background:var(--lp-teal);padding:80px 0;text-align:center;}
.lp-cta h2{font-size:clamp(28px,3.5vw,42px);color:#fff;margin-bottom:12px;}
.lp-cta p{color:rgba(255,255,255,0.7);font-size:16px;max-width:500px;margin:0 auto 28px;}
.lp-cta .lp-btn-amber{font-size:16px;padding:14px 36px;}

/* ── Footer ── */
.lp-footer{background:var(--lp-dark);padding:48px 0 24px;color:rgba(255,255,255,0.4);font-size:13px;}
.lp-footer-inner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;}
.lp-footer-brand{font-family:var(--lp-heading);font-size:18px;font-weight:700;color:#fff;}
.lp-footer-brand span{color:var(--lp-amber);}
.lp-footer-links{display:flex;gap:24px;}
.lp-footer-links a{color:rgba(255,255,255,0.5);text-decoration:none;font-size:13px;transition:color .2s;}
.lp-footer-links a:hover{color:#fff;}

/* ── Auth Modal ── */
.lp-modal-overlay{display:none;position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,0.5);backdrop-filter:blur(4px);align-items:center;justify-content:center;padding:24px;}
.lp-modal-overlay.active{display:flex;}
.lp-modal{background:var(--lp-white);border-radius:20px;padding:40px 36px;width:100%;max-width:420px;position:relative;animation:lp-modal-in .3s ease;}
@keyframes lp-modal-in{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}
.lp-modal-close{position:absolute;top:16px;right:16px;width:32px;height:32px;border:none;background:var(--lp-bg);border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--lp-text3);transition:background .2s;}
.lp-modal-close:hover{background:var(--lp-border);}
.lp-modal-logo{text-align:center;margin-bottom:28px;}
.lp-modal-logo .brand{font-family:var(--lp-heading);font-size:24px;font-weight:700;color:var(--lp-teal);}
.lp-modal-logo .brand span{color:var(--lp-amber);}
.lp-modal-logo .sub{font-size:11px;color:var(--lp-text3);letter-spacing:3px;text-transform:uppercase;margin-top:4px;}
.lp-modal-tabs{display:flex;gap:0;background:var(--lp-bg);border-radius:10px;padding:4px;margin-bottom:24px;}
.lp-modal-tab{flex:1;padding:8px;text-align:center;font-size:13px;font-weight:600;border-radius:7px;cursor:pointer;color:var(--lp-text3);transition:all .2s;border:none;background:none;font-family:var(--lp-body);}
.lp-modal-tab.active{background:var(--lp-teal);color:#fff;box-shadow:0 2px 8px rgba(13,124,102,0.2);}
.lp-field{margin-bottom:16px;}
.lp-field label{display:block;font-size:11px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--lp-text3);margin-bottom:6px;}
.lp-field input{width:100%;background:var(--lp-bg);border:1.5px solid var(--lp-border);border-radius:8px;padding:11px 14px;font-size:14px;font-family:var(--lp-body);color:var(--lp-dark);outline:none;transition:border-color .2s;}
.lp-field input:focus{border-color:var(--lp-teal);}
.lp-field input::placeholder{color:var(--lp-text3);}
.lp-modal-btn{width:100%;background:var(--lp-teal);color:#fff;border:none;border-radius:8px;padding:12px;font-size:14px;font-weight:700;font-family:var(--lp-body);cursor:pointer;letter-spacing:0.5px;transition:all .2s;margin-top:8px;}
.lp-modal-btn:hover{background:var(--lp-teal-dark);}
.lp-modal-divider{display:flex;align-items:center;gap:12px;margin:16px 0;color:var(--lp-text3);font-size:12px;}
.lp-modal-divider::before,.lp-modal-divider::after{content:'';flex:1;height:1px;background:var(--lp-border);}
.lp-modal-google{width:100%;background:var(--lp-bg);color:var(--lp-dark);border:1.5px solid var(--lp-border);border-radius:8px;padding:11px;font-size:14px;font-weight:600;font-family:var(--lp-body);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;transition:all .2s;}
.lp-modal-google:hover{border-color:var(--lp-teal);background:var(--lp-teal-light);}
.lp-modal-link{text-align:center;margin-top:16px;font-size:13px;color:var(--lp-text2);}
.lp-modal-link a{color:var(--lp-teal);text-decoration:none;cursor:pointer;font-weight:600;}
.lp-modal-link a:hover{text-decoration:underline;}
.lp-modal-error{background:#fef2f2;border:1px solid #fecaca;border-radius:8px;padding:10px 14px;font-size:13px;color:#dc2626;margin-bottom:14px;display:none;}
.lp-modal-success{background:#f0fdf4;border:1px solid #bbf7d0;border-radius:8px;padding:10px 14px;font-size:13px;color:#16a34a;margin-bottom:14px;display:none;}

/* ── Mobile landing page ── */
@media(max-width:768px){
  .lp-nav-links a:not(.lp-btn){display:none;}
  .lp-hero h1{font-size:32px;}
  .lp-hero-sub{font-size:15px;}
  .lp-mockup-area{height:auto;display:flex;flex-direction:column;gap:16px;align-items:center;}
  .lp-mock-card{position:relative;left:auto;right:auto;top:auto;width:100%!important;max-width:300px;transform:none!important;}
  .lp-mock-card.mc2:hover{transform:translateY(-4px)!important;}
  .lp-proof-grid{gap:28px;}
  .lp-proof-item .num{font-size:28px;}
  .lp-steps-grid{grid-template-columns:1fr;}
  .lp-rules-grid{grid-template-columns:1fr;}
  .lp-test-grid{grid-template-columns:1fr;}
  .lp-pricing-grid{grid-template-columns:1fr;max-width:400px;}
  .lp-footer-inner{flex-direction:column;text-align:center;}
}

/* ═══════════════════════════════════════
   ONBOARDING SCREENS
═══════════════════════════════════════ */
.ob-screen{display:none;min-height:100vh;background:var(--lp-bg);font-family:var(--lp-body);box-sizing:border-box;flex-direction:column;}
.ob-screen.active{display:flex;}
.ob-screen *{box-sizing:border-box;}

/* Top bar */
.ob-topbar{background:rgba(255,255,255,0.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--lp-border);padding:0 24px;position:sticky;top:0;z-index:100;}
.ob-topbar-inner{max-width:1140px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:64px;}
.ob-topbar-brand{font-family:var(--lp-heading);font-size:20px;font-weight:700;color:var(--lp-teal);text-decoration:none;}
.ob-topbar-brand span{color:var(--lp-amber);}
.ob-exit-btn{display:inline-flex;align-items:center;gap:6px;background:transparent;border:1.5px solid var(--lp-border);border-radius:8px;padding:7px 14px;font-family:var(--lp-body);font-size:13px;font-weight:600;color:var(--lp-text2);cursor:pointer;transition:all .2s;}
.ob-exit-btn:hover{border-color:var(--lp-text3);color:var(--lp-text);}
.ob-exit-btn svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;}

/* Body wrapper */
.ob-body{flex:1;display:flex;flex-direction:column;align-items:center;padding:40px 24px 60px;}

/* Progress indicator */
.ob-progress{display:flex;align-items:center;gap:0;margin-bottom:8px;}
.ob-progress-step{display:flex;align-items:center;gap:0;}
.ob-progress-dot{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;font-family:var(--lp-body);transition:all .3s;}
.ob-progress-dot.done{background:var(--lp-teal);color:#fff;}
.ob-progress-dot.active{background:var(--lp-teal);color:#fff;box-shadow:0 0 0 4px rgba(13,124,102,0.15);}
.ob-progress-dot.pending{background:var(--lp-border);color:var(--lp-text3);}
.ob-progress-line{width:48px;height:2px;background:var(--lp-border);transition:background .3s;}
.ob-progress-line.done{background:var(--lp-teal);}
.ob-step-label{font-size:13px;color:var(--lp-text3);margin-bottom:32px;text-align:center;}

/* Card */
.ob-card{background:var(--lp-white);border:1px solid var(--lp-border);border-radius:var(--lp-radius);max-width:680px;width:100%;padding:40px;box-shadow:0 2px 16px rgba(0,0,0,0.04);}
.ob-card h2{font-family:var(--lp-heading);font-size:30px;font-weight:600;color:var(--lp-dark);margin-bottom:8px;line-height:1.2;}
.ob-card-sub{font-size:15px;color:var(--lp-text2);margin-bottom:28px;line-height:1.6;}

/* Section dividers */
.ob-section{font-size:11px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;color:var(--lp-text3);margin:24px 0 14px;display:flex;align-items:center;gap:12px;}
.ob-section::after{content:'';flex:1;height:1px;background:var(--lp-border);}

/* Asset chips */
.ob-chip-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:8px;}
.ob-chip{background:var(--lp-bg);border:1.5px solid var(--lp-border);border-radius:12px;padding:16px 10px 14px;text-align:center;cursor:pointer;transition:all .2s;position:relative;}
.ob-chip:hover{border-color:var(--lp-teal);background:var(--lp-teal-light);}
.ob-chip.active{border-color:var(--lp-teal);background:var(--lp-teal-light);}
.ob-chip-icon{width:36px;height:36px;margin:0 auto 8px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:rgba(13,124,102,0.08);color:var(--lp-teal);}
.ob-chip-icon svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;}
.ob-chip-label{font-size:12px;font-weight:600;color:var(--lp-text);line-height:1.3;}
.ob-chip-input{margin-top:10px;display:none;}
.ob-chip.active .ob-chip-input{display:block;}
.ob-chip-input input{width:100%;border:1.5px solid rgba(13,124,102,0.3);border-radius:7px;padding:6px 8px;font-size:13px;font-family:var(--lp-body);color:var(--lp-dark);background:#fff;outline:none;text-align:center;transition:border-color .2s;}
.ob-chip-input input:focus{border-color:var(--lp-teal);}
.ob-chip-input input::placeholder{color:var(--lp-text3);}

/* Goal cards */
.ob-goal-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:8px;}
.ob-goal-card{background:var(--lp-bg);border:1.5px solid var(--lp-border);border-radius:14px;padding:20px;cursor:pointer;transition:all .2s;position:relative;}
.ob-goal-card:hover{border-color:var(--lp-teal);background:var(--lp-teal-light);}
.ob-goal-card.selected{border-color:var(--lp-teal);background:var(--lp-teal-light);}
.ob-goal-icon{width:40px;height:40px;border-radius:11px;background:rgba(13,124,102,0.08);display:flex;align-items:center;justify-content:center;color:var(--lp-teal);margin-bottom:12px;}
.ob-goal-icon svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;}
.ob-goal-check{position:absolute;top:12px;right:12px;width:22px;height:22px;border-radius:50%;background:var(--lp-teal);display:none;align-items:center;justify-content:center;}
.ob-goal-card.selected .ob-goal-check{display:flex;}
.ob-goal-check svg{width:12px;height:12px;stroke:#fff;fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;}
.ob-goal-title{font-size:15px;font-weight:700;color:var(--lp-dark);margin-bottom:5px;font-family:var(--lp-body);}
.ob-goal-desc{font-size:13px;color:var(--lp-text2);line-height:1.55;}
.ob-goal-other-input{margin-top:12px;display:none;}
.ob-goal-card.selected .ob-goal-other-input{display:block;}
.ob-goal-other-input input{width:100%;border:1.5px solid rgba(13,124,102,0.3);border-radius:7px;padding:9px 12px;font-size:14px;font-family:var(--lp-body);color:var(--lp-dark);background:#fff;outline:none;transition:border-color .2s;}
.ob-goal-other-input input:focus{border-color:var(--lp-teal);}
.ob-goal-other-input input::placeholder{color:var(--lp-text3);}

/* Buttons */
.ob-btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--lp-teal);color:#fff;border:none;border-radius:10px;padding:13px 28px;font-family:var(--lp-body);font-size:15px;font-weight:700;cursor:pointer;transition:all .25s;box-shadow:0 2px 12px rgba(13,124,102,0.25);}
.ob-btn-primary:hover{background:var(--lp-teal-dark);transform:translateY(-1px);box-shadow:0 4px 20px rgba(13,124,102,0.35);}
.ob-btn-primary svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;}
.ob-btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:transparent;color:var(--lp-text2);border:1.5px solid var(--lp-border);border-radius:10px;padding:12px 22px;font-family:var(--lp-body);font-size:15px;font-weight:600;cursor:pointer;transition:all .2s;}
.ob-btn-ghost:hover{border-color:var(--lp-text3);color:var(--lp-text);}
.ob-btn-ghost svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.ob-btn-row{display:flex;justify-content:space-between;align-items:center;margin-top:32px;gap:12px;}
.ob-btn-full{width:100%;justify-content:center;}

/* Result screen */
.ob-result-hero{text-align:center;padding:28px 0 24px;border-bottom:1px solid var(--lp-border);margin-bottom:24px;}
.ob-result-label{font-size:11px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;color:var(--lp-text3);margin-bottom:10px;}
.ob-result-nw{font-family:var(--lp-heading);font-size:52px;font-weight:700;color:var(--lp-teal);letter-spacing:-1px;line-height:1;}
.ob-result-split{display:flex;justify-content:center;gap:40px;margin-top:16px;}
.ob-result-split-item{text-align:center;}
.ob-split-val{font-size:17px;font-weight:700;margin-bottom:3px;}
.ob-split-label{font-size:12px;color:var(--lp-text3);}
.ob-split-green{color:#16a34a;}
.ob-split-red{color:#dc2626;}

/* Progress bar */
.ob-goal-bar-wrap{margin:20px 0 24px;}
.ob-goal-bar-header{display:flex;justify-content:space-between;font-size:13px;color:var(--lp-text2);margin-bottom:7px;}
.ob-goal-bar-header strong{color:var(--lp-teal);font-weight:700;}
.ob-goal-bar{height:8px;background:var(--lp-border);border-radius:4px;overflow:hidden;}
.ob-goal-bar-fill{height:100%;background:linear-gradient(90deg,var(--lp-teal),#14b8a6);border-radius:4px;transition:width 1s ease;}

/* Insight boxes */
.ob-insight{border-radius:14px;padding:20px 22px;margin-bottom:16px;}
.ob-insight.teal{background:var(--lp-teal-light);border:1px solid rgba(13,124,102,0.18);}
.ob-insight.amber{background:var(--lp-amber-light);border:1px solid rgba(232,160,32,0.2);}
.ob-insight-title{font-size:13px;font-weight:700;margin-bottom:6px;display:flex;align-items:center;gap:7px;}
.ob-insight-title svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.ob-insight.teal .ob-insight-title{color:var(--lp-teal);}
.ob-insight.amber .ob-insight-title{color:#92400e;}
.ob-insight-text{font-size:14px;color:var(--lp-text2);line-height:1.65;}
.ob-insight-text strong{color:var(--lp-dark);font-weight:700;}

/* Mobile responsive */
@media(max-width:768px){
  .ob-card{padding:28px 20px;}
  .ob-card h2{font-size:24px;}
  .ob-chip-grid{grid-template-columns:repeat(2,1fr);}
  .ob-goal-grid{grid-template-columns:1fr;}
  .ob-result-nw{font-size:40px;}
  .ob-result-split{gap:24px;}
  .ob-btn-row{flex-direction:column-reverse;gap:10px;}
  .ob-btn-ghost,.ob-btn-primary{width:100%;justify-content:center;}
}