/* ── 🔴 根字号：**必须有**（2026-10-20 差点丢，实测抓回）──────────────────────────
   本行原在旧「页头块」的第一行，10-20 把那块换成本文件顶部的 SITE-NAV 生成块时**被顺手带走了**
   —— 而它其实是**全博客的度量基准**：Casper / Edition 主题都把 `html` 设成 `62.5%`（=10px），
   本站所有 rem 值（`.gh-content p{font-size:1.1rem}`、`nav.top{padding:1rem 2rem}`…）
   都是**按 16px 写**的。少了这一行 ⇒ 正文 17.6px → **11px**、导航 68px → 56px、
   hero 那句话 30px → 18.75px，整页缩水 37.5%（实测：摘掉本行后 `.gh-header-title` 计算值
   恰好 18.75px = 1.875rem × 10px）。
   ⚠️ 症状极其安静：不报错、不破版，只是「好像哪儿有点小」⇒ 断言 `npm run check:blog-shell`。
   ⚠️ `scroll-behavior:auto` 同理（压掉主题的平滑滚动），原样保留。 */
html{font-size:16px!important;scroll-behavior:auto}

/* <<<SITE-NAV:CSS —— 由 sync-site-nav.mjs 生成，⛔ 别手改 >>> */
nav.top{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;background:rgba(6,34,42,.72);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid rgba(190,232,228,.12);box-sizing:border-box;font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif}
nav.top .right{display:flex;gap:10px}
nav.top .brand{display:inline-flex;align-items:center;gap:9px;font-family:Georgia,"Times New Roman",serif;font-size:20px;letter-spacing:.5px;color:#faf6ec;text-shadow:0 1px 8px rgba(0,30,36,.5);font-weight:700;text-decoration:none}
nav.top .brand .half2{color:#c9ece7}
nav.top .nav-logo{width:36px;height:36px;flex-shrink:0;color:#faf6ec;filter:drop-shadow(0 1px 6px rgba(0,30,36,.5));margin-top:-1px;--swim-run:running;--swim-k:1.78}
nav.top .btn-sm{display:inline-block;text-decoration:none;cursor:pointer;border:1.5px solid rgba(255,255,255,.85);color:#fff;border-radius:999px;padding:7px 16px;font-size:14px;font-weight:600;background:rgba(14,79,92,.45);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);white-space:nowrap;line-height:1.2;font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif}
nav.top .btn-sm:hover{background:rgba(14,79,92,.7)}
nav.top .right .auth-in{display:none}
html[data-auth="in"] nav.top .right .auth-out{display:none}
html[data-auth="in"] nav.top .right .auth-in{display:inline-block}
@media (max-width:640px){nav.top{padding:.5rem .75rem}}
@media (max-width:390px){nav.top .btn-sm{padding:7px 10px}}
@media (max-width:375px){nav.top .btn-sm{padding:7px 6px}}
@media (max-width:350px){nav.top .btn-sm{padding:7px 4px}}
@media (max-width:344px){nav.top .btn-sm{white-space:normal}}
@media (max-width:360px){nav.top .nav-logo{width:28px;height:28px;--swim-k:2.29}nav.top .brand{font-size:18px}}
.ftg-fish { transform-box: view-box; transform-origin: 41px 57px; animation: ftg-drift 7.5s ease-in-out infinite; animation-play-state: var(--swim-run, paused); }
.ftg-tail { transform-box: view-box; transform-origin: 17px 60px; animation: ftg-sweep 1.7s ease-in-out infinite; animation-play-state: var(--swim-run, paused); }
@keyframes ftg-drift {
  0% { transform: translate(calc(0px * var(--swim-k, 1)), calc(0px * var(--swim-k, 1))) rotate(calc(0deg * var(--swim-k, 1))); }
  18% { transform: translate(calc(1.9px * var(--swim-k, 1)), calc(-0.7px * var(--swim-k, 1))) rotate(calc(1.4deg * var(--swim-k, 1))); }
  42% { transform: translate(calc(2.4px * var(--swim-k, 1)), calc(0.5px * var(--swim-k, 1))) rotate(calc(0.2deg * var(--swim-k, 1))); }
  58% { transform: translate(calc(0.5px * var(--swim-k, 1)), calc(1.3px * var(--swim-k, 1))) rotate(calc(-1.1deg * var(--swim-k, 1))); }
  80% { transform: translate(calc(-2.2px * var(--swim-k, 1)), calc(0.2px * var(--swim-k, 1))) rotate(calc(-2deg * var(--swim-k, 1))); }
  100% { transform: translate(calc(0px * var(--swim-k, 1)), calc(0px * var(--swim-k, 1))) rotate(calc(0deg * var(--swim-k, 1))); }
}
@keyframes ftg-sweep {
  0%, 100% { transform: rotate(calc(12deg * var(--swim-k, 1))); }
  50% { transform: rotate(calc(-12deg * var(--swim-k, 1))); }
}
@media (prefers-reduced-motion: reduce){.ftg-fish,.ftg-tail{animation:none}}
/* <<<END SITE-NAV>>> */

/* ===== Typography (detail + overview pages) ===== */
.gh-article-title,.article-title,h1.gh-article-title{font-size:clamp(2rem,4vw,3.5rem)!important;line-height:1.15!important}
.gh-article,.gh-content,.gh-article p,.gh-content p,.gh-article li,.gh-content li{font-size:1.15rem!important;line-height:1.7!important}
.gh-article h2,.gh-content h2{font-size:2rem!important;line-height:1.25!important}
.gh-article h3,.gh-content h3{font-size:1.5rem!important;line-height:1.3!important}
.gh-article h4,.gh-content h4,.gh-article h5,.gh-content h5{font-size:1.25rem!important;line-height:1.4!important}
figcaption,.gh-article figcaption,.gh-content figcaption{font-size:0.875rem!important;line-height:1.4!important}

/* Homepage cards */
.post-card-title{font-size:1.5rem!important;line-height:1.25!important}
.post-card-excerpt{font-size:1rem!important;line-height:1.55!important}
.post-card-meta,.post-card-meta *{font-size:0.8rem!important}
.post-card-meta-author{font-weight:600;color:#15171A;text-decoration:none}
.post-card-meta-author:hover{color:#227f74}
@media(max-width:640px){.post-card-title{font-size:1.25rem!important}.post-card-excerpt{font-size:0.95rem!important}.post-card-meta{flex-wrap:wrap!important;row-gap:2px!important}}

/* ===== Hide Ghost portal ===== */
#ghost-portal-root,.gh-portal,.gh-portal-btn{display:none!important}

/* ===== Hide Casper header ===== */
.gh-head,.gh-head-logo,.gh-head-brand,.gh-head-menu,.gh-head-actions,.gh-head-members,.gh-head-inner,.gh-head .gh-head-btn,.gh-head .gh-head-link,.gh-head .gh-social,.gh-head-search,.gh-search,.gh-search-trigger,.gh-search-button,#gh-navigation,.gh-navigation,.gh-nav,.gh-nav-menu{display:none!important}

/* ===== Hide Casper footer / CTA (keep site-description visible) ===== */
.site-footer,.site-footer-inner,.site-footer-nav,.site-footer .copyright,.gh-powered-by,.footer-cta,.footer-cta-inner,.footer-cta-title,.footer-cta-button,.footer-cta-input,.gh-footer-cta,.gh-footer-signup,.gh-subscribe-section,.gh-foot,.gh-footer,.gh-footer-inner,.gh-footer-nav,.gh-footer-copyright,.gh-footer-signup{display:none!important}

/* ===== Hide subscribe/signup ===== */
.gh-subscribe,.gh-subscribe-form,.gh-cta,.gh-cta-form,form[data-members-form],form[data-members-signup],.gh-signup,.gh-signup-form,.gh-portal-trigger,button[data-portal]{display:none!important}

/* ===== Content spacing ===== */
body>.gh-outer,body>.gh-cover,body>main,body>.gh-main,body>.gh-content-blocks,main.gh-main,.site-main,.article{padding-top:5rem!important}
.gh-header,.gh-cover,.gh-header.has-image{margin-top:0!important;position:relative}
.gh-viewport{margin-top:-41px!important}
.gh-header.has-image{position:relative!important;height:60vh;overflow:hidden;margin:0!important}
.gh-header.has-image .gh-header-inner,.gh-archive-header.has-image .gh-header-inner{position:absolute!important;top:calc(50% + 56px)!important;left:50%!important;transform:translate(-50%,-50%)!important;text-align:center!important;z-index:1!important;width:90%!important;max-width:720px!important}
.gh-header-image{position:absolute!important;top:0;left:0;width:100%!important;height:100%!important;object-fit:cover!important}

/* ── 概览页 hero：本站背景图 + 压暗层 + 「一句话」（2026-10-20 站主令）──────────────
   站主原话：「博客页面的那个概览页儿的那个顶部应该有一个背景图的，就像露营一样。
              还有也要一句话，还有那个 logo，这些都和那个露营是一样的。」
   · 顶栏的 logo 与两颗按钮归**顶栏**（唯一源 `scripts/fixfishtank/site-nav.mjs`）。
   · hero 里的「记号 + 字标 + 一句话」归本块（站主 10-20 追加：「那个 logo 和商标也要加上去」）。
   · 露营站的对应物是 hero 里的 `<img class="site-logo">` + `<p class="site-description">`
     （见 campmate.ai/guides/）—— 本站照做，并且把字标也一起带上。

   图从哪来（重要）：Ghost 后台**从未配过** publication cover ⇒ 线上一直用 Ghost 自带的
   紫渐变占位图 `static.ghost.org/v5.0.0/images/publication-cover.jpg`。本仓不动 Ghost 数据，
   由 nginx `sub_filter` 把这个 URL 换成 `/media/blog-hero.jpg`。
   ⚠️ 那条替换是**自我退役**的：将来后台配了真封面，`src` 不再是默认 URL ⇒ 规则自动空转，
      不会把真封面盖掉。反向断言见 `npm run check:blog-shell`（C1/C2）。
   🔴 **这张图不能复用首页整页背景**（`page-bg-poster.jpg`）：10-20 第一版就是这么干的，
      站主当场退回 ——「不能说和这个背景是一个」。两张图是两份资产，改一张不带动另一张。

   🔴 图一换就必须有压暗层：hero 图中部常有亮色水草，白色标题直接压上去实测只有 ~2.4:1
      （AA 要 4.5:1）⇒ 没有这层遮罩 = 「合规文本读不清」。遮罩值取自首页整页背景那条渐变
      （同色系 rgba(4,22,28,…)，不是纯黑，保留水色）。
   ⚠️ 用 `::after` 而不是给 `.gh-header` 加 background：真正的图是 `<img class="gh-header-image">`
      （上面那条 object-fit:cover），background 会被它整块盖住 ⇒ 等于没写。
   🔴 层级必须显式写全（2026-10-20 实测踩过）：**主题把这张图设成 `z-index:-1`**
      （Edition/Casper 都是），负层级 = 画在**自己的背景色之下**。所以只加 `background-color`
      当「加载前的底色」会把图**整块盖死**，屏幕上只剩一片深青渐变（实测：img naturalWidth 1920、
      opacity 1，肉眼却什么都没有）。三层必须按 0 / 1 / 2 排好，谁都别留在负层级。 */
.gh-header.has-image{background-color:#06222a!important}
.gh-header.has-image .gh-header-image{z-index:0!important}
.gh-header.has-image::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(4,22,28,.5) 0%,rgba(4,22,28,.62) 52%,rgba(6,34,42,.8) 100%)}
.gh-header.has-image .gh-header-inner{z-index:2!important}

/* ── hero 里的「记号 + 字标」（2026-10-20 站主：「那个 logo 和商标也要加上去」）─────────
   标记由 nginx `sub_filter` 插在 `<h1 class="gh-header-title` 之前（见 default.conf），
   记号复用顶栏那颗 sprite `<use href="#logo-b1a">` —— 同一份 path、同一个函数产出，
   不另存一张 SVG（存了就成第二个真相源，改鱼形必漏一处）。

   🔴 必须 scope 到 `body.home-template`：`.gh-header-title` 这个类在 tag / author 页也出现，
      那些页的 hero 主角是**标签名/作者名**，再压一个站名上去等于抢主语（10-19 的
      「提问主语」纪律同理）。所以标记是**全站注入、仅概览页显示**。
   颜色沿用顶栏那一套：字标 #faf6ec，"Fix" 段 #c9ece7（深底强调段，见 GO_VIDEO 口径）。 */

/* 🔴 尺寸（2026-10-20 站主：「这个 logo 包括这个商标……是不是搞大一些比较合适」）——
   判据**不是手感**，是照抄首页 hero 四改那条已锁定的：**记号墨迹高 ≈ 字标 cap-height**，
   比值落 1.0–1.2。首页四档（88/44·72/36·56/28·48/24）实测全是 **1.047**，因为
   记号墨迹纵向只填框高的 36.29%、Georgia cap-height = 0.694em ⇒ 恒等式
        S×0.3629 / (F×0.694) = 1.047  ⇒  **S/F ≈ 2.0**
   旧值 40/24 = 1.67 ⇒ 比值 0.87，**鱼比名字还矮** —— 跟上首页 10-17 三改被推翻时
   一模一样的算术错误（那时也是只看外框、没看墨迹）。

   ⚠️ 但**不要照抄首页的 88**：首页 hero 的预算是被 900px 折线卡死的（② 区要整块进首屏，
   实测可用上限约 110px），所以它只能横着长。本页（概览页 cover）没有这个约束：
   实测 hero 盒高**不由内容决定** —— 760 视口 456px、900 视口 540px，把 mast 从 40
   放大到 120 三档实测 heroH 恒为 456 ⇒ **放大不吃任何预算**（不撑长页面）。
   且封面只有「记号+字标」和「一句话」两件，没有 CTA / trust 来抢视觉重量。

   ⇒ 取 104/52（仍是 2.0 比），mast 宽 460px / 占 1440 的 31.9%；字标 52 对那句话 30
      = 1.73，落在「报头 : 副题」的 1.6–1.8 常见区间。
   ⛔ 再上去 120/60（mast 529px、占 36.8%、高度吃掉 456 的四分之一）实测已让那句话掉成
      脚注；88/44 则回落到「偏保守、与口号落差不够」。三档截图见 10-20 日志。
   ⛔ 别动 `.gh-header-title` 的字号来"配合"：那条规则是全局的，tag / author 页的 h1 也吃它。 */
.ftg-hero-mast{display:none}
/* 🔴 2026-10-21：mast 与标语之间的间距**唯一来源是 .gh-header-inner 的 gap**，不是这里的 margin。
   幽灵主题默认 `.gh-header-inner{display:flex;flex-direction:column;gap:48px}`，而 flex 的 gap 是
   「最小间距」：margin-bottom 24px < gap 48px ⇒ 浏览器取 48 ⇒ 那 24px **从未生效**（死代码）。
   上一版「调 mast 的 margin 让两块贴近」等于没调，实测两块之间恒 48px。
   ⇒ 现在把 margin 清 0，间距交给下面那条 `body.home-template .gh-header-inner{gap:…}` 统一管，
      改间距只改一个地方；⛔ 别再把 margin-bottom 加回来（那会造出第二套间距源，gap 调小后突然叠加）。 */
body.home-template .ftg-hero-mast{display:flex;align-items:center;justify-content:center;
  gap:18px;margin:0}
/* 48（主题默认）→ 16。scope 到 home-template 是必须的：`.gh-header-inner` 这个类在
   tag / author 页也出现（那些页没有 mast，别动它们的间距）。 */
body.home-template .gh-header-inner{gap:16px}
.ftg-hero-mast .ftg-hero-logo{width:104px;height:104px;flex:0 0 auto;color:#faf6ec;
  filter:drop-shadow(0 2px 12px rgba(0,30,36,.55))}
.ftg-hero-mast .ftg-hero-wordmark{font-family:Georgia,"Times New Roman",serif;font-weight:700;
  font-size:52px;letter-spacing:.01em;line-height:1;color:#faf6ec;
  text-shadow:0 2px 22px rgba(0,30,36,.62)}
.ftg-hero-mast .ftg-hero-fix{color:#c9ece7}
/* 五档按同一条 2.0 比反推，不逐档拍脑袋（首页四档同构，且记号 104/88/72/56/48
   正好把首页那四档 88/72/56/48 全包含在内）。
   🔴 断点不是按"设备宽度"拍的，是按**字标 : 那句话 ≤ 1.85** 反推出来的：
      `.gh-header-title` 是 clamp(1.375rem,3.2vw,1.875rem) ⇒ 22px（≤687 宽）～30px（≥937）。
      若 641–768 还留 44px 字标，比值会到 2.0（字标成了正文两倍，那句话掉成脚注）——
      实测在 641 宽抓到。所以把降档点压到 768/900，让两族同步缩。 */
/* 五档间距与字标同源（判据见上）：标语不能被字标压成脚注。48 → 16 后小屏同步收。
   ⚠️ `.ftg-hero-mast` 的 gap 是 **mast 内部**（记号 ↔ 字标的水平间距），
      `.gh-header-inner` 的 gap 才是 **mast ↔ 标语** 的垂直间距，别混。 */
@media(max-width:900px){body.home-template .gh-header-inner{gap:14px}
  body.home-template .ftg-hero-mast{gap:16px}
  .ftg-hero-mast .ftg-hero-logo{width:88px;height:88px}
  .ftg-hero-mast .ftg-hero-wordmark{font-size:44px}}
@media(max-width:768px){body.home-template .gh-header-inner{gap:12px}
  body.home-template .ftg-hero-mast{gap:14px}
  .ftg-hero-mast .ftg-hero-logo{width:72px;height:72px}
  .ftg-hero-mast .ftg-hero-wordmark{font-size:36px}}
@media(max-width:440px){body.home-template .gh-header-inner{gap:10px}
  body.home-template .ftg-hero-mast{gap:12px}
  .ftg-hero-mast .ftg-hero-logo{width:56px;height:56px}
  .ftg-hero-mast .ftg-hero-wordmark{font-size:28px}}
@media(max-width:360px){body.home-template .gh-header-inner{gap:8px}
  body.home-template .ftg-hero-mast{gap:10px}
  .ftg-hero-mast .ftg-hero-logo{width:48px;height:48px}
  .ftg-hero-mast .ftg-hero-wordmark{font-size:24px}}
/* 「一句话」= hero 里那个 h1（其文本由 nginx 换成本站口号，见下）。字号刻意做成
   「一句话」而不是「头条」：与首页 `.slogan` 同一套语言（Georgia + 字距），
   但不取 21px —— 它毕竟是本页唯一的 h1，太小会被读成图片说明。 */
.gh-header-title{color:#f4fbf9!important;font-family:Georgia,"Times New Roman",serif!important;
  font-size:clamp(1.375rem,3.2vw,1.875rem)!important;line-height:1.35!important;letter-spacing:.2px;
  text-shadow:0 2px 18px rgba(0,22,28,.65)!important;text-wrap:balance;max-width:44rem;margin:0 auto!important}
@media(max-width:640px){.gh-header-title{font-size:1.25rem!important}}

/* ===== FAB ===== */
.cm-fab{position:fixed;bottom:1.5rem;left:1.5rem;z-index:999;display:flex;align-items:center;gap:0.375rem;padding:0.4rem 0.75rem;line-height:1.2!important;background:rgba(6,34,42,0.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(190,232,228,0.18);border-radius:8px;color:#eaf4f2;font-size:0.75rem;font-weight:500;text-decoration:none;transition:all 0.25s ease;box-shadow:0 2px 12px rgba(0,0,0,0.4)}
.cm-fab span{line-height:1!important;display:inline-block}.cm-fab:hover{color:#2a9d8f;border-color:rgba(42,157,143,0.35);background:rgba(6,34,42,0.7);transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,0.3)}

@media(max-width:640px){
  .gh-header.has-image{height:55vh!important}.gh-header.has-image .gh-header-inner{top:calc(50% + 24px)!important}.gh-viewport{margin-top:0!important}
  body>.gh-outer,body>.gh-cover,body>main,body>.gh-main,main.gh-main,.site-main,.article{padding-top:3rem!important}
  .gh-article-title,.article-title,h1.gh-article-title{font-size:clamp(1.75rem,5vw,2.5rem)!important;line-height:1.2!important}
  .gh-article,.gh-content,.gh-article p,.gh-content p,.gh-article li,.gh-content li{font-size:1.1rem!important;line-height:1.6!important}
  .gh-article h2,.gh-content h2{font-size:1.6rem!important;line-height:1.25!important}
  .gh-article h3,.gh-content h3{font-size:1.3rem!important;line-height:1.3!important}
  .gh-article h4,.gh-content h4,.gh-article h5,.gh-content h5{font-size:1.1rem!important;line-height:1.35!important}
  figcaption,.gh-article figcaption,.gh-content figcaption{font-size:0.85rem!important;line-height:1.4!important}
}
/* ===== Article typography — polished for American readers ===== */
/* Content width: 720px max for comfortable reading */
.gh-content,.gh-canvas{max-width:720px!important;margin-left:auto!important;margin-right:auto!important}
/* Body text: 17.6px/1.6 — clean and readable */
.gh-content p,.gh-article p{font-size:1.1rem!important;line-height:1.6!important;margin-bottom:1.25em!important}
/* Remove ghost empty-paragraph spacing hack */
.gh-content p:empty,.gh-article p:empty{display:none!important}
/* Headings: tighter spacing */
.gh-content h2,.gh-article h2{font-size:1.75rem!important;line-height:1.25!important;margin-top:2.5rem!important;margin-bottom:0.75rem!important;font-weight:700!important}
.gh-content h3,.gh-article h3{font-size:1.35rem!important;line-height:1.3!important;margin-top:2rem!important;margin-bottom:0.5rem!important;font-weight:700!important}
/* Lists */
.gh-content li,.gh-article li{font-size:1.1rem!important;line-height:1.6!important;margin-bottom:0.4em!important}
/* Tables */
.gh-content table{width:100%!important;max-width:100%!important;border-collapse:collapse!important;margin:1.5rem 0!important}
.gh-content td,.gh-content th{padding:10px 14px!important;text-align:left!important;border-bottom:1px solid #e0e0e0!important;font-size:1rem!important}
.gh-content th{font-weight:700!important;color:#333!important;border-bottom-width:2px!important}
/* Blockquotes */
.gh-content blockquote{border-left:3px solid #2a9d8f!important;padding-left:1.5rem!important;margin:1.5rem 0!important;color:#555!important;font-style:italic!important}
/* Horizontal rules */
.gh-content hr{margin:2rem 0!important;border:none!important;border-top:1px solid #e0e0e0!important}
/* Figure captions */
.gh-content figcaption,.gh-content figcaption p{font-size:0.85rem!important;color:#888!important;text-align:center!important;margin-top:0.5rem!important}
/* Mobile */
@media(max-width:640px){
  .gh-content,.gh-canvas{max-width:100%!important;padding:0 1rem!important}
  .gh-content p,.gh-article p{font-size:1.05rem!important;line-height:1.55!important}
  .gh-content h2{font-size:1.5rem!important;margin-top:2rem!important}
  .gh-content h3{font-size:1.2rem!important}
}

/* Show full cover image without cropping */
.site-header-content{aspect-ratio:auto!important;height:auto!important;max-height:none!important}

/* ── 首页 hero（2026-10-19）──────────────────────────────────────────────────
   露营站的 hero 只有**一句描述**、字号克制、图压得够暗；本站在 Casper 默认下把描述
   当成 hero 大标题（三行 48px），白字正好压在亮色水草上 ⇒ 读不清。
   这里两件事：① 给封面压一层品牌深青渐变（不是纯黑，保留水色）；② 描述回一句的字号。
   ⚠️ 遮罩用 ::after 而不是 background 叠在 img 上 —— Casper 的 img 是 flex 子元素，
      直接加 background 会被图片完全盖住。 */
.site-header-content{position:relative!important}
.site-header-content::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(6,34,42,.42) 0%,rgba(6,34,42,.62) 55%,rgba(6,34,42,.82) 100%)}
.site-header-inner{position:relative!important;z-index:2!important}
.site-description{font-size:clamp(1.05rem,1.5vw,1.3125rem)!important;line-height:1.55!important;
  max-width:36rem;margin:0 auto!important;text-shadow:0 1px 14px rgba(0,0,0,.55)}
@media(max-width:640px){
  .site-description{font-size:1rem!important;max-width:22rem;padding:0 1rem}
}

/* Cover image — keep the aquarium depth behind the hero, brand page-ground when loading */
.site-header-cover{object-position:center bottom!important}
.site-header-content,.site-header{background-color:#06222a!important}

/* Collapse hidden Casper sections so they don't create blank space */
.footer-cta,.site-footer{height:0!important;padding:0!important;margin:0!important;overflow:hidden!important}
/* Reduce gap between article end and footer */
.article,article.gh-article{margin-bottom:0!important}

/* Affiliate disclosure — tiny, muted, just passing compliance */
.gh-content blockquote{font-size:0.75rem!important;line-height:1.3!important;color:#6f9a95!important;border-left:2px solid #2a9d8f!important;background:#f7f9f7!important;padding:0.25rem 0.75rem!important;margin:0 0 0.25rem!important;font-style:italic!important}
.gh-content blockquote strong{font-weight:700!important}
.gh-content blockquote p{margin:0!important;font-size:0.75rem!important;line-height:1.3!important}

/* In-content links — brand green (replaces Ghost pink accent #FF1A75) */
.gh-content a,.article-content a{color:#227f74!important}
.gh-content a:hover,.article-content a:hover{color:#2a9d8f!important}

/* ── 分页条：**不再有任何自定义样式**（2026-09-20 第三轮裁定）────────────────────
   用户要「只保留滚动」：分页条（`Older / Newer Posts` + `Page X of Y`）保持 Casper
   原样（主题 CSS 恒为 `display:none`），页面靠无限滚动展示全部 33 篇。
   曾在此处放过一组「给客户端页码按钮上样式」的 `.pagination` 规则；已整体移除，
   **不要**再按"用户说过要 1 2 3 4"加回来（同一天被推翻的前一版要求）。
   反向断言：npm run check:pagination-links（线上 CSS 里出现该类的指纹即报红）。
   ⚠️ 本注释**刻意不写出那个类的字面**：写出来会把反向断言打成假红。 */