
/* ============================================================
   「奶蛙是什么」专属：辞书排版
   —— 章节带编号，正文收窄到易读宽度，术语用等宽字体
   —— 这一页没有动效，只有排版（内容页不需要表演）
   ============================================================ */
/* 章节编号（01…05） */
.secnum{
  font-family:var(--mono); font-size:var(--fs-xs); color:var(--text-2);
  display:block; margin-bottom:.9em;
}
/* 区块标题走共享 .sec-title（衬线 + --fs-2xl），不再就地写 clamp。 */
.doc h3{ font-size:var(--fs-lg); letter-spacing:0; margin:2.2em 0 .6em; }
/* 正文加粗改白色提亮，不上色：正文里的每一种颜色都该有理由，
   这里没有理由 —— 只是"我想让它显眼一点"。 */
.doc ul{ margin:1.1em 0 0; display:grid; gap:.7em; }
.doc ul li{ position:relative; padding-left:1.5em; color:var(--text-2); line-height:1.85; font-size:var(--fs-md); }
.doc ul li::before{ content:""; position:absolute; left:.2em; top:.85em; width:8px; height:2px; background:var(--ink); }

/* 一句话定义：三句各占一行，用 <br> 定死断句。
   字号取 --fs-xl（26px，卡片标题档）—— 原来是就地写 clamp(1.4rem,3.4vw,2.3rem)，
   桌面 36.8px 撞上 .doc p 的 760px 行宽上限，只剩 20 字/行，
   三句话被折成六行；26px 下每句正好一行、29 字/行，
   分量由加粗 + 独占一段 + 前后留白承担，不靠字号喊（ADR-27）。 */
.definition{
  font-size:var(--fs-xl); line-height:1.6;
  letter-spacing:0; color:var(--ink); margin:0;
}
/* 强调不再靠颜色 + 下划线两重信号。留一重：加粗。
   两重信号叠在一起是"怕人看不见"，而这一句本来就该被看见。 */
.definition em{ font-style:normal; font-weight:700; }

/* 三个"不是什么"：去掉细线网格，改成三块底色块 —— 分栏靠底色，不靠线 */
.nots{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:var(--gap);
  margin-top:var(--sp-6);
}
.not{ background:var(--paper); border:var(--bw) solid var(--ink); border-radius:var(--r-md); box-shadow:var(--sd-2); padding:clamp(20px,2.4vw,30px); }
.not span{ font-size:var(--fs-xs); color:var(--text-2); }
.not b{ display:block; font-size:var(--fs-lg); letter-spacing:0; margin:var(--sp-2) 0; }
.not p{ margin:0; font-size:var(--fs-sm); color:var(--text-2); line-height:1.8; }

/* ---------- 形象解剖 ---------- */
.anat{ display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(24px,4vw,58px); align-items:center; margin-top:2.4em; }
.anat-stage{
  position:relative; border-radius:var(--r-lg);
  background:var(--paper);
  border:var(--bw) solid var(--ink); box-shadow:var(--sd-3);
  padding:clamp(16px,2.4vw,30px); overflow:hidden;
}
.anat-stage img{ width:100%; filter:drop-shadow(0 16px 22px rgba(26,23,18,.18)); }
/* 标注点：金色带光晕 → 中性。它是一枚"引线钉"，不是装饰灯。 */
.pin{ position:absolute; display:flex; align-items:center; gap:.5em; transform:translate(-50%,-50%); z-index:2; }
.pin i{
  width:10px; height:10px; border-radius:50%; flex:0 0 auto;
  border:2px solid var(--ink); background:var(--cream);
}
.pin b{
  font-family:var(--mono); font-size:var(--fs-xs); color:var(--ink); font-weight:700;
  white-space:nowrap;
}
.pin.r{ flex-direction:row-reverse; }
/* 五个标注点坐标（原先写在 style 属性里） */
.pin-1{ left:50%; top:11%; }
.pin-2{ left:46%; top:23%; }
.pin-3{ left:20%; top:52%; }
.pin-4{ left:50%; top:63%; }
.pin-5{ left:83%; top:36%; }
/* 解剖明细：去掉缝隙铺线，改纯留白 */
.anat-list{ display:grid; gap:var(--sp-3); }
.anat-list div{ padding:0; display:grid; grid-template-columns:auto 1fr; gap:var(--sp-4); align-items:baseline; }
.anat-list dt{ font-family:var(--mono); font-size:var(--fs-xs); color:var(--text-2); white-space:nowrap; }
.anat-list dd{ margin:0; font-size:var(--fs-sm); color:var(--text-2); line-height:1.8; }

/* ---------- 三方圆桌 ---------- */
/* 表格本体走共享层（_base.css：墨底奶黄表头 + 2px 墨线 + 奶油行首列）。
   这里只留本页特有的三样：横向滚动、表题、首列 mono 小字、奶蛙列提亮。 */
.tablewrap{ margin-top:2.4em; overflow-x:auto; }
caption{ text-align:left; padding:1.1rem 1.3rem; font-family:var(--mono); font-size:var(--fs-xs); color:var(--text-2); }
thead th:first-child{ font-family:var(--mono); font-size:var(--fs-xs); font-weight:400; color:rgba(255,246,224,.72); }
/* 表格里的"奶蛙那一列"：靠字重提亮，不靠颜色 ——
   一张三列对照表里，其中一列整列变色会把表读成"三块"。 */
td.hi{ color:var(--ink); font-weight:700; }

/* ---------- 为什么火 ---------- */
.why{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:clamp(14px,1.8vw,22px); margin-top:2.4em; }
.why article{
  border-radius:var(--r-md);
  background:var(--paper);
  border:var(--bw) solid var(--ink); box-shadow:var(--sd-2);
  padding:1.6rem 1.6rem 1.8rem;
}
.why .n{ font-family:var(--mono); font-size:var(--fs-xs); color:var(--text-2); }
.why h3{ font-size:var(--fs-lg); letter-spacing:0; margin:.9em 0 .7em; }
.why p{ margin:0; font-size:var(--fs-sm); color:var(--text-2); line-height:1.85; }

/* ---------- FAQ ---------- */
.faq{ margin-top:2.2em; border-top:2px solid var(--ink); }
.faq details{ border-bottom:2px solid var(--ink); }
.faq summary{
  cursor:pointer; list-style:none; padding:1.3em 2.4em 1.3em 0; position:relative;
  font-size:var(--fs-md); font-weight:700; letter-spacing:0; color:var(--ink);
  transition:color .25s;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:"+"; position:absolute; right:.3em; top:50%; transform:translateY(-50%);
  font-family:var(--mono); font-size:var(--fs-lg); color:var(--text-2); transition:transform .3s;
}
.faq details[open] summary{ color:var(--text); }
.faq details[open] summary::after{ transform:translateY(-50%) rotate(45deg); }
.faq details p{ margin:0 0 1.5em; max-width:36em; }

@media (max-width:980px){
  .anat{ grid-template-columns:1fr; }
  .pin b{ font-size:var(--fs-xs); }
}
