:root{color-scheme:dark;--bg-0: #0b0f14;--bg-1: #0f1620;--bg-2: #121c26;--surface: #131c25;--surface-strong: #182230;--surface-soft: #101821;--text-strong: #eef3f8;--text: #cdd7e1;--text-muted: #91a0b2;--text-faint: #6a7a8b;--pos: #38d98e;--neg: #ff5c5c;--neutral: #7c8aa0;--accent: #4ad6ff;--accent-2: #8b7dff;--warning: #f5b14b;--chip-bg: rgba(255, 255, 255, .06);--chip-border: rgba(255, 255, 255, .12);--grid-line: rgba(255, 255, 255, .08);--card-border: rgba(255, 255, 255, .12);--card-shadow: 0 24px 60px -40px rgba(0, 0, 0, .9);--radius-lg: 20px;--radius-md: 14px;--radius-sm: 8px;--font-display: "Space Grotesk", "Segoe UI", sans-serif;--font-mono: "IBM Plex Mono", "Courier New", monospace;--duration-fast: .15s;--duration-med: .24s;--duration-slow: .36s}*{box-sizing:border-box}html,body{padding:0;margin:0;min-height:100%}body{font-family:var(--font-display);background:radial-gradient(1200px 800px at 20% -10%,rgba(74,214,255,.12),transparent 55%),radial-gradient(900px 700px at 80% -20%,rgba(139,125,255,.14),transparent 60%),linear-gradient(160deg,var(--bg-0),var(--bg-1) 45%,var(--bg-2) 100%);color:var(--text);line-height:1.5}a{color:inherit;text-decoration:none}button,input,select{font-family:inherit}#root{min-height:100vh}.app{min-height:100vh;display:flex;flex-direction:column}.page{width:min(1400px,92vw);margin:0 auto;padding:32px 0 64px;display:flex;flex-direction:column;gap:28px}.section-title{color:var(--text-strong);font-weight:600;font-size:18px;letter-spacing:.02em}.meta-line{display:flex;flex-wrap:wrap;gap:12px;color:var(--text-muted);font-size:13px}.card{background:linear-gradient(160deg,#182230e0,#101821eb);border:1px solid var(--card-border);border-radius:var(--radius-lg);box-shadow:var(--card-shadow);padding:20px;position:relative;overflow:hidden}.card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(600px 300px at 10% 0%,rgba(74,214,255,.08),transparent 60%);opacity:.7;pointer-events:none}.card-content{position:relative;z-index:1;display:flex;flex-direction:column;gap:16px}.card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.card-title{font-size:16px;font-weight:600;color:var(--text-strong)}.card-subtitle{font-size:13px;color:var(--text-muted)}.card-actions{display:flex;flex-wrap:wrap;gap:8px}.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:12px;border:1px solid var(--chip-border);background:var(--chip-bg);color:var(--text-muted)}.chip--pos{color:var(--pos);border-color:#38d98e66;background:#38d98e1f}.chip--neg{color:var(--neg);border-color:#ff5c5c59;background:#ff5c5c1f}.chip--warn{color:var(--warning);border-color:#f5b14b59;background:#f5b14b1a}.chip--accent{color:var(--accent);border-color:#4ad6ff59;background:#4ad6ff1f}.btn{border:1px solid rgba(255,255,255,.16);background:#ffffff0f;color:var(--text-strong);padding:8px 14px;border-radius:999px;font-size:12px;font-weight:600;cursor:pointer;transition:transform var(--duration-fast) ease,border-color var(--duration-fast) ease}.btn:hover{transform:translateY(-1px);border-color:#ffffff4d}.btn--primary{background:linear-gradient(120deg,#4ad6ff38,#8b7dff2e);border-color:#4ad6ff80}.btn--ghost{background:transparent;border-color:#ffffff1f;color:var(--text-muted)}.badge{font-family:var(--font-mono);font-size:11px;color:var(--text-muted)}.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}.kpi-tile{background:#0d131b99;border:1px solid rgba(255,255,255,.08);border-radius:var(--radius-md);padding:12px;display:grid;gap:4px}.kpi-label{font-size:12px;color:var(--text-faint);text-transform:uppercase;letter-spacing:.08em}.kpi-value{font-size:16px;color:var(--text-strong);font-weight:600}.table{width:100%;border-collapse:collapse;font-size:13px}.table th,.table td{text-align:left;padding:8px 10px;border-bottom:1px solid rgba(255,255,255,.08)}.table th{color:var(--text-faint);font-weight:600;text-transform:uppercase;letter-spacing:.08em;font-size:11px}@media (max-width: 900px){.page{width:min(100%,92vw);padding:24px 0 48px}.card{padding:16px}}.dashboard-header{display:flex;flex-direction:column;gap:12px}.header-title{font-size:28px;color:var(--text-strong);font-weight:700}.header-subtitle{color:var(--text-muted);font-size:14px}.global-bar{display:grid;gap:12px}.global-bar-row{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center}.global-bar label{font-size:12px;color:var(--text-muted);display:block;margin-bottom:4px}.input{background:#0c1016cc;border:1px solid rgba(255,255,255,.14);border-radius:var(--radius-sm);color:var(--text-strong);padding:8px 10px;font-size:13px;min-width:120px}.slider{width:240px}.segment{display:inline-flex;background:#ffffff0f;border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:4px;gap:4px}.segment button{border:none;background:transparent;color:var(--text-muted);padding:6px 12px;border-radius:999px;font-size:12px;cursor:pointer}.segment button.is-active{background:#4ad6ff2e;color:var(--text-strong)}.dashboard-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}.card-span-12{grid-column:span 12}.card-span-8{grid-column:span 8}.card-span-6{grid-column:span 6}.card-span-4{grid-column:span 4}.card-span-3{grid-column:span 3}.heatmap-wrapper{display:grid;grid-template-columns:140px 1fr;gap:8px;min-height:320px}.heatmap-header{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:6px;align-items:end}.heatmap-header-cell{text-align:center;font-size:11px;color:var(--text-muted)}.heatmap-grid{display:grid;grid-auto-rows:minmax(24px,1fr);gap:6px}.heatmap-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:6px}.heatmap-cell{border-radius:6px;padding:4px;display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--text-strong);border:1px solid rgba(255,255,255,.06);transition:transform var(--duration-fast) ease,border-color var(--duration-fast) ease}.heatmap-cell.is-pinned{border-color:#4ad6ff99;box-shadow:0 0 0 1px #4ad6ff66}.heatmap-strike-labels{display:grid;gap:6px;align-content:start;font-size:11px;color:var(--text-faint)}.heatmap-lens{display:flex;gap:8px}.lens-pill{border-radius:999px;padding:6px 12px;font-size:12px;border:1px solid rgba(255,255,255,.14);background:#ffffff0a;cursor:pointer;color:var(--text-muted)}.lens-pill.is-active{color:var(--text-strong);border-color:#4ad6ff99;background:#4ad6ff1f}.time-series-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}.chart-shell{background:#0c1119b3;border:1px solid rgba(255,255,255,.08);border-radius:var(--radius-md);padding:12px}.chart-title{font-size:13px;color:var(--text-strong);font-weight:600;display:flex;align-items:center;justify-content:space-between}.chart-subtitle{font-size:11px;color:var(--text-faint)}.flow-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}.flow-card{background:#0a1016b3;border:1px solid rgba(255,255,255,.08);border-radius:var(--radius-md);padding:12px}.flow-toggle{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-muted);cursor:pointer}.flow-details{margin-top:18px;display:grid;gap:16px}.flow-status{display:grid;gap:10px}.flow-status-grid{display:flex;flex-wrap:wrap;gap:8px}.flow-bars{display:grid;gap:12px}.flow-bars-header{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center}.flow-bars-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}.flow-bars-card{background:#0a1016b3;border:1px solid rgba(255,255,255,.08);border-radius:var(--radius-md);padding:12px;display:grid;gap:10px}.data-tables{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}.empty-state{border:1px dashed rgba(255,255,255,.2);border-radius:var(--radius-md);padding:14px;color:var(--text-faint);font-size:12px}@media (max-width: 1100px){.dashboard-grid{grid-template-columns:repeat(6,1fr)}.card-span-8,.card-span-6,.card-span-4{grid-column:span 6}.card-span-3{grid-column:span 3}}@media (max-width: 720px){.dashboard-grid{grid-template-columns:repeat(1,1fr)}.card-span-12,.card-span-8,.card-span-6,.card-span-4,.card-span-3{grid-column:span 1}.heatmap-wrapper{grid-template-columns:1fr}.slider{width:100%}}