/* RepRoom V5.1 — semantic color hierarchy.
   Color is meaningful, not decorative: yellow = action/achievement;
   purple = navigation, link, focus and secondary comparison;
   neutrals = content and structure. Loaded last; schema and DOM are unchanged. */
:root,:root[data-theme="dark"]{
 color-scheme:dark;
 /* Authoritative semantic tokens (change these, not component-specific colors). */
 --color-background:#0B0B0F;
 --color-surface:#17171D;
 --color-surface-elevated:#22222B;
 --color-surface-raised:#2A2A34;
 --color-secondary-action:#22222B;
 --color-input-background:#121217;
 --color-navigation-background:#111116;
 --color-text-primary:#F8F8FA;
 --color-text-secondary:#B2B2C0;
 --color-text-tertiary:#9898A8;
 --color-border:#34343F;
 --color-primary-action:#FACC15;
 --color-primary-action-hover:#FDE047;
 --color-primary-action-text:#211A00;
 --color-brand-purple:#9333EA;
 --color-brand-purple-bright:#A855F7;
 --color-link:#C084FC; /* more contrast than brand purple against dark surfaces */
 --color-focus:#C084FC;
 --color-selected-surface:#252032;
 --color-selected-border:#57406F;
 --color-achievement-surface:#2A2615;
 --color-achievement-border:#665722;
 --color-favorite-outline:#FACC15;
 --color-success:#69D3A4;
 --color-warning:#F2B956;
 --color-danger:#FF8E97;
 --color-chart-primary:#FACC15;
 --color-chart-secondary:#C084FC;
 --color-shadow:0 12px 38px rgba(0,0,0,.25);
 /* Compatibility aliases consumed by pre-V5 styles. No independent palettes. */
 --bg:var(--color-background);--panel:var(--color-surface);
 --panel2:var(--color-surface-elevated);--panel3:var(--color-surface-raised);
 --line:var(--color-border);--text:var(--color-text-primary);
 --muted:var(--color-text-secondary);--faint:var(--color-text-tertiary);
 --input:var(--color-input-background);--navbg:var(--color-navigation-background);
 --yellow:var(--color-primary-action);--yellow-bright:var(--color-primary-action-hover);
 --yellow-ink:var(--color-primary-action-text);--accent-contrast:var(--color-primary-action-text);
 --purple:var(--color-link);--purple-strong:var(--color-brand-purple);
 --warm:var(--color-chart-secondary);--purple-soft:var(--color-selected-surface);
 --purple-border:var(--color-selected-border);
 --gold-soft:var(--color-achievement-surface);--gold-border:var(--color-achievement-border);
 --mint:var(--color-primary-action);--mint-bg:var(--color-achievement-surface);
 --red:var(--color-danger);--green:var(--color-success);
 --tint:var(--color-surface);--active:var(--color-surface-elevated);
 --shadow:var(--color-shadow);
 --r-card:14px;--r-control:10px;--r-pill:999px;--r-small:8px;
 --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;
 --space-6:24px;--space-8:32px;
 --control-sm:36px;--control-md:44px;--control-lg:50px;
 --motion-fast:110ms;--motion-mid:170ms;--ease-out:cubic-bezier(.22,1,.36,1);
}
:root[data-theme="light"]{
 color-scheme:light;
 --color-background:#F8F8FA;
 --color-surface:#FFFFFF;
 --color-surface-elevated:#F0F0F4;
 --color-surface-raised:#E9E9F0;
 --color-secondary-action:#F0F0F4;
 --color-input-background:#FFFFFF;
 --color-navigation-background:#FFFFFF;
 --color-text-primary:#18181B;
 --color-text-secondary:#5D5D6C;
 --color-text-tertiary:#707081;
 --color-border:#DCDCE5;
 --color-primary-action:#EAB308;
 --color-primary-action-hover:#FACC15;
 --color-primary-action-text:#231C00;
 --color-brand-purple:#7E22CE;
 --color-brand-purple-bright:#9333EA;
 --color-link:#7021BB;
 --color-focus:#7E22CE;
 --color-selected-surface:#F3ECFB;
 --color-selected-border:#D6C0EC;
 --color-achievement-surface:#FFF9DF;
 --color-achievement-border:#CCAB37;
 --color-favorite-outline:#765200; /* legible stroke while the fill remains yellow */
 --color-success:#197C51;
 --color-warning:#9A6300;
 --color-danger:#B4233A;
 --color-chart-primary:#B88A00; /* visible on white chart canvas */
 --color-chart-secondary:#7E22CE;
 --color-shadow:0 12px 38px rgba(24,20,35,.10);
}
@media(prefers-color-scheme:light){
 :root[data-theme="system"]{color-scheme:light;
 --color-background:#F8F8FA;--color-surface:#FFFFFF;
 --color-surface-elevated:#F0F0F4;--color-surface-raised:#E9E9F0;
 --color-secondary-action:#F0F0F4;
 --color-input-background:#FFFFFF;--color-navigation-background:#FFFFFF;
 --color-text-primary:#18181B;--color-text-secondary:#5D5D6C;
 --color-text-tertiary:#707081;--color-border:#DCDCE5;
 --color-primary-action:#EAB308;--color-primary-action-hover:#FACC15;
 --color-primary-action-text:#231C00;
 --color-brand-purple:#7E22CE;--color-brand-purple-bright:#9333EA;
 --color-link:#7021BB;--color-focus:#7E22CE;
 --color-selected-surface:#F3ECFB;--color-selected-border:#D6C0EC;
 --color-achievement-surface:#FFF9DF;--color-achievement-border:#CCAB37;
 --color-favorite-outline:#765200;--color-success:#197C51;
 --color-warning:#9A6300;--color-danger:#B4233A;
 --color-chart-primary:#B88A00;--color-chart-secondary:#7E22CE;
 --color-shadow:0 12px 38px rgba(24,20,35,.10);}
}
/* Legacy light-mode declarations in earlier styles have greater selector specificity than :root.
   Reassert only semantic aliases for explicit and system light themes. */
