:root{color-scheme:dark;font-family:"Inter",system-ui,-apple-system,sans-serif;background:#101014;color:#f7f5f5;--accent:#ff626b;--card:#1c1c22;--muted:#b5b4be}*{box-sizing:border-box}body{margin:0}#app{min-height:100dvh}a{color:#ff8b92}main,header,nav,aside{width:min(100%,540px);margin-inline:auto}main{padding:26px 20px calc(100px + env(safe-area-inset-bottom))}h1{font-size:clamp(30px,8vw,44px);line-height:1.05;margin:10px 0 22px;letter-spacing:-.045em}h2{font-size:19px;margin:0 0 7px}p{color:var(--muted);line-height:1.55;margin:0 0 14px}header,nav,aside{display:flex;align-items:center;gap:10px;background:#15151be6;backdrop-filter:blur(18px);z-index:2}header{position:sticky;top:0;justify-content:space-between;padding:calc(8px + env(safe-area-inset-top)) 12px 8px;border-bottom:1px solid #ffffff12}header button{background:none;padding-inline:8px}.wordmark{font-weight:950;letter-spacing:-.075em;font-style:italic;font-size:21px}.wordmark span{color:var(--accent)}nav,aside{position:fixed;bottom:0;left:0;right:0;justify-content:center;padding:9px 14px calc(9px + env(safe-area-inset-bottom));border-top:1px solid #ffffff14}nav button{flex:1;background:none;color:var(--muted)}nav [aria-current=page]{color:var(--accent);background:#ff626b16}
button,input{font:inherit;font-size:16px}button{border:0;border-radius:12px;min-height:44px;padding:10px 14px;background:#2a2a33;color:inherit;font-weight:650;cursor:pointer}button:disabled{opacity:.45;cursor:default}button:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.primary{background:var(--accent);color:#21090b;width:100%;margin-top:7px}.secondary{background:#342428}.full{width:100%;margin-top:9px}.card{background:var(--card);border:1px solid #ffffff10;border-radius:18px;padding:15px;margin:0 0 12px}.row{display:flex;align-items:center;justify-content:space-between;gap:8px}.eyebrow{font-size:11px;font-weight:760;letter-spacing:.12em;color:#ff949a;margin-bottom:6px}.auth{min-height:100dvh;display:flex;flex-direction:column;justify-content:center;padding-top:calc(25px + env(safe-area-inset-top))}.auth .wordmark{font-size:44px;margin-bottom:38px}.auth label{display:grid;gap:8px;margin:16px 0;font-weight:650}.auth label.consent{grid-template-columns:auto 1fr;align-items:start;color:var(--muted);font-size:14px;line-height:1.45}.auth input[type=checkbox]{accent-color:var(--accent);width:21px;height:21px;margin:0}.auth footer{margin-top:28px;display:flex;flex-wrap:wrap;gap:9px;color:var(--muted);font-size:13px}.auth .row{margin-top:10px}.message{color:#ffa2a8;margin:8px 0;min-height:24px}.demo-code{color:#ffa2a8}
input{width:100%;min-width:0;background:#111117;color:#f7f5f5;border:1px solid #ffffff25;border-radius:9px;min-height:44px;padding:9px}.exercise p{font-size:13px}.set-row{display:grid;grid-template-columns:28px minmax(59px,1.1fr) minmax(37px,1fr) minmax(37px,1fr) 44px;gap:5px;align-items:center;padding:5px 2px;border-radius:10px;text-align:center;font-size:13px}.set-row input{text-align:center;padding-inline:3px}.labels{color:var(--muted);font-size:11px}.check{padding:0;color:#a5a4b2}.checked{background:#28473b}.checked .check{background:#62d9a0;color:#0c2b1c}.chips{display:flex;gap:8px;margin:0 0 14px}.chips button{flex:1}.chips [aria-pressed=true]{box-shadow:inset 0 0 0 1px var(--accent);color:#ffa2a8}.chips small{color:var(--muted);margin-left:3px}.summary{margin-bottom:14px;color:var(--muted);font-size:13px}.summary strong{color:white}.rest{justify-content:flex-start}.rest div{margin-right:auto;display:grid;gap:2px}.rest span{color:var(--muted);font-size:12px}.rest strong{font-variant-numeric:tabular-nums}.section-title{margin-top:28px}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#71dbac;margin-right:5px}
dialog{position:fixed;inset:auto 0 0;width:min(100%,540px);max-width:none;margin:0 auto;border:1px solid #ffffff22;border-radius:23px 23px 0 0;padding:0 18px calc(18px + env(safe-area-inset-bottom));background:#202027;color:white}dialog::backdrop{background:#0009}.grab{height:4px;width:36px;border-radius:4px;margin:9px auto 12px;background:#777782}.selector{text-align:left}.resume{text-align:left}@media(max-width:355px){main{padding-inline:10px}.card{padding-inline:8px}.summary{font-size:11px}}

/* Material-style controls use HNDCTRL's dark surfaces and red accent. */
:root{--field-outline:#77747f;--surface-high:#27262e;--on-accent:#26090c}
button{border-radius:999px;transition:background-color .16s ease,box-shadow .16s ease}
button:active:not(:disabled){box-shadow:inset 0 0 0 999px #ffffff18}
.primary{color:var(--on-accent)}
.secondary{background:transparent;border:1px solid var(--field-outline);color:#ffabb0}
header button{color:#ffabb0}

.card{border-radius:16px}
nav [aria-current=page],.chips [aria-pressed=true]{background:#48292e;color:#ffadb3}
.chips button{border-radius:14px}
.set-row input,.material-field input{background:transparent;border:1px solid var(--field-outline);border-radius:5px}
.set-row input:focus,.material-field input:focus{border-color:var(--accent);outline:0;box-shadow:inset 0 0 0 1px var(--accent)}
.set-row input:disabled{opacity:.8}
.check{border-radius:12px}
.auth .material-field{position:relative;display:block;margin:22px 0 7px}
.auth .wordmark,.demo-action{text-align:center}
.wordmark span{display:inline-block;width:.17em;height:.17em;margin-left:.075em;background:var(--accent);color:transparent;overflow:hidden}
.material-field span{position:absolute;top:0;left:12px;transform:translateY(-50%);padding-inline:4px;background:#101014;color:var(--muted);font-size:12px;pointer-events:none}
.material-field:focus-within span{color:#ffabb0}
.material-field input{min-height:56px;padding-inline:15px}
.policy-links,#phone-help{color:var(--muted);font-size:13px;margin:0 0 8px;padding-inline:2px}
.policy-links a,.policy-links a:visited{color:inherit;text-underline-offset:3px}
dialog{border-radius:28px 28px 0 0;background:var(--surface-high)}
.selector{border-radius:12px;background:transparent}
.selector:hover,.selector:focus-visible{background:#ffffff12}
@media(prefers-reduced-motion:reduce){button{transition:none}}

#athlete-form .material-field{position:relative;display:block;margin:20px 0 4px}
#athlete-form .material-field span{background:var(--surface-high)}

header{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
header .wordmark{grid-column:2;justify-self:center}
header > :last-child{justify-self:end}
header > :first-child{justify-self:start;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
dialog{background:#27262ef5;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
#routine-form .material-field{position:relative;display:block;margin:20px 0 12px}
#routine-form .material-field span,#athlete-form .material-field span{background:#27262e}
#routine-form fieldset{border:1px solid var(--field-outline);border-radius:12px;margin:0;padding:4px 12px}
.routine-option{display:flex;align-items:center;gap:10px;min-height:44px}
.routine-option input{width:18px;height:18px;min-height:0;accent-color:var(--accent)}

.material-field{position:relative;display:block;margin:18px 0}
.material-field span{position:absolute;top:28px;left:12px;transform:translateY(-50%);font-size:16px;background:transparent;transition:top .15s,font-size .15s,background-color .15s}
.material-field:focus-within span,.material-field:has(input:not(:placeholder-shown)) span{top:0;font-size:12px;background:#101014}
.card .material-field:focus-within span,.card .material-field:has(input:not(:placeholder-shown)) span{background:var(--card)}
dialog .material-field:focus-within span,dialog .material-field:has(input:not(:placeholder-shown)) span{background:#27262e}
#athlete-form .material-field:not(:focus-within):has(input:placeholder-shown) span{background:transparent}
.sheet-handle{display:grid;place-items:center;height:28px;touch-action:none;cursor:grab}
.sheet-handle .grab{margin:0}
dialog{max-height:76dvh;overflow-y:auto;overscroll-behavior:contain}
dialog.expanded{height:90dvh;max-height:90dvh}
.plan-set{display:grid;grid-template-columns:24px repeat(2,minmax(0,1fr)) auto;gap:7px;align-items:center}
.plan-set:has(.material-field:nth-child(2):last-of-type){grid-template-columns:24px minmax(0,1fr) auto}
.plan-set .material-field{margin:8px 0}
.picker-result{display:flex;align-items:center;border-bottom:1px solid #ffffff16;gap:8px}
.picker-result label{display:flex;flex:1;min-width:0;align-items:center;gap:12px;padding:10px 0;cursor:pointer}
.picker-result input{width:18px;height:18px;min-height:0;accent-color:var(--accent);flex:none}
.picker-result small{display:block;color:var(--muted);margin-top:4px}
.results-count{margin-top:12px}

.picker-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.filter-chip{display:flex;overflow:hidden;border-radius:999px;background:#2a2a33}
.filter-chip button{min-width:0;flex:1;border-radius:0;padding-inline:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.filter-chip.is-filtered,.filter-chip.is-filtered button{background:#48292e;color:#ffafb4}
.filter-chip .clear-chip{flex:0 0 44px;padding:0;font-size:21px}
.body-icon{width:24px;height:30px;flex:none;color:#b5b4be}
.exercise-avatar{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;border-radius:50%;background:#302d36}
.picker-result button{padding:0;width:44px;background:transparent;color:#ffabb0;font-size:22px}
.filter-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.filter-option{position:relative;display:flex;align-items:center;gap:7px;min-height:52px;padding:6px 8px;border:1px solid #ffffff20;border-radius:10px;font-size:13px;cursor:pointer;overflow-wrap:anywhere}
.filter-option input{position:absolute;width:1px;height:1px;min-height:0;opacity:0;padding:0}
.filter-option:has(input:checked){background:#48292e;border-color:var(--accent);color:#ffafb4}
.filter-option:focus-within{outline:2px solid var(--accent);outline-offset:1px}
.equipment-symbol{color:#ffafb4;font-size:18px}
dialog:has(.filter-footer){height:min(76dvh,680px);overflow:hidden}
dialog[open]:has(.filter-footer){display:flex;flex-direction:column}
dialog.expanded:has(.filter-footer){height:90dvh}
dialog:has(.filter-footer) .sheet-handle{flex:none}
.filter-scroll{flex:1;overflow:auto;min-height:0;padding:6px 2px 12px}
.filter-scroll h3{font-size:13px;color:var(--muted);margin:15px 0 8px}
.filter-footer{flex:none;display:grid;grid-template-columns:1fr 1.15fr;gap:8px;padding-top:10px;border-top:1px solid #ffffff18}
.filter-footer button{margin:0;padding-inline:5px}
.detail-tabs{display:flex;gap:6px;margin-bottom:16px}
.detail-tabs button{flex:1;padding-inline:5px}
.detail-tabs [aria-pressed=true]{background:#48292e;color:#ffafb4}
.slide-in{animation:enter-detail .2s ease-out}
@keyframes enter-detail{from{transform:translateX(35px);opacity:.55}}
@media(prefers-reduced-motion:reduce){.slide-in{animation:none}}

.picker-result{border-radius:12px;gap:0}
.picker-result.is-selected{background:#ffd7dd;color:#32171c;border-bottom-color:transparent}
.picker-result.is-selected small,.picker-result.is-selected .exercise-info{color:#624c53}
.picker-result .exercise-select{width:auto;display:flex;flex:1;min-width:0;gap:12px;align-items:center;text-align:left;background:transparent;color:inherit;font-size:15px;padding:8px 10px;border-radius:12px}
.picker-result .exercise-info{flex:0 0 44px;color:var(--muted);display:grid;place-items:center}
.exercise-info svg{width:20px;height:20px}
.exercise-avatar{position:relative;width:48px;height:48px;flex:0 0 48px;background:#292831}
.exercise-avatar img{object-fit:cover;border-radius:50%;width:100%;height:100%}
.exercise-avatar.art-missing{background:#27262e}
.picker-result.is-selected .art-missing{background:#e9b7c0}
.picker-add[hidden]{display:none}
.picker-add{justify-content:stretch;box-shadow:0 -10px 32px #0005}
.picker-add .primary{margin:0;min-height:48px}

/* Compact, single-line picker rows and shared selection surfaces. */
:root{--selection:#ffd7dd;--on-selection:#32171c}
html{overflow-x:clip}
.picker-result{position:relative;border:0;border-radius:0;margin-block:2px;min-height:60px}
.picker-result::after{content:"";position:absolute;inset:auto 0 -1px;height:1px;background:#ffffff18;pointer-events:none}
.picker-result.is-selected{border-radius:0;background:var(--selection);color:var(--on-selection)}
.picker-result .exercise-select{font-size:14px;padding:6px 8px;gap:9px;border-radius:0}
.exercise-select > span:last-child{min-width:0;flex:1}
.exercise-select strong,.exercise-select small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.exercise-select small{font-size:11px;margin-top:3px}
.filter-chip.is-filtered,.filter-chip.is-filtered button{background:var(--selection);color:var(--on-selection)}
.filter-chip [data-build="filter"]{text-align:left;padding-inline:11px;font-size:13px}
.filter-chip [data-build="filter"] span{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.filter-chip .clear-chip{flex-basis:36px;font-size:18px}
.exercise-avatar,.exercise-avatar.art-missing,.picker-result.is-selected .art-missing{background:#fff}
.exercise-avatar img{object-fit:contain}
.exercise-avatar img.legacy-art{mix-blend-mode:normal}

.filter-option:has(input:checked){background:var(--selection);color:var(--on-selection);border-color:var(--selection)}
.filter-option:has(input:checked) .body-icon,.filter-option:has(input:checked) .equipment-symbol{color:var(--on-selection)}
.equipment-symbol{display:grid;place-items:center;width:28px;height:28px;flex:none}
.equipment-symbol svg{width:24px;height:24px}
.detail-top{position:sticky;top:0;z-index:3;width:min(100%,540px);margin-inline:auto;background:#15151bf0;backdrop-filter:blur(18px)}
.detail-top header{position:static;background:transparent;backdrop-filter:none}
header .detail-back{display:grid;place-items:center;width:38px;min-height:38px;padding:0;background:#ffffff14;border-radius:50%;color:inherit}
.detail-back svg{width:22px;height:22px}
.detail-top .detail-tabs{margin:0;padding:2px 14px 0;gap:0}
.detail-top .detail-tabs button{border-radius:0;background:transparent;color:var(--muted);font-size:12px;letter-spacing:.045em;text-transform:uppercase;border-bottom:2px solid transparent}
.detail-top .detail-tabs button[aria-pressed=true]{color:var(--accent);border-bottom-color:var(--accent)}
.exercise-detail h1{font-size:22px;line-height:1.2;letter-spacing:-.02em;margin:16px 0}
.detail-art{display:block;object-fit:contain;width:min(196px,100%);height:auto;aspect-ratio:1;margin:0 auto;border-radius:12px;background:white}

/* Shared selected state for exercise rows, filter options, and active chips. */
:root{--selection:#ff596d29;--selection-border:#ff596d;--on-selection:#fff0f2}
.filter-chip [data-build="filter"]{text-align:center}
.filter-chip.is-filtered [data-build="filter"]{text-align:left}
.filter-chip.is-filtered{background:#ff596d29;outline:1px solid var(--selection-border);outline-offset:-1px}
.filter-chip.is-filtered button{background:transparent}
.picker-result.is-selected{box-shadow:inset 0 0 0 1px var(--selection-border);border-radius:8px}
.picker-result.is-selected small,.picker-result.is-selected .exercise-info{color:#e5bcc3}
.filter-option:has(input:checked){border-color:var(--selection-border);box-shadow:inset 0 0 0 1px var(--selection-border)}

.bench-preview{position:relative;width:min(196px,100%);margin-inline:auto;aspect-ratio:1;overflow:hidden;border-radius:12px;background:white}
.bench-preview .detail-art{width:100%}
.filter-option .body-icon,.filter-option .equipment-symbol{width:38px;height:38px;flex:0 0 38px;padding:4px;border-radius:50%;background:#fff;color:#303540}
.filter-option:has(input:checked) .equipment-symbol,.filter-option:has(input:checked) .body-icon{color:#303540}
.filter-option{min-height:56px}
.equipment-symbol svg{width:29px;height:29px}
.detail-media{margin:-26px -20px 0;width:calc(100% + 40px);height:clamp(215px,60vw,300px);background:white;display:grid;place-items:center;overflow:hidden}
.detail-media .detail-art,.detail-media .bench-preview{display:block;width:100%;height:100%;object-fit:contain;margin:0;border-radius:0;aspect-ratio:auto}
.detail-media .bench-preview .detail-art{height:100%}
@media(max-width:355px){.detail-media{margin-inline:-10px;width:calc(100% + 20px)}}

.filter-avatar{display:block;width:38px;height:38px;flex:0 0 38px;object-fit:contain;border-radius:50%;background:white}
#sheet-title{text-align:center;margin:0 0 12px;flex:none}
.avatar-check{position:absolute;top:-2px;right:-3px;display:grid;place-items:center}