/* Tickaboo (office) — phone-app shell: slim top bar, one calm column, timeline of the day, fixed bottom tab bar. */
:root{
  --bg:#F3F5F7; --surface:#FFFFFF; --sunken:#EAEEF2; --ink:#14191F; --muted:#6B7480; --faint:#A3ABB5; --line:#E3E7EC;
  --accent:#0E7A68; --accent-ink:#FFFFFF; --accent-soft:#DDF0EB;
  --now:#E8862A; --now-soft:#FCEBD9; --late:#C8432F; --late-soft:#F9E1DC; --ok:#17996F;
  --hot:#D9480F; --warm:#D98E04; --cold:#4F7FAF; --in:#17996F; --out:#C8432F;
  --c-admin:#7457E8; --c-clean:#1A8DB8; --c-pantry:#D07423; --c-facility:#BB4294; --c-errand:#4F8A2A; --c-followup:#B8860B; --c-other:#7A8390;
  --shadow:0 1px 2px rgba(20,30,40,.05),0 4px 16px rgba(20,30,40,.06);
  --f-display:"Fredoka","Nunito","Avenir Next Rounded",system-ui,sans-serif;
  --f-body:"Figtree","Segoe UI",system-ui,sans-serif;
  --r:16px; --nav-h:64px;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root{
  --bg:#0E1216; --surface:#161C22; --sunken:#1C242C; --ink:#E7ECF1; --muted:#97A2AE; --faint:#5F6B77; --line:#26303A;
  --accent:#4FCFB3; --accent-ink:#06201A; --accent-soft:#16342E;
  --now:#F5A658; --now-soft:#3A2A18; --late:#F2836E; --late-soft:#3B211C; --ok:#4FD3A0;
  --hot:#FF8A5B; --warm:#F2C14E; --cold:#7FB1E3; --in:#4FD3A0; --out:#F2836E;
  --c-admin:#A996FF; --c-clean:#5CC6EC; --c-pantry:#F4A964; --c-facility:#E982CB; --c-errand:#A2D06E; --c-followup:#E8C25A; --c-other:#A6AFBA;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 4px 16px rgba(0,0,0,.25); color-scheme:dark }}

*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:15px;line-height:1.45;-webkit-tap-highlight-color:transparent;min-height:100vh;padding-top:env(safe-area-inset-top,0px)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--bg)}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.wrap{max-width:640px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}

.wordmark{font-family:var(--f-display);font-weight:700;font-size:1.55rem;letter-spacing:-.02em;line-height:1;display:flex;align-items:baseline}
.wordmark i{font-style:normal;color:var(--accent)}
.wordmark.big{font-size:3rem}
.splash{min-height:80vh;display:grid;place-items:center}

