/* ============================================================
   砝码 FAMA 设计令牌 tokens.css -- 两级制单一真源 (v2.1, 2026-11-04 定稿)
   结构 (学 Carbon 两级制, 见手册第一、四章):
     第一级 原始层 Primitive: 只登记原始色值/字族, 只有设计源文件 (SVG) 与本文件可引用;
     第二级 语义层 Semantic: 界面与模板代码只许引用语义令牌, 禁止裸值;
     状态色铁律: 核验三态色永不以裸值出现在任何界面/模板代码中, 只经 --status-* 令牌出。
   变更走手册第十一章 RFC + 会签 + 版本记录。
   v2.1 定稿 (回溯立单 R-12): 依 2026-10-20 品牌全统一裁定, FAMA 旧主色
   令牌族全量退出; 品牌原始值改登记公司统一令牌 --p-vc-* (唯一源: vertciti
   品牌包 v1.0 05-design-tokens, 黑白 + 信号橙/证据黄/验证绿)。逐变量映射正本:
   docs/brand-token-mapping-final-2026-11-04.md。
   ============================================================ */
:root {
  /* ================= 第一级: 原始层 Primitive ================= */
  /* 公司统一令牌 (唯一源: 品牌包 v1.0 05-design-tokens, 原值照录) */
  --p-vc-ink: #000000;
  --p-vc-paper: #FFFFFF;
  --p-vc-orange: #FF4713;
  --p-vc-yellow: #FFCE00;
  --p-vc-green: #1D8348;
  --p-vc-graphite: #3F3F3F;
  --p-vc-stone: #6B6B6B;
  --p-vc-line: #DEDEDE;
  --p-vc-mist: #F5F5F5;
  /* 核验绿族 (原始值, 界面禁用直引) */
  --p-green-700: #14573A;
  --p-green-600: #1E7D4F;
  --p-green-50:  #E4F1E9;
  --p-green-600-a35: rgba(30, 125, 79, .35);
  /* 估算琥珀族 */
  --p-amber-700: #9A6B14;
  --p-amber-500: #C08A1E;
  --p-amber-50:  #F8EFDA;
  --p-amber-700-a35: rgba(154, 107, 20, .35);
  --p-amber-500-a22: rgba(192, 138, 30, .22);
  /* 未核验灰族 */
  --p-gray-600: #6E747C;
  --p-gray-100: #ECEEF0;
  --p-gray-600-a35: rgba(110, 116, 124, .35);
  /* 检定红族 */
  --p-red-600: #B23A2E;
  --p-red-50:  #F7E7E3;
  --p-red-tint: #FDF9F7;
  /* 纸与墨 */
  --p-paper: #F8F6F1;
  --p-paper-line: #D8D3C6;
  --p-white: #FFFFFF;
  --p-surface-alt: #FBFBFC;
  --p-ink: #191C22;
  --p-ink-2: #565D66;
  --p-ink-3: #9BA1A9;
  --p-line: #E3E1DA;
  /* 深底上的文字 (原始; v2.1 已去蓝调, 与 tokens-dna 深底灰阶对齐) */
  --p-on-dark-2: #BDBDBD;
  --p-on-dark-mid: #C9C9C9;
  --p-on-dark-3: #9A9A9A;
  /* 样张舞台底 (原始) */
  --p-stage: #E9E7E0;
  --p-stage-dark: #33373D;
  /* 原始字族 (开源可商用: 思源/Noto 系列, SIL OFL) */
  --p-font-sans: "Nunito Sans", "Noto Sans SC", "Source Han Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --p-font-serif: "Noto Serif SC", "Source Han Serif SC", "Songti SC", serif;
  --p-font-mono: "Noto Sans Mono", "SF Mono", "Consolas", monospace;

  /* ================= 第二级: 语义层 Semantic (界面/模板只许引此层) ================= */
  /* 品牌与表面 */
  --color-brand: var(--p-vc-ink);              /* 主色: 字标/标题/主按钮 (墨) */
  --color-brand-deep: var(--p-vc-ink);         /* 深底: 封面/顶栏 (黑底) */
  --color-brand-abyss: var(--p-vc-ink);        /* 压条/最深底 */
  --color-brand-mid: var(--p-vc-graphite);     /* 次标题/图表第二系列 */
  --color-link: var(--p-vc-ink);               /* 链接/交互高亮 (墨色, 强调态走 dna 信号橙) */
  --color-brand-soft: var(--p-vc-mist);        /* 表头底/选中行 */
  --color-brand-softer: var(--p-vc-mist);      /* 斑马行/卡片衬底 */
  --color-surface: var(--p-white);             /* 卡片/页面白 */
  --color-surface-alt: var(--p-surface-alt);   /* 导航底 */
  --color-paper: var(--p-paper);               /* 底稿纸面 */
  --color-paper-line: var(--p-paper-line);     /* 底稿横线 */
  --color-stage: var(--p-stage);               /* 样张舞台底 */
  --color-stage-dark: var(--p-stage-dark);
  --color-ink: var(--p-ink);                   /* 正文 */
  --color-ink-2: var(--p-ink-2);               /* 次级文字 */
  --color-ink-3: var(--p-ink-3);               /* 血缘小字/脚注 */
  --color-line: var(--p-line);                 /* 分隔线 */
  --color-on-brand: var(--p-paper);            /* 深底主文字 */
  --color-on-brand-2: var(--p-on-dark-2);      /* 深底次文字 */
  --color-on-brand-mid: var(--p-on-dark-mid);  /* 深底题花字 */
  --color-on-brand-3: var(--p-on-dark-3);      /* 深底脚注 */
  --color-seal: var(--p-red-600);              /* 检定印记红 (点缀, 面积 <= 2%) */
  --color-seal-bg: var(--p-red-50);
  --color-seal-tint: var(--p-red-tint);        /* 覆盖声明框底 */

  /* 核验三态 (状态即外观: 多源公告一致=实, 估算=虚线+斜纹, 未核验=空心留白) */
  --status-confirmed: var(--p-green-600);          /* 多源公告一致: 点/图标 (实心) */
  --status-confirmed-fg: var(--p-green-700);       /* 多源公告一致: 文字 */
  --status-confirmed-bg: var(--p-green-50);        /* 多源公告一致: 签底 (实底) */
  --status-confirmed-border: var(--p-green-600-a35);
  --status-estimated: var(--p-amber-500);          /* 估算: 点/描边 */
  --status-estimated-fg: var(--p-amber-700);       /* 估算: 文字 */
  --status-estimated-bg: var(--p-amber-50);        /* 估算: 签底 (须叠斜纹) */
  --status-estimated-border: var(--p-amber-700-a35);
  --status-estimated-hatch: repeating-linear-gradient(45deg, transparent 0 5px, var(--p-amber-500-a22) 5px 6.5px);
  --status-unverified: var(--p-gray-600);          /* 未核验: 空心描边/文字 */
  --status-unverified-bg: var(--p-gray-100);       /* 未核验: 签底 */
  --status-unverified-border: var(--p-gray-600-a35);

  /* 数据可视化语义 (图表同样执行状态即外观) */
  --viz-confirmed: var(--p-vc-green);              /* 多源公告一致系列: 实线/实心柱 (验证绿, 与 tokens-dna 一致) */
  --viz-estimated: var(--status-estimated-fg);     /* 估算系列: 虚线/斜纹柱 */
  --viz-estimated-dash: 5 4;                       /* 估算虚线规格 (SVG stroke-dasharray) */
  --viz-unverified: var(--status-unverified);      /* 未核验系列: 空心/只描边 */

  /* 字体语义 */
  --font-ui: var(--p-font-sans);      /* 界面与正文 */
  --font-doc: var(--p-font-serif);    /* 报告封面主标/档案感标题 */
  --font-data: var(--p-font-mono);    /* 编号/血缘小字/数字注记 */

  /* 字阶 (px / 行高) */
  --fs-display: 40px;  --lh-display: 1.2;
  --fs-h1: 30px;       --lh-h1: 1.27;
  --fs-h2: 22px;       --lh-h2: 1.32;
  --fs-h3: 17px;       --lh-h3: 1.4;
  --fs-body: 14px;     --lh-body: 1.65;
  --fs-small: 12.5px;  --lh-small: 1.55;
  --fs-micro: 11px;    --lh-micro: 1.5;
  --fs-nano: 10px;     --lh-nano: 1.45;

  /* 间距与形状 */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px;
  --radius-card: 10px;
  --radius-badge: 999px;
  --radius-seal: 6px;
  --shadow-card: 0 1px 2px rgba(0, 0, 0, .06), 0 8px 24px rgba(0, 0, 0, .07);
  --shadow-page: 0 4px 32px rgba(0, 0, 0, .18);

  /* 状态签规格 (与 badges/ 组件双侧同名同版 v1.1) */
  --badge-h: 22px;
  --badge-fs: 11px;
  --badge-dot: 11px;
  --badge-pad-x: 9px;
}

