@charset "UTF-8";
/* ══════════════════════════════════════════════════════════════════
   r11 · 方向 A「叠印」全站笔法层
   Yannie 2026-09-21 当面选定方向 A,本层把 A 的笔法从试点那一张铺到全站。

   ⚠️ 这一层是**可替换的一层**(任务书要求):她看过全站铺开后可能改主意。
      全部 A 的笔法只在这个文件里,换方向 = 换掉这一个文件,
      页面里的标记(.ovp-* 类名与 SVG 几何)不必动。

   房规逐条守(沿用 r9,负控见 lint-r11.py):
     1. 零十六进制色值,颜色一律 var(--c-*)。
     2. 绝不用 --c-border / --c-divider(深色档与 --c-surface 同值,线会整条消失)。
     3. SVG 内零 <text>、零内联 style=(<title>/<desc> 是无障碍名,不是画面文字)。
     4. 图里一个数字都没有 —— 牌照号 / 比例 / 金额 / 日期得先有数字才写得出来。

   ── A 的三个动作,四个尺度上都是同一套 ──────────────────────────
     ① 面叠面,压出第三种调子(不是描边,是材料)
     ② 三块面共用**同一道缘** —— 判据是那道共用的边,不是画上去的一根线
     ③ 方牌各带**一格套印偏移** —— 偏移是印刷的口音,线框没有口音

   这三个动作在四个尺度上重复,这就是「不要有的模块有巧思、有的毫不起眼」的答案:
     .ovp-plate  整版(G1)    一整幅
     .ovp-chip   分印(G2)    跟着项走,每项一枚
     .ovp-mark   方牌(G3)    节头旁一枚
     .ovp-field  底(G0/G4)   只换材料,不上前景

   ── 形状 = 语义的硬载体 ────────────────────────────────────────
     圆端 / 等距 / 出血 = 智能体执行(没有起点也没有终点)
     方 / 仅描边 / 疏且不等距 / 有头有尾 = 人裁定
     全图唯一实心 = 一方青色的印。方的 ⇒ 归「人」那一侧。
     **颜色失效(色盲、灰度打印)时语义仍然成立** —— 每处颜色差同时是形状差。
   ✅ 2026-09-22 Yannie 拍板:**圆 = 机器**(跟设计变量)。本层已按此实现 ——
      圆端只给 slug / strand(机器那一侧);tab / node / edge / 印一律 butt 或方。

   ⛔ 同一条拍板把另一件事钉死了:站上 **4 处** figure__keys 图例白纸黑字写着
      「圆口与点 具名的人裁定」,与拍板相反 —— 而**图例是文案,我一个字都不许改**。
      而且冲突不止那一行:这 4 处图例列的是**上一套笔法的词汇表**,
      A 里三个词有两个根本不存在 ——
        · 密网眼 —— A 明令不画网眼(两纹向交叠读成方格纸,r9 记过,我又踩过一次)
        · 圆口与点 = 人 —— 与拍板直接相反,只有改图例才修得掉
      ⇒ **这 4 节本棒不落地**(markets#read / markets#trust / how#split / how#path),
        前景与底都不动。理由不是「圆方未定」(已定),而是落了 A 之后
        图例会去描述一张画面上并不存在的图。改图例是文案活,交回文案总监。
      about#boundary 的图例只有 粗线 / 密纹 / 空白 —— A 三样都真有
      (缘上下出血 = 粗线;第三层最密 = 密纹;缘右侧页面底色 = 空白)⇒ 它照落。
      详见 说明.md §7。

   ── 不透明度预算(沿用 r9,不加码)──────────────────────────────
     场(raster / slug / strand)        ≤ .16
     结构线(edge / tab / rule)         ≤ .55
     实心   只有印,且只在「有人签字」的语义处出现
   ══════════════════════════════════════════════════════════════════ */

/* ── 版面容器 ───────────────────────────────────────────────────── */

.ovp { display: block; width: 100%; height: auto; }

/* ── 底与消隐(四个尺度共用)─────────────────────────────────────── */

