body {
  background: #f4f7fb;
  color: #1f2c3f;
  font-size: 14px;
}

/* ---------- 登录 ---------- */
.login-layer {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #0b2545 0%, #123c6b 45%, #1d6fa5 100%);
}
.login-card {
  width: 420px;
  background: #fff;
  border-radius: 14px;
  padding: 30px 32px 26px;
  box-shadow: 0 24px 60px rgba(6, 28, 56, 0.35);
}
.lc-brand { display: flex; gap: 12px; align-items: center; margin-bottom: 22px; }
/* 登录卡品牌标识：白底卡片上直接展示 logo 原色 */
.lc-logo {
  width: auto; height: 40px; border-radius: 10px; flex: none; display: block;
}
.lc-brand h1 { font-size: 18px; }
.lc-brand p { font-size: 12px; color: #7b8ca4; margin-top: 2px; }
.field { display: block; margin-bottom: 14px; }
.field > span { display: block; font-size: 12.5px; color: #54677f; margin-bottom: 5px; }
.field input, .field select, .field textarea {
  width: 100%; border: 1px solid #d7e0ec; border-radius: 8px; padding: 9px 11px; outline: none;
  background: #fbfdff; transition: 0.15s; font-size: 14px;
}
.field input:focus, .field select:focus, .field textarea:focus { border-color: #2f8fd6; box-shadow: 0 0 0 3px rgba(47, 143, 214, 0.14); }
.err { color: #d92d20; font-size: 12.5px; min-height: 18px; margin: 2px 0 8px; }
.tip { font-size: 12px; color: #8b9ab0; margin-top: 14px; line-height: 1.6; }
/* ICP 备案号：登录卡底部 + 侧边栏底部 */
.beian { margin-top: 18px; padding-top: 14px; border-top: 1px dashed #e3eaf3; text-align: center; }
.beian a { font-size: 12px; color: #8b9ab0; text-decoration: none; }
.beian a:hover { color: #2f8fd6; }
.beian-side { display: block; margin-top: 10px; text-align: center; font-size: 11px; color: rgba(255,255,255,0.42); text-decoration: none; letter-spacing: 0.2px; }
.beian-side:hover { color: rgba(255,255,255,0.78); }
.notice {
  background: #eef6ff; border: 1px solid #bcdcf8; color: #165a94; font-size: 12.5px;
  padding: 9px 11px; border-radius: 8px; margin-bottom: 14px; line-height: 1.6;
}
/* 已处理提示（绿） */
.notice.ok { background: #ecfdf5; border-color: #a7e3c8; color: #0d6f4a; }

/* 处置信息表单（两步式「已处理」：先填处置措施/时间/人员，再点一次提交） */
.dispose-box { margin-top: 16px; padding: 12px 14px 8px; background: #f7fbff; border: 1px solid #cfe4fa; border-radius: 10px; }
.dispose-box .dz-title { font-size: 13px; font-weight: 700; color: #165a94; margin-bottom: 9px; }
.dispose-box .dz-req { font-weight: 400; font-size: 11px; color: #7b8ca4; margin-left: 6px; }
.dispose-box .field span { font-size: 12px; }
.dispose-box textarea { min-height: 62px; resize: vertical; line-height: 1.6; }
.dispose-box .dz-tip { font-size: 11.5px; color: #7b8ca4; margin: 4px 0 8px; }
/* 「本次处置包含换水」勾选项 */
.dispose-box .dz-check {
  display: flex; align-items: center; gap: 7px; margin: 6px 0 2px; padding: 8px 10px;
  background: #fff; border: 1px dashed #b9d8f3; border-radius: 8px; cursor: pointer;
  font-size: 13px; color: #24405c; user-select: none;
}
.dispose-box .dz-check input { width: 15px; height: 15px; accent-color: #1a6fb0; cursor: pointer; flex: none; }
.dispose-box .dz-check span { font-weight: 600; }
.dispose-box .dz-check .dz-hint { font-weight: 400; font-size: 11.5px; color: #7b8ca4; }
.dispose-box .dz-check:has(input:checked) { background: #eef7ff; border-color: #1a6fb0; border-style: solid; }
/* 第一阶段已展开表单，按钮进入「待提交」状态 */
.btn.ready { box-shadow: 0 0 0 3px rgba(44, 123, 229, 0.2); }

.btn {
  border: 1px solid #d7e0ec; background: #fff; color: #34465e; border-radius: 8px;
  padding: 8px 14px; cursor: pointer; transition: 0.15s; font-size: 13.5px;
}
.btn:hover { border-color: #2f8fd6; color: #165a94; }
.btn.primary { background: #1a6fb0; border-color: #1a6fb0; color: #fff; }
.btn.primary:hover { background: #165e96; }
.btn.danger { color: #d92d20; border-color: #f3c2bd; background: #fff5f4; }
.btn.block { width: 100%; padding: 11px; font-size: 14.5px; }
.btn.tiny { padding: 5px 10px; font-size: 12.5px; }
.btn.ghost { background: #f6f9fc; }
.btn.active { border-color: #2f8fd6; color: #165a94; background: #eaf4fd; }
#btnFullscreen { min-width: 72px; }
.btn:disabled { opacity: 0.55; cursor: not-allowed; }

/* ---------- 骨架 ---------- */
.shell { display: flex; min-height: 100vh; }
.sidebar {
  width: 218px; flex: none; background: #0e2440; color: #cfe2f5; display: flex; flex-direction: column;
  position: sticky; top: 0; height: 100vh;
}
.brand { display: flex; align-items: center; gap: 10px; padding: 18px 18px 16px; border-bottom: 1px solid rgba(255,255,255,0.08); }
/* 品牌标识：京脉 logo（红色系透明底，深色侧栏上垫白色圆角底板保证辨识度） */
.brand-logo {
  width: auto;
  height: 32px;
  padding: 3px 6px;
  border-radius: 7px;
  background: #fff;
  border: 1px solid rgba(255, 255, 255, 0.82);
  box-sizing: border-box;
  flex: none;
  display: block;
}
.brand-text strong { display: block; font-size: 14px; color: #fff; }
.brand-text span { font-size: 10.5px; color: #7d9bbf; letter-spacing: 0.5px; }
.menu { flex: 1; padding: 12px 10px; display: flex; flex-direction: column; gap: 2px; }
.mi {
  display: flex; align-items: center; gap: 9px; padding: 9px 12px; border-radius: 8px; cursor: pointer;
  color: #b7cee6; font-size: 13.5px;
}
.mi i { font-style: normal; width: 16px; text-align: center; opacity: 0.85; }
.mi:hover { background: rgba(255,255,255,0.07); color: #fff; }
.mi.active { background: rgba(32, 137, 209, 0.28); color: #fff; box-shadow: inset 0 0 0 1px rgba(86, 180, 233, 0.4); }
.side-foot { padding: 12px 14px 16px; border-top: 1px solid rgba(255,255,255,0.08); }
.me { font-size: 12px; margin-bottom: 10px; line-height: 1.6; color: #9fbcd8; word-break: break-all; }
.me b { color: #fff; font-size: 13px; }
.foot-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.foot-actions .btn { background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.16); color: #d7e8f8; font-size: 12px; padding: 5px 9px; }
.foot-actions .btn:hover { background: rgba(255,255,255,0.16); color: #fff; }

.content { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.content-head {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 18px 26px 14px; background: #fff; border-bottom: 1px solid #e6ecf4;
}
.content-head h2 { font-size: 18px; }
.content-head p { font-size: 12.5px; color: #7b8ca4; margin-top: 3px; }
.head-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.head-right { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.view { padding: 18px 26px 40px; flex: 1; min-width: 0; }

/* ---------- 卡片 ---------- */
.card {
  background: #fff; border: 1px solid #e6ecf4; border-radius: 12px; padding: 16px 18px; margin-bottom: 16px;
  box-shadow: 0 1px 2px rgba(16, 40, 70, 0.04);
}
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.card-head h3 { font-size: 14.5px; }
.card-head .desc { font-size: 12px; color: #7b8ca4; }
.card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }

.stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 16px; }
.stat {
  background: #fff; border: 1px solid #e6ecf4; border-left: 3px solid #1a6fb0; border-radius: 10px; padding: 12px 14px;
}
.stat.warn { border-left-color: #e8930c; }
.stat.danger { border-left-color: #d92d20; }
.stat.ok { border-left-color: #12b76a; }
.stat .lb { font-size: 12px; color: #7b8ca4; }
.stat .vl { font-size: 22px; font-weight: 700; margin-top: 3px; }
.stat .vl small { font-size: 12px; color: #7b8ca4; font-weight: 400; margin-left: 3px; }
.stat.danger .vl { color: #d92d20; }

/* ---------- 表格 ---------- */
.tb { width: 100%; border-collapse: collapse; font-size: 13px; }
.tb th {
  text-align: left; padding: 9px 10px; color: #54677f; font-weight: 600; font-size: 12.5px;
  border-bottom: 1px solid #e6ecf4; background: #f7fafd; white-space: nowrap;
}
.tb td { padding: 9px 10px; border-bottom: 1px solid #eef2f7; vertical-align: middle; }
.tb tr:hover td { background: #f7fbff; }
.tb .muted { color: #8b9ab0; }
.tb .bad { color: #d92d20; font-weight: 600; }
.tb .good { color: #108659; font-weight: 600; }
/* 总览「超标环网」：全部展示，超出高度后在卡片内滚动（表头吸顶） */
.tb-scroll { max-height: 420px; overflow: auto; }
.tb-scroll .tb thead th { position: sticky; top: 0; z-index: 1; }
/* 超标详情弹窗 */
.detail-meta {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px 16px;
  background: #f7fafd; border: 1px solid #e6ecf4; border-radius: 10px;
  padding: 10px 12px; margin-bottom: 14px; font-size: 12.5px; color: #34465e;
}
.detail-meta .lb { display: block; color: #8b9ab0; font-size: 11.5px; margin-bottom: 2px; }
.detail-meta .bad { color: #d92d20; }
.detail-tb th, .detail-tb td { white-space: nowrap; }
.detail-tip { margin-top: 10px; font-size: 11.5px; color: #8b9ab0; }
.row-actions { display: flex; gap: 6px; }

.tag { display: inline-block; font-size: 11.5px; padding: 2px 8px; border-radius: 20px; border: 1px solid transparent; }
.tag.ok { background: #e9f9f1; color: #0a7a4c; border-color: #b8e6cf; }
.tag.warn { background: #fff7e6; color: #a26409; border-color: #f5dca5; }
.tag.danger { background: #fef2f1; color: #b42318; border-color: #fac9c4; }
.tag.grey { background: #f1f4f8; color: #66707d; border-color: #e2e8f0; }
/* 侧别：二次侧用浅蓝，与一次侧的绿色保持同一套视觉轻量标签 */
.tag.blue { background: #eaf4fe; color: #1668b3; border-color: #c2ddf7; }

.filters { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; margin-bottom: 14px; }
.filters .field { margin-bottom: 0; min-width: 150px; }
.filters .field > span { font-size: 12px; }
.filters > .btn.tiny { height: 38px; margin-bottom: 0; }
.filters #cuKeyword { min-width: 260px; }
/* 搜索命中的关键词高亮 */
.hl { background: #fff1bf; color: #7a4a00; border-radius: 2px; padding: 0 1px; font-weight: 600; }

.empty { padding: 34px; text-align: center; color: #8b9ab0; font-size: 13px; }

/* ---------- 树形位置管理：园区 = 一张整卡片，卡片头标记客户 ---------- */
.park-block {
  background: #fff; border: 1px solid #e3eaf3; border-left: 4px solid #2f6fb3;
  border-radius: 12px; margin-bottom: 14px; overflow: hidden;
  box-shadow: 0 1px 3px rgba(20, 45, 80, 0.05);
}
/* 同一园区涉及多个客户时，左侧色条转为橙色提示 */
.park-block.multi { border-left-color: #e8a33d; }
.park-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; flex-wrap: wrap;
  padding: 12px 16px; background: linear-gradient(90deg, #f5faff, #ffffff); border-bottom: 1px solid #eef2f8;
}
.park-head .ph-right .row-actions { flex-wrap: wrap; justify-content: flex-end; }
.park-head .ph-left { min-width: 0; }
.park-head .ph-title { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.park-head .ph-name { font-weight: 700; font-size: 16px; color: #1f3350; }
.ph-code { font-size: 11.5px; color: #5b708c; background: #eef3f9; border: 1px solid #e0e8f2; padding: 1px 8px; border-radius: 999px; }
.ph-status { font-size: 11.5px; padding: 1px 8px; border-radius: 999px; border: 1px solid transparent; }
.ph-status.on { color: #0f7a45; background: #eaf7ef; border-color: #c8e9d5; }
.ph-status.build { color: #a86200; background: #fff5e2; border-color: #f5dcaa; }
.ph-status.off { color: #7b8ca4; background: #f1f4f8; border-color: #e2e8f0; }
/* 客户标记：园区卡片上最显眼的一行 */
.ph-cust-row { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.ph-cust-label { font-size: 11.5px; color: #8b9ab0; margin-right: 2px; }
.ph-cust {
  display: inline-flex; align-items: center; font-size: 12.5px; font-weight: 600;
  color: #1b4f8f; background: #eef3fb; border: 1px solid #d5e2f5;
  padding: 2px 10px; border-radius: 6px;
}
.ph-cust.none { color: #98a6ba; background: #f5f7fa; border-color: #e2e8f0; font-weight: 500; }
/* 客户名后的小数字：该客户在本园区涉及的环网数 */
.ph-cust i {
  font-style: normal; font-size: 10.5px; font-weight: 600; margin-left: 5px;
  color: #fff; background: #5b8ec9; border-radius: 999px; padding: 0 5px; line-height: 15px;
}
.ph-cust-note { font-size: 11.5px; color: #a86200; }
.park-head .ph-right { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; flex: none; }
.ph-stats { display: flex; align-items: center; gap: 12px; font-size: 12px; color: #7b8ca4; }
.ph-stats b { color: #1f3350; font-size: 13px; }
.ph-stats .bad b { color: #d92d20; }
.ph-stats .ph-last { color: #98a6ba; }
.park-body { padding: 12px 16px; display: grid; gap: 10px; background: #fcfdff; }
.building-row { display: flex; gap: 12px; align-items: flex-start; padding-top: 8px; border-top: 1px dashed #edf1f7; }
.building-row:first-child { border-top: none; padding-top: 0; }
.building-name { width: 190px; flex: none; font-weight: 600; font-size: 13px; padding-top: 2px; }
.bn-top { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.bn-top > span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 楼宇名右侧的收起 / 展开按钮：< 收起环网，> 展开环网 */
.bn-toggle {
  width: 22px; height: 22px; flex: none; padding: 0; margin-left: auto;
  border: 1px solid #dfe7f1; background: #fff; color: #5b7ba0; border-radius: 5px;
  font: 600 12px/20px ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  text-align: center; cursor: pointer;
}
.bn-toggle:hover { background: #f2f7fd; color: #2f6fb3; border-color: #c8dcf1; }
.building-row.closed { align-items: center; }
.building-row.closed .building-name { padding-top: 0; }
.bn-sub { font-size: 11.5px; color: #8b9ab0; margin-top: 3px; font-weight: 400; }
/* 楼栋级客户小标签：蓝色=继承园区，橙色=本栋单独指定 */
.cu-chip {
  font-size: 11px; font-weight: 600; color: #3b6ea5; background: #eef4fb;
  border: 1px solid #d8e5f3; padding: 1px 7px; border-radius: 999px;
}
.cu-chip.own { color: #a86200; background: #fff5e2; border-color: #f5dcaa; }
.cu-chip.none { color: #98a6ba; background: #f5f7fa; border-color: #e2e8f0; font-weight: 500; }
/* 本栋环网分属多个客户 */
.cu-chip.mix { color: #6b3fa0; background: #f4effc; border-color: #e0d3f5; }
.bn-sub.bn-mix { color: #6b7c93; font-weight: 500; }
.loop-wrap { flex: 1; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 6px; }
.loop-card { border: 1px solid #e6ecf4; border-radius: 8px; padding: 9px 11px; background: #fbfdff; }
.loop-card .lc-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.loop-card .lc-name { font-size: 13px; font-weight: 600; }
.loop-card .lc-meta { font-size: 11.5px; color: #7b8ca4; margin-top: 3px; line-height: 1.6; }
/* 楼宇内的环网用紧凑行条：一行一个环网，鼠标悬停看完整信息（title） */
.loop-card.mini {
  display: flex; align-items: center; gap: 7px; min-height: 28px;
  padding: 3px 8px; border-radius: 6px; background: #fff;
}
.loop-card.mini:hover { background: #f7fbff; border-color: #cfe0f2; }
.loop-card.mini.bad { background: #fffaf9; border-color: #f6d5d0; }
.loop-card.mini .lm-name {
  flex: none; max-width: 118px; font-size: 12.5px; font-weight: 600; color: #1f3350;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.loop-card.mini .lm-info {
  flex: 1; min-width: 0; font-size: 11px; color: #8b9ab0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* 环网单独指定了客户（与所在楼宇默认客户不同）才显示这个小标签 */
.loop-card.mini .lm-cust {
  flex: none; max-width: 68px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 10.5px; font-weight: 600; line-height: 15px; padding: 0 5px; border-radius: 999px;
  color: #a86200; background: #fff5e2; border: 1px solid #f5dcaa;
}
.loop-card.mini .lm-acts { flex: none; display: flex; gap: 4px; }
.loop-card.mini .lm-acts .btn.tiny { padding: 1px 7px; font-size: 11.5px; line-height: 1.5; }
.loop-card.mini .tag { flex: none; font-size: 10.5px; padding: 0 6px; line-height: 16px; }

/* ---------- 标准编辑 ---------- */
.std-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(390px, 1fr)); gap: 10px; }
.std-item {
  border: 1px solid #e6ecf4; border-radius: 9px; padding: 10px 12px; background: #fbfdff;
  display: grid; grid-template-columns: 1fr 84px 84px 84px; gap: 8px; align-items: center;
}
.std-item .si-name { font-size: 13px; }
.std-item .si-unit { font-size: 11px; color: #8b9ab0; }
.std-item input { border: 1px solid #d7e0ec; border-radius: 6px; padding: 6px 8px; width: 100%; font-size: 13px; }
.std-item input[readonly] { background: #f1f4f8; color: #8b9ab0; }

/* ---------- 录入表单 ---------- */
/* 本栋环网一览：点击选中录入，末尾「+」新增环网 */
.lp-wrap { margin-top: 12px; }
.lp-empty { font-size: 12.5px; color: #8b9ab0; padding: 8px 2px; }
.lp-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; font-size: 12.5px; color: #41546e; margin-bottom: 8px; }
.lp-head .lp-tip { margin-left: auto; font-size: 11.5px; color: #8b9ab0; }
.lp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 6px; }
.lp-item {
  display: flex; align-items: center; gap: 6px; padding: 6px 9px; min-height: 30px;
  border: 1px solid #e3ebf5; border-radius: 8px; background: #fff; cursor: pointer;
  font-size: 12.5px; color: #34465e; transition: border-color 0.12s, background 0.12s;
}
.lp-item:hover { border-color: #9ecbff; background: #f7fbff; }
.lp-item.on { border-color: #2c7be5; background: #eef6ff; box-shadow: inset 0 0 0 1px #2c7be5; font-weight: 600; }
.lp-item.bad { border-color: #f6cdc9; background: #fff8f7; }
.lp-item.bad.on { border-color: #d92d20; background: #fff1f0; box-shadow: inset 0 0 0 1px #d92d20; }
.lp-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lp-dot { width: 6px; height: 6px; border-radius: 50%; background: #c9d6e6; flex: 0 0 auto; }
.lp-dot.ok { background: #12b76a; }
.lp-dot.bad { background: #e5484d; }
.lp-dot.done { background: #7fcfa9; }
.lp-dot.none { background: #c9d6e6; }
.lp-flag { flex: 0 0 auto; font-size: 10.5px; font-weight: 700; color: #d92d20; background: #feecea; border-radius: 9px; padding: 0 5px; line-height: 16px; }
.lp-add { justify-content: center; border-style: dashed; border-color: #a9cdf8; color: #2c7be5; font-weight: 600; }
.lp-add:hover { background: #eef6ff; }

.entry-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.entry-item { border: 1px solid #e6ecf4; border-radius: 9px; padding: 10px 12px; background: #fbfdff; }
.entry-item.out { border-color: #fac9c4; background: #fff7f6; box-shadow: 0 0 0 2px rgba(217, 45, 32, 0.06); }
.entry-item .ei-top { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-bottom: 6px; }
.entry-item .ei-name { font-size: 13px; font-weight: 600; }
.entry-item .ei-range { font-size: 11.5px; color: #7b8ca4; }
.entry-item input { width: 100%; border: 1px solid #d7e0ec; border-radius: 6px; padding: 7px 9px; font-size: 14px; }
.entry-item.out input { border-color: #e88b80; color: #d92d20; font-weight: 600; }
.entry-item .ei-verdict { font-size: 11.5px; color: #d92d20; margin-top: 5px; min-height: 16px; }

/* ---------- 录入 · 表格模式（行为环网、列为指标） ---------- */
.tb-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.tb-bar .desc { font-size: 12px; color: #7b8ca4; margin-left: auto; }
.tb-inline { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; color: #41546e; cursor: pointer; }
.tb-tip { font-size: 11.5px; color: #8b9ab0; }
.tb-wrap { overflow: auto; max-height: 60vh; border: 1px solid #e6ecf4; border-radius: 10px; }
/* 表格模式末尾「+ 新增环网」行 */
.tb-addrow td { background: #fbfdff; border-top: 1px dashed #d9e4f2; padding: 8px 12px; }
.tb-addrow .btn { color: #2c7be5; border-color: #a9cdf8; background: #f4f9ff; }
.tb-addrow .btn:hover { background: #e8f3ff; border-color: #7fb6ee; }
.tb-addrow .tb-tip { margin-left: 8px; }
/* 刚新增的环网行（4 秒后自动取消高亮） */
.entry-table tr.tb-new td { background: #fff8e1; }
.entry-table { border-collapse: separate; border-spacing: 0; width: 100%; font-size: 13px; }
.entry-table th, .entry-table td {
  border-bottom: 1px solid #eef2f7; padding: 4px 8px; white-space: nowrap; text-align: left;
}
.entry-table thead th {
  position: sticky; top: 0; z-index: 2; background: #f4f8fd; color: #54677f;
  font-size: 12px; font-weight: 600; padding: 7px 8px;
}
.entry-table thead th small { color: #8b9ab0; font-weight: 500; }
/* 首列（环网名）左侧固定，横向滚动时不丢参照 */
.entry-table th.c-name, .entry-table td.c-name {
  position: sticky; left: 0; z-index: 1; background: #fff; min-width: 132px;
}
.entry-table thead th.c-name { z-index: 3; background: #f4f8fd; }
.entry-table th.c-pick, .entry-table td.c-pick {
  position: sticky; left: 0; z-index: 3; width: 34px; text-align: center; background: #fff;
}
.entry-table thead th.c-pick { z-index: 4; background: #f4f8fd; }
.entry-table th.c-pick + th.c-name, .entry-table td.c-pick + td.c-name { left: 34px; }
.entry-table tbody tr:hover td { background: #f7fbff; }
.entry-table tbody tr:hover td.c-name, .entry-table tbody tr:hover td.c-pick { background: #f7fbff; }
.entry-table .tb-loop { font-size: 13px; font-weight: 600; color: #2b3b52; }
.entry-table .tb-sub { font-size: 11px; color: #8b9ab0; margin-top: 1px; }
.entry-table .tb-sub .tb-ok { color: #0a7a4c; font-weight: 500; }
.entry-table input[type='number'], .entry-table input.tb-no,
.entry-table select { border: 1px solid #d7e0ec; border-radius: 6px; padding: 5px 7px; font-size: 13px; background: #fbfdff; }
.entry-table input[type='number'] { width: 86px; text-align: right; }
.entry-table input.tb-no { width: 92px; }
.entry-table select.tb-coolant { width: 84px; }
.entry-table select.tb-std { width: 172px; }
.entry-table input:focus, .entry-table select:focus {
  border-color: #2f8fd6; box-shadow: 0 0 0 2px rgba(47, 143, 214, 0.13); outline: none;
}
.entry-table input.out { border-color: #e88b80; background: #fff7f6; color: #d92d20; font-weight: 600; }
.entry-table .tb-verdict { font-size: 12px; color: #8b9ab0; min-width: 62px; }
.entry-table .tb-verdict.bad { color: #d92d20; font-weight: 600; }
.entry-table .tb-verdict.good { color: #0a7a4c; }
.entry-table tfoot td { background: #f7fafd; font-size: 11.5px; color: #54677f; padding: 5px 8px; }
.entry-table .tb-out { color: #d92d20; font-weight: 600; }
.tb-remark { border: 1px solid #d7e0ec; border-radius: 8px; padding: 7px 10px; font-size: 13px; width: 240px; }
.tb-remark:focus { border-color: #2f8fd6; box-shadow: 0 0 0 2px rgba(47, 143, 214, 0.13); outline: none; }

.form-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin-bottom: 12px; }

.pick-map { height: 240px; border: 1px solid #d7e0ec; border-radius: 8px; margin-top: 6px; }
/* 地图右上角「海外底图」开关：强制叠加全球底图 */
.pick-map-wrap { position: relative; }
.pick-ovs {
  position: absolute; top: 12px; left: 10px; z-index: 5;
  background: rgba(255,255,255,0.94); border: 1px solid #c9d7e8; color: #33506e;
  box-shadow: 0 2px 8px rgba(20,44,74,0.12);
}
.pick-ovs.active { background: #2f8fd6; border-color: #2f8fd6; color: #fff; }
.pick-hint { font-size: 11.5px; color: #7b8ca4; margin-top: 4px; }
.pick-search { display: flex; gap: 8px; }
.pick-search input { flex: 1; border: 1px solid #d7e0ec; border-radius: 8px; padding: 7px 10px; font-size: 13px; min-width: 0; }
.pick-results { margin-top: 6px; display: flex; flex-direction: column; gap: 4px; }
.pick-result { border: 1px solid #e6ecf4; border-radius: 8px; padding: 7px 10px; background: #fbfdff; cursor: pointer; transition: 0.15s; }
.pick-result:hover { border-color: #2f8fd6; background: #f3f9ff; }
.pr-title { font-size: 13px; font-weight: 600; color: #2b3b52; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.pr-addr { font-size: 11.5px; color: #7b8ca4; margin-top: 2px; }
/* 搜索结果来源标签：区分已建园区 / 常用地点 / 在线地图 */
.pr-src {
  font-size: 10.5px; font-weight: 500; padding: 1px 6px; border-radius: 999px;
  border: 1px solid transparent; line-height: 1.6; white-space: nowrap;
}
.pr-src.src-park { background: #e9f9f1; color: #0a7a4c; border-color: #b8e6cf; }
.pr-src.src-place { background: #eaf4fe; color: #1668b3; border-color: #c2ddf7; }
.pr-src.src-online { background: #f4f1fd; color: #5b3fa8; border-color: #d9d0f5; }
/* 在线检索的模糊结果：名称与关键词无交集，弱化显示避免误选 */
.pick-result.fuzzy { opacity: 0.62; background: #fcfdfe; }
.pick-result.fuzzy:hover { opacity: 1; }
.pr-fuzzy {
  font-size: 10.5px; font-weight: 500; padding: 1px 6px; border-radius: 999px;
  background: #fdf3e7; color: #9a5b10; border: 1px solid #f2dcbc; white-space: nowrap;
}
.pick-loading { font-size: 12px; color: #8b9ab0; padding: 6px 2px; }
.pick-picked-row { display: flex; gap: 8px; align-items: flex-start; margin-top: 6px; }
.pick-picked { flex: 1; font-size: 12px; color: #165a94; background: #eaf4fd; border: 1px solid #c2ddf7; border-radius: 8px; padding: 6px 10px; word-break: break-all; min-width: 0; }
.pick-picked-row .btn.tiny { flex: none; white-space: nowrap; }

/* ---------- 导入 ---------- */
.import-drop {
  border: 2px dashed #c8d8ea; border-radius: 12px; padding: 26px; text-align: center; background: #fbfdff;
  cursor: pointer; transition: 0.15s;
}
.import-drop:hover { border-color: #2f8fd6; background: #f2f8ff; }
.import-drop b { display: block; margin-bottom: 4px; }
.import-drop span { font-size: 12.5px; color: #7b8ca4; }
.result-box { max-height: 320px; overflow-y: auto; border: 1px solid #e6ecf4; border-radius: 8px; }
.result-line { padding: 7px 11px; border-bottom: 1px solid #f0f4f9; font-size: 12.5px; display: flex; gap: 10px; }
.result-line .rl-no { width: 54px; color: #8b9ab0; flex: none; }
.result-line.fail { background: #fff5f4; }
.chk { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; }

/* ---------- 弹窗 ---------- */
.modal-layer { position: fixed; inset: 0; background: rgba(13, 32, 56, 0.42); display: flex; align-items: center; justify-content: center; z-index: 90; }
.modal-box { background: #fff; border-radius: 12px; width: 620px; max-width: calc(100vw - 40px); max-height: 88vh; display: flex; flex-direction: column; }
.modal-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid #e6ecf4; }
.modal-head h3 { font-size: 15.5px; }
.modal-x { background: none; border: none; font-size: 20px; color: #8b9ab0; cursor: pointer; line-height: 1; }
.modal-body { padding: 16px 18px; overflow-y: auto; }
.modal-foot { padding: 12px 18px; border-top: 1px solid #e6ecf4; display: flex; justify-content: flex-end; gap: 8px; }

.detail-items { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }
.detail-item { border: 1px solid #e6ecf4; border-radius: 8px; padding: 8px 10px; }
.detail-item.out { border-color: #fac9c4; background: #fff5f4; }
.detail-item .di-n { font-size: 12px; color: #54677f; }
.detail-item .di-v { font-size: 16px; font-weight: 700; margin-top: 2px; }
.detail-item.out .di-v { color: #d92d20; }
.detail-item .di-r { font-size: 11px; color: #8b9ab0; }

/* ---------- 历史与趋势：园区 / 楼宇 / 环网 数据记录板块 ---------- */
.hb-tools { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.hb-kw { flex: 1 1 200px; max-width: 320px; padding: 6px 10px; border: 1px solid #d7e0ec; border-radius: 8px; font-size: 12.5px; }
.hb-kw:focus { outline: none; border-color: #2f8fd6; }
.hb-ck { display: flex; align-items: center; gap: 5px; font-size: 12.5px; color: #4a5f78; cursor: pointer; }
.hb-ck input { accent-color: #1a6fb0; }
.hb-hint { font-size: 11.5px; color: #8b9ab0; margin-left: auto; }
.ht-tip { margin-top: 6px; font-size: 11.5px; color: #8b9ab0; }

.hb-park { border: 1px solid #e4ebf3; border-radius: 10px; margin-bottom: 9px; overflow: hidden; }
.hb-park-head { display: flex; align-items: center; gap: 8px; padding: 9px 12px; background: #f5f9fd; cursor: pointer; }
.hb-park-head b { font-size: 13.5px; color: #1f3a56; }
.hb-building { border-top: 1px solid #eef2f7; }
.hb-b-head { display: flex; align-items: center; gap: 8px; padding: 7px 12px 7px 24px; background: #fbfdff; cursor: pointer; }
.hb-b-head b { font-size: 12.8px; color: #24405c; }
.hb-caret { color: #8b9ab0; font-size: 11px; width: 10px; flex: none; }
.hb-meta { font-size: 11.5px; color: #7b8ca4; }
.hb-tags { margin-left: auto; display: flex; gap: 6px; align-items: center; }
.hb-park.collapsed .hb-body, .hb-building.collapsed .hb-loops { display: none; }

.hb-loops { overflow-x: auto; }
.hb-loop {
  display: grid; grid-template-columns: minmax(104px, 1.5fr) minmax(84px, 1.1fr) 72px 74px 72px 84px 52px 88px;
  align-items: center; gap: 8px; padding: 5px 12px 5px 30px;
  border-top: 1px solid #f2f6fa; font-size: 12.5px; cursor: pointer;
}
.hb-loop:hover { background: #f4f9ff; }
.hb-loop.bad { background: #fff7f6; }
.hb-loop.bad:hover { background: #ffefed; }
.hb-l-name { font-weight: 600; color: #24405c; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hb-l-sub { font-size: 11px; color: #8b9ab0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hb-td { text-align: center; color: #54677f; }
.hb-sparkcell { display: flex; align-items: center; justify-content: center; }
.hb-spark { display: block; }
.hb-spark-empty { color: #c9d3e0; }
.hb-val { font-weight: 700; color: #24405c; }
.hb-trend.up { color: #c2410c; font-weight: 600; }
.hb-trend.down { color: #1a6fb0; font-weight: 600; }
.hb-trend.flat, .hb-trend.none { color: #8b9ab0; }
.hb-rec { color: #54677f; }
.hb-date { color: #7b8ca4; font-size: 11.5px; }

/* ---------- 历史与趋势：成批次检测数据表 ---------- */
.ht-scroll { max-height: 660px; }
/* 列宽按内容收缩：指标列不再被拉宽，数值与表头对齐在同一列中心 */
.ht { width: auto; }
.ht th, .ht td { white-space: nowrap; }
.ht .ht-num { text-align: center; font-variant-numeric: tabular-nums; color: #34465e; }
/* 指标列表头：名称在上、单位小字在下，列宽只占名称宽度 */
.ht .ht-th-num { text-align: center; width: 1%; padding: 6px 9px; border-left: 1px solid #f1f6fb; }
.ht .ht-col-u { display: block; font-size: 10px; line-height: 1.3; color: #93a3b8; font-style: normal; font-weight: 400; }
.ht td.ht-num { border-left: 1px solid #f6f9fd; }
/* 超标单元格：红字 + 浅红底，箭头上/下表示超上限 / 低于下限 */
.ht .ht-num.bad { color: #d92d20; font-weight: 700; background: #fff3f2; }
.ht .ht-name { font-weight: 600; color: #24405c; }
.ht .ht-date { font-weight: 600; color: #24405c; }
.ht tbody tr.ht-row:hover td { background: #f7fbff; }
.ht tr.ht-row.bad td { background: #fff8f7; }
.ht tr.ht-row.bad:hover td { background: #ffefed; }
/* 分组行：园区 / 楼宇 / 环网 / 批次，点击折叠 */
.ht-grp td { cursor: pointer; }
.ht-grp-park td { background: #eef4fb; padding-left: 12px; }
.ht-grp-building td { background: #f5f9fd; padding-left: 24px; }
.ht-grp-loop td { background: #fafdff; padding-left: 36px; }
.ht-grp-loop.bad td { background: #fff6f5; }
.ht-grp-date td { background: #eef6fd; padding-left: 12px; }
.ht-grp td b { color: #1f3a56; font-size: 13px; }
.ht-grp .ht-sparkcell { display: inline-flex; align-items: center; margin: 0 10px; vertical-align: middle; }
.ht-grp .tag, .ht-grp .hb-meta { margin-left: 8px; }
.ht-grp button { margin-left: 10px; }
/* 每个环网 / 批次数据上方的重复表头：紧贴数据行，指标名与数值同列便于对读 */
.ht .ht-subhead td {
  background: #f7fafd; color: #5a6b82; font-weight: 600; font-size: 12px;
  padding: 5px 10px; border-top: 1px solid #eef2f7; border-bottom: 1px solid #e4ebf3;
}
.ht .ht-subhead td.ht-num { text-align: center; color: #5a6b82; font-weight: 600; }
.ht .ht-subhead td:first-child { background: #f7fafd; }
.ht .ht-subhead .ht-col-u { color: #93a3b8; font-size: 10px; }
/* 阶段 / 检测单位等长文本列限宽省略，避免把指标列挤远 */
/* 水质阶段：同样可就地编辑，宽度比检测单位略宽 */
.ht .ht-phase { max-width: 210px; padding: 3px 6px; }
.ht .ht-phase .ht-edit { min-width: 110px; }
/* 检测单位：点击即可就地编辑 */
.ht .ht-org { max-width: 150px; padding: 3px 6px; }
.ht .ht-edit {
  width: 100%; min-width: 96px; box-sizing: border-box; font: inherit; font-size: 12.5px; color: #34465e;
  border: 1px solid transparent; background: #fff; border-radius: 6px; padding: 4px 6px; transition: 0.15s;
}
.ht .ht-edit:hover { border-color: #cfdcec; }
.ht .ht-edit:focus { border-color: #2f8fd6; box-shadow: 0 0 0 3px rgba(47, 143, 214, 0.14); outline: none; }
.ht .ht-edit::placeholder { color: #bdc8d6; }
.ht .ht-edit:disabled { opacity: 0.55; background: #f7fafd; }
/* 首列跟随横向滚动，保证指标多时仍能看到批次 / 环网 */
.ht th:first-child, .ht td:first-child { position: sticky; left: 0; background: #fff; }
.ht thead th:first-child { background: #f7fafd; z-index: 3; }
.ht .ht-grp-park td:first-child { background: #eef4fb; }
.ht .ht-grp-building td:first-child { background: #f5f9fd; }
.ht .ht-grp-loop td:first-child { background: #fafdff; }
.ht .ht-grp-loop.bad td:first-child { background: #fff6f5; }
.ht .ht-grp-date td:first-child { background: #eef6fd; }
.ht .ht-row.bad td:first-child { background: #fff8f7; }
.ht .ht-row:hover td:first-child { background: #f7fbff; }

@media (max-width: 900px) {
  .sidebar { width: 62px; }
  .brand-text, .mi span, .me { display: none; }
  .mi { justify-content: center; }
}
.hidden { display: none !important; }

/* ---------------------------------------------------------------- 报告管理 */
.rp-tabbar { display: flex; align-items: center; gap: 14px; padding: 10px 16px; }
.rp-tabs { display: flex; gap: 6px; }
.rp-tab { border: 1px solid #dbe4ef; background: #f7fafd; color: #3f5570; border-radius: 8px; padding: 6px 14px; font-size: 13px; cursor: pointer; }
.rp-tab:hover { border-color: #9fc2e0; }
.rp-tab.active { background: #1a6fb0; border-color: #1a6fb0; color: #fff; font-weight: 600; }
.tpl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(265px, 1fr)); gap: 14px; }
.tpl-card { border: 1px solid #e2eaf4; border-radius: 12px; padding: 14px 16px; background: #fbfdff; display: flex; flex-direction: column; gap: 8px; }
.tpl-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.tpl-head strong { color: #1f3a56; font-size: 14px; }
.tpl-desc { margin: 0; font-size: 12.5px; color: #5d718a; line-height: 1.65; min-height: 40px; }
.tpl-meta { font-size: 11.5px; color: #8b9ab0; }
.tpl-acts { display: flex; gap: 6px; margin-top: auto; padding-top: 4px; }
/* 报告模版卡片区（变量说明面板已移除，仅保留模版卡片） */
.rpt-scroll { max-height: 460px; }
table.rpt-pick tr.sel td { background: #eef7ff; }
table.rpt-pick td, table.rpt-list td { font-size: 12.5px; vertical-align: middle; }
table.rpt-pick td:first-child, table.rpt-pick th:first-child { text-align: center; padding-left: 6px; padding-right: 6px; }
.field.block { display: block; margin-top: 10px; }
.field.block textarea { width: 100%; box-sizing: border-box; font-family: inherit; font-size: 12.5px; padding: 8px 10px; border: 1px solid #dbe4ef; border-radius: 8px; color: #25384f; background: #fbfdff; resize: vertical; }

.rp-check { display: inline-flex; align-items: center; gap: 5px; height: 30px; font-size: 12.5px; color: #3f5570; }
.rp-check input { width: 14px; height: 14px; margin: 0; accent-color: #1a6fb0; }

/* 全屏报告视图（预览 / 编辑 / 模版编辑） */
.rp-overlay { position: fixed; inset: 0; z-index: 90; background: #eef2f7; display: flex; flex-direction: column; }
.rp-ov-head { display: flex; align-items: center; gap: 12px; padding: 10px 18px; background: #fff; border-bottom: 1px solid #e2eaf4; box-shadow: 0 1px 6px rgba(15, 32, 56, .06); flex-wrap: wrap; }
.rp-ov-head strong { font-size: 14px; color: #1f3a56; }
.rp-ov-hint { font-size: 11.5px; color: #8b9ab0; }
.rp-ov-acts { margin-left: auto; display: flex; gap: 8px; }
.rp-ov-img { display: inline-flex; align-items: center; gap: 6px; padding: 3px 8px; background: #f4f8fd; border: 1px solid #dbe4ef; border-radius: 8px; }
.rp-ov-img[hidden] { display: none; }
/* 报告里选中图片后的浮动手柄：缩放 + 删除 */
.rp-img-box { position: absolute; z-index: 6; pointer-events: none; outline: 2px solid #1a6fb0; outline-offset: 1px; }
.rp-img-box .rp-img-bar {
  position: absolute; top: -32px; right: 0; display: flex; gap: 4px; pointer-events: auto;
  background: #fff; border: 1px solid #dbe4ef; border-radius: 7px; padding: 3px; box-shadow: 0 2px 8px rgba(15, 32, 56, .14); white-space: nowrap;
}
.rp-img-box.rp-img-box-in .rp-img-bar { top: 3px; right: 3px; }
.rp-img-box .rp-img-bar button {
  border: 1px solid #dbe4ef; background: #f7fafd; color: #25384f; border-radius: 5px;
  padding: 2px 8px; font-size: 11.5px; line-height: 1.5; cursor: pointer;
}
.rp-img-box .rp-img-bar button:hover { background: #eaf2fb; border-color: #9dc2e6; }
.rp-img-box .rp-img-bar button[data-act="del"] { color: #c0392b; border-color: #f0d2ce; background: #fdf4f3; }
.rp-img-box .rp-img-tag { font-size: 11px; color: #6b7c93; padding: 2px 4px; line-height: 1.5; }
.rp-img-handle {
  position: absolute; right: -8px; bottom: -8px; width: 15px; height: 15px; pointer-events: auto;
  background: #1a6fb0; border: 2px solid #fff; border-radius: 50%; cursor: nwse-resize; box-shadow: 0 1px 4px rgba(0, 0, 0, .28);
}
.rp-ov-img .lbl { font-size: 11.5px; color: #6b7c93; }
.rp-ov-img select { padding: 3px 6px; font-size: 12px; border: 1px solid #dbe4ef; border-radius: 6px; background: #fff; color: #25384f; }
.rp-ov-meta { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; padding: 10px 18px; background: #fff; border-bottom: 1px solid #e2eaf4; }
.rp-ov-meta .field { margin: 0; }
.rp-ov-meta .field.grow { flex: 1; min-width: 240px; }
.rp-ov-body { flex: 1; overflow: auto; padding: 18px 0 44px; }
.rp-editable { outline: none; }
.rp-editable:focus .rp-page { box-shadow: 0 0 0 2px rgba(26, 111, 176, .35), 0 2px 12px rgba(15, 32, 56, .12); }
.rp-ov-code { flex: 1; overflow: auto; padding: 12px 18px 44px; display: flex; flex-direction: column; gap: 4px; background: #fff; }
.rp-ov-code label { font-size: 12px; color: #4a5f79; margin-top: 8px; }
.rp-ov-code textarea { width: 100%; box-sizing: border-box; min-height: 230px; font-family: ui-monospace, Menlo, monospace; font-size: 12px; line-height: 1.6; border: 1px solid #dbe4ef; border-radius: 8px; padding: 10px; background: #fbfdff; color: #25384f; }
.rp-ov-code #tplCss { min-height: 160px; }
