/* ==========================================================================
   B2B 营销体检 · 报告页样式（8 模块 + 执行摘要 + 陪跑服务页 + 末页服务卡 + 7 份附录）
   --------------------------------------------------------------------------
   只服务 js/report.js 渲染出来的 DOM（前缀 r- / rd- / report- / toc-）。
   通用件（.btn / .ic / .mono / .container / .icon-btn / .no-print）在 css/main.css，
   这里不重复定义，只在需要覆盖时用更具体的选择器（例如 .app-header__btn）。

   改配色 / 字号 / 圆角 → 一律去 design/design-tokens.css 改变量，本文件不写裸色值
   （例外只有 #fff / #000）。报告专用变量（--report-pad / --blank-underline /
   --chart-* / --grade-* / --block-stop-* …）都已在那份文件里定义好了。

   排版纪律：
     · 报告是长文，正文行高用 --leading-body（1.8），中文行宽控制在 ~38 字
     · 「卷首语 / 结论摘要」这类要正式感的段落用衬线（--font-serif）
     · 数字（分数、权重、百分比、编号）一律 .mono 等宽对齐
     · 动效只做 transform / opacity，包在 prefers-reduced-motion 里，禁止弹跳缓动
   ========================================================================== */

/* ==========================================================================
   1. 屏幕外壳与报告纸
   ========================================================================== */
.screen--report {
  background: var(--bg);
  padding-bottom: var(--space-20);
  /* 手机上有底部固定操作条，正文要给它让位，否则最后一行被压住 */
  padding-bottom: calc(var(--actionbar-h) + var(--space-12));
}
@media (min-width: 768px) {
  .screen--report { padding-bottom: var(--space-20); }
}

/* 桌面：左侧常驻目录 + 右侧正文；目录不挤窄正文（正文自己限宽 --container-read） */
.report-layout {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: var(--space-8) var(--container-gutter) 0;
}

@media (min-width: 1024px) {
  .report-layout {
    display: grid;
    grid-template-columns: 208px minmax(0, 1fr);
    gap: var(--space-10);
    align-items: start;
    padding-top: var(--space-10);
  }
}

/* 报告纸：白底 + 1px 边框（Hairline First，不加模糊阴影） */
.report-paper {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-xl);
  padding: var(--report-pad);
  max-width: var(--container-read);
}
@media (min-width: 1024px) {
  .report-paper { padding: var(--space-12) var(--space-10); }
}

/* 锚点跳转后标题不被 sticky 顶栏盖住 */
.r-sec { scroll-margin-top: calc(var(--header-h) + var(--space-4)); }

/* ==========================================================================
   2. 节内锚点导航
   --------------------------------------------------------------------------
   桌面（≥1024px）：左侧 sticky 列表，常驻。
   平板/手机：不常驻，改成底部固定条里的「目录」按钮 → 从底部弹出的面板。
   ========================================================================== */
.report-toc { display: none; }

@media (min-width: 1024px) {
  .report-toc {
    display: block;
    position: sticky;
    top: calc(var(--header-h) + var(--space-6));
    align-self: start;
    padding: var(--space-4) 0;
    border-left: 1px solid var(--border);
  }
}
.report-toc__title {
  padding-left: var(--space-4);
  font-size: var(--text-2xs);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-caps);
  color: var(--meta);
}
.report-toc__list { margin-top: var(--space-3); }
.report-toc__link {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  width: 100%;
  min-height: var(--tap-min);
  padding: 0 var(--space-4);
  background: none;
  border: none;
  border-left: 2px solid transparent;
  text-align: left;
  color: var(--muted);
  font-size: var(--text-sm);
  line-height: var(--leading-snug);
  transition: color var(--dur-fast) var(--ease-standard),
              background var(--dur-fast) var(--ease-standard);
}
.report-toc__link:hover { color: var(--fg); background: var(--surface-warm); }
.report-toc__link:focus-visible { box-shadow: var(--focus-ring); }
.report-toc__no {
  flex: none;
  font-size: var(--text-2xs);
  color: var(--meta);
}
.report-toc__txt { flex: 1 1 auto; }

/* ---------- 底部弹出的目录面板（手机 / 平板） ---------- */
.toc-sheet { position: fixed; inset: 0; z-index: var(--z-modal); }
.toc-sheet[hidden] { display: none; }
.toc-sheet__scrim {
  position: absolute;
  inset: 0;
  background: var(--overlay-scrim);
}
.toc-sheet__panel {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  max-height: 76%;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background: var(--overlay-panel-bg);
  border-top: 1px solid var(--border);
  border-radius: var(--radius-xl) var(--radius-xl) 0 0;
  box-shadow: var(--elev-3);
  padding: var(--space-3) 0 calc(var(--space-8) + env(safe-area-inset-bottom, 0px));
}
.toc-sheet__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-1) var(--space-4) var(--space-2);
  border-bottom: 1px solid var(--border-soft);
}
.toc-sheet__title {
  font-size: var(--text-md);
  font-weight: var(--weight-medium);
  color: var(--fg);
}
.toc-sheet__list { padding: var(--space-2) 0; }
.toc-sheet__link {
  display: flex;
  align-items: baseline;
  gap: var(--space-3);
  width: 100%;
  min-height: var(--tap-min);
  padding: 0 var(--space-5);
  background: none;
  border: none;
  text-align: left;
  color: var(--fg-2);
  font-size: var(--text-base);
}
.toc-sheet__link:hover,
.toc-sheet__link:focus-visible { background: var(--surface-warm); }

/* ---------- 手机底部固定操作条（目录 / 复制 / 顶部） ---------- */
.report-mobile-bar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: var(--z-actionbar);
  display: flex;
  gap: var(--space-1);
  background: var(--surface);
  border-top: 1px solid var(--border);
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
@media (min-width: 768px) {
  .report-mobile-bar { display: none; }
}
.report-mobile-bar__btn {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-height: var(--actionbar-h);
  background: none;
  border: none;
  color: var(--fg-2);
  font-size: var(--text-2xs);
}
.report-mobile-bar__btn .ic { color: var(--muted); }
.report-mobile-bar__btn:hover { background: var(--surface-warm); }
.report-mobile-bar__btn:focus-visible { box-shadow: var(--focus-ring); }

/* ==========================================================================
   3. 顶栏右侧的三枚报告工具（下载 / 打印 / 复制）
   ========================================================================== */
.app-header__tools { display: flex; align-items: center; gap: var(--space-1); }
.app-header__tools[hidden] { display: none; }
.app-header__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--tap-min);
  height: var(--tap-min);
  background: none;
  border: none;
  border-radius: var(--radius-sm);
  color: var(--muted);
}
.app-header__btn:hover { color: var(--fg); background: var(--surface-warm); }
.app-header__btn:focus-visible { box-shadow: var(--focus-ring); }

/* ==========================================================================
   4. 节的外壳
   ========================================================================== */
.r-sec { padding-top: var(--space-10); margin-top: var(--space-10); border-top: 1px solid var(--border-soft); }
.r-sec__head { display: flex; align-items: baseline; gap: var(--space-3); }
.r-sec__no {
  flex: none;
  font-size: var(--text-2xs);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-caps);
  color: var(--meta);
}
.r-sec__title {
  font-size: var(--text-xl);
  font-weight: var(--weight-bold);
  line-height: var(--leading-snug);
  letter-spacing: var(--tracking-tight);
  color: var(--brand-900);
}
.r-sec__sub { margin-top: var(--space-2); font-size: var(--text-sm); color: var(--muted); line-height: var(--leading-normal); }
.r-sec__lead { margin-top: var(--space-4); font-size: var(--text-base); line-height: var(--leading-body); color: var(--fg-2); }
.r-sub {
  margin-top: var(--space-8);
  font-size: var(--text-md);
  font-weight: var(--weight-medium);
  color: var(--fg);
}