/* ============================================================
   砝码 FAMA 设计令牌 -- 公司 DNA 改基层 tokens-dna.css (v3.0-rc2, 2026-10-22)
   唯一依据: 公司官网 www.vertciti.com 线上样式表 (2026-10-22 实测提取:
     /assets/site/site.f2a704db.css :root 与 [data-theme="dark"] 两套令牌,
     圆角全站为 0, Nunito Sans 可变字体自托管, 选中态 = 3-4px 信号橙下划条)。
   用法: 在 tokens.css 之后加载。只覆盖语义层 (--color-* / --status-* / --viz-* /
     --font-* / 形状), 组件 (badges.css 等) 一行不改即切到公司 DNA。
   主题: 默认浅色 (官网 :root); [data-theme="dark"] 与官网暗色令牌一一对应。
   可读性 (检定制: 视觉权重永不超过证据等级):
     - 信号橙只作强调面/选中条/焦点环, 不作正文字色 (白底对比不足);
     - 证据黄只作估算态的底、斜纹与注记竖条, 文字一律用墨色;
     - 验证绿作 "多源公告一致" 态实心点与描边; 青绿 verd 只作次级数据系列。
   ============================================================ */
:root {
  /* ---------- 原始层: 官网浅色令牌 (原值照录) ---------- */
  --dna-bg: #FFFFFF;
  --dna-fg: #000000;
  --dna-fg-2: #3F3F3F;
  --dna-fg-3: #6B6B6B;
  --dna-soft: #F5F5F5;
  --dna-line: #DEDEDE;
  --dna-strong: #000000;
  --dna-card: #FFFFFF;
  --dna-orange: #FF4713;
  --dna-yellow: #FFCE00;
  --dna-green: #1D8348;
  --dna-verd: #2B7363;
  /* 派生 (只用于状态签底色, 由官网三色按透明度调出) */
  --dna-green-soft: rgba(29, 131, 72, .10);
  --dna-green-a40: rgba(29, 131, 72, .45);
  --dna-yellow-soft: rgba(255, 206, 0, .16);
  --dna-yellow-a45: rgba(179, 144, 0, .55);
  --dna-yellow-hatch: rgba(255, 206, 0, .55);
  --dna-gray-a40: rgba(107, 107, 107, .45);
  --dna-font-sans: "Nunito Sans Variable", "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", "Noto Sans CJK SC", sans-serif;
  --dna-font-mono: "JetBrains Mono Variable", "JetBrains Mono", "SF Mono", Consolas, monospace;

  /* ---------- 语义层覆盖 (名字与 tokens.css v2.0 一一对应) ---------- */
  --color-brand: var(--dna-strong);
  --color-brand-deep: #000000;          /* 品牌条: 官网 .utility 恒为黑底, 不随主题 */
  --color-brand-abyss: #000000;
  --color-brand-mid: var(--dna-fg-2);
  --color-link: var(--dna-fg);
  --color-accent: var(--dna-orange);
  --color-accent-soft: rgba(255, 71, 19, .12);
  --color-on-accent: #000000;
  --color-brand-soft: var(--dna-soft);
  --color-brand-softer: var(--dna-soft);
  --color-surface: var(--dna-bg);
  --color-surface-alt: var(--dna-soft);
  --color-card: var(--dna-card);
  --color-paper: var(--dna-bg);
  --color-ink: var(--dna-fg);
  --color-ink-2: var(--dna-fg-2);
  --color-ink-3: var(--dna-fg-3);
  --color-line: var(--dna-line);
  --color-strong: var(--dna-strong);
  --color-verd: var(--dna-verd);
  --color-on-brand: #FFFFFF;
  --color-on-brand-2: #BDBDBD;          /* 官网 .utility nav a 未选中色 */
  --color-on-brand-3: #9A9A9A;

  --status-confirmed: var(--dna-green);
  --status-confirmed-fg: var(--dna-fg);
  --status-confirmed-bg: var(--dna-green-soft);
  --status-confirmed-border: var(--dna-green-a40);
  --status-estimated: var(--dna-yellow);
  --status-estimated-fg: var(--dna-fg);
  --status-estimated-bg: var(--dna-yellow-soft);
  --status-estimated-border: var(--dna-yellow-a45);
  --status-estimated-hatch: repeating-linear-gradient(45deg, transparent 0 5px, var(--dna-yellow-hatch) 5px 6.5px);
  --status-unverified: var(--dna-fg-3);
  --status-unverified-bg: transparent;
  --status-unverified-border: var(--dna-gray-a40);

  --viz-confirmed: var(--dna-green);
  --viz-estimated: var(--dna-yellow);
  --viz-unverified: var(--dna-fg-3);
  --viz-series-2: var(--dna-verd);

  --font-ui: var(--dna-font-sans);
  --font-doc: var(--dna-font-sans);
  --font-data: var(--dna-font-mono);

  /* 形状: 官网全站圆角 0 (仅圆点 50%) */
  --radius-card: 0;
  --radius-badge: 0;
  --radius-seal: 0;
  --shadow-card: none;
  --color-scrim: rgba(0, 0, 0, .55);     /* 对话框遮罩 */
  --shadow-pop: 0 24px 40px -24px rgba(0, 0, 0, .25);

  /* 版心与节奏: 官网 --w / --gut / --sec */
  --layout-w: 1200px;
  --layout-gut: clamp(20px, 4.5vw, 64px);
  --layout-sec: clamp(40px, 5vw, 72px);
}

