/* a7h — 编辑室：纸白、真黑与单一信号红。 */

:root {
  --paper:      #F4F3EF;
  --surface:    #FFFFFF;
  --sunk:       #E9E8E3;
  --ink:        #090909;
  --ink-soft:   #303030;
  --muted:      #676767;
  --rule:       #C9C8C2;
  --rule-soft:  #E0DFDA;
  --accent:     #D71920;
  --accent-dim: rgba(215, 25, 32, .10);
  --data:       #303030;
  --shadow:     none;

  --serif: "Songti SC", "STSong", "Noto Serif CJK SC", "Source Han Serif SC", "SimSun", Georgia, serif;
  --sans:  "PingFang SC", "HarmonyOS Sans SC", "Noto Sans CJK SC", "Source Han Sans SC", "Microsoft YaHei", -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono:  ui-monospace, "SF Mono", "JetBrains Mono", "Cascadia Mono", Menlo, Consolas, monospace;

  --rail-w: 268px;
  --read-w: 44rem;

  --fs-micro: .6875rem;
  --fs-xs:    .78rem;
  --fs-sm:    .875rem;
  --fs-base:  1.0625rem;
  --fs-lg:    1.1875rem;
  --fs-xl:    1.4375rem;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper:      #0B0B0B;
    --surface:    #121212;
    --sunk:       #080808;
    --ink:        #F1F0EB;
    --ink-soft:   #C9C8C2;
    --muted:      #96958F;
    --rule:       #343434;
    --rule-soft:  #242424;
    --accent:     #FF3B42;
    --accent-dim: rgba(255, 59, 66, .13);
    --data:       #C9C8C2;
    --shadow:     none;
  }
}

/* 手动切换优先于系统偏好（rail 左下的 ☾/☀ 按钮） */
:root[data-theme="dark"] {
  --paper:      #0B0B0B;
  --surface:    #121212;
  --sunk:       #080808;
  --ink:        #F1F0EB;
  --ink-soft:   #C9C8C2;
  --muted:      #96958F;
  --rule:       #343434;
  --rule-soft:  #242424;
  --accent:     #FF3B42;
  --accent-dim: rgba(255, 59, 66, .13);
  --data:       #C9C8C2;
  --shadow:     none;
}

:root[data-theme="light"] {
  --paper:      #F4F3EF;
  --surface:    #FFFFFF;
  --sunk:       #E9E8E3;
  --ink:        #090909;
  --ink-soft:   #303030;
  --muted:      #676767;
  --rule:       #C9C8C2;
  --rule-soft:  #E0DFDA;
  --accent:     #D71920;
  --accent-dim: rgba(215, 25, 32, .10);
  --data:       #303030;
  --shadow:     none;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html, body { height: 100%; }

body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: var(--fs-base);
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
}

.app {
  display: grid;
  grid-template-columns: var(--rail-w) 1fr;
  height: 100%;
}

kbd {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  background: var(--sunk);
  border: 1px solid var(--rule);
  border-bottom-width: 2px;
  border-radius: 3px;
  padding: .1em .4em;
  color: var(--muted);
}

/* ═══════════════════════════ 侧栏 ═══════════════════════════ */

.rail {
  display: grid;
  grid-template-rows: auto auto 1fr auto;   /* 品牌 · 源管理入口 · 期号列表 · 页脚 */
  border-right: 1px solid var(--rule);
  background: var(--surface);
  min-height: 0;
}

.brand { padding: 1.5rem 1.25rem 1.125rem; border-bottom: 1px solid var(--rule-soft); }

.brand__mark {
  font-family: var(--mono);
  font-size: 1.625rem;
  font-weight: 600;
  letter-spacing: -.02em;
  line-height: 1;
}
.brand__mark::after {
  content: "";
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--accent);
  margin-left: .3rem;
  vertical-align: .55rem;
}
.brand__sub {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .19em;
  text-transform: uppercase;
  color: var(--muted);
  margin-top: .45rem;
}
.brand__note {
  font-size: var(--fs-xs);
  color: var(--muted);
  margin-top: .75rem;
  line-height: 1.6;
}

/* 期号列表 */
.issues { overflow-y: auto; padding: .625rem 0; min-height: 0; }

.issue {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: none;
  font: inherit;
  color: inherit;
  cursor: pointer;
  padding: .625rem 1.25rem .625rem 1.0625rem;
  border-left: 3px solid transparent;
  display: grid;
  gap: .1rem;
}
.issue:hover { background: var(--sunk); }
.issue[aria-current="true"] {
  border-left-color: var(--accent);
  background: var(--accent-dim);
}
.issue__date {
  font-family: var(--mono);
  font-size: var(--fs-sm);
  font-variant-numeric: tabular-nums;
  display: flex;
  align-items: center;
  gap: .4rem;
}
.issue[aria-current="true"] .issue__date { color: var(--accent); font-weight: 600; }
.issue__dot {
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--accent);
  flex: none;
}
.issue__dot[data-read="true"] { background: transparent; border: 1px solid var(--rule); }
.issue__head {
  font-size: var(--fs-xs);
  color: var(--muted);
  line-height: 1.5;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.issues__empty { padding: 1rem 1.25rem; font-size: var(--fs-xs); color: var(--muted); }

/* 底部 */
.rail__foot { border-top: 1px solid var(--rule-soft); padding: 1rem 1.25rem 1.125rem; display: grid; gap: .75rem; }

.tally { display: flex; gap: 1.5rem; }
.tally dt {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--muted);
}
.tally dd {
  font-family: var(--mono);
  font-size: 1.25rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  line-height: 1.25;
}

.btn {
  font: inherit;
  font-size: var(--fs-xs);
  font-family: var(--sans);
  color: var(--ink-soft);
  background: var(--surface);
  border: 1px solid var(--rule);
  border-radius: 4px;
  padding: .5rem .75rem;
  cursor: pointer;
  transition: border-color .15s, color .15s;
}
.btn:hover { border-color: var(--accent); color: var(--accent); }
.btn:disabled { opacity: .45; cursor: not-allowed; }

.rail__hint {
  font-size: var(--fs-micro);
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .3rem .55rem;
  line-height: 1.9;
}
.rail__hint span { display: inline-flex; align-items: center; gap: .2rem; white-space: nowrap; }

/* ═══════════════════════════ 阅读区 ═══════════════════════════ */

.read {
  overflow-y: auto;
  min-height: 0;
  scroll-behavior: auto;
  overscroll-behavior-y: contain;
}
/* 详情页按正文舒适度限宽；卡片墙要放三列，给它更宽的容器 */
.read__inner { max-width: 62rem; margin-inline: auto; padding: 2.5rem 3rem 6rem; }
.read__inner--deck { max-width: 82rem; }

.empty { max-width: var(--read-w); padding-top: 4rem; display: grid; gap: .75rem; }
.empty h2 { font-family: var(--serif); font-size: var(--fs-xl); font-weight: 700; }
.empty p { color: var(--muted); font-size: var(--fs-sm); }
.empty code, .verdict code { font-family: var(--mono); font-size: .9em; background: var(--sunk); padding: .15em .4em; border-radius: 3px; }

/* ── 报头：日期 + 睡眠条 ── */
.dateline {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .5rem 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--rule);
}
.dateline__date {
  font-family: var(--mono);
  font-size: var(--fs-lg);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.dateline__meta {
  font-family: var(--mono);
  font-size: var(--fs-xs);
  color: var(--muted);
  margin-left: auto;
}

/* 7 小时睡眠轨 —— a7h 的签名元件 */
.sleep { margin: 1.5rem 0 2.5rem; display: grid; gap: .5rem; }
.sleep__label {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--muted);
}
.sleep__track {
  position: relative;
  height: 30px;
  display: flex;
  align-items: center;
}
.sleep__line { position: absolute; inset-inline: 0; height: 1px; background: var(--rule); }
.sleep__ticks { position: absolute; inset-inline: 0; display: flex; justify-content: space-between; }
.sleep__tick { width: 1px; height: 7px; background: var(--rule); }
.sleep__tick:first-child, .sleep__tick:last-child { height: 13px; background: var(--muted); }
.sleep__cap {
  position: absolute;
  top: 18px;
  font-family: var(--mono);
  font-size: var(--fs-micro);
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.sleep__cap--start { left: 0; }
.sleep__cap--end { right: 0; }

.sleep__drop {
  position: absolute;
  transform: translateX(-50%);
  display: grid;
  justify-items: center;
  gap: 3px;
}
.sleep__dropDot {
  width: 9px; height: 9px;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 4px var(--accent-dim);
}
.sleep__dropLabel {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  color: var(--accent);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.sleep--offhours .sleep__line, .sleep--offhours .sleep__tick { opacity: .45; }
.sleep__note { font-size: var(--fs-xs); color: var(--muted); }
/* 没有投递点可画时，这句说明自己单独站着——不再顶着一条空轴的上下留白 */
.sleep__note--solo { margin: 1.25rem 0 1.5rem; }

/* ── 头条 ── */
.lead { display: grid; gap: 1.125rem; }

.rank {
  display: inline-flex;
  align-items: center;
  gap: .625rem;
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .17em;
  text-transform: uppercase;
  color: var(--accent);
  justify-self: start;
}
/* 「约 4 分钟」——每条 3.5 屏、约 1200 字，读之前该知道要投入多久 */
.rank__mins { color: var(--muted); }
.rank__mins::before { content: "· "; }

/* ── 长文进度：不新加一条线 ──
   顶部本来就有一条 3px 的晨光刊头线（body::before）。再叠一条进度条就是两条线
   打架，所以这里反过来做：用一块纸色把那条线的「还没读到」的那段盖住，读到哪
   亮到哪。静止（--p:0）时整条线被盖住会显得刊头缺了一块，所以只在详情页挂
   is-reading，其余路由这块整个不显示，刊头线原样完整。 */
.readprogress {
  position: fixed;
  inset: 0 0 auto 0;
  height: 3px;
  z-index: 51;                        /* 压在 body::before（50）之上 */
  display: none;
  pointer-events: none;
  background: var(--paper);
  /* 只盖右边「未读」那段；已读段露出下面的渐变 */
  clip-path: inset(0 0 0 calc(var(--p, 0) * 100%));
}
.readprogress.is-reading { display: block; }
@media print { .readprogress { display: none; } }

/* ── 读到底的交接：下一条没读的是哪条 ──
   默认藏着，滚到 92% 才显形——没读完就先看到「读完了」是荒唐的 */
.handoff {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .5rem .875rem;
  margin: 2.5rem 0 -.5rem;
  padding: 1rem 1.25rem;
  border: 1px solid var(--rule);
  border-radius: 5px;
  background: var(--surface);
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .12em;
  text-transform: uppercase;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .28s ease, transform .28s ease;
}
.handoff.is-done { opacity: 1; transform: none; }
.handoff__hint { color: var(--muted); }
@media (prefers-reduced-motion: reduce) {
  .handoff { transition: none; }
}
.rank__bar { width: 2.25rem; height: 2px; background: var(--accent); }

.slug { font-family: var(--mono); font-size: var(--fs-sm); color: var(--muted); word-break: break-all; }
.slug a { color: var(--ink); font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--rule); }
.slug a:hover { color: var(--accent); border-bottom-color: var(--accent); }
.slug__sep { color: var(--rule); margin-inline: .5rem; }

.lead h1 {
  font-family: var(--serif);
  font-size: clamp(2rem, 3.6vw, 3rem);
  line-height: 1.28;
  font-weight: 700;
  letter-spacing: -.005em;
  text-wrap: balance;
  max-width: 19ch;
}
.standfirst { font-size: var(--fs-lg); color: var(--ink-soft); max-width: var(--read-w); line-height: 1.85; }

/* 来源详情图集：横向滚动是主交互，按钮只提供可发现、可访问的离散导航。 */
.paper-gallery {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  display: grid;
  gap: .75rem;
  padding: 1rem;
  border: 1px solid var(--rule);
  border-radius: 6px;
  background: color-mix(in srgb, var(--surface) 88%, var(--paper));
  box-shadow: var(--shadow);
  overflow: hidden;
}
.paper-gallery__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.paper-gallery__head > div:first-child { display: grid; gap: .2rem; }
.paper-gallery__eyebrow,
.paper-gallery__indicator,
.paper-gallery__meta,
.paper-gallery__hint {
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
}
.paper-gallery__eyebrow {
  color: var(--accent);
  font-size: var(--fs-micro);
  letter-spacing: .16em;
}
.paper-gallery__indicator { color: var(--ink); font-size: var(--fs-xs); font-weight: 650; }
.paper-gallery__controls { display: flex; gap: .4rem; flex: 0 0 auto; }
.paper-gallery__button {
  width: 2.75rem;
  height: 2.75rem;
  border: 1px solid var(--rule);
  border-radius: 50%;
  background: var(--paper);
  color: var(--ink);
  font: 700 1rem/1 var(--sans);
  cursor: pointer;
  transition: border-color .18s, color .18s, transform .18s;
}
.paper-gallery__button:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); transform: translateY(-1px); }
.paper-gallery__button:disabled { color: var(--muted); opacity: .42; cursor: default; }
.paper-gallery__track {
  width: 100%;
  min-width: 0;
  display: flex;
  gap: .875rem;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 0;
  overscroll-behavior-x: contain;
  touch-action: auto;
  cursor: grab;
  scrollbar-width: thin;
  scrollbar-color: var(--rule) transparent;
  -webkit-overflow-scrolling: touch;
}
.paper-gallery__track:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.paper-gallery__track.is-dragging { cursor: grabbing; scroll-snap-type: none; user-select: none; }
.paper-gallery__track::-webkit-scrollbar { height: 8px; }
.paper-gallery__track::-webkit-scrollbar-thumb { background: var(--rule); border-radius: 999px; }
.paper-gallery__slide {
  flex: 0 0 88%;
  min-width: 0;
  margin: 0;
  display: grid;
  align-content: start;
  grid-template-rows: auto 1fr;
  scroll-snap-align: start;
  border: 1px solid var(--rule-soft);
  border-radius: 4px;
  overflow: hidden;
  background: var(--paper);
  transition: border-color .18s;
}
.paper-gallery__slide[data-active="true"] { border-color: var(--ink-soft); }
.paper-gallery__image {
  height: clamp(17rem, 48vw, 34rem);
  display: grid;
  place-items: center;
  padding: .75rem;
  background: #fff;
  border-bottom: 1px solid var(--rule-soft);
}
.paper-gallery__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: none;
}
.paper-gallery figcaption {
  display: grid;
  align-content: start;
  gap: .45rem;
  padding: .9rem 1rem 1rem;
  color: var(--ink-soft);
  font-size: var(--fs-sm);
  line-height: 1.55;
}
.paper-gallery__meta { color: var(--accent); font-size: var(--fs-micro); letter-spacing: .1em; }
.paper-gallery__hint { margin: 0; color: var(--muted); font-size: var(--fs-micro); }

