:root{--ink:#243e47;--muted:#5b7077;--blue:#1c77ba;--teal:#137e73;--paper:#f5f8fb;--border:#d3e0e7;--orange:#d67d24}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.5 "Segoe UI",system-ui,sans-serif}button,input,select{font:inherit}a{color:var(--blue)}button{cursor:pointer;border:2px solid var(--border);border-radius:13px;background:#fff;color:var(--ink);padding:11px 14px;font-weight:650;min-height:47px}button:hover{border-color:#6babc9}button[aria-pressed=true],button.active{border-color:var(--teal);background:#e0f2e8}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #e5a333;outline-offset:3px}[hidden]{display:none!important}.site-head{max-width:1380px;margin:auto;padding:14px 24px 9px;display:flex;justify-content:space-between;align-items:center;gap:16px}.site-head a{text-decoration:none;font-size:15px}.site-head .brand{font-weight:750;color:var(--ink)}.site-head .brand span{font-weight:400;color:var(--muted);margin-left:8px}.site-head .home{font-size:13px}.page{max-width:1380px;margin:auto;padding:9px 24px 24px}h1{font-size:25px;margin:0 0 12px;font-weight:700}h2{font-size:21px;margin:0 0 12px}h3{font-size:18px;margin:0 0 8px}p{margin:0}p+p{margin-top:10px}.app-tabs{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:18px}.app-tabs a{display:flex;align-items:center;gap:8px;padding:11px 17px;border:2px solid #cbdce5;border-radius:12px;background:#fff;text-decoration:none;color:var(--ink);font-size:15px;font-weight:650;min-height:48px}.app-tabs a[aria-current=page]{background:#dff0e7;border-color:var(--teal);color:#12574e}.app-tabs svg{width:23px;height:23px;flex:none}.playgrid{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:18px;align-items:start}.picture{background:#fff;border:1px solid var(--border);border-radius:20px;overflow:hidden;min-width:0}.picture>svg,.picture>canvas{display:block;width:100%;height:auto}.observation{margin:0;padding:14px 19px;min-height:58px;background:#e8f1f4;color:#284e60;font-size:17px;font-weight:600;border-top:1px solid #cfe0e7}.control-panel{padding:18px;background:#fff;border:1px solid var(--border);border-radius:20px;display:flex;flex-direction:column;gap:17px}.control-panel h2{font-size:18px;margin:0}.control{min-width:0}.control label,.control .label{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-weight:650;font-size:16px;margin-bottom:4px}.control output{font-size:13px;color:var(--muted);font-weight:500}.control input[type=range]{width:100%;height:37px;accent-color:var(--teal);margin:0;cursor:pointer}.range-ends{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;margin-top:-2px}.group{display:flex;gap:6px;flex-wrap:wrap}.group button{flex:1;font-size:14px;padding:9px 8px;white-space:nowrap}.actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.actions button{padding:11px 7px;font-size:15px}.primary{background:var(--teal);color:#fff;border-color:var(--teal)}.primary[aria-pressed=true]{background:var(--teal);color:#fff}.replace{background:#fff0db;border-color:#dfac63}.readout{font-size:14px;color:var(--muted);text-align:center}.readout b{color:var(--ink)}.prompt{font-size:14px;color:#4e6d61;margin:15px 2px 0}.detail{margin-top:22px;border-top:1px solid var(--border);padding:14px 2px}.detail summary{font-size:15px;font-weight:650;cursor:pointer;min-height:38px;padding:5px 0}.detail-body{max-width:950px;padding:10px 0 20px;color:var(--muted);font-size:15px}.detail-body h3{margin-top:18px;color:var(--ink)}.detail-body table{border-collapse:collapse;width:100%;margin:15px 0;font-size:14px}.detail-body th,.detail-body td{padding:7px 10px;border-bottom:1px solid var(--border);text-align:left}.detail-body th{font-weight:500}.detail-body .numeric{font-variant-numeric:tabular-nums}.simple-note{font-size:12px;color:var(--muted);margin-top:15px}.control-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.control-heading button{font-size:12px;min-height:35px;padding:5px 9px}.bulb-shape{transition:fill .1s}.app-footer{display:flex;gap:18px;justify-content:space-between;padding:14px 0 0;border-top:1px solid var(--border);font-size:12px;color:var(--muted)}.app-footer a{color:var(--muted)}.thermal-buttons button{font-size:13px}.rcards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px}.rcard{padding:5px 2px;border-radius:10px;min-height:78px;display:flex;flex-direction:column;align-items:center;justify-content:center}.rcard .top{display:flex;flex-direction:column;align-items:center}.rcard .pic{display:block;width:49px;height:49px}.rcard .nm{font-size:10px;font-weight:700;line-height:1.2;white-space:normal}.rcard .pers,.rcard .stats,.rcard .figs{display:none}.rcard .stam{font-size:0;width:80%}.stambar{height:4px;display:block;background:#e0e6eb;border-radius:4px;overflow:hidden;margin-top:4px}.stambar i{height:100%;display:block;background:#3f9a6b}.stambar.low i{background:#df7842}#sprint{background:#ffebbc;border-color:#d9aa4c;user-select:none;touch-action:none;min-height:54px}#sprint.on{background:#ebae44;color:#172d36}#pushOut,#spinOut{font-size:12px;font-weight:400}#pushCap,#spinCap{font-size:12px;color:var(--muted);line-height:1.35;margin-top:2px}.bulbs{display:flex;gap:5px}.bulbs button{font-size:13px;padding:10px 7px;flex:1}.bulbs button span{display:block;font-size:11px;font-weight:400}.bulbs button.active{border-color:#d69b3e;background:#fff0cf}.switch{display:flex;align-items:center;gap:8px;border:0;background:transparent;padding:3px 0;text-align:left;font-size:13px}.switch .track{width:49px;height:27px;flex:none;border-radius:16px;background:#aebbc7;position:relative}.switch .knob{position:absolute;left:3px;top:3px;width:21px;height:21px;border-radius:50%;background:#fff}.switch[aria-checked=true] .track{background:var(--teal)}.switch[aria-checked=true] .knob{left:25px}.switch .lbl-off,.switch .lbl-on{font-weight:500}.switch[aria-checked=false] .lbl-on,.switch[aria-checked=true] .lbl-off{opacity:.5}.formula{font-size:20px;margin:15px 0}.dialrow,.gearwrap,.facts,.legend{display:grid;grid-template-columns:1fr 1fr;gap:18px}.dialrow svg,.gearwrap svg{width:100%;height:auto}.ggrid{width:100%}.ggrid button{padding:5px;font-size:12px;min-height:35px;width:100%}.ggrid th{font-size:11px}.ggrid small{font-size:10px}.ggrid .sel{border-color:#cc8a25}.sources{font-size:13px;overflow-wrap:anywhere}.detail-body .rcards{display:none}.mini-stats{display:flex;justify-content:space-around;gap:12px;font-size:14px;padding:12px;border-top:1px solid var(--border);background:#f5f8fa}.mini-stats b{font-weight:650}.thermal-value{font-size:22px;font-weight:650}.challenge-buttons{display:flex;gap:7px;flex-wrap:wrap}.challenge-buttons button{font-size:12px;padding:6px 10px;min-height:36px;font-weight:500}svg text{font-family:"Segoe UI",system-ui,sans-serif}
@media(max-width:1000px){.playgrid{grid-template-columns:minmax(0,1fr) 310px}.control-panel{padding:15px;gap:14px}.page{padding:9px 18px 20px}.site-head{padding:13px 18px 8px}.app-tabs a{padding:9px 13px;font-size:14px}.observation{font-size:15px}.rcard .pic{width:44px;height:44px}}
@media(max-width:760px){.playgrid{grid-template-columns:1fr;gap:12px}.control-panel{display:grid;grid-template-columns:1fr 1fr;gap:14px}.control-heading,.control-panel>.wide,.control-panel>.readout,.control-panel>.actions{grid-column:1/-1}.control-panel>.control:nth-child(2){grid-column:1/-1}.control-panel .group{gap:4px}.control label,.control .label{font-size:14px}.picture>svg{max-height:360px}.app-tabs{gap:5px;margin-bottom:13px}.app-tabs a{font-size:13px;min-height:46px;padding:8px 11px}.app-tabs svg{width:20px;height:20px}.picture{border-radius:15px}.control-panel{border-radius:15px}.site-head{padding-bottom:4px}h1{margin-bottom:9px;font-size:22px}.observation{padding:11px 15px;min-height:48px}.rcards{gap:7px}.rcard .pic{width:48px;height:48px}.rcard .nm{font-size:11px}.rcard{min-height:81px}.detail{margin-top:16px}.group button{font-size:13px}.detail-body{font-size:14px}}
@media(max-width:440px){.page{padding:8px 11px 15px}.site-head{padding:11px}.site-head .brand{font-size:14px}.site-head .home{font-size:11px}.app-tabs a{font-size:12px;gap:5px;padding:7px 9px}.app-tabs svg{width:18px;height:18px}.control-panel{padding:13px;gap:13px}.control-panel h2{font-size:16px}.control output{font-size:11px}.range-ends{font-size:11px}.control-panel>.actions button{font-size:14px}.group button{font-size:12px;padding:9px 6px}.app-footer{font-size:11px;gap:8px}.observation{font-size:14px}.mini-stats{font-size:12px}.rcards{gap:3px}.rcard .pic{width:44px;height:44px}.rcard .nm{font-size:10px}#pushCap,#spinCap{font-size:11px}.dialrow,.gearwrap,.facts,.legend{grid-template-columns:1fr}.detail-body table{font-size:12px}.prompt{font-size:12px}.thermal-buttons button{font-size:12px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--border);background:#fff}.metric{padding:14px 17px;border-right:1px solid var(--border);min-width:0}.metric:last-child{border:0}.metric>span{display:block;font-size:12px;color:var(--muted)}.metric strong{display:block;font-size:clamp(20px,2.5vw,31px);line-height:1.4;font-variant-numeric:tabular-nums}.metric small{display:block;font-size:12px;color:var(--muted)}.voltage strong{color:#2377b1}.current strong{color:#147f68}.power strong{color:#ab6b16}.live-equation{font-size:14px;font-variant-numeric:tabular-nums;padding:12px 17px;background:#f4f7fa;border-top:1px solid var(--border)}.small-meters{display:flex;justify-content:space-around;gap:10px;padding:12px;font-size:13px;border-top:1px solid var(--border);background:#fff}.control-note{font-size:13px;line-height:1.5;color:var(--muted)}.control-drawer{border-top:1px solid var(--border);padding-top:10px}.control-drawer summary{cursor:pointer;font-size:15px;font-weight:650;min-height:38px;padding:5px 0}.drawer-content{display:grid;gap:13px;padding:5px 0 8px}.control-panel{gap:12px}.control-panel select{width:100%;font-size:15px;padding:8px 10px;border:2px solid var(--border);border-radius:10px;background:#fff;color:var(--ink);min-height:44px}.check{display:flex;align-items:center;gap:9px;font-size:14px;cursor:pointer;min-height:40px}.check input{width:22px;height:22px;accent-color:var(--teal);flex:none}.equations{white-space:pre-line;line-height:1.9;font-variant-numeric:tabular-nums;background:#edf3f7;padding:15px;border-radius:10px;font-size:15px;margin:14px 0;overflow-wrap:anywhere}.battery-control{font-size:13px;display:grid;gap:7px}.battery-control progress{width:100%;height:13px;accent-color:var(--teal)}.battery-control button{min-height:37px;font-size:12px;padding:5px}.picture{position:sticky;top:14px}.control-panel button:disabled{opacity:.45;cursor:default}.app-tabs{flex-wrap:nowrap}.app-tabs a{min-width:118px;justify-content:center;font-size:16px}.visible-formula{margin:0;padding:13px 18px;background:#fff;border-top:1px solid var(--border);font-size:18px}.visible-formula .flbl{font-size:12px}.detail-body h2{font-size:20px;margin:21px 0 9px}.detail-body th{font-weight:600}.detail-body table{background:#fff}.detail{margin-top:22px}.control-panel>.control:nth-child(2){grid-column:auto}
@media(max-width:1000px){.metric{padding:11px}.metric strong{font-size:24px}.metric small{font-size:11px}.live-equation{font-size:12px}.control-panel{gap:10px}.small-meters{font-size:12px}}
@media(max-width:760px){.picture{position:static}.control-panel{display:flex}.metric strong{font-size:22px}.metric>span{font-size:11px}.metric small{font-size:10px}.live-equation{font-size:12px}.app-tabs a{flex:1;min-width:0;padding:11px 9px;font-size:15px}.small-meters{flex-wrap:wrap;font-size:12px}.drawer-content{grid-template-columns:1fr 1fr;gap:13px}.drawer-content>.control:first-child,.drawer-content>.check,.drawer-content>.control-note,.drawer-content>.group{grid-column:1/-1}.control-panel .control input[type=range]{height:41px}.control-drawer summary{font-size:16px;min-height:44px}.control-panel .actions button{min-height:49px}.metrics{min-height:118px}.control-heading h2{font-size:19px}.control-note{font-size:13px}}
@media(max-width:440px){.metric{padding:9px 8px}.metric strong{font-size:19px}.metric small{font-size:10px}.metric>span{font-size:10px}.live-equation{padding:10px;font-size:11px}.drawer-content{grid-template-columns:1fr}.app-tabs a{font-size:14px}.visible-formula{font-size:16px;padding:10px}.equations{font-size:13px}.picture>svg{max-height:none}.app-tabs{margin-bottom:12px}}
/* Bicycle details: keep controls and numerical readouts legible. */
.bike-advanced{max-width:1050px}
.bike-advanced .gearwrap{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:24px;align-items:center;margin:14px 0 22px}
.bike-advanced .gearwrap>*{min-width:0}
.bike-advanced table.ggrid{border-collapse:separate;border-spacing:4px;table-layout:fixed;width:100%;margin:0;background:transparent}
.bike-advanced .ggrid th,.bike-advanced .ggrid td{padding:0;border:0;text-align:center;vertical-align:middle}
.bike-advanced .ggrid th{font-size:12px;line-height:1.4;font-weight:600}
.bike-advanced .ggrid th.corner{width:46px;text-align:left;white-space:nowrap}
.bike-advanced .ggrid th small{display:block;font-size:11px;font-weight:400}
.bike-advanced .gcell{width:100%;min-width:0;min-height:58px;padding:7px 1px;border-radius:9px;border:2px solid transparent;font-size:14px;line-height:1.25;white-space:nowrap;font-variant-numeric:tabular-nums;color:#243e47}
.bike-advanced .gcell small{display:block;margin-top:4px;font-size:11px;line-height:1.2;font-weight:400;white-space:nowrap}
.bike-advanced .gcell.dark{color:#fff}
.bike-advanced .gcell.sel{border-color:#956312;box-shadow:0 0 0 2px #dfb258}
.bike-advanced .gcell:focus-visible{outline:3px solid #243e47;outline-offset:2px}
.bike-advanced #drive svg{display:block;max-width:420px;width:100%;height:auto;margin:auto}
.bike-advanced .gear-meaning{text-align:center;font-size:14px;line-height:1.4;margin-top:8px;color:var(--ink);font-variant-numeric:tabular-nums}
.bike-measurements{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0 16px}
.bike-measurements>div{padding:12px;background:#fff;border:1px solid var(--border);border-radius:10px;min-width:0}
.bike-measurements dt{font-size:12px;line-height:1.4;color:var(--muted)}
.bike-measurements dd{font-size:21px;font-weight:650;color:var(--ink);font-variant-numeric:tabular-nums;margin:7px 0 0}
#ctlPush output,#ctlSpin output{display:block;flex:none;font-size:12px;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap;color:#375e68}
.bike-advanced .facts{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:14px 0}
.bike-advanced .fact{padding:12px;border:1px solid var(--border);border-radius:10px;background:#fff;min-width:0;line-height:1.45}
.bike-advanced .fact b{display:block;font-size:21px;font-weight:650;margin-bottom:4px;color:#9b651b;font-variant-numeric:tabular-nums}
.bike-advanced .fact span{display:block;font-size:12px;margin-top:4px;color:var(--muted)}
.bike-advanced .equations{font-size:14px;line-height:1.75}
@media(max-width:900px){.bike-advanced .gearwrap{grid-template-columns:1fr;gap:14px;max-width:600px}.bike-advanced #drive svg{max-width:380px}.bike-measurements{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:440px){.bike-advanced table.ggrid{border-spacing:3px}.bike-advanced .ggrid th.corner{width:39px}.bike-advanced .ggrid th{font-size:10px}.bike-advanced .ggrid th small{font-size:9px}.bike-advanced .gcell{font-size:12px;min-height:53px;padding:6px 0}.bike-advanced .gcell small{font-size:9px}.bike-measurements dd{font-size:19px}.bike-measurements dt{font-size:11px}.bike-advanced .equations{font-size:13px}#ctlPush output,#ctlSpin output{font-size:12px}.bike-advanced .facts{grid-template-columns:1fr 1fr}.bike-advanced .fact{padding:10px;font-size:13px}}