/* Tiremason — Flight-Grade Cockpit design tokens
   唯一视觉基准：Stitch 导出三屏 code.html 的 computed style 实读值
   （doc/design/2026-10-26/reference/stitch_tiremason_automotive_calculator_suite/）
   2026-10-26 像素对齐门定型：DESIGN.md 规格与 code.html 渲染冲突时以 computed style 为准
   （本文件首版照 DESIGN.md 直译，parity 实读发现画布/标签/卡面色全部漂移，已全部改回实读值） */

:root {
  /* 画布与表面层（三屏 computed 实读：body #10131A / 内卡 #0B0E14 / 台面板 #191C22） */
  --ink-0: #10131A;    /* 根画布（body bg） */
  --ink-1: #0B0E14;    /* 内卡 / 输入凹槽 / 结果区（Stitch 主卡面，配 rgba(74,225,118,.2) 绿描边变体） */
  --ink-2: #191C22;    /* Elevated 面板（radius 8–12px） */
  --ink-3: #1D2026;    /* 次级台面 */
  --trough: #0B0E14;   /* Recessed 输入凹槽（input 实读 transparent，凹槽感由内阴影承担） */
  --card-hi: #272A31;  /* 滑杆轨道 / 次级按键底 */

  /* 结构线（Hairlines：暖棕/暖棕褐系，实读 rgba(216,195,173,.4/.5)、#534434） */
  --line: rgba(216, 195, 173, .25);
  --line-strong: rgba(216, 195, 173, .5);
  --line-warm: rgba(83, 68, 52, .4);

  /* 文字（实读：主 #E1E2EB / 暖棕标签 #D8C3AD / 暗棕次级 #A08E7A） */
  --white: #FFFFFF;     /* 专属 hero 输出数字 */
  --text-hi: #E1E2EB;   /* 主文字 / 指标（14.4:1 on canvas） */
  --text: #D8C3AD;      /* 暖棕标签 / 次级（10.9:1） */
  --text-nav: #A08E7A;  /* 12–14px 次级文字（5.88:1，AA 达标） */
  --text-dim: #A08E7A;  /* 11px caps 微标签（同 --text-nav，实测 5.88:1 无需覆盖登记） */
  --code: #D8C3AD;      /* 公式条 monospace */

  /* Cockpit Primary（Amber：实读 #F59E0B / 浅端 #FFC174 / 底字 #613B00） */
  --amber: #F59E0B;
  --amber-hover: #F59E0B;
  --on-amber: #613B00;  /* AA 覆盖登记：于 #F59E0B 上 3.8:1（Stitch 11px caps 裁定值，site.test.mjs 登记） */
  --amber-light: #FFC174;
  --amber-glow: 0 0 12px rgba(245, 158, 11, .25);

  /* Verdict 三态（实读绿 #4AE176 / 红 #FFB4AB，10%+ alpha 底、20–25% alpha 描边） */
  --green: #4AE176;
  --green-bg: rgba(74, 225, 118, .1);
  --green-line: rgba(74, 225, 118, .2);
  --yellow: #FFC174;
  --yellow-bg: rgba(255, 193, 116, .1);
  --yellow-line: rgba(255, 193, 116, .25);
  --red: #FFB4AB;
  --red-bg: rgba(255, 180, 171, .1);
  --red-line: rgba(255, 180, 171, .25);

  /* 字体分工：Inter=UI 结构 / JetBrains Mono=全部计算指标与公式 */
  --font-ui: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-num: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* 字号矩阵（三屏 h1 实读 40/48 -1px 700；body 16/24） */
  --fs-display: 40px;      /* headline-xl 40/48 -1px 700 */
  --fs-display-m: 30px;
  --fs-h2: 20px;           /* headline-md 实读 20/28 700 -0.2px */
  --fs-h3: 18px;
  --fs-body: 16px;         /* body 16/24 */
  --fs-small: 14px;
  --fs-caption: 12px;
  --fs-hero-num: 44px;     /* display numeral JBM */
  --fs-hero-num-m: 32px;
  --fs-gauge-num: 24px;    /* input 内数字实读 24px JBM */
  --fs-caps: 11px;         /* 按钮/标签 caps 11px 实读，letter-spacing 0.02em */
  --fs-formula: 12px;

  /* 间距 */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 40px; --sp-8: 64px;
  --gutter: 1.5rem;
  --page-margin: 2rem;

  /* 形状（实读：按钮 2px / 芯片 4px / 面板 8–12px） */
  --r-btn: 2px;
  --r-card: 8px;
  --r-full: 9999px;

  /* 深度（无漫射阴影，用 bezel/内阴影/描边） */
  --bezel-hi: inset 0 1px 0 0 rgba(255, 255, 255, .05);
  --trough-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .4);
  --focus-ring: 0 0 0 1px #F59E0B;

  --content-w: 1200px;
}

