:root {
  --bg:#0f1419; --card:#1a2332; --line:#2a3548; --text:#e7ecf3; --muted:#9aa7b8;
  --accent:#3b82f6; --good:#22c55e; --warn:#f59e0b;
}
* { box-sizing:border-box; }
body { margin:0; font-family: ui-sans-serif, system-ui, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  background:var(--bg); color:var(--text); }
.top { display:flex; flex-wrap:wrap; gap:12px; align-items:center; padding:14px 18px;
  border-bottom:1px solid var(--line); background:#0c1016; position:sticky; top:0; z-index:10; }
.brand { font-weight:700; letter-spacing:.02em; }
.tabs button { background:transparent; border:1px solid var(--line); color:var(--muted);
  padding:8px 14px; border-radius:8px; cursor:pointer; margin-right:6px; }
.tabs button.active { background:var(--accent); border-color:var(--accent); color:#fff; }
.meta { margin-left:auto; color:var(--muted); font-size:12px; }
.panel { display:none; padding:16px 18px 40px; }
.panel.active { display:block; }
.filters { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:14px; }
.filters label { color:var(--muted); font-size:13px; display:flex; gap:6px; align-items:center; }
.filters input, .filters select { background:var(--card); color:var(--text); border:1px solid var(--line);
  border-radius:6px; padding:6px 8px; }
.kpis { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:10px; margin-bottom:14px; }
.kpi { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:12px 14px; }
.kpi .label { color:var(--muted); font-size:12px; }
.kpi .value { font-size:22px; font-weight:700; margin-top:4px; }
.chart-wrap { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:12px;
  height:320px; margin-bottom:18px; }
h3 { margin:8px 0 10px; font-size:15px; color:var(--muted); font-weight:600; }
.table-wrap { overflow:auto; max-height:480px; border:1px solid var(--line); border-radius:10px; }
table { width:100%; border-collapse:collapse; font-size:13px; }
th, td { padding:8px 10px; border-bottom:1px solid var(--line); text-align:left; white-space:nowrap; }
th { position:sticky; top:0; background:#152033; color:var(--muted); font-weight:600; }
tr:hover td { background:#152033; }
.foot { padding:12px 18px 28px; color:var(--muted); font-size:12px; border-top:1px solid var(--line); }
.foot pre { white-space:pre-wrap; background:var(--card); padding:10px; border-radius:8px; }