@hirobius/design-system 0.23.1 → 0.24.0

package/dist/hirobius-ui.js

@@ -1,25 +1,25 @@
 'use client';
-import { jsxs as h, jsx as t, Fragment as at } from "react/jsx-runtime";
+import { jsxs as f, jsx as t, Fragment as at } from "react/jsx-runtime";
 import * as m from "react";
 import Z, { useState as X, forwardRef as oe, useRef as Se, useEffect as rt, useId as Ne } from "react";
 import { motion as E, AnimatePresence as nt } from "motion/react";
 import { cva as $ } from "class-variance-authority";
-import { Info as ze, TriangleAlert as _e, CircleX as Oe, CircleCheck as Ge, X as $e, ChevronRight as Ce, Circle as ot, Check as pe, Copy as st, SquareArrowOutUpRight as lt, Loader2 as ct, Minus as dt, ChevronsUpDown as je, ChevronDown as pt, ChevronLeft as ut } from "lucide-react";
+import { Info as ze, TriangleAlert as Ge, CircleX as _e, CircleCheck as Oe, X as $e, ChevronRight as Ce, Circle as ot, Check as pe, Copy as st, SquareArrowOutUpRight as lt, Loader2 as ct, Minus as dt, ChevronsUpDown as je, ChevronDown as pt, ChevronLeft as ut } from "lucide-react";
 import D, { tokenValues as De } from "./tokens.js";
 import { cn as d } from "./cn.js";
-import { u as j, I, i as mt, d as vt, T as Ue, w as ue, B as be, r as Ye, L as qe, S as Ae, a as gt } from "./chunks/empty-state-ChC_xZfg.js";
-import { A as mr, b as vr, e as gr, f as fr, g as hr, j as br, k as $r, l as yr, m as xr, C as wr, E as kr, G as Sr, H as Nr, c as zr, n as Cr } from "./chunks/empty-state-ChC_xZfg.js";
+import { u as j, I as M, i as mt, d as vt, T as Ue, w as ue, B as be, r as Ye, L as qe, S as Ie, a as gt } from "./chunks/empty-state-BQ1v7ZIx.js";
+import { A as mr, b as vr, e as gr, f as hr, g as fr, j as br, k as $r, l as yr, m as xr, C as wr, E as kr, G as Sr, H as Nr, c as zr, n as Cr } from "./chunks/empty-state-BQ1v7ZIx.js";
 import * as U from "@radix-ui/react-dialog";
 import * as B from "@radix-ui/react-dropdown-menu";
 import * as se from "@radix-ui/react-popover";
 import * as re from "@radix-ui/react-tooltip";
 import { a as Xe, u as me } from "./chunks/DemoStateContext-Cz5TmrYu.js";
 import { H as Tr } from "./chunks/DemoStateContext-Cz5TmrYu.js";
-import * as Ie from "@radix-ui/react-toggle-group";
-import * as G from "@radix-ui/react-select";
+import * as Me from "@radix-ui/react-toggle-group";
+import * as O from "@radix-ui/react-select";
 import * as ye from "@radix-ui/react-tabs";
 import * as ae from "@radix-ui/react-toast";