/* ==========================================================================
   5. 红线横幅（只在命中时出现，报告最顶部）
   ========================================================================== */
.r-redline-banner {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  margin-bottom: var(--space-6);
  padding: var(--space-4);
  background: var(--banner-redline-bg);
  border: 1px solid var(--banner-redline-line);
  border-radius: var(--radius-lg);
  color: var(--banner-redline-fg);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  line-height: var(--leading-normal);
}

/* 横幅两行时的容器：第一行是「必须先处理的风险：X」，第二行是「性质不是名次」那句
   说明（事故 RPT-20260919-ZWAD 补的）。外层已经是 flex row，这里再套一层列向，
   说明才会换到第二行，而不是挤在标题右边。 */
.r-redline-banner__col {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-width: 0;
}
/* 说明句比标题弱一档：它解释的是排序口径，不该抢标题的注意力。 */
.r-redline-banner__note {
  font-weight: var(--weight-regular);
  opacity: .85;
}

/* 结论标签：强项 / 待改进 / 风险（颜色来自 design-tokens 的 --tag-*） */
.r-tag {
  display: inline-block;
  padding: 2px var(--space-2);
  border-radius: var(--radius-sm);
  font-size: var(--text-2xs);
  font-weight: var(--weight-medium);
  line-height: 1.6;
  white-space: nowrap;
}
.r-tag.is-good { background: var(--tag-good-bg); color: var(--tag-good-fg); }
.r-tag.is-mid { background: var(--tag-mid-bg); color: var(--tag-mid-fg); }
.r-tag.is-risk { background: var(--tag-risk-bg); color: var(--tag-risk-fg); }

/* ==========================================================================
   6. 封面（模块 0）：四要素
   ========================================================================== */
.r-cover { padding-top: var(--space-6); margin-top: 0; border-top: none; }

.r-cover__meta {
  padding-bottom: var(--space-5);
  border-bottom: 1px solid var(--border);
}
.r-cover__kicker {
  font-size: var(--text-2xs);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-caps);
  color: var(--brass-700);
}
/* 封面版本标记：模板标准版 / AI 版。只是自报家门，不抢主视觉。
   用铜黄描边的小标签，和 kicker 同一行，避免多出一行把封面撑高。 */
.r-cover__ver {
  display: inline-block;
  margin-left: var(--space-2);
  padding: 1px var(--space-2);
  border: 1px solid var(--brass-100);
  border-radius: var(--radius-sm);
  background: var(--brass-50);
  color: var(--brass-700);
  font-size: var(--text-2xs);
  letter-spacing: var(--tracking-caps);
}
.r-cover__company {
  margin-top: var(--space-2);
  font-size: var(--text-2xl);
  font-weight: var(--weight-bold);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: var(--brand-900);
}
.r-cover__id,
.r-cover__date { margin-top: var(--space-2); font-size: var(--text-xs); color: var(--meta); }
.r-cover__id .mono { color: var(--fg-2); letter-spacing: var(--tracking-caps); }
.r-cover__incap { margin-top: var(--space-3); font-size: var(--text-xs); color: var(--meta); line-height: var(--leading-normal); }

/* 要素外壳：一句话诊断 / 健康度 / 三件必做事 / 一件必须停的事 */
.r-elem { margin-top: var(--space-8); }
.r-elem__cap {
  font-size: var(--text-2xs);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-caps);
  color: var(--meta);
  padding-bottom: var(--space-2);
  border-bottom: 1px solid var(--border-soft);
}
/* 四个要素之间的节奏：一句话诊断紧跟封面标题，其余给足留白 */
.r-elem--oneliner { margin-top: var(--space-6); }
.r-elem--grade { margin-top: var(--space-8); }
.r-elem--three { margin-top: var(--space-10); }
.r-elem--stop { margin-top: var(--space-10); }

/* 要素 ① 一句话诊断：全报告最该被记住的一句，用衬线放大 */
.r-oneliner {
  margin-top: var(--space-4);
  font-family: var(--font-serif);
  font-size: var(--text-lg);
  line-height: var(--leading-snug);
  color: var(--brand-800);
}

/* 要素 ② 健康度 */
.r-grade { display: flex; align-items: center; gap: var(--space-5); margin-top: var(--space-4); }
.r-badge {
  flex: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: var(--grade-badge-d);
  height: var(--grade-badge-d);
  border-radius: 50%;
  border: 2px solid var(--border);
}
.r-badge__letter { font-size: var(--text-2xl); font-weight: var(--weight-bold); line-height: 1; }
.r-badge__word { font-size: var(--text-2xs); letter-spacing: var(--tracking-caps); }
.r-badge.is-a { background: var(--grade-a-bg); border-color: var(--grade-a-line); color: var(--grade-a-fg); }
.r-badge.is-b { background: var(--grade-b-bg); border-color: var(--grade-b-line); color: var(--grade-b-fg); }
.r-badge.is-c { background: var(--grade-c-bg); border-color: var(--grade-c-line); color: var(--grade-c-fg); }
.r-badge.is-d { background: var(--grade-d-bg); border-color: var(--grade-d-line); color: var(--grade-d-fg); }
.r-grade__txt { min-width: 0; }
.r-grade__score { font-size: var(--text-lg); font-weight: var(--weight-bold); color: var(--fg); }
.r-grade__word { margin-top: var(--space-1); font-size: var(--text-md); font-weight: var(--weight-medium); color: var(--fg-2); }
.r-grade__note { margin-top: var(--space-1); font-size: var(--text-xs); color: var(--muted); line-height: var(--leading-normal); }
.r-grade__cap {
  margin-top: var(--space-4);
  padding: var(--space-3) var(--space-4);
  background: var(--banner-redline-bg);
  border-left: 3px solid var(--banner-redline-fg);
  border-radius: var(--radius-sm);
  font-size: var(--text-xs);
  line-height: var(--leading-normal);
  color: var(--fg-2);
}

/* 封面上的五维迷你行：名称 / 权重 / 得分 */
.r-cover-dims {
  display: grid;
  gap: var(--space-1);
  margin-top: var(--space-5);
  padding-top: var(--space-4);
  border-top: 1px solid var(--border-soft);
}
.r-cover-dims li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 3.5rem 3rem;
  align-items: baseline;
  gap: var(--space-2);
  font-size: var(--text-sm);
  color: var(--fg-2);
}
.r-cover-dims__name { min-width: 0; }
.r-cover-dims__w { color: var(--meta); font-size: var(--text-xs); text-align: right; }
.r-cover-dims__v { font-weight: var(--weight-medium); color: var(--fg); text-align: right; }
.r-cover-dims li.is-capped .r-cover-dims__v,
.r-cover-dims li.is-capped .r-cover-dims__w { color: var(--warn); }

/* 要素 ③ 三件必做事（内容就是优先清单前 3 项，EARS-26） */
.r-three { margin-top: var(--space-4); display: grid; gap: var(--space-4); counter-reset: none; }
.r-three__item {
  display: grid;
  grid-template-columns: 1.75rem minmax(0, 1fr);
  column-gap: var(--space-3);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--border-soft);
}
.r-three__item:last-child { padding-bottom: 0; border-bottom: none; }
.r-three__no {
  grid-row: 1 / span 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  background: var(--accent-quiet);
  border: 1px solid var(--accent-line);
  color: var(--brand-700);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
}
.r-three__act {
  font-size: var(--text-md);
  font-weight: var(--weight-medium);
  line-height: var(--leading-snug);
  color: var(--fg);
}
.r-three__attrs { margin-top: var(--space-1); font-size: var(--text-xs); color: var(--muted); line-height: var(--leading-normal); }
.r-three__attrs b { color: var(--fg-2); font-weight: var(--weight-medium); }