.ovp-bg0 { stop-color: var(--c-surface); }
.ovp-bg1 { stop-color: var(--c-primary-50); stop-opacity: .40; }
.ovp-bg2 { stop-color: var(--c-primary-100); stop-opacity: .52; }
[data-theme="dark"] .ovp-bg1 { stop-opacity: .20; }
[data-theme="dark"] .ovp-bg2 { stop-opacity: .32; }

.ovp-veil-c { stop-color: var(--c-surface); }
.ovp-base, .ovp-veil { stroke: none; }

/* 判据外那一侧:页面底透上来。它和有场的一侧**不是同一种材料** ——
   「那边没有场」于是不靠留白说,靠换材料说(r9 §3 硬规矩 2)。 */
.ovp-ground { fill: var(--c-canvas); stroke: none; }

/* ── 场:机器那一侧。蓝、细、等距、圆端 ─────────────────────────── */

.ovp-raster, .ovp-raster-2, .ovp-raster-3,
.ovp-slug, .ovp-strand, .ovp-strand-2 {
  fill: none;
  stroke: var(--c-primary-500);
  stroke-linejoin: miter;
}
/* 深色档换同一色阶里更亮的一格 —— 不是「浅色反相」。
   --c-primary-500 在炭底上与底几乎同明度,整片场会塌掉。 */
[data-theme="dark"] .ovp-raster,
[data-theme="dark"] .ovp-raster-2,
[data-theme="dark"] .ovp-raster-3,
[data-theme="dark"] .ovp-slug,
[data-theme="dark"] .ovp-strand,
[data-theme="dark"] .ovp-strand-2 { stroke: var(--c-primary-600); }

/* 三档格距 = 三层面。越靠近共用的那道缘,叠得越厚、纹越密。
   ⚠️ 三档的**不透明度一模一样**,调子差全部由格距承担 —— 这是有意的。
      第一版 .085/.115/.150 是「格距也收紧、墨也加浓」,两个变量同时加码,
      结果三层线一旦在某个像素上重合就叠到 ≥60/255,240px 闸的重墨列
      在浅色档整片越线(plate 4.88%,上限 2.0%)。
      真的半色调印刷正是靠网点疏密出调子,不靠改墨的浓度 —— 改回来更对。 */
.ovp-raster, .ovp-raster-2, .ovp-raster-3 {
  stroke-width: 1.3; stroke-opacity: .090; stroke-linecap: butt;
}
/* 数列纹:数字高度的短棒,圆端、等距、两端出血。
   ⚠️ 它**不是数字** —— 见 说明.md §5 第 1 条,这是「临场感不靠假报价」那条判断的落点。 */
.ovp-slug     { stroke-width: 5.2; stroke-opacity: .130; stroke-linecap: round; }
.ovp-strand   { stroke-width: 4.6; stroke-opacity: .150; stroke-linecap: round; }
.ovp-strand-2 { stroke-width: 6.0; stroke-opacity: .285; stroke-linecap: round; }

[data-theme="dark"] .ovp-raster,
[data-theme="dark"] .ovp-raster-2,
[data-theme="dark"] .ovp-raster-3 { stroke-opacity: .135; }
[data-theme="dark"] .ovp-slug     { stroke-opacity: .175; }
[data-theme="dark"] .ovp-strand   { stroke-opacity: .185; }
[data-theme="dark"] .ovp-strand-2 { stroke-opacity: .345; }

/* ── 面:承担第一眼。描边随缩放变细,面不会 ─────────────────────── */

/* 三档**拉开**,不是三档几乎一样 —— 第一版 .055/.045/.038 叠出来是一条
   平滑的渐变,读作骨架屏(loading skeleton),看不出「哪里是第二层压上来的」。
   动作 ① 要的是能看见接缝:三种调子 + 三条清楚的界。 */
/* ⚠️ 浅色档这三个数是**从闸上倒推回来的**,不是挑好看的:
      三层面全叠在一起的那个角(占 plate 画面 23%)是 .05+.075+.075,
      在白底上已经把单像素差推到 ~45,再加一根 .10 的纹线就越过 60/255,
      于是 plate 的重墨列在浅色档报 3.13%(上限 2.0%)。
      降到 .040/.065/.050 之后三层叠起来仍然是三个看得出界的调子
      —— 骨架屏那个病根是「三档几乎一样」,不是「三档都太浅」。 */
