update skill ba

ba-output/e-commerce/00-index/ds/tokens.css

@@ -0,0 +1,56 @@
+/* tokens.css — SINH TỪ tokens.json, không sửa tay.
+   Quy tắc tên: --ds-<đường dẫn token nối bằng '-'>. Kiểm khớp: node scripts/design-check.mjs --tokens tokens.json --css tokens.css
+   Khối :root này được chép nguyên văn vào <style> của mọi HIFI_*.html và components.html (file tự chứa).
+   Dự án e-commerce: giá trị vẫn là placeholder trung tính của template ba-design (chưa có brand guideline —
+   SAD §7.0; chưa chọn design system — OQ-022; breakpoint/content-max chưa chốt — OQ-018). Xem DS_e-commerce_v1.0.md §0. */
+:root{
+  --ds-color-bg-canvas:#F6F7F9;
+  --ds-color-bg-surface:#FFFFFF;
+  --ds-color-bg-subtle:#EEF1F5;
+  --ds-color-border-default:#D5DAE1;
+  --ds-color-border-strong:#767F8C;
+  --ds-color-text-primary:#1B1F24;
+  --ds-color-text-secondary:#5B6472;
+  --ds-color-text-disabled:#9AA3AF;
+  --ds-color-text-inverse:#FFFFFF;
+  --ds-color-brand-primary:#2456A6;
+  --ds-color-brand-primary-hover:#1C468A;
+  --ds-color-brand-primary-subtle:#E7EEF9;
+  --ds-color-status-danger:#B42318;
+  --ds-color-status-danger-subtle:#FDECEA;
+  --ds-color-status-success:#1E7B45;
+  --ds-color-status-success-subtle:#E6F4EC;
+  --ds-color-status-warning:#B7791F;
+  --ds-color-status-warning-subtle:#FFF4DE;
+  --ds-color-focus-ring:#2456A6;
+  --ds-font-family-base:"Segoe UI","Roboto","Helvetica Neue","Arial",sans-serif;
+  --ds-font-family-mono:"SFMono-Regular","Consolas","Menlo",monospace;
+  --ds-font-size-xs:12px;
+  --ds-font-size-sm:14px;
+  --ds-font-size-md:16px;
+  --ds-font-size-lg:20px;
+  --ds-font-size-xl:24px;
+  --ds-font-size-2xl:32px;
+  --ds-font-weight-regular:400;
+  --ds-font-weight-semibold:600;
+  --ds-font-line-height-tight:1.25;
+  --ds-font-line-height-normal:1.5;
+  --ds-space-1:4px;
+  --ds-space-2:8px;
+  --ds-space-3:12px;
+  --ds-space-4:16px;
+  --ds-space-6:24px;
+  --ds-space-8:32px;
+  --ds-space-12:48px;
+  --ds-radius-sm:4px;
+  --ds-radius-md:8px;
+  --ds-radius-pill:999px;
+  --ds-shadow-sm:0px 1px 2px 0px #1B1F2414;
+  --ds-shadow-md:0px 4px 12px 0px #1B1F2426;
+  --ds-size-control-desktop:36px;
+  --ds-size-control-touch:44px;
+  --ds-size-icon:20px;
+  --ds-size-content-max:1200px;
+  --ds-breakpoint-tablet:768px;
+  --ds-breakpoint-desktop:1024px;
+}