/* 寒山宣发 2.0 — 基础样式
   保持简洁深色系；后续大屏模块在此基础上扩展 */
:root {
  --bg: #0f1420;
  --card: #19212f;
  --line: #2a3447;
  --txt: #e6ebf2;
  --mut: #8a97ad;
  --ok: #4ade80;
  --warn: #e0a33e;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--txt);
  font-family: "Microsoft YaHei", system-ui, sans-serif;
}
.wrap { max-width: 960px; margin: 0 auto; padding: 32px 20px; }
header h1 { margin: 0 0 6px; font-size: 22px; }
.sub { margin: 0 0 24px; color: var(--mut); font-size: 13px; }
.cards { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 20px; }
.card {
  flex: 1 1 200px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 16px 18px;
}
.card .k { color: var(--mut); font-size: 12px; margin-bottom: 8px; }
.card .v { font-size: 26px; font-weight: 600; }
.panel {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 18px 20px;
}
.panel h2 { margin: 0 0 14px; font-size: 15px; color: var(--mut); font-weight: 500; }
.subs { display: flex; flex-direction: column; gap: 12px; }
.subrow { display: flex; align-items: center; gap: 12px; font-size: 13px; }
.subrow .name { width: 110px; color: var(--mut); }
.subrow .bar {
  flex: 1;
  height: 8px;
  background: #0d1219;
  border-radius: 4px;
  overflow: hidden;
}
.subrow .bar i { display: block; height: 100%; background: var(--ok); }
.subrow .num { width: 44px; text-align: right; font-variant-numeric: tabular-nums; }
.muted { color: var(--mut); font-size: 13px; }
footer { margin-top: 24px; }
.ok { color: var(--ok); }
.warn { color: var(--warn); }