/* =========================================================================
   assets/base.css — Graveyard Keeper 2 Guide
   GENERATED by tools/build-css.py — edit the design tokens
   (02-design/20260919-graveyard-keeper-2/tokens_GK2.css), the approved
   preview stylesheet, or tools/gk2-extras.css, then re-run that script.
   ========================================================================= */

/* =========================================================================
   tokens_GK2.css — Graveyard Keeper 2 站点设计令牌
   单一主主题：暗色「烛火与坟场夜色」（ember-over-graveyard night）

   色值来源（全部为本次实测，方法见 tools/sample-colors.py 与
   tools/sample-colors-output.txt；采样对象 = 官方 Steam 头图 + 4 张官方
   Steam 截图 + 官方站 og 主视觉 + 官方 logo，共 8 个官方一手素材）。
   官方站 graveyardkeeper2.com 为 Wix 模板站，其 --color_* 变量是 Wix 默认
   调色板（--color_18:26,106,255 等），不含本作品牌色，因此品牌色只能取
   自关键视觉像素采样，不取自官方站样式表。

   注意：--line-* 与 --brand-ink 是边框 / 反白文字专用，不参与正文配对；
   --line-faint 实测对比度不足 4.5:1，禁止承载任何文字。
   ========================================================================= */

:root {
  /* ---------- 表面（surface 系，全部实测） ---------- */
  --surface-page: #080808;        /* 实测：官方 logo 底 51.74%；全素材合并第 1（5.14%） */
  --surface-sunken: #080818;      /* 实测：Steam ss3 6.46%（更深的分隔/表头下沉底） */
  --surface-raised: #181828;      /* 实测：Steam ss3 21.00% */
  --surface-card: #281838;        /* 实测：官方主视觉 4.89% */
  --surface-card-hi: #381848;     /* 实测：官方主视觉 15.76%；全素材合并第 2（3.99%） */
  --surface-ember: #482828;       /* 实测：Steam ss4 3.88%（余烬暖调卡片） */

  /* ---------- 文字（ink 系） ---------- */
  --ink-primary: #EFEAF3;         /* 由实测亮灰紫 #9898A8 提亮，正文 ≥4.5:1 所需 */
  --ink-secondary: #C9C2D2;       /* 同上，次级正文 */
  --ink-muted: #9898A8;           /* 实测：官方 logo 2.14%（元信息、脚注） */

  /* ---------- 品牌与强调 ---------- */
  --brand: #D86858;               /* 实测：官方主视觉 4.62%（落日余烬珊瑚，主行动色） */
  --brand-text: #F09A8C;          /* --brand 的文字变体：小字/链接文字专用 */
  --accent: #D88828;              /* 实测：官方 logo 0.88%（烛火琥珀，官方 logo 主色） */
  --accent-text: #E8A838;         /* --accent 的文字变体 */
  --brand-deep: #B81818;          /* 实测：官方 logo 2.61%（血红，仅装饰块/填充，不做文字） */
  --brand-warm: #682858;          /* 实测：Steam 官方头图 4.00%（地平线渐变的中间色，仅渐变用） */
  --brand-ink: #160A08;           /* 反白文字：写在 --brand / --accent 填充上的字色 */

  /* ---------- 时效语义（本批核心：发行窗口的状态迁移） ---------- */
  --state-live: #A9C46B;          /* 现在可玩/在售：由实测橄榄绿 #886828 / #986838 提亮 */
  --state-ended: #C9A05C;         /* 已结束（曾存在，现已过期）：由实测锈黄 #785828 / #885828 提亮 */
  --state-removed: #F08A8A;       /* 已下架/已移除：由实测血红 #B81818 / #780808 提亮 */
  --state-unannounced: #A8A4C8;   /* 未公布（官方从未给出）：由实测灰紫 #9898A8 冷移 */

  /* ---------- 线与边框（不承载文字） ---------- */
  --line-faint: #282838;          /* 由实测 #282828 加紫偏移；仅发丝线，不得写文字 */
  --line-mid: #383858;            /* 实测：官方 logo 0.41% */
  --border-strong: #8A84A8;       /* 由实测 #686888 提亮，控件边界 ≥3:1 */

  /* ---------- 字体 ---------- */
  /* 展示字体只有 latin 子集；CJK 回退显式声明，避免各平台落到不同字面。
     多语言阶段若要换 CJK 展示字体，在此替换并重跑预览。 */
  --font-display: "Grenze Gotisch", "Songti SC", "Noto Serif SC", "Source Han Serif SC", Georgia, serif;
  --font-body: "Inter", -apple-system, "Helvetica Neue", "PingFang SC", "Noto Sans SC", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* 展示标题（首屏大字）不受文章字号限制 */
  --fs-display: clamp(2.5rem, 5.6vw, 4.25rem);
  --fs-h1: clamp(1.85rem, 4vw, 2.6rem);
  --fs-h2: 1.45rem;
  --fs-h3: 1.125rem;
  --fs-body: 1.0625rem;   /* 17px */
  --fs-small: 0.9375rem;  /* 15px */
  --fs-data: 0.875rem;    /* 14px，等宽数据 */
  --lh-display: 0.98;
  --lh-body: 1.68;
  --ls-display: 0.005em;
  --ls-label: 0.09em;     /* 等宽标签字距 */

  /* ---------- 间距 / 圆角 / 宽度 ---------- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;
  --sp-9: 80px;
  --r-sm: 2px;            /* 像素风：圆角保持极小 */
  --r-md: 4px;
  --r-lg: 8px;
  --w-content: 72rem;
  --w-wide: 80rem;

  /* ---------- 动效 ---------- */
  --t-fast: 120ms;
  --t-base: 200ms;
  --ease: cubic-bezier(0.2, 0.7, 0.3, 1);

  /* ---------- 纹理（像素抖动，纯装饰） ---------- */
  --dither: repeating-conic-gradient(
    from 0deg at 50% 50%,
    rgba(239, 234, 243, 0.035) 0deg 90deg,
    transparent 90deg 180deg
  );
  --dither-size: 4px 4px;
}