/* 要素 ④ 一件必须停的事（铜黄 = 「这段要停工 / 要花钱」） */
.r-stop-brief {
  margin-top: var(--space-4);
  padding: var(--space-4);
  background: var(--block-stop-bg);
  border: 1px solid var(--block-stop-line);
  border-radius: var(--radius-lg);
}
.r-stop-brief__what {
  font-size: var(--text-md);
  font-weight: var(--weight-medium);
  line-height: var(--leading-snug);
  color: var(--block-stop-fg);
}
.r-stop-brief__why { margin-top: var(--space-2); font-size: var(--text-sm); line-height: var(--leading-body); color: var(--block-stop-fg); }
.r-stop-brief__restart {
  margin-top: var(--space-3);
  padding-top: var(--space-3);
  border-top: 1px dashed var(--block-stop-line);
  font-size: var(--text-xs);
  color: var(--block-stop-fg);
}
.r-stop-brief__restart b { font-weight: var(--weight-medium); }

/* ==========================================================================
   7. 执行摘要（附加页，纯规则拼装，零 AI）
   ========================================================================== */
.r-summary__tools { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-4); }
.r-summary__meta { margin-top: var(--space-4); font-size: var(--text-xs); color: var(--meta); }
.r-summary__block { margin-top: var(--space-6); }
.r-summary__h {
  font-size: var(--text-md);
  font-weight: var(--weight-medium);
  color: var(--brand-800);
  padding-bottom: var(--space-2);
  border-bottom: 1px solid var(--border-soft);
}
.r-summary__p {
  margin-top: var(--space-3);
  font-family: var(--font-serif);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--fg-2);
}
.r-summary__p--soft { font-family: var(--font-body); font-size: var(--text-sm); color: var(--muted); }
.r-summary__list { margin-top: var(--space-3); display: grid; gap: var(--space-2); padding-left: var(--space-5); list-style: decimal; }
.r-summary__list li {
  font-family: var(--font-serif);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--fg-2);
}
.r-summary__foot {
  margin-top: var(--space-6);
  padding-top: var(--space-4);
  border-top: 1px solid var(--border-soft);
  font-size: var(--text-xs);
  color: var(--meta);
}

/* ==========================================================================
   8. 表格（商业快照 / 预算 / 渠道分工 / 90 天方案 / 附录填空表）
   ========================================================================== */
.r-table {
  width: 100%;
  margin-top: var(--space-5);
  border-collapse: collapse;
  border: 1px solid var(--border);
  font-size: var(--text-sm);
}
.r-table th,
.r-table td {
  padding: var(--space-3) var(--space-4);
  text-align: left;
  vertical-align: top;
  line-height: var(--leading-normal);
  border-bottom: 1px solid var(--border-soft);
  color: var(--fg-2);
}
.r-table thead th {
  background: var(--surface-sunken);
  box-shadow: var(--elev-inset);
  border-bottom: 1px solid var(--border);
  font-size: var(--text-xs);
  font-weight: var(--weight-medium);
  color: var(--muted);
  white-space: nowrap;
}
.r-table tbody tr:last-child th,
.r-table tbody tr:last-child td { border-bottom: none; }
.r-table__k { font-weight: var(--weight-medium); color: var(--fg); white-space: nowrap; }
.r-table__v { color: var(--fg-2); }
.r-table__pct { text-align: right; white-space: nowrap; font-weight: var(--weight-medium); color: var(--fg); }
.r-table__act { color: var(--fg); font-weight: var(--weight-medium); }
.r-table__not { color: var(--muted); }

/* 商业快照：两列（项目 / 你的答案），项目列吃 1/3、答案列吃剩余宽度。
   项目列必须允许换行：最长的标签「近 12 个月营销投入 · 付费占比」有 15 字，
   nowrap + fixed 28% 装不下，会不换行向右溢出到值列正上方，
   把值的开头盖掉（线上实测「100 万以上 · 5%」被盖成「以上 · 5%」，
   多份报告都在，行 3 / 行 9 标签最长所以最明显）。 */
.r-table--facts { table-layout: fixed; }
.r-table--facts .r-table__k { width: 34%; white-space: normal; }

/* 90 天行动表：动作列最宽，其余三列窄列。
   必须 fixed + 表头定宽。auto 布局下三个 nowrap 单元格各自索要固有宽度，
   唯一可换行的动作列会被压成 min-content（实测 971px 的表里动作列只剩 65px，
   一字一行），而且整张表会宽出容器 333px 把卡片撑破。
   fixed 布局的列宽只认第一行单元格，所以宽度定在 thead th 上，定在 td 上无效。 */
@media (min-width: 768px) {
  .r-table--plan { table-layout: fixed; }
  .r-table--plan thead th:nth-child(1) { width: 40%; }
  .r-table--plan thead th:nth-child(2) { width: 16%; }
  .r-table--plan thead th:nth-child(3) { width: 18%; }
  .r-table--plan thead th:nth-child(4) { width: 26%; }
  .r-table--plan th, .r-table--plan td { white-space: normal; }
}

/* 窄屏下所有表格都可以横向滚动。
   为什么用一条通配规则而不是逐个变体列：附录的填空表（--fill）列宽由
   「＿＿＿＿＿＿」撑出来，列数一多必然超过 390px。之前只给 budget/channel
   列了白名单，结果 --fill 把页面撑破（scrollWidth 801 vs 视口 526）。
   通配后，将来新增任何表格都自动安全，不会再漏。 */
@media (max-width: 767px) {
  .r-table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .r-table td,
  .r-table th { min-width: 0; }
}

/* 附录填空表：可手写，格子要够高（打印时用 mm，见 design-tokens 的 @media print） */
.r-table--fill { border-color: var(--border-strong); }
.r-table--fill td { height: var(--cell-write-h); }
.r-table--fill thead th { white-space: normal; }

/* ==========================================================================
   9. 模块 2：五维总览（雷达图 + 评分条 + 图例）
   ========================================================================== */
.r-dims { margin-top: var(--space-6); }
@media (min-width: 768px) {
  .r-dims { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: var(--space-8); align-items: start; }
}

/* ---------- 雷达图（手写 SVG，只两色：墨蓝数据线 + 灰基准线） ---------- */
.r-radar { display: block; width: 100%; max-width: 320px; margin: 0 auto; height: auto; }

.rd-grid { fill: none; stroke: var(--chart-grid); stroke-width: 1; }
.rd-grid--strong { stroke: var(--chart-grid-strong); }
.rd-axis { stroke: var(--chart-grid); stroke-width: 1; }
.rd-full {
  fill: none;
  stroke: var(--chart-fullmark);
  stroke-width: 1;
  stroke-dasharray: var(--chart-fullmark-dash);
}
.rd-hatch { fill: var(--chart-skipped-fill); stroke: none; color: var(--chart-grid-strong); }
.rd-self { fill: var(--chart-self-fill); stroke: var(--chart-self-stroke); stroke-width: 2; stroke-linejoin: round; }
.rd-dot { fill: var(--chart-self-dot); stroke: none; }
.rd-capmark { stroke: var(--score-cap); stroke-width: 2; stroke-dasharray: var(--score-cap-dash); }
.rd-label { font-family: var(--font-body); font-size: 13px; fill: var(--fg-2); }
.rd-value { font-family: var(--font-mono); font-size: 13px; font-weight: var(--weight-medium); fill: var(--brand-700); }

