@helixui/library 3.2.0 → 3.3.0-next.112

package/dist/css/hx-toast.css

@@ -49,33 +49,38 @@
    * error-600) because the lighter -500 fills can't pass AA against white
    * text in the precision-cool palette. The neutral-900 on-{role} tokens
    * are tuned for the lighter -500 surfaces and would fail here (e.g.
-   * neutral-900 on primary-600 = 3.07:1), so we hold fg at neutral-0
-   * directly for primary/success/danger.
-   * - neutral-0 on primary-600 (#0F7078) = 5.39:1 — AA pass
-   * - neutral-0 on success-700 (#146831) = 6.88:1 — AA pass
-   *   (success-600 #0E8A4A on white = 4.41:1 — drifts under AA at 14px)
-   * - neutral-0 on error-600   (#C92A2A) = 5.92:1 — AA pass
-   * - neutral-900 on warning-500 (#C2711C) = 4.83:1 — AA pass
+   * neutral-900 on primary-600 = 3.07:1), so the on-{role}-strong tokens
+   * (neutral-0, no dark-mode flip) keep fg legible on the darker fills.
+   * - text.on-primary-strong on info.bg-strong (primary-600, #0F7078) = 5.82:1
+   * - text.on-success-strong on success.bg-strong (success-700, #146831) = 6.88:1
+   *   (success-600 #0E8A4A on white = 4.42:1 — drifts under AA at 14px)
+   * - text.on-error-strong   on danger.bg-strong  (error-600, #C92A2A) = 5.46:1
+   * - text.on-warning        on warning.bg-strong (warning-500, #C2711C) = 4.83:1
    *   (warning stays on the lighter -500 surface so on-warning works)
+   *
+   * 3.2.1 token-cascade: bg variants now route through surface.{role}-strong
+   * semantics; fg variants route through text.on-{role}-strong (or on-warning
+   * for the warning variant). Component-tier tokens are NOT bypassed — the
+   * --hx-toast-bg / --hx-toast-color slots remain the single override point.
    */
   .toast--success {
-    --hx-toast-bg: var(--hx-color-success-700, #146831);
-    --hx-toast-color: var(--hx-color-neutral-0, #ffffff);
+    --hx-toast-bg: var(--hx-color-surface-success-strong, #146831);
+    --hx-toast-color: var(--hx-color-text-on-success-strong, #ffffff);
   }
 
   .toast--warning {
-    --hx-toast-bg: var(--hx-color-warning-500, #c2711c);
+    --hx-toast-bg: var(--hx-color-surface-warning-strong, #c2711c);
     --hx-toast-color: var(--hx-color-text-on-warning, #0d1825);
   }
 
   .toast--danger {
-    --hx-toast-bg: var(--hx-color-error-600, #c92a2a);
-    --hx-toast-color: var(--hx-color-neutral-0, #ffffff);
+    --hx-toast-bg: var(--hx-color-surface-danger-strong, #c92a2a);
+    --hx-toast-color: var(--hx-color-text-on-error-strong, #ffffff);
   }
 
   .toast--info {
-    --hx-toast-bg: var(--hx-color-primary-600, #0f7078);
-    --hx-toast-color: var(--hx-color-neutral-0, #ffffff);
+    --hx-toast-bg: var(--hx-color-surface-info-strong, #0f7078);
+    --hx-toast-color: var(--hx-color-text-on-primary-strong, #ffffff);
   }
 
   /* ─── Severity Label (WCAG 1.4.1) ─── */
@@ -168,10 +173,16 @@
   }
 
   /* ─── Forced Colors (Windows High Contrast) ─── */
-  /* Belt-and-suspenders: rich per-class HC overrides PLUS the forcedColorsSurface mixin. */
+  /* Sole owner: bespoke per-class HC overrides on .toast and .toast__close.
+     The shared forcedColorsSurface mixin was dropped in 3.2.1 (XOR rule);
+     this block now carries the surface contract the mixin used to provide
+     (background:Canvas + color:CanvasText + border:1px solid CanvasText)
+     plus the per-class affordances the mixin never touched. */
 
   @media (forced-colors: active) {
     .toast {
+      background: Canvas;
+      color: CanvasText;
       border: 1px solid CanvasText;
     }
 

package/dist/css/hx-toggle-button.css

@@ -36,10 +36,7 @@
 
   .button:focus-visible {
     outline: var(--hx-focus-ring-width, 2px) solid
-      var(
-        --hx-toggle-button-focus-ring-color,
-        var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1))
-      );
+      var(--hx-toggle-button-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
     outline-offset: var(--hx-focus-ring-offset, 2px);
   }
 
@@ -121,7 +118,7 @@
   .button--outline {
     --hx-toggle-button-bg: transparent;
     --hx-toggle-button-color: var(--hx-color-text-primary, #0d1825);
-    --hx-toggle-button-border-color: var(--hx-color-border-strong, #8e9c98);
+    --hx-toggle-button-border-color: var(--hx-color-border-strong, #66787b);
   }
 
   .button--outline:hover {
@@ -170,8 +167,8 @@
       --hx-toggle-button-pressed-color,
       var(--hx-color-primary-700, #0f6363)
     );
-    --hx-toggle-button-border-color: var(--hx-color-primary-400, #6ab1b1);
-    box-shadow: inset 0 0 0 1px var(--hx-color-primary-400, #6ab1b1);
+    --hx-toggle-button-border-color: var(--hx-color-primary-600, #0f7078);
+    box-shadow: inset 0 0 0 1px var(--hx-color-primary-600, #0f7078);
   }
 
   /* Ghost pressed: subtle neutral fill, matching hover behavior as a baseline. */

package/dist/css/hx-top-nav.css

@@ -73,10 +73,7 @@
 
   .mobile-toggle:focus-visible {
     outline: var(--hx-focus-ring-width, 2px) solid
-      var(
-        --hx-top-nav-focus-ring-color,
-        var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
-      );
+      var(--hx-top-nav-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
     outline-offset: var(--hx-focus-ring-offset, 2px);
   }
 

package/dist/css/hx-tree-view.css

@@ -15,8 +15,7 @@
   }
 
   .tree:focus-visible {
-    outline: var(--hx-focus-ring-width, 2px) solid
-      var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1));
+    outline: var(--hx-focus-ring-width, 2px) solid var(--hx-focus-ring-color, #0f7078);
     outline-offset: var(--hx-focus-ring-offset, 2px);
     border-radius: var(--hx-border-radius-sm, 0.25rem);
   }

package/dist/css/index.css

@@ -1,4 +1,4 @@
-/* index.css — generated 2026-04-25T16:50:43.270Z */
+/* index.css — generated 2026-05-03T13:41:35.968Z */
 /* Imports all per-component CSS files for Drupal asset pipeline */
 
 @import './hx-accordion.css';

package/dist/css/manifest.json

@@ -1,5 +1,5 @@
 {
-  "generated": "2026-04-25T16:50:43.270Z",
+  "generated": "2026-05-03T13:41:35.967Z",
   "components": [
     {
       "name": "hx-accordion",
@@ -46,6 +46,7 @@
         "--hx-alert-border-color",
         "--hx-alert-border-radius",
         "--hx-alert-border-width",
+        "--hx-alert-close-btn-focus-ring-color",
         "--hx-alert-color",
         "--hx-alert-font-family",
         "--hx-alert-gap",
@@ -62,7 +63,6 @@
         "--hx-color-info-50",
         "--hx-color-info-500",
         "--hx-color-info-800",
-        "--hx-color-primary-400",
         "--hx-color-success-200",
         "--hx-color-success-50",
         "--hx-color-success-500",
@@ -189,9 +189,11 @@
       "file": "hx-banner.css",
       "tokens": [
         "--hx-banner-action-color",
+        "--hx-banner-action-focus-ring-color",
         "--hx-banner-bg",
         "--hx-banner-border-color",
         "--hx-banner-border-width",
+        "--hx-banner-close-btn-focus-ring-color",
         "--hx-banner-color",
         "--hx-banner-font-family",
         "--hx-banner-gap",
@@ -209,7 +211,6 @@
         "--hx-color-info-50",
         "--hx-color-info-500",
         "--hx-color-info-800",
-        "--hx-color-primary-400",
         "--hx-color-success-200",
         "--hx-color-success-50",
         "--hx-color-success-500",
@@ -251,25 +252,43 @@
       "tokens": [
         "--hx-border-radius-md",
         "--hx-border-width-thin",
+        "--hx-button-active-bg",
         "--hx-button-bg",
         "--hx-button-border-color",
         "--hx-button-border-radius",
         "--hx-button-color",
+        "--hx-button-focus-ring-color",
         "--hx-button-font-family",
         "--hx-button-font-weight",
         "--hx-button-hover-bg",
         "--hx-button-inverted-color",
+        "--hx-color-action-danger-bg",
+        "--hx-color-action-danger-bg-active",
+        "--hx-color-action-danger-bg-hover",
+        "--hx-color-action-danger-bg-inverted-hover",
+        "--hx-color-action-ghost-bg-hover",
+        "--hx-color-action-ghost-fg",
+        "--hx-color-action-primary-bg",
+        "--hx-color-action-primary-bg-active",
+        "--hx-color-action-primary-bg-hover",
+        "--hx-color-action-primary-bg-inverted-hover",
+        "--hx-color-action-primary-bg-inverted-rest",
+        "--hx-color-action-secondary-bg-hover",
+        "--hx-color-action-secondary-border",
+        "--hx-color-action-secondary-fg",
+        "--hx-color-border-on-dark-strong",
         "--hx-color-border-strong",
-        "--hx-color-error-500",
-        "--hx-color-error-600",
         "--hx-color-neutral-0",
-        "--hx-color-primary-400",
         "--hx-color-primary-500",
-        "--hx-color-primary-600",
+        "--hx-color-surface-on-dark-overlay-default",
+        "--hx-color-surface-on-dark-overlay-subtle",
         "--hx-color-surface-raised",
         "--hx-color-surface-sunken",
+        "--hx-color-text-inverse",
         "--hx-color-text-on-error",
+        "--hx-color-text-on-error-strong",
         "--hx-color-text-on-primary",
+        "--hx-color-text-on-primary-strong",
         "--hx-color-text-primary",
         "--hx-duration-spinner",
         "--hx-filter-brightness-active",
@@ -285,11 +304,6 @@
         "--hx-line-height-tight",
         "--hx-opacity-disabled",
         "--hx-opacity-muted",
-        "--hx-overlay-white-15",
-        "--hx-overlay-white-20",
-        "--hx-overlay-white-25",
-        "--hx-overlay-white-50",
-        "--hx-overlay-white-70",
         "--hx-size-10",
         "--hx-size-12",
         "--hx-space-1",
@@ -327,6 +341,7 @@
         "--hx-card-color",
         "--hx-card-featured-border-color",
         "--hx-card-featured-border-width",
+        "--hx-card-focus-ring-color",
         "--hx-card-font-family",
         "--hx-card-gap",
         "--hx-card-image-aspect-ratio",
@@ -384,7 +399,6 @@
         "--hx-color-neutral-50",
         "--hx-color-neutral-500",
         "--hx-color-neutral-700",
-        "--hx-color-primary-500",
         "--hx-color-primary-600",
         "--hx-focus-ring-color",
         "--hx-focus-ring-offset",
@@ -412,6 +426,7 @@
         "--hx-checkbox-checked-border-color",
         "--hx-checkbox-checkmark-color",
         "--hx-checkbox-error-color",
+        "--hx-checkbox-focus-ring-color",
         "--hx-checkbox-focus-ring-offset",
         "--hx-checkbox-focus-ring-width",
         "--hx-checkbox-font-family",
@@ -421,7 +436,6 @@
         "--hx-color-border-strong",
         "--hx-color-error-500",
         "--hx-color-error-text",
-        "--hx-color-primary-400",
         "--hx-color-primary-500",
         "--hx-color-surface-default",
         "--hx-color-text-muted",
@@ -499,7 +513,6 @@
         "--hx-color-error-700",
         "--hx-color-error-800",
         "--hx-color-error-900",
-        "--hx-color-focus",
         "--hx-color-info-200",
         "--hx-color-info-50",
         "--hx-color-info-500",
@@ -548,7 +561,7 @@
         "--hx-code-snippet-padding",
         "--hx-code-snippet-tab-size",
         "--hx-color-border-default",
-        "--hx-color-border-strong",
+        "--hx-color-border-on-dark-strong",
         "--hx-color-primary-400",
         "--hx-color-surface-inverse",
         "--hx-color-surface-sunken",
@@ -557,7 +570,6 @@
         "--hx-color-text-primary",
         "--hx-filter-brightness-active",
         "--hx-filter-brightness-hover",
-        "--hx-focus-ring-color",
         "--hx-focus-ring-offset",
         "--hx-focus-ring-width",
         "--hx-font-family-mono",
@@ -590,6 +602,7 @@
         "--hx-color-neutral-600",
         "--hx-color-neutral-700",
         "--hx-color-neutral-900",
+        "--hx-color-picker-focus-ring-color",
         "--hx-color-picker-grid-height",
         "--hx-color-picker-panel-shadow",
         "--hx-color-picker-swatch-border",
@@ -630,9 +643,7 @@
         "--hx-color-neutral-900",
         "--hx-color-primary-100",
         "--hx-color-primary-200",
-        "--hx-color-primary-400",
         "--hx-color-primary-50",
-        "--hx-color-primary-500",
         "--hx-color-primary-800",
         "--hx-color-surface-default",
         "--hx-color-text-muted",
@@ -776,6 +787,7 @@
         "--hx-data-table-cell-color",
         "--hx-data-table-checkbox-accent-color",
         "--hx-data-table-empty-color",
+        "--hx-data-table-focus-ring-color",
         "--hx-data-table-font-family",
         "--hx-data-table-header-bg",
         "--hx-data-table-header-color",
@@ -815,7 +827,6 @@
         "--hx-color-error-500",
         "--hx-color-error-text",
         "--hx-color-neutral-900",
-        "--hx-color-primary-400",
         "--hx-color-primary-500",
         "--hx-color-primary-600",
         "--hx-color-surface-default",
@@ -836,6 +847,7 @@
         "--hx-date-picker-color",
         "--hx-date-picker-day-hover-bg",
         "--hx-date-picker-error-color",
+        "--hx-date-picker-focus-ring-color",
         "--hx-date-picker-font-family",
         "--hx-date-picker-label-color",
         "--hx-date-picker-selected-bg",
@@ -876,7 +888,6 @@
         "--hx-border-radius-sm",
         "--hx-border-width-thin",
         "--hx-color-border-default",
-        "--hx-color-primary-500",
         "--hx-color-surface-default",
         "--hx-color-surface-overlay",
         "--hx-color-surface-sunken",
@@ -888,6 +899,7 @@
         "--hx-dialog-body-padding",
         "--hx-dialog-border-radius",
         "--hx-dialog-close-btn-color",
+        "--hx-dialog-close-btn-focus-ring-color",
         "--hx-dialog-close-btn-hover-bg",
         "--hx-dialog-close-btn-hover-color",
         "--hx-dialog-color",
@@ -947,7 +959,6 @@
         "--hx-border-radius-md",
         "--hx-border-width-thin",
         "--hx-color-border-default",
-        "--hx-color-primary-500",
         "--hx-color-surface-default",
         "--hx-color-surface-overlay",
         "--hx-color-surface-sunken",
@@ -957,6 +968,7 @@
         "--hx-drawer-bg",
         "--hx-drawer-body-padding",
         "--hx-drawer-close-btn-color",
+        "--hx-drawer-close-btn-focus-ring-color",
         "--hx-drawer-close-btn-hover-bg",
         "--hx-drawer-close-btn-hover-color",
         "--hx-drawer-color",
@@ -1078,6 +1090,7 @@
         "--hx-file-upload-dropzone-border-color",
         "--hx-file-upload-dropzone-border-radius",
         "--hx-file-upload-error-color",
+        "--hx-file-upload-focus-ring-color",
         "--hx-file-upload-font-family",
         "--hx-file-upload-progress-color",
         "--hx-file-upload-progress-height",
@@ -1176,6 +1189,7 @@
         "--hx-icon-button-border-color",
         "--hx-icon-button-border-radius",
         "--hx-icon-button-color",
+        "--hx-icon-button-focus-ring-color",
         "--hx-icon-button-size",
         "--hx-opacity-disabled",
         "--hx-size-10",
@@ -1213,7 +1227,6 @@
         "--hx-border-radius-sm",
         "--hx-color-error-700",
         "--hx-color-error-text",
-        "--hx-color-primary-400",
         "--hx-color-primary-600",
         "--hx-color-primary-700",
         "--hx-color-primary-800",
@@ -1230,6 +1243,7 @@
         "--hx-link-color-disabled",
         "--hx-link-color-hover",
         "--hx-link-color-subtle",
+        "--hx-link-focus-ring-color",
         "--hx-link-font-family",
         "--hx-link-text-decoration",
         "--hx-link-text-decoration-hover",
@@ -1315,7 +1329,6 @@
         "--hx-color-neutral-700",
         "--hx-color-neutral-800",
         "--hx-color-neutral-900",
-        "--hx-color-primary-500",
         "--hx-color-primary-600",
         "--hx-focus-ring-color",
         "--hx-focus-ring-offset",
@@ -1328,6 +1341,7 @@
         "--hx-nav-bg",
         "--hx-nav-border-radius",
         "--hx-nav-color",
+        "--hx-nav-focus-ring-color",
         "--hx-nav-font-family",
         "--hx-nav-font-size",
         "--hx-nav-item-padding",
@@ -1404,7 +1418,6 @@
         "--hx-border-radius-md",
         "--hx-border-width-thin",
         "--hx-color-border-default",
-        "--hx-color-primary-500",
         "--hx-color-surface-default",
         "--hx-color-surface-raised",
         "--hx-color-surface-sunken",
@@ -1418,6 +1431,7 @@
         "--hx-font-size-sm",
         "--hx-opacity-disabled",
         "--hx-overflow-menu-button-color",
+        "--hx-overflow-menu-focus-ring-color",
         "--hx-overflow-menu-item-color",
         "--hx-overflow-menu-panel-bg",
         "--hx-overflow-menu-panel-border",
@@ -1462,6 +1476,7 @@
         "--hx-pagination-button-size",
         "--hx-pagination-color",
         "--hx-pagination-ellipsis-color",
+        "--hx-pagination-focus-ring-color",
         "--hx-pagination-font-family",
         "--hx-pagination-gap",
         "--hx-pagination-hover-bg",
@@ -1529,6 +1544,7 @@
         "--hx-opacity-50",
         "--hx-opacity-90",
         "--hx-phi-field-disabled-opacity",
+        "--hx-phi-field-focus-ring-color",
         "--hx-phi-field-font-family",
         "--hx-phi-field-letter-spacing",
         "--hx-phi-field-masked-color",
@@ -1545,7 +1561,6 @@
       "tokens": [
         "--hx-border-radius-md",
         "--hx-color-border-default",
-        "--hx-color-primary-500",
         "--hx-color-surface-default",
         "--hx-color-text-primary",
         "--hx-focus-ring-color",
@@ -1560,6 +1575,7 @@
         "--hx-popover-border-color",
         "--hx-popover-border-radius",
         "--hx-popover-color",
+        "--hx-popover-focus-ring-color",
         "--hx-popover-font-family",
         "--hx-popover-font-size",
         "--hx-popover-max-width",
@@ -1673,7 +1689,6 @@
       "tokens": [
         "--hx-border-radius-sm",
         "--hx-color-border-strong",
-        "--hx-color-primary-400",
         "--hx-color-warning-300",
         "--hx-color-warning-400",
         "--hx-focus-ring-color",
@@ -1701,9 +1716,7 @@
         "--hx-color-error-500",
         "--hx-color-error-text",
         "--hx-color-primary-100",
-        "--hx-color-primary-400",
         "--hx-color-primary-50",
-        "--hx-color-primary-500",
         "--hx-color-surface-default",
         "--hx-color-text-muted",
         "--hx-color-text-placeholder",
@@ -1731,6 +1744,7 @@
         "--hx-select-chevron-size",
         "--hx-select-color",
         "--hx-select-error-color",
+        "--hx-select-focus-ring-color",
         "--hx-select-font-family",
         "--hx-select-label-color",
         "--hx-select-listbox-bg",
@@ -1755,20 +1769,21 @@
       "tokens": [
         "--hx-border-radius-sm",
         "--hx-border-width-thin",
-        "--hx-color-border-strong",
-        "--hx-color-primary-400",
+        "--hx-color-border-on-dark-strong",
         "--hx-color-surface-inverse",
+        "--hx-color-surface-on-dark-overlay-subtle",
         "--hx-color-text-inverse",
         "--hx-focus-ring-color",
         "--hx-focus-ring-offset",
         "--hx-focus-ring-width",
         "--hx-side-nav-bg",
-        "--hx-side-nav-border-color",
         "--hx-side-nav-collapsed-width",
         "--hx-side-nav-color",
+        "--hx-side-nav-focus-ring-color",
         "--hx-side-nav-footer-padding",
         "--hx-side-nav-header-padding",
         "--hx-side-nav-toggle-color",
+        "--hx-side-nav-toggle-hover-color",
         "--hx-side-nav-width",
         "--hx-space-14",
         "--hx-space-2",
@@ -1807,7 +1822,6 @@
         "--hx-border-width-thin",
         "--hx-color-border-default",
         "--hx-color-border-strong",
-        "--hx-color-primary-400",
         "--hx-color-primary-500",
         "--hx-color-surface-default",
         "--hx-color-text-muted",
@@ -1830,6 +1844,7 @@
         "--hx-size-8",
         "--hx-slider-disabled-fill-bg",
         "--hx-slider-fill-bg",
+        "--hx-slider-focus-ring-color",
         "--hx-slider-font-family",
         "--hx-slider-help-text-color",
         "--hx-slider-input-padding-block",
@@ -1888,10 +1903,10 @@
         "--hx-color-neutral-0",
         "--hx-color-primary-200",
         "--hx-color-primary-300",
-        "--hx-color-primary-400",
         "--hx-color-primary-50",
         "--hx-color-primary-500",
         "--hx-color-primary-600",
+        "--hx-color-primary-900",
         "--hx-color-surface-default",
         "--hx-color-surface-raised",
         "--hx-color-surface-sunken",
@@ -1924,6 +1939,7 @@
         "--hx-split-button-border-radius",
         "--hx-split-button-color",
         "--hx-split-button-divider-color",
+        "--hx-split-button-focus-ring-color",
         "--hx-split-button-font-family",
         "--hx-split-button-font-weight",
         "--hx-split-button-menu-bg",
@@ -1949,6 +1965,7 @@
         "--hx-split-panel-btn-icon-size",
         "--hx-split-panel-divider-color",
         "--hx-split-panel-divider-size",
+        "--hx-split-panel-focus-ring-color",
         "--hx-touch-target-min",
         "--hx-transition-fast"
       ]
@@ -2095,7 +2112,6 @@
         "--hx-border-radius-full",
         "--hx-color-border-strong",
         "--hx-color-error-text",
-        "--hx-color-primary-400",
         "--hx-color-primary-500",
         "--hx-color-primary-600",
         "--hx-color-surface-default",
@@ -2123,6 +2139,7 @@
         "--hx-space-1",
         "--hx-space-2",
         "--hx-switch-error-color",
+        "--hx-switch-focus-ring-color",
         "--hx-switch-font-family",
         "--hx-switch-help-text-color",
         "--hx-switch-label-color",
@@ -2150,7 +2167,6 @@
       "name": "hx-table",
       "file": "hx-table.css",
       "tokens": [
-        "--hx-color-primary-500",
         "--hx-color-surface-raised",
         "--hx-color-text-strong",
         "--hx-focus-ring-color",
@@ -2301,7 +2317,6 @@
         "--hx-color-border-strong",
         "--hx-color-error-600",
         "--hx-color-error-text",
-        "--hx-color-primary-400",
         "--hx-color-surface-default",
         "--hx-color-surface-sunken",
         "--hx-color-text-disabled",
@@ -2323,6 +2338,7 @@
         "--hx-input-border-radius",
         "--hx-input-color",
         "--hx-input-error-color",
+        "--hx-input-focus-ring-color",
         "--hx-input-font-family",
         "--hx-input-label-color",
         "--hx-input-lg-font-size",
@@ -2354,7 +2370,6 @@
         "--hx-color-border-strong",
         "--hx-color-error-600",
         "--hx-color-error-text",
-        "--hx-color-primary-400",
         "--hx-color-surface-default",
         "--hx-color-text-muted",
         "--hx-color-text-placeholder",
@@ -2373,6 +2388,7 @@
         "--hx-input-border-radius",
         "--hx-input-color",
         "--hx-input-error-color",
+        "--hx-input-focus-ring-color",
         "--hx-input-font-family",
         "--hx-input-label-color",
         "--hx-line-height-normal",
@@ -2453,14 +2469,16 @@
       "tokens": [
         "--hx-border-radius-md",
         "--hx-border-radius-sm",
-        "--hx-color-error-600",
-        "--hx-color-neutral-0",
-        "--hx-color-primary-600",
-        "--hx-color-success-700",
+        "--hx-color-surface-danger-strong",
+        "--hx-color-surface-info-strong",
         "--hx-color-surface-inverse",
+        "--hx-color-surface-success-strong",
+        "--hx-color-surface-warning-strong",
         "--hx-color-text-inverse",
+        "--hx-color-text-on-error-strong",
+        "--hx-color-text-on-primary-strong",
+        "--hx-color-text-on-success-strong",
         "--hx-color-text-on-warning",
-        "--hx-color-warning-500",
         "--hx-focus-ring-offset",
         "--hx-focus-ring-width",
         "--hx-font-family-sans",
@@ -2494,7 +2512,6 @@
         "--hx-color-neutral-0",
         "--hx-color-neutral-500",
         "--hx-color-primary-100",
-        "--hx-color-primary-400",
         "--hx-color-primary-50",
         "--hx-color-primary-500",
         "--hx-color-primary-600",
@@ -2527,6 +2544,7 @@
         "--hx-toggle-button-border-color",
         "--hx-toggle-button-border-radius",
         "--hx-toggle-button-color",
+        "--hx-toggle-button-focus-ring-color",
         "--hx-toggle-button-font-family",
         "--hx-toggle-button-font-weight",
         "--hx-toggle-button-pressed-bg",
@@ -2569,7 +2587,6 @@
         "--hx-border-radius-sm",
         "--hx-border-width-thin",
         "--hx-color-border-default",
-        "--hx-color-primary-500",
         "--hx-color-surface-default",
         "--hx-color-surface-sunken",
         "--hx-color-text-strong",
@@ -2587,6 +2604,7 @@
         "--hx-top-nav-bg",
         "--hx-top-nav-border-color",
         "--hx-top-nav-color",
+        "--hx-top-nav-focus-ring-color",
         "--hx-top-nav-font-family",
         "--hx-top-nav-height",
         "--hx-top-nav-padding-x",
@@ -2601,7 +2619,6 @@
       "file": "hx-tree-view.css",
       "tokens": [
         "--hx-border-radius-sm",
-        "--hx-color-primary-400",
         "--hx-focus-ring-color",
         "--hx-focus-ring-offset",
         "--hx-focus-ring-width",