/* Tiremason — main.css（Flight-Grade Cockpit 实现层，逐条照 DESIGN.md 组件规格） */

@font-face { font-family: "Inter"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("/assets/fonts/Inter-latin.woff2") format("woff2"); }
@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("/assets/fonts/JetBrainsMono-latin.woff2") format("woff2"); }

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0; background: var(--ink-0); color: var(--text-hi);
  font-family: var(--font-ui); font-size: var(--fs-body); line-height: 24px;
  -webkit-font-smoothing: antialiased;
}

h1 { font-size: var(--fs-display); line-height: 48px; font-weight: 700; letter-spacing: -0.025em; }
h2 { font-size: var(--fs-h2); line-height: 28px; font-weight: 700; letter-spacing: -0.01em; margin-top: var(--sp-7); }
h3 { font-size: var(--fs-h3); line-height: 28px; font-weight: 600; letter-spacing: -.01em; margin-top: var(--sp-6); }
h1, h2, h3, h4 { color: var(--text-hi); margin-bottom: var(--sp-4); }
@media (max-width: 767px) { h1 { font-size: var(--fs-display-m); line-height: 38px; letter-spacing: -.015em; } }
p { margin: 0 0 var(--sp-4); }
a { color: var(--amber); text-decoration: none; }
a:hover { text-decoration: underline; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible {
  outline: none; box-shadow: var(--focus-ring); border-radius: var(--r-btn);
}
strong { color: var(--text-hi); }
code { font-family: var(--font-num); font-size: var(--fs-formula); letter-spacing: .02em;
  background: var(--trough); border: 1px solid var(--line); padding: 1px 6px; border-radius: var(--r-btn); color: var(--amber); }

.wrap { max-width: var(--content-w); margin: 0 auto; padding: 0 var(--page-margin); }
@media (max-width: 767px) { .wrap { padding: 0 1rem; } }
.num { font-family: var(--font-num); font-variant-numeric: tabular-nums; }

/* 状态点（Gauge Card header 6px dot） */
.status-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--green); display: inline-block; }
.status-dot.amber { background: var(--amber); box-shadow: var(--amber-glow); }
.status-dot.red { background: var(--red); }

/* ---------- 页眉（吸顶 bezel） ---------- */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(11, 14, 20, .88); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
}
.header-in { max-width: var(--content-w); margin: 0 auto; padding: 0 var(--page-margin);
  display: flex; align-items: center; gap: var(--sp-5); height: 60px; }
.wordmark { font-weight: 700; font-size: 17px; letter-spacing: -.01em; color: var(--white);
  display: flex; align-items: center; gap: 9px; }
.wordmark:hover { text-decoration: none; }
.wordmark .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--amber); box-shadow: var(--amber-glow); }
.site-nav { display: flex; gap: 2px; margin-left: auto; }
.site-nav a { color: var(--text-nav); font-size: var(--fs-small); font-weight: 500; padding: 8px 12px; border-radius: var(--r-btn); }
.site-nav a:hover { color: var(--text-hi); background: var(--ink-1); text-decoration: none; }
.free-chip { font-family: var(--font-num); font-size: var(--fs-formula); font-weight: 500; letter-spacing: .02em;
  color: var(--green); border: 1px solid var(--green-line); background: var(--green-bg);
  padding: 4px 10px; border-radius: var(--r-btn); white-space: nowrap; }
