/* Hobsons Bay Dental patient app.
   Direction: clinical-clean, calm and local. Deep-teal header bands that end in a soft "bay" wave
   (the one decorative signature); everything below is quiet white surfaces, cool neutrals and one
   accessible cyan for action. George appears only for welcome, empty states and celebrations. */
*{margin:0;padding:0;box-sizing:border-box}

/* ---------- tokens ---------- */
:root{
  color-scheme:light;
  --brand:#00A3DA;          /* HBD cyan: decoration only (fails AA as text on white) */
  --pa:#00739A;             /* accessible primary: text/buttons on white, 5.3:1 */
  --pa-hover:#005F80;
  --on-pa:#FFFFFF;
  --pa-tint:rgba(0,115,154,.08);
  --pa-tint-2:rgba(0,115,154,.14);
  --teal:#143B48;           /* header band */
  --teal-ink:#FFFFFF;
  --teal-sub:rgba(255,255,255,.84);
  --bg:#F2F6F8; --bg-outer:#E4ECF0;
  --surface:#FFFFFF; --surface-2:#EDF3F6;
  --line:#DCE5E9; --line-strong:#7A8F99;  /* control borders ≥3:1 */
  --ink:#10262E; --ink-2:#3E5560; --ink-3:#566B75;
  --focus:#0B5C7A; --focus-on-dark:#FFFFFF;
  --ok:#15803D; --ok-bg:#E3F5E9; --ok-fg:#14532D;
  --warn-bg:#FDF0D9; --warn-fg:#7A3410; --warn-line:#E9B872;
  --err:#B91C1C; --err-bg:#FDECEC; --err-fg:#8F1515;
  --info-bg:#E1EEFB; --info-fg:#1E3A8A;
  --amber:#D98A06;
  --shadow:0 1px 2px rgba(16,38,46,.06),0 2px 8px rgba(16,38,46,.04);
  --shadow-up:0 -1px 0 var(--line),0 -6px 20px rgba(16,38,46,.06);
  --r-s:10px; --r:14px; --r-l:20px;
  --safe-b:env(safe-area-inset-bottom,0px); --safe-t:env(safe-area-inset-top,0px);
  --nav-h:64px;
  --wave:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 480 28' preserveAspectRatio='none'%3E%3Cpath d='M0 14 C80 2 160 2 240 12 S400 26 480 12 V28 H0Z'/%3E%3C/svg%3E");
}
@media (prefers-color-scheme:dark){
  :root{
    color-scheme:dark;
    --pa:#5CCBF0; --pa-hover:#86D9F5; --on-pa:#05212B;
    --pa-tint:rgba(92,203,240,.10); --pa-tint-2:rgba(92,203,240,.18);
    --teal:#0F2C36; --teal-sub:rgba(231,241,244,.82);
    --bg:#0B1A20; --bg-outer:#071317;
    --surface:#12262E; --surface-2:#1A323B;
    --line:#24404A; --line-strong:#6F8C97;
    --ink:#E7F1F4; --ink-2:#B1C4CB; --ink-3:#97ACB4;
    --focus:#8FDDF7;
    --ok:#4ADE80; --ok-bg:#12352A; --ok-fg:#A7F3C4;
    --warn-bg:#3A2A10; --warn-fg:#FCD9A0; --warn-line:#8A6526;
    --err:#F87171; --err-bg:#3B1515; --err-fg:#FECACA;
    --info-bg:#172C4D; --info-fg:#BFD7FF;
    --amber:#F5B544;
    --shadow:0 1px 2px rgba(0,0,0,.3);
    --shadow-up:0 -1px 0 var(--line);
  }
}

/* ---------- base ---------- */
html{-webkit-text-size-adjust:100%;background:var(--bg-outer)}
body{font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  font-size:1rem;line-height:1.45;background:var(--bg);color:var(--ink);min-height:100vh;max-width:480px;margin:0 auto;
  padding-bottom:calc(var(--nav-h) + 16px + var(--safe-b));-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
button{-webkit-tap-highlight-color:transparent}
img,svg{flex-shrink:0}
a{color:var(--pa)}
strong{font-weight:650}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:6px}
.hd :focus-visible,.auth :focus-visible,.consent :focus-visible{outline-color:var(--focus-on-dark)}
.auth-card :focus-visible,.consent-card :focus-visible{outline-color:var(--focus)}
.focus-target:focus{outline:none}
.skip{position:absolute;left:-999px;top:8px;background:var(--surface);color:var(--pa);padding:12px 16px;border-radius:var(--r-s);z-index:300;font-weight:700}
.skip:focus{left:8px}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
[hidden]{display:none!important}
.ic{display:inline-block;vertical-align:middle}

