:root {
  color: var(--ink);
  background: var(--paper);
  color-scheme: var(--scheme);
  font: 16px/1.62 system-ui, "Microsoft YaHei", sans-serif;
  scroll-padding-top: 1rem;
}
* { box-sizing: border-box; }
body { margin: 0; }
body.font-serif { font-family: "Songti SC", SimSun, Georgia, serif; }
body.font-tech { font-family: ui-monospace, Consolas, "Microsoft YaHei", monospace; }
a { color: inherit; text-underline-offset: .22em; }
a:focus-visible, input:focus-visible, summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
img { display: block; max-width: 100%; }
figure, h1, h2, h3, p, dl, dd { margin: 0; }
li, p, h1, h2, h3, td, th, summary { overflow-wrap: anywhere; }
.wrap { width: min(calc(100% - 64px), 1160px); margin-inline: auto; }
.site-header { border-bottom: 1px solid var(--line); }
.top-inner { min-height: 65px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-block: 10px; }
.wordmark { min-width: 0; display: inline-flex; align-items: center; gap: 10px; text-decoration: none; font-weight: 780; }
.wordmark img { flex: 0 0 34px; }
.wordmark span { overflow-wrap: anywhere; }
.top-links { display: flex; flex-wrap: wrap; justify-content: end; gap: 6px 16px; }
.top-links a { font-size: 13px; font-weight: 700; text-decoration: none; }
.top-links a:hover { text-decoration: underline; }
.menu { display: none; }
.home-f .top-inner, .home-c .top-inner { justify-content: center; flex-wrap: wrap; }
.home-f .top-links, .home-c .top-links { justify-content: center; }
.home-i .top-links a, .home-k .top-links a, .read-d .top-links a { border: 1px solid var(--line); border-radius: 5px; padding: 4px 7px; }
.home-r .top-inner, .read-m .top-inner { flex-direction: row-reverse; }