/* 数据条 */
.stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
  border: 1px solid var(--rule);
  border-radius: 4px;
  background: var(--surface);
  overflow: hidden;
  box-shadow: var(--shadow);
  margin-top: .5rem;
}
.stat { padding: .875rem 1.0625rem; border-right: 1px solid var(--rule-soft); min-width: 0; }
.stat:last-child { border-right: 0; }
.stat__k {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted);
  display: block;
  margin-bottom: .15rem;
}
/* overflow-wrap：跨 kind 之后 stat 的 value 可能是长文本（HN 的站点域名、release 的长版本号），
   等宽字体没有断行点会直接溢出撞进右边那格。允许任意位置断行，宁可换行也不许压字。 */
.stat__v { font-family: var(--mono); font-size: 1.3125rem; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.25; overflow-wrap: anywhere; }
.stat__v small { font-size: .7rem; font-weight: 400; color: var(--muted); margin-left: .25rem; }
.stat--hot .stat__v { color: var(--accent); }

/* 正文 */
.body { max-width: var(--read-w); display: grid; gap: 2.5rem; margin-top: 2.75rem; }
.body section { display: grid; gap: .875rem; }
.body h2 {
  font-family: var(--serif);
  font-size: var(--fs-xl);
  font-weight: 700;
  line-height: 1.4;
  padding-bottom: .5rem;
  border-bottom: 2px solid var(--ink);
  text-wrap: balance;
}
.body p { text-wrap: pretty; }

.pipeline { display: grid; counter-reset: step; }
.pipeline li {
  list-style: none;
  counter-increment: step;
  display: grid;
  grid-template-columns: 2.125rem 1fr;
  gap: .875rem;
  padding: .875rem 0;
  border-bottom: 1px dashed var(--rule);
}
.pipeline li:last-child { border-bottom: 0; }
.pipeline li::before {
  content: counter(step, decimal-leading-zero);
  font-family: var(--mono);
  font-size: var(--fs-xs);
  font-variant-numeric: tabular-nums;
  color: var(--accent);
  padding-top: .3rem;
}
.pipeline h3 { font-size: var(--fs-base); font-weight: 600; margin-bottom: .15rem; }
.pipeline p { color: var(--ink-soft); font-size: var(--fs-sm); line-height: 1.7; }

.split { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); }
.split > div { border-top: 2px solid var(--rule); padding-top: .75rem; }
.split--yes { border-top-color: var(--data) !important; }
.split--no { border-top-color: var(--muted) !important; }
.split h3 {
  font-family: var(--mono);
  font-size: var(--fs-xs);
  letter-spacing: .12em;
  text-transform: uppercase;
  margin-bottom: .5rem;
}
.split--yes h3 { color: var(--data); }
.split--no h3 { color: var(--muted); }
.split ul { list-style: none; display: grid; gap: .5rem; font-size: var(--fs-sm); color: var(--ink-soft); line-height: 1.65; }
.split li { padding-left: .875rem; position: relative; }
.split li::before { content: "—"; position: absolute; left: 0; color: var(--rule); }

.verdict {
  border-left: 3px solid var(--accent);
  background: var(--accent-dim);
  border-radius: 0 4px 4px 0;
  padding: 1rem 1.25rem;
  font-size: var(--fs-lg);
  font-family: var(--serif);
  line-height: 1.7;
}

/* ── 卡片墙：三条平等，点开看全文 ── */
.deck__label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .5rem 1rem;
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .17em;
  text-transform: uppercase;
  color: var(--muted);
  padding-bottom: .75rem;
  border-bottom: 1px solid var(--rule);
  margin-bottom: 1.5rem;
}
.deck__label--done { color: var(--muted); opacity: .85; }

/* 「继续读第 N 条」——把侧栏那个点不动的未读数变成一个能按下去的东西 */
.deck__resume {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  color: var(--accent);
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  transition: opacity .16s ease;
}
.deck__resume:hover { opacity: .68; }
/* 手机上这是个 19px 高的文字按钮，手指点不准。撑到 44px（iOS HIG 下限），
   用负外边距把撑出来的高度还回去，不影响那一行的排版。 */
@media (pointer: coarse) {
  .deck__resume { min-height: 44px; margin-block: -.75rem; }
}
.deck__resume kbd {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .08em;
  color: var(--muted);
  border: 1px solid var(--rule);
  border-radius: 3px;
  padding: 0 .3rem;
  line-height: 1.45;
}
@media (max-width: 700px) { .deck__resume kbd { display: none; } }  /* 手机上没键盘 */

.deck { display: grid; gap: 1.25rem; grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1180px) { .deck { grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr)); } }

.edition-section { margin-top: 2rem; }
.edition-section__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  padding-bottom: .55rem;
  border-bottom: 2px solid var(--ink);
}
.edition-section__head h2 {
  font-family: var(--serif);
  font-size: clamp(1.25rem, 2.1vw, 1.65rem);
}
.edition-section__head span {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  color: var(--muted);
  letter-spacing: .12em;
}

/* ─────────────── 画廊 ───────────────
   头版有编辑判断（头条整幅、其余方块、只给一句 teaser），滑读一次只给一张卡。
   两者都答不了「这一期到底有些什么」。画廊按滑读卡的口径——封面 + 标题 + intro
   + traction——一行三个全部铺开。

   卡片本体复用 .card（点击委托、hover、已读圆点都在那边），这里只覆盖版式。
   双类选择器不是啰嗦：.card 的规则写在本段之后，同为单类优先级时后者胜出，
   .gcard 的 padding:0 会被 .card 的 padding 吃掉。 */
.gallery__head {
  display: flex;
  align-items: flex-end;
  gap: 1.25rem;
  flex-wrap: wrap;
  padding-bottom: 1.1rem;
  margin-bottom: 1.6rem;
  border-bottom: 2px solid var(--ink);
}
.gallery__head .back { margin-inline-end: auto; }
.gallery__title { font-family: var(--serif); font-size: clamp(1.5rem, 3.4vw, 2.1rem); line-height: 1.2; }
.gallery__count {
  font-family: var(--mono);
  font-size: var(--fs-xs);
  color: var(--muted);
  white-space: nowrap;
}

