/* ==========================================================================
   一脉出海 H5 · screens.css —— 逐屏专属样式（刀 2 · 十屏真内容）
   —— 只放「某一屏独有」的版式与图形。通用组件（按钮 / 数据卡 / 清单 / 角标 /
      表单 / 地图占位族）在 components.css，令牌在 tokens.css —— 此处一律不重复定义
      （契约 §2 的「同一个类不在两处定义」纪律）。
   —— 硬约束：色值只许 var(--…)；字号只许 --fs-1…6 六档；圆角只许 --r-card / 全圆；
      calc() 里只用令牌，不落字面量色值。
   ========================================================================== */

/* ---------------------------------------------------------------- 全局补丁 */
/* ⚠️ 缺失令牌补位：components.css 的 .card 与 .pulse-dot 引用了 var(--pad-card)，
   而 tokens.css 里没有定义它 —— 「未定义令牌」会让整条声明失效，
   于是数据卡内边距实为 0、脉冲点退回静态位置（刀 1 遗留）。此处按 02 手册
   「数据卡内边距 20pt」补上，值引 --pad-x，不新造数字。
   → 建议后续把这行收归 tokens.css，screens.css 不再代管。 */
:root{--pad-card:var(--pad-x)}

/* ---------------------------------------------------------------- 02 问题 */
/* 三行壁垒：主行（20px）+ 14px 释义行。整行仍是一个 ≥52pt 的块，
   与 .issue-row 的 min-height 一致，不改变屏高节奏。 */
#s02 .issue-row{align-items:flex-start}
.issue-body{display:flex;flex-direction:column;gap:var(--gap-base);min-width:0}
.issue-name{font-size:var(--fs-3);font-weight:700;line-height:1.35;color:var(--paper)}
.issue-gloss{font-size:var(--fs-1);font-style:normal;line-height:1.5;color:var(--mute)}

/* ------------------------------------------------------------ 03 产业底盘 */
/* 行内来源角标（非可点按钮 —— 可点展开的角标是页脚 .src-tag，触控 ≥52） */
.src-inline{color:var(--lane)}
/* 链点选展开要在 812 定高屏里塞下：屏内间距收两档（刀 3.5 上下游块进场后，
   收一档不够 —— 刘海机 sat≥44 实测面板会压到页脚，再收一档；提示行 / 口径注
   在展开时一并让位，见 js/interact/chains.js） */
#s03 .screen-body{gap:var(--gap-col)}
.chain-detail-line{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--gap-sm);
  padding:var(--gap-sm) var(--gap-md);
  border:var(--sw-grid) solid var(--lane-22);border-radius:var(--r-card);
}

/* ------------------------------------------------------------ 04 绿色新能 */
/* 展项四格 2×2：名称 + 脉线圆点（与符号家族同一端点语汇，见 01 文档 · 二.4） */
.ex-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap-sm)}
.ex-grid li{
  display:flex;align-items:center;gap:var(--gap-sm);
  min-height:var(--h-touch);padding:0 var(--gap-md);
  border:var(--sw-btn) solid var(--lane-22);border-radius:var(--r-card);
  font-size:var(--fs-2);color:var(--paper);
}
.ex-grid li::before{
  content:'';flex:0 0 auto;width:8px;height:8px;
  border-radius:999px;background:var(--pulse);
}

/* ------------------------------------------------------------ 05 出口地图 */
/* 地图：陆地 = 航路青 22% 填充 + 1px 描边（vector-effect:non-scaling-stroke
   让 1px 在三档宽度下都是 1px）；航路 = 点线；节点 = 脉线绿起点 + 航路青目的点。
   ⚠️ 名字标签是 HTML 层不是 SVG <text>：SVG 文本会随 viewBox 缩放，
      在 267px 宽的地图上会小于 14px —— 字号阶梯是硬约束，只能走 HTML。 */
