:root{--bg-primary: #080d1a;--bg-secondary: #0d1424;--bg-card: #111827;--bg-card-hover: #1a2235;--bg-elevated: #1e2a3f;--border-color: #1e2d4a;--border-accent: #00d4ff33;--cyan: #00d4ff;--cyan-dim: #00d4ff33;--cyan-glow: #00d4ff80;--green: #00ff88;--green-dim: #00ff8833;--yellow: #ffcc00;--yellow-dim: #ffcc0033;--red: #ff4444;--red-dim: #ff444433;--orange: #ff8c00;--purple: #8b5cf6;--speed-high: #00ff88;--speed-low: #ffcc00;--speed-stop: #ff4444;--text-primary: #e0e6f0;--text-secondary: #8fa8c8;--text-muted: #4a6080;--text-accent: #00d4ff;--font-main: "Inter", -apple-system, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace;--radius-sm: 6px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--shadow-card: 0 4px 24px rgba(0, 0, 0, .4);--glow-cyan: 0 0 20px rgba(0, 212, 255, .3);--glow-green: 0 0 30px rgba(0, 255, 136, .4);--glow-red: 0 0 30px rgba(255, 68, 68, .4);--glow-yellow: 0 0 30px rgba(255, 204, 0, .4);--transition-fast: .15s ease;--transition-med: .3s ease;--transition-slow: .6s ease}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden}body{font-family:var(--font-main);background-color:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5}#root{height:100vh;display:flex;flex-direction:column;overflow:hidden}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:2px}::-webkit-scrollbar-thumb:hover{background:var(--cyan-dim)}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2}.mono{font-family:var(--font-mono)}.text-accent{color:var(--text-accent)}.text-muted{color:var(--text-muted)}.text-secondary{color:var(--text-secondary)}.card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);overflow:hidden}.card-header{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--border-color);font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary)}.card-body{padding:16px}.status-dot{width:8px;height:8px;border-radius:50%;display:inline-block}.status-dot.online{background:var(--green);box-shadow:0 0 6px var(--green);animation:pulse-dot 2s infinite}.status-dot.offline{background:var(--red)}.status-dot.connecting{background:var(--yellow);animation:pulse-dot 1s infinite}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.4}}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{0%{transform:translate(-10px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes pulse-ring{0%{box-shadow:0 0 #00d4ff66}70%{box-shadow:0 0 0 15px #00d4ff00}to{box-shadow:0 0 #00d4ff00}}@keyframes speed-glow-high{0%,to{box-shadow:var(--glow-green)}50%{box-shadow:0 0 50px #0f8c}}@keyframes speed-glow-stop{0%,to{box-shadow:var(--glow-red)}50%{box-shadow:0 0 60px #ff4444e6}}@keyframes alert-flash{0%,to{opacity:1}50%{opacity:.6}}@keyframes scanline{0%{transform:translateY(-100%)}to{transform:translateY(100vh)}}.scan-effect:after{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);opacity:.6;animation:scanline 3s linear infinite;pointer-events:none}.progress-bar{height:4px;background:var(--bg-elevated);border-radius:2px;overflow:hidden}.progress-fill{height:100%;border-radius:2px;transition:width var(--transition-med)}.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:4px;font-size:10px;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.tooltip{position:relative}.tooltip:after{content:attr(data-tip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%);background:var(--bg-elevated);border:1px solid var(--border-color);color:var(--text-primary);padding:4px 10px;border-radius:var(--radius-sm);font-size:11px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity var(--transition-fast);z-index:100}.tooltip:hover:after{opacity:1}.btn{display:inline-flex;align-items:center;gap:8px;padding:8px 18px;border-radius:var(--radius-md);font-family:var(--font-main);font-size:13px;font-weight:600;cursor:pointer;transition:all var(--transition-fast);border:1px solid transparent;text-transform:uppercase;letter-spacing:.06em}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:var(--cyan);color:#000;border-color:var(--cyan)}.btn-primary:hover:not(:disabled){background:#0ef;box-shadow:var(--glow-cyan)}.btn-danger{background:transparent;color:var(--red);border-color:var(--red)}.btn-danger:hover:not(:disabled){background:var(--red-dim);box-shadow:var(--glow-red)}.btn-success{background:var(--green);color:#000;border-color:var(--green)}.btn-success:hover:not(:disabled){background:#0fa;box-shadow:var(--glow-green)}.btn-ghost{background:transparent;color:var(--text-secondary);border-color:var(--border-color)}.btn-ghost:hover:not(:disabled){background:var(--bg-elevated);color:var(--text-primary)}@keyframes toast-slide-in{0%{opacity:0;transform:translate(110%) scale(.95)}to{opacity:1;transform:translate(0) scale(1)}}@keyframes toast-slide-out{0%{opacity:1;transform:translate(0) scale(1);max-height:200px;margin-bottom:0}to{opacity:0;transform:translate(110%) scale(.92);max-height:0;margin-bottom:-8px;padding-top:0;padding-bottom:0}}@keyframes panel-drop{0%{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes critical-pulse{0%,to{opacity:0}50%{opacity:1}}@keyframes bell-shake{0%{transform:rotate(0)}20%{transform:rotate(-12deg)}40%{transform:rotate(10deg)}60%{transform:rotate(-8deg)}80%{transform:rotate(6deg)}to{transform:rotate(0)}}.toast{will-change:transform,opacity}.toast-enter{animation:toast-slide-in .3s cubic-bezier(.16,1,.3,1) both}.toast-exit{animation:toast-slide-out .35s cubic-bezier(.55,0,1,.45) forwards;overflow:hidden;pointer-events:none}@keyframes calibration-sweep{0%{background-position:200% center}to{background-position:-200% center}}@keyframes calibration-pulse-glow{0%,to{box-shadow:0 0 8px #00d4ff66}50%{box-shadow:0 0 20px #00d4ffe6}}@keyframes calibration-complete-flash{0%{opacity:0;transform:scale(.9)}30%{opacity:1;transform:scale(1.04)}to{opacity:1;transform:scale(1)}}.calibration-bar-fill{background:linear-gradient(90deg,var(--cyan) 0%,#00eeff 40%,var(--cyan) 60%,#0088bb 100%);background-size:200% auto;animation:calibration-sweep 2s linear infinite}.calibration-complete-badge{animation:calibration-complete-flash .5s ease-out forwards}@keyframes pain-pulse{0%,to{opacity:1}50%{opacity:.6}}.pain-critical{animation:pain-pulse .8s ease-in-out infinite}@keyframes speed-glow-low{0%,to{box-shadow:0 0 30px #ffcc004d}50%{box-shadow:0 0 50px #fc09}}@keyframes engagement-glow{0%,to{box-shadow:0 0 6px #0f86}50%{box-shadow:0 0 14px #0f8c}}