.gallery { display: grid; gap: 1.25rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* 一行三个是这个视图的主张，但 19rem 以下卡片会挤成条状——先退两列再退一列 */
@media (max-width: 1180px) { .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .gallery { grid-template-columns: minmax(0, 1fr); } }

.card.gcard { padding: 0; gap: 0; overflow: hidden; }
/* .card::after 那个大号描边序号在头版是压在卡片留白上的装饰；画廊卡片没有留白，
   它会直接盖在封面照片上，看着像水印。meta 行已经有 TOP n，这里不重复。 */
.card.gcard::after { content: none; }
.gcard__cover {
  aspect-ratio: 2.15 / 1;          /* 和滑读卡同一个画幅，封面看起来才是同一套 */
  overflow: hidden;
  background: var(--sunk);
  border-bottom: 1px solid var(--rule);
}
.gcard__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gcard__body {
  /* 撑满卡片剩余高度：不然 traction 的 margin-top:auto 没有可推的空间，
     同一行三张卡的指标条会各停在各自正文的下一行，参差不齐。 */
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: .85rem;
  padding: 1.25rem 1.25rem 1.1rem;
}
.gcard__meta {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  flex-wrap: wrap;
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .15em;
  color: var(--muted);
}
.gcard__meta b { color: var(--accent); font-size: var(--fs-sm); font-weight: 600; font-variant-numeric: tabular-nums; }
.gcard__title {
  font-family: var(--serif);
  font-size: clamp(1.15rem, 1.5vw, 1.4rem);
  line-height: 1.28;
  text-wrap: balance;
  /* 三行封顶：同一行的三张卡高度不一致时，网格会被最长那张撑开 */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
.gcard__lede {
  color: var(--ink-soft);
  font-size: var(--fs-sm);
  line-height: 1.62;
  text-wrap: pretty;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
  overflow: hidden;
}
/* traction 与 cue 贴底对齐：一行三张卡的正文长短不一，指标条飘在中间会很乱 */
.gcard__body .taste-card__traction { margin-top: auto; }
.gcard__body .taste-card__ind b { font-size: var(--fs-sm); }
.gcard__body .taste-card__ind { padding: .5rem .6rem; }
.card.gcard .card__cue { margin-left: auto; font-family: var(--mono); font-size: var(--fs-xs); }

/* ─────────────── 头版头条 ───────────────
   编辑闸门早就选出了 TOP 1，版面却把它和 TOP 9 画成同样大的方块。报纸不是这么
   做的：头版给头条整幅位置。这里把那个已有的编辑判断在版面上兑现，顺带解决首屏
   ——原先打开只能看到三张卡的上半截，现在第一眼就是一条完整的头条。
   复用 .card 的类（点击/键盘/已读圆点都走同一套），只覆盖布局。 */
/* 双类选择器是必要的，不是啰嗦：.card 的规则写在本段之后，同为单类优先级时后者
   胜出，.lede 的 display:grid 会被 .card 的 display:flex 吃掉。 */
.card.lede {
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(0, 1fr);
  align-items: stretch;
  gap: 0;
  padding: 0;
  overflow: hidden;
  margin-bottom: 2.25rem;
}
.lede__cover {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--sunk);
  border-inline-end: 1px solid var(--rule);
}
.lede__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lede__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: .7rem;
  padding: 1.875rem 1.875rem 1.625rem;
  min-width: 0;
}
.lede__kicker {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .15em;
  color: var(--accent);
  display: flex;
  align-items: baseline;
  gap: .5rem;
}
.lede__kicker b { font-size: var(--fs-sm); font-weight: 600; font-variant-numeric: tabular-nums; }
.lede__title {
  font-family: var(--serif);
  font-size: clamp(1.6rem, 1.15rem + 1.7vw, 2.5rem);
  line-height: 1.16;
  letter-spacing: -.01em;
  margin: 0;
}
.lede__teaser { font-size: var(--fs-lg); line-height: 1.5; margin: 0; }
.lede__stand { font-size: var(--fs-sm); line-height: 1.6; color: var(--muted); margin: 0; }
.lede__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .5rem 1rem;
  margin-top: .35rem;
  padding-top: .875rem;
  border-top: 1px solid var(--rule);
}
.lede__foot .card__cue { margin-inline-start: auto; }

/* 窄屏：图回到顶部，压成横幅——竖着占半屏的封面会把标题又推出首屏 */
@media (max-width: 900px) {
  .card.lede { grid-template-columns: 1fr; margin-bottom: 1.75rem; }
  .lede__cover {
    aspect-ratio: 2 / 1;
    border-inline-end: 0;
    border-block-end: 1px solid var(--rule);
  }
  .lede__body { padding: 1.25rem 1.25rem 1.125rem; gap: .625rem; }
}

/* flex + foot 的 margin-top:auto —— 钩子行数不一时，三张卡的数据行仍对齐在同一基线 */
.card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: .75rem;
  text-align: left;
  font: inherit;
  color: inherit;
  cursor: pointer;
  border: 1px solid var(--rule);
  border-radius: 5px;
  background: var(--surface);
  padding: 1.5rem 1.5rem 1.25rem;
  box-shadow: var(--shadow);
  transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}
.card:hover {
  border-color: var(--accent);
  transform: translateY(-3px);
  box-shadow: 0 2px 4px rgba(22,32,46,.05), 0 22px 40px -24px rgba(22,32,46,.42);
}
.card:active { transform: translateY(-1px); }

/* 没点开过的角标 */
.card__new {
  position: absolute;
  top: .875rem; right: .875rem;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--accent);
}

.card__rank {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .15em;
  color: var(--muted);
  display: flex;
  align-items: baseline;
  gap: .5rem;
}
.card__rank b { color: var(--accent); font-size: var(--fs-sm); font-weight: 600; font-variant-numeric: tabular-nums; }

.card__slug {
  font-family: var(--mono);
  font-size: var(--fs-xs);
  color: var(--muted);
  word-break: break-all;
  line-height: 1.5;
}

/* 来源平台徽章：跟着 slug 字号走（1.15em），GitHub 标随 --ink-soft 反色，
   其余三家自带品牌色。inline-flex + flex:none 保证图标不被 word-break 拆散。 */
.src-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.15em;
  height: 1.15em;
  vertical-align: -0.22em;
  margin-right: .42em;
  color: var(--ink-soft);
  flex: none;
}
.src-badge svg { width: 100%; height: 100%; display: block; }
.card h3 {
  font-family: var(--serif);
  font-size: 1.375rem;
  font-weight: 700;
  line-height: 1.42;
  text-wrap: balance;
}
.card__teaser { font-size: var(--fs-sm); color: var(--ink-soft); line-height: 1.75; }

.card__foot {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: .375rem .875rem;
  font-family: var(--mono);
  font-size: var(--fs-xs);
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  padding-top: .875rem;
  margin-top: auto;
  border-top: 1px solid var(--rule-soft);
  /* 多源期的脚注比 repo 长，会折行。预留两行高度，
     三张卡的数据行才继续对齐在同一条横线上。 */
  gap: .3rem .75rem;
  line-height: 1.55;
  min-height: 3.3rem;
  align-content: flex-start;
}
/* 卡片脚：前两条 stat（谁 hot 谁上橘）+ 前两个 facet，全部数据驱动 */
.card__foot .fact { color: var(--ink-soft); display: inline-flex; align-items: baseline; }
.card__foot .fact i {
  font-style: normal;
  font-weight: 400;
  color: var(--muted);
  margin-right: .34rem;
}
.card__foot .fact small { font-size: .85em; font-weight: 400; color: var(--muted); margin-left: .15rem; }
.card__foot .fact--facet { color: var(--muted); }
.card__foot .hot { color: var(--accent); font-weight: 600; }
.card__cue { margin-left: auto; color: var(--muted); transition: color .16s, transform .16s; }
.card:hover .card__cue { color: var(--accent); transform: translateX(2px); }

/* ── Taste Deck：严肃新闻的单卡偏好流 ── */

