/* 子页共用：面包屑 + 页脚（不改 site.css；由各子页在 site.css 之后引入） */

/* 面包屑：沿用 .site-sec 的位置与栏目配色（手机 ≤640px 时 site.css 已让它独占第二行） */
nav.site-crumb { min-width: 0; flex: 1 1 auto; }
.site-crumb ol {
  display: flex;
  align-items: center;
  min-width: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 12px;
  letter-spacing: 0.06em;
  line-height: 1.4;
}
.site-crumb li { flex: 0 0 auto; white-space: nowrap; }
.site-crumb li + li::before {
  content: "›";
  margin: 0 7px;
  color: var(--site-faint);
}
.site-crumb li:last-child {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--site-muted);
  letter-spacing: 0.02em;
}
.site-crumb a {
  color: inherit;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  min-height: 24px;
}
.site-crumb a:hover { text-decoration: underline; text-underline-offset: 3px; }
.site-crumb a:focus-visible,
.site-back:focus-visible,
.sub-foot a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

/* 页脚：与首页页脚同构 */
.sub-foot {
  width: var(--site-board);
  margin: 40px auto 0;
  padding: 18px 0 40px;
  border-top: 2px solid var(--site-ink);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 20px;
  font-family: var(--site-sans);
  font-size: 13px;
  line-height: 1.5;
  color: var(--site-muted);
  background: transparent;
}
.sub-foot[data-page="anime"],
.sub-foot[data-page="community"] { width: var(--site-measure); }
.sub-foot .site-brand { font-size: 18px; color: var(--site-ink); margin-right: 8px; }
.sub-foot nav { display: flex; flex-wrap: wrap; gap: 0 16px; }
.sub-foot nav a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--site-muted);
  text-decoration: none;
}
.sub-foot nav a:hover { color: var(--site-ink); text-decoration: underline; text-underline-offset: 3px; }
.sub-foot nav a[aria-current="page"] { color: var(--site-ink); font-weight: 600; }
.sub-foot .to-top { margin-left: auto; }
@media (max-width: 640px) {
  .sub-foot .site-brand-en { display: none; }
}

