*,:before,:after{box-sizing:border-box;margin:0;padding:0}[hidden]{display:none!important}:root{--bg:#0f0f0f;--surface:#1a1a1a;--surface-2:#252525;--surface-3:#2a2a2a;--border:#333;--text:#e8e8e8;--text-dim:#a3a3a3;--accent:#60a5fa;--accent-hover:#93c5fd;--accent-fill:#2563eb;--accent-fill-hover:#1d4ed8;--on-accent:#fff;--accent-glow:#3b82f64d;--danger:#f87171;--danger-hover:#dc2626;--success:#22c55e;--warning:#f59e0b;--status-ink:#0f0f0f;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--transition-fast:.15s ease;--transition-normal:.25s ease;--shadow-panel:0 2px 8px #0000004d;--shadow-glow:0 0 12px var(--accent-glow)}html,body{background:var(--bg);height:100%;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}input::placeholder,textarea::placeholder{color:var(--text-dim);opacity:1}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-dim)}#app{flex-direction:column;height:100%;display:flex}header{background:var(--surface);z-index:10;flex-shrink:0;justify-content:space-between;align-items:center;padding:.6rem 1rem;display:flex;box-shadow:0 1px 4px #0006}.header-left{align-items:center;gap:.75rem;display:flex}header h1{font-size:1.1rem;font-weight:600}.room-label{color:var(--text-dim);background:var(--surface-2);border:1px solid var(--border);border-radius:999px;padding:.15rem .6rem;font-size:.8rem}.header-right{align-items:center;gap:.5rem;display:flex}.quality-dot{background:var(--text-dim);border-radius:50%;flex-shrink:0;width:10px;height:10px}.help-link{min-width:44px;min-height:44px;color:var(--text);text-underline-offset:.2em;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.field-label{text-align:left;color:var(--text);margin-bottom:.25rem;font-size:.85rem;display:block}.field-hint{color:var(--text-dim);text-align:left;margin-top:.35rem;font-size:.8rem;line-height:1.4}.join-form .field-label{margin-bottom:-.25rem}.help-link:focus-visible{outline:3px solid var(--text);outline-offset:3px}#scroll-bottom-btn:focus-visible{outline:3px solid var(--text);outline-offset:3px}.quality-dot.quality-good{background:var(--success);box-shadow:0 0 4px var(--success)}.quality-dot.quality-fair{background:var(--warning);box-shadow:0 0 4px var(--warning)}.quality-dot.quality-poor{background:var(--danger);box-shadow:0 0 4px var(--danger)}.status{border-radius:999px;padding:.2rem .55rem;font-size:.75rem;font-weight:500}.status.disconnected{background:var(--danger);color:var(--status-ink)}.status.connected{background:var(--success);color:var(--status-ink)}.status.connecting{background:var(--warning);color:var(--status-ink)}#join-screen{flex:1 0 auto;justify-content:center;align-items:center;min-width:0;padding:2rem 1rem;display:flex}.join-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);min-width:0;box-shadow:var(--shadow-panel), 0 0 40px #0000004d;flex-direction:column;flex-shrink:0;align-items:stretch;width:100%;max-width:40rem;padding:2.5rem 2rem 2rem;display:flex}.join-brand{background:linear-gradient(135deg, var(--accent), #818cf8);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:.25rem;font-size:1.5rem;font-weight:700}.join-subtitle{color:var(--text-dim);margin-bottom:1.75rem;font-size:.85rem}.join-form{flex-direction:column;gap:.75rem;width:100%;display:flex}.join-form input,.room-search-row input{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);min-width:0;min-height:44px;color:var(--text);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);outline:none;padding:.65rem .9rem;font-size:1rem}.join-form input:focus,.room-search-row input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.join-form button{background:var(--accent-fill);color:var(--on-accent);border-radius:var(--radius-md);cursor:pointer;transition:background var(--transition-fast), transform var(--transition-fast);border:none;padding:.7rem;font-size:.95rem;font-weight:600}.join-form button:hover:not(:disabled){background:var(--accent-fill-hover);transform:translateY(-1px)}.join-form button:active:not(:disabled){transform:translateY(0)}.join-form button:disabled{opacity:.4;cursor:not-allowed}#room-screen{transition:grid-template-columns var(--transition-normal);flex:1;grid-template-rows:1fr auto;gap:0;display:grid;overflow:hidden}#main-area{grid-area:1/1;display:flex;overflow:hidden}#video-grid{flex:1;grid-template-columns:1fr;place-content:center;gap:8px;padding:8px;display:grid;overflow-y:auto}#video-grid[data-count="2"],#video-grid[data-count="3"],#video-grid[data-count="4"]{grid-template-columns:1fr 1fr}#video-grid[data-count="5"],#video-grid[data-count="6"]{grid-template-columns:1fr 1fr 1fr}#video-grid[data-count=many]{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));align-content:start}.video-tile{background:var(--surface-2);border-radius:var(--radius-lg);aspect-ratio:16/9;transition:box-shadow var(--transition-normal), transform var(--transition-fast);animation:.3s fadeIn;position:relative;overflow:hidden}.video-tile:hover{box-shadow:var(--shadow-panel);transform:scale(1.01)}.video-tile video{object-fit:cover;width:100%;height:100%;display:block}.video-tile .name-tag{color:#fff;pointer-events:none;background:linear-gradient(#0000,#000000b3);padding:20px 10px 8px;font-size:.8rem;font-weight:500;position:absolute;bottom:0;left:0;right:0}.video-tile.local video{transform:scaleX(-1)}.video-tile.speaking{box-shadow:0 0 0 3px var(--accent), 0 0 16px var(--accent-glow);transform:scale(1.01)}.video-tile.dominant-speaker,.video-tile.dominant-speaker.speaking{box-shadow:0 0 0 4px var(--accent), 0 0 20px var(--accent-glow);transform:scale(1.01)}.video-tile.screen-share{grid-area:span 2/span 2}.video-tile.screen-share video{object-fit:contain;background:#000}#screen-btn.active{border-color:var(--accent)!important;color:var(--accent)!important;background:#3b82f626!important}.video-tile .no-video-avatar{background:var(--surface-3);justify-content:center;align-items:center;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}.video-tile .no-video-avatar .avatar-initial{color:#fff;border-radius:50%;justify-content:center;align-items:center;width:64px;height:64px;font-size:1.5rem;font-weight:600;display:flex}#sidebar{background:var(--surface);border-left:1px solid var(--border);flex-direction:column;grid-area:1/2;display:flex;overflow:hidden}#sidebar-tabs{border-bottom:1px solid var(--border);flex-shrink:0;display:flex}#sidebar-tabs .tab{color:var(--text-dim);cursor:pointer;transition:color var(--transition-fast), border-color var(--transition-fast);background:0 0;border:none;border-bottom:2px solid #0000;flex:1;justify-content:center;align-items:center;gap:.35rem;padding:.6rem .5rem;font-size:.8rem;font-weight:500;display:flex}#sidebar-tabs .tab:hover{color:var(--text)}#sidebar-tabs .tab.active{color:var(--accent);border-bottom-color:var(--accent)}#sidebar-content{flex:1;display:flex;position:relative;overflow:hidden}.tab-content{flex-direction:column;display:none;position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden}.tab-content.active{display:flex}#chat-panel{position:relative}#chat-messages{flex-direction:column;flex:1;gap:.25rem;padding:.5rem .75rem;display:flex;overflow-y:auto}.chat-msg{border-radius:var(--radius-md);background:var(--surface-2);word-wrap:break-word;max-width:100%;padding:.4rem .65rem;animation:.2s fadeInUp}.chat-msg .sender{margin-bottom:.1rem;font-size:.78rem;font-weight:600;display:block}.chat-msg .msg-text{color:var(--text);font-size:.85rem;line-height:1.4}.chat-msg .msg-text a{color:var(--accent);text-decoration:underline}.chat-msg .msg-text a:hover{color:var(--accent-hover)}.chat-msg .msg-time{color:var(--text-dim);opacity:0;transition:opacity var(--transition-fast);margin-top:.15rem;font-size:.7rem}.chat-msg:hover .msg-time{opacity:1}.chat-msg.system{text-align:center;background:0 0;padding:.25rem 0}.chat-msg.system .msg-text{color:var(--text-dim);font-size:.78rem;font-style:italic}#scroll-bottom-btn{background:var(--accent-fill);color:var(--on-accent);cursor:pointer;width:44px;height:44px;box-shadow:var(--shadow-panel);z-index:5;transition:background var(--transition-fast);border:none;border-radius:999px;justify-content:center;align-items:center;display:flex;position:absolute;bottom:52px;left:50%;transform:translate(-50%)}#scroll-bottom-btn:hover{background:var(--accent-fill-hover)}#unread-badge{background:var(--danger);color:var(--status-ink);border-radius:999px;justify-content:center;align-items:center;min-width:18px;height:18px;padding:0 4px;font-size:.65rem;font-weight:700;display:flex;position:absolute;top:-6px;right:-6px}#chat-input-row{border-top:1px solid var(--border);flex-shrink:0;gap:6px;padding:.5rem;display:flex}#chat-input{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);outline:none;flex:1;padding:.5rem .7rem;font-size:.85rem}#chat-input:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-glow)}#chat-send-btn{background:var(--accent-fill);width:36px;height:36px;color:var(--on-accent);border-radius:var(--radius-md);cursor:pointer;transition:background var(--transition-fast);border:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:flex}#chat-send-btn:hover{background:var(--accent-fill-hover)}#users-panel{padding:.5rem}#participant-list{flex-direction:column;gap:2px;list-style:none;display:flex}#participant-list li{border-radius:var(--radius-md);transition:background var(--transition-fast);align-items:center;gap:.6rem;padding:.45rem .6rem;display:flex}#participant-list li:hover{background:var(--surface-2)}.participant-avatar{color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;font-size:.8rem;font-weight:600;display:flex}.participant-info{flex:1;min-width:0}.participant-name{text-overflow:ellipsis;white-space:nowrap;font-size:.85rem;font-weight:500;overflow:hidden}.participant-name .you-tag{color:var(--text-dim);margin-left:.3rem;font-size:.7rem;font-weight:400}.participant-media-icons{flex-shrink:0;gap:4px;display:flex}.participant-media-icons .media-icon{width:18px;height:18px;color:var(--text-dim);justify-content:center;align-items:center;display:flex}.participant-media-icons .media-icon.active{color:var(--success)}.participant-media-icons .media-icon.muted{color:var(--danger)}#participant-list li.speaking{box-shadow:inset 3px 0 0 var(--accent);background:#3b82f61a}#controls{background:var(--surface);border-top:1px solid var(--border);grid-area:2/1/auto/-1;justify-content:center;align-items:center;gap:.75rem;padding:.75rem;display:flex}#controls button{border:2px solid var(--border);background:var(--surface-2);width:48px;height:48px;color:var(--text);cursor:pointer;transition:background var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast);border-radius:50%;justify-content:center;align-items:center;display:flex;position:relative}#controls button:hover{transform:scale(1.08)}#controls button .btn-tooltip{background:var(--surface-3);color:var(--text);border-radius:var(--radius-sm);white-space:nowrap;pointer-events:none;opacity:0;transition:opacity var(--transition-fast);box-shadow:var(--shadow-panel);padding:.2rem .5rem;font-size:.72rem;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%)}#controls button:hover .btn-tooltip{opacity:1}#controls button.active{border-color:var(--success);color:var(--success);background:#22c55e26}#controls button.muted{border-color:var(--danger);color:var(--danger);background:#ef444426}#settings-btn{border-color:var(--border)!important;background:var(--surface-2)!important;color:var(--text-dim)!important}#settings-btn:hover{color:var(--text)!important;border-color:var(--text-dim)!important}#controls button.ptt-active{animation:1s ease-in-out infinite pttPulse}@keyframes pttPulse{0%,to{box-shadow:0 0 0 3px var(--success), 0 0 8px #22c55e4d}50%{box-shadow:0 0 0 5px var(--success), 0 0 16px #22c55e80}}.ptt-label{color:var(--text-dim);white-space:nowrap;pointer-events:none;font-size:.6rem;position:absolute;bottom:-18px;left:50%;transform:translate(-50%)}#leave-btn{border-color:var(--danger)!important;color:var(--danger)!important;background:0 0!important}#leave-btn:hover{background:var(--danger)!important;color:var(--status-ink)!important}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;background:#0009;justify-content:center;align-items:center;animation:.15s fadeIn;display:flex;position:fixed;top:0;bottom:0;left:0;right:0}.modal-content{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-panel), var(--shadow-glow);width:400px;max-width:calc(100vw - 2rem);max-height:calc(100vh - 4rem);animation:.2s fadeInUp;overflow-y:auto}.modal-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:1rem 1.25rem;display:flex}.modal-header h2{font-size:1rem;font-weight:600}.modal-close{color:var(--text-dim);cursor:pointer;transition:color var(--transition-fast);background:0 0;border:none;padding:0;font-size:1.4rem;line-height:1}.modal-close:hover{color:var(--text)}.modal-body{flex-direction:column;gap:1rem;padding:1rem 1.25rem;display:flex}.setting-group{flex-direction:column;gap:.35rem;display:flex}.setting-group label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.04em;font-size:.8rem;font-weight:500}.setting-group select{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;transition:border-color var(--transition-fast);outline:none;padding:.5rem .7rem;font-size:.85rem}.setting-group select:focus{border-color:var(--accent)}#room-screen.layout-classic #main-area{grid-column:2}#room-screen.layout-classic #sidebar{grid-column:3}#classic-users-panel{background:var(--surface);border-right:1px solid var(--border);grid-area:1/1;padding:.75rem .5rem;display:none;overflow-y:auto}#room-screen.layout-classic #classic-users-panel{display:block}#classic-users-panel .panel-title{color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border);margin-bottom:.5rem;padding:0 .5rem .5rem;font-size:.75rem;font-weight:600}#classic-users-panel .classic-user-list{flex-direction:column;gap:2px;list-style:none;display:flex}#classic-users-panel .classic-user-list li{border-radius:var(--radius-md);transition:background var(--transition-fast);align-items:center;gap:.5rem;padding:.4rem .5rem;font-size:.82rem;display:flex}#classic-users-panel .classic-user-list li:hover{background:var(--surface-2)}#classic-users-panel .classic-user-list li.speaking{box-shadow:inset 3px 0 0 var(--accent);background:#3b82f61a}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.mod-context-menu{z-index:200;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-panel), 0 8px 24px #0006;min-width:160px;padding:4px 0;animation:.1s fadeIn;position:fixed}.mod-context-menu button{width:100%;color:var(--text);text-align:left;cursor:pointer;transition:background var(--transition-fast);background:0 0;border:none;padding:.5rem .9rem;font-size:.82rem;display:block}.mod-context-menu button:hover{background:var(--surface-2)}.mod-context-menu button.danger{color:var(--danger)}.mod-context-menu button.danger:hover{background:#ef44441a}#lobby-screen{flex:1;justify-content:center;align-items:center;display:flex}.lobby-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-panel), 0 0 40px #0000004d;text-align:center;flex-direction:column;align-items:center;width:360px;max-width:calc(100vw - 2rem);padding:2.5rem 2rem;display:flex}.lobby-card h2{margin-bottom:.5rem;font-size:1.2rem;font-weight:600}.lobby-card p{color:var(--text-dim);margin-bottom:.25rem;font-size:.85rem}.lobby-waiting-text{margin-top:1rem;font-weight:500;color:var(--text)!important}.lobby-spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:40px;height:40px;margin:1rem 0;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.lobby-card button{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-dim);cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast);margin-top:1.25rem;padding:.55rem 1.5rem;font-size:.85rem}.lobby-card button:hover{background:var(--surface-3);color:var(--text)}#toast-container{z-index:300;pointer-events:none;flex-direction:column;gap:8px;display:flex;position:fixed;bottom:80px;right:1rem}.toast{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);box-shadow:var(--shadow-panel);pointer-events:auto;max-width:320px;padding:.6rem 1rem;font-size:.82rem;animation:.2s toastIn,.3s 2.7s forwards toastOut}@keyframes toastIn{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes toastOut{0%{opacity:1}to{opacity:0}}.role-badge{margin-right:2px;font-size:.85rem;font-weight:700}.role-badge.role-owner{color:#f59e0b}.role-badge.role-admin{color:#ef4444}.role-badge.role-moderator{color:#22c55e}.role-badge.role-member{color:var(--accent)}.setting-toggle{justify-content:space-between;align-items:center;flex-direction:row!important}.setting-toggle input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--surface-3);border:1px solid var(--border);cursor:pointer;width:40px;height:22px;transition:background var(--transition-fast), border-color var(--transition-fast);border-radius:11px;flex-shrink:0;position:relative}.setting-toggle input[type=checkbox]:after{content:"";background:var(--text-dim);width:16px;height:16px;transition:transform var(--transition-fast), background var(--transition-fast);border-radius:50%;position:absolute;top:2px;left:2px}.setting-toggle input[type=checkbox]:checked{background:var(--accent-fill);border-color:var(--accent-fill)}.setting-toggle input[type=checkbox]:checked:after{background:#fff;transform:translate(18px)}.setting-toggle label{text-transform:none!important;color:var(--text)!important;font-size:.85rem!important}#hand-btn{font-size:1.2rem}#hand-btn.hand-raised{background:#f59e0b26!important;border-color:#f59e0b!important}#room-settings-btn{border-color:var(--border)!important;background:var(--surface-2)!important;color:var(--text-dim)!important}#room-settings-btn:hover{color:var(--text)!important;border-color:var(--text-dim)!important}@media (max-width:768px){#room-screen,#room-screen.layout-classic{grid-template-rows:1fr auto auto;grid-template-columns:1fr!important}#main-area{grid-column:1}#sidebar{border-left:none;border-top:1px solid var(--border);grid-row:2;max-height:240px;grid-column:1!important}#classic-users-panel{display:none!important}#controls{grid-row:3;grid-column:1!important}#controls button{width:42px;height:42px}.video-tile{border-radius:var(--radius-md)}}@media (max-width:480px){#join-screen{padding:1rem .75rem}.join-card{padding:1.5rem 1rem}#controls button{width:38px;height:38px}#controls{gap:.5rem;padding:.5rem}}.auth-bar{text-align:center;min-width:0;margin-bottom:1rem}.auth-bar .auth-link-btn{min-height:44px}.auth-user-info{color:var(--text-secondary,#b0b0b0);flex-wrap:wrap;justify-content:center;align-items:center;gap:.75rem;margin-top:.5rem;font-size:.9rem;display:flex}#auth-display-name{overflow-wrap:anywhere;min-width:0;color:var(--text-primary,#e0e0e0);font-weight:500}.auth-link-btn{color:var(--accent,#6c9fff);cursor:pointer;text-underline-offset:2px;background:0 0;border:none;padding:.25rem .5rem;font-size:.85rem;text-decoration:underline}.auth-link-btn:hover{color:var(--accent-hover,#8bb4ff)}.modal-sm{max-width:380px}.auth-error{color:#ff6b7a;background:#dc354526;border:1px solid #dc354566;border-radius:6px;margin-bottom:.75rem;padding:.5rem .75rem;font-size:.85rem}.auth-alt-actions{border-top:1px solid var(--border,#333);justify-content:space-between;margin-top:.75rem;padding-top:.75rem;display:flex}.btn-primary{background:var(--accent-fill);color:var(--on-accent);cursor:pointer;border:none;border-radius:8px;padding:.6rem 1.2rem;font-size:.9rem;font-weight:500}.btn-primary:hover{background:var(--accent-fill-hover)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:var(--bg-secondary,#2a2a2a);color:var(--text-secondary,#b0b0b0);border:1px solid var(--border,#333);cursor:pointer;border-radius:8px;padding:.5rem 1rem;font-size:.85rem}.btn-secondary:hover{background:var(--bg-hover,#333)}.btn-full{width:100%;margin-top:.5rem}#room-browser{width:100%;min-width:0}.room-browser-header{flex-wrap:wrap;align-items:center;gap:.75rem;margin-bottom:.75rem;display:flex}.room-search-row{flex:14rem;min-width:0}.room-search-row input{width:100%}#create-room-btn{white-space:nowrap;flex:auto;min-height:44px;padding:.5rem 1rem;font-size:.85rem}.room-list{flex-direction:column;gap:.5rem;max-height:300px;margin-bottom:.75rem;display:flex;overflow-y:auto}.room-card{background:var(--bg-secondary,#2a2a2a);border:1px solid var(--border,#333);cursor:pointer;border-radius:8px;flex-wrap:wrap;flex-shrink:0;align-items:center;gap:.75rem;width:100%;min-width:0;padding:.75rem;transition:border-color .15s;display:flex}.room-card:hover{border-color:var(--accent,#6c9fff)}#room-browser .room-card:focus-visible{outline-offset:-3px}.room-card-info{flex:1;min-width:0}.room-card-name{color:var(--text-primary,#e0e0e0);align-items:flex-start;gap:.5rem;font-weight:500;display:flex}.room-card-name>span:first-child{overflow-wrap:anywhere;min-width:0}.room-card-name>span+span{flex-shrink:0}.room-card-topic{color:var(--text-secondary,#b0b0b0);text-overflow:ellipsis;white-space:nowrap;font-size:.8rem;overflow:hidden}.room-card-meta{min-width:0;color:var(--text-secondary,#b0b0b0);flex-wrap:wrap;flex:100%;align-items:center;gap:.5rem;font-size:.75rem;display:flex}.room-card-badge{color:var(--accent,#6c9fff);background:#6c9fff26;border-radius:4px;padding:.1rem .4rem;font-size:.7rem;font-weight:500;display:inline-block}.room-list-empty{text-align:center;color:var(--text-secondary,#b0b0b0);padding:2rem;font-size:.9rem}#room-load-more{width:100%}.divider{color:var(--text-secondary,#b0b0b0);align-items:center;gap:1rem;margin:1rem 0;font-size:.8rem;display:flex}.divider:before,.divider:after{content:"";border-bottom:1px solid var(--border,#333);flex:1}#lobby-list{margin:0;padding:0;list-style:none}.lobby-entry{border-bottom:1px solid var(--border,#333);align-items:center;gap:.5rem;padding:.5rem;display:flex}.lobby-entry-name{flex:1;font-size:.9rem}.lobby-entry-actions{gap:.25rem;display:flex}.lobby-entry-actions button{cursor:pointer;border:none;border-radius:4px;padding:.25rem .5rem;font-size:.75rem}.lobby-admit-btn{color:#4caf50;background:#28a74533}.lobby-admit-btn:hover{background:#28a74559}.lobby-deny-btn{color:#ff6b7a;background:#dc354533}.lobby-deny-btn:hover{background:#dc354559}.mod-menu-group{border-top:1px solid var(--border,#333);margin-top:2px;padding-top:2px}.mod-menu-label{color:var(--text-secondary,#b0b0b0);text-transform:uppercase;letter-spacing:.5px;padding:4px 12px;font-size:.7rem}.toast-action{flex-direction:column;gap:.5rem;animation:.2s toastIn;display:flex}.toast-actions{justify-content:flex-end;gap:.5rem;display:flex}.toast-actions button{cursor:pointer;color:var(--accent,#6c9fff);background:#6c9fff33;border:none;border-radius:4px;padding:.25rem .75rem;font-size:.8rem}.toast-actions button:hover{background:#6c9fff59}.settings-section{border-bottom:1px solid var(--border,#333);margin-bottom:1rem;padding-bottom:.75rem}.settings-section:last-child{border-bottom:none;margin-bottom:0}.settings-section-title{text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary,#b0b0b0);margin-bottom:.5rem;font-size:.75rem}.setting-hint{color:var(--text-secondary,#b0b0b0);margin-top:.25rem;font-size:.75rem;display:block}.room-topic{color:var(--text-secondary,#b0b0b0);text-overflow:ellipsis;white-space:nowrap;cursor:pointer;max-width:300px;font-size:.75rem;overflow:hidden}.room-topic:hover{color:var(--text-primary,#e0e0e0)}#room-tools{background:var(--surface);border-bottom:1px solid var(--border);flex-wrap:wrap;flex-shrink:0;justify-content:space-between;align-items:center;gap:.35rem;padding:.3rem .6rem;display:flex}.room-navigation,#community-actions{flex-wrap:wrap;align-items:center;gap:.4rem;display:flex}.room-navigation button,.participant-actions-button{font:inherit;border:1px solid var(--border);color:var(--text);background:var(--surface-2);border-radius:var(--radius-sm);cursor:pointer;padding:.4rem .6rem;font-size:.8rem}.room-navigation button:hover,.participant-actions-button:hover{background:var(--surface-3);border-color:var(--text-dim)}.room-navigation button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.participant-actions-button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.panel-resize-handle:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.room-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}#room-screen{min-height:0}#room-screen.layout-classic{grid-template-columns:var(--roster-width,220px) minmax(0, 1fr) var(--chat-width,320px)}#room-screen.layout-modern{grid-template-columns:minmax(0, 1fr) var(--chat-width,320px)}#sidebar{min-width:0;position:relative}#classic-users-panel{min-width:0;position:relative;overflow:hidden}#room-screen.layout-classic #classic-users-panel{flex-direction:column;display:flex}#classic-users-panel .classic-user-list{flex:1;min-height:0;overflow-y:auto}.classic-participant-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.participant-actions-button{flex-shrink:0;width:30px;height:30px;padding:0;font-size:1.25rem;line-height:1}.panel-resize-handle{z-index:4;cursor:col-resize;touch-action:none;width:8px;position:absolute;top:0;bottom:0}.panel-resize-handle:after{content:"";background:var(--text-dim);opacity:.5;border-radius:2px;width:3px;height:30px;position:absolute;top:calc(50% - 15px);left:2px}.panel-resize-handle:hover{background:var(--accent-glow)}.panel-resize-handle:focus-visible{background:var(--accent-glow)}.resize-roster{right:0}.resize-chat{left:0}#room-screen.roster-collapsed #classic-users-panel,#room-screen.chat-collapsed #sidebar{visibility:hidden;border:0;padding:0;overflow:hidden}#room-tools .media-controls-toolbar{padding:0}.room-card[role=button]{cursor:pointer}.directory-status{line-height:1.5}@media (max-width:768px){header{flex-wrap:wrap;flex-shrink:0;gap:.45rem}.header-left{flex-wrap:wrap;gap:.45rem;min-width:0}.header-right{flex-wrap:wrap}#room-tools{justify-content:center;padding:.4rem}.room-navigation{justify-content:center}.room-navigation button{min-height:36px}#room-screen.layout-classic #main-area{grid-column:1}#room-screen,#room-screen.layout-classic{grid-template-rows:minmax(100px,1fr) minmax(180px,32dvh) auto}#sidebar{min-height:180px;max-height:none}.panel-resize-handle{display:none}.participant-actions-button{width:40px;height:40px}}.media-controls-toolbar{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.6rem;padding:.4rem .65rem;font-size:.8rem;display:flex}.media-controls-toolbar label{align-items:center;gap:.45rem;display:flex}.media-controls-toolbar input{width:6rem}.media-controls-toolbar button,.personal-media-controls button,.personal-media-hidden-notice button,.personal-playback-blocked button,.media-setup-dialog button{color:#edf3fa;cursor:pointer;font:inherit;background:#263447;border:1px solid #536275;border-radius:6px;padding:.45rem .65rem}.media-controls-toolbar button:hover,.personal-media-controls button:hover,.personal-media-hidden-notice button:hover,.personal-playback-blocked button:hover,.media-setup-dialog button:hover{background:#354964}.media-setup-dialog :focus-visible{outline-offset:3px;outline:2px solid #80c4ff}.personal-media-controls :focus-visible{outline-offset:3px;outline:2px solid #80c4ff}.media-controls-toolbar :focus-visible{outline-offset:3px;outline:2px solid #80c4ff}.personal-playback-blocked :focus-visible{outline-offset:3px;outline:2px solid #80c4ff}.personal-media-hidden-notice :focus-visible{outline-offset:3px;outline:2px solid #80c4ff}.media-setup-dialog{--preview-surface:var(--surface-2)}.media-setup-dialog [role=tabpanel]>.settings-description{margin-top:-.85rem}#appearance-controls{flex-direction:column;gap:1rem;display:flex}.media-preview-panel{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--preview-surface);flex-direction:column;gap:.85rem;padding:1rem;display:flex}.media-preview-heading{justify-content:space-between;align-items:center;gap:1rem;display:flex}.media-preview-panel .settings-section-heading{margin:0}.media-private-badge{color:#b6e4cd;white-space:nowrap;background:#1e3a2c;border-radius:99px;padding:.2rem .5rem;font-size:.75rem}.media-preview-video{object-fit:contain;background:var(--bg);border-radius:8px;width:100%;max-height:14rem}.media-preview-options,.media-preview-actions{flex-wrap:wrap;gap:.7rem;display:flex}.media-preview-status{color:#bdc4cd;margin:0;font-size:.85rem;line-height:1.5}.media-preview-options label,.media-audio-options label{align-items:center;gap:.45rem;font-size:.85rem;display:flex}.media-meter-label{align-items:center;gap:.75rem;font-size:.85rem;display:flex}.media-meter-label meter{flex:1;height:1.3rem}.media-setup-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;display:grid}.media-setup-fields label{flex-direction:column;gap:.5rem;min-width:0;font-size:.9rem;display:flex}.media-setup-fields select{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);width:100%;min-width:0;font:inherit;padding:.7rem}.personal-media-controls select{color:#edf3fa;background:#101925;border:1px solid #536275;border-radius:5px;max-width:100%;padding:.5rem}.media-advanced{border-top:1px solid var(--border);padding-top:.5rem}.media-advanced summary{cursor:pointer;min-height:44px;padding:.75rem 0;font-size:.9rem}.media-advanced>*+*{margin-top:.85rem}.media-audio-options{border:1px solid var(--border);border-radius:8px;flex-wrap:wrap;gap:.7rem 1.1rem;padding:.9rem;display:flex}.media-audio-options legend{padding:0 .25rem;font-size:.85rem}.media-setup-hint{color:#b4c2d3;margin:0;font-size:.8rem}.media-setup-dialog button:disabled{opacity:.5;cursor:default}.media-setup-dialog .settings-dialog-footer>button{flex-shrink:0}.personal-media-controls{z-index:5;color:#edf3fa;text-align:left;font-size:.75rem;position:absolute;top:.4rem;right:.4rem}.personal-media-controls summary{cursor:pointer;background:#101925e8;border:1px solid #536275;border-radius:6px;padding:.35rem .55rem}.personal-media-panel{background:#17212ef7;border:1px solid #536275;border-radius:6px;flex-direction:column;gap:.45rem;width:10.5rem;max-height:min(21rem,65vh);padding:.6rem;display:flex;overflow-y:auto}.personal-media-panel label{flex-direction:column;gap:.3rem;display:flex}.personal-media-panel input{width:100%}.personal-media-panel button{font-size:.75rem}.personal-media-panel button:disabled,.personal-media-panel select:disabled{opacity:.5;cursor:default}.personal-media-hidden>video,.personal-media-hidden>audio,.personal-media-hidden>.no-video-avatar{visibility:hidden}.personal-media-hidden-notice{color:#dbe8f7;text-align:center;background:#15202c;flex-direction:column;justify-content:center;align-items:center;gap:.65rem;padding:2.4rem .6rem 1.7rem;font-size:.8rem;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}.personal-playback-blocked{z-index:4;color:#edf3fa;text-align:center;background:#17212ef7;border-radius:6px;flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;padding:.6rem;font-size:.8rem;display:flex;position:absolute;bottom:1.9rem;left:.6rem;right:.6rem}.personal-playback-blocked[hidden],.personal-media-hidden-notice[hidden],.media-preview-video[hidden],.personal-media-controls button[hidden]{display:none}.video-tile:has(.personal-media-controls[open]){z-index:6;overflow:visible}@media (max-width:480px){.media-setup-fields{grid-template-columns:minmax(0,1fr)}.media-controls-toolbar{justify-content:center}.media-preview-panel{padding:.8rem}.media-setup-dialog .settings-dialog-footer{flex-direction:column;align-items:stretch}.media-setup-dialog .settings-dialog-footer>button{margin-left:0}}.settings-dialog{width:min(52rem,100vw - 2rem);max-width:none;height:min(48rem,100dvh - 2rem);max-height:calc(100dvh - 2rem);color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);margin:auto;padding:0;overflow:hidden;box-shadow:0 24px 80px #0009}.settings-dialog[open]{grid-template-rows:auto auto minmax(0,1fr) auto;display:grid}.settings-dialog::backdrop{background:#000a}.settings-dialog-form{display:contents}.settings-dialog-header,.settings-dialog-footer{justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.5rem;display:flex}.settings-dialog-header{border-bottom:1px solid var(--border)}.settings-dialog-header h2{margin:0;font-size:1.3rem;line-height:1.3}.settings-dialog-header .settings-description{margin-top:.35rem}.settings-dialog-nav{border-bottom:1px solid var(--border);gap:.25rem;padding:.5rem 1.5rem 0;display:flex;overflow-x:auto}.settings-dialog button{border:1px solid var(--border);border-radius:var(--radius-md);min-width:44px;min-height:44px;color:var(--text);background:var(--surface-2);font:inherit;cursor:pointer;padding:.6rem .9rem}.settings-dialog button:hover{background:var(--surface-3)}.settings-dialog button:disabled{opacity:.6;cursor:default}.settings-dialog button.btn-primary{background:var(--accent-fill);border-color:var(--accent-fill);color:var(--on-accent)}.settings-dialog button.btn-primary:hover{background:var(--accent-fill-hover)}.settings-dialog-nav [role=tab]{border-radius:var(--radius-sm) var(--radius-sm) 0 0;color:var(--text-dim);background:0 0;border:0;border-bottom:3px solid #0000;flex:none}.settings-dialog-nav [aria-selected=true]{border-bottom-color:var(--accent);color:var(--text);background:var(--surface-2)}.settings-dialog-body{overscroll-behavior:contain;min-height:0;padding:1.5rem;overflow-y:auto}.settings-dialog [role=tabpanel]{flex-direction:column;gap:1.2rem;display:flex}.settings-dialog [role=tabpanel][hidden]{display:none}.settings-dialog-footer{border-top:1px solid var(--border);background:var(--surface)}.settings-dialog-footer>:last-child{margin-left:auto}.settings-dialog-footer-actions{flex-wrap:wrap;justify-content:flex-end;gap:.5rem;display:flex}.settings-section-heading{margin:0;font-size:1rem;font-weight:600}.settings-description{color:var(--text-dim);overflow-wrap:anywhere;font-size:.875rem;line-height:1.5}.settings-field{flex-direction:column;gap:.45rem;min-width:0;display:flex}.settings-field>label,.settings-field-label{color:var(--text);text-transform:none;letter-spacing:normal;font-size:.95rem;font-weight:500}.settings-dialog input:not([type=checkbox]):not([type=range]),.settings-dialog select,.settings-dialog textarea{width:100%;min-width:0;min-height:44px;color:var(--text);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);font:inherit;padding:.65rem .75rem}.settings-toggle{cursor:pointer;justify-content:space-between;align-items:center;gap:1.25rem;min-height:44px;display:flex}.settings-toggle>span{flex-direction:column;gap:.25rem;display:flex}.settings-toggle input[type=checkbox]{width:22px;height:22px;accent-color:var(--accent);cursor:pointer;flex:none}.settings-fields-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;display:grid}.settings-dialog :focus-visible{outline:2px solid var(--accent);outline-offset:3px}.settings-dialog [role=tabpanel]:focus-visible{outline-offset:-2px}@media (max-width:600px){.settings-dialog{width:calc(100vw - 1rem);max-height:calc(100dvh - 1rem)}.settings-dialog-header,.settings-dialog-footer{gap:.75rem;padding:.75rem 1rem}.settings-dialog-nav{padding:.25rem .75rem 0}.settings-dialog-body{padding:1rem}.settings-fields-grid{grid-template-columns:minmax(0,1fr)}}@media (max-height:500px){.settings-dialog{max-height:calc(100dvh - .5rem)}.settings-dialog-header,.settings-dialog-footer{padding-top:.35rem;padding-bottom:.35rem}.settings-dialog-header .settings-description{display:none}}.community-dialog{color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:16px;width:min(620px,94vw);max-height:88dvh;margin:auto;padding:1.2rem;box-shadow:0 20px 80px #0008}.community-dialog::backdrop{background:#0009}.community-dialog-header{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;display:flex}.community-dialog-header h2{margin:0;font-size:1.25rem}.community-dialog-body{flex-direction:column;gap:.8rem;display:flex}.community-dialog h3{margin-top:.75rem;font-size:1rem}.community-dialog p{overflow-wrap:anywhere;line-height:1.5}.community-field{flex-direction:column;gap:.35rem;font-size:.9rem;display:flex}.community-field:has(input[type=checkbox]){flex-direction:row;justify-content:space-between;align-items:center}.community-dialog input:not([type=checkbox]),.community-dialog textarea,.community-dialog select,.conversation-toolbar select,.management-entry select{border:1px solid var(--border);width:100%;min-width:0;color:var(--text);background:var(--surface-2);font:inherit;border-radius:8px;padding:.6rem}.community-dialog textarea{resize:vertical}.community-row{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.community-row>span{overflow-wrap:anywhere;flex:1}.community-dialog .danger{color:#fb7185;border-color:#9f1239}.profile-image{object-fit:cover;border-radius:16px;width:96px;height:96px}.account-avatar{object-fit:cover;border-radius:inherit;width:100%;height:100%}.room-image-preview{aspect-ratio:16/9;object-fit:cover;border-radius:10px;width:min(100%,360px)}.room-card-image{object-fit:cover;border-radius:6px;flex:none;width:72px;height:48px}#video-grid:empty:before{content:"No cameras broadcasting yet";color:var(--text-dim);place-self:center;font-size:.9rem}.image-picker{flex-direction:column;gap:.5rem;display:flex}.owned-room,.management-entry{border:1px solid var(--border);border-radius:10px;flex-direction:column;gap:.5rem;padding:.75rem;display:flex}.profile-bio{white-space:pre-wrap}.conversation-toolbar{border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:.35rem;padding:.5rem;display:flex}.conversation-toolbar select{flex:140px;font-size:.85rem}.conversation-toolbar button{padding:.35rem .5rem;font-size:.75rem}.conversation-status{color:var(--text-dim);border-bottom:1px solid var(--border);padding:.35rem .6rem;font-size:.7rem;display:block}.conversation-unread{color:var(--accent);font-size:.75rem}.chat-sender-button{font:inherit;cursor:pointer;text-align:left;color:var(--accent);background:0 0;border:none;padding:0;font-weight:600}.chat-msg.grouped .sender{display:none}.chat-msg.grouped{padding-top:.2rem}.chat-msg.mentioned{border-left:3px solid var(--accent);background:#3b82f612}.chat-msg .msg-text{overflow-wrap:anywhere;white-space:pre-wrap}.chat-msg .delivery-error{color:#fb7185}.chat-msg .delivery-error button{margin-left:.35rem;font-size:.7rem}.large-chat-text .msg-text{font-size:1.08rem}.emoji-toggle,.emoji-choice{border:1px solid var(--border);background:var(--surface-2);color:var(--text);cursor:pointer;border-radius:8px;padding:.35rem .55rem}.emoji-panel{border-top:1px solid var(--border);flex-wrap:wrap;gap:.35rem;padding:.5rem;display:flex}.emoji-choice{font-size:1.2rem}#community-actions{flex-wrap:wrap;gap:.35rem;display:flex}#community-actions button{padding:.35rem .5rem;font-size:.75rem}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media (max-width:700px){.community-dialog{padding:.8rem}#community-actions{max-width:55vw}header{flex-wrap:wrap;gap:.5rem}}