/* 方志书目录录页 ･ gazetteers.html 专属样式
   ------------------------------------------------------------
   独立成文件，不污染 pages.css / style.css。
   配色一律走主题变量，日/夜/暖三态自适应。
   ------------------------------------------------------------ */

/* ============================================================
   从 pages.css 提取：方志 31 页（枢纽 + 15 专题 + 15 深度）专题头所需
   ------------------------------------------------------------
   提取后 31 页不再引用 pages.css（80 KB），省下的首屏传输约 12 KB gzip。
   ⚠️ 本节必须放在 gazetteers.css 最前面：现状级联是 pages.css 先加载、
      gazetteers.css 后加载压它；摘掉 pages.css 后，只有本节处在文件头，
      各级联胜出关系才与现状等价（下文 B 批的 min-height:96px 继续压住
      pages 原版的 86px）。**不要移到文件末尾**。
   ============================================================ */


/* ============================================================
   驻马店九县地名史 ･ 专题页（county.html）
   ============================================================ */

/* ---------- 专题头 ---------- */
/* 与 .wb-section 使用同一套内边距，保证与下方卡片区左右对齐 */
.wb-topic {
  width: 100%;
  padding: 36px 52px 0;
}


.wb-topic__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 272px;
  gap: 44px;
  align-items: center;
  padding: 40px 44px;
  border: 1px solid var(--wb-ink);
  border-radius: 9px;
  background: var(--wb-surface);
  box-shadow: var(--wb-shadow);
}


.wb-topic .wb-pixel-label { margin-bottom: 13px; color: var(--wb-label); }


.wb-topic h1 {
  margin: 0 0 15px;
  border: 0;
  font-size: clamp(34px, 4.2vw, 54px);
  font-weight: 860;
  line-height: 1.1;
  letter-spacing: -.05em;
}


.wb-topic__lede {
  max-width: 660px;
  margin: 0;
  color: var(--wb-muted);
  font-size: 16px;
  line-height: 1.9;
}


.wb-topic__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
}


.wb-topic__stats span {
  display: inline-flex;
  align-items: baseline;
  gap: 7px;
  padding: 7px 14px;
  border: 1px solid var(--wb-line);
  border-radius: 999px;
  background: var(--wb-paper);
  color: var(--wb-muted);
  font-size: 13px;
}


.wb-topic__stats b {
  color: var(--wb-ink);
  font-family: var(--wb-pixel);
  font-size: 14px;
}


/* 右侧「数字印章」 */
.wb-topic__art {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}