/* 反白用法：--brand-ink 只写在 --brand / --accent 填充块上 */
.brand-fill {
  background: var(--brand);
  color: var(--brand-ink);
}
.accent-fill {
  background: var(--accent);
  color: var(--brand-ink);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --t-fast: 0ms;
    --t-base: 0ms;
  }
}

/* =========================================================================
   gk2.css — Graveyard Keeper 2 设计预览样式（消费 preview/assets/tokens_GK2.css）
   仅用于设计预览；生产实现按 视觉系统_GK2.md 复用同一套令牌与组件规格。
   ========================================================================= */
/* tokens inlined above */

/* ---------- 字体 ---------- */
@font-face {
  font-family: "Grenze Gotisch";
  src: url("./fonts/GrenzeGotisch-var.latin.woff2") format("woff2");
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("./fonts/Inter-var.latin.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("./fonts/IBMPlexMono-400.latin.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("./fonts/IBMPlexMono-600.latin.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* ---------- 基础 ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 96px; }
body {
  margin: 0;
  background: var(--surface-page);
  color: var(--ink-secondary);
  font: 400 var(--fs-body)/var(--lh-body) var(--font-body);
  font-feature-settings: "kern" 1;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--brand-text); text-underline-offset: 3px; }
a:hover { color: var(--accent-text); }
h1, h2, h3 { color: var(--ink-primary); margin: 0; font-weight: 700; }
p { margin: 0 0 var(--sp-4); }
ul { margin: 0 0 var(--sp-4); padding-left: 1.15em; }
li { margin-bottom: var(--sp-2); }
:focus-visible { outline: 2px solid var(--accent-text); outline-offset: 2px; }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.wrap { width: 100%; max-width: var(--w-content); margin: 0 auto; padding: 0 var(--sp-5); }
.wrap--wide { max-width: var(--w-wide); }
.section { padding: var(--sp-9) 0; border-top: 1px solid var(--line-faint); }
.section:first-of-type { border-top: 0; }
.section__head { margin-bottom: var(--sp-6); }

/* 眉标 / 小标题 */
.eyebrow {
  display: flex; align-items: center; gap: var(--sp-3);
  font: 600 var(--fs-data)/1 var(--font-mono);
  letter-spacing: var(--ls-label); text-transform: uppercase;
  color: var(--accent-text); margin-bottom: var(--sp-4);
}
.eyebrow::after { content: ""; flex: 1 1 var(--sp-6); height: 1px; background: var(--line-mid); }

/* 地平线渐变：全站品牌构件（色值取自官方主视觉实测） */
.horizon {
  height: 4px; border: 0; margin: 0;
  background: linear-gradient(90deg,
    var(--surface-card-hi) 0%, var(--brand-warm) 34%, var(--brand) 68%, var(--accent) 100%);
}
.horizon--thin { height: 2px; }

h2.section__title { font: 700 var(--fs-h2)/1.2 var(--font-display); letter-spacing: var(--ls-display); }
.section__lead { color: var(--ink-muted); max-width: 62ch; margin-top: var(--sp-3); }

/* ---------- 顶栏 ---------- */
.masthead {
  position: sticky; top: 0; z-index: 40;
  background: rgba(8, 8, 8, 0.9);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line-faint);
}
.masthead__in {
  display: flex; align-items: center; gap: var(--sp-5);
  min-height: 56px; flex-wrap: wrap;
}
.masthead__brand {
  display: inline-flex; align-items: baseline; gap: var(--sp-3);
  font: 700 1.32rem/1 var(--font-display);
  color: var(--ink-primary); text-decoration: none; letter-spacing: var(--ls-display);
}
.masthead__brand:hover { color: var(--ink-primary); }
.masthead__brand b { color: var(--brand); }
.masthead__tag {
  font: 600 11px/1 var(--font-mono); letter-spacing: var(--ls-label);
  text-transform: uppercase; color: var(--ink-muted);
  border: 1px solid var(--line-mid); border-radius: var(--r-sm); padding: 3px 6px;
}
.masthead__nav { display: flex; gap: var(--sp-5); margin-left: auto; flex-wrap: wrap; }
.masthead__nav a {
  font: 500 var(--fs-small)/1 var(--font-body);
  color: var(--ink-secondary); text-decoration: none;
  padding: var(--sp-2) 0; border-bottom: 2px solid transparent;
}
.masthead__nav a:hover, .masthead__nav a[aria-current="page"] {
  color: var(--ink-primary); border-bottom-color: var(--brand);
}

/* ---------- 首屏：余烬地平线 ---------- */
.hero {
  position: relative; isolation: isolate; overflow: hidden;
  display: flex; align-items: center;
  min-height: min(70vh, 620px);
  padding: var(--sp-8) 0 var(--sp-7);
}
.hero__bg { position: absolute; inset: 0; z-index: -1; }
.hero__bg img {
  width: 100%; height: 100%; object-fit: cover; object-position: 50% 56%;
}
/* 左侧暗幕保证文字对比度；底部渐隐把主视觉融进页底 */
.hero__bg::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(90deg,
      rgba(8, 8, 8, 0.97) 0%, rgba(8, 8, 8, 0.94) 28%, rgba(8, 8, 8, 0.74) 50%,
      rgba(8, 8, 8, 0.34) 76%, rgba(8, 8, 8, 0.20) 100%),
    linear-gradient(180deg,
      rgba(8, 8, 8, 0.78) 0%, rgba(8, 8, 8, 0) 24%,
      rgba(8, 8, 8, 0) 58%, rgba(8, 8, 8, 0.88) 90%, var(--surface-page) 100%);
}
.hero__bg::before {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background-image: var(--dither); background-size: var(--dither-size);
  opacity: 0.4; mix-blend-mode: overlay;
}
.hero__copy { position: relative; max-width: min(44rem, 60%); }
.hero__title {
  font: 900 var(--fs-display)/var(--lh-display) var(--font-display);
  color: var(--ink-primary); letter-spacing: var(--ls-display);
  margin: var(--sp-4) 0 var(--sp-4);
  text-wrap: balance;
}
.hero__title em { font-style: normal; color: var(--brand); }
.hero__claim { font-size: 1.12rem; color: var(--ink-secondary); max-width: 44ch; margin-bottom: var(--sp-5); }
.hero__claim b { color: var(--ink-primary); }
.hero__cta { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-bottom: var(--sp-5); }
.hero__horizon { margin-top: 0; }