:root[data-theme="light"]{
 --bg:var(--color-background);--panel:var(--color-surface);
 --panel2:var(--color-surface-elevated);--panel3:var(--color-surface-raised);
 --line:var(--color-border);--text:var(--color-text-primary);
 --muted:var(--color-text-secondary);--faint:var(--color-text-tertiary);
 --input:var(--color-input-background);--navbg:var(--color-navigation-background);
 --yellow:var(--color-primary-action);--yellow-bright:var(--color-primary-action-hover);
 --yellow-ink:var(--color-primary-action-text);--accent-contrast:var(--color-primary-action-text);
 --purple:var(--color-link);--purple-strong:var(--color-brand-purple);
 --warm:var(--color-chart-secondary);--purple-soft:var(--color-selected-surface);
 --purple-border:var(--color-selected-border);
 --gold-soft:var(--color-achievement-surface);--gold-border:var(--color-achievement-border);
 --mint:var(--color-primary-action);--mint-bg:var(--color-achievement-surface);
 --red:var(--color-danger);--green:var(--color-success);
 --tint:var(--color-surface);--active:var(--color-surface-elevated);
 --shadow:var(--color-shadow);
}
@media(prefers-color-scheme:light){:root[data-theme="system"]{
 --bg:var(--color-background);--panel:var(--color-surface);
 --panel2:var(--color-surface-elevated);--panel3:var(--color-surface-raised);
 --line:var(--color-border);--text:var(--color-text-primary);
 --muted:var(--color-text-secondary);--faint:var(--color-text-tertiary);
 --input:var(--color-input-background);--navbg:var(--color-navigation-background);
 --yellow:var(--color-primary-action);--yellow-bright:var(--color-primary-action-hover);
 --yellow-ink:var(--color-primary-action-text);--accent-contrast:var(--color-primary-action-text);
 --purple:var(--color-link);--purple-strong:var(--color-brand-purple);
 --warm:var(--color-chart-secondary);--purple-soft:var(--color-selected-surface);
 --purple-border:var(--color-selected-border);
 --gold-soft:var(--color-achievement-surface);--gold-border:var(--color-achievement-border);
 --mint:var(--color-primary-action);--mint-bg:var(--color-achievement-surface);
 --red:var(--color-danger);--green:var(--color-success);
 --tint:var(--color-surface);--active:var(--color-surface-elevated);
 --shadow:var(--color-shadow);
}}
/* Type system — compact and legible on a phone; no overblown dashboard headlines. */
html,body{background:var(--bg);color:var(--text)}
html{font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
body{font-size:14px;line-height:1.5}
h1,h2,h3{font-weight:730;letter-spacing:-.025em;line-height:1.25;text-wrap:pretty}
h1,.page-head h1{font-size:clamp(26px,2.1vw,30px);letter-spacing:-.038em;line-height:1.17}
h2,.section-head h2{font-size:19px;letter-spacing:-.025em}
h3{font-size:16px}p{line-height:1.55}
.eyebrow{font-size:10px;font-weight:720;letter-spacing:.09em;color:var(--muted)}
.kicker{letter-spacing:.035em;font-size:11px;color:var(--muted)}
.page-head{margin-bottom:22px;align-items:flex-start;gap:12px}
.page-head p{margin-top:6px;line-height:1.45;color:var(--muted);max-width:620px}
.section-head{margin:25px 0 12px;gap:12px}
.section-head h2{font-weight:740}
.subheading{letter-spacing:.05em}
.hint,.muted,small{color:var(--muted);line-height:1.55}
/* Shared controls. Small and standard controls have explicit sizes, not accidental padding. */
button{font-weight:630;touch-action:manipulation;transition:background-color var(--motion-mid),border-color var(--motion-mid),color var(--motion-mid),transform var(--motion-fast)}
button:active:not(:disabled){transform:translateY(1px)}
button:disabled{opacity:.48;cursor:not-allowed;filter:none}
:where(button,a,input,select,textarea):focus-visible{outline:2px solid var(--color-focus)!important;outline-offset:2px}
.button,.button.secondary,.button.ghost,.button.danger{
 display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--control-md);
 border:1px solid transparent;border-radius:var(--r-control);padding:0 16px;
 font-size:13px;font-weight:720;line-height:1.2;white-space:normal;text-align:center;
 box-shadow:none;vertical-align:middle;
}
.button{background:var(--color-primary-action);border-color:var(--color-primary-action);color:var(--color-primary-action-text)!important}
.button:hover:not(:disabled){filter:none;box-shadow:none;background:var(--color-primary-action-hover);border-color:var(--color-primary-action-hover)}
.button.secondary{background:var(--color-secondary-action);color:var(--text)!important;border-color:var(--line)}
.button.secondary:hover:not(:disabled){background:var(--panel3);border-color:var(--color-selected-border)}
.button.ghost{background:transparent;color:var(--muted)!important;border-color:var(--line)}
.button.ghost:hover:not(:disabled){background:var(--panel2);color:var(--text)!important}
.button.danger{background:transparent;border-color:color-mix(in srgb,var(--color-danger) 45%,var(--line));color:var(--color-danger)!important}
.button.danger:hover:not(:disabled){background:color-mix(in srgb,var(--color-danger) 10%,var(--panel))}
.button.small{min-height:var(--control-sm);padding:0 12px;border-radius:var(--r-small);font-size:12px}
.button.block{width:100%}
.pill-link,.inline-link,.mini-action{color:var(--color-link);font-weight:700;text-decoration:none}
.pill-link:hover,.inline-link:hover{text-decoration:underline;text-underline-offset:3px}
.icon-button,.close,.favorite-toggle{display:inline-grid;place-items:center;flex-shrink:0;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border-radius:var(--r-control);border:1px solid var(--line);background:var(--panel2);color:var(--text);font-weight:650;box-shadow:none}
.icon-button:hover,.close:hover,.favorite-toggle:hover{background:var(--panel3);border-color:var(--purple-border)}
.close{font-size:21px}
.favorite-toggle{color:var(--faint)}
.favorite-toggle.is-favorite{color:var(--color-favorite-outline);background:var(--color-achievement-surface);border-color:var(--color-achievement-border)}
.favorite-toggle.is-favorite svg{fill:var(--color-primary-action)}
/* Every input type shares height, text rhythm, focus treatment and invalid state. */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),select,textarea{
 border-radius:var(--r-control);border:1px solid var(--line);background:var(--input);color:var(--text);
 font-size:14px;padding:10px 12px;min-height:var(--control-md);box-shadow:none;
}
textarea{min-height:92px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--purple)!important;box-shadow:0 0 0 2px color-mix(in srgb,var(--purple) 16%,transparent)!important}
input::placeholder,textarea::placeholder{color:var(--faint)}
input[aria-invalid="true"],select[aria-invalid="true"]{border-color:var(--red)!important}
input[type="checkbox"]{accent-color:var(--yellow);min-width:20px;min-height:20px}
.field{gap:6px;margin:10px 0}
.field label{font-size:12px;color:var(--muted);font-weight:650}
.input-error{color:var(--red)}
.profile-select{height:44px;min-width:130px;width:auto;font-weight:630}
.searchbox input{height:46px}
.chip,.chip-button{border-radius:999px;border-color:var(--line);color:var(--muted);font-size:12px}
.chip.good{background:var(--panel2);color:var(--muted);border-color:var(--line)}
.chip.warm{color:var(--color-link);border-color:var(--color-selected-border)}
.chip-button{min-height:38px;padding:7px 12px;background:var(--panel2)}
.chip-button.active{color:var(--text);background:var(--color-selected-surface);border-color:var(--color-selected-border)}
/* Shared panel / stat / routine language — one elevation, one border and two radii. */
.panel,.routine-card,.stat,.record-tile,.week-stats>div{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-card);box-shadow:none}
.panel{padding:20px}
.panel.tinted,.hero.tinted{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-card)}
.hero.tinted:after,.summary-hero:before,.summary-hero:after{display:none}
.hero{padding:24px;gap:16px}
.hero h2{font-size:clamp(22px,2.2vw,27px);letter-spacing:-.035em;line-height:1.2;margin:0 0 7px}
.hero p{max-width:470px;line-height:1.48}
.hero .illustration{display:none}
.hero-actions{margin-top:16px;display:flex;gap:8px;flex-wrap:wrap}
.hero-actions .button:first-child{min-width:0}
.stat{padding:16px}
.stat .label{font-size:12px;color:var(--muted);font-weight:570}
.stat .value{font-size:clamp(23px,2.5vw,28px);font-weight:750;margin-top:5px;letter-spacing:-.035em}
.grid3>.stat:first-child,.grid3>.stat:nth-child(2),.grid3>.stat:nth-child(3),.summary-stats .stat:first-child{border-top:1px solid var(--line)}
.routine-card{gap:11px;padding:16px}
.routine-card:hover{border-color:var(--purple-border)}
.routine-card h3{font-size:16px;font-weight:710}
.routine-card .button{width:100%}
.record-tile .record-value{color:var(--text);font-size:21px}
.empty{border:1px dashed var(--line);background:var(--panel);padding:26px 16px;border-radius:var(--r-card)}
.empty strong{font-size:15px}
.notice{color:var(--text);background:var(--panel2);border-color:var(--line);border-radius:var(--r-control)}
.notice.warning{background:var(--gold-soft);color:var(--text);border-color:var(--gold-border)}
/* Navigation shares one exact icon geometry and reserved label width. */
.layout{grid-template-columns:230px minmax(0,1fr)}
.sidebar{background:var(--navbg);padding:26px 16px;border-right:1px solid var(--line)}
.brand{margin-bottom:26px;font-size:21px;padding:0 8px;gap:10px}
.brand-mark{border-radius:10px;width:34px;height:34px;box-shadow:none}
.brand .end{color:var(--text)}
.nav{gap:3px}
.nav-btn{min-height:46px;border-radius:10px;padding:10px 12px;gap:12px;color:var(--muted);font-weight:610}
.nav-btn.active{border-color:var(--color-selected-border);background:var(--color-selected-surface);color:var(--text)}
.nav-btn.active:before{left:0;top:9px;bottom:9px;background:var(--color-brand-purple);width:3px}
.nav-btn.active .nav-icon{color:var(--color-link)}
.nav-icon{display:inline-grid;place-items:center;width:21px;height:21px;min-width:21px;line-height:1;transform:none!important}
.nav-icon svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}
.nav-btn.active .nav-icon svg,.mobile-nav button.active .nav-icon svg{stroke-width:2.2}
.sidebar-footer{border-top:1px solid var(--line)}
.status{background:var(--green)}
.content{max-width:1220px;padding:30px clamp(18px,3.3vw,52px) 100px}
.save-indicator{font-size:11px}
/* Logging gets the strongest interaction hierarchy without decorative clutter. */
.session-top{background:var(--bg);padding:13px 0 15px;margin-top:-10px;margin-bottom:17px;backdrop-filter:none}
.session-top h1{font-size:26px}
.session-summary{color:var(--muted);font-size:12px}
.workout-meter{background:var(--panel3);height:4px}
.workout-meter>span{background:var(--yellow)}
.exercise-card{border-radius:var(--r-card);margin:12px 0}
.exercise-head{background:var(--panel);padding:16px;gap:10px}
.exercise-head .title{font-size:16px;font-weight:730;letter-spacing:-.02em}
.exercise-head .mini{font-size:12px;margin-top:3px}
.exercise-controls{gap:5px}
.exercise-controls button,.routine-edit-item .icon-button{min-width:36px;width:36px;min-height:36px;height:36px;font-size:17px;border-radius:8px}
.sets{padding:12px 14px 9px}
.sets .head{font-size:11px;font-weight:650;letter-spacing:.035em;color:var(--muted)}
.set{margin:5px 0;padding:3px;gap:8px;border-radius:9px}
.set.done{background:color-mix(in srgb,var(--color-primary-action) 7%,var(--panel));box-shadow:inset 2px 0 0 var(--color-primary-action)}
.set input{height:44px!important;min-height:44px!important;font-size:16px;text-align:center;background:var(--input);border-radius:var(--r-small)}
.set.done input{background:var(--input);border-color:var(--gold-border)}
.set-id{min-height:44px;padding:9px 2px;border-radius:var(--r-small);background:var(--panel2);font-weight:650}
.set .complete{height:44px;min-width:44px;min-height:44px;border-radius:var(--r-small);background:var(--panel2)}
.set.done .complete{background:var(--color-primary-action);border-color:var(--color-primary-action);color:var(--color-primary-action-text)}
.set-extras{gap:8px;margin:5px 2px 2px;padding:5px 2px}
.set-extras .mini-action{font-size:12px}
.exercise-foot{background:var(--panel);padding:12px 14px;gap:7px;align-items:center}
.exercise-foot .button{min-height:36px}
.exercise-foot>.button:first-child{background:var(--panel2);border-color:var(--line);color:var(--text)!important}
.exercise-foot>.button:first-child:hover{background:var(--panel3)}
.exercise-foot .favorite-toggle{width:36px;height:36px;min-width:36px;min-height:36px}
/* Library — row actions align and are distinguished by importance, not random color. */
.exercise-row{padding:12px 14px;gap:12px}
.exercise-row strong{font-size:14px;font-weight:660}
.exercise-row .button{min-height:36px}
.toolstrip{gap:8px}
/* Modal sheet and typography-led technique cues. */
.modal-backdrop{background:rgba(7,7,10,.76);padding:18px}
.modal{background:var(--panel);border-color:var(--line);border-radius:var(--r-card);padding:22px;box-shadow:var(--shadow);max-height:calc(100dvh - 36px);overscroll-behavior:contain}
.modal-head{margin-bottom:16px;padding:0 0 12px;border-bottom:1px solid var(--line);gap:12px;align-items:center}
.modal-head h2{font-size:21px;font-weight:740;letter-spacing:-.025em}
.modal-footer{display:flex;gap:8px;flex-wrap:wrap;align-items:stretch;border-top:1px solid var(--line);padding-top:16px;margin-top:18px}
.modal-footer>.button{flex:1 1 130px;min-width:0}
.cue-list{display:grid;gap:0;margin:15px 0 6px}
.cue-list>div{padding:14px 0;border:0;border-bottom:1px solid var(--line);background:transparent;border-radius:0}
.cue-list>div:first-child{border-top:1px solid var(--line)}
.cue-list strong{color:var(--text);font-weight:720;font-size:13px}
.cue-list p{margin-top:6px;color:var(--muted);font-size:14px;line-height:1.55}
.real-exercise-photo{margin:12px 0 15px}
.photo-enlarge{border-radius:var(--r-control)}
.photo-enlarge img{max-height:360px}
.photo-zoom-hint{font-size:11px}
.external-technique-reference{border:0;border-top:1px solid var(--line);background:transparent;border-radius:0;padding:12px 0 0;margin:12px 0}
.external-technique-reference a,.photo-attribution a{color:var(--color-link)}
.chips{gap:7px}.chip{padding:6px 10px}
/* Health and achievements use their own status tones, never a random accent. */
.toast{background:var(--panel3);border-color:var(--line);box-shadow:0 7px 18px #0002}
.toast[data-tone="success"]{border-color:var(--color-success);background:var(--panel);color:var(--text)}
.toast[data-tone="achievement"]{border-color:var(--color-achievement-border);background:var(--color-achievement-surface);color:var(--text)}
.summary-hero{border:1px solid var(--line);border-left:3px solid var(--yellow);background:var(--panel);padding:18px;border-radius:var(--r-card)}
.summary-hero strong{font-size:19px;font-weight:740}
.timer.rest-premium{border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow)}
.rest-time-icon{color:var(--color-link)}
.rest-time-main strong{color:var(--text)}
.week-bars .week-bar,.week-bar{background:var(--color-chart-secondary)}
.week-stats strong{color:var(--text)}
.chart .trace{stroke:var(--color-chart-primary)}
.chart circle{fill:var(--color-chart-primary)}
/* Phone-specific composition and touch targets. */
@media(max-width:920px){
 .layout{display:block;grid-template-columns:minmax(0,1fr)}
 .sidebar{display:none}
 .content{padding:22px 16px calc(112px + env(safe-area-inset-bottom,0px))}
 .mobile-nav{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));height:calc(70px + env(safe-area-inset-bottom,0px));padding:0 5px max(4px,env(safe-area-inset-bottom,0px));background:var(--navbg);border-top:1px solid var(--line);box-shadow:none}
 .mobile-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;margin:0;border:0;border-radius:8px;background:transparent;color:var(--muted);font-weight:570;font-size:10px;min-height:54px;padding:6px 0}
 .mobile-nav button.active{color:var(--text)!important;background:transparent;font-weight:740}
 .mobile-nav button.active:before{top:0;left:26%;right:26%;height:3px;background:var(--color-brand-purple);border-radius:0 0 3px 3px}
 .mobile-nav button.active .nav-icon{color:var(--color-link)}
 .mobile-nav .nav-icon{height:22px;min-height:22px}
 .mobile-nav .nav-icon svg{width:20px;height:20px}
 .timer.rest-premium{bottom:calc(78px + env(safe-area-inset-bottom,0px))}
}
@media(max-width:580px){
 .content{padding:20px 14px calc(112px + env(safe-area-inset-bottom,0px))}
 .page-head h1{font-size:26px}
 .page-head{margin-bottom:19px;gap:10px}
 .panel{padding:16px}
 .hero{padding:18px}
 .hero h2{font-size:22px}
 .hero-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%}
 .hero-actions .button{min-width:0!important;width:100%;padding-inline:10px}
 .hero-actions:has(>.button:only-child){grid-template-columns:1fr}
 .grid3{gap:8px}
 .hero+.grid3{gap:8px}
 .hero+.grid3 .stat{padding:12px 10px}
 .hero+.grid3 .stat .label{font-size:11px}
 .hero+.grid3 .stat .value{font-size:23px}
 .routine-card{padding:14px}
 .session-top{padding:10px 0 12px}
 .session-top h1{font-size:23px}
 .exercise-head{padding:14px}
 .exercise-head .title{font-size:16px}
 .sets{padding:11px 10px 7px}
 .sets .head,.set{grid-template-columns:32px minmax(0,1fr) minmax(0,1fr) 44px;gap:6px}
 .set{padding:3px 0}
 .set input{padding-inline:4px}
 .set-id{min-width:32px}
 .exercise-foot{padding:10px 12px;gap:6px}
 .exercise-foot .button{font-size:12px;padding:0 10px}
 .modal-backdrop{padding:0;align-items:flex-end}
 .modal{width:100%;max-width:100%;max-height:92dvh;padding:18px 16px calc(18px + env(safe-area-inset-bottom,0px));border-radius:16px 16px 0 0}
 .modal-head{margin-bottom:13px;padding-bottom:12px}
 .modal-head h2{font-size:20px}
 .modal-footer{position:sticky;bottom:calc(-18px - env(safe-area-inset-bottom,0px));padding:12px 0 calc(12px + env(safe-area-inset-bottom,0px));margin-bottom:calc(-18px - env(safe-area-inset-bottom,0px));background:var(--panel)}
 .filter-grid{gap:8px}
 .form-grid{gap:4px 12px}
 .week-stats>div{padding:10px}
}
@media(max-width:355px){
 .content{padding-left:10px;padding-right:10px}
 .mobile-nav button{font-size:9px}
 .mobile-nav .nav-icon svg{width:19px;height:19px}
 .sets .head,.set{grid-template-columns:29px minmax(0,1fr) minmax(0,1fr) 40px;gap:4px}
 .set .complete{min-width:40px;width:40px}
 .exercise-foot .button{padding:0 8px;font-size:11px}
 .hero-actions{grid-template-columns:1fr}
 .hero-actions .button{min-height:44px}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* V5.1 state consistency (no blanket yellow/purple recoloring). */
.button.secondary[aria-pressed="true"],.chip-button[aria-pressed="true"]{
 background:var(--color-selected-surface);border-color:var(--color-selected-border);color:var(--color-link)!important;
}
.button:disabled,.button.secondary:disabled,.button.ghost:disabled,.button.danger:disabled{
 background:var(--panel2);border-color:var(--line);color:var(--muted)!important;opacity:.55;
}
:where(a,.pill-link,.inline-link,.mini-action){text-underline-offset:3px}
:where(a,.pill-link,.inline-link,.mini-action):focus-visible{outline-color:var(--color-focus)!important}
/* Saved/local status is informational, not an achievement. */
.chip.good,.status-pill,.save-indicator{color:var(--muted)}
/* Destructive controls are the only red actions. */
[data-action="remove-last-set"],[data-action="profile-delete"],[data-action="history-delete"]{color:var(--color-danger)}
/* Record tiles represent historical values; only newly-earned records receive gold. */
.record-tile:before{display:none}
.record-tile .kicker{color:var(--muted)}
.record-tile.is-new-pr .record-value{color:var(--color-chart-primary)}
.record-tile.is-new-pr{border-color:var(--color-achievement-border);background:var(--color-achievement-surface)}
/* A profile/avatar is identity information, not a permanent yellow achievement. */
.profile-avatar{background:var(--panel2);border-color:var(--line);color:var(--text)}
/* Unselected dates stay neutral; selection indicates an intentional user choice. */
.calendar-day.has-workout:not(.chosen){border-color:var(--line)}
.calendar-day.has-workout:not(.chosen):after{background:var(--color-chart-secondary)}
.calendar-day.chosen{background:var(--color-primary-action);color:var(--color-primary-action-text);border-color:var(--color-primary-action)}
/* Neutral progress metrics, yellow primary performance and purple comparisons. */
.week-stats strong{color:var(--text)}
.workout-meter>span{background:var(--color-chart-primary)}
.chart .trace{stroke:var(--color-chart-primary)}
.chart circle{fill:var(--color-chart-primary)}
/* Informational labels should not compete with real action buttons. */
.eyebrow,.kicker,.subheading{color:var(--muted)}
/* Visible focus does not rely on colored content state. */
:where(button,a,input,select,textarea):focus-visible{outline:2px solid var(--color-focus)!important;outline-offset:2px}

/* A small section label is information, not a competing brand accent. */
.hero .eyebrow,.panel .kicker{color:var(--muted)}
/* Routine removal is destructive even when it appears alongside neutral Edit/Duplicate. */
.button[data-action="delete-routine"]{color:var(--color-danger)!important;border-color:color-mix(in srgb,var(--color-danger) 40%,var(--line))}
.exercise-controls [data-action="remove-entry"]{color:var(--color-danger)}