*{box-sizing:border-box;margin:0;padding:0}:root{--rail:#202225;--sidebar:#2f3136;--main:#36393f;--hover:#34373c;--active:#42464d;--text:#dcddde;--text-muted:#96989d;--interactive:#b9bbbe;--header:#fff;--green:#3ba55d;--blurple:#5865f2;--blurple-hover:#4752c4;--red:#ed4245;--divider:#26282c}html,body,#root{height:100%}body{background:var(--main);color:var(--text);-webkit-font-smoothing:antialiased;font-family:gg sans,Helvetica Neue,Helvetica,Arial,sans-serif;overflow:hidden}input,button{border:none;outline:none;font-family:inherit}button{cursor:pointer}.avatar{color:#fff;border-radius:50%;flex-shrink:0;place-items:center;font-weight:700;display:grid}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-thumb{background:#202225;border-radius:4px}::-webkit-scrollbar-track{background:0 0}.app{width:100vw;height:100vh;display:flex}.gate{background:linear-gradient(135deg,#5865f2 0%,#404eed 100%);justify-content:center;align-items:center;height:100vh;display:flex}.gate-card{background:var(--main);text-align:center;border-radius:12px;flex-direction:column;align-items:center;width:420px;max-width:90vw;padding:40px;display:flex;box-shadow:0 8px 30px #0006}.gate-logo{background:var(--blurple);color:#fff;border-radius:50%;place-items:center;width:64px;height:64px;margin-bottom:16px;font-size:22px;font-weight:800;display:grid}.gate-card h1{color:var(--header);margin-bottom:8px;font-size:24px}.gate-card p{color:var(--text-muted);margin-bottom:24px}.gate-card input{width:100%;color:var(--text);background:#202225;border-radius:6px;margin-bottom:16px;padding:12px 14px;font-size:15px}.gate-card button{background:var(--blurple);color:#fff;border-radius:6px;width:100%;padding:12px;font-size:15px;font-weight:600;transition:background .15s}.gate-card button:hover:not(:disabled){background:var(--blurple-hover)}.gate-card button:disabled{opacity:.5;cursor:not-allowed}.gate-error{color:#f2a5a6;text-align:left;background:#ed42451f;border:1px solid #ed424566;border-radius:6px;width:100%;margin-bottom:14px;padding:10px 12px;font-size:13px}.gate-info{color:#7fca9b;text-align:left;background:#3ba55d1f;border:1px solid #3ba55d66;border-radius:6px;width:100%;margin-bottom:14px;padding:10px 12px;font-size:13px}.gate-links{flex-direction:column;align-items:center;gap:2px;width:100%;margin-top:10px;display:flex}.gate-switch{color:var(--text-muted)!important;background:0 0!important;width:auto!important;padding:6px!important;font-size:13px!important;font-weight:500!important}.gate-switch:hover{text-decoration:underline;color:var(--header)!important}.server-rail{background:var(--rail);flex-direction:column;flex-shrink:0;align-items:center;gap:8px;width:72px;padding-top:12px;display:flex}.server-icon{background:var(--sidebar);width:48px;height:48px;color:var(--text);border-radius:50%;place-items:center;font-size:16px;font-weight:700;transition:border-radius .15s,background .15s;display:grid}.server-icon:hover,.server-icon.active{background:var(--blurple);color:#fff;border-radius:16px}.server-icon.add{color:var(--green);font-size:24px}.server-icon.add:hover{background:var(--green);color:#fff}.rail-divider{background:var(--divider);border-radius:1px;width:32px;height:2px}.sidebar{background:var(--sidebar);flex-direction:column;flex-shrink:0;width:240px;display:flex}.sidebar-header{height:48px;color:var(--header);align-items:center;padding:0 16px;font-size:15px;font-weight:600;display:flex;box-shadow:0 1px #0003}.server-header{flex-direction:column;flex-shrink:0;gap:7px;padding:12px 16px;display:flex;box-shadow:0 1px #0003}.server-header-name{color:var(--header);white-space:nowrap;text-overflow:ellipsis;font-size:15px;font-weight:700;overflow:hidden}.invite-btn{color:var(--text-muted);text-align:left;letter-spacing:.04em;background:#00000040;border-radius:4px;align-items:center;gap:6px;padding:6px 8px;font-size:12px;font-weight:600;display:inline-flex}.invite-btn:hover{color:#fff;background:#0006}.server-actions{flex-direction:column;gap:18px;width:100%;margin-top:6px;display:flex}.server-action-block{flex-direction:column;gap:8px;display:flex}.server-action-block input{width:100%;color:var(--text);background:#1e1f22;border-radius:6px;padding:11px 14px;font-size:15px}.server-action-block .btn-primary{width:100%;padding:11px}.server-actions-hint{color:var(--text-muted);text-align:center;margin:4px 0 0;font-size:13px}.channel-list{flex:1;padding:12px 8px;overflow-y:auto}.channel-category{color:var(--text-muted);text-transform:uppercase;letter-spacing:.02em;justify-content:space-between;align-items:center;padding:16px 8px 4px;font-size:12px;font-weight:700;display:flex}.cat-add{color:var(--text-muted);background:0 0;place-items:center;display:grid}.cat-add:hover{color:var(--header)}.channel-empty{color:var(--text-muted);padding:4px 8px;font-size:13px;font-style:italic}.channel{color:var(--text-muted);cursor:pointer;border-radius:4px;align-items:center;gap:6px;margin-bottom:1px;padding:7px 8px;display:flex}.channel:hover{background:var(--hover);color:var(--interactive)}.channel.active{background:var(--active);color:#fff}.channel-hash{opacity:.7;align-items:center;display:flex}.channel-name{white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:15px;font-weight:500;overflow:hidden}.voice-count{background:#0000004d;border-radius:8px;padding:1px 6px;font-size:12px}.unread-badge{background:var(--red);color:#fff;border-radius:9px;flex-shrink:0;place-items:center;min-width:18px;height:18px;padding:0 5px;font-size:11px;font-weight:700;display:grid}.channel:hover .unread-badge{display:none}.channel.has-unread .channel-name{color:#fff;font-weight:600}.channel.has-unread .channel-hash{opacity:1}.channel-delete{color:var(--text-muted);opacity:0;background:0 0;place-items:center;padding:2px;display:grid}.channel:hover .channel-delete{opacity:1}.channel-delete:hover{color:var(--red)}.voice-channel-group{margin-bottom:1px}.voice-member{color:var(--text-muted);align-items:center;gap:8px;padding:4px 8px 4px 26px;display:flex}.voice-member-name{font-size:14px}.user-bar{background:#292b2f;align-items:center;gap:8px;height:56px;padding:0 8px;display:flex}.user-info{flex:1;min-width:0}.user-name{color:var(--header);white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:600;overflow:hidden}.user-status{color:var(--text-muted);font-size:12px}.icon-btn{width:32px;height:32px;color:var(--interactive);background:0 0;border-radius:4px;place-items:center;font-size:15px;display:grid}.icon-btn:hover{background:#ffffff0f}.icon-btn.danger:hover{background:#ed424526}.main{background:var(--main);flex-direction:column;flex:1;min-width:0;display:flex}.empty-state{color:var(--text-muted);text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;display:flex}.empty-state h2{color:var(--header);margin-bottom:8px}.channel-topbar{flex-shrink:0;align-items:center;gap:8px;height:48px;padding:0 16px;display:flex;box-shadow:0 1px #0003}.topbar-hash{color:var(--text-muted);font-size:20px}.topbar-name{color:var(--header);font-size:16px;font-weight:700}.chat{flex-direction:column;flex:1;min-height:0;display:flex}.messages{flex-direction:column;flex:1;padding:16px 16px 8px;display:flex;overflow-y:auto}.messages-welcome{margin-top:auto;padding:16px 0}.welcome-hash{background:var(--active);color:#fff;border-radius:50%;place-items:center;width:68px;height:68px;margin-bottom:8px;font-size:34px;display:grid}.messages-welcome h2{color:var(--header);margin-bottom:4px;font-size:28px}.messages-welcome p{color:var(--text-muted)}.message{gap:14px;padding:6px 0;display:flex}.message:hover{background:#0000000f;border-radius:4px}.msg-head{align-items:baseline;gap:8px;display:flex}.msg-author{color:var(--header);font-size:15px;font-weight:600}.msg-time{color:var(--text-muted);font-size:11px}.msg-content{color:var(--text);word-break:break-word;font-size:15px;line-height:1.4}.composer{gap:8px;padding:0 16px 24px;display:flex}.composer input{color:var(--text);background:#40444b;border-radius:8px;flex:1;padding:12px 16px;font-size:15px}.composer button{background:var(--blurple);color:#fff;border-radius:8px;padding:0 22px;font-weight:600}.composer button:hover:not(:disabled){background:var(--blurple-hover)}.composer button:disabled{opacity:.5;cursor:not-allowed}.voice-view{flex-direction:column;flex:1;min-height:0;display:flex}.voice-stage{background:#202225;border-radius:8px;flex-direction:column;flex:1;justify-content:center;align-items:center;margin:12px;padding:24px;display:flex;overflow-y:auto}.voice-empty{text-align:center;color:var(--text-muted)}.voice-empty-icon{margin-bottom:12px;font-size:48px}.voice-empty h2{color:var(--header);margin-bottom:6px}.voice-grid{flex-wrap:wrap;justify-content:center;gap:20px;display:flex}.voice-tile{background:#292b2f;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:10px;width:180px;min-height:140px;padding:14px 8px;display:flex}.avatar{transition:box-shadow .12s}.voice-tile.me .avatar{box-shadow:0 0 0 3px var(--green)}.voice-tile.speaking .avatar{box-shadow:0 0 0 3px #3ba55d,0 0 16px 4px #3ba55d8c}.voice-member.speaking .avatar{box-shadow:0 0 0 2px var(--green)}.voice-tile-name{color:var(--text);font-size:15px;font-weight:500}.screen-grid{flex-wrap:wrap;justify-content:center;gap:14px;width:100%;margin-bottom:16px;display:flex}.screen-tile{background:#000;border-radius:10px;width:100%;max-width:720px;position:relative;overflow:hidden;box-shadow:0 4px 18px #00000073}.screen-video{object-fit:contain;background:#000;width:100%;max-height:56vh;display:block}.screen-label{color:#fff;background:#000000a6;border-radius:6px;padding:4px 10px;font-size:13px;font-weight:600;position:absolute;bottom:8px;left:8px}.voice-controls{justify-content:center;gap:12px;padding:12px 12px 24px;display:flex}.vc-btn{color:#fff;background:#4f545c;border-radius:24px;align-items:center;gap:8px;padding:12px 22px;font-size:15px;font-weight:600;transition:background .15s;display:inline-flex}.voice-volume{align-items:center;gap:6px;width:100%;padding:0 4px;display:flex}.vol-mute{color:var(--text-muted);background:0 0;flex-shrink:0;place-items:center;padding:2px;display:grid}.vol-mute:hover{color:#fff}.vol-slider{height:4px;accent-color:var(--blurple);cursor:pointer;flex:1}.topbar-icon{color:var(--text-muted)}.voice-empty-icon{color:var(--text-muted);opacity:.7;margin-bottom:12px}.vc-btn:hover{background:#5d6269}.vc-btn.join{background:var(--green)}.vc-btn.join:hover{background:#2d8049}.vc-btn.leave,.vc-btn.danger{background:var(--red)}.vc-btn.leave:hover,.vc-btn.danger:hover{background:#c93b3e}.modal-overlay{z-index:100;background:#0009;place-items:center;display:grid;position:fixed;inset:0}.modal{background:var(--main);border-radius:10px;width:440px;max-width:90vw;padding:24px}.modal h2{color:var(--header);margin-bottom:18px}.modal-label{color:var(--text-muted);text-transform:uppercase;margin:14px 0 8px;font-size:12px;font-weight:700;display:block}.type-options{flex-direction:column;gap:8px;display:flex}.type-option{color:var(--text);text-align:left;background:#2b2d31;border:2px solid #0000;border-radius:8px;align-items:center;gap:14px;padding:12px 14px;display:flex}.type-option:hover{background:#34373c}.type-option.selected{border-color:var(--blurple);background:#34373c}.type-icon{width:28px;color:var(--interactive);place-items:center;display:grid}.type-title{color:var(--header);font-weight:600}.type-desc{color:var(--text-muted);font-size:13px}.modal input{width:100%;color:var(--text);background:#1e1f22;border-radius:6px;padding:11px 14px;font-size:15px}.modal-actions{justify-content:flex-end;gap:12px;margin-top:24px;display:flex}.btn-ghost{color:var(--text);background:0 0;padding:10px 16px;font-weight:600}.btn-ghost:hover{text-decoration:underline}.btn-primary{background:var(--blurple);color:#fff;border-radius:6px;padding:10px 20px;font-weight:600}.btn-primary:hover:not(:disabled){background:var(--blurple-hover)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}