/* Web iPhone 模拟器：保留触控/滚轮滚动，但隐藏 iframe 内的白色滚动槽。 */
html.simulator-embed,
html.simulator-embed body,
html.simulator-embed .read,
html.simulator-embed .taste-card {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
html.simulator-embed::-webkit-scrollbar,
html.simulator-embed body::-webkit-scrollbar,
html.simulator-embed .read::-webkit-scrollbar,
html.simulator-embed .taste-card::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.read__inner--taste {
  max-width: 56rem;
  min-height: 100dvh;
  padding-block: 0;
  display: grid;
  place-items: center;
}
.taste { width: 100%; display: grid; gap: 1rem; }
.taste__head {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 1rem;
}
.taste__head .back { justify-self: start; }
.taste__title { text-align: center; }
/* 质检降级说明。克制而不隐藏：读者该知道自己在读什么，但这不是错误横幅——
   这期内容仍然可读，只是没有独立证据支撑。所以用次要色 + 小字，不用 accent。 */
.taste__quality {
  font: var(--fs-micro)/1.5 var(--mono);
  color: var(--muted);
  margin: .3rem 0 0;
  text-wrap: balance;
}
.taste-done h1 {
  font-family: var(--serif);
  font-size: clamp(1.65rem, 3vw, 2.25rem);
  line-height: 1.25;
}
.taste__eyebrow {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--muted);
}
.taste__head-meta {
  justify-self: end;
  display: flex;
  align-items: center;
  gap: .55rem;
}
.taste__count {
  font-family: var(--mono);
  font-size: var(--fs-sm);
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.taste__help {
  width: 1.75rem;
  height: 1.75rem;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid var(--rule);
  border-radius: 50%;
  background: var(--surface);
  color: var(--muted);
  font: 700 var(--fs-sm)/1 var(--mono);
  cursor: pointer;
}
.taste__help:hover, .taste__help:focus-visible { border-color: var(--accent); color: var(--accent); }
.taste__progress { height: 3px; background: var(--rule); border-radius: 99px; overflow: hidden; }
.taste__progress i { display: block; height: 100%; background: var(--accent); transition: width .2s ease; }
.taste__learned, .taste-summary { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; min-height: 1.8rem; }
.taste-chip {
  display: inline-flex;
  align-items: center;
  padding: .16rem .58rem;
  border: 1px solid var(--rule);
  border-radius: 999px;
  font-family: var(--mono);
  font-size: var(--fs-micro);
  color: var(--muted);
  background: var(--surface);
}
.taste-chip--more { color: var(--data); border-color: color-mix(in srgb, var(--data) 36%, var(--rule)); }
.taste-chip--less { color: var(--muted); border-style: dashed; }

.taste-stage { display: grid; place-items: center; min-height: 0; overflow: hidden; padding: .3rem 2rem 1rem; }
.taste-card {
  position: relative;
  display: flex;
  flex-direction: column;
  width: min(100%, 43rem);
  /* 一屏看完是硬要求：卡片永不滚动，内容靠封面压缩 + 行数钳制来适配 */
  max-height: calc(100dvh - 12rem);
  overflow: hidden;
  border: 1px solid var(--rule);
  border-radius: 10px;
  background: var(--surface);
  box-shadow: 0 2px 4px rgba(22,32,46,.06), 0 28px 60px -32px rgba(22,32,46,.48);
  touch-action: none;
  user-select: none;
  transition: transform .18s ease, opacity .18s ease, border-color .18s ease;
  cursor: grab;
}
.taste-card--dragging { cursor: grabbing; transition: none; }
.taste-card__cover {
  flex: 0 1 auto;
  min-height: 4rem;
  aspect-ratio: 2.15 / 1;
  overflow: hidden;
  background: var(--sunk);
  border-bottom: 1px solid var(--rule);
}
.taste-card__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.taste-card__body {
  flex: 0 0 auto;
  display: grid;
  gap: 1.15rem;
  padding: 1.75rem 1.75rem 1.5rem;
}
.taste-card__meta {
  font-family: var(--mono);
  font-size: var(--fs-xs);
  color: var(--muted);
  word-break: break-all;
}
.taste-card h2 {
  font-family: var(--serif);
  font-size: clamp(2.1rem, 7vw, 2.9rem);
  line-height: 1.22;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  text-wrap: balance;
}
.taste-card__lede {
  color: var(--ink-soft);
  font-size: clamp(1.2rem, 4.6vw, 1.4375rem);
  line-height: 1.6;
  text-wrap: pretty;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  /* intro 至少 3 句 ≈ 6–8 行，钳到 8 行；不够就压封面，卡片仍然不滚动 */
  -webkit-line-clamp: 10;
  overflow: hidden;
}

/* traction：它凭什么冒头。只给指标，不写句子。 */
.taste-card__traction {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  border: 1px solid var(--rule);
  border-radius: 6px;
  overflow: hidden;
}
.taste-card__ind {
  display: grid;
  gap: .2rem;
  padding: .85rem .9rem;
  min-width: 0;
}
.taste-card__ind + .taste-card__ind { border-left: 1px solid var(--rule); }
.taste-card__ind b {
  font-family: var(--mono);
  font-size: clamp(1.2rem, 4.4vw, 1.55rem);
  font-weight: 500;
  line-height: 1.1;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* 单位压小：数字才是 traction，别让 "star" 把 "+3,270" 挤成省略号 */
.taste-card__ind b i { font-size: .62em; font-style: normal; margin-left: .1em; }
.taste-card__ind span {
  font-size: var(--fs-xs);
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* hot 是各源自己标的突出指标，用唯一那点信号红 */
.taste-card__ind--hot { background: var(--sunk); }
.taste-card__ind--hot b { color: var(--accent); }

/* 排序收据：DESIGN.md 的 Reveal the machinery，压成一条发丝小字，不算内容块 */
.taste-card__receipt {
  font: var(--fs-micro)/1.4 var(--mono);
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.taste-card__stamp {
  position: absolute;
  z-index: 4;
  top: 1.25rem;
  padding: .28rem .75rem;
  border: 2px solid currentColor;
  border-radius: 4px;
  font-family: var(--mono);
  font-weight: 700;
  letter-spacing: .12em;
  background: var(--surface);
  opacity: 0;
  pointer-events: none;
}
.taste-card__stamp--less { left: 1.25rem; color: var(--muted); transform: rotate(-5deg); }
.taste-card__stamp--more { right: 1.25rem; color: var(--data); transform: rotate(5deg); }
.taste-card__stamp--deep { left: 50%; color: var(--accent); transform: translateX(-50%); }
.taste-card__stamp--skip { top: auto; bottom: 1.25rem; left: 50%; color: var(--muted); transform: translateX(-50%); }
.taste-card[data-peek="less"] .taste-card__stamp--less,
.taste-card[data-peek="more"] .taste-card__stamp--more,
.taste-card[data-peek="deep"] .taste-card__stamp--deep,
.taste-card[data-peek="skip"] .taste-card__stamp--skip { opacity: 1; }
.taste-card--exit-left  { transform: translateX(-120%) rotate(-7deg) !important; opacity: 0; }
.taste-card--exit-right { transform: translateX(120%) rotate(7deg) !important; opacity: 0; }
.taste-card--exit-down  { transform: translateY(35%) !important; opacity: 0; }
.taste-card--exit-up    { transform: translateY(-35%) !important; opacity: 0; }

.taste-help {
  width: min(29rem, calc(100vw - 2rem));
  margin: auto;
  padding: 1.4rem;
  border: 1px solid var(--rule);
  background: var(--paper);
  color: var(--ink);
  box-shadow: 0 1.4rem 4rem color-mix(in srgb, var(--ink) 24%, transparent);
}
.taste-help::backdrop { background: color-mix(in srgb, var(--ink) 42%, transparent); }
.taste-help form { display: flex; justify-content: end; margin: -.45rem -.45rem 0 0; }
.taste-help__close {
  width: 2rem;
  height: 2rem;
  border: 0;
  background: none;
  color: var(--muted);
  font-size: 1.4rem;
  line-height: 1;
  cursor: pointer;
}
.taste-help h2 { margin: .45rem 0 .6rem; font-family: var(--serif); font-size: clamp(1.5rem, 5vw, 2rem); }
.taste-help > p:not(.taste__eyebrow) { color: var(--ink-soft); line-height: 1.6; }
.taste-help__directions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; margin: 1.15rem 0 0; padding: 0; list-style: none; }
.taste-help__directions li { display: flex; align-items: center; gap: .55rem; min-width: 0; padding: .65rem; border: 1px solid var(--rule); }
.taste-help__directions kbd { min-width: 1.55rem; text-align: center; color: var(--accent); font: 700 var(--fs-sm)/1 var(--mono); }
.taste-help__directions span { display: grid; gap: .08rem; min-width: 0; }
.taste-help__directions b { font-size: var(--fs-sm); }
.taste-help__directions small { color: var(--muted); font-size: var(--fs-micro); line-height: 1.35; }

.taste__foot { display: flex; justify-content: center; flex-wrap: wrap; gap: .3rem 1rem; color: var(--muted); font-size: var(--fs-micro); }
.taste__foot button { border: 0; background: none; color: var(--accent); font: inherit; cursor: pointer; text-decoration: underline; }

.taste-done {
  max-width: 38rem;
  margin: clamp(4rem, 12vh, 8rem) auto 0;
  display: grid;
  justify-items: center;
  gap: 1rem;
  text-align: center;
}
.taste-done__mark { width: 3rem; height: 3rem; display: grid; place-items: center; border: 1px solid var(--data); border-radius: 50%; color: var(--data); font-size: 1.25rem; }
.taste-done > p:not(.taste__eyebrow) { color: var(--ink-soft); max-width: 34rem; }
.taste-done__actions { display: flex; gap: .65rem; margin-top: .5rem; }
.btn--primary { color: #fff; border-color: var(--accent); background: var(--accent); }
.btn--primary:hover { color: #fff; filter: brightness(.96); }

@media (max-width: 700px) {
  .read__inner--taste { padding-inline: .85rem; }
  .taste__head { grid-template-columns: auto 1fr auto; }
  .taste__head .back { width: 2rem; height: 2rem; justify-content: center; font-size: 0; }
  .taste__head .back::before { content: "←"; font-size: var(--fs-base); }
  .taste__eyebrow { letter-spacing: .08em; }
  .taste-help { padding: 1.15rem; }
  .taste-help__directions { grid-template-columns: 1fr; }
  .taste-stage { min-height: 0; padding-inline: .1rem; }
  /* 手机上照样一屏看完：只收紧内边距，不缩标题——放大字号是这版的要求 */
  .taste-card { max-height: calc(100dvh - 11rem); }
  .taste-card__body { padding: 1.35rem 1.2rem 1.2rem; gap: .95rem; }
  .taste-card__ind { padding: .7rem .6rem; }
}

/* ── Research Workroom：滑读卡片背后的移动研究工作台 ── */
.read__inner--workroom { width: min(100%, 58rem); }
.workroom { display: grid; gap: 1.4rem; }
.workroom__head { display: grid; gap: .8rem; padding-bottom: 1.2rem; border-bottom: 3px double var(--ink); }
.workroom__eyebrow {
  color: var(--accent);
  font: var(--fs-micro)/1.4 var(--mono);
  letter-spacing: .16em;
}
.workroom h1 {
  max-width: 24ch;
  font-family: var(--serif);
  font-size: clamp(2rem, 5vw, 3.4rem);
  line-height: 1.08;
  text-wrap: balance;
}
.workroom__receipt {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .25rem .8rem;
  padding: .85rem 1rem;
  background: var(--surface);
  border: 1px solid var(--rule);
  border-left: 4px solid var(--accent);
  font-family: var(--mono);
}
.workroom__receipt span { color: var(--accent); font-size: var(--fs-micro); letter-spacing: .14em; }
.workroom__receipt b { font-size: var(--fs-sm); font-weight: 600; }
.workroom__receipt small { grid-column: 2; color: var(--muted); font-size: var(--fs-micro); }
.workroom__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border: 1px solid var(--rule); }
.workroom__section { min-width: 0; padding: 1.15rem 1.25rem; background: var(--surface); border-bottom: 1px solid var(--rule); }
.workroom__section:nth-child(odd) { border-right: 1px solid var(--rule); }
.workroom__section:nth-last-child(-n + 2) { border-bottom: 0; }
.workroom__section h2 {
  margin-bottom: .7rem;
  color: var(--accent);
  font: 700 var(--fs-xs)/1.3 var(--mono);
  letter-spacing: .12em;
}
.workroom__section ul { padding-left: 1.1rem; color: var(--ink-soft); font-size: var(--fs-sm); }
.workroom__section li + li { margin-top: .45rem; }
.workroom__actions { display: flex; flex-wrap: wrap; gap: .65rem; }
.workroom__actions a { text-decoration: none; text-align: center; }

@media (max-width: 700px) {
  .read__inner--workroom { padding-inline: 1rem; }
  .workroom { gap: 1rem; }
  .workroom__grid { grid-template-columns: 1fr; }
  .workroom__section, .workroom__section:nth-child(odd) { border-right: 0; border-bottom: 1px solid var(--rule); }
  .workroom__section:last-child { border-bottom: 0; }
  .workroom__receipt { grid-template-columns: 1fr; }
  .workroom__receipt small { grid-column: 1; }
  .workroom__actions > * { flex: 1 1 12rem; min-height: 44px; }
}

/* ── 详情页 ── */
.backbar { margin-bottom: 2rem; }
.back {
  font: inherit;
  font-size: var(--fs-sm);
  font-family: var(--mono);
  color: var(--muted);
  background: none;
  border: 0;
  padding: .25rem 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  transition: color .15s;
}
.back:hover { color: var(--accent); }
.back kbd { margin-left: .25rem; }

/* 无 AI 解读时的降级 */
.raw { border: 1px dashed var(--rule); border-radius: 4px; padding: 1rem 1.25rem; color: var(--muted); font-size: var(--fs-sm); }

.colophon {
  margin-top: 4rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--rule);
  font-size: var(--fs-xs);
  color: var(--muted);
  max-width: var(--read-w);
  display: grid;
  gap: .375rem;
  line-height: 1.7;
}

/* 期号徽章：主题报 / 演示数据 */
.pill {
  display: inline-block;
  vertical-align: .1em;
  margin-left: .75rem;
  padding: .1em .6em;
  border-radius: 999px;
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .1em;
  text-transform: uppercase;
  line-height: 1.7;
}
.pill--topic {
  color: var(--data);
  background: color-mix(in srgb, var(--data) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--data) 32%, transparent);
}
.pill--mock {
  color: var(--accent);
  background: var(--accent-dim);
  border: 1px dashed color-mix(in srgb, var(--accent) 45%, transparent);
}
/* 非 trending / topic 的 preset 期（stack、papers、wide…） */
.pill--preset {
  color: var(--ink-soft);
  background: var(--sunk);
  border: 1px solid var(--rule);
}

/* 侧栏期号上的主题小标签 */
.issue__tag {
  margin-left: .5rem;
  padding: 0 .45em;
  border-radius: 999px;
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .06em;
  color: var(--data);
  border: 1px solid color-mix(in srgb, var(--data) 32%, transparent);
  background: color-mix(in srgb, var(--data) 8%, transparent);
}

/* 侧栏期号上的 preset 小标签（stack / papers / wide …） */
.issue__tag--preset {
  color: var(--muted);
  border-color: var(--rule);
  background: transparent;
}

/* ── 版面标记：不同 kind 的视觉区分 ──
   repo 是本报的默认版面，不加标记（旧期因此零视觉变化）。
   其余各 kind 一枚章，只用已有 token：accent 橘（要动手的事）、
   data 墨蓝（读的东西）、muted 灰（听人说的话）。 */
.kindtag {
  display: inline-block;
  margin-left: .55rem;
  padding: .05em .5em;
  border-radius: 3px;
  font-family: var(--mono);
  font-size: var(--fs-micro);
  font-weight: 600;
  letter-spacing: .1em;
  line-height: 1.65;
  vertical-align: .06em;
}
.kindtag--release {
  color: var(--accent);
  background: var(--accent-dim);
  border: 1px solid color-mix(in srgb, var(--accent) 42%, transparent);
}
.kindtag--paper {
  color: var(--data);
  background: color-mix(in srgb, var(--data) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--data) 34%, transparent);
}
.kindtag--post {
  color: var(--ink-soft);
  background: var(--sunk);
  border: 1px solid var(--rule);
}
/* 没见过的 kind：不崩，也不假装认识它 —— 虚线灰章 */
.kindtag--x {
  color: var(--muted);
  background: transparent;
  border: 1px dashed var(--rule);
}
.rank .kindtag { letter-spacing: .1em; text-transform: none; }

/* 结论旁的立场小 pill（digest.stance，旧 digest 没有这个字段） */
.stance {
  float: right;
  margin: .15rem 0 .35rem .875rem;
  padding: .08em .65em;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent);
  background: var(--surface);
  color: var(--accent);
  font-family: var(--mono);
  font-size: var(--fs-xs);
  font-weight: 600;
  letter-spacing: .06em;
  line-height: 1.9;
}