:root[data-theme="dark"] {
  /* 官网暗色令牌原值照录 */
  --dna-bg: #000000;
  --dna-fg: #FFFFFF;
  --dna-fg-2: #F5F5F5;
  --dna-fg-3: #DEDEDE;
  --dna-soft: #3F3F3F;
  --dna-line: #6B6B6B;
  --dna-strong: #FFFFFF;
  --dna-card: #3F3F3F;
  --dna-verd: #5DB8A3;
  --dna-green-soft: rgba(29, 131, 72, .28);
  --dna-green-a40: rgba(93, 184, 163, .6);
  --dna-yellow-soft: rgba(255, 206, 0, .14);
  --dna-yellow-a45: rgba(255, 206, 0, .6);
  --dna-yellow-hatch: rgba(255, 206, 0, .45);
  --dna-gray-a40: rgba(222, 222, 222, .5);
  --shadow-pop: 0 24px 40px -24px rgba(0, 0, 0, .8);
}

/* ============================================================
   砝码 FAMA 核验状态签组件 (CSS 侧) v1.1
   双侧同名同版: 本文件类名与 badges/badge-*.svg 一一同名;
   任一侧改版, 两侧同步升版并在手册第十一章登记。
   色值只引 ../tokens.css 语义令牌 (--status-*), 禁止裸值。
   交付单位是"签组": 状态签 + .badge-meta (检定时间/依据 + 复核路径), 三者同行。
   ============================================================ */
