/* ============================================================
   《垒石为室 · 藏族碉楼与民居》—— R8D1 第 07 篇讲义块样式
   作用域全部在 .dl 之下，不外泄到 site.css。
   共用层（p / h2 / .eyebrow / .lede / .note / .warn / .cap /
   .coda / .fine / .sign / .credits / .glance / .gloss-h）由 site.css
   的 .guest-notes 规则提供，这里只补这本册子特有的部件。
   ============================================================ */

.dl{ color:var(--text); }

/* ---------- 封面：线稿 + 四组数字 ---------- */
.dl-hero{ margin:0 0 20px; }
.dl-hero svg{ width:100%; height:auto; display:block; }
.dl .brandline{ font-size:11.5px; letter-spacing:.2em; color:var(--accent); margin:0 0 6px; }
.dl h1{
  font-family:var(--serif); font-size:40px; line-height:1.16; font-weight:400;
  letter-spacing:.14em; color:var(--text); margin:0 0 16px;
}
.dl .sub{ font-family:var(--serif); font-size:17.5px; line-height:1.58; color:var(--text); margin:0 0 14px; }
.dl .deck{ font-size:14.5px; line-height:1.7; color:var(--muted); margin:0 0 4px; }

/* ---------- 章 ---------- */
/* 站点全局 section{padding:96px 0} 是版面级节奏，章内的小节不该继承 */
.dl section{ padding:0; }
.dl-part{ margin:0; }
.dl h2 .lt{ color:var(--accent); }
.dl q{ quotes:"\201C" "\201D"; }
html[lang^="zh"] .dl q{ quotes:"\300C" "\300D"; }

/* ---------- 双栏正文（碉楼 / 碉房） ---------- */
.dl .zc{ display:grid; grid-template-columns:1fr 1fr; gap:24px 34px; margin:18px 0 22px; }
.dl .zc .h{
  font-size:14.5px; font-weight:600; color:var(--accent); letter-spacing:.04em;
  padding-bottom:8px; border-bottom:1.5px solid var(--text); margin:0 0 10px;
}
.dl .zc p{ font-size:15px; line-height:1.76; margin:0 0 10px; }

/* ---------- 编号步骤 ---------- */
.dl .steps{ margin:18px 0 20px; border-top:1px solid var(--line); }
.dl .st{ display:grid; grid-template-columns:26px 1fr; gap:12px; padding:12px 0; border-bottom:1px solid var(--line); }
.dl .st .n{ font-size:13px; font-weight:600; color:var(--accent); }
.dl .st .t{ font-size:15px; line-height:1.76; }

/* ---------- 表 ---------- */
.dl .tbl{ width:100%; border-collapse:collapse; font-size:14px; margin:18px 0 20px; }
.dl .tbl th{
  text-align:left; font-size:11.5px; letter-spacing:.08em; font-weight:600;
  color:var(--accent); padding:0 14px 9px 0; border-bottom:1.5px solid var(--text);
}
.dl .tbl td{ padding:11px 14px 11px 0; border-bottom:1px solid var(--line); vertical-align:top; line-height:1.66; }
.dl .tbl td:first-child{ color:var(--text); font-weight:600; width:34%; }
.dl .tbl.t2 td:first-child{ width:26%; }
.dl .tbl.t3 td:first-child{ width:30%; }

/* ---------- 四组数字 ---------- */
.dl .kpi{
  display:grid; grid-template-columns:repeat(4,1fr); gap:18px;
  margin:26px 0 20px; padding-top:14px; border-top:1.5px solid var(--text);
}
.dl .kpi .n{ font-family:var(--serif); font-size:27px; line-height:1.1; color:var(--accent); }
.dl .kpi .l{ font-size:12px; line-height:1.5; color:var(--muted); margin-top:4px; }

/* ---------- 三格 ---------- */
.dl .tri{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin:22px 0; }
.dl .tri .c{ border-top:1.5px solid var(--text); padding-top:10px; }
.dl .tri .c .h{ font-size:12px; font-weight:600; color:var(--accent); letter-spacing:.04em; margin:0; }
.dl .tri .c .v{ font-family:var(--serif); font-size:23px; line-height:1.2; color:var(--text); margin:5px 0 7px; }
.dl .tri .c .d{ font-size:14px; line-height:1.66; }

