:root{color-scheme:dark;--cyan: #7ee7ff;--cyan-dim: rgba(126, 231, 255, .55);--amber: #f0c36a;--bg: #140e08;font-family:Segoe UI,system-ui,sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);overflow:hidden;touch-action:none;-webkit-user-select:none;user-select:none}#stage{position:fixed;inset:0}#stage canvas{display:block;width:100%;height:100%}#hud{position:fixed;inset:0;pointer-events:none;color:var(--cyan);text-shadow:0 0 8px rgba(126,231,255,.35)}.scanlines{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(to bottom,rgba(126,231,255,.05) 0 1px,transparent 1px 4px);mix-blend-mode:screen;opacity:.45}.scanlines.off{display:none}.panel{position:absolute;margin:12px;padding:10px 12px;border:1px solid var(--cyan-dim);background:#06101673;min-width:140px}.panel-tl{top:0;left:0}.panel-tr{top:0;right:0;text-align:right}.brand{margin:0;letter-spacing:.22em;font-size:13px}.tag{margin:2px 0 8px;color:var(--amber);font-size:11px;letter-spacing:.14em}.label,.readout{margin:0;font-family:Consolas,Courier New,monospace;font-size:11px;letter-spacing:.08em}.readout.dim{opacity:.7}.schematic{width:88px;height:56px;margin-top:8px;margin-left:auto;border:1px solid var(--cyan-dim);background:linear-gradient(var(--cyan-dim),var(--cyan-dim)) center / 70% 1px no-repeat,linear-gradient(var(--cyan-dim),var(--cyan-dim)) center / 1px 70% no-repeat}#move{position:fixed;top:0;left:0;bottom:0;width:50%;z-index:5;touch-action:none;pointer-events:auto}#joystick{position:absolute;left:max(18px,env(safe-area-inset-left));bottom:max(18px,env(safe-area-inset-bottom));width:132px;height:132px;border-radius:50%;border:2px solid rgba(255,255,255,.55);background:#ffffff14;box-shadow:inset 0 0 0 10px #ffffff0a;pointer-events:none}#joystick-knob{position:absolute;left:50%;top:50%;width:58px;height:58px;margin:-29px 0 0 -29px;border-radius:50%;border:2px solid rgba(255,255,255,.82);background:#ffffff38;box-shadow:none}#look{position:fixed;top:0;right:0;bottom:0;width:50%;z-index:4;touch-action:none;pointer-events:auto}#actions{position:fixed;inset:0;z-index:7;pointer-events:none}#actions .pad{position:absolute;pointer-events:auto;touch-action:none;display:grid;place-items:center;padding:0;border-radius:50%;border:2px solid rgba(255,255,255,.78);background:#080a0e47;color:#fff}#actions .pad svg{width:62%;height:62%;fill:none;stroke:#fff;stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round}#actions .pad svg circle{fill:#fff;stroke:none}#act-jump{right:max(20px,env(safe-area-inset-right));bottom:max(22px,env(safe-area-inset-bottom));width:84px;height:84px}#act-jump:active{background:#ffffff47}#sys-toggle{position:fixed;top:12px;left:50%;transform:translate(-50%);z-index:6;border:1px solid var(--cyan);background:#061016cc;color:var(--cyan);font:11px Consolas,monospace;letter-spacing:.16em;padding:6px 12px}#monitor{position:fixed;z-index:8;right:12px;bottom:12px;width:min(420px,calc(100vw - 24px));max-height:min(70vh,560px);overflow:auto;padding:10px;border:1px solid var(--cyan-dim);background:#060c10eb;color:#d7f6ff;font-family:Consolas,Courier New,monospace;font-size:12px}.mon-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}.mon-actions{display:flex;gap:6px}#monitor button,.quality-row select{background:transparent;color:var(--cyan);border:1px solid var(--cyan-dim);font:inherit;padding:2px 6px}#stats{display:grid;grid-template-columns:92px 1fr;gap:2px 8px;margin:0 0 8px}#stats dt{opacity:.65}#stats dd{margin:0}.quality-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}#log{list-style:none;margin:0;padding:0;border-top:1px solid rgba(126,231,255,.2)}#log li{padding:4px 0;border-bottom:1px solid rgba(126,231,255,.08);white-space:pre-wrap}#log li.warn{color:var(--amber)}#log li.error{color:#ff8d8d}#rotate-gate,#fullscreen-gate{position:fixed;inset:0;z-index:20;display:grid;align-content:center;justify-items:center;gap:8px;width:100%;height:100%;margin:0;padding:24px;border:0;text-align:center;background:#0c0804f0;color:var(--cyan);font:inherit}#fullscreen-gate{z-index:19;touch-action:manipulation;cursor:pointer}#rotate-gate[hidden],#fullscreen-gate[hidden]{display:none}html:fullscreen,html:-webkit-full-screen{width:100%;height:100%;background:var(--bg)}.rotate-title{margin:8px 0 0;color:var(--amber);letter-spacing:.08em;font-size:18px}@media(max-width:720px){.panel{margin:8px;padding:8px}.panel-tr{display:none}}