:root{color-scheme:dark;--ui-bg: rgba(18, 16, 14, .88);--ui-border: rgba(196, 164, 104, .35);--ui-text: #ece4d4;--ui-muted: #9a917f;--ui-accent: #d9a441}*{box-sizing:border-box}html,body,#root{margin:0;height:100%;overflow:hidden;font-family:ui-sans-serif,system-ui,Segoe UI,sans-serif;color:var(--ui-text);background:#0e0d0c}.viewport{position:fixed;inset:0}.viewport canvas{width:100%;height:100%;display:block;outline:none;touch-action:none}.hud{position:fixed;inset:0;pointer-events:none;padding:12px}.hud>*{pointer-events:auto}.panel{background:var(--ui-bg);border:1px solid var(--ui-border);border-radius:8px;backdrop-filter:blur(6px)}.login{position:fixed;inset:0;display:grid;place-items:center;background:radial-gradient(circle at 50% 30%,#2a2622,#0e0d0c 70%)}.login .panel{padding:28px;width:min(360px,calc(100vw - 32px));display:grid;gap:14px}.login form{display:grid;gap:14px}.login h1{margin:0;font-size:28px;letter-spacing:.08em;color:var(--ui-accent)}.login p{margin:0;color:var(--ui-muted);font-size:13px;line-height:1.5}.login .muted strong{color:var(--ui-text);font-weight:600}.servers{list-style:none;margin:0;padding:0;display:grid;gap:8px}.servers button{width:100%;display:flex;align-items:baseline;justify-content:space-between;gap:12px;text-align:left}.servers .server-name{font-weight:600;color:var(--ui-text)}.servers .muted{font-size:11px}button.primary{background:var(--ui-accent);color:#1a1510;font-weight:600}button.primary:hover{background:#e7b559}button.link{background:none;border:none;padding:0;color:var(--ui-muted);font-size:12px;justify-self:start;text-decoration:underline}button.link:hover{background:none;color:var(--ui-text)}label{display:grid;gap:6px;font-size:12px;color:var(--ui-muted)}input{padding:9px 11px;border-radius:6px;border:1px solid var(--ui-border);background:#0006;color:var(--ui-text);font:inherit;font-size:14px}input:focus-visible{outline:2px solid var(--ui-accent);outline-offset:1px}button{padding:9px 14px;border-radius:6px;border:1px solid var(--ui-border);background:#d9a44129;color:var(--ui-text);font:inherit;cursor:pointer}button:hover{background:#d9a4414d}button:focus-visible{outline:2px solid var(--ui-accent);outline-offset:1px}button[aria-pressed=true]{background:var(--ui-accent);color:#1a1510;font-weight:600}.error{color:#f0a0a0;font-size:13px;margin:0}.status{position:absolute;top:12px;left:12px;padding:7px 11px;font-size:12px;color:var(--ui-muted);display:flex;gap:10px;align-items:center}.status strong{color:var(--ui-text);font-weight:600}.controls{position:absolute;top:12px;right:12px;padding:8px;display:flex;gap:8px}.chat{position:absolute;left:12px;bottom:12px;width:min(380px,calc(100vw - 24px));display:flex;flex-direction:column;max-height:40vh}.chat ul{list-style:none;margin:0;padding:10px;overflow-y:auto;display:grid;gap:5px;font-size:13px}.chat li{line-height:1.4;word-break:break-word}.chat .from{color:var(--ui-accent);font-weight:600}.chat .system{color:var(--ui-muted);font-style:italic}.chat form{display:flex;gap:8px;padding:8px;border-top:1px solid var(--ui-border)}.chat input{flex:1;min-width:0}.hint{position:absolute;left:50%;bottom:14px;transform:translate(-50%);padding:6px 12px;font-size:12px;color:var(--ui-muted);white-space:nowrap}@media(max-width:560px){.chat{width:calc(100vw - 24px);max-height:32vh}.hint{display:none}}.debug{position:absolute;top:60px;right:12px;width:232px;padding:10px 12px 12px;font-size:12px}.debug header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.debug h2{margin:0;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ui-accent)}button.icon{padding:0;width:22px;height:22px;line-height:1;font-size:16px;border-color:transparent;background:transparent;color:var(--ui-muted)}button.icon:hover{color:var(--ui-text);background:#ffffff12}.debug .toggles{display:grid;gap:7px;margin-bottom:11px}.check{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ui-text);cursor:pointer}.check input{width:14px;height:14px;accent-color:var(--ui-accent);cursor:pointer}.check .unit{margin-left:auto;color:var(--ui-muted);font-variant-numeric:tabular-nums}.debug dl{display:grid;grid-template-columns:auto 1fr;gap:3px 12px;margin:0 0 10px;padding-top:10px;border-top:1px solid var(--ui-border)}.debug dt{color:var(--ui-muted)}.debug dd{margin:0;text-align:right;font-variant-numeric:tabular-nums;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.debug .muted{margin:0;color:var(--ui-muted);font-size:11px}kbd{padding:1px 5px;border:1px solid var(--ui-border);border-radius:3px;background:#00000059;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px}@media(max-width:560px){.debug{top:60px;right:12px;width:calc(100vw - 24px);max-width:232px}}.legend{list-style:none;margin:2px 0 0;padding:7px 0 0 2px;display:grid;gap:5px;border-top:1px dashed var(--ui-border);font-size:11px;color:var(--ui-muted)}.legend li{display:flex;align-items:center;gap:7px}.swatch{width:14px;height:3px;border-radius:2px;flex:none}.disconnected{position:fixed;inset:0;display:grid;place-items:center;background:#0807069e;backdrop-filter:blur(3px);z-index:10}.disconnected .panel{padding:22px 24px;width:min(340px,calc(100vw - 32px));display:grid;gap:12px;text-align:center}.disconnected h2{margin:0;font-size:17px;letter-spacing:.04em;color:var(--ui-accent)}.disconnected p{margin:0;font-size:13px;color:var(--ui-muted);line-height:1.5}