*{margin:0;padding:0;box-sizing:border-box}
body{font-family:Inter, sans-serif;background:#313338;color:#fff}
.app{display:flex;height:100vh}

/* Servers */
.servers{width:72px;background:#1e1f22;display:flex;flex-direction:column;align-items:center;padding:10px;gap:10px}
.server{width:48px;height:48px;background:#2b2d31;border-radius:50%;transition:.2s;display:flex;align-items:center;justify-content:center;cursor:pointer}
.server:hover{border-radius:16px;background:#5865F2}
.server.active{background:#5865F2;border-radius:16px}
.server.add{color:#aaa;font-size:22px}

/* Sidebar */
.sidebar{width:260px;background:#2b2d31;display:flex;flex-direction:column;padding:10px}
.search input{width:100%;padding:8px;border:none;border-radius:6px;background:#1e1f22;color:#fff}
.menu{margin-top:10px}
.item{padding:8px;border-radius:6px;color:#b5bac1;cursor:pointer}
.item:hover{background:#35373c}
.item.active{background:#404249;color:#fff}
.dm{margin-top:15px}
.dm .title{font-size:12px;color:#888;margin-bottom:5px}
.user{display:flex;align-items:center;gap:8px;padding:6px;border-radius:6px;cursor:pointer}
.user img{width:32px;height:32px;border-radius:50%}
.user:hover{background:#35373c}
.user.active{background:#404249}
.profile{margin-top:auto;background:#1e1f22;padding:10px;border-radius:6px;display:flex;gap:10px;align-items:center}
.profile img{width:36px;height:36px;border-radius:50%}
.profile .sub{font-size:12px;color:#aaa}

/* Main */
.main{flex:1;display:flex;flex-direction:column}
.topbar{height:50px;background:#2b2d31;display:flex;align-items:center;justify-content:space-between;padding:0 15px}
.tabs span{margin-right:15px;color:#b5bac1;cursor:pointer}
.tabs .active{color:#fff}
button{background:#5865F2;border:none;padding:6px 12px;border-radius:6px;color:#fff;cursor:pointer}
.list{padding:15px}
.friend{display:flex;align-items:center;gap:10px;padding:10px;border-bottom:1px solid #3a3c41}
.friend img{width:40px;height:40px;border-radius:50%}
.status{font-size:12px;color:#aaa}
.status.dnd{color:#f23f42}

/* Right */
.right{width:300px;background:#2b2d31;padding:15px}
.card{margin-top:20px;background:#1e1f22;padding:15px;border-radius:8px}
.card .desc{color:#aaa;font-size:13px;margin-top:5px}
