:root{--cream:#f2f3c0;--grass:#a8b750;--ochre:#c8892f;--straw:#e6eba1;--clay:#7a4a24;--soil:#2c2b16;--bark:#3e4821;--olive:#586b30;--paper:#fbfbec;--ink:#2c2b16;--red:#b3261e;--blue:#1d4f91;--line:#d9dba8}
*{box-sizing:border-box}html,body{margin:0}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:var(--paper);line-height:1.45;font-size:15px}
a{color:var(--olive)}h1,h2,h3{font-family:Georgia,"Times New Roman",serif;color:var(--bark);line-height:1.2}
code{background:var(--straw);padding:0 .3em;border-radius:3px}
.top{background:var(--soil);color:var(--cream);display:flex;align-items:center;gap:14px;padding:10px 18px;flex-wrap:wrap}
.top .brand{font-family:Georgia,serif;font-size:1.15rem;font-weight:bold;color:var(--cream);text-decoration:none}
.top .brand small{display:block;font-family:system-ui;font-weight:normal;font-size:.72rem;color:var(--grass)}
.top .sp{flex:1}.top .gdt{font-size:.78rem;color:var(--straw);max-width:420px}
.btn{display:inline-block;border:1px solid var(--olive);background:var(--grass);color:var(--soil);padding:6px 12px;border-radius:6px;font:inherit;font-size:.88rem;cursor:pointer;text-decoration:none}
.btn:hover{background:#b8c760}.btn.sec{background:var(--paper);color:var(--bark);border-color:var(--olive)}.btn.sec:hover{background:var(--straw)}.btn.warn{background:#e9c9a0;border-color:var(--clay)}
.btn[disabled]{opacity:.55;cursor:not-allowed}.btn.sm{padding:2px 8px;font-size:.78rem}
.top .btn.sec{color:var(--cream);background:transparent;border-color:var(--cream)}.top .btn.sec:hover{background:var(--olive)}
.layout{display:flex;min-height:calc(100vh - 56px)}
nav.side{width:230px;background:var(--bark);color:var(--cream);padding:12px 0;flex-shrink:0}
nav.side a{display:block;color:var(--cream);text-decoration:none;padding:7px 18px;font-size:.9rem;border-left:4px solid transparent}
nav.side a:hover{background:var(--olive)}nav.side a.on{background:var(--olive);border-left-color:var(--ochre)}
nav.side .n{display:inline-block;width:20px;color:var(--grass);font-weight:bold}
nav.side .grp{font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:var(--grass);padding:12px 18px 4px}
main{flex:1;padding:18px 26px 60px;max-width:1200px;overflow-x:auto}
.card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px 18px;margin:0 0 16px}
.card h3{margin:.1em 0 .5em}
.ex{background:repeating-linear-gradient(45deg,#f6e7c8,#f6e7c8 10px,#f2dfb6 10px,#f2dfb6 20px);border:1px dashed var(--ochre);color:var(--clay);padding:6px 12px;border-radius:6px;font-size:.85rem;font-weight:600;margin-bottom:12px}
.note{font-size:.82rem;color:#5d5b3a}.src{font-size:.75rem;color:#7a7850;font-style:italic}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
label.f{display:block;font-size:.8rem;color:var(--bark);margin:6px 0 2px;font-weight:600}
input,select,textarea{font:inherit;font-size:.9rem;border:1px solid #c9cb94;border-radius:5px;padding:4px 6px;background:#fffff6;color:var(--ink);max-width:100%}
textarea{width:100%;min-height:54px}input[type=number]{width:96px;text-align:right}input.w{width:100%}
table{border-collapse:collapse;width:100%;font-size:.84rem}
th,td{border-bottom:1px solid var(--line);padding:4px 6px;text-align:left;vertical-align:top}
th{background:var(--straw);color:var(--bark);font-weight:600;position:sticky;top:0}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
tr.tot td{font-weight:700;border-top:2px solid var(--bark);background:#f6f7dc}
tr.grp td{background:#eef0c6;font-weight:600;color:var(--bark)}
.wide{overflow-x:auto}.wide table{min-width:1100px}
.wide input[type=number]{width:70px;font-size:.8rem;padding:2px 4px}
.adv{color:var(--red);font-weight:600}.ok{color:var(--blue)}
.pill{display:inline-block;padding:1px 8px;border-radius:10px;font-size:.72rem;background:var(--straw);color:var(--bark);border:1px solid var(--line);white-space:nowrap}
.pill.wealth{background:#dfe8b0}.pill.inescapable{background:#e8dcc8}.pill.maintenance{background:#eee}
.banner{padding:10px 14px;border-radius:8px;margin:0 0 14px;font-size:.9rem}
.banner.good{background:#e3edc0;border:1px solid var(--grass)}.banner.bad{background:#f6dcd2;border:1px solid var(--red)}.banner.info{background:var(--straw);border:1px solid var(--line)}
.bar{height:16px;background:var(--grass);border-radius:3px;min-width:2px}.bar.o{background:var(--ochre)}.bar.c{background:var(--clay)}
.wf td{vertical-align:middle}
.mask{display:flex;gap:1px}.mask label{font-size:.62rem;text-align:center;width:22px;color:#77754c}.mask input{display:block;margin:0 auto}
details summary{cursor:pointer;color:var(--olive);font-size:.8rem}
.checks td{font-size:.8rem}.eia{border:1px dashed var(--olive);background:#f4f6dc;padding:8px 12px;border-radius:8px;font-size:.85rem}
.steps{counter-reset:s;list-style:none;padding:0}.steps li{counter-increment:s;margin:6px 0;padding-left:34px;position:relative}
.steps li:before{content:counter(s);position:absolute;left:0;top:0;width:24px;height:24px;border-radius:50%;background:var(--grass);color:var(--soil);text-align:center;font-weight:bold;font-size:.8rem;line-height:24px}
footer{font-size:.75rem;color:#7a7850;padding:20px 26px;border-top:1px solid var(--line)}
/* landing */
.hero{background:linear-gradient(135deg,var(--soil),var(--bark) 60%,var(--olive));color:var(--cream);padding:56px 24px}
.hero .in,section.sec .in{max-width:1000px;margin:0 auto}.hero h1{color:var(--cream);font-size:2.3rem;margin:0 0 .3em}.hero p{font-size:1.1rem;max-width:720px;color:var(--straw)}
section.sec{padding:36px 24px}section.sec.alt{background:#f4f5d6} /* homepage sections; scoped so they never hit .btn.sec */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.tile{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px}
.tile h3{margin:.1em 0 .4em;font-size:1.05rem}
body.embedded .top .brand small{display:none}
@media(max-width:800px){.layout{flex-direction:column}nav.side{width:auto;display:flex;flex-wrap:wrap;padding:4px}nav.side .grp{display:none}nav.side a{padding:6px 10px;border-left:0}main{padding:12px}}
/* v2 */
.checks .q{font-style:italic;margin:2px 0;color:var(--soil)}
.checks tr.na td{opacity:.55}.checks tr.failrow td{background:#fbe9e2}
.pill.link{background:#e2ecf6;border-color:#b9cde3;color:var(--blue);font-weight:normal;margin-left:4px}
.pill.bad{background:#f6dcd2;color:var(--red)}.pill.adv{background:#f6dcd2}
select.pick{font-size:.78rem;margin:2px 0 8px;color:#5d5b3a}
/* v2 dashboard and scope bar, in the existing HFP palette (olive/forest, lime-yellow, cream, serif headings). Variance: red = adverse, blue = on or better than plan. */
:root{--forest:var(--olive);--forest-dk:var(--bark);--forest-xdk:var(--soil);--gold:var(--grass);--gold-dk:var(--ochre)}
.top .brand{display:flex;align-items:center;gap:10px}.top .brand img{width:34px;height:34px;border-radius:8px;box-shadow:0 0 0 1px rgba(255,245,225,.35)}
.top .brand small{color:var(--grass)}
.scopebar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:10px;padding:8px 12px;margin:0 0 16px;font-size:.84rem}
.scopebar label{display:flex;align-items:center;gap:6px;color:var(--bark);font-weight:600}.scopebar select,.scopebar input{font-weight:normal;font-size:.84rem}
.scopebar .sep{color:var(--gold-dk);font-weight:700}.scopebar .sp{flex:1}
.dashhead{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;align-items:flex-start}.dashhead h1{margin:.1em 0}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin:8px 0 16px;flex:1 1 560px}
.kpi{background:linear-gradient(135deg,var(--bark),var(--olive));color:var(--cream);border-radius:12px;padding:10px 14px;border-bottom:4px solid var(--gold)}
.kpi span{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;opacity:.9}.kpi b{display:block;font-size:1.45rem;font-family:Georgia,serif;margin:2px 0}.kpi small{font-size:.74rem;opacity:.9}
.kpi.adv{background:#7E2A22;border-bottom-color:#F0B3A8}.kpi.okb{background:linear-gradient(135deg,#2f3a17,var(--bark))}
.dash{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.tile2{display:block;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 16px;color:inherit;text-decoration:none;box-shadow:0 1px 0 rgba(62,90,59,.06);transition:box-shadow .15s,border-color .15s}
a.tile2:hover{border-color:var(--forest);box-shadow:0 3px 12px rgba(62,90,59,.15)}
.tile2 h3{font-size:1rem;margin:.1em 0 .6em;display:flex;justify-content:space-between;gap:8px}.tile2 .go{font-family:system-ui;font-size:.75rem;color:var(--forest);font-weight:600;white-space:nowrap}
.tile2.wide2{grid-column:span 2}@media(max-width:760px){.tile2.wide2{grid-column:span 1}}
svg.chart{width:100%;height:auto;display:block}
.legend{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:.75rem;color:#5E5743;margin-top:4px}.legend i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:5px;vertical-align:-2px}
.hbars .hb{display:grid;grid-template-columns:minmax(80px,38%) 1fr auto;gap:8px;align-items:center;font-size:.82rem;margin:5px 0}.hbars .b{background:#EFE6D0;border-radius:5px;height:14px;overflow:hidden}.hbars .b i{display:block;height:100%;border-radius:5px}.hbars .v{font-variant-numeric:tabular-nums;white-space:nowrap}
.vchip{display:inline-block;padding:2px 10px;border-radius:12px;font-size:.78rem;font-weight:700}.vchip.adv{background:#F8DEDA;color:var(--red)}.vchip.ok{background:#DCE6F3;color:var(--blue)}
ul.alerts,ul.decs{list-style:none;padding:0;margin:.4em 0;font-size:.84rem}ul.alerts li{display:flex;justify-content:space-between;gap:8px;padding:2px 0;border-bottom:1px dashed var(--line)}ul.decs li{padding:4px 0;border-bottom:1px dashed var(--line)}
.banner.info{background:#E9EFE1;border:1px solid #C5D3B5}.banner.bad{background:#F8DEDA;border:1px solid #E5A79E;color:#5C1A14}
pre.json{background:var(--soil);color:var(--cream);padding:12px;border-radius:8px;max-height:420px;overflow:auto;font-size:.75rem}
.readonly input:disabled,.readonly select:disabled,.readonly textarea:disabled{background:#F1ECE0;color:#5E5743}

/* Solar $ wordmark: "Solar $" large + "Holistic Financial Planning" as one name; short form on small screens */
.top .brand .wm{line-height:1.1}.top .brand .wm b{font-size:1.35rem;letter-spacing:.01em}.top .brand .wm i{font-style:normal;font-size:1rem;color:var(--cream);opacity:.92}
@media(max-width:640px){.top .brand .wm i{display:none}}

/* homepage link (top bar, sidebar, footer) */
.top .homelink{color:var(--soil);background:var(--grass);border:1px solid var(--straw);border-radius:999px;padding:4px 12px;font-size:.82rem;font-weight:600;text-decoration:none;white-space:nowrap}
.top .homelink:hover{background:var(--straw)}
nav.side a.home{color:var(--straw);margin-top:2px}nav.side a.home .n{color:var(--ochre)}
footer a[data-home]{color:var(--olive)}

/* Guided setup ("Set up my plan") */
.wzprog{height:12px;background:var(--straw);border:1px solid var(--line);border-radius:8px;overflow:hidden;margin:4px 0 6px}.wzprog span{display:block;height:100%;background:var(--grass);border-right:1px solid var(--olive)}
ol.wzsteps{list-style:none;padding:0;margin:8px 0 14px;display:flex;flex-wrap:wrap;gap:6px}
ol.wzsteps li>button,ol.wzsteps li>span{display:flex;align-items:center;gap:6px;font:inherit;font-size:.8rem;background:var(--paper);color:var(--bark);border:1px solid var(--line);border-radius:16px;padding:3px 10px 3px 4px;cursor:pointer;text-align:left}
ol.wzsteps li>span{cursor:default}
ol.wzsteps .k{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--straw);border:1px solid var(--line);font-size:.72rem;font-weight:700}
ol.wzsteps li.done .k{background:var(--grass);border-color:var(--olive)}ol.wzsteps li.on>button,ol.wzsteps li.on>span{border-color:var(--olive);background:var(--straw);font-weight:600}
.card.wz h2{margin:.1em 0 .4em;font-size:1.25rem;color:var(--bark)}.card.inner{background:var(--paper);margin:10px 0}
.wzwhy{background:#f4f6dc;border-left:4px solid var(--grass);padding:8px 12px;border-radius:6px;margin:0 0 12px;font-size:.92rem}.wzwhy .src{margin-top:4px}
.wznav{display:flex;justify-content:space-between;gap:10px;margin-top:14px;border-top:1px solid var(--line);padding-top:12px}
td.low{outline:2px solid var(--ochre);font-weight:700}
nav.side a.setup{display:flex;align-items:center;background:rgba(168,183,80,.18);font-weight:600;flex-wrap:wrap}nav.side a.setup .wzp{margin-left:auto;font-size:.72rem;color:var(--straw);font-weight:normal;padding-left:6px}
.wzmini{display:block;flex-basis:100%;height:4px;background:rgba(255,255,255,.18);border-radius:3px;margin-top:4px}.wzmini span{display:block;height:100%;background:var(--grass);border-radius:3px}
.extlink{position:fixed;left:50%;top:20%;transform:translateX(-50%);z-index:1000;background:var(--paper);border:2px solid var(--olive);border-radius:10px;padding:12px 16px;max-width:min(520px,92vw);box-shadow:0 8px 30px rgba(0,0,0,.25)}
@media(max-width:640px){.wznav .btn{flex:1;text-align:center}ol.wzsteps li>button{font-size:.74rem}}
.wzscroll{overflow-x:auto;max-width:100%}table.wzcash{min-width:760px}table.wzcash td,table.wzcash th{white-space:nowrap}
