.workout-page { --w-accent:#bbcbff; --w-muted:#9ba9c0; --w-line:#d8e4ff20; }
.workout-page [hidden] { display:none !important; }
.workout-page #field { opacity:.2; }
.workout-page .site-name { margin-right:auto; font-size:.9rem; letter-spacing:-.02em; }
.workout-main { max-width:1280px; margin:auto; padding:20px 44px 0; }
.workout-hero { display:grid; grid-template-columns:1.5fr 1fr; align-items:center; gap:32px; padding:35px 0 55px; }
.workout-page .eyebrow { color:var(--w-accent); font-size:.67rem; letter-spacing:.18em; margin:0 0 16px; }
.workout-hero h1 { font-size:clamp(2.8rem,5.8vw,5.1rem); line-height:1.03; letter-spacing:-.065em; font-weight:500; margin:0 0 22px; max-width:640px; }
.workout-hero h1 span { color:var(--w-accent); }
.workout-hero .hero-copy { color:var(--w-muted); font-size:1.08rem; line-height:1.7; margin:0; }
.hero-links { display:flex; align-items:center; flex-wrap:wrap; gap:24px; margin-top:28px; }
.workout-page a { color:var(--w-accent); text-underline-offset:4px; }
.hero-links a { font-size:.83rem; }
.training-art { position:relative; min-height:300px; display:grid; place-items:center; }
.training-art svg { width:100%; max-width:330px; filter:drop-shadow(0 10px 36px #859dff28); transform:translateY(-8px); }
.art-orbit { position:absolute; width:260px; height:260px; border:1px solid #aabfff20; border-radius:50%; box-shadow:0 0 85px #859dff0c inset; }
.orbit-two { width:310px; height:180px; transform:rotate(-28deg); border-style:dashed; }
.art-label { position:absolute; bottom:0; letter-spacing:.24em; font-size:.56rem; color:#93a4c5; }
.account-bar { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 0 24px; border-bottom:1px solid var(--w-line); font-size:.8rem; color:var(--w-muted); margin-bottom:30px; }
.account-bar>div:first-child { display:flex; align-items:center; gap:9px; }
.status-dot { width:6px; height:6px; background:#78869f; border-radius:50%; flex-shrink:0; }
.status-dot.connected { background:#9de2bc; box-shadow:0 0 12px #9de2bc55; }
.connection-message { border:1px solid #bbcbff30; border-radius:10px; padding:16px 20px; color:#c3cce1; background:#111b2b; line-height:1.7; font-size:.84rem; margin:0 0 26px; }
.workout-layout { display:grid; grid-template-columns:minmax(280px, .85fr) minmax(0,1.6fr); align-items:start; gap:22px; }
.w-panel { padding:28px; background:linear-gradient(140deg,#151d2beb,#0b111ced); border:1px solid var(--w-line); border-radius:18px; min-width:0; }
.workout-page h2 { font-size:1.38rem; line-height:1.25; font-weight:500; letter-spacing:-.035em; margin:0; }
.workout-page h3 { font-weight:500; }
.w-muted { color:var(--w-muted); line-height:1.65; font-size:.85rem; }
.w-caption { color:var(--w-muted); font-size:.73rem; line-height:1.65; }
.workout-page label { display:flex; flex-direction:column; gap:8px; font-size:.76rem; color:#b6c3d8; }
.workout-page input:not([type=checkbox]), .workout-page select { width:100%; min-width:0; background:#0b111d; border:1px solid #d3e2ff28; color:#e9eef5; border-radius:8px; font:inherit; padding:11px 10px; min-height:42px; }
.workout-page input:disabled, .workout-page select:disabled { opacity:.5; cursor:not-allowed; }
.workout-page button { font-family:inherit; }
.workout-page .w-btn { display:inline-flex; justify-content:center; align-items:center; gap:15px; border:1px solid #d3e2ff30; border-radius:9px; background:#ffffff05; padding:12px 16px; min-height:44px; color:#e9eef5; font:inherit; font-size:.8rem; text-decoration:none; cursor:pointer; transition:background .15s,transform .15s; }
.workout-page .w-btn:hover { background:#ffffff10; }
.workout-page .w-primary { background:#bdccff; color:#0b142d; border-color:#bdccff; font-weight:600; }
.workout-page .w-primary:hover { background:#d1ddff; }
.workout-page .w-btn:disabled { opacity:.45; cursor:not-allowed; }
.w-wide { width:100%; }
.workout-page .w-small { padding:9px 12px; font-size:.74rem; }
.muscle-field { padding:0; margin:24px 0 14px; border:0; }
.muscle-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.workout-page .muscle-option { position:relative; flex-direction:row; align-items:center; justify-content:space-between; gap:8px; padding:13px 12px; border:1px solid var(--w-line); border-radius:9px; cursor:pointer; color:#bcc8dc; background:#ffffff02; transition:background .15s,border-color .15s; }
.muscle-option input { accent-color:#bdccff; width:15px; height:15px; margin:0; }
.muscle-option:has(:checked) { background:#b4c8ff14; border-color:#b4c8ff80; color:#e9eef5; }
.presets { display:flex; flex-wrap:wrap; gap:4px; margin-bottom:24px; }
.presets button { border:0; background:transparent; color:#9eacc4; padding:9px 8px; font-size:.71rem; cursor:pointer; border-radius:5px; min-height:36px; }
.presets button:hover { color:#dce5ff; background:#ffffff08; }
.builder-options { display:grid; gap:15px; }
.builder-footnote { color:#8d9bb2; font-size:.7rem; line-height:1.7; margin:24px 0 0; border-top:1px solid var(--w-line); padding-top:18px; }
.section-top { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; }
.w-tag { flex-shrink:0; display:inline-flex; padding:7px 10px; font-size:.63rem; border:1px solid var(--w-line); border-radius:30px; color:#a6b5cc; }
.session-empty { min-height:435px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:36px 24px; }
.empty-icon { display:grid; place-items:center; width:62px; height:62px; font-size:1.7rem; border:1px solid #b9cdff30; border-radius:19px; color:#bed1fa; background:#b4c8ff08; transform:rotate(-5deg); }
.session-empty h3 { font-size:1.5rem; letter-spacing:-.04em; line-height:1.4; margin-bottom:8px; }
.session-empty p { max-width:290px; color:var(--w-muted); font-size:.86rem; line-height:1.7; }
.session-empty .w-caption { margin-top:20px; }
.session-meta { display:grid; grid-template-columns:minmax(0,1fr) 135px 75px; gap:12px; margin-top:26px; }
.logging-hint { padding:12px 14px; font-size:.75rem; line-height:1.6; background:#b4c8ff08; border-radius:8px; color:#bdcae5; }
.exercise-card { border:1px solid var(--w-line); border-radius:12px; margin:18px 0; padding:18px; background:#080e1866; }
.exercise-heading { display:flex; gap:12px; align-items:center; }
.exercise-number { font-size:.7rem; color:#9eafd2; border:1px solid var(--w-line); border-radius:8px; width:31px; height:31px; display:grid; place-items:center; flex-shrink:0; }
.exercise-heading h3 { font-size:.98rem; margin:0 0 5px; line-height:1.4; }
.exercise-heading p { margin:0; color:var(--w-muted); font-size:.7rem; }
.exercise-heading .w-btn { margin-left:auto; }
.exercise-cue { color:#99aac2; font-size:.74rem; line-height:1.7; margin:13px 0; }
.last-time { margin:15px 0 19px; padding:13px 14px; border:1px solid #bbcbff24; border-radius:9px; background:#b4c8ff06; }
.last-time>.w-caption { margin:0; }
.last-time-heading { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; color:#c7d4f4; font-size:.74rem; }
.last-time-heading strong { font-weight:500; }
.last-time-heading time { color:#a9b7d1; font-size:.7rem; }
.last-time-sets { list-style:none; padding:0; margin:11px 0 0; display:grid; gap:9px; }
.last-time-sets li { display:grid; grid-template-columns:42px minmax(0,1fr) minmax(70px,auto); gap:8px; align-items:baseline; font-size:.72rem; line-height:1.55; }
.last-time-sets strong { color:#e0e8f9; font-weight:500; }
.last-time-set-number { color:#9aabc7; font-size:.66rem; }
.last-time-sets li>span:last-child { text-align:right; font-size:.68rem; }
.last-time-note { margin:11px 0 0; font-size:.65rem; line-height:1.6; color:#9baccb; }
.last-time .w-btn { margin-top:9px; }
@media(max-width:480px) { .last-time { padding:12px 10px; }.last-time-sets li { grid-template-columns:34px minmax(0,1fr); gap:3px 8px; }.last-time-sets li>span:last-child { grid-column:2; text-align:left; } }
.set-head, .set-row { display:grid; grid-template-columns:26px .9fr 1fr .9fr 1.55fr; align-items:center; gap:8px; }
.set-head { color:#99aac2; font-size:.63rem; margin:16px 0 9px; }
.set-row { margin:7px 0; font-size:.76rem; }
.set-row>span { color:#95a4bc; font-size:.7rem; }
.workout-page .set-row input, .workout-page .set-row select { padding:9px 7px; font-size:.73rem; }
.set-row[data-result=success] { border-left:2px solid #87cda9; padding-left:6px; margin-left:-8px; }
.set-row[data-result=missed] { border-left:2px solid #e5b17e; padding-left:6px; margin-left:-8px; }
.set-actions { display:flex; gap:10px; margin-top:14px; }
.set-actions .w-btn { font-size:.67rem; min-height:36px; padding:7px 10px; }
.workout-page .share-control { flex-direction:row; align-items:flex-start; gap:11px; padding:18px 0; border-top:1px solid var(--w-line); margin-top:24px; color:#e1e8f5; font-size:.8rem; line-height:1.5; }
.share-control input { margin:3px 0 0; width:17px; height:17px; accent-color:#bdccff; flex-shrink:0; }
.share-control small { display:block; margin-top:4px; color:var(--w-muted); font-size:.7rem; }
.save-row { display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.w-message { font-size:.8rem; line-height:1.6; overflow-wrap:anywhere; }
.w-message:empty { display:none; }
.w-message.error { color:#ffb6ad; }
.w-message.ok { color:#a6e2c3; }
.history-section { margin:64px 0 50px; }
.history-filters { display:flex; gap:16px; margin:26px 0 16px; }
.history-filters label { width:200px; max-width:50%; }
.history-list { display:grid; gap:12px; margin:18px 0; }
.history-card { border:1px solid var(--w-line); border-radius:13px; background:#101825dc; overflow:hidden; }
.workout-page .history-card>summary { display:flex; align-items:center; border:0; border-radius:0; padding:22px; gap:18px; letter-spacing:0; }
.history-card>summary::after { content:'+'; font-size:1.35rem; color:var(--w-accent); margin-left:auto; }
.history-card[open]>summary::after { content:'−'; }
.history-date { color:#a6b9dc; font-size:.77rem; line-height:1.7; min-width:75px; }
.history-date strong { display:block; font-size:1.4rem; color:#dce5f5; font-weight:500; }
.history-title { display:block; font-size:1rem; line-height:1.5; margin-bottom:6px; overflow-wrap:anywhere; }
.history-meta { display:block; font-size:.73rem; color:var(--w-muted); line-height:1.6; }
.history-body { padding:0 22px 24px; border-top:1px solid var(--w-line); }
.history-exercise { margin:22px 0; }
.history-exercise h3 { font-size:.95rem; }
.history-body table { border-collapse:collapse; width:100%; font-size:.78rem; table-layout:fixed; }
.history-body th { text-align:left; font-size:.65rem; color:#9cabc3; font-weight:400; }
.history-body th, .history-body td { padding:10px 6px; border-bottom:1px solid #ffffff09; overflow-wrap:anywhere; }
.history-body td:first-child, .history-body th:first-child { width:12%; }
.result-success { color:#a6e2c3; }.result-missed { color:#f0bd90; }.result-skipped { color:#a3aec1; }
.history-empty { border:1px dashed #d8e4ff25; border-radius:13px; padding:36px 24px; text-align:center; color:var(--w-muted); font-size:.85rem; line-height:1.7; }
.workout-footer { display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px; border-top:1px solid var(--w-line); padding:25px 0 36px; color:#8e9bb1; font-size:.68rem; }
.workout-page dialog { width:min(460px,calc(100% - 32px)); padding:28px; border:1px solid #bbcbff40; border-radius:18px; background:#101928; color:#e9eef5; box-shadow:0 24px 90px #0008; }
.workout-page dialog::backdrop { background:#020610c9; backdrop-filter:blur(6px); }
.workout-page dialog label { margin:20px 0; }.workout-page dialog p { line-height:1.7; font-size:.84rem; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(max-width:480px) { .workout-page .set-head,.workout-page .set-row { grid-template-columns:22px repeat(3,minmax(0,1fr)); gap:7px; }.workout-page .set-row { padding-bottom:10px; border-bottom:1px solid #ffffff0c; margin-bottom:10px; }.workout-page .set-head>span:last-child { display:none; }.workout-page .set-row select { grid-column:2/-1; grid-row:2; font-size:.78rem; padding:10px; }.workout-page .set-row::after { content:'↳'; grid-column:1; grid-row:2; color:#8497ba; }.workout-page .set-row input { font-size:.8rem; } }
@media(min-width:1000px) { .builder-panel { position:sticky; top:24px; } }
@media(max-width:1000px) { .workout-main { padding:15px 26px 0; }.workout-layout { grid-template-columns:minmax(255px,.8fr) minmax(0,1.2fr); }.w-panel { padding:22px; }.session-meta { grid-template-columns:1fr 85px; }.title-field { grid-column:1/-1; }.set-head,.set-row { grid-template-columns:20px .8fr 1fr .8fr 1.3fr; gap:5px; }.section-top { flex-wrap:wrap; }.training-art { min-height:260px; }.art-orbit { width:210px;height:210px; }.orbit-two { width:245px;height:160px; } }
@media(max-width:760px) { .workout-layout { grid-template-columns:1fr; }.workout-hero { grid-template-columns:1fr; gap:0; padding:30px 0; }.training-art { display:none; }.workout-hero h1 { max-width:540px; }.builder-options { grid-template-columns:1.5fr 1fr; }.muscle-grid { grid-template-columns:repeat(3,1fr); }.session-empty { min-height:310px; }.session-meta { grid-template-columns:minmax(0,1fr) 130px 75px; }.title-field { grid-column:auto; }.account-bar { align-items:flex-start; }.account-bar>div:first-child { line-height:1.65; }.account-actions { flex-shrink:0; }.history-section { margin-top:42px; } }
@media(max-width:480px) { .workout-main { padding:12px 16px 0; }.workout-hero h1 { font-size:3.2rem; }.w-panel { padding:20px 16px; }.muscle-grid { grid-template-columns:1fr 1fr; }.hero-links { gap:18px; }.workout-hero .hero-copy { font-size:1rem; }.session-meta { grid-template-columns:1fr 80px; }.title-field { grid-column:1/-1; }.exercise-card { padding:14px 10px; }.set-head,.set-row { grid-template-columns:18px .8fr 1fr .8fr 1.5fr; gap:5px; }.set-head { font-size:.59rem; }.workout-page .set-row input,.workout-page .set-row select { padding:8px 4px; font-size:.68rem; }.workout-page .history-card>summary { padding:18px 14px; gap:10px; }.history-body { padding:0 12px 18px; }.history-date { min-width:56px; font-size:.68rem; }.history-title { font-size:.89rem; }.history-body table { font-size:.69rem; }.history-body td,.history-body th { padding:10px 3px; }.account-bar { font-size:.72rem; } }
