@cyberskill/design 2.6.0 → 2.8.0

package/docs/vi/UPSTREAM.md

@@ -16,15 +16,12 @@ Trạng thái: **Đã hợp nhất vào `main` (`v2.5.0`–`v2.6.0`)**.
 | `components/feedback/feedback.card.html` | `.frame { flex: 1 1 100%; min-width: 0 }` | Ngăn khung minh họa toast bị co về chiều rộng bằng 0 trong hàng flex. |
 | `components/logo/logo.card.html` | Chữ thương hiệu trong cụm logo dùng `color: var(--cs-color-text-primary)`. | Đảm bảo chữ thương hiệu luôn nhìn thấy rõ ở chế độ tối. |
 
-## 2 · Bộ công cụ kiểm chứng đã phát hành (`audit/`)
+## 2 · Bộ công cụ kiểm chứng tự động (`_audit/ci/`)
 
 | Tệp | Mục đích |
 |---|---|
-| `audit/v2.5.0-verification.html`, `audit/verify-v2.5.0.js`, `audit/fixture-v2.5.0.html` | Bảng công cụ Kiểm chứng & Mẫu thử: 10 chiều đánh giá (`P0` an toàn nền pha sắc · `P1` tương phản WCAG 1.4.11 trên 32 phạm vi · `P2` tách lớp Umber, đồng bộ trạng thái không hợp lệ của 14 điều khiển, khoảng thoáng dấu tiếng Việt · `P3` kính lồng nhau, hợp đồng `DESIGN.md`/tài sản · `D8`–`D10` Bất biến học thuyết: focus hai vòng, vùng chạm ≥ 44px & an toàn chuyển động, tương phản cao, mật độ & trạng thái ngữ nghĩa), 69 phép kiểm tra × `v2.5.0+` / `v2.4.0` / `v2.3.1`, ma trận tương phản 32×6, báo cáo trường hợp biên, xuất JSON và bộ chuyển mẫu thử (`version × theme × element × variant`). |
-| `audit/v2.5.0-verification.json`, `_audit/ci/verify-audit-benchmarks-browser.mjs` | Biên nhận máy đọc và cổng chống thoái lui tự động (`npm run test:audit-regression`): đạt **10.0 / 10** (`69/69` trên `D1`–`D10`), bộ cơ sở nhúng đạt **64/64** (`v2.4.0` tag đạt `62/64`, `v2.3.1` đạt `8/64`), sức khỏe hiển thị đạt **146/146**, và **0 watch**. |
-| `audit/render-health.html` | Nạp toàn bộ 146 mẫu tài liệu, thẻ thành phần và trang UI-kit/hướng dẫn trong các khung ẩn (theo nguyên bản / ép tối / tương phản cao / bất kỳ phạm vi Ngũ Hành nào) và xác nhận không có trang mất kiểu, chưa phân giải, lỗi runtime, trống hoặc thiếu tương phản. |
-| `audit/fixture.html`, `audit/verify.js`, `audit/v2.4.0-verification.html` | Bộ nạp ba phiên bản (`?v=current|v240|baseline`) chạy lại 64 phép kiểm tra cơ sở trên `v2.5.0`, `v2.4.0` và `v2.3.1`. |
-| `audit/baseline-2.4.0/styles.flat.css`, `audit/baseline-2.3.1/styles.flat.css` | Các bản đóng gói phẳng `styles.css` từ tag `v2.4.0` và `v2.3.1` phục vụ đối chiếu trực tiếp ba phiên bản. |
+| `_audit/ci/verify-audit-benchmarks-browser.mjs`, `_audit/ci/lib/benchmark-checks.mjs` | Cổng benchmark trình duyệt trực tiếp tự động cho CI/prepublish (`npm run test:audit-regression`): đạt **10.0 / 10** (`129/129` trên 20 chiều `D1`–`D20`), bộ kiểm tra cơ sở cốt lõi đạt **64/64** (`10.0 / 10`), 192/192 ô trong ma trận tương phản phi văn bản 32×6 (`≥ 3.0:1`), 3/3 màn hình phức hợp Generation-2 và **0 watch**. |
+| `_audit/ci/fixtures/benchmark-20d.html`, `_audit/ci/fixtures/benchmark-baseline.html`, `_audit/ci/fixtures/benchmark-gen2.html` | Các mẫu thử DOM hiện hành kiểm chứng 32 phạm vi Theme × Element × Variant, 14 điều khiển biểu mẫu, khoảng thoáng dấu tiếng Việt, container query, quy tắc in ấn/kính và các màn hình doanh nghiệp/AI/di động đa phạm vi trực tiếp trên `/dist/styles.css` và `/styles.css`. |
 
 ## 3 · Các mục đặc thù môi trường chủ không đưa vào upstream
 

package/docs/vi/browser-support.md

@@ -4,7 +4,7 @@ Mục tiêu web được hỗ trợ là hai bản ổn định mới nhất củ
 
 ## Khả năng cần có
 
