:root{color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5;--bg: #0b0b14;--card: #12121e;--card-border: rgba(255, 255, 255, .06);--text: #e8e8f0;--text-dim: rgba(255, 255, 255, .45);--accent: #6366f1}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;background:var(--bg);color:var(--text)}.dashboard{max-width:1280px;margin:0 auto;padding:2rem 1.5rem 4rem}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.dashboard-title{font-size:1.75rem;font-weight:700;letter-spacing:-.03em;background:linear-gradient(135deg,#6366f1,#a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.dashboard-subtitle{color:var(--text-dim);font-size:.875rem;margin-top:.25rem}.header-badge{display:flex;align-items:center;gap:.5rem;font-size:.75rem;color:#22c55e;background:#22c55e14;border:1px solid rgba(34,197,94,.2);padding:.35rem .75rem;border-radius:999px}.status-dot{width:6px;height:6px;border-radius:50%;background:#22c55e;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-bottom:1.5rem}.kpi-card{background:var(--card);border:1px solid var(--card-border);border-top:3px solid;border-radius:.75rem;padding:1.25rem;display:flex;gap:1rem;align-items:center;transition:transform .2s,box-shadow .2s}.kpi-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0000004d}.kpi-icon{width:48px;height:48px;border-radius:.75rem;display:grid;place-items:center;font-size:1.4rem;flex-shrink:0}.kpi-info{display:flex;flex-direction:column;min-width:0}.kpi-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);font-weight:500}.kpi-value{font-size:1.35rem;font-weight:700;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kpi-sub{font-size:.75rem;color:#22c55ecc;margin-top:.15rem}.charts-row{display:grid;grid-template-columns:2fr 1fr;gap:1rem;margin-bottom:1.5rem}.chart-card{background:var(--card);border:1px solid var(--card-border);border-radius:.75rem;padding:1.5rem}.chart-title{font-size:.95rem;font-weight:600;margin-bottom:1rem;color:var(--text)}.chart-legend{display:flex;gap:1.5rem;margin-bottom:.75rem}.legend-item{display:flex;align-items:center;gap:.4rem;font-size:.75rem;color:var(--text-dim)}.legend-dot{width:8px;height:8px;border-radius:50%;display:inline-block}.chart-svg{width:100%;height:auto}.donut-wrapper{display:flex;flex-direction:column;align-items:center;gap:1rem}.donut-svg{width:200px;height:200px}.donut-legend{width:100%;display:flex;flex-direction:column;gap:.4rem}.donut-legend-item{display:flex;align-items:center;gap:.5rem;font-size:.75rem}.donut-legend-name{flex:1;color:#ffffffa6}.donut-legend-pct{color:var(--text);font-weight:600;font-variant-numeric:tabular-nums}.table-card{background:var(--card);border:1px solid var(--card-border);border-radius:.75rem;padding:1.5rem;margin-bottom:1.5rem}.table-scroll{overflow-x:auto}.data-table{width:100%;border-collapse:collapse;font-size:.85rem}.data-table th{text-align:left;padding:.65rem .75rem;font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim);border-bottom:1px solid rgba(255,255,255,.06);font-weight:500}.data-table td{padding:.65rem .75rem;border-bottom:1px solid rgba(255,255,255,.03);color:#ffffffb3}.data-table tr:hover td{background:#ffffff05}.td-id{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8rem;color:var(--text-dim)}.td-total{font-weight:600;color:var(--text);font-variant-numeric:tabular-nums}.td-rank{font-weight:700;color:var(--accent)}.product-badge{display:inline-block;padding:.2rem .6rem;border-radius:999px;font-size:.75rem;border:1px solid rgba(99,102,241,.25);background:#6366f114;color:#fffc}.perf-bar-bg{width:100%;height:6px;background:#ffffff0d;border-radius:3px;overflow:hidden}.perf-bar{height:100%;border-radius:3px;transition:width .6s ease}@media(max-width:900px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.charts-row{grid-template-columns:1fr}}@media(max-width:520px){.kpi-grid{grid-template-columns:1fr}.dashboard{padding:1rem}}
