:root{font-family:Arial,Helvetica,sans-serif;color:#172235;background:#f2f5f8;font-size:16px;--ink:#101c2d;--orange:#ff8a42;--blue:#1567a4;--border:#d8e0e8}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,summary,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #0c80d1;outline-offset:4px}input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #2986bd;outline-offset:2px}header{height:78px;padding:0 max(24px,calc((100vw - 1240px)/2));display:flex;align-items:center;justify-content:space-between;background:white;border-bottom:1px solid var(--border)}.brand{text-decoration:none;color:var(--ink);font-size:24px;font-weight:900;letter-spacing:-1px}.brand span{font-size:12px;letter-spacing:2px;margin-left:10px;font-weight:600}.header-note{font-size:12px;font-weight:700;letter-spacing:2px;color:#526579}main{max-width:1240px;margin:auto;padding:35px 24px 20px}.page-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:27px}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:700;margin:0 0 9px;color:#516778}h1{font-size:clamp(30px,4vw,44px);letter-spacing:-1.9px;margin:0;font-weight:800}h2{font-size:20px;letter-spacing:-.4px;margin:0}.unit-switch{display:flex;background:#e3e9ef;border-radius:8px;padding:4px;gap:4px}.unit-switch button{border:0;background:none;color:#536477;border-radius:5px;padding:9px 17px;font-weight:700}.unit-switch [aria-pressed=true]{background:white;color:#152338;box-shadow:0 1px 4px #0001}.workspace{display:grid;grid-template-columns:310px minmax(0,1fr);gap:26px}.setup{background:white;border:1px solid var(--border);border-radius:12px;align-self:start;overflow:hidden}.setup section{padding:24px}.setup section+section{border-top:1px solid var(--border)}.section-label{display:flex;gap:12px;align-items:center;margin-bottom:23px}.section-label>span{font-size:12px;color:#596b7c;border:1px solid #d2dae4;border-radius:50%;width:27px;height:27px;display:grid;place-items:center}.setup label{display:block;font-size:14px;font-weight:700;margin:19px 0 9px}.setup select,.setup input,.setup textarea{width:100%;padding:12px 10px;border:1px solid #bfcbd6;border-radius:6px;background:#fff;color:var(--ink);min-height:44px}.setup textarea{resize:vertical;line-height:1.6}.setup small{display:block;font-size:13px;color:#586878;line-height:1.5;margin-top:9px}.hint{font-size:13px;line-height:1.5;color:#586878;margin:18px 0 0}.error{color:#c23625;font-size:14px;line-height:1.4;margin:8px 0}.error:empty{display:none}.apply{background:var(--ink);border:0;border-radius:6px;padding:12px;width:100%;color:white;margin-top:12px}.dashboard{background:var(--ink);color:white;border-radius:12px;padding:28px 32px 0;overflow:hidden}.dash-top{display:flex;justify-content:space-between;gap:14px;align-items:center}.dashboard .eyebrow{color:#b9c8d9;margin:0}.gear-label{border:1px solid #637083;padding:8px 13px;border-radius:5px;font-size:14px;font-weight:700;white-space:nowrap}.speed-line{display:flex;align-items:baseline;gap:15px;margin-top:12px}.speed-line output{font-size:clamp(70px,9vw,112px);font-weight:800;letter-spacing:-6px;line-height:1.12;font-variant-numeric:tabular-nums}.speed-line>span{font-size:24px;color:var(--orange)}.other-unit{font-size:14px;color:#b9c8d9;margin:1px 0 18px}.cadence{padding:17px 0 24px}.cadence-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.cadence-heading>label{font-size:16px;font-weight:700}.cadence-heading>div{display:flex;align-items:center;gap:8px;color:#b9c8d9;font-size:14px}.cadence input[type=number]{width:76px;border:1px solid #69798b;border-radius:5px;background:#223147;color:white;padding:7px;font-size:21px;font-weight:700}.cadence input[type=range]{width:100%;margin:8px 0 10px;accent-color:var(--orange);cursor:pointer}.range-labels{display:flex;justify-content:space-between;font-size:12px;color:#b9c8d9}.dashboard .error{color:#ffb595}.ride-stats{border-top:1px solid #3b4a5e;display:grid;grid-template-columns:1fr 1.2fr 1fr;margin:0 -32px;padding:21px 32px;background:#172539;gap:20px}.ride-stats span{display:block;color:#bac8d9;font-size:12px;margin-bottom:7px}.ride-stats strong{font-size:19px;letter-spacing:-.4px}.gear-panel{padding:24px 0 0}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.section-heading>span{font-size:13px;color:#586878}.ring-row{display:flex;align-items:center;gap:18px;margin:18px 0}.ring-row>span,.sprocket-label{font-size:14px;font-weight:700}.front-gears{display:flex;gap:7px}.front-gears button{background:white;border:1px solid #bfcbd6;padding:8px 17px;border-radius:5px;min-height:40px;font-weight:700}.front-gears [aria-pressed=true]{background:var(--ink);color:white;border-color:var(--ink)}.sprocket-label{display:flex;justify-content:space-between;margin-bottom:10px}.sprocket-label small{font-size:12px;color:#586878;font-weight:400}.rear-gears{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:5px}.rear-gears button{min-height:42px;padding:6px 0;background:white;border:1px solid #bac8d5;border-radius:5px;font-size:14px;font-weight:700}.rear-gears [aria-pressed=true]{background:var(--orange);border-color:#b3541a;color:#101c2d;box-shadow:0 0 0 2px #ff8a4230}.shift-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.shift-card{text-align:left;border:1px solid var(--border);background:white;border-radius:8px;padding:17px}.shift-card>span{display:block;font-size:14px;font-weight:700}.shift-card strong{display:block;font-size:25px;margin:8px 0 5px;letter-spacing:-.5px}.shift-card small{font-size:13px;color:#526579}.shift-card:hover:not(:disabled){border-color:#9baec0;box-shadow:0 3px 10px #10203009}.shift-card:disabled{background:#e9eef3;color:#647587}.shift-feedback{font-size:13px;line-height:1.5;color:#4b6278;margin:12px 0 0;min-height:20px}.chart-panel{margin-top:29px;background:white;border:1px solid var(--border);border-radius:12px;padding:26px 28px}.legend{display:flex;gap:20px;font-size:14px;flex-wrap:wrap}.legend span{display:flex;align-items:center;gap:7px}.legend i{width:11px;height:11px;background:var(--blue);border-radius:2px}.legend span:first-child i{background:#dc651e}.chart-help{font-size:14px;color:#586878;margin:10px 0 24px;line-height:1.5}.chart{display:grid;gap:12px}.chart-row{display:grid;grid-template-columns:42px minmax(0,1fr);gap:10px;align-items:center}.cog-title{font-size:14px;color:#526579;text-align:right;font-weight:700}.bars{display:flex;flex-direction:column;gap:4px}.bar{display:flex;align-items:center;text-align:left;border:0;background:#f2f5f8;padding:0;height:25px;width:100%;border-radius:3px;font-size:13px;color:#172235;position:relative}.bar-fill{height:100%;background:#ffe1cc;border-radius:3px;display:block;min-width:2px;transition:width .15s}.bar.secondary .bar-fill{background:#d4e7f6}.bar[aria-pressed=true] .bar-fill{background:var(--orange)}.bar.secondary[aria-pressed=true] .bar-fill{background:#56a6e0}.bar-value{position:absolute;left:8px;line-height:25px;font-weight:700}.bar:hover{outline:1px solid #9eacba}.chart-axis{display:flex;justify-content:space-between;font-size:12px;letter-spacing:1px;color:#647587;border-top:1px solid var(--border);margin-top:22px;padding-top:15px}.method{margin:24px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:18px 0;color:#526579}.method summary{cursor:pointer;font-weight:700;font-size:14px;color:var(--ink)}.method p,.method li{font-size:14px;line-height:1.7;max-width:950px}.method a{color:#1567a4}.method li{margin:4px 0}footer{display:flex;justify-content:space-between;gap:15px;font-size:12px;color:#586878;padding:0 0 12px}footer span:first-child{font-weight:700;letter-spacing:1px}[hidden]{display:none!important}@media(max-width:850px){.workspace{grid-template-columns:260px minmax(0,1fr);gap:18px}.setup section{padding:20px}.dashboard{padding:24px 22px 0}.ride-stats{margin:0 -22px;padding:18px 22px;gap:12px}.rear-gears{grid-template-columns:repeat(6,minmax(0,1fr))}.dash-top{align-items:start;flex-direction:column}.ride-stats{grid-template-columns:1fr 1fr}.ride-stats>div:last-child{grid-column:1/-1}.section-heading>span{display:none}}@media(max-width:650px){header{height:66px;padding:0 18px}.brand{font-size:21px}.brand span{display:none}.header-note{font-size:11px}main{padding:25px 16px 16px}.page-title{gap:10px}.page-title h1{font-size:31px;letter-spacing:-1.2px}.unit-switch button{padding:8px 10px;font-size:14px}.eyebrow{font-size:11px;letter-spacing:1.5px}.workspace{display:flex;flex-direction:column;gap:20px}.setup{width:100%;display:grid;grid-template-columns:1fr 1fr}.setup section{padding:18px 14px}.setup section+section{border-top:0;border-left:1px solid var(--border)}.section-label{gap:7px;margin-bottom:10px}.section-label h2{font-size:17px}.section-label>span{display:none}.setup select,.setup input{font-size:14px}.setup label{font-size:13px;margin-top:15px}.hint,.setup small{font-size:12px}.dash-top{flex-direction:row;align-items:center}.dashboard .eyebrow{font-size:11px}.gear-label{font-size:13px}.speed-line output{font-size:90px}.ride-stats{grid-template-columns:1fr 1.1fr 1fr;gap:10px}.ride-stats>div:last-child{grid-column:auto}.ride-stats span{font-size:11px}.ride-stats strong{font-size:17px}.rear-gears{grid-template-columns:repeat(6,minmax(0,1fr))}.chart-panel{padding:22px 16px}.chart-panel .section-heading{align-items:start;flex-direction:column;gap:13px}.chart-help{font-size:13px}.chart-axis{font-size:10px;letter-spacing:.5px}.chart-row{grid-template-columns:28px minmax(0,1fr)}.shift-card{padding:14px}.shift-card small{font-size:12px}.shift-card strong{font-size:23px}footer{font-size:11px}.method p,.method li{font-size:14px}}@media(max-width:360px){.setup{grid-template-columns:1fr}.setup section+section{border-left:0;border-top:1px solid var(--border)}.page-title{align-items:start;flex-direction:column}.ride-stats{grid-template-columns:1fr 1fr}.dash-top{flex-wrap:wrap}.shift-card strong{font-size:20px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}