*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%}body{font-family:gg sans,Noto Sans,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:16px;color:var(--text-normal);background:var(--bg-tertiary);overflow:hidden}a{color:var(--link);cursor:pointer}a:hover{text-decoration:underline}:root{--bg-primary: #313338;--bg-secondary: #2b2d31;--bg-tertiary: #1e1f22;--bg-hover: #35373c;--bg-active: #404249;--bg-float: #111214;--text-normal: #dbdee1;--text-muted: #949ba4;--text-bright: #f2f3f5;--text-sec: #b5bac1;--link: #00a8fc;--brand: #5865f2;--brand-hover: #4752c4;--green: #23a55a;--red: #f23f43;--input-bg: #383a40;--separator: #3f4147}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#1a1b1e;border-radius:4px}.loading-screen{height:100vh;display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-size:18px}.app-root{display:flex;flex-direction:column;height:100vh}.title-bar{height:32px;background:var(--bg-tertiary);display:flex;align-items:center;flex-shrink:0}.title-bar-drag{flex:1;-webkit-app-region:drag;padding-left:12px;font-size:12px;font-weight:600;color:var(--text-muted);line-height:32px}.title-bar-btns{display:flex;-webkit-app-region:no-drag}.tb-btn{width:46px;height:32px;border:none;background:transparent;color:var(--text-muted);font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:center}.tb-btn:hover{background:var(--bg-hover);color:var(--text-bright)}.tb-close:hover{background:var(--red);color:#fff}.auth-screen{flex:1;display:flex;align-items:center;justify-content:center;background:var(--bg-primary)}.auth-card{width:480px;background:var(--bg-secondary);border-radius:8px;padding:32px;box-shadow:0 2px 10px #0006}.auth-card h1{color:var(--text-bright);font-size:24px;text-align:center}.auth-sub{color:var(--text-muted);text-align:center;margin:8px 0 20px;font-size:14px}.field{display:block;margin-bottom:20px}.field span{display:block;margin-bottom:8px;font-size:12px;font-weight:700;text-transform:uppercase;color:var(--text-sec);letter-spacing:.02em}.field input{width:100%;padding:10px 12px;background:var(--bg-tertiary);border:none;border-radius:4px;color:var(--text-normal);font-size:16px;outline:none}.field input:focus{outline:2px solid var(--brand)}.form-error{color:var(--red);font-size:14px;margin-bottom:12px;font-style:italic}.btn-primary{width:100%;padding:12px;background:var(--brand);color:#fff;font-size:16px;font-weight:600;border:none;border-radius:4px;cursor:pointer;transition:background .15s}.btn-primary:hover{background:var(--brand-hover)}.btn-primary:disabled{opacity:.6;cursor:default}.auth-switch{margin-top:12px;font-size:14px;color:var(--text-muted)}.app-layout{flex:1;display:flex;min-height:0}.server-list{width:72px;background:var(--bg-tertiary);display:flex;flex-direction:column;align-items:center;padding:12px 0;gap:4px;overflow-y:auto;flex-shrink:0}.sl-item{position:relative;display:flex;align-items:center;justify-content:center;width:72px}.sl-pill{position:absolute;left:0;width:4px;border-radius:0 4px 4px 0;background:var(--text-bright);transition:height .15s;height:0}.sl-item:hover .sl-pill{height:20px}.sl-item.active .sl-pill{height:40px}.srv-icon{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-weight:700;font-size:18px;color:var(--green);background:var(--bg-primary);transition:border-radius .15s,background .15s,color .15s;overflow:hidden;-webkit-user-select:none;user-select:none}.srv-icon:hover,.srv-icon.active{border-radius:16px;background:var(--brand);color:#fff}.home-icon{color:var(--text-bright)}.home-icon:hover{background:var(--brand)}.add-icon{color:var(--green);font-size:24px;background:var(--bg-primary)}.add-icon:hover{background:var(--green);color:#fff;border-radius:16px}.sl-sep{width:32px;height:2px;background:var(--separator);border-radius:1px;margin:4px 0}.channel-sidebar{width:240px;background:var(--bg-secondary);display:flex;flex-direction:column;flex-shrink:0}.cs-header{height:48px;padding:0 16px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 1px #00000040;flex-shrink:0}.cs-header h2{font-size:16px;font-weight:600;color:var(--text-bright);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cs-invite{background:none;border:none;color:var(--text-muted);font-size:18px;cursor:pointer;padding:4px 6px;border-radius:4px}.cs-invite:hover{background:var(--bg-hover);color:var(--text-bright)}.cs-invite-banner{padding:8px 16px;font-size:12px;color:var(--text-muted);cursor:pointer;background:var(--bg-tertiary);border-bottom:1px solid rgba(0,0,0,.15)}.cs-invite-banner code{background:var(--bg-primary);padding:2px 6px;border-radius:3px;color:var(--text-bright);font-size:12px}.cs-invite-banner span{color:var(--green);margin-left:6px}.cs-list{flex:1;overflow-y:auto;padding:8px 0}.cs-category{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 4px;font-size:12px;font-weight:600;text-transform:uppercase;color:var(--text-muted);letter-spacing:.02em}.cs-category button{background:none;border:none;color:var(--text-muted);font-size:16px;cursor:pointer;padding:0 2px}.cs-category button:hover{color:var(--text-bright)}.cs-channel{display:flex;align-items:center;gap:6px;padding:6px 16px;margin:1px 8px;border-radius:4px;cursor:pointer;color:var(--text-muted);font-size:15px}.cs-channel:hover{background:var(--bg-hover);color:var(--text-normal)}.cs-channel.active{background:var(--bg-active);color:var(--text-bright)}.cs-hash{font-size:18px;font-weight:500;opacity:.6}.cs-empty{padding:16px;color:var(--text-muted);font-size:14px;text-align:center;margin-top:20px}.user-panel{height:52px;background:#0003;display:flex;align-items:center;padding:0 8px;gap:8px;flex-shrink:0}.up-avatar{width:32px;height:32px;border-radius:50%;background:var(--brand);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff;flex-shrink:0}.up-info{flex:1;min-width:0}.up-name{display:block;font-size:14px;font-weight:600;color:var(--text-bright);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.up-status{display:block;font-size:12px;color:var(--text-muted)}.up-logout{background:none;border:none;color:var(--text-muted);font-size:18px;cursor:pointer;padding:4px 6px;border-radius:4px}.up-logout:hover{background:var(--bg-hover);color:var(--text-bright)}.chat-area{flex:1;display:flex;flex-direction:column;background:var(--bg-primary);min-width:0}.ca-header{height:48px;padding:0 16px;display:flex;align-items:center;gap:8px;box-shadow:0 1px #00000040;flex-shrink:0}.ca-hash{color:var(--text-muted);font-size:22px;font-weight:500}.ca-name{font-size:16px;font-weight:600;color:var(--text-bright)}.ca-actions{margin-left:auto}.ca-actions button{background:none;border:none;color:var(--text-muted);font-size:18px;cursor:pointer;padding:4px 8px;border-radius:4px}.ca-actions button:hover{background:var(--bg-hover);color:var(--text-bright)}.ca-messages{flex:1;overflow-y:auto;padding:16px 0}.ca-welcome{padding:16px 16px 8px;margin-bottom:8px;border-bottom:1px solid var(--separator)}.ca-welcome-hash{width:68px;height:68px;border-radius:50%;background:var(--bg-active);display:flex;align-items:center;justify-content:center;font-size:40px;font-weight:700;color:var(--text-bright);margin-bottom:8px}.ca-welcome h3{font-size:28px;color:var(--text-bright);margin-bottom:4px}.ca-welcome p{font-size:14px;color:var(--text-muted)}.msg{display:flex;padding:2px 16px;position:relative}.msg:hover{background:#0000000f}.msg-full{margin-top:16px}.msg-compact{padding-left:68px}.msg-avatar{width:40px;height:40px;border-radius:50%;background:var(--brand);display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:#fff;flex-shrink:0;margin-right:12px;margin-top:2px}.msg-body{min-width:0;flex:1}.msg-meta{display:flex;align-items:baseline;gap:8px}.msg-author{font-size:15px;font-weight:600;color:var(--text-bright)}.msg-time{font-size:12px;color:var(--text-muted)}.msg-text{font-size:15px;color:var(--text-normal);line-height:1.375;word-wrap:break-word}.chat-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text-muted);text-align:center;padding:32px}.chat-empty h2{color:var(--text-bright);margin-bottom:8px}.chat-empty-icon{font-size:64px;margin-bottom:16px}.ca-input-wrap{padding:0 16px 24px;flex-shrink:0}.ca-input-box{background:var(--input-bg);border-radius:8px;padding:2px 16px;display:flex;align-items:flex-end}.ca-input{flex:1;background:transparent;border:none;color:var(--text-normal);font-size:15px;font-family:inherit;padding:10px 0;resize:none;outline:none;max-height:200px;line-height:1.375}.ca-input::placeholder{color:var(--text-muted)}.member-list{width:240px;background:var(--bg-secondary);padding:12px 8px;overflow-y:auto;flex-shrink:0}.ml-cat{padding:16px 8px 4px;font-size:12px;font-weight:600;text-transform:uppercase;color:var(--text-muted);letter-spacing:.02em}.ml-member{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:4px;cursor:pointer}.ml-member:hover{background:var(--bg-hover)}.ml-offline{opacity:.4}.ml-avatar{width:32px;height:32px;border-radius:50%;background:var(--bg-active);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:var(--text-bright);position:relative}.ml-avatar.online:after{content:"";position:absolute;bottom:-1px;right:-1px;width:10px;height:10px;background:var(--green);border:2px solid var(--bg-secondary);border-radius:50%}.ml-member span{font-size:15px;color:var(--text-sec)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:100}.modal-card{background:var(--bg-primary);border-radius:8px;padding:32px;width:440px;max-width:90vw;position:relative;box-shadow:0 4px 32px #00000080}.modal-card h2{color:var(--text-bright);font-size:22px;text-align:center;margin-bottom:16px}.modal-x{position:absolute;top:12px;right:12px;background:none;border:none;color:var(--text-muted);font-size:20px;cursor:pointer;padding:4px 8px}.modal-x:hover{color:var(--text-bright)}.modal-btn{display:flex;align-items:center;gap:12px;width:100%;padding:12px 16px;border:none;border-radius:8px;cursor:pointer;font-size:16px;font-weight:500;font-family:inherit;transition:background .15s}.modal-btn.big{background:var(--bg-secondary);color:var(--text-bright);margin-bottom:10px;border:1px solid var(--separator)}.modal-btn.big:hover{background:var(--bg-hover)}.modal-btn-icon{font-size:24px}.modal-btn.primary{background:var(--brand);color:#fff;justify-content:center;font-weight:600;margin-top:12px}.modal-btn.primary:hover{background:var(--brand-hover)}.modal-btn.primary:disabled{opacity:.5;cursor:default}.modal-btn.back{background:transparent;color:var(--text-muted);justify-content:center}.modal-btn.back:hover{color:var(--text-bright)}.modal-row{display:flex;gap:12px;margin-top:12px}.modal-row .modal-btn{flex:1}.ctx-menu{position:fixed;z-index:200;min-width:188px;padding:6px 8px;background:var(--bg-float);border-radius:4px;box-shadow:0 8px 24px #0009;animation:ctxIn .12s ease}@keyframes ctxIn{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.ctx-item{display:block;width:100%;padding:8px 10px;border:none;border-radius:3px;background:transparent;color:var(--text-normal);font-size:14px;font-family:inherit;text-align:left;cursor:pointer}.ctx-item:hover{background:var(--brand);color:#fff}.ctx-item.danger{color:var(--red)}.ctx-item.danger:hover{background:var(--red);color:#fff}.modal-btn.danger{background:var(--red);color:#fff;justify-content:center;font-weight:600;transition:background .15s}.modal-btn.danger:hover{background:#d83438}.modal-btn.danger:disabled{opacity:.5;cursor:default}.ca-mobile-btn,.mobile-backdrop{display:none}@media (max-width: 768px){.ca-mobile-btn{display:flex!important;align-items:center;justify-content:center;background:none;border:none;color:var(--text-normal);font-size:1.3rem;padding:0 10px 0 4px;cursor:pointer;flex-shrink:0}.title-bar{display:none!important}.app-layout{position:relative!important;overflow:hidden!important}.server-list{position:absolute!important;top:0!important;bottom:0!important;left:0!important;z-index:200!important;transform:translate(-100%)!important;transition:transform .25s ease!important}.channel-sidebar{position:absolute!important;top:0!important;bottom:0!important;left:72px!important;z-index:200!important;transform:translate(-312px)!important;transition:transform .25s ease!important}.mobile-channels .server-list,.mobile-channels .channel-sidebar{transform:translate(0)!important}.member-list{position:absolute!important;top:0!important;bottom:0!important;right:0!important;z-index:200!important;transform:translate(100%)!important;transition:transform .25s ease!important}.mobile-members .member-list{transform:translate(0)!important}.chat-area{min-width:0!important;width:100%!important;flex:1 1 100%!important}.mobile-backdrop{display:block!important;position:absolute!important;top:0!important;right:0!important;bottom:0!important;left:0!important;background:#00000080!important;z-index:150!important;-webkit-tap-highlight-color:transparent}}