.btn {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  min-height: 44px; padding: 0 var(--sp-5);
  font: 600 var(--fs-small)/1 var(--font-body);
  border-radius: var(--r-sm); text-decoration: none;
  border: 1px solid transparent; transition: background var(--t-fast) var(--ease), color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}
.btn--primary { background: var(--brand); color: var(--brand-ink); }
.btn--primary:hover { background: var(--accent); color: var(--brand-ink); }
.btn--ghost { border-color: var(--border-strong); color: var(--ink-primary); }
.btn--ghost:hover { border-color: var(--accent); color: var(--accent-text); }

/* 首屏主图 credits 行（压在暗幕上，保证可读） */
.hero__credit {
  position: relative; margin: var(--sp-5) 0 0;
  font: 400 var(--fs-data)/1.5 var(--font-mono); color: var(--ink-muted);
}

/* ---------- 墓碑铭牌（签名组件 S1） ---------- */
.headstone {
  border: 1px solid var(--line-mid);
  background: linear-gradient(180deg, var(--surface-card) 0%, var(--surface-page) 100%);
  padding: var(--sp-5);
  box-shadow: inset 0 0 0 4px var(--surface-page), inset 0 0 0 5px var(--line-faint);
}
.headstone__top {
  display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3);
  font: 600 var(--fs-data)/1 var(--font-mono); letter-spacing: var(--ls-label);
  text-transform: uppercase; color: var(--accent-text);
  padding-bottom: var(--sp-4); margin-bottom: var(--sp-4);
  border-bottom: 1px solid var(--line-faint); flex-wrap: wrap;
}
.headstone__checked { color: var(--ink-muted); text-transform: none; letter-spacing: 0; }
.headstone__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4) var(--sp-5); }
.headstone__k {
  display: block; font: 600 11px/1 var(--font-mono); letter-spacing: var(--ls-label);
  text-transform: uppercase; color: var(--ink-muted); margin-bottom: var(--sp-2);
}
.headstone__v { display: block; color: var(--ink-primary); font-weight: 600; font-size: var(--fs-small); }
.headstone__v small { display: block; font-weight: 400; color: var(--ink-muted); font-size: var(--fs-data); margin-top: 2px; }

/* ---------- 印章（库组件） ---------- */
.stamp {
  display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;
  font: 500 12px/1 var(--font-mono); letter-spacing: 0.04em;
  padding: 3px 8px; border: 1px solid currentColor; border-radius: var(--r-sm);
}
.stamp--live { color: var(--state-live); }
.stamp--ended { color: var(--state-ended); }
.stamp--removed { color: var(--state-removed); }
.stamp--unannounced { color: var(--state-unannounced); }
.stamp__date { color: var(--ink-muted); }

.vstamp {
  font: 500 11px/1 var(--font-mono); letter-spacing: var(--ls-label);
  text-transform: uppercase; color: var(--ink-muted); margin-bottom: var(--sp-3);
}
.vstamp b { color: var(--accent-text); }

