:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--panel:#0a0c10c7;--text:#f2f2f2;--muted:#a9b0bb;--ok:#6fd08c;--warn:#f0c35a;--bad:#f07a6a;font-family:system-ui,sans-serif}html,body{height:100%;color:var(--text);background:#101318;margin:0;overflow:hidden}#view{width:100%;height:100%;display:block}#hud{background:var(--panel);border-radius:8px;max-width:calc(100vw - 64px);padding:12px 16px;font-size:14px;position:fixed;top:16px;left:16px}#hud h1{margin:0 0 8px;font-size:16px}#hud dl{grid-template-columns:auto 1fr;gap:2px 12px;margin:0;display:grid}#hud dt{color:var(--muted)}#hud dd{font-variant-numeric:tabular-nums;margin:0}#hud [data-state=connected]{color:var(--ok)}#hud [data-state=connecting],#hud [data-state=reconnecting]{color:var(--warn)}#hud [data-state=offline]{color:var(--bad)}#hud .note{color:var(--muted);margin:10px 0 6px;font-size:12px}#hud a{color:var(--text)}.fatal{background:var(--panel);color:var(--bad);white-space:pre-wrap;border-radius:8px;padding:12px;position:fixed;inset:auto 16px 16px}