/* Strippi Studio: shared spacing, typography and restrained surfaces. */
:root{--studio-radius:16px;--studio-gap:24px}
body{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;letter-spacing:-.012em;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font-family:inherit}
main{max-width:1400px;padding:42px 40px 88px}
h1,html.night h1{font-size:clamp(28px,2.7vw,38px);line-height:1.18;font-weight:600;letter-spacing:-1.3px}
h2,html.night h2{font-size:17px;font-weight:600;letter-spacing:-.35px;line-height:1.4}
.eyebrow{font-size:11px;font-weight:600;letter-spacing:2px;margin-bottom:12px}
.heading{margin-bottom:28px;gap:24px}.heading p:not(.eyebrow){font-size:14px;line-height:1.6;margin-top:10px;max-width:580px}
.toolbar{margin-bottom:26px}.segmented{padding:4px}.segmented button{padding:8px 17px;font-size:13px;min-height:38px}
.card,.kpi,html.night .card,html.night .kpi{border-radius:var(--studio-radius);padding:24px;box-shadow:0 4px 18px #10152006}
.card-head{margin-bottom:16px;gap:16px}.card-head h2{margin:0}
.kpis,.mercury-analysis,.settings-grid,.focus-details-grid{gap:var(--studio-gap)}
.kpi .number,html.night .kpi .number{font-size:clamp(26px,2.7vw,36px);font-weight:550;letter-spacing:-1.1px;line-height:1.2;margin:16px 0 10px;font-variant-numeric:tabular-nums}
.kpi label{font-size:13px;font-weight:500}.kpi small{font-size:12px;line-height:1.6;display:block}.kpi .quiet{margin-top:14px}
.row{padding:16px 0;gap:14px}.row small{line-height:1.6;margin-top:4px}.row strong,td.amount,.number{font-variant-numeric:tabular-nums}
button{transition:background .18s,border-color .18s,box-shadow .18s}button:focus-visible,summary:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
button,html.night button{border-radius:10px}.primary,html.night button.primary,html.night #mercury-new{box-shadow:none;min-height:42px}
body>aside{padding:28px 18px 20px}body>aside nav{padding:6px;border:0;background:transparent;box-shadow:none;gap:6px;margin-top:38px}
body>aside nav button{min-height:46px;padding:12px 14px;border-radius:10px;transform:none!important}
body>aside nav button span{font-size:14px}body>aside nav button:hover{transform:none!important}
.brand{padding:0 12px}.mercury-wordmark{font-size:25px}.brand>small{font-size:11px;letter-spacing:.2px}
.shell>header{min-height:70px;padding:14px 40px}.aside-note{font-size:12px;line-height:1.7}
.focus-todo .todo-row:last-child{border-bottom:0}.focus-todo>small{line-height:1.6}
table{font-size:13px}th{font-size:12px;letter-spacing:.03em}th,td{padding:16px 14px}
.bank-tile{border-radius:12px;padding:18px;margin:10px 0}.bank-tile small{font-size:12px}
dialog{border-radius:20px;padding:28px}.coach-dialog.companion-panel{border-radius:22px;padding:0;width:400px}
.companion-header{padding:17px 18px}.companion-scroll{padding:22px 18px}.companion-welcome h3{font-size:24px;letter-spacing:-.65px;line-height:1.25}
.companion-suggestions button{padding:13px 14px;border-radius:12px;min-height:46px}.companion-answer,.companion-question{font-size:14px;line-height:1.7;padding:14px 16px}
.companion-figure{filter:drop-shadow(0 8px 8px #0002)}.companion-shell{fill:#e8eee7;stroke:#a9b6ad;stroke-width:1}.companion-face{fill:#152321}.companion-eyes{fill:#d9a441}.companion-seam{stroke:#a7b7ad;fill:none;stroke-width:1}.companion-highlight{fill:none;stroke:#fff;stroke-width:2;opacity:.75}.companion-hand{fill:#dce6dd;stroke:#a9b6ad;stroke-width:1}.companion-light{fill:#d9a441}.companion-body{animation-duration:6s}.arm-right{animation:none}.companion-shadow{fill:#101e2522}
#strippi-companion{width:66px!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;filter:none;right:22px;bottom:22px}
#strippi-companion>span{font-size:11px;padding:4px 12px;letter-spacing:.2px}.companion-avatar{width:48px}
html.night body{--n-panel:rgba(14,50,54,.96);--n-panel-solid:#0f3337;--n-line:rgba(232,214,180,.10);--n-muted:#a7c1bc;--n-text:#f3eadb;--n-lime:#d9a441;--n-lime-hi:#f0c66b}
html.night #light-ribbons{opacity:.55}
html.night body>aside{background:#08292c;border-right-color:var(--n-line)}
html.night body>aside nav{background:transparent;border:0;box-shadow:none}
html.night body>aside nav button.active{background:rgba(217,164,65,.10);color:var(--n-lime-hi);box-shadow:inset 2px 0 0 var(--n-lime)}
html.night .shell>header{background:rgba(8,35,38,.92)}
html.night .card,html.night .kpi{box-shadow:0 1px 0 #ffffff04 inset,0 8px 24px #00000010}
html.night .card::before,html.night .kpi::before{background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(217,164,65,.045),transparent 50%)}
html.night .kpi.focus-free{background:linear-gradient(125deg,#164246,#0f3337);border-color:#d9a44130}
html.night .kpi.focus-free .number,html.night .focus-balances .balance-total{text-shadow:none}
html.night .mercury-bars{filter:none}html.night .companion-shell{fill:#d9e3d7;stroke:#91a48c}html.night .companion-hand{fill:#c8d5c5;stroke:#91a48c}
html.night .companion-header{background:#12393d}html.night .companion-question{background:#d9a441;color:#2a1c05}
@media(min-width:1200px){.mercury-analysis{grid-template-columns:1.1fr 1fr}}
@media(max-width:760px){
 main{padding:24px 18px 92px}.shell>header{padding:12px 18px;min-height:60px}.heading{gap:14px;margin-bottom:22px}.heading p:not(.eyebrow){font-size:13px}.eyebrow{font-size:11px;letter-spacing:1.7px}
 h1,html.night h1{font-size:29px;letter-spacing:-1px}.card,.kpi,html.night .card,html.night .kpi{padding:19px;border-radius:15px}.kpis,.mercury-analysis,.settings-grid,.focus-details-grid{gap:14px}.kpi .number,html.night .kpi .number{font-size:29px;margin:12px 0 8px}.kpi small{font-size:12px}
 .segmented button{padding:8px 12px;font-size:12px}.card-head{gap:10px}.row{padding:14px 0}.bank-tile{padding:15px}dialog{padding:22px}.coach-dialog.companion-panel{width:calc(100vw - 24px);padding:0}.companion-scroll{padding:18px 15px}
 #strippi-companion{width:52px!important;right:14px;bottom:calc(14px + env(safe-area-inset-bottom,0px))}#light-ribbons{opacity:.35!important}
}
@media(prefers-reduced-motion:reduce){.companion-figure *{animation:none!important}}
.simple-mode .companion-figure *,body:not(.motion-enabled) .companion-figure *{animation:none!important}
.studio-coach-intro{display:flex;justify-content:space-between;align-items:center;gap:32px;padding:28px 12px 38px;margin-bottom:24px;border-bottom:1px solid var(--line)}
.studio-coach-intro>div:first-child{max-width:550px}.studio-coach-intro h2,html.night .studio-coach-intro h2{font-size:clamp(26px,3vw,38px);line-height:1.15;letter-spacing:-1px;margin:0 0 18px}.studio-coach-intro p:not(.eyebrow){font-size:14px;line-height:1.7;color:var(--muted);max-width:460px}.studio-coach-intro button{padding:12px 18px;margin-top:10px}.studio-coach-intro button span{margin-left:18px}.studio-coach-intro small{display:block;font-size:12px;color:var(--muted);margin-top:12px}.studio-mascot{width:180px;flex-shrink:0;padding:8px;background:radial-gradient(ellipse,var(--accent-soft),transparent 68%)}
@media(max-width:760px){.studio-coach-intro{padding:8px 0 26px;gap:12px;align-items:flex-start}.studio-mascot{width:85px;margin-top:34px}.studio-coach-intro h2,html.night .studio-coach-intro h2{font-size:25px}.studio-coach-intro p:not(.eyebrow){font-size:13px}.studio-coach-intro .eyebrow{font-size:11px;letter-spacing:1px}.studio-coach-intro button{font-size:12px;padding:10px 12px}.studio-coach-intro button span{margin-left:5px}}
/* One Strippi figure everywhere: the plan card uses the same drawing as the chat button. */
.coach-bot{display:block}.coach-bot>svg{width:100%;height:100%;overflow:visible}
/* The large Strippi on the budget plan page replaces the small one in the plan card. */
body[data-mercury-view=trippy] #coach-plan .coach-intro .coach-bot{display:none}