.trigger {
  display: flex; gap: var(--sp-3); align-items: baseline;
  margin: var(--sp-4) 0 0; padding: var(--sp-3) var(--sp-4);
  border-left: 2px solid var(--state-ended);
  background: var(--surface-sunken);
  font-size: var(--fs-data); color: var(--ink-secondary);
}
.trigger__key {
  font: 600 11px/1.6 var(--font-mono); letter-spacing: var(--ls-label);
  text-transform: uppercase; color: var(--state-ended); white-space: nowrap;
}
.coverage {
  font: 400 var(--fs-data)/1.6 var(--font-mono); color: var(--ink-muted);
  border-top: 1px dashed var(--line-mid); padding-top: var(--sp-3); margin-top: var(--sp-4);
}
.redact { display: inline-block; vertical-align: middle; }
.redact__bar { display: block; width: 5.5em; height: 1.05em; background: var(--ink-primary); border-radius: 1px; }

/* ---------- 事实条 ---------- */
.facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-4); }
.fact {
  border: 1px solid var(--line-faint); border-left: 3px solid var(--line-mid);
  background: var(--surface-raised); padding: var(--sp-4);
}
.fact--live { border-left-color: var(--state-live); }
.fact--ended { border-left-color: var(--state-ended); }
.fact--removed { border-left-color: var(--state-removed); }
.fact__k {
  display: block; font: 600 11px/1 var(--font-mono); letter-spacing: var(--ls-label);
  text-transform: uppercase; color: var(--ink-muted); margin-bottom: var(--sp-2);
}
.fact__v { display: block; font: 700 1.5rem/1.1 var(--font-display); color: var(--ink-primary); }
.fact__n { display: block; font-size: var(--fs-data); color: var(--ink-muted); margin-top: var(--sp-2); }

/* ---------- 卡片 / 概览 ---------- */
.cols2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-6); align-items: start; }
.cols2--media { grid-template-columns: minmax(0, 1fr) minmax(0, 1.14fr); }
.card {
  border: 1px solid var(--line-faint); background: var(--surface-raised);
  padding: var(--sp-5);
}
.card--ember { background: var(--surface-ember); }
.card h3 { font: 700 1.28rem/1.25 var(--font-display); margin-bottom: var(--sp-3); }
.card p:last-child { margin-bottom: 0; }
.card__media { border: 1px solid var(--line-mid); margin: 0 0 var(--sp-4); }
.card__cap { font: 400 var(--fs-data)/1.5 var(--font-mono); color: var(--ink-muted); margin-top: var(--sp-2); }

.loop { list-style: none; padding: 0; counter-reset: loop; }
.loop li {
  counter-increment: loop; position: relative; padding-left: var(--sp-7);
  margin-bottom: var(--sp-4); color: var(--ink-secondary);
}
.loop li::before {
  content: counter(loop, decimal-leading-zero);
  position: absolute; left: 0; top: 0;
  font: 600 var(--fs-data)/1.35 var(--font-mono); color: var(--accent-text);
  border: 1px solid var(--line-mid); border-radius: var(--r-sm);
  padding: 2px 5px; background: var(--surface-page);
}
.loop b { color: var(--ink-primary); }

/* ---------- 时效台账（签名组件 S2） ---------- */
.ledger { border: 1px solid var(--line-mid); background: var(--surface-page); }
.ledger__row {
  display: grid;
  grid-template-columns: minmax(9rem, 0.8fr) auto minmax(0, 1.6fr) minmax(0, 0.9fr);
  gap: var(--sp-5); align-items: start;
  padding: var(--sp-5);
}
.ledger__row:nth-child(even) { background: var(--surface-sunken); }
.ledger__item { font: 600 var(--fs-small)/1.3 var(--font-body); color: var(--ink-primary); }
.ledger__item small { display: block; font: 400 var(--fs-data)/1.5 var(--font-mono); color: var(--ink-muted); margin-top: 4px; }
.ledger__seal { justify-self: start; }
.ledger__body { font-size: var(--fs-small); color: var(--ink-secondary); }
.ledger__body p { margin-bottom: var(--sp-3); }
.ledger__body p:last-child { margin-bottom: 0; }
.ledger__act { font: 600 var(--fs-data)/1.5 var(--font-mono); color: var(--accent-text); }
.ledger__src { font: 400 var(--fs-data)/1.6 var(--font-mono); color: var(--ink-muted); }
.ledger__src b { color: var(--ink-secondary); font-weight: 600; }