.opening { margin-block: 24px 20px; }
.opening > *, .sequence > *, .map-grid > *, .editor-picks > * { min-width: 0; }
.opening-copy { min-width: 0; }
.kicker { font: 800 12px/1.4 system-ui, sans-serif; color: var(--accent); letter-spacing: .09em; margin-bottom: 9px; }
.opening h1 { font-size: clamp(30px,5.1vw,61px); line-height: 1.14; max-width: 22ch; letter-spacing: -.035em; }
.opening-lead { color: var(--muted); font-size: clamp(15px,1.8vw,18px); max-width: 47ch; margin: 12px 0 15px; }
.jump { display: inline-flex; align-items: center; min-height: 32px; border-bottom: 2px solid var(--accent); font-size: 13px; font-weight: 780; text-decoration: none; }
.page-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.action { display: inline-flex; align-items: center; width: fit-content; min-height: 44px; padding: 6px 13px; border: 1px solid var(--accent); border-radius: var(--radius); background: var(--panel); font-size: 14px; font-weight: 750; text-decoration: none; }
.action-quiet { background: transparent; border-color: var(--line); }
.action:hover, .topic-details summary:hover { text-decoration: underline; }
.direct-answer { margin-block: 16px; padding: 12px 15px; border-inline-start: 3px solid var(--accent); background: var(--panel); }
.direct-answer h2 { font-size: clamp(18px,2.2vw,23px); }
.direct-answer p { margin-top: 4px; }
.topic-details summary { width: fit-content; padding-block: 8px; min-height: 44px; font-size: 14px; text-decoration: underline; }
.cover { overflow: hidden; min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.cover picture, .cover img { display: block; width: 100%; }
.cover img { aspect-ratio: 3/2; height: auto; object-fit: cover; }
.opening-s, .opening-r, .opening-i, .opening-p, .opening-k {
  display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(14px,2.7vw,32px); align-items: center;
}
.opening-s { grid-template-columns: minmax(0,1fr) minmax(0,1.18fr); padding-block: 8px; }
.opening-r { grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); }
.opening-r .cover { border-radius: var(--radius) 2px var(--radius) 2px; }
.opening-w { display: flex; flex-direction: column; gap: 14px; }
.opening-w .cover img { aspect-ratio: 2.65; }
.opening-w h1 { max-width: 28ch; }
.opening-f { display: grid; align-items: end; min-height: 360px; overflow: hidden; border-radius: var(--radius); }
.opening-f .cover, .opening-f .cover-caption { grid-area: 1/1; }
.opening-f .cover { align-self: stretch; }
.opening-f .cover img { height: 100%; max-height: 430px; min-height: 360px; }
.cover-caption { align-self: end; margin: 16px; padding: 15px 18px; background: var(--paper); border-top: 3px solid var(--accent); max-width: min(92%,570px); }
.cover-caption h1 { font-size: clamp(25px,4.15vw,48px); }
.opening-i { grid-template-columns: minmax(0,1.12fr) minmax(0,.88fr); border-block: 1px solid var(--line); padding-block: 16px; }
.opening-i .cover { box-shadow: 5px 5px 0 var(--line); }
.opening-nav { display: flex; flex-wrap: wrap; gap: 8px 12px; padding-top: 9px; }
.opening-nav a { font-size: 13px; color: var(--accent); }
.opening-e { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.9fr) minmax(0,.46fr); gap: 13px; align-items: center; }
.opening-e h1 { font-size: clamp(27px,4.6vw,53px); }
.opening-e aside { border-left: 2px solid var(--accent); }
.topic-rail { display: grid; gap: 6px; list-style: none; margin: 0; padding: 8px 10px; font-size: 13px; }
.topic-rail li { padding: 4px 0; border-bottom: 1px solid var(--line); }
.opening-c { text-align: center; border-bottom: 1px solid var(--line); padding-bottom: 14px; }
.opening-c .opening-lead, .opening-c h1 { margin-inline: auto; }
.center-picture { width: min(100%,700px); margin: 14px auto 0; }
.center-picture .cover img { aspect-ratio: 2.2; }
.opening-p { align-items: stretch; border: 1px solid var(--line); background: var(--panel); }
.opening-p > header { display: grid; align-items: center; padding: clamp(12px,2vw,24px); }
.folio-picture { border-left: 1px solid var(--line); padding: 10px; }
.folio-picture .cover img { aspect-ratio: 1.9; }
.folio-picture .topic-rail { grid-template-columns: repeat(3,minmax(0,1fr)); }
.opening-k { gap: 8px 15px; padding: 13px; border: 1px solid var(--line); border-top: 3px solid var(--accent); background: var(--panel); }
.opening-k footer { grid-column: 1/-1; border-top: 1px solid var(--line); }
.opening-k .cover img { aspect-ratio: 2; }

