@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600;700&display=swap";
:root{--bg-primary:#080c14;--bg-secondary:#0d1320;--bg-card:#111827;--bg-card-hover:#1a2332;--bg-input:#0d1320;--border:#1e2d3d;--border-light:#243447;--text-primary:#e2e8f0;--text-secondary:#89a;--text-muted:#4a5568;--accent-blue:#3b82f6;--accent-blue-glow:#3b82f640;--accent-purple:#8b5cf6;--accent-cyan:#06b6d4;--accent-green:#10b981;--accent-red:#ef4444;--accent-yellow:#f59e0b;--accent-orange:#f97316;--up:#ef4444;--down:#10b981;--up-bg:#ef444415;--down-bg:#10b98115;--up-border:#ef444430;--down-border:#10b98130;--header-h:52px;--mobile-nav-h:56px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--bg-primary);height:100%;color:var(--text-primary);-webkit-font-smoothing:antialiased;font-family:Inter,-apple-system,sans-serif;font-size:14px;line-height:1.5}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}::-webkit-scrollbar-thumb:hover{background:var(--accent-blue)}.font-mono{font-family:JetBrains Mono,Courier New,monospace}.up{color:var(--up)!important}.down{color:var(--down)!important}.neutral{color:var(--text-secondary)!important}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:20px}.card-sm{border-radius:8px;padding:14px}@keyframes pulse-glow{0%,to{box-shadow:0 0 4px var(--accent-blue-glow)}50%{box-shadow:0 0 12px var(--accent-blue-glow), 0 0 24px var(--accent-blue-glow)}}@keyframes fade-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes toast-slide-in{0%{opacity:0;transform:translate(50px)scale(.95)}to{opacity:1;transform:translate(0)scale(1)}}@keyframes toast-slide-out{0%{opacity:1;transform:translate(0)scale(1)}to{opacity:0;transform:translate(50px)scale(.95)}}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.animate-fade-in{animation:.3s ease-out fade-in}.animate-slide-up{animation:.4s ease-out slide-up}.animate-toast-in{animation:.4s cubic-bezier(.16,1,.3,1) forwards toast-slide-in}.animate-toast-out{animation:.3s cubic-bezier(.16,1,.3,1) forwards toast-slide-out}.live-dot{background:var(--accent-green);border-radius:50%;width:6px;height:6px;animation:2s infinite pulse-glow;display:inline-block}.btn{cursor:pointer;white-space:nowrap;border:1px solid #0000;border-radius:6px;align-items:center;gap:6px;padding:8px 16px;font-size:13px;font-weight:600;transition:all .15s;display:inline-flex}.btn-primary{background:var(--accent-blue);color:#fff}.btn-primary:hover{background:#2563eb}.btn-danger{background:var(--up);color:#fff}.btn-danger:hover{background:#dc2626}.btn-success{background:var(--down);color:#fff}.btn-success:hover{background:#059669}.btn-ghost{color:var(--text-secondary);border-color:var(--border);background:0 0}.btn-ghost:hover{background:var(--bg-card-hover);color:var(--text-primary)}.badge{letter-spacing:.5px;border-radius:4px;align-items:center;gap:4px;padding:2px 8px;font-size:11px;font-weight:700;display:inline-flex}.badge-up{background:var(--up-bg);color:var(--up);border:1px solid var(--up-border)}.badge-down{background:var(--down-bg);color:var(--down);border:1px solid var(--down-border)}.badge-neutral{color:var(--text-secondary);background:#1e2d3d}.badge-blue{color:var(--accent-blue);background:#3b82f620;border:1px solid #3b82f630}.badge-purple{color:var(--accent-purple);background:#8b5cf620;border:1px solid #8b5cf630}.badge-green{background:var(--down-bg);color:var(--down);border:1px solid var(--down-border)}.badge-red{background:var(--up-bg);color:var(--up);border:1px solid var(--up-border)}.badge-yellow{color:var(--accent-yellow);background:#f59e0b20;border:1px solid #f59e0b30}.input{background:var(--bg-input);border:1px solid var(--border);color:var(--text-primary);border-radius:6px;outline:none;width:100%;padding:8px 12px;font-family:JetBrains Mono,monospace;font-size:13px;transition:border-color .15s}.input:focus{border-color:var(--accent-blue)}.input::placeholder{color:var(--text-muted)}.data-table{border-collapse:collapse;width:100%}.data-table th{text-align:left;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);border-bottom:1px solid var(--border);white-space:nowrap;padding:10px 12px;font-size:11px;font-weight:600}.data-table td{border-bottom:1px solid var(--border-light);padding:12px;font-size:13px}.data-table tr:hover td{background:var(--bg-card-hover)}.data-table tr:last-child td{border-bottom:none}.progress-bar{background:var(--border);border-radius:2px;height:4px;overflow:hidden}.progress-fill{border-radius:2px;height:100%;transition:width .5s}.divider{border:none;border-top:1px solid var(--border);margin:16px 0}.stats-grid{gap:12px;display:grid}.stat-item{flex-direction:column;gap:4px;display:flex}.stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:11px}.stat-value{font-family:JetBrains Mono,monospace;font-size:20px;font-weight:700}.stat-sub{color:var(--text-secondary);font-size:11px}.log-console{border:1px solid var(--border);background:#050810;border-radius:8px;padding:12px;font-family:JetBrains Mono,monospace;font-size:11.5px;line-height:1.6;overflow-y:auto}.log-entry{align-items:flex-start;gap:8px;display:flex}.log-ts{color:var(--text-muted);flex-shrink:0}.log-level-SUCCESS{color:var(--accent-green);flex-shrink:0}.log-level-ERROR{color:var(--up);flex-shrink:0}.log-level-WARN{color:var(--accent-yellow);flex-shrink:0}.log-level-INFO{color:var(--accent-blue);flex-shrink:0}.log-msg{color:var(--text-secondary)}.toggle{background:var(--border);cursor:pointer;border-radius:12px;align-items:center;width:44px;height:24px;transition:background .2s;display:inline-flex;position:relative}.toggle.on{background:var(--accent-green)}.toggle-thumb{background:#fff;border-radius:50%;width:18px;height:18px;transition:left .2s;position:absolute;left:3px;box-shadow:0 1px 4px #0000004d}.toggle.on .toggle-thumb{left:23px}.skeleton{background:linear-gradient(90deg, var(--bg-card) 25%, var(--bg-card-hover) 50%, var(--bg-card) 75%);background-size:200% 100%;border-radius:4px;animation:1.5s infinite skeleton-wave}@keyframes skeleton-wave{0%{background-position:200% 0}to{background-position:-200% 0}}@media (max-width:768px){.card{padding:14px}.stat-value{font-size:16px}.data-table th,.data-table td{padding:8px;font-size:12px}}