/* ---------- 四格（四种地方做法） ---------- */
.dl .quad{ display:grid; grid-template-columns:1fr 1fr; gap:24px 34px; margin:18px 0 22px; }
.dl .quad .c{ border-top:1.5px solid var(--text); padding-top:10px; }
.dl .quad .c .h{ font-size:16px; font-weight:600; color:var(--text); margin:0; }
.dl .quad .c .s{ font-size:12px; letter-spacing:.04em; color:var(--accent); margin:4px 0 7px; }
.dl .quad .c .d{ font-size:14.5px; line-height:1.72; }

/* ---------- 纵向时间轴（四段记载 / 三种材料） ---------- */
.dl .tlz{ margin:18px 0 22px; border-top:1px solid var(--line); }
.dl .tlz .row{
  display:grid; grid-template-columns:148px 1fr; gap:22px;
  padding:14px 0; border-bottom:1px solid var(--line); align-items:baseline;
}
.dl .tlz .row .t{ font-size:13px; line-height:1.6; font-weight:600; color:var(--accent); }
.dl .tlz .row .d{ font-size:15px; line-height:1.78; }

/* ---------- 剖面图 + 图例 ---------- */
.dl .diagram{ margin:20px 0 8px; }
.dl .diagram svg{ width:100%; height:auto; display:block; }
.dl .legend{ display:grid; grid-template-columns:1fr 1fr; gap:16px 28px; margin:14px 0 20px; }
.dl .legend .item{ display:grid; grid-template-columns:20px 1fr; gap:8px; align-items:baseline; }
.dl .legend .no{ font-size:13px; font-weight:600; color:var(--accent); }
.dl .legend .d{ font-size:14px; line-height:1.72; }
.dl .figcap{
  font-size:12.5px; line-height:1.64; color:var(--muted);
  padding-left:12px; border-left:1px solid var(--line); margin:0 0 22px;
}

/* ---------- 引文 / 文献原文 ---------- */
.dl .quote-z{
  background:rgba(176,110,30,.06); border-left:3px solid var(--accent);
  padding:14px 18px; margin:22px 0; font-size:15px; line-height:1.78;
}
.dl .quote-z b{ color:var(--accent); }
.dl .quote-z .src{ display:block; margin-top:7px; font-size:12px; color:var(--muted); }
.dl .doc{
  background:rgba(176,110,30,.04); border:1px solid var(--line);
  padding:14px 18px; margin:22px 0; font-size:15px; line-height:1.78;
}
.dl .doc .s{ display:block; margin-top:7px; font-size:12.5px; color:var(--muted); }

/* ---------- 通栏正文段 ---------- */
.dl .wide-note{ font-size:15.5px; line-height:1.78; margin:0 0 16px; }

/* ---------- 术语八条 ---------- */
.dl .gloss{ display:grid; grid-template-columns:1fr 1fr; gap:0 30px; margin:10px 0 10px; }
.dl .gloss .g{
  display:grid; grid-template-columns:92px 1fr; gap:14px; padding:9px 0;
  border-bottom:1px dotted var(--line); align-items:baseline;
}
.dl .gloss .zh{ font-weight:600; color:var(--text); white-space:normal; }
.dl .gloss .en{ font-size:14px; line-height:1.6; }

/* ---------- 窄屏 ---------- */
@media (max-width:700px){
  .dl h1{ font-size:29px; letter-spacing:.1em; }
  .dl .sub{ font-size:16px; }
  .dl .zc,.dl .quad,.dl .tri,.dl .legend,.dl .gloss,.dl .kpi{ grid-template-columns:1fr; }
  .dl .tlz .row{ grid-template-columns:1fr; gap:5px; }
  .dl .tbl{ font-size:13px; }
  .dl .tbl td:first-child{ width:30%; }
  .dl .kpi{ gap:14px; }
  .dl .tri{ gap:18px; }
}