body{overflow:hidden}body>header{display:none}main{max-width:none!important;padding:0!important}.viewport{inset:0;border:0!important;border-radius:0!important;height:100dvh!important;min-height:0!important;position:fixed!important}.panel{top:max(8px,env(safe-area-inset-top));left:max(8px,env(safe-area-inset-left));z-index:4;background:#0b151dd9;border-radius:10px;max-width:min(720px,100vw - 16px);max-height:45dvh;position:fixed;overflow:auto;padding:8px!important}.panel #status{margin:0 0 6px;font-size:12px}.panel .actions{gap:6px}.panel button{min-height:44px;padding:6px 10px;font-size:12px}.panel details{font-size:12px}.panel details p{margin:6px 0}.panel summary{cursor:pointer;min-height:24px}.panel #help{max-width:560px}.panel .note{margin:4px 0}.touch-controls{padding-bottom:env(safe-area-inset-bottom)}@media (width<=600px){.panel{width:calc(100vw - 144px);max-width:none}.panel .actions{padding-right:0}.panel #status{max-width:none}}#effects{top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));z-index:5;background:#182d40ed;min-height:44px;padding:8px 12px;font-size:14px;position:absolute;left:auto}*{box-sizing:border-box}body{color:#edf4f4;background:#0b151d;margin:0;font:16px/1.6 system-ui,sans-serif}header,main{max-width:1280px;margin:auto;padding:24px}header{justify-content:space-between;align-items:center;gap:20px;display:flex}.eyebrow{letter-spacing:.2em;color:#6ee0c0;font-size:.75rem}h1{margin:10px 0;font-size:clamp(1.4rem,3vw,2.3rem);line-height:1.2}.tag,.note{color:#b6c6cb;font-size:.75rem}.tag{white-space:nowrap;border:1px solid #35464d;border-radius:24px;padding:6px 12px}main{padding-top:0}.viewport{background:#233746;border:1px solid #35464d;border-radius:16px;height:60vh;min-height:260px;position:relative;overflow:hidden}.viewport:after{content:"";pointer-events:none;background:radial-gradient(at 50% 45%,#0000 58%,#0c081452 100%);position:absolute;inset:0}canvas{outline-offset:-5px;width:100%;height:100%;display:block}.speed{pointer-events:none;background:#0b151de8;border-radius:12px;padding:10px 22px;position:absolute;bottom:20px;right:24px}.speed output{font-variant-numeric:tabular-nums;font-size:3rem;line-height:1}.speed span{color:#b6c6cb;margin-left:8px}.panel{padding:12px 0}#status{color:#6ee0c0}.actions{flex-wrap:wrap;gap:12px;display:flex}button{font:inherit;color:#edf4f4;cursor:pointer;background:#263a45;border:1px solid #667b84;border-radius:8px;padding:10px 20px;font-weight:650}#drive{color:#0b151d;background:#6ee0c0;border-color:#6ee0c0}button:disabled{opacity:.5;cursor:wait}:focus-visible{outline-offset:3px;outline:3px solid #ffc764}#help{color:#c5d2d8;max-width:850px}body[data-error=true] #status{color:#ffb6a8}@media (width<=600px){header,main{padding:16px}header{flex-direction:column;align-items:flex-start;gap:6px}.viewport{height:48vh}.speed{bottom:12px;right:12px}.speed output{font-size:2rem}.tag{white-space:normal}}.touch-controls{z-index:2;pointer-events:none;justify-content:space-between;gap:10px;display:none;position:absolute;inset:auto 10px 12px}.touch-controls>div{align-items:flex-end;gap:8px;display:flex}.touch-controls button{pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;background:#182d40e8;min-width:52px;min-height:56px;padding:8px;font-size:14px}.touch-controls button:active{background:#42746b}@media (pointer:coarse),(width<=900px){.touch-controls{display:flex}.speed{padding:8px 12px;top:12px;bottom:auto;right:12px}.viewport{height:68svh;min-height:330px}.touch-controls>div:last-child{flex-wrap:wrap;justify-content:flex-end;max-width:60%}.touch-controls button{padding:8px 10px}}@media (height<=500px) and (orientation:landscape){header{display:none}main{padding:0}.viewport{border-radius:0;height:100svh;min-height:0}.panel{padding:8px 16px}}.speed{z-index:1;filter:drop-shadow(0 0 5px #000);background:radial-gradient(circle,#111b20ed 45%,#070b10f5 72%);border:2px solid #a7b9ad;border-radius:50%;width:210px;height:210px;padding:0}.speed svg{width:100%;height:100%;overflow:visible}.gauge-ring{fill:none;stroke:#d8e9db;stroke-width:2px;stroke-dasharray:400 134;transform-origin:50%;transform:rotate(140deg)}.redline{fill:none;stroke:#e85538;stroke-width:7px}.ticks path{fill:none;stroke:#d9e4d4;stroke-width:3px}.speed text{fill:#e6eddb;font:12px monospace}.speed .rpm-label{fill:#a9b5a3;font-size:9px}#rpm-needle{transform-origin:100px 100px;fill:#ffa550;filter:drop-shadow(0 0 2px #ff7623)}.gauge-readout{justify-content:center;align-items:baseline;gap:5px;width:76%;display:flex;position:absolute;top:61%;left:12%}.speed .gauge-readout span{margin:0;font-size:11px}.speed output{color:#f8f5df;font-size:38px}.speed #gear{color:#ffd49b;border:1px solid #8eaa9c;padding:0 5px;font-size:20px}.speed[data-redline=true]{border-color:#ef654c}@media (pointer:coarse),(width<=900px){.speed{width:146px;height:146px;padding:0;top:auto;bottom:144px;right:10px}.speed output{font-size:27px}.speed #gear{font-size:16px}.speed .gauge-readout span{font-size:9px}}@media (height<=500px) and (orientation:landscape){.speed{width:130px;height:130px;bottom:80px;right:10px}}.drift{z-index:3;pointer-events:none;font-variant-numeric:tabular-nums;opacity:.55;background:#0b151de8;border:1px solid #35464d;border-radius:12px;align-items:baseline;gap:8px;padding:6px 14px;transition:opacity .15s,border-color .15s,box-shadow .15s;display:flex;position:absolute;bottom:20px;left:50%;transform:translate(-50%)}.drift .drift-label{letter-spacing:.2em;color:#6ee0c0;font-size:.7rem}.drift output{color:#f8f5df;font-size:1.6rem;font-weight:700;line-height:1}.drift #drift-mult{color:#ffd49b;font-size:1rem;font-weight:700}.drift #drift-best{color:#b6c6cb;font-size:.7rem}.drift[data-active=true]{opacity:1;border-color:#ffc764;box-shadow:0 0 14px #ffc76455}.drift[data-active=true] output{color:#ffe08a}@media (pointer:coarse),(width<=900px){.drift{gap:6px;padding:5px 10px;bottom:96px}.drift output{font-size:1.2rem}.drift #drift-best{display:none}}.impact{z-index:3;color:#ffd0d0;letter-spacing:.18em;pointer-events:none;opacity:0;background:#2a1010e8;border:1px solid #a33;border-radius:10px;padding:4px 12px;font-size:.75rem;transition:opacity .12s;position:absolute;top:64px;left:50%;transform:translate(-50%)}.impact[data-active=true]{opacity:1;box-shadow:0 0 14px #ff6b6b55}