/* 各源战报：某个源今天没抓到时的一行灰字。旧期没有 sources 字段，不渲染。 */
.srcfail {
  margin-top: 1rem;
  padding: .625rem .875rem;
  border-left: 2px solid var(--rule);
  background: var(--sunk);
  border-radius: 0 3px 3px 0;
  font-family: var(--mono);
  font-size: var(--fs-xs);
  color: var(--muted);
  line-height: 1.75;
}

/* 详情页底部翻卡：三条卡是平等的，一口气翻完 */
.cardnav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-top: 3.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--rule);
}
.cardnav__btn {
  display: grid;
  gap: .3rem;
  text-align: left;
  font: inherit;
  cursor: pointer;
  border: 1px solid var(--rule);
  border-radius: 5px;
  background: var(--surface);
  padding: .875rem 1.125rem;
  box-shadow: var(--shadow);
  transition: border-color .16s ease, transform .16s ease;
}
.cardnav__btn:hover { border-color: var(--accent); transform: translateY(-2px); }
.cardnav__btn--next { text-align: right; }
.cardnav__btn--off { visibility: hidden; }
.cardnav__k {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--accent);
}
.cardnav__t {
  font-size: var(--fs-sm);
  color: var(--ink-soft);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── 版面升级：出版物的仪式感 ── */

/* 顶部刊头线：橘到墨蓝的晨光渐变 */
body::before {
  content: "";
  position: fixed;
  inset: 0 0 auto 0;
  height: 3px;
  background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--data) 70%, var(--accent)) 60%, var(--data));
  z-index: 50;
}

::selection { background: color-mix(in srgb, var(--accent) 26%, transparent); }

/* 刊头：大衬线日期 + 双细线 + 期号，报纸头版的排法 */
.mast { padding-bottom: 1.75rem; margin-bottom: .25rem; position: relative; }
.mast::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 4px;
  border-top: 2.5px solid var(--ink);
  border-bottom: 1px solid var(--ink);
}
.mast__kicker {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .34em;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: .875rem;
  display: flex;
  align-items: center;
  gap: .875rem;
}
.mast__kicker::after { content: ""; flex: 1; height: 1px; background: var(--rule); }
.mast__title {
  font-family: var(--serif);
  font-size: clamp(2.4rem, 5vw, 3.9rem);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -.01em;
}
.mast__edition {
  max-width: 24ch;
  margin-top: .55rem;
  font-family: var(--serif);
  font-size: clamp(1.35rem, 2.8vw, 2.15rem);
  font-weight: 620;
  line-height: 1.2;
  color: var(--ink-soft);
}
.mast__no {
  font-family: var(--serif);
  font-size: clamp(1.1rem, 1.6vw, 1.4rem);
  color: var(--muted);
  margin-top: .5rem;
  display: flex;
  align-items: center;
  gap: .75rem;
  flex-wrap: wrap;
}
.mast__no .pill { margin-left: 0; }
.mast__src { font-family: var(--mono); font-size: var(--fs-xs); color: var(--muted); margin-top: .625rem; }
/* 手机上这串源名要占满两行（「数据源 GitHub Trending · GitHub 新仓库（主题）·
   HuggingFace 每日论文 · Hacker News」），而它每天都一样、读者也不为它而来。
   收成一行，想看完整的横着划——首屏那 44px 留给内容。 */
@media (max-width: 700px) {
  .mast__src {
    white-space: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .mast__src::-webkit-scrollbar { display: none; }
}

.editor-note,
.lookback {
  display: grid;
  grid-template-columns: 7.5rem minmax(0, 1fr);
  gap: 1rem;
  margin: 1.4rem 0 1.75rem;
  padding: 1rem 1.1rem;
  border: 1px solid var(--rule);
  border-left: 4px solid var(--accent);
  background: color-mix(in srgb, var(--paper) 91%, var(--accent));
}
.editor-note > span,
.lookback > span {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--accent);
}
.editor-note p { margin: 0; font-family: var(--serif); line-height: 1.65; }
.lookback a { font-family: var(--serif); font-weight: 700; color: var(--ink); }
.lookback small { display: block; margin-top: .4rem; color: var(--muted); }
@media (max-width: 700px) {
  .editor-note,
  .lookback { grid-template-columns: 1fr; gap: .5rem; }
}

/* 卡片：右上角幽灵排名数字，悬停时顶部扫过一道橘线 */
.card { overflow: hidden; }
.card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2.5px;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .28s ease;
}
.card:hover::before { transform: scaleX(1); }
.card::after {
  content: attr(data-rank);
  position: absolute;
  top: .35rem; right: .9rem;
  font-family: var(--serif);
  font-size: 3.6rem;
  font-weight: 700;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1.2px var(--rule);
  pointer-events: none;
  transition: -webkit-text-stroke-color .2s ease;
}
.card:hover::after { -webkit-text-stroke-color: color-mix(in srgb, var(--accent) 55%, transparent); }
.card__rank { position: relative; z-index: 1; }

/* 未读点：呼吸脉冲，早上的新报纸在召唤 */
.card__new { animation: pulse 2.2s ease-in-out infinite; }
@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 45%, transparent); }
  55%      { box-shadow: 0 0 0 6px transparent; }
}

/* 路由切换：内容逐段浮起，像翻页 */
.enter > * { animation: rise .5s cubic-bezier(.2, .7, .2, 1) both; }
.enter > *:nth-child(2) { animation-delay: .05s; }
.enter > *:nth-child(3) { animation-delay: .1s; }
.enter > *:nth-child(4) { animation-delay: .15s; }
.enter > *:nth-child(5) { animation-delay: .2s; }
@keyframes rise {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: none; }
}

/* 详情页导语首字下沉，衬线橘色 */
.standfirst::first-letter {
  font-family: var(--serif);
  font-size: 2.9em;
  font-weight: 700;
  line-height: .9;
  float: left;
  padding: .06em .12em 0 0;
  color: var(--accent);
}

/* 章节标题前的小橘标 */
.body h2 { position: relative; padding-left: 1.1rem; }
.body h2::before {
  content: "";
  position: absolute;
  left: 0; top: .42em;
  width: .42rem; height: .42rem;
  background: var(--accent);
  transform: rotate(45deg);
}

/* 主题切换按钮 */
.btn--icon {
  width: 2.125rem;
  height: 2.125rem;
  padding: 0;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  font-size: .95rem;
  line-height: 1;
}
.rail__actions { display: flex; gap: .5rem; align-items: center; }
.rail__actions .btn:first-child { flex: 1; }

/* 焦点可见 */
:is(a, button, .issue):focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 2px; }

/* 滚动条收敛一点 */
.issues::-webkit-scrollbar, .read::-webkit-scrollbar { width: 10px; }
.issues::-webkit-scrollbar-thumb, .read::-webkit-scrollbar-thumb {
  background: var(--rule); border-radius: 5px; border: 3px solid var(--surface);
}
.read::-webkit-scrollbar-thumb { border-color: var(--paper); }

/* 窄屏：把桌面侧栏压成一块机械式控制台，让头版在首屏立即可见。 */
@media (max-width: 900px) {
  html, body { height: auto; min-height: 100%; }
  body { overflow-x: hidden; overflow-y: auto; }
  .app {
    width: 100%;
    max-width: 100vw;
    min-width: 0;
    min-height: 100dvh;
    height: auto;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
  }
  .rail {
    position: sticky;
    top: 0;
    z-index: 20;
    grid-template-columns: auto minmax(0, 1fr) 152px;   /* 放得下滑读 + 头版两个 44px 目标 */
    grid-template-rows: auto auto;
    grid-template-areas:
      "brand nav actions"
      "issues issues issues";
    border-right: 0;
    border-bottom: 1px solid var(--rule);
    box-shadow: 0 1px 0 var(--paper);
    width: 100%;
    max-width: 100vw;
    min-width: 0;
    overflow: hidden;
  }
  .rail > * { min-width: 0; }
  .brand { grid-area: brand; padding: .75rem .9rem; border-bottom: 0; }
  .brand__mark { font-size: 1.3rem; }
  .brand__sub, .brand__note { display: none; }
  .railnav {
    grid-area: nav;
    min-height: 44px;
    align-self: stretch;
    padding: .65rem .8rem;
    border-left: 1px solid var(--rule-soft);
    border-bottom: 0;
  }
  .railnav__hint { display: none; }
  .issues {
    grid-area: issues;
    display: flex;
    max-height: none;
    min-width: 0;
    padding: 0;
    overflow-x: auto;
    overflow-y: hidden;
    border-top: 1px solid var(--rule-soft);
    scrollbar-width: thin;
  }
  .issue {
    flex: 0 0 min(72vw, 17rem);
    min-height: 48px;
    padding: .55rem .8rem;
    border-left: 0;
    border-bottom: 3px solid transparent;
  }
  .issue[aria-current="true"] { border-bottom-color: var(--accent); }
  .issue__head { display: none; }
  .mobile-actions {
    grid-area: actions;
    display: flex !important;
    align-items: center;
    gap: .3rem;
    margin: .4rem .5rem;
    z-index: 22;
  }
  .mobile-act {
    flex: 1;
    min-width: 0;
    min-height: 44px;                 /* 拇指目标，iOS HIG 下限 */
    padding: .45rem .35rem;
    color: var(--ink-soft);
    background: var(--surface);
    border: 1px solid var(--rule);
    border-radius: 0;
    cursor: pointer;
    white-space: nowrap;
    font: var(--fs-xs)/1.2 var(--sans);
  }
  .mobile-act:hover { color: var(--accent); border-color: var(--accent); }
  .mobile-act[disabled] { opacity: .45; cursor: default; }
  .rail__foot { display: none; }
  /* Simulator / 滑读是专注入口：设备框内不重复显示归档控制台。 */
  .app--taste .rail { display: none; }
  .read {
    width: 100%;
    max-width: 100vw;
    min-width: 0;
    height: auto;
    overflow: visible;
    touch-action: pan-y;
  }
  .read__inner { padding: 1.75rem 1.25rem 4rem; }
  .read__inner.read__inner--taste { min-height: 100dvh; padding-block: 0; }
}