-Hệ thống dùng `color-mix(in oklab, ...)`, container query inline-size, `:has()`, `text-wrap: balance` và `inert` gốc. Các tính năng này có trước mốc hỗ trợ đã chọn trong [dữ liệu tương thích MDN được ghim](https://github.com/mdn/browser-compat-data/tree/12bc0268c7fe89a4b23fab5c54702c1fb9c34f7a). Bản ghi nguồn ở `_audit/remediation/browser-compatibility-source.json`. Không cam kết fallback trình duyệt cũ hay polyfill `inert`.
+Hệ thống dùng `color-mix(in oklab, ...)`, container query inline-size, `:has()`, `text-wrap: balance` và `inert` gốc. Các tính năng này có trước mốc hỗ trợ đã chọn trong [dữ liệu tương thích MDN được ghim](https://github.com/mdn/browser-compat-data/tree/12bc0268c7fe89a4b23fab5c54702c1fb9c34f7a). Bản ghi nguồn ở `_audit/ci/fixtures/browser-compatibility-source.json`. Không cam kết fallback trình duyệt cũ hay polyfill `inert`.
 
 Với mốc hai bản ổn định mới nhất đã chọn, `inert` gốc có sẵn và không cần polyfill `inert`. Tính năng được bổ sung từ Chrome 102 ([ghi chú phát hành Chrome](https://developer.chrome.com/blog/new-in-chrome-102)), Firefox 112 ([ghi chú phát hành dành cho nhà phát triển Mozilla](https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/112)) và Safari 15.5 trên macOS, iOS và iPadOS ([ghi chú phát hành WebKit](https://webkit.org/blog/12669/new-webkit-features-in-safari-15-5/)); [Tiêu chuẩn HTML](https://html.spec.whatwg.org/multipage/interaction.html#the-inert-attribute) quy định hành vi gốc. Đây là kết luận về khả năng có sẵn của tính năng trong mốc đã công bố, không phải chứng nhận từng bản trình duyệt thuộc mốc đó, hành vi focus trên thiết bị thật hay hành vi với công nghệ hỗ trợ. Mục tiêu cũ hơn nằm ngoài cam kết này và cần fallback được kiểm chứng riêng.
 

package/docs/vi/component-api.md

@@ -8,7 +8,7 @@ Việc loại bỏ hợp đồng công khai yêu cầu bản major **và đồng
 
 Tệp nguồn `components/release-compatibility.json` ghi phiên bản cơ sở trước ứng viên, phân loại thay đổi đang chờ đã được rà soát, thông báo có ngày và bằng chứng phát hành. Các bước lập kế hoạch, xác minh ứng viên và xác minh tag thực thi quy tắc này cùng cổng duyệt hỗ trợ và định danh nguồn chính xác hiện có. Các thay đổi đã được chấp thuận về điểm vào mặc định đã biên dịch, bàn phím Menu theo APG và vị trí mặc định của floating panel được phân loại là breaking cho bản sửa đổi chưa phát hành; chuẩn bị bản vá/minor bị chặn. Điều này không gán định danh phát hành mới, duyệt bằng chứng hỗ trợ, tạo tag hay cho phép công bố. Trước chu kỳ sau, đối chiếu phiên bản cơ sở và các mục đang chờ với lần công bố thực tế đã được chấp nhận; không tự xóa lịch sử thông báo.
 
-SegmentedControl giữ các alias ngữ nghĩa đã deprecated `role="tablist"` và `role="radiogroup"`. Khi bỏ qua `mode`, alias chọn phần tử con tab hoặc radio tương ứng; `mode` tường minh được ưu tiên và mặc định vẫn là radio. Giá trị role khác bị từ chối thay vì tạo ngữ nghĩa ARIA mâu thuẫn. Ưu tiên `mode="tabs"` hoặc `mode="radio"`. Đề xuất loại bỏ trước đây được lưu trong `_audit/remediation/segmented-role-removal-proposal-history.json`; đây không còn là thay đổi loại bỏ hiện tại. Việc từ chối role tùy ý vẫn được phân loại là breaking. Các trường thông báo tiếp tục bằng null: hướng dẫn cục bộ này không xác lập rằng đã công bố thông báo, ngày hay phiên bản. Mọi lần loại bỏ trong tương lai vẫn cần bản major sau hai bản minor riêng biệt đã được phát hành và 90 ngày thông báo được ghi nhận, cùng tất cả cổng phát hành khác.
+SegmentedControl giữ các alias ngữ nghĩa đã deprecated `role="tablist"` và `role="radiogroup"`. Khi bỏ qua `mode`, alias chọn phần tử con tab hoặc radio tương ứng; `mode` tường minh được ưu tiên và mặc định vẫn là radio. Giá trị role khác bị từ chối thay vì tạo ngữ nghĩa ARIA mâu thuẫn. Ưu tiên `mode="tabs"` hoặc `mode="radio"`. Đề xuất loại bỏ trước đây được lưu trong `_audit/ci/fixtures/segmented-role-removal-proposal-history.json`; đây không còn là thay đổi loại bỏ hiện tại. Việc từ chối role tùy ý vẫn được phân loại là breaking. Các trường thông báo tiếp tục bằng null: hướng dẫn cục bộ này không xác lập rằng đã công bố thông báo, ngày hay phiên bản. Mọi lần loại bỏ trong tương lai vẫn cần bản major sau hai bản minor riêng biệt đã được phát hành và 90 ngày thông báo được ghi nhận, cùng tất cả cổng phát hành khác.
 
 Các dòng React được khai báo hỗ trợ hiện tại là 18.x và 19.x; fixture tiêu thụ gói và hydration kiểm tra các phiên bản đã ghim. Đây là phạm vi hỗ trợ theo major, không chứng minh mọi bản vá lịch sử hoặc cam kết cho major React chưa phát hành. Loại bỏ một dòng đã khai báo tuân theo cùng chính sách major và thời gian ngừng hỗ trợ. Major React mới phải được kiểm tra tương thích trước khi mở rộng peer range. Trình duyệt tiếp tục theo chính sách hai bản ổn định mới nhất trong hướng dẫn hỗ trợ trình duyệt; bằng chứng engine và thiết bị thực được báo cáo riêng.
 

package/docs/vi/consuming.md

@@ -1,6 +1,6 @@
 # Tiêu thụ & nâng cấp CyberSkill Design System
 
-**Checkout nguồn:** VERSION **<!-- cs-source-version:checkout -->2.6.0<!-- /cs-source-version -->** là định danh nguồn cục bộ, không xác nhận phiên bản có trên registry. Với bản ứng viên chưa công bố, kiểm chứng tarball gói cục bộ hoặc checkout nguồn đã rà soát. Lệnh registry bên dưới chỉ bản ổn định 2.5.0 đã công bố (và inventory sibling ADOPT-001 ghi ngày tại 1.7.2), không tự đổi khi chuẩn bị bản phát hành. Chuẩn bị không cấp quyền công bố.
+**Checkout nguồn:** VERSION **<!-- cs-source-version:checkout -->2.8.0<!-- /cs-source-version -->** là định danh nguồn cục bộ, không xác nhận phiên bản có trên registry. Với bản ứng viên chưa công bố, kiểm chứng tarball gói cục bộ hoặc checkout nguồn đã rà soát. Lệnh registry bên dưới chỉ bản ổn định 2.7.0 đã công bố (và inventory sibling ADOPT-001 ghi ngày tại 1.7.2), không tự đổi khi chuẩn bị bản phát hành. Chuẩn bị không cấp quyền công bố.
 
 Cách mọi project — do người hoặc agent điều khiển — áp dụng design system HTML-first này, và cách nhận update an toàn. Xuất bản trên Storybook **Docs** tại `design.cyberskill.world`.
 

package/docs/vi/contrast-report.md

@@ -1,6 +1,6 @@
 # Báo cáo contrast — cặp elemental (APCA)
 
-Tạo · quét tại VERSION 2.6.0.
+Tạo · quét tại VERSION 2.8.0.
 
 Xuất bản trên Storybook **Docs** tại `design.cyberskill.world`.
 

package/docs/vi/conventions.md

@@ -79,7 +79,7 @@ phần tử HTML, không dùng trong URL, thuộc tính, CSS hay script.
 
 **Element variant mới** — ở trong envelope oklch của element; đặt 10 token hợp đồng `--cs-accent-*` (gồm `--cs-accent-on-strong` ≥4.5:1 và APCA75 cho nội dung thường trên `-strong`) cộng `--cs-color-text-accent`/`--cs-color-link` (APCA-check cả hai); aurora wash kế thừa từ element qua `.cs-aurora-wash` (chỉ override class rule nếu variant thật sự cần ảnh riêng); đối tác gradient (`grad-b`) phải theo Tương sinh.
 
-**Ship check** — theo gate kiểm chứng portable trong `docs/doctrine.md`, rồi chạy `_audit/docs-consistency.html` **và** `_audit/namespace-portability.html` (cả hai phải xanh). VERSION của checkout nguồn **<!-- cs-source-version:checkout -->2.6.0<!-- /cs-source-version -->**.
+**Ship check** — theo gate kiểm chứng portable trong `docs/doctrine.md`, rồi chạy `_audit/docs-consistency.html` **và** `_audit/namespace-portability.html` (cả hai phải xanh). VERSION của checkout nguồn **<!-- cs-source-version:checkout -->2.8.0<!-- /cs-source-version -->**.
 
 ## Decision log (owner duyệt)
 

package/docs/vi/decisions.md

@@ -15,7 +15,7 @@ Các mục có số bên dưới giữ quyết định có ngày và ID trích d
 | Phạm vi phiên bản bảo mật và mục tiêu xác nhận | `SECURITY.md` |
 | Chấp nhận hỗ trợ và phê duyệt được lưu | `components/lifecycle.json`, `docs/vi/conventions.md` |
 | Chuẩn bị phát hành và ủy quyền riêng | `docs/vi/release-notes.md`, `.github/workflows/release.yml` |
-| Kiểm tra và disposition hiện tại | `_audit/remediation/assessment-remediation.md`, `test-results/final-validation.json` |
+| Kiểm tra và disposition hiện tại | `_audit/ci/unit-suites.json`, `test-results/final-validation.json` |
 
 Release notes đã phát hành vẫn là hồ sơ lịch sử. Build cục bộ, candidate đã chuẩn bị, hồ sơ hỗ trợ đã duyệt và bản phát hành công khai là các trạng thái riêng biệt.
 

package/docs/vi/deploy.md

@@ -48,7 +48,7 @@ Nếu host dưới **domain khác**, đổi absolute URL trong các meta tag cho
 
 **Không Storybook:** sau review nguồn gốc và phê duyệt triển khai rõ ràng, serve danh sách portable đã duyệt làm webroot.
 
-**Có Storybook tại `/`:** `npm run build:site` ghi mirror portable vào `.vercel-static/` và artifact triển khai Vercel vào `.vercel/output/`. Vercel dùng `config.json` của artifact sau; không giữ override Output Directory cũ và không sửa `vercel.json` trong lúc build để dự đoán hash chưa tồn tại.
+**Có Storybook tại `/`:** `npm run build:site` ghi mirror portable vào `.vercel-static/` (kèm `.nojekyll` và `CNAME` để triển khai lên GitHub Pages qua `.github/workflows/pages.yml`) và artifact triển khai Vercel vào `.vercel/output/`. Vercel dùng `config.json` của artifact sau; không giữ override Output Directory cũ và không sửa `vercel.json` trong lúc build để dự đoán hash chưa tồn tại.
 
 Host tĩnh khác cần adapter ánh xạ từng path HTML cuối cùng và alias tới CSP trong `public-site-csp.json`, giữ security header/redirect tại `scripts/site-deployment-policy.json`, và cấm inline script trên path không biết. Hash phải lấy từ byte cuối cùng, gồm wrapper logic template xác định. Một chuỗi CSP chép tay không thể đại diện quyền riêng của từng trang.
 

package/docs/vi/entrypoints/DESIGN.md

@@ -1,6 +1,6 @@
 ---
 name: "CyberSkill Design System"
-version: "2.6.0"
+version: "2.8.0"
 generated: "2026-07-23"
 generator: "scripts/generate-design-md.mjs (npm run build:design-md)"
 sources:
@@ -402,7 +402,7 @@ Quyết định thiết kế ở cấp thành phần (button · textfield). Giá
 Bên dùng HTML tĩnh và công cụ sinh mã không kèm runtime định kiểu trực tiếp cho phần tử HTML ngữ nghĩa bằng các lớp `.cs-*` từ `styles.css` (hoặc `styles.layered.css`). `dist/styles.css` là cùng tập hợp được làm phẳng thành một tệp cho các môi trường không theo chuỗi `@import` (bộ kết xuất thẻ, một số sandbox); sinh lại bằng `npm run build:css` sau khi sửa `tokens/` hoặc `base/`; các thẻ hướng dẫn trong `guidelines/` mặc định hiển thị tiếng Anh (`?language=vi` cho tiếng Việt). Quản lý trạng thái tương tác, điều hướng bàn phím, giữ focus trong lớp phủ và thông báo ARIA động cần thành phần React hoặc mã kịch bản do bên dùng cung cấp; xem `docs/static-html-reference.md` để đối chiếu DOM đã kết xuất.
 
 - **Tác vụ và nút bấm (`base/components.css`):** nút chính `.cs-button`, các biến thể `.cs-button--secondary`, `.cs-button--tertiary`, `.cs-button--ghost`, `.cs-button--danger`, `.cs-button--danger-ghost`; kích thước `.cs-button--xs` (`28px`, nâng lên `44px` khi `pointer: coarse`), `.cs-button--sm` (`36px`, nâng lên `44px` khi `pointer: coarse`), cỡ trung bình mặc định (`44px`), `.cs-button--lg` (`52px`), trải rộng toàn khung `.cs-button--full`; trạng thái `.is-disabled`, `.is-loading` kèm `.cs-button__spinner`.
-- **Điều khiển biểu mẫu và trường nhập (`base/components.css`, `base/forms.css`, `base/controls.css`):** khung trường `.cs-field` gồm `.cs-field__label`, `.cs-field__control`, `.cs-field__description`, `.cs-field__error` và trạng thái lỗi `.cs-field.is-invalid`; điều khiển lựa chọn `.cs-check`, `.cs-radio`, `.cs-switch` (`.cs-switch__track`); ô nhập phức hợp `.cs-select`, `.cs-native-select`, `.cs-search` (`.cs-search__clear`), `.cs-stepper`, `.cs-otp`, `.cs-slider`, `.cs-segmented`.
+- **Điều khiển biểu mẫu và trường nhập (`base/components.css`, `base/forms.css`, `base/controls.css`):** khung trường `.cs-field` gồm `.cs-field__label`, `.cs-field__control`, `.cs-field__description`, `.cs-field__error` và trạng thái lỗi `.cs-field.is-invalid`; điều khiển lựa chọn `.cs-check`, `.cs-radio`, `.cs-switch` (`.cs-switch__track`); ô nhập phức hợp `.cs-select`, `.cs-native-select`, `.cs-search` (`.cs-search__clear`), `.cs-stepper`, `.cs-otp`, `.cs-slider`, `.cs-segmented`, `.cs-combobox`, `.cs-igroup`, `.cs-taginput`, `.cs-datepicker` (`.cs-datepicker__field`), `.cs-timepicker`, `.cs-treeselect` (`.cs-treeselect__field`), `.cs-cascader` (`.cs-cascader__field` / `.cs-treeselect__field`), `.cs-colorpicker` (`.cs-colorpicker__field`), và `.cs-dropzone`.
 - **Thẻ nội dung và bề mặt Liquid Glass (`base/data.css`, `base/glass.css`):** khung thẻ `.cs-card` (biến thể `.cs-card--flat`, `.cs-card--raised`, `.cs-card--featured`, `.cs-card--interactive`; vùng con `.cs-card__media`, `.cs-card__header`, `.cs-card__title`, `.cs-card__subtitle`, `.cs-card__body`, `.cs-card__footer`); các cấp vật liệu kính `.cs-surface-whisper`, `.cs-surface-light`, `.cs-surface-standard` (bí danh `.cs-glass-card`), `.cs-surface-heavy`, bề mặt đặc dự phòng `.cs-surface-solid` (bí danh `.cs-surface-matte`), và nền hero thương hiệu `.cs-aurora` (`.cs-aurora--photo`).
 - **Hiển thị dữ liệu và kiểu chữ (`base/components.css`, `base/data.css`, `base/typography.css`, `base/collections.css`):** khung bảng thích ứng `.cs-table-wrap` và `.cs-table` với ô số căn phải dạng bảng `.cs-table__cell--numeric` cùng đường kẻ hàng dịu `var(--cs-color-border-subtle, var(--_cs-border-subtle))`; khối chỉ số `.cs-stat` (`.cs-stat__label`, `.cs-stat__value`, `.cs-stat__delta--up`, `.cs-stat__delta--down`, `.cs-stat__delta--flat`); nhãn trạng thái `.cs-badge` (`.cs-badge--solid`, `.cs-badge--ochre`, `.cs-badge--success`, `.cs-badge--warning`, `.cs-badge--danger`, `.cs-badge--info`, `.cs-badge__dot`) và thẻ xóa được `.cs-tag`; `.cs-avatar` (`.cs-avatar--sm`, `.cs-avatar--md`, `.cs-avatar--lg`, `.cs-avatar--square`, `.cs-avatar-group`); `.cs-kbd`, `.cs-code`, `.cs-dl`; các lớp vai trò chữ `.cs-display`, `.cs-display--fluid`, `.cs-h1`, `.cs-h1--fluid`, `.cs-h2`, `.cs-h3`, `.cs-h4`, `.cs-body-lg`, `.cs-body`, `.cs-secondary`, `.cs-caption`, `.cs-eyebrow`, `.cs-mono`, `.cs-tabular`, `.cs-prose`, và phạm vi chọn họ chữ tiêu đề `.cs-display-face`.
 - **Phản hồi và lớp phủ (`base/feedback.css`, `base/components.css`, `base/shell.css`):** thông báo nội tuyến `.cs-alert` (`.cs-alert--info`, `.cs-alert--success`, `.cs-alert--warning`, `.cs-alert--danger`, `.cs-alert__icon`, `.cs-alert__title`, `.cs-alert__body`, `.cs-alert__dismiss`); ngăn xếp `.cs-toast-stack` và `.cs-toast`; hộp thoại `.cs-dialog-layer` với nền mờ thích ứng chủ đề `.cs-dialog__overlay` (`var(--cs-color-surface-scrim, var(--_cs-surface-scrim))`), khung `.cs-dialog` (`.cs-dialog__header`, `.cs-dialog__title`, `.cs-dialog__body`, `.cs-dialog__actions`) và `.cs-alert-dialog` (`.cs-alert-dialog--destructive`); ngăn trượt `.cs-drawer-scrim` và `.cs-drawer` (`.cs-drawer--left`); `.cs-popover` (`.cs-popover__panel`), `.cs-tooltip` (`.cs-tooltip__bubble`), `.cs-progress` (`.cs-progress__fill`), `.cs-spinner`, `.cs-skeleton`.

package/docs/vi/entrypoints/README.md

@@ -10,14 +10,14 @@ Hệ thống thiết kế ấm áp, chuẩn doanh nghiệp, **ưu tiên tiếng
 
 ## Bắt đầu tại đây
 
-Đây là **tài liệu điểm vào** của CyberSkill Design System — VERSION của bản nguồn **<!-- cs-source-version:checkout -->2.6.0<!-- /cs-source-version -->** (xem `VERSION`; không xác nhận phiên bản có trên registry). **Trang sản phẩm** là Storybook tại **`/`** trên `design.cyberskill.world` (chỉ trên host; cục bộ: `npm run storybook`). Tài liệu vận hành được công bố ở thanh bên **Docs** của Storybook và Thư viện tài liệu tại `/docs/viewer.html` (các đường dẫn cũ `/dashboard`, `/dashboard.html` và `/playground/*` chuyển hướng về `/`).
+Đây là **tài liệu điểm vào** của CyberSkill Design System — VERSION của bản nguồn **<!-- cs-source-version:checkout -->2.8.0<!-- /cs-source-version -->** (xem `VERSION`; không xác nhận phiên bản có trên registry). **Trang sản phẩm** là Storybook tại **`/`** trên `design.cyberskill.world` (chỉ trên host; cục bộ: `npm run storybook`). Tài liệu vận hành được công bố ở thanh bên **Docs** của Storybook và Thư viện tài liệu tại `/docs/viewer.html` (các đường dẫn cũ `/dashboard`, `/dashboard.html` và `/playground/*` chuyển hướng về `/`).
 
 ### Bắt đầu nhanh theo đối tượng
 
 - **Nhà thiết kế** — mở Storybook (**Foundations / Components / Templates / Pages / Docs**). **Templates** liệt kê toàn bộ <!-- cs-count:templates -->85<!-- /cs-count --> điểm khởi đầu (Gallery → Atomic View, cùng story theo nhóm, gồm bộ 38 tài liệu VN A4 (Employment Suite + khung thương mại) tại **Templates → HR**). Đổi trực tiếp Theme × Element × Language × Style qua thanh công cụ Storybook, Atomic View và mẫu Elements Geometry.
 - **Soạn template trình duyệt** (máy chủ HTTP tĩnh) — đọc `SKILL.md` (chọn runtime + ràng buộc thiết kế), rồi hướng dẫn bên dưới; phối hợp `styles.css` + ESM đã biên dịch `@cyberskill/design` (`dist/esm/_esm/react.mjs`; JSX thô qua `@cyberskill/design/source`) / `_esm/cs.mjs` cũ / `_ds_bundle.js` (tìm theo tiền tố). `support.js` được cung cấp thông dịch `*.dc.html` trong trình duyệt; xem `docs/template-grammar.md` về ngữ pháp và ranh giới chỉ ở host. Hợp đồng component nằm cạnh từng component (`.d.ts` + `.prompt.md`).
 - **Tĩnh / open-spec** (ví dụ Google Stitch) — bắt đầu từ **`DESIGN.md`** (open-spec được sinh) → `llms.txt` → `tokens/tokens.dtcg.json`. Dựng giao diện **tĩnh** bằng `styles.css` + `.cs-*` / kitchen-sink / `examples/static-hello/`. Dùng `.dc.html` qua trình thông dịch được cung cấp hoặc công cụ hiểu ngữ pháp; công cụ HTML thuần dùng `.cs-*` hoặc ảnh chụp kết quả hiển thị đã kiểm chứng.
-- **Người triển khai** — gói npm ổn định đã công bố **`@cyberskill/design@2.5.0`** (xem `docs/consuming.md`; quyền dùng trong `docs/consumer-grant.md` — vẫn UNLICENSED). **Next/SSR:** `import { Button } from "@cyberskill/design"` (peer React). **Demo trình duyệt:** **`examples/npm-hello/`** (Lumi · Hỏa · plasma, `_esm/cs.mjs` cũ). Hoặc liên kết **`styles.css`** từ clone/subtree (một tệp cho toàn bộ), hoặc chép thư mục `templates/<slug>/` và sửa một dòng trong `ds-base.js` (đổi liên kết một dòng, được kiểm định đầu cuối tháng 7/2026). Xác định scope bằng `data-theme` · `data-cs-element` (+`data-cs-variant`) · `lang`. Dấu hiệu bản phát hành: SHA đầu nhánh + `docs/release-notes.md` (VERSION nguồn là **<!-- cs-source-version:release-signal -->2.6.0<!-- /cs-source-version -->**; không có CHANGELOG).
+- **Người triển khai** — gói npm ổn định đã công bố **`@cyberskill/design@2.7.0`** (xem `docs/consuming.md`; quyền dùng trong `docs/consumer-grant.md` — vẫn UNLICENSED). **Next/SSR:** `import { Button } from "@cyberskill/design"` (peer React). **Demo trình duyệt:** **`examples/npm-hello/`** (Lumi · Hỏa · plasma, `_esm/cs.mjs` cũ). Hoặc liên kết **`styles.css`** từ clone/subtree (một tệp cho toàn bộ), hoặc chép thư mục `templates/<slug>/` và sửa một dòng trong `ds-base.js` (đổi liên kết một dòng, được kiểm định đầu cuối tháng 7/2026). Xác định scope bằng `data-theme` · `data-cs-element` (+`data-cs-variant`) · `lang`. Dấu hiệu bản phát hành: SHA đầu nhánh + `docs/release-notes.md` (VERSION nguồn là **<!-- cs-source-version:release-signal -->2.8.0<!-- /cs-source-version -->**; không có CHANGELOG).
 - **Người bảo trì** — `docs/doctrine.md` (mở rộng + kiểm chứng), rồi `CONTRIBUTING.md` và `docs/quality-gates.md`.
 
 ### Bản đồ tài liệu — phía sử dụng
@@ -151,7 +151,7 @@ CyberSkill **không kèm thư viện icon bên ngoài**. Hệ thống dùng **b
 <!-- END CATALOG COMPONENT INVENTORY -->
 
 - **Điểm nổi bật:** **Button** — primary Umber; biến thể primary/secondary/tertiary/ghost/danger/danger-ghost; cỡ xs–lg; loading, icon, fullWidth. **TextField / Textarea / Select / NativeSelect** dùng chung khung `.cs-field` (nhãn + mô tả/lỗi; an toàn dấu/IME). **DataTable** — caption, header có scope, render theo cột, bộ trạng thái idle/loading/error/empty. **Card** — panel ấm + header/body/footer. **Logo** hiển thị đúng biểu trưng chính thức; **Icon** điều khiển bộ icon nét nội bộ. Họ **AI-native** mang doctrine giải trình của thương hiệu — công bố, review của con người, thu nhận điều ước và độ tin cậy, đều diễn đạt bằng lời (không chỉ bằng màu).
-- **Cài đặt / tên gói:** Tên gói là **`@cyberskill/design`** (VERSION bản nguồn **<!-- cs-source-version:package-source -->2.6.0<!-- /cs-source-version -->**; quyền trong `docs/consumer-grant.md` chi phối *sử dụng* — gói vẫn UNLICENSED). **Không** cài `@cyberskill/react` cho cây này — tên đó thuộc danh mục trang marketing lịch sử, không phải gói này.
+- **Cài đặt / tên gói:** Tên gói là **`@cyberskill/design`** (VERSION bản nguồn **<!-- cs-source-version:package-source -->2.8.0<!-- /cs-source-version -->**; quyền trong `docs/consumer-grant.md` chi phối *sử dụng* — gói vẫn UNLICENSED). **Không** cài `@cyberskill/react` cho cây này — tên đó thuộc danh mục trang marketing lịch sử, không phải gói này.
 - **Danh mục nguồn và phần mở rộng:** Bề mặt CyberSkill trước đây có sáu primitive — `Button`, `TextField`, `Dialog`, `DataTable`, `AIDisclosureBadge`, `HumanReviewGate` — cùng `Logo` thương hiệu. Mọi thành phần khác trong gói **này** là **mở rộng có chủ ý**, dựng bằng vốn token riêng của thương hiệu: `Icon`, các primitive Forms / Feedback / Data / Navigation / Overlays chuẩn, nhóm AI-native (`PromptInput`, `ChatMessage`, `ConfidenceMeter`, `PromptSuggestions`, `TypingIndicator`, `CitationList`) chính thức hóa luồng điều ước Lumi, và linh vật `LumiAvatar`.
 
 ---
@@ -270,7 +270,7 @@ SKILL.md                   Agent-Skills-compatible entry
 - **Thang chữ, chuyển động & vai trò tương phản:** `tokens/typography.css` và `tokens/motion.css` cung cấp alias vai trò ngữ nghĩa (`--cs-text-h1`…) và tiện ích `.cs-h1` / `.cs-body` trong `base/typography.css`. Trạng thái ngữ nghĩa cung cấp vai trò nền, chữ ghép cặp (`-fg`) và chữ trên bề mặt (`-text`) riêng. `--cs-accent-on-strong` là chữ ghép cặp cho nền nhấn mạnh (APCA ≥ 75 cho văn bản nội dung và WCAG ≥ 4.5 ở cả hai chế độ; bộ sinh nhắm 78, kiểm chứng bởi `test:strong-text-contrast`).
 - **UI kit & catalog tham chiếu:** UI kit là bản tái hiện diện mạo HTML-first với dữ liệu hư cấu. Số lượng khai báo và vai trò tài liệu công khai được sinh trong [catalog tham chiếu](../../../docs/reference-catalog.json).
 - **Kiểm chứng tiếp cận:** `_audit/a11y-harness.html` và `npm run test:a11y-harness` kiểm tra tên tiếp cận bằng axe cục bộ được ghim trên Chromium, Firefox và WebKit.
-- **Bảng kiểm chứng, quét sức khỏe hiển thị & cổng chống thoái lui:** `audit/v2.5.0-verification.html` chấm 69 phép kiểm tra trên 10 chiều (`D1`–`D7` khắc phục + `D8`–`D10` Bất biến học thuyết) đạt **10.0 / 10** và nhúng bộ cơ sở 64 phép kiểm tra (**64/64** trên bản hiện tại, **62/64** trên v2.4.0, **8/64** trên v2.3.1); `audit/render-health.html` quét toàn bộ **146** template, thẻ và UI kit với **0 bad** ở chế độ gốc, khi ép `theme=dark`, và khi kết hợp `theme=dark` + `contrast=high` trên `set=cards`, cùng bằng chứng máy đọc tại `audit/v2.5.0-verification.json` và được cưỡng chế bởi `npm run test:audit-regression` (`_audit/ci/verify-audit-benchmarks-browser.mjs`). Mực nền nhuộm phạm vi mặc định tối đạt **8.42:1–10.54:1** (`.cs-result__icon` đạt **8.42:1**, `.cs-item.is-selected` đạt **10.54:1** — cả hai đều vượt chuẩn WCAG AAA `7:1` với `0 watch`).
+- **Cổng benchmark trình duyệt trực tiếp & chống thoái lui:** `npm run test:audit-regression` (`_audit/ci/verify-audit-benchmarks-browser.mjs`) chấm **129/129** phép kiểm tra trên 20 chiều (`D1`–`D20`) đạt **10.0 / 10**, **64/64** phép kiểm tra cơ sở cốt lõi đạt **10.0 / 10**, **192/192** ô (`≥ 3.0:1`) trong ma trận tương phản phi văn bản 32×6, và **3/3** màn hình phức hợp Generation-2 với **0 watch**. Mực nền nhuộm phạm vi mặc định tối đạt **8.42:1–10.54:1** (`.cs-result__icon` đạt **8.42:1**, `.cs-item.is-selected` đạt **10.54:1** — cả hai đều vượt chuẩn WCAG AAA `7:1`).
 
 <!-- BEGIN PINNED TOOLCHAIN BOOTSTRAP -->
 Trước khi chạy các lệnh `npm ci` hoặc `npm run` trong kho nguồn, dùng Node >=22.12.0 và chạy trực tiếp `node scripts/bootstrap-toolchain.mjs`. Lệnh này cài fixture npm 11.21.1 đã audit, ghim bằng lockfile, với lifecycle scripts bị tắt. Thêm `_audit/ci/fixtures/npm-cli/node_modules/.bin` vào PATH, hoặc chạy `node scripts/npm.mjs ci` và dùng `node scripts/npm.mjs` thay cho `npm` ở các lệnh tiếp theo (`devEngines` từ chối phiên bản npm khác trong kho nguồn; người dùng gói đã phát hành giữ package manager riêng). Xem [hướng dẫn kiểm tra và toolchain](../../../docs/validation.md).

package/docs/vi/release-notes.md

@@ -1,6 +1,6 @@
 # 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. VERSION của checkout nguồn **<!-- cs-source-version:checkout -->2.6.0<!-- /cs-source-version -->** là phiên bản trong repository. Trang này cung cấp nội dung Storybook **Release Notes**; sửa cục bộ chưa xác nhận nội dung đang triển khai tại `design.cyberskill.world`.
+Đ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. VERSION của checkout nguồn **<!-- cs-source-version:checkout -->2.8.0<!-- /cs-source-version -->** là phiên bản trong repository. Trang này cung cấp nội dung Storybook **Release Notes**; sửa cục bộ chưa xác nhận nội dung đang triển khai tại `design.cyberskill.world`.
 
 ## Bản sửa đổi chưa phát hành — đã triển khai cục bộ, chờ nghiệm thu
 
@@ -28,6 +28,30 @@ Các thay đổi này thuộc working tree đang sửa đổi. Đây chưa phả
 
 Release vẫn chờ nghiệm thu thị giác của con người, kiểm tra native/công nghệ hỗ trợ thủ công bắt buộc, quyết định về nguồn gốc tài nguyên và nghiệm thu hiện vật pilot đã thay đổi. Bằng chứng hỗ trợ đã thay đổi phải được review lại trong `components/lifecycle.json`. EN/VI là phạm vi ngôn ngữ mục tiêu; tiếng Nhật vẫn là spike chưa đầy đủ. Ghi chú này không cho phép mở rộng cam kết hỗ trợ, deprecate hay loại bỏ API.
 
+## Release — `@cyberskill/design@2.7.0`
+
+Phiên bản minor ổn định đã công bố được ghi nhận trong `_audit/ci/fixtures/npm-published-release.json` (quan sát lúc `2026-11-09T20:01:08.112Z`, tag `v2.7.0` tại commit `d951d7d74077913d5d957f75c9d50d873b9dd937`).
+
+- **Bộ Benchmark trình duyệt trực tiếp 20 chiều (`_audit/ci/verify-audit-benchmarks-browser.mjs`, `_audit/ci/lib/benchmark-checks.mjs`, `_audit/ci/fixtures/benchmark-20d.html`, `_audit/ci/fixtures/benchmark-gen2.html`):** Mở rộng bộ kiểm toán trình duyệt tự động lên **20 chiều (`129/129` phép kiểm tra đạt `10.0 / 10`, `0 watch` + `64/64` phép kiểm tra cơ sở = `193/193` khẳng định trình duyệt trực tiếp)** với `D11` (tương phản văn bản thân bài APCA $L_c \ge 75$ & nhịp điệu chữ), `D12` (thang cao độ z-index 7 tầng `--cs-depth-*` & cô lập cuộn lớp phủ), `D13` (container query đáp ứng, vùng an toàn & bố cục lại bảng), `D14` (thuộc tính logic RTL, trạng thái vô hiệu/chỉ đọc & tắt nhấp nháy khung xương khi giảm chuyển động), `D15` (`@media print`, `@media (forced-colors: active)` WHCM & bất biến thương hiệu), `D16` (tính trực giao 5 trục `Theme × Element × Density × Contrast × Style` & vật lý cao độ bề mặt), `D17` (đồng bộ bàn phím & bộ gõ tiếng Việt IME trên 3 trình duyệt), `D18` (tính tất định máy trạng thái 20 họ component), `D19` (hình học xuất bản tài liệu/mẫu & bảo toàn độ rộng cột bảng) và `D20` (đóng gói production, toàn vẹn SHA-256 & không lỗi console).
+- **Bộ kiểm thử trả focus & bảo vệ bộ gõ tiếng Việt IME trên 3 engine (`components/forms/TreeSelect.jsx`, `components/forms/Cascader.jsx`, `components/forms/ColorPicker.jsx`, `components/forms/SearchField.jsx`, `_audit/ci/test-picker-focus-ime-browser.mjs`):** Đảm bảo trả focus về nút kích hoạt trên Chromium, Firefox và WebKit khi đóng `DatePicker`, `TreeSelect`, `Cascader`, `ColorPicker` hoặc xóa nhanh `SearchField`, đồng thời xác minh chốt chặn phím Enter khi đang gõ tổ hợp dấu tiếng Việt (`isComposing`) trên `Combobox`, `TagInput`, `Mentions`, `PromptInput` và `SearchField`.
+- **Kiểm kê máy trạng thái & Xác thực nhanh `fast-gates` qua `act` (`scripts/generate-state-inventory.mjs`, `_audit/state-machines.*`, `scripts/run-act-ci.mjs`, `scripts/verify-ci-checks.mjs`, `.github/workflows/design-system-gates.yml`):** Bổ sung bộ kiểm kê máy trạng thái từ mã nguồn cùng kiểm thử chuyển tiếp `InlineEdit` trên 3 trình duyệt và mở rộng biên nhận `act` gắn với commit/tree sang `ci/act/fast-gates`.
+
+```bash
+npm install @cyberskill/design@2.7.0
+```
+
+## Release — `@cyberskill/design@2.6.0`
+
+Phiên bản minor ổn định đã công bố được ghi nhận trong `_audit/ci/fixtures/npm-published-release.json` (quan sát lúc `2026-11-09T17:39:34.494Z`, tag `v2.6.0` tại commit `48ed4be40e83bc6d5e2763b03111b07aa2c26df4`).
+
+- **Benchmark 10 chiều & Cổng chống thoái lui tự động trên CI (`_audit/ci/verify-audit-benchmarks-browser.mjs`, `_audit/ci/lib/benchmark-checks.mjs`, `_audit/ci/fixtures/benchmark-baseline.html`):** Mở rộng bộ kiểm toán trình duyệt trực tiếp lên **10 chiều (`69/69` phép kiểm tra đạt `10.0 / 10`, `0 watch`)** với `D8` (Vùng chạm ≥ 44px, Bảo toàn vòng lấy nét, Chế độ tương phản cao), `D9` (Đầy đủ token 5 Hành × 2 Chủ đề × 3 Biến thể, Toàn vẹn trang in A4, Giảm chuyển động), và `D10` (Nhận diện thương hiệu, Đầy đủ song ngữ EN/VI, Độ thuần khiết token), được cưỡng chế trong CI và `prepublishOnly` qua `npm run test:audit-regression`.
+- **Xuất CSS phẳng một tệp & Hướng dẫn logo nội tuyến (`package.json`, `scripts/flatten-css.mjs`, `DESIGN.md`, `docs/vi/entrypoints/DESIGN.md`):** Mở `"./dist/styles.css": "./dist/styles.css"` trong `package.json#exports`, tự động đóng dấu `VERSION` vào tiêu đề `dist/styles.css`, và quy định mẫu logo `<svg viewBox="0 0 64 64">` nội tuyến cho môi trường một tệp và cloud sandbox.
+- **Xác thực nhanh shard `act` gắn với commit (`.github/workflows/design-system-gates.yml`, `scripts/run-act-ci.mjs`, `scripts/verify-ci-checks.mjs`):** Kiểm chứng biên nhận `ci/act/unit-tests (1/4..4/4)` gắn với commit trước các bước cài đặt phụ thuộc và trình duyệt nặng, rút ngắn thời gian chạy `unit-tests` trên GitHub Actions xuống ~15 giây khi đã xác minh cục bộ qua `act`.
+
+```bash
+npm install @cyberskill/design@2.6.0
+```
+
 ## Release — `@cyberskill/design@2.5.0`
 
 Phiên bản minor ổn định đã công bố được ghi nhận trong `_audit/ci/fixtures/npm-published-release.json` (quan sát lúc `2026-11-09T06:04:11.249Z`, tag `v2.5.0` tại commit `6e7fe3c158b122c8ca19b8253eb06460c7f2f919`). Các tag kho mã `v2.3.1` và `v2.4.0` đi trước `v2.5.0`.
@@ -35,7 +59,6 @@ Phiên bản minor ổn định đã công bố được ghi nhận trong `_audi
 - **Đồng bộ chủ đề lồng nhau & Liquid Glass (`base/glass.css`, `tokens/theme-dark.css`):** Tính lại các token `--_cs-light` / `--_cs-dark`, `--_cs-surface-scrim` và toàn bộ tám chất liệu `--cs-glass-*-{bg,border}` bên trong các khối `[data-theme]` lồng nhau.
 - **Tương phản 32 scope & an toàn nền Dark mặc định (`base/collections.css`, `base/controls.css`, `base/feedback.css`, `base/shell.css`, `base/ai.css`):** Thay nền `--cs-accent-tint` thiếu scope ở Dark Mode bằng `color-mix(in oklab, var(--cs-accent) 18%, var(--cs-color-surface-panel))`, nâng các chỉ báo phi văn bản lên `--cs-color-text-accent` (`WCAG 1.4.11 ≥ 3:1` trên toàn bộ 32 scope) và bổ sung viền nội tiếp cho bề mặt Umber trên nền tối.
 - **Đồng bộ trạng thái lỗi 13 form control & chiều cao dòng tiếng Việt (`base/components.css`, `base/controls.css`, `base/typography.css`, `base/data.css`):** Thống nhất viền lỗi `.is-invalid` / `[aria-invalid="true"]` trên cả 13 loại form control và áp dụng `:lang(vi) { line-height: 1.22; }` cho `.cs-display` cùng `.cs-stat__value`.
-- **Kiểm chứng & Cổng chống thoái lui (`audit/v2.5.0-verification.html`, `audit/render-health.html`, `audit/v2.5.0-verification.json`, `_audit/ci/verify-audit-benchmarks-browser.mjs`):** Toàn bộ 69 phép kiểm tra trên 10 chiều (`D1`–`D7` khắc phục + `D8`–`D10` Bất biến học thuyết) đạt **10.0 / 10** và bộ cơ sở nhúng đạt **64/64** (**62/64** cho v2.4.0, **8/64** cho v2.3.1); `audit/render-health.html` kiểm tra **146** trang với **0 bad** ở chế độ gốc, khi ép `theme=dark`, và khi kết hợp `theme=dark` + `contrast=high` trên `set=cards`. Mực nền nhuộm phạm vi mặc định tối đạt **8.42:1–10.54:1** (`.cs-result__icon` đạt **8.42:1**, `.cs-item.is-selected` đạt **10.54:1** — cả hai đều vượt chuẩn WCAG AAA `7:1` với `0 watch`).
 
 ```bash
 npm install @cyberskill/design@2.5.0