.wb-topic__seal {
  display: flex;
  flex-direction: column;
  /* 数字与文字居中（步哥 2026-10-13：桌面端与手机端统一，手机端同款规则见 style.css） */
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 8px;
  min-height: 86px;
  padding: 15px 14px;
  border: 1px solid var(--wb-ink);
  border-radius: 7px;
  background: var(--wb-acid);
  color: var(--wb-on-acid, #0d0f0a);
  box-shadow: 4px 4px 0 var(--wb-ink);
}


.wb-topic__seal--wide {
  grid-column: 1 / -1;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 12px;
  min-height: 0;
  padding: 13px 14px;
  background: var(--wb-surface);
  color: var(--wb-ink);
}

/* 注：宽印章在暖色主题下的字色修正见本文件末尾（必须放在 `html.dark .wb-topic__seal` 之后才能生效） */

.wb-topic__seal b {
  font-family: var(--wb-pixel);
  font-size: 27px;
  line-height: 1;
}


.wb-topic__seal--wide b { font-size: 17px; }


.wb-topic__seal i {
  font-style: normal;
  font-family: var(--wb-pixel);
  font-size: 10px;
  letter-spacing: .04em;
  opacity: .7;
}


.wb-topic__seal--wide span { font-size: 13px; color: var(--wb-muted); }


/* 深色古纸主题补充：栏目页头印章块（红底）文字翻白 */
html.dark .wb-topic__seal { color: #fffdf7; }


/* 宽印章（.wb-topic__seal--wide）是「浅底深字」牌式，与红底小印章相反。
   上面那条 `html.dark .wb-topic__seal{color:#fffdf7}` 是为红底小印章把字翻白，
   但它会一并命中宽印章 —— 暖色主题下宽印章底色是暖白 #fffdf7、字也被翻成 #fffdf7，
   白压白完全不可读（county/best/checkin/about/heritage 等 8+ 页面均受影响）。
   本条特异性相同但位置更靠后，故能夺回字色；三态分别得深墨 / 深褐 / 米白。 */
html.dark .wb-topic__seal--wide { color: var(--wb-ink); }
/* 从 pages.css 分组字体规则拆出（同组另三条 wb-note__k / wb-best-rec__name / wb-post-card__title
   非方志类，不搬）：保证枢纽页 .wb-section__heading h2 的数字仍走衬线。 */
body .wb-section__heading h2 {
  font-family: "WBNumSerif", var(--wb-body, inherit);
}

@media (max-width: 1200px) {
  
  .wb-topic__inner { grid-template-columns: minmax(0, 1fr) 232px; gap: 32px; padding: 34px 32px; }
}

@media (max-width: 960px) {
  
  .wb-topic__inner { grid-template-columns: 1fr; gap: 28px; }
  
  .wb-topic__art { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 768px) {
  
  .wb-topic { padding: 24px 4px 0; }
  
  .wb-topic__inner { padding: 26px 22px; gap: 22px; }
  
  .wb-topic__art { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  
  .wb-topic__seal { min-height: 74px; padding: 13px 12px; }
}


/* ---------- 专题头「宽印章」（1690—1995 / 三百年，十二次修志） ----------
   复用全站 .wb-topic__seal + .wb-topic__seal--wide（浅底深字、描边、跨两列），
   只做两处页面级微调：方志页这块文案比其它栏目长，
   ① 编号用像素字体且必须整串显示，否则 1690—/1995 会被压成两行；
   ② 内边距收到 12px，给「三百年，十一次修志」留出整行空间。 */
.wb-page-gazetteers .wb-topic__seal--wide { padding: 13px 12px; }
.wb-page-gazetteers .wb-topic__seal--wide b { white-space: nowrap; }

/* ---------- 年代尺（等距刻度） ----------
   十个刻度按序号的 10 等分均匀分布，年份以文字标在标签里。
   不用真实年份比例：1931—1938 那 6 部只占 2.3%（约 18px），圆点直径就13px，
   物理上排不开；等距后彻底没有引线与竖排堆叠。 */
.wb-gz-scale {
  position: relative;
  margin-bottom: 16px;
  padding: 58px 30px 46px;
  border: 1px solid var(--wb-line);
  border-radius: 8px;
  background: var(--wb-surface);
}

/* 刻度卡里的年份是绝对定位的、不撑开容器：底部留白必须 ≥46px 才不会把年份压出卡片
   （实测 34px 时年份底边会溢出卡片 4px）。原先写 64px，叠加卡外 34px 间距与
   下一节 64px 顶距，一共近 160px 空白，看上去像「断层」。
   现在 46px / 16px，并把下一节顶距压到 40px → 视觉空白 ≈ 64px，与全站小节节奏一致。 */
#gzScale + .wb-section { padding-top: 40px; }

.wb-gz-scale__cap {
  position: absolute;
  top: 21px;
  left: 30px;
  margin: 0;
  color: var(--wb-label);
}

/* 轨道：一条横线 + 十个刻度点 */
.wb-gz-scale__track {
  position: relative;
  height: 14px;
  margin: 0 8px;
  border-top: 2px solid var(--wb-line);
}

.wb-gz-scale__mark {
  position: absolute;
  top: -7px;
  width: 12px;
  height: 12px;
  margin-left: -6px;
  border: 2px solid var(--wb-ink);
  border-radius: 50%;
  background: var(--wb-surface);
}

/* 平舆（唯一现代本）：酸绿描边 + 圆心小点，与其他刻度的空心圈区分。
   不用实心填充——实心色块会与下方标签文字叠出低对比（夜色下 2.55）。 */
.wb-gz-scale__mark.is-modern { border-color: var(--wb-acid-strong); }

.wb-gz-scale__mark.is-modern::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--wb-acid-strong);
  content: '';
  transform: translate(-50%, -50%);
}
.wb-gz-scale__mark.is-pref { border-style: dashed; background: var(--wb-surface); }

/* 标签：县名 + 年份两行，居中，省掉引线 */
.wb-gz-scale__lab {
  position: absolute;
  top: 22px;
  left: 50%;
  display: grid;
  justify-items: center;
  gap: 2px;
  min-width: 44px;
  text-align: center;
  transform: translateX(-50%);
}

.wb-gz-scale__lab b {
  color: var(--wb-ink);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

.wb-gz-scale__lab i {
  color: var(--wb-muted);
  display: block;
  font-family: var(--wb-pixel);
  font-size: 10px;
  font-style: normal;
  letter-spacing: .02em;
  white-space: nowrap;
}

/* 民国修志高峰底纹带 + 顶部标注 */
.wb-gz-scale__band {
  position: absolute;
  top: -4px;
  height: 12px;
  border-radius: 3px;
  background: var(--wb-acid);
  opacity: .3;
}

.wb-gz-scale__peak {
  position: absolute;
  top: 20px;
  padding: 3px 8px;
  border: 1px solid var(--wb-ink);
  border-radius: 3px;
  background: var(--wb-acid);
  color: var(--wb-on-acid, var(--wb-ink));
  font-family: var(--wb-pixel);
  font-size: 10px;
  letter-spacing: .04em;
  white-space: nowrap;
  transform: translateX(-50%);
}

html.dark .wb-gz-scale__peak { color: var(--wb-on-accent); }

/* 窄屏：隐藏等距刻度，改竖排清单 */
.wb-gz-scale__inner { display: none; }

/* ---------- 书目卡片墙 ---------- */
.wb-gz-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.wb-gz-card {
  display: flex;
  flex-direction: column;
  gap: 13px;
  padding: 22px 22px 18px;
  border: 1px solid var(--wb-line);
  border-radius: 8px;
  background: var(--wb-surface);
  color: var(--wb-ink) !important;
  text-decoration: none;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.wb-gz-card:hover {
  transform: translate(-3px, -3px);
  border-color: var(--wb-ink);
  box-shadow: var(--wb-shadow);
}

/* 府级志：跨整行的宽卡，作为九县共同的上一级政区 */
.wb-gz-card.is-pref {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 208px minmax(0, 1fr);
  gap: 30px;
  align-items: center;
  padding: 26px 30px;
  border-color: var(--wb-ink);
}

.wb-gz-card__id {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 2px 10px;
  padding-bottom: 12px;
  border-bottom: 1px dashed var(--wb-line);
}

.wb-gz-card.is-pref .wb-gz-card__id { padding-bottom: 0; border-bottom: 0; }

.wb-gz-card__ord {
  font-family: var(--wb-pixel);
  font-size: 13px;
  color: var(--wb-muted);
  letter-spacing: .04em;
}

.wb-gz-card__badge {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 1px solid var(--wb-ink);
  border-radius: 4px;
  background: var(--wb-paper);
  color: var(--wb-ink);
  font-family: var(--wb-pixel);
  font-size: 11px;
  font-weight: 700;
}

.wb-gz-card.is-pref .wb-gz-card__badge {
  background: var(--wb-acid);
  color: var(--wb-on-acid, var(--wb-ink));
}

/* 暖色/夜色的 --wb-acid 是深赭红/朱砂，此时压亮字（浅色主题是亮酸绿，压深墨即可） */
html.dark .wb-gz-card.is-pref .wb-gz-card__badge { color: var(--wb-on-accent); }

.wb-gz-card__county {
  grid-column: 1 / -1;
  margin-top: 5px;
  font-size: 29px;
  font-weight: 860;
  line-height: 1.12;
  letter-spacing: -.045em;
}

.wb-gz-card.is-pref .wb-gz-card__county { font-size: 36px; }

.wb-gz-card__slug {
  grid-column: 1 / -1;
  color: var(--wb-muted);
  font-family: var(--wb-pixel);
  font-size: 11px;
  letter-spacing: .05em;
}

.wb-gz-card__body {
  display: flex;
  flex-direction: column;
  gap: 11px;
  min-width: 0;
  /* 撑满卡片剩余高度：状态签靠 margin-top:auto 落到卡片左下角，
     同排（栅格等高）各卡的签位因此完全对齐 */
  flex: 1 1 auto;
}

.wb-gz-card__title {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 9px;
  margin: 0;
  font-size: 19px;
  font-weight: 780;
  line-height: 1.3;
  letter-spacing: -.02em;
}

.wb-gz-card__era {
  color: var(--wb-accent-deep);
  font-family: var(--wb-pixel);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: .02em;
}

.wb-gz-card__by {
  margin: 0;
  color: var(--wb-ink);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.7;
}

.wb-gz-card__facts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.wb-gz-card__facts > span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 11px;
  border: 1px solid var(--wb-line);
  border-radius: 999px;
  background: var(--wb-paper);
  font-size: 12px;
}

.wb-gz-card__facts i {
  color: var(--wb-muted);
  font-style: normal;
  font-family: var(--wb-pixel);
  font-size: 10px;
}

.wb-gz-card__facts b { font-weight: 600; }

.wb-gz-card__series {
  margin: 0;
  color: var(--wb-muted);
  font-size: 12px;
  line-height: 1.6;
}

.wb-gz-card__note {
  margin: 0;
  padding-left: 11px;
  border-left: 2px solid var(--wb-acid);
  color: var(--wb-ink);
  font-size: 13px;
  line-height: 1.75;
}

/* 备查本（同一志的另一套扫描） */
.wb-gz-card__alt {
  margin: 0;
  color: var(--wb-muted);
  font-size: 12px;
  line-height: 1.65;
}

.wb-gz-card__alt b {
  color: var(--wb-ink);
  font-weight: 600;
}

/* 转写状态签（固定贴卡片左下角：正文撑满 + margin-top:auto 推开） */
.wb-gz-card__state {
  display: inline-flex;
  align-self: flex-start;
  align-items: center;
  gap: 6px;
  margin-top: auto;
  padding: 4px 10px;
  border: 1px solid var(--wb-line);
  border-radius: 4px;
  background: var(--wb-paper);
  color: var(--wb-muted);
  font-family: var(--wb-pixel);
  font-size: 10px;
  letter-spacing: .04em;
}

.wb-gz-card__state::before {
  width: 7px;
  height: 7px;
  border: 1px solid currentColor;
  border-radius: 50%;
  content: '';
}

.wb-gz-card__state.is-text::before,
.wb-gz-card__state.is-data::before { background: var(--wb-acid); }

/* ---------- 底部说明块 ---------- */
.wb-gz-note {
  display: grid;
  gap: 14px;
  max-width: 860px;
  margin: 0;
  padding: 26px 30px;
  border: 1px solid var(--wb-line);
  border-left: 4px solid var(--wb-ink);
  border-radius: 8px;
  background: var(--wb-surface);
}

.wb-gz-note p {
  margin: 0;
  color: var(--wb-ink);
  font-size: 14px;
  line-height: 1.9;
}

.wb-gz-note p:first-child {
  color: var(--wb-muted);
  font-size: 13px;
}

/* ---------- 响应式 ---------- */
@media (max-width: 1100px) {
  .wb-gz-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wb-gz-card.is-pref { grid-template-columns: minmax(0, 1fr); gap: 18px; }
}

@media (max-width: 768px) {
  .wb-gz-grid { grid-template-columns: 1fr; gap: 16px; }
  .wb-gz-card { padding: 20px 18px 16px; }
  .wb-gz-card.is-pref { padding: 22px 18px; }
  .wb-gz-card__county { font-size: 26px; }
  .wb-gz-card.is-pref .wb-gz-card__county { font-size: 30px; }

  /* 年代尺在窄屏改为竖排清单，避免横条刻度挤成一团 */
  .wb-gz-scale { padding: 20px 18px 18px; }
  .wb-gz-scale__cap { position: static; margin-bottom: 16px; }
  .wb-gz-scale__track,
  .wb-gz-scale__peak { display: none; }
  .wb-gz-scale__inner { display: grid; gap: 9px; }
  .wb-gz-scale__row {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    align-items: baseline;
    gap: 10px;
    padding-bottom: 8px;
    border-bottom: 1px dashed var(--wb-line);
  }
  .wb-gz-scale__year {
    color: var(--wb-muted);
    font-family: var(--wb-pixel);
    font-size: 11px;
    text-align: right;
  }
  .wb-gz-scale__name { font-size: 14px; font-weight: 600; }
  .wb-gz-scale__name span { color: var(--wb-muted); font-weight: 400; }
}
/* ============================================================
   县志一览表（速查 ･ 可排序）
   ============================================================ */
.wb-gz-tablewrap {
  overflow-x: auto;
  border: 1px solid var(--wb-line);
  border-radius: 8px;
  background: var(--wb-surface);
}

.wb-gz-table {
  width: 100%;
  min-width: 660px;
  border-collapse: collapse;
  font-size: 14px;
}

.wb-gz-table thead th {
  padding: 0;
  border-bottom: 2px solid var(--wb-ink);
  background: var(--wb-paper);
  text-align: left;
  font-weight: 600;
}

.wb-gz-table thead th.is-num { text-align: right; }

.wb-gz-table thead button {
  width: 100%;
  padding: 13px 16px;
  border: 0;
  background: transparent;
  color: var(--wb-ink);
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .04em;
  text-align: left;
  cursor: pointer;
  transition: color .15s ease;
}

.wb-gz-table thead th.is-num button { text-align: right; }

.wb-gz-table thead button::after {
  display: inline-block;
  margin-left: 7px;
  color: var(--wb-muted);
  content: '↕';
  font-size: 10px;
  opacity: .45;
}

.wb-gz-table thead button:hover { color: var(--wb-accent-deep); }

.wb-gz-table thead button.is-active { color: var(--wb-accent-deep); }
.wb-gz-table thead button.is-active::after { opacity: 1; }
.wb-gz-table thead button[data-dir="1"]::after { content: '↑'; }
.wb-gz-table thead button[data-dir="-1"]::after { content: '↓'; }

.wb-gz-table tbody th,
.wb-gz-table tbody td {
  padding: 12px 16px;
  border-bottom: 1px solid var(--wb-line);
  color: var(--wb-ink);
  text-align: left;
  font-weight: 400;
  vertical-align: top;
}

.wb-gz-table tbody tr:last-child th,
.wb-gz-table tbody tr:last-child td { border-bottom: 0; }

.wb-gz-table tbody th {
  font-weight: 700;
  white-space: nowrap;
}

.wb-gz-table tbody th.is-pref { color: var(--wb-accent-deep); }

.wb-gz-table tbody td.is-num {
  font-family: var(--wb-pixel);
  font-size: 15px;
  font-weight: 700;
  text-align: right;
  white-space: nowrap;
}

.wb-gz-table tbody tr { transition: background-color .15s ease; }
.wb-gz-table tbody tr:hover { background: var(--wb-paper); }

/* 「朝代小标签」.wb-gz-tag 两组规则（本节描边款 + 文末四色实底胶囊款）
   已于 2026-10-14 随 03 区一览表减列一并删除——一览表不再有朝代列，
   全站再无 .wb-gz-tag 使用者；朝代配色改由县名前的 .gz-tdot 色点
   承载（与书脊墙图例、卡片描边同源，见文件末新节）。 */

/* ---------- 表格响应式（04 交叉对比 2026-10-14 撤销，@media 1000 块随删） ---------- */
@media (max-width: 768px) {
  .wb-gz-table thead button { padding: 11px 12px; }
  .wb-gz-table tbody th,
  .wb-gz-table tbody td { padding: 10px 12px; font-size: 13px; }
}

/* ============================================================
   窄屏表格 → 转成卡片式行（横向滚动在手机上不可用）
   ============================================================ */
@media (max-width: 700px) {
  .wb-gz-tablewrap { border: 0; background: transparent; overflow: visible; }

  .wb-gz-table {
    min-width: 0;
    display: grid;
    gap: 12px;
  }

  /* 表头藏起来（含 visually-hidden 的 caption），改由每行的数据标签说明含义 */
  .wb-gz-table thead,
  .wb-gz-table caption {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
  }

  .wb-gz-table tbody {
    display: grid;
    gap: 12px;
  }

  .wb-gz-table tbody tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px 12px;
    padding: 14px 16px;
    border: 1px solid var(--wb-line);
    border-radius: 8px;
    background: var(--wb-surface);
  }

  /* 第一行：县 + 页数（页数最需要一眼看到） */
  .wb-gz-table tbody th {
    grid-column: 1;
    font-size: 17px;
    font-weight: 780;
    letter-spacing: -.02em;
  }

  .wb-gz-table tbody td.is-num {
    grid-column: 2;
    grid-row: 1;
    font-size: 17px;
  }

  /* 志名 + 朝代标签并排 */
  .wb-gz-table tbody td:nth-child(2) {
    grid-column: 1;
    font-weight: 600;
  }

  .wb-gz-table tbody td:last-child {
    grid-column: 2;
    grid-row: 2;
    align-self: center;
  }

  .wb-gz-table tbody td:nth-child(3) { grid-column: 1 / -1; }
  .wb-gz-table tbody td:nth-child(4) { grid-column: 1 / -1; }

  .wb-gz-table tbody th,
  .wb-gz-table tbody td {
    padding: 0;
    border-bottom: 0;
  }

  .wb-gz-table tbody td:nth-child(3),
  .wb-gz-table tbody td:nth-child(4) {
    color: var(--wb-muted);
    font-size: 12px;
    line-height: 1.65;
  }

  /* 窄屏没有表头，排序改由页首提示给出 */
  .wb-gz-table tbody td.is-num::before {
    display: block;
    color: var(--wb-muted);
    font-family: inherit;
    font-size: 10px;
    font-weight: 400;
    content: '页数';
  }
}

/* ---------- 方志宏观分析区块（并入 gazetteers.html） ---------- */
/* 不额外加 margin-top：全站 .wb-section 统一 padding-top:64px（style.css:662），
   再叠 margin 会让此处空隙达 98px，比其它页面明显松散。 */
.wb-gz-macro { margin: 0; }
.wb-gz-macro__body { background: var(--wb-paper); color: var(--wb-ink);
  border: 1px solid var(--wb-line); border-radius: 12px; padding: 18px 22px 22px; }
.wb-gz-macro__h { font-size: 16px; margin: 22px 0 8px; padding-left: 9px;
  border-left: 3px solid var(--wb-acid); }
.wb-gz-macro__body > .wb-gz-macro__h:first-child { margin-top: 4px; }
.wb-gz-macro__cap { font-size: 12.5px; opacity: .72; margin: 2px 0 10px; }

/* 图注解读：图表下方的「怎么读」，左侧 acid 竖线 + 浅底，与上方 cap 区分 */
.wb-gz-read { margin: 10px 0 20px; padding: 11px 14px; font-size: 12.5px; line-height: 1.85;
  border-left: 2px solid var(--wb-acid); background: var(--wb-gz-read-bg);
  color: var(--wb-ink); border-radius: 0 6px 6px 0; }
/* 「怎么读」徽章：深底亮字小章（用 chip 而非 acid，acid 在暖/夜主题会变深红） */
.wb-gz-read__tag { display: inline-block; margin-right: 6px; padding: 1px 7px; border-radius: 4px;
  background: var(--wb-gz-chip); color: var(--wb-on-chip); font-size: 11px; font-weight: 600;
  letter-spacing: .06em; vertical-align: 1px; }
.wb-gz-read__sub { display: inline-block; margin-right: 5px; font-style: normal; font-weight: 600;
  font-size: 12px; color: var(--wb-ink); opacity: .85; }
.wb-gz-read b:not(.wb-gz-read__tag) { font-weight: 700; color: var(--wb-ink); }
.wb-gz-macro__scroll { overflow-x: auto; }
.wb-gz-macro table { border-collapse: collapse; width: 100%; font-size: 12.5px; margin: 4px 0 6px; }
.wb-gz-macro th, .wb-gz-macro td { border: 1px solid var(--wb-line); padding: 6px 8px; text-align: center; }
.wb-gz-macro th { background: var(--wb-gz-th); font-weight: 600; white-space: nowrap; }
.wb-gz-macro td.nm { font-weight: 600; white-space: nowrap; text-align: left; }
/* 斑马纹：偶数数据行浅底，便于横向扫读（实色变量，兼容对比度探针） */
.wb-gz-macro tr.wb-gz-zebra > td { background: var(--wb-gz-zebra); }
.wb-gz-macro tr.wb-gz-na > td { background: transparent; opacity: .55; font-style: italic; }
.wb-gz-macro__chart { margin: 4px 0 18px; }
.wb-gz-macro__ul { margin: 6px 0 0; padding-left: 20px; }
.wb-gz-macro__ul li { margin: 7px 0; font-size: 13.5px; line-height: 1.7; }

/* ---------- 图表（纯 HTML/CSS，三主题自适应） ---------- */
/* 图表底色随主题走：夜/暖主题下不会串成灰白块 */
.wb-gz-macro { --wb-gz-track: rgba(127,127,127,.14); --wb-gz-other: #b9b0a2;
  --wb-gz-blue: #2f6fb0; --wb-gz-red: #b23b3b; --wb-gz-green: #5a7d4a;
  --wb-gz-th: #f0ece1; --wb-gz-zebra: #faf7f0; --wb-gz-badge-bg: #dbe97a; --wb-gz-read-bg: #f2f4ea;
  --wb-gz-chip: #3a352c; --wb-on-chip: #f5f2e8;
  --wb-gz-major-bg: #fdf1e2; --wb-gz-major-line: #dba98f;
  --wb-gz-major-card: #fffdf9; }
html.dark .wb-gz-macro { --wb-gz-track: rgba(127,127,127,.16); --wb-gz-other: #b0a693;
  --wb-gz-blue: #2f6fb0; --wb-gz-red: #b23b3b; --wb-gz-green: #6a9060;
  --wb-gz-th: #eae0c8; --wb-gz-zebra: #f6f1e7; --wb-gz-badge-bg: #e8dcb4; --wb-gz-read-bg: #efe8d6;
  --wb-gz-chip: #3a352c; --wb-on-chip: #f6f1e7;
  --wb-gz-major-bg: #f9ecd8; --wb-gz-major-line: #d3a87f;
  --wb-gz-major-card: #fffefb; }   /* 暖主题是浅底(paper #f6f1e7)，zebra/解读底用更浅的同族色 */
html.ink .wb-gz-macro { --wb-gz-track: rgba(255,255,255,.10); --wb-gz-other: #5a5f66;
  --wb-gz-blue: #6fa8dc; --wb-gz-red: #e08a8a; --wb-gz-green: #8fb87f;
  --wb-gz-th: #24262a; --wb-gz-zebra: #1e2023; --wb-gz-badge-bg: #4a5b16; --wb-gz-read-bg: #1e2126;
  --wb-gz-chip: #d8f238; --wb-on-chip: #1e2126;
  --wb-gz-major-bg: #211e1a; --wb-gz-major-line: #6b4f3c;
  --wb-gz-major-card: #2b2723; }

/* 图例：flex 换行，绝不挤成一团 */
.wb-gz-legend { display: flex; flex-wrap: wrap; gap: 6px 16px;
  list-style: none; margin: 0 0 12px; padding: 0; }
.wb-gz-legend li { display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; opacity: .82; white-space: nowrap; }
.wb-gz-legend i { width: 11px; height: 11px; border-radius: 3px; flex: none; }

/* 堆叠条：朝代 × 灾型
   类名用 wb-gz-stack，勿用 wb-gz-bars —— 后者同时是「页数对比」面板的修饰类，
   同名会让下面的 list 样式把面板 padding 覆盖为 0，导致文字贴边框。 */
.wb-gz-stack { list-style: none; margin: 0; padding: 0; }
.wb-gz-brow { display: flex; align-items: center; gap: 10px; margin-bottom: 7px; }
.wb-gz-brow__k { flex: none; width: 2.4em; font-size: 12.5px; opacity: .85; }
.wb-gz-brow__bar { flex: 1 1 auto; display: flex; height: 15px; min-width: 0;
  border-radius: 4px; overflow: hidden; background: var(--wb-gz-track); }
.wb-gz-seg { display: block; min-width: 1px; }
.wb-gz-seg--other { background: var(--wb-gz-other); }
.wb-gz-brow__v { flex: none; width: 3.6em; text-align: right;
  font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; opacity: .8; }

/* 横向柱：各县对比 */
.wb-gz-hbars { list-style: none; margin: 0; padding: 0; }
.wb-gz-hrow { display: flex; align-items: center; gap: 10px; margin-bottom: 7px; }
.wb-gz-hrow__k { flex: none; width: 5.2em; font-size: 12.5px; white-space: nowrap; }
.wb-gz-hrow__track { flex: 1 1 auto; height: 15px; min-width: 0;
  border-radius: 4px; background: var(--wb-gz-track); overflow: hidden; }
.wb-gz-hrow__fill { display: block; height: 100%; border-radius: 4px; }
.wb-gz-hrow__fill--blue { background: var(--wb-gz-blue); }
.wb-gz-hrow__fill--red  { background: var(--wb-gz-red); }
.wb-gz-hrow__fill--green{ background: var(--wb-gz-green); }
.wb-gz-hrow__v { flex: none; min-width: 4.6em; text-align: right;
  font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; opacity: .82; }
.wb-gz-hrow__v em { font-style: normal; font-weight: 400; font-size: 11px; opacity: .7; }

/* ---------- 书院与学田制度 ---------- */
.wb-gz-scenetable { overflow-x: auto; margin: 6px 0 4px; }
.wb-gz-academy { margin: 12px 0 4px; }
.wb-gz-academy__h { font-size: 14px; margin: 14px 0 6px; font-weight: 600; }
.wb-gz-academy__h span { font-weight: 400; font-size: 12px; opacity: .6; }

/* 「最重的一次」整块强调：铺底 + 顶部色条 + 红底徽章 */
.wb-gz-academy--major { position: relative; margin: 20px 0 6px; padding: 16px 18px 14px;
  border: 1px solid var(--wb-gz-major-line); border-radius: 10px;
  background: var(--wb-gz-major-bg); }
.wb-gz-academy--major::before { content: ''; position: absolute; left: -1px; right: -1px; top: -1px;
  height: 4px; border-radius: 10px 10px 0 0; background: var(--wb-gz-red); }
.wb-gz-academy--major .wb-gz-academy__h { margin-top: 6px; font-size: 15px; }
.wb-gz-academy--major .wb-gz-academy__h span { opacity: .7; }
.wb-gz-major__flag { display: inline-block; margin-right: 8px; padding: 2px 9px; border-radius: 5px;
  background: var(--wb-gz-chip); color: var(--wb-on-chip); font-style: normal;
  font-size: 11px; font-weight: 700; letter-spacing: .08em; vertical-align: 2px; }
.wb-gz-academy--major .wb-gz-macro__cap { opacity: .88; font-size: 12.5px; }
.wb-gz-academy--major .wb-gz-qlist li { background: var(--wb-gz-major-card); }
.wb-gz-academy--major .wb-gz-qlist li:hover { border-color: var(--wb-gz-major-line); }
.wb-gz-academy .wb-gz-scenetable table { border-collapse: collapse; width: 100%; font-size: 12.5px; }
.wb-gz-academy .wb-gz-scenetable th, .wb-gz-academy .wb-gz-scenetable td {
  border: 1px solid var(--wb-line); padding: 8px 10px; vertical-align: top; }
.wb-gz-academy .wb-gz-scenetable > table > tr:first-child > th {
  background: var(--wb-gz-th); font-weight: 600; text-align: center; font-size: 12.5px; }
.wb-gz-academy .nm { text-align: center; white-space: nowrap; font-weight: 600; }
.wb-gz-academy .nm2 { white-space: nowrap; font-weight: 600; text-align: center; }
.wb-gz-academy .mu { white-space: nowrap; font-variant-numeric: tabular-nums; }
.wb-gz-academy .src { font-size: 11.5px; opacity: .66; min-width: 9em; }
.wb-gz-academy__note { margin-top: 3px; opacity: .92; font-size: 11.5px; line-height: 1.55; }
.wb-gz-academy tr:hover > td { background: var(--wb-gz-zebra); }

/* 制度细节：编号条目 + 引文式（不用等宽卡片，避免长短不一导致高度参差） */
.wb-gz-syslist { list-style: none; margin: 4px 0 0; padding: 0; counter-reset: none; }
.wb-gz-sys { padding: 11px 2px 12px; border-bottom: 1px dashed var(--wb-line); }
.wb-gz-sys:first-child { padding-top: 6px; }
.wb-gz-sys:last-child { border-bottom: 0; padding-bottom: 4px; }
.wb-gz-sys__hd { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 9px; margin-bottom: 5px; }
.wb-gz-sys__no { flex: none; font-family: var(--wb-pixel); font-size: 11px; font-weight: 700;
  font-variant-numeric: tabular-nums; color: var(--wb-ink); background: var(--wb-gz-badge-bg);
  border-radius: 4px; padding: 1px 5px; }
.wb-gz-sys__t { font-size: 13.5px; font-weight: 650; line-height: 1.5; }
.wb-gz-sys__src { margin-left: auto; font-style: normal; font-size: 11px; opacity: .55; white-space: nowrap; }
.wb-gz-sys__x { margin: 0; padding-left: 2px; font-size: 12.5px; line-height: 1.85; opacity: .88;
  text-indent: 0; }
@media (max-width: 640px) { .wb-gz-sys__src { margin-left: 0; width: 100%; } }

/* ---------- 地震专题 ---------- */
/* 强度圆点：三级，按原文描述的破坏程度 */
.wb-gz-qdot { display: inline-block; width: 8px; height: 8px; border-radius: 50%;
  margin-right: 5px; vertical-align: 1px; flex: none; }
.wb-gz-qdot.lv1 { background: #9aa7b4; }
.wb-gz-qdot.lv2 { background: var(--wb-gz-orange, #c9772f); }
.wb-gz-qdot.lv3 { background: var(--wb-gz-red); }
/* 图例行 */
.wb-gz-qlegend > td { font-size: 11.5px; opacity: .78; padding-top: 6px !important; padding-bottom: 8px !important; }
.wb-gz-qlegend .wb-gz-qdot { margin-left: 12px; }
.wb-gz-qlegend .wb-gz-qdot:first-child { margin-left: 0; }
/* 编年表 */
.wb-gz-academy .yr { font-family: var(--wb-pixel); font-variant-numeric: tabular-nums;
  white-space: nowrap; font-size: 12px; width: 5.4em; }
.wb-gz-academy .rg { white-space: nowrap; font-size: 12px; width: 9em; }
.wb-gz-academy .pl { font-size: 12px; width: 12em; }
.wb-gz-academy .ef { font-size: 12px; }
/* 重大地震（多志同日记载）高亮 */
.wb-gz-academy tr.wb-gz-qrow.is-major > td { background: var(--wb-gz-read-bg); }
.wb-gz-academy tr.wb-gz-qrow.is-major > td:first-child { border-left: 3px solid var(--wb-acid); }
.wb-gz-academy tr.wb-gz-qrow:hover > td { background: var(--wb-gz-zebra); }
.wb-gz-academy tr.wb-gz-qrow.is-major:hover > td { background: var(--wb-gz-zebra); }
/* 受灾类型表：条数列居中加粗 */
.wb-gz-academy .mu { text-align: center; }
/* 朝代分布横条 */
.wb-gz-qbars { list-style: none; margin: 6px 0 12px; padding: 0; display: flex;
  flex-wrap: wrap; gap: 8px 16px; }
.wb-gz-qbar { display: flex; align-items: center; gap: 6px; font-size: 12px; }
.wb-gz-qbar__k { color: var(--wb-ink); opacity: .85; width: 1.8em; font-weight: 600; }
.wb-gz-qbar__t { display: block; width: 74px; height: 10px; border-radius: 5px;
  background: var(--wb-gz-track); overflow: hidden; border: 1px solid var(--wb-line); }
.wb-gz-qbar__t i { display: block; height: 100%; border-radius: 5px; background: var(--wb-gz-red); }
.wb-gz-qbar b { font-variant-numeric: tabular-nums; font-size: 12.5px; font-weight: 700; }
.wb-gz-academy .yr { font-family: var(--wb-pixel); font-variant-numeric: tabular-nums;
  white-space: nowrap; font-size: 12px; }
.wb-gz-academy .rg { white-space: nowrap; font-size: 12px; }
.wb-gz-academy .pl { font-size: 12px; }
.wb-gz-academy .ef { font-size: 12px; }
/* 重大地震（多志同日记载）高亮 */
.wb-gz-academy tr.wb-gz-qrow.is-major > td { background: var(--wb-gz-read-bg); }
.wb-gz-academy tr.wb-gz-qrow.is-major > td:first-child { border-left: 3px solid var(--wb-acid); font-weight: 700; }
/* 1668 专项：八志对照卡片。两列（每列 ~490px），单条不再挤成 3-4 行 */
.wb-gz-qlist { list-style: none; margin: 8px 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; }
.wb-gz-qlist li { display: grid; grid-template-columns: 2.1em 3.4em 1fr; gap: 9px;
  align-items: baseline; font-size: 12.5px; line-height: 1.75;
  padding: 9px 12px; border: 1px solid var(--wb-line); border-radius: 7px;
  background: var(--wb-gz-read-bg); }
.wb-gz-qlist__no { font-style: normal; font-family: var(--wb-pixel); font-size: 10.5px;
  font-weight: 700; color: var(--wb-ink); background: var(--wb-gz-badge-bg);
  border-radius: 4px; padding: 1px 0; text-align: center; font-variant-numeric: tabular-nums; }
.wb-gz-qlist li > b { color: var(--wb-ink); font-weight: 700; font-size: 13px; }
.wb-gz-qlist li > span { opacity: .88; }
@media (max-width: 860px) { .wb-gz-qlist { grid-template-columns: 1fr; } }

/* 手机：标签与数值让位给条形 */
@media (max-width: 640px) {
  .wb-gz-academy-cards { grid-template-columns: 1fr; }
  .wb-gz-macro__body { padding: 14px 13px 16px; }
  .wb-gz-brow { gap: 7px; }
  .wb-gz-brow__k { width: 2em; font-size: 12px; }
  .wb-gz-brow__v { width: 3em; font-size: 11.5px; }
  .wb-gz-hrow { gap: 7px; }
  .wb-gz-hrow__k { width: 4.4em; font-size: 12px; }
  .wb-gz-hrow__v { min-width: 3.8em; font-size: 11.5px; }
  .wb-gz-hrow__v em { display: none; }
  .wb-gz-legend { gap: 5px 12px; }
}

/* ---------- 「相关 / 专题」卡片（方志页与 gz-classes.html 共用） ---------- */
.wb-gz-related {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}
.wb-gz-related__card {
  display: block;
  padding: 16px 18px;
  border: 1px solid var(--wb-line);
  border-radius: 10px;
  background: var(--wb-surface);
  text-decoration: none;
  transition: border-color .15s ease, transform .15s ease;
}
.wb-gz-related__card:hover {
  border-color: var(--wb-accent, var(--wb-ink));
  transform: translateY(-2px);
}
.wb-gz-related__card b {
  display: block;
  margin-bottom: 5px;
  color: var(--wb-ink);
  font-size: 15px;
}
.wb-gz-related__card span {
  color: var(--wb-muted);
  font-size: 12.5px;
  line-height: 1.7;
}
@media (max-width: 768px) {
  .wb-gz-related__card { padding: 13px 14px; }
}

/* ============================================================
   方志栏目页「专题矩阵」（2026-10-13 重设计）
   ------------------------------------------------------------
   取代原先在 .wb-gz-related 上层层覆盖的「专题入口卡」补丁样式
   （那套样式曾因 2 列并排 + 绝对定位胶囊，反复加 @media 补丁）。
   本套为栏目页专有：数据由 data/gz-topics.js 提供，14 辑分 5 带排列。
   颜色全部走主题变量（--wb-*），日 / 暖 / 夜三态自动适配，无硬编码黑白。
   ============================================================ */

.wb-section.wb-gz-hub { padding-top: 42px; }

/* ---------- 顶部汇总条 ---------- */
.wb-gz-hub__sum {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 30px;
}
.wb-gz-hub__sum > div {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 8px 15px;
  border: 1px solid var(--wb-line);
  border-radius: 999px;
  background: var(--wb-surface);
}
.wb-gz-hub__sum dt { color: var(--wb-muted); font-size: 12px; }
.wb-gz-hub__sum dd {
  margin: 0;
  color: var(--wb-ink);
  font-family: var(--wb-pixel);
  font-size: 17px;
  line-height: 1;
}
.wb-gz-hub__sum dd i {
  margin-left: 3px;
  font-style: normal;
  font-family: inherit;
  font-size: 10.5px;
  color: var(--wb-muted);
}

/* ---------- 分带（5 带） ---------- */
.wb-gz-hub__band + .wb-gz-hub__band { margin-top: 34px; }

.wb-gz-hub__gh {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin: 0 0 6px;
}
.wb-gz-hub__gh b { color: var(--wb-ink); font-size: 16px; }
.wb-gz-hub__gh i {
  order: 1;
  font-style: normal;
  color: var(--wb-muted);
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.wb-gz-hub__gh::after {
  content: '';
  order: 2;
  flex: 1;
  min-width: 24px;
  height: 1px;
  background: var(--wb-line);
  transform: translateY(-4px);
}
.wb-gz-hub__gn {
  order: 3;
  font-family: var(--wb-pixel);
  font-size: 10.5px;
  color: var(--wb-muted);
}
.wb-gz-hub__gnote {
  margin: 0 0 16px;
  color: var(--wb-muted);
  font-size: 12.5px;
  line-height: 1.6;
}

/* ---------- 卡片网格 ---------- */
.wb-gz-hub__grid {
  display: grid;
  /* auto-fit：空轨折叠，每带卡片自动铺满整行（2 辑带＝两张宽卡、4 辑带＝四张窄卡） */
  grid-template-columns: repeat(auto-fit, minmax(236px, 1fr));
  gap: 14px;
  align-items: stretch;
}
.wb-gz-hub__card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 18px 20px 16px;
  border: 1px solid var(--wb-line);
  border-radius: 14px;
  background: var(--wb-surface);
  text-decoration: none;
  overflow: hidden;
  transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}
.wb-gz-hub__card::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: var(--wb-acid);
  opacity: .5;
  transition: opacity .16s ease;
}
.wb-gz-hub__card:hover,
.wb-gz-hub__card:focus-visible {
  border-color: var(--wb-ink);
  transform: translateY(-4px);
  box-shadow: 6px 6px 0 var(--wb-acid);
  outline: none;
}
.wb-gz-hub__card:hover::before,
.wb-gz-hub__card:focus-visible::before { opacity: 1; }

.wb-gz-hub__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 13px;
}
.wb-gz-hub__n {
  padding: 3px 9px;
  border-radius: 7px;
  background: var(--wb-acid-soft);
  color: var(--wb-accent-deep);
  font-family: var(--wb-pixel);
  font-size: 12px;
  line-height: 1.5;
}
html.dark .wb-gz-hub__n { color: var(--wb-ink); }

/* 图标方砖：40px 圆角小卡，hover 时填酸绿，替代原先裸露的灰色像素图 */
.wb-gz-hub__tile {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid var(--wb-line);
  border-radius: 11px;
  background: var(--wb-paper);
  color: var(--wb-ink);
  transition: background-color .16s ease, color .16s ease, border-color .16s ease;
}
.wb-gz-hub__ico { font-size: 21px; }
.wb-gz-hub__card:hover .wb-gz-hub__tile,
.wb-gz-hub__card:focus-visible .wb-gz-hub__tile {
  border-color: transparent;
  background: var(--wb-acid);
  color: var(--wb-on-acid, var(--wb-ink));
}
html.dark .wb-gz-hub__card:hover .wb-gz-hub__tile,
html.dark .wb-gz-hub__card:focus-visible .wb-gz-hub__tile { color: var(--wb-on-accent); }

.wb-gz-hub__t {
  display: block;
  margin-bottom: 10px;
  color: var(--wb-ink);
  font-size: 16.5px;
  font-weight: 760;
  line-height: 1.4;
}
.wb-gz-hub__met {
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin-bottom: 11px;
  padding-bottom: 11px;
  border-bottom: 1px dashed var(--wb-line);
}
.wb-gz-hub__met b {
  color: var(--wb-ink);
  font-family: var(--wb-pixel);
  font-size: 27px;
  line-height: 1;
}
.wb-gz-hub__met i {
  color: var(--wb-muted);
  font-style: normal;
  font-size: 11.5px;
}
.wb-gz-hub__met em {
  margin-left: auto;
  color: var(--wb-muted);
  font-style: normal;
  font-size: 11.5px;
  white-space: nowrap;
}
.wb-gz-hub__d {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  margin: 0 0 14px;
  color: var(--wb-muted);
  font-size: 12.5px;
  line-height: 1.8;
}
.wb-gz-hub__go {
  display: flex;
  align-items: center;
  gap: 6px;
  align-self: flex-start;
  margin-top: auto;
  padding: 6px 13px;
  border: 1px solid var(--wb-line);
  border-radius: 999px;
  background: var(--wb-paper);
  color: var(--wb-accent-deep);
  font-size: 12px;
  font-weight: 700;
  transition: background-color .16s ease, color .16s ease, border-color .16s ease;
}
.wb-gz-hub__go .hl { font-size: 13px; transition: transform .16s ease; }
.wb-gz-hub__card:hover .wb-gz-hub__go,
.wb-gz-hub__card:focus-visible .wb-gz-hub__go {
  border-color: transparent;
  background: var(--wb-acid);
  color: var(--wb-on-acid, var(--wb-ink));
}
html.dark .wb-gz-hub__card:hover .wb-gz-hub__go,
html.dark .wb-gz-hub__card:focus-visible .wb-gz-hub__go { color: var(--wb-on-accent); }
.wb-gz-hub__card:hover .wb-gz-hub__go .hl,
.wb-gz-hub__card:focus-visible .wb-gz-hub__go .hl { transform: translateX(4px); }

.wb-gz-hub__fallback {
  margin: 0;
  padding: 14px 16px;
  border: 1px solid var(--wb-line);
  border-radius: 10px;
  background: var(--wb-surface);
  color: var(--wb-muted);
  font-size: 13px;
  line-height: 1.7;
}
.wb-gz-hub__fallback a { color: var(--wb-acid-strong); }

/* ---------- 窄屏 ---------- */
@media (max-width: 1100px) {
  .wb-gz-hub__grid { grid-template-columns: repeat(auto-fit, minmax(218px, 1fr)); }
}
@media (max-width: 768px) {
  .wb-section.wb-gz-hub { padding-top: 34px; }
  .wb-gz-hub__sum { gap: 8px; margin-bottom: 22px; }
  .wb-gz-hub__sum > div { padding: 7px 12px; }
  .wb-gz-hub__band + .wb-gz-hub__band { margin-top: 28px; }
  .wb-gz-hub__grid { grid-template-columns: 1fr; gap: 12px; }
  .wb-gz-hub__card { padding: 16px 16px 14px; }
  .wb-gz-hub__t { font-size: 15.5px; }
  .wb-gz-hub__met b { font-size: 23px; }
  .wb-gz-hub__d { -webkit-line-clamp: 2; }
}
@media (max-width: 460px) {
  .wb-gz-hub__sum dd { font-size: 15px; }
  .wb-gz-hub__card { padding: 15px 15px 13px; }
  .wb-gz-hub__tile { width: 36px; height: 36px; border-radius: 9px; }
  .wb-gz-hub__ico { font-size: 19px; }
  .wb-gz-hub__met b { font-size: 21px; }
}

/* ============================================================
   2026-10-13 栏目页重设计（整体视觉）
   ------------------------------------------------------------
   本节一律后置覆盖，**不可上移**：本页基础规则用后置顺序压过文件前面的
   旧基础规则，同名 @media 也必须排在本节末尾，否则手机端会被基础规则反压。
   旧 .wb-gz-scale* 系列（细横线等距刻度）已由「志书书脊墙」取代，规则保留
   但页面上已无对应元素，不影响其它 15 个引用本文件的专题页。
   ============================================================ */

/* ---------- 章节编号徽章（01…06） ---------- */
.gz-sno {
  display: inline-block;
  margin-right: 8px;
  padding: 1px 6px;
  border-radius: 4px;
  background: var(--wb-acid-soft);
  color: var(--wb-accent-deep);
  letter-spacing: .06em;
  vertical-align: 1px;
}
html.dark .gz-sno { color: var(--wb-ink); }

/* ---------- 01 ･ 编纂年代：志书书脊墙 ---------- */
.gz-spine {
  padding: 26px 26px 20px;
  border: 1px solid var(--wb-line);
  border-radius: 14px;
  background: var(--wb-surface);
}

.gz-spine__stage { position: relative; padding-top: 34px; }

/* 民国刊本集中段的括线（宽度＝段内列数 / 总列数，与书脊列精确对齐） */
.gz-spine__band {
  position: absolute;
  top: 0;
  height: 20px;
  pointer-events: none;
}
.gz-spine__band::before {
  position: absolute;
  top: 9px;
  right: 0;
  left: 0;
  height: 2px;
  border-radius: 2px;
  background: var(--wb-acid);
  opacity: .55;
  content: '';
}
.gz-spine__band span {
  position: absolute;
  top: 0;
  left: 50%;
  padding: 2px 10px;
  border: 1px solid var(--wb-line);
  border-radius: 999px;
  background: var(--wb-surface);
  color: var(--wb-label);
  font-family: var(--wb-pixel);
  font-size: 10px;
  letter-spacing: .04em;
  white-space: nowrap;
  transform: translateX(-50%);
}

/* 书脊区：十列等宽，柱高由 JS 按扫描页数等比写入 */
.gz-spine__row {
  display: flex;
  align-items: flex-end;
  gap: 0;
  margin: 0;
  padding: 0 2px;
  border-bottom: 2px solid var(--wb-ink);
  list-style: none;
}
.gz-spine__it {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  align-items: center;
  min-width: 0;
  padding: 0 4px;
}
.gz-spine__n {
  display: inline-flex;
  align-items: baseline;
  gap: 2px;
  margin-bottom: 7px;
  color: var(--wb-muted);
  font-family: var(--wb-body);
  font-size: 10px;
  line-height: 1;
}
.gz-spine__n b {
  font-family: var(--wb-pixel);
  font-size: 11.5px;
  font-weight: 400;
  line-height: 1;
}
.gz-spine__n i { font-style: normal; }
.gz-spine__spine {
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(54px, 86%);
  min-height: 60px;
  border-radius: 5px 5px 0 0;
  background: var(--wb-ink);
  color: var(--wb-paper);
  transition: transform .16s ease, box-shadow .16s ease;
}
.gz-spine__it.is-pref .gz-spine__spine { width: min(66px, 94%); }
.gz-spine__it.is-modern .gz-spine__spine { background: var(--wb-acid); color: var(--wb-on-acid, var(--wb-ink)); }
html.dark .gz-spine__it.is-modern .gz-spine__spine { color: var(--wb-on-accent); }
.gz-spine__spine:hover { transform: translateY(-4px); box-shadow: 4px 4px 0 var(--wb-acid); }
.gz-spine__nm {
  display: block;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .12em;
  line-height: 1.15;
  writing-mode: vertical-rl;
  text-orientation: upright;
}

/* 年份刻度轴：与书脊同列宽，落在基线上 */
.gz-spine__axis {
  display: flex;
  gap: 0;
  margin: 0;
  padding: 0 2px;
  list-style: none;
}
.gz-spine__axis li {
  display: flex;
  flex: 1 1 0;
  align-items: baseline;
  justify-content: center;
  gap: 2px;
  min-width: 0;
  padding: 9px 4px 0;
  color: var(--wb-muted);
  font-family: var(--wb-body);
  font-size: 10px;
  line-height: 1.2;
  white-space: nowrap;
}
.gz-spine__axis li b {
  font-family: var(--wb-pixel);
  font-size: 11.5px;
  font-weight: 400;
}
.gz-spine__axis li.is-pref { color: var(--wb-accent-deep); font-weight: 700; }

.gz-spine__legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 18px;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px dashed var(--wb-line);
  color: var(--wb-muted);
  font-size: 12px;
}
.gz-spine__lg { display: inline-flex; align-items: center; gap: 6px; }
.gz-spine__lg i { flex: none; width: 12px; height: 12px; border-radius: 3px; }
.gz-spine__lg i.lg-ink { background: var(--wb-ink); }
.gz-spine__lg i.lg-acid { background: var(--wb-acid); }
.gz-spine__lg i.lg-pref { border: 2px solid var(--wb-accent-deep); background: transparent; }
.gz-spine__txt { flex: 1 1 100%; font-size: 11.5px; line-height: 1.7; }

/* 窄屏横向清单（≤640px 显示，书脊墙隐藏） */
.gz-spine__list {
  display: none;
  margin: 0;
  padding: 0;
  list-style: none;
}
.gz-mb {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr) 56px;
  align-items: center;
  gap: 10px;
  padding: 7px 0;
}
.gz-mb + .gz-mb { border-top: 1px dashed var(--wb-line); }
.gz-mb__k { display: flex; flex-direction: column; min-width: 0; }
.gz-mb__k b { font-size: 13px; font-weight: 700; line-height: 1.3; }
.gz-mb__k i {
  color: var(--wb-muted);
  font-size: 10px;
  font-style: normal;
  line-height: 1.4;
}
.gz-mb__t {
  height: 12px;
  overflow: hidden;
  border-radius: 3px;
  background: var(--wb-paper);
  box-shadow: inset 0 0 0 1px var(--wb-line);
}
.gz-mb__t i { display: block; height: 100%; min-width: 3px; border-radius: 3px; background: var(--wb-ink); }
.gz-mb.is-modern .gz-mb__t i { background: var(--wb-acid); }
.gz-mb__v {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 2px;
  color: var(--wb-ink);
}
.gz-mb__v b {
  font-family: var(--wb-pixel);
  font-size: 13px;
  font-weight: 400;
  line-height: 1;
}
.gz-mb__v i { color: var(--wb-muted); font-size: 9.5px; font-style: normal; }

/* ---------- 02 ･ 书目卡片墙 ---------- */
.wb-gz-grid { gap: 18px; }

.wb-gz-card {
  position: relative;
  gap: 14px;
  padding: 22px 22px 20px;
  border-radius: 14px;
  overflow: hidden;
}
/* 顶部酸绿细线只在 hover / 府级志上出现，作为「可点」提示 */
.wb-gz-card::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 3px;
  background: var(--wb-acid);
  opacity: 0;
  transition: opacity .16s ease;
  content: '';
}
.wb-gz-card:hover::before,
.wb-gz-card:focus-within::before { opacity: 1; }
.wb-gz-card.is-pref::before { opacity: 1; }

.wb-gz-card:hover {
  transform: translateY(-4px);
  border-color: var(--wb-ink);
  box-shadow: 5px 5px 0 var(--wb-acid);
}

.wb-gz-card__badge {
  width: 34px;
  height: 34px;
  border-radius: 8px;
}

/* 府级志：铺酸绿衬底 + 酸绿描边，作为九县共同的上一级政区单独强调 */
.wb-gz-card.is-pref {
  padding: 26px 30px;
  border-color: var(--wb-acid);
  border-radius: 14px;
  background: var(--wb-acid-soft);
}
.wb-gz-card.is-pref .wb-gz-card__badge { border-color: var(--wb-accent-deep); }

/* ---------- 03 ･ 一览表 ---------- */
.wb-gz-tablewrap { border-radius: 14px; }
.wb-gz-table tbody tr:nth-child(even) { background: var(--wb-paper); }
.wb-gz-table tbody tr:hover { background: var(--wb-acid-soft); }

/* ---------- 04 ･ 交叉对比（2026-10-14 深夜随 04 区撤销一并删除：.wb-gz-cmp 面板、条形、朝代分布、关键数字及圆角等） ---------- */

/* ---------- 06 ･ 凡例：口径与名词 ---------- */
.gz-notes {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(268px, 1fr));
  gap: 14px;
}
.gz-notes__card {
  padding: 18px 20px;
  border: 1px solid var(--wb-line);
  border-radius: 14px;
  background: var(--wb-surface);
}
.gz-notes__card--wide { grid-column: 1 / -1; background: var(--wb-paper); }
.gz-notes__h {
  margin: 0 0 10px;
  padding-left: 10px;
  border-left: 3px solid var(--wb-acid);
  color: var(--wb-ink);
  font-size: 15px;
  font-weight: 760;
  line-height: 1.4;
}
.gz-notes__card p {
  margin: 0;
  color: var(--wb-ink);
  font-size: 13px;
  line-height: 1.85;
}
.gz-notes__ul { margin: 0; padding-left: 18px; }
.gz-notes__ul li {
  margin: 7px 0;
  color: var(--wb-ink);
  font-size: 13.5px;
  line-height: 1.8;
}
.gz-notes__ul li b { font-weight: 700; }

/* ---------- 本节响应式（必须留在本节最后） ---------- */
@media (max-width: 1100px) {
  .wb-gz-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wb-gz-card.is-pref .wb-gz-card__id {
    padding-bottom: 12px;
    border-bottom: 1px dashed var(--wb-line);
  }
}
@media (max-width: 768px) {
  .wb-gz-grid { grid-template-columns: 1fr; gap: 16px; }
  .wb-gz-card { padding: 20px 18px 18px; }
  .wb-gz-card.is-pref { padding: 22px 18px; }
  .wb-gz-card__county { font-size: 26px; }
  .wb-gz-card.is-pref .wb-gz-card__county { font-size: 30px; }
  .gz-spine { padding: 20px 14px 16px; }
  .gz-spine__legend { gap: 7px 14px; }
  .gz-notes { gap: 12px; }
  .gz-notes__card { padding: 16px 16px; }
}
@media (max-width: 700px) {
  /* 表格转卡片（规则在文件前部）：斑马纹与行 hover 要退掉，否则卡片忽明忽暗 */
  .wb-gz-table tbody tr:nth-child(even) { background: var(--wb-surface); }
  .wb-gz-table tbody tr:hover { background: var(--wb-surface); }
}
@media (max-width: 640px) {
  .gz-spine__stage { display: none; }
  .gz-spine__list { display: grid; }
  .gz-spine { padding: 16px 14px 12px; }
}
@media (max-width: 460px) {
  .gz-mb { grid-template-columns: 58px minmax(0, 1fr) 50px; gap: 8px; }
  .gz-notes { grid-template-columns: 1fr; }
}

/* ========== 2026-10-13 相关区专题卡：描述两行封顶 + 占满两行，全卡等高 ========== */
.wb-gz-related__card span {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  min-height: 3.4em;
}

/* ========== 2026-10-13 专题辑要 15 卡：三主题差异化高亮（用户：卡片不够显眼） ========== */
/* 日=荧光绿 / 暖=赭红 / 夜=朱砂——全部经 --wb-acid 自动取主题色 */
/* 1) 左侧色带：半透明改实色并加粗，hover 加宽成"书签条" */
.wb-gz-hub__card::before { width: 5px; opacity: 1; }
.wb-gz-hub__card:hover::before,
.wb-gz-hub__card:focus-visible::before { width: 8px; }

/* 2) 序号徽章：acid 实底 + 主题反差字，全卡最醒目的识别锚点 */
.wb-gz-hub__n {
  background: var(--wb-acid);
  color: var(--wb-on-acid, var(--wb-ink));
  box-shadow: 2px 2px 0 color-mix(in srgb, var(--wb-ink) 15%, transparent);
}
html.dark .wb-gz-hub__n { color: var(--wb-on-accent); box-shadow: none; }

/* 3) 图标方砖：常驻主题色衬底（原先纸底太素） */
.wb-gz-hub__tile {
  border-color: color-mix(in srgb, var(--wb-acid) 45%, var(--wb-line));
  background: color-mix(in srgb, var(--wb-acid) 14%, var(--wb-surface));
  color: var(--wb-accent-deep, var(--wb-ink));
}
html.dark .wb-gz-hub__tile { color: var(--wb-acid); }

/* 4) 卡片描边：暖/夜主题微染主题色；hover 边框换主题强色 */
html.dark .wb-gz-hub__card { border-color: color-mix(in srgb, var(--wb-acid) 28%, var(--wb-line)); }
html.ink .wb-gz-hub__card { border-color: color-mix(in srgb, var(--wb-acid) 36%, var(--wb-line)); }
.wb-gz-hub__card:hover,
.wb-gz-hub__card:focus-visible { border-color: var(--wb-acid-strong, var(--wb-ink)); }

/* 5) 尾部胶囊：hover 反白为主题色实底 */
.wb-gz-hub__card:hover .wb-gz-hub__go,
.wb-gz-hub__card:focus-visible .wb-gz-hub__go {
  border-color: transparent;
  background: var(--wb-acid);
  color: var(--wb-on-acid, var(--wb-ink));
}
html.dark .wb-gz-hub__card:hover .wb-gz-hub__go,
html.dark .wb-gz-hub__card:focus-visible .wb-gz-hub__go { color: var(--wb-on-accent); }

/* ========== 2026-10-13 相关区专题卡：三主题高亮（与专题辑要卡同一设计语言） ========== */
.wb-gz-related__card {
  position: relative;
  overflow: hidden;
  transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}
/* 左侧主题色书签条 */
.wb-gz-related__card::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 5px;
  background: var(--wb-acid);
  transition: width .16s ease;
}
.wb-gz-related__card:hover::before,
.wb-gz-related__card:focus-visible::before { width: 8px; }
/* 标题前的主题色小方标 */
.wb-gz-related__card b::before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 7px;
  border-radius: 2px;
  background: var(--wb-acid);
  vertical-align: 1px;
}
.wb-gz-related__card:hover,
.wb-gz-related__card:focus-visible {
  border-color: var(--wb-acid-strong, var(--wb-ink));
  transform: translateY(-4px);
  box-shadow: 6px 6px 0 var(--wb-acid);
  outline: none;
}
/* 暖/夜主题：描边微染主题色 */
html.dark .wb-gz-related__card { border-color: color-mix(in srgb, var(--wb-acid) 28%, var(--wb-line)); }
html.ink .wb-gz-related__card { border-color: color-mix(in srgb, var(--wb-acid) 36%, var(--wb-line)); }

