:root{--bg:#16181d;--bg-sidebar:#1c1f26;--bg-elevated:#23272f;--bg-input:#2a2f38;--bg-hover:#ffffff0d;--bg-selected:#ffffff17;--border:#ffffff12;--text:#e7e9ee;--text-muted:#9097a3;--accent:#e8734a;--accent-hover:#f0855d;--accent-text:#fff;--danger:#e5484d;--success:#3fb97a;--radius:10px;--font:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@media (prefers-color-scheme:light){:root{--bg:#fff;--bg-sidebar:#f3f4f7;--bg-elevated:#fff;--bg-input:#eceef2;--bg-hover:#0000000a;--bg-selected:#00000014;--border:#00000017;--text:#1d2026;--text-muted:#646b77;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font:15px/1.45 var(--font);-webkit-font-smoothing:antialiased}button,input,textarea,select{font:inherit;color:inherit}button{cursor:pointer;background:var(--bg-input);border:0;border-radius:8px;padding:8px 14px}button:disabled{opacity:.6;cursor:default}button.primary{background:var(--accent);color:var(--accent-text);font-weight:600}button.primary:hover:not(:disabled){background:var(--accent-hover)}button.danger{color:var(--danger);border:1px solid var(--danger);background:0 0}button.link{color:var(--accent);background:0 0;padding:4px}input,textarea,select{background:var(--bg-input);border:1px solid #0000;border-radius:8px;outline:none;width:100%;padding:9px 11px}input:focus,textarea:focus,select:focus{border-color:var(--accent)}a{color:var(--accent)}code{font-family:ui-monospace,JetBrains Mono,monospace;font-size:.85em}.muted{color:var(--text-muted)}.small{font-size:12px}.center{text-align:center}.spacer{flex:1}.icon{flex-shrink:0}.center-screen{text-align:center;justify-content:center;align-items:center;height:100%;padding:24px;display:flex}.form-error{color:var(--danger);margin:0}.field-hint{font-size:12px;font-weight:400}.field-hint.bad{color:var(--danger)}.field-hint.good{color:var(--success)}.password-field{display:block;position:relative}.password-field input{padding-right:42px}.password-field.invalid input{border-color:var(--danger)}.password-toggle{color:var(--text-muted);background:0 0;border-radius:6px;padding:6px;display:inline-flex;position:absolute;top:50%;right:4px;transform:translateY(-50%)}.password-toggle:hover{color:var(--text);background:var(--bg-hover)}.icon-button{color:var(--text-muted);background:0 0;border-radius:6px;justify-content:center;align-items:center;padding:6px;display:inline-flex}.icon-button:hover{background:var(--bg-hover);color:var(--text)}.icon-button.active{color:var(--accent)}.icon-button.danger{color:var(--danger);border:0}.avatar{color:#fff;-webkit-user-select:none;user-select:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-weight:600;transition:box-shadow .15s;display:inline-flex;position:relative}.avatar.speaking{box-shadow:0 0 0 2px var(--bg), 0 0 0 4px var(--success)}.status-dot{border:2px solid var(--bg-sidebar);border-radius:50%;width:30%;min-width:9px;height:30%;min-height:9px;position:absolute;bottom:-2px;right:-2px}.status-dot.online{background:var(--success)}.status-dot.offline{background:#6b7280}.auth-screen{background:radial-gradient(circle at 30% 20%, #e8734a2e, transparent 55%), var(--bg);justify-content:center;align-items:center;min-height:100%;padding:16px;display:flex}.auth-card{background:var(--bg-elevated);border:1px solid var(--border);border-radius:16px;flex-direction:column;gap:14px;width:100%;max-width:380px;padding:28px;display:flex}.auth-card h1{margin:4px 0 0;font-size:22px}.auth-card p{margin:0}.auth-card label,.settings-form label{flex-direction:column;gap:6px;font-size:13px;font-weight:600;display:flex}.app{grid-template-columns:260px 1fr;height:100%;display:grid;overflow:hidden}.sidebar{background:var(--bg-sidebar);border-right:1px solid var(--border);flex-direction:column;min-height:0;display:flex}.sidebar-header{border-bottom:1px solid var(--border);align-items:center;gap:10px;height:52px;padding:0 16px;font-size:16px;display:flex}.channel-list{flex:1;padding:8px;overflow-y:auto}.channel-group{text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);justify-content:space-between;align-items:center;padding:14px 6px 4px 8px;font-size:12px;font-weight:700;display:flex}.channel-row{color:var(--text-muted);border-radius:6px;align-items:center;display:flex}.channel-row:hover{background:var(--bg-hover);color:var(--text)}.channel-row.selected{background:var(--bg-selected);color:var(--text)}.channel-row.unread{color:var(--text);font-weight:700}.channel-row.unread .channel-button:before{content:"";background:var(--text);border-radius:0 4px 4px 0;width:4px;height:8px;position:absolute;left:-8px}.channel-button{text-align:left;background:0 0;flex:1;align-items:center;gap:8px;min-width:0;padding:7px 8px;display:flex;position:relative}.channel-button span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.row-actions{padding-right:4px;display:none}.channel-row:hover .row-actions{display:flex}.voice-members{padding-left:30px}.voice-member{color:var(--text-muted);align-items:center;gap:8px;padding:3px 0;font-size:13px;display:flex}.voice-panel{border-top:1px solid var(--border);align-items:center;gap:2px;padding:10px 8px 10px 14px;display:flex}.voice-panel-info{flex-direction:column;flex:1;min-width:0;display:flex}.voice-ok{color:var(--success);font-size:13px;font-weight:700}.voice-wait{color:#e0b13a;font-size:13px;font-weight:700}.voice-error{color:var(--danger);background:#e5484d26;border-radius:8px;align-items:flex-start;gap:6px;margin:0 8px 8px;padding:8px 10px;font-size:13px;display:flex}.voice-error span{flex:1}.user-panel{padding:10px 8px 10px 12px;padding-bottom:max(10px, env(safe-area-inset-bottom));background:#00000026;align-items:center;gap:8px;display:flex}.user-panel-name{flex-direction:column;flex:1;min-width:0;line-height:1.2;display:flex}.user-panel-name strong,.user-panel-name span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.main{flex-direction:column;min-width:0;min-height:0;display:flex}.main-header{border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:10px;height:52px;padding:0 12px 0 16px;display:flex}.main-header h2{white-space:nowrap;text-overflow:ellipsis;align-items:center;gap:6px;min-width:0;margin:0;font-size:16px;display:flex;overflow:hidden}.main-header h2 .icon{color:var(--text-muted)}.offline-pill{color:#e0b13a;background:#e0b13a2e;border-radius:999px;padding:2px 8px;font-size:12px}.main-body{flex:1;min-height:0;display:flex;position:relative}.only-mobile,.drawer-backdrop{display:none}.members{background:var(--bg-sidebar);border-left:1px solid var(--border);flex-shrink:0;width:240px;padding:12px 8px;overflow-y:auto}.members-title{text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);padding:12px 8px 6px;font-size:12px;font-weight:700}.member{border-radius:6px;align-items:center;gap:10px;padding:6px 8px;display:flex}.member.offline{opacity:.5}.badge{text-transform:uppercase;color:var(--accent);background:#e8734a33;border-radius:4px;padding:1px 6px;font-size:10px;font-weight:700}.chat{flex-direction:column;flex:1;min-width:0;display:flex;position:relative}.messages{flex:1;overflow:hidden auto}.messages-inner{flex-direction:column;justify-content:flex-end;min-height:100%;padding:16px 0 8px;display:flex}.channel-intro{padding:16px 16px 20px}.channel-intro h3{margin:10px 0 4px;font-size:24px}.channel-intro p{margin:0}.channel-intro-icon{background:var(--bg-input);border-radius:50%;justify-content:center;align-items:center;width:64px;height:64px;display:inline-flex}.day-divider{color:var(--text-muted);align-items:center;gap:10px;margin:14px 16px 6px;font-size:12px;font-weight:600;display:flex}.day-divider:before,.day-divider:after{content:"";background:var(--border);flex:1;height:1px}.message{gap:12px;margin-top:8px;padding:6px 16px 2px;display:flex;position:relative}.message.grouped{margin-top:0;padding-top:1px}.message:hover{background:var(--bg-hover)}.message-gutter{flex-shrink:0;justify-content:center;width:40px;display:flex}.message-time-hover{visibility:hidden;color:var(--text-muted);padding-top:3px;font-size:11px}.message:hover .message-time-hover{visibility:visible}.message-main{flex:1;min-width:0}.message-header{align-items:baseline;gap:8px;display:flex}.message-content{white-space:pre-wrap;overflow-wrap:anywhere}.message-actions{background:var(--bg-elevated);border:1px solid var(--border);border-radius:8px;padding:2px;display:none;position:absolute;top:-12px;right:16px}.message:hover .message-actions{display:flex}.edit-box textarea{resize:none;min-height:60px}.attachments{flex-direction:column;align-items:flex-start;gap:6px;margin-top:6px;display:flex}.attachment-image img{border-radius:8px;max-width:min(420px,100%);max-height:340px;display:block}.attachment-video{background:#000;border-radius:8px;max-width:min(520px,100%);max-height:360px}.attachment-file{background:var(--bg-elevated);border:1px solid var(--border);max-width:min(420px,100%);color:var(--text);border-radius:8px;align-items:center;gap:10px;padding:10px 12px;text-decoration:none;display:flex}.attachment-file>span{flex-direction:column;flex:1;min-width:0;display:flex}.attachment-name{text-overflow:ellipsis;white-space:nowrap;color:var(--accent);overflow:hidden}div.attachment-file{flex-direction:column;align-items:stretch}.typing-line{height:20px;color:var(--text-muted);padding:0 18px;font-size:12px}.composer-wrap{padding:0 16px 16px;padding-bottom:max(16px, env(safe-area-inset-bottom))}.composer{background:var(--bg-input);border-radius:var(--radius);align-items:flex-end;gap:4px;padding:4px 8px;display:flex}.composer textarea{resize:none;background:0 0;border:0;flex:1;max-height:300px;padding:9px 4px}.composer .icon-button{margin-bottom:3px}.char-count{color:var(--text-muted);align-self:center;font-size:12px}.char-count.over{color:var(--danger)}.composer-error{margin-bottom:6px;font-size:13px}.pending-uploads{flex-direction:column;gap:4px;margin-bottom:6px;display:flex}.pending-upload{background:var(--bg-elevated);border:1px solid var(--border);border-radius:8px;align-items:center;gap:8px;padding:6px 8px;font-size:13px;display:flex}.pending-upload.failed{border-color:var(--danger)}.pending-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.pending-upload progress{width:80px;accent-color:var(--accent)}.drop-overlay{border:2px dashed var(--accent);color:#fff;pointer-events:none;background:#16181dd9;border-radius:16px;justify-content:center;align-items:center;font-size:18px;font-weight:600;display:flex;position:absolute;inset:12px}.voice-lobby{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:8px;padding:24px;display:flex}.voice-lobby h3{margin:8px 0 0;font-size:22px}.voice-stage{background:#0d0e11;flex:1;min-width:0;padding:16px;position:relative;overflow:auto}.voice-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));grid-auto-rows:minmax(180px,1fr);gap:12px;height:100%;display:grid}.voice-focus{flex-direction:column;gap:12px;height:100%;display:flex}.voice-focus>.tile{flex:1}.voice-strip{flex-shrink:0;gap:12px;height:120px;display:flex;overflow-x:auto}.voice-strip .tile{flex-shrink:0;width:180px}.tile{background:#1f2229;border-radius:12px;outline:2px solid #0000;justify-content:center;align-items:center;min-height:0;padding:0;transition:outline-color .15s;display:flex;position:relative;overflow:hidden}.tile.speaking{outline-color:var(--success)}.tile video{background:#000;width:100%;height:100%}.tile-label{color:#fff;background:#0009;border-radius:6px;align-items:center;gap:4px;padding:2px 8px;font-size:13px;display:flex;position:absolute;bottom:8px;left:8px}.audio-unlock{z-index:2;position:absolute;top:16px;left:50%;transform:translate(-50%)}.modal-backdrop{z-index:50;background:#0009;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal{background:var(--bg-elevated);border:1px solid var(--border);border-radius:14px;flex-direction:column;width:100%;max-width:640px;max-height:100%;display:flex;overflow:hidden}.modal-tabs{border-bottom:1px solid var(--border);align-items:center;gap:4px;padding:8px;display:flex}.modal-tabs button{color:var(--text-muted);background:0 0}.modal-tabs button.active{background:var(--bg-selected);color:var(--text)}.modal-body{padding:20px;overflow-y:auto}.settings-form{flex-direction:column;gap:12px;display:flex}.settings-form h3,.settings-form h4{margin:0}.settings-form h4{margin-top:8px}.settings-form p{margin:0}.row{flex-wrap:wrap;align-items:flex-end;gap:10px;display:flex}.row label{flex:1;min-width:120px}.profile-preview{align-items:center;gap:12px;display:flex}.invite-list{flex-direction:column;gap:6px;display:flex}.invite{background:var(--bg-input);border-radius:8px;grid-template-columns:1fr auto auto;align-items:center;gap:2px 8px;padding:8px 10px;display:grid}.invite code{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.invite .small{grid-row:2}.invite .icon-button{grid-row:1/span 2}@media (width<=768px){.app{grid-template-columns:1fr}.sidebar{z-index:30;width:min(300px,85vw);transition:transform .2s;position:fixed;inset:0 auto 0 0;transform:translate(-100%)}.drawer-open .sidebar{transform:none}.drawer-open .drawer-backdrop{z-index:20;background:#00000080;display:block;position:fixed;inset:0}.only-mobile{display:inline-flex}.main-header{padding-left:6px}.members{z-index:10;width:min(260px,80vw);position:absolute;inset:0 0 0 auto;box-shadow:-8px 0 24px #00000059}.message{padding-left:10px;padding-right:10px}.message-actions{opacity:.45;background:0 0;border:0;align-self:flex-start;display:flex;position:static}.composer-wrap{padding-left:10px;padding-right:10px}.voice-grid{grid-template-columns:1fr}}