.ovp-plane   { fill: var(--c-primary-500); fill-opacity: .040; stroke: none; }
.ovp-plane-2 { fill: var(--c-primary-500); fill-opacity: .065; stroke: none; }
/* 第三层换暖金 —— 冷蓝压暖金才真的压出**第三种**调子(同色相只会更深)。
   语义上也对得上:最靠近判据那道缘的一层是「人裁定」那一侧的色。 */
.ovp-plane-3 { fill: var(--c-accent-500);  fill-opacity: .050; stroke: none; }
[data-theme="dark"] .ovp-plane   { fill: var(--c-primary-600); fill-opacity: .075; }
[data-theme="dark"] .ovp-plane-2 { fill: var(--c-primary-600); fill-opacity: .115; }
[data-theme="dark"] .ovp-plane-3 { fill: var(--c-accent-500);  fill-opacity: .095; }

/* ── 人:方、仅描边、中性 ───────────────────────────────────────── */

/* ⚠️ 这一组一律 fill:none,且**不许**给它配承托面。
   第一版给方牌配了一块 --c-surface 的承托面(.ovp-tabfill),
   在近白的底上是个白洞、在炭底上是块浅灰板 —— 浅深两档都读成
   broken-image 占位图。现在方牌是三个角线,底下的纹从角间透上来。 */
.ovp-tab, .ovp-tab-2, .ovp-tab-3, .ovp-ghost,
.ovp-edge, .ovp-edge-2, .ovp-rule, .ovp-rule-2,
.ovp-node, .ovp-node-2 {
  fill: none;
  stroke: var(--c-border-strong);
  stroke-linecap: butt;
  stroke-linejoin: miter;
}

.ovp-tab   { stroke-width: 4.2; stroke-opacity: .46; }
.ovp-tab-2 { stroke-width: 3.4; stroke-opacity: .38; }
.ovp-tab-3 { stroke-width: 2.8; stroke-opacity: .30; }
/* 套印偏移:同一块版错开一格再印一次。**这是 A 的口音**,四个尺度上都带。 */
.ovp-ghost { stroke-width: 2.4; stroke-opacity: .20; }
/* 判据那道缘。两档宽度 —— **这不是审美,是尺度换算**:
   plate 的画布 880 单位、上页约按 1:1 摆,所以 3.8 单位 ≈ 3.8px;
   chip/mark 的画布只有 320/330 单位却也按 1:1 摆,同样的 3.8 单位
   在一张 300px 宽的小图里就是一根粗杠 —— 240px 闸的重墨列正是这么越线的
   (chip 浅色 2.9~5.4%)。小尺度换 edge-2。 */
.ovp-edge   { stroke-width: 3.8; stroke-opacity: .44; }
.ovp-edge-2 { stroke-width: 2.6; stroke-opacity: .40; }
/* rule / node 也分两档,理由同 edge:小尺度上同样的单位宽是一根粗杠。 */
.ovp-rule    { stroke-width: 4.2; stroke-opacity: .46; }
.ovp-rule-2  { stroke-width: 2.8; stroke-opacity: .36; }
.ovp-node    { stroke-width: 3.2; stroke-opacity: .46; }
.ovp-node-2  { stroke-width: 2.4; stroke-opacity: .38; }

[data-theme="dark"] .ovp-tab   { stroke-opacity: .62; }
[data-theme="dark"] .ovp-tab-2 { stroke-opacity: .50; }
[data-theme="dark"] .ovp-tab-3 { stroke-opacity: .40; }
[data-theme="dark"] .ovp-ghost { stroke-opacity: .26; }
[data-theme="dark"] .ovp-edge   { stroke-opacity: .50; }
[data-theme="dark"] .ovp-edge-2 { stroke-opacity: .46; }
[data-theme="dark"] .ovp-rule    { stroke-opacity: .54; }
[data-theme="dark"] .ovp-rule-2  { stroke-opacity: .44; }
[data-theme="dark"] .ovp-node    { stroke-opacity: .54; }
[data-theme="dark"] .ovp-node-2  { stroke-opacity: .46; }