/* 旧版深色 Steam 页（9/21、9/28）：页脚落在深色背景上，改用浅字 */
.sub-foot.is-dark { border-top-color: #e8f0f4; color: #9bb0bc; }
.sub-foot.is-dark .site-brand { color: #e8f0f4; }
.sub-foot.is-dark nav a { color: #9bb0bc; }
.sub-foot.is-dark nav a:hover { color: #e8f0f4; }
/* 旧版深色页：site.css 的栏目色 eyebrow 在深色 hero 上对比不足，还原页面自身强调色 */
.legacy-dark .site-chrome + header.hero .eyebrow { color: var(--accent); }
/* 个别页面（如 cien-anos）给全局 a 加了下划边框；页眉/页脚链接不继承 */
.site-chrome a, .sub-foot a { border-bottom: 0; }

/* ---- UI QA 2026-10-22（b5788e8 复查）---- */
/* 1) 页脚跟随页面自身色板：steam 20261005/12/19、anime/20260928 等深色页未标 legacy-dark，
      原先页脚「简报」与顶线是深字落在深底上（约 1:1）、链接约 2.8:1。
      浅色页的 --ink/--muted 本就映射到 --site-ink/--site-muted，表现不变；未定义时回落到 site 变量。 */
.sub-foot { color: var(--muted, var(--site-muted)); border-top-color: var(--ink, var(--site-ink)); }
.sub-foot .site-brand { color: var(--ink, var(--site-ink)); }
.sub-foot .site-brand-en { color: var(--muted, var(--site-muted)); }
.sub-foot nav a { color: var(--muted, var(--site-muted)); }
.sub-foot nav a:hover,
.sub-foot nav a[aria-current="page"] { color: var(--ink, var(--site-ink)); }
/* 2) 深色 Steam 页 hero 眉题：site.css 的栏目锈红在深底上约 2.7:1，与 legacy-dark 同样还原页面强调色 */
.site-chrome[data-page="steam"] + header.hero .eyebrow { color: var(--accent, var(--site-accent)); }
/* 3) 面包屑栏目链接触控区 24px → 44px（透明伪元素，不改版式；.site-sec 的 overflow:hidden 会裁掉伪元素，
      省略号由最后一项 li 自己负责，故 nav 本身放开） */
nav.site-crumb { overflow: visible; }
.site-crumb a { position: relative; }
.site-crumb a::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: max(100%, 44px);
  height: 44px;
  transform: translate(-50%, -50%);
}

/* ---- 面包屑位置统一（≤640px 一律独占第二行）---- */
/* 原状：27 个子页按 site.css 规则把面包屑放第二行（页眉约 88px），
   202610-season / edgerunners2 / malfoid / opus55 的页内样式强制单行（约 59px），
   单行时面包屑只剩约 140px，长标题被截成「舆论观察 › 《赛博…」，44px 触控伪元素也会挤着品牌名和返回链接。
   统一为第二行：本页标题有整行 343px 可读，所有子页页眉同高。
   选择器权重高于这些页内的覆盖规则（不用 !important，也不改页面本身）。 */
@media (max-width: 640px) {
  .site-chrome[data-page] .site-chrome-inner {
    flex-wrap: wrap;
    gap: 6px 12px;
  }
  .site-chrome[data-page] nav.site-crumb.site-sec {
    order: 3;
    width: 100%;
    flex: 1 1 100%;
  }
}

/* ---- UI QA 2026-10-22（70a083d 复查）低优先级修正；1453cd8 复查后修订 ---- */
/* 1) 子页顶栏统一不透明：92% 半透明底叠在深色页（如 anime/20260928、深色 Steam 页）上会变暗，
      面包屑「动漫每周」只剩 4.23:1。不透明后所有子页都是 #f7f4ef：青色栏目 4.99:1，锈红 6.66:1，靛蓝 6.11:1。
      11 个浅色子页的页内样式用 `.site-chrome { background: rgba(247,244,239,.94) !important }` 强制半透明，
      这里用更高权重的 !important 统一覆盖（同为 !important 时按选择器权重：0,2,0 > 0,1,0），页面本身不改。
      这些页底色本就是 #f7f4ef，静止时视觉无变化；吸顶滚动时不再透出下方文字。 */
.site-chrome[data-page] { background: var(--site-bg) !important; }
/* 2) 面包屑分隔符「›」：#8a8a8a（2.67:1 于暗化底）→ muted #5c5c5c（6.1:1），并对读屏隐藏 */
.site-crumb li + li::before { content: "›"; content: "›" / ""; color: var(--site-muted); }
/* 3) 仅 ≤640px：品牌「简报」点击区 ≥44×44，且与第二行面包屑的 44px 触控区不重叠。
      1453cd8 曾把此规则写在媒体查询外，inline-flex 吞掉了「简报」与「GROKBOT BRIEFS」之间的空格、
      桌面页眉高 +1px、面包屑左移约 6px —— 现在只在手机断点生效，>640px 与 70a083da 完全一致。
      手机页眉（与 70a083da 相同）：第一行 y12–45，行间距 6，第二行（面包屑）y51–75，页眉底 88。
      品牌盒子上移进页眉顶部内边距：y0–44（44×44，文字只上移 1px，占位仍 33px，页眉高度不变）；
      面包屑链接触控区改为从链接顶上方 7px 起算，品牌层级在上：面包屑有效区 y44–88（44px，止于页眉底边，不盖住正文）。两者首尾相接、不重叠。 */
@media (max-width: 640px) {
  .site-chrome .site-brand {
    display: inline-flex;
    align-items: flex-start;
    box-sizing: border-box;
    min-width: 44px;
    min-height: 44px;
    padding-top: 11px;
    margin: -12px 0 1px;          /* 占位高度 = 44 - 12 + 1 = 33，与原文字行同高 */
  }
  .site-chrome .site-brand::after { top: 0; left: 0; width: 100%; height: 100%; transform: none; }
  .site-chrome .site-brand { z-index: 1; }   /* 交界处不足 1px 的亚像素重叠归品牌，品牌完整 44px */
  .site-chrome[data-page] .site-crumb a::after { top: -7px; height: 46px; transform: translateX(-50%); }
  /* 触控区止于页眉底边（含 1px 底线），不越界盖住正文；box-shadow 不受 overflow 裁切 */
  .site-chrome[data-page] { overflow: clip; overflow-clip-margin: 1px; }
  .site-chrome .site-brand:focus-visible { outline-offset: -2px; }   /* 品牌贴页眉顶边，焦点框画在内侧以免被裁 */
}

/* ===== 圆角（2026-10-23，coverfill 批次）=====
   数值与 site.css :root 的 --radius（7px）/ --radius-sm（4px）一致；本文件也会被不引 site.css 的子页单独引入，故全部带回退值。
   只用 :where()（零特异性）：子页内联样式若自定了圆角，以子页为准。分隔细线、页脚顶线不圆角。
   注：后续 sources-fold 批次改本文件时，请保持本块独立。 */
:where(figure) > img,
:where(figure) > a > img,
:where(figure) > picture > img { border-radius: var(--radius, 7px); }        /* 子页配图：图角与圆角一起裁切 */
:where(.site-crumb, .sub-foot) a:focus-visible { border-radius: var(--radius-sm, 4px); }   /* 焦点框保留 2px 实线，仅转角变圆 */
/* ===== 圆角 end ===== */

/* ==========================================================================
   来源折叠 .src-fold —— 文末「来源 / 参考 / 资料来源」区块一律默认折叠（2026-10-23 规矩）
   原生 <details>/<summary>：不依赖 JS，Tab 聚焦、Enter / Space 开合；
   Chrome / Edge / Safari 打开指向折叠内部的 #锚点 或页内查找命中时会自动展开。
   用法（直接照抄，默认不写 open）：
     <details class="src-fold">
       <summary><span class="src-fold__label">来源与参考</span><span class="src-fold__n">（N）</span><span class="src-fold__act" aria-hidden="true"></span></summary>
       <div class="src-fold__body">
         …原来源区块（<ol>/<p class="close note">/<aside class="fk-sources"> 等）原样放这里…
       </div>
     </details>
   N = 区块里的条目数（列表 <li> 数）；整段文字型的资料说明不写 N，去掉 .src-fold__n 那个 span。
   区块原有的「来源」小标题由 summary 取代，删掉不重复；正文内联来源链接、图注图源不进折叠。
   颜色全部取自 currentColor（浅色页 = 墨色 rgba(18,18,18,…)；Steam 深色页自动变浅），不用另写主题。
   ========================================================================== */
.src-fold {
  margin: 40px 0 0;
  border-top: 1px solid rgba(18,18,18,.2);
  border-top-color: color-mix(in srgb, currentColor 20%, transparent);
  border-bottom: 1px solid rgba(18,18,18,.12);
  border-bottom-color: color-mix(in srgb, currentColor 12%, transparent);
}
.src-fold > summary {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  margin: 4px -8px;
  padding: 8px;
  box-sizing: border-box;
  list-style: none;
  cursor: pointer;
  border-radius: var(--radius-sm, 4px);
  color: inherit;
  font-family: var(--site-serif, Georgia, serif);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: .02em;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}
.src-fold > summary::-webkit-details-marker { display: none; }
.src-fold > summary::marker { content: ""; }
.src-fold__label { flex: 0 1 auto; min-width: 0; }
.src-fold__n {
  flex: 0 0 auto;
  margin-left: -4px;               /* 全角括号自带左空白，收紧 */
  color: #5c5c5c;
  color: color-mix(in srgb, currentColor 66%, transparent);
  font-family: var(--site-sans, system-ui, sans-serif);
  font-size: 13px;
  font-weight: 400;
  font-variant-numeric: tabular-nums;
}
.src-fold__act {
  flex: 0 0 auto;
  margin-left: auto;
  color: #5c5c5c;
  color: color-mix(in srgb, currentColor 66%, transparent);
  font-family: var(--site-sans, system-ui, sans-serif);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: .04em;
}
.src-fold__act::before { content: "展开"; }
.src-fold[open] > summary .src-fold__act::before { content: "收起"; }
.src-fold > summary::after {          /* 自定义 V 形箭头，展开时翻转 */
  content: "";
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  margin: 0 4px 3px 2px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  color: #5c5c5c;
  color: color-mix(in srgb, currentColor 66%, transparent);
  transform: rotate(45deg);
  transition: transform .2s ease, margin .2s ease;
}
.src-fold[open] > summary::after { transform: rotate(-135deg); margin-bottom: -3px; }
.src-fold > summary:hover { background: rgba(18,18,18,.04); background: color-mix(in srgb, currentColor 5%, transparent); }
.src-fold > summary:hover .src-fold__act { color: inherit; }
.src-fold > summary:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 0;
}
.src-fold__body { padding: 2px 0 16px; overflow-wrap: anywhere; }
/* 原区块进折叠后不再画自己的顶线 / 上边距（顶线由 .src-fold 统一提供） */
.src-fold__body > :first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.src-fold__body > :last-child { margin-bottom: 0; }
@media (prefers-reduced-motion: reduce) {
  .src-fold > summary::after { transition: none; }
}
@media print {
  .src-fold > summary::after, .src-fold__act { display: none; }
  .src-fold { border-bottom: 0; }
  /* 打印时即使未展开也印出来源（Chrome 131+ / Safari 18.4+ 支持 ::details-content；不支持的浏览器保持原样） */
  .src-fold::details-content { content-visibility: visible; display: block; }
}
/* 折叠体内连续的 .note：后一条不再重复 40px 上距与 2px 分隔线 */
.src-fold__body > .note + .note { margin-top: 8px; padding-top: 0; border-top: 0; }
/* 资料说明 .note：灰字由 --site-faint（#8a8a8a，3.15:1）改为 --site-muted（#5c5c5c，6.1:1），达 WCAG AA 4.5:1；只改 .note，不动全站 --site-faint */
p.note, .src-fold__body .note { color: var(--site-muted); }
/* —— 来源折叠 end —— */
/* 窄屏（≤419px）：动画周报 .ep-meta（集数·日期）允许换行，避免长日文集名在 Safari 撑出横向滚动；放得下时仍是单行 */
@media (max-width: 419px) { .ep-kicker .ep-meta { white-space: normal; overflow-wrap: anywhere; } }
/* ===== 锚点偏移（2026-10-23，anchorpair 批次）=====
   子页顶栏 .site-chrome 是 sticky：实测 >640px 高 59px（深色旧版 Steam 页 58px），≤640px 面包屑独占第二行后 89px（88px）。
   跳到 #锚点（h2/h3/section 等任何带 id 的目标）时让标题落在顶栏下方并留 11px 呼吸（滚动位置取整会吃掉不到 1px，实测仍 ≥10px）。
   :where() 特异度为 0，页面自带的更具体规则仍然优先（anime/schedule 的 .sch-week 另算了星期导航；archive 的 .ar-card）。
   首页不引入本文件，不受影响。 */
:root { --chrome-h: 59px; --anchor-gap: 11px; }
@media (max-width: 640px) { :root { --chrome-h: 89px; } }
:where([id]) { scroll-margin-top: calc(var(--chrome-h) + var(--anchor-gap)); }
/* ===== 锚点偏移 end ===== */
/* ===== 等高图组 .fig-pair--ar（2026-10-23，anchorpair 批次）=====
   两张宽高比不同的图并排时不裁图、不留白：每个 figure 的 flex-grow = 图片宽高比（HTML 上写 style="--ar: 宽 / 高"，取图片真实尺寸），
   两图渲染高度相同，图注从同一高度起排。flex-basis 预留图片左右 1px 边框（--fig-pair-frame），保证内容区严格等高。
   ≤560px（较窄的一张会小于约 200px、截图文字看不清）改为上下排列：每张最高约 440px，居中，不放大。
   须与页面已有的 .fig-pair 一起用；特异度 0,2,0 压过页面内 .fig-pair 的 grid 写法。 */
.fig-pair.fig-pair--ar { display: flex; align-items: flex-start; justify-content: center; gap: 14px; }
.fig-pair--ar > .fig { flex-grow: calc(var(--ar, 1)); flex-shrink: 1; flex-basis: var(--fig-pair-frame, 2px); min-width: 0; margin: 0; }
@media (max-width: 560px) {
  .fig-pair.fig-pair--ar { flex-direction: column; align-items: center; gap: 18px; }
  .fig-pair--ar > .fig { flex: none; width: 100%; max-width: calc(var(--ar, 1) * var(--fig-pair-maxh, 440px) + var(--fig-pair-frame, 2px)); }
}
/* ===== 等高图组 end ===== */
