:root{--blurple: #5865F2;--blurple-hover: #4752C4;--blurple-active: #3C45A5;--green: #248046;--green-hover: #1A6334;--red: #DA373C;--red-hover: #A12828;--bg-primary: #313338;--bg-secondary: #2B2D31;--bg-tertiary: #1E1F22;--bg-floating: #111214;--bg-modifier-hover: rgba(79, 84, 92, .16);--bg-modifier-active: rgba(79, 84, 92, .24);--bg-modifier-selected: rgba(79, 84, 92, .32);--text-normal: #DBDEE1;--text-muted: #949BA4;--text-link: #00A8FC;--header-primary: #F2F3F5;--header-secondary: #B5BAC1;--input-bg: #1E1F22;--input-border: #3F4147;--status-online: #23A559;--status-idle: #F0B232;--status-dnd: #F23F43;--status-offline: #80848E;--channel-icon: #80848E;--divider: #3F4147;--scrollbar-thumb: #1A1B1E;--font: "gg sans", "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 16px;--radius-round: 50%}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font);background:var(--bg-primary);color:var(--text-normal);overflow:hidden;height:100vh;font-size:14px;line-height:1.375;-webkit-font-smoothing:antialiased}#root{height:100vh}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;font-size:inherit}input,textarea{font-family:inherit;font-size:inherit;color:var(--text-normal);background:var(--input-bg);border:none;outline:none}a{color:var(--text-link);text-decoration:none}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:4px}.loading-screen{display:flex;align-items:center;justify-content:center;height:100vh;background:var(--bg-tertiary)}.loading-spinner{width:48px;height:48px;border:4px solid var(--bg-modifier-hover);border-top-color:var(--blurple);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.login-page{display:flex;align-items:center;justify-content:center;height:100vh;background:var(--bg-tertiary)}.login-card{background:var(--bg-primary);border-radius:var(--radius-md);padding:32px;width:100%;max-width:480px;margin:16px}.login-card h1{color:var(--header-primary);font-size:24px;font-weight:600;text-align:center;margin-bottom:8px}.login-subtitle{color:var(--text-muted);text-align:center;margin-bottom:20px;font-size:14px}.login-card label{display:block;margin-bottom:16px}.login-card label span{display:block;color:var(--header-secondary);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.02em;margin-bottom:8px}.login-card input{width:100%;padding:10px 12px;border-radius:var(--radius-sm);background:var(--input-bg);border:1px solid var(--input-border);color:var(--text-normal);font-size:16px;transition:border-color .15s}.login-card input:focus{border-color:var(--blurple)}.login-error{color:var(--red);font-size:13px;margin-bottom:12px;text-align:center}.login-button{display:block;width:100%;padding:10px 16px;border-radius:var(--radius-sm);background:var(--blurple);color:#fff;font-size:14px;font-weight:500;min-height:38px;transition:background .15s;margin-top:8px}.login-button:hover{background:var(--blurple-hover)}.login-button:disabled{opacity:.5;cursor:not-allowed}.login-toggle{text-align:center;margin-top:16px;font-size:14px;color:var(--text-muted)}.login-toggle a{color:var(--text-link)}.login-toggle a:hover{text-decoration:underline}.app-layout{display:flex;height:100vh;overflow:hidden;position:relative}.sidebar-container{display:flex;flex-shrink:0}.main-content{flex:1;display:flex;min-width:0}.server-sidebar{width:72px;min-width:72px;background:var(--bg-tertiary);display:flex;flex-direction:column;align-items:center;padding:12px 0;gap:4px;overflow-y:auto;scrollbar-width:none}.server-sidebar::-webkit-scrollbar{display:none}.server-icon{width:48px;height:48px;border-radius:24px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:600;color:var(--text-normal);background:var(--bg-primary);transition:border-radius .2s,background .2s,color .2s;position:relative;flex-shrink:0;cursor:pointer;-webkit-user-select:none;user-select:none}.server-icon:hover,.server-icon.active{border-radius:var(--radius-lg)}.server-icon:hover,.server-icon.active{background:var(--blurple);color:#fff}.server-icon:before{content:"";position:absolute;left:-16px;width:4px;border-radius:0 4px 4px 0;background:var(--header-primary);transition:height .2s;height:0}.server-icon:hover:before{height:20px}.server-icon.active:before{height:40px}.server-sidebar-separator{width:32px;height:2px;background:var(--divider);border-radius:1px;margin:4px 0;flex-shrink:0}.server-icon.add-server{background:var(--bg-primary);color:var(--status-online);font-size:24px;font-weight:300}.server-icon.add-server:hover{background:var(--status-online);color:#fff}.server-icon.join-server{background:var(--bg-primary);color:var(--status-online);font-size:20px}.server-icon.join-server:hover{background:var(--status-online);color:#fff}.channel-sidebar{width:240px;min-width:240px;background:var(--bg-secondary);display:flex;flex-direction:column;overflow:hidden}.channel-sidebar-header{height:48px;padding:0 16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--bg-tertiary);flex-shrink:0;cursor:pointer;-webkit-user-select:none;user-select:none}.channel-sidebar-server-name{font-size:15px;font-weight:600;color:var(--header-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.channel-sidebar-settings{color:var(--text-muted);font-size:18px}.channel-sidebar-header:hover .channel-sidebar-settings{color:var(--text-normal)}.channel-list{flex:1;overflow-y:auto;padding:0 8px}.channel-category{padding-top:16px}.channel-category-label{display:block;padding:0 8px 4px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.02em;color:var(--text-muted)}.channel-item{display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:var(--radius-sm);color:var(--channel-icon);cursor:pointer;font-size:15px;transition:background .1s,color .1s}.channel-item:hover{background:var(--bg-modifier-hover);color:var(--text-normal)}.channel-item.active{background:var(--bg-modifier-selected);color:var(--header-primary)}.channel-hash{font-size:18px;font-weight:500;opacity:.7;width:20px;text-align:center;flex-shrink:0}.channel-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-bar{height:52px;padding:0 8px;background:var(--bg-tertiary);display:flex;align-items:center;gap:8px;flex-shrink:0;border-top:1px solid rgba(0,0,0,.2)}.user-bar-avatar{width:32px;height:32px;border-radius:var(--radius-round);background:var(--blurple);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;color:#fff;flex-shrink:0}.user-bar-info{flex:1;min-width:0}.user-bar-name{font-size:13px;font-weight:600;color:var(--header-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-bar-status{font-size:11px;color:var(--text-muted)}.user-bar-logout{color:var(--text-muted);font-size:18px;padding:4px;border-radius:var(--radius-sm)}.user-bar-logout:hover{background:var(--bg-modifier-hover);color:var(--text-normal)}.chat-area{flex:1;display:flex;flex-direction:column;min-width:0;background:var(--bg-primary)}.chat-header{height:48px;padding:0 16px;display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--bg-tertiary);flex-shrink:0}.chat-header-hash{color:var(--channel-icon);font-size:20px;font-weight:500}.chat-header-name{font-size:15px;font-weight:600;color:var(--header-primary)}.chat-header-desc{font-size:13px;color:var(--text-muted);margin-left:8px;padding-left:16px;border-left:1px solid var(--divider);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-empty{flex:1;display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-size:16px}.chat-messages{flex:1;overflow-y:auto;padding:16px 0;display:flex;flex-direction:column}.message-item{display:flex;gap:16px;padding:2px 16px;min-height:44px;margin-top:16px}.message-item:first-child{margin-top:0}.message-item:hover{background:var(--bg-modifier-hover)}.message-avatar{width:40px;height:40px;border-radius:var(--radius-round);background:var(--blurple-hover);display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:600;color:#fff;flex-shrink:0}.message-body{flex:1;min-width:0}.message-header{display:flex;align-items:baseline;gap:8px}.message-author{font-size:15px;font-weight:600;color:var(--header-primary)}.message-time{font-size:12px;color:var(--text-muted)}.message-content{color:var(--text-normal);font-size:15px;line-height:1.375;word-break:break-word;white-space:pre-wrap}.typing-indicator{padding:0 16px 4px;font-size:13px;color:var(--text-muted);height:24px;flex-shrink:0}.chat-input-wrapper{padding:0 16px 24px;flex-shrink:0;display:flex;gap:0}.chat-input-wrapper>div,.chat-input-wrapper{position:relative}.chat-input{flex:1;background:var(--input-bg);border:none;resize:none;padding:11px 48px 11px 16px;border-radius:var(--radius-md);max-height:200px;font-size:15px;line-height:1.375;color:var(--text-normal);width:100%}.chat-input::placeholder{color:var(--text-muted)}.chat-send-btn{position:absolute;right:24px;bottom:28px;color:var(--text-muted);font-size:22px;padding:4px;transition:color .15s;background:none;border:none}.chat-send-btn:hover:not(:disabled){color:var(--blurple)}.chat-send-btn:disabled{opacity:.3;cursor:default}.member-list{width:240px;min-width:240px;background:var(--bg-secondary);overflow-y:auto;padding:8px;border-left:1px solid var(--bg-tertiary)}.member-group{margin-bottom:8px}.member-group-label{font-size:12px;font-weight:700;text-transform:uppercase;color:var(--text-muted);padding:16px 8px 4px;letter-spacing:.02em}.member-item{display:flex;align-items:center;gap:12px;padding:6px 8px;border-radius:var(--radius-sm);cursor:default}.member-item:hover{background:var(--bg-modifier-hover)}.member-item.offline{opacity:.5}.member-avatar{width:32px;height:32px;border-radius:var(--radius-round);background:var(--blurple-hover);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;color:#fff;position:relative;flex-shrink:0}.member-status{position:absolute;bottom:-1px;right:-1px;width:10px;height:10px;border-radius:var(--radius-round);border:2px solid var(--bg-secondary);background:var(--status-offline)}.member-status.online{background:var(--status-online)}.member-info{flex:1;min-width:0;display:flex;align-items:center;gap:4px}.member-name{font-size:14px;font-weight:500;color:var(--text-normal);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.member-role{font-size:10px;font-weight:700;text-transform:uppercase;padding:1px 4px;border-radius:3px;color:#fff;flex-shrink:0}.member-role.owner{background:var(--blurple)}.member-role.admin{background:var(--green)}.members-toggle{position:absolute;top:10px;right:16px;z-index:10;background:none;border:none;color:var(--text-muted);font-size:20px;padding:6px;border-radius:var(--radius-sm);cursor:pointer}.members-toggle:hover{color:var(--text-normal);background:var(--bg-modifier-hover)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .15s}.modal-card{background:var(--bg-primary);border-radius:var(--radius-md);width:100%;max-width:440px;margin:16px;padding:24px;animation:scaleIn .15s}.modal-title{font-size:20px;font-weight:600;color:var(--header-primary);margin-bottom:8px}.modal-card label{display:block;margin-bottom:16px}.modal-card label span{display:block;color:var(--header-secondary);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.02em;margin-bottom:8px}.modal-card input{width:100%;padding:10px 12px;border-radius:var(--radius-sm);background:var(--input-bg);border:1px solid var(--input-border);color:var(--text-normal);font-size:16px;transition:border-color .15s}.modal-card input:focus{border-color:var(--blurple)}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}.btn-secondary{padding:10px 16px;border-radius:var(--radius-sm);color:var(--text-normal);font-size:14px;font-weight:500;background:none;border:none;cursor:pointer}.btn-secondary:hover{text-decoration:underline}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}.voice-view{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;padding:24px}.voice-header{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:600;color:var(--header-primary)}.voice-participants{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:16px;width:100%;max-width:600px}.voice-participant{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px;background:var(--bg-secondary);border-radius:var(--radius-md)}.voice-participant-avatar{width:64px;height:64px;border-radius:var(--radius-round);background:var(--blurple-hover);display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:600;color:#fff}.voice-participant-name{font-size:13px;color:var(--text-normal);text-align:center}.voice-controls{display:flex;gap:12px}.voice-btn{padding:12px 24px;border-radius:var(--radius-round);font-size:14px;font-weight:500;background:var(--bg-secondary);color:var(--text-normal);cursor:pointer}.voice-btn:hover{background:var(--bg-modifier-hover)}.voice-btn.muted{color:var(--red)}.voice-btn.disconnect{background:var(--red);color:#fff}.voice-btn.disconnect:hover{background:var(--red-hover)}.server-details{text-align:center}.server-details-icon{width:80px;height:80px;border-radius:var(--radius-lg);background:var(--blurple);display:flex;align-items:center;justify-content:center;font-size:36px;font-weight:600;color:#fff;margin:0 auto 16px}.server-details h3{font-size:20px;font-weight:600;color:var(--header-primary);margin-bottom:8px}.server-details-desc{color:var(--text-muted);font-size:14px;margin-bottom:16px}.server-details-invite{text-align:left;margin-top:16px}.server-details-invite-label{display:block;font-size:12px;font-weight:700;text-transform:uppercase;color:var(--text-muted);margin-bottom:8px}.server-details-invite-row{display:flex;align-items:center;gap:8px}.server-details-invite-row code{flex:1;background:var(--input-bg);padding:8px 12px;border-radius:var(--radius-sm);font-family:monospace;font-size:14px;color:var(--text-normal);-webkit-user-select:all;user-select:all}.mobile-hamburger{display:none;position:fixed;top:10px;left:8px;z-index:100;background:var(--bg-secondary);color:var(--text-normal);font-size:22px;padding:6px 10px;border-radius:var(--radius-sm);border:none;cursor:pointer}.mobile-overlay{display:none}@media (max-width: 768px){.mobile-hamburger{display:block}.sidebar-container{display:none;position:fixed;left:0;top:0;height:100vh;z-index:200}.sidebar-container.open{display:flex}.mobile-overlay{display:block;position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:199}.member-list{position:fixed;right:0;top:0;height:100vh;z-index:200}.members-toggle{top:10px;right:8px}.chat-header{padding-left:48px}}