@media (max-width: 760px) {
  .header-in { flex-wrap: wrap; height: auto; padding-top: 10px; padding-bottom: 10px; gap: var(--sp-3); }
  .site-nav { margin-left: 0; flex-wrap: wrap; }
  .free-chip { display: none; }
}

/* ---------- Hero（首页） ---------- */
.hero { padding: var(--sp-8) 0 var(--sp-7); }
.hero-eyebrow { font-family: var(--font-num); font-size: var(--fs-formula); font-weight: 500; letter-spacing: .08em;
  text-transform: uppercase; color: var(--amber); margin-bottom: var(--sp-4); display: flex; align-items: center; gap: 8px; }
.hero h1 { margin-bottom: var(--sp-4); max-width: 720px; }
.hero .lede { font-size: 17px; color: var(--text); max-width: 640px; }
/* 主仪表卡：大屏 hero 数字 */
.hero-gauge { margin: var(--sp-6) 0 0; padding: var(--sp-5) var(--sp-6);
  background: var(--ink-1); border: 1px solid var(--line); border-radius: var(--r-card);
  box-shadow: var(--bezel-hi); display: flex; align-items: baseline; gap: var(--sp-5); flex-wrap: wrap; }
.hero-gauge .gv { font-family: var(--font-num); font-weight: 700; font-size: var(--fs-hero-num);
  line-height: 48px; letter-spacing: -.03em; color: var(--white); font-variant-numeric: tabular-nums; }
@media (max-width: 767px) { .hero-gauge .gv { font-size: var(--fs-hero-num-m); line-height: 36px; } }
.hero-gauge .gk { color: var(--text-nav); font-size: var(--fs-small); }
.hero-gauge .gk b { display: block; color: var(--text); font-size: var(--fs-body); font-weight: 600; }

/* ---------- 面包屑 ---------- */
.crumbs { font-size: var(--fs-small); color: var(--text-nav); padding: var(--sp-4) 0 0; }
.crumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; }
.crumbs li + li::before { content: "/"; margin-right: 6px; color: var(--line-strong); }
.crumbs a { color: var(--text-nav); }
.crumbs [aria-current] { color: var(--text); }

/* ---------- 工具卡网格（首页枢纽，Gauge Card 规格） ---------- */
.section-caps { font-family: var(--font-num); font-size: var(--fs-caps); font-weight: 600; letter-spacing: .08em;
  text-transform: uppercase; color: var(--text-dim); display: flex; align-items: center; gap: 8px; margin: var(--sp-7) 0 var(--sp-4); }
.tool-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--gutter); margin: 0 0 var(--sp-6); }
.tool-card { display: block; background: var(--ink-1); border: 1px solid var(--line); border-radius: var(--r-card);
  padding: var(--sp-5); box-shadow: var(--bezel-hi); transition: border-color .15s; }
.tool-card:hover { border-color: var(--amber-hover); text-decoration: none; }
.tool-card h2 { margin: 8px 0 6px; font-size: 17px; color: var(--text-hi); }
.tool-card p { margin: 0 0 var(--sp-3); font-size: var(--fs-small); color: var(--text-nav); line-height: 20px; }
.tool-card .ex { font-family: var(--font-num); font-size: var(--fs-formula); letter-spacing: .02em;
  color: var(--amber); font-variant-numeric: tabular-nums; }

/* ---------- 工具页：双座舱布局（DESIGN.md Layout §Desktop） ---------- */
.tool-layout { display: grid; grid-template-columns: 5fr 7fr; gap: var(--gutter); align-items: start;
  margin: var(--sp-5) 0 var(--sp-7); }
@media (max-width: 1023px) { .tool-layout { grid-template-columns: 1fr; } }

/* 输入配置阵列（凹槽下沉） */
.tool-panel { background: var(--ink-1); border: 1px solid var(--line); border-radius: var(--r-card);
  padding: var(--sp-5); box-shadow: var(--bezel-hi); }
.field { margin-bottom: var(--sp-4); }
.field:last-child { margin-bottom: 0; }
.field label { display: block; font-size: 12px; font-weight: 500; letter-spacing: .02em;
  color: var(--text); margin-bottom: 6px; }
