/* Momentum Milestones — white design system */
:root{
  --bg:#f6f6f3; --panel:#ffffff; --panel2:#f3f3ef; --raise:#ebebe7;
  --line:#e8e8e3; --line2:#d7d7d1;
  --text:#1c1c1a; --muted:#6e6e67; --dim:#a3a39b;
  --green:#F0B441; --green-ink:#9A6A00;   /* Milestones gold (legacy var names kept) */
  --green-dim:rgba(240,180,65,.16); --green-line:rgba(216,156,40,.55);
  --amber:#c65d21; --amber-dim:rgba(198,93,33,.1); --red:#d9472c; --red-dim:rgba(217,71,44,.08);
  --radius:14px;
  --shadow:0 1px 2px rgba(20,20,15,.05), 0 4px 14px rgba(20,20,15,.04);
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{
  background:var(--bg); color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:15px; line-height:1.5; -webkit-font-smoothing:antialiased;
}
::selection{background:var(--green); color:#000}
button{font:inherit; cursor:pointer; border:none; background:none; color:inherit}
a{color:var(--green-ink)}
input,select,textarea{
  font:inherit; color:var(--text); background:#fff;
  border:1px solid var(--line2); border-radius:10px; padding:10px 12px; width:100%;
  outline:none; transition:border-color .15s;
}
input:focus,select:focus,textarea:focus{border-color:var(--green-line)}
input:disabled,select:disabled,textarea:disabled{background:var(--panel2); color:var(--muted); opacity:1; -webkit-text-fill-color:var(--muted)}
label{display:block; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin:0 0 6px}
.field{margin-bottom:16px}
.boot{padding:80px; text-align:center; color:var(--dim)}

.card,.phase,.pane,.kpi,.wcard,.pipeline,.sumcard,.goalwrap,.banner,.ratepanel,.paycard,.modal{box-shadow:var(--shadow)}

/* ---------- chrome ---------- */
.topbar{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:0 28px; height:64px; border-bottom:1px solid var(--line);
  position:sticky; top:0; background:rgba(252,252,250,.9); backdrop-filter:blur(12px); z-index:50;
}
.brand{display:flex; align-items:center; gap:10px; white-space:nowrap; cursor:pointer}
.brand .sq{width:12px; height:12px; border-radius:3px; background:var(--green)}
.brand .word{font-weight:800; letter-spacing:.18em; font-size:15px}
.brand .sub{font-weight:300; letter-spacing:.3em; font-size:11px; color:var(--muted); text-transform:uppercase}
.who{display:flex; align-items:center; gap:10px; font-size:13px; color:var(--muted); white-space:nowrap}
.modechip{font-size:10px; letter-spacing:.12em; text-transform:uppercase; border:1px solid var(--line2); border-radius:999px; padding:3px 10px; color:var(--dim)}
.modechip.live{border-color:var(--green-line); color:var(--green-ink); background:var(--green-dim)}
.shell{max-width:1180px; margin:0 auto; padding:32px 28px 80px}
.footnote{text-align:center; color:var(--dim); font-size:11px; margin-top:48px; line-height:1.7; max-width:880px; margin-left:auto; margin-right:auto}

.kicker{font-size:11px; letter-spacing:.25em; text-transform:uppercase; color:var(--dim); margin-bottom:8px}
h1.page{font-size:26px; font-weight:700; letter-spacing:-.01em}
.pagemeta{color:var(--muted); font-size:13px; margin-top:4px}
.headrow{display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:26px}

.btn{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--green); color:#000; font-weight:700; font-size:14px;
  border-radius:10px; padding:11px 20px; transition:transform .1s, box-shadow .15s;
}
.btn:hover{box-shadow:0 0 18px rgba(240,180,65,.45)}
.btn:active{transform:scale(.98)}
.btn.ghost{background:transparent; color:var(--text); border:1px solid var(--line2); font-weight:500}
.btn.ghost:hover{border-color:var(--green-line); box-shadow:none}
.btn.small{padding:7px 14px; font-size:13px}
.btn[disabled]{opacity:.4; cursor:not-allowed; box-shadow:none}
.linkish{font-size:12.5px; color:var(--dim); text-decoration:underline}
.linkish:hover{color:var(--muted)}

/* ---------- login ---------- */
.login{max-width:420px; margin:80px auto; background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:34px; box-shadow:var(--shadow)}
.login h1{font-size:20px; margin:14px 0 6px}
.login p{color:var(--muted); font-size:13.5px; margin-bottom:20px}
.login .or{text-align:center; color:var(--dim); font-size:11px; letter-spacing:.15em; text-transform:uppercase; margin:18px 0}

/* ---------- roster ---------- */
.kpis{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:26px}
@media (max-width:780px){ .kpis{grid-template-columns:repeat(2,1fr)} }
.kpi{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:18px 20px}
.kpi .n{font-size:28px; font-weight:800; letter-spacing:-.02em}
.kpi .l{font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); margin-top:4px}
.kpi .n.green{color:var(--green-ink)} .kpi .n.amber{color:var(--amber)} .kpi .n.red{color:var(--red)}