/* ── 强音:唯一实心。方的 —— 它是印,不是点 ───────────────────────
   ⚠️ 印 = 「人签过字了」。所以它**只出现在语义上真有人签字的地方**。
      未经核验的业务数字旁边不许落印 —— 落了就等于用视觉替那个数字作保。
      (markets#scale 的「500+」「100%」正是这种地方,那一节按判断不落印。) */
.ovp-seal { fill: var(--c-accent-500); stroke: none; }

/* ── 分印(G2):跟着项走,每项一枚 ─────────────────────────────── */

.ovp-chip { display: block; width: 100%; height: auto; }

/* ── 方牌(G3):节头旁一枚。容器沿用第 1 棒腾出的 330×110 槽 ──────
   第 1 棒 2026-09-22 把图注记号挪到节头右侧,量出那里恒定空着 416px。
   330 < 416,放得下 —— 所以这一档**不增加任何页面高度**。 */
.ovp-mark { display: block; width: 100%; height: auto; }

/* ── 窄屏:补线宽,不补浓度 ─────────────────────────────────────
   880 宽的版缩到 375 屏只剩 ~343px(0.39×),1.3 的线落到 0.51 设备像素,
   浏览器只能拿半透明的一像素去凑,整片场会洗白。乘 2.3 补回去。
   不透明度一个都不动。面不用补 —— 面不随缩放变细,这正是用它的理由。 */
@media (max-width: 640px) {
  .ovp .ovp-raster, .ovp .ovp-raster-2, .ovp .ovp-raster-3 { stroke-width: 2.99; }
  .ovp .ovp-slug     { stroke-width: 11.96; }
  .ovp .ovp-strand   { stroke-width: 10.58; }
  .ovp .ovp-strand-2 { stroke-width: 13.8; }
  .ovp .ovp-tab      { stroke-width: 9.66; }
  .ovp .ovp-tab-2    { stroke-width: 7.82; }
  .ovp .ovp-tab-3    { stroke-width: 6.44; }
  .ovp .ovp-ghost    { stroke-width: 5.52; }
  .ovp .ovp-edge     { stroke-width: 8.74; }
  .ovp .ovp-edge-2   { stroke-width: 5.98; }
  .ovp .ovp-rule     { stroke-width: 9.66; }
  .ovp .ovp-rule-2   { stroke-width: 6.44; }
  .ovp .ovp-node     { stroke-width: 7.36; }
  .ovp .ovp-node-2   { stroke-width: 5.52; }
}


@charset "UTF-8";
/* ══════════════════════════════════════════════════════════════════
   r11 · 站上落位层 —— 「什么时候上背景纹、上到什么浓度、和前景图怎么分层」

   这个文件是任务书第 4 项「背景纹全站口径」的**可执行版本**。
   口径写成散文没人会照着做,写成选择器才会。dir-r11.css 定笔法,
   这一份只定「同一套笔法在站上以哪三种身份出现、各自压到多淡」。

   ── 口径一句话 ────────────────────────────────────────────────
   同一套叠印笔法,在站上只有三种身份,按**这一节的项间关系**选,不按「看起来空」选:

     场(底)   position:absolute 的整节底     G0 首屏 / G4 导语·出口
     分印      每一项自己的一枚小叠印         G2 并列 ≥3 项
     方牌      节头旁一枚 330 的实体块        G3 单一承诺 / 界限 / 立场

   前两种**一个像素的页面高度都不占** —— 它们是 absolute。
   这不是巧合,是选它们的理由:第 1 棒刚用一整轮把六页高度收下来
   (关于页 −276px、加入页 −261px),美术这一棒不许把它吃回去。
   第三种占高度,但它用的是第 1 棒 2026-09-22 腾出来的那个既有槽
   (节头右侧恒定空着 416px,330 < 416),所以也不新增高度。

   ── 分层:为什么是 z-index:-1,而不是 0 ────────────────────────
   一个层叠上下文里的绘制顺序是:
     ① 自己的背景与边框 → ② z-index 为负的子元素 → ③ 常规流内容 → ④ 文字
   所以 **z-index:-1 的子元素画在「卡片自己的底色之上、文字之下」**,
   正好是底纹要待的那一层。用 0 会盖住文字(定位元素排在文字之后画)。
   站上 .section__bg 本来就是靠这条规则工作的,分印只是把同一条规则
   用到项一级。配 isolation:isolate,让这个 −1 不会穿到整节背后去。

   ── 浓度:三档,且**一律低于**评审图上的独立样本 ──────────────
   评审图里每张图是单独一块版,可以自己说话;落到站上它背后是正文。
   所以三档全部再压一次,压的倍数写在各档的注里。
   ⚠️ 压的是不透明度,**不是格距** —— 格距是调子的载体(见 dir-r11.css 的注),
      动格距会把「三层面各是一个调子」这件事一起弄坏。
   ══════════════════════════════════════════════════════════════════ */