#s05-map{gap:var(--gap-sm)}      /* 地图卡内部收一档：给图例让高度（版式实测） */
#s05 .screen-body{gap:var(--gap-col)}  /* 05 是最长屏；刀 3.5 赣品块进场后再收一档（实测） */
.map-wrap{position:relative}
.map-svg{display:block;width:100%;height:auto}
#s05-world path{
  fill:var(--lane-22);stroke:var(--lane);
  stroke-width:var(--sw-grid);vector-effect:non-scaling-stroke;
}
.map-routes path{
  fill:none;stroke:var(--pulse);stroke-width:var(--sw-icon);
  stroke-dasharray:14 16;stroke-linecap:round;vector-effect:non-scaling-stroke;
}
/* 目的节点：航路青实心 + 墨蓝细环（从陆地图底上拎出来） */
.map-node{
  fill:var(--lane);stroke:var(--ink);
  stroke-width:var(--sw-icon);vector-effect:non-scaling-stroke;
}
.map-origin{fill:var(--pulse)}
.map-halo{
  fill:none;stroke:var(--pulse);stroke-width:var(--sw-icon);
  opacity:.45;vector-effect:non-scaling-stroke;
}
/* 标签定位一律用 top/left（不用 translate —— 静态位移会被 reduced-motion
   巡检当成「动画中间态」，ty 阈值 24px） */
.map-label{
  position:absolute;font-size:var(--fs-1);line-height:1.5;
  white-space:nowrap;color:var(--lane);
}
.map-label--origin{color:var(--pulse);left:calc(82.2% - 36px);top:calc(39% - 11px)}
.map-label--asean{left:calc(78.8% - 7px);top:calc(58.3% + 17px)}
.map-label--hk{left:calc(85.6% + 8px);top:calc(49.7% - 10px)}
.map-label--eu{left:calc(51.2% - 7px);top:calc(23.3% + 17px)}
.map-legend{display:flex;flex-direction:column;gap:var(--gap-base)}  /* 刀 3.5：8→4（赣品块进场，实测）；行高不动 */
.map-legend li{
  display:flex;align-items:baseline;gap:var(--gap-sm);
  min-height:var(--h-foot);font-size:var(--fs-2);color:var(--paper);
}
.map-no{font-size:var(--fs-1);color:var(--lane)}
.map-yoy{margin-left:auto;color:var(--pulse)}

/* ------------------------------------------------------------ 07 采购价值 */
/* 07 与 05/10 同因：刘海机（sat 44–50）下竖向预算不够 24pt 间距 ——
   实测 sat50 时最后一行压页脚 3px，收一档后留出 37px 余量 */
#s07 .screen-body{gap:var(--gap-md)}

/* ------------------------------------------------------------ 08 绿色行动 */
/* 空间纪律（刀 3.5）：示意模型块进场后，屏内各收一档 —— 812 定高屏在
   刘海机下竖向预算不足，卡的 flex 收缩会把模型块裁掉（实测见文件尾注）。
   与 03/05/07「收一档」同一判例。 */
#s08 .screen-body{gap:var(--gap-md)}
#s08-carbon{gap:var(--gap-sm)}

/* N3 自证行：三条可复核的事实，短横线标记 */
.self-rows{display:flex;flex-direction:column;gap:var(--gap-base)}
.self-rows li{
  display:flex;align-items:flex-start;gap:var(--gap-sm);
  font-size:var(--fs-1);line-height:1.5;color:var(--mute);
}
.self-rows li::before{
  content:'';flex:0 0 auto;width:8px;height:2px;
  background:var(--pulse);margin-top:var(--gap-sm);
}

/* ------------------------------------------------------------ 09 预约导览 */
/* 表单两列；二维码 160×160 + 导览行；≤340 档回落单列（见文件末尾媒体查询） */
.field-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap-col)}
#s09 .field-row .field{min-width:0}
.qr-pair{display:flex;align-items:center;gap:var(--gap-md)}
.guide-rows{
  display:flex;flex-direction:column;gap:var(--gap-sm);
  flex:1 1 auto;min-width:0;
}
.guide-rows li{
  display:flex;align-items:center;flex-wrap:wrap;gap:var(--gap-sm);
  font-size:var(--fs-1);line-height:1.5;color:var(--mute);
}
/* 二维码底板：纸白底 + 墨色模块（扫码对比度），静区由 qr.svg 自带（2 模块）。
   ⚠️ flex:0 0 auto 是承重的：底板在列向 flex 里若被压缩（刘海机竖向紧张时），
   会变成非正方形 —— 二维码被拉扁就扫不出来了（本机曾实测：375+刘海压成 154×135）。 */