/* ---------- 评分条 ---------- */
.r-dims__bars { margin-top: var(--space-6); }
@media (min-width: 768px) { .r-dims__bars { margin-top: 0; } }
.r-bars__cap {
  font-size: var(--text-2xs);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-caps);
  color: var(--meta);
}
.r-bars__hint { margin-top: var(--space-4); font-size: var(--text-xs); color: var(--muted); line-height: var(--leading-normal); }

.r-bar {
  display: grid;
  grid-template-columns: 2.75rem minmax(4.5rem, auto) minmax(0, 1fr) 2.5rem;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-2) 0;
  border-bottom: 1px solid var(--border-soft);
}
.r-bar:last-of-type { border-bottom: none; }
.r-bar__w { font-size: var(--text-xs); color: var(--meta); text-align: right; }
.r-bar__name { font-size: var(--text-sm); color: var(--fg); white-space: nowrap; }
.r-bar__track {
  position: relative;
  display: block;
  height: 10px;
  background: var(--score-track);
  border-radius: var(--radius-pill);
  overflow: hidden;
}
.r-bar__fill {
  display: block;
  height: 100%;
  width: var(--w, 0%);
  background: var(--score-fill);
  border-radius: var(--radius-pill);
}
.r-bar__fill.is-capped { background: var(--warn); }
/* 3.0 上限刻度：把「为什么这一维最多 3 分」变成看得见的 */
.r-bar__capmark {
  position: absolute;
  top: -1px;
  bottom: -1px;
  left: 60%;                       /* 3 / 5 */
  width: 0;
  border-left: 1px dashed var(--score-cap);
}
.r-bar__v { font-size: var(--text-sm); font-weight: var(--weight-medium); color: var(--fg); text-align: right; }
.r-bar .r-tag { justify-self: start; }

/* ---------- 图例 ---------- */
.r-legend { margin-top: var(--space-6); padding-top: var(--space-4); border-top: 1px solid var(--border-soft); }
.r-legend__row {
  display: grid;
  grid-template-columns: 7rem minmax(0, 1fr) auto;
  gap: var(--space-3);
  align-items: baseline;
  padding: var(--space-2) 0;
  border-bottom: 1px solid var(--border-soft);
  font-size: var(--text-sm);
}
.r-legend__row:last-child { border-bottom: none; }
.r-legend__row--marks { grid-template-columns: minmax(0, 1fr); font-size: var(--text-xs); color: var(--meta); }
.r-legend__name { font-weight: var(--weight-medium); color: var(--fg); }
.r-legend__desc { color: var(--muted); line-height: var(--leading-normal); }
.r-legend__w { font-size: var(--text-xs); color: var(--meta); white-space: nowrap; }

/* ==========================================================================
   10. 模块 2 子区块：逐维诊断
   ========================================================================== */
/* 逐维诊断：第一张卡紧跟节说明 */
.r-dimdetail > .r-dim:first-of-type { margin-top: var(--space-5); }
.r-dim {
  margin-top: var(--space-6);
  padding: var(--space-5);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--surface);
}
.r-dim.is-capped { border-color: var(--warn-line); background: var(--warn-bg); }
.r-dim__head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-5); }
.r-dim__left { min-width: 0; }
.r-dim__title { font-size: var(--text-md); font-weight: var(--weight-medium); color: var(--fg); line-height: var(--leading-snug); }
.r-dim__sub { margin-top: var(--space-1); font-size: var(--text-xs); color: var(--muted); line-height: var(--leading-normal); }
.r-dim__meta { margin-top: var(--space-2); font-size: var(--text-2xs); color: var(--meta); }
.r-dim__soft { color: var(--meta); }
.r-dim__right { flex: none; display: flex; align-items: baseline; gap: var(--space-2); }
.r-dim__score { font-size: var(--text-xl); font-weight: var(--weight-bold); color: var(--brand-700); }
.r-dim__of { font-size: var(--text-xs); color: var(--meta); }
.r-dim__warn {
  margin-top: var(--space-3);
  padding: var(--space-3) var(--space-4);
  background: var(--warn-bg);
  border: 1px solid var(--warn-line);
  border-radius: var(--radius-md);
  font-size: var(--text-xs);
  line-height: var(--leading-normal);
  color: var(--warn);
}
.r-dim__block { margin-top: var(--space-5); }
.r-dim__h {
  font-size: var(--text-2xs);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-caps);
  color: var(--meta);
  padding-bottom: var(--space-2);
  border-bottom: 1px solid var(--border-soft);
}
.r-dim__p { margin-top: var(--space-3); font-size: var(--text-sm); line-height: var(--leading-body); color: var(--fg-2); }
.r-dim__p--soft { color: var(--muted); }
.r-dim__block--ev .r-dim__ev { margin-top: var(--space-3); display: grid; gap: var(--space-2); }
.r-dim__ev li {
  display: grid;
  grid-template-columns: 5.5rem minmax(0, 1fr);
  gap: var(--space-3);
  align-items: baseline;
  padding: var(--space-2) 0;
  border-bottom: 1px dashed var(--border);
  font-size: var(--text-sm);
}
.r-dim__ev li:last-child { border-bottom: none; }
.r-dim__ev-no { font-size: var(--text-2xs); color: var(--meta); white-space: nowrap; }
.r-dim__ev-txt { color: var(--fg-2); line-height: var(--leading-normal); }
.r-dim__todo { margin-top: var(--space-3); padding-left: var(--space-5); list-style: decimal; }
.r-dim__todo li { font-size: var(--text-sm); line-height: var(--leading-body); color: var(--fg-2); }

/* ==========================================================================
   11. 模块 3：取舍清单（停止清单 + 优先清单 + 风险提示）
   ========================================================================== */
/* 取舍清单：第一个区块紧跟节说明，不用再吃一整节间距 */
.r-tradeoff > .r-block-stop:first-of-type { margin-top: var(--space-5); }
.r-block-stop {
  margin-top: var(--space-6);
  padding: var(--space-5);
  background: var(--block-stop-bg);
  border: 1px solid var(--block-stop-line);
  border-radius: var(--radius-lg);
}
.r-block-stop__title {
  font-size: var(--text-md);
  font-weight: var(--weight-bold);
  color: var(--block-stop-fg);
  letter-spacing: var(--tracking-tight);
}
.r-block-stop__title::before {
  content: "";
  display: inline-block;
  width: 3px;
  height: 0.95em;
  margin-right: var(--space-2);
  vertical-align: -0.12em;
  background: var(--block-stop-mark);
  border-radius: var(--radius-xs);
}
.r-block-stop__lede { margin-top: var(--space-2); font-size: var(--text-xs); line-height: var(--leading-normal); color: var(--block-stop-fg); }

.r-stop-item { margin-top: var(--space-4); padding-top: var(--space-4); border-top: 1px solid var(--block-stop-line); }
.r-stop-item:first-of-type { padding-top: 0; border-top: none; }
.r-stop-item.has-sep { border-top: 1px solid var(--block-stop-line); }
.r-stop-item__what {
  font-size: var(--text-base);
  font-weight: var(--weight-medium);
  line-height: var(--leading-snug);
  color: var(--block-stop-fg);
}
.r-stop-item__row { margin-top: var(--space-1); font-size: var(--text-sm); line-height: var(--leading-normal); color: var(--block-stop-fg); }
.r-stop-item__row b { font-weight: var(--weight-medium); }

/* 风险提示沿用铜黄底：同一类「要花钱 / 要停工」的视觉语言 */
.r-block-risk { margin-top: var(--space-8); }

