:root{--radius:12px;--radius-sm:8px;--accent:#6366f1;--accent-hover:#5558e3;--accent-glow:#6366f166;--success:#22c55e;--success-glow:#22c55e66;--danger:#ef4444;--danger-glow:#ef44444d}[data-theme=dark]{--bg-primary:#0f0f0f;--bg-secondary:#1a1a1a;--bg-tertiary:#252525;--bg-hover:#2a2a2a;--bg-active:#333;--text-primary:#fff;--text-secondary:#a1a1aa;--text-muted:#71717a;--border:#2a2a2a;--shadow:0 4px 24px #0006;--input-bg:#252525;--message-bg:#2a2a2a;--message-other-text:#fff;--message-own-bg:var(--accent);--message-own-text:#fff;--chat-input-border:#3a3a3a;--scrollbar-thumb:#3a3a3a;--scrollbar-thumb-hover:#4a4a4a}[data-theme=light]{--bg-primary:#fff;--bg-secondary:#f8f9fa;--bg-tertiary:#e9ecef;--bg-hover:#dee2e6;--bg-active:#ced4da;--text-primary:#212529;--text-secondary:#495057;--text-muted:#6c757d;--border:#dee2e6;--shadow:0 4px 24px #00000014;--input-bg:#fff;--message-bg:#e2e6ea;--message-other-text:#212529;--message-own-bg:var(--accent);--message-own-text:#fff;--chat-input-border:#ced4da;--scrollbar-thumb:#ced4da;--scrollbar-thumb-hover:#adb5bd}@media (prefers-color-scheme:dark){[data-theme=auto]{--bg-primary:#0f0f0f;--bg-secondary:#1a1a1a;--bg-tertiary:#252525;--bg-hover:#2a2a2a;--bg-active:#333;--text-primary:#fff;--text-secondary:#a1a1aa;--text-muted:#71717a;--border:#2a2a2a;--shadow:0 4px 24px #0006;--input-bg:#252525;--message-bg:#2a2a2a;--message-other-text:#fff;--message-own-bg:var(--accent);--message-own-text:#fff;--chat-input-border:#3a3a3a;--scrollbar-thumb:#3a3a3a;--scrollbar-thumb-hover:#4a4a4a}}@media (prefers-color-scheme:light){[data-theme=auto]{--bg-primary:#fff;--bg-secondary:#f8f9fa;--bg-tertiary:#e9ecef;--bg-hover:#dee2e6;--bg-active:#ced4da;--text-primary:#212529;--text-secondary:#495057;--text-muted:#6c757d;--border:#dee2e6;--shadow:0 4px 24px #00000014;--input-bg:#fff;--message-bg:#e2e6ea;--message-other-text:#212529;--message-own-bg:var(--accent);--message-own-text:#fff;--chat-input-border:#ced4da;--scrollbar-thumb:#ced4da;--scrollbar-thumb-hover:#adb5bd}}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-primary);color:var(--text-primary);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;min-height:100vh;overflow:hidden}.app{display:flex;height:100vh}.sidebar{background:var(--bg-secondary);border-right:1px solid var(--border);display:flex;flex-direction:column;width:280px}.sidebar-brand{border-bottom:1px solid var(--border);color:var(--text-primary);font-size:20px;font-weight:700;gap:12px;padding:20px}.brand-logo,.sidebar-brand{align-items:center;display:flex}.brand-logo{background:linear-gradient(135deg,#6366f1,#8b5cf6 50%,#a855f7);border-radius:12px;box-shadow:0 4px 15px #6366f166;height:40px;justify-content:center;width:40px}.brand-icon{color:#fff;font-size:22px}.sidebar-section{display:flex;flex:1 1;flex-direction:column;overflow:hidden;padding:16px}.section-title{align-items:center;color:var(--text-muted);display:flex;font-size:11px;font-weight:600;justify-content:space-between;letter-spacing:.05em;padding:8px 4px;text-transform:uppercase}.channels-list{flex:1 1;margin:8px 0;overflow-y:auto}.empty-state{color:var(--text-muted);font-size:13px;padding:16px;text-align:center}.channel-item{align-items:center;background:#0000;border:none;border-radius:8px;border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;display:flex;font-size:14px;gap:10px;padding:10px 12px;text-align:left;transition:all .15s;width:100%}.channel-item:hover{background:var(--bg-hover);color:var(--text-primary)}.channel-item.active{background:#6366f1;background:var(--accent);color:#fff}.channel-icon{font-size:16px;opacity:.7}.channel-name{flex:1 1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.channel-count{background:var(--bg-tertiary);border-radius:10px;color:var(--text-muted);font-size:12px;padding:2px 8px}.channel-item.active .channel-count{background:#fff3;color:#fff}.channel-users{padding:4px 0 8px 36px}.channel-user{align-items:center;border-radius:6px;color:var(--text-secondary);display:flex;font-size:13px;gap:8px;padding:6px 8px;transition:all .15s}.channel-user.speaking{color:#22c55e;color:var(--success)}.channel-user.speaking .user-avatar-small{box-shadow:0 0 0 2px var(--bg-secondary),0 0 0 4px #22c55e;box-shadow:0 0 0 2px var(--bg-secondary),0 0 0 4px var(--success)}.user-avatar-small{align-items:center;background:linear-gradient(135deg,#6366f1,#8b5cf6);background:linear-gradient(135deg,var(--accent),#8b5cf6);border-radius:50%;color:#fff;display:flex;flex-shrink:0;font-size:11px;font-weight:600;height:24px;justify-content:center;width:24px}.channel-user-name{flex:1 1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.channel-user-icons{align-items:center;display:flex;gap:4px}.status-icon{font-size:12px;opacity:.8}.status-icon.deafened,.status-icon.muted{color:#ef4444;color:var(--danger)}.btn-join-id{align-items:center;background:#0000;border:2px dashed var(--border);border-radius:8px;border-radius:var(--radius-sm);color:var(--text-muted);cursor:pointer;display:flex;font-size:13px;gap:8px;justify-content:center;margin-top:8px;padding:12px;transition:all .15s}.btn-join-id:hover{background:#6366f11a;border-color:#6366f1;border-color:var(--accent);color:#6366f1;color:var(--accent)}.user-panel{background:var(--bg-tertiary);border-top:1px solid var(--border);justify-content:space-between;padding:12px 16px}.user-info,.user-panel{align-items:center;display:flex}.user-info{gap:12px}.user-avatar{align-items:center;background:linear-gradient(135deg,#6366f1,#8b5cf6);background:linear-gradient(135deg,var(--accent),#8b5cf6);border-radius:50%;color:#fff;display:flex;font-size:16px;font-weight:600;height:40px;justify-content:center;transition:box-shadow .2s;width:40px}.user-avatar.speaking{box-shadow:0 0 0 3px var(--bg-tertiary),0 0 0 5px #22c55e,0 0 20px #22c55e66;box-shadow:0 0 0 3px var(--bg-tertiary),0 0 0 5px var(--success),0 0 20px var(--success-glow)}.user-meta{display:flex;flex-direction:column}.user-name{color:var(--text-primary);font-size:14px;font-weight:600}.user-status{color:var(--text-muted);font-size:12px}.user-actions{display:flex;gap:4px}.btn-icon{align-items:center;background:#0000;border:none;border-radius:8px;border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;display:flex;font-size:16px;height:36px;justify-content:center;transition:all .15s;width:36px}.btn-icon:hover{background:var(--bg-hover);color:var(--text-primary)}.btn-icon.danger{color:#ef4444;color:var(--danger)}.btn-icon.small{font-size:12px;height:28px;width:28px}.btn-primary{align-items:center;background:#6366f1;background:var(--accent);border:none;border-radius:8px;border-radius:var(--radius-sm);color:#fff;cursor:pointer;display:flex;font-size:14px;font-weight:500;gap:8px;justify-content:center;padding:12px 24px;transition:all .15s}.btn-primary:hover{background:#5558e3;background:var(--accent-hover);box-shadow:0 4px 20px #6366f166;box-shadow:0 4px 20px var(--accent-glow)}.btn-primary:disabled{cursor:not-allowed;opacity:.5}.btn-secondary{align-items:center;background:#0000;border:1px solid var(--border);border-radius:8px;border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;display:flex;font-size:14px;font-weight:500;gap:8px;justify-content:center;padding:12px 24px;transition:all .15s}.btn-secondary:hover{background:var(--bg-hover);color:var(--text-primary)}.btn-ghost{align-items:center;background:#0000;border:none;border-radius:8px;border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;display:flex;font-size:13px;gap:6px;padding:8px 16px;transition:all .15s}.btn-ghost:hover{background:var(--bg-hover);color:var(--text-primary)}.btn-danger{align-items:center;background:#ef4444;background:var(--danger);border:none;border-radius:8px;border-radius:var(--radius-sm);color:#fff;cursor:pointer;display:flex;font-size:13px;gap:6px;padding:8px 16px;transition:all .15s}.btn-danger:hover{background:#dc2626;box-shadow:0 4px 20px #ef44444d;box-shadow:0 4px 20px var(--danger-glow)}.main{display:flex;flex:1 1;flex-direction:column;overflow:hidden}.welcome{align-items:center;background:radial-gradient(ellipse at top,var(--bg-secondary) 0,var(--bg-primary) 70%);display:flex;flex:1 1;justify-content:center}.welcome-content{max-width:480px;padding:40px;text-align:center}.welcome-logo{align-items:center;animation:float 3s ease-in-out infinite;background:linear-gradient(135deg,#6366f1,#8b5cf6 50%,#a855f7);border-radius:28px;box-shadow:0 8px 32px #6366f166;display:flex;height:100px;justify-content:center;margin:0 auto 32px;width:100px}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.welcome-icon{color:#fff;font-size:52px}.welcome h1{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,var(--text-primary),#6366f1);background:linear-gradient(135deg,var(--text-primary),var(--accent));-webkit-background-clip:text;background-clip:text;font-size:36px;font-weight:700;margin-bottom:12px}.welcome p{color:var(--text-secondary);font-size:16px;line-height:1.6;margin-bottom:32px}.welcome-actions{display:flex;gap:12px;justify-content:center}.download-section{border-top:1px solid var(--border);margin-top:32px;padding-top:32px}.download-btn{align-items:center;background:linear-gradient(135deg,#6366f1,#8b5cf6);border-radius:12px;border-radius:var(--radius);box-shadow:0 4px 15px #6366f14d;color:#fff;display:inline-flex;font-size:15px;font-weight:500;gap:10px;padding:14px 28px;text-decoration:none;transition:all .2s}.download-btn:hover{box-shadow:0 6px 25px #6366f166;transform:translateY(-2px)}.download-btn svg{font-size:18px}.room-view{display:flex;flex:1 1;flex-direction:column;overflow:hidden}.room-header{background:var(--bg-secondary);border-bottom:1px solid var(--border);justify-content:space-between;padding:16px 24px}.room-header,.room-info{align-items:center;display:flex}.room-info{gap:12px}.room-info svg{color:#6366f1;color:var(--accent);font-size:20px}.room-info h2{font-size:18px;font-weight:600}.room-id{background:var(--bg-tertiary);border-radius:6px;color:var(--text-muted);font-size:13px;padding:4px 10px}.room-actions{display:flex;gap:8px}.connection-bar{animation:pulse 1.5s infinite;background:#6366f1;background:var(--accent);color:#fff;font-size:13px;font-weight:500;padding:8px;text-align:center}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.participants-section,.room-content{display:flex;flex:1 1;overflow:hidden}.participants-section{flex-direction:column;padding:24px}.participants-section.full{flex:1 1}.participants-header{align-items:center;color:var(--text-secondary);display:flex;font-size:13px;font-weight:500;gap:8px;padding-bottom:16px}.participants-grid{grid-gap:16px;align-content:start;display:grid;flex:1 1;gap:16px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));overflow-y:auto}.participant-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;border-radius:var(--radius);padding:20px;text-align:center;transition:all .2s}.participant-card.speaking{border-color:#22c55e;border-color:var(--success);box-shadow:0 0 20px #22c55e66;box-shadow:0 0 20px var(--success-glow)}.participant-card.me{background:linear-gradient(135deg,#6366f11a,#8b5cf61a);border-color:#6366f1;border-color:var(--accent)}.participant-card.locally-muted{opacity:.5}.participant-avatar{background:linear-gradient(135deg,#6366f1,#8b5cf6);background:linear-gradient(135deg,var(--accent),#8b5cf6);border-radius:50%;color:#fff;font-size:24px;font-weight:600;height:64px;margin:0 auto 12px;position:relative;width:64px}.participant-avatar,.participant-info-row{align-items:center;display:flex;justify-content:center}.participant-info-row{gap:8px;margin-bottom:4px}.participant-name{color:var(--text-primary);font-size:14px;font-weight:600}.participant-status-icons{align-items:center;display:flex;gap:6px}.participant-status-icons .status-icon{font-size:14px}.participant-status-icons .status-icon.deafened,.participant-status-icons .status-icon.muted{color:#ef4444;color:var(--danger)}.participant-tag{color:#6366f1;color:var(--accent);font-size:11px;font-weight:500}.participant-controls{align-items:center;border-top:1px solid var(--border);display:flex;gap:8px;margin-top:12px;padding-top:12px}.volume-slider{appearance:none;background:var(--bg-tertiary);border-radius:2px;cursor:pointer;flex:1 1;height:4px}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;background:#6366f1;background:var(--accent);border-radius:50%;cursor:pointer;height:14px;-webkit-transition:transform .15s;transition:transform .15s;width:14px}.volume-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}.volume-value{color:var(--text-muted);font-size:11px;min-width:32px;text-align:right}.chat-section{background:var(--bg-secondary);border-left:1px solid var(--border);display:flex;flex-direction:column;width:360px}.chat-header{align-items:center;border-bottom:1px solid var(--border);display:flex;font-size:14px;font-weight:600;gap:10px;padding:16px 20px}.chat-header .btn-icon{margin-left:auto}.chat-messages{flex:1 1;overflow-y:auto;padding:16px}.chat-empty{color:var(--text-muted);font-size:13px;padding:40px 20px;text-align:center}.chat-message{display:flex;gap:12px;margin-bottom:16px}.chat-message.own{flex-direction:row-reverse}.message-avatar{align-items:center;background:linear-gradient(135deg,#6366f1,#8b5cf6);background:linear-gradient(135deg,var(--accent),#8b5cf6);border-radius:50%;color:#fff;display:flex;flex-shrink:0;font-size:12px;font-weight:600;height:32px;justify-content:center;width:32px}.message-content{max-width:70%}.message-header{align-items:center;display:flex;gap:8px;margin-bottom:4px}.chat-message.own .message-header{flex-direction:row-reverse}.message-author{color:var(--text-primary);font-size:13px;font-weight:600}.message-time{color:var(--text-muted);font-size:11px}.message-text{background:var(--message-bg);border-radius:12px;border-top-left-radius:4px;color:var(--message-other-text);font-size:14px;line-height:1.5;padding:10px 14px;word-break:break-word}.chat-message.own .message-text{background:var(--message-own-bg);border-radius:12px;border-top-right-radius:4px;color:var(--message-own-text)}.chat-input input{background:var(--input-bg);border:1px solid var(--chat-input-border);border-radius:8px;border-radius:var(--radius-sm);color:var(--text-primary);flex:1 1;font-size:14px;padding:12px 16px}.chat-input input::placeholder{color:var(--text-muted)}.chat-input input:focus{box-shadow:0 0 0 2px #6366f1;box-shadow:0 0 0 2px var(--accent);outline:none}.btn-send{align-items:center;background:#6366f1;background:var(--accent);border:none;border-radius:8px;border-radius:var(--radius-sm);color:#fff;cursor:pointer;display:flex;height:44px;justify-content:center;transition:all .15s;width:44px}.btn-send:hover:not(:disabled){background:#5558e3;background:var(--accent-hover)}.btn-send:disabled{cursor:not-allowed;opacity:.5}.modal-overlay{align-items:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000c;display:flex;inset:0;justify-content:center;position:fixed;z-index:1000}.modal{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;border-radius:var(--radius);box-shadow:var(--shadow);margin:16px;max-width:420px;padding:32px;width:100%}.modal h2{font-size:20px;font-weight:600;margin-bottom:8px}.modal p{color:var(--text-secondary)}.modal input,.modal p{font-size:14px;margin-bottom:24px}.modal input{background:var(--bg-tertiary);background:var(--input-bg,var(--bg-tertiary));border:1px solid var(--border);border-radius:8px;border-radius:var(--radius-sm);color:var(--text-primary);padding:14px 16px;width:100%}.modal input::placeholder{color:var(--text-muted)}.modal input:focus{border-color:#6366f1;border-color:var(--accent);box-shadow:0 0 0 3px #6366f166;box-shadow:0 0 0 3px var(--accent-glow);outline:none}.modal-actions{display:flex;gap:12px;justify-content:flex-end}.settings-field{margin-bottom:24px}.settings-field label{color:var(--text-muted);display:block;font-size:12px;font-weight:600;margin-bottom:8px;text-transform:uppercase}.settings-field input{margin-bottom:0}.theme-btn,.theme-selector{display:flex;gap:8px}.theme-btn{align-items:center;background:var(--bg-tertiary);border:2px solid var(--border);border-radius:8px;border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;flex:1 1;flex-direction:column;padding:16px 12px;transition:all .15s}.theme-btn:hover{border-color:var(--text-muted);color:var(--text-primary)}.theme-btn.active{background:#6366f11a;border-color:#6366f1;border-color:var(--accent);color:#6366f1;color:var(--accent)}.theme-btn svg{font-size:20px}.theme-btn span{font-size:12px;font-weight:500}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:#0000}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover)}.screen-share-container{background:var(--bg-secondary);border-bottom:1px solid var(--border);display:flex;flex-direction:column}.screen-share-container.fullscreen{background:#000;border:none;inset:0;position:fixed;z-index:9999}.screen-share-header{align-items:center;background:#22c55e1a;color:#22c55e;color:var(--success);display:flex;font-size:14px;font-weight:500;gap:10px;padding:12px 20px}.screen-share-container.fullscreen .screen-share-header{background:#000c;left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s;z-index:10}.screen-share-container.fullscreen:hover .screen-share-header{opacity:1}.screen-share-header svg{font-size:16px}.screen-share-controls{align-items:center;display:flex;gap:8px;margin-left:auto}.screen-share-controls .btn-ghost.danger{color:#ef4444;color:var(--danger)}.quality-select{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:8px;border-radius:var(--radius-sm);color:var(--text-primary);cursor:pointer;font-size:12px;padding:6px 10px}.quality-select:focus{border-color:#6366f1;border-color:var(--accent);outline:none}.screen-share-video-wrapper{align-items:center;background:#000;cursor:pointer;display:flex;justify-content:center;position:relative}.screen-share-container.fullscreen .screen-share-video-wrapper{flex:1 1;height:100%}.screen-share-video{background:#000;max-height:400px;object-fit:contain;width:100%}.screen-share-container.fullscreen .screen-share-video{height:100%;max-height:100%}.screen-share-video.quality-1080p{max-height:1080px;max-width:1920px}.screen-share-video.quality-720p{max-height:720px;max-width:1280px}.screen-share-video.quality-480p{max-height:480px;max-width:854px}.screen-share-container.fullscreen .screen-share-video.quality-1080p,.screen-share-container.fullscreen .screen-share-video.quality-480p,.screen-share-container.fullscreen .screen-share-video.quality-720p,.screen-share-container.fullscreen .screen-share-video.quality-auto{height:100%;max-height:100%;max-width:100%;width:auto}.fullscreen-hint{background:#000000b3;border-radius:8px;border-radius:var(--radius-sm);bottom:20px;color:#fff;font-size:12px;left:50%;opacity:0;padding:8px 16px;pointer-events:none;position:absolute;transform:translateX(-50%);transition:opacity .3s}.screen-share-container.fullscreen:hover .fullscreen-hint{opacity:1}.participants-section.with-screen-share{max-height:300px}.btn-ghost.screen-sharing{background:#ef44441a;color:#ef4444;color:var(--danger)}.connection-indicator{align-items:center;display:flex;font-size:12px}.connection-indicator.good{color:#22c55e;color:var(--success)}.connection-indicator.medium{color:#f59e0b}.connection-indicator.poor{color:#ef4444;color:var(--danger)}.connection-indicator.unknown{color:var(--text-muted)}.chat-input-wrapper{align-items:center;display:flex;flex:1 1;position:relative}.chat-input-wrapper input{background:var(--input-bg);border:1px solid var(--chat-input-border);border-radius:8px;border-radius:var(--radius-sm);color:var(--text-primary);flex:1 1;font-size:14px;padding:12px 44px 12px 16px}.chat-input-wrapper input::placeholder{color:var(--text-muted)}.chat-input-wrapper input:focus{box-shadow:0 0 0 2px #6366f1;box-shadow:0 0 0 2px var(--accent);outline:none}.btn-emoji{align-items:center;background:none;border:none;color:var(--text-muted);cursor:pointer;display:flex;font-size:18px;justify-content:center;padding:4px;position:absolute;right:8px;transition:color .15s}.btn-emoji:hover{color:#6366f1;color:var(--accent)}.emoji-picker{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;border-radius:var(--radius);bottom:100%;box-shadow:var(--shadow);margin-bottom:8px;max-height:300px;overflow-y:auto;position:absolute;right:0;width:320px;z-index:100}.emoji-category{padding:8px}.emoji-category-title{color:var(--text-muted);font-size:11px;font-weight:600;margin-bottom:4px;padding:4px 8px;text-transform:uppercase}.emoji-grid{grid-gap:2px;display:grid;gap:2px;grid-template-columns:repeat(10,1fr)}.emoji-btn{background:none;border:none;border-radius:4px;cursor:pointer;font-size:20px;padding:4px;transition:background .15s}.emoji-btn:hover{background:var(--bg-hover)}.settings-toggle{align-items:center;background:var(--bg-tertiary);border:1px solid var(--border);border-radius:8px;border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;display:flex;font-size:14px;gap:12px;padding:14px 16px;transition:all .15s;width:100%}.settings-toggle:hover{background:var(--bg-hover)}.settings-toggle.active{border-color:#22c55e;border-color:var(--success);color:#22c55e;color:var(--success)}.settings-toggle svg{font-size:18px}.quality-selector{display:flex;gap:8px}.quality-btn{align-items:center;background:var(--bg-tertiary);border:2px solid var(--border);border-radius:8px;border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;display:flex;flex:1 1;flex-direction:column;gap:4px;padding:16px 12px;transition:all .15s}.quality-btn:hover{border-color:var(--text-muted);color:var(--text-primary)}.quality-btn.active{background:#6366f11a;border-color:#6366f1;border-color:var(--accent);color:#6366f1;color:var(--accent)}.quality-label{font-size:18px;font-weight:700}.quality-desc{font-size:11px;opacity:.7}.chat-input{border-top:1px solid var(--border);display:flex;gap:8px;padding:16px}@media (max-width:1024px){.chat-section{bottom:0;box-shadow:var(--shadow);position:fixed;right:0;top:0;transform:translateX(0);transition:transform .3s ease;z-index:100}.chat-section.hidden{transform:translateX(100%)}.room-actions .btn-danger span,.room-actions .btn-ghost span{display:none}.room-actions .btn-danger,.room-actions .btn-ghost{padding:10px}}@media (max-width:768px){.app{flex-direction:column}.sidebar{display:none}.mobile-nav{align-items:center;background:var(--bg-secondary);border-top:1px solid var(--border);bottom:0;display:flex!important;justify-content:space-around;left:0;padding:8px 16px calc(8px + env(safe-area-inset-bottom));position:fixed;right:0;z-index:200}.mobile-nav-btn{align-items:center;background:#0000;border:none;border-radius:8px;color:var(--text-muted);cursor:pointer;display:flex;flex-direction:column;font-size:10px;gap:4px;padding:8px 16px;transition:all .15s}.mobile-nav-btn svg{font-size:22px}.mobile-nav-btn.active{background:#6366f11a;color:#6366f1;color:var(--accent)}.mobile-nav-btn.danger,.mobile-nav-btn.muted{color:#ef4444;color:var(--danger)}.main{padding-bottom:80px}.welcome-content{padding:24px}.welcome-logo{border-radius:20px;height:80px;margin-bottom:24px;width:80px}.welcome-icon{font-size:40px}.welcome h1{font-size:28px}.welcome p{font-size:14px;margin-bottom:24px}.welcome-actions{flex-direction:column;width:100%}.welcome-actions .btn-primary,.welcome-actions .btn-secondary{justify-content:center;width:100%}.download-section{margin-top:24px;padding-top:24px}.download-btn{justify-content:center;width:100%}.room-header{flex-direction:column;gap:12px;padding:12px 16px}.room-info h2{font-size:16px}.room-actions{justify-content:space-between;width:100%}.room-actions .btn-danger,.room-actions .btn-ghost{flex:1 1;font-size:12px;justify-content:center;padding:10px 8px}.room-actions .btn-danger span,.room-actions .btn-ghost span{display:none}.participants-section{padding:16px}.participants-grid{gap:12px;grid-template-columns:1fr 1fr}.participant-card{padding:16px 12px}.participant-avatar{font-size:20px;height:48px;width:48px}.participant-name{font-size:13px}.participant-controls{flex-wrap:wrap;justify-content:center}.volume-slider{margin-top:8px;width:100%}.chat-section{border-left:none;inset:0;position:fixed;transform:translateX(100%);transition:transform .3s ease;width:100%;z-index:150}.chat-section.visible{transform:translateX(0)}.chat-header{background:var(--bg-secondary);padding:16px;position:sticky;top:0;z-index:10}.chat-messages{padding:12px 12px 80px}.chat-input{background:var(--bg-secondary);border-top:1px solid var(--border);bottom:0;left:0;padding:12px 12px calc(12px + env(safe-area-inset-bottom));position:fixed;right:0}.emoji-picker{bottom:70px;left:8px;max-height:50vh;position:fixed;right:8px;width:auto}.emoji-grid{grid-template-columns:repeat(8,1fr)}.modal{margin:16px;max-height:calc(100vh - 32px);max-width:none;overflow-y:auto;width:calc(100% - 32px)}.modal h2{font-size:18px}.quality-selector,.theme-selector{flex-direction:column}.quality-btn,.theme-btn{flex-direction:row;justify-content:center;padding:12px}.screen-share-container{background:#000;inset:0;position:fixed;z-index:140}.screen-share-header{left:0;padding:calc(12px + env(safe-area-inset-top)) 16px 12px;position:absolute;right:0;top:0;z-index:10}.screen-share-video{height:100%;max-height:100%}.participants-section.with-screen-share{display:none}}@media (max-width:480px){.participants-grid{grid-template-columns:1fr}.room-actions{flex-wrap:wrap;gap:8px}.room-actions .btn-danger,.room-actions .btn-ghost{min-width:calc(50% - 4px)}.message-content{max-width:85%}}@media (display-mode:standalone){.download-section{display:none}body{-webkit-user-select:none;user-select:none}}@supports (padding:env(safe-area-inset-top)){.room-header{padding-top:calc(16px + env(safe-area-inset-top))}.welcome{padding-bottom:env(safe-area-inset-bottom);padding-top:env(safe-area-inset-top)}.modal-overlay{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}}.mobile-nav{display:none}@media (hover:none) and (pointer:coarse){.btn-danger,.btn-ghost,.btn-icon,.btn-primary,.btn-secondary,.channel-item,.emoji-btn{min-height:44px;min-width:44px}.volume-slider{height:8px}.volume-slider::-webkit-slider-thumb{height:20px;width:20px}.btn-icon:hover,.channel-item:hover{background:#0000}.btn-icon:active,.channel-item:active{background:var(--bg-hover)}}@media (max-width:768px) and (orientation:landscape){.welcome-content{align-items:center;flex-direction:row;max-width:100%;padding:16px 32px;text-align:left}.welcome-logo{flex-shrink:0;margin-bottom:0;margin-right:32px}.welcome-actions{flex-direction:row}.participants-grid{grid-template-columns:repeat(3,1fr)}.mobile-nav{padding:4px 16px}}
/*# sourceMappingURL=main.484d9da1.css.map*/