:root{
  --bg:#040506;--surface:#0d1013;--surface2:#13181d;--surface3:#1a2229;
  --border:rgba(255,255,255,0.09);--border-mid:rgba(255,255,255,0.16);--border-strong:rgba(255,255,255,0.32);
  --text:#f7fafc;--muted:rgba(247,250,252,0.68);--dim:rgba(247,250,252,0.42);
  --run:#92d2ed;--run-strong:#b7e6f7;--run-bg:rgba(146,210,237,0.10);--run-bg-strong:rgba(146,210,237,0.16);--run-border:rgba(146,210,237,0.28);
  --strength:rgba(255,255,255,0.82);--strength-bg:rgba(255,255,255,0.06);--strength-border:rgba(255,255,255,0.15);
  --rest:rgba(255,255,255,0.36);
  --ok:#22c55e;--ok-bg:rgba(34,197,94,0.10);--ok-border:rgba(34,197,94,0.30);
  --pb:#a78bfa;--pb-bg:rgba(167,139,250,0.14);--pb-border:rgba(167,139,250,0.34);
  --vpb:#2dd4bf;--vpb-bg:rgba(45,212,191,0.16);--vpb-border:rgba(45,212,191,0.40);
  --shadow-soft:0 10px 30px rgba(0,0,0,0.28);--shadow-blue:0 14px 36px rgba(146,210,237,0.10);
  --mono:'DM Mono',monospace;--display:'Barlow Condensed',sans-serif;--body:'Barlow',sans-serif;
  --dp-logo:url('dp_baby_blue_transparent_512x512.png');
}

/* Strava planned-session matching */
.strava-match-attribution,.strava-match-suggestion{display:flex;align-items:center;gap:9px;margin:10px 12px 0;padding:9px 10px;border-radius:8px;border:1px solid rgba(252,76,2,.18);background:rgba(252,76,2,.045);font-size:12px;color:var(--text)}
.strava-match-attribution.today,.strava-match-suggestion.today{margin:12px 0 0}
.strava-match-attribution svg,.strava-match-suggestion svg{flex:0 0 auto}
.strava-match-attribution>span,.strava-match-suggestion>span{min-width:0;flex:1}
.strava-match-attribution strong{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--text);white-space:nowrap}
.strava-match-attribution small{display:block;margin-top:1px;font-family:var(--mono);font-size:8px;letter-spacing:.05em;text-transform:uppercase;color:#fc4c02;white-space:nowrap}
.strava-match-attribution button,.strava-match-suggestion button{flex:0 0 auto;border:1px solid var(--border-mid);border-radius:6px;background:transparent;color:var(--muted);padding:6px 8px;font:700 10px var(--mono);cursor:pointer;white-space:nowrap}
.strava-match-attribution button:hover{border-color:rgba(252,76,2,.4);color:#fc4c02}
.strava-match-suggestion button{background:#fc4c02;color:#fff}
.strava-match-attribution.session,.strava-match-suggestion.session{margin:0 0 14px;padding:11px 12px;border-radius:12px}
.strava-match-removed{display:flex;align-items:center;gap:9px;margin:10px 12px 0;padding:8px 10px;border:1px solid rgba(252,76,2,.2);border-radius:8px;background:rgba(252,76,2,.045);font-size:11px;color:var(--muted)}
.strava-match-removed.today{margin:12px 0 0}
.strava-match-removed.session{margin:0 0 14px;padding:11px 12px;border-radius:12px}
.strava-match-removed>span{min-width:0;flex:1}
.strava-match-removed button{flex:0 0 auto;border:1px solid #fc4c02;border-radius:7px;background:#fc4c02;color:#fff;padding:6px 11px;font:800 10px var(--mono);cursor:pointer;white-space:nowrap;box-shadow:0 5px 14px rgba(252,76,2,.24);transition:background .15s,transform .12s,box-shadow .15s}
.strava-match-removed button:hover{background:#e84602;box-shadow:0 7px 18px rgba(252,76,2,.32)}
.strava-match-removed button:active{transform:scale(.96)}
.strava-match-removed button:focus-visible{outline:3px solid rgba(252,76,2,.3);outline-offset:2px}
.strava-match-removed button:disabled{opacity:.55;cursor:wait}
.strava-feedback{border:1px solid rgba(252,76,2,.2);border-radius:9px;background:rgba(252,76,2,.04);padding:14px}
.strava-feedback-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0}
@media(max-width:560px){.strava-feedback-grid{grid-template-columns:1fr}.strava-match-attribution,.strava-match-suggestion{align-items:center}.strava-match-suggestion{flex-wrap:wrap}.strava-match-suggestion button{margin-left:20px}.strava-match-attribution button{margin-left:0}}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{background:var(--bg);color:var(--text);font-family:var(--body);font-size:15px;line-height:1.55;min-height:100vh;-webkit-font-smoothing:antialiased}
header{background: rgba(255,255,255,0.06);height:54px;padding:0 16px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100;border-bottom:1px solid rgba(146,210,237,0.1)}
.logo{display:flex;align-items:center;gap:10px}
.logo img{height:32px;width:auto;display:block}
.logo-img{width:34px;height:34px;flex-shrink:0;background:var(--dp-logo) center/contain no-repeat}
.logo-text{font-family:var(--display);font-size:14px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;line-height:1.2}
.logo-text .d{display:block;color:#fff}.logo-text .p{display:block;color:#fff}
.header-actions{display:flex;align-items:center;gap:6px}
.hicon{background:transparent;border:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.5);font-family:var(--mono);font-size:10px;padding:4px 10px;border-radius:6px;cursor:pointer;letter-spacing:.04em;text-transform:uppercase;transition:border-color .15s,color .15s;white-space:nowrap;display:flex;align-items:center;gap:5px}
.hicon:hover{border-color:rgba(255,255,255,.3);color:rgba(255,255,255,.8)}
.hicon-goals,.hicon-accent{border-color:rgba(146,210,237,.5);color:#92d2ed}
.hicon-goals:hover,.hicon-accent:hover{border-color:#92d2ed;color:#aadcf2}
.hicon-dot{width:6px;height:6px;border-radius:50%;background:#92d2ed;flex-shrink:0;animation:pdot 2s ease-in-out infinite}
@keyframes pdot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.65)}}
.goals-prompt{width:100%;display:none;font:inherit;color:inherit;text-align:left;-webkit-appearance:none;appearance:none}
.goals-prompt .nudge-strip-title,.goals-prompt .nudge-strip-sub{display:block}
.goals-prompt-label{font-family:var(--mono);font-size:9px;color:#92d2ed;text-transform:uppercase;letter-spacing:.14em;margin-bottom:6px}
.goals-prompt-title{font-family:var(--display);font-size:22px;font-weight:800;text-transform:uppercase;color:#fff;letter-spacing:.02em;margin-bottom:6px}
.goals-prompt-sub{font-size:13px;color:rgba(255,255,255,.5);line-height:1.5;margin-bottom:14px}
.goals-prompt-btn{background:#92d2ed;color:#050505;font-family:var(--display);font-size:15px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:10px 20px;border-radius:8px;border:none;cursor:pointer;transition:background .15s}
.goals-prompt-btn:active{background:#6bb8d4}
.hero{background:#0a0a0a;padding:14px 16px 12px;text-align:left}
.top-shell{position:relative;padding:12px 14px 10px;background:linear-gradient(180deg,rgba(8,12,14,.96),rgba(5,8,10,.84));border-bottom:1px solid rgba(255,255,255,.05)}
.hero-shell{display:grid;gap:12px}
.hero-main,.hero-side{min-width:0;padding:18px 18px 16px;border:1px solid rgba(255,255,255,.08);border-radius:20px;background:linear-gradient(155deg,rgba(16,22,26,.92),rgba(8,12,15,.88));box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 14px 34px rgba(0,0,0,.18)}
.hero-main{position:relative;overflow:hidden}
.hero-main::before{content:"";position:absolute;left:18px;right:18px;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(146,210,237,.6),transparent);opacity:.66}
.hi{font-family:var(--mono);font-size:9px;color:rgba(255,255,255,.22);text-transform:uppercase;letter-spacing:.14em;margin-bottom:4px}
.hero-name-row{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:12px}
.hn{font-family:var(--display);font-size:40px;font-weight:800;text-transform:uppercase;letter-spacing:.02em;color:#fff;line-height:.95;max-width:10ch}
.hero-week{text-align:right;flex-shrink:0;margin-left:12px;padding:10px 12px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.025)}
.hero-week-label{font-family:var(--mono);font-size:9px;color:rgba(255,255,255,.3);text-transform:uppercase;letter-spacing:.1em}
.hero-week-num{font-family:var(--display);font-size:28px;font-weight:800;color:#92d2ed;line-height:1;white-space:nowrap}
.hero-week-num.discovery{font-size:15px;line-height:1.05;text-transform:uppercase;letter-spacing:.03em}

.hero-support{max-width:54ch;color:rgba(244,251,255,.72);font-size:14px;line-height:1.6}
.hero-bottom{display:grid;gap:14px;margin-top:4px}

.hero-stat-value{margin-top:6px;font-family:var(--body);font-size:22px;font-weight:600;letter-spacing:-.04em;color:var(--text)}
.hpills{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-bottom:0}
.hp{font-family:var(--mono);font-size:10px;color:rgba(255,255,255,.35);border:1px solid rgba(255,255,255,.1);padding:5px 13px;border-radius:20px;flex-shrink:0;white-space:nowrap}
.hp span{color:#92d2ed}
.wa-fab{position:fixed;bottom:20px;right:16px;z-index:150;width:52px;height:52px;border-radius:50%;background:#92d2ed;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(146,210,237,.4);cursor:pointer;text-decoration:none;transition:transform .15s,box-shadow .15s}
.wa-fab:active{transform:scale(.93);box-shadow:0 2px 8px rgba(146,210,237,.25)}
.wa-fab svg{fill:#050505}
.wbar{background:#111;border-top:1px solid rgba(255,255,255,.05);padding:10px 16px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:54px;z-index:90}
.wbar-meta{display:flex;flex-direction:column;gap:2px}
.wbar-kicker{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:rgba(146,210,237,.72)}
.wlabel{font-family:var(--display);font-size:16px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#fff}
.wnav{display:flex;align-items:center;gap:6px}
.warr,.wtoday{font-family:var(--mono);font-size:11px;padding:6px 11px;border:1px solid rgba(255,255,255,.13);border-radius:6px;background:transparent;color:rgba(255,255,255,.5);cursor:pointer}
.wtoday{font-size:10px;text-transform:uppercase;letter-spacing:.05em}
.tabs{background:#111;border-top:1px solid rgba(255,255,255,.05);display:flex;overflow-x:auto;-webkit-overflow-scrolling:touch;position:sticky;top:calc(54px + 45px);z-index:80}
.tabs::-webkit-scrollbar{display:none}
.tab{font-family:var(--display);font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:rgba(255,255,255,.22);padding:12px 16px;cursor:pointer;white-space:nowrap;border:0;border-bottom:2px solid transparent;background:transparent;flex-shrink:0;transition:color .15s}
.tab.active{color:#92d2ed;border-bottom-color:#92d2ed}
.tab-dot{display:none;width:6px;height:6px;border-radius:50%;background:#92d2ed;margin-left:5px;margin-bottom:5px;vertical-align:middle;flex-shrink:0}
.tab-dot.visible{display:inline-block}
.nudge-strip{background:#111;border-bottom:1px solid rgba(255,255,255,.05);padding:10px 16px;cursor:pointer;user-select:none}
.nudge-strip-inner{display:flex;align-items:center;gap:10px;max-width:700px;margin:0 auto}
.nudge-strip-icon{font-size:15px;flex-shrink:0}
.nudge-strip-text{flex:1;min-width:0}
.nudge-strip-title{font-family:var(--display);font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:rgba(255,255,255,.7)}
.nudge-strip-sub{font-family:var(--mono);font-size:9px;color:rgba(255,255,255,.3);letter-spacing:.05em;margin-top:1px}
.nudge-strip-arr{font-family:var(--mono);font-size:14px;color:rgba(255,255,255,.25);flex-shrink:0}
#checkinNudge{background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.015));border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(146,210,237,.08);position:relative;box-shadow:inset 0 1px 0 rgba(255,255,255,.02)}
#checkinNudge::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,rgba(34,197,94,.75),rgba(34,197,94,.2))}
#checkinNudge .nudge-strip-inner{position:relative}
#checkinNudge .nudge-strip-icon{width:28px;height:28px;border-radius:999px;display:flex;align-items:center;justify-content:center;background:rgba(34,197,94,.08);border:1px solid rgba(34,197,94,.22);box-shadow:0 0 0 1px rgba(255,255,255,.02) inset}
#checkinNudge .nudge-strip-title{color:#fff}
#checkinNudge .nudge-strip-sub{color:rgba(255,255,255,.48)}
#checkinNudge .nudge-strip-arr{color:#92d2ed}
.top-shell-priority{display:grid;gap:10px;margin-top:10px}
.top-shell-priority .nudge-strip{margin:0;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:linear-gradient(180deg,rgba(14,19,23,.96),rgba(8,11,14,.9));padding:14px 16px;box-shadow:0 12px 30px rgba(0,0,0,.16)}
.top-shell-priority .nudge-strip-inner{max-width:none;margin:0}
#strava-ack-banner{border-radius:16px!important;box-shadow:0 12px 30px rgba(0,0,0,.16)}
@media(min-width:768px){
  .nudge-strip{padding:16px 24px;border-top:1px solid rgba(255,255,255,.05)}
  .nudge-strip-icon{font-size:22px}
  .nudge-strip-title{font-size:18px}
  .nudge-strip-sub{font-size:11px;margin-top:3px}
  .nudge-strip-arr{font-size:20px}
  .nudge-strip-inner{gap:16px;max-width:700px}
}
.tab-content{display:none;max-width:700px;margin:0 auto;padding:16px 14px 120px}
.tab-content.active{display:block}
.desktop-weekly-tab{display:none}
.page-intro{position:relative;margin:0 0 18px;padding:18px 20px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:linear-gradient(155deg,rgba(16,22,26,.88),rgba(9,13,16,.82));box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 16px 40px rgba(0,0,0,.18);overflow:hidden}
.page-intro::before{content:"";position:absolute;left:22px;right:22px;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(146,210,237,.72),transparent);opacity:.72}
.page-kicker{font-family:var(--mono);font-size:9px;text-transform:uppercase;letter-spacing:.16em;color:rgba(146,210,237,.76);margin-bottom:8px}
.page-title{font-family:var(--body);font-size:32px;font-weight:600;line-height:1.02;letter-spacing:-.035em;color:var(--text);max-width:14ch}
.page-copy{margin-top:8px;max-width:58ch;font-size:14px;line-height:1.6;color:var(--muted)}
.stitle{font-family:var(--display);font-size:24px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;margin-bottom:14px;margin-top:4px}
.loading{text-align:center;padding:52px 20px}
.ldots{display:flex;gap:5px;justify-content:center;margin-bottom:12px}
.ldot{width:6px;height:6px;border-radius:50%;background:var(--text);animation:blink 1.1s infinite}
.ldot:nth-child(2){animation-delay:.18s}.ldot:nth-child(3){animation-delay:.36s}
@keyframes blink{0%,100%{opacity:.1}50%{opacity:1}}
.ltxt{font-family:var(--mono);font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:.08em}
.noplan{text-align:center;padding:52px 20px;font-family:var(--mono);font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:.06em;line-height:2}
.todaywrap{margin-bottom:16px}
.todaypanel{background:#0a0a0a;color:#fff;border:1px solid rgba(146,210,237,0.15);border-radius:14px;padding:18px 16px 14px;box-shadow:0 8px 32px rgba(146,210,237,0.05)}
.todayeyebrow{font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.58);margin-bottom:6px}
.todayhead{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:12px}
.todaytitle{font-family:var(--display);font-size:28px;line-height:1;text-transform:uppercase;letter-spacing:.03em;color:#92d2ed}
.todaydate{font-family:var(--mono);font-size:11px;color:rgba(255,255,255,.62);white-space:nowrap}
.todaylist{display:flex;flex-direction:column;gap:10px}
.todayitem{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:14px}
.todaytop{display:flex;align-items:flex-start;gap:10px}
.todaydot{width:10px;height:10px;border-radius:50%;margin-top:7px;flex-shrink:0}
.todaydot.run{background:#92d2ed}.todaydot.strength{background:rgba(255,255,255,.75)}.todaydot.rest{background:#9ca3af}.todaydot.note{background:#92d2ed}
.todaymain{flex:1;min-width:0}
.todayname{font-family:var(--display);font-size:22px;line-height:1;text-transform:uppercase;letter-spacing:.02em}
.todayname.run{color:#92d2ed}.todayname.strength{color:rgba(255,255,255,.8)}.todayname.rest{color:#d1d5db}.todayname.note{color:#92d2ed}
.todaymeta{font-family:var(--mono);font-size:10px;color:rgba(255,255,255,.56);text-transform:uppercase;letter-spacing:.06em;margin-top:5px}
.todaytarget{margin-top:10px;padding:11px 12px;border-radius:10px;background:rgba(146,210,237,.08);border:1px solid rgba(146,210,237,.18)}
.todaytarget .label{font-family:var(--mono);font-size:9px;color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px}
.todaytarget .value{font-family:var(--display);font-size:18px;line-height:1;color:#92d2ed;text-transform:uppercase}
.todaytarget .desc{font-size:13px;line-height:1.45;color:rgba(255,255,255,.78);margin-top:5px}
.todaychips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.todaychip{font-family:var(--mono);font-size:10px;padding:5px 8px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.74)}
.todayempty{font-family:var(--mono);font-size:11px;color:rgba(255,255,255,.62);text-transform:uppercase;letter-spacing:.06em;padding:8px 0 2px}
.dg{margin-bottom:2px}
.dgh{display:flex;align-items:center;gap:8px;padding:12px 2px 8px;border-bottom:2px solid var(--border-mid)}
.dgh.today{border-bottom-color:#92d2ed}
.dgname{font-family:var(--display);font-size:19px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;min-width:42px}
.dgdate{font-family:var(--mono);font-size:11px;color:var(--dim)}
.todaybadge{font-family:var(--mono);font-size:9px;font-weight:700;background:#92d2ed;color:#050505;padding:2px 8px;border-radius:20px;text-transform:uppercase;letter-spacing:.05em;margin-left:auto}
.restday{font-family:var(--mono);font-size:11px;color:var(--dim);padding:10px 2px;text-transform:uppercase;letter-spacing:.06em}
.sc{background:var(--surface);border:1px solid var(--border);border-radius:10px;overflow:hidden;margin-top:7px}
.sc.done{border-color:var(--ok-border);background:var(--ok-bg)}
.sch{padding:15px 16px;display:flex;align-items:center;gap:12px;cursor:pointer}
.sch:active{background:var(--surface2)}
.sdot{width:9px;height:9px;border-radius:50%;flex-shrink:0;margin-top:1px}
.dot-run{background:var(--run)}.dot-strength{background:var(--strength)}.dot-rest{background:var(--rest)}.dot-note{background:#92d2ed}
.sinfo{flex:1;min-width:0}
.sname{font-family:var(--display);font-size:20px;font-weight:700;text-transform:uppercase;letter-spacing:.02em;line-height:1.1}
.sname.run{color:var(--run)}.sname.strength{color:var(--strength)}.sname.rest{color:var(--rest)}.sname.note{color:#92d2ed}
.smeta{font-size:12px;color:var(--muted);margin-top:2px}
.tick{width:44px;height:44px;border-radius:50%;border:2px solid var(--border-mid);background:var(--surface2);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s}
.tick:active{transform:scale(.92)}
.tick.on{background:var(--ok);border-color:var(--ok)}
.tick svg{opacity:0.2;transition:opacity .12s}
.tick.on svg{opacity:1}
.sc.marked{border-color:rgba(146,210,237,.3);background:rgba(146,210,237,.04)}
.tick.marked{background:var(--surface3);border-color:rgba(146,210,237,.4)}
.tick.marked svg{opacity:1;stroke:#92d2ed}
.sc-nudge{font-family:var(--mono);font-size:10px;color:#92d2ed;background:rgba(146,210,237,.06);border-top:1px solid rgba(146,210,237,.2);padding:6px 16px;letter-spacing:.02em}
.scb{display:none;padding:0 16px 16px;border-top:1px solid var(--border)}
.scb.open{display:block}
.cnote{background:var(--surface2);border-left:3px solid var(--border-mid);border-radius:0 6px 6px 0;padding:10px 12px;margin:12px 0;font-size:13px;color:var(--muted);font-style:italic;line-height:1.5}
.rtarget{background:rgba(146,210,237,.06);border:1px solid rgba(146,210,237,.18);border-radius:9px;padding:14px;margin:12px 0}
.rtn{font-family:var(--display);font-size:16px;font-weight:700;text-transform:uppercase;color:var(--run);margin-bottom:4px}
.rtd{font-size:13px;color:var(--run);opacity:.85;line-height:1.5;margin-bottom:8px}
.rtt{font-family:var(--mono);font-size:10px;color:var(--run);opacity:.5;display:flex;flex-wrap:wrap;gap:6px}
.ltitle{font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--dim);margin:14px 0 8px}
.rlog{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px}
.lf{display:flex;flex-direction:column;gap:4px}
.lf label{font-family:var(--mono);font-size:9px;color:var(--dim);text-transform:uppercase;letter-spacing:.06em}
.li{width:100%;background:var(--surface2);border:1px solid var(--border-mid);border-radius:7px;padding:11px 12px;color:var(--text);font-family:var(--mono);font-size:14px;outline:none;-webkit-appearance:none;-moz-appearance:none}
.li:focus{border-color:#92d2ed;background:var(--surface3)}
.savebtn{width:100%;padding:13px;background:#92d2ed;color:#050505;border:none;border-radius:8px;font-family:var(--display);font-size:17px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;margin-top:10px;transition:background .2s}
.savebtn.saved{background:var(--ok)}
.exlist{display:grid;gap:8px;margin-bottom:10px}
.exc{background:var(--surface2);border:1px solid var(--border);border-radius:9px;overflow:hidden}
.exh{padding:12px 14px 8px}
.exn{font-family:var(--display);font-size:15px;font-weight:700;text-transform:uppercase;letter-spacing:.02em}
.exm{font-family:var(--mono);font-size:10px;color:var(--dim);margin-top:2px}
.exnotes{font-family:var(--mono);font-size:10px;color:var(--run);margin-top:2px}
.slbls{display:grid;grid-template-columns:22px 1fr 1fr 44px 36px;gap:6px;padding:0 14px 4px}
.slbl{font-family:var(--mono);font-size:9px;color:var(--dim);text-transform:uppercase;text-align:center}
.exsets{padding:0 14px 6px;display:grid;gap:5px}
.setrow{display:grid;grid-template-columns:22px 1fr 1fr 44px 36px;gap:6px;align-items:center}
.setrow-single{display:grid;grid-template-columns:22px 1fr 1fr 1fr 36px;gap:6px;align-items:center}
.slbls-single{display:grid;grid-template-columns:22px 1fr 1fr 1fr 36px;gap:6px;padding:0 14px 4px}
.snum{font-family:var(--mono);font-size:10px;color:var(--dim);text-align:center}
.sin{width:100%;background:var(--surface);border:1px solid var(--border-mid);border-radius:6px;padding:10px 5px;color:var(--text);-webkit-text-fill-color:var(--text);caret-color:#92d2ed;font-family:var(--mono);font-size:14px;font-weight:500;outline:none;text-align:center;-webkit-appearance:none;-moz-appearance:none}
.sin:focus{border-color:#92d2ed;background:var(--surface3)}
.sin::placeholder,.rpe-in::placeholder{color:rgba(247,250,252,.26);-webkit-text-fill-color:rgba(247,250,252,.26);font-weight:400}
.rpe-in{width:100%;background:var(--surface);border:1px solid var(--border-mid);border-radius:6px;padding:10px 2px;font-family:var(--mono);font-size:12px;font-weight:500;outline:none;text-align:center;color:var(--muted);-webkit-text-fill-color:var(--muted);caret-color:#92d2ed;-webkit-appearance:none;-moz-appearance:none}
.rpe-in:focus{border-color:#92d2ed;color:var(--text)}
.rpe-in.filled{color:var(--text);-webkit-text-fill-color:var(--text)}
.ex-stat{font-family:var(--mono);font-size:9px;font-weight:700;border-radius:5px;padding:3px 7px;white-space:nowrap;line-height:1.3}
.ex-stat-pb{color:var(--pb);background:var(--pb-bg);border:1px solid var(--pb-border)}
.ex-stat-e1rm{color:var(--dim);margin-top:3px}
.ex-stat-pb.is-live-pb{background:var(--pb);color:#fff;border-color:var(--pb);box-shadow:0 0 0 1px var(--pb-border),0 0 14px rgba(167,139,250,.5);animation:pbglow 1.8s ease-in-out infinite}
.ex-stat-e1rm.is-live-pb{color:var(--pb);font-weight:700}
.ex-stat-vol-pb{color:var(--vpb);background:var(--vpb-bg);border:1px solid var(--vpb-border);margin-top:3px}
.ex-stat-vol{color:#92d2ed;background:rgba(146,210,237,.12);border:1px solid rgba(146,210,237,.25);margin-top:4px;text-align:right}
.ex-stat-vol.pb{color:#04231f;background:var(--vpb);border-color:var(--vpb);box-shadow:0 0 0 1px var(--vpb-border),0 0 16px rgba(45,212,191,.5);animation:vpbglow 1.8s ease-in-out infinite}
.prev-effort{font-family:var(--mono);font-size:9px;color:rgba(247,250,252,.38);background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.09);border-radius:4px;padding:3px 8px;display:inline-block}
.prev-effort.has-last{color:rgba(146,210,237,.58);background:rgba(146,210,237,.055);border-color:rgba(146,210,237,.14)}
.today-effort{font-family:var(--mono);font-size:9px;color:var(--run);background:rgba(146,210,237,.08);border:1px solid rgba(146,210,237,.18);border-radius:4px;padding:3px 8px;display:none}
.plate-calc{padding:2px 14px 10px}
.plate-calc-label{font-family:var(--mono);font-size:8px;color:var(--dim);text-transform:uppercase;letter-spacing:.06em;margin-bottom:5px}
.plate-pills{display:flex;gap:5px;flex-wrap:wrap}
.plate-pill{font-family:var(--mono);font-size:9px;background:var(--surface);border:1px solid var(--border-mid);padding:3px 8px;border-radius:10px;color:var(--muted)}
.st{width:32px;height:32px;border-radius:50%;border:1.5px solid var(--border-mid);background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;margin:0 auto;flex-shrink:0;transition:all .12s}
.st.on{background:var(--ok);border-color:var(--ok)}
.st.pb-on{background:var(--pb);border-color:var(--pb)}
.st svg{opacity:0;transition:opacity .1s}
.st.on svg,.st.pb-on svg{opacity:1}
.setrow,.setrow-single{position:relative}
.setrow.has-pb .sin,.setrow-single.has-pb .sin{border-color:var(--pb);background:rgba(167,139,250,.22);box-shadow:inset 0 0 12px rgba(167,139,250,.55),0 0 14px rgba(167,139,250,.45);animation:pbglow 1.8s ease-in-out infinite}
.pb-badge{position:absolute;right:-2px;top:-8px;font-family:var(--mono);font-size:8px;font-weight:700;letter-spacing:.03em;background:var(--pb);color:#fff;padding:2px 6px;border-radius:9px;white-space:nowrap;z-index:3;box-shadow:0 1px 4px rgba(124,58,237,.35);animation:pbpop .3s ease}
@keyframes pbpop{0%{transform:scale(.6);opacity:0}70%{transform:scale(1.15)}100%{transform:scale(1);opacity:1}}
@keyframes pbglow{0%,100%{box-shadow:inset 0 0 7px rgba(167,139,250,.4),0 0 8px rgba(167,139,250,.3)}50%{box-shadow:inset 0 0 14px rgba(167,139,250,.72),0 0 18px rgba(167,139,250,.6)}}
@keyframes vpbglow{0%,100%{box-shadow:0 0 0 1px var(--vpb-border),0 0 9px rgba(45,212,191,.4)}50%{box-shadow:0 0 0 1px var(--vpb),0 0 20px rgba(45,212,191,.72)}}
@keyframes pbglowLight{0%,100%{box-shadow:inset 0 0 9px rgba(124,58,237,.5),0 0 8px rgba(124,58,237,.35)}50%{box-shadow:inset 0 0 18px rgba(124,58,237,.85),0 0 18px rgba(124,58,237,.6)}}
@keyframes vpbglowLight{0%,100%{box-shadow:0 0 0 1px rgba(13,148,136,.5),0 0 9px rgba(13,148,136,.45)}50%{box-shadow:0 0 0 1px rgba(13,148,136,.9),0 0 20px rgba(13,148,136,.7)}}
.setrow.extra{grid-template-columns:22px 1fr 1fr 44px 36px 26px}
.setrow-single.extra{grid-template-columns:22px 1fr 1fr 1fr 36px 26px}
.strength-log-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 0 8px}
.strength-log-heading .ltitle{margin:0}
.strength-log-prefs{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}
.rest-pref-toggle{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:5px 9px;border:1px solid var(--border-mid);border-radius:999px;background:var(--surface2);color:var(--muted);font-family:var(--mono);font-size:9px;letter-spacing:.04em;text-transform:uppercase;cursor:pointer}
.rest-pref-toggle strong{color:var(--dim);font-size:9px}
.rest-pref-dot{width:7px;height:7px;border-radius:50%;background:var(--dim);box-shadow:0 0 0 3px transparent;transition:all .15s}
.rest-pref-toggle.is-on{border-color:rgba(146,210,237,.32);color:var(--text);background:rgba(146,210,237,.08)}
.rest-pref-toggle.is-on strong{color:#92d2ed}
.rest-pref-toggle.is-on .rest-pref-dot{background:#92d2ed;box-shadow:0 0 0 3px rgba(146,210,237,.12)}
html.strength-rpe-off .slbls .slbl:nth-child(4),html.strength-rpe-off .setrow .rpe-in{display:none}
html.strength-rpe-off .slbls,html.strength-rpe-off .setrow{grid-template-columns:22px 1fr 1fr 36px}
html.strength-rpe-off .setrow.extra{grid-template-columns:22px 1fr 1fr 36px 26px}
.rest-timer{position:relative;background:linear-gradient(135deg,rgba(146,210,237,.10),rgba(255,255,255,.035));border:1px solid var(--run-border);border-radius:12px;padding:11px 12px;display:flex;align-items:center;gap:12px;margin:10px 0;box-shadow:inset 0 1px 0 rgba(255,255,255,.035)}
.rt-label{font-family:var(--mono);font-size:8px;color:var(--dim);text-transform:uppercase;letter-spacing:.12em}
.rt-count{font-family:var(--display);font-size:22px;font-weight:800;color:var(--run);line-height:1}
.rt-wrap{flex:1;height:5px;background:rgba(255,255,255,.10);border-radius:999px;overflow:hidden}
.rt-fill{height:100%;background:linear-gradient(90deg,var(--run),var(--run-strong));border-radius:999px;transition:width .5s linear;box-shadow:0 0 10px rgba(146,210,237,.22)}
.rt-skip{font-family:var(--mono);font-size:9px;color:var(--muted);border:1px solid var(--border-mid);padding:6px 11px;border-radius:999px;background:rgba(255,255,255,.025);cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s,color .15s}
.rt-skip:hover{background:rgba(255,255,255,.06);border-color:var(--border-strong);color:var(--text)}
.del-set{width:22px;height:22px;border-radius:50%;border:1px solid var(--border-mid);background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--dim);font-size:14px;line-height:1;padding:0;transition:all .12s;flex-shrink:0;margin:0 auto}
.del-set:hover{border-color:#e55;color:#e55;background:rgba(229,85,85,.08)}
.addset{width:calc(100% - 28px);margin:2px 14px 10px;padding:8px;font-family:var(--mono);font-size:10px;color:var(--dim);border:1px dashed var(--border-mid);border-radius:6px;background:transparent;cursor:pointer;text-align:center;text-transform:uppercase;letter-spacing:.04em}
.goals-hero{background:#0a0a0a;border:1px solid rgba(146,210,237,0.15);border-radius:12px;padding:22px;margin-bottom:14px;position:relative;overflow:hidden}
.goals-hero::before{content:'';position:absolute;top:-40px;right:-40px;width:160px;height:160px;background:rgba(255,255,255,.03);border-radius:50%}
.goals-label{font-family:var(--mono);font-size:10px;color:rgba(255,255,255,.35);text-transform:uppercase;letter-spacing:.1em;margin-bottom:6px}
.goals-name{font-family:var(--display);font-size:28px;font-weight:700;text-transform:uppercase;color:#fff;letter-spacing:.04em;margin-bottom:4px}
.goals-sub{font-size:13px;color:rgba(255,255,255,.72);line-height:1.5}
.goals-saved-badge{font-family:var(--mono);font-size:10px;color:rgba(255,255,255,.35);margin-top:10px;display:none}
.goals-saved-badge.show{display:block}
.card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:18px;margin-bottom:12px}
.card-title{font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--dim);margin-bottom:12px}
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:4px}
.stat-field{display:flex;flex-direction:column;gap:5px}
.stat-field label{font-family:var(--mono);font-size:9px;color:var(--dim);text-transform:uppercase;letter-spacing:.07em}
.stat-input{width:100%;background:var(--surface2);border:1px solid var(--border-mid);border-radius:7px;padding:10px 12px;color:var(--text);font-family:var(--display);font-size:22px;font-weight:700;letter-spacing:.02em;outline:none;-webkit-appearance:none;-moz-appearance:none}
.stat-input:focus{border-color:#92d2ed;background:var(--surface3)}
.stat-input::placeholder{color:var(--dim);font-size:18px;font-weight:400}
.field-hint{font-family:var(--mono);font-size:9px;color:var(--dim);margin-top:2px;letter-spacing:.04em}
.goals-card-note{margin:-3px 0 14px;color:var(--muted);font-size:12px;line-height:1.5}
/* Goals hints are guidance, not data. In DM Mono at full card width they read
   with the same authority as the labels above them, which is what made the
   longer cards feel like a wall of text. Body font, dimmer, tighter. */
#tab-goals .field-hint{font-family:var(--body);letter-spacing:0;line-height:1.35;color:var(--dim);opacity:.75;margin-top:3px}
#tab-goals .stat-field>label{color:var(--muted)}
/* Sub-headings for a card that asks two different kinds of question. */
.goals-block-label{display:flex;align-items:center;gap:9px;margin:0 0 9px;font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--run)}
.goals-block-label::after{content:'';flex:1;height:1px;background:var(--border)}
.goals-block-label-split{margin-top:16px;padding-top:15px;border-top:1px solid var(--border)}
.goals-block-label-split::after{display:none}
.goals-block-note{flex:0 1 auto;margin-left:auto;font-family:var(--body);font-size:9px;letter-spacing:0;text-transform:none;color:var(--dim)}
.why-textarea{width:100%;background:var(--surface2);border:1px solid var(--border-mid);border-radius:9px;padding:14px;font-size:14px;color:var(--text);font-family:var(--body);line-height:1.6;outline:none;resize:vertical;min-height:100px}
.why-textarea:focus{border-color:#92d2ed;background:var(--surface3)}
.why-textarea::placeholder{color:var(--dim);font-style:italic}
.milestone-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.milestone-field{display:flex;flex-direction:column;gap:6px}
.milestone-field label{font-family:var(--mono);font-size:9px;color:var(--dim);text-transform:uppercase;letter-spacing:.06em;text-align:center}
.milestone-input{width:100%;background:var(--surface2);border:1px solid var(--border-mid);border-radius:8px;padding:10px 8px;font-family:var(--body);font-size:13px;color:var(--text);outline:none;resize:none;min-height:72px;text-align:center;line-height:1.4}
.milestone-input:focus{border-color:#92d2ed;background:var(--surface3)}
.milestone-input::placeholder{color:var(--dim);font-style:italic;font-size:12px}
.race-options{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}
.race-opt{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em;padding:9px 14px;border:1.5px solid var(--border-mid);border-radius:8px;background:transparent;color:var(--muted);cursor:pointer;transition:all .15s}
.race-opt.selected{background:#92d2ed;border-color:#92d2ed;color:#050505}
.accordion-card{background:var(--surface);border:1px solid var(--border);border-radius:10px;overflow:hidden}
.accordion-header{display:flex;align-items:center;justify-content:space-between;padding:16px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.accordion-header:active{background:var(--surface2)}
.accordion-left .accordion-title{font-family:var(--display);font-size:18px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.accordion-left .accordion-sub{font-family:var(--mono);font-size:10px;color:var(--dim);margin-top:3px;letter-spacing:.04em}
.accordion-arrow{font-family:var(--mono);font-size:20px;color:var(--dim);line-height:1;transition:transform .2s;flex-shrink:0}
.accordion-arrow.open{transform:rotate(45deg)}
.accordion-body{padding:0 16px 16px;border-top:1px solid var(--border)}
.nut-wbar{background:#111;padding:10px 16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.06);margin:-16px -14px 16px}
.nut-wlabel{font-family:var(--display);font-size:16px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#fff}
.nut-arr{font-family:var(--mono);font-size:11px;padding:6px 11px;border:1px solid rgba(255,255,255,.13);border-radius:6px;background:transparent;color:rgba(255,255,255,.5);cursor:pointer}
.priority-list{display:grid;gap:10px}
.priority-item{display:flex;align-items:flex-start;gap:12px}
.priority-num{font-family:var(--display);font-size:18px;font-weight:700;background:#0a0a0a;color:#92d2ed;border:1px solid rgba(146,210,237,.25);width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.priority-text{font-size:13px;color:var(--muted);line-height:1.55}
.priority-text strong{color:var(--text)}
.mc.fibre .mv{color:var(--rest)}
.ci-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.ci-card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:16px}
.ci-val{font-family:var(--display);font-size:32px;font-weight:700;line-height:1;margin-bottom:4px}
.ci-lbl{font-family:var(--mono);font-size:10px;color:var(--dim);text-transform:uppercase;letter-spacing:.06em}
.ci-card.run .ci-val{color:var(--run)}.ci-card.lift .ci-val{color:var(--strength)}
.macro-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.mc{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:16px;text-align:center}
.mv{font-family:var(--display);font-size:36px;font-weight:700;line-height:1;margin-bottom:4px}
.ml{font-family:var(--mono);font-size:10px;color:var(--dim);text-transform:uppercase;letter-spacing:.05em}
.mc.cal .mv{color:var(--text)}.mc.pro .mv{color:var(--run)}.mc.carb .mv{color:var(--run)}.mc.fat .mv{color:var(--rest)}
.nutrnote{background:var(--surface2);border-left:2px solid #92d2ed;border-radius:10px;padding:14px;font-size:13px;color:var(--muted);line-height:1.6;margin-bottom:12px}
.timing-table{width:100%;border-collapse:collapse;font-size:12px;margin-top:8px}
.timing-table th{font-family:var(--mono);font-size:9px;text-transform:uppercase;letter-spacing:.06em;color:var(--dim);padding:8px;text-align:left;border-bottom:1px solid var(--border-mid)}
.timing-table td{padding:9px 8px;border-bottom:1px solid var(--border);vertical-align:top}
.timing-table tr:last-child td{border-bottom:none}
.timing-table td:first-child{font-weight:600}
.progress-stats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:14px}
.pstat{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:14px;text-align:center}
.pstat-val{font-family:var(--display);font-size:28px;font-weight:700;line-height:1;margin-bottom:3px}
.pstat-lbl{font-family:var(--mono);font-size:9px;color:var(--dim);text-transform:uppercase;letter-spacing:.05em}
.photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.photo-cell{background:var(--surface2);border:1.5px dashed var(--border-mid);border-radius:8px;aspect-ratio:1;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px;cursor:pointer;overflow:hidden;position:relative;transition:border-color .15s}
.photo-cell:active{border-color:var(--border-strong)}
.photo-cell.has-photo{border-style:solid;border-color:var(--border)}
.photo-cell img{width:100%;height:100%;object-fit:cover;position:absolute;top:0;left:0}
.photo-cell .photo-label{font-family:var(--mono);font-size:9px;color:var(--dim);text-transform:uppercase;letter-spacing:.05em;position:relative;z-index:1}
.photo-cell .photo-add{font-size:20px;color:var(--dim);position:relative;z-index:1}
.photo-cell.uploading{opacity:.6;pointer-events:none}
.photo-cell.current-week{border-color:var(--run);border-style:solid;border-width:2px}
.photo-cell.current-week .photo-label{color:var(--run)}
.photo-cell.current-week .photo-add{color:var(--run)}
.photo-cell.current-week-badge{font-family:var(--mono);font-size:8px;color:var(--run);text-transform:uppercase;letter-spacing:.06em;position:absolute;top:5px;left:6px;z-index:2;font-weight:700;line-height:1}
.photo-cell .photo-overlay{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,.5);padding:3px;text-align:center;font-family:var(--mono);font-size:8px;color:#fff;letter-spacing:.04em;text-transform:uppercase}
.photo-cell.has-photo .photo-overlay{color:#92d2ed}
.photo-cell .photo-count{font-family:var(--mono);font-size:9px;color:#fff;background:rgba(0,0,0,.6);border-radius:20px;padding:2px 7px;position:absolute;top:6px;right:6px;z-index:2}
.hb-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:20px}
.hb-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:18px 14px;cursor:pointer;transition:border-color .15s,transform .1s;-webkit-tap-highlight-color:transparent}
.hb-card:active{transform:scale(.97);border-color:var(--border-mid)}
.hb-icon{font-size:24px;margin-bottom:8px}
.hb-title{font-family:var(--display);font-size:16px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;line-height:1.2;margin-bottom:4px}
.hb-sub{font-family:var(--mono);font-size:10px;color:var(--dim);letter-spacing:.04em}
.hb-modal{display:none;position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.6);align-items:flex-end}
.hb-modal.open{display:flex}
.hb-modal-inner{background:var(--bg);border-radius:20px 20px 0 0;width:100%;max-height:88vh;overflow-y:auto;-webkit-overflow-scrolling:touch}
.hb-modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 18px 12px;position:sticky;top:0;background:var(--bg);z-index:1;border-bottom:1px solid var(--border)}
.hb-modal-title{font-family:var(--display);font-size:24px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.hb-modal-close{font-size:22px;color:var(--dim);background:var(--surface2);border:none;border-radius:50%;width:34px;height:34px;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;flex-shrink:0}
.hb-modal-body{padding:18px 18px 52px}
.photo-modal{display:none;position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.7);align-items:flex-end;justify-content:center}
.photo-modal.open{display:flex}
.photo-modal-inner{background:var(--bg);border-radius:16px 16px 0 0;padding:20px 16px 36px;width:100%;max-width:600px;max-height:85vh;overflow-y:auto}
.photo-modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.photo-modal-title{font-family:var(--display);font-size:22px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.photo-modal-close{font-size:24px;color:var(--dim);background:none;border:none;cursor:pointer;line-height:1;padding:4px}
.angle-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.angle-slot{background:var(--surface);border:1.5px dashed var(--border-mid);border-radius:10px;aspect-ratio:.75;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer;overflow:hidden;position:relative;transition:border-color .15s}
.angle-slot.has-photo{border-style:solid;border-color:var(--border)}
.angle-slot:active{border-color:var(--border-strong)}
.angle-slot img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.angle-slot .aslot-label{font-family:var(--mono);font-size:10px;color:var(--dim);text-transform:uppercase;letter-spacing:.05em;position:relative;z-index:1;text-align:center;padding:0 8px}
.angle-slot .aslot-add{font-size:22px;color:var(--dim);position:relative;z-index:1}
.angle-slot .aslot-overlay{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,.55);padding:4px;text-align:center;font-family:var(--mono);font-size:8px;color:#fff;letter-spacing:.04em;text-transform:uppercase}
.angle-slot.uploading{opacity:.5;pointer-events:none}
.comms-card{background:#0a0a0a;border-radius:12px;padding:22px;margin-bottom:12px}
.comms-title{font-family:var(--display);font-size:22px;font-weight:700;text-transform:uppercase;color:#fff;letter-spacing:.03em;margin-bottom:8px}
.comms-body{font-size:13px;color:rgba(255,255,255,.5);line-height:1.6;margin-bottom:18px}
.comms-btn{display:block;width:100%;padding:14px;background:#92d2ed;color:#050505;border:none;border-radius:8px;font-family:var(--display);font-size:17px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;text-align:center;text-decoration:none}
.comms-note{font-family:var(--mono);font-size:11px;color:rgba(255,255,255,.3);text-align:center;margin-top:10px}
.weeklyplan-wrap{width:100%}
#loginScreen{position:relative;min-height:100vh;background:#050505;overflow:hidden}
.login-glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:520px;height:520px;max-width:120vw;background:radial-gradient(circle,rgba(146,210,237,0.07),transparent 70%);pointer-events:none;z-index:0}
.login-col{position:relative;z-index:1;max-width:360px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:40px 16px}
.login-logo-img{width:72px;height:72px;margin:0 auto 22px;background:var(--dp-logo) center/contain no-repeat}
.login-eyebrow{font-family:var(--mono);font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:rgba(255,255,255,0.22);margin-bottom:4px}
.login-brand{font-family:var(--display);font-size:22px;font-weight:700;text-transform:uppercase;color:#fff;letter-spacing:.04em;margin-bottom:48px}
.code-boxes{display:flex;gap:6px;justify-content:center;margin-bottom:14px}
.code-box{width:48px;height:60px;border:1px solid #1e1e1e;background:rgba(146,210,237,0.03);border-radius:8px;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:22px;color:#92d2ed;transition:border-color .15s}
.code-box.active{border-color:#92d2ed}
.code-hidden{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;border:0;padding:0}
.code-hint{font-family:var(--mono);font-size:11px;color:rgba(255,255,255,0.22);margin-bottom:28px}
.login-actions{width:100%}
.lbtn{width:100%;background:transparent;border:1px solid #92d2ed;color:#92d2ed;font-family:var(--display);font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.22em;padding:16px;border-radius:8px;cursor:pointer;transition:background .15s,color .15s}
.lerr{font-family:var(--mono);font-size:12px;color:#ef4444;margin-top:14px;text-align:center;display:none}
.toast{position:fixed;bottom:78px;left:50%;transform:translateX(-50%);background:#0a0a0a;color:#fff;font-family:var(--mono);font-size:12px;padding:10px 20px;border-radius:20px;display:none;z-index:200;white-space:nowrap;letter-spacing:.04em}

/* Running-specific expanded details */
.run-details{padding:12px 14px;background:var(--surface2);border-top:1px solid var(--border);margin-top:0}
.rpe-box{background:rgba(146,210,237,.06);border:1px solid rgba(146,210,237,.16);border-radius:8px;padding:10px 14px;display:flex;align-items:center;gap:14px}
.rpe-label{font-family:var(--mono);font-size:10px;color:var(--run);text-transform:uppercase;letter-spacing:.12em;margin-bottom:6px;font-weight:600}
.rpe-value{font-family:var(--display);font-size:22px;font-weight:800;color:var(--run);line-height:1;text-transform:uppercase;letter-spacing:.01em;white-space:nowrap}
.rpe-desc{font-size:13px;color:var(--muted);margin-top:8px;line-height:1.45}
.detail-section{margin-bottom:0}
.detail-head{font-family:var(--display);font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--text);margin-bottom:8px}
.detail-content{font-size:13px;color:var(--text);line-height:1.5;background:var(--surface3);border-radius:8px;padding:10px 14px;border:1px solid var(--border)}
.alt-box{background:rgba(146,210,237,.04);border:1px solid rgba(146,210,237,.14);border-radius:8px;padding:10px 14px;margin-top:0}
.alt-label{font-family:var(--mono);font-size:10px;color:var(--run);text-transform:uppercase;letter-spacing:.12em;margin-bottom:8px;font-weight:600}
.alt-title{font-family:var(--display);font-size:18px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:var(--run);margin-bottom:8px;line-height:1.15}
.alt-desc{font-size:13px;color:var(--muted);line-height:1.5}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.chip{font-family:var(--mono);font-size:11px;padding:5px 12px;border-radius:999px;background:var(--surface3);border:1px solid var(--border-mid);color:var(--muted);letter-spacing:.02em}

/* Running data input */
.run-log{margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}
.run-log-title{font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--dim);margin-bottom:10px}
.run-inputs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}
.run-input-full{grid-column:1/-1}
.run-field{display:flex;flex-direction:column;gap:4px}
.run-field label{font-family:var(--mono);font-size:9px;color:var(--dim);text-transform:uppercase;letter-spacing:.06em}
.run-field input,.run-field textarea,.run-field select{width:100%;background:var(--surface);border:1px solid var(--border-mid);border-radius:7px;padding:11px 12px;color:var(--text);font-family:var(--mono);font-size:14px;outline:none}
.run-field select{cursor:pointer}
.run-field textarea{font-family:var(--body);font-size:13px;resize:vertical;min-height:70px;line-height:1.5}
.run-field input:focus,.run-field textarea:focus,.run-field select:focus{border-color:#92d2ed;background:var(--surface3)}
.save-run-btn{width:100%;padding:13px;background:#92d2ed;color:#050505;border:none;border-radius:8px;font-family:var(--display);font-size:15px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;transition:background .2s}
.save-run-btn:active{transform:scale(.98)}
.save-run-btn.saved{background:var(--ok)}
.saved-data{background:var(--ok-bg);border:1px solid var(--ok-border);border-radius:8px;padding:12px;margin-bottom:10px}
.saved-label{font-family:var(--mono);font-size:9px;color:var(--ok);text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}
.saved-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:13px;color:var(--text)}
.saved-item{display:flex;flex-direction:column;gap:2px}
.saved-item-label{font-family:var(--mono);font-size:9px;color:var(--dim);text-transform:uppercase}
.saved-item-value{font-weight:500}
.saved-notes{margin-top:8px;font-size:13px;color:var(--muted);font-style:italic;padding-top:8px;border-top:1px solid var(--ok-border)}
.saved-feeling{margin-top:8px;padding:8px 10px;background:rgba(146,210,237,.08);border:1px solid rgba(146,210,237,.14);border-radius:6px;font-size:12px;color:var(--run);font-weight:500}

/* Check-in wizard */
.ci-wizard-bar{display:flex;align-items:center;justify-content:space-between;padding-bottom:14px;margin-bottom:16px;border-bottom:1px solid var(--border)}
.ci-sdots{display:flex;gap:7px;align-items:center}
.ci-sdot{width:8px;height:8px;border-radius:50%;background:var(--border-mid);transition:all .2s;cursor:pointer;border:none;padding:0}
.ci-sdot.done{background:var(--ok)}
.ci-sdot.active{background:#92d2ed;transform:scale(1.25)}
.ci-step-counter{font-family:var(--mono);font-size:10px;color:var(--dim);text-transform:uppercase;letter-spacing:.06em}
.ci-step-panel{display:none}
.ci-step-panel.active{display:block}
.ci-step-title{font-family:var(--display);font-size:22px;font-weight:800;text-transform:uppercase;letter-spacing:.02em;margin-bottom:14px}
.ci-nav-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}
.ci-nav-row.solo{grid-template-columns:1fr}
.ci-btn-back{padding:13px;background:var(--surface2);color:var(--text);border:1px solid var(--border-mid);border-radius:8px;font-family:var(--display);font-size:15px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;cursor:pointer}
.ci-btn-next{padding:13px;background:#92d2ed;color:#050505;border:none;border-radius:8px;font-family:var(--display);font-size:15px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;cursor:pointer}

@media(max-width:760px){
  .rtarget > div[style*='grid-template-columns:1.35fr .95fr']{grid-template-columns:1fr !important;}
}

@media(max-width:400px){.hn{font-size:36px}.sname{font-size:17px}.rlog{grid-template-columns:1fr}.milestone-grid{grid-template-columns:1fr 1fr}}
@media(max-width:430px){.logo-text{font-size:11px;letter-spacing:.06em}.logo{gap:8px}.header-actions{gap:4px}.hicon{font-size:9px;padding:4px 8px}}

/* Quick-log bottom strip */
.quicklog-strip{position:fixed;bottom:0;left:0;right:0;z-index:140;background:#0a0a0a;border-top:1px solid rgba(255,255,255,.1);padding:10px 16px calc(10px + env(safe-area-inset-bottom));display:none;gap:10px}
.quicklog-btn{flex:1;padding:11px;border:none;border-radius:8px;font-family:var(--display);font-size:14px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;transition:opacity .12s}
.quicklog-btn:active{opacity:.75}
.quicklog-btn.ql-body{background:rgba(255,255,255,.08);color:rgba(255,255,255,.75);border:1px solid rgba(255,255,255,.12)}
.quicklog-btn.ql-nut{background:#92d2ed;color:#050505}
.ql-modal{display:none;position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.6);align-items:flex-end}
.ql-modal.open{display:flex}
.ql-modal-inner{background:var(--bg);border-radius:20px 20px 0 0;width:100%;max-height:90vh;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:calc(16px + env(safe-area-inset-bottom))}
.ql-modal-header{display:flex;align-items:center;justify-content:space-between;padding:18px 18px 12px;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--bg);z-index:1}
.ql-modal-title{font-family:var(--display);font-size:22px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.ql-modal-close{font-size:22px;color:var(--dim);background:var(--surface2);border:none;border-radius:50%;width:34px;height:34px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ql-modal-body{padding:18px}
.qln-tgt{font-family:var(--mono);font-size:9px;color:var(--ok);text-transform:uppercase;letter-spacing:.05em;display:none;background:var(--ok-bg);border:1px solid var(--ok-border);border-radius:4px;padding:1px 6px;white-space:nowrap;flex-shrink:0}
.qln-feedback{background:var(--surface2);border-radius:10px;padding:12px 14px;margin-bottom:14px;display:none}
.qln-fb-title{font-family:var(--mono);font-size:9px;color:var(--dim);text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px}
.qln-fb-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.qln-fb-item{display:flex;flex-direction:column;gap:2px}
.qln-fb-label{font-family:var(--mono);font-size:8px;color:var(--dim);text-transform:uppercase;letter-spacing:.07em}
.qln-fb-val{font-family:var(--display);font-size:17px;font-weight:700;line-height:1.1}
.qln-fb-bar{height:3px;border-radius:2px;background:var(--border-mid);overflow:hidden;margin-top:3px}
.qln-fb-fill{height:100%;border-radius:2px;transition:width .25s,background .25s}
.qln-fb-status{font-family:var(--mono);font-size:8px;letter-spacing:.04em;margin-top:1px}
/* Exercise picker */
.ex-picker-label{font-family:var(--mono);font-size:9px;color:var(--dim);text-transform:uppercase;letter-spacing:.08em;padding:8px 14px 2px;display:block}
.ex-picker{display:flex;gap:6px;flex-wrap:wrap;padding:0 14px 10px}
.ex-pill{font-family:var(--mono);font-size:10px;padding:5px 10px;border:1px solid var(--border-mid);border-radius:20px;background:var(--surface);color:var(--muted);cursor:pointer;letter-spacing:.02em;white-space:nowrap;line-height:1.4;transition:all .12s;-webkit-tap-highlight-color:transparent}
.ex-pill.active{background:#92d2ed;border-color:#92d2ed;color:#050505}
.ex-pill:active{opacity:.7}
/* "More options" expander — the coach's programmed exercise and alts stay the
   visual priority, so this reads as a quiet secondary control until the athlete
   is actually training something from the wider same-muscle bank. */
.ex-pill-more{display:inline-flex;align-items:center;gap:5px;border-style:dashed;color:var(--dim)}
.ex-pill-more .ex-more-caret{font-size:9px;line-height:1;transition:transform .15s}
.ex-pill-more[aria-expanded="true"] .ex-more-caret{transform:rotate(180deg)}
.ex-pill-more.is-swapped{border-style:solid;border-color:rgba(146,210,237,.55);color:#92d2ed}
.ex-pill-more.is-swapped::after{content:'SWAPPED';font-size:8px;letter-spacing:.08em;background:rgba(146,210,237,.16);border-radius:20px;padding:2px 6px}
.ex-swaps{margin:0 14px 10px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2,rgba(255,255,255,.02));padding:10px 12px 4px}
.ex-swaps-note{display:flex;flex-direction:column;gap:3px;margin-bottom:10px}
.ex-swaps-note strong{font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:#92d2ed}
.ex-swaps-note span{font-size:11px;line-height:1.45;color:var(--dim)}
.ex-swap-group{margin-bottom:10px}
.ex-swap-group-label{font-family:var(--mono);font-size:9px;color:var(--dim);text-transform:uppercase;letter-spacing:.08em;margin-bottom:5px}
.ex-swap-pills{display:flex;gap:6px;flex-wrap:wrap}
.ex-pill-alt{white-space:normal;text-align:left}
/* Variation churn warning. Amber, not red — swapping is allowed and often the
   right call; this is coaching context, not an error. */
.swap-churn-note{display:flex;gap:10px;align-items:flex-start;margin:0 14px 10px;padding:10px 12px;border:1px solid rgba(255,170,0,.35);background:rgba(255,170,0,.07);border-radius:10px}
.swap-churn-badge{font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:#ffaa00;border:1px solid rgba(255,170,0,.4);border-radius:20px;padding:3px 7px;flex-shrink:0}
.swap-churn-note strong{display:block;font-size:12px;line-height:1.4;margin-bottom:3px}
.swap-churn-note span:not(.swap-churn-badge){display:block;font-size:11px;line-height:1.45;color:var(--dim)}
/* Session muscle-group coverage */
.muscle-coverage{margin:14px 0 4px;padding:12px 14px;border:1px solid var(--border);border-radius:10px}
.mcov-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:9px}
.mcov-title{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.mcov-sum{font-family:var(--mono);font-size:10px;color:#92d2ed}
.mcov-chips{display:flex;flex-wrap:wrap;gap:6px}
.mcov-chip{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10px;padding:5px 9px;border-radius:20px;border:1px solid var(--border-mid);color:var(--muted)}
.mcov-chip-sets{font-size:9px;opacity:.75}
.mcov-chip.is-done{border-color:rgba(146,210,237,.5);color:#92d2ed}
.mcov-chip.is-partial{border-color:rgba(255,170,0,.4);color:#ffaa00}
.mcov-chip.is-todo{opacity:.6}
.mcov-gap{font-size:11px;line-height:1.45;color:var(--dim);margin-top:9px}

/* ── MOBILE POLISH ─────────────────────────────────────────────────────────── */
/* Hero pills scroll horizontally instead of squeezing/clipping */
.hpills{overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.hpills::-webkit-scrollbar{display:none}
/* Bigger tap targets */
.warr,.wtoday{min-height:36px;min-width:38px}
.hicon{min-height:28px}
.hb-modal-close,.ql-modal-close{width:38px;height:38px}
.photo-modal-close{padding:6px 10px}
@media(max-width:400px){
  .todaytitle{font-size:25px}
  .mv{font-size:30px}
  .hpills{gap:5px}
  .tab{padding:12px 13px}
}

/* ── HOVER STATES (mouse/trackpad only) ────────────────────────────────────── */
@media(hover:hover){
  .sch:hover{background:var(--surface2)}
  .hb-card:hover{border-color:var(--border-mid);transform:translateY(-2px)}
  .tab:hover{color:rgba(255,255,255,.7)}
  .warr:hover,.wtoday:hover,.nut-arr:hover{border-color:rgba(255,255,255,.35);color:rgba(255,255,255,.85)}
  .savebtn:hover,.ci-btn-next:hover,.save-run-btn:hover,.comms-btn:hover,.goals-prompt-btn:hover{background:#6bb8d4}
  .lbtn:hover{background:#92d2ed;color:#050505}
  .savebtn.saved:hover,.save-run-btn.saved:hover{background:var(--ok)}
  .tick:hover{border-color:var(--border-strong)}
  .race-opt:hover{border-color:var(--border-strong)}
  .ci-btn-back:hover{border-color:var(--border-strong)}
  .photo-cell:hover,.angle-slot:hover{border-color:var(--border-strong)}
  .quicklog-btn:hover{opacity:.85}
  .accordion-header:hover{background:var(--surface2)}
}

/* ── DESKTOP LAYOUT (≥900px) ───────────────────────────────────────────────── */
@media(min-width:900px){
  :root{--shellpad:max(32px,calc((100vw - 1360px)/2))}
  /* Align the dark shell (header, hero, bars) with the content column */
  header{padding:0 var(--shellpad)}
  .hero{padding:22px var(--shellpad) 16px}
  .hn{font-size:54px}
  .hero-week-num{font-size:32px}
  .hpills{flex-wrap:wrap;overflow:visible}
  .wbar{padding:10px var(--shellpad)}
  .tabs{padding:0 calc(var(--shellpad) - 16px)}
  .nudge-strip{padding:14px var(--shellpad)}
  .nudge-strip-inner{max-width:none}
  .tab-content{max-width:none;padding:28px var(--shellpad) 150px}

  /* Desktop IA split: Today's Plan is its own destination, and Weekly Plan
     gets the calendar view in a separate tab. */
  .desktop-weekly-tab{display:flex}
  #tab-training.active{display:block;max-width:none;width:auto;margin-right:0}
  #tab-training .todaywrap{margin-bottom:0}
  #tab-training>#calEl,#tab-training>#noplanEl{display:none!important}
  #tab-training .page-intro,#tab-training .todaywrap{max-width:none}
  #tab-weekly.active{display:block;max-width:none;width:auto}
  #tab-weekly>#todayEl{display:none!important}
  #tab-weekly>#weeklyCalEl{min-width:0;padding-top:4px}
  #tab-weekly>#weeklyCalEl .dg:first-child .dgh{padding-top:0}

  /* Nutrition: macros across one row, cards in a two-column grid
     (grid instead of column-count: multicol fragments tall cards and
     lets tables spill past the card background) */
  .nut-wbar{margin:0 0 18px;border-radius:12px}
  .macro-grid{grid-template-columns:repeat(5,1fr)}
  .macro-grid .mc.fibre{grid-column:auto !important}
  #nutContent{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;align-items:start}
  #nutContent>.macro-grid,#nutContent>.cnote{grid-column:1/-1}

  /* Goals: two-column grid */
  #tab-goals.active{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;align-items:start}
  #tab-goals>.stitle,#tab-goals>.goals-hero,#tab-goals>.savebtn{grid-column:1/-1}

  /* Progress: stats across one row, cards in a two-column grid */
  #tab-progress.active{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;align-items:start}
  #tab-progress>.stitle,#tab-progress>.progress-stats{grid-column:1/-1}
  #tab-progress>.progress-stats{grid-template-columns:repeat(4,1fr) !important}

  /* Comms: comfortable centered column */
  #tab-comms{max-width:860px;margin-left:auto;margin-right:auto}

  /* Check-in: stats + book-call in a sticky left rail, wizard fills the main column */
  #tab-checkin.active{display:grid;grid-template-columns:minmax(300px,360px) minmax(0,1fr);gap:28px;align-items:start}
  #tab-checkin>.stitle{grid-column:1/-1;margin-bottom:0}
  #tab-checkin>.ci-rail{position:sticky;top:164px;min-width:0}
  #tab-checkin>.ci-main{min-width:0}

  /* Handbook: three-up card grid */
  .hb-grid{grid-template-columns:repeat(3,1fr)}

  /* Modals: centered dialogs instead of bottom sheets */
  .hb-modal,.ql-modal,.photo-modal{align-items:center;justify-content:center;padding:28px}
  .hb-modal-inner,.ql-modal-inner,.photo-modal-inner{border-radius:18px;max-width:680px}
  .hb-modal-inner{max-height:82vh}

  /* Quick-log strip + floating button align with the shell */
  .quicklog-strip{padding-left:var(--shellpad);padding-right:var(--shellpad);justify-content:center}
  .quicklog-btn{flex:0 1 280px}
  .wa-fab{right:var(--shellpad)}

  /* Login centered vertically-ish on big screens */
  /* Login centered via flex on all sizes */
}

/* 2026 aesthetic refresh */
html,body{background:radial-gradient(circle at top, rgba(146,210,237,.055), transparent 30%),var(--bg);color:var(--text)}
header,.hero,.goals-prompt,.todaypanel,.comms-card,#loginScreen,.toast{background:linear-gradient(180deg, rgba(255,255,255,.015), rgba(255,255,255,0)), #090d10}
.wbar,.tabs,.nudge-strip,.nut-wbar{background:rgba(10,13,16,.92);backdrop-filter:blur(10px)}
.hicon,.warr,.wtoday,.nut-arr{border-color:var(--border-mid);color:var(--muted);background:rgba(255,255,255,.02)}
.hicon:hover,.warr:hover,.wtoday:hover,.nut-arr:hover{border-color:var(--run-border);color:var(--text)}
.tab{color:var(--dim)}
.tab.active{color:var(--run-strong);border-bottom-color:var(--run)}
.card,.accordion-card,.ci-card,.mc,.pstat,.hb-card,.sc,.comms-card{box-shadow:var(--shadow-soft)}
.card,.accordion-card,.ci-card,.mc,.pstat,.hb-card{background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0)), var(--surface);border-color:var(--border-mid)}
.sc,.todayitem{background:linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,0)), var(--surface);border-color:var(--border)}
.todaypanel{border-color:var(--run-border);box-shadow:var(--shadow-blue)}
.todaytarget,.rpe-box,.sc-nudge,.nutrnote{background:var(--run-bg);border-color:var(--run-border)}
.todaytarget .desc,.goals-sub,.priority-text,.comms-body,.timing-table td,.smeta,.todaymeta,.todayempty,.field-hint,.hb-sub,.photo-cell .photo-label,.angle-slot .aslot-label{color:var(--muted)}
.hi,.hero-week-label,.hp,.goals-label,.goals-saved-badge,.card-title,.ci-lbl,.ml,.pstat-lbl,.accordion-left .accordion-sub,.priority-num,.nudge-strip-sub,.comms-note,.code-hint,.login-eyebrow,.dgdate,.restday{color:var(--dim)}
.todaytitle,.goals-prompt-title,.comms-title,.hb-title,.todayname.run,.sname.run,.hero-week-num,.priority-num{color:var(--run-strong)}
.goals-prompt-btn,.comms-btn,.todaybadge{background:var(--run);color:#051017;box-shadow:0 8px 20px rgba(146,210,237,.22)}
.goals-prompt-btn:active,.comms-btn:active{background:var(--run-strong)}
.stat-input,.why-textarea,.milestone-input{background:rgba(255,255,255,.035);border-color:var(--border-mid)}
.stat-input:focus,.why-textarea:focus,.milestone-input:focus,.photo-cell.current-week,.angle-slot:active,.photo-cell:active{border-color:var(--run);box-shadow:0 0 0 3px rgba(146,210,237,.10)}
.race-opt{border-color:var(--border-mid);color:var(--muted);background:rgba(255,255,255,.015)}
.race-opt.selected{background:var(--run);border-color:var(--run);color:#051017}
.tick{background:rgba(255,255,255,.025);border-color:var(--border-mid)}
.tick.marked{background:var(--surface3);border-color:var(--run-border)}
.tick.on{box-shadow:0 0 0 4px rgba(34,197,94,.12)}
.photo-cell,.angle-slot,.code-box{background:rgba(255,255,255,.02)}
.code-box{border-color:var(--border-mid)}
.code-box.active,.lbtn{border-color:var(--run);color:var(--run-strong)}
.lbtn:hover{background:var(--run);color:#051017}
.login-glow{background:radial-gradient(circle,rgba(146,210,237,0.10),transparent 70%)}

/* Phase 1: today-first command centre + calmer logged-in chrome */
header{background:rgba(6,8,10,.92);backdrop-filter:blur(12px)}
.hero{padding-top:18px;padding-bottom:12px;background:#070a0d}
.hi{color:rgba(247,250,252,.34)}
.wbar{border-top:1px solid rgba(255,255,255,.04);border-bottom:1px solid rgba(255,255,255,.04)}
.tabs{border-top:0;border-bottom:1px solid rgba(255,255,255,.05)}
.nudge-strip{background:rgba(10,13,16,.86);border-color:rgba(255,255,255,.06);padding-top:11px;padding-bottom:11px}
.nudge-strip-icon{opacity:.72}
.nudge-strip-title{color:rgba(247,250,252,.74)}
#checkinNudge{background:rgba(146,210,237,.045);border-top:1px solid rgba(146,210,237,.10);border-bottom:1px solid rgba(146,210,237,.10);box-shadow:none}
#checkinNudge::before{background:rgba(146,210,237,.62)}
#checkinNudge .nudge-strip-icon{background:rgba(146,210,237,.07);border-color:rgba(146,210,237,.18)}
#checkinNudge .nudge-strip-arr{color:rgba(146,210,237,.72)}
.goals-prompt{background:rgba(146,210,237,.045);border-color:rgba(146,210,237,.16);box-shadow:none}
.todaypanel{border-color:rgba(146,210,237,.30);box-shadow:0 18px 56px rgba(0,0,0,.30),0 0 0 1px rgba(146,210,237,.05) inset}
.todayeyebrow{color:rgba(146,210,237,.72)}
.todaytitle{font-size:32px;color:#d8f2fc}
.todayitem{border-color:rgba(255,255,255,.10);background:rgba(255,255,255,.035)}
.todaytarget{background:rgba(146,210,237,.055);border-color:rgba(146,210,237,.14)}
.today-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,.08)}
.today-action{border:1px solid rgba(255,255,255,.12);border-radius:8px;background:rgba(255,255,255,.045);color:rgba(247,250,252,.76);font-family:var(--display);font-size:14px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:10px 12px;cursor:pointer}
.today-action.primary{background:var(--run);border-color:var(--run);color:#041015;box-shadow:0 8px 22px rgba(146,210,237,.18)}
.todayitem.done{border-color:var(--ok-border);background:var(--ok-bg)}
.todayitem.done .todaydot{background:var(--ok)}
.todayitem.done .todayname{color:var(--ok)}
.today-action.completed{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--ok-bg);border-color:var(--ok-border);color:var(--ok);box-shadow:none}
.today-action.completed .icon{width:14px;height:14px}
.today-action.secondary-blue{border-color:rgba(146,210,237,.22);color:rgba(183,230,247,.88);background:rgba(146,210,237,.065)}
.week-plan-title{font-family:var(--mono);font-size:10px;color:rgba(247,250,252,.42);text-transform:uppercase;letter-spacing:.12em;margin:0 0 12px}
.week-plan-shell{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin:0 0 18px;padding:0 0 18px;border-bottom:1px solid rgba(255,255,255,.08)}
.week-plan-kicker{font-family:var(--mono);font-size:9px;color:rgba(146,210,237,.72);text-transform:uppercase;letter-spacing:.16em;margin-bottom:7px}
.week-plan-shell .week-plan-title{font-family:var(--body);font-size:32px;font-weight:600;line-height:.98;color:var(--text);letter-spacing:-.045em;margin:0}
.week-plan-subtitle{margin-top:8px;font-size:14px;line-height:1.58;color:var(--muted);max-width:52ch}
.week-plan-meta{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}
.week-plan-meta span{font-family:var(--mono);font-size:10px;color:rgba(247,250,252,.72);padding:8px 11px;border-radius:999px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08);white-space:nowrap}
.dg{opacity:.88}
.dgh{border-bottom-width:1px;border-bottom-color:rgba(255,255,255,.12)}
.dgh.today{border-bottom-color:rgba(146,210,237,.46)}
.sc{box-shadow:none}
.quicklog-strip{background:rgba(6,8,10,.88);backdrop-filter:blur(12px);border-top-color:rgba(255,255,255,.08);padding-top:8px;padding-bottom:calc(8px + env(safe-area-inset-bottom))}
.quicklog-btn{padding:10px;border-radius:7px;font-size:13px}
.quicklog-btn.ql-body,.quicklog-btn.ql-nut{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.11);color:rgba(247,250,252,.72);box-shadow:none}
.quicklog-btn.ql-nut{border-color:rgba(146,210,237,.24);color:rgba(183,230,247,.88)}
.wa-fab{width:46px;height:46px;background:rgba(146,210,237,.82);box-shadow:0 8px 24px rgba(0,0,0,.34);opacity:.82}
.wa-fab:hover{opacity:1}
@media(max-width:640px){
  .today-actions{grid-template-columns:1fr}
  .todaytitle{font-size:28px}
}

/* v6 graph visibility tuning */
.progress-spotlight,
.graph-spotlight,
.progress-chart-card,
.weight-trend-card{
  border:1px solid rgba(255,255,255,0.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.03) !important;
}

.progress-spotlight canvas,
.graph-spotlight canvas,
.progress-chart-card canvas,
.weight-trend-card canvas,
.progress-spotlight svg,
.graph-spotlight svg,
.progress-chart-card svg,
.weight-trend-card svg{
  filter: brightness(1.12) contrast(1.08);
}

.progress-spotlight .recharts-cartesian-grid line,
.graph-spotlight .recharts-cartesian-grid line,
.progress-chart-card .recharts-cartesian-grid line,
.weight-trend-card .recharts-cartesian-grid line{
  stroke: rgba(255,255,255,0.08) !important;
}

.progress-spotlight .recharts-line-curve,
.graph-spotlight .recharts-line-curve,
.progress-chart-card .recharts-line-curve,
.weight-trend-card .recharts-line-curve{
  stroke: #92d2ed !important;
  stroke-width: 2.5 !important;
  filter: drop-shadow(0 0 6px rgba(146,210,237,0.18));
}

.progress-spotlight .recharts-line-dots circle,
.graph-spotlight .recharts-line-dots circle,
.progress-chart-card .recharts-line-dots circle,
.weight-trend-card .recharts-line-dots circle,
.progress-spotlight .recharts-dot,
.graph-spotlight .recharts-dot,
.progress-chart-card .recharts-dot,
.weight-trend-card .recharts-dot{
  fill: #d8ecf7 !important;
  stroke: #0b1220 !important;
  stroke-width: 1.2 !important;
}

.progress-spotlight .recharts-area-area,
.graph-spotlight .recharts-area-area,
.progress-chart-card .recharts-area-area,
.weight-trend-card .recharts-area-area{
  fill-opacity: 0.12 !important;
}

/* v7 direct chart visibility fix */
.progress-card canvas,
.progress-panel canvas,
.weight-trend canvas,
.weight-trend-card canvas,
.progress-card svg,
.progress-panel svg,
.weight-trend svg,
.weight-trend-card svg{
  filter: brightness(1.22) contrast(1.18) saturate(1.05) !important;
}

.progress-card .chart-wrap,
.progress-panel .chart-wrap,
.weight-trend .chart-wrap,
.weight-trend-card .chart-wrap,
.progress-card .chart-container,
.progress-panel .chart-container,
.weight-trend .chart-container,
.weight-trend-card .chart-container,
.progress-card .graph-wrap,
.progress-panel .graph-wrap,
.weight-trend .graph-wrap,
.weight-trend-card .graph-wrap{
  background:
    linear-gradient(180deg, rgba(146,210,237,0.04) 0%, rgba(146,210,237,0.015) 45%, rgba(0,0,0,0) 100%),
    linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.00)) !important;
  border-radius: 16px;
}

.progress-card .recharts-surface,
.progress-panel .recharts-surface,
.weight-trend .recharts-surface,
.weight-trend-card .recharts-surface{
  overflow: visible !important;
}

.progress-card .recharts-cartesian-grid-horizontal line,
.progress-card .recharts-cartesian-grid-vertical line,
.progress-panel .recharts-cartesian-grid-horizontal line,
.progress-panel .recharts-cartesian-grid-vertical line,
.weight-trend .recharts-cartesian-grid-horizontal line,
.weight-trend .recharts-cartesian-grid-vertical line,
.weight-trend-card .recharts-cartesian-grid-horizontal line,
.weight-trend-card .recharts-cartesian-grid-vertical line{
  stroke: rgba(255,255,255,0.07) !important;
}

.progress-card .recharts-line path.recharts-curve,
.progress-panel .recharts-line path.recharts-curve,
.weight-trend .recharts-line path.recharts-curve,
.weight-trend-card .recharts-line path.recharts-curve{
  stroke: #a8ddf2 !important;
  stroke-width: 2.8 !important;
  filter: drop-shadow(0 0 8px rgba(146,210,237,0.20));
}

.progress-card .recharts-dot,
.progress-panel .recharts-dot,
.weight-trend .recharts-dot,
.weight-trend-card .recharts-dot,
.progress-card .recharts-line-dots circle,
.progress-panel .recharts-line-dots circle,
.weight-trend .recharts-line-dots circle,
.weight-trend-card .recharts-line-dots circle{
  fill: #f3f8fb !important;
  stroke: rgba(146,210,237,0.32) !important;
  stroke-width: 1.5 !important;
  r: 3.2 !important;
}

.progress-card .recharts-area-area,
.progress-panel .recharts-area-area,
.weight-trend .recharts-area-area,
.weight-trend-card .recharts-area-area{
  fill: rgba(146,210,237,0.10) !important;
}

.progress-card,
.progress-panel,
.weight-trend,
.weight-trend-card{
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.03) !important;
}

/* v11 top stat chip readability */
.header-chip,
.hero-chip,
.metric-chip,
.km-chip,
.goal-chip,
.pill,
.badge{
  color: rgba(255,255,255,0.92) !important;
}

.header-chip.goal,
.hero-chip.goal,
.metric-chip.goal,
.km-chip,
.goal-chip{
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.03) !important;
}

.header-chip.goal .label,
.hero-chip.goal .label,
.metric-chip.goal .label,
.km-chip .label,
.goal-chip .label,
.header-chip small,
.hero-chip small,
.metric-chip small,
.km-chip small,
.goal-chip small{
  color: rgba(255,255,255,0.72) !important;
}

.header-chip.goal .value,
.hero-chip.goal .value,
.metric-chip.goal .value,
.km-chip .value,
.goal-chip .value,
.header-chip strong,
.hero-chip strong,
.metric-chip strong,
.km-chip strong,
.goal-chip strong{
  color: #ffffff !important;
}

/* Premium login experience */
:root{
  --dp-logo:url('dp_baby_blue_transparent_512x512.png');
  --dp-wordmark:url('dual_performance_one_line_filled_logo_black_preview.png');
}

#loginScreen{
  min-height:100vh;
  min-height:100svh;
  display:block;
  background:
    radial-gradient(circle at 50% 46%,rgba(146,210,237,.18),rgba(20,77,96,.07) 24%,rgba(4,5,6,0) 48%),
    radial-gradient(circle at 18% 82%,rgba(146,210,237,.055),rgba(4,5,6,0) 34%),
    linear-gradient(180deg,#090d10 0%,#040506 46%,#020303 100%);
  overflow:hidden;
  isolation:isolate;
}

#loginScreen::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(180deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:radial-gradient(circle at center,rgba(0,0,0,.34),transparent 70%);
  opacity:.42;
  pointer-events:none;
  z-index:0;
}

#loginScreen::after{
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(0,0,0,.28),transparent 28%,rgba(0,0,0,.34) 100%),
    radial-gradient(ellipse at center,transparent 38%,rgba(0,0,0,.52) 100%);
  pointer-events:none;
  z-index:1;
}

.login-depth{
  position:absolute;
  left:50%;
  top:48%;
  width:min(780px,130vw);
  height:min(780px,130vw);
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:radial-gradient(circle,rgba(146,210,237,.16),rgba(146,210,237,.055) 34%,transparent 68%);
  filter:blur(6px);
  pointer-events:none;
  z-index:0;
}

.login-grid{
  position:absolute;
  left:50%;
  top:50%;
  width:min(560px,96vw);
  height:min(560px,96vw);
  transform:translate(-50%,-50%) rotate(-12deg);
  border:1px solid rgba(146,210,237,.05);
  border-radius:36px;
  box-shadow:0 0 80px rgba(146,210,237,.04),inset 0 0 80px rgba(146,210,237,.025);
  pointer-events:none;
  z-index:0;
}

.login-wordmark{
  position:absolute;
  left:32px;
  top:28px;
  width:258px;
  height:34px;
  background:var(--dp-wordmark) left center/contain no-repeat;
  opacity:.16;
  filter:grayscale(1);
  pointer-events:none;
  z-index:2;
}

.login-col{
  max-width:430px;
  width:min(430px,calc(100vw - 32px));
  min-height:100vh;
  min-height:100svh;
  margin:0 auto;
  padding:48px 18px;
  justify-content:center;
  gap:0;
  z-index:3;
}

.login-col::before{
  content:'';
  position:absolute;
  left:50%;
  top:50%;
  width:100%;
  height:520px;
  transform:translate(-50%,-50%);
  border:1px solid rgba(146,210,237,.12);
  border-radius:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
  box-shadow:0 22px 90px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.05);
  opacity:.72;
  pointer-events:none;
  z-index:-1;
}

.login-mark-wrap{
  position:relative;
  width:94px;
  height:94px;
  margin:0 auto 20px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.login-mark-wrap::before{
  content:'';
  position:absolute;
  inset:-24px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(146,210,237,.22),rgba(146,210,237,.055) 42%,transparent 70%);
  filter:blur(3px);
}

.login-mark-wrap::after{
  content:'';
  position:absolute;
  inset:10px;
  border-radius:50%;
  border:1px solid rgba(146,210,237,.12);
}

.login-logo-img{
  position:relative;
  width:78px;
  height:78px;
  margin:0;
  background:var(--dp-logo) center/contain no-repeat;
  filter:drop-shadow(0 0 18px rgba(146,210,237,.32));
}

.login-eyebrow{
  font-size:10px;
  letter-spacing:.32em;
  color:rgba(247,250,252,.42);
  margin-bottom:10px;
}

.login-brand{
  max-width:360px;
  font-size:34px;
  font-weight:800;
  letter-spacing:.04em;
  line-height:.95;
  margin-bottom:10px;
}

.login-subcopy{
  max-width:320px;
  margin:0 auto 34px;
  font-size:14px;
  line-height:1.45;
  color:rgba(247,250,252,.58);
}

.code-label{
  font-family:var(--mono);
  font-size:10px;
  line-height:1;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(146,210,237,.74);
  margin-bottom:12px;
}

.code-boxes{
  width:100%;
  gap:8px;
  justify-content:center;
  margin-bottom:18px;
}

.code-box{
  width:56px;
  height:66px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:10px;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.015));
  color:#dff6ff;
  font-family:var(--display);
  font-size:30px;
  font-weight:800;
  line-height:1;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 10px 24px rgba(0,0,0,.18);
  transition:border-color .16s,background .16s,box-shadow .16s,transform .16s,color .16s;
}

.code-box.active{
  border-color:rgba(146,210,237,.9);
  background:rgba(146,210,237,.08);
  box-shadow:0 0 0 1px rgba(146,210,237,.12),0 0 24px rgba(146,210,237,.16),inset 0 1px 0 rgba(255,255,255,.05);
  transform:translateY(-1px);
}

.code-box.filled{
  border-color:rgba(146,210,237,.5);
  background:linear-gradient(180deg,rgba(146,210,237,.18),rgba(146,210,237,.075));
  color:#fff;
}

.code-hidden{
  position:fixed;
  left:-9999px;
  top:0;
  opacity:0;
  pointer-events:none;
}

.login-actions{
  width:100%;
  margin-top:2px;
}

.lbtn{
  position:relative;
  overflow:hidden;
  width:100%;
  min-height:58px;
  background:#92d2ed;
  border:1px solid rgba(183,230,247,.82);
  color:#020506;
  font-size:17px;
  font-weight:800;
  letter-spacing:.18em;
  padding:16px 18px;
  border-radius:10px;
  box-shadow:0 18px 38px rgba(146,210,237,.18),inset 0 1px 0 rgba(255,255,255,.44);
  transition:transform .15s,box-shadow .15s,background .15s,opacity .15s;
}

.lbtn::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(100deg,transparent 0%,rgba(255,255,255,.36) 42%,transparent 58%);
  transform:translateX(-120%);
  transition:transform .55s;
}

.lbtn.ready:hover::after{
  transform:translateX(120%);
}

.lbtn.ready:hover{
  transform:translateY(-1px);
  box-shadow:0 22px 48px rgba(146,210,237,.24),inset 0 1px 0 rgba(255,255,255,.5);
}

.lbtn:disabled{
  cursor:not-allowed;
  opacity:.42;
  box-shadow:none;
  background:rgba(146,210,237,.28);
  border-color:rgba(146,210,237,.28);
  color:rgba(255,255,255,.62);
}

.lbtn.loading{
  opacity:.78;
  cursor:progress;
}

.lerr{
  font-size:11px;
  color:#ff8b8b;
  margin-top:13px;
  letter-spacing:.04em;
}

.login-note{
  margin-top:20px;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(247,250,252,.34);
}

.login-footer{
  position:absolute;
  left:50%;
  bottom:28px;
  transform:translateX(-50%);
  z-index:3;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(247,250,252,.18);
  white-space:nowrap;
}

.login-success{
  position:absolute;
  left:50%;
  top:50%;
  width:min(420px,calc(100vw - 36px));
  transform:translate(-50%,-42%) scale(.98);
  z-index:5;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  opacity:0;
  pointer-events:none;
  transition:opacity .26s ease,transform .32s ease;
}

.login-success-mark{
  width:92px;
  height:92px;
  margin-bottom:22px;
  background:var(--dp-logo) center/contain no-repeat;
  filter:drop-shadow(0 0 28px rgba(146,210,237,.38));
  position:relative;
}

.login-success-mark::after{
  content:'';
  position:absolute;
  inset:-18px;
  border:1px solid rgba(146,210,237,.18);
  border-radius:50%;
  box-shadow:0 0 42px rgba(146,210,237,.14);
}

.login-success-kicker{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:rgba(146,210,237,.74);
  margin-bottom:10px;
}

.login-success-title{
  font-family:var(--display);
  font-size:40px;
  line-height:.95;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#fff;
  margin-bottom:12px;
}

.login-success-sub{
  font-size:14px;
  color:rgba(247,250,252,.58);
  margin-bottom:24px;
}

.login-success-rail{
  width:220px;
  height:3px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.1);
}

.login-success-rail span{
  display:block;
  height:100%;
  width:42%;
  border-radius:999px;
  background:#92d2ed;
  box-shadow:0 0 18px rgba(146,210,237,.42);
  animation:loginRail 1.05s ease-in-out infinite;
}

#loginScreen.login-authed .login-col{
  opacity:0;
  transform:translateY(-12px) scale(.985);
  transition:opacity .22s ease,transform .28s ease;
  pointer-events:none;
}

#loginScreen.login-authed .login-wordmark,
#loginScreen.login-authed .login-footer{
  opacity:.08;
}

#loginScreen.login-authed .login-success{
  opacity:1;
  transform:translate(-50%,-50%) scale(1);
}

@keyframes loginRail{
  0%{transform:translateX(-110%)}
  55%,100%{transform:translateX(250%)}
}

.login-error-shake .code-box{
  border-color:rgba(248,113,113,.68);
  background:rgba(248,113,113,.07);
  color:#fff;
}

.login-error-shake{
  animation:loginShake .34s ease;
}

@keyframes loginShake{
  0%,100%{transform:translateX(0)}
  20%{transform:translateX(-7px)}
  40%{transform:translateX(7px)}
  60%{transform:translateX(-5px)}
  80%{transform:translateX(5px)}
}

@media(max-width:700px){
  .login-wordmark{display:none}
  #loginScreen{
    background:
      radial-gradient(circle at 50% 34%,rgba(146,210,237,.18),rgba(20,77,96,.07) 26%,rgba(4,5,6,0) 55%),
      linear-gradient(180deg,#080c0f 0%,#040506 56%,#020303 100%);
  }
  .login-col{
    width:100%;
    min-height:100svh;
    padding:34px 18px 46px;
    justify-content:center;
  }
  .login-col::before{
    width:calc(100vw - 24px);
    height:500px;
    border-radius:16px;
    opacity:.58;
  }
  .login-mark-wrap{
    width:82px;
    height:82px;
    margin-bottom:16px;
  }
  .login-logo-img{
    width:68px;
    height:68px;
  }
  .login-brand{
    font-size:30px;
  }
  .login-subcopy{
    font-size:13px;
    margin-bottom:28px;
  }
  .code-boxes{
    gap:6px;
  }
  .code-box{
    width:calc((100vw - 72px) / 6);
    max-width:52px;
    min-width:42px;
    height:62px;
    font-size:28px;
    border-radius:9px;
  }
  .lbtn{
    min-height:56px;
    font-size:16px;
  }
  .login-footer{
    bottom:18px;
    font-size:8px;
    letter-spacing:.12em;
  }
  #loginScreen.keyboard-open{
    overflow:auto;
  }
  #loginScreen.keyboard-open .login-col{
    min-height:auto;
    justify-content:flex-start;
    padding-top:14px;
    padding-bottom:18px;
  }
  #loginScreen.keyboard-open .login-col::before{
    top:8px;
    height:360px;
    transform:translateX(-50%);
  }
  #loginScreen.keyboard-open .login-depth{
    top:185px;
    width:520px;
    height:520px;
  }
  #loginScreen.keyboard-open .login-grid{
    top:190px;
    width:390px;
    height:390px;
  }
  #loginScreen.keyboard-open .login-mark-wrap{
    width:54px;
    height:54px;
    margin-bottom:8px;
  }
  #loginScreen.keyboard-open .login-logo-img{
    width:46px;
    height:46px;
  }
  #loginScreen.keyboard-open .login-eyebrow{
    font-size:8px;
    margin-bottom:5px;
  }
  #loginScreen.keyboard-open .login-brand{
    font-size:24px;
    margin-bottom:5px;
  }
  #loginScreen.keyboard-open .login-subcopy{
    display:none;
  }
  #loginScreen.keyboard-open .code-label{
    margin-top:12px;
    margin-bottom:8px;
  }
  #loginScreen.keyboard-open .code-boxes{
    margin-bottom:12px;
  }
  #loginScreen.keyboard-open .code-box{
    height:52px;
    font-size:24px;
  }
  #loginScreen.keyboard-open .lbtn{
    min-height:48px;
    font-size:14px;
  }
  #loginScreen.keyboard-open .login-note,
  #loginScreen.keyboard-open .login-footer{
    display:none;
  }
  .login-success-title{
    font-size:32px;
  }
  .login-success-mark{
    width:78px;
    height:78px;
  }
}

@media(max-height:680px){
  .login-col{
    padding-top:24px;
    padding-bottom:24px;
  }
  .login-mark-wrap{
    margin-bottom:12px;
  }
  .login-subcopy{
    margin-bottom:20px;
  }
  .login-footer{
    display:none;
  }
}
/* ============================================================
   DP ICON SYSTEM — append to styles.css
   Usage: <svg class="icon"><use href="#i-calendar"/></svg>
   Icons inherit text colour via currentColor.
   Add .icon-run for the #92d2ed accent.
   ============================================================ */

.icon{
  width:1em;height:1em;
  stroke:currentColor;fill:none;
  stroke-width:1.75;
  stroke-linecap:round;stroke-linejoin:round;
  vertical-align:-0.14em;
  flex-shrink:0;
}

/* Sizes */
.icon-sm{width:14px;height:14px}
.icon-md{width:18px;height:18px}
.icon-lg{width:24px;height:24px}

/* Colours */
.icon-run{color:var(--run)}          /* accent #92d2ed */
.icon-muted{color:var(--muted)}
.icon-dim{color:var(--dim)}
.icon-ok{color:var(--ok)}
.icon-pb{color:var(--pb)}

/* Context defaults — existing containers pick up the right size/colour
   without touching each call site */
.nudge-strip-icon .icon{width:20px;height:20px;color:var(--run)}
.nudge-strip-arr  .icon{width:15px;height:15px;color:var(--dim)}
.hb-icon .icon{width:24px;height:24px;color:var(--run)}
.ci-step-title .icon{width:17px;height:17px;color:var(--run);margin-right:6px}
.quicklog-btn .icon{width:16px;height:16px;color:var(--run);margin-right:7px}
.warr .icon{width:15px;height:15px;color:var(--muted)}

/* ============================================================
   V12 — QUIETER HIERARCHY, MOBILE NAVIGATION & OUTDOOR MODE
   ============================================================ */
:root{
  --surface:#0f1316;--surface2:#151a1e;--surface3:#1b2227;
  --border:rgba(255,255,255,.075);--border-mid:rgba(255,255,255,.13);
  --muted:rgba(247,250,252,.76);--dim:rgba(247,250,252,.56);
}
body{font-size:15px;line-height:1.55}
.card,.sc,.ci-card,.mc,.hb-card,.accordion-card,.progress-stat{border-color:rgba(255,255,255,.07);box-shadow:none}
.card{padding:20px;border-radius:14px;margin-bottom:16px}
.card-title,.stitle,.week-plan-title{text-transform:none;letter-spacing:-.01em}
.card-title{font-family:var(--body);font-size:16px;font-weight:600}
.stitle{font-family:var(--body);font-size:30px;font-weight:600;line-height:1.15;margin-bottom:22px}
.field-hint,.hb-sub,.priority-text,.comms-body,.todaymeta,.todayempty,.smeta{font-size:14px;color:var(--muted)}
.tab-content{padding-top:24px}
.tab{font-family:var(--body);font-size:13px;font-weight:600;text-transform:none;letter-spacing:0;color:var(--dim)}
.tab.active{color:var(--text)}
.hicon{font-family:var(--body);text-transform:none;letter-spacing:0}
.theme-toggle{display:inline-flex;align-items:center;gap:6px}
.theme-toggle .icon{width:13px;height:13px}

/* Accent is reserved for action, active state, and progress. */
.tab-content.active>.stitle{margin-top:4px}
.tab-content.active>.page-intro+.stitle{margin-top:2px}
#tab-goals>.stitle,#tab-checkin>.stitle,#tab-progress>.stitle,#tab-handbook>.stitle,#tab-comms>.stitle{display:none}
.todaytitle,.todayname.run,.sname.run,.hero-week-num,.hb-title,.goals-prompt-title,.comms-title{color:var(--text)}
.todaypanel{background:var(--surface);border-color:rgba(255,255,255,.08);box-shadow:0 18px 50px rgba(0,0,0,.24);padding:22px;border-radius:18px}
.todayeyebrow{color:var(--run);font-size:10px}
.todayhead{align-items:flex-start;margin-bottom:18px}
.todaytitle{font-family:var(--body);font-size:32px;font-weight:600;text-transform:none;letter-spacing:-.035em}
.today-subtitle{color:var(--muted);font-size:14px;margin-top:5px}
.todaydate{font-size:11px;color:var(--dim)}
.todayitem{background:rgba(255,255,255,.022);border-color:rgba(255,255,255,.07);padding:18px;border-radius:14px}
.todayname{font-family:var(--body);font-size:21px;font-weight:600;text-transform:none;letter-spacing:-.01em}
.todaytarget{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.07);padding:14px}
.todaytarget .value{font-family:var(--body);font-size:17px;font-weight:600;text-transform:none;color:var(--text)}
.todaytarget .desc{font-size:14px;line-height:1.55;color:var(--muted)}
.todaychip{background:rgba(255,255,255,.055);border:0;color:var(--muted);padding:6px 9px}
.today-action.primary,.savebtn,.ci-btn-next,.save-run-btn,.comms-btn,.goals-prompt-btn{background:var(--run);color:#061117;border-color:var(--run);font-weight:700}
.today-action.secondary-blue{background:transparent;border-color:var(--border-mid);color:var(--text)}
.today-actions{gap:8px}

.coach-moment{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:13px;padding:14px 0 18px;margin-bottom:18px;border-bottom:1px solid var(--border)}
.coach-avatars{display:flex;padding-left:6px}
.coach-avatars span{width:34px;height:34px;margin-left:-6px;border-radius:50%;display:grid;place-items:center;background:#20282d;border:2px solid var(--surface);font-weight:700;font-size:12px;color:var(--text)}
.coach-avatars span:last-child{background:#182b35;color:var(--run-strong)}
.coach-moment-label{font-size:12px;font-weight:600;color:var(--text);margin-bottom:2px}
.coach-moment p{margin:0;color:var(--muted);font-size:13px;line-height:1.45}
.coach-moment button{width:36px;height:36px;border-radius:50%;border:1px solid var(--border-mid);background:transparent;color:var(--muted);display:grid;place-items:center;cursor:pointer}
.coach-moment button .icon{width:16px;height:16px}
.session-why{display:flex;gap:9px;margin-top:12px;padding-top:12px;border-top:1px solid var(--border);font-size:13px;color:var(--muted);line-height:1.45}
.session-why>.icon{width:16px;height:16px;color:var(--dim);margin-top:2px}
.session-why span{display:block;color:var(--text);font-weight:600;margin-bottom:2px}

.insight-rail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:18px}
.insight-card{min-width:0;display:flex;align-items:center;gap:10px;padding:12px;background:rgba(255,255,255,.025);border:1px solid var(--border);border-radius:12px}
.insight-card>div:last-child{min-width:0}
.insight-card span{display:block;color:var(--text);font-size:12px;font-weight:600;white-space:nowrap}
.insight-card small{display:block;color:var(--dim);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.insight-card-button{position:relative;width:100%;padding-right:26px;color:inherit;text-align:left;font:inherit;cursor:pointer;appearance:none;transition:border-color .16s,background .16s,transform .12s}
.insight-card-button::after{content:"›";position:absolute;right:10px;top:50%;transform:translateY(-52%);color:var(--dim);font-size:20px;font-weight:400;line-height:1;transition:transform .16s,color .16s}
.insight-card-button:hover{border-color:var(--border-mid);background:rgba(255,255,255,.045)}
.insight-card-button:hover::after{color:var(--run);transform:translate(2px,-52%)}
.insight-card-button:active{transform:scale(.985)}
.insight-ring{--value:0;width:42px;height:42px;flex:0 0 42px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle closest-side,var(--surface) 73%,transparent 75%),conic-gradient(var(--run) calc(var(--value)*1%),rgba(255,255,255,.08) 0)}
.insight-ring strong{font-size:10px;color:var(--text)}
.insight-ring.readiness{background:radial-gradient(circle closest-side,var(--surface) 73%,transparent 75%),conic-gradient(#8fd0ab calc(var(--value)*1%),rgba(255,255,255,.08) 0)}
.insight-pb{width:42px;height:42px;flex:0 0 42px;border-radius:50%;display:grid;grid-template-columns:auto auto;place-content:center;gap:3px;background:rgba(255,255,255,.05)}
.insight-pb .icon{width:12px;height:12px;color:var(--dim)}
.insight-pb strong{font-size:12px}
.insight-viz{width:80px;flex:0 0 80px;display:flex;flex-direction:column;justify-content:center;position:relative}
.mini-spark{width:80px;height:28px;display:block}
.mini-spark polyline{fill:none;stroke:var(--text);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.insight-delta{position:static;text-align:center;line-height:1;margin-top:-2px;font-size:9px!important;color:var(--dim)!important}
.insight-empty{font-size:9px!important;color:var(--dim)!important;white-space:normal!important}
.milestone-celebration{display:flex;gap:11px;align-items:center;margin:-4px 0 18px;padding:13px 14px;border-radius:12px;background:rgba(34,197,94,.07);border:1px solid rgba(34,197,94,.18)}
.milestone-celebration>.icon{width:20px;height:20px;color:#74d99a}
.milestone-celebration strong,.milestone-celebration span{display:block}.milestone-celebration strong{font-size:13px}.milestone-celebration span{font-size:12px;color:var(--muted)}
.card,.accordion-card,.ci-card,.mc,.pstat,.hb-card{border-radius:14px}
.card-title{display:flex;align-items:center;justify-content:space-between;gap:10px}
.stat-grid,.milestone-grid,.progress-stats,.macro-grid,.hb-grid,.ci-grid{gap:12px}
.goals-hero,.comms-card{border-radius:20px}
.goals-sub,.comms-body{max-width:58ch}
.hb-card{position:relative;overflow:hidden}
.hb-card::after{content:"";position:absolute;inset:auto 18px 0 18px;height:1px;background:linear-gradient(90deg,transparent,rgba(146,210,237,.35),transparent);opacity:.28}
.ci-rail>div[id="ciBookCard"]{border-radius:16px!important}
.progress-stats .pstat,.macro-grid .mc,.ci-grid .ci-card{background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.08)}
.nutrnote{border-radius:12px}
.timing-table{border:1px solid var(--border);border-radius:14px;overflow:hidden;background:rgba(255,255,255,.02)}
.timing-table thead{background:rgba(255,255,255,.03)}
.priority-item{padding:10px 0;border-top:1px solid rgba(255,255,255,.06)}
.priority-item:first-child{padding-top:0;border-top:0}
.priority-item:last-child{padding-bottom:0}
.more-menu-head{border-bottom-color:rgba(255,255,255,.08)}

.mobile-nav,.more-menu{display:none}

/* Consistent keyboard affordances without distracting pointer users. */
:where(button,a,input,textarea,select,[tabindex]):focus-visible{outline:3px solid var(--run);outline-offset:3px}

/* High contrast, daylight-friendly mode. */
.outdoor-mode{
  --bg:#f5f7f8;--surface:#ffffff;--surface2:#edf1f3;--surface3:#e6ecef;
  --text:#071116;--muted:rgba(7,17,22,.75);--dim:rgba(7,17,22,.58);
  --border:rgba(7,17,22,.12);--border-mid:rgba(7,17,22,.22);--border-strong:rgba(7,17,22,.38);
  --run:#087fae;--run-strong:#075f82;--run-bg:rgba(8,127,174,.08);--run-border:rgba(8,127,174,.25);
  --rest:rgba(7,17,22,.5);
  --strength:#40515a;--strength-bg:rgba(7,17,22,.05);--strength-border:rgba(7,17,22,.18);
}
.outdoor-mode body,.outdoor-mode #portalScreen{background:var(--bg);color:var(--text)}
.outdoor-mode .top-shell{background:linear-gradient(180deg,#edf3f5,#f5f8f9);border-bottom-color:var(--border)}
.outdoor-mode header,.outdoor-mode .hero,.outdoor-mode .wbar,.outdoor-mode .tabs,.outdoor-mode .quicklog-strip,.outdoor-mode .mobile-nav{background:rgba(255,255,255,.94);color:var(--text);border-color:var(--border)}
.outdoor-mode .todaypanel,.outdoor-mode .card,.outdoor-mode .sc,.outdoor-mode .todayitem,.outdoor-mode .mc,.outdoor-mode .ci-card,.outdoor-mode .hb-card,.outdoor-mode .accordion-card{background:var(--surface);color:var(--text);border-color:var(--border);box-shadow:0 8px 24px rgba(7,17,22,.06)}
.outdoor-mode .todaytarget,.outdoor-mode .insight-card{background:var(--surface2);border-color:var(--border)}
.outdoor-mode .page-intro{background:#fff;border-color:var(--border);box-shadow:0 16px 34px rgba(30,55,67,.08)}
.outdoor-mode .page-intro::before{background:linear-gradient(90deg,transparent,var(--run),transparent)}
.outdoor-mode .page-kicker{color:var(--run-strong)}
.outdoor-mode .page-title{color:var(--text)}
.outdoor-mode .page-copy{color:var(--muted)}
.outdoor-mode .logo-text,.outdoor-mode .hicon,.outdoor-mode .tab,.outdoor-mode .warr,.outdoor-mode .wtoday{color:var(--text)}
.outdoor-mode .insight-ring{background:radial-gradient(circle closest-side,var(--surface) 73%,transparent 75%),conic-gradient(var(--run) calc(var(--value)*1%),rgba(7,17,22,.1) 0)}
.outdoor-mode .insight-ring.readiness{background:radial-gradient(circle closest-side,var(--surface) 73%,transparent 75%),conic-gradient(#23804b calc(var(--value)*1%),rgba(7,17,22,.1) 0)}
.outdoor-mode .theme-switch{background:var(--run)}

/* Complete daylight theme: override legacy dark-only component colours. */
.outdoor-mode body{background:var(--bg)}
.outdoor-mode header{box-shadow:0 1px 0 var(--border)}
.outdoor-mode .logo-text .d,.outdoor-mode .logo-text .p{color:var(--text)}
.outdoor-mode .hero{background:#fff!important;border-bottom:1px solid var(--border)}
.outdoor-mode .hi,.outdoor-mode .hero-week-label,.outdoor-mode .hp{color:var(--dim)!important}
.outdoor-mode .hn,.outdoor-mode .wlabel,.outdoor-mode .nut-wlabel{color:var(--text)!important}
.outdoor-mode .hero-week-num,.outdoor-mode .hp span{color:var(--run-strong)!important}
.outdoor-mode .hp,.outdoor-mode #dp-strava-btn{background:var(--surface2)!important;border-color:var(--border)!important;color:var(--text)!important;box-shadow:none!important}

.outdoor-mode .nudge-strip,.outdoor-mode #checkinNudge,.outdoor-mode #callNudge,.outdoor-mode #callConfirmedNudge,.outdoor-mode #photoNudge{background:var(--surface)!important;border-color:var(--border)!important;box-shadow:none!important}
.outdoor-mode .nudge-strip-title,.outdoor-mode #checkinNudge .nudge-strip-title,.outdoor-mode #callConfirmedTitle{color:var(--text)!important}
.outdoor-mode .nudge-strip-sub,.outdoor-mode #checkinNudge .nudge-strip-sub{color:var(--muted)!important}
.outdoor-mode .nudge-strip-icon{opacity:1}
.outdoor-mode #checkinNudge::before{background:var(--run)}
.outdoor-mode #checkinNudge .nudge-strip-icon{background:var(--run-bg);border-color:var(--run-border)}

.outdoor-mode .todaypanel{box-shadow:0 10px 30px rgba(7,17,22,.08)}
.outdoor-mode .todayeyebrow,.outdoor-mode .todaydate{color:var(--dim)}
.outdoor-mode .todaytitle,.outdoor-mode .todayname,.outdoor-mode .todayname.run,.outdoor-mode .todayname.strength,.outdoor-mode .todayname.note,.outdoor-mode .sname,.outdoor-mode .sname.run,.outdoor-mode .sname.strength,.outdoor-mode .sname.note{color:var(--text)!important}
.outdoor-mode .todaymeta,.outdoor-mode .smeta,.outdoor-mode .todaytarget .label,.outdoor-mode .week-plan-title,.outdoor-mode .dgdate,.outdoor-mode .restday{color:var(--dim)!important}
.outdoor-mode .todaytarget .value,.outdoor-mode .session-why span{color:var(--text)}
.outdoor-mode .todaytarget .desc,.outdoor-mode .session-why,.outdoor-mode .coach-moment p{color:var(--muted)}
.outdoor-mode .coach-avatars span{background:#e1e8eb;border-color:#fff;color:var(--text)}
.outdoor-mode .coach-avatars span:last-child{background:#d8edf5;color:var(--run-strong)}
.outdoor-mode .coach-moment button{background:#fff;border-color:var(--border);color:var(--text)}
.outdoor-mode .insight-pb,.outdoor-mode .todaychip{background:rgba(7,17,22,.055);color:var(--text)}
.outdoor-mode .today-actions{border-top-color:var(--border)}
.outdoor-mode .today-action{background:#fff;border-color:var(--border-mid);color:var(--text)}
.outdoor-mode .today-action.secondary-blue{background:#fff;border-color:var(--border-mid);color:var(--text)}
.outdoor-mode .today-action.primary,.outdoor-mode .savebtn,.outdoor-mode .ci-btn-next,.outdoor-mode .save-run-btn,.outdoor-mode .comms-btn,.outdoor-mode .goals-prompt-btn{background:var(--run);border-color:var(--run);color:#fff}
.outdoor-mode .todaydot.run,.outdoor-mode .todaydot.note,.outdoor-mode .dot-run,.outdoor-mode .dot-note{background:var(--run)}
.outdoor-mode .todaydot.strength,.outdoor-mode .dot-strength{background:#40515a}
.outdoor-mode .dgh{border-bottom-color:var(--border)}
.outdoor-mode .dgh.today{border-bottom-color:var(--run)}
.outdoor-mode .todaybadge{background:var(--run);color:#fff}

.outdoor-mode .goals-prompt,.outdoor-mode .goals-hero,.outdoor-mode .comms-card,.outdoor-mode .nut-wbar{background:var(--surface)!important;border-color:var(--border)!important;color:var(--text)}
.outdoor-mode .goals-prompt-title,.outdoor-mode .goals-name,.outdoor-mode .comms-title{color:var(--text)!important}
.outdoor-mode .goals-prompt-sub,.outdoor-mode .goals-sub,.outdoor-mode .comms-body,.outdoor-mode .comms-note{color:var(--muted)!important}
.outdoor-mode .stat-input,.outdoor-mode .why-textarea,.outdoor-mode .milestone-input,.outdoor-mode .li,.outdoor-mode .sin,.outdoor-mode .rpe-in,.outdoor-mode select{background:#fff!important;border-color:var(--border-mid)!important;color:var(--text)!important}
.outdoor-mode .exc{background:#eef2f4;border-color:rgba(7,17,22,.24);box-shadow:0 2px 8px rgba(7,17,22,.05)}
.outdoor-mode .exn{color:#071116}
.outdoor-mode .exm,.outdoor-mode .slbl,.outdoor-mode .snum,.outdoor-mode .plate-calc-label,.outdoor-mode .ex-picker-label{color:rgba(7,17,22,.72)}
.outdoor-mode .exnotes{color:#075f82;font-weight:700}
.outdoor-mode .sin,.outdoor-mode .rpe-in{-webkit-text-fill-color:#071116!important;font-weight:700;box-shadow:0 1px 2px rgba(7,17,22,.04)}
.outdoor-mode .sin::placeholder,.outdoor-mode .rpe-in::placeholder{color:rgba(7,17,22,.48);-webkit-text-fill-color:rgba(7,17,22,.48)}
.outdoor-mode .prev-effort{color:#334750;background:#fff;border-color:rgba(7,17,22,.2)}
.outdoor-mode .prev-effort.has-last{color:#075f82;background:#e2f2f8;border-color:rgba(8,127,174,.34);font-weight:700}
.outdoor-mode .suggested-load{color:#176c3c;background:#e4f5eb;border-color:rgba(23,108,60,.34);font-weight:700}
.outdoor-mode .ex-stat-pb{color:#5a35a5;background:#eee8ff;border-color:rgba(90,53,165,.35)}
.outdoor-mode .ex-stat-vol-pb{color:#0c6b73;background:#ccf7f4;border-color:rgba(12,107,115,.42)}
.outdoor-mode .ex-stat-e1rm{color:#334750}
.outdoor-mode .ex-stat-vol{color:#075f82;background:#dff1f8;border-color:rgba(8,127,174,.32)}
.outdoor-mode .ex-stat-vol.pb{color:#04302a;background:#7fe6d2;border-color:#0d9488;box-shadow:0 0 0 1px rgba(13,148,136,.5),0 0 14px rgba(13,148,136,.45);animation:vpbglowLight 1.8s ease-in-out infinite}
.outdoor-mode .setrow.has-pb .sin,.outdoor-mode .setrow-single.has-pb .sin{border-color:#6d28d9;background:#dccdff;color:#4c1d95;-webkit-text-fill-color:#4c1d95;box-shadow:inset 0 0 13px rgba(124,58,237,.55),0 0 10px rgba(124,58,237,.4);animation:pbglowLight 1.8s ease-in-out infinite}
.outdoor-mode .ex-pill{background:#fff;border-color:rgba(7,17,22,.25);color:#334750}
.outdoor-mode .ex-pill.active{background:#087fae;border-color:#087fae;color:#fff}
.outdoor-mode .ex-pill-more{color:#4a626c}
.outdoor-mode .ex-pill-more.is-swapped{border-color:#087fae;color:#087fae}
.outdoor-mode .ex-pill-more.is-swapped::after{background:rgba(8,127,174,.12)}
.outdoor-mode .ex-swaps{background:rgba(255,255,255,.72);border-color:rgba(7,17,22,.18)}
.outdoor-mode .ex-swaps-note strong{color:#087fae}
.outdoor-mode .ex-swaps-note span,.outdoor-mode .ex-swap-group-label{color:rgba(7,17,22,.72)}
.outdoor-mode .swap-churn-note{background:rgba(255,170,0,.14);border-color:rgba(150,100,0,.4)}
.outdoor-mode .swap-churn-badge{color:#8a5a00;border-color:rgba(150,100,0,.45)}
.outdoor-mode .swap-churn-note span:not(.swap-churn-badge){color:rgba(7,17,22,.72)}
.outdoor-mode .muscle-coverage{background:rgba(255,255,255,.72);border-color:rgba(7,17,22,.18)}
.outdoor-mode .mcov-title,.outdoor-mode .mcov-gap{color:rgba(7,17,22,.72)}
.outdoor-mode .mcov-sum{color:#087fae}
.outdoor-mode .mcov-chip{background:#fff;border-color:rgba(7,17,22,.25);color:#334750}
.outdoor-mode .mcov-chip.is-done{border-color:#087fae;color:#087fae}
.outdoor-mode .mcov-chip.is-partial{border-color:#8a5a00;color:#8a5a00}
.outdoor-mode .plate-pill{background:#fff;border-color:rgba(7,17,22,.22);color:#334750}
.outdoor-mode .st{background:#fff;border-color:rgba(7,17,22,.3)}
.outdoor-mode .st.on{background:#23804b;border-color:#23804b}
.outdoor-mode .race-opt,.outdoor-mode .tick,.outdoor-mode .quicklog-btn.ql-body,.outdoor-mode .quicklog-btn.ql-nut{background:#fff;border-color:var(--border-mid);color:var(--text)}
.outdoor-mode .race-opt.selected,.outdoor-mode .tick.on{background:var(--run);border-color:var(--run);color:#fff}

/* Contrast audit: accents, values and labels that kept dark-theme colours */
.outdoor-mode .tab.active{color:var(--run-strong);border-bottom-color:var(--run)}
.outdoor-mode .sname.rest,.outdoor-mode .todayname.rest{color:var(--dim)!important}
.outdoor-mode .dot-rest{background:rgba(7,17,22,.35)}
.outdoor-mode .ci-card.lift .ci-val{color:var(--strength)}
.outdoor-mode .goals-prompt-label{color:var(--run-strong)}
.outdoor-mode .sc-nudge{color:var(--run-strong);background:var(--run-bg);border-top-color:var(--run-border)}
.outdoor-mode .nudge-strip-arr,.outdoor-mode #checkinNudge .nudge-strip-arr{color:var(--run-strong)!important}
.outdoor-mode .hicon-dot,.outdoor-mode .tab-dot{background:var(--run)}
.outdoor-mode .hicon-goals,.outdoor-mode .hicon-accent{border-color:var(--run-border);color:var(--run-strong)}
.outdoor-mode .hicon-goals:hover{border-color:var(--run);color:var(--run)}
.outdoor-mode .priority-num{background:var(--run-bg);color:var(--run-strong);border-color:var(--run-border)}
.outdoor-mode .rest-timer{background:#fff;border-color:rgba(8,127,174,.24);box-shadow:0 3px 10px rgba(7,17,22,.05),inset 0 1px 0 rgba(255,255,255,.9)}
.outdoor-mode .rest-pref-toggle{background:#fff;border-color:var(--border)}
.outdoor-mode .rest-pref-toggle.is-on{background:rgba(8,127,174,.06);border-color:rgba(8,127,174,.28)}
.outdoor-mode .rest-pref-toggle.is-on strong{color:var(--run-strong)}
.outdoor-mode .rest-pref-toggle.is-on .rest-pref-dot{background:var(--run-strong);box-shadow:0 0 0 3px rgba(8,127,174,.1)}
.outdoor-mode .rt-count{color:var(--run-strong)}
.outdoor-mode .rt-label{color:var(--dim)}
.outdoor-mode .rt-wrap{background:rgba(7,17,22,.11)}
.outdoor-mode .rt-fill{background:linear-gradient(90deg,var(--run),#39a7ce);box-shadow:none}
.outdoor-mode .rt-skip{background:var(--surface2);border-color:var(--border-mid);color:var(--muted)}
.outdoor-mode .rt-skip:hover{background:var(--surface3);border-color:var(--border-strong);color:var(--text)}
.outdoor-mode .photo-cell.has-photo .photo-overlay{color:#bfe6f5}

/* v11 stat chips force white text/bg with !important - flip them for daylight */
.outdoor-mode .header-chip,.outdoor-mode .hero-chip,.outdoor-mode .metric-chip,.outdoor-mode .km-chip,.outdoor-mode .goal-chip,.outdoor-mode .pill,.outdoor-mode .badge{color:var(--text)!important}
.outdoor-mode .header-chip.goal,.outdoor-mode .hero-chip.goal,.outdoor-mode .metric-chip.goal,.outdoor-mode .km-chip,.outdoor-mode .goal-chip{background:var(--surface2)!important;border-color:var(--border)!important;box-shadow:none!important}
.outdoor-mode .header-chip.goal .label,.outdoor-mode .hero-chip.goal .label,.outdoor-mode .metric-chip.goal .label,.outdoor-mode .km-chip .label,.outdoor-mode .goal-chip .label,.outdoor-mode .header-chip small,.outdoor-mode .hero-chip small,.outdoor-mode .metric-chip small,.outdoor-mode .km-chip small,.outdoor-mode .goal-chip small{color:var(--dim)!important}
.outdoor-mode .header-chip.goal .value,.outdoor-mode .hero-chip.goal .value,.outdoor-mode .metric-chip.goal .value,.outdoor-mode .km-chip .value,.outdoor-mode .goal-chip .value,.outdoor-mode .header-chip strong,.outdoor-mode .hero-chip strong,.outdoor-mode .metric-chip strong,.outdoor-mode .km-chip strong,.outdoor-mode .goal-chip strong{color:var(--text)!important}

/* Weight-trend charts: white dots/pale line/white grid vanish on white cards */
.outdoor-mode .progress-card .recharts-cartesian-grid-horizontal line,.outdoor-mode .progress-card .recharts-cartesian-grid-vertical line,.outdoor-mode .progress-panel .recharts-cartesian-grid-horizontal line,.outdoor-mode .progress-panel .recharts-cartesian-grid-vertical line,.outdoor-mode .weight-trend .recharts-cartesian-grid-horizontal line,.outdoor-mode .weight-trend .recharts-cartesian-grid-vertical line,.outdoor-mode .weight-trend-card .recharts-cartesian-grid-horizontal line,.outdoor-mode .weight-trend-card .recharts-cartesian-grid-vertical line{stroke:rgba(7,17,22,.1)!important}
.outdoor-mode .progress-card .recharts-line path.recharts-curve,.outdoor-mode .progress-panel .recharts-line path.recharts-curve,.outdoor-mode .weight-trend .recharts-line path.recharts-curve,.outdoor-mode .weight-trend-card .recharts-line path.recharts-curve{stroke:var(--run)!important;filter:none}
.outdoor-mode .progress-card .recharts-dot,.outdoor-mode .progress-panel .recharts-dot,.outdoor-mode .weight-trend .recharts-dot,.outdoor-mode .weight-trend-card .recharts-dot,.outdoor-mode .progress-card .recharts-line-dots circle,.outdoor-mode .progress-panel .recharts-line-dots circle,.outdoor-mode .weight-trend .recharts-line-dots circle,.outdoor-mode .weight-trend-card .recharts-line-dots circle{fill:#fff!important;stroke:var(--run)!important}
.outdoor-mode .progress-card .recharts-area-area,.outdoor-mode .progress-panel .recharts-area-area,.outdoor-mode .weight-trend .recharts-area-area,.outdoor-mode .weight-trend-card .recharts-area-area{fill:rgba(8,127,174,.08)!important}
.outdoor-mode .progress-card .graph-wrap,.outdoor-mode .progress-panel .graph-wrap,.outdoor-mode .weight-trend .graph-wrap,.outdoor-mode .weight-trend-card .graph-wrap,.outdoor-mode .weight-trend-card .chart-container{background:var(--surface2)!important}

/* Rest timer text (timer strip is a light surface in daylight) */
.outdoor-mode .rt-label{color:var(--dim)}
.outdoor-mode .rt-skip{color:var(--text)}

.outdoor-mode .mobile-nav{background:rgba(255,255,255,.97);box-shadow:0 12px 36px rgba(7,17,22,.16)}
.outdoor-mode .mobile-nav-item{color:var(--dim)}
.outdoor-mode .mobile-nav-item.active{color:var(--run)}
.outdoor-mode .more-menu-sheet{background:var(--surface);color:var(--text)}
.outdoor-mode .more-menu-grid button,.outdoor-mode .more-outdoor{background:var(--surface2);border-color:var(--border);color:var(--text)}
.outdoor-mode .wa-fab{background:var(--run);opacity:1}.outdoor-mode .wa-fab svg{fill:#fff}
.outdoor-mode .toast{background:#101b20;color:#fff}

@media(max-width:760px){
  body{font-size:16px}
  header{padding-left:14px;padding-right:14px}
  .header-actions .hicon-goals,.header-actions .hicon-desktop{display:none}
  .theme-toggle{height:34px;padding:0 10px;font-size:11px}
  .tabs{display:none}
  .hero{padding:22px 16px 18px}.hi{font-size:10px}.hn{font-size:40px}
  .tab-content{padding:20px 14px 210px}
  .page-intro{padding:16px 16px 15px;border-radius:16px}
  .page-title{font-size:26px;max-width:none}
  .page-copy{font-size:13px;max-width:none}
  .todaypanel{padding:19px 16px;border-radius:16px}
  .todaytitle{font-size:28px}.todaydate{padding-top:4px}
  .coach-moment{align-items:start}.coach-moment p{font-size:14px}
  .insight-rail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;overflow:visible;margin:0 0 18px;padding:0}
  .insight-card{min-width:0;padding:11px 10px;gap:8px}
  .insight-card.bodyweight{min-width:0}
  .insight-viz{width:54px;flex-basis:54px}
  .mini-spark{width:54px;height:22px}
  .today-actions{grid-template-columns:1fr 1fr}
  .quicklog-strip{display:grid!important;grid-template-columns:1fr 1fr;left:10px;right:10px;bottom:calc(82px + env(safe-area-inset-bottom));z-index:169;width:auto;padding:6px;gap:6px;background:rgba(10,13,16,.94);border:1px solid var(--border-mid);border-radius:14px;box-shadow:0 12px 36px rgba(0,0,0,.30);backdrop-filter:blur(18px)}
  .quicklog-btn{min-width:0;min-height:42px;padding:9px 8px!important;border-radius:10px!important;font-family:var(--body);font-size:12px!important;font-weight:700;text-transform:none;letter-spacing:0;justify-content:center}
  .quicklog-btn.ql-body{background:rgba(255,255,255,.06);border-color:var(--border-mid);color:var(--text)}
  .quicklog-btn.ql-nut{background:var(--run);border-color:var(--run);color:#061117}
  .quicklog-btn.ql-nut .icon{color:#061117}
  .outdoor-mode .quicklog-strip{background:rgba(255,255,255,.97);box-shadow:0 10px 30px rgba(7,17,22,.13)}
  .outdoor-mode .quicklog-btn.ql-body{background:#fff;color:var(--text)}
  .outdoor-mode .quicklog-btn.ql-nut{background:var(--run);color:#fff}
  .outdoor-mode .quicklog-btn.ql-nut .icon{color:#fff}
  .wa-fab{bottom:148px!important}
  .mobile-nav{position:fixed;display:grid;grid-template-columns:repeat(5,1fr);left:10px;right:10px;bottom:calc(8px + env(safe-area-inset-bottom));z-index:170;min-height:66px;padding:6px 4px;background:rgba(10,13,16,.94);border:1px solid var(--border-mid);border-radius:18px;box-shadow:0 16px 50px rgba(0,0,0,.42);backdrop-filter:blur(18px)}
  .mobile-nav-item{position:relative;border:0;background:transparent;color:var(--dim);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-family:var(--body);font-size:10px;font-weight:600;cursor:pointer;border-radius:12px}
  .mobile-nav-item .icon{width:20px;height:20px}.mobile-nav-item.active{color:var(--run)}
  .mobile-nav-item.active::before{content:"";position:absolute;top:-1px;width:24px;height:2px;border-radius:2px;background:var(--run)}
  .mobile-nav-dot{display:none;position:absolute;top:8px;right:23%;width:6px;height:6px;border-radius:50%;background:var(--run)}
  .mobile-nav-dot.visible{display:block}
  .more-menu{position:fixed;display:block;inset:0;z-index:190;background:rgba(0,0,0,.58);opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s;backdrop-filter:blur(6px)}
  .more-menu.open{opacity:1;visibility:visible}
  .more-menu-sheet{position:absolute;left:0;right:0;bottom:0;padding:10px 16px calc(24px + env(safe-area-inset-bottom));background:var(--surface);border-radius:24px 24px 0 0;transform:translateY(102%);transition:transform .26s ease;box-shadow:0 -18px 60px rgba(0,0,0,.35)}
  .more-menu.open .more-menu-sheet{transform:translateY(0)}
  .more-menu-handle{width:38px;height:4px;border-radius:4px;background:var(--border-strong);margin:0 auto 18px}
  .more-menu-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.more-menu-kicker{font-size:10px;color:var(--dim)}.more-menu-title{font-size:28px;font-weight:600;line-height:1.1}.more-menu-close{width:38px;height:38px;border-radius:50%;border:1px solid var(--border);background:var(--surface2);color:var(--text);font-size:23px}
  .more-menu-grid{display:grid;gap:8px}.more-menu-grid button,.more-outdoor{width:100%;display:flex;align-items:center;gap:13px;text-align:left;border:1px solid var(--border);background:var(--surface2);color:var(--text);border-radius:14px;padding:14px}
  .more-menu-grid .icon,.more-outdoor>.icon{width:20px;height:20px;color:var(--muted)}.more-menu-grid span,.more-outdoor span{flex:1}.more-menu-grid strong,.more-menu-grid small,.more-outdoor strong,.more-outdoor small{display:block}.more-menu-grid strong,.more-outdoor strong{font-size:14px}.more-menu-grid small,.more-outdoor small{font-size:12px;color:var(--muted);margin-top:1px}
  .more-outdoor{margin-top:12px}.theme-switch{flex:0 0 38px!important;width:38px;height:22px;border-radius:20px;background:var(--border-strong);position:relative}.theme-switch::after{content:"";position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .2s}.outdoor-mode .theme-switch::after{transform:translateX(16px)}
  body.menu-open{overflow:hidden}
}

/* Desktop command centre: give the daily card enough room to remain useful,
   while preserving a wider week-plan column. */
@media(min-width:900px){
  .insight-rail{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .insight-card{min-height:68px}
  .command-status-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .command-status.next-session{grid-column:1/-1}
  .quicklog-strip{left:50%;right:auto;width:min(720px,calc(100vw - 48px));transform:translateX(-50%);border:1px solid var(--border-mid);border-bottom:0;border-radius:14px 14px 0 0;box-shadow:0 -10px 35px rgba(0,0,0,.24)}
}
@media(min-width:1200px){
  #tab-training.active,#tab-weekly.active{max-width:none}
}
@media(min-width:1600px){
  #tab-training.active,#tab-weekly.active{max-width:none}
  .todaypanel{padding:26px}
}

@media(max-width:420px){
  .today-actions{grid-template-columns:1fr}.today-action{min-height:44px}
  .todayhead{display:block}.todaydate{margin-top:8px}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* ============================================================
   FUNCTIONAL LAYER — COMMAND CENTRE, FOCUS MODE & RESILIENCE
   ============================================================ */
.save-state-pill{display:flex;align-items:center;gap:6px;padding:4px 8px;border:1px solid var(--border);border-radius:999px;color:var(--muted);font-size:10px;transition:opacity .2s}
.save-state-pill span{width:6px;height:6px;border-radius:50%;background:var(--ok)}
.save-state-pill b{font-weight:600}.save-state-pill.quiet{opacity:.45}.save-state-pill.saving span{background:var(--run);animation:pdot 1s infinite}.save-state-pill.offline{color:#f0b65c;border-color:rgba(240,182,92,.25)}.save-state-pill.offline span{background:#f0b65c}
.command-status-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 18px}
.command-status{position:relative;display:flex;align-items:center;gap:9px;min-width:0;padding:11px;border:1px solid var(--border);border-radius:11px;background:rgba(255,255,255,.022);color:var(--text);text-align:left}
button.command-status{padding-right:25px;cursor:pointer;font:inherit;transition:border-color .16s,background .16s,transform .12s}button.command-status::after{content:"›";position:absolute;right:9px;top:50%;transform:translateY(-52%);color:var(--dim);font-size:18px;line-height:1}button.command-status:hover{border-color:var(--border-mid);background:rgba(255,255,255,.045)}button.command-status:hover::after{color:var(--run)}button.command-status:active{transform:scale(.99)}.command-status-icon{width:30px;height:30px;flex:0 0 30px;display:grid;place-items:center;border-radius:9px;background:var(--surface2);color:var(--muted)}.command-status-icon.done{color:var(--ok);background:var(--ok-bg)}.command-status-icon .icon{width:15px;height:15px}
.command-status>span:last-child{min-width:0;flex:1}.command-status small,.command-status strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.command-status small{font-size:9px;color:var(--dim);margin-bottom:2px}.command-status strong{font-size:11px;font-weight:600}.command-status i{display:block;height:3px;margin-top:5px;background:var(--border);border-radius:3px;overflow:hidden}.command-status i b{display:block;height:100%;background:var(--run);border-radius:3px}
.recovery-warning{display:flex;align-items:flex-start;gap:10px;padding:12px;margin:-4px 0 18px;border:1px solid rgba(240,182,92,.28);background:rgba(240,182,92,.075);border-radius:11px}.recovery-warning>.icon{width:18px;height:18px;color:#f0b65c;margin-top:2px}.recovery-warning div{flex:1}.recovery-warning strong,.recovery-warning span{display:block}.recovery-warning strong{font-size:12px}.recovery-warning span{font-size:12px;color:var(--muted);line-height:1.4}.recovery-warning button{border:0;background:transparent;color:#f0b65c;font-weight:700;font-size:11px;cursor:pointer}
.suggested-load{font-family:var(--mono);font-size:9px;color:var(--ok);background:var(--ok-bg);border:1px solid var(--ok-border);border-radius:4px;padding:3px 8px;display:inline-block}
.reschedule-btn{width:34px;height:34px;display:grid;place-items:center;flex:0 0 34px;border:1px solid var(--border);border-radius:9px;background:transparent;color:var(--dim);cursor:pointer}.reschedule-btn .icon{width:14px;height:14px}.reschedule-input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}

body.focus-session-open{overflow:hidden}
.focus-overlay{position:fixed;inset:0;z-index:250;background:var(--bg);display:flex;flex-direction:column;opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity .22s ease,transform .22s ease}
.focus-overlay.open{opacity:1;transform:none;pointer-events:auto}
.focus-overlay-bar{flex:0 0 auto;display:grid;grid-template-columns:40px 1fr auto;align-items:center;gap:10px;padding:calc(12px + env(safe-area-inset-top)) 16px 12px;background:var(--bg);border-bottom:1px solid var(--border)}
.focus-close{width:36px;height:36px;border-radius:50%;border:1px solid var(--border-mid);background:var(--surface2);color:var(--text);font-size:22px;line-height:1;cursor:pointer}
.focus-overlay-title{min-width:0}
.focus-overlay-title small{display:block;font-family:var(--mono);font-size:9px;color:var(--dim);text-transform:uppercase;letter-spacing:.1em}
.focus-overlay-title strong{display:block;font-family:var(--display);font-size:17px;text-transform:uppercase;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.focus-overlay-bar>span{font-family:var(--mono);font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}
.focus-overlay-scroll{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:14px 16px 20px}
.focus-overlay-scroll .sc,.focus-overlay-scroll .sc.done,.focus-overlay-scroll .sc.marked{margin-top:0;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.focus-overlay-scroll .sch{display:none}
.focus-overlay-scroll .scb{display:block!important;border-top:0;padding:0}
.focus-overlay-scroll .sc-nudge{display:none}
.focus-overlay-scroll input,.focus-overlay-scroll textarea,.focus-overlay-scroll select{font-size:16px!important}
.focus-overlay-foot{flex:0 0 auto;padding:10px 16px calc(12px + env(safe-area-inset-bottom));background:var(--bg);border-top:1px solid var(--border)}
.focus-done-btn{width:100%;min-height:48px;border:0;border-radius:12px;background:var(--run);color:#061117;font-family:var(--display);font-size:15px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;cursor:pointer}
.focus-done-btn:active{opacity:.85}

.modal-subtitle{font-size:12px;color:var(--muted);margin-top:2px}.preferences-modal-inner,.summary-modal-inner{max-width:560px}.preference-list{display:grid;gap:8px}.preference-row{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid var(--border);border-radius:12px;background:var(--surface2);cursor:pointer}.preference-row>span{flex:1}.preference-row strong,.preference-row small{display:block}.preference-row strong{font-size:14px}.preference-row small{font-size:12px;color:var(--muted);margin-top:2px}.preference-row input{position:absolute;opacity:0}.preference-row i{width:40px;height:23px;border-radius:20px;background:var(--border-strong);position:relative}.preference-row i::after{content:"";position:absolute;left:3px;top:3px;width:17px;height:17px;border-radius:50%;background:#fff;transition:transform .2s}.preference-row input:checked+i{background:var(--run)}.preference-row input:checked+i::after{transform:translateX(17px)}
.data-controls{margin-top:18px;padding-top:18px;border-top:1px solid var(--border);display:grid;gap:8px}.data-controls>div strong,.data-controls>div span{display:block}.data-controls>div span{font-size:12px;color:var(--muted);margin-top:3px}.data-controls button,.data-controls a{padding:11px;border:1px solid var(--border-mid);border-radius:9px;background:transparent;color:var(--text);font-weight:600;text-align:center;text-decoration:none}.data-controls a{color:#e87676;border-color:rgba(232,118,118,.25)}
.summary-hero{display:flex;align-items:center;gap:14px;padding:16px;background:var(--run-bg);border:1px solid var(--run-border);border-radius:13px}.summary-hero>span{font-size:32px;font-weight:700;color:var(--run)}.summary-hero strong,.summary-hero small{display:block}.summary-hero small{color:var(--muted);margin-top:2px}.summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.summary-grid>div{padding:14px;border:1px solid var(--border);border-radius:11px;background:var(--surface2)}.summary-grid small,.summary-grid strong{display:block}.summary-grid small{font-size:10px;color:var(--dim)}.summary-grid strong{font-size:17px;margin-top:4px}.summary-wins{margin:12px 0;padding:14px;border:1px solid var(--border);border-radius:11px}.summary-wins p{font-size:13px;color:var(--muted);line-height:1.5;margin-top:5px}
.pain-log-block{display:grid;gap:12px;margin:0 0 16px;padding:14px;border:1px solid rgba(240,182,92,.25);border-radius:11px;background:rgba(240,182,92,.06)}.pain-log-block input[type="range"]{width:100%;margin-top:8px;accent-color:#e7a845}.pain-help{font-size:11px;color:var(--muted);line-height:1.4}
.outdoor-mode .command-status,.outdoor-mode .preference-row,.outdoor-mode .summary-grid>div{background:var(--surface2)}

.pb-history-modal-inner{max-width:660px}.pb-search{display:flex;align-items:center;gap:10px;padding:0 13px;border:1px solid var(--border-mid);border-radius:11px;background:var(--surface2);color:var(--dim)}.pb-search .icon{width:17px;height:17px}.pb-search input{width:100%;min-height:46px;border:0;outline:0;background:transparent;color:var(--text);font:inherit}.pb-search input::placeholder{color:var(--dim)}.pb-history-list{display:grid;gap:9px;margin-top:13px}.pb-history-card{border:1px solid var(--border);border-radius:12px;background:var(--surface2);overflow:hidden}.pb-history-card summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px;cursor:pointer}.pb-history-card summary::-webkit-details-marker{display:none}.pb-history-heading{min-width:0}.pb-history-heading span,.pb-history-heading small,.pb-load strong,.pb-load small{display:block}.pb-history-heading span{font-weight:700;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pb-history-heading small,.pb-load small{font-size:10px;color:var(--dim);margin-top:2px}.pb-load{text-align:right;flex:0 0 auto}.pb-load strong{font-family:var(--display);font-size:20px;color:var(--pb)}.pb-history-card[open] summary{border-bottom:1px solid var(--border)}.pb-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:12px}.pb-metrics>div{padding:10px;border:1px solid var(--border);border-radius:9px;background:var(--surface)}.pb-metrics small,.pb-metrics strong{display:block}.pb-metrics small{font-size:9px;color:var(--dim)}.pb-metrics strong{font-size:14px;margin-top:3px}.pb-session-history{padding:0 12px 12px}.pb-session-title{font-size:9px;color:var(--dim);text-transform:uppercase;letter-spacing:.08em;margin:2px 0 7px}.pb-session-row{display:grid;grid-template-columns:90px 1fr;gap:9px;padding:8px 0;border-top:1px solid var(--border);font-size:10px}.pb-session-row span{color:var(--dim)}.pb-session-row strong{font-family:var(--mono);font-weight:500;text-align:right;line-height:1.45}.pb-history-empty{padding:28px 14px;text-align:center;color:var(--muted);border:1px dashed var(--border-mid);border-radius:12px}.outdoor-mode .pb-history-card,.outdoor-mode .pb-search{background:var(--surface2);border-color:var(--border-mid)}.outdoor-mode .pb-load strong{color:#5a35a5}.outdoor-mode .pb-metrics>div{background:#fff}

@media(max-width:760px){
  .save-state-pill{position:fixed;top:62px;right:10px;z-index:135;background:rgba(10,13,16,.88);backdrop-filter:blur(12px)}
  /* Successful sync is the quiet default. Only active syncing or an offline
     warning should interrupt the athlete on a small screen. */
  .save-state-pill.saved{opacity:0;pointer-events:none}
  .save-state-pill.saving,.save-state-pill.offline{opacity:1;pointer-events:auto}
  .outdoor-mode .save-state-pill{background:rgba(255,255,255,.94)}
  .command-status-grid{grid-template-columns:1fr 1fr}.command-status.next-session{grid-column:1/-1}
  .focus-session-open>.quicklog-strip,.focus-session-open .mobile-nav,.focus-session-open .wa-fab{display:none!important}
}
/* Premium desktop presentation. Mobile deliberately keeps its direct,
   low-friction layout. */
@media(min-width:900px){
  html:not(.outdoor-mode) body{
    background:
      radial-gradient(900px 520px at 18% 4%,rgba(48,134,170,.09),transparent 62%),
      radial-gradient(760px 480px at 86% 34%,rgba(63,103,128,.055),transparent 64%),
      #040607;
  }
  html:not(.outdoor-mode) header{background:rgba(5,8,10,.78);backdrop-filter:blur(22px) saturate(130%);border-bottom-color:rgba(255,255,255,.07)}
  html:not(.outdoor-mode) .hero{background:linear-gradient(180deg,rgba(14,20,24,.78),rgba(7,10,12,.58));border-bottom:1px solid rgba(255,255,255,.075)}
  .top-shell{padding:22px var(--shellpad) 18px;background:linear-gradient(180deg,rgba(6,9,11,.9),rgba(6,9,11,.58))}
  .hero{padding:0;background:transparent!important;border-bottom:0!important}
  .hero-shell{display:grid;grid-template-columns:minmax(0,1.28fr) minmax(320px,.72fr);gap:18px;align-items:stretch;max-width:1200px;margin:0 auto}
  .hero-main,.hero-side{padding:26px 28px;border-radius:26px;box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 22px 50px rgba(0,0,0,.22)}
  .hero-main{align-self:stretch;display:flex;flex-direction:column;gap:20px;justify-content:center}
  .hero-side{align-self:stretch;display:flex;flex-direction:column;justify-content:center;gap:16px}
  .hi{margin-bottom:0}
  .hero-name-row{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:0}
  .hero-week{align-self:flex-start;margin-left:0;min-width:124px;padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.04)}
  .hero{padding-top:0;padding-bottom:0}.hn{letter-spacing:-.055em;font-size:76px;max-width:7.4ch}.hero-week-num{letter-spacing:-.04em;font-size:38px}
  .hero-support{font-size:15px;max-width:46ch}
  .hero-bottom{grid-template-columns:auto minmax(0,1fr);align-items:end;gap:18px}
  .hero-stat-grid{gap:12px}
  .hero-stat{padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.04)}
  .hero-stat-value{font-size:28px}
  .hpills{margin-bottom:0;align-self:start}
  .week-rings{grid-template-columns:1fr;gap:12px}
  .ring-item{padding:18px;border-radius:20px}
  .ring-wrap{width:64px;height:64px}
  .ring-svg{width:64px;height:64px}
  .ring-val{font-size:30px}
  .ring-sub{font-size:10px;letter-spacing:.1em}
  .ring-src{font-size:9px}
  .top-shell-priority{max-width:1200px;margin:14px auto 0;grid-template-columns:minmax(0,1.15fr) minmax(0,.9fr) minmax(0,1.1fr);gap:12px;align-items:stretch}
  .top-shell-priority>#strava-ack-banner{grid-column:1/-1}
  .top-shell-priority .nudge-strip{padding:16px 18px;height:100%}
  .top-shell-priority .nudge-strip-inner{max-width:none;align-items:center}
  .top-shell-priority .nudge-strip-title{font-size:16px}
  .top-shell-priority .nudge-strip-sub{font-size:11px}
  #callConfirmedNudge{padding-top:16px;padding-bottom:16px}
  #callConfirmedNudge::before{display:none}
  .top-shell-priority #callConfirmedNudge .nudge-strip-text{display:block}
  .top-shell-priority #callConfirmedNudge .nudge-strip-title{font-size:15px;white-space:normal;overflow:visible}
  .top-shell-priority #callConfirmedNudge .nudge-strip-sub{margin-top:4px;white-space:normal}
  .wbar{background:transparent;backdrop-filter:none;border-top:1px solid rgba(255,255,255,.05);border-bottom:1px solid rgba(255,255,255,.05)}
  .wbar{padding-left:var(--shellpad);padding-right:var(--shellpad)}
  .wbar>.wbar-meta,.wbar>.wnav{max-width:1200px}
  .wbar{display:flex}
  .tabs{background:rgba(5,8,10,.82);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.065)}
  .tab{min-height:48px;padding-left:18px;padding-right:18px;transition:color .16s,background .16s}.tab:hover{color:var(--text);background:rgba(255,255,255,.025)}
  #tab-training.active,#tab-weekly.active{padding-top:34px}
  #tab-training .todaywrap{filter:drop-shadow(0 28px 55px rgba(0,0,0,.26))}
  #tab-training .todaypanel{position:relative;overflow:hidden;border-color:rgba(146,210,237,.14);background:linear-gradient(155deg,rgba(19,25,29,.98),rgba(11,15,18,.98));box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 24px 60px rgba(0,0,0,.34)}
  #tab-training .todaypanel::before{content:"";position:absolute;left:26px;right:26px;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(146,210,237,.7),transparent);opacity:.62}
  #tab-weekly>#weeklyCalEl{position:relative;max-width:none;width:100%;padding:26px 28px 34px;border:1px solid rgba(255,255,255,.075);border-radius:20px;background:linear-gradient(180deg,rgba(13,18,21,.76),rgba(7,10,12,.58));box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 22px 60px rgba(0,0,0,.2)}
  #tab-weekly>#weeklyCalEl .week-plan-title{margin-bottom:22px;color:var(--muted);font-size:11px}
  #tab-weekly>#weeklyCalEl .dg{opacity:1;margin-bottom:20px}
  #tab-weekly>#weeklyCalEl .dgh{padding-bottom:10px;margin-bottom:9px}
  #tab-weekly>#weeklyCalEl .sc{border-color:rgba(255,255,255,.085);border-radius:13px;background:rgba(255,255,255,.027);transition:transform .16s,border-color .16s,background .16s,box-shadow .16s}
  #tab-weekly>#weeklyCalEl .sc:hover{transform:translateY(-2px);border-color:rgba(146,210,237,.2);background:rgba(255,255,255,.045);box-shadow:0 12px 26px rgba(0,0,0,.2)}
  #tab-weekly>#weeklyCalEl .sch{padding:17px 18px}
  .insight-card,.command-status{box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}
  .insight-card-button:hover,.command-status:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 8px 18px rgba(0,0,0,.14)}
  .coach-moment{margin-top:2px}
  .quicklog-strip{bottom:14px;padding:7px;background:rgba(10,14,17,.82);border:1px solid rgba(255,255,255,.13);border-radius:15px;backdrop-filter:blur(22px) saturate(135%);box-shadow:0 18px 50px rgba(0,0,0,.42)}
  .quicklog-btn{min-height:44px;border-radius:10px!important;text-transform:none;letter-spacing:0;font-family:var(--body);font-size:13px}
  .wa-fab{right:max(28px,calc((100vw - 1360px)/2));bottom:28px}

  /* ── Premium pass: remaining tabs (Goals, Progress, Nutrition, Check-in,
     Comms, Handbook). Same language as the Training command centre. ── */
  .stitle{font-size:28px;letter-spacing:-.015em;margin-bottom:18px}
  .page-intro{padding:22px 24px 20px;margin-bottom:22px}
  html:not(.outdoor-mode) .card,
  html:not(.outdoor-mode) .accordion-card,
  html:not(.outdoor-mode) .ci-card,
  html:not(.outdoor-mode) .mc,
  html:not(.outdoor-mode) .pstat,
  html:not(.outdoor-mode) .hb-card{border-color:rgba(255,255,255,.085);border-radius:14px;background:linear-gradient(180deg,rgba(19,25,29,.62),rgba(10,14,17,.5));box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 14px 34px rgba(0,0,0,.16)}
  .card,.ci-card{padding:22px}
  .pstat{padding:18px 14px}
  .mc{padding:18px 14px}
  .hb-card{padding:22px 18px}
  html:not(.outdoor-mode) .hb-card:hover{transform:translateY(-2px);border-color:rgba(146,210,237,.2);background:linear-gradient(180deg,rgba(23,30,35,.7),rgba(12,16,19,.55));box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 12px 26px rgba(0,0,0,.2)}
  html:not(.outdoor-mode) .accordion-header:hover{background:rgba(255,255,255,.035)}
  #tab-goals>*,#tab-progress>*{margin-bottom:20px}
  .progress-stats{gap:14px}
  #tab-checkin.active{gap:34px}
  .macro-grid{gap:12px}
  html:not(.outdoor-mode) .nut-wbar{background:rgba(8,11,14,.74);border:1px solid rgba(255,255,255,.075);backdrop-filter:blur(16px)}
  /* Hero cards get the todaypanel treatment: gradient surface + accent line */
  html:not(.outdoor-mode) .goals-hero,
  html:not(.outdoor-mode) .comms-card{position:relative;overflow:hidden;border:1px solid rgba(146,210,237,.14);border-radius:18px;background:linear-gradient(155deg,rgba(19,25,29,.98),rgba(11,15,18,.98));box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 24px 60px rgba(0,0,0,.3)}
  html:not(.outdoor-mode) .goals-hero::after,
  html:not(.outdoor-mode) .comms-card::after{content:"";position:absolute;left:26px;right:26px;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(146,210,237,.7),transparent);opacity:.62;pointer-events:none}
  .goals-hero{padding:28px 26px}
  .comms-card{padding:28px 26px}
  html:not(.outdoor-mode) .goals-prompt{border-color:rgba(146,210,237,.22);border-radius:16px;background:linear-gradient(155deg,rgba(17,26,31,.9),rgba(9,13,16,.85));box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 18px 44px rgba(0,0,0,.24)}
  .hb-modal-inner,.ql-modal-inner,.photo-modal-inner,.preferences-modal-inner,.summary-modal-inner,.pb-history-modal-inner{border:1px solid rgba(255,255,255,.09);box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 40px 90px rgba(0,0,0,.5)}

  .outdoor-mode body{background:linear-gradient(180deg,#eef3f5 0,#f7f9fa 380px)}
  .outdoor-mode header{background:rgba(255,255,255,.84);backdrop-filter:blur(22px);box-shadow:0 1px 0 rgba(7,17,22,.1)}
  .outdoor-mode .top-shell{background:linear-gradient(180deg,#edf3f5,#f5f8f9)}
  .outdoor-mode .hero-main,.outdoor-mode .hero-side{background:#fff;border-color:rgba(7,17,22,.13);box-shadow:0 20px 45px rgba(30,55,67,.08)}
  .outdoor-mode .hero-main::before{background:linear-gradient(90deg,transparent,var(--run),transparent)}
  .outdoor-mode .top-shell-priority .nudge-strip{background:#fff;border-color:rgba(7,17,22,.13);box-shadow:0 12px 28px rgba(30,55,67,.06)}
  .outdoor-mode #tab-training .todaypanel{background:#fff;border-color:rgba(7,17,22,.13);box-shadow:0 24px 55px rgba(30,55,67,.12)}
  .outdoor-mode #tab-training .todaypanel::before{background:linear-gradient(90deg,transparent,var(--run),transparent)}
  .outdoor-mode #tab-weekly>#weeklyCalEl{background:rgba(255,255,255,.82);border-color:rgba(7,17,22,.12);box-shadow:0 22px 55px rgba(30,55,67,.09)}
  .outdoor-mode #tab-weekly>#weeklyCalEl .sc{background:#fff;border-color:rgba(7,17,22,.13)}
  .outdoor-mode #tab-weekly>#weeklyCalEl .sc:hover{border-color:rgba(8,127,174,.35);box-shadow:0 12px 25px rgba(30,55,67,.1)}
  .outdoor-mode .quicklog-strip{background:rgba(255,255,255,.9);border-color:rgba(7,17,22,.15);box-shadow:0 18px 45px rgba(30,55,67,.15)}
  .outdoor-mode .card,.outdoor-mode .accordion-card,.outdoor-mode .ci-card,.outdoor-mode .mc,.outdoor-mode .pstat,.outdoor-mode .hb-card{background:#fff;border-color:rgba(7,17,22,.13);box-shadow:0 14px 30px rgba(30,55,67,.08)}
  .outdoor-mode .hb-card:hover{transform:translateY(-2px);border-color:rgba(8,127,174,.35);box-shadow:0 12px 25px rgba(30,55,67,.12)}
  .outdoor-mode .goals-hero,.outdoor-mode .comms-card{background:#fff!important;border-color:rgba(7,17,22,.13)!important;box-shadow:0 24px 55px rgba(30,55,67,.12)}
  .outdoor-mode .goals-hero::after,.outdoor-mode .comms-card::after{background:linear-gradient(90deg,transparent,var(--run),transparent)}
  .outdoor-mode .goals-prompt{background:#fff!important;border-color:rgba(7,17,22,.13)!important;box-shadow:0 18px 40px rgba(30,55,67,.1)}
  .outdoor-mode .nut-wbar{box-shadow:0 10px 26px rgba(30,55,67,.08)}
}

/* ════════════════════════════════════════════════════════════════
   DESKTOP SIDE NAVIGATION (≥900px)
   The horizontal tab strip becomes a fixed left rail — the premium
   app pattern. Pure CSS: same .tab elements, same JS handlers.
   Mobile (<900px) is untouched.
   ════════════════════════════════════════════════════════════════ */
@media(min-width:900px){
  :root{--railw:236px;--shellpad:max(36px,calc((100vw - var(--railw) - 1200px)/2))}

  /* Shift each top-level desktop region once. The hero and priority cards
     share .top-shell, so moving their parent keeps both grids on the same
     content axis instead of centring one against the full viewport. */
  header,.wbar,.nudge-strip,.tab-content{margin-left:var(--railw)}
  .top-shell{margin-left:var(--railw)}
  .top-shell>.hero{margin-left:0}
  header{justify-content:flex-end}
  header .logo{display:none}

  /* The tab strip becomes the rail */
  .tabs{position:fixed;left:0;top:0;bottom:0;width:var(--railw);z-index:140;display:flex;flex-direction:column;align-items:stretch;gap:3px;margin:0;padding:104px 14px 24px;overflow-y:auto;overflow-x:hidden;border-bottom:0;border-top:0;border-right:1px solid rgba(255,255,255,.07)}
  html:not(.outdoor-mode) .tabs{background:linear-gradient(180deg,rgba(9,13,16,.92),rgba(4,7,9,.88));backdrop-filter:blur(22px) saturate(130%)}
  /* Brand block at the top of the rail */
  .tabs::before{content:"";position:absolute;top:24px;left:18px;width:40px;height:40px;background:var(--dp-logo) center/contain no-repeat}
  .tabs::after{content:"DUAL\A PERFORMANCE";white-space:pre;position:absolute;top:29px;left:68px;font-family:var(--display);font-weight:800;font-size:13px;line-height:1.2;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.88)}

  /* Nav items: full-width rows, left accent bar on active */
  .tab{flex:0 0 auto;width:100%;min-height:0;display:flex;align-items:center;text-align:left;padding:12px 14px;border:0;border-radius:10px;font-size:13.5px;letter-spacing:.06em;color:rgba(255,255,255,.42);transition:color .15s,background .15s}
  .tab:hover{color:var(--text);background:rgba(255,255,255,.045)}
  .tab.active{color:var(--run-strong);background:rgba(146,210,237,.09);box-shadow:inset 2.5px 0 0 var(--run);border-bottom:0}
  .tab-dot{margin-left:auto;margin-bottom:0}

  /* Sticky offsets shrink: tabs are no longer in the top stack */
  .wbar{top:54px}
  #tab-training .todaywrap{top:118px}
  #tab-checkin>.ci-rail{top:118px}

  /* Floating chrome re-centres within the content area */
  .quicklog-strip{left:calc(var(--railw) + (100vw - var(--railw))/2);width:min(720px,calc(100vw - var(--railw) - 48px))}
  .wa-fab{right:max(28px,calc((100vw - var(--railw) - 1200px)/2))}

  /* Daylight rail */
  .outdoor-mode .tabs{background:rgba(255,255,255,.93);backdrop-filter:blur(22px);border-right:1px solid var(--border)}
  .outdoor-mode .tabs::after{color:var(--text)}
  .outdoor-mode .tab{color:var(--dim)}
  .outdoor-mode .tab:hover{color:var(--text);background:rgba(7,17,22,.045)}
  .outdoor-mode .tab.active{color:var(--run-strong);background:var(--run-bg);box-shadow:inset 2.5px 0 0 var(--run)}
}

/* ── Side nav polish: icons, brand divider, richer active state ── */
@media(min-width:900px){
  /* Hairline divider under the brand block */
  html:not(.outdoor-mode) .tabs{background:linear-gradient(rgba(255,255,255,.08),rgba(255,255,255,.08)) 14px 82px/calc(100% - 28px) 1px no-repeat,linear-gradient(180deg,rgba(9,13,16,.92),rgba(4,7,9,.88))}
  .outdoor-mode .tabs{background:linear-gradient(rgba(7,17,22,.1),rgba(7,17,22,.1)) 14px 82px/calc(100% - 28px) 1px no-repeat,rgba(255,255,255,.93)}

  /* Icons: masked SVG, painted with currentColor so they follow theme + state */
  .tabs .tab{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3C/svg%3E")}
  .tabs .tab:nth-of-type(1){--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 2 3 14h7l-1 8 11-12h-7z'/%3E%3C/svg%3E")}
  .tabs .tab:nth-of-type(2){--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M16 3v4M8 3v4M3 11h18'/%3E%3C/g%3E%3C/svg%3E")}
  .tabs .tab:nth-of-type(3){--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2C9 7 6 9 6 13a6 6 0 0 0 12 0c0-4-3-6-6-11z'/%3E%3C/svg%3E")}
  .tabs .tab:nth-of-type(4){--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='19' rx='2'/%3E%3Cpath d='m9 13 2 2 4-5'/%3E%3C/g%3E%3C/svg%3E")}
  .tabs .tab:nth-of-type(5){--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 17l6-6 4 4 8-8'/%3E%3Cpath d='M15 7h6v6'/%3E%3C/g%3E%3C/svg%3E")}
  .tabs .tab::before{content:"";width:17px;height:17px;flex:0 0 17px;margin-right:11px;background:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat;opacity:.8}
  .tabs .tab.active::before,.tabs .tab:hover::before{opacity:1}
  .tab{font-size:14px;letter-spacing:.05em}

  /* Active: gradient wash + inner ring + left accent, icon lights up */
  .tab.active{background:linear-gradient(90deg,rgba(146,210,237,.15),rgba(146,210,237,.04));box-shadow:inset 2.5px 0 0 var(--run),inset 0 0 0 1px rgba(146,210,237,.13)}
  .outdoor-mode .tab.active{background:linear-gradient(90deg,rgba(8,127,174,.13),rgba(8,127,174,.04));box-shadow:inset 2.5px 0 0 var(--run),inset 0 0 0 1px rgba(8,127,174,.16)}
}

/* ── One-screen command centre (≥900px) ──
   Compress the chrome so today's session is fully above the fold,
   and scope scrolling to the panels: both training columns pin,
   the week plan scrolls inside its own pane. */
@media(min-width:900px){
  /* Tighter hero */
  .top-shell{padding-top:16px;padding-bottom:14px}
  .hi{margin-bottom:2px}
  .hn{font-size:54px}
  .hero-week-num{font-size:24px}
  .hero-name-row{margin-bottom:7px}
  .hpills{margin-bottom:2px}

  /* Compact nudge strips */
  .top-shell-priority .nudge-strip{padding-top:14px;padding-bottom:14px}
  .nudge-strip-icon{font-size:16px}
  #checkinNudge .nudge-strip-icon{width:24px;height:24px}
  .nudge-strip-title{font-size:14px}
  .nudge-strip-sub{font-size:10px;margin-top:1px}
  .nudge-strip-arr{font-size:15px}

  /* Compact week bar + content top */
  .wbar{padding-top:8px;padding-bottom:8px}
  #tab-training.active{padding-top:22px}
  #tab-training.active>.page-intro,#tab-weekly.active>.page-intro{display:none}

  /* Today's Plan stays compact; Weekly Plan gets the week browser */
  #tab-training .todaywrap{top:104px;max-height:calc(100vh - 118px);overflow-y:auto;overscroll-behavior:contain}
  #tab-checkin>.ci-rail{top:104px;max-height:calc(100vh - 118px);overflow-y:auto;overscroll-behavior:contain}

  /* Quiet scrollbars inside the panes */
  #tab-training .todaywrap::-webkit-scrollbar,#tab-checkin>.ci-rail::-webkit-scrollbar{width:8px}
  #tab-training .todaywrap::-webkit-scrollbar-thumb,#tab-checkin>.ci-rail::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:8px;border:2px solid transparent;background-clip:padding-box}
  #tab-training .todaywrap::-webkit-scrollbar-track,#tab-checkin>.ci-rail::-webkit-scrollbar-track{background:transparent}
  .outdoor-mode #tab-training .todaywrap::-webkit-scrollbar-thumb,.outdoor-mode #tab-checkin>.ci-rail::-webkit-scrollbar-thumb{background:rgba(7,17,22,.2);background-clip:padding-box}

  /* Sticky drop-shadow filter breaks position:sticky descendants - move it */
  #tab-training .todaywrap{filter:none}
  #tab-training .todaypanel{filter:drop-shadow(0 20px 45px rgba(0,0,0,.22))}
  .outdoor-mode #tab-training .todaypanel{filter:none}
}

/* ── Progress tab layout fix (≥900px) ──
   The photo grid card is far taller than its neighbours; in an auto-row
   grid it forces huge gaps before the next card. Stack Progress cards
   full-width instead - photos get more room, no dead space. */
@media(min-width:900px){
  #tab-progress.active{display:block;max-width:1020px;margin-left:auto;margin-right:auto}
  #tab-progress>*{margin-bottom:20px}
  #tab-progress>.progress-stats{grid-template-columns:repeat(4,1fr)!important}
}

/* Chart/progress card wrappers missed the outdoor surface overrides */
.outdoor-mode .progress-card,.outdoor-mode .progress-panel,.outdoor-mode .weight-trend,.outdoor-mode .weight-trend-card{background:#fff!important;border-color:rgba(7,17,22,.13)!important;box-shadow:0 14px 30px rgba(30,55,67,.08)!important;color:var(--text)}

/* ── WEEKLY RINGS (running km + gym) ────────────────────────────────────── */

/* KM gauge — ticked instrument arc */
.gauge-tick{stroke:rgba(255,255,255,.13);stroke-width:2.4;stroke-linecap:round;fill:none;transition:stroke .4s ease,filter .4s ease}
.gauge-tick.lit{stroke:#92d2ed}
.gauge-tick.tgt{stroke:rgba(255,255,255,.28);stroke-width:2.8}
.gauge-tick.tgt.lit{stroke:#c8ecfb;filter:drop-shadow(0 0 4px rgba(146,210,237,.8))}
/* Gym gauge — one segment per session */
.gauge-seg{stroke:rgba(255,255,255,.12);stroke-width:5.5;stroke-linecap:round;fill:none;transition:stroke .45s ease,filter .45s ease}
.gauge-seg.done{stroke:#e8e8e8}

.km-hit .gauge-tick.lit{filter:drop-shadow(0 0 4px rgba(146,210,237,.6))}
#gymBar.km-hit .gauge-seg.done{filter:drop-shadow(0 0 4px rgba(255,255,255,.45))}
/* Outdoor mode */
.outdoor-mode .gauge-tick{stroke:var(--border-mid)!important}
.outdoor-mode .gauge-tick.lit{stroke:var(--run)!important}
.outdoor-mode .gauge-tick.tgt{stroke:var(--border-strong)!important}
.outdoor-mode .gauge-tick.tgt.lit{stroke:var(--run-strong)!important;filter:none!important}
.outdoor-mode .gauge-seg{stroke:var(--border-mid)!important}
.outdoor-mode .gauge-seg.done{stroke:var(--strength)!important}

.outdoor-mode .km-hit .gauge-tick.lit,.outdoor-mode #gymBar.km-hit .gauge-seg.done{filter:none!important}

/* ── COMPACT CALL-CONFIRMED NUDGE ─────────────────────────────── */
#callConfirmedNudge{position:relative;cursor:default;padding-top:6px;padding-bottom:6px}
#callConfirmedNudge::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,rgba(34,197,94,.7),rgba(34,197,94,.15))}
#callConfirmedNudge .nudge-strip-inner{gap:9px}
#callConfirmedNudge .nudge-strip-icon{width:20px;height:20px;border-radius:999px;display:flex;align-items:center;justify-content:center;background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.28);opacity:1;flex-shrink:0}
#callConfirmedNudge .nudge-strip-icon .icon{width:11px;height:11px;color:var(--ok)}
#callConfirmedNudge .nudge-strip-text{display:flex;align-items:baseline;gap:8px;min-width:0}
#callConfirmedNudge .nudge-strip-title{font-size:12px;color:rgba(255,255,255,.72);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#callConfirmedNudge .nudge-strip-sub{margin-top:0;font-size:9px;color:rgba(34,197,94,.8);white-space:nowrap;flex-shrink:0}

/* outdoor / light mode */
.outdoor-mode #callConfirmedNudge .nudge-strip-title{color:var(--muted)!important}
.outdoor-mode #callConfirmedNudge .nudge-strip-sub{color:#15803d!important}
.outdoor-mode #callConfirmedNudge .nudge-strip-icon{background:rgba(21,128,61,.08);border-color:rgba(21,128,61,.3)}
.outdoor-mode #callConfirmedNudge .nudge-strip-icon .icon{color:#15803d}

@media(min-width:900px){
  .top-shell-priority #callConfirmedNudge::before{display:none}
  .top-shell-priority #callConfirmedNudge .nudge-strip-text{display:block}
  .top-shell-priority #callConfirmedNudge .nudge-strip-title{font-size:15px;white-space:normal;overflow:visible}
  .top-shell-priority #callConfirmedNudge .nudge-strip-sub{margin-top:4px;white-space:normal}
}

@media(max-width:1120px){
  .hero-stat-grid{grid-template-columns:1fr}
}

/* ════════════════════════════════════════════════════════════════
   MOBILE TYPE + ERGONOMICS SWEEP (v22)
   1. 16px floor on all form controls ≤760px — kills iOS zoom-on-focus
   2. 10px legibility floor on micro-labels
   3. 44px-class tap targets via invisible hit-area expansion
   Appended last so it wins the cascade. Desktop untouched.
   ════════════════════════════════════════════════════════════════ */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}

@media(max-width:760px){
  /* 1 ── Form controls: 16px minimum. !important beats the inline
     font-size:13px styles on check-in textareas and app.js templates. */
  .li,input.li,textarea.li,select.li,
  .sin,.rpe-in,
  .run-field input,.run-field select,.run-field textarea,
  .why-textarea,.milestone-input{font-size:16px !important}
  .milestone-input::placeholder{font-size:14px}
  .rpe-in{padding:10px 1px}

  /* 2 ── Micro-label legibility floor: everything that was 8-9px → 10px.
     Uppercase mono labels need the extra px on small screens. */
  .plate-calc-label,.rt-label,.qln-fb-label,.qln-fb-status,
  .photo-cell .photo-overlay,.angle-slot .aslot-overlay,
  .photo-cell.current-week-badge,.pb-badge,.photo-cell .photo-count,
  .pb-metrics small,.pb-session-title,.qln-tgt,
  .ex-stat,.prev-effort,.today-effort,.suggested-load,.ex-stat-e1rm,
  .lf label,.slbl,.run-field label,.stat-field label,.milestone-field label,
  .saved-label,.saved-item-label,.goals-prompt-label,.todaytarget .label,
  .hi,.hero-week-label,.login-footer,
  .ring-sub,.ring-src{font-size:10px}
  .command-status small{font-size:10px}
  .command-status strong{font-size:12px}
  .insight-delta,.insight-empty{font-size:10px!important}
  .insight-card small{font-size:11px}
  .mobile-nav-item{font-size:11px}
  .exm,.exnotes,.snum,.smeta{font-size:11px}
  .todaymeta{font-size:12px}
  .dgdate,.restday,.todaydate{font-size:12px}
  .nudge-strip-sub{font-size:10px}

  /* Gym logging: exercise names are read mid-set at arm's length */
  .exn{font-size:17px}
  .rt-count{font-size:24px}

  /* 3 ── Tap targets. Invisible hit-area expansion where the visual
     size is part of the design; real size bumps where it isn't. */
  .st,.del-set,.ci-sdot{position:relative}
  .st::after,.del-set::after,.ci-sdot::after{content:'';position:absolute;inset:-9px;border-radius:50%}
  .warr,.wtoday,.nut-arr{min-height:42px;min-width:44px}
  .hicon{min-height:36px}
  .ex-pill{min-height:34px;padding:8px 12px;display:inline-flex;align-items:center}
  .ex-swaps{max-height:290px;overflow-y:auto;-webkit-overflow-scrolling:touch}
  .rt-skip{min-height:36px;padding:8px 14px}
  .coach-moment button,.reschedule-btn{width:40px;height:40px;flex-basis:40px}
  .hb-modal-close,.ql-modal-close,.more-menu-close,.focus-close{width:42px;height:42px}
  .photo-modal-close{padding:9px 12px}
  .addset{min-height:38px}
  .race-opt{min-height:40px}
  .del-set{width:26px;height:26px}
  .setrow.extra{grid-template-columns:22px 1fr 1fr 44px 36px 30px}
  .setrow-single.extra{grid-template-columns:22px 1fr 1fr 1fr 36px 30px}
  html.strength-rpe-off .setrow.extra{grid-template-columns:22px 1fr 1fr 36px 30px}
}

/* ── EMAIL OTP LOGIN (migrated athletes) — matches the code-login styling ── */
.email-input{
  width:100%;
  min-height:58px;
  padding:16px 18px;
  margin-bottom:18px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:10px;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.015));
  color:#dff6ff;
  font-family:var(--mono);
  font-size:16px; /* ≥16px prevents iOS zoom-on-focus in the PWA */
  text-align:center;
  letter-spacing:.02em;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 10px 24px rgba(0,0,0,.18);
  transition:border-color .16s,background .16s,box-shadow .16s;
}
.email-input::placeholder{color:rgba(247,250,252,.28)}
.email-input:focus{
  outline:none;
  border-color:rgba(146,210,237,.9);
  background:rgba(146,210,237,.08);
  box-shadow:0 0 0 1px rgba(146,210,237,.12),0 0 24px rgba(146,210,237,.16);
}
.email-sent-to{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.06em;
  color:rgba(223,246,255,.7);
  margin-bottom:14px;
  word-break:break-all;
}
.email-links{
  display:flex;
  justify-content:center;
  gap:18px;
  margin-top:16px;
}
.email-link{
  background:transparent;
  border:0;
  padding:6px 2px;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.06em;
  color:rgba(146,210,237,.78);
  text-decoration:underline;
  text-underline-offset:3px;
  cursor:pointer;
  transition:color .15s,opacity .15s;
}
.email-link:hover{color:#92d2ed}
.email-link:disabled{opacity:.4;cursor:default;text-decoration:none}
.login-alt-toggle{margin-top:22px}
.email-notice{
  font-family:var(--mono);
  font-size:11px;
  line-height:1.5;
  letter-spacing:.04em;
  color:rgba(223,246,255,.75);
  background:rgba(146,210,237,.07);
  border:1px solid rgba(146,210,237,.22);
  border-radius:10px;
  padding:10px 14px;
  margin-bottom:16px;
}
#emailErr{display:none}

/* ── Progressive overload card redesign (collapsible + coaching) ───────────── */
.exc-summary{display:flex;align-items:center;gap:9px;padding:12px 14px;cursor:pointer}
.exc-sum-main{flex:1;min-width:0}
.exn-row{display:flex;align-items:center;gap:8px;min-width:0}
.exn-row .exn{min-width:0}
.female-priority-note{display:flex;align-items:flex-start;gap:11px;margin:0 0 12px;padding:11px 12px;border:1px solid rgba(255,170,0,.28);border-radius:10px;background:rgba(255,170,0,.065);color:var(--text)}
.female-priority-note-badge,.female-priority-badge{display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(255,170,0,.4);border-radius:999px;background:rgba(255,170,0,.13);color:#ffc04d;font-family:var(--mono);font-size:8px;font-weight:800;line-height:1;letter-spacing:.07em;text-transform:uppercase;white-space:nowrap}
.female-priority-note-badge{min-height:23px;padding:5px 8px;flex:0 0 auto}
.female-priority-badge{min-height:20px;padding:4px 7px}
.female-priority-note strong,.female-priority-note span{display:block}
.female-priority-note strong{margin-bottom:3px;font-size:12px;line-height:1.2}
.female-priority-note div>span{color:var(--muted);font-size:10px;line-height:1.45}
.exc.female-priority-exercise{border-color:rgba(255,170,0,.28)}
.exc.female-priority-exercise:not(.exercise-complete){background:linear-gradient(90deg,rgba(255,170,0,.045),rgba(255,255,255,.02) 32%)}
.outdoor-mode .female-priority-note{background:#fff8e8;border-color:#e7c97b}
.outdoor-mode .female-priority-note-badge,.outdoor-mode .female-priority-badge{background:#fff1c7;border-color:#d9b85d;color:#8a5a00}
.outdoor-mode .exc.female-priority-exercise:not(.exercise-complete){background:linear-gradient(90deg,#fff9ea,#fff 36%);border-color:#dfc36e}
.exc-entry-pill{display:none;align-items:center;justify-content:center;min-height:28px;padding:5px 9px;border:1px solid var(--run-border);border-radius:999px;background:rgba(146,210,237,.08);color:var(--run);font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}
.exc.has-entry:not(.open){border-color:rgba(146,210,237,.42);background:rgba(146,210,237,.055);box-shadow:0 7px 20px rgba(0,0,0,.12)}
.exc.has-entry:not(.open) .exc-entry-pill{display:inline-flex}
.exc.has-entry:not(.open) .exc-chip{display:none}
.exc.exercise-complete:not(.open){border-color:var(--ok-border);background:var(--ok-bg);box-shadow:0 8px 22px rgba(26,140,99,.12)}
.exc.exercise-complete:not(.open) .exc-entry-pill{border-color:var(--ok-border);background:rgba(115,209,167,.12);color:var(--ok)}
.exc.exercise-complete:not(.open) .exc-why{color:var(--ok)}
.exc-why{font-family:var(--mono);font-size:10px;color:var(--muted);margin-top:3px;line-height:1.35}
.exc-why.go{color:var(--ok)}
.exc-chip{display:flex;align-items:center;gap:5px;border-radius:8px;padding:6px 10px;font-size:13px;white-space:nowrap;font-family:var(--mono);border:1px solid var(--border);background:var(--surface);color:var(--muted)}
.exc-chip.go{color:var(--ok);background:var(--ok-bg);border-color:var(--ok-border)}
.exc-chip.warn{color:var(--run);background:rgba(180,83,9,.08);border-color:rgba(180,83,9,.25)}
.exc-ar{font-weight:700}
.exc-chev{color:var(--dim);font-size:12px;transition:transform .18s}
.exc.open .exc-chev{transform:rotate(180deg)}
.exc.exc-go{border-color:var(--ok-border)}
.exc-body{display:none;padding:0 14px 12px}
.exc.open .exc-body{display:block}
.exc-body .exh{padding:8px 0}
.exc-ladder{display:flex;gap:5px;margin:6px 0 8px}
.exc-rung{flex:1;display:flex;align-items:center;justify-content:center;gap:4px;border:1px solid var(--border);background:var(--surface);border-radius:8px;padding:7px 4px;font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.exc-rung.active{border-color:var(--ok-border);background:var(--ok-bg);color:var(--ok);font-weight:700}
.exc-rung.upcoming{opacity:.45}
.exc-rung.done{opacity:.7}
.exc-rk{color:var(--ok)}
.exc-tip{display:flex;gap:6px;font-size:11px;color:var(--muted);line-height:1.5;margin-top:10px}
.exc-tip-i{color:var(--run)}

/* Draft and submitted are deliberately different states: autosave protects the
   athlete's inputs, but only the green state means coaches have received them. */
.session-submit-status{display:flex;align-items:flex-start;gap:10px;border:1px solid;border-radius:10px;padding:11px 12px;margin:10px 0 8px;font-family:var(--body)}
.session-submit-status .submit-status-icon{display:flex;align-items:center;justify-content:center;width:24px;height:24px;flex:0 0 24px;border-radius:50%;font-family:var(--mono);font-size:10px;font-weight:800;letter-spacing:-.08em}
.session-submit-status strong{display:block;font-size:12px;line-height:1.25;letter-spacing:.01em}
.session-submit-status small{display:block;margin-top:3px;font-family:var(--mono);font-size:9px;line-height:1.45;letter-spacing:.025em}
.session-submit-status.is-draft{background:rgba(146,210,237,.055);border-color:rgba(146,210,237,.28);color:var(--run)}
.session-submit-status.is-draft .submit-status-icon{background:rgba(146,210,237,.12);border:1px solid rgba(146,210,237,.28)}
.session-submit-status.is-draft small{color:var(--muted)}
.session-submit-status.is-submitted{background:var(--ok-bg);border-color:var(--ok-border);color:var(--ok)}
.session-submit-status.is-submitted .submit-status-icon{background:rgba(115,209,167,.14);border:1px solid var(--ok-border);letter-spacing:0}
.session-submit-status.is-submitted small{color:var(--muted)}
.outdoor-mode .exc.has-entry:not(.open){background:#eef8fc;border-color:#80c6e3;box-shadow:0 6px 18px rgba(13,91,120,.08)}
.outdoor-mode .exc.exercise-complete:not(.open){background:#effaf5;border-color:#75c8a5;box-shadow:0 6px 18px rgba(26,140,99,.08)}
.outdoor-mode .exc-entry-pill{background:#e6f5fb;border-color:#a2d8ec;color:#08739e}
.outdoor-mode .exc.exercise-complete:not(.open) .exc-entry-pill{background:#e1f6ec;border-color:#8fd3b5;color:#147a56}
.outdoor-mode .session-submit-status.is-draft{background:#eef8fc;border-color:#a2d8ec;color:#08739e}
.outdoor-mode .session-submit-status.is-draft small{color:#61727c}
.outdoor-mode .session-submit-status.is-submitted{background:#effaf5;border-color:#8fd3b5;color:#147a56}
.outdoor-mode .session-submit-status.is-submitted small{color:#61727c}

/* ── UX FIX PACK (Jul 2026): error states, persistent error toasts, slider visibility ── */
.toast.toast-error{display:flex;align-items:center;gap:14px;white-space:normal;max-width:min(92vw,420px);text-align:left;background:#20090b;border:1px solid rgba(239,68,68,.5);color:#fecaca;line-height:1.45}
.toast .toast-dismiss{background:transparent;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:6px;padding:5px 11px;font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;flex-shrink:0}
input[type=range]{transition:opacity .25s}
input[type=range].sl-untouched{opacity:.45}
.load-error{text-align:center;padding:34px 20px;border:1px solid rgba(239,68,68,.28);border-radius:12px;margin:8px 0;background:rgba(239,68,68,.05)}
.load-error-title{font-family:var(--display);font-size:20px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;margin-bottom:6px}
.load-error-sub{font-size:13px;color:var(--muted);margin-bottom:16px}
.load-error-btn{background:var(--run);color:#071116;border:0;border-radius:8px;padding:10px 26px;font-weight:700;font-size:13px;cursor:pointer;font-family:var(--body);display:inline-flex;align-items:center;gap:7px}
.outdoor-mode .toast.toast-error{background:#3b0d10;color:#ffe4e6}

/* ── WEEK AT A GLANCE (bird's-eye strip above the day list) ── */
.week-glance{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;margin:0 0 20px}
.wg-day{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:13px 8px 11px;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;font-family:var(--body);min-width:0;transition:border-color .16s,background .16s,transform .12s}
.wg-day:hover{border-color:rgba(146,210,237,.22);background:rgba(255,255,255,.05);transform:translateY(-1px)}
.wg-day.today{border-color:var(--run-border);background:linear-gradient(180deg,rgba(146,210,237,.12),rgba(255,255,255,.03))}
.wg-day.done{border-color:rgba(115,209,167,.28)}
.wg-name{font-family:var(--mono);font-size:8px;text-transform:uppercase;letter-spacing:.04em;color:var(--dim)}
.wg-date{font-family:var(--display);font-size:16px;font-weight:700;color:var(--text);line-height:1}
.wg-dots{display:flex;gap:3px;align-items:center;min-height:8px}
.wg-dot{width:6px;height:6px;border-radius:50%;display:inline-block}
.wg-dot.run{background:var(--run)}
.wg-dot.strength{background:var(--strength)}
.wg-dot.note{background:var(--pb)}
.wg-rest{font-family:var(--mono);font-size:7px;color:var(--rest);text-transform:uppercase;letter-spacing:.05em}
.wg-done{color:var(--ok);font-size:9px;line-height:1;font-weight:700;min-height:9px}

/* Glance tiles: session labels instead of dots */
.wg-labs{display:flex;flex-direction:column;align-items:center;gap:2px;min-height:12px;max-width:100%}
.wg-lab{font-family:var(--mono);font-size:8px;text-transform:uppercase;letter-spacing:.03em;line-height:1.2;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wg-lab.run{color:var(--run)}
.wg-lab.strength{color:var(--strength)}
.wg-lab.note{color:var(--pb)}
.wg-lab.rest{color:var(--rest)}
.wg-lab.more{color:var(--dim)}

/* Training shell refinement */
.todaypanel{padding:24px;border-radius:20px}
.todayhead{margin-bottom:20px}
.todayeyebrow{font-size:9px;letter-spacing:.16em;text-transform:uppercase}
.todaytitle{max-width:12ch}
.today-subtitle{max-width:44ch;line-height:1.55}
.todaylist{gap:12px}
.todayitem{padding:18px 18px 16px;border-radius:16px}
.todaytarget{border-radius:14px;padding:15px 15px 14px}
.todaytarget .label{font-size:8px;letter-spacing:.14em}
.todaytarget .value{font-size:19px}
.todaytarget .desc{margin-top:7px}
.session-why{margin-top:14px;padding-top:14px}
.todaychip{font-size:9px;letter-spacing:.05em;text-transform:uppercase}

.coach-moment{align-items:flex-start;padding:0 0 18px}
.coach-moment-topline{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:4px}
.coach-moment-label{font-size:13px;font-weight:700}
.coach-moment-tag{font-family:var(--mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:rgba(146,210,237,.82);padding:4px 7px;border-radius:999px;background:rgba(146,210,237,.08);border:1px solid rgba(146,210,237,.16)}
.coach-moment p{font-size:13px;line-height:1.55;max-width:48ch}

.insight-rail{gap:12px}
.insight-card{align-items:flex-start;padding:14px;border-radius:14px;background:rgba(255,255,255,.03)}
.insight-card span{font-size:12px;line-height:1.25}
.insight-card small{margin-top:4px;white-space:normal;overflow:visible;text-overflow:clip;line-height:1.45}
.insight-viz{padding-top:5px}

.command-status-grid{gap:12px;margin-bottom:18px}
.command-status{padding:14px 15px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08)}
.command-status small{letter-spacing:.12em}
.command-status strong{line-height:1.35}
.recovery-warning{border-radius:14px}

.outdoor-mode .week-plan-shell{border-bottom-color:var(--border)}
.outdoor-mode .week-plan-kicker{color:var(--run-strong)}
.outdoor-mode .week-plan-shell .week-plan-title{color:var(--text)}
.outdoor-mode .week-plan-meta span{background:var(--surface2);border-color:var(--border);color:var(--text)}
.outdoor-mode .coach-moment-tag{background:var(--run-bg);border-color:var(--run-border);color:var(--run-strong)}
.outdoor-mode .command-status{background:var(--surface2);border-color:var(--border)}
.outdoor-mode .insight-card{background:var(--surface2)}

@media(max-width:760px){
  .week-plan-shell{display:block;padding-bottom:15px}
  .week-plan-shell .week-plan-title{font-size:24px}
  .week-plan-meta{justify-content:flex-start;margin-top:12px}
  .todaypanel{padding:20px 16px}
  .todaytitle{max-width:none}
  .today-subtitle{max-width:none}
  .coach-moment{grid-template-columns:auto minmax(0,1fr)}
  .coach-moment button{grid-column:2;justify-self:start}
  .insight-rail{grid-template-columns:1fr}
}

/* ══════════════════════════════════════════════════════════════════════
   REDESIGN RESKIN · 2026 premium pass
   CSS-only reskin layered on the existing markup — no structural or JS
   changes. Adopts the concept-render aesthetic: Inter type system, deeper
   teal-black palette, rounded gradient panels, softer semantic accents.
   Blends portal-complete-render + portal-redesign-preview.
   Scoped so light "outdoor mode" keeps its own palette.
   ══════════════════════════════════════════════════════════════════════ */

/* ── Tokens: fonts, accents, radii (shared by BOTH themes) ──────────── */
:root{
  --display:'Inter',ui-sans-serif,system-ui,-apple-system,sans-serif;
  --body:'Inter',ui-sans-serif,system-ui,-apple-system,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,'DM Mono',monospace;

  --run-strong:#d7f1fc;
  --ok:#73d1a7;--ok-bg:rgba(115,209,167,.12);--ok-border:rgba(115,209,167,.28);
  --warn:#ffb76d;--danger:#ff8879;

  --shadow-soft:0 26px 80px rgba(0,0,0,.34);--shadow-blue:0 22px 60px rgba(146,210,237,.10);
  --r-xl:30px;--r-lg:24px;--r-md:18px;--r-sm:14px;
}
/* Dark-theme palette ONLY. Scoped to :not(.outdoor-mode) so the light
   "outdoor" theme keeps its own dark-on-white palette untouched. */
html:not(.outdoor-mode){
  --bg:#071117;
  --surface:#0d1820;--surface2:#101d27;--surface3:#132330;
  --border:rgba(255,255,255,.08);--border-mid:rgba(255,255,255,.14);--border-strong:rgba(146,210,237,.26);
  --text:#f3fbff;--muted:rgba(243,251,255,.72);--dim:rgba(243,251,255,.44);
}

/* ── Ambient background (dark theme only) ───────────────────────────── */
html:not(.outdoor-mode) body,
html:not(.outdoor-mode) #portalScreen{
  background:
    radial-gradient(circle at 12% 6%, rgba(146,210,237,.12), transparent 26%),
    radial-gradient(circle at 88% 14%, rgba(65,119,145,.13), transparent 24%),
    linear-gradient(180deg,#0c1720 0%, var(--bg) 52%, #040b10 100%);
  background-attachment:fixed;
}

/* ── Typography polish ──────────────────────────────────────────────── */
body{font-family:var(--body);letter-spacing:-.005em}
.hn{text-transform:none;letter-spacing:-.045em;font-weight:800}
.page-title,.todaytitle,.stitle,.hero-week-num,
.goals-name,.comms-title,.ci-step-title,.hb-modal-title{letter-spacing:-.03em}
.eyebrow,.hi,.page-kicker,.todayeyebrow,.hero-side-label,.card-title,
.slbl,.ltitle{letter-spacing:.12em}
@media(min-width:900px){ .hn{font-size:66px;letter-spacing:-.05em} }

/* ── Panels: rounded gradient surfaces + soft depth ─────────────────── */
html:not(.outdoor-mode) .card,
html:not(.outdoor-mode) .accordion-card,
html:not(.outdoor-mode) .ci-card,
html:not(.outdoor-mode) .mc,
html:not(.outdoor-mode) .pstat,
html:not(.outdoor-mode) .hb-card,
html:not(.outdoor-mode) .insight-card,
html:not(.outdoor-mode) .command-status{
  border:1px solid var(--border);
  border-radius:var(--r-lg);
  background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 18px 44px rgba(0,0,0,.20);
}
html:not(.outdoor-mode) .todaypanel,
html:not(.outdoor-mode) .goals-hero,
html:not(.outdoor-mode) .comms-card{
  border:1px solid var(--border-strong);
  border-radius:var(--r-xl);
  background:
    radial-gradient(circle at 100% 0%, rgba(146,210,237,.10), transparent 34%),
    linear-gradient(155deg, rgba(19,33,43,.98), rgba(10,18,24,.98));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),var(--shadow-soft);
}
html:not(.outdoor-mode) .hero-main,
html:not(.outdoor-mode) .hero-side{
  border:1px solid var(--border);
  border-radius:var(--r-xl);
  background:linear-gradient(155deg, rgba(19,33,43,.94), rgba(10,18,24,.92));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),var(--shadow-soft);
}

/* Nudge / priority cards */
html:not(.outdoor-mode) .top-shell-priority .nudge-strip,
html:not(.outdoor-mode) #checkinNudge,
html:not(.outdoor-mode) #callConfirmedNudge,
html:not(.outdoor-mode) #photoNudge{
  border:1px solid var(--border);
  border-radius:var(--r-lg);
  background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02));
}

/* Session / list rows a touch rounder */
.sc,.todayitem,.exc,.saved-data,.rtarget,.hero-stat{border-radius:var(--r-md)}
.hero-week{border-radius:var(--r-md)}

/* ── Controls: inputs, buttons, pills, chips ────────────────────────── */
.li,.sin,.stat-input,.why-textarea,.milestone-input,.rpe-in,
.run-field input,.run-field textarea,.run-field select,.pb-search{
  border-radius:var(--r-sm);
}
.savebtn,.save-run-btn,.comms-btn,.goals-prompt-btn,.lbtn,
.ci-btn-next,.ci-btn-back,.quicklog-btn{border-radius:var(--r-sm);font-family:var(--display);font-weight:700;letter-spacing:.01em;text-transform:none}
.hicon,.hp,.chip,.todaychip,.race-opt,.badge,.ex-pill,.plate-pill{border-radius:999px}
.hicon{padding:8px 14px}

/* Accent buttons: subtle gradient lift */
.savebtn,.save-run-btn,.comms-btn,.goals-prompt-btn,.ci-btn-next,.quicklog-btn.ql-nut{
  background:linear-gradient(180deg,#a6ddf3,#92d2ed);color:#05202b;
  box-shadow:0 10px 26px rgba(146,210,237,.28);
}

/* ── Left rail (desktop) refinement ─────────────────────────────────── */
@media(min-width:900px){
  html:not(.outdoor-mode) .tabs{
    background:linear-gradient(rgba(255,255,255,.08),rgba(255,255,255,.08)) 14px 82px/calc(100% - 28px) 1px no-repeat,
      linear-gradient(180deg, rgba(10,18,24,.94), rgba(5,11,16,.92));
    backdrop-filter:blur(22px) saturate(130%);
    border-right:1px solid var(--border);
  }
  html:not(.outdoor-mode) .tab.active{
    border-radius:12px;
    background:linear-gradient(90deg, rgba(146,210,237,.16), rgba(146,210,237,.04));
    box-shadow:inset 3px 0 0 var(--run),inset 0 0 0 1px rgba(146,210,237,.14);
  }
  html:not(.outdoor-mode) header{
    background:rgba(7,17,23,.72);backdrop-filter:blur(22px) saturate(130%);
    border-bottom-color:var(--border);
  }
}

/* Positive chips pick up the softer green */
.saved-feeling,.badge.ok{color:#d8f7e9}

/* ── Sweep polish: mobile radii + light-mode nav contrast ───────────── */
/* Slightly tighter corners on the biggest panels at phone widths */
@media(max-width:640px){
  html:not(.outdoor-mode) .todaypanel,
  html:not(.outdoor-mode) .goals-hero,
  html:not(.outdoor-mode) .comms-card,
  html:not(.outdoor-mode) .hero-main,
  html:not(.outdoor-mode) .hero-side{border-radius:22px}
  html:not(.outdoor-mode) .card,
  html:not(.outdoor-mode) .accordion-card,
  html:not(.outdoor-mode) .ci-card,
  html:not(.outdoor-mode) .mc,
  html:not(.outdoor-mode) .pstat,
  html:not(.outdoor-mode) .hb-card{border-radius:18px}
}
/* Light-mode desktop rail: darken active label so it isn't washed out */
@media(min-width:900px){
  .outdoor-mode .tab.active{color:#0d3f54}
}

/* ── Sweep round 2: header dedupe, nudge fit, progress tightening ────── */

/* Training tab shows a page-intro ("Today's Plan") AND the command-centre
   panel ("Today's command center"). Desktop already hides the intro; do
   the same on mobile so there's a single, clear header. */
#tab-training.active > .page-intro{display:none}

/* "Call booked" nudge lays its title + "Karl & Alex · confirmed" on one
   inline row, which clips on narrow phones. Stack them like the others. */
@media(max-width:640px){
  #callConfirmedNudge .nudge-strip-text{flex-direction:column;align-items:flex-start;gap:3px}
  #callConfirmedNudge .nudge-strip-title{white-space:normal;line-height:1.3}
  #callConfirmedNudge .nudge-strip-sub{white-space:normal}
}

/* Progress tab: tighten cards + stat tiles and trim the chart card's dead
   space so the panels read denser and more polished on mobile. */
@media(max-width:640px){
  #tab-progress .card{padding:16px}
  #tab-progress .pstat{padding:12px 12px}
  #tab-progress .progress-stats{gap:10px}
  #tab-progress .card > div > div:empty{display:none}
}

/* ── Light (outdoor) mode: hero cards must be light at ALL widths ─────
   The base .hero-main/.hero-side are dark, and outdoor only whitened them
   at ≥900px — so on mobile the hero stayed dark with dark text on it.
   Match the other outdoor cards (white surface, dark text) everywhere. */
.outdoor-mode .hero-main,
.outdoor-mode .hero-side{
  background:var(--surface)!important;
  border:1px solid var(--border)!important;
  box-shadow:0 10px 26px rgba(30,55,67,.07)!important;
  color:var(--text);
}
.outdoor-mode .hero-main::before{background:linear-gradient(90deg,transparent,var(--run),transparent)}
.outdoor-mode .hero-week{background:rgba(7,17,22,.04)!important;border-color:var(--border)!important}

/* ── Light mode legibility: muted/dim sub-labels were sitting right at
   the 4.5:1 minimum and reading as "too light". Darken the tokens a step
   so captions, meta text and eyebrows are comfortably visible. ──────── */
html.outdoor-mode{
  --run-strong:#075f82;
  --muted:rgba(7,17,22,.82);
  --dim:rgba(7,17,22,.66);
}
/* Belt-and-braces for the specific eyebrow/caption classes that use dim */
.outdoor-mode .hi,
.outdoor-mode .todayeyebrow,
.outdoor-mode .todaydate,
.outdoor-mode .hero-week-label,
.outdoor-mode .nudge-strip-sub,
.outdoor-mode .smeta,
.outdoor-mode .card-title,
.outdoor-mode .pstat-lbl,
.outdoor-mode .ml,
.outdoor-mode .ci-lbl{color:rgba(7,17,22,.66)!important}

/* Some progress/chart cards render as plain .card but keep a dark
   (#0a0a0a) background in light mode, so their dark title lands on a dark
   surface (invisible). Force every card-like surface to the light surface
   in outdoor mode with ID-level specificity so no stray dark bg survives. */
html.outdoor-mode #portalScreen .card,
html.outdoor-mode #portalScreen .weight-trend-card,
html.outdoor-mode #portalScreen .progress-card,
html.outdoor-mode #portalScreen .progress-panel,
html.outdoor-mode #portalScreen .progress-chart-card,
html.outdoor-mode #portalScreen .progress-spotlight,
html.outdoor-mode #portalScreen .graph-spotlight{
  background:var(--surface)!important;
  border-color:var(--border)!important;
  color:var(--text);
}
/* Keep the chart card's own inner graph surface light too */
html.outdoor-mode #portalScreen .graph-wrap,
html.outdoor-mode #portalScreen .chart-wrap,
html.outdoor-mode #portalScreen .chart-container{background:rgba(7,17,22,.03)!important}

/* Several values/labels use INLINE colors the app's JS hard-codes for the
   dark theme (bright green, amber, translucent-white eyebrows). On white
   they drop below AA. Override the specific inline patterns for light mode. */
/* Bright green metric deltas (rgb 34,197,94) → darker readable green */
.outdoor-mode [style*="34,197,94"],
.outdoor-mode [style*="34, 197, 94"],
.outdoor-mode [style*="#22c55e"]{color:#12894e!important}
/* Amber warnings (rgb 255,170,0) → darker amber */
.outdoor-mode [style*="255,170,0"],
.outdoor-mode [style*="255, 170, 0"]{color:#8a5800!important}
/* NOTE: some sub-panels (check-in step cards, the weight chart) are
   deliberately dark even in light mode, with light inline text. We do NOT
   blanket-darken translucent-white inline text, because that turns those
   panels' labels dark-on-dark. Fully theming those needs the app JS. */

/* ── Border theming per toggle ──────────────────────────────────────────
   Light ("Indoor"/white) toggle: borders fade to near-white so cards read
   as one clean white surface — no dark outlines. Cards stay separated by
   their soft shadow + the off-white page canvas.
   Dark toggle: borders become defined dark ("black") lines.
   Both flow through the --border token the whole stylesheet already uses. */
html:not(.outdoor-mode){
  --border:rgba(0,0,0,.42);
  --border-mid:rgba(0,0,0,.52);
  --border-strong:rgba(0,0,0,.6);
}
html.outdoor-mode{
  --border:rgba(7,17,22,.05);
  --border-mid:rgba(7,17,22,.08);
  --border-strong:rgba(7,17,22,.1);
}
/* A few surfaces hard-code their border instead of using the token —
   pull them onto the token so the toggle stays consistent. */
html.outdoor-mode #portalScreen .weight-trend-card,
html.outdoor-mode #portalScreen .hero-main,
html.outdoor-mode #portalScreen .hero-side,
html.outdoor-mode #portalScreen .nudge-strip,
html.outdoor-mode #portalScreen .sc,
html.outdoor-mode #portalScreen .todayitem,
html.outdoor-mode #portalScreen input,
html.outdoor-mode #portalScreen textarea,
html.outdoor-mode #portalScreen select{border-color:var(--border)!important}
html:not(.outdoor-mode) #portalScreen .hero-main,
html:not(.outdoor-mode) #portalScreen .hero-side,
html:not(.outdoor-mode) #portalScreen .nudge-strip,
html:not(.outdoor-mode) #portalScreen .sc,
html:not(.outdoor-mode) #portalScreen .todayitem,
html:not(.outdoor-mode) #portalScreen .card{border-color:var(--border)!important}

/* ══════════════════════════════════════════════════════════════════════
   FULL RESPONSIVE REDESIGN · v34
   Desktop = persistent command centre. Mobile = focused daily flow.
   This final layer intentionally owns layout, hierarchy and density while
   preserving every existing app interaction and data-bound component.
   ══════════════════════════════════════════════════════════════════════ */
:root{
  --railw:252px;
  --content-max:1280px;
  --shellpad:max(30px,calc((100vw - var(--railw) - var(--content-max))/2));
  --surface-glass:rgba(11,24,32,.78);
}

html:not(.outdoor-mode){
  --bg:#061016;
  --surface:#0c1820;
  --surface2:#101f29;
  --surface3:#152834;
  --border:rgba(255,255,255,.085);
  --border-mid:rgba(255,255,255,.15);
  --border-strong:rgba(146,210,237,.28);
  --text:#f4fbff;
  --muted:rgba(244,251,255,.72);
  --dim:rgba(244,251,255,.46);
}

html:not(.outdoor-mode) body,
html:not(.outdoor-mode) #portalScreen{
  background:
    radial-gradient(circle at 18% -4%,rgba(146,210,237,.14),transparent 30%),
    radial-gradient(circle at 92% 8%,rgba(46,105,132,.14),transparent 26%),
    linear-gradient(180deg,#0b1820 0%,#061016 52%,#03090d 100%);
  background-attachment:fixed;
}

#portalScreen{min-height:100vh}
.portal-context{display:none;min-width:0}
.portal-context-kicker,.portal-context strong{display:block}
.portal-context-kicker{font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.portal-context strong{margin-top:2px;font-size:15px;font-weight:650;letter-spacing:-.015em;color:var(--text)}
.hicon.active{color:var(--run-strong);border-color:var(--run-border);background:var(--run-bg)}

/* Desktop authentication: centered card on the ambient backdrop. */
@media(min-width:900px){
  #loginScreen .login-col{
    position:absolute;top:50%;left:50%;right:auto;
    width:min(420px,calc(100vw - 56px));max-width:420px;min-height:auto;margin:0;
    padding:54px 44px 48px;transform:translate(-50%,-50%);border:1px solid rgba(255,255,255,.09);
    border-radius:30px;background:linear-gradient(155deg,rgba(17,31,40,.9),rgba(6,12,17,.88));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 36px 100px rgba(0,0,0,.42);
    backdrop-filter:blur(24px) saturate(125%);
  }
  #loginScreen.login-authed .login-col{transform:translate(-50%,calc(-50% - 12px)) scale(.985)}
  /* Centered layout: keep the wordmark and footer on the vertical axis. */
  #loginScreen .login-wordmark{left:50%;right:auto;transform:translateX(-50%);text-align:center}
  #loginScreen .login-footer{left:50%;transform:translateX(-50%)}
}

/* ── Desktop command centre ────────────────────────────────────────── */
@media(min-width:900px){
  header,.wbar,.nudge-strip,.tab-content{margin-left:var(--railw)}
  .top-shell{margin-left:var(--railw)}

  header{
    height:68px;padding:0 var(--shellpad);justify-content:space-between;
    background:rgba(6,16,22,.76);border-bottom:1px solid var(--border);
    backdrop-filter:blur(24px) saturate(135%);
  }
  header .logo{display:none}
  .portal-context{display:flex;flex-direction:column;justify-content:center}
  .header-actions{gap:8px}
  .header-actions .hicon{min-height:36px;padding:7px 13px}
  .save-state-pill{min-height:32px;padding:6px 11px;background:rgba(255,255,255,.025)}

  .tabs{
    width:var(--railw);padding:122px 16px 28px;gap:5px;
    border-right:1px solid var(--border);overflow-x:hidden;
  }
  html:not(.outdoor-mode) .tabs{
    background:
      linear-gradient(rgba(255,255,255,.08),rgba(255,255,255,.08)) 16px 98px/calc(100% - 32px) 1px no-repeat,
      radial-gradient(circle at 14% 2%,rgba(146,210,237,.13),transparent 26%),
      linear-gradient(180deg,rgba(8,19,26,.98),rgba(3,9,13,.98));
  }
  .tabs::before{top:29px;left:20px;width:48px;height:48px}
  .tabs::after{top:35px;left:79px;font-size:14px;line-height:1.18;letter-spacing:.1em}
  .tab{
    min-height:48px;padding:13px 15px;border-radius:13px;
    font-size:13px;line-height:1.25;letter-spacing:0;text-transform:none;
  }
  .tabs .tab::before{width:18px;height:18px;flex-basis:18px;margin-right:12px}
  .tab.active{box-shadow:inset 3px 0 0 var(--run),inset 0 0 0 1px rgba(146,210,237,.15)}

  .top-shell{padding:28px var(--shellpad) 24px;background:transparent;border-bottom:0}
  .top-shell>.hero{margin:0 auto;padding:0;max-width:var(--content-max);background:transparent}
  .hero-shell{grid-template-columns:minmax(0,1.42fr) minmax(330px,.58fr);gap:20px;align-items:stretch}
  .hero-main,.hero-side{min-height:336px;padding:32px;border-radius:28px}
  .hero-main{display:flex;flex-direction:column;justify-content:center;gap:18px}
  .hero-side{display:flex;flex-direction:column;justify-content:center}
  .hero-main::before{left:32px;right:32px}
  .hi{font-size:10px;color:var(--dim)}
  .hn{font-size:clamp(54px,5vw,76px);line-height:.9;max-width:12ch}
  .hero-name-row{align-items:flex-start;margin:0}
  .hero-week{min-width:118px;padding:15px 17px;text-align:left;background:rgba(255,255,255,.035)}
  .hero-week-num{font-size:34px;margin-top:3px}
  .hero-support{max-width:58ch;font-size:15px;line-height:1.55;color:var(--muted)}
  .hero-bottom{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:end;gap:18px;margin-top:2px}
  .hpills{align-self:end}
  .hero-stat-grid{gap:10px}
  .hero-stat{padding:13px 14px;background:rgba(255,255,255,.032)}
  .hero-stat-value{font-size:24px}
  .hero-side-label{margin-bottom:16px}
  .week-rings{grid-template-columns:1fr;gap:12px}
  .ring-item{min-height:94px;padding:16px 17px;border-radius:18px;background:rgba(255,255,255,.03)}
  .ring-wrap,.ring-svg{width:64px;height:64px}
  .ring-val{font-size:22px}

  .top-shell-priority{
    grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;
    max-width:var(--content-max);margin:14px auto 0;
  }
  .top-shell-priority .nudge-strip{padding:15px 16px;border-radius:18px;min-width:0}
  .top-shell-priority .nudge-strip-inner{height:100%}

  .tab-content{padding:30px var(--shellpad) 150px}
  .tab-content.active>*{max-width:var(--content-max);margin-left:auto;margin-right:auto}
  #tab-training.active,#tab-weekly.active{max-width:none}
  #tab-training .todaywrap,#tab-weekly>#weeklyCalEl{max-width:var(--content-max);margin-left:auto;margin-right:auto}
  #tab-training .todaywrap{position:static;max-height:none;overflow:visible}
  #tab-training .todaypanel{padding:30px;border-radius:28px;filter:none}
  .todayeyebrow{font-size:10px}
  .todaytitle{font-size:40px;line-height:1;max-width:18ch}
  .today-subtitle{font-size:15px}
  .coach-moment{padding:2px 0 20px;margin-bottom:20px}
  .insight-rail{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
  .insight-card{min-height:82px;padding:15px}
  .command-status-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .command-status.next-session{grid-column:auto}
  .command-status{min-height:76px}
  .todaylist{gap:14px}
  .todayitem{padding:20px;border-radius:18px}

  #tab-progress.active{max-width:none}
  #tab-progress>*{max-width:1120px}
  #tab-progress>.progress-stats{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  #tab-checkin.active{grid-template-columns:minmax(310px,360px) minmax(0,1fr);max-width:1180px;gap:32px}
  #tab-comms.active,#tab-handbook.active{max-width:none}
  #tab-comms>*{max-width:900px}
  #tab-handbook>*{max-width:1120px}

  .quicklog-strip{left:calc(var(--railw) + (100vw - var(--railw))/2);width:min(760px,calc(100vw - var(--railw) - 56px))}
}

@media(min-width:1180px){
  .hero-main,.hero-side{min-height:354px}
  #tab-goals.active{gap:0 30px}
  #nutContent{gap:0 30px}
}

/* ── Tablet bridge ─────────────────────────────────────────────────── */
@media(min-width:761px) and (max-width:899px){
  .top-shell{padding:18px 22px}
  .hero-shell{grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:14px}
  .hero-main,.hero-side{padding:24px;min-height:290px}
  .hn{font-size:52px}
  .hero-support{font-size:14px}
  .hero-bottom{gap:12px}
  .hero-stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hero-stat{padding:11px}
  .hero-stat-value{font-size:20px}
  .week-rings{grid-template-columns:1fr}
  .top-shell-priority{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tab-content{max-width:860px;padding-left:22px;padding-right:22px}
}

/* ── Mobile editorial focus ────────────────────────────────────────── */
@media(max-width:760px){
  header{height:62px;padding:0 12px;background:rgba(6,16,22,.88);backdrop-filter:blur(20px)}
  .logo{gap:8px}.logo-img{width:32px;height:32px}.logo-text{font-size:11px}
  .header-actions{gap:5px}
  .save-state-pill{height:34px;padding:5px 9px}
  .save-state-pill b{font-size:10px}
  .header-actions .theme-toggle{width:36px;height:36px;padding:0;justify-content:center}
  .theme-toggle-label{display:none}

  .top-shell{padding:12px 12px 8px;background:transparent}
  .hero-shell{gap:10px}
  .hero-main,.hero-side{padding:20px;border-radius:22px;min-height:0}
  .hero-main{gap:0}
  .hero-main::before{left:20px;right:20px}
  .hi{font-size:10px;margin-bottom:10px}
  .hero-name-row{align-items:flex-start;margin-bottom:12px}
  .hn{font-size:42px;line-height:.9;max-width:8ch}
  .hero-week{min-width:76px;padding:10px 11px;border-radius:14px;text-align:left}
  .hero-week-num{font-size:25px;margin-top:2px}
  .hero-support{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13px;line-height:1.45}
  .hero-bottom{display:block;margin-top:14px}
  .hpills{margin-bottom:10px}
  .hp{padding:6px 10px;font-size:10px}
  
  
  
  .hero-stat-value{font-size:20px;margin-top:4px}

  
  
  
  
  
  
  
  

  .top-shell-priority{gap:8px;margin-top:8px}
  .top-shell-priority .nudge-strip{padding:12px 13px;border-radius:15px}
  .nudge-strip-title{text-transform:none;letter-spacing:-.01em;font-size:13px}
  .nudge-strip-sub{font-size:10px}

  .tab-content{padding:12px 12px 188px}
  .page-intro{margin-bottom:12px}
  #tab-training .todaypanel{padding:20px 16px 18px;border-radius:22px;box-shadow:0 20px 50px rgba(0,0,0,.28)}
  .todayhead{display:block;margin-bottom:18px}
  .todaytitle{font-size:34px;line-height:1;max-width:none}
  .today-subtitle{font-size:13px;margin-top:7px}
  .todaydate{margin-top:8px;padding:0}
  .coach-moment{grid-template-columns:auto minmax(0,1fr);gap:11px;padding-bottom:16px;margin-bottom:16px}
  .coach-moment button{grid-column:2;width:40px;height:40px}
  .coach-moment p{font-size:13px}
  .insight-rail{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .insight-card{min-height:76px;padding:11px}
  .command-status-grid{grid-template-columns:1fr;gap:8px}
  .command-status.next-session{grid-column:auto}
  .command-status{min-height:66px;padding:12px 13px}
  .todayitem{padding:16px 14px;border-radius:16px}
  .todayname{font-size:20px}
  .todaytarget{padding:13px}
  .today-actions{gap:8px}
  .today-action{min-height:46px}

  .progress-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px}
  #tab-progress .pstat{min-height:92px;padding:14px}
  .macro-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .macro-grid .mc.fibre{grid-column:auto!important}
  .ci-grid{grid-template-columns:1fr}
  .week-glance{gap:5px;overflow-x:auto;padding-bottom:4px;scroll-snap-type:x proximity}
  .wg-day{min-width:62px;padding:10px 6px;border-radius:14px;scroll-snap-align:start}

  .quicklog-strip{bottom:calc(80px + env(safe-area-inset-bottom));left:8px;right:8px}
  .mobile-nav{left:8px;right:8px;bottom:calc(7px + env(safe-area-inset-bottom));min-height:64px;border-radius:18px}
  .mobile-nav-item{min-height:50px}
  .mobile-nav-item.active{background:rgba(146,210,237,.08)}
  .mobile-nav-item.active::before{display:none}
  .wa-fab{bottom:145px!important;right:12px}
  .more-menu-sheet{max-height:88vh;overflow-y:auto}
}

@media(max-width:390px){
  .save-state-pill b{display:none}
  .hn{font-size:37px}
  .hero-main{padding:18px}
  .hero-stat{padding:9px 7px}
  .hero-stat-value{font-size:18px}
  .week-rings{grid-template-columns:1fr}
  .ring-item{min-height:62px}
  .insight-rail{grid-template-columns:1fr}
}

/* Daylight mode mirrors the hierarchy without losing contrast. */
.outdoor-mode .portal-context strong{color:var(--text)}
.outdoor-mode .portal-context-kicker{color:var(--dim)}
.outdoor-mode .hicon.active{color:var(--run-strong);border-color:var(--run-border);background:var(--run-bg)}
.outdoor-mode .hero-support{color:var(--muted)}

.outdoor-mode .hero-stat-value{color:var(--text)}
.outdoor-mode .mobile-nav-item.active{background:var(--run-bg)}
@media(min-width:900px){
  .outdoor-mode header{background:rgba(255,255,255,.84)}
  .outdoor-mode .tabs{
    background:
      linear-gradient(rgba(7,17,22,.09),rgba(7,17,22,.09)) 16px 98px/calc(100% - 32px) 1px no-repeat,
      linear-gradient(180deg,rgba(255,255,255,.98),rgba(244,248,250,.98));
  }
  
}

/* ══════════════════════════════════════════════════════════════════════
   MOBILE WEEK + HERO SIGNALS · v35
   Keeps all seven days on-screen and makes the three headline metrics
   explanatory, visual and interactive.
   ══════════════════════════════════════════════════════════════════════ */
button.hero-stat{
  appearance:none;-webkit-appearance:none;width:100%;margin:0;font:inherit;color:inherit;text-align:left;
}

.hero-stat-note{margin-top:7px;color:var(--dim);font-family:var(--mono);font-size:9px;line-height:1.35;letter-spacing:.015em}

.hero-readiness-ring{
  --value:0;width:48px;height:48px;flex:0 0 48px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle closest-side,var(--surface) 69%,transparent 71%),conic-gradient(#73d1a7 calc(var(--value)*1%),rgba(255,255,255,.08) 0);
  transition:background .3s ease;
}
.hero-readiness-ring .hero-stat-value{margin:0;font-size:16px;letter-spacing:-.03em}
.hero-readiness-wrap .hero-stat-note{margin:0;max-width:10ch}

.hero-pb-value .icon{width:17px;height:17px;color:var(--pb)}
.hero-pb-value .hero-stat-value{margin-top:0}

.outdoor-mode .hero-readiness-ring{background:radial-gradient(circle closest-side,#fff 69%,transparent 71%),conic-gradient(#23804b calc(var(--value)*1%),rgba(7,17,22,.1) 0)}

@media(min-width:900px){
  
  
  .hero-stat-progress .hero-stat-value,.hero-stat-pbs .hero-stat-value{font-size:25px}
  .hero-readiness-ring{width:52px;height:52px;flex-basis:52px}
  .hero-readiness-ring .hero-stat-value{font-size:17px}
}

@media(max-width:760px){
  html,body,#portalScreen{max-width:100%;overflow-x:hidden}
  #calEl,#weeklyCalEl,.weeklyplan-wrap{max-width:100%;overflow-x:hidden}

  .hero-stat-grid{align-items:stretch}
  .hero-stat-action{min-height:118px;display:flex;flex-direction:column;padding:10px 9px}
  .hero-stat-action .hero-stat-label{min-height:20px;white-space:normal;line-height:1.2}
  .hero-stat-action .hero-stat-row{margin-top:auto}
  .hero-stat-action .hero-stat-value{font-size:20px}
  .hero-stat-note{font-size:8px;line-height:1.3}
  .hero-readiness-wrap{flex-direction:column;align-items:flex-start;gap:5px;margin-top:auto}
  .hero-readiness-ring{width:44px;height:44px;flex-basis:44px}
  .hero-readiness-ring .hero-stat-value{font-size:15px}
  .hero-readiness-wrap .hero-stat-note{max-width:none;white-space:nowrap}
  .hero-pb-value .icon{width:15px;height:15px}

  /* Seven equal columns: no horizontal swipe and no clipped Sunday. */
  .week-glance{
    width:100%;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;
    margin-bottom:18px;padding:0;overflow:visible;scroll-snap-type:none;
  }
  .wg-day{
    width:100%;min-width:0;min-height:78px;padding:8px 2px 7px;gap:3px;
    border-radius:12px;overflow:hidden;scroll-snap-align:none;
  }
  .wg-name{font-size:7px;letter-spacing:0}
  .wg-date{font-size:15px}
  .wg-labs{width:100%;min-height:18px;gap:1px}
  .wg-lab{display:block;width:100%;padding:0 1px;font-size:7px;letter-spacing:0;text-align:center;text-overflow:ellipsis}
  .wg-done{min-height:9px;font-size:9px}
}

@media(max-width:390px){
  .week-glance{gap:2px}
  .wg-day{min-height:73px;padding-left:1px;padding-right:1px;border-radius:10px}
  .wg-name,.wg-lab{font-size:6.5px}
  .wg-date{font-size:14px}
  
  .hero-readiness-ring{width:40px;height:40px;flex-basis:40px}
  .hero-readiness-ring .hero-stat-value{font-size:14px}
}

/* ══════════════════════════════════════════════════════════════════════
   APPLE-STYLE MOBILE TRAINING CALENDAR · v45
   A focused seven-day agenda keeps real session names and doubles readable.
   Tapping a day opens that workout in the existing focused session workspace.
   ══════════════════════════════════════════════════════════════════════ */
.week-plan-title-mobile,.week-plan-subtitle-mobile,.week-calendar-hint,.month-calendar-actions,.month-weekdays,.month-grid{display:none}
.mobile-week-agenda{display:none}
body.day-plan-open{overflow:hidden}
.day-plan-overlay{
  position:fixed;inset:0;z-index:220;display:flex;align-items:center;justify-content:center;overflow:hidden;
  padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom));
  background:rgba(1,7,11,.4);color:var(--text);opacity:0;visibility:hidden;pointer-events:none;
  backdrop-filter:blur(0);transition:opacity .2s ease,visibility .2s,backdrop-filter .24s ease;
}
.day-plan-overlay.open{opacity:1;visibility:visible;pointer-events:auto;backdrop-filter:blur(3px)}
.day-plan-dialog{
  width:min(100%,560px);max-height:calc(100dvh - 76px);display:flex;flex-direction:column;overflow:hidden;
  border:1px solid rgba(146,210,237,.2);border-radius:28px;
  background:radial-gradient(circle at 96% 0%,rgba(146,210,237,.13),transparent 30%),linear-gradient(180deg,rgba(12,27,36,.99),rgba(4,12,17,.99));
  box-shadow:0 32px 90px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.055);
  transform:translateY(20px) scale(.975);opacity:.7;transition:transform .26s cubic-bezier(.2,.8,.2,1),opacity .2s ease;
}
.day-plan-overlay.open .day-plan-dialog{transform:none;opacity:1}
.day-plan-topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex:0 0 auto;padding:13px 14px 8px;background:transparent}
.day-plan-pager{display:flex;align-items:center;gap:8px}
.day-plan-pager button{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--border);border-radius:50%;background:rgba(255,255,255,.045);color:var(--text);cursor:pointer}
.day-plan-pager button .icon{width:15px;height:15px}
.day-plan-pager button:disabled{opacity:.25;cursor:default}
.day-plan-close{width:38px;height:38px;display:grid;place-items:center;padding:0;border:1px solid var(--border);border-radius:50%;background:rgba(255,255,255,.055);color:var(--text);font:300 27px/1 var(--body);cursor:pointer}
.day-plan-close:focus-visible{outline:2px solid var(--run);outline-offset:2px}
.day-plan-heading{flex:0 0 auto;padding:0 18px 13px;border-bottom:1px solid var(--border)}
.day-plan-kicker{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--run);margin-bottom:7px}
.day-plan-heading h2{font-size:30px;line-height:.98;letter-spacing:-.04em;font-weight:750;color:var(--text)}
.day-plan-meta{margin-top:6px;font-size:12px;color:var(--muted)}
.day-plan-scroll{flex:0 1 auto;min-height:0;max-height:calc(100dvh - 215px);overflow-y:auto;-webkit-overflow-scrolling:touch;padding:10px 10px 14px;overscroll-behavior:contain}
.day-plan-scroll .sc{margin:0 0 10px;border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.052),rgba(255,255,255,.02));box-shadow:0 14px 34px rgba(0,0,0,.2)}
.day-plan-scroll .sch{padding:12px 12px}
.day-plan-scroll .scb.open{display:block}
.day-plan-scroll .scb{padding-left:10px;padding-right:10px;padding-bottom:10px}
.day-plan-scroll .run-details{padding:0;background:transparent;border-top:0}
.day-plan-scroll .run-prescription-card{border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.day-plan-scroll .run-prescription-head{padding:8px 2px 9px!important;background:transparent!important}
.day-plan-scroll .run-prescription-title{display:none}
.day-plan-scroll .run-prescription-badges{gap:5px!important}
.day-plan-scroll .run-prescription-badges>div{font-size:9px!important;padding:3px 7px!important}
.day-plan-scroll .run-prescription-badges>div:last-child{flex:1 1 100%;font-size:11px!important;line-height:1.35!important;padding:1px 0 0!important}
.day-plan-scroll .run-prescription-body{padding:9px 0 2px!important;gap:8px!important;background:transparent!important}
.day-plan-scroll .run-prescription-row{grid-template-columns:62px 1fr!important;gap:6px!important;padding:6px 8px!important}
.day-plan-scroll .run-prescription-row span:first-child{font-size:8px!important}
.day-plan-scroll .run-prescription-row span:last-child{font-size:12px!important;line-height:1.3!important}
.day-plan-scroll .run-coach-note{padding:8px 10px!important}
.day-plan-scroll .run-coach-note>div:first-child{margin-bottom:3px!important;font-size:8px!important}
.day-plan-scroll .run-coach-note>div:last-child{font-size:11px!important;line-height:1.4!important}
.day-plan-scroll .run-alternative{padding-top:7px!important;margin-top:0!important}
.day-plan-scroll .run-alternative>div:first-child{margin-bottom:2px!important;font-size:8px!important}
.day-plan-scroll .run-alternative>div:nth-child(2){display:inline;font-size:11px!important;margin:0 5px 0 0!important}
.day-plan-scroll .run-alternative>div:last-child{display:inline;font-size:10px!important;line-height:1.35!important}
.day-plan-scroll .run-log{margin-top:9px;padding-top:9px}
.day-plan-rest{padding:24px 20px;border:1px solid var(--border);border-radius:20px;background:linear-gradient(155deg,rgba(19,33,43,.96),rgba(10,18,24,.96));box-shadow:0 18px 44px rgba(0,0,0,.24)}
.day-plan-rest-mark{display:inline-flex;padding:6px 10px;border:1px solid var(--border);border-radius:999px;font-family:var(--mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.day-plan-rest h3{margin-top:18px;font-size:28px;line-height:1.05;letter-spacing:-.035em}
.day-plan-rest p{margin-top:10px;max-width:34ch;color:var(--muted);font-size:14px;line-height:1.55}
.outdoor-mode .day-plan-overlay{background:rgba(23,42,51,.2);color:var(--text)}
.outdoor-mode .day-plan-dialog{background:linear-gradient(180deg,rgba(255,255,255,.99),rgba(244,248,250,.99));border-color:rgba(8,127,174,.22);box-shadow:0 32px 80px rgba(30,55,67,.2),inset 0 1px 0 #fff}
.outdoor-mode .day-plan-pager button,.outdoor-mode .day-plan-scroll .sc,.outdoor-mode .day-plan-rest{background:#fff;border-color:var(--border);box-shadow:0 14px 34px rgba(30,55,67,.09)}
.outdoor-mode .day-plan-close{background:#fff;border-color:var(--border)}

@media(max-width:760px){
  body.mobile-training-calendar{height:100dvh;overflow:hidden}
  body.mobile-training-calendar #portalScreen{height:100dvh;min-height:0;overflow:hidden}
  body.mobile-training-calendar .top-shell{display:none}
  body.mobile-training-calendar .wbar{display:none}
  body.mobile-training-calendar #tab-training.active{
    display:flex;flex-direction:column;height:calc(100dvh - 62px);min-height:calc(100vh - 62px);
    padding-top:10px;padding-bottom:calc(88px + env(safe-area-inset-bottom));overflow:hidden;
  }
  body.mobile-training-calendar #calEl{
    display:flex!important;flex:1 1 auto;min-height:0;flex-direction:column;
  }
  body.mobile-training-calendar .quicklog-strip,body.mobile-training-calendar .wa-fab{display:none!important}
  .week-plan-title-desktop,.week-plan-subtitle-desktop{display:none}
  .week-plan-title-mobile,.week-plan-subtitle-mobile{display:inline}
  .week-plan-shell{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding:8px 2px 14px;margin-bottom:0;border-bottom:0}
  .week-plan-heading-copy{min-width:0;flex:1 1 auto}
  .week-plan-kicker{font-size:9px;letter-spacing:.14em;color:var(--run)}
  .week-plan-shell .week-plan-title{margin-top:4px;font-size:31px;line-height:1;letter-spacing:-.04em;white-space:nowrap}
  .week-plan-subtitle{max-width:26ch;margin-top:7px;font-size:11px;line-height:1.35;color:var(--muted)}
  .week-plan-meta{display:none}
  .month-calendar-actions{display:flex;align-items:center;gap:5px;flex:0 0 auto}
  .month-calendar-actions button{height:34px;min-width:34px;display:grid;place-items:center;padding:0;border:1px solid var(--border);border-radius:50%;background:rgba(255,255,255,.035);color:var(--text);cursor:pointer}
  .month-calendar-actions button .icon{width:15px;height:15px}
  .month-calendar-actions .month-today-btn{width:auto;min-width:0;padding:0 9px;border-radius:999px;font:600 10px var(--body);color:var(--run)}
  .month-calendar-actions .month-today-btn{background:var(--run);border-color:var(--run);color:#05202b;font-weight:800;box-shadow:0 7px 18px rgba(146,210,237,.18)}

  .mobile-week-agenda{
    display:flex;flex:1 1 auto;min-height:0;flex-direction:column;overflow-y:auto;
    border-top:1px solid var(--border);border-bottom:1px solid var(--border);
    overscroll-behavior:contain;scroll-padding-block:8px;scrollbar-width:thin;
    -webkit-overflow-scrolling:touch;
  }
  .mobile-week-day{
    position:relative;display:grid;grid-template-columns:48px minmax(0,1fr) 20px;align-items:center;gap:10px;
    flex:0 0 auto;min-width:0;min-height:68px;padding:6px 5px 6px 2px;border:0;border-bottom:1px solid rgba(255,255,255,.065);
    background:transparent;color:var(--text);font:inherit;text-align:left;cursor:pointer;
  }
  .mobile-week-day:last-child{border-bottom:0}
  .mobile-week-day button:focus-visible{z-index:2;outline:2px solid var(--run);outline-offset:2px}
  .mobile-week-day.selected{background:rgba(146,210,237,.055)}
  .mobile-week-day.multi-session{align-items:start;padding-top:8px;padding-bottom:8px}
  .mobile-week-day.multi-session .mobile-week-date,.mobile-week-day.multi-session .mobile-week-status{margin-top:3px}
  .mobile-week-day.today{
    background:linear-gradient(90deg,rgba(146,210,237,.16),rgba(146,210,237,.025) 62%,transparent);
    box-shadow:inset 3px 0 0 var(--run);
  }
  .mobile-week-date{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;padding:0;border:0;background:transparent;color:inherit;font:inherit;cursor:pointer}
  .mobile-week-date small{font-family:var(--mono);font-size:8px;line-height:1;text-transform:uppercase;letter-spacing:.08em;color:var(--dim)}
  .mobile-week-date strong{width:30px;height:30px;display:grid;place-items:center;margin-top:4px;border-radius:50%;font-size:17px;line-height:1}
  .mobile-week-date em{margin-top:2px;font:700 7px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--run)}
  .mobile-week-day.today .mobile-week-date strong{background:var(--run);color:#05202b;box-shadow:0 6px 18px rgba(146,210,237,.3)}
  .mobile-week-sessions{display:flex;flex-direction:column;justify-content:center;gap:4px;min-width:0}
  .mobile-week-session{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:7px;min-width:0;min-height:34px;padding:6px 8px;border:0;border-radius:8px;background:rgba(255,255,255,.055);box-shadow:inset 3px 0 0 rgba(255,255,255,.48);color:inherit;font:inherit;text-align:left;cursor:pointer;transition:background .16s ease,box-shadow .16s ease,transform .12s ease}
  .mobile-week-session:active{transform:scale(.985)}
  .mobile-week-session.run{background:rgba(146,210,237,.12);box-shadow:inset 3px 0 0 var(--run)}
  .mobile-week-session.note{background:rgba(182,144,255,.11);box-shadow:inset 3px 0 0 var(--pb)}
  .mobile-week-session.rescheduled{box-shadow:inset 3px 0 0 #f0b85b}
  .mobile-week-session.done{background:rgba(34,197,94,.14);box-shadow:inset 3px 0 0 var(--ok),inset 0 0 0 1px rgba(34,197,94,.08)}
  .mobile-week-session>span{min-width:0}
  .mobile-week-session strong,.mobile-week-session small{display:block;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mobile-week-session strong{font-size:11px;line-height:1.1;font-weight:750;color:var(--text)}
  .mobile-week-session small{margin-top:2px;font-family:var(--mono);font-size:7px;line-height:1;color:var(--muted)}
  .mobile-week-session.done strong{color:#9be4bf}
  .mobile-week-session-marks{display:flex;align-items:center;justify-content:flex-end;gap:6px}
  .mobile-week-key{font-style:normal;font-size:9px;line-height:1;color:var(--run)}
  .mobile-week-complete{display:none;width:17px;height:17px;place-items:center;border-radius:50%;background:var(--ok);color:#04120b}
  .mobile-week-complete .icon{width:11px;height:11px;stroke-width:3}
  .mobile-week-session.done .mobile-week-complete{display:grid}
  .mobile-week-session.done .mobile-week-chevron{display:none}
  .mobile-week-chevron{font-style:normal;font-size:16px;line-height:1;color:var(--dim)}
  .mobile-week-rest{padding:9px 8px;border:0;background:transparent;color:var(--dim);font:inherit;font-size:11px;text-align:left;cursor:pointer}
  .mobile-week-status{display:grid;place-items:center;padding:0;border:0;background:transparent;color:var(--dim);font:inherit;font-size:17px;cursor:pointer}
  .mobile-week-day.done .mobile-week-status{color:var(--ok);font-weight:850}
  .mobile-week-day.missed .mobile-week-status{width:17px;height:17px;border-radius:50%;background:rgba(240,184,91,.14);color:#f0b85b;font-size:10px;font-weight:850}
  .outdoor-mode .mobile-week-day{border-color:rgba(7,17,22,.09)}
  .outdoor-mode .mobile-week-day.today{background:linear-gradient(90deg,rgba(8,127,174,.13),rgba(8,127,174,.025) 62%,transparent)}
  .outdoor-mode .mobile-week-session{background:rgba(7,17,22,.045)}
  .outdoor-mode .mobile-week-session.run{background:rgba(8,127,174,.08)}
  .outdoor-mode .mobile-week-session.done{background:rgba(34,197,94,.12);box-shadow:inset 3px 0 0 var(--ok),inset 0 0 0 1px rgba(34,197,94,.1)}
  .outdoor-mode .mobile-week-session.done strong{color:#137a49}

  .month-weekdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));padding:8px 0 7px;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
  .month-weekdays span{text-align:center;font-family:var(--mono);font-size:7px;line-height:1;text-transform:uppercase;letter-spacing:.04em;color:var(--dim)}
  .month-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);flex:1 1 auto;min-height:0;width:100%;border-bottom:1px solid var(--border)}
  .month-day{
    position:relative;display:flex;flex-direction:column;align-items:stretch;min-width:0;min-height:0;
    padding:8px 4px 6px;border:0;border-right:1px solid rgba(255,255,255,.045);border-bottom:1px solid rgba(255,255,255,.055);
    border-radius:0;background:transparent;color:var(--text);font:inherit;text-align:left;overflow:hidden;cursor:pointer;
  }
  .month-day:nth-child(7n){border-right:0}
  .month-day:focus-visible{z-index:2;outline:2px solid var(--run);outline-offset:-2px}
  .month-day.selected{background:rgba(146,210,237,.055)}
  .month-day.outside-month{opacity:.32}
  .month-day.today{
    z-index:1;background:linear-gradient(180deg,rgba(146,210,237,.19),rgba(146,210,237,.055));
    box-shadow:inset 0 0 0 1px rgba(146,210,237,.48),0 0 24px rgba(77,169,207,.09);
  }
  .month-day.today::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--run);box-shadow:0 2px 10px rgba(146,210,237,.42)}
  .month-date{width:30px;height:30px;display:grid;place-items:center;align-self:center;border-radius:50%;font-size:16px;line-height:1;font-weight:700;color:var(--text)}
  .month-day.today .month-date{width:34px;height:34px;background:var(--run);color:#05202b;font-size:17px;font-weight:850;box-shadow:0 6px 18px rgba(146,210,237,.45)}
  .month-day.today .month-session{filter:saturate(1.08)}
  .month-session-list{display:flex;flex-direction:column;gap:4px;min-width:0;margin-top:7px}
  .month-session{display:block;min-width:0;padding:4px;border-radius:5px;font-family:var(--body);font-size:9px;line-height:1.1;font-weight:750;color:#06131a;background:var(--run);overflow:hidden}
  .month-session-line{display:flex;align-items:center;gap:2px;min-width:0}
  .month-session-line strong{display:block;min-width:0;flex:1 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:inherit}
  .month-session-time{flex:0 0 auto;font-family:var(--mono);font-size:6px;line-height:1;color:rgba(6,19,26,.72);letter-spacing:.02em}
  .month-session small{display:block;min-width:0;margin-top:2px;font-family:var(--mono);font-size:6.5px;line-height:1.1;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:rgba(6,19,26,.68)}
  .month-key{flex:0 0 auto;font-style:normal;font-size:7px;line-height:1;color:#174b5e}
  .month-session.strength{color:var(--text);background:rgba(255,255,255,.13);box-shadow:inset 2px 0 0 rgba(244,251,255,.72)}
  .month-session.strength .month-session-time,.month-session.strength small{color:var(--muted)}
  .month-session.strength .month-key{color:var(--pb)}
  .month-session.run{background:var(--run)}
  .month-session.note{color:#1b1121;background:var(--pb)}
  .month-session.note .month-session-time,.month-session.note small{color:rgba(27,17,33,.68)}
  .month-session.rescheduled{box-shadow:inset 2px 0 0 #f0b85b}
  .month-session.more{color:var(--muted);background:rgba(255,255,255,.055);font-weight:600}
  .month-rest-label{display:block;margin-top:5px;text-align:center;font-family:var(--mono);font-size:7px;line-height:1;text-transform:uppercase;letter-spacing:.08em;color:var(--dim)}
  .month-done{position:absolute;top:10px;right:5px;color:var(--ok);font-size:10px;font-weight:800}
  .month-missed{position:absolute;top:9px;right:5px;width:12px;height:12px;display:grid;place-items:center;border-radius:50%;background:rgba(240,184,91,.14);color:#f0b85b;font-size:8px;line-height:1;font-weight:850}
  .outdoor-mode .month-day{border-color:rgba(7,17,22,.08)}
  .outdoor-mode .month-day.today{background:linear-gradient(180deg,rgba(8,127,174,.16),rgba(8,127,174,.045));box-shadow:inset 0 0 0 1px rgba(8,127,174,.45),0 10px 24px rgba(30,55,67,.08)}
  .outdoor-mode .month-calendar-actions button{background:#fff;border-color:var(--border)}
  .outdoor-mode .month-session.strength{background:rgba(7,17,22,.08);box-shadow:inset 2px 0 0 rgba(7,17,22,.46)}

  .week-glance{
    position:relative;width:100%;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px;
    margin:0;padding:14px 0 12px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);
  }
  .wg-day,.wg-day:hover,.wg-day.today,.wg-day.done{
    min-width:0;min-height:88px;padding:3px 1px 5px;gap:6px;border:0!important;border-radius:12px;
    background:transparent!important;box-shadow:none!important;transform:none;
  }
  .wg-day.selected{background:rgba(146,210,237,.055)!important}
  .wg-name{font-size:9px;line-height:1;letter-spacing:.02em;color:var(--dim)}
  .wg-date{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;font-size:17px;line-height:1;color:var(--text)}
  .wg-day.today .wg-date{background:var(--run);color:#05202b;box-shadow:0 7px 20px rgba(146,210,237,.24)}
  .wg-day.selected:not(.today) .wg-date{box-shadow:inset 0 0 0 1.5px var(--run);color:var(--run-strong)}
  .wg-labs{width:auto;min-height:7px;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:3px}
  .wg-lab{width:5px;height:5px;flex:0 0 5px;padding:0;border-radius:50%;font-size:0!important;line-height:0;overflow:hidden}
  .wg-lab.run{background:var(--run)}
  .wg-lab.strength{background:rgba(244,251,255,.76)}
  .wg-lab.note{background:var(--pb)}
  .wg-lab.rest{width:4px;height:4px;flex-basis:4px;background:transparent;border:1px solid var(--dim)}
  .wg-lab.more{background:var(--dim)}
  .wg-done{min-height:10px;font-size:10px;color:var(--ok)}

  .week-calendar-hint{display:flex;align-items:center;gap:13px;margin-top:18px;padding:17px;border:1px solid var(--border);border-radius:18px;background:rgba(255,255,255,.025)}
  .week-calendar-hint>.icon{width:22px;height:22px;color:var(--run)}
  .week-calendar-hint strong,.week-calendar-hint span{display:block}
  .week-calendar-hint strong{font-size:14px;color:var(--text)}
  .week-calendar-hint span{margin-top:2px;font-size:12px;color:var(--muted)}
  .outdoor-mode .week-calendar-hint{background:#fff;border-color:var(--border);box-shadow:0 10px 24px rgba(30,55,67,.06)}
}

@media(max-width:390px){
  .week-plan-shell{gap:7px}
  .week-plan-shell .week-plan-title{font-size:28px}
  .week-plan-subtitle{font-size:10px}
  .month-calendar-actions{gap:3px}
  .month-calendar-actions button{height:31px;min-width:31px}
  .month-calendar-actions .month-today-btn{padding:0 7px;font-size:9px}
  .mobile-week-day{grid-template-columns:43px minmax(0,1fr) 17px;gap:7px;padding-top:5px;padding-bottom:5px}
  .mobile-week-day.multi-session{padding-top:7px;padding-bottom:7px}
  .mobile-week-date strong{width:27px;height:27px;font-size:15px}
  .mobile-week-session{padding:5px 7px}
  .mobile-week-session strong{font-size:10px}
  .month-day{padding:6px 3px 5px}
  .month-date{width:27px;height:27px;font-size:15px}
  .month-day.today .month-date{width:31px;height:31px;font-size:16px}
  .month-session-list{gap:3px;margin-top:5px}
  .month-session{font-size:8px;padding:3px}
  .month-session small{font-size:6px}
  .month-session-time{font-size:5.5px}
  .wg-day,.wg-day:hover,.wg-day.today,.wg-day.done{min-height:84px}
  .wg-name{font-size:8px}
  .wg-date{width:31px;height:31px;font-size:16px}
  .day-plan-heading h2{font-size:28px}
}

/* ══════════════════════════════════════════════════════════════════════
   MOBILE HOME — prioritize today's work over dashboard density.
   The athlete snapshot stays useful, while the current session moves
   directly beneath it and ahead of reminders.
   ══════════════════════════════════════════════════════════════════════ */
.today-mobile-heading{display:none}

@media(max-width:760px){
  /* Home moves today's card into .top-shell. Do not leave the vacated
     training panel's mobile safe-area padding behind as extra page height. */
  body.mobile-portal-home #tab-training.active{padding:0}

  body.mobile-portal-home .hero.hero-shell{
    padding:0;border:0;background:transparent;box-shadow:none;
  }
  body.mobile-portal-home .top-shell{padding-top:8px;padding-bottom:6px}
  body.mobile-portal-home .hero-shell{gap:0}
  body.mobile-portal-home .hero-main{
    padding:11px 13px 10px;border-radius:18px;
    background:radial-gradient(circle at 100% 0%,rgba(146,210,237,.09),transparent 38%),linear-gradient(155deg,rgba(16,27,34,.96),rgba(7,16,22,.96));
  }
  body.mobile-portal-home .hi{display:none}
  body.mobile-portal-home .hero-name-row{align-items:center;margin-bottom:4px}
  body.mobile-portal-home .hn{max-width:9ch;font-size:30px;line-height:.92;letter-spacing:-.055em}
  body.mobile-portal-home .hero-week{min-width:67px;padding:7px 9px;border-radius:12px}
  body.mobile-portal-home .hero-week-label{font-size:8px}
  body.mobile-portal-home .hero-week-num{font-size:19px;line-height:1.05}
  body.mobile-portal-home .hero-support{
    font-size:11px;line-height:1.35;-webkit-line-clamp:1;line-clamp:1;
  }
  body.mobile-portal-home .hero-bottom{margin-top:6px}
  body.mobile-portal-home .hpills{margin-bottom:7px}
  body.mobile-portal-home .hp{padding:4px 8px;font-size:8px}
  
  
  
  body.mobile-portal-home .hero-stat-action .hero-stat-value{font-size:17px}
  body.mobile-portal-home .hero-stat-note{margin-top:4px;font-size:7px;line-height:1.2}
  
  
  
  body.mobile-portal-home .hero-readiness-ring{width:34px;height:34px;flex:0 0 34px}
  body.mobile-portal-home .hero-readiness-ring .hero-stat-value{font-size:12px}
  
  body.mobile-portal-home .hero-pb-value .icon{width:12px;height:12px}
  

  body.mobile-portal-home #todayEl{display:block!important;max-width:none;margin:6px 0 0}
  body.mobile-portal-home #todayEl .todaypanel{
    padding:10px;border:1px solid rgba(255,255,255,.92);border-radius:18px;
    background:radial-gradient(circle at 100% 0%,rgba(146,210,237,.1),transparent 35%),linear-gradient(155deg,rgba(15,26,33,.98),rgba(7,15,20,.98));
    box-shadow:0 16px 38px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.08);
  }
  body.mobile-portal-home .today-mobile-heading{
    display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:7px;
  }
  body.mobile-portal-home .today-mobile-heading span{font-size:16px;font-weight:760;letter-spacing:-.02em;color:var(--text)}
  body.mobile-portal-home .today-mobile-heading small{font-family:var(--mono);font-size:8px;letter-spacing:.08em;text-transform:uppercase;color:var(--run)}
  body.mobile-portal-home #todayEl .todayeyebrow,
  body.mobile-portal-home #todayEl .todayhead,
  body.mobile-portal-home #todayEl .coach-moment,
  body.mobile-portal-home #todayEl .insight-rail,
  body.mobile-portal-home #todayEl .command-status-grid,
  body.mobile-portal-home #todayEl .recovery-warning,
  body.mobile-portal-home #todayEl .milestone-celebration{display:none!important}
  body.mobile-portal-home #todayEl .todaylist{margin-top:0}
  body.mobile-portal-home #todayEl .todayitem{padding:10px;border-radius:14px}
  body.mobile-portal-home #todayEl .todayname{font-size:17px;line-height:1.05}
  body.mobile-portal-home #todayEl .todaymeta{margin-top:3px;font-size:8px}
  body.mobile-portal-home #todayEl .todaytarget{margin-top:6px;padding:8px}
  body.mobile-portal-home #todayEl .todaytarget .label{font-size:7px}
  body.mobile-portal-home #todayEl .todaytarget .value{font-size:13px}
  body.mobile-portal-home #todayEl .todaytarget .desc{font-size:10px;line-height:1.3}
  body.mobile-portal-home #todayEl .session-why{display:none}
  body.mobile-portal-home #todayEl .today-action{min-height:38px;margin-top:6px!important;padding:7px 10px;font-size:11px}
  body.mobile-portal-home .top-shell-priority{margin-top:6px;gap:5px}
  body.mobile-portal-home .top-shell-priority .nudge-strip{padding:8px 11px;border-radius:14px}
  body.mobile-portal-home .top-shell-priority .nudge-strip-text{min-width:0}
  body.mobile-portal-home .top-shell-priority .nudge-strip-title{
    font-family:var(--body);font-size:14px;font-weight:600;line-height:1.2;
    letter-spacing:-.015em;text-transform:none;color:var(--text);
  }
  body.mobile-portal-home .top-shell-priority .nudge-strip-sub{
    margin-top:3px;font-family:var(--body);font-size:11px;font-weight:400;line-height:1.3;
    letter-spacing:0;color:var(--muted);
  }
  body.mobile-portal-home .top-shell-priority #callConfirmedNudge .nudge-strip-text{display:block}
  body.mobile-portal-home .top-shell-priority #callConfirmedNudge .nudge-strip-title{
    font-family:var(--body);font-size:14px;font-weight:600;line-height:1.2;
    letter-spacing:-.015em;color:var(--text);white-space:normal;overflow:visible;
  }
  body.mobile-portal-home .top-shell-priority #callConfirmedNudge .nudge-strip-sub{
    margin-top:3px;font-family:var(--body);font-size:11px;font-weight:500;line-height:1.3;
    letter-spacing:0;color:var(--ok);white-space:normal;
  }

}

@media(max-width:390px){
  body.mobile-portal-home .hn{font-size:28px}
  body.mobile-portal-home .hero-stat-action{min-height:70px;padding:6px}
  body.mobile-portal-home #todayEl .todaypanel{padding:10px}
}

/* Clearly labelled utility controls on mobile. */
@media(max-width:760px){
  header .header-actions{gap:5px}
  header .header-actions .theme-toggle{
    width:auto;min-width:0;height:36px;padding:0 9px;justify-content:center;gap:5px;
    border-radius:999px;background:rgba(146,210,237,.055);
  }
  header .theme-toggle .icon{width:12px;height:12px;flex:0 0 12px}
  header .theme-toggle-label{
    display:inline!important;font-family:var(--body);font-size:9px;font-weight:700;line-height:1;
    letter-spacing:.01em;text-transform:none;
  }
  .outdoor-mode header .header-actions .theme-toggle{background:rgba(8,127,174,.07)}
}

@media(max-width:370px){
  header{padding-left:10px;padding-right:10px}
  header .logo-text{display:none}
  header .header-actions .theme-toggle{padding:0 8px}
}

/* Weekly context + output cards aligned with the redesigned portal. */
.week-plan-kicker{display:flex;align-items:center;gap:8px}
.week-plan-number{
  display:inline-flex;align-items:center;min-height:21px;padding:0 8px;border:1px solid var(--run-border);
  border-radius:999px;background:var(--run-bg);font-family:var(--body);font-size:9px;font-weight:700;
  line-height:1;letter-spacing:0;text-transform:none;color:var(--run-strong);
}

.outdoor-mode .hero-output-week,.outdoor-mode .week-plan-number{color:var(--run-strong)}

@media(min-width:900px){
  
  
  
  
  
  
  
  
}

@media(min-width:761px) and (max-width:899px){
  .week-rings{grid-template-columns:1fr}
}

@media(max-width:760px){
  body.mobile-portal-home .hero-shell{gap:6px}
  
  
  
  
  
  
  
  
  
  
  
  
  
  
}

/* Mobile glass header: full width at rest, inset and floating while scrolling. */
@media(max-width:760px){
  #portalScreen>header{
    top:0;width:100%;margin:0;border:1px solid transparent;border-radius:0;
    transition:
      top .22s ease,width .22s ease,margin .22s ease,
      border-color .22s ease,border-radius .22s ease,background .22s ease,
      box-shadow .22s ease,backdrop-filter .22s ease;
  }
  body.portal-header-scrolled #portalScreen{padding-top:62px}
  body.portal-header-scrolled #portalScreen>header{
    position:fixed;top:8px;left:10px;right:10px;width:auto;margin:0;z-index:180;
    border-color:rgba(255,255,255,.12);border-radius:18px;
    background:rgba(7,17,23,.66);
    box-shadow:0 14px 34px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.055);
    backdrop-filter:blur(22px) saturate(140%);
    -webkit-backdrop-filter:blur(22px) saturate(140%);
  }
  body.portal-header-scrolled #portalScreen>header .logo-img{width:29px;height:29px}
  body.portal-header-scrolled #portalScreen>header .logo-text{font-size:10px}
  body.portal-header-scrolled #portalScreen>header .header-actions .theme-toggle{height:34px}
  html.outdoor-mode body.portal-header-scrolled #portalScreen>header{
    border-color:rgba(7,17,22,.12);background:rgba(255,255,255,.74);
    box-shadow:0 14px 32px rgba(30,55,67,.14),inset 0 1px 0 rgba(255,255,255,.9);
  }
}

@media(prefers-reduced-motion:reduce){
  #portalScreen>header{transition:none!important}
}

/* Focused, border-consistent mobile check-in experience. */
.ci-form-kicker{
  margin-bottom:12px;font-family:var(--mono);font-size:9px;line-height:1;
  letter-spacing:.14em;text-transform:uppercase;color:var(--dim);
}

@media(max-width:760px){
  body.mobile-checkin-tab .top-shell,
  body.mobile-checkin-tab #wbar,
  body.mobile-checkin-tab .quicklog-strip,
  body.mobile-checkin-tab .wa-fab{display:none!important}

  body.mobile-checkin-tab #tab-checkin.active{
    display:block;max-width:620px;margin:0 auto;
    padding:10px 12px calc(98px + env(safe-area-inset-bottom));
  }
  body.mobile-checkin-tab #tab-checkin .page-intro{
    margin:0 0 10px;padding:16px;border:1px solid var(--border);border-radius:18px;
    background:radial-gradient(circle at 100% 0%,rgba(146,210,237,.1),transparent 38%),
      linear-gradient(155deg,rgba(16,27,34,.96),rgba(7,16,22,.96));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 14px 34px rgba(0,0,0,.2);
  }
  body.mobile-checkin-tab #tab-checkin .page-kicker{margin-bottom:6px;font-size:8px}
  body.mobile-checkin-tab #tab-checkin .page-title{font-size:27px;line-height:1;letter-spacing:-.04em}
  body.mobile-checkin-tab #tab-checkin .page-copy{margin-top:7px;font-size:12px;line-height:1.45}

  body.mobile-checkin-tab .ci-rail{display:grid;gap:9px}
  body.mobile-checkin-tab .ci-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-bottom:0!important;
  }
  body.mobile-checkin-tab .ci-card{
    min-height:66px;padding:11px 12px;border:1px solid var(--border)!important;border-radius:13px;
    background:linear-gradient(155deg,rgba(255,255,255,.045),rgba(255,255,255,.018));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
  }
  body.mobile-checkin-tab .ci-val{
    margin-bottom:3px;font-family:var(--body);font-size:23px;font-weight:700;
    line-height:1;letter-spacing:-.04em;color:var(--text)!important;
  }
  body.mobile-checkin-tab .ci-lbl{
    font-family:var(--body);font-size:9px;font-weight:500;line-height:1.2;
    letter-spacing:0;text-transform:none;color:var(--muted);
  }

  body.mobile-checkin-tab #ciBookCard{
    position:relative;margin-bottom:2px!important;border:1px solid var(--border)!important;
    border-radius:15px!important;background:linear-gradient(155deg,rgba(255,255,255,.045),rgba(255,255,255,.018))!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
  }
  body.mobile-checkin-tab #ciBookCard::before{
    content:"";position:absolute;left:0;top:12px;bottom:12px;width:3px;border-radius:0 3px 3px 0;
    background:#f0b85b;
  }
  body.mobile-checkin-tab #ciBookCard.booked::before{background:var(--ok)}
  body.mobile-checkin-tab #ciBookCard>div{padding:13px 14px 13px 16px!important}
  body.mobile-checkin-tab #ciBookKicker{
    margin-bottom:4px!important;font-family:var(--body)!important;font-size:9px!important;
    font-weight:650!important;letter-spacing:0!important;text-transform:none!important;color:var(--dim)!important;
  }
  body.mobile-checkin-tab #ciBookTitle{
    margin-bottom:3px!important;font-family:var(--body)!important;font-size:15px!important;
    font-weight:650!important;line-height:1.2!important;letter-spacing:-.015em!important;
    text-transform:none!important;color:var(--text)!important;
  }
  body.mobile-checkin-tab #ciBookSub{font-size:11px!important;line-height:1.35!important;color:var(--muted)!important}

  body.mobile-checkin-tab .ci-main{
    margin-top:10px;padding:14px;border:1px solid var(--border);border-radius:19px;
    background:linear-gradient(155deg,rgba(16,27,34,.94),rgba(7,16,22,.94));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 16px 38px rgba(0,0,0,.2);
  }
  body.mobile-checkin-tab .ci-form-kicker{margin-bottom:10px;font-size:8px;color:var(--run)}
  body.mobile-checkin-tab .ci-identity-grid{grid-template-columns:1fr!important;gap:9px!important;margin-bottom:12px!important}
  body.mobile-checkin-tab .lf{gap:5px}
  body.mobile-checkin-tab .lf label{
    font-family:var(--body);font-size:10px;font-weight:550;line-height:1.25;
    letter-spacing:0;text-transform:none;color:var(--muted);
  }
  body.mobile-checkin-tab .li{
    min-height:46px;padding:11px 12px;border:1px solid var(--border)!important;border-radius:11px;
    background:rgba(255,255,255,.035);font-family:var(--body);font-size:16px;color:var(--text);
  }
  body.mobile-checkin-tab #ciWeekEnding{border-color:var(--border)!important}
  body.mobile-checkin-tab .li:focus{
    border-color:var(--run)!important;background:rgba(146,210,237,.055);
    box-shadow:0 0 0 3px rgba(146,210,237,.1);
  }

  body.mobile-checkin-tab .ci-wizard-bar{
    gap:12px;margin-bottom:14px;padding:11px 0 13px;border-top:1px solid var(--border);
    border-bottom:1px solid var(--border);
  }
  body.mobile-checkin-tab .ci-sdots{flex:1;gap:5px}
  body.mobile-checkin-tab .ci-sdot{
    flex:1;width:auto;height:4px;border-radius:999px;background:rgba(255,255,255,.1);
    transform:none;
  }
  body.mobile-checkin-tab .ci-sdot.done{background:rgba(34,197,94,.7)}
  body.mobile-checkin-tab .ci-sdot.active{background:var(--run);transform:none;box-shadow:0 0 10px rgba(146,210,237,.28)}
  body.mobile-checkin-tab .ci-step-counter{
    font-family:var(--body);font-size:9px;font-weight:600;letter-spacing:0;
    text-transform:none;white-space:nowrap;color:var(--muted);
  }
  body.mobile-checkin-tab .ci-step-title{
    display:flex;align-items:center;gap:7px;margin-bottom:10px;font-family:var(--body);
    font-size:22px;font-weight:700;line-height:1.05;letter-spacing:-.035em;text-transform:none;color:var(--text);
  }
  body.mobile-checkin-tab .ci-step-title .icon{width:18px;height:18px;margin:0;color:var(--run)}
  body.mobile-checkin-tab .ci-step-panel>.card,
  body.mobile-checkin-tab .ci-testimonial-card{
    margin-bottom:10px!important;padding:13px;border:1px solid var(--border)!important;border-radius:14px;
    background:rgba(255,255,255,.025);box-shadow:none;
  }
  body.mobile-checkin-tab .rlog{gap:7px}
  body.mobile-checkin-tab input[type="range"]{height:26px;margin-top:5px!important;accent-color:var(--run)!important}
  body.mobile-checkin-tab textarea.li{min-height:82px!important;line-height:1.45}
  body.mobile-checkin-tab textarea.li::placeholder{
    font-family:var(--body);font-size:11px;line-height:1.35;letter-spacing:0;color:var(--dim);
    opacity:.78;-webkit-text-fill-color:var(--dim);
  }
  body.mobile-checkin-tab select.li{padding-right:34px}

  body.mobile-checkin-tab .ci-reflection-intro{
    padding:14px!important;border:1px solid var(--border);border-radius:14px!important;
    background:radial-gradient(circle at 100% 0%,rgba(146,210,237,.1),transparent 42%),
      rgba(255,255,255,.025)!important;
  }
  body.mobile-checkin-tab .ci-reflection-intro>div:nth-child(2){
    font-family:var(--body)!important;font-size:18px!important;font-weight:700!important;
    line-height:1.15!important;letter-spacing:-.025em!important;text-transform:none!important;
  }
  body.mobile-checkin-tab .ci-reflection-intro>div:last-child{font-size:12px!important;line-height:1.5!important;color:var(--muted)!important}

  body.mobile-checkin-tab .ci-nav-row{
    position:sticky;bottom:calc(80px + env(safe-area-inset-bottom));z-index:6;
    gap:7px;margin:12px -6px -6px;padding:7px;border:1px solid var(--border);
    border-radius:14px;background:rgba(7,17,23,.84);box-shadow:0 12px 30px rgba(0,0,0,.28);
    backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  }
  body.mobile-checkin-tab .ci-btn-back,
  body.mobile-checkin-tab .ci-btn-next{
    min-height:44px;padding:10px 12px;border-radius:10px;font-family:var(--body);
    font-size:12px;font-weight:700;letter-spacing:0;text-transform:none;
  }
  body.mobile-checkin-tab .ci-btn-back{border:1px solid var(--border);background:rgba(255,255,255,.045)}
  body.mobile-checkin-tab .ci-btn-next{border:1px solid var(--run)}

  body.mobile-checkin-tab .mobile-nav-item:focus-visible{
    outline:1px solid var(--run-border);outline-offset:-1px;
  }

  html.outdoor-mode body.mobile-checkin-tab #tab-checkin .page-intro,
  html.outdoor-mode body.mobile-checkin-tab .ci-main{
    background:#fff;border-color:var(--border);box-shadow:0 12px 30px rgba(30,55,67,.08);
  }
  html.outdoor-mode body.mobile-checkin-tab .ci-card,
  html.outdoor-mode body.mobile-checkin-tab #ciBookCard,
  html.outdoor-mode body.mobile-checkin-tab .ci-step-panel>.card,
  html.outdoor-mode body.mobile-checkin-tab .ci-testimonial-card,
  html.outdoor-mode body.mobile-checkin-tab .ci-reflection-intro{
    background:rgba(7,17,22,.025)!important;border-color:var(--border)!important;
  }
  html.outdoor-mode body.mobile-checkin-tab .li{background:#fff}
  html.outdoor-mode body.mobile-checkin-tab .ci-nav-row{background:rgba(255,255,255,.88)}
}

/* Focused progress dashboard: clearer hierarchy, compact measurement context,
   and a swipeable photo timeline on mobile. */
.progress-intro-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.progress-week-pill{
  flex:0 0 auto;min-width:92px;padding:10px 12px;border:1px solid var(--border);
  border-radius:14px;background:rgba(255,255,255,.035);
}
.progress-week-pill span,.progress-week-pill strong{display:block}
.progress-week-pill span{
  margin-bottom:3px;font-family:var(--body);font-size:9px;font-weight:550;
  line-height:1.1;color:var(--dim);
}
.progress-week-pill strong{
  font-family:var(--body);font-size:17px;font-weight:700;line-height:1.1;
  letter-spacing:-.025em;color:var(--text);
}
.progress-hero-summary{
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px;
  margin-top:16px;padding-top:15px;border-top:1px solid var(--border);
}
.progress-current{display:flex;align-items:center;gap:12px;min-width:0}
.progress-summary-icon,.progress-section-icon{
  display:grid;place-items:center;flex:0 0 auto;color:var(--run);
  background:var(--run-bg);border:1px solid var(--run-border);
}
.progress-summary-icon{
  width:44px;height:44px;border-radius:14px;
  background:radial-gradient(circle at 78% 20%,rgba(146,210,237,.16),transparent 38%),linear-gradient(145deg,rgba(146,210,237,.1),rgba(146,210,237,.035));
  border-color:rgba(146,210,237,.38);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 8px 22px rgba(0,0,0,.16);
}
.progress-summary-icon .icon{width:20px;height:20px}
.progress-trend-glyph{
  position:relative!important;display:block!important;width:27px;height:21px;overflow:hidden;
  color:var(--run)!important;
  background:
    linear-gradient(rgba(146,210,237,.09) 1px,transparent 1px) 0 0/100% 7px,
    linear-gradient(90deg,rgba(146,210,237,.07) 1px,transparent 1px) 0 0/9px 100%;
  border-radius:5px;
}
.progress-trend-glyph i{
  position:absolute;z-index:1;display:block;height:2px;border-radius:999px;
  background:linear-gradient(90deg,#73c5e8,#a9e0f5);
  box-shadow:0 0 7px rgba(146,210,237,.28);transform-origin:left center;
}
.progress-trend-glyph i:nth-child(1){left:2px;top:16px;width:10px;transform:rotate(-42deg)}
.progress-trend-glyph i:nth-child(2){left:9px;top:9px;width:8px;transform:rotate(27deg)}
.progress-trend-glyph i:nth-child(3){left:16px;top:12px;width:11px;transform:rotate(-49deg)}
.progress-trend-glyph b{
  position:absolute;z-index:2;right:1px;top:2px;width:5px;height:5px;border:1.5px solid #c5edfc;
  border-radius:50%;background:#74c9eb;box-shadow:0 0 0 3px rgba(116,201,235,.13),0 0 9px rgba(116,201,235,.5);
}
.progress-trend-section-icon{
  background:linear-gradient(145deg,rgba(146,210,237,.1),rgba(146,210,237,.03));
  border-color:rgba(146,210,237,.28);
}
.progress-trend-section-icon .progress-trend-glyph{width:23px;height:18px;background-size:100% 6px,8px 100%}
.progress-trend-section-icon .progress-trend-glyph i{height:1.5px}
.progress-trend-section-icon .progress-trend-glyph i:nth-child(1){left:1px;top:14px;width:9px}
.progress-trend-section-icon .progress-trend-glyph i:nth-child(2){left:8px;top:8px;width:7px}
.progress-trend-section-icon .progress-trend-glyph i:nth-child(3){left:14px;top:11px;width:10px}
.progress-trend-section-icon .progress-trend-glyph b{right:0;top:1px;width:4px;height:4px}
.progress-current span,.progress-change span,.progress-baseline-item span{
  display:block;font-family:var(--body);font-size:10px;font-weight:550;
  line-height:1.2;color:var(--dim);
}
.progress-current strong{
  display:block;margin-top:2px;font-family:var(--body);font-size:28px;font-weight:720;
  line-height:1;letter-spacing:-.05em;color:var(--text);
}
.progress-current small,.progress-baseline-item small{
  display:block;margin-top:4px;font-family:var(--body);font-size:9px;line-height:1.2;color:var(--dim);
}
.progress-change{min-width:108px;padding-left:14px;border-left:1px solid var(--border)}
.progress-change strong{
  display:block;margin-top:5px;font-family:var(--body);font-size:22px;font-weight:700;
  line-height:1;letter-spacing:-.04em;color:var(--text);
}
.progress-baseline{
  display:grid;grid-template-columns:minmax(0,1fr) 1px minmax(0,1fr);align-items:stretch;
  margin-bottom:14px;padding:14px 16px;border:1px solid var(--border);border-radius:16px;
  background:linear-gradient(155deg,rgba(255,255,255,.04),rgba(255,255,255,.015));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
.progress-baseline-divider{width:1px;background:var(--border)}
.progress-baseline-item:first-child{padding-right:16px}
.progress-baseline-item:last-child{padding-left:16px}
.progress-baseline-item strong{
  display:block;margin-top:5px;font-family:var(--body);font-size:22px;font-weight:700;
  line-height:1;letter-spacing:-.04em;color:var(--text);
}
#tab-progress .progress-card{
  position:relative;overflow:hidden;border-color:var(--border)!important;
  background:linear-gradient(155deg,rgba(16,27,34,.92),rgba(7,16,22,.92));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 16px 38px rgba(0,0,0,.18);
}
#tab-progress .progress-card::before{
  content:"";position:absolute;left:18px;right:18px;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(146,210,237,.42),transparent);opacity:.55;
}
.progress-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}
.progress-section-head .card-title{display:block;margin:0;font-size:17px;font-weight:680;letter-spacing:-.02em;color:var(--text)}
.progress-section-copy{margin-top:3px;font-size:11px;line-height:1.35;color:var(--dim)}
.progress-section-icon{width:36px;height:36px;border-radius:12px}
.progress-section-icon .icon{width:17px;height:17px}
.progress-empty{
  padding:24px 12px;text-align:center;font-family:var(--body);font-size:12px;
  line-height:1.45;color:var(--dim);
}
#pgChart{margin:0 -4px}
#pgChart svg{display:block;width:100%}
.progress-trend-stats{grid-template-columns:repeat(3,minmax(0,1fr))!important;margin:8px 0 0}
#tab-progress .progress-trend-stats .pstat{min-width:0;padding:11px 7px}
#tab-progress .progress-trend-stats .pstat-val{font-family:var(--body);font-size:17px;letter-spacing:-.035em}
#tab-progress .progress-trend-stats .pstat-lbl{font-family:var(--body);font-size:8px;letter-spacing:0;text-transform:none}
.progress-photo-hint{
  margin-top:10px;font-family:var(--body);font-size:9px;line-height:1.35;
  text-align:center;color:var(--dim);
}
.photo-cell .current-week-badge{
  position:absolute;top:6px;left:6px;z-index:3;padding:3px 6px;border-radius:999px;
  background:var(--run);font-family:var(--body);font-size:8px;font-weight:750;
  line-height:1;color:#061117;
}
#tab-progress button.photo-cell{padding:0;color:inherit;font:inherit;-webkit-appearance:none;appearance:none}
.weight-log-table{width:100%;border-collapse:collapse}
.weight-log-table th{
  padding:6px 4px 8px;border-bottom:1px solid var(--border-mid);font-family:var(--body);
  font-size:9px;font-weight:550;line-height:1.2;letter-spacing:0;text-transform:none;
  text-align:left;color:var(--dim);
}
.weight-log-table th:nth-child(n+2){text-align:right}
.weight-log-table td{padding:11px 4px;border-bottom:1px solid var(--border);font-size:12px;color:var(--muted)}
.weight-log-table tr:last-child td{border-bottom:0}
.weight-log-table .weight-log-value{
  font-family:var(--body);font-size:17px;font-weight:700;letter-spacing:-.025em;text-align:right;color:var(--text);
}
.weight-log-value span{margin-left:2px;font-size:10px;font-weight:500;letter-spacing:0;color:var(--dim)}
.weight-log-table .weight-log-change{font-family:var(--body);font-size:11px;font-weight:600;text-align:right}
.weight-log-toggle{
  width:100%;min-height:42px;margin-top:10px;padding:10px;border:1px solid var(--border);
  border-radius:11px;background:rgba(255,255,255,.04);font-family:var(--body);
  font-size:11px;font-weight:650;color:var(--muted);cursor:pointer;
}

html.outdoor-mode .progress-week-pill,
html.outdoor-mode .progress-baseline{background:rgba(7,17,22,.025)}
html.outdoor-mode #tab-progress .progress-card{
  background:#fff!important;border-color:var(--border)!important;
  box-shadow:0 12px 30px rgba(30,55,67,.08)!important;
}
html.outdoor-mode .weight-log-toggle{background:rgba(7,17,22,.035)}

@media(max-width:760px){
  body.mobile-progress-tab .top-shell,
  body.mobile-progress-tab #wbar,
  body.mobile-progress-tab .quicklog-strip,
  body.mobile-progress-tab .wa-fab{display:none!important}

  body.mobile-progress-tab #tab-progress.active{
    display:block;max-width:620px;margin:0 auto;
    padding:10px 12px calc(98px + env(safe-area-inset-bottom));
  }
  body.mobile-progress-tab #tab-progress .progress-intro{
    margin:0 0 9px;padding:16px;border-radius:19px;
    background:radial-gradient(circle at 100% 0%,rgba(146,210,237,.11),transparent 40%),
      linear-gradient(155deg,rgba(16,27,34,.96),rgba(7,16,22,.96));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 14px 34px rgba(0,0,0,.2);
  }
  body.mobile-progress-tab #tab-progress .page-kicker{margin-bottom:5px;font-size:8px}
  body.mobile-progress-tab #tab-progress .page-title{font-size:29px;line-height:1;letter-spacing:-.045em}
  body.mobile-progress-tab #tab-progress .page-copy{margin-top:7px;font-size:11px;line-height:1.4}
  body.mobile-progress-tab .progress-week-pill{min-width:80px;padding:8px 10px;border-radius:12px}
  body.mobile-progress-tab .progress-week-pill span{font-size:8px}
  body.mobile-progress-tab .progress-week-pill strong{font-size:15px}
  body.mobile-progress-tab .progress-hero-summary{gap:10px;margin-top:13px;padding-top:13px}
  body.mobile-progress-tab .progress-current{gap:9px}
  body.mobile-progress-tab .progress-summary-icon{width:38px;height:38px;border-radius:12px}
  body.mobile-progress-tab .progress-current strong{font-size:25px}
  body.mobile-progress-tab .progress-current small{font-size:8px}
  body.mobile-progress-tab .progress-change{min-width:90px;padding-left:10px}
  body.mobile-progress-tab .progress-change span{font-size:8px}
  body.mobile-progress-tab .progress-change strong{font-size:19px}

  body.mobile-progress-tab .progress-baseline{margin-bottom:9px;padding:12px 14px;border-radius:14px}
  body.mobile-progress-tab .progress-baseline-item:first-child{padding-right:13px}
  body.mobile-progress-tab .progress-baseline-item:last-child{padding-left:13px}
  body.mobile-progress-tab .progress-baseline-item span{font-size:9px}
  body.mobile-progress-tab .progress-baseline-item strong{font-size:19px}
  body.mobile-progress-tab .progress-baseline-item small{font-size:8px}

  body.mobile-progress-tab #tab-progress .progress-card{
    margin-bottom:9px;padding:14px;border-radius:17px;
  }
  body.mobile-progress-tab .progress-section-head{margin-bottom:10px}
  body.mobile-progress-tab .progress-section-head .card-title{font-size:15px}
  body.mobile-progress-tab .progress-section-copy{font-size:9px}
  body.mobile-progress-tab .progress-section-icon{width:32px;height:32px;border-radius:10px}
  body.mobile-progress-tab #pgChart{margin:0 -6px}
  body.mobile-progress-tab #pgChart svg{height:168px}
  body.mobile-progress-tab #pgChartStats{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px;margin-top:5px;
  }
  body.mobile-progress-tab #tab-progress #pgChartStats .pstat{
    min-height:62px;padding:9px 4px;border-radius:11px;
  }
  body.mobile-progress-tab #pgChartStats .pstat-val{font-size:15px}
  body.mobile-progress-tab #pgChartStats .pstat-lbl{font-size:7px}

  body.mobile-progress-tab .progress-photo-card{padding-right:0!important}
  body.mobile-progress-tab .progress-photo-card .progress-section-head{padding-right:14px}
  body.mobile-progress-tab .photo-grid{
    display:grid;grid-auto-flow:column;grid-auto-columns:96px;grid-template-columns:none;
    gap:7px;overflow-x:auto;padding:1px 14px 7px 0;scroll-snap-type:x proximity;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;
  }
  body.mobile-progress-tab .photo-grid::-webkit-scrollbar{display:none}
  body.mobile-progress-tab .photo-cell{width:96px;aspect-ratio:4/5;border-radius:12px;scroll-snap-align:start}
  body.mobile-progress-tab .photo-cell .photo-label{padding:0 5px;text-align:center;font-family:var(--body);font-size:8px;text-transform:none;letter-spacing:0}
  body.mobile-progress-tab .photo-cell .photo-add{font-size:24px;font-weight:300}
  body.mobile-progress-tab .photo-cell .photo-overlay{padding:5px 3px;font-family:var(--body);font-size:8px;text-transform:none;letter-spacing:0}
  body.mobile-progress-tab .progress-photo-hint{padding-right:14px;text-align:left}

  body.mobile-progress-tab .weight-log-table td{padding-top:10px;padding-bottom:10px}
  body.mobile-progress-tab .progress-empty{padding:20px 10px}
}

/* Progress daylight pass: the compact mobile header is declared after the
   general outdoor theme, so it needs an equally late light-surface treatment. */
html.outdoor-mode #tab-progress .progress-intro{
  background:
    radial-gradient(circle at 100% 0%,rgba(8,127,174,.09),transparent 42%),
    linear-gradient(155deg,#fff,#f7fafb)!important;
  border-color:rgba(7,17,22,.07)!important;
  box-shadow:inset 0 1px 0 #fff,0 14px 34px rgba(30,55,67,.09)!important;
}
html.outdoor-mode #tab-progress .progress-summary-icon,
html.outdoor-mode #tab-progress .progress-trend-section-icon{
  background:
    radial-gradient(circle at 78% 20%,rgba(8,127,174,.13),transparent 38%),
    linear-gradient(145deg,rgba(8,127,174,.09),rgba(8,127,174,.025));
  border-color:rgba(8,127,174,.24);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 7px 18px rgba(30,55,67,.09);
}
html.outdoor-mode #tab-progress .progress-trend-glyph{
  background:
    linear-gradient(rgba(8,127,174,.12) 1px,transparent 1px) 0 0/100% 7px,
    linear-gradient(90deg,rgba(8,127,174,.1) 1px,transparent 1px) 0 0/9px 100%;
}
html.outdoor-mode #tab-progress .progress-trend-section-icon .progress-trend-glyph{
  background-size:100% 6px,8px 100%;
}
html.outdoor-mode #tab-progress .progress-trend-glyph i{
  background:linear-gradient(90deg,#087fae,#38a9d5);
  box-shadow:0 0 6px rgba(8,127,174,.16);
}
html.outdoor-mode #tab-progress .progress-trend-glyph b{
  border-color:#fff;background:#087fae;
  box-shadow:0 0 0 3px rgba(8,127,174,.12),0 2px 6px rgba(8,127,174,.22);
}

/* Secondary mobile destinations — Nutrition, Goals, Guide and Contact share
   the same focused canvas as Check-in and Progress. */
.guide-prompt{
  margin:-2px 0 14px;font-family:var(--body);font-size:12px;line-height:1.4;color:var(--dim);
}
.contact-coaches{display:flex;margin-bottom:14px;padding-left:7px}
.contact-coaches span{
  width:42px;height:42px;margin-left:-7px;display:grid;place-items:center;border:2px solid var(--surface);
  border-radius:50%;background:#202d35;font-size:13px;font-weight:750;color:var(--text);
}
.contact-coaches span:last-child{background:#173241;color:var(--run)}
.programme-details-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.programme-details-grid>div{
  padding:13px;border:1px solid var(--border);border-radius:12px;background:rgba(255,255,255,.025);
}
.programme-details-grid span,.programme-details-grid strong{display:block}
.programme-details-grid span{font-size:9px;color:var(--dim)}
.programme-details-grid strong{
  margin-top:5px;font-family:var(--body);font-size:16px;font-weight:700;
  line-height:1.15;letter-spacing:-.025em;color:var(--text);
}
.portal-signout{
  width:100%;min-height:44px;margin-top:12px;padding:11px;border:1px solid var(--border);
  border-radius:12px;background:transparent;display:flex;align-items:center;justify-content:center;gap:7px;
  font-family:var(--body);font-size:11px;font-weight:650;color:var(--muted);cursor:pointer;
}
.portal-signout .icon{width:14px;height:14px}
.preference-icon,.summary-metric-icon{
  display:grid;place-items:center;flex:0 0 auto;border:1px solid var(--run-border);
  background:var(--run-bg);color:var(--run);
}
.preference-icon{width:36px;height:36px;border-radius:11px}
.preference-row>.preference-icon{flex:0 0 36px}
.preference-icon .icon{width:17px;height:17px}
.push-status{
  margin-top:4px;padding:10px 12px;border:1px solid var(--border);border-radius:10px;
  font-family:var(--body);font-size:10px;line-height:1.3;color:var(--dim);
}
.summary-week-label{
  margin-bottom:9px;font-family:var(--body);font-size:9px;font-weight:650;
  line-height:1.2;color:var(--run);
}
.summary-ring{
  --value:0;width:66px;height:66px;flex:0 0 66px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle closest-side,var(--surface) 72%,transparent 74%),
    conic-gradient(var(--run) calc(var(--value)*1%),rgba(255,255,255,.09) 0);
}
.summary-ring strong{font-size:16px!important;color:var(--text)!important}
.summary-metric-icon{width:31px;height:31px;margin-bottom:9px;border-radius:10px}
.summary-metric-icon .icon{width:15px;height:15px}
.summary-wins{display:flex;align-items:flex-start;gap:11px}
.summary-wins>.summary-metric-icon{margin:0}
.summary-wins>div{min-width:0}

@media(max-width:760px){
  body.mobile-secondary-tab .top-shell,
  body.mobile-secondary-tab #wbar,
  body.mobile-secondary-tab .quicklog-strip,
  body.mobile-secondary-tab .wa-fab{display:none!important}

  body.mobile-secondary-tab #tab-nutrition.active,
  body.mobile-secondary-tab #tab-goals.active,
  body.mobile-secondary-tab #tab-handbook.active,
  body.mobile-secondary-tab #tab-comms.active{
    display:block;max-width:620px;margin:0 auto;
    padding:10px 12px calc(98px + env(safe-area-inset-bottom));
  }
  body.mobile-secondary-tab .tab-content.active>.page-intro{
    margin:0 0 9px;padding:16px;border:1px solid var(--border);border-radius:19px;
    background:radial-gradient(circle at 100% 0%,rgba(146,210,237,.1),transparent 40%),
      linear-gradient(155deg,rgba(16,27,34,.96),rgba(7,16,22,.96));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 14px 34px rgba(0,0,0,.2);
  }
  body.mobile-secondary-tab .tab-content.active .page-kicker{margin-bottom:5px;font-size:8px}
  body.mobile-secondary-tab .tab-content.active .page-title{font-size:28px;line-height:1;letter-spacing:-.045em}
  body.mobile-secondary-tab .tab-content.active .page-copy{margin-top:7px;font-size:11px;line-height:1.42}
  body.mobile-secondary-tab .tab-content.active>.card,
  body.mobile-secondary-tab .tab-content.active #nutContent>.card{
    margin-bottom:9px;padding:14px;border:1px solid var(--border)!important;border-radius:17px;
    background:linear-gradient(155deg,rgba(16,27,34,.92),rgba(7,16,22,.92));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 14px 32px rgba(0,0,0,.16);
  }

  /* More menu: generous primary destinations with quieter utility controls. */
  .more-menu{background:rgba(0,0,0,.64);backdrop-filter:blur(9px)}
  .more-menu-sheet{
    min-height:min(690px,78vh);max-height:94vh;padding:9px 16px calc(18px + env(safe-area-inset-bottom));
    border:1px solid var(--border);border-bottom:0;border-radius:26px 26px 0 0;
    background:radial-gradient(circle at 100% 0%,rgba(146,210,237,.08),transparent 34%),linear-gradient(180deg,#0d1c25,#071219);
    box-shadow:0 -24px 70px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.045);
  }
  .more-menu-handle{width:36px;height:4px;margin:1px auto 14px;background:rgba(146,210,237,.34)}
  .more-menu-head{margin-bottom:14px;padding:0 2px 13px}
  .more-menu-kicker{font-family:var(--body);font-size:10px}
  .more-menu-title{font-size:31px;font-weight:720;letter-spacing:-.05em}
  .more-menu-close{width:42px;height:42px;font-size:22px;background:rgba(255,255,255,.04)}
  .more-menu-section-label{margin:0 2px 8px;font-family:var(--body);font-size:9px;font-weight:650;line-height:1;letter-spacing:.02em;color:var(--dim)}
  .more-menu-tools-label{margin-top:13px}
  .more-menu-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .more-menu-grid button{
    position:relative;min-height:116px;padding:14px;display:flex;flex-direction:column;
    align-items:flex-start;justify-content:space-between;gap:11px;border-radius:18px;
    background:linear-gradient(155deg,rgba(255,255,255,.065),rgba(255,255,255,.02));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 12px 26px rgba(0,0,0,.12);
  }
  .more-menu-grid button::after{content:"›";position:absolute;right:13px;top:13px;font-size:20px;line-height:1;color:var(--dim)}
  .more-menu-grid .icon{
    width:20px;height:20px;padding:10px;box-sizing:content-box;border-radius:13px;background:var(--run-bg);color:var(--run);
  }
  .more-menu-grid button span{min-width:0;padding-right:5px}
  .more-menu-grid strong{font-size:15px;line-height:1.15;letter-spacing:-.02em}
  .more-menu-grid small{margin-top:5px;font-size:10px;line-height:1.3}
  .more-menu-utilities{display:grid;grid-template-columns:1fr;gap:7px}
  .more-menu-utilities button{
    position:relative;width:100%;min-height:59px;padding:10px 42px 10px 11px;
    display:grid;grid-template-columns:38px minmax(0,1fr);align-items:center;gap:10px;
    border:1px solid var(--border);border-radius:15px;text-align:left;font:inherit;color:var(--text);cursor:pointer;
    background:linear-gradient(155deg,rgba(255,255,255,.052),rgba(255,255,255,.018));
  }
  .more-menu-utilities button::after{content:"›";position:absolute;right:14px;top:50%;transform:translateY(-52%);font-size:20px;color:var(--dim)}
  .more-menu-utilities .icon{width:17px;height:17px;padding:9px;box-sizing:content-box;border-radius:11px;background:var(--run-bg);color:var(--run)}
  .more-menu-utilities strong,.more-menu-utilities small{display:block}
  .more-menu-utilities strong{font-size:13px;line-height:1.15}
  .more-menu-utilities small{margin-top:3px;font-size:9px;line-height:1.25;color:var(--muted)}
  .more-outdoor{
    min-height:59px;margin-top:8px;padding:10px 12px;border-radius:15px;
    background:linear-gradient(155deg,rgba(255,255,255,.052),rgba(255,255,255,.018));
  }
  .more-outdoor>.icon{width:17px;height:17px;padding:9px;box-sizing:content-box;border-radius:11px;background:var(--run-bg);color:var(--run)}
  .more-outdoor strong{font-size:13px}.more-outdoor small{font-size:9px;line-height:1.25}

  /* Nutrition */
  body.mobile-secondary-tab #tab-nutrition .nut-wbar{
    margin:0 0 9px;padding:11px 12px;display:flex;align-items:center;justify-content:space-between;
    border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.025);
  }
  body.mobile-secondary-tab #tab-nutrition .nut-wlabel{
    order:-1;font-family:var(--body);font-size:16px;font-weight:700;
    letter-spacing:-.025em;text-transform:none;color:var(--text);
  }
  body.mobile-secondary-tab #tab-nutrition .wnav{gap:5px}
  body.mobile-secondary-tab #tab-nutrition .nut-arr{min-width:32px;height:32px;padding:6px 9px;border-radius:10px;font-size:9px}
  body.mobile-secondary-tab #nutContent .cnote{
    margin-bottom:9px!important;padding:12px 13px;border:1px solid var(--run-border);
    border-radius:14px;background:var(--run-bg);font-size:11px;line-height:1.45;
  }
  body.mobile-secondary-tab #tab-nutrition .macro-grid{gap:7px;margin-bottom:9px}
  body.mobile-secondary-tab #tab-nutrition .mc{
    min-height:76px;padding:12px;text-align:left;border-radius:14px;
    background:linear-gradient(155deg,rgba(255,255,255,.05),rgba(255,255,255,.018));
  }
  body.mobile-secondary-tab #tab-nutrition .mc.cal{
    grid-column:1/-1;min-height:82px;display:grid;grid-template-columns:1fr auto;align-items:end;
  }
  body.mobile-secondary-tab #tab-nutrition .mc.cal .ml{grid-column:1;grid-row:1}
  body.mobile-secondary-tab #tab-nutrition .mc.cal .mv{grid-column:1;grid-row:2}
  body.mobile-secondary-tab #tab-nutrition .mv{margin:0;font-family:var(--body);font-size:28px;letter-spacing:-.05em}
  body.mobile-secondary-tab #tab-nutrition .mc.cal .mv{font-size:34px}
  body.mobile-secondary-tab #tab-nutrition .ml{
    order:-1;margin-bottom:6px;font-family:var(--body);font-size:9px;
    letter-spacing:0;text-transform:none;color:var(--dim);
  }
  body.mobile-secondary-tab #tab-nutrition .mc.fibre{grid-column:auto!important}
  body.mobile-secondary-tab #tab-nutrition .card-title{margin-bottom:10px;font-size:15px;letter-spacing:-.02em}
  body.mobile-secondary-tab #tab-nutrition .priority-item{gap:10px;padding:10px 0}
  body.mobile-secondary-tab #tab-nutrition .priority-num{width:25px;height:25px;font-family:var(--body);font-size:11px}
  body.mobile-secondary-tab #tab-nutrition .priority-text{font-size:11px;line-height:1.45}
  body.mobile-secondary-tab #tab-nutrition .timing-table{display:block;border:0;background:transparent}
  body.mobile-secondary-tab #tab-nutrition .timing-table thead{display:none}
  body.mobile-secondary-tab #tab-nutrition .timing-table tbody{display:grid;gap:7px}
  body.mobile-secondary-tab #tab-nutrition .timing-table tr{
    display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:11px;
    border:1px solid var(--border);border-radius:12px;background:rgba(255,255,255,.025);
  }
  body.mobile-secondary-tab #tab-nutrition .timing-table td{padding:0;border:0;font-size:10px;line-height:1.4}
  body.mobile-secondary-tab #tab-nutrition .timing-table td:first-child{
    grid-column:1/-1;padding-bottom:7px;border-bottom:1px solid var(--border);
    font-size:12px;font-weight:700;color:var(--text);
  }
  body.mobile-secondary-tab #tab-nutrition .timing-table td:nth-child(2)::before,
  body.mobile-secondary-tab #tab-nutrition .timing-table td:nth-child(3)::before,
  body.mobile-secondary-tab #tab-nutrition .timing-table td:nth-child(4)::before{
    display:block;margin-bottom:2px;font-size:8px;font-weight:600;color:var(--dim);
  }
  body.mobile-secondary-tab #tab-nutrition .timing-table td:nth-child(2)::before{content:"Timing"}
  body.mobile-secondary-tab #tab-nutrition .timing-table td:nth-child(3)::before{content:"Amount"}
  body.mobile-secondary-tab #tab-nutrition .timing-table td:nth-child(4){grid-column:1/-1}
  body.mobile-secondary-tab #tab-nutrition .timing-table td:nth-child(4)::before{content:"Examples"}
  body.mobile-secondary-tab #tab-nutrition .nutrnote{padding:12px;font-size:11px;line-height:1.5}

  /* Goals */
  body.mobile-secondary-tab #tab-goals{counter-reset:goal-section}
  body.mobile-secondary-tab #tab-goals .goals-overview{
    margin-bottom:9px;padding:15px 16px;border-color:var(--border-strong);border-radius:17px;
  }
  body.mobile-secondary-tab #tab-goals .goals-label{margin-bottom:4px;font-family:var(--body);font-size:8px;letter-spacing:0;text-transform:none}
  body.mobile-secondary-tab #tab-goals .goals-name{margin-bottom:5px;font-family:var(--body);font-size:22px;letter-spacing:-.04em;text-transform:none}
  body.mobile-secondary-tab #tab-goals .goals-sub{font-size:11px;line-height:1.45}
  body.mobile-secondary-tab #tab-goals .goals-saved-badge{margin-top:8px;font-family:var(--body);font-size:9px}
  body.mobile-secondary-tab #tab-goals .goals-section-card{counter-increment:goal-section}
  body.mobile-secondary-tab #tab-goals .goals-section-card .card-title{
    justify-content:flex-start;margin-bottom:12px;font-size:15px;line-height:1.2;letter-spacing:-.02em;
  }
  body.mobile-secondary-tab #tab-goals .goals-section-card .card-title::before{
    content:counter(goal-section,decimal-leading-zero);width:27px;height:27px;display:grid;place-items:center;
    flex:0 0 27px;border:1px solid var(--run-border);border-radius:9px;background:var(--run-bg);
    font-size:9px;font-weight:700;color:var(--run);
  }
  body.mobile-secondary-tab #tab-goals .stat-grid{gap:9px}
  body.mobile-secondary-tab #tab-goals .stat-grid>.stat-field:last-child:nth-child(odd){grid-column:1/-1}
  body.mobile-secondary-tab #tab-goals .stat-field label,
  body.mobile-secondary-tab #tab-goals .milestone-field label{
    font-family:var(--body);font-size:9px;font-weight:550;letter-spacing:0;text-transform:none;text-align:left;
  }
  body.mobile-secondary-tab #tab-goals .stat-input,
  body.mobile-secondary-tab #tab-goals .why-textarea,
  body.mobile-secondary-tab #tab-goals .milestone-input{
    min-height:44px;padding:11px 12px;border:1px solid var(--border)!important;border-radius:11px;
    background:rgba(255,255,255,.035);font-family:var(--body);font-size:16px;
  }
  body.mobile-secondary-tab #tab-goals .field-hint{font-size:9px;line-height:1.25}
  body.mobile-secondary-tab #tab-goals .goals-card-note{margin:-3px 0 11px;font-size:10px;line-height:1.4}
  body.mobile-secondary-tab #tab-goals .race-options{gap:6px}
  body.mobile-secondary-tab #tab-goals .race-opt{
    min-height:34px;padding:7px 10px;font-family:var(--body);font-size:10px;
    font-weight:650;letter-spacing:0;text-transform:none;
  }
  body.mobile-secondary-tab #tab-goals .why-textarea{min-height:88px;font-size:12px;line-height:1.45}
  body.mobile-secondary-tab #tab-goals .milestone-grid{grid-template-columns:1fr;gap:7px}
  body.mobile-secondary-tab #tab-goals .milestone-field{
    display:grid;grid-template-columns:55px minmax(0,1fr);align-items:stretch;gap:8px;
  }
  body.mobile-secondary-tab #tab-goals .milestone-field label{
    display:grid;place-items:center;border:1px solid var(--border);border-radius:11px;background:var(--run-bg);color:var(--run);
  }
  body.mobile-secondary-tab #tab-goals .milestone-input{min-height:64px;text-align:left;font-size:11px;line-height:1.4}
  body.mobile-secondary-tab #tab-goals .savebtn{
    position:sticky;bottom:calc(80px + env(safe-area-inset-bottom));z-index:6;
    min-height:46px;margin:12px 0 0;border-radius:12px;box-shadow:0 12px 28px rgba(0,0,0,.3);
  }

  /* Athlete guide */
  body.mobile-secondary-tab #tab-handbook .guide-prompt{margin:0 2px 9px;font-size:10px}
  body.mobile-secondary-tab #tab-handbook .hb-grid{grid-template-columns:1fr;gap:7px;margin-bottom:0}
  body.mobile-secondary-tab #tab-handbook .hb-card{
    min-height:68px;padding:11px 38px 11px 11px;display:grid;
    grid-template-columns:38px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;gap:2px 11px;
    border-radius:14px;background:linear-gradient(155deg,rgba(255,255,255,.05),rgba(255,255,255,.018));
  }
  body.mobile-secondary-tab #tab-handbook .hb-card::before{
    content:"›";position:absolute;right:14px;top:50%;transform:translateY(-52%);font-size:21px;color:var(--dim);
  }
  body.mobile-secondary-tab #tab-handbook .hb-card::after{display:none}
  body.mobile-secondary-tab #tab-handbook .hb-icon{
    grid-row:1/3;width:38px;height:38px;margin:0;display:grid;place-items:center;
    border:1px solid var(--run-border);border-radius:11px;background:var(--run-bg);
  }
  body.mobile-secondary-tab #tab-handbook .hb-icon .icon{width:18px;height:18px}
  body.mobile-secondary-tab #tab-handbook .hb-title{
    align-self:end;margin:0;font-family:var(--body);font-size:14px;font-weight:700;
    line-height:1.15;letter-spacing:-.015em;text-transform:none;
  }
  body.mobile-secondary-tab #tab-handbook .hb-sub{align-self:start;font-family:var(--body);font-size:9px;letter-spacing:0}

  /* Contact */
  body.mobile-secondary-tab #tab-comms .comms-card{margin-bottom:9px;padding:17px;border-radius:19px}
  body.mobile-secondary-tab #tab-comms .comms-title{font-family:var(--body);font-size:23px;font-weight:720;letter-spacing:-.04em;text-transform:none}
  body.mobile-secondary-tab #tab-comms .comms-body{margin-bottom:14px;font-size:11px;line-height:1.5}
  body.mobile-secondary-tab #tab-comms .comms-btn{
    min-height:46px;padding:12px;border-radius:12px;display:flex;align-items:center;justify-content:center;gap:8px;
    font-family:var(--body);font-size:12px;letter-spacing:0;text-transform:none;
  }
  body.mobile-secondary-tab #tab-comms .comms-note{font-family:var(--body);font-size:9px}
  body.mobile-secondary-tab #tab-comms .programme-details-card .card-title{margin-bottom:10px;font-size:15px}
  body.mobile-secondary-tab #tab-comms .programme-details-grid>div{padding:11px}
  body.mobile-secondary-tab #tab-comms .programme-details-grid strong{font-size:14px}

  /* Preferences and weekly summary sheets */
  #preferencesModal .ql-modal-inner,#weeklySummaryModal .ql-modal-inner{
    max-height:88vh;border:1px solid var(--border);border-bottom:0;border-radius:24px 24px 0 0;
    background:linear-gradient(180deg,#0d1c25,#071219);
  }
  #preferencesModal .ql-modal-header,#weeklySummaryModal .ql-modal-header{
    padding:17px 16px 13px;background:rgba(7,18,25,.9);border-bottom:1px solid var(--border);
  }
  #preferencesModal .ql-modal-title,#weeklySummaryModal .ql-modal-title{
    font-family:var(--body);font-size:24px;font-weight:720;letter-spacing:-.04em;text-transform:none;
  }
  #preferencesModal .modal-subtitle,#weeklySummaryModal .modal-subtitle{font-size:10px}
  #preferencesModal .ql-modal-body,#weeklySummaryModal .ql-modal-body{padding:14px 14px calc(24px + env(safe-area-inset-bottom))}
  #preferencesModal .preference-list{gap:7px}
  #preferencesModal .preference-row{
    min-height:64px;padding:10px 11px;gap:10px;border-radius:13px;
    background:linear-gradient(155deg,rgba(255,255,255,.05),rgba(255,255,255,.018));
  }
  #preferencesModal .preference-row strong{font-size:12px}
  #preferencesModal .preference-row small{font-size:9px;line-height:1.3}
  #preferencesModal .data-controls{
    margin-top:12px;padding:13px;border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.022);
  }
  #preferencesModal .data-controls>div span{font-size:10px;line-height:1.4}
  #preferencesModal .data-controls button,#preferencesModal .data-controls a{min-height:40px;padding:9px;border-radius:10px;font-size:10px}
  #weeklySummaryModal .summary-hero{gap:12px;padding:13px;border-radius:14px}
  #weeklySummaryModal .summary-hero>div:last-child strong{font-size:14px}
  #weeklySummaryModal .summary-hero>div:last-child small{font-size:10px;line-height:1.35}
  #weeklySummaryModal .summary-grid{gap:7px;margin-top:9px}
  #weeklySummaryModal .summary-grid>div{min-height:98px;padding:11px;border-radius:13px}
  #weeklySummaryModal .summary-grid small{font-size:9px}
  #weeklySummaryModal .summary-grid strong{font-size:14px}
  #weeklySummaryModal .summary-wins{margin:9px 0;padding:12px;border-radius:13px}
  #weeklySummaryModal .summary-wins strong{font-size:12px}
  #weeklySummaryModal .summary-wins p{font-size:10px;line-height:1.45}
  #weeklySummaryModal .coach-moment{margin:0;padding:11px;border:1px solid var(--border);border-radius:13px;background:rgba(255,255,255,.022)}

  #hbModal{background:rgba(0,0,0,.64);backdrop-filter:blur(9px)}
  #hbModal .hb-modal-inner{
    max-height:88vh;border:1px solid var(--border);border-bottom:0;border-radius:24px 24px 0 0;
    background:linear-gradient(180deg,#0d1c25,#071219);
  }
  #hbModal .hb-modal-header{padding:17px 16px 13px;background:rgba(7,18,25,.9)}
  #hbModal .hb-modal-title{
    font-family:var(--body);font-size:23px;font-weight:720;line-height:1.05;
    letter-spacing:-.04em;text-transform:none;
  }
  #hbModal .hb-modal-body{padding:14px 16px calc(28px + env(safe-area-inset-bottom))}
  #hbModal .hb-modal-body>div{gap:10px!important}
  #hbModal .hb-modal-body .nutrnote{padding:13px;font-size:11px;line-height:1.5}

  html.outdoor-mode body.mobile-secondary-tab .tab-content.active>.page-intro,
  html.outdoor-mode body.mobile-secondary-tab .tab-content.active>.card,
  html.outdoor-mode body.mobile-secondary-tab .tab-content.active #nutContent>.card,
  html.outdoor-mode #preferencesModal .ql-modal-inner,
  html.outdoor-mode #weeklySummaryModal .ql-modal-inner{background:#fff}
  html.outdoor-mode .more-menu-sheet{background:#fff}
  html.outdoor-mode .more-menu-grid button,
  html.outdoor-mode .more-menu-utilities button,
  html.outdoor-mode .more-outdoor,
  html.outdoor-mode #preferencesModal .preference-row{background:rgba(7,17,22,.025)}
  html.outdoor-mode #preferencesModal .ql-modal-header,
  html.outdoor-mode #weeklySummaryModal .ql-modal-header{background:rgba(255,255,255,.92)}
  html.outdoor-mode #hbModal .hb-modal-inner{background:#fff}
  html.outdoor-mode #hbModal .hb-modal-header{background:rgba(255,255,255,.92)}
  html.outdoor-mode .summary-ring{
    background:radial-gradient(circle closest-side,#fff 72%,transparent 74%),
      conic-gradient(var(--run) calc(var(--value)*1%),rgba(7,17,22,.1) 0);
  }
}

/* The guide articles still contain legacy inline formatting. Normalize those
   surfaces inside the polished reader without changing their content. */
.hb-modal-body [style*="background:#0a0a0a"]{
  background:var(--surface2)!important;border:1px solid var(--border)!important;
  border-radius:9px!important;font-family:var(--body)!important;color:var(--text)!important;
}
.hb-modal-body [style*="font-family:var(--display)"]{font-family:var(--body)!important;letter-spacing:-.02em!important;text-transform:none!important}

/* Final mobile daylight ownership.
   Several focused-tab gradients are intentionally declared late for dark mode;
   this layer makes Outdoor mode the last word across every mobile destination. */
@media(max-width:760px){
  html.outdoor-mode body.mobile-portal-home .hero-main,
  html.outdoor-mode body.mobile-portal-home .hero-side{
    background:
      radial-gradient(circle at 100% 0%,rgba(8,127,174,.08),transparent 40%),
      linear-gradient(155deg,#fff,#f7fafb)!important;
    border-color:rgba(7,17,22,.07)!important;
    box-shadow:inset 0 1px 0 #fff,0 12px 30px rgba(30,55,67,.08)!important;
  }
  html.outdoor-mode body.mobile-portal-home #todayEl .todaypanel{
    background:
      radial-gradient(circle at 100% 0%,rgba(8,127,174,.09),transparent 38%),
      linear-gradient(155deg,#f9fcfd,#f1f6f8)!important;
    border-color:rgba(8,127,174,.18)!important;
    box-shadow:inset 0 1px 0 #fff,0 14px 34px rgba(30,55,67,.1)!important;
  }
  html.outdoor-mode body.mobile-portal-home #todayEl .todayitem{
    background:#fff!important;border-color:rgba(7,17,22,.07)!important;
    box-shadow:0 8px 22px rgba(30,55,67,.065)!important;
  }
  html.outdoor-mode body.mobile-portal-home #todayEl .todaytarget{
    background:rgba(8,127,174,.055)!important;border-color:rgba(8,127,174,.13)!important;
  }
  

  html.outdoor-mode body.mobile-progress-tab #tab-progress .progress-intro,
  html.outdoor-mode body.mobile-checkin-tab #tab-checkin .page-intro,
  html.outdoor-mode body.mobile-checkin-tab .ci-main,
  html.outdoor-mode body.mobile-secondary-tab .tab-content.active>.page-intro,
  html.outdoor-mode body.mobile-secondary-tab .tab-content.active>.card,
  html.outdoor-mode body.mobile-secondary-tab .tab-content.active #nutContent>.card{
    color:var(--text)!important;border-color:rgba(7,17,22,.07)!important;
  }
  html.outdoor-mode body.mobile-secondary-tab .tab-content.active>.page-intro{
    background:
      radial-gradient(circle at 100% 0%,rgba(8,127,174,.075),transparent 42%),
      linear-gradient(155deg,#fff,#f8fafb)!important;
    box-shadow:inset 0 1px 0 #fff,0 12px 28px rgba(30,55,67,.075)!important;
  }
  html.outdoor-mode body.mobile-secondary-tab .tab-content.active>.card,
  html.outdoor-mode body.mobile-secondary-tab .tab-content.active #nutContent>.card{
    background:#fff!important;box-shadow:0 10px 26px rgba(30,55,67,.07)!important;
  }
  html.outdoor-mode body.mobile-secondary-tab #tab-goals .goals-overview{
    background:
      radial-gradient(circle at 100% 0%,rgba(8,127,174,.08),transparent 40%),
      linear-gradient(155deg,#fff,#f6fafb)!important;
    border-color:rgba(8,127,174,.16)!important;
    box-shadow:0 11px 28px rgba(30,55,67,.08)!important;
  }
  html.outdoor-mode body.mobile-secondary-tab #tab-nutrition .mc,
  html.outdoor-mode body.mobile-secondary-tab #tab-nutrition .timing-table tr,
  html.outdoor-mode body.mobile-secondary-tab #tab-comms .programme-details-grid>div{
    background:rgba(7,17,22,.025)!important;border-color:rgba(7,17,22,.065)!important;
  }

  /* Goal reflections should read like supporting copy, not headline text. */
  body.mobile-secondary-tab #tab-goals .why-textarea{
    min-height:82px!important;font-size:13px!important;line-height:1.38!important;
  }
  body.mobile-secondary-tab #tab-goals .milestone-field{
    grid-template-columns:52px minmax(0,1fr);gap:7px;
  }
  body.mobile-secondary-tab #tab-goals .milestone-field label{
    font-size:9px!important;font-weight:650;line-height:1.15;
  }
  body.mobile-secondary-tab #tab-goals .milestone-input{
    min-height:60px!important;max-height:74px;padding:9px 10px!important;
    font-size:13px!important;line-height:1.34!important;overflow-y:auto;
  }
  body.mobile-secondary-tab #tab-goals .milestone-input::placeholder{
    font-size:12px!important;line-height:1.34;
  }
}

/* ===================================================================== */
/* Next Session redesign — single source of truth for progression (v57)  */
/* One recommendation per exercise: state icon + action + weight chip,    */
/* expanded Next Session block. No competing messages.                    */
/* ===================================================================== */
.exc{--nsg:#22c55e;--nsy:#e0b64d;--nsb:#7aa7d6;--nsr:#e5678a;--nsbb:var(--run,#92d2ed)}

/* collapsed-row state icon */
.exc-summary{display:flex;align-items:center;gap:11px}
.ns-ic{width:20px;height:20px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.ns-ic.done{background:var(--nsg);color:#04120b;font-size:12px;font-weight:800}
.ns-ic.prog{border:2px solid var(--nsbb);position:relative}
.ns-ic.prog::before{content:"";position:absolute;width:20px;height:20px;border-radius:50%;border:2px solid var(--nsbb);animation:nsPulse 1.4s ease-out infinite}
.ns-ic.prog::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--nsbb)}
@keyframes nsPulse{0%{transform:scale(.7);opacity:.9}80%{transform:scale(1.7);opacity:0}100%{opacity:0}}
.ns-ic.todo{width:11px;height:11px;border:2.5px solid var(--nsb);background:transparent;margin:0 4px}
.exc.ns-t-green .ns-ic.todo{border-color:var(--nsg)}
.exc.ns-t-yellow .ns-ic.todo{border-color:var(--nsy)}
.exc.ns-t-blue .ns-ic.todo{border-color:var(--nsb)}
.exc.ns-t-red .ns-ic.todo{border-color:var(--nsr)}

/* collapsed subtitle */
.ns-sub{font-size:11.5px;color:var(--muted);margin-top:3px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ns-tag{display:inline-block;font-size:9px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:2px 7px;border-radius:5px;margin-right:7px;vertical-align:1px}
.ns-tag.done{background:var(--nsg);color:#04120b}
.ns-tag.prog{background:var(--nsbb);color:#051820}
.ns-sum{font-family:var(--mono);color:var(--dim)}
.ns-todo{color:var(--muted)}

/* weight chip in the collapsed row */
.ns-chip{flex-shrink:0;display:flex;align-items:center;gap:4px;font-variant-numeric:tabular-nums;font-size:14px;font-weight:700;border-radius:9px;padding:6px 10px;border:1px solid var(--border-mid,rgba(255,255,255,.16));background:var(--surface2)}
.ns-chip .ns-ar{font-size:13px}
.ns-chip.ns-t-green{color:var(--nsg);border-color:rgba(34,197,94,.4);background:rgba(34,197,94,.1)}
.ns-chip.ns-t-yellow{color:var(--nsy);border-color:rgba(224,182,77,.4);background:rgba(224,182,77,.1)}
.ns-chip.ns-t-blue{color:var(--nsb);border-color:rgba(122,167,214,.4);background:rgba(122,167,214,.1)}
.ns-chip.ns-t-red{color:var(--nsr);border-color:rgba(229,103,138,.4);background:rgba(229,103,138,.1)}

/* card state accents */
.exc.ns-t-green{border-left:3px solid var(--nsg)}
.exc.ns-t-yellow{border-left:3px solid var(--nsy)}
.exc.ns-t-blue{border-left:3px solid var(--nsb)}
.exc.ns-t-red{border-left:3px solid var(--nsr)}
.exc.ns-logged{border-left:3px solid var(--nsg);background-image:linear-gradient(90deg,rgba(34,197,94,.14),rgba(34,197,94,0))}
.exc.ns-inprogress{border-left:3px solid var(--nsbb);background-image:linear-gradient(90deg,rgba(146,210,237,.13),rgba(146,210,237,0))}

/* Next Session block */
.ns-block{background:var(--surface2);border:1px solid var(--border);border-radius:11px;padding:13px 14px;margin-bottom:12px}
.ns-status{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:700;border-radius:999px;padding:5px 11px;border:1px solid;margin-bottom:11px}
.ns-status .ns-dot{width:7px;height:7px;border-radius:50%}
.ns-block.ns-t-green .ns-status{color:var(--nsg);background:rgba(34,197,94,.1);border-color:rgba(34,197,94,.35)}
.ns-block.ns-t-green .ns-dot{background:var(--nsg)}
.ns-block.ns-t-yellow .ns-status{color:var(--nsy);background:rgba(224,182,77,.1);border-color:rgba(224,182,77,.35)}
.ns-block.ns-t-yellow .ns-dot{background:var(--nsy)}
.ns-block.ns-t-blue .ns-status{color:var(--nsb);background:rgba(122,167,214,.1);border-color:rgba(122,167,214,.35)}
.ns-block.ns-t-blue .ns-dot{background:var(--nsb)}
.ns-block.ns-t-red .ns-status{color:var(--nsr);background:rgba(229,103,138,.1);border-color:rgba(229,103,138,.35)}
.ns-block.ns-t-red .ns-dot{background:var(--nsr)}
.ns-hd{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin-bottom:8px}
.ns-action{font-size:18px;font-weight:800;letter-spacing:-.01em;line-height:1.2;color:var(--text)}
.ns-block.ns-t-green .ns-action{color:var(--nsg)}
.ns-block.ns-t-red .ns-action{color:var(--nsr)}
.ns-target{margin-top:11px}
.ns-tl{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);margin-bottom:6px}
.ns-tgrid{display:flex;gap:6px}
.ns-trep{flex:1;text-align:center;background:var(--surface);border:1px solid var(--border-mid,rgba(255,255,255,.16));border-radius:8px;padding:8px 4px}
.ns-tn{font-size:18px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1;color:var(--text)}
.ns-ts{font-size:8.5px;color:var(--dim);letter-spacing:.05em;text-transform:uppercase;margin-top:4px}
.ns-tnote{font-size:13px;color:var(--text);background:var(--surface);border:1px solid var(--border-mid,rgba(255,255,255,.16));border-radius:8px;padding:10px 12px}
.ns-reason{margin-top:11px;display:flex;gap:8px;font-size:11.5px;color:var(--muted);line-height:1.5}
.ns-reason .ns-ri{color:var(--nsy);flex-shrink:0;margin-top:1px}

/* Live progression milestone ladder (v58) */
.ns-mile{display:flex;align-items:center;margin-top:12px}
.ns-mnode{display:flex;flex-direction:column;align-items:center;gap:3px;opacity:.4;flex-shrink:0;transition:opacity .2s}
.ns-mnode .ns-me{font-size:14px;line-height:1;filter:grayscale(1)}
.ns-mnode .ns-ml{font-size:8px;letter-spacing:.02em;text-transform:uppercase;color:var(--dim);text-align:center;white-space:nowrap}
.ns-mnode.on{opacity:1}
.ns-mnode.on .ns-me{filter:none}
.ns-mnode.on .ns-ml{color:var(--muted)}
.ns-mnode.cur .ns-ml{color:var(--text);font-weight:700}
.ns-mnode.cur{transform:scale(1.06)}
.ns-mbar{flex:1;height:2px;background:var(--border-mid,rgba(255,255,255,.16));margin:0 4px;margin-bottom:11px;border-radius:2px;transition:background .2s}
.ns-mbar.on{background:var(--run,#92d2ed)}

/* ===================================================================== */
/* Compact mobile home — Option B: two daily sessions as slim full-width  */
/* rows (icon dot + title + one-line summary + Open), instead of tall     */
/* detail cards. Keeps a 2-session day short; 1 session spans full width. */
/* ===================================================================== */
@media(max-width:760px){
  body.mobile-portal-home #todayEl .todaylist{display:flex;flex-direction:column;gap:7px;margin-top:0}
  body.mobile-portal-home #todayEl .todayitem{padding:11px 12px;border-radius:13px}
  body.mobile-portal-home #todayEl .todaytop{display:flex;align-items:center;gap:10px}
  body.mobile-portal-home #todayEl .todaydot{width:9px;height:9px;flex-shrink:0;margin:0}
  body.mobile-portal-home #todayEl .todaymain{
    flex:1;min-width:0;display:grid;grid-template-columns:1fr auto;
    grid-template-areas:'name btn' 'meta btn';align-items:center;column-gap:10px;row-gap:2px;
  }
  body.mobile-portal-home #todayEl .todayname{
    grid-area:name;font-size:16px;line-height:1.05;margin:0;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  body.mobile-portal-home #todayEl .todaymeta{
    grid-area:meta;margin-top:0;font-size:9px;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  /* The rich brief (target, why, chips) lives one tap away, inside the session. */
  body.mobile-portal-home #todayEl .todaytarget{display:none!important}
  body.mobile-portal-home #todayEl .today-action{
    grid-area:btn;width:auto!important;margin:0!important;
    min-height:34px;padding:8px 12px;font-size:11px;white-space:nowrap;border-radius:10px;
  }
  body.mobile-portal-home #todayEl .today-action .icon{width:12px;height:12px}

}

/* ===================================================================== */
/* Mobile Home bottom-stack fixes                                        */
/*  - The Discord FAB overlapped (and sat behind) the floating Daily-Log */
/*    bar. Hide it on Home, matching the other mobile tabs.              */
/*  - Home zeroes the training panel padding, so the last nudge hid      */
/*    behind the fixed log bar + nav. Add clearance so everything fits.  */
/* ===================================================================== */
@media(max-width:760px){
  /* Keep the Discord FAB on Home, but lift it above the floating Daily-Log bar
     and raise its z-index so it always sits cleanly on top, never behind. */
  body.mobile-portal-home .wa-fab{
    bottom:calc(152px + env(safe-area-inset-bottom))!important;
    right:14px;z-index:171;
  }
  /* Clear the floating log bar, nav and the FAB so the last nudge stays visible. */
  body.mobile-portal-home .top-shell{padding-bottom:calc(200px + env(safe-area-inset-bottom))}
}

/* ===================================================================== */
/* PB colour split — purple = weight/strength PB, green (--vpb) = volume  */
/* (rep) PB. Keeps the inline set highlight consistent with the header    */
/* badges (PB = purple, Vol PB = green).                                 */
/* ===================================================================== */
.setrow.has-pb-vol .sin,.setrow-single.has-pb-vol .sin{
  border-color:var(--vpb);background:rgba(45,212,191,.20);
  box-shadow:inset 0 0 12px rgba(45,212,191,.5),0 0 14px rgba(45,212,191,.42);
  animation:vpbglow 1.8s ease-in-out infinite;
}
.pb-badge.pb-badge-vol{background:var(--vpb);color:#04231f;box-shadow:0 1px 4px rgba(13,148,136,.4)}
.outdoor-mode .setrow.has-pb-vol .sin,.outdoor-mode .setrow-single.has-pb-vol .sin{
  border-color:#0d9488;background:#c7f0ea;color:#0f3d38;-webkit-text-fill-color:#0f3d38;
  box-shadow:inset 0 0 13px rgba(13,148,136,.5),0 0 10px rgba(13,148,136,.4);
}

/* ── WEEKLY KM TARGET CARD ─────────────────────────────────────────────────── */
/* Shared card: top of the Weekly Plan tab and under the Nutrition macros. */
.wkm-card{
  /* Hidden state comes from the inline style attribute so the renderer can show
     the card by setting display:block — a display:none rule here would win. */
  position:relative;overflow:hidden;
  border-color:var(--run-border);
  background:linear-gradient(150deg,var(--run-bg),rgba(255,255,255,.015));
}
.wkm-card .wkm-head{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:11px}
.wkm-card .wkm-ico{
  width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--run-border);
  border-radius:12px;background:var(--run-bg-strong,var(--run-bg))
}
.wkm-card .wkm-ico .icon{width:17px;height:17px;color:var(--run-strong)}
.wkm-card .wkm-headtext{display:flex;flex-direction:column;gap:3px;min-width:0}
.wkm-card .wkm-kicker{
  font-family:var(--body);font-size:11px;font-weight:600;line-height:1.15;letter-spacing:-.01em;
  color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.wkm-card .wkm-figure{display:flex;align-items:baseline;gap:5px}
.wkm-card .wkm-figure strong{
  font-family:var(--body);font-size:26px;font-weight:720;line-height:1;letter-spacing:-.045em;color:var(--text)
}
.wkm-card .wkm-figure small{font-size:12px;font-weight:600;color:var(--muted)}
.wkm-card .wkm-pct{
  font-family:var(--mono);font-size:12px;font-weight:600;line-height:1;color:var(--run-strong);
  padding:5px 8px;border:1px solid var(--run-border);border-radius:999px;background:var(--run-bg);white-space:nowrap
}
.wkm-card .wkm-track{height:6px;margin-top:13px;border-radius:999px;background:rgba(255,255,255,.09);overflow:hidden}
.wkm-card .wkm-track span{display:block;width:0;height:100%;border-radius:inherit;background:var(--run);transition:width .5s ease}
.wkm-card .wkm-foot{
  display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;
  font-family:var(--body);font-size:12px;color:var(--dim)
}
.wkm-card .wkm-src{white-space:nowrap}
.wkm-card.wkm-done{border-color:var(--ok-border);background:linear-gradient(150deg,var(--ok-bg),rgba(255,255,255,.015))}
.wkm-card.wkm-done .wkm-ico{border-color:var(--ok-border);background:var(--ok-bg)}
.wkm-card.wkm-done .wkm-ico .icon,.wkm-card.wkm-done .wkm-pct{color:var(--ok)}
.wkm-card.wkm-done .wkm-pct{border-color:var(--ok-border);background:var(--ok-bg)}
.wkm-card.wkm-done .wkm-track span{background:var(--ok)}
.outdoor-mode .wkm-card{background:linear-gradient(150deg,var(--run-bg),#fff);border-color:var(--run-border)}
.outdoor-mode .wkm-card .wkm-track{background:rgba(7,17,22,.1)}
.outdoor-mode .wkm-card.wkm-done{background:linear-gradient(150deg,var(--ok-bg),#fff)}
@media(max-width:400px){
  .wkm-card .wkm-head{grid-template-columns:34px minmax(0,1fr) auto;gap:9px}
  .wkm-card .wkm-ico{width:34px;height:34px;border-radius:11px}
  .wkm-card .wkm-figure strong{font-size:23px}
  .wkm-card .wkm-foot{font-size:11px}
}

/* ── PROGRAMME VOLUME STRIP + CHART ────────────────────────────────────────── */
/* Week-by-week running volume. Strip sits under the km card on Weekly Plan and
   Nutrition; the Progress tab draws the same data as a full-width SVG. */
.vstrip-card{padding-bottom:14px}
.vstrip-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.vstrip-title{font-family:var(--body);font-size:13px;font-weight:650;letter-spacing:-.01em;color:var(--text);white-space:nowrap}
.vstrip-legend{display:flex;align-items:center;gap:10px;font-family:var(--body);font-size:10px;color:var(--dim)}
.vstrip-legend span{display:inline-flex;align-items:center;gap:4px}
.vstrip-legend i{width:8px;height:8px;border-radius:2px;display:inline-block}
.vstrip-legend .key-planned{border:1px solid var(--run-border);background:var(--run-bg)}
.vstrip-legend .key-actual{background:var(--run)}
.vstrip-scroll{
  display:flex;gap:6px;overflow-x:auto;padding:2px 0 4px;scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;
}
.vstrip-scroll::-webkit-scrollbar{display:none}
.vstrip-week{
  flex:0 0 auto;width:40px;display:flex;flex-direction:column;align-items:center;gap:5px;
  padding:4px 2px 5px;border:1px solid transparent;border-radius:10px;background:transparent;
  cursor:pointer;font:inherit;color:inherit;transition:background .15s,border-color .15s
}
.vstrip-week:hover{background:var(--run-bg);border-color:var(--run-border)}
.vstrip-bar{
  position:relative;width:16px;height:56px;border-radius:5px;
  background:rgba(255,255,255,.06);overflow:hidden;display:block
}
.vstrip-bar i,.vstrip-bar b{position:absolute;left:0;right:0;bottom:0;display:block;border-radius:5px}
.vstrip-bar i{background:var(--run-bg-strong,var(--run-bg));border:1px solid var(--run-border)}
.vstrip-bar b{background:var(--run);opacity:.95}
.vstrip-week.is-hit .vstrip-bar b{background:var(--ok)}
.vstrip-week.is-future .vstrip-bar i{opacity:.6}
.vstrip-km{font-family:var(--body);font-size:10px;font-weight:600;line-height:1;color:var(--muted)}
.vstrip-wk{font-family:var(--body);font-size:9px;line-height:1;color:var(--dim)}
/* Completed weeks label what the athlete actually ran; this line says how that
   compared to the plan. Rendered on every week (empty when there is nothing to
   say) so all the bars keep a shared baseline. Tabular figures stop the number
   jittering as the strip re-renders. */
.vstrip-delta{
  font-family:var(--body);font-size:9px;font-weight:700;line-height:1;
  color:var(--dim);min-height:9px;font-variant-numeric:tabular-nums;
  white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis
}
/* Over or on target. Under target stays recessive on purpose: a 1km miss is not
   worth a warning colour, and the signed number already says which way it went. */
.vstrip-delta.over{color:var(--ok)}
.vstrip-week.is-current .vstrip-delta{color:var(--run-strong);font-weight:600}
/* The unit, stated once, so nine bar labels can stay bare numbers. */
.vstrip-titlewrap{display:flex;align-items:baseline;gap:5px;min-width:0}
.vstrip-unit{
  font-family:var(--body);font-size:10px;font-weight:600;line-height:1;color:var(--dim);
  border:1px solid var(--border);border-radius:5px;padding:2px 5px;flex:0 0 auto
}
.vstrip-toggle .vstrip-titlewrap{flex:1;min-width:0}
.vstrip-toggle .vstrip-titlewrap>.vstrip-title{flex:0 1 auto}
.vstrip-week.is-current{background:var(--run-bg);border-color:var(--run-border)}
.vstrip-week.is-current .vstrip-km{color:var(--run-strong)}
.vstrip-week.is-current .vstrip-wk{color:var(--run-strong);font-weight:700}
.vstrip-foot{
  display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;
  padding-top:9px;border-top:1px solid var(--border);
  font-family:var(--body);font-size:11px;color:var(--dim)
}
.pgvol-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.pgvol-scroll::-webkit-scrollbar{display:none}
.pgvol-scroll svg{display:block;max-width:none}
.outdoor-mode .vstrip-bar{background:rgba(7,17,22,.07)}
@media(max-width:400px){
  .vstrip-week{width:36px}
  .vstrip-bar{width:14px;height:48px}
  .vstrip-foot{flex-direction:column;align-items:flex-start;gap:3px}
}

/* ── LIVE SESSION LINE + APPROXIMATE LOAD NOTE ─────────────────────────────── */
/* The Next Session verdict is frozen on last session. This is today's running
   total, kept visually separate so the two are never confused. */
.ns-live{
  display:flex;align-items:center;gap:8px;margin-top:11px;padding-top:10px;
  border-top:1px dashed var(--border);
  font-family:var(--body);font-size:11.5px;line-height:1.4;color:var(--muted)
}
.ns-live-k{
  flex-shrink:0;font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--dim);padding:2px 6px;border:1px solid var(--border);border-radius:999px
}
.ns-live.ahead{color:var(--ok)}
.ns-live.ahead .ns-live-k{color:var(--ok);border-color:var(--ok-border);background:var(--ok-bg)}
.ns-approx{
  margin-top:6px;font-family:var(--body);font-size:11px;line-height:1.4;color:var(--dim)
}
.outdoor-mode .ns-live{border-top-color:var(--border)}

/* ── WORKING-SET CLARITY + LIVE NEXT-SESSION COACHING ───────────────────────
   Warm-ups remain visible in the logger but are explicitly separated from
   the working sets that drive progression. */
.ns-warmup-map{
  margin-top:7px;font-family:var(--body);font-size:10px;line-height:1.4;color:var(--dim)
}
.working-set-note{
  display:flex;align-items:center;gap:9px;margin:9px 0 10px;padding:9px 10px;
  border:1px solid var(--run-border);border-radius:9px;background:var(--run-bg)
}
.working-set-note>span{
  display:grid;place-items:center;flex:0 0 30px;width:30px;height:24px;border-radius:7px;
  background:var(--surface);font-family:var(--mono);font-size:9px;font-weight:750;color:var(--run)
}
.working-set-note strong,.working-set-note small{display:block;font-family:var(--body)}
.working-set-note strong{font-size:11px;line-height:1.2;color:var(--text)}
.working-set-note small{margin-top:2px;font-size:9px;line-height:1.35;color:var(--muted)}
.setrow.is-warmup,.setrow-single.is-warmup{opacity:.78}
.setrow.is-warmup .snum,.setrow-single.is-warmup .snum{
  font-size:8px!important;font-weight:750;letter-spacing:.02em;color:var(--run)
}
.setrow.is-warmup .sin,.setrow-single.is-warmup .sin,.setrow.is-warmup .rpe-in{
  border-style:dashed;background:rgba(146,210,237,.025)
}
.ns-live-wrap{margin-top:11px;border-top:1px dashed var(--border)}
.ns-live-wrap .ns-live{margin-top:0;padding-top:10px;border-top:0}
.ns-live-prompt{
  display:flex;align-items:flex-start;gap:8px;margin-top:8px;padding:9px 10px;
  border:1px solid var(--border);border-radius:9px;background:var(--surface);
  font-family:var(--body);font-size:11px;font-weight:650;line-height:1.4;color:var(--text)
}
.ns-live-prompt .icon{flex:0 0 14px;width:14px;height:14px;margin-top:1px;color:var(--run)}
.ns-live-prompt.ns-t-green{
  border-color:var(--ok-border);background:var(--ok-bg);color:var(--ok)
}
.ns-live-prompt.ns-t-green .icon{color:var(--ok)}
.ns-live-prompt.ns-t-yellow{border-color:rgba(224,182,77,.3);background:rgba(224,182,77,.07);color:var(--nsy)}
.ns-live-prompt.ns-t-yellow .icon{color:var(--nsy)}
.ns-live-prompt.ns-t-red{border-color:rgba(229,103,138,.3);background:rgba(229,103,138,.07);color:var(--nsr)}
.ns-live-prompt.ns-t-red .icon{color:var(--nsr)}
.outdoor-mode .working-set-note{background:rgba(8,127,174,.045)}
.outdoor-mode .working-set-note>span{background:#fff}
.outdoor-mode .setrow.is-warmup .sin,.outdoor-mode .setrow-single.is-warmup .sin,.outdoor-mode .setrow.is-warmup .rpe-in{background:rgba(8,127,174,.025)}
.outdoor-mode .ns-live-wrap{border-top-color:var(--border)}

@media(max-width:760px){
  .working-set-note{margin-top:8px;padding:8px 9px}
  .working-set-note small{font-size:10px}
  .ns-live-prompt{font-size:11.5px}
}

/* ── VOLUME STRIP: COLLAPSED STATE (Weekly Plan) ───────────────────────────── */
/* The week list is the point of that page, so the block history folds away to a
   single summary row and remembers whichever way the athlete leaves it. */
.vstrip-card.is-collapsible{padding:0}
.vstrip-card.is-collapsible .vstrip-body{display:none;padding:0 16px 14px}
.vstrip-card.is-collapsible.is-open .vstrip-body{display:block}
.vstrip-toggle{
  display:flex;align-items:center;gap:10px;width:100%;padding:13px 16px;
  border:0;border-radius:inherit;background:transparent;cursor:pointer;
  font:inherit;color:inherit;text-align:left;
}
.vstrip-toggle .vstrip-title{flex:1;min-width:0}
.vstrip-sum{
  font-family:var(--body);font-size:11.5px;color:var(--dim);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis
}
.vstrip-chev{
  width:15px;height:15px;flex-shrink:0;color:var(--dim);
  transform:rotate(-90deg);transition:transform .2s ease
}
.is-open .vstrip-chev{transform:rotate(90deg)}
.vstrip-legend-row{justify-content:flex-end;margin-bottom:8px}
.vstrip-card.is-collapsible .vstrip-foot{margin-top:6px}
/* Weeks with no target yet: keep the column for alignment, drop the empty track. */
.vstrip-week.is-empty .vstrip-bar{background:transparent;border:1px dashed var(--border)}
.vstrip-week.is-empty .vstrip-km{min-height:11px}
.sport-targets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-bottom:12px}
.sport-target{
  min-width:0;padding:11px;border:1px solid var(--border);border-radius:11px;background:var(--surface2)
}
.sport-target-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}
.sport-target-name{font-family:var(--body);font-size:12px;font-weight:750;color:var(--text)}
.sport-target-lock{
  font-family:var(--mono);font-size:8px;font-weight:650;line-height:1.2;letter-spacing:.035em;
  color:var(--dim);text-transform:uppercase;white-space:nowrap
}
.sport-target-status{
  font-family:var(--mono);font-size:8px;font-weight:650;line-height:1.2;letter-spacing:.035em;
  color:var(--muted);text-transform:uppercase;white-space:nowrap
}
.sport-target-unprescribed{border-style:dashed;background:transparent}
.sport-target-distance{display:flex;align-items:baseline;gap:4px;font-family:var(--body);font-variant-numeric:tabular-nums}
.sport-target-distance strong{font-size:20px;letter-spacing:-.035em;color:var(--text)}
.sport-target-distance span{font-size:11px;color:var(--dim)}
.sport-target-track{height:5px;margin-top:8px;border-radius:999px;background:var(--border);overflow:hidden}
.sport-target-track i{display:block;height:100%;border-radius:inherit;background:var(--run)}
.sport-target-cycling .sport-target-track i{background:var(--strength)}
.sport-target-swimming .sport-target-track i{background:#43b7cf}
.sport-target-meta{display:flex;flex-wrap:wrap;gap:5px 9px;margin-top:8px;font-size:10px;color:var(--muted)}
.sport-target-note{margin-top:8px;padding-top:8px;border-top:1px solid var(--border);font-size:10.5px;line-height:1.4;color:var(--muted)}
.sport-target-error{
  display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 12px;
  border:1px solid var(--border);border-radius:10px;background:var(--surface2);font-size:11px;color:var(--muted)
}
.sport-target-error button{
  flex:0 0 auto;border:1px solid var(--border);border-radius:7px;padding:6px 9px;background:var(--surface);
  color:var(--text);font:600 10px var(--body);cursor:pointer
}
.vstrip-subtitle{margin:12px 0 5px;font:650 10px var(--body);color:var(--dim);text-transform:uppercase;letter-spacing:.04em}
.vstrip-running-block:first-child .vstrip-subtitle{margin-top:0}
.vstrip-card.is-collapsible .sport-targets{margin-top:1px}
@media(max-width:640px){
  .sport-targets{grid-template-columns:1fr}
  .vstrip-sum{max-width:52vw}
  .sport-target{padding:10px 11px}
}
:root{scroll-behavior:smooth}
.skip-link{position:fixed;left:12px;top:10px;z-index:9999;transform:translateY(-160%);padding:10px 14px;border-radius:8px;background:#92d2ed;color:#071015;font-weight:800;text-decoration:none;transition:transform .15s}
.skip-link:focus{transform:translateY(0)}
[role="button"]:focus-visible{outline:3px solid var(--run);outline-offset:3px}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* ══════════════════════════════════════════════════════════════════════
   HOME DENSITY PASS
   Same features, less furniture. Three principles:
   1. One level of card nesting. Space separates groups, padding does not.
   2. One filled accent element on screen at a time.
   3. Every week metric reads as done/target with a hairline bar.
   ══════════════════════════════════════════════════════════════════════ */

/* The hero is a single column now that weekly output folded into the grid. */
.hero-shell{grid-template-columns:1fr}

/* ── Readiness chip ────────────────────────────────────────────────────
   Readiness is an action, not a number, so it sits with the pills rather
   than taking a full cell in the metric grid. */
.hpills{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.readiness-chip{
  display:inline-flex;align-items:center;gap:8px;
  padding:4px 12px 4px 4px;border:1px solid var(--run-border);border-radius:999px;
  background:var(--run-bg);cursor:pointer;font-family:var(--body);line-height:1
}
.readiness-chip:active{background:var(--run-bg-strong)}
.readiness-chip .hero-readiness-ring{width:26px;height:26px;flex:0 0 26px;margin:0}
.readiness-chip .hero-stat-value{font-size:11px;font-weight:800}
.readiness-chip-text{display:flex;flex-direction:column;gap:1px;text-align:left;min-width:0}
.readiness-chip-label{
  font-family:var(--mono);font-size:7.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--dim)
}
.readiness-chip .hero-stat-note{
  margin:0;font-family:var(--body);font-size:11px;font-weight:600;
  color:var(--run);letter-spacing:0;text-transform:none;white-space:nowrap
}

/* ── Week metric grid ──────────────────────────────────────────────────
   Four numbers, no card chrome. Tabular figures so values do not jitter
   as they update. */
.hero-metric-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px 18px}
.metric-cell{
  display:flex;flex-direction:column;gap:6px;min-width:0;
  margin:0;padding:0;border:0;background:none;text-align:left;
  font-family:var(--body);color:inherit
}
.metric-cell-action{cursor:pointer;-webkit-appearance:none;appearance:none}
.metric-cell-action:active{opacity:.65}
.metric-cell-action:focus-visible{outline:2px solid var(--run);outline-offset:4px;border-radius:4px}
.metric-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;min-width:0}
.metric-label{
  font-family:var(--mono);font-size:8.5px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.metric-val{
  font-family:var(--display);font-size:20px;font-weight:800;line-height:1;
  color:var(--text);white-space:nowrap;
  font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1
}
.metric-val small{
  font-family:var(--mono);font-size:9.5px;font-weight:400;letter-spacing:.02em;
  color:var(--dim);margin-left:1px
}
.metric-track{display:block;height:3px;border-radius:2px;background:rgba(255,255,255,.09);overflow:hidden}
.metric-track>span{
  display:block;height:100%;width:0;border-radius:2px;background:var(--run);
  transition:width .55s cubic-bezier(.2,.7,.2,1)
}
.metric-track-empty{background:transparent}
.metric-cell.km-hit .metric-track>span{background:var(--ok)}
.metric-note{
  display:flex;align-items:center;gap:4px;min-height:10px;
  font-family:var(--mono);font-size:8px;letter-spacing:.07em;text-transform:uppercase;color:var(--dim)
}
.metric-week{color:rgba(255,255,255,.26);margin-left:auto}

@media(min-width:900px){
  .hero-metric-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 24px}
  .metric-val{font-size:24px}
  .metric-label{font-size:9px}
}

/* ── This week card ────────────────────────────────────────────────────
   Mobile only. The call, check-in and photo nudges share one card of
   compact rows instead of three full-bleed strips. Desktop keeps its
   three-column layout, where the strips have room to breathe. */
@media(max-width:760px){
  .week-card{
    margin-top:8px;padding:0 2px;gap:0;
    border:1px solid var(--border);border-radius:16px;background:rgba(255,255,255,.022)
  }
  .week-card:empty{display:none}
  .week-card>.nudge-strip{
    background:none;border:0;border-top:1px solid var(--border);border-radius:0;
    padding:0 11px;box-shadow:none;cursor:pointer
  }
  .week-card>.nudge-strip:first-of-type{border-top:0}
  .week-card>.nudge-strip .nudge-strip-inner{min-height:42px;gap:11px;max-width:none}
  .week-card>.nudge-strip .nudge-strip-title{
    font-family:var(--body);font-size:13.5px;font-weight:600;
    text-transform:none;letter-spacing:0;color:var(--text)
  }
  .week-card>.nudge-strip .nudge-strip-sub{display:none}
  .week-card>.nudge-strip .nudge-strip-icon{
    width:20px;height:20px;flex:0 0 20px;
    background:none;border:0;box-shadow:none;color:var(--dim)
  }
  .week-card>.nudge-strip .nudge-strip-icon .icon{width:17px;height:17px}
  .week-card>.nudge-strip .nudge-strip-arr{color:var(--dim);opacity:.7}
  /* A due item gets a dot, not a second filled button. */
  .week-card>#checkinNudge .nudge-strip-arr::before{
    content:"";width:6px;height:6px;border-radius:50%;background:var(--run);
    display:inline-block;margin-right:9px;vertical-align:middle
  }
  .outdoor-mode .week-card{background:rgba(255,255,255,.6);border-color:rgba(7,17,22,.1)}
  .outdoor-mode .week-card>.nudge-strip{border-top-color:rgba(7,17,22,.1)}
  .outdoor-mode .week-card>.nudge-strip .nudge-strip-title{color:#071015}
}

/* ── Daily log dock ────────────────────────────────────────────────────
   Pinned because both are daily. Only the next unlogged segment is
   filled; a completed segment drops to a quiet done state. */
.quicklog-btn .ql-icon-done,.quicklog-btn .ql-icon-sending{display:none}
.quicklog-btn.is-done .ql-icon-todo{display:none}
.quicklog-btn.is-done .ql-icon-done{display:inline-block}
.quicklog-btn.is-done{background:transparent;border-color:transparent;color:var(--ok);opacity:.85}
.quicklog-btn.is-next{background:var(--run);border-color:var(--run);color:#071015;font-weight:800}
.quicklog-btn.is-next .icon{color:#071015}
.quicklog-strip.all-logged{opacity:.72}
.outdoor-mode .quicklog-btn.is-next{background:#1f7fa6;border-color:#1f7fa6;color:#fff}
.outdoor-mode .quicklog-btn.is-next .icon{color:#fff}
.outdoor-mode .quicklog-btn.is-done{color:#12794a}

/* Saved here, not with the coaches yet. Deliberately louder than "to do" and
   never green: the athlete has done the work, so the message is "this has not
   arrived", not "you forgot". Colour alone would not carry that, so the icon
   changes to an alert and a line of text spells it out underneath. */
.quicklog-btn.is-sending .ql-icon-todo{display:none}
.quicklog-btn.is-sending .ql-icon-sending{display:inline-block}
.quicklog-btn.is-sending{background:rgba(240,173,78,.14);border-color:rgba(240,173,78,.55);color:#f0ad4e;font-weight:800}
.quicklog-btn.is-sending .icon{color:#f0ad4e}
.quicklog-hint{margin:6px 2px 0;font-size:11.5px;line-height:1.45;color:#f0ad4e}
.outdoor-mode .quicklog-btn.is-sending{background:#fff4e2;border-color:#b5710f;color:#8a5406}
.outdoor-mode .quicklog-btn.is-sending .icon{color:#8a5406}
.outdoor-mode .quicklog-hint{color:#8a5406}

/* ── Outdoor (light) mode parity ───────────────────────────────────────── */
.outdoor-mode .metric-track{background:rgba(7,17,22,.1)}
.outdoor-mode .metric-val{color:#071015}
.outdoor-mode .metric-label,.outdoor-mode .metric-note{color:rgba(7,17,22,.55)}
.outdoor-mode .metric-week{color:rgba(7,17,22,.35)}
.outdoor-mode .readiness-chip-label{color:rgba(7,17,22,.55)}

/* ── Mobile home: flatten nesting, spend the accent once ──────────────── */
@media(max-width:760px){
  body.mobile-portal-home .hero-main{padding:13px 14px 12px;border-radius:18px}
  body.mobile-portal-home .hero-bottom{gap:11px;margin-top:8px}
  body.mobile-portal-home .hpills{margin-bottom:0}
  body.mobile-portal-home .hero-metric-grid{gap:11px 16px}
  body.mobile-portal-home .metric-val{font-size:18px}
  /* Today's card carries the only filled button on the screen, so the
     surrounding panels drop their competing fills and heavy borders. */
  body.mobile-portal-home #todayEl .todaypanel{
    border:1px solid var(--border);
    box-shadow:none
  }
}

/* ── Adaptive Progress experience ───────────────────────────────────────
   The current photo check-in is the primary action. Historical photos,
   running volume and the raw weight log stay available without competing
   with the current-week decision. */
.progress-photo-priority{
  border-color:rgba(146,210,237,.2)!important;
  background:
    radial-gradient(circle at 100% 0%,rgba(146,210,237,.075),transparent 38%),
    linear-gradient(155deg,rgba(16,27,34,.96),rgba(7,16,22,.94))!important;
}
.photo-current-action{
  display:block;width:100%;padding:16px;border:1px solid rgba(146,210,237,.24);
  border-radius:15px;background:linear-gradient(145deg,rgba(146,210,237,.09),rgba(146,210,237,.025));
  color:var(--text);font:inherit;text-align:left;cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  transition:border-color .18s,background .18s,transform .15s;
}
.photo-current-action:hover{border-color:rgba(146,210,237,.44);background:linear-gradient(145deg,rgba(146,210,237,.13),rgba(146,210,237,.04))}
.photo-current-action:active{transform:scale(.992)}
.photo-current-action.is-complete{
  border-color:rgba(77,201,139,.28);
  background:linear-gradient(145deg,rgba(77,201,139,.09),rgba(77,201,139,.02));
}
.photo-current-top{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.photo-current-copy,.photo-current-copy span,.photo-current-copy strong{display:block}
.photo-current-eyebrow{
  margin-bottom:5px;font-size:9px;font-weight:650;line-height:1.2;
  letter-spacing:.08em;text-transform:uppercase;color:var(--run);
}
.photo-current-copy strong{font-size:20px;font-weight:720;line-height:1.1;letter-spacing:-.035em;color:var(--text)}
.photo-current-copy>span:last-child{margin-top:5px;font-size:11px;line-height:1.4;color:var(--muted)}
.photo-current-count{
  flex:0 0 auto;min-width:51px;padding:9px 10px;border:1px solid var(--run-border);
  border-radius:999px;background:var(--run-bg);font-size:13px;font-weight:750;
  line-height:1;text-align:center;color:var(--run);
}
.photo-current-action.is-complete .photo-current-count{border-color:rgba(77,201,139,.28);background:rgba(77,201,139,.09);color:var(--ok)}
.photo-current-progress{
  display:block;height:5px;margin-top:14px;overflow:hidden;border-radius:999px;
  background:rgba(255,255,255,.075);
}
.photo-current-progress>span{
  display:block;width:0;height:100%;border-radius:inherit;
  background:linear-gradient(90deg,var(--run),#a9e0f5);transition:width .25s ease;
}
.photo-current-action.is-complete .photo-current-progress>span{background:var(--ok)}
.photo-angle-statuses{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;margin-top:12px}
.photo-angle-statuses>span{
  display:flex;min-width:0;align-items:center;gap:5px;font-size:8px;line-height:1.15;
  white-space:nowrap;color:var(--dim);overflow:hidden;text-overflow:ellipsis;
}
.photo-angle-statuses i{
  display:block;flex:0 0 7px;width:7px;height:7px;border:1px solid var(--border-mid);
  border-radius:50%;background:transparent;
}
.photo-angle-statuses .is-done{color:var(--muted)}
.photo-angle-statuses .is-done i{border-color:var(--run);background:var(--run);box-shadow:0 0 0 3px rgba(146,210,237,.08)}
.photo-current-action.is-complete .photo-angle-statuses .is-done i{border-color:var(--ok);background:var(--ok);box-shadow:0 0 0 3px rgba(77,201,139,.08)}
.photo-current-cta{
  display:flex;align-items:center;justify-content:space-between;margin-top:14px;padding-top:12px;
  border-top:1px solid var(--border);font-size:12px;font-weight:700;color:var(--run);
}
.photo-current-cta>span{font-size:20px;font-weight:400;line-height:.7}
.photo-current-action.is-complete .photo-current-cta{color:var(--ok)}
.photo-history-details{margin-top:13px;border-top:1px solid var(--border)}
.photo-history-details summary{
  display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:46px;
  list-style:none;cursor:pointer;font-size:11px;font-weight:650;color:var(--muted);
}
.photo-history-details summary::-webkit-details-marker{display:none}
.photo-history-meta{display:flex;align-items:center;gap:9px;font-size:9px;font-weight:550;color:var(--dim)}
.photo-history-meta .icon{width:14px;height:14px;transition:transform .18s}
.photo-history-details[open] .photo-history-meta .icon{transform:rotate(180deg)}
.photo-history-body{padding-top:3px}
.photo-history-empty{
  grid-column:1/-1;padding:18px 12px;border:1px dashed var(--border);border-radius:12px;
  font-size:10px;line-height:1.45;text-align:center;color:var(--dim);
}
.progress-collapse-toggle{
  width:100%;padding:0;border:0;background:none;color:inherit;text-align:left;
  font:inherit;cursor:default;
}
.progress-collapse-icons{display:flex;align-items:center;gap:8px}
.progress-collapse-chevron{display:none;width:16px;height:16px;color:var(--dim);transition:transform .18s}
.progress-collapsible-body{display:block}

/* The photo sheet works like a short guided checklist, with one clear next step. */
.photo-modal-inner{max-width:680px}
.photo-modal-guide{
  margin-bottom:14px;padding:13px 14px;border:1px solid var(--border);border-radius:13px;
  background:var(--surface);
}
.photo-modal-guide>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:12px}
.photo-modal-guide span{font-size:10px;font-weight:600;color:var(--muted)}
.photo-modal-guide strong{font-size:11px;font-weight:700;color:var(--run)}
.photo-modal-guide p{margin:9px 0 0;font-size:10px;line-height:1.4;color:var(--dim)}
.photo-modal-progress{height:4px;margin-top:10px;overflow:hidden;border-radius:999px;background:var(--border)}
.photo-modal-progress span{display:block;width:0;height:100%;border-radius:inherit;background:var(--run);transition:width .25s}
.angle-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.angle-slot{border-radius:12px;color:inherit;font:inherit;padding:0;-webkit-appearance:none;appearance:none}
.angle-slot.next-angle{
  border-style:solid;border-color:var(--run);
  background:linear-gradient(145deg,rgba(146,210,237,.1),rgba(146,210,237,.025));
  box-shadow:0 0 0 3px rgba(146,210,237,.08);
}
.photo-next-btn{
  display:block;width:100%;min-height:48px;margin-top:14px;padding:12px 16px;border:0;
  border-radius:12px;background:var(--run);font-family:var(--body);font-size:13px;
  font-weight:750;color:#061117;cursor:pointer;box-shadow:0 10px 24px rgba(8,127,174,.16);
}
.photo-next-btn[hidden]{display:none}

html.outdoor-mode .progress-photo-priority{
  border-color:rgba(8,127,174,.16)!important;
  background:
    radial-gradient(circle at 100% 0%,rgba(8,127,174,.075),transparent 40%),
    linear-gradient(155deg,#fff,#f7fafb)!important;
}
html.outdoor-mode .photo-current-action{
  border-color:rgba(8,127,174,.19);background:linear-gradient(145deg,rgba(8,127,174,.07),rgba(8,127,174,.015));
  box-shadow:inset 0 1px 0 #fff;
}
html.outdoor-mode .photo-current-progress{background:rgba(7,17,22,.09)}
html.outdoor-mode .photo-modal-guide{background:rgba(7,17,22,.025)}
html.outdoor-mode .photo-next-btn{background:#087fae;color:#fff}

@media(max-width:760px){
  body.mobile-progress-tab #tab-progress .progress-intro{padding:14px 15px}
  body.mobile-progress-tab #tab-progress .page-copy{display:none}
  body.mobile-progress-tab #tab-progress .progress-card{padding:13px 14px}
  body.mobile-progress-tab .progress-photo-card{padding-right:14px!important}
  body.mobile-progress-tab .progress-photo-card .progress-section-head{padding-right:0}
  body.mobile-progress-tab .progress-photo-priority{margin-top:0}
  body.mobile-progress-tab .photo-current-action{padding:14px;border-radius:14px}
  body.mobile-progress-tab .photo-current-copy strong{font-size:18px}
  body.mobile-progress-tab .photo-current-copy>span:last-child{font-size:10px}
  body.mobile-progress-tab .photo-current-count{min-width:48px;padding:8px 9px;font-size:12px}
  body.mobile-progress-tab .photo-angle-statuses{gap:5px}
  body.mobile-progress-tab .photo-angle-statuses>span{
    display:block;text-align:center;font-size:0;overflow:visible;
  }
  body.mobile-progress-tab .photo-angle-statuses i{margin:0 auto;width:8px;height:8px}
  body.mobile-progress-tab .photo-current-cta{margin-top:12px;padding-top:11px}
  body.mobile-progress-tab .photo-history-details summary{min-height:42px}
  body.mobile-progress-tab .photo-history-body{margin-right:-14px}
  body.mobile-progress-tab .photo-history-body .photo-grid{
    padding-right:14px;grid-auto-columns:88px;
  }
  body.mobile-progress-tab .photo-history-body .photo-cell{width:88px}
  body.mobile-progress-tab .photo-history-body .progress-photo-hint{padding-right:14px}

  body.mobile-progress-tab .progress-collapse-toggle{margin:0;cursor:pointer}
  body.mobile-progress-tab .progress-collapse-icons .progress-section-icon{display:none}
  body.mobile-progress-tab .progress-collapse-chevron{display:block}
  body.mobile-progress-tab .progress-collapsible-card .progress-section-head{margin-bottom:0}
  body.mobile-progress-tab .progress-collapsible-card .progress-collapsible-body{display:none;padding-top:11px}
  body.mobile-progress-tab .progress-collapsible-card.is-open .progress-collapsible-body{display:block}
  body.mobile-progress-tab .progress-collapsible-card.is-open .progress-collapse-chevron{transform:rotate(180deg)}
  body.mobile-progress-tab .progress-collapsible-card .progress-section-copy{max-width:260px}

  .photo-modal-inner{padding:18px 14px calc(22px + env(safe-area-inset-bottom));max-height:92vh;border-radius:22px 22px 0 0}
  .photo-modal-header{margin-bottom:12px}
  .photo-modal-title{font-family:var(--body);font-size:20px;text-transform:none;letter-spacing:-.03em}
  .photo-modal-guide{margin-bottom:12px;padding:12px}
  .angle-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
  .angle-slot{aspect-ratio:.78;border-radius:11px}
  .angle-slot .aslot-label{padding:0 4px;font-family:var(--body);font-size:8px;letter-spacing:0;text-transform:none}
  .angle-slot .aslot-overlay{font-family:var(--body);font-size:8px;letter-spacing:0;text-transform:none}
  .photo-next-btn{position:sticky;bottom:0;z-index:5;margin-top:12px}
}

/* ══════════════════════════════════════════════════════════════════════
   READINESS CHIP · size correction · v91
   The chip shares a row with the Strava pill, so it has to read as a pill
   too. The ring was inheriting the old hero-stat sizes and pushing the row
   taller than everything beside it.
   ══════════════════════════════════════════════════════════════════════ */
.hpills .readiness-chip{padding:3px 11px 3px 3px;gap:7px;max-width:100%;min-width:0}
.hpills .readiness-chip .hero-readiness-ring{width:24px;height:24px;flex:0 0 24px;margin:0}
.hpills .readiness-chip .hero-readiness-ring .hero-stat-value{margin:0;font-size:10px;font-weight:800}
.hpills .readiness-chip-text{gap:0;min-width:0;overflow:hidden}
.hpills .readiness-chip-label{font-size:7px;letter-spacing:.12em;line-height:1.3}
.hpills .readiness-chip .hero-stat-note{
  margin:0;font-size:10.5px;line-height:1.25;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
@media(max-width:390px){
  .hpills .readiness-chip{padding:3px 9px 3px 3px;gap:6px}
  .hpills .readiness-chip .hero-readiness-ring{width:22px;height:22px;flex:0 0 22px}
  .hpills .readiness-chip .hero-readiness-ring .hero-stat-value{font-size:9.5px}
  .hpills .readiness-chip .hero-stat-note{font-size:10px}
}

/* Mobile Home keeps both utility pills on one quiet, balanced row. */
@media(max-width:760px){
  body.mobile-portal-home #trainingVolumeStrip{display:none!important}
  body.mobile-portal-home .hero-support{
    display:block;overflow:visible;font-size:10.5px;line-height:1.3;
    -webkit-line-clamp:unset;line-clamp:unset;
  }
  body.mobile-portal-home .hpills .readiness-chip{padding:2px 8px 2px 2px;gap:5px}
  body.mobile-portal-home .hpills .readiness-chip .hero-readiness-ring{
    width:22px;height:22px;flex:0 0 22px;
  }
  body.mobile-portal-home .hpills .readiness-chip .hero-readiness-ring .hero-stat-value{font-size:9px}
  body.mobile-portal-home .hpills .readiness-chip-label{font-size:6px;line-height:1.15}
  body.mobile-portal-home .hpills .readiness-chip .hero-stat-note{font-size:9.5px;line-height:1.15}
}
/* ══════════════════════════════════════════════════════════════════════
   WEEKLY NUDGES · urgency + completion · v91
   Three states, one vocabulary:
     .is-due   — outstanding. Accent rail, live dot, ambient glow.
     .is-done  — completed. Green tick, quiet type, no motion.
     hidden    — nothing left to say, the row unmounts entirely.
   Only outstanding rows animate, so movement always means "act on this".
   Selectors are id-qualified on purpose: the rows carry a lot of legacy
   per-id styling and the state classes have to win over all of it.
   ══════════════════════════════════════════════════════════════════════ */
:root{
  --nudge-due:#f59e0b;--nudge-due-soft:rgba(245,158,11,.16);--nudge-due-line:rgba(245,158,11,.52);
  --nudge-done:#22c55e;--nudge-done-soft:rgba(34,197,94,.13);--nudge-done-line:rgba(34,197,94,.32);
}
.outdoor-mode{
  --nudge-due:#d97706;--nudge-due-soft:rgba(217,119,6,.13);--nudge-due-line:rgba(217,119,6,.52);
  --nudge-done:#15803d;--nudge-done-soft:rgba(21,128,61,.1);--nudge-done-line:rgba(21,128,61,.32);
}
.nudge-strip{
  position:relative;
  transition:background .25s ease,border-color .25s ease,box-shadow .25s ease,opacity .2s ease
}

/* ── Leading-edge rail — cheapest possible "this one matters" signal ──── */
#goalsBanner.is-due::before,#callNudge.is-due::before,
#checkinNudge.is-due::before,#photoNudge.is-due::before{
  content:'';position:absolute;left:0;top:6px;bottom:6px;width:4px;border-radius:0 4px 4px 0;
  background:var(--nudge-due);box-shadow:0 0 10px var(--nudge-due-soft)
}
#callConfirmedNudge.is-done::before{
  content:'';position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;
  background:var(--nudge-done);opacity:.6
}

/* ── Icon chip carries the state colour ───────────────────────────────── */
#goalsBanner.is-due .nudge-strip-icon,#callNudge.is-due .nudge-strip-icon,
#checkinNudge.is-due .nudge-strip-icon,#photoNudge.is-due .nudge-strip-icon{
  width:28px;height:28px;flex:0 0 28px;border-radius:999px;
  display:flex;align-items:center;justify-content:center;opacity:1;
  background:var(--nudge-due-soft);border:1px solid var(--nudge-due-line);box-shadow:none
}
#goalsBanner.is-due .nudge-strip-icon .icon,#callNudge.is-due .nudge-strip-icon .icon,
#checkinNudge.is-due .nudge-strip-icon .icon,#photoNudge.is-due .nudge-strip-icon .icon{
  width:15px;height:15px;color:var(--nudge-due)
}
#callConfirmedNudge.is-done .nudge-strip-icon{
  width:28px;height:28px;flex:0 0 28px;border-radius:999px;
  display:flex;align-items:center;justify-content:center;opacity:1;
  background:var(--nudge-done-soft);border:1px solid var(--nudge-done-line);box-shadow:none
}
#callConfirmedNudge.is-done .nudge-strip-icon .icon{width:14px;height:14px;color:var(--nudge-done)}

/* ── Type ─────────────────────────────────────────────────────────────── */
#callConfirmedNudge.is-done .nudge-strip-title{opacity:.78}
#callConfirmedNudge.is-done .nudge-strip-sub{color:var(--nudge-done);opacity:.9}
.outdoor-mode #callConfirmedNudge.is-done .nudge-strip-sub{color:var(--nudge-done)!important}

/* ── Live dot — one slow breath, never a blink ────────────────────────── */
#goalsBanner.is-due .nudge-strip-arr::before,#callNudge.is-due .nudge-strip-arr::before,
#checkinNudge.is-due .nudge-strip-arr::before,#photoNudge.is-due .nudge-strip-arr::before{
  content:'';display:inline-block;width:6px;height:6px;margin-right:9px;
  border-radius:50%;background:var(--nudge-due);vertical-align:middle;
  animation:nudgeDotPulse 2.8s ease-out infinite
}
#goalsBanner.is-due .nudge-strip-arr .icon,#callNudge.is-due .nudge-strip-arr .icon,
#checkinNudge.is-due .nudge-strip-arr .icon,#photoNudge.is-due .nudge-strip-arr .icon{
  color:var(--nudge-due);opacity:.75
}
@keyframes nudgeDotPulse{
  0%{box-shadow:0 0 0 0 rgba(245,158,11,.58)}
  70%{box-shadow:0 0 0 7px rgba(245,158,11,0)}
  100%{box-shadow:0 0 0 0 rgba(245,158,11,0)}
}
@keyframes nudgeGlow{
  0%,100%{box-shadow:0 0 0 1px rgba(245,158,11,.06),0 16px 34px -22px rgba(245,158,11,.30)}
  50%{box-shadow:0 0 0 1px rgba(245,158,11,.16),0 22px 46px -18px rgba(245,158,11,.48)}
}
@keyframes nudgeGlowLight{
  0%,100%{box-shadow:0 0 0 1px rgba(217,119,6,.10),0 12px 28px -17px rgba(217,119,6,.38)}
  50%{box-shadow:0 0 0 2px rgba(217,119,6,.20),0 17px 36px -13px rgba(217,119,6,.55)}
}

/* ── Mobile: rows share one card, so the card carries the glow ────────── */
@media(max-width:760px){
  .week-card.has-due{
    border-color:var(--nudge-due-line);
    animation:nudgeGlow 5.5s ease-in-out infinite
  }
  .outdoor-mode .week-card.has-due{
    border-color:var(--nudge-due-line);animation:nudgeGlowLight 5.5s ease-in-out infinite
  }
  .week-card>.nudge-strip.is-due,.week-card>.nudge-strip.is-done{padding-left:14px}
  .week-card>#goalsBanner.is-due .nudge-strip-icon,.week-card>#callNudge.is-due .nudge-strip-icon,
  .week-card>#checkinNudge.is-due .nudge-strip-icon,.week-card>#photoNudge.is-due .nudge-strip-icon,
  .week-card>#callConfirmedNudge.is-done .nudge-strip-icon{width:24px;height:24px;flex:0 0 24px}
  .week-card>#goalsBanner.is-due .nudge-strip-icon .icon,.week-card>#callNudge.is-due .nudge-strip-icon .icon,
  .week-card>#checkinNudge.is-due .nudge-strip-icon .icon,.week-card>#photoNudge.is-due .nudge-strip-icon .icon{
    width:13px;height:13px
  }
  .week-card>#callConfirmedNudge.is-done .nudge-strip-icon .icon{width:12px;height:12px}
  /* Subs stay hidden on mobile except where they carry a real time: a
     confirmed booking, or a call already booked for a later week. */
  .week-card>.nudge-strip.is-done .nudge-strip-sub,
  .week-card>.nudge-strip.show-sub .nudge-strip-sub{display:block;font-size:10px;margin-top:1px}
  .week-card>#callConfirmedNudge.is-done .nudge-strip-inner{min-height:42px}
}

/* ── Desktop / tablet: each nudge is its own card and glows for itself ── */
@media(min-width:761px){
  .top-shell-priority>.nudge-strip.is-due{
    border-color:var(--nudge-due-line);
    animation:nudgeGlow 5.5s ease-in-out infinite
  }
  .top-shell-priority>.nudge-strip.is-done{border-color:var(--nudge-done-line)}
  .outdoor-mode .top-shell-priority>.nudge-strip.is-due{
    border-color:var(--nudge-due-line)!important;animation:nudgeGlowLight 5.5s ease-in-out infinite
  }
}

/* Reduced motion: keep the colour, drop the movement. */
@media(prefers-reduced-motion:reduce){
  .week-card.has-due,
  .top-shell-priority>.nudge-strip.is-due,
  #goalsBanner.is-due .nudge-strip-arr::before,#callNudge.is-due .nudge-strip-arr::before,
  #checkinNudge.is-due .nudge-strip-arr::before,#photoNudge.is-due .nudge-strip-arr::before{animation:none}
}

/* ── Completed rows leave, they don't linger ──────────────────────────────
   The progress-photo and check-in rows have nothing useful to say once done,
   so they collapse out instead of switching to a completed state. Only the
   booking row keeps a done state, because it carries the time. */
.nudge-strip.is-clearing{
  overflow:hidden;pointer-events:none;
  opacity:0;transform:translateX(-4px);
  padding-top:0!important;padding-bottom:0!important;
  transition:height .28s cubic-bezier(.4,0,.2,1),opacity .18s ease,transform .28s ease,
             padding .28s cubic-bezier(.4,0,.2,1)
}
.nudge-strip.is-clearing::before{opacity:0}
/* An all-clear week leaves no empty bordered sliver behind. */
.top-shell-priority:not(.has-rows){display:none}
@media(prefers-reduced-motion:reduce){.nudge-strip.is-clearing{transition:none}}