@media (max-width: 440px) {
  .railnav__ico { display: none; }
  .railnav { justify-content: center; }
  .issue { flex-basis: 74vw; }
  .read__inner { padding-inline: .75rem; }
  .paper-gallery { padding: .75rem; }
  .paper-gallery__slide { flex-basis: 94%; }
  .paper-gallery__image { height: clamp(13rem, 62vw, 22rem); padding: .4rem; }
  .paper-gallery figcaption { padding: .75rem; }
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* ─────────────── 侧栏「源管理」入口 ─────────────── */
.railnav {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  width: 100%;
  text-align: left;
  padding: .7rem 1.25rem;
  background: none;
  border: 0;
  border-bottom: 1px solid var(--rule-soft);
  cursor: pointer;
  font-family: inherit;
  color: var(--ink-soft);
  font-size: var(--fs-sm);
}
.railnav:hover { background: var(--sunk); color: var(--ink); }
.railnav[aria-current="true"] { background: var(--accent-dim); color: var(--accent); }
.mobile-actions { display: none; }      /* 桌面用 .rail__foot 里的完整按钮组 */
.railnav__ico { color: var(--accent); font-size: .85em; }
.railnav__txt { font-weight: 600; }
.railnav__hint {
  margin-left: auto;
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--muted);
}

/* ─────────────── 源管理页 ─────────────── */
.sources { display: grid; gap: .625rem; margin: 1.125rem 0 1.5rem; }
.srcrow {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1.1rem;
  padding: 1.1rem 1.15rem;
  border: 1px solid var(--rule);
  border-radius: 10px;
  background: var(--surface);
  box-shadow: var(--shadow);
}
.srcrow--off { opacity: .58; }
.srcrow__icon { display: flex; align-items: flex-start; padding-top: .1rem; }
/* 源管理页是唯一按「来源」而不是按「内容」组织的页面，图标就是这一页的主索引，
   放到 3.2em——扫一眼就能定位到某个源，不必读 id。卡片墙那边仍是 1em 的小徽章。 */
.srcrow__icon .src-badge {
  width: 3.2em;
  height: 3.2em;
  margin: 0;
  border-radius: 8px;
  padding: .45rem;
  background: var(--sunk);
  border: 1px solid var(--rule);
}
.srcrow--off .srcrow__icon .src-badge { filter: grayscale(1); }
.srcrow__head { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; }
.srcrow__id { font-family: var(--mono); font-weight: 600; color: var(--ink); }
.srcrow__label { color: var(--ink-soft); font-size: var(--fs-sm); }
.srcrow__state {
  margin-left: auto;
  font-family: var(--mono);
  font-size: var(--fs-micro);
  letter-spacing: .05em;
  padding: .1rem .5rem;
  border-radius: 999px;
}
.srcrow__state.is-on { color: var(--data); background: rgba(43, 90, 140, .12); }
.srcrow__state.is-off { color: var(--muted); background: var(--sunk); }
.srcrow__meta { margin-top: .4rem; font-size: var(--fs-xs); color: var(--muted); }
.srcrow__meta code, .srcrow__id { font-family: var(--mono); }
.srcrow__chips { margin-top: .5rem; display: flex; flex-wrap: wrap; gap: .35rem; }
.srcrow__err { margin-top: .5rem; font-size: var(--fs-xs); color: var(--accent); }

.chip {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  padding: .12rem .5rem;
  border-radius: 999px;
  background: var(--sunk);
  color: var(--ink-soft);
}
.chip--none { background: none; border: 1px dashed var(--rule); color: var(--muted); }
.chip--preset { background: var(--accent-dim); color: var(--accent); }
.src-badge--none { color: var(--muted); }

.presetbox { margin: 1.5rem 0; padding-top: 1.125rem; border-top: 1px solid var(--rule-soft); }
.presetbox__h {
  font-size: var(--fs-sm);
  font-weight: 600;
  color: var(--muted);
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: .75rem;
}
.presetrow { display: flex; align-items: baseline; gap: .75rem; padding: .35rem 0; }
.presetrow__ids { font-family: var(--mono); font-size: var(--fs-xs); color: var(--ink-soft); }

/* ─────────────── 流水线观测页 ───────────────
   把 editorial / loops / quality 三份收据拼成一条可读的流水线：漏斗数字之间用箭头连，
   候选表格按结果分组着色，点一行展开该条的完整追溯。全部只读，不提供任何「重新算」的入口。 */
.funnel {
  margin: 1.25rem 0 1.75rem;
  padding: 1.1rem 1.15rem;
  border: 1px solid var(--rule);
  border-radius: 10px;
  background: var(--surface);
  box-shadow: var(--shadow);
}
.funnel__strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
}
.funnel__stage {
  display: grid;
  gap: .2rem;
  padding: .6rem .8rem;
  border: 1px solid var(--rule-soft);
  border-radius: 8px;
  background: var(--sunk);
  min-width: 5.5rem;
}
.funnel__label {
  font-size: var(--fs-micro);
  color: var(--muted);
  letter-spacing: .04em;
  white-space: nowrap;
}
.funnel__value {
  font-family: var(--mono);
  font-size: var(--fs-lg);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.funnel__value--delta { color: var(--accent); }
.funnel__arrow { color: var(--muted); font-size: var(--fs-sm); padding: 0 .1rem; }
.funnel-sources {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1rem;
  margin-top: .9rem;
  padding-top: .8rem;
  border-top: 1px dashed var(--rule);
}
.funnel-src {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-size: var(--fs-xs);
  color: var(--ink-soft);
}
.funnel-src__id { font-family: var(--mono); }
.funnel-src__count { font-variant-numeric: tabular-nums; color: var(--muted); }
.funnel-src__health { color: var(--muted); }
.funnel-src--bad .funnel-src__health { color: var(--accent); }

.pipeline-candidates { margin: 1.5rem 0; }
.pipeline-candidates__h {
  font-size: var(--fs-sm);
  font-weight: 600;
  color: var(--muted);
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: .6rem;
}
/* 退化说明：跟 .taste__quality 同一个原则——克制而不隐藏，不是错误横幅，用次要色 + 小字 */
.pipeline-degrade {
  font: var(--fs-xs)/1.6 var(--mono);
  color: var(--muted);
  background: var(--sunk);
  border: 1px dashed var(--rule);
  border-radius: 6px;
  padding: .65rem .8rem;
  margin-bottom: .9rem;
}
.pipeline-degrade code { background: none; padding: 0; }

.pipeline-table-wrap { overflow-x: auto; border: 1px solid var(--rule); border-radius: 8px; }
.pipeline-table { width: 100%; border-collapse: collapse; font-size: var(--fs-xs); }
.pipeline-table th, .pipeline-table td {
  padding: .5rem .65rem;
  border-bottom: 1px solid var(--rule-soft);
  text-align: left;
  white-space: nowrap;
}
.pipeline-table th {
  font-family: var(--mono);
  font-size: var(--fs-micro);
  color: var(--muted);
  letter-spacing: .04em;
  background: var(--sunk);
}
.pipeline-table td.pipeline-row__title, .pipeline-table td.pipeline-row__why {
  white-space: normal;
  min-width: 12rem;
}
.pipeline-table td.pipeline-row__num {
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.pipeline-row { cursor: pointer; }
.pipeline-row:hover { background: var(--accent-dim); }
.pipeline-row:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.pipeline-row--rank td.pipeline-row__title { font-weight: 600; color: var(--ink); }
.pipeline-row--gated, .pipeline-row--capped, .pipeline-row--prefiltered-out, .pipeline-row--unselected {
  color: var(--muted);
}
.outcometag {
  display: inline-block;
  padding: .05em .5em;
  border-radius: 3px;
  font-family: var(--mono);
  font-size: var(--fs-micro);
  font-weight: 600;
  letter-spacing: .06em;
}
.outcometag--rank {
  color: var(--accent);
  background: var(--accent-dim);
  border: 1px solid color-mix(in srgb, var(--accent) 42%, transparent);
}
.outcometag--gated { color: var(--muted); background: none; border: 1px dashed var(--rule); }
.outcometag--capped {
  color: var(--data);
  background: color-mix(in srgb, var(--data) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--data) 34%, transparent);
}
.outcometag--prefiltered-out, .outcometag--unselected {
  color: var(--muted);
  background: var(--sunk);
  border: 1px solid var(--rule);
}

.pipeline-trace { background: var(--sunk); }
.pipeline-trace__body { padding: .75rem 1rem; display: grid; gap: .45rem; }
.pipeline-trace__line { font-size: var(--fs-xs); color: var(--ink-soft); line-height: 1.6; }
.pipeline-trace__line b { color: var(--ink); margin-right: .4rem; }
.pipeline-trace__empty { color: var(--muted); font-style: italic; }
.pipeline-trace__rejected { color: var(--muted); font-size: var(--fs-micro); }

@media (max-width: 700px) {
  .funnel__strip { gap: .35rem; }
  .funnel__stage { min-width: 4.4rem; padding: .5rem .6rem; }
  .funnel__arrow { display: none; }
}

/* ─────────────── 卡片封面缩略图 ─────────────── */
.card__cover {
  margin: -1.5rem -1.5rem 0;        /* 顶到卡片边（抵消 .card 的 padding），底部靠 flex gap */
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--sunk);
}
.card__cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 详情页封面（比卡片大一号的头图） */
.lead__cover {
  margin: 0 0 1.75rem;
  aspect-ratio: 2 / 1;
  max-height: 340px;
  overflow: hidden;
  border-radius: 8px;
  background: var(--sunk);
  border: 1px solid var(--rule-soft);
}
.lead__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ─────────────── 报纸头版视图（.np-*，作用域独立，不动其他页面/主题变量） ─────────────── */
/* ─────────────── 编辑报纸（十二槽、每版三条、机械式） ─────────────── */
.read__inner:has(.np) { max-width: none; padding: 1.5rem 2rem 4rem; }
.np {
  --np-paper: #F7F6F1;
  --np-ink: #090909;
  --np-soft: #5E5E5A;
  --np-rule: #BDBCB6;
  --np-hair: #D8D7D1;
  --np-spot: #D71920;
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 2rem 2.5rem;
  color: var(--np-ink);
  background: var(--np-paper);
  border: 1px solid var(--np-rule);
  touch-action: pan-y;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .np {
    --np-paper: #0B0B0B; --np-ink: #F1F0EB; --np-soft: #A6A59F;
    --np-rule: #414141; --np-hair: #292929; --np-spot: #FF3B42;
  }
}
:root[data-theme="dark"] .np {
  --np-paper: #0B0B0B; --np-ink: #F1F0EB; --np-soft: #A6A59F;
  --np-rule: #414141; --np-hair: #292929; --np-spot: #FF3B42;
}

