:root {
  color-scheme: dark;
  --bg:#070b11; --bg-rgb:7,11,17; --nav-rgb:8,13,20;
  --panel:#0c131d; --panel-2:#111b27; --panel-3:#0e1722; --deep-bg:#05080d;
  --input-bg:#101925; --sheet-bg:#09111a; --confirm-bg:#0e1620; --workout-bg:#05080d;
  --notice-bg:#101a25; --track-bg:#1b2734; --pill-bg:#152130; --pill-text:#cbd7e5;
  --text:#f5f8fc; --text-soft:#d8e1eb; --muted:#8392a4; --line:#1f2d3c; --line-strong:#2d4053;
  --accent:#2f80ff; --accent-rgb:47,128,255; --accent-2:#12c6db; --accent-2-rgb:18,198,219; --accent-contrast:#f8fbff;
  --danger:#ff626c; --success:#31d07f; --danger-rgb:255,98,108; --warning:#f4c95d;
  --radius:20px; --shadow:0 22px 70px rgba(0,0,0,.28);
  --calisthenics:#1fc7d4; --strength:#347dff; --cardio:#52d996; --hybrid:#9b78ff;
}

html[data-theme="graphite-lime"] {
  --bg:#0b0e11; --bg-rgb:11,14,17; --nav-rgb:15,19,23;
  --panel:#11161b; --panel-2:#171d23; --panel-3:#10161b; --deep-bg:#0a0f13;
  --input-bg:#121920; --sheet-bg:#0f1419; --confirm-bg:#11171c; --workout-bg:#090c0f;
  --notice-bg:#131a20; --track-bg:#1c242b; --pill-bg:#182028; --pill-text:#bac5ce;
  --text:#f3f6f8; --text-soft:#cfd8df; --muted:#8e9aa6; --line:#26313b; --line-strong:#35424e;
  --accent:#8df0a9; --accent-rgb:141,240,169; --accent-2:#6fd9ff; --accent-2-rgb:111,217,255; --accent-contrast:#08110b;
  --danger:#ff7474; --danger-rgb:255,116,116; --warning:#ffd37a;
}

html[data-theme="navy-ice"] {
  --bg:#07111a; --bg-rgb:7,17,26; --nav-rgb:9,21,32;
  --panel:#0d1823; --panel-2:#142333; --panel-3:#101d29; --deep-bg:#060d14;
  --input-bg:#10202d; --sheet-bg:#0b1620; --confirm-bg:#0e1a25; --workout-bg:#050c13;
  --notice-bg:#10202d; --track-bg:#1b3142; --pill-bg:#14293a; --pill-text:#c8d9e6;
  --text:#f2f7fb; --text-soft:#d5e1ea; --muted:#8fa3b5; --line:#253d50; --line-strong:#31516a;
  --accent:#61d7ff; --accent-rgb:97,215,255; --accent-2:#7d9dff; --accent-2-rgb:125,157,255; --accent-contrast:#041117;
  --danger:#ff7882; --danger-rgb:255,120,130; --warning:#ffd276;
}

html[data-theme="slate-crimson"] {
  --bg:#0d0d11; --bg-rgb:13,13,17; --nav-rgb:18,17,22;
  --panel:#15151a; --panel-2:#1e1e25; --panel-3:#19191f; --deep-bg:#09090c;
  --input-bg:#1b1b22; --sheet-bg:#121217; --confirm-bg:#17171c; --workout-bg:#09090c;
  --notice-bg:#1b1b21; --track-bg:#2a272d; --pill-bg:#252229; --pill-text:#d9cfd4;
  --text:#f6f3f4; --text-soft:#ddd5d8; --muted:#9e9398; --line:#36323a; --line-strong:#48414b;
  --accent:#ef5f72; --accent-rgb:239,95,114; --accent-2:#ff9b61; --accent-2-rgb:255,155,97; --accent-contrast:#170508;
  --danger:#ff727a; --danger-rgb:255,114,122; --warning:#ffc86e;
}

html[data-theme="obsidian-mono"] {
  --bg:#08090a; --bg-rgb:8,9,10; --nav-rgb:13,14,16;
  --panel:#101113; --panel-2:#18191c; --panel-3:#141517; --deep-bg:#050607;
  --input-bg:#15171a; --sheet-bg:#0d0e10; --confirm-bg:#121315; --workout-bg:#050607;
  --notice-bg:#17181b; --track-bg:#25272b; --pill-bg:#1c1e21; --pill-text:#d5d7db;
  --text:#f7f7f8; --text-soft:#d9dadd; --muted:#96999e; --line:#303338; --line-strong:#44484f;
  --accent:#f0f2f5; --accent-rgb:240,242,245; --accent-2:#9ea5ae; --accent-2-rgb:158,165,174; --accent-contrast:#08090a;
  --danger:#ff7b82; --danger-rgb:255,123,130; --warning:#d7bd78;
}

html[data-theme="midnight-ember"] { /* default values live in :root */ }
* { box-sizing: border-box; }
html, body { margin:0; min-height:100%; background:var(--bg); color:var(--text); font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif; }
body { min-height:100dvh; }
button, input, select { font: inherit; }
button { cursor:pointer; }
button:disabled { opacity:.45; cursor:not-allowed; }
.app-shell { width:min(760px,100%); min-height:100dvh; margin:0 auto; position:relative; padding-bottom:calc(78px + env(safe-area-inset-bottom)); }
.topbar { position:sticky; top:0; z-index:20; display:flex; justify-content:space-between; align-items:center; padding:calc(14px + env(safe-area-inset-top)) 18px 12px; background:linear-gradient(to bottom, rgba(var(--bg-rgb),.98), rgba(var(--bg-rgb),.88), rgba(var(--bg-rgb),0)); backdrop-filter: blur(8px); }
.brand-row { display:flex; align-items:center; gap:12px; }
.brand-mark { display:grid; place-items:center; width:42px; height:42px; border-radius:13px; background:var(--accent); color:var(--accent-contrast); font-weight:900; letter-spacing:-.03em; }
h1,h2,h3,p { margin:0; }
h1 { font-size:20px; letter-spacing:-.02em; }
h2 { font-size:28px; letter-spacing:-.03em; }
h3 { font-size:17px; }
.subtle { color:var(--muted); font-size:13px; line-height:1.4; }
.eyebrow { color:var(--accent); font-size:11px; letter-spacing:.12em; text-transform:uppercase; font-weight:800; margin-bottom:4px; }
.main-content { padding:8px 16px 26px; }
.view { display:none; }
.view.active { display:block; }
.bottom-nav { position:fixed; bottom:0; left:50%; transform:translateX(-50%); width:min(760px,100%); z-index:30; display:grid; grid-template-columns:repeat(5,1fr); padding:8px 8px calc(8px + env(safe-area-inset-bottom)); background:rgba(var(--nav-rgb),.94); backdrop-filter: blur(16px); border-top:1px solid var(--line); }
.nav-btn { border:0; background:transparent; color:var(--muted); padding:7px 4px 4px; border-radius:12px; display:grid; place-items:center; gap:2px; }
.nav-btn svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.nav-btn small { font-size:10px; }
.nav-btn.active { color:var(--accent); background:rgba(var(--accent-rgb),.08); }
.card { background:linear-gradient(145deg,var(--panel),var(--panel-3)); border:1px solid var(--line); border-radius:var(--radius); padding:16px; box-shadow:var(--shadow); }
.hero { padding:20px; margin-bottom:14px; background:radial-gradient(circle at 88% 5%, rgba(var(--accent-2-rgb),.16), transparent 32%), radial-gradient(circle at 10% 100%, rgba(var(--accent-rgb),.14), transparent 34%), var(--panel); }
.hero h2 { max-width:440px; margin:8px 0 8px; font-size:30px; }
.hero-actions { display:flex; gap:10px; margin-top:18px; flex-wrap:wrap; }
.primary,.secondary,.ghost,.danger { border-radius:13px; min-height:46px; padding:0 16px; font-weight:750; border:1px solid transparent; }
.primary { background:var(--accent); color:var(--accent-contrast); }
.secondary { background:var(--panel-2); color:var(--text); border-color:var(--line); }
.ghost { background:transparent; color:var(--text); border-color:var(--line); }
.danger { background:rgba(var(--danger-rgb),.14); color:var(--danger); border-color:rgba(var(--danger-rgb),.35); }
.small { min-height:36px; padding:0 11px; font-size:13px; }
.icon-btn { width:38px; height:38px; border-radius:11px; border:1px solid var(--line); background:var(--panel-2); color:var(--text); font-size:24px; }
.section { margin-top:20px; }
.section-title-row { display:flex; justify-content:space-between; align-items:flex-end; gap:12px; margin:18px 2px 10px; }
.section-title-row h2,.section-title-row h3 { margin-bottom:3px; }
.stats-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.stat { background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:14px; }
.stat strong { display:block; font-size:24px; letter-spacing:-.03em; margin-bottom:2px; }
.stat span { color:var(--muted); font-size:12px; }
.routine-list,.history-list { display:grid; gap:10px; }
.routine-card { display:grid; grid-template-columns:1fr auto; gap:12px; align-items:center; background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:14px; }
.routine-card h3 { margin-bottom:5px; }
.routine-meta { display:flex; gap:8px; flex-wrap:wrap; color:var(--muted); font-size:12px; }
.pill { display:inline-flex; align-items:center; gap:4px; padding:5px 8px; border-radius:999px; background:var(--pill-bg); color:var(--pill-text); font-size:11px; border:1px solid var(--line); }
.routine-actions { display:flex; gap:6px; }
.kebab { border:1px solid var(--line); background:var(--panel-2); color:var(--text); border-radius:10px; width:40px; height:40px; }
.empty { border:1px dashed var(--line-strong); border-radius:16px; padding:26px 18px; color:var(--muted); text-align:center; }
.chart-card { margin-top:10px; }
.last-workout-card { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.last-workout-card h3 { margin:3px 0 5px; }
.last-workout-metrics { display:flex; gap:14px; text-align:right; color:var(--muted); font-size:11px; }
.last-workout-metrics span { display:grid; gap:2px; }
.last-workout-metrics strong { color:var(--text); font-size:16px; }
.progress-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; text-align:center; }
.progress-summary div { display:grid; gap:3px; padding:4px; }
.progress-summary strong { font-size:20px; }
.progress-summary span { color:var(--muted); font-size:11px; }
.chart-wrap { height:190px; margin-top:14px; display:flex; align-items:flex-end; gap:8px; padding:8px 4px 0; border-bottom:1px solid var(--line); }
.bar-col { flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; gap:6px; }
.bar { width:100%; max-width:38px; min-height:3px; border-radius:7px 7px 2px 2px; background:linear-gradient(to top,var(--accent),var(--accent-2)); }
.bar-label { color:var(--muted); font-size:10px; }
.bar-value { color:var(--text-soft); font-size:9px; min-height:12px; }
.history-row { background:var(--panel); border:1px solid var(--line); border-radius:15px; padding:14px; display:grid; grid-template-columns:1fr auto; gap:10px; }
.history-row strong { display:block; margin-bottom:5px; }
.status-complete { color:var(--accent); }
.status-partial { color:var(--warning); }
.settings-group { display:grid; gap:10px; margin-top:12px; }
.voice-card { display:grid; gap:12px; }
.voice-card select { width:100%; min-height:44px; border-radius:11px; border:1px solid var(--line-strong); background:var(--input-bg); color:var(--text); padding:8px 11px; }
.voice-controls { display:grid; grid-template-columns:1fr auto; gap:12px; align-items:end; }
.voice-controls input[type="range"] { width:100%; accent-color:var(--accent); }
.voice-controls button { min-height:44px; white-space:nowrap; }
.setting-row { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px; background:var(--panel); border:1px solid var(--line); border-radius:15px; }
.setting-row input[type="checkbox"] { width:22px; height:22px; accent-color:var(--accent); }
.sheet-dialog,.confirm-dialog { width:min(720px, calc(100% - 18px)); border:0; padding:0; background:transparent; color:var(--text); margin-top:max(9px, env(safe-area-inset-top)); margin-bottom:max(9px, env(safe-area-inset-bottom)); }
.sheet-dialog::backdrop,.confirm-dialog::backdrop { background:rgba(0,0,0,.72); backdrop-filter:blur(4px); }
.sheet-card { max-height:88dvh; overflow:auto; background:var(--sheet-bg); border:1px solid var(--line); border-radius:22px; padding:18px; box-shadow:var(--shadow); }
.sheet-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:16px; }
.field { display:grid; gap:6px; color:var(--text-soft); font-size:12px; }
.field input,.field select { width:100%; min-height:44px; border-radius:11px; border:1px solid var(--line-strong); background:var(--input-bg); color:var(--text); padding:8px 11px; outline:none; }
.field input:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(var(--accent-rgb),.1); }
.form-grid { display:grid; gap:10px; margin-top:12px; }
.form-grid.cols-3 { grid-template-columns:repeat(3,1fr); }
.exercise-editor-list { display:grid; gap:10px; }
.exercise-editor { border:1px solid var(--line); border-radius:15px; padding:12px; background:var(--panel); }
.exercise-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.exercise-number { font-size:12px; color:var(--accent); font-weight:800; }
.exercise-grid { display:grid; grid-template-columns:1.6fr .7fr .7fr; gap:8px; }
.remove-ex { width:32px; height:32px; border-radius:9px; border:1px solid rgba(var(--danger-rgb),.3); background:rgba(var(--danger-rgb),.08); color:var(--danger); }
.routine-summary { margin-top:12px; padding:12px; border-radius:13px; background:var(--input-bg); border:1px solid var(--line); color:var(--text-soft); font-size:13px; }
.sheet-actions { position:sticky; bottom:-18px; padding:12px 0 2px; background:linear-gradient(to top,var(--sheet-bg) 70%, transparent); }
.sheet-actions .primary { width:100%; }
.confirm-dialog { max-width:420px; }
.confirm-card { background:var(--confirm-bg); border:1px solid var(--line); border-radius:20px; padding:18px; }
.confirm-card p { color:var(--muted); margin:8px 0 16px; line-height:1.45; }
.confirm-actions { display:flex; justify-content:flex-end; gap:8px; }
.hidden { display:none !important; }
.workout-view { margin:-8px -16px -26px; min-height:100dvh; }
/* Active workouts are a true viewport-owned surface. This prevents a Quick
   Start launched from a scrolled Home page from inheriting that scroll offset
   and opening underneath the iPhone status bar / Dynamic Island. */
