:root{
  --demo-bg:#f3f4ef;--demo-surface:#fff;--demo-surface-2:#f6f7f2;--demo-text:#141512;--demo-muted:#7f847a;--demo-line:#e4e6de;
  --demo-lime:#c9f35f;--demo-lime-2:#eafabe;--demo-purple:#8d76ff;--demo-dark:#171916;--demo-green:#19754a;--demo-red:#be534e;
  --phone-width:390px;--phone-height:844px;
}
html[data-theme="dark"]{
  --demo-bg:#0f100f;--demo-surface:#181a18;--demo-surface-2:#20231f;--demo-text:#f4f5ef;--demo-muted:#969b91;--demo-line:#2c302b;
  --demo-dark:#f1f3eb;--demo-green:#7edba5;--demo-red:#ff9892;
}
body.demo-page{background:var(--demo-bg);color:var(--demo-text);transition:background .25s ease,color .25s ease}.demo-page .noise{display:none}
.demo-site-nav{background:color-mix(in srgb,var(--demo-bg) 87%,transparent);backdrop-filter:blur(18px);border-bottom:1px solid color-mix(in srgb,var(--demo-line) 75%,transparent)}
.demo-page .brand,.demo-page .nav-links a{color:var(--demo-text)}.demo-page .btn-ghost{color:var(--demo-text);border-color:var(--demo-line)}
.nav-right-demo{display:flex;align-items:center;gap:14px}.theme-control{display:flex;align-items:center;gap:8px}.theme-label{font-size:11px;font-weight:700;color:var(--demo-muted)}
.ios-switch{width:48px;height:28px;border:0;border-radius:999px;padding:3px;background:#d9dcd3;cursor:pointer;transition:.25s;box-shadow:inset 0 0 0 1px rgba(0,0,0,.04)}.ios-switch span{display:block;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.18);transition:transform .25s}.ios-switch.on{background:#2ed158}.ios-switch.on span{transform:translateX(20px)}
.demo-intro{padding-top:88px;padding-bottom:34px;text-align:center}.demo-intro h1{font:800 clamp(43px,5vw,76px)/.98 Manrope;margin:18px auto 16px;max-width:920px;letter-spacing:-.055em}.demo-intro h1 span{color:#8b6cf6}.demo-intro>p{font-size:17px;line-height:1.6;color:var(--demo-muted);max-width:720px;margin:0 auto}.demo-badge{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border-radius:999px;border:1px solid var(--demo-line);background:var(--demo-surface);font-size:9px;font-weight:800;letter-spacing:.1em;color:var(--demo-text)}.demo-badge>span{width:6px;height:6px;border-radius:50%;background:#67c75c;box-shadow:0 0 0 4px rgba(103,199,92,.13)}.demo-note{margin:18px auto 0;padding:10px 14px;border-radius:12px;background:var(--demo-lime-2);color:#2a3319;font-size:11px;font-weight:600;max-width:560px}
.phone-demo-stage{display:grid;grid-template-columns:minmax(210px,1fr) auto minmax(210px,1fr);gap:44px;align-items:center;padding:34px 0 70px;max-width:1180px}.phone-shell-wrap{position:relative}.phone-shell{width:var(--phone-width);height:var(--phone-height);padding:10px;border-radius:56px;background:#0a0a0a;box-shadow:0 45px 90px rgba(25,27,20,.25),0 8px 22px rgba(0,0,0,.18);position:relative}.phone-shell:before{content:"";position:absolute;left:-3px;top:145px;width:3px;height:82px;border-radius:4px 0 0 4px;background:#1f1f1f}.phone-shell:after{content:"";position:absolute;right:-3px;top:180px;width:3px;height:100px;border-radius:0 4px 4px 0;background:#1f1f1f}.phone-hardware{position:absolute;z-index:20;top:19px;left:50%;transform:translateX(-50%);width:104px;height:29px;border-radius:20px;background:#030303}.speaker{position:absolute;width:33px;height:4px;border-radius:3px;background:#131313;left:31px;top:12px}.camera{position:absolute;width:7px;height:7px;border-radius:50%;background:#0e1731;right:15px;top:10px}
.phone-screen{height:100%;border-radius:47px;overflow:hidden;background:var(--demo-surface);color:var(--demo-text);position:relative;transition:background .25s,color .25s}.app-statusbar{height:48px;padding:13px 22px 0;display:flex;justify-content:space-between;align-items:flex-start;font-size:10px;font-weight:800;position:relative;z-index:12}.app-statusbar>div{display:flex;gap:5px;align-items:center}.battery{border:1px solid currentColor;border-radius:3px;font-size:7px;padding:1px 3px}
.mobile-view{display:none;height:calc(100% - 48px);overflow-y:auto;padding:0 17px 106px;scrollbar-width:none}.mobile-view::-webkit-scrollbar{display:none}.mobile-view.active{display:block}.mobile-topline{display:grid;grid-template-columns:42px 1fr 42px;align-items:center;padding:5px 0 10px}.app-wordmark{text-align:center;font:800 18px Manrope;letter-spacing:-.7px}.round-btn{width:38px;height:38px;border-radius:50%;border:1px solid var(--demo-line);background:var(--demo-surface-2);color:var(--demo-text);font-size:11px;font-weight:800}.profile-btn{background:var(--demo-dark);color:var(--demo-surface)}.notif-btn{position:relative;font-size:17px}.notif-btn i{position:absolute;width:7px;height:7px;border-radius:50%;background:#ff5e59;border:2px solid var(--demo-surface);right:3px;top:2px}
.wealth-pull-zone{height:30px;position:relative;z-index:8;transition:height .35s cubic-bezier(.2,.8,.2,1)}.wealth-pull-zone.open{height:204px}.pull-hint{position:absolute;top:0;left:50%;transform:translateX(-50%);white-space:nowrap;border:0;background:transparent;color:var(--demo-muted);font-size:8px;font-weight:700;letter-spacing:.01em;cursor:ns-resize}.pull-hint span{display:inline-block;margin-right:5px;transition:transform .3s}.wealth-pull-zone.open .pull-hint span{transform:rotate(180deg)}.wealth-drawer{position:absolute;left:0;right:0;top:-174px;padding:14px 15px 13px;border-radius:18px;background:var(--demo-dark);color:var(--demo-surface);opacity:0;transform:translateY(-18px);transition:.34s;pointer-events:none}.wealth-pull-zone.open .wealth-drawer{top:28px;opacity:1;transform:none;pointer-events:auto}.wealth-drawer-head{display:flex;justify-content:space-between;align-items:center;font-size:9px;color:color-mix(in srgb,var(--demo-surface) 65%,transparent)}.wealth-drawer>strong{display:block;font:800 27px Manrope;margin-top:4px}.wealth-drawer>small{font-size:8px;color:var(--demo-lime)}.wealth-breakdown{display:grid;grid-template-columns:1fr 1fr;gap:5px 16px;margin-top:12px}.wealth-breakdown div{display:flex;justify-content:space-between;border-top:1px solid color-mix(in srgb,var(--demo-surface) 14%,transparent);padding-top:6px;font-size:7px}.wealth-breakdown span{color:color-mix(in srgb,var(--demo-surface) 58%,transparent)}.wealth-breakdown b{font-size:7px}
.spendable-hero{text-align:center;padding:10px 0 17px}.spendable-hero>small{font-size:10px;color:var(--demo-muted);font-weight:600}.spendable-hero>strong{display:block;font:800 36px/1 Manrope;letter-spacing:-1.6px;margin:7px 0 10px}.spendable-hero>strong em{font-size:14px;font-style:normal;letter-spacing:0}.saving-delta{display:inline-flex;align-items:center;gap:4px;border:1px solid transparent;border-radius:999px;padding:6px 9px;font-size:7.5px;transition:background-color .24s,border-color .24s,color .24s}.saving-delta-arrow{font-size:11px}.saving-delta-label{font-size:7.5px}.saving-delta b{font-size:8px}.saving-delta.is-positive{background:#e9f8ed;border-color:#c7e9d0;color:#23633d}.saving-delta.is-positive .saving-delta-arrow{color:#2d9a59}.saving-delta.is-negative{background:#fff0ed;border-color:#ffd1c8;color:#91432f}.saving-delta.is-negative .saving-delta-arrow{color:#e05d41}.saving-delta.is-neutral{background:#f1eff5;border-color:#ddd9e5;color:#686270}
.quick-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:2px 0 15px}.quick-action{border:0;background:transparent;color:var(--demo-text);display:flex;flex-direction:column;gap:6px;align-items:center;font-size:8px;cursor:pointer}.quick-action>span{width:48px;height:48px;border-radius:16px;background:var(--demo-surface-2);border:1px solid var(--demo-line);display:grid;place-items:center;font-size:18px;font-weight:700;transition:.2s}.quick-action:active>span{transform:scale(.94);background:var(--demo-lime)}.quick-action b{font-size:8px}
.smart-split-banner{width:100%;display:grid;grid-template-columns:42px 1fr 15px;gap:9px;align-items:center;text-align:left;border:0;border-radius:17px;background:var(--demo-dark);color:var(--demo-surface);padding:12px 12px;margin-bottom:17px;cursor:pointer}.split-orb{width:38px;height:38px;border-radius:13px;background:var(--demo-lime);color:#1b1d18;display:grid;place-items:center;font-size:16px}.smart-split-banner small,.smart-split-banner strong,.smart-split-banner span{display:block}.smart-split-banner small{font-size:6px;letter-spacing:.12em;color:var(--demo-lime)}.smart-split-banner strong{font-size:9px;margin:2px 0}.smart-split-banner span{font-size:7px;color:color-mix(in srgb,var(--demo-surface) 62%,transparent)}.smart-split-banner>b{font-size:20px;font-weight:400}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;margin:2px 1px 7px}.section-head>div strong,.section-head>div small{display:block}.section-head strong{font:800 15px Manrope}.section-head small{font-size:8px;color:var(--demo-muted)}.section-head button{border:0;background:transparent;color:var(--demo-muted);font-size:8px;font-weight:700}.transaction-list{background:var(--demo-surface-2);border:1px solid var(--demo-line);border-radius:18px;padding:3px 11px}.transaction-row{display:grid;grid-template-columns:36px 1fr auto;gap:8px;align-items:center;padding:10px 0;border-bottom:1px solid var(--demo-line)}.transaction-row:last-child{border-bottom:0}.merchant-icon{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;font:800 11px Manrope}.merchant-icon.grocery{background:#e8f7c9;color:#315324}.merchant-icon.fun{background:#ede8ff;color:#5d45c4}.merchant-icon.netflix{background:#1c1c1c;color:#e50914;font-size:16px}.merchant-icon.salary{background:#dff6e8;color:#19754a;font-size:14px}.tx-main strong,.tx-main small,.tx-amount strong,.tx-amount small{display:block}.tx-main strong,.tx-amount strong{font-size:8.5px}.tx-main small,.tx-amount small{font-size:6.8px;color:var(--demo-muted);margin-top:2px}.tx-amount{text-align:right}.transaction-row.income .tx-amount strong{color:var(--demo-green)}
.level-preview{margin-top:14px;background:linear-gradient(145deg,#272a26,#121411);color:#fff;border-radius:19px;padding:14px;display:grid;grid-template-columns:1fr 48px;gap:6px 8px;cursor:pointer}.level-preview small,.level-preview strong,.level-preview span{display:block}.level-preview small{font-size:6px;color:var(--demo-lime);letter-spacing:.12em}.level-preview strong{font-size:11px;margin:3px 0}.level-preview span{font-size:7px;color:#949a90}.level-preview p{grid-column:1/-1;margin:4px 0 0;padding-top:9px;border-top:1px solid #343733;font-size:7.3px;line-height:1.45;color:#b6bbb0}.level-preview p b{color:var(--demo-lime)}.mini-level-ring{width:45px;height:45px;border-radius:50%;background:conic-gradient(var(--demo-lime) 78%,#40443e 0);display:grid;place-items:center;position:relative}.mini-level-ring:before{content:"";position:absolute;width:34px;height:34px;border-radius:50%;background:#191b18}.mini-level-ring span{z-index:1!important;color:#fff!important;font:800 13px Manrope}
.inside-header{display:grid;grid-template-columns:38px 1fr 38px;align-items:center;padding:6px 0 18px}.inside-header>div{text-align:center}.inside-header small,.inside-header strong{display:block}.inside-header small{font-size:6px;letter-spacing:.13em;color:var(--demo-muted)}.inside-header strong{font-size:10px;margin-top:2px}.inside-header button{width:34px;height:34px;border-radius:50%;border:1px solid var(--demo-line);background:var(--demo-surface-2);color:var(--demo-text);font-size:20px}.header-add{font-size:14px!important}.split-mobile-intro h2{font:800 25px Manrope;letter-spacing:-1px;margin:0 0 5px}.split-mobile-intro p{font-size:8px;line-height:1.5;color:var(--demo-muted);margin:0 0 14px}.salary-mobile-card{display:block;border-radius:18px;background:var(--demo-dark);color:var(--demo-surface);padding:15px}.salary-mobile-card>span{font-size:7px;color:color-mix(in srgb,var(--demo-surface) 60%,transparent)}.salary-mobile-card>div{display:flex;align-items:baseline;margin-top:3px}.salary-mobile-card input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:inherit;font:800 29px Manrope;letter-spacing:-1px}.salary-mobile-card b{font-size:11px}.mobile-mode-selector{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:10px 0}.mobile-mode-selector button{border:1px solid var(--demo-line);background:var(--demo-surface-2);color:var(--demo-text);border-radius:15px;padding:9px 5px;display:grid;grid-template-columns:auto 1fr;column-gap:4px;align-items:center;text-align:left}.mobile-mode-selector button>span{grid-row:1/3;font-size:14px}.mobile-mode-selector b{font-size:8px}.mobile-mode-selector small{font-size:6px;color:var(--demo-muted)}.mobile-mode-selector button.active{background:var(--demo-lime);border-color:var(--demo-lime);color:#1c2112}.mobile-mode-selector button.active small{color:#516329}.split-result-card{border:1px solid var(--demo-line);border-radius:18px;background:var(--demo-surface-2);padding:14px}.split-result-card>small{font-size:6px;letter-spacing:.12em;color:var(--demo-muted)}.split-result-card>strong{display:block;font:800 25px Manrope;margin:3px 0}.split-result-card>span{font-size:7px;color:var(--demo-green);font-weight:700}.distribution-bar{height:9px;border-radius:999px;overflow:hidden;display:flex;margin:13px 0 5px;background:#eee}.distribution-bar i{transition:width .28s cubic-bezier(.22,.8,.24,1)}.distribution-bar i:nth-child(1){background:#242724}.distribution-bar i:nth-child(2){background:#8d76ff}.distribution-bar i:nth-child(3){background:#5ca870}.distribution-bar i:nth-child(4){background:var(--demo-lime)}.split-legend{position:relative;height:10px;font-size:6px;color:var(--demo-muted)}.split-legend span{position:absolute;top:0;transform:translateX(-50%);white-space:nowrap;transition:left .28s cubic-bezier(.22,.8,.24,1)}.allocation-mobile-list{margin:10px 0}.allocation-mobile-list article{display:grid;grid-template-columns:34px 1fr auto;gap:8px;align-items:center;padding:10px 2px;border-bottom:1px solid var(--demo-line)}.alloc-icon{width:31px;height:31px;border-radius:10px;display:grid;place-items:center;font-size:11px}.alloc-icon.fixed{background:#eceee9}.alloc-icon.goals{background:#eeeaff;color:#674fd0}.alloc-icon.emergency{background:#e3f4e6;color:#388552}.allocation-mobile-list strong,.allocation-mobile-list small{display:block}.allocation-mobile-list strong{font-size:8px}.allocation-mobile-list small{font-size:6.5px;color:var(--demo-muted);margin-top:2px}.allocation-mobile-list>b,.allocation-mobile-list article>b{font-size:8px}.year-impact{background:var(--demo-lime-2);color:#2e3819;border-radius:17px;padding:13px}.year-impact span,.year-impact strong{display:block}.year-impact span{font-size:7px;font-weight:700}.year-impact strong{font:800 20px Manrope;margin:3px 0}.year-impact p{font-size:7px;line-height:1.45;margin:0;color:#5d6b3d}.shield-mobile{margin-top:10px;border:1px solid var(--demo-line);border-radius:17px;padding:12px;background:var(--demo-surface-2)}.shield-mobile>div:first-child{display:flex;gap:7px;align-items:center}.shield-mobile>div:first-child>span{font-size:18px}.shield-mobile strong,.shield-mobile small{display:block}.shield-mobile strong{font-size:9px}.shield-mobile small{font-size:6.5px;color:var(--demo-muted)}.shield-options{display:flex;background:color-mix(in srgb,var(--demo-line) 65%,transparent);border-radius:9px;padding:3px;margin:10px 0 6px}.shield-options button{flex:1;border:0;background:transparent;color:var(--demo-muted);padding:6px;border-radius:7px;font-size:7px;font-weight:800}.shield-options button.active{background:var(--demo-dark);color:var(--demo-surface)}.shield-mobile p{font-size:6.5px;color:var(--demo-muted);line-height:1.45;margin:0}
.goals-total-card{background:var(--demo-dark);color:var(--demo-surface);border-radius:19px;padding:16px;margin-bottom:10px}.goals-total-card small,.goals-total-card strong,.goals-total-card span{display:block}.goals-total-card small{font-size:7px;color:color-mix(in srgb,var(--demo-surface) 60%,transparent)}.goals-total-card strong{font:800 25px Manrope;margin:3px 0}.goals-total-card span{font-size:7px;color:var(--demo-lime)}.mobile-goals-list{display:grid;gap:9px}.mobile-goal{border:1px solid var(--demo-line);background:var(--demo-surface-2);border-radius:18px;padding:13px}.mobile-goal.featured{background:var(--demo-lime-2);color:#273117}.goal-top{display:flex;justify-content:space-between;align-items:center}.goal-top span{font-size:22px}.goal-top b{font-size:8px}.mobile-goal>small{display:block;font-size:6px;letter-spacing:.1em;color:var(--demo-muted);margin-top:7px}.mobile-goal>strong{display:block;font:800 15px Manrope;margin:2px 0}.mobile-goal>p{font-size:7px;color:var(--demo-muted);margin:0}.goal-progress{height:6px;border-radius:999px;background:var(--demo-line);overflow:hidden;margin:10px 0}.goal-progress i{display:block;height:100%;border-radius:inherit;background:var(--demo-purple)}.mobile-goal.featured .goal-progress i{background:#5c7c22}.mobile-goal footer{display:flex;justify-content:space-between;font-size:6.5px;color:var(--demo-muted)}
.current-level-card{display:grid;grid-template-columns:92px 1fr;gap:15px;align-items:center;background:var(--demo-dark);color:var(--demo-surface);border-radius:20px;padding:16px}.big-ring{width:84px;height:84px;border-radius:50%;background:conic-gradient(var(--demo-lime) 78%,#353934 0);display:grid;place-items:center;position:relative}.big-ring:before{content:"";position:absolute;width:65px;height:65px;border-radius:50%;background:#171916}.big-ring>span{z-index:1;font:800 25px Manrope;color:#fff}.big-ring small{display:block;font:700 6px DM Sans;text-align:center;color:#9fa499}.current-level-card>div:last-child>small{font-size:6px;color:var(--demo-lime);letter-spacing:.1em}.current-level-card h2{font:800 19px Manrope;margin:2px 0}.current-level-card p{font-size:7px;color:#aeb3aa;margin:0 0 8px}.xp-bar{height:5px;border-radius:999px;background:#363a35;overflow:hidden}.xp-bar i{display:block;height:100%;background:var(--demo-lime)}.current-level-card>div:last-child>span{display:block;font-size:6px;color:#858b81;margin-top:4px}.level-path{margin-top:10px}.level-row{display:grid;grid-template-columns:35px 1fr auto;gap:8px;align-items:center;padding:11px 2px;border-bottom:1px solid var(--demo-line)}.level-dot{width:32px;height:32px;border-radius:50%;border:1px solid var(--demo-line);display:grid;place-items:center;font:800 9px Manrope;background:var(--demo-surface-2)}.level-row.done .level-dot{background:#dff4df;color:#2f7846}.level-row.current .level-dot{background:var(--demo-lime);border-color:var(--demo-lime);color:#21310a}.level-row.major{margin:5px -4px;padding:12px 7px;border:0;border-radius:14px;background:var(--demo-lime-2);color:#2d3818}.level-row.major .level-dot{background:#253116;color:var(--demo-lime);border-color:#253116}.level-row small,.level-row strong,.level-row p{display:block}.level-row small{font-size:5.8px;color:var(--demo-muted);letter-spacing:.08em}.level-row strong{font-size:8px;margin:2px 0}.level-row p{font-size:6.4px;line-height:1.4;color:var(--demo-muted);margin:0}.level-row>span{font-size:6.5px;font-weight:800;color:var(--demo-muted)}
.mobile-tabbar{position:absolute;left:12px;right:12px;bottom:12px;height:72px;border:1px solid color-mix(in srgb,var(--demo-line) 82%,transparent);border-radius:25px;background:color-mix(in srgb,var(--demo-surface) 88%,transparent);backdrop-filter:blur(18px);display:grid;grid-template-columns:repeat(4,1fr);padding:7px 6px 8px;z-index:20;box-shadow:0 12px 30px rgba(0,0,0,.08)}.tab-btn{border:0;background:transparent;color:var(--demo-muted);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:7px}.tab-btn>span{font-size:17px;line-height:1}.tab-btn>b{font-size:6.5px}.tab-btn.active{color:var(--demo-text)}.tab-btn.active>span{width:31px;height:25px;border-radius:10px;background:var(--demo-lime);color:#202b0d;display:grid;place-items:center}
.demo-feature-notes{display:grid;gap:84px}.demo-feature-notes article{max-width:245px}.demo-feature-notes b{display:inline-grid;place-items:center;width:29px;height:29px;border-radius:10px;background:var(--demo-lime);color:#27320d;font-size:8px;margin-bottom:10px}.demo-feature-notes strong{display:block;font:800 17px Manrope;margin-bottom:5px}.demo-feature-notes p{font-size:11px;line-height:1.55;color:var(--demo-muted);margin:0}.left-notes{text-align:right;justify-items:end}.left-notes b{margin-left:auto}.demo-bottom{background:var(--demo-lime);color:#19200f;border-radius:30px;padding:42px 46px;display:flex;align-items:center;justify-content:space-between;margin-bottom:60px}.demo-bottom h2{font:800 31px/1.12 Manrope;letter-spacing:-1px;margin:14px 0 0}.demo-badge.dark{background:rgba(255,255,255,.28);border-color:rgba(0,0,0,.1);color:#1d2411}.demo-toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,24px);opacity:0;pointer-events:none;background:#111;color:white;border-radius:12px;padding:11px 15px;font-size:10px;z-index:99;transition:.22s}.demo-toast.show{transform:translate(-50%,0);opacity:1}
@media(max-width:1000px){.phone-demo-stage{grid-template-columns:1fr}.demo-feature-notes{display:none}.phone-shell-wrap{justify-self:center}.phone-demo-stage{padding-top:20px}.nav-right-demo .btn{display:none}}
@media(max-width:720px){.demo-site-nav .nav-links{display:none}.nav-right-demo{gap:5px}.theme-label{display:none}.demo-intro{padding:55px 16px 22px}.demo-intro h1{font-size:42px}.demo-intro>p{font-size:14px}.phone-demo-stage{width:100%;padding:0 0 42px}.phone-shell-wrap{width:100%}.phone-shell{width:100%;height:auto;min-height:calc(100dvh - 70px);padding:0;border-radius:0;background:var(--demo-surface);box-shadow:none}.phone-hardware{display:none}.phone-shell:before,.phone-shell:after{display:none}.phone-screen{height:calc(100dvh - 70px);min-height:700px;border-radius:0;padding-top:env(safe-area-inset-top)}.mobile-view{height:calc(100% - 48px)}.demo-bottom{margin:0 12px 28px;padding:28px;align-items:flex-start;gap:22px;flex-direction:column}.demo-bottom h2{font-size:25px}.demo-note{font-size:10px}.app-statusbar{padding-left:20px;padding-right:20px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* V6 — contrast fixes, playful levels, Friends, Pro */
html[data-theme="light"] .quick-action>span{box-shadow:0 8px 22px rgba(40,34,65,.13);border-width:1.5px}
html[data-theme="light"] .quick-action b{color:#241f2d;font-weight:800}
html[data-theme="light"] .smart-split-banner{box-shadow:0 16px 34px rgba(83,66,220,.28)}
html[data-theme="light"] .transaction-list{border-color:#ddd7e7;box-shadow:0 12px 32px rgba(54,42,88,.08)}
html[data-theme="light"] .inside-header strong{color:#17151d}
html[data-theme="light"] .inside-header small{color:#746f80}

/* Wealth pull-down: explicit high-contrast dark treatment */
html[data-theme="dark"] .wealth-drawer{
  background:linear-gradient(145deg,#252039 0%,#18151f 62%,#111016 100%);
  border:1px solid #3b3550;
  box-shadow:0 20px 48px rgba(0,0,0,.42);
}
html[data-theme="dark"] .wealth-drawer-head span:first-child,
html[data-theme="dark"] .wealth-breakdown span{color:#aaa4bc}
html[data-theme="dark"] .wealth-drawer strong,
html[data-theme="dark"] .wealth-breakdown b{color:#fff!important}
html[data-theme="dark"] .wealth-drawer>small{color:#79dcff!important;font-weight:800}
html[data-theme="dark"] .wealth-eye{color:#c6bcff}
html[data-theme="dark"] .wealth-breakdown>div{border-top-color:#343041}

/* Playful levels */
.level-hero-game{display:grid;grid-template-columns:92px 1fr;gap:14px;align-items:center;padding:16px;border-radius:25px;background:radial-gradient(circle at 15% 20%,rgba(255,122,89,.35),transparent 34%),linear-gradient(135deg,#2b2442,#17151d);color:#fff;box-shadow:0 16px 34px rgba(39,29,67,.20);margin-bottom:12px;overflow:hidden;position:relative}
.level-hero-game:after{content:"";position:absolute;width:130px;height:130px;border:1px solid rgba(255,255,255,.08);border-radius:50%;right:-55px;top:-52px}
.level-orbit{width:84px;height:84px;border-radius:50%;display:grid;place-items:center;position:relative;background:conic-gradient(#ff7a59 0 78%,#4b425c 78% 100%);box-shadow:0 0 0 7px rgba(255,255,255,.045)}
.level-orbit:before{content:"";position:absolute;inset:8px;border-radius:50%;background:#1b1724}
.level-orbit>span{position:relative;z-index:2;font:800 27px/1 Manrope;display:flex;flex-direction:column;align-items:center}.level-orbit small{font-size:7px;letter-spacing:.13em;color:#bdb5cf}.level-orbit>i{position:absolute;right:-2px;bottom:5px;width:27px;height:27px;border-radius:10px;display:grid;place-items:center;background:#ffd65a;font-style:normal;font-size:12px;z-index:3;box-shadow:0 5px 14px rgba(255,214,90,.25)}
.level-hero-copy>small{font-size:7px;color:#bdb5cf;letter-spacing:.12em;font-weight:800}.level-hero-copy h2{font:800 15px/1.15 Manrope;margin:4px 0 4px}.level-hero-copy p{font-size:8px;color:#c8c2d1;margin:0 0 9px}.xp-bar.game{height:7px;background:#443c51}.xp-bar.game i{background:linear-gradient(90deg,#ff7a59,#ffd65a)}.xp-line{display:flex;justify-content:space-between;font-size:7px;margin-top:5px}.xp-line span{color:#aaa2b7}
.next-reward-card{display:grid;grid-template-columns:46px 1fr 22px;gap:10px;align-items:center;padding:13px;border:1px solid #e5dcff;background:linear-gradient(135deg,#f0ecff,#fff0eb);border-radius:20px;margin-bottom:10px;color:#2b2440}.reward-icon{width:44px;height:44px;border-radius:15px;background:#6c5cff;color:#fff;display:grid;place-items:center;font:800 13px Manrope;box-shadow:0 8px 17px rgba(108,92,255,.24)}.next-reward-card small{display:block;font-size:6px;letter-spacing:.07em;color:#756a8e;font-weight:800}.next-reward-card strong{display:block;font-size:10px;margin:2px 0}.next-reward-card p{font-size:7px;color:#756f80;margin:0;line-height:1.35}.reward-lock{font-size:10px}
html[data-theme="dark"] .next-reward-card{background:linear-gradient(135deg,#2b2343,#38231e);border-color:#473b58;color:#fff}html[data-theme="dark"] .next-reward-card small,html[data-theme="dark"] .next-reward-card p{color:#bdb4ca}
.streak-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:10px 0 15px}.streak-strip>div{background:var(--demo-surface-2);border:1px solid var(--demo-line);border-radius:16px;padding:10px 7px;text-align:center}.streak-strip span{display:block;font-size:15px}.streak-strip b{display:block;font-size:9px;margin:3px 0 1px}.streak-strip small{font-size:6px;color:var(--demo-muted)}
.challenge-head,.level-roadmap-head,.friend-list-head,.pro-section-title{display:flex;justify-content:space-between;align-items:end;margin:14px 1px 8px}.challenge-head small,.pro-section-title small{display:block;font-size:6px;letter-spacing:.09em;color:var(--demo-muted);font-weight:800}.challenge-head strong,.level-roadmap-head strong,.friend-list-head strong,.pro-section-title strong{display:block;font-size:11px}.challenge-head>span{font-size:7px;background:#eee9ff;color:#5c4be0;border-radius:999px;padding:5px 7px;font-weight:800}.level-roadmap-head button{border:0;background:transparent;color:#6c5cff;font-size:7px;font-weight:800}
.mission-list{display:grid;gap:7px}.mission{display:grid;grid-template-columns:34px 1fr auto;gap:9px;align-items:center;border:1px solid var(--demo-line);background:var(--demo-surface);border-radius:16px;padding:9px}.mission-check{width:32px;height:32px;border-radius:12px;display:grid;place-items:center;background:var(--demo-surface-2);color:var(--demo-muted);font-size:10px;font-weight:800}.mission.done .mission-check{background:#e9f8f0;color:#28785a}.mission strong{display:block;font-size:8px}.mission small{display:block;font-size:6.5px;color:var(--demo-muted);margin-top:2px}.mission>b{font-size:7px;color:#6c5cff}
html[data-theme="dark"] .mission.done .mission-check{background:#183226;color:#85dbb2}.level-path.playful{margin-top:0}

/* Friends */
.friends-search{height:42px;display:flex;align-items:center;gap:8px;background:var(--demo-surface-2);border:1px solid var(--demo-line);border-radius:15px;padding:0 12px;margin-bottom:13px}.friends-search span{color:var(--demo-muted);font-size:14px}.friends-search input{border:0;outline:0;background:transparent;color:var(--demo-text);font:600 9px DM Sans;width:100%}.friends-search input::placeholder{color:var(--demo-muted)}
.friend-favorites{display:flex;gap:10px;overflow:auto;padding:1px 1px 8px;scrollbar-width:none}.friend-favorites::-webkit-scrollbar{display:none}.friend-chip{border:0;background:transparent;color:var(--demo-text);display:flex;flex-direction:column;align-items:center;gap:5px;min-width:49px}.friend-chip b{font-size:7px}.friend-avatar{width:44px;height:44px;border-radius:16px;display:grid;place-items:center;color:#fff;font:800 13px Manrope;box-shadow:0 7px 17px rgba(0,0,0,.10)}.a1{background:linear-gradient(145deg,#7a65ff,#9c8cff)}.a2{background:linear-gradient(145deg,#ff7a59,#ff9b7d)}.a3{background:linear-gradient(145deg,#35a8d0,#70d6f5)}.a4{background:linear-gradient(145deg,#d99f27,#f3c95f);color:#382b08}.a5{background:linear-gradient(145deg,#d8679b,#ee91bd)}
.friend-list-head small{font-size:6px;color:var(--demo-muted)}.friend-list{display:grid;gap:6px}.friend-row{display:grid;grid-template-columns:40px 1fr auto;gap:9px;align-items:center;padding:10px;border-radius:17px;background:var(--demo-surface);border:1px solid var(--demo-line)}.friend-row .friend-avatar{width:38px;height:38px;border-radius:13px;font-size:11px}.friend-row strong{display:block;font-size:8.5px}.friend-row small{display:block;font-size:6.5px;color:var(--demo-muted);margin-top:2px}.send-friend{border:1px solid #ded6ff;background:#f0ecff;color:#5947d9;border-radius:10px;padding:7px 9px;font-size:7px;font-weight:800}.send-friend:active{transform:scale(.97)}html[data-theme="dark"] .send-friend{background:#2a2342;border-color:#493e69;color:#c9c0ff}

/* Send sheet */
.send-sheet{position:absolute;inset:0;z-index:60;pointer-events:none;opacity:0;transition:.22s}.send-sheet.open{pointer-events:auto;opacity:1}.sheet-backdrop{position:absolute;inset:0;border:0;background:rgba(8,7,12,.46);backdrop-filter:blur(4px)}.sheet-card{position:absolute;left:8px;right:8px;bottom:8px;background:var(--demo-surface);color:var(--demo-text);border:1px solid var(--demo-line);border-radius:25px;padding:10px 15px 16px;transform:translateY(110%);transition:.28s cubic-bezier(.2,.9,.2,1);box-shadow:0 -16px 50px rgba(0,0,0,.2)}.send-sheet.open .sheet-card{transform:translateY(0)}.sheet-handle{width:38px;height:4px;border-radius:99px;background:var(--demo-line);margin:0 auto 12px}.sheet-person{display:flex;align-items:center;gap:10px;margin-bottom:13px}.sheet-person .friend-avatar{width:40px;height:40px}.sheet-person small{display:block;font-size:6px;color:var(--demo-muted);letter-spacing:.1em}.sheet-person strong{font-size:11px}.sheet-card>label{font-size:7px;font-weight:800;color:var(--demo-muted)}.sheet-amount{display:flex;align-items:baseline;border-bottom:1px solid var(--demo-line);margin-top:3px}.sheet-amount input{width:100%;border:0;background:transparent;outline:0;color:var(--demo-text);font:800 27px Manrope;padding:5px 0}.sheet-amount b{font-size:9px}.sheet-presets{display:flex;gap:6px;margin:10px 0}.sheet-presets button{flex:1;border:1px solid var(--demo-line);background:var(--demo-surface-2);color:var(--demo-text);border-radius:11px;padding:8px 4px;font-size:7px;font-weight:800}.sheet-send{width:100%;border:0;border-radius:14px;background:linear-gradient(135deg,#6c5cff,#8e72ff);color:#fff;padding:12px;font-size:8px;font-weight:800;box-shadow:0 9px 20px rgba(108,92,255,.25)}

/* Pro */
.pro-view{background:radial-gradient(circle at 100% 0%,rgba(114,215,255,.08),transparent 24%),var(--demo-surface)}.pro-header .pro-pill{font-size:6px;font-weight:800;letter-spacing:.08em;background:linear-gradient(135deg,#1d1a27,#3c3157);color:#fff;padding:5px 7px;border-radius:8px}.pro-coming{position:relative;overflow:hidden;border-radius:24px;padding:18px;background:radial-gradient(circle at 90% 10%,rgba(114,215,255,.20),transparent 30%),linear-gradient(140deg,#242033,#0f0e14);color:#fff;border:1px solid #373044;box-shadow:0 18px 38px rgba(22,17,35,.23)}.pro-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:13px;background:linear-gradient(145deg,#6c5cff,#ff7a59);font:800 11px Manrope;margin-bottom:14px}.pro-coming small{font-size:6px;color:#b8afc7;letter-spacing:.1em;font-weight:800}.pro-coming h2{font:800 23px/1 Manrope;margin:5px 0 7px}.pro-coming p{font-size:8px;line-height:1.5;color:#c9c2d0;margin:0;max-width:90%}.pro-metrics{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}.pro-metrics article{border-radius:17px;border:1px solid var(--demo-line);background:var(--demo-surface-2);padding:11px}.pro-metrics small{display:block;font-size:6px;color:var(--demo-muted)}.pro-metrics strong{display:block;font:800 12px Manrope;margin:3px 0}.pro-metrics span{font-size:6px;color:#5f50d7}.pro-section-title{display:block}.pro-section-title strong{margin-top:2px}.pro-feature-list{display:grid;gap:7px}.pro-feature-list article{display:grid;grid-template-columns:34px 1fr;gap:9px;padding:10px;border:1px solid var(--demo-line);border-radius:16px;background:var(--demo-surface)}.pro-feature-list article>span{width:32px;height:32px;border-radius:11px;display:grid;place-items:center;background:#eee9ff;color:#5b48d8;font-size:8px;font-weight:800}.pro-feature-list strong{display:block;font-size:8.5px}.pro-feature-list p{font-size:6.6px;line-height:1.4;color:var(--demo-muted);margin:2px 0 0}.pro-cta{width:100%;margin-top:10px;border:0;border-radius:15px;padding:12px 13px;background:#17151d;color:#fff;font-size:8px;font-weight:800;display:flex;justify-content:space-between}.pro-cta span{color:#a99cff}html[data-theme="dark"] .pro-feature-list article>span{background:#2b2343;color:#c7bcff}html[data-theme="dark"] .pro-cta{background:#f2eff8;color:#18151e}html[data-theme="dark"] .pro-cta span{color:#6c5cff}

/* Bottom nav: 5 clear destinations, Friends centered, Pro at bottom-right */
.mobile-tabbar{grid-template-columns:repeat(5,1fr);height:74px;padding:7px 4px 8px}.tab-btn>b{font-size:6px}.friends-tab>span{width:36px!important;height:31px!important;margin-top:-13px;border-radius:13px!important;background:linear-gradient(145deg,#6c5cff,#8e72ff)!important;color:#fff!important;box-shadow:0 7px 18px rgba(108,92,255,.30);font-size:16px!important}.friends-tab b{color:var(--demo-text);font-weight:800}.pro-tab>span{font:800 10px Manrope!important;border-radius:9px}.pro-tab.active>span{background:linear-gradient(145deg,#17151d,#493c67)!important;color:#fff!important}.pro-tab.active{color:var(--demo-text)}

@media(max-width:380px){
  .level-hero-game{grid-template-columns:74px 1fr;padding:13px;gap:10px}.level-orbit{width:69px;height:69px}.level-orbit>span{font-size:23px}.next-reward-card{grid-template-columns:39px 1fr 18px}.reward-icon{width:38px;height:38px}.streak-strip{gap:5px}.streak-strip>div{padding:8px 4px}.friend-row{grid-template-columns:36px 1fr auto;padding:8px}.send-friend{padding:6px 7px}.pro-coming{padding:15px}.mobile-tabbar{left:7px;right:7px}
}


/* V7 — live app QA: light-mode legibility + dark pull-down readability */
:root{
  --zy-violet:#6c5cff;--zy-violet-soft:#eeeaff;--zy-coral:#ff7a59;--zy-coral-soft:#fff0eb;
  --zy-cyan:#35a8d0;--zy-cyan-soft:#e8f8ff;--zy-gold:#b68b16;--zy-gold-soft:#fff5cf;
}
/* Light mode: actions must read as tappable controls, not black tiles */
html:not([data-theme="dark"]) .quick-actions{gap:9px;margin-top:6px}
html:not([data-theme="dark"]) .quick-action{color:#211d2a;font-weight:800}
html:not([data-theme="dark"]) .quick-action>span{background:#fff;border:1px solid #ded8e8;box-shadow:0 7px 17px rgba(61,45,104,.09);color:#392e50}
html:not([data-theme="dark"]) .quick-action:nth-child(1)>span{background:#eeeaff;border-color:#d9d1ff;color:#5b48db}
html:not([data-theme="dark"]) .quick-action:nth-child(2)>span{background:#e8f8ff;border-color:#c9ebf8;color:#267896}
html:not([data-theme="dark"]) .quick-action:nth-child(3)>span{background:#fff0eb;border-color:#ffd7ca;color:#c65335}
html:not([data-theme="dark"]) .quick-action:nth-child(4)>span{background:#fff5cf;border-color:#f3e2a4;color:#7b6212}
html:not([data-theme="dark"]) .quick-action b{color:#292431;font-size:8px}
html:not([data-theme="dark"]) .transaction-list{background:#fff;border-color:#e4dfeb;box-shadow:0 10px 28px rgba(57,42,95,.055)}
html:not([data-theme="dark"]) .smart-split-banner{background:linear-gradient(135deg,#6c5cff,#4f3bd7);color:#fff;box-shadow:0 13px 26px rgba(108,92,255,.24)}
html:not([data-theme="dark"]) .smart-split-banner small{color:#d8d0ff}
html:not([data-theme="dark"]) .smart-split-banner span{color:#ddd8ef}
html:not([data-theme="dark"]) .split-orb{background:#fff;color:#6c5cff}
html:not([data-theme="dark"]) .saving-delta{background:#fff0eb;color:#8d402d;border:1px solid #ffd3c5}
html:not([data-theme="dark"]) .saving-delta span{color:#d85b3b}
html:not([data-theme="dark"]) .saving-delta.is-positive{background:#e9f8ed;color:#23633d;border-color:#c7e9d0}
html:not([data-theme="dark"]) .saving-delta.is-positive span{color:#2d9a59}
html:not([data-theme="dark"]) .saving-delta.is-negative{background:#fff0ed;color:#91432f;border-color:#ffd1c8}
html:not([data-theme="dark"]) .saving-delta.is-negative span{color:#e05d41}
html:not([data-theme="dark"]) .saving-delta.is-neutral{background:#f1eff5;color:#686270;border-color:#ddd9e5}

/* Dark mode: do not flip semantic dark surfaces to white. */
html[data-theme="dark"]{--demo-dark:#17131f;--demo-surface:#121117;--demo-surface-2:#1b1821;--demo-line:#302b38;--demo-text:#f7f4ff;--demo-muted:#aaa4b3}
html[data-theme="dark"] .phone-screen{background:radial-gradient(circle at 110% 0%,rgba(114,215,255,.08),transparent 27%),radial-gradient(circle at -10% 18%,rgba(108,92,255,.10),transparent 25%),#121117}
html[data-theme="dark"] .wealth-pull-zone.open{height:208px}
html[data-theme="dark"] .wealth-drawer{background:linear-gradient(145deg,#272032,#17131f);color:#fff;border:1px solid #3b3248;box-shadow:0 18px 38px rgba(0,0,0,.28)}
html[data-theme="dark"] .wealth-drawer-head{color:#c5bdce}
html[data-theme="dark"] .wealth-drawer>strong{color:#fff;text-shadow:none}
html[data-theme="dark"] .wealth-drawer>small{color:#7edfff}
html[data-theme="dark"] .wealth-breakdown div{border-color:#43384e}
html[data-theme="dark"] .wealth-breakdown span{color:#aaa2b5}
html[data-theme="dark"] .wealth-breakdown b{color:#fff}
html[data-theme="dark"] .pull-hint{color:#c1bac8}
html[data-theme="dark"] .round-btn{background:#1e1a25;border-color:#393340;color:#fff}
html[data-theme="dark"] .profile-btn{background:linear-gradient(145deg,#6c5cff,#8a6eff);color:#fff}
html[data-theme="dark"] .spendable-hero>strong{color:#fff}
html[data-theme="dark"] .saving-delta{background:#34211c;color:#ffb099;border:1px solid #513027}
html[data-theme="dark"] .saving-delta b{color:#fff}
html[data-theme="dark"] .quick-action{color:#f7f4ff}
html[data-theme="dark"] .quick-action>span{border-color:#3b3443;box-shadow:none}
html[data-theme="dark"] .quick-action:nth-child(1)>span{background:#2b2443;color:#c5bbff}
html[data-theme="dark"] .quick-action:nth-child(2)>span{background:#17303a;color:#8cdcf5}
html[data-theme="dark"] .quick-action:nth-child(3)>span{background:#39211b;color:#ffad95}
html[data-theme="dark"] .quick-action:nth-child(4)>span{background:#372f16;color:#ffe58a}
html[data-theme="dark"] .quick-action b{color:#f4f0fa}
html[data-theme="dark"] .smart-split-banner{background:linear-gradient(135deg,#5b49e9,#4434bb);color:#fff;box-shadow:0 14px 28px rgba(0,0,0,.18)}
html[data-theme="dark"] .split-orb{background:#f8f6ff;color:#604be6}
html[data-theme="dark"] .smart-split-banner small{color:#d3cbff}
html[data-theme="dark"] .smart-split-banner span{color:#d0cad8}
html[data-theme="dark"] .transaction-list{background:#17141c;border-color:#302b38}
html[data-theme="dark"] .transaction-row{border-color:#2d2834}
html[data-theme="dark"] .tx-main strong,html[data-theme="dark"] .tx-amount strong{color:#f8f5ff}
html[data-theme="dark"] .level-preview{background:radial-gradient(circle at 100% 0%,rgba(255,122,89,.22),transparent 38%),linear-gradient(145deg,#292039,#17131f);border:1px solid #3c3248}
html[data-theme="dark"] .level-preview small{color:#b9aeff}
html[data-theme="dark"] .level-preview p{border-color:#3e3548;color:#c4bdcb}
html[data-theme="dark"] .level-preview p b{color:#ffad95}
html[data-theme="dark"] .mobile-tabbar{background:rgba(20,17,26,.94);border-color:#37313e;box-shadow:0 12px 32px rgba(0,0,0,.34)}
html[data-theme="dark"] .tab-btn{color:#8f8998}
html[data-theme="dark"] .tab-btn.active{color:#fff}
html[data-theme="dark"] .tab-btn.active>span{background:#2c2544;color:#c7bdff}
html[data-theme="dark"] .friends-tab b{color:#f4f0fa}

/* Level view: clearer game hierarchy */
.level-hero-game{box-shadow:0 15px 34px rgba(38,28,64,.17)}
.next-reward-card{box-shadow:0 8px 22px rgba(91,70,165,.08)}
.mission{transition:transform .15s,border-color .15s}.mission:active{transform:scale(.985)}
.level-row.major{box-shadow:0 8px 20px rgba(108,92,255,.08)}

/* Friends + Pro touch targets */
.send-friend,.sheet-presets button,.sheet-send,.pro-cta{min-height:34px}
.friend-row{min-height:58px}.friend-chip{min-width:52px}
.pro-feature-list article{min-height:55px}

@media(max-width:390px){
  .mobile-view{padding-left:14px;padding-right:14px}
  .quick-actions{gap:6px}.quick-action>span{width:46px;height:46px}.quick-action b{font-size:7.5px}
  .mobile-tabbar{left:6px;right:6px}.tab-btn>b{font-size:5.8px}
}

/* =========================================================
   V8 — unified Zyora theme polish
   Goal: one coherent palette, strong contrast, no leftover
   light-mode surfaces inside dark mode.
   ========================================================= */
:root{
  --zy-bg:#f6f5fa;
  --zy-surface:#ffffff;
  --zy-elevated:#f0edf7;
  --zy-border:#e3dfea;
  --zy-text:#191620;
  --zy-muted:#706b79;
  --zy-purple:#6652e8;
  --zy-purple-2:#8b72ff;
  --zy-purple-soft:#eeeaff;
  --zy-coral:#f47255;
  --zy-cyan:#3ca9d2;
  --zy-gold:#d09a18;
  --zy-positive:#23785b;
}
html[data-theme="dark"]{
  --demo-bg:#0b0a0f;
  --demo-surface:#121017;
  --demo-surface-2:#1a1720;
  --demo-text:#f8f6fc;
  --demo-muted:#aaa4b1;
  --demo-line:#312c38;
  --demo-dark:#1d1924;
  --demo-green:#80d9b2;
  --demo-red:#ff9a94;
  --zy-bg:#0b0a0f;
  --zy-surface:#121017;
  --zy-elevated:#1a1720;
  --zy-border:#312c38;
  --zy-text:#f8f6fc;
  --zy-muted:#aaa4b1;
  color-scheme:dark;
}

/* Theme switch belongs to Zyora, not iOS-green. */
.ios-switch.on{background:linear-gradient(135deg,#6652e8,#8b72ff)}
html[data-theme="dark"] .ios-switch{background:#39343f;box-shadow:inset 0 0 0 1px #48414f}
html[data-theme="dark"] .ios-switch.on{background:linear-gradient(135deg,#6652e8,#8b72ff)}

/* Phone canvas and global typography */
html[data-theme="dark"] .phone-screen,
html[data-theme="dark"] .pro-view{
  background:
    radial-gradient(circle at 102% 0%,rgba(60,169,210,.07),transparent 24%),
    radial-gradient(circle at -7% 15%,rgba(102,82,232,.09),transparent 23%),
    #121017;
}
html[data-theme="dark"] .inside-header strong,
html[data-theme="dark"] .section-head strong,
html[data-theme="dark"] .friend-list-head strong,
html[data-theme="dark"] .challenge-head strong,
html[data-theme="dark"] .level-roadmap-head strong,
html[data-theme="dark"] .pro-section-title strong{color:#f8f6fc}
html[data-theme="dark"] .inside-header small,
html[data-theme="dark"] .section-head small,
html[data-theme="dark"] .friend-list-head small,
html[data-theme="dark"] .challenge-head small,
html[data-theme="dark"] .pro-section-title small{color:#aaa4b1}

/* Pull-down wealth: high contrast, restrained elevated panel */
html[data-theme="dark"] .wealth-pull-zone.open{height:210px}
html[data-theme="dark"] .wealth-drawer{
  background:linear-gradient(155deg,#26202f 0%,#19151f 68%,#151219 100%);
  border:1px solid #41384b;
  color:#fff;
  box-shadow:0 18px 38px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.035)
}
html[data-theme="dark"] .wealth-drawer-head{color:#cbc4d1}
html[data-theme="dark"] .wealth-drawer>strong{color:#fff!important}
html[data-theme="dark"] .wealth-drawer>small{color:#7edfff!important}
html[data-theme="dark"] .wealth-breakdown>div{border-top-color:#403748}
html[data-theme="dark"] .wealth-breakdown span{color:#b7afbe!important}
html[data-theme="dark"] .wealth-breakdown b{color:#fff!important}
html[data-theme="dark"] .pull-hint{color:#b8b1c0}

/* Home actions + transactions */
html[data-theme="dark"] .round-btn{background:#1b1820;border-color:#393340;color:#f8f6fc}
html[data-theme="dark"] .profile-btn{background:linear-gradient(145deg,#6652e8,#8a70ff);border-color:transparent;color:#fff}
html[data-theme="dark"] .quick-action>span{border:1px solid transparent;box-shadow:inset 0 0 0 1px rgba(255,255,255,.055)}
html[data-theme="dark"] .quick-action:nth-child(1)>span{background:#28213f;color:#c9c1ff}
html[data-theme="dark"] .quick-action:nth-child(2)>span{background:#17303b;color:#91ddf5}
html[data-theme="dark"] .quick-action:nth-child(3)>span{background:#382019;color:#ffb19b}
html[data-theme="dark"] .quick-action:nth-child(4)>span{background:#352d15;color:#ffe18a}
html[data-theme="dark"] .quick-action b{color:#f2eef8}
html[data-theme="dark"] .saving-delta{background:#2d1d19;color:#f6aa94;border-color:#493029}
html[data-theme="dark"] .saving-delta b{color:#fff}
html[data-theme="dark"] .saving-delta.is-positive{background:#173128;color:#91dfb8;border-color:#29513f}
html[data-theme="dark"] .saving-delta.is-positive b{color:#effff6}
html[data-theme="dark"] .saving-delta.is-positive .saving-delta-arrow{color:#78d7a5}
html[data-theme="dark"] .saving-delta.is-negative{background:#38201b;color:#ffb29c;border-color:#5a332a}
html[data-theme="dark"] .saving-delta.is-negative b{color:#fff4f1}
html[data-theme="dark"] .saving-delta.is-negative .saving-delta-arrow{color:#ff8f73}
html[data-theme="dark"] .saving-delta.is-neutral{background:#28242d;color:#bbb4c2;border-color:#403948}
html[data-theme="dark"] .smart-split-banner{background:linear-gradient(135deg,#5c49df,#4737b8);border:1px solid #6a56e5;color:#fff;box-shadow:0 13px 27px rgba(0,0,0,.22)}
html[data-theme="dark"] .smart-split-banner small{color:#d5ceff}
html[data-theme="dark"] .smart-split-banner span{color:#ddd8e5}
html[data-theme="dark"] .split-orb{background:#f3f0ff;color:#5b48db}
html[data-theme="dark"] .transaction-list{background:#17141b;border-color:#302b36;box-shadow:none}
html[data-theme="dark"] .transaction-row{border-color:#2c2731}
html[data-theme="dark"] .tx-main strong,html[data-theme="dark"] .tx-amount strong{color:#f6f2fa}
html[data-theme="dark"] .tx-main small,html[data-theme="dark"] .tx-amount small{color:#9f99a7}
html[data-theme="dark"] .merchant-icon.grocery{background:#342e18;color:#f2d56c}
html[data-theme="dark"] .merchant-icon.fun{background:#29223e;color:#c9bfff}
html[data-theme="dark"] .merchant-icon.netflix{background:#24171d;color:#ff6478}
html[data-theme="dark"] .merchant-icon.salary{background:#163127;color:#83d9b1}

/* Smart Split: eliminate light leftovers in dark mode */
html[data-theme="dark"] .salary-mobile-card{background:linear-gradient(145deg,#24202c,#18151d);color:#fff;border:1px solid #393240}
html[data-theme="dark"] .salary-mobile-card>span{color:#aaa3b0}
html[data-theme="dark"] .mobile-mode-selector{background:transparent;border:0}
html[data-theme="dark"] .mobile-mode-selector button{background:#1a1720;border-color:#332d3b;color:#f6f3f9}
html[data-theme="dark"] .mobile-mode-selector button small{color:#9f99a7}
html[data-theme="dark"] .mobile-mode-selector button.active{background:linear-gradient(135deg,#6652e8,#7d63f2);border-color:#846cff;color:#fff;box-shadow:0 7px 17px rgba(75,57,174,.26)}
html[data-theme="dark"] .mobile-mode-selector button.active small{color:#ddd7ff}
html[data-theme="dark"] .split-result-card,
html[data-theme="dark"] .shield-mobile{background:#18151d;border-color:#302b37;color:#f8f6fc}
html[data-theme="dark"] .split-result-card>strong{color:#fff}
html[data-theme="dark"] .split-result-card>span{color:#80d9b2}
html[data-theme="dark"] .distribution-bar{background:#29252e}
html[data-theme="dark"] .allocation-mobile-list article{border-color:#2d2833}
html[data-theme="dark"] .allocation-mobile-list strong,
html[data-theme="dark"] .allocation-mobile-list article>b{color:#f5f1f8}
html[data-theme="dark"] .alloc-icon.fixed{background:#28242d;color:#cac3cf}
html[data-theme="dark"] .alloc-icon.goals{background:#29223f;color:#c8beff}
html[data-theme="dark"] .alloc-icon.emergency{background:#173128;color:#84dbb4}
html[data-theme="dark"] .alloc-icon.spend{background:#38201a;color:#ffad97}
html[data-theme="dark"] .year-impact{background:linear-gradient(135deg,#27213e,#302019);border:1px solid #44334c;color:#f6f2fb}
html[data-theme="dark"] .year-impact strong{color:#c5bbff}
html[data-theme="dark"] .year-impact p{color:#bbb4c2}
html[data-theme="dark"] .shield-options{background:#24202a}
html[data-theme="dark"] .shield-options button{color:#aaa4b1}
html[data-theme="dark"] .shield-options button.active{background:#6652e8;color:#fff;box-shadow:0 4px 12px rgba(71,52,173,.25)}

/* Goals */
html[data-theme="dark"] .goals-total-card{background:linear-gradient(135deg,#5b49df,#7a61ef);color:#fff;box-shadow:0 15px 30px rgba(0,0,0,.21)}
html[data-theme="dark"] .goals-total-card small{color:#ddd7ff}
html[data-theme="dark"] .goals-total-card span{color:#d9f2ff}
html[data-theme="dark"] .mobile-goal{background:#17141c;border-color:#302b37;color:#f7f4fa}
html[data-theme="dark"] .mobile-goal.featured{background:linear-gradient(135deg,#29223f,#352019);border-color:#42354b;color:#f7f3fb}
html[data-theme="dark"] .mobile-goal>small,
html[data-theme="dark"] .mobile-goal>p,
html[data-theme="dark"] .mobile-goal footer{color:#aaa4b1}
html[data-theme="dark"] .goal-progress{background:#302b37}
html[data-theme="dark"] .goal-progress i{background:linear-gradient(90deg,#6652e8,#f47255)}

/* Levels: playful but readable; no pale cards in dark mode */
html[data-theme="dark"] .level-hero-game{background:radial-gradient(circle at 12% 15%,rgba(244,114,85,.26),transparent 35%),linear-gradient(140deg,#29213d,#17141c);border:1px solid #3b3149;box-shadow:0 16px 34px rgba(0,0,0,.25)}
html[data-theme="dark"] .level-orbit{background:conic-gradient(#f47255 0 78%,#453c51 78% 100%)}
html[data-theme="dark"] .level-orbit:before{background:#18141e}
html[data-theme="dark"] .level-orbit small,
html[data-theme="dark"] .level-hero-copy>small{color:#c6bfd0}
html[data-theme="dark"] .level-hero-copy p{color:#cbc4d2}
html[data-theme="dark"] .xp-bar.game{background:#403747}
html[data-theme="dark"] .next-reward-card{background:linear-gradient(135deg,#28213e,#332019);border-color:#45374d;color:#fff;box-shadow:none}
html[data-theme="dark"] .next-reward-card small{color:#bcb4c7}
html[data-theme="dark"] .next-reward-card p{color:#c5bec9}
html[data-theme="dark"] .streak-strip>div{background:#18151d;border-color:#302b37;color:#f6f3f9}
html[data-theme="dark"] .streak-strip small{color:#9f99a7}
html[data-theme="dark"] .challenge-head>span{background:#29223f;color:#cabfff;border:1px solid #3f355d}
html[data-theme="dark"] .level-roadmap-head button{color:#b7acff}
html[data-theme="dark"] .mission{background:#17141c;border-color:#302b37;color:#f5f2f8;box-shadow:none}
html[data-theme="dark"] .mission-check{background:#24202a;color:#b0a9b8}
html[data-theme="dark"] .mission.done .mission-check{background:#173128;color:#89ddb8}
html[data-theme="dark"] .mission small{color:#9f99a7}
html[data-theme="dark"] .mission>b{color:#b8adff}
html[data-theme="dark"] .level-row{border-color:#2d2833;color:#f5f2f8}
html[data-theme="dark"] .level-dot{background:#1c1822;border-color:#393240;color:#d8d2dc}
html[data-theme="dark"] .level-row.done .level-dot{background:#173128;color:#83d9b2;border-color:#28513f}
html[data-theme="dark"] .level-row.current .level-dot{background:#6652e8;border-color:#8069f4;color:#fff}
html[data-theme="dark"] .level-row small,
html[data-theme="dark"] .level-row p,
html[data-theme="dark"] .level-row>span{color:#aaa4b1}
html[data-theme="dark"] .level-row.major{background:linear-gradient(135deg,#29223f,#342019);border:1px solid #43364b;color:#fff;box-shadow:none}
html[data-theme="dark"] .level-row.major .level-dot{background:#f47255;color:#fff;border-color:#f47255}
html[data-theme="dark"] .level-row.major small,
html[data-theme="dark"] .level-row.major p{color:#bbb4c4}

/* Friends: calmer cards + clear payment controls */
html[data-theme="dark"] .friends-search{background:#18151d;border-color:#312c38}
html[data-theme="dark"] .friends-search input{color:#f7f4fa}
html[data-theme="dark"] .friends-search input::placeholder{color:#88828e}
html[data-theme="dark"] .friend-chip{color:#f4f0f8}
html[data-theme="dark"] .friend-row{background:#17141c;border-color:#302b37;box-shadow:none}
html[data-theme="dark"] .friend-row strong{color:#f6f2f9}
html[data-theme="dark"] .friend-row small{color:#9f99a7}
html[data-theme="dark"] .send-friend{background:#29223f;border-color:#443861;color:#c9c0ff;box-shadow:none}
html[data-theme="dark"] .send-friend:active{background:#332a4e}
html[data-theme="dark"] .sheet-backdrop{background:rgba(5,4,8,.62)}
html[data-theme="dark"] .sheet-card{background:#18151d;border-color:#37313e;color:#f7f4fa;box-shadow:0 -18px 55px rgba(0,0,0,.45)}
html[data-theme="dark"] .sheet-handle{background:#423b48}
html[data-theme="dark"] .sheet-presets button{background:#211d27;border-color:#37313e;color:#e9e4ed}
html[data-theme="dark"] .sheet-send{background:linear-gradient(135deg,#6652e8,#876cf8);color:#fff}

/* Pro: professional, dark-native—not inverted light UI */
html[data-theme="dark"] .pro-header .pro-pill{background:linear-gradient(135deg,#2b2440,#463b61);border:1px solid #52466c;color:#fff}
html[data-theme="dark"] .pro-coming{background:radial-gradient(circle at 88% 8%,rgba(60,169,210,.15),transparent 31%),linear-gradient(140deg,#211c2c,#111016);border-color:#373044;box-shadow:0 18px 38px rgba(0,0,0,.27)}
html[data-theme="dark"] .pro-coming p{color:#c7c0ce}
html[data-theme="dark"] .pro-metrics article{background:#18151d;border-color:#302b37;color:#f7f4fa}
html[data-theme="dark"] .pro-metrics small{color:#9f99a7}
html[data-theme="dark"] .pro-metrics span{color:#b6acff}
html[data-theme="dark"] .pro-feature-list article{background:#17141c;border-color:#302b37;color:#f6f2f9}
html[data-theme="dark"] .pro-feature-list article>span{background:#29223f;color:#c9c0ff;border:1px solid #40355c}
html[data-theme="dark"] .pro-feature-list p{color:#a8a2ae}
html[data-theme="dark"] .pro-cta{background:linear-gradient(135deg,#6652e8,#7f65f2);color:#fff;border:1px solid #8c76fa;box-shadow:0 10px 23px rgba(0,0,0,.20)}
html[data-theme="dark"] .pro-cta span{color:#fff}

/* Navigation: clearer state hierarchy and no stray white/grey tile */
html[data-theme="dark"] .mobile-tabbar{background:rgba(17,15,21,.95);border-color:#35303b;box-shadow:0 14px 34px rgba(0,0,0,.42)}
html[data-theme="dark"] .tab-btn{color:#88828f}
html[data-theme="dark"] .tab-btn>b{color:inherit}
html[data-theme="dark"] .tab-btn.active{color:#f8f6fc}
html[data-theme="dark"] .tab-btn.active>span{background:#29223f;color:#c9c0ff}
html[data-theme="dark"] .friends-tab>span{background:linear-gradient(145deg,#6652e8,#8a70ff)!important;color:#fff!important;box-shadow:0 7px 18px rgba(82,63,190,.31)}
html[data-theme="dark"] .friends-tab b{color:#f0ecf6}
html[data-theme="dark"] .pro-tab>span{background:#201c25;color:#a9a2b0;border:1px solid #342f39}
html[data-theme="dark"] .pro-tab.active>span{background:linear-gradient(145deg,#f47255,#8a70ff)!important;color:#fff!important;border-color:transparent}
html[data-theme="dark"] .pro-tab.active{color:#fff}

/* Light mode final contrast pass */
html:not([data-theme="dark"]) .phone-screen{background:radial-gradient(circle at 102% 0%,rgba(60,169,210,.07),transparent 24%),radial-gradient(circle at -7% 15%,rgba(102,82,232,.06),transparent 23%),#fff}
html:not([data-theme="dark"]) .round-btn{background:#fff;border-color:#ded9e6;color:#28222f;box-shadow:0 4px 13px rgba(51,39,82,.06)}
html:not([data-theme="dark"]) .profile-btn{background:linear-gradient(145deg,#6652e8,#8a70ff);color:#fff;border-color:transparent}
html:not([data-theme="dark"]) .quick-action>span{border-width:1.5px;box-shadow:0 8px 18px rgba(47,36,80,.10)}
html:not([data-theme="dark"]) .quick-action b{font-weight:800;color:#26202e}
html:not([data-theme="dark"]) .mobile-mode-selector button{background:#fff;border-color:#ddd7e7;box-shadow:0 4px 12px rgba(49,38,82,.04)}
html:not([data-theme="dark"]) .mobile-mode-selector button.active{background:linear-gradient(135deg,#6652e8,#8066f4);border-color:#6652e8;color:#fff;box-shadow:0 8px 17px rgba(86,67,197,.22)}
html:not([data-theme="dark"]) .mobile-mode-selector button.active small{color:#e6e0ff}
html:not([data-theme="dark"]) .split-result-card{background:#fff;border-color:#ded9e6;box-shadow:0 8px 20px rgba(45,34,77,.05)}
html:not([data-theme="dark"]) .shield-options button.active{background:#6652e8;color:#fff}
html:not([data-theme="dark"]) .goals-total-card{background:linear-gradient(135deg,#6652e8,#8a70ff);color:#fff}
html:not([data-theme="dark"]) .current-level-card{background:linear-gradient(140deg,#28213b,#17151d);color:#fff}
html:not([data-theme="dark"]) .level-row.current .level-dot{background:#6652e8;border-color:#6652e8;color:#fff}
html:not([data-theme="dark"]) .level-row.major{background:linear-gradient(135deg,#f0ecff,#fff0eb);color:#30283f}
html:not([data-theme="dark"]) .level-row.major .level-dot{background:#f47255;color:#fff;border-color:#f47255}
html:not([data-theme="dark"]) .send-friend{background:#eeeaff;border-color:#d9d0ff;color:#5542cf}
html:not([data-theme="dark"]) .pro-cta{background:linear-gradient(135deg,#1c1824,#332946);color:#fff}

/* Touch/readability pass */
.quick-action>span{min-width:48px;min-height:48px}
.mobile-mode-selector button,.send-friend,.sheet-presets button,.sheet-send,.pro-cta{cursor:pointer}
@media(max-width:390px){
  .wealth-drawer>strong{font-size:25px}
  .friend-row strong{font-size:8.2px}
  .pro-feature-list p{font-size:6.5px}
}


/* V9 — screenshot-driven polish */
.demo-note{
  background:linear-gradient(135deg,#f4f1ff 0%,#f8f5ff 100%);
  color:#4d456d;
  border:1px solid #e5deff;
  box-shadow:0 10px 24px rgba(92,75,224,.06);
}
.phone-demo-stage{
  grid-template-columns:minmax(180px,220px) auto minmax(180px,220px);
  gap:28px;
  justify-content:center;
}
.demo-feature-notes article{max-width:210px}
.demo-feature-notes strong{font-size:16px}
.demo-feature-notes p{font-size:10.5px}
@media(max-width:1260px){
  .phone-demo-stage{grid-template-columns:1fr;justify-items:center}
  .demo-feature-notes{display:none}
}

/* Brand-consistent toggle and dark header */
.ios-switch.on{background:#6c5cff}
html[data-theme="dark"] .demo-site-nav{
  border-bottom-color:rgba(255,255,255,.04);
  box-shadow:none;
}
html[data-theme="dark"] .demo-page .brand-mark{
  background:linear-gradient(145deg,#1d1a26,#2a2536)!important;
  color:#c3b8ff!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);
}

/* Dark pull-down wealth panel readability */
html[data-theme="dark"] .wealth-drawer{
  background:linear-gradient(160deg,#2b2440 0%,#1a1624 58%,#111018 100%);
  color:#fbfaff!important;
  border:1px solid #3d3651;
  box-shadow:0 22px 55px rgba(0,0,0,.48);
}
html[data-theme="dark"] .wealth-drawer-head,
html[data-theme="dark"] .wealth-drawer-head span:first-child{
  color:#b6aec8!important;
}
html[data-theme="dark"] .wealth-drawer>strong{
  color:#ffffff!important;
  text-shadow:0 1px 0 rgba(0,0,0,.18);
}
html[data-theme="dark"] .wealth-drawer>small{
  color:#84ddff!important;
  font-weight:800;
}
html[data-theme="dark"] .wealth-breakdown span{
  color:#aaa3bd!important;
}
html[data-theme="dark"] .wealth-breakdown b{
  color:#ffffff!important;
}
html[data-theme="dark"] .wealth-breakdown div{
  border-top-color:#3a344c!important;
}

/* Pro headline + premium readability */
.pro-header strong{
  line-height:1.08;
  max-width:175px;
}
.pro-coming h2{font-size:25px}
.pro-coming p{
  max-width:100%;
  color:#dcd5e8;
}
html[data-theme="dark"] .pro-coming{
  border-color:#3c3451;
  box-shadow:0 18px 42px rgba(8,7,14,.42);
}

/* V15 — forgiving pull-down gesture in the app demo */
.wealth-pull-zone{
  height:46px;
  touch-action:none;
  user-select:none;
  -webkit-user-select:none;
}
.wealth-pull-zone.open{height:222px!important}
.pull-hint{
  width:100%;
  min-height:44px;
  padding:0 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:grab;
}
.wealth-pull-zone.is-dragging .pull-hint{cursor:grabbing}
.wealth-pull-zone.open .wealth-drawer{top:44px}