.badge {
  display: inline-flex; align-items: center; gap: 6px;
  height: var(--badge-h); padding: 0 var(--badge-pad-x) 0 7px;
  border-radius: var(--radius-badge);
  font-family: var(--font-ui); font-size: var(--badge-fs); font-weight: 700; line-height: 1;
  vertical-align: middle; white-space: nowrap;
}
.badge .dot { width: var(--badge-dot); height: var(--badge-dot); border-radius: 50%; flex: none; position: relative; }

/* 多源公告一致: 实 -- 实心点 (内嵌勾)、实底、实线边 */
.badge-confirmed { background: var(--status-confirmed-bg); color: var(--status-confirmed-fg); border: 1px solid var(--status-confirmed-border); }
.badge-confirmed .dot { background: var(--status-confirmed); }
.badge-confirmed .dot::after {
  content: ""; position: absolute; left: 3.2px; top: 1.6px; width: 3.4px; height: 6px;
  border: solid #fff; border-width: 0 1.6px 1.6px 0; transform: rotate(42deg);
}

/* 估算: 虚 -- 虚线边、斜纹底、半实点 (状态即外观, 手册第一章原则 1) */
.badge-estimated {
  background-color: var(--status-estimated-bg); background-image: var(--status-estimated-hatch);
  color: var(--status-estimated-fg); border: 1.3px dashed var(--status-estimated-border);
}
.badge-estimated .dot {
  border: 1.6px solid var(--status-estimated);
  background: linear-gradient(90deg, var(--status-estimated) 50%, transparent 50%);
}