/* ---------- header band + bay wave (signature) ---------- */
.hd{position:relative;background:var(--teal);color:var(--teal-ink);padding:calc(20px + var(--safe-t)) 20px 44px;overflow:hidden}
.hd::before{content:"";position:absolute;right:-60px;top:-80px;width:240px;height:240px;border-radius:50%;background:var(--brand);opacity:.14;pointer-events:none}
.hd::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:28px;background:var(--bg);
  -webkit-mask:var(--wave) center/100% 100% no-repeat;mask:var(--wave) center/100% 100% no-repeat;pointer-events:none}
.hd-in{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.hd-txt{min-width:0}
.hd h1{font-size:1.625rem;line-height:1.2;font-weight:700;letter-spacing:-.01em;overflow-wrap:anywhere}
.hd-sub{font-size:.9375rem;color:var(--teal-sub);margin-top:4px;overflow-wrap:anywhere}
.hd-george{width:72px;height:72px;border-radius:50%;background:var(--brand);display:flex;align-items:flex-end;justify-content:center;overflow:hidden;flex-shrink:0;box-shadow:0 0 0 3px rgba(255,255,255,.18)}
.hd-george .g{display:block;margin-bottom:-6px}
.hd-back{position:relative;display:inline-flex;align-items:center;gap:4px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);color:#fff;border-radius:999px;
  padding:8px 14px 8px 10px;min-height:44px;margin-bottom:12px;cursor:pointer;font-size:.9375rem;font-weight:600}
.hd-back:hover{background:rgba(255,255,255,.2)}

/* ---------- layout ---------- */
.ct{padding:4px 16px 16px}
.cd{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;margin-bottom:12px;box-shadow:var(--shadow)}
.card-h{font-size:1.0625rem;line-height:1.3;font-weight:650;color:var(--ink);margin-bottom:10px}
.lbl{font-size:.875rem;color:var(--pa);font-weight:650;margin:2px 0 8px}
.sec-h{font-size:.9375rem;font-weight:650;color:var(--ink-2);margin:20px 4px 8px}
.t{font-size:1rem;font-weight:600;color:var(--ink);display:block;line-height:1.35}
.t.big{font-size:1.25rem;margin:10px 0 6px}
.muted{color:var(--ink-2);font-size:.9375rem}
.sm{font-size:.875rem;display:block}
.it{font-style:italic;margin-top:8px}
.center{text-align:center}
.right{text-align:right}
.row{display:flex;align-items:center}
.row.between{justify-content:space-between;align-items:flex-start;gap:10px}
.row.center{justify-content:center}
.gap{gap:10px}
.wrap{flex-wrap:wrap}
.para{font-size:.9375rem;color:var(--ink-2);line-height:1.6;margin-bottom:10px}
.note{background:var(--warn-bg);color:var(--warn-fg);border-radius:var(--r-s);padding:10px 12px;font-size:.875rem;margin-top:10px;line-height:1.5}
.note p+p{margin-top:6px}
.banner{background:var(--warn-bg);border:1px solid var(--warn-line);color:var(--warn-fg);border-radius:var(--r);padding:12px 14px;font-size:.9375rem;margin:0 0 12px}