/* ── 场:两种容器,同一套规矩 ──────────────────────────────────── */

/* 场不画自己的底,也不画自己的消隐罩。
   底是给「一块独立的版」用的;当整节底纹用,它会在模块边界上切出一块
   看得见的砖 —— 那正是前几棒花力气躲掉的东西。模块底色归版面,场只加纹。 */
.section__bg .ovp-base,
.section__bg .ovp-veil,
.hero__bg .ovp-base,
.hero__bg .ovp-veil { display: none; }

/* 场也不要那块「缘右侧换成页面底色」的挡板 —— 站上它右边本来就是页面。
   再铺一层 ground 等于在节里印一块比页面更实的方砖。 */
.section__bg .ovp-ground,
.hero__bg .ovp-ground { display: none; }

/* 场的落位**沿用站上自己的那一套**,不另发明:
   `.motif--bg` 负责铺满并出血,`--right / --left / --wide / --bottom`
   四个修饰符决定这一节的场偏哪一边(前几棒定的「五个模块偏的方向不重样」)。
   所以场的 SVG 带 `class="motif motif--bg ovp"` —— 位置归站上,笔法归这一层。
   我在这里**不写** position/inset,写了就等于我在替版面重定一次落位。 */

/* ⚠️ 这一行是前几棒踩过的坑的解药,不许删:
   场的 viewBox 是 1200 宽,拉满一个 1440 的节要放大 1.2 倍以上,
   窄屏反过来缩到三分之一。线宽跟着缩放走的话,粗的那道缘会被放大成
   十几个像素横穿导语,细纹又会在窄屏上洗白。
   non-scaling-stroke = 线宽按设备像素算,与缩放无关。
   面不用管:面不随缩放变细,这正是这一套用面而不用线去承担调子的理由。 */
.section__bg .ovp *,
.hero__bg .ovp * { vector-effect: non-scaling-stroke; }

/* 场的三档浓度。
   G0 首屏(×1.0):首屏允许是全页最响的一面材料 —— 它底下没有正文要保护,
     只有标题与一个按钮,而且它的职责就是「先给材料,再给字」。
   G4 导语 / 出口(×0.55):这两种节的作用是「这里在换段」与「把人送出去」。
     它们只需要被认出是一层材料,不需要被看进去。
   两档之间没有第三个数 —— 常规节(G2)不上场,它上分印。
   一节**不许同时**上场与分印:同一节里前景与背景不占同一侧,
   两个都上就等于这一节自己跟自己抢第一眼。 */
.hero__bg .ovp-raster,
.hero__bg .ovp-raster-2,
.hero__bg .ovp-raster-3 { stroke-opacity: .090; }
.hero__bg .ovp-slug { stroke-opacity: .085; }
.hero__bg .ovp-plane   { fill-opacity: .040; }
.hero__bg .ovp-plane-2 { fill-opacity: .065; }
.hero__bg .ovp-plane-3 { fill-opacity: .050; }
.hero__bg .ovp-edge { stroke-opacity: .30; }

