:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-darkest:#1e1f22;--bg-dark:#2b2d31;--bg-mid:#313338;--bg-light:#383a40;--bg-lighter:#404249;--text-primary:#f2f3f5;--text-secondary:#b5bac1;--text-muted:#949ba4;--brand:#5865f2;--brand-hover:#4752c4;--danger:#ed4245;--online:#3ba55d;font-family:gg sans,Helvetica Neue,Helvetica,Arial,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg-mid);color:var(--text-primary);overflow:hidden}button{cursor:pointer;font-family:inherit}input,textarea{font-family:inherit}.app-shell{grid-template-columns:72px 240px 1fr 220px;width:100vw;height:100vh;display:grid}@media (width<=900px){.app-shell{grid-template-columns:60px 200px 1fr}.members-list{display:none}}.server-rail{background:var(--bg-darkest);flex-direction:column;align-items:center;gap:8px;padding:12px 0;display:flex;overflow-y:auto}.server-icon{color:#fff;border:none;border-radius:24px;justify-content:center;align-items:center;width:48px;height:48px;font-size:15px;font-weight:600;transition:border-radius .15s;display:flex}.server-icon:hover,.server-icon.active{border-radius:16px}.channel-sidebar{background:var(--bg-dark);flex-direction:column;min-width:0;display:flex}.server-header{border-bottom:1px solid #0000003d;align-items:center;height:48px;padding:0 16px;font-weight:600;display:flex;box-shadow:0 1px #0000001a}.channel-scroll{flex:1;padding:12px 8px;overflow-y:auto}.channel-group{margin-bottom:16px}.channel-group-label{text-transform:uppercase;color:var(--text-muted);letter-spacing:.02em;padding:0 8px 4px;font-size:11px;font-weight:700}.channel-item{width:100%;color:var(--text-secondary);text-align:left;background:0 0;border:none;border-radius:4px;align-items:center;gap:6px;padding:6px 8px;font-size:15px;display:flex}.channel-item:hover{background:var(--bg-light);color:var(--text-primary)}.channel-item.active{background:var(--bg-lighter);color:var(--text-primary)}.channel-hash,.channel-speaker{color:var(--text-muted);font-weight:500}.in-call-badge{text-transform:uppercase;color:var(--online);background:#3ba55d33;border-radius:4px;margin-left:auto;padding:2px 6px;font-size:10px;font-weight:700}.voice-channel-block{margin-bottom:2px}.voice-members{flex-direction:column;gap:4px;padding:2px 8px 6px 28px;display:flex}.voice-member{color:var(--text-secondary);align-items:center;gap:6px;font-size:13px;display:flex}.voice-member .dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.user-panel{background:var(--bg-darkest);align-items:center;gap:4px;height:52px;padding:0 8px;display:flex}.user-panel-info{color:inherit;background:0 0;border:none;border-radius:4px;flex:1;align-items:center;gap:8px;min-width:0;padding:4px;display:flex}.user-panel-info:hover{background:var(--bg-light)}.user-panel-text{text-align:left;min-width:0}.user-panel-name{color:var(--text-primary);text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:600;overflow:hidden}.user-panel-tag{color:var(--text-muted);font-size:11px}.icon-btn{color:var(--text-secondary);background:0 0;border:none;border-radius:4px;padding:8px;font-size:16px}.icon-btn:hover{background:var(--bg-light)}.avatar{flex-shrink:0;position:relative}.avatar-circle{color:#fff;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;font-weight:700;display:flex}.avatar-status{border:3px solid var(--bg-dark);border-radius:50%;width:30%;min-width:10px;height:30%;min-height:10px;position:absolute;bottom:-1px;right:-1px}.main-area{background:var(--bg-mid);flex-direction:column;min-width:0;display:flex}.chat-header{border-bottom:1px solid #0000003d;flex-shrink:0;align-items:center;gap:8px;height:48px;padding:0 16px;font-weight:600;display:flex;box-shadow:0 1px #0000001a}.chat-view{flex-direction:column;height:100%;min-height:0;display:flex}.chat-messages{flex-direction:column;flex:1;gap:14px;padding:16px;display:flex;overflow-y:auto}.chat-empty{color:var(--text-muted);padding:24px 0}.chat-message{gap:12px;display:flex}.chat-message-body{min-width:0}.chat-message-meta{align-items:baseline;gap:8px;display:flex}.chat-message-author{font-size:15px;font-weight:600}.chat-message-time{color:var(--text-muted);font-size:11px}.chat-message-text{color:var(--text-secondary);overflow-wrap:anywhere;font-size:15px}.chat-input-bar{flex-shrink:0;gap:8px;padding:12px 16px 20px;display:flex}.chat-input-bar input{background:var(--bg-light);color:var(--text-primary);border:none;border-radius:8px;outline:none;flex:1;padding:12px 14px;font-size:15px}.chat-input-bar button{background:var(--brand);color:#fff;border:none;border-radius:8px;padding:0 18px;font-weight:600}.chat-input-bar button:disabled{background:var(--bg-lighter);color:var(--text-muted);cursor:default}.room-view{flex-direction:column;height:100%;min-height:0;display:flex}.media-error{color:#ff8a8c;background:#ed424526;flex-shrink:0;padding:8px 16px;font-size:13px}.room-grid{flex:1;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));align-content:start;gap:16px;padding:20px;display:grid;overflow-y:auto}.tile{aspect-ratio:16/10;background:var(--bg-dark);border:2px solid #0000;border-radius:8px;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.tile.speaking{border-color:var(--online)}.tile-video{object-fit:cover;width:100%;height:100%}.tile-avatar-overlay{background:var(--bg-dark);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.tile-label{background:#0009;border-radius:4px;align-items:center;gap:4px;padding:3px 8px;font-size:12px;display:flex;position:absolute;bottom:8px;left:8px}.tile-screen{background:#000}.tile-screen.clickable{cursor:pointer}.room-focus{flex-direction:column;flex:1;min-height:0;display:flex}.room-stage{flex:1;min-height:0;padding:16px 16px 0;display:flex}.room-stage .tile{aspect-ratio:auto;flex:1;min-width:0}.room-strip{flex-shrink:0;gap:12px;padding:12px 16px;display:flex;overflow-x:auto}.room-strip .tile{flex:0 0 160px}.room-strip .tile-live .live-quality,.room-strip .tile-stats{display:none}.tile-screen:fullscreen{border:none;border-radius:0}.tile-live{align-items:center;gap:6px;font-size:11px;font-weight:700;display:flex;position:absolute;top:8px;left:8px}.live-badge{background:var(--danger);color:#fff;letter-spacing:.5px;border-radius:4px;padding:2px 6px}.live-quality{background:#0009;border-radius:4px;padding:2px 6px}.live-warning{color:#faa61a}.tile-stats{text-align:right;font-variant-numeric:tabular-nums;color:var(--text-secondary);opacity:0;background:#0009;border-radius:4px;padding:3px 8px;font-size:11px;transition:opacity .15s;position:absolute;bottom:8px;right:8px}.tile-screen:hover .tile-stats{opacity:1}.tile-hint{color:#1e1f22;pointer-events:none;background:#faa61ae6;border-radius:4px;padding:6px 8px;font-size:12px;position:absolute;bottom:40px;left:8px;right:8px}.room-strip .tile-hint{display:none}.tile-actions{gap:6px;display:flex;position:absolute;top:8px;right:8px}.tile-action{color:#fff;opacity:0;background:#0009;border:none;border-radius:4px;width:32px;height:32px;font-size:16px;transition:opacity .15s}.tile:hover .tile-action,.tile-action:focus-visible,.volume-control.changed .tile-action{opacity:1}.volume-control{cursor:default;border-radius:4px;align-items:center;gap:6px;display:flex}.volume-slider,.volume-value{display:none}.volume-control:hover,.volume-control:focus-within{background:#0009;padding-left:8px}.volume-control:hover .volume-slider,.volume-control:focus-within .volume-slider,.volume-control:hover .volume-value,.volume-control:focus-within .volume-value{display:block}.volume-slider{width:96px;accent-color:var(--brand);cursor:pointer}.volume-value{font-variant-numeric:tabular-nums;text-align:right;-webkit-user-select:none;user-select:none;min-width:34px;font-size:11px}.room-strip .volume-control:hover .volume-slider,.room-strip .volume-control:hover .volume-value{display:none}.go-live-toggle{cursor:pointer;align-items:center;gap:8px;margin-bottom:6px;display:flex}.field .go-live-toggle input{accent-color:var(--brand);width:16px;height:16px;margin:0;padding:0}.go-live-hint{color:var(--text-muted);margin-bottom:16px;font-size:13px}.call-controls{background:var(--bg-darkest);flex-shrink:0;justify-content:center;gap:12px;padding:16px;display:flex}.call-btn{background:var(--bg-lighter);width:52px;height:52px;color:var(--text-primary);border:none;border-radius:50%;justify-content:center;align-items:center;font-size:20px;display:flex}.call-btn.on{background:var(--brand)}.call-btn.leave{background:var(--danger);transform:rotate(135deg)}.room-lobby{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:16px;display:flex}.voice-status{color:var(--text-muted);font-size:12px;font-weight:700}.chat-header .voice-status{margin-left:auto}.voice-status.connected{color:var(--online)}.voice-status-bar{background:var(--bg-darkest);border-bottom:1px solid #ffffff0f;align-items:center;gap:4px;padding:8px;display:flex}.voice-status-info{text-align:left;min-width:0;color:inherit;background:0 0;border:none;border-radius:4px;flex-direction:column;flex:1;align-items:flex-start;gap:2px;padding:2px 4px;display:flex}.voice-status-info:hover{background:var(--bg-lighter)}.voice-status-channel{color:var(--text-secondary);text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:12px;overflow:hidden}.members-list{background:var(--bg-dark);padding:16px 8px;overflow-y:auto}.members-group-label{text-transform:uppercase;color:var(--text-muted);padding:0 8px 8px;font-size:12px;font-weight:700}.member-row{color:var(--text-secondary);border-radius:4px;align-items:center;gap:10px;padding:6px 8px;font-size:14px;display:flex}.member-row:hover{background:var(--bg-light)}.modal-overlay{z-index:100;background:#0009;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal{background:var(--bg-dark);border-radius:8px;width:100%;max-width:440px;max-height:90vh;padding:24px;overflow-y:auto}.modal h2{margin:0 0 16px}.profile-preview{background:var(--bg-mid);border-radius:8px;align-items:center;gap:16px;margin-bottom:16px;padding:16px;display:flex}.profile-preview-name{font-size:18px;font-weight:700}.profile-preview-tag{color:var(--text-muted);font-size:13px}.field{margin-bottom:16px;display:block}.field>span{text-transform:uppercase;color:var(--text-muted);margin-bottom:6px;font-size:12px;font-weight:700;display:block}.field input,.field textarea{background:var(--bg-mid);border:1px solid var(--bg-lighter);width:100%;color:var(--text-primary);resize:vertical;border-radius:4px;outline:none;padding:10px}.field input:focus,.field textarea:focus{border-color:var(--brand)}.status-options,.color-options{flex-wrap:wrap;gap:8px;display:flex}.status-option{background:var(--bg-mid);border:1px solid var(--bg-lighter);color:var(--text-secondary);border-radius:4px;padding:8px 12px;font-size:13px}.status-option.active{border-color:var(--brand);color:var(--text-primary);background:#5865f226}.color-swatch{border:2px solid #0000;border-radius:50%;width:32px;height:32px}.color-swatch.active{border-color:#fff}.modal-actions{justify-content:flex-end;gap:8px;margin-top:8px;display:flex}.btn-primary{background:var(--brand);color:#fff;border:none;border-radius:4px;padding:10px 18px;font-weight:600}.btn-primary:hover{background:var(--brand-hover)}.btn-secondary{color:var(--text-secondary);background:0 0;border:none;padding:10px 18px}.btn-secondary:hover{text-decoration:underline}.login-screen{background:var(--bg-darkest);width:100vw;height:100vh;color:var(--text-secondary);justify-content:center;align-items:center;display:flex}.login-card{background:var(--bg-dark);text-align:center;border-radius:8px;flex-direction:column;gap:14px;width:100%;max-width:360px;padding:32px;display:flex}.login-card h1{color:var(--text-primary);margin:0}.login-subtitle{color:var(--text-muted);margin:0 0 8px;font-size:14px}.login-card input{background:var(--bg-mid);border:1px solid var(--bg-lighter);color:var(--text-primary);border-radius:4px;outline:none;padding:12px;font-size:15px}.login-card input:focus{border-color:var(--brand)}.login-card .btn-primary{width:100%}.login-card .btn-primary:disabled{background:var(--bg-lighter);color:var(--text-muted);cursor:default}*{scrollbar-width:thin;scrollbar-color:var(--bg-darkest) transparent}