:root{--bg:#1d1b26;--panel:#2b2838;--text:#f2ecd8;--muted:#a89f8a;--accent:#e07a5f;--danger:#ff6b6b}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);margin:0;font-family:ui-monospace,Cascadia Mono,Consolas,monospace;overflow:hidden}#game{position:fixed;inset:0}#game canvas{image-rendering:pixelated}.panel{background:var(--panel);border:3px solid #000;flex-direction:column;gap:12px;width:min(320px,100vw - 32px);padding:20px;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:6px 6px #000}.panel[hidden]{display:none}.panel h1{text-align:center;margin:0 0 4px;font-size:22px}.panel label{color:var(--muted);flex-direction:column;gap:4px;font-size:13px;display:flex}.panel input{font:inherit;color:#000;background:#fff;border:2px solid #000;padding:6px 8px}.panel input[type=color]{height:36px;padding:2px}.panel button{font:inherit;cursor:pointer;background:var(--accent);color:#000;border:2px solid #000;padding:8px;font-weight:700;box-shadow:3px 3px #000}.panel button:active{transform:translate(2px,2px);box-shadow:1px 1px #000}.panel button:disabled{opacity:.6;cursor:wait}.panel.wide{width:min(440px,100vw - 32px);max-height:calc(100vh - 32px);overflow-y:auto}.panel h2{text-align:center;margin:0;font-size:18px}.panel .actions{justify-content:flex-end;gap:8px;display:flex}.panel .actions button{flex:1}.panel button.secondary{background:var(--muted)}#wardrobe{z-index:10}.customizer{align-items:center;gap:14px;display:flex}.customizer .preview{image-rendering:pixelated;cursor:pointer;background:#c9a27e;border:2px solid #000;flex:none}.customizer .controls{flex-direction:column;flex:1;gap:8px;min-width:0;display:flex}.customizer .row{flex-direction:column;gap:3px;display:flex}.customizer .label{color:var(--muted);font-size:12px}.customizer .swatches{flex-wrap:wrap;gap:4px;display:flex}.customizer .swatches button{width:22px;height:22px;box-shadow:none;cursor:pointer;border:2px solid #000;padding:0}.customizer .swatches button.selected{outline:2px solid var(--text);outline-offset:1px}.customizer .picker{align-items:center;gap:4px;display:flex}.customizer .picker .name{text-align:center;white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:13px;overflow:hidden}.customizer .picker .arrow{width:26px;height:26px;box-shadow:none;border:2px solid #000;padding:0;font-size:16px;line-height:1}.customizer .picker input[type=color]{border:2px solid #000;flex:none;width:32px;height:26px;padding:1px}.customizer .picker input[type=color]:disabled{opacity:.3}@media (width<=420px){.customizer{flex-direction:column}}.hud-btn{font:inherit;cursor:pointer;background:var(--panel);color:var(--text);border:2px solid #000;padding:6px 10px;font-weight:700;position:fixed;top:12px;right:12px;box-shadow:3px 3px #000}.hud-btn[hidden]{display:none}#voice-hud{flex-wrap:wrap;align-items:center;gap:8px;max-width:calc(100vw - 180px);display:flex;position:fixed;top:12px;left:12px}#voice-hud[hidden]{display:none}#voice-hud .hud-btn{position:static}#voice-hud .hud-btn.secondary{background:#3a3648}#voice-hud .hud-btn.active{background:var(--accent);color:#000}#voice-hud .hud-btn.talking{outline-offset:1px;outline:2px solid #7ee787}#voice-hint{color:var(--muted);background:#0009;padding:4px 6px;font-size:12px}#voice-hint:empty{display:none}#join-error{min-height:1.2em;color:var(--danger);margin:0;font-size:13px}#chat{pointer-events:none;flex-direction:column;gap:6px;width:min(360px,100vw - 24px);display:flex;position:fixed;bottom:12px;left:12px}#chat[hidden]{display:none}#chat-log{pointer-events:auto;overflow-wrap:anywhere;background:#0009;max-height:32vh;margin:0;padding:6px 8px;font-size:13px;line-height:1.35;list-style:none;overflow-y:auto}#chat-log:empty{display:none}#chat-log time{color:var(--muted);font-size:11px}#chat-log b{color:#9ad1ff}#chat-log .mine b{color:#ffe9a8}#chat-log .system{color:var(--muted);font-style:italic}#chat-log .notice{color:var(--danger)}#chat-input{font:inherit;color:#000;pointer-events:auto;background:#fffe;border:2px solid #000;padding:6px 8px;font-size:13px}#chat-input:not(:focus){opacity:.7}#status{background:#000c;padding:6px 12px;font-size:13px;position:fixed;top:12px;left:50%;transform:translate(-50%)}