:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;color:#e8eaf0;background:#17191f;--panel:#20232b;--panel2:#2a2d37;--muted:#8d93a3;--accent:#7c6cf2}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 65% 15%,#292146 0,#17191f 40%)}button,input{font:inherit}.app-shell{display:grid;grid-template-columns:72px 250px minmax(0,1fr);height:100vh;max-width:1500px;margin:auto;background:#1b1e25;box-shadow:0 20px 70px #0005}.servers{background:#14161b;padding:16px 12px;display:flex;align-items:center;flex-direction:column;gap:12px}.brand{width:44px;height:44px;border-radius:15px;background:linear-gradient(135deg,#8274ff,#6753df);display:grid;place-items:center;font-size:22px;font-weight:800;margin-bottom:10px}.server{border:0;width:44px;height:44px;border-radius:14px;color:#c9c8ff;background:#2b2f3a;font-size:22px;transition:.2s}.server:hover,.server.active{border-radius:13px;background:#7967f5;color:#fff}.server.purple{background:#393151}.server.green{color:#76daa8;background:#26362f}.channels{background:#20232b;position:relative;padding-top:4px}.workspace-name{height:60px;padding:18px 18px;border-bottom:1px solid #101217;font-weight:750}.workspace-name span{float:right;color:var(--muted)}.channel-section{display:flex;justify-content:space-between;align-items:center;padding:21px 16px 8px 18px;color:#777d8d;font-size:11px;font-weight:800;letter-spacing:.07em}.channel-section button{border:0;background:none;color:#aab0bf;font-size:20px;line-height:12px}.channel{display:block;width:calc(100% - 16px);margin:2px 8px;border:0;border-radius:7px;padding:10px;color:#aeb3c0;background:transparent;text-align:left}.channel span{display:inline-block;width:22px;color:#818797;font-size:20px}.channel:hover,.channel.selected{background:#343843;color:#fff}.voice-title{padding-top:25px}.user-panel{position:absolute;bottom:0;left:0;right:0;background:#191c22;padding:10px 12px;display:flex;align-items:center;gap:9px}.avatar{flex:0 0 36px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;background:#4c5261}.avatar.me{background:#d9699b}.avatar.blue{background:#5865d9}.avatar.orange{background:#d77d48}.user-meta{display:flex;flex-direction:column;min-width:0;flex:1;font-size:13px}.user-meta small{color:#6dd49a;font-size:11px}.user-panel button,.header-actions button{background:none;border:0;color:#9da3b1}.chat{display:flex;flex-direction:column;min-width:0}.chat-header{height:60px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #30333d;padding:0 24px}.topic{display:flex;gap:14px;align-items:center}.topic strong{font-size:16px}.topic span{font-size:12px;color:var(--muted);border-left:1px solid #424652;padding-left:14px}.header-actions{display:flex;gap:16px}.header-actions button{font-size:21px}.messages{overflow:auto;flex:1;padding:28px 7%;}.welcome{border-bottom:1px solid #363a45;padding-bottom:24px;margin-bottom:24px}.welcome-icon{width:58px;height:58px;background:#303541;border-radius:50%;display:grid;place-items:center;color:#c1c5d0;font-size:32px}.welcome h1{font-size:25px;margin:13px 0 5px}.welcome p{color:var(--muted);margin:0}.message{display:flex;gap:13px;margin:22px 0}.message-head{display:flex;gap:10px;align-items:baseline}.message-head span{font-size:11px;color:#757b8b}.message p{margin:5px 0;color:#d8dbe3;line-height:1.5}.composer{display:flex;gap:10px;align-items:center;margin:0 7% 22px;padding:10px 14px;background:#30343e;border-radius:10px}.composer input{background:none;border:0;outline:0;color:#fff;flex:1;min-width:0}.composer input::placeholder{color:#838a9a}.composer button{border:0;background:none;color:#aeb4c2;font-size:22px}.composer .attach{background:#656c7c;color:#1d2027;border-radius:50%;width:24px;height:24px;font-size:21px;line-height:18px}.composer .send{color:#8e82ff}.composer .send:hover{color:#b2aaff}@media(max-width:720px){.app-shell{grid-template-columns:58px 1fr}.channels{display:none}.messages{padding:22px 18px}.composer{margin-left:18px;margin-right:18px}.topic span{display:none}.header-actions{gap:8px}}