@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=DM+Mono:wght@400;500&family=DM+Sans:wght@300;400;500;600;700&display=swap";@tailwind base;@tailwind components;@tailwind utilities;:root{--bg-void: #09090b;--bg-deep: #111113;--bg-surface: #18181b;--bg-elevated: #27272a;--bg-hover: #3f3f46;--bg-active: #52525b;--bg-panel: #1c1c1f;--border-faint: rgba(255,255,255,.05);--border-dim: rgba(255,255,255,.09);--border-medium: rgba(255,255,255,.14);--border-bright: rgba(255,255,255,.22);--border-focus: rgba(16,185,129,.5);--accent: #10b981;--accent-light: #34d399;--accent-dim: rgba(16,185,129,.1);--accent-border: rgba(16,185,129,.22);--signal-cyan: #10b981;--signal-cyan-dim: rgba(16,185,129,.1);--signal-green: #22c55e;--signal-amber: #f59e0b;--signal-orange: #f97316;--signal-red: #ef4444;--signal-indigo: #6366f1;--signal-purple: #8b5cf6;--signal-teal: #14b8a6;--signal-blue: #3b82f6;--text-primary: #fafafa;--text-secondary: #d4d4d8;--text-label: #a1a1aa;--text-muted: #98989f;--text-faint: #84848d;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--r-xs: 4px;--r-sm: 6px;--r-md: 8px;--r-lg: 12px;--r-xl: 16px;--shadow-sm: 0 1px 3px rgba(0,0,0,.4), 0 1px 2px rgba(0,0,0,.3);--shadow-md: 0 4px 12px rgba(0,0,0,.5), 0 2px 4px rgba(0,0,0,.3);--shadow-lg: 0 12px 32px rgba(0,0,0,.6), 0 4px 8px rgba(0,0,0,.4);--shadow-xl: 0 24px 48px rgba(0,0,0,.7);--kpi-good: #22c55e;--kpi-warning: #f59e0b;--kpi-critical: #ef4444;--kpi-neutral: #a1a1aa;--kpi-info: #6366f1;--glow-cyan: none;--glow-green: none;--glow-red: none}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:14px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{background-color:var(--bg-void);color:var(--text-primary);font-family:Inter,DM Sans,system-ui,sans-serif;line-height:1.5;overflow-x:hidden}.font-mono{font-family:DM Mono,monospace}.font-display,.font-body{font-family:Inter,DM Sans,sans-serif}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#3f3f46;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#52525b}::selection{background:#10b98133;color:var(--text-primary)}:focus-visible{outline:2px solid var(--accent-light);outline-offset:2px;border-radius:var(--r-xs)}button:focus-visible,[role=button]:focus-visible,[role=tab]:focus-visible{outline:2px solid var(--accent-light);outline-offset:2px}.skip-link{position:absolute;left:12px;top:-48px;z-index:10000;padding:10px 16px;background:var(--accent);color:#04110b;font-family:Inter,sans-serif;font-size:13px;font-weight:600;border-radius:var(--r-sm);transition:top .15s ease}.skip-link:focus-visible{top:12px}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.dot-live,.skeleton,.fade-up,.fade-in,.stagger>*{animation:none!important}}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.015'/%3E%3C/svg%3E");pointer-events:none;z-index:9999}.grid-bg{background:var(--bg-void)}.panel{background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:var(--r-md)}.panel-elevated{background:var(--bg-elevated);border:1px solid var(--border-medium);border-radius:var(--r-md);box-shadow:var(--shadow-md)}.panel-glow{background:var(--bg-surface);border:1px solid var(--accent-border);border-radius:var(--r-md);box-shadow:0 0 0 1px var(--accent-border)}.panel-accent{position:relative;background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:var(--r-md)}.panel-accent:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent 0%,var(--accent) 50%,transparent 100%);border-radius:var(--r-md) var(--r-md) 0 0;opacity:.6}.label{font-family:DM Mono,monospace;font-size:10.5px;font-weight:500;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}.label-sm{font-family:DM Mono,monospace;font-size:9.5px;font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--text-faint)}.page-title{font-family:Inter,sans-serif;font-size:1rem;font-weight:700;color:var(--text-primary);letter-spacing:.04em;text-transform:uppercase}.page-subtitle{font-family:DM Mono,monospace;font-size:11px;color:var(--text-muted);letter-spacing:.02em}.value-xl{font-family:Inter,sans-serif;font-size:2.2rem;font-weight:700;color:var(--text-primary);line-height:1;letter-spacing:-.02em}.value-lg{font-family:Inter,sans-serif;font-size:1.6rem;font-weight:700;color:var(--text-primary);line-height:1;letter-spacing:-.01em}.value-md{font-family:Inter,sans-serif;font-size:1.15rem;font-weight:600;color:var(--text-primary);line-height:1.1}.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 7px;border-radius:var(--r-xs);font-family:DM Mono,monospace;font-size:10px;font-weight:500;letter-spacing:.04em;border:1px solid}.badge-ok{color:var(--signal-green);background:#22c55e14;border-color:#22c55e33}.badge-warn{color:var(--signal-amber);background:#f59e0b14;border-color:#f59e0b33}.badge-err{color:var(--signal-red);background:#ef444414;border-color:#ef444433}.badge-info{color:var(--accent);background:var(--accent-dim);border-color:var(--accent-border)}.badge-purple{color:var(--signal-purple);background:#8b5cf614;border-color:#8b5cf633}.badge-indigo{color:var(--signal-indigo);background:#6366f114;border-color:#6366f133}.badge-muted{color:var(--text-muted);background:#ffffff0a;border-color:var(--border-dim)}.btn-primary{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;background:var(--accent);color:#fff;border:none;border-radius:var(--r-sm);font-family:Inter,sans-serif;font-size:12px;font-weight:600;letter-spacing:.02em;cursor:pointer;transition:all .15s;box-shadow:0 1px 3px #0000004d}.btn-primary:hover{background:var(--accent-light);transform:translateY(-1px);box-shadow:0 4px 12px #10b98140}.btn-primary:active{transform:translateY(0)}.btn-primary:disabled{opacity:.35;cursor:not-allowed;transform:none}.btn-secondary{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;background:transparent;color:var(--text-secondary);border:1px solid var(--border-medium);border-radius:var(--r-sm);font-family:Inter,sans-serif;font-size:12px;font-weight:500;cursor:pointer;transition:all .15s}.btn-secondary:hover{border-color:var(--border-bright);color:var(--text-primary);background:#ffffff0a}.btn-ghost{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;background:transparent;color:var(--text-muted);border:none;border-radius:var(--r-sm);font-family:Inter,sans-serif;font-size:12px;cursor:pointer;transition:all .15s}.btn-ghost:hover{background:var(--bg-hover);color:var(--text-primary)}.btn-ghost:disabled{opacity:.35;cursor:not-allowed}.input{width:100%;padding:8px 12px;background:var(--bg-deep);border:1px solid var(--border-medium);border-radius:var(--r-sm);color:var(--text-primary);font-family:Inter,sans-serif;font-size:13px;transition:border-color .15s}.input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #10b98114}.input::placeholder{color:var(--text-faint)}.progress-track{height:3px;background:#ffffff0f;border-radius:2px;overflow:hidden}.progress-fill{height:100%;background:var(--accent);border-radius:2px;transition:width .5s ease}.progress-fill-green{background:var(--signal-green)}.progress-fill-amber{background:var(--signal-amber)}.progress-fill-red{background:var(--signal-red)}.dot-live{width:6px;height:6px;border-radius:50%;background:var(--accent);flex-shrink:0;animation:pulse-dot 2.5s ease-in-out infinite}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.4}}.data-table{width:100%;border-collapse:collapse}.data-table th{padding:9px 14px;text-align:left;font-family:DM Mono,monospace;font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.09em;color:var(--text-muted);border-bottom:1px solid var(--border-dim);background:var(--bg-deep);position:sticky;top:0;white-space:nowrap}.data-table td{padding:9px 14px;font-size:13px;color:var(--text-secondary);border-bottom:1px solid var(--border-faint);line-height:1.45}.data-table tr:hover td{background:#ffffff06;color:var(--text-primary)}.metric-card{background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:var(--r-lg);padding:16px 18px;transition:all .2s ease;cursor:default;position:relative}.metric-card:hover{border-color:var(--border-medium);background:var(--bg-elevated);transform:translateY(-1px);box-shadow:var(--shadow-md)}.upload-zone{border:1.5px dashed var(--border-medium);border-radius:var(--r-lg);transition:all .2s;cursor:pointer}.upload-zone:hover,.upload-zone.drag-over{border-color:var(--accent);background:var(--accent-dim)}.recharts-tooltip-wrapper .recharts-default-tooltip{background:var(--bg-elevated)!important;border:1px solid var(--border-medium)!important;border-radius:var(--r-md)!important;font-family:DM Mono,monospace!important;font-size:11px!important;box-shadow:var(--shadow-md)!important}.recharts-cartesian-axis-tick-value{fill:var(--text-faint)!important;font-size:10px!important}.recharts-cartesian-grid line{stroke:#ffffff0a!important}@keyframes fadeUp{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.fade-up{animation:fadeUp .25s ease-out both}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fade-in{animation:fadeIn .2s ease-out both}@keyframes shimmer{0%{background-position:-200% center}to{background-position:200% center}}.skeleton{background:linear-gradient(90deg,var(--bg-surface) 25%,var(--bg-elevated) 50%,var(--bg-surface) 75%);background-size:200% auto;animation:shimmer 1.8s infinite;border-radius:var(--r-sm)}.stagger>*{animation:fadeUp .28s ease-out both}.stagger>*:nth-child(1){animation-delay:0ms}.stagger>*:nth-child(2){animation-delay:35ms}.stagger>*:nth-child(3){animation-delay:70ms}.stagger>*:nth-child(4){animation-delay:105ms}.stagger>*:nth-child(5){animation-delay:.14s}.stagger>*:nth-child(6){animation-delay:175ms}.stagger>*:nth-child(7){animation-delay:.21s}.stagger>*:nth-child(8){animation-delay:245ms}.no-data-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:40px 20px;text-align:center}.no-data-icon{width:40px;height:40px;border-radius:50%;background:#ffffff0a;border:1px solid var(--border-dim);display:flex;align-items:center;justify-content:center;margin-bottom:4px}.no-data-label{font-family:DM Mono,monospace;font-size:11.5px;font-weight:500;color:var(--text-label)}.no-data-hint{font-family:Inter,sans-serif;font-size:11px;color:var(--text-muted);max-width:280px;line-height:1.6}.time-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:20px;font-family:DM Mono,monospace;font-size:10px;cursor:pointer;transition:all .12s;border:1px solid var(--border-faint);color:var(--text-muted);background:transparent}.time-chip:hover{border-color:var(--border-medium);color:var(--text-secondary);background:#ffffff08}.time-chip.active{background:var(--accent-dim);border-color:var(--accent-border);color:var(--accent);font-weight:600}.filter-chip{font-family:DM Mono,monospace;font-size:9.5px;padding:2px 8px;border-radius:var(--r-xs);cursor:pointer;transition:all .1s;white-space:nowrap;border:1px solid transparent;background:transparent;color:var(--text-muted)}.filter-chip:hover{background:#ffffff0a;color:var(--text-secondary);border-color:var(--border-faint)}.filter-chip.active{background:var(--accent-dim);border-color:var(--accent-border);color:var(--accent);font-weight:600}a{color:inherit;text-decoration:none}a:focus-visible{outline:1px solid var(--accent);outline-offset:2px;border-radius:3px}.page-content{padding:20px 24px;min-height:100%}.kpi-tooltip-trigger{display:inline-flex;align-items:center;justify-content:center;cursor:help;opacity:.5;transition:opacity .12s}.kpi-tooltip-trigger:hover{opacity:1}.help-msg-ai{background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:0 8px 8px;padding:10px 12px;font-family:Inter,sans-serif;font-size:12px;color:var(--text-secondary);line-height:1.6}.help-msg-user{background:var(--accent-dim);border:1px solid var(--accent-border);border-radius:8px 0 8px 8px;padding:8px 12px;font-family:Inter,sans-serif;font-size:12px;color:var(--accent-light)}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--bg-deep);border:1px solid var(--border-medium);border-radius:var(--r-sm);color:var(--text-secondary);font-family:DM Mono,monospace;font-size:11px;padding:5px 28px 5px 10px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2371717a'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;outline:none}select:focus{border-color:var(--accent)}select option{background:var(--bg-deep)}.kpi-card{background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:var(--r-lg);padding:18px 20px;display:flex;flex-direction:column;gap:10px;position:relative;transition:border-color .18s,box-shadow .18s}.kpi-card:hover{border-color:var(--border-medium);box-shadow:var(--shadow-sm)}.kpi-card--alert{border-color:#ef444440}.kpi-card--warn{border-color:#f59e0b33}.kpi-card--good{border-color:#22c55e2e}.kpi-card__label{font-family:DM Mono,monospace;font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);display:flex;align-items:center;gap:6px}.kpi-card__value{font-family:Inter,sans-serif;font-size:1.9rem;font-weight:700;color:var(--text-primary);line-height:1;letter-spacing:-.02em}.kpi-card__sub{font-family:DM Mono,monospace;font-size:10.5px;color:var(--text-muted)}.kpi-card__delta{display:inline-flex;align-items:center;gap:3px;font-family:DM Mono,monospace;font-size:10px;font-weight:500}.kpi-card__delta--up{color:var(--signal-green)}.kpi-card__delta--down{color:var(--signal-red)}.kpi-card__delta--flat{color:var(--text-muted)}.dash-tabs{display:flex;gap:2px;padding:3px;background:var(--bg-surface);border:1px solid var(--border-dim);border-radius:var(--r-md)}.dash-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:7px 14px;border-radius:var(--r-sm);font-family:Inter,sans-serif;font-size:11.5px;font-weight:500;color:var(--text-muted);cursor:pointer;transition:all .15s;border:none;background:transparent;white-space:nowrap}.dash-tab:hover{color:var(--text-secondary);background:#ffffff0a}.dash-tab.active{background:var(--bg-elevated);color:var(--text-primary);box-shadow:var(--shadow-sm)}.section-divider{display:flex;align-items:center;gap:10px;margin:4px 0}.section-divider__label{font-family:DM Mono,monospace;font-size:9.5px;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--text-faint);white-space:nowrap}.section-divider__line{flex:1;height:1px;background:var(--border-faint)}.bench-bar{position:relative;height:4px;background:#ffffff0f;border-radius:2px;overflow:visible}.bench-bar__fill{height:100%;border-radius:2px;transition:width .6s ease}.bench-bar__marker{position:absolute;top:-3px;width:2px;height:10px;border-radius:1px;background:#ffffff4d}.trend-pill{display:inline-flex;align-items:center;gap:3px;padding:2px 6px;border-radius:20px;font-family:DM Mono,monospace;font-size:9.5px;font-weight:500}.trend-pill--up{background:#22c55e14;color:var(--signal-green)}.trend-pill--down{background:#ef444414;color:var(--signal-red)}.trend-pill--flat{background:#ffffff0a;color:var(--text-muted)}.insight-card{padding:10px 12px;border-radius:var(--r-md);background:#ffffff06;border:1px solid var(--border-faint);transition:background .15s,border-color .15s;cursor:default}.insight-card:hover{background:#ffffff0a;border-color:var(--border-dim)}.insight-card--critical{border-left:2px solid var(--signal-red)}.insight-card--warning{border-left:2px solid var(--signal-amber)}.insight-card--ok{border-left:2px solid var(--signal-green)}.insight-card--info{border-left:2px solid var(--accent)}