/* 结论块（A 类要求：置于表格之上，一级权重） */
.verdict {
  border: 1px solid var(--line-mid); background: var(--surface-card-hi);
  padding: var(--sp-6); display: grid; gap: var(--sp-4);
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.verdict__lead { font: 700 1.6rem/1.25 var(--font-display); color: var(--ink-primary); margin: 0; }
.verdict__lead em { font-style: normal; color: var(--accent-text); }
.verdict__note { margin: 0; font-size: var(--fs-small); }

/* 状态图例：四态 + 第五种「未核实」 */
.statekey { list-style: none; padding: 0; margin: var(--sp-5) 0 0; display: grid; gap: var(--sp-2); }
.statekey li { display: flex; align-items: center; gap: var(--sp-3); font-size: var(--fs-data); }
.statekey li > .stamp { flex: 0 0 auto; }
.statekey__n { color: var(--ink-secondary); }
.statekey__more {
  margin: var(--sp-3) 0 0; font: 400 var(--fs-data)/1.55 var(--font-mono); color: var(--ink-muted);
  border-top: 1px dashed var(--line-mid); padding-top: var(--sp-3);
}

/* 单栏结论版式：结论句在上，列表在下（避免双栏出现空列） */
.panel { border: 1px solid var(--line-mid); background: var(--surface-card); padding: var(--sp-6); }
.panel__lead {
  font: 700 1.5rem/1.3 var(--font-display); color: var(--ink-primary);
  margin: 0 0 var(--sp-5); max-width: 56ch;
}
.panel__lead em { font-style: normal; color: var(--accent-text); }

/* B 类：适合谁 / 不适合谁，两个不同色块并列 */
.fitlist { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4); margin-top: var(--sp-5); }
.fitlist__col { border-top: 2px solid var(--line-mid); padding-top: var(--sp-3); }
.fitlist__col--yes { border-top-color: var(--state-live); }
.fitlist__col--no { border-top-color: var(--state-removed); }
.fitlist h4 {
  font: 600 11px/1 var(--font-mono); letter-spacing: var(--ls-label);
  text-transform: uppercase; margin: 0 0 var(--sp-3);
}
.fitlist__col--yes h4 { color: var(--state-live); }
.fitlist__col--no h4 { color: var(--state-removed); }
.fitlist ul { list-style: none; padding: 0; margin: 0; }
.fitlist li { font-size: var(--fs-data); line-height: 1.55; color: var(--ink-secondary); margin-bottom: var(--sp-2); }

/* ---------- A 类矩阵表 ---------- */
.tablewrap { position: relative; border: 1px solid var(--line-mid); background: var(--surface-page); }
.tablescroll { overflow-x: auto; overflow-y: visible; }
table.matrix { width: 100%; border-collapse: collapse; min-width: 46rem; }
/* 表说明放在滚动容器之外，横向滚动时不会被带着跑 */
.matrix__caption {
  margin: 0; padding: var(--sp-4) var(--sp-5);
  font: 400 var(--fs-data)/1.5 var(--font-mono); color: var(--ink-muted);
  border-bottom: 1px solid var(--line-faint);
}
table.matrix th, table.matrix td {
  text-align: left; padding: var(--sp-4) var(--sp-5); vertical-align: top;
  font-size: var(--fs-small); border-bottom: 1px solid var(--line-faint);
}
table.matrix thead th {
  background: var(--surface-sunken); color: var(--ink-muted);
  font: 600 11px/1.4 var(--font-mono); letter-spacing: var(--ls-label); text-transform: uppercase;
  vertical-align: top; border-bottom: 1px solid var(--line-mid);
}
table.matrix tbody th { font-weight: 600; color: var(--ink-primary); background: var(--surface-page); }
table.matrix tbody tr:last-child th, table.matrix tbody tr:last-child td { border-bottom: 0; }
/* 列宽下限：避免状态胶囊与平台名被挤到换行 */
table.matrix thead th:nth-child(1), table.matrix tbody th { min-width: 10.5rem; }
table.matrix thead th:nth-child(2), table.matrix tbody td:nth-child(2) { min-width: 7.5rem; }
table.matrix thead th:nth-child(3), table.matrix tbody td:nth-child(3) { min-width: 5.5rem; }
table.matrix td { color: var(--ink-secondary); }
table.matrix .num { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.tablewrap::after {
  content: ""; position: absolute; right: 0; top: 0; bottom: 0; width: 30px;
  pointer-events: none; opacity: 0; transition: opacity var(--t-base) var(--ease);
  background: linear-gradient(270deg, var(--surface-page) 10%, transparent 100%);
}
.scroll-hint {
  display: none; padding: var(--sp-3) var(--sp-5);
  font: 500 var(--fs-data)/1 var(--font-mono); letter-spacing: var(--ls-label);
  color: var(--accent-text); text-transform: uppercase;
  border-bottom: 1px solid var(--line-faint); background: var(--surface-sunken);
}

/* ---------- E 类时间线 ---------- */
.timeline { list-style: none; padding: 0; margin: 0; border-left: 2px solid var(--line-mid); }
.timeline li { position: relative; padding: 0 0 var(--sp-6) var(--sp-6); }
.timeline li:last-child { padding-bottom: 0; }
.timeline li::before {
  content: ""; position: absolute; left: -7px; top: 6px; width: 12px; height: 12px;
  background: var(--surface-page); border: 2px solid var(--state-ended);
}
.timeline li[data-state="live"]::before { border-color: var(--state-live); }
.timeline li[data-state="removed"]::before { border-color: var(--state-removed); }
.timeline li[data-state="unannounced"]::before { border-color: var(--state-unannounced); }
.timeline__when {
  display: block; font: 600 var(--fs-data)/1 var(--font-mono);
  letter-spacing: 0.05em; color: var(--accent-text); margin-bottom: var(--sp-2);
}
.timeline__what { font-weight: 600; color: var(--ink-primary); margin-bottom: var(--sp-2); }
.timeline p { font-size: var(--fs-small); margin-bottom: 0; }

/* ---------- FAQ ---------- */
.faq { border-top: 1px solid var(--line-faint); }
.faq details { border-bottom: 1px solid var(--line-faint); }
.faq summary {
  cursor: pointer; list-style: none; padding: var(--sp-5) 0;
  display: flex; gap: var(--sp-4); align-items: baseline;
  font: 600 1.06rem/1.4 var(--font-body); color: var(--ink-primary);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: "+"; margin-left: auto; color: var(--accent-text);
  font: 600 1.2rem/1 var(--font-mono);
}
.faq details[open] summary::after { content: "\2212"; }
.faq__a { padding: 0 0 var(--sp-5); font-size: var(--fs-small); max-width: 74ch; }
.faq__a p:last-child { margin-bottom: 0; }

/* ---------- 页脚 ---------- */
.footer { border-top: 1px solid var(--line-mid); background: var(--surface-sunken); padding: var(--sp-7) 0 var(--sp-6); }
.footer__grid { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 1fr)); gap: var(--sp-6); }
.footer h4 {
  font: 600 11px/1 var(--font-mono); letter-spacing: var(--ls-label);
  text-transform: uppercase; color: var(--ink-muted); margin: 0 0 var(--sp-3);
}
.footer ul { list-style: none; padding: 0; margin: 0; }
.footer li { margin-bottom: var(--sp-2); font-size: var(--fs-small); }
.footer a { color: var(--ink-secondary); text-decoration: none; }
.footer a:hover { color: var(--accent-text); text-decoration: underline; }
.footer__legal {
  margin-top: var(--sp-6); padding-top: var(--sp-4); border-top: 1px solid var(--line-faint);
  font: 400 var(--fs-data)/1.6 var(--font-mono); color: var(--ink-muted);
}

