/* 知否知否 · "建筑"板块样式（木与漆：胡桃木底、象牙色纸面、朱红点缀）
   只在 body.theme-jz 的页面生效（文房四宝两页暂时也用它，改版后另行拆开），不影响"时"（水墨纸色）和"神"（夜色金线）。
   类名统一用 wx-（正文）和 wf-（书案图里的器物），和"神"的 xx- 完全分开。 */
body.theme-jz {
  --wood-deep: #241610;
  --wood: #3b271b;
  --wood-2: #4a3123;
  --wood-3: #5d4030;
  --ivory: #f1e7d1;
  --ivory-2: #e6d9bd;
  --ivory-line: #cdbf9f;
  --lac: #b23a2e;
  --lac-deep: #7d2a20;
  --lac-soft: #e08a76;
  --cream: #eadfc6;
  --cream-muted: #bcab8c;
  --ink-w: #2b2118;
  --ink-muted: #5a4d3d;
  background: var(--wood);
  background-image:
    repeating-linear-gradient(90deg, rgba(0, 0, 0, 0.05) 0, rgba(0, 0, 0, 0.05) 2px, transparent 2px, transparent 11px),
    linear-gradient(180deg, #43291c 0%, #3b271b 40%, #2f1f15 100%);
  color: var(--cream);
}
.theme-jz a { color: var(--cream); }
.theme-jz a:hover { color: #ffffff; }
.theme-jz a:focus-visible, .theme-jz button:focus-visible, .theme-jz summary:focus-visible, .theme-jz [tabindex]:focus-visible {
  outline: 2px solid var(--cream); outline-offset: 3px;
}

/* 页头页脚 */
.theme-jz .site-header { background: var(--wood-deep); border-bottom-color: rgba(234, 223, 198, 0.18); }
.theme-jz .brand, .theme-jz .brand:hover { color: #f6ecd5; }
.theme-jz .brand-tagline { color: var(--cream-muted); border-left-color: rgba(234, 223, 198, 0.35); }
.theme-jz .site-nav a { color: var(--cream-muted); }
.theme-jz .site-nav a:hover, .theme-jz .site-nav a[aria-current="page"] { color: #f6ecd5; }
.theme-jz .site-nav a[aria-current="page"] { box-shadow: inset 0 -1px 0 var(--lac-soft); }
.theme-jz .sub-nav { background: rgba(36, 22, 16, 0.55); border-bottom-color: rgba(234, 223, 198, 0.18); }
.theme-jz .sub-nav-mark { color: var(--lac-soft); border-right-color: rgba(234, 223, 198, 0.35); }
.theme-jz .sub-nav a { color: var(--cream-muted); }
.theme-jz .sub-nav a:hover, .theme-jz .sub-nav a[aria-current="page"] { color: #f6ecd5; }
.theme-jz .sub-nav a[aria-current="page"] { box-shadow: inset 0 -1px 0 var(--lac-soft); }
.theme-jz .footer-inner { border-top-color: rgba(234, 223, 198, 0.2); color: var(--cream-muted); }
.theme-jz .empty-note { color: var(--cream-muted); }

/* 页面骨架与头部 */
.wx-page { display: flex; flex-direction: column; gap: 44px; padding-top: 40px; max-width: 1200px; margin: 0 auto; animation: rise 0.7s ease both; }
.wx-head { display: flex; flex-direction: column; gap: 14px; max-width: 760px; }
.wx-eyebrow { display: flex; align-items: center; gap: 12px; font-size: 13px; letter-spacing: 0.3em; color: var(--lac-soft); }
.wx-eyebrow::before { content: ''; width: 48px; height: 1px; background: var(--lac-soft); }
.wx-hook { font-family: var(--display); font-size: clamp(30px, 5vw, 48px); line-height: 1.3; color: #f6ecd5; }
.wx-answer { font-size: 17px; line-height: 1.9; color: var(--cream); }
.wx-lead { max-width: 760px; font-size: 15.5px; line-height: 1.95; color: var(--cream); }
.wx-section { display: flex; flex-direction: column; gap: 18px; }
.wx-sec-title { display: flex; align-items: center; gap: 16px; font-size: 13px; letter-spacing: 0.3em; color: var(--cream-muted); }
.wx-sec-title::after { content: ''; flex: 1; height: 1px; background: rgba(234, 223, 198, 0.22); }

/* 象牙色纸面（放正文的地方） */
.wx-paper { background: var(--ivory); color: var(--ink-w); border-radius: 2px; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35); }
.wx-paper a { color: var(--lac); }
.wx-paper a:hover { color: var(--lac-deep); }
.wx-paper a:focus-visible, .wx-paper button:focus-visible { outline-color: var(--lac); }

/* 书案与详情 */
.wx-explore { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
.wx-scene { min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.wx-desk { border: 1px solid rgba(0, 0, 0, 0.45); border-radius: 6px; overflow: hidden; background: var(--wood-2); box-shadow: 0 10px 28px rgba(0, 0, 0, 0.4); }
.wx-desk svg { display: block; width: 100%; height: auto; }
.wx-hint { font-size: 13px; letter-spacing: 0.08em; color: var(--cream-muted); }
.wx-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.wx-chip-w {
  min-height: 44px; padding: 4px 16px; font-family: var(--body); font-size: 15px; letter-spacing: 0.1em;
  color: var(--cream); background: transparent; border: 1px solid rgba(234, 223, 198, 0.35); cursor: pointer;
}
.wx-chip-w:hover { border-color: var(--cream); }
.wx-chip-w.is-bao { border-color: var(--lac-soft); }
.wx-chip-w[aria-pressed="true"] { background: var(--ivory); color: var(--ink-w); border-color: var(--ivory); }

.wx-panel { min-width: 0; padding: 24px 26px 18px; border-top: 4px solid var(--lac); scroll-margin-top: 12px; }
.wx-kicker { display: flex; align-items: center; gap: 10px; }
.wx-tag { display: inline-block; padding: 0 10px; font-size: 12px; letter-spacing: 0.2em; line-height: 24px; color: var(--lac); border: 1px solid var(--lac); }
.wx-tag.is-bao { background: var(--lac); color: var(--ivory); }
.wx-title { margin-top: 6px; font-family: var(--display); font-size: 46px; line-height: 1.2; color: var(--ink-w); }
.wx-line { margin-top: 4px; font-size: 16.5px; line-height: 1.9; color: var(--ink-muted); }
.wx-fields { margin: 16px 0 0; display: flex; flex-direction: column; gap: 14px; }
.wx-fields dt { font-size: 12px; letter-spacing: 0.3em; color: var(--lac); }
.wx-fields dd { margin: 2px 0 0; font-size: 15px; line-height: 1.95; color: var(--ink-w); }
.wx-fields strong { font-weight: 600; color: var(--lac-deep); }
.wx-fields .is-note dd { padding: 8px 14px; border-left: 2px solid var(--lac); background: rgba(178, 58, 46, 0.06); }
.wx-see { margin-top: 18px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.wx-see-label { font-size: 12px; letter-spacing: 0.3em; color: var(--ink-muted); margin-right: 4px; }
.wx-chip {
  min-height: 40px; padding: 4px 14px; font-family: var(--body); font-size: 15px; letter-spacing: 0.08em;
  color: var(--ink-w); background: transparent; border: 1px solid var(--ivory-line); cursor: pointer;
}
.wx-chip:hover { border-color: var(--lac); color: var(--lac-deep); }
.wx-stepper { margin-top: 18px; padding-top: 12px; border-top: 1px dashed var(--ivory-line); display: flex; justify-content: space-between; gap: 12px; }
.wx-step-btn {
  min-height: 44px; padding: 6px 16px; font-family: var(--body); font-size: 14px; letter-spacing: 0.1em;
  color: var(--ink-w); background: transparent; border: 1px solid var(--ivory-line); cursor: pointer;
}
.wx-step-btn:hover { border-color: var(--lac); color: var(--lac-deep); }

/* 书案图里的器物 */
.wf-item { cursor: pointer; outline: none; }
.wf-hit { fill: transparent; stroke: transparent; stroke-width: 2; rx: 10; transition: fill 0.2s ease, stroke 0.2s ease; }
.wf-item:hover .wf-hit { stroke: var(--lac-soft); fill: rgba(241, 231, 209, 0.05); }
.wf-item:focus-visible .wf-hit { stroke: var(--cream); stroke-dasharray: 6 4; }
.wf-item.is-selected .wf-hit { stroke: var(--ivory); fill: rgba(241, 231, 209, 0.1); }
.wf-label { font-family: var(--body); font-size: 21px; letter-spacing: 0.1em; fill: var(--cream); text-anchor: middle; dominant-baseline: middle; pointer-events: none; paint-order: stroke; stroke: rgba(30, 18, 12, 0.75); stroke-width: 4px; stroke-linejoin: round; }
.wf-label.on-item { stroke: none; font-size: 18px; }
.wf-label.dark { fill: #1c2b24; }
.wf-label.gold { fill: #d6b46a; }
.wf-seal { fill: var(--lac); stroke: var(--ivory); stroke-width: 1.5; pointer-events: none; }
.wf-grain { fill: none; stroke: rgba(0, 0, 0, 0.14); stroke-width: 1.4; }

/* 一次书写 */
.wx-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.wx-step { position: relative; padding: 18px 18px 16px; display: flex; flex-direction: column; gap: 6px; }
.wx-step:not(:last-child)::after { content: '→'; position: absolute; right: -19px; top: 50%; transform: translateY(-50%); color: var(--cream-muted); font-size: 18px; }
.wx-step-no { font-family: var(--display); font-size: 30px; line-height: 1; color: var(--lac); }
.wx-step-name { font-family: var(--display); font-size: 30px; line-height: 1.2; }
.wx-step-text { margin-bottom: 8px; font-size: 14.5px; line-height: 1.9; color: var(--ink-muted); }
.wx-step .wx-chip { align-self: flex-start; margin-top: auto; }

/* 墨分五色 */
.wx-ink-wrap { padding: 22px 22px 18px; }
.wx-ink { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.wx-ink-cell { display: flex; flex-direction: column; border: 1px solid var(--ivory-line); }
.wx-swatch { height: 104px; display: flex; align-items: center; justify-content: center; font-family: var(--display); font-size: 46px; line-height: 1; }
.wx-ink-body { padding: 10px 12px 12px; display: flex; flex-direction: column; gap: 4px; }
.wx-ink-state { font-size: 14px; line-height: 1.8; color: var(--ink-w); }
.wx-ink-effect { font-size: 13.5px; line-height: 1.8; color: var(--ink-muted); }
.wx-remark { margin-top: 16px; padding-top: 12px; border-top: 1px dashed var(--ivory-line); font-size: 13.5px; line-height: 1.9; color: var(--ink-muted); }

/* 小提示与批注 */
.wx-tip { padding: 14px 18px; border: 1px dashed rgba(234, 223, 198, 0.45); }
.wx-tip-label { font-size: 13px; letter-spacing: 0.3em; color: var(--lac-soft); }
.wx-tip p { margin-top: 4px; font-size: 15px; line-height: 1.9; color: var(--cream); }
.wx-notes { border-left: 1px solid var(--lac-soft); padding-left: 20px; }
.wx-notes summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; font-size: 13px; letter-spacing: 0.3em; color: var(--cream-muted); list-style: none; }
.wx-notes summary::-webkit-details-marker { display: none; }
.wx-notes summary::after { content: '＋'; margin-left: auto; color: var(--lac-soft); font-size: 18px; letter-spacing: 0; }
.wx-notes[open] summary::after { content: '－'; }
.wx-notes-body { display: flex; flex-direction: column; gap: 10px; padding-bottom: 8px; }
.wx-notes-body p { font-size: 13.5px; line-height: 1.85; color: var(--cream); }
.wx-note-label { color: var(--lac-soft); margin-right: 1em; }

/* 入口页：两扇门 */
.wx-study { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.wx-door { display: flex; flex-direction: column; text-decoration: none; color: var(--ink-w); border-top: 4px solid var(--lac); transition: transform 0.2s ease, box-shadow 0.2s ease; }
.theme-jz a.wx-door, .theme-jz a.wx-door:hover { color: var(--ink-w); }
.wx-door.is-open:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45); }
.wx-door.is-closed { border-top-color: var(--ivory-line); }
.wx-door-art { background: var(--ivory-2); border-bottom: 1px solid var(--ivory-line); padding: 14px 20px 10px; }
.wx-door-art svg { display: block; width: 100%; height: auto; max-height: 200px; }
.wx-door-body { padding: 20px 24px 22px; display: flex; flex-direction: column; gap: 10px; }
.wx-door-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.wx-door-name { font-family: var(--display); font-size: 40px; line-height: 1.2; }
.wx-door-size { font-size: 13px; letter-spacing: 0.15em; color: var(--ink-muted); }
.wx-door-line { font-size: 15.5px; line-height: 1.9; color: var(--ink-muted); }
.wx-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.wx-pill { padding: 0 10px; line-height: 26px; font-size: 13px; letter-spacing: 0.08em; color: var(--ink-muted); border: 1px solid var(--ivory-line); }
.wx-door.is-closed .wx-pill { border-style: dashed; }
.wx-pill.is-closed { border-style: dashed; opacity: 0.7; }
.wx-paper a.wx-pill.is-link { color: var(--lac-deep); border-color: var(--lac); text-decoration: none; }
.wx-paper a.wx-pill.is-link:hover { background: rgba(178, 58, 46, 0.1); }
.wx-door.has-pages:hover { transform: none; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35); }
.wx-door-go { align-self: flex-start; }
.wx-paper a.wx-door-go { text-decoration: none; }
.wx-door-go { font-size: 14px; letter-spacing: 0.2em; color: var(--lac); }
.wx-soon { font-size: 12px; letter-spacing: 0.2em; padding: 0 10px; line-height: 24px; color: var(--ink-muted); border: 1px dashed var(--ink-muted); }

/* 桌面：书案在左，详情在右 */
@media (min-width: 1000px) {
  .wx-explore { grid-template-columns: minmax(0, 1.5fr) minmax(340px, 1fr); gap: 32px; }
  .wx-panel { position: sticky; top: 16px; }
}
@media (max-width: 999px) {
  .wx-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wx-step:nth-child(2)::after { display: none; }
  .wx-ink { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
  .wx-swatch { font-size: 36px; height: 84px; }
}
@media (max-width: 799px) {
  .wx-study { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 639px) {
  .wx-page { padding-top: 24px; gap: 36px; }
  .wx-panel { padding: 20px 18px 14px; }
  .wx-title { font-size: 40px; }
  .wx-steps { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .wx-step:not(:last-child)::after { content: '↓'; right: auto; left: 50%; top: auto; bottom: -22px; transform: translateX(-50%); display: block; }
  .wx-ink { grid-template-columns: minmax(0, 1fr); }
  .wx-ink-cell { flex-direction: row; }
  .wx-swatch { flex: none; width: 84px; height: auto; min-height: 84px; }
  .wf-label { font-size: 30px; stroke-width: 5px; }
  .wf-label.on-item { font-size: 24px; }
  .wx-door-name { font-size: 34px; }
}
@media (prefers-reduced-motion: reduce) {
  .wx-page { animation: none; }
  .wx-door, .wf-hit { transition: none; }
  .wx-door.is-open:hover { transform: none; }
}

/* ---------- 典故与演变页 ---------- */
/* 书写材料的演变：三张卡片 */
.wx-stages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
.wx-stage { position: relative; display: flex; flex-direction: column; }
.wx-stage:not(:last-child)::after { content: '→'; position: absolute; right: -19px; top: 44px; color: var(--cream-muted); font-size: 18px; }
.wx-stage-art { display: flex; justify-content: center; padding: 12px 20px 8px; background: var(--ivory-2); border-bottom: 1px solid var(--ivory-line); }
.wx-stage-art svg { display: block; height: 64px; width: auto; }
.wx-stage-body { padding: 16px 20px 18px; }
.wx-stage-name { font-family: var(--display); font-size: 32px; line-height: 1.2; color: var(--ink-w); }
.wx-stage .wx-fields { margin-top: 10px; }

/* 十二个典故：筛选 + 可展开的卡片 */
.wx-filter-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; }
.wx-count { font-size: 13px; letter-spacing: 0.15em; color: var(--cream-muted); }
.wx-stories { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: start; }
.wx-story[hidden] { display: none; }
.wx-story summary { position: relative; display: flex; flex-direction: column; gap: 6px; box-sizing: border-box; min-height: 140px; padding: 16px 18px 18px; cursor: pointer; list-style: none; }
.wx-story summary::-webkit-details-marker { display: none; }
.wx-story summary::after { content: '＋'; position: absolute; right: 16px; bottom: 12px; font-size: 18px; color: var(--lac); }
.wx-story[open] summary::after { content: '－'; }
.wx-story-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.wx-story-name { font-family: var(--display); font-size: 30px; line-height: 1.2; color: var(--ink-w); }
.wx-kind { flex: none; padding: 0 8px; font-size: 12px; letter-spacing: 0.12em; line-height: 22px; color: var(--ink-muted); border: 1px solid var(--ink-muted); }
.wx-kind.is-fact { color: var(--ivory); background: var(--ink-w); border-color: var(--ink-w); }
.wx-kind.is-legend { color: var(--ivory); background: var(--lac); border-color: var(--lac); }
.wx-story-meaning { padding-right: 26px; font-size: 14.5px; line-height: 1.8; color: var(--ink-muted); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.wx-story-body { margin: 0 18px; padding: 14px 0 16px; border-top: 1px dashed var(--ivory-line); }
.wx-story-body .wx-fields { margin-top: 0; }
.wx-rel { margin-top: 12px; font-size: 13px; letter-spacing: 0.08em; color: var(--ink-muted); }
.wx-story .wx-see { margin-top: 12px; }
.wx-story a.wx-chip { display: inline-flex; align-items: center; text-decoration: none; color: var(--ink-w); }
.wx-story a.wx-chip:hover { color: var(--lac-deep); }

/* 名品：四栏 */
.wx-fame { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; align-items: start; }
.wx-fame-col { padding: 18px 18px 8px; }
.wx-fame-head { margin-bottom: 4px; padding-bottom: 8px; font-family: var(--display); font-size: 44px; line-height: 1; color: var(--lac); border-bottom: 1px solid var(--ivory-line); }
.wx-fame-entry { padding: 12px 0; border-bottom: 1px dashed var(--ivory-line); }
.wx-fame-entry:last-child { border-bottom: 0; }
.wx-fame-name { font-family: var(--display); font-size: 24px; line-height: 1.3; color: var(--ink-w); }
.wx-fame-place { font-size: 12.5px; letter-spacing: 0.1em; color: var(--lac-deep); }
.wx-fame-text { margin-top: 2px; font-size: 14px; line-height: 1.85; color: var(--ink-muted); }

/* 页面底部的"接着看"链接 */
.theme-jz a.wx-next { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; padding: 14px 18px; text-decoration: none; color: var(--cream); border: 1px solid rgba(234, 223, 198, 0.4); }
.theme-jz a.wx-next:hover { border-color: var(--cream); color: #ffffff; }
.wx-next-label { font-family: var(--display); font-size: 24px; line-height: 1.3; color: #f6ecd5; }

@media (max-width: 999px) {
  .wx-stories { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wx-fame { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 899px) {
  .wx-stages { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .wx-stage:not(:last-child)::after { content: '↓'; right: auto; left: 50%; top: auto; bottom: -26px; transform: translateX(-50%); }
}
@media (max-width: 639px) {
  .wx-stories { grid-template-columns: minmax(0, 1fr); }
  .wx-fame { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- 屋顶与脊兽页 ---------- */
/* 六种屋顶 */
.wx-roofs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.wx-roof { display: flex; flex-direction: column; }
.wx-roof-art { background: var(--ivory-2); border-bottom: 1px solid var(--ivory-line); padding: 10px 16px 6px; }
.wx-roof-art svg { display: block; width: 100%; height: auto; max-height: 150px; }
.wx-roof-body { padding: 14px 18px 16px; display: flex; flex-direction: column; gap: 4px; }
.wx-roof-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.wx-roof-name { font-family: var(--display); font-size: 32px; line-height: 1.2; color: var(--ink-w); }
.wx-roof .wx-fields { margin-top: 8px; }

/* 屋顶等级：台阶 */
.wx-ladder { display: flex; flex-direction: column; gap: 8px; }
.wx-rung { display: flex; align-items: center; gap: 16px; padding: 12px 18px; border-left: 8px solid var(--lac); }
.wx-rung[data-level="1"] { margin-left: 0; border-left-color: #7d2a20; }
.wx-rung[data-level="2"] { margin-left: 28px; border-left-color: #b23a2e; }
.wx-rung[data-level="3"] { margin-left: 56px; border-left-color: #c9705e; }
.wx-rung[data-level="4"] { margin-left: 84px; border-left-color: #d9a08e; }
.wx-rung[data-level="5"] { margin-left: 112px; border-left-color: #e2c2b3; }
.wx-rung-no { flex: none; width: 3.2em; font-family: var(--display); font-size: 22px; line-height: 1.2; color: var(--lac); }
.wx-rung-body { min-width: 0; }
.wx-rung-roofs { font-family: var(--display); font-size: 26px; line-height: 1.3; color: var(--ink-w); }
.wx-rung-text { font-size: 14.5px; line-height: 1.8; color: var(--ink-muted); }

/* 屋脊示意图 */
.wx-ridge-wrap { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.wx-ridge-fig { padding: 12px 14px 8px; background: #50423a; }
.wx-ridge-fig svg { display: block; width: 100%; height: auto; }
.wx-ridge-label { font-family: var(--display); font-size: 22px; }
.wx-ridge-main { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.wx-ridge-list { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.wx-ridge-item { padding: 10px 14px; border: 1px solid rgba(234, 223, 198, 0.28); }
.wx-ridge-item dt { display: flex; align-items: center; gap: 8px; font-family: var(--display); font-size: 22px; line-height: 1.3; color: #f6ecd5; }
.wx-ridge-item dd { margin: 2px 0 0; font-size: 14.5px; line-height: 1.8; color: var(--cream); }
.wx-dot { flex: none; width: 12px; height: 12px; border-radius: 50%; }
.wx-wen { padding: 16px 18px 12px; }
.wx-wen-title { font-family: var(--display); font-size: 26px; line-height: 1.3; color: var(--ink-w); }

/* 檐角走兽 */
.wx-beasts-wrap { padding: 14px 0 4px; }
.wx-beasts-dir { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; font-size: 12.5px; letter-spacing: 0.15em; color: var(--cream-muted); }
.wx-beasts-line { flex: 1; height: 1px; background: rgba(234, 223, 198, 0.4); position: relative; }
.wx-beasts-line::after { content: ''; position: absolute; right: 0; top: -3px; width: 7px; height: 7px; border-top: 1px solid rgba(234, 223, 198, 0.6); border-right: 1px solid rgba(234, 223, 198, 0.6); transform: rotate(45deg); }
.wx-beasts-row { display: flex; flex-wrap: wrap; gap: 8px; }
.wx-beast { width: 74px; padding: 8px 4px 10px; text-align: center; color: var(--ink-muted); background: var(--ivory-2); border: 1px dashed var(--ivory-line); opacity: 0.42; transition: opacity 0.2s ease, background 0.2s ease; }
.wx-beast.is-on { opacity: 1; color: var(--ink-w); background: #e8c46a; border: 1px solid #a8842f; }
.wx-beast.is-immortal { width: 96px; opacity: 1; color: var(--ivory); background: var(--lac); border: 1px solid var(--lac-deep); }
.wx-beast-no { display: block; font-size: 11px; letter-spacing: 0.1em; opacity: 0.75; }
.wx-beast-name { display: block; font-family: var(--display); font-size: 26px; line-height: 1.3; }
.wx-beast-name.is-long { font-size: 19px; line-height: 1.7; }
.wx-beast-info { margin-top: 12px; padding: 14px 18px 12px; }
.wx-beast-count { font-family: var(--display); font-size: 26px; line-height: 1.3; color: var(--lac-deep); }

/* 五个常见的说法 */
.wx-myths { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.wx-myth { padding: 16px 18px 14px; }
.wx-myth-title { font-family: var(--display); font-size: 26px; line-height: 1.3; color: var(--ink-w); }
.wx-myth-claim { margin-top: 2px; font-size: 14px; line-height: 1.8; color: var(--ink-muted); }
.wx-myth .wx-fields { margin-top: 10px; }

@media (max-width: 999px) {
  .wx-roofs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wx-ridge-wrap { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 639px) {
  .wx-roofs { grid-template-columns: minmax(0, 1fr); }
  .wx-myths { grid-template-columns: minmax(0, 1fr); }
  .wx-rung[data-level="2"] { margin-left: 8px; }
  .wx-rung[data-level="3"] { margin-left: 16px; }
  .wx-rung[data-level="4"] { margin-left: 24px; }
  .wx-rung[data-level="5"] { margin-left: 32px; }
  .wx-rung { gap: 10px; padding: 10px 12px; }
  .wx-rung-roofs { font-size: 22px; }
  .wx-beast { width: 62px; }
  .wx-beast.is-immortal { width: 84px; }
  .wx-ridge-list { grid-template-columns: minmax(0, 1fr); }
  .wx-beast-name { font-size: 22px; }
  .wx-beast-name.is-long { font-size: 16px; }
  .wx-ridge-label { font-size: 26px; }
}

/* ---------- 木构架与榫卯页 ---------- */
.mg-fig { padding: 10px 12px; background: var(--ivory); border-radius: 2px; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35); }
.mg-fig svg { display: block; width: 100%; height: auto; }
.mg-part { cursor: pointer; outline: none; transition: opacity 0.2s ease; }
.mg-part:hover { filter: drop-shadow(0 0 4px rgba(178, 58, 46, 0.6)); }
.mg-part:focus-visible { filter: drop-shadow(0 0 5px #2b2118); }
.mg-fig.has-sel .mg-part:not(.is-selected) { opacity: 0.5; }
.mg-part.is-selected { filter: drop-shadow(0 0 5px rgba(178, 58, 46, 0.9)); }
.mg-leader { fill: none; stroke: #7d6a52; stroke-width: 1; }
.mg-dot { fill: #7d6a52; }
.mg-label { font-family: var(--body); font-size: 17px; fill: #2b2118; }
.mg-tx-dark { font-family: var(--body); font-size: 14px; fill: #2b2118; }
.mg-tx-light { font-family: var(--body); font-size: 16px; fill: #f6ecd5; }
.mg-zone rect { fill: transparent; stroke: rgba(90, 77, 61, 0.45); stroke-width: 1.5; stroke-dasharray: 5 4; pointer-events: none; }
.mg-zone-label { font-family: var(--body); font-size: 14px; fill: #5a4d3d; }
.mg-zone.is-on rect { fill: rgba(178, 58, 46, 0.12); stroke: var(--lac); stroke-width: 2.5; stroke-dasharray: none; }
.mg-zone.is-on .mg-zone-label { fill: var(--lac-deep); font-weight: 600; }
.mg-info { padding: 22px 24px 18px; border-top: 4px solid var(--lac); min-width: 0; }
.mg-joint-text { margin-top: 10px; }
.mg-joint-side { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.mg-zones { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.mg-zones li { display: flex; align-items: flex-start; gap: 10px; padding: 10px 14px; border: 1px solid rgba(234, 223, 198, 0.28); font-size: 14.5px; line-height: 1.8; color: var(--cream); }
.mg-zones strong { font-weight: 600; color: #f6ecd5; }
.mg-zone-no { flex: none; width: 24px; height: 24px; margin-top: 2px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--lac); color: var(--ivory); font-size: 13px; }
.wx-pill.is-place { color: var(--lac-deep); border-color: var(--lac); }
.mg-box { padding: 14px 18px 12px; }
.mg-roles { margin: 6px 0 0; padding-left: 1.2em; font-size: 14.5px; line-height: 1.9; color: var(--ink-w); }
.mg-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.mg-kind { display: flex; flex-direction: column; }
.mg-frame-art { padding: 10px 16px 6px; background: var(--ivory-2); border-bottom: 1px solid var(--ivory-line); }
.mg-frame-art svg { display: block; width: 100%; height: auto; max-height: 240px; }
.mg-kind-body { padding: 14px 18px 16px; display: flex; flex-direction: column; gap: 4px; }
.mg-table-wrap { padding: 6px 12px; overflow-x: auto; }
.wx-table { width: 100%; border-collapse: collapse; font-size: 14.5px; line-height: 1.8; color: var(--ink-w); }
.wx-table th, .wx-table td { padding: 10px 12px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--ivory-line); }
.wx-table tbody tr:last-child th, .wx-table tbody tr:last-child td { border-bottom: 0; }
.wx-table thead th { font-family: var(--display); font-size: 18px; font-weight: 400; color: var(--lac); white-space: nowrap; }
.wx-table tbody th { font-family: var(--display); font-size: 20px; font-weight: 400; white-space: nowrap; color: var(--ink-w); }
.wx-table td { color: var(--ink-muted); }
.mg-plan { max-width: 720px; }

@media (max-width: 799px) {
  .mg-two { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 639px) {
  .mg-info { padding: 18px 16px 14px; }
  .mg-label { font-size: 26px; }
  .wx-table { font-size: 13.5px; }
  .wx-table th, .wx-table td { padding: 8px 8px; }
  .wx-table tbody th { font-size: 17px; }
}

/* ---------- 宫殿、坛庙与城市页 ---------- */
.gd-big { font-family: var(--display); font-size: 34px; fill: #2b2118; pointer-events: none; }
.gd-big.is-light { fill: #f6ecd5; }
.gd-node { font-family: var(--body); font-size: 16px; fill: #2b2118; pointer-events: none; }
.gd-badge { font-family: var(--body); font-size: 12px; fill: #f6ecd5; pointer-events: none; }
.gd-palace-fig.has-sel .mg-part:not(.is-selected) { opacity: 1; filter: saturate(0.3); }
.gd-note { padding: 14px 18px; }
.gd-no { margin: 2px 0 6px; }
.gd-chip-group { display: flex; flex-direction: column; gap: 6px; }
.wx-step-btn:disabled { opacity: 0.4; cursor: default; }
.gd-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.gd-cards-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gd-cards-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.gd-cards-1 { grid-template-columns: minmax(0, 320px); }
.gd-card { padding: 16px 18px 14px; }
.gd-card-name { font-family: var(--display); font-size: 28px; line-height: 1.3; color: var(--ink-w); }
.gd-card-text { margin-top: 2px; font-size: 14.5px; line-height: 1.85; color: var(--ink-muted); }
.gd-route-wrap { padding: 4px 0 0; }
.gd-route { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
.gd-step { position: relative; padding: 16px 18px 14px; }
.gd-step:not(:last-child)::after { content: '→'; position: absolute; right: -19px; top: 50px; color: var(--cream-muted); font-size: 18px; }
.gd-tomb { display: flex; flex-direction: column; gap: 10px; }
.gd-tomb-label { font-size: 13px; letter-spacing: 0.3em; color: var(--cream-muted); }
.gd-tomb-arrow { text-align: center; font-size: 22px; color: var(--cream-muted); }
.gd-reps { margin-top: 4px; }
.gd-reps .wx-hint { margin-top: 4px; }

@media (max-width: 999px) {
  .gd-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gd-cards-5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .gd-route { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 28px; }
  .gd-step:nth-child(2)::after { display: none; }
}
@media (max-width: 639px) {
  .gd-cards, .gd-cards-2, .gd-cards-5 { grid-template-columns: minmax(0, 1fr); }
  .gd-route { grid-template-columns: minmax(0, 1fr); }
  .gd-step:not(:last-child)::after { content: '↓'; right: auto; left: 50%; top: auto; bottom: -26px; transform: translateX(-50%); display: block; }
  .gd-big { font-size: 40px; }
  .gd-node { font-size: 20px; }
  .gd-badge { font-size: 14px; }
}

/* ---------- 院落与民居页 ---------- */
.mj-small { font-family: var(--body); font-size: 14px; fill: #2b2118; pointer-events: none; }
.gd-node.mj-small { font-size: 14px; }
.gd-node.is-light { fill: #f6ecd5; }
.mj-homes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.mj-home { display: flex; flex-direction: column; }
.mj-home-art { padding: 8px 12px; background: var(--ivory-2); border-bottom: 1px solid var(--ivory-line); }
.mj-home-art svg { display: block; width: 100%; height: auto; max-height: 96px; }
.mj-home-body { flex: 1; padding: 14px 18px 16px; display: flex; flex-direction: column; gap: 8px; }
.mj-home-body .wx-fields { margin-top: auto; }
.mj-home-text { font-size: 14.5px; line-height: 1.85; color: var(--ink-muted); }
.mj-see { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.mj-closing { margin: 0; padding: 22px 26px; border-left: 6px solid var(--lac); font-family: var(--display); font-size: 24px; line-height: 1.8; color: var(--ink-w); }

@media (max-width: 999px) {
  .mj-homes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 639px) {
  .mj-homes { grid-template-columns: minmax(0, 1fr); }
  .mj-see { grid-template-columns: minmax(0, 1fr); }
  .mj-closing { padding: 18px 18px; font-size: 21px; }
  .mj-small, .gd-node.mj-small { font-size: 18px; }
}

/* ---------- 园林页 ---------- */
.gd-cards-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.yl-pills { margin: 6px 0 8px; }
.mj-home-art.yl-art svg { max-height: 150px; }
.yl-eg { margin-top: auto; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.yl-garden[hidden] { display: none; }
.yl-islands { max-width: 620px; }

@media (max-width: 999px) {
  .gd-cards-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 639px) {
  .gd-cards-4 { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- 楼阁与匾额对联页 ---------- */
.lg-names { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.lg-plaque svg { max-width: 520px; margin: 0 auto; }
.lg-plaque-text { font-family: var(--display); font-size: 52px; fill: #e8c46a; }
.lg-label { margin: 10px 0 6px; }
.lg-rules { list-style: none; margin: 0 0 6px; padding: 0; display: flex; flex-direction: column; gap: 6px; counter-reset: lg; }
.lg-rules li { counter-increment: lg; display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; font-size: 15px; line-height: 1.8; color: var(--ink-w); }
.lg-rules li::before { content: counter(lg); flex: none; width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--ivory-line); color: var(--ink-w); font-size: 12px; }
.lg-rules li.is-done::before { background: var(--lac); color: var(--ivory); }
.lg-rule-tag { font-size: 12px; line-height: 22px; padding: 0 8px; color: var(--lac-deep); border: 1px solid var(--lac); }
.lg-couplet { margin-top: 14px; padding: 18px 22px; display: flex; flex-direction: column; gap: 10px; }
.lg-author { font-size: 13px; letter-spacing: 0.15em; color: var(--ink-muted); }
.lg-row { display: flex; align-items: center; gap: 12px; }
.lg-side { flex: none; width: 2.6em; font-family: var(--display); font-size: 18px; color: var(--lac); }
.lg-cells { flex: 1; display: flex; gap: 10px; min-width: 0; }
.lg-seg { display: flex; min-width: 0; padding: 4px 2px; border: 1px solid transparent; cursor: pointer; transition: background 0.2s ease; }
.lg-seg:hover { background: rgba(178, 58, 46, 0.06); }
.lg-seg.is-on { background: rgba(178, 58, 46, 0.12); border-color: var(--lac); }
.lg-cell { flex: 1 1 0; text-align: center; font-family: var(--display); font-size: clamp(16px, 2.4vw, 28px); line-height: 1.5; color: var(--ink-w); border-bottom: 1px dashed var(--ivory-line); }
.lg-cells.is-wrap { flex-wrap: wrap; row-gap: 6px; }
.lg-cells.is-wrap .lg-cell { flex: 0 0 auto; width: 1.7em; }
.lg-info { min-height: 3.6em; font-size: 14.5px; line-height: 1.8; color: var(--ink-muted); }
.wx-chip[aria-pressed="true"] { color: var(--ivory); background: var(--ink-w); border-color: var(--ink-w); }

@media (max-width: 999px) {
  .lg-names { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 639px) {
  .lg-couplet { padding: 16px 14px; }
  .lg-row { gap: 8px; }
  .lg-side { width: 2.2em; font-size: 15px; }
  .lg-cells { gap: 6px; }
  .lg-cell { font-size: 14px; }
  .lg-plaque-text { font-size: 56px; }
}

/* ---------- 寺观、塔与桥页 ---------- */
.sg-then { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; max-width: 520px; }
.sg-then-item { padding: 10px 14px 6px; }
.sg-then-svg svg { display: block; width: 100%; height: auto; max-height: 130px; }
.sg-then-item .gd-card-text { text-align: center; }
.sg-spaces { margin: 2px 0 4px; }
.sg-spaces .wx-pill { color: var(--cream); border-color: rgba(234, 223, 198, 0.4); font-size: 14px; }
.sg-parts-fig svg { max-width: 440px; margin: 0 auto; }
.mj-home-art.sg-tower-art svg { max-height: 190px; }

@media (max-width: 639px) {
  .sg-then { gap: 10px; }
}

/* ---------- 代表建筑时间线页 ---------- */
.sj-years { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.sj-year { display: flex; align-items: center; gap: 12px; padding: 14px 16px; }
.sj-year-no { flex: none; width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--lac); color: var(--ivory); font-size: 14px; }
.sj-year-name { font-family: var(--display); font-size: 24px; line-height: 1.3; color: var(--ink-w); }
.sj-dot { display: inline-block; width: 10px; height: 10px; margin-right: 8px; border-radius: 50%; vertical-align: 1px; }
.sj-strip-wrap { display: flex; flex-direction: column; gap: 8px; }
.sj-arrows { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sj-arrow { width: 44px; height: 44px; font-size: 16px; color: var(--cream); background: transparent; border: 1px solid rgba(234, 223, 198, 0.4); border-radius: 50%; cursor: pointer; }
.sj-arrow:hover { border-color: var(--cream); }
.sj-strip { overflow-x: auto; padding: 4px 0 14px; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; }
.sj-strip::-webkit-scrollbar { height: 8px; }
.sj-strip::-webkit-scrollbar-thumb { background: rgba(234, 223, 198, 0.3); border-radius: 4px; }
.sj-track { display: flex; min-width: max-content; }
.sj-col { flex: 0 0 188px; padding: 0 10px; border-left: 1px dashed rgba(234, 223, 198, 0.28); scroll-snap-align: start; }
.sj-col:first-child { border-left: 0; }
.sj-col-head { padding: 4px 0 2px; }
.sj-col-name { font-family: var(--display); font-size: 36px; line-height: 1.2; color: #f6ecd5; }
.sj-col-range { font-size: 12px; letter-spacing: 0.06em; color: var(--cream-muted); }
.sj-axis { position: relative; height: 16px; margin: 8px -10px 12px; }
.sj-axis::before { content: ''; position: absolute; left: 0; right: 0; top: 7px; height: 2px; background: rgba(234, 223, 198, 0.4); }
.sj-axis-dot { position: absolute; left: 10px; top: 2px; width: 12px; height: 12px; border-radius: 50%; background: var(--lac-soft); }
.sj-nodes { display: flex; flex-direction: column; gap: 8px; }
.sj-node { display: flex; flex-direction: column; gap: 2px; min-height: 44px; padding: 8px 10px 8px 12px; text-align: left; font-family: var(--body); color: var(--ink-w); background: var(--ivory); border: 0; border-left: 6px solid var(--tc, #7d6a52); cursor: pointer; transition: opacity 0.2s ease; }
.sj-node:hover { background: #f8ecd0; }
.sj-node[aria-pressed="true"] { background: #f9e6a6; box-shadow: 0 0 0 2px var(--lac-soft); }
.sj-node.is-dim { opacity: 0.25; }
.sj-node-name { font-size: 15px; font-weight: 600; line-height: 1.45; }
.sj-node-year { font-size: 12.5px; line-height: 1.5; letter-spacing: 0.04em; color: var(--ink-muted); }
.sj-panel { max-width: 860px; }
.sj-meta { margin: 8px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 18px; }
.sj-meta dt { font-size: 12px; letter-spacing: 0.3em; color: var(--lac); }
.sj-meta dd { margin: 2px 0 0; font-size: 14.5px; line-height: 1.7; color: var(--ink-w); }
.sj-panel .wx-line { margin-top: 12px; }
.sj-place-btn { cursor: pointer; background: transparent; font-family: var(--body); color: var(--ink-w); }
.sj-place-btn:hover { border-color: var(--lac); color: var(--lac-deep); }

@media (max-width: 999px) {
  .sj-years { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 639px) {
  .sj-col { flex-basis: 170px; }
  .sj-meta { grid-template-columns: minmax(0, 1fr); }
  .sj-arrow { display: none; }
  .sj-arrows { justify-content: flex-start; }
}

/* 建筑入口页 */
.jz-art { padding: 16px 24px 12px; background: var(--ivory-2); border-top: 4px solid var(--lac); }
.jz-art svg { display: block; width: 100%; height: auto; max-height: 220px; }
.jz-routes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.jz-route { padding: 20px 22px 22px; border-top: 4px solid var(--lac); display: flex; flex-direction: column; gap: 8px; }
.jz-route-no { font-family: var(--display); font-size: 22px; line-height: 1; color: var(--lac); }
.jz-route-name { font-family: var(--display); font-size: 30px; line-height: 1.25; }
.jz-route-line { font-size: 15px; line-height: 1.9; color: var(--ink-muted); }
.jz-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.jz-card { display: flex; flex-direction: column; gap: 8px; padding: 18px 18px 16px; text-decoration: none; border-top: 4px solid var(--lac); transition: transform 0.2s ease, box-shadow 0.2s ease; }
.theme-jz a.jz-card, .theme-jz a.jz-card:hover { color: var(--ink-w); }
.jz-card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45); }
.jz-card-no { font-family: var(--display); font-size: 20px; line-height: 1; color: var(--lac); }
.jz-card-name { font-family: var(--display); font-size: 28px; line-height: 1.25; }
.jz-card-line { font-size: 14.5px; line-height: 1.85; color: var(--ink-muted); }
.jz-card-go { margin-top: auto; padding-top: 6px; font-size: 13px; letter-spacing: 0.1em; color: var(--lac); }
@media (max-width: 899px) {
  .jz-routes { grid-template-columns: minmax(0, 1fr); }
  .jz-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 519px) {
  .jz-grid { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- 建筑页里的真实照片（js/jzphoto.js） ----------
   相框固定高度；里面两层：底层同一张图放大虚化，上层完整显示，横竖照片都不会被裁掉。
   图注一行，摄影者/授权/出处链接一行。 */
.jz-fig { margin: 0; }
.jz-fig-frame { position: relative; height: 190px; overflow: hidden; background: #d9cdb0; }
.jz-fig-bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; filter: blur(16px) saturate(0.9); transform: scale(1.15); opacity: 0.85; }
.jz-fig-img { position: relative; display: block; width: 100%; height: 100%; object-fit: contain; }
.jz-fig-cap { display: flex; flex-direction: column; gap: 2px; padding: 6px 18px 0; }
.jz-fig-txt { font-size: 12px; line-height: 1.6; color: var(--ink-muted); }
.jz-fig-src { font-size: 11px; line-height: 1.5; color: var(--ink-muted); opacity: 0.9; text-decoration: underline dotted; text-underline-offset: 2px; }
a.jz-fig-src:hover { color: var(--lac); }
/* 卡片最上面：铺满卡片宽度（抵消卡片的内边距） */
.jz-fig.is-top { margin: -16px -18px 10px; }
.jz-fig.is-top .jz-fig-cap { padding: 6px 18px 0; }
.gd-step > .jz-fig.is-top { margin-top: -16px; }
/* 线稿和文字之间 */
.jz-fig.is-flat { border-bottom: 1px solid var(--ivory-line); padding-bottom: 8px; }
.jz-fig.is-flat .jz-fig-cap { padding-top: 6px; }
/* 点选后显示的说明面板 */
.jz-fig.is-panel { margin: 10px 0 12px; }
.jz-fig.is-panel .jz-fig-frame { height: 240px; }
.jz-fig.is-panel .jz-fig-cap { padding: 6px 0 0; }
/* 陵墓“代表”那几行 */
.jz-fig.is-rep { max-width: 420px; margin: 12px 0 4px; }
.jz-fig.is-rep .jz-fig-cap { padding: 6px 0 0; }
.jz-fig.is-rep .jz-fig-txt, .jz-fig.is-rep .jz-fig-src { color: var(--cream-muted); }
.jz-fig.is-rep a.jz-fig-src:hover { color: var(--cream); }
@media (max-width: 640px) {
  .jz-fig-frame { height: 170px; }
  .jz-fig.is-panel .jz-fig-frame { height: 200px; }
}