:root{--neon-cyan: #00f5ff;--neon-purple: #b300ff;--neon-green: #00ff88;--neon-amber: #ffaa00;--neon-pink: #ff006e;--neon-blue: #0066ff;--bg-dark: #0a0a0f;--bg-darker: #050508;--bg-card: rgba(255, 255, 255, .04);--bg-card-hover: rgba(255, 255, 255, .07);--bg-input: rgba(255, 255, 255, .06);--glass: rgba(255, 255, 255, .05);--glass-border: rgba(255, 255, 255, .1);--glass-blur: 20px;--text-primary: #f0f0ff;--text-secondary: rgba(240, 240, 255, .6);--text-muted: rgba(240, 240, 255, .35);--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--sidebar-width: 240px;--header-height: 64px;--font-sans: "Inter", system-ui, sans-serif;--font-mono: "JetBrains Mono", monospace}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px}body{font-family:var(--font-sans);background:var(--bg-dark);color:var(--text-primary);min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 80% 50% at 20% 20%,rgba(179,0,255,.08) 0%,transparent 60%),radial-gradient(ellipse 60% 40% at 80% 80%,rgba(0,245,255,.06) 0%,transparent 60%);pointer-events:none;z-index:0}#root{position:relative;z-index:1}.glass{background:var(--glass);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border)}.glass-card{background:var(--bg-card);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);border-radius:var(--radius-lg);transition:background .2s,border-color .2s,transform .2s}.glass-card:hover{background:var(--bg-card-hover);border-color:#ffffff2e;transform:translateY(-1px)}.neon-cyan{color:var(--neon-cyan);text-shadow:0 0 20px rgba(0,245,255,.5)}.neon-purple{color:var(--neon-purple);text-shadow:0 0 20px rgba(179,0,255,.5)}.neon-green{color:var(--neon-green);text-shadow:0 0 20px rgba(0,255,136,.5)}.neon-amber{color:var(--neon-amber);text-shadow:0 0 20px rgba(255,170,0,.5)}.btn{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border-radius:var(--radius-sm);border:1px solid transparent;font-family:var(--font-sans);font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;text-decoration:none}.btn-primary{background:linear-gradient(135deg,var(--neon-purple),var(--neon-cyan));color:#fff;border:none;box-shadow:0 0 20px #b300ff4d}.btn-primary:hover{box-shadow:0 0 30px #b300ff80;transform:translateY(-1px)}.btn-ghost{background:transparent;color:var(--text-secondary);border-color:var(--glass-border)}.btn-ghost:hover{background:var(--bg-card);color:var(--text-primary)}.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:100px;font-size:11px;font-weight:600;letter-spacing:.5px}.badge-online{background:#00ff8826;color:var(--neon-green);border:1px solid rgba(0,255,136,.3)}.badge-offline{background:#ffffff0d;color:var(--text-muted);border:1px solid var(--glass-border)}.badge-active{background:#00f5ff26;color:var(--neon-cyan);border:1px solid rgba(0,245,255,.3)}.badge-warning{background:#ffaa0026;color:var(--neon-amber);border:1px solid rgba(255,170,0,.3)}.badge-error{background:#ff006e26;color:var(--neon-pink);border:1px solid rgba(255,0,110,.3)}.dot{width:6px;height:6px;border-radius:50%;display:inline-block}.dot-online{background:var(--neon-green);box-shadow:0 0 6px var(--neon-green);animation:pulse-dot 2s infinite}.dot-offline{background:var(--text-muted)}@keyframes pulse-neon{0%,to{opacity:1}50%{opacity:.6}}@keyframes pulse-dot{0%,to{box-shadow:0 0 6px var(--neon-green)}50%{box-shadow:0 0 12px var(--neon-green),0 0 20px #0f86}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes shimmer{0%{background-position:-200% center}to{background-position:200% center}}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn .3s ease forwards}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#fff3}.app-layout{display:grid;grid-template-columns:var(--sidebar-width) 1fr;grid-template-rows:var(--header-height) 1fr;min-height:100vh}.main-content{grid-column:2;grid-row:2;padding:var(--space-6);overflow-y:auto;max-height:calc(100vh - var(--header-height))}h1{font-size:28px;font-weight:700;letter-spacing:-.5px}h2{font-size:20px;font-weight:600}h3{font-size:16px;font-weight:600}p{color:var(--text-secondary);line-height:1.6}.text-sm{font-size:13px}.text-xs{font-size:11px}.text-mono{font-family:var(--font-mono)}.text-muted{color:var(--text-muted)}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-4)}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4)}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4)}@media (max-width: 1200px){.grid-4{grid-template-columns:repeat(2,1fr)}}@media (max-width: 768px){.grid-3,.grid-2{grid-template-columns:1fr}}