/* CG-01 caregiver Home v2 · scoped fix (Oct 5, 2026). Everything lives under .cgh so the live index.html is untouched.
   Rules: one Fraunces headline per page · pink only on the single primary action · teal = covered/ok ·
   Work Sans UI · Geist Mono tabular for IDs/times · 4/8 spacing · no paragraphs on Home. */
.cgh{--cgh-pad:20px;--cgh-r:16px;--cgh-gap:16px}
.cgh main{padding:8px var(--cgh-pad) 112px;max-width:560px;width:100%}
.cgh .mt{display:none}

/* top bar: brand + org + avatar only, no actions */
@media (max-width:860px){
 .cgh .mtop{gap:10px;padding:12px var(--cgh-pad);border-bottom:0;background:var(--stock)}
 .cgh .mtop .mk{width:22px;height:22px;color:var(--ink);display:block}.cgh .mtop .mk svg{width:100%;height:100%;display:block}
 .cgh .mtop .org-n{font:500 13px/20px var(--f-ui);color:var(--mut)}
 .cgh .mtop .av{width:32px;height:32px;font-size:11.5px}
}

/* hero: the only display type on the page */
.cgh .hero{padding:12px 0 24px}
.cgh .hello{display:block;font:500 13px/20px var(--f-ui);color:var(--mut);margin-bottom:4px}
.cgh h1{font:800 32px/36px var(--f-disp);font-variation-settings:'SOFT' 100,'opsz' 72;letter-spacing:-.02em;color:var(--ink);text-wrap:balance}
.cgh h1 .n{font-variant-numeric:tabular-nums lining-nums}
.cgh .sub{margin-top:8px;font:400 15px/22px var(--f-ui);color:var(--mut);text-wrap:pretty}
.cgh .sub .mono{font-size:14px;color:var(--ink)}

/* the one primary action (working state only) */
.cgh .cta{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:52px;margin-top:20px;border-radius:14px;background:var(--pink);color:#1e1b2e;font:600 15px/1 var(--f-ui);transition:scale 150ms var(--ease-out),background-color 150ms var(--ease-out)}
.cgh .cta:active{scale:.97}
@media (hover:hover){.cgh .cta:hover{background:#ff5fba}}

/* calm status card (off state) */
.cgh .status{border-radius:var(--cgh-r);background:var(--teal-wash);color:var(--ink);overflow:hidden}
.cgh .status .row{display:flex;align-items:center;gap:14px;padding:16px}
.cgh .status picture{width:44px;flex:none}.cgh .status picture img{width:100%;height:auto;display:block}
.cgh .status b{display:block;font:600 15px/22px var(--f-ui)}
.cgh .status .meta{display:block;font:500 13px/20px var(--f-mono);font-variant-numeric:tabular-nums;color:var(--teal-ink)}
.cgh .status .rcpt{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-top:1px solid rgba(0,120,127,.16);font:600 14px/20px var(--f-ui);color:var(--teal-ink)}
.cgh .status .rcpt:active{background:rgba(0,120,127,.06)}

/* quiet link rows (offers, next shift, help) */
.cgh .qrow{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:var(--cgh-r);background:var(--card);box-shadow:0 0 0 1px var(--rule);transition:background-color 120ms var(--ease-out)}
.cgh .qrow:active{background:var(--hover)}
.cgh .qrow .ic{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--bg2);color:var(--ink);flex:none}
.cgh .qrow .tx{flex:1;min-width:0}
.cgh .qrow b{display:block;font:600 15px/22px var(--f-ui);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cgh .qrow small{display:block;font:400 13px/20px var(--f-ui);color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cgh .qrow .chv{color:var(--mut)}
.cgh .qrow .cnt{font:600 12px/20px var(--f-mono);min-width:24px;height:24px;padding:0 7px;border-radius:99px;background:var(--ink);color:var(--stock);display:grid;place-items:center}

/* sections */
.cgh .sec{margin-top:32px}
.cgh .sec:first-of-type{margin-top:0}
.cgh .hero+.sec{margin-top:8px}
.cgh .stack>*+*{margin-top:var(--cgh-gap)}
.cgh .sh{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 4px 8px}
.cgh .sh h2{font:600 13px/20px var(--f-ui);color:var(--ink)}
.cgh .sh span{font:400 13px/20px var(--f-ui);color:var(--mut)}

/* compact visit list: time · name · one chip */
.cgh .vlist{border-radius:var(--cgh-r);background:var(--card);box-shadow:0 0 0 1px var(--rule);overflow:hidden}
.cgh .v{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:12px;align-items:center;min-height:56px;padding:8px 16px;border-bottom:1px solid var(--rule)}
.cgh .v:active{background:var(--hover)}
.cgh .v .t{font:500 14px/20px var(--f-mono);font-variant-numeric:tabular-nums;color:var(--ink);white-space:nowrap}
.cgh .v .who{min-width:0}
.cgh .v .who b{display:block;font:600 14px/20px var(--f-ui);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cgh .v .who small{display:block;font:400 12px/16px var(--f-ui);color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cgh .v .chip{height:24px;font:600 12px/1 var(--f-ui);padding:0 10px}
.cgh .v .chip.wait{background:none;box-shadow:inset 0 0 0 1px var(--rule2);color:var(--mut)}
.cgh .v .chip.next{background:var(--ink);color:var(--stock)}
.cgh .v.off .t,.cgh .v.off .who b{color:var(--mut)}
.cgh .more{display:flex;align-items:center;justify-content:center;gap:6px;height:48px;font:600 14px/20px var(--f-ui);color:var(--ink)}
.cgh .more .hi{color:var(--mut)}

/* help line */
.cgh .help{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:32px;font:400 14px/20px var(--f-ui);color:var(--mut)}
.cgh .help a{color:var(--ink);font-weight:600;text-decoration:underline;text-decoration-color:var(--rule2);text-underline-offset:3px}

/* bottom nav: same four tabs, a little more air */
@media (max-width:860px){
 .cgh .mbot{padding:8px 0 22px;background:color-mix(in srgb,var(--stock) 94%,transparent);backdrop-filter:blur(8px)}
 .cgh .mbot a{gap:4px;font:500 11.5px/16px var(--f-ui)}
 .cgh .mbot a.on{color:var(--ink);font-weight:600}
}
/* desktop: keep the shell, centre a calm column */
@media (min-width:861px){.cgh main{margin:0 auto;padding:16px 32px 64px}}
html.dark .cgh .status .rcpt{border-top-color:rgba(111,211,202,.16)}
@media (prefers-reduced-motion:reduce){.cgh .cta,.cgh .qrow{transition:none}}