/* ---------- auth & onboarding ---------- */
.auth{min-height:calc(100vh - env(safe-area-inset-top,0px));display:flex;flex-direction:column;justify-content:center;gap:24px;padding-block:32px}
.auth .wrap{width:100%;max-width:440px;display:flex;flex-direction:column;gap:22px}
.auth h1{font-family:var(--f-display);font-weight:600;font-size:1.9rem;line-height:1.1;margin:0;letter-spacing:-.02em;text-wrap:balance}
.auth p.lead{margin:0;color:var(--muted);font-size:1.02rem}
.choices{display:flex;flex-direction:column;gap:12px}
.choice{border:0;background:var(--surface);box-shadow:var(--shadow);border-radius:20px;padding:18px;display:flex;gap:14px;align-items:center;text-align:left}
.choice .av{width:46px;height:46px;font-size:1.1rem}
.choice b{display:block;font-size:1.05rem}
.choice span.s{color:var(--muted);font-size:.88rem}
.choice .chev{margin-left:auto;color:var(--faint);font-size:1.3rem}
.form{display:flex;flex-direction:column;gap:14px}
.form label{font-size:.74rem;text-transform:uppercase;letter-spacing:.08em;font-weight:700;color:var(--muted);display:flex;flex-direction:column;gap:6px}
.form input{border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:13px 14px;width:100%;font-size:1rem;text-transform:none;letter-spacing:0;font-weight:500;color:var(--ink)}
.form input:focus{outline:none;border-color:var(--accent)}
.phone{display:flex;gap:8px}
.phone .cc{width:92px;flex:none;display:flex;align-items:center;border:1px solid var(--line);background:var(--surface);border-radius:12px;padding-left:12px;font-weight:600}
.phone .cc input{border:0;padding:13px 8px 13px 2px;background:none}
.otp{font-size:1.6rem!important;letter-spacing:.4em!important;text-align:center;font-variant-numeric:tabular-nums}
.btn.block{width:100%;padding:14px;font-size:1rem}
.linkrow{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.link{border:0;background:none;color:var(--accent);font-weight:600;padding:4px 0}
.back{border:0;background:none;color:var(--muted);font-weight:600;padding:4px 0;align-self:flex-start}
.msg{font-size:.9rem;padding:10px 12px;border-radius:12px}
.msg.err{background:var(--late-soft);color:var(--late)}
.msg.info{background:var(--accent-soft);color:var(--ink)}
.small{font-size:.84rem;color:var(--muted)}

/* ---------- top bar ---------- */
.topbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.topbar .wrap{padding-block:12px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.hhname{font-size:.84rem;color:var(--muted);font-weight:600;text-align:right;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hhname b{display:block;color:var(--ink);font-weight:600}

main .wrap{padding-block:4px calc(var(--nav-h) + env(safe-area-inset-bottom,0px) + 90px);display:flex;flex-direction:column;gap:18px}
.banner{font-size:.84rem;padding:10px 12px;border-radius:12px;background:var(--now-soft);color:var(--ink)}

/* hero */
.hero{display:flex;align-items:center;justify-content:space-between;gap:16px}
.hero h2{font-family:var(--f-display);font-weight:600;font-size:2rem;line-height:1.05;margin:0;letter-spacing:-.02em}
.hero .date{color:var(--muted);font-weight:500;margin-top:2px}
.ring{position:relative;width:64px;height:64px;flex:none}
.ring svg{width:64px;height:64px;transform:rotate(-90deg)}
.ring .num{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--f-display);font-weight:600;font-size:1rem;font-variant-numeric:tabular-nums}
.ring .num small{font-size:.7rem;color:var(--muted);font-weight:500}

/* day strip */
.strip{display:flex;align-items:center;gap:2px}
.strip .arrow{flex:none;width:28px;height:44px;border:0;background:none;color:var(--faint);font-size:1.3rem;border-radius:8px}
.days{flex:1;display:grid;grid-template-columns:repeat(7,1fr);gap:4px;min-width:0}
.day{border:0;background:none;border-radius:14px;padding:6px 0;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:0;color:var(--muted)}
.day .dw{font-size:.66rem;text-transform:uppercase;letter-spacing:.08em;font-weight:600}
.day .dn{font-weight:700;font-size:1rem;font-variant-numeric:tabular-nums;color:var(--ink);width:32px;height:32px;display:grid;place-items:center;border-radius:50%}
.day.today .dn{color:var(--accent)}
.day[aria-pressed="true"] .dn{background:var(--ink);color:var(--bg)}
.day .dot{width:4px;height:4px;border-radius:50%;background:transparent}
.day.has .dot{background:var(--faint)}
.day.alldone .dot{background:var(--ok)}

/* notes */
.notes{background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow);display:flex;flex-direction:column}
.nrow{display:flex;gap:12px;padding:12px 14px;align-items:flex-start}
.nrow+.nrow{border-top:1px solid var(--line)}
.av{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:.72rem;color:#fff;background:var(--pc,var(--accent))}
.av.mgr{background:var(--accent-soft);color:var(--accent)}
.av.team{background:var(--now-soft);color:var(--now)}
.av.any{background:var(--sunken);color:var(--muted)}
.nrow .av{width:30px;height:30px}
.av.fam{background:var(--accent-soft);color:var(--accent)}
.av.help{background:var(--now-soft);color:var(--now)}
.nbody{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.nbody .lbl{font-size:.74rem;color:var(--muted);font-weight:600;display:flex;justify-content:space-between;gap:8px}
.nbody .lbl em{font-style:normal;color:var(--ok);font-weight:600}
.nbody p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.nbody p.empty{color:var(--faint)}
.nbody textarea{border:0;background:none;padding:0;resize:none;width:100%;min-height:22px;line-height:1.45}
.nbody textarea:focus{outline:none}
.nbody textarea::placeholder{color:var(--faint)}

/* timeline */
.section-h{display:flex;align-items:center;justify-content:space-between;gap:8px}
.section-h h3{margin:0;font-size:.78rem;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);font-weight:700}
.toggle{border:0;background:none;color:var(--accent);font-weight:600;font-size:.84rem;padding:4px 2px}
.timeline{display:flex;flex-direction:column}
.item{display:grid;grid-template-columns:58px 18px 1fr;align-items:stretch;min-height:64px}
.item .t{font-variant-numeric:tabular-nums;font-weight:700;font-size:.82rem;color:var(--muted);padding-top:15px;text-align:right;padding-right:6px;line-height:1.15}
.item .t small{display:block;font-weight:500;font-size:.7rem;color:var(--faint)}
.rail{position:relative;display:flex;justify-content:center}
.rail::before{content:"";position:absolute;top:0;bottom:0;width:2px;background:var(--line)}
.timeline>:first-child .rail::before{top:20px}
.timeline>:last-child .rail::before{bottom:calc(100% - 22px)}
.rail .pip{position:relative;margin-top:17px;width:10px;height:10px;border-radius:50%;background:var(--surface);border:2.5px solid var(--cc)}
.item.done .rail .pip{background:var(--cc)}
.card{margin:4px 0 6px 6px;background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow);display:flex;align-items:center;min-width:0;transition:opacity .2s}
.card .main{flex:1;min-width:0;border:0;background:none;text-align:left;padding:12px 4px 12px 14px;display:flex;flex-direction:column;gap:2px}
.card .title{font-weight:600;font-size:1rem;overflow-wrap:anywhere}
.card .sub{font-size:.83rem;color:var(--muted);overflow-wrap:anywhere}
.card .tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:3px}
.tag{font-size:.7rem;font-weight:700;padding:1px 8px;border-radius:99px;letter-spacing:.02em}
.tag.cat{color:var(--cc);background:color-mix(in srgb,var(--cc) 13%,transparent)}
.tag.late{background:var(--late-soft);color:var(--late)}
.tag.when{background:color-mix(in srgb,var(--ok) 13%,transparent);color:var(--ok)}
.check{flex:none;width:60px;align-self:stretch;border:0;background:none;display:grid;place-items:center}
.check .box{width:30px;height:30px;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center;transition:all .15s}
.check .box svg{width:16px;height:16px;opacity:0;transition:opacity .15s}
.check:hover .box{border-color:var(--ok)}
.done .check .box{background:var(--ok);border-color:var(--ok)}
.done .check .box svg{opacity:1}
.item.done .card{opacity:.55;box-shadow:none;background:var(--sunken)}
.item.done .title{text-decoration:line-through;text-decoration-color:var(--faint)}
.item.late .card{box-shadow:inset 3px 0 0 var(--late),var(--shadow)}
.nowline{display:grid;grid-template-columns:58px 18px 1fr;align-items:center;height:22px}
.nowline .t{font-size:.72rem;font-weight:700;color:var(--now);text-align:right;padding-right:6px;font-variant-numeric:tabular-nums}
.nowline .rail .pip{margin:0;width:10px;height:10px;background:var(--now);border:0;align-self:center}
.nowline .bar{height:2px;background:var(--now);border-radius:2px;margin-left:6px;opacity:.7}

