/* ZH-002 中国历史疆域四至 */
.zh2-main { max-width: 1120px; margin: 0 auto; padding: 0 28px 76px; }
.zh2-intro { border-top: 1px solid var(--ink); padding: 24px 0 22px; }
.zh2-intro p { max-width: 820px; margin: 0 0 9px; font-size: 13px; line-height: 1.95; color: var(--ink-2); }
.zh2-note {
  margin: 14px 0 0; padding: 14px 17px; border-left: 3px solid #b45309;
  background: #fbf4e7; font-size: 11.5px; line-height: 1.9; color: var(--ink-2);
}
.zh2-note b { color: #92400e; }
.zh2-stats { display: flex; flex-wrap: wrap; gap: 10px 24px; padding: 14px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); font-size: 11px; color: var(--ink-3); }
.zh2-stats b { color: var(--ink); font-size: 14px; font-weight: 600; }

.zh2-section { border-top: 1px solid var(--ink); padding: 28px 0 36px; }
.zh2-section h2 { margin: 0 0 5px; font-family: var(--serif); font-size: 26px; line-height: 1.4; }
.zh2-section .section-sub { max-width: 800px; margin: 0 0 20px; font-size: 12px; line-height: 1.85; color: var(--ink-3); }
.zh2-extremes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.zh2-extreme { border: 1px solid var(--line); border-top: 2px solid var(--ink); background: var(--paper-2); padding: 16px 15px 14px; }
.zh2-extreme .dir { margin: 0 0 4px; font-size: 9.5px; letter-spacing: .15em; color: var(--red); }
.zh2-extreme h3 { margin: 0 0 5px; font-family: var(--serif); font-size: 25px; line-height: 1.3; }
.zh2-extreme .ext-name { margin: 0 0 4px; font-size: 12px; line-height: 1.6; color: var(--ink); }
.zh2-extreme .ext-place { margin: 0 0 8px; font-size: 10.5px; line-height: 1.6; color: var(--ink-3); }
.zh2-extreme .ext-foot { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; font-size: 9.5px; color: var(--ink-3); }
.zh2-kind, .zh2-grade { border: 1px solid var(--line); padding: 1px 5px; white-space: nowrap; }
.zh2-kind.k-实控 { border-color: #7d9b76; color: #4c6b45; }
.zh2-kind.k-羁縻 { border-color: #c0a36a; color: #8a6826; }
.zh2-kind.k-谭图 { border-color: #9a9a9a; color: #666; }
.zh2-kind.k-军事 { border-color: #c98a5e; color: #92400e; }
.zh2-grade.g-A { border-color: #7d9b76; color: #4c6b45; }
.zh2-grade.g-B { border-color: #c0a36a; color: #8a6826; }
.zh2-grade.g-C { border-color: #aaa; color: #666; }
.zh2-grade.g-D { border-color: #c98a5e; color: #92400e; }

.zh2-figure { margin: 0 0 24px; }
.zh2-figure img { display: block; width: 100%; height: auto; border: 1px solid var(--line); background: var(--paper-2); }
.zh2-figure figcaption { margin-top: 7px; font-size: 10px; line-height: 1.7; color: var(--ink-3); }
.zh2-figure figcaption b { color: var(--ink-2); font-weight: 500; }
.zh2-two-figures { display: grid; grid-template-columns: 1.1fr .9fr; gap: 14px; align-items: start; }
.zh2-gif { margin-top: 8px; }
.zh2-gif summary { cursor: pointer; font-size: 11px; color: var(--ink-2); margin-bottom: 8px; }
.zh2-gif img { width: 100%; border: 1px solid var(--line); }

.zh2-toolbar { display: flex; flex-wrap: wrap; align-items: end; gap: 10px; padding: 2px 0 14px; }
.zh2-field { display: flex; flex-direction: column; gap: 3px; }
.zh2-field label { font-size: 9px; letter-spacing: .1em; color: var(--ink-3); }
.zh2-field select { font: inherit; font-size: 11px; color: var(--ink); background: var(--paper); border: 1px solid var(--line); padding: 5px 22px 5px 7px; }
.zh2-count { margin-left: auto; font-size: 10.5px; color: var(--ink-3); }
.zh2-table-wrap { overflow-x: auto; border-top: 1px solid var(--ink); }
.zh2-table { width: 100%; min-width: 780px; border-collapse: collapse; font-size: 10.5px; line-height: 1.55; }
.zh2-table th { text-align: left; padding: 8px 7px; background: var(--paper-2); color: var(--ink-3); font-weight: 400; font-size: 9px; letter-spacing: .05em; white-space: nowrap; border-bottom: 1px solid var(--line); }
.zh2-table td { padding: 7px 7px; border-bottom: 1px solid var(--line-soft); vertical-align: top; }
.zh2-table tr:hover td { background: #fbf4e7; }
.zh2-table .num { color: var(--ink-4); font-variant-numeric: tabular-nums; white-space: nowrap; }
.zh2-table .dir-s { color: #4c6b45; font-weight: 600; }
.zh2-table .dir-n { color: #4b6584; font-weight: 600; }
.zh2-table .dir-w { color: #8a6826; font-weight: 600; }
.zh2-table .dir-e { color: #9a5b4a; font-weight: 600; }
.zh2-name-btn { padding: 0; border: 0; background: none; color: var(--ink); text-align: left; font: inherit; font-family: var(--serif); font-size: 12px; cursor: pointer; }
.zh2-name-btn:hover { color: var(--red); }
.zh2-table .muted { color: var(--ink-3); }
.zh2-table .coord { font-family: "SFMono-Regular", Consolas, monospace; font-size: 9px; color: var(--ink-3); white-space: nowrap; }
.zh2-empty { padding: 30px 0; text-align: center; color: var(--ink-3); font-size: 12px; }

.zh2-docs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.zh2-doc { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; border: 1px solid var(--line); background: var(--paper-2); padding: 10px 12px; text-decoration: none; color: var(--ink); }
.zh2-doc:hover { border-color: var(--ink); }
.zh2-doc b { font-family: var(--serif); font-size: 14px; font-weight: 500; line-height: 1.5; }
.zh2-doc span { font-size: 9px; color: var(--ink-3); white-space: nowrap; }
.zh2-doc em { font-style: normal; color: var(--red); font-size: 11px; }

.zh2-source { margin-top: 10px; font-size: 11px; line-height: 1.9; color: var(--ink-2); }
.zh2-source a { color: var(--ink-2); }
.zh2-version { margin-top: 20px; padding-top: 10px; border-top: 1px solid var(--line); font-size: 10px; color: var(--ink-3); }

.zh2-dialog { width: min(820px, calc(100vw - 40px)); max-height: calc(100vh - 40px); margin: auto; padding: 0; border: 1px solid var(--ink); background: var(--paper); color: var(--ink); box-shadow: 0 22px 60px rgba(30,24,18,.25); }
.zh2-dialog::backdrop { background: rgba(28,24,19,.55); }
.zh2-dialog [hidden] { display: none !important; }
.zh2-dialog-close { position: absolute; top: 8px; right: 8px; width: 32px; height: 32px; border: 1px solid var(--line); background: var(--paper); color: var(--ink); font-size: 18px; cursor: pointer; }
.zh2-dialog-body { padding: 24px 24px 26px; overflow-y: auto; }
.zh2-dialog-top { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; font-size: 10px; color: var(--ink-3); }
.zh2-dialog h2 { margin: 8px 0 3px; font-family: var(--serif); font-size: 27px; line-height: 1.35; }
.zh2-dialog .dl-place { margin: 0 0 14px; font-size: 12px; color: var(--ink-2); }
.zh2-dialog .dl-meta { margin: 0 0 16px; font-size: 10.5px; color: var(--ink-3); }
.zh2-dialog .dl-block { margin: 0 0 13px; padding: 10px 12px; border-left: 2px solid var(--line); background: var(--paper-2); font-size: 11.5px; line-height: 1.85; color: var(--ink-2); }
.zh2-dialog .dl-block b { display: block; margin-bottom: 3px; font-size: 9px; letter-spacing: .12em; color: var(--ink-3); font-weight: 400; }
.zh2-dialog .dl-block.editor { border-left-color: #b45309; background: #fbf4e7; }
.zh2-dialog .dl-coords { display: grid; grid-template-columns: 72px minmax(0,1fr); gap: 4px 8px; margin: 0 0 13px; font-size: 10.5px; line-height: 1.7; }
.zh2-dialog .dl-coords dt { color: var(--ink-3); font-size: 9px; }
.zh2-dialog .dl-coords dd { margin: 0; font-family: "SFMono-Regular", Consolas, monospace; font-size: 10px; }
.zh2-dialog .dl-src { margin: 0; font-size: 9.5px; line-height: 1.7; color: var(--ink-3); }

@media (max-width: 950px) {
  .zh2-extremes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .zh2-two-figures { grid-template-columns: 1fr; }
}
@media (max-width: 650px) {
  .zh2-main { padding: 0 20px 56px; }
  .zh2-extremes, .zh2-docs { grid-template-columns: 1fr; }
  .zh2-section h2 { font-size: 23px; }
  .zh2-count { margin-left: 0; flex-basis: 100%; }
  .zh2-dialog { width: calc(100vw - 20px); max-height: calc(100vh - 20px); }
  .zh2-dialog-body { padding: 20px 16px 22px; }
  .zh2-dialog h2 { font-size: 22px; }
}