.sequence { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; align-items: start; margin: 0 0 24px; }
.unit { padding: clamp(12px,1.6vw,20px); border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.unit h2 { font-size: clamp(18px,2.6vw,25px); line-height: 1.22; margin-bottom: 9px; }
.unit h3 { font-size: 16px; line-height: 1.34; }
.unit p, .unit dd, .unit li { color: var(--muted); font-size: 14px; }
.unit p { margin-top: 6px; }
.unit-a, .unit-g, .unit-j, .unit-l, .unit-o { grid-column: 1/-1; }
.taxonomy { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; list-style: none; margin: 0; padding: 0; }
.taxonomy li { display: grid; grid-template-columns: auto 1fr; gap: 6px; align-items: start; padding: 9px 8px; border-top: 2px solid var(--accent); }
.taxonomy li > span, .track li > span { color: var(--accent); font-weight: 790; }
table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 14px; }
th, td { text-align: left; vertical-align: top; padding: 8px; border-bottom: 1px solid var(--line); }
thead th { color: var(--accent); }
th:first-child { width: 39%; }
.definitions div, .source-fields div { display: grid; grid-template-columns: minmax(70px, .65fr) minmax(0,1fr); gap: 6px; border-bottom: 1px solid var(--line); padding: 6px 0; }
dt { font-weight: 750; font-size: 14px; }
.unit-e { border-left: 3px solid var(--accent); border-radius: 0 var(--radius) var(--radius) 0; }
.source-fields { margin-top: 8px; }
.unit-f details, .unit-q details { padding: 7px 0; border-bottom: 1px solid var(--line); }
summary { cursor: pointer; }
.unit-f summary, .unit-q summary { font-weight: 740; font-size: 14px; }
.exhibit-grid { display: grid; grid-template-columns: minmax(0,1.25fr) repeat(2,minmax(0,1fr)); gap: 9px; }
.exhibit-card { background: var(--paper); min-width: 0; padding: 9px; border-bottom: 3px solid var(--accent); }
.exhibit-no { font-size: 30px; line-height: 1.2; font-weight: 820; color: var(--accent); }
.exhibit-card figcaption span, .editor-picks li span { display: block; color: var(--muted); font-size: 13px; }
.checklist, .contents-list, .track, .editor-picks ul { margin: 0; padding: 0; }
.checklist { list-style: none; }
.checklist label { min-height: 38px; display: grid; grid-template-columns: 20px minmax(0,1fr); gap: 7px; align-items: start; padding: 5px 0; cursor: pointer; }
.checklist input { margin: 3px 0 0 1px; accent-color: var(--accent); width: 16px; height: 16px; }
.contents-list { padding-left: 22px; }
.contents-list li { margin-block: 5px; }
.map-grid { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(0,.7fr); gap: 14px; }
.map-grid aside { padding: 9px 11px; border-left: 2px solid var(--accent); align-self: center; }
.diagram { width: 100%; height: auto; }
figcaption { color: var(--muted); font-size: 13px; margin-top: 5px; }
.case-example { padding: 8px 11px 10px; border: 1px dashed var(--accent); background: var(--paper); }
.case-example .kicker { color: var(--accent); }
.case-example footer { border-top: 1px solid var(--line); margin-top: 9px; padding-top: 5px; color: var(--muted); font-size: 13px; }
.prose { max-width: 67ch; }
.prose p { font-size: 16px; line-height: 1.7; }
.track { display: grid; gap: 7px; list-style: none; }
.track li { display: grid; grid-template-columns: 28px 1fr; border-left: 1px solid var(--accent); padding: 5px 8px; }
.editor-picks { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: 10px; }
.editor-picks article { background: var(--paper); padding: 10px; border-top: 2px solid var(--accent); }
.editor-picks ul { list-style: none; }
.editor-picks li { padding: 4px 0; border-bottom: 1px solid var(--line); }
.platform-grid, .boundary-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.platform-grid article { padding: 12px; border: 1px solid var(--line); background: var(--paper); }
.boundary-grid > div { border-top: 1px solid var(--line); padding-top: 6px; }
.unit-q ol { padding-left: 18px; }
.home-r .unit-m, .home-w .unit-m { grid-column: 1/-1; }
.home-r .track, .home-w .track { grid-template-columns: repeat(3,minmax(0,1fr)); }
.home-i .unit-i, .home-k .unit-d { border-top: 3px solid var(--accent); }
.home-f .unit, .read-l .unit { border-width: 1px 0 0; border-radius: 0; padding-inline: 0; background: transparent; }
.home-f .sequence { gap: 20px 28px; }
.home-p .unit { border-radius: 2px; }
.home-k .sequence { gap: 1px; border: 1px solid var(--line); background: var(--line); }
.home-k .unit { border: 0; border-radius: 0; background: var(--paper); }
.home-k .unit-d { border-top: 3px solid var(--accent); }
.home-w .unit-c, .home-w .unit-m { border-top: 3px solid var(--accent); }
.home-c .unit-g, .home-c .unit-j { background: transparent; border-width: 0 0 1px; padding-inline: 0; }
.home-i .sequence, .read-r .sequence { grid-template-columns: minmax(0,1.34fr) minmax(0,.66fr); }
.home-e .sequence { grid-template-columns: repeat(3,minmax(0,1fr)); }
.home-e .unit:first-child, .home-e .unit-c { grid-column: span 2; }
.home-e .unit-g, .home-e .unit-j, .home-e .unit-o { grid-column: 1/-1; }