/* ========== 2026-10-13 书脊墙朝代色分（步哥反馈：清代与民国没分开） ==========
   清代 = 黛青实柱（与一览卡同色系）；民国 = 淡彩柱 + 同族描边（与卡片淡彩题签同构）；
   现代 = 酸色实柱（原样）；汝宁府 = 描边（原样）。年代刻度、括线、图例、窄屏清单同步。 */
.gz-spine__it.is-qing .gz-spine__spine { background: #2c4a63; color: #e8eff4; }
.gz-spine__it.is-minguo .gz-spine__spine {
  background: var(--wb-acid-soft);
  color: var(--wb-accent-deep);
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--wb-acid) 55%, var(--wb-line));
}
.gz-spine__axis li.is-qing { color: #2c4a63; }
.gz-spine__axis li.is-minguo { color: var(--wb-accent-deep); }
/* 民国刊本集中段括线：改用民国同族深色，与图例呼应 */
.gz-spine__band::before { background: var(--wb-accent-deep); }
.gz-spine__band span {
  border-color: color-mix(in srgb, var(--wb-accent-deep) 35%, var(--wb-line));
  color: var(--wb-accent-deep);
}
.gz-spine__lg i.lg-qing { background: #2c4a63; }
.gz-spine__lg i.lg-minguo {
  background: var(--wb-acid-soft);
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--wb-acid) 55%, var(--wb-line));
}
.gz-mb.is-qing .gz-mb__k i { color: #2c4a63; }
.gz-mb.is-minguo .gz-mb__k i { color: var(--wb-accent-deep); }
/* 暖主题：黛青在米黄纸上压深一点 */
html.dark .gz-spine__it.is-qing .gz-spine__spine { background: #35536b; color: #e6edf3; }
html.dark .gz-spine__axis li.is-qing { color: #35536b; }
html.dark .gz-spine__lg i.lg-qing { background: #35536b; }
html.dark .gz-mb.is-qing .gz-mb__k i { color: #35536b; }
/* 夜主题：黛青转亮青灰（深底浅柱） */
html.ink .gz-spine__it.is-qing .gz-spine__spine { background: #8fb3d1; color: #1c2833; }
html.ink .gz-spine__axis li.is-qing { color: #8fb3d1; }
html.ink .gz-spine__lg i.lg-qing { background: #8fb3d1; }
html.ink .gz-mb.is-qing .gz-mb__k i { color: #8fb3d1; }
/* ========== 2026-10-13 排版美化（步哥） ==========
   大号统计数字换 Georgia 系古典衬线（unicode-range 只命中数字，汉字字体不变）。 */
@font-face {
  font-family: "WBNumSerif";
  font-style: normal;
  font-weight: 400 900;
  src: local("Georgia"), local("Times New Roman");
  unicode-range: U+0030-0039, U+002C, U+002E, U+002F, U+0025, U+002B,
                 U+002D, U+2013, U+2014, U+00D7;
}
.wb-topic__seal b,
.wb-gz-hub__met b {
  /* wb-gz-facts__num / wb-gz-dyn__n b 随 04 区 2026-10-14 撤销已删 */
  font-family: "WBNumSerif", var(--wb-pixel, inherit);
}

/* ============================================================
   方志四朝代配色 ･ 2026-10-14 重构
   原设计民国/现代同取酸绿、清代与民国也偏近，四色难以区分。
   现统一为：明＝靛蓝 / 清＝黛绿 / 民国＝赭橙 / 现代＝紫，
   三主题各给一套（夜主题提亮保证暗底可读）。
   本节整段追加于文件末尾，靠级联顺序覆盖上方旧规则。
   ============================================================ */
:root {
  --gz-ming:    #2f6fb3;   /* 明 靛蓝 */
  --gz-qing:    #2f9e6b;   /* 清 黛绿 */
  --gz-minguo:  #d9822b;   /* 民国 赭橙 */
  --gz-modern:  #8a5bbf;   /* 现代 紫 */
}
/* 暖主题（古纸浅底深字），沿用上方中明度色 */
html.dark {
  --gz-ming:    #2f6fb3;
  --gz-qing:    #2f9e6b;
  --gz-minguo:  #cf7a23;
  --gz-modern:  #8a5bbf;
}
/* 夜主题（深底浅字），提亮各色保证对比 */
html.ink {
  --gz-ming:    #6fa8e0;
  --gz-qing:    #5fcf9b;
  --gz-minguo:  #e8a85a;
  --gz-modern:  #b694e0;
}

/* ---------- 书脊墙：柱体按朝代上色 ---------- */
.gz-spine__it.is-ming    .gz-spine__spine { background: var(--gz-ming);    color:#fff; }
.gz-spine__it.is-qing    .gz-spine__spine { background: var(--gz-qing);    color:#fff; }
.gz-spine__it.is-minguo  .gz-spine__spine { background: var(--gz-minguo);  color:#fff; box-shadow:none; }
.gz-spine__it.is-modern  .gz-spine__spine { background: var(--gz-modern);  color:#fff; }
html.dark .gz-spine__it.is-ming    .gz-spine__spine { background:#2f6fb3; color:#fff; }
html.dark .gz-spine__it.is-qing    .gz-spine__spine { background:#2f9e6b; color:#fff; }
html.dark .gz-spine__it.is-minguo  .gz-spine__spine { background:#cf7a23; color:#fff; }
html.dark .gz-spine__it.is-modern  .gz-spine__spine { background:#8a5bbf; color:#fff; }
html.ink .gz-spine__it.is-ming    .gz-spine__spine { background: var(--gz-ming);   color:#11130e; }
html.ink .gz-spine__it.is-qing    .gz-spine__spine { background: var(--gz-qing);   color:#11130e; }
html.ink .gz-spine__it.is-minguo  .gz-spine__spine { background: var(--gz-minguo); color:#11130e; }
html.ink .gz-spine__it.is-modern  .gz-spine__spine { background: var(--gz-modern); color:#11130e; }

/* 年份轴文字 */
.gz-spine__axis li.is-ming    { color: var(--gz-ming); }
.gz-spine__axis li.is-qing    { color: var(--gz-qing); }
.gz-spine__axis li.is-minguo  { color: var(--gz-minguo); }
.gz-spine__axis li.is-modern  { color: var(--gz-modern); }
html.ink .gz-spine__axis li.is-ming,
html.ink .gz-spine__axis li.is-qing,
html.ink .gz-spine__axis li.is-minguo,
html.ink .gz-spine__axis li.is-modern { color: inherit; }
html.ink .gz-spine__axis li.is-ming    { color: var(--gz-ming); }
html.ink .gz-spine__axis li.is-qing    { color: var(--gz-qing); }
html.ink .gz-spine__axis li.is-minguo  { color: var(--gz-minguo); }
html.ink .gz-spine__axis li.is-modern  { color: var(--gz-modern); }

/* 民国集中括线 → 民国色 */
.gz-spine__band::before { background: var(--gz-minguo); opacity:.5; }
.gz-spine__band span {
  border-color: color-mix(in srgb, var(--gz-minguo) 35%, var(--wb-line));
  color: var(--gz-minguo);
}
html.ink .gz-spine__band span { color: var(--gz-minguo); }

/* 图例色块 */
.gz-spine__lg i.lg-ming   { background: var(--gz-ming); }
.gz-spine__lg i.lg-qing   { background: var(--gz-qing); }
.gz-spine__lg i.lg-minguo { background: var(--gz-minguo); box-shadow:none; }
.gz-spine__lg i.lg-acid   { background: var(--gz-modern); }
html.dark .gz-spine__lg i.lg-ming   { background:#2f6fb3; }
html.dark .gz-spine__lg i.lg-qing   { background:#2f9e6b; }
html.dark .gz-spine__lg i.lg-minguo { background:#cf7a23; box-shadow:none; }
html.dark .gz-spine__lg i.lg-acid   { background:#8a5bbf; }
html.ink .gz-spine__lg i.lg-ming   { background: var(--gz-ming); }
html.ink .gz-spine__lg i.lg-qing   { background: var(--gz-qing); }
html.ink .gz-spine__lg i.lg-minguo { background: var(--gz-minguo); box-shadow:none; }
html.ink .gz-spine__lg i.lg-acid   { background: var(--gz-modern); }

/* 窄屏横向清单 */
.gz-mb.is-ming    .gz-mb__k i { color: var(--gz-ming); }
.gz-mb.is-ming    .gz-mb__t i { background: var(--gz-ming); }
.gz-mb.is-qing    .gz-mb__k i { color: var(--gz-qing); }
.gz-mb.is-qing    .gz-mb__t i { background: var(--gz-qing); }
.gz-mb.is-minguo  .gz-mb__k i { color: var(--gz-minguo); }
.gz-mb.is-minguo  .gz-mb__t i { background: var(--gz-minguo); }
.gz-mb.is-modern  .gz-mb__t i { background: var(--gz-modern); }
html.dark .gz-mb.is-ming .gz-mb__k i { color:#2f6fb3; }
html.dark .gz-mb.is-qing .gz-mb__k i { color:#2f9e6b; }
html.dark .gz-mb.is-minguo .gz-mb__k i { color:#cf7a23; }
html.ink .gz-mb.is-ming .gz-mb__k i { color: var(--gz-ming); }
html.ink .gz-mb.is-qing .gz-mb__k i { color: var(--gz-qing); }
html.ink .gz-mb.is-minguo .gz-mb__k i { color: var(--gz-minguo); }


.wb-gz-scale__mark.is-ming   { border-color: var(--gz-ming); }
.wb-gz-scale__mark.is-ming::after { background: var(--gz-ming); }
.wb-gz-scale__mark.is-qing   { border-color: var(--gz-qing); }
.wb-gz-scale__mark.is-minguo { border-color: var(--gz-minguo); }
.wb-gz-scale__mark.is-modern { border-color: var(--gz-modern); }
.wb-gz-scale__mark.is-modern::after { background: var(--gz-modern); }


/* ============================================================
   2026-10-14 方志栏目「首屏锚点 ･ kicker 修复 ･ 相关区收敛」
   ------------------------------------------------------------
   整节追加（靠级联覆盖，不动上方任何既有规则）；
   本节的 @media 一律排在本节最末（媒体查询不加特异性、只看顺序）。
   ============================================================ */

/* ---------- 1) 专题头 kicker ----------------------------------
   背景：专题头第一行用的是 <p class="wb-topic__eyebrow">，而该选择器
   在 assets/*.css 里此前**一处定义都没有** → 30 个方志页（15 专题 + 15 深度）
   的栏目 kicker 一直按 16px 正文裸渲染；枢纽页与其它栏目用的是
   .wb-pixel-label（像素字体 + --wb-label 色 + 13px 下边距）。
   这里补齐，语言与全站一致。 */
.wb-topic .wb-topic__eyebrow {
  margin: 0 0 13px;
  color: var(--wb-label);
  font-family: var(--wb-pixel);
  font-size: 13px;
  letter-spacing: .02em;
  line-height: 1.6;
}

/* 竖线分隔符：原先只定义在 gz-classes.css 里，而 14 个非 classes 专题页
   的专题头都在用它。迁入本文件后，那 14 页摘掉 gz-classes.css 也不会掉线。 */
.gz-cls-sep {
  display: inline-block;
  width: 1px;
  height: .95em;
  margin: 0 9px;
  vertical-align: -.12em;
  background: color-mix(in srgb, var(--wb-ink) 32%, transparent);
}

/* ---------- 2) 首屏视觉锚点 -----------------------------------
   原先 15 个专题页首屏完全同构（同网格、同药丸排布），只有数字不同。
   这里加两处结构化的重音：印章拔高、第一枚药丸改实底徽章
   （--wb-chip 恒为深色，配 --wb-on-accent 亮字，三主题都安全——
   不拿 --wb-acid 当底，是因为它在暖/夜会变赭红、深字压红底看不清）。
   ⚠️ 2026-10-14 步哥要求删掉左侧酸绿「书脊条」与标题下酸绿短棒：
   全站其他栏目（county/best/checkin/about…）的 .wb-topic 框都没有这两样，
   方志体系带着反而不一致。两条 ::before/::after 及 768px 下的对应覆盖已一并删除。
   ⚠️ 2026-10-14 深夜步哥要求印章回其他板块同高：min-height 96 / b 32 / wide b 19
   三行覆盖已撤——96px 会在级联里压过 wide 的 min-height:0，把宽印章也顶到 96px，
   其他栏目无此覆盖故没有这问题；印章尺寸回归 pages.css 基础值。 */
.wb-topic__stats > span:first-child {
  border-color: var(--wb-ink);
  background: var(--wb-chip);
  color: var(--wb-on-accent);
}
.wb-topic__stats > span:first-child b { color: var(--wb-on-accent); }

/* ---------- 3) 「相关」区在手机端改单行横滑 -------------------
   桌面端保持网格；专题页「相关」只有 3–5 张卡，横滑合适。
   （枢纽页 06 深度索引区已于 2026-10-14 撤销，其手机纵表 override 节随之删除。） */
@media (max-width: 900px) {
  .wb-gz-related {
    grid-template-columns: repeat(auto-fit, minmax(212px, 1fr));
  }
}

@media (max-width: 768px) {
  .wb-gz-related {
    display: flex;
    flex-wrap: nowrap;
    gap: 12px;
    padding: 4px 4px 12px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }
  .wb-gz-related__card {
    flex: 0 0 min(78vw, 300px);
    scroll-snap-align: start;
  }
}

/* ============================================================
   2026-10-14 ･ 03 区一览表减列：只留 县 / 年代 / 页数
   ------------------------------------------------------------
   志名、编纂者两列与 02 卡片墙完全重复，已删（完整信息仍在卡片）；
   朝代标签列同时撤掉，配色不改弃——县名前的色点与书脊墙图例、
   卡片描边同源（--gz-* 四色，三主题各自提亮）。
   min-width 由 660 收到 380：三列不再需要横向滚动，390px 手机
   可整表看全；更窄的旧机型由 .wb-gz-tablewrap 的 overflow-x 兜底。
   ============================================================ */
.wb-gz-table { min-width: 380px; }

.gz-tdot {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 8px;
  border-radius: 2px;
  background: var(--wb-ink);
  vertical-align: 1px;
}
.gz-tdot.is-ming    { background: var(--gz-ming); }
.gz-tdot.is-qing    { background: var(--gz-qing); }
.gz-tdot.is-minguo  { background: var(--gz-minguo); }
.gz-tdot.is-modern  { background: var(--gz-modern); }
/* ============================================================
   2026-10-14 ･ 枢纽页 05 专题矩阵：双入口卡 + 书脊图例部数
   ------------------------------------------------------------
   背景：hero/卡片墙/一览表按步哥要求回退 q 版样式；05+06 合并保留，
   每辑一张卡、卡底两粒胶囊——「专题页 →」进矩阵页、「深度文 →」进长文页。
   <a> 不能嵌套 <a>，整卡由 JS 渲染为 article，两个动作各自独立成链接。
   书脊图例四色各带部数（原 04 区「朝代分布」并入）。
   ============================================================ */
/* ---------- ④ 专题矩阵：双入口卡 ---------- */
.wb-gz-hub__acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 14px; }
.wb-gz-hub__go { margin-top: 0; }
.wb-gz-hub__deep {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 13px;
  border: 1px solid var(--wb-line);
  border-radius: 999px;
  color: var(--wb-muted);
  font-size: 12px;
  font-weight: 400;
  transition: border-color .16s ease, color .16s ease;
}
.wb-gz-hub__deep:hover { border-color: var(--wb-accent-deep); color: var(--wb-accent-deep); }
.wb-gz-hub__deep .hl { font-size: 13px; }

/* ---------- ⑤ 书脊墙图例：收敛带部数 ---------- */
.gz-spine__legend { gap: 8px 16px; }
.gz-spine__lg b { margin-left: 1px; font-family: var(--wb-pixel); font-size: 12px; font-weight: 400; color: var(--wb-ink); }
.gz-spine__txt { flex: 1 1 100%; }
/* ---------- ･ 凡例区 2026-10-15 两节覆盖（两栏+间距）已整段撤销：
   步哥终审「还是改为这种样式吧」——回归原始 auto-fit minmax(268px) 
   多列自适应（宽卡统计口径占整行，其余四列），原 06 节规则原样生效。 ---------- */

/* ============================================================
   2026-10-15 ･ 凡例区定稿（步哥）：删两卡后六卡两行三列
   ------------------------------------------------------------
   「影印扫描页」「文字版」两卡已从 HTML 删除。auto-fit 在宽屏
   会排 4+2 不保证 3+3，改显式三列；≤960 两列、≤600 单列。
   ============================================================ */
.gz-notes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 960px) {
  .gz-notes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .gz-notes { grid-template-columns: 1fr; }
}

/* ============================================================
   2026-10-15 ･ 府级志卡衬底减淡（步哥：三个模式下颜色都太重）
   ------------------------------------------------------------
   原 is-pref 直接铺 --wb-acid-soft，三主题都嫌浓。各主题把
   acid-soft 向 surface 对半调和，保留色相、降一档饱和：
   日 #eef7bd→#f7fbde ･ 暖 #f7e9e7→#fbf4f3 ･ 夜 #2a1d1c→#242022
   ============================================================ */
.wb-gz-card.is-pref { background: #f7fbde; }
html.dark .wb-gz-card.is-pref { background: #fbf4f3; }
html.ink .wb-gz-card.is-pref { background: #242022; }

/* ============================================================
   2026-10-15 ･ 卡片注记正常字重（步哥：换个字体，不加粗不加黑）
   ------------------------------------------------------------
   __note 原为全墨色（--wb-ink），在灰调卡片里显得黑重。改次级灰、
   常规字重、正文字体，与 __series/__alt 等说明文字同一档。
   ============================================================ */
.wb-gz-card__note {
  color: var(--wb-muted);
  font-weight: 400;
  font-family: var(--wb-body);
}

/* ============================================================
   2026-10-16 ･ 05 专题矩阵卡减绿降噪（步哥：卡片设计得不好看）
   ------------------------------------------------------------
   原卡一卡三处酸绿（左书脊条＋编号药丸底＋hover 硬投影），
   15 张卡满屏荧光；底部双胶囊×15 显噪。后置覆盖：
   ① 删书脊条（02 书目卡无书脊条，同页语言统一）；
   ② hover 去 acid 硬投影，改柔和阴影、上浮减半；
   ③ 编号药丸去底，回归裸像素编号；
   ④ 双胶囊改纯文本链接，acts 行加虚线顶边收底；
   图标砖 hover 保留酸绿填充，作为卡片唯一绿色记忆点。
   本节一律后置覆盖，不可上移；同名选择器靠位置夺回。
   ============================================================ */
.wb-gz-hub__card::before { content: none; }
.wb-gz-hub__card:hover,
.wb-gz-hub__card:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(31, 33, 26, .10);
}
.wb-gz-hub__n {
  padding: 0;
  border-radius: 0;
  background: none;
  color: var(--wb-muted);
  font-size: 12px;
  letter-spacing: .1em;
}
html.dark .wb-gz-hub__n { color: var(--wb-muted); }
html.ink .wb-gz-hub__n { color: var(--wb-muted); }
.wb-gz-hub__go,
.wb-gz-hub__deep {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: var(--wb-muted);
  font-weight: 400;
}
.wb-gz-hub__acts { gap: 6px 18px; padding-top: 12px; border-top: 1px dashed var(--wb-line); }
.wb-gz-hub__go:hover,
.wb-gz-hub__deep:hover { color: var(--wb-ink); }
.wb-gz-hub__go:hover .hl,
.wb-gz-hub__deep:hover .hl { transform: translateX(3px); }
.wb-gz-hub__card:hover .wb-gz-hub__go,
.wb-gz-hub__card:focus-visible .wb-gz-hub__go,
.wb-gz-hub__card:hover .wb-gz-hub__deep,
.wb-gz-hub__card:focus-visible .wb-gz-hub__deep {
  border-color: transparent;
  background: none;
  color: var(--wb-ink);
}
html.dark .wb-gz-hub__card:hover .wb-gz-hub__go,
html.dark .wb-gz-hub__card:focus-visible .wb-gz-hub__go,
html.dark .wb-gz-hub__card:hover .wb-gz-hub__deep,
html.dark .wb-gz-hub__card:focus-visible .wb-gz-hub__deep { color: var(--wb-ink); }
html.ink .wb-gz-hub__card:hover .wb-gz-hub__go,
html.ink .wb-gz-hub__card:focus-visible .wb-gz-hub__go,
html.ink .wb-gz-hub__card:hover .wb-gz-hub__deep,
html.ink .wb-gz-hub__card:focus-visible .wb-gz-hub__deep { color: var(--wb-ink); }

/* ============================================================
   2026-10-16 ･ 双胶囊加回但换风格（步哥：胶囊不太好看）
   ------------------------------------------------------------
   方角像素小砖：4px 直角、像素字 12px 常规字重、细边纸底，
   呼应图标砖与全站像素语言；悬停砖体自己亮酸绿，
   卡片悬停不再整体点亮链接。本节后置覆盖，不可上移。
   ============================================================ */
.wb-gz-hub__acts { gap: 8px; }
.wb-gz-hub__go,
.wb-gz-hub__deep {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 11px;
  border: 1px solid var(--wb-line);
  border-radius: 4px;
  background: var(--wb-paper);
  color: var(--wb-ink);
  font-family: var(--wb-pixel);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: .05em;
  transition: background-color .16s ease, color .16s ease, border-color .16s ease;
}
.wb-gz-hub__go:hover,
.wb-gz-hub__deep:hover {
  border-color: var(--wb-acid);
  background: var(--wb-acid);
  color: var(--wb-on-acid, var(--wb-ink));
}
.wb-gz-hub__card:hover .wb-gz-hub__go,
.wb-gz-hub__card:focus-visible .wb-gz-hub__go,
.wb-gz-hub__card:hover .wb-gz-hub__deep,
.wb-gz-hub__card:focus-visible .wb-gz-hub__deep {
  border-color: var(--wb-line);
  background: var(--wb-paper);
  color: var(--wb-ink);
}
html.dark .wb-gz-hub__card:hover .wb-gz-hub__go,
html.dark .wb-gz-hub__card:focus-visible .wb-gz-hub__go,
html.dark .wb-gz-hub__card:hover .wb-gz-hub__deep,
html.dark .wb-gz-hub__card:focus-visible .wb-gz-hub__deep { color: var(--wb-ink); }
html.ink .wb-gz-hub__card:hover .wb-gz-hub__go,
html.ink .wb-gz-hub__card:focus-visible .wb-gz-hub__go,
html.ink .wb-gz-hub__card:hover .wb-gz-hub__deep,
html.ink .wb-gz-hub__card:focus-visible .wb-gz-hub__deep { color: var(--wb-ink); }

/* 2026-10-16 ･ 步哥：左上角编号恢复绿底药丸（本节后置，压回前一节的裸编号） */
.wb-gz-hub__n {
  padding: 3px 9px;
  border-radius: 7px;
  background: var(--wb-acid-soft);
  color: var(--wb-accent-deep);
  letter-spacing: normal;
}
html.dark .wb-gz-hub__n { color: var(--wb-ink); }
html.ink .wb-gz-hub__n { color: var(--wb-ink); }

/* ============================================================
   2026-10-16 ･ 步哥：全局补上「视觉隐藏」工具类
   ------------------------------------------------------------
   此类此前从未定义 → 03 一览表的无障碍 caption 在桌面端
   按浏览器默认样式渲染成表格上方的灰字。
   本类只做视觉剪裁，元素仍在无障碍树中，读屏软件可读。
   ============================================================ */
.wb-visually-hidden,
.wb-gz-table .wb-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

/* ==========================================================================
   2026-10-16 「延伸阅读」相关区卡片重设计（wb-gz-related2）
   ------------------------------------------------------------------
   步哥反馈：专题页底部这组卡片不好看 + 移动端横滑读不全。
   实测诊断：
     · 桌面 auto-fit minmax(240px) 算出 5 列 x 245px，标题被折成两行且断字
       （「十部方志都写了什么（专题）」断在「什」后）
     · 描述 line-clamp:2 + min-height:3.4em 造成卡片下缘空一大块
     · 移动端 5 张卡横滑，每张仅 ~245px，描述断三截还被截断 -> 改单列
     · 15 张卡长得完全一样，无序号、无「这是相关推荐」的语义锚点
   取向：沿用站内 gz-deep-entry 卡的家族语言（序号徽章 + 硬阴影 + 像素字），
   保持网格形态（15 张不能做成单张大卡）。纯新增类，不改任何既有选择器。
   ========================================================================== */
.wb-gz-related2__head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin: 0 0 18px;
}
.wb-gz-related2__label {
  color: var(--wb-label);
  font-family: var(--wb-pixel);
  font-size: 13px;
  letter-spacing: .12em;
}
/* 标题右侧细横线，填满余白 */
.wb-gz-related2__rule {
  flex: 1 1 auto;
  height: 1px;
  background: var(--wb-line);
}

.wb-gz-related2 {
  display: grid;
  /* 放宽档位：让标题能完整排 1~2 行，桌面 3~4 列而非 5 列 */
  grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
  gap: 14px;
}

.wb-gz-related2__card {
  position: relative;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: start;
  column-gap: 14px;
  padding: 17px 18px 16px;
  border: 1px solid var(--wb-line);
  border-radius: 10px;
  background: var(--wb-surface);
  text-decoration: none;
  transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}
/* 序号徽章：像素字 + 酸绿底（取主题色） */
.wb-gz-related2__n {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 26px;
  border-radius: 6px;
  background: var(--wb-acid);
  color: var(--wb-on-acid, var(--wb-ink));
  font-family: var(--wb-pixel);
  font-size: 12px;
  letter-spacing: .06em;
  line-height: 1;
  transition: background .16s ease, color .16s ease;
}
html.dark .wb-gz-related2__n { color: var(--wb-on-accent); }

.wb-gz-related2__body { display: flex; flex-direction: column; min-width: 0; }
.wb-gz-related2__t {
  color: var(--wb-ink);
  font-size: 15.5px;
  font-weight: 800;
  line-height: 1.45;
  letter-spacing: -.01em;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.wb-gz-related2__d {
  display: block;
  margin-top: 5px;
  flex: 1 1 auto;
  color: var(--wb-muted);
  font-size: 12.5px;
  line-height: 1.75;
  /* 不再用 min-height 撑高（那是下缘空一块的元凶） */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
/* hover：硬阴影 + 徽章反白描边，与 gz-deep-entry 同一家族 */
.wb-gz-related2__card:hover,
.wb-gz-related2__card:focus-visible {
  border-color: var(--wb-acid-strong, var(--wb-ink));
  transform: translate(-2px, -2px);
  box-shadow: 4px 4px 0 var(--wb-acid);
  outline: none;
}
.wb-gz-related2__card:hover .wb-gz-related2__n,
.wb-gz-related2__card:focus-visible .wb-gz-related2__n {
  background: transparent;
  color: var(--wb-acid-strong, var(--wb-ink));
  box-shadow: inset 0 0 0 2px currentColor;
}
html.dark .wb-gz-related2__card {
  border-color: color-mix(in srgb, var(--wb-acid) 28%, var(--wb-line));
}
html.ink .wb-gz-related2__card {
  border-color: color-mix(in srgb, var(--wb-acid) 36%, var(--wb-line));
}

@media (max-width: 768px) {
  .wb-gz-related2 {
    /* 移动端单列纵排：彻底弃用横滑（横滑在这个文案长度下必截断） */
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .wb-gz-related2__card {
    grid-template-columns: 30px minmax(0, 1fr);
    column-gap: 12px;
    padding: 14px 15px 13px;
  }
  .wb-gz-related2__n { width: 30px; height: 24px; font-size: 11px; }
  .wb-gz-related2__t { font-size: 15px; }
  /* 移动端空间充裕，描述放开到 3 行，读得全 */
  .wb-gz-related2__d { -webkit-line-clamp: 3; }
  .wb-gz-related2__head { margin-bottom: 14px; }
}
/* ==========================================================================
   wb-gz-related2--4col —— 深度页延伸阅读改 4 列（2026-10-16）
   --------------------------------------------------------------------------
   步哥反馈：5 条时桌面 3 列排成「3+2」，第二行空 3 格；扩到 8 条更空。
   定案：深度页固定 4 条 + 4 列 —— 4 能被 1/2/4 整除，任何视口都不留空位。
   作用域限定 .wb-gz-deep（深度页 body 类），专题页 15 张卡的
   .wb-gz-related2 原规则完全不动。
   ========================================================================== */
.wb-page-gz-deep .wb-gz-related2 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
/* 4 列每格更窄：标题允许 2 行、描述 2 行，与原版一致 */
.wb-page-gz-deep .wb-gz-related2__card {
  grid-template-columns: 30px minmax(0, 1fr);
  column-gap: 11px;
  padding: 15px 15px 14px;
}
.wb-page-gz-deep .wb-gz-related2__n {
  width: 30px;
  height: 25px;
  font-size: 11px;
}

/* 中屏收 2 列（4 = 2+2，仍整除）；平板以下交给移动端单列 */
@media (max-width: 1100px) {
  .wb-page-gz-deep .wb-gz-related2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .wb-page-gz-deep .wb-gz-related2__card {
    grid-template-columns: 34px minmax(0, 1fr);
    column-gap: 14px;
    padding: 17px 18px 16px;
  }
  .wb-page-gz-deep .wb-gz-related2__n {
    width: 34px;
    height: 26px;
    font-size: 12px;
  }
}

@media (max-width: 768px) {
  .wb-page-gz-deep .wb-gz-related2 {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .wb-page-gz-deep .wb-gz-related2__card {
    grid-template-columns: 30px minmax(0, 1fr);
    column-gap: 12px;
    padding: 14px 15px 13px;
  }
  .wb-page-gz-deep .wb-gz-related2__n {
    width: 30px;
    height: 24px;
    font-size: 11px;
  }
  .wb-page-gz-deep .wb-gz-related2__t { font-size: 15px; }
  .wb-page-gz-deep .wb-gz-related2__d { -webkit-line-clamp: 3; }
}

/* ============================================================
   2026-10-17 ･ 书目卡挂长卷页链接（步哥）
   ------------------------------------------------------------
   「上蔡县志」卡底部加一枚「看编年长卷」胶囊，通到 48 屏编年长卷页。
   形态沿用本页已有 __deep 胶囊语汇（1px 描边 + 999px 圆角 + 12px），
   图标同样用 <svg class="hl"><use>。
   ⚠️ 长卷页是**本地专用备用页**（永不进云端包），所以云端这份 CSS 会带上
      一条指向不存在页面的链接；如需彻底规避，可把本节连同渲染一起撤。
   本节一律后置追加，不可上移（同名选择器靠位置夺回）。
   ============================================================ */
.wb-gz-card__sc {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  /* 呼吸圈 ::after 用 inset:-1px 定位，必须先让自身成为定位上下文；
     否则会退回祖先 .wb-gz-card（position:relative），画出一个罩住整卡的大圆。 */
  position: relative;
  /* 贴卡片左下角。链接是 article 的直接子元素（不在 body 里），article 为 flex 纵向：
     auto 上边距把它推到底，align-self 在纵向 flex 里作用于水平轴 → flex-start 靠左。
     左下角原是「转写状态签」位，但该签已从渲染里删除（gazetteers.js 命中 0），此处无冲突。 */
  margin-top: auto;
  align-self: flex-start;
  padding: 7px 15px;
  /* 醒目但不重（步哥「颜色太重了，浅浅的就行」）：淡酸绿底 + 淡墨描边 + 深墨字。
     色不写死 —— 用 color-mix 从 --wb-acid / --wb-ink 派生，dark/ink 主题自动跟着换。
     不加硬投影（3px 3px 0 那块最压版面，已去掉），靠描边与呼吸圈提示可点。 */
  border: 1px solid color-mix(in srgb, var(--wb-ink) 30%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--wb-acid) 16%, var(--wb-surface));
  color: var(--wb-ink);
  box-shadow: none;
  font-family: var(--wb-body);
  font-size: 13px;
  font-weight: 760;
  line-height: 1.5;
  letter-spacing: .02em;
  text-decoration: none;
  transition: transform .16s ease, box-shadow .16s ease, background-color .16s ease, color .16s ease;
}
/* 引导点击：常态一圈极缓慢外扩的呼吸描边；鼠标一进来立刻停，
   不与卡片自身的 hover 位移（translateY(-4px)）打架 */
.wb-gz-card__sc::after {
  position: absolute;
  inset: -1px;
  border: 1px solid color-mix(in srgb, var(--wb-acid) 70%, transparent);
  border-radius: 999px;
  animation: wb-gz-sc-pulse 2.6s ease-out infinite;
  pointer-events: none;
  content: '';
}
@keyframes wb-gz-sc-pulse {
  0%   { opacity: .55; transform: scale(1); }
  70%  { opacity: 0;   transform: scale(1.09); }
  100% { opacity: 0;   transform: scale(1.09); }
}
.wb-gz-card__sc:hover,
.wb-gz-card__sc:focus-visible {
  border-color: color-mix(in srgb, var(--wb-ink) 55%, transparent);
  background: color-mix(in srgb, var(--wb-acid) 34%, var(--wb-surface));
  color: var(--wb-ink);
  transform: translateY(-1px);
}
.wb-gz-card__sc:hover::after,
.wb-gz-card__sc:focus-visible::after { animation: none; opacity: 0; }
.wb-gz-card__sc .hl {
  font-size: 14px;
  transition: transform .16s ease;
}
.wb-gz-card__sc:hover .hl,
.wb-gz-card__sc:focus-visible .hl { transform: translateX(4px); }
/* 只有挂了链接的卡需要把 body 收回内容高度：body 默认 flex:1 会先吃光剩余空间，
   链接（article 直下）就没了 auto 上边距可用，会被顶到卡片外面去。
   :has() 现代浏览器全支持；没链接的卡保持原样，其余 9 张卡排版零影响。 */
.wb-gz-card:has(> .wb-gz-card__sc) .wb-gz-card__body { flex: 0 1 auto; }
/* 无障碍：系统开了「减少动态」就停掉呼吸 */
@media (prefers-reduced-motion: reduce) {
  .wb-gz-card__sc::after { animation: none; opacity: 0; }
}