.qr-plate{flex:0 0 auto;padding:0;border:0;background:var(--paper);overflow:hidden}
.qr-plate img{display:block;width:100%;height:100%}
/* 可见地址：作为导览行的最后一行（落在二维码组的高度内，不再单独占一行高） */
.url-link{
  flex:1 1 100%;display:flex;align-items:center;
  min-height:var(--h-touch);
  font-size:var(--fs-1);line-height:1.5;color:var(--lane);
  text-decoration:underline;text-underline-offset:4px;
  word-break:break-all;
}
@media (max-width:340px){
  .qr-pair{flex-direction:column;align-items:flex-start}
  .field-row{grid-template-columns:1fr}   /* 320 档：两列输入框会被截，回落单列 */
}

/* ------------------------------------------------------------ 10 封底 */
/* 二维码按 02 手册「居中偏下」；区块间距收一档 —— 封底实测自然高已顶到
   812pt 视口（320 档更矮），不收这一档，刘海机上页脚会压到 Home 指示条。
   可见地址文本放在 09 屏（09 有余量），封底只留二维码本体。 */
#s10-qr{margin-inline:auto}
#s10 .screen-body{gap:var(--gap-col)}

/* ==========================================================================
   刀 3 · 交互层（js/interact/*.js 的配套样式）
   —— 纪律：色值一律 var(--…)；字号只许六档；圆角只许 12px / 全圆 / 50%；
     过渡只落在 transform / opacity 上；本层不新增描边档位。
   —— reduced-motion 统一由 body.is-reduced 一个开关关掉（该 class 由
      js/interact/index.js 按 motion.js 的 isReduced() 与 motion:reduced 广播维护，
      判定入口仍在 motion.js 一处，本层不自己判 matchMedia）。
   —— 定位一律用 top/left + 负 margin（不用 translate 做静态位移 —— 与地图标签同一约定）。
   ========================================================================== */

/* —— 03 链图谱点选：chip 可点 + 展开面板 —— */
.chain-chip{cursor:pointer}
body:not(.is-reduced) .chain-chip,
body:not(.is-reduced) .chain-detail{transition:opacity var(--dur-in) var(--ease),transform var(--dur-in) var(--ease)}
.chain-detail{
  display:flex;flex-direction:column;gap:var(--gap-sm);   /* 真实行 + 虚拟块两段 */
  opacity:0;transform:translateY(8px);
}
.chain-detail[hidden]{display:none}
.chain-detail.is-open{opacity:1;transform:none}
.chain-detail-name{font-size:var(--fs-2);font-weight:700;color:var(--paper)}

/* —— 05 出口地图点选：Voronoi 命中区 / 选中与降透明度 / 读数行 ——
   为什么整块盖住地图：三个节点最近只隔 ~20px（320 宽下更近），44px 圆钮必然
   互相压盖 —— 实测「点东盟」被香港的钮截走。改成按「到哪个节点最近」剖分的
   四块（三目的地 + 江西起点），互不重叠、每块远大于 44px，且每个节点必属于
   自己那一块（Voronoi 的性质），点哪儿都解得唯一答案（剖分在 js/interact/map.js）。 */
.map-cell{position:absolute;inset:0;width:100%;height:100%;padding:0;background:transparent;border:0;cursor:pointer}
body:not(.is-reduced) .map-node,
body:not(.is-reduced) .map-routes path,
body:not(.is-reduced) .map-label{transition:opacity var(--dur-in) var(--ease)}
.map-node.is-active{fill:var(--pulse)}
.map-legend li[data-dest]{cursor:pointer}
.map-legend li.is-active .map-no{color:var(--pulse)}
#s05-readout{min-height:var(--h-foot)}

/* —— 08 碳足迹滑杆：示意读数 + 天平 —— */
.card-head{display:flex;flex-wrap:wrap;align-items:center;gap:var(--gap-sm)}
#s08-readout{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--gap-sm)}
#s08-readout .num{font-size:var(--fs-3);color:var(--pulse)}
.carbon-cap{font-size:var(--fs-1);color:var(--paper-87)}
.balance{display:block;width:100%;max-width:180px;height:auto;margin-inline:auto}
/* 240 → 180（刀 3.5 实测裁定）：示意模型块进场后，812 定高屏在刘海机（sat≥44）
   下竖向预算不足 —— 卡的 flex 收缩会把模型块裁掉；收窄天平（76→57px 高）补回一档。 */
