/* Client Profile client pages on the Thriving Wealth HUD look (4 Nov 2026).
   Colours are the BrandKit HUD tokens (01. Context/BrandKit/BrandKit.gs, HUD.light / HUD.dark). Light and dark follow the person's computer.
   This sheet only restyles: it is loaded after each page's own styles and changes no behaviour. Remove the <link> to go back to the old look. */
:root{
  color-scheme:light dark;
  --bg:#f4f7f6;--panel:#ffffff;--ink:#121816;--muted:#5b6764;--line:#e1e8e6;--soft:#eaf3f1;--wash:#e3f4f1;
  --teal:#17766f;--tealhi:#3ec2b4;--ok:#0f7a6e;--okbg:#e2f4f0;--warn:#8a5a0b;--warnbg:#fcf0dc;--bad:#9b2a2a;--badbg:#fbe6e6;
  --shadow:0 1px 2px rgba(16,40,36,.06),0 8px 24px rgba(16,40,36,.06);
  --fh:'Raleway','Montserrat',Arial,sans-serif;
}
@media(prefers-color-scheme:dark){:root{
  --bg:#0d1413;--panel:#141d1b;--ink:#e8efed;--muted:#9aa8a5;--line:#24312e;--soft:#1a2624;--wash:#15302c;
  --teal:#4fd1c2;--tealhi:#3ec2b4;--ok:#5fd3b8;--okbg:#133229;--warn:#f0b960;--warnbg:#33270f;--bad:#f08a8a;--badbg:#3a1919;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.25);
}}
body{background:var(--bg)!important;color:var(--ink)!important;font-family:'Montserrat',Arial,sans-serif}
h1,h2,h3,.card-title,.ld-title,.who,.success-screen h2{font-family:var(--fh)}
h1,h2,h3,.ld-title,.success-screen h2{color:var(--ink)!important}
.sub{color:var(--muted)!important}
.card picture{display:block}
#error-title{color:var(--ink)}#error-msg{color:var(--muted)!important}

/* Top bar: light bar with the black logo (white logo in dark mode, picked by the <picture> in the page) */
.topbar{background:var(--panel)!important;color:var(--ink)!important;border-bottom:1px solid var(--line);box-shadow:none}
.topbar-meta{color:var(--muted)!important}
.preview-banner{background:var(--warnbg)!important;color:var(--warn)!important;border-bottom:1px solid var(--line)!important}

/* Cards and panels */
.card,.ld-card{background:var(--panel)!important;border:1px solid var(--line);border-radius:14px!important;box-shadow:var(--shadow)!important;color:var(--ink)}
.card-title{font-weight:800;color:var(--ink)}
.card-sub{color:var(--muted)!important}
.section-hd{background:var(--wash)!important;color:var(--teal)!important;border-left:3px solid var(--tealhi)!important;border-radius:9px!important;font-family:var(--fh);letter-spacing:.08em}
.notice,.handy,.sig-note{background:var(--wash)!important;border:1px solid var(--line)!important;color:var(--ink)!important;border-radius:12px!important}
.handy strong{color:var(--teal)!important}.handy span{color:var(--muted)!important}
.entry-card,.ac-entry,.consent-box,.what-next{background:var(--soft)!important;border:1px solid var(--line)!important;color:var(--ink)!important;border-radius:12px!important}
.entry-num,.ac-num,.sig-row,.lock-note,.fg .hint,.tiles-hint,.save-status,.ld-sub,.rv-l span:first-child{color:var(--muted)!important}
.ac-entry.open{border-color:var(--tealhi)!important}
.ac-header:hover{background:var(--wash)!important}
.ac-entry.open .ac-header{background:var(--wash)!important;border-bottom:1px solid var(--line)!important}
.ac-entry.open .ac-num{color:var(--teal)!important}
.ac-summary,.rv-l,.what-next,.consent-box{color:var(--ink)!important}
.ac-chevron,.del-btn,.ac-del{color:var(--muted)!important}
.sig-wait{background:var(--warnbg)!important;border:1px solid var(--line)!important;color:var(--warn)!important;border-radius:12px!important}
.success-screen p{color:var(--muted)!important}
.rv,.mrow,.nw-total{border-color:var(--line)!important}