-const ft = /* @__PURE__ */ $(
+const ht = /* @__PURE__ */ $(
   "flex gap-[var(--semantic-space-scale-xs)] p-[var(--semantic-space-scale-xs)] rounded-[var(--primitive-radius-4)]",
   // tier-ok: 4px primitive radius, no semantic 4px token
   {
@@ -37,14 +37,14 @@ const ft = /* @__PURE__ */ $(
     },
     defaultVariants: { tone: "info", hasTitle: !1 }
   }
-), ht = {
-  success: { icon: Ge, colorVar: "var(--semantic-color-feedback-success)" },
-  danger: { icon: Oe, colorVar: "var(--semantic-color-feedback-error)" },
-  warning: { icon: _e, colorVar: "var(--semantic-color-feedback-warning)" },
+), ft = {
+  success: { icon: Oe, colorVar: "var(--semantic-color-feedback-success)" },
+  danger: { icon: _e, colorVar: "var(--semantic-color-feedback-error)" },
+  warning: { icon: Ge, colorVar: "var(--semantic-color-feedback-warning)" },
   info: { icon: ze, colorVar: "var(--semantic-color-feedback-info)" }
 }, $a = /* @__PURE__ */ Z.forwardRef(function({ tone: e = "info", title: i, children: a }, r) {
-  const { icon: o, colorVar: s } = ht[e], l = !!i, p = j("productive");
-  return /* @__PURE__ */ h(
+  const { icon: o, colorVar: s } = ft[e], l = !!i, p = j("productive");
+  return /* @__PURE__ */ f(
     E.div,
     {
       ref: r,
@@ -52,10 +52,10 @@ const ft = /* @__PURE__ */ $(
       initial: { opacity: 0, y: -4 },
       animate: { opacity: 1, y: 0 },
       transition: { duration: p.duration, ease: p.easing },
-      className: d(ft({ tone: e, hasTitle: l })),
+      className: d(ht({ tone: e, hasTitle: l })),
       children: [
         /* @__PURE__ */ t(
-          I,
+          M,
           {
             icon: o,
             size: "small",
@@ -72,7 +72,7 @@ const ft = /* @__PURE__ */ $(
           // makes the title its own block instead of an inline sibling, with
           // spacing from a semantic token rather than a literal.
           // eslint-disable-next-line tailwindcss/no-arbitrary-value -- semantic subgrid-hairline gap; var()-based, no Tailwind-theme utility exists
-          /* @__PURE__ */ h("span", { className: "flex flex-col gap-[var(--semantic-space-subgrid-hairline)]", children: [
+          /* @__PURE__ */ f("span", { className: "flex flex-col gap-[var(--semantic-space-subgrid-hairline)]", children: [
             /* @__PURE__ */ t(
               "span",
               {
@@ -184,9 +184,9 @@ const ya = /* @__PURE__ */ m.forwardRef(
   md: "size-2",
   lg: "size-2.5"
 };
-let Me = !1;
+let Ae = !1;
 function kt() {
-  Me || mt() || (Me = !0, console.warn(
+  Ae || mt() || (Ae = !0, console.warn(
     "[HDS] Badge `label` only names a `dot` badge and renders no text. Put the text in children: <Badge>Active</Badge>, or add `dot`."
   ));
 }
@@ -226,6 +226,7 @@ const xa = /* @__PURE__ */ m.forwardRef(function({ className: e, tone: i, as: a
   );
 }), St = /* @__PURE__ */ $(
   "rounded-[var(--primitive-radius-4)] p-[var(--semantic-space-surface-padding)]",
+  // tier-ok: 4px primitive radius, matches Alert; no semantic surface-radius token at 4px
   {
     variants: {
       tone: {
@@ -272,7 +273,7 @@ const xa = /* @__PURE__ */ m.forwardRef(function({ className: e, tone: i, as: a
   defaultVariants: { tone: "neutral", mono: !1 }
 }), Sa = /* @__PURE__ */ m.forwardRef(function({ label: e, value: i, tone: a, mono: r, className: o, children: s, ...l }, p) {
   const c = s ?? i;
-  return /* @__PURE__ */ h(
+  return /* @__PURE__ */ f(
     "div",
     {
       ref: p,
@@ -297,7 +298,7 @@ const xa = /* @__PURE__ */ m.forwardRef(function({ className: e, tone: i, as: a
   },
   defaultVariants: { tone: "neutral" }
 }), Na = /* @__PURE__ */ m.forwardRef(function({ label: e, value: i, sub: a, tone: r, className: o, ...s }, l) {
-  return /* @__PURE__ */ h(
+  return /* @__PURE__ */ f(
     "div",
     {
       ref: l,
@@ -324,7 +325,7 @@ const xa = /* @__PURE__ */ m.forwardRef(function({ className: e, tone: i, as: a
   defaultVariants: { tone: "neutral" }
 }), za = /* @__PURE__ */ m.forwardRef(
   function({ tone: e, title: i, notes: a, trailing: r, className: o, ...s }, l) {
-    return /* @__PURE__ */ h(
+    return /* @__PURE__ */ f(
       "div",
       {
         ref: l,
@@ -333,7 +334,7 @@ const xa = /* @__PURE__ */ m.forwardRef(function({ className: e, tone: i, as: a
         ...s,
         children: [
           /* @__PURE__ */ t("span", { "aria-hidden": "true", className: Ct({ tone: e }) }),
-          /* @__PURE__ */ h("div", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ f("div", { className: "min-w-0 flex-1", children: [
             /* @__PURE__ */ t("p", { className: "m-0 hds-type-ui text-foreground", children: i }),
             a == null ? void 0 : a.map((p, c) => /* @__PURE__ */ t("p", { className: "m-0 hds-type-caption text-muted-foreground", children: p }, c))
           ] }),
@@ -351,10 +352,10 @@ const xa = /* @__PURE__ */ m.forwardRef(function({ className: e, tone: i, as: a
       ...i
     }
   );
-}), Pt = /* @__PURE__ */ m.forwardRef(function({ className: e, children: i, hideClose: a = !1, container: r, ...o }, s) {
-  return /* @__PURE__ */ h(Je, { container: r, children: [
+}), Rt = /* @__PURE__ */ m.forwardRef(function({ className: e, children: i, hideClose: a = !1, container: r, ...o }, s) {
+  return /* @__PURE__ */ f(Je, { container: r, children: [
     /* @__PURE__ */ t(Ke, {}),
-    /* @__PURE__ */ h(
+    /* @__PURE__ */ f(
       U.Content,
       {
         ref: s,
@@ -366,7 +367,7 @@ const xa = /* @__PURE__ */ m.forwardRef(function({ className: e, tone: i, as: a
         ...o,
         children: [
           i,
-          !a && /* @__PURE__ */ h(
+          !a && /* @__PURE__ */ f(
             U.Close,
             {
               className: d(
@@ -385,7 +386,7 @@ const xa = /* @__PURE__ */ m.forwardRef(function({ className: e, tone: i, as: a
       }
     )
   ] });
-}), Rt = /* @__PURE__ */ m.forwardRef(function({ className: e, ...i }, a) {
+}), Pt = /* @__PURE__ */ m.forwardRef(function({ className: e, ...i }, a) {
   return /* @__PURE__ */ t("div", { ref: a, className: d("flex flex-col space-y-1.5 text-left", e), ...i });
 }), Lt = /* @__PURE__ */ m.forwardRef(function({ className: e, ...i }, a) {
   return /* @__PURE__ */ t(
@@ -398,7 +399,7 @@ const xa = /* @__PURE__ */ m.forwardRef(function({ className: e, tone: i, as: a
   );
 }), Vt = /* @__PURE__ */ m.forwardRef(function({ className: e, children: i, ...a }, r) {
   return /* @__PURE__ */ t(U.Title, { asChild: !0, children: /* @__PURE__ */ t(Ue, { ref: r, as: "h2", variant: "title", className: e, ...a, children: i }) });
-}), At = /* @__PURE__ */ m.forwardRef(function({ className: e, children: i, ...a }, r) {
+}), It = /* @__PURE__ */ m.forwardRef(function({ className: e, children: i, ...a }, r) {
   return /* @__PURE__ */ t(U.Description, { asChild: !0, children: /* @__PURE__ */ t(
     Ue,
     {
@@ -411,23 +412,23 @@ const xa = /* @__PURE__ */ m.forwardRef(function({ className: e, tone: i, as: a
     }
   ) });
 });
-function It(n) {
+function Mt(n) {
   return /* @__PURE__ */ t(U.Root, { ...n });
 }
-const Ca = /* @__PURE__ */ Object.assign(It, {
+const Ca = /* @__PURE__ */ Object.assign(Mt, {
   Trigger: Dt,
   Portal: Je,
   Overlay: Ke,
-  Content: Pt,
-  Header: Rt,
+  Content: Rt,
+  Header: Pt,
   Footer: Lt,
   Title: Vt,
-  Description: At,
+  Description: It,
   Close: Tt,
   // Set here, not by a later `Dialog.displayName = …` write: a top-level
   // property write is a side effect that keeps the module alive.
   displayName: "Dialog"
-}), Mt = /* @__PURE__ */ $("m-0 shrink-0 border-solid", {
+}), At = /* @__PURE__ */ $("m-0 shrink-0 border-solid", {
   variants: {
     orientation: {
       horizontal: "w-full self-stretch border-t",
@@ -449,7 +450,7 @@ const Ca = /* @__PURE__ */ Object.assign(It, {
         ref: p,
         "aria-orientation": e ?? "horizontal",
         "data-variant": c ?? "default",
-        className: d(Mt({ orientation: e, variant: c }), s),
+        className: d(At({ orientation: e, variant: c }), s),
         style: {
           ...v ? { marginTop: a, marginBottom: a } : { marginLeft: a, marginRight: a },
           ...o
@@ -462,7 +463,7 @@ const Ca = /* @__PURE__ */ Object.assign(It, {
 function Et(n) {
   return /* @__PURE__ */ t(B.Root, { ...n });
 }
-const Ht = B.Trigger, Bt = B.Group, Wt = B.RadioGroup, Ft = B.Sub, Ze = /* @__PURE__ */ ue(B.Portal), Qe = "z-50 min-w-32 overflow-hidden rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-overlay", xe = "relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 hds-type-ui outline-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[highlighted]:ring-2 data-[highlighted]:ring-inset data-[highlighted]:ring-ring data-[disabled]:pointer-events-none data-[disabled]:opacity-50", _t = /* @__PURE__ */ m.forwardRef(function({ className: e, sideOffset: i = 4, container: a, ...r }, o) {
+const Ht = B.Trigger, Bt = B.Group, Wt = B.RadioGroup, Ft = B.Sub, Ze = /* @__PURE__ */ ue(B.Portal), Qe = "z-50 min-w-32 overflow-hidden rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-overlay", xe = "relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 hds-type-ui outline-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[highlighted]:ring-2 data-[highlighted]:ring-inset data-[highlighted]:ring-ring data-[disabled]:pointer-events-none data-[disabled]:opacity-50", Gt = /* @__PURE__ */ m.forwardRef(function({ className: e, sideOffset: i = 4, container: a, ...r }, o) {
   return /* @__PURE__ */ t(Ze, { container: a, children: /* @__PURE__ */ t(
     B.Content,
     {
@@ -473,16 +474,16 @@ const Ht = B.Trigger, Bt = B.Group, Wt = B.RadioGroup, Ft = B.Sub, Ze = /* @__PU
       ...r
     }
   ) });
-}), Ot = /* @__PURE__ */ m.forwardRef(function({ className: e, ...i }, a) {
+}), _t = /* @__PURE__ */ m.forwardRef(function({ className: e, ...i }, a) {
   return /* @__PURE__ */ t(B.Item, { ref: a, className: d(xe, e), ...i });
-}), Gt = /* @__PURE__ */ m.forwardRef(function({ className: e, children: i, ...a }, r) {
-  return /* @__PURE__ */ h(B.CheckboxItem, { ref: r, className: d(xe, "pl-6", e), ...a, children: [
-    /* @__PURE__ */ t("span", { className: "absolute left-2 inline-flex items-center justify-center", children: /* @__PURE__ */ t(B.ItemIndicator, { children: /* @__PURE__ */ t(I, { icon: pe, size: 14, color: "currentColor", "aria-hidden": !0 }) }) }),
+}), Ot = /* @__PURE__ */ m.forwardRef(function({ className: e, children: i, ...a }, r) {
+  return /* @__PURE__ */ f(B.CheckboxItem, { ref: r, className: d(xe, "pl-6", e), ...a, children: [
+    /* @__PURE__ */ t("span", { className: "absolute left-2 inline-flex items-center justify-center", children: /* @__PURE__ */ t(B.ItemIndicator, { children: /* @__PURE__ */ t(M, { icon: pe, size: 14, color: "currentColor", "aria-hidden": !0 }) }) }),
     i
   ] });
 }), jt = /* @__PURE__ */ m.forwardRef(function({ className: e, children: i, ...a }, r) {
-  return /* @__PURE__ */ h(B.RadioItem, { ref: r, className: d(xe, "pl-6", e), ...a, children: [
-    /* @__PURE__ */ t("span", { className: "absolute left-2 inline-flex items-center justify-center", children: /* @__PURE__ */ t(B.ItemIndicator, { children: /* @__PURE__ */ t(I, { icon: ot, size: 6, color: "currentColor", "aria-hidden": !0, className: "fill-current" }) }) }),
+  return /* @__PURE__ */ f(B.RadioItem, { ref: r, className: d(xe, "pl-6", e), ...a, children: [
+    /* @__PURE__ */ t("span", { className: "absolute left-2 inline-flex items-center justify-center", children: /* @__PURE__ */ t(B.ItemIndicator, { children: /* @__PURE__ */ t(M, { icon: ot, size: 6, color: "currentColor", "aria-hidden": !0, className: "fill-current" }) }) }),
     i
   ] });
 }), Ut = /* @__PURE__ */ m.forwardRef(function({ className: e, ...i }, a) {
@@ -504,7 +505,7 @@ const Ht = B.Trigger, Bt = B.Group, Wt = B.RadioGroup, Ft = B.Sub, Ze = /* @__PU
     }
   );
 }), qt = /* @__PURE__ */ m.forwardRef(function({ className: e, children: i, ...a }, r) {
-  return /* @__PURE__ */ h(
+  return /* @__PURE__ */ f(
     B.SubTrigger,
     {
       ref: r,
@@ -512,7 +513,7 @@ const Ht = B.Trigger, Bt = B.Group, Wt = B.RadioGroup, Ft = B.Sub, Ze = /* @__PU
       ...a,
       children: [
         i,
-        /* @__PURE__ */ t(I, { icon: Ce, size: 14, color: "currentColor", "aria-hidden": !0, className: "ml-auto" })
+        /* @__PURE__ */ t(M, { icon: Ce, size: 14, color: "currentColor", "aria-hidden": !0, className: "ml-auto" })
       ]
     }
   );
@@ -520,9 +521,9 @@ const Ht = B.Trigger, Bt = B.Group, Wt = B.RadioGroup, Ft = B.Sub, Ze = /* @__PU
   return /* @__PURE__ */ t(Ze, { container: i, children: /* @__PURE__ */ t(B.SubContent, { ref: r, className: d(Qe, e), ...a }) });
 }), Ta = /* @__PURE__ */ Object.assign(Et, {
   Trigger: Ht,
-  Content: _t,
-  Item: Ot,
-  CheckboxItem: Gt,
+  Content: Gt,
+  Item: _t,
+  CheckboxItem: Ot,
   RadioGroup: Wt,
   RadioItem: jt,
   Label: Ut,
@@ -563,7 +564,7 @@ const Kt = se.Trigger, Zt = se.Anchor, Qt = se.Close, ei = /* @__PURE__ */ ue(se
   // property write is a side effect that keeps the module alive.
   displayName: "Popover"
 }), ii = /* @__PURE__ */ ue(re.Portal), ai = /* @__PURE__ */ m.forwardRef(function({ className: e, sideOffset: i = 6, children: a, container: r, ...o }, s) {
-  return /* @__PURE__ */ t(ii, { container: r, children: /* @__PURE__ */ h(
+  return /* @__PURE__ */ t(ii, { container: r, children: /* @__PURE__ */ f(
     re.Content,
     {
       ref: s,
@@ -602,7 +603,7 @@ function ri({
 }) {
   return /* @__PURE__ */ t(re.Provider, { delayDuration: n, children: /* @__PURE__ */ t(re.Root, { ...i, children: e }) });
 }
-const Pa = /* @__PURE__ */ Object.assign(ri, {
+const Ra = /* @__PURE__ */ Object.assign(ri, {
   Trigger: re.Trigger,
   Content: ai,
   // Set here, not by a later `Tooltip.displayName = …` write: a top-level
@@ -622,7 +623,7 @@ const Pa = /* @__PURE__ */ Object.assign(ri, {
     defaultVariants: { density: "comfortable" }
   }
 );
-function Ra({
+function Pa({
   children: n,
   style: e,
   density: i,
@@ -644,7 +645,7 @@ function Ra({
       children: n
     }
   );
-  return r ? /* @__PURE__ */ h(
+  return r ? /* @__PURE__ */ f(
     "span",
     {
       style: {
@@ -663,7 +664,7 @@ function Ra({
             "aria-label": o ? "Copied" : "Copy",
             onClick: p,
             style: o ? { color: "var(--semantic-color-content-accent)" } : void 0,
-            iconLeft: /* @__PURE__ */ t(I, { icon: o ? pe : st, size: "small" })
+            iconLeft: /* @__PURE__ */ t(M, { icon: o ? pe : st, size: "small" })
           }
         ),
         c
@@ -677,11 +678,11 @@ function oi(n) {
 }
 function La({ href: n, children: e, externalIcon: i = !0 }) {
   const { LinkComponent: a } = Xe(), r = oi(n);
-  return r === "internal" ? /* @__PURE__ */ t(a, { to: n, className: "hds-focus hds-link", children: e }) : r === "plain" ? /* @__PURE__ */ t("a", { href: n, className: "hds-focus hds-link", children: e }) : /* @__PURE__ */ h("a", { href: n, target: "_blank", rel: "noopener noreferrer", className: "hds-focus hds-link", children: [
+  return r === "internal" ? /* @__PURE__ */ t(a, { to: n, className: "hds-focus hds-link", children: e }) : r === "plain" ? /* @__PURE__ */ t("a", { href: n, className: "hds-focus hds-link", children: e }) : /* @__PURE__ */ f("a", { href: n, target: "_blank", rel: "noopener noreferrer", className: "hds-focus hds-link", children: [
     e,
     /* @__PURE__ */ t("span", { className: "sr-only", children: " (opens in new tab)" }),
     i && /* @__PURE__ */ t(
-      I,
+      M,
       {
         icon: lt,
         size: 11,
@@ -811,40 +812,40 @@ const Va = /* @__PURE__ */ m.forwardRef(function({
   loading: x = !1,
   readOnly: S,
   className: N,
-  inputClassName: f,
+  inputClassName: h,
   onChange: k,
-  ...P
+  ...R
 }, H) {
-  const V = m.useId(), C = r ?? V, R = m.useRef(null), L = me(), y = !!u || L === "error", M = x || L === "loading", Y = !!w || L === "disabled", F = y && (b || L === "error") ? `${C}-error` : void 0, _ = s && !F ? `${C}-hint` : void 0, Q = [_, F].filter(Boolean).join(" ") || void 0, [ve, le] = m.useState(() => typeof P.defaultValue == "string" ? P.defaultValue : typeof P.defaultValue == "number" ? String(P.defaultValue) : ""), ee = typeof P.value == "string" ? P.value : typeof P.value == "number" ? String(P.value) : void 0, ge = ee ?? ve, A = pi[i], fe = !!l, ce = !!p, te = Ee(c), q = Ee(v), ie = te || q, de = !di.has(e) && ge.length > 0 && !Y && !M, g = M || ce || de;
-  function z(O) {
-    if (R.current = O, typeof H == "function") {
-      H(O);
+  const V = m.useId(), C = r ?? V, P = m.useRef(null), L = me(), y = !!u || L === "error", A = x || L === "loading", Y = !!w || L === "disabled", F = y && (b || L === "error") ? `${C}-error` : void 0, G = s && !F ? `${C}-hint` : void 0, Q = [G, F].filter(Boolean).join(" ") || void 0, [ve, le] = m.useState(() => typeof R.defaultValue == "string" ? R.defaultValue : typeof R.defaultValue == "number" ? String(R.defaultValue) : ""), ee = typeof R.value == "string" ? R.value : typeof R.value == "number" ? String(R.value) : void 0, ge = ee ?? ve, I = pi[i], he = !!l, ce = !!p, te = Ee(c), q = Ee(v), ie = te || q, de = !di.has(e) && ge.length > 0 && !Y && !A, g = A || ce || de;
+  function z(_) {
+    if (P.current = _, typeof H == "function") {
+      H(_);
       return;
     }
-    H && (H.current = O);
+    H && (H.current = _);
   }
   function W() {
     var Ve;
-    const O = R.current;
-    if (!O) return;
+    const _ = P.current;
+    if (!_) return;
     const we = (Ve = Object.getOwnPropertyDescriptor(
       window.HTMLInputElement.prototype,
       "value"
     )) == null ? void 0 : Ve.set;
-    we == null || we.call(O, ""), O.dispatchEvent(new Event("input", { bubbles: !0 })), O.focus();
+    we == null || we.call(_, ""), _.dispatchEvent(new Event("input", { bubbles: !0 })), _.focus();
   }
-  const J = L || (M ? "loading" : Y ? "disabled" : y ? "error" : ge.length > 0 ? "filled" : "default"), K = fe ? A.leadPad : te ? A.prefixGap : A.restPadL, it = g ? A.trailPad : q ? A.suffixGap : A.restPadR, Re = d(
+  const J = L || (A ? "loading" : Y ? "disabled" : y ? "error" : ge.length > 0 ? "filled" : "default"), K = he ? I.leadPad : te ? I.prefixGap : I.restPadL, it = g ? I.trailPad : q ? I.suffixGap : I.restPadR, Pe = d(
     "flex shrink-0 items-center whitespace-nowrap text-muted-foreground",
-    A.iconWrap
-  ), Le = /* @__PURE__ */ h("div", { className: ie ? "relative min-w-0 flex-1 self-stretch" : "relative w-full", children: [
-    fe && /* @__PURE__ */ t(
+    I.iconWrap
+  ), Le = /* @__PURE__ */ f("div", { className: ie ? "relative min-w-0 flex-1 self-stretch" : "relative w-full", children: [
+    he && /* @__PURE__ */ t(
       "span",
       {
         "aria-hidden": "true",
         className: d(
           "pointer-events-none absolute left-0 flex items-center text-muted-foreground",
-          A.inset,
-          A.iconWrap
+          I.inset,
+          I.iconWrap
         ),
         children: l
       }
@@ -856,9 +857,9 @@ const Va = /* @__PURE__ */ m.forwardRef(function({
         id: C,
         type: e,
         disabled: Y,
-        readOnly: M || S,
+        readOnly: A || S,
         "aria-disabled": Y || void 0,
-        "aria-busy": M || void 0,
+        "aria-busy": A || void 0,
         "aria-describedby": Q,
         "aria-errormessage": F,
         "aria-invalid": y || void 0,
@@ -870,38 +871,38 @@ const Va = /* @__PURE__ */ m.forwardRef(function({
           K,
           it,
           ie && ci,
-          f
+          h
         ),
-        onChange: (O) => {
-          ee === void 0 && le(O.target.value), k == null || k(O);
+        onChange: (_) => {
+          ee === void 0 && le(_.target.value), k == null || k(_);
         },
-        ...P
+        ...R
       }
     ),
-    M && /* @__PURE__ */ t(
+    A && /* @__PURE__ */ t(
       "span",
       {
         "aria-hidden": "true",
         className: d(
           "pointer-events-none absolute right-0 flex items-center text-muted-foreground",
-          A.inset
+          I.inset
         ),
-        children: /* @__PURE__ */ t(ct, { className: d("animate-spin motion-reduce:animate-none", A.iconClass) })
+        children: /* @__PURE__ */ t(ct, { className: d("animate-spin motion-reduce:animate-none", I.iconClass) })
       }
     ),
-    !M && ce && /* @__PURE__ */ t(
+    !A && ce && /* @__PURE__ */ t(
       "span",
       {
         "aria-hidden": "true",
         className: d(
           "pointer-events-none absolute right-0 flex items-center text-muted-foreground",
-          A.inset,
-          A.iconWrap
+          I.inset,
+          I.iconWrap
         ),
         children: p
       }
     ),
-    !M && !ce && de && /* @__PURE__ */ t(
+    !A && !ce && de && /* @__PURE__ */ t(
       "button",
       {
         type: "button",
@@ -909,20 +910,20 @@ const Va = /* @__PURE__ */ m.forwardRef(function({
         "aria-label": e === "search" ? "Clear search" : "Clear input",
         className: d(
           "absolute right-0 flex items-center text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded-sm",
-          A.inset
+          I.inset
         ),
-        children: /* @__PURE__ */ t($e, { className: A.iconClass, "aria-hidden": "true" })
+        children: /* @__PURE__ */ t($e, { className: I.iconClass, "aria-hidden": "true" })
       }
     )
   ] });
-  return /* @__PURE__ */ h("div", { className: d("flex flex-col gap-1.5", ne, N), children: [
+  return /* @__PURE__ */ f("div", { className: d("flex flex-col gap-1.5", ne, N), children: [
     o && /* @__PURE__ */ t("label", { htmlFor: C, className: "hds-type-ui text-foreground", children: o }),
-    ie ? /* @__PURE__ */ h("div", { className: li({ size: i, textStyle: a, invalid: y }), children: [
-      te && /* @__PURE__ */ t("span", { className: d(Re, A.prefixPad), children: c }),
+    ie ? /* @__PURE__ */ f("div", { className: li({ size: i, textStyle: a, invalid: y }), children: [
+      te && /* @__PURE__ */ t("span", { className: d(Pe, I.prefixPad), children: c }),
       Le,
-      q && /* @__PURE__ */ t("span", { className: d(Re, A.suffixPad), children: v })
+      q && /* @__PURE__ */ t("span", { className: d(Pe, I.suffixPad), children: v })
     ] }) : Le,
-    _ && /* @__PURE__ */ t("span", { id: _, className: "hds-type-caption text-muted-foreground", children: s }),
+    G && /* @__PURE__ */ t("span", { id: G, className: "hds-type-caption text-muted-foreground", children: s }),
     y && (b || L === "error") && /* @__PURE__ */ t("span", { id: F, role: "alert", className: "hds-type-caption text-destructive", children: b || "Field error" })
   ] });
 }), ui = /* @__PURE__ */ $(
@@ -944,7 +945,7 @@ const Va = /* @__PURE__ */ m.forwardRef(function({
       invalid: !1
     }
   }
-), Aa = /* @__PURE__ */ m.forwardRef(
+), Ia = /* @__PURE__ */ m.forwardRef(
   function({
     id: e,
     label: i,
@@ -958,8 +959,8 @@ const Va = /* @__PURE__ */ m.forwardRef(function({
     textareaClassName: v,
     ...u
   }, b) {
-    const w = m.useId(), x = e ?? w, S = !!r, N = S && o ? `${x}-error` : void 0, f = a && !N ? `${x}-hint` : void 0, k = [f, N].filter(Boolean).join(" ") || void 0, P = s ? "disabled" : S ? "error" : "default";
-    return /* @__PURE__ */ h("div", { className: d("flex flex-col gap-1.5", ne, c), children: [
+    const w = m.useId(), x = e ?? w, S = !!r, N = S && o ? `${x}-error` : void 0, h = a && !N ? `${x}-hint` : void 0, k = [h, N].filter(Boolean).join(" ") || void 0, R = s ? "disabled" : S ? "error" : "default";
+    return /* @__PURE__ */ f("div", { className: d("flex flex-col gap-1.5", ne, c), children: [
       i && /* @__PURE__ */ t("label", { htmlFor: x, className: "hds-type-ui text-foreground", children: i }),
       /* @__PURE__ */ t(
         "textarea",
@@ -972,12 +973,12 @@ const Va = /* @__PURE__ */ m.forwardRef(function({
           "aria-describedby": k,
           "aria-errormessage": N,
           "aria-invalid": S || void 0,
-          "data-state": P,
+          "data-state": R,
           className: d(ui({ resize: l, invalid: S }), v),
           ...u
         }
       ),
-      f && /* @__PURE__ */ t("span", { id: f, className: "hds-type-caption text-muted-foreground", children: a }),
+      h && /* @__PURE__ */ t("span", { id: h, className: "hds-type-caption text-muted-foreground", children: a }),
       S && o && /* @__PURE__ */ t("span", { id: N, role: "alert", className: "hds-type-caption text-destructive", children: o })
     ] });
   }
@@ -1095,10 +1096,10 @@ const mi = /* @__PURE__ */ $(
     defaultVariants: { state: "rest", on: !1 }
   }
 );
-function fi(n, e) {
+function hi(n, e) {
   typeof n == "function" ? n(e) : n && (n.current = e);
 }
-const Ia = /* @__PURE__ */ oe(
+const Ma = /* @__PURE__ */ oe(
   function({
     label: e,
     checked: i,
@@ -1110,19 +1111,19 @@ const Ia = /* @__PURE__ */ oe(
     disabled: p,
     ...c
   }, v) {
-    const u = Se(null), b = me(), { visualState: w, isHover: x, isFocused: S, isPressed: N, isDisabled: f, handlers: k } = Te({
+    const u = Se(null), b = me(), { visualState: w, isHover: x, isFocused: S, isPressed: N, isDisabled: h, handlers: k } = Te({
       disabled: p,
       frozenState: b
     });
     rt(() => {
       u.current && (u.current.indeterminate = r);
     }, [r]);
-    const P = i || r, H = f ? "var(--semantic-color-content-disabled)" : "var(--semantic-color-content-onAccent)", V = j("productive");
-    return /* @__PURE__ */ h(
+    const R = i || r, H = h ? "var(--semantic-color-content-disabled)" : "var(--semantic-color-content-onAccent)", V = j("productive");
+    return /* @__PURE__ */ f(
       E.label,
       {
         tabIndex: -1,
-        whileTap: f ? void 0 : { scale: 0.99 },
+        whileTap: h ? void 0 : { scale: 0.99 },
         transition: { duration: V.duration, ease: V.easing },
         onMouseEnter: k.onMouseEnter,
         onMouseLeave: k.onMouseLeave,
@@ -1135,11 +1136,11 @@ const Ia = /* @__PURE__ */ oe(
             "input",
             {
               ref: (C) => {
-                u.current = C, fi(v, C);
+                u.current = C, hi(v, C);
               },
               type: "checkbox",
               checked: i,
-              disabled: f,
+              disabled: h,
               "aria-checked": r ? "mixed" : i,
               onChange: (C) => a(C.target.checked),
               onFocus: (C) => {
@@ -1164,11 +1165,11 @@ const Ia = /* @__PURE__ */ oe(
                 duration: V.duration,
                 ease: V.easing
               },
-              className: gi({ state: w, on: P }),
+              className: gi({ state: w, on: R }),
               style: {
                 transition: `background-color ${V.duration}s ease, border-color ${V.duration}s ease`
               },
-              children: r ? /* @__PURE__ */ t(I, { icon: dt, size: 14, color: H, "aria-hidden": !0 }) : i ? /* @__PURE__ */ t(I, { icon: pe, size: 14, color: H, "aria-hidden": !0 }) : null
+              children: r ? /* @__PURE__ */ t(M, { icon: dt, size: 14, color: H, "aria-hidden": !0 }) : i ? /* @__PURE__ */ t(M, { icon: pe, size: 14, color: H, "aria-hidden": !0 }) : null
             }
           ),
           /* @__PURE__ */ t(
@@ -1182,7 +1183,7 @@ const Ia = /* @__PURE__ */ oe(
               },
               style: {
                 ...D.typeStyles.ui,
-                color: f ? "var(--semantic-color-content-disabled)" : "var(--semantic-color-content-primary)"
+                color: h ? "var(--semantic-color-content-disabled)" : "var(--semantic-color-content-primary)"
               },
               children: e
             }
@@ -1191,7 +1192,7 @@ const Ia = /* @__PURE__ */ oe(
       }
     );
   }
-), hi = /* @__PURE__ */ $("absolute inset-0 m-0 opacity-0", {
+), fi = /* @__PURE__ */ $("absolute inset-0 m-0 opacity-0", {
   variants: {
     state: {
       rest: "cursor-pointer",
@@ -1274,7 +1275,7 @@ const Ia = /* @__PURE__ */ oe(
     },
     defaultVariants: { disabled: !1 }
   }
-), Ma = /* @__PURE__ */ oe(function({
+), Aa = /* @__PURE__ */ oe(function({
   label: e,
   checked: i,
   onChange: a,
@@ -1291,11 +1292,11 @@ const Ia = /* @__PURE__ */ oe(
   onBlur: x,
   ...S
 }, N) {
-  const f = me(), { visualState: k, isHover: P, isFocused: H, isPressed: V, isDisabled: C, handlers: R } = Te({
+  const h = me(), { visualState: k, isHover: R, isFocused: H, isPressed: V, isDisabled: C, handlers: P } = Te({
     disabled: r,
-    frozenState: f
+    frozenState: h
   }), T = j("productive"), L = j("expressive");
-  return /* @__PURE__ */ h(
+  return /* @__PURE__ */ f(
     E.label,
     {
       tabIndex: -1,
@@ -1312,30 +1313,30 @@ const Ia = /* @__PURE__ */ oe(
             disabled: C,
             onChange: (y) => a(y.target.checked),
             onMouseEnter: (y) => {
-              R.onMouseEnter(), l == null || l(y);
+              P.onMouseEnter(), l == null || l(y);
             },
             onMouseLeave: (y) => {
-              R.onMouseLeave(), p == null || p(y);
+              P.onMouseLeave(), p == null || p(y);
             },
             onPointerDown: (y) => {
-              R.onPointerDown(), c == null || c(y);
+              P.onPointerDown(), c == null || c(y);
             },
             onPointerUp: (y) => {
-              R.onPointerUp(), v == null || v(y);
+              P.onPointerUp(), v == null || v(y);
             },
             onPointerCancel: (y) => {
-              R.onPointerCancel(), u == null || u(y);
+              P.onPointerCancel(), u == null || u(y);
             },
             onFocus: (y) => {
-              R.onFocus(y.currentTarget), b == null || b(y);
+              P.onFocus(y.currentTarget), b == null || b(y);
             },
             onKeyDown: (y) => {
-              R.onKeyDown(y.currentTarget), w == null || w(y);
+              P.onKeyDown(y.currentTarget), w == null || w(y);
             },
             onBlur: (y) => {
-              R.onBlur(), x == null || x(y);
+              P.onBlur(), x == null || x(y);
             },
-            className: d("hds-focus", hi({ state: k })),
+            className: d("hds-focus", fi({ state: k })),
             ...S
           }
         ),
@@ -1345,7 +1346,7 @@ const Ia = /* @__PURE__ */ oe(
             "aria-hidden": "true",
             className: $i({ state: k, on: i }),
             animate: {
-              scale: V ? 0.94 : P || H ? 1.04 : 1
+              scale: V ? 0.94 : R || H ? 1.04 : 1
             },
             transition: {
               duration: T.duration,
@@ -1393,8 +1394,8 @@ const Ia = /* @__PURE__ */ oe(
   const [p, c] = X(!1), v = a - i, b = `${(v <= 0 ? 0 : Math.min(Math.max((o - i) / v, 0), 1)) * 100}%`, w = j("productive"), x = j("expressive");
   return (
     // eslint-disable-next-line tailwindcss/no-arbitrary-value -- token-driven gap; var()-based, no Tailwind-theme utility exists
-    /* @__PURE__ */ h("div", { className: `flex flex-col gap-[var(--semantic-space-scale-xs)] ${ne}`, children: [
-      /* @__PURE__ */ h("div", { className: "flex justify-between items-baseline gap-[var(--semantic-space-scale-xs)]", children: [
+    /* @__PURE__ */ f("div", { className: `flex flex-col gap-[var(--semantic-space-scale-xs)] ${ne}`, children: [
+      /* @__PURE__ */ f("div", { className: "flex justify-between items-baseline gap-[var(--semantic-space-scale-xs)]", children: [
         /* @__PURE__ */ t(
           "label",
           {
@@ -1421,7 +1422,7 @@ const Ia = /* @__PURE__ */ oe(
           o
         )
       ] }),
-      /* @__PURE__ */ h(E.div, { className: "relative h-[var(--semantic-size-control-md)] grid items-center", children: [
+      /* @__PURE__ */ f(E.div, { className: "relative h-[var(--semantic-size-control-md)] grid items-center", children: [
         /* @__PURE__ */ t(
           "div",
           {
@@ -1464,7 +1465,7 @@ const Ia = /* @__PURE__ */ oe(
       ] })
     ] })
   );
-}), Pe = (n) => parseFloat(n), xi = Pe(De.primitive.size[40]), wi = Pe(De.primitive.size[20]), et = Pe(De.primitive.size[16]), ki = (wi - et) / 2, Si = xi - et - ki * 2, Ni = /* @__PURE__ */ $(
+}), Re = (n) => parseFloat(n), xi = Re(De.primitive.size[40]), wi = Re(De.primitive.size[20]), et = Re(De.primitive.size[16]), ki = (wi - et) / 2, Si = xi - et - ki * 2, Ni = /* @__PURE__ */ $(
   "relative inline-flex items-center gap-[var(--semantic-space-subgrid-gap)] rounded-md py-[var(--semantic-space-subgrid-gap)] outline-offset-2 select-none hds-touch-row",
   {
     variants: {
@@ -1532,13 +1533,13 @@ const Ia = /* @__PURE__ */ oe(
   const v = me(), { visualState: u, isHover: b, isFocused: w, isPressed: x, isDisabled: S, handlers: N } = Te({
     disabled: l,
     frozenState: v
-  }), f = j("productive");
-  return /* @__PURE__ */ h(
+  }), h = j("productive");
+  return /* @__PURE__ */ f(
     E.label,
     {
       tabIndex: -1,
       whileTap: S ? void 0 : { scale: 0.99 },
-      transition: { duration: f.duration, ease: f.easing },
+      transition: { duration: h.duration, ease: h.easing },
       onMouseEnter: N.onMouseEnter,
       onMouseLeave: N.onMouseLeave,
       onPointerDown: N.onPointerDown,
@@ -1579,11 +1580,11 @@ const Ia = /* @__PURE__ */ oe(
               scale: x ? 0.96 : b || w ? 1.04 : 1
             },
             transition: {
-              duration: f.duration,
-              ease: f.easing
+              duration: h.duration,
+              ease: h.easing
             },
             style: {
-              transition: `background-color ${f.duration}s ease, border-color ${f.duration}s ease`
+              transition: `background-color ${h.duration}s ease, border-color ${h.duration}s ease`
             },
             className: Ci({ on: i, disabled: S }),
             children: /* @__PURE__ */ t(
@@ -1591,8 +1592,8 @@ const Ia = /* @__PURE__ */ oe(
               {
                 animate: { x: i ? Si : 0 },
                 transition: {
-                  duration: f.duration,
-                  ease: f.easing
+                  duration: h.duration,
+                  ease: h.easing
                 },
                 className: Di()
               }
@@ -1607,8 +1608,8 @@ const Ia = /* @__PURE__ */ oe(
               x: x ? D.space.px1 : 0
             },
             transition: {
-              duration: f.duration,
-              ease: f.easing
+              duration: h.duration,
+              ease: h.easing
             },
             style: {
               ...D.typeStyles.ui,
@@ -1638,7 +1639,7 @@ const Ia = /* @__PURE__ */ oe(
   success: { bar: "bg-feedback-success", ring: "text-feedback-success" },
   warning: { bar: "bg-feedback-warning", ring: "text-feedback-warning" },
   info: { bar: "bg-feedback-info", ring: "text-feedback-info" }
-}, Pi = {
+}, Ri = {
   sm: { box: 16, stroke: 2 },
   md: { box: 24, stroke: 3 },
   lg: { box: 32, stroke: 3 }
@@ -1666,7 +1667,7 @@ const Ia = /* @__PURE__ */ oe(
       "data-tone": s
     };
     if (o === "circular") {
-      const { box: x, stroke: S } = Pi[i ?? "md"], N = (x - S) / 2, f = 2 * Math.PI * N, k = f * (v ? 0.75 : 1 - b / 100);
+      const { box: x, stroke: S } = Ri[i ?? "md"], N = (x - S) / 2, h = 2 * Math.PI * N, k = h * (v ? 0.75 : 1 - b / 100);
       return /* @__PURE__ */ t(
         "span",
         {
@@ -1674,7 +1675,7 @@ const Ia = /* @__PURE__ */ oe(
           ...w,
           className: d("inline-flex", Be[s].ring, e),
           ...p,
-          children: /* @__PURE__ */ h(
+          children: /* @__PURE__ */ f(
             "svg",
             {
               width: x,
@@ -1702,7 +1703,7 @@ const Ia = /* @__PURE__ */ oe(
                     r: N,
                     strokeWidth: S,
                     strokeLinecap: "round",
-                    strokeDasharray: f,
+                    strokeDasharray: h,
                     strokeDashoffset: k,
                     className: "stroke-current",
                     transform: `rotate(-90 ${x / 2} ${x / 2})`
@@ -1735,7 +1736,7 @@ const Ia = /* @__PURE__ */ oe(
       }
     );
   }
-), Ri = /* @__PURE__ */ $("hds-skeleton block", {
+), Pi = /* @__PURE__ */ $("hds-skeleton block", {
   variants: {
     variant: {
       text: "rounded",
@@ -1753,7 +1754,7 @@ const Ia = /* @__PURE__ */ oe(
         ref: l,
         "aria-hidden": "true",
         "data-variant": i,
-        className: d(Ri({ variant: i }), e),
+        className: d(Pi({ variant: i }), e),
         style: { width: a, height: p, ...o },
         ...s
       }
@@ -1796,7 +1797,7 @@ const Ia = /* @__PURE__ */ oe(
     },
     defaultVariants: { fullWidth: !1 }
   }
-), Ai = /* @__PURE__ */ $(
+), Ii = /* @__PURE__ */ $(
   "flex max-w-full items-stretch gap-[var(--semantic-space-subgrid-gap)] overflow-x-auto overflow-y-hidden rounded-lg border border-solid border-[var(--semantic-color-border-default)] [scrollbar-width:thin]",
   {
     variants: {
@@ -1811,7 +1812,7 @@ const Ia = /* @__PURE__ */ oe(
     },
     defaultVariants: { variant: "primary", fullWidth: !1 }
   }
-), Ii = /* @__PURE__ */ $(
+), Mi = /* @__PURE__ */ $(
   "relative m-0 flex flex-col items-center justify-center gap-[var(--semantic-space-subgrid-hairline)] rounded-md border-0 bg-transparent py-[var(--semantic-space-subgrid-gap)] text-center transition-[color,outline-color,transform] duration-[var(--hds-motion-productive-duration)] ease-[var(--hds-motion-productive-easing)]",
   {
     variants: {
@@ -1889,7 +1890,7 @@ const Ia = /* @__PURE__ */ oe(
       disabled: !1
     }
   }
-), Mi = /* @__PURE__ */ $(
+), Ai = /* @__PURE__ */ $(
   "pointer-events-none absolute inset-0 z-0 rounded-md bg-transparent shadow-none",
   {
     variants: {
@@ -2008,7 +2009,7 @@ const Ia = /* @__PURE__ */ oe(
 ), Bi = /* @__PURE__ */ $(
   // tier-ok: primitive.zIndex.10, reached as hds.zIndex.focus, has no semantic alias — same primitive ref the pre-Tailwind inline style used
   "relative z-[var(--primitive-zIndex-10)] max-w-[60ch] hds-type-ui text-current"
-), _a = /* @__PURE__ */ oe(
+), Ga = /* @__PURE__ */ oe(
   function({
     label: e,
     "aria-label": i,
@@ -2021,8 +2022,8 @@ const Ia = /* @__PURE__ */ oe(
     railPadding: c,
     segmentPaddingX: v
   }, u) {
-    const [b, w] = X(null), [x, S] = X(null), f = me(), k = f === "disabled", P = j("productive"), H = s === "sm", V = l === "secondary", C = i ?? e, R = v ?? (H ? D.semantic.space.scale.xs : D.semantic.space.layout.gap);
-    return /* @__PURE__ */ h("div", { ref: u, className: Vi({ fullWidth: p }), children: [
+    const [b, w] = X(null), [x, S] = X(null), h = me(), k = h === "disabled", R = j("productive"), H = s === "sm", V = l === "secondary", C = i ?? e, P = v ?? (H ? D.semantic.space.scale.xs : D.semantic.space.layout.gap);
+    return /* @__PURE__ */ f("div", { ref: u, className: Vi({ fullWidth: p }), children: [
       e && // inline-ok: pb here mirrors the dynamic-padding cases below — token value, not a magic number, kept inline to match the group's spacing rhythm without a one-off arbitrary class
       /* @__PURE__ */ t(
         "span",
@@ -2033,7 +2034,7 @@ const Ia = /* @__PURE__ */ oe(
         }
       ),
       /* @__PURE__ */ t(
-        Ie.Root,
+        Me.Root,
         {
           type: "single",
           role: "radiogroup",
@@ -2043,47 +2044,47 @@ const Ia = /* @__PURE__ */ oe(
             T && !k && o(T);
           },
           disabled: k,
-          className: Ai({ variant: l, fullWidth: p }),
+          className: Ii({ variant: l, fullWidth: p }),
           style: { padding: c ?? "4px" },
           children: a.map((T) => {
-            const L = T.value === r, y = f ? f === "hover" && L : b === T.value, M = f === "pressed" && L, Y = f ? f === "focused" && L : x === T.value, F = k, _ = M ? "pressed" : y ? "hover" : "rest", Q = !!f && Y;
+            const L = T.value === r, y = h ? h === "hover" && L : b === T.value, A = h === "pressed" && L, Y = h ? h === "focused" && L : x === T.value, F = k, G = A ? "pressed" : y ? "hover" : "rest", Q = !!h && Y;
             return /* @__PURE__ */ t(
-              Ie.Item,
+              Me.Item,
               {
                 asChild: !0,
                 value: T.value,
                 disabled: F,
-                children: /* @__PURE__ */ h(
+                children: /* @__PURE__ */ f(
                   E.button,
                   {
                     type: "button",
-                    onHoverStart: () => !f && w(T.value),
-                    onHoverEnd: () => !f && w(null),
-                    onFocus: () => !f && S(T.value),
-                    onBlur: () => !f && S(null),
+                    onHoverStart: () => !h && w(T.value),
+                    onHoverEnd: () => !h && w(null),
+                    onFocus: () => !h && S(T.value),
+                    onBlur: () => !h && S(null),
                     animate: V ? {
-                      y: L ? 0 : M ? 1 : 0,
+                      y: L ? 0 : A ? 1 : 0,
                       scale: L ? 1 : y ? 0.995 : 1
                     } : void 0,
                     transition: V ? {
-                      duration: P.duration,
-                      ease: P.easing
+                      duration: R.duration,
+                      ease: R.easing
                     } : void 0,
                     className: d(
                       "hds-focus",
-                      Ii({
+                      Mi({
                         size: s,
                         fullWidth: p,
                         variant: l,
                         active: L,
-                        interaction: _,
+                        interaction: G,
                         disabled: F
                       }),
                       Q && Hi({ variant: l })
                     ),
                     style: {
-                      paddingLeft: R,
-                      paddingRight: R
+                      paddingLeft: P,
+                      paddingRight: P
                     },
                     children: [
                       /* @__PURE__ */ t(
@@ -2091,10 +2092,10 @@ const Ia = /* @__PURE__ */ oe(
                         {
                           "aria-hidden": "true",
                           className: d(
-                            Mi({
+                            Ai({
                               variant: l,
                               active: L,
-                              interaction: _,
+                              interaction: G,
                               disabled: F
                             })
                           )
@@ -2108,7 +2109,7 @@ const Ia = /* @__PURE__ */ oe(
                             Ei({
                               variant: l,
                               active: L,
-                              interaction: _,
+                              interaction: G,
                               disabled: F
                             })
                           ),
@@ -2126,7 +2127,7 @@ const Ia = /* @__PURE__ */ oe(
       )
     ] });
   }
-), Wi = /* @__PURE__ */ ue(G.Portal), Oa = /* @__PURE__ */ oe(function({
+), Wi = /* @__PURE__ */ ue(O.Portal), _a = /* @__PURE__ */ oe(function({
   label: e,
   showLabel: i = !0,
   options: a,
@@ -2137,8 +2138,8 @@ const Ia = /* @__PURE__ */ oe(
   "aria-describedby": p,
   "aria-invalid": c
 }, v) {
-  const u = a.find((f) => f.value === r), b = (u == null ? void 0 : u.label) ?? "", w = Ne(), x = Ne(), S = l ?? x, N = i && !!e;
-  return /* @__PURE__ */ h("div", { className: d("flex flex-col", ne), children: [
+  const u = a.find((h) => h.value === r), b = (u == null ? void 0 : u.label) ?? "", w = Ne(), x = Ne(), S = l ?? x, N = i && !!e;
+  return /* @__PURE__ */ f("div", { className: d("flex flex-col", ne), children: [
     i ? /* @__PURE__ */ t(
       "label",
       {
@@ -2149,9 +2150,9 @@ const Ia = /* @__PURE__ */ oe(
         children: e
       }
     ) : null,
-    /* @__PURE__ */ h(G.Root, { value: r, onValueChange: o, children: [
-      /* @__PURE__ */ h(
-        G.Trigger,
+    /* @__PURE__ */ f(O.Root, { value: r, onValueChange: o, children: [
+      /* @__PURE__ */ f(
+        O.Trigger,
         {
           ref: v,
           id: S,
@@ -2166,13 +2167,13 @@ const Ia = /* @__PURE__ */ oe(
             "hover:border-ring data-[state=open]:border-ring"
           ),
           children: [
-            /* @__PURE__ */ t(G.Value, {}),
-            /* @__PURE__ */ t(G.Icon, { className: "flex shrink-0 text-muted-foreground", children: /* @__PURE__ */ t(I, { icon: je, size: "small", color: "currentColor" }) })
+            /* @__PURE__ */ t(O.Value, {}),
+            /* @__PURE__ */ t(O.Icon, { className: "flex shrink-0 text-muted-foreground", children: /* @__PURE__ */ t(M, { icon: je, size: "small", color: "currentColor" }) })
           ]
         }
       ),
       /* @__PURE__ */ t(Wi, { container: s, children: /* @__PURE__ */ t(
-        G.Content,
+        O.Content,
         {
           position: "popper",
           sideOffset: 4,
@@ -2186,21 +2187,21 @@ const Ia = /* @__PURE__ */ oe(
             "z-50 overflow-hidden rounded-md border",
             "border-border bg-popover text-popover-foreground shadow-md"
           ),
-          children: /* @__PURE__ */ t(G.Viewport, { className: "p-1", children: a.map((f) => /* @__PURE__ */ h(
-            G.Item,
+          children: /* @__PURE__ */ t(O.Viewport, { className: "p-1", children: a.map((h) => /* @__PURE__ */ f(
+            O.Item,
             {
-              value: f.value,
+              value: h.value,
               className: d(
                 "relative flex w-full cursor-pointer select-none items-center justify-between gap-2 rounded-sm px-2 py-1.5 hds-type-ui outline-none",
                 "text-foreground data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground",
                 "data-[highlighted]:ring-2 data-[highlighted]:ring-inset data-[highlighted]:ring-ring"
               ),
               children: [
-                /* @__PURE__ */ t(G.ItemText, { children: f.label }),
-                /* @__PURE__ */ t(G.ItemIndicator, { className: "flex shrink-0", children: /* @__PURE__ */ t(I, { icon: pe, size: "small", color: "currentColor" }) })
+                /* @__PURE__ */ t(O.ItemText, { children: h.label }),
+                /* @__PURE__ */ t(O.ItemIndicator, { className: "flex shrink-0", children: /* @__PURE__ */ t(M, { icon: pe, size: "small", color: "currentColor" }) })
               ]
             },
-            f.value
+            h.value
           )) })
         }
       ) })
@@ -2212,7 +2213,7 @@ const Ia = /* @__PURE__ */ oe(
   // yet for dimensional primitives (see hds#186 follow-up).
   // tier-ok: regulatory a11y constant, not a design decision. hds#186
   "group inline-flex min-w-[var(--primitive-size-interactive-min)] cursor-pointer select-none items-center justify-center border-0 bg-transparent p-0 text-inherit transition-colors disabled:pointer-events-none disabled:cursor-not-allowed disabled:text-[var(--semantic-color-content-disabled)]"
-), _i = /* @__PURE__ */ $(
+), Gi = /* @__PURE__ */ $(
   "pointer-events-none box-border inline-flex min-h-[var(--component-tag-minHeight)] min-w-[var(--component-tag-minWidth)] items-center justify-center whitespace-nowrap rounded-[var(--component-tag-radius)] border border-solid px-[var(--component-tag-paddingX)] py-[var(--component-tag-paddingY)] hds-type-caption transition-colors",
   {
     variants: {
@@ -2223,7 +2224,7 @@ const Ia = /* @__PURE__ */ oe(
     },
     defaultVariants: { selected: !1 }
   }
-), Ga = /* @__PURE__ */ m.forwardRef(function({ children: e, active: i = !1, className: a, type: r = "button", ...o }, s) {
+), Oa = /* @__PURE__ */ m.forwardRef(function({ children: e, active: i = !1, className: a, type: r = "button", ...o }, s) {
   return /* @__PURE__ */ t(
     "button",
     {
@@ -2233,10 +2234,10 @@ const Ia = /* @__PURE__ */ oe(
       "data-active": i ? "true" : void 0,
       className: d("hds-focus", Fi(), a),
       ...o,
-      children: /* @__PURE__ */ t("span", { className: _i({ selected: i }), children: e })
+      children: /* @__PURE__ */ t("span", { className: Gi({ selected: i }), children: e })
     }
   );
-}), Oi = /* @__PURE__ */ $(
+}), _i = /* @__PURE__ */ $(
   "inline-flex items-center justify-center whitespace-nowrap align-middle select-none rounded border border-border bg-muted text-muted-foreground",
   {
     variants: {
@@ -2254,7 +2255,7 @@ const Ia = /* @__PURE__ */ oe(
     {
       ref: o,
       "data-size": i ?? "md",
-      className: d(Oi({ size: i }), e),
+      className: d(_i({ size: i }), e),
       ...r,
       children: a
     }
@@ -2263,7 +2264,7 @@ const Ia = /* @__PURE__ */ oe(
 function We(n) {
   return n instanceof Date ? n : new Date(n);
 }
-const Gi = [
+const Oi = [
   ["year", 3600 * 24 * 365],
   ["month", 3600 * 24 * 30],
   ["week", 3600 * 24 * 7],
@@ -2274,7 +2275,7 @@ const Gi = [
 ];
 function ji(n, e, i) {
   const a = new Intl.RelativeTimeFormat(i, { numeric: "auto" }), r = Math.round((n.getTime() - e.getTime()) / 1e3), o = Math.abs(r);
-  for (const [s, l] of Gi)
+  for (const [s, l] of Oi)
     if (o >= l || s === "second")
       return a.format(Math.round(r / l), s);
   return a.format(0, "second");
@@ -2310,7 +2311,7 @@ const Ui = {
   defaultVariants: { size: "md" }
 }), Ya = /* @__PURE__ */ m.forwardRef(
   function({ className: e, size: i, attribution: a, children: r, ...o }, s) {
-    return /* @__PURE__ */ h(
+    return /* @__PURE__ */ f(
       "blockquote",
       {
         ref: s,
@@ -2343,7 +2344,7 @@ const Ui = {
 ), Xa = /* @__PURE__ */ m.forwardRef(
   function({ className: e, children: i, max: a, size: r, ...o }, s) {
     const l = r ?? "md", p = m.Children.toArray(i).filter(m.isValidElement), c = a && a > 0 ? a : p.length, v = p.slice(0, c), u = p.length - v.length;
-    return /* @__PURE__ */ h(
+    return /* @__PURE__ */ f(
       "div",
       {
         ref: s,
@@ -2363,7 +2364,7 @@ const Ui = {
               )
             })
           ),
-          u > 0 && /* @__PURE__ */ h("span", { "aria-label": `+${u} more`, className: qi({ size: r }), children: [
+          u > 0 && /* @__PURE__ */ f("span", { "aria-label": `+${u} more`, className: qi({ size: r }), children: [
             "+",
             u
           ] })
@@ -2382,7 +2383,7 @@ const Ui = {
   defaultVariants: { orientation: "vertical" }
 }), Ja = /* @__PURE__ */ m.forwardRef(
   function({ className: e, items: i, orientation: a = "vertical", variant: r = "plain", footer: o, ...s }, l) {
-    return r === "divided" ? /* @__PURE__ */ h(
+    return r === "divided" ? /* @__PURE__ */ f(
       "dl",
       {
         ref: l,
@@ -2394,7 +2395,7 @@ const Ui = {
         },
         ...s,
         children: [
-          i.map((p, c) => /* @__PURE__ */ h(
+          i.map((p, c) => /* @__PURE__ */ f(
             "div",
             {
               className: "flex flex-col gap-2 p-5",
@@ -2422,7 +2423,7 @@ const Ui = {
             },
             c
           )),
-          o != null && /* @__PURE__ */ h(
+          o != null && /* @__PURE__ */ f(
             "div",
             {
               className: "p-5 hds-type-ui",
@@ -2446,7 +2447,7 @@ const Ui = {
         "data-orientation": a,
         className: d(Fe({ orientation: a }), e),
         ...s,
-        children: i.map((p, c) => /* @__PURE__ */ h(m.Fragment, { children: [
+        children: i.map((p, c) => /* @__PURE__ */ f(m.Fragment, { children: [
           /* @__PURE__ */ t("dt", { className: "hds-type-ui text-muted-foreground", children: p.term }),
           /* @__PURE__ */ t("dd", { className: d("m-0 text-foreground"), children: p.description })
         ] }, c))
@@ -2458,7 +2459,7 @@ const Ui = {
         "data-orientation": a,
         className: d(Fe({ orientation: a }), e),
         ...s,
-        children: i.map((p, c) => /* @__PURE__ */ h("div", { className: "flex flex-col gap-0.5", children: [
+        children: i.map((p, c) => /* @__PURE__ */ f("div", { className: "flex flex-col gap-0.5", children: [
           /* @__PURE__ */ t("dt", { className: "hds-type-ui text-muted-foreground", children: p.term }),
           /* @__PURE__ */ t("dd", { className: d("m-0 text-foreground"), children: p.description })
         ] }, c))
@@ -2477,7 +2478,7 @@ const Ui = {
     as: p = "div"
   }, c) {
     const [v, u] = e;
-    return /* @__PURE__ */ h(
+    return /* @__PURE__ */ f(
       p,
       {
         ref: c,
@@ -2607,7 +2608,7 @@ const Xi = /* @__PURE__ */ $("", {
     const { LinkComponent: s } = Xe();
     return /* @__PURE__ */ t("nav", { ref: o, "aria-label": i, className: d("w-full", a), ...r, children: /* @__PURE__ */ t("ol", { className: "flex flex-wrap items-center gap-2", children: e.map((l, p) => {
       const c = p === e.length - 1, v = !!l.href && !c;
-      return /* @__PURE__ */ h("li", { className: "inline-flex items-center gap-2", children: [
+      return /* @__PURE__ */ f("li", { className: "inline-flex items-center gap-2", children: [
         v ? /* @__PURE__ */ t(
           s,
           {
@@ -2626,7 +2627,7 @@ const Xi = /* @__PURE__ */ $("", {
           }
         ),
         !c && /* @__PURE__ */ t(
-          I,
+          M,
           {
             icon: Ce,
             size: "small",
@@ -2666,12 +2667,12 @@ const nr = /* @__PURE__ */ m.forwardRef(
     ...u
   }, b) {
     var de;
-    const [w, x] = m.useState(!1), [S, N] = m.useState(""), [f, k] = m.useState(0), P = m.useId(), H = `${P}-list`, V = o || i, C = u.multiple ? u.value : u.value === null ? [] : [u.value], R = u.multiple ? C.flatMap((g) => e.find((z) => z.value === g) ?? []) : [], T = R.length > 0 ? `${R.length} selected` : void 0, L = u.multiple ? T : (de = e.find((g) => g.value === u.value)) == null ? void 0 : de.label, y = m.useMemo(() => {
+    const [w, x] = m.useState(!1), [S, N] = m.useState(""), [h, k] = m.useState(0), R = m.useId(), H = `${R}-list`, V = o || i, C = u.multiple ? u.value : u.value === null ? [] : [u.value], P = u.multiple ? C.flatMap((g) => e.find((z) => z.value === g) ?? []) : [], T = P.length > 0 ? `${P.length} selected` : void 0, L = u.multiple ? T : (de = e.find((g) => g.value === u.value)) == null ? void 0 : de.label, y = m.useMemo(() => {
       const g = S.trim().toLowerCase();
       return g ? e.filter((z) => z.label.toLowerCase().includes(g)) : e;
-    }, [e, S]), M = `${w}|${y.map((g) => `${g.value}:${g.disabled ? 1 : 0}`).join("\0")}`, [Y, F] = m.useState(M);
-    Y !== M && (F(M), k(Ji(y)));
-    const _ = m.useRef(!1);
+    }, [e, S]), A = `${w}|${y.map((g) => `${g.value}:${g.disabled ? 1 : 0}`).join("\0")}`, [Y, F] = m.useState(A);
+    Y !== A && (F(A), k(Ji(y)));
+    const G = m.useRef(!1);
     function Q(g) {
       if (!g.disabled) {
         if (u.multiple) {
@@ -2688,36 +2689,36 @@ const nr = /* @__PURE__ */ m.forwardRef(
         le.current = g, typeof b == "function" ? b(g) : b && (b.current = g);
       },
       [b]
-    ), A = m.useRef(null);
+    ), I = m.useRef(null);
     m.useEffect(() => {
       var K;
-      const g = A.current;
-      if (!g || R.length === g.count || (A.current = null, R.length > g.count)) return;
+      const g = I.current;
+      if (!g || P.length === g.count || (I.current = null, P.length > g.count)) return;
       const z = ve.current, W = (z == null ? void 0 : z.querySelectorAll("li button:not(:disabled)")) ?? [];
       (K = W[Math.min(g.index, W.length - 1)] ?? (z == null ? void 0 : z.querySelector('[role="combobox"]'))) == null || K.focus();
-    }, [R.length]);
-    function fe(g, z) {
-      u.multiple && (A.current = { index: z, count: R.length }, u.onChange(C.filter((W) => W !== g.value)));
+    }, [P.length]);
+    function he(g, z) {
+      u.multiple && (I.current = { index: z, count: P.length }, u.onChange(C.filter((W) => W !== g.value)));
     }
     function ce(g) {
       if (y.length !== 0) {
         if (g.key === "ArrowDown" || g.key === "ArrowUp") {
           g.preventDefault();
-          const z = Ki(y, f, g.key === "ArrowDown" ? 1 : -1);
-          z !== f && (_.current = !0, k(z));
+          const z = Ki(y, h, g.key === "ArrowDown" ? 1 : -1);
+          z !== h && (G.current = !0, k(z));
         } else if (g.key === "Enter") {
           g.preventDefault();
-          const z = y[f];
+          const z = y[h];
           z && Q(z);
         }
       }
     }
-    const te = (g) => `${P}-opt-${g}`, q = y[f] ? te(f) : void 0;
+    const te = (g) => `${R}-opt-${g}`, q = y[h] ? te(h) : void 0;
     m.useEffect(() => {
       var g;
-      _.current && (_.current = !1, w && q && ((g = document.getElementById(q)) == null || g.scrollIntoView({ block: "nearest" })));
+      G.current && (G.current = !1, w && q && ((g = document.getElementById(q)) == null || g.scrollIntoView({ block: "nearest" })));
     }, [w, q]);
-    const ie = /* @__PURE__ */ h(
+    const ie = /* @__PURE__ */ f(
       ke,
       {
         open: w,
@@ -2725,7 +2726,7 @@ const nr = /* @__PURE__ */ m.forwardRef(
           x(g), g || N("");
         },
         children: [
-          /* @__PURE__ */ t(ke.Anchor, { asChild: !0, children: /* @__PURE__ */ h(
+          /* @__PURE__ */ t(ke.Anchor, { asChild: !0, children: /* @__PURE__ */ f(
             "button",
             {
               ref: ge,
@@ -2750,7 +2751,7 @@ const nr = /* @__PURE__ */ m.forwardRef(
               children: [
                 /* @__PURE__ */ t("span", { className: d("truncate", !L && "text-muted-foreground"), children: L || i }),
                 /* @__PURE__ */ t(
-                  I,
+                  M,
                   {
                     icon: je,
                     size: "small",
@@ -2761,7 +2762,7 @@ const nr = /* @__PURE__ */ m.forwardRef(
               ]
             }
           ) }),
-          /* @__PURE__ */ h(
+          /* @__PURE__ */ f(
             ke.Content,
             {
               "aria-label": V,
@@ -2814,8 +2815,8 @@ const nr = /* @__PURE__ */ m.forwardRef(
                     "aria-multiselectable": u.multiple || void 0,
                     className: d("max-h-60 overflow-y-auto", y.length > 0 && "p-1"),
                     children: y.map((g, z) => {
-                      const W = C.includes(g.value), J = z === f;
-                      return /* @__PURE__ */ t("li", { role: "none", children: /* @__PURE__ */ h(
+                      const W = C.includes(g.value), J = z === h;
+                      return /* @__PURE__ */ t("li", { role: "none", children: /* @__PURE__ */ f(
                         "button",
                         {
                           type: "button",
@@ -2834,7 +2835,7 @@ const nr = /* @__PURE__ */ m.forwardRef(
                             "disabled:pointer-events-none disabled:text-[var(--semantic-color-content-disabled)]"
                           ),
                           children: [
-                            /* @__PURE__ */ t("span", { className: "flex size-4 items-center justify-center", children: W ? /* @__PURE__ */ t(I, { icon: pe, size: "small", color: "currentColor", "aria-hidden": !0 }) : null }),
+                            /* @__PURE__ */ t("span", { className: "flex size-4 items-center justify-center", children: W ? /* @__PURE__ */ t(M, { icon: pe, size: "small", color: "currentColor", "aria-hidden": !0 }) : null }),
                             /* @__PURE__ */ t("span", { className: "truncate", children: g.label })
                           ]
                         }
@@ -2849,15 +2850,15 @@ const nr = /* @__PURE__ */ m.forwardRef(
         ]
       }
     );
-    return u.multiple ? /* @__PURE__ */ h("div", { ref: ve, className: d("flex flex-col gap-2", ne), children: [
+    return u.multiple ? /* @__PURE__ */ f("div", { ref: ve, className: d("flex flex-col gap-2", ne), children: [
       ie,
-      R.length > 0 ? /* @__PURE__ */ t("ul", { className: "flex flex-wrap gap-1", children: R.map((g, z) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ h(
+      P.length > 0 ? /* @__PURE__ */ t("ul", { className: "flex flex-wrap gap-1", children: P.map((g, z) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ f(
         "button",
         {
           type: "button",
           "aria-label": `Remove ${g.label}`,
           disabled: v || g.disabled,
-          onClick: () => fe(g, z),
+          onClick: () => he(g, z),
           className: d(
             "hds-focus inline-flex h-7 items-center gap-1 rounded-sm border border-border bg-muted pl-2 pr-1",
             "hds-type-caption text-foreground hover:bg-accent hover:text-accent-foreground",
@@ -2865,7 +2866,7 @@ const nr = /* @__PURE__ */ m.forwardRef(
           ),
           children: [
             g.label,
-            /* @__PURE__ */ t(I, { icon: $e, size: "small", color: "currentColor", "aria-hidden": !0 })
+            /* @__PURE__ */ t(M, { icon: $e, size: "small", color: "currentColor", "aria-hidden": !0 })
           ]
         }
       ) }, g.value)) }) : null
@@ -2901,55 +2902,55 @@ const nr = /* @__PURE__ */ m.forwardRef(
     contentStyle: c,
     children: v
   }, u) {
-    const [b, w] = X(i), x = Ne(), S = Se(null), N = Se(null), f = a ?? b, k = f ? "open" : "closed", P = j("productive");
+    const [b, w] = X(i), x = Ne(), S = Se(null), N = Se(null), h = a ?? b, k = h ? "open" : "closed", R = j("productive");
     function H() {
-      var y, M;
-      const L = !f;
-      !L && ((y = N.current) != null && y.contains(document.activeElement)) && ((M = S.current) == null || M.focus()), a === void 0 && w(L), r == null || r(L);
+      var y, A;
+      const L = !h;
+      !L && ((y = N.current) != null && y.contains(document.activeElement)) && ((A = S.current) == null || A.focus()), a === void 0 && w(L), r == null || r(L);
     }
     const V = d(
       "hds-focus",
       Zi({ variant: o }),
       o === "nav" ? "hds-text-hover hds-bg-hover-neutral" : "",
       l
-    ), C = f ? Qi[o] : 0, R = typeof e == "string" ? /* @__PURE__ */ t(
+    ), C = h ? Qi[o] : 0, P = typeof e == "string" ? /* @__PURE__ */ t(
       "span",
       {
         className: "m-0 text-current",
         style: o === "nav" ? D.typeStyles.ui : D.typeStyles.caption,
         children: e
       }
-    ) : e, T = /* @__PURE__ */ h(at, { children: [
-      /* @__PURE__ */ h(
+    ) : e, T = /* @__PURE__ */ f(at, { children: [
+      /* @__PURE__ */ f(
         "button",
         {
           ref: S,
           type: "button",
           onClick: H,
-          "aria-expanded": f,
+          "aria-expanded": h,
           "aria-controls": x,
           "data-state": k,
           className: V,
           style: p,
           children: [
-            /* @__PURE__ */ t("div", { className: "grid min-w-0 flex-1 items-start gap-[var(--semantic-space-subgrid-gap)]", children: R }),
+            /* @__PURE__ */ t("div", { className: "grid min-w-0 flex-1 items-start gap-[var(--semantic-space-subgrid-gap)]", children: P }),
             /* @__PURE__ */ t(
               E.span,
               {
                 "aria-hidden": "true",
-                animate: { rotate: f ? 0 : -90 },
+                animate: { rotate: h ? 0 : -90 },
                 transition: {
-                  duration: P.duration,
-                  ease: P.easing
+                  duration: R.duration,
+                  ease: R.easing
                 },
                 className: "inline-grid size-[var(--hds-icon-small)] shrink-0 origin-center place-items-center self-center overflow-hidden leading-none",
-                children: /* @__PURE__ */ t(I, { icon: pt, size: "small", color: "currentColor" })
+                children: /* @__PURE__ */ t(M, { icon: pt, size: "small", color: "currentColor" })
               }
             )
           ]
         }
       ),
-      /* @__PURE__ */ t(nt, { initial: !1, children: f && /* @__PURE__ */ t(
+      /* @__PURE__ */ t(nt, { initial: !1, children: h && /* @__PURE__ */ t(
         E.div,
         {
           ref: N,
@@ -2958,8 +2959,8 @@ const nr = /* @__PURE__ */ m.forwardRef(
           animate: { opacity: 1, height: "auto" },
           exit: { opacity: 0, height: 0 },
           transition: {
-            duration: P.duration,
-            ease: P.easing
+            duration: R.duration,
+            ease: R.easing
           },
           className: "overflow-hidden",
           children: /* @__PURE__ */ t(
@@ -2974,31 +2975,31 @@ const nr = /* @__PURE__ */ m.forwardRef(
         }
       ) })
     ] });
-    return o === "nav" ? /* @__PURE__ */ t(Ae, { ref: u, gap: "tight", style: { gap: C }, children: T }) : /* @__PURE__ */ t(
+    return o === "nav" ? /* @__PURE__ */ t(Ie, { ref: u, gap: "tight", style: { gap: C }, children: T }) : /* @__PURE__ */ t(
       gt,
       {
         ref: u,
         padding: "component",
         className: o === "card" ? "overflow-hidden" : void 0,
-        children: /* @__PURE__ */ t(Ae, { gap: "tight", style: { gap: C }, children: T })
+        children: /* @__PURE__ */ t(Ie, { gap: "tight", style: { gap: C }, children: T })
       }
     );
   }
 );
-function he(n, e) {
+function fe(n, e) {
   return Array.from({ length: e - n + 1 }, (i, a) => n + a);
 }
 function ea(n, e, i = 1) {
   const a = i * 2 + 5;
-  if (e <= a) return he(1, e);
+  if (e <= a) return fe(1, e);
   const r = Math.max(n - i, 1), o = Math.min(n + i, e), s = r > 2, l = o < e - 1;
-  return !s && l ? [...he(1, i * 2 + 3), "ellipsis", e] : s && !l ? [1, "ellipsis", ...he(e - (i * 2 + 2), e)] : [1, "ellipsis", ...he(r, o), "ellipsis", e];
+  return !s && l ? [...fe(1, i * 2 + 3), "ellipsis", e] : s && !l ? [1, "ellipsis", ...fe(e - (i * 2 + 2), e)] : [1, "ellipsis", ...fe(r, o), "ellipsis", e];
 }
 const sr = /* @__PURE__ */ m.forwardRef(
   function({ page: e, count: i, onPageChange: a, siblingCount: r = 1, label: o = "Pagination", className: s, ...l }, p) {
     if (i <= 1) return null;
     const c = ea(e, i, r), v = (u) => a(Math.max(1, Math.min(i, u)));
-    return /* @__PURE__ */ t("nav", { ref: p, "aria-label": o, className: d("w-full", s), ...l, children: /* @__PURE__ */ h("ul", { className: "flex flex-wrap items-center gap-1", children: [
+    return /* @__PURE__ */ t("nav", { ref: p, "aria-label": o, className: d("w-full", s), ...l, children: /* @__PURE__ */ f("ul", { className: "flex flex-wrap items-center gap-1", children: [
       /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(
         be,
         {
@@ -3008,7 +3009,7 @@ const sr = /* @__PURE__ */ m.forwardRef(
           "aria-label": "Previous page",
           disabled: e <= 1,
           onClick: () => v(e - 1),
-          iconLeft: /* @__PURE__ */ t(I, { icon: ut, size: "small" })
+          iconLeft: /* @__PURE__ */ t(M, { icon: ut, size: "small" })
         }
       ) }),
       c.map(
@@ -3042,7 +3043,7 @@ const sr = /* @__PURE__ */ m.forwardRef(
           "aria-label": "Next page",
           disabled: e >= i,
           onClick: () => v(e + 1),
-          iconLeft: /* @__PURE__ */ t(I, { icon: Ce, size: "small" })
+          iconLeft: /* @__PURE__ */ t(M, { icon: Ce, size: "small" })
         }
       ) })
     ] }) });
@@ -3067,9 +3068,9 @@ function lr() {
 const ia = {
   neutral: ze,
   info: ze,
-  success: Ge,
-  danger: Oe,
-  warning: _e
+  success: Oe,
+  danger: _e,
+  warning: Ge
 };
 function cr({
   children: n,
@@ -3085,11 +3086,11 @@ function cr({
     () => ({ toast: l, dismiss: s }),
     [l, s]
   );
-  return /* @__PURE__ */ t(tt.Provider, { value: p, children: /* @__PURE__ */ h(ae.Provider, { duration: e, swipeDirection: i, children: [
+  return /* @__PURE__ */ t(tt.Provider, { value: p, children: /* @__PURE__ */ f(ae.Provider, { duration: e, swipeDirection: i, children: [
     n,
     a.map((c) => {
       const v = c.tone ?? "neutral";
-      return /* @__PURE__ */ h(
+      return /* @__PURE__ */ f(
         ae.Root,
         {
           duration: c.duration ?? e,
@@ -3103,7 +3104,7 @@ function cr({
           ),
           children: [
             /* @__PURE__ */ t(
-              I,
+              M,
               {
                 icon: ia[v],
                 size: "small",
@@ -3112,7 +3113,7 @@ function cr({
                 "aria-hidden": !0
               }
             ),
-            /* @__PURE__ */ h("div", { className: "flex min-w-0 flex-col gap-1", children: [
+            /* @__PURE__ */ f("div", { className: "flex min-w-0 flex-col gap-1", children: [
               /* @__PURE__ */ t(ae.Title, { className: "hds-type-ui", children: c.title }),
               c.description ? /* @__PURE__ */ t(ae.Description, { className: "hds-type-ui text-muted-foreground", children: c.description }) : null
             ] }),
@@ -3124,7 +3125,7 @@ function cr({
                   "absolute right-2 top-2 inline-flex size-6 items-center justify-center",
                   "rounded-sm text-muted-foreground transition-colors hover:text-foreground hds-focus"
                 ),
-                children: /* @__PURE__ */ t(I, { icon: $e, size: "small", color: "currentColor", "aria-hidden": !0 })
+                children: /* @__PURE__ */ t(M, { icon: $e, size: "small", color: "currentColor", "aria-hidden": !0 })
               }
             )
           ]
@@ -3143,7 +3144,7 @@ function cr({
     )
   ] }) });
 }
-const aa = "https://www.designtokens.org/schemas/2025.10/format.json", ra = "Adrian Milsap hirobius design tokens - W3C DTCG 2025.10 compliant, Figma SDS architecture", na = /* @__PURE__ */ JSON.parse(`{"$description":"Base values used as inputs to derived token layers.","color":{"$type":"color","neutral":{"50":{"$value":"#fafafa","$description":"Specific value within the neutral range at a defined lightness step."},"100":{"$value":"#f5f5f5","$description":"Specific value within the neutral range at a defined lightness step."},"200":{"$value":"#e5e5e5","$description":"Specific value within the neutral range at a defined lightness step."},"300":{"$value":"#d4d4d4","$description":"Specific value within the neutral range at a defined lightness step."},"400":{"$value":"#a3a3a3","$description":"Specific value within the neutral range at a defined lightness step."},"500":{"$value":"#737373","$description":"Specific value within the neutral range at a defined lightness step."},"600":{"$value":"#525252","$description":"Specific value within the neutral range at a defined lightness step."},"700":{"$value":"#404040","$description":"Specific value within the neutral range at a defined lightness step."},"800":{"$value":"#262626","$description":"Specific value within the neutral range at a defined lightness step."},"850":{"$value":"#1a1a1a","$description":"Specific value within the neutral range at a defined lightness step."},"900":{"$value":"#111111","$description":"Specific value within the neutral range at a defined lightness step."},"950":{"$value":"#0a0a0a","$description":"Specific value within the neutral range at a defined lightness step."},"$description":"Discrete values within the neutral range at defined lightness steps.","white":{"$value":"#ffffff","$description":"Specific value within the neutral range at a defined lightness step."},"black":{"$value":"#000000","$description":"Specific value within the neutral range at a defined lightness step."}},"blue":{"50":{"$value":"oklch(0.96 0.03 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"100":{"$value":"oklch(0.92 0.04 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"200":{"$value":"oklch(0.88 0.07 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"300":{"$value":"oklch(0.70 0.2903 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"400":{"$value":"oklch(0.65 0.2903 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"450":{"$value":"oklch(0.56 0.29 266.60)","$description":"Specific value within the blue range at a defined lightness step."},"500":{"$value":"#1E2EFD","$description":"Specific value within the blue range at a defined lightness step."},"600":{"$value":"oklch(0.45 0.2903 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"700":{"$value":"oklch(0.44 0.2903 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"800":{"$value":"oklch(0.30 0.07 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"900":{"$value":"oklch(0.22 0.05 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"$description":"Discrete values within the blue range at defined lightness steps."},"red":{"50":{"$value":"#fef2f2","$description":"Specific value within the red range at a defined lightness step."},"400":{"$value":"#f87171","$description":"Specific value within the red range at a defined lightness step."},"700":{"$value":"#b91c1c","$description":"Specific value within the red range at a defined lightness step."},"950":{"$value":"#450a0a","$description":"Specific value within the red range at a defined lightness step."},"$description":"Discrete values within the red range at defined lightness steps."},"green":{"50":{"$value":"#ecfdf5","$description":"Specific value within the green range at a defined lightness step."},"400":{"$value":"#34d399","$description":"Specific value within the green range at a defined lightness step."},"700":{"$value":"#047857","$description":"Specific value within the green range at a defined lightness step."},"950":{"$value":"#022c22","$description":"Specific value within the green range at a defined lightness step."},"$description":"Discrete values within the green range at defined lightness steps."},"apple":{"50":{"$value":"#f2faeb","$description":"Apple-green accent tint — faintest step."},"100":{"$value":"#e2f3cf","$description":"Apple-green accent — very light tint."},"200":{"$value":"#c7e7a4","$description":"Apple-green accent — light tint."},"300":{"$value":"#a6d873","$description":"Apple-green accent — soft mid-light step."},"400":{"$value":"#85c84c","$description":"Apple-green accent — bright step; dark-mode rest accent."},"500":{"$value":"#66b239","$description":"Apple-green accent rest — bright, rich apple green; AA for dark (neutral.900) text as a fill."},"600":{"$value":"#54922d","$description":"Apple-green accent — hover / border step."},"700":{"$value":"#416f20","$description":"Apple-green accent — pressed and accent-intent text (AA for text on page and card surfaces)."},"800":{"$value":"#34571b","$description":"Apple-green accent — deep step."},"900":{"$value":"#2b4518","$description":"Apple-green accent — darkest usable step."},"950":{"$value":"#16250c","$description":"Apple-green accent — near-black green substrate."},"$description":"Discrete values within the apple-green (brand accent) range at defined lightness steps. Distinct from the emerald \`green\` feedback/success scale."},"violet":{"50":{"$value":"#f5f3ff","$description":"Specific value within the violet range at a defined lightness step."},"400":{"$value":"#a78bfa","$description":"Specific value within the violet range at a defined lightness step."},"700":{"$value":"#6d28d9","$description":"Specific value within the violet range at a defined lightness step."},"950":{"$value":"#2e1065","$description":"Specific value within the violet range at a defined lightness step."},"$description":"Discrete values within the violet range at defined lightness steps."},"lilac":{"50":{"$value":"#f7f4fe","$description":"Specific value within the lilac range at a defined lightness step."},"100":{"$value":"#efe9fd","$description":"Specific value within the lilac range at a defined lightness step."},"200":{"$value":"#ddd0fb","$description":"Specific value within the lilac range at a defined lightness step."},"300":{"$value":"#c3aef6","$description":"Specific value within the lilac range at a defined lightness step."},"400":{"$value":"#a585ee","$description":"Specific value within the lilac range at a defined lightness step."},"450":{"$value":"#9a6fe8","$description":"Specific value within the lilac range at a defined lightness step."},"500":{"$value":"#6f3fd4","$description":"Lilac accent rest — AA for white text on page and card surfaces."},"600":{"$value":"#5f33c0","$description":"Specific value within the lilac range at a defined lightness step."},"700":{"$value":"#4f2aa3","$description":"Specific value within the lilac range at a defined lightness step."},"800":{"$value":"#3a1f78","$description":"Specific value within the lilac range at a defined lightness step."},"900":{"$value":"#2a1659","$description":"Specific value within the lilac range at a defined lightness step."},"$description":"Lilac ramp at fixed lightness steps. Mirrors the blue ramp's stops; available to brand overlays."},"amber":{"50":{"$value":"#fffbeb","$description":"Specific value within the amber range at a defined lightness step."},"400":{"$value":"#fbbf24","$description":"Specific value within the amber range at a defined lightness step."},"800":{"$value":"#92400e","$description":"Specific value within the amber range at a defined lightness step."},"950":{"$value":"#451a03","$description":"Specific value within the amber range at a defined lightness step."},"$description":"Discrete values within the amber range at defined lightness steps."},"stone":{"100":{"$value":"#F5EFE7","$description":"Stone 100 — near-white warm tint; accent-subtle surface."},"400":{"$value":"#D0B492","$description":"Stone 400 — light warm tone; dark-mode pressed accent."},"450":{"$value":"#BC9D7E","$description":"Stone 450 — medium warm tone; dark-mode hover accent."},"500":{"$value":"#A8896A","$description":"Stone 500 — mid warm tone; dark-mode rest accent."},"600":{"$value":"#8B6F47","$description":"Stone 600 — primary warm stone; light-mode rest accent and CTA surface."},"700":{"$value":"#75593A","$description":"Stone 700 — darker warm stone; light-mode hover accent."},"800":{"$value":"#5C432A","$description":"Stone 800 — deep warm stone; light-mode pressed accent."},"950":{"$value":"#3A2E1F","$description":"Stone 950 — near-black warm tone; dark-mode subtle accent surface."},"$description":"Warm stone/brown palette for Concrete Creations brand accent ramp. PLACEHOLDER values pending final brand identity work."},"projectBrand":{"microsoftGameDev":{"100":{"$value":"#E5E5FC","$description":"Light support tone for the Microsoft Game Dev project brand."},"500":{"$value":"#6d31fb","$description":"Primary accent tone for the Microsoft Game Dev project brand."},"900":{"$value":"oklch(0.22 0.16 304)","$description":"Dark support tone for the Microsoft Game Dev project brand."},"$description":"Project-specific brand colors used in portfolio contexts."},"$description":"Project-specific brand color families reserved for portfolio surfaces."}},"space":{"0":{"$value":{"value":0,"unit":"px"}},"1":{"$value":{"value":4,"unit":"px"}},"2":{"$value":{"value":8,"unit":"px"}},"3":{"$value":{"value":12,"unit":"px"}},"4":{"$value":{"value":16,"unit":"px"}},"5":{"$value":{"value":20,"unit":"px"}},"6":{"$value":{"value":24,"unit":"px"}},"7":{"$value":{"value":28,"unit":"px"}},"8":{"$value":{"value":32,"unit":"px"}},"10":{"$value":{"value":40,"unit":"px"}},"12":{"$value":{"value":48,"unit":"px"}},"16":{"$value":{"value":64,"unit":"px"}},"20":{"$value":{"value":80,"unit":"px"}},"24":{"$value":{"value":96,"unit":"px"}},"32":{"$value":{"value":128,"unit":"px"}},"$type":"dimension","$description":"Dimensional increments within the 4px base-unit spatial system.","px1":{"$value":{"value":1,"unit":"px"}},"px2":{"$value":{"value":2,"unit":"px"}},"px6":{"$value":{"value":6,"unit":"px"}},"px10":{"$value":{"value":10,"unit":"px"}}},"blur":{"8":{"$value":{"value":8,"unit":"px"},"$description":"8px blur step."},"16":{"$value":{"value":16,"unit":"px"},"$description":"Fullscreen backdrop blur for portfolio lightbox overlays."},"$type":"dimension","$description":"Backdrop blur strengths for frosted overlays and fullscreen media treatments."},"radius":{"0":{"$value":{"value":0,"unit":"px"}},"2":{"$value":{"value":2,"unit":"px"}},"4":{"$value":{"value":4,"unit":"px"}},"8":{"$value":{"value":8,"unit":"px"}},"12":{"$value":{"value":12,"unit":"px"}},"$type":"dimension","full":{"$value":{"value":9999,"unit":"px"}}},"typography":{"family":{"$type":"fontFamily","primary":{"$value":["Plus Jakarta Sans","system-ui","-apple-system","BlinkMacSystemFont","Segoe UI","sans-serif"],"$description":"Self-hosted Plus Jakarta Sans (OFL) body typeface; falls back to system-ui sans-serif stack."},"display":{"$value":["Plus Jakarta Sans","system-ui","-apple-system","BlinkMacSystemFont","Segoe UI","sans-serif"],"$description":"Display face: Plus Jakarta Sans Bold (OFL), bound to the display and title composites."},"mono":{"$value":["IBM Plex Mono","Courier New","monospace"],"$description":"Monospace face: IBM Plex Mono. Falls back to Courier New, monospace."}},"size":{"$type":"dimension","xs":{"$value":{"value":12,"unit":"px"},"$description":"Tailwind 4 default text-xs (hds#283 ramp)."},"sm":{"$value":{"value":14,"unit":"px"},"$description":"Tailwind 4 default text-sm (hds#283 ramp)."},"base":{"$value":{"value":16,"unit":"px"},"$description":"Tailwind 4 default text-base (hds#283 ramp)."},"lg":{"$value":{"value":18,"unit":"px"},"$description":"Tailwind 4 default text-lg (hds#283 ramp)."},"xl":{"$value":{"value":20,"unit":"px"},"$description":"Tailwind 4 default text-xl (hds#283 ramp)."},"2xl":{"$value":{"value":24,"unit":"px"},"$description":"Tailwind 4 default text-2xl (hds#283 ramp)."},"3xl":{"$value":{"value":30,"unit":"px"},"$description":"Tailwind 4 default text-3xl (hds#283 ramp)."},"4xl":{"$value":{"value":36,"unit":"px"},"$description":"Tailwind 4 default text-4xl (hds#283 ramp)."},"5xl":{"$value":{"value":48,"unit":"px"},"$description":"Tailwind 4 default text-5xl (hds#283 ramp)."},"6xl":{"$value":{"value":60,"unit":"px"},"$description":"Swiss-canon display size (hds#283 ramp). Static desktop value; fluid in theme.css. Tailwind 4 default text-6xl."},"code":{"$value":{"value":13,"unit":"px"},"$description":"13px code size. The mono role (hds#485): one px below ui so code sits level with 14px prose."}},"weight":{"$type":"fontWeight","regular":{"$value":400},"medium":{"$value":500},"bold":{"$value":700}},"lineHeight":{"$type":"number","compact":{"$value":0.95},"none":{"$value":1},"tight":{"$value":1.25},"snug":{"$value":1.375,"$description":"Swiss-canon snug rhythm (10t-5). Used by h2/h3 composites for tight-but-readable heading lines."},"normal":{"$value":1.5},"relaxed":{"$value":1.625,"$description":"Swiss-canon relaxed rhythm (10t-5). Used by body/small/mono composites for long-form prose comfort."},"display":{"$value":1.05,"$description":"Display role leading (hds#485)."},"body":{"$value":1.6,"$description":"Body role leading (hds#485)."}},"letterSpacing":{"$type":"dimension","tight":{"$value":{"value":-0.01,"unit":"em"}},"normal":{"$value":{"value":0,"unit":"em"}},"caps":{"$value":{"value":0.06,"unit":"em"},"$description":"All-caps tracking for eyebrow / kicker labels. Always pairs with text-transform: uppercase."}}},"duration":{"$type":"duration","instant":{"$value":{"value":100,"unit":"ms"},"$description":"Fixed elapsed time interval in milliseconds."},"short":{"$value":{"value":150,"unit":"ms"},"$description":"Fixed elapsed time interval in milliseconds."},"medium":{"$value":{"value":250,"unit":"ms"},"$description":"Fixed elapsed time interval in milliseconds."},"long":{"$value":{"value":400,"unit":"ms"},"$description":"Fixed elapsed time interval in milliseconds."}},"easing":{"$type":"cubicBezier","emphasized":{"$value":[0.4,0,0.2,1],"$description":"Cubic bezier with balanced input and output tangents."},"decelerate":{"$value":[0,0,0.2,1],"$description":"Cubic bezier with steep initial gain and constrained tail velocity."},"accelerate":{"$value":[0.4,0,1,1],"$description":"Cubic bezier with restrained initial gain and steep terminal velocity."},"elastic":{"$value":[0.34,1.56,0.64,1],"$description":"Spring response defined by stiffness, damping, and mass parameters.","$extensions":{"com.hirobius.hds":{"$type":"spring","$value":{"type":"spring","stiffness":300,"damping":20,"mass":1},"bezierSource":"The cubicBezier is easeOutBack (easings.net), chosen as a stand-in for the spring, not fitted to it: both overshoot once, the curve by about 10% and spring(300, 20, 1) by about 11%."}}}},"shadow":{"color":{"$type":"color","$value":"220 13% 18%","$description":"HSL channels for shadow-color alpha compositing. Light: cool neutral; dark: black.","$extensions":{"com.figma.variables":{"modes":{"Light":"220 13% 18%","Dark":"0 0% 0%"}}}}},"breakpoint":{"$description":"Discrete viewport thresholds expressed as dimensions.","xs":{"$type":"dimension","$value":{"value":375,"unit":"px"}},"sm":{"$type":"dimension","$value":{"value":640,"unit":"px"}},"md":{"$type":"dimension","$value":{"value":768,"unit":"px"}},"lg":{"$type":"dimension","$value":{"value":1024,"unit":"px"}},"xl":{"$type":"dimension","$value":{"value":1280,"unit":"px"}}},"size":{"8":{"$type":"dimension","$value":{"value":8,"unit":"px"},"$description":"8px size step."},"10":{"$type":"dimension","$value":{"value":10,"unit":"px"},"$description":"10px size step."},"12":{"$type":"dimension","$value":{"value":12,"unit":"px"},"$description":"12px size step."},"16":{"$type":"dimension","$value":{"value":16,"unit":"px"},"$description":"16px size step."},"20":{"$type":"dimension","$value":{"value":20,"unit":"px"},"$description":"20px size step."},"24":{"$type":"dimension","$value":{"value":24,"unit":"px"},"$description":"24px size step."},"32":{"$type":"dimension","$value":{"value":32,"unit":"px"},"$description":"32px size step."},"40":{"$type":"dimension","$value":{"value":40,"unit":"px"},"$description":"40px size step."},"48":{"$type":"dimension","$value":{"value":48,"unit":"px"},"$description":"48px size step."},"64":{"$type":"dimension","$value":{"value":64,"unit":"px"},"$description":"64px size step."},"80":{"$type":"dimension","$value":{"value":80,"unit":"px"},"$description":"80px size step."},"96":{"$type":"dimension","$value":{"value":96,"unit":"px"},"$description":"96px size step."},"120":{"$type":"dimension","$value":{"value":120,"unit":"px"},"$description":"120px size step. Backs semantic.size.tile."},"$description":"Unaliased dimensional values.","interactive":{"$description":"Interactive control size minimums.","min":{"$type":"dimension","$value":{"value":44,"unit":"px"},"$description":"Minimum interactive hit target size."},"minCompact":{"$type":"dimension","$value":{"value":24,"unit":"px"},"$description":"Compact inline control target minimum, e.g. a chip's remove button: WCAG 2.2 AA (2.5.8), not the 44px AAA floor (2.5.5)."}},"width":{"96":{"$type":"dimension","$value":{"value":96,"unit":"px"},"$description":"96px width step."},"280":{"$type":"dimension","$value":{"value":280,"unit":"px"},"$description":"Docs-shell rail width (hds#280): our own number, not HeroUI's 268px; fits the longest top-level nav label with room."},"760":{"$type":"dimension","$value":{"value":760,"unit":"px"}},"1200":{"$type":"dimension","$value":{"value":1200,"unit":"px"}},"50ch":{"$type":"dimension","$value":{"value":50,"unit":"ch"}}}},"grid":{"columns":{"1":{"$type":"number","$value":1},"2":{"$type":"number","$value":2},"3":{"$type":"number","$value":3}}},"zIndex":{"0":{"$type":"number","$value":0},"10":{"$type":"number","$value":10},"100":{"$type":"number","$value":100},"1000":{"$type":"number","$value":1000},"$description":"Discrete stacking levels along the z axis."},"borderWidth":{"$type":"dimension","xs":{"$value":{"value":1,"unit":"px"}},"sm":{"$value":{"value":2,"unit":"px"}},"md":{"$value":{"value":4,"unit":"px"}}}}`), oa = /* @__PURE__ */ JSON.parse(`{"motion":{"$type":"transition","$extensions":{"com.hirobius.hds":{"$type":"motion"}},"productive":{"$value":{"duration":"{primitive.duration.short}","delay":{"value":0,"unit":"ms"},"timingFunction":"{primitive.easing.decelerate}"},"$description":"For micro-interactions and status changes. No deformation."},"expressive":{"$value":{"duration":"{primitive.duration.medium}","delay":{"value":0,"unit":"ms"},"timingFunction":"{primitive.easing.elastic}"},"$description":"For teaching moments and significant UI entries. Includes physics-based squish."},"spatial":{"$value":{"duration":"{primitive.duration.long}","delay":{"value":0,"unit":"ms"},"timingFunction":"{primitive.easing.emphasized}"},"$description":"For elements traveling long distances across the viewport."},"exit":{"$value":{"duration":"{primitive.duration.instant}","delay":{"value":0,"unit":"ms"},"timingFunction":"{primitive.easing.accelerate}"},"$description":"For elements being removed from the DOM."},"distance":{"$type":"dimension","$value":"{primitive.space.6}","$description":"Scroll-reveal translateY travel distance. Equals semantic.space.scale.md today, but names motion travel, not a spacing tier (hds#242)."}},"color":{"$type":"color","surface":{"page":{"$value":"{primitive.color.neutral.white}","$description":"Main page background","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.white}","Dark":"{primitive.color.neutral.black}"}}}},"raised":{"$value":"{primitive.color.neutral.50}","$description":"Subtle elevated surface (cards, sections)","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.50}","Dark":"{primitive.color.neutral.950}"}}}},"overlay":{"$value":"{primitive.color.neutral.100}","$description":"Deeper surface layer","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.100}","Dark":"{primitive.color.neutral.850}"}}}},"scrim":{"$value":"{primitive.color.neutral.900}","$description":"Opaque modal backdrop, near-black in both themes. Apply alpha in the class (bg-scrim/60), not here.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.900}","Dark":"{primitive.color.neutral.black}"}}}},"inverse":{"$value":"{primitive.color.neutral.black}","$description":"Inverted background for contrast sections","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.black}","Dark":"{primitive.color.neutral.white}"}}}},"accent":{"$value":"{primitive.color.apple.500}","$description":"Accent-colored background — bright apple green (stays green on dark surfaces; pair with content.onAccent dark text).","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.apple.500}","Dark":"{primitive.color.apple.400}"}}}},"accentSubtle":{"$value":"{primitive.color.apple.50}","$description":"Faint accent tint for hover states or highlights","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.apple.50}","Dark":"{primitive.color.apple.900}"}}}},"hover":{"$value":"{primitive.color.neutral.100}","$description":"Background for a hovered interactive surface (menu items, chips, tertiary buttons).","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.100}","Dark":"{primitive.color.neutral.900}"}}}},"pressed":{"$value":"{primitive.color.neutral.50}","$description":"Background for an actively pressed interactive surface.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.50}","Dark":"{primitive.color.neutral.950}"}}}},"selected":{"$value":"{primitive.color.neutral.200}","$description":"Background for a persistently selected item (active tab, checked row).","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.200}","Dark":"{primitive.color.neutral.800}"}}}},"muted":{"$value":"{primitive.color.neutral.100}","$description":"Muted background for low-emphasis content blocks.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.100}","Dark":"{primitive.color.neutral.900}"}}}},"sunken":{"$value":"{primitive.color.neutral.200}","$description":"Recessed background for inset wells (inputs, code blocks, nested panels).","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.200}","Dark":"{primitive.color.neutral.850}"}}}}},"content":{"primary":{"$value":"{primitive.color.neutral.900}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.900}","Dark":"{primitive.color.neutral.100}"}}}},"secondary":{"$value":"{primitive.color.neutral.600}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.600}","Dark":"{primitive.color.neutral.400}"}}}},"disabled":{"$value":"{primitive.color.neutral.300}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.300}","Dark":"{primitive.color.neutral.600}"}}}},"inverse":{"$value":"{primitive.color.neutral.100}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.100}","Dark":"{primitive.color.neutral.900}"}}}},"accent":{"$value":"{primitive.color.apple.700}","$description":"Accent-intent text/icon color — a dark apple green legible on page and card surfaces. Pair with underline/weight for link affordance.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.apple.700}","Dark":"{primitive.color.apple.400}"}}}},"onAccent":{"$value":"{primitive.color.neutral.900}","$description":"Text/icon color on accent fills — a dark neutral, since the brand accent fill is a bright apple green in both light and dark mode.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.900}","Dark":"{primitive.color.neutral.900}"}}}},"success":{"$value":"{primitive.color.green.700}","$description":"Success-toned text/icon color, independent of feedback banners.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.green.700}","Dark":"{primitive.color.green.400}"}}}},"warning":{"$value":"{primitive.color.amber.800}","$description":"Warning-toned text/icon color, independent of feedback banners.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.amber.800}","Dark":"{primitive.color.amber.400}"}}}},"danger":{"$value":"{primitive.color.red.700}","$description":"Danger-toned text/icon color, independent of feedback banners.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.red.700}","Dark":"{primitive.color.red.400}"}}}}},"border":{"default":{"$value":"{primitive.color.neutral.200}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.200}","Dark":"{primitive.color.neutral.700}"}}}},"interactive":{"$value":"{primitive.color.neutral.500}","$description":"Border for interactive control boundaries (inputs, selects, secondary buttons); meets the WCAG 1.4.11 3:1 non-text contrast floor.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.500}","Dark":"{primitive.color.neutral.500}"}}}},"subdued":{"$value":"{primitive.color.neutral.200}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.200}","Dark":"{primitive.color.neutral.800}"}}}},"subtle":{"$value":"{primitive.color.neutral.100}","$description":"Lowest-contrast border for resting hairline edges on flat surfaces.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.100}","Dark":"{primitive.color.neutral.850}"}}}},"strong":{"$value":"{primitive.color.neutral.300}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.300}","Dark":"{primitive.color.neutral.600}"}}}},"accent":{"$value":"{primitive.color.apple.600}","$description":"Accent border — apple green, dark enough to read as a boundary on page and card surfaces.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.apple.600}","Dark":"{primitive.color.apple.400}"}}}},"success":{"$value":"{primitive.color.green.400}","$description":"Success-toned border for status outlines and success-state inputs.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.green.400}","Dark":"{primitive.color.green.400}"}}}},"warning":{"$value":"{primitive.color.amber.400}","$description":"Warning-toned border for status outlines and warning-state inputs.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.amber.400}","Dark":"{primitive.color.amber.400}"}}}}},"feedback":{"error":{"$type":"color","$value":"{primitive.color.red.700}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.red.700}","Dark":"{primitive.color.red.400}"}}}},"success":{"$type":"color","$value":"{primitive.color.green.700}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.green.700}","Dark":"{primitive.color.green.400}"}}}},"warning":{"$type":"color","$value":"{primitive.color.amber.800}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.amber.800}","Dark":"{primitive.color.amber.400}"}}}},"info":{"$type":"color","$value":"{primitive.color.blue.500}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.blue.500}","Dark":"{primitive.color.blue.300}"}}}},"inProgress":{"$type":"color","$value":"{primitive.color.violet.700}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.violet.700}","Dark":"{primitive.color.violet.400}"}}}},"bg":{"error":{"$type":"color","$value":"{primitive.color.red.50}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.red.50}","Dark":"{primitive.color.red.950}"}}}},"success":{"$type":"color","$value":"{primitive.color.green.50}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.green.50}","Dark":"{primitive.color.green.950}"}}}},"warning":{"$type":"color","$value":"{primitive.color.amber.50}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.amber.50}","Dark":"{primitive.color.amber.950}"}}}},"info":{"$type":"color","$value":"{primitive.color.blue.50}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.blue.50}","Dark":"{primitive.color.blue.900}"}}}},"inProgress":{"$type":"color","$value":"{primitive.color.violet.50}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.violet.50}","Dark":"{primitive.color.violet.950}"}}}}}},"state":{"pressed":{"overlay":{"$value":"{primitive.color.neutral.black}","$description":"Opaque pressed wash over a control's own fill: black in light, white in dark. Alpha in the class (inset-shadow-pressed-overlay/5).","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.black}","Dark":"{primitive.color.neutral.white}"}}}}}}},"space":{"$type":"dimension","$description":"Semantic spacing tiers: subgrid, component, layout, section, scale.","scale":{"$description":"hds#206: the canonical spacing vocabulary, one monotonic t-shirt scale (xs to xl) for padding, margin and gap. Supersedes deprecated names.","xs":{"$value":"{primitive.space.2}","$description":"8px — smallest step. Same value as component.gap (deprecated alias)."},"sm":{"$value":"{primitive.space.4}","$description":"16px — same value as layout.tight (deprecated alias)."},"md":{"$value":"{primitive.space.6}","$description":"24px. Default of the overridable roles surface.padding and region.gutter. The deprecated layout.normal has the same value."},"lg":{"$value":"{primitive.space.8}","$description":"32px — same value as layout.inset (deprecated alias)."},"xl":{"$value":"{primitive.space.12}","$description":"48px — same value as layout.spacious (deprecated alias)."}},"surface":{"$description":"hds#206 surface inset role. Tenants override it per brand and density, always with a scale step.","padding":{"$value":"{semantic.space.scale.md}","$description":"24px (scale.md) inset for cards, forms and panels. Tenants override it per brand and density. Replaces component.padding."}},"region":{"$description":"hds#206 region gutter role. theme.css retunes it per viewport, always with a scale step.","gutter":{"$value":"{semantic.space.scale.md}","$description":"24px (scale.md) column and region gutters; theme.css sets scale.lg (32px), and scale.sm (16px) below 640px. Replaces layout.gutter."}},"subgrid":{"hairline":{"$value":"{primitive.space.px1}","$description":"1px border offset and hairline spacing."},"xs":{"$value":"{primitive.space.px2}","$description":"2px vertical rhythm nudge and baseline adjustment."},"gap":{"$value":"{primitive.space.1}","$description":"4px cap-height and inline cluster spacing."}},"component":{"gap":{"$value":"{primitive.space.2}","$description":"8px label↔input rhythm and closely coupled control spacing. DEPRECATED alias (hds#206) — use semantic.space.scale.xs; kept live, no removal yet.","$deprecated":"hds#206 — use semantic.space.scale.xs"},"medium":{"$value":"{primitive.space.3}","$description":"12px adjacent form fields and medium intra-component gaps."},"padding":{"$value":"{semantic.space.surface.padding}","$description":"24px inset for cards, forms and panels. DEPRECATED alias (hds#206) — use semantic.space.surface.padding; kept live, no removal yet.","$deprecated":"hds#206 — use semantic.space.surface.padding"}},"layout":{"tight":{"$value":"{primitive.space.4}","$description":"16px default HdsStack gap and inter-component spacing. DEPRECATED alias (hds#206) — use semantic.space.scale.sm; kept live, no removal yet.","$deprecated":"hds#206 — use semantic.space.scale.sm"},"normal":{"$value":"{primitive.space.6}","$description":"24px column gutters and sidebar gutter spacing. DEPRECATED alias (hds#206) — use semantic.space.scale.md; kept live, no removal yet.","$deprecated":"hds#206 — use semantic.space.scale.md"},"gutter":{"$value":"{semantic.space.region.gutter}","$description":"24px column and region gutters. DEPRECATED alias (hds#206) — use semantic.space.region.gutter (responsive in theme.css); kept live, no removal yet.","$deprecated":"hds#206 — use semantic.space.region.gutter"},"inset":{"$value":"{primitive.space.8}","$description":"32px major block separation and inset inter-component gaps. DEPRECATED alias (hds#206) — use semantic.space.scale.lg; kept live, no removal yet.","$deprecated":"hds#206 — use semantic.space.scale.lg"},"spacious":{"$value":"{primitive.space.12}","$description":"48px break between major content blocks. DEPRECATED alias (hds#206) — use semantic.space.scale.xl; kept live, no removal yet.","$deprecated":"hds#206 — use semantic.space.scale.xl"}},"section":{"stack":{"$value":"{primitive.space.20}","$description":"80px vertical rhythm between page sections and major editorial blocks."},"inset":{"$value":"{primitive.space.24}","$description":"96px hero and landing-page inset padding."},"heroMax":{"$value":"{primitive.space.32}","$description":"128px maximum hero region padding for extra-large displays."}},"sidebar":{"indent":{"$value":"{primitive.space.3}","$description":"12px indent level for nested sidebar and TOC groups."},"gap":{"$value":"{primitive.space.4}","$description":"16px vertical spacing between items in sidebar and TOC stacks."},"sectionGap":{"$value":"{primitive.space.3}","$description":"12px spacing between sidebar sections and grouped rail blocks."},"railPadding":{"$value":"{primitive.space.5}","$description":"20px outer padding for sidebar and TOC rails."},"railWidth":{"$type":"dimension","$value":"{primitive.size.width.280}","$description":"Docs-shell nav and TOC rail width (hds#280), one token for both rails; 0 below their breakpoint (see HdsDocsShell)."}}},"layout":{"width":{"content":{"$type":"dimension","$value":"{primitive.size.width.760}","$description":"Max width for prose/content (760px). Use with HdsContainer for centered text blocks."},"max":{"$type":"dimension","$value":"{primitive.size.width.1200}","$description":"Max width for full-layout containers (1200px). Use with HdsContainer for page layouts."}},"container":{"maxWidth":{"$type":"dimension","$value":"{primitive.size.width.1200}"}},"content":{"maxWidth":{"$type":"dimension","$value":"{primitive.size.width.760}"}},"prose":{"maxWidth":{"$type":"dimension","$value":"{primitive.size.width.50ch}"}},"section":{"paddingY":{"$type":"dimension","$value":"{primitive.space.20}"}},"grid":{"gap":{"$type":"dimension","$value":"{primitive.space.8}"},"columns":{"mobile":{"$type":"number","$value":"{primitive.grid.columns.1}"},"tablet":{"$type":"number","$value":"{primitive.grid.columns.2}"},"desktop":{"$type":"number","$value":"{primitive.grid.columns.3}"}}}},"typography":{"$type":"typography","$description":"5-role type ramp plus mono (hds#483): display, title, body, ui, caption, mono. h1, h2, h3 and eyebrow are deprecated aliases.","display":{"$value":{"fontFamily":"{primitive.typography.family.display}","fontSize":"{primitive.typography.size.5xl}","fontWeight":"{primitive.typography.weight.bold}","letterSpacing":"{primitive.typography.letterSpacing.tight}","lineHeight":"{primitive.typography.lineHeight.display}"},"$description":"One per page, hero only. 48px / 1.05 / 700. Role 1 of 6."},"title":{"$value":{"fontFamily":"{primitive.typography.family.display}","fontSize":"{primitive.typography.size.2xl}","fontWeight":"{primitive.typography.weight.bold}","letterSpacing":"{primitive.typography.letterSpacing.tight}","lineHeight":"{primitive.typography.lineHeight.tight}"},"$description":"Section and card headings. 24px / 1.25 / 700. Role 2 of 6."},"body":{"$value":{"fontFamily":"{primitive.typography.family.primary}","fontSize":"{primitive.typography.size.base}","fontWeight":"{primitive.typography.weight.regular}","letterSpacing":"{primitive.typography.letterSpacing.normal}","lineHeight":"{primitive.typography.lineHeight.body}","maxWidth":{"value":60,"unit":"ch"}},"$description":"Prose. 16px / 1.6 / 400, 60ch measure. Role 3 of 6."},"ui":{"$value":{"fontFamily":"{primitive.typography.family.primary}","fontSize":"{primitive.typography.size.sm}","fontWeight":"{primitive.typography.weight.medium}","letterSpacing":"{primitive.typography.letterSpacing.normal}","lineHeight":"{primitive.typography.lineHeight.normal}","maxWidth":{"value":60,"unit":"ch"}},"$description":"Controls, nav, table text, values. 14px / 1.5 / 500. Role 4 of 6."},"caption":{"$value":{"fontFamily":"{primitive.typography.family.primary}","fontSize":"{primitive.typography.size.xs}","fontWeight":"{primitive.typography.weight.medium}","letterSpacing":"{primitive.typography.letterSpacing.normal}","lineHeight":"{primitive.typography.lineHeight.normal}"},"$description":"Metadata, help text and labels, in sentence case. 12px / 1.5 / 500. Role 5 of 6."},"mono":{"$value":{"fontFamily":"{primitive.typography.family.mono}","fontSize":"{primitive.typography.size.code}","fontWeight":"{primitive.typography.weight.regular}","letterSpacing":"{primitive.typography.letterSpacing.normal}","lineHeight":"{primitive.typography.lineHeight.normal}","maxWidth":{"value":60,"unit":"ch"}},"$description":"Code and ids. 13px / 1.5 / 400. The mono companion, role 6 of 6."},"h1":{"$value":{"fontFamily":"{primitive.typography.family.display}","fontSize":"{primitive.typography.size.2xl}","fontWeight":"{primitive.typography.weight.bold}","letterSpacing":"{primitive.typography.letterSpacing.tight}","lineHeight":"{primitive.typography.lineHeight.tight}"},"$description":"deprecated: use semantic.typography.title","$deprecated":"hds#483 — use semantic.typography.title"},"h2":{"$value":{"fontFamily":"{primitive.typography.family.display}","fontSize":"{primitive.typography.size.2xl}","fontWeight":"{primitive.typography.weight.bold}","letterSpacing":"{primitive.typography.letterSpacing.tight}","lineHeight":"{primitive.typography.lineHeight.tight}"},"$description":"deprecated: use semantic.typography.title","$deprecated":"hds#483 — use semantic.typography.title"},"h3":{"$value":{"fontFamily":"{primitive.typography.family.display}","fontSize":"{primitive.typography.size.2xl}","fontWeight":"{primitive.typography.weight.bold}","letterSpacing":"{primitive.typography.letterSpacing.tight}","lineHeight":"{primitive.typography.lineHeight.tight}"},"$description":"deprecated: use semantic.typography.title","$deprecated":"hds#483 — use semantic.typography.title"},"eyebrow":{"$value":{"fontFamily":"{primitive.typography.family.primary}","fontSize":"{primitive.typography.size.xs}","fontWeight":"{primitive.typography.weight.medium}","letterSpacing":"{primitive.typography.letterSpacing.normal}","lineHeight":"{primitive.typography.lineHeight.normal}"},"$description":"deprecated: use semantic.typography.caption","$deprecated":"hds#483 — use semantic.typography.caption"},"lineHeight":{"none":{"$type":"number","$value":"{primitive.typography.lineHeight.none}","$description":"Semantic alias for leading-none (1). Display text and badge spans."}}},"docs":{"$description":"Doc-page spacing scale: section, paragraph, inline rhythm.","space":{"$type":"dimension","section":{"$value":"{primitive.space.12}","$description":"48px between H2 sections — generous section break for doc pages."},"paragraph":{"$value":"{primitive.space.6}","$description":"24px between paragraphs — comfortable prose rhythm for long-form doc content."},"inline":{"$value":"{primitive.space.2}","$description":"8px inline cluster spacing — gap between metadata badges, inline icons, doc-page chips."}}},"accent":{"$type":"color","rest":{"$value":"{primitive.color.apple.500}","$description":"Default accent fill for interactive elements at rest — bright apple green. Pair with content.onAccent (a dark neutral).","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.apple.500}","Dark":"{primitive.color.apple.400}"}}}},"hover":{"$value":"{primitive.color.apple.600}","$description":"Accent fill on pointer hover.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.apple.600}","Dark":"{primitive.color.apple.500}"}}}},"pressed":{"$value":"{primitive.color.apple.700}","$description":"Accent fill during active press.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.apple.700}","Dark":"{primitive.color.apple.600}"}}}},"inactive":{"$value":"{primitive.color.neutral.400}","$description":"Accent fill for inactive or unselected accent elements.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.400}","Dark":"{primitive.color.neutral.600}"}}}},"disabled":{"$value":"{primitive.color.neutral.300}","$description":"Accent fill for disabled accent elements.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.300}","Dark":"{primitive.color.neutral.700}"}}}},"content":{"$value":"{primitive.color.apple.700}","$description":"Accent-intent text/icon color on neutral surfaces (a dark apple green) — pair with underline/weight for link affordance.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.apple.700}","Dark":"{primitive.color.apple.400}"}}}},"contentHover":{"$value":"{primitive.color.apple.800}","$description":"Accent content color on pointer hover.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.apple.800}","Dark":"{primitive.color.apple.300}"}}}},"subtle":{"$value":"{primitive.color.apple.50}","$description":"Low-emphasis accent tint for hover backgrounds and selection highlights.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.apple.50}","Dark":"{primitive.color.apple.900}"}}}}},"radius":{"action":{"$type":"dimension","$value":"{primitive.radius.8}","$description":"Corner radius for action elements (buttons, inputs, badges); Tailwind rounded-md resolves here. Override role.radius to reshape the system."},"control":{"$type":"dimension","$value":"{primitive.radius.4}","$description":"Corner radius for small control glyphs such as the checkbox box: not fully round, and distinct from semantic.radius.action (hds#242)."}},"borderWidth":{"default":{"$type":"dimension","$value":"{primitive.borderWidth.xs}","$description":"Default hairline border weight for surfaces and inputs."},"emphasis":{"$type":"dimension","$value":"{primitive.borderWidth.sm}","$description":"Stronger border weight for focus rings and active indicators."}},"shadow":{"$type":"shadow","subtle":{"$value":"0 1px 2px hsl(var(--primitive-shadow-color) / 0.04), 0 1px 1px hsl(var(--primitive-shadow-color) / 0.06)","$description":"Resting elevation shadow for raised surfaces (cards, inline panels)."},"floating":{"$value":"0 4px 6px hsl(var(--primitive-shadow-color) / 0.05), 0 10px 15px hsl(var(--primitive-shadow-color) / 0.08)","$description":"Hover/floating elevation for menus, popovers, and tooltips."},"overlay":{"$value":"0 10px 15px hsl(var(--primitive-shadow-color) / 0.08), 0 25px 50px hsl(var(--primitive-shadow-color) / 0.12)","$description":"Modal/dialog elevation for full-screen overlays."}},"elevation":{"$extensions":{"com.hirobius.hds":{"$type":"elevation"}},"flat":{"$description":"Flat surface (no shadow, hairline border) for embedded panels.","$extensions":{"com.hirobius.hds":{"$value":{"surface":"{semantic.color.surface.page}","shadow":null,"border":"{semantic.color.border.subtle}"}}}},"raised":{"$description":"Resting card / panel elevation.","$extensions":{"com.hirobius.hds":{"$value":{"surface":"{semantic.color.surface.raised}","shadow":"{semantic.shadow.subtle}","border":null}}}},"floating":{"$description":"Hover, menu, and popover elevation.","$extensions":{"com.hirobius.hds":{"$value":{"surface":"{semantic.color.surface.raised}","shadow":"{semantic.shadow.floating}","border":null}}}},"overlay":{"$description":"Modal, dialog, and drawer elevation.","$extensions":{"com.hirobius.hds":{"$value":{"surface":"{semantic.color.surface.overlay}","shadow":"{semantic.shadow.overlay}","border":null}}}}},"size":{"$type":"dimension","$description":"Sizing roles for control glyphs, avatars and table rows. Roles sharing a value stay separate so each can change (hds#242).","control":{"$description":"Interactive control glyph/element sizing (checkbox glyph box, radio dot, slider track/fill, code-block copy-button-matched footprint).","sm":{"$value":"{primitive.size.8}","$description":"Small control element — radio dot, slider fill bar height."},"md":{"$value":"{primitive.size.20}","$description":"Medium control element — checkbox glyph box, slider track wrapper height."},"lg":{"$value":"{primitive.size.32}","$description":"Large control footprint — code-block inline-wrapper min-height / copy-button-matched pre padding."}},"icon":{"$description":"Reserved icon-size role, parallel to the existing --hds-icon-* bridge (src/styles/theme.css), for future direct semantic.size.icon consumers.","sm":{"$value":"{primitive.size.16}","$description":"Small icon box — matches --hds-icon-small."},"md":{"$value":"{primitive.size.20}","$description":"Medium icon box — matches --hds-icon-medium."},"lg":{"$value":"{primitive.size.24}","$description":"Large icon box — matches --hds-icon-large."}},"avatar":{"$value":"{primitive.size.40}","$description":"Avatar size (width and height) for activity feeds and identity glyphs. Same pixels as row.compact today, a separate role (hds#242)."},"tile":{"$value":"{primitive.size.120}","$description":"Minimum height of a metric tile, one height for every tile so rows line up (hds#403)."},"row":{"$description":"Table row minimum height by density.","compact":{"$value":"{primitive.size.40}","$description":"Compact-density row minimum height."},"comfortable":{"$value":"{primitive.size.48}","$description":"Comfortable-density row minimum height."}}},"zIndex":{"$type":"number","$description":"Named stacking layers, aliasing the numeric primitive.zIndex scale (hds#242).","control":{"$value":"{primitive.zIndex.10}","$description":"Raises an interactive control (e.g. a native range input) above its visual decoration for hit-testing."},"sticky":{"$value":"{primitive.zIndex.100}","$description":"Sticky-positioned elements, such as a table header row."}}}`), sa = { nav: { bg: { $type: "color", $value: "{semantic.color.surface.page}", $description: "Nav bar background fill." }, bgActive: { $type: "color", $value: "{semantic.accent.subtle}", $description: "Nav item background fill when active or selected." }, borderActive: { $type: "color", $value: "{semantic.color.surface.accent}", $description: "Nav item border color when active or selected." }, text: { $type: "color", $value: "{semantic.color.content.secondary}", $description: "Nav item text color at rest." }, textActive: { $type: "color", $value: "{semantic.color.content.primary}", $description: "Nav item text color when active or selected." }, height: { $type: "dimension", $value: "{primitive.space.16}", $description: "Nav bar height." }, paddingX: { $type: "dimension", $value: "{primitive.space.6}", $description: "Horizontal padding inside nav items." }, paddingY: { $type: "dimension", $value: "{primitive.space.2}", $description: "Vertical padding inside nav items." } }, tag: { background: { $type: "color", $value: "{semantic.accent.subtle}", $description: "Base tag surface color." }, text: { $type: "color", $value: "{semantic.color.content.primary}", $description: "Default tag text color." }, border: { $type: "color", $value: "{semantic.color.border.default}", $description: "Default tag border color." }, radius: { $type: "dimension", $value: "{primitive.radius.full}", $description: "Pill radius for the tag surface." }, fontSize: { $type: "dimension", $value: "{primitive.typography.size.xs}", $description: "Tag type size." }, fontWeight: { $type: "fontWeight", $value: "{primitive.typography.weight.medium}", $description: "Tag label weight." }, lineHeight: { $type: "number", $value: "{primitive.typography.lineHeight.normal}", $description: "Readable label rhythm for tags." }, minWidth: { $type: "dimension", $value: "{primitive.size.48}", $description: "Minimum tag width." }, minHeight: { $type: "dimension", $value: "{primitive.space.6}", $description: "Minimum tag height." }, paddingX: { $type: "dimension", $value: "{primitive.space.3}", $description: "Horizontal padding inside the pill." }, paddingY: { $type: "dimension", $value: "{primitive.space.2}", $description: "Vertical padding inside the pill." }, activeText: { $type: "color", $value: "{semantic.color.content.onAccent}", $description: "Text color when the tag is active." }, activeBackground: { $type: "color", $value: "{semantic.accent.rest}", $description: "Active tag fill color." }, activeBorder: { $type: "color", $value: "{semantic.accent.rest}", $description: "Active tag border color." }, activeHover: { $type: "color", $value: "{semantic.accent.hover}", $description: "Active tag hover fill color." } }, badge: { fontSize: { $type: "dimension", $value: "{primitive.typography.size.xs}", $description: "Badge type size." }, fontWeight: { $type: "fontWeight", $value: "{primitive.typography.weight.medium}", $description: "Badge label weight." }, text: { $type: "color", $value: "{semantic.color.content.primary}", $description: "Badge text color." }, bg: { $type: "color", $value: "{semantic.color.feedback.bg.info}", $extensions: { "com.figma.variables": { modes: { Light: "{semantic.color.feedback.bg.info}", Dark: "{semantic.color.feedback.bg.info}" } } }, $description: "Badge background color." }, radius: { $type: "dimension", $value: "{primitive.radius.4}", $description: "Small rounded radius for badges." }, height: { $type: "dimension", $value: "{primitive.size.20}", $description: "Badge height." }, minWidth: { $type: "dimension", $value: "{primitive.size.20}", $description: "Badge minimum width." }, paddingY: { $type: "dimension", $value: "{primitive.space.px2}", $description: "Vertical padding inside the badge." }, paddingX: { $type: "dimension", $value: "{primitive.space.px6}", $description: "Horizontal padding inside the badge." } }, button: { bg: { $type: "color", $value: "{semantic.color.surface.accent}", $description: "Primary button fill." }, bgHover: { $type: "color", $value: "{semantic.accent.hover}", $description: "Primary button hover fill." }, text: { $type: "color", $value: "{semantic.color.content.onAccent}", $description: "Primary button text color." }, radius: { $type: "dimension", $value: "{semantic.radius.action}", $description: "Button corner radius." }, paddingX: { $type: "dimension", $value: "{primitive.space.4}", $description: "Horizontal button padding." }, paddingY: { $type: "dimension", $value: "{primitive.space.3}", $description: "Vertical button padding." }, size: { sm: { paddingX: { $type: "dimension", $value: "{primitive.space.2}", $description: "Small button horizontal padding (8px)." }, paddingY: { $type: "dimension", $value: "{primitive.space.1}", $description: "Small button vertical padding (4px)." }, fontSize: { $type: "dimension", $value: "{primitive.typography.size.xs}", $description: "Small button label size (12px, hds#283: was 13px)." }, iconSize: { $type: "dimension", $value: "{primitive.size.12}", $description: "Small button icon slot size (12px)." }, height: { $type: "dimension", $value: "{primitive.space.7}", $description: "Small button height (28px)." }, itemSpacing: { $type: "dimension", $value: "{primitive.space.1}", $description: "Small button icon-to-label gap (4px)." } }, md: { paddingX: { $type: "dimension", $value: "{primitive.space.4}", $description: "Medium button horizontal padding (16px)." }, paddingY: { $type: "dimension", $value: "{primitive.space.3}", $description: "Medium button vertical padding (12px)." }, fontSize: { $type: "dimension", $value: "{primitive.typography.size.sm}", $description: "Medium button label size (14px, hds#283: was 15px)." }, iconSize: { $type: "dimension", $value: "{primitive.size.16}", $description: "Medium button icon slot size (16px)." }, height: { $type: "dimension", $value: "{primitive.size.40}", $description: "Medium button height (40px)." }, itemSpacing: { $type: "dimension", $value: "{primitive.space.2}", $description: "Medium button icon-to-label gap (8px)." } }, lg: { paddingX: { $type: "dimension", $value: "{primitive.space.6}", $description: "Large button horizontal padding (24px)." }, paddingY: { $type: "dimension", $value: "{primitive.space.4}", $description: "Large button vertical padding (16px)." }, fontSize: { $type: "dimension", $value: "{primitive.typography.size.base}", $description: "Large button label size (16px, hds#283: was 17px)." }, iconSize: { $type: "dimension", $value: "{primitive.size.20}", $description: "Large button icon slot size (20px)." }, height: { $type: "dimension", $value: "{primitive.size.48}", $description: "Large button height (48px)." }, itemSpacing: { $type: "dimension", $value: "{primitive.space.2}", $description: "Large button icon-to-label gap (8px)." } } }, primary: { textDisabled: { $type: "color", $value: "{semantic.color.content.onAccent}", $extensions: { "com.figma.variables": { modes: { Light: "{semantic.color.content.onAccent}", Dark: "{semantic.color.content.disabled}" } } }, $description: "Disabled primary button text color." }, bgDisabled: { $type: "color", $value: "{semantic.color.surface.accentSubtle}", $description: "Disabled primary button fill." } }, secondary: { bg: { rest: { $type: "color", $value: "{semantic.color.surface.page}", $description: "Secondary button fill." }, hover: { $type: "color", $value: "{semantic.color.surface.raised}", $description: "Secondary button hover fill." }, pressed: { $type: "color", $value: "{semantic.color.surface.overlay}", $description: "Secondary button pressed fill." } }, border: { rest: { $type: "color", $value: "{semantic.color.border.interactive}", $description: "Secondary button border." }, hover: { $type: "color", $value: "{semantic.color.border.interactive}", $description: "Secondary button hover border." }, pressed: { $type: "color", $value: "{semantic.color.border.interactive}", $description: "Secondary button pressed border." }, disabled: { $type: "color", $value: "{semantic.color.border.subdued}", $description: "Secondary button disabled border." } }, text: { $type: "color", $value: "{semantic.color.content.primary}", $description: "Secondary button text color." } } }, input: { bg: { $type: "color", $value: "{semantic.color.surface.raised}" }, text: { $type: "color", $value: "{semantic.color.content.primary}" }, border: { $type: "color", $value: "{semantic.color.border.interactive}" }, borderError: { $type: "color", $value: "{semantic.color.feedback.error}" }, radius: { $type: "dimension", $value: "{semantic.radius.action}" }, paddingX: { $type: "dimension", $value: "{primitive.space.4}" }, paddingY: { $type: "dimension", $value: "{primitive.space.3}" } }, card: { bg: { $type: "color", $value: "{semantic.color.surface.raised}" }, border: { $type: "color", $value: "{semantic.color.border.default}" }, radius: { $type: "dimension", $value: "{primitive.radius.8}" }, padding: { $type: "dimension", $value: "{primitive.space.6}" }, gap: { $type: "dimension", $value: "{primitive.space.2}" } }, lightbox: { backdrop: { blur: { $type: "dimension", $value: "{primitive.blur.16}", $description: "Backdrop blur applied behind fullscreen image lightboxes." } } } }, la = { $description: "Shadcn-style role aliases mapping to semantic tokens. Compiled to --role-* CSS vars.", background: { $type: "color", $value: "{semantic.color.surface.page}", $description: "Page background. shadcn role: background." }, foreground: { $type: "color", $value: "{semantic.color.content.primary}", $description: "Default text on background. shadcn role: foreground." }, card: { $type: "color", $value: "{semantic.color.surface.raised}", $description: "Card surface. shadcn role: card." }, "card-foreground": { $type: "color", $value: "{semantic.color.content.primary}", $description: "Text on card. shadcn role: card-foreground." }, popover: { $type: "color", $value: "{semantic.color.surface.overlay}", $description: "Popover/menu surface. shadcn role: popover." }, scrim: { $type: "color", $value: "{semantic.color.surface.scrim}", $description: "Modal backdrop colour role. Apply alpha in the class, e.g. bg-scrim/60." }, "pressed-overlay": { $type: "color", $value: "{semantic.color.state.pressed.overlay}", $description: "Pressed-state overlay colour role. Apply alpha in the class, e.g. inset-shadow-pressed-overlay/5." }, "popover-foreground": { $type: "color", $value: "{semantic.color.content.primary}", $description: "Text on popover. shadcn role: popover-foreground." }, primary: { $type: "color", $value: "{semantic.color.surface.accent}", $description: "Primary action surface. shadcn role: primary." }, "primary-foreground": { $type: "color", $value: "{semantic.color.content.onAccent}", $description: "Text/icons on primary surface. shadcn role: primary-foreground." }, secondary: { $type: "color", $value: "{semantic.color.surface.raised}", $description: "Secondary action surface. shadcn role: secondary." }, "secondary-foreground": { $type: "color", $value: "{semantic.color.content.primary}", $description: "Text on secondary surface. shadcn role: secondary-foreground." }, muted: { $type: "color", $value: "{semantic.color.surface.overlay}", $description: "Muted/quiet bg (skeletons, disabled inputs). shadcn role: muted." }, "muted-foreground": { $type: "color", $value: "{semantic.color.content.secondary}", $description: "Muted text. shadcn role: muted-foreground." }, accent: { $type: "color", $value: "{semantic.color.surface.accentSubtle}", $description: "Hover/active tinted bg. shadcn role: accent." }, "accent-foreground": { $type: "color", $value: "{semantic.color.content.accent}", $description: "Text on accent surface. shadcn role: accent-foreground." }, destructive: { $type: "color", $value: "{semantic.color.feedback.error}", $description: "Destructive action surface. shadcn role: destructive." }, "destructive-foreground": { $type: "color", $value: "{semantic.color.content.inverse}", $description: "Text on destructive surface. shadcn role: destructive-foreground." }, border: { $type: "color", $value: "{semantic.color.border.default}", $description: "Default border. shadcn role: border." }, input: { $type: "color", $value: "{semantic.color.border.interactive}", $description: "Input field border. shadcn role: input." }, ring: { $type: "color", $value: "{semantic.color.border.accent}", $description: "Focus ring color. shadcn role: ring." }, radius: { $type: "dimension", $value: "{semantic.radius.action}", $description: "Default border radius. shadcn role: radius." } }, ca = {
+const aa = "https://www.designtokens.org/schemas/2025.10/format.json", ra = "Adrian Milsap hirobius design tokens - W3C DTCG 2025.10 compliant, Figma SDS architecture", na = /* @__PURE__ */ JSON.parse(`{"$description":"Base values used as inputs to derived token layers.","color":{"$type":"color","neutral":{"50":{"$value":"#fafafa","$description":"Specific value within the neutral range at a defined lightness step."},"100":{"$value":"#f5f5f5","$description":"Specific value within the neutral range at a defined lightness step."},"200":{"$value":"#e5e5e5","$description":"Specific value within the neutral range at a defined lightness step."},"300":{"$value":"#d4d4d4","$description":"Specific value within the neutral range at a defined lightness step."},"400":{"$value":"#a3a3a3","$description":"Specific value within the neutral range at a defined lightness step."},"500":{"$value":"#737373","$description":"Specific value within the neutral range at a defined lightness step."},"600":{"$value":"#525252","$description":"Specific value within the neutral range at a defined lightness step."},"700":{"$value":"#404040","$description":"Specific value within the neutral range at a defined lightness step."},"800":{"$value":"#262626","$description":"Specific value within the neutral range at a defined lightness step."},"850":{"$value":"#1a1a1a","$description":"Specific value within the neutral range at a defined lightness step."},"900":{"$value":"#111111","$description":"Specific value within the neutral range at a defined lightness step."},"950":{"$value":"#0a0a0a","$description":"Specific value within the neutral range at a defined lightness step."},"$description":"Discrete values within the neutral range at defined lightness steps.","white":{"$value":"#ffffff","$description":"Specific value within the neutral range at a defined lightness step."},"black":{"$value":"#000000","$description":"Specific value within the neutral range at a defined lightness step."}},"blue":{"50":{"$value":"oklch(0.96 0.03 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"100":{"$value":"oklch(0.92 0.04 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"200":{"$value":"oklch(0.88 0.07 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"300":{"$value":"oklch(0.70 0.2903 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"400":{"$value":"oklch(0.65 0.2903 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"450":{"$value":"oklch(0.56 0.29 266.60)","$description":"Specific value within the blue range at a defined lightness step."},"500":{"$value":"#1E2EFD","$description":"Specific value within the blue range at a defined lightness step."},"600":{"$value":"oklch(0.45 0.2903 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"700":{"$value":"oklch(0.44 0.2903 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"800":{"$value":"oklch(0.30 0.07 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"900":{"$value":"oklch(0.22 0.05 266.54)","$description":"Specific value within the blue range at a defined lightness step."},"$description":"Discrete values within the blue range at defined lightness steps."},"red":{"50":{"$value":"#fef2f2","$description":"Specific value within the red range at a defined lightness step."},"400":{"$value":"#f87171","$description":"Specific value within the red range at a defined lightness step."},"700":{"$value":"#b91c1c","$description":"Specific value within the red range at a defined lightness step."},"950":{"$value":"#450a0a","$description":"Specific value within the red range at a defined lightness step."},"$description":"Discrete values within the red range at defined lightness steps."},"green":{"50":{"$value":"#ecfdf5","$description":"Specific value within the green range at a defined lightness step."},"400":{"$value":"#34d399","$description":"Specific value within the green range at a defined lightness step."},"700":{"$value":"#047857","$description":"Specific value within the green range at a defined lightness step."},"950":{"$value":"#022c22","$description":"Specific value within the green range at a defined lightness step."},"$description":"Discrete values within the green range at defined lightness steps."},"graphite":{"50":{"$value":"#f5f4f4","$description":"Graphite accent tint — faintest step."},"100":{"$value":"#e9e7e8","$description":"Graphite accent — very light warm tint."},"200":{"$value":"#d4d0d2","$description":"Graphite accent — light warm-grey; dark-mode rest accent fill."},"300":{"$value":"#b2abae","$description":"Graphite accent — soft mid-light step; dark-mode hover/link."},"400":{"$value":"#8b8488","$description":"Graphite accent — mid warm-grey step."},"500":{"$value":"#655e62","$description":"Graphite accent — mid step."},"600":{"$value":"#544d51","$description":"Graphite accent — mid-dark step."},"700":{"$value":"#433a3f","$description":"Graphite accent rest — the warm charcoal brand accent; white text as a fill (AA)."},"800":{"$value":"#352e32","$description":"Graphite accent — deep step; light-mode hover."},"900":{"$value":"#2a2428","$description":"Graphite accent — darkest usable step; light-mode pressed, dark-mode on-accent text."},"950":{"$value":"#19161a","$description":"Graphite accent — near-black warm substrate."},"$description":"Graphite, the warm-charcoal brand accent scale. Feedback colors keep their own scales."},"mauve":{"50":{"$value":"#fff0f6","$description":"Mauve tint, faintest step."},"100":{"$value":"#f4e2ea","$description":"Mauve step 100, lightness-matched to graphite 100."},"200":{"$value":"#e1cad4","$description":"Mauve step 200, lightness-matched to graphite 200."},"300":{"$value":"#c0a4b1","$description":"Mauve step 300, lightness-matched to graphite 300."},"400":{"$value":"#9d7b8a","$description":"Mauve step 400, lightness-matched to graphite 400."},"500":{"$value":"#734b5e","$description":"Mauve anchor (#734B5E). Reserved; not mapped to any semantic token yet."},"600":{"$value":"#674254","$description":"Mauve step 600, lightness-matched to graphite 600."},"700":{"$value":"#523141","$description":"Mauve step 700, lightness-matched to graphite 700."},"800":{"$value":"#432634","$description":"Mauve step 800, lightness-matched to graphite 800."},"900":{"$value":"#361d29","$description":"Mauve step 900, lightness-matched to graphite 900."},"950":{"$value":"#240f1a","$description":"Mauve, near-black substrate."},"$description":"Mauve, a reserved secondary scale lightness-matched to graphite. Defined for exploration; no semantic token uses it yet."},"violet":{"50":{"$value":"#f5f3ff","$description":"Specific value within the violet range at a defined lightness step."},"400":{"$value":"#a78bfa","$description":"Specific value within the violet range at a defined lightness step."},"700":{"$value":"#6d28d9","$description":"Specific value within the violet range at a defined lightness step."},"950":{"$value":"#2e1065","$description":"Specific value within the violet range at a defined lightness step."},"$description":"Discrete values within the violet range at defined lightness steps."},"lilac":{"50":{"$value":"#f7f4fe","$description":"Specific value within the lilac range at a defined lightness step."},"100":{"$value":"#efe9fd","$description":"Specific value within the lilac range at a defined lightness step."},"200":{"$value":"#ddd0fb","$description":"Specific value within the lilac range at a defined lightness step."},"300":{"$value":"#c3aef6","$description":"Specific value within the lilac range at a defined lightness step."},"400":{"$value":"#a585ee","$description":"Specific value within the lilac range at a defined lightness step."},"450":{"$value":"#9a6fe8","$description":"Specific value within the lilac range at a defined lightness step."},"500":{"$value":"#6f3fd4","$description":"Lilac accent rest — AA for white text on page and card surfaces."},"600":{"$value":"#5f33c0","$description":"Specific value within the lilac range at a defined lightness step."},"700":{"$value":"#4f2aa3","$description":"Specific value within the lilac range at a defined lightness step."},"800":{"$value":"#3a1f78","$description":"Specific value within the lilac range at a defined lightness step."},"900":{"$value":"#2a1659","$description":"Specific value within the lilac range at a defined lightness step."},"$description":"Lilac ramp at fixed lightness steps. Mirrors the blue ramp's stops; available to brand overlays."},"amber":{"50":{"$value":"#fffbeb","$description":"Specific value within the amber range at a defined lightness step."},"400":{"$value":"#fbbf24","$description":"Specific value within the amber range at a defined lightness step."},"800":{"$value":"#92400e","$description":"Specific value within the amber range at a defined lightness step."},"950":{"$value":"#451a03","$description":"Specific value within the amber range at a defined lightness step."},"$description":"Discrete values within the amber range at defined lightness steps."},"stone":{"100":{"$value":"#F5EFE7","$description":"Stone 100 — near-white warm tint; accent-subtle surface."},"400":{"$value":"#D0B492","$description":"Stone 400 — light warm tone; dark-mode pressed accent."},"450":{"$value":"#BC9D7E","$description":"Stone 450 — medium warm tone; dark-mode hover accent."},"500":{"$value":"#A8896A","$description":"Stone 500 — mid warm tone; dark-mode rest accent."},"600":{"$value":"#8B6F47","$description":"Stone 600 — primary warm stone; light-mode rest accent and CTA surface."},"700":{"$value":"#75593A","$description":"Stone 700 — darker warm stone; light-mode hover accent."},"800":{"$value":"#5C432A","$description":"Stone 800 — deep warm stone; light-mode pressed accent."},"950":{"$value":"#3A2E1F","$description":"Stone 950 — near-black warm tone; dark-mode subtle accent surface."},"$description":"Warm stone/brown palette for Concrete Creations brand accent ramp. PLACEHOLDER values pending final brand identity work."},"projectBrand":{"microsoftGameDev":{"100":{"$value":"#E5E5FC","$description":"Light support tone for the Microsoft Game Dev project brand."},"500":{"$value":"#6d31fb","$description":"Primary accent tone for the Microsoft Game Dev project brand."},"900":{"$value":"oklch(0.22 0.16 304)","$description":"Dark support tone for the Microsoft Game Dev project brand."},"$description":"Project-specific brand colors used in portfolio contexts."},"$description":"Project-specific brand color families reserved for portfolio surfaces."}},"space":{"0":{"$value":{"value":0,"unit":"px"}},"1":{"$value":{"value":4,"unit":"px"}},"2":{"$value":{"value":8,"unit":"px"}},"3":{"$value":{"value":12,"unit":"px"}},"4":{"$value":{"value":16,"unit":"px"}},"5":{"$value":{"value":20,"unit":"px"}},"6":{"$value":{"value":24,"unit":"px"}},"7":{"$value":{"value":28,"unit":"px"}},"8":{"$value":{"value":32,"unit":"px"}},"10":{"$value":{"value":40,"unit":"px"}},"12":{"$value":{"value":48,"unit":"px"}},"16":{"$value":{"value":64,"unit":"px"}},"20":{"$value":{"value":80,"unit":"px"}},"24":{"$value":{"value":96,"unit":"px"}},"32":{"$value":{"value":128,"unit":"px"}},"$type":"dimension","$description":"Dimensional increments within the 4px base-unit spatial system.","px1":{"$value":{"value":1,"unit":"px"}},"px2":{"$value":{"value":2,"unit":"px"}},"px6":{"$value":{"value":6,"unit":"px"}},"px10":{"$value":{"value":10,"unit":"px"}}},"blur":{"8":{"$value":{"value":8,"unit":"px"},"$description":"8px blur step."},"16":{"$value":{"value":16,"unit":"px"},"$description":"Fullscreen backdrop blur for portfolio lightbox overlays."},"$type":"dimension","$description":"Backdrop blur strengths for frosted overlays and fullscreen media treatments."},"radius":{"0":{"$value":{"value":0,"unit":"px"}},"2":{"$value":{"value":2,"unit":"px"}},"4":{"$value":{"value":4,"unit":"px"}},"8":{"$value":{"value":8,"unit":"px"}},"12":{"$value":{"value":12,"unit":"px"}},"$type":"dimension","full":{"$value":{"value":9999,"unit":"px"}}},"typography":{"family":{"$type":"fontFamily","primary":{"$value":["Plus Jakarta Sans","system-ui","-apple-system","BlinkMacSystemFont","Segoe UI","sans-serif"],"$description":"Self-hosted Plus Jakarta Sans (OFL) body typeface; falls back to system-ui sans-serif stack."},"display":{"$value":["Plus Jakarta Sans","system-ui","-apple-system","BlinkMacSystemFont","Segoe UI","sans-serif"],"$description":"Display face: Plus Jakarta Sans Bold (OFL), bound to the display and title composites."},"mono":{"$value":["IBM Plex Mono","Courier New","monospace"],"$description":"Monospace face: IBM Plex Mono. Falls back to Courier New, monospace."}},"size":{"$type":"dimension","xs":{"$value":{"value":12,"unit":"px"},"$description":"Tailwind 4 default text-xs (hds#283 ramp)."},"sm":{"$value":{"value":14,"unit":"px"},"$description":"Tailwind 4 default text-sm (hds#283 ramp)."},"base":{"$value":{"value":16,"unit":"px"},"$description":"Tailwind 4 default text-base (hds#283 ramp)."},"lg":{"$value":{"value":18,"unit":"px"},"$description":"Tailwind 4 default text-lg (hds#283 ramp)."},"xl":{"$value":{"value":20,"unit":"px"},"$description":"Tailwind 4 default text-xl (hds#283 ramp)."},"2xl":{"$value":{"value":24,"unit":"px"},"$description":"Tailwind 4 default text-2xl (hds#283 ramp)."},"3xl":{"$value":{"value":30,"unit":"px"},"$description":"Tailwind 4 default text-3xl (hds#283 ramp)."},"4xl":{"$value":{"value":36,"unit":"px"},"$description":"Tailwind 4 default text-4xl (hds#283 ramp)."},"5xl":{"$value":{"value":48,"unit":"px"},"$description":"Tailwind 4 default text-5xl (hds#283 ramp)."},"6xl":{"$value":{"value":60,"unit":"px"},"$description":"Swiss-canon display size (hds#283 ramp). Static desktop value; fluid in theme.css. Tailwind 4 default text-6xl."},"code":{"$value":{"value":13,"unit":"px"},"$description":"13px code size. The mono role (hds#485): one px below ui so code sits level with 14px prose."}},"weight":{"$type":"fontWeight","regular":{"$value":400},"medium":{"$value":500},"bold":{"$value":700}},"lineHeight":{"$type":"number","compact":{"$value":0.95},"none":{"$value":1},"tight":{"$value":1.25},"snug":{"$value":1.375,"$description":"Swiss-canon snug rhythm (10t-5). Used by h2/h3 composites for tight-but-readable heading lines."},"normal":{"$value":1.5},"relaxed":{"$value":1.625,"$description":"Swiss-canon relaxed rhythm (10t-5). Used by body/small/mono composites for long-form prose comfort."},"display":{"$value":1.05,"$description":"Display role leading (hds#485)."},"body":{"$value":1.6,"$description":"Body role leading (hds#485)."}},"letterSpacing":{"$type":"dimension","tight":{"$value":{"value":-0.01,"unit":"em"}},"normal":{"$value":{"value":0,"unit":"em"}},"caps":{"$value":{"value":0.06,"unit":"em"},"$description":"All-caps tracking for eyebrow / kicker labels. Always pairs with text-transform: uppercase."}}},"duration":{"$type":"duration","instant":{"$value":{"value":100,"unit":"ms"},"$description":"Fixed elapsed time interval in milliseconds."},"short":{"$value":{"value":150,"unit":"ms"},"$description":"Fixed elapsed time interval in milliseconds."},"medium":{"$value":{"value":250,"unit":"ms"},"$description":"Fixed elapsed time interval in milliseconds."},"long":{"$value":{"value":400,"unit":"ms"},"$description":"Fixed elapsed time interval in milliseconds."}},"easing":{"$type":"cubicBezier","emphasized":{"$value":[0.4,0,0.2,1],"$description":"Cubic bezier with balanced input and output tangents."},"decelerate":{"$value":[0,0,0.2,1],"$description":"Cubic bezier with steep initial gain and constrained tail velocity."},"accelerate":{"$value":[0.4,0,1,1],"$description":"Cubic bezier with restrained initial gain and steep terminal velocity."},"elastic":{"$value":[0.34,1.56,0.64,1],"$description":"Spring response defined by stiffness, damping, and mass parameters.","$extensions":{"com.hirobius.hds":{"$type":"spring","$value":{"type":"spring","stiffness":300,"damping":20,"mass":1},"bezierSource":"The cubicBezier is easeOutBack (easings.net), chosen as a stand-in for the spring, not fitted to it: both overshoot once, the curve by about 10% and spring(300, 20, 1) by about 11%."}}}},"shadow":{"color":{"$type":"color","$value":"220 13% 18%","$description":"HSL channels for shadow-color alpha compositing. Light: cool neutral; dark: black.","$extensions":{"com.figma.variables":{"modes":{"Light":"220 13% 18%","Dark":"0 0% 0%"}}}}},"breakpoint":{"$description":"Discrete viewport thresholds expressed as dimensions.","xs":{"$type":"dimension","$value":{"value":375,"unit":"px"}},"sm":{"$type":"dimension","$value":{"value":640,"unit":"px"}},"md":{"$type":"dimension","$value":{"value":768,"unit":"px"}},"lg":{"$type":"dimension","$value":{"value":1024,"unit":"px"}},"xl":{"$type":"dimension","$value":{"value":1280,"unit":"px"}}},"size":{"8":{"$type":"dimension","$value":{"value":8,"unit":"px"},"$description":"8px size step."},"10":{"$type":"dimension","$value":{"value":10,"unit":"px"},"$description":"10px size step."},"12":{"$type":"dimension","$value":{"value":12,"unit":"px"},"$description":"12px size step."},"16":{"$type":"dimension","$value":{"value":16,"unit":"px"},"$description":"16px size step."},"20":{"$type":"dimension","$value":{"value":20,"unit":"px"},"$description":"20px size step."},"24":{"$type":"dimension","$value":{"value":24,"unit":"px"},"$description":"24px size step."},"32":{"$type":"dimension","$value":{"value":32,"unit":"px"},"$description":"32px size step."},"40":{"$type":"dimension","$value":{"value":40,"unit":"px"},"$description":"40px size step."},"48":{"$type":"dimension","$value":{"value":48,"unit":"px"},"$description":"48px size step."},"64":{"$type":"dimension","$value":{"value":64,"unit":"px"},"$description":"64px size step."},"80":{"$type":"dimension","$value":{"value":80,"unit":"px"},"$description":"80px size step."},"96":{"$type":"dimension","$value":{"value":96,"unit":"px"},"$description":"96px size step."},"120":{"$type":"dimension","$value":{"value":120,"unit":"px"},"$description":"120px size step. Backs semantic.size.tile."},"$description":"Unaliased dimensional values.","interactive":{"$description":"Interactive control size minimums.","min":{"$type":"dimension","$value":{"value":44,"unit":"px"},"$description":"Minimum interactive hit target size."},"minCompact":{"$type":"dimension","$value":{"value":24,"unit":"px"},"$description":"Compact inline control target minimum, e.g. a chip's remove button: WCAG 2.2 AA (2.5.8), not the 44px AAA floor (2.5.5)."}},"width":{"96":{"$type":"dimension","$value":{"value":96,"unit":"px"},"$description":"96px width step."},"280":{"$type":"dimension","$value":{"value":280,"unit":"px"},"$description":"Docs-shell rail width (hds#280): our own number, not HeroUI's 268px; fits the longest top-level nav label with room."},"760":{"$type":"dimension","$value":{"value":760,"unit":"px"}},"1200":{"$type":"dimension","$value":{"value":1200,"unit":"px"}},"50ch":{"$type":"dimension","$value":{"value":50,"unit":"ch"}}}},"grid":{"columns":{"1":{"$type":"number","$value":1},"2":{"$type":"number","$value":2},"3":{"$type":"number","$value":3}}},"zIndex":{"0":{"$type":"number","$value":0},"10":{"$type":"number","$value":10},"100":{"$type":"number","$value":100},"1000":{"$type":"number","$value":1000},"$description":"Discrete stacking levels along the z axis."},"borderWidth":{"$type":"dimension","xs":{"$value":{"value":1,"unit":"px"}},"sm":{"$value":{"value":2,"unit":"px"}},"md":{"$value":{"value":4,"unit":"px"}}}}`), oa = /* @__PURE__ */ JSON.parse(`{"motion":{"$type":"transition","$extensions":{"com.hirobius.hds":{"$type":"motion"}},"productive":{"$value":{"duration":"{primitive.duration.short}","delay":{"value":0,"unit":"ms"},"timingFunction":"{primitive.easing.decelerate}"},"$description":"For micro-interactions and status changes. No deformation."},"expressive":{"$value":{"duration":"{primitive.duration.medium}","delay":{"value":0,"unit":"ms"},"timingFunction":"{primitive.easing.elastic}"},"$description":"For teaching moments and significant UI entries. Includes physics-based squish."},"spatial":{"$value":{"duration":"{primitive.duration.long}","delay":{"value":0,"unit":"ms"},"timingFunction":"{primitive.easing.emphasized}"},"$description":"For elements traveling long distances across the viewport."},"exit":{"$value":{"duration":"{primitive.duration.instant}","delay":{"value":0,"unit":"ms"},"timingFunction":"{primitive.easing.accelerate}"},"$description":"For elements being removed from the DOM."},"distance":{"$type":"dimension","$value":"{primitive.space.6}","$description":"Scroll-reveal translateY travel distance. Equals semantic.space.scale.md today, but names motion travel, not a spacing tier (hds#242)."}},"color":{"$type":"color","surface":{"page":{"$value":"{primitive.color.neutral.white}","$description":"Main page background","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.white}","Dark":"{primitive.color.neutral.black}"}}}},"raised":{"$value":"{primitive.color.neutral.50}","$description":"Subtle elevated surface (cards, sections)","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.50}","Dark":"{primitive.color.neutral.950}"}}}},"overlay":{"$value":"{primitive.color.neutral.100}","$description":"Deeper surface layer","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.100}","Dark":"{primitive.color.neutral.850}"}}}},"scrim":{"$value":"{primitive.color.neutral.900}","$description":"Opaque modal backdrop, near-black in both themes. Apply alpha in the class (bg-scrim/60), not here.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.900}","Dark":"{primitive.color.neutral.black}"}}}},"inverse":{"$value":"{primitive.color.neutral.black}","$description":"Inverted background for contrast sections","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.black}","Dark":"{primitive.color.neutral.white}"}}}},"accent":{"$value":"{primitive.color.graphite.700}","$description":"Accent fill, warm graphite. Dark in light mode, light warm-grey in dark mode; pair with content.onAccent.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.graphite.700}","Dark":"{primitive.color.graphite.200}"}}}},"accentSubtle":{"$value":"{primitive.color.graphite.50}","$description":"Faint accent tint for hover states or highlights.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.graphite.50}","Dark":"{primitive.color.graphite.800}"}}}},"hover":{"$value":"{primitive.color.neutral.100}","$description":"Background for a hovered interactive surface (menu items, chips, tertiary buttons).","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.100}","Dark":"{primitive.color.neutral.900}"}}}},"pressed":{"$value":"{primitive.color.neutral.50}","$description":"Background for an actively pressed interactive surface.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.50}","Dark":"{primitive.color.neutral.950}"}}}},"selected":{"$value":"{primitive.color.neutral.200}","$description":"Background for a persistently selected item (active tab, checked row).","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.200}","Dark":"{primitive.color.neutral.800}"}}}},"muted":{"$value":"{primitive.color.neutral.100}","$description":"Muted background for low-emphasis content blocks.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.100}","Dark":"{primitive.color.neutral.900}"}}}},"sunken":{"$value":"{primitive.color.neutral.200}","$description":"Recessed background for inset wells (inputs, code blocks, nested panels).","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.200}","Dark":"{primitive.color.neutral.850}"}}}}},"content":{"primary":{"$value":"{primitive.color.neutral.900}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.900}","Dark":"{primitive.color.neutral.100}"}}}},"secondary":{"$value":"{primitive.color.neutral.600}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.600}","Dark":"{primitive.color.neutral.400}"}}}},"disabled":{"$value":"{primitive.color.neutral.300}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.300}","Dark":"{primitive.color.neutral.600}"}}}},"inverse":{"$value":"{primitive.color.neutral.100}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.100}","Dark":"{primitive.color.neutral.900}"}}}},"accent":{"$value":"{primitive.color.graphite.700}","$description":"Accent-intent text/icon color — graphite, legible on page and card surfaces. Pair with underline/weight for link affordance.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.graphite.700}","Dark":"{primitive.color.graphite.300}"}}}},"onAccent":{"$value":"{primitive.color.neutral.50}","$description":"Text and icons on accent fills: near-white in light mode, dark graphite in dark mode.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.50}","Dark":"{primitive.color.graphite.900}"}}}},"success":{"$value":"{primitive.color.green.700}","$description":"Success-toned text/icon color, independent of feedback banners.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.green.700}","Dark":"{primitive.color.green.400}"}}}},"warning":{"$value":"{primitive.color.amber.800}","$description":"Warning-toned text/icon color, independent of feedback banners.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.amber.800}","Dark":"{primitive.color.amber.400}"}}}},"danger":{"$value":"{primitive.color.red.700}","$description":"Danger-toned text/icon color, independent of feedback banners.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.red.700}","Dark":"{primitive.color.red.400}"}}}}},"border":{"default":{"$value":"{primitive.color.neutral.200}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.200}","Dark":"{primitive.color.neutral.700}"}}}},"interactive":{"$value":"{primitive.color.neutral.500}","$description":"Border for interactive control boundaries (inputs, selects, secondary buttons); meets the WCAG 1.4.11 3:1 non-text contrast floor.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.500}","Dark":"{primitive.color.neutral.500}"}}}},"subdued":{"$value":"{primitive.color.neutral.200}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.200}","Dark":"{primitive.color.neutral.800}"}}}},"subtle":{"$value":"{primitive.color.neutral.100}","$description":"Lowest-contrast border for resting hairline edges on flat surfaces.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.100}","Dark":"{primitive.color.neutral.850}"}}}},"strong":{"$value":"{primitive.color.neutral.300}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.300}","Dark":"{primitive.color.neutral.600}"}}}},"accent":{"$value":"{primitive.color.graphite.700}","$description":"Accent border — graphite, dark enough to read as a boundary on page and card surfaces.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.graphite.700}","Dark":"{primitive.color.graphite.300}"}}}},"success":{"$value":"{primitive.color.green.400}","$description":"Success-toned border for status outlines and success-state inputs.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.green.400}","Dark":"{primitive.color.green.400}"}}}},"warning":{"$value":"{primitive.color.amber.400}","$description":"Warning-toned border for status outlines and warning-state inputs.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.amber.400}","Dark":"{primitive.color.amber.400}"}}}}},"feedback":{"error":{"$type":"color","$value":"{primitive.color.red.700}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.red.700}","Dark":"{primitive.color.red.400}"}}}},"success":{"$type":"color","$value":"{primitive.color.green.700}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.green.700}","Dark":"{primitive.color.green.400}"}}}},"warning":{"$type":"color","$value":"{primitive.color.amber.800}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.amber.800}","Dark":"{primitive.color.amber.400}"}}}},"info":{"$type":"color","$value":"{primitive.color.blue.500}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.blue.500}","Dark":"{primitive.color.blue.300}"}}}},"inProgress":{"$type":"color","$value":"{primitive.color.violet.700}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.violet.700}","Dark":"{primitive.color.violet.400}"}}}},"bg":{"error":{"$type":"color","$value":"{primitive.color.red.50}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.red.50}","Dark":"{primitive.color.red.950}"}}}},"success":{"$type":"color","$value":"{primitive.color.green.50}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.green.50}","Dark":"{primitive.color.green.950}"}}}},"warning":{"$type":"color","$value":"{primitive.color.amber.50}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.amber.50}","Dark":"{primitive.color.amber.950}"}}}},"info":{"$type":"color","$value":"{primitive.color.blue.50}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.blue.50}","Dark":"{primitive.color.blue.900}"}}}},"inProgress":{"$type":"color","$value":"{primitive.color.violet.50}","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.violet.50}","Dark":"{primitive.color.violet.950}"}}}}}},"state":{"pressed":{"overlay":{"$value":"{primitive.color.neutral.black}","$description":"Opaque pressed wash over a control's own fill: black in light, white in dark. Alpha in the class (inset-shadow-pressed-overlay/5).","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.black}","Dark":"{primitive.color.neutral.white}"}}}}}}},"space":{"$type":"dimension","$description":"Semantic spacing tiers: subgrid, component, layout, section, scale.","scale":{"$description":"hds#206: the canonical spacing vocabulary, one monotonic t-shirt scale (xs to xl) for padding, margin and gap. Supersedes deprecated names.","xs":{"$value":"{primitive.space.2}","$description":"8px — smallest step. Same value as component.gap (deprecated alias)."},"sm":{"$value":"{primitive.space.4}","$description":"16px — same value as layout.tight (deprecated alias)."},"md":{"$value":"{primitive.space.6}","$description":"24px. Default of the overridable roles surface.padding and region.gutter. The deprecated layout.normal has the same value."},"lg":{"$value":"{primitive.space.8}","$description":"32px — same value as layout.inset (deprecated alias)."},"xl":{"$value":"{primitive.space.12}","$description":"48px — same value as layout.spacious (deprecated alias)."}},"surface":{"$description":"hds#206 surface inset role. Tenants override it per brand and density, always with a scale step.","padding":{"$value":"{semantic.space.scale.md}","$description":"24px (scale.md) inset for cards, forms and panels. Tenants override it per brand and density. Replaces component.padding."}},"region":{"$description":"hds#206 region gutter role. theme.css retunes it per viewport, always with a scale step.","gutter":{"$value":"{semantic.space.scale.md}","$description":"24px (scale.md) column and region gutters; theme.css sets scale.lg (32px), and scale.sm (16px) below 640px. Replaces layout.gutter."}},"subgrid":{"hairline":{"$value":"{primitive.space.px1}","$description":"1px border offset and hairline spacing."},"xs":{"$value":"{primitive.space.px2}","$description":"2px vertical rhythm nudge and baseline adjustment."},"gap":{"$value":"{primitive.space.1}","$description":"4px cap-height and inline cluster spacing."}},"component":{"gap":{"$value":"{primitive.space.2}","$description":"8px label↔input rhythm and closely coupled control spacing. DEPRECATED alias (hds#206) — use semantic.space.scale.xs; kept live, no removal yet.","$deprecated":"hds#206 — use semantic.space.scale.xs"},"medium":{"$value":"{primitive.space.3}","$description":"12px adjacent form fields and medium intra-component gaps."},"padding":{"$value":"{semantic.space.surface.padding}","$description":"24px inset for cards, forms and panels. DEPRECATED alias (hds#206) — use semantic.space.surface.padding; kept live, no removal yet.","$deprecated":"hds#206 — use semantic.space.surface.padding"}},"layout":{"tight":{"$value":"{primitive.space.4}","$description":"16px default HdsStack gap and inter-component spacing. DEPRECATED alias (hds#206) — use semantic.space.scale.sm; kept live, no removal yet.","$deprecated":"hds#206 — use semantic.space.scale.sm"},"normal":{"$value":"{primitive.space.6}","$description":"24px column gutters and sidebar gutter spacing. DEPRECATED alias (hds#206) — use semantic.space.scale.md; kept live, no removal yet.","$deprecated":"hds#206 — use semantic.space.scale.md"},"gutter":{"$value":"{semantic.space.region.gutter}","$description":"24px column and region gutters. DEPRECATED alias (hds#206) — use semantic.space.region.gutter (responsive in theme.css); kept live, no removal yet.","$deprecated":"hds#206 — use semantic.space.region.gutter"},"inset":{"$value":"{primitive.space.8}","$description":"32px major block separation and inset inter-component gaps. DEPRECATED alias (hds#206) — use semantic.space.scale.lg; kept live, no removal yet.","$deprecated":"hds#206 — use semantic.space.scale.lg"},"spacious":{"$value":"{primitive.space.12}","$description":"48px break between major content blocks. DEPRECATED alias (hds#206) — use semantic.space.scale.xl; kept live, no removal yet.","$deprecated":"hds#206 — use semantic.space.scale.xl"}},"section":{"stack":{"$value":"{primitive.space.20}","$description":"80px vertical rhythm between page sections and major editorial blocks."},"inset":{"$value":"{primitive.space.24}","$description":"96px hero and landing-page inset padding."},"heroMax":{"$value":"{primitive.space.32}","$description":"128px maximum hero region padding for extra-large displays."}},"sidebar":{"indent":{"$value":"{primitive.space.3}","$description":"12px indent level for nested sidebar and TOC groups."},"gap":{"$value":"{primitive.space.4}","$description":"16px vertical spacing between items in sidebar and TOC stacks."},"sectionGap":{"$value":"{primitive.space.3}","$description":"12px spacing between sidebar sections and grouped rail blocks."},"railPadding":{"$value":"{primitive.space.5}","$description":"20px outer padding for sidebar and TOC rails."},"railWidth":{"$type":"dimension","$value":"{primitive.size.width.280}","$description":"Docs-shell nav and TOC rail width (hds#280), one token for both rails; 0 below their breakpoint (see HdsDocsShell)."}}},"layout":{"width":{"content":{"$type":"dimension","$value":"{primitive.size.width.760}","$description":"Max width for prose/content (760px). Use with HdsContainer for centered text blocks."},"max":{"$type":"dimension","$value":"{primitive.size.width.1200}","$description":"Max width for full-layout containers (1200px). Use with HdsContainer for page layouts."}},"container":{"maxWidth":{"$type":"dimension","$value":"{primitive.size.width.1200}"}},"content":{"maxWidth":{"$type":"dimension","$value":"{primitive.size.width.760}"}},"prose":{"maxWidth":{"$type":"dimension","$value":"{primitive.size.width.50ch}"}},"section":{"paddingY":{"$type":"dimension","$value":"{primitive.space.20}"}},"grid":{"gap":{"$type":"dimension","$value":"{primitive.space.8}"},"columns":{"mobile":{"$type":"number","$value":"{primitive.grid.columns.1}"},"tablet":{"$type":"number","$value":"{primitive.grid.columns.2}"},"desktop":{"$type":"number","$value":"{primitive.grid.columns.3}"}}}},"typography":{"$type":"typography","$description":"5-role type ramp plus mono (hds#483): display, title, body, ui, caption, mono. h1, h2, h3 and eyebrow are deprecated aliases.","display":{"$value":{"fontFamily":"{primitive.typography.family.display}","fontSize":"{primitive.typography.size.5xl}","fontWeight":"{primitive.typography.weight.bold}","letterSpacing":"{primitive.typography.letterSpacing.tight}","lineHeight":"{primitive.typography.lineHeight.display}"},"$description":"One per page, hero only. 48px / 1.05 / 700. Role 1 of 6."},"title":{"$value":{"fontFamily":"{primitive.typography.family.display}","fontSize":"{primitive.typography.size.2xl}","fontWeight":"{primitive.typography.weight.bold}","letterSpacing":"{primitive.typography.letterSpacing.tight}","lineHeight":"{primitive.typography.lineHeight.tight}"},"$description":"Section and card headings. 24px / 1.25 / 700. Role 2 of 6."},"body":{"$value":{"fontFamily":"{primitive.typography.family.primary}","fontSize":"{primitive.typography.size.base}","fontWeight":"{primitive.typography.weight.regular}","letterSpacing":"{primitive.typography.letterSpacing.normal}","lineHeight":"{primitive.typography.lineHeight.body}","maxWidth":{"value":60,"unit":"ch"}},"$description":"Prose. 16px / 1.6 / 400, 60ch measure. Role 3 of 6."},"ui":{"$value":{"fontFamily":"{primitive.typography.family.primary}","fontSize":"{primitive.typography.size.sm}","fontWeight":"{primitive.typography.weight.medium}","letterSpacing":"{primitive.typography.letterSpacing.normal}","lineHeight":"{primitive.typography.lineHeight.normal}","maxWidth":{"value":60,"unit":"ch"}},"$description":"Controls, nav, table text, values. 14px / 1.5 / 500. Role 4 of 6."},"caption":{"$value":{"fontFamily":"{primitive.typography.family.primary}","fontSize":"{primitive.typography.size.xs}","fontWeight":"{primitive.typography.weight.medium}","letterSpacing":"{primitive.typography.letterSpacing.normal}","lineHeight":"{primitive.typography.lineHeight.normal}"},"$description":"Metadata, help text and labels, in sentence case. 12px / 1.5 / 500. Role 5 of 6."},"mono":{"$value":{"fontFamily":"{primitive.typography.family.mono}","fontSize":"{primitive.typography.size.code}","fontWeight":"{primitive.typography.weight.regular}","letterSpacing":"{primitive.typography.letterSpacing.normal}","lineHeight":"{primitive.typography.lineHeight.normal}","maxWidth":{"value":60,"unit":"ch"}},"$description":"Code and ids. 13px / 1.5 / 400. The mono companion, role 6 of 6."},"h1":{"$value":{"fontFamily":"{primitive.typography.family.display}","fontSize":"{primitive.typography.size.2xl}","fontWeight":"{primitive.typography.weight.bold}","letterSpacing":"{primitive.typography.letterSpacing.tight}","lineHeight":"{primitive.typography.lineHeight.tight}"},"$description":"deprecated: use semantic.typography.title","$deprecated":"hds#483 — use semantic.typography.title"},"h2":{"$value":{"fontFamily":"{primitive.typography.family.display}","fontSize":"{primitive.typography.size.2xl}","fontWeight":"{primitive.typography.weight.bold}","letterSpacing":"{primitive.typography.letterSpacing.tight}","lineHeight":"{primitive.typography.lineHeight.tight}"},"$description":"deprecated: use semantic.typography.title","$deprecated":"hds#483 — use semantic.typography.title"},"h3":{"$value":{"fontFamily":"{primitive.typography.family.display}","fontSize":"{primitive.typography.size.2xl}","fontWeight":"{primitive.typography.weight.bold}","letterSpacing":"{primitive.typography.letterSpacing.tight}","lineHeight":"{primitive.typography.lineHeight.tight}"},"$description":"deprecated: use semantic.typography.title","$deprecated":"hds#483 — use semantic.typography.title"},"eyebrow":{"$value":{"fontFamily":"{primitive.typography.family.primary}","fontSize":"{primitive.typography.size.xs}","fontWeight":"{primitive.typography.weight.medium}","letterSpacing":"{primitive.typography.letterSpacing.normal}","lineHeight":"{primitive.typography.lineHeight.normal}"},"$description":"deprecated: use semantic.typography.caption","$deprecated":"hds#483 — use semantic.typography.caption"},"lineHeight":{"none":{"$type":"number","$value":"{primitive.typography.lineHeight.none}","$description":"Semantic alias for leading-none (1). Display text and badge spans."}}},"docs":{"$description":"Doc-page spacing scale: section, paragraph, inline rhythm.","space":{"$type":"dimension","section":{"$value":"{primitive.space.12}","$description":"48px between H2 sections — generous section break for doc pages."},"paragraph":{"$value":"{primitive.space.6}","$description":"24px between paragraphs — comfortable prose rhythm for long-form doc content."},"inline":{"$value":"{primitive.space.2}","$description":"8px inline cluster spacing — gap between metadata badges, inline icons, doc-page chips."}}},"accent":{"$type":"color","rest":{"$value":"{primitive.color.graphite.700}","$description":"Default accent fill for interactive elements at rest — warm graphite. Inverts per theme; pair with content.onAccent.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.graphite.700}","Dark":"{primitive.color.graphite.200}"}}}},"hover":{"$value":"{primitive.color.graphite.800}","$description":"Accent fill on pointer hover.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.graphite.800}","Dark":"{primitive.color.graphite.300}"}}}},"pressed":{"$value":"{primitive.color.graphite.900}","$description":"Accent fill during active press.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.graphite.900}","Dark":"{primitive.color.graphite.400}"}}}},"inactive":{"$value":"{primitive.color.neutral.400}","$description":"Accent fill for inactive or unselected accent elements.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.400}","Dark":"{primitive.color.neutral.600}"}}}},"disabled":{"$value":"{primitive.color.neutral.300}","$description":"Accent fill for disabled accent elements.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.neutral.300}","Dark":"{primitive.color.neutral.700}"}}}},"content":{"$value":"{primitive.color.graphite.700}","$description":"Accent-intent text/icon color on neutral surfaces (graphite) — pair with underline/weight for link affordance.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.graphite.700}","Dark":"{primitive.color.graphite.300}"}}}},"contentHover":{"$value":"{primitive.color.graphite.800}","$description":"Accent content color on pointer hover.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.graphite.800}","Dark":"{primitive.color.graphite.200}"}}}},"subtle":{"$value":"{primitive.color.graphite.50}","$description":"Low-emphasis accent tint for hover backgrounds and selection highlights.","$extensions":{"com.figma.variables":{"modes":{"Light":"{primitive.color.graphite.50}","Dark":"{primitive.color.graphite.800}"}}}}},"radius":{"action":{"$type":"dimension","$value":"{primitive.radius.8}","$description":"Corner radius for action elements (buttons, inputs, badges); Tailwind rounded-md resolves here. Override role.radius to reshape the system."},"control":{"$type":"dimension","$value":"{primitive.radius.4}","$description":"Corner radius for small control glyphs such as the checkbox box: not fully round, and distinct from semantic.radius.action (hds#242)."}},"borderWidth":{"default":{"$type":"dimension","$value":"{primitive.borderWidth.xs}","$description":"Default hairline border weight for surfaces and inputs."},"emphasis":{"$type":"dimension","$value":"{primitive.borderWidth.sm}","$description":"Stronger border weight for focus rings and active indicators."}},"shadow":{"$type":"shadow","subtle":{"$value":"0 1px 2px hsl(var(--primitive-shadow-color) / 0.04), 0 1px 1px hsl(var(--primitive-shadow-color) / 0.06)","$description":"Resting elevation shadow for raised surfaces (cards, inline panels)."},"floating":{"$value":"0 4px 6px hsl(var(--primitive-shadow-color) / 0.05), 0 10px 15px hsl(var(--primitive-shadow-color) / 0.08)","$description":"Hover/floating elevation for menus, popovers, and tooltips."},"overlay":{"$value":"0 10px 15px hsl(var(--primitive-shadow-color) / 0.08), 0 25px 50px hsl(var(--primitive-shadow-color) / 0.12)","$description":"Modal/dialog elevation for full-screen overlays."}},"elevation":{"$extensions":{"com.hirobius.hds":{"$type":"elevation"}},"flat":{"$description":"Flat surface (no shadow, hairline border) for embedded panels.","$extensions":{"com.hirobius.hds":{"$value":{"surface":"{semantic.color.surface.page}","shadow":null,"border":"{semantic.color.border.subtle}"}}}},"raised":{"$description":"Resting card / panel elevation.","$extensions":{"com.hirobius.hds":{"$value":{"surface":"{semantic.color.surface.raised}","shadow":"{semantic.shadow.subtle}","border":null}}}},"floating":{"$description":"Hover, menu, and popover elevation.","$extensions":{"com.hirobius.hds":{"$value":{"surface":"{semantic.color.surface.raised}","shadow":"{semantic.shadow.floating}","border":null}}}},"overlay":{"$description":"Modal, dialog, and drawer elevation.","$extensions":{"com.hirobius.hds":{"$value":{"surface":"{semantic.color.surface.overlay}","shadow":"{semantic.shadow.overlay}","border":null}}}}},"size":{"$type":"dimension","$description":"Sizing roles for control glyphs, avatars and table rows. Roles sharing a value stay separate so each can change (hds#242).","control":{"$description":"Interactive control glyph/element sizing (checkbox glyph box, radio dot, slider track/fill, code-block copy-button-matched footprint).","sm":{"$value":"{primitive.size.8}","$description":"Small control element — radio dot, slider fill bar height."},"md":{"$value":"{primitive.size.20}","$description":"Medium control element — checkbox glyph box, slider track wrapper height."},"lg":{"$value":"{primitive.size.32}","$description":"Large control footprint — code-block inline-wrapper min-height / copy-button-matched pre padding."}},"icon":{"$description":"Reserved icon-size role, parallel to the existing --hds-icon-* bridge (src/styles/theme.css), for future direct semantic.size.icon consumers.","sm":{"$value":"{primitive.size.16}","$description":"Small icon box — matches --hds-icon-small."},"md":{"$value":"{primitive.size.20}","$description":"Medium icon box — matches --hds-icon-medium."},"lg":{"$value":"{primitive.size.24}","$description":"Large icon box — matches --hds-icon-large."}},"avatar":{"$value":"{primitive.size.40}","$description":"Avatar size (width and height) for activity feeds and identity glyphs. Same pixels as row.compact today, a separate role (hds#242)."},"tile":{"$value":"{primitive.size.120}","$description":"Minimum height of a metric tile, one height for every tile so rows line up (hds#403)."},"row":{"$description":"Table row minimum height by density.","compact":{"$value":"{primitive.size.40}","$description":"Compact-density row minimum height."},"comfortable":{"$value":"{primitive.size.48}","$description":"Comfortable-density row minimum height."}}},"zIndex":{"$type":"number","$description":"Named stacking layers, aliasing the numeric primitive.zIndex scale (hds#242).","control":{"$value":"{primitive.zIndex.10}","$description":"Raises an interactive control (e.g. a native range input) above its visual decoration for hit-testing."},"sticky":{"$value":"{primitive.zIndex.100}","$description":"Sticky-positioned elements, such as a table header row."}}}`), sa = { nav: { bg: { $type: "color", $value: "{semantic.color.surface.page}", $description: "Nav bar background fill." }, bgActive: { $type: "color", $value: "{semantic.accent.subtle}", $description: "Nav item background fill when active or selected." }, borderActive: { $type: "color", $value: "{semantic.color.surface.accent}", $description: "Nav item border color when active or selected." }, text: { $type: "color", $value: "{semantic.color.content.secondary}", $description: "Nav item text color at rest." }, textActive: { $type: "color", $value: "{semantic.color.content.primary}", $description: "Nav item text color when active or selected." }, height: { $type: "dimension", $value: "{primitive.space.16}", $description: "Nav bar height." }, paddingX: { $type: "dimension", $value: "{primitive.space.6}", $description: "Horizontal padding inside nav items." }, paddingY: { $type: "dimension", $value: "{primitive.space.2}", $description: "Vertical padding inside nav items." } }, tag: { background: { $type: "color", $value: "{semantic.accent.subtle}", $description: "Base tag surface color." }, text: { $type: "color", $value: "{semantic.color.content.primary}", $description: "Default tag text color." }, border: { $type: "color", $value: "{semantic.color.border.default}", $description: "Default tag border color." }, radius: { $type: "dimension", $value: "{primitive.radius.full}", $description: "Pill radius for the tag surface." }, fontSize: { $type: "dimension", $value: "{primitive.typography.size.xs}", $description: "Tag type size." }, fontWeight: { $type: "fontWeight", $value: "{primitive.typography.weight.medium}", $description: "Tag label weight." }, lineHeight: { $type: "number", $value: "{primitive.typography.lineHeight.normal}", $description: "Readable label rhythm for tags." }, minWidth: { $type: "dimension", $value: "{primitive.size.48}", $description: "Minimum tag width." }, minHeight: { $type: "dimension", $value: "{primitive.space.6}", $description: "Minimum tag height." }, paddingX: { $type: "dimension", $value: "{primitive.space.3}", $description: "Horizontal padding inside the pill." }, paddingY: { $type: "dimension", $value: "{primitive.space.2}", $description: "Vertical padding inside the pill." }, activeText: { $type: "color", $value: "{semantic.color.content.onAccent}", $description: "Text color when the tag is active." }, activeBackground: { $type: "color", $value: "{semantic.accent.rest}", $description: "Active tag fill color." }, activeBorder: { $type: "color", $value: "{semantic.accent.rest}", $description: "Active tag border color." }, activeHover: { $type: "color", $value: "{semantic.accent.hover}", $description: "Active tag hover fill color." } }, badge: { fontSize: { $type: "dimension", $value: "{primitive.typography.size.xs}", $description: "Badge type size." }, fontWeight: { $type: "fontWeight", $value: "{primitive.typography.weight.medium}", $description: "Badge label weight." }, text: { $type: "color", $value: "{semantic.color.content.primary}", $description: "Badge text color." }, bg: { $type: "color", $value: "{semantic.color.feedback.bg.info}", $extensions: { "com.figma.variables": { modes: { Light: "{semantic.color.feedback.bg.info}", Dark: "{semantic.color.feedback.bg.info}" } } }, $description: "Badge background color." }, radius: { $type: "dimension", $value: "{primitive.radius.4}", $description: "Small rounded radius for badges." }, height: { $type: "dimension", $value: "{primitive.size.20}", $description: "Badge height." }, minWidth: { $type: "dimension", $value: "{primitive.size.20}", $description: "Badge minimum width." }, paddingY: { $type: "dimension", $value: "{primitive.space.px2}", $description: "Vertical padding inside the badge." }, paddingX: { $type: "dimension", $value: "{primitive.space.px6}", $description: "Horizontal padding inside the badge." } }, button: { bg: { $type: "color", $value: "{semantic.color.surface.accent}", $description: "Primary button fill." }, bgHover: { $type: "color", $value: "{semantic.accent.hover}", $description: "Primary button hover fill." }, text: { $type: "color", $value: "{semantic.color.content.onAccent}", $description: "Primary button text color." }, radius: { $type: "dimension", $value: "{semantic.radius.action}", $description: "Button corner radius." }, paddingX: { $type: "dimension", $value: "{primitive.space.4}", $description: "Horizontal button padding." }, paddingY: { $type: "dimension", $value: "{primitive.space.3}", $description: "Vertical button padding." }, size: { sm: { paddingX: { $type: "dimension", $value: "{primitive.space.2}", $description: "Small button horizontal padding (8px)." }, paddingY: { $type: "dimension", $value: "{primitive.space.1}", $description: "Small button vertical padding (4px)." }, fontSize: { $type: "dimension", $value: "{primitive.typography.size.xs}", $description: "Small button label size (12px, hds#283: was 13px)." }, iconSize: { $type: "dimension", $value: "{primitive.size.12}", $description: "Small button icon slot size (12px)." }, height: { $type: "dimension", $value: "{primitive.space.7}", $description: "Small button height (28px)." }, itemSpacing: { $type: "dimension", $value: "{primitive.space.1}", $description: "Small button icon-to-label gap (4px)." } }, md: { paddingX: { $type: "dimension", $value: "{primitive.space.4}", $description: "Medium button horizontal padding (16px)." }, paddingY: { $type: "dimension", $value: "{primitive.space.3}", $description: "Medium button vertical padding (12px)." }, fontSize: { $type: "dimension", $value: "{primitive.typography.size.sm}", $description: "Medium button label size (14px, hds#283: was 15px)." }, iconSize: { $type: "dimension", $value: "{primitive.size.16}", $description: "Medium button icon slot size (16px)." }, height: { $type: "dimension", $value: "{primitive.size.40}", $description: "Medium button height (40px)." }, itemSpacing: { $type: "dimension", $value: "{primitive.space.2}", $description: "Medium button icon-to-label gap (8px)." } }, lg: { paddingX: { $type: "dimension", $value: "{primitive.space.6}", $description: "Large button horizontal padding (24px)." }, paddingY: { $type: "dimension", $value: "{primitive.space.4}", $description: "Large button vertical padding (16px)." }, fontSize: { $type: "dimension", $value: "{primitive.typography.size.base}", $description: "Large button label size (16px, hds#283: was 17px)." }, iconSize: { $type: "dimension", $value: "{primitive.size.20}", $description: "Large button icon slot size (20px)." }, height: { $type: "dimension", $value: "{primitive.size.48}", $description: "Large button height (48px)." }, itemSpacing: { $type: "dimension", $value: "{primitive.space.2}", $description: "Large button icon-to-label gap (8px)." } } }, primary: { textDisabled: { $type: "color", $value: "{semantic.color.content.disabled}", $description: "Disabled primary button text color." }, bgDisabled: { $type: "color", $value: "{semantic.color.surface.muted}", $description: "Disabled primary button fill." } }, secondary: { bg: { rest: { $type: "color", $value: "{semantic.color.surface.page}", $description: "Secondary button fill." }, hover: { $type: "color", $value: "{semantic.color.surface.raised}", $description: "Secondary button hover fill." }, pressed: { $type: "color", $value: "{semantic.color.surface.overlay}", $description: "Secondary button pressed fill." } }, border: { rest: { $type: "color", $value: "{semantic.color.border.interactive}", $description: "Secondary button border." }, hover: { $type: "color", $value: "{semantic.color.border.interactive}", $description: "Secondary button hover border." }, pressed: { $type: "color", $value: "{semantic.color.border.interactive}", $description: "Secondary button pressed border." }, disabled: { $type: "color", $value: "{semantic.color.border.subdued}", $description: "Secondary button disabled border." } }, text: { $type: "color", $value: "{semantic.color.content.primary}", $description: "Secondary button text color." } } }, input: { bg: { $type: "color", $value: "{semantic.color.surface.raised}" }, text: { $type: "color", $value: "{semantic.color.content.primary}" }, border: { $type: "color", $value: "{semantic.color.border.interactive}" }, borderError: { $type: "color", $value: "{semantic.color.feedback.error}" }, radius: { $type: "dimension", $value: "{semantic.radius.action}" }, paddingX: { $type: "dimension", $value: "{primitive.space.4}" }, paddingY: { $type: "dimension", $value: "{primitive.space.3}" } }, card: { bg: { $type: "color", $value: "{semantic.color.surface.raised}" }, border: { $type: "color", $value: "{semantic.color.border.default}" }, radius: { $type: "dimension", $value: "{primitive.radius.8}" }, padding: { $type: "dimension", $value: "{primitive.space.6}" }, gap: { $type: "dimension", $value: "{primitive.space.2}" } }, lightbox: { backdrop: { blur: { $type: "dimension", $value: "{primitive.blur.16}", $description: "Backdrop blur applied behind fullscreen image lightboxes." } } } }, la = { $description: "Shadcn-style role aliases mapping to semantic tokens. Compiled to --role-* CSS vars.", background: { $type: "color", $value: "{semantic.color.surface.page}", $description: "Page background. shadcn role: background." }, foreground: { $type: "color", $value: "{semantic.color.content.primary}", $description: "Default text on background. shadcn role: foreground." }, card: { $type: "color", $value: "{semantic.color.surface.raised}", $description: "Card surface. shadcn role: card." }, "card-foreground": { $type: "color", $value: "{semantic.color.content.primary}", $description: "Text on card. shadcn role: card-foreground." }, popover: { $type: "color", $value: "{semantic.color.surface.overlay}", $description: "Popover/menu surface. shadcn role: popover." }, scrim: { $type: "color", $value: "{semantic.color.surface.scrim}", $description: "Modal backdrop colour role. Apply alpha in the class, e.g. bg-scrim/60." }, "pressed-overlay": { $type: "color", $value: "{semantic.color.state.pressed.overlay}", $description: "Pressed-state overlay colour role. Apply alpha in the class, e.g. inset-shadow-pressed-overlay/5." }, "popover-foreground": { $type: "color", $value: "{semantic.color.content.primary}", $description: "Text on popover. shadcn role: popover-foreground." }, primary: { $type: "color", $value: "{semantic.color.surface.accent}", $description: "Primary action surface. shadcn role: primary." }, "primary-foreground": { $type: "color", $value: "{semantic.color.content.onAccent}", $description: "Text/icons on primary surface. shadcn role: primary-foreground." }, secondary: { $type: "color", $value: "{semantic.color.surface.raised}", $description: "Secondary action surface. shadcn role: secondary." }, "secondary-foreground": { $type: "color", $value: "{semantic.color.content.primary}", $description: "Text on secondary surface. shadcn role: secondary-foreground." }, muted: { $type: "color", $value: "{semantic.color.surface.overlay}", $description: "Muted/quiet bg (skeletons, disabled inputs). shadcn role: muted." }, "muted-foreground": { $type: "color", $value: "{semantic.color.content.secondary}", $description: "Muted text. shadcn role: muted-foreground." }, accent: { $type: "color", $value: "{semantic.color.surface.accentSubtle}", $description: "Hover/active tinted bg. shadcn role: accent." }, "accent-foreground": { $type: "color", $value: "{semantic.color.content.accent}", $description: "Text on accent surface. shadcn role: accent-foreground." }, destructive: { $type: "color", $value: "{semantic.color.feedback.error}", $description: "Destructive action surface. shadcn role: destructive." }, "destructive-foreground": { $type: "color", $value: "{semantic.color.content.inverse}", $description: "Text on destructive surface. shadcn role: destructive-foreground." }, border: { $type: "color", $value: "{semantic.color.border.default}", $description: "Default border. shadcn role: border." }, input: { $type: "color", $value: "{semantic.color.border.interactive}", $description: "Input field border. shadcn role: input." }, ring: { $type: "color", $value: "{semantic.color.border.accent}", $description: "Focus ring color. shadcn role: ring." }, radius: { $type: "dimension", $value: "{semantic.radius.action}", $description: "Default border radius. shadcn role: radius." } }, ca = {
   $schema: aa,
   $description: ra,
   primitive: na,
@@ -3164,21 +3165,21 @@ export {
   ka as Callout,
   vr as Card,
   gr as CardBody,
-  fr as CardDescription,
-  hr as CardFooter,
+  hr as CardDescription,
+  fr as CardFooter,
   br as CardHeader,
   $r as CardMetric,
   yr as CardProgress,
   xr as CardTitle,
-  Ia as Checkbox,
+  Ma as Checkbox,
   nr as Combobox,
   wr as Container,
   Ca as Dialog,
   Tt as DialogClose,
-  Pt as DialogContent,
-  At as DialogDescription,
+  Rt as DialogContent,
+  It as DialogDescription,
   Lt as DialogFooter,
-  Rt as DialogHeader,
+  Pt as DialogHeader,
   Ke as DialogOverlay,
   Je as DialogPortal,
   Vt as DialogTitle,
@@ -3190,8 +3191,8 @@ export {
   Sr as Grid,
   Tr as HdsRouterProvider,
   Nr as HdsThemeProvider,
-  I as Icon,
-  Ra as InlineCode,
+  M as Icon,
+  Pa as InlineCode,
   La as InlineLink,
   Va as Input,
   ja as Kbd,
@@ -3201,14 +3202,14 @@ export {
   Qa as Pin,
   ke as Popover,
   Ba as Progress,
-  Ma as Radio,
-  _a as SegmentedControl,
-  Oa as Select,
+  Aa as Radio,
+  Ga as SegmentedControl,
+  _a as Select,
   Ka as Sidebar,
   Wa as Skeleton,
   Ea as Slider,
   Fa as Spinner,
-  Ae as Stack,
+  Ie as Stack,
   Na as Stat,
   za as StatusListItem,
   gt as Surface,
@@ -3218,13 +3219,13 @@ export {
   ar as TabsContent,
   tr as TabsList,
   ir as TabsTrigger,
-  Ga as Tag,
+  Oa as Tag,
   Ue as Text,
-  Aa as Textarea,
+  Ia as Textarea,
   Ua as Timestamp,
   cr as ToastProvider,
   Ha as Toggle,
-  Pa as Tooltip,
+  Ra as Tooltip,
   qa as VisuallyHidden,
   d as cn,
   D as hds,