.balance-rot{transform-origin:120px 28px}
body:not(.is-reduced) .balance-rot{transition:transform var(--dur-in) var(--ease)}
.balance-beam{fill:none;stroke:var(--lane);stroke-width:var(--sw-icon);stroke-linecap:round}
.balance-end{fill:var(--lane)}
.balance-end--proposal{fill:var(--pulse)}
.balance-fulcrum{fill:none;stroke:var(--lane-55);stroke-width:var(--sw-icon);stroke-linejoin:round}
.balance-base{fill:none;stroke:var(--lane-22);stroke-width:var(--sw-icon);stroke-linecap:round}
.s08-end{opacity:1}
#s08-end-traditional{color:var(--lane)}
#s08-end-proposal{color:var(--pulse)}
body:not(.is-reduced) .s08-end{transition:opacity var(--dur-in) var(--ease)}
.s08-end.is-faint{opacity:.45}

/* —— 08 低碳承诺光点：长在主脉 08 段上（坐标由 pledge.js 实测换算） —— */
.pledge-dot{
  position:absolute;left:0;top:0;z-index:0;
  width:12px;height:12px;margin-left:-6px;margin-top:-6px;
  border-radius:50%;background:var(--pulse);
  pointer-events:none;opacity:0;transform:scale(.6);
}
.pledge-dot::before{
  content:'';position:absolute;inset:-8px;
  border:var(--sw-icon) solid var(--pulse);border-radius:50%;opacity:.35;
}
body:not(.is-reduced) .pledge-dot{transition:opacity var(--dur-in) var(--ease),transform var(--dur-in) var(--ease)}
.pledge-dot.is-on{opacity:1;transform:none}

/* —— 09 登记成功态（演示；输入不落盘） —— */
.form-success{display:flex;flex-direction:column;gap:var(--gap-col)}
.form-success-head{display:flex;align-items:center;gap:var(--gap-col);font-size:var(--fs-2);font-weight:700;color:var(--paper)}
.form-success .check-mark{width:20px;height:20px;background:var(--pulse);border-color:var(--pulse)}
.form-success[hidden]{display:none}

/* —— 10 电子名片弹层（N7 船票） —— */
.ticket{position:fixed;inset:0;z-index:var(--z-overlay);background:var(--ink);overflow:hidden;opacity:0}
body:not(.is-reduced) .ticket{transition:opacity var(--dur-in) var(--ease)}
.ticket.is-open{opacity:1}
.ticket[hidden]{display:none}
.ticket-panel{
  position:absolute;inset:0;display:flex;flex-direction:column;overflow-y:auto;
  padding:calc(var(--sat) + var(--gap-block)) var(--pad-x) calc(var(--sab) + var(--gap-block));
}
.ticket-close{
  position:absolute;top:calc(var(--sat) + var(--gap-sm));right:var(--pad-x);z-index:1;
  width:var(--h-touch);height:var(--h-touch);border-radius:999px;
  border:var(--sw-btn) solid var(--lane-55);color:var(--paper);background:var(--ink);
  font-size:var(--fs-3);line-height:1;
  display:inline-flex;align-items:center;justify-content:center;
}
.ticket-step{display:flex;flex-direction:column;gap:var(--gap-block);width:100%;max-width:420px;margin-inline:auto;padding-top:var(--gap-block)}
.ticket-step[hidden]{display:none}
.ticket-title{font-size:var(--fs-3);color:var(--paper)}
.ticket-img{display:block;width:min(78vw,320px);height:auto;margin-inline:auto;border-radius:var(--r-card);background:var(--deep)}
.ticket .is-warn{color:var(--paper)}   /* 校验提示：只加亮不加橙（赣味橙限额不在此处开销） */

