/* ==========================================================================
   Clash百科 · deepdoc.css —— 协议参考长卷专属样式
   卷首词条头 + 装框小图版 + 九章长卷 + 卷末索引。
   颜色只引用 base.css 的设计令牌;蚀刻动效类复用 components.css。
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. 卷首:左词条头,右装框小图版
   -------------------------------------------------------------------------- */
.doc-hero{
  display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);
  gap:40px;align-items:center;
  padding-top:46px;padding-bottom:40px;
}
.doc-hero-text{min-width:0}
.doc-hero h1{margin-top:16px}
.doc-hero .lead{margin-top:16px;max-width:66ch}
.doc-rel{margin-top:14px;font-size:13.5px;color:var(--text-muted);line-height:1.9;max-width:66ch}
.doc-rel a{font-weight:700}

/* 装框小图版(双层墨线框与图注复用 components.css 的 .plate-outer/.plate-inner/.cap) */
.doc-plate{min-width:0;margin:0}
.doc-plate .plate-outer{flex:none}
.doc-plate .plate-inner{height:auto}
.doc-plate .etch{height:auto}
.doc-plate figcaption{margin-top:10px;text-align:center}

/* --------------------------------------------------------------------------
   2. 图版蚀刻机件填描(gear-a/gear-b/flow/flow-main 动效在 components.css)
   -------------------------------------------------------------------------- */
.mach-box{fill:var(--mach-paper);stroke:var(--ink);stroke-width:1.6}
.pipe{stroke:var(--ink);stroke-width:1.4;fill:none}
.pipe-flow{stroke:var(--ink);stroke-width:1.2;fill:none;stroke-dasharray:6 6;opacity:.75}
.pipe-flow-a{stroke:var(--cinnabar);stroke-width:1.4;fill:none;stroke-dasharray:6 6}
.gear-wheel{stroke:var(--ink);fill:none;stroke-width:9;stroke-dasharray:8 7}
.gear-wheel-s{stroke:var(--ink);fill:none;stroke-width:7;stroke-dasharray:6 5}
.gear-hub{stroke:var(--ink);fill:none;stroke-width:1.4}
.hatch{stroke:var(--ink);stroke-width:1;opacity:.22}

/* --------------------------------------------------------------------------
   3. 长卷正文节奏
   -------------------------------------------------------------------------- */
.doc-body{padding-top:38px;padding-bottom:72px}
.doc-toc-kicker{margin-bottom:14px}

/* --------------------------------------------------------------------------
   4. 卷末索引
   -------------------------------------------------------------------------- */
.doc-end{margin-top:56px}
.doc-end-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.doc-end-grid > *{min-width:0}
.doc-links{list-style:none;padding:0;margin:10px 0 0}
.doc-links li{border-bottom:1px solid color-mix(in srgb,var(--ink) 25%,transparent)}
.doc-links li:last-child{border-bottom:0}
.doc-links a{
  display:block;padding:9px 2px;font-size:14px;text-decoration:none;
  color:var(--ink);letter-spacing:.02em;
}
.doc-links a::before{content:"§";color:var(--cinnabar);margin-right:9px}
.doc-links a:hover{color:var(--cinnabar)}

/* --------------------------------------------------------------------------
   5. 响应式
   -------------------------------------------------------------------------- */
@media (max-width:960px){
  .doc-hero{grid-template-columns:1fr;gap:26px;padding-top:30px;padding-bottom:30px}
}
@media (max-width:640px){
  .doc-end-grid{grid-template-columns:1fr}
  .doc-body{padding-top:28px;padding-bottom:52px}
}