.reading .opening h1 { font-size: clamp(27px,4.3vw,52px); }
.reading .opening { padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.article-l .opening-copy { margin-inline: auto; max-width: 760px; }
.longread-image { max-width: 760px; margin: 14px auto 0; }
.longread-image img { aspect-ratio: 2.7; }
.read-l .sequence { max-width: 760px; grid-template-columns: 1fr; margin-inline: auto; }
.article-g, .article-d, .article-s, .article-m, .article-r, .article-c { display: grid; grid-template-columns: minmax(0,1.12fr) minmax(0,.88fr); align-items: center; gap: 18px; }
.opening-diagram { padding: 6px; border: 1px solid var(--line); border-radius: 7px; margin-top: 7px; }
.opening-diagram img { max-height: 180px; object-fit: contain; }
.image-brief .cover img { aspect-ratio: 2; }
.article-d .topic-rail { border: 1px solid var(--line); background: var(--panel); padding: 10px 14px; }
.article-s nav { border-left: 2px solid var(--accent); padding-left: 5px; }
.article-s nav ol { margin: 0; padding-left: 26px; }
.article-s nav li { padding: 4px 0; }
.article-m .cover { border: 5px double var(--line); }
.article-m .cover img { aspect-ratio: 1.95; }
.article-m .opening-note { margin-top: 10px; }
.article-r { grid-template-columns: minmax(0,1.55fr) minmax(0,.45fr); }
.opening-note { padding: 9px 12px; border-left: 3px solid var(--accent); background: var(--panel); font-size: 14px; }
.opening-note p { margin-top: 4px; color: var(--muted); }
.article-n { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.75fr); gap: 11px; }
.notebook-title { grid-row: span 2; border-left: 3px double var(--accent); padding-left: 13px; }
.article-f { padding: 14px 16px; border: 1px solid var(--line); background: var(--panel); }
.question-list .topic-rail { padding-inline: 0; grid-template-columns: repeat(3,minmax(0,1fr)); }
.question-list .opening-diagram { max-width: 470px; }
.case-rail { border: 1px dashed var(--accent); padding: 7px; }
.read-s .unit-m, .read-f .unit-f { grid-column: 1/-1; border-left: 3px solid var(--accent); }
.read-n .unit { border-radius: 0; border-width: 0 0 1px; }
.read-m .unit-e, .read-m .unit-p { background: transparent; }
.site-footer { border-top: 1px solid var(--line); padding-block: 12px; color: var(--muted); font-size: 13px; }
.site-footer .wrap { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.site-footer nav { display: flex; flex-wrap: wrap; gap: 7px 15px; }
.site-filing { flex: 1 0 100%; text-align: center; }
.breadcrumbs { color: var(--muted); font-size: 13px; padding-top: 12px; }
.related, .guide-text, .service { padding-block: 15px 25px; }
.related { border-top: 1px solid var(--line); }
.related p { margin-top: 5px; color: var(--muted); }
.reading-picks { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,225px),1fr)); gap: 8px; margin: 6px 0 0; padding: 0; list-style: none; }
.reading-picks li, .neighbor { min-width: 0; padding: 9px 13px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.reading-picks .reading-label { font-size: 13px; margin: 0 0 3px; }
.reading-picks a { display: block; font-weight: 740; }
.guide-text { width: min(100%,820px); margin-inline: auto; }
.guide-text section, .service section, .service .entry { margin-top: 18px; }
.guide-text h2, .service h2, .related h2 { font-size: clamp(19px,2.5vw,24px); margin-bottom: 6px; }
.guide-text section p, .service section p { color: var(--muted); margin-top: 6px; }
.guide-byline { color: var(--muted); font-size: 13px; }
.guide-sources { margin-top: 19px; padding-top: 11px; border-top: 1px solid var(--line); }
.guide-sources span { display: block; color: var(--muted); font-size: 14px; }
.service { max-width: 850px; }
.service h1 { font-size: clamp(26px,5vw,47px); margin-top: 10px; line-height: 1.16; }
.service .entry { padding: 13px 16px; border: 1px solid var(--line); background: var(--panel); }
.entry .action, .article-toc, .workbook-body, .article-neighbors { margin-top: 12px; }
.article-toc summary { font-weight: 740; width: fit-content; min-height: 44px; padding-block: 8px; }
.article-toc ol { margin-block: 0 10px; padding-inline-start: 24px; }
.workbook-body h2 { display: inline; }
.workbook-body h2:target { outline: 2px solid var(--accent); outline-offset: 3px; }
.article-neighbors { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,255px),1fr)); gap: 8px; }
.neighbor { display: grid; gap: 3px; overflow-wrap: anywhere; }
.neighbor strong { font-size: 13px; }