.stagehead{font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--dim); margin:26px 0 12px}
.pipeline{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden}
.pipehead,.piperow{
  display:grid; grid-template-columns:1.5fr 1.1fr 1.4fr 1fr 1.4fr .6fr;
  gap:12px; align-items:center; padding:13px 20px;
}
.pipehead{font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); border-bottom:1px solid var(--line)}
.piperow{border-bottom:1px solid var(--line); cursor:pointer; transition:background .12s; font-size:13.5px}
.piperow:last-child{border-bottom:none}
.piperow:hover{background:var(--panel2)}
.cname{font-weight:600; display:flex; align-items:center; gap:10px}
.cname .since{display:block; font-size:11px; color:var(--dim); font-weight:400}
.avatar{width:32px; height:32px; border-radius:10px; background:var(--raise); display:grid; place-items:center; font-size:15px; flex:0 0 32px}
.phchip{font-size:11px; color:var(--muted); border:1px solid var(--line2); border-radius:6px; padding:3px 8px; white-space:nowrap; justify-self:start}
.mini{display:flex; align-items:center; gap:10px}
.minibar{flex:1; height:5px; background:var(--panel2); border-radius:999px; overflow:hidden; border:1px solid var(--line)}
.minifill{display:block; height:100%; background:var(--green); border-radius:999px}
.mini .pct{font-size:11.5px; color:var(--muted); width:32px; text-align:right}
.status{font-size:12px; display:inline-flex; align-items:center; gap:7px; white-space:nowrap}
.dot{width:7px; height:7px; border-radius:50%}
.dot.g{background:var(--green)} .dot.a{background:var(--amber)} .dot.r{background:var(--red)} .dot.x{background:var(--line2)}
.nexta{font-size:12.5px; color:var(--muted)}
.openlink{font-size:12px; color:var(--green-ink); justify-self:end}
@media (max-width:880px){ .pipehead{display:none} .piperow{grid-template-columns:1fr 1fr; row-gap:8px} }

