@import "https://fonts.googleapis.com/css2?family=Share+Tech+Mono&display=swap";:root{--screen-font:"Share Tech Mono", Consolas, "MS Gothic", monospace}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;font-family:var(--screen-font);-webkit-user-select:none;user-select:none;background:#000;overflow:hidden}#app{position:fixed;inset:0}#app canvas{display:block}#overlay{z-index:100;color:#9cffc0;cursor:pointer;background:radial-gradient(#0a1912eb 0%,#000000fa 100%);flex-direction:column;justify-content:center;align-items:center;gap:24px;transition:opacity .6s;display:flex;position:fixed;inset:0}#overlay.hidden{opacity:0;pointer-events:none}#overlay .title{letter-spacing:.35em;text-shadow:0 0 18px #50ff968c,2px 0 #ff283c4d,-2px 0 #2878ff4d;font-size:52px;font-weight:700}#overlay .demo{letter-spacing:.28em;text-indent:.28em;color:#ffcf6b;text-shadow:0 0 8px #ffb43c59;border:1px solid #6a5a2a;border-radius:2px;margin-top:-14px;padding:3px 13px;font-size:12px}#overlay .subtitle{letter-spacing:.5em;color:#5a9b76;font-size:14px}#overlay .prompt{letter-spacing:.2em;margin-top:28px;font-size:17px;animation:1.4s step-end infinite overlay-blink}@keyframes overlay-blink{50%{opacity:.15}}#overlay .keys{color:#6cae89;letter-spacing:.1em;text-align:left;max-width:600px;margin-top:12px;font-size:12.5px;line-height:1.7}#overlay .keys div{align-items:baseline;gap:10px;display:flex}#overlay .keys b{color:#b8ffd4;flex:0 0 104px}#overlay .keys .padrow{margin-top:1.4em}#overlay .sequence{color:#cdbd7e;letter-spacing:.15em;border:1px solid #3a3d2c;padding:10px 22px;font-size:13px}#lang-toggle{z-index:200;color:#9cffc0;font-family:var(--screen-font);letter-spacing:.12em;cursor:pointer;text-shadow:0 0 6px;background:#08140ed9;border:1px solid #2c5a3e;padding:6px 14px;font-size:12px;transition:background .2s,border-color .2s;position:fixed;top:14px;right:14px;overflow:hidden}#lang-toggle:before{content:"";pointer-events:none;will-change:opacity;background:repeating-linear-gradient(#00000038 0 1px,#0000 1px 3px);animation:5s steps(40,end) infinite crt-flicker;position:absolute;inset:0}#lang-toggle:hover{background:#143222e6;border-color:#4c9a6e}#app-footer{z-index:120;pointer-events:none;text-align:center;color:#9cffc0;font-family:var(--screen-font);letter-spacing:.14em;text-shadow:0 0 6px #78ffaa99;font-size:12px;position:fixed;bottom:16px;left:0;right:0}#control-tooltip{z-index:150;pointer-events:none;color:#b8ffd4;font-family:var(--screen-font);letter-spacing:.08em;opacity:0;white-space:nowrap;background:#08160feb;border:1px solid #2c5a3e;border-left:3px solid #4c9a6e;padding:5px 10px;font-size:12.5px;transition:opacity .12s,transform .12s;position:fixed;transform:translateY(3px)}#control-tooltip.visible{opacity:1;transform:translateY(0)}.menu-overlay{z-index:180;font-family:var(--screen-font);color:#9cffc0;cursor:default;background:radial-gradient(#060e0adb 0%,#000000f2 100%);flex-direction:column;justify-content:center;align-items:center;gap:18px;display:none;position:fixed;inset:0}.menu-overlay.visible{display:flex}.menu-title{letter-spacing:.4em;text-shadow:0 0 16px #50ff9680;margin-bottom:18px;font-size:40px;font-weight:700}.menu-btn{color:#b8ffd4;min-width:280px;font-family:var(--screen-font);letter-spacing:.18em;cursor:pointer;background:#0a1a12e6;border:1px solid #2c5a3e;padding:12px 28px;font-size:16px;transition:background .15s,border-color .15s}.menu-btn:hover,.menu-btn.selected{background:#183a26f2;border-color:#5cba84}.menu-btn.selected{border-left:3px solid #5cba84;box-shadow:0 0 14px #5cba8459}.menu-btn.warn.selected{border-left:3px solid #c0392b;box-shadow:0 0 14px #c0392b66}.menu-confirm{text-align:center;letter-spacing:.12em;color:#ffc46b;max-width:420px;margin-bottom:8px;font-size:14px;line-height:1.7}.menu-btn.warn{color:#ffd0c4;border-color:#8a3a30 #8a3a30 #8a3a30 #c0392b;border-left-style:solid;border-left-width:3px}.menu-btn.warn:hover{background:#461610f2;border-color:#c0392b}#game-over{cursor:pointer;color:#ff6258;background:radial-gradient(#280808e6 0%,#000000f7 100%)}#game-over .over-title{letter-spacing:.35em;text-shadow:0 0 20px #ff3c3299;font-size:52px;font-weight:700}#game-over .over-reason{letter-spacing:.2em;color:#ffb0a0;margin-top:14px;font-size:16px}#game-over .over-prompt{letter-spacing:.25em;color:#ff8070;margin-top:32px;font-size:16px;animation:1.4s step-end infinite overlay-blink}#overlay,.menu-overlay{text-shadow:0 0 6px;overflow:hidden}#overlay:before,.menu-overlay:before{content:"";pointer-events:none;z-index:5;background:repeating-linear-gradient(#00000042 0 1px,#0000 1px 3px);animation:5s steps(40,end) infinite crt-flicker;position:absolute;inset:0;box-shadow:inset 0 0 220px 70px #0009}#overlay:after,.menu-overlay:after{content:"";pointer-events:none;z-index:5;will-change:transform;background:linear-gradient(#0000,#ffffff0d,#0000);height:35%;animation:7.5s linear infinite crt-sweep;position:absolute;top:-35%;left:0;right:0}@keyframes crt-flicker{0%,96%,to{opacity:1}97%{opacity:.84}98.5%{opacity:.95}}@keyframes crt-sweep{0%{transform:translateY(0)}to{transform:translateY(400%)}}@property --rpm{syntax:"<number>";inherits:true;initial-value:0}@property --throttle{syntax:"<number>";inherits:true;initial-value:.5}#hud{--hud-green:#8cffb0;--hud-dim:#8cffb073;--hud-amber:#ffc46b;--hud-red:#ff5a4e;z-index:10;pointer-events:none;color:var(--hud-green);font-family:var(--screen-font);mix-blend-mode:screen;letter-spacing:.12em;transition:--rpm .35s,--throttle .2s linear;position:fixed;inset:0}#hud .hud-el{opacity:0;clip-path:inset(50% 0);text-shadow:0 0 7px #78ffaacc,1px 0 #ff1e3c47,-1px 0 #1e6eff47;transition:opacity .5s,clip-path .55s}#hud.hud-online .hud-el{opacity:1;clip-path:inset(0)}#hud.hud-online .compass{transition-delay:50ms}#hud.hud-online .reticle{transition-delay:.18s}#hud.hud-online .left-block{transition-delay:.3s}#hud.hud-online .right-block{transition-delay:.38s}#hud.hud-online .state-line{transition-delay:.5s}.compass{text-align:center;position:absolute;top:34px;left:50%;transform:translate(-50%)}.compass-window{border-top:1px solid var(--hud-dim);border-bottom:1px solid var(--hud-dim);width:360px;height:34px;position:relative;overflow:hidden}.compass-tape{will-change:transform;height:100%;position:absolute;top:0;left:50%}.compass-tape .tick{background:var(--hud-dim);width:1px;height:9px;position:absolute;top:0}.compass-tape .tick.major{background:var(--hud-green);width:2px;height:14px}.compass-tape .tick:after{content:attr(data-label);font-size:13px;position:absolute;top:14px;left:50%;transform:translate(-50%)}.compass-marker{border-left:6px solid #0000;border-right:6px solid #0000;border-bottom:8px solid var(--hud-green);width:0;height:0;position:absolute;top:30px;left:50%;transform:translate(-50%)}.compass-readout{margin-top:10px;font-size:14px}.compass-value{font-size:17px;font-weight:700}.reticle{color:var(--hud-green);opacity:.9;position:absolute;top:42%;left:50%;transform:translate(-50%,-50%)}#hud.hud-engine .reticle svg{animation:4s ease-in-out infinite reticle-breathe}@keyframes reticle-breathe{50%{transform:scale(1.015)}}.left-block{width:130px;position:absolute;top:30%;left:8%;transform:translateY(-50%)}.block-title,.block-sub{color:var(--hud-dim);margin-bottom:6px;font-size:11px}.speed-row{margin:4px 0 14px}.speed-value{font-size:38px;font-weight:700}.speed-unit{color:var(--hud-dim);margin-left:6px;font-size:13px}.throttle-gauge{border:1px solid var(--hud-dim);width:14px;height:130px;margin-bottom:6px;position:relative}.throttle-fill{background:var(--hud-green);left:2px;right:2px;top:calc(min(1 - var(--throttle), .5) * 126px + 2px);bottom:calc(min(var(--throttle), .5) * 126px + 2px);position:absolute;box-shadow:0 0 8px #78ffaab3}.throttle-center{background:var(--hud-green);height:1px;position:absolute;top:50%;left:-5px;right:-5px}.right-block{text-align:center;width:130px;position:absolute;top:30%;right:8%;transform:translateY(-50%)}.rpm-ring{background:conic-gradient(from 210deg, var(--hud-green) calc(var(--rpm) * 300deg), #8cffb01f calc(var(--rpm) * 300deg) 300deg, transparent 300deg);filter:drop-shadow(0 0 6px #78ffaa80);border-radius:50%;justify-content:center;align-items:center;width:104px;height:104px;margin:10px auto;display:flex}.rpm-inner{background:#000000d9;border-radius:50%;justify-content:center;align-items:center;width:84px;height:84px;display:flex}.rpm-label{color:var(--hud-dim);font-size:13px}.state-line{letter-spacing:.3em;border:1px solid var(--hud-dim);padding:6px 22px;font-size:13px;position:absolute;top:12%;left:50%;transform:translate(-50%)}.brk-flag{letter-spacing:.3em;color:var(--hud-amber);border:1px solid var(--hud-amber);visibility:hidden;padding:4px 16px;font-size:14px;font-weight:700;animation:1.6s step-end infinite brk-blink;position:absolute;top:calc(12% + 44px);left:50%;transform:translate(-50%)}#hud.hud-online.brake-on .brk-flag{visibility:visible}@keyframes brk-blink{50%{opacity:.35}}.warning-banner{color:var(--hud-red);border:1px solid var(--hud-red);letter-spacing:.25em;opacity:0;text-shadow:0 0 10px #ff3c32e6;background:#500a0a59;padding:9px 30px;font-size:19px;font-weight:700;position:absolute;top:26%;left:50%;transform:translate(-50%)}.warning-banner.active{animation:2.6s step-end warning-flash}@keyframes warning-flash{0%,16%,32%,48%{opacity:1}8%,24%,40%{opacity:.1}49%,95%{opacity:1}to{opacity:0}}.hud-corners .corner{opacity:0;border:1.5px solid #8cffb040;width:46px;height:46px;transition:opacity 1s .6s;position:absolute}#hud.hud-online .hud-corners .corner{opacity:1}.corner.tl{border-bottom:none;border-right:none;top:16px;left:16px}.corner.tr{border-bottom:none;border-left:none;top:16px;right:16px}.corner.bl{border-top:none;border-right:none;bottom:16px;left:16px}.corner.br{border-top:none;border-left:none;bottom:16px;right:16px}