/* ---------- 优先清单 ---------- */
.r-pri { margin-top: var(--space-8); }
.r-pri__title { font-size: var(--text-md); font-weight: var(--weight-bold); color: var(--brand-900); letter-spacing: var(--tracking-tight); }
.r-pri__lede { margin-top: var(--space-2); font-size: var(--text-xs); color: var(--muted); line-height: var(--leading-normal); }
.r-pri__row {
  margin-top: var(--space-4);
  padding: var(--space-4);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
}
.r-pri__head { display: flex; align-items: baseline; gap: var(--space-3); flex-wrap: wrap; }
.r-pri__level {
  flex: none;
  padding: 2px var(--space-2);
  border-radius: var(--radius-sm);
  font-size: var(--text-2xs);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-caps);
}
.r-pri__level.is-p0 { background: var(--pri-p0-bg); color: var(--pri-p0-fg); }
.r-pri__level.is-p1 { background: var(--pri-p1-bg); color: var(--pri-p1-fg); }
.r-pri__act { font-size: var(--text-base); font-weight: var(--weight-medium); line-height: var(--leading-snug); color: var(--fg); }
.r-pri__why { margin-top: var(--space-2); font-size: var(--text-sm); line-height: var(--leading-body); color: var(--fg-2); }
.r-pri__attrs { margin-top: var(--space-3); padding-top: var(--space-3); border-top: 1px solid var(--border-soft); font-size: var(--text-xs); color: var(--muted); line-height: var(--leading-normal); }
.r-pri__attrs b { color: var(--fg-2); font-weight: var(--weight-medium); }

/* ==========================================================================
   11.5 「这笔账」（算账层，不编号）
   --------------------------------------------------------------------------
   沿用报告其它区块的变量与间距节奏：卡片用 --surface + --border，标题用 --brand-900，
   弱化信息（来源标注 / 补充材料）用 --muted / 小字号，不引入任何新颜色字面量。
   ========================================================================== */
.r-ledger { margin-top: var(--space-10); }
.r-ledger__lead { margin-top: var(--space-4); font-size: var(--text-base); line-height: var(--leading-body); color: var(--fg-2); }
.r-ledger__item { margin-top: var(--space-5); padding-top: var(--space-5); border-top: 1px solid var(--border-soft); }
.r-ledger__item:first-of-type { margin-top: var(--space-6); padding-top: 0; border-top: none; }
.r-ledger__title {
  font-size: var(--text-md); font-weight: var(--weight-bold); color: var(--brand-900);
  letter-spacing: var(--tracking-tight); line-height: var(--leading-snug);
}
.r-ledger__title::before {
  content: ""; display: inline-block; width: 3px; height: 0.95em; margin-right: var(--space-2);
  vertical-align: -0.12em; background: var(--block-stop-mark); border-radius: var(--radius-xs);
}
.r-ledger__lines { margin-top: var(--space-2); padding-left: var(--space-5); list-style: disc; }
.r-ledger__lines li { font-size: var(--text-sm); line-height: var(--leading-body); color: var(--fg-2); }
.r-ledger__from {
  margin-top: var(--space-2); font-size: var(--text-2xs); color: var(--muted); line-height: var(--leading-normal);
}
.r-ledger__missing {
  margin-top: var(--space-6); padding: var(--space-5);
  background: var(--surface); border: 1px solid var(--border-soft); border-radius: var(--radius-lg);
}
.r-ledger__missing h3 { font-size: var(--text-sm); font-weight: var(--weight-bold); color: var(--fg); letter-spacing: var(--tracking-tight); }
.r-ledger__missing-list { margin-top: var(--space-2); padding-left: var(--space-5); list-style: disc; }
.r-ledger__missing-list li { font-size: var(--text-xs); color: var(--muted); line-height: var(--leading-normal); }
.r-ledger__tail { margin-top: var(--space-5); font-size: var(--text-sm); color: var(--fg-2); line-height: var(--leading-body); }

/* ==========================================================================
   12. 模块 4：90 天行动方案
   ========================================================================== */
.r-gate-strip {
  margin-top: var(--space-6);
  padding: var(--space-5);
  background: var(--surface-sunken);
  border-radius: var(--radius-lg);
}
.r-gate-strip__head { font-size: var(--text-sm); font-weight: var(--weight-medium); color: var(--fg); }
.r-gate-blocks { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-4); }
/* 关卡胶囊：横向、装得下 5–6 字短名。原来是 2.25rem 的固定方框，只有数字 ——
   打印成 PDF / 手机上看到的就是 8 个空方块。改成胶囊后靠 .r-gate-blocks 的
   flex-wrap 自动折行。 */
.r-gate-block {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: auto;
  min-width: 0;
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface);
  color: var(--meta);
}
.r-gate-block__i { font-size: var(--text-xs); }
.r-gate-block__t { font-size: var(--text-xs); line-height: 1.2; }
.r-gate-block.is-passed { background: var(--success-bg); border-color: var(--success-line); color: var(--success); }
.r-gate-block.is-current {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--accent-on);
  border-width: var(--border-w-thick);
}
.r-gate-strip__now { margin-top: var(--space-4); font-size: var(--text-base); font-weight: var(--weight-medium); color: var(--fg); }
.r-gate-strip__why { margin-top: var(--space-1); font-size: var(--text-sm); line-height: var(--leading-normal); color: var(--fg-2); }
.r-gate-strip__todo {
  margin-top: var(--space-4);
  padding-top: var(--space-3);
  border-top: 1px solid var(--border);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--brand-700);
  line-height: var(--leading-normal);
}

.r-stage { margin-top: var(--space-6); padding-top: var(--space-5); border-top: 1px solid var(--border-soft); }
.r-stage:first-of-type { padding-top: 0; border-top: none; }
.r-stage__title { font-size: var(--text-base); font-weight: var(--weight-bold); color: var(--brand-900); }
.r-stage__goal { margin-top: var(--space-1); font-size: var(--text-xs); color: var(--muted); line-height: var(--leading-normal); }
.r-stage__line { margin-top: var(--space-3); font-size: var(--text-sm); line-height: var(--leading-body); color: var(--fg-2); }
.r-stage__line b { font-weight: var(--weight-medium); color: var(--fg); }

/* ==========================================================================
   13. 模块 5 / 6：提示条与指标
   ========================================================================== */
.r-callout {
  margin-top: var(--space-4);
  padding: var(--space-3) var(--space-4);
  background: var(--banner-redline-bg);
  border-left: 3px solid var(--banner-redline-fg);
  border-radius: var(--radius-sm);
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
  color: var(--fg-2);
}
.r-note {
  margin-top: var(--space-4);
  padding: var(--space-3) var(--space-4);
  background: var(--surface-warm);
  border-radius: var(--radius-md);
  font-size: var(--text-xs);
  line-height: var(--leading-normal);
  color: var(--muted);
}
.r-note--warn {
  background: var(--warn-bg);
  border: 1px solid var(--warn-line);
  color: var(--warn);
  font-size: var(--text-sm);
}

.r-metric-main {
  margin-top: var(--space-6);
  padding: var(--space-5);
  background: var(--brand-50);
  border: 1px solid var(--brand-100);
  border-radius: var(--radius-lg);
}
.r-metric-main__cap {
  font-size: var(--text-2xs);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-caps);
  color: var(--brand-700);
}
.r-metric-main__val {
  margin-top: var(--space-2);
  font-family: var(--font-serif);
  font-size: var(--text-lg);
  line-height: var(--leading-snug);
  color: var(--brand-900);
}
.r-metric-main__src { margin-top: var(--space-2); font-size: var(--text-xs); color: var(--muted); line-height: var(--leading-normal); }

