@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root{--bg-color:#0f172a;--panel-bg:#1e293bb3;--panel-border:#ffffff1a;--text-main:#f8fafc;--text-muted:#94a3b8;--accent:#3b82f6;--accent-hover:#2563eb;--danger:#ef4444;--success:#10b981}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-main);background-image:radial-gradient(at 0 0,#3b82f626 0,#0000 50%),radial-gradient(at 100% 100%,#10b9811a 0,#0000 50%);min-height:100vh;font-family:Inter,sans-serif;overflow-x:hidden}.glass-panel{background:var(--panel-bg);-webkit-backdrop-filter:blur(12px);border:1px solid var(--panel-border);border-radius:16px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.app-container{width:100vw;height:100vh;display:flex}.sidebar{border-right:1px solid var(--panel-border);background:#0f172acc;flex-direction:column;gap:24px;width:280px;padding:24px;display:flex}.logo-container{color:var(--text-main);align-items:center;gap:12px;font-size:1.5rem;font-weight:700;display:flex}.nav-links{flex-direction:column;gap:8px;display:flex}.nav-link{color:var(--text-muted);border-radius:12px;align-items:center;gap:12px;padding:12px 16px;font-weight:500;text-decoration:none;transition:all .2s;display:flex}.nav-link:hover,.nav-link.active{color:var(--accent);background:#3b82f61a}.main-content{flex:1;padding:32px;overflow-y:auto}.page-header{margin-bottom:32px}.page-title{margin-bottom:8px;font-size:2rem;font-weight:700}.page-subtitle{color:var(--text-muted)}.dashboard-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;display:grid}.stat-card{align-items:center;gap:16px;padding:24px;transition:transform .2s;display:flex}.stat-card:hover{transform:translateY(-2px)}.stat-icon{width:48px;height:48px;color:var(--accent);background:#3b82f61a;border-radius:12px;justify-content:center;align-items:center;display:flex}.stat-info h3{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px;font-size:.875rem}.stat-info p{font-size:1.5rem;font-weight:600}.btn{cursor:pointer;border:none;border-radius:8px;align-items:center;gap:8px;padding:8px 16px;font-weight:500;transition:all .2s;display:inline-flex}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover)}.status-badge{border-radius:999px;align-items:center;gap:6px;padding:4px 12px;font-size:.75rem;font-weight:600;display:inline-flex}.status-online{color:var(--success);background:#10b9811a}.status-offline{color:var(--danger);background:#ef44441a}.dot{border-radius:50%;width:6px;height:6px}.dot.online{background:var(--success);box-shadow:0 0 8px var(--success)}.dot.offline{background:var(--danger);box-shadow:0 0 8px var(--danger)}.server-list{flex-direction:column;gap:16px;display:flex}.server-item{justify-content:space-between;align-items:center;padding:20px;display:flex}.event-feed{max-height:400px;padding-right:8px;overflow-y:auto}.event-feed::-webkit-scrollbar{width:6px}.event-feed::-webkit-scrollbar-thumb{background:var(--panel-border);border-radius:3px}.event-item{border-bottom:1px solid var(--panel-border);gap:16px;padding:16px;animation:.3s ease-out forwards slideIn;display:flex}@keyframes slideIn{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}.device-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;display:grid}.device-card{text-align:center;flex-direction:column;align-items:center;gap:12px;padding:20px;display:flex}.toggle-switch{cursor:pointer;background:#ffffff1a;border-radius:13px;width:50px;height:26px;transition:all .3s;position:relative}.toggle-switch.active{background:var(--success)}.toggle-knob{background:#fff;border-radius:50%;width:22px;height:22px;transition:all .3s cubic-bezier(.4,0,.2,1);position:absolute;top:2px;left:2px}.toggle-switch.active .toggle-knob{transform:translate(24px)}