/* Step menu */
.cp-nav{background:var(--panel)!important;border:1px solid var(--line);border-radius:14px!important;box-shadow:none!important}
.cp-nav .who{color:var(--ink)}.cp-nav .sub,.cp-nav .help{color:var(--muted)!important;border-color:var(--line)!important}
.cp-nav a{color:var(--ink)!important}.cp-nav a:hover{background:var(--soft)!important}
.cp-nav a .n{background:var(--soft)!important;color:var(--muted)!important}
.cp-nav a.fin .n{background:var(--tealhi)!important;color:#fff!important}
.cp-nav a.on{background:var(--wash)!important;color:var(--teal)!important}
.cp-nav a.on .n{background:var(--teal)!important;color:var(--panel)!important}
.cp-nav a.warn .n{background:var(--warn)!important;color:var(--panel)!important}
@media(max-width:860px){.cp-nav{border-radius:0!important;border-width:0 0 1px 0!important}.cp-nav a{border-color:var(--line)!important}}

/* Fields */
.fg label{color:var(--ink)!important}
.fg input,.fg select,.fg textarea,.code-wrap input{background:var(--bg)!important;color:var(--ink)!important;border:1px solid var(--line)!important;border-radius:9px!important}
.fg input:focus,.fg select:focus,.fg textarea:focus,.code-wrap input:focus{outline:2px solid var(--tealhi)!important;border-color:transparent!important}
.fg input::placeholder,.fg textarea::placeholder{color:var(--muted);opacity:.7}
.fg input.locked{background:var(--soft)!important;color:var(--muted)!important}
.fg.miss input,.fg.miss select,.fg.miss textarea,select.miss{border-color:var(--bad)!important;background:var(--badbg)!important}
.miss-row{outline-color:var(--bad)!important}
.req{color:var(--bad)!important}
.rv-miss{background:var(--warnbg)!important;color:var(--warn)!important}
.addr-dd{background:var(--panel)!important;border:1px solid var(--line)!important;box-shadow:var(--shadow)!important}
.addr-it{border-color:var(--line)!important}.addr-it:hover,.addr-it.on{background:var(--wash)!important}.addr-it small,.addr-msg{color:var(--muted)!important}

/* Choices: pills, yes/no, tiles, ranks, tabs */
.pill-group label,.yna label,.tile,.rank,.who-btn,.doc-row{background:var(--panel)!important;border:1px solid var(--line)!important;color:var(--ink)!important}
.pill-group label.sel,.tile.on,.rank.on,.who-btn.active{background:var(--wash)!important;border-color:var(--tealhi)!important;color:var(--teal)!important}
.yna label.sel{background:var(--teal)!important;border-color:var(--teal)!important;color:var(--panel)!important}
.tile:hover,.doc-row:hover{border-color:var(--tealhi)!important}
.tile.none.on{background:var(--soft)!important;color:var(--muted)!important}
.rank .rn{background:var(--muted)!important}.rank.on .rn{background:var(--tealhi)!important}
.tabs{border-bottom:1px solid var(--line)!important}
.tab{color:var(--muted)!important}.tab.active{color:var(--teal)!important;border-bottom-color:var(--tealhi)!important}
.pair-hd,.sig-who{color:var(--teal)!important;border-bottom-color:var(--tealhi)!important;font-family:var(--fh)}
.sig-who span,.doc-t span{color:var(--muted)!important}
.doc-ic{background:var(--wash)!important;color:var(--teal)!important}.doc-open{color:var(--teal)!important}
.add-btn{border-color:var(--tealhi)!important;color:var(--teal)!important;border-radius:10px!important}.add-btn:hover{background:var(--wash)!important}
.rv-edit,.sig-row button{border-color:var(--tealhi)!important;color:var(--teal)!important;background:transparent!important}
.tip{background:var(--panel)!important;border-color:var(--tealhi)!important;color:var(--teal)!important}

/* Buttons */
.btn{border-radius:9px!important;font-family:'Montserrat',Arial,sans-serif}
.btn-primary,.btn-teal{background:var(--teal)!important;color:var(--panel)!important;border:0!important}
.btn-primary:hover,.btn-teal:hover{filter:brightness(1.08);background:var(--teal)!important}
.btn-ghost{background:var(--panel)!important;color:var(--ink)!important;border:1px solid var(--line)!important}
.btn-ghost:hover{border-color:var(--tealhi)!important;color:var(--teal)!important;background:var(--panel)!important}
.btn:focus-visible,a:focus-visible,.tab:focus-visible,.ac-header:focus-visible{outline:2px solid var(--tealhi)!important;outline-offset:2px}
.phone-display{color:var(--teal)!important}
.who-btn:disabled{opacity:.45}

/* Progress */
.bottom-bar{background:var(--panel)!important;border-top:1px solid var(--line)!important;box-shadow:none!important}
.prog-label{color:var(--muted)!important}
.prog-bar,.step-prog-bar,.segs i{background:var(--soft)!important}
.prog-fill,.step-prog-fill,.segs i.fin,.dot.done,.dot.active{background:var(--tealhi)!important}
.segs i.on{background:var(--teal)!important}
.dot{background:var(--line)!important}

/* Messages, toast, loading */
.error,.locked-msg{background:var(--badbg)!important;color:var(--bad)!important}
.success-msg{background:var(--okbg)!important;color:var(--ok)!important}
.timer,.sms-from,.loading-msg{color:var(--muted)!important}.sms-from strong{color:var(--ink)!important}
.toast{background:var(--ink)!important;color:var(--panel)!important}.toast.error{background:var(--bad)!important;color:var(--panel)!important}
.ld-spin{border-color:var(--soft)!important;border-top-color:var(--tealhi)!important}
.ld-line,.ld-box{background:linear-gradient(90deg,var(--soft) 25%,var(--wash) 50%,var(--soft) 75%)!important;background-size:200% 100%!important}
.tip-note{background:var(--ink)!important;color:var(--panel)!important}

/* The signature pad stays paper-white in dark mode so the drawn line shows (the signature is saved as drawn) */
.sig-pad{background:#fff!important;border:2px dashed var(--tealhi)!important;border-radius:12px!important}
.sig-pad.sig-ph{background:var(--soft)!important;color:var(--muted)!important}

/* Partner-mobile pop-up and other inline-styled boxes */
#pm-overlay>div{background:var(--panel)!important;color:var(--ink)!important;border:1px solid var(--line);border-radius:16px!important}
#pm-text{color:var(--muted)!important}#pm-err{color:var(--bad)!important}
#pm-later{background:var(--soft)!important;color:var(--ink)!important}

/* Inline greys set in the page's own scripts follow the theme too */
[style*="color:#555"],[style*="color:#444"],[style*="color:#333"],[style*="color:#666"]{color:var(--muted)!important}
[style*="color:#888"],[style*="color:#999"],[style*="color:#aaa"]{color:var(--muted)!important}
[style*="color:#111"]{color:var(--ink)!important}
[style*="color:#3ec2b4"],[style*="color:#1f8a80"]{color:var(--teal)!important}
[style*="color:#b3261e"]{color:var(--bad)!important}
[style*="color:#7a5c00"]{color:var(--warn)!important}
@media(prefers-color-scheme:dark){
  [style*="background:#fff;"],[style$="background:#fff"]{background:var(--panel)!important}
  [style*="background:#f8fffe"],[style*="background:#f0fffe"],[style*="background:#eef2f2"],[style*="background:#f8f8f8"]{background:var(--soft)!important}
  [style*="background:#fff8e1"]{background:var(--warnbg)!important}
  [style*="border:1px solid #d0f0ec"],[style*="border:1.5px solid #ddd"],[style*="border:1.5px solid #ffe082"]{border-color:var(--line)!important}
}
a{color:var(--teal)}

/* ── The narrow icon rail (computers only), like the Roadmapping client app ── */
.cp-rail{display:none}
.cp-tabs{display:none}
@media(min-width:861px){
  body.has-rail{padding-left:84px}
  body.has-rail .topbar,body.has-rail .cp-nav{display:none!important}
  body.has-rail .cp-rail{display:flex;position:fixed;left:0;top:0;bottom:0;width:84px;z-index:120;flex-direction:column;align-items:center;gap:4px;padding:14px 6px;background:var(--panel);border-right:1px solid var(--line);overflow-y:auto}
  .cp-rail-brand{display:flex;justify-content:center;padding:0 0 12px}
  .cp-rail-brand img{width:56px;height:auto;display:block}
  .cp-rail-item{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:100%;min-height:58px;padding:8px 2px;border:0;border-radius:10px;background:none;color:var(--muted);font:700 11px/1.15 'Montserrat',Arial,sans-serif;text-align:center;cursor:pointer}
  .cp-rail-item:hover{background:var(--soft);color:var(--ink)}
  .cp-rail-item.active{background:var(--wash);color:var(--teal)}
  .cp-rail-item:focus-visible{outline:2px solid var(--tealhi);outline-offset:-2px}
  .cp-rail-icon{display:inline-flex;width:22px;height:22px}.cp-rail-icon svg{width:22px;height:22px}
  .cp-rail-dot{position:absolute;top:7px;right:14px;width:8px;height:8px;border-radius:50%;border:2px solid var(--panel);background:var(--line)}
  .cp-rail-item.active .cp-rail-dot{border-color:var(--wash)}
  .cp-rail-dot.ok{background:var(--ok)}.cp-rail-dot.warn{background:var(--warn)}
  .cp-rail-spacer{flex:1}
  .cp-rail-foot{font-size:10px;line-height:1.4;color:var(--muted);text-align:center;padding:10px 2px 0}
  .cp-rail-foot b{display:block;color:var(--ink);font-weight:700;margin-bottom:2px;word-break:break-word}
  body.has-rail .cp-shell{display:block;max-width:1100px}
  body.couple.has-rail .cp-shell{max-width:1340px}
  body.has-rail .cp-shell .container{margin:0 auto}
  body.has-rail .bottom-bar{left:84px}
  .cp-tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin:0 0 14px;overflow-x:auto;scrollbar-width:none}
  .cp-tabs::-webkit-scrollbar{display:none}
  .cp-tabs button{background:none;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;padding:10px 14px;font:700 .83rem 'Montserrat',Arial,sans-serif;color:var(--muted);cursor:pointer;white-space:nowrap}
  .cp-tabs button:hover{color:var(--ink)}
  .cp-tabs button.on{color:var(--teal);border-bottom-color:var(--tealhi)}
  .cp-tabs button.fin{color:var(--teal)}
  .cp-tabs button .ck{font-size:.75rem;font-weight:800;color:var(--teal)}
  .cp-tabs button .ck.wn{color:var(--warn)}
  .cp-tabs button:focus-visible{outline:2px solid var(--tealhi);outline-offset:-2px}
}
.cp-tabs:empty{display:none!important}

/* ── Home, laid out like the Roadmapping client app ── */
.cp-hhead h1{font-family:var(--fh);font-size:1.45rem;font-weight:800;margin:0 0 2px;color:var(--ink)!important}
.cp-hhead p{font-size:.85rem;color:var(--muted)!important;margin:0 0 16px}
.cp-hgrid{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:14px;align-items:start}
.cp-hl,.cp-hr{display:grid;gap:14px;min-width:0}
.cp-panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px 18px;box-shadow:var(--shadow)}
.cp-h{font-family:var(--fh);font-size:.95rem;font-weight:800;margin:0 0 10px;color:var(--ink)}
.cp-h small{font-family:'Montserrat',Arial,sans-serif;font-weight:600;font-size:.72rem;color:var(--muted);margin-left:6px}
.cp-sub{font-size:.83rem;color:var(--muted)!important;line-height:1.65;margin:0 0 10px}
.cp-stat{display:grid;gap:4px;text-align:left;width:100%;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:14px 16px;font:inherit;color:var(--ink);cursor:pointer}
.cp-stat:hover{border-color:var(--tealhi)}
.cp-stat .lb{font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.cp-stat .v{font-size:1.7rem;font-weight:700;line-height:1.1}
.cp-stat .segs{display:flex;gap:4px;margin-top:6px}.cp-stat .segs i{flex:1;height:6px;border-radius:99px;background:var(--soft)}.cp-stat .segs i.fin{background:var(--tealhi)}
.cp-band{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
.cp-meet{display:flex;gap:14px;align-items:center}
.cp-cal{flex:0 0 58px;border:1px solid var(--line);border-radius:12px;overflow:hidden;text-align:center;background:var(--panel)}
.cp-cal .m{background:var(--teal);color:var(--panel);font-size:.66rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:3px 0}
.cp-cal .d{font-size:1.5rem;font-weight:800;line-height:1.2;color:var(--ink)}.cp-cal .w{font-size:.68rem;color:var(--muted);padding-bottom:4px}
.cp-meet-t{display:grid;gap:2px;font-size:.88rem;line-height:1.5}.cp-meet-t span{color:var(--muted);font-size:.8rem}
.cp-fin{font-size:.78rem;color:var(--muted)!important;margin:10px 0 0;line-height:1.55}
.cp-next .eyebrow{font-size:.68rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--teal);margin-bottom:4px}
.cp-next .big{font-family:var(--fh);font-size:1.15rem;font-weight:800;margin-bottom:4px;color:var(--ink)}
.cp-next .btn{width:100%}
.cl-sec{font-size:.68rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:14px 0 4px}
.cl-sec:first-of-type{margin-top:0}
.cl-row{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--line);padding:11px 4px;font:inherit;color:var(--ink);cursor:pointer;border-radius:8px}
.cl-row:hover{background:var(--soft)}
.cl-ck{flex:0 0 22px;height:22px;border-radius:50%;border:2px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:800;color:var(--panel)}
.cl-ck.on{background:var(--tealhi);border-color:var(--tealhi)}.cl-ck.st{border-color:var(--tealhi)}
.cl-t{flex:1;font-weight:700;font-size:.88rem;display:grid;gap:1px}.cl-t small{font-weight:500;font-size:.76rem;color:var(--muted)}
.cl-warn{color:var(--warn)}
.cl-go{font-size:.78rem;font-weight:700;color:var(--muted);white-space:nowrap}.cl-row.done .cl-go{color:var(--teal)}
.cp-copy{font-size:.72rem;color:var(--muted)!important;text-align:center;margin:18px 0 6px}
.cp-copy-rail{display:block;margin-top:8px;font-size:9.5px;line-height:1.4}
@media(max-width:1000px){.cp-hgrid{grid-template-columns:minmax(0,1fr)}.cp-band{grid-template-columns:minmax(0,1fr)}}
@media(min-width:861px){.cp-copy{display:none}}

/* One-time welcome pop-up */
#wm-overlay>div{background:var(--panel)!important;color:var(--ink)!important;border:1px solid var(--line);border-radius:16px!important;box-shadow:var(--shadow)}
#wm-title{font-family:var(--fh);color:var(--ink)}
.cp-hgrid{grid-template-columns:minmax(0,1fr)!important}