.section__bg .ovp-raster,
.section__bg .ovp-raster-2,
.section__bg .ovp-raster-3 { stroke-opacity: .050; }
.section__bg .ovp-slug { stroke-opacity: .047; }
.section__bg .ovp-plane   { fill-opacity: .022; }
.section__bg .ovp-plane-2 { fill-opacity: .036; }
.section__bg .ovp-plane-3 { fill-opacity: .028; }
/* 那道共用的缘在场里要留着 —— 它是这一套的判据,删了就只剩一片纹。
   但压到 .18:它在节里是一道材料的交界,不是一条要被读的线。 */
.section__bg .ovp-edge { stroke-opacity: .18; }

[data-theme="dark"] .hero__bg .ovp-raster,
[data-theme="dark"] .hero__bg .ovp-raster-2,
[data-theme="dark"] .hero__bg .ovp-raster-3 { stroke-opacity: .135; }
[data-theme="dark"] .hero__bg .ovp-slug { stroke-opacity: .125; }
[data-theme="dark"] .section__bg .ovp-raster,
[data-theme="dark"] .section__bg .ovp-raster-2,
[data-theme="dark"] .section__bg .ovp-raster-3 { stroke-opacity: .075; }
[data-theme="dark"] .section__bg .ovp-slug { stroke-opacity: .070; }
[data-theme="dark"] .section__bg .ovp-plane   { fill-opacity: .040; }
[data-theme="dark"] .section__bg .ovp-plane-2 { fill-opacity: .062; }
[data-theme="dark"] .section__bg .ovp-plane-3 { fill-opacity: .052; }

/* ── 分印:每一项自己的一枚 ────────────────────────────────────── */

/* 给项级容器一个定位上下文。
   ⚠️ position:relative 与 isolation:isolate **都不改变任何盒子的尺寸**,
      也不改变流 —— 它们只决定「谁是包含块」与「谁在谁前面画」。
      所以这两行不算动第 1 棒的版面:他定的是间距刻度与列宽,这里一格都没碰。
   .card 与 .flow__step 站上已经是 relative,重申一次不产生差异。 */
.card, .flow__step, .split__item, .usp__item, .qa__item,
.tenet, .vow, .deflist__item, .row {
  position: relative;
  isolation: isolate;
}

.ovp-imp {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}

/* ⚠️ 分印**不拉伸去铺满卡片**,而是固定 208px 压在卡片右下角。
   理由是这一套自己的规矩:格距就是调子。拉满的话 320 单位的画布要按
   每张卡片自己的长宽比缩放,首页四列卡(266 宽)与服务页两列(556 宽)
   会得到两个差一倍的格距 —— 同一个「第 2 项」在两页上浓淡不一样,
   「一套笔法」这句话当场破产。固定一个尺寸,全站每一枚分印在设备像素上
   几何完全相同,和闸上量过的那一张一模一样。
   208 是量出来的:最窄的卡片是 1024 档的四列(222px),208 放得下;
   375 档卡片 328px,min() 那一支也留了余量。 */
/* ⚠️ 这个负的 inset 也是看图才发现要加的。
   chip() 的右边 42% 是 ground(缘右侧那块「换成页面底色」的挡板),
   分印里 ground 被关掉 ⇒ 那 42% 是透明的。box 贴着卡片右边放时,
   这 42% 就变成卡片角上一片空地,材料够不到角,那道缘停在卡片中间,
   读出来是「底下浮着两小块东西」而不是「一个角上的处理」。
   所以把 box 往右推出去 76px,让那片空地大半挂到卡片外面,
   缘落在距卡片右边 ≈25px 的地方 —— 25px 读成一条边距,不读成一块空地。 */
.ovp-imp .ovp {
  position: absolute;
  inset-inline-end: -76px;
  inset-block-end: 0;
  inline-size: 240px;
  block-size: auto;
}

/* 窄屏(1024 档四列 222px、375 档 328px)同样放得下:
   240 的 box 推出去 76 ⇒ 卡片里只占 164px。 */

