/* ============ 航空理论知识站 · 站点样式 ============
   设计语言沿用图解页 tokens.css：机场指示牌 · 信号黄 · 工业印刷
   paper: oklch(15% 0.012 100) · accent: oklch(87% 0.17 95) */

:root {
  --color-paper: oklch(15% 0.012 100);
  --color-surface: oklch(19% 0.012 100);
  --color-ink: oklch(92% 0.02 95);
  --color-muted: oklch(70% 0.02 95);
  --color-faint: oklch(52% 0.02 95);
  --color-accent: oklch(87% 0.17 95);
  --color-accent-dim: oklch(62% 0.12 95);
  --color-rule: oklch(38% 0.01 100);
  --font-display: SimHei, "Microsoft YaHei", sans-serif;
  --font-body: "Microsoft YaHei", "PingFang SC", sans-serif;
  --font-mono: Consolas, "Courier New", monospace;
  --space-sm: .5rem;
  --space-md: 1rem;
  --space-lg: 2rem;
  --ease-out: cubic-bezier(.25, .8, .3, 1);
  --ease-spring: cubic-bezier(.22, 1.15, .36, 1);
}

html, body { margin: 0; }
body {
  background: var(--color-paper);
  color: var(--color-ink);
  font-family: var(--font-body);
  line-height: 1.65;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
body.locked { overflow: hidden; }

/* ---------- 顶栏 ---------- */
.topbar {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-lg);
  padding: var(--space-lg) clamp(1rem, 4vw, 3rem) var(--space-md);
  border-bottom: 3px double var(--color-rule);
}
.wordmark {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 1.6rem;
  letter-spacing: .06em;
  margin: 0;
}
.wordmark small {
  font-family: var(--font-mono);
  font-size: .5em;
  color: var(--color-faint);
  letter-spacing: .14em;
  margin-left: .8em;
}
.topnav {
  display: flex;
  gap: var(--space-lg);
  list-style: none;
  margin: 0;
  padding: 0;
  font-family: var(--font-mono);
  font-size: .95rem;
}
.topnav a {
  color: var(--color-muted);
  text-decoration: none;
  letter-spacing: .08em;
  position: relative;
  padding-bottom: .25em;
  transition: color .25s;
}
.topnav a::after {
  content: "";
  position: absolute;
  left: 0; right: 100%;
  bottom: 0;
  height: 2px;
  background: var(--color-accent);
  transition: right .3s var(--ease-out);
}
.topnav a:hover, .topnav a[aria-current] { color: var(--color-accent); }
.topnav a:hover::after, .topnav a[aria-current]::after { right: 0; }
.topnav .no { color: var(--color-faint); margin-right: .4em; }

/* ---------- 主页全屏场景 ---------- */
body.index-page { overflow: hidden; }
.index-page .topbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 40;
  padding: .75rem 1.5rem;
  background: oklch(13% 0.01 100 / .55);
  backdrop-filter: blur(14px) saturate(1.15);
  -webkit-backdrop-filter: blur(14px) saturate(1.15);
  border-bottom: 1px solid oklch(38% 0.01 100 / .6);
  animation: drop-in .8s var(--ease-out) both;
}
.index-page .wordmark { font-size: 1.25rem; }

.scene-full { position: fixed; inset: 0; }
.scene-svg {
  width: 100%;
  height: 100%;
  display: block;
  user-select: none;
  -webkit-user-select: none;
}
.scene-svg:focus-visible { outline: none; }

/* 视差与镜头 */
.parallax { transition: transform .35s ease-out; will-change: transform; }
.camera {
  transform-box: view-box;
  transition: transform .65s var(--ease-out);
  will-change: transform;
}

.scene-credit {
  position: fixed;
  bottom: .9rem;
  left: 1.2rem;
  z-index: 5;
  font-family: var(--font-mono);
  font-size: .7rem;
  color: var(--color-faint);
  letter-spacing: .08em;
  pointer-events: none;
}
.scene-credit-right { left: auto; right: 1.2rem; }

/* ---------- 场景热点 ---------- */
.hotspot { cursor: pointer; transition: opacity .35s ease; }
/* 悬停/联动任一热点时，其余热点退为暗场，聚焦当前 */
.camera:has(.hotspot:hover) .hotspot:not(:hover),
.camera:has(.hotspot:focus-visible) .hotspot:not(:focus-visible),
.camera:has(.hotspot.peer-hover) .hotspot:not(.peer-hover) { opacity: .38; }
.hotspot .shape { transition: stroke .3s, filter .3s; }
.hotspot:hover .shape, .hotspot:focus-visible .shape, .hotspot.peer-hover .shape {
  stroke: var(--color-accent);
  filter: drop-shadow(0 0 8px oklch(87% 0.17 95 / .5));
}
.hotspot:focus-visible { outline: none; }
.hotspot .lift { transition: transform .4s var(--ease-out); }
.hotspot:hover .lift, .hotspot:focus-visible .lift, .hotspot.peer-hover .lift { transform: translateY(-7px); }
.hotspot .hot-tag {
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .25s ease, transform .3s var(--ease-out);
  pointer-events: none;
  filter: drop-shadow(0 6px 14px oklch(0% 0 0 / .55));
}
.hotspot:hover .hot-tag, .hotspot:focus-visible .hot-tag, .hotspot.peer-hover .hot-tag {
  opacity: 1;
  transform: translateY(0);
}
.hot-tag rect { rx: 6px; stroke-width: 1.2; transition: stroke .25s; }
.hotspot:hover .hot-tag rect, .hotspot.peer-hover .hot-tag rect { stroke: var(--color-accent); }
.hot-tag text {
  font-family: var(--font-mono);
  font-size: 13px;
  fill: var(--color-accent);
  letter-spacing: .06em;
}
.hint-ring {
  fill: none;
  stroke: var(--color-accent);
  stroke-width: 1.5;
  stroke-dasharray: 10 7;
  opacity: 0;
  transition: opacity .3s ease;
  animation: dash-march 24s linear infinite;
  pointer-events: none;
}
.hotspot:hover .hint-ring,
.hotspot:focus-visible .hint-ring,
.hotspot.peer-hover .hint-ring { opacity: .85; }
@keyframes dash-march { to { stroke-dashoffset: -340; } }

/* 图面标注 */
.svg-label {
  font-family: var(--font-mono);
  font-size: 13px;
  fill: var(--color-faint);
  letter-spacing: .08em;
}
.svg-label-sm {
  font-family: var(--font-mono);
  font-size: 10px;
  fill: var(--color-faint);
  letter-spacing: .08em;
}
.rwy-num {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 34px;
  fill: var(--color-ink);
  letter-spacing: .1em;
}

/* ---------- 场景动效 ---------- */
/* 跑道边灯/警戒灯/引导车灯：常亮，不再顺序闪烁 */
.rw-light {
  fill: oklch(93% 0.02 95);
}
.rw-light-amber {
  fill: var(--color-accent);
}

.beacon-g { fill: oklch(75% 0.2 150); animation: b-g 4s linear infinite; }
.beacon-w { fill: var(--color-ink);       animation: b-w 4s linear infinite; }
@keyframes b-g {
  0%, 44% { opacity: 1; }
  45%, 94% { opacity: 0; }
  95%, 100% { opacity: 1; }
}
@keyframes b-w {
  0%, 44% { opacity: 0; }
  45%, 50% { opacity: 1; }
  51%, 94% { opacity: 0; }
  95%, 100% { opacity: 0; }
}

