/* =========================================================================
 * 趣味学堂 · 古雅宣纸主题（数字医馆）
 * 规范：暖米色宣纸背景 / 深褐墨字 / 古铜金装饰 / 朱砂红警示 / 黛绿操作
 * 顶部木匾导航 / 胶囊按钮 / 左右双栏 / 纸张压痕阴影 / 弹性缓动
 * ========================================================================= */

:root {
  --paper:        #f5f0e8;   /* 暖米色宣纸背景 */
  --paper-card:   #fffef9;   /* 便笺白米 */
  --paper-deep:   #ece1cd;   /* 略深分区底 */
  --paper-veil:   #efe7d6;
  --ink:          #3d3226;   /* 深褐墨字 */
  --ink-soft:     #6b5d4a;
  --ink-faint:    #9a8c75;
  --bronze:       #b8860b;   /* 古铜金 */
  --bronze-bright:#d4a745;
  --bronze-soft:  #c9a24a;
  --cinnabar:     #a03030;   /* 朱砂红 */
  --cinnabar-bri: #c0392b;
  --dai:          #5a7a6a;   /* 黛绿（操作） */
  --line:         #e0d5c0;   /* 旧书页边 */
  --line-strong:  #cdbd9f;
  --gold-hl:      #fdf3d0;   /* 暖黄高亮底 */
  --gold-hl-ink:  #6b2f1a;
  --wood:         #2c2416;   /* 木匾深底 */
  --serif: 'Noto Serif SC', 'Songti SC', STSong, 'KaiTi', 'STKaiti', serif;
  --kai:   'KaiTi', 'STKaiti', 'Noto Serif SC', serif;
  --ease:  cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-back: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ---------- 顶部导航：木匾 + 胶囊 ---------- */
.hd {
  background: linear-gradient(180deg, #332a1a 0%, var(--wood) 100%);
  border-bottom: 2px solid var(--bronze);
  box-shadow: 0 2px 0 #1c160c, 0 8px 22px rgb(0 0 0 / .25);
}
.hd .seal {
  background: radial-gradient(circle at 35% 30%, var(--bronze-bright), var(--bronze) 70%);
  color: #2c2416;
  box-shadow: 0 0 0 2px #2c2416, 0 0 0 4px var(--bronze);
}
.hd .eyebrow { color: var(--bronze-soft); letter-spacing: 2px; }
.hd h1 { color: #f3e9d2; text-shadow: 0 1px 0 #000; letter-spacing: 2px; }
.hd .sub { color: #cdbf9f; }
.hd .hero-meta span {
  background: rgb(212 167 69 / .12);
  border: 1px solid rgb(212 167 69 / .4);
  color: var(--bronze-bright);
}

.nav { gap: 8px; flex-wrap: wrap; }
.ntab {
  border-radius: 999px;
  border: 1px solid transparent;
  background: rgb(255 255 255 / .06);
  color: #cdbf9f;
  padding: 8px 16px;
  letter-spacing: 1px;
  transition: all .35s var(--ease);
}
.ntab:hover { color: #f3e9d2; border-color: rgb(212 167 69 / .5); transform: translateY(-1px); }
.ntab.on {
  background: linear-gradient(180deg, var(--bronze-bright), var(--bronze));
  color: #2c2416;
  font-weight: 600;
  box-shadow: 0 2px 10px rgb(212 167 69 / .35);
}
/* 辅助工具分组标签 */
.nav-sep {
  display: inline-flex; align-items: center; color: #8c7c5e;
  font-size: 12px; letter-spacing: 3px; padding: 0 6px 0 4px;
  align-self: center; user-select: none;
}
.nav-sep::before { content: "·"; margin-right: 6px; color: var(--bronze-soft); }

/* 会员/转化按钮（若有） */
.nav .vip {
  background: linear-gradient(180deg, #e9c46a, #c9952f);
  color: #2c2416; box-shadow: 0 0 12px rgb(233 196 106 / .45);
}

/* ---------- 趣味学堂容器 ---------- */
.learn { background: var(--paper); min-height: 70vh; }
.learn-wrap { max-width: 1180px; margin: 0 auto; padding: 28px 22px 60px; }

.learn-hero {
  text-align: center; padding: 18px 10px 26px;
  background:
    radial-gradient(120% 80% at 50% -10%, rgb(212 167 69 / .14), transparent 60%),
    var(--paper-card);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 1px 0 #fff inset, 0 10px 30px rgb(60 50 38 / .08);
}
.learn-hero .seal-big {
  width: 64px; height: 64px; margin: 0 auto 12px;
  border-radius: 50%; display: grid; place-items: center;
  font-family: var(--serif); font-size: 30px; color: #2c2416;
  background: radial-gradient(circle at 35% 30%, var(--bronze-bright), var(--bronze) 72%);
  box-shadow: 0 0 0 3px #2c2416, 0 0 0 6px var(--bronze), 0 8px 20px rgb(0 0 0 / .2);
}
.learn-hero h2 {
  font-family: var(--serif); font-size: 30px; color: var(--ink);
  letter-spacing: 4px; margin: 0 0 8px;
}
.learn-hero p { color: var(--ink-soft); font-family: var(--kai); font-size: 16px; margin: 0; }
.learn-hero .progress-top {
  margin: 16px auto 0; max-width: 420px;
}

/* 总进度条 */
.prog-track {
  height: 10px; border-radius: 999px; overflow: hidden;
  background: var(--paper-deep); border: 1px solid var(--line);
}
.prog-fill {
  height: 100%; width: 0%;
  background: linear-gradient(90deg, var(--bronze-soft), var(--bronze-bright));
  box-shadow: 0 0 8px rgb(212 167 69 / .5);
  transition: width .6s var(--ease);
}
.prog-label { font-size: 13px; color: var(--ink-soft); margin-top: 8px; letter-spacing: 1px; }

/* ---------- 章节 + 课程卡片 ---------- */
.chapter-block { margin-top: 34px; }
.chapter-head { display: flex; align-items: baseline; gap: 12px; margin-bottom: 14px; border-left: 4px solid var(--bronze); padding-left: 12px; }
.chapter-head h3 { font-family: var(--serif); font-size: 22px; color: var(--ink); letter-spacing: 2px; margin: 0; }
.chapter-head span { color: var(--ink-faint); font-family: var(--kai); font-size: 14px; }

.lesson-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(248px, 1fr));
  gap: 16px;
}
.lesson-card {
  position: relative; text-align: left; cursor: pointer;
  background: var(--paper-card);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 18px 18px 16px;
  box-shadow: 0 1px 0 #fff inset, 0 6px 16px rgb(60 50 38 / .08);
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
  font-family: var(--serif); color: var(--ink);
  display: flex; flex-direction: column; gap: 10px;
}
.lesson-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 1px 0 #fff inset, 0 14px 30px rgb(60 50 38 / .16);
  border-color: var(--bronze-soft);
}
.lesson-card .emblem {
  width: 46px; height: 46px; border-radius: 50%;
  display: grid; place-items: center;
  font-family: var(--serif); font-size: 22px; color: var(--bronze);
  background: var(--gold-hl);
  border: 1px solid var(--bronze-soft);
  box-shadow: 0 0 0 3px rgb(212 167 69 / .12);
}
.lesson-card.has-anim .emblem { color: var(--dai); background: #eaf1ed; border-color: #9bb6a8; }
.lesson-card .lc-title { font-size: 18px; font-weight: 600; letter-spacing: 1px; }
.lesson-card .lc-sub { font-size: 13px; color: var(--ink-soft); font-family: var(--kai); line-height: 1.6; min-height: 38px; }
.lesson-card .lc-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.lc-tags .tag {
  font-size: 12px; color: var(--ink-soft);
  background: var(--paper-veil); border: 1px solid var(--line);
  border-radius: 999px; padding: 2px 9px; letter-spacing: .5px;
}
.lesson-card .lc-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 2px; }
.lc-badge { font-size: 12px; color: var(--bronze); letter-spacing: 1px; }
.lc-done {
  font-size: 12px; color: #2f7d4f; border: 1px solid #9bd0b0;
  background: #eafaf0; border-radius: 999px; padding: 2px 9px;
}
.lesson-card .lc-prog { height: 5px; border-radius: 999px; background: var(--paper-deep); overflow: hidden; }
.lesson-card .lc-prog > i { display: block; height: 100%; background: linear-gradient(90deg, var(--bronze-soft), var(--bronze-bright)); }

/* ---------- 课程播放器 ---------- */
.player { background: var(--paper); }
.player-breadcrumb {
  max-width: 1180px; margin: 0 auto; padding: 16px 22px 0;
  font-size: 13px; color: var(--ink-faint); letter-spacing: 1px;
}
.player-breadcrumb b { color: var(--ink-soft); font-weight: 600; }
.player-breadcrumb .crumb-back { color: var(--bronze); cursor: pointer; }
.player-breadcrumb .crumb-back:hover { text-decoration: underline; }

.player-meta {
  max-width: 1220px; margin: 0 auto; padding: 0 22px 10px;
  display: flex; flex-wrap: wrap; gap: 8px 28px;
  color: var(--ink-soft); font-size: 13px;
}
.player-meta label {
  display: inline-block; margin-right: 6px; color: var(--ink-faint);
  font-size: 11px; letter-spacing: .08em;
}
.player-main {
  max-width: 1320px; margin: 0 auto; padding: 8px 22px 20px;
  display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 22px;
  align-items: stretch;
}
@media (max-width: 960px) { .player-main { grid-template-columns: 1fr; } }
@media (min-width: 961px) {
  /* 只给桌面双栏钉左图。App 单列 / 展开配图时如果 sticky，
     图会钉在滚动容器顶部，盖住下面往上翻的讲稿。 */
  .player:not(.app-reader) .stage { position: sticky; top: 16px; align-self: start; }
  .player.app-reader .stage,
  .player.fig-open .stage { position: relative; top: auto; }
}

/* 左：动画演示区 */
.stage {
  position: relative; min-height: 460px;
  /* style.css:194 有同名 .stage（六经分期条）带 align-items:center，会泄漏到
     这里把 .stage-canvas 压成内容宽（配图缩成 300px）。显式拉回 stretch。 */
  align-items: stretch;
  background:
    repeating-linear-gradient(0deg, transparent 0 26px, rgb(60 50 38 / .035) 26px 27px),
    var(--paper-card);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: 0 1px 0 #fff inset, 0 10px 28px rgb(60 50 38 / .1);
  overflow: hidden;
  display: flex; flex-direction: column;
}
.stage-title {
  font-family: var(--serif); font-size: 15px; color: var(--ink-soft);
  letter-spacing: 2px; padding: 12px 16px 0;
}
.stage-canvas {
  /* flex-basis 必须 auto：若用 flex:1（basis 0）容器高度不随内容走，
     大尺寸配图会被 .stage 的 overflow:hidden 裁掉一截 */
  flex: 1 1 auto; display: grid; place-items: center; padding: 8px 14px 4px;
  min-height: 320px;
}
.stage-canvas svg { max-width: 100%; height: auto; }

/* 状态指示器（右上，随动画同步） */
.status-chip {
  position: absolute; top: 12px; right: 14px; z-index: 5;
  display: flex; align-items: center; gap: 8px;
  background: rgb(255 254 249 / .9);
  border: 1px solid var(--line); border-radius: 999px;
  padding: 5px 12px 5px 9px; font-size: 13px; color: var(--ink);
  box-shadow: 0 4px 12px rgb(60 50 38 / .12);
}
.status-chip .dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: var(--cinnabar); box-shadow: 0 0 0 0 rgb(160 48 48 / .6);
  animation: pulseDot 1.6s infinite;
}
.status-chip.ok .dot { background: #2f7d4f; animation: none; box-shadow: none; }
@keyframes pulseDot {
  0%   { box-shadow: 0 0 0 0 rgb(160 48 48 / .55); }
  70%  { box-shadow: 0 0 0 9px rgb(160 48 48 / 0); }
  100% { box-shadow: 0 0 0 0 rgb(160 48 48 / 0); }
}

/* 底部控制按钮 */
.stage-controls {
  border-top: 1px solid var(--line);
  padding: 12px 14px; display: flex; flex-wrap: wrap; gap: 8px; justify-content: center;
  background: var(--paper-veil);
}
/* 无动画的课（buildFigureCard）不填控制条，空条会白占配图空间 */
.stage-controls:empty { display: none; }
.mini-btn {
  font-family: var(--serif); font-size: 13px; letter-spacing: 1px;
  color: var(--ink-soft); background: var(--paper-card);
  border: 1px solid var(--line-strong); border-radius: 8px;
  padding: 7px 13px; cursor: pointer; transition: all .3s var(--ease);
}
.mini-btn:hover { border-color: var(--bronze); color: var(--ink); transform: translateY(-1px); }
.mini-btn.on { background: var(--cinnabar); border-color: var(--cinnabar); color: #fff; box-shadow: 0 3px 10px rgb(160 48 48 / .35); }

.play-btn {
  font-family: var(--serif); font-size: 14px; letter-spacing: 2px; font-weight: 600;
  color: #fff; cursor: pointer;
  background: linear-gradient(180deg, #4a3d28, #2c2416);
  border: 1px solid #1c160c; border-radius: 8px;
  padding: 8px 20px; transition: all .3s var(--ease);
  box-shadow: 0 3px 10px rgb(0 0 0 / .25);
}
.play-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgb(0 0 0 / .3); }
.play-btn.dai { background: linear-gradient(180deg, #6f9182, var(--dai)); border-color: #456157; }

/* 右：讲稿区 */
.script {
  background: var(--paper-card);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: 0 1px 0 #fff inset, 0 10px 28px rgb(60 50 38 / .1);
  padding: 22px 24px 26px;
  font-family: var(--kai);
  max-height: 620px; overflow: auto;
}
.script .s-eyebrow {
  font-family: var(--serif); color: var(--bronze); letter-spacing: 3px;
  font-size: 13px; border-bottom: 1px dashed var(--line-strong);
  padding-bottom: 8px; margin-bottom: 14px;
}
.script .s-h { font-family: var(--serif); font-size: 22px; color: var(--ink); letter-spacing: 1px; margin: 0 0 4px; }
.script .s-tags { display: flex; gap: 6px; flex-wrap: wrap; margin: 8px 0 16px; }
.script .s-tags .tag {
  font-size: 12px; color: var(--ink-soft); background: var(--paper-veil);
  border: 1px solid var(--line); border-radius: 999px; padding: 2px 10px; letter-spacing: .5px;
}
.script .para { font-size: 16px; line-height: 2; color: var(--ink); margin: 0 0 16px; }
.script .hl {
  font-size: 16px; line-height: 2; margin: 0 0 16px;
  background: var(--gold-hl); color: var(--gold-hl-ink);
  border-radius: 6px; padding: 10px 14px; box-shadow: 0 1px 0 #fff inset;
}
.script .quote {
  font-size: 15px; line-height: 1.9; color: var(--ink-soft); font-style: italic;
  margin: 0 0 16px; padding: 12px 16px;
  border-left: 4px solid var(--bronze); background: rgb(212 167 69 / .08);
  border-radius: 0 6px 6px 0;
}
.script .tip {
  font-size: 15px; line-height: 1.9; color: var(--cinnabar);
  margin: 0 0 16px; padding: 12px 16px;
  border-left: 4px solid var(--cinnabar); background: rgb(160 48 48 / .07);
  border-radius: 0 6px 6px 0;
}
.script .s-src { font-size: 12px; color: var(--ink-faint); letter-spacing: 1px; margin-top: 6px; border-top: 1px dashed var(--line); padding-top: 12px; }
/* 原书讲稿摘录（_gen_zhenjiu_enrich.py 注入 lessons.js 尾部的 P 页锚点块；
   课程正文与三层笔记「全文讲稿」tab 共用 .script 容器，一处样式两处生效） */
.script .orig-lead {
  font-family: var(--serif); font-size: 13px; letter-spacing: 1.5px;
  color: var(--bronze); margin: 26px 0 10px;
  display: flex; align-items: baseline; gap: 10px;
}
.script .orig-lead::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.script .orig-lead span { font-family: var(--sans, sans-serif); font-size: 11px; color: var(--ink-faint); letter-spacing: .5px; }
.script .orig {
  font-size: 15px; line-height: 2; color: var(--ink-soft);
  margin: 0 0 14px; padding: 10px 14px 10px 16px;
  border-left: 3px solid var(--line-strong);
  background: var(--paper-veil); border-radius: 0 6px 6px 0;
}
.script .orig .orig-ref {
  font-family: var(--serif); font-size: 12px; letter-spacing: .5px;
  color: var(--bronze); border: 1px solid rgb(212 167 69 / .35);
  border-radius: 4px; padding: 1px 7px; margin-right: 10px;
  cursor: pointer; white-space: nowrap; vertical-align: 1px;
}
.script .orig .orig-ref:hover { background: rgb(212 167 69 / .12); }

/* 底栏：上一课 / 进度 / 下一课 / 标记已学 */
.player-foot {
  max-width: 1180px; margin: 0 auto; padding: 0 22px 40px;
  display: flex; align-items: center; gap: 16px;
}
.foot-btn {
  font-family: var(--serif); font-size: 14px; letter-spacing: 2px; cursor: pointer;
  border-radius: 8px; padding: 10px 18px; transition: all .3s var(--ease); white-space: nowrap;
}
.foot-btn.ghost { color: var(--ink-soft); background: var(--paper-card); border: 1px solid var(--line-strong); }
.foot-btn.ghost:hover:not(:disabled) { border-color: var(--bronze); color: var(--ink); }
.foot-btn.ghost:disabled { opacity: .4; cursor: not-allowed; }
.foot-btn.primary { color: #fff; background: linear-gradient(180deg, #4a3d28, #2c2416); border: 1px solid #1c160c; }
.foot-btn.primary:hover { transform: translateY(-2px); }
.foot-prog { flex: 1; display: flex; flex-direction: column; gap: 6px; }
.foot-prog .prog-track { height: 8px; }
.foot-prog .fp-label { font-size: 12px; color: var(--ink-soft); letter-spacing: 1px; text-align: center; }
.learn-btn {
  font-family: var(--serif); font-size: 14px; letter-spacing: 2px; cursor: pointer;
  border-radius: 8px; padding: 10px 18px; transition: all .3s var(--ease); white-space: nowrap;
  color: #2c2416; background: linear-gradient(180deg, #e9c46a, #c9952f);
  border: 1px solid #a9781f; box-shadow: 0 0 12px rgb(233 196 106 / .4);
}
.learn-btn:hover { transform: translateY(-2px); }
.learn-btn.done { color: #2f7d4f; background: #eafaf0; border-color: #9bd0b0; box-shadow: none; }

/* =========================================================================
 * 动画一：同身寸 · 手掌测量
 * ========================================================================= */
.hand-svg .hand-base { fill: #f3e7cf; stroke: var(--bronze-soft); stroke-width: 2.5; }
.hand-svg .hand-fill { fill: #f8efdc; stroke: var(--bronze-soft); stroke-width: 2; }
.hand-svg .crease { stroke: #b9a47e; stroke-width: 1.4; opacity: .8; }
.hand-svg .anno { display: none; }
.hand-svg .anno.show { display: block; }
.hand-svg .m-band {
  fill: none; stroke: var(--bronze); stroke-width: 7; stroke-linecap: round;
  filter: drop-shadow(0 0 4px rgb(212 167 69 / .6));
  stroke-dasharray: 400; stroke-dashoffset: 400;
  transition: stroke-dashoffset .9s var(--ease);
}
.hand-svg .m-band.draw { stroke-dashoffset: 0; }
.hand-svg .m-label {
  font-family: var(--serif); font-size: 17px; font-weight: 700; fill: var(--ink);
  paint-order: stroke; stroke: #fffef9; stroke-width: 4px; stroke-linejoin: round;
}
.hand-svg .m-cap { font-family: var(--kai); font-size: 12px; fill: var(--ink-soft); }
.hand-svg .arrow { stroke: var(--bronze); stroke-width: 2; }
.hand-svg .cursor { fill: var(--dai); opacity: 0; transition: opacity .3s; }
.hand-svg .cursor.on { opacity: 1; }

/* =========================================================================
 * 动画二：七禁针 · 小人七态
 * ========================================================================= */
.fig-svg { overflow: visible; }
.fig-svg .fig-skin { fill: #f3e7cf; stroke: var(--bronze-soft); stroke-width: 2.5; }
.fig-svg .fig-line { stroke: var(--bronze-soft); stroke-width: 6; stroke-linecap: round; fill: none; }
.fig-svg .belly { fill: #e9d9b8; stroke: var(--bronze-soft); stroke-width: 2; transition: all .4s var(--ease); transform-box: view-box; transform-origin: 160px 210px; }
.fig-svg .face-eye { fill: var(--ink); }
.fig-svg .mouth { stroke: var(--ink); stroke-width: 2.5; fill: none; }
/* 状态附加元素，默认隐藏 */
.fig-svg .fx { opacity: 0; transition: opacity .3s; }
.fig-svg .flame { fill: var(--cinnabar-bri); }
.fig-svg .sweat { fill: #6fa8d6; }
.fig-svg .shake { transform-box: view-box; transform-origin: 160px 200px; }
.fig-svg .tilt { transform-box: view-box; transform-origin: 160px 320px; }
.fig-svg .fig-root { transform-box: view-box; }
.fig-svg .tongue { opacity: 0; }

/* 大怒：冒火 + 红脸 */
.fig-svg.s-nu .flame { opacity: 1; animation: flame 1s infinite alternate; }
.fig-svg.s-nu .face-skin { fill: #e6a08c; }
@keyframes flame { from { transform: scaleY(.9) translateY(2px); } to { transform: scaleY(1.15) translateY(-3px); } }
/* 大惊：抖 */
.fig-svg.s-jing .shake { animation: shake .18s infinite; }
@keyframes shake { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-4px)} 75%{transform:translateX(4px)} }
/* 大恐：缩（整体缩小） */
.fig-svg.s-kong .fig-root { transform: scale(.86); transform-origin: 160px 240px; transition: transform .4s var(--ease); }
/* 大饱：肚子鼓 */
.fig-svg.s-bao .belly { transform: scale(1.5); fill: #e9cf9c; }
/* 大饥：流汗 + 发抖 */
.fig-svg.s-ji .sweat { opacity: 1; animation: drip 1.1s infinite; }
.fig-svg.s-ji .shake { animation: shake .22s infinite; }
@keyframes drip { 0%{transform:translateY(0);opacity:.2} 50%{opacity:1} 100%{transform:translateY(26px);opacity:0} }
/* 大渴：张嘴 + 干瘪 */
.fig-svg.s-ke .mouth { stroke-width: 6; }
.fig-svg.s-ke .tongue { opacity: 1; }
.fig-svg.s-ke .fig-root { transform: scaleY(.95); transform-origin: 160px 320px; }
/* 大醉：摇晃 */
.fig-svg.s-zui .tilt { animation: sway 1.4s infinite ease-in-out; }
@keyframes sway { 0%,100%{transform:rotate(-7deg)} 50%{transform:rotate(7deg)} }
/* 禁止符号 */
.fig-svg .ban { opacity: 0; transform-box: fill-box; transform-origin: center; }
.fig-svg .ban.pop { animation: banPop .5s var(--ease-back) forwards; }
@keyframes banPop { 0%{opacity:0;transform:scale(0)} 60%{opacity:1;transform:scale(1.3)} 100%{opacity:1;transform:scale(1)} }
.fig-svg .ban-circle { fill: none; stroke: var(--cinnabar); stroke-width: 9; }
.fig-svg .ban-bar { stroke: var(--cinnabar); stroke-width: 9; stroke-linecap: round; }
/* 针 */
.fig-svg .needle { stroke: #8a8a8a; stroke-width: 3; stroke-linecap: round; opacity: 0; }
.fig-svg .needle-tip { fill: #c9c9c9; }
/* 乱流背景 */
.fig-svg .turb { stroke: rgb(160 48 48 / .35); stroke-width: 2; fill: none; opacity: 0; transition: opacity .3s; }
.fig-svg.s-chaos .turb { opacity: 1; }

/* 辅助说明卡（无自定义动画的课）：原创 SVG 配图 */
.figure-card {
  display: grid; place-items: center; gap: 12px; text-align: center;
  color: var(--ink-soft); font-family: var(--kai);
  width: 100%;
}
/* #stage-canvas 是 place-items:center 的网格，.figure-card 作为网格项会按内容
   收缩，与 .figure-art 的百分比宽度互成循环，SVG 掉回 300px 替换元素默认宽
   （症状：左栏卡片很大、配图却只有巴掌大）。强制横向撑满列。 */
.stage-canvas > .figure-card{ justify-self: stretch; width: 100%; }
.figure-art {
  width: min(680px, 100%);
  aspect-ratio: 1 / 1;
  height: auto;
  border-radius: 18px;
  background: var(--paper-card);
  border: 1px solid var(--bronze-soft);
  box-shadow: 0 0 0 4px rgb(212 167 69 / .10), 0 10px 24px rgb(60 50 38 / .12);
  display: grid; place-items: center; overflow: hidden;
  animation: figure-in .6s var(--ease-back) both;
  cursor: zoom-in; position: relative;
}
.figure-art:hover { box-shadow: 0 0 0 8px rgb(212 167 69 / .18), 0 12px 28px rgb(60 50 38 / .18); }
.figure-art::after {
  content: "🔍 点击放大";
  position: absolute; bottom: 10px; right: 14px;
  font-size: 11px; color: var(--bronze); opacity: 0; transition: opacity .25s;
  font-family: var(--sans); pointer-events: none;
}
.figure-art:hover::after { opacity: 0.8; }
.figure-art svg {
  width: 100%; height: 100%; display: block;
}
.figure-art text { font-family: var(--kai), 'KaiTi', 'STKaiti', serif; }
.figure-note { font-size: 13px; max-width: 420px; line-height: 1.7; }

.figure-art.herb-art { cursor: default; aspect-ratio: auto; overflow: visible; }
.figure-art.herb-art::after { display: none; }
.figure-art.lesson-fig-art { cursor: zoom-in; padding: 10px; background: #111; }
.figure-art.lesson-fig-art::after { display: block; }
.lesson-fig-img { width: 100%; height: auto; display: block; border-radius: 10px; }
.lesson-fig-cap { margin: 8px 4px 2px; font-size: 12px; color: var(--ink-faint); }
.herb-plate { width: 100%; text-align: center; padding: 8px 10px 12px; }
.herb-plate-main { display: block; border-radius: 12px; overflow: hidden; background: #111; }
.herb-plate-main img { width: 100%; height: auto; display: block; aspect-ratio: 4 / 3; object-fit: cover; }
.herb-swipe {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  background: #111;
  touch-action: pan-y;
  user-select: none;
}
.herb-swipe-track {
  display: flex;
  width: 100%;
  transition: transform .28s ease;
}
.herb-slide {
  flex: 0 0 100%;
  width: 100%;
  min-width: 100%;
}
.herb-slide img {
  width: 100%; height: auto; display: block;
  aspect-ratio: 4 / 3; object-fit: contain;
  background: #111; max-height: min(48vh, 420px);
  -webkit-user-drag: none;
}
.herb-swipe-tag {
  position: absolute; top: 8px; left: 8px; z-index: 2;
  font-size: 11px; letter-spacing: .06em;
  color: #f3d9a0; background: rgba(14, 15, 18, .72);
  border: 1px solid rgba(212, 160, 74, .35);
  border-radius: 999px; padding: 2px 8px;
  pointer-events: none;
}
.herb-swipe-prev, .herb-swipe-next {
  position: absolute; top: 50%; transform: translateY(-50%);
  z-index: 2; width: 32px; height: 32px; border-radius: 50%;
  border: 0; background: rgba(14, 15, 18, .55); color: #f6efe2;
  font-size: 22px; line-height: 1; cursor: pointer;
}
.herb-swipe-prev { left: 6px; }
.herb-swipe-next { right: 6px; }
.herb-swipe-dots {
  position: absolute; left: 0; right: 0; bottom: 8px;
  display: flex; justify-content: center; gap: 6px; z-index: 2;
}
.herb-dot {
  width: 6px; height: 6px; border-radius: 50%; border: 0; padding: 0;
  background: rgba(255, 255, 255, .35); cursor: pointer;
}
.herb-dot.on { background: #d4a04a; }
.herb-plate-cap { margin: 8px 4px 0; font-size: 12.5px; color: var(--ink-soft); letter-spacing: .04em; line-height: 1.6; }
.herb-fakes { display: flex; gap: 8px; justify-content: center; margin-top: 10px; flex-wrap: wrap; }
.herb-fake { width: 72px; text-decoration: none; color: var(--ink-faint); font-size: 11px; }
.herb-fake img { width: 72px; height: 54px; object-fit: cover; border-radius: 6px; border: 1px solid var(--line); display: block; }
.herb-fake span { display: block; margin-top: 3px; }
.herb-plate-link {
  display: inline-block; margin-top: 10px; font-size: 13px; letter-spacing: .06em;
  color: var(--bronze-bright, #d4a745); border: 1px solid rgba(168, 118, 44, .45);
  border-radius: 999px; padding: 4px 14px; text-decoration: none;
}
.herb-plate-link:hover { background: rgba(168, 118, 44, .12); }
/* 香港浸会大学药材图：底部来源链接行 + 版权小字 */
.herb-plate-links {
  display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin-top: 10px;
}
.herb-plate-links .herb-plate-link { margin-top: 0; }
.herb-plate-credit {
  margin: 8px 4px 0; font-size: 11px; line-height: 1.5;
  color: var(--ink-faint); letter-spacing: .03em; opacity: .75;
}

/* ====== 配图放大灯箱 ====== */
.fig-lightbox {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(30, 24, 18, 0.88);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  animation: lb-fade .3s ease both;
}
@keyframes lb-fade { from { opacity: 0; } to { opacity: 1; } }
.fig-lightbox.lb-closing { animation: lb-fade .25s ease reverse both; }
.fig-lb-stage {
  position: relative; width: 90vw; height: 82vh;
  display: grid; place-items: center; overflow: hidden;
  border-radius: 12px; background: rgba(255, 254, 249, 0.03);
  border: 1px solid rgba(212, 167, 69, 0.2);
}
.fig-lb-stage svg {
  max-width: none; max-height: none;
  width: 600px; height: 600px;
  transition: transform .2s ease;
  cursor: grab; filter: drop-shadow(0 8px 24px rgba(0,0,0,.4));
}
.fig-lb-stage svg:active { cursor: grabbing; }
.fig-lb-stage img {
  max-width: 86vw; max-height: 78vh;
  width: auto; height: auto;
  transition: transform .2s ease;
  cursor: grab; filter: drop-shadow(0 8px 24px rgba(0,0,0,.4));
}
.fig-lb-stage img:active { cursor: grabbing; }
.fig-lb-bar {
  display: flex; gap: 12px; align-items: center;
  margin-top: 16px; padding: 8px 20px;
  background: rgba(255, 254, 249, 0.08); border-radius: 30px;
  backdrop-filter: blur(8px);
}
.fig-lb-btn {
  width: 42px; height: 42px; border-radius: 50%; border: none;
  background: rgba(212, 167, 69, 0.2); color: #fffef9;
  font-size: 20px; cursor: pointer; display: grid; place-items: center;
  transition: background .2s; font-family: var(--sans);
}
.fig-lb-btn:hover { background: rgba(212, 167, 69, 0.4); }
.fig-lb-btn.close { background: rgba(160, 48, 48, 0.3); }
.fig-lb-btn.close:hover { background: rgba(160, 48, 48, 0.5); }
.fig-lb-zoom-val {
  color: #d4a745; font-size: 14px; min-width: 60px; text-align: center;
  font-family: var(--sans);
}
.fallback-emblem .big {
  width: 130px; height: 130px; border-radius: 50%;
  display: grid; place-items: center; font-family: var(--serif);
  font-size: 64px; color: var(--bronze);
}
@keyframes figure-in {
  from { opacity: 0; transform: scale(.85); }
  to   { opacity: 1; transform: scale(1); }
}

/* 窄屏：导航换行更宽松 */
@media (max-width: 640px) {
  .nav { gap: 6px; }
  .ntab { padding: 7px 12px; font-size: 13px; }
  .nav-sep { display: none; }
}

/* =========================================================================
 * 趣味学堂 · 课程目录（TOC）侧栏
 * ========================================================================= */
.learn-body {
  display: grid;
  grid-template-columns: 264px 1fr;
  gap: 26px;
  align-items: start;
  margin-top: 26px;
}
.learn-toc {
  position: sticky;
  top: 14px;
  max-height: calc(100vh - 28px);
  overflow-y: auto;
  background: var(--paper-card);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px 12px 18px;
  box-shadow: 0 1px 0 #fff inset, 0 10px 30px rgb(60 50 38 / .08);
  scrollbar-width: thin;
}
.learn-toc-title {
  font-family: var(--serif); font-size: 17px; font-weight: 700; color: var(--ink);
  letter-spacing: 3px; text-align: center; padding: 4px 0 10px;
  border-bottom: 1px solid var(--line);
}
.ltoc-ch { margin-top: 12px; }
.ltoc-ch-head {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px;
  font-family: var(--serif); font-size: 14px; font-weight: 600; color: var(--bronze);
  letter-spacing: 1px; cursor: pointer; background: none; border: none;
  padding: 6px 8px; border-radius: 8px; transition: background .25s var(--ease);
}
.ltoc-ch-head:hover { background: var(--paper-deep); }
.ltoc-n {
  font-size: 11px; color: var(--ink-faint); background: var(--paper-deep);
  border: 1px solid var(--line); border-radius: 999px; padding: 1px 8px;
}
.ltoc-items { display: flex; flex-direction: column; gap: 3px; margin: 4px 0 2px; padding-left: 4px; }
.ltoc-item {
  display: flex; align-items: center; gap: 8px; text-align: left;
  font-family: var(--kai); font-size: 13px; color: var(--ink-soft);
  background: none; border: none; cursor: pointer; padding: 6px 8px; border-radius: 8px;
  transition: all .25s var(--ease); width: 100%;
}
.ltoc-item:hover { background: var(--gold-hl); color: var(--ink); }
.ltoc-mark {
  width: 16px; height: 16px; flex: none; display: grid; place-items: center;
  font-size: 11px; color: var(--ink-faint); border: 1px solid var(--line); border-radius: 50%;
}
.ltoc-item.done .ltoc-mark { color: #2f7d4f; border-color: #9bd0b0; background: #eafaf0; }
.ltoc-item.done .ltoc-title { color: var(--ink-soft); }
.ltoc-title { line-height: 1.4; }
/* 目录条目加一行提要（2026-09-23）：条目从「四字标题」变成「标题 + 提要」两行。
   ⛔ .ltoc-main 必须 flex:1 + min-width:0，否则 nowrap 的提要把条目撑宽出容器。 */
.ltoc-item { align-items: flex-start; }
.ltoc-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.ltoc-mark { margin-top: 1px; }
.ltoc-hint {
  font-family: var(--serif); font-size: 11px; line-height: 1.45;
  color: var(--ink-faint); letter-spacing: 0;
  /* ⛔ 不要 nowrap + ellipsis：侧栏 .ltoc-main 只有 ~216px，11px 约 20 字/行，
     而提要是 24~26 字 → nowrap 会把提要裁成「方亮主张先明正常人再辨阴阳；倪师赞…」，
     提要被裁等于没提要。改成最多 2 行换行显示（2026-09-23 实拍发现）。 */
  white-space: normal; overflow-wrap: anywhere;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
  line-clamp: 2; overflow: hidden;
}
.ltoc-book {
  margin: 4px 0 2px 4px; font-family: var(--serif); font-size: 12px; letter-spacing: 1px;
  color: #2c2416; background: linear-gradient(180deg, #e9c46a, #c9952f);
  border: 1px solid #a9781f; border-radius: 8px; padding: 5px 12px; cursor: pointer;
  box-shadow: 0 0 8px rgb(233 196 106 / .35); transition: transform .25s var(--ease);
}
.ltoc-book:hover { transform: translateY(-1px); }

/* 课程页「原文出处」可点击 */
.script .s-src .src-link {
  color: var(--cinnabar); text-decoration: none; border-bottom: 1px dashed var(--cinnabar);
  cursor: pointer; font-weight: 600;
}
.script .s-src .src-link:hover { color: var(--cinnabar-bri); background: rgb(192 57 43 / .08); }

/* =========================================================================
 * 原书阅读器
 * ========================================================================= */
.book-wrap {
  max-width: 1200px; margin: 0 auto; padding: 24px 20px 60px;
  display: grid; grid-template-columns: 270px 1fr; gap: 26px; align-items: start;
}
.book-toc {
  position: sticky; top: 14px; max-height: calc(100vh - 28px); overflow-y: auto;
  background: var(--paper-card); border: 1px solid var(--line); border-radius: 14px;
  padding: 14px 12px 18px; box-shadow: 0 1px 0 #fff inset, 0 10px 30px rgb(60 50 38 / .08);
  scrollbar-width: thin;
}
.book-toc-title { font-family: var(--serif); font-size: 18px; font-weight: 700; color: var(--ink); letter-spacing: 3px; text-align: center; }
.bk-toc-back, .bk-head-back {
  font: inherit; font-size: 13px; letter-spacing: 1px; cursor: pointer;
  color: var(--bronze, #a8762c); background: transparent;
  border: 1px solid var(--line); border-radius: 999px; padding: 5px 12px;
}
.bk-toc-back { display: block; width: 100%; margin: 8px 0 10px; }
.bk-head-back { display: inline-flex; align-items: center; margin: 0 0 10px; }
.bk-toc-back:hover, .bk-head-back:hover { border-color: var(--bronze, #a8762c); color: var(--ink); }
.book-toc-sub { font-family: var(--kai); font-size: 12px; color: var(--ink-faint); text-align: center; margin-bottom: 10px; border-bottom: 1px solid var(--line); padding-bottom: 10px; }
.bk-toc-ch { margin-top: 10px; }
.bk-toc-ch-head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  font-family: var(--serif); font-size: 13px; font-weight: 700; color: var(--bronze);
  letter-spacing: 1px; padding: 4px 6px;
}
.bk-toc-n { font-size: 11px; color: var(--ink-faint); }
.bk-toc-items { display: flex; flex-direction: column; gap: 2px; margin: 2px 0; }
.bk-toc-item {
  display: flex; align-items: center; gap: 8px; text-align: left; width: 100%;
  background: none; border: none; cursor: pointer; padding: 5px 8px; border-radius: 7px;
  font-family: var(--kai); font-size: 12.5px; color: var(--ink-soft); transition: all .22s var(--ease);
}
.bk-toc-item:hover { background: var(--gold-hl); color: var(--ink); }
.bk-toc-item.active { background: linear-gradient(90deg, var(--bronze-soft), var(--bronze-bright)); color: #2c2416; font-weight: 600; }
.bk-toc-ref {
  flex: none; min-width: 52px; font-family: var(--serif); font-size: 11px; color: var(--cinnabar);
  background: rgb(160 48 48 / .08); border: 1px solid rgb(160 48 48 / .25); border-radius: 5px; padding: 0 5px; text-align: center;
}
.bk-toc-item.active .bk-toc-ref { color: #2c2416; background: rgb(44 36 22 / .15); border-color: rgb(44 36 22 / .3); }
.bk-toc-title { line-height: 1.4; }
.bk-toc-book {
  margin: 2px 0 4px; font-family: var(--serif); font-size: 11.5px; letter-spacing: 1px;
  color: #2c2416; background: linear-gradient(180deg, #e9c46a, #c9952f);
  border: 1px solid #a9781f; border-radius: 7px; padding: 4px 10px; cursor: pointer;
  box-shadow: 0 0 6px rgb(233 196 106 / .3);
}
.bk-toc-book:hover { transform: translateY(-1px); }

.book-main {
  background:
    repeating-linear-gradient(0deg, rgb(60 50 38 / .015) 0 27px, transparent 27px 28px),
    var(--paper-card);
  border: 1px solid var(--line); border-radius: 14px; padding: 26px 30px 30px;
  box-shadow: 0 1px 0 #fff inset, 0 12px 36px rgb(60 50 38 / .12);
  min-height: 60vh;
}
.book-panes { display: flex; gap: 8px; margin: 4px 0 14px; }
.book-pane-btn {
  font: inherit; font-size: 13px; letter-spacing: .06em; cursor: pointer;
  color: var(--ink-soft); background: transparent;
  border: 1px solid var(--line); border-radius: 999px; padding: 5px 14px;
}
.book-pane-btn:hover { border-color: var(--bronze); color: var(--ink); }
.book-pane-btn.on {
  color: var(--bronze-bright, #d4a745);
  border-color: rgba(168, 118, 44, .55);
  background: rgba(168, 118, 44, .12);
}
.book-pane-pdf[hidden], .book-pane-text[hidden] { display: none !important; }
.book-page-head { border-bottom: 2px solid var(--line-strong); padding-bottom: 14px; margin-bottom: 18px; }
.bp-ref {
  display: inline-block; font-family: var(--serif); font-size: 13px; font-weight: 700; color: #2c2416;
  background: linear-gradient(180deg, #e9c46a, #c9952f); border: 1px solid #a9781f;
  border-radius: 6px; padding: 2px 10px; letter-spacing: 1px;
}
.bp-chapter { font-family: var(--kai); font-size: 13px; color: var(--bronze); letter-spacing: 2px; margin-top: 8px; }
.bp-title { font-family: var(--serif); font-size: 26px; font-weight: 700; color: var(--ink); letter-spacing: 3px; margin: 4px 0 6px; }
.bp-source { font-size: 12px; color: var(--ink-faint); letter-spacing: 1px; }

.book-pdf-wrap {
  margin-top: 6px; flex: 1 1 auto; overflow: auto; text-align: center;
  background: rgb(60 50 38 / .05); border: 1px solid var(--line);
  border-radius: 12px; padding: 14px; min-height: 420px;
}
.book-pdf-canvas {
  display: block; margin: 0 auto; border: 1px solid var(--line-strong);
  border-radius: 4px; background: #fff; box-shadow: 0 8px 28px rgb(60 50 38 / .2);
}

/* 原书 PDF 加载进度浮层：spinner + 百分比 + 进度条 */
.book-pdf-wrap { position: relative; }
.book-pdf-loading {
  position: absolute; inset: 0; z-index: 5;
  display: flex; align-items: center; justify-content: center;
  background: rgb(248 244 234 / .88); backdrop-filter: blur(2px);
  transition: opacity .35s ease;
}
.book-pdf-loading.done { opacity: 0; pointer-events: none; }
.bpl-card { text-align: center; padding: 26px 34px; }
.bpl-ring {
  width: 44px; height: 44px; margin: 0 auto 14px; border-radius: 50%;
  border: 4px solid rgb(192 57 43 / .15); border-top-color: var(--cinnabar);
  animation: bplSpin 1s linear infinite;
}
@keyframes bplSpin { to { transform: rotate(360deg); } }
.bpl-title {
  font-family: var(--kai); font-size: 15px; color: var(--ink);
  letter-spacing: 2px; margin-bottom: 6px;
}
.bpl-pct {
  font-family: var(--serif); font-size: 24px; font-weight: 700;
  color: var(--cinnabar); letter-spacing: 1px;
}
.bpl-bar {
  width: 220px; height: 6px; margin: 10px auto 10px;
  background: rgb(60 50 38 / .12); border-radius: 3px; overflow: hidden;
}
.bpl-bar i {
  display: block; height: 100%; width: 0;
  background: linear-gradient(90deg, #c9952f, #c0392b);
  border-radius: 3px; transition: width .25s ease;
}
/* 服务器不给 Content-Length 时：进度条退化为流光扫动，数字显示已加载 MB */
.book-pdf-loading.indet .bpl-bar i {
  transition: none; width: 40%;
  background: linear-gradient(90deg, transparent, #c9952f, #e9c46a, #c9952f, transparent);
  animation: bplSweep 1.4s ease-in-out infinite;
}
@keyframes bplSweep { from { transform: translateX(-110%); } to { transform: translateX(280%); } }
.bpl-sub {
  font-family: var(--kai); font-size: 12px; color: var(--ink-faint);
  letter-spacing: 1px; max-width: 260px; line-height: 1.7;
}
.book-toolbar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-top: 14px; padding: 10px 12px; border: 1px solid var(--line);
  border-radius: 10px; background: var(--paper-deep);
}
.book-toolbar .bk-page-no { min-width: 96px; text-align: center; }
.bk-sep { width: 1px; height: 20px; background: var(--line-strong); margin: 0 4px; }
.bk-btn.sm { padding: 6px 12px; font-size: 13px; letter-spacing: 1px; }
.bk-toc-item.onpage { box-shadow: inset 3px 0 0 var(--bronze); background: var(--gold-hl); }
.book-note {
  font-family: var(--kai); font-size: 12px; color: var(--ink-faint);
  text-align: center; margin-top: 12px; letter-spacing: 1px;
}

/* 方证内容面板：汉唐药方无扫描件时直接展示蒸馏卡片（复用 para/hl/quote/tip 语义） */
.book-content {
  margin-top: 18px; padding: 18px 20px; background: var(--paper-deep);
  border: 1px solid var(--line); border-radius: 12px; line-height: 1.9;
}
.book-content .para { font-size: 15.5px; color: var(--ink); margin: 0 0 12px; }
.book-content .hl {
  font-size: 15.5px; color: var(--ink); margin: 0 0 12px; padding: 8px 14px;
  background: var(--gold-hl); border-left: 3px solid var(--bronze); border-radius: 6px;
}
.book-content .quote {
  font-size: 14px; color: var(--ink-soft); margin: 0 0 12px; padding: 8px 14px;
  border-left: 3px solid var(--bronze); background: rgb(60 50 38 / .04); border-radius: 6px; font-family: var(--kai);
}
.book-content .tip {
  font-size: 14px; color: var(--gold-hl-ink); margin: 0 0 12px; padding: 8px 14px;
  background: rgb(192 57 43 / .07); border-left: 3px solid var(--cinnabar); border-radius: 6px;
}
.book-content .para:last-child,
.book-content .hl:last-child,
.book-content .quote:last-child,
.book-content .tip:last-child { margin-bottom: 0; }
.book-content b { color: var(--ink); font-weight: 700; }

/* ========== 医案速览层：3 秒速览 / 3 分钟要点 / 原案全文（三段 tab 切换） ==========
   数据来自 books/<书>/case_notes.json，由 gen_book.py 注入 page.paras 的 layers 段；
   样式挂在本文件 → PC（index.html）与手机（app.html）共用，靠令牌在浅色/墨色主题间自适应。
   tab 交互绑定在 bookview.js 的 bindCaseTabs()。未登记的案件不产生 .cst-*，行为与原来一致。 */
.cst { margin: 0 0 16px; }
.cst-meta {
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center;
  font-size: 12.5px; color: var(--ink-soft); margin: 0 0 10px;
}
.cst-meta b { color: var(--bronze); font-weight: 700; }
.cst-ai {
  font-size: 11px; letter-spacing: .04em; padding: 2px 8px; border-radius: 999px;
  color: var(--bronze); border: 1px solid var(--bronze); opacity: .8;
}
/* tab 条：三格等宽 */
.cst-seg {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 0 0 12px;
}
.cst-seg button {
  font: inherit; cursor: pointer; text-align: center;
  padding: 8px 6px 7px; border-radius: 10px;
  border: 1px solid var(--line); background: var(--paper-deep); color: var(--ink-soft);
  transition: border-color .15s, background .15s;
}
.cst-seg button b { display: block; font-size: 13px; color: var(--ink); font-weight: 700; }
.cst-seg button small { display: block; margin-top: 3px; font-size: 10.5px; letter-spacing: .04em; }
.cst-seg button:hover { border-color: var(--bronze); }
.cst-seg button.on {
  border-color: var(--bronze); background: var(--gold-hl);
  box-shadow: inset 0 -2px 0 var(--bronze);
}
.cst-seg button.on b { color: var(--bronze); }
/* 面板：同一时刻只显示一个 */
.cst-layer { display: none; }
.cst-layer.on { display: block; }
/* ① 3 秒速览 */
.cst-glance {
  padding: 12px 16px; border-radius: 10px; border: 1px solid var(--line);
  border-left: 3px solid var(--bronze); background: var(--gold-hl);
}
.cst-big { margin: 0; font-size: 16px; line-height: 1.9; color: var(--ink); }
.cst-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.cst-chips span {
  font-size: 12px; padding: 2px 9px; border-radius: 999px;
  color: var(--bronze); border: 1px solid var(--bronze); opacity: .85;
}
/* 3 秒层：结论三连（主方 / 疗程 / 转归），窄条一行一条，字号略小于正文 —— 一眼读完 */
.cst-brief { margin-top: 10px; display: grid; gap: 6px; }
.cst-b {
  display: flex; gap: 10px; align-items: baseline;
  padding: 6px 12px; border-radius: 8px; line-height: 1.75;
  border: 1px solid var(--line); background: var(--paper-card, var(--paper-deep));
}
.cst-b .cst-k { display: inline; flex: 0 0 auto; margin: 0; }
.cst-b .cst-v { font-size: 14px; }
/* 3 分钟层顶部：本案速查五格（过程型信息归这里） */
.cst-file { margin: 0 0 12px; padding: 0 0 12px; border-bottom: 1px dashed var(--line); }
.cst-file-h {
  font-size: 11.5px; letter-spacing: .14em; margin: 0 0 8px;
  color: var(--ink-faint, var(--ink-soft));
}
/* 速查五格 */
.cst-facts {
  display: grid; gap: 8px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  margin-top: 10px;
}
.cst-file .cst-facts { margin-top: 0; }
.cst-fact {
  padding: 8px 12px; border-radius: 10px; border: 1px solid var(--line);
  background: var(--paper-card, var(--paper-deep)); line-height: 1.7;
}
.cst-k {
  display: block; font-size: 11.5px; letter-spacing: .12em; margin-bottom: 3px;
  color: var(--ink-faint, var(--ink-soft));
}
.cst-v { font-size: 14.5px; color: var(--ink); }
/* 跳转按钮 */
.cst-cta { margin-top: 12px; }
.cst-btn {
  font: inherit; font-size: 13px; font-weight: 700; cursor: pointer;
  padding: 7px 16px; border-radius: 8px; border: 1px solid var(--bronze);
  background: var(--bronze); color: #241a08;
}
.cst-btn:hover { opacity: .88; }
/* ② 3 分钟要点 */
.cst-points {
  padding: 12px 16px; border-radius: 10px; border-left: 3px solid var(--cinnabar);
  background: rgb(192 57 43 / .07);
}
.cst-pt {
  display: flex; gap: 8px; margin: 0 0 8px; font-size: 14.5px; line-height: 1.8; color: var(--ink);
}
.cst-pt:last-child { margin-bottom: 0; }
.cst-n {
  flex: 0 0 17px; height: 17px; margin-top: 4px; border-radius: 50%; background: var(--cinnabar);
  color: #fff; font-size: 11px; line-height: 17px; text-align: center; font-weight: 700;
}
.cst-pt b { color: var(--gold-hl-ink, var(--bronze)); font-weight: 700; }
/* ③ 原案全文（未删改） */
.cst-full { border-top: 1px dashed var(--line); padding-top: 12px; }
.cst-full-h {
  display: flex; align-items: center; gap: 8px; margin: 0 0 10px;
  font-family: var(--kai); font-size: 13.5px; color: var(--ink-soft);
}
.cst-full-h b { color: var(--ink); font-weight: 700; }
.cst-full-body > .para:last-child,
.cst-full-body > .hl:last-child,
.cst-full-body > .quote:last-child,
.cst-full-body > .tip:last-child { margin-bottom: 0; }
/* 窄屏：tab 文案缩一号，速查格改 2 列 */
@media (max-width: 640px) {
  .cst-seg { gap: 6px; }
  .cst-seg button { padding: 7px 4px 6px; }
  .cst-seg button b { font-size: 12px; }
  .cst-seg button small { display: none; }
  .cst-facts { grid-template-columns: 1fr 1fr; }
}
.book-nopdf {
  margin-top: 14px; padding: 12px 16px; font-family: var(--kai); font-size: 13px;
  color: var(--ink-soft); background: var(--gold-hl); border: 1px dashed var(--bronze);
  border-radius: 10px; line-height: 1.7;
}

/* 趣味学堂 · 方书提示（汉唐药方无课程体系） */
.learn-fangshu-note {
  max-width: 720px; margin: 60px auto; padding: 30px 34px; text-align: center;
  background: var(--paper-card); border: 1px solid var(--line); border-radius: 16px;
  box-shadow: 0 12px 36px rgb(60 50 38 / .12);
}
.learn-fangshu-note h2 { font-family: var(--serif); color: var(--ink); letter-spacing: 3px; }
.learn-fangshu-note p { font-family: var(--kai); color: var(--ink-soft); line-height: 1.9; margin: 10px 0; }
.learn-fangshu-note b { color: var(--bronze); }


.bk-ph {
  background: var(--gold-hl); border: 1px dashed var(--bronze); border-radius: 10px;
  padding: 10px 14px; margin-bottom: 18px; font-family: var(--kai); font-size: 13px;
  color: var(--gold-hl-ink); line-height: 1.7;
}
.bk-ph code { font-family: var(--serif); background: rgb(184 134 11 / .14); padding: 0 4px; border-radius: 4px; }

.book-page { font-family: var(--kai); }
.book-page .para { font-size: 16px; line-height: 2.05; color: var(--ink); margin: 0 0 16px; }
.book-page .hl {
  font-size: 16px; line-height: 2.05; color: var(--gold-hl-ink); background: var(--gold-hl);
  border-left: 4px solid var(--bronze); border-radius: 0 8px 8px 0; padding: 10px 14px; margin: 0 0 16px;
}
.book-page .quote {
  font-size: 15px; line-height: 1.9; color: var(--ink-soft); background: var(--paper-deep);
  border-left: 4px solid var(--dai); border-radius: 0 8px 8px 0; padding: 10px 14px; margin: 0 0 16px; font-style: italic;
}
.book-page .tip {
  font-size: 14px; line-height: 1.8; color: var(--cinnabar); background: rgb(192 57 43 / .07);
  border: 1px solid rgb(192 57 43 / .25); border-radius: 8px; padding: 9px 14px; margin: 0 0 16px;
}
.bk-empty-page { color: var(--ink-faint); font-family: var(--kai); line-height: 1.9; }

.book-nav { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 26px; padding-top: 18px; border-top: 1px solid var(--line); }
.bk-btn {
  font-family: var(--serif); font-size: 14px; letter-spacing: 2px; cursor: pointer;
  border-radius: 9px; padding: 9px 20px; transition: all .3s var(--ease);
  color: var(--ink-soft); background: var(--paper-card); border: 1px solid var(--line-strong);
}
.bk-btn:hover:not(:disabled) { border-color: var(--bronze); color: var(--ink); transform: translateY(-1px); }
.bk-btn:disabled { opacity: .4; cursor: not-allowed; }
.bk-btn.primary { color: #fff; background: linear-gradient(180deg, #4a3d28, #2c2416); border: 1px solid #1c160c; }
.bk-page-no { font-family: var(--serif); font-size: 13px; color: var(--ink-soft); letter-spacing: 1px; }

.book-empty { font-family: var(--kai); color: var(--ink-faint); text-align: center; padding: 60px 0; }

/* 窄屏：目录移到内容上方 */
@media (max-width: 860px) {
  .learn-body { grid-template-columns: 1fr; }
  .learn-toc { position: static; max-height: 280px; }
  .book-wrap { grid-template-columns: 1fr; }
  .book-toc { position: static; max-height: 260px; }
  .book-main { padding: 20px 16px 26px; }
  .bp-title { font-size: 22px; }
}


/* 助教面板 · 剩余提问额度行（会员体系开启时显示） */
.la-quota{margin:10px 14px 0;padding:7px 12px;border:1px dashed rgba(168,118,44,.45);border-radius:9px;font-size:12px;color:#8a6a33;background:rgba(168,118,44,.07)}

/* =========================================================================
 * §V2 课程页增强（阶段1/2 · 2026-09）—— 信息条增强 / 章脑图 / 特块
 * 原则：只追加不改既有规则；变量沿用本文件 :root 主题令牌
 * ========================================================================= */

/* ---- 信息条增强：注解出处 / 内容规模 / 本课核心（金棕高亮） ---- */
.player-meta .meta-core { color: var(--bronze-bright, #d4a745); }
.player-meta .meta-core label { color: var(--bronze, #a8762c); }

/* ---- 本章地图入口（面包屑右侧 + 目录章头） ---- */
.player-breadcrumb { display: flex; align-items: baseline; gap: 8px; }
.player-breadcrumb .crumb-map {
  margin-left: auto; font: inherit; font-size: 12px; cursor: pointer;
  color: var(--bronze-bright, #d4a745); background: rgba(168, 118, 44, .10);
  border: 1px solid rgba(168, 118, 44, .45); border-radius: 999px; padding: 3px 12px;
}
.player-breadcrumb .crumb-map:hover { background: rgba(168, 118, 44, .18); }
/* 看原文：与「本章地图」并排，但不再吃掉 margin-left:auto（否则被顶到中间） */
.player-breadcrumb .crumb-orig { margin-left: 0; }
.ch-map-btn {
  font: inherit; font-size: 12px; cursor: pointer; white-space: nowrap;
  color: var(--bronze-bright, #d4a745); background: transparent;
  border: 1px solid var(--line); border-radius: 999px; padding: 3px 12px;
}
.ch-map-btn:hover { border-color: var(--bronze); background: rgba(168, 118, 44, .10); }
.chapter-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.chapter-head span { flex: 1 1 auto; }

/* ---- 配图 picker 印证引语 ---- */
.fig-quote {
  margin: 10px 2px 0; padding: 8px 12px; font-size: 12.5px; line-height: 1.8;
  color: var(--ink-soft); border-left: 3px solid var(--bronze);
  background: var(--paper-veil); font-family: var(--kai);
}

/* ---- HD-3 特块：五邪对照表 + 临床启发 ---- */
.xw-table { border: 1px solid var(--line); border-radius: 8px; overflow: hidden; margin-bottom: 4px; }
.xw-table .xw-tt {
  padding: 8px 14px; font-size: 12px; letter-spacing: .06em;
  color: var(--bronze-bright, #d4a745); background: rgba(168, 118, 44, .08);
}
.xw-table table { width: 100%; border-collapse: collapse; }
.xw-table th, .xw-table td {
  text-align: left; padding: 8px 10px; font-size: 12.5px; line-height: 1.7;
  border-top: 1px solid var(--line); color: var(--ink-soft); vertical-align: top;
}
.xw-table th { color: var(--bronze); font-weight: 400; letter-spacing: .05em; }
.xw-table td b { color: var(--red, #c0563f); font-weight: 600; font-family: var(--kai); }
.ln-extras li { line-height: 1.9; }

/* ---- 章脑图浮层 ---- */
.chapmap-ov {
  position: fixed; inset: 0; z-index: 90; display: flex; align-items: flex-start;
  justify-content: center; background: rgba(8, 9, 12, .78);
  opacity: 0; transition: opacity .18s ease; overflow-y: auto; padding: 4vh 16px;
}
.chapmap-ov.on { opacity: 1; }
.chapmap-panel {
  width: min(980px, 96vw); background: var(--paper, #14171e);
  border: 1px solid var(--line); border-radius: 12px; padding: 20px 24px 26px;
  box-shadow: 0 18px 60px rgba(0, 0, 0, .5);
}
.chapmap-head { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; }
.chapmap-head h2 { margin: 0; font-family: var(--serif); font-size: 19px; font-weight: 600; color: var(--ink); letter-spacing: 1px; }
.chapmap-pos { font-size: 12px; color: var(--bronze-bright, #d4a745); letter-spacing: .08em; }
.chapmap-close {
  margin-left: auto; font: inherit; font-size: 12px; cursor: pointer;
  color: var(--ink-soft); background: transparent; border: 1px solid var(--line);
  border-radius: 999px; padding: 4px 12px;
}
.chapmap-close:hover { color: var(--ink); border-color: var(--bronze); }
.chapmap-brief { font-size: 12.5px; line-height: 1.9; color: var(--ink-faint); margin: 8px 0 2px; max-width: 780px; }
.chapmap-svg { width: 100%; height: auto; display: block; margin-top: 8px; }
.chapmap-tip { font-size: 11px; color: var(--ink-faint); margin: 6px 0 0; }
.cm-node { cursor: pointer; }
.cm-node rect { fill: var(--paper-veil, #191c23); stroke: var(--line); transition: stroke .15s; }
.cm-node:hover rect { stroke: var(--bronze); }
.cm-node.on rect { stroke: var(--red, #c0563f); fill: rgba(192, 86, 63, .14); }
.cm-node .cm-id { fill: var(--bronze); font-size: 10.5px; }
.cm-node .cm-t { fill: var(--ink-soft); font-size: 14px; font-family: var(--kai); }
.cm-node.on .cm-t { fill: var(--ink); }
.cm-node .cm-here { fill: var(--red, #e08a72); font-size: 11px; }
.cm-dot { fill: var(--line); }
.cm-leaf { fill: var(--ink-faint); font-size: 12px; }
.cm-wait { fill: var(--ink-faint); font-size: 11.5px; font-style: italic; opacity: .7; }

/* §V2 附带修复：窄屏播放器底栏换行（此前 390px 下 foot-btn 溢出视口） */
@media (max-width: 560px) {
  .player-foot { flex-wrap: wrap; gap: 10px; }
  .foot-prog { order: 3; flex: 1 1 100%; }
}

/* §V2 附带修复：theme.css 提层规则（body>*:not([hidden]):not(.hd){position:relative;z-index:1}）
 * 会把 .chapmap-ov 从 fixed 拽成 relative 掉到页尾（FAB/弹窗同款坑），按既有先例拉回。 */
body > .chapmap-ov { position: fixed !important; z-index: 9999 !important; }

/* §V2：速览层原文白话对照行（gen_notes_ai v4 source_plain） */
.ln-src .ln-src-plain {
  margin: 8px 0 0; padding-top: 8px; border-top: 1px dashed var(--line-strong, #3a3f4b);
  font-size: 12.5px; line-height: 1.8; color: var(--ink-faint, #8b8578);
}
.ln-src .ln-src-plain b { color: var(--bronze, #a8762c); font-weight: 400; margin-right: 6px; font-size: 11px; }


/* ===== App 壳 / 窄屏阅读：先见字，图示折叠；桌面 ≥961 保持左右分栏 ===== */
.player.app-reader .player-main,
.player.app-reader .fig-body { /* wrapper always present */ }
@media (max-width: 640px) {
  .player-main { grid-template-columns: 1fr !important; gap: 10px; padding: 8px 16px 12px; }
}
.player:not(.app-reader) .fig-body { display: contents; }
.player.app-reader {
  background: #0e0f12; color: #f6efe2;
  min-height: 100dvh; height: 100dvh;
  display: flex; flex-direction: column;
  padding-bottom: 0;
}
.player.app-reader .player-main {
  grid-template-columns: 1fr !important; gap: 10px;
  padding: 8px 16px 20px;
  flex: 1; min-height: 0; overflow: auto;
}
.player.app-reader .reader-top {
  position: sticky; top: 0; z-index: 12; flex: none;
  display: flex; flex-direction: column; gap: 6px;
  padding: calc(8px + env(safe-area-inset-top)) 12px 8px;
  background: #0e0f12; border-bottom: 1px solid #2b2c33;
}
.player.app-reader .reader-top-row {
  display: flex; align-items: center; gap: 8px;
}
.player.app-reader .reader-back,
.player.app-reader .reader-ico {
  width: 36px; height: 36px; border-radius: 11px; flex: none;
  background: #1a1c22; border: 1px solid #2b2c33; color: #c0453a;
  font-size: 16px; font-weight: 700; cursor: pointer;
}
.player.app-reader .reader-titles { flex: 1; min-width: 0; }
.player.app-reader .reader-titles small { display: none; }
.player.app-reader .reader-titles b { display: block; font-size: 15px; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.player.app-reader .stage {
  min-height: 0 !important; background: #14161b; border: 1px solid #2b2c33; border-radius: 14px;
  box-shadow: none; overflow: hidden;
}
.player.app-reader .fig-toggle {
  width: 100%; display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; background: #14161b; color: #f6efe2; cursor: pointer;
  font-size: 14px; font-weight: 600;
}
.player.app-reader .fig-thumb {
  width: 36px; height: 28px; border-radius: 6px; flex: none;
  background: linear-gradient(160deg, #3a2a16, #1a1410); border: 1px solid #2b2c33;
}
.player.app-reader .fig-body { display: none; }
.player.app-reader.fig-open .fig-body { display: block; }
.player.app-reader:not(.fig-open) .stage { min-height: 0; }
.player.app-reader .stage-canvas { min-height: 0; padding: 8px; }
.player.app-reader .script { padding: 4px 0 16px; }
.player.app-reader .script .para,
.player.app-reader .ln-plain,
.player.app-reader .ln-big,
.player.app-reader .ln-layer {
  font-size: 17px; line-height: 1.75; color: #f6efe2;
}
.player.app-reader .script .para { margin: 0 0 18px; }
.player.app-reader .ln-seg {
  position: static; top: auto; z-index: auto;
  display: flex; gap: 0; margin: 0; padding: 3px;
  background: #1a1c22; border: 1px solid #2b2c33; border-radius: 10px;
}
.player.app-reader .ln-seg button {
  flex: 1; height: 28px; padding: 0;
  background: transparent; border: 0; border-radius: 8px;
  color: #a99e86; font-size: 12px; font-weight: 650;
}
.player.app-reader .ln-seg button.on { background: #d4a04a; color: #1a1208; border: 0; }
.player.app-reader .ln-seg button.on b { color: #1a1208; }
.player.app-reader .ln-seg button b { font-size: 12px; color: inherit; font-weight: 650; }
.player.app-reader .ln-seg button small { display: none; }
.player.app-reader .ln-glance { background: #14161b; border-color: #3a3428; }
.player.app-reader .player-foot {
  position: static; left: auto; right: auto; bottom: auto; z-index: 13;
  flex: none; width: 100%; box-sizing: border-box;
  max-width: none; margin: 0; padding: 8px 12px calc(8px + env(safe-area-inset-bottom));
  background: #14161b; border-top: 1px solid #2b2c33; gap: 8px;
}
.player.app-reader .learn-btn { display: none; }
.player.app-reader .foot-btn.primary { background: #d4a04a; border-color: #d4a04a; color: #1a1208; }
.player.app-reader .ln-meta { display: none; }

.learn-body.app-hub { grid-template-columns: 1fr; gap: 12px; margin-top: 8px; }
.learn-body.app-hub .learn-toc { display: none; }
.learn-wrap .learn-hero.app-hero {
  display: flex; align-items: center; gap: 12px; text-align: left;
  background: #14161b; border: 1px solid #2b2c33; border-radius: 16px; padding: 14px;
}
.learn-hero.app-hero .seal-big { width: 56px; height: 72px; margin: 0; font-size: 22px; }
.learn-hero.app-hero h2 { font-size: 18px; margin: 0; }
.learn-hero.app-hero p { font-size: 12px; margin: 4px 0 0; }
.app-hero-actions { display: flex; gap: 8px; margin: 10px 0 4px; }
.app-hero-actions .nx-btn { height: 34px; padding: 0 14px; border-radius: 9px; font-size: 13px; font-weight: 600; display: inline-flex; align-items: center; }
.app-hero-actions .nx-btn-gold { background: #d4a04a; color: #1a1208; }
.app-hero-actions .nx-btn-ghost { border: 1px solid #2b2c33; background: #1a1c22; }
body.nx-app .fh-tabs { position: sticky; top: 0; z-index: 8; background: #0e0f12; padding: 8px 0; gap: 6px; }
body.nx-app .fh-tab { padding: 6px 12px; font-size: 13px; border-radius: 999px; }

.nx-lesson-toc { position: fixed; inset: 0; z-index: 80; }
.nx-toc-mask { position: absolute; inset: 0; background: rgba(35,31,27,.45); border: 0; }
.nx-toc-sheet {
  position: absolute; left: 0; right: 0; bottom: 0; max-height: 86%;
  background: #14161b; border-radius: 22px 22px 0 0; display: flex; flex-direction: column;
  padding: 8px 0 calc(12px + env(safe-area-inset-bottom));
}
.nx-toc-sheet .grab { width: 40px; height: 4px; background: #3a3b44; border-radius: 99px; margin: 6px auto 0; }
.nx-toc-sheet header { display: flex; align-items: center; justify-content: space-between; padding: 8px 16px; }
.nx-toc-sheet header h3 { margin: 0; font-size: 16px; }
.nx-toc-sheet header button { color: #c0453a; font-weight: 600; background: none; border: 0; }
.nx-toc-list { overflow: auto; padding: 0 8px 8px; }
.nx-toc-item {
  display: block; width: 100%; text-align: left; padding: 12px 10px;
  border: 0; border-bottom: 1px solid #2b2c33; background: none; cursor: pointer;
}
.nx-toc-item strong { display: block; font-size: 14px; color: #f6efe2; }
.nx-toc-item small { color: #a99e86; font-size: 11px; }
/* 手机目录也走「标题 + 一行提要」；提要单独一档颜色，跟作者行区分开 */
.nx-toc-hint { display: block; margin-top: 2px; line-height: 1.5; color: #9c937c; }
.nx-toc-item.on strong { color: #d4a04a; }

/* 原书表格（生成器还原的 <table class="gz-tb">，目前用于跟诊过程 GZ-12 的两张表） */
/* ⛔ 讲稿栏（PC 双栏版）只有 ~440px，而十问表 5 列 + 14 字长格至少 480px
   → 必然横向溢出。所以必须给**看得见的滚动条**当操作提示，否则读者以为表被裁了
   （2026-09-23 实拍：受病的脏腑列被容器边缘切掉，看起来像 bug）。 */
.script-tbl {
  margin: 14px 0; overflow-x: auto; -webkit-overflow-scrolling: touch;
  padding-bottom: 6px; scrollbar-width: thin;
}
.script-tbl::-webkit-scrollbar { height: 9px; }
.script-tbl::-webkit-scrollbar-track { background: var(--paper-deep); border-radius: 5px; }
.script-tbl::-webkit-scrollbar-thumb { background: #c9bba0; border-radius: 5px; }
.script-tbl::-webkit-scrollbar-thumb:hover { background: #a9926a; }
.gz-tb { border-collapse: collapse; width: 100%; min-width: 480px; font-family: var(--serif); font-size: 13px; }
.gz-tb th, .gz-tb td {
  border: 1px solid var(--line); padding: 5px 8px; line-height: 1.5;
  text-align: left; vertical-align: top; color: var(--ink-soft);
}
.gz-tb th { background: var(--paper-deep); color: var(--ink); font-weight: 600; white-space: nowrap; }
.gz-tb tbody tr:nth-child(even) { background: rgb(0 0 0 / .02); }
.gz-tb tr.gz-tb-note td { background: var(--gold-hl); color: var(--ink-soft); font-size: 12px; }

@media (max-width: 640px) {
  .player:not(.app-reader) .stage { min-height: 0; }
  .player:not(.app-reader) .stage-canvas { min-height: 160px; }
  .script .para { font-size: 17px; line-height: 1.75; }
  .learn-body { grid-template-columns: 1fr; }
  .learn-toc { display: none; }
  .book-wrap { grid-template-columns: 1fr; }
  .book-toc { position: static; max-height: none; display: none; }
  .book-main { padding: 16px 16px 28px; }
  .bk-toc-toggle-mobile { display: block; }
}

@media (min-width: 961px) {
  .player:not(.app-reader) .player-main { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); }
  .player:not(.app-reader) .fig-toggle { display: none; }
  .player:not(.app-reader) .fig-body { display: block; }
}


/* 三层笔记：app.html 不加载 ink.css，这里补浅色规则 */
.ln-layer { display: none; }
.ln-layer.on { display: block; }
.ln-seg { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin: 12px 0 0; }
.ln-seg button { background: #14161b; border: 1px solid #2b2c33; border-radius: 8px; color: #a99e86; padding: 9px 4px 7px; cursor: pointer; }
.ln-seg button b { display: block; font-size: 13px; color: #f6efe2; }
.ln-seg button small { font-size: 10.5px; color: #6e6758; }
.ln-seg button.on { border-color: #c0453a; background: rgba(159,47,36,.08); }
.ln-glance { border: 1px solid #3a3428; border-radius: 10px; padding: 16px 18px; background: #14161b; }
.ln-big { font-size: 17px; line-height: 1.75; color: #f6efe2; margin: 0; }
.ln-plain { border-left: 3px solid #b9812e; background: rgba(185,129,46,.08); padding: 12px 15px; font-size: 17px; line-height: 1.75; color: #f6efe2; }

/* App 书主页：封面 + 继续学 + 检索 + 按章手风琴 */
.learn-wrap.app-hub-wrap { padding: 10px 16px 28px; }
.hub-top { display: flex; align-items: center; margin: 2px 0 10px; }
.hub-back {
  color: #f3d9a0; font-weight: 650; font-size: 14px;
  background: none; border: 0; padding: 4px 0; cursor: pointer;
}
.hub-continue {
  display: flex; align-items: center; justify-content: center;
  width: 100%; height: 44px; margin: 10px 0 12px;
  background: #d4a04a; color: #1a1208; border: 0; border-radius: 12px;
  font-size: 16px; font-weight: 700; cursor: pointer;
}
.hub-search {
  display: flex; align-items: center; gap: 8px;
  background: #14161b; border: 1px solid #2b2c33; border-radius: 12px;
  padding: 10px 12px; margin: 0 0 10px;
}
.hub-search input {
  flex: 1; width: 100%; background: none; border: 0; outline: 0;
  color: #f6efe2; font-size: 14px;
}
.hub-hits { display: flex; flex-direction: column; gap: 4px; margin-bottom: 12px; }
.hub-acc { display: flex; flex-direction: column; gap: 8px; }
.hub-ch {
  background: #14161b; border: 1px solid #2b2c33; border-radius: 14px; overflow: hidden;
}
.hub-ch-head {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 12px 14px; background: none; border: 0; color: #f6efe2; cursor: pointer; text-align: left;
}
.hub-ch-title { font-size: 14px; font-weight: 650; }
.hub-ch-n { font-size: 11px; color: #a99e86; flex: none; }
.hub-ch-body { display: none; border-top: 1px solid #2b2c33; }
.hub-ch.open .hub-ch-body { display: block; }
.hub-row {
  width: 100%; display: flex; align-items: center; gap: 10px;
  padding: 11px 14px; background: none; border: 0; border-bottom: 1px solid #2b2c33;
  color: #f6efe2; cursor: pointer; text-align: left;
}
.hub-row:last-child { border-bottom: 0; }
.hub-n { width: 28px; flex: none; font-size: 12px; color: #6e6758; font-variant-numeric: tabular-nums; }
.hub-tt { flex: 1; min-width: 0; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hub-dot { width: 7px; height: 7px; border-radius: 50%; background: #2b2c33; flex: none; }
.hub-dot.on { background: #8fbf77; }
.hub-row.last .hub-tt { color: #d4a04a; }
.hub-tabs { margin: 0 0 10px; }
body.nx-app .fh-wrap { padding: 10px 16px 24px; }
body.nx-app .fh-tabs { position: static; padding: 0 0 10px; }

.player.app-reader .bp-ref { font-size: 12px; color: #d4a04a; margin: 0 0 4px; }
.player.app-reader .bp-chapter { font-size: 12px; color: #a99e86; margin: 0 0 12px; }


/* App 书主页滚动：整页到最后一章 */
body.nx-app.nx-book .learn-wrap.app-hub-wrap,
body.nx-app.nx-book .fh-wrap {
  height: auto;
  overflow: visible;
  touch-action: pan-y;
  padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px) + 28px);
}
body.nx-app.nx-book .hub-acc,
body.nx-app.nx-book .hub-ch-body {
  max-height: none;
  overflow: visible;
}