/* 未核验: 空 -- 空心点、无纹底; 同屏出现时不许省略 */
.badge-unverified { background: var(--status-unverified-bg); color: var(--status-unverified); border: 1px solid var(--status-unverified-border); }
.badge-unverified .dot { border: 1.6px solid var(--status-unverified); }

/* 签组注记: 检定时间/依据 (等宽小字) + 复核路径 */
.badge-meta { font-family: var(--font-data); font-size: 10.5px; color: var(--color-ink-2); margin-left: 8px; }
.badge-meta .path { color: var(--color-ink-3); }

/* 来源血缘小字 (与状态签配套出现的四要素行) */
.lineage {
  font-family: var(--font-data); font-size: 10.5px; line-height: 1.55; color: var(--color-ink-3);
  border-top: 1px dashed var(--color-line); padding-top: 6px; margin-top: 10px;
}
.lineage b { color: var(--color-ink-2); font-weight: 400; }

/* 砝码 FAMA 官网与文档站 -- 与产品界面 (web/src/styles/app.css) 同一套令牌与组件规格;
   只引语义令牌, 无裸色值 (tests/test_site.py 扫描)。字体自托管 (site/fonts, SIL OFL 1.1)。 */
@font-face { font-family: "Nunito Sans Variable"; font-style: normal; font-display: swap; font-weight: 200 1000; src: url(/site/assets/fonts/nunito-sans-latin-wght-normal.woff2) format("woff2-variations"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Nunito Sans Variable"; font-style: normal; font-display: swap; font-weight: 200 1000; src: url(/site/assets/fonts/nunito-sans-latin-ext-wght-normal.woff2) format("woff2-variations"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "JetBrains Mono Variable"; font-style: normal; font-display: swap; font-weight: 100 800; src: url(/site/assets/fonts/jetbrains-mono-latin-wght-normal.woff2) format("woff2-variations"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; scroll-padding-top: 96px; }
body { margin: 0; background: var(--color-surface); color: var(--color-ink); font-family: var(--font-ui); font-size: 16px; line-height: 1.75; letter-spacing: .01em; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 2px; }
main:focus { outline: none; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: absolute; left: -9999px; top: 0; z-index: 100; background: var(--color-ink); color: var(--color-surface); padding: 8px 16px; font-weight: 800; }
.skip:focus { left: 12px; top: 12px; }
.mono { font-family: var(--font-data); font-size: .92em; letter-spacing: 0; }
.meta { font-size: 13px; color: var(--color-ink-3); line-height: 1.55; margin: 0; }
.muted { color: var(--color-ink-3); }
.wrap { max-width: calc(var(--layout-w) + 2 * var(--layout-gut)); margin: 0 auto; padding-left: var(--layout-gut); padding-right: var(--layout-gut); }

.utility { background: var(--color-brand-deep); color: var(--color-on-brand); font-size: 13px; position: sticky; top: 0; z-index: 41; }
.utility .wrap { display: flex; align-items: stretch; justify-content: space-between; gap: 16px; min-height: 44px; }
.utility nav { display: flex; overflow-x: auto; scrollbar-width: none; }
.utility nav a { display: inline-flex; align-items: center; padding: 0 14px; text-decoration: none; font-weight: 700; color: var(--color-on-brand-2); white-space: nowrap; border-bottom: 3px solid transparent; min-height: 44px; }
.utility nav a:first-child { padding-left: 0; }
.utility nav a[aria-current] { color: var(--color-on-brand); border-bottom-color: var(--color-accent); }
.utility nav a:hover { color: var(--color-on-brand); }
.utility .right { display: flex; align-items: center; gap: 18px; white-space: nowrap; }
.utility-link { font-family: var(--font-data); font-size: 12px; color: var(--color-on-brand-2); text-decoration: none; }
.utility-link:hover { color: var(--color-on-brand); }
header.site { background: var(--color-surface); border-bottom: 1px solid var(--color-line); }
header.site .wrap { display: flex; align-items: center; gap: 20px; min-height: 72px; }
.wordmark { font-weight: 900; font-size: 24px; letter-spacing: -.02em; text-decoration: none; line-height: 1; white-space: nowrap; }
.wordmark .dot { color: var(--color-accent); }
.wordmark.small { font-size: 20px; margin: 0 0 8px; }
.wordmark-sub { font-size: 13px; font-weight: 700; color: var(--color-ink-3); border-left: 1px solid var(--color-line); padding-left: 16px; white-space: nowrap; margin-right: auto; }
.alert { background: var(--color-surface-alt); border-bottom: 1px solid var(--color-line); font-size: 13px; }
.alert .wrap { display: flex; align-items: center; gap: 12px; min-height: 44px; flex-wrap: wrap; }
.alert .alert-k { font-weight: 800; letter-spacing: .1em; }
.alert a { font-weight: 700; margin-left: auto; text-decoration: underline; text-decoration-color: var(--color-accent); text-decoration-thickness: 2px; }

main { min-height: 60vh; padding-bottom: var(--layout-sec); }
h1, h2, h3 { margin: 0; font-weight: 700; letter-spacing: .01em; }
h1 { font-size: clamp(34px, 4.2vw, 56px); line-height: 1.18; text-wrap: balance; }
h2 { font-size: clamp(24px, 2.4vw, 34px); line-height: 1.3; }
h3 { font-size: clamp(18px, 1.5vw, 21px); line-height: 1.38; font-weight: 800; margin: 0 0 12px; }
.eyebrow { display: block; font-size: 13px; line-height: 20px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; margin: 0 0 12px; }
.lede, .sec-lede { font-size: clamp(17px, 1.4vw, 19px); line-height: 1.7; color: var(--color-ink-2); max-width: 46em; margin: 16px 0 0; }
.hero { padding: clamp(32px, 4vw, 56px) 0 clamp(8px, 1.5vw, 16px); }
.hero > * + * { margin-top: 14px; }
.sec { padding-top: var(--layout-sec); }
.hero + .sec { padding-top: clamp(16px, 2vw, 24px); }
.sec-head { margin-bottom: 24px; max-width: 52em; }
p { margin: 0 0 12px; max-width: 72em; }
ul, ol { padding-left: 1.4em; }
li { margin: 4px 0; }
.qualifier { font-size: 14px; color: var(--color-ink-2); border-left: 4px solid var(--status-estimated); padding-left: 12px; margin: 16px 0; }
.callout { border-top: 4px solid var(--color-accent); background: var(--color-surface-alt); padding: 24px 28px; margin: 24px 0; }
.callout p:last-child { margin-bottom: 0; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 28px; font: inherit; font-weight: 800; font-size: 16px; text-decoration: none; cursor: pointer; border: 2px solid var(--color-strong); background: var(--color-strong); color: var(--color-surface); border-radius: 0; transition: background .2s, color .2s, border-color .2s; white-space: nowrap; }
.btn:hover { background: var(--color-accent); border-color: var(--color-accent); color: var(--color-on-accent); }
.btn-secondary { background: transparent; color: var(--color-ink); }
.btn-secondary:hover { background: var(--color-strong); color: var(--color-surface); border-color: var(--color-strong); }
.btn-compact { min-height: 44px; padding: 0 18px; font-size: 14px; }
.actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 16px; }

.grid-2, .grid-3 { display: grid; gap: 24px; margin: 0 0 8px; }
.grid-2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); }
.grid-3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
.card { background: var(--color-surface-alt); border-top: 4px solid var(--color-strong); padding: 28px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.card > * { margin: 0; }
.card.accent { border-top-color: var(--color-accent); }
.card .eyebrow { margin: 0; }
.card h3 { margin: 0; }
.card ul, .card ol { margin: 0; }
.chip-num { font-weight: 300; font-size: clamp(36px, 4vw, 56px); line-height: 1; letter-spacing: -.03em; }
.steps { counter-reset: s; list-style: none; padding: 0; margin: 0; }
.steps li { counter-increment: s; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 16px; padding: 14px 0; border-top: 1px solid var(--color-line); }
.steps li::before { content: counter(s, decimal-leading-zero); font-family: var(--font-data); font-weight: 700; color: var(--color-accent); font-size: 18px; }
dl.kv { display: grid; grid-template-columns: minmax(10em, 16em) minmax(0, 1fr); margin: 0; border-top: 2px solid var(--color-strong); }
dl.kv dt { font-size: 13px; font-weight: 800; color: var(--color-ink-3); padding: 10px 16px 10px 0; border-bottom: 1px solid var(--color-line); }
dl.kv dd { margin: 0; padding: 10px 0; border-bottom: 1px solid var(--color-line); font-weight: 600; }
.tablewrap { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; font-size: 15px; margin: 0 0 16px; }
th, td { text-align: left; padding: 12px 16px 12px 0; border-bottom: 1px solid var(--color-line); vertical-align: top; }
th { font-size: 13px; font-weight: 800; color: var(--color-ink-3); border-bottom: 2px solid var(--color-strong); white-space: nowrap; }
th:last-child, td:last-child { padding-right: 0; }
code, pre { font-family: var(--font-data); font-size: .9em; }
pre { background: var(--color-surface-alt); padding: 16px 20px; overflow-x: auto; border-left: 4px solid var(--color-strong); }
code { background: var(--color-surface-alt); padding: 1px 5px; }
pre code { background: none; padding: 0; }
.ext::after { content: " ↗"; font-size: .8em; }
.tag { display: inline-flex; align-items: center; font-size: 11.5px; font-weight: 800; line-height: 1; padding: 4px 6px; background: var(--color-surface-alt); color: var(--color-ink-2); white-space: nowrap; }

footer.site { border-top: 4px solid var(--color-strong); padding: 48px 0 32px; font-size: 14px; }
footer.site .fgrid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 3fr) minmax(0, 5fr); gap: 32px; }
footer.site h2 { font-size: 15px; font-weight: 800; margin: 0 0 10px; }
footer.site ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
footer.site ul a { text-decoration: none; font-weight: 600; }
footer.site .legend li { display: flex; align-items: center; gap: 8px; color: var(--color-ink-2); font-size: 13px; }
footer.site .legal { border-top: 1px solid var(--color-line); margin-top: 32px; padding-top: 20px; color: var(--color-ink-2); font-size: 13px; }