.empty{background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow);padding:32px 20px;text-align:center;color:var(--muted);display:flex;flex-direction:column;gap:8px;align-items:center}
.empty strong{color:var(--ink);font-family:var(--f-display);font-weight:600;font-size:1.15rem}
.empty .btn{margin-top:6px}

/* week */
.wk-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.wk-head h2,.g-head h2,.page-h{font-family:var(--f-display);font-weight:600;font-size:1.6rem;margin:0}
.wk-nav{display:flex;gap:4px}
.wk-nav button{border:0;background:var(--surface);box-shadow:var(--shadow);width:36px;height:36px;border-radius:50%;color:var(--muted);font-size:1.1rem}
.wk-sub{color:var(--muted);font-size:.88rem;margin-top:-12px}
.wlist{background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
.wday+.wday{border-top:1px solid var(--line)}
.wday>button{width:100%;border:0;background:none;display:flex;align-items:center;gap:12px;padding:14px;text-align:left}
.wday .dd{width:40px;flex:none;display:flex;flex-direction:column;align-items:center;line-height:1}
.wday .dd b{font-family:var(--f-display);font-weight:600;font-size:1.3rem}
.wday .dd span{font-size:.66rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600;margin-top:3px}
.wday.today .dd b{color:var(--accent)}
.wday .sum{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.wday .sum .count{font-weight:600}
.wday .sum .dots{display:flex;gap:4px;flex-wrap:wrap}
.wday .sum .dots i{width:8px;height:8px;border-radius:50%;background:var(--cc)}
.wday .chev{color:var(--faint);transition:transform .2s}
.wday.open .chev{transform:rotate(90deg)}
.wday .rows{padding:0 14px 10px 66px;display:flex;flex-direction:column}
.wrow{display:flex;gap:10px;align-items:baseline;border:0;background:none;text-align:left;padding:7px 8px;border-radius:10px;width:100%}
.wrow:hover{background:var(--sunken)}
.wrow .t{font-variant-numeric:tabular-nums;font-size:.8rem;color:var(--muted);width:60px;flex:none}
.wrow .n{flex:1;min-width:0;overflow-wrap:anywhere}
.wrow .d{width:8px;height:8px;border-radius:50%;background:var(--cc);flex:none;align-self:center}
.wrow.done .n{text-decoration:line-through;color:var(--muted)}

/* groceries */
.g-head p{margin:2px 0 0;color:var(--muted)}
.addbar{display:flex;gap:6px;background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow);padding:6px}
.addbar input{border:0;background:none;padding:10px;min-width:0}
.addbar input:focus{outline:none}
.addbar #g-name{flex:1}
.addbar #g-qty{width:72px;border-left:1px solid var(--line)}
.addbar .btn{width:44px;padding:0;display:grid;place-items:center;font-size:1.4rem;line-height:1}
.glist{background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
.gitem{display:flex;align-items:center;gap:2px;padding-right:4px}
.gitem+.gitem{border-top:1px solid var(--line)}
.gitem .check{width:54px;height:52px}
.gitem .check .box{width:26px;height:26px}
.gitem .gname{flex:1;min-width:0;overflow-wrap:anywhere;font-weight:600}
.gitem .gqty{display:block;color:var(--muted);font-weight:500;font-size:.8rem}
.gitem .who{flex:none;width:24px;height:24px;font-size:.66rem}
.gitem .x{border:0;background:none;color:var(--faint);width:40px;height:44px;font-size:1.25rem}
.gitem.done .gname{text-decoration:line-through;color:var(--muted)}
.glist.bought{background:var(--sunken);box-shadow:none}

/* home / settings */
.panel{background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow);padding:16px;display:flex;flex-direction:column;gap:12px}
.panel h3{margin:0;font-size:.78rem;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);font-weight:700}
.panel .form input{background:var(--bg)}
.inline{display:flex;gap:8px;align-items:flex-end}
.inline .form,.inline label{flex:1;min-width:0}
.people{display:flex;flex-direction:column}
.person{display:flex;align-items:center;gap:12px;padding:10px 0}
.person+.person{border-top:1px solid var(--line)}
.person .pn{flex:1;min-width:0}
.person .pn b{display:block;font-weight:600;overflow-wrap:anywhere}
.person .pn span{font-size:.8rem;color:var(--muted)}
.person .act{border:0;background:none;color:var(--late);font-weight:600;font-size:.85rem;padding:6px}
.person .act.muted{color:var(--muted)}
.copyrow{display:flex;gap:8px;align-items:center;background:var(--bg);border-radius:12px;padding:6px 6px 6px 12px}
.copyrow code{flex:1;min-width:0;overflow-wrap:anywhere;font-size:.85rem}
.signout{border:0;background:none;color:var(--late);font-weight:700;padding:12px;align-self:center}
select.hhpick{border:1px solid var(--line);background:var(--bg);border-radius:12px;padding:11px 12px;width:100%}

