:root{--night: #070b18;--panel: rgba(9, 14, 30, .74);--ink: #e6edf9;--dim: #8d9cbb;--amber: #ffb35a;--line: rgba(150, 178, 230, .2);--display: "Barlow Condensed", "Arial Narrow", sans-serif;--body: "Barlow", system-ui, sans-serif;--mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;color-scheme:dark}html,body{height:100%;overflow:hidden}body{background:var(--night);color:var(--ink);font-family:var(--body);font-size:14px;-webkit-user-select:none;user-select:none}#c{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none;outline:none}.brand{position:fixed;left:16px;top:calc(14px + env(safe-area-inset-top,0px));display:grid;gap:2px;justify-items:start;pointer-events:none;text-shadow:0 1px 3px rgba(0,0,0,.75),0 0 14px rgba(0,0,0,.45)}.eyebrow{font-family:var(--display);font-weight:500;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--amber)}.brand h1{margin:0;font-family:var(--display);font-weight:700;font-size:30px;line-height:1;letter-spacing:.01em}.keys{margin-top:6px;color:#b7c3dc;font-size:13px;line-height:1.5;max-width:34ch;padding:4px 8px;border-radius:7px;background:#090e1e80}kbd{font-family:var(--mono);font-size:11px;padding:1px 5px;border:1px solid var(--line);border-radius:4px;color:var(--ink);background:#ffffff0a}.panel{position:fixed;right:16px;top:calc(14px + env(safe-area-inset-top,0px));width:min(260px,calc(100vw - 32px));background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:12px 14px;display:grid;gap:12px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.panel h2{margin:0;font-family:var(--display);font-weight:500;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);display:flex;justify-content:space-between;align-items:center}.row{display:grid;gap:4px}.row label{display:flex;justify-content:space-between;font-size:13px}.row output{font-family:var(--mono);font-size:12px;color:var(--amber);font-variant-numeric:tabular-nums}input[type=range]{width:100%;accent-color:var(--amber)}.check{display:flex;gap:8px;align-items:center;font-size:13px}.check input{accent-color:var(--amber)}.btns{display:flex;gap:8px;flex-wrap:wrap}button{font:600 13px var(--body);color:var(--ink);background:#ffffff0f;border:1px solid var(--line);border-radius:7px;padding:7px 10px;cursor:pointer}button:hover{background:#ffb35a24;border-color:#ffb35a80}button:focus-visible,input:focus-visible{outline:2px solid var(--amber);outline-offset:2px}.stat{font-family:var(--mono);font-size:11px;color:var(--dim);font-variant-numeric:tabular-nums}#toggle{display:none;padding:3px 8px;font-size:12px}.speedo{position:fixed;left:50%;transform:translate(-50%);bottom:calc(18px + env(safe-area-inset-bottom,0px));text-align:center;pointer-events:none;text-shadow:0 1px 10px rgba(0,0,0,.7)}.speedo b{display:block;font-family:var(--mono);font-weight:500;font-size:40px;line-height:1;font-variant-numeric:tabular-nums}.speedo span{font-family:var(--display);font-size:12px;letter-spacing:.2em;color:var(--dim)}.touch{position:fixed;bottom:calc(16px + env(safe-area-inset-bottom,0px));display:none;gap:10px}.touch.left{left:16px}.touch.right{right:16px}.touch button{width:64px;height:64px;border-radius:50%;font-size:20px;background:#090e1e99;touch-action:none}.touch button.on{background:#ffb35a4d}body.is-touch .touch{display:flex}body.is-touch .keys{display:none}body.is-touch .speedo{bottom:calc(96px + env(safe-area-inset-bottom,0px))}.hint{position:fixed;left:50%;transform:translate(-50%);bottom:calc(26px + env(safe-area-inset-bottom,0px));padding:8px 14px;border-radius:999px;background:var(--panel);border:1px solid rgba(255,179,90,.45);font-family:var(--display);font-size:16px;letter-spacing:.06em;pointer-events:none}.hint kbd{font-size:13px;color:var(--amber)}.crosshair{position:fixed;left:50%;top:50%;width:4px;height:4px;margin:-2px 0 0 -2px;border-radius:50%;background:#e6edf9b3;pointer-events:none}body.is-touch .hint{bottom:calc(96px + env(safe-area-inset-bottom,0px))}[hidden]{display:none!important}body.driving .speedo{left:auto;right:22px;transform:none;text-align:right;padding:6px 10px;border-radius:10px;background:var(--panel);border:1px solid var(--line);min-width:92px}body.is-touch.driving .speedo{top:calc(60px + env(safe-area-inset-top,0px));bottom:auto}.speedo .gear{display:block;margin-top:2px;font-family:var(--mono);font-size:13px;color:var(--amber);letter-spacing:.04em}.vbar{position:fixed;left:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));display:grid;gap:5px}.vbar button{display:flex;justify-content:space-between;align-items:center;gap:10px;min-width:168px;padding:6px 10px;background:var(--panel);text-align:left}.vbar button b{font:500 11px var(--mono);color:var(--dim);padding:1px 5px;border:1px solid var(--line);border-radius:4px}.vbar button.on{border-color:#ffb35ab3;background:linear-gradient(#ffb35a33,#ffb35a33),#090e1edb}.vbar button.on span{color:var(--amber)}body.is-touch .vbar{left:16px;right:auto;top:calc(10px + env(safe-area-inset-top,0px));bottom:auto;display:flex;flex-wrap:wrap;max-width:calc(100vw - 200px);gap:6px}body.is-touch .vbar button{min-width:0;padding:8px 9px;font-size:12px}body.is-touch .vbar button b,body.is-touch.driving .brand{display:none}body.is-touch #toggle{display:inline-block}body.is-touch .panel.collapsed>:not(h2){display:none}body.is-touch .panel.collapsed{width:auto;min-width:150px}.thermo{margin-top:8px;display:flex;gap:6px;flex-wrap:wrap;font-family:var(--mono);font-size:12px;font-variant-numeric:tabular-nums}.thermo span{padding:2px 7px;border-radius:5px;background:#090e1e99;border:1px solid var(--line);color:var(--dim)}.thermo b{color:var(--ink);font-weight:500}.thermo .hot b{color:var(--amber)}.thermo .cold b{color:#9cc7ff}.toast{position:fixed;left:50%;top:calc(50% + 26px);transform:translate(-50%);padding:6px 12px;border-radius:8px;background:var(--panel);border:1px solid var(--line);font-family:var(--display);font-size:16px;letter-spacing:.04em;pointer-events:none;transition:opacity .35s;max-width:calc(100vw - 32px);text-align:center}#err{position:fixed;inset:0;display:grid;place-items:center;padding:16px;text-align:center;color:var(--dim)}@media (max-width: 720px){.brand h1{font-size:24px}#toggle{display:inline-block}.panel.collapsed>:not(h2){display:none}.panel{width:auto;min-width:150px;max-width:calc(100vw - 32px)}.panel:not(.collapsed){width:min(260px,calc(100vw - 32px))}}