/* ============ 全局 ============ */
:root {
  --primary: #2E7CF6;          /* 电光蓝：主操作 / 选中 / 链接 */
  --primary-light: #eaf2fe;
  --primary-dark: #1B5FD0;     /* 深电光蓝：标题强调 */
  --accent: #E5484D;           /* 朱红：下跌 / 告警 */
  --green: #12B76A;            /* 翡翠绿：上涨 / 新能源 / 西电 */
  --amber: #F5A623;            /* 琥珀：电价 / 预警 */
  --gas-orange: #F97316;       /* 燃气橙：天然气 / 供热 */
  --carbon-purple: #7C5CFC;    /* 碳紫：碳市场 */
  --bg: #F4F6FA;               /* 内容底色 */
  --card: #ffffff;
  --border: #e3ecf7;
  --line: #e3ecf7;             /* 卡片/胶囊边框（工作台组件共用） */
  --text: #22303f;
  --text-sub: #64748b;
  --shadow: 0 1px 3px rgba(16, 42, 83, .08);
  --radius: 10px;

  /* —— 布局令牌（自适应 v2）：页宽上限 / 侧栏宽 / 卡片最小宽 —— */
  --page-max: 2560px;              /* 大屏内容上限（原先固定 1900px，2K/4K 屏两侧留白过多） */
  --side-w: 224px;                 /* 左侧导航宽（收起态 64px） */
  --card-min: 240px;               /* 卡片行单卡基准宽（决定每行能放几张） */

  /* —— 统一增强令牌（新增，不改既有语义） —— */
  --brand: #2E7CF6;                 /* = --primary：修复历史未定义引用并统一命名 */
  --ink: #22303f;                   /* = --text：主文本色 */
  --brand-grad: linear-gradient(135deg, #3B8AFB 0%, #2E7CF6 55%, #1B5FD0 100%); /* 品牌渐变：选中/主操作 */
  --shadow-sm: 0 1px 2px rgba(16, 42, 83, .06);
  --shadow-md: 0 6px 18px rgba(16, 42, 83, .12);
  --shadow-lg: 0 14px 40px rgba(16, 42, 83, .18);
  --ring: 0 0 0 3px rgba(46, 124, 246, .22);          /* 统一焦点光环 */
  --t-fast: .12s ease;                                /* 微交互（hover/active） */
  --t: .18s cubic-bezier(.4, 0, .2, 1);               /* 常规过渡 */
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: "Microsoft YaHei", "PingFang SC", "Segoe UI", system-ui, sans-serif;
  font-variant-numeric: tabular-nums; /* 全站数字等宽对齐（设计 token） */
  background: var(--bg);
  color: var(--text);
  font-size: 14px;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  padding-left: var(--side-w); /* 左侧固定侧边栏宽度（与 .side-nav width 同步，统一走 --side-w） */
}
body.embed { padding-left: 0; } /* iframe 嵌入模式：无侧边栏 */

/* ============ 左侧固定侧边栏（品牌 + 首页/报价/日前/实时/复盘/燃料/碳 分组导航 + 搜索收藏 + 数据状态） ============ */
.side-nav {
  position: fixed;
  left: 0; top: 0; bottom: 0;
  width: 224px;
  z-index: 100;
  background: linear-gradient(165deg, #081426 0%, #0E2A4D 60%, #123559 100%);
  color: #fff;
  display: flex;
  flex-direction: column;
  box-shadow: 2px 0 12px rgba(6, 16, 32, .35);
}
.side-brand {
  display: flex; align-items: center; gap: 10px;
  padding: 16px 16px 14px;
  text-decoration: none; color: #fff;
  border-bottom: 1px solid rgba(255, 255, 255, .12);
  flex: none;
}
.side-logo {
  width: 36px; height: 36px;
  background: linear-gradient(135deg, #2E7CF6, #1B5FD0);
  border-radius: 9px;
  display: flex; align-items: center; justify-content: center;
  flex: none;
  box-shadow: 0 2px 8px rgba(46, 124, 246, .35);
}
.side-name { font-size: 14.5px; font-weight: 700; letter-spacing: 1px; line-height: 1.35; }
/* 品牌行：logo+名称 与 顶部收缩按钮 同排（2026-10-14 收缩开关上移，更显眼） */
.side-brandrow {
  display: flex; align-items: center; gap: 6px;
  padding-right: 10px;
  border-bottom: 1px solid rgba(255, 255, 255, .12);
  flex: none;
}
.side-brandrow .side-brand { flex: 1; min-width: 0; border-bottom: none; }
.side-collapse-top {
  flex: none; width: 26px; height: 26px;
  border: none; border-radius: 7px;
  background: rgba(255, 255, 255, .08);
  color: rgba(255, 255, 255, .75);
  font-size: 14px; line-height: 1; font-family: inherit;
  cursor: pointer;
  transition: background .12s, color .12s;
}
.side-collapse-top:hover { background: rgba(255, 255, 255, .18); color: #fff; }
.side-groups { flex: 1; padding: 4px 10px 10px; overflow-y: auto; min-height: 0; }
.side-group {
  display: flex; align-items: center; gap: 9px;
  width: 100%;
  margin: 16px 0 6px;
  padding: 5px 10px;
  color: rgba(255, 255, 255, .45);
  font-size: 11px; font-weight: 800; letter-spacing: 1px; font-family: inherit;
  text-align: left;
  text-decoration: none;
  background: none; border: none; cursor: pointer;
  border-radius: 7px;
  position: relative;
  transition: background .12s, color .12s;
}
.side-groups > .side-group:first-child { margin-top: 6px; }
/* 顶级区块之间加分隔线，强化"分组标题"的段落感 */
.side-groups > .side-group:not(:first-child) {
  border-top: 1px solid rgba(255, 255, 255, .07);
  margin-top: 13px; padding-top: 12px;
}
.side-group:hover { color: rgba(255, 255, 255, .88); background: rgba(255, 255, 255, .04); }
.side-group.on { color: #fff; background: rgba(46, 124, 246, .16); }
.side-group.on .si-ico { filter: drop-shadow(0 0 3px rgba(76, 154, 255, .6)); }
/* 当前区块左侧高亮条 */
.side-group.on::before {
  content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 3px; height: 15px; border-radius: 0 3px 3px 0; background: #4C9AFF;
}

/* ============ 信息披露总览（KPI 卡 / 双列图 / 导航卡） ============ */
.kpi-grid {
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px;
  padding: 0 16px 14px;
}
.kpi-card {
  background: linear-gradient(180deg, #f7fafd, #fff);
  border: 1px solid #dbe7f3; border-radius: 10px;
  padding: 12px 14px 10px;
  box-shadow: 0 1px 3px rgba(16, 42, 83, .05);
}
.kpi-label { font-size: 12px; color: #64748b; margin-bottom: 4px; }
.kpi-value { font-size: 22px; font-weight: 800; color: #124a90; font-variant-numeric: tabular-nums; }
.kpi-value:first-letter { letter-spacing: 0; }
.kpi-sub { font-size: 11px; color: #94a3b8; margin-top: 4px; }
.heat-grid-2 {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.heat-grid-2 .heat-chart-card { margin-bottom: 0; }
.nav-cards {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px;
  padding: 0 16px 14px;
}
.nav-card {
  display: flex; flex-direction: column; gap: 5px;
  background: linear-gradient(180deg, #f7fafd, #fff);
  border: 1px solid #dbe7f3; border-radius: 10px;
  padding: 14px 14px 12px;
  text-decoration: none;
  transition: transform .12s, box-shadow .12s, border-color .12s;
}
.nav-card:hover {
  transform: translateY(-2px);
  border-color: #7db4e8;
  box-shadow: 0 4px 12px rgba(26, 95, 180, .12);
}
.nav-card .nc-ico { font-size: 22px; font-style: normal; }
.nav-card .nc-t { font-size: 14.5px; font-weight: 700; color: #124a90; }
.nav-card .nc-d { font-size: 11.5px; color: #7c8aa0; line-height: 1.5; }
@media (max-width: 1200px) {
  .kpi-grid { grid-template-columns: repeat(3, 1fr); }
  .nav-cards { grid-template-columns: repeat(3, 1fr); }
  .heat-grid-2 { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .kpi-grid { grid-template-columns: repeat(2, 1fr); }
  .nav-cards { grid-template-columns: repeat(2, 1fr); }
}

/* ============ 周对比分析 ============ */
.wk-delta { font-weight: 700; }
.wk-delta.up { color: #12B76A; }
.wk-delta.down { color: #E5484D; }
.wk-b { color: #64748b; background: rgba(125, 180, 232, .06); }
.wk-total td { font-weight: 700; background: #f2f7fc; border-top: 2px solid #c9d7ea; }
.si-arrow { margin-left: auto; font-size: 10px; font-style: normal; opacity: .7; transition: transform .15s; }
.side-group.folded .si-arrow { transform: rotate(-90deg); }
.side-group.folded + .side-items { display: none; }
.side-items {
  display: flex; flex-direction: column; gap: 1px;
  margin: 0 0 6px 8px;
  padding-left: 10px;
  border-left: 1px solid rgba(255, 255, 255, .10);
}
/* 嵌套二级分组（如 日前市场 › 日前信息披露） */
.side-group.side-sub {
  margin: 6px 0 3px;
  padding: 6px 10px;
  font-size: 12px; letter-spacing: 1px;
  color: rgba(255, 255, 255, .55);
  background: none;
}
.side-group.side-sub .si-ico { width: 20px; font-size: 12px; }
.side-group.side-sub:hover { color: rgba(255, 255, 255, .9); background: rgba(255, 255, 255, .04); }
.side-group.side-sub.on { color: #fff; background: rgba(46, 124, 246, .14); }
.side-items.side-subitems { margin-left: 8px; padding-left: 10px; }
.side-items.side-subitems .side-link { padding-left: 8px; font-size: 11.5px; }
.side-nav.collapsed .side-group.side-sub { padding: 7px 0; text-align: center; }
.side-nav.collapsed .side-items.side-subitems .side-link { padding-left: 0; font-size: 0; }
/* —— 面包屑导航 —— */
.crumbs { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 10px 0 2px; font-size: 12.5px; font-family: SimHei, "Microsoft YaHei", sans-serif; }
.crumbs .crumb-sep { color: #b6c2d1; }
.crumbs .crumb-link { color: #1a6fd4; text-decoration: none; }
.crumbs .crumb-link:hover { text-decoration: underline; }
.crumbs .crumb-cur { color: #64748b; font-weight: 700; }
.side-link {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 10px 6px 10px;
  color: rgba(255, 255, 255, .80);
  font-size: 12px; font-weight: 500; letter-spacing: .2px; font-family: inherit;
  text-decoration: none; text-align: left;
  border: none; background: none;
  cursor: pointer;
  border-radius: 7px;
  transition: background .12s, color .12s;
}
.side-link:hover { color: #fff; background: rgba(255, 255, 255, .07); }
.side-link.sf-cur {
  color: #fff; font-weight: 700;
  background: #2E7CF6;
  box-shadow: 0 2px 10px rgba(46, 124, 246, .45);
}
.side-foot {
  flex: none;
  padding: 12px 14px;
  border-top: 1px solid rgba(255, 255, 255, .12);
  display: flex; flex-direction: column; gap: 8px; align-items: stretch;
}
.side-foot .data-status { background: rgba(255, 255, 255, .12); font-size: 12px; justify-content: center; }
.side-foot .btn-ghost { width: 100%; }
.side-toggle {
  width: 100%;
  background: rgba(255, 255, 255, .08);
  color: rgba(255, 255, 255, .85);
  border: none; border-radius: 8px;
  padding: 6px 0;
  font-size: 15px; font-family: inherit;
  cursor: pointer;
  transition: background .12s;
}
.side-toggle:hover { background: rgba(255, 255, 255, .18); color: #fff; }
.si-ico { font-style: normal; display: inline-block; width: 20px; text-align: center; flex: none; }
.side-group .si-ico { width: 22px; }

/* ---- 侧边栏收缩态：56px 图标条，文字隐藏，title 悬停提示 ---- */
.side-nav.collapsed { width: 56px; }
body.side-collapsed { padding-left: 56px; }
.side-nav.collapsed .side-name,
.side-nav.collapsed .si-txt,
.side-nav.collapsed .side-foot .data-status,
.side-nav.collapsed .side-foot .btn-ghost { display: none; }
.side-nav.collapsed .side-brandrow { flex-direction: column; gap: 8px; padding: 12px 0 10px; }
.side-nav.collapsed .side-brand { justify-content: center; padding: 0; }
.side-nav.collapsed .side-groups { padding: 10px 8px 12px; }
.side-nav.collapsed .side-group { padding: 7px 0; text-align: center; }
.side-nav.collapsed .side-group .si-arrow { display: none; }
.side-nav.collapsed .side-items { display: flex !important; }  /* 图标条态不折叠 */
.side-nav.collapsed .side-link { padding: 9px 0; text-align: center; }
.side-nav.collapsed .side-link .si-ico { width: 100%; }
/* 收缩态：去掉导轨 / 分隔线 / 缩进 / 高亮条，图标居中 */
.side-nav.collapsed .side-items,
.side-nav.collapsed .side-items.side-subitems { margin-left: 0; padding-left: 0; border-left: none; }
.side-nav.collapsed .side-group { margin: 4px 0; }
.side-nav.collapsed .side-groups > .side-group:not(:first-child) { border-top: none; margin-top: 4px; padding-top: 7px; }
.side-nav.collapsed .side-group.on::before { display: none; }
.side-nav.collapsed .side-group.side-sub { margin: 4px 0; padding: 7px 0; }

/* ============ 重设计 v1：全局搜索 / 我的收藏 / 管理入口 ============ */
.side-search { position: relative; margin: 12px 14px 4px; flex: none; }
.side-search input {
  width: 100%; box-sizing: border-box;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 9px;
  color: #fff; font-size: 13px; font-family: inherit;
  padding: 7px 12px; outline: none;
  transition: border-color .12s, background .12s;
}
.side-search input::placeholder { color: #7A9AC8; }
.side-search input:focus { border-color: rgba(46, 124, 246, .7); background: rgba(255, 255, 255, .12); }
.side-search-res {
  position: absolute; top: calc(100% + 4px); left: 0; right: 0;
  background: #fff; border-radius: 10px; box-shadow: 0 8px 24px rgba(4, 12, 26, .4);
  padding: 6px; display: none; max-height: 280px; overflow: auto; z-index: 120;
}
.side-search-res.show { display: block; }
.side-search-res .sr-item { display: flex; align-items: center; gap: 7px; padding: 7px 9px; border-radius: 7px; color: #22303f; font-size: 13px; cursor: pointer; text-decoration: none; }
.side-search-res .sr-item:hover { background: #eaf2fe; color: #2E7CF6; }
.side-search-res .sr-item .sr-g { font-size: 10.5px; color: #93a3bc; margin-left: auto; }
.side-search-res .sr-empty { padding: 10px; font-size: 12.5px; color: #93a3bc; text-align: center; }
.side-fav { margin: 4px 14px 2px; flex: none; }
.side-fav-title { font-size: 10.5px; letter-spacing: 2px; color: #7A9AC8; padding: 4px 4px 6px; }
.side-fav-list { display: flex; flex-direction: column; gap: 2px; }
.side-fav-item { display: flex; align-items: center; gap: 8px; padding: 6px 9px; border-radius: 8px; color: #c6d7f2; font-size: 12.5px; cursor: pointer; text-decoration: none; border: 1px dashed rgba(255, 255, 255, .12); }
.side-fav-item:hover { background: rgba(255, 255, 255, .07); color: #fff; }
.side-fav-item .fk { font-size: 10px; background: rgba(255, 255, 255, .1); border-radius: 5px; padding: 1px 6px; color: #9fbce8; margin-left: auto; }
.side-fav-empty { color: #5f7fae; font-size: 12px; text-align: center; padding: 6px; border: 1px dashed rgba(255, 255, 255, .1); border-radius: 8px; }
.side-star { margin-left: auto; width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; border-radius: 5px; color: #6c87ae; cursor: pointer; flex: none; font-size: 13px; line-height: 1; }
.side-star:hover { color: #F5A623; }
.side-star.faved { color: #F5A623; }
.side-admin { display: flex; align-items: center; gap: 8px; margin-top: 8px; padding: 7px 10px; border-radius: 8px; color: #c6d7f2; font-size: 12.5px; cursor: pointer; border: 1px solid rgba(255, 255, 255, .12); text-decoration: none; }
.side-admin:hover { background: rgba(255, 255, 255, .07); color: #fff; }
.side-nav.collapsed .side-search,
.side-nav.collapsed .side-fav,
.side-nav.collapsed .side-admin { display: none; }
@media (max-width: 900px) {
  .side-search-res { position: fixed; left: 14px; right: 14px; top: auto; }
}

/* ============ 今日速览（工作台首页 · 阶段2） ============ */
.wb-head { display: flex; align-items: center; gap: 12px; padding: 2px 4px 12px; flex-wrap: wrap; }
.wb-title { font-size: 16px; font-weight: 800; color: #0f2547; }
.wb-title .wb-date { font-size: 12.5px; color: #64748b; font-weight: 500; margin-left: 8px; }
.wb-fresh { margin-left: auto; font-size: 12px; color: #64748b; background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 3px 12px; font-variant-numeric: tabular-nums; }
.wb-kpis { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; padding: 0 0 14px; }
.wb-kpi { display: flex; gap: 10px; align-items: flex-start; background: linear-gradient(180deg, #f7fafd, #fff); border: 1px solid #dbe7f3; border-radius: 12px; padding: 12px 13px 10px; text-decoration: none; box-shadow: 0 1px 3px rgba(16, 42, 83, .05); transition: transform .12s, box-shadow .12s, border-color .12s; }
.wb-kpi:hover { transform: translateY(-2px); border-color: #2E7CF6; box-shadow: 0 5px 14px rgba(46, 124, 246, .16); }
.wb-ic { width: 38px; height: 38px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 18px; flex: none; }
.wb-ic.i-blue { background: #eaf2fe; }
.wb-ic.i-amber { background: #fef4e5; }
.wb-ic.i-green { background: #e9f9f1; }
.wb-ic.i-purple { background: #f1edfe; }
.wb-ic.i-red { background: #fdeceb; }
.wb-ic.i-orange { background: #fef0e6; }
.wb-body { min-width: 0; }
.wb-lab { font-size: 12px; color: #64748b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wb-lab .wb-src { font-size: 10px; color: #94a3b8; margin-left: 3px; }
.wb-val { font-size: 21px; font-weight: 800; color: #0f2547; line-height: 1.3; margin-top: 2px; }
.wb-val small { font-size: 11px; font-weight: 500; color: #64748b; margin-left: 3px; }
.wb-delta { font-size: 11px; margin-top: 2px; border-radius: 5px; padding: 1px 7px; display: inline-block; font-variant-numeric: tabular-nums; }
.wb-delta.up { color: #12B76A; background: #e9f9f1; }
.wb-delta.down { color: #E5484D; background: #fdeceb; }
.wb-delta.flat { color: #64748b; background: #f1f5f9; }
.wb-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; padding: 0 0 12px; }
.wb-steps .st { display: flex; flex-direction: column; gap: 3px; background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 11px 13px; text-decoration: none; transition: transform .12s, border-color .12s, box-shadow .12s; }
.wb-steps .st:hover { transform: translateY(-2px); border-color: #2E7CF6; box-shadow: 0 4px 12px rgba(46, 124, 246, .14); }
.wb-steps .st b { font-size: 14px; color: #124a90; }
.wb-steps .st span { font-size: 11.5px; color: #7c8aa0; }
.wb-boards { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; padding: 0 0 6px; }
.wb-boards .bd { display: flex; flex-direction: column; gap: 3px; background: linear-gradient(180deg, #f7fafd, #fff); border: 1px solid #dbe7f3; border-radius: 10px; padding: 12px 13px 10px; text-decoration: none; transition: transform .12s, border-color .12s; }
.wb-boards .bd:hover { transform: translateY(-2px); border-color: #7db4e8; }
.wb-boards .bd b { font-size: 13.5px; color: #124a90; }
.wb-boards .bd span { font-size: 11px; color: #7c8aa0; line-height: 1.5; }
@media (max-width: 1200px) {
  .wb-kpis { grid-template-columns: repeat(3, 1fr); }
  .wb-boards { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 760px) {
  .wb-kpis { grid-template-columns: repeat(2, 1fr); }
  .wb-steps { grid-template-columns: repeat(2, 1fr); }
  .wb-boards { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
  body { padding-left: 0 !important; }
  body.side-collapsed { padding-left: 0; }
  .side-nav { display: none; }
}

/* ============ 头部 ============ */
.data-status {
  display: flex; align-items: center; gap: 6px;
  background: rgba(255, 255, 255, .12);
  padding: 5px 12px;
  border-radius: 20px;
  font-size: 12px;
}
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: #f6c344; }
.status-dot.ok { background: #52d869; }
.status-dot.err { background: #ff6b62; }

/* ============ 按钮 ============ */
.btn {
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);
  padding: 6px 14px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 13px;
  transition: all .15s;
  font-family: inherit;
  white-space: nowrap;
}
.btn:hover { border-color: var(--primary); color: var(--primary); }
.btn:active { transform: scale(.97); }
.btn-sm { padding: 4px 10px; font-size: 12px; }
.btn-ghost {
  background: rgba(255, 255, 255, .15);
  border-color: transparent;
  color: #fff;
  width: 30px; height: 30px;
  padding: 0;
  border-radius: 50%;
  font-size: 15px;
}
.btn-ghost:hover { background: rgba(255, 255, 255, .3); color: #fff; }
.btn-nav {
  width: 32px; height: 32px;
  padding: 0;
  font-size: 18px;
  line-height: 1;
  display: flex; align-items: center; justify-content: center;
}
.btn:disabled { opacity: .4; cursor: not-allowed; }
.btn.primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.btn.primary:hover { background: var(--primary-dark); color: #fff; }

/* ============ 工具栏 ============ */
.toolbar {
  background: var(--card);
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  z-index: 90;
}
.toolbar-inner {
  max-width: var(--page-max);
  width: 94%;
  margin: 0 auto;
  padding: 8px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.toolbar-actions { display: flex; align-items: center; gap: 8px; }
/* iframe 嵌入模式：子页隐藏自身工具栏（刷新/缩放由外层主题页统一提供） */
body.embed .toolbar { display: none; }
body.embed .container { padding-top: 0; }
/* iframe 内页不重复收窄：宽度由外层壳页决定 */
body.embed .toolbar-inner,
body.embed .tabs-inner,
body.embed .container,
body.embed .site-footer { max-width: none; width: 100%; }
.date-nav { display: flex; align-items: center; gap: 8px; }
.date-input {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 13px;
  font-family: inherit;
  color: var(--text);
  background: var(--card);
}
.date-input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(26, 95, 180, .12); }
.date-input.sm { padding: 4px 8px; font-size: 12px; }
.toolbar-info { display: flex; align-items: center; gap: 12px; color: var(--text-sub); font-size: 12px; }

/* ============ 缩放控件 ============ */
.zoom-ctrl { display: inline-flex; align-items: center; gap: 4px; }
.zoom-ctrl .btn-nav { min-width: 30px; padding: 4px 8px; }
.zoom-val { min-width: 52px; text-align: center; font-variant-numeric: tabular-nums; cursor: pointer; }

/* ============ 标签页 ============ */

.tabs { background: var(--card); border-bottom: 1px solid var(--border); }
.tabs-inner {
  max-width: var(--page-max);
  width: 94%;
  margin: 0 auto;
  padding: 0 14px;
  display: flex;
  gap: 4px;
}
.tab {
  border: none;
  background: none;
  padding: 12px 22px;
  font-size: 15px;
  font-family: inherit;
  color: var(--text-sub);
  cursor: pointer;
  position: relative;
  transition: color .15s;
}
.tab:hover { color: var(--primary); }
.tab.active { color: var(--primary); font-weight: 600; }
.tab.active::after {
  content: "";
  position: absolute;
  left: 16px; right: 16px; bottom: 0;
  height: 3px;
  border-radius: 3px 3px 0 0;
  background: var(--primary);
}

/* ============ 主体 ============ */
.container {
  max-width: var(--page-max);
  width: 94%;
  margin: 0 auto;
  padding: 10px 14px 28px;
  flex: 1;
  position: relative;
  min-height: 400px;
}
.tab-panel { display: none; animation: fadeIn .25s ease; }
.tab-panel.active { display: block; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* ============ 加载状态 ============ */
.loading-mask {
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 60px 0;
  color: var(--text-sub);
}
.loading-mask.show { display: flex; }
.spinner {
  width: 36px; height: 36px;
  border: 3px solid var(--primary-light);
  border-top-color: var(--primary);
  border-radius: 50%;
  animation: spin .8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
.chart-card.loading { position: relative; min-height: 260px; }
.chart-card.loading .chart-body { opacity: .15; }
.chart-card .card-loading {
  display: none;
  position: absolute;
  inset: 0;
  align-items: center;
  justify-content: center;
}
.chart-card.loading .card-loading { display: flex; }
.card-loading .mini-spinner {
  width: 26px; height: 26px;
  border: 3px solid var(--primary-light);
  border-top-color: var(--primary);
  border-radius: 50%;
  animation: spin .8s linear infinite;
}

/* ============ 图表网格 ============ */
.trend-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
/* 分类趋势·对比日期选择 */
.trend-left { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cmp-item {
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--text-sub);
  font-size: 12.5px;
  white-space: nowrap;
  cursor: pointer;
}
.cmp-date {
  padding: 4px 8px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--card);
  color: var(--ink);
  font-size: 12.5px;
  font-family: inherit;
  outline: none;
}
.cmp-date:hover { border-color: var(--brand); }
.cmp-date:focus { border-color: var(--brand); }
.cmp-vs { color: var(--text-sub); font-size: 12px; }
.trend-desc {                 /* 分类趋势描述文字（复刻 Excel BB4 文本块） */
  margin: 0 0 14px;
  padding: 12px 16px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-family: "SimHei", "Microsoft YaHei", sans-serif;
  font-size: 15px;
  line-height: 1.9;
  color: #000;
}
.chart-grid {                 /* 六卡贴合版式（参考样图）：外框 + 1px 缝隙线当共享边线 */
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: var(--border);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}
.chart-card {
  background: var(--card);
  border: none;
  border-radius: 0;
  overflow: hidden;
}
/* 每日统计·趋势图列选择器（下拉筛选面板：触发条 + 分组复选面板） */
.col-picker {
  position: relative;
  padding: 8px 14px 12px;
  text-align: left;
}
/* 面板展开时临时放开图表卡 overflow，避免下拉被裁切 */
.chart-card.picker-open { overflow: visible; z-index: 60; }
.cp-fbar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.cp-trigger { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; border: 1px solid #cfd9e6; border-radius: 8px; background: #fff; font-size: 13px; font-weight: 600; color: #33415c; cursor: pointer; font-family: inherit; }
.cp-trigger:hover { border-color: #1a6fd4; color: #1a6fd4; }
.cp-trigger.on { background: #1a6fd4; border-color: #1a6fd4; color: #fff; }
.cp-caret { font-style: normal; font-size: 10px; }
.cp-badge { display: inline-block; min-width: 18px; padding: 0 5px; border-radius: 999px; background: #e8f1fe; color: #1a6fd4; font-size: 11px; line-height: 18px; text-align: center; }
.cp-trigger.on .cp-badge { background: rgba(255,255,255,.28); color: #fff; }
.cp-selected { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.cp-sel { display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border: 1px solid #d6e4f8; border-radius: 999px; background: #eef4fd; color: #1a5fb4; font-size: 12px; cursor: pointer; user-select: none; }
.cp-sel:hover { background: #e0453e; border-color: #e0453e; color: #fff; }
.cp-sel i { font-style: normal; font-weight: 700; }
.cp-sel-none { font-size: 12px; color: #94a3b8; }
.cp-panel { display: none; position: absolute; left: 14px; right: 14px; top: calc(100% - 6px); z-index: 80; max-height: 400px; overflow: auto; background: #fff; border: 1px solid #d9e4f2; border-radius: 10px; box-shadow: 0 12px 32px rgba(31,45,61,.16); }
.cp-panel.open { display: block; }
.col-picker .cp-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
}
.col-picker .cp-quick {
  padding: 2px 12px;
  border: 1px dashed #9db4cc;
  border-radius: 11px;
  font-size: 11.5px;
  line-height: 1.6;
  color: #1a5fb4;
  background: #f4f8fd;
  cursor: pointer;
  user-select: none;
}
.col-picker .cp-quick:hover { background: #1a5fb4; border-color: #1a5fb4; color: #fff; }
.col-picker .cp-hint { font-size: 11px; color: #94a3b8; white-space: nowrap; }
.col-picker .cp-search {
  margin-left: auto;
  width: 190px;
  padding: 3px 10px;
  border: 1px solid #c9d4e0;
  border-radius: 11px;
  font-size: 11.5px;
  font-family: inherit;
  color: #22303f;
  background: #fff;
}
.col-picker .cp-search:focus { outline: none; border-color: #1a6fd4; }
.col-picker .cp-search::placeholder { color: #a8b6c6; }
.col-picker .cp-block {
  display: inline-flex;
  flex-direction: column;
  gap: 4px;
  margin: 0 8px 8px 0;
  padding: 6px 9px 7px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  vertical-align: top;
}
.col-picker .cp-label {
  font-size: 11px;
  font-weight: bold;
  color: #64748b;
  letter-spacing: .5px;
}
.col-picker .cp-chips { display: block; }
.col-picker .cp-chip {
  display: inline-block;
  margin: 1px 3px 1px 0;
  padding: 2px 8px;
  border: 1px solid #c9d4e0;
  border-radius: 10px;
  font-size: 11px;
  line-height: 1.5;
  color: #334155;
  background: #fff;
  cursor: pointer;
  user-select: none;
  vertical-align: middle;
}
.col-picker .cp-chip:hover { border-color: #1a6fd4; color: #1a6fd4; }
.col-picker .cp-chip.on { background: #1a6fd4; border-color: #1a6fd4; color: #fff; }
.col-empty {
  padding: 46px 0 56px;
  color: #94a3b8;
  font-size: 13px;
  text-align: center;
}
.chart-title {
  padding: 12px 12px 0;
  font-size: 15px;
  font-weight: 700;
  color: #000;
  text-align: center;   /* 参考样图：标题居中、黑色加粗 */
}
.chart-body { height: 265px; }
.chart-empty {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: var(--text-sub);
  font-size: 13px;
}
.chart-empty .icon { font-size: 30px; opacity: .45; }

/* ============ 负荷信息表（1:1 还原 Excel 版式） ============ */
/* 面板按容器宽度自适应分行（普通屏幕 2×2），纵向排列居中，整页无横向滚动，便于截取完整图 */
.xl-panels {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: 6px;
  background: #ffffff;
  width: 100%;
}
.xl-table {
  border-collapse: collapse;
  font-family: "SimSun", "宋体", "NSimSun", serif;
  font-size: 14px;
  font-weight: 700;
  color: #000;
  background: #fff;
  flex-shrink: 0;
  /* 固定 4 列流式布局：表格随容器宽度缩放，各列按百分比均分 */
  width: 100%;
  min-width: 1150px;
  table-layout: fixed;
}
.xl-table th, .xl-table td {
  border: 0.5px solid #000; /* 发丝线：150% 显示缩放下渲染为 1 物理px 标准细线（1px 会变 1.5~2 物理px 显粗） */
  padding: 3px 5px;
  line-height: 1.05; /* 紧凑行高 */
  text-align: center;
  color: #000;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  word-break: keep-all;
}
.xl-table thead th {
  font-weight: 700;
  font-size: 13.5px;
  text-align: center;
  background: #fff;
  color: #000;
  white-space: nowrap;
  position: sticky;
  top: 0;
  z-index: 10;
}
.xl-table thead th.cat-h { width: 9%; position: sticky; left: 0; z-index: 15; }
.xl-table thead th.date-h { width: 5.2%; }
.xl-table thead th.stat-h { width: 4.35%; }
.xl-table td.cat {
  text-align: center;
  white-space: nowrap;
  background: #fff;
  color: #000;
  position: sticky;
  left: 0;
  z-index: 5;
  border-right: 0.5px solid #000; /* 通道名称列分隔线（单线·发丝） */
}
.xl-table .panel-sep { border-left: 0.5px solid #000; } /* 面板间分隔线（单线·发丝） */

/* ============ 供热数据统计页（heat.php） ============ */
.heat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}
.heat-stat {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px 18px;
}
.heat-stat .hs-label { font-size: 13px; color: var(--text-sub); margin-bottom: 6px; }
.heat-stat .hs-value { font-size: 30px; font-weight: 700; color: #1f2d3d; font-family: SimHei; line-height: 1.15; }
.heat-stat .hs-value small { font-size: 14px; font-weight: 400; color: var(--text-sub); margin-left: 2px; }
.heat-stat .hs-value.hs-blue { color: #1a6fd4; }
.heat-stat .hs-time { font-size: 24px; font-weight: 700; color: #1f2d3d; font-family: SimHei; line-height: 1.3; }
.heat-stat .hs-time.hs-blue { color: #1a6fd4; }
.heat-stat .hs-sub { font-size: 12px; color: var(--text-sub); margin-top: 4px; }
.heat-chart-card, .heat-table-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  margin-bottom: 16px;
  overflow: hidden;
}
.heat-chart-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding: 12px 16px 0;
}
.heat-chart-head h3 { margin: 0; font-size: 15px; font-weight: 700; color: #1f2d3d; }
/* 图卡标题绝对居中（不受右侧 chip 影响） */
.heat-chart-head { position: relative; }
.heat-chart-head .center-title { position: absolute; left: 50%; transform: translateX(-50%); }
@media (max-width: 720px) {
  .heat-chart-head .center-title { position: static; transform: none; }
}
.heat-chart-head .hs-table-date { font-weight: 400; color: var(--text-sub); font-size: 13px; margin-left: 8px; }
/* 数据分析模块（market 页） */
.az-controls { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; padding: 10px 16px 0; }
.az-stats { display: grid; grid-template-columns: repeat(6, 1fr); gap: 1px; background: var(--border); border-top: 1px solid var(--border); margin: 12px 0 0; }
.az-stat { background: #fff; padding: 10px 8px; text-align: center; }
.az-stat .az-k { font-size: 12.5px; color: var(--text-sub); font-weight: 700; }
.az-stat .az-v { font-size: 19px; font-weight: 700; color: #124a90; margin-top: 3px; font-family: SimHei; }
.az-stat .az-v small { font-size: 12px; font-weight: 400; color: var(--text-sub); }
.az-stat .az-s { font-size: 12px; color: #8a97a8; margin-top: 2px; }
@media (max-width: 1024px) { .az-stats { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .az-stats { grid-template-columns: repeat(2, 1fr); } }
.heat-chart-body { height: 380px; }
.unit-tabs { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.unit-tab {
  border: 1px solid var(--border); background: #fff; color: var(--text-sub);
  border-radius: 15px; padding: 5px 14px; font-size: 13px; cursor: pointer; font-family: inherit;
}
.unit-tab.active { background: #1a6fd4; border-color: #1a6fd4; color: #fff; font-weight: 700; }
.heat-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.heat-table th, .heat-table td {
  border: 0.5px solid #c9d4e3;
  padding: 8px 10px;
  text-align: center;
  color: #1f2d3d;
}
/* 明细表负数标红（如 需求−实际、日前价−实时价 为负） */
.heat-table td.neg-num { color: #e0483e; font-weight: 700; }
.heat-table thead th { background: #eef3fa; font-weight: 700; color: #124a90; white-space: nowrap; }
.heat-table td.ht-unit { font-weight: 700; background: #f6f9fd; }
.heat-table td.ht-kind-y { color: #14538f; font-weight: 700; }
.heat-table td.ht-kind-t { color: #a03028; font-weight: 700; }
.heat-table td.ht-period { font-family: SimHei; font-weight: 700; color: #1f2d3d; }
.heat-table .ht-badge { display: inline-block; border-radius: 10px; padding: 2px 10px; font-size: 12px; font-weight: 700; }
.heat-table .ht-badge.on { background: #e8f4e9; color: #2c7031; }
.heat-table .ht-badge.off { background: #eef1f5; color: #8a97a8; }
.heat-table tbody tr:nth-child(even) td:not(.ht-unit) { background: #f8fafd; }
.heat-table tbody tr:hover td { background: #fff8d6; }
.xl-table td.date {
  background: #fff;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
  overflow: hidden;
  font-weight: 700;
  font-size: 15px;
  color: #000;
}
.xl-table td.date.wk { background: #cbd5f2; } /* 仅周末加底色，工作日白底 */
.xl-table td.v { text-align: center; white-space: nowrap; overflow: hidden; font-weight: 400; } /* 数字与普通文本同字重，不加粗 */
.xl-table td.v.west-v { background: #00b050; }
.xl-table td.fix-val {
  background: #00b0f0;
  text-align: center;
  font-weight: 400; /* 数字不加粗 */
  white-space: nowrap;
  overflow: hidden;
}
/* 悬停高亮（保持绿/蓝/日期列底色不变） */
.xl-table tbody tr:hover td.v:not(.west-v) { background: #fff8d6; }
.xl-table tbody tr:hover td.fix-val { background: #33c2f4; }

/* ============ 负荷统计明细表（28 天窗口逐通道汇总） ============ */
.ls-table thead th.cat-h { width: auto; position: static; }
.ls-table td.cat { position: static; width: auto; }
.ls-table td.v { padding: 5px 4px; }
.ls-table td.v small { display: block; font-weight: 400; font-size: 11px; color: #5a6b7f; margin-top: 1px; }
.ls-table td.v.west-v small { color: #eaf7ef; }
.ls-table td.v.neg-num { background: #fff !important; color: #e0483e; font-weight: 700; } /* 负值红字白底，避免悬停/绿底干扰 */
.ls-table tr.ls-sum td { background: #f2f6fb; font-weight: 700; border-top: 2px solid #b9c6d8; }
/* 西电分通道子表标题（负荷统计明细卡内） */
.ls-sub-title {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin: 18px 16px 8px;
  font-size: 15px;
  font-weight: 700;
  color: #1c2b3a;
}
.ls-sub-note { font-size: 12px; font-weight: 400; color: var(--text-sub); }

/* ============ 负荷信息表响应式（4 列固定，窄屏按比例缩字号） ============ */
@media (max-width: 1366px) {
  .xl-table { font-size: 13px; }
  .xl-table thead th { font-size: 12.5px; }
  .xl-table td.date { font-size: 14px; }
}
@media (max-width: 1024px) {
  .xl-table { font-size: 12px; }
  .xl-table thead th { font-size: 11.5px; }
  .xl-table td.date { font-size: 13px; }
}
@media (max-width: 720px) {
  .xl-panels { padding: 4px; }
  .xl-table { font-size: 12px; min-width: 900px; }
  .xl-table th, .xl-table td { padding: 3px 3px; }
  .xl-table thead th { font-size: 11px; }
  .xl-table td.date { font-size: 12.5px; }
}
.table-note { margin-top: 10px; color: var(--text-sub); font-size: 12px; line-height: 1.6; }
/* 每日负荷信息统计表卡片：标题栏下方工具栏与表格留边 */
#loadTableCard .table-toolbar { padding: 12px 16px 0; margin-bottom: 12px; }
#loadTableCard .table-wrap { margin: 0 16px 14px; }

.table-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 14px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 10px 16px;
  box-shadow: var(--shadow);
}
.range-nav { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.range-label { color: var(--text-sub); font-size: 13px; }
.range-sep { color: var(--text-sub); }
.range-presets { display: flex; gap: 6px; margin-left: 6px; }
.range-preset.active { background: var(--primary-light); border-color: var(--primary); color: var(--primary); }
.table-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } /* 允许换行：窄屏时控件折行而非溢出 */
.stat-chip { color: var(--text-sub); font-size: 12px; }
.table-wrap {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: auto;
}

/* ============ 页脚 ============ */
.site-footer {
  max-width: var(--page-max);
  width: 94%;
  margin: 0 auto;
  padding: 14px 14px 20px;
  color: var(--text-sub);
  font-size: 12px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

/* ============ 帮助弹窗 ============ */
.modal-mask {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(15, 35, 70, .45);
  z-index: 200;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.modal-mask.show { display: flex; }
.modal {
  background: var(--card);
  border-radius: 14px;
  width: 560px;
  max-width: 100%;
  max-height: 84vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 20px 60px rgba(0, 0, 0, .25);
  animation: fadeIn .2s ease;
}
.modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
}
.modal-header h3 { color: var(--primary-dark); font-size: 16px; }
.modal-body { padding: 16px 20px 22px; overflow: auto; line-height: 1.8; }
.modal-body h4 { color: var(--primary-dark); margin: 12px 0 4px; font-size: 14px; }
.modal-body h4:first-child { margin-top: 0; }
.modal-body p { color: var(--text); font-size: 13px; }
.modal-body code {
  display: block;
  background: #f4f7fb;
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 8px 10px;
  font-size: 12px;
  word-break: break-all;
  margin: 6px 0;
  color: var(--primary-dark);
}
.modal-body p code { display: inline; padding: 1px 6px; margin: 0; }

/* ============ 截图预览弹窗 ============ */
.modal-shot { width: min(1080px, 94vw); }
.shot-body { max-height: 64vh; overflow: auto; background: #f4f7fb; }
.shot-body img { display: block; width: 100%; height: auto; }
.shot-actions { display: flex; align-items: center; gap: 10px; padding: 12px 20px 16px; }
.shot-tip { margin-right: auto; color: var(--text-sub); font-size: 12px; }

/* ============ Toast ============ */
.toast {
  position: fixed;
  left: 50%;
  bottom: 40px;
  transform: translateX(-50%) translateY(20px);
  background: rgba(30, 45, 70, .92);
  color: #fff;
  padding: 9px 20px;
  border-radius: 20px;
  font-size: 13px;
  opacity: 0;
  pointer-events: none;
  transition: all .25s;
  z-index: 300;
  max-width: 80vw;
}
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ============ 响应式 ============ */
@media (max-width: 1024px) {
  .chart-grid { grid-template-columns: 1fr; }
  .chart-body { height: 240px; }
}
@media (max-width: 720px) {
  .data-status span:last-child { max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .toolbar-inner, .tabs-inner, .container, .site-footer { padding-left: 14px; padding-right: 14px; }
  .tab { padding: 10px 14px; font-size: 14px; }
  .toolbar-info { width: 100%; justify-content: space-between; }
  .table-toolbar { flex-direction: column; align-items: stretch; }
}

/* ===== 供热统计：视图切换与历史统计 ===== */
.view-tabs { display: inline-flex; border: 1px solid #cfd9e6; border-radius: 8px; overflow: hidden; margin-right: 8px; }
.view-tab { border: 0; background: #fff; padding: 7px 16px; font-size: 13px; font-weight: 600; color: #5a6b80; cursor: pointer; font-family: inherit; }
.view-tab + .view-tab { border-left: 1px solid #cfd9e6; }
.view-tab.active { background: #1a6fd4; color: #fff; }
.chip { display: inline-block; padding: 3px 11px; border: 1px solid #d0d7e2; border-radius: 999px; font-size: 12px; color: #475569; cursor: pointer; user-select: none; background: #fff; transition: .15s; line-height: 1.5; }
.chip:hover { border-color: var(--primary); color: var(--primary); }
.chip.on { background: var(--primary); border-color: var(--primary); color: #fff; }
.heat-hist .hist-title { margin: 16px 4px 8px; font-size: 14px; font-weight: 700; color: #1f2d3d; font-family: SimHei, "Microsoft YaHei", sans-serif; }
.heat-hist .table-wrap { margin-bottom: 4px; max-height: 480px; overflow: auto; }
.hist-empty { text-align: center; color: #8a97a8; padding: 18px 0; }

/* ===== 开机台套：日期对比 ===== */
#btnCompare.active { background: #f2a33c; color: #fff; }  /* 对比模式激活色（与对比日系列同色） */
.diff-pos { color: #2c7031; font-weight: 700; }           /* 差值增加（绿） */
.diff-neg { color: #a03028; font-weight: 700; }           /* 差值减少（红） */

/* ===== 每日统计总表（daily.php） ===== */
.month-nav { display: flex; gap: 8px; align-items: center; margin-left: auto; }  /* 每日统计：标题居中(.center-title)，日期导航靠右 */
/* 主题表页签：63 列大宽表按主题拆成 4 张小表 */
.sec-tabs { display: flex; gap: 8px; padding: 0 12px 12px; }
.sec-tab { border: 1px solid #cfd9e6; background: #f6f9fc; padding: 8px 18px; border-radius: 8px; font-size: 13.5px; font-weight: 700; color: #5a6b80; cursor: pointer; font-family: inherit; transition: all .15s; }
.sec-tab:hover { border-color: #1a6fd4; color: #1a6fd4; }
.sec-tab.active { background: linear-gradient(120deg, #0d3b78, #1a5fb4); border-color: #0d3b78; color: #fff; box-shadow: 0 2px 8px rgba(13, 59, 120, .25); }
.daily-wrap { overflow: auto; border: 1px solid #c9d7ea; border-radius: 10px; box-shadow: 0 2px 10px rgba(16, 42, 83, .08); background: #fff; }
.daily-table {
  width: auto;                 /* 35 列宽表：列宽按内容，容器横向滚动 */
  min-width: 0;
  table-layout: auto;
  font-size: 13.5px;
}
.daily-table th { background: #fff; position: sticky; }
/* —— 两层品牌化表头：① 渐变组名 / 跨行单列 ② 浅底子列 —— */
.daily-table thead th { border-color: #1c3f6e; }                       /* 表头深蓝细线替代黑（数据区仍黑边） */
.daily-table thead tr:first-child th {
  top: 0; z-index: 6; height: 34px;
  background: linear-gradient(120deg, #0d3b78 0%, #1a5fb4 70%, #2569c0 100%);
  color: #fff; font-size: 13px; font-weight: 700;
}
.daily-table thead tr:first-child th.d-solo {                            /* 无组单列（价格/西电电量）：浅蓝底跨两行 */
  background: #e8f1fb; color: #124a90;
}
.daily-table thead tr:nth-child(2) th { top: 34px; z-index: 4; height: 30px; background: #f6f9fc; font-weight: 700; font-size: 12.5px; color: #22303f; }
.daily-table thead tr:first-child th.d-group { border-bottom: 0; }
.daily-table thead tr:nth-child(2) th { border-top: 0; }
.daily-table td { font-weight: 400; white-space: nowrap; transition: background .12s; }
.daily-table td.d-sticky { position: sticky; z-index: 3; background: #fff; }  /* 冻结列：z3 低于三层表头(4/5/6) */
.daily-table td.v { min-width: 74px; }
.daily-table tbody tr:nth-child(even) td { background: #f6f9fc; }        /* 斑马行 */
.daily-table tbody tr:nth-child(even) td.d-sticky { background: #f6f9fc; }
.daily-table tbody tr:hover td { background: #eaf3fd !important; }       /* 悬停整行高亮（!important 盖过斑马行/周末蓝底） */
.daily-table tbody tr:hover td.d-date.rest { background: #d5e3f7 !important; }
/* 冻结列宽固定（内容实测：日期77.5px / 法定节假日72.5px / 星期四50.5px），left 偏移 = 前列宽和，保证滚动时不重叠 */
.daily-table td.d-sticky0 { left: 0; width: 88px; }
.daily-table td.d-sticky1 { left: 88px; width: 78px; }
.daily-table td.d-sticky2 { left: 166px; width: 60px; }
.daily-table thead th.d-sticky0 { left: 0; width: 88px; }
.daily-table thead th.d-sticky1 { left: 88px; width: 78px; }
.daily-table thead th.d-sticky2 { left: 166px; width: 60px; }
.daily-table td.d-date.rest { background: #cbd5f2; }                      /* 周末/节假日 日期格蓝底 */
.daily-table tbody tr:nth-child(even) td.d-date.rest { background: #cbd5f2; }
.daily-table td.neg { color: #e0483e; font-weight: 700; }                 /* 负值红字加粗 */
.daily-table td.d-type { font-size: 12.5px; }
.daily-table td.d-empty { color: #8a97a8; padding: 24px 0; font-weight: 400; }

.diff-zero { color: #8a97a8; }                            /* 持平 / 无差值（灰） */

/* ===== 开机台套：类型总览（复刻分类趋势 chart-grid 版式） ===== */
#allView { margin-bottom: 16px; }
#allView .all-info { margin: 0 2px 10px; font-family: SimHei, "Microsoft YaHei", sans-serif; font-size: 14px; font-weight: 700; color: #1f2d3d; }
#typeGrid .chart-card { cursor: pointer; }                /* 点卡跳分时详情 */
#typeGrid .chart-card:hover .chart-title { color: #1a6fd4; }

/* ===== 供热统计：申报描述条 ===== */
.heat-desc-card { background: #fff; border: 1px solid #e4e9f2; border-radius: 12px; padding: 14px 18px; margin: 14px 0; }
.heat-desc-card p { margin: 0; font-family: SimHei, "Microsoft YaHei", sans-serif; font-size: 15px; font-weight: 700; color: #1f2d3d; line-height: 1.6; }

/* ============================================================
   UI 视觉与交互增强（既有「电光蓝」品牌基础上的统一打磨）
   原则：只改视觉/交互层，不动 DOM 结构与功能；全局统一组件 +
        披露页针对性精修；含焦点可达性、减弱动效、触屏与响应式。
   ============================================================ */

/* 0) 渲染与可达性基础 */
::selection { background: rgba(46, 124, 246, .18); }
:where(button, a, input, select, textarea, .chip, .view-tab, .tab, [tabindex]):focus-visible {
  outline: none; box-shadow: var(--ring); border-radius: 6px;
}
* { scrollbar-width: thin; scrollbar-color: #cbd7e6 transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #cdd9e8; border-radius: 8px; border: 2px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-thumb:hover { background: #b6c6db; background-clip: content-box; }
::-webkit-scrollbar-track { background: transparent; }

/* 1) 按钮：悬停抬升 / 按下回弹 / 焦点（禁用态不变） */
.btn { transition: transform var(--t-fast), box-shadow var(--t-fast), border-color var(--t-fast), color var(--t-fast), background var(--t-fast); }
.btn:not(:disabled):hover { transform: translateY(-1px); box-shadow: var(--shadow-sm); }
.btn:not(:disabled):active { transform: translateY(0) scale(.97); }
.btn.primary { box-shadow: 0 2px 8px rgba(46, 124, 246, .25); }
.btn.primary:not(:disabled):hover { box-shadow: 0 6px 16px rgba(46, 124, 246, .32); }

/* 2) 标签页 tabs：悬停浅底 + 选中渐变下划线 */
.tab { border-radius: 8px 8px 0 0; transition: color var(--t-fast), background var(--t-fast); }
.tab:hover { background: var(--primary-light); }
.tab.active { color: var(--primary-dark); }
.tab.active::after { background: var(--brand-grad); }

/* 3) 分段视图切换 view-tabs：选中渐变 + 悬停浅底 */
.view-tab { transition: background var(--t-fast), color var(--t-fast), box-shadow var(--t-fast); }
.view-tab:hover { background: var(--primary-light); color: var(--primary-dark); }
.view-tab.active { background: var(--brand-grad); color: #fff; box-shadow: 0 2px 8px rgba(46, 124, 246, .28); }

/* 4) 交互型卡片：统一过渡 + 悬停描边/阴影（纯图表卡不加位移，避免画布抖动） */
.heat-chart-card, .heat-stat, .kpi-card, .nav-card, .wb-kpi, .wb-steps .st, .wb-boards .bd,
.heat-desc-card, .table-toolbar, .table-wrap {
  transition: transform var(--t), box-shadow var(--t), border-color var(--t);
}
.heat-chart-card:hover, .heat-stat:hover, .table-toolbar:hover, .table-wrap:hover, .heat-desc-card:hover {
  border-color: #cfe0f5; box-shadow: var(--shadow-md);
}
.nav-card:hover, .wb-kpi:hover, .wb-steps .st:hover, .wb-boards .bd:hover { border-color: #2E7CF6; }

/* 5) 披露页 KPI 卡：左侧品牌色条 + 悬停抬升 + 数值层次 */
.kpi-card { position: relative; overflow: hidden; border-radius: 12px; }
.kpi-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--brand-grad); }
.kpi-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: #bcd8f6; }
.kpi-label { font-weight: 600; letter-spacing: .3px; }
.kpi-value { letter-spacing: .2px; }

/* 6) 胶囊 chip 交互反馈 */
.chip { transition: transform var(--t-fast), box-shadow var(--t-fast), background var(--t-fast), color var(--t-fast), border-color var(--t-fast); }
.chip:hover { box-shadow: var(--shadow-sm); }
.chip:active { transform: scale(.94); }
.chip.on { box-shadow: 0 2px 8px rgba(46, 124, 246, .28); }

/* 7) 状态胶囊 stat-chip：统一浅底药丸，降低视觉噪点 */
.stat-chip { background: #fff; border: 1px solid var(--border); border-radius: 20px; padding: 3px 12px; box-shadow: var(--shadow-sm); }

/* 8) 图表卡标题：左侧品牌竖条，信息层级更清晰 */
.heat-chart-head h3 { position: relative; padding-left: 12px; }
.heat-chart-head h3::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 4px; height: 16px; border-radius: 2px; background: var(--brand-grad); }

/* 9) 披露页响应式：KPI/字号微调 */
@media (max-width: 560px) {
  .kpi-value { font-size: 20px; }
  .kpi-card { padding: 10px 12px 8px; }
  .heat-chart-head { gap: 6px; }
}

/* 10) 减弱动效偏好 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .btn:hover, .nav-card:hover, .wb-kpi:hover, .kpi-card:hover, .wb-steps .st:hover, .wb-boards .bd:hover { transform: none !important; }
}

/* 11) 触屏设备：去掉悬停位移，避免“粘滞” */
@media (hover: none) {
  .btn:hover, .nav-card:hover, .wb-kpi:hover, .kpi-card:hover, .wb-steps .st:hover, .wb-boards .bd:hover { transform: none; }
}

/* ================= 12) 全站视觉质感（统一样式收口） ================= */

/* 12.1 画布：极淡双光晕渐层，替代纯色平底 */
body {
  background:
    radial-gradient(1100px 520px at 8% -8%, #e8f1fe 0%, rgba(232, 241, 254, 0) 62%),
    radial-gradient(900px 460px at 92% -6%, #eef7ff 0%, rgba(238, 247, 255, 0) 58%),
    linear-gradient(180deg, #f7f9fd 0%, #f3f6fb 46%, #f4f6fa 100%);
}

/* 12.2 顶栏：磨砂玻璃 + 发丝线，滚动内容有层次 */
.toolbar {
  background: rgba(255, 255, 255, .84);
  -webkit-backdrop-filter: saturate(180%) blur(14px);
  backdrop-filter: saturate(180%) blur(14px);
  border-bottom-color: rgba(214, 228, 245, .9);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 10px 24px -22px rgba(16, 42, 83, .55);
}

/* 12.3 卡片：柔和圆角 + 双层投影（贴地阴影 + 环境阴影） */
.heat-chart-card,
.heat-table-card,
.heat-stat,
.kpi-card,
.table-toolbar,
.table-wrap,
.heat-desc-card {
  border-radius: 12px;
  border-color: #e6eef9;
  box-shadow: 0 1px 2px rgba(16, 42, 83, .04), 0 10px 28px -18px rgba(16, 42, 83, .22);
}
.heat-chart-card:hover,
.heat-stat:hover,
.table-toolbar:hover,
.table-wrap:hover,
.heat-desc-card:hover {
  border-color: #cfe0f5;
  box-shadow: 0 2px 6px rgba(16, 42, 83, .05), 0 20px 42px -22px rgba(16, 42, 83, .30);
}

/* 12.4 卡片头：标题与内容之间加发丝线，信息层次更清楚 */
.heat-chart-head {
  border-bottom: 1px solid #f0f5fc;
  padding-bottom: 10px;
  margin-bottom: 2px;
}
.heat-chart-head h3 { font-weight: 700; letter-spacing: .3px; color: #14508f; }

/* 12.5 KPI 数值：收字距、标签加重，数字更有块感 */
.heat-stat .hs-value { letter-spacing: -.4px; }
.heat-stat .hs-label { font-weight: 600; letter-spacing: .3px; color: #5b6b7e; }

/* 12.6 按钮：轻微上光泽，悬停更具“可按”感 */
.btn {
  border-radius: 9px;
  border-color: #dbe7f5;
  background: linear-gradient(180deg, #ffffff 0%, #f7fafd 100%);
  font-weight: 500;
}
.btn:hover { background: #fff; }

/* 12.7 表格：表头发丝线 + 更轻的斑马纹与悬浮色 */
.heat-table thead th {
  background: linear-gradient(180deg, #f4f8fe 0%, #eaf1fa 100%);
  border-bottom: 1px solid #dbe7f5;
  letter-spacing: .2px;
}
.heat-table tbody tr:nth-child(even) td:not(.ht-unit) { background: #f9fbfe; }
.heat-table tbody tr:hover td { background: #f1f7ff; }
.heat-table td { border-bottom-color: #f0f5fc; }

/* 12.8 状态胶囊：淡蓝底，降低视觉噪点 */
.stat-chip {
  background: #f6faff;
  border-color: #e2edfa;
  color: #5a6b80;
}

/* 12.9 页脚：细发丝线收口 */
.site-footer { border-top: 1px solid rgba(214, 228, 245, .8); color: #7a8899; }

/* 12.10 侧边栏：顶部微光与更深的环境阴影 */
.side-nav { box-shadow: 2px 0 18px rgba(6, 16, 32, .22); }
.side-nav::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 180px;
  pointer-events: none;
  background: radial-gradient(120% 100% at 50% 0%, rgba(82, 150, 255, .22) 0%, rgba(82, 150, 255, 0) 72%);
}

/* 12.11 趋势分析：多维趋势 2×4 宫格 */
#multiGrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.mg-cell { background: #fff; border: 1px solid #e8eff8; border-radius: 8px; padding: 6px 4px 2px; }
.mg-title { text-align: center; font-size: 12px; font-weight: 700; color: #1f2d3d; margin-bottom: 2px; }
.mg-title small { font-size: 10px; font-weight: 400; color: #94a3b8; margin-left: 5px; }
.mg-chart { height: 400px; }
/* 每图头部：左放大、中标题、右「日/月/年」分段 + 区间/指标轻按钮 */
.mg-head { position: relative; display: flex; align-items: center; justify-content: center; min-height: 24px; margin-bottom: 3px; padding: 0 8px; }
.mg-head .mg-title { margin-bottom: 0; max-width: calc(100% - 220px); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.mg-tools { position: absolute; right: 6px; top: 1px; display: flex; align-items: center; gap: 5px; }
.mg-zoom { position: absolute; left: 6px; top: 1px; display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; padding: 0; border: 1px solid transparent; border-radius: 6px; background: transparent; color: #9aabbd; cursor: pointer; transition: background .15s, color .15s; }
.mg-zoom:hover { background: #eaf3ff; color: #1a6fd4; }
.mg-zoom svg { display: block; }
/* 单图放大遮罩 */
.mg-zoom-mask { position: fixed; inset: 0; z-index: 10000; display: none; align-items: center; justify-content: center; padding: 20px; background: rgba(12, 28, 50, .55); }
.mg-zoom-mask.show { display: flex; }
.mg-zoom-box { display: flex; flex-direction: column; width: min(1680px, 98vw); max-height: 94vh; background: #fff; border-radius: 10px; box-shadow: 0 24px 60px rgba(10, 30, 60, .35); }
.mg-zoom-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px; border-bottom: 1px solid #f0f4fa; }
.mg-zoom-ttl { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.mg-zoom-title { font-size: 14px; font-weight: 700; color: #1f2d3d; }
.mg-zoom-sub { margin-left: 8px; font-size: 11px; color: #94a3b8; }
.mg-zoom-close { flex: none; padding: 2px 8px; border: none; background: transparent; color: #94a3b8; font-size: 16px; line-height: 1; cursor: pointer; }
.mg-zoom-close:hover { color: #e0483e; }
.mg-zoom-chart { width: 100%; height: min(72vh, 640px); }
.mg-filter, .mg-range-btn { font-size: 10.5px; line-height: 1; padding: 4px 6px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: #8598ab; cursor: pointer; white-space: nowrap; transition: background .15s, color .15s; }
.mg-filter:hover, .mg-range-btn:hover { background: #eaf3ff; color: #1a6fd4; }
.mg-range-btn { max-width: 92px; overflow: hidden; text-overflow: ellipsis; }
.mg-range-btn.on { background: #eaf3ff; color: #1a6fd4; font-weight: 600; }
/* 视角分段：日 / 月（同月跨年） / 年（各年全年逐日） */
.mg-modes { display: inline-flex; align-items: center; padding: 1px; background: #f3f8fe; border: 1px solid #e6eef9; border-radius: 8px; }
.mg-mode { font-size: 10px; line-height: 1; padding: 3px 6px; border: 0; border-radius: 6px; background: transparent; color: #8fa3b8; cursor: pointer; transition: background .15s, color .15s, box-shadow .15s; }
.mg-mode:hover { color: #1a6fd4; }
.mg-mode.on { background: #fff; color: #1a6fd4; font-weight: 700; box-shadow: 0 1px 3px rgba(26, 111, 212, .18); }
.mg-menu { position: absolute; z-index: 9999; display: none; width: 214px; max-height: 300px; overflow: auto; padding: 4px; background: #fff; border: 1px solid #dbe6f3; border-radius: 8px; box-shadow: 0 8px 24px rgba(23, 50, 90, .16); }
.mg-menu.open { display: block; }
.mg-range-menu { width: 246px; padding: 0; overflow: visible; }
.mg-range-head { padding: 8px 10px 6px; font-size: 12px; font-weight: 700; color: #124a90; }
.mg-range-quick-row { display: flex; flex-wrap: wrap; gap: 4px; padding: 0 8px 8px; }
.mg-range-quick { padding: 3px 9px; border: 1px dashed #c8d8ec; border-radius: 5px; background: transparent; color: #64748b; font-size: 11px; cursor: pointer; font-family: inherit; transition: all .12s; }
.mg-range-quick:hover { border-color: #2E7CF6; color: #2E7CF6; background: #f0f6ff; }
.mg-range-quick.on { background: #eaf2fe; border-color: #2E7CF6; border-style: solid; color: #2E7CF6; }
.mg-range-custom { display: flex; align-items: center; gap: 5px; padding: 0 8px 8px; }
.mg-range-custom .mg-date { flex: 1; min-width: 0; padding: 3px 5px; border: 1px solid #e3ecf7; border-radius: 5px; background: #fff; color: #22303f; font-size: 11px; font-family: inherit; }
.mg-range-custom .mg-date:focus { border-color: #2E7CF6; outline: none; }
.mg-range-custom span { flex: none; color: #94a3b8; font-size: 11px; }
.mg-range-foot { display: flex; align-items: center; gap: 8px; padding: 7px 8px; border-top: 1px solid #f0f4fa; }
.mg-range-ok { flex: none; padding: 4px 12px; border: 1px solid #2E7CF6; border-radius: 5px; background: #2E7CF6; color: #fff; font-size: 11.5px; cursor: pointer; font-family: inherit; }
.mg-range-ok:hover { background: #1a6fd4; }
.mg-range-hint { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 10.5px; color: #94a3b8; }
.mg-menu-item { display: flex; align-items: center; gap: 6px; padding: 5px 6px; border-radius: 6px; font-size: 12px; color: #33475b; cursor: pointer; }
.mg-menu-item:hover { background: #f2f8ff; }
.mg-menu-group { padding: 7px 8px 4px; margin-top: 4px; font-size: 11px; font-weight: 700; color: #124a90; border-top: 1px solid #eef3fa; }
.mg-menu-group:first-child { margin-top: 0; padding-top: 3px; border-top: none; }
.mg-menu-group.live { color: #b45309; }
.mg-menu-item input { flex: none; margin: 0; }
.mg-menu-item span { flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.mg-menu-unit { flex: none; font-style: normal; font-size: 10px; color: #a0b0c1; }
.mg-menu-empty { padding: 10px; font-size: 12px; color: #94a3b8; text-align: center; }
/* 八宫格模式下，单图专用的「峰谷」「导出 PNG」按钮不再适用 */
#btnToggleMarkers, #btnExportPNG { display: none; }
@media (max-width: 900px) { #multiGrid { grid-template-columns: 1fr; } }

/* ============================================================
   自适应布局 v2（A + C）· 2026-11-05
   A：assets/js/zoom.js 按窗口宽度等比缩放（大屏放大，100%–160%）
   C：卡片网格 auto-fit、图表高度流式、宽表横向滚动、窄屏侧栏抽屉
   本节放在文件末尾，用于覆盖前面的固定像素规则（同优先级后续生效）
   ============================================================ */

/* ---------- 1) 页宽与安全内边距 ---------- */
.toolbar-inner,
.tabs-inner,
.container,
.site-footer {
  width: min(94%, var(--page-max));
  padding-left: clamp(10px, 0.9vw, 20px);
  padding-right: clamp(10px, 0.9vw, 20px);
}

/* ---------- 2) 卡片行：弹性换行 + 末行等分拉伸（列数随宽度自然变化，末行不留空洞） ---------- */
.kpi-grid,
.wb-kpis,
.wb-boards,
.nav-cards,
.wb-steps,
.heat-grid {
  display: flex;
  flex-wrap: wrap;
}
.kpi-grid > *,
.wb-kpis > *,
.wb-boards > *,
.nav-cards > *,
.wb-steps > *,
.heat-grid > * {
  flex: 1 1 var(--card-min);   /* 基准宽统一由 --card-min 控制，剩余空间平均分配 */
  min-width: 0;                /* 允许收缩：长文本 / 宽表格不再撑破行 */
}
/* 不同语义的卡片基准宽：指标卡可窄、导航卡要宽 */
.nav-cards > *,
.wb-steps > * { flex-basis: 240px; }
.heat-grid > * { flex-basis: 240px; }   /* 日前披露 6 张指标卡在 1920 下保持整行 */
.wb-boards > * { flex-basis: 210px; }

/* 双栏图：窄屏单栏（图表高度单独控制，不参与拉伸） */
.heat-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 1200px) { .heat-grid-2 { grid-template-columns: 1fr; } }

/* 网格子项允许收缩：长文本 / 宽表格不再撑破栅格 */
.chart-grid > *,
.kpi-card,
.nav-card,
.wb-kpi,
.wb-boards .bd,
.wb-steps .st,
.heat-chart-card { min-width: 0; }

/* ---------- 3) 图表高度：随视口高度流式，避免小屏过高 / 大屏过矮 ---------- */
.chart-body { height: clamp(220px, 22vh, 340px); }
.heat-chart-body { height: clamp(260px, 32vh, 460px); }
@media (max-width: 1024px) {
  .chart-body { height: clamp(200px, 32vh, 300px); }
}

/* ---------- 4) 宽表：容器内横向滚动，整页不再被撑出滚动条 ---------- */
.table-wrap,
.daily-wrap,
.xl-panels,
.hist-scroll { max-width: 100%; overflow-x: auto; }
.xl-panels { align-items: safe center; }

/* ---------- 5) 页签条：窄屏横向滚动而不是挤压换行 ---------- */
.tabs-inner { overflow-x: auto; scrollbar-width: none; }
.tabs-inner::-webkit-scrollbar { display: none; }
.tab { flex: 0 0 auto; }

/* 缩放按钮：需要容纳「自动 133%」文案 */
.zoom-val { min-width: 86px; white-space: nowrap; }
.zoom-val.auto { color: var(--primary); border-color: var(--primary); }

/* ---------- 6) 窄屏（≤900px）：侧栏改抽屉 + 悬浮菜单按钮 ---------- */
.nav-toggle { display: none; }
.side-mask { display: none; }
@media (max-width: 900px) {
  body { padding-left: 0 !important; }
  .side-nav {
    display: flex;
    width: min(84vw, var(--side-w));
    transform: translateX(-100%);
    transition: transform .22s ease;
    z-index: 220;
  }
  body.nav-open .side-nav { transform: none; }
  .side-nav .side-collapse-top { display: none; }
  .side-mask {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 210;
    background: rgba(0, 0, 0, .38);
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s;
  }
  body.nav-open .side-mask { opacity: 1; pointer-events: auto; }
  .nav-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    left: 12px;
    bottom: 16px;
    z-index: 200;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    font-size: 19px;
    line-height: 1;
    cursor: pointer;
    font-family: inherit;
    box-shadow: 0 4px 14px rgba(16, 42, 83, .18);
  }
}

/* 首页「分类趋势」五通道图拉高（td/b/a/west/local） */
#chartGrid .chart-body { height: clamp(320px, 32vh, 460px); }

/* 分类趋势卡片标题居中 */
#chartGrid .chart-title { text-align: center; }

/* 导出图片内的文字统一黑体（趋势卡标题 + 负荷信息表） */
#chartGrid .chart-title { font-family: SimHei, "Microsoft YaHei", sans-serif; }
html body #loadPanels .xl-table { font-family: SimHei, "Microsoft YaHei", sans-serif; }

/* 负荷信息表字体：表头 + 通道名列用黑体，其余（数值/日期）回宋体 */
html body #loadPanels .xl-table { font-family: SimSun, "宋体", "NSimSun", serif; }
html body #loadPanels .xl-table thead th,
html body #loadPanels .xl-table td.cat { font-family: SimHei, "Microsoft YaHei", sans-serif; }