.r-cadence {
  display: grid;
  grid-template-columns: 8rem minmax(0, 1fr);
  gap: var(--space-3);
  align-items: baseline;
  margin-top: var(--space-3);
  padding: var(--space-3) 0;
  border-bottom: 1px solid var(--border-soft);
}
.r-cadence:last-child { border-bottom: none; }
.r-cadence__when { font-size: var(--text-sm); font-weight: var(--weight-medium); color: var(--fg); }
.r-cadence__what { font-size: var(--text-sm); line-height: var(--leading-normal); color: var(--fg-2); }

/* ==========================================================================
   14. 带走区（下载 / 打印 / 复制）
   ========================================================================== */
.r-takeaway {
  margin-top: var(--space-12);
  padding: var(--space-6);
  background: var(--surface-warm);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
}
.r-takeaway__title { font-size: var(--text-md); font-weight: var(--weight-medium); color: var(--fg); }
.r-takeaway__row { display: grid; gap: var(--space-2); margin-top: var(--space-4); }
@media (min-width: 640px) {
  .r-takeaway__row { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
}
.r-tool {
  display: grid;
  grid-template-columns: 1.5rem minmax(0, 1fr);
  column-gap: var(--space-3);
  align-items: center;
  min-height: var(--control-h);
  padding: var(--space-3) var(--space-4);
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-md);
  text-align: left;
  transition: background var(--dur-fast) var(--ease-standard),
              border-color var(--dur-fast) var(--ease-standard);
}
.r-tool:hover { background: var(--brand-50); border-color: var(--accent-line); }
.r-tool:focus-visible { box-shadow: var(--focus-ring); }
.r-tool .ic { grid-row: 1 / span 2; color: var(--brand-700); }
.r-tool__label { font-size: var(--text-base); font-weight: var(--weight-medium); color: var(--fg); }
.r-tool__hint { font-size: var(--text-2xs); color: var(--muted); }
.r-tool--primary { background: var(--accent); border-color: var(--accent); }
.r-tool--primary .ic { color: var(--accent-on); }
.r-tool--primary .r-tool__label { color: var(--accent-on); }
.r-tool--primary .r-tool__hint { color: var(--accent-on); opacity: .85; }
.r-tool--primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); }
.r-takeaway__note { margin-top: var(--space-4); font-size: var(--text-xs); color: var(--muted); line-height: var(--leading-normal); }
.r-takeaway__back { margin-top: var(--space-3); }
.r-wechat-tip {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  margin-top: var(--space-4);
  padding: var(--space-3) var(--space-4);
  background: var(--info-bg);
  border: 1px solid var(--info-line);
  border-radius: var(--radius-md);
  font-size: var(--text-xs);
  line-height: var(--leading-normal);
  color: var(--brand-800);
}
.r-wechat-tip .ic { flex: none; margin-top: 2px; color: var(--brand-600); }

/* ==========================================================================
   15. 陪跑服务页（铜黄 = 「这一段要花钱」）
   ========================================================================== */
.r-service { padding-top: var(--space-10); margin-top: var(--space-10); border-top: 1px solid var(--border-soft); }
.r-service-box {
  margin-top: var(--space-5);
  padding: var(--space-6);
  background: var(--brass-50);
  border: 1px solid var(--brass-100);
  border-radius: var(--radius-lg);
}
.r-service__kicker {
  font-size: var(--text-2xs);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-caps);
  color: var(--brass-700);
}
.r-service__lede { margin-top: var(--space-3); font-family: var(--font-serif); font-size: var(--text-md); line-height: var(--leading-body); color: var(--brass-800); }
.r-service__cols { margin-top: var(--space-5); display: grid; gap: var(--space-5); }
@media (min-width: 640px) { .r-service__cols { grid-template-columns: 1fr 1fr; } }
.r-incl { min-width: 0; }
.r-incl__cap { font-size: var(--text-2xs); font-weight: var(--weight-medium); letter-spacing: var(--tracking-caps); color: var(--brass-700); }
.r-incl__list, .r-excl__list { margin-top: var(--space-3); display: grid; gap: var(--space-2); }
.r-incl__list li, .r-excl__list li { display: flex; align-items: flex-start; gap: var(--space-2); font-size: var(--text-sm); line-height: var(--leading-normal); color: var(--brass-800); }
.r-incl__ic, .r-excl__ic { flex: none; margin-top: 4px; }
.r-incl__ic { color: var(--brass-700); }
.r-excl__ic { color: var(--muted); }
.r-service__price { margin-top: var(--space-5); padding-top: var(--space-4); border-top: 1px solid var(--brass-100); font-size: var(--text-base); color: var(--brass-800); }
.r-service__price-v { font-size: var(--text-xl); font-weight: var(--weight-bold); color: var(--brass-800); }
.r-service__pay { margin-top: var(--space-1); font-size: var(--text-xs); color: var(--brass-700); line-height: var(--leading-normal); }
.r-region { margin-top: var(--space-4); padding-top: var(--space-4); border-top: 1px solid var(--brass-100); }
.r-region__row { font-size: var(--text-sm); color: var(--brass-800); line-height: var(--leading-normal); }
.r-region__row + .r-region__row { margin-top: var(--space-1); }
.r-service__acts { margin-top: var(--space-5); display: flex; align-items: center; gap: var(--space-4); flex-wrap: wrap; }
.r-service__wx { font-size: var(--text-sm); color: var(--brass-800); }
.r-service__by { margin-top: var(--space-4); font-size: var(--text-xs); color: var(--brass-700); line-height: var(--leading-normal); }

/* AI 导语块（模块 2/3/4 顶部）。模板标准版下不渲染，所以平时看不到这个盒子。
   刻意做得像「顾问手写的一段话」而不是系统提示：左侧一条 1px 铜黄细线，
   不是彩色大色块 —— 它要和正文一样可信，不能像插入广告。 */
.r-ai {
  margin: var(--space-4) 0 var(--space-5);
  padding: var(--space-1) 0 var(--space-1) var(--space-4);
  border-left: 1px solid var(--brass-100);
}
.r-ai__p {
  font-size: var(--text-base);
  color: var(--fg-2);
  line-height: var(--leading-body);   /* 报告长段落正文专用行高 1.8，中文才不糊 */
}
.r-ai__p + .r-ai__p { margin-top: var(--space-3); }
.r-ai__h {
  font-size: var(--text-base);
  font-weight: 600;
  color: var(--fg);
  margin: var(--space-3) 0 var(--space-1);
}
.r-ai__h:first-child { margin-top: 0; }
.r-ai__ul { margin: var(--space-2) 0; padding-left: var(--space-4); }
.r-ai__li {
  font-size: var(--text-base);
  color: var(--fg-2);
  line-height: var(--leading-body);
  margin: var(--space-1) 0;
}
.r-ai__p strong, .r-ai__li strong { font-weight: 600; color: var(--fg); }
.r-ai__ul + .r-ai__p, .r-ai__p + .r-ai__ul { margin-top: var(--space-3); }

/* 铜黄按钮（陪跑服务的主行动；这里定义是因为 main.css 只有蓝/灰/红三种） */
.btn--brass { background: var(--brass-700); color: var(--accent-on); }
.btn--brass:hover { background: var(--brass-800); }
.btn--brass:active { background: var(--brass-800); }

/* 正文中间的陪跑入口 —— 三处入口刻意不同形，见设计 §8.7：
     入口 1（--dim，逐维诊断末尾）：铜黄小盒，是一条建议的延伸，不能像广告
     入口 2（默认，模块 4 下方）：一条分隔线 + 一句 + 一个链接，弱化处理
   三处都做成铜黄盒会变廉价，而且会让人以为整份报告都在卖服务。 */
