@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}:root{--onyx-bg: #0d0d0f;--onyx-surface: #111113;--onyx-elevated: #161619;--onyx-card: #161619;--onyx-hover: #1c1c1f;--onyx-active: #252528;--onyx-border: #2a2a2e;--onyx-border-light: #3d3d42;--onyx-text: #e4e4e7;--onyx-text-secondary: #a1a1aa;--onyx-text-muted: #71717a;--onyx-accent: #5b9bd5;--onyx-accent-hover: #6eb5ff;--onyx-green: #22c55e;--onyx-red: #ef4444;--onyx-red-hover: #dc2626;--bg-sidebar: var(--onyx-surface);--bg-main: var(--onyx-bg);--bg-card: var(--onyx-card);--bg-hover: var(--onyx-hover);--bg-active: var(--onyx-active);--text-primary: var(--onyx-text);--text-secondary: var(--onyx-text-secondary);--text-muted: var(--onyx-text-muted);--accent-blue: var(--onyx-accent);--accent-blue-hover: var(--onyx-accent-hover);--accent-green: var(--onyx-green);--accent-red: var(--onyx-red);--accent-red-hover: var(--onyx-red-hover);--border: var(--onyx-border)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#app{height:100%}body{font-family:Segoe UI,system-ui,-apple-system,sans-serif;background:var(--bg-main);color:var(--text-primary);line-height:1.5;-webkit-font-smoothing:antialiased}*::-webkit-scrollbar{width:8px;height:8px}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{background:#3f3f46e6;border-radius:999px}*::-webkit-scrollbar-thumb:hover{background:#52525b}*{scrollbar-width:thin;scrollbar-color:rgba(63,63,70,.9) transparent}a{color:var(--accent-blue);text-decoration:none}a:hover{text-decoration:underline;color:var(--accent-blue-hover)}button{font-family:inherit;cursor:pointer;border:none;background:none}.card{background:var(--onyx-card);border:1px solid var(--onyx-border-light);border-radius:12px}.btn{padding:8px 16px;border-radius:8px;font-size:14px;font-weight:500}.btn:not(:disabled){cursor:pointer}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:var(--onyx-accent);color:#fff}.btn-primary:not(:disabled):hover{background:var(--onyx-accent-hover)}.btn-secondary{background:var(--onyx-elevated);border:1px solid var(--onyx-border-light);color:var(--onyx-text)}.pageTitle{font-size:24px;font-weight:600;margin-bottom:4px}.pageSubtitle{font-size:14px;color:var(--onyx-text-secondary);margin-bottom:16px}.dataTable{width:100%;border-collapse:collapse;font-size:14px}.dataTable th{text-align:left;padding:12px 16px;color:var(--onyx-text-muted);font-weight:600;font-size:12px;text-transform:uppercase;background:#0003;border-bottom:1px solid var(--onyx-border)}.dataTable td{padding:12px 16px;border-bottom:1px solid var(--onyx-border)}.segment-picker{display:flex;gap:8px;background:var(--onyx-elevated);padding:4px;border-radius:999px;overflow-x:auto}.picker-choose{flex:0 0 auto;min-width:80px;padding:6px 16px;border-radius:999px;border:none;background:transparent;color:var(--onyx-text-secondary);font-size:12px;font-weight:500;display:flex;align-items:center;justify-content:center;text-transform:uppercase}.picker-choose.picked{background:var(--onyx-active);color:var(--onyx-text)}.sidebar{width:240px;min-width:240px;background:var(--bg-sidebar);display:flex;flex-direction:column;align-items:stretch;padding:12px 0}.sidebar-brand{display:flex;align-items:center;gap:8px;margin-bottom:24px;padding:0 16px}.brand-icon{display:flex;color:var(--text-primary)}.brand-text{font-weight:600;font-size:14px;color:var(--text-primary)}.sidebar-nav{flex:1;display:flex;flex-direction:column;gap:4px;width:100%}.sidebar-nav .nav-item{display:flex;align-items:center;gap:12px;padding:10px 16px;margin:0 8px;color:var(--text-secondary);border-radius:10px;text-decoration:none;font-size:14px;transition:background .15s,color .15s,transform .12s,box-shadow .15s,border-color .15s;position:relative;background-color:transparent;box-shadow:none;border:1px solid transparent}.sidebar-nav .nav-item:hover{background:var(--bg-hover);color:var(--text-primary)}.sidebar-nav .nav-item.active{background:linear-gradient(135deg,#1d2939,#111827);color:var(--text-primary);border-color:#94a3b899;box-shadow:0 0 0 1px #0f172ae6,0 8px 20px #0f172ab3}.sidebar-nav .nav-item.active:before{content:"";position:absolute;left:-2px;top:8px;bottom:8px;width:3px;border-radius:999px;background:linear-gradient(180deg,#38bdf8,#6366f1)}.sidebar-nav .nav-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;color:inherit}.sidebar-nav .nav-item:focus-visible{outline:none}.sidebar-nav .nav-item.nav-item--locked,.sidebar-nav .nav-item:disabled{opacity:.55;cursor:not-allowed}.sidebar-nav .nav-item.nav-item--locked:hover,.sidebar-nav .nav-item:disabled:hover{background:transparent;color:var(--text-secondary)}.sidebar-footer{display:flex;padding:12px 16px;border-top:1px solid var(--border)}.user-wrap{display:flex;align-items:center;gap:10px;width:100%}.user-avatar{width:32px;height:32px;border-radius:50%;background:var(--accent-blue);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;flex-shrink:0}.user-avatar.img{object-fit:cover;padding:0;background:none}.user-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.user-name{font-size:13px;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.logout-btn{font-size:11px;color:var(--onyx-accent);background:none;padding:0;text-align:left;cursor:pointer}.logout-btn:hover{text-decoration:underline}.header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background:var(--bg-main);border-bottom:1px solid var(--border);flex-wrap:wrap;gap:12px}.header-left{display:flex;align-items:center;gap:10px}.server-icon{color:var(--text-secondary);display:flex}.server-name{font-weight:600;font-size:16px;color:var(--text-primary)}.header-badges{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.badge{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--text-secondary)}.badge-dot{width:8px;height:8px;border-radius:50%;background:var(--accent-green)}.status-online{color:var(--accent-green)}.header-actions{display:flex;align-items:center;gap:12px}.icon-btn{color:var(--text-secondary);padding:8px;border-radius:8px;display:flex}.icon-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.shut-down-wrap{display:flex;align-items:stretch;border-radius:8px;overflow:hidden}.btn-shut-down{background:var(--accent-red);color:#fff;font-size:14px;font-weight:500;padding:8px 16px}.btn-shut-down:hover{background:var(--accent-red-hover)}.btn-shut-down-dropdown{background:var(--accent-red);color:#fff;padding:8px 6px;display:flex;align-items:center}.btn-shut-down-dropdown:hover{background:var(--accent-red-hover)}.appLayout{display:flex;min-height:100vh;background:var(--bg-main)}.mainArea{flex:1;display:flex;flex-direction:column;min-width:0}.contentArea{flex:1;padding:0 24px 24px}.loginPage{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--onyx-bg);padding:24px}.loginCard{width:100%;max-width:380px;padding:40px;text-align:center}.loginTitle{font-size:28px;font-weight:700;margin-bottom:8px;color:var(--onyx-text)}.loginSubtitle{font-size:14px;color:var(--onyx-text-secondary);margin-bottom:28px}.btn-discord{display:inline-flex;align-items:center;justify-content:center;gap:12px;width:100%;padding:14px 24px;background:#5865f2;color:#fff;font-size:16px;font-weight:600;border-radius:8px;text-decoration:none;transition:background .2s}.btn-discord:hover{background:#4752c4;color:#fff;text-decoration:none}.discord-icon{width:24px;height:24px;flex-shrink:0}.error-msg{margin-top:16px;font-size:14px;color:var(--onyx-red)}.type-badge{font-size:12px;padding:4px 10px;border-radius:20px}.type-badge.warn{background:#eab30833;color:#eab308}.type-badge.mute{background:#71717a33;color:var(--onyx-text-muted)}.type-badge.kick,.type-badge.ban{background:#ef444433;color:var(--onyx-red)}