:root{color-scheme:dark;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background-color:#1e1f22;color:#f2f3f5}*{margin:0;padding:0;box-sizing:border-box}body{background-color:#1e1f22;color:#f2f3f5;min-height:100vh}a{color:inherit;text-decoration:none}button{cursor:pointer;font:inherit}input,textarea{font:inherit;background:none;border:none;color:inherit}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#2b2d31}::-webkit-scrollbar-thumb{background:#1f2125;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#202225}.app-shell{display:grid;grid-template-columns:80px 260px 1fr 280px;grid-template-rows:100vh;width:100%}.login-overlay{display:grid;place-items:center;min-height:100vh;background:radial-gradient(circle at top,#5865f2 0,rgba(88,101,242,.1) 40%,#1e1f22 85%);padding:4rem 2rem 2rem}.topbar{position:fixed;top:0;left:0;right:0;height:56px;display:flex;align-items:center;padding:0 1rem;background:#2b2d31;border-bottom:1px solid #1e1f22;z-index:10;gap:.75rem}.topbar-logo{width:32px;height:32px;border-radius:6px;object-fit:cover}.topbar strong{font-size:1rem}.login-card{background:#2b2d31;padding:2rem;border-radius:12px;box-shadow:0 20px 50px rgba(0,0,0,.35);width:min(420px,100%);display:flex;flex-direction:column;gap:1rem}.login-card h1{font-size:1.8rem;text-align:center}.login-card p{color:#b5bac1;text-align:center}.login-card label{font-weight:600;color:#f2f3f5}.login-card input{background:#1e1f22;border-radius:8px;border:1px solid #1e1f22;padding:.75rem 1rem;transition:border-color .2s ease,background .2s ease}.login-card input:focus{border-color:#5865f2;background:#313338;outline:none}.login-card button{background:#5865f2;border:none;border-radius:8px;padding:.85rem 1rem;font-weight:600;color:#fff;transition:background .2s ease,transform .2s ease}.login-card button:disabled{opacity:.6;cursor:not-allowed}.login-card button:not(:disabled):hover{background:#4752c4;transform:translateY(-1px)}.login-card .error{color:#f23f43;font-size:.9rem}.login-card small{color:#b5bac1;font-size:.8rem;text-align:center}.server-sidebar{background:#1e1f22;padding:1rem .5rem;display:flex;flex-direction:column;gap:.75rem;align-items:center;border-right:1px solid #2b2d31}.server-button,.server-home{width:48px;height:48px;border-radius:50%;background:#313338;display:grid;place-items:center;color:#f2f3f5;font-weight:700;border:none;transition:border-radius .2s ease,background .2s ease}.server-button img{width:100%;height:100%;border-radius:50%}.server-button.selected,.server-button:hover,.server-home:hover{background:#5865f2;border-radius:18px}.divider{height:2px;width:60%;background:#2b2d31;border-radius:999px}.channel-sidebar{background:#2b2d31;border-right:1px solid #1e1f22;display:flex;flex-direction:column}.channel-sidebar header{padding:1rem;border-bottom:1px solid #1e1f22;display:flex;align-items:center;justify-content:space-between;gap:.5rem}.channel-sidebar header strong{display:block;font-size:1rem}.channel-sidebar header span{display:block;color:#b5bac1;font-size:.8rem}.channel-sidebar header button{background:#f23f43;border:none;border-radius:6px;padding:.35rem .75rem;font-weight:600;color:#fff}.channel-sidebar section{flex:1 1;overflow-y:auto;padding:1rem}.channel-sidebar ul{display:flex;flex-direction:column;gap:.25rem}.channel-groups{display:flex;flex-direction:column;gap:.75rem}.channel-group{list-style:none}.channel-category{display:flex;flex-direction:column;gap:.35rem}.channel-category-title{font-size:.75rem;font-weight:600;color:#b5bac1;text-transform:uppercase;letter-spacing:.05em;padding:0 .25rem}.channel-sidebar li button{width:100%;text-align:left;padding:.5rem .75rem;border-radius:6px;border:none;background:transparent;color:#b5bac1;display:flex;align-items:center;gap:.5rem}.channel-sidebar li button.active,.channel-sidebar li button:hover{background:#404249;color:#f2f3f5}.channel-sidebar li .avatar{width:24px;height:24px;border-radius:50%}.channel-sidebar .placeholder,.dm-sidebar .placeholder,.message-list .placeholder{color:#939aa4;font-size:.9rem;text-align:center;padding:1rem 0}.chat-area{display:flex;flex-direction:column;background:#313338}.chat-header{padding:1rem 1.5rem;border-bottom:1px solid #2b2d31}.chat-header h2{font-size:1.1rem;margin-bottom:.25rem}.chat-header span{color:#b5bac1;font-size:.85rem}.message-list{flex:1 1;overflow-y:auto;padding:1rem 1.5rem;flex-direction:column}.message,.message-list{display:flex;gap:.75rem}.message>img{width:40px;height:40px;border-radius:50%}.message header{display:flex;align-items:baseline;gap:.5rem}.message header span{color:#72767d;font-size:.75rem}.message p,.message-content{color:#dbdee1;white-space:pre-wrap}.message-content{line-height:1.4}.message-placeholder{color:#939aa4}.message-text{white-space:pre-wrap}.mention{background:#3a3c43;padding:0 .25rem;border-radius:3px;font-weight:600;display:inline-flex;align-items:center;gap:.25rem}.mention-user{color:#f2f3f5}.mention-role{color:#f7c67f}.mention-channel{color:#5da8ff}.mention-everyone{color:#f47fff}.message-attachments{display:flex;flex-direction:column;gap:.75rem;margin-top:.5rem}.message-attachment{display:flex;flex-direction:column;gap:.35rem}.message-attachment.image{max-width:min(480px,100%)}.message-attachment.image img{width:100%;border-radius:6px;object-fit:contain}.message-attachment.image figcaption{font-size:.75rem;color:#b5bac1}.message-attachment.audio,.message-attachment.video{max-width:min(520px,100%)}.message-attachment audio,.message-attachment video{width:100%;border-radius:6px;background:#000}.message-attachment.file a{color:#00a8fc;word-break:break-word}.embed-content a,.embed-footer a,.message-content a{color:#00a8fc;text-decoration:underline}.custom-emoji{width:24px;height:24px;vertical-align:middle;display:inline-block}.embed{margin-top:.5rem;display:flex;border-radius:4px;overflow:hidden;background:#2f3136;border:1px solid rgba(0,0,0,.2)}.embed-color{width:4px}.embed-content{padding:.75rem 1rem;display:flex;flex-direction:column;gap:.5rem;width:100%}.embed-author{display:flex;align-items:center;gap:.5rem;font-size:.85rem;color:#b5bac1}.embed-author img{width:20px;height:20px;border-radius:50%}.embed-title{font-weight:600;font-size:1rem;color:#f2f3f5}.embed-text{color:#dbdee1;line-height:1.35;white-space:pre-wrap}.embed-fields{display:grid;grid-gap:.5rem;gap:.5rem;grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}.embed-field{display:flex;flex-direction:column;gap:.25rem;padding:.25rem 0}.embed-field.inline{grid-column:span 1}.embed-field:not(.inline){grid-column:1/-1}.embed-field-name{font-size:.75rem;font-weight:600;color:#b5bac1;text-transform:uppercase}.embed-field-value{color:#f2f3f5;white-space:pre-wrap;line-height:1.35}.embed-image{width:100%;border-radius:4px;max-height:320px;object-fit:contain}.embed-thumbnail{width:80px;height:80px;object-fit:cover;border-radius:4px;align-self:flex-end}.embed-video{width:100%;border-radius:4px;background:#000}.embed-footer{display:flex;align-items:center;gap:.5rem;color:#b5bac1;font-size:.75rem}.embed-footer img{width:16px;height:16px;border-radius:50%}.message-composer{padding:1rem 1.5rem;border-top:1px solid #2b2d31}.message-composer form{display:flex;gap:.75rem;background:#383a40;border-radius:12px;padding:.75rem;align-items:flex-end}.message-composer textarea{flex:1 1;resize:none;background:transparent;border:none;color:#f2f3f5}.message-composer button{background:#5865f2;border:none;border-radius:8px;padding:.6rem 1rem;font-weight:600;color:#fff}.message-composer button:disabled{opacity:.5;cursor:not-allowed}.dm-sidebar{background:#2b2d31;border-left:1px solid #1e1f22;display:flex;flex-direction:column}.dm-sidebar header{padding:1rem;border-bottom:1px solid #1e1f22}.dm-sidebar ul{flex:1 1;overflow-y:auto;display:flex;flex-direction:column;gap:.25rem;padding:.75rem}.dm-sidebar li button{width:100%;display:flex;align-items:center;gap:.5rem;border:none;border-radius:6px;padding:.5rem .75rem;background:transparent;color:#b5bac1;text-align:left}.dm-sidebar li button.active,.dm-sidebar li button:hover{background:#404249;color:#f2f3f5}.dm-sidebar .avatar{width:28px;height:28px;border-radius:50%}@media (max-width:1200px){.app-shell{grid-template-columns:72px 240px 1fr}.dm-sidebar{display:none}}@media (max-width:900px){.app-shell{grid-template-columns:72px 1fr}.channel-sidebar{display:none}}@media (max-width:640px){.app-shell{grid-template-columns:1fr}.server-sidebar{display:none}.chat-header{padding:1rem}.message-composer{padding:.75rem}}