/* 状态页 */
.status-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 16px; }
.statebar { display: flex; height: 14px; gap: 3px; margin-top: 8px; }
.statebar span { display: block; min-width: 3px; }
.statebar .s-confirmed { background: var(--status-confirmed); }
.statebar .s-estimated { background-color: var(--status-estimated-bg); background-image: var(--status-estimated-hatch); border: 1.3px dashed var(--status-estimated-border); }
.statebar .s-unverified { background: transparent; border: 1.3px solid var(--status-unverified-border); }
.health { font-size: 12.5px; font-weight: 800; padding: 2px 8px; background: var(--color-surface-alt); white-space: nowrap; }
.health.h-ok { box-shadow: inset 3px 0 0 var(--status-confirmed); }
.health.h-stopped { box-shadow: inset 3px 0 0 var(--color-accent); }
.health.h-failed, .health.h-running { box-shadow: inset 3px 0 0 var(--status-estimated); }

@media (max-width: 1000px) { footer.site .fgrid { grid-template-columns: 1fr 1fr; } .wordmark-sub { display: none; } }
@media (max-width: 760px) {
  .alert .wrap > span:not(.alert-k) { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .alert a { margin-left: 0; }
  .utility .right { display: none; }
  dl.kv { grid-template-columns: minmax(0, 1fr); }
  dl.kv dt { border-bottom: 0; padding-bottom: 0; }
  footer.site .fgrid { grid-template-columns: 1fr; }
  .card { padding: 20px; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }

/* 暗色: 官网暗色灰阶对卡片过亮, 由同一组语义令牌混出更低的抬升层 (与控制台一致) */
:root[data-theme="dark"] {
  --color-surface-alt: color-mix(in srgb, var(--color-ink) 9%, var(--color-surface));
  --color-line: color-mix(in srgb, var(--color-ink) 22%, var(--color-surface));
  --color-ink-3: color-mix(in srgb, var(--color-ink) 62%, var(--color-surface));
  --color-ink-2: color-mix(in srgb, var(--color-ink) 84%, var(--color-surface));
}
.actions .btn { min-height: 48px; }
.card > .badge { align-self: flex-start; }