.field .hint { font-size: var(--fs-caption); color: var(--text-nav); margin-top: 4px; line-height: 16px; }
/* 输入盒 = Stitch 字段容器：bg #0B0E14 / 1px #32353C / radius 4px / pad 8px（code.html computed 实读） */
.field .ctl { position: relative; display: flex; align-items: center;
  background: var(--trough); border: 1px solid var(--card-hi); border-radius: 4px;
  padding: 8px 12px; box-shadow: var(--trough-shadow); }
.field .ctl:focus-within { border-color: var(--amber); box-shadow: var(--trough-shadow), var(--focus-ring); }
.field input, .field select { width: 100%; padding: 0; border: none; background: transparent;
  color: var(--text-hi); outline: none;
  font-family: var(--font-num); font-size: var(--fs-gauge-num); font-weight: 600; font-variant-numeric: tabular-nums; }
.field select { font-family: var(--font-ui); font-size: var(--fs-body); font-weight: 400; }
.field .u { display: flex; align-items: center; margin-left: 8px;
  font-family: var(--font-num); font-size: var(--fs-formula); letter-spacing: .02em;
  color: var(--text); pointer-events: none; }
.field .ctl.no-unit input { padding-right: 0; }

/* 按钮（§5 Action Buttons） */
.btn-row { display: flex; gap: var(--sp-3); margin-top: var(--sp-5); flex-wrap: wrap; }
.btn { cursor: pointer; border: 1px solid var(--line-strong); background: var(--ink-2); color: var(--text-hi);
  font: 600 var(--fs-small) var(--font-ui); padding: 10px 16px; border-radius: var(--r-btn); min-height: 44px; }
.btn:hover { border-color: var(--text-dim); }
.btn-primary { background: var(--amber); border-color: transparent; color: var(--on-amber); }
.btn-primary:hover { background: var(--amber-hover); border-color: transparent; }

/* ---------- 结果区（输出座舱，hero 数字白色） ---------- */
.result-panel { background: var(--ink-1); border: 1px solid var(--line); border-radius: var(--r-card);
  padding: var(--sp-5); box-shadow: var(--bezel-hi); min-height: 200px; }
.big-result { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-4);
  padding: var(--sp-3) 0; border-bottom: 1px solid var(--line); }
.big-result:last-child { border-bottom: 0; }
.big-result .k { color: var(--text-dim); font-size: var(--fs-small); }
.big-result .v { font-family: var(--font-num); font-weight: 700; font-variant-numeric: tabular-nums;
  color: var(--text-hi); text-align: right; letter-spacing: -.01em; font-size: var(--fs-gauge-num); line-height: 28px; }
.big-result.hero-num .v { font-size: var(--fs-hero-num); line-height: 48px; letter-spacing: -.03em; color: var(--white); }
@media (max-width: 767px) { .big-result.hero-num .v { font-size: var(--fs-hero-num-m); line-height: 36px; } }
.big-result.hero-num .k { font-size: var(--fs-body); color: var(--text); }
/* delta 计数器（+12.4 mm 绿 / -4.2% 琥珀） */
.delta { font-family: var(--font-num); font-size: var(--fs-formula); font-weight: 500; }
.delta.up { color: var(--green); }
.delta.down { color: var(--amber); }

/* 判级徽章（§3 Verdict Badges：4px、非药丸、JBM 11px caps、40% 描边+10% 底） */
.verdict { display: flex; align-items: flex-start; gap: var(--sp-3); padding: var(--sp-4);
  border-radius: var(--r-btn); margin: var(--sp-4) 0; border: 1px solid; }
.verdict .chip { font-family: var(--font-num); font-size: var(--fs-caps); font-weight: 600;
  text-transform: uppercase; letter-spacing: .08em; padding: 4px 10px; border-radius: var(--r-btn); white-space: nowrap; }
