:root{--bg-app:#1e1f22;--bg-sidebar:#2b2d31;--bg-panel:#232428;--bg-main:#313338;--bg-input:#383a40;--bg-hover:#35373c;--bg-active:#404249;--bg-stage:#000;--text:#dbdee1;--text-strong:#f2f3f5;--text-muted:#949ba4;--accent:#5865f2;--accent-hover:#4752c4;--green:#23a55a;--red:#f23f43;--border:#1f2023;--radius:8px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg-main);color:var(--text);-webkit-font-smoothing:antialiased;font:15px/1.375 Segoe UI,system-ui,-apple-system,Roboto,Helvetica Neue,Arial,sans-serif}button,input{font:inherit;color:inherit}button{cursor:pointer;background:0 0;border:0}button:disabled{cursor:not-allowed;opacity:.5}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}input{border-radius:var(--radius);background:var(--bg-app);border:0;outline:none;width:100%;padding:10px 12px}input:focus{box-shadow:0 0 0 2px var(--accent)}h1,h2,p{margin:0}.btn-primary{background:var(--accent);color:#fff;border-radius:var(--radius);padding:10px 16px;font-weight:600;transition:background .15s}.btn-primary:hover:not(:disabled){background:var(--accent-hover)}.btn-ghost{border-radius:var(--radius);color:var(--text);padding:10px 16px}.btn-ghost:hover{text-decoration:underline}.btn-small{color:#fff;background:#0009;border-radius:6px;padding:6px 10px;font-size:13px;font-weight:600}.icon-btn{width:32px;height:32px;color:var(--text-muted);border-radius:6px;flex:none;place-items:center;display:inline-grid}.icon-btn:hover{background:var(--bg-active);color:var(--text-strong)}.icon-btn.small{width:24px;height:24px}.icon-btn.off{color:var(--red)}.icon-btn.active{color:var(--text-strong)}.icon-btn{position:relative}.badge{background:var(--red);color:#fff;text-align:center;border-radius:8px;min-width:16px;height:16px;padding:0 4px;font-size:11px;font-weight:800;line-height:16px}.icon-btn .badge{box-shadow:0 0 0 2px var(--bg-main);position:absolute;bottom:-2px;right:-4px}.room-button .badge{margin-left:auto}.icon-btn.live{color:#fff;background:var(--green)}.icon-btn.danger:hover{color:var(--red)}.login{background:radial-gradient(circle at 20% 20%, #3a3f9e 0, transparent 45%), radial-gradient(circle at 80% 80%, #2b7a5b 0, transparent 40%), var(--bg-app);place-items:center;min-height:100%;padding:16px;display:grid}.login-card{background:var(--bg-main);border-radius:12px;gap:12px;width:min(420px,100%);padding:32px;display:grid;box-shadow:0 8px 32px #0006}.login-card h1{color:var(--text-strong);text-align:center;font-size:24px}.login-card p{color:var(--text-muted);text-align:center;margin-bottom:8px}.login-card label,.modal label{text-transform:uppercase;color:var(--text-muted);font-size:12px;font-weight:700}.login-logo{background:var(--accent);color:#fff;border-radius:20px;justify-self:center;place-items:center;width:64px;height:64px;font-size:28px;font-weight:800;display:grid}.form-error{color:var(--red);font-size:14px}.app{grid-template-columns:260px minmax(0,1fr);height:100%;display:grid}.app.with-chat{grid-template-columns:260px minmax(0,1fr) 380px}.avatar{color:#fff;-webkit-user-select:none;user-select:none;border-radius:50%;flex:none;place-items:center;font-weight:700;display:inline-grid}.avatar.speaking{box-shadow:0 0 0 2px var(--bg-app), 0 0 0 4px var(--green)}.sidebar{background:var(--bg-sidebar);flex-direction:column;min-height:0;display:flex;position:relative}.sidebar-header{height:48px;color:var(--text-strong);border-bottom:1px solid var(--border);flex:none;align-items:center;padding:0 16px;font-weight:700;display:flex}.rooms{flex:1;padding:12px 8px;overflow-y:auto}.section-title{text-transform:uppercase;color:var(--text-muted);justify-content:space-between;align-items:center;padding:4px 4px 4px 8px;font-size:12px;font-weight:700;display:flex}.room{margin-top:2px}.room-row{color:var(--text-muted);border-radius:6px;align-items:center;gap:2px;padding-right:4px;display:flex}.room-row:hover{background:var(--bg-hover);color:var(--text)}.room-row.active{background:var(--bg-active);color:var(--text-strong)}.room-row.unread{color:var(--text-strong);font-weight:600}.room-button{min-width:0;color:inherit;text-align:left;flex:1;align-items:center;gap:6px;padding:6px 8px;display:flex}.room-chat{opacity:0}.room-row:hover .room-chat,.room-chat:focus-visible{opacity:1}.room-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.room-members{margin:0;padding:0 0 4px 28px;list-style:none}.member-row{width:100%;color:var(--text-muted);text-align:left;border-radius:6px;align-items:center;gap:8px;padding:3px 6px;font-size:14px;display:flex}button.member-row:hover{background:var(--bg-hover);color:var(--text)}.room-members li.me .member-row{color:var(--text)}.member-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.member-flag{color:var(--text-muted);flex:none}.member-flag.local{color:var(--red)}.live-pill{background:var(--red);color:#fff;text-transform:uppercase;border-radius:4px;flex:none;padding:1px 6px;font-size:11px;font-weight:800}.voice-panel{background:var(--bg-panel);border-bottom:1px solid var(--border);align-items:center;gap:8px;padding:8px 8px 8px 12px;display:flex;position:relative}.voice-status{flex:1;min-width:0;font-size:13px;display:grid}.voice-status strong{color:var(--green)}.voice-status span{color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.voice-actions{gap:4px;display:flex}.menu-backdrop{z-index:10;position:fixed;inset:0}.quality-menu{z-index:11;border-radius:var(--radius);background:#111214;gap:2px;padding:8px;display:grid;position:absolute;bottom:calc(100% + 8px);left:8px;right:8px;box-shadow:0 8px 24px #00000080}.quality-menu button{text-align:left;border-radius:4px;padding:8px 10px}.quality-menu button:hover{background:var(--accent);color:#fff}.menu-title{text-transform:uppercase;color:var(--text-muted);padding:4px 10px 6px;font-size:12px;font-weight:700}.user-panel{background:var(--bg-panel);flex:none;align-items:center;gap:8px;padding:8px;display:flex}.user-info{flex:1;min-width:0;font-size:13px;line-height:1.2;display:grid}.user-info strong{color:var(--text-strong);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.user-info span{color:var(--text-muted)}.user-menu{z-index:11;border-radius:var(--radius);background:#111214;width:240px;padding:8px;font-size:14px;position:fixed;box-shadow:0 8px 24px #00000080}.user-menu-header{color:var(--text-strong);align-items:center;gap:10px;padding:4px 8px 8px;display:flex}.user-menu-volume{gap:8px;padding:6px 8px;display:grid}.user-menu-row{justify-content:space-between;font-weight:600;display:flex}.user-menu-row span{color:var(--text-muted);font-variant-numeric:tabular-nums}.range{appearance:none;background:linear-gradient(to right, var(--accent) var(--fill), #4e5058 var(--fill));cursor:pointer;border-radius:4px;height:8px;padding:0}.range:focus{box-shadow:none}.range::-webkit-slider-thumb{appearance:none;background:#fff;border-radius:4px;width:16px;height:22px;box-shadow:0 1px 3px #00000080}.range::-moz-range-thumb{background:#fff;border:0;border-radius:4px;width:16px;height:22px}.user-menu hr{border:0;border-top:1px solid #2e2f34;margin:6px 4px}.menu-check{cursor:pointer;border-radius:4px;justify-content:space-between;align-items:center;padding:8px;font-weight:500;display:flex}.menu-check:hover{background:var(--bg-hover)}.menu-check input{width:18px;height:18px;accent-color:var(--accent);cursor:pointer;margin:0;padding:0}.main{flex-direction:column;min-width:0;min-height:0;display:flex;position:relative}.main-header{border-bottom:1px solid var(--border);height:48px;color:var(--text-muted);flex:none;align-items:center;gap:8px;padding:0 16px;display:flex}.main-header h1{color:var(--text-strong);text-overflow:ellipsis;white-space:nowrap;font-size:16px;overflow:hidden}.header-count{white-space:nowrap;margin-left:auto;font-size:13px}.banner{color:#fff;text-align:center;background:#b2770f;flex:none;padding:6px 16px;font-size:14px;font-weight:600}.toast{z-index:20;border-radius:var(--radius);background:var(--red);color:#fff;align-items:center;gap:12px;width:min(560px,100% - 32px);padding:10px 12px;display:flex;position:absolute;top:60px;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #0006}.toast span{flex:1}.toast .icon-btn{color:#fff}.empty{color:var(--text-muted);text-align:center;flex:1;place-content:center;justify-items:center;gap:8px;padding:16px;display:grid}.empty h2{color:var(--text-strong);font-size:20px}.stage{background:var(--bg-stage);flex-direction:column;flex:1;gap:8px;min-height:0;padding:8px;display:flex}.stage-grid{flex:1;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));align-content:center;gap:8px;min-height:0;display:grid;overflow-y:auto}.stage-grid .tile{aspect-ratio:16/9}.stage.focus .stage-grid{grid-template-columns:1fr;grid-auto-rows:minmax(0,1fr)}.stage.focus .stage-grid .tile{aspect-ratio:auto}.stage-strip{flex:none;gap:8px;height:120px;display:flex;overflow-x:auto}.stage-strip .tile{flex:none;width:213px}.stage-strip .tile-actions,.stage-strip .tile.invite .avatar{display:none}.tile{border-radius:var(--radius);background:#111214;min-height:0;position:relative;overflow:hidden}.tile video{object-fit:contain;background:#000;width:100%;height:100%;display:block}.tile:fullscreen{border-radius:0}.tile.invite{background:linear-gradient(160deg,#2b2d31,#1e1f22);place-content:center;justify-items:center;gap:8px;padding:12px;display:grid}.tile.invite strong{color:var(--text-strong)}.member-tile{background:color-mix(in srgb, var(--tile-color) 22%, #111214);place-items:center;display:grid}.member-tile.speaking{box-shadow:inset 0 0 0 3px var(--green)}.tile-loading{height:100%;color:var(--text-muted);text-align:center;place-items:center;padding:12px;display:grid}.tile-label{color:#fff;background:#0009;border-radius:6px;align-items:center;gap:6px;max-width:calc(100% - 16px);padding:4px 8px;font-size:13px;font-weight:600;display:flex;position:absolute;bottom:8px;left:8px}.tile-auto{color:#fff;background:#b2770f;border-radius:4px;padding:1px 6px;font-size:11px;font-weight:700}.tile-viewers{color:var(--text);align-items:center;gap:3px;display:inline-flex}.tile-actions{opacity:0;align-items:center;gap:4px;transition:opacity .15s;display:flex;position:absolute;top:8px;right:8px}.tile:hover .tile-actions,.tile:focus-within .tile-actions{opacity:1}.tile-actions .icon-btn{color:#fff;background:#0009}.tile-volume{background:#0009;border-radius:6px;align-items:center;display:flex}.tile-volume .icon-btn{background:0 0}.tile-volume-slider{align-items:center;gap:8px;width:0;transition:width .15s ease-out;display:flex;overflow:hidden}.tile-volume:hover .tile-volume-slider,.tile-volume:focus-within .tile-volume-slider{width:156px;padding-right:8px}.tile-volume .range{flex:none;width:96px}.tile-volume-value{color:#fff;font-variant-numeric:tabular-nums;min-width:36px;font-size:12px;font-weight:600}.stream-stats{color:#e3e5e8;white-space:pre-wrap;pointer-events:none;background:#000000bf;border-radius:6px;max-width:calc(100% - 16px);padding:6px 8px;font:12px/1.45 Consolas,Cascadia Mono,ui-monospace,monospace;position:absolute;top:8px;left:8px}.voice-lobby{text-align:center;color:#e3e5ff;background:radial-gradient(90% 60% at 50% 110%,#5865f2 0%,#0000 70%),linear-gradient(#16173a 0%,#23257a 100%);flex:1;place-content:center;justify-items:center;gap:10px;min-height:0;padding:24px 16px;display:grid}.voice-lobby h2{color:#fff;font-size:28px}.voice-lobby p{font-size:14px}.lobby-avatars{flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:4px;display:flex}.lobby-more{align-self:center;font-weight:700}.btn-light{border-radius:var(--radius);color:#111214;background:#fff;margin-top:8px;padding:10px 16px;font-weight:600}.btn-light:hover{background:#e3e5e8}.chat-panel{background:var(--bg-main);border-left:1px solid var(--border);flex-direction:column;min-width:0;min-height:0;display:flex}.chat-header{border-bottom:1px solid var(--border);height:48px;color:var(--text-muted);flex:none;align-items:center;gap:8px;padding:0 8px 0 16px;display:flex}.chat-header h2{min-width:0;color:var(--text-strong);text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:16px;overflow:hidden}.messages{flex-direction:column;flex:1;padding:16px 0 8px;display:flex;overflow-y:auto}.messages>:first-child{margin-top:auto}.chat-empty{color:var(--text-muted);gap:6px;padding:0 16px 16px;display:grid}.chat-empty strong{color:var(--text-strong);font-size:22px}.chat-empty-icon{background:var(--bg-input);width:64px;height:64px;color:var(--text-strong);border-radius:50%;place-items:center;margin-bottom:4px;display:grid}.message{gap:16px;margin-top:12px;padding:4px 16px;display:flex}.message.grouped{margin-top:0;padding-left:72px}.message:hover{background:#0000000f}.message-header{align-items:baseline;gap:8px;display:flex}.message-header time{color:var(--text-muted);font-size:12px}.message p{white-space:pre-wrap;overflow-wrap:anywhere}.composer{flex:none;padding:0 16px 20px}.composer input{background:var(--bg-input);padding:12px 16px}.modal-backdrop{z-index:30;background:#000000b3;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal{background:var(--bg-main);border-radius:12px;gap:10px;width:min(440px,100%);padding:24px;display:grid}.modal h2{color:var(--text-strong);font-size:20px}.modal p{color:var(--text-muted);margin-bottom:6px}.modal-actions{justify-content:flex-end;gap:8px;margin-top:8px;display:flex}@media (width<=720px){.app,.app.with-chat{grid-template-rows:minmax(0,40%) minmax(0,1fr);grid-template-columns:1fr}.app.with-chat{grid-template-rows:minmax(0,35%) minmax(0,1fr) minmax(0,1fr)}.chat-panel{border-left:0;border-top:1px solid var(--border)}}