* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  background: #f4f6f8;
  color: #1f2933;
  min-height: 100vh;
}
.mono { font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; }
.muted { color: #7b8794; font-size: 13px; }

/* ---- 顶栏 ---- */
.topbar {
  display: flex;
  align-items: center;
  gap: 28px;
  height: 54px;
  padding: 0 24px;
  background: #1f2937;
  color: #fff;
  position: sticky;
  top: 0;
  z-index: 10;
}
.topbar .brand { font-size: 16px; font-weight: 600; }
.topbar .nav-links { display: flex; gap: 4px; }
.topbar .nav-link {
  color: #cbd2d9;
  text-decoration: none;
  font-size: 14px;
  padding: 6px 14px;
  border-radius: 6px;
}
.topbar .nav-link:hover { background: rgba(255, 255, 255, 0.08); color: #fff; }
.topbar .nav-link.active { background: #2563eb; color: #fff; }
.topbar .user-box { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.topbar .user-name { font-size: 13px; color: #cbd2d9; }
.topbar .btn-logout {
  background: transparent; color: #cbd2d9; border: 1px solid #4b5563;
  border-radius: 6px; padding: 4px 12px; font-size: 13px; cursor: pointer;
}
.topbar .btn-logout:hover { color: #fff; border-color: #9ca3af; }
.login-card .msg.err { color: #b91c1c; }
.placeholder { color: #6b7280; padding: 8px 0; }

.view { max-width: 1120px; margin: 0 auto; padding: 24px; }
.page-head h2 { font-size: 20px; }
.page-head .page-sub { font-size: 13px; color: #7b8794; margin-top: 4px; margin-bottom: 18px; }

/* ---- 卡片 / 统计 ---- */
.card {
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(31, 41, 51, 0.08);
}
.stat-bar { display: flex; gap: 14px; margin-bottom: 18px; flex-wrap: wrap; }
.stat {
  background: #fff;
  border-radius: 10px;
  padding: 16px 22px;
  min-width: 108px;
  box-shadow: 0 1px 3px rgba(31, 41, 51, 0.08);
}
.stat-num { font-size: 26px; font-weight: 700; color: #1d4ed8; }
.stat-label { font-size: 12px; color: #7b8794; margin-top: 2px; }

/* ---- 空间树 ---- */
.tree-card { padding: 8px 0; }
.tree-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-top: 6px;
  padding-bottom: 6px;
  padding-right: 12px;
  font-size: 14px;
}
.tree-row:hover { background: #f1f5fb; }
.tree-toggle {
  width: 16px;
  color: #7b8794;
  cursor: pointer;
  user-select: none;
  text-align: center;
}
.tree-toggle.tree-leaf { cursor: default; color: #cbd2d9; }
.tree-code { color: #2563eb; font-size: 12px; min-width: 86px; }
.tree-name { flex: 1; }
.tree-count { color: #9aa5b1; font-size: 12px; }
.badge {
  font-size: 11px;
  padding: 1px 8px;
  border-radius: 10px;
  background: #e4e7eb;
  color: #52606d;
}
.badge-campus { background: #dbeafe; color: #1d4ed8; }
.badge-building { background: #dcfce7; color: #15803d; }
.badge-room { background: #f1f5f9; color: #64748b; }

/* ---- 工具栏 / 表格 ---- */
.toolbar { display: flex; gap: 12px; align-items: center; margin-bottom: 14px; }
.toolbar input, .toolbar select {
  height: 36px;
  padding: 0 12px;
  border: 1px solid #cbd2d9;
  border-radius: 6px;
  font-size: 14px;
}
.toolbar input { width: 260px; }
.toolbar .count { margin-left: auto; }
.table-card { overflow-x: auto; }
.meter-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.meter-table th, .meter-table td {
  text-align: left;
  padding: 10px 14px;
  border-bottom: 1px solid #eef1f4;
  white-space: nowrap;
}
.meter-table th { background: #f8fafc; color: #52606d; font-weight: 600; font-size: 13px; }
.meter-table tbody tr:hover { background: #f8fafd; }
.meter-table td.num { text-align: right; }
.pill { font-size: 12px; padding: 2px 10px; border-radius: 10px; }
.pill-ok { background: #dcfce7; color: #15803d; }
.pill-off { background: #fee2e2; color: #b91c1c; }

/* ---- 用量分析 ---- */
.strong { font-weight: 700; color: #111827; }
.txt-err { color: #b91c1c; }
.part-stat .stat-num { font-size: 20px; }
.p-jian .stat-num { color: #b91c1c; }
.p-feng .stat-num { color: #c2410c; }
.p-ping .stat-num { color: #2563eb; }
.p-gu .stat-num { color: #15803d; }
.period-row { cursor: pointer; }
.period-row:hover { background: #f1f5fb; }
.period-row.selected { background: #e8f0fe; }
.period-row.selected td { border-bottom-color: #c7d9fb; }
#readings-detail-anchor { margin-top: 22px; }
.detail-head {
  display: flex; align-items: baseline; gap: 12px;
  padding: 16px 18px 8px;
}
.detail-head h3 { font-size: 16px; }
.tag { font-size: 11px; padding: 1px 8px; border-radius: 10px; white-space: nowrap; }
.tag-ok { background: #dcfce7; color: #15803d; }
.tag-base { background: #e4e7eb; color: #52606d; }
.tag-warn { background: #fef3c7; color: #b45309; }
.tag-err { background: #fee2e2; color: #b91c1c; }
.parts-cell { color: #52606d; font-size: 12.5px; }
.warn-box {
  margin: 4px 18px 10px; padding: 10px 14px;
  background: #fef2f2; border: 1px solid #fecaca; border-radius: 8px;
  color: #b91c1c; font-size: 13px;
}
.warn-box div { margin: 2px 0; }
.baseline-toggle {
  padding: 10px 18px; cursor: pointer; color: #52606d; font-size: 13px;
  border-top: 1px solid #eef1f4; user-select: none;
}
.baseline-toggle:hover { background: #f8fafc; }
.baseline-box { border-top: 1px solid #eef1f4; }
.baseline-box .muted { font-size: 12px; }

/* ---- 勾稽与无表页 ---- */
.txt-ok { color: #15803d; }
.txt-warn { color: #b45309; }
.small { font-size: 12px; }
.pill-row { display: flex; flex-wrap: wrap; gap: 8px; padding: 4px 18px 10px; }
.detail-sub { font-size: 13px; font-weight: 600; color: #334155; padding: 8px 18px 2px; }
.balance-chain {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 14px 18px 6px;
}
.chain-item { min-width: 96px; text-align: center; }
.chain-num { font-size: 20px; font-weight: 700; font-variant-numeric: tabular-nums; color: #1f2937; }
.chain-label { font-size: 11.5px; color: #7b8794; margin-top: 2px; }
.chain-op { font-size: 18px; color: #9aa5b1; font-weight: 600; }
.chain-hl .chain-num { color: #2563eb; }
.chain-gap .chain-num { color: #b45309; }
#balance-detail-anchor { margin-top: 22px; }

/* ---- 登录占位（暂留） ---- */
body.login-mode { display: flex; align-items: center; justify-content: center; }
.login-card {
  background: #fff;
  width: 320px;
  padding: 32px 28px;
  border-radius: 10px;
  box-shadow: 0 6px 24px rgba(31, 41, 51, 0.10);
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.login-card h1 { font-size: 20px; text-align: center; }
.login-card .sub { font-size: 13px; color: #7b8794; text-align: center; margin-bottom: 6px; }
.login-card input {
  height: 40px; padding: 0 12px; border: 1px solid #cbd2d9; border-radius: 6px; font-size: 14px;
}
.login-card button {
  height: 42px; background: #2563eb; color: #fff; border: none; border-radius: 6px; font-size: 15px; cursor: pointer;
}
.login-card button:hover { background: #1d4ed8; }
.login-card .msg { font-size: 12px; color: #b45309; min-height: 16px; text-align: center; }

/* ===== 写操作：按钮 + 弹窗 ===== */
.btn-primary {
  background: #2563eb; color: #fff; border: none; border-radius: 6px;
  padding: 8px 16px; font-size: 14px; cursor: pointer;
}
.btn-primary:hover { background: #1d4ed8; }
.btn-primary:disabled { background: #93b4f0; cursor: default; }
.btn-plain {
  background: #fff; color: #374151; border: 1px solid #d1d5db; border-radius: 6px;
  padding: 8px 16px; font-size: 14px; cursor: pointer;
}
.btn-plain:hover { background: #f3f4f6; }
.btn-add { margin-left: auto; align-self: center; }
.btn-mini {
  background: transparent; border: 1px solid #d1d5db; color: #2563eb;
  border-radius: 5px; padding: 2px 10px; font-size: 12px; cursor: pointer;
}
.btn-mini:hover { background: #eff6ff; }
.pill-warn { background: #fef3c7; color: #92400e; }
.page-head { display: flex; align-items: flex-start; justify-content: space-between; }

.modal-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,0.45); z-index: 100;
  display: flex; align-items: flex-start; justify-content: center; padding: 48px 16px; overflow: auto;
}
.modal-box {
  background: #fff; border-radius: 10px; width: 560px; max-width: 100%;
  box-shadow: 0 12px 40px rgba(0,0,0,0.25); padding: 0;
}
.modal-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid #eee; }
.modal-head h3 { margin: 0; font-size: 16px; }
.modal-x { background: none; border: none; font-size: 22px; line-height: 1; color: #9ca3af; cursor: pointer; }
.modal-body { padding: 16px 20px; max-height: 60vh; overflow: auto; }
.modal-field { display: block; margin-bottom: 12px; }
.modal-label { display: block; font-size: 13px; color: #374151; margin-bottom: 4px; }
.modal-field input, .modal-field select, .modal-field textarea {
  width: 100%; box-sizing: border-box; border: 1px solid #d1d5db; border-radius: 6px;
  padding: 7px 10px; font-size: 14px; font-family: inherit;
}
.modal-field input[type="checkbox"] { width: auto; }
.modal-err { color: #b91c1c; font-size: 13px; margin: 0 20px; min-height: 18px; }
.modal-confirm-text { margin: 0; color: #374151; font-size: 14px; line-height: 1.6; }
.modal-foot { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 20px; border-top: 1px solid #eee; }

/* M4 数据校验卡 */
.ok-box { background:#eaf7ee; border:1px solid #b7e0c4; color:#1d6b35; border-radius:8px; padding:10px 12px; margin:10px 0; }
.ok-box .muted { color:#4d8a63; }
.pill-row { display:flex; flex-wrap:wrap; gap:8px; margin:10px 0; }
.pill.pill-bad { background:#fdecea; color:#b3261e; border-color:#f3bdb8; }
.pill.pill-ok { background:#eaf7ee; color:#1d6b35; border-color:#b7e0c4; }
.txt-ok { color:#1d6b35; }
.issue-group { margin:10px 0; }
.issue-group-title { font-weight:600; margin:6px 0 4px; }
.issue-group.issue-bad .issue-group-title { color:#b3261e; }
.issue-group.issue-warn .issue-group-title { color:#9a6a00; }
.issue-list { margin:0; padding-left:20px; }
.issue-list li { font-size:13px; line-height:1.7; }

/* M5 数据看板 */
.period-sel-wrap { display:flex; align-items:center; gap:6px; }
.period-select { padding:6px 10px; border:1px solid #ccd2da; border-radius:6px; font-size:14px; }
.kpi-row { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:14px 0; }
.kpi-card { background:#fff; border:1px solid #e3e7ee; border-radius:10px; padding:16px 18px; box-shadow:0 1px 2px rgba(20,40,80,.04); }
.kpi-card.kpi-total { border-top:3px solid #2563eb; }
.kpi-card.kpi-gap { border-top:3px solid #d97706; }
.kpi-label { color:#5b6572; font-size:13px; }
.kpi-num { font-size:30px; font-weight:700; margin:6px 0 2px; font-variant-numeric:tabular-nums; }
.kpi-sub { font-size:12px; }
.chart-card { margin:14px 0; }
.bar-chart { display:flex; align-items:flex-end; gap:10px; height:220px; padding:12px 4px 0; border-bottom:1px solid #e3e7ee; }
.bar-col { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; }
.bar-track { width:100%; max-width:46px; height:100%; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; position:relative; }
.bar-fill { width:70%; background:linear-gradient(180deg,#60a5fa,#2563eb); border-radius:4px 4px 0 0; min-height:2px; }
.bar-fill.bar-cur { background:linear-gradient(180deg,#fbbf24,#d97706); }
.bar-val { font-size:10px; color:#5b6572; margin-top:4px; white-space:nowrap; }
.bar-x { font-size:11px; color:#7b8494; margin-top:4px; }
.hbar-chart { display:flex; flex-direction:column; gap:8px; margin-top:10px; }
.hbar-row { display:grid; grid-template-columns:150px 1fr 90px; align-items:center; gap:10px; }
.hbar-name { font-size:13px; color:#333; text-align:right; }
.hbar-track { background:#f1f4f9; border-radius:4px; height:18px; overflow:hidden; }
.hbar-fill { height:100%; background:#2563eb; border-radius:4px; }
.hbar-fill.hbar-b9 { background:#0d9488; }
.hbar-val { font-size:13px; }
.chart-note { margin-top:8px; font-size:12px; }
.master-table td, .master-table th { font-size:13px; }
.tr-sum td { background:#f5f8ff; font-weight:600; }
.tr-group td { background:#f1f1f1; color:#666; font-weight:600; }
.tr-grey td { background:#fafafa; color:#999; }
.tr-b9 .row-b9 { color:#0d9488; }
.b9-floor { margin:12px 0; }
.b9-floor-head { font-weight:600; margin:8px 0 6px; }
.b9-table { width:100%; table-layout:fixed; }
.b9-cell { border:1px solid #e7eaf0; padding:6px 8px; text-align:center; width:16.6%; }
.b9-room { font-size:12px; color:#555; }
.b9-usage { font-size:13px; font-weight:600; }

/* M7 系统管理 */
.admin-tabs { display:flex; gap:8px; margin:12px 0; border-bottom:1px solid #e3e7ee; }
.admin-tab { padding:8px 18px; border:none; background:none; cursor:pointer; font-size:14px; color:#5b6572; border-bottom:2px solid transparent; }
.admin-tab.active { color:#2563eb; border-bottom-color:#2563eb; font-weight:600; }
.ops { white-space:nowrap; }
.ops .btn-mini { margin-right:4px; }
.log-filter { gap:6px; align-items:center; display:flex; flex-wrap:wrap; }
.nowrap { white-space:nowrap; }
.pill.pill-ok { background:#eaf7ee; color:#1d6b35; border-color:#b7e0c4; }
.pill.pill-bad { background:#fdecea; color:#b3261e; border-color:#f3bdb8; }
.btn-export { margin-left:12px; }