/* buttons */
.btn{border:0;border-radius:12px;padding:11px 18px;font-weight:700;background:var(--accent);color:var(--accent-ink)}
.btn.ghost{background:var(--sunken);color:var(--ink)}
.btn.danger{background:var(--late);color:var(--surface)}
.btn.sm{padding:8px 12px;font-size:.85rem}
.btn:disabled{opacity:.45;cursor:default}

/* bottom nav */
.nav{position:fixed;left:0;right:0;bottom:0;z-index:25;background:var(--surface);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px)}
.nav .wrap{display:flex;height:var(--nav-h);align-items:stretch}
.nav button{flex:1;border:0;background:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--faint);font-size:.72rem;font-weight:600;position:relative}
.nav button svg{width:23px;height:23px}
.nav button[aria-selected="true"]{color:var(--accent)}
.nav .badge{position:absolute;top:8px;left:calc(50% + 6px);min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:var(--now);color:#fff;font-size:.68rem;line-height:18px;font-variant-numeric:tabular-nums}
.fab{position:fixed;right:max(18px,calc(env(safe-area-inset-right,0px) + 18px));bottom:calc(var(--nav-h) + env(safe-area-inset-bottom,0px) + 16px);z-index:26;width:56px;height:56px;border:0;border-radius:18px;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;box-shadow:0 8px 22px color-mix(in srgb,var(--accent) 40%,transparent)}
.fab svg{width:26px;height:26px}
@media (min-width:700px){.fab{right:calc(50% - 320px + 16px)}}

/* sheet */
.scrim{position:fixed;inset:0;z-index:40;background:rgba(8,12,16,.5);display:flex;align-items:flex-end;justify-content:center}
@media (min-width:640px){.scrim{align-items:center}}
.sheet{background:var(--surface);width:100%;max-width:500px;max-height:92%;overflow:auto;border-radius:22px 22px 0 0;padding:10px max(20px,env(safe-area-inset-right,0px)) calc(20px + env(safe-area-inset-bottom,0px)) max(20px,env(safe-area-inset-left,0px));display:flex;flex-direction:column;gap:16px}
@media (min-width:640px){.sheet{border-radius:22px;padding-top:20px}}
.grab{width:40px;height:4px;border-radius:4px;background:var(--line);align-self:center}
@media (min-width:640px){.grab{display:none}}
.sheet-h{display:flex;justify-content:space-between;align-items:center;gap:10px}
.sheet h2{margin:0;font-family:var(--f-display);font-weight:600;font-size:1.35rem}
.xbtn{border:0;background:var(--sunken);width:32px;height:32px;border-radius:50%;color:var(--muted);font-size:1.1rem}
.bigin{border:0;border-bottom:2px solid var(--line);background:none;font-size:1.2rem;font-weight:600;padding:6px 0;width:100%}
.bigin:focus{outline:none;border-color:var(--accent)}
.field{display:flex;flex-direction:column;gap:8px}
.field>.lbl,.field>label{font-size:.74rem;text-transform:uppercase;letter-spacing:.08em;font-weight:700;color:var(--muted)}
.field input[type=time],.field input[type=date],.field textarea{border:1px solid var(--line);background:var(--bg);border-radius:12px;padding:10px 12px;width:100%}
.timerow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.timerow input{flex:1;min-width:140px}
.pills{display:flex;flex-wrap:wrap;gap:6px}
.pills button{border:1px solid var(--line);background:var(--surface);border-radius:99px;padding:7px 13px;font-weight:600;font-size:.85rem;color:var(--muted)}
.pills button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.pills.cats button{display:inline-flex;align-items:center;gap:6px}
.pills.cats button::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--cc)}
.pills.cats button[aria-pressed="true"]{background:color-mix(in srgb,var(--cc) 15%,transparent);border-color:var(--cc);color:var(--ink)}
.pills.dow{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.pills.dow button{padding:9px 0;border-radius:12px}
.quick{display:flex;gap:4px;flex-wrap:wrap}
.quick button{border:0;background:none;color:var(--accent);font-weight:600;font-size:.84rem;padding:4px 6px}
.actions{display:flex;gap:10px;align-items:center}
.actions .grow{flex:1}
.linkdel{border:0;background:none;color:var(--late);font-weight:600;padding:8px 2px}
.confirm{background:var(--late-soft);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:10px}
.confirm div{display:flex;gap:8px}
.err{color:var(--late);font-size:.85rem;min-height:1em;margin-top:-8px}

.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--nav-h) + env(safe-area-inset-bottom,0px) + 86px);z-index:50;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:12px;font-size:.88rem;font-weight:600;max-width:calc(100% - 32px);box-shadow:var(--shadow)}
.loading{color:var(--muted);text-align:center;padding:60px 0}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ---------- office additions ---------- */
.people-filter{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 6px;margin:0 -2px;scrollbar-width:none}
.people-filter::-webkit-scrollbar{display:none}
.pf{flex:none;border:1px solid var(--line);background:var(--surface);border-radius:99px;padding:5px 12px 5px 5px;display:flex;align-items:center;gap:7px;font-weight:600;font-size:.86rem;color:var(--ink)}
.pf.all{padding-left:12px}
.pf small{color:var(--muted);font-weight:600;font-variant-numeric:tabular-nums}
.pf[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.pf[aria-pressed="true"] small{color:color-mix(in srgb,var(--bg) 70%,transparent)}
.who{display:inline-flex;align-items:center;gap:5px;font-size:.76rem;font-weight:600;color:var(--muted)}
.who .av{width:18px;height:18px;font-size:.6rem}
.card .tags{align-items:center;margin-top:4px}
.wrow{align-items:center}
.wrow .av{width:20px;height:20px;font-size:.6rem}
.wday.off{color:var(--muted)}
.gitem .av{width:24px;height:24px;font-size:.62rem}
.page-sub{color:var(--muted);font-size:.88rem;margin-top:-12px}
.page-p{margin:2px 0 0;color:var(--muted)}
.tlist{background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
.trow{width:100%;border:0;background:none;text-align:left;display:flex;align-items:center;gap:12px;padding:12px 14px}
.trow+.trow{border-top:1px solid var(--line)}
.trow .av{width:38px;height:38px;font-size:.9rem}
.trow .tn{flex:1;min-width:0;display:flex;flex-direction:column}
.trow .tn b{overflow-wrap:anywhere}
.trow .tn>span{font-size:.82rem;color:var(--muted)}
.trow .bar{display:block;height:6px;border-radius:6px;background:var(--sunken);overflow:hidden;margin-top:6px;max-width:220px}
.trow .bar i{display:block;height:100%;background:var(--ok);border-radius:6px}
.trow .chev{color:var(--faint);font-size:1.2rem}
.badge-role{display:inline-block;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:1px 7px;border-radius:99px;background:var(--accent-soft);color:var(--accent);vertical-align:2px;margin-left:4px}
.panel input[type=email],.panel input[type=tel],.panel input:not([type]),.panel input[type=text]{border:1px solid var(--line);background:var(--bg);border-radius:12px;padding:11px 12px;width:100%}
.panel input:focus{outline:none;border-color:var(--accent)}
.flabel{font-size:.74rem;text-transform:uppercase;letter-spacing:.08em;font-weight:700;color:var(--muted);display:flex;flex-direction:column;gap:6px}
.flabel input{text-transform:none;letter-spacing:0;font-weight:500;font-size:1rem;color:var(--ink)}
.checkrow{display:flex!important;flex-direction:row!important;align-items:flex-start;gap:10px;text-transform:none!important;letter-spacing:0!important;font-weight:500!important;font-size:.92rem!important;color:var(--ink)!important}
.checkrow input{width:20px!important;height:20px;padding:0!important;margin:1px 0 0;accent-color:var(--accent);flex:none}
.panel .btn{align-self:flex-start}
.small{font-size:.84rem;color:var(--muted);margin:0}
.sharebox{display:flex;flex-direction:column;gap:6px}
.sharebox>span{font-size:.78rem;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);font-weight:700}
.copyrow{background:var(--surface)}
.divider{display:flex;align-items:center;gap:12px;color:var(--faint);font-size:.84rem}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:var(--line)}
.sub-h{font-family:var(--f-display);font-weight:600;font-size:1.2rem;margin:0}
.choice .chev{font-size:.9rem;font-weight:700;color:var(--accent)}
.ps-id{display:flex;gap:12px;align-items:center;min-width:0}
.av.big{width:46px;height:46px;font-size:1.1rem}
.kv{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;background:var(--bg);border-radius:14px;padding:14px}
.kv span{color:var(--muted);font-size:.86rem}
.kv b{font-weight:600;overflow-wrap:anywhere;min-width:0}
.pills.ppl button{padding:4px 12px 4px 4px;display:inline-flex;align-items:center;gap:6px}
.pills.ppl button .av{width:22px;height:22px;font-size:.6rem}
.pills.cats button::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--cc)}
.me-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}

