/* Layout: one-column phone app — sticky session bar, three tabs (Train / Progress / History), bottom tab bar */
:root{
  /* Clean light style: white cards on light grey, one teal accent */
  --bg:#F2F4F7; --surface:#FFFFFF; --ink:#101828; --muted:#667085; --line:#E4E7EC;
  --accent:#0E7C86; --accent-ink:#FFFFFF; --accent-soft:#E3F2F3; --plate:#C2780A; --good:#12805C; --good-ink:#FFFFFF; --rest:#FFF6D6; --rest-ink:#7A5B00; --warn:#C2410C;
  --soft:#EEF1F5; --shadow:0 1px 2px rgba(16,24,40,.06), 0 1px 3px rgba(16,24,40,.05);
  --f-display:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --f-body:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --f-mono:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
html,body{height:100%}
body{background:var(--bg);color:var(--ink);font:16px/1.45 var(--f-body);-webkit-tap-highlight-color:transparent}
.wrap{max-width:560px;margin:0 auto;padding-inline:16px;padding-block:0 96px}
h1,h2,h3{font-family:var(--f-display);letter-spacing:.01em;text-wrap:balance;margin:0}
h1{font-size:30px;font-weight:800;text-transform:uppercase}
h2{font-size:22px;font-weight:700;text-transform:uppercase}
.lbl{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}
.num{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
button{font:inherit;color:inherit;cursor:pointer}
button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

header.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--bg);padding-block:12px 10px;display:grid;gap:8px;border-bottom:1px solid var(--line)}
.toprow{display:flex;align-items:center;justify-content:space-between;gap:8px 12px;flex-wrap:wrap}
#switchBtn{margin-left:auto;padding:6px 10px;font-size:13px}
.clock{display:flex;align-items:baseline;gap:6px}
.clock .num{font-size:20px}
.bar{height:6px;border-radius:3px;background:var(--soft);overflow:hidden}
.bar i{display:block;height:100%;width:0;background:var(--accent);transition:width .4s}
.bar.over i{background:var(--warn)}
.store{font-size:12px;color:var(--muted)}

section{display:grid;gap:14px;padding-block:16px 0}
.card{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px}
.btn{border:0;border-radius:8px;padding:12px 16px;font-weight:600;background:var(--soft)}
.btn.primary{background:var(--accent);color:var(--accent-ink)}
.btn.ghost{background:transparent;border:1px solid var(--line)}
.btn.small{padding:8px 12px;font-size:14px}
.btn.go{background:var(--good);color:var(--good-ink)}
.btn.partner{display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:100%;padding:16px 18px;border:2px solid var(--accent);text-align:left}
.btn.partner span{font-size:15px;font-weight:500;color:var(--muted)}
.btn.partner b{font-size:20px;color:var(--accent)}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px}
.chip{flex:none;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:8px 14px;font-weight:600;font-size:14px}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}

.plans{display:grid;gap:10px}
.plan{display:grid;gap:4px;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px}
.plan b{font-family:var(--f-display);font-size:20px;text-transform:uppercase}
.plan span{color:var(--muted);font-size:14px}

.ex{display:grid;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.ex.open{border-color:var(--accent)}
.exhead{display:flex;justify-content:space-between;align-items:center;gap:10px;background:none;border:0;padding:0;text-align:left;width:100%}
.exhead h3{font-size:19px;font-weight:700;text-transform:uppercase}
.target{font-size:13px;color:var(--muted)}
.pips{display:flex;gap:4px}
.pips i{width:10px;height:10px;border-radius:50%;border:2px solid var(--line)}
.pips i.done{background:var(--good);border-color:var(--good)}
.sets{display:grid;gap:6px}
.set{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:8px;font-size:15px;padding:6px 0;border-top:1px dashed var(--line)}
.set .n{color:var(--muted);font-size:13px}
.x{border:0;background:none;color:var(--muted);padding:4px 8px;font-size:18px;line-height:1}
.fx{border:1px solid var(--line);background:var(--surface);color:var(--muted);border-radius:8px;min-width:40px;min-height:40px;font-size:18px;line-height:1}
.fx.on{color:var(--plate);border-color:var(--plate)}
.pr{font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--plate);border:1px solid var(--plate);border-radius:4px;padding:1px 5px;margin-left:6px}

.entry{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.entry.entry-one{grid-template-columns:1fr}
.howto.howto-text{grid-template-columns:1fr}
.step{display:grid;gap:4px}
.stepper{display:grid;grid-template-columns:44px 1fr 44px;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--bg)}
.stepper button{border:0;background:var(--soft);font-size:22px;font-weight:600}
.stepper input{width:100%;min-width:0;border:0;background:transparent;text-align:center;font:500 20px var(--f-mono);color:var(--ink);padding:10px 0}
.hint{font-size:13px;color:var(--muted)}
.hint.warn{color:var(--warn)}
.dbrack{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}
.dbrack button{flex:none;border:1px solid var(--line);background:var(--bg);border-radius:6px;padding:6px 9px;font:500 13px var(--f-mono)}

.howto{display:grid;grid-template-columns:132px minmax(0,1fr);gap:12px;align-items:center;background:var(--bg);border-radius:8px;padding:8px}
.howto svg{width:132px;height:130px}
.howto ul{margin:0;padding-left:18px;display:grid;gap:4px;font-size:14px}
.howto .limb{stroke:var(--ink);stroke-width:4.5;stroke-linecap:round}
.howto .far{stroke:var(--muted);stroke-width:4;stroke-linecap:round;opacity:.6}
.howto .head{fill:var(--bg);stroke:var(--ink);stroke-width:3.5}
.howto .db line{stroke:var(--plate);stroke-width:3}
.howto .db rect{fill:var(--plate)}
.howto .prop{fill:none;stroke:var(--muted);opacity:.45;stroke-width:5;stroke-linecap:round}
.howto .floor{stroke:var(--line);stroke-width:2}
@media (max-width:360px){.howto{grid-template-columns:1fr}.howto svg{margin:0 auto}}
.who{display:grid;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));border:1px solid var(--line);border-radius:8px;overflow:hidden}
.who button{border:0;background:var(--surface);padding:10px;font-weight:600;font-size:15px}
.who button{box-shadow:-1px 0 0 var(--line), 0 -1px 0 var(--line)}
.who button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink)}
.who .num{font-size:13px;opacity:.8;margin-left:4px}
.pips{flex-direction:column;align-items:flex-end;gap:4px}
.piprow{display:flex;gap:4px;align-items:center}
.piprow span{font-size:11px;font-weight:700;color:var(--muted);width:18px;text-align:right}
.rest{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.rest .num{font-size:28px}

select{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:10px 12px;width:100%}
.chartbox{overflow-x:auto}
svg text{fill:var(--muted);font:11px var(--f-mono)}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.stat{display:grid;gap:2px}
.stat .num{font-size:20px}
.delta.up{color:var(--good)} .delta.down{color:var(--warn)}
.example{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--plate)}