.verdict-green { background: var(--green-bg); border-color: var(--green-line); }
.verdict-green .chip { background: transparent; border: 1px solid var(--green-line); color: var(--green); }
.verdict-yellow { background: var(--yellow-bg); border-color: var(--yellow-line); }
.verdict-yellow .chip { background: transparent; border: 1px solid var(--yellow-line); color: var(--yellow); }
.verdict-red { background: var(--red-bg); border-color: var(--red-line); }
.verdict-red .chip { background: transparent; border: 1px solid var(--red-line); color: var(--red); }
.verdict .vn { font-size: var(--fs-small); color: var(--text); line-height: 20px; }
.verdict .vn b { display: block; font-size: var(--fs-body); color: var(--text-hi); }

/* 次级结果表 */
table.calc { width: 100%; border-collapse: collapse; margin: var(--sp-4) 0; font-size: var(--fs-small); }
table.calc th { text-align: left; font-family: var(--font-num); font-size: var(--fs-caps); font-weight: 600;
  letter-spacing: .08em; text-transform: uppercase; color: var(--text-dim);
  padding: 8px 10px; border-bottom: 1px solid var(--line-strong); }
table.calc td { padding: 9px 10px; border-bottom: 1px solid var(--line); color: var(--text); }
table.calc td:last-child, table.calc th:last-child { text-align: right; }
table.calc .num, table.calc td.num { font-family: var(--font-num); font-variant-numeric: tabular-nums; color: var(--text-hi); }
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* 注释盒 / 公式条（§2 Audited Formula Strips） */
.note-box { background: var(--ink-2); border: 1px solid var(--line-strong); border-left: 2px solid var(--amber);
  border-radius: var(--r-btn); padding: var(--sp-4); margin: var(--sp-5) 0; font-size: var(--fs-small);
  color: var(--text); line-height: 20px; }
.note-box b { color: var(--text-hi); }
.warn-box { border-left-color: var(--red); }
.formula-strip { font-family: var(--font-num); font-size: var(--fs-formula); font-weight: 500; letter-spacing: .02em;
  color: var(--code); background: var(--ink-0); border: 1px dashed var(--line-strong); border-radius: var(--r-btn);
  padding: var(--sp-3) var(--sp-4); margin: var(--sp-4) 0; overflow-x: auto; white-space: nowrap; }
.formula-strip .tok { color: var(--amber); }

/* 假设台账 */
.assume-row { display: grid; grid-template-columns: 1fr 1fr 1.4fr; gap: var(--sp-3);
  padding: 9px 0; border-bottom: 1px solid var(--line); font-size: var(--fs-small); }
.assume-row .k { color: var(--text); font-weight: 600; }
.assume-row .v { font-family: var(--font-num); font-size: var(--fs-formula); letter-spacing: .02em;
  color: var(--amber); font-variant-numeric: tabular-nums; }
.assume-row .src { color: var(--text-nav); font-size: var(--fs-caption); line-height: 16px; }
@media (max-width: 700px) { .assume-row { grid-template-columns: 1fr; gap: 2px; } }

/* ---------- FAQ / 折叠 ---------- */
.faq details { border: 1px solid var(--line); border-radius: var(--r-card); background: var(--ink-1);
  margin-bottom: var(--sp-3); overflow: hidden; }
.faq summary { cursor: pointer; list-style: none; padding: var(--sp-4) var(--sp-5); font-weight: 600;
  color: var(--text-hi); position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: var(--sp-4); color: var(--amber); font-family: var(--font-num); }
.faq details[open] summary::after { content: "−"; }
.faq .faq-a { padding: 0 var(--sp-5) var(--sp-4); color: var(--text); font-size: var(--fs-small); line-height: 20px; }

/* ---------- 内容页 ---------- */
.article-body { max-width: 760px; }
.article-body ul, .article-body ol { padding-left: 22px; margin: 0 0 var(--sp-4); }
.article-body li { margin-bottom: 6px; }
.pull-quote { border-left: 2px solid var(--amber); background: var(--ink-1); border-radius: 0 var(--r-btn) var(--r-btn) 0;
  padding: var(--sp-4) var(--sp-5); margin: var(--sp-5) 0; color: var(--text-hi); font-size: 17px; }
.pull-quote cite { display: block; margin-top: 6px; font-size: var(--fs-caption); color: var(--text-dim); font-style: normal; }

