@cyberskill/design 1.0.0 → 1.1.0

package/docs/vi/decisions.md

@@ -24,7 +24,7 @@ Giữ plan Figma hiện tại. Variables REST API chỉ Enterprise — job ghi *
 
 **Lựa chọn owner: Storybook là live hub duy nhất** (Th7 2026)
 
-- Operator dùng Storybook tại `/` cho Theme × Element × Language và ma trận điều khiển component.
+- Operator dùng Storybook tại `/` cho Theme × Element × Language × Style và ma trận điều khiển component.
 - Không có trang Live View riêng trong tree.
 - Legacy `/dashboard`, `/dashboard/`, `/dashboard.html`, `/dashboard/:path*`, `/playground`, `/playground/`, `/playground/:path*` redirect về `/`.
 - Atomic View portable và HTML tĩnh khác vẫn phục vụ gate zero-build và consumer; chúng không phải entry sản phẩm của site.
@@ -44,17 +44,18 @@ Giữ plan Figma hiện tại. Variables REST API chỉ Enterprise — job ghi *
 
 **Trạng thái: provisional / soft-skip — không phải publish library live** (Th7 2026; hoãn Th7 2026)
 
-- Job CI `code-connect` + `figma.config.json` + 99 mapping `*.figma.tsx` đã trong repo (snippet import dùng `@cyberskill/design`).
+- Job CI `code-connect` + `figma.config.json` + 105 mapping `*.figma.tsx` đã trong repo (snippet import dùng `@cyberskill/design`).
 - Publish soft-skip khi thiếu secret hoặc API trả 403/404/429. Soft-skip ≠ publish Code Connect thành công.
 - **Owner hoãn:** giữ **Figma free / non-Org** — không theo đuổi Code Connect live đến khi có ghế Org/Enterprise và team library đã publish. Khi đó thay stub `9999:*` trong `code-connect/node-map.json` bằng `nodeId` thật. Xem `docs/figma.md`.
 
-## 7. npm publish — đường đã ship; đang mở khóa
+## 7. npm publish — live qua Trusted Publishing (OIDC)
 
-**Trạng thái: sẵn sàng vận hành; package chưa có trên registry dưới tên `@cyberskill/design`** (Th7 2026)
+**Trạng thái: LAUNCH `@cyberskill/design@1.1.0`; CI publish dùng npm Trusted Publishing; token bị cấm** (Th7 2026; LAUNCH 2026-07-27)
 
-- `package.json` là `private: false`; tên package **`@cyberskill/design`** (convention scoped `@cyberskill/*`; `publishConfig.access: public`); `prepublishOnly` chạy `build:bundle` + `build:design-md --check`.
-- Workflow `.github/workflows/npm-publish.yml` trên `workflow_dispatch` / tag `v*`; thiếu `NPM_TOKEN` thì job **soft-skip** (exit 0 + báo cáo tarball). Soft-skip ≠ release đã publish.
-- **Tiến độ owner:** org npm **`@cyberskill`** đã publish package khác; `NPM_TOKEN` đã đặt trên repo. **Vẫn cần:** chạy **Actions → npm-publish → Run workflow** một lần để `@cyberskill/design@1.0.0` lên registry, rồi cấp **grant consumer tường minh** (văn bản chính sách — không phải secret) cho team được phép cài. License giữ **UNLICENSED**; phiên bản giữ **1.0.0**. Xem `docs/consuming.md`.
+- `package.json` là `private: false`; tên package **`@cyberskill/design`** (`publishConfig.access: public`); `repository.url` khớp repo GitHub này cho provenance.
+- Workflow `.github/workflows/npm-publish.yml`: `id-token: write` + runner GitHub-hosted; **không** đặt `NPM_TOKEN` / `NODE_AUTH_TOKEN` trên bước publish (OIDC). Trusted Publisher trên npm phải liệt kê filename workflow **`npm-publish.yml`** cho `cyberskill-official/design-system`. Soft-skip khi auth / 403 / 404 / EOTP / conflict phiên bản.
+- **Publishing access** trên npmjs: **Require two-factor authentication and disallow tokens** (Trusted Publishing OIDC vẫn hoạt động; token publish classic / granular bị từ chối). Secret `NPM_TOKEN` dài hạn đã thu hồi.
+- License giữ **UNLICENSED**; phiên bản là **1.1.0**. Dùng đã duyệt ghi tại **`docs/consumer-grant.md`** (sản phẩm portfolio CyberSkill). Cài từ registry một mình không phải license công khai.
 
 ## 8. Đóng gói store native — scaffold đã ship; submit tắt
 