/* 入口 2：分隔线式（朴素，不抢正文） */
.r-service-inline {
  margin-top: var(--space-6);
  padding-top: var(--space-6);
  border-top: 1px solid var(--border);
  display: flex;
  align-items: baseline;
  gap: var(--space-4);
  flex-wrap: wrap;
}
.r-service-inline__txt {
  font-size: var(--text-base);
  color: var(--fg-2);
  line-height: var(--leading-normal);
}
/* 入口 1：铜黄小盒（设计 §8.7：--brass-50 底 + 1px --brass-100 边 + --radius-md）
   注意用整圈边框，不用 border-left 粗色条 —— 那是模板味最重的写法。 */
.r-service-inline--dim {
  margin-top: var(--space-5);
  padding: var(--space-4) var(--space-5);
  border-top: 0;
  border: 1px solid var(--brass-100);
  border-radius: var(--radius-md);
  background: var(--brass-50);
}
.r-service-inline--dim .r-service-inline__txt {
  font-size: var(--text-sm);
  color: var(--fg-2);
}
/* 两处入口的链接统一走铜黄文字 + 箭头，和报告里的其它 .r-link 区分开 */
.r-service-inline__link {
  color: var(--brass-700);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
}
.r-service-inline__link:hover { color: var(--brass-800); }

/* 文字按钮（报告里的节内跳转） */
.r-link {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  min-height: var(--tap-min);
  padding: 0;
  background: none;
  border: none;
  color: var(--accent);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  text-decoration: underline;
  text-underline-offset: 4px;
}
.r-link:hover { color: var(--accent-hover); }
.r-link:focus-visible { box-shadow: var(--focus-ring); }

/* ==========================================================================
   16. 附录工具包（7 份可打印手填模板）
   ========================================================================== */
.r-appendix-note {
  margin-top: var(--space-5);
  padding: var(--space-3) var(--space-4);
  background: var(--appendix-note-bg);
  border-radius: var(--radius-md);
  font-size: var(--text-xs);
  line-height: var(--leading-normal);
  color: var(--muted);
}
.r-tpl {
  margin-top: var(--space-6);
  padding: var(--space-5);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
}
/* 与当前卡点最相关的那份：高亮标签 + 主色边框（不靠阴影） */
.r-tpl.is-highlight { border-color: var(--accent-line); border-width: var(--border-w-thick); }
.r-tpl__cap {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  flex-wrap: wrap;
  padding-bottom: var(--space-3);
  border-bottom: 1px solid var(--border);
  background: var(--appendix-head-bg);
  margin: calc(var(--space-5) * -1) calc(var(--space-5) * -1) 0;
  padding: var(--space-3) var(--space-5);
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}
.r-tpl__idx {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  background: var(--accent);
  color: var(--accent-on);
  font-size: var(--text-2xs);
  font-weight: var(--weight-medium);
}
.r-tpl__name { font-size: var(--text-md); font-weight: var(--weight-medium); color: var(--fg); }
.r-tpl__flag {
  padding: 2px var(--space-2);
  border-radius: var(--radius-sm);
  background: var(--accent);
  color: var(--accent-on);
  font-size: var(--text-2xs);
  font-weight: var(--weight-medium);
}
.r-tpl__purpose { margin-top: var(--space-4); }
.r-tpl__purpose p { font-size: var(--text-sm); line-height: var(--leading-normal); color: var(--fg-2); }
.r-tpl__purpose p + p { margin-top: var(--space-2); }
.r-tpl__purpose b { font-weight: var(--weight-medium); color: var(--fg); }

/* ---------- 附录 Markdown 渲染出来的元素 ---------- */
.r-md__h3 { margin-top: var(--space-6); font-size: var(--text-base); font-weight: var(--weight-bold); color: var(--brand-900); }
.r-md__h4 { margin-top: var(--space-5); font-size: var(--text-sm); font-weight: var(--weight-medium); color: var(--fg); }
.r-md__hr { margin: var(--space-5) 0; border: none; border-top: 1px solid var(--border-soft); }
.r-md__p { margin-top: var(--space-3); font-size: var(--text-sm); line-height: var(--leading-body); color: var(--fg-2); }
.r-md__quote {
  margin-top: var(--space-3);
  padding: var(--space-3) var(--space-4);
  background: var(--surface-warm);
  border-left: 3px solid var(--border-strong);
  border-radius: var(--radius-sm);
  font-size: var(--text-sm);
  line-height: var(--leading-body);
  color: var(--fg-2);
}
.r-md__ol { margin-top: var(--space-3); padding-left: var(--space-5); list-style: decimal; }
.r-md__li { font-size: var(--text-sm); line-height: var(--leading-body); color: var(--fg-2); }
.r-md__li + .r-md__li { margin-top: var(--space-2); }
.r-md__h3 + .r-md__p, .r-md__h4 + .r-md__p, .r-md__h3 + .r-table, .r-md__h4 + .r-table { margin-top: var(--space-3); }

/* 填空位：渲染成 1px 实下划线。
   绝对不要把 ＿ 字符原样输出 —— 打印出来是一串糊的黑块，既看不见也没法写字。
   下载出来的 .md 仍然保留 ＿＿＿＿ 原样（documents 里那个形态才能填字）。 */
.blank { display: inline-block; vertical-align: baseline; border-bottom: 1px solid var(--blank-underline); }
/* max-width:100% 是硬约束：填空位是 inline-block，在窄屏（≤767px）里曾被量到
   把整行撑破 17px（两个 96px 的填空位 + 文本排不进 387px）。它是原子盒，不会
   自己断行，只能靠这条把它压回容器宽以内 —— 版式守卫 layoutcheck 报出来的。 */
.blank--inline { min-width: var(--blank-inline-min-w); max-width: 100%; height: 1.1em; }
.blank--block { display: block; width: 100%; height: var(--blank-block-h); }

/* 附录里的 □ 勾选框 */
.cbx {
  display: inline-block;
  width: var(--checkbox-d);
  height: var(--checkbox-d);
  vertical-align: -0.18em;
  margin: 0 2px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-xs);
  background: var(--surface);
}

/* ==========================================================================
   17. 末页服务卡（整份报告最后，只三行）
   ========================================================================== */
.r-colophon { padding-top: var(--space-12); margin-top: var(--space-12); border-top: 1px solid var(--border); }
.r-colophon__box {
  padding: var(--space-8) var(--space-6);
  background: var(--brass-50);
  border: 1px solid var(--brass-100);
  border-radius: var(--radius-xl);
  text-align: center;
}
.r-colophon__promise {
  font-family: var(--font-serif);
  font-size: var(--text-md);
  line-height: var(--leading-body);
  color: var(--brass-800);
}
.r-colophon__contact { margin-top: var(--space-5); font-size: var(--text-base); color: var(--brass-800); }
.r-colophon__contact .mono { font-weight: var(--weight-medium); letter-spacing: var(--tracking-wide); }
.r-colophon__foot { margin-top: var(--space-4); font-size: var(--text-2xs); color: var(--brass-700); letter-spacing: var(--tracking-wide); }
.r-backtop { margin-top: var(--space-5); text-align: right; }

/* ==========================================================================
   18. 响应式
   ========================================================================== */
@media (max-width: 1023px) {
  /* 目录收进底部面板；正文独占整宽 */
  .report-layout { padding-top: var(--space-6); }
}

