:root{color-scheme:dark;--bg: #0b1022;--panel: rgba(13, 20, 42, .86);--line: #22d3ee;--bad: #ef4444;--text: #e8eefc;--dim: #8fa1c4}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,sans-serif;overflow:hidden}canvas{display:block}#app{position:fixed;inset:0;pointer-events:none}.hud{position:absolute;top:12px;left:12px;width:min(430px,calc(100vw - 24px));background:var(--panel);border:1px solid rgba(34,211,238,.4);border-radius:12px;padding:12px 14px;pointer-events:auto;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.eyebrow{margin:0;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}h1{margin:2px 0 4px;font-size:20px}.lede{margin:0 0 8px;font-size:13px;color:var(--dim)}.readout{display:flex;gap:8px;font-size:12px;font-weight:700;margin-bottom:8px}.readout span{background:#22d3ee1f;border:1px solid rgba(34,211,238,.35);padding:2px 8px;border-radius:999px}.actions{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}button{background:#13203f;color:var(--text);border:1px solid rgba(34,211,238,.45);border-radius:8px;padding:6px 10px;font-size:12px;cursor:pointer}button:disabled{opacity:.45;cursor:default}button:hover:not(:disabled){background:#1a2c55}kbd{background:#050914;border:1px solid #334;border-radius:4px;padding:0 4px;font-size:11px}.hint{font-size:11.5px;color:var(--dim);margin:0 0 6px;line-height:1.5}.log{font-size:11.5px;background:#050914;border-radius:8px;padding:6px 8px;min-height:30px;margin:0;white-space:pre-wrap}