@@ -76,18 +77,40 @@ Ghi nhận Th7 2026 — mặc định mở khóa (cập nhật khi bước vận
 
 - **Figma Variables** — giữ Tokens Studio / non-Enterprise (quyết định §3). Soft-skip Variables REST vẫn trung thực.
 - **Code Connect** — **bỏ qua khi còn Figma free**; chỉ xem lại sau Org + library đã publish + `nodeId` thật (quyết định §6). Soft-skip ≠ publish.
-- **npm** — org `@cyberskill` + `NPM_TOKEN` sẵn sàng; lần publish đầu `@cyberskill/design` + grant consumer viết tay vẫn do owner chạy (quyết định §7). Soft-skip ≠ release đã publish của *package này*.
+- **npm** — **LAUNCH `@cyberskill/design@1.1.0`** (publish qua tag `v1.1.0`); CI dùng **Trusted Publishing (OIDC)** qua `npm-publish.yml`; npmjs **disallow tokens**; grant consumer có hiệu lực tại `docs/consumer-grant.md` (quyết định §7). Entry package mặc định là bundler-native `_esm/react.mjs` (React peer); đường browser là `@cyberskill/design/legacy` → `_esm/cs.mjs` (quyết định §10).
+
+## 10. Export React bundler-native (Next / SSR)
+
+**Lựa chọn owner: ship `_esm/react.mjs` làm mặc định `exports["."]`** (Th7 2026; host React 19 Th7 2026)
+
+- React / react-dom là **peerDependencies** (`^18 || ^19`); entry re-export JSX source (consumer transpile — ví dụ Next `transpilePackages`). Storybook / CI **devDependencies** pin **react@19.2.8** / **react-dom@19.2.8**.
+- Browser / no-build giữ `_esm/cs.mjs` tại `exports["./legacy"]` (CDN self-ensure + `_ds_bundle.js`). React 19 chính thức bỏ UMD — đường CDN load **`umd-react@19.2.8`** (pin SRI) để tạo `window.React` / `window.ReactDOM` cho `_ds_bundle.js`. Cùng pin dùng trong audit HTML, specimen card, UI kit, và runtime `templates/*/support.js` byte-identical.
+- Alias `@cyberskill/design/react` mirror entry mặc định. VERSION là **1.1.0**; republish qua Trusted Publishing sau merge.
+- Docs: `docs/consuming.md` (+ VI); gate: `package-exports-integrity` + `test:react-entry`.
 
 ## Việc maintainer (đang mở)
 
 Theo dõi vận hành — không phải marketing sản phẩm, không phải backlog công khai:
 
 1. **Code Connect** — hoãn (Figma free). Khi lên Org: thay stub `9999:*` trong `code-connect/node-map.json` bằng node ID library đã publish.
-2. **npm publish lần đầu + grant** — ~~org / `NPM_TOKEN`~~ **xong**. Còn lại: Actions → **npm-publish** → Run workflow; xác nhận `npm view @cyberskill/design`; viết grant consumer cho team được duyệt (xem `docs/consuming.md`).
+
+~~2. Grant consumer npm~~ — **xong** (Th7 2026): Trusted Publishing + `docs/consumer-grant.md` (+ VI) cho sản phẩm portfolio CyberSkill.
 
 ~~3. Chốt registry products~~ — **xong** (Th7 2026): xem quyết định §9; `docs/products.md` đã khóa.
 
-Schema sidecar và Storybook `FullMatrix` tiếp tục lớn **theo cơ hội** khi primary đã đủ điều kiện (hiện chỉ Button có FullMatrix theo contract) — không phải đợt mass-add. Xem `docs/quality-gates.md`.
+~~4. Đường consumer registry đầu tiên~~ — **xong** (Th7 2026): `examples/npm-hello/` cài `@cyberskill/design` cho identity **Lumi** đã khóa; ghi trong `docs/consuming.md` (+ VI) và `docs/release-notes.md`. Nay target **1.1.0** post-LAUNCH.
+
+5. **Drift native + element-pack trên PR là fail-closed** (Th7 2026) — `regenerate-tokens` chạy read-only trên pull request và exit 1 thay vì push; chỉ `regenerate-tokens-push` (main / schedule / thủ công) giữ `contents: write`. Khi PR fail, chạy `npm run tokens:elements && node _audit/ci/generate-native-tokens.mjs` rồi commit packs + natives. Xem `docs/ci-cd.md`.
+
+6. **Shadcn gap / Wave 2** (Th7 2026) — CyberSkill đã phủ ~53/62 primitive shadcn dưới dạng CS-native (forms / overlays / nav / data). Đã ship: pilot `ScrollArea`, `Collapsible`, `AspectRatio`; Wave 2 `AlertDialog` (vs Popconfirm), `Item` row primitive, `NativeSelect`. Phần còn lại của shadcn là non-port có chủ đích (block, Tailwind, Radix CLI). **Không** port những thứ đó — map pattern sang `templates/` + `ui_kits/` hiện có.
+
+7. **Hình học màu Element** (Th7 2026; thanh palette owner Th7 2026) — **30** bộ mặc định (5 × soft/middle/deep × light/dark) từ `tokens/element-seeds.json` (`npm run tokens:elements`): soft = pastel wash, middle = mặc định đồng bộ cường độ (Thổ middle ghim ochre logo), deep = anh em tối hơn rõ trong cùng họ hue; role hài hòa; khóa hue light↔dark; sàn APCA dark. Gate geometry yêu cầu cả minΔE và minΔL cộng L đơn điệu. Tên variant công khai không đổi. Hard gate: `_audit/element-geometry.html`. Rubric: `docs/benchmark-rubric.md`.
+
+8. **Trục Style (`data-cs-style`)** (Th7 2026) — Trục sản phẩm thứ tư; sole pack live **liquid-glass** (vắng ≡ liquid-glass). Hợp đồng: `tokens/styles.css` + hard gate `_audit/style-contract.html`. Pack Style tương lai có thể mở rộng vô hạn, mỗi pack một ngôn ngữ phối màu riêng — chỉ qua owner + checklist Expansion Rule trong `docs/benchmark-rubric.md` (không invent pack tùy tiện).
+
+9. **Identity Lab đã gỡ** (Th7 2026) — Lựa chọn owner: xóa `ui_kits/status-hub/identity-lab.html` và mọi tham chiếu product/docs/Storybook. Demo trục nằm ở Storybook toolbar Theme × Element × Language × Style, Atomic View, và specimen Elements Geometry. Các trục Theme × Element × Language × Style **vẫn là** hạ tầng sản phẩm (template, token, kit trung thành Thổ). Không hồi sinh Lab dưới tên khác nếu chưa có quyết định mới.
+
+Storybook `FullMatrix` bắt buộc khi public primary có ≥1 trong {size enums, variant enums, state keys} (sàn contract ≥28 story). Schema sidecar đã đủ cho template content-hole; template chỉ-axis bỏ qua theo thiết kế. Xem `docs/quality-gates.md` và `docs/storybook.md`.
 
 ## Cách đổi một quyết định
 

package/docs/vi/deploy.md

@@ -40,7 +40,7 @@ Ship cho production (`design.cyberskill.world`):
 
 Nếu host dưới **domain khác**, đổi absolute URL trong các meta tag cho khớp origin, hoặc re-export PNG và giữ path `assets/og-dashboard.png`.
 
-**Misconfig thường gặp:** chọn preset JS framework (Next/CRA) — Vercel chạy đồ thị build sai và có thể 404 root docs. Preset phải giữ **"Other"** và `vercel.json` phải sở hữu install/build/output (xem bảng trên). `package.json` có thể publish (`"private": false`) cho đường npm; nó cũng mang script **chỉ-host** (`build:storybook`, `build:site`, verify/test) mà product app không nên phụ thuộc (xem `docs/consuming.md` và `docs/storybook.md`). Packaging copy webroot portable rồi overlay Storybook tại root `.vercel-static/` (path portable như `/styles.css`, `/_audit/`, `/guidelines/` vẫn cạnh asset Storybook). **Phân biệt misconfig hosting với bug docs thật:** mở `/_audit/docs-consistency.html` trên URL *đã deploy* — gate phát hiện body HTML/error nơi lẽ ra là raw `.md`/`.json` và báo "hosting is intercepting this path".
+**Misconfig thường gặp:** chọn preset JS framework (Next/CRA) — Vercel chạy đồ thị build sai và có thể 404 root docs. Preset phải giữ **"Other"** và `vercel.json` phải sở hữu install/build/output (xem bảng trên). `package.json` có thể publish (`"private": false`) cho đường npm; nó cũng mang script **chỉ-host** (`build:storybook`, `build:site`, verify/test) mà product app không nên phụ thuộc (xem `docs/consuming.md` và `docs/storybook.md`). Packaging copy webroot portable rồi overlay Storybook tại root `.vercel-static/` (path portable như `/styles.css`, `/_audit/`, `/guidelines/` vẫn cạnh asset Storybook). **`_audit/` cố ý giữ public** — Storybook Status nhúng `_audit/run.html` full-bleed; gỡ đi sẽ phá surface sản phẩm. **Phân biệt misconfig hosting với bug docs thật:** mở `/_audit/docs-consistency.html` trên URL *đã deploy* — gate phát hiện body HTML/error nơi lẽ ra là raw `.md`/`.json` và báo "hosting is intercepting this path".
 
 ## VPS generic / nginx / mọi static host
 

package/docs/vi/design-styles.md

@@ -1,25 +1,43 @@
 # Phong cách thiết kế
 
-Xử lý bề mặt hiện tại là **liquid-glass** (cố định). Các trục styling sống là **Theme × Element × Language** thôi.
+Các trục styling sống là **Theme × Element × Language × Style**. Pack Style duy nhất hôm nay là **liquid-glass** (vắng `data-cs-style` ≡ liquid-glass — cùng pattern mặc định với light theme / Thổ middle).
+
 | Trục | Cách đặt | Thay đổi gì |
 |---|---|---|
-| **Theme** | `data-theme="light\|dark"` | màu semantic sáng/tối |
-| **Element** | `data-cs-element` + tùy chọn `data-cs-variant` | bản sắc sản phẩm Ngũ Hành (15 pack) |
+| **Theme** | light = không có attribute; `data-theme="dark"` | màu semantic sáng/tối (trục UI sản phẩm). Ở tầng token, `data-theme="system"` theo OS (`prefers-color-scheme`) và mirror dark — Storybook toolbar và Atomic View có điều khiển system |
+| **Element** | `data-cs-element` + tùy chọn `data-cs-variant` | bản sắc sản phẩm Ngũ Hành (**15 pack** = 5 element × soft/middle/deep) |
 | **Language** | `lang` / Language tweak | bản sao EN · VI |
+| **Style** | `data-cs-style` (tuỳ chọn; vắng ≡ `liquid-glass`) | Pack vật liệu bề mặt. Sole pack hôm nay: **liquid-glass** (`tokens/styles.css` + `base/glass.css`) |
 
-## Xử lý cố định
+## Hợp đồng màu Element
 
-- Vật liệu liquid-glass (`cs-surface-*`) là ngôn ngữ bề mặt mặc định.
+Nguồn sự thật: [`tokens/element-seeds.json`](../../tokens/element-seeds.json) → `npm run tokens:elements` → [`tokens/elements.css`](../../tokens/elements.css) (+ JSON / JS / DTCG / native). **Không sửa hex pack bằng tay.**
 
-- Radius, shadow và token kính đến từ hệ base — không phải trục "style pack" song song.
+| Rule | Chi tiết |
+|---|---|
+| **Mặc định** | Thổ **middle** (studio) — ochre logo `#F4BA17` trên `:root` khi không có attribute element |
+| **Thang cường độ** | Mỗi element có **soft · middle · deep** với mục tiêu L OKLCH dùng chung (C scale theo element). Middle là mặc định (không `data-cs-variant`) |
+| **Giữ tên** | Variant công khai vẫn `sand/clay`, `plasma/lava`, `mist/ocean`, `bamboo/forest`, `titanium/steel` — map lên thang (xem cột Slot trong [`docs/vi/products.md`](products.md)) |
+| **Offset tính cách** | `dh`/`dc` nhỏ, tường minh trong seed (ví dụ Hỏa·plasma, Kim·steel) — không drift tay |
+| **Light ↔ dark** | Cùng họ hue (Δh khóa); remap role + giải APCA — 15 × 2 = **30 bộ màu** |
+| **Rule chữ** | Chữ trên `-bright` hoặc `-tint` thôi — không trên mid-tone `-accent` |
+| **Không bao giờ remap** | Focus ring `--cs-color-accent-ochre` · màu semantic status |
+| **Gate hình học** | [`_audit/element-geometry.html`](../../_audit/element-geometry.html) — sync cường độ · tách variant · khóa hue |
 
+## Pack Style — liquid-glass
+
+- Vật liệu liquid-glass (`cs-surface-*`) là ngôn ngữ bề mặt mặc định.
+- Radius, shadow và token kính đến từ `tokens/elevation.css` + `base/glass.css`; hợp đồng trục Style nằm ở [`tokens/styles.css`](../../tokens/styles.css).
+- Gate: [`_audit/style-contract.html`](../../_audit/style-contract.html) — allowlist chỉ `liquid-glass`.
 - Từ chối theo doctrine: hue neon/cyberpunk lạnh, memphis vui nhộn, skeuomorphism đầy đủ, emoji trong chrome UI.
+- Họ chữ cố định và có tên token: Be Vietnam Pro (UI) · Space Grotesk (`--cs-font-family-display`, mặt chữ tiêu đề opt-in) · JetBrains Mono (code). Mặt chữ display là **role một scope có thể chọn dùng** qua `.cs-display-face`, không phải trục sản phẩm.
 
 ## Thêm một look mới
 
 Ưu tiên:
-1. **Element** hoặc **variant** mới khi dịch chuyển là hue/bản sắc.
+1. Tweak cường độ **Element** (offset seed) khi dịch chuyển là hue/bản sắc trong Ngũ Hành.
 2. Composition cục bộ với token/class sẵn có khi dịch chuyển là layout một lần.
 3. Pattern đã ghi trong `docs/conventions.md` + specimen card khi pattern cần tái sử dụng.
+4. Pack **`data-cs-style`** mới chỉ sau Expansion Rule — xem checklist trong [`docs/vi/benchmark-rubric.md`](benchmark-rubric.md). Style tiêu thụ cùng 9 role accent; không invent pack Element song song.
 
-Không invent trục sản phẩm thứ tư nếu chưa Expansion Rule qua tokens, Storybook Live, templates, docs và gates.
+Không invent trục sản phẩm thứ năm, và không thêm Style pack thứ hai khi chưa đủ checklist Expansion Rule.

package/docs/vi/figma.md

@@ -2,7 +2,7 @@
 
 ## Những gì ship trong repo
 - Design tokens dạng CSS + DTCG (`tokens/tokens.dtcg.json`) kèm mirror native Swift/Kotlin/Flutter.
-- UI kits dưới `ui_kits/` là tái tạo HTML giữ pixel-faithful theo doctrine brand (Identity Lab Thổ-first).
+- UI kits dưới `ui_kits/` là tái tạo HTML giữ pixel-faithful theo doctrine brand (kit Thổ-first; demo trục ở Storybook / Atomic View).
 - Mapping **Code Connect** cho cả **99** public primaries (`components/**/*.figma.tsx` + `figma.config.json` + `code-connect/node-map.json`).
 
 ## Công thức import Tokens Studio (hand-sync)
@@ -47,7 +47,7 @@ Phải là **repository secrets** dưới tab Actions (tên đúng, phân biệt
 
 Nếu hover PAT chỉ thấy scope kiểu `file_content:read`, `file_comments:*`, `webhooks:*`, `library_*` — đó là bình thường trên ghế **Professional / Organization**. Figma **không liệt kê** `file_variables:*` trừ khi account là **Enterprise**. Tạo lại PAT trên plan non-Enterprise không mở được Variables REST API.
 
-**CI làm gì hôm nay:** secrets + mở file chạy trên mọi plan; Variables write soft-skip kèm report khi Figma trả 403 / scope không hợp lệ cho `file_variables` (để gates vẫn xanh). Auto-push đầy đủ cần Enterprise + hai scope đó trên PAT.
+**CI làm gì hôm nay:** job `figma-variables-push` **soft-skip (exit 0 + report) nếu `FIGMA_TOKEN` / `FIGMA_FILE_KEY` trống** — cùng trung thực với Code Connect (thiếu secret không làm đỏ main). Có secret thì mở file chạy trên mọi plan; Variables write cũng soft-skip kèm report khi Figma trả **403** / scope không hợp lệ cho `file_variables`. Soft-skip ≠ sync Variables live. Auto-push đầy đủ cần Enterprise + hai scope đó trên PAT.
 
 **Lựa chọn non-Enterprise:** hand-sync colour styles từ `tokens/tokens.dtcg.json`, hoặc dùng [Tokens Studio](https://tokens.studio/) / Plugin API trong desktop app (đường plugin không dùng job REST này) — xem công thức import ở trên.
 
@@ -83,7 +83,7 @@ Sau push thành công, mở file trong Figma → **Local variables** → collect
 | Mapping | `components/**/<Name>.figma.tsx` — **99** primaries; Button / TextField / Dialog / Card / Alert có prop map; còn lại là stub |
 | Generator | `npm run code-connect:generate` → `_audit/ci/generate-code-connect.mjs` |
 | Job CI | `code-connect` trong `design-system-gates.yml` (PR + `main` + thủ công) |
-| Dry-run local | `npm run code-connect:dry-run` (không secrets; assert config + ≥99 file) |
+| Dry-run local | `npm run code-connect:dry-run` (không secrets; assert config + ≥105 file) |
 
 URL tài liệu dùng file key placeholder **`CS_FIGMA_FILE_KEY`**. Publish thay `FIGMA_FILE_KEY` qua `documentUrlSubstitutions`.
 

package/docs/vi/live-hub.md

@@ -20,9 +20,9 @@
 
 | Bề mặt | Vai trò |
 |---|---|
-| **Storybook** (`/`) | Bề mặt sản phẩm host: toolbar Theme × Element × Language, Docs/Foundations/Components/Release Notes/Status, và Maintainer/* iframe vào HTML portable |
+| **Storybook** (`/`) | Bề mặt sản phẩm host: toolbar Theme × Element × Language × Style, Docs/Foundations/Components/Release Notes/Status, và Maintainer/* iframe vào HTML portable |
 | **Atomic View** (`guidelines/atomic-view.html`) | Lưới component zero-build portable cho gates và duyệt clone-and-open — không phải entry sản phẩm công khai |
-| **Guidelines / templates khác** | Specimen portable; mở từ Storybook Maintainer/* khi khám phá Motion, Identity Lab, kitchen-sink, v.v. |
+| **Guidelines / templates khác** | Specimen portable; mở từ Storybook Maintainer/* khi khám phá Motion, index Status Hub / Website / Deck, kitchen-sink, v.v. |
 | **Legacy `/dashboard`, `/dashboard/`, `/dashboard.html`, `/dashboard/:path*`, `/playground`, `/playground/`, `/playground/:path*`** | Redirect về `/` (stub + redirect Vercel) |
 
 ## Bản đồ bề mặt (story Maintainer/*)
@@ -31,7 +31,9 @@
 |---|---|
 | Components/* CSF | Nguồn React dưới `components/` |
 | Maintainer/Surfaces → Motion | `guidelines/motion.html` |
-| Maintainer/Surfaces → Identity Lab | `ui_kits/status-hub/identity-lab.html` |
+| Maintainer/Surfaces → Status Hub | `ui_kits/status-hub/index.html` |
+| Maintainer/Surfaces → Website | `ui_kits/website/index.html` |
+| Maintainer/Surfaces → Deck | `ui_kits/deck/index.html` |
 | Maintainer/Surfaces → Template Playground | `templates/playground.html` |
 | Maintainer/Surfaces → Kitchen Sink | `templates/kitchen-sink.html` |
 | Maintainer/Surfaces → Image Slots | `templates/image-slots-demo.html` |

package/docs/vi/products.md

@@ -4,22 +4,24 @@
 
 **Nguồn chân lý.** Ánh xạ sản phẩm portfolio CyberSkill sang pack element Ngũ Hành. Một element mỗi sản phẩm; accent phụ chỉ trong gradient wash theo Tương sinh.
 
-| Sản phẩm | Element | Variant | Phụ (Tương sinh) | Markup |
-|---|---|---|---|---|
-| **Lumi** — trợ lý wish | Hỏa · fire | plasma | tho | `data-cs-element="hoa" data-cs-variant="plasma"` |
-| **Status Hub** — portal portfolio khách | Thủy · water | river (mặc định) | moc | `data-cs-element="thuy"` |
-| **CyberOS Agent Spine** — infra agent, memory, gates | Kim · metal | steel | thuy | `data-cs-element="kim" data-cs-variant="steel"` |
-| **CyberSkill Design System** — thư viện này | Mộc · wood | leaf (mặc định) | hoa | `data-cs-element="moc"` |
-| **cyberskill.world** — site studio | Thổ · earth | studio (mặc định) | — | *(không attribute — studio là Thổ)* |
-| **Client delivery suite** — kickoff · QBR · runbooks | Thổ · earth | clay | kim | `data-cs-element="tho" data-cs-variant="clay"` |
-| **Board / investor collateral** | Kim · metal | champagne (mặc định) | thuy | `data-cs-element="kim"` |
-| **HR / employment instruments** | Mộc · wood | bamboo | hoa | `data-cs-element="moc" data-cs-variant="bamboo"` |
+| Sản phẩm | Element | Variant | Slot | Phụ (Tương sinh) | Markup |
+|---|---|---|---|---|---|
+| **Lumi** — trợ lý wish | Hỏa · fire | plasma | soft | tho | `data-cs-element="hoa" data-cs-variant="plasma"` |
+| **Status Hub** — portal portfolio khách | Thủy · water | river (mặc định) | middle | moc | `data-cs-element="thuy"` |
+| **CyberOS Agent Spine** — infra agent, memory, gates | Kim · metal | steel | deep | thuy | `data-cs-element="kim" data-cs-variant="steel"` |
+| **CyberSkill Design System** — thư viện này | Mộc · wood | leaf (mặc định) | middle | hoa | `data-cs-element="moc"` |
+| **cyberskill.world** — site studio | Thổ · earth | studio (mặc định) | middle | — | *(không attribute — studio là Thổ)* |
+| **Client delivery suite** — kickoff · QBR · runbooks | Thổ · earth | clay | deep | kim | `data-cs-element="tho" data-cs-variant="clay"` |
+| **Board / investor collateral** | Kim · metal | champagne (mặc định) | middle | thuy | `data-cs-element="kim"` |
+| **HR / employment instruments** | Mộc · wood | bamboo | soft | hoa | `data-cs-element="moc" data-cs-variant="bamboo"` |
+
+**Slot** (soft / middle / deep) là thang cường độ dùng chung — xem [`docs/vi/design-styles.md`](design-styles.md). Tên variant công khai giữ ổn định; pack generate từ `tokens/element-seeds.json`.
 
 **Vì sao:** Lumi là tia hội thoại (plasma). Status Hub là dòng trạng thái bình (Thủy). Agent Spine là hạ tầng chính xác (Kim·steel). Design System nuôi mọi thứ khác (Mộc). Brand studio là Thổ. Delivery là đất vững (clay). Board collateral là kim loại chính xác. HR instruments nuôi người (bamboo).
 
 ## Phạm vi
 
-- **UI kits giữ trung thành Thổ.** `ui_kits/status-hub` và `ui_kits/website` vẫn là tái tạo Thổ; demo theo element nằm ở **Identity Lab** / Storybook Live.
+- **UI kits giữ trung thành Thổ.** `ui_kits/status-hub` và `ui_kits/website` vẫn là tái tạo Thổ; demo theo element nằm ở **Storybook Element toolbar**, **Atomic View**, và specimen **Elements Geometry**.
 
 - **Dùng một ánh xạ:** scope root sản phẩm bằng Markup của hàng và dùng `--cs-accent-*`.
 

package/docs/vi/quality-gates.md

@@ -4,41 +4,46 @@ Mọi quality gate deterministic trong hệ thống, nó assert gì, tiêu chí
 
 **Gate chạy ở đâu.** *Fast board CI* = job `fast-gates` trong `.github/workflows/design-system-gates.yml`, serve repo và điều khiển `_audit/run.html` headless qua `_audit/ci/run-gates.mjs` (mọi push/PR + nightly + thủ công) — hàng board mới được nhận tự động. Hai gate thêm chạy standalone như *merge blocker* (job `docs-consistency-blocker`, qua `_audit/ci/run-single-gate.mjs`). *Whole-set CI* = job `whole-set-audits` (mọi push/PR + nightly — quyết định B của owner). *Unit test* = `npm run test:unit` trong job `unit-tests` (Node thuần, không trình duyệt). *Node pre-checks* = job `node-prechecks` (authority không trình duyệt: bundle freshness, DESIGN.md freshness) cộng job `token-provenance`. Mọi browser gate publish verdict global (`window.__*`) mà headless runner đọc.
 
-## Fast board — 31 gates trong `_audit/run.html`
+## Fast board — 34 gates trong `_audit/run.html`
+
+Nguyên tắc benchmark (WCAG · APCA · OKLCH · DTCG · doctrine CDS + mở rộng style): [`docs/vi/benchmark-rubric.md`](benchmark-rubric.md).
 
 | Gate | File | Assert gì | Tiêu chí pass | Loại | Chạy ở đâu |
 |---|---|---|---|---|---|
 | Contrast guard | `_audit/contrast-guard.html` | Không base rule sơn umber trên bề mặt themeable mà thiếu dark override; mọi cặp text×surface semantic ghi điểm light và dark | 0 rule không shield và 0 cặp fail (`__contrastguard`) | Hard | Fast board CI |
-| Three-axes guard | `_audit/axis-guard.html` | Không live source đưa lại bề mặt sản phẩm Expression/Density đã nghỉ | 0 hit trên source index bởi manifest (`__axisguard`) | Hard | Fast board CI |
+| Axes guard | `_audit/axis-guard.html` | Không live source đưa lại bề mặt sản phẩm Expression/Density đã nghỉ | 0 hit trên source index bởi manifest (`__axisguard`) | Hard | Fast board CI |
 | Manifest CSS paths | `_audit/manifest-css-guard.html` | Mọi entry `globalCssPaths` của `_ds_manifest.json` tồn tại như raw CSS; mọi `@import` của `styles.css` được liệt kê | 0 thiếu / 0 chưa liệt kê (`__cssguard`) | Hard | Fast board CI |
-| Docs consistency | `_audit/docs-consistency.html` | Mọi claim đếm trong README/SKILL/llms.txt khớp compiler manifest; `VERSION` + `package.json` pin 1.0.0; không tham chiếu changelog-file; blacklist stale-phrase (suite/pack count đã gỡ trong audit Th7 2026) sạch trên README/SKILL/llms + `docs/*.md` (ghi chú lịch sử dưới `_audit/archive/` không được quét); `DESIGN.md` tồn tại với front-matter version = `VERSION`; routing agent trung thực — Claude path cite `_esm/cs.mjs` + bundle prefix; Stitch path cấm `*.dc.html` làm SoT; tên package `@cyberskill/design` | 0 claim lệch, 0 blacklist hit, pin + stamp + routing nguyên (`__docs`) | Hard | Fast board CI + merge blocker |
+| Docs consistency | `_audit/docs-consistency.html` | Mọi claim đếm trong README/SKILL/llms.txt khớp compiler manifest; claim số card trong prose audit (`_audit/index` / README / namespace-portability) khớp `manifest.cards`; `VERSION` + `package.json` pin 1.1.0; không tham chiếu changelog-file; blacklist stale-phrase (suite/pack count đã gỡ trong audit Th7 2026) sạch trên README/SKILL/llms + `docs/*.md` (ghi chú lịch sử dưới `_audit/archive/` không được quét); `DESIGN.md` tồn tại với front-matter version = `VERSION`; routing agent trung thực — Claude path cite `_esm/cs.mjs` + bundle prefix; Stitch path cấm `*.dc.html` làm SoT; tên package `@cyberskill/design` | 0 claim lệch, 0 blacklist hit, pin + stamp + routing nguyên (`__docs`) | Hard | Fast board CI + merge blocker |
 | Docs language parity | `_audit/docs-lang-parity.html` | Mọi EN `docs/*.md` hướng operator có counterpart `docs/vi/`; VI không phải stub trống/TODO (≥40% độ dài EN); blacklist stale-phrase sạch trên cả EN và VI (ghi chú lịch sử dưới `_audit/archive/` không được theo dõi) | 0 cặp thiếu, 0 stub, 0 blacklist hit (`__docslangparity`) | Hard | Fast board CI |
-| DESIGN.md parity | `_audit/design-md-parity.html` | Root `DESIGN.md` (open-spec Stitch) byte-equals regeneration trong trình duyệt từ `tokens.dtcg.json` + `_ds_manifest.json` + `VERSION` qua `scripts/design-md-lib.mjs` dùng chung; từng hàng trong 138 token được re-check | Byte-identical + 0 hàng drift (`__designmd`) | Hard | Fast board CI |
-| Version stamp | `_audit/version-stamp.html` | `package.json`, meta `tokens.json`/`tokens.js`, DTCG `$extensions`, `provenance.json` release + dtcgStamp, và front matter `DESIGN.md` đều bằng `VERSION` (pin 1.0.0) | Cả 8 stamp bằng nhau (`__versionstamp`) | Hard | Fast board CI |
+| DESIGN.md parity | `_audit/design-md-parity.html` | Root `DESIGN.md` (open-spec Stitch) byte-equals regeneration trong trình duyệt từ `tokens.dtcg.json` + `_ds_manifest.json` + `VERSION` qua `scripts/design-md-lib.mjs` dùng chung; từng hàng token được re-check riêng (số hàng in kèm verdict) | Byte-identical + 0 hàng drift (`__designmd`) | Hard | Fast board CI |
+| Version stamp | `_audit/version-stamp.html` | `package.json`, meta `tokens.json`/`tokens.js`, DTCG `$extensions`, `provenance.json` release + dtcgStamp, front matter `DESIGN.md`, và `_esm/cs.mjs` `export const VERSION` đều bằng `VERSION` (pin 1.1.0) | Cả 9 stamp bằng nhau (`__versionstamp`) | Hard | Fast board CI |
 | Namespace portability | `_audit/namespace-portability.html` | Không source index bởi manifest hardcode hậu tố bundle project-id của compiler | 0 hậu tố hardcode (`__nsguard`) | Hard | Fast board CI |
 | Token contract | `_audit/token-contract.html` | Cả 15 scope element×variant resolve cả 9 role `--cs-accent-*`; token semantic core resolve | 0 role thiếu, 0 token core thiếu (`__contract`) | Hard | Fast board CI |
 | Token pipeline | `_audit/token-pipeline-test.html` | Mọi hằng dẫn từ DTCG xuất hiện nguyên văn trong cả ba target `tokens/native/`; provenance sha-256 khớp nguồn DTCG | 0 hằng drift, hash khớp (`__tokenpipe`) | Hard | Fast board CI |
 | Token format parity | `_audit/token-format-parity.html` | Mọi khai báo `--cs-*` trong `tokens/*.css` bằng mirror trong `tokens.json`, `tokens.js` (ESM deep-equal live), và DTCG (chuỗi ext-css hoặc typed transform) — base `:root` + theme dark/system + 15 pack element + 15 pack dark; 4 duration `_ds_manifest.json` bằng `motion.css` (chặn bug reduced-motion 0ms của compiler) | 0 diff trên mọi scope (`__tokenformat`) | Hard | Fast board CI |
 | DTCG typing | `_audit/dtcg-typing.html` | Mọi leaf `$value` DTCG mang W3C `$type`; mọi `{alias}` resolve (theo chuỗi, không cycle); mọi shadow token là object/array có đủ field layer; byType counts bằng `provenance.json` | 0 untyped / dangling / string shadow (`__dtcgtyping`) | Hard | Fast board CI |
-| Story coverage | `_audit/story-coverage.html` | Mọi primary bundle export có Atomic View story (`guidelines/atomic-view.html`) | 0 story thiếu (`__storycov`) | Hard | Fast board CI |
+| Font-face integrity | `_audit/font-face-integrity.html` | Mọi `@font-face` trong `tokens/fonts.css` là self-host dưới `fonts/` (không `src` CDN), chia subset với `font-display: swap`, và trỏ tới file có byte mở đầu là magic `wOF2`; mọi family được một token `--cs-font-family-*` gọi tên đầu tiên đều có face ở đây **kể cả subset tiếng Việt** (`U+1EA0-1EF9`), và mọi family self-host đều được một token gọi tên; `fonts[]` trong `_ds_manifest.json` khớp từng entry với face đã parse và `brandFonts[]` khớp tập family theo token; mỗi family load thật qua `document.fonts`; `.cs-display-face` chuyển `--cs-heading-family` sang display family mà không rò sang body copy | 0 file thiếu/từ xa, 0 family không có subset VN, 0 diff manifest (`__fontface`) | Hard | Fast board CI |
+| Story coverage | `_audit/story-coverage.html` | Mọi primary bundle export có Atomic View story; primary tweakable trong `PLAYGROUND_REQUIRED` phải có playground `controls` + `renderC` | 0 story thiếu + 0 playground thiếu (`__storycov`) | Hard | Fast board CI |
 | Consumer smoke test | `_audit/consumer-smoke-test.html` | Đường consumer ngoài hoạt động: `styles.css` + `_ds_bundle.js` mount component thật và brand token tới Button đã render | Mọi assert mount + token pass (`__smoke`) | Hard | Fast board CI |
 | Bundle freshness | `_audit/bundle-freshness.html` | Mọi source ghi trong header `_ds_bundle.js` re-hash khớp sha-256 header (nhân bản trình duyệt của `ci/check-bundle-freshness.mjs`; script Node vẫn là authority CI và còn khám phá file mới); source component manifest ⊆ header | 0 source drift / thiếu (`__bundlefresh`) | Hard | Fast board CI (+ Node authority trong `node-prechecks`) |
-| ESM smoke test | `_audit/esm-smoke-test.html` | `_esm/cs.mjs` import không cần build, re-export mọi component manifest, và Button mount nhận brand token | Export/manifest parity + kiểm token (`__esm`) | Hard | Fast board CI |
-| Package exports integrity | `_audit/package-exports-integrity.html` | Mọi entry `files` của `package.json` và mọi target `module`/`style`/`exports` tồn tại; mọi target entry-point được `files` phủ (pack-safe); `_esm/cs.mjs` hình ESM và re-export `CS.*` ⊆ export lộ trong header bundle | 0 thiếu / chưa phủ / lạ (`__pkgexports`) | Hard | Fast board CI |
+| ESM smoke test | `_audit/esm-smoke-test.html` | `_esm/cs.mjs` import không cần build, re-export mọi component manifest, `VERSION` bằng pin `VERSION` gốc, và Button mount nhận brand token | Export/manifest parity + pin VERSION + kiểm token (`__esm`) | Hard | Fast board CI |
+| Package exports integrity | `_audit/package-exports-integrity.html` | Mọi entry `files` của `package.json` và mọi target `module`/`types`/`style`/`exports` tồn tại; mọi target entry-point được `files` phủ (pack-safe); dual entry — `_esm/react.mjs` (mặc định / `./react`, React peer) + `_esm/cs.mjs` (`./legacy`) — hình ESM và re-export ⊆ export lộ trong header bundle | 0 thiếu / chưa phủ / lạ (`__pkgexports`) | Hard | Fast board CI |
 | Component children | `_audit/component-children-test.html` | Component void-element (Checkbox, Radio, Switch, SearchField, NumberField, Slider, Divider, TextField) mount với child lạc mà không throw React #137 | 0 throw (`__result.anyThrew === false`) | Hard | Fast board CI |
-| Component behavior | `_audit/component-behavior-test.html` | 35 assert tương tác thật — toggle, controlled selection, lọc palette, overlay open/close, Form rules, Tree/Splitter/keyboard | 35/35 assert pass (`__behavior`) | Hard | Fast board CI |
-| A11y interactions | `_audit/a11y-gate.html` | Focus management (Dialog/Drawer trap + restore + Escape), roving tabindex, combobox `aria-activedescendant`, hợp đồng role/label | Mọi assert keyboard/ARIA pass (`__a11y`) | Hard | Fast board CI |
+| Component behavior | `_audit/component-behavior-test.html` | 78 assert tương tác thật — mọi public primary có hợp đồng tương tác người dùng (overlay, form, AI gate, shell, media/copy); primary chỉ hiển thị loại trừ theo thiết kế | 78/78 assert pass (`__behavior`) | Hard | Fast board CI |
+| A11y interactions | `_audit/a11y-gate.html` | Focus management (Dialog/Drawer trap + restore + Escape), roving tabindex, combobox `aria-activedescendant`, hợp đồng role/label, cộng Esc/focus open-state cho Cascader · TreeSelect · Tour · HoverCard · ContextMenu | Mọi assert keyboard/ARIA pass (`__a11y`) | Hard | Fast board CI |
 | A11y CSSOM | `_audit/a11y-harness.html` | Mọi control `.cs-*` tương tác đạt floor touch-target đã ghi dưới coarse pointer; focus-ring, reduced-motion, và contrast rule chứng minh trong source CSS | 0 vi phạm floor, mọi source proof tìm thấy (`__a11ycss`) | Hard | Fast board CI |
-| Template schema v2 | `_audit/template-schema-test.html` | Mọi sidecar `content-schema.json` validate theo JSON Schema và mọi slot id khai báo resolve tới `{{ hole }}` thật trong template | 0 sidecar invalid, 0 slot id treo (`__schemav2`) | Hard | Fast board CI |
+| Template schema v2 | `_audit/template-schema-test.html` | Mọi sidecar `content-schema.json` validate theo JSON Schema, mọi slot id khai báo resolve tới `{{ hole }}` thật trong template, và mọi template lộ **content** hole author được đều có sidecar (hole trục/control-flow và tweak boolean được loại trừ — xem `docs/template-schema-v2.md`) | 0 sidecar invalid, 0 slot id treo, 0 template hole-driven thiếu sidecar (`__schemav2`) | Hard | Fast board CI |
 | Support runtime identity | `_audit/support-runtime-identity.html` | Mọi bản `templates/*/support.js` (một mỗi template, 84) byte-identical: sha-256 qua SubtleCrypto, đúng một hash duy nhất, số bản == số template manifest | 1 hash duy nhất, count khớp (`__supportid`) | Hard | Fast board CI |
 | Bilingual parity | `_audit/bilingual-parity.html` | Mọi component trong `components/_i18n/strings.js` có bảng en + vi với key set bằng nhau và không giá trị rỗng | 0 key thiếu/thừa, 0 giá trị rỗng (`__bilingual`) | Hard | Fast board CI + merge blocker |
 | Template language parity | `_audit/template-lang-parity.html` | Quét source tĩnh cả 84 `.dc.html`: en/vi hole-map key set giống và không rỗng (21 map template); nhánh `sc-if` `isEN`/`isVN` cặp (24 branch template); mọi template có language-tweak có cơ chế bilingual; lexicon EN-leak (Unsubscribe · View in browser · Preferences · All rights reserved · Manage subscription · Sent with) không bao giờ xuất hiện ngoài guard `isEN` / map `en`. Instrument VN-first stacked (37 `vn-*` + 3 `doc-*`) miễn leak theo thiết kế — cả hai ngôn ngữ luôn render | 0 key drift, 0 nhánh không cặp, 0 leak (`__langparity`) | Hard | Fast board CI |
 | APCA dark packs | `_audit/apca-dark-preview.html` | Cả 15 pack element×variant giữ mục tiêu APCA ở dark (bright-as-text ≥ 75, accent UI ≥ 60, ink-on-accent ≥ 75, ink-on-tint ≥ 75) | 0 fail hiện tại (`__apcaPreview.currentFail === 0`) | Hard | Fast board CI |
+| Element geometry | `_audit/element-geometry.html` | Sync cường độ soft/middle/deep giữa năm element; tách variant; khóa hue light↔dark; Thổ middle ghim ochre logo; pack generate từ seed | `__elementgeometry.pass` | Hard | Fast board CI |
+| Style contract | `_audit/style-contract.html` | Allowlist trục Style: sole pack `liquid-glass` (vắng ≡ mặc định); `styles.css` import `tokens/styles.css`; `--cs-style-pack` resolve; không `data-cs-style` lạ | `__stylecontract.pass` | Hard | Fast board CI |
 | Visual baselines | `_audit/visual-diff.html` | Baseline template tồn tại và load được để so sánh side-by-side / overlay | Baseline có; drift đánh giá bằng mắt (`__visualdiff`) | Advisory | Fast board CI |
 | Component baselines | `_audit/component-visual-diff.html` | 12 crop component curated neo các tầng atomic cho so sánh visual | Crop render + baseline có (`__componentVisualDiff`) | Advisory | Fast board CI |
-| Axe smoke | `_audit/axe-smoke.html` | Rule serious/critical của axe-core 4.10.0 (vendored tại `_audit/vendor/axe.min.js`) trên cụm component bilingual đã mount | 0 finding serious/critical (`__axesmoke`) | Hard | Fast board CI |
+| Axe smoke | `_audit/axe-smoke.html` + `_audit/lib/axe-fixtures.js` | Rule serious/critical WCAG 2 A/AA của axe-core 4.10.0 (vendored tại `_audit/vendor/axe.min.js`) trên mọi public primary (fixture khoá inventory; bilingual EN·VI) — Dialog, AlertDialog, Drawer, Tour, CommandPalette và Menu mount mở, còn Cascader / TreeSelect / Menubar / Combobox được bung trước khi quét; tương đương enforcement a11y Storybook (không test-runner riêng) | 0 finding serious/critical (`__axesmoke`) | Hard | Fast board CI |
 | Print smoke | `_audit/print-smoke.html` | Document template khai báo meta print-ownership và hook CSS `@page` mà đường export dựa vào | 0 document thiếu print hook (`__printsmoke`) | Hard | Fast board CI |
-| Pixel CI | `_audit/pixel-ci.html` + `_audit/ci/pixel-diff.mjs` | Baseline curated tồn tại; script Playwright capture so sánh % pixel thật; report gần nhất phải sạch (`drifted[]` rỗng) | Hợp đồng + compare sạch (`__pixelci.pass`); drift hoặc thiếu report → fail | Hard | Fast board CI (bước compare nuôi hàng) + job `pixel-diff` |
+| Pixel CI | `_audit/pixel-ci.html` + `_audit/ci/pixel-diff.mjs` | 15 baseline curated tồn tại; script Playwright capture so sánh % pixel thật; report gần nhất phải sạch (`drifted[]` rỗng) | Hợp đồng + compare sạch (`__pixelci.pass`); drift hoặc thiếu report → fail | Hard | Fast board CI (bước compare nuôi hàng) + job `pixel-diff` |
 
 ## Whole-set audits — mọi template, mọi trục
 
@@ -56,35 +61,44 @@ Mọi quality gate deterministic trong hệ thống, nó assert gì, tiêu chí
 | Bundle freshness (authority) | `_audit/ci/check-bundle-freshness.mjs` | `_ds_bundle.js` đã commit được build từ component source hiện tại — khám phá source đầy đủ (đi `components/`, `ui_kits/`, root sources), nên file mới/xóa cũng bị bắt, hàng trình duyệt không làm được | Exit 0, 0 source drift/mới/xóa | Hard | CI job `node-prechecks` |
 | DESIGN.md freshness | `scripts/generate-design-md.mjs --check` | Root `DESIGN.md` byte-equals regeneration mới từ DTCG + manifest + `VERSION` | Exit 0 khi byte khớp | Hard | CI job `node-prechecks` |
 
-## Unit tests — `npm run test:unit` (8)
+## Unit tests — `npm run test:unit` (11)
 
 | Test | File | Assert gì | Tiêu chí pass | Loại | Chạy ở đâu |
 |---|---|---|---|---|---|
 | Nav model | `_audit/ci/test-nav-model.mjs` | Logic classify/group của `guidelines/nav-model.js` đã ship hành xử đúng (chạy module thật) | Mọi assert pass (exit 0) | Hard | Unit test |
 | Health/Tokens UI contract | `_audit/ci/test-health-tokens-contract.mjs` | Hợp đồng cấu trúc của entry HTML Health + Tokens giữ | Mọi assert pass (exit 0) | Hard | Unit test |
 | Form paths | `_audit/ci/test-form-paths.mjs` | Helper Form path hành xử đúng (chạy `Form.jsx` đã ship qua dynamic import) | Mọi assert pass (exit 0) | Hard | Unit test |
-| Storybook contract | `_audit/ci/test-storybook-contract.mjs` | Live hub chỉ là Storybook; SB10 ESM main + addon-docs/a11y; CSF đủ cho mọi public primary; Matrix/AllVariants + AllSizes khi có `argTypes.size`; States/Matrix phủ disabled/loading/error/busy; mọi enum size/variant rời rạc được mount; FullMatrix bắt buộc khi ≥2 trục trong {size, variant, state} tồn tại | Mọi assert pass (exit 0) | Hard | Unit test |
+| Storybook contract | `_audit/ci/test-storybook-contract.mjs` | Live hub chỉ là Storybook; SB10 ESM main + addon-docs/a11y; CSF đủ cho mọi public primary; Matrix/AllVariants + AllSizes khi có `argTypes.size`; States/Matrix phủ disabled/loading/error/busy; mọi enum size/variant rời rạc được mount; FullMatrix bắt buộc khi ≥1 trục trong {size, variant, state} tồn tại (≥28 primary đủ điều kiện) | Mọi assert pass (exit 0) | Hard | Unit test |
+| Axe coverage | `_audit/ci/test-axe-coverage.mjs` | `NAMES` fixture ≡ `listPublicComponents()`; axe-smoke nạp fixture khoá inventory | Mọi assert pass (exit 0) | Hard | Unit test |
 | Figma push helpers | `_audit/ci/test-figma-push-helpers.mjs` | Helper thuần trong `push-figma-variables.mjs` hành xử đúng (không mạng, không secret) | Mọi assert pass (exit 0) | Hard | Unit test |
-| Code Connect helpers | `_audit/ci/test-code-connect.mjs` | 99 primaries, helper node-map/render, classifier soft-skip, `figma.config.json` đã commit + `.figma.tsx` traffic cao | Mọi assert pass (exit 0) | Hard | Unit test |
+| Code Connect helpers | `_audit/ci/test-code-connect.mjs` | 105 primaries, helper node-map/render, classifier soft-skip, `figma.config.json` đã commit + `.figma.tsx` traffic cao | Mọi assert pass (exit 0) | Hard | Unit test |
 | Native samples | `_audit/ci/test-native-samples.mjs` | App sample SwiftUI / Compose / Flutter mỗi cái ≥ 3 màn hình, tham chiếu hằng token đã generate, và ship scaffold Fastlane store (submit tắt) | Mọi assert pass (exit 0) | Hard | Unit test |
 | Subtree consume | `_audit/ci/test-subtree-consume.mjs` | Bản copy portable `styles.css` + `base/` + `tokens/` + `fonts/` + `_esm/` + `_ds_bundle.js` (không clone full) vẫn resolve token/font và mount Button qua ESM — đường subtree-copy Stitch/Claude | Mọi assert pass (exit 0) | Hard | Unit test |
+| React entry | `_audit/ci/test-react-entry.mjs` | Dual package exports (`.` / `./react` → `_esm/react.mjs`, `./legacy` → `_esm/cs.mjs`); pin VERSION 1.1.0; peerDeps React; react.mjs không CDN/bundle bridge và re-export khớp header bundle; `generate-react-entry --check` xanh | Mọi assert pass (exit 0) | Hard | Unit test |
+| Element packs | `_audit/ci/test-element-packs.mjs` | `tokens/elements.css` + mirror JSON/JS/DTCG byte-equal regeneration từ `tokens/element-seeds.json` | `generate-element-packs --check` exit 0 | Hard | Unit test |
 
 Suite `test:unit` được nối vào CI workflow như một phần của hardening Th7 2026 (trước đó chỉ chạy local).
 
 ## Job sync / phân phối (soft-skip)
 
-Soft-skip nghĩa là job exit 0 kèm report khi secret/plan/API không hoàn tất write thật — **không** có nghĩa npm, Code Connect, hay Figma Variables đang live. Coi soft-skip là trung thực tạm thời đến khi các việc maintainer còn lại trong `docs/decisions.md` xong (Code Connect node ID; grant npm / `NPM_TOKEN`). Schema sidecar và Storybook `FullMatrix` lớn theo cơ hội khi primary đã đủ điều kiện — không phải đợt mass-add.
+Soft-skip nghĩa là job exit 0 kèm report khi secret/plan/API không hoàn tất write thật — **không** có nghĩa Code Connect hay Figma Variables đang live. npm CI publish dùng Trusted Publishing; soft-skip là trung thực auth/conflict. Coi việc maintainer còn lại trong `docs/decisions.md` là danh sách mở (Code Connect hoãn; grant consumer tại `docs/consumer-grant.md`). Storybook `FullMatrix` bắt buộc cho mọi public primary có ≥1 trong {size enums, variant enums, state keys} — helper chung tại `stories/lib/matrix.jsx`.
 
 | Job | Script / workflow | Assert gì | Soft-skip khi | Chạy ở đâu |
 |---|---|---|---|---|
-| Figma Variables | `_audit/ci/push-figma-variables.mjs` + job `figma-variables-push` | Secret mở được file; write Variables tùy chọn | Non-Enterprise / thiếu scope `file_variables:*` / API 403 | Push `main` + thủ công |
-| Code Connect | `_audit/ci/code-connect-publish.mjs` + job `code-connect` | Config + 99 mapping; publish tùy chọn | Thiếu `FIGMA_TOKEN`/`FIGMA_FILE_KEY` hoặc API 403/404/429 | PR + `main` + thủ công |
-| npm publish | `_audit/ci/npm-publish.mjs` + `npm-publish.yml` | `files`/`exports` pack-safe; `npm publish` tùy chọn | Thiếu `NPM_TOKEN` hoặc registry auth/404/403 | `workflow_dispatch` / tag `v*` |
+| Figma Variables | `_audit/ci/push-figma-variables.mjs` + job `figma-variables-push` | Secret mở được file; write Variables tùy chọn | Soft-skip khi thiếu secret (cùng trung thực với Code Connect) hoặc non-Enterprise / thiếu scope `file_variables:*` / API **403** sau khi secret đã có. Soft-skip ≠ sync live | Push `main` + thủ công |
+| Code Connect | `_audit/ci/code-connect-publish.mjs` + job `code-connect` | Config + 105 mapping; publish tùy chọn | Thiếu `FIGMA_TOKEN`/`FIGMA_FILE_KEY` hoặc API 403/404/429 | PR + `main` + thủ công |
+| npm publish | `_audit/ci/npm-publish.mjs` + `npm-publish.yml` | `files`/`exports` pack-safe; `npm publish` qua OIDC Trusted Publishing (package disallow tokens) | Auth / 403 / 404 / EOTP / conflict phiên bản | `workflow_dispatch` / tag `v*` |
 | Native store | `_audit/ci/native-store-dry-run.mjs` + `native-store.yml` | Scaffold Fastlane + metadata; kiểm secret signed-release | Thiếu `ASC_*` / `PLAY_SERVICE_ACCOUNT_JSON` (submit luôn tắt) | PR + `main` (paths) + thủ công |
 
+## Registry consumer smoke (hard)
+
+| Job | Script / workflow | Assert gì | Tiêu chí pass | Chạy ở đâu |
+|---|---|---|---|---|
+| npm-hello smoke | `examples/npm-hello` + job `npm-hello-smoke` | Install registry public `@cyberskill/design@1.1.0` resolve đúng tên package + exports (`npm install` + `npm run smoke`; pack proof local nếu VERSION chưa trên registry) | Exit 0 (**hard fail** khi đã publish; soft-skip pack proof nếu VERSION chưa trên registry) | Push/PR path-filtered + nightly + thủ công |
+
 ## Hardening Th7 2026 — đã giao
 
-Tám gate audit lên kế hoạch (token-format-parity, version-stamp, support-runtime-identity, package-exports-integrity, template-lang-parity, dtcg-typing, bundle-freshness, design-md-parity) giờ đã **triển khai** — xem hàng của chúng trong bảng fast-board và Node-pre-check trên. Tất cả nối vào `_audit/run.html`, `_audit/index.html`, workflow CI (`fast-gates` nhận hàng board tự động; `node-prechecks` + `unit-tests` là job mới), và `dashboard.html` (tab Health nhúng `run.html`, nên hàng board hiện ở đó không cần list riêng). Gate docs-consistency mang blacklist stale-phrase (suite/pack count đã nghỉ) + mở rộng stamp `DESIGN.md` mô tả ở hàng của nó. Gate docs-lang-parity khóa gương `docs/vi/`.
+Tám gate audit lên kế hoạch (token-format-parity, version-stamp, support-runtime-identity, package-exports-integrity, template-lang-parity, dtcg-typing, bundle-freshness, design-md-parity) giờ đã **triển khai** — xem hàng của chúng trong bảng fast-board và Node-pre-check trên. Tất cả nối vào `_audit/run.html`, `_audit/index.html`, và workflow CI (`fast-gates` nhận hàng board tự động; `node-prechecks` + `unit-tests` là job mới). Operator xem Health qua Storybook **Status** (nhúng full-bleed `_audit/run.html`) và chỉ mục audit tại `_audit/index.html` — `dashboard.html` chỉ redirect và không còn tab Health. Gate docs-consistency mang blacklist stale-phrase (suite/pack count đã nghỉ) + mở rộng stamp `DESIGN.md` mô tả ở hàng của nó. Gate docs-lang-parity khóa gương `docs/vi/`.
 
 ## Human-reviewed, không bao giờ tự động hóa
 

package/docs/vi/release-notes.md

@@ -1,12 +1,22 @@
 # Ghi chú phát hành
 
-Điểm nổi bật sản phẩm cho operator — **không** phải git log và **không** phải `CHANGELOG.md`. Hệ thống thiết kế không maintain file changelog. Phiên bản giữ cố định **1.0.0**; chân lý kỹ thuật là tip repo, chân lý hướng sản phẩm là trang này (đồng bộ Storybook **Release Notes**).
+Điểm nổi bật sản phẩm cho operator — **không** phải git log và **không** phải `CHANGELOG.md`. Hệ thống thiết kế không maintain file changelog. Phiên bản **đã LAUNCH ở 1.1.0** (chỉ thị owner Th7 2026); bump tiếp theo cần chỉ thị owner rõ. Chân lý kỹ thuật là tip repo; chân lý hướng sản phẩm là trang này (đồng bộ Storybook **Release Notes**).
+
+## LAUNCH — `@cyberskill/design@1.1.0`
+
+Cut **LAUNCH** của owner. `VERSION` / `package.json` và mọi version stamp chuyển từ pin pre-LAUNCH **1.0.0** sang **1.1.0**. Publish qua **npm Trusted Publishing (OIDC)** trên tag `v1.1.0` (hoặc `workflow_dispatch`). Publishing access trên npmjs **disallow tokens**. Soft-skip install registry của npm-hello là trung thực cho tới khi **1.1.0** live trên registry — soft-skip ≠ đã publish.
+
+Dùng đã duyệt cho sản phẩm portfolio CyberSkill vẫn tại **`docs/consumer-grant.md`** (+ VI). Package vẫn **UNLICENSED**. Đường consumer browser đầu tiên: `examples/npm-hello/` (Lumi · Hỏa · plasma) — xem `docs/consuming.md`.
+
+```bash
+npm install @cyberskill/design@1.1.0
+```
 
 ## Storybook tại gốc domain
 
 `design.cyberskill.world/` là site sản phẩm Storybook đầy đủ. Docs, Foundations, Components, Release Notes và Status nằm trong một sidebar. Đường legacy `/dashboard` và `/playground` redirect về `/`.
 
-Consumer portable không đổi: `styles.css`, `_ds_bundle.js`, và `_esm/cs.mjs`. Storybook chỉ là tooling host.
+Consumer portable: `styles.css`, `_ds_bundle.js`, bundler-native `_esm/react.mjs` (mặc định `exports["."]`; React peer), và browser legacy `_esm/cs.mjs` (`@cyberskill/design/legacy`). Storybook chỉ là tooling host.
 
 ## Quality gate trên Status
 
@@ -18,14 +28,14 @@ Docs operator công khai có cặp EN·VI dưới `docs/` / `docs/vi/`. Template
 
 ## Foundations và thư viện CSF
 
-Toolbar Theme × Element × Language khớp template production. Mọi primary công khai có Default + ma trận điều khiển trung thực. Foundations gồm màu, typography, spacing, elevation, motion, và 15 pack Ngũ Hành.
+Toolbar Theme × Element × Language × Style mirror template production (Theme gồm **system** cho OS `prefers-color-scheme`). Mọi primary công khai ship Default story cộng control matrix trung thực; FullMatrix cover mọi qualifier ≥1-axis. Axe smoke quét mọi primary công khai. Pack Style duy nhất là **liquid-glass**. Foundations cover màu, typography, spacing, elevation, motion, và 15 pack element Ngũ Hành.
 
-## Token và bản native
+## Token và mirror native
 
-Token CSS, DTCG (`tokens/tokens.dtcg.json`), và mirror SwiftUI / Compose / Flutter giữ lockstep qua token pipeline. Text không bao giờ nằm trên `-accent` mid-tone — doctrine APCA được gate enforce.
+Token CSS, DTCG (`tokens/tokens.dtcg.json`), và mirror SwiftUI / Compose / Flutter pre-generated giữ lockstep qua pipeline token. Text không bao giờ ngồi trên `-accent` mid-tone — doctrine APCA được gate enforce.
 
 ## Những gì chúng ta không bao giờ ship
 
-- File gốc **`CHANGELOG.md`** (cấm bởi doctrine và docs-consistency)
-- Bump VERSION khi chưa có quyết định tường minh từ owner
-- Storybook như dependency của consumer
+- Root **`CHANGELOG.md`** (cấm bởi doctrine và docs-consistency)
+- Bump VERSION mà không có quyết định owner rõ
+- Storybook như dependency consumer

package/docs/vi/storybook.md

@@ -18,10 +18,10 @@ Storybook **10** là **site sản phẩm** cho operator trên `design.cyberskill
   - `AllSizes` khi `argTypes.size` tồn tại (token ramp hoặc size số đại diện)
   - `States` (hoặc subsection Matrix) phủ `disabled` / `loading` / `error` / `busy` khi các argTypes đó tồn tại
   - Mọi option enum `size` / `variant` rời rạc được mount trong story họ matrix
-  - `FullMatrix` khi ≥2 trong {size enums, variant enums, state keys} tồn tại — tích size × variant × key-state qua helper chung `stories/lib/matrix.jsx`
-- Toolbar globals: Theme × Element × Language (cùng trục với template). Element liệt kê **đủ 15** pack Ngũ Hành (Identity Lab / `tokens.elements` / EL map template) — không phải tập con.
+  - `FullMatrix` khi ≥1 trong {size enums, variant enums, state keys} tồn tại — tích size × variant × key-state qua helper chung `stories/lib/matrix.jsx`
+- Toolbar globals: Theme (light · dark · **system**) × Element × Language × Style (cùng trục với template / Atomic View). Element liệt kê **đủ 15** pack Ngũ Hành (`tokens.elements` / EL map template / Storybook toolbar) — không phải tập con. Pack Style duy nhất là **liquid-glass**.
 - **Docs/** hướng dẫn MDX công khai; **Release Notes/** prose sản phẩm curated (**không CHANGELOG.md**); **Status/** nhúng `_audit/run.html` full-bleed
-- Story **Maintainer/** cho bề mặt HTML portable (Motion, Identity Lab, templates, kitchen-sink, AI cluster, RTL; Atomic View chôn cho gates)
+- Story **Maintainer/** cho bề mặt HTML portable (Motion, templates, kitchen-sink, AI cluster, RTL; Atomic View chôn cho gates)
 - Cùng `styles.css` như production
 - Addon: `@storybook/addon-docs` + `@storybook/addon-a11y` (essentials gộp vào core ở SB10)
 
@@ -37,7 +37,8 @@ Storybook **10** là **site sản phẩm** cho operator trên `design.cyberskill
 |---|---|
 | Static / bất kỳ framework | `styles.css` + `.cs-*` |
 | React production | `styles.css` + `_ds_bundle.js` |
-| ESM | `_esm/cs.mjs` |
+| ESM (bundler) | `_esm/react.mjs` (mặc định / `@cyberskill/design/react`) |
+| ESM (browser legacy) | `_esm/cs.mjs` (`@cyberskill/design/legacy`) |
 | Tokens | `tokens/*` |
 | Claude Design | `templates/**/*.dc.html` |
 

package/docs/vi/sync.md

@@ -10,7 +10,8 @@ Repo GitHub (`cyberskill-official/design-system`) là **nguồn chân lý**. Ses
 - `templates/**/*.dc.html` (+ `ds-base.js`, `support.js`)
 - `guidelines/`, `ui_kits/`, `fonts/` (woff2), `assets/`, `docs/`, `_audit/*.html`
 
-- **`_esm/cs.mjs`** — entry ESM. Tiền tố underscore **không** nghĩa là build artifact hay gitignored ở đây (chỉ `uploads/`, `scraps/`, `_audit/exports/` là — xem Hygiene bên dưới); `_esm/` là source, cùng tầng với `templates/` hoặc `docs/`. Một lần port trước đã bỏ nó đúng vì giả định đó và làm gãy ESM smoke gate — nếu bạn port/copy cây này bằng tay, **explicit include mọi thư mục top-level danh sách này đặt tên**, đừng suy từ tiền tố `_`.
+- **`_esm/react.mjs`** — entry React bundler-native (export package mặc định; React peer). Regenerated qua `npm run build:react-entry`.
+- **`_esm/cs.mjs`** — entry ESM browser / no-build legacy (`@cyberskill/design/legacy`). Tiền tố underscore **không** nghĩa là build artifact hay gitignored ở đây (chỉ `uploads/`, `scraps/`, `_audit/exports/` là — xem Hygiene bên dưới); `_esm/` là source, cùng tầng với `templates/` hoặc `docs/`. Một lần port trước đã bỏ nó đúng vì giả định đó và làm gãy ESM smoke gate — nếu bạn port/copy cây này bằng tay, **explicit include mọi thư mục top-level danh sách này đặt tên**, đừng suy từ tiền tố `_`.
 
 - `README.md`, `CONTRIBUTING.md`, `SKILL.md`, `CLAUDE.md`, `VERSION`, `DESIGN.md` (open-spec surface generate — commit, chỉ regen qua `npm run build:design-md`, khóa bởi gate `design-md-parity`)
 
@@ -38,7 +39,7 @@ Diff PR là lưới an toàn — nó hiện đúng những gì đổi kể từ
 ## Hygiene giữ round-trip sạch
 - **`.gitignore`** transient (`uploads/`, `scraps/`, `_audit/exports/`); commit mọi thứ khác, **kể cả `_esm/`** (xem trên — nó là source, không phải build artifact, dù có tiền tố `_`). Compiled `_ds_bundle.js`/manifest được commit cho consumer không có bước build, nhưng kỳ vọng churn — hoặc ignore và để mỗi session regenerate.
 
-- **`VERSION` cố định 1.0.0** — không bump và không maintain file changelog. Continuity là git history; việc maintainer đang mở nằm ở `docs/decisions.md`.
+- **`VERSION` đã LAUNCH ở 1.1.0** — chỉ bump khi có chỉ thị owner rõ; không maintain file changelog. Continuity là git history; việc maintainer đang mở nằm ở `docs/decisions.md`.
 
 - **Một nguồn chân lý tại một thời điểm.** Đừng sửa repo và project Claude Design song song rồi push cả hai — pull, làm việc, push, theo thứ tự đó, để repo luôn là điểm merge.
 

package/docs/vi/template-schema-v2.md

@@ -29,8 +29,20 @@ Metadata thuần additive, opt-in: sidecar `templates/<slug>/content-schema.json
 | `slots[].required` | không | mặc định `false` |
 | `slots[].i18n` | không | `{"en": "...", "vi": "..."}` — cho template ship biến thể EN·VI |
 
-Hình dạng máy kiểm được chính thức nằm ở `templates/schema/content-schema.schema.json` (JSON Schema draft-07). `_audit/template-schema-test.html` validate mọi sidecar tồn tại — hai chiều: mọi slot id khai báo phải resolve tới hole thật trong template, và (informational) báo coverage trên toàn `templates/`.
+Hình dạng máy kiểm được chính thức nằm ở `templates/schema/content-schema.schema.json` (JSON Schema draft-07). `_audit/template-schema-test.html` validate mọi sidecar tồn tại — hai chiều với content hole đủ điều kiện: mọi slot id khai báo phải là content hole trong `.dc.html`, và mọi content hole phải xuất hiện thành slot — **và ép độ phủ**.
 
-## Rollout
+## Hole nào đủ điều kiện có schema
 
-Giống visual-diff baselines, ban đầu ship **cố ý chưa đầy đủ** — ba exemplar (một mỗi archetype lớn) chứng minh pattern end-to-end: `marketing-page` (product), `bod-report` (document), `slide-deck` (deck). Sau đó đã **quét tới mọi template hole-driven** và tiếp tục lớn dần; độ phủ sidecar hiện tại do `_audit/template-schema-test.html` báo cáo (bề mặt product traffic cao như `marketing-page`, `dashboard`, `settings`, cộng `tech-incident-report` được phủ slot nội dung đầy hơn). Hole trục / control-flow (`rootTheme`, `langAttr`, `elAttr`, `vaAttr`, `isEN`, `true`, …) nằm ngoài schema — chúng là trục runtime, không phải content author được. Phần còn lại hardcode copy bilingual trực tiếp theo nhánh `sc-if` ngôn ngữ (chưa có slot content `{{ hole }}`). Thêm sidecar cho mọi template nhận content hole-driven khi chạm tới; ưu tiên tăng measurable trên template traffic cao trước.
+Một `{{ hole }}` là **content hole** (đủ điều kiện schema) trừ khi nó là:
+
+- hole **trục / control-flow** — `rootTheme`, `langAttr`, `elAttr`, `vaAttr`, `dirAttr`, `true`, `false`, bất kỳ tên nào khớp `is<ChữHoa>` (`isEN`, `isVN`, `isBoth`, `isTable`, …), hoặc một số nguyên trần;
+- hole **tweak boolean** — bất kỳ tên nào khớp `show|hide|has|enable|with` + `<ChữHoa>` (`showLogo`, `showSignatures`, `showQuote`, …);
+- hole **runtime-control** — wiring chọn UI / handler: tên đúng `tabs`, `tab`, `lens`, `chatOpen`, `closeChat`, `dangerOpen`, `closeDanger`, hoặc bất kỳ tên nào khớp `set|open` + `<ChữHoa>` (`setTab`, `setLens`, `openChat`, …).
+
+Chúng là trục runtime, không phải content slot có kiểu, nên nằm ngoài schema.
+
+## Rollout — đã đủ cho template đủ điều kiện, và đã có gate
+
+Ban đầu ship **cố ý chưa đầy đủ**: ba exemplar (một mỗi archetype lớn) chứng minh pattern end-to-end — `marketing-page` (product), `bod-report` (document), `slide-deck` (deck) — rồi quét qua các template hole-driven.
+
+Đợt quét đó nay **đã xong và được khoá**. Tính tới Jul 2026: **39 template content-hole-driven, cả 39 đều có sidecar**, và **45 template chỉ lộ hole trục/boolean** (copy song ngữ hardcode theo nhánh `sc-if`) đúng là không có sidecar. `_audit/template-schema-test.html` không còn chỉ báo cáo con số này — nó **fail** nếu có template lộ content hole mà thiếu sidecar. Nên luật cho author là cơ học: template nhận thêm một `{{ hole }}` author được thì nhận luôn sidecar trong cùng change, không thì board đỏ.

package/docs/viewer.html

@@ -58,12 +58,12 @@
 <script>
 const DOCS_EN=[
  ['Start',[['README.md','README'],['SKILL.md','SKILL (agent rules)'],['llms.txt','llms.txt'],['CONTRIBUTING.md','Contributing']]],
- ['Guides',[['docs/consuming.md','Consuming & upgrading (incl. AI-agent quick path)'],['docs/deploy.md','Deploy (Vercel/VPS)'],['docs/template-schema-v2.md','Template content-schema v2'],['docs/conventions.md','Conventions'],['docs/release-notes.md','Release Notes'],['docs/storybook.md','Storybook (product at /)'],['docs/live-hub.md','Live hub (Storybook at /)'],['docs/design-styles.md','Design styles'],['docs/products.md','Products'],['docs/contrast-report.md','Contrast report'],['docs/figma.md','Figma']]],
+ ['Guides',[['docs/consuming.md','Consuming & upgrading (incl. AI-agent quick path)'],['docs/consumer-grant.md','Consumer grant (npm · UNLICENSED)'],['docs/deploy.md','Deploy (Vercel/VPS)'],['docs/template-schema-v2.md','Template content-schema v2'],['docs/conventions.md','Conventions'],['docs/release-notes.md','Release Notes'],['docs/storybook.md','Storybook (product at /)'],['docs/live-hub.md','Live hub (Storybook at /)'],['docs/design-styles.md','Design styles'],['docs/benchmark-rubric.md','Benchmark rubric'],['docs/products.md','Products'],['docs/contrast-report.md','Contrast report'],['docs/figma.md','Figma']]],
  ['Maintainers',[['docs/decisions.md','Decisions'],['docs/ci-cd.md','CI/CD automation'],['docs/quality-gates.md','Quality gates'],['docs/sync.md','Git sync & hygiene']]]
 ];
 const DOCS_VI=[
  ['Bắt đầu',[['README.md','README (EN)'],['SKILL.md','SKILL (EN)'],['llms.txt','llms.txt (EN)'],['CONTRIBUTING.md','Contributing (EN)']]],
- ['Hướng dẫn',[['docs/consuming.md','Tiêu thụ & nâng cấp'],['docs/deploy.md','Deploy (Vercel/VPS)'],['docs/template-schema-v2.md','Template schema v2'],['docs/conventions.md','Conventions'],['docs/release-notes.md','Ghi chú phát hành'],['docs/storybook.md','Storybook (sản phẩm tại /)'],['docs/live-hub.md','Live hub (Storybook tại /)'],['docs/design-styles.md','Phong cách'],['docs/products.md','Sản phẩm'],['docs/contrast-report.md','Báo cáo contrast'],['docs/figma.md','Figma']]],
+ ['Hướng dẫn',[['docs/consuming.md','Tiêu thụ & nâng cấp'],['docs/consumer-grant.md','Grant consumer (npm · UNLICENSED)'],['docs/deploy.md','Deploy (Vercel/VPS)'],['docs/template-schema-v2.md','Template schema v2'],['docs/conventions.md','Conventions'],['docs/release-notes.md','Ghi chú phát hành'],['docs/storybook.md','Storybook (sản phẩm tại /)'],['docs/live-hub.md','Live hub (Storybook tại /)'],['docs/design-styles.md','Phong cách'],['docs/benchmark-rubric.md','Rubric benchmark'],['docs/products.md','Sản phẩm'],['docs/contrast-report.md','Báo cáo contrast'],['docs/figma.md','Figma']]],
  ['Maintainer',[['docs/decisions.md','Quyết định'],['docs/ci-cd.md','CI/CD'],['docs/quality-gates.md','Quality gates'],['docs/sync.md','Đồng bộ Git']]]
 ];
 let lang=(localStorage.getItem('cs-docs-lang')==='vi')?'vi':'en';