@import "https://fonts.googleapis.com/css2?family=Noto+Sans:wght@300;400;500;600;700&display=swap";.auth-page{background:var(--brand-color);background-image:radial-gradient(at 20%,#5865f24d 0%,#0000 50%),radial-gradient(at 80%,#eb459e33 0%,#0000 50%);justify-content:center;align-items:center;height:100vh;display:flex}.auth-container{width:100%;max-width:480px;padding:20px}.auth-box{background:var(--background-primary);box-shadow:var(--elevation-high);border-radius:8px;padding:32px}.auth-box h1{text-align:center;color:var(--header-primary);margin-bottom:8px;font-size:24px;font-weight:600}.auth-subtitle{text-align:center;color:var(--header-secondary);margin-bottom:20px;font-size:14px}.auth-error{border:1px solid var(--red-color);color:var(--red-color);background:#ed42451a;border-radius:4px;margin-bottom:16px;padding:10px 12px;font-size:14px}.form-group{margin-bottom:16px}.form-group label{color:var(--header-secondary);text-transform:uppercase;letter-spacing:.02em;margin-bottom:8px;font-size:12px;font-weight:700;display:block}.required{color:var(--red-color);margin-left:2px}.form-group input{background:var(--background-tertiary);width:100%;color:var(--text-normal);border:2px solid #0000;border-radius:4px;outline:none;padding:10px 12px;font-size:16px;transition:border-color .2s}.form-group input:focus{border-color:var(--brand-color)}.auth-btn{background:var(--brand-color);color:#fff;border:none;border-radius:4px;width:100%;margin-top:8px;padding:12px;font-size:16px;font-weight:500;transition:background .2s}.auth-btn:hover{background:var(--brand-hover)}.auth-btn:disabled{opacity:.5;cursor:not-allowed}.auth-link{color:var(--text-muted);margin-top:12px;font-size:14px}.auth-link a{color:var(--text-link);font-size:14px}.loading-screen{background:var(--background-primary);justify-content:center;align-items:center;height:100vh;display:flex}.spinner{border:4px solid var(--background-accent);border-top-color:var(--brand-color);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.discord-app{height:100vh;display:flex;overflow:hidden}.server-sidebar{background:var(--background-tertiary);flex-direction:column;align-items:center;gap:8px;width:72px;min-width:72px;padding:12px 0;display:flex;overflow-y:auto}.server-icon{color:#fff;cursor:pointer;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;font-size:18px;font-weight:600;transition:border-radius .2s,background .2s;display:flex;position:relative}.server-icon:hover,.server-icon.active{border-radius:16px}.server-icon.home{background:var(--background-primary);color:var(--header-primary)}.server-icon.home:hover,.server-icon.home.active{background:var(--brand-color);color:#fff}.server-icon.add-server{background:var(--background-primary);color:var(--green-color);font-size:24px}.server-icon.add-server:hover{background:var(--green-color);color:#fff}.server-separator{background:var(--background-accent);border-radius:1px;width:32px;height:2px}.channel-sidebar{background:var(--background-secondary);flex-direction:column;width:240px;min-width:240px;display:flex}.channel-header{border-bottom:2px solid var(--background-tertiary);height:48px;color:var(--header-primary);cursor:pointer;justify-content:space-between;align-items:center;padding:0 16px;font-size:15px;font-weight:600;transition:background .1s;display:flex}.channel-header:hover{background:var(--background-accent)}.channel-list{flex:1;padding:8px;overflow-y:auto}.channel-category{margin-bottom:4px}.category-header{text-transform:uppercase;color:var(--text-muted);letter-spacing:.02em;cursor:pointer;justify-content:space-between;align-items:center;padding:6px 8px;font-size:12px;font-weight:700;display:flex}.category-header:hover{color:var(--header-secondary)}.add-channel-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:0 4px;font-size:16px;line-height:1}.add-channel-btn:hover{color:var(--header-secondary)}.channel-item{cursor:pointer;color:var(--channel-icon);border-radius:4px;align-items:center;gap:6px;padding:6px 8px;font-size:15px;font-weight:500;transition:background .1s,color .1s;display:flex}.channel-item:hover{background:var(--background-accent);color:var(--header-secondary)}.channel-item.active{background:var(--background-accent);color:var(--header-primary)}.channel-item .hash{opacity:.7;font-size:20px}.user-panel{background:var(--background-tertiary);align-items:center;gap:8px;height:52px;padding:0 8px;display:flex}.user-panel .avatar{color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;font-size:14px;font-weight:600;display:flex}.user-info{flex:1;min-width:0}.user-info .username{color:var(--header-primary);white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:600;overflow:hidden}.user-info .status{color:var(--text-muted);font-size:11px}.logout-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px;font-size:18px}.logout-btn:hover{color:var(--red-color);background:var(--background-accent)}.chat-area{background:var(--background-primary);flex-direction:column;flex:1;min-width:0;display:flex}.chat-header{border-bottom:2px solid var(--background-tertiary);align-items:center;gap:8px;height:48px;padding:0 16px;display:flex}.chat-header .hash{color:var(--channel-icon);font-size:24px;font-weight:500}.chat-header .channel-name{color:var(--header-primary);font-size:15px;font-weight:600}.chat-header .divider{background:var(--background-accent);width:1px;height:24px;margin:0 8px}.chat-header .channel-topic{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.header-actions{gap:4px;margin-left:auto;display:flex}.header-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px 8px;font-size:20px}.header-btn:hover{color:var(--header-primary);background:var(--background-accent)}.messages-container{flex-direction:column;flex:1;padding:16px;display:flex;overflow-y:auto}.message{gap:16px;margin-top:16px;padding:2px 0;display:flex}.message:first-child{margin-top:auto}.message .msg-avatar{color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;margin-top:2px;font-size:16px;font-weight:600;display:flex}.message-content{flex:1;min-width:0}.message-header{align-items:baseline;gap:8px;display:flex}.message-header .msg-username{cursor:pointer;font-size:15px;font-weight:600}.message-header .msg-username:hover{text-decoration:underline}.message-header .msg-timestamp{color:var(--text-muted);font-size:12px}.message-text{color:var(--text-normal);word-wrap:break-word;margin-top:2px;font-size:15px;line-height:1.375}.welcome-message{margin-bottom:16px;padding:16px 0}.welcome-message .welcome-icon{color:#fff;border-radius:50%;justify-content:center;align-items:center;width:68px;height:68px;margin-bottom:8px;font-size:36px;display:flex}.welcome-message h2{color:var(--header-primary);margin-bottom:8px;font-size:28px;font-weight:700}.welcome-message p{color:var(--text-muted);font-size:14px}.message-input-container{padding:0 16px 24px}.message-input-wrapper{background:var(--input-background);border-radius:8px;align-items:flex-end;padding:2px 16px 2px 0;display:flex}.message-input-wrapper input{color:var(--text-normal);background:0 0;border:none;outline:none;flex:1;padding:11px 16px;font-size:15px}.message-input-wrapper input::placeholder{color:var(--text-muted)}.send-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:8px;font-size:20px}.send-btn:hover{color:var(--header-primary)}.member-sidebar{background:var(--background-secondary);width:240px;min-width:240px;padding:16px 8px;overflow-y:auto}.member-category{margin-bottom:16px}.member-category-title{text-transform:uppercase;color:var(--text-muted);letter-spacing:.02em;margin-bottom:4px;padding:0 8px;font-size:12px;font-weight:700}.member-item{cursor:pointer;border-radius:4px;align-items:center;gap:12px;padding:6px 8px;display:flex}.member-item:hover{background:var(--background-accent)}.member-avatar{color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;font-size:13px;font-weight:600;display:flex;position:relative}.status-dot{border:2px solid var(--background-secondary);border-radius:50%;width:10px;height:10px;position:absolute;bottom:-1px;right:-1px}.status-dot.online{background:var(--green-color)}.status-dot.idle{background:var(--yellow-color)}.status-dot.dnd{background:var(--red-color)}.status-dot.offline{background:var(--text-muted)}.member-name{color:var(--header-secondary);font-size:14px;font-weight:500}.modal-overlay{z-index:1000;background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--background-primary);width:100%;max-width:440px;box-shadow:var(--elevation-high);border-radius:8px;padding:24px}.modal h2{color:var(--header-primary);text-align:center;margin-bottom:8px;font-size:20px;font-weight:700}.modal p{color:var(--text-muted);text-align:center;margin-bottom:16px;font-size:14px}.modal .form-group{margin-bottom:16px}.modal-actions{justify-content:flex-end;gap:12px;margin-top:16px;display:flex}.modal-actions .cancel-btn{color:var(--text-normal);background:0 0;border:none;padding:8px 16px;font-size:14px}.modal-actions .submit-btn{background:var(--brand-color);color:#fff;border:none;border-radius:4px;padding:8px 24px;font-size:14px;font-weight:500}.modal-actions .submit-btn:hover{background:var(--brand-hover)}.dm-panel{padding:16px 8px}.dm-header{text-transform:uppercase;color:var(--text-muted);letter-spacing:.02em;padding:6px 8px;font-size:12px;font-weight:700}.no-channel{color:var(--text-muted);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:12px;display:flex}.no-channel .icon{opacity:.3;font-size:64px}.no-channel p{font-size:16px}:root{--background-primary:#313338;--background-secondary:#2b2d31;--background-tertiary:#1e1f22;--background-accent:#404249;--background-floating:#111214;--text-normal:#dbdee1;--text-muted:#949ba4;--text-link:#00a8fc;--header-primary:#f2f3f5;--header-secondary:#b5bac1;--brand-color:#5865f2;--brand-hover:#4752c4;--green-color:#23a55a;--red-color:#ed4245;--yellow-color:#f0b232;--channel-icon:#80848e;--scrollbar-thin-thumb:#1a1b1e;--scrollbar-thin-track:#2b2d31;--input-background:#383a40;--elevation-high:0 8px 16px #0000003d}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--background-primary);color:var(--text-normal);height:100vh;font-family:Noto Sans,sans-serif;overflow:hidden}#root{height:100vh}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--scrollbar-thin-track);border-radius:4px}::-webkit-scrollbar-thumb{background:var(--scrollbar-thin-thumb);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#232428}button{cursor:pointer;font-family:inherit}input,textarea{font-family:inherit}a{color:var(--text-link);text-decoration:none}a:hover{text-decoration:underline}