.np-control {
  position: sticky;
  top: 0;
  z-index: 8;
  min-height: 44px;
  margin: 0 -2rem;
  padding: .55rem 2rem;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 1rem;
  color: var(--np-soft);
  background: color-mix(in srgb, var(--np-paper) 94%, transparent);
  border-bottom: 1px solid var(--np-rule);
  backdrop-filter: blur(8px);
  font-family: var(--mono);
  font-size: .68rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.np-control > :last-child { text-align: right; }
.np-back, .np-fullscreen {
  justify-self: start;
  min-height: 32px;
  padding: .2rem .55rem;
  color: var(--np-ink);
  background: transparent;
  border: 1px solid var(--np-rule);
  border-radius: 0;
  cursor: pointer;
  font: inherit;
}
.np-back:hover, .np-fullscreen:hover { color: var(--np-spot); border-color: var(--np-spot); }
.np-back kbd, .np-fullscreen kbd { margin-left: .35rem; color: inherit; background: transparent; border-color: currentColor; }
.np-fullscreen[aria-pressed="true"] { color: var(--np-paper); background: var(--np-ink); border-color: var(--np-ink); }
.np-control__actions { justify-self: end; display: flex; align-items: center; gap: .7rem; }

/* #read remains the native fullscreen target across hash-driven spread renders. */
#read:fullscreen, #read.read--immersive {
  width: 100%;
  height: 100dvh;
  overflow-x: hidden;
  overflow-y: auto;
  color: var(--ink);
  background: var(--paper);
  overscroll-behavior: contain;
}
#read:fullscreen .read__inner, #read.read--immersive .read__inner { min-height: 100dvh; }
.is-paper-immersive body { overflow: hidden; }
.is-paper-immersive .app { display: block; height: 100dvh; }
.is-paper-immersive .rail { display: none; }
.is-paper-immersive #read { touch-action: pan-y pinch-zoom; }

/* Current sheet turns over an inert eager-loaded adjacent sheet. */
.np-stage {
  position: relative;
  isolation: isolate;
  perspective: 1800px;
  perspective-origin: 50% 22%;
  overflow: clip;
  touch-action: pan-y pinch-zoom;
  cursor: grab;
}
.np-stage[data-phase="dragging"] { cursor: grabbing; user-select: none; }
.np-stage:is([data-phase="staging"], [data-phase="settling"]) { pointer-events: none; }
.np-sheet-wrap {
  width: 100%;
  transform-style: preserve-3d;
  backface-visibility: hidden;
}
.np-sheet-wrap--current {
  position: relative;
  z-index: 2;
  transform-origin: center center;
  transform: translate3d(var(--np-turn-shift, 0), var(--np-turn-y, 0), 0) rotateY(var(--np-turn-angle, 0deg));
  will-change: transform;
}
.np-sheet-wrap--current::before,
.np-sheet-wrap--current::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.np-sheet-wrap--current::before { opacity: 0; }
.np-sheet-wrap--current::after {
  opacity: var(--np-turn-shadow, 0);
  background: linear-gradient(90deg, transparent 35%, rgba(0, 0, 0, .44));
}
.np-stage[data-preview="previous"] .np-sheet-wrap--current { transform-origin: right center; }
.np-stage[data-preview="next"] .np-sheet-wrap--current { transform-origin: left center; }
.np-stage[data-preview="edge"] .np-sheet-wrap--current { transform-origin: center center; }
.np-stage[data-phase="settling"] .np-sheet-wrap--current {
  transition: transform var(--np-turn-duration, 280ms) cubic-bezier(.2, .72, .18, 1),
              opacity var(--np-turn-duration, 280ms) ease;
}
.np-sheet-wrap--preview {
  position: absolute;
  inset: 0;
  z-index: 1;
  opacity: 0;
  pointer-events: none;
  user-select: none;
}
.np-immersive-hint { display: none; }
.is-paper-immersive .np-immersive-hint, #read:fullscreen .np-immersive-hint {
  display: block; margin: .45rem 0 0; color: var(--np-soft); font: .65rem/1.2 var(--mono);
  letter-spacing: .08em; text-align: center; text-transform: uppercase;
}
.np-stage[data-phase="scrolling"] .np-sheet-wrap--preview { opacity: .34; }
.np-stage[data-preview="previous"] .np-sheet-wrap--previous,
.np-stage[data-preview="next"] .np-sheet-wrap--next { opacity: 1; }

.np-sheet { min-height: calc(100dvh - 8rem); }

.np-mast { padding: 2.25rem 0 1rem; border-bottom: 4px solid var(--np-ink); }
.np-mast__eyebrow {
  font-family: var(--mono);
  font-size: .68rem;
  letter-spacing: .22em;
  color: var(--np-spot);
}
.np-mast__name {
  margin: .35rem 0 .75rem;
  font-family: var(--sans);
  font-size: clamp(3.4rem, 10vw, 7rem);
  font-weight: 800;
  line-height: .82;
  letter-spacing: -.09em;
}
.np-mast__name span { margin-left: .13em; color: var(--np-spot); font-size: .16em; vertical-align: top; }
.np-mast--inside { padding-top: 1.35rem; border-bottom-width: 2px; }
.np-mast--inside .np-mast__eyebrow { color: var(--np-soft); }
.np-mast--inside .np-mast__name { margin-block: .25rem .55rem; font-size: clamp(2.6rem, 7vw, 4.6rem); }
.np-folio {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 1rem;
  padding-top: .7rem;
  border-top: 1px solid var(--np-rule);
  color: var(--np-soft);
  font-family: var(--mono);
  font-size: .66rem;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.np-folio > :last-child { text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.np .srcfail {
  margin: 1rem 0 0;
  padding: .65rem .8rem;
  color: var(--np-ink);
  background: transparent;
  border: 1px solid var(--np-spot);
  font-family: var(--mono);
  font-size: .72rem;
}

.np-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  border-bottom: 1px solid var(--np-ink);
}
.np-story {
  grid-column: span 6;
  border-top: 1px solid var(--np-ink);
}
.np-story:nth-child(3):not(.np-story--lead), .np-vacant { border-left: 1px solid var(--np-ink); }
.np-story--lead { grid-column: 1 / -1; border-top: 0; border-bottom: 3px solid var(--np-ink); }

.np-vacant {
  display: grid;
  grid-column: span 6;
  place-items: center;
  min-height: 8rem;
  padding: 1.4rem;
  border-top: 1px solid var(--np-ink);
  color: var(--np-soft);
}
.np-vacant::after {
  content: "A7H · END";
  font: 700 .66rem/1 var(--mono);
  letter-spacing: .18em;
  text-transform: uppercase;
}

.np-story__hit {
  width: 100%;
  height: 100%;
  min-height: 44px;
  padding: 1.4rem;
  text-align: left;
  color: inherit;
  background: transparent;
  border: 0;
  border-radius: 0;
  cursor: pointer;
  font: inherit;
}
.np-story__hit:hover { background: color-mix(in srgb, var(--np-ink) 3%, transparent); }
.np-story__hit:hover .np-story__h, .np-story__hit:hover .np-story__foot { color: var(--np-spot); }

.np-story__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  min-height: 1.5rem;
  margin-bottom: .75rem;
}
.np-slot, .np-kicker {
  font-family: var(--mono);
  font-size: .66rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.np-slot { color: var(--np-soft); }
.np-kicker {
  display: inline-block;
  margin-bottom: .65rem;
  padding-bottom: .2rem;
  color: var(--np-spot);
  border-bottom: 2px solid currentColor;
}
.np-decision {
  padding: .15rem .45rem;
  color: var(--np-paper);
  background: var(--np-ink);
  border: 1px solid var(--np-ink);
  font-family: var(--mono);
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .12em;
}
.np-decision--observe, .np-decision--watch, .np-decision--revisit {
  color: var(--np-ink);
  background: transparent;
}
.np-decision--reject, .np-decision--skip { color: var(--np-spot); background: transparent; border-color: var(--np-spot); }

.np-photo { overflow: hidden; background: var(--np-hair); border: 1px solid var(--np-rule); }
.np-photo img { display: block; width: 100%; height: 100%; object-fit: cover; filter: saturate(1.1) contrast(1.04); }
.np-photo--lead { float: right; width: 48%; aspect-ratio: 16 / 10; margin: 0 0 1rem 1.6rem; }
.np-photo--story { width: 100%; aspect-ratio: 16 / 9; margin-bottom: .9rem; }

.np-story__h {
  max-width: 22ch;
  margin: 0 0 .7rem;
  font-family: var(--serif);
  font-size: clamp(1.5rem, 2.8vw, 2.25rem);
  font-weight: 800;
  line-height: 1.12;
  text-wrap: balance;
}
.np-story--lead .np-story__h { max-width: 18ch; font-size: clamp(2.4rem, 5.8vw, 4.8rem); line-height: 1.02; }
.np-story__t {
  color: var(--np-soft);
  font-family: var(--serif);
  font-size: 1rem;
  line-height: 1.68;
  text-wrap: pretty;
}
.np-story--lead .np-story__t { color: var(--np-ink); font-size: 1.12rem; }
.np-story--lead .np-story__t::first-letter {
  float: left;
  padding: .08em .12em 0 0;
  color: var(--np-spot);
  font-family: var(--serif);
  font-size: 3.25em;
  font-weight: 800;
  line-height: .72;
}

.np-story__source {
  clear: both;
  display: flex;
  justify-content: space-between;
  gap: .8rem;
  margin-top: .9rem;
  padding-top: .55rem;
  color: var(--np-soft);
  border-top: 1px solid var(--np-hair);
  font: .66rem/1.4 var(--mono);
}
.np-story__source span { color: var(--np-ink); font-weight: 700; text-transform: uppercase; }
.np-story__source code { overflow-wrap: anywhere; text-align: right; }
.np-story__mine { margin-top: .65rem; padding-left: .65rem; color: var(--np-soft); border-left: 2px solid var(--np-spot); font-size: .75rem; line-height: 1.5; }
.np-story__mine b { margin-right: .45rem; color: var(--np-spot); font: 700 .64rem/1 var(--mono); letter-spacing: .12em; }
.np-story__foot {
  display: flex;
  justify-content: space-between;
  margin-top: .75rem;
  padding-top: .6rem;
  color: var(--np-ink);
  border-top: 2px solid var(--np-ink);
  font: 700 .68rem/1.2 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.np-story__foot i { font-style: normal; font-size: 1rem; }

.np-page-nav {
  display: grid;
  grid-template-columns: minmax(7rem, 1fr) auto minmax(7rem, 1fr);
  align-items: center;
  gap: 1rem;
  margin-top: 1.5rem;
  padding: 1rem 0;
  border-block: 1px solid var(--np-ink);
}
.np-page-nav > button, .np-page-numbers button, .np-control__pager button {
  min-height: 44px;
  padding: .45rem .7rem;
  color: var(--np-ink);
  background: transparent;
  border: 1px solid var(--np-rule);
  border-radius: 0;
  cursor: pointer;
  font: 700 .68rem/1.2 var(--mono);
  letter-spacing: .06em;
  text-transform: uppercase;
}
.np-page-nav > button:last-child { text-align: right; }
.np-page-nav button:hover:not(:disabled), .np-control__pager button:hover:not(:disabled),
.np-page-numbers button[aria-current="page"] {
  color: var(--np-paper);
  background: var(--np-ink);
  border-color: var(--np-ink);
}
.np-page-nav button:disabled, .np-control__pager button:disabled { opacity: .3; cursor: default; }
.np-page-numbers { display: flex; gap: .35rem; }
.np-page-numbers button { min-width: 44px; padding-inline: .35rem; }
.np-control__pager { justify-self: end; display: flex; align-items: center; gap: .45rem; }
.np-control__pager button { min-width: 34px; min-height: 32px; padding: .15rem .4rem; }

:is(.np-story__hit, [data-paper-page]):focus-visible {
  outline: 3px solid var(--np-spot);
  outline-offset: 2px;
}

.np-foot {
  padding: 1rem 0 0;
  color: var(--np-soft);
  font-family: var(--mono);
  font-size: .65rem;
  letter-spacing: .04em;
  text-align: center;
}

@media (min-width: 901px) {
  .is-paper-immersive .read__inner:has(.np), #read:fullscreen .read__inner:has(.np) {
    width: 100%; height: 100dvh; min-height: 0; padding: 0;
  }
  .is-paper-immersive .np, #read:fullscreen .np {
    height: 100%; padding-bottom: .5rem; display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto; overflow: hidden;
  }
  .is-paper-immersive .np-control, #read:fullscreen .np-control { position: relative; }
  .is-paper-immersive .np-stage, #read:fullscreen .np-stage {
    width: 100%; height: 100%; min-height: 0;
    perspective: var(--np-turn-perspective, 1500px);
    perspective-origin: 50% 48%;
  }
  .is-paper-immersive .np-stage[data-phase="settling"],
  #read:fullscreen .np-stage[data-phase="settling"] {
    transition: perspective var(--np-turn-duration, 680ms) cubic-bezier(.18, .68, .16, 1);
  }
  .is-paper-immersive .np-stage[data-fitted="true"] .np-sheet-wrap,
  #read:fullscreen .np-stage[data-fitted="true"] .np-sheet-wrap {
    position: absolute; inset: auto;
    left: calc(50% - var(--np-fit-width) / 2);
    top: calc(50% - var(--np-fit-height) / 2);
    width: var(--np-fit-width); height: var(--np-fit-height);
  }
  .is-paper-immersive .np-sheet-wrap--current,
  #read:fullscreen .np-sheet-wrap--current {
    background: var(--np-paper);
    backface-visibility: visible;
    transform: translate3d(var(--np-turn-shift, 0), 0, var(--np-turn-lift, 0))
      rotateY(var(--np-turn-angle, 0deg))
      skewY(var(--np-turn-skew, 0deg))
      scale(var(--np-turn-scale, 1));
    box-shadow: var(--np-turn-cast-x, 0) 8px
      52px rgba(20, 16, 10, var(--np-turn-shadow, 0));
  }
  .is-paper-immersive .np-sheet-wrap--current > .np-sheet,
  #read:fullscreen .np-sheet-wrap--current > .np-sheet {
    backface-visibility: hidden;
  }
  .is-paper-immersive .np-stage[data-preview="next"] .np-sheet-wrap--current,
  #read:fullscreen .np-stage[data-preview="next"] .np-sheet-wrap--current {
    --np-turn-cast-x: 28px;
  }
  .is-paper-immersive .np-stage[data-preview="previous"] .np-sheet-wrap--current,
  #read:fullscreen .np-stage[data-preview="previous"] .np-sheet-wrap--current {
    --np-turn-cast-x: -28px;
  }
  .is-paper-immersive .np-stage[data-phase="settling"] .np-sheet-wrap--current,
  #read:fullscreen .np-stage[data-phase="settling"] .np-sheet-wrap--current {
    transition: transform var(--np-turn-duration, 680ms) cubic-bezier(.18, .68, .16, 1),
                box-shadow var(--np-turn-duration, 680ms) cubic-bezier(.2, .58, .18, 1);
  }
  .is-paper-immersive .np-sheet-wrap--current::before,
  #read:fullscreen .np-sheet-wrap--current::before {
    z-index: 3;
    width: clamp(24px, 7vw, 96px);
    opacity: var(--np-turn-fold, 0);
    background: linear-gradient(90deg,
      rgba(255, 253, 242, 0), rgba(255, 253, 242, .78) 48%, rgba(66, 49, 29, .2) 72%, transparent);
    mix-blend-mode: soft-light;
  }
  .is-paper-immersive .np-stage[data-preview="next"] .np-sheet-wrap--current::before,
  #read:fullscreen .np-stage[data-preview="next"] .np-sheet-wrap--current::before {
    right: auto;
    transform-origin: left center;
    transform: translateX(14px) scaleX(var(--np-turn-fold, 0));
  }
  .is-paper-immersive .np-stage[data-preview="previous"] .np-sheet-wrap--current::before,
  #read:fullscreen .np-stage[data-preview="previous"] .np-sheet-wrap--current::before {
    left: auto;
    transform-origin: right center;
    transform: translateX(-14px) scaleX(var(--np-turn-fold, 0));
  }
  .is-paper-immersive .np-stage[data-preview="next"] .np-sheet-wrap--current::after,
  #read:fullscreen .np-stage[data-preview="next"] .np-sheet-wrap--current::after {
    background: linear-gradient(90deg,
      rgba(35, 27, 17, .86), transparent 24%,
      rgba(255, 252, 236, .12) 78%, rgba(28, 22, 15, .48));
  }
  .is-paper-immersive .np-stage[data-preview="previous"] .np-sheet-wrap--current::after,
  #read:fullscreen .np-stage[data-preview="previous"] .np-sheet-wrap--current::after {
    background: linear-gradient(270deg,
      rgba(35, 27, 17, .86), transparent 24%,
      rgba(255, 252, 236, .12) 78%, rgba(28, 22, 15, .48));
  }
  .is-paper-immersive .np-stage[data-phase="settling"] .np-sheet-wrap--current::before,
  .is-paper-immersive .np-stage[data-phase="settling"] .np-sheet-wrap--current::after,
  #read:fullscreen .np-stage[data-phase="settling"] .np-sheet-wrap--current::before,
  #read:fullscreen .np-stage[data-phase="settling"] .np-sheet-wrap--current::after {
    transition: opacity var(--np-turn-duration, 680ms) cubic-bezier(.18, .68, .16, 1),
                transform var(--np-turn-duration, 680ms) cubic-bezier(.18, .68, .16, 1),
                background var(--np-turn-duration, 680ms) ease;
  }
  .is-paper-immersive .np-stage[data-fitted="true"] .np-sheet,
  #read:fullscreen .np-stage[data-fitted="true"] .np-sheet {
    width: var(--np-natural-width); height: var(--np-natural-height); min-height: 0;
    transform: scale(var(--np-fit-scale)); transform-origin: top left;
  }
  .is-paper-immersive .np-foot, #read:fullscreen .np-foot { padding-top: .35rem; }
}