.windsock-left {
  transform-box: fill-box;
  transform-origin: 100% 50%;
  animation: sway 3.4s ease-in-out infinite alternate;
}
@keyframes sway {
  from { transform: rotate(-7deg); }
  to   { transform: rotate(9deg); }
}

.cloud { animation: drift 46s ease-in-out infinite alternate; }
.cloud.c2 { animation-duration: 38s; animation-delay: -12s; }
.cloud.c3 { animation-duration: 55s; animation-delay: -25s; }
.cloud.c4 { animation-duration: 42s; animation-delay: -30s; }
@keyframes drift {
  from { transform: translateX(-12px); }
  to   { transform: translateX(12px); }
}

.float { animation: float 7s ease-in-out infinite alternate; }
@keyframes float {
  from { transform: translateY(-5px); }
  to   { transform: translateY(5px); }
}

.star { fill: #e8e2c8; opacity: .5; animation: twinkle 4.5s ease-in-out infinite; }
.star2 { animation-duration: 6.5s; animation-delay: -2.2s; }
@keyframes twinkle {
  0%, 100% { opacity: .25; }
  50% { opacity: .75; }
}

.blink-red   { fill: #ff6b5e; animation: blink 1.2s ease-in-out infinite; }
.blink-green { fill: #7dff9e; animation: blink 1.2s ease-in-out infinite; animation-delay: .15s; }
.blink-white { fill: #f5f0dc; animation: blink 1.4s ease-in-out infinite; }
@keyframes blink { 50% { opacity: .12; } }

.radar-spin {
  transform-box: fill-box;
  transform-origin: 50% 50%;
  animation: spin 7s linear infinite;
}
.cup-spin {
  transform-box: fill-box;
  transform-origin: 50% 50%;
  animation: spin 1.6s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* 滑行道灯光：中线绿 / 边灯蓝 */
.twy-green { fill: #4fe08a; filter: drop-shadow(0 0 3px oklch(80% 0.19 155 / .8)); }
.twy-blue { fill: #4d84ff; filter: drop-shadow(0 0 3px oklch(62% 0.18 265 / .8)); }
/* 跑道中线灯：白段 / 红段 */
.cl-w { fill: #f2edda; filter: drop-shadow(0 0 2.5px oklch(93% 0.02 95 / .8)); }
.cl-r { fill: #ff5a4a; filter: drop-shadow(0 0 2.5px oklch(62% 0.2 30 / .85)); }
/* 接地区灯带（白） */
.tdzl { fill: #f2edda; opacity: .9; filter: drop-shadow(0 0 2px oklch(93% 0.02 95 / .7)); }
/* PAPI：白 / 红 */
.papi-w { fill: #f2edda; filter: drop-shadow(0 0 3px oklch(93% 0.02 95 / .9)); }
.papi-r { fill: #ff5a4a; filter: drop-shadow(0 0 3px oklch(62% 0.2 30 / .9)); }
/* 流星 */
.meteor { opacity: 0; animation: meteor 11s linear infinite; }
@keyframes meteor {
  0%, 90% { opacity: 0; }
  91.5% { opacity: .85; }
  95%, 100% { opacity: 0; }
}

.sign-glow { animation: signpulse 3.2s ease-in-out infinite; }
@keyframes signpulse { 0%, 100% { opacity: 1; } 50% { opacity: .6; } }
.hot-tag-label {
  font-family: var(--font-mono);
  font-size: 13px;
  letter-spacing: .08em;
}

/* ---------- 模块面板 ---------- */
.panel-backdrop {
  position: fixed;
  inset: 0;
  background: oklch(8% 0.01 100 / .72);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  z-index: 50;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease, visibility 0s linear .3s;
}
.panel-backdrop.open {
  opacity: 1;
  visibility: visible;
  transition: opacity .3s ease;
}
.panel {
  background: var(--color-surface);
  border: 1px solid var(--color-rule);
  border-radius: 14px;
  box-shadow: 0 30px 80px oklch(0% 0 0 / .6), inset 0 1px 0 oklch(92% 0.02 95 / .06);
  max-width: 920px;
  width: 100%;
  max-height: 88vh;
  overflow: auto;
  opacity: 0;
  transform: translateY(26px) scale(.96);
  transition: transform .45s var(--ease-spring), opacity .3s ease;
}
.panel-backdrop.open .panel {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.4rem;
  border-bottom: 1px solid var(--color-rule);
  position: sticky;
  top: 0;
  background: oklch(19% 0.012 100 / .92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  z-index: 1;
  border-radius: 14px 14px 0 0;
}
.panel-head-main { display: flex; align-items: center; gap: 1rem; min-width: 0; }
.panel-tag {
  font-family: var(--font-mono);
  font-weight: 700;
  color: #141410;
  background: var(--color-accent);
  border-radius: 6px;
  padding: .35rem .6rem;
  letter-spacing: .08em;
  font-size: .85rem;
  flex: none;
  box-shadow: 0 0 18px oklch(87% 0.17 95 / .35);
}
.panel-title {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 1.35rem;
  letter-spacing: .04em;
  line-height: 1.3;
  margin: 0;
}
.panel-desc { color: var(--color-muted); font-size: .82rem; margin: .15rem 0 0; }
.panel-close {
  background: none;
  border: 1px solid var(--color-rule);
  border-radius: 999px;
  color: var(--color-muted);
  font-family: var(--font-mono);
  font-size: .85rem;
  cursor: pointer;
  padding: .3rem .9rem;
  white-space: nowrap;
  flex: none;
  transition: color .25s, background .25s, border-color .25s;
}
.panel-close:hover { color: #141410; background: var(--color-accent); border-color: var(--color-accent); }
.panel-body { padding: 1.2rem; }
.panel-foot {
  padding: .6rem 1.2rem;
  border-top: 1px solid var(--color-rule);
  font-family: var(--font-mono);
  font-size: .75rem;
  color: var(--color-faint);
  letter-spacing: .06em;
}

/* 面板内的部位示意 */
.detail-svg {
  background: var(--color-paper);
  border: 1px solid var(--color-rule);
  margin-bottom: var(--space-md);
}
.detail-svg svg { width: 100%; height: auto; display: block; }
.zone {
  fill: none;
  stroke: var(--color-rule);
  stroke-width: 1.5;
  stroke-dasharray: 6 5;
  transition: stroke .25s;
  pointer-events: none;
}
.hotspot:hover .zone, .hotspot:focus-visible .zone { stroke: var(--color-accent-dim); }
.zone-label {
  font-family: var(--font-mono);
  font-size: 12px;
  fill: var(--color-faint);
  letter-spacing: .05em;
  pointer-events: none;
}

/* 条目列表 */
.entry-list { display: grid; gap: .8rem; }
.entry {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: .9rem 1.1rem;
  border: 1px solid var(--color-rule);
  border-radius: 10px;
  background: var(--color-paper);
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  width: 100%;
  transition: border-color .25s, background .25s, transform .3s var(--ease-out);
}
.entry:hover, .entry:focus-visible {
  border-color: var(--color-accent-dim);
  background: oklch(22% 0.015 100);
  transform: translateX(4px);
}
.entry:hover .en-go { color: var(--color-accent); }
.entry:focus-visible { outline: none; }
.en-name { font-family: var(--font-display); font-size: 1.05rem; white-space: nowrap; }
.en-desc { color: var(--color-muted); font-size: .8rem; flex: 1; margin: 0 .8rem; }
.en-go {
  font-family: var(--font-mono);
  color: var(--color-accent-dim);
  font-size: .8rem;
  white-space: nowrap;
}

/* 卡片网格（气象面板 / 知识库） */
.card-grid, .kb-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1rem;
}
.thumb-card {
  background: var(--color-paper);
  border: 1px solid var(--color-rule);
  border-radius: 10px;
  overflow: hidden;
  cursor: pointer;
  text-align: left;
  padding: 0;
  color: inherit;
  font: inherit;
  display: flex;
  flex-direction: column;
  transition: transform .3s var(--ease-out), border-color .25s, filter .3s;
}
.thumb-card img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  object-position: top;
  border-bottom: 1px solid var(--color-rule);
  display: block;
  background: var(--color-surface);
  transition: transform .5s var(--ease-out);
}
.thumb-card:hover img, .thumb-card:focus-visible img { transform: scale(1.04); }
.thumb-card .tc-body { padding: .7rem .9rem; }
.thumb-card .tc-name { font-family: var(--font-display); font-size: .95rem; }
.thumb-card .tc-desc { color: var(--color-muted); font-size: .78rem; margin-top: .1rem; }
.thumb-card:hover, .thumb-card:focus-visible {
  border-color: var(--color-accent);
  transform: translateY(-3px);
  filter: drop-shadow(0 6px 14px oklch(0% 0 0 / .5));
}
.thumb-card:focus-visible { outline: none; }

/* ---------- 知识点查看器 ---------- */
.viewer {
  position: fixed;
  inset: 0;
  background: var(--color-paper);
  z-index: 60;
  display: flex;
  flex-direction: column;
  transform: translateY(100%);
  visibility: hidden;
  transition: transform .5s var(--ease-out), visibility 0s linear .5s;
}
.viewer.open {
  transform: translateY(0);
  visibility: visible;
  transition: transform .5s var(--ease-out);
}
.viewer-bar {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: .6rem 1.2rem;
  border-bottom: 3px double var(--color-rule);
  background: var(--color-paper);
}
.viewer-title { font-family: var(--font-display); font-size: 1.1rem; flex: 1; }
.viewer-hint {
  font-family: var(--font-mono);
  font-size: .72rem;
  color: var(--color-faint);
  letter-spacing: .05em;
}
.btn {
  background: none;
  border: 1px solid var(--color-rule);
  color: var(--color-muted);
  font-family: var(--font-mono);
  font-size: .85rem;
  padding: .25rem .7rem;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
}
.btn:hover { color: var(--color-accent); border-color: var(--color-accent-dim); }
.viewer-frame { flex: 1; width: 100%; border: 0; background: var(--color-paper); }

/* ---------- 知识库页 ---------- */
main {
  flex: 1;
  width: 100%;
  max-width: 76rem;
  margin-inline: auto;
  padding: var(--space-lg) clamp(1rem, 4vw, 3rem);
  box-sizing: border-box;
}
.kb-intro { color: var(--color-muted); font-size: .9rem; margin: 0 0 var(--space-lg); }
.kb-section { margin-bottom: var(--space-lg); }
.kb-title {
  font-family: var(--font-mono);
  font-size: .85rem;
  font-weight: 400;
  color: var(--color-accent-dim);
  letter-spacing: .12em;
  border-bottom: 1px solid var(--color-rule);
  padding-bottom: .4rem;
  margin: 0;
}
.kb-grid { margin-top: .9rem; }

/* ---------- 页脚 ---------- */
.site-foot {
  border-top: 1px solid var(--color-rule);
  padding: 1rem clamp(1rem, 4vw, 3rem);
  font-family: var(--font-mono);
  font-size: .72rem;
  color: var(--color-faint);
  letter-spacing: .06em;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .5rem;
}

/* ---------- 场景热点标记（常显脉冲编号牌） ---------- */
.hot-marker { pointer-events: none; }
.hm-ring {
  fill: none;
  stroke: var(--color-accent);
  stroke-width: 1.5;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: hm-pulse 2.8s ease-out infinite;
}
@keyframes hm-pulse {
  0% { transform: scale(.5); opacity: .8; }
  70%, 100% { transform: scale(1.45); opacity: 0; }
}
.hm-box {
  fill: oklch(13% 0.01 100 / .85);
  stroke: var(--color-accent-dim);
  stroke-width: 1.2;
  transition: fill .25s, stroke .25s;
}
.hm-num {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
  fill: var(--color-accent);
}
.hotspot:hover .hm-box, .hotspot:focus-visible .hm-box, .hotspot.peer-hover .hm-box {
  fill: var(--color-accent);
  stroke: var(--color-accent);
}
.hotspot:hover .hm-num, .hotspot:focus-visible .hm-num, .hotspot.peer-hover .hm-num { fill: #141410; }

/* ---------- 入场动效 ---------- */
@keyframes drop-in { from { transform: translateY(-100%); opacity: 0; } }
.scene-svg { animation: scene-in 1.1s ease-out both; }
@keyframes scene-in { from { opacity: 0; } }

/* ---------- 文档查询页 ---------- */
.doc-layout {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: var(--space-lg);
  flex: 1;
  width: 100%;
  max-width: 90rem;
  margin-inline: auto;
  padding: var(--space-lg) clamp(1rem, 4vw, 3rem);
  box-sizing: border-box;
  align-items: start;
}
.doc-side { min-width: 0; }
.doc-side-inner {
  position: sticky;
  top: 1rem;
  max-height: calc(100vh - 2rem);
  overflow: auto;
  padding-right: .4rem;
}
.doc-part { margin-bottom: 1.2rem; }
.doc-part-title {
  font-family: var(--font-mono);
  font-size: .78rem;
  color: var(--color-accent-dim);
  letter-spacing: .14em;
  margin-bottom: .45rem;
}
.doc-chap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .6rem;
  width: 100%;
  background: none;
  border: 1px solid transparent;
  border-radius: 8px;
  color: var(--color-muted);
  font: inherit;
  font-size: .88rem;
  text-align: left;
  cursor: pointer;
  padding: .42rem .7rem;
  transition: background .25s, color .25s, border-color .25s, transform .25s var(--ease-out);
}
.doc-chap:hover { color: var(--color-ink); background: oklch(22% 0.015 100); transform: translateX(3px); }
.doc-chap[aria-current] {
  color: var(--color-accent);
  background: oklch(22% 0.015 100);
  border-color: var(--color-rule);
}
.doc-chap-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.doc-chap-count {
  font-family: var(--font-mono);
  font-size: .72rem;
  color: var(--color-faint);
  background: var(--color-surface);
  border: 1px solid var(--color-rule);
  border-radius: 999px;
  padding: .05rem .5rem;
  flex: none;
}
.doc-chap[aria-current] .doc-chap-count { color: #141410; background: var(--color-accent); border-color: var(--color-accent); }

.doc-main { min-width: 0; }
.doc-search {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: var(--space-md);
}
.doc-search input {
  flex: 1;
  min-width: 0;
  background: var(--color-surface);
  border: 1px solid var(--color-rule);
  border-radius: 10px;
  color: var(--color-ink);
  font: inherit;
  font-size: .95rem;
  padding: .7rem 1rem;
  letter-spacing: .03em;
  transition: border-color .25s, box-shadow .25s;
}
.doc-search input::placeholder { color: var(--color-faint); }
.doc-search input:focus {
  outline: none;
  border-color: var(--color-accent-dim);
  box-shadow: 0 0 0 3px oklch(87% 0.17 95 / .12);
}
.doc-count {
  font-family: var(--font-mono);
  font-size: .78rem;
  color: var(--color-faint);
  white-space: nowrap;
  flex: none;
}

.doc-head {
  display: flex;
  align-items: baseline;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: .8rem;
}
.doc-tag-big {
  font-family: var(--font-display);
  font-size: 1.15rem;
  color: #141410;
  background: var(--color-accent);
  border-radius: 8px;
  padding: .3rem .7rem;
  letter-spacing: .05em;
}
.doc-head-meta { color: var(--color-faint); font-size: .8rem; }

.doc-toc-chips { display: flex; flex-wrap: wrap; gap: .45rem .5rem; margin-bottom: 1.2rem; }
.doc-toc-chip {
  display: inline-flex;
  align-items: baseline;
  gap: .4rem;
  font-family: var(--font-mono);
  font-size: .76rem;
  color: var(--color-muted);
  text-decoration: none;
  border: 1px solid var(--color-rule);
  border-radius: 999px;
  padding: .25rem .7rem;
  transition: color .25s, border-color .25s, background .25s, transform .25s var(--ease-out);
}
.doc-toc-chip-no { font-style: normal; font-size: .64rem; color: var(--color-faint); }
.doc-toc-chip:hover {
  color: #141410;
  background: var(--color-accent);
  border-color: var(--color-accent);
  transform: translateY(-1px);
  z-index: 60; /* 让悬停备注浮层盖过后面几行的标签 */
}
.doc-toc-chip:hover .doc-toc-chip-no { color: #141410; }

.doc-pager {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: .8rem;
  margin: .9rem 0;
}
.doc-page-nums { display: flex; gap: .35rem; }
.doc-page-btn {
  font-family: var(--font-mono);
  font-size: .8rem;
  color: var(--color-muted);
  background: var(--color-surface);
  border: 1px solid var(--color-rule);
  border-radius: 8px;
  padding: .3rem .7rem;
  cursor: pointer;
  transition: color .25s, border-color .25s, background .25s, transform .25s var(--ease-out);
}
.doc-page-btn:hover:not(:disabled) {
  color: #141410;
  background: var(--color-accent);
  border-color: var(--color-accent);
  transform: translateY(-1px);
}
.doc-page-btn.is-cur { color: #141410; background: var(--color-accent); border-color: var(--color-accent); }
.doc-page-btn:disabled { opacity: .35; cursor: default; }
.doc-page-pos { font-family: var(--font-mono); font-size: .78rem; color: var(--color-faint); }
.doc-page-jump {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-family: var(--font-mono);
  font-size: .78rem;
  color: var(--color-faint);
}
.doc-page-input {
  width: 3em;
  background: var(--color-surface);
  border: 1px solid var(--color-rule);
  border-radius: 6px;
  color: var(--color-ink);
  font: inherit;
  padding: .28rem .2rem;
  text-align: center;
  -moz-appearance: textfield;
  appearance: textfield;
}
.doc-page-input::-webkit-outer-spin-button,
.doc-page-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.doc-page-input:focus {
  outline: none;
  border-color: var(--color-accent-dim);
  box-shadow: 0 0 0 3px oklch(87% 0.17 95 / .12);
}

.doc-toc-box {
  background: var(--color-surface);
  border: 1px solid var(--color-rule);
  border-radius: 12px;
  padding: .8rem 1rem;
  margin-bottom: 1.2rem;
}
.doc-toc-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  margin-bottom: .4rem;
}
.doc-toc-bar-title { font-family: var(--font-mono); font-size: .82rem; color: var(--color-faint); }
.doc-toc-toggle { flex: none; }
.doc-toc-box.is-collapsed .doc-toc-groups { display: none; }
.doc-toc-box.is-collapsed .doc-toc-bar { margin-bottom: 0; }
/* 一级主题分组 + 二级节名平铺目录 */
.doc-toc-groups { margin-top: .3rem; }
.doc-toc-group { padding-top: .65rem; border-top: 1px dashed var(--color-rule); }
.doc-toc-group:first-of-type { padding-top: .2rem; border-top: 0; }
.doc-toc-group-name {
  display: flex;
  align-items: baseline;
  gap: .55rem;
  font-family: var(--font-mono);
  font-size: .74rem;
  font-weight: 400;
  color: var(--color-accent);
  letter-spacing: .1em;
  margin: 0 0 .5rem;
}
.doc-toc-group-no { color: var(--color-faint); }
.doc-toc-group-count { color: var(--color-faint); font-size: .66rem; letter-spacing: .02em; margin-left: auto; }
.doc-toc-group .doc-toc-chips { margin-bottom: .1rem; }

.doc-sec {
  background: var(--color-surface);
  border: 1px solid var(--color-rule);
  border-radius: 12px;
  padding: 1.1rem 1.3rem;
  margin-bottom: 1rem;
  scroll-margin-top: 1rem;
}
.doc-sec-title {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 1.05rem;
  margin: 0 0 .7rem;
  display: flex;
  align-items: baseline;
  gap: .6rem;
  flex-wrap: wrap;
}
.doc-tag {
  font-family: var(--font-mono);
  font-size: .68rem;
  font-weight: 700;
  color: var(--color-accent-dim);
  background: oklch(22% 0.015 100);
  border: 1px solid var(--color-accent-dim);
  border-radius: 999px;
  padding: .05rem .55rem;
  letter-spacing: .06em;
  white-space: nowrap;
}
.doc-sec-body { font-size: .92rem; }
.doc-sec-body p { margin: .5rem 0; }
.doc-sec-body h4 {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: .98rem;
  color: var(--color-accent);
  margin: 1.1rem 0 .5rem;
  border-left: 3px solid var(--color-accent-dim);
  padding-left: .6rem;
}
/* ---- 正文折叠阅读（手风琴） ---- */
.doc-fold-bar { display: flex; align-items: center; gap: .8rem; margin: .3rem 0 .7rem; }
.doc-fold-all {
  font-family: var(--font-mono);
  font-size: .74rem;
  color: var(--color-accent);
  background: none;
  border: 1px solid var(--color-accent-dim);
  border-radius: 999px;
  padding: .25rem .8rem;
  cursor: pointer;
  transition: background .2s, color .2s;
}
.doc-fold-all:hover { background: var(--color-accent); color: #141410; border-color: var(--color-accent); }
.doc-fold-hint { font-family: var(--font-mono); font-size: .74rem; color: var(--color-faint); }
.doc-fold {
  border: 1px solid var(--color-rule);
  border-radius: 8px;
  margin-bottom: .55rem;
  background: oklch(15.5% 0.01 100);
  overflow: hidden;
}
.doc-fold[open] { border-color: oklch(45% 0.06 95); }
.doc-fold summary {
  list-style: none;
  cursor: pointer;
  padding: .55rem .8rem;
  display: flex;
  align-items: baseline;
  gap: .6rem;
  user-select: none;
  transition: background .15s;
}
.doc-fold summary::-webkit-details-marker { display: none; }
.doc-fold summary::before {
  content: "▸";
  font-family: var(--font-mono);
  font-size: .8rem;
  color: var(--color-accent-dim);
  transition: transform .15s, color .15s;
  flex: none;
}
.doc-fold[open] summary::before { transform: rotate(90deg); color: var(--color-accent); }
.doc-fold summary:hover { background: oklch(19% 0.015 100); }
.doc-fold h4.doc-sub {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: .95rem;
  font-weight: 500;
  color: var(--color-ink);
  flex: none;
}
.doc-fold h4.doc-sub .doc-sub-src {
  font-family: var(--font-mono);
  font-weight: 400;
  font-size: .6rem;
  color: var(--color-muted);
  margin-left: .55rem;
  letter-spacing: .05em;
  border: 1px solid var(--color-rule);
  border-radius: 999px;
  padding: .04rem .5rem;
  vertical-align: .1em;
  white-space: nowrap;
}
.doc-fold-prev {
  flex: 1;
  min-width: 0;
  font-size: .8rem;
  color: var(--color-faint);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.doc-fold-body {
  padding: .45rem 1rem .9rem 1.05rem;
  border-top: 1px solid var(--color-rule);
  background: oklch(14.6% 0.008 100);
  max-width: 86ch;
}
/* 小字标签：知识要点 */
.doc-kp {
  font-family: var(--font-mono);
  font-size: .62rem;
  letter-spacing: .22em;
  color: var(--color-faint);
  margin: 0 0 .55rem !important;
}
.doc-kp::after { content: " ——"; color: var(--color-accent-dim); }
/* 条目分级排版：一、=加粗小标题；1、/（1）/a)=逐级缩进；备注=灰色注记 */
.doc-fold-body ul, .doc-sec-body ul { list-style: none; padding-left: 0; margin: .4rem 0; }
.doc-fold-body ol, .doc-sec-body ol { padding-left: 1.5rem; }
.doc-fold-body li, .doc-sec-body li {
  margin: .32rem 0;
  line-height: 1.8;
  padding-left: 1.05em;
  position: relative;
}
.doc-fold-body li::before, .doc-sec-body li::before {
  content: "·";
  position: absolute;
  left: 0;
  color: var(--color-accent-dim);
  font-weight: 700;
}
.doc-fold-body li.li-head, .doc-sec-body li.li-head {
  font-weight: 600;
  color: var(--color-accent);
  margin-top: .9em;
  padding-left: 0;
  font-size: .95em;
}
.doc-fold-body li.li-head::before, .doc-sec-body li.li-head::before { content: ""; }
.doc-fold-body li.li-lv1, .doc-sec-body li.li-lv1 {
  font-weight: 600;
  margin-top: .8em;
  padding-left: 0;
  font-size: .97em;
}
.doc-fold-body li.li-lv1::before, .doc-sec-body li.li-lv1::before { content: ""; }
.doc-fold-body li.li-lv2, .doc-sec-body li.li-lv2 { padding-left: 1.9em; }
.doc-fold-body li.li-lv2::before, .doc-sec-body li.li-lv2::before { content: "◦"; }
.doc-fold-body li.li-lv3, .doc-sec-body li.li-lv3 { padding-left: 3.1em; }
.doc-fold-body li.li-lv3::before, .doc-sec-body li.li-lv3::before { content: "—"; }
.doc-fold-body li.li-lv4, .doc-sec-body li.li-lv4 {
  padding-left: 4.3em;
  color: var(--color-muted);
  font-size: .95em;
}
.doc-fold-body li.li-lv4::before, .doc-sec-body li.li-lv4::before { content: "·"; color: var(--color-faint); }
.doc-fold-body li.li-note, .doc-sec-body li.li-note {
  color: var(--color-muted);
  font-size: .88em;
  line-height: 1.7;
  background: oklch(16.8% 0.008 100);
  border-left: 2px solid var(--color-rule);
  border-radius: 0 6px 6px 0;
  padding: .3em .7em .3em .9em;
  margin: .55em 0;
}
.doc-fold-body li.li-note::before, .doc-sec-body li.li-note::before { content: ""; }
.doc-sec-body h4.doc-sub {
  border: 0;
  margin: .9rem 0 .4rem;
  padding-left: 0;
}
.doc-sec-body h4.doc-sub .doc-sub-src { font-family: var(--font-mono); font-size: .66rem; color: var(--color-faint); margin-left: .5rem; font-weight: 400; }
.doc-sec-body blockquote {
  margin: .6rem 0;
  padding: .5rem .9rem;
  border-left: 3px solid var(--color-rule);
  background: oklch(17% 0.01 100);
  color: var(--color-muted);
  border-radius: 0 8px 8px 0;
}
.doc-sec-body blockquote p { margin: .2rem 0; }
.doc-sec-body table {
  border-collapse: collapse;
  width: 100%;
  margin: .7rem 0;
  font-size: .86rem;
}
.doc-sec-body th, .doc-sec-body td {
  border: 1px solid var(--color-rule);
  padding: .4rem .6rem;
  text-align: left;
}
.doc-sec-body th { color: var(--color-accent); font-weight: 400; background: oklch(17% 0.01 100); }
.doc-sec-body pre {
  background: oklch(17% 0.01 100);
  border: 1px solid var(--color-rule);
  border-radius: 8px;
  padding: .8rem 1rem;
  overflow-x: auto;
  font-family: var(--font-mono);
  font-size: .8rem;
  line-height: 1.5;
  margin: .6rem 0;
}
.doc-sec-body code {
  font-family: var(--font-mono);
  font-size: .85em;
  background: oklch(17% 0.01 100);
  border: 1px solid var(--color-rule);
  border-radius: 4px;
  padding: .05rem .3rem;
}
.doc-sec-body pre code { border: 0; background: none; padding: 0; }
.doc-sec-body img {
  max-width: 100%;
  height: auto;
  border: 1px solid var(--color-rule);
  border-radius: 8px;
  display: block;
  margin: .6rem 0;
  background: oklch(17% 0.01 100);
}
.doc-sec-body strong { color: var(--color-accent); font-weight: 700; }

mark {
  background: var(--color-accent);
  color: #141410;
  border-radius: 3px;
  padding: 0 .15em;
}
.doc-result {
  background: var(--color-surface);
  border: 1px solid var(--color-rule);
  border-radius: 12px;
  padding: .9rem 1.1rem;
  margin-bottom: .8rem;
  transition: border-color .25s, transform .25s var(--ease-out);
}
.doc-result:hover { border-color: var(--color-accent-dim); transform: translateX(3px); }
.doc-result-title {
  font-family: var(--font-display);
  font-size: 1rem;
  color: var(--color-ink);
  text-decoration: none;
}
.doc-result-title:hover { color: var(--color-accent); }
.doc-result-meta {
  font-family: var(--font-mono);
  font-size: .72rem;
  color: var(--color-faint);
  margin: .15rem 0 .3rem;
}
.doc-result-snip { margin: 0; color: var(--color-muted); font-size: .85rem; }
.doc-empty {
  color: var(--color-faint);
  font-size: .9rem;
  padding: 2rem 1rem;
  text-align: center;
  border: 1px dashed var(--color-rule);
  border-radius: 12px;
}

/* ---------- 知识问答页 ---------- */
.qa-main {
  flex: 1;
  width: 100%;
  max-width: 52rem;
  margin-inline: auto;
  padding: var(--space-lg) clamp(1rem, 4vw, 2rem);
  box-sizing: border-box;
}
.qa-search { display: flex; flex-wrap: wrap; gap: .7rem; align-items: center; margin-bottom: .6rem; }
.qa-search input {
  flex: 1;
  min-width: 12rem;
  background: var(--color-surface);
  border: 1px solid var(--color-rule);
  border-radius: 10px;
  color: var(--color-ink);
  font: inherit;
  font-size: .95rem;
  padding: .7rem 1rem;
  letter-spacing: .03em;
  transition: border-color .25s, box-shadow .25s;
}
.qa-search input::placeholder { color: var(--color-faint); }
.qa-search input:focus {
  outline: none;
  border-color: var(--color-accent-dim);
  box-shadow: 0 0 0 3px oklch(87% 0.17 95 / .12);
}
.qa-search .btn { padding: .7rem 1rem; }
.qa-count {
  font-family: var(--font-mono);
  font-size: .78rem;
  color: var(--color-faint);
  margin-bottom: 1rem;
  min-height: 1em;
}
.qa-card {
  background: var(--color-surface);
  border: 1px solid var(--color-rule);
  border-radius: 12px;
  padding: .9rem 1.1rem;
  margin-bottom: .8rem;
}
.qa-meta {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
  font-family: var(--font-mono);
  font-size: .72rem;
  color: var(--color-faint);
  margin-bottom: .35rem;
}
.qa-q { font-family: var(--font-display); font-weight: 400; font-size: .98rem; margin: 0 0 .5rem; }
.qa-a {
  font-size: .9rem;
  color: var(--color-muted);
  white-space: pre-line;
  border-left: 3px solid var(--color-rule);
  padding-left: .7rem;
  margin-left: .2rem;
}

/* ---------- 交流页 ---------- */
.board-main { max-width: 52rem; margin: 0 auto; padding: 1.6rem 1.4rem 4rem; }
.board-intro { color: var(--color-muted); font-size: .92rem; margin: 0 0 1.2rem; }
.board-note {
  font-size: .88rem;
  color: var(--color-muted);
  background: var(--color-surface);
  border: 1px solid var(--color-rule);
  border-radius: 10px;
  padding: .7rem 1rem;
  margin-bottom: 1.2rem;
}
.board-note.is-err { border-color: oklch(62% 0.17 30); color: oklch(80% 0.14 30); }
.board-form {
  display: flex;
  flex-direction: column;
  gap: .7rem;
  background: var(--color-surface);
  border: 1px solid var(--color-rule);
  border-radius: 14px;
  padding: 1rem;
  margin-bottom: 1.6rem;
}
.board-form input[type="text"], .board-form textarea {
  background: oklch(17% 0.01 100);
  border: 1px solid var(--color-rule);
  border-radius: 8px;
  color: var(--color-ink);
  font: inherit;
  font-size: .92rem;
  padding: .55rem .75rem;
  resize: vertical;
}
.board-form input[type="text"]:focus, .board-form textarea:focus {
  outline: none;
  border-color: var(--color-accent-dim);
  box-shadow: 0 0 0 3px oklch(87% 0.17 95 / .12);
}
.board-form-foot { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.board-hint { font-size: .78rem; color: var(--color-faint); }
.hp { position: absolute; left: -9999px; }
.board-card {
  background: var(--color-surface);
  border: 1px solid var(--color-rule);
  border-radius: 12px;
  padding: .9rem 1.1rem;
  margin-bottom: .8rem;
}
.board-meta { display: flex; gap: .8rem; align-items: baseline; margin-bottom: .4rem; }
.board-name { font-family: var(--font-display); font-size: .95rem; }
.board-time { font-family: var(--font-mono); font-size: .75rem; color: var(--color-faint); }
.board-content { font-size: .9rem; color: var(--color-muted); white-space: pre-line; }

/* ---------- 响应式与减弱动效 ---------- */
@media (max-width: 900px) {
  .doc-layout { grid-template-columns: 1fr; }
  .doc-side-inner { position: static; max-height: none; }
}
@media (max-width: 720px) {
  .scene-credit { display: none; }
  .panel-head { padding: .8rem 1rem; }
  .panel-title { font-size: 1.15rem; }
}
@media (prefers-reduced-motion: reduce) {
  .scene-svg, .index-page .topbar, .hm-ring,
  .rw-light, .rw-light-amber, .hint-ring, .sign-glow { animation: none; }
}

/* ---------- 博客页 ---------- */
.blog-intro { color: var(--color-muted); font-size: .9rem; margin: 0 0 var(--space-lg); }
.blog-section { margin-bottom: var(--space-lg); }
.blog-year {
  font-family: var(--font-mono);
  font-size: .85rem;
  font-weight: 400;
  color: var(--color-accent-dim);
  letter-spacing: .12em;
  border-bottom: 1px solid var(--color-rule);
  padding-bottom: .4rem;
  margin: 0 0 .9rem;
}
.blog-list { list-style: none; margin: 0; padding: 0; }
.blog-item { margin-bottom: 1rem; }
.blog-item-head { display: flex; align-items: baseline; gap: .6rem; }
.blog-title {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 1.05rem;
  color: inherit;
  text-decoration: none;
}
.blog-title:hover { color: var(--color-accent); }
.blog-date { font-family: var(--font-mono); font-size: .75rem; color: var(--color-faint); }
.blog-excerpt { font-size: .88rem; color: var(--color-muted); margin: .25rem 0 0; }

.blog-post { max-width: 46rem; margin-inline: auto; padding: var(--space-lg) clamp(1rem, 4vw, 3rem) 4rem; }
.blog-post-meta { font-family: var(--font-mono); font-size: .78rem; color: var(--color-faint); letter-spacing: .06em; margin: 0 0 .4rem; }
.blog-post-title { font-family: var(--font-display); font-weight: 400; font-size: 1.9rem; line-height: 1.25; margin: 0 0 1.2rem; }
.blog-post h2 { font-family: var(--font-display); font-weight: 400; font-size: 1.25rem; margin: 1.8rem 0 .6rem; }
.blog-post p { margin: 0 0 1rem; line-height: 1.8; }
.blog-post ul { padding-left: 1.4rem; margin: 0 0 1rem; }
.blog-post code {
  font-family: var(--font-mono);
  font-size: .85em;
  background: var(--color-surface);
  border: 1px solid var(--color-rule);
  border-radius: 4px;
  padding: .1em .35em;
}
.blog-post img { max-width: 100%; border: 1px solid var(--color-rule); border-radius: 8px; }
.blog-post a { color: var(--color-accent-dim); }
.blog-post-end { margin-top: 2.5rem; font-size: .9rem; }

/* ===== 可读性改造 v2（2026-08-17）：一句话摘要 · 数字高亮 · 图解联动 · 条目小标题着色 · 悬停高亮 ===== */
/* ① 一句话摘要条 */
.doc-sum {
  display: flex; align-items: baseline; gap: .6rem;
  margin: .5rem 0 .3rem; padding: .5rem .85rem;
  background: oklch(18% 0.02 95);
  border: 1px solid oklch(30% 0.05 95);
  border-left: 3px solid var(--color-accent);
  border-radius: 8px;
  font-size: .95rem; line-height: 1.6;
}
.doc-sum-label {
  font-family: var(--font-mono);
  font-size: .6rem; letter-spacing: .18em;
  color: var(--color-accent);
  white-space: nowrap; flex: none;
}
/* ② 数字自动高亮 */
mark.doc-num {
  background: none;
  color: var(--color-accent);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  padding: 0 .05em;
}
/* ④ 图解联动入口 */
.doc-glink {
  display: inline-flex; align-items: center; gap: .45rem;
  margin: 0 0 .7rem; padding: .38rem .85rem;
  font-size: .85rem; color: var(--color-accent);
  border: 1px dashed oklch(50% 0.08 95);
  border-radius: 999px;
  text-decoration: none;
  transition: background .2s, color .2s, border-color .2s;
}
.doc-glink:hover { background: var(--color-accent); color: #141410; border-color: var(--color-accent); }
.doc-glink-ico { font-size: 1.05rem; }

/* ⑥ 条目版式：列表流（无卡片），悬停黄色高亮 + 突出 */
.doc-fold-body, .doc-sec-body { max-width: 92ch; }
.doc-fold-body ul, .doc-sec-body ul { list-style: none; padding-left: 0; margin: .5rem 0 .9rem; }
.doc-fold-body li, .doc-sec-body li {
  margin: .3rem 0;
  padding: .3rem .55rem .3rem 1.35em;
  line-height: 1.75;
  font-size: .92rem;
  border-radius: 6px;
  border-left: 2px solid transparent;
  transition: background .15s, color .15s, transform .15s, box-shadow .15s, border-color .15s;
}
/* 悬停交互：黄色高亮 + 左移突出 */
.doc-fold-body li:hover, .doc-sec-body li:hover {
  background: oklch(23.5% 0.045 95);
  border-left-color: var(--color-accent);
  color: var(--color-ink);
  transform: translateX(.3rem);
  box-shadow: 0 1px 8px rgba(0, 0, 0, .3);
}
.doc-fold-body li:hover::before, .doc-sec-body li:hover::before { color: var(--color-accent); }
/* 条目小标题（冒号前引题）：黄色加粗 */
.doc-li-k {
  color: var(--color-accent);
  font-weight: 600;
  letter-spacing: .01em;
}
li:hover .doc-li-k { color: #ffd75e; }
/* 层级小标题行（一、/主题行）与备注行 */
.doc-fold-body li.li-head, .doc-sec-body li.li-head {
  font-weight: 600; color: var(--color-accent);
  margin-top: .9em; padding-left: 0; font-size: .95em;
}
.doc-fold-body li.li-head::before, .doc-sec-body li.li-head::before { content: ""; }
.doc-fold-body li.li-lv1, .doc-sec-body li.li-lv1 {
  font-weight: 600; margin-top: .8em; padding-left: 0; font-size: .97em;
}
.doc-fold-body li.li-lv1::before, .doc-sec-body li.li-lv1::before { content: ""; }
.doc-fold-body li.li-lv2, .doc-sec-body li.li-lv2 { padding-left: 1.9em; }
.doc-fold-body li.li-lv2::before, .doc-sec-body li.li-lv2::before { content: "◦"; }
.doc-fold-body li.li-lv3, .doc-sec-body li.li-lv3 { padding-left: 3.1em; }
.doc-fold-body li.li-lv3::before, .doc-sec-body li.li-lv3::before { content: "—"; }
.doc-fold-body li.li-lv4, .doc-sec-body li.li-lv4 {
  padding-left: 4.3em; color: var(--color-muted); font-size: .95em;
}
.doc-fold-body li.li-lv4::before, .doc-sec-body li.li-lv4::before { content: "·"; color: var(--color-faint); }
.doc-fold-body li.li-note, .doc-sec-body li.li-note {
  color: var(--color-muted); font-size: .88em; line-height: 1.7;
  background: oklch(16.8% 0.008 100);
  border-left: 2px solid var(--color-rule);
  border-radius: 0 6px 6px 0;
  padding: .3em .7em .3em .9em; margin: .55em 0;
}
.doc-fold-body li.li-note::before, .doc-sec-body li.li-note::before { content: ""; }
/* 阅读节奏 */
.doc-sec { margin-bottom: 2.4rem; }
.doc-sec-title { font-size: 1.18rem; letter-spacing: .01em; }
.doc-sec-body { font-size: .94rem; }
.doc-sec-body p, .doc-fold-body p { margin: .55rem 0; }


/* ===== 进阶可读性（2026-08-17）：考考你 · 悬停摘要 · 随便看看 · 收藏 · 沉浸阅读 ===== */
/* ① 节末考考你 */
.doc-quiz-box { margin: .9rem 0 0; border-top: 1px dashed var(--color-rule); padding-top: .65rem; }
.doc-quiz { margin: .4rem 0; background: oklch(16.8% 0.015 95); border: 1px solid var(--color-rule); border-radius: 8px; overflow: hidden; }
.doc-quiz summary {
  cursor: pointer; padding: .5rem .85rem; font-size: .9rem; list-style: none;
  display: flex; align-items: baseline; gap: .5rem; user-select: none;
}
.doc-quiz summary::-webkit-details-marker { display: none; }
.doc-quiz summary::before { content: "▸"; font-family: var(--font-mono); color: var(--color-accent); font-size: .8rem; transition: transform .15s; flex: none; }
.doc-quiz[open] summary::before { transform: rotate(90deg); }
.doc-quiz summary:hover { background: oklch(19% 0.02 95); }
.doc-quiz-label {
  font-family: var(--font-mono); font-size: .68rem; letter-spacing: .12em; color: var(--color-accent);
  border: 1px solid var(--color-accent-dim); border-radius: 999px; padding: .05rem .5rem; white-space: nowrap; flex: none;
}
.doc-quiz-a {
  margin: 0; padding: .6rem .95rem .8rem; border-top: 1px solid var(--color-rule);
  color: var(--color-muted); font-size: .9rem; line-height: 1.75; background: oklch(14.8% 0.008 100);
}
/* ⑦ 收藏 + ⑧ 阅读模式按钮 */
.doc-sec-head { display: flex; align-items: flex-start; gap: .7rem; }
.doc-sec-head .doc-sec-title { flex: 1; padding-right: 0; }
.doc-sec-tools { display: flex; align-items: center; gap: .45rem; padding-top: .18rem; flex: none; }
.doc-fav {
  background: none; border: none; color: var(--color-accent); font-size: 1.15rem; line-height: 1;
  cursor: pointer; padding: .1rem .25rem; transition: transform .15s;
}
.doc-fav:hover { transform: scale(1.25); }
.doc-read {
  font-family: var(--font-mono); font-size: .7rem; color: var(--color-faint);
  background: none; border: 1px solid var(--color-rule); border-radius: 999px; padding: .2rem .7rem; cursor: pointer;
  transition: color .15s, border-color .15s;
}
.doc-read:hover { color: var(--color-accent); border-color: var(--color-accent-dim); }
/* ⑥ 随便看看 + 退出阅读 */
.doc-head { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; }
.doc-rand {
  font-family: var(--font-mono); font-size: .74rem; color: var(--color-accent);
  background: none; border: 1px solid var(--color-accent-dim); border-radius: 999px;
  padding: .3rem .85rem; cursor: pointer; margin-left: auto;
  transition: background .2s, color .2s;
}
.doc-rand:hover { background: var(--color-accent); color: #141410; border-color: var(--color-accent); }
/* ② 目录悬停摘要 */
.doc-toc-chip { position: relative; }
.doc-toc-chip[data-sum]:hover::after {
  content: attr(data-sum);
  position: absolute; left: 0; top: calc(100% + .4rem);
  width: max-content; max-width: 26rem;
  background: oklch(20% 0.022 95);
  border: 1px solid var(--color-accent-dim);
  border-radius: 8px;
  padding: .5rem .75rem;
  font-size: .82rem; color: var(--color-ink); line-height: 1.6;
  box-shadow: 0 6px 18px rgba(0,0,0,.45);
  z-index: 40; white-space: normal;
}
/* ⑦ 收藏侧栏 */
.doc-fav-box { border-top: 1px dashed var(--color-accent-dim); padding-top: .35rem; margin-bottom: .6rem; }
.doc-fav-box .doc-part-title { color: var(--color-accent); }

/* ⑧ 沉浸阅读 v2：黑幕覆盖 + 纯文本连续展示 + 鼠标亮光带 */
.doc-reader {
  position: fixed; inset: 0; z-index: 100;
  background: radial-gradient(ellipse at center, rgba(12,13,12,.94), rgba(2,3,2,.985));
  display: flex; flex-direction: column;
}
.doc-reader-top {
  display: flex; align-items: center; gap: .8rem;
  padding: .85rem 1.3rem; flex: none;
  border-bottom: 1px solid oklch(24% 0.01 100);
}
.doc-reader-tag {
  font-family: var(--font-mono); font-size: .72rem;
  color: var(--color-faint); letter-spacing: .12em;
}
.doc-reader-exit {
  margin-left: auto;
  font-family: var(--font-mono); font-size: .8rem;
  background: var(--color-accent); color: #141410;
  border: none; border-radius: 999px;
  padding: .45rem 1.05rem; cursor: pointer;
  box-shadow: 0 3px 12px rgba(0,0,0,.4);
}
.doc-reader-exit:hover { filter: brightness(1.1); }
.doc-reader-scroll {
  flex: 1; overflow-y: auto;
  padding: 3rem 1.4rem 45vh;
}
.doc-reader-text { max-width: 72ch; margin: 0 auto; }
.dr-line {
  color: oklch(32% 0.005 100);
  font-size: 1.1rem; line-height: 2.15;
  margin: 0; padding: 0;
  transition: color .12s, text-shadow .12s;
}
.dr-line.lit {
  color: oklch(94% 0.012 100);
  text-shadow: 0 0 16px rgba(255,224,130,.4);
}
.dr-title {
  color: oklch(58% 0.02 95); font-size: 1.4rem; font-weight: 600;
  margin-bottom: 1.1rem; line-height: 1.5;
}
.dr-tag { font-family: var(--font-mono); font-size: .66rem; color: var(--color-faint); margin-left: .6rem; font-weight: 400; }
.dr-h4 { margin-top: 1.15rem; color: oklch(52% 0.025 95); font-weight: 600; }
.dr-quote { color: oklch(38% 0.008 90); }
.dr-sum { color: oklch(44% 0.03 95); font-style: italic; }
.dr-myth { color: oklch(48% 0.05 70); }
/* 鼠标亮光带：跟随指针，一行居中照亮 */
.doc-reader-light {
  position: fixed; left: 0; right: 0;
  height: 3.2rem; margin-top: -1.6rem;
  pointer-events: none; z-index: 101;
  background: linear-gradient(180deg,
    transparent 0%,
    rgba(255,224,130,.05) 38%,
    rgba(255,224,130,.17) 50%,
    rgba(255,224,130,.05) 62%,
    transparent 100%);
  border-top: 1px solid rgba(255,224,130,.16);
  border-bottom: 1px solid rgba(255,224,130,.16);
  mix-blend-mode: screen;
}
body.doc-reader-open { overflow: hidden; }

/* 单条视图（随便看看） */
.doc-single-bar {
  display: flex; align-items: center; gap: .8rem;
  margin-bottom: 1.1rem; padding-bottom: .65rem;
  border-bottom: 1px solid var(--color-rule);
}
.doc-back-chap {
  font-family: var(--font-mono); font-size: .74rem; color: var(--color-faint);
  background: none; border: 1px solid var(--color-rule); border-radius: 999px;
  padding: .28rem .85rem; cursor: pointer;
  transition: color .15s, border-color .15s;
}
.doc-back-chap:hover { color: var(--color-accent); border-color: var(--color-accent-dim); }
.doc-single-tag { font-family: var(--font-mono); font-size: .72rem; color: var(--color-faint); letter-spacing: .08em; }
.doc-rand-again { margin-left: auto; }

/* 选择题版考考你 */
.doc-quiz-mc { margin: .55rem 0; }
.doc-quiz-q { font-size: .92rem; margin-bottom: .45rem; line-height: 1.6; }
.doc-quiz-q .doc-quiz-label { vertical-align: .05em; margin-right: .55rem; }
.doc-quiz-opts { display: flex; flex-direction: column; gap: .35rem; }
.doc-quiz-opt {
  text-align: left;
  font-size: .9rem; line-height: 1.6;
  color: var(--color-ink);
  background: oklch(15.5% 0.01 100);
  border: 1px solid var(--color-rule);
  border-radius: 8px;
  padding: .42rem .75rem;
  cursor: pointer;
  transition: background .15s, border-color .15s, color .15s;
}
.doc-quiz-opt:hover:not(:disabled) { border-color: var(--color-accent-dim); background: oklch(19% 0.02 95); }
.doc-quiz-opt:disabled { cursor: default; opacity: .72; }
.doc-quiz-opt.is-right { border-color: #3fae6a; background: oklch(20% 0.05 150); color: #7fe0a6; opacity: 1; }
.doc-quiz-opt.is-right::after { content: " ✓"; color: #7fe0a6; }
.doc-quiz-opt.is-wrong { border-color: #d95c5c; background: oklch(20% 0.05 25); color: #ff9d9d; opacity: 1; }
.doc-quiz-opt.is-wrong::after { content: " ✗"; color: #ff9d9d; }
.doc-quiz-fb {
  margin: .5rem 0 0; padding: .5rem .8rem;
  font-size: .88rem; line-height: 1.7;
  color: var(--color-muted);
  background: oklch(16% 0.012 100);
  border-left: 3px solid var(--color-accent-dim);
  border-radius: 0 8px 8px 0;
}
.doc-quiz-verdict { display: block; color: var(--color-accent); margin-bottom: .15rem; }

/* 考考你可折叠面板（默认收起） */
.doc-quiz-fold {
  border: 1px solid var(--color-rule);
  border-radius: 8px;
  margin: .8rem 0 0;
  background: oklch(16.8% 0.015 95);
  overflow: hidden;
}
.doc-quiz-fold summary {
  list-style: none;
  cursor: pointer;
  padding: .52rem .85rem;
  font-size: .9rem;
  display: flex; align-items: center; gap: .55rem;
  user-select: none;
}
.doc-quiz-fold summary::-webkit-details-marker { display: none; }
.doc-quiz-fold summary::before {
  content: "▸";
  font-family: var(--font-mono);
  font-size: .8rem;
  color: var(--color-accent);
  transition: transform .15s;
  flex: none;
}
.doc-quiz-fold[open] summary::before { transform: rotate(90deg); }
.doc-quiz-fold summary:hover { background: oklch(19% 0.02 95); }
.doc-quiz-fold-hint { font-family: var(--font-mono); font-size: .68rem; color: var(--color-faint); letter-spacing: .06em; margin-left: auto; }
.doc-quiz-fold[open] .doc-quiz-fold-hint { display: none; }
.doc-quiz-fold .doc-quiz-box { margin: 0; border-top: 1px solid var(--color-rule); padding: .65rem .95rem .85rem; }