:root{--bg:#05060d;--panel:#070b16eb;--line:#0e2a3a;--text:#d8f6ff;--text-dim:#6f8fa3;--accent:#00e5ff;--danger:#ff3040}html,body{background:var(--bg);height:100%;color:var(--text);margin:0;font-family:Rajdhani,system-ui,sans-serif;overflow:hidden}canvas{display:block}[hidden]{display:none!important}#screens{pointer-events:none;flex-wrap:wrap;place-content:center;align-items:center;gap:16px;padding:16px;display:flex;position:fixed;inset:0;overflow-y:auto}.panel{pointer-events:auto;background:var(--panel);border:1px solid var(--accent);scrollbar-width:thin;scrollbar-color:var(--line) transparent;box-sizing:border-box;flex-direction:column;gap:14px;width:min(460px,100%);max-height:calc(100vh - 32px);padding:24px 28px;font-size:18px;display:flex;overflow-y:auto;box-shadow:0 0 32px #00e5ff40}.panel h1,.panel h2{text-align:center;letter-spacing:.2em;color:var(--accent);text-shadow:0 0 16px var(--accent);margin:0 0 4px;font-family:Orbitron,sans-serif}.panel h2{letter-spacing:.12em;font-size:20px}.panel .row{justify-content:space-between;align-items:center;gap:12px;display:flex}.panel input:not([type=radio],[type=range]),.panel select{font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--line);min-width:130px;padding:2px 6px}.panel input:disabled,.panel select:disabled{opacity:.6}.panel button{letter-spacing:.1em;color:var(--bg);background:var(--accent);cursor:pointer;box-shadow:0 0 18px var(--accent);border:none;padding:10px;font:700 18px Orbitron,sans-serif}.panel button:disabled{opacity:.5;cursor:default}.panel button.secondary{letter-spacing:.05em;color:var(--text);border:1px solid var(--line);box-shadow:none;background:0 0;padding:6px 10px;font:600 15px Rajdhani,sans-serif}.join{gap:8px;display:flex}.join input{text-transform:uppercase;letter-spacing:.3em;text-align:center;flex:1;min-width:0;font-family:Orbitron,sans-serif!important}.error{min-height:1.2em;color:var(--danger);margin:0;font-size:16px}.hint{color:var(--text-dim);margin:0;font-size:15px}.code-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.code{letter-spacing:.25em;color:var(--text);text-shadow:0 0 12px var(--accent);font:700 32px Orbitron,sans-serif}#lobby-players{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}#lobby-players li{align-items:center;gap:10px;display:flex}#lobby-players .swatch{width:16px;height:5px}#lobby-players .tag{color:var(--text-dim);margin-left:auto;font-size:14px}#lobby-players .me{color:var(--accent)}#menu fieldset{border:1px solid var(--line);gap:16px;padding:8px 12px 10px;display:flex}#menu legend{color:var(--text-dim);font-size:15px}#menu details{border:1px solid var(--line);padding:6px 12px}#menu summary{cursor:pointer;color:var(--text-dim);font-size:16px}#menu details[open] summary{margin-bottom:8px}#rule-fields{flex-direction:column;gap:6px;font-size:15px;display:flex}#rule-fields label{grid-template-columns:1fr 130px 64px;align-items:center;gap:8px;display:grid}#rule-fields input{accent-color:var(--accent);width:100%}#rule-fields output{text-align:right;color:var(--accent);font-variant-numeric:tabular-nums}#menu .keys{color:var(--text-dim);margin:0;font-size:15px;line-height:1.4}#hud{pointer-events:none;position:fixed;inset:0}#scoreboard{flex-wrap:wrap;place-content:center;gap:2px 18px;height:48px;margin:0;padding:0 16px;font-size:15px;list-style:none;display:flex;position:absolute;top:0;left:0;right:0;overflow:hidden}#scoreboard li{white-space:nowrap;align-items:center;gap:6px;display:flex}#scoreboard li.dead{opacity:.35}#scoreboard .swatch{width:12px;height:4px;box-shadow:0 0 6px}#scoreboard .wins{color:var(--accent)}#scoreboard .points{color:var(--text-dim)}#center{text-align:center;width:100%;position:absolute;top:32%}#status{letter-spacing:.08em;color:var(--status-color,var(--accent));text-shadow:0 0 18px var(--status-color,var(--accent));font-family:Orbitron,sans-serif;font-size:clamp(24px,5vw,56px);font-weight:700}#substatus{color:var(--text);margin-top:8px;font-size:20px}#help{text-align:center;width:100%;color:var(--text-dim);letter-spacing:.05em;font-size:16px;position:absolute;bottom:10px}#debug{color:var(--text-dim);pointer-events:none;font:12px ui-monospace,monospace;position:fixed;bottom:10px;left:12px}.touch-controls{touch-action:none;-webkit-user-select:none;user-select:none;position:fixed;inset:0}.touch-zone{width:50%;position:absolute;top:0;bottom:0}.touch-left{left:0}.touch-right{right:0}.touch-button{letter-spacing:.08em;width:84px;height:84px;color:var(--text);border:2px solid var(--accent);touch-action:none;background:#070b168c;border-radius:50%;font:700 13px Orbitron,sans-serif;position:absolute;bottom:48px}.touch-boost{right:24px}.touch-brake{border-color:var(--danger);left:24px}.touch-button:active{background:#00e5ff59}.touch-quit{width:36px;height:36px;color:var(--text-dim);border:1px solid var(--line);background:#070b168c;border-radius:50%;font-size:16px;position:absolute;top:56px;left:12px}#gauges{flex-direction:column;gap:6px;font-size:14px;display:flex;position:absolute;bottom:40px;left:16px}.gauge{align-items:center;gap:8px;display:flex}.gauge .bar{border:1px solid var(--line);background:#ffffff14;width:120px;height:8px}.gauge .fill{background:var(--gauge-color,var(--accent));height:100%;box-shadow:0 0 8px var(--gauge-color,var(--accent))}.gauge .fill.low{opacity:.45}.effect{white-space:nowrap;border:1px solid;padding:1px 6px;font-size:12px}.effect.bonus{color:#4dffb8}.effect.malus{color:var(--danger)}@media (pointer:coarse){#gauges{bottom:150px}#help{display:none}}