@media (max-width: 767px) {
  .report-paper { border-radius: var(--radius-lg); }
  .r-sec { padding-top: var(--space-8); margin-top: var(--space-8); }
  .r-cover__company { font-size: var(--text-xl); }
  .r-oneliner { font-size: var(--text-md); }
  .r-grade { gap: var(--space-4); }
  .r-badge { width: 52px; height: 52px; }
  .r-badge__letter { font-size: var(--text-xl); }

  /* 雷达图在手机上单列，上下留白 */
  .r-radar { max-width: 280px; }
  .r-dims__bars { margin-top: var(--space-6); }

  /* 五维条形图的维度名在窄屏必须能换行。
     原名 .r-bar__name 是 white-space:nowrap，而名列的列宽是 minmax(4.5rem, auto)：
     在 421–767px 这一段（窄平板 / 分屏 / 折叠屏展开前）列会被压到 36px，
     「自己 S」却要 45px，nowrap 直接把这一行撑破，条形容器的右半截被吃掉。
     版式守卫 layoutcheck 在 526px 视口量出 16 处 OVERFLOW_X 才暴露出来 ——
     390 的真机走的是 max-width:420 那套布局，反而不出事，所以肉眼一直没看到。 */
  .r-bar__name { white-space: normal; }

  /* 填空位在窄屏收窄：96px 的手写位在 390–767px 里太占地方，
     收窄后一行能放得下「问题 + 填空」，不会把整行顶出容器。 */

  /* 但长填空位的宽度是 JS 写在内联 style 上的（calc(变量 + Npx)），
     媒体查询里的 min-width 压不住内联 width —— 所以这里直接让它独占一行：
     既要写字的空位本来也该自己占一行，窄屏下更是排不进任何剩余空间。
     版式守卫量到的是「两个 96px 空位把 387px 的行顶到 404px」。 */
  .blank--inline { display: block; width: 100% !important; min-width: 0; height: 1.4em; }

  .r-bar {
    grid-template-columns: 2.5rem minmax(0, 1fr) 2.25rem;
    row-gap: var(--space-1);
  }
  .r-bar__track { grid-column: 2 / span 2; grid-row: 2; }
  .r-bar__w { grid-row: 1; }
  .r-bar__v { grid-row: 1; }
  .r-bar .r-tag { grid-column: 2 / span 2; grid-row: 3; }

  .r-legend__row { grid-template-columns: minmax(0, 1fr); gap: var(--space-1); }
  .r-legend__row--marks { grid-template-columns: minmax(0, 1fr); }

  .r-dim { padding: var(--space-4); }
  .r-dim__head { flex-direction: column; gap: var(--space-3); }
  .r-dim__right { align-self: flex-start; }

  .r-cadence { grid-template-columns: minmax(0, 1fr); gap: var(--space-1); }
  .r-three__item { grid-template-columns: 1.5rem minmax(0, 1fr); }
  .r-three__no { width: 1.5rem; height: 1.5rem; }
  .r-takeaway { padding: var(--space-4); }
  .r-tpl { padding: var(--space-4); }
  .r-tpl__cap {
    margin: calc(var(--space-4) * -1) calc(var(--space-4) * -1) 0;
    padding: var(--space-3) var(--space-4);
  }
  .r-colophon__box { padding: var(--space-6) var(--space-4); }
  .r-dim__ev li { grid-template-columns: minmax(0, 1fr); gap: var(--space-1); }
}

@media (max-width: 420px) {
  .r-service__acts { flex-direction: column; align-items: stretch; }
  .r-service__acts .btn { width: 100%; }
}

/* ==========================================================================
   19. 单页打印（执行摘要那一页）
   --------------------------------------------------------------------------
   报告页的完整分页切片是下一轮的事；这里只处理「只印执行摘要」这一条路径：
   body.print-summary-only 时，除了执行摘要以外的所有节都藏起来。
   ========================================================================== */
@media print {
  /* 纸张与纸边距在这里显式声明，不让浏览器按地区默认值走 —— 无头/美制环境
     默认是 Letter，实测整份报告打出来 MediaBox=[0 0 612 792]。
     打印态 --report-pad 已经是 0px（见 design-tokens），所以纸边距只由这条
     @page 提供，不要再回头去调 report-pad，否则会叠加成双倍边距。
     下边距留 16mm 给将来的页脚页码；左右 13mm 留装订余量。 */
  @page {
    size: A4;
    margin: 14mm 13mm 16mm;
  }

  body.print-summary-only .report-paper > *:not(.r-summary) { display: none !important; }
  body.print-summary-only .report-toc,
  body.print-summary-only .report-mobile-bar,
  body.print-summary-only .r-redline-banner { display: none !important; }
  body.print-summary-only .r-summary { page-break-after: avoid; }

  /* 报告纸在打印时不再装成一张卡片，交给 @page 的边距 */
  .report-paper { border: none; border-radius: 0; max-width: none; padding: var(--report-pad); }
  .r-sec { break-inside: auto; }
  .r-sec__title { break-after: avoid; }
  .r-table { break-inside: auto; }
  .r-table thead { display: table-header-group; }   /* 表格跨页重复表头 */
  .r-tpl, .r-dim, .r-pri__row, .r-block-stop { break-inside: avoid; }
  .r-ledger__item, .r-ledger__missing { break-inside: avoid; }   /* 这笔账：每条账不跨页断得太难看 */
  .r-radar, .r-dims { break-inside: avoid; }
  .r-badge, .r-cover__company { break-after: avoid; }

  /* 打印前 JS 插入的页眉（报告编号）/ 页脚（页码） */
  .print-runner {
    display: block;
    font-size: 8pt;
    color: var(--meta);
    border-bottom: 0.5pt solid var(--border);
    padding-bottom: 4pt;
    margin-bottom: 12pt;
  }
  .print-runner__page {
    display: block;
    text-align: right;
    border: none;
    padding: 0;
    margin-top: 8pt;
    border-top: 0.5pt solid var(--border);
    padding-top: 4pt;
    font-size: 8pt;
    color: var(--meta);
  }
  /* JS 分页断点：强制在此处起新页 */
  .print-page-break { display: block; break-before: page; page-break-before: always; height: 0; }
}

/* ==========================================================================
   21. 打印准备态（JS 加 html.printing 时）
   --------------------------------------------------------------------------
   .printing 只在「点打印 → window.print() 之前」那一瞬存在；打印对话框打开后
   浏览器切到 print 媒体，下面这些规则让屏幕态不闪，并让 JS 的断点 / 页眉页脚
   接管分页（此时不要 CSS 再强制 section 分页）。
   ========================================================================== */
html.printing .no-print { display: none !important; }
html.printing .r-sec { break-before: auto !important; page-break-before: auto !important; }
html.printing .print-calc { visibility: hidden; }
/* 准备态下先藏起来，等真正进入 print 媒体再显示，避免开对话框前在屏幕上闪一下 */
html.printing .print-runner,
html.printing .print-runner__page,
html.printing .print-page-break { display: none !important; }

/* ==========================================================================
   20. 动效（仅 transform / opacity，禁止弹跳缓动）
   ========================================================================== */
@media (prefers-reduced-motion: no-preference) {
  /* 目录弹出面板：从底部上滑，200ms 收敛，不做回弹 */
  .toc-sheet__panel { animation: tocRise var(--dur-base) var(--ease-out); }
  @keyframes tocRise {
    from { transform: translateY(12px); opacity: .6; }
    to { transform: translateY(0); opacity: 1; }
  }
  .toc-sheet__scrim { animation: tocFade var(--dur-base) var(--ease-out); }
  @keyframes tocFade { from { opacity: 0; } to { opacity: 1; } }

  /* 评分条填充：只在首次绘制时轻微生长，不循环、不弹跳 */
  .r-bar__fill { transition: width var(--dur-slow) var(--ease-out); }
}