/* ---------- weekly digest ---------- */
.weekwrap{display:grid; grid-template-columns:1.15fr 1fr; gap:14px; margin-bottom:8px}
@media (max-width:880px){ .weekwrap{grid-template-columns:1fr} }
.wcard{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:20px}
.wcard .wh{display:flex; justify-content:space-between; align-items:baseline; margin-bottom:14px; gap:10px}
.wcard .wt{font-size:13px; font-weight:700; letter-spacing:.04em}
.wcard .wg{font-size:10.5px; color:var(--dim); letter-spacing:.08em; text-transform:uppercase; white-space:nowrap}
.digest{list-style:none; font-size:13px; color:var(--muted)}
.digest li{display:flex; gap:10px; padding:7px 0; border-bottom:1px solid var(--line); line-height:1.45}
.digest li:last-child{border:none}
.digest .dd{flex:0 0 38px; font-size:10.5px; color:var(--dim); text-transform:uppercase; letter-spacing:.08em; padding-top:2px}
.digest b{color:var(--text); font-weight:600}
.digest .warn{color:var(--amber)}
.dayhead{display:flex; gap:5px; margin-left:102px; margin-bottom:4px}
.dayhead span{width:22px; text-align:center; font-size:9px; color:var(--dim); text-transform:uppercase}
.strips{display:flex; flex-direction:column; gap:9px}
.strip{display:flex; align-items:center; gap:10px}
.strip .sn{flex:0 0 92px; font-size:12px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.days{display:flex; gap:5px}
.daychip{width:22px; height:22px; border-radius:6px; background:var(--panel2); border:1px solid var(--line)}
.daychip.a{background:rgba(240,180,65,.22); border-color:var(--green-line)}
.daychip.s{background:var(--green); border-color:var(--green)}
.daychip.f{opacity:.3}
.legend{display:flex; gap:14px; margin-top:14px; font-size:10.5px; color:var(--dim)}
.legend span{display:flex; align-items:center; gap:5px}
.legend .daychip{width:12px; height:12px; border-radius:4px}

/* ---------- client page ---------- */
.banner{display:flex; align-items:center; gap:14px; background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:18px 22px; margin-bottom:20px; flex-wrap:wrap}
.banner .avatar{width:44px; height:44px; font-size:20px; border-radius:12px}
.banner .nm{font-weight:700; font-size:18px}
.banner .dt{font-size:12.5px; color:var(--muted)}
.banner .spacer{margin-left:auto; display:flex; gap:8px; align-items:center; flex-wrap:wrap}
.alertchip{font-size:12px; color:var(--amber); border:1px solid rgba(196,134,10,.35); border-radius:999px; padding:4px 12px; background:var(--amber-dim)}

.tabs{display:flex; gap:2px; border-bottom:1px solid var(--line); margin-bottom:24px; overflow-x:auto}
.tabs button{padding:11px 16px; font-size:13.5px; color:var(--muted); border-bottom:2px solid transparent; white-space:nowrap}
.tabs button.on{color:var(--text); border-bottom-color:var(--green); font-weight:600}

.progresswrap{margin:4px 0 20px}
.progressbar{height:8px; background:var(--panel2); border:1px solid var(--line); border-radius:999px; overflow:hidden}
.progressfill{height:100%; width:0%; border-radius:999px; background:linear-gradient(90deg,#d99416,var(--green)); box-shadow:0 0 14px rgba(240,180,65,.35); transition:width .7s cubic-bezier(.22,1,.36,1)}
.progressmeta{display:flex; justify-content:space-between; margin-top:8px; font-size:13px; color:var(--muted)}
.progressmeta b{color:var(--text); font-weight:600}

.cols{display:grid; grid-template-columns:380px 1fr; gap:24px; align-items:start}
@media (max-width:880px){ .cols{grid-template-columns:1fr} }
.side{display:flex; flex-direction:column; gap:14px}
.phase{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden}
.phase.current{border-color:var(--green-line)}
.phasehead{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:14px 16px; cursor:pointer; user-select:none}
.phasehead .pt{font-size:13px; font-weight:700; letter-spacing:.04em}
.phasehead .ps{font-size:11px; color:var(--dim); margin-top:1px}
.phasehead .pc{font-size:11px; color:var(--muted); white-space:nowrap}
.phasehead .pc.done{color:var(--green-ink)}
.chev{color:var(--dim); transition:transform .2s; font-size:11px; margin-left:6px}
.phase.open .chev{transform:rotate(180deg)}
.items{display:none; border-top:1px solid var(--line)}
.phase.open .items{display:block}
.item{display:flex; align-items:center; gap:11px; width:100%; text-align:left; padding:11px 16px; border-bottom:1px solid var(--line); font-size:13.5px; color:var(--muted); transition:background .12s}
.item:last-child{border-bottom:none}
.item:hover{background:var(--panel2)}
.item.selected{background:var(--panel2); color:var(--text); box-shadow:inset 2px 0 0 var(--green)}
.item.locked{color:var(--dim)}
.item .ic{flex:0 0 18px; height:18px; display:grid; place-items:center}
.item .t{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.ownerdot{flex:0 0 auto; font-size:9px; letter-spacing:.1em; color:var(--dim); border:1px solid var(--line2); border-radius:4px; padding:1px 5px; text-transform:uppercase}
.circle{width:16px;height:16px;border-radius:50%;border:1.5px solid var(--line2);display:block}
.tickwrap{width:18px;height:18px;border-radius:50%;background:var(--green);display:grid;place-items:center;color:#000;font-size:11px;font-weight:800}
.skipwrap{width:18px;height:18px;border-radius:50%;border:1.5px solid var(--amber);color:var(--amber);display:grid;place-items:center;font-size:10px;font-weight:800}
.lock{color:var(--dim); font-size:12px}

.pane{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:28px; min-height:380px}
.pane .crumb{font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--dim); margin-bottom:10px; display:flex; justify-content:space-between; gap:10px; align-items:center}
.pane h2{font-size:20px; font-weight:700; letter-spacing:-.01em; margin-bottom:6px}
.pane .desc{color:var(--muted); font-size:14px; margin-bottom:20px; max-width:560px}
.badge{display:inline-flex; align-items:center; gap:6px; font-size:11px; letter-spacing:.08em; text-transform:uppercase; border-radius:999px; padding:4px 11px; margin-bottom:18px; border:1px solid var(--line2); color:var(--muted)}
.badge.done{border-color:var(--green-line); color:var(--green-ink); background:var(--green-dim)}
.badge.waiting{border-color:rgba(196,134,10,.4); color:var(--amber)}
.badge.skipped{border-color:rgba(196,134,10,.45); color:var(--amber); background:var(--amber-dim)}
.badge.flag{border-color:rgba(217,71,44,.4); color:var(--red); background:var(--red-dim)}
.formgrid{display:grid; grid-template-columns:1fr 1fr; gap:0 16px; max-width:640px}
.formgrid .full{grid-column:1/-1}
@media (max-width:680px){ .formgrid{grid-template-columns:1fr} }
.coachnote{background:var(--panel2); border:1px solid var(--line2); border-left:3px solid var(--green); border-radius:10px; padding:16px 18px; max-width:640px; color:var(--muted); font-size:14px; white-space:pre-line; margin-bottom:16px}
.sigwrap{max-width:640px; margin:4px 0 16px}
.sighead{display:flex; align-items:center; justify-content:space-between; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); margin-bottom:6px}
.sigpad{display:block; width:100%; height:auto; aspect-ratio:760/220; background:#fff; border:1px dashed var(--line2); border-radius:10px; touch-action:none; cursor:crosshair}
.engresults{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:14px}
.engstat{background:var(--panel2); border:1px solid var(--line); border-radius:10px; padding:12px 14px}
.engstat .n{font-size:22px; font-weight:700}
.engstat .n.acc{color:var(--green)}
.engstat .l{font-size:11px; color:var(--muted); margin-top:2px}
.engtbl{overflow-x:auto; margin-bottom:14px}
.engtbl table{width:100%; border-collapse:collapse; font-size:13px}
.engtbl th{text-align:left; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); padding:0 10px 6px 0; font-weight:500}
.engtbl td{padding:6px 10px 6px 0; border-top:1px solid var(--line)}
.engform{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px}
.engform label{display:block; font-size:11px; color:var(--muted); margin-bottom:4px}
.engmult{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; max-width:360px}
.engpatrow{display:grid; grid-template-columns:repeat(7,1fr); gap:6px}
.engpat{display:flex; flex-direction:column; gap:3px}
.engpat span{font-size:11px; text-align:center}
.engpat select{font-size:11px; padding:5px 4px; border:1px solid var(--line2); border-radius:8px; background:#fff; width:100%}
.subtabs{display:inline-flex; gap:4px; background:var(--panel2); border:1px solid var(--line); border-radius:10px; padding:4px; margin-bottom:16px}
.subtab{font-size:13px; font-weight:600; padding:7px 16px; border-radius:8px; border:0; background:transparent; color:var(--muted); cursor:pointer}
.subtab.on{background:#fff; color:var(--text); box-shadow:0 1px 2px rgba(0,0,0,.06)}
.cwtbl{overflow-x:auto}
.cwtbl table{width:100%; border-collapse:collapse; font-size:13px; min-width:520px}
.cwtbl th{text-align:left; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); padding:0 8px 6px 0; font-weight:500}
.cwtbl td{padding:5px 8px 5px 0; border-top:1px solid var(--line)}
.cwd{font-weight:600; white-space:nowrap}
.cwin{width:72px; border:1px solid var(--line2); border-radius:8px; padding:6px 8px; font-size:13px}
.cwact{text-align:right; white-space:nowrap}
.lnk{background:none; border:0; color:var(--muted); font-size:11px; cursor:pointer; padding:2px 4px}
.lnk:hover{color:var(--text)}
.cwact .lnk + .lnk{margin-left:8px}
.calnav{display:flex; align-items:center; gap:8px}
.caltitle{min-width:130px; text-align:center; font-weight:600; font-size:13px; color:var(--text)}
.calnav .lnk{font-size:18px; line-height:1}
.calgrid{display:grid; grid-template-columns:repeat(7,1fr); gap:6px}
.calhd{font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--dim); text-align:center; padding-bottom:2px}
.calcell{min-height:62px; border:1px solid var(--line); border-radius:8px; background:var(--panel2); padding:5px 6px; text-align:left; cursor:pointer; display:flex; flex-direction:column; gap:1px; transition:border-color .12s}
.calcell:hover{border-color:var(--line2)}
.calcell.empty{border:0; background:transparent; cursor:default; min-height:0}
.calcell.ovr{background:rgba(124,242,55,.14); border-color:rgba(124,242,55,.55)}
.calcell.sel{border-color:var(--text)}
.caltop{display:flex; align-items:center; justify-content:space-between; gap:4px}
.cald{font-size:11px; color:var(--muted)}
.calovrtag{font-size:8px; color:#4a9c1f; text-transform:uppercase; letter-spacing:.04em}
.calk{font-size:13px; font-weight:700; color:var(--text)}
.calcarb{font-size:10px; color:var(--muted)}
.caldots{display:flex; flex-wrap:wrap; gap:2px; margin-top:auto}
.caldot{width:6px; height:6px; border-radius:50%; display:inline-block}
.callegend{display:flex; flex-wrap:wrap; gap:12px; margin-top:10px}
.callg{display:flex; align-items:center; gap:5px; font-size:11px; color:var(--muted)}
.caltoggle{display:inline-flex; gap:2px; background:var(--panel2); border:1px solid var(--line); border-radius:8px; padding:2px; margin-right:6px}
.caltoggle button{font-size:11px; padding:4px 10px; border:0; background:transparent; color:var(--muted); border-radius:6px; cursor:pointer}
.caltoggle button.on{background:#fff; color:var(--text)}
.cwtpl{display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.tplsel{font-size:12px; padding:5px 8px; border:1px solid var(--line2); border-radius:8px; background:#fff; color:var(--text); max-width:170px}
.yearwrap{display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:16px}
.ymlabel{font-size:11px; font-weight:600; color:var(--muted); margin-bottom:4px}
.ygrid{display:grid; grid-template-columns:repeat(7,1fr); gap:2px}
.ycell{position:relative; aspect-ratio:1; border:1px solid var(--line); border-radius:3px; cursor:pointer; padding:0}
.ycell.empty{border:0; background:transparent!important; cursor:default}
.ycell.ovr{border-color:var(--text); border-width:1.5px}
.ydot{position:absolute; top:1px; right:1px; width:4px; height:4px; border-radius:50%}
.srcchips{display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin:-8px 0 18px}
.srclabel{font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--dim)}
.srcchip{font-size:11px; border:1px solid var(--line2); border-radius:999px; padding:3px 10px; color:var(--muted); background:#fff; transition:all .12s}
.srcchip:hover{border-color:var(--green-line); color:var(--text)}
.recs{background:var(--green-dim); border:1px solid var(--green-line); border-radius:12px; padding:14px 18px; max-width:640px; margin-bottom:18px; font-size:13px}
.recs .rt{font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--green-ink); margin-bottom:8px; font-weight:800}
.recs ul{margin-left:16px; color:var(--text)}
.recs li{padding:2.5px 0; line-height:1.5}
.recs li b{color:var(--green-ink)}
.skiprow{margin-top:16px; padding-top:14px; border-top:1px dashed var(--line); display:flex; gap:16px; flex-wrap:wrap}
.skiprow button{font-size:12.5px; color:var(--dim)}
.skiprow button:hover{color:var(--amber)}
.mailbtn{font-size:12.5px; color:var(--green-ink)}
table.meas{border-collapse:collapse; max-width:640px; width:100%; margin-bottom:18px}
table.meas th{font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); text-align:left; padding:8px 10px; border-bottom:1px solid var(--line)}
table.meas td{padding:7px 10px; border-bottom:1px solid var(--line); font-size:14px; color:var(--muted)}
table.meas td input{padding:7px 10px; border-radius:8px; max-width:120px}
table.meas td.val{color:var(--text); font-weight:600}
.delta{color:var(--green-ink); font-size:12px; font-weight:700}
.delta.bad{color:var(--amber)}
.phototiles{display:flex; gap:14px; flex-wrap:wrap; margin-bottom:18px}
.tile{width:140px; height:178px; border:1.5px dashed var(--line2); border-radius:12px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:var(--dim); font-size:12px; letter-spacing:.08em; text-transform:uppercase; transition:all .15s; background:var(--panel2)}
.tile:hover{border-color:var(--green-line); color:var(--muted)}
.tile.up{border:1.5px solid var(--green-line); background:var(--green-dim); color:var(--green-ink)}
.tile .big{font-size:26px}
.agreementbox{max-width:640px; height:160px; overflow:auto; background:var(--panel2); border:1px solid var(--line2); border-radius:10px; padding:16px; font-size:13px; color:var(--muted); margin-bottom:16px; line-height:1.6}
.agreementbox h4{color:var(--text); font-size:13px; margin:10px 0 4px}
.signedstamp{border:1px dashed var(--green-line); background:var(--green-dim); border-radius:10px; padding:14px 18px; max-width:640px; color:var(--green-ink); font-size:14px}
.signedstamp .sig{font-size:22px; font-style:italic; font-weight:600; color:var(--text); margin-bottom:2px}

/* ---------- goal track / master plan ---------- */
.goalwrap{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:20px 24px 28px; margin-bottom:20px}
.goalhead{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; margin-bottom:10px}
.goalhead .gt{font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--dim)}
.goalhead .gd{font-size:12px; color:var(--muted); display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.pill{border:1px solid var(--line2); border-radius:12px; padding:12px 18px; color:var(--muted); font-size:14px; transition:all .15s; background:var(--panel2); min-width:64px; text-align:center}
.pill small{display:block; font-size:10.5px; color:var(--dim); margin-top:2px; letter-spacing:.04em}
.pill:hover{border-color:var(--green-line)}
.pill.on{border-color:var(--green); color:var(--text); background:var(--green-dim)}
.pill.on small{color:var(--green-ink)}
.pill.mini{padding:5px 12px; font-size:11.5px; min-width:0; border-radius:999px}
.gstats{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:26px}
.gchip{font-size:11.5px; border:1px solid var(--line2); color:var(--muted); border-radius:999px; padding:4px 11px}
.gchip.hot{border-color:var(--green-line); color:var(--green-ink); background:var(--green-dim)}
.gchip.late{color:var(--amber); border-color:rgba(196,134,10,.45)}
.track{position:relative; height:58px; margin:14px 10px 0}
.track.editable{cursor:crosshair}
.tline{position:absolute; top:9px; left:0; right:0; height:2px; background:var(--line2)}
.tfill{position:absolute; top:9px; left:0; height:2px; background:var(--green); box-shadow:0 0 8px rgba(240,180,65,.4)}
.tnode{position:absolute; top:0; transform:translateX(-50%); text-align:center; cursor:pointer}
.tnode .nd{width:20px; height:20px; border-radius:50%; background:var(--panel2); border:2px solid var(--line2); margin:0 auto; display:grid; place-items:center; font-size:10px; color:#000; font-weight:800}
.tnode.done .nd{background:var(--green); border-color:var(--green)}
.tnode.goal .nd{border-color:var(--green-ink); background:#fff; color:var(--green-ink); font-size:11px}
.tnode.late .nd{border-color:var(--amber); color:var(--amber); background:#fff; font-size:11px}
.tnode.selms .nd{box-shadow:0 0 0 4px var(--green-dim)}
.tnode .nl{font-size:10px; color:var(--dim); margin-top:7px; white-space:nowrap}
.tnode.done .nl,.tnode.goal .nl{color:var(--muted)}
.tpin{position:absolute; top:-18px; transform:translateX(-50%); font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:var(--green-ink); text-align:center; font-weight:700}
.tpin:after{content:''; display:block; width:1px; height:16px; background:var(--green-ink); margin:2px auto 0}
.blocksep{position:absolute; top:-2px; width:1px; height:26px; background:var(--line2)}
.blocklabel{position:absolute; top:38px; transform:translateX(-50%); font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:var(--dim); white-space:nowrap}
.mshint{margin-top:18px; font-size:11.5px; color:var(--dim)}
.msstrip{margin-top:18px; background:var(--panel2); border:1px solid var(--line); border-radius:12px; padding:14px 16px; font-size:13px; color:var(--muted)}
.msstrip b{color:var(--text)}
.msbtns{display:flex; align-items:flex-end; gap:8px}
.msbtns .btn{padding:9px 14px; font-size:13px}
.planpanel{margin-top:18px; border-top:1px dashed var(--line); padding-top:16px}
.blockrow{display:flex; gap:8px; align-items:center; margin-bottom:8px; flex-wrap:wrap}
.blockrow input{padding:8px 10px; font-size:13px; flex:1; min-width:120px}
.blockrow input.wks{max-width:80px; flex:0}
.checkrow{display:grid; grid-template-columns:1.4fr .5fr 1.6fr auto; gap:8px; align-items:center; margin-bottom:8px}
@media (max-width:680px){ .checkrow{grid-template-columns:1fr 1fr} }
.checkrow input{padding:8px 10px; font-size:13px}
.wh{display:flex; justify-content:space-between; align-items:baseline; margin-bottom:14px; gap:10px; flex-wrap:wrap}
.wt{font-size:13px; font-weight:700; letter-spacing:.04em}
.wg{font-size:10.5px; color:var(--dim); letter-spacing:.08em; text-transform:uppercase}
.optlabel{font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--dim); margin-bottom:10px}

/* ---------- presentation ---------- */
.pcols{display:grid; grid-template-columns:1.2fr 1fr; gap:24px; align-items:start}
@media (max-width:880px){ .pcols{grid-template-columns:1fr} }
.optgroup{margin-bottom:26px}
.pills{display:flex; gap:10px; flex-wrap:wrap; align-items:center}
.custwk{width:90px}
.changelink{font-size:11px; color:var(--dim); text-decoration:underline; letter-spacing:.04em; padding:4px}
.changelink:hover{color:var(--muted)}
.paycards{display:grid; grid-template-columns:1fr 1fr; gap:12px}
@media (max-width:680px){ .paycards{grid-template-columns:1fr} }
.paycard{text-align:left; border:1px solid var(--line2); border-radius:14px; padding:16px 18px; background:var(--panel2); transition:all .15s}
.paycard:hover{border-color:var(--green-line)}
.paycard.on{border-color:var(--green); background:var(--green-dim)}
.paycard .pt2{font-weight:700; font-size:14px; margin-bottom:3px}
.paycard .pd{font-size:12px; color:var(--muted); line-height:1.5}
.paycard .pp{font-size:18px; font-weight:800; margin-top:8px}
.paycard.on .pp{color:var(--green-ink)}
.savetag{display:inline-block; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:#000; background:var(--green); border-radius:5px; padding:2px 7px; margin-left:8px; font-weight:800}
.sumcard{background:var(--panel); border:1px solid var(--green-line); border-radius:var(--radius); padding:24px; position:sticky; top:88px}
.sumcard .sl{display:flex; justify-content:space-between; font-size:13.5px; color:var(--muted); padding:7px 0; border-bottom:1px solid var(--line)}
.sumcard .sl b{color:var(--text); font-weight:600}
.sumcard .tot{display:flex; justify-content:space-between; align-items:baseline; padding:14px 0 4px}
.sumcard .tot .n{font-size:30px; font-weight:800; letter-spacing:-.02em; color:var(--green-ink)}
.sumcard .per{font-size:12px; color:var(--muted); text-align:right}
.inc{list-style:none; margin:14px 0 18px; font-size:13px; color:var(--muted)}
.inc li{padding:4px 0 4px 22px; position:relative}
.inc li:before{content:'✓'; position:absolute; left:0; color:var(--green-ink); font-weight:800}
.mhl{color:var(--green-ink); font-weight:700}
.finey{font-size:11px; color:var(--dim); margin-top:10px; line-height:1.6}

/* ---------- blood panel ---------- */
.bloodgrid{display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:10px; max-width:920px; margin-bottom:18px}
.marker{background:var(--panel2); border:1px solid var(--line); border-radius:10px; padding:10px 12px}
.marker label{margin-bottom:4px; font-size:10px}
.marker .rng{font-size:10px; color:var(--dim); margin-top:4px}
.marker input{padding:7px 9px; font-size:13.5px}
.marker.flag{border-color:rgba(196,134,10,.5); background:var(--amber-dim)}
.marker.flag .rng{color:var(--amber); font-weight:600}
.bloodhead{display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:16px}
.grouplabel{font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--dim); grid-column:1/-1; margin-top:6px}
.panelrow{display:flex; justify-content:space-between; gap:10px; align-items:center; border:1px solid var(--line); border-radius:10px; padding:12px 16px; margin-bottom:8px; background:var(--panel); cursor:pointer; font-size:13.5px}
.panelrow:hover{border-color:var(--green-line)}
.flagpill{font-size:10.5px; color:var(--amber); border:1px solid rgba(196,134,10,.4); background:var(--amber-dim); border-radius:999px; padding:2px 9px}

/* ---------- email windows ---------- */
.modal-back{position:fixed; inset:0; background:rgba(20,20,15,.45); z-index:90; display:grid; place-items:center; padding:20px}
.modal{background:var(--panel); border:1px solid var(--line); border-radius:16px; max-width:680px; width:100%; max-height:88vh; overflow:auto; padding:26px}
.modal h3{font-size:16px; margin-bottom:4px}
.modal .sub{font-size:12px; color:var(--muted); margin-bottom:18px}
.modal .actions{display:flex; gap:10px; margin-top:18px; flex-wrap:wrap}
.tplrow{display:flex; justify-content:space-between; gap:10px; align-items:center; border:1px solid var(--line); border-radius:10px; padding:12px 16px; margin-bottom:8px; background:var(--panel); font-size:13.5px}
.tplrow:hover{border-color:var(--green-line)}
.tplrow .tk{color:var(--dim); font-size:11px}

/* ---------- data tab ---------- */
.datagrid{display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:14px}
.datacard{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:18px 20px}
.datacard .dn{font-size:22px; font-weight:800; letter-spacing:-.02em}
.datacard .dl{font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); margin-top:3px}
.datacard .dm{font-size:12px; color:var(--muted); margin-top:8px}

/* ---------- v2: milestone list, charts, body comp, toggles ---------- */
.mslist{margin-top:18px;border-top:1px dashed var(--line);padding-top:14px}
.mslisthead{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);margin-bottom:10px}
.msrow{display:grid;grid-template-columns:24px 1.4fr 1fr 72px 72px 20px;gap:8px;align-items:center;padding:5px 0}
.msrow.on{background:var(--green-dim);border-radius:8px}
.msrow input{padding:7px 9px;font-size:13px}
.msrow .msr-wk{display:flex;align-items:center;gap:4px}.msrow .msr-wk input{width:46px}.msrow .msr-wk small{color:var(--dim);font-size:10px}
.msr-date{font-size:11.5px;color:var(--muted);white-space:nowrap}
.msdot{width:22px;height:22px;border-radius:50%;border:2px solid var(--line2);background:#fff;font-size:11px;font-weight:800;cursor:pointer;display:grid;place-items:center;color:var(--amber)}
.msdot.hit{background:var(--green);border-color:var(--green);color:#000}
.msdot.late{border-color:var(--amber);color:var(--amber)}
@media (max-width:680px){.msrow{grid-template-columns:24px 1fr 56px 20px}.msr-target,.msr-date{display:none}}
.anchortog{display:inline-flex;border:1px solid var(--line2);border-radius:8px;overflow:hidden;flex:0 0 auto}
.anchortog button{padding:6px 12px;font-size:12px;color:var(--muted);background:#fff}
.anchortog button.on{background:var(--green);color:#000;font-weight:700}
.chart{width:100%;height:auto;display:block;overflow:visible}
.chartempty{color:var(--dim);font-size:12px;padding:24px 0;text-align:center}
.chartrow{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media (max-width:680px){.chartrow{grid-template-columns:1fr}}
.lab2{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin:4px 0 6px}
.chartleg{display:flex;gap:14px;font-size:11px;color:var(--muted);margin-top:6px}
.chartleg i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:middle}
.marker.jp7{border-color:var(--green-line);background:var(--green-dim)}
.marker .pnum{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:50%;background:var(--green);color:#04210a;font-size:9px;font-weight:800;vertical-align:middle}
.imp-ta{width:100%;font-family:ui-monospace,Menlo,Monaco,monospace;font-size:12px;white-space:pre;overflow:auto;min-height:150px}
.imp-prev{max-height:280px;overflow:auto;border:1px solid var(--line);border-radius:10px}
.imp-sum{font-size:13px;font-weight:600;margin-bottom:8px}
.imp-warn{color:var(--amber);font-weight:500}

/* ---------- toast ---------- */
#toast{position:fixed; bottom:28px; left:50%; transform:translateX(-50%) translateY(20px); background:#1c1c1a; color:#fff; border:1px solid #333; border-radius:12px; padding:12px 20px; font-size:13.5px; opacity:0; pointer-events:none; transition:all .25s; z-index:99; box-shadow:0 8px 30px rgba(0,0,0,.25); max-width:90vw}
#toast.show{opacity:1; transform:translateX(-50%) translateY(0)}
#toast b{color:var(--green)}
.hidden{display:none!important}

/* ---------- nutrition recall (meal builder) ---------- */
.recall{margin-top:10px}
.rmeal{border:1px solid var(--line); border-radius:10px; padding:12px; margin-bottom:12px; background:#fff}
.rmeal-h{display:flex; align-items:center; gap:8px; margin-bottom:10px; flex-wrap:wrap}
.rmeal-name{flex:1; min-width:120px; max-width:220px; font-weight:600; padding:6px 8px; border:1px solid var(--line); border-radius:8px; font-size:14px}
.rmeal-time{width:120px; padding:6px 8px; border:1px solid var(--line); border-radius:8px; font-size:13px}
.rmeal-k{margin-left:auto; font-weight:700; color:var(--gtext,#1e6600); font-size:14px}
.ritem{display:flex; align-items:center; gap:8px; margin-bottom:8px; flex-wrap:wrap}
.rcat{width:92px; padding:6px; border:1px solid var(--line); border-radius:8px; font-size:12px; text-transform:capitalize}
.rpick-wrap{position:relative; flex:1; min-width:180px}
.rpick-btn{width:100%; text-align:left; padding:7px 10px; border:1px solid var(--line); border-radius:8px; background:#fff; cursor:pointer; font-size:13px; display:flex; justify-content:space-between; align-items:center; gap:6px}
.rpick-btn:hover{border-color:var(--green)}
.rqty{width:64px; padding:6px 8px; border:1px solid var(--line); border-radius:8px; font-size:13px}
.rmac{font-size:11px; min-width:150px}
.rx{border:none; background:none; color:var(--dim); cursor:pointer; font-size:14px; padding:2px 6px}
.rx:hover{color:var(--red,#cc2222)}
.rmeal-tot{font-size:12px; margin-top:8px; padding-top:8px; border-top:1px solid var(--line)}
.rtotals{margin:12px 0; padding:12px; border:1px solid var(--line); border-radius:10px; background:#f7f7f7; font-size:14px}
.ritem-ro{display:flex; justify-content:space-between; font-size:13px; padding:3px 0}
.commslog{margin-top:14px; padding:12px 14px; border:1px solid var(--line); border-radius:10px; background:#f7f7f7}
.commslog-h{font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--muted,#666); margin-bottom:8px}
.commsrow{display:flex; align-items:baseline; gap:10px; padding:5px 0; border-top:1px solid var(--line); font-size:13px}
.commsrow:first-of-type{border-top:none}
.commsd{min-width:64px; color:var(--dim); font-size:12px}
.commss{flex:1; min-width:0}
.commsch{font-size:11px}
.dim{color:var(--dim)}
.rpick-dd{position:absolute; z-index:40; top:calc(100% + 4px); left:0; width:340px; max-width:88vw; background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:0 8px 30px rgba(0,0,0,.15); padding:8px}
.rpick-dd input#rpickq{width:100%; padding:7px 9px; border:1px solid var(--line); border-radius:8px; font-size:13px; margin-bottom:6px}
.rpick-list{max-height:220px; overflow-y:auto}
.rpick-row{display:flex; justify-content:space-between; width:100%; text-align:left; padding:7px 8px; border:none; background:none; cursor:pointer; font-size:13px; border-radius:6px}
.rpick-row:hover{background:#f2f2f2}
.rpick-offrow{display:flex; justify-content:space-between; align-items:center; gap:8px; padding:6px 4px; border-top:1px solid var(--line)}
.rpick-offname{font-size:13px}
.store{display:inline-block; font-size:10px; background:var(--gbg,rgba(100,200,40,.12)); color:var(--gtext,#1e6600); padding:1px 5px; border-radius:8px; margin-left:4px}
.daytabs{display:flex; gap:4px; flex-wrap:wrap; margin-bottom:8px}
.daytab{padding:6px 13px; border:1px solid var(--line); border-radius:8px; background:#fff; cursor:pointer; font-size:13px; font-weight:600; color:var(--muted)}
.daytab:hover{border-color:var(--green)}
.daytab.on{background:#1a1a1a; color:#fff; border-color:#1a1a1a}

/* ---------- movement screening ---------- */
.mscreen{display:flex; flex-direction:column; gap:10px}
.msintro{font-size:12.5px; color:var(--muted); margin:0 2px 2px}
.msprog{margin:2px 2px 4px}
.msprog-t{font-size:11.5px; color:var(--muted); font-weight:600; margin-bottom:6px}
.msbar{height:6px; background:#e7e7e2; border-radius:99px; overflow:hidden}
.msbar-f{height:100%; background:var(--green); border-radius:99px; transition:width .25s}
.mstest{border:1px solid var(--line); border-radius:12px; background:var(--panel); overflow:hidden}
.mstest-h{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:13px 14px; cursor:pointer; user-select:none}
.mstest-hl{min-width:0}
.mstest-name{font-weight:700; font-size:14.5px}
.mstest-sum{font-size:11.5px; color:var(--dim); margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:230px}
.mstest-hr{display:flex; align-items:center; gap:9px; flex:0 0 auto}
.mscount{font-size:11px}
.mscount.has{background:var(--green-dim); color:var(--green-ink); border:1px solid var(--green-line); padding:2px 9px; border-radius:999px; font-weight:700}
.mscount.clean{color:#4a9c1f; font-weight:700}
.mscount.none{color:var(--dim)}
.mschev{color:var(--dim); font-size:12px; transition:transform .2s; display:inline-block}
.mstest.open .mschev{transform:rotate(180deg)}
.mstest-b{padding:0 14px 14px; border-top:1px solid var(--line)}
.mshow{display:inline-flex; align-items:center; gap:6px; margin:12px 0; padding:5px 11px; font-size:12px; color:var(--muted); background:var(--panel2); border:1px solid var(--line); border-radius:999px; font-weight:600}
.msproto{font-size:12.5px; color:var(--muted); background:var(--panel2); border-radius:8px; padding:10px 12px; margin-bottom:10px; line-height:1.55}
.msobs{padding:10px 12px; border:1px solid var(--line); border-left:3px solid transparent; border-radius:12px; background:var(--panel); margin-bottom:8px}
.msobs.lvl-mild{border-left-color:#E0A93E; background:rgba(240,180,65,.10)}
.msobs.lvl-mod{border-left-color:var(--amber); background:rgba(198,93,33,.07)}
.msobs.lvl-sev{border-left-color:var(--red); background:rgba(217,71,44,.07)}
.msf{display:block; font-size:14px; font-weight:600; color:var(--text)}
.msc{display:block; font-size:12px; color:var(--muted); margin-top:2px}
.mssev{display:flex; gap:6px; margin-top:9px}
.mspill{flex:1; padding:6px 0; font-size:12px; font-weight:600; color:var(--muted); background:var(--panel); border:1px solid var(--line2); border-radius:999px; text-align:center}
.mspill.on[data-sev=mild]{background:rgba(240,180,65,.22); color:#8a6a12; border-color:rgba(216,156,40,.6)}
.mspill.on[data-sev=mod]{background:rgba(198,93,33,.15); color:#8a3f16; border-color:rgba(198,93,33,.55)}
.mspill.on[data-sev=sev]{background:rgba(217,71,44,.15); color:#9c2f1c; border-color:rgba(217,71,44,.55)}
.msside{display:flex; align-items:center; gap:6px; margin-top:8px}
.msside-l{font-size:11px; color:var(--dim); margin-right:2px}
.mssidebtn{padding:5px 13px; font-size:12px; font-weight:600; color:var(--muted); background:var(--panel); border:1px solid var(--line2); border-radius:999px}
.mssidebtn.on{background:#1a1a1a; color:#fff; border-color:#1a1a1a}
.msclean{display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--dim); background:none; border:1px dashed var(--line2); border-radius:999px; padding:6px 12px; font-weight:600}
.msclean.on{color:#4a9c1f; border-color:#9fd17f; border-style:solid; background:rgba(74,156,31,.07)}
.msobs-ro{display:flex; align-items:flex-start; gap:8px; font-size:13px; color:var(--text); padding:4px 0}
.mscorr{border:1px solid var(--green-line); background:var(--green-dim); border-radius:12px; padding:13px 14px}
.mscorr-h{display:flex; align-items:center; justify-content:space-between; font-weight:700; font-size:13px; margin-bottom:10px}
.mscorr-h .c{font-size:11px; color:var(--green-ink); font-weight:700}
.mscorr-row{display:flex; align-items:flex-start; gap:9px; padding:7px 0; border-top:1px solid rgba(216,156,40,.22)}
.mscorr-row:first-child{border-top:none}
.msdot{width:9px; height:9px; border-radius:50%; flex:0 0 auto; margin-top:4px}
.msdot.lvl-mild{background:#E0A93E} .msdot.lvl-mod{background:var(--amber)} .msdot.lvl-sev{background:var(--red)}
.mscorr-f{flex:1; font-size:13px; font-weight:600; color:var(--text)}
.mscorr-sub{display:block; font-size:11.5px; font-weight:400; color:var(--muted); margin-top:1px}
.msprio{font-size:10px; font-weight:700; color:#9c2f1c; background:rgba(217,71,44,.12); border:1px solid rgba(217,71,44,.3); padding:2px 7px; border-radius:999px; flex:0 0 auto}
.mschips{display:flex; flex-wrap:wrap; gap:6px; margin-top:11px; padding-top:11px; border-top:1px solid rgba(216,156,40,.22)}
.mschip{font-size:11.5px; color:#4a4a44; background:var(--panel); border:1px solid var(--line2); border-radius:999px; padding:4px 10px}