:root{--bg:#0c0c0f;--panel:#17181d;--panel-active:#26272e;--line:#2c2d35;--text:#fff;--muted:#9a9ca8;--fire:#ff5a1f;--heart:#ff2a55;--cadence:#35b6ff;--speed:#d6ff3d;--ok:#3dff8a;--warn:#ffb000;--stop:#ff2a55;--display:"Barlow Condensed", "Arial Narrow", system-ui, sans-serif;--body:"Barlow", system-ui, sans-serif;--cut:polygon(14px 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%, 0 14px)}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:var(--body);font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}.app{flex-direction:column;gap:20px;min-height:100%;padding:16px 24px 24px;display:flex;position:relative}.app:has(.cadence-bar){padding-bottom:40px}.cadence-bar{background:var(--panel);height:14px;position:absolute;bottom:0;left:0;right:0}.cadence-fill{background:var(--cadence);clip-path:polygon(0 0,100% 0,calc(100% - 14px) 100%,0 100%);height:100%}.cadence-target{background:var(--text);width:3px;position:absolute;top:-6px;bottom:-6px;transform:translate(-50%)}@media (prefers-reduced-motion:no-preference){.cadence-fill{transition:width .4s ease-out}}.top{justify-content:space-between;align-items:center;gap:16px;display:flex}.brand{font-family:var(--display);letter-spacing:.02em;text-transform:uppercase;font-size:34px;font-style:italic;font-weight:900}.brand:after{content:".";color:var(--fire)}a.brand{color:inherit;text-decoration:none}.help-link{width:52px;height:52px;font-family:var(--display);color:var(--text);background:var(--panel);clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);place-items:center;font-size:30px;font-weight:800;text-decoration:none;display:grid}.top-links{align-items:center;gap:10px;display:flex}.top-link{height:52px;font-family:var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--text);background:var(--panel);clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);place-items:center;padding:0 22px;font-size:22px;font-weight:700;text-decoration:none;display:grid}.sessions{margin:0;padding:0;list-style:none}.session{background:var(--panel);clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);margin-bottom:8px;padding:18px 20px}.session-date{color:var(--muted);font-size:16px;font-weight:700}.session-stats{flex-wrap:wrap;gap:8px 28px;margin-top:10px;display:flex}.stat{flex-direction:column;gap:4px;display:flex}.stat-value{font-family:var(--display);font-size:30px;font-style:italic;font-weight:800;line-height:1}.stat-label{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-size:13px;font-weight:700}.stat.power{color:var(--fire)}.stat.cadence{color:var(--cadence)}.stat.speed{color:var(--speed)}.stat.heart{color:var(--heart)}.help-body{flex:1;width:100%;max-width:720px;margin:0 auto}.help-body h1{font-family:var(--display);text-transform:uppercase;margin:0 0 16px;font-size:56px;font-style:italic;font-weight:900}.help-body p{color:var(--muted);font-size:20px;line-height:1.5}.help-body h1+h1,.faq+.action{margin-top:40px}.help-body h1:nth-of-type(2){margin-top:48px}.steps{color:var(--muted);margin:0;padding-left:28px;font-size:20px;line-height:1.5}.steps li{margin-bottom:14px}.steps strong{color:var(--text)}.faq details{background:var(--panel);clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);margin-bottom:8px}.faq summary{cursor:pointer;padding:16px 20px;font-size:20px;font-weight:700;list-style:none}.faq summary::-webkit-details-marker{display:none}.faq summary:before{content:"+";color:var(--fire);font-family:var(--display);margin-right:12px;font-weight:800}.faq details[open] summary:before{content:"−"}.faq p{margin:0;padding:0 20px 18px 44px;font-size:18px}a.action{text-align:center;flex:none;width:auto;margin-top:24px;line-height:1.6;text-decoration:none;display:inline-block}.timer{font-family:var(--display);letter-spacing:-.01em;font-size:80px;font-style:italic;font-weight:800;line-height:1}.none{color:var(--muted);vertical-align:middle;font-size:.4em;font-weight:400}.chips{flex-wrap:wrap;justify-content:flex-end;gap:10px;display:flex}.chip{font:inherit;font-family:var(--display);letter-spacing:.06em;text-transform:uppercase;clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);cursor:default;border:0;min-height:48px;padding:10px 18px;font-size:20px;font-weight:700}.chip.ok{background:var(--ok);color:var(--bg)}.chip.busy{background:var(--warn);color:var(--bg)}.chip.down{background:var(--stop);color:#fff;cursor:pointer}.chip:disabled{opacity:1}.cards{flex:1;grid-template-columns:repeat(3,1fr);align-content:center;gap:20px;display:grid}.card{border:0;border-top:4px solid var(--line);min-height:260px;clip-path:var(--cut);background:var(--panel);color:var(--text);text-align:left;font:inherit;cursor:pointer;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:10px;padding:28px;display:flex}.card:active{background:var(--panel-active)}.card:disabled{cursor:default;opacity:.8}.card.connected{border-top-color:var(--ok)}.card.connecting{border-top-color:var(--warn)}.card.error{border-top-color:var(--stop)}.card-title{font-family:var(--display);text-transform:uppercase;font-size:56px;font-style:italic;font-weight:900;line-height:1}.card-state{color:var(--muted);font-size:20px;font-weight:700}.card.connected .card-state{color:var(--ok)}.card.error .card-state{color:var(--stop)}.card-hint{color:var(--muted);opacity:.8;font-size:15px}.save-status{font-family:var(--display);letter-spacing:.06em;text-transform:uppercase;clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);background:var(--panel);color:var(--muted);padding:10px 18px;font-size:20px;font-weight:700}.save-status.saved{background:var(--ok);color:var(--bg)}.save-status.error{background:var(--stop);color:#fff}.results{flex:1;grid-template-columns:repeat(4,1fr);align-content:center;gap:20px;display:grid}.result{text-align:center;background:var(--panel);clip-path:var(--cut);border-top:4px solid var(--text);padding:32px 12px}.result.power{border-top-color:var(--fire)}.result.cadence{border-top-color:var(--cadence)}.result.speed{border-top-color:var(--speed)}.result.heart{border-top-color:var(--heart)}.result-value{font-family:var(--display);font-size:clamp(56px,8vw,96px);font-style:italic;font-weight:900;line-height:1}.result-label{font-family:var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:10px;font-size:20px;font-weight:600}.hero{flex-direction:column;flex:1;justify-content:center;align-items:center;line-height:1;display:flex}.hero-value{font-family:var(--display);letter-spacing:-.02em;font-size:clamp(140px,30vw,300px);font-style:italic;font-weight:900}.hero-unit{font-family:var(--display);letter-spacing:.18em;text-transform:uppercase;color:var(--fire);margin-top:4px;font-size:32px;font-weight:600}.secondary{grid-template-columns:repeat(3,1fr);gap:16px;display:grid}.metric{text-align:center;background:var(--panel);clip-path:var(--cut);border-top:3px solid var(--line);padding:18px 8px}.metric.cadence{border-top-color:var(--cadence)}.metric.heart{border-top-color:var(--heart)}.metric.speed{border-top-color:var(--speed)}.metric-value{font-family:var(--display);font-size:clamp(56px,9vw,84px);font-style:italic;font-weight:800;line-height:1}.metric-label{font-family:var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:6px;font-size:20px;font-weight:600}.metric.cadence .metric-value{color:var(--cadence)}.metric.heart .metric-value{color:var(--heart)}.metric.speed .metric-value{color:var(--speed)}.resistance{align-items:stretch;gap:20px;display:flex}.resistance-value{flex-direction:column;justify-content:center;align-items:center;min-width:140px;line-height:1;display:flex}.resistance-value span{font-family:var(--display);font-size:64px;font-style:italic;font-weight:800}.resistance-value small{font-family:var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:6px;font-size:18px;font-weight:600}.bump{height:140px;clip-path:var(--cut);background:var(--panel);color:var(--fire);font:inherit;font-family:var(--display);cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;border:0;flex:1;font-size:96px;font-weight:600}.bump:active{background:var(--panel-active)}.bump:disabled{opacity:.25;cursor:default}.bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;min-height:72px;display:flex}.summary{font-family:var(--display);letter-spacing:.04em;text-transform:uppercase;color:var(--muted);gap:20px;font-size:22px;font-weight:600;display:flex}.confirm{align-items:center;gap:12px;margin-left:auto;font-size:20px;display:flex}.action{font:inherit;font-family:var(--display);letter-spacing:.06em;text-transform:uppercase;clip-path:polygon(16px 0,100% 0,calc(100% - 16px) 100%,0 100%);background:var(--text);color:var(--bg);cursor:pointer;border:0;min-height:72px;margin-left:auto;padding:16px 40px;font-size:26px;font-style:italic;font-weight:800}.action.start{background:var(--fire);color:#fff;flex:1;min-height:88px;font-size:34px}.action.stop{background:var(--stop);color:#fff;min-height:56px;padding:12px 28px;font-size:18px}.action.ghost{color:var(--text);border:2px solid var(--muted);background:0 0;margin-left:0}.confirm .action{margin-left:0}.action:disabled{opacity:.35;cursor:default}button:focus-visible{outline-offset:3px;outline:3px solid #fff}@media (prefers-reduced-motion:no-preference){.bump,.action{transition:background .12s}}@media (width<=640px){.app{padding:12px 16px 16px}.cards{grid-template-columns:1fr}.results{grid-template-columns:repeat(2,1fr);gap:12px}.card{min-height:140px}.card-title{font-size:40px}.secondary{gap:10px}.metric-value{font-size:40px}.bump{height:110px;font-size:64px}.timer{font-size:40px}}