/* —— 来源角标底部抽屉（sources.js 的台账） —— */
.src-sheet{position:fixed;inset:0;z-index:var(--z-overlay);display:flex;align-items:flex-end;opacity:0}
body:not(.is-reduced) .src-sheet{transition:opacity var(--dur-in) var(--ease)}
.src-sheet.is-open{opacity:1}
.src-sheet[hidden]{display:none}
.src-sheet-panel{
  position:relative;width:100%;max-height:76vh;overflow-y:auto;
  display:flex;flex-direction:column;gap:var(--gap-col);
  padding:var(--gap-block) var(--pad-x) calc(var(--sab) + var(--gap-block));
  background:var(--deep);border-radius:var(--r-card);
}
.src-sheet-head{display:flex;align-items:center;justify-content:space-between;gap:var(--gap-col)}
.src-sheet-title{font-size:var(--fs-2);font-weight:700;color:var(--paper)}
.src-sheet-body{display:flex;flex-direction:column;gap:var(--gap-col)}
.src-item{display:flex;flex-direction:column;gap:var(--gap-base);border-top:var(--sw-grid) solid var(--lane-22);padding-top:var(--gap-col)}
.src-item-title{font-size:var(--fs-2);color:var(--paper)}
.src-close{
  width:var(--h-touch);height:var(--h-touch);border-radius:999px;
  border:var(--sw-btn) solid var(--lane-55);color:var(--paper);
  font-size:var(--fs-3);line-height:1;
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
}

/* ==========================================================================
   刀 3.5 · 虚拟数据的区分样式（demo · js/data/demo.js）
   —— 唯一硬底线：真数字是本片最贵的资产 —— 评委必须**一眼**分清哪块是编的。
   —— 与真实数据的视觉差（并排时无需读文字即可分辨）：
      真实：实线描边容器（lane-22）/ 数值脉线绿 / 有 [S 编号] 角标
      虚拟：虚线描边容器（lane-55）+ 淡青底 / 白字数值 + 虚线底边 /
            「虚拟数据」徽标 / **绝无角标**
   —— 纪律照旧：色值只 var(--…)；字号只六档；圆角只 12px / 全圆 / 50%。
   ========================================================================== */
.demo-block{
  display:flex;flex-direction:column;gap:var(--gap-base);
  border:var(--sw-grid) dashed var(--lane-55);border-radius:var(--r-card);
  background:var(--lane-12);
  padding:var(--gap-base) var(--gap-sm);   /* 竖向取最小档：812 定高屏竖向预算实测极紧 */
}
.demo-row{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--gap-sm);
  font-size:var(--fs-1);line-height:1.5;color:var(--lane);
}
.demo-label{color:var(--lane);flex:0 0 auto}
.demo-words{color:var(--paper)}
.demo-caveat{
  display:flex;flex-wrap:wrap;align-items:center;gap:var(--gap-base);
  font-size:var(--fs-1);line-height:1.5;color:var(--mute);
}
.card .demo-caveat{color:var(--paper-87)}   /* 卡内灰蓝对比不足，升 87% 白（同 .card .t-l4 判例） */
.badge-demo{
  display:inline-flex;align-items:center;
  border:var(--sw-grid) dashed var(--lane-55);border-radius:999px;
  padding:0 var(--gap-sm);font-size:var(--fs-1);line-height:1.5;color:var(--lane);
  white-space:nowrap;
}
/* 虚拟数值：与真实数值（脉线绿 · Barlow 600）同一族字体，但白字 + 虚线底边 */
.demo-val{
  font-family:var(--font-num);font-weight:600;line-height:1;
  color:var(--paper);border-bottom:var(--sw-grid) dashed var(--lane-55);
}
#s08-readout .demo-val{font-size:var(--fs-3)}
.demo-row .demo-val{font-size:var(--fs-1)}
/* 05 / 08 的演示块在数据卡内：向卡内边出血两档（行宽实测裁定 —— 徽标 + 口径行
   再窄就折行，折行会把 812 定高屏的竖向预算挤爆，见各屏实测） */
#s05-demo,#s08-demo{margin-inline:calc(-1 * var(--gap-col))}

/* ==========================================================================
   刀 3.9 · 触摸动画递进（line.js 的手势层）
   —— 线的揭示不再只由「全片大进度」驱动：笔尖锚在视口中线，内容穿过笔尖即被画上
      （手指推多少、该屏的线走多少）。逐屏手势全部由「该屏墨迹比例 / 屏内笔位」
      驱动 —— 机制与逐屏参数见 js/line.js 第 7.5 节，这里只管样子。
   —— 为什么不进 components.css：那里的 .read-* 是四读法的「交接块」，本段是动作层；
      且手势元素不带 read-*（js/line.js 的 svgPath），两处各写各的、不互相改写。
   —— 「真 px 尺寸」由引擎的补偿 transform 保证（小圆点/记号与 .line-node 同法）：
      CSS 里写的 r / 描边宽就是最终 px。
   —— 纪律：色值一律 var(--…)；只动 transform / opacity / stroke-dashoffset。
   ========================================================================== */

