:root{--bg-primary:#313338;--bg-secondary:#2b2d31;--bg-tertiary:#1e1f22;--bg-secondary-alt:#232428;--text-normal:#dbdee1;--text-muted:#828a93;--header-primary:#f2f3f5;--header-secondary:#b5bac1;--bg-floating:#111214;--brand-blurple:#5865f2;--brand-blurple-hover:#4752c4;--brand-blurple-active:#3c45a5;--status-danger:#da373c;--status-danger-hover:#a12828;--status-success:#23a559;--background-modifier-hover:#ffffff14;--background-modifier-active:#ffffff1f;--background-modifier-selected:#ffffff29}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-primary);color:var(--text-normal);-webkit-font-smoothing:antialiased;min-height:100vh;font-family:Outfit,gg sans,Helvetica Neue,Helvetica,Arial,sans-serif;overflow:hidden}.app-container{width:100vw;height:100vh;display:flex}.server-list-sidebar{background-color:var(--bg-tertiary);flex-direction:column;flex-shrink:0;align-items:center;gap:8px;width:72px;padding:12px 0 120px;display:flex;position:relative;overflow-y:auto}.server-list-sidebar::-webkit-scrollbar{display:none}.server-list-sidebar{-ms-overflow-style:none;scrollbar-width:none}.server-list-item{background-color:var(--bg-primary);cursor:pointer;width:48px;height:48px;min-height:48px;color:var(--text-normal);border-radius:24px;flex-shrink:0;justify-content:center;align-items:center;transition:all .2s;display:flex;position:relative;overflow:hidden}.server-list-item img{object-fit:cover;width:100%;height:100%}.server-list-item:hover,.server-list-item.active{background-color:var(--brand-blurple);color:#fff;border-radius:16px}.server-list-item.active{background-color:var(--brand-blurple);color:#fff;outline:2px solid var(--brand-blurple);outline-offset:3px;border-radius:16px}@keyframes tooltipFade{0%{opacity:0;transform:translateY(-50%)scale(.9)translate(-10px)}to{opacity:1;transform:translateY(-50%)scale(1)translate(0)}}.top-navbar{background-color:var(--bg-primary);border-bottom:1px solid var(--bg-tertiary);z-index:10;flex-shrink:0;align-items:center;height:60px;padding:0 16px;display:flex;box-shadow:0 1px 2px #0000001a}.top-navbar-title{color:var(--header-primary);align-items:center;gap:8px;margin-right:24px;font-size:16px;font-weight:600;display:flex}.top-navbar-tabs{align-items:center;gap:16px;height:100%;display:flex}.top-navbar-tab{height:100%;color:var(--header-secondary);cursor:pointer;border-bottom:2px solid #0000;align-items:center;gap:8px;padding:0 8px;font-weight:600;text-decoration:none;transition:color .2s,border-color .2s;display:flex}.top-navbar-tab:hover{color:var(--text-normal)}.top-navbar-tab.active{color:var(--header-primary);border-bottom-color:var(--brand-blurple)}.user-profile-floating{background-color:var(--bg-tertiary);z-index:20;border-top:1px solid #ffffff0d;flex-direction:column;align-items:center;gap:12px;width:100%;padding:12px 0;display:flex;position:absolute;bottom:0;left:0;box-shadow:0 -2px 10px #0003}.main-content{background-color:var(--bg-primary);flex-direction:column;flex:1;display:flex;overflow:hidden}.main-header{border-bottom:1px solid var(--bg-tertiary);height:48px;color:var(--header-primary);align-items:center;padding:8px 16px;font-weight:600;display:flex;box-shadow:0 1px 2px #0000001a}.main-scrollable{flex:1;padding:24px;overflow-y:auto}h1,h2,h3,h4{color:var(--header-primary)}h1{margin-bottom:8px;font-size:24px;font-weight:700}h2{margin-bottom:16px;font-size:20px;font-weight:600}h3{text-transform:uppercase;color:var(--header-secondary);letter-spacing:.2px;margin-bottom:8px;font-size:16px;font-weight:600}p{color:var(--text-normal);line-height:1.5}.discord-card{background-color:var(--bg-secondary);border:1px solid #ffffff05;border-radius:12px;margin-bottom:16px;padding:20px;transition:all .25s cubic-bezier(.2,.8,.2,1);box-shadow:0 4px 6px #0000001a,0 1px 3px #00000014}.discord-card-hoverable{cursor:pointer}.discord-card:hover{border-color:#ffffff0d;transform:translateY(-2px);box-shadow:0 8px 15px #0003,0 4px 6px #0000001a}.btn{cursor:pointer;border:none;border-radius:4px;outline:none;justify-content:center;align-items:center;gap:8px;min-height:32px;padding:8px 16px;font-family:inherit;font-size:14px;font-weight:500;text-decoration:none;transition:all .2s cubic-bezier(.2,.8,.2,1);display:inline-flex}.btn-primary{background-color:var(--brand-blurple);color:#fff}.btn-primary:hover{background-color:var(--brand-blurple-hover);transform:translateY(-1px);box-shadow:0 4px 8px #5865f24d}.btn-primary:active{background-color:var(--brand-blurple-active)}.btn-danger{background-color:var(--status-danger);color:#fff}.btn-danger:hover{background-color:var(--status-danger-hover);transform:translateY(-1px);box-shadow:0 4px 8px #da373c4d}.btn-outline{color:var(--text-normal);border:1px solid var(--text-muted);background-color:#0000}.btn-outline:hover{border-color:var(--header-primary);color:var(--header-primary)}.btn-icon{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;outline:none;justify-content:center;align-items:center;padding:4px;display:flex}.btn-icon:hover{background-color:var(--background-modifier-hover);color:var(--text-normal)}.grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;display:grid}.server-icon{object-fit:cover;background-color:var(--bg-tertiary);border-radius:50%;width:48px;height:48px;transition:border-radius .2s}.server-icon:hover{border-radius:16px}.badge{text-transform:uppercase;border-radius:4px;padding:4px 8px;font-size:12px;font-weight:600}.badge-blurple{background:var(--brand-blurple);color:#fff}.badge-green{background:var(--status-success);color:#fff}.badge-gray{background:var(--bg-tertiary);color:var(--text-normal)}.user-profile{border-radius:4px;align-items:center;gap:8px;padding:4px;display:flex}.user-profile:hover{background-color:var(--background-modifier-hover)}.avatar{border-radius:50%;width:32px;height:32px}.user-details{flex-direction:column;font-size:14px;line-height:1.2;display:flex}.user-name{color:var(--header-primary);font-weight:600}.user-status{color:var(--text-muted);font-size:12px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.animate-fade-in{animation:.2s ease-in-out forwards fadeIn}.delay-1{opacity:0;animation:.3s ease-in-out 50ms forwards fadeIn}.delay-2{opacity:0;animation:.3s ease-in-out .1s forwards fadeIn}.delay-3{opacity:0;animation:.3s ease-in-out .15s forwards fadeIn}