/* ⚠️ 这个罩是**落地后看图才发现要加**的,不是设计时想到的,记下来:
   chip() 是按「一块独立的版」构图的 —— 那片面从 viewBox 外面进来,
   在右边那道缘上停住。做独立样本时它的上边界与左边界就是版的边,是对的。
   压进卡片里就不对了:版的边落在卡片**内部**,于是右下角出现一个
   上边一道、左边一道的淡矩形 —— 正是「看得见的砖」,而且比 ground
   那块更难发现,因为它淡。第一版落地图上四张卡就是这样,像渲染坏了。
   罩把这两条边化开:材料从卡片的右下角**渗进来**,只在那道缘上停住。
   于是卡片里唯一一条被看见的硬边,是这一套用来判真伪的那道缘本身。
   ⚠️ 只化上边与左边。右边与下边**不化** —— 它们贴着卡片自己的边,
      卡片的边本来就该是硬的,化开反而像图没画完。 */
.ovp-imp .ovp {
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 62%),
                      linear-gradient(to right, transparent 0, #000 22%);
  mask-image: linear-gradient(to bottom, transparent 0, #000 62%),
              linear-gradient(to right, transparent 0, #000 22%);
  -webkit-mask-composite: source-in;
  mask-composite: intersect;
}

.ovp-imp .ovp * { vector-effect: non-scaling-stroke; }

/* 分印不画自己的底、罩,**也不画 ground**。
   ground 是「缘右侧换成页面底色」那块挡板。在评审图上它是对的;
   印在卡片里就不对了 —— 卡片是 --c-surface,页面是 --c-canvas,
   两者不同值,于是右下角会出现一块看得见的砖,正是前几棒躲了三轮的东西。
   去掉它之后,缘右侧露出的是卡片自己的底色 ⇒ 「那边没有场」这件事
   由**什么都没印**来说,比印一块别的颜色更对。 */
.ovp-imp .ovp-base,
.ovp-imp .ovp-veil,
.ovp-imp .ovp-ground { display: none; }

/* 分印的浓度(×0.55 左右)。
   它比场更淡不是因为它更不重要,是因为它离文字最近 ——
   一枚分印和它要标的那几十个字共用同一个 300px 见方的地方。
   形状差(纹向 / 套印方向 / 缺哪个角)在这个浓度上仍然分得开,
   因为区分靠的是**几何**,不是靠看得多清楚。 */
.ovp-imp .ovp-raster,
.ovp-imp .ovp-raster-2,
.ovp-imp .ovp-raster-3 { stroke-opacity: .055; }
.ovp-imp .ovp-plane   { fill-opacity: .026; }
.ovp-imp .ovp-plane-2 { fill-opacity: .042; }
.ovp-imp .ovp-plane-3 { fill-opacity: .032; }
.ovp-imp .ovp-edge-2  { stroke-opacity: .20; }
.ovp-imp .ovp-tab-2   { stroke-opacity: .17; }
.ovp-imp .ovp-ghost   { stroke-opacity: .10; }
.ovp-imp .ovp-strand  { stroke-opacity: .20; }
.ovp-imp .ovp-node-2  { stroke-opacity: .20; }
.ovp-imp .ovp-rule-2  { stroke-opacity: .17; }
.ovp-imp .ovp-seal    { fill-opacity: .30; }

[data-theme="dark"] .ovp-imp .ovp-raster,
[data-theme="dark"] .ovp-imp .ovp-raster-2,
[data-theme="dark"] .ovp-imp .ovp-raster-3 { stroke-opacity: .080; }
[data-theme="dark"] .ovp-imp .ovp-plane   { fill-opacity: .046; }
[data-theme="dark"] .ovp-imp .ovp-plane-2 { fill-opacity: .070; }
[data-theme="dark"] .ovp-imp .ovp-plane-3 { fill-opacity: .058; }
[data-theme="dark"] .ovp-imp .ovp-edge-2  { stroke-opacity: .26; }
[data-theme="dark"] .ovp-imp .ovp-tab-2   { stroke-opacity: .22; }

/* ── 方牌:沿用既有的 330 槽,只换里面的图 ─────────────────────── */
/* .figmark 的 inline-size: min(330px, 62vw) 由站上样式表给,这里不重申 ——
   重申就等于我在替第 1 棒定宽度。mark() 的画布正好是 330×110。 */
.figmark .ovp { display: block; inline-size: 100%; block-size: auto; }