/* 02 断口：警示橙的两点与光晕。橙限额：与警示环是同一视觉事件，计 1 次
   （见 tokens.css 的裁定备忘）。全片唯一的一次闪烁就在这颗 .is-flash 上。 */
.line-break-mark{opacity:0}
.line-break{fill:var(--sun)}
.line-break-halo{stroke:var(--sun);stroke-width:var(--sw-icon);opacity:0}
.is-flash .line-break-halo{animation:line-break-halo var(--dur-in) var(--ease) 1}
.is-flash .line-break{animation:line-break-dot var(--dur-in) var(--ease) 1}
@keyframes line-break-halo{0%{opacity:0}22%{opacity:.85}100%{opacity:0}}
@keyframes line-break-dot{0%{opacity:1}22%{opacity:.25}45%{opacity:1}100%{opacity:1}}

/* 03 汇聚：主脉的支流（12 条 —— 比主脉细两号、半透明，随墨迹依次汇入。
   12 条并行时 2.4px 会糊成一片，降到 1.5px（组件描边 1.5px 档，同 --sw-btn 的取值）；
   透明度分层：未汇入的支流 45%，让主线仍是画面里最重的一笔） */
.line-strand{stroke:var(--pulse);stroke-width:1.5px;stroke-linecap:round;opacity:.45}

/* 05 电路：焊点短横（航路青），墨迹越过的瞬间转脉线绿并提亮 = 逐个焊点「点亮」 */
.line-pad{stroke:var(--lane);stroke-width:var(--sw-icon);stroke-linecap:round;opacity:0}
.line-pad.is-hot{stroke:var(--pulse)}

/* 07 清单：勾选式停顿中点出的勾形记号 */
.line-check-mark{opacity:0}
.line-check{stroke:var(--pulse);stroke-width:2.4px;stroke-linecap:round;stroke-linejoin:round}

/* 08 称重：悬在停顿处的铅锤（短索 + 圆盘，与 08 屏天平的语汇呼应） */
.line-bob-mark{opacity:0}
.line-bob-stem{stroke:var(--lane-55);stroke-width:var(--sw-icon);stroke-linecap:round}
.line-bob{fill:var(--lane)}

/* 09 二维码一角：脉线绿描出的直角（画在底板右上角之外的静区外沿，不遮模块、不影响扫码） */
.line-qr-corner{stroke:var(--pulse);stroke-width:2.4px;stroke-linecap:round;stroke-linejoin:round}

/* ==========================================================================
   刀 3.6 · 矮屏逐屏覆盖（视口高 ≤760pt 的密度档）
   —— 共享令牌压档在 layout.css（--gap-block 12 / --pad-card 14 / L1 88→44）；
      此处只做「逐屏再收一档」的间距微调，且只动间距：
      不缩按钮（52 触控硬要求）、不缩二维码（160 规格 + 扫码实测）、不动内容。
   ========================================================================== */
@media (max-height:760px){
  /* 屏内区块间距：既有「收一档」（16）与令牌档（12）之外再收，直到 8 / 4 档
     —— 逐屏实测收敛（320 档竖向预算：视口 568 − 顶 72 − 底 40 − 页脚 52 = 404） */
  #s07 .screen-body,#s08 .screen-body,#s06 .screen-body{gap:var(--gap-sm)}  /* 12/16 → 8 */
  #s03 .screen-body,#s05 .screen-body,#s10 .screen-body{gap:var(--gap-base)} /* → 4 */
  #s09 .screen-head{gap:var(--gap-base)}
  /* 卡内与行组：8 → 4 档（卡内都是非触控元素之间的空隙） */
  #s04-carbon,#s06-trace,#s09-form{gap:var(--gap-sm)}      /* 12 → 8 */
  #s05-map,#s08-carbon{gap:var(--gap-base)}                /* 8 → 4 */
  .chain-chips,.check-list,.stat-rows,.guide-rows,.rank-rows{gap:var(--gap-base)}
  .cta-stack,.qr-pair,.field-row{gap:var(--gap-sm)}
}