/* ---------- 断点 ---------- */
@media (max-width: 1023px) {
  /* 窄屏换构图：主视觉改成顶部横幅，而不是把桌面背景压扁 */
  .hero {
    display: block; min-height: 0;
    padding: 0 0 var(--sp-6);
  }
  .hero__bg { position: relative; inset: auto; height: 208px; }
  .hero__bg img { object-position: 50% 58%; }
  .hero__bg::after {
    background: linear-gradient(180deg,
      rgba(8, 8, 8, 0.30) 0%, rgba(8, 8, 8, 0) 38%,
      rgba(8, 8, 8, 0.62) 80%, var(--surface-page) 100%);
  }
  .hero__copy { max-width: none; padding-top: var(--sp-5); }
  .hero__horizon { margin-top: var(--sp-6); }
  .cols2, .verdict, .fitlist { grid-template-columns: 1fr; }
  .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer__grid { grid-template-columns: 1fr 1fr; }
  .ledger__row { grid-template-columns: minmax(0, 1fr); gap: var(--sp-3); }
  .ledger__seal { justify-self: start; }
  .section { padding: var(--sp-8) 0; }
}

/* A 类粘性表头只在 ≥980px 生效（窄屏容器转为横向滚动，sticky 会失效） */
@media (min-width: 980px) {
  table.matrix thead th { position: sticky; top: 56px; z-index: 5; }
}
@media (max-width: 979px) {
  .tablescroll { overflow-x: auto; }
  /* 窄屏给每列足够宽度，滚动后仍是可读的一段，而不是被压成碎片 */
  table.matrix { min-width: 60rem; }
  .tablewrap::after {
  content: ""; position: absolute; right: 0; top: 0; bottom: 0; width: 30px;
  pointer-events: none; opacity: 0; transition: opacity var(--t-base) var(--ease);
  background: linear-gradient(270deg, var(--surface-page) 10%, transparent 100%);
}
.scroll-hint { display: block; }
  .tablewrap::after { opacity: 1; }
  /* 首列吸左时加一道投影，让被压住的内容读成「还有更多」而不是「文字断了」 */
  table.matrix tbody th {
    position: sticky; left: 0; z-index: 4;
    box-shadow: 10px 0 14px -10px rgba(0, 0, 0, 0.95);
  }
  table.matrix tbody tr:nth-child(even) th { background: var(--surface-sunken); }
}

@media (max-width: 767px) {
  .wrap { padding: 0 var(--sp-4); }
  .masthead { background: var(--surface-page); }
  html { scroll-padding-top: 104px; }
  .facts { grid-template-columns: 1fr; }
  .headstone__grid { grid-template-columns: 1fr; }
  .footer__grid { grid-template-columns: 1fr; }
  .masthead__tag { display: none; }
  .masthead__nav { gap: var(--sp-4); font-size: var(--fs-data); }
  .hero__title { margin-top: var(--sp-3); }
  .section { padding: var(--sp-7) 0; }
  .stamp { flex-wrap: wrap; }
  .verdict { padding: var(--sp-5); }
}
@media (max-width: 560px) {
  .eyebrow::after { display: none; }
  /* 主视觉 credits 在窄屏收起——同一句已列在首页 Sources 一节 */
  .hero__credit { display: none; }
}

