/* ============================================================
   彩π 原型 · 共享设计系统
   ============================================================ */
:root{
  --brand:#E60012; --brand-dark:#B8000E; --brand-soft:#FDECEE;
  --gold:#FFB300;
  --success:#16A34A; --warning:#F59E0B; --danger:#EF4444; --info:#2563EB;
  --radius:12px; --radius-sm:8px;
  --shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.04);
  --shadow-lg:0 10px 30px rgba(15,23,42,.12);
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{text-decoration:none;color:inherit}
button{font-family:inherit;cursor:pointer;border:none;background:none}
ul{list-style:none}

/* ---------- 深色驾驶舱主题 ---------- */
.theme-dark{
  --bg:#0B1220; --panel:#111C2F; --panel-2:#16233A;
  --line:rgba(148,163,184,.16);
  --txt:#E8EEF7; --txt-2:#94A3B8; --txt-3:#64748B;
  background:var(--bg); color:var(--txt);
}
.theme-dark .card{background:linear-gradient(160deg,#13203A 0%,#0F1929 100%);border:1px solid var(--line)}
.theme-dark .card-title{color:#CBD5E1}

/* ---------- 浅色主题 ---------- */
.theme-light{
  --bg:#F4F6FA; --panel:#FFFFFF; --panel-2:#F8FAFC;
  --line:#E5E9F0;
  --txt:#0F172A; --txt-2:#64748B; --txt-3:#94A3B8;
  background:var(--bg); color:var(--txt);
}
.theme-light .card{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}

/* ---------- 通用组件 ---------- */
.card{border-radius:var(--radius);padding:18px}
.card-title{font-size:14px;font-weight:600;margin-bottom:14px;display:flex;align-items:center;justify-content:space-between}
.card-title .more{font-size:12px;color:var(--txt-2);font-weight:400}
.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600;line-height:1.6}
.badge.red{background:rgba(239,68,68,.15);color:#F87171}
.badge.green{background:rgba(22,163,74,.15);color:#4ADE80}
.badge.orange{background:rgba(245,158,11,.15);color:#FBBF24}
.badge.blue{background:rgba(37,99,235,.15);color:#60A5FA}
.badge.gray{background:rgba(148,163,184,.15);color:#94A3B8}
.theme-light .badge.red{background:#FEE2E2;color:#B91C1C}
.theme-light .badge.green{background:#DCFCE7;color:#15803D}
.theme-light .badge.orange{background:#FEF3C7;color:#B45309}
.theme-light .badge.blue{background:#DBEAFE;color:#1D4ED8}
.theme-light .badge.gray{background:#F1F5F9;color:#64748B}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 16px;border-radius:8px;font-size:13px;font-weight:500;transition:.15s}
.btn-primary{background:var(--brand);color:#fff}
.btn-primary:hover{background:var(--brand-dark)}
.btn-ghost{border:1px solid var(--line);color:var(--txt-2)}
.btn-ghost:hover{border-color:var(--brand);color:var(--brand)}
.btn-sm{padding:5px 10px;font-size:12px;border-radius:6px}

.progress{height:6px;border-radius:999px;background:rgba(148,163,184,.2);overflow:hidden}
.progress > i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--brand),#FF6B6B)}

.kpi{display:flex;flex-direction:column;gap:6px}
.kpi .label{font-size:12px;color:var(--txt-2)}
.kpi .value{font-size:26px;font-weight:700;letter-spacing:-.5px}
.kpi .value small{font-size:13px;font-weight:500;color:var(--txt-2);margin-left:2px}
.kpi .delta{font-size:12px}
.up{color:#4ADE80}.down{color:#F87171}
.theme-light .up{color:#16A34A}.theme-light .down{color:#DC2626}

/* 表格 */
.table{width:100%;border-collapse:collapse;font-size:13px}
.table th{text-align:left;font-weight:500;color:var(--txt-2);font-size:12px;padding:8px 10px;border-bottom:1px solid var(--line)}
.table td{padding:10px;border-bottom:1px solid var(--line)}
.table tr:last-child td{border-bottom:none}
.table tr:hover td{background:rgba(148,163,184,.06)}

/* 滚动条 */
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-thumb{background:rgba(148,163,184,.3);border-radius:4px}
::-webkit-scrollbar-track{background:transparent}