/* ---------- appointment cards ---------- */
.next{border-top:4px solid var(--brand);padding-top:14px}
.next .lbl{margin-bottom:10px}
.cd.alert{border:2px solid var(--pa);background:linear-gradient(var(--pa-tint),var(--pa-tint)),var(--surface)}
.appt-row{display:flex;gap:14px;align-items:flex-start}
.appt-main{flex:1;min-width:0}
.appt-main .row.between{margin-bottom:4px;flex-wrap:wrap;gap:4px 8px}
.appt-main .row.between>.t{flex:1 1 8rem}
.appt-main .t{overflow-wrap:anywhere}
.dtile{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:58px;padding:8px 6px;border-radius:12px;background:var(--pa-tint);color:var(--ink);line-height:1.1}
.dtile-m{font-size:.8125rem;font-weight:650;color:var(--pa)}
.dtile-d{font-size:1.5rem;font-weight:750;font-variant-numeric:tabular-nums;margin:2px 0}
.dtile-w{font-size:.75rem;color:var(--ink-2)}
.next .pb,.next .link{margin-top:12px}
.empty-next .t{margin-bottom:4px}
.appt-actions{margin-top:12px}
.appt-actions:empty{display:none}
.appt-actions .row{flex-wrap:wrap}
.prop{border-left:3px solid var(--pa);padding:10px 12px;margin:12px 0 4px;background:var(--surface-2);border-radius:0 var(--r-s) var(--r-s) 0}
.prop p{font-size:.9375rem;line-height:1.5}
.prop p+p{margin-top:4px}
.confirm{background:var(--surface-2);border-radius:var(--r-s);padding:12px}
.confirm-q{font-size:.9375rem;font-weight:600;margin-bottom:10px}
.pr{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:.9375rem}
.pr:last-child{border-bottom:0}
.pr-l{color:var(--ink-2)}
.pr-v{color:var(--ink);font-weight:600;text-align:right;overflow-wrap:anywhere}
.review{margin-top:14px;text-align:left}

/* ---------- status badges (icon + text, never colour alone) ---------- */
.badge{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:3px 10px 3px 8px;font-size:.8125rem;font-weight:650;line-height:1.3;max-width:100%}
.st-pending{background:var(--warn-bg);color:var(--warn-fg)}
.st-proposed{background:var(--info-bg);color:var(--info-fg)}
.st-upcoming{background:var(--ok-bg);color:var(--ok-fg)}
.st-declined{background:var(--err-bg);color:var(--err-fg)}
.st-cancelled{background:var(--surface-2);color:var(--ink-2)}
.st-completed{background:var(--pa-tint-2);color:var(--ink)}
.st-no_show{background:var(--surface-2);color:var(--ink-2)}
.status-chip{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:4px 10px;font-size:.8125rem;font-weight:650;text-align:right}
.status-chip.ok{background:var(--ok-bg);color:var(--ok-fg)}
.status-chip.warn{background:var(--warn-bg);color:var(--warn-fg)}
.status-chip.neutral{background:var(--surface-2);color:var(--ink-2)}

