:root{--bg:#0d0f14;--surface:#171a21;--border:#262b35;--text:#e6e8ec;--muted:#8b93a3;--accent:#4f8cff;--accent-hover:#3b78ec;--ok:#38c172;--err:#ff5d5d;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:var(--sans)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text)}.screen{justify-content:center;align-items:center;min-height:100%;padding:24px;display:flex}.card{background:var(--surface);border:1px solid var(--border);text-align:center;border-radius:16px;width:100%;max-width:420px;padding:28px 24px}h1{margin:0 0 8px;font-size:26px}.subtitle{color:var(--muted);margin:0 0 24px;line-height:1.5}button.primary{color:#fff;background:var(--accent);cursor:pointer;border:none;border-radius:12px;width:100%;padding:14px 16px;font-size:16px;font-weight:600;transition:background .15s}button.primary:hover:not(:disabled){background:var(--accent-hover)}button.primary:disabled{opacity:.5;cursor:not-allowed}.status{margin-top:16px;font-size:14px}.hint{color:var(--muted);margin-top:24px;font-size:12px}.field{text-align:left;margin-bottom:16px;display:block}.field span{color:var(--muted);margin-bottom:6px;font-size:13px;display:block}.field input{width:100%;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:12px;font-size:15px}button.ghost{width:100%;color:var(--text);border:1px solid var(--border);cursor:pointer;background:0 0;border-radius:10px;margin-top:10px;padding:12px 14px;font-size:15px}button.ghost.small{width:auto;margin:0;padding:6px 10px;font-size:13px}button.primary.danger{background:var(--err);margin-top:12px}.invite{word-break:break-all;color:var(--accent);background:var(--bg);border:1px solid var(--border);border-radius:10px;margin-bottom:8px;padding:10px;font-size:13px}.game{flex-direction:column;gap:10px;min-height:100%;padding:12px;display:flex}.stage{aspect-ratio:4/3;background:#000;border-radius:12px;width:100%;max-width:480px;margin:0 auto;position:relative;overflow:hidden}.video,.overlay{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.hud-top{justify-content:space-between;align-items:center;display:flex;position:absolute;top:8px;left:8px;right:8px}.conn{color:var(--muted);background:#00000080;border-radius:8px;padding:4px 8px;font-size:12px}.conn[data-status=connected]{color:var(--ok)}.conn[data-status=reconnecting],.conn[data-status=connecting]{color:var(--accent)}.conn[data-status=error],.conn[data-status=closed]{color:var(--err)}.hud-status{text-align:center;text-shadow:0 1px 4px #000c;font-size:18px;font-weight:700;position:absolute;bottom:10px;left:0;right:0}.hud-error{text-align:center;color:var(--err);background:#0009;justify-content:center;align-items:center;padding:20px;display:flex;position:absolute;inset:0}.debug{width:100%;max-width:480px;color:var(--muted);background:var(--surface);border:1px solid var(--border);border-radius:10px;margin:0 auto;padding:10px 12px;font-family:ui-monospace,monospace;font-size:12px}.debug div{line-height:1.5}.players{text-align:left;margin:8px 0 16px;padding:0;list-style:none}.players li{border:1px solid var(--border);background:var(--bg);border-radius:8px;margin-bottom:6px;padding:8px 12px}.hud-target{text-align:center;color:#fff;text-shadow:0 1px 4px #000000e6;font-size:16px;font-weight:700;position:absolute;top:40px;left:0;right:0}.modal{z-index:10;background:#000000b3;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.modal-card{background:var(--surface);border:1px solid var(--border);text-align:center;border-radius:16px;width:100%;max-width:360px;padding:28px 24px}.modal-card h2{margin:0 0 8px}