/* =========================================================================
   gk2-extras.css — engine-level styles appended after the inlined design
   tokens + the approved preview stylesheet (preview/assets/gk2.css).

   These are the hooks the hot-keys toolchain keeps (check-geo.mjs / the
   consent engine / the inert ad placeholder) plus the two additive components
   the implementation needs (aboutGame data list, coverage/demotion blocks).
   Visual vocabulary comes from 视觉系统_GK2.md; no new palette values.
   ========================================================================= */

/* ---- skip link + byline ---- */
.skip-link{position:absolute;left:-9999px;top:0;background:var(--brand);color:var(--brand-ink);padding:10px 16px;z-index:99}
.skip-link:focus{left:12px;top:12px}
.byline{margin:14px 0 0;font:400 var(--fs-data)/1.6 var(--font-mono);letter-spacing:.02em;color:var(--ink-muted)}
.byline time{color:var(--ink-secondary)}

/* ---- page head spacing for structured inner pages ---- */
.pagehead{padding-bottom:0}
.pagehead .section__title{margin:0 0 6px}
.pagehead .vstamp{margin:6px 0 0}

/* ---- related / sources tail blocks ---- */
.related{border-top:1px solid var(--line-mid);padding-top:var(--sp-5)}
.related h2{font:700 var(--fs-h3)/1.3 var(--font-display);margin:0 0 var(--sp-3)}
.related ul{list-style:none;margin:0;padding:0;display:grid;gap:var(--sp-2)}
.related a{display:inline-block;min-height:44px;padding-top:10px;border-top:2px solid var(--brand);font-weight:600}
.sources h2{font:600 var(--fs-data)/1.4 var(--font-mono);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--ink-muted);margin:0 0 var(--sp-3)}
.sources ul{margin:0;padding-left:18px}
.sources li{margin:6px 0;font-size:var(--fs-small)}
.sources a{color:var(--brand-text);text-decoration:underline;text-underline-offset:3px}
.srclist{list-style:none;margin:0;padding:0;display:grid;gap:var(--sp-2)}
.srclist li{font-size:var(--fs-small)}
.srclist a{color:var(--brand-text);text-decoration:underline;text-underline-offset:3px}

/* ---- additive component: aboutGame data list ---- */
.datlist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line-faint);border:1px solid var(--line-mid)}
.datlist .dat{background:var(--surface-sunken);padding:var(--sp-3) var(--sp-4);display:grid;gap:2px}
.dat__k{font:600 11px/1.4 var(--font-mono);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--ink-muted)}
.dat__v{font-size:var(--fs-small);color:var(--ink-primary)}
.dat__asof{display:block;font:400 11px/1.5 var(--font-mono);color:var(--ink-muted)}

/* ---- additive: verdict spread line ---- */
.spread{font:400 var(--fs-small)/1.6 var(--font-mono);color:var(--ink-muted)}

/* ---- additive: state demotion for expired / removed / never-announced ---- */
.stateblock.is-ended,.stateblock.is-removed,.stateblock.is-unannounced{background:var(--surface-sunken)}
.stateblock.is-ended .section__title,.stateblock.is-removed .section__title,.stateblock.is-unannounced .section__title{color:var(--ink-secondary)}
.stateblock.is-removed .ledger__row,.stateblock.is-ended .ledger__row{opacity:.94}

/* ---- four-state legend under a ledger ---- */
.legend{list-style:none;margin:var(--sp-4) 0 0;padding:0;display:flex;flex-wrap:wrap;gap:var(--sp-3)}
.legend li{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-small);color:var(--ink-muted)}

/* ---- closing call to action band ---- */
.finalcta{background:var(--surface-sunken);border-top:1px solid var(--line-mid)}
.finalcta .section__lead{max-width:60ch}

/* ---- consent choices entry point + section ---- */
.consent-settings-button{margin-top:var(--sp-4);padding:12px 18px;min-height:48px;border:1px solid var(--border-strong);border-radius:var(--r-md);background:transparent;color:inherit;font:600 var(--fs-data) var(--font-body);cursor:pointer}
.footer .consent-settings-button{width:100%;text-align:left}
.consent-choices{border:1px solid var(--line-mid);border-radius:var(--r-lg);background:var(--surface-sunken);margin:var(--sp-5) 0 var(--sp-6);padding:var(--sp-5) var(--sp-5)}
.consent-choices h2{font:700 var(--fs-h3)/1.3 var(--font-display);margin:0 0 var(--sp-2)}
.consent-choices p{font-size:var(--fs-small);color:var(--ink-secondary);margin:0}

/* ---- mandatory-choice page lock (site-ads.md §6) ----
   tarteaucitron's own overlay blocks pointer events; these rules additionally
   stop the background from scrolling (wheel, touch and keyboard) until the
   visitor has picked accept or reject. */
html.consent-choice-required,
body.consent-choice-required{overflow:hidden !important;overscroll-behavior:none}
body.consent-choice-required{position:fixed;inset:0;width:100%}

