base-paint 0.3.0 → 0.3.2

package/dist/style.js

@@ -16,6 +16,7 @@
  *   （`:root` 改写／Q14 禁入项／深色区 → 抛不导出的 `StyleSheetError`；D3 修订见 §8.11）。
  */
 import { chartsCss } from './charts.js';
+import { BODY_FONT_STACK } from './font.js';
 import { ACTION_BAR_DEFAULTS, TOAST_DEFAULTS } from './spec/index.js';
 import { CONTROL_STYLE_SECTIONS, CSS_VAR_TOKENS, STYLE_FORBIDDEN_TOKENS, STYLE_SHEET_ID } from './spec/style.js';
 export const STYLE_PREFIX = 'ilife-';
@@ -59,18 +60,13 @@ function rootBlock() {
     lines.push('}');
     return lines.join(LF);
 }
-/** 页级基座（非控件区）：**本票不产**。
- *  裁定 R7／施工单 B-D2(a)：页面壳／KPI／表格／回到顶部等**无闭集归属**的样式归 #104
+/** 页级基础（非控件区）：**本票不产**。
+ *  裁定 R7／施工单 B-D2(a)：共享页面模板／KPI／表格／回到顶部等**无闭集归属**的样式归 #104
  *  （区块组件 owner），#75 只产 11 token ＋ 8 个闭集样式区；`extraCss` 语义被
- *  契约 doc:299-300 限死（只许技能作用域 token 覆盖块），**不得**塞壳层样式。 */
+ *  契约 doc:299-300 限死（只许技能作用域 token 覆盖块），**不得**塞共享页面模板的样式。 */
 /** 主色 alpha 派生（`ghostBorderAlpha` 等）：RGB 与 `--blue` 同源（`#007aff`）。
  *  这是**派生字面量**、不是第二份 token 表（不新增 token 名，doc:299）。 */
 const BLUE_RGB = '0, 122, 255';