/* 平台图标保留形状识别，不引入第二种饱和 UI 色。 */
.src-badge svg { filter: grayscale(1); }

@media (max-width: 1179px) {
  .np { padding-inline: 1.5rem; }
  .np-control { margin-inline: -1.5rem; padding-inline: 1.5rem; }
  .np-photo--lead { width: 43%; }
}

@media (max-width: 900px) {
  .np-control { top: 107px; z-index: 18; }
  .is-paper-immersive .np-control, #read:fullscreen .np-control { top: 0; }
}

@media (max-width: 719px) {
  .read__inner:has(.np) { padding: 0; }
  .np { width: 100%; padding-inline: 1rem; border-inline: 0; }
  .np-control {
    margin-inline: -1rem;
    padding-inline: 1rem;
    grid-template-columns: 1fr auto;
  }
  .np-control__actions { gap: .4rem; }
  .np-fullscreen { min-height: 44px; padding-inline: .55rem; }
  .np-fullscreen kbd { display: none; }
  .np-control > :nth-child(2) { display: none; }
  .np-mast { padding-top: 1.5rem; }
  .np-folio { grid-template-columns: 1fr auto; }
  .np-folio > :last-child { display: none; }
  .np-story, .np-story--lead, .np-vacant { grid-column: 1 / -1; border-left: 0 !important; }
  .np-story:not(:last-child) { border-bottom: 1px solid var(--np-ink); }
  .np-story__hit { padding: 1.25rem 0; }
  .np-photo--lead { float: none; width: 100%; margin: 0 0 .9rem; }
  .np-story--lead .np-story__h { font-size: clamp(2.1rem, 11vw, 3.25rem); }
  .np-story__h { font-size: 1.65rem; }
  .np-page-nav { grid-template-columns: 1fr 1fr; }
  .np-page-numbers { grid-column: 1 / -1; grid-row: 1; justify-content: center; }
  .np-page-nav > button:first-child { grid-column: 1; grid-row: 2; }
  .np-page-nav > button:last-child { grid-column: 2; grid-row: 2; }
}

@media (prefers-reduced-motion: reduce) {
  .np-sheet-wrap--current {
    transition-duration: .01ms !important;
    transform: none !important;
  }
  .np-sheet-wrap--current::after { display: none; }
}

@media print {
  .rail, .np-control { display: none !important; }
  .read__inner { max-width: none !important; padding: 0 !important; }
  .np { max-width: none; border: 0; --np-paper: #fff; --np-ink: #000; --np-soft: #444; }
  .np-sheet { break-inside: avoid; }
}

/* ─────────────── 源健康度看板（#/sources） ─────────────── */
.srchealth { display: grid; gap: .45rem; margin-top: .6rem; padding-top: .6rem; border-top: 1px dashed var(--rule); }
.srchealth--none { color: var(--muted); font: var(--fs-xs)/1.5 var(--mono); border-top: 1px dashed var(--rule); }
.srchealth__bar { display: flex; gap: 3px; }
.srchealth__bar i { width: 10px; height: 20px; border-radius: 2px; background: var(--rule); }
.srchealth__bar i.is-ok { background: var(--data); }
.srchealth__bar i.is-empty { background: var(--rule); }
.srchealth__bar i.is-bad { background: var(--accent); }
.srchealth__nums { font: var(--fs-xs)/1.5 var(--mono); color: var(--muted); }
.srchealth__nums b { color: var(--ink); font-weight: 500; }
.srchealth--warn .srchealth__nums b:first-child { color: #b26a00; }
.srchealth--bad .srchealth__nums b:first-child { color: var(--accent); }
.srchealth__sig { display: flex; flex-wrap: wrap; gap: .3rem; }
.chip--sig { font-family: var(--mono); font-size: var(--fs-micro); }
.srchealth__err {
  font: var(--fs-xs)/1.5 var(--mono);
  color: var(--accent);
  background: var(--sunk);
  padding: .4rem .55rem;
  border-left: 2px solid var(--accent);
  word-break: break-all;
}
.mast__no .is-bad { color: var(--accent); }

.srcrow__url {
  margin-top: .2rem;
  font: var(--fs-xs)/1.5 var(--mono);
  word-break: break-all;
}
.srcrow__url a { color: var(--data); text-decoration: none; border-bottom: 1px solid transparent; }
.srcrow__url a:hover { border-bottom-color: currentColor; }
.srcrow__url span { color: var(--muted); }
.srcrow__url::before { content: "↗ "; color: var(--muted); }