body.workout-mode { overflow:hidden; }
.workout-view.active { position:fixed; inset:0; z-index:40; margin:0; min-height:100dvh; overflow-y:auto; overscroll-behavior-y:contain; -webkit-overflow-scrolling:touch; background:var(--workout-bg); }
.workout-shell { min-height:100dvh; padding:calc(18px + env(safe-area-inset-top)) calc(18px + env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) calc(18px + env(safe-area-inset-left)); display:flex; flex-direction:column; background:radial-gradient(circle at 50% 30%, rgba(var(--accent-rgb),.12), transparent 35%), var(--workout-bg); }
.workout-top { display:flex; justify-content:flex-start; gap:12px; align-items:center; min-height:54px; }
.workout-top .meta { color:var(--muted); font-size:13px; }
.workout-active-label { color:var(--accent); font-size:10px; letter-spacing:.13em; font-weight:900; margin-bottom:4px; }
.workout-center { flex:1; display:grid; place-items:center; text-align:center; padding:28px 0; }
.phase-label { text-transform:uppercase; letter-spacing:.14em; font-size:12px; font-weight:900; color:var(--accent); }
.phase-label.rest { color:var(--accent-2); }
.exercise-name { font-size:clamp(30px,9vw,56px); margin:10px 0 4px; letter-spacing:-.045em; line-height:1; }
.timer-digits { font-variant-numeric:tabular-nums; font-size:clamp(84px,27vw,160px); line-height:.9; letter-spacing:-.07em; font-weight:900; margin:22px 0 12px; }
.next-up { color:var(--muted); font-size:14px; }
.progress-track { width:100%; height:10px; border-radius:99px; overflow:hidden; background:var(--track-bg); margin:14px 0 8px; }
.progress-fill { height:100%; background:linear-gradient(to right,var(--accent),var(--accent-2)); }
.workout-controls { display:grid; grid-template-columns:1fr 1.4fr 1fr; gap:8px; }
.workout-controls button { min-height:58px; }
.pause-btn { font-size:17px; }
.workout-end-btn { width:100%; min-height:56px; margin-top:10px; border-radius:13px; border:1px solid rgba(var(--danger-rgb),.48); background:linear-gradient(180deg, rgba(var(--danger-rgb),.17), rgba(var(--danger-rgb),.10)); color:var(--danger); font-weight:850; font-size:16px; letter-spacing:.01em; }
.workout-end-btn:active { background:rgba(var(--danger-rgb),.26); transform:translateY(1px); }
.workout-secondary { display:flex; justify-content:center; gap:8px; margin-top:10px; }
.paused-badge { display:inline-block; margin-top:10px; padding:6px 10px; border-radius:999px; color:#15100a; background:var(--warning); font-size:11px; font-weight:900; letter-spacing:.08em; }
.toast { position:fixed; left:50%; bottom:calc(92px + env(safe-area-inset-bottom)); transform:translateX(-50%); z-index:100; background:#effff2; color:#0b1710; border-radius:12px; padding:10px 14px; font-weight:700; box-shadow:var(--shadow); animation:toastin .18s ease-out; }
@keyframes toastin { from { opacity:0; transform:translate(-50%,8px);} }
.install-note { margin-top:12px; padding:12px; border-radius:14px; background:var(--notice-bg); border:1px solid var(--line); color:var(--text-soft); font-size:13px; line-height:1.5; }
.data-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.cue-volume-card { display:grid; gap:12px; }
.cue-volume-head { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }
.cue-volume-head > div { min-width:0; }
.volume-value { flex:0 0 auto; min-width:52px; text-align:center; padding:6px 8px; border-radius:999px; background:var(--pill-bg); border:1px solid var(--line); color:var(--accent); font-weight:850; font-variant-numeric:tabular-nums; }
.cue-volume-controls { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:center; }
.cue-volume-controls input[type="range"] { width:100%; accent-color:var(--accent); min-height:44px; }
@media (max-width:560px) {
  .voice-controls { grid-template-columns:1fr; }
  .cue-volume-controls { grid-template-columns:1fr; }
  .cue-volume-controls .secondary { width:100%; }
  .form-grid.cols-3 { grid-template-columns:1fr 1fr; }
  .exercise-grid { grid-template-columns:1fr 1fr; }
  .exercise-grid .field:first-child { grid-column:1/-1; }
  .routine-actions { flex-direction:column; }
  .hero h2 { font-size:27px; }
  .last-workout-card { align-items:flex-start; }
  .last-workout-metrics { flex-direction:column; gap:6px; }
}
@media (display-mode: standalone) {
  #installBtn { display:none !important; }
}


/* v1.5 cross-browser + tab separation */
.setup-strip { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.comparison-card { display:grid; gap:14px; }
.comparison-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.comparison-metric { background:var(--input-bg); border:1px solid var(--line); border-radius:14px; padding:14px; display:grid; gap:5px; }
.comparison-metric > span { color:var(--muted); font-size:12px; }
.comparison-metric strong { font-size:24px; }
.comparison-metric small { color:var(--muted); }
.delta.up { color:var(--success); }
.delta.down { color:var(--danger); }
.delta.flat { color:var(--muted); }
.insight-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.insight-grid > div { display:grid; gap:5px; padding:13px; border-radius:14px; background:var(--input-bg); border:1px solid var(--line); }
.insight-label { color:var(--muted); font-size:11px; }
.insight-grid strong { font-size:18px; overflow-wrap:anywhere; }
.chart-14 { gap:4px; overflow:hidden; }
.chart-14 .bar { max-width:26px; }
.chart-14 .bar-label { min-height:24px; text-align:center; }
.health-status-card { display:grid; grid-template-columns:auto 1fr auto; align-items:start; gap:14px; }
.health-icon { width:48px; height:48px; border-radius:15px; display:grid; place-items:center; font-size:24px; background:rgba(var(--danger-rgb),.12); color:#ff8e8e; border:1px solid rgba(var(--danger-rgb),.26); }
.status-chip { display:inline-flex; align-items:center; justify-content:center; width:max-content; padding:5px 8px; border-radius:999px; font-size:10px; font-weight:800; border:1px solid var(--line); background:var(--pill-bg); color:var(--text-soft); }
.status-chip.ready { color:var(--accent); border-color:rgba(var(--accent-rgb),.3); background:rgba(var(--accent-rgb),.08); }
.status-chip.pending { color:var(--warning); border-color:rgba(255,211,122,.3); background:rgba(255,211,122,.08); }
.status-chip.unavailable { color:var(--danger); border-color:rgba(var(--danger-rgb),.3); background:rgba(var(--danger-rgb),.08); }
.health-data-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.health-data-card { border:1px solid var(--line); background:var(--panel); border-radius:15px; padding:14px; display:grid; gap:4px; }
.health-data-card span { color:var(--muted); font-size:11px; }
.health-data-card strong { font-size:20px; }
.health-data-card small { color:var(--muted); }
.health-plan-list { display:grid; gap:0; padding-top:6px; padding-bottom:6px; }
.health-plan-list > div { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:12px 2px; border-bottom:1px solid var(--line); }
.health-plan-list > div:last-child { border-bottom:0; }
.voice-button-stack { display:grid; gap:6px; }
.voice-status-row { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.feature-unavailable { opacity:.72; }
.compatibility-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }
.support-item { border:1px solid var(--line); border-radius:13px; padding:11px; background:var(--input-bg); display:grid; gap:3px; }
.support-item > span { color:var(--muted); font-size:11px; }
.support-item small { color:var(--muted); }
@media (max-width:560px) {
  .comparison-grid, .health-data-grid, .compatibility-grid { grid-template-columns:1fr 1fr; }
  .health-status-card { grid-template-columns:auto 1fr; }
  .health-status-card > .status-chip { grid-column:2; }
  .bottom-nav .nav-btn svg { width:19px; height:19px; }
  .bottom-nav .nav-btn small { font-size:9px; }
}


/* v1.12 home dashboard */
.home-feature { position:relative; overflow:hidden; padding:22px; margin-bottom:14px; background:linear-gradient(150deg,var(--panel-3) 0%,var(--panel-3) 62%,var(--sheet-bg) 100%); }
.home-feature-glow { position:absolute; width:300px; height:300px; right:-130px; top:-150px; border-radius:50%; background:radial-gradient(circle,rgba(var(--accent-rgb),.22),rgba(var(--accent-2-rgb),.08) 46%,transparent 72%); pointer-events:none; }
.home-feature-head { position:relative; display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }
.home-feature-head h2 { font-size:32px; line-height:1.03; margin-top:5px; max-width:470px; }
.home-duration-badge { position:relative; flex:0 0 auto; padding:8px 11px; border-radius:999px; background:rgba(var(--accent-rgb),.10); border:1px solid rgba(var(--accent-rgb),.28); color:var(--accent); font-size:12px; font-weight:850; }
.home-feature-stats { position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:18px 0 14px; }
.home-feature-stats > div { background:rgba(9,14,17,.48); border:1px solid rgba(82,102,116,.32); border-radius:14px; padding:12px; display:grid; gap:2px; }
.home-feature-stats strong { font-size:20px; letter-spacing:-.03em; }
.home-feature-stats span { color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.07em; font-weight:750; }
.home-exercise-preview { position:relative; display:grid; gap:0; border:1px solid rgba(82,102,116,.32); border-radius:15px; overflow:hidden; background:rgba(8,12,15,.36); }
.home-exercise-row { display:grid; grid-template-columns:30px 1fr auto; align-items:center; gap:8px; min-height:42px; padding:7px 12px; border-bottom:1px solid rgba(82,102,116,.25); }
.home-exercise-row:last-child { border-bottom:0; }
.home-exercise-number { width:24px; height:24px; display:grid; place-items:center; border-radius:8px; background:rgba(var(--accent-rgb),.10); color:var(--accent); font-size:10px; font-weight:900; }
.home-exercise-name { font-size:13px; font-weight:700; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.home-exercise-time { color:var(--text-soft); font-size:12px; font-variant-numeric:tabular-nums; }
.home-more-exercises { padding:9px 12px; color:var(--muted); font-size:11px; text-align:center; }
.home-session-balance { position:relative; margin-top:14px; display:grid; gap:7px; }
.home-balance-labels { display:flex; justify-content:space-between; gap:12px; color:var(--muted); font-size:10px; }
.home-balance-track { height:7px; background:var(--panel-2); border-radius:999px; overflow:hidden; }
.home-balance-track span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--accent),var(--accent-2)); }
.home-session-balance p { color:var(--muted); font-size:11px; }
.home-session-balance p strong { color:var(--text-soft); }
.home-main-start { position:relative; width:100%; margin-top:16px; min-height:54px; font-size:16px; }
.home-action-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin:10px 0 6px; }
.home-action-card { min-height:74px; border-radius:16px; border:1px solid var(--line); background:linear-gradient(145deg,var(--panel),var(--panel-3)); color:var(--text); padding:13px; display:grid; grid-template-columns:auto 1fr; align-items:center; gap:11px; text-align:left; }
.home-action-card:active { transform:scale(.985); }
.home-action-icon { width:38px; height:38px; display:grid; place-items:center; border-radius:12px; background:rgba(var(--accent-2-rgb),.08); border:1px solid rgba(var(--accent-2-rgb),.16); color:var(--accent-2); font-size:20px; }
.home-action-card > span:last-child { display:grid; gap:3px; min-width:0; }
.home-action-card strong { font-size:14px; }
.home-action-card small { color:var(--muted); font-size:10px; line-height:1.3; }
.home-other-heading { margin-top:20px; }
.home-feature-empty { min-height:300px; display:flex; flex-direction:column; justify-content:center; }
.home-feature-empty h2 { font-size:32px; margin:6px 0 9px; }
.home-feature-empty .subtle { max-width:520px; }
@media (max-width:560px) {
  .home-feature { padding:18px; }
  .home-feature-head h2, .home-feature-empty h2 { font-size:28px; }
  .home-feature-stats > div { padding:10px; }
  .home-feature-stats strong { font-size:18px; }
  .home-balance-labels { align-items:flex-start; }
}


/* v1.14 home + voice controls */
.home-quick-card { display:grid; gap:14px; }
.home-quick-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.home-quick-head h3 { margin:3px 0 3px; font-size:20px; }
.quick-timer-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
.quick-input-wrap { position:relative; }
.quick-input-wrap input { padding-right:42px; font-size:18px; font-weight:800; font-variant-numeric:tabular-nums; }
.quick-input-wrap small { position:absolute; right:12px; top:50%; transform:translateY(-50%); color:var(--muted); font-size:11px; pointer-events:none; }
.quick-preset-tools { display:flex; align-items:center; }
.save-quick-preset { min-height:38px; padding:0 12px; font-size:12px; }
.quick-preset-shelf { display:grid; gap:8px; padding-top:2px; }
.quick-preset-shelf-head { display:flex; justify-content:space-between; align-items:center; gap:10px; color:var(--muted); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.text-button { border:0; background:transparent; color:var(--muted); font:inherit; text-transform:none; letter-spacing:0; min-height:34px; padding:0 4px; cursor:pointer; }
.danger-text { color:var(--danger); }
.quick-presets { display:flex; flex-wrap:wrap; gap:8px; }
.quick-preset-chip { display:flex; align-items:stretch; overflow:hidden; border:1px solid var(--line); background:var(--panel-2); border-radius:12px; min-height:44px; }
.quick-preset-load { display:grid; align-content:center; gap:1px; border:0; background:transparent; color:var(--text-soft); padding:6px 10px 6px 12px; text-align:left; min-width:0; }
.quick-preset-load strong { font-size:12px; line-height:1.15; }
.quick-preset-load small { color:var(--muted); font-size:10px; font-variant-numeric:tabular-nums; }
.quick-preset-delete { width:38px; min-width:38px; border:0; border-left:1px solid var(--line); background:rgba(var(--danger-rgb),.08); color:var(--danger); font-size:19px; }
.quick-preset-load:active, .quick-preset-delete:active { filter:brightness(1.18); }
.quick-preset-dialog-card { width:min(430px, calc(100vw - 28px)); }
.quick-preset-dialog-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.quick-preset-dialog-head h3 { margin:2px 0 0; }
.icon-btn.compact { width:44px; min-width:44px; height:44px; }
.quick-start-row { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.quick-start-btn { min-width:190px; }
.home-last-session { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.home-last-session h3 { margin:3px 0 5px; }
.home-last-session-metrics { display:flex; gap:18px; text-align:right; }
.home-last-session-metrics span { display:grid; gap:2px; }
.home-last-session-metrics strong { font-size:17px; }
.home-last-session-metrics small { color:var(--muted); font-size:9px; text-transform:uppercase; letter-spacing:.06em; }
.voice-adjustments { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.voice-slider-field { background:rgba(9,14,17,.36); border:1px solid rgba(82,102,116,.28); border-radius:13px; padding:12px; }
.voice-slider-field input[type="range"] { width:100%; accent-color:var(--accent); }
.voice-slider-field label { display:flex; justify-content:space-between; gap:12px; font-weight:700; }
.voice-slider-field label span { color:var(--accent); font-variant-numeric:tabular-nums; }
.voice-button-row { display:flex; gap:8px; }
.voice-button-row .secondary { flex:1; }
.voice-button-row .ghost { min-height:46px; }

@media (max-width:520px) {
  .quick-timer-grid { grid-template-columns:repeat(3,1fr); gap:6px; }
  .quick-timer-grid .field span { font-size:10px; }
  .quick-input-wrap input { padding-left:9px; padding-right:30px; font-size:16px; }
  .quick-input-wrap small { right:8px; }
  .quick-start-row { align-items:stretch; flex-direction:column; }
  .quick-start-btn { width:100%; min-width:0; }
  .home-last-session { align-items:flex-start; }
  .home-last-session-metrics { gap:10px; }
  .voice-adjustments { grid-template-columns:1fr; }
  .voice-button-row { display:grid; grid-template-columns:1fr 1fr; }
}


/* v1.16 smart exercise library */
.exercise-name-field { position:relative; min-width:0; }
.exercise-name-input-wrap { display:grid; grid-template-columns:minmax(0,1fr) 44px; gap:6px; }
.exercise-name-input-wrap .ex-name { min-width:0; }
.exercise-picker-toggle { min-width:44px; min-height:44px; border-radius:11px; border:1px solid var(--line-strong); background:var(--pill-bg); color:var(--text-soft); font-size:20px; line-height:1; }
.exercise-picker-toggle:active { background:var(--line); }
.exercise-suggestions { margin-top:6px; border:1px solid var(--line-strong); border-radius:13px; background:var(--sheet-bg); overflow:hidden; box-shadow:0 14px 34px rgba(0,0,0,.34); }
.exercise-search-caption,.exercise-suggestion-title { padding:9px 11px 6px; color:var(--muted); font-size:10px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; }
.exercise-search-caption strong { color:var(--text-soft); text-transform:none; letter-spacing:0; }
.exercise-suggestion-section + .exercise-suggestion-section { border-top:1px solid rgba(255,255,255,.05); }
.exercise-suggestion-row { display:grid; grid-template-columns:minmax(0,1fr) 44px; align-items:stretch; border-top:1px solid rgba(255,255,255,.045); }
.exercise-suggestion-row:first-of-type { border-top:0; }
.exercise-suggestion-main { min-width:0; min-height:50px; text-align:left; border:0; border-radius:0; padding:8px 11px; background:transparent; color:var(--text); display:grid; gap:2px; }
.exercise-suggestion-main strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; }
.exercise-suggestion-main small { color:var(--muted); font-size:10px; }
.exercise-suggestion-main:active { background:rgba(var(--accent-rgb),.08); }
.exercise-favorite-toggle { border:0; border-left:1px solid rgba(255,255,255,.045); border-radius:0; background:transparent; color:var(--muted); font-size:20px; min-height:50px; }
.exercise-favorite-toggle.active { color:#ffd36f; }
.exercise-empty,.exercise-custom-hint,.exercise-search-tip { padding:10px 11px; color:var(--muted); font-size:11px; line-height:1.4; border-top:1px solid rgba(255,255,255,.045); }
.exercise-custom-hint strong,.exercise-search-tip strong { color:var(--text-soft); }
.exercise-search-tip { background:var(--input-bg); }
@media (max-width:560px) {
  .exercise-suggestion-main { min-height:54px; }
  .exercise-favorite-toggle { min-height:54px; }
}
/* Keep the sticky Save button from covering exercise-search results on mobile. */
.sheet-card:has(.exercise-suggestions:not(.hidden)) .sheet-actions { position:static; background:transparent; }

/* v1.17 update-safe local data */
.data-safety-card { display:grid; gap:12px; margin-bottom:10px; }
.data-safety-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.data-safety-head > div { min-width:0; }
.data-version-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.data-version-grid > div { padding:11px 12px; border-radius:13px; background:var(--input-bg); border:1px solid var(--line); display:grid; gap:3px; }
.data-version-grid span { color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.06em; font-weight:750; }
.data-version-grid strong { font-size:18px; }
.recovery-note { padding-top:2px; }
.app-build-info { margin-top:12px; text-align:center; }
@media (max-width:420px) {
  .data-safety-head { align-items:flex-start; }
  .data-version-grid { grid-template-columns:1fr 1fr; }
}


/* v1.18 in-app exercise motion guides */
.exercise-head-actions { display:flex; align-items:center; gap:7px; }
.exercise-editor-demo { min-height:34px; padding:6px 10px; color:var(--accent); border-color:rgba(var(--accent-rgb),.28); }
.exercise-suggestion-row { grid-template-columns:minmax(0,1fr) 54px 44px; }
.exercise-suggestion-demo,.exercise-suggestion-demo-spacer { min-width:54px; min-height:50px; display:grid; place-items:center; }
.exercise-suggestion-demo { border:0; border-left:1px solid rgba(255,255,255,.045); border-radius:0; background:transparent; color:var(--accent); font-size:10px; font-weight:850; letter-spacing:.02em; }
.exercise-suggestion-demo:active { background:rgba(var(--accent-rgb),.08); }
.exercise-suggestion-demo-spacer { border-left:1px solid rgba(255,255,255,.045); }
.exercise-demo-dialog { width:min(600px, calc(100% - 18px)); max-height:calc(100% - max(18px, env(safe-area-inset-top)) - max(18px, env(safe-area-inset-bottom))); border:0; padding:0; background:transparent; color:var(--text); margin-top:max(9px, env(safe-area-inset-top)); margin-bottom:max(9px, env(safe-area-inset-bottom)); }
.exercise-demo-dialog::backdrop { background:rgba(0,0,0,.76); backdrop-filter:blur(5px); }
.exercise-demo-card { background:var(--panel-3); border:1px solid var(--line-strong); border-radius:20px; padding:18px; max-height:inherit; overflow:auto; box-shadow:0 22px 65px rgba(0,0,0,.48); }
.exercise-demo-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }
.exercise-demo-head h3 { margin:2px 0 4px; font-size:24px; letter-spacing:-.025em; }
.exercise-demo-visual { margin:15px 0; min-height:210px; display:grid; place-items:center; border:1px solid rgba(var(--accent-rgb),.16); border-radius:17px; overflow:hidden; background:radial-gradient(circle at 50% 45%, rgba(var(--accent-rgb),.08), transparent 48%), var(--deep-bg); }
.exercise-demo-svg { width:100%; height:auto; max-height:250px; color:var(--text); }
.demo-body-line { stroke:currentColor; stroke-width:8; stroke-linecap:round; stroke-linejoin:round; opacity:.96; }
.demo-joint { fill:var(--accent); opacity:.9; }
.demo-head { fill:var(--text-soft); stroke:var(--accent); stroke-width:2.5; }
.demo-prop { stroke:var(--muted); stroke-width:5; stroke-linecap:round; fill:none; }
.demo-prop.ground { stroke:var(--line); stroke-width:3; }
.demo-prop.bar,.demo-prop.bar-vertical { stroke:var(--muted); stroke-width:7; }
.demo-prop.wall { stroke:var(--muted); stroke-width:7; }
.demo-prop.bench,.demo-prop.box { fill:var(--line); stroke:var(--muted); stroke-width:3; }
.exercise-demo-copy { display:grid; grid-template-columns:1.2fr .8fr; gap:12px; }
.exercise-demo-copy > div { border:1px solid rgba(255,255,255,.065); border-radius:14px; background:rgba(255,255,255,.025); padding:12px 13px; }
.exercise-demo-label { margin:0 0 7px; font-size:10px; font-weight:900; letter-spacing:.09em; text-transform:uppercase; color:var(--accent); }
.exercise-demo-copy ul { margin:0; padding-left:19px; display:grid; gap:6px; color:var(--text-soft); font-size:13px; line-height:1.4; }
.exercise-demo-avoid p:last-child { margin:0; color:var(--text-soft); font-size:12px; line-height:1.45; }
.exercise-demo-note { color:var(--muted); font-size:10px; line-height:1.45; margin:12px 2px 0; }
.exercise-demo-note:empty { display:none; }
.exercise-demo-done { width:100%; min-height:48px; margin-top:13px; }
.workout-demo-btn { min-height:43px; margin:13px auto 2px; padding:9px 15px; border-radius:999px; border:1px solid rgba(var(--accent-rgb),.36); background:rgba(var(--accent-rgb),.09); color:var(--accent); font-weight:850; font-size:12px; }
.workout-demo-btn:active { background:rgba(var(--accent-rgb),.17); }
.data-version-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
@media (max-width:520px) {
  .exercise-demo-card { padding:15px; }
  .exercise-demo-visual { min-height:185px; }
  .exercise-demo-copy { grid-template-columns:1fr; }
  .exercise-suggestion-demo,.exercise-suggestion-demo-spacer { min-height:54px; }
  .data-version-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}


/* v1.19 anatomical demo + profile setup */
.profile-setup-card { width:min(440px, calc(100% - 22px)); }
.profile-card { display:grid; gap:12px; }
.profile-card-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.profile-actions-row { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.anatomy-demo-shell { width:100%; display:grid; gap:12px; }
.anatomy-demo-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; padding:0 2px; }
.anatomy-demo-muscles { display:flex; flex-wrap:wrap; gap:8px; }
.anatomy-chip { padding:7px 10px; border-radius:999px; font-size:11px; font-weight:800; color:#ffd9ca; background:rgba(255,114,72,.12); border:1px solid rgba(255,114,72,.2); }
.anatomy-demo-caption { margin:0; color:var(--text-soft); line-height:1.45; font-size:13px; }
.anatomy-view-pill { background:rgba(var(--accent-rgb),.08); color:var(--accent); border-color:rgba(var(--accent-rgb),.2); }
.anatomy-demo-svg { max-height:300px; }
@media (max-width:640px) {
  .anatomy-demo-toolbar { align-items:flex-start; }
}


/* v1.20 rendered animation */
.rendered-demo-stage { position:relative; border:1px solid rgba(var(--accent-rgb),.18); background:var(--deep-bg); border-radius:18px; overflow:hidden; min-height:240px; display:grid; place-items:center; }
.rendered-exercise-animation { width:100%; max-height:420px; object-fit:contain; display:block; background:var(--deep-bg); }
.rendered-demo-badge { position:absolute; left:12px; top:12px; border:1px solid rgba(var(--accent-rgb),.34); background:rgba(9,17,13,.82); color:var(--accent); border-radius:999px; padding:6px 9px; font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.05em; }
.muscle-accuracy-card { border:1px solid rgba(255,255,255,.07); background:rgba(255,255,255,.025); border-radius:14px; padding:12px; }
.muscle-accuracy-card p:last-child { margin:9px 0 0; line-height:1.45; }
.movement-sequence-row { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; }
.movement-sequence-row span { min-width:0; padding:9px 8px; border:1px solid rgba(255,255,255,.07); border-radius:11px; background:rgba(255,255,255,.025); font-size:10px; color:var(--text-soft); line-height:1.25; }
.movement-sequence-row strong { display:inline-grid; place-items:center; width:20px; height:20px; margin-right:3px; border-radius:50%; background:rgba(var(--accent-rgb),.14); color:var(--accent); }
.rendered-demo-unavailable { border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:22px; background:rgba(255,255,255,.025); display:grid; gap:10px; text-align:left; }
.rendered-demo-unavailable p { margin:0; color:var(--muted); line-height:1.5; }
@media (max-width:520px) {
  .movement-sequence-row { grid-template-columns:repeat(2,1fr); }
  .rendered-demo-stage { min-height:190px; }
}


/* v1.21 universal exercise video player */
.video-demo-stage {
  width: 100%;
  max-width: 760px;
  margin: 0 auto;
  border-radius: 18px;
  overflow: hidden;
  background: var(--deep-bg);
  aspect-ratio: 16 / 9;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}
.exercise-video-frame,
.exercise-video-player {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  object-fit: contain;
  background: #000;
}
.video-demo-unavailable {
  min-height: 220px;
  display: grid;
  place-items: center;
  padding: 28px;
  text-align: center;
  color: var(--muted);
  border: 1px dashed rgba(255,255,255,.16);
  border-radius: 18px;
}
.exercise-demo-dialog .exercise-demo-card { max-width: 820px; }
.exercise-demo-visual { min-height: 0; }
@media (max-width: 520px) {
  .exercise-demo-dialog { padding: max(10px, env(safe-area-inset-top)) 10px max(10px, env(safe-area-inset-bottom)); }
  .exercise-demo-dialog .exercise-demo-card { width: min(100%, 100vw - 20px); max-height: calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
}

/* v1.22 action-only exercise clip indicator */
.video-demo-stage { position: relative; }
.motion-clip-badge {
  position: absolute;
  left: 10px;
  bottom: 10px;
  z-index: 3;
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(10, 14, 18, .78);
  border: 1px solid rgba(255,255,255,.13);
  color: var(--text-soft);
  font-size: 11px;
  line-height: 1;
  pointer-events: none;
  backdrop-filter: blur(6px);
}

/* v1.25 exercise-library access + reliable video replay */
.exercise-browse-all-inline {
  width: 100%;
  min-height: 44px;
  margin: 8px 0 4px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255,255,255,.04);
  color: var(--text);
  font-weight: 700;
}

.exercise-library-heading { margin-top: 28px; }
.standalone-exercise-library { padding: 16px; }
.exercise-library-tools {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(150px, .45fr);
  gap: 12px;
}
.exercise-library-status {
  margin: 4px 0 12px;
  color: var(--muted);
  font-size: .85rem;
}
.exercise-library-results {
  display: grid;
  gap: 8px;
  max-height: min(62vh, 720px);
  overflow: auto;
  overscroll-behavior: contain;
  padding-right: 2px;
}
.standalone-exercise-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255,255,255,.025);
}
.standalone-exercise-row strong,
.standalone-exercise-row small { display: block; }
.standalone-exercise-row small { margin-top: 3px; color: var(--muted); }
.home-exercise-row { grid-template-columns: auto minmax(0,1fr) auto auto; }
.home-exercise-demo {
  min-height: 32px;
  padding: 5px 9px;
  border-radius: 9px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.05);
  color: var(--text);
  font-size: .75rem;
  font-weight: 700;
}
.video-demo-replay {
  position: absolute;
  right: 12px;
  bottom: 12px;
  z-index: 3;
  min-height: 38px;
  padding: 7px 12px;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 10px;
  background: rgba(8,10,12,.82);
  color: var(--text);
  font-weight: 800;
  backdrop-filter: blur(8px);
}
@media (max-width: 620px) {
  .exercise-library-tools { grid-template-columns: 1fr; }
}


/* v1.26 mobile-app layout pass */
* { -webkit-tap-highlight-color: transparent; }
button, input, select { touch-action: manipulation; }

.cue-test-buttons { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.cue-test-buttons .secondary { min-height:44px; }
.cue-test-status { margin-top:2px; }

@media (max-width: 620px) {
  html, body { width:100%; overflow-x:hidden; }
  body { overscroll-behavior-y:none; }
  .app-shell { width:100%; }
  .main-content { padding:6px 12px 24px; }
  .topbar { padding:calc(12px + env(safe-area-inset-top)) 14px 10px; }
  .bottom-nav { width:100%; padding:7px 6px calc(7px + env(safe-area-inset-bottom)); }
  .nav-btn { min-height:48px; }

  .section-title-row { align-items:flex-start; flex-wrap:wrap; }
  .section-title-row > div { min-width:0; flex:1 1 220px; }

  /* A routine card should read like a mobile list card, not a desktop card
     with a vertical toolbar squeezed onto the right side. */
  .routine-card { grid-template-columns:1fr; align-items:stretch; }
  .routine-actions { flex-direction:row; width:100%; }
  .routine-actions .routine-start { flex:1 1 auto; min-height:44px; }
  .kebab { width:44px; min-width:44px; height:44px; }

  /* Keep touch targets comfortably app-sized. */
  .icon-btn, .remove-ex { width:44px; min-width:44px; height:44px; }
  .exercise-editor-demo { min-height:44px; }
  .home-exercise-demo { min-height:44px; padding:7px 10px; }
  .standalone-exercise-demo { min-height:44px; }

  /* Avoid a scroll area inside another scroll area. The page itself owns
     vertical scrolling on phones. */
  .exercise-library-results { max-height:none; overflow:visible; padding-right:0; }
  .standalone-exercise-library { padding:13px; }

  .home-exercise-row { grid-template-columns:28px minmax(0,1fr) auto auto; gap:7px; padding:8px 10px; }
  .home-exercise-time { white-space:nowrap; }

  .cue-volume-controls { grid-template-columns:1fr; }
  .cue-test-buttons { display:grid; grid-template-columns:1fr 1fr; width:100%; }
  .cue-test-buttons .secondary { width:100%; }

  /* Routine builder and video viewer behave like bottom sheets on a phone. */
  .sheet-dialog,
  .exercise-demo-dialog {
    inset:auto 0 0 0;
    width:100%;
    max-width:none;
    max-height:calc(100dvh - env(safe-area-inset-top));
    margin:0;
    padding:0;
  }
  .sheet-card,
  .exercise-demo-dialog .exercise-demo-card {
    width:100%;
    max-width:none;
    max-height:calc(92dvh - env(safe-area-inset-top));
    border-radius:24px 24px 0 0;
    border-bottom:0;
    padding-bottom:calc(18px + env(safe-area-inset-bottom));
  }
  .exercise-demo-dialog .exercise-demo-card { width:100%; }
}

@media (max-width: 390px) {
  .home-exercise-row { grid-template-columns:26px minmax(0,1fr) auto; }
  .home-exercise-demo { grid-column:2 / -1; width:100%; }
  .home-exercise-time { grid-column:3; grid-row:1; }
  .form-grid.cols-3 { grid-template-columns:1fr 1fr; }
}

/* Keep the full-screen workout usable on shorter phones without forcing
   controls below the fold. */
@media (max-width: 620px) and (max-height: 700px) {
  .workout-shell { padding-top:calc(10px + env(safe-area-inset-top)); padding-bottom:calc(12px + env(safe-area-inset-bottom)); }
  .workout-top { min-height:42px; }
  .workout-center { padding:10px 0; }
  .exercise-name { font-size:clamp(26px,8vw,42px); margin-top:7px; }
  .timer-digits { font-size:clamp(72px,23vw,108px); margin:14px 0 8px; }
  .workout-controls button { min-height:52px; }
  .workout-end-btn { min-height:50px; margin-top:8px; }
  .workout-secondary { margin-top:7px; }
}


/* v1.27 verified-only exercise media */
.verified-gif-stage { aspect-ratio: 1 / 1; max-width: 420px; margin-inline:auto; background:var(--deep-bg); }
.exercise-video-gif { width:100%; height:100%; object-fit:contain; display:block; background:var(--deep-bg); }
.verified-media-badge { background:rgba(9,17,13,.9); border:1px solid rgba(var(--accent-rgb),.42); color:var(--accent); }
.verified-demo-unavailable,.demo-verifying { min-height:190px; align-content:center; justify-items:center; text-align:center; }
.verified-demo-unavailable p,.demo-verifying p { max-width:38ch; }
@media (max-width: 560px) {
  .verified-gif-stage { width:min(100%, 360px); }
  .verified-demo-unavailable,.demo-verifying { min-height:160px; }
}


/* v1.28 iPhone viewport + demo sheet hardening */
@media (max-width: 620px) {
  /* iOS Safari zooms focused controls whose text is smaller than 16px. */
  .field input,
  .field select,
  .voice-card select,
  input[type="text"],
  input[type="number"],
  input[type="search"],
  select {
    font-size:16px;
  }

  /* Exercise Demo is a viewport-bounded app screen, not a zoomable web modal. */
  .exercise-demo-dialog {
    position:fixed;
    inset:0;
    width:100vw;
    height:100dvh;
    max-width:none;
    max-height:none;
    margin:0;
    padding:max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));
    overflow:hidden;
  }
  .exercise-demo-dialog .exercise-demo-card {
    width:100%;
    height:100%;
    max-width:none;
    max-height:none;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    border:1px solid var(--line-strong);
    border-radius:18px;
    padding:0 14px calc(14px + env(safe-area-inset-bottom));
  }
  .exercise-demo-head {
    position:sticky;
    top:0;
    z-index:20;
    margin:0 -14px;
    padding:14px;
    background:rgba(16,22,27,.96);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    border-bottom:1px solid rgba(255,255,255,.06);
  }
  .exercise-demo-head > div { min-width:0; }
  .exercise-demo-head h3 { font-size:clamp(22px,7vw,30px); overflow-wrap:anywhere; }
  .exercise-demo-head .icon-btn {
    flex:0 0 48px;
    width:48px;
    min-width:48px;
    height:48px;
  }
  .exercise-demo-visual { margin-top:14px; }
}



/* v1.31 complete theme system */
html, body, .card, .bottom-nav, .topbar, .sheet-card, .confirm-card, .setting-row, .secondary, .icon-btn {
  transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}
.theme-grid { display:grid; grid-template-columns:1fr; gap:10px; margin-bottom:18px; }
.theme-option {
  width:100%; display:grid; grid-template-columns:84px 1fr 28px; gap:12px; align-items:center;
  min-height:76px; padding:10px; text-align:left; border-radius:16px;
  border:1px solid var(--line); background:var(--panel); color:var(--text);
}
.theme-option.selected { border-color:var(--accent); box-shadow:0 0 0 2px rgba(var(--accent-rgb),.14); }
.theme-preview { height:54px; border-radius:12px; border:1px solid rgba(255,255,255,.08); padding:8px; display:flex; align-items:flex-end; gap:5px; overflow:hidden; }
.theme-preview i { display:block; border-radius:4px; }
.theme-preview i:nth-child(1){ width:32px; height:100%; }
.theme-preview i:nth-child(2){ width:16px; height:68%; }
.theme-preview i:nth-child(3){ width:10px; height:42%; }
.theme-option-copy { min-width:0; display:grid; gap:3px; }
.theme-option-copy strong { font-size:15px; }
.theme-option-copy small { color:var(--muted); font-size:11px; line-height:1.35; }
.theme-check { color:var(--accent); font-weight:950; font-size:20px; text-align:center; }
.theme-option[data-theme-choice="midnight-ember"] .theme-preview { background:#0b0d10; }
.theme-option[data-theme-choice="midnight-ember"] .theme-preview i:nth-child(1){ background:#1a1e23; }
.theme-option[data-theme-choice="midnight-ember"] .theme-preview i:nth-child(2){ background:#2d7dff; }
.theme-option[data-theme-choice="midnight-ember"] .theme-preview i:nth-child(3){ background:#19c7df; }
.theme-option[data-theme-choice="graphite-lime"] .theme-preview { background:#0b0e11; }
.theme-option[data-theme-choice="graphite-lime"] .theme-preview i:nth-child(1){ background:#171d23; }
.theme-option[data-theme-choice="graphite-lime"] .theme-preview i:nth-child(2){ background:#8df0a9; }
.theme-option[data-theme-choice="graphite-lime"] .theme-preview i:nth-child(3){ background:#6fd9ff; }
.theme-option[data-theme-choice="navy-ice"] .theme-preview { background:#07111a; }
.theme-option[data-theme-choice="navy-ice"] .theme-preview i:nth-child(1){ background:#142333; }
.theme-option[data-theme-choice="navy-ice"] .theme-preview i:nth-child(2){ background:#61d7ff; }
.theme-option[data-theme-choice="navy-ice"] .theme-preview i:nth-child(3){ background:#7d9dff; }
.theme-option[data-theme-choice="slate-crimson"] .theme-preview { background:#0d0d11; }
.theme-option[data-theme-choice="slate-crimson"] .theme-preview i:nth-child(1){ background:#1e1e25; }
.theme-option[data-theme-choice="slate-crimson"] .theme-preview i:nth-child(2){ background:#ef5f72; }
.theme-option[data-theme-choice="slate-crimson"] .theme-preview i:nth-child(3){ background:#ff9b61; }
.theme-option[data-theme-choice="obsidian-mono"] .theme-preview { background:#08090a; }
.theme-option[data-theme-choice="obsidian-mono"] .theme-preview i:nth-child(1){ background:#18191c; }
.theme-option[data-theme-choice="obsidian-mono"] .theme-preview i:nth-child(2){ background:#f0f2f5; }
.theme-option[data-theme-choice="obsidian-mono"] .theme-preview i:nth-child(3){ background:#9ea5ae; }

/* Theme-aware components that previously used fixed green/charcoal colors. */
.nav-btn.active { background:rgba(var(--accent-rgb),.08); }
.hero { background:radial-gradient(circle at 88% 5%, rgba(var(--accent-2-rgb),.16), transparent 32%), radial-gradient(circle at 10% 100%, rgba(var(--accent-rgb),.14), transparent 34%), var(--panel); }
.field input:focus { box-shadow:0 0 0 3px rgba(var(--accent-rgb),.10); }
.sheet-actions { background:linear-gradient(to top,var(--sheet-bg) 70%, transparent); }
.workout-shell { background:radial-gradient(circle at 50% 30%, rgba(var(--accent-rgb),.12), transparent 35%), var(--workout-bg); }
.primary, .youtube-demo-link.primary { color:var(--accent-contrast); }
.toast { background:var(--accent); color:var(--accent-contrast); }
.pill { background:var(--pill-bg); color:var(--pill-text); border-color:var(--line); }
.voice-card select, .field input, .field select { background:var(--input-bg); border-color:var(--line-strong); }
.sheet-card { background:var(--sheet-bg); }
.confirm-card { background:var(--confirm-bg); }
.install-note { background:var(--notice-bg); color:var(--text-soft); }
.progress-track { background:var(--track-bg); }

@media (min-width: 560px) {
  .theme-grid { grid-template-columns:1fr 1fr; }
}

/* v1.29 curated YouTube fallback */
.youtube-demo-wrap { width:100%; display:grid; gap:10px; padding:10px; }
.youtube-demo-frame { width:100%; aspect-ratio:16/9; border-radius:14px; overflow:hidden; background:#000; }
.youtube-demo-frame iframe { width:100%; height:100%; display:block; border:0; }
.youtube-demo-link {
  display:flex; align-items:center; justify-content:center; min-height:44px;
  padding:10px 14px; border-radius:12px; text-decoration:none; font-weight:800;
  background:rgba(255,255,255,.07); color:var(--text); border:1px solid rgba(255,255,255,.1);
}
.youtube-demo-link.primary { background:var(--accent); color:var(--accent-contrast); border-color:transparent; }
.youtube-search-fallback { gap:10px; padding:22px 18px; }
.youtube-search-fallback p { margin:0; }
@media (max-width: 640px) {
  .youtube-demo-wrap { padding:6px; }
  .youtube-demo-frame { border-radius:12px; }
}


/* v1.32 cross-platform update + media hardening */
.verified-gif-stage {
  aspect-ratio:auto !important;
  width:100%;
  max-width:560px;
  min-height:180px;
  margin-inline:auto;
  background:var(--deep-bg);
}
.exercise-video-gif {
  width:100%;
  height:auto !important;
  max-height:min(58dvh, 480px);
  object-fit:contain;
  display:block;
  background:var(--deep-bg);
}
.app-update-card { display:grid; gap:12px; }
.app-update-card #checkUpdateBtn { justify-self:start; }
.production-host-notice {
  position:sticky; top:0; z-index:1000; width:min(760px,100%); margin:0 auto;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:10px 14px; background:#2b1b06; color:#fff4dd; border-bottom:1px solid #7a4e10;
  box-shadow:0 10px 30px rgba(0,0,0,.28);
}
.production-host-notice span { display:grid; gap:2px; }
.production-host-notice small { color:#dec59f; line-height:1.25; }
.production-host-notice a { flex:0 0 auto; min-height:38px; display:inline-flex; align-items:center; justify-content:center; padding:0 12px; border-radius:10px; text-decoration:none; font-weight:850; background:#fff4dd; color:#241404; }
@media (max-width:560px) {
  .verified-gif-stage { min-height:160px; max-width:100%; }
  .exercise-video-gif { max-height:52dvh; }
  .production-host-notice { align-items:flex-start; }
}

/* v2.0-alpha1 performance tracking */
.v2-exercise-grid { grid-template-columns:repeat(3,minmax(0,1fr)); align-items:end; }
.v2-exercise-grid .v2-name-field { grid-column:1/-1; }
.v2-target-copy { margin-top:8px; color:var(--text-soft); font-size:13px; font-weight:700; letter-spacing:.01em; }
.timer-digits.countup { color:var(--text); }
.v2-timer-caption { margin-top:-6px; margin-bottom:12px; color:var(--muted); font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.rep-entry-card { width:min(100%,390px); margin:18px auto 10px; padding:14px; border:1px solid var(--line-strong); border-radius:18px; background:var(--panel); box-shadow:0 12px 32px rgba(0,0,0,.16); }
.rep-entry-label { display:block; margin-bottom:10px; color:var(--text-soft); font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.rep-stepper { display:grid; grid-template-columns:54px minmax(90px,1fr) 54px; gap:10px; align-items:center; }
.rep-step-btn { min-width:54px; min-height:54px; padding:0; font-size:28px; line-height:1; }
.rep-actual-input { width:100%; min-height:58px; border:1px solid var(--line-strong); border-radius:14px; background:var(--input-bg); color:var(--text); text-align:center; font-size:30px; font-weight:900; font-variant-numeric:tabular-nums; outline:none; }
.rep-actual-input:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(var(--accent-rgb),.12); }
.complete-set-btn { width:100%; min-height:50px; margin-top:12px; }
.v2-finish-hold { min-height:44px; margin:2px auto 10px; }
.v2-history-performance { margin:8px 0 0; color:var(--accent); font-size:12px; font-weight:800; }

@media (max-width:620px) {
  .v2-exercise-grid { grid-template-columns:1fr 1fr; }
  .v2-exercise-grid .v2-name-field { grid-column:1/-1; }
  .manual-workout-shell .workout-center { padding-top:12px; padding-bottom:12px; }
  .manual-workout-shell .timer-digits { font-size:clamp(62px,20vw,96px); margin:12px 0 8px; }
  .rep-entry-card { margin-top:10px; padding:12px; }
  .rep-actual-input { font-size:28px; }
}

@media (max-width:390px) {
  .v2-exercise-grid { grid-template-columns:1fr; }
  .v2-exercise-grid .v2-name-field { grid-column:auto; }
  .rep-stepper { grid-template-columns:50px minmax(80px,1fr) 50px; gap:8px; }
  .rep-step-btn { min-width:50px; min-height:50px; }
}


/* GritHQ legacy v2.0-alpha3 — performance intelligence + data integrity */
.v2-previous-performance{margin:12px auto 0;max-width:520px;display:flex;align-items:center;justify-content:center;gap:9px;flex-wrap:wrap;color:var(--muted);font-size:.92rem}
.v2-previous-performance span{font-size:.76rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent)}
.v2-previous-performance strong{color:var(--text);font-size:.96rem}
.performance-section-heading{margin-top:34px}
.performance-stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.performance-stats-grid .stat{min-width:0}
.performance-stats-grid .stat strong{font-size:1.35rem;overflow-wrap:anywhere}
.recent-pr-card,.exercise-progress-card,.workout-complete-summary{overflow:hidden}
.recent-pr-list{display:grid;gap:8px;margin-top:14px}
.recent-pr-row{width:100%;border:1px solid var(--line);background:var(--panel-2);color:var(--text);border-radius:14px;padding:12px 14px;display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;text-align:left;cursor:pointer}
.recent-pr-row:hover,.recent-pr-row:focus-visible{border-color:var(--accent);outline:none}
.pr-trophy{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(var(--accent-rgb),.12);color:var(--accent);font-size:1rem}
.recent-pr-main{display:grid;gap:2px;min-width:0}
.recent-pr-main small{color:var(--muted);line-height:1.35}
.recent-pr-row b{color:var(--accent);white-space:nowrap}
.performance-empty{margin-top:14px}
.exercise-progress-head{display:flex;align-items:end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.exercise-progress-select{min-width:min(320px,100%);margin:0}
.exercise-record-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px;color:var(--muted);font-size:.82rem}
.exercise-record-heading strong{color:var(--text);font-size:.95rem}
.exercise-best-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:16px}
.exercise-best-grid>div{border:1px solid var(--line);border-radius:14px;background:var(--panel-2);padding:12px;display:grid;gap:4px}
.exercise-best-grid span{color:var(--muted);font-size:.8rem}
.exercise-best-grid strong{font-size:1.14rem}
.exercise-progress-chart-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:20px;color:var(--muted)}
.exercise-progress-chart-head strong{color:var(--text)}
.exercise-progress-chart{height:170px;display:flex;align-items:end;gap:8px;padding:18px 4px 0;margin-top:8px;border-bottom:1px solid var(--line);overflow-x:auto}
.exercise-progress-bar-col{min-width:42px;flex:1;display:grid;grid-template-rows:20px 1fr 28px;align-items:end;justify-items:center;height:100%}
.exercise-progress-value{font-size:.72rem;color:var(--text)}
.exercise-progress-bar{width:min(32px,72%);min-height:3px;border-radius:8px 8px 3px 3px;background:linear-gradient(180deg,var(--accent-2),var(--accent))}
.exercise-progress-label{font-size:.7rem;color:var(--muted);white-space:nowrap;padding-top:5px}
.exercise-progress-history-head{margin-top:18px}
.exercise-session-list{display:grid;gap:8px;margin-top:10px}
.exercise-session-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:11px 12px;border:1px solid var(--line);border-radius:12px;background:var(--panel-2)}
.exercise-session-row>div{display:grid;gap:2px;min-width:0}
.exercise-session-row small{color:var(--muted)}
.exercise-pr-badge{display:inline-flex;align-items:center;margin-left:7px;padding:2px 6px;border-radius:999px;background:rgba(var(--accent-rgb),.12);color:var(--accent);font-size:.68rem;font-weight:800;white-space:nowrap}
.exercise-session-row>span{color:var(--accent);text-align:right}
.workout-complete-summary{border-color:rgba(var(--accent-rgb),.58);box-shadow:0 0 0 1px rgba(var(--accent-rgb),.12) inset}
.workout-summary-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.workout-summary-head h3{font-size:1.45rem;margin:2px 0 3px}
.workout-pr-banner,.workout-baseline-banner{margin-top:14px;border-radius:13px;padding:12px 14px}
.workout-pr-banner{background:rgba(var(--accent-rgb),.12);border:1px solid rgba(var(--accent-rgb),.55);display:grid;gap:4px}
.workout-pr-banner strong{color:var(--accent);font-size:1.02rem}
.workout-pr-banner span{color:var(--text)}
.workout-baseline-banner{background:var(--panel-2);border:1px solid var(--line);color:var(--muted)}
.workout-summary-exercises{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:14px}
.workout-summary-exercise{border:1px solid var(--line);border-radius:12px;background:var(--panel-2);color:var(--text);padding:11px 12px;text-align:left;display:grid;gap:4px;cursor:pointer}
.workout-summary-exercise:hover,.workout-summary-exercise:focus-visible{border-color:var(--accent);outline:none}
.workout-summary-exercise span{color:var(--muted);font-size:.84rem}
@media(max-width:760px){
  .performance-stats-grid,.exercise-best-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .workout-summary-exercises{grid-template-columns:1fr}
  .exercise-progress-head{align-items:stretch}
  .exercise-record-heading{align-items:flex-start;flex-direction:column;gap:3px}
  .exercise-progress-select{width:100%;min-width:0}
  .recent-pr-row{grid-template-columns:auto 1fr}.recent-pr-row b{grid-column:2;justify-self:start}
  .exercise-session-row{align-items:flex-start;flex-direction:column}.exercise-session-row>span{text-align:left}
}


/* GritHQ legacy v2.0-alpha4.2 — progress dashboard + expandable movement cards */
.progress-change.up{color:var(--success)}
.progress-change.down{color:var(--danger)}
.progress-change.flat{color:var(--muted)}

.recent-progress-card{padding-top:8px;padding-bottom:8px}
.recent-progress-list{display:grid}
.recent-progress-row{width:100%;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--text);padding:13px 2px;display:flex;justify-content:space-between;align-items:center;gap:16px;text-align:left}
.recent-progress-row:last-child{border-bottom:0}
.recent-progress-row:hover,.recent-progress-row:focus-visible{outline:none;background:rgba(255,255,255,.025)}
.recent-progress-main,.recent-progress-result{display:grid;gap:3px}
.recent-progress-main{min-width:0}
.recent-progress-main small{color:var(--muted);font-size:.78rem}
.recent-progress-result{text-align:right;justify-items:end;white-space:nowrap}
.recent-progress-result strong{font-size:1.08rem}
.recent-progress-result b{font-size:.82rem}
.recent-progress-pr{display:inline-flex;margin-left:7px;color:var(--success);font-weight:850}

.exercise-progress-card{padding-bottom:14px}
.exercise-progress-tools{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:18px 0 12px;flex-wrap:wrap}
.progress-filter-chips{display:flex;gap:7px;flex-wrap:wrap}
.progress-filter-chip{min-height:36px;border-radius:999px;border:1px solid var(--line);background:var(--panel-2);color:var(--muted);padding:7px 13px;font-size:.8rem;font-weight:800}
.progress-filter-chip.active{background:var(--text);border-color:var(--text);color:var(--bg)}
.progress-search{min-width:min(270px,100%)}
.progress-search input{width:100%;min-height:40px;border:1px solid var(--line);border-radius:12px;background:var(--input-bg);color:var(--text);padding:8px 12px}

.exercise-progress-list{display:grid;gap:10px}
.exercise-progress-item{border:1px solid var(--line);border-radius:16px;background:var(--panel-2);overflow:hidden;transition:border-color .18s ease,background .18s ease,transform .18s ease}
.exercise-progress-item.expanded{border-color:rgba(var(--accent-rgb),.55);background:var(--panel-3)}
.exercise-progress-item.hidden{display:none}
.exercise-progress-item-head{display:grid;grid-template-columns:1fr auto;align-items:stretch}
.exercise-progress-toggle{border:0;background:transparent;color:var(--text);padding:14px;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:14px;text-align:left}
.exercise-progress-toggle:hover,.exercise-progress-toggle:focus-visible{outline:none;background:rgba(255,255,255,.025)}
.exercise-progress-name{display:grid;gap:3px;min-width:0}
.exercise-progress-name strong{font-size:1.03rem}
.exercise-progress-name small{color:var(--muted);font-size:.76rem}
.exercise-progress-current{display:grid;justify-items:end;gap:2px;white-space:nowrap}
.exercise-progress-current small{color:var(--muted);font-size:.68rem;text-transform:uppercase;letter-spacing:.07em}
.exercise-progress-current strong{font-size:1.08rem}
.exercise-progress-current b{font-size:.77rem}
.exercise-progress-chevron{color:var(--muted);font-size:1rem}
.exercise-progress-favorite{width:46px;border:0;border-left:1px solid var(--line);background:transparent;color:var(--muted);font-size:1.05rem}
.exercise-progress-favorite.active{color:var(--accent)}
.exercise-progress-favorite:hover,.exercise-progress-favorite:focus-visible{outline:none;background:rgba(var(--accent-rgb),.07)}

.exercise-progress-compact{display:grid;grid-template-columns:minmax(90px,.7fr) minmax(110px,.8fr) minmax(150px,1.4fr) minmax(110px,1fr);gap:8px;padding:0 14px 14px}
.exercise-progress-compact>div:not(.exercise-mini-trend){display:grid;gap:3px;padding:9px 10px;border:1px solid rgba(255,255,255,.055);border-radius:11px;background:rgba(0,0,0,.11);min-width:0}
.exercise-progress-compact span{color:var(--muted);font-size:.69rem}
.exercise-progress-compact strong{font-size:.84rem;overflow-wrap:anywhere}
.exercise-mini-trend{height:44px;display:flex;align-items:end;gap:3px;padding:5px 3px;border-bottom:1px solid var(--line)}
.exercise-mini-trend span{flex:1;min-width:3px;max-width:11px;border-radius:4px 4px 1px 1px;background:linear-gradient(180deg,var(--accent-2),var(--accent));opacity:.9}

.exercise-progress-expanded{border-top:1px solid var(--line);padding:0 14px 16px;animation:progressExpand .16s ease-out}
@keyframes progressExpand{from{opacity:.4;transform:translateY(-3px)}to{opacity:1;transform:none}}
.exercise-progress-subhead{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:18px;color:var(--muted);font-size:.78rem}
.exercise-progress-subhead strong{color:var(--text);font-size:.94rem}
.exercise-lifetime-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:10px}
.exercise-lifetime-grid>div{display:grid;gap:3px;border:1px solid var(--line);border-radius:11px;background:var(--panel-2);padding:10px}
.exercise-lifetime-grid span{font-size:.7rem;color:var(--muted)}
.exercise-lifetime-grid strong{font-size:.92rem}

.interval-training-list{display:grid;gap:8px;margin-top:12px}
.interval-training-row{display:flex;justify-content:space-between;align-items:center;gap:14px;border:1px solid var(--line);border-radius:13px;background:var(--panel-2);padding:12px 13px}
.interval-training-row>div{display:grid;gap:3px}
.interval-training-row>div:last-child{text-align:right}
.interval-training-row small{color:var(--muted);font-size:.76rem}

.lifetime-work-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.milestone-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.milestone-item{border:1px solid var(--line);border-radius:14px;background:var(--panel);padding:13px;display:grid;gap:8px}
.milestone-item>div:first-child{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.milestone-item span,.milestone-item small{color:var(--muted);font-size:.76rem}
.milestone-item strong{font-size:1.05rem}
.milestone-track{height:6px;border-radius:999px;background:var(--track-bg);overflow:hidden}
.milestone-track span{display:block;height:100%;background:var(--success);border-radius:inherit}

@media(max-width:760px){
  .exercise-progress-tools{align-items:stretch}
  .progress-search{width:100%}
  .exercise-progress-toggle{grid-template-columns:minmax(0,1fr) auto auto;gap:9px;padding:12px}
  .exercise-progress-compact{grid-template-columns:repeat(3,minmax(0,1fr));padding:0 12px 12px}
  .exercise-mini-trend{grid-column:1/-1}
  .exercise-lifetime-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lifetime-work-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .interval-training-row{align-items:flex-start}
}
@media(max-width:440px){
  .exercise-progress-current strong{font-size:.98rem}
  .exercise-progress-current b{font-size:.72rem}
  .exercise-progress-compact{grid-template-columns:1fr 1fr}
  .exercise-progress-compact>div:nth-child(3){grid-column:1/-1}
  .exercise-mini-trend{grid-column:1/-1}
  .milestone-grid{grid-template-columns:1fr}
  .recent-progress-row{align-items:flex-start}
}

.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Alpha4.5 personalized training profile */
.personalized-plan-card { display:grid; gap:14px; padding:18px; }
.personalized-plan-head { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }
.personalized-plan-head h3 { margin:3px 0 4px; font-size:21px; }
.suggested-exercise-list { display:flex; flex-wrap:wrap; gap:8px; }
.suggested-exercise-list span { border:1px solid var(--line); background:var(--panel-2); border-radius:999px; padding:8px 11px; font-size:12px; font-weight:700; }
.personalized-plan-actions { display:flex; gap:9px; flex-wrap:wrap; }
.recommendation-note { margin:0; line-height:1.45; }
.training-profile-dialog .training-profile-card { width:min(720px, calc(100vw - 24px)); max-height:min(88vh, 820px); overflow:auto; }
.training-profile-title h3 { margin:4px 0 4px; font-size:24px; }
.training-profile-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:14px; }
.profile-choice-group { border:1px solid var(--line); border-radius:16px; padding:14px; margin:14px 0 0; }
.profile-choice-group legend { font-weight:800; padding:0 6px; }
.profile-choice-group .subtle { margin:2px 0 10px; }
.profile-check-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.profile-check-grid label { display:flex; align-items:center; gap:9px; border:1px solid var(--line); border-radius:12px; padding:10px; cursor:pointer; background:var(--panel-2); }
.profile-check-grid input { width:18px; height:18px; accent-color:var(--accent); }
.training-profile-summary { display:grid; gap:3px; padding:12px; border:1px solid var(--line); border-radius:14px; background:var(--panel-2); }
.training-profile-summary span { color:var(--muted); font-size:13px; }
@media (max-width:640px) {
  .training-profile-grid, .profile-check-grid { grid-template-columns:1fr; }
  .training-profile-dialog .training-profile-card { width:min(100% - 14px, 720px); max-height:92dvh; padding:16px; }
  .personalized-plan-head { align-items:flex-start; }
  .personalized-plan-actions > * { flex:1 1 auto; }
}

/* Alpha4.6 full-page responsive training profile */
.training-profile-dialog {
  position:fixed;
  inset:0;
  width:100vw;
  height:100dvh;
  max-width:none;
  max-height:none;
  margin:0;
  padding:0;
  border:0;
  background:var(--bg);
  color:var(--text);
  overflow:hidden;
}
.training-profile-dialog::backdrop { background:var(--bg); }
.training-profile-page {
  width:100%;
  height:100%;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior-y:contain;
  -webkit-overflow-scrolling:touch;
  background:radial-gradient(circle at 50% 0%, rgba(var(--accent-rgb),.10), transparent 34%), var(--bg);
}
.training-profile-page-inner {
  width:min(1180px,100%);
  margin:0 auto;
  padding:calc(28px + env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) calc(34px + env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left));
}
.training-profile-page-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:24px;
  padding-bottom:22px;
  border-bottom:1px solid var(--line);
}
.training-profile-page-head h2 { margin:5px 0 7px; font-size:clamp(30px,4vw,48px); line-height:1.04; }
.training-profile-page-head .subtle { max-width:70ch; margin:0; font-size:15px; line-height:1.55; }
.profile-close-btn { flex:0 0 auto; }
.profile-section { margin-top:22px; }
.training-profile-page .training-profile-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:0; }
.training-profile-page .training-profile-grid .field:first-child { grid-column:span 2; }
.training-profile-page .profile-choice-group { margin-top:22px; padding:18px; border-radius:20px; }
.profile-goal-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.profile-select-card,
.equipment-option {
  position:relative;
  display:flex;
  align-items:center;
  min-width:0;
  gap:10px;
  padding:13px 14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--panel-2);
  cursor:pointer;
  transition:border-color .15s ease, background .15s ease, transform .15s ease;
}
.profile-select-card:hover,
.equipment-option:hover { border-color:var(--line-strong); }
.profile-select-card:has(input:checked),
.equipment-option.selected {
  border-color:var(--accent);
  background:rgba(var(--accent-rgb),.10);
  box-shadow:0 0 0 2px rgba(var(--accent-rgb),.08);
}
.profile-select-card input,
.equipment-option input { width:19px; height:19px; flex:0 0 auto; accent-color:var(--accent); }
.profile-select-card span { min-width:0; font-weight:750; }
.equipment-picker-tools { display:flex; align-items:end; gap:12px; margin:12px 0; }
.equipment-search-field { flex:1 1 520px; }
.equipment-selected-count { flex:0 0 auto; color:var(--muted); font-size:13px; font-weight:800; padding:0 4px 12px; }
.equipment-category-chips { display:flex; gap:8px; overflow-x:auto; padding:2px 0 12px; scrollbar-width:thin; }
.equipment-category-chip {
  flex:0 0 auto;
  min-height:36px;
  padding:7px 11px;
  border-radius:999px;
  border:1px solid var(--line);
  background:var(--panel-2);
  color:var(--text-soft);
  font-size:12px;
  font-weight:800;
}
.equipment-category-chip.active { border-color:var(--accent); color:var(--accent); background:rgba(var(--accent-rgb),.10); }
.equipment-library { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.equipment-option-copy { min-width:0; display:grid; gap:2px; }
.equipment-option-copy strong { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.equipment-option-copy small { color:var(--muted); font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.equipment-empty { margin:14px 0 0; }
.profile-page-savebar {
  position:sticky;
  bottom:0;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin:24px -8px -8px;
  padding:14px 8px calc(8px + env(safe-area-inset-bottom));
  background:linear-gradient(to top,var(--bg) 76%,rgba(0,0,0,0));
}
.profile-page-savebar .primary { min-width:220px; }

@media (max-width:900px) {
  .training-profile-page .training-profile-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .training-profile-page .training-profile-grid .field:first-child { grid-column:1/-1; }
  .profile-goal-grid,
  .equipment-library { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:620px) {
  .training-profile-dialog { width:100%; height:100dvh; }
  .training-profile-page-inner {
    padding:calc(18px + env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));
  }
  .training-profile-page-head { gap:10px; padding-bottom:16px; }
  .training-profile-page-head h2 { font-size:30px; }
  .training-profile-page-head .subtle { font-size:14px; }
  .training-profile-page .training-profile-grid,
  .profile-goal-grid,
  .equipment-library,
  .training-profile-page .profile-check-grid { grid-template-columns:1fr; }
  .training-profile-page .profile-choice-group { padding:14px; margin-top:16px; }
  .equipment-picker-tools { align-items:stretch; flex-direction:column; gap:4px; }
  .equipment-search-field { flex:0 0 auto; width:100%; }
  .equipment-selected-count { padding:0 2px 7px; }
  .profile-page-savebar { align-items:stretch; flex-direction:column; }
  .profile-page-savebar .primary { width:100%; min-width:0; min-height:52px; }
  .profile-close-btn { min-height:40px; }
  .training-profile-page input,
  .training-profile-page select { font-size:16px; }
}

/* Phone landscape: use the extra width, but keep a normal document scroll so
   rotation never creates a zoomed or horizontally clipped modal. */
@media (orientation:landscape) and (max-height:600px) {
  .training-profile-page-inner {
    width:100%;
    max-width:1000px;
    padding:calc(10px + env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) calc(18px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
  }
  .training-profile-page-head { padding-bottom:10px; }
  .training-profile-page-head h2 { font-size:28px; }
  .training-profile-page-head .subtle { font-size:13px; line-height:1.35; }
  .training-profile-page .training-profile-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
  .training-profile-page .training-profile-grid .field:first-child { grid-column:span 1; }
  .profile-goal-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .equipment-library { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .training-profile-page .profile-check-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .training-profile-page .profile-choice-group { margin-top:12px; padding:12px; }
  .profile-select-card,.equipment-option { padding:9px 10px; }
  .profile-page-savebar { flex-direction:row; align-items:center; padding-bottom:calc(6px + env(safe-area-inset-bottom)); }
  .profile-page-savebar .primary { width:auto; min-width:210px; }
}

/* Keep iOS orientation changes from auto-enlarging text or widening grid children. */
html { -webkit-text-size-adjust:100%; text-size-adjust:100%; }
.training-profile-page *,
.training-profile-grid > *,
.profile-goal-grid > *,
.equipment-library > * { min-width:0; box-sizing:border-box; }


/* Alpha4.8 searchable injury / movement-limit profile */
.injury-picker-tools { display:flex; align-items:end; gap:12px; margin:12px 0; }
.injury-search-field { flex:1 1 520px; }
.injury-selected-count { flex:0 0 auto; color:var(--muted); font-size:13px; font-weight:800; padding:0 4px 12px; }
.injury-category-chips { display:flex; gap:8px; overflow-x:auto; padding:2px 0 12px; scrollbar-width:thin; }
.injury-category-chip { flex:0 0 auto; min-height:36px; padding:7px 11px; border-radius:999px; border:1px solid var(--line); background:var(--panel-2); color:var(--text-soft); font-size:12px; font-weight:800; }
.injury-category-chip.active { border-color:var(--accent); color:var(--accent); background:rgba(var(--accent-rgb),.10); }
.injury-library { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.injury-option { position:relative; display:flex; align-items:center; min-width:0; gap:10px; padding:13px 14px; border:1px solid var(--line); border-radius:14px; background:var(--panel-2); cursor:pointer; transition:border-color .15s ease,background .15s ease; }
.injury-option:hover { border-color:var(--line-strong); }
.injury-option.selected { border-color:var(--accent); background:rgba(var(--accent-rgb),.10); box-shadow:0 0 0 2px rgba(var(--accent-rgb),.08); }
.injury-option input { width:19px; height:19px; flex:0 0 auto; accent-color:var(--accent); }
.injury-option-copy { min-width:0; display:grid; gap:2px; }
.injury-option-copy strong { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.injury-option-copy small { color:var(--muted); font-size:11px; }
.injury-empty { margin:14px 0 0; }
.selected-injury-panel { margin-top:16px; padding:14px; border:1px solid var(--line); border-radius:16px; background:rgba(255,255,255,.018); }
.selected-injury-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:10px; }
.selected-injury-list { display:grid; gap:8px; }
.selected-injury-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(125px,170px) auto; align-items:center; gap:10px; padding:9px 10px; border:1px solid var(--line); border-radius:12px; background:var(--panel-2); }
.selected-injury-copy { min-width:0; display:grid; gap:2px; }
.selected-injury-copy strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.selected-injury-copy small { color:var(--muted); font-size:11px; }
.injury-mode-select { min-height:40px; font-size:14px; }
.custom-injury-row { display:grid; grid-template-columns:minmax(0,2fr) minmax(150px,1fr) auto; align-items:end; gap:10px; margin-top:14px; }
.custom-injury-row .secondary { min-height:46px; }
@media (max-width:900px) { .injury-library { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:620px) {
  .injury-picker-tools { align-items:stretch; flex-direction:column; gap:4px; }
  .injury-search-field { flex:0 0 auto; width:100%; }
  .injury-selected-count { padding:0 2px 7px; }
  .injury-library { grid-template-columns:1fr; }
  .selected-injury-row { grid-template-columns:1fr; align-items:stretch; }
  .injury-remove { justify-self:start; }
  .custom-injury-row { grid-template-columns:1fr; }
}
@media (orientation:landscape) and (max-height:600px) {
  .injury-library { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .injury-option { padding:9px 10px; }
  .selected-injury-row { grid-template-columns:minmax(0,1fr) 145px auto; }
  .custom-injury-row { grid-template-columns:minmax(0,2fr) minmax(140px,1fr) auto; }
}
.training-profile-page *, .injury-library > * { min-width:0; box-sizing:border-box; }

/* Alpha4.9 adaptive training check-in */
.readiness-dialog { max-width:580px; }
.readiness-card { display:grid; gap:16px; }
.readiness-head h3 { margin:3px 0 6px; font-size:24px; }
.readiness-head .subtle { margin:0; line-height:1.45; }
.readiness-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:0; }
.readiness-actions { margin-top:2px; }
.adaptive-reason { margin:0; padding:10px 12px; border-radius:12px; background:var(--input-bg); border:1px solid var(--line); }
@media (max-width:620px) {
  .readiness-grid { grid-template-columns:1fr; }
  .readiness-dialog { width:min(100% - 14px,580px); }
}

/* GritHQ v2.0-alpha4.11 — training architecture */
.training-area-heading { margin-top:26px; }
.training-area-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-bottom:18px; }
.training-area-card { min-width:0; border:1px solid var(--line); background:var(--card); color:var(--text); border-radius:22px; padding:20px; text-align:left; display:grid; grid-template-columns:auto 1fr; gap:14px 16px; align-items:start; box-shadow:none; }
.training-area-card:hover { border-color:rgba(var(--accent-rgb),.48); }
.training-area-card:active { transform:translateY(1px); }
.training-area-card .training-area-icon { width:44px; height:44px; border-radius:14px; display:grid; place-items:center; font-size:24px; font-weight:800; color:var(--accent); background:rgba(var(--accent-rgb),.10); border:1px solid rgba(var(--accent-rgb),.2); }
.training-area-card > span:nth-child(2) { display:grid; gap:5px; }
.training-area-card strong { font-size:18px; }
.training-area-card small { color:var(--muted); line-height:1.4; }
.training-area-card b { grid-column:2; color:var(--accent); font-size:12px; font-weight:750; }
.training-area-card.strength-cardio .training-area-icon { color:var(--text); background:rgba(255,255,255,.045); border-color:var(--line); }
.training-area-card.strength-cardio b { color:var(--muted); }

.workout-library-title { margin-bottom:14px; }
.workout-area-switch { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-bottom:12px; }
.workout-area-btn { border:1px solid var(--line); background:var(--card); color:var(--text); border-radius:18px; min-height:78px; padding:14px 16px; text-align:left; display:grid; gap:4px; }
.workout-area-btn strong { font-size:16px; }
.workout-area-btn small { color:var(--muted); }
.workout-area-btn.active { border-color:rgba(var(--accent-rgb),.58); background:rgba(var(--accent-rgb),.09); box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.12); }
.strength-cardio-tabs { display:flex; gap:8px; overflow-x:auto; padding:2px 0 12px; scrollbar-width:none; }
.strength-cardio-tabs::-webkit-scrollbar { display:none; }
.strength-cardio-tab { flex:1 0 auto; min-width:100px; border:1px solid var(--line); background:transparent; color:var(--muted); border-radius:999px; padding:10px 14px; font-weight:750; }
.strength-cardio-tab.active { color:var(--text); border-color:rgba(var(--accent-rgb),.5); background:rgba(var(--accent-rgb),.09); }
.training-mode-intro { margin:6px 0 18px; padding:18px 0 4px; display:flex; gap:18px; justify-content:space-between; align-items:flex-end; }
.training-mode-intro > div { max-width:64ch; }
.training-mode-intro h2 { margin:2px 0 6px; }
.mode-suggestion-card { display:grid; gap:14px; }
.mode-suggestion-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }
.mode-suggestion-head h3 { margin:2px 0 5px; }
.strength-foundation-card { display:grid; gap:14px; }
.strength-foundation-points { display:flex; flex-wrap:wrap; gap:8px; }
.strength-foundation-points span { border:1px solid var(--line); background:rgba(255,255,255,.025); color:var(--muted); border-radius:999px; padding:8px 10px; font-size:12px; }
.cardio-quick-link { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.cardio-quick-link p { margin:4px 0 0; }

.suggestion-mode-switch { display:flex; gap:7px; overflow-x:auto; scrollbar-width:none; }
.suggestion-mode-switch::-webkit-scrollbar { display:none; }
.suggestion-mode-btn { flex:1 0 auto; border:1px solid var(--line); background:transparent; color:var(--muted); border-radius:999px; padding:9px 12px; font-weight:750; }
.suggestion-mode-btn.active { color:var(--text); border-color:rgba(var(--accent-rgb),.52); background:rgba(var(--accent-rgb),.09); }

.training-mode-badge { display:inline-flex; align-items:center; width:max-content; border:1px solid var(--line); background:rgba(255,255,255,.035); color:var(--muted); border-radius:999px; padding:4px 8px; font-size:10px; font-weight:800; letter-spacing:.03em; white-space:nowrap; }
.training-mode-badge.calisthenics { color:var(--accent); border-color:rgba(var(--accent-rgb),.3); background:rgba(var(--accent-rgb),.07); }
.training-mode-badge.cardio { color:var(--text); }
.training-mode-badge.strength { color:var(--text); border-color:rgba(255,255,255,.16); }
.training-mode-badge.hybrid { color:var(--muted); border-style:dashed; }
.routine-card-title-row,.history-title-row { display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
.routine-card-title-row h3 { margin:0; }
.routine-mode-field { margin-bottom:4px; }
.routine-mode-help { display:block; margin-top:7px; color:var(--muted); line-height:1.4; }
.strength-picker-note { border-color:rgba(var(--accent-rgb),.2); background:rgba(var(--accent-rgb),.05); }

.progress-area-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-bottom:16px; }
.progress-area-tab { border:1px solid var(--line); background:var(--card); color:var(--muted); min-height:44px; border-radius:14px; padding:8px 10px; font-weight:750; }
.progress-area-tab.active { color:var(--text); border-color:rgba(var(--accent-rgb),.52); background:rgba(var(--accent-rgb),.09); }
.training-area-stats { margin-bottom:14px; }

@media (max-width:700px) {
  .training-area-grid { grid-template-columns:1fr; }
  .training-area-card { padding:17px; }
  .workout-area-switch { grid-template-columns:1fr 1fr; }
  .workout-area-btn { min-height:72px; padding:12px; }
  .training-mode-intro { display:grid; align-items:start; }
  .training-mode-intro .primary { width:100%; }
  .mode-suggestion-head { display:grid; }
  .cardio-quick-link { align-items:flex-start; flex-direction:column; }
  .cardio-quick-link .secondary { width:100%; }
  .progress-area-tabs { display:flex; overflow-x:auto; scrollbar-width:none; }
  .progress-area-tabs::-webkit-scrollbar { display:none; }
  .progress-area-tab { flex:1 0 auto; min-width:108px; }
}

@media (max-width:430px) {
  .workout-area-switch { grid-template-columns:1fr; }
  .training-area-card { grid-template-columns:40px 1fr; gap:12px; }
  .training-area-card .training-area-icon { width:40px; height:40px; border-radius:12px; }
}
.profile-save-actions { display:flex; align-items:center; justify-content:flex-end; gap:10px; flex-wrap:wrap; }
@media (max-width:700px) {
  .profile-save-actions { width:100%; display:grid; grid-template-columns:1fr; }
  .profile-save-actions .primary, .profile-save-actions .secondary { width:100%; min-width:0; min-height:50px; }
}


/* =========================================================
   GritHQ v2.0 alpha4.12 — visual identity + application shell
   Keeps the workout/data engines intact while replacing the legacy UI.
   ========================================================= */
html { background:#05080d; }
html, body { overflow-x:hidden; }
body { background:
  radial-gradient(circle at 50% -14%, rgba(47,128,255,.12), transparent 34rem),
  radial-gradient(circle at 100% 18%, rgba(18,198,219,.05), transparent 28rem),
  var(--bg);
  letter-spacing:-.005em;
}
.app-shell { width:min(980px,100%); }
.topbar {
  padding:calc(12px + env(safe-area-inset-top)) 18px 12px;
  background:linear-gradient(180deg,rgba(var(--bg-rgb),.98) 15%,rgba(var(--bg-rgb),.88) 72%,rgba(var(--bg-rgb),0));
  backdrop-filter:blur(22px) saturate(140%);
}
.brand-row { gap:10px; }
.brand-mark {
  width:40px; height:40px; border-radius:12px; overflow:hidden; padding:0;
  background:linear-gradient(145deg,#111b27,#070b11); border:1px solid #243549;
  box-shadow:0 8px 26px rgba(47,128,255,.14);
}
.brand-mark img { width:100%; height:100%; display:block; }
.brand-copy h1 { font-size:19px; font-weight:850; letter-spacing:-.045em; }
.brand-copy .subtle { font-size:10px; text-transform:uppercase; letter-spacing:.12em; color:#718296; font-weight:750; }
.main-content { padding:10px 18px 32px; }
.card {
  background:linear-gradient(145deg,rgba(16,26,38,.94),rgba(10,17,26,.96));
  border-color:#1e2c3a; box-shadow:0 18px 44px rgba(0,0,0,.16);
}
.primary {
  background:linear-gradient(135deg,#2f80ff 0%,#2473ef 58%,#12bcd2 130%);
  color:white; box-shadow:0 10px 26px rgba(47,128,255,.22);
}
.primary:active { transform:translateY(1px); box-shadow:0 5px 14px rgba(47,128,255,.18); }
.secondary { background:#111c28; border-color:#243446; }
.ghost { border-color:#243446; }
.eyebrow { color:#65a8ff; letter-spacing:.15em; }
.section-title-row { margin-top:24px; }
.section-title-row h2 { font-size:clamp(25px,4vw,34px); }
.bottom-nav {
  grid-template-columns:repeat(4,1fr); width:min(980px,100%);
  padding:7px 10px calc(8px + env(safe-area-inset-bottom));
  background:rgba(7,12,18,.90); border-color:#1e2c3a;
  backdrop-filter:blur(24px) saturate(150%);
}
.nav-btn { min-height:49px; gap:3px; border-radius:14px; transition:background .16s ease,color .16s ease,transform .16s ease; }
.nav-btn.active { color:#63a8ff; background:linear-gradient(180deg,rgba(47,128,255,.13),rgba(47,128,255,.05)); }
.nav-btn.active svg { filter:drop-shadow(0 0 7px rgba(47,128,255,.35)); }
.nav-btn small { font-weight:720; letter-spacing:.015em; }

/* Home */
.home-feature { padding:22px; border-color:#203347; background:
  radial-gradient(circle at 88% 6%,rgba(47,128,255,.20),transparent 36%),
  radial-gradient(circle at 3% 100%,rgba(18,198,219,.08),transparent 32%),
  linear-gradient(145deg,#101a27,#09111a 76%); }
.home-feature-glow { background:radial-gradient(circle,rgba(47,128,255,.26),rgba(18,198,219,.08) 46%,transparent 72%); }
.home-feature-head h2,.home-feature-empty h2 { font-size:clamp(30px,5vw,42px); line-height:1; }
.home-duration-badge { background:rgba(47,128,255,.11); border-color:rgba(47,128,255,.30); color:#7db5ff; }
.home-feature-stats > div { background:rgba(5,10,16,.48); border-color:#1d2d3e; }
.home-exercise-preview { border-color:#203144; background:rgba(5,10,16,.42); }
.home-exercise-number { background:rgba(47,128,255,.12); color:#7db5ff; }
.home-balance-track span { background:linear-gradient(90deg,#2f80ff,#12c6db); }
.training-area-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.training-area-card {
  min-height:168px; padding:18px; border-radius:20px; border:1px solid #233447;
  background:linear-gradient(145deg,#101a26,#0a111a); box-shadow:none;
  align-content:space-between; position:relative; overflow:hidden;
}
.training-area-card::after { content:""; position:absolute; inset:auto -45px -68px auto; width:160px; height:160px; border-radius:50%; opacity:.13; pointer-events:none; }
.training-area-card.calisthenics::after { background:var(--calisthenics); }
.training-area-card.strength-cardio::after { background:var(--strength); }
.training-area-card:hover { border-color:#315170; transform:translateY(-1px); }
.training-area-card .training-area-icon {
  width:42px; height:42px; border-radius:13px; font-size:18px; font-weight:900;
  background:#0a121c; border:1px solid #2b4157;
}
.training-area-card.calisthenics .training-area-icon { color:var(--calisthenics); box-shadow:inset 0 0 0 1px rgba(31,199,212,.08); }
.training-area-card.strength-cardio .training-area-icon { color:#68a6ff; box-shadow:inset 0 0 0 1px rgba(52,125,255,.08); }
.training-area-card strong { font-size:20px; letter-spacing:-.025em; }
.training-area-card small { color:#8fa0b2; line-height:1.45; }
.training-area-card b { font-size:11px; color:#71859a; font-weight:700; }
.home-action-card { border-color:#203044; background:linear-gradient(145deg,#0f1924,#0a1119); }
.home-action-icon { background:rgba(47,128,255,.09); border-color:rgba(47,128,255,.18); color:#73adff; }

/* Training library / mode switcher */
.workout-area-tabs,.strength-cardio-tabs,.progress-area-tabs { background:#09121b; border:1px solid #1e2c3a; border-radius:16px; padding:4px; gap:4px; }
.workout-area-btn,.strength-cardio-tab,.progress-area-tab { border-radius:12px; border:0; }
.workout-area-btn.active,.strength-cardio-tab.active,.progress-area-tab.active { background:#172536; color:#eef6ff; box-shadow:inset 0 0 0 1px #29435c; }
.training-mode-intro { border-color:#223449; background:linear-gradient(145deg,#101a26,#0b121b); border-radius:20px; }
.training-mode-badge { border-radius:999px; font-weight:800; }
.training-mode-badge.calisthenics { color:var(--calisthenics); background:rgba(31,199,212,.10); border-color:rgba(31,199,212,.24); }
.training-mode-badge.strength { color:#73adff; background:rgba(52,125,255,.11); border-color:rgba(52,125,255,.26); }
.training-mode-badge.cardio { color:var(--cardio); background:rgba(82,217,150,.10); border-color:rgba(82,217,150,.24); }
.training-mode-badge.hybrid { color:#b49bff; background:rgba(155,120,255,.10); border-color:rgba(155,120,255,.24); }
.routine-card,.history-row,.exercise-progress-item { background:#0d1620; border-color:#1e2e3e; }
.routine-card:hover,.exercise-progress-item:hover { border-color:#2b4259; }

/* Progress */
.progress-overview-hero,.progress-dashboard-hero { background:linear-gradient(145deg,#101b28,#0a121b); border-color:#22364a; }
.recent-progress-row,.recent-pr-row { background:#0c151f; border-color:#1d2d3d; }
.delta-positive,.progress-delta.positive,.progress-change.positive { color:var(--success)!important; }
.delta-negative,.progress-delta.negative,.progress-change.negative { color:var(--danger)!important; }
.exercise-mini-trend span,.bar { background:linear-gradient(180deg,#12c6db,#2f80ff); }

/* Profile */
.profile-page-head { display:flex; justify-content:space-between; align-items:center; gap:16px; margin:8px 2px 18px; }
.profile-page-head h2 { font-size:36px; letter-spacing:-.045em; }
.profile-avatar { width:50px; height:50px; display:grid; place-items:center; border-radius:50%; background:linear-gradient(145deg,#347dff,#126cc8); color:white; font-size:16px; font-weight:850; box-shadow:0 8px 28px rgba(47,128,255,.20); }
.profile-card { border-color:#25384c; }
.profile-card-head { align-items:center; }
.profile-actions-row { display:flex; gap:8px; flex-wrap:wrap; }
.theme-option { background:#0d1620; border-color:#203144; }
.theme-option.selected { border-color:#377fce; box-shadow:0 0 0 2px rgba(47,128,255,.12); }

/* Builder and full-page setup */
.sheet-card { border-color:#223347; background:#09111a; }
.field input,.field select,.voice-card select { background:#0e1823; border-color:#283b4f; }
.field input:focus { border-color:#3d8cff; box-shadow:0 0 0 3px rgba(47,128,255,.13); }
.exercise-editor { background:#0c151f; border-color:#1f3041; }
.equipment-option,.injury-option { background:#0d1721; border-color:#213346; }
.equipment-option.selected,.injury-option.selected { background:rgba(47,128,255,.08); border-color:#347dcc; }
.equipment-category-chip.active,.injury-category-chip.active { color:#71adff; border-color:#347dcc; background:rgba(47,128,255,.10); }

/* Active workout: restrained, high-contrast performance surface */
.workout-shell { background:
  radial-gradient(circle at 50% 28%,rgba(47,128,255,.09),transparent 34%),
  linear-gradient(180deg,#070b11,#05080d 68%); }
.workout-active-label,.phase-label { color:#69a9ff; }
.phase-label.rest { color:#21c6d8; }
.timer-digits { text-shadow:0 10px 50px rgba(0,0,0,.38); }
.progress-fill { background:linear-gradient(90deg,#2f80ff,#12c6db); }
.pause-btn { box-shadow:0 10px 28px rgba(47,128,255,.18); }
.workout-end-btn { box-shadow:none; }

@media (max-width:620px) {
  .main-content { padding-left:14px; padding-right:14px; }
  .training-area-grid { grid-template-columns:1fr; }
  .training-area-card { min-height:138px; }
  .home-feature { padding:18px; }
  .profile-page-head h2 { font-size:31px; }
}

/* Desktop gets a real application shell rather than a stretched phone panel. */
@media (min-width:1024px) {
  .app-shell { width:min(1320px,calc(100% - 40px)); padding-bottom:24px; }
  .topbar { padding-left:120px; padding-right:28px; min-height:82px; }
  .main-content { padding:18px 28px 44px 120px; }
  .bottom-nav {
    left:max(20px,calc(50% - 640px)); top:104px; bottom:auto; transform:none;
    width:82px; grid-template-columns:1fr; gap:8px; padding:8px;
    border:1px solid #1f2e3e; border-radius:22px; background:rgba(8,13,20,.88);
    box-shadow:0 18px 55px rgba(0,0,0,.20);
  }
  .nav-btn { min-height:66px; }
  .nav-btn svg { width:23px; height:23px; }
  .nav-btn small { font-size:10px; }
  .home-feature { padding:28px; }
  .home-action-grid { grid-template-columns:repeat(4,1fr); }
  .stats-grid { grid-template-columns:repeat(4,1fr); }
  .training-area-card { min-height:190px; }
  .sheet-dialog { width:min(980px,calc(100% - 40px)); }
  .sheet-card { max-height:92dvh; padding:24px; }
  .training-profile-dialog .training-profile-page { width:min(1180px,100%); }
}

@media (min-width:1420px) {
  .bottom-nav { left:calc(50% - 650px); }
}

.strength-cardio-glyph{font-size:12px!important;letter-spacing:-.04em;}

/* ==============================================================
   GritHQ alpha4.14 — mockup-aligned application shell
   This intentionally supersedes the inherited CaliTrack-era card shell.
   ============================================================== */
:root {
  --gh-bg:var(--bg);
  --gh-bg-2:var(--deep-bg);
  --gh-surface:var(--panel);
  --gh-surface-2:var(--panel-2);
  --gh-surface-3:var(--panel-3);
  --gh-line:var(--line);
  --gh-line-soft:rgba(var(--accent-rgb),.14);
  --gh-blue:var(--accent);
  --gh-cyan:var(--accent-2);
  --gh-green:var(--success);
  --gh-red:var(--danger);
  --gh-text:var(--text);
  --gh-soft:var(--text-soft);
  --gh-muted:var(--muted);
  --gh-shadow:0 28px 70px rgba(0,0,0,.36);
}
html, body { background:var(--gh-bg); }
body {
  margin:0;
  color:var(--gh-text);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text",Inter,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  background:
    radial-gradient(900px 520px at 75% -10%,rgba(45,125,255,.11),transparent 68%),
    radial-gradient(720px 500px at 10% 5%,rgba(25,199,223,.055),transparent 68%),
    var(--gh-bg);
}
* { scrollbar-color:#334a61 transparent; }
.app-shell { min-height:100dvh; max-width:none; margin:0; padding:0; background:transparent; }
.app-stage { min-width:0; min-height:100dvh; }
.main-content { padding:18px 18px 110px; max-width:1180px; width:100%; margin:0 auto; box-sizing:border-box; }
.view { animation:none; }
.view.active { animation:gh-fade .2s ease-out; }
@keyframes gh-fade { from{opacity:.55;transform:translateY(4px)} }

/* Brand */
.topbar {
  position:sticky; top:0; z-index:28;
  height:68px; box-sizing:border-box;
  padding:12px 18px;
  background:rgba(5,9,15,.84);
  backdrop-filter:blur(22px) saturate(1.2);
  -webkit-backdrop-filter:blur(22px) saturate(1.2);
  border-bottom:1px solid rgba(100,132,164,.12);
}
.brand-row { gap:10px; align-items:center; }
.brand-mark { width:38px; height:38px; border-radius:11px; padding:0; background:linear-gradient(150deg,#10253b,#07101a); border:1px solid #25435e; overflow:hidden; }
.brand-mark img { width:100%; height:100%; object-fit:cover; transform:scale(1.05); }
.brand-copy h1 { font-size:19px; letter-spacing:-.035em; line-height:1.1; }
.brand-copy p { margin:4px 0 0; color:#6f879e; font-size:8px; font-weight:800; letter-spacing:.2em; }
.topbar-actions { display:flex; gap:8px; align-items:center; }
.build-chip { border:1px solid #263d53; background:#0c1824; color:#7690aa; border-radius:99px; padding:5px 8px; font-size:10px; font-weight:800; }

/* desktop rail */
.desktop-rail { display:none; }

/* universal panels — remove old outlined-card feel */
.card,
.personalized-plan-card,
.home-quick-card,
.home-last-session,
.routine-card,
.exercise-progress-card,
.settings-card,
.profile-overview-card,
.compatibility-grid,
.app-update-card,
.data-actions,
.strength-foundation-card,
.standalone-exercise-library {
  background:linear-gradient(145deg,rgba(14,28,43,.94),rgba(8,17,27,.96));
  border:1px solid var(--gh-line-soft);
  box-shadow:none;
  border-radius:20px;
}
.section-title-row { margin:32px 2px 14px; }
.section-title-row h2,.section-title-row h3 { letter-spacing:-.035em; }
.eyebrow { color:#5d9eff !important; letter-spacing:.16em; font-size:10px; font-weight:900; text-transform:uppercase; }
.subtle { color:var(--gh-muted) !important; }

button.primary,
.primary {
  background:linear-gradient(135deg,var(--gh-blue),#2469e8 65%,#1d62e0);
  color:white;
  border:1px solid rgba(99,164,255,.42);
  box-shadow:0 10px 26px rgba(45,125,255,.18), inset 0 1px 0 rgba(255,255,255,.16);
}
button.primary:hover { filter:brightness(1.08); }
button.secondary,.secondary {
  background:#101d2b; color:#eaf1f8; border:1px solid #24394e;
}
button.ghost,.ghost { color:#94a8bc; background:rgba(13,25,37,.58); border:1px solid rgba(78,106,134,.28); }
input,select,textarea { background:#0a1520 !important; border-color:#20364b !important; color:#edf5fd !important; }
input:focus,select:focus,textarea:focus { border-color:#3c89ff !important; box-shadow:0 0 0 3px rgba(45,125,255,.12); }
.pill,.status-chip { background:#102235; border-color:#213e59; color:#9db4cb; }
.status-chip.ready { background:rgba(36,207,128,.09); border-color:rgba(36,207,128,.3); color:#44db96; }

/* Home dashboard */
.gh-page-head { display:flex; justify-content:space-between; align-items:flex-end; gap:18px; margin:8px 2px 18px; }
.gh-page-head h1 { margin:2px 0 0; font-size:clamp(28px,4vw,42px); letter-spacing:-.055em; line-height:1; }
.gh-page-head > span { color:#657d94; font-size:12px; font-weight:700; }
.gh-home-hero-grid { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(245px,.7fr); gap:14px; }
.gh-today-card,.gh-week-card { min-height:236px; border-radius:24px; border:1px solid #1c3348; overflow:hidden; position:relative; box-sizing:border-box; }
.gh-glow-card {
  padding:24px;
  background:
    linear-gradient(90deg,rgba(4,12,20,.95) 0%,rgba(7,19,31,.88) 52%,rgba(7,20,34,.66) 100%),
    radial-gradient(circle at 80% 35%,rgba(45,125,255,.25),transparent 34%),
    linear-gradient(140deg,#0a1a29,#08121d);
  box-shadow:var(--gh-shadow);
}
.gh-glow-card:after { content:""; position:absolute; width:260px; height:260px; border-radius:50%; right:-80px; bottom:-120px; background:radial-gradient(circle,rgba(25,199,223,.18),transparent 66%); }
.gh-card-kicker { position:relative; z-index:1; display:flex; justify-content:space-between; color:#7e94a9; font-size:11px; font-weight:700; }
.gh-card-kicker > span { color:#63a3ff; }
.gh-today-copy { position:relative; z-index:1; max-width:610px; margin-top:38px; }
.gh-today-copy h2 { margin:5px 0 8px; font-size:clamp(30px,5vw,50px); letter-spacing:-.06em; line-height:.98; }
.gh-today-copy p:last-child { color:#91a3b5; font-size:13px; }
.gh-today-actions { position:relative; z-index:1; margin-top:24px; display:flex; gap:10px; align-items:center; }
.gh-start-btn { min-width:180px; }
.gh-text-action { background:transparent; border:0; color:#83a1bd; padding:10px 12px; }
.gh-week-card { padding:20px; background:linear-gradient(160deg,#0f1d2a,#09131e); }
.gh-week-head { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.gh-week-head h3 { margin:4px 0 0; font-size:17px; letter-spacing:-.035em; }
.gh-score { display:grid; place-items:center; width:42px; height:42px; border-radius:14px; background:linear-gradient(135deg,#174f9d,#1679d5); color:white; font-size:18px; font-weight:900; }
.gh-week-metrics { margin-top:26px; display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.gh-week-metrics div { display:grid; gap:3px; }
.gh-week-metrics strong { font-size:22px; letter-spacing:-.05em; }
.gh-week-metrics span { color:#71879d; font-size:9px; text-transform:uppercase; letter-spacing:.08em; }
.gh-spark-bars { height:48px; margin-top:18px; display:flex; align-items:end; gap:5px; }
.gh-spark-bars i { flex:1; border-radius:4px 4px 1px 1px; background:linear-gradient(180deg,#19c7df,#2d7dff); opacity:.82; }
.gh-spark-bars i:nth-child(1){height:22%}.gh-spark-bars i:nth-child(2){height:45%}.gh-spark-bars i:nth-child(3){height:32%}.gh-spark-bars i:nth-child(4){height:70%}.gh-spark-bars i:nth-child(5){height:54%}.gh-spark-bars i:nth-child(6){height:92%}.gh-spark-bars i:nth-child(7){height:66%}

.gh-section-head { margin:30px 2px 12px; }
.gh-section-head h2 { margin:4px 0; font-size:24px; letter-spacing:-.045em; }
.gh-section-head p { margin:0; }
.gh-mode-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.gh-mode-card { border:1px solid #1b3145; background:linear-gradient(145deg,#0e1b29,#09131e); border-radius:18px; min-height:116px; padding:16px; text-align:left; color:var(--gh-text); display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:13px; transition:.18s ease; }
.gh-mode-card:hover { transform:translateY(-2px); border-color:#32516d; background:linear-gradient(145deg,#112337,#0a1623); }
.gh-mode-icon { width:42px;height:42px;border-radius:13px;display:grid;place-items:center;font-size:19px;font-weight:900;border:1px solid rgba(255,255,255,.08); }
.gh-mode-card.calisthenics .gh-mode-icon { color:#20d3e6;background:rgba(25,199,223,.08);border-color:rgba(25,199,223,.2); }
.gh-mode-card.strength .gh-mode-icon { color:#65a4ff;background:rgba(45,125,255,.09);border-color:rgba(45,125,255,.2); }
.gh-mode-card.cardio .gh-mode-icon { color:#3bdc91;background:rgba(36,207,128,.08);border-color:rgba(36,207,128,.2); }
.gh-mode-card strong { display:block; font-size:16px; letter-spacing:-.025em; }
.gh-mode-card small { display:block; color:#71869b; font-size:11px; margin-top:4px; }
.gh-mode-card b { align-self:end; color:#516b83; font-size:10px; }

.gh-dashboard-grid { margin-top:16px; display:grid; grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr); gap:14px; align-items:start; }
.gh-dashboard-main,.gh-dashboard-side { display:grid; gap:14px; }
.gh-dashboard-grid .section { margin:0; }
.personalized-plan-card { padding:20px !important; }
.personalized-plan-head h3 { font-size:23px; letter-spacing:-.045em; margin:4px 0; }
.suggestion-mode-switch { padding:4px; border:1px solid #1f3448; background:#08121c; border-radius:14px; gap:3px; }
.suggestion-mode-btn { border:0 !important; border-radius:10px !important; background:transparent !important; color:#6f8498 !important; min-height:38px; }
.suggestion-mode-btn.active { background:#112a44 !important; color:#83b4ff !important; box-shadow:inset 0 0 0 1px rgba(70,137,227,.28); }
.suggested-exercise-list { gap:6px; }
.suggested-exercise-list span { background:#0a1723; border:1px solid #1f364a; color:#c6d4e2; }
.personalized-plan-actions { gap:7px; }
.personalized-plan-actions button { min-height:44px; }
.home-quick-card { padding:18px !important; }
.home-quick-head h3 { margin-top:4px; font-size:20px; }
.quick-timer-grid { gap:8px; }
.quick-input-wrap { background:#08131e; border:1px solid #1d3449; border-radius:12px; }
.quick-start-row { align-items:center; }
.quick-start-btn { background:#102a43 !important; border-color:#214a6b !important; color:#9dccff !important; }
.home-last-session { padding:18px !important; }

/* Train */
.workout-library-title h2 { font-size:34px; }
.workout-area-switch,.strength-cardio-tabs,.progress-area-tabs { background:#07111b; border:1px solid #1d3043; padding:4px; border-radius:15px; }
.workout-area-btn,.strength-cardio-tab,.progress-area-tab { background:transparent !important; border:0 !important; color:#70859a !important; border-radius:11px !important; }
.workout-area-btn.active,.strength-cardio-tab.active,.progress-area-tab.active { background:#102b48 !important; color:#8ebcff !important; box-shadow:inset 0 0 0 1px rgba(71,137,224,.3); }
.training-mode-intro { border:0; border-radius:22px; background:linear-gradient(145deg,#0e1c2b,#09141f); padding:22px; }
.routine-card { border-color:#1b3044 !important; padding:16px !important; }
.routine-card:hover { border-color:#2c4d69 !important; }

/* Progress */
.progress-hero { background:linear-gradient(140deg,#0d1c2b,#08131e) !important; border:1px solid #1e3549 !important; }
.stat-grid { gap:10px; }
.stat-card,.exercise-best-grid > div,.insight-grid > div,.comparison-metric,.health-data-card { background:#0a1722 !important; border-color:#1b3145 !important; }
.progress-change.up,.delta.up { color:var(--gh-green) !important; }
.progress-change.down,.delta.down { color:var(--gh-red) !important; }
.chart-bars .bar-fill,.bar-fill,.milestone-track span { background:linear-gradient(180deg,var(--gh-cyan),var(--gh-blue)) !important; }

/* Profile */
.profile-overview-card { background:linear-gradient(145deg,#0f2132,#09131d) !important; padding:20px !important; }
.profile-overview-card h2 { font-size:28px; }
.theme-options { opacity:.86; }

/* Mobile nav: floating dark dock like approved mockup */
.bottom-nav { position:fixed; left:10px; right:10px; bottom:calc(9px + env(safe-area-inset-bottom)); width:auto; height:66px; padding:6px; border-radius:20px; border:1px solid #1d3144; background:rgba(7,14,22,.94); box-shadow:0 18px 50px rgba(0,0,0,.48); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px); }
.bottom-nav .nav-btn { border-radius:14px; color:#62788d; background:transparent; }
.bottom-nav .nav-btn.active { color:#6fb0ff; background:linear-gradient(160deg,#102a43,#0c2033); }
.bottom-nav .nav-btn svg { stroke:currentColor; fill:none; }
.bottom-nav .nav-btn small { font-size:9px; font-weight:700; }

/* Active training screen — cleaner, blue performance look */
.workout-shell { background:
 radial-gradient(circle at 50% 22%,rgba(45,125,255,.18),transparent 30%),
 linear-gradient(180deg,#07101a,#04070b 62%); }
.phase-label { color:#69aaff; }
.phase-label.rest { color:#28d1df; }
.timer-digits { text-shadow:0 0 38px rgba(45,125,255,.08); }
.progress-fill { background:linear-gradient(90deg,#2d7dff,#19c7df); }
.pause-btn { background:linear-gradient(135deg,#2d7dff,#2469e8) !important; border-color:#4f91ff !important; }

/* Sheet/dialogs */
dialog::backdrop { background:rgba(1,4,8,.78); backdrop-filter:blur(9px); }
.sheet-card,.confirm-card { background:#09131d !important; border-color:#1d3448 !important; }

@media (min-width:900px) {
  .app-shell { display:grid; grid-template-columns:205px minmax(0,1fr); }
  .desktop-rail { display:flex; position:sticky; top:0; height:100dvh; box-sizing:border-box; flex-direction:column; padding:18px 13px; border-right:1px solid rgba(83,112,140,.14); background:linear-gradient(180deg,#07111b,#050a10 72%); z-index:30; }
  .rail-brand { display:flex; gap:9px; align-items:center; padding:5px 7px 24px; }
  .rail-mark { width:35px; height:35px; border-radius:11px; overflow:hidden; border:1px solid #29445e; background:#0d1b29; }
  .rail-mark img { width:100%; height:100%; object-fit:cover; }
  .rail-brand strong { display:block; font-size:15px; letter-spacing:-.03em; }
  .rail-brand small { display:block; margin-top:3px; color:#55718c; font-size:6.5px; letter-spacing:.12em; }
  .rail-nav { display:grid; gap:5px; }
  .rail-nav .nav-btn { min-height:43px; border:0; border-radius:12px; padding:0 11px; display:flex; align-items:center; gap:10px; background:transparent; color:#70869a; font-weight:700; text-align:left; }
  .rail-nav .nav-btn.active { background:linear-gradient(90deg,#102b48,#0b1c2d); color:#87b8ff; box-shadow:inset 2px 0 0 #2d7dff; }
  .rail-icon { width:20px; text-align:center; font-size:16px; color:inherit; }
  .rail-footer { margin-top:auto; padding:12px 7px; display:flex; align-items:center; gap:9px; border-top:1px solid rgba(82,111,140,.13); }
  .rail-avatar { width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#2d7dff,#16a7d9);font-size:10px;font-weight:900;color:white; }
  .rail-footer strong { display:block; font-size:11px; }
  .rail-footer small { color:#5f768c; font-size:8px; }
  .topbar { display:none; }
  .main-content { max-width:1280px; padding:30px 30px 60px; }
  .bottom-nav { display:none !important; }
  .workout-view.active { left:205px; }
}

@media (max-width:899px) {
  .desktop-rail { display:none; }
  .gh-home-hero-grid { grid-template-columns:1fr; }
  .gh-week-card { min-height:auto; }
  .gh-dashboard-grid { grid-template-columns:1fr; }
}

@media (max-width:640px) {
  .main-content { padding:14px 13px 102px; }
  .topbar { height:62px; padding:10px 13px; }
  .brand-mark { width:35px;height:35px; }
  .brand-copy h1 { font-size:17px; }
  .build-chip { display:none; }
  .gh-page-head { margin-top:4px; }
  .gh-page-head h1 { font-size:30px; }
  .gh-page-head > span { display:none; }
  .gh-glow-card { padding:20px; min-height:216px; }
  .gh-today-copy { margin-top:28px; }
  .gh-today-copy h2 { font-size:34px; }
  .gh-week-metrics strong { font-size:19px; }
  .gh-mode-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
  .gh-mode-card { min-height:108px; padding:12px 8px; grid-template-columns:1fr; gap:5px; text-align:center; justify-items:center; }
  .gh-mode-icon { width:38px;height:38px; }
  .gh-mode-card strong { font-size:13px; }
  .gh-mode-card small { font-size:8px; }
  .gh-mode-card b { display:none; }
  .personalized-plan-card { padding:16px !important; }
  .personalized-plan-head { align-items:flex-start; }
  .personalized-plan-head h3 { font-size:21px; }
  .suggestion-mode-switch { grid-template-columns:repeat(2,1fr); }
  .personalized-plan-actions { grid-template-columns:1fr 1fr; }
  .personalized-plan-actions .primary { grid-column:1/-1; }
  .home-quick-card { padding:16px !important; }
}

@media (max-width:430px) {
  .gh-week-metrics { gap:4px; }
  .gh-today-actions { flex-wrap:wrap; }
  .gh-start-btn { width:100%; }
  .gh-text-action { width:100%; }
}
@media (min-width:900px) {
  body.workout-mode .desktop-rail { display:none; }
  body.workout-mode .workout-view.active { left:0; }
}
.profile-page-head { display:flex; justify-content:space-between; align-items:center; gap:16px; margin:4px 2px 20px; }
.profile-page-head h2 { margin:3px 0 4px; font-size:clamp(30px,4vw,42px); letter-spacing:-.055em; }
.profile-avatar { width:52px;height:52px;border-radius:17px;display:grid;place-items:center;background:linear-gradient(135deg,#2d7dff,#117fd4);color:white;font-weight:900;box-shadow:0 12px 28px rgba(45,125,255,.18); }
.profile-card { padding:18px !important; }
.profile-card-head { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; }
.training-profile-summary { margin-top:14px; padding:14px; border-radius:14px; background:#091622; border:1px solid #1b3348; display:grid; gap:4px; }
.profile-actions-row { margin-top:12px; display:flex; gap:8px; flex-wrap:wrap; }
.settings-group { display:grid; gap:10px; }
.settings-group > .card { margin:0; }
.theme-grid { margin-bottom:22px; }
.theme-option { background:#091621 !important; border-color:#1b3145 !important; }
.theme-option.selected { border-color:#387fd0 !important; box-shadow:inset 0 0 0 1px rgba(45,125,255,.26); }
.data-actions { gap:8px; padding:12px !important; }
.app-build-info { text-align:center; margin:18px 0 0; }


/* ==============================================================
   GritHQ alpha4.14 — state hygiene + authoritative Appearance themes
   All visual shell surfaces now inherit the selected theme variables.
   ============================================================== */
body {
  color:var(--text);
  background:
    radial-gradient(900px 520px at 75% -10%,rgba(var(--accent-rgb),.14),transparent 68%),
    radial-gradient(720px 500px at 10% 5%,rgba(var(--accent-2-rgb),.08),transparent 68%),
    var(--bg) !important;
}
.topbar { background:rgba(var(--bg-rgb),.86) !important; border-bottom-color:var(--line) !important; }
.brand-mark,.rail-mark { background:linear-gradient(150deg,var(--panel-2),var(--deep-bg)) !important; border-color:var(--line-strong) !important; }
.brand-copy p,.gh-page-head>span,.gh-card-kicker,.gh-mode-card small,.gh-mode-card b { color:var(--muted) !important; }
.build-chip { border-color:var(--line) !important; background:var(--pill-bg) !important; color:var(--pill-text) !important; }
.card,.personalized-plan-card,.home-quick-card,.home-last-session,.routine-card,.exercise-progress-card,.settings-card,.profile-overview-card,.compatibility-grid,.app-update-card,.data-actions,.strength-foundation-card,.standalone-exercise-library {
  background:linear-gradient(145deg,var(--panel-2),var(--panel)) !important;
  border-color:var(--line) !important;
}
.eyebrow { color:var(--accent) !important; }
.subtle { color:var(--muted) !important; }
button.primary,.primary { background:linear-gradient(135deg,var(--accent),var(--accent-2)) !important; color:var(--accent-contrast) !important; border-color:rgba(var(--accent-rgb),.44) !important; box-shadow:0 10px 26px rgba(var(--accent-rgb),.18),inset 0 1px 0 rgba(255,255,255,.13) !important; }
button.secondary,.secondary { background:var(--panel-2) !important; color:var(--text) !important; border-color:var(--line) !important; }
button.ghost,.ghost { background:rgba(var(--accent-rgb),.025) !important; color:var(--text-soft) !important; border-color:var(--line) !important; }
input,select,textarea { background:var(--input-bg) !important; border-color:var(--line) !important; color:var(--text) !important; }
input:focus,select:focus,textarea:focus { border-color:var(--accent) !important; box-shadow:0 0 0 3px rgba(var(--accent-rgb),.13) !important; }
.pill,.status-chip { background:var(--pill-bg) !important; border-color:var(--line) !important; color:var(--pill-text) !important; }
.gh-today-card,.gh-week-card { border-color:var(--line) !important; }
.gh-glow-card {
  background:
    linear-gradient(90deg,rgba(var(--bg-rgb),.96) 0%,rgba(var(--bg-rgb),.80) 58%,rgba(var(--bg-rgb),.58) 100%),
    radial-gradient(circle at 80% 35%,rgba(var(--accent-rgb),.28),transparent 35%),
    linear-gradient(140deg,var(--panel-2),var(--panel)) !important;
}
.gh-glow-card:after { background:radial-gradient(circle,rgba(var(--accent-2-rgb),.20),transparent 66%) !important; }
.gh-week-card,.gh-mode-card,.home-quick-card,.home-last-session,.personalized-plan-card { background:linear-gradient(145deg,var(--panel-2),var(--panel)) !important; }
.gh-score,.home-exercise-number,.gh-duration-badge { color:var(--accent) !important; background:rgba(var(--accent-rgb),.12) !important; border-color:rgba(var(--accent-rgb),.28) !important; }
.gh-spark-bars i,.chart-bars .bar-fill,.bar-fill,.milestone-track span,.progress-fill { background:linear-gradient(180deg,var(--accent-2),var(--accent)) !important; }
.suggestion-mode-switch,.workout-area-switch,.strength-cardio-tabs,.progress-area-tabs { background:var(--deep-bg) !important; border-color:var(--line) !important; }
.suggestion-mode-btn.active,.workout-area-btn.active,.strength-cardio-tab.active,.progress-area-tab.active { background:rgba(var(--accent-rgb),.15) !important; color:var(--accent) !important; box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.30) !important; }
.quick-input-wrap,.training-profile-summary,.stat-card,.exercise-best-grid>div,.insight-grid>div,.comparison-metric,.health-data-card { background:var(--input-bg) !important; border-color:var(--line) !important; }
.quick-start-btn { background:rgba(var(--accent-rgb),.13) !important; border-color:rgba(var(--accent-rgb),.28) !important; color:var(--accent) !important; }
.profile-avatar,.rail-avatar { background:linear-gradient(135deg,var(--accent),var(--accent-2)) !important; color:var(--accent-contrast) !important; box-shadow:0 12px 28px rgba(var(--accent-rgb),.18) !important; }
.theme-option { background:var(--panel) !important; border-color:var(--line) !important; }
.theme-option.selected { border-color:var(--accent) !important; box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.30) !important; }
.bottom-nav { background:rgba(var(--nav-rgb),.95) !important; border-color:var(--line) !important; }
.bottom-nav .nav-btn { color:var(--muted) !important; }
.bottom-nav .nav-btn.active { color:var(--accent) !important; background:rgba(var(--accent-rgb),.13) !important; }
.desktop-rail { background:linear-gradient(180deg,var(--panel),var(--deep-bg) 76%) !important; border-right-color:var(--line) !important; }
.rail-nav .nav-btn { color:var(--muted) !important; }
.rail-nav .nav-btn.active { background:rgba(var(--accent-rgb),.14) !important; color:var(--accent) !important; box-shadow:inset 2px 0 0 var(--accent) !important; }
.workout-shell { background:radial-gradient(circle at 50% 22%,rgba(var(--accent-rgb),.20),transparent 30%),linear-gradient(180deg,var(--workout-bg),var(--deep-bg) 62%) !important; }
.phase-label { color:var(--accent) !important; }
.phase-label.rest { color:var(--accent-2) !important; }
.pause-btn { background:linear-gradient(135deg,var(--accent),var(--accent-2)) !important; border-color:rgba(var(--accent-rgb),.45) !important; color:var(--accent-contrast) !important; }
.sheet-card,.confirm-card { background:var(--sheet-bg) !important; border-color:var(--line) !important; }
.gh-clear-today { color:var(--muted) !important; }
.gh-clear-today:hover { color:var(--danger) !important; }
.routine-editor-actions { display:flex; justify-content:space-between; gap:10px; }
.routine-editor-actions .primary { margin-left:auto; }
@media(max-width:640px){.routine-editor-actions{display:grid;grid-template-columns:1fr}.routine-editor-actions .primary{margin-left:0}.gh-today-actions .gh-clear-today{width:auto}}


/* ==============================================================
   GritHQ alpha4.15 — mobile dock + skippable profile setup hardening
   ============================================================== */
@media (max-width:899px) {
  .app-shell {
    width:100%;
    max-width:100%;
    padding-bottom:calc(112px + env(safe-area-inset-bottom));
  }
  .main-content {
    padding-bottom:calc(122px + env(safe-area-inset-bottom));
  }
  .bottom-nav {
    position:fixed !important;
    left:max(10px, env(safe-area-inset-left)) !important;
    right:max(10px, env(safe-area-inset-right)) !important;
    bottom:calc(9px + env(safe-area-inset-bottom)) !important;
    top:auto !important;
    transform:none !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    height:auto !important;
    min-height:66px;
    margin:0 !important;
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:2px;
    padding:6px !important;
    box-sizing:border-box;
    overflow:hidden;
    border-radius:20px;
  }
  .bottom-nav .nav-btn {
    min-width:0;
    width:100%;
    min-height:52px;
    padding:5px 2px;
    touch-action:manipulation;
  }
  .bottom-nav .nav-btn svg { width:20px; height:20px; }
  .bottom-nav .nav-btn small {
    display:block;
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:9px;
  }
}

@media (max-width:899px) and (orientation:landscape) {
  .bottom-nav {
    left:max(12px, env(safe-area-inset-left)) !important;
    right:max(12px, env(safe-area-inset-right)) !important;
    bottom:calc(6px + env(safe-area-inset-bottom)) !important;
    min-height:58px;
  }
  .bottom-nav .nav-btn { min-height:46px; }
  .main-content { padding-bottom:calc(102px + env(safe-area-inset-bottom)); }
}

.profile-close-btn { white-space:nowrap; }
@media (max-width:640px) {
  .training-profile-page-head { align-items:flex-start; gap:12px; }
  .training-profile-page-head .profile-close-btn {
    min-height:40px;
    padding:0 12px;
    flex:0 0 auto;
  }
}

/* ==============================================================
   GritHQ alpha4.15 — mobile navigation + skippable profile setup
   ============================================================== */
@media (max-width:899px) {
  .bottom-nav {
    left:max(10px, env(safe-area-inset-left)) !important;
    right:max(10px, env(safe-area-inset-right)) !important;
    bottom:max(10px, env(safe-area-inset-bottom)) !important;
    width:auto !important;
    max-width:none !important;
    transform:none !important;
    box-sizing:border-box !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    height:66px;
    padding:6px !important;
    overflow:hidden;
  }
  .bottom-nav .nav-btn {
    width:100%; min-width:0; max-width:none;
    padding:5px 2px; box-sizing:border-box;
  }
  .bottom-nav .nav-btn svg { width:20px; height:20px; flex:0 0 auto; }
  .bottom-nav .nav-btn small { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .main-content { padding-bottom:calc(100px + env(safe-area-inset-bottom)) !important; }
}
@media (max-width:390px) {
  .bottom-nav { left:max(6px,env(safe-area-inset-left)) !important; right:max(6px,env(safe-area-inset-right)) !important; }
  .bottom-nav .nav-btn small { font-size:8.5px !important; }
}


/* === Alpha4.16 mockup-fidelity final layer === */
:root{--gh-radius:16px;--gh-stroke:color-mix(in srgb,var(--accent) 14%,#263a4d);--gh-stroke-soft:rgba(100,140,175,.13)}
body{background:radial-gradient(circle at 48% -12%,rgba(var(--accent-rgb),.09),transparent 34%),var(--bg)!important}
.app-stage{min-width:0}.main-content{width:100%;box-sizing:border-box}
.mobile-appbar{border-bottom:1px solid var(--gh-stroke-soft)!important;background:rgba(var(--nav-rgb),.9)!important;backdrop-filter:blur(24px)!important;-webkit-backdrop-filter:blur(24px)!important}
.appbar-icon,.mobile-avatar{display:none}.desktop-rail .nav-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.gh-mode-icon svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.gh-mode-card{box-shadow:none!important;border-color:var(--gh-stroke)!important;background:linear-gradient(155deg,color-mix(in srgb,var(--panel-2) 94%,var(--accent) 6%),var(--panel))!important}
.gh-mode-card:hover{box-shadow:0 14px 34px rgba(0,0,0,.2)!important}.gh-mode-card strong{letter-spacing:-.03em}
.exercise-search-caption{color:var(--muted)}.exercise-suggestion-row{border-color:var(--gh-stroke-soft)!important}.exercise-suggestion-main small{color:var(--muted)}
.exercise-search-tip{border:1px solid var(--gh-stroke-soft);background:rgba(var(--accent-rgb),.045);border-radius:11px;padding:10px}

@media(max-width:959px){
  body{font-size:15px}.app-shell{display:block!important}.desktop-rail{display:none!important}.app-stage{min-height:100dvh}
  .mobile-appbar{display:grid!important;grid-template-columns:38px 1fr auto;align-items:center;min-height:58px;padding:calc(7px + env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) 7px max(10px,env(safe-area-inset-left))!important;gap:7px;position:sticky;top:0;z-index:40}
  .appbar-icon,.mobile-avatar{display:grid;place-items:center;border:0;background:transparent;color:var(--text)}.appbar-icon{width:36px;height:36px;border-radius:10px}.appbar-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}.mobile-avatar{width:31px;height:31px;border-radius:50%;background:linear-gradient(145deg,var(--accent),var(--accent-2));font-size:9px;font-weight:850;color:#fff;box-shadow:0 4px 16px rgba(var(--accent-rgb),.25)}
  .mobile-brand-row{justify-self:center;gap:6px}.mobile-brand-row .brand-mark{width:27px;height:27px;border:0;background:transparent;box-shadow:none}.mobile-brand-row .brand-copy h1{font-size:14px!important;line-height:1}.mobile-brand-row .brand-copy p{font-size:5.7px!important;letter-spacing:.14em;margin-top:3px}.topbar-actions{gap:6px}.build-chip{display:none!important}
  .main-content{padding:13px max(14px,env(safe-area-inset-right)) calc(88px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))!important;max-width:none!important}
  .gh-page-head{margin:1px 1px 12px!important}.gh-page-head .eyebrow{font-size:7px!important}.gh-page-head h1{font-size:27px!important;letter-spacing:-.055em!important}.gh-page-head>span{display:none!important}
  .gh-home-hero-grid{grid-template-columns:1fr!important;gap:9px!important}.gh-week-card{display:none!important}.gh-today-card{min-height:176px!important;border-radius:16px!important;padding:16px!important}.gh-today-copy{margin-top:25px!important}.gh-today-copy h2{font-size:30px!important}.gh-today-copy p{font-size:10px!important}.gh-today-actions{gap:8px!important}.gh-start-btn{min-height:46px!important;border-radius:11px!important}.gh-text-action{font-size:10px!important}
  .gh-training-head{margin:15px 2px 8px!important}.gh-training-head h2{font-size:18px!important}.gh-training-head .subtle{font-size:9px!important;line-height:1.45}.gh-mode-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important}.gh-mode-card{min-height:106px!important;padding:10px 7px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:6px!important;text-align:center!important;border-radius:14px!important}.gh-mode-icon{width:39px!important;height:39px!important;border-radius:12px!important;display:grid!important;place-items:center!important}.gh-mode-icon svg{width:23px;height:23px}.gh-mode-card strong{font-size:11px!important}.gh-mode-card small{font-size:7px!important;line-height:1.3!important}.gh-mode-card b{font-size:7px!important;color:var(--muted)!important}
  .gh-dashboard-grid{display:flex!important;flex-direction:column!important;gap:9px!important;margin-top:9px!important}.personalized-plan-card,.home-quick-card,.home-last-session{border-radius:15px!important;padding:13px!important}.personalized-plan-card h2,.home-quick-card h3{font-size:18px!important}.personalized-plan-card .subtle,.home-quick-card .subtle{font-size:9px!important;line-height:1.45}.suggestion-mode-tabs{border-radius:10px!important;padding:3px!important}.suggestion-mode-btn{min-height:36px!important;font-size:9px!important}.suggestion-exercise-pills{gap:5px!important}.suggestion-exercise-pills .pill{font-size:8px!important;padding:6px 8px!important}.personalized-plan-actions{gap:6px!important}.personalized-plan-actions button{min-height:38px!important;padding:0 10px!important;font-size:9px!important;border-radius:9px!important}
  .bottom-nav{left:max(8px,env(safe-area-inset-left))!important;right:max(8px,env(safe-area-inset-right))!important;bottom:calc(7px + env(safe-area-inset-bottom))!important;width:auto!important;height:62px!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;padding:5px!important;border-radius:18px!important;background:rgba(var(--nav-rgb),.94)!important;border:1px solid var(--gh-stroke)!important;transform:none!important;box-shadow:0 16px 44px rgba(0,0,0,.42)!important}.bottom-nav .nav-btn{min-width:0!important;min-height:50px!important;border-radius:13px!important;padding:4px 2px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;gap:2px!important}.bottom-nav .nav-btn svg{width:19px!important;height:19px!important}.bottom-nav .nav-btn small{font-size:7.5px!important;font-weight:700!important}.bottom-nav .nav-btn.active{background:rgba(var(--accent-rgb),.14)!important;color:var(--accent)!important}
  .sheet-dialog{padding:0!important}.sheet-card{width:100vw!important;max-width:none!important;max-height:100dvh!important;border-radius:0!important;border-left:0!important;border-right:0!important;padding:calc(14px + env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) calc(18px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))!important}.exercise-editor{border-radius:14px!important;padding:12px!important}.sheet-head h2{font-size:25px!important}.sheet-actions{position:sticky!important;bottom:0;background:linear-gradient(180deg,transparent,var(--panel) 25%);padding-top:12px;z-index:4}
}
@media(max-width:959px) and (orientation:landscape) and (max-height:540px){.mobile-appbar{min-height:46px!important;padding-top:calc(4px + env(safe-area-inset-top))!important;padding-bottom:4px!important}.main-content{padding-top:8px!important;padding-bottom:calc(63px + env(safe-area-inset-bottom))!important}.gh-page-head{display:none!important}.gh-home-hero-grid{grid-template-columns:minmax(0,1.7fr) minmax(180px,.7fr)!important}.gh-week-card{display:block!important;min-height:150px!important}.gh-training-head{display:none!important}.gh-mode-card{min-height:64px!important;flex-direction:row!important;text-align:left!important;justify-content:flex-start!important}.gh-mode-card small,.gh-mode-card b{display:none!important}.bottom-nav{height:52px!important}.bottom-nav .nav-btn{min-height:42px!important}.bottom-nav .nav-btn small{font-size:7px!important}}
@media(min-width:960px){
  .app-shell{display:grid!important;grid-template-columns:188px minmax(0,1fr)!important}.desktop-rail{display:flex!important;width:auto!important;padding:17px 12px!important;background:linear-gradient(180deg,var(--panel),var(--deep-bg) 74%)!important;border-right:1px solid var(--gh-stroke-soft)!important}.desktop-rail .rail-brand{padding:3px 5px 20px!important}.rail-brand strong{font-size:13px!important}.rail-brand small{font-size:5.5px!important;letter-spacing:.13em!important}.rail-nav{gap:3px!important}.rail-nav .nav-btn{min-height:38px!important;border-radius:8px!important;padding:0 9px!important;display:flex!important;align-items:center!important;gap:9px!important;background:transparent!important;color:var(--muted)!important;font-size:10px!important;font-weight:650!important}.rail-nav .nav-btn.active{background:rgba(var(--accent-rgb),.15)!important;color:var(--text)!important}.rail-nav .nav-btn svg{width:16px!important;height:16px!important}.topbar{display:none!important}.bottom-nav{display:none!important}.main-content{max-width:1260px!important;padding:25px 28px 50px!important}.gh-page-head h1{font-size:34px!important}.gh-home-hero-grid{grid-template-columns:minmax(0,1.65fr) minmax(250px,.65fr)!important;gap:12px!important}.gh-today-card,.gh-week-card{min-height:205px!important;border-radius:13px!important}.gh-training-head{margin-top:20px!important}.gh-mode-grid{grid-template-columns:repeat(3,1fr)!important;gap:10px!important}.gh-mode-card{min-height:98px!important;border-radius:12px!important;padding:12px!important}.gh-mode-icon{width:40px!important;height:40px!important;border-radius:11px!important}.gh-dashboard-grid{grid-template-columns:minmax(0,1.45fr) minmax(280px,.72fr)!important;gap:12px!important}.personalized-plan-card,.home-quick-card,.home-last-session{border-radius:12px!important}.workout-library-title h2,.profile-page-head h2{font-size:32px!important}.routine-card,.history-row,.exercise-progress-card{border-radius:12px!important}
}

/* Alpha4.17: Alex cardio voice coverage + catalog voice routing fix. */


/* ==============================================================
   GritHQ alpha4.18 — responsive fidelity + Train layout hardening
   Final override layer. Keeps the proven workout/data engine intact.
   ============================================================== */

html, body { max-width:100%; overflow-x:hidden; }
body { min-width:0; }
.app-shell, .app-stage, .main-content, .view, .view > *, .section-title-row > *, .routine-card > *, .card > * {
  min-width:0;
  box-sizing:border-box;
}
.main-content { margin-inline:auto; }
.section-title-row { align-items:flex-end; flex-wrap:wrap; gap:12px; }

/* Primary navigation: closer to the approved mockup proportions. */
.desktop-rail .rail-brand { align-items:center; gap:9px; }
.desktop-rail .rail-mark { width:34px; height:34px; border-radius:10px; flex:0 0 auto; }
.desktop-rail .rail-brand strong { letter-spacing:-.02em; }
.desktop-rail .rail-nav { display:grid; }
.desktop-rail .rail-nav .nav-btn svg {
  width:19px !important;
  height:19px !important;
  stroke-width:1.8 !important;
}
.desktop-rail .rail-nav .nav-btn span { line-height:1; }
.desktop-rail .rail-footer { margin-top:auto; }

/* Train page: three explicit lanes instead of the old two giant switch panes. */
.workout-mode-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin:16px 0 10px;
}
.workout-mode-card {
  position:relative;
  min-width:0;
  min-height:148px;
  padding:18px;
  border:1px solid var(--gh-stroke);
  border-radius:16px;
  background:
    radial-gradient(circle at 92% 8%,rgba(var(--accent-rgb),.10),transparent 38%),
    linear-gradient(145deg,var(--panel-2),var(--panel));
  color:var(--text);
  text-align:left;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  grid-template-rows:auto 1fr auto;
  gap:10px 13px;
  align-items:start;
  overflow:hidden;
  transition:transform .15s ease,border-color .15s ease,background .15s ease,box-shadow .15s ease;
}
.workout-mode-card:hover { transform:translateY(-2px); border-color:var(--line-strong); }
.workout-mode-card.active {
  border-color:rgba(var(--accent-rgb),.72);
  box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.18),0 16px 34px rgba(0,0,0,.18);
}
.workout-mode-card.calisthenics.active {
  background:radial-gradient(circle at 88% 15%,rgba(18,198,219,.16),transparent 42%),linear-gradient(145deg,var(--panel-2),var(--panel));
}
.workout-mode-card.strength.active {
  background:radial-gradient(circle at 88% 15%,rgba(47,128,255,.18),transparent 42%),linear-gradient(145deg,var(--panel-2),var(--panel));
}
.workout-mode-card.cardio.active {
  background:radial-gradient(circle at 88% 15%,rgba(69,207,137,.15),transparent 42%),linear-gradient(145deg,var(--panel-2),var(--panel));
}
.workout-mode-icon {
  width:46px;
  height:46px;
  border-radius:13px;
  display:grid;
  place-items:center;
  grid-row:1 / span 2;
  border:1px solid var(--line);
  background:var(--deep-bg);
}
.workout-mode-icon svg {
  width:27px;
  height:27px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.workout-mode-card.calisthenics .workout-mode-icon { color:#35d4e4; background:rgba(18,198,219,.075); border-color:rgba(18,198,219,.22); }
.workout-mode-card.strength .workout-mode-icon { color:#6aa9ff; background:rgba(47,128,255,.075); border-color:rgba(47,128,255,.22); }
.workout-mode-card.cardio .workout-mode-icon { color:#52d996; background:rgba(69,207,137,.075); border-color:rgba(69,207,137,.22); }
.workout-mode-copy { display:grid; gap:4px; align-self:center; }
.workout-mode-copy strong { font-size:19px; letter-spacing:-.035em; }
.workout-mode-copy small { color:var(--muted); font-size:12px; line-height:1.35; }
.workout-mode-count {
  grid-column:2;
  align-self:end;
  color:var(--text-soft);
  font-size:11px;
  font-weight:750;
}
.workout-mode-chevron {
  grid-column:3;
  grid-row:1 / span 3;
  align-self:center;
  font-size:24px;
  color:var(--muted);
  transform:translateY(-1px);
}
.workout-mode-card.active .workout-mode-chevron { color:var(--accent); }

.workout-hybrid-card {
  width:100%;
  min-height:54px;
  padding:10px 14px;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:11px;
  border:1px solid var(--gh-stroke-soft);
  border-radius:13px;
  background:rgba(var(--accent-rgb),.025);
  color:var(--text-soft);
  text-align:left;
}
.workout-hybrid-card:hover { border-color:var(--line-strong); }
.workout-hybrid-card.active {
  border-color:rgba(var(--accent-rgb),.55);
  background:rgba(var(--accent-rgb),.10);
  color:var(--text);
}
.workout-hybrid-icon {
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:9px;
  color:#b29cff;
  background:rgba(157,124,255,.08);
  border:1px solid rgba(157,124,255,.18);
}
.workout-hybrid-icon svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; }
.workout-hybrid-card > span:nth-child(2) { display:grid; gap:2px; }
.workout-hybrid-card strong { font-size:13px; }
.workout-hybrid-card small { color:var(--muted); font-size:10px; }

.training-mode-intro {
  margin:18px 0 !important;
  padding:20px !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  gap:20px !important;
  align-items:center !important;
  border-radius:16px !important;
}
.training-mode-intro > div { max-width:720px !important; }
.training-mode-intro h2 { font-size:24px !important; line-height:1.12; }
.training-mode-intro .primary { min-height:44px; white-space:nowrap; }
.mode-suggestion-card { border-radius:16px !important; }
.routine-list { display:grid; gap:10px; }
.routine-card { min-width:0; }
.exercise-library-heading { margin-top:28px !important; }

/* Profile onboarding: Skip must remain reachable and tappable. */
.training-profile-page-head {
  position:sticky;
  top:0;
  z-index:8;
  margin:calc(-1 * (28px + env(safe-area-inset-top))) -2px 0;
  padding:calc(18px + env(safe-area-inset-top)) 2px 16px;
  background:linear-gradient(180deg,var(--bg) 82%,rgba(var(--bg-rgb),0));
}
.profile-close-btn {
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
  cursor:pointer;
  position:relative;
  z-index:10;
}

/* Mobile app fidelity. */
@media (max-width:959px) {
  .mobile-appbar {
    grid-template-columns:38px minmax(0,1fr) auto !important;
    min-height:60px !important;
  }
  .mobile-brand-row .brand-copy h1 { font-size:15px !important; }
  .mobile-brand-row .brand-copy p { font-size:5.8px !important; }
  .appbar-icon svg, .bottom-nav .nav-btn svg { stroke-width:1.85 !important; }

  .bottom-nav {
    height:64px !important;
    border-radius:20px !important;
    padding:5px 6px !important;
  }
  .bottom-nav .nav-btn {
    min-height:52px !important;
    gap:3px !important;
  }
  .bottom-nav .nav-btn svg { width:21px !important; height:21px !important; }
  .bottom-nav .nav-btn small { font-size:9px !important; letter-spacing:-.01em; }

  .workout-library-title { margin-bottom:8px !important; }
  .workout-library-title h2 { font-size:29px !important; }
  .workout-library-title .subtle { max-width:42ch; }

  .workout-mode-grid {
    grid-template-columns:1fr;
    gap:9px;
    margin:12px 0 9px;
  }
  .workout-mode-card {
    min-height:92px;
    padding:12px 13px;
    grid-template-columns:42px minmax(0,1fr) auto;
    grid-template-rows:auto auto;
    gap:3px 11px;
    border-radius:15px;
  }
  .workout-mode-icon {
    width:42px;
    height:42px;
    grid-row:1 / span 2;
    align-self:center;
    border-radius:12px;
  }
  .workout-mode-icon svg { width:24px; height:24px; }
  .workout-mode-copy { align-self:end; }
  .workout-mode-copy strong { font-size:16px; }
  .workout-mode-copy small { font-size:10px; }
  .workout-mode-count {
    grid-column:2;
    grid-row:2;
    align-self:start;
    font-size:9px;
  }
  .workout-mode-chevron {
    grid-column:3;
    grid-row:1 / span 2;
    font-size:22px;
  }
  .workout-hybrid-card { min-height:48px; padding:9px 11px; }
  .workout-hybrid-card small { font-size:9px; }

  .training-mode-intro {
    grid-template-columns:1fr !important;
    padding:16px !important;
    gap:13px !important;
    margin:14px 0 !important;
  }
  .training-mode-intro h2 { font-size:21px !important; }
  .training-mode-intro .primary { width:100%; min-height:46px; }

  .mode-suggestion-head { gap:8px; }
  .mode-suggestion-card { padding:14px !important; }
  .suggested-exercise-list { gap:5px; }
  .suggested-exercise-list span { font-size:9px; padding:6px 8px; }

  .section-title-row.exercise-library-heading {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:end;
  }

  .training-profile-page-head {
    margin:calc(-1 * (18px + env(safe-area-inset-top))) -2px 0;
    padding:calc(14px + env(safe-area-inset-top)) 2px 12px;
  }
  .training-profile-page-head h2 { font-size:27px !important; }
  .training-profile-page-head .subtle { font-size:12px !important; }
  .profile-close-btn {
    min-height:42px !important;
    padding:0 13px !important;
    border-radius:12px !important;
  }

  .sheet-card, .confirm-card, .exercise-demo-card {
    max-width:100vw;
  }
}

/* Desktop/tablet: balanced content width and app-like rail. */
@media (min-width:960px) {
  .app-shell {
    grid-template-columns:210px minmax(0,1fr) !important;
  }
  .desktop-rail {
    padding:20px 14px !important;
  }
  .desktop-rail .rail-brand { padding:2px 6px 26px !important; }
  .desktop-rail .rail-brand strong { font-size:15px !important; }
  .desktop-rail .rail-brand small { font-size:6px !important; }
  .rail-nav { gap:6px !important; }
  .rail-nav .nav-btn {
    min-height:44px !important;
    border-radius:10px !important;
    padding:0 12px !important;
    gap:11px !important;
    font-size:12px !important;
  }
  .desktop-rail .rail-footer { padding:16px 6px 4px; }

  .main-content {
    width:min(100%,1220px) !important;
    max-width:1220px !important;
    margin:0 auto !important;
    padding:34px 34px 64px !important;
  }
  .workout-library-title h2,
  .profile-page-head h2 { font-size:36px !important; }
  .workout-library-title .subtle { font-size:13px; max-width:760px; }
}

/* Extra-wide desktops should not stretch cards into giant empty panels. */
@media (min-width:1500px) {
  .main-content { max-width:1280px !important; }
}

/* Phone landscape remains compact and scrollable, never zoom-dependent. */
@media (max-width:959px) and (orientation:landscape) and (max-height:560px) {
  .workout-mode-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .workout-mode-card {
    min-height:72px;
    grid-template-columns:34px minmax(0,1fr);
    grid-template-rows:auto auto;
    padding:9px;
  }
  .workout-mode-icon { width:34px; height:34px; }
  .workout-mode-icon svg { width:20px; height:20px; }
  .workout-mode-count, .workout-mode-chevron { display:none; }
  .workout-mode-copy strong { font-size:12px; }
  .workout-mode-copy small { font-size:8px; }
}

/* ==============================================================
   GritHQ alpha4.19 — mockup fidelity implementation
   Structural UI only. Workout/data/coach engine intentionally unchanged.
   ============================================================== */

:root{
  --gh-card-radius:16px;
  --gh-card-border:rgba(110,153,196,.18);
  --gh-card-border-strong:rgba(94,163,255,.42);
}

/* Desktop rail now matches the approved product mockup more closely. */
.rail-tools{display:none}
@media(min-width:960px){
  .app-shell{grid-template-columns:236px minmax(0,1fr)!important;background:var(--bg)!important}
  .desktop-rail{padding:22px 14px 18px!important;background:linear-gradient(180deg,#07121f 0%,#050b12 72%,#04080d 100%)!important;border-right:1px solid rgba(93,129,166,.18)!important}
  .desktop-rail .rail-brand{padding:0 8px 27px!important;gap:11px!important}
  .desktop-rail .rail-mark{width:42px!important;height:42px!important;border:0!important;background:transparent!important;box-shadow:none!important}
  .desktop-rail .rail-brand strong{font-size:17px!important;letter-spacing:-.025em!important}
  .desktop-rail .rail-brand small{font-size:6.5px!important;letter-spacing:.15em!important;color:#5f7790!important}
  .rail-nav{gap:5px!important}
  .rail-nav .nav-btn{min-height:50px!important;border-radius:11px!important;padding:0 14px!important;font-size:13px!important;color:#8ba0b7!important}
  .rail-nav .nav-btn.active{background:linear-gradient(90deg,rgba(37,94,255,.25),rgba(32,80,140,.16))!important;color:#fff!important;box-shadow:inset 3px 0 0 #3487ff!important}
  .desktop-rail .rail-nav .nav-btn svg{width:21px!important;height:21px!important;stroke-width:1.65!important}
  .rail-tools{display:grid;margin-top:31px;padding:0 5px;gap:4px}
  .rail-tools>span{text-transform:uppercase;color:#536a81;font-size:8px;font-weight:800;letter-spacing:.12em;padding:0 8px 8px}
  .rail-tool-btn{border:0;background:transparent;color:#8095aa;min-height:43px;border-radius:9px;display:flex;align-items:center;gap:11px;padding:0 10px;text-align:left}
  .rail-tool-btn:hover{background:rgba(76,118,160,.08);color:#d7e5f2}
  .rail-tool-btn svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
  .rail-tool-btn b{font-size:11px;font-weight:650}
  .desktop-rail .rail-footer{margin-top:auto!important;padding:15px 8px 5px!important;border:1px solid rgba(101,142,183,.14)!important;border-radius:13px!important;background:rgba(12,26,40,.62)!important}
  .rail-avatar{background:linear-gradient(145deg,#1e65f0,#27a7ff)!important;color:white!important}
  .main-content{width:min(100%,1440px)!important;max-width:1440px!important;padding:34px 40px 70px!important}
}

/* Train page header with functional movement-search jump. */
.gh-library-top{align-items:center!important;margin-bottom:18px!important}
.gh-library-search-jump{display:flex;align-items:center;gap:9px;min-height:42px;padding:0 14px;border:1px solid var(--gh-card-border);border-radius:11px;background:#08131e;color:#7f95aa;font-size:11px;font-weight:650}
.gh-library-search-jump:hover{border-color:rgba(66,143,255,.48);color:#dbeaff}
.gh-library-search-jump svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7}

/* Four first-class training lanes. */
.gh-lane-gallery{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important;margin:18px 0 14px!important}
.workout-mode-card{
  position:relative!important;isolation:isolate;min-height:270px!important;padding:0!important;border-radius:16px!important;overflow:hidden!important;
  display:block!important;border:1px solid var(--gh-card-border)!important;background:#07111b!important;color:#fff!important;text-align:left!important;
  box-shadow:0 14px 32px rgba(0,0,0,.16)!important;transform:none!important
}
.workout-mode-card:hover{transform:translateY(-2px)!important;border-color:rgba(91,155,232,.42)!important}
.workout-mode-card.active{box-shadow:inset 0 0 0 1px rgba(67,143,255,.35),0 17px 40px rgba(0,0,0,.25)!important;border-color:#2c78df!important}
.workout-mode-art{position:absolute;z-index:-3;inset:0 0 42%;background-position:center;background-size:cover;background-repeat:no-repeat;filter:saturate(.92) contrast(1.04)}
.workout-mode-art.calisthenics{background-image:url('assets/lane-calisthenics.jpg')}
.workout-mode-art.strength{background-image:url('assets/lane-strength.jpg')}
.workout-mode-art.cardio{background-image:url('assets/lane-cardio.jpg')}
.workout-mode-art.hybrid{inset:0;background:
  radial-gradient(circle at 55% 30%,rgba(139,80,255,.22),transparent 28%),
  linear-gradient(155deg,#0c1122,#0c0920 65%,#110c26)}
.workout-mode-overlay{position:absolute;z-index:-2;inset:0;background:linear-gradient(180deg,rgba(3,8,14,.02) 10%,rgba(4,9,15,.22) 42%,rgba(5,11,18,.98) 67%,#050b12 100%)}
.workout-mode-card.hybrid .workout-mode-overlay{background:linear-gradient(180deg,transparent 0%,rgba(6,8,18,.25) 40%,rgba(7,9,20,.96) 100%)}
.workout-mode-icon{position:absolute!important;left:18px;bottom:91px;width:38px!important;height:38px!important;border-radius:10px!important;z-index:2!important;background:rgba(4,12,21,.76)!important;backdrop-filter:blur(12px);border:1px solid currentColor!important}
.workout-mode-icon svg{width:22px!important;height:22px!important;stroke-width:1.7!important}
.workout-mode-card.calisthenics .workout-mode-icon{color:#2f8cff!important}
.workout-mode-card.strength .workout-mode-icon{color:#22d7ea!important}
.workout-mode-card.cardio .workout-mode-icon{color:#72e941!important}
.workout-mode-card.hybrid .workout-mode-icon{color:#a869ff!important;left:50%!important;top:49px!important;bottom:auto!important;transform:translateX(-50%);width:58px!important;height:58px!important;border-radius:15px!important}
.workout-mode-card.hybrid .workout-mode-icon svg{width:34px!important;height:34px!important}
.workout-mode-copy{position:absolute;left:18px;right:46px;bottom:43px;display:grid!important;gap:3px!important;z-index:2}
.workout-mode-copy strong{font-size:22px!important;line-height:1!important;letter-spacing:-.04em!important;color:#f4f7fb!important}
.workout-mode-copy small{font-size:11px!important;color:#8fa2b5!important}
.workout-mode-count{position:absolute;left:18px;bottom:17px!important;font-size:10px!important;color:#67aaff!important;font-weight:750!important;z-index:2}
.workout-mode-card.strength .workout-mode-count{color:#32dcea!important}
.workout-mode-card.cardio .workout-mode-count{color:#85ed55!important}
.workout-mode-card.hybrid .workout-mode-count{color:#b674ff!important}
.workout-mode-chevron{position:absolute;right:18px;bottom:18px!important;top:auto!important;font-size:20px!important;color:#66829d!important;z-index:2}
.workout-mode-card.active .workout-mode-chevron{color:#4a9bff!important}
.workout-mode-card.hybrid .workout-mode-copy{bottom:43px}

/* Featured/suggestion/saved area arranged like a desktop app dashboard. */
.gh-train-dashboard{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.86fr) minmax(280px,.76fr);gap:12px;align-items:stretch;margin-top:12px}
.gh-train-feature,.gh-train-suggestion{min-width:0}
.training-mode-intro{position:relative;isolation:isolate;overflow:hidden;min-height:260px!important;margin:0!important;padding:24px 26px!important;border:1px solid var(--gh-card-border)!important;border-radius:16px!important;background:#07131e!important;display:flex!important;flex-direction:column!important;justify-content:flex-end!important;align-items:flex-start!important}
.training-mode-intro:before{content:'';position:absolute;z-index:-2;right:-2%;top:0;width:62%;height:100%;background-position:center;background-size:cover;background-repeat:no-repeat;opacity:.72;filter:saturate(.9) contrast(1.05)}
.training-mode-intro.calisthenics:before{background-image:url('assets/home-hero.jpg')}
.training-mode-intro.strength:before{background-image:url('assets/lane-strength.jpg')}
.training-mode-intro.cardio:before{background-image:url('assets/lane-cardio.jpg')}
.training-mode-intro.hybrid:before{background:radial-gradient(circle at 65% 35%,rgba(145,85,255,.35),transparent 35%),linear-gradient(145deg,#0c0e20,#07101a)}
.training-mode-intro:after{content:'';position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,#07131e 0%,rgba(7,19,30,.96) 39%,rgba(7,19,30,.45) 72%,rgba(7,19,30,.18) 100%)}
.training-mode-intro>div{max-width:55%!important}
.training-mode-intro h2{font-size:25px!important;max-width:15ch;margin:5px 0 7px!important}
.training-mode-intro .subtle{font-size:11px!important;line-height:1.5!important;max-width:50ch}
.training-mode-intro .primary{margin-top:16px!important;min-width:190px!important}
.gh-train-suggestion .mode-suggestion-card{height:100%;margin:0!important;padding:19px!important;border:1px solid var(--gh-card-border)!important;background:linear-gradient(155deg,#091623,#07111b)!important}
.gh-train-saved{padding:17px!important;border:1px solid var(--gh-card-border)!important;background:linear-gradient(155deg,#091521,#071019)!important;border-radius:16px!important}
.gh-mini-panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:10px}
.gh-mini-panel-head h3{font-size:16px;margin:2px 0!important}.gh-mini-panel-head>span{display:grid;place-items:center;min-width:27px;height:27px;border-radius:9px;background:#0e2540;color:#63aaff;font-weight:800;font-size:10px}
.gh-compact-routines{gap:7px!important}.gh-compact-routines .routine-card{padding:11px!important;border-radius:10px!important}.gh-compact-routines .routine-card .routine-actions{gap:5px!important}.gh-compact-routines .routine-card .secondary.small{min-height:34px!important}
.gh-more-routines{font-size:9px!important;margin:8px 2px 0!important}
.gh-movement-panel{margin-top:12px!important;padding:18px!important;border:1px solid var(--gh-card-border)!important;border-radius:16px!important;background:linear-gradient(155deg,#08131e,#060e16)!important}
.gh-movement-panel .exercise-library-heading{margin:0!important}
.gh-movement-panel .standalone-exercise-library{margin-top:15px!important;border:0!important;background:transparent!important;padding:0!important}
.gh-empty-suggestion{display:flex;flex-direction:column;justify-content:center;min-height:260px}

/* Home hero gets the photographic visual treatment shown in the mockup. */
.gh-today-card{position:relative!important;isolation:isolate;overflow:hidden!important;border:1px solid var(--gh-card-border)!important;background:#07131e!important}
.gh-today-card:before{content:'';position:absolute;z-index:-2;right:0;top:0;width:55%;height:100%;background:url('assets/home-hero.jpg') center/cover no-repeat;opacity:.62}
.gh-today-card:after{content:'';position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,#07131e 0%,rgba(7,19,30,.95) 45%,rgba(7,19,30,.26) 100%)}
.gh-today-copy{max-width:60%}
.gh-mode-card{border-color:var(--gh-card-border)!important}

/* Progress and Profile: denser, native-app card proportions. */
.progress-area-tabs{background:#07131e!important;border:1px solid var(--gh-card-border)!important;border-radius:12px!important;padding:4px!important}
.progress-area-tab{border-radius:9px!important;min-height:34px!important}
.progress-area-tab.active{background:linear-gradient(145deg,#246bdf,#0f8cff)!important;color:white!important}
.profile-page-head{padding-bottom:10px!important;border-bottom:1px solid rgba(102,142,184,.12)!important}
.profile-avatar{background:linear-gradient(145deg,#1558c8,#238dff)!important;box-shadow:0 10px 28px rgba(34,120,255,.24)!important}
.settings-group>.card,.compatibility-grid,.app-update-card,.data-actions{border-color:var(--gh-card-border)!important;background:linear-gradient(155deg,#091521,#071019)!important}

/* Mobile: explicitly match the approved iOS mockup proportions. */
@media(max-width:959px){
  .main-content{padding:10px max(14px,env(safe-area-inset-right)) calc(82px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))!important}
  .mobile-appbar{background:rgba(3,9,15,.94)!important;border-bottom:1px solid rgba(85,123,160,.12)!important;min-height:58px!important}
  .mobile-brand-row{justify-self:start!important}.appbar-icon{display:none!important}.mobile-appbar{grid-template-columns:minmax(0,1fr) auto!important}
  .mobile-brand-row .brand-mark{width:31px!important;height:31px!important}.mobile-brand-row .brand-copy h1{font-size:15px!important}.mobile-avatar{display:grid!important;width:30px!important;height:30px!important}
  .bottom-nav{left:0!important;right:0!important;bottom:0!important;height:calc(62px + env(safe-area-inset-bottom))!important;border-radius:0!important;border-left:0!important;border-right:0!important;border-bottom:0!important;padding:4px 9px calc(4px + env(safe-area-inset-bottom))!important;background:rgba(4,10,17,.97)!important;box-shadow:0 -8px 28px rgba(0,0,0,.24)!important}
  .bottom-nav .nav-btn{min-height:50px!important;border-radius:10px!important;background:transparent!important}.bottom-nav .nav-btn.active{background:transparent!important;color:#168cff!important}.bottom-nav .nav-btn svg{width:20px!important;height:20px!important}.bottom-nav .nav-btn small{font-size:8px!important}
  .workout-library-title{margin-top:4px!important}.workout-library-title h2{font-size:28px!important}.workout-library-title .subtle{font-size:11px!important;line-height:1.45!important}
  .gh-library-search-jump{display:none}
  .gh-lane-gallery{grid-template-columns:1fr!important;gap:8px!important;margin:12px 0!important}
  .workout-mode-card{min-height:112px!important;border-radius:13px!important}
  .workout-mode-art{inset:0 0 0 45%!important;background-position:center!important}
  .workout-mode-overlay{background:linear-gradient(90deg,#07111a 0%,rgba(7,17,26,.96) 48%,rgba(7,17,26,.25) 100%)!important}
  .workout-mode-card.hybrid .workout-mode-art{inset:0!important}.workout-mode-card.hybrid .workout-mode-overlay{background:linear-gradient(90deg,#0b0b1c 0%,rgba(10,9,25,.78) 55%,rgba(14,9,31,.35) 100%)!important}
  .workout-mode-icon{left:14px!important;bottom:16px!important;width:30px!important;height:30px!important;border-radius:9px!important}.workout-mode-icon svg{width:18px!important;height:18px!important}
  .workout-mode-card.hybrid .workout-mode-icon{left:auto!important;right:15px!important;top:50%!important;transform:translateY(-50%)!important;width:38px!important;height:38px!important}
  .workout-mode-copy{left:14px!important;right:54%!important;bottom:47px!important}.workout-mode-copy strong{font-size:18px!important}.workout-mode-copy small{font-size:9px!important}
  .workout-mode-count{left:14px!important;bottom:18px!important;font-size:9px!important}.workout-mode-chevron{right:12px!important;bottom:46px!important;font-size:18px!important}
  .workout-mode-card.hybrid .workout-mode-copy{right:58px!important;bottom:47px!important}.workout-mode-card.hybrid .workout-mode-count{bottom:18px!important}
  .gh-train-dashboard{display:grid!important;grid-template-columns:1fr!important;gap:9px!important;margin-top:10px!important}
  .training-mode-intro{min-height:175px!important;padding:17px!important}.training-mode-intro:before{width:56%!important}.training-mode-intro>div{max-width:68%!important}.training-mode-intro h2{font-size:20px!important}.training-mode-intro .subtle{font-size:9px!important}.training-mode-intro .primary{min-width:0!important;width:auto!important;margin-top:11px!important;min-height:40px!important;font-size:10px!important}
  .gh-train-suggestion .mode-suggestion-card,.gh-train-saved,.gh-movement-panel{border-radius:13px!important;padding:14px!important}
  .gh-train-saved .routine-card{padding:10px!important}
  .gh-today-card:before{width:70%!important}.gh-today-copy{max-width:75%!important}
  .gh-today-copy h2{font-size:25px!important}
  .profile-page-head h2,.section-title-row h2{letter-spacing:-.04em!important}
}

@media(max-width:430px){
  .mobile-brand-row .brand-copy p{display:none!important}
  .workout-mode-card{min-height:106px!important}
  .workout-mode-copy strong{font-size:17px!important}
}

@media(min-width:960px) and (max-width:1180px){
  .gh-lane-gallery{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .gh-train-dashboard{grid-template-columns:1.2fr .9fr!important}.gh-train-saved{grid-column:1/-1}
}