-/** 正文栈（H-06：首位 `"SF Pro Display"`，后接系统兜底＋`"Noto Sans SC"`）。
- *  **局部 CSS 常量**、不是 token（D-5 纪律：不新增 token 名）；等宽栈不动（D-13，各 `font-family: "SF Mono", monospace` 原样保留）。
- *  B1 原栈见 `docs/research/benchmark-visual-spec.md:105`（`body`）；按 #89 返修方案把 `"SF Pro Display"` 提首位、
- *  尾部补 `"Noto Sans SC"`（修前正文 computed 回落实测，CJK 渲染不变）；落点仅 `.ilife-help-shell`（T22：壳层样式归 #104，不得产 `body` 规则）。 */
-const BODY_FONT_STACK = '"SF Pro Display", -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif';
 /** 焦点环（视觉尺 H-20 强制项）：`:focus-visible` 覆盖全部可交互控件。 */
 function focusRing(selector) {
     return selector + ':focus-visible {' + LF + '  outline: 2px solid var(--blue);' + LF + '  outline-offset: 2px;' + LF + '}';
@@ -99,6 +95,13 @@ const SECTION_BUILDERS = {
         // 时靠换行分层，代价是把关闭按钮挤到第三行）。根因已由 `controls.ts` 的结构对齐修掉
         // （helpers 与静态产出器／旧层同构：`icon? + .toast-body(> .toast-title-row + detail) + .toast-close`），
         // 补丁一并删除 → 关闭按钮与标题恒同行。
+        // 卡面色（2026-09-12 用户裁定改用**老技能**版）：深色毛玻璃，逐值取自
+        // 老仓 `公共组件/assets/base.js:75` 的 `.hm-toast` 串——底色 rgba(28,28,30,.94)、
+        // 毛玻璃 blur(20px) saturate(180%)、主字 #f0f0f0、投影 0 10px 32px rgba(0,0,0,.32)
+        // ＋ 0 0 0 .5px rgba(255,255,255,.08) inset（原样的「无描边、靠内影收边」）。
+        // 几何（圆角 14px／内距 13-14-16／min 300／max 480／gap 12）与老仓逐值相同，本次不动。
+        // 取字面量而非 token：本卡是**深色面**，不随浅色 token 变——这是本次的唯一例外，记账见
+        // `docs/visual-spec-blocks.md` §B-12 的 2026-09-12 裁定行。
         '.' + p + 'toast {',
         '  display: flex;',
         '  align-items: flex-start;',
@@ -107,12 +110,14 @@ const SECTION_BUILDERS = {
         '  min-width: 300px;',
         '  max-width: 480px;',
         '  padding: 13px 14px 13px 16px;',
-        '  border: 1px solid var(--line);',
         '  border-radius: 14px;',
-        '  background: var(--card);',
-        '  color: var(--fg);',
-        '  box-shadow: var(--shadow);',
-        '  font-size: 12.5px;',
+        '  background: rgba(28, 28, 30, .94);',
+        '  -webkit-backdrop-filter: blur(20px) saturate(180%);',
+        '  backdrop-filter: blur(20px) saturate(180%);',
+        '  color: #f0f0f0;',
+        '  box-shadow: 0 10px 32px rgba(0, 0, 0, .32), 0 0 0 .5px rgba(255, 255, 255, .08) inset;',
+        // #567 J4（§5.2 正文 13 吸收 13／12.5）。
+        '  font-size: 13px;',
         '  line-height: 1.4;',
         '  font-feature-settings: "tnum";',
         '  pointer-events: auto;',
@@ -131,13 +136,16 @@ const SECTION_BUILDERS = {
         '    transform: none;',
         '  }',
         '}',
+        // 失败态：老仓没有卡面描边，失败由「❌ 图标 ＋ danger 徽章」承担；深色面上改由
+        // **内影那条 0.5px 细线换成功色系的红**来点一句（不新增描边、不改底色）。
         '.' + p + 'toast-danger {',
-        '  border-color: rgba(255, 59, 48, .38);',
+        '  box-shadow: 0 10px 32px rgba(0, 0, 0, .32), 0 0 0 .5px rgba(255, 59, 48, .45) inset;',
         '}',
         '.' + p + 'toast-icon {',
         '  flex: 0 0 auto;',
         '  padding-top: 1px;',
-        '  font-size: 20px;',
+        // #567 J4（§5.2 标题 18 吸收 17／18／20／22）：装饰字形 20→18。
+        '  font-size: 18px;',
         '  line-height: 1;',
         '}',
         // body 是 toast 的**唯一**内容列（静态产出器与 helpers 运行时同构，见 `controls.ts`
@@ -155,15 +163,16 @@ const SECTION_BUILDERS = {
         '}',
         '.' + p + 'toast-title {',
         '  margin-bottom: 2px;',
-        '  color: var(--fg);',
-        '  font-size: 12.5px;',
+        '  color: #fff;',
+        // #567 J4（§5.2 正文 13 吸收 13／12.5）。
+        '  font-size: 13px;',
         '  font-weight: 600;',
         '  line-height: 1.4;',
         '}',
         // 运行时详情（helpers 产出 `.ilife-toast-title-detail`，在 `.ilife-toast-body` 内）：
         // 与静态侧 `.ilife-toast-detail` **同排版**；此前的 `flex: 1 1 100%` 权宜补丁已随结构对齐删除。
         '.' + p + 'toast-title-detail {',
-        '  color: var(--fg2);',
+        '  color: #c8c8cc;',
         '  font-size: 11px;',
         '  font-weight: 400;',
         '  line-height: 1.5;',
@@ -172,41 +181,44 @@ const SECTION_BUILDERS = {
         '  flex-shrink: 0;',
         '  padding: 2px 8px;',
         '  border-radius: 999px;',
-        '  background: var(--soft);',
-        '  color: var(--blue2);',
-        '  font-size: 10px;',
+        '  background: rgba(255, 255, 255, .12);',
+        '  color: #c8c8cc;',
+        // #567 J4（§5.2 下限 11：10／10.5／11 一律抬到 11）。
+        '  font-size: 11px;',
         '  font-weight: 700;',
         '  letter-spacing: .02em;',
         '  line-height: 1.6;',
         '}',
         '.' + p + 'toast-chip-ok {',
-        '  background: rgba(52, 199, 89, .12);',
-        '  color: #1f8f3d;',
+        '  background: rgba(52, 199, 89, .18);',
+        '  color: #4dd96b;',
         '}',
         '.' + p + 'toast-chip-warn {',
-        '  background: rgba(255, 149, 0, .12);',
-        '  color: #b25000;',
+        '  background: rgba(255, 149, 0, .18);',
+        '  color: #ffb340;',
         '}',
         '.' + p + 'toast-chip-danger {',
-        '  background: rgba(255, 59, 48, .12);',
-        '  color: #c0392b;',
+        '  background: rgba(255, 59, 48, .18);',
+        '  color: #ff6961;',
         '}',
         '.' + p + 'toast-count {',
         '  flex-shrink: 0;',
         '  padding: 2px 8px;',
         '  border-radius: 8px;',
-        '  color: var(--fg3);',
-        '  font-size: 10px;',
+        '  background: rgba(255, 255, 255, .08);',
+        '  color: #c8c8cc;',
+        // #567 J4（§5.2 下限 11）。
+        '  font-size: 11px;',
         '  font-weight: 700;',
         '  font-variant-numeric: tabular-nums;',
         '}',
         '.' + p + 'toast-detail {',
-        '  color: var(--fg2);',
+        '  color: #c8c8cc;',
         '  font-size: 11px;',
         '  line-height: 1.5;',
         '}',
         '.' + p + 'toast-lines {',
-        '  color: var(--fg2);',
+        '  color: #c8c8cc;',
         '  font-size: 11px;',
         '  line-height: 1.55;',
         '  white-space: pre-wrap;',
@@ -215,10 +227,11 @@ const SECTION_BUILDERS = {
         '  margin: 6px 0 0;',
         '  padding: 8px 10px;',
         '  border-radius: 8px;',
-        '  background: var(--soft);',
-        '  color: var(--fg2);',
+        '  background: rgba(0, 0, 0, .32);',
+        '  color: #aeb0b8;',
         '  font-family: "SF Mono", monospace;',
-        '  font-size: 10.5px;',
+        // #567 J4（§5.2 下限 11）。
+        '  font-size: 11px;',
         '  line-height: 1.5;',
         '  white-space: pre-wrap;',
         '  max-height: 140px;',
@@ -229,11 +242,13 @@ const SECTION_BUILDERS = {
         '  padding: 2px 4px;',
         '  border: 0;',
         '  background: none;',
-        '  color: var(--ok);',
+        '  color: #4dd96b;',
         '  font-family: inherit;',
         '  font-size: 11px;',
         '  font-weight: 600;',
         '  cursor: pointer;',
+        '  -webkit-tap-highlight-color: transparent;',
+        '  touch-action: manipulation;',
         '}',
         '.' + p + 'toast-act:active {',
         '  opacity: .7;',
@@ -244,13 +259,16 @@ const SECTION_BUILDERS = {
         '  padding: 5px 9px;',
         '  border: 0;',
         '  border-radius: 8px;',
-        '  background: var(--soft);',
-        '  color: var(--blue2);',
+        '  background: rgba(255, 255, 255, .10);',
+        '  color: #34c759;',
         '  font-family: inherit;',
-        '  font-size: 10.5px;',
+        // #567 J4（§5.2 下限 11）。
+        '  font-size: 11px;',
         '  font-weight: 500;',
         '  white-space: nowrap;',
         '  cursor: pointer;',
+        '  -webkit-tap-highlight-color: transparent;',
+        '  touch-action: manipulation;',
         '}',
         focusRing('.' + p + 'toast-act'),
         focusRing('.' + p + 'toast-close'),
@@ -276,9 +294,18 @@ const SECTION_BUILDERS = {
         '  gap: 8px;',
         '  box-sizing: border-box;',
         '  margin: 12px 0;',
+        // 旧层冻结值（旧 `base.css:81-91`）。它只在**窄档**用得上：窄屏内容列本来就不到 520px，这条不生效；
+        // 桌面档由下方那条媒体查询放开到内容列宽（#238 用户 2026-09-13 二次裁定）。
         '  max-width: 520px;',
-        '  margin-left: auto;',
-        '  margin-right: auto;',
+        '}',
+        // #238（用户 2026-09-13 二次裁定「两个按钮平分宽度」）：桌面档**铺满内容列**，动作条里的整行
+        // （`.action-row-ghost` 的 `repeat(2, minmax(0, 1fr))`）随之按内容列平分——两颗按钮各占一半。
+        // 断点用样式表里既有的移动档分界 `TOAST_DEFAULTS.mobileMaxPx`（与 #249 那两处同源），
+        // 故 ≤820 的窄档逐像素不动。
+        '@media (min-width: ' + (TOAST_DEFAULTS.mobileMaxPx + 1) + 'px) {',
+        '  .' + p + 'action-bar {',
+        '    max-width: none;',
+        '  }',
         '}',
         '.' + p + 'action-row {',
         '  display: grid;',
@@ -286,7 +313,18 @@ const SECTION_BUILDERS = {
         '  gap: 8px;',
         '}',
         '.' + p + 'action-row-ghost {',
-        '  grid-template-columns: minmax(0, 1fr);',
+        // 复制按钮那一行**平分整行**（#247 用户 2026-09-12 返修）：两列而不是单列——单列只在「一行一颗」时
+        // 才好看，一旦有第二颗（复制数据 ＋ 复制日志）就变成「一颗铺满、一颗缩成内容宽」。列数取冻结
+        // `ACTION_BAR_DEFAULTS.evenRowPairs`（既有「偶数一行 2 个」的口径，不是新拍的数字）。
+        '  grid-template-columns: repeat(' + ACTION_BAR_DEFAULTS.evenRowPairs + ', minmax(0, 1fr));',
+        '}',
+        // #249：窄屏那档菜单**以整行做锚点**（同档 `copyButton` 区把包裹层改成 `position: static`）——
+        // 行盒＝内容宽，菜单 `left:0; right:0` 落进去就恒在视口内，与那颗按钮落在左格还是右格无关。
+        // 只在窄屏挂，桌面档的锚点仍是包裹层（菜单贴按钮右缘，用户已验收的样子不动）。
+        '@media (max-width: ' + TOAST_DEFAULTS.mobileMaxPx + 'px) {',
+        '  .' + p + 'action-row-ghost {',
+        '    position: relative;',
+        '  }',
         '}',
         '.' + p + 'action-btn {',
         '  display: inline-flex;',
@@ -303,6 +341,8 @@ const SECTION_BUILDERS = {
         '  font-weight: ' + ACTION_BAR_DEFAULTS.fontWeight + ';',
         '  line-height: 1;',
         '  cursor: pointer;',
+        '  -webkit-tap-highlight-color: transparent;',
+        '  touch-action: manipulation;',
         '}',
         '.' + p + 'action-btn-primary {',
         '  background: var(--blue);',
@@ -315,7 +355,14 @@ const SECTION_BUILDERS = {
         '.' + p + 'action-btn-ghost {',
         '  border-color: rgba(' + BLUE_RGB + ', ' + ACTION_BAR_DEFAULTS.ghostBorderAlpha + ');',
         '  background: var(--card);',
-        '  color: var(--blue);',
+        '  color: var(--blue2);',
+        '}',
+        // #179 触控目标：窄屏按钮抬到 44px。**#525 起两个宽档同值**（`minHeightPx` 40 → 44，见
+        // `spec/controls.ts`）；本条留在这里只为不动既有选择器与既有媒体查询。
+        '@media (max-width: ' + TOAST_DEFAULTS.mobileMaxPx + 'px) {',
+        '  .' + p + 'action-btn {',
+        '    min-height: 44px;',
+        '  }',
         '}',
         focusRing('.' + p + 'action-btn'),
     ].join(LF),
@@ -336,6 +383,8 @@ const SECTION_BUILDERS = {
         '  font-weight: ' + ACTION_BAR_DEFAULTS.fontWeight + ';',
         '  line-height: 1;',
         '  cursor: pointer;',
+        '  -webkit-tap-highlight-color: transparent;',
+        '  touch-action: manipulation;',
         '  transition: transform .45s cubic-bezier(.34, 1.56, .64, 1), background-color .2s ease;',
         '}',
         '.' + p + 'copy-btn-primary {',
@@ -345,7 +394,9 @@ const SECTION_BUILDERS = {
         '.' + p + 'copy-btn-ghost {',
         '  border-color: rgba(' + BLUE_RGB + ', ' + ACTION_BAR_DEFAULTS.ghostBorderAlpha + ');',
         '  background: var(--card);',
-        '  color: var(--blue);',
+        // #179 对比度：ghost 按钮是 12px 小字，`--blue` 在白底上 4.02:1 不到 AA 的 4.5:1
+        // → 换同族深一档的 `--blue2`（5.6:1）。实心按钮（白字压 `--blue`）不在本页，另账见交付报告。
+        '  color: var(--blue2);',
         '}',
         '.' + p + 'copy-btn-wide {',
         '  width: 100%;',
@@ -354,7 +405,7 @@ const SECTION_BUILDERS = {
         '  transform: scale(.96);',
         '}',
         // W3（H-16 双反馈的 CSS 侧）：复制成功态变绿。规格 `docs/visual-spec-help.md:195,197`
-        // 「按钮变绿进入 `copied` 态并跑 450ms 弹簧动画」；弹簧 = 基座 `transition: transform .45s
+        // 「按钮变绿进入 `copied` 态并跑 450ms 弹簧动画」；弹簧 = 基础 `transition: transform .45s
         // cubic-bezier(.34, 1.56, .64, 1)`（B1 `benchmark-visual-spec.md:279,645`），本节只补**变绿**。
         // 类名由**运行时**添加（`copied`，非 `ilife-` 前缀 → 不占样式区命名空间）；
         // 本票**不改** helpers 的复制反馈行为，移交落点见契约 §8.11.1 FX-75-11。
@@ -363,6 +414,172 @@ const SECTION_BUILDERS = {
         '  background: var(--ok);',
         '  color: var(--card);',
         '}',
+        // **禁用态必须看得出来**（#525 收口 · 两处公共债之一）：读页面没有写库日志，复制区按 #336
+        // 自动补的那颗「复制日志」带 `disabled` 属性、可**从 #336 起就没有任何置灰规则**——看着与
+        // 旁边那颗能点的按钮一模一样（`t524-改前读数.md` §7.1 第 3 条只核了属性、没核观感）。
+        //
+        // **#525 第二轮返修（禁用态只看得见、读不清）**：上一版照 HELP 页 `button.copy:disabled`
+        // 取 `opacity:.45` 压**整颗**按钮，实测有效文字色被混成 `#91b9e9` 压白底，对比度只有
+        // **2.03:1**（`.scratch/t525c/before.json`；读法＝把 opacity 混进底色后按 WCAG 相对亮度算）——
+        // 连 AA 大字的 3:1 都不到，等于把「禁用」写成了「看不清」。
+        // 改法＝**不压整颗**，改三处、各自都是一个信号：① 文字色换 `--fg3`；② 底压成 `--soft`；
+        // ③ 描边降到 `--line`（「蓝＝可点」这条信号只留在可点态）。`opacity` 恒 1（不继承、不叠乘）。
+        // 2.03 → 3.47 的两行读数落 `.scratch/t525c/disabled-contrast.json`，探针 `.scratch/t525c/probe.mjs` 可复跑。
+        '.' + p + 'copy-btn[disabled],',
+        '.' + p + 'copy-btn:disabled {',
+        '  opacity: 1;',
+        '  border-color: var(--line);',
+        '  background: var(--soft);',
+        '  color: var(--fg3);',
+        '  cursor: not-allowed;',
+        '}',
+        '.' + p + 'copy-btn[disabled]:active,',
+        '.' + p + 'copy-btn:disabled:active {',
+        '  transform: none;',
+        '}',
+        // #179 触控目标：窄屏按钮抬到 44px。**#525 起这条在两个宽档上是同一个值**（`minHeightPx`
+        // 由 40 提到 44，见 `spec/controls.ts`）——留在这里是为了不动既有选择器与既有媒体查询；
+        // 桌面档不再是 40px。
+        '@media (max-width: ' + TOAST_DEFAULTS.mobileMaxPx + 'px) {',
+        '  .' + p + 'copy-btn {',
+        '    min-height: 44px;',
+        '  }',
+        '}',
+        // ── 复制数据的三格式菜单（#247，2026-09-12 用户裁定「恢复老仓原样」）───────────────
+        // 逐值取自老仓 `卡路里/templates/crud_receipt.html`（可点版本 `2262fee1~1`）的 `.fmt-menu`／
+        // `.fmt-item`／`.fmt-item:hover`／`.fmt-item span` 四串；老仓的 `--border`／`--soft` 分别
+        // 对到本仓的 `--line`／`--soft`。**复用本区命名空间**（`CONTROL_STYLE_SECTIONS` 是冻结闭集，
+        // 不新增第 9 个区）；类名不对 `copy-btn` 用前缀相似的名字（`.copy-menu-btn` 会被
+        // `.copy-btn` 的规则一并命中，多出一圈胶囊底），故开合器只带 `copy-btn copy-btn-ghost` 两颗类。
+        // **偏离 1 处（记账）**：菜单圆角取 **14px**（老仓是 12px）——#89 R-9 的 H-10 把
+        // 全部非图表 CSS 的 `border-radius` 钉在 `{8px,14px,20px,999px,50%}`，12px 会让你越出闭集；
+        // 14px 是本仓既有卡片圆角（toast 同值），几何其余逐值不动（`bottom`／`right`／`min-width`／
+        // `max-width`／`padding`／投影／项内距与字号全取老仓）。
+        '.' + p + 'copy-menu-wrap {',
+        // 宽度**跟着轨道走**（#247 用户 2026-09-12 返修）：复制数据与复制日志在 ghost 行里**平分整行**
+        // （各占一格，见 `.action-row-ghost` 的两列），两颗宽高一致——不再出现「一颗铺满一行、一颗缩成
+        // 内容宽」的一胖一瘦。故这里**不写** `justify-self: start`（那会让本层缩成内容宽、连带按钮也缩）。
+        '  position: relative;',
+        '  display: flex;',
+        '  align-items: center;',
+        '  width: 100%;',
+        '}',
+        // 开合器按钮铺满自己那一格：菜单的 `right: 0` 才贴着按钮右缘（== 格子右缘），两格时居中偏右。
+        '.' + p + 'copy-menu-wrap > .' + p + 'copy-btn {',
+        '  width: 100%;',
+        '}',
+        // **#525 第二轮·三角用 CSS 画**（用户裁定第 5 条：符号顶替了设计）：
+        // 可见文字里的 `▾` 已从 `controls.ts` 的 `copyMenuHtml` 删掉（那句「可以选格式」改住 `aria-label`），
+        // 这里用 `border` 拼一个向下的小三角 ＋ `rotate(180deg)` 做开合态——**一个字符都不打**，
+        // 也就不会被字体／读屏／抓取器当成内容。画的规矩：零宽零高的盒子靠 `border-top` 出形，
+        // `margin-left: 6px` 与基础的 `gap: 6px` 同值（文字与三角的间距连两处取值都不新造）。
+        // 开合态由运行时加的 `.copy-menu-open` 落色（与菜单同一个类，不新增第二个开关）。
+        '.' + p + 'copy-menu-wrap > .' + p + 'copy-btn::after {',
+        '  content: "";',
+        '  width: 0;',
+        '  height: 0;',
+        '  margin-left: 6px;',
+        '  border-left: 4px solid transparent;',
+        '  border-right: 4px solid transparent;',
+        '  border-top: 5px solid currentColor;',
+        '  transition: transform .16s ease-out;',
+        '}',
+        '.copy-menu-open.' + p + 'copy-menu-wrap > .' + p + 'copy-btn::after {',
+        '  transform: rotate(180deg);',
+        '}',
+        '.' + p + 'copy-menu {',
+        '  position: absolute;',
+        '  bottom: calc(100% + 8px);',
+        '  right: 0;',
+        '  z-index: 20;',
+        '  min-width: 200px;',
+        // 浮层开合走 opacity（不是 `display`／`hidden`）：一是 CSS 过渡不被跳过，二是开合不重排整页。
+        // 关着时同时收掉命中，免得看不见的菜单项还能被点到；`visibility` 可过渡 ⇒ 收起仍有淡出。
+        '  box-sizing: border-box;',
+        '  max-width: calc(100vw - 32px);',
+        '  padding: 6px;',
+        '  border: 1px solid var(--line);',
+        '  border-radius: 14px;',
+        '  background: var(--card);',
+        '  box-shadow: 0 8px 24px rgba(0, 0, 0, .14);',
+        '  opacity: 0;',
+        '  visibility: hidden;',
+        '  pointer-events: none;',
+        '  transition: opacity .16s ease-out, visibility .16s ease-out;',
+        '}',
+        // 开着的那条：`copy-menu-open` 是**运行时**加的类（与 #121 的 `copied` 同口径——类名不加
+        // `ilife-` 前缀，故不占样式区命名空间，也不作为 `ilife-` 类名进跨文件检查）；选择器把裸类
+        // 排在**前**面，这样从 CSS 里扫出来的 `ilife-` 类名仍只有 `ilife-copy-menu`（T10 ② 认得出产出者）。
+        '.copy-menu-open.' + p + 'copy-menu {',
+        '  opacity: 1;',
+        '  visibility: visible;',
+        '  pointer-events: auto;',
+        '}',
+        '.' + p + 'copy-menu-item {',
+        // #152 返修：补最小高——老仓 `.fmt-item` 只写 `padding:10px 12px` ＋ 13px 字，算出来 37px，
+        // 低于本仓同区复制按钮的冻结最小值（`spec/controls.ts:297` 的 40px）。40 不另写一个数，
+        // 引用同一个定义地；窄屏那档仍由下面的 `min-height:44px` 抬起（老仓 `.fmt-item` 是 36px）。
+        '  min-height: ' + ACTION_BAR_DEFAULTS.minHeightPx + 'px;',
+        '  display: flex;',
+        '  justify-content: space-between;',
+        '  gap: 14px;',
+        '  width: 100%;',
+        '  padding: 10px 12px;',
+        '  border: none;',
+        '  border-radius: 8px;',
+        '  background: none;',
+        '  color: var(--fg);',
+        '  font-family: inherit;',
+        '  font-size: 13px;',
+        '  text-align: left;',
+        '  cursor: pointer;',
+        '  -webkit-tap-highlight-color: transparent;',
+        '  touch-action: manipulation;',
+        '}',
+        '.' + p + 'copy-menu-item:hover {',
+        '  background: var(--soft);',
+        '}',
+        // 标签（格式键）：显式一条——省得继承菜单项的既有值，也让「CSS 里每个类名都有产出者、
+        // 每个产出类名都有 CSS」这条跨文件检查两面都成立（`style.test.mjs` T10）。
+        '.' + p + 'copy-menu-item > .' + p + 'copy-menu-label {',
+        '  color: var(--fg);',
+        '  font-size: 13px;',
+        '}',
+        // 用途提示：老仓是 `.fmt-item span`（后代选择器，两项 span 都染 11px 灰）；本仓显式给类名，
+        // 标签那半仍取 13px／`--fg`（上一条）。选择器用 `>` ——本仓跨文件交叉检查按**整段选择器**比对。
+        // **返修**：字色由 `--fg3`（#86868b）改为 `--fg2`（#6e6e73）——11px 属正文，AA 要 4.5:1，
+        // 前者对白卡片仅 3.62:1、后者 5.07:1；与同批「12px ＋ `--fg3`」那 7 处改用的是同一个做法（#152）。
+        '.' + p + 'copy-menu-item > .' + p + 'copy-menu-hint {',
+        '  color: var(--fg2);',
+        '  font-size: 11px;',
+        '  white-space: nowrap;',
+        '}',
+        // #179 触控目标：窄屏菜单项抬到 44px（与复制按钮同一口径；老仓 `.fmt-item` 是 36px 上下）。
+        '@media (max-width: ' + TOAST_DEFAULTS.mobileMaxPx + 'px) {',
+        '  .' + p + 'copy-menu-item {',
+        '    min-height: 44px;',
+        '  }',
+        // 窄屏改**贴按钮算**（老仓那句「右对齐视口内,手机不超界」的落法）：桌面档按钮靠左，200px 的菜单
+        // 贴按钮会有一半越到屏幕左外；窄屏按钮在右半格，故改成
+        // 「宽 = 视口 − 左右各 16px、右缘贴按钮右缘」——既恒在视口内，又跟着按钮（滚动时不漂、不挡按钮），
+        // 也不会像 `position: fixed` 那样把浮层钉在视口底、压住别的正文。
+        //
+        // **#249 修正**：原先「宽 = 视口 − 32px ＋ 右缘贴按钮」只在按钮位于**右格**时成立；复制数据排在
+        // 复制日志前头（`renderActionBar` 的 ghost 行顺序），窄屏上它在**左格**，菜单右缘贴左格右缘 ⇒
+        // 菜单左缘跑到视口外 167px（390 实测 x=-167，三项的格式名全看不见）。修法：窄屏把锚点从**包裹层**
+        // 换成**整行**（行在这一档挂 `position: relative`，见 `actionBar` 区）；菜单 `left:0; right:0`
+        // 就落在行盒（＝内容宽 358）里，按钮在哪一格都在视口内，且仍是「跟着按钮走」的绝对定位浮层。
+        '  .' + p + 'copy-menu-wrap {',
+        '    position: static;',
+        '  }',
+        '  .' + p + 'copy-menu {',
+        '    left: 0;',
+        '    right: 0;',
+        '    width: auto;',
+        '    min-width: 0;',
+        '    max-width: none;',
+        '  }',
+        '}',
         focusRing('.' + p + 'copy-btn'),
     ].join(LF),
     /** statusBadge —— 类名产出者 `controls.ts:702-707`。
@@ -372,7 +589,7 @@ const SECTION_BUILDERS = {
      *  ok `#e6f7ec`／`#1f8c3d`、warn `#fff5e0`／`#a25b00`、danger `#fff0ee`／`#a83228`、
      *  empty `#f0f0f3`／`var(--fg2)`（empty 字色旧层 `base.css:228` 为 `#6e6e73`＝`--fg2` 解析值，底色为实色 `#f0f0f3`）。
      *  **返修 W2**：上一轮误用 `#1f8f3d`／`#b25000`（全仓无出处）＋ 12% alpha 底色，且注释谎称「沿用旧值」
-     *  → 已改回旧逐值，注释与实现一致（非 token 硬编码色按 D-5 以 CSS 常量落地，不新增 token 名）。 */
+     *  → 已改回旧逐值，注释与实现一致（非 token 硬编码色按 D-5 以 CSS 常量实施，不新增 token 名）。 */
     statusBadge: (p) => [
         '.' + p + 'status-badge {',
         '  display: inline-flex;',
@@ -414,14 +631,16 @@ const SECTION_BUILDERS = {
         '  color: var(--fg2);',
         '}',
         '.' + p + 'empty-icon {',
-        '  font-size: 40px;',
+        // #567 J4（§5.2 大数 28 吸收 26／28／32／40）：装饰图标 40→28。
+        '  font-size: 28px;',
         '  line-height: 1.2;',
         '  opacity: .5;',
         '}',
         '.' + p + 'empty-text {',
         '  margin-top: 8px;',
         '  color: var(--fg);',
-        '  font-size: 17px;',
+        // #567 J4（§5.2 标题 18 吸收 17／18／20／22）。
+        '  font-size: 18px;',
         '  font-weight: 600;',
         '}',
         '.' + p + 'empty-hint {',
@@ -493,7 +712,7 @@ const SECTION_BUILDERS = {
         '  margin: 0 auto;',
         '  padding: 32px 20px 80px;',
         '  color: var(--fg);',
-        // H-06 正文栈（局部常量 BODY_FONT_STACK，首位 "SF Pro Display"；不新增 token 名，等宽栈不动）。
+        // H-06 正文栈（唯一真相源 `src/font.ts` 的 BODY_FONT_STACK，首位 "SF Pro Display"；不新增 token 名，等宽栈不动）。
         '  font-family: ' + BODY_FONT_STACK + ';',
         '  font-feature-settings: "tnum";',
         '}',
@@ -580,6 +799,7 @@ const SECTION_BUILDERS = {
         '  font-size: 13px;',
         '  font-weight: 600;',
         '  cursor: pointer;',
+        '  touch-action: manipulation;',
         '}',
         '.' + p + 'help-shell-tab-icon {',
         '  font-size: 14px;',
@@ -702,6 +922,7 @@ const SECTION_BUILDERS = {
         '  font-size: 13px;',
         '  font-weight: 600;',
         '  cursor: pointer;',
+        '  touch-action: manipulation;',
         '  list-style: none;',
         '}',
         '.' + p + 'help-shell-sheet-summary::-webkit-details-marker {',
@@ -751,11 +972,13 @@ const SECTION_BUILDERS = {
         '  font-size: ' + ACTION_BAR_DEFAULTS.fontSizePx + 'px;',
         '  font-weight: ' + ACTION_BAR_DEFAULTS.fontWeight + ';',
         '  line-height: 1;',
-        // #121：H-16「跑 450ms 弹簧动画」——弹簧口径**逐字复用** `copyButton` 基座（B1
+        // #121：H-16「跑 450ms 弹簧动画」——弹簧口径**逐字复用** `copyButton` 基础（B1
         // `benchmark-visual-spec.md:279,645`：`transform .45s cubic-bezier(.34,1.56,.64,1)`），
         // 不新增机制、不新增关键帧；按下态同 `.ilife-copy-btn:active`（scale .96）。
         '  transition: transform .45s cubic-bezier(.34, 1.56, .64, 1), background-color .2s ease;',
         '  cursor: pointer;',
+        '  -webkit-tap-highlight-color: transparent;',
+        '  touch-action: manipulation;',
         '}',
         '.' + p + 'help-shell-btn:active {',
         '  transform: scale(.96);',
@@ -791,6 +1014,7 @@ const SECTION_BUILDERS = {
         '  font-size: 14px;',
         '  font-weight: 600;',
         '  cursor: pointer;',
+        '  touch-action: manipulation;',
         '}',
         '.' + p + 'help-shell-count {',
         '  color: var(--fg3);',
@@ -889,6 +1113,7 @@ const SECTION_BUILDERS = {
         '  font-size: 12px;',
         '  line-height: 1;',
         '  cursor: pointer;',
+        '  touch-action: manipulation;',
         '}',
         focusRing('.' + p + 'help-shell-tab-search-clear'),
         '.' + p + 'help-shell-page-hitcount {',
@@ -911,9 +1136,11 @@ const SECTION_BUILDERS = {
         '  font-size: 12px;',
         '  font-weight: 600;',
         '  line-height: 1;',
-        // #121：弹簧口径同 `copyButton` 基座（H-16「450ms 弹簧」），成功态 `.copied` 见上方 helpShell 区。
+        // #121：弹簧口径同 `copyButton` 基础（H-16「450ms 弹簧」），成功态 `.copied` 见上方 helpShell 区。
         '  transition: transform .45s cubic-bezier(.34, 1.56, .64, 1), background-color .2s ease;',
         '  cursor: pointer;',
+        '  -webkit-tap-highlight-color: transparent;',
+        '  touch-action: manipulation;',
         '}',
         '.' + p + 'help-shell-card-copy:active {',
         '  transform: scale(.96);',
@@ -974,6 +1201,7 @@ const SECTION_BUILDERS = {
         '  transition: opacity .2s ease;',
         '  z-index: 9998;',
         '  cursor: pointer;',
+        '  touch-action: manipulation;',
         '}',
         '.' + p + 'help-shell-btn-backtop-show {',
         '  opacity: 1;',
@@ -1038,7 +1266,7 @@ function normalizePrefix(input) {
 /** `extraCss` 违规错误：**不导出**（与 #74 `TemplateError`／#76 `bad-input` 同口径——
  *  冻结面 `SPEC_FROZEN_SURFACE` 无该运行时条目，调用方按 `name`／`code` 判定）。
  *  code 三值 = 契约 doc:299-300 三条「不得」的落点：
- *  `extra-css-root`（改写基座 `:root`）／`extra-css-forbidden-token`（Q14 禁入项）／
+ *  `extra-css-root`（改写基础 `:root`）／`extra-css-forbidden-token`（Q14 禁入项）／
  *  `extra-css-dark-scheme`（深色区选择器，doc:292）。 */
 class StyleSheetExtraCssError extends Error {
     code;
@@ -1049,7 +1277,7 @@ class StyleSheetExtraCssError extends Error {
     }
 }
 /** CSS 块注释剥除（`/* … *\/` → 空格）：**判定前先剥注释**——注释里的 `:root`／`--pink` 只是说明文字，
- *  不是「改写基座／引入禁入项」；反之注释**不能**藏住真实声明（`/*c*\/:root{}` 剥后仍命中）。 */
+ *  不是「改写基础／引入禁入项」；反之注释**不能**藏住真实声明（`/*c*\/:root{}` 剥后仍命中）。 */
 function stripCssComments(css) {
     return css.replace(/\/\*[\s\S]*?\*\//g, ' ');
 }
@@ -1062,9 +1290,9 @@ function hasBoundedToken(text, token) {
 }
 /** `extraCss` 三禁强制（**编排者返修裁定：D3 修订**，见契约 §8.11）。
  *
- *  理由：契约 doc:299-300 的三条「不得」（不得改写基座值／不得引入 Q14 禁入项／不得引入深色区）
+ *  理由：契约 doc:299-300 的三条「不得」（不得改写基础值／不得引入 Q14 禁入项／不得引入深色区）
  *  此前**无任何落点**（D3 原裁定「不校验、纯调用方责任」）→ 本票补最小强制：
- *  - (a) 含 `:root` 选择器 → 改写基座；
+ *  - (a) 含 `:root` 选择器 → 改写基础；
  *  - (b) 含 `STYLE_FORBIDDEN_TOKENS`（`--r-xl`／`--pink`）；
  *  - (c) 含深色区选择器（`[data-theme`／`prefers-color-scheme: dark`）。
  *  命中**任一**即抛错；**合法技能作用域覆盖块**（`.ilife-<skill>{--blue:…}`）照常通过。
@@ -1078,7 +1306,7 @@ function assertExtraCss(extraCss) {
     const code = stripCssComments(extraCss);
     // `:root` 是伪类名（CSS 伪类名大小写不敏感）→ 用 `/i` 拦住 `:ROOT` 之类的等价写法。
     if (/:root(?![A-Za-z0-9_-])/i.test(code)) {
-        throw new StyleSheetExtraCssError('extra-css-root', 'buildStyleSheet: extraCss 不得改写基座（命中 `:root` 选择器）；技能主题只许用 `.ilife-<skill>` 作用域覆盖块（契约 doc:299）');
+        throw new StyleSheetExtraCssError('extra-css-root', 'buildStyleSheet: extraCss 不得改写基础（命中 `:root` 选择器）；技能主题只许用 `.ilife-<skill>` 作用域覆盖块（契约 doc:299）');
     }
     for (const forbidden of STYLE_FORBIDDEN_TOKENS) {
         if (hasBoundedToken(code, forbidden)) {