@media (max-width: 690px) {
  .wrap { width: calc(100% - 28px); }
  .top-inner, .home-f .top-inner, .home-c .top-inner { justify-content: space-between; flex-wrap: nowrap; gap: 8px; min-height: 51px; }
  .home-r .top-inner, .read-m .top-inner { flex-direction: row; }
  .top-links { display: none; }
  .menu { display: block; flex: 0 0 auto; position: relative; z-index: 2; }
  .menu summary { padding: 4px 8px; border: 1px solid var(--line); border-radius: 5px; font-size: 14px; }
  .menu nav { position: absolute; right: 0; top: 100%; width: 143px; background: var(--paper); border: 1px solid var(--line); border-radius: 5px; padding: 6px; }
  .menu nav a { display: block; padding: 5px; font-size: 14px; }
  .opening { margin-block: 15px; }
  .opening h1, .opening-e h1, .reading .opening h1 { font-size: clamp(25px,7vw,40px); }
  .opening-s, .opening-r, .opening-i, .opening-e, .opening-p, .opening-k,
  .article-g, .article-d, .article-s, .article-m, .article-r, .article-n, .article-c { grid-template-columns: minmax(0,1fr); gap: 9px; }
  .opening-w, .opening-c { gap: 7px; }
  .opening-r .cover, .article-m .cover { order: 1; }
  .opening-w .cover img, .cover img, .opening-f .cover img { max-height: 190px; min-height: 0; }
  .opening-f { display: block; min-height: 0; }
  .cover-caption { margin: 0; padding: 10px 0 0; max-width: none; border: 0; }
  .opening-lead { margin-block: 7px 9px; }
  .folio-picture { border-left: 0; border-top: 1px solid var(--line); }
  .opening-e aside { border-left: 0; border-top: 1px solid var(--line); }
  .sequence, .taxonomy, .exhibit-grid, .map-grid, .editor-picks,
  .home-r .track, .home-w .track, .home-e .sequence, .home-i .sequence, .read-r .sequence { grid-template-columns: minmax(0,1fr); }
  .home-e .unit:first-child, .home-e .unit-c { grid-column: 1/-1; }
  .sequence { gap: 9px; }
  .unit { padding: 11px; }
  .unit h2 { font-size: 19px; }
  .map-grid aside { align-self: auto; }
  .question-list .topic-rail, .folio-picture .topic-rail { grid-template-columns: minmax(0,1fr); }
  .notebook-title { grid-row: auto; }
}