*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--violet-400: #a78bfa;--violet-500: #8b5cf6;--violet-600: #7c3aed;--violet-700: #6d28d9;--violet-800: #5b21b6;--violet-900: #4c1d95;--bg-primary: #0a0a0a;--bg-card: #111111;--bg-card-hover: #161616;--bg-elevated: #1a1a1a;--border-subtle: rgba(255, 255, 255, .06);--border-accent: rgba(139, 92, 246, .3);--text-primary: #f5f5f5;--text-secondary: #a1a1aa;--text-muted: #71717a;--green: #22c55e;--green-dim: rgba(34, 197, 94, .15);--red: #ef4444;--red-dim: rgba(239, 68, 68, .15);--yellow: #eab308;--yellow-dim: rgba(234, 179, 8, .15);--blue: #3b82f6;--blue-dim: rgba(59, 130, 246, .15);--gap-xs: 4px;--gap-sm: 8px;--gap-md: 16px;--gap-lg: 24px;--gap-xl: 32px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--font: "Inter", -apple-system, BlinkMacSystemFont, sans-serif}html,body{height:100%;font-family:var(--font);background:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5}#root{min-height:100vh}.dashboard{max-width:1400px;margin:0 auto;padding:var(--gap-lg)}.dashboard-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:var(--gap-lg);border-bottom:1px solid var(--border-subtle);margin-bottom:var(--gap-lg)}.dashboard-title{display:flex;align-items:center;gap:var(--gap-md)}.dashboard-title .logo{width:36px;height:36px;border-radius:var(--radius-sm);background:linear-gradient(135deg,var(--violet-500),#d946ef);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;color:#fff}.dashboard-title h1{font-size:20px;font-weight:600;color:var(--text-primary)}.dashboard-controls{display:flex;align-items:center;gap:var(--gap-md)}.tabs{display:flex;gap:var(--gap-xs);padding:3px;background:var(--bg-card);border-radius:var(--radius-md);border:1px solid var(--border-subtle);margin-bottom:var(--gap-lg);overflow-x:auto}.tab{padding:8px 16px;border-radius:var(--radius-sm);border:none;background:transparent;color:var(--text-secondary);font-family:var(--font);font-size:13px;font-weight:500;cursor:pointer;white-space:nowrap;transition:all .2s ease}.tab:hover{color:var(--text-primary);background:var(--bg-elevated)}.tab.active{color:var(--violet-400);background:#8b5cf61f;border:1px solid var(--border-accent)}.period-selector{display:flex;gap:2px;padding:2px;background:var(--bg-card);border-radius:var(--radius-sm);border:1px solid var(--border-subtle)}.period-btn{padding:5px 12px;border-radius:4px;border:none;background:transparent;color:var(--text-muted);font-family:var(--font);font-size:12px;font-weight:500;cursor:pointer;transition:all .15s ease}.period-btn:hover{color:var(--text-secondary)}.period-btn.active{background:var(--violet-600);color:#fff}.auto-refresh{display:flex;align-items:center;gap:var(--gap-sm);font-size:12px;color:var(--text-muted)}.toggle{position:relative;width:36px;height:20px;background:var(--bg-elevated);border-radius:10px;border:1px solid var(--border-subtle);cursor:pointer;transition:background .2s}.toggle.on{background:var(--violet-600);border-color:var(--violet-500)}.toggle:after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:#fff;transition:transform .2s}.toggle.on:after{transform:translate(16px)}.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--gap-md);margin-bottom:var(--gap-lg)}.kpi-card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:var(--gap-md) var(--gap-lg);transition:border-color .2s}.kpi-card:hover{border-color:var(--border-accent)}.kpi-label{font-size:12px;font-weight:500;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:var(--gap-xs)}.kpi-value{font-size:28px;font-weight:700;color:var(--text-primary);line-height:1.2}.kpi-value.green{color:var(--green)}.kpi-value.red{color:var(--red)}.kpi-value.violet{color:var(--violet-400)}.kpi-value.yellow{color:var(--yellow)}.kpi-subtitle{font-size:11px;color:var(--text-muted);margin-top:2px}.chart-panel{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:var(--gap-lg);margin-bottom:var(--gap-md)}.chart-panel-title{font-size:14px;font-weight:600;color:var(--text-primary);margin-bottom:var(--gap-md)}.chart-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-md);margin-bottom:var(--gap-md)}@media(max-width:768px){.chart-row{grid-template-columns:1fr}}.data-table{width:100%;border-collapse:collapse;font-size:13px}.data-table th{text-align:left;padding:10px 12px;color:var(--text-muted);font-weight:500;font-size:11px;text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--border-subtle)}.data-table td{padding:10px 12px;color:var(--text-secondary);border-bottom:1px solid var(--border-subtle)}.data-table tr:hover td{background:var(--bg-card-hover);color:var(--text-primary)}.data-table .mono{font-family:JetBrains Mono,Fira Code,monospace;font-size:12px}.badge{display:inline-block;padding:2px 8px;border-radius:4px;font-size:11px;font-weight:500}.badge-success{background:var(--green-dim);color:var(--green)}.badge-error{background:var(--red-dim);color:var(--red)}.badge-warning{background:var(--yellow-dim);color:var(--yellow)}.badge-info{background:var(--blue-dim);color:var(--blue)}.state-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;color:var(--text-muted);font-size:14px;gap:var(--gap-md)}.spinner{width:32px;height:32px;border:3px solid var(--border-subtle);border-top-color:var(--violet-500);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-text{color:var(--red);font-size:13px;text-align:center}.recharts-cartesian-axis-tick-value{fill:var(--text-muted)!important;font-size:11px!important}.recharts-tooltip-wrapper{outline:none!important}.custom-tooltip{background:var(--bg-elevated)!important;border:1px solid var(--border-accent)!important;border-radius:var(--radius-sm)!important;padding:8px 12px!important;font-size:12px!important;color:var(--text-primary)!important;box-shadow:0 8px 32px #0006!important}.custom-tooltip .label{color:var(--text-muted);margin-bottom:4px}