/* ---------- score ---------- */
.sc{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;margin-bottom:12px;box-shadow:var(--shadow)}
.sc-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.sc-l{font-size:.875rem;color:var(--ink-2);font-weight:600}
.sc-n{font-size:2.5rem;font-weight:750;line-height:1.05;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.sc-s{font-size:.875rem;color:var(--ink-2);margin-top:6px}
.sc-george{margin:-6px -4px -10px 0}
.sc-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.sc-stats p{display:flex;flex-direction:column;font-size:.8125rem;color:var(--ink-2)}
.sc-stats strong{font-size:1.125rem;color:var(--ink);font-variant-numeric:tabular-nums}
.tier-pill{display:inline-flex;align-items:center;border-radius:999px;padding:4px 12px;font-size:.8125rem;font-weight:700;margin-top:6px;border:1px solid transparent;white-space:nowrap}
.tier-bronze{background:#F6E7D8;color:#6B3A12;border-color:#E2C3A2}
.tier-silver{background:#ECEFF3;color:#36424F;border-color:#C9D1DA}
.tier-gold{background:#FBEFC8;color:#6B4A00;border-color:#EBCF79}
.tier-platinum{background:#ECE8FB;color:#43348A;border-color:#CBC2F0}
.bar{background:var(--surface-2);border-radius:6px;height:8px;overflow:hidden;margin-top:14px}
.bar.light{margin:8px 0 12px}
.bar-f{background:var(--brand);height:100%;border-radius:6px}
.bar-f.amber{background:var(--amber)}

/* ---------- Dr Dan / George bubble ---------- */
.dan{background:var(--surface-2);border-radius:var(--r);padding:12px 14px;margin-bottom:12px;display:flex;gap:12px;align-items:flex-start}
.av{width:38px;height:42px;flex-shrink:0}
.dan .av svg{display:block;width:38px;height:42px}
.dan-lbl{font-size:.8125rem;color:var(--pa);font-weight:650;margin-bottom:2px}
.dan-txt{font-size:.9375rem;color:var(--ink-2);line-height:1.5}

/* ---------- grouped list (Home shortcuts, More) ---------- */
.lg{list-style:none;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden;margin-bottom:12px}
.lg li+li{border-top:1px solid var(--line)}
.lg-b{width:100%;display:flex;align-items:center;gap:14px;text-align:left;background:none;border:0;padding:12px 14px;min-height:60px;cursor:pointer}
.lg-b:hover{background:var(--surface-2)}
.lg-b:focus-visible{outline-offset:-3px;border-radius:var(--r)}
.lg-i{width:40px;height:40px;border-radius:12px;background:var(--pa-tint);color:var(--pa);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.lg-t{flex:1;min-width:0}
.lg-t .muted{margin-top:1px}
.lg-c{color:var(--ink-3)}
.lg-badge{background:var(--pa);color:var(--on-pa);border-radius:999px;font-size:.75rem;font-weight:700;padding:2px 8px}

/* ---------- choices (booking) ---------- */
.choice{width:100%;display:flex;align-items:center;gap:14px;text-align:left;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r);padding:12px 14px;min-height:64px;margin-bottom:10px;cursor:pointer}
.choice:hover{border-color:var(--line-strong)}
.choice.sel{border-color:var(--pa);box-shadow:inset 0 0 0 1px var(--pa);background:linear-gradient(var(--pa-tint),var(--pa-tint)),var(--surface)}
.choice-i{width:44px;height:44px;border-radius:12px;background:var(--surface-2);display:flex;align-items:center;justify-content:center;font-size:1.25rem;flex-shrink:0}
.choice-t{flex:1;min-width:0}
.choice-t .muted{margin-top:2px}

.sd{display:flex;gap:6px;margin:4px 0 18px}
.dt{flex:1;height:5px;border-radius:3px;background:var(--line)}
.dt.on{background:var(--brand)}
.tg{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(5.75rem,100%),1fr));gap:8px;margin-bottom:12px}
.tb{min-height:48px;padding:10px 4px;border-radius:var(--r-s);border:1.5px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;font-size:.9375rem;font-weight:550;font-variant-numeric:tabular-nums}
.tb:hover{border-color:var(--pa);color:var(--pa)}
.tb.sel{background:var(--pa);color:var(--on-pa);border-color:var(--pa)}
.tt{display:flex;background:var(--surface-2);border-radius:12px;padding:4px;margin-bottom:14px;gap:2px}
.tt button{flex:1;min-height:44px;padding:8px 4px;border-radius:9px;border:none;font-weight:600;font-size:.9375rem;cursor:pointer;background:transparent;color:var(--ink-2)}
.tt .on{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(16,38,46,.12)}

/* ---------- buttons ---------- */
.pb{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;padding:12px 18px;border-radius:12px;background:var(--pa);color:var(--on-pa);border:1.5px solid var(--pa);
  font-size:1rem;font-weight:650;cursor:pointer;margin-top:8px;text-align:center;line-height:1.25}
.pb:hover:not(:disabled){background:var(--pa-hover);border-color:var(--pa-hover)}
.pb.sec{background:var(--surface);color:var(--pa);border-color:var(--line-strong)}
.pb.sec:hover:not(:disabled){background:var(--pa-tint);border-color:var(--pa)}
.pb.danger{background:var(--err);border-color:var(--err);color:#fff}
.pb.done{background:var(--ok);border-color:var(--ok);color:#fff}
@media (prefers-color-scheme:dark){.pb.danger{color:#2A0606}.pb.done{color:#052E16}}
.pb.sm{min-height:48px;padding:10px 16px;font-size:.9375rem;width:auto;display:inline-flex;margin-top:0}
.pb:disabled{opacity:.6;cursor:not-allowed}
.bb{display:block;width:100%;min-height:48px;background:none;border:none;color:var(--ink-2);cursor:pointer;font-size:.9375rem;margin-top:6px;padding:10px;text-decoration:underline;text-underline-offset:3px}
.bb.back{display:inline-flex;align-items:center;gap:4px;width:auto;text-decoration:none;font-weight:600;padding:10px 12px 10px 4px}
.link{display:inline-flex;align-items:center;background:none;border:none;color:var(--pa);font-weight:650;font-size:.9375rem;cursor:pointer;min-height:44px;padding:8px 0;text-decoration:underline;text-underline-offset:3px}
.xb{background:var(--surface);color:var(--err);border:1.5px solid var(--err);border-radius:12px;min-height:48px;padding:10px 16px;font-size:.9375rem;font-weight:650;cursor:pointer}
.xb:hover{background:var(--err-bg)}
.icon-btn{min-width:48px;min-height:48px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);border-radius:12px;font-size:1.375rem;cursor:pointer}
.icon-btn:disabled{opacity:.35;cursor:not-allowed}
.pill-link{display:inline-flex;align-items:center;min-height:44px;padding:8px 16px;border-radius:999px;background:var(--pa-tint);color:var(--pa);font-weight:650;font-size:.9375rem;text-decoration:none;margin:8px 0}
.pill-link:hover{background:var(--pa-tint-2)}

/* ---------- forms ---------- */
.field{margin-bottom:16px}
.field label,.flabel{display:block;font-size:.9375rem;font-weight:600;color:var(--ink);margin-bottom:6px}
.hint{font-size:.875rem;color:var(--ink-2);margin-top:6px}
input[type=text],input[type=email],input[type=number],select,textarea{width:100%;min-height:48px;padding:12px 14px;border-radius:12px;border:1.5px solid var(--line-strong);font-size:1rem;background:var(--surface);color:var(--ink)}
input::placeholder,textarea::placeholder{color:var(--ink-3);opacity:1}
input:focus-visible,select:focus-visible,textarea:focus-visible{border-color:var(--pa);outline:3px solid var(--focus);outline-offset:1px}
textarea{resize:vertical;line-height:1.5}
.code-in{font-size:1.75rem!important;font-weight:700;text-align:center;letter-spacing:.4em;padding-left:.4em!important;border:2px solid var(--pa)!important;color:var(--ink);font-variant-numeric:tabular-nums}
.err{background:var(--err-bg);color:var(--err-fg);border-left:4px solid var(--err);padding:10px 14px;border-radius:var(--r-s);font-size:.9375rem;margin-bottom:12px}
.staging-note{font-size:.875rem;color:var(--warn-fg);background:var(--warn-bg);border:1px dashed var(--warn-line);border-radius:var(--r-s);padding:8px 10px;margin-top:10px;text-align:center}
.emo{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.emo-b{width:48px;height:48px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface);font-size:1.25rem;cursor:pointer}
.emo-b.sel{border-color:var(--pa);box-shadow:inset 0 0 0 1px var(--pa);background:var(--pa-tint)}

/* ---------- auth, consent, boot ---------- */
.auth,.consent{min-height:100vh;background:var(--teal);display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:calc(32px + var(--safe-t)) 16px calc(32px + var(--safe-b));margin-bottom:calc(-1 * (var(--nav-h) + 16px + var(--safe-b)));position:relative;overflow:hidden}
.auth::before,.consent::before{content:"";position:absolute;right:-90px;top:-90px;width:300px;height:300px;border-radius:50%;background:var(--brand);opacity:.14}
.auth::after,.consent::after{content:"";position:absolute;left:0;right:0;bottom:0;height:22%;background:var(--brand);opacity:.16;
  -webkit-mask:var(--wave) top/100% 28px no-repeat,linear-gradient(#000,#000) 0 27px/100% 100% no-repeat;mask:var(--wave) top/100% 28px no-repeat,linear-gradient(#000,#000) 0 27px/100% 100% no-repeat}
.auth-card,.consent-card{position:relative;z-index:1;background:var(--surface);color:var(--ink);border-radius:var(--r-l);padding:28px 22px 20px;width:100%;max-width:420px;box-shadow:0 24px 60px rgba(0,0,0,.28)}
.auth-top{text-align:center;margin-bottom:18px}
.auth-top .g{display:block;margin:0 auto}
.auth-top h1,.consent-card h1{font-size:1.5rem;line-height:1.25;font-weight:700;color:var(--ink);margin-top:8px;letter-spacing:-.01em}
.auth .muted.center{margin-bottom:16px}
.consent-card h1{text-align:center}
.consent-body{max-height:50vh;overflow-y:auto;margin:14px 0;padding:2px 4px 2px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.consent-body p{font-size:.9375rem;color:var(--ink-2);line-height:1.6;margin:12px 0}
.boot{min-height:100vh;padding:calc(48px + var(--safe-t)) 16px 24px;margin-bottom:calc(-1 * (var(--nav-h) + 16px + var(--safe-b)))}
.boot-brand{display:flex;align-items:center;gap:12px;margin-bottom:24px}
.boot-brand img{border-radius:14px}
.boot-brand p{font-size:1.125rem;font-weight:700;color:var(--ink)}
.boot .empty{width:100%}

/* ---------- loading skeletons & empty states ---------- */
.loading{padding:4px 0}
.sk-card{display:block;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;margin-bottom:12px}
.sk{display:block;border-radius:6px;background:linear-gradient(90deg,var(--surface-2) 0,var(--line) 40%,var(--surface-2) 80%);background-size:300% 100%;animation:sk 1.4s ease-in-out infinite}
.sk-line{height:12px;margin:8px 0}
.sk-line:first-child{height:16px;margin-top:0}
.w40{width:40%}.w60{width:60%}.w90{width:90%}
@keyframes sk{0%{background-position:100% 0}100%{background-position:0 0}}
.empty{text-align:center;padding:24px 18px}
.empty .g{display:block;margin:0 auto 4px}
.empty-t{font-size:1.0625rem;font-weight:650;color:var(--ink);margin:8px 0 4px}

/* ---------- install card & notification offer ---------- */
.install{border-color:var(--pa-tint-2);background:linear-gradient(var(--pa-tint),var(--pa-tint)),var(--surface)}
.install-row,.offer-row{display:flex;gap:14px;align-items:flex-start}
.install-ic{border-radius:12px;box-shadow:0 1px 3px rgba(16,38,46,.2)}
.install-txt{min-width:0}
.install .card-h,.offer .card-h{margin-bottom:4px}
.install-act{margin-top:12px}
.kbd{display:inline-flex;align-items:center;gap:3px;padding:1px 7px;border:1px solid var(--line-strong);border-radius:6px;background:var(--surface);color:var(--ink);font-weight:600;font-size:.875rem;vertical-align:baseline}
.offer-i{width:40px;height:40px;border-radius:12px;background:var(--pa-tint);color:var(--pa);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ticks{list-style:none;margin:4px 0 12px}
.ticks li{display:flex;gap:10px;align-items:flex-start;font-size:.9375rem;color:var(--ink);padding:5px 0}
.ticks li .ic{color:var(--ok);margin-top:2px}

/* ---------- calendar ---------- */
.cal-nav{align-items:center!important;margin-bottom:12px}
.cal-nav h3{font-size:1.0625rem;font-weight:650}
.cal-g{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:10px}
.cal-h{font-size:.8125rem;font-weight:650;color:var(--ink-2);text-align:center;padding:4px 0}
.cal-d{min-height:44px;border-radius:10px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font-size:.9375rem;font-weight:550;cursor:pointer;font-variant-numeric:tabular-nums}
.cal-d:hover:not(:disabled){border-color:var(--pa)}
.cal-d:disabled{background:transparent;color:var(--ink-3);text-decoration:line-through;cursor:not-allowed;border-color:transparent;font-weight:400}
.cal-d.today{border-color:var(--pa);font-weight:750}
.cal-d.sel{background:var(--pa);color:var(--on-pa);border-color:var(--pa)}

/* ---------- rewards ---------- */
.q{font-size:1.0625rem;font-weight:650;color:var(--ink);margin-bottom:14px;line-height:1.45}
.q-opt{width:100%;min-height:52px;padding:12px 14px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;font-size:.9375rem;text-align:left;margin-bottom:8px;line-height:1.4}
.q-opt:hover:not(:disabled){border-color:var(--pa)}
.q-opt.correct{border-color:var(--ok)!important;background:var(--ok-bg);color:var(--ok-fg);font-weight:650}
.q-opt.correct::before{content:"✓ "}
.q-opt.wrong{border-color:var(--err)!important;background:var(--err-bg);color:var(--err-fg)}
.q-opt.wrong::before{content:"✕ "}
.q-opt:disabled{cursor:default}
.ok-t{color:var(--ok);font-weight:650;font-size:.9375rem;margin:10px 0}
.no-t{color:var(--err);font-weight:650;font-size:.9375rem;margin:10px 0}
.big-n{font-size:2.75rem;font-weight:750;color:var(--ink);line-height:1.1;margin-top:6px;font-variant-numeric:tabular-nums}
.week{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;text-align:center}
.wk-d{display:flex;width:34px;height:34px;border-radius:50%;margin:4px auto 0;background:var(--surface-2);align-items:center;justify-content:center;font-size:.875rem}
.wk-d.on{background:var(--pa);color:var(--on-pa);font-weight:700}
.perks{padding-left:20px;margin-top:8px}
.perks li{font-size:.9375rem;color:var(--ink-2);margin-bottom:4px}
.tier.cur{border:2px solid var(--pa)}
.brush .row{margin-top:8px}

/* ---------- family & kids ---------- */
.fam-e{font-size:1.75rem}
.fam .row.gap:last-child{margin-top:12px}
.teeth{display:grid;grid-template-columns:repeat(5,44px);gap:6px;justify-content:center;margin-bottom:10px}
.tooth{width:44px;height:44px;border-radius:10px;border:1.5px solid var(--line);background:var(--surface);font-size:1.125rem;cursor:pointer;display:flex;align-items:center;justify-content:center}
.tooth.lost{background:var(--warn-bg);border-color:var(--amber)}

/* ---------- history & clinics ---------- */
.hrow{margin-top:12px}
.hrow .lbl{margin-bottom:2px}
.hrow p:not(.lbl){font-size:.9375rem;color:var(--ink-2);line-height:1.5}
.hours{width:100%;border-collapse:collapse;margin:12px 0;font-size:.9375rem}
.hours caption{text-align:left}
.hours th{text-align:left;font-weight:600;color:var(--ink-2);padding:5px 0;width:64px}
.hours td{color:var(--ink);padding:5px 0;font-variant-numeric:tabular-nums}
.hours tr+tr{border-top:1px solid var(--line)}
.team{list-style:none}
.team li{display:flex;gap:12px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.team li:last-child{border-bottom:0}
.team-e{font-size:1.375rem}

/* ---------- bottom nav: 5 tabs, ≥48px targets, safe-area aware ---------- */
nav{position:fixed;bottom:0;left:0;right:0;width:100%;max-width:480px;margin:0 auto;background:var(--surface);display:flex;
  padding:6px 2px calc(6px + var(--safe-b));box-shadow:var(--shadow-up);z-index:100}
nav button{flex:1 1 auto;min-width:0;min-height:56px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:none;background:none;
  padding:4px 2px;color:var(--ink-2);cursor:pointer;border-radius:12px}
nav button:focus-visible{outline-offset:-2px}
.nav-i{position:relative;display:flex;align-items:center;justify-content:center;width:56px;height:30px;border-radius:999px}
nav button.on{color:var(--pa)}
nav button.on .nav-i{background:var(--pa-tint-2)}
nav button.on .ic{stroke-width:2.4}
.nav-l{font-size:.71875rem;font-weight:600;line-height:1.15;letter-spacing:-.005em;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
nav button.on .nav-l{font-weight:750}
.nav-dot{position:absolute;top:2px;right:12px;width:10px;height:10px;border-radius:50%;background:var(--err);box-shadow:0 0 0 2px var(--surface)}

/* ---------- toasts & offline ---------- */
.toasts{position:fixed;left:0;right:0;bottom:calc(var(--nav-h) + 20px + var(--safe-b));max-width:460px;margin:0 auto;padding:0 12px;z-index:200;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.toast{pointer-events:auto;display:flex;align-items:center;justify-content:space-between;gap:10px;background:#10262E;color:#fff;border-radius:12px;padding:8px 4px 8px 16px;font-size:.9375rem;line-height:1.4;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.toast.error{background:#8F1515}
@media (prefers-color-scheme:dark){.toast{background:#E7F1F4;color:#10262E}.toast.error{background:#FECACA;color:#5A0B0B}}
.toast-x{background:none;border:none;color:inherit;font-size:1.5rem;min-width:44px;min-height:44px;cursor:pointer;border-radius:10px}
.offline{position:fixed;top:0;left:0;right:0;max-width:480px;margin:0 auto;background:#7A3410;color:#fff;text-align:center;font-size:.875rem;padding:calc(8px + var(--safe-t)) 10px 8px;z-index:250}

/* ---------- George mascot animations ---------- */
.g{display:inline-block;vertical-align:middle}.g-bounce{animation:gBounce 3s ease-in-out infinite}@keyframes gBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}.g-wave-arm{animation:gWave 1.6s ease-in-out 3;transform-origin:145px 130px}@keyframes gWave{0%,100%{transform:rotate(0)}25%{transform:rotate(-18deg)}75%{transform:rotate(12deg)}}.g-blink{animation:gBlink 4s ease-in-out infinite}@keyframes gBlink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}.g-arm-l{animation:gArmL 1.2s ease-in-out infinite;transform-origin:58px 140px}.g-arm-r{animation:gArmR 1.2s ease-in-out infinite;transform-origin:142px 140px}@keyframes gArmL{0%,100%{transform:rotate(0)}50%{transform:rotate(10deg)}}@keyframes gArmR{0%,100%{transform:rotate(0)}50%{transform:rotate(-10deg)}}.g-sparkle{animation:gSpark 1.8s ease-in-out infinite}@keyframes gSpark{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.7)}}.g-zs text{animation:gZ 3s ease-in-out infinite;opacity:0}.g-zs text:nth-child(1){animation-delay:0s}.g-zs text:nth-child(2){animation-delay:1s}.g-zs text:nth-child(3){animation-delay:2s}@keyframes gZ{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(-15px)}}.g-q{animation:gQ 2s ease-in-out infinite}@keyframes gQ{0%,100%{opacity:.6;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}

/* ---------- wider screens: keep the phone column, frame it ---------- */
@media (min-width:600px){
  body{box-shadow:0 0 0 1px var(--line),0 10px 40px rgba(16,38,46,.08)}
  .ct{padding-left:20px;padding-right:20px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* George is a black pug: give him a soft rim light on dark surfaces so he stays visible */
@media (prefers-color-scheme:dark){.cd .g,.auth-card .g,.consent-card .g,.dan .g,.sc .g{filter:drop-shadow(0 0 1px rgba(231,241,244,.55)) drop-shadow(0 0 8px rgba(92,203,240,.3))}}

/* ---------- Phase 4a: taken times, health form, email switch ---------- */
.tb{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;line-height:1.2}
.tb.taken{background:var(--surface-2);border-style:dashed;border-color:var(--line-strong);color:var(--ink-3);cursor:not-allowed}
.tb.taken span:first-child{text-decoration:line-through}
.tb.taken:hover{border-color:var(--line-strong);color:var(--ink-3)}
.tb-taken{font-size:.75rem;font-weight:700;letter-spacing:.02em;text-transform:uppercase}
.intro .t{font-weight:650}
.intro .muted{margin-top:4px}
.lg-t .status-chip{margin-top:4px;align-self:flex-start;width:max-content;max-width:100%}
.lg-t{display:flex;flex-direction:column}
.status-line{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 12px}
.opt-group{border:0;margin:0 0 16px;padding:0;min-width:0}
.opt-group .flabel{padding:0}
.opt{display:flex;align-items:flex-start;gap:12px;min-height:48px;padding:12px 14px;border:1.5px solid var(--line);border-radius:12px;margin-bottom:8px;cursor:pointer;background:var(--surface);font-size:1rem}
.opt:hover{border-color:var(--pa)}
.opt:has(input:checked){border-color:var(--pa);background:var(--pa-tint)}
.opt input{flex:none;width:22px;height:22px;margin-top:1px;accent-color:var(--pa);cursor:pointer}
.opt input:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.opt>span{display:flex;flex-direction:column;gap:2px}
.opt-sub{font-weight:400}
input[type=tel]{width:100%;min-height:48px;padding:12px 14px;border-radius:12px;border:1.5px solid var(--line-strong);font-size:1rem;background:var(--surface);color:var(--ink)}
.hf-nudge{display:flex;align-items:center;gap:6px;margin-top:8px;color:var(--pa)}
.hf-nudge .link{text-align:left}
.switch-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.switch-lbl{flex:1;min-width:0}
.switch-lbl .muted{margin-top:2px}
.switch{display:inline-flex;align-items:center;gap:8px;min-height:48px;min-width:48px;padding:8px 4px;background:none;border:0;cursor:pointer;color:var(--ink);font-weight:650;font-size:.9375rem}
.switch:disabled{opacity:.6;cursor:progress}
.switch-track{position:relative;width:52px;height:30px;border-radius:999px;background:var(--line-strong);transition:background .15s}
.switch-knob{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.3);transition:transform .15s}
.switch.on .switch-track{background:var(--pa)}
.switch.on .switch-knob{transform:translateX(22px)}
@media (prefers-color-scheme:dark){.switch.on .switch-knob{background:var(--on-pa)}}
.switch-txt{min-width:2em;text-align:left}