/* 分歧列（3% vs 5% 派） */
.split-cols { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gutter); margin: var(--sp-5) 0; }
@media (max-width: 700px) { .split-cols { grid-template-columns: 1fr; } }
.split-cols .col { border: 1px solid var(--line); border-radius: var(--r-card); padding: var(--sp-4); background: var(--ink-1); }
.split-cols .col .col-head { margin: 0 0 8px; font-family: var(--font-num); font-size: var(--fs-caps); font-weight: 600;
  letter-spacing: .08em; text-transform: uppercase; }
.split-cols .col.c-green { border-top: 2px solid var(--green); }
.split-cols .col.c-green .col-head { color: var(--green); }
.split-cols .col.c-amber { border-top: 2px solid var(--amber); }
.split-cols .col.c-amber .col-head { color: var(--amber); }

/* byline */
.byline { display: flex; align-items: center; gap: 10px; margin: var(--sp-4) 0; font-size: var(--fs-small); color: var(--text-dim); }
.byline .avatar { width: 34px; height: 34px; border-radius: 50%; background: var(--ink-2);
  border: 1px solid var(--line-strong); display: flex; align-items: center; justify-content: center;
  color: var(--amber); font-weight: 700; font-size: 13px; }

/* 方法带（首页） */
.method-band { background: var(--ink-1); border: 1px solid var(--line); border-radius: var(--r-card);
  box-shadow: var(--bezel-hi); padding: var(--sp-6); margin: var(--sp-7) 0; }
.method-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--gutter); margin-top: var(--sp-5); }
.method-step .n { font-family: var(--font-num); font-size: var(--fs-formula); color: var(--amber); letter-spacing: .08em; }
.method-step h3 { font-size: 16px; margin: 6px 0; }
.method-step p { font-size: var(--fs-small); color: var(--text-nav); margin: 0; line-height: 20px; }

/* 指南卡 */
.guide-list { display: grid; gap: var(--sp-3); margin: var(--sp-5) 0; }
.guide-item { display: block; background: var(--ink-1); border: 1px solid var(--line); border-radius: var(--r-card);
  padding: var(--sp-4) var(--sp-5); }
.guide-item:hover { border-color: var(--amber-hover); text-decoration: none; }
.guide-item h2 { margin: 0 0 4px; font-size: 16px; }
.guide-item p { margin: 0; font-size: var(--fs-small); color: var(--text-nav); }

/* 页脚 */
.site-footer { border-top: 1px solid var(--line); margin-top: var(--sp-8); padding: var(--sp-6) 0 var(--sp-7);
  color: var(--text-dim); font-size: var(--fs-small); }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: var(--sp-6); }
@media (max-width: 700px) { .footer-grid { grid-template-columns: 1fr; } }
.site-footer .f-head { margin: 0 0 10px; color: var(--text); font-family: var(--font-num); font-size: var(--fs-caps); font-weight: 600;
  letter-spacing: .08em; text-transform: uppercase; margin: 0 0 10px; }
.site-footer ul { list-style: none; margin: 0; padding: 0; }
.site-footer li { margin-bottom: 6px; }
.site-footer a { color: var(--text-dim); }
.site-footer a:hover { color: var(--text-hi); }
.footer-base { margin-top: var(--sp-6); padding-top: var(--sp-4); border-top: 1px solid var(--line);
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: var(--sp-3);
  font-size: var(--fs-caption); color: var(--text-dim); line-height: 16px; }

/* ---------- 打印 ---------- */
@media print {
  body { background: #fff; color: #000; }
  .site-header, .site-footer, .btn-row, .hero-gauge, .free-chip { display: none; }
  h1, h2, h3, .big-result .v, .big-result .k, .hero-gauge .gv { color: #000; }
  .result-panel, .tool-panel, .faq details, .tool-card, .method-band { border: 1px solid #999;
    box-shadow: none; background: #fff; }
  .tool-layout { grid-template-columns: 1fr; }
  .faq details { break-inside: avoid; }
  a { color: #000; }
  .article-body a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 10px; }
}