@qijenchen/design-system 0.1.0-beta.84 → 0.1.0-beta.86

package/dist/tokens/categorical-color.js.map

@@ -1 +1 @@
-{"version":3,"file":"categorical-color.js","sources":["../../src/tokens/categorical-color.ts"],"sourcesContent":["/**\n * categorical-color.ts — Categorical 色相 SSOT(2026-06-04 codify)\n *\n * Tag / Avatar / Calendar 等「以色相做分類標籤」的元件,色彩 variant **一律消費此 SSOT**。\n * 目的:**variant 名 == primitive 色相名,1:1,零 offset** —— 根治「red variant 接到 deep-orange」\n * 這類 categorical-vs-semantic 混淆(2026-06-04 user 抓:red = 品牌紅 hue-25〔--brand #DF3232 同族〕\n * ≠ deep-orange hue-38 ≠ semantic --error〔= deep-orange〕。三者完全無關)。\n *\n * 世界級對照:\n * - Ant Design Tag preset colors —— 用原始色相名(red/orange/green/blue…)做 categorical labeling\n *   (https://ant.design/components/tag/)。本 DS Tag/Avatar 採此模型。\n * - Atlassian Color 原則 —— **categorical(裝飾)色 vs semantic(狀態)色必須分離**\n *   (https://atlassian.design/foundations/color):categorical `red` 用 `--color-red-*`,跟 semantic\n *   `--error`(= deep-orange)無關;把 error 色拿來當 categorical 標籤 = 反 pattern。\n *\n * ⚠️ Tailwind v4 掃描限制:class 字串**必須以字面形式出現在被掃描的 source**(本檔在 src/,會被掃),\n * 不可用 runtime function 拼字串(否則 `bg-[var(--color-orange-1)]` 不被生成 → silent 失效)。\n * 故本 SSOT 以**字面 const map** 提供;consumer `import` 後索引(cva 列 key 取值,保 VariantProps 型別)。\n *\n * 互動 state(solid dismiss hover/active)用 semantic `--{hue}-hover` / `--{hue}-active`\n * (dark-mode 方向 pre-computed,**不可**用 primitive step-5,否則 dark mode 反向)。12 色相皆已定義。\n *\n * **加色相**:加進 `CATEGORICAL_HUES` + 下列 5 個 map 各補一行字面值(key X 用 `--color-X-*`,1:1)。\n * **機械防線**:`scripts/categorical-color-invariants.mjs` I1(release:preflight 已 chain)強制 map 的 key X 的值含 `--color-X-`(名實一致,禁 offset;原引 hook 名不存在,2026-07-04 修)。\n */\n\n/** 12 個 categorical 色相(順序對齊 primitives.css / Storybook color token 列)。 */\nexport const CATEGORICAL_HUES = [\n  'blue',\n  'green',\n  'deep-orange',\n  'yellow',\n  'red',\n  'orange',\n  'amber',\n  'lime',\n  'turquoise',\n  'indigo',\n  'purple',\n  'magenta',\n] as const\n\nexport type CategoricalHue = (typeof CATEGORICAL_HUES)[number]\n\n/** neutral 不是色相(無 hue),用 secondary/foreground + neutral-9 solid,各 consumer 自處理(不在下列 map)。 */\nexport type CategoricalColor = CategoricalHue | 'neutral'\n\n/** subtle 模式 class:step-1 底 + step-7 字。key X 一律對 `--color-X-*`(1:1)。 */\nexport const CAT_SUBTLE: Record<CategoricalHue, string> = {\n  blue: 'bg-[var(--color-blue-1)] text-[var(--color-blue-7)]',\n  green: 'bg-[var(--color-green-1)] text-[var(--color-green-7)]',\n  'deep-orange': 'bg-[var(--color-deep-orange-1)] text-[var(--color-deep-orange-7)]',\n  yellow: 'bg-[var(--color-yellow-1)] text-[var(--color-yellow-7)]',\n  red: 'bg-[var(--color-red-1)] text-[var(--color-red-7)]',\n  orange: 'bg-[var(--color-orange-1)] text-[var(--color-orange-7)]',\n  amber: 'bg-[var(--color-amber-1)] text-[var(--color-amber-7)]',\n  lime: 'bg-[var(--color-lime-1)] text-[var(--color-lime-7)]',\n  turquoise: 'bg-[var(--color-turquoise-1)] text-[var(--color-turquoise-7)]',\n  indigo: 'bg-[var(--color-indigo-1)] text-[var(--color-indigo-7)]',\n  purple: 'bg-[var(--color-purple-1)] text-[var(--color-purple-7)]',\n  magenta: 'bg-[var(--color-magenta-1)] text-[var(--color-magenta-7)]',\n}\n\n/**\n * solid 模式 class:step-6 底 + on-emphasis 配對文字。\n * 文字色依「step-6 底亮度」分桶(WCAG ≥3:1 大粗字門檻,2026-06-04 user「以最低為原則」):\n *   - 夠深的色底 → `text-on-emphasis`(白):blue / deep-orange / red / turquoise / indigo / purple / magenta\n *   - 太亮的色底 → `text-on-emphasis-dark`(深):yellow / amber / orange / lime(白字連 3:1 都不過)\n *   - ★ green 例外:白字 2.47 連 3:1 都不過,但 user 拍板維持白字(綠底白字慣見觀感)= documented exception。\n * 對比為 oklch→相對亮度實測(scripts/categorical-color-invariants.mjs 機械驗,green 列 exempt)。\n */\nexport const CAT_SOLID: Record<CategoricalHue, string> = {\n  blue: 'bg-[var(--color-blue-6)] text-on-emphasis',\n  green: 'bg-[var(--color-green-6)] text-on-emphasis', // ★白字 documented exception(實測 2.47 < 3:1)\n  'deep-orange': 'bg-[var(--color-deep-orange-6)] text-on-emphasis',\n  yellow: 'bg-[var(--color-yellow-6)] text-on-emphasis-dark',\n  red: 'bg-[var(--color-red-6)] text-on-emphasis',\n  orange: 'bg-[var(--color-orange-6)] text-on-emphasis-dark',\n  amber: 'bg-[var(--color-amber-6)] text-on-emphasis-dark',\n  lime: 'bg-[var(--color-lime-6)] text-on-emphasis-dark',\n  turquoise: 'bg-[var(--color-turquoise-6)] text-on-emphasis',\n  indigo: 'bg-[var(--color-indigo-6)] text-on-emphasis',\n  purple: 'bg-[var(--color-purple-6)] text-on-emphasis',\n  magenta: 'bg-[var(--color-magenta-6)] text-on-emphasis',\n}\n\n/** solid 互動(dismiss hover/active)— semantic dark-mode-aware token。 */\nexport const CAT_INTERACT: Record<CategoricalHue, { hover: string; active: string }> = {\n  blue: { hover: 'var(--blue-hover)', active: 'var(--blue-active)' },\n  green: { hover: 'var(--green-hover)', active: 'var(--green-active)' },\n  'deep-orange': { hover: 'var(--deep-orange-hover)', active: 'var(--deep-orange-active)' },\n  yellow: { hover: 'var(--yellow-hover)', active: 'var(--yellow-active)' },\n  red: { hover: 'var(--red-hover)', active: 'var(--red-active)' },\n  orange: { hover: 'var(--orange-hover)', active: 'var(--orange-active)' },\n  amber: { hover: 'var(--amber-hover)', active: 'var(--amber-active)' },\n  lime: { hover: 'var(--lime-hover)', active: 'var(--lime-active)' },\n  turquoise: { hover: 'var(--turquoise-hover)', active: 'var(--turquoise-active)' },\n  indigo: { hover: 'var(--indigo-hover)', active: 'var(--indigo-active)' },\n  purple: { hover: 'var(--purple-hover)', active: 'var(--purple-active)' },\n  magenta: { hover: 'var(--magenta-hover)', active: 'var(--magenta-active)' },\n}\n\n/** Avatar style 物件用:subtle / solid 的 raw token { bg, text }(非 class)。 */\nexport const CAT_SUBTLE_TOKENS: Record<CategoricalHue, { bg: string; text: string }> = {\n  blue: { bg: 'var(--color-blue-1)', text: 'var(--color-blue-7)' },\n  green: { bg: 'var(--color-green-1)', text: 'var(--color-green-7)' },\n  'deep-orange': { bg: 'var(--color-deep-orange-1)', text: 'var(--color-deep-orange-7)' },\n  yellow: { bg: 'var(--color-yellow-1)', text: 'var(--color-yellow-7)' },\n  red: { bg: 'var(--color-red-1)', text: 'var(--color-red-7)' },\n  orange: { bg: 'var(--color-orange-1)', text: 'var(--color-orange-7)' },\n  amber: { bg: 'var(--color-amber-1)', text: 'var(--color-amber-7)' },\n  lime: { bg: 'var(--color-lime-1)', text: 'var(--color-lime-7)' },\n  turquoise: { bg: 'var(--color-turquoise-1)', text: 'var(--color-turquoise-7)' },\n  indigo: { bg: 'var(--color-indigo-1)', text: 'var(--color-indigo-7)' },\n  purple: { bg: 'var(--color-purple-1)', text: 'var(--color-purple-7)' },\n  magenta: { bg: 'var(--color-magenta-1)', text: 'var(--color-magenta-7)' },\n}\n// 同 CAT_SOLID 的文字分桶(白 / 深),raw token 版供 Avatar style 物件用。green = ★白字 exception。\nexport const CAT_SOLID_TOKENS: Record<CategoricalHue, { bg: string; text: string }> = {\n  blue: { bg: 'var(--color-blue-6)', text: 'var(--on-emphasis)' },\n  green: { bg: 'var(--color-green-6)', text: 'var(--on-emphasis)' }, // ★白字 documented exception\n  'deep-orange': { bg: 'var(--color-deep-orange-6)', text: 'var(--on-emphasis)' },\n  yellow: { bg: 'var(--color-yellow-6)', text: 'var(--on-emphasis-dark)' },\n  red: { bg: 'var(--color-red-6)', text: 'var(--on-emphasis)' },\n  orange: { bg: 'var(--color-orange-6)', text: 'var(--on-emphasis-dark)' },\n  amber: { bg: 'var(--color-amber-6)', text: 'var(--on-emphasis-dark)' },\n  lime: { bg: 'var(--color-lime-6)', text: 'var(--on-emphasis-dark)' },\n  turquoise: { bg: 'var(--color-turquoise-6)', text: 'var(--on-emphasis)' },\n  indigo: { bg: 'var(--color-indigo-6)', text: 'var(--on-emphasis)' },\n  purple: { bg: 'var(--color-purple-6)', text: 'var(--on-emphasis)' },\n  magenta: { bg: 'var(--color-magenta-6)', text: 'var(--on-emphasis)' },\n}\n\n/** Calendar event tile:subtle 底 + hover step-2(1:1)。 */\nexport const CAT_EVENT: Record<CategoricalHue, string> = {\n  blue: 'bg-[var(--color-blue-1)] text-[var(--color-blue-7)] hover:bg-[var(--color-blue-2)]',\n  green: 'bg-[var(--color-green-1)] text-[var(--color-green-7)] hover:bg-[var(--color-green-2)]',\n  'deep-orange': 'bg-[var(--color-deep-orange-1)] text-[var(--color-deep-orange-7)] hover:bg-[var(--color-deep-orange-2)]',\n  yellow: 'bg-[var(--color-yellow-1)] text-[var(--color-yellow-7)] hover:bg-[var(--color-yellow-2)]',\n  red: 'bg-[var(--color-red-1)] text-[var(--color-red-7)] hover:bg-[var(--color-red-2)]',\n  orange: 'bg-[var(--color-orange-1)] text-[var(--color-orange-7)] hover:bg-[var(--color-orange-2)]',\n  amber: 'bg-[var(--color-amber-1)] text-[var(--color-amber-7)] hover:bg-[var(--color-amber-2)]',\n  lime: 'bg-[var(--color-lime-1)] text-[var(--color-lime-7)] hover:bg-[var(--color-lime-2)]',\n  turquoise: 'bg-[var(--color-turquoise-1)] text-[var(--color-turquoise-7)] hover:bg-[var(--color-turquoise-2)]',\n  indigo: 'bg-[var(--color-indigo-1)] text-[var(--color-indigo-7)] hover:bg-[var(--color-indigo-2)]',\n  purple: 'bg-[var(--color-purple-1)] text-[var(--color-purple-7)] hover:bg-[var(--color-purple-2)]',\n  magenta: 'bg-[var(--color-magenta-1)] text-[var(--color-magenta-7)] hover:bg-[var(--color-magenta-2)]',\n}\n\n/** Calendar all-day accent:左側 step-6 實心條。 */\nexport const CAT_ACCENT: Record<CategoricalHue, string> = {\n  blue: 'border-l-[3px] border-[var(--color-blue-6)]',\n  green: 'border-l-[3px] border-[var(--color-green-6)]',\n  'deep-orange': 'border-l-[3px] border-[var(--color-deep-orange-6)]',\n  yellow: 'border-l-[3px] border-[var(--color-yellow-6)]',\n  red: 'border-l-[3px] border-[var(--color-red-6)]',\n  orange: 'border-l-[3px] border-[var(--color-orange-6)]',\n  amber: 'border-l-[3px] border-[var(--color-amber-6)]',\n  lime: 'border-l-[3px] border-[var(--color-lime-6)]',\n  turquoise: 'border-l-[3px] border-[var(--color-turquoise-6)]',\n  indigo: 'border-l-[3px] border-[var(--color-indigo-6)]',\n  purple: 'border-l-[3px] border-[var(--color-purple-6)]',\n  magenta: 'border-l-[3px] border-[var(--color-magenta-6)]',\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"categorical-color.js","sources":["../../src/tokens/categorical-color.ts"],"sourcesContent":["/**\n * categorical-color.ts — Categorical 色相 SSOT(2026-06-04 codify)\n *\n * Tag / Avatar / Calendar 等「以色相做分類標籤」的元件,色彩 variant **一律消費此 SSOT**。\n * 目的:**variant 名 == primitive 色相名,1:1,零 offset** —— 根治「red variant 接到 deep-orange」\n * 這類 categorical-vs-semantic 混淆(2026-06-04 user 抓:red = 品牌紅 hue-25〔--brand #DF3232 同族〕\n * ≠ deep-orange hue-38 ≠ semantic --error〔= deep-orange〕。三者完全無關)。\n *\n * 世界級對照:\n * - Ant Design Tag preset colors —— 用原始色相名(red/orange/green/blue…)做 categorical labeling\n *   (https://ant.design/components/tag/)。本 DS Tag/Avatar 採此模型。\n * - Atlassian Color 原則 —— **categorical(裝飾)色 vs semantic(狀態)色必須分離**\n *   (https://atlassian.design/foundations/color):categorical `red` 用 `--color-red-*`,跟 semantic\n *   `--error`(= deep-orange)無關;把 error 色拿來當 categorical 標籤 = 反 pattern。\n *\n * ⚠️ Tailwind v4 掃描限制:class 字串**必須以字面形式出現在被掃描的 source**(本檔在 src/,會被掃),\n * 不可用 runtime function 拼字串(否則 `bg-[var(--color-orange-1)]` 不被生成 → silent 失效)。\n * 故本 SSOT 以**字面 const map** 提供;consumer `import` 後索引(cva 列 key 取值,保 VariantProps 型別)。\n *\n * 互動 state(solid dismiss hover/active)用 semantic `--{hue}-hover` / `--{hue}-active`\n * (dark-mode 方向 pre-computed,**不可**用 primitive step-5,否則 dark mode 反向)。12 色相皆已定義。\n *\n * **加色相**:加進 `CATEGORICAL_HUES` + 下列 5 個 map 各補一行字面值(key X 用 `--color-X-*`,1:1)。\n * **機械防線**:`scripts/categorical-color-invariants.mjs` I1(release:preflight 已 chain)強制 map 的 key X 的值含 `--color-X-`(名實一致,禁 offset;原引 hook 名不存在,2026-07-04 修)。\n */\n\n/** 12 個 categorical 色相。⚠️ 順序 = **categorical 指派序**(圖表系列鄰色最大區辨:blue→green→deep-orange→yellow→red…),**非** primitives.css 檔內宣告序 — 兩者本就不同,map 以名為 key 故功能無涉;**禁**為「對齊」重排(重排 = 圖表系列換色 = 視覺 breaking)。 */\nexport const CATEGORICAL_HUES = [\n  'blue',\n  'green',\n  'deep-orange',\n  'yellow',\n  'red',\n  'orange',\n  'amber',\n  'lime',\n  'turquoise',\n  'indigo',\n  'purple',\n  'magenta',\n] as const\n\nexport type CategoricalHue = (typeof CATEGORICAL_HUES)[number]\n\n/** neutral 不是色相(無 hue),用 secondary/foreground + neutral-9 solid,各 consumer 自處理(不在下列 map)。 */\nexport type CategoricalColor = CategoricalHue | 'neutral'\n\n/** subtle 模式 class:step-1 底 + step-7 字。key X 一律對 `--color-X-*`(1:1)。 */\nexport const CAT_SUBTLE: Record<CategoricalHue, string> = {\n  blue: 'bg-[var(--color-blue-1)] text-[var(--color-blue-7)]',\n  green: 'bg-[var(--color-green-1)] text-[var(--color-green-7)]',\n  'deep-orange': 'bg-[var(--color-deep-orange-1)] text-[var(--color-deep-orange-7)]',\n  yellow: 'bg-[var(--color-yellow-1)] text-[var(--color-yellow-7)]',\n  red: 'bg-[var(--color-red-1)] text-[var(--color-red-7)]',\n  orange: 'bg-[var(--color-orange-1)] text-[var(--color-orange-7)]',\n  amber: 'bg-[var(--color-amber-1)] text-[var(--color-amber-7)]',\n  lime: 'bg-[var(--color-lime-1)] text-[var(--color-lime-7)]',\n  turquoise: 'bg-[var(--color-turquoise-1)] text-[var(--color-turquoise-7)]',\n  indigo: 'bg-[var(--color-indigo-1)] text-[var(--color-indigo-7)]',\n  purple: 'bg-[var(--color-purple-1)] text-[var(--color-purple-7)]',\n  magenta: 'bg-[var(--color-magenta-1)] text-[var(--color-magenta-7)]',\n}\n\n/**\n * solid 模式 class:step-6 底 + on-emphasis 配對文字。\n * 文字色依「step-6 底亮度」分桶(WCAG ≥3:1 大粗字門檻,2026-06-04 user「以最低為原則」):\n *   - 夠深的色底 → `text-on-emphasis`(白):blue / deep-orange / red / indigo / purple / magenta\n *   - 太亮的色底 → `text-on-emphasis-dark`(深):yellow / amber / orange / lime / turquoise(白字連 3:1 都不過;turquoise 2026-07-16 dark 色相修正後 L=0.68 白字 2.77 → 切深字,兩 mode 5.65/6.47 全過)\n *   - ★ green 例外:白字 2.47 連 3:1 都不過,但 user 拍板維持白字(綠底白字慣見觀感)= documented exception。\n * 對比為 oklch→相對亮度實測(scripts/categorical-color-invariants.mjs 機械驗,green 列 exempt)。\n */\nexport const CAT_SOLID: Record<CategoricalHue, string> = {\n  blue: 'bg-[var(--color-blue-6)] text-on-emphasis',\n  green: 'bg-[var(--color-green-6)] text-on-emphasis', // ★白字 documented exception(實測 2.47 < 3:1)\n  'deep-orange': 'bg-[var(--color-deep-orange-6)] text-on-emphasis',\n  yellow: 'bg-[var(--color-yellow-6)] text-on-emphasis-dark',\n  red: 'bg-[var(--color-red-6)] text-on-emphasis',\n  orange: 'bg-[var(--color-orange-6)] text-on-emphasis-dark',\n  amber: 'bg-[var(--color-amber-6)] text-on-emphasis-dark',\n  lime: 'bg-[var(--color-lime-6)] text-on-emphasis-dark',\n  turquoise: 'bg-[var(--color-turquoise-6)] text-on-emphasis-dark',\n  indigo: 'bg-[var(--color-indigo-6)] text-on-emphasis',\n  purple: 'bg-[var(--color-purple-6)] text-on-emphasis',\n  magenta: 'bg-[var(--color-magenta-6)] text-on-emphasis',\n}\n\n/** solid 互動(dismiss hover/active)— semantic dark-mode-aware token。 */\nexport const CAT_INTERACT: Record<CategoricalHue, { hover: string; active: string }> = {\n  blue: { hover: 'var(--blue-hover)', active: 'var(--blue-active)' },\n  green: { hover: 'var(--green-hover)', active: 'var(--green-active)' },\n  'deep-orange': { hover: 'var(--deep-orange-hover)', active: 'var(--deep-orange-active)' },\n  yellow: { hover: 'var(--yellow-hover)', active: 'var(--yellow-active)' },\n  red: { hover: 'var(--red-hover)', active: 'var(--red-active)' },\n  orange: { hover: 'var(--orange-hover)', active: 'var(--orange-active)' },\n  amber: { hover: 'var(--amber-hover)', active: 'var(--amber-active)' },\n  lime: { hover: 'var(--lime-hover)', active: 'var(--lime-active)' },\n  turquoise: { hover: 'var(--turquoise-hover)', active: 'var(--turquoise-active)' },\n  indigo: { hover: 'var(--indigo-hover)', active: 'var(--indigo-active)' },\n  purple: { hover: 'var(--purple-hover)', active: 'var(--purple-active)' },\n  magenta: { hover: 'var(--magenta-hover)', active: 'var(--magenta-active)' },\n}\n\n/** Avatar style 物件用:subtle / solid 的 raw token { bg, text }(非 class)。 */\nexport const CAT_SUBTLE_TOKENS: Record<CategoricalHue, { bg: string; text: string }> = {\n  blue: { bg: 'var(--color-blue-1)', text: 'var(--color-blue-7)' },\n  green: { bg: 'var(--color-green-1)', text: 'var(--color-green-7)' },\n  'deep-orange': { bg: 'var(--color-deep-orange-1)', text: 'var(--color-deep-orange-7)' },\n  yellow: { bg: 'var(--color-yellow-1)', text: 'var(--color-yellow-7)' },\n  red: { bg: 'var(--color-red-1)', text: 'var(--color-red-7)' },\n  orange: { bg: 'var(--color-orange-1)', text: 'var(--color-orange-7)' },\n  amber: { bg: 'var(--color-amber-1)', text: 'var(--color-amber-7)' },\n  lime: { bg: 'var(--color-lime-1)', text: 'var(--color-lime-7)' },\n  turquoise: { bg: 'var(--color-turquoise-1)', text: 'var(--color-turquoise-7)' },\n  indigo: { bg: 'var(--color-indigo-1)', text: 'var(--color-indigo-7)' },\n  purple: { bg: 'var(--color-purple-1)', text: 'var(--color-purple-7)' },\n  magenta: { bg: 'var(--color-magenta-1)', text: 'var(--color-magenta-7)' },\n}\n// 同 CAT_SOLID 的文字分桶(白 / 深),raw token 版供 Avatar style 物件用。green = ★白字 exception。\nexport const CAT_SOLID_TOKENS: Record<CategoricalHue, { bg: string; text: string }> = {\n  blue: { bg: 'var(--color-blue-6)', text: 'var(--on-emphasis)' },\n  green: { bg: 'var(--color-green-6)', text: 'var(--on-emphasis)' }, // ★白字 documented exception\n  'deep-orange': { bg: 'var(--color-deep-orange-6)', text: 'var(--on-emphasis)' },\n  yellow: { bg: 'var(--color-yellow-6)', text: 'var(--on-emphasis-dark)' },\n  red: { bg: 'var(--color-red-6)', text: 'var(--on-emphasis)' },\n  orange: { bg: 'var(--color-orange-6)', text: 'var(--on-emphasis-dark)' },\n  amber: { bg: 'var(--color-amber-6)', text: 'var(--on-emphasis-dark)' },\n  lime: { bg: 'var(--color-lime-6)', text: 'var(--on-emphasis-dark)' },\n  turquoise: { bg: 'var(--color-turquoise-6)', text: 'var(--on-emphasis-dark)' },\n  indigo: { bg: 'var(--color-indigo-6)', text: 'var(--on-emphasis)' },\n  purple: { bg: 'var(--color-purple-6)', text: 'var(--on-emphasis)' },\n  magenta: { bg: 'var(--color-magenta-6)', text: 'var(--on-emphasis)' },\n}\n\n/** Calendar event tile:subtle 底 + hover step-2(1:1)。 */\nexport const CAT_EVENT: Record<CategoricalHue, string> = {\n  blue: 'bg-[var(--color-blue-1)] text-[var(--color-blue-7)] hover:bg-[var(--color-blue-2)]',\n  green: 'bg-[var(--color-green-1)] text-[var(--color-green-7)] hover:bg-[var(--color-green-2)]',\n  'deep-orange': 'bg-[var(--color-deep-orange-1)] text-[var(--color-deep-orange-7)] hover:bg-[var(--color-deep-orange-2)]',\n  yellow: 'bg-[var(--color-yellow-1)] text-[var(--color-yellow-7)] hover:bg-[var(--color-yellow-2)]',\n  red: 'bg-[var(--color-red-1)] text-[var(--color-red-7)] hover:bg-[var(--color-red-2)]',\n  orange: 'bg-[var(--color-orange-1)] text-[var(--color-orange-7)] hover:bg-[var(--color-orange-2)]',\n  amber: 'bg-[var(--color-amber-1)] text-[var(--color-amber-7)] hover:bg-[var(--color-amber-2)]',\n  lime: 'bg-[var(--color-lime-1)] text-[var(--color-lime-7)] hover:bg-[var(--color-lime-2)]',\n  turquoise: 'bg-[var(--color-turquoise-1)] text-[var(--color-turquoise-7)] hover:bg-[var(--color-turquoise-2)]',\n  indigo: 'bg-[var(--color-indigo-1)] text-[var(--color-indigo-7)] hover:bg-[var(--color-indigo-2)]',\n  purple: 'bg-[var(--color-purple-1)] text-[var(--color-purple-7)] hover:bg-[var(--color-purple-2)]',\n  magenta: 'bg-[var(--color-magenta-1)] text-[var(--color-magenta-7)] hover:bg-[var(--color-magenta-2)]',\n}\n\n/** Calendar all-day accent:左側 step-6 實心條。 */\nexport const CAT_ACCENT: Record<CategoricalHue, string> = {\n  blue: 'border-l-[3px] border-[var(--color-blue-6)]',\n  green: 'border-l-[3px] border-[var(--color-green-6)]',\n  'deep-orange': 'border-l-[3px] border-[var(--color-deep-orange-6)]',\n  yellow: 'border-l-[3px] border-[var(--color-yellow-6)]',\n  red: 'border-l-[3px] border-[var(--color-red-6)]',\n  orange: 'border-l-[3px] border-[var(--color-orange-6)]',\n  amber: 'border-l-[3px] border-[var(--color-amber-6)]',\n  lime: 'border-l-[3px] border-[var(--color-lime-6)]',\n  turquoise: 'border-l-[3px] border-[var(--color-turquoise-6)]',\n  indigo: 'border-l-[3px] border-[var(--color-indigo-6)]',\n  purple: 'border-l-[3px] border-[var(--color-purple-6)]',\n  magenta: 'border-l-[3px] border-[var(--color-magenta-6)]',\n}\n"],"names":[],"mappings":"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"}

package/ds-canonical/fork/AGENTS.md

@@ -0,0 +1,213 @@
+> **Generated(禁手改)**:本檔由 `build-fork-governance.mjs` 從 DS repo root `AGENTS.md` 投影(path 已改 node_modules 視角);隨 DS 發版重生,fork 端以 npm / `npm run sync-all` 取得最新。
+> **你是 FORK PRODUCT 開發者**:遵循檔內設計紀律(mindset / SSOT 消費 / 命名 / 4-Family / 稽核觀念);**忽略 DS-author 的發版/治理維護鏈**(`release:preflight` / tag / npm publish / codex-collab / DS `scripts/*.mjs` gate — 那是 DS 維護者的);git 節奏照 fork 的「預覽 → 確認 → 上線」(詳本 repo CLAUDE.md)。Deep detail → `node_modules/@qijenchen/design-system/ds-canonical/`。
+
+# 本專案 AI 治理核心(provider-neutral;AGENTS.md 開放標準)
+
+**本檔為所有 AI agent 的治理 SSOT bootstrap**:Codex 等支援 AGENTS.md 標準的 agent 原生載入;Claude Code 經 `CLAUDE.md` 的 `@AGENTS.md` import 載入同一份(Anthropic 官方共用模式)。增刪改治理核心**只改本檔**,兩邊自動同步。
+**最終 authority 不是本檔**:本檔引導行為;不可繞過的強制層 = `npm run release:preflight`(~30 deterministic gates)+ CI(release.yml / ci.yml)。**任何 provider 產出的不合規變更都無法通過 preflight/CI 發佈**。Claude 另有 write-time hooks 加速回饋(`.claude/hooks/`,provider 專屬加速器,非信任邊界)。
+
+# 每次任務前的 6 條 mindset(世界級設計系統的工作底色)
+
+這 6 條是本專案所有規則背後的**態度**。接到任務先複習一遍,再看具體規則。
+
+1. **對標世界級 + 不取巧省工**——每個設計決策都要能回答「Polaris / Material / Atlassian / Ant / Carbon / Apple HIG 怎麼做?」沒對齊又說不出理由 = 設計 bug。視覺整齊度不輸原版 + 符合 DS 語言**同時成立**。**禁止以「選較簡單」「省 N edits」為由選 shortcut**——一律最世界級做法。說「快速修」「省工程」是 yellow flag,停下重想。
+2. **不憑直覺發明 / 優先消費既有**——新增任何值 / 名 / pattern / variant / layout primitive 前先 `grep` 既有。**強制 `# SSOT 消費 canonical` 清單**——寫視覺 code 前列消費的 components/patterns/tokens/spec。提建議也算定 pattern,給 option 必對照 DS canonical + ≥3 家世界級。**禁止憑印象列部分家**。
+3. **改一處必看三處**——code / spec / story 三方聯動。改 cva `defaultVariants` / variant / token 前先 grep 該元件所有檔案,一次改完。
+4. **範例必真實業務場景**——Jira / Stripe / Notion / Figma 可辨識情境;禁 `Option A/B/C`、「按鈕一」、極端不現實、ASCII art。
+5. **猶豫就問**——無前例的決策:grep 既有 → 讀近親 spec → 仍不確定停下問。**禁止憑直覺造新 pattern**。
+6. **大原則吸收瑣碎**——同類 bug 反覆糾正 = meta 層沒抓住。見 `node_modules/@qijenchen/design-system/ds-canonical/rules/meta-patterns.md` 31 active M-rules(M1-M32,M27/M33/M34/M35 retired,折入 M20/M7/M23(c)(d))。**AI 不需 user 提醒才找 root invariant**——rule 震盪 → AI 自跑 M12 benchmark + invariant test。User 第 2 次問 → 必截圖 verify(M13)。對話結論 → AUTO 5-layer pipeline(M14)。Visual / behavior decision 前必先 WebFetch ≥ 3 source(M26)。Solo-work git ops 必先 grep canonical(M28)。**視覺/結構 propose 前必 grep DS spec.md 找 owner SSOT(M29)— 出 3-column 表;否則提案不被接受**。使用者 tell me once 不該要 tell me twice。
+
+完整 M-rules 詳 `node_modules/@qijenchen/design-system/ds-canonical/rules/meta-patterns.md`(必讀)。
+
+# Rule Index(progressive disclosure — 編對應檔案前必先讀)
+
+| 檔案 | 何時必讀 |
+|---|---|
+| `node_modules/@qijenchen/design-system/ds-canonical/rules/meta-patterns.md` | 每個任務(31 條 M-rules,fundamental)|
+| `node_modules/@qijenchen/design-system/ds-canonical/rules/spec-rules.md` | 編任何 `*.spec.md` 或 DS 內容 |
+| `node_modules/@qijenchen/design-system/ds-canonical/rules/ui-development.md` | 編任何 `.tsx`/`.ts`(Tailwind 5 條 / Token 4 條 / Props 命名 / shadcn / public-vs-internal)|
+| `node_modules/@qijenchen/design-system/ds-canonical/rules/story-rules.md` | 編任何 `*.stories.tsx`(三層定位 / Title / 範例準則)|
+| `node_modules/@qijenchen/design-system/ds-canonical/rules/self-verify.md` | 編任何檔案(Pre/Mid/Post/Pre-commit 4 階段自驗)|
+| `node_modules/@qijenchen/design-system/ds-canonical/references/ssot-consultation.md` | 寫視覺 code 前(9 項決策對應 SSOT + tsx 檔頭宣告)|
+| `node_modules/@qijenchen/design-system/ds-canonical/references/ssot-index.md` | 視覺/結構 propose 前(owner SSOT 對照)|
+| `node_modules/@qijenchen/design-system/ds-canonical/references/naming-conventions.md` | 命名新檔/變數/prop |
+| `node_modules/@qijenchen/design-system/ds-canonical/skills/design-system-audit/references/audit-prompts.md` | 稽核判準 SSOT(91 dim rubric,Claude 與 Codex 同判準)|
+
+(Claude Code 對 `node_modules/@qijenchen/design-system/ds-canonical/rules/` 有 path-scoped 自動載入;其他 agent 依本表在編對應檔案前主動讀取——**同一份檔案,零複製**。)
+
+# 治理 canonical(home 分層 + anti-bloat)
+
+## 規則放哪 home(8-home 分層)
+
+| Level | Home | 收什麼 |
+|-------|------|--------|
+| 1 | `AGENTS.md`(本檔;Claude 經 CLAUDE.md import) | 每 session signal 的 mindset + 6 條 + 任務導航 |
+| 1.5 | `node_modules/@qijenchen/design-system/ds-canonical/rules/*.md` | path-scoped rules(Claude 自動載入;其他 agent 按 Rule Index 讀) |
+| 2 | `{name}.spec.md` | 單元件「何時用 / 為什麼」 |
+| 3 | Pattern `spec.md` | runtime 跨元件 primitive |
+| 4 | Code(`.tsx` / `.css`) | cva / 型別等機械強制 |
+| 5 | Skill(`node_modules/@qijenchen/design-system/ds-canonical/skills/`) | invoke 情境的多步驟 workflow + checkpoint |
+| 6 | Memory(`~/.claude/.../memory/` SSOT + repo `.claude/memory/` mirror)| 跨 session 狀態。本機編完跑 `npm run sync-memory` 推回 repo |
+| 7 | Hook(`.claude/hooks/`) | 機械化 pre/post tool 檢查(Claude write-time;最終兜底 = preflight/CI) |
+| 8 | Slash Command(`node_modules/@qijenchen/design-system/ds-canonical/commands/`) | 一次性單步 action |
+| 9 | Plan doc(`.claude/planning/`)| 完整 plan / RFC / spec 草稿 SSOT;memory file 是短 index pointer |
+
+**Q1 設計規則 → Level 1-4 / Q2 invoke 情境 → Skill or Command / Q3 隨時間變化 → Memory(short index)+ Plan doc / Q4 機械化 → Hook(+ preflight gate)**。完整 flowchart → `node_modules/@qijenchen/design-system/ds-canonical/skills/design-system-audit/references/rule-placement.md`。
+
+## 行數預算(Anthropic 對齊)
+
+Bootstrap(AGENTS.md + CLAUDE.md 合計)target ≤ 250 / transition ≤ 400 / hard cap 800。SKILL ≤ 250 / spec ≤ 300(foundational SSOT 例外 ≤ 800-1200)/ memory **per-file ≤ 100 lines** + **MEMORY.md index ≤ 20 entries**(soft 18 / hard 20)。Hooks **26 soft / 60 hard**(SSOT = `session_start_governance_check.sh` Check 7)。動態值以 `scripts/sync-governance-counters.mjs` 跑出為準。
+
+## Anti-bloat L1-L3
+
+- **L1 Pre-write**:`check_file_size_budget.sh`(+ governance hooks — dynamic SSOT 在 `.claude/hooks/`)
+- **L2 Per-edit**:`log_governance_fires.sh` → `.claude/logs/hook-fires.jsonl`
+- **L3 Periodic**(季度 / `--deep`):`/knowledge-prune` skill,retire ≥ 5%
+
+## 加規則前必過 3 題
+
+1. 既有 Meta-Pattern / 近親 spec / canonical chapter 命中 → append pointer 不新寫
+2. **Rule-of-3**:同概念 ≥ 3 處 → 選 SSOT 其他 pointer
+3. 7 天後還會 fire 嗎?不確定 → 不寫
+
+# 稽核 canonical
+
+3 層級 × 6 維度。**Stakeholder-visible artifact**(prototype / 元件 merge / 產品 demo)**必過 code + visual 雙層 audit**(搭配 M6+M10)。
+
+| Tier | 時機 | Scope | Skill |
+|------|------|-------|------|
+| 1 Stakeholder-gate(強制)| 新元件 merge / prototype / demo | artifact-scoped | `/component-quality-gate` / `/prototype` P3.5 / `/product-ui-audit` P5 |
+| 2 Daily dev | bug / refactor / 文字改 | git diff + direct consumer | `visual-audit --scope=changed`(default) |
+| 3 Periodic deep | release / token 大改 / 季度 | full DS | `/design-system-audit --deep` |
+
+| 維度 | 對應 skill |
+|------|-----------|
+| D1 設計語言 | `/design-system-audit` |
+| D2 程式語言 | tsc + lint + `/design-system-audit` |
+| D3 元件效能 | `/performance-audit` |
+| D4 UX 行為 | `/ux-audit` |
+| D5 視覺品質 | `/visual-audit`(Layer A mechanical + B AI) |
+| D6 原則自檢 | `design-system-audit/references/principle-audit-protocol.md` |
+
+**Consistency 類稽核必 Phase 0 全掃再判**。**Deep audit 全掃優先 + 決策 batch-at-end 鐵律**(2026-07-11 user directive):先全 DS 掃完(NO-SAMPLE)→ 跨元件去重 → **最後一次**列「真問題 + 只影響 SSOT-UI/UX」決策清單給 user 拍板;非-SSOT autonomous 做完美;**禁**途中逐元件問 user。
+
+**Audit-vs-execute 分權**:動 canonical substantive meaning → STOP 提議;對齊 / 表達統一 / 清 duplicate / 補 pointer → AUTO。
+
+**Scope classifier — Surgical visual bug**:user 列 N 個 visual defects + 無新 canonical / 無新 API contract / 無 cross-component semantic 改動 → **Surgical scope**:no collab / no new M-rule / no audit report,batch fix + final pixel-quantified verify only。Substantive 改動走 audit-vs-execute STOP 提議流程。
+
+# Independent second opinion(跨 provider 對抗審查)
+
+**Canonical 概念**:重大變更(governance / Critical DS change / deep audit)需 **author provider ≠ reviewer provider** 的獨立第二意見。判準 = 同一份 rubric(`audit-prompts.md`),reviewer 只提 findings(rule 對照 + severity + evidence),**不得**自建規範。記錄雙方 provider/model/version。
+- Claude authored → Codex review(現行 driver = `/deep-audit-cross-codex` Phase B,transport = `scripts/codex-run-guarded.mjs`)
+- Codex authored → Claude review(對稱)
+- **Backend 不可用 → fail-closed**:標 review pending;禁同一 agent 假扮另一 provider;Critical change 不得取得 compliant 宣稱。
+
+# SSOT 消費 canonical
+
+寫視覺 code 前必查對照 — 沒列 = 自創。**完整對照表 + 強制 checklist** → `node_modules/@qijenchen/design-system/ds-canonical/references/ssot-consultation.md`(SSOT owner;含 9 項決策對應 SSOT + 新元件 tsx 開頭「── 消費的 SSOT ──」段強制要求)。
+
+# 任務導航表
+
+| 任務 | 必讀 |
+|------|------|
+| **新增元件** | `node_modules/@qijenchen/design-system/ds-canonical/rules/ui-development.md` 「建立 UI 前必讀 / shadcn 元件規範」 + `node_modules/@qijenchen/design-system/ds-canonical/rules/spec-rules.md` → `/component-quality-gate` |
+| **修 variant / size / state** | 該元件 `spec.md` → `/story-writing` |
+| **新增 token** | `tokens/README.md` → `node_modules/@qijenchen/design-system/ds-canonical/rules/ui-development.md`「Token 命名 4 條硬規則」→ `tokens/xxx.spec.md` |
+| **寫 story / 視覺 code** | `/story-writing` + `# SSOT 消費 canonical` |
+| **命名新檔 / 變數 / prop** | `# 命名與語言一致性` + `node_modules/@qijenchen/design-system/ds-canonical/rules/ui-development.md`「元件 Props 命名」 |
+| **新元件 layout** | `# 4-Family Layout Model` |
+| **建產品 / 開新 product app** | `npm run create-app <name>` → `apps/<name>/`;**2-scenario architecture SSOT** → `node_modules/@qijenchen/design-system/ds-canonical/references/scenario-definition.md` |
+| **新 skill / hook / command** | `.claude/{home}/README.md` charter |
+| **無前例設計決策** | `# 遇不確定時的協議` |
+| **Tailwind 出怪事** | `node_modules/@qijenchen/design-system/ds-canonical/rules/ui-development.md`「Tailwind 5 條核心」+ `# 失敗記憶索引` |
+| **Stakeholder 產出 / 稽核** | `# 稽核 canonical` |
+| **User 糾正後** | `# 治理 canonical`(home 判斷) |
+| **跟 codex 討論 / 多輪震盪 / 任何 codex 輸出** | `node_modules/@qijenchen/design-system/ds-canonical/skills/codex-collab/SKILL.md`(M31 5-step canonical SSOT)+ M31 anchor in meta-patterns.md |
+| **PR merge 後 / session start branch 健檢** | `# Git solo-work canonical` |
+
+**找不到** → 進 `# 遇不確定時的協議`,不自決定。
+
+# Git solo-work canonical(SSOT → `.claude/memory/feedback_solo_dev_workflow.md`)
+
+**1 chat = 1 working branch**;**Netlify preview 是 user gate**;**「push」/「OK」trigger 才 merge main**。**Session-start 必先 grep canonical + 開 working branch,禁直接在 main 上 edit production code**(M28 sub-rule)。
+
+| 步驟 | 動作 |
+|------|------|
+| 1 Edit | AI 改 code |
+| 2 Commit + push working branch | 自動觸發 Netlify per-branch preview |
+| 3 告訴 user 主要 change(or preview URL)| 讓 user 知道看什麼 |
+| 4 等 user trigger | **「push / OK / 好 / 合 main」** → step 5;**「改 X / 不對 / 等等」** → 繼續 step 1 |
+| 5 Squash merge to main | 不開 PR(可 GitHub API squash-merge OR fast-forward)|
+| 5.5 **SSOT propagation gate** | 動到 skill/hook/spec/token/AGENTS/CLAUDE 等 SSOT-affecting paths + user 已給 merge trigger → AI 自動 bump → **`npm run release:preflight`**(唯一發版前 gate 指令)→ tag → publish → `npm view` 驗證,全程不停下問;user 隨時可喊停。bump npm `0.1.0-beta.<N+1>` |
+| 6 砍 remote branch | `git push origin --delete <branch>` |
+| 7 Local 對齊 | `git checkout main && git fetch && git reset --hard origin/main && git branch -d <branch>` |
+
+**禁止**:開 PR / AI 自決 push main / 同 chat 開多 branch / 留 stale 不刪 / 「下個 session 處理」deferred 措辭。
+
+# 命名與語言一致性
+
+**3 重 test**(governance):
+1. **既有 DS 詞彙**:對齊 `compact/rich / sm/md/lg / action/indicator / scanning/reading`?
+2. **世界級 idiom**:≥ 2 家 world-class DS 用此詞?
+3. **跨元件認知衝突**:同字串在其他元件已有不同語義?
+
+3 test 全過才採納。詳細 → `node_modules/@qijenchen/design-system/ds-canonical/references/naming-conventions.md`。
+**語言一致性**:spec.md 繁中(技術術語保留英) / code identifier 英 / 單一檔案不中英夾雜。
+
+# 4-Family Layout Model
+
+**每元件 spec 第一段必聲明 Layout Family**(1/2/3/4 或「self-contained」)。
+
+| Family | 用途 | SSOT |
+|--------|------|------|
+| 1 Menu item / 2 List item | scanning / reading | `patterns/element-anatomy/item-anatomy.spec.md` |
+| 3 Pill | 單行互動 pill | `components/Button/button.spec.md`「Pill Layout」|
+| 4 Field control | 可編輯資料輸入 | `components/Field/field-controls.spec.md` |
+
+# 自主執行 canonical(Autonomy Default)
+
+**Default = autonomous + complete + verify-to-perfection;省工 = anti-pattern(違 mindset #1)**。
+
+| 動作類別 | 預設 |
+|---------|-----|
+| **SSOT-affecting UI/UX**(增刪改 component / token / spec 視覺結構 / 跨元件 design language) | **ASK** — 中文具體人話講選項 + tradeoff,user 拍板才動 |
+| Bug fix / clean / refactor / 命名一致 / test / audit / verify | **AUTO** — 整批做完 + 完整驗證 + 撤回機制 |
+| Governance / hook / skill / spec **內部**(typo / pointer / 結構 — 不動 canonical meaning)| **AUTO** |
+| Perf / a11y / 漸進遷移(不動 SSOT)| **AUTO** — 整批 + verify |
+
+**自主執行同時優化 7 軸**:言簡意賅 / 效率+效能 / SSOT 鐵律 / 易懂維護擴充 / 世界級+一致設計語言 / 完整 self-verify / 自動 self-improve。
+**反 pattern**(禁):「省工」/「下次再做」/「下個 session」/「OK 嗎?」過度 ASK / shortcut 避 verify。
+**Trigger phrase auto-pipeline**:「依原則自主」/「不需問」/「馬不停蹄」/「全部做完」/「自動」→ autonomous mode,僅 SSOT-affecting UI/UX 停下 ASK。
+**Triple-verify before propose**:propose / 列 option / 發現「問題」前必 inline 跑 (1) grep DS-wide (2) Read spec.md / tsx (3) 對照 canonical exception。三題全過才 propose。
+**SSOT auto-sync invariant**:跨 file 數字禁 hardcode 多處;以 `scripts/sync-governance-counters.mjs` 機械對齊。
+
+# 遇不確定時的協議
+
+**無前例且影響 SSOT UI/UX 設計判斷**時 3 步,禁跳:**grep 既有**(30 秒)→ **讀近親 spec.md** → **仍不確定停下問** user。
+**非 SSOT-UI/UX**(refactor / test / perf / a11y / hook / skill / typo / 對齊既有 canonical)→ autonomous,無需問。
+禁:跳 grep 憑記憶 / 隨便挑 / 留 TODO。可跳:bug 修 / 機械勞動 / user 明確指示。
+
+# 失敗記憶索引(技術沉默陷阱 only)
+
+| 技術陷阱 | 一行 anchor |
+|--------|-----------|
+| Tailwind v4 `[--foo]` 必 `var()` | silent 失效 |
+| tailwind-merge 自訂 utility 必註冊 group | 否則 strip |
+| 元件自包 Provider | 劫持全站 |
+| 清 unused imports 後 runtime | tsc 不充分,需 storybook |
+| shadcn compat alias 回流 | dark mode 不聯動 |
+| `asChild ? Slot : Native` 內部 JSX 仍渲染多 children | React.Children.only runtime fail;asChild 分支 render 只傳 consumer child |
+| `tsc -b` 不 emit declaration | TS4023 漏抓;型別 surface 改動必 `npm run build:lib` |
+| 工具 flag 沉默陷阱:`rsync -a` 等長同秒靜默跳過(必 `--checksum`)/ `rg` 黏寫 `-rn` 的 `-r`=replace 輸出假字串 | 寫後斷言 + flag 分開寫 |
+| DS css 不在 tokens.css aggregator 也沒被 tsx import = orphan | consumer 靜默拿不到 |
+| storybook-smoke 驗舊 build = 假綠 | smoke script 已加 stale-build guard |
+
+新 bug → 歸 Meta-Pattern OR 本表 1 行;> 10 條 = 漏寫,評估 meta-merge 既有 M-rule。
+
+# 專案 Stack
+
+Vite + React + TypeScript + Tailwind v4 + shadcn/ui + Storybook + 自訂 Design Token;完整路徑 + Token 系統 → `node_modules/@qijenchen/design-system/src/tokens/README.md`(charter)— DS 內化在 npm workspace。
+
+# 元件完成 + Exploration
+
+merge 前 invoke `/component-quality-gate`(35 項 + visual + clean-code 三層)。正式 `node_modules/@qijenchen/design-system/src/` vs 比稿 `src/explorations/`;比稿 `*.v1.stories.tsx` + `notes.md`,定案升級 patterns/ 或 components/。

package/ds-canonical/fork/codex/agents/skills/independent-review/SKILL.md

@@ -0,0 +1,33 @@
+---
+name: independent-review
+description: Independent second-opinion review of changes authored by another AI provider(如 Claude)。Use when asked to review, audit, or give a second opinion on a diff, branch, or component change in this repo.
+---
+
+<!-- _generated: scripts/gen-codex-adapter.mjs(PNG P2.3)。禁手改 — release:preflight `gen-codex-adapter --check` 驗 drift;改內容改生成器後重生 `node scripts/gen-codex-adapter.mjs`。 -->
+
+# Independent second-opinion review(codex-side driver)
+
+**任務**:review「另一個 provider(通常 Claude)所著的變更」— 你是 reviewer,不是 author。Canonical 概念 = `AGENTS.md`「Independent second opinion」段(author provider ≠ reviewer provider;同一份判準 SSOT;fail-closed)。
+
+## 判準(禁自建規範)
+
+- **唯一 rubric SSOT** = `node_modules/@qijenchen/design-system/ds-canonical/skills/design-system-audit/references/audit-prompts.md`(per-dim 判準;Claude 深稽核用同一份)。**禁**以你自己的 best-practice 直覺取代:rubric 沒寫的不構成 finding,rubric 有寫的不可跳過。
+- rule-ID 對照:`.claude/logs/audit-coverage-matrix.json`(DS-DIM-001..091)。
+
+## 流程
+
+1. 讀 `AGENTS.md` + 上述 rubric(applicable dims 全讀,**禁抽樣**)。
+2. 取得受審變更:brief 指定的 diff / branch / 檔案清單;無指定 → `git diff main...HEAD` + 變更檔全文。
+3. 逐 applicable dim 套 rubric 驗證(claim-vs-code:讀真實 source,不信註解 / 文件宣稱)。
+4. 只輸出 findings + 證據;可附修法建議,**不得**直接改檔(review-only)。
+
+## 輸出格式(每 finding)
+
+- `rule-ID`(DS-DIM-NNN 或 rubric 段落)/ `severity`(Critical / Major / Minor)/ `evidence`(file:line + 引文)/ `resolution`(建議修法一行)。
+- 無 finding 的 applicable dim 也要列:`DS-DIM-NNN: PASS(驗證方式一行)`。
+- 結尾記錄 reviewer 的 provider / model / version(如 codex CLI 版本 + model 名)。
+
+## Fail-closed(禁靜默降級)
+
+- rubric 檔讀不到 / diff 取不到 / 無法完成全部 applicable dims → 回 `REVIEW-BLOCKED: <原因>`,**禁**輸出部分結果並宣稱 compliant。
+- **禁**同一 agent 假扮另一 provider 的審查(self-review ≠ independent second opinion)。

package/ds-canonical/fork/codex/hooks.json

@@ -0,0 +1,16 @@
+{
+  "description": "_generated: scripts/gen-codex-adapter.mjs — 禁手改(release:preflight `gen-codex-adapter --check` 驗 drift;重生 `node scripts/gen-codex-adapter.mjs`)。source: node_modules/@qijenchen/design-system/ds-canonical/fork/hooks/(npm ship;SSOT = DS repo .claude/hooks;投影名單 = gen-codex-adapter PROJECTED ∩ fork-shipped)。sourceDigest: check_tailwind_wildcard_in_docs.sh=51fcf04d3adc2a15。trust: Codex per-hook hash trust — TUI /hooks 一次 trust 或 exec 加 --dangerously-bypass-hook-trust;未 trust = 非互動下靜默跳過(fail-open)→ hooks 僅加速器,最終 authority = release:preflight + CI(AGENTS.md 檔頭宣告)。eligibility 判準與逐支理由 SSOT = gen-codex-adapter.mjs PROJECTED。",
+  "hooks": {
+    "PostToolUse": [
+      {
+        "matcher": "Write|Edit|MultiEdit",
+        "hooks": [
+          {
+            "type": "command",
+            "command": "bash \"$(git rev-parse --show-toplevel)/node_modules/@qijenchen/design-system/ds-canonical/fork/hooks/check_tailwind_wildcard_in_docs.sh\""
+          }
+        ]
+      }
+    ]
+  }
+}

package/ds-canonical/fork/governance.lock

@@ -1,6 +1,21 @@
 {
   "_purpose": "sha256 of every shipped fork governance body + manifest (tamper-detect baseline)",
   "entries": [
+    {
+      "file": "AGENTS.md",
+      "sha256": "52414efa4289281a6070a0fabdf08a97045197a90a072ca0a7550f01e79203c3",
+      "source": "AGENTS.md(root)"
+    },
+    {
+      "file": "codex/agents/skills/independent-review/SKILL.md",
+      "sha256": "4e0505a31083d5f07500ef0ea68726d7fe4986ef5541edddad5b10b5bbb2dc20",
+      "source": "gen-codex-adapter.mjs"
+    },
+    {
+      "file": "codex/hooks.json",
+      "sha256": "3b09d8d4a1dab1213842ede807b0473e3521ad5b7b7536967da320db8f34ed85",
+      "source": "gen-codex-adapter.mjs PROJECTED ∩ fork classification"
+    },
     {
       "file": "hooks/block_prototype_imports.py",
       "sha256": "ee24825dc67147f38acdd7006ff8ed370079d30205425ebd38fadb1ec0e31331",
@@ -21,7 +36,7 @@
     },
     {
       "file": "hooks/check_ds_anchor_preflight.sh",
-      "sha256": "34643184615d38854e361df6f745730e5710a966a6f363aa642f1fe29d59bdb5",
+      "sha256": "df682a95a88b52f8278722907c5ed29e61d31c0cd13d7c2112a3f9cae4bc38b1",
       "sourceHook": "check_ds_anchor_preflight.sh",
       "bucket": "SHIP_REWRITTEN"
     },
@@ -105,7 +120,7 @@
     },
     {
       "file": "hooks/inject_deploy_url_after_push.sh",
-      "sha256": "f5cd8597574f1b061b132a289337731f7dabac0c6666f1ca611d8316504b401c",
+      "sha256": "091ab70b5088bc25f947eea42915d91df3eb73bd6137df8a8c235093c25ff567",
       "sourceHook": "inject_deploy_url_after_push.sh",
       "bucket": "SHIP_REWRITTEN"
     },
@@ -126,11 +141,11 @@
     },
     {
       "file": "manifest.json",
-      "sha256": "9f9133ff3ad96d9e52c0c248ddb8e14d0d8cb98a13d27246b601c641d8a946c9"
+      "sha256": "843d8d8ecd8536e9524e944e68602fa3b802f4a5aa40d6a77e0ff381d1bd3940"
     },
     {
       "file": "preamble.md",
-      "sha256": "9b16560369afb01e3d3ae3b15f6fec8215bcfe2faf3095b59960d2080064d510"
+      "sha256": "70f3402061f420c9026d5cd69ac3f070fd3457cb8ad506685372fcda1b2be1fb"
     },
     {
       "file": "skills/bug-fix-rhythm/SKILL.md",
@@ -174,7 +189,7 @@
     },
     {
       "file": "skills/product-ui-audit/SKILL.md",
-      "sha256": "a8255bbd662cc5db98414ed32b5ae7423b0e09a7d719f969c202ba02974a41c7"
+      "sha256": "1664a8ecb327469056182f0e3bb9951379165210e19a13b8a90714a6ddce4b18"
     },
     {
       "file": "skills/propose-options/SKILL.md",
@@ -214,7 +229,7 @@
     },
     {
       "file": "skills/ux-audit/SKILL.md",
-      "sha256": "28673c2f0207a0fa37f262ae8276d2b120b61c3329ada4d900fd6cdca42e35ed"
+      "sha256": "833d90921a8b5c51a4a93d17525d51cd81f75d6dc00c7c40f1872d5329088a13"
     },
     {
       "file": "skills/visual-audit/output/.gitkeep",
@@ -234,7 +249,7 @@
     },
     {
       "file": "skills/visual-audit/SKILL.md",
-      "sha256": "49463b40de654546e05dc62765d4d37ad41a7c745fbc660878f4ecb5a26e3ae8"
+      "sha256": "ccf7065ff856f1de095506fb41223c17b31b5602bc94a1c71e6d1871ef2c5a8e"
     }
   ]
 }

package/ds-canonical/fork/hooks/check_ds_anchor_preflight.sh

@@ -54,7 +54,28 @@ esac
 NEW_CONTENT=$(echo "$INPUT" | jq -r '.tool_input.content // .tool_input.new_string // ""' 2>/dev/null)
 
 # DS primitive 名單(wrap 這些就觸發 anchor preflight)
-DS_PRIMITIVES_RE='<(Sidebar|AppShell|DataTable|Dialog|Sheet|Popover|DropdownMenu|Field|FieldControlGroup|MenuItem|ItemAvatar|ItemLabel|ItemIcon|SegmentedControl|Tabs|TabsList|TabsTrigger|Combobox|Select|DatePicker|TimePicker|TreeView|Tooltip|Coachmark|FileViewer|ScrollArea|Avatar|Badge|Button|ChromeHeader|SurfaceHeader|SurfaceBody|SurfaceFooter|OverlaySurface|NameCard|Toast|FileUpload|DescriptionList|Chart|BulkActionBar|ActionBar|Carousel|Breadcrumb)\b'
+# 2026-07-16 dim 57 修 stale hardcode(含已改名 NameCard→ProfileCard、缺 InlineEdit 等 34 現役元件):
+# 元件名改「機械生成」— 由 components/ dir 動態 ls 派生(hook 每 fire 跑一次 find,成本 <10ms 可接受),
+# 新增/改名元件自動同步,不再靠人手維護清單。
+# 非-dir primitive(patterns/ export + sub-component:MenuItem/Item* slots/TabsList/ChromeHeader/
+# Surface*/OverlaySurface/ActionBar)無 dir 可派生 → 維護小清單於 _PATTERN_PRIMITIVES。
+_COMPONENTS_DIR=""
+for _root in "${CLAUDE_PROJECT_DIR:-}" "$(pwd)"; do
+  if [ -n "$_root" ] && [ -d "$_root/node_modules/@qijenchen/design-system/src/components" ]; then
+    _COMPONENTS_DIR="$_root/node_modules/@qijenchen/design-system/src/components"
+    break
+  fi
+done
+if [ -n "$_COMPONENTS_DIR" ]; then
+  _COMP_NAMES=$(find "$_COMPONENTS_DIR" -mindepth 1 -maxdepth 1 -type d -exec basename {} \; 2>/dev/null | sort | paste -sd'|' -)
+fi
+# 靜態 fallback(consumer fork repo 無 node_modules/@qijenchen/design-system/src/ → 用 snapshot;
+# 與 DS repo components/ dir 同步,新增元件必補 — snapshot 2026-07-16,63 元件)
+if [ -z "${_COMP_NAMES:-}" ]; then
+  _COMP_NAMES='Accordion|Alert|AppShell|AspectRatio|Avatar|Badge|Breadcrumb|BulkActionBar|Button|Calendar|Carousel|Chart|Checkbox|Chip|CircularProgress|Coachmark|Combobox|Command|DataTable|DateGrid|DatePicker|DescriptionList|Dialog|DropdownMenu|Empty|Field|FieldControlGroup|FileItem|FileUpload|FileViewer|HoverCard|InlineEdit|Input|LinkInput|Menu|Notice|NumberInput|OverflowIndicator|Pagination|PeoplePicker|Popover|ProfileCard|ProgressBar|RadioGroup|Rating|ScrollArea|SegmentedControl|Select|SelectionControl|SelectMenu|Separator|Sheet|Sidebar|Skeleton|Slider|Steps|Switch|Tabs|Tag|Textarea|TimePicker|Toast|Tooltip|TreeView'
+fi
+_PATTERN_PRIMITIVES='MenuItem|ItemAvatar|ItemLabel|ItemIcon|TabsList|TabsTrigger|ChromeHeader|SurfaceHeader|SurfaceBody|SurfaceFooter|OverlaySurface|ActionBar'
+DS_PRIMITIVES_RE="<(${_COMP_NAMES}|${_PATTERN_PRIMITIVES})\b"
 
 # 沒 wrap DS primitive → 檢「純手刻」洞(2026-07-07 治理進化方向 3 洞 b:原本此分支直接放行,
 # 「該用 primitive 卻整個手刻」反而抓不到 — 內部盤點 file:line 證據見 planning/2026-07-07-governance-evolution-roadmap.md)

package/ds-canonical/fork/hooks/inject_deploy_url_after_push.sh

@@ -194,11 +194,23 @@ if [ -z "$URLS_FOUND" ] && [ -f "$CWD/netlify.toml" ]; then
     # Branch preview:always use `<branch>--<sitename>` pattern,but sitename unknown unless USER_OVERRIDE
     if [ -n "$USER_OVERRIDE" ]; then
       SITENAME=$(echo "$USER_OVERRIDE" | sed -E 's|https?://([^.]+)\.netlify\.app.*|\1|')
-      CANDIDATE="https://${BRANCH}--${SITENAME}.netlify.app"
+      # 2026-07-17 bug 修:DNS 單標籤硬上限 63 字元。`<branch>--<site>` 超過 → 該子網域**無法存在**
+      # (curl 連 header 都收不到,非 404)。舊版直接拼不截斷 → 長 branch 名吐「物理上不可能」的網址,
+      # verify 失敗後還印該 URL 誤導 user。修:超長時截 branch + 誠實標示「branch 名太長,預覽不可靠」。
+      BRANCH_SLUG=$(echo "$BRANCH" | tr '[:upper:]' '[:lower:]' | sed -E 's/[^a-z0-9-]/-/g; s/-+/-/g')
+      BUDGET=$(( 63 - ${#SITENAME} - 2 ))
+      TRUNCATED=0
+      if [ ${#BRANCH_SLUG} -gt $BUDGET ]; then
+        BRANCH_SLUG=$(echo "${BRANCH_SLUG:0:$BUDGET}" | sed -E 's/-+$//')
+        TRUNCATED=1
+      fi
+      CANDIDATE="https://${BRANCH_SLUG}--${SITENAME}.netlify.app"
       if [ "$(verify_url "$CANDIDATE")" = "OK" ]; then
         URLS_FOUND="${URLS_FOUND}🔍 Netlify PREVIEW(${BRANCH}): ${CANDIDATE}  ✅ verified 200\n"
+      elif [ $TRUNCATED -eq 1 ]; then
+        URLS_FOUND="${URLS_FOUND}⚠️ branch 名太長(『${BRANCH}』+ --${SITENAME} 超過 DNS 63 字元)→ Netlify 建不出預覽子網域;截斷版 ${CANDIDATE} 也未命中。可靠做法:縮短 branch 名(≤${BUDGET} 字元)重推,或合 main 後看正式站 https://${SITENAME}.netlify.app\n"
       else
-        URLS_FOUND="${URLS_FOUND}🔍 Netlify PREVIEW 推導: ${CANDIDATE}  ⚠️ 404(preview 未啟 OR build pending — Netlify build 2-3 min)\n"
+        URLS_FOUND="${URLS_FOUND}🔍 Netlify PREVIEW 推導: ${CANDIDATE}  ⚠️ 未命中(preview 未啟 / build pending / 此 branch 未啟 branch-deploy — 查 Netlify Dashboard Deploys)\n"
       fi
     else
       URLS_FOUND="${URLS_FOUND}🔍 Netlify PREVIEW(${BRANCH}) — sitename 未知;設 \$HOME/.claude/local/deploy-targets.json 後 hook 可推 preview URL\n"

package/ds-canonical/fork/manifest.json

@@ -114,5 +114,14 @@
     "visual-audit"
   ],
   "commands": [],
-  "agents": []
+  "agents": [],
+  "codex": {
+    "agentsMd": "AGENTS.md",
+    "hooksJson": [
+      "check_tailwind_wildcard_in_docs.sh"
+    ],
+    "agentsSkills": [
+      "independent-review"
+    ]
+  }
 }

package/ds-canonical/fork/preamble.md

@@ -135,9 +135,10 @@ paths:
 
 **Folder + storybook canonical**:
 - public:`components/<Name>/` OR `patterns/<name>/`(frontmatter 無 `internal: true`),storybook title `Design System/Components/<Name>/...` OR `Design System/Patterns/<Name>`
-- internal:in-place `components/<Name>/` 或 `patterns/<name>/` + frontmatter `internal: true` / `- isInternal`(主路徑;現行 11 個 internal 單元全走 frontmatter,`components/Internal/<Name>/` folder 路線同樣支援但目前無住戶),storybook title `Design System/Internal/<Name>/...` OR `Design System/Internal Patterns/<Name>`(end-user 設計師 default 過濾掉,DS contributor 看 reference 用)
+- internal:in-place `components/<Name>/` 或 `patterns/<name>/` + frontmatter `internal: true` / `- isInternal`(主路徑;現行 10 個 internal 單元全走 frontmatter,`components/Internal/<Name>/` folder 路線同樣支援但目前無住戶),storybook title `Design System/Internal/<Name>/...` OR `Design System/Internal Patterns/<Name>`(end-user 設計師 default 過濾掉,DS contributor 看 reference 用)
 - export jsDoc 加 `@internal` marker(IDE intellisense 警示 end-user)
 - **Root barrel front-door 排除(2026-06-05 dim-72 SSOT,user Q2 拍板)**:internal 元件/pattern **不進** `node_modules/@qijenchen/design-system/src/index.ts`(root barrel = 直接 front-door),**只**經 per-component subpath `@qijenchen/design-system/{components,patterns}/<Dir>` 取用 —— 對應 user 原則「internal 要**另外包裝過 + 自行確認**才可用,不得直接 front-door 使用;public 才可直接用」。SSOT = spec frontmatter isInternal;機械 = `gen-design-system-barrel.mjs`(生成時自動排除)+ `--check`(release:preflight drift gate)。改 public/internal → 改 frontmatter 後重跑 generator。
+  - **符號級 `@internal` 排除(2026-07-18 決策3)**:public 元件內個別 export 若帶 `/** @internal */` JSDoc tag(如 `ButtonGroupContext` / `floatingLayerClass` / `RowSizeProvider` / `ItemInlineAction(Button)` 等私有 context/helper/primitive),generator 亦排除出 root front-door(subpath `export *` 仍有,DS 內部 relative import 不受影響)。對齊 TS `stripInternal` / MUI `@ignore` / API-Extractor `@internal` release tag。**偵測鐵律**:`@internal` 必為 JSDoc(`/** */`)tag(行首),`//` line-comment prose 提及不算(否則自身 doc 提及兄弟 `@internal` 的 public 型別如 `FieldVariant` 會被誤殺)。加/移私有符號的 front-door 排除 → 改該 export 的 `@internal` marker 後重跑 generator。
 
 **對齊世界級**:Polaris 「Building blocks」(public) vs「layout primitives」(internal)/ Material UI `@mui/material`(public)vs `@mui/utils` `@mui/system`(internal hooks/primitives)/ Atlassian `@atlaskit/<component>`(public)vs internal `<unstyled>` primitives / Carbon turnkey components + internal utilities / Apple HIG「Presented controls」vs「implementation primitives」 共識。
 
@@ -228,7 +229,7 @@ paths:
 
 | Repo / Path | Title pattern | 用途 |
 |---|---|---|
-| **DS repo** `packages/design-system/**/*.stories.tsx` | `Design System/{Tokens|Patterns|Components|Internal}/{Name}/{展示|設計規格|設計原則}` | DS 元件 / token / pattern building block |
+| **DS repo** `packages/design-system/**/*.stories.tsx` | `Design System/{Tokens|Patterns|Components|Internal|Internal Patterns}/{Name}/{展示|設計規格|設計原則}` | DS 元件 / token / pattern building block |
 | **Consumer apps**(template / fork repos)`apps/**/*.stories.tsx` | `Apps/{app-kebab-name}/{Page Purpose}` | 產品 UI composition demo(eg. `Apps/order-dashboard/AppShell Dashboard`)|
 
 **Why 不統一**:DS 是 building block library(可重用元件),consumer apps 是 product UI 真實 composition demo(整頁、整 flow)。Namespace 不同 = Storybook sidebar 兩塊清楚分區。

package/ds-canonical/fork/skills/product-ui-audit/SKILL.md

@@ -89,13 +89,13 @@ Purpose: design-system-audit audits the **DS itself**(spec / cva / SSOT 三方
 
 ### Dim 4 — Mindset adherence
 
-對齊 CLAUDE.md 5 條 mindset:
+對齊 CLAUDE.md 6 條 mindset(逐條檢查 #1-#5;#6「大原則吸收瑣碎」屬 governance meta 層,不在 consumer code audit scope。編號用 mindset #N,避免撞 meta-patterns M-rules 編號):
 
-- **M1 對標世界級**:新 pattern 有對標備註? 或找得到對應既有元件?
-- **M2 不憑直覺發明**:新數值(gap / padding / font-size)前有 grep 既有?
-- **M3 改一處看三處**:若改 DS 的 cva defaultVariants,spec / docblock / anatomy 三方同步?
-- **M4 真實業務場景**:stories / examples 用真實場景 (Jira / Stripe / Notion...)?無 `Option A/B/C` / `按鈕一` / `Rule A`?
-- **M5 猶豫就問**:code 裡有 TODO-未確認留白?
+- **mindset #1 對標世界級**:新 pattern 有對標備註? 或找得到對應既有元件?
+- **mindset #2 不憑直覺發明**:新數值(gap / padding / font-size)前有 grep 既有?
+- **mindset #3 改一處看三處**:若改 DS 的 cva defaultVariants,spec / docblock / anatomy 三方同步?
+- **mindset #4 真實業務場景**:stories / examples 用真實場景 (Jira / Stripe / Notion...)?無 `Option A/B/C` / `按鈕一` / `Rule A`?
+- **mindset #5 猶豫就問**:code 裡有 TODO-未確認留白?
 
 ### Dim 5 — 視覺幾何(Mindset #1 視覺擴充 + node_modules/@qijenchen/design-system/ds-canonical/references/ui-dev-rules.md「同 flex 列互動 slot 幾何鐵律」)
 
@@ -133,7 +133,7 @@ chain `node_modules/@qijenchen/design-system/ds-canonical/skills/design-system-a
 
 確認 audit target:file / folder / feature area。提問 user 若模糊。禁止掃整個 repo(失焦)。
 
-### Phase 1 — Parallel 6-dim audit
+### Phase 1 — Parallel 7-Dimension audit
 
 7 個維度各自獨立 grep + code review。可 parallelize。
 

package/ds-canonical/fork/skills/ux-audit/SKILL.md

@@ -71,7 +71,7 @@ description: UX behavior audit for design-system components and product UI. Chec
 1. **Animation duration**:< 200ms(micro)或 200-400ms(macro);超過 400ms 主畫面 → 可能 block 輸入
 2. **Reduce-motion respect**:`@media (prefers-reduced-motion: reduce)` 下動畫減到 0 或極短
 3. **Wheel zoom step 細緻**:> 10% 離散 = 非世界級(對齊 Figma / Preview.app ~3-5%)
-4. **Hover delay**:tooltip / hover-card 的 open delay(700ms for tooltip, 500ms for hover-card per DS canonical)
+4. **Hover delay**:tooltip / hover-card 的 open delay(500ms for tooltip, 700ms for hover-card,per `tokens/motion/motion.spec.md` 三層 tier SSOT)
 5. **Drag / pan**:pointer capture 正確;release on blur
 
 ### Phase 5 — Data / state coverage 五態(2026-04-24 擴充,補 24-checklist #23 edge case gap)

package/ds-canonical/fork/skills/visual-audit/SKILL.md

@@ -252,4 +252,3 @@ FAIL 項摘要:
 - `node_modules/@qijenchen/design-system/ds-canonical/skills/component-quality-gate/SKILL.md` — 元件合入 DS 前的 35 項 checklist;Ship phase 可 chain 本 skill
 - node_modules/@qijenchen/design-system/ds-canonical/references/ui-dev-rules.md `# 同 flex 列的互動 slot 幾何鐵律` — 本 skill checklist #3 的主要 canonical 來源
 - `node_modules/@qijenchen/design-system/ds-canonical/rules/ui-development.md`「建立 UI 前必讀」 → layout primitive / token spec 清單 — 本 skill「合格標準」的對照錨
-- `memory/project_pending_tasks`「視覺 regression 基建」條目 — 長期 tech debt(Chromatic / screenshot-diff)

package/ds-canonical/hooks/check_codex_brief_invariants.sh

@@ -115,7 +115,9 @@ fi
 # 我的 dim sub-agent 判準 SSOT),並要求逐 dim 套用 —— 只給 dim 編號 = codex 憑自己理解判 =
 # 判斷標準不對稱(user 錨:「我基於治理判、codex 可能沒有」)。
 if ! echo "$BRIEF_CONTENT" | grep -qi 'audit-prompts'; then
-  MISSING="${MISSING}  • 6️⃣ 判準對等 invariant 缺(brief 必給 codex `design-system-audit/references/audit-prompts.md` 每-dim rubric + 要求逐 dim 套用同一判準;只給 dim 編號 = codex 憑己意判 = 標準不對稱)\n"
+  # 2026-07-16 fix:原文用 raw backtick 包路徑在雙引號字串內 = command substitution 每 fire 執行該路徑
+  # (stderr 噪音 + 訊息路徑消失)→ 改 \` escape。
+  MISSING="${MISSING}  • 6️⃣ 判準對等 invariant 缺(brief 必給 codex \`design-system-audit/references/audit-prompts.md\` 每-dim rubric + 要求逐 dim 套用同一判準;只給 dim 編號 = codex 憑己意判 = 標準不對稱)\n"
 fi
 
 # 7️⃣ A.1b 對等(2026-07-10 user「所有稽核任務都應對等」全盤盤點抓):brief 必要求 codex 做
@@ -130,11 +132,15 @@ if [ -n "$MISSING" ]; then
   printf '\n  Brief 缺以下 invariant:\n' >&2
   printf '%b' "$MISSING" >&2
   printf '\n  Per memory/feedback_codex_brief_invariants_2026_05_23.md + codex-collab/references/brief-template.md:\n' >&2
-  printf '  必含三 invariant 明文(verbatim):\n' >&2
+  printf '  必含七 invariant 明文(verbatim;2026-07-16 同步實數 — 原訊息只列 3,跟上方檢查 7 條 drift):\n' >&2
   printf '    1. 全盤閱讀全部 source(列舉 N files / DS-wide / 禁憑記憶)\n' >&2
   printf '    2. Triple-verify per finding(grep + Read + canonical exception check)\n' >&2
   printf '    3. 禁抽樣(DS-wide ALL files / sub-agent sample admission = reject)\n' >&2
-  printf '\n  修方向:brief content 補上三 invariant 文字。\n' >&2
+  printf '    4. 禁列檔(禁 rg --files / find 全 repo;只讀 brief 列的 file,直接出 verdict)\n' >&2
+  printf '    5. 輸入對等(閱讀清單具名鏡射 A.0:meta-patterns.md rules + memory MEMORY.md index)\n' >&2
+  printf '    6. 判準對等(附 design-system-audit/references/audit-prompts.md 每-dim rubric,逐 dim 套用)\n' >&2
+  printf '    7. A.1b 對等(per-component claim-vs-code 對抗驗證 = Claude A.1b 鏡像)\n' >&2
+  printf '\n  修方向:brief content 補上缺的 invariant 文字(母版 = codex-collab/references/brief-template.md「七 invariant」段)。\n' >&2
   printf '  Escape(極罕見): brief 含 `// @codex-brief-invariant-skip: <rationale>`\n' >&2
   exit 2
 fi