/* ---------- v3: roles, pipeline, money ---------- */
.mebtn{border:0;background:none;display:flex;align-items:center;gap:10px;padding:0;min-width:0;color:inherit}
.mebtn .av{width:34px;height:34px;font-size:.85rem}
.seg{display:inline-flex;background:var(--sunken);border-radius:999px;padding:3px;align-self:flex-start}
.seg button{border:0;background:none;padding:6px 14px;border-radius:999px;font-weight:600;font-size:.84rem;color:var(--muted)}
.seg button[aria-pressed="true"]{background:var(--surface);color:var(--ink);box-shadow:var(--shadow)}
.seg.wide{display:flex}.seg.wide button{flex:1;padding:9px}
.ctrl{display:flex;gap:8px;flex-wrap:wrap;justify-content:space-between}
.page-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.ok-t{color:var(--in)}.late-t{color:var(--out)}.hot-t{color:var(--hot)}.muted{color:var(--muted)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
.stats.three{grid-template-columns:repeat(3,1fr)}
.stats>div{background:var(--surface);padding:12px;display:flex;flex-direction:column;gap:2px;min-width:0}
.stats span{font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700}
.stats b{font-family:var(--f-display);font-weight:600;font-size:1.25rem;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
@media (max-width:520px){.stats{grid-template-columns:repeat(2,1fr)}.stats.three{grid-template-columns:repeat(3,1fr)}.stats.three b{font-size:1.05rem}}
.olist{display:flex;flex-direction:column;gap:8px}
.ocard{border:0;background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow);display:flex;align-items:center;gap:12px;padding:12px 14px;text-align:left;width:100%}
.ocard>.av{width:28px;height:28px}
.ob{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ot{font-weight:700;overflow-wrap:anywhere}
.os{font-size:.85rem;color:var(--muted);overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.ob .tags{display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:.76rem;font-weight:600;margin-top:3px}
.rate{flex:none;width:52px;height:52px;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;background:color-mix(in srgb,var(--rc) 14%,transparent);color:var(--rc)}
.rate b{font-family:var(--f-display);font-weight:700;font-size:1.25rem;font-variant-numeric:tabular-nums}
.rate small{font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin-top:2px}
.rate.hot{--rc:var(--hot)}.rate.warm{--rc:var(--warm)}.rate.cold{--rc:var(--cold)}.rate.won{--rc:var(--in)}.rate.lost{--rc:var(--muted)}
.stage{font-size:.7rem;font-weight:700;padding:1px 8px;border-radius:99px;color:var(--sc);background:color-mix(in srgb,var(--sc) 13%,transparent)}
.s-lead{--sc:#7A8390}.s-contacted{--sc:#4F7FAF}.s-meeting{--sc:#7457E8}.s-proposal{--sc:#D98E04}.s-negotiation{--sc:#D9480F}.s-won{--sc:#17996F}.s-lost{--sc:#9AA3AD}
.stepper{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.stepper::-webkit-scrollbar{display:none}
.stepper button{flex:none;border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:7px 11px;font-weight:600;font-size:.82rem;color:var(--muted)}
.stepper button[aria-pressed="true"],.pills.stages button[aria-pressed="true"]{background:var(--sc);border-color:var(--sc);color:#fff}
.od-h{display:flex;gap:12px;align-items:center;min-width:0}
.od-h h2{overflow-wrap:anywhere}
.whybtn{border:0;background:none;color:var(--accent);font-weight:600;padding:0;align-self:flex-start}
.why{list-style:none;margin:0;padding:12px 14px;background:var(--bg);border-radius:14px;display:flex;flex-direction:column;gap:6px}
.why li{display:flex;justify-content:space-between;gap:12px;font-size:.9rem}
.why li b{font-variant-numeric:tabular-nums}
.why li.tot{border-top:1px solid var(--line);padding-top:6px;font-weight:700}
.composer{display:flex;flex-direction:column;gap:8px;background:var(--bg);border-radius:14px;padding:12px}
.composer textarea{border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:10px 12px;width:100%;resize:vertical}
.composer .btn{align-self:flex-end}
.pills.kinds button{padding:6px 11px;gap:5px}
.pills.kinds svg{width:16px;height:16px}
.tl{display:flex;flex-direction:column}
.tli{display:flex;gap:12px;padding:10px 0;align-items:flex-start}
.tli+.tli{border-top:1px solid var(--line)}
.tli-i{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--sunken);color:var(--muted)}
.tli-i svg{width:16px;height:16px}
.tli.k-email .tli-i{color:#4F7FAF}.tli.k-call .tli-i{color:#17996F}.tli.k-meeting .tli-i{color:#7457E8}.tli.k-stage .tli-i{color:var(--warm)}
.tli>div{flex:1;min-width:0}
.tli p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.tli.k-stage p{font-weight:600}
.tli .x{border:0;background:none;color:var(--faint);width:32px;height:32px;font-size:1.1rem}
.kv b .av{display:inline-grid;width:20px;height:20px;font-size:.58rem;vertical-align:-4px}
.kv b.sel{user-select:text}
.sheet.tall{max-width:560px}
.form.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:480px){.form.two{grid-template-columns:1fr}}
.sheet .form input{background:var(--bg)}
.mgroup{display:flex;flex-direction:column;gap:8px}
.mhead{display:flex;justify-content:space-between;align-items:baseline;gap:8px;flex-wrap:wrap}
.mhead b{font-family:var(--f-display);font-weight:600;font-size:1.1rem}
.mhead>span{font-size:.82rem;color:var(--muted);font-variant-numeric:tabular-nums}
.frow{display:flex;align-items:center}
.frow+.frow{border-top:1px solid var(--line)}
.frow .check{width:52px;height:56px}.frow .check .box{width:26px;height:26px}
.fmain{flex:1;min-width:0;border:0;background:none;display:flex;align-items:center;gap:12px;text-align:left;padding:10px 14px 10px 0}
.fdate{flex:none;width:38px;display:flex;flex-direction:column;align-items:center;line-height:1.05;font-size:.68rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700}
.fdate b{font-family:var(--f-display);font-size:1.15rem;color:var(--ink);letter-spacing:0}
.fb{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.ft{font-weight:600;overflow-wrap:anywhere}
.fs{font-size:.8rem;color:var(--muted);overflow-wrap:anywhere}
.famt{flex:none;font-weight:700;font-variant-numeric:tabular-nums;font-size:.95rem}
.famt.income{color:var(--in)}.famt.expense{color:var(--out)}
.frow.done .ft{color:var(--muted)}
.frow.done .famt{opacity:.6}
.badge-role.r-admin{background:color-mix(in srgb,var(--hot) 14%,transparent);color:var(--hot)}
.badge-role.r-sales{background:color-mix(in srgb,var(--c-admin) 14%,transparent);color:var(--c-admin)}
.badge-role.r-staff{background:var(--sunken);color:var(--muted)}
.pending{font-style:normal;color:var(--warm);font-weight:600}
.roles{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.roles button{border:1px solid var(--line);background:var(--surface);border-radius:14px;padding:10px 12px;text-align:left;display:flex;flex-direction:column;gap:2px}
.roles button span{font-size:.78rem;color:var(--muted)}
.roles button[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent)}
.swatch{width:34px;height:34px;padding:0!important;border-radius:50%!important;background:var(--sw)!important;border:2px solid var(--sw)!important}
.swatch[aria-pressed="true"]{box-shadow:0 0 0 2px var(--surface) inset,0 0 0 2px var(--ink)}
.inline{display:flex;gap:8px}
.inline input{flex:1;min-width:0;border:1px solid var(--line);background:var(--bg);border-radius:12px;padding:11px 12px}
.ps-id b{display:block}
.nav button{font-size:.68rem}

/* quick links (e.g. MediCase) */
.qlinks{display:flex;gap:6px;margin-left:auto;min-width:0}
.qlink{display:inline-flex;align-items:center;gap:4px;padding:6px 10px 6px 12px;border-radius:99px;background:var(--accent-soft);color:var(--accent);font-weight:700;font-size:.82rem;text-decoration:none;white-space:nowrap}
.qlink svg{width:14px;height:14px}
.qlink:hover{background:var(--accent);color:var(--accent-ink)}
@media (max-width:460px){.qlinks~.mebtn .hhname{display:none}}
