/* 《公路车手册》站点样式（出版方：骑行功率Lab）
   原则：页头页脚沿用 lifarecord.top 落地页的品牌深色，正文区浅色以保证长文阅读。
   断点：>=1080 双栏（正文 + 目录侧栏）；640-1080 单栏；<640 手机。 */

:root{
  --brand:#0B1220;
  --brand-2:#101C2C;
  --mint:#3AF9C1;
  --mint-ink:#04231A;
  --mint-dim:#0E9C7A;
  --mint-soft:#E8FCF5;

  --page:#F4F7F6;
  --surface:#FFFFFF;
  --surface-2:#F7FAF9;
  --line:rgba(11,18,32,.10);
  --line-2:rgba(11,18,32,.06);

  --ink:#131C26;
  --ink-2:#4E6070;
  --ink-3:#7C8B98;

  --warn-ink:#8A5A05;
  --warn-bg:#FFF8E6;
  --warn-line:#E8C46A;
  --stop-ink:#A6231B;
  --stop-bg:#FEF2F1;
  --stop-line:#E7A9A4;
  --note-ink:#15558C;
  --note-bg:#EFF6FD;
  --note-line:#9CC4E8;

  --radius:12px;
  --radius-lg:16px;
  --measure:44rem;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC",sans-serif;
  /* 正文淡色水印：贴片文件在 asset/watermark.svg，相对本 CSS 解析。
     用真的 SVG 文件而不是 data-URI —— 中文塞进 data-URI 既难读也难改。 */
  --wm:url("watermark.svg");
  --wm-size:300px 200px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body.hb{
  margin:0;background:var(--page);color:var(--ink);
  font-family:var(--font);font-size:16px;line-height:1.75;
  text-rendering:optimizeLegibility;
}
.hb a{color:var(--mint-dim);text-decoration:none}
.hb a:hover{text-decoration:underline}
.hb-skip{position:absolute;left:-9999px;top:0;background:var(--brand);color:#fff;padding:10px 16px;z-index:99}
.hb-skip:focus{left:8px;top:8px}

/* ── 页头 ── */
.hb-header{background:var(--brand);border-bottom:1px solid rgba(255,255,255,.08);position:sticky;top:0;z-index:20}
.hb-header-inner{max-width:1180px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.hb-brand{display:flex;align-items:center;gap:10px;color:#E9F2F0;text-decoration:none}
.hb-brand:hover{text-decoration:none}
.hb-brand-mark{display:block;width:30px;height:30px;border-radius:9px;flex:none}
.hb-brand-text{display:flex;flex-direction:column;line-height:1.25}
.hb-brand-text b{font-size:15px;font-weight:500;letter-spacing:.02em}
.hb-brand-text i{font-style:normal;font-size:11px;color:#7E93A3}
.hb-nav{display:flex;gap:4px;margin-left:auto;flex-wrap:wrap}
.hb-nav a{color:#A9BCC8;font-size:13px;padding:6px 10px;border-radius:8px}
.hb-nav a:hover{color:#E9F2F0;background:rgba(255,255,255,.06);text-decoration:none}
.hb-nav a[aria-current="page"]{color:var(--mint);background:rgba(58,249,193,.10)}
.hb-return{display:inline-flex;align-items:center;gap:4px;flex:none;color:#E9F2F0;font-size:13px;min-height:40px;padding:8px 12px;border:1px solid rgba(255,255,255,.18);border-radius:10px;text-decoration:none}
.hb-return:hover{background:rgba(255,255,255,.08);color:var(--mint);text-decoration:none}
.hb-return:focus-visible{outline:2px solid var(--mint);outline-offset:3px}
@media(max-width:640px){.hb-header-inner{gap:10px}.hb-return{margin-left:auto}.hb-nav{order:3;width:100%;margin-left:0;gap:2px}.hb-nav a{padding:6px 8px}.hb-brand-text i{max-width:175px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}

/* ── 布局 ── */
.hb-main{max-width:1180px;margin:0 auto;padding:28px 20px 64px}
.hb-crumb{font-size:13px;color:var(--ink-3);margin-bottom:14px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.hb-crumb-sep{color:var(--line)}
.hb-crumb a{color:var(--ink-2)}
.hb-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:36px}
@media (min-width:1080px){.hb-layout{grid-template-columns:minmax(0,var(--measure)) 240px}}

/* ── 文章 ── */
.hb-article{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:32px 30px 36px;min-width:0}
@media (max-width:640px){.hb-article{padding:22px 18px 26px;border-radius:var(--radius)}}
.hb-eyebrow{font-size:12px;letter-spacing:.10em;color:var(--mint-dim);text-transform:none;margin:0 0 8px}
.hb-article h1{font-size:29px;line-height:1.35;margin:0 0 14px;font-weight:500;letter-spacing:-.01em}
@media (max-width:640px){.hb-article h1{font-size:23px}}
.hb-lede{font-size:16px;color:var(--ink-2);margin:0 0 18px;padding-left:14px;border-left:3px solid var(--mint)}
.hb-meta{list-style:none;display:flex;flex-wrap:wrap;gap:6px 8px;margin:0 0 26px;padding:0}
.hb-meta li{font-size:12px;color:var(--ink-2);background:var(--surface-2);border:1px solid var(--line-2);border-radius:999px;padding:3px 10px}
.hb-meta b{color:var(--ink);font-weight:500}
.hb-body{min-width:0;overflow-wrap:break-word}
.hb-article{min-width:0;overflow-wrap:break-word}
.hb-body h2{font-size:21px;line-height:1.45;margin:38px 0 14px;font-weight:500;padding-bottom:9px;border-bottom:2px solid var(--line);scroll-margin-top:76px}
.hb-body h2::before{content:"";display:inline-block;width:14px;height:14px;border-radius:3px;background:var(--mint);margin-right:9px;transform:translateY(1px)}
.hb-body h3{font-size:17px;margin:26px 0 10px;font-weight:500;scroll-margin-top:76px}
.hb-body h4{font-size:15px;margin:20px 0 8px;font-weight:500;color:var(--ink-2)}
.hb-body p{margin:0 0 15px}
.hb-body ul,.hb-body ol{margin:0 0 16px;padding-left:1.35em}
.hb-body li{margin:0 0 7px}
.hb-body li>ul,.hb-body li>ol{margin-top:7px}
.hb-body strong{font-weight:500;color:#0A1520}
.hb-body code{background:var(--surface-2);border:1px solid var(--line-2);border-radius:5px;padding:1px 5px;font-size:.9em}
.hb-body hr{border:0;border-top:1px solid var(--line);margin:32px 0}
.hb-body blockquote{margin:0 0 16px;padding:2px 0 2px 14px;border-left:3px solid var(--line);color:var(--ink-2)}
.hb-body a{text-decoration:underline;text-decoration-color:rgba(14,156,122,.35);text-underline-offset:2px}

/* ── 图片与图注 ── */
.hb-figure{margin:22px 0;padding:0}
.hb-figure .hb-img{display:block;width:100%;height:auto;background:var(--surface-2);border:1px solid var(--line-2);border-radius:var(--radius)}
.hb-figure figcaption{font-size:13px;color:var(--ink-2);margin-top:9px;padding-left:10px;border-left:2px solid var(--mint)}
.hb-img{max-width:100%;height:auto}

/* 可点开的示意图。正文栏在手机上只有 ~314px，图按 600+ 单位画 → 缩到约 0.5 倍，
   最小的标注只剩 7px 左右。两条一起用：① 手机端让图“出血”到屏幕边（+24%），
   ② 点开后在放大层里按原尺寸 1:1 渲染。纯改字号没用 —— 这是缩放比问题。 */
.hb-zoom{display:block;width:100%;padding:0;margin:0;border:0;background:none;cursor:zoom-in;position:relative;border-radius:var(--radius)}
.hb-zoom:focus-visible{outline:2px solid var(--mint);outline-offset:3px}
.hb-zoom::after{
  content:"⤢ 点开放大";position:absolute;right:9px;bottom:9px;
  font-size:11px;line-height:1;color:#0B4A3A;background:rgba(58,249,193,.92);
  padding:5px 9px;border-radius:999px;pointer-events:none;
}
@media print{.hb-zoom::after{display:none}}

/* 出血：示意图在手机上占满视口宽度，等于把可用字号直接放大 24%。
   只对「带图注的整图」出血，图片步骤里的小图保持与编号对齐。 */
@media (max-width:640px){
  .hb-figure{margin-left:-38px;margin-right:-38px}
  .hb-figure .hb-img{border-radius:0;border-left:0;border-right:0}
  .hb-figure figcaption{padding-left:28px;padding-right:20px}
  .hb-zoom{border-radius:0}
}

/* 放大层 */
.hb-lightbox{position:fixed;inset:0;z-index:60;background:rgba(7,11,19,.96);overflow:auto;-webkit-overflow-scrolling:touch;padding:52px 10px 24px}
.hb-lightbox[hidden]{display:none}
.hb-lightbox-close{
  position:fixed;top:10px;right:10px;z-index:2;font-family:inherit;font-size:13px;
  color:#04231A;background:var(--mint);border:0;border-radius:999px;padding:8px 14px;cursor:pointer;
}
.hb-lightbox-hint{position:fixed;top:16px;left:12px;margin:0;font-size:12px;color:#8FA3B0;z-index:2}
@media (min-width:640px){.hb-lightbox-hint{display:none}}
.hb-lightbox-stage{display:flex;justify-content:center;align-items:flex-start;min-height:100%}
.hb-lightbox-stage img{
  display:block;background:#fff;border-radius:var(--radius);height:auto;
  /* 关键：不小于图的原始坐标宽度，让 SVG 里的标注回到 1:1；桌面端不放大。 */
  width:max(100%,680px);max-width:none;
}

/* ── 表格（手机靠横向滚动 + 首列吸附） ── */
.hb-table-wrap{position:relative;margin:0 0 20px;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.hb-table-wrap.is-scrollable::before{
  content:"← 左右滑动查看完整表格 →";position:sticky;left:0;display:block;
  font-size:11px;color:var(--ink-3);background:#FBFDFC;padding:5px 12px;border-bottom:1px solid var(--line-2);
}
.hb-table-wrap:focus-visible{outline:2px solid var(--mint-dim);outline-offset:2px}
.hb-table{border-collapse:collapse;width:100%;min-width:520px;font-size:14px}
.hb-table th,.hb-table td{padding:9px 12px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line-2);border-right:1px solid var(--line-2)}
.hb-table th:last-child,.hb-table td:last-child{border-right:0}
.hb-table thead th{background:var(--surface-2);font-weight:500;white-space:nowrap;position:sticky;top:0}
.hb-table tbody tr:last-child td{border-bottom:0}
.hb-table th:first-child,.hb-table td:first-child{position:sticky;left:0;background:#FCFEFD;font-weight:500;z-index:1}
.hb-table thead th:first-child{z-index:2}
.hb-table td:first-child::after,.hb-table th:first-child::after{content:"";position:absolute;top:0;right:-1px;bottom:-1px;width:1px;background:var(--line)}
@media (max-width:640px){.hb-table{min-width:440px;font-size:13.5px}.hb-table th,.hb-table td{padding:8px 10px}}

/* 对比卡：仍是表格语义，靠样式强化「一行一件事」 */
.hb-compare{margin:22px 0}
.hb-compare .hb-table tbody td:first-child{background:var(--mint-soft);color:#0B4A3A}

/* ── 提示块 ── */
.hb-callout{margin:20px 0;padding:14px 16px;border-radius:var(--radius);border:1px solid;font-size:15px}
.hb-callout>p:last-child,.hb-callout>ul:last-child,.hb-callout>ol:last-child,.hb-callout>div:last-child{margin-bottom:0}
.hb-callout-title{margin:0 0 7px;font-weight:500;font-size:14px;letter-spacing:.02em}
.hb-callout-warn{background:var(--warn-bg);border-color:var(--warn-line);color:#5E3F04}
.hb-callout-warn .hb-callout-title{color:var(--warn-ink)}
.hb-callout-stop{background:var(--stop-bg);border-color:var(--stop-line);color:#6E1B15}
.hb-callout-stop .hb-callout-title{color:var(--stop-ink)}
.hb-callout-stop .hb-callout-title::before{content:"停 ";font-weight:500}
.hb-callout-note{background:var(--note-bg);border-color:var(--note-line);color:#12456F}
.hb-callout-note .hb-callout-title{color:var(--note-ink)}

/* ── 可展开补充 ── */
.hb-details{margin:18px 0;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface-2);overflow:hidden}
.hb-details>summary{cursor:pointer;padding:12px 16px;font-size:14px;font-weight:500;color:var(--ink-2);list-style:none;position:relative;padding-right:42px}
.hb-details>summary::-webkit-details-marker{display:none}
.hb-details>summary::after{content:"＋";position:absolute;right:16px;top:50%;transform:translateY(-50%);color:var(--mint-dim);font-size:15px}
.hb-details[open]>summary::after{content:"－"}
.hb-details[open]>summary{border-bottom:1px solid var(--line);background:var(--surface)}
.hb-details-body{padding:14px 16px 2px}
.hb-details-body>*:last-child{margin-bottom:14px}

/* ── 图片步骤 ── */
.hb-steps{margin:22px 0}
.hb-steps ol{counter-reset:hbstep;list-style:none;padding:0;margin:0}
.hb-steps ol>li{counter-increment:hbstep;position:relative;padding-left:42px;margin-bottom:20px}
.hb-steps ol>li::before{
  content:counter(hbstep);position:absolute;left:0;top:1px;width:26px;height:26px;border-radius:50%;
  background:var(--mint);color:var(--mint-ink);font-size:13px;font-weight:500;
  display:flex;align-items:center;justify-content:center;
}
.hb-steps .hb-img{width:100%;border:1px solid var(--line-2);border-radius:10px;background:var(--surface-2);margin-bottom:7px}

/* ── 来源 ── */
.hb-block-title{font-size:12px;font-weight:500;letter-spacing:.08em;color:var(--ink-3);margin:0 0 10px;text-transform:none}
.hb-source{margin:32px 0 0;padding:16px 18px;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius)}
.hb-source-list{list-style:none;margin:0;padding:0;font-size:13px}
.hb-source-item{display:flex;gap:8px;flex-wrap:wrap;align-items:baseline;padding:5px 0;border-bottom:1px dashed var(--line-2);min-width:0}
.hb-source-item:last-child{border-bottom:0}
.hb-source-item a{min-width:0;overflow-wrap:anywhere;word-break:break-all}
/* 来源汇总页会直接显示完整 URL —— 必须允许在任意字符处断行，否则窄屏下会撑破布局。 */
.hb-source-host{font-size:11px;color:var(--ink-3);min-width:0;overflow-wrap:anywhere;word-break:break-all}
.hb-source-meta{margin:10px 0 0;font-size:12px;color:var(--ink-3)}

/* ── 侧栏 ── */
.hb-aside{min-width:0}
@media (min-width:1080px){.hb-aside{position:sticky;top:76px;align-self:start}}
.hb-aside-block{margin:0 0 22px}
.hb-aside-note{font-size:12px;color:var(--ink-3);margin:8px 0 0}
.hb-toc-details{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:6px 0}
.hb-toc-details>summary{cursor:pointer;padding:8px 14px;font-size:13px;font-weight:500;color:var(--ink-2);list-style:none}
.hb-toc-details>summary::-webkit-details-marker{display:none}
.hb-toc-list{list-style:none;margin:0;padding:0 14px 8px}
.hb-toc-list a{display:block;padding:4px 0;font-size:13px;color:var(--ink-2);text-decoration:none;border-left:2px solid transparent;padding-left:9px}
.hb-toc-list a:hover{color:var(--mint-dim);border-left-color:var(--mint)}
.hb-toc-l3{padding-left:12px}
.hb-toc-l3 a{font-size:12.5px;color:var(--ink-3)}
.hb-chips{display:flex;flex-wrap:wrap;gap:6px}
.hb-chip{font-size:12.5px;padding:4px 10px;border-radius:999px;background:var(--mint-soft);color:#0B4A3A;border:1px solid rgba(14,156,122,.22);text-decoration:none}
.hb-chip-plain{background:var(--surface-2);color:var(--ink-2);border-color:var(--line)}
.hb-related{list-style:none;margin:0;padding:0}
.hb-related li{display:flex;justify-content:space-between;gap:10px;align-items:baseline;padding:7px 0;border-bottom:1px solid var(--line-2);font-size:13.5px}
.hb-related li:last-child{border-bottom:0}
.hb-related-ch{font-size:11px;color:var(--ink-3);flex:none}

/* ── 上一篇 / 下一篇 ── */
.hb-pn{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:32px 0 0}
.hb-pn-item{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface-2);text-decoration:none;min-width:0}
.hb-pn-item:hover{border-color:var(--mint-dim);text-decoration:none}
.hb-pn-next{text-align:right}
.hb-pn-empty{border:0;background:none}
.hb-pn-dir{font-size:11px;color:var(--ink-3)}
.hb-pn-title{font-size:14px;color:var(--ink)}
@media (max-width:640px){.hb-pn{grid-template-columns:1fr}.hb-pn-next{text-align:left}}

/* ── 首页 ── */
.hb-hero{background:var(--brand);color:#E9F2F0;border-radius:var(--radius-lg);padding:38px 34px 34px;margin-bottom:26px;position:relative;overflow:hidden}
@media (max-width:640px){.hb-hero{padding:26px 20px;border-radius:var(--radius)}}
.hb-hero h1{font-size:30px;line-height:1.3;margin:0 0 12px;font-weight:500}
@media (max-width:640px){.hb-hero h1{font-size:23px}}
.hb-hero p{margin:0;color:#A9BCC8;font-size:15px;max-width:34em}
.hb-hero-accent{color:var(--mint)}
.hb-paths{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin:26px 0 34px}
.hb-path{background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--mint);border-radius:var(--radius);padding:20px 20px 18px;display:flex;flex-direction:column;text-decoration:none}
.hb-path:hover{border-color:var(--mint-dim);text-decoration:none}
.hb-path-no{font-size:11px;letter-spacing:.1em;color:var(--ink-3)}
.hb-path-title{font-size:18px;font-weight:500;color:var(--ink);margin:6px 0 8px}
.hb-path-desc{font-size:13.5px;color:var(--ink-2);margin:0 0 14px;flex:1}
.hb-path-start{font-size:13px;color:var(--mint-dim)}
.hb-section-title{font-size:13px;font-weight:500;letter-spacing:.08em;color:var(--ink-3);margin:0 0 14px}

/* ── 章节列表 ── */
.hb-chapters{list-style:none;margin:0;padding:0}
.hb-chapter-row{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:10px}
.hb-chapter-main{display:grid;grid-template-columns:74px minmax(0,1fr) auto;gap:4px 14px;padding:16px 18px;text-decoration:none;align-items:baseline}
.hb-chapter-main:hover{text-decoration:none;background:var(--surface-2)}
.hb-chapter-no{grid-row:1;font-size:12px;color:var(--mint-dim);letter-spacing:.04em}
.hb-chapter-title{grid-row:1;font-size:17px;font-weight:500;color:var(--ink)}
.hb-chapter-summary{grid-column:2 / span 2;grid-row:2;font-size:13.5px;color:var(--ink-2)}
.hb-chapter-count{grid-row:1;font-size:12px;color:var(--ink-3);white-space:nowrap}
@media (max-width:640px){.hb-chapter-main{grid-template-columns:1fr;gap:5px}.hb-chapter-summary{grid-column:1}.hb-chapter-count{display:none}}

/* ── 文章清单（章节目录页） ── */
.hb-articles{list-style:none;margin:0;padding:0}
.hb-article-row{display:flex;gap:12px;align-items:baseline;padding:12px 0;border-bottom:1px solid var(--line-2)}
.hb-article-row:last-child{border-bottom:0}
.hb-article-no{font-size:12px;color:var(--ink-3);min-width:30px;flex:none;font-variant-numeric:tabular-nums}
.hb-article-link{font-size:15.5px;color:var(--ink);text-decoration:none;flex:1;min-width:0}
.hb-article-link:hover{color:var(--mint-dim);text-decoration:underline}
.hb-article-plan{font-size:13px;color:var(--ink-3);margin:5px 0 0}
.hb-badge{font-size:11px;padding:2px 8px;border-radius:999px;flex:none;white-space:nowrap;border:1px solid}
.hb-badge-done{background:var(--mint-soft);color:#0B4A3A;border-color:rgba(14,156,122,.25)}
.hb-badge-todo{background:var(--surface-2);color:var(--ink-3);border-color:var(--line)}
.hb-row-pending{opacity:.72}

/* ── 卡片网格 ── */
.hb-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:13px;margin:0 0 26px}
.hb-card{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:17px 18px;display:flex;flex-direction:column;text-decoration:none}
.hb-card:hover{border-color:var(--mint-dim);text-decoration:none}
.hb-card-eyebrow{font-size:11px;letter-spacing:.08em;color:var(--mint-dim)}
.hb-card-title{font-size:16px;font-weight:500;color:var(--ink);margin:5px 0 7px}
.hb-card-desc{font-size:13px;color:var(--ink-2);flex:1;margin:0}

/* ── 搜索 ── */
.hb-search-form{display:flex;gap:10px;margin:0 0 22px}
.hb-search-input{flex:1;min-width:0;font-family:inherit;font-size:16px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);color:var(--ink)}
.hb-search-input:focus{outline:2px solid var(--mint);outline-offset:0;border-color:transparent}
.hb-search-hint{font-size:12.5px;color:var(--ink-3);margin:0 0 18px}
.hb-result{display:block;padding:14px 0;border-bottom:1px solid var(--line-2);text-decoration:none}
.hb-result-title{font-size:16px;color:var(--ink);margin:0 0 5px}
.hb-result:hover .hb-result-title{color:var(--mint-dim)}
.hb-result-desc{font-size:13.5px;color:var(--ink-2);margin:0}
.hb-result-path{font-size:11px;color:var(--ink-3);margin:6px 0 0}
.hb-empty{font-size:14px;color:var(--ink-2);padding:20px 0}

/* ── 页脚 ── */
.hb-footer{background:var(--brand);color:#8FA3B0;margin-top:20px}
.hb-footer-inner{max-width:1180px;margin:0 auto;padding:26px 20px;font-size:12.5px}
.hb-footer-title{color:#E9F2F0;font-size:14px;font-weight:500;margin:0 0 8px}
.hb-footer-note{margin:0 0 6px;max-width:60em}
.hb-footer-icp{margin:12px 0 0}
.hb-footer-icp a{color:#7E93A3}
.hb-footer a{color:#9FB4C1}

/* ── 正文水印 ──
   规则：每一块「承载正文的浅色面」都平铺一层很淡的贴片水印。
   为什么用 background-image 而不是 absolute 伪元素盖一层：
   - 背景天然在文字**下面**，不需要跟 z-index / 层叠上下文较劲；
   - 不会挡住点击，也不用写 pointer-events；
   - 元素自身有背景色的地方（提示块、表格）会自然盖住水印，
     这正是想要的效果 —— 水印只出现在真正读字的地方。
   一次性把「列表页正文容器」和「卡片类浅色面」都列进来，新增页面类型时记得同步。
   本段必须放在各元素自身 background 声明**之后**，否则会被 background 简写重置掉。 */
.hb-article,
.hb-sheet,
.hb-card,
.hb-path,
.hb-chapter-row,
.hb-toc-details,
.hb-pn-item,
.hb-source{
  background-image:var(--wm);
  background-repeat:repeat;
  background-size:var(--wm-size);
  background-position:center;
}
/* 首页正文不是一个 .hb-article 卡片，而是直接铺在页面底色上，单独给一个容器。 */
.hb-sheet{min-width:0}
/* 水印只在正文承载面上出现，页头/页脚/放大层这些深色区不带。 */
.hb-footer-pub b{color:#E9F2F0;font-weight:500}

/* ── 打印（清单类页面） ── */
@media print{
  .hb-header,.hb-nav,.hb-footer,.hb-aside,.hb-pn,.hb-skip{display:none !important}
  body.hb{background:#fff;font-size:11pt}
  .hb-article{border:0;padding:0}
  .hb-main{padding:0}
  .hb-table-wrap{overflow:visible}
  .hb-table{min-width:0}
  .hb-details-body{display:block !important}
  .hb-details>summary{display:none}
  a{text-decoration:none;color:#000}
}

/* ── 广告位 ── */
/* ⚠️ 只有 site.json 的 ads.enabled=true 且有 script 时才会渲染出 .hb-ad，
   默认全站不出现。脚本片段由联盟后台原样复制，这里只负责不让它破坏版式。 */
.hb-ad{margin:34px auto 0;padding:0 20px;max-width:960px;overflow:hidden;text-align:center}
.hb-ad>*{max-width:100%}
.hb-ad-note{margin:10px 0 0;font-size:12px;line-height:1.7;color:#8a97a8}
@media print{.hb-ad{display:none !important}}

/* 水彩插画按阅读栏宽度展示，预留尺寸避免布局跳动。 */
.hb-watercolor{margin:24px 0 32px;background:#faf8f0;border:1px solid #e5e4d9;border-radius:14px;overflow:hidden}
.hb-watercolor picture{display:block;width:100%}
.hb-watercolor .hb-img{display:block;width:100%;height:auto;margin:0;border:0;border-radius:0}
.hb-watercolor .hb-zoom{display:block;width:100%;padding:0}
.hb-watercolor figcaption{padding:12px 16px;font-size:13px;line-height:1.7;color:#5e7069}
.hb-body p{line-height:1.95}
.hb-body h2{margin-top:2.1em}
@media(max-width:760px){.hb-watercolor{margin:20px 0 26px}.hb-watercolor figcaption{font-size:12px}}