.day{display:grid;gap:6px}
.day h3{font-size:18px;text-transform:uppercase}
.dayline{display:flex;justify-content:space-between;gap:8px;font-size:15px;border-top:1px dashed var(--line);padding-top:6px}
.dayline span:first-child{min-width:0}
.empty{color:var(--muted);text-align:center;padding:24px 8px}

nav.tabs{position:fixed;left:0;right:0;bottom:0;z-index:6;background:var(--surface);border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr);padding-bottom:env(safe-area-inset-bottom,0px)}
nav.tabs button{border:0;background:none;padding:12px 0 14px;font-family:var(--f-display);font-weight:700;font-size:16px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
nav.tabs.five button{font-size:14px;letter-spacing:0;padding-left:4px;padding-right:4px;white-space:nowrap}
nav.tabs.five{padding-left:4px;padding-right:4px}
@media (max-width:400px){nav.tabs.five button{font-size:11.5px;padding-left:1px;padding-right:1px}}
@media (max-width:350px){nav.tabs.five button{font-size:10.5px}}
nav.tabs button[aria-selected="true"]{color:var(--accent);box-shadow:inset 0 3px 0 var(--accent)}

.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cal-h{text-align:center;font-size:12px;font-weight:700;color:var(--muted)}
.cal-d{display:grid;justify-items:center;align-content:center;gap:1px;min-height:52px;padding:4px 1px;border-radius:8px;border:1px solid transparent;background:var(--surface);color:var(--ink);font:inherit}
.cal-d b{font-size:15px}
.cal-d small{font-size:10px;line-height:1.1;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-d.on{background:var(--accent);color:var(--accent-ink)}
.cal-d.rest{background:var(--rest)}
.cal-d.rest small{color:var(--rest-ink)}
.cal-d.fut{background:transparent;color:var(--muted);opacity:.6}
.cal-d.today{border-color:var(--plate);border-width:2px}
.cal-d.pick{outline:3px solid var(--ink);outline-offset:1px}
.tag.now{font-size:12px;font-weight:700;padding:4px 10px;border-radius:999px;background:var(--soft);color:var(--muted)}
.tag.rest{font-size:12px;font-weight:700;padding:4px 10px;border-radius:999px;background:var(--rest);color:var(--rest-ink)}
.confirm{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:14px}
.toast{position:fixed;left:50%;bottom:calc(76px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:8px;font-weight:600;font-size:14px;z-index:9;max-width:calc(100% - 32px)}
.addcustom{display:flex;gap:8px}
.addcustom input{flex:1;min-width:0;font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px 12px}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
html{color-scheme:light}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
body{margin:0}
*{box-sizing:border-box}
[hidden]{display:none!important}
.scan{position:fixed;inset:0;z-index:25;background:var(--bg);display:grid;grid-template-rows:auto 1fr;overflow:auto;padding:max(12px,env(safe-area-inset-top)) 16px calc(16px + env(safe-area-inset-bottom,0px))}
.scan .vid{position:relative;border-radius:12px;overflow:hidden;background:#000;height:min(58vh,440px);width:100%}
.scan video{width:100%;height:100%;object-fit:cover;display:block}
.scan .aim{position:absolute;left:5%;right:5%;top:32%;height:36%;border:3px solid #fff;border-radius:10px;box-shadow:0 0 0 999px rgba(0,0,0,.35)}
.gate{position:fixed;inset:0;z-index:20;background:var(--bg);display:grid;place-items:center;padding:24px 16px}
.gate .card{width:100%;max-width:360px;display:grid;gap:12px}
.gate input:not(.text){font:500 24px var(--f-mono);text-align:center;letter-spacing:.2em;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:12px;width:100%}
.data{display:grid;gap:8px}
.weekstrip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.wd{display:grid;gap:2px;justify-items:center;text-align:center;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:6px 2px;font-size:11px;line-height:1.2;color:var(--muted)}
.wd b{font-family:var(--f-display);font-size:15px;text-transform:uppercase;color:var(--ink)}
.wd.gym{border-color:var(--accent)} .wd.gym span{color:var(--accent);font-weight:600}
.wd.today{background:var(--ink);border-color:var(--ink)} .wd.today b,.wd.today span{color:var(--bg)}
.plan.recommended{border:2px solid var(--accent)}
.plan .tag{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
/* Food tab */
.daynav{display:flex;align-items:center;justify-content:space-between;gap:8px}
.daynav h3{font-size:20px;text-transform:uppercase;text-align:center;flex:1}
.daynav .btn{min-width:44px}
.macros{display:grid;gap:10px}
.foodstrip{position:sticky;top:var(--hdr,0px);z-index:4;display:flex;justify-content:space-between;gap:8px;padding:8px 12px;border-radius:12px;background:var(--card,var(--bg));border:1px solid var(--line);font-size:14px;box-shadow:0 4px 10px rgba(0,0,0,.12);transition:box-shadow .3s,border-color .3s}
.foodstrip .ok{color:var(--good)}.foodstrip .warn{color:var(--warn)}
.foodstrip.bump{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent)}
.macro{display:grid;gap:4px}
.macro .row{justify-content:space-between}
.macro .num{font-size:15px}
.meal{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.meal.done{border-color:var(--good)}
.tick{width:36px;height:36px;border-radius:50%;border:2px solid var(--line);background:var(--bg);display:grid;place-items:center;padding:0}
.meal.done .tick{background:var(--good);border-color:var(--good)}
.tick svg{width:18px;height:18px;stroke:var(--surface);stroke-width:3;fill:none;opacity:0}
.meal.done .tick svg{opacity:1}
.meal b{font-family:var(--f-display);font-size:18px;text-transform:uppercase;font-weight:700;display:block}
.meal .what{font-size:14px;color:var(--muted)}
.meal .mac{font:500 12px/1.5 var(--f-mono);color:var(--muted);text-align:right;white-space:nowrap}
.meal .mac .k{font-size:15px;color:var(--ink);display:block}
.editmeal{display:grid;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px}
.editmeal input,.food-in{font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:9px 10px;width:100%;min-width:0}
.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.trio label{display:grid;gap:3px}
.trio input{font-family:var(--f-mono);text-align:center}

/* Sign-in: Face ID, sign-up, invites */
.gate{overflow-y:auto}
/* First-time set-up (steps 2-4 and the summary) */
.onboard{z-index:25;place-items:start center;padding-top:max(24px,env(safe-area-inset-top))}
.onboard .card{max-width:520px}
.ob-steps{display:flex;justify-content:space-between;align-items:center}
.ob-dots{display:flex;gap:6px}.ob-dots i{width:22px;height:5px;border-radius:3px;background:var(--line)}.ob-dots i.on{background:var(--accent)}
.ob-opts{display:grid;gap:8px}
.ob-opt{display:grid;gap:2px;text-align:left;border:1.5px solid var(--line);background:var(--surface);border-radius:12px;padding:12px 14px;color:var(--ink);font:inherit}
.ob-opt span{font-size:13px;color:var(--muted)}
.ob-opt[aria-pressed="true"]{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--surface))}
.ob-days{display:flex;gap:8px;flex-wrap:wrap}.ob-days .chip{min-width:48px;text-align:center}
.ob-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.gate select.text{font:500 16px var(--f-body,inherit);color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:12px;width:100%}
.ob-cat{display:grid;gap:8px;border-top:1px solid var(--line);padding-top:10px}
.ob-cath{display:flex;align-items:center;gap:8px}.ob-cath b{flex:1}
.ob-foods{display:flex;flex-wrap:wrap;gap:6px}.ob-foods .chip{font-size:13px;padding:7px 12px}
.ob-sum{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.ob-sum .stat{display:grid;gap:2px;background:var(--bg);border-radius:10px;padding:10px 8px;text-align:center}
.ob-sum .num{font:800 22px var(--f-display)}
@media (max-width:400px){.ob-sum{grid-template-columns:1fr 1fr}}
.ob-nav{display:grid;grid-template-columns:1fr 2fr;gap:8px;position:sticky;bottom:0;background:var(--surface);padding-top:6px}
.gate-or{text-align:center;font-size:13px;color:var(--muted)}
.gate .field{display:grid;gap:6px;font-size:14px}
.gate input.text{font:500 18px var(--f-body,inherit);color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:12px;width:100%}
.gate #joinCode{font-family:var(--f-mono);letter-spacing:.08em;text-transform:uppercase}
.gate .field input:not(.text){font-size:20px;padding:10px}
.invite-code{font-size:26px;letter-spacing:.12em;text-align:center;padding:12px;border:1px dashed var(--line);border-radius:8px;user-select:all}
#lockScreen{z-index:25}
.lockopt{display:flex;gap:8px;align-items:center;font-size:14px}
.lockopt input{width:20px;height:20px;accent-color:var(--accent,#1f6f78)}
.install{display:grid;gap:10px;margin:0 0 14px}
.install .ttl{display:block;font-size:15px}
.install .steps{margin:0;padding-left:20px;display:grid;gap:2px}
.install .hint{display:block;margin-top:2px}
.person{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--line)}
.person .hint{display:block}
.person .tag{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);border:1px solid var(--line);border-radius:6px;padding:1px 6px}
.btn.danger{color:#B3261E;border-color:#B3261E}
.person .pbtns{display:grid;gap:6px;justify-items:end}
.person .tag.danger{color:#B3261E;border-color:#B3261E}

/* ---------- Refresh (v60): clean light, app-style ---------- */
body{font-size:16px;-webkit-font-smoothing:antialiased}
.num,.stepper input,.trio input,.gate input:not(.text),.meal .mac,svg text,.dbrack button{font-variant-numeric:tabular-nums}
h1{font-size:20px;font-weight:700;text-transform:none;letter-spacing:-.01em}
h2{font-size:28px;font-weight:800;text-transform:none;letter-spacing:-.02em}
h3,.exhead h3,.day h3,.daynav h3{text-transform:none;font-weight:700;letter-spacing:-.01em}
.plan b,.meal b,.wd b{text-transform:none;font-family:var(--f-display);font-weight:700}
.plan b{font-size:19px}.meal b{font-size:16px}.exhead h3{font-size:18px}
.lbl{letter-spacing:.06em}

/* Header: name and sync status; the session timer only shows during a workout */
header.top{background:rgba(242,244,247,.88);-webkit-backdrop-filter:saturate(1.6) blur(14px);backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid var(--line);padding-block:10px 8px;gap:6px}
.toprow{flex-wrap:nowrap}
.brand{display:grid;gap:0;min-width:0}
.brand .store{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#switchBtn{flex:none;border-radius:999px;background:var(--surface);border:1px solid var(--line)}
.sessbar{display:none;gap:6px}
body.insession .sessbar{display:grid}
.clock .num{font-size:22px;font-weight:700}
.bar{height:5px;background:var(--line)}

/* Cards and buttons */
section{gap:12px;padding-block:14px 0}
.card,.plan,.ex,.meal,.editmeal,.wd,.cal-d{border:1px solid transparent;box-shadow:var(--shadow)}
.card,.plan,.ex,.meal,.editmeal{border-radius:16px}
.card{padding:16px}
.plan{padding:16px;gap:6px}
.ex.open,.plan.recommended{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),var(--shadow)}
.meal.done{border-color:var(--good)}
.btn{border-radius:12px;background:var(--soft);color:var(--ink)}
.btn.primary{background:var(--accent);color:var(--accent-ink)}
.btn.ghost{background:var(--surface);border:1px solid var(--line)}
.btn:active{transform:scale(.98)}
.btn.partner{background:var(--accent-soft);border:0;border-radius:16px}
.chip{border-color:var(--line);background:var(--surface);box-shadow:none}
.chip[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
select,.addcustom input,.editmeal input,.food-in{border-radius:12px;background:var(--surface)}
.stepper{border-radius:12px;background:var(--surface)}
.stepper button{background:var(--soft)}
.who{border-radius:12px}
.foodstrip{background:var(--surface);border-color:transparent;border-radius:14px;box-shadow:0 4px 14px rgba(16,24,40,.10)}
.wd{border-radius:12px}
.wd.today{background:var(--accent);border-color:var(--accent)} .wd.today b,.wd.today span{color:var(--accent-ink)}
.cal-d{box-shadow:none;border-radius:10px}
.cal-d.pick{outline:2px solid var(--accent)}
.tag.now{background:var(--accent-soft);color:var(--accent)}
.toast{border-radius:12px;background:var(--ink);color:#fff;bottom:calc(84px + env(safe-area-inset-bottom,0px))}
.howto{background:var(--soft);border-radius:12px}
.howto .head{fill:var(--surface)}

/* Food: Diary / Plan / Shop switcher */
.seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:2px;background:#E4E7EC;border-radius:10px;padding:3px;margin-top:12px}
.seg button{border:0;background:transparent;border-radius:8px;padding:8px 0;font-weight:600;font-size:14px;color:var(--muted)}
.seg button[aria-pressed="true"]{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(16,24,40,.12)}

/* Bottom tab bar with icons */
nav.tabs{background:rgba(255,255,255,.92);-webkit-backdrop-filter:saturate(1.6) blur(14px);backdrop-filter:saturate(1.6) blur(14px);border-top:1px solid var(--line);grid-template-columns:repeat(4,1fr)!important;padding-inline:4px}
nav.tabs.lite{grid-template-columns:repeat(3,1fr)!important}
nav.tabs button{display:grid;justify-items:center;gap:3px;padding:8px 0 6px;font-family:var(--f-body);font-weight:600;font-size:11px;text-transform:none;letter-spacing:0;color:var(--muted)}
nav.tabs svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
nav.tabs button[aria-selected="true"]{color:var(--accent);box-shadow:none}
nav.tabs button[aria-selected="true"] svg{stroke-width:2.3}

/* Sign-in screens */
.gate{background:var(--bg)}
.gate .card{box-shadow:0 8px 30px rgba(16,24,40,.10)}
.gate h2{font-size:26px}
.gate input:not(.text),.gate input.text{background:var(--bg);border-color:var(--line);border-radius:12px}
.install{border-radius:16px}
/* Next session on Train: the one big thing to tap */
.plan.recommended{background:var(--accent);border-color:var(--accent);box-shadow:0 6px 18px rgba(14,124,134,.28);padding:18px 18px 16px;position:relative}
.plan.recommended b{color:#fff;font-size:22px}
.plan.recommended span{color:rgba(255,255,255,.88)}
.plan.recommended .tag{color:#fff;opacity:.9}
.plan.recommended .hint.warn{color:#FFE2B8}
.plan.recommended::after{content:"Start ›";position:absolute;right:16px;bottom:16px;background:#fff;color:var(--accent);font-weight:700;font-size:14px;padding:7px 14px;border-radius:999px}
.plan.recommended span:last-of-type{padding-right:84px}
.plan{width:100%}
h2{font-size:26px}
a{color:var(--accent)}

/* ---------- Colour (v61): brighter, with a colour per routine and per macro ---------- */
:root{
  --accent:#0B8A96; --accent-2:#13B5C3; --accent-soft:#DDF3F5;
  --indigo:#5B5BD6; --indigo-2:#8A7CF0; --orange:#F2711C; --orange-2:#FFA94D; --pink:#E5487D; --green:#18A058; --green-2:#4CD08A;
  --grad:linear-gradient(135deg,var(--accent) 0%,var(--accent-2) 100%);
}
body{background:linear-gradient(180deg,#D5EEF0 0px,#E6F1F6 220px,#F2F4F7 520px) no-repeat,#F2F4F7}
header.top{background:rgba(222,240,243,.82)}
h2{background:linear-gradient(90deg,#0B5F68,#0B8A96);-webkit-background-clip:text;background-clip:text;color:transparent}
.gate h2{background:none;color:var(--ink)}

/* Buttons and chips: teal gradient */
.btn.primary,.chip[aria-pressed="true"],.seg button[aria-pressed="true"].x{background:var(--grad);border-color:transparent;color:#fff}
.btn.primary{box-shadow:0 4px 12px rgba(11,138,150,.28)}
.chip[aria-pressed="true"]{box-shadow:0 3px 10px rgba(11,138,150,.25)}
.seg{background:rgba(11,138,150,.12)}
.seg button[aria-pressed="true"]{color:var(--accent)}

/* Train: each routine has its own colour */
#routines .plan{border:0;color:#fff;box-shadow:0 6px 16px rgba(16,24,40,.12)}
#routines .plan b{color:#fff;font-size:21px}
#routines .plan span{color:rgba(255,255,255,.9)}
#routines .plan:nth-child(3n+1){background:linear-gradient(135deg,var(--accent),var(--accent-2))}
#routines .plan:nth-child(3n+2){background:linear-gradient(135deg,var(--indigo),var(--indigo-2))}
#routines .plan:nth-child(3n+3){background:linear-gradient(135deg,var(--orange),var(--orange-2))}
.plan.recommended{background:var(--grad)}
#plans .plan{border-left:5px solid var(--accent)}
#plans .plan:nth-child(4n+2){border-left-color:var(--indigo)}
#plans .plan:nth-child(4n+3){border-left-color:var(--orange)}
#plans .plan:nth-child(4n+4){border-left-color:var(--pink)}
.btn.partner{background:linear-gradient(135deg,#ECEBFF,#E0F4F6)}
.btn.partner b{color:var(--indigo)}
.wd.gym{background:#E3F6EC;border-color:transparent} .wd.gym span{color:var(--green)}
.wd.today{background:var(--grad)}
.pips i.done{background:var(--green);border-color:var(--green)}
.btn.go{background:linear-gradient(135deg,var(--green),var(--green-2))}
.ex.open{box-shadow:0 0 0 2px var(--accent),0 8px 20px rgba(11,138,150,.15)}

/* Food: a colour per macro */
.macro .bar{height:8px;border-radius:4px;background:#EEF1F5}
.macro .bar i{border-radius:4px}
.m-calories .bar i{background:linear-gradient(90deg,var(--orange),var(--orange-2))}
.m-protein .bar i{background:linear-gradient(90deg,var(--indigo),var(--indigo-2))}
.m-carbs .bar i{background:linear-gradient(90deg,var(--green),var(--green-2))}
.m-calories .lbl{color:var(--orange)} .m-protein .lbl{color:var(--indigo)} .m-carbs .lbl{color:var(--green)}
.macro .bar.over i{background:var(--warn)}
.foodstrip{border-left:4px solid var(--orange)}
.meal.done .tick{background:var(--green);border-color:var(--green)}

/* Progress and history */
.delta.up{color:var(--green)}
.cal-d.on{background:var(--grad);color:#fff}
.tag.now{background:var(--accent-soft)}

/* Tab bar: coloured pill behind the selected icon */
nav.tabs button svg{padding:2px 14px;width:54px;height:30px;border-radius:999px;transition:background .2s}
nav.tabs button[aria-selected="true"] svg{background:var(--accent-soft)}

/* ---------- Opening page: boxed layout (v62) ---------- */
:root{--navy:#14213D;--navy-2:#26386A}
.dash{display:grid;gap:12px}
.dash.quick{grid-template-columns:1fr 1fr;margin-top:12px}
.tile{display:grid;gap:4px;align-content:start;text-align:left;border:0;border-radius:20px;padding:18px;color:#fff;box-shadow:0 8px 20px rgba(16,24,40,.14)}
.tile b{font-size:18px;font-weight:700}
.tile span{color:rgba(255,255,255,.88);font-size:14px}
.tile.hero{background:linear-gradient(135deg,var(--navy),var(--navy-2));gap:8px;padding:20px}
.tile.hero .hello{font-size:15px;font-weight:600;color:#9FE3EA}
.tile.hero .big{display:flex;align-items:center;gap:12px}
.tile.hero .big b{font-size:52px;line-height:1;font-weight:800;color:#fff}
.tile.hero .big span{font-size:15px;line-height:1.3;color:rgba(255,255,255,.85)}
.tile.hero .ring{height:8px;border-radius:4px;background:rgba(255,255,255,.15);overflow:hidden}
.tile.hero .ring i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#13B5C3,#4CD08A)}
.tile.hero .sub{font-size:13px;color:rgba(255,255,255,.7)}
.t-pink{background:linear-gradient(135deg,#E5487D,#FF8FA3)}
.t-green{background:linear-gradient(135deg,#12805C,#3CC48A)}
.t-navy{background:linear-gradient(135deg,var(--navy),var(--navy-2))}
/* Routine boxes: first one full width, the others side by side */
#routines.tiles{grid-template-columns:1fr 1fr;gap:12px}
#routines.tiles .plan{border-radius:20px;padding:18px;min-height:140px;align-content:start}
#routines.tiles .plan:first-child{grid-column:1 / -1;min-height:0}
#routines.tiles .plan:not(:first-child) b{font-size:18px}
#routines.tiles .plan:not(:first-child) span:nth-of-type(2){display:none}
#routines.tiles .plan:only-child,#routines.tiles .plan:last-child:nth-child(2){grid-column:1 / -1}

/* ---------- Dark side margins (v63): the app sits in a light column on a navy frame ---------- */
html{background:#14213D}
body{background:linear-gradient(135deg,#0F1A33 0%,#1E2F5A 55%,#14213D 100%) #14213D;min-height:100%}
.wrap{background:linear-gradient(180deg,#D5EEF0 0px,#E6F1F6 220px,#F2F4F7 520px) no-repeat,#F2F4F7;min-height:100vh;min-height:100dvh;box-shadow:0 0 0 1px rgba(255,255,255,.06),0 0 48px rgba(0,0,0,.45)}
nav.tabs{max-width:560px;margin-inline:auto}
@media (min-width:600px){
  nav.tabs{border-radius:18px 18px 0 0;border-inline:1px solid var(--line)}
}
/* Sign-in and lock screens: card on the navy frame */
.gate{background:linear-gradient(135deg,#0F1A33 0%,#1E2F5A 55%,#14213D 100%)}
.gate .card{box-shadow:0 20px 50px rgba(0,0,0,.4)}

/* ---------- Royal blue frame, also on phones (v64) ---------- */
:root{--frame:linear-gradient(135deg,#1C3B9E 0%,#2C55D2 55%,#2248BC 100%)}
html{background:#2248BC}
body{background:var(--frame) #2248BC}
.gate{background:var(--frame)}
@media (max-width:599px){
  body{padding-inline:6px}
  .wrap{border-radius:0 0 14px 14px}
  nav.tabs{left:6px;right:6px;border-radius:16px 16px 0 0;border-inline:1px solid var(--line)}
}

/* ---------- Frame in Roger's chosen blue #4072AC (v65) ---------- */
:root{--frame:linear-gradient(135deg,#3A68A0 0%,#4072AC 50%,#4A7DB8 100%)}
html{background:#4072AC}
body{background:var(--frame) #4072AC}

/* Member levels (v68) */
.lvl{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.04em;padding:2px 8px;border-radius:999px;color:#fff;margin:2px 0}
.lvl-lite{background:var(--green)} .lvl-full{background:var(--orange)} .lvl-admin{background:var(--indigo)} .lvl-owner{background:var(--navy)}
.lvlpick{width:auto;padding:6px 8px;font-size:13px;border-radius:10px}
.person .contact{word-break:break-all}
/* v71: install / open-in-browser banners */
.gate{align-content:center;gap:12px}
.install a.btn{text-decoration:none;display:inline-flex;align-items:center}

/* v74: Iron Log coach */
.tile.hero.has-coach{grid-template-columns:1fr auto;column-gap:4px}
.tile.hero.has-coach>*{grid-column:1 / -1}
.tile.hero.has-coach .hello{grid-column:1;grid-row:1;align-self:end}
.tile.hero.has-coach .big{grid-column:1;grid-row:2}
.coach-hero{grid-column:2 !important;grid-row:1 / span 2;width:104px;height:auto;align-self:end;margin:-14px -6px -6px 0;filter:drop-shadow(0 6px 10px rgba(0,0,0,.35))}
.coach-say{position:relative;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:10px 12px;font-size:14px;line-height:1.35;color:#fff}
.coach-say b,.coach-note b{display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:2px}
.coach-say b{color:#FF9A6B}
.coach-note{display:flex;gap:10px;align-items:center;background:var(--accent-soft);border-radius:12px;padding:8px 10px;font-size:14px}
.coach-note b{color:#C2410C}
.coach-face{flex:none;width:44px;height:44px;border-radius:50%;overflow:hidden;position:relative;background:#14213D;border:2px solid #FF6B2C}
.coach-face img{position:absolute;width:225px;max-width:none;left:-83px;top:-6px}
.coach-gate{width:150px;height:auto;justify-self:center;filter:drop-shadow(0 10px 18px rgba(0,0,0,.35))}
@media (max-height:700px){.coach-gate{width:120px}}
#gate:has(#joinForm:not([hidden])) .coach-gate{display:none}

/* Login: Iron Log above the coach, Lifestyle App below */
.gate-brand{display:grid;justify-items:center;gap:6px;margin-bottom:4px}
.gate-title{font:800 56px/1 var(--f-display);letter-spacing:-.01em;color:#FFFFFF;text-shadow:0 2px 10px rgba(0,0,0,.25)}
.gate-sub{font:700 15px var(--f-body);letter-spacing:.22em;text-transform:uppercase;color:#FFD08A;text-shadow:0 1px 6px rgba(0,0,0,.25)}
.gate{align-content:center;gap:16px}
.gate-brand{gap:10px;margin-bottom:0}
.gate-sub{margin-top:6px}
/* Iron Log and Lifestyle App the same size, as big as fits on one line */
.gate-title,.gate-sub{font:800 clamp(36px, 12.5vw, 76px)/1.05 var(--f-display);letter-spacing:-.01em;text-transform:none;white-space:nowrap;text-align:center}
.gate-title{color:#FFFFFF}
.gate-sub{color:#FFD08A}
/* Bigger gaps: title to coach 3x (10 -> 30 px), sign-in box to Lifestyle App 3x (22 -> 66 px) */
.gate-brand{gap:30px}
.gate-sub{margin-top:50px}
.gate{align-content:safe center}
@media (max-height:740px){.gate-brand{gap:16px}.gate-sub{margin-top:20px}.gate-title,.gate-sub{font-size:clamp(34px,11vw,60px)}}
.onboard input[type=checkbox]{width:auto;padding:0;font-size:inherit;letter-spacing:0}
.onboard .lockopt{display:flex;gap:8px;align-items:flex-start;font-size:14px}
/* Weekly plan from set-up: Session 1, 2, 3… */
.stiles{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.stile{display:grid;gap:4px;text-align:left;background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:14px;color:var(--ink);font:inherit;box-shadow:var(--shadow)}
.stile b{font-family:var(--f-display);font-size:19px;line-height:1.15}
.stile.next{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.stile.next .lbl,.stile.next .hint{color:var(--accent-ink);opacity:.9}
.stile.done{background:#E3F6EC;border-color:transparent}
.stile.done .lbl{color:var(--green)}
.stiles .stile:only-child,.stiles .stile:last-child:nth-child(odd){grid-column:1/-1}

/* ---------- Food diary (v94): meal sections turn green once logged; day can be marked complete ---------- */
:root{ --good-soft:#E6F5EE }
.dsec{display:grid;gap:6px;border-radius:12px;padding:8px 10px;margin:0 -10px;border-left:4px solid transparent;transition:background .25s,border-color .25s}
.dsec-h{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:8px;border-bottom:2px solid var(--line);padding-bottom:6px}
.dsec.filled{background:var(--good-soft);border-left-color:var(--good)}
.dsec.filled .dsec-h{border-bottom-color:rgba(18,128,92,.25)}
.dsec.filled .set{border-top-color:rgba(18,128,92,.2)}
.dsec-ok{color:var(--good);font-weight:800}
.diary-done{display:grid;gap:4px;background:var(--good);color:var(--good-ink)}
.diary-done .hint{color:var(--good-ink);opacity:.9}
#fComplete[disabled]{opacity:.5}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Diet plan: each kind of meal has its own colour and icon (green stays for "eaten") ---------- */
.meal[class*="mk-"]{border-left:5px solid var(--mk);background:linear-gradient(90deg,var(--mk-soft),var(--surface) 70%)}
.mk-breakfast{--mk:#E8A317;--mk-soft:#FFF6E0;--mk-ink:#8A5A00}
.mk-lunch{--mk:#0E7C86;--mk-soft:#E3F2F3;--mk-ink:#0B5F67}
.mk-snack{--mk:#8B5CF6;--mk-soft:#F1ECFE;--mk-ink:#5B34C7}
.mk-shake{--mk:#2E90FA;--mk-soft:#E8F2FF;--mk-ink:#175CD3}
.mk-dinner{--mk:#E0532F;--mk-soft:#FDEDE8;--mk-ink:#A63A1E}
.meal b.mk-name{color:var(--mk-ink);display:flex;align-items:center;gap:6px}
.mk-ico{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--surface);border:1.5px solid var(--mk);font-size:14px;line-height:1;flex:none}
.meal[class*="mk-"] + div{margin-left:5px}
.meal.done[class*="mk-"]{border-left-color:var(--good)}

/* ---------- Watch & health ---------- */
.htiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:8px}
.htile{display:grid;gap:2px;background:var(--bg);border-radius:10px;padding:8px;text-align:center}
.htile b{font:800 20px var(--f-display)}
.wkey{display:flex;gap:8px;align-items:center;background:var(--bg);border-radius:10px;padding:8px}
.wkey code{flex:1;min-width:0;overflow-wrap:anywhere;font:500 12px var(--f-mono)}
.wsteps{border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.wsteps summary{cursor:pointer;font-size:14px}
.wsteps ol{margin:10px 0;padding-left:20px;display:grid;gap:6px;font-size:14px}
.wsteps code{font:500 12px var(--f-mono);background:var(--bg);padding:1px 4px;border-radius:4px;overflow-wrap:anywhere}
.winstall{display:grid;gap:8px;border:1.5px solid var(--accent);background:var(--accent-soft);border-radius:12px;padding:12px}
.t-blue{background:linear-gradient(135deg,#175CD3,#2E90FA)}
#dashQuick .tile-wide{grid-column:1/-1}
/* Health tile on the front screen */
.htile-dash{gap:10px}
.htile-dash .hhead{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.htile-dash .hint-w{font-size:12px;color:rgba(255,255,255,.8)}
.hgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.hcell{display:grid;gap:1px;background:rgba(255,255,255,.14);border-radius:12px;padding:8px 6px;text-align:center}
.hcell .hico{font-size:16px;line-height:1.2}
.hcell b{font-size:17px;font-weight:800;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hcell span{font-size:11px;color:rgba(255,255,255,.85);line-height:1.2}
.hbtns{display:flex;gap:8px}
.hbtn{flex:1;border:0;border-radius:12px;padding:10px;font:700 14px var(--f-body,inherit);background:#fff;color:#175CD3}
.hbtn.ghost{flex:none;background:rgba(255,255,255,.18);color:#fff}
.hbtn[disabled]{opacity:.6}
.hcnext{background:#FFF6D6;color:#7A5B00;border-radius:10px;padding:10px 12px;font-size:14px;line-height:1.4}

/* End-of-day review */
.review .card{max-width:560px;gap:10px}
.rv-hero{display:grid;gap:6px;background:var(--ink);color:var(--bg);border-radius:10px;padding:16px}
.rv-hero.win{background:var(--good);color:var(--good-ink)}
.rv-hero .lbl{color:inherit;opacity:.8}.rv-hero b{font-size:20px;line-height:1.25}
.rv-goal{display:grid;gap:4px;padding:8px 0;border-top:1px solid var(--line)}
.rv-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.rv-row b{flex:1}
.rv-ic{font-weight:800;width:18px;flex:none}.rv-ic.ok{color:var(--good)}.rv-ic.no{color:var(--warn)}
.rv-why{font-size:14px}.rv-why ul,.rv-list,.rv-tom ol{margin:4px 0 0;padding-left:18px;font-size:14px}
.rv-impact{font-size:14px;background:color-mix(in srgb,var(--warn) 10%,var(--surface));border-radius:8px;padding:8px 10px}
.rv-impact b{color:var(--warn)}
.rv-tom{display:grid;gap:6px;background:var(--accent-soft);border-radius:10px;padding:12px}
.rv-set{font-size:14px}.rv-set summary{cursor:pointer;color:var(--muted)}
.rv-tog{display:flex;align-items:center;gap:8px;margin:8px 0}

/* Admin: Versions tab */
.vlog ul{margin:6px 0 0;padding:0;list-style:none;font-size:14px;line-height:1.4}
.vlog li{padding:8px 0;border-top:1px solid var(--line)}
/* v114: personal best pop-up + week vs last week */
.pb-pop{position:fixed;inset:0;z-index:40;display:grid;place-items:center;padding:24px 16px;background:rgba(10,18,40,.72);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);cursor:pointer}
.pb-pop[hidden]{display:none}
.pb-card{display:grid;justify-items:center;gap:6px;text-align:center;color:#fff;max-width:360px;width:100%}
.pb-card img{width:min(84vw,330px);height:auto;filter:drop-shadow(0 10px 24px rgba(0,0,0,.45))}
.pb-card b{font-size:20px;line-height:1.2}
.pb-card .num{font-size:18px;font-weight:700}
.pb-card .pb-was{display:block;font-size:14px;font-weight:500;opacity:.8}
.pb-card .hint{color:rgba(255,255,255,.7)}
.pb-pop.show .pb-card img{animation:pbIn .6s cubic-bezier(.2,1.4,.4,1) both}
.pb-pop.show .pb-card > :not(img){animation:pbFade .4s .35s both}
@keyframes pbIn{0%{transform:scale(.3) rotate(-8deg);opacity:0}100%{transform:none;opacity:1}}
@keyframes pbFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.pb-pop.show .pb-card img,.pb-pop.show .pb-card > :not(img){animation:none}}
.wk-head{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.wk-sec{display:grid;gap:8px;border:1px solid var(--line);border-radius:12px;padding:12px}
.wk-cmp{display:grid;grid-template-columns:76px 1fr auto;gap:10px;align-items:center;font-size:14px}
.wk-bar{height:12px;border-radius:6px;background:var(--soft);overflow:hidden}
.wk-bar i{display:block;height:100%;border-radius:6px}
.wk-bar.now i{background:var(--accent)}.wk-bar.then i{background:var(--muted);opacity:.55}
.wk-ex summary{cursor:pointer}
.wk-hr{border:0;border-top:1px solid var(--line);margin:4px 0}
.wk-sec .delta{white-space:nowrap}.wk-ex .rv-row{align-items:center;padding:4px 0}
/* v115: muscles on exercises and in the week summary */
.mus-line{font-size:13px;color:var(--muted);margin-top:2px;line-height:1.3}
.mus-line b{color:var(--accent);font-weight:600}
.ex-mus{display:grid;justify-items:center;gap:4px;margin:2px 0 4px}
.ex-mus svg{max-width:170px!important}
.mus-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin:0 4px 0 8px;vertical-align:-1px}
.mus-dot:first-child{margin-left:0}
.mus-key{text-align:center}
.mus-today{display:flex;flex-wrap:wrap;gap:6px}
.mus-today span{background:var(--soft);border-radius:999px;padding:4px 10px;font-size:13px}
.mus-bars{display:grid;gap:5px}
.mus-bar{display:grid;grid-template-columns:84px 1fr 34px;gap:8px;align-items:center;font-size:14px}
.mus-bar > div{position:relative;height:10px;background:var(--soft);border-radius:5px;overflow:hidden}
.mus-bar > div i{position:absolute;left:0;top:0;bottom:0;border-radius:5px}
.mus-bar > div i.tgt{width:2px;background:var(--ink);opacity:.35;border-radius:0;z-index:1}
.mus-bar .num{text-align:right}
.mus-pick{display:grid;gap:8px;border:1px dashed var(--accent);border-radius:12px;padding:10px}
.mus-c.s1{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.mus-c.s2{background:#8FD0D6;color:var(--ink);border-color:#8FD0D6}
.mus-pick .chips{flex-wrap:wrap;overflow:visible}
.brand h1 .ver{font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--muted);background:var(--soft);border-radius:999px;padding:2px 8px;vertical-align:middle;margin-left:4px}
/* Calisthenics: rest presets and the half-screen set timer */
.restpick{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.restpick button{border:2px solid var(--line);background:var(--surface);color:var(--ink);border-radius:10px;padding:12px 0;font-weight:700;font-size:16px}
.restpick button[aria-pressed="true"]{border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}
.flow{position:fixed;left:0;right:0;bottom:0;height:50vh;height:50dvh;min-height:300px;z-index:15;display:grid;grid-template-rows:auto 1fr auto auto auto;gap:10px;
  padding:16px 16px calc(16px + env(safe-area-inset-bottom,0px));background:#101828;color:#fff;border-radius:20px 20px 0 0;box-shadow:0 -8px 30px rgba(0,0,0,.25)}
.flow[hidden]{display:none}
.flow-work{background:var(--good)}
.flow-rest{background:#7A5B00}
.flow-top{display:flex;justify-content:space-between;gap:10px;align-items:baseline;font-size:14px;opacity:.9}
.flow-top b{font-family:var(--f-display);font-size:18px;text-transform:uppercase;letter-spacing:.03em;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.flow-mid{display:grid;place-items:center;align-content:center;text-align:center;gap:2px;min-height:0}
.flow-lab{font-family:var(--f-display);font-weight:800;font-size:28px;text-transform:uppercase;letter-spacing:.06em}
.flow-clock{font-family:var(--f-display);font-weight:800;font-size:min(30vw,22dvh);line-height:1;font-variant-numeric:tabular-nums}
.flow-sub{font-size:16px;font-weight:600;opacity:.9}
.flow-dots{display:flex;justify-content:center;gap:8px}
.flow-dots i{width:14px;height:14px;border-radius:50%;border:2px solid rgba(255,255,255,.7)}
.flow-dots i.done{background:#fff;border-color:#fff}
.flow-dots i.now{border-color:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.35)}
.flow-bar{height:6px;border-radius:3px;background:rgba(255,255,255,.25);overflow:hidden}
.flow-bar i{display:block;height:100%;width:0;background:#fff}
.flow-btns{display:flex;gap:10px}
.flow-btns .btn{flex:1;padding:14px;font-weight:700;font-size:16px;background:rgba(255,255,255,.18);color:#fff;border:0}
.flow-btns .btn.ghost{background:transparent;border:2px solid rgba(255,255,255,.6)}
body.flowing #exList{padding-bottom:50vh}
#restCard[hidden],#intervalBox[hidden]{display:none}
.plan.elite-build{border:2px dashed var(--accent);background:var(--accent-soft)}.plan.elite-build b{color:var(--accent)}
#routines.tiles .plan.elite-build{grid-column:1 / -1;min-height:0}#routines.tiles .plan.elite-build span{display:block!important}#routines.tiles .plan.elite-build b{font-size:17px}
.bsec-h{font-weight:700;font-size:17px;margin:16px 0 0;padding-bottom:6px;border-bottom:2px solid var(--accent);color:var(--accent)}.bsec-h:first-of-type{margin-top:4px}
/* v134: Elite builder - one kind of kit at a time */
.bkind{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.bkind button{border:2px solid var(--line);background:var(--surface);color:var(--ink);border-radius:12px;padding:12px 8px;font-weight:700;font-size:15px}
.bkind button[aria-selected="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.bkind .bk-n{display:inline-block;min-width:20px;padding:0 6px;border-radius:999px;background:var(--good);color:#fff;font-size:12px;margin-left:4px}
/* v135: Elite builder - Fixed weights (green) vs Dumbbells (blue) */
:root{--fixed:#12805C;--fixed-soft:#E3F4EC;--dbl:#2563EB;--dbl-soft:#E5EDFD}
.bkind button.bk-fixed{border-color:var(--fixed);color:var(--fixed)}
.bkind button.bk-db{border-color:var(--dbl);color:var(--dbl)}
.bkind button.bk-fixed[aria-selected="true"]{background:var(--fixed);border-color:var(--fixed);color:#fff}
.bkind button.bk-db[aria-selected="true"]{background:var(--dbl);border-color:var(--dbl);color:#fff}
.bkind button[aria-selected="true"] .bk-n{background:#fff;color:var(--ink)}
.bkind .bk-n{background:var(--ink)}
.bsec-h.bk-fixed{color:var(--fixed);border-bottom-color:var(--fixed)}
.bsec-h.bk-db{color:var(--dbl);border-bottom-color:var(--dbl)}
.set.kr-fixed{border-left:5px solid var(--fixed)!important;padding-left:8px!important}
.set.kr-db{border-left:5px solid var(--dbl)!important;padding-left:8px!important}
.set.kr-fixed[aria-pressed="true"]{background:var(--fixed-soft)!important}
.set.kr-db[aria-pressed="true"]{background:var(--dbl-soft)!important}
.set.kr-fixed .hint[style*="nowrap"]{color:var(--fixed);font-weight:600}
.set.kr-db .hint[style*="nowrap"]{color:var(--dbl);font-weight:600}