/* ---- self-hosted consent dialog ---- */
html body #tarteaucitronRoot #tarteaucitronAlertBig{border:1px solid var(--line-mid);border-radius:var(--r-lg);background:var(--surface-raised);color:var(--ink-primary);box-shadow:0 24px 90px rgba(0,0,0,.6);font-family:var(--font-body)}
html body #tarteaucitronRoot.tarteaucitronSize-middle.tarteaucitronBeforeVisible::before{background:rgba(8,8,8,.86) !important;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);pointer-events:auto}
html body #tarteaucitronRoot.tarteaucitronSize-middle #tarteaucitronAlertBig{box-sizing:border-box !important;width:min(700px,calc(100% - 48px)) !important;min-width:0 !important;max-width:700px !important;max-height:calc(100dvh - 48px);padding:clamp(30px,4.6vw,48px) !important;overflow-y:auto;border-radius:var(--r-lg)}
html body #tarteaucitronRoot.tarteaucitronSize-middle #tarteaucitronAlertBig::before{display:block;margin-bottom:18px;color:var(--ink-primary);font-family:var(--font-display);font-size:clamp(29px,4.4vw,42px);font-weight:700;line-height:1.05;letter-spacing:0;text-align:center}
html body #tarteaucitronRoot.tarteaucitronSize-middle #tarteaucitronDisclaimerAlert{display:block;max-width:58ch;margin:0 auto 26px;padding:0;color:var(--ink-secondary);font-size:18px;line-height:1.6;text-align:center}
html body #tarteaucitronRoot #tarteaucitronAlertBig button.tarteaucitronCTAButton{min-height:44px;padding:13px 18px !important;border-radius:var(--r-md);border:1px solid var(--brand);background:var(--brand);color:var(--brand-ink);font:700 15px/1.3 var(--font-body);cursor:pointer}
html body #tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronAllDenied2{border:1px solid var(--border-strong);background:var(--surface-sunken);color:var(--ink-primary)}
/* Pre-script fallback: the Personalize control is removed at runtime and the
   privacy control is replaced by a real link, so neither can flash as a third
   button. */
html body #tarteaucitronRoot #tarteaucitronCloseAlert,
html body #tarteaucitronRoot #tarteaucitronPersonalize,
html body #tarteaucitronRoot #tarteaucitronPrivacyUrl,
html body #tarteaucitronRoot #tarteaucitronPrivacyUrlDialog{display:none !important}
html body #tarteaucitronRoot [data-consent-privacy-link]{display:block;width:fit-content;margin:16px auto 0;color:var(--ink-muted);font-size:13px;line-height:1.4;text-align:center;text-decoration:underline;text-underline-offset:3px}
html body #tarteaucitronRoot [data-consent-privacy-link]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---- inert advertising placeholder (site-ads.md §4) ----
   Ads are off for this site (visual system §6), so no slot is generated; these
   rules keep the placeholder stable if a later batch turns them on. */
.ad-slot{--ad-slot-height:120px;display:grid;place-items:center;gap:6px;min-height:var(--ad-slot-height);margin:32px 0;padding:14px;overflow:hidden;border:1px dashed var(--line-mid);border-radius:var(--r-lg);background:var(--surface-sunken);color:var(--ink-muted);text-align:center}
.ad-slot--banner{--ad-slot-height:96px;width:100%}
.ad-slot--rectangle{--ad-slot-height:280px;width:min(100%,360px);margin-right:auto;margin-left:auto}
.ad-slot-label{font:700 11px/1.4 var(--font-mono);letter-spacing:2px;text-transform:uppercase}
.ad-consent-note{margin:0;max-width:38ch;font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.ad-slot-body{width:100%;overflow-wrap:anywhere}
.ad-slot-body iframe,.ad-slot-body img,.ad-slot-body ins{max-width:100%}
.ad-slot[data-ad-state="loaded"] > .ad-consent-note{display:none}
.ad-slot[data-ad-state="error"]{border-style:solid;border-color:var(--line-mid)}

/* ---- hero art fallback (no official imagery is hosted) ----
   视觉系统_GK2.md §1.4: even with every official image removed, the hero is
   carried by the horizon band + the headstone that follows. This is that band. */
.hero__bg-art{position:absolute;inset:0;display:block;background:
  radial-gradient(120% 80% at 78% 68%,rgba(216,136,40,.30),transparent 60%),
  radial-gradient(90% 70% at 18% 12%,rgba(104,40,88,.55),transparent 65%),
  linear-gradient(180deg,var(--surface-page) 0%,var(--surface-card-hi) 46%,var(--brand-warm) 66%,var(--brand) 78%,var(--accent) 88%,var(--surface-page) 100%);
  filter:saturate(.9)}
.hero__bg::before{background-image:var(--dither);background-size:var(--dither-size);mix-blend-mode:overlay}

/* ---- narrow screens: the two-column data list stacks ---- */
@media(max-width:760px){
  .datlist{grid-template-columns:1fr}
  .byline{font-size:11px}
  html body #tarteaucitronRoot.tarteaucitronSize-middle #tarteaucitronAlertBig{width:calc(100% - 20px) !important;max-height:calc(100dvh - 20px);padding:26px 14px 20px !important}
  html body #tarteaucitronRoot.tarteaucitronSize-middle #tarteaucitronAlertBig button{width:100% !important;margin:0 0 10px !important}
  .ad-slot{margin:26px 0;padding:12px}
  .ad-slot--rectangle{--ad-slot-height:250px}
}