:root{--blurple: #5865f2;--ink: #23272a;--muted: #5b6470}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);background:#f2f3f5}.room-placeholder{width:100%;height:100vh;height:100dvh;display:flex;flex-direction:column}.room-header h1{margin:0 0 4px;color:var(--blurple)}.room-sub{margin:0;color:var(--muted)}.stage-host{position:relative;width:100%;flex:1;min-height:0;overflow:hidden;background:#ede9e2;touch-action:none}.stage-host canvas{display:block;width:100%;height:100%}.stage-fallback{padding:24px;color:var(--muted);text-align:center}.debug-panel{margin-top:24px;padding:20px 24px;text-align:left;background:#fff;border-radius:16px;box-shadow:0 2px 12px #00000014}.debug-panel h2{margin:0 0 12px;font-size:14px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.debug-panel dl{display:grid;gap:8px;margin:0}.debug-panel dl div{display:flex;gap:12px}.debug-panel dt{min-width:96px;font-weight:600;color:var(--ink)}.debug-panel dd{margin:0;color:var(--muted);word-break:break-all}.voice-roster{margin-top:24px;padding:20px 24px;text-align:left;background:#fff;border-radius:16px;box-shadow:0 2px 12px #00000014}.voice-roster h2{margin:0 0 12px;font-size:14px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.voice-roster ul{margin:0;padding-left:20px;display:grid;gap:6px}.voice-warning{color:#b3261e}.roster-id,.roster-empty{color:var(--muted)}.state-screen{max-width:560px;margin:20vh auto 0;padding:32px;text-align:center;background:#fff;border-radius:16px;box-shadow:0 2px 12px #00000014}.state-screen h1{margin:0 0 8px;color:var(--blurple)}.state-screen p{color:var(--muted)}.state-screen code{padding:1px 6px;font-size:.9em;background:#f2f3f5;border-radius:6px}.loading-screen{display:flex;align-items:center;justify-content:center;height:100vh;height:100dvh}.loading-icon-wrap{position:relative;width:120px;height:120px}.loading-icon{display:block;width:120px;height:120px;border-radius:28px;box-shadow:0 4px 16px #00000026;animation:loading-pulse 1.4s ease-in-out infinite}@keyframes loading-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.06)}}.overlay{position:absolute;inset:0;overflow:hidden;pointer-events:none}.name-tag{position:absolute;left:0;top:0;display:inline-flex;align-items:center;gap:4px;max-width:160px;padding:2px 8px;background:#111214d9;color:#fff;border-radius:999px;font-size:12px;font-weight:600;line-height:1.4;white-space:nowrap;box-shadow:0 1px 4px #00000040;will-change:transform}.name-tag-label{overflow:hidden;text-overflow:ellipsis}.name-tag--compact{font-size:10px;padding:1px 6px;gap:2px;max-width:120px}.name-tag--compact .name-tag-icon{width:11px;height:11px}.name-tag--compact .name-tag-icon svg{width:11px;height:11px}.name-tag-icon{display:inline-flex;flex:none;width:14px;height:14px;color:#ed4245}.name-tag-icon svg{width:14px;height:14px}.name-tag.is-speaking{box-shadow:0 0 0 2px #5865f2,0 1px 4px #00000040}.emote-bubble{position:absolute;left:0;top:0;display:flex;align-items:center;justify-content:center;width:44px;height:44px;background:#fff;border-radius:50%;font-size:26px;line-height:1;box-shadow:0 2px 8px #00000040;pointer-events:none;will-change:transform,opacity;animation:emote-show 3s ease forwards}@keyframes emote-show{0%{opacity:0;scale:.6}8%{opacity:1;scale:1}85%{opacity:1;scale:1}to{opacity:0;scale:.9}}.error-banner{position:sticky;top:0;z-index:50;margin:12px;padding:12px 16px;background:#fff;border:1px solid #ed4245;border-left:4px solid #ed4245;border-radius:12px;box-shadow:0 2px 12px #00000026;color:var(--ink, #23272a)}.error-banner strong{display:block;margin-bottom:4px;font-size:14px}.error-banner p{margin:0 0 10px;font-size:13px;color:var(--muted, #5b6470)}.error-banner-btn{appearance:none;border:0;margin-right:8px;padding:8px 14px;min-height:36px;background:#5865f2;color:#fff;border-radius:999px;font-size:13px;font-weight:600;cursor:pointer;touch-action:manipulation}.error-banner-btn--ghost{background:transparent;color:var(--muted, #5b6470);border:1px solid #d0d3d8}.emote-bar-host{display:flex;justify-content:center;padding:8px 0 4px}.emote-bar{display:inline-flex;gap:4px;padding:4px;background:#ffffffe6;border-radius:999px;box-shadow:0 1px 4px #00000026}.emote-bar-btn{appearance:none;border:0;background:transparent;width:36px;height:36px;padding:0;font-size:22px;line-height:1;border-radius:50%;cursor:pointer;touch-action:manipulation}@media(pointer:coarse){.emote-bar-btn{width:44px;height:44px;font-size:26px}}.emote-bar-btn:hover:not(:disabled){background:#5865f21f}.emote-bar-btn:disabled{opacity:.45;cursor:default}