@takazudo/zdtp 0.2.1 → 0.2.2

package/dist/index.js

@@ -1,13 +1,13 @@
 import { jsxs as k, jsx as l, Fragment as re } from "preact/jsx-runtime";
-import { createContext as Vt, render as _n } from "preact";
-import { useState as j, useRef as O, useMemo as Z, useEffect as X, useId as st, useCallback as z, useLayoutEffect as yo, useContext as No, createPortal as Bt, memo as je } from "preact/compat";
-import { b as ct, i as $n, s as _o, r as Ke, e as $o, c as Co, d as nt, f as Cn, D as Jt, h as Eo, j as So, k as Ve, m as To, n as Mo, o as Ao, p as Lo, l as En, q as Zt, t as mt, u as Sn, v as Po, w as Qe, x as bt, y as Qt, z as vt, A as en, B as wt, C as Io, a as Ro } from "./tweak-state-DSJa5csL.js";
+import { createContext as Ht, render as _n } from "preact";
+import { useState as j, useRef as O, useMemo as Z, useEffect as X, useId as ct, useCallback as z, useLayoutEffect as _o, useContext as $o, createPortal as Bt, memo as je } from "preact/compat";
+import { b as dt, i as $n, s as Co, r as Ke, e as Eo, c as So, d as nt, f as Cn, D as Zt, h as To, j as Mo, k as Ve, m as Ao, n as Lo, o as Po, p as Io, l as En, q as Qt, t as bt, u as Sn, v as Ro, w as Qe, x as vt, y as en, z as wt, A as tn, B as xt, C as zo, a as Oo } from "./tweak-state-DSJa5csL.js";
 import { Z as zl } from "./tweak-state-DSJa5csL.js";
-import { g as Q, j as ge, n as zo, o as P, p as Oo, r as Do, q as Vo, t as tn, a as Tn, u as Bo, v as Ho } from "./panel-config-DP2_P7dD.js";
+import { g as Q, j as ge, n as Do, o as P, p as Vo, r as Ho, q as Bo, t as nn, a as Tn, u as Fo, v as jo } from "./panel-config-DP2_P7dD.js";
 import { c as Dl, s as Vl } from "./panel-config-DP2_P7dD.js";
-import { c as Fo } from "./color-schemes-CgzOBqGO.js";
-import { r as jo } from "./route-tokens-to-files-1DvmWBdj.js";
-import { useContext as Ht, useCallback as G, useRef as le, useEffect as se, useState as we, useMemo as Pt } from "preact/hooks";
+import { c as Ko } from "./color-schemes-CgzOBqGO.js";
+import { r as Wo } from "./route-tokens-to-files-1DvmWBdj.js";
+import { useContext as Ft, useCallback as G, useRef as le, useEffect as se, useState as we, useMemo as ot } from "preact/hooks";
 function xe(e) {
   const t = Q().tabs.find((o) => o.id === e);
   if (!t) return [];
@@ -17,11 +17,11 @@ function xe(e) {
       n.push(r);
   return n;
 }
-const et = "zudo-design-tokens/v2", xt = "zudo-design-tokens/v1";
+const et = "zudo-design-tokens/v2", yt = "zudo-design-tokens/v1";
 function Mn() {
   return {};
 }
-function Ko() {
+function Xo() {
   return Q().schemaId;
 }
 class Me extends Error {
@@ -35,17 +35,17 @@ function An(e, t = {}) {
   const n = t.now ? t.now() : /* @__PURE__ */ new Date(), o = {
     $schema: et,
     exportedAt: n.toISOString()
-  }, r = {}, a = Wo(e.color, t);
+  }, r = {}, a = Yo(e.color, t);
   a && (r.color = a);
-  const i = yt(xe("spacing"), e.spacing, t);
+  const i = Nt(xe("spacing"), e.spacing, t);
   i && (r.spacing = i);
-  const s = yt(xe("font"), e.typography, t);
+  const s = Nt(xe("font"), e.typography, t);
   s && (r.font = s);
-  const d = yt(xe("size"), e.size, t);
+  const d = Nt(xe("size"), e.size, t);
   return d && (r.size = d), Object.keys(r).length > 0 && (o.tabs = r), o;
 }
-function Wo(e, t) {
-  const n = t.colorDefaults, o = t.includeDefaults === !0, r = ct(), a = {};
+function Yo(e, t) {
+  const n = t.colorDefaults, o = t.includeDefaults === !0, r = dt(), a = {};
   let i = !1;
   const s = {};
   let d = !1;
@@ -64,7 +64,7 @@ function Wo(e, t) {
   }
   return u && (a.semantic = c, i = !0), i ? a : void 0;
 }
-function yt(e, t, n) {
+function Nt(e, t, n) {
   const o = n.includeDefaults === !0, r = {};
   let a = !1;
   if (o)
@@ -81,34 +81,34 @@ function yt(e, t, n) {
     }
   return a ? { raw: r } : void 0;
 }
-function Xo(e, t = {}) {
+function qo(e, t = {}) {
   if (e === null || typeof e != "object" || Array.isArray(e))
     throw new Me("not-object", "Input is not a JSON object.");
   const n = e, o = n.$schema;
   if (o === void 0)
     throw new Me(
       "schema-missing",
-      `Missing "$schema" key. Expected "${et}" or "${xt}".`
+      `Missing "$schema" key. Expected "${et}" or "${yt}".`
     );
   if (o === et)
-    return Yo(n, t);
-  if (o === xt)
     return Go(n, t);
+  if (o === yt)
+    return Jo(n, t);
   throw new Me(
     "schema-mismatch",
-    `Unsupported "$schema" value: ${JSON.stringify(o)}. Expected "${et}" or "${xt}".`,
+    `Unsupported "$schema" value: ${JSON.stringify(o)}. Expected "${et}" or "${yt}".`,
     o
   );
 }
-function Yo(e, t) {
-  const n = [], o = [], r = t.colorDefaults ?? Ln(), a = ct(), i = e.tabs && typeof e.tabs == "object" && !Array.isArray(e.tabs) ? e.tabs : {}, s = i.color, d = qo(s, r, a, n), c = i.spacing, u = c && typeof c == "object" ? c.raw : void 0, p = Nt(u, xe("spacing"), "spacing", o, n), h = i.font, m = h && typeof h == "object" ? h.raw : void 0, $ = Nt(m, xe("font"), "font.raw", o, n), b = i.size, x = b && typeof b == "object" ? b.raw : void 0, f = Nt(x, xe("size"), "size", o, n);
+function Go(e, t) {
+  const n = [], o = [], r = t.colorDefaults ?? Ln(), a = dt(), i = e.tabs && typeof e.tabs == "object" && !Array.isArray(e.tabs) ? e.tabs : {}, s = i.color, d = Uo(s, r, a, n), c = i.spacing, u = c && typeof c == "object" ? c.raw : void 0, p = _t(u, xe("spacing"), "spacing", o, n), h = i.font, m = h && typeof h == "object" ? h.raw : void 0, $ = _t(m, xe("font"), "font.raw", o, n), b = i.size, x = b && typeof b == "object" ? b.raw : void 0, f = _t(x, xe("size"), "size", o, n);
   return {
     state: { color: d, spacing: p, typography: $, size: f },
     unknownTokens: o,
     warnings: n
   };
 }
-function qo(e, t, n, o) {
+function Uo(e, t, n, o) {
   if (!e || typeof e != "object" || Array.isArray(e))
     return { ...t, palette: [...t.palette], semanticMappings: { ...t.semanticMappings } };
   const r = e;
@@ -146,7 +146,7 @@ function qo(e, t, n, o) {
     shikiTheme: t.shikiTheme
   };
 }
-function Nt(e, t, n, o, r) {
+function _t(e, t, n, o, r) {
   if (!e || typeof e != "object") return Mn();
   const a = /* @__PURE__ */ new Map();
   for (const s of t)
@@ -166,15 +166,15 @@ function Nt(e, t, n, o, r) {
   }
   return i;
 }
-function Go(e, t) {
-  const n = [], o = [], r = t.colorDefaults ?? Ln(), a = Uo(e.color, r, n), i = _t(e.spacing, xe("spacing"), "spacing", o, n), s = _t(e.typography, xe("font"), "typography", o, n), d = _t(e.size, xe("size"), "size", o, n);
+function Jo(e, t) {
+  const n = [], o = [], r = t.colorDefaults ?? Ln(), a = Zo(e.color, r, n), i = $t(e.spacing, xe("spacing"), "spacing", o, n), s = $t(e.typography, xe("font"), "typography", o, n), d = $t(e.size, xe("size"), "size", o, n);
   return {
     state: { color: a, spacing: i, typography: s, size: d },
     unknownTokens: o,
     warnings: n
   };
 }
-function Uo(e, t, n) {
+function Zo(e, t, n) {
   if (!e || typeof e != "object")
     return {
       ...t,
@@ -214,7 +214,7 @@ function Uo(e, t, n) {
     shikiTheme: h
   };
 }
-function _t(e, t, n, o, r) {
+function $t(e, t, n, o, r) {
   if (!e || typeof e != "object") return Mn();
   const a = /* @__PURE__ */ new Map();
   for (const s of t)
@@ -238,7 +238,7 @@ function Re(e, t) {
   return typeof e == "number" && Number.isFinite(e) ? e : t;
 }
 function Ln() {
-  const e = ct(), t = e && e.paletteSize > 0 ? e.paletteSize : 16, n = t - 1, o = Array.from({ length: t }, (a, i) => i === 0 ? "#000000" : i === n ? "#ffffff" : "#808080"), r = (a) => Math.min(Math.max(a, 0), n);
+  const e = dt(), t = e && e.paletteSize > 0 ? e.paletteSize : 16, n = t - 1, o = Array.from({ length: t }, (a, i) => i === 0 ? "#000000" : i === n ? "#ffffff" : "#808080"), r = (a) => Math.min(Math.max(a, 0), n);
   return {
     palette: o,
     background: r(0),
@@ -250,14 +250,14 @@ function Ln() {
     shikiTheme: "dracula"
   };
 }
-function Jo(e, t) {
+function Qo(e, t) {
   if (t) return t;
-  const n = Object.values(Fo)[0];
+  const n = Object.values(Ko)[0];
   return n ? $n(n) : e;
 }
-function Zo({ onClose: e, state: t, colorDefaults: n }) {
-  const [o, r] = j("Copy"), [a, i] = j(!1), s = O(null), d = O(null), c = O(null), u = Q(), p = zo(u), h = Z(() => {
-    const f = Jo(t.color, n), w = An(t, {
+function er({ onClose: e, state: t, colorDefaults: n }) {
+  const [o, r] = j("Copy"), [a, i] = j(!1), s = O(null), d = O(null), c = O(null), u = Q(), p = Do(u), h = Z(() => {
+    const f = Qo(t.color, n), w = An(t, {
       includeDefaults: a,
       colorDefaults: f
     });
@@ -304,7 +304,7 @@ function Zo({ onClose: e, state: t, colorDefaults: n }) {
     }
     r(f ? "Copied!" : "Failed"), c.current && clearTimeout(c.current), c.current = setTimeout(() => r("Copy"), 2e3);
   }
-  const b = st(), x = `${u.modalClassPrefix}-export-title-${b}`;
+  const b = ct(), x = `${u.modalClassPrefix}-export-title-${b}`;
   return /* @__PURE__ */ k(
     "dialog",
     {
@@ -366,8 +366,8 @@ function Zo({ onClose: e, state: t, colorDefaults: n }) {
     }
   );
 }
-function Qo({ onClose: e, onLoad: t, colorDefaults: n }) {
-  const [o, r] = j(""), [a, i] = j(null), s = O(null), d = O(null), c = Q(), u = Ko();
+function tr({ onClose: e, onLoad: t, colorDefaults: n }) {
+  const [o, r] = j(""), [a, i] = j(null), s = O(null), d = O(null), c = Q(), u = Xo();
   X(() => {
     const b = s.current;
     if (b)
@@ -406,7 +406,7 @@ function Qo({ onClose: e, onLoad: t, colorDefaults: n }) {
       return;
     }
     try {
-      const { state: f, unknownTokens: w, warnings: C } = Xo(x, {
+      const { state: f, unknownTokens: w, warnings: C } = qo(x, {
         colorDefaults: n
       });
       if (w.length > 0) {
@@ -418,7 +418,7 @@ function Qo({ onClose: e, onLoad: t, colorDefaults: n }) {
         console.groupEnd();
       }
       C.length > 0 && console.warn("[design-token-serde] warnings:", C), t(f);
-      const E = Object.keys(f.spacing).length + Object.keys(f.typography).length + Object.keys(f.size).length, N = Oo(f.color, n);
+      const E = Object.keys(f.spacing).length + Object.keys(f.typography).length + Object.keys(f.size).length, N = Vo(f.color, n);
       E === 0 && N && w.length > 0 ? i({
         kind: "error",
         text: `Nothing applied — all ${w.length} token${w.length === 1 ? "" : "s"} in the payload were unknown. See console for the list.`
@@ -441,7 +441,7 @@ function Qo({ onClose: e, onLoad: t, colorDefaults: n }) {
       i({ kind: "error", text: `Load failed: ${w}` });
     }
   }
-  const m = st(), $ = `${c.modalClassPrefix}-import-title-${m}`;
+  const m = ct(), $ = `${c.modalClassPrefix}-import-title-${m}`;
   return /* @__PURE__ */ k(
     "dialog",
     {
@@ -509,7 +509,7 @@ function Qo({ onClose: e, onLoad: t, colorDefaults: n }) {
     }
   );
 }
-function nn(e, t, n = ct(), o = Q().tabs) {
+function on(e, t, n = dt(), o = Q().tabs) {
   const r = {}, a = e.color, i = a.palette.length;
   for (let d = 0; d < i; d++) {
     const c = a.palette[d];
@@ -522,9 +522,9 @@ function nn(e, t, n = ct(), o = Q().tabs) {
     if (u === void 0) continue;
     const p = t?.semanticMappings[d];
     if (!(t === void 0 || u !== p)) continue;
-    const m = tr(u, a);
+    const m = or(u, a);
     if (m === null) continue;
-    const $ = _o(m, a.palette.length);
+    const $ = Co(m, a.palette.length);
     $ !== m && console.error(
       `[design-token-panel] paletteIndex ${m} for ${c} is out of range (palette length ${a.palette.length}); clamping to ${$}.`
     ), r[c] = `var(${ge(n, $)})`;
@@ -537,11 +537,11 @@ function nn(e, t, n = ct(), o = Q().tabs) {
   for (const { tabId: d, overrides: c } of s) {
     if (Object.keys(c).length === 0) continue;
     const u = o.find((p) => p.id === d);
-    u && er(u, c, r);
+    u && nr(u, c, r);
   }
   return r;
 }
-function er(e, t, n) {
+function nr(e, t, n) {
   const o = {};
   for (const r of e.tiers) {
     const a = {};
@@ -558,19 +558,19 @@ function er(e, t, n) {
       if (!(typeof i != "string" || i.length === 0))
         try {
           const s = Ke(e, r.id, a.id, o);
-          n[a.cssVar] = $o(s);
+          n[a.cssVar] = Eo(s);
         } catch {
         }
     }
 }
-function tr(e, t) {
+function or(e, t) {
   return e === "bg" ? t.background : e === "fg" ? t.foreground : typeof e == "number" && Number.isInteger(e) ? e : null;
 }
-const nr = 2e3, $t = { kind: "preview" };
-function or(e, t) {
+const rr = 2e3, Ct = { kind: "preview" };
+function ar(e, t) {
   return JSON.stringify(An(e, { colorDefaults: t }), null, 2);
 }
-function rr(e) {
+function ir(e) {
   if (Array.isArray(e.updated)) return e.updated;
   const t = e.results;
   if (Array.isArray(t)) return t;
@@ -583,7 +583,7 @@ function rr(e) {
   }
   return n;
 }
-function ar(e) {
+function lr(e) {
   return {
     dialog: `${P(e, "")} ${P(e, "--apply")}`,
     header: P(e, "__header"),
@@ -605,8 +605,8 @@ function ar(e) {
     jsonBlock: P(e, "__json")
   };
 }
-function ir(e) {
-  const { state: t, open: n, onClose: o, colorDefaults: r, onApplied: a } = e, i = O(null), s = O(null), d = Q(), c = Z(() => ar(d), [d]), u = st(), p = `${d.modalClassPrefix}-apply-title-${u}`, [h, m] = j($t), [$, b] = j("Copy pre-apply state to clipboard");
+function sr(e) {
+  const { state: t, open: n, onClose: o, colorDefaults: r, onApplied: a } = e, i = O(null), s = O(null), d = Q(), c = Z(() => lr(d), [d]), u = ct(), p = `${d.modalClassPrefix}-apply-title-${u}`, [h, m] = j(Ct), [$, b] = j("Copy pre-apply state to clipboard");
   X(() => {
     const A = i.current;
     if (!A) return;
@@ -615,23 +615,23 @@ function ir(e) {
       s.current?.focus();
     })) : !n && D && (typeof A.close == "function" ? A.close() : A.removeAttribute("open"));
   }, [n]), X(() => {
-    n && (m($t), b("Copy pre-apply state to clipboard"));
+    n && (m(Ct), b("Copy pre-apply state to clipboard"));
   }, [n]), X(() => {
     if ($ !== "Copied!") return;
     const A = window.setTimeout(
       () => b("Copy pre-apply state to clipboard"),
-      nr
+      rr
     );
     return () => window.clearTimeout(A);
   }, [$]);
   const x = Z(() => {
-    const A = nn(t, r), D = Do(d), te = D && t.secondary ? nn({ ...t, color: t.secondary }, void 0, D) : {};
+    const A = on(t, r), D = Ho(d), te = D && t.secondary ? on({ ...t, color: t.secondary }, void 0, D) : {};
     return { ...A, ...te };
-  }, [t, r, d]), f = Z(() => Vo(d), [d]), { groups: w, rejected: C, rejectedReasons: E } = Z(
-    () => jo(x, f),
+  }, [t, r, d]), f = Z(() => Bo(d), [d]), { groups: w, rejected: C, rejectedReasons: E } = Z(
+    () => Wo(x, f),
     [x, f]
   ), N = Z(() => Object.keys(x).length, [x]), v = N === 0, g = w.length > 0, _ = d.applyEndpoint, S = !!_ && Object.keys(f).length > 0;
-  async function H() {
+  async function B() {
     if (!_) {
       m({
         kind: "error",
@@ -639,7 +639,7 @@ function ir(e) {
       });
       return;
     }
-    const A = or(t, r);
+    const A = ar(t, r);
     m({ kind: "applying" });
     try {
       const D = await fetch(_, {
@@ -688,7 +688,7 @@ function ir(e) {
     a(), oe();
   }
   function ee() {
-    m($t);
+    m(Ct);
   }
   function pe() {
     o();
@@ -744,7 +744,7 @@ function ir(e) {
         ] }),
         /* @__PURE__ */ k("div", { children: [
           h.kind === "preview" && /* @__PURE__ */ l(
-            lr,
+            cr,
             {
               cls: c,
               groups: w,
@@ -755,19 +755,19 @@ function ir(e) {
               applyConfigured: S
             }
           ),
-          h.kind === "applying" && /* @__PURE__ */ l(sr, { cls: c }),
+          h.kind === "applying" && /* @__PURE__ */ l(dr, { cls: c }),
           h.kind === "success" && /* @__PURE__ */ l(
-            cr,
+            ur,
             {
               cls: c,
-              results: rr(h.response),
+              results: ir(h.response),
               unknownCssVars: Array.isArray(h.response.unknownCssVars) ? h.response.unknownCssVars : [],
               previewJson: h.previewJson,
               copyLabel: $,
               onCopy: () => K(h.previewJson)
             }
           ),
-          h.kind === "error" && /* @__PURE__ */ l(dr, { cls: c, message: h.message })
+          h.kind === "error" && /* @__PURE__ */ l(pr, { cls: c, message: h.message })
         ] }),
         /* @__PURE__ */ k("div", { className: c.actions, children: [
           h.kind === "preview" && /* @__PURE__ */ k(re, { children: [
@@ -783,10 +783,10 @@ function ir(e) {
                   "aria-disabled": A || void 0,
                   title: S ? void 0 : "Host has not configured an apply endpoint or routing map. The Apply modal can preview the diff but cannot rewrite source files.",
                   onClick: () => {
-                    A || H();
+                    A || B();
                   },
                   onKeyDown: (D) => {
-                    (D.key === "Enter" || D.key === " ") && (D.preventDefault(), A || H());
+                    (D.key === "Enter" || D.key === " ") && (D.preventDefault(), A || B());
                   },
                   children: Se
                 }
@@ -853,7 +853,7 @@ function ir(e) {
     }
   );
 }
-function lr({
+function cr({
   cls: e,
   groups: t,
   rejected: n,
@@ -882,7 +882,7 @@ function lr({
     ] }),
     t.map((d) => /* @__PURE__ */ k("div", { children: [
       /* @__PURE__ */ k("div", { role: "heading", "aria-level": 3, className: e.sectionHeading, children: [
-        ur(d.relativePath),
+        fr(d.relativePath),
         " (",
         Object.keys(d.tokens).length,
         ")"
@@ -911,13 +911,13 @@ function lr({
     ] })
   ] });
 }
-function sr({ cls: e }) {
+function dr({ cls: e }) {
   return /* @__PURE__ */ k("div", { className: e.applying, role: "status", "aria-live": "polite", children: [
     /* @__PURE__ */ l("span", { className: e.spinner, "aria-hidden": "true" }),
     /* @__PURE__ */ l("span", { children: "Applying changes…" })
   ] });
 }
-function cr({
+function ur({
   cls: e,
   results: t,
   unknownCssVars: n,
@@ -929,9 +929,9 @@ function cr({
     /* @__PURE__ */ l("div", { className: e.statusSuccess, role: "status", children: "Applied successfully." }),
     t.length === 0 ? /* @__PURE__ */ l("div", { className: e.hint, children: "The server returned no per-file details." }) : t.map((i) => /* @__PURE__ */ k("div", { children: [
       /* @__PURE__ */ l("div", { role: "heading", "aria-level": 3, className: e.sectionHeading, children: i.file ?? "(unknown file)" }),
-      /* @__PURE__ */ l(Ct, { cls: e, label: "changed", values: i.changed }),
-      /* @__PURE__ */ l(Ct, { cls: e, label: "unknown", values: i.unknown }),
-      /* @__PURE__ */ l(Ct, { cls: e, label: "unchanged", values: i.unchanged })
+      /* @__PURE__ */ l(Et, { cls: e, label: "changed", values: i.changed }),
+      /* @__PURE__ */ l(Et, { cls: e, label: "unknown", values: i.unknown }),
+      /* @__PURE__ */ l(Et, { cls: e, label: "unchanged", values: i.unchanged })
     ] }, i.file ?? "unknown-file")),
     n.length > 0 && /* @__PURE__ */ k("div", { className: e.statusWarning, children: [
       n.length,
@@ -957,7 +957,7 @@ function cr({
     /* @__PURE__ */ l("div", { role: "none", className: e.jsonBlock, children: o })
   ] });
 }
-function Ct({ cls: e, label: t, values: n }) {
+function Et({ cls: e, label: t, values: n }) {
   return !n || n.length === 0 ? null : /* @__PURE__ */ k("div", { children: [
     /* @__PURE__ */ k("div", { className: e.hint, children: [
       t,
@@ -968,13 +968,13 @@ function Ct({ cls: e, label: t, values: n }) {
     /* @__PURE__ */ l("div", { className: e.list, children: n.map((o) => /* @__PURE__ */ l("div", { className: e.listItem, children: /* @__PURE__ */ l("span", { className: "tokenpanel-code", children: o }) }, o)) })
   ] });
 }
-function dr({ cls: e, message: t }) {
+function pr({ cls: e, message: t }) {
   return /* @__PURE__ */ k("div", { children: [
     /* @__PURE__ */ l("div", { className: e.statusError, role: "alert", children: t }),
     /* @__PURE__ */ l("div", { className: e.hint, children: "Your edits are still intact — click Retry to send the same diff again, or Close to keep editing." })
   ] });
 }
-function ur(e) {
+function fr(e) {
   if (!e) return "(unknown file)";
   const t = e.lastIndexOf("/");
   return t >= 0 ? e.slice(t + 1) : e;
@@ -1013,21 +1013,21 @@ function $e({
     }
   );
 }
-const pr = { h: 0, s: 0, l: 0, a: 100 };
-function fr(e) {
+const hr = { h: 0, s: 0, l: 0, a: 100 };
+function gr(e) {
   const t = e.toLowerCase();
   return /^#[0-9a-f]{6}$/.test(t) || /^#[0-9a-f]{8}$/.test(t) ? t : /^#[0-9a-f]{3}$/.test(t) ? `#${t[1]}${t[1]}${t[2]}${t[2]}${t[3]}${t[3]}` : /^#[0-9a-f]{4}$/.test(t) ? `#${t[1]}${t[1]}${t[2]}${t[2]}${t[3]}${t[3]}${t[4]}${t[4]}` : "";
 }
-function hr(e) {
-  const t = fr(e);
-  if (!t) return { ...pr };
+function kr(e) {
+  const t = gr(e);
+  if (!t) return { ...hr };
   const n = parseInt(t.slice(1, 3), 16) / 255, o = parseInt(t.slice(3, 5), 16) / 255, r = parseInt(t.slice(5, 7), 16) / 255, a = t.length === 9 ? Math.round(parseInt(t.slice(7, 9), 16) / 255 * 100) : 100, i = Math.max(n, o, r), s = Math.min(n, o, r), d = (i + s) / 2;
   if (i === s) return { h: 0, s: 0, l: Math.round(d * 100), a };
   const c = i - s, u = d > 0.5 ? c / (2 - i - s) : c / (i + s);
   let p = 0;
   return i === n ? p = ((o - r) / c + (o < r ? 6 : 0)) / 6 : i === o ? p = ((r - n) / c + 2) / 6 : p = ((n - o) / c + 4) / 6, { h: Math.round(p * 360), s: Math.round(u * 100), l: Math.round(d * 100), a };
 }
-function gr(e, t, n, o) {
+function mr(e, t, n, o) {
   t = Math.max(0, Math.min(100, t)), n = Math.max(0, Math.min(100, n)), o = Math.max(0, Math.min(100, o)), e = (e % 360 + 360) % 360;
   const r = t / 100, a = n / 100, i = (1 - Math.abs(2 * a - 1)) * r, s = i * (1 - Math.abs(e / 60 % 2 - 1)), d = a - i / 2;
   let c = 0, u = 0, p = 0;
@@ -1070,7 +1070,7 @@ const Pn = (e, t) => {
         alpha: (e & 255) / 255
       };
   }
-}, kr = {
+}, br = {
   aliceblue: 15792383,
   antiquewhite: 16444375,
   aqua: 65535,
@@ -1221,23 +1221,23 @@ const Pn = (e, t) => {
   whitesmoke: 16119285,
   yellow: 16776960,
   yellowgreen: 10145074
-}, mr = (e) => Pn(kr[e.toLowerCase()], 6), br = /^#?([0-9a-f]{8}|[0-9a-f]{6}|[0-9a-f]{4}|[0-9a-f]{3})$/i, vr = (e) => {
+}, vr = (e) => Pn(br[e.toLowerCase()], 6), wr = /^#?([0-9a-f]{8}|[0-9a-f]{6}|[0-9a-f]{4}|[0-9a-f]{3})$/i, xr = (e) => {
   let t;
-  return (t = e.match(br)) ? Pn(parseInt(t[1], 16), t[1].length) : void 0;
-}, Ce = "([+-]?\\d*\\.?\\d+(?:[eE][+-]?\\d+)?)", Be = `${Ce}%`, Ft = `(?:${Ce}%|${Ce})`, wr = `(?:${Ce}(deg|grad|rad|turn)|${Ce})`, Pe = "\\s*,\\s*", xr = new RegExp(
-  `^rgba?\\(\\s*${Ce}${Pe}${Ce}${Pe}${Ce}\\s*(?:,\\s*${Ft}\\s*)?\\)$`
-), yr = new RegExp(
-  `^rgba?\\(\\s*${Be}${Pe}${Be}${Pe}${Be}\\s*(?:,\\s*${Ft}\\s*)?\\)$`
-), Nr = (e) => {
+  return (t = e.match(wr)) ? Pn(parseInt(t[1], 16), t[1].length) : void 0;
+}, Ce = "([+-]?\\d*\\.?\\d+(?:[eE][+-]?\\d+)?)", He = `${Ce}%`, jt = `(?:${Ce}%|${Ce})`, yr = `(?:${Ce}(deg|grad|rad|turn)|${Ce})`, Pe = "\\s*,\\s*", Nr = new RegExp(
+  `^rgba?\\(\\s*${Ce}${Pe}${Ce}${Pe}${Ce}\\s*(?:,\\s*${jt}\\s*)?\\)$`
+), _r = new RegExp(
+  `^rgba?\\(\\s*${He}${Pe}${He}${Pe}${He}\\s*(?:,\\s*${jt}\\s*)?\\)$`
+), $r = (e) => {
   let t = { mode: "rgb" }, n;
-  if (n = e.match(xr))
+  if (n = e.match(Nr))
     n[1] !== void 0 && (t.r = n[1] / 255), n[2] !== void 0 && (t.g = n[2] / 255), n[3] !== void 0 && (t.b = n[3] / 255);
-  else if (n = e.match(yr))
+  else if (n = e.match(_r))
     n[1] !== void 0 && (t.r = n[1] / 100), n[2] !== void 0 && (t.g = n[2] / 100), n[3] !== void 0 && (t.b = n[3] / 100);
   else
     return;
   return n[4] !== void 0 ? t.alpha = Math.max(0, Math.min(1, n[4] / 100)) : n[5] !== void 0 && (t.alpha = Math.max(0, Math.min(1, +n[5]))), t;
-}, ot = (e, t) => e === void 0 ? void 0 : typeof e != "object" ? On(e) : e.mode !== void 0 ? e : t ? { ...e, mode: t } : void 0, me = (e = "rgb") => (t) => (t = ot(t, e)) !== void 0 ? (
+}, rt = (e, t) => e === void 0 ? void 0 : typeof e != "object" ? On(e) : e.mode !== void 0 ? e : t ? { ...e, mode: t } : void 0, me = (e = "rgb") => (t) => (t = rt(t, e)) !== void 0 ? (
   // if the color's mode corresponds to our target mode
   t.mode === e ? (
     // then just return the color
@@ -1260,7 +1260,7 @@ const Pn = (e, t) => {
       )
     )
   )
-) : void 0, ke = {}, In = {}, rt = [], Rn = {}, _r = (e) => e, jt = (e) => (ke[e.mode] = {
+) : void 0, ke = {}, In = {}, at = [], Rn = {}, Cr = (e) => e, Kt = (e) => (ke[e.mode] = {
   ...ke[e.mode],
   ...e.toMode
 }, Object.keys(e.fromMode || {}).forEach((t) => {
@@ -1270,16 +1270,16 @@ const Pn = (e, t) => {
     throw new Error(`Missing interpolator for: ${t}`);
   typeof e.interpolate[t] == "function" && (e.interpolate[t] = {
     use: e.interpolate[t]
-  }), e.interpolate[t].fixup || (e.interpolate[t].fixup = _r);
+  }), e.interpolate[t].fixup || (e.interpolate[t].fixup = Cr);
 }), In[e.mode] = e, (e.parse || []).forEach((t) => {
-  $r(t, e.mode);
-}), me(e.mode)), dt = (e) => In[e], $r = (e, t) => {
+  Er(t, e.mode);
+}), me(e.mode)), ut = (e) => In[e], Er = (e, t) => {
   if (typeof e == "string") {
     if (!t)
       throw new Error("'mode' required when 'parser' is a string");
     Rn[e] = t;
-  } else typeof e == "function" && rt.indexOf(e) < 0 && rt.push(e);
-}, It = /[^\x00-\x7F]|[a-zA-Z_]/, Cr = /[^\x00-\x7F]|[-\w]/, M = {
+  } else typeof e == "function" && at.indexOf(e) < 0 && at.push(e);
+}, It = /[^\x00-\x7F]|[a-zA-Z_]/, Sr = /[^\x00-\x7F]|[-\w]/, M = {
   Function: "function",
   Ident: "ident",
   Number: "number",
@@ -1308,7 +1308,7 @@ function Rt(e) {
   }
   return !1;
 }
-const Er = {
+const Tr = {
   deg: 1,
   rad: 180 / Math.PI,
   grad: 9 / 10,
@@ -1317,8 +1317,8 @@ const Er = {
 function ze(e) {
   let t = "";
   if ((e[L] === "-" || e[L] === "+") && (t += e[L++]), t += Ye(e), e[L] === "." && /\d/.test(e[L + 1]) && (t += e[L++] + Ye(e)), (e[L] === "e" || e[L] === "E") && ((e[L + 1] === "-" || e[L + 1] === "+") && /\d/.test(e[L + 2]) ? t += e[L++] + e[L++] + Ye(e) : /\d/.test(e[L + 1]) && (t += e[L++] + Ye(e))), Rt(e)) {
-    let n = at(e);
-    return n === "deg" || n === "rad" || n === "turn" || n === "grad" ? { type: M.Hue, value: t * Er[n] } : void 0;
+    let n = it(e);
+    return n === "deg" || n === "rad" || n === "turn" || n === "grad" ? { type: M.Hue, value: t * Tr[n] } : void 0;
   }
   return e[L] === "%" ? (L++, { type: M.Percentage, value: +t }) : { type: M.Number, value: +t };
 }
@@ -1328,17 +1328,17 @@ function Ye(e) {
     t += e[L++];
   return t;
 }
-function at(e) {
+function it(e) {
   let t = "";
-  for (; L < e.length && Cr.test(e[L]); )
+  for (; L < e.length && Sr.test(e[L]); )
     t += e[L++];
   return t;
 }
-function Sr(e) {
-  let t = at(e);
+function Mr(e) {
+  let t = it(e);
   return e[L] === "(" ? (L++, { type: M.Function, value: t }) : t === "none" ? { type: M.None, value: void 0 } : { type: M.Ident, value: t };
 }
-function Tr(e = "") {
+function Ar(e = "") {
   let t = e.trim(), n = [], o;
   for (L = 0; L < t.length; ) {
     if (o = t[L++], o === `
@@ -1367,7 +1367,7 @@ function Tr(e = "") {
         continue;
       }
       if (Rt(t)) {
-        n.push({ type: M.Ident, value: at(t) });
+        n.push({ type: M.Ident, value: it(t) });
         continue;
       }
       return;
@@ -1388,7 +1388,7 @@ function Tr(e = "") {
         n.push({ type: M.Alpha, value: r });
         continue;
       }
-      if (Rt(t) && at(t) === "none") {
+      if (Rt(t) && it(t) === "none") {
         n.push({
           type: M.Alpha,
           value: { type: M.None, value: void 0 }
@@ -1402,14 +1402,14 @@ function Tr(e = "") {
       continue;
     }
     if (It.test(o)) {
-      L--, n.push(Sr(t));
+      L--, n.push(Mr(t));
       continue;
     }
     return;
   }
   return n;
 }
-function Mr(e) {
+function Lr(e) {
   e._i = 0;
   let t = e[e._i++];
   if (!t || t.type !== M.Function || t.value !== "color" || (t = e[e._i++], t.type !== M.Ident))
@@ -1420,7 +1420,7 @@ function Mr(e) {
   const o = { mode: n }, r = zn(e, !1);
   if (!r)
     return;
-  const a = dt(n).channels;
+  const a = ut(n).channels;
   for (let i = 0, s, d; i < a.length; i++)
     s = r[i], d = a[i], s.type !== M.None && (o[d] = s.type === M.Number ? s.value : s.value / 100, d === "alpha" && (o[d] = Math.max(0, Math.min(1, o[d]))));
   return o;
@@ -1449,7 +1449,7 @@ function zn(e, t) {
     return n.length === 3 && n.push({ type: M.None, value: void 0 }), n.every((r) => r.type !== M.Alpha) ? n : void 0;
   }
 }
-function Ar(e, t) {
+function Pr(e, t) {
   e._i = 0;
   let n = e[e._i++];
   if (!n || n.type !== M.Function)
@@ -1461,14 +1461,14 @@ function Ar(e, t) {
 const On = (e) => {
   if (typeof e != "string")
     return;
-  const t = Tr(e), n = t ? Ar(t, !0) : void 0;
-  let o, r = 0, a = rt.length;
+  const t = Ar(e), n = t ? Pr(t, !0) : void 0;
+  let o, r = 0, a = at.length;
   for (; r < a; )
-    if ((o = rt[r++](e, n)) !== void 0)
+    if ((o = at[r++](e, n)) !== void 0)
       return o;
-  return t ? Mr(t) : void 0;
+  return t ? Lr(t) : void 0;
 };
-function Lr(e, t) {
+function Ir(e, t) {
   if (!t || t[0] !== "rgb" && t[0] !== "rgba")
     return;
   const n = { mode: "rgb" }, [, o, r, a, i] = t;
@@ -1481,31 +1481,31 @@ function Lr(e, t) {
       )
     )), n;
 }
-const Pr = (e) => e === "transparent" ? { mode: "rgb", r: 0, g: 0, b: 0, alpha: 0 } : void 0, Ir = (e, t, n) => e + n * (t - e), Rr = (e) => {
+const Rr = (e) => e === "transparent" ? { mode: "rgb", r: 0, g: 0, b: 0, alpha: 0 } : void 0, zr = (e, t, n) => e + n * (t - e), Or = (e) => {
   let t = [];
   for (let n = 0; n < e.length - 1; n++) {
     let o = e[n], r = e[n + 1];
     o === void 0 && r === void 0 ? t.push(void 0) : o !== void 0 && r !== void 0 ? t.push([o, r]) : t.push(o !== void 0 ? [o, o] : [r, r]);
   }
   return t;
-}, zr = (e) => (t) => {
-  let n = Rr(t);
+}, Dr = (e) => (t) => {
+  let n = Or(t);
   return (o) => {
     let r = o * n.length, a = o >= 1 ? n.length - 1 : Math.max(Math.floor(r), 0), i = n[a];
     return i === void 0 ? void 0 : e(i[0], i[1], r - a);
   };
-}, ue = zr(Ir), Kt = (e) => {
+}, ue = Dr(zr), Wt = (e) => {
   let t = !1, n = e.map((o) => o !== void 0 ? (t = !0, o) : 1);
   return t ? n : e;
-}, Or = {
+}, Vr = {
   mode: "rgb",
   channels: ["r", "g", "b", "alpha"],
   parse: [
-    Lr,
+    Ir,
+    xr,
+    $r,
     vr,
-    Nr,
-    mr,
-    Pr,
+    Rr,
     "srgb"
   ],
   serialize: "srgb",
@@ -1513,49 +1513,49 @@ const Pr = (e) => e === "transparent" ? { mode: "rgb", r: 0, g: 0, b: 0, alpha:
     r: ue,
     g: ue,
     b: ue,
-    alpha: { use: ue, fixup: Kt }
+    alpha: { use: ue, fixup: Wt }
   },
   gamut: !0,
   white: { r: 1, g: 1, b: 1 },
   black: { r: 0, g: 0, b: 0 }
-}, Et = (e = 0) => {
+}, St = (e = 0) => {
   const t = Math.abs(e);
   return t <= 0.04045 ? e / 12.92 : (Math.sign(e) || 1) * Math.pow((t + 0.055) / 1.055, 2.4);
 }, Dn = ({ r: e, g: t, b: n, alpha: o }) => {
   let r = {
     mode: "lrgb",
-    r: Et(e),
-    g: Et(t),
-    b: Et(n)
+    r: St(e),
+    g: St(t),
+    b: St(n)
   };
   return o !== void 0 && (r.alpha = o), r;
-}, St = (e = 0) => {
+}, Tt = (e = 0) => {
   const t = Math.abs(e);
   return t > 31308e-7 ? (Math.sign(e) || 1) * (1.055 * Math.pow(t, 1 / 2.4) - 0.055) : e * 12.92;
 }, Vn = ({ r: e, g: t, b: n, alpha: o }, r = "rgb") => {
   let a = {
     mode: r,
-    r: St(e),
-    g: St(t),
-    b: St(n)
+    r: Tt(e),
+    g: Tt(t),
+    b: Tt(n)
   };
   return o !== void 0 && (a.alpha = o), a;
-}, Ee = (e) => (e = e % 360) < 0 ? e + 360 : e, Dr = (e, t) => e.map((n, o, r) => {
+}, Ee = (e) => (e = e % 360) < 0 ? e + 360 : e, Hr = (e, t) => e.map((n, o, r) => {
   if (n === void 0)
     return n;
   let a = Ee(n);
   return o === 0 || e[o - 1] === void 0 ? a : t(a - Ee(r[o - 1]));
-}).reduce((n, o) => !n.length || o === void 0 || n[n.length - 1] === void 0 ? (n.push(o), n) : (n.push(o + n[n.length - 1]), n), []), Bn = (e) => Dr(e, (t) => Math.abs(t) <= 180 ? t : t - 360 * Math.sign(t)), Vr = (e, t) => {
+}).reduce((n, o) => !n.length || o === void 0 || n[n.length - 1] === void 0 ? (n.push(o), n) : (n.push(o + n[n.length - 1]), n), []), Hn = (e) => Hr(e, (t) => Math.abs(t) <= 180 ? t : t - 360 * Math.sign(t)), Br = (e, t) => {
   if (e.h === void 0 || t.h === void 0 || !e.s || !t.s)
     return 0;
   let n = Ee(e.h), o = Ee(t.h), r = Math.sin((o - n + 360) / 2 * Math.PI / 180);
   return 2 * Math.sqrt(e.s * t.s) * r;
-}, Br = (e, t) => {
+}, Fr = (e, t) => {
   if (e.h === void 0 || t.h === void 0 || !e.c || !t.c)
     return 0;
   let n = Ee(e.h), o = Ee(t.h), r = Math.sin((o - n + 360) / 2 * Math.PI / 180);
   return 2 * Math.sqrt(e.c * t.c) * r;
-}, Hn = (e) => {
+}, Bn = (e) => {
   let t = e.reduce(
     (o, r) => {
       if (r !== void 0) {
@@ -1567,11 +1567,11 @@ const Pr = (e) => e === "transparent" ? { mode: "rgb", r: 0, g: 0, b: 0, alpha:
     { sin: 0, cos: 0 }
   ), n = Math.atan2(t.sin, t.cos) * 180 / Math.PI;
   return n < 0 ? 360 + n : n;
-}, it = ({ l: e, a: t, b: n, alpha: o }, r = "lch") => {
+}, lt = ({ l: e, a: t, b: n, alpha: o }, r = "lch") => {
   t === void 0 && (t = 0), n === void 0 && (n = 0);
   let a = Math.sqrt(t * t + n * n), i = { mode: r, l: e, c: a };
   return a && (i.h = Ee(Math.atan2(n, t) * 180 / Math.PI)), o !== void 0 && (i.alpha = o), i;
-}, lt = ({ l: e, c: t, h: n, alpha: o }, r = "lab") => {
+}, st = ({ l: e, c: t, h: n, alpha: o }, r = "lab") => {
   n === void 0 && (n = 0);
   let a = {
     mode: r,
@@ -1585,7 +1585,7 @@ const Pr = (e) => e === "transparent" ? { mode: "rgb", r: 0, g: 0, b: 0, alpha:
   Y: 1,
   Z: (1 - 0.3457 - 0.3585) / 0.3585
 };
-function Hr({ h: e, s: t, l: n, alpha: o }) {
+function jr({ h: e, s: t, l: n, alpha: o }) {
   e = Ee(e !== void 0 ? e : 0), t === void 0 && (t = 0), n === void 0 && (n = 0);
   let r = n + t * (n < 0.5 ? n : 1 - n), a = r - (r - n) * 2 * Math.abs(e / 60 % 2 - 1), i;
   switch (Math.floor(e / 60)) {
@@ -1612,7 +1612,7 @@ function Hr({ h: e, s: t, l: n, alpha: o }) {
   }
   return i.mode = "rgb", o !== void 0 && (i.alpha = o), i;
 }
-function Fr({ r: e, g: t, b: n, alpha: o }) {
+function Kr({ r: e, g: t, b: n, alpha: o }) {
   e === void 0 && (e = 0), t === void 0 && (t = 0), n === void 0 && (n = 0);
   let r = Math.max(e, t, n), a = Math.min(e, t, n), i = {
     mode: "hsl",
@@ -1621,7 +1621,7 @@ function Fr({ r: e, g: t, b: n, alpha: o }) {
   };
   return r - a !== 0 && (i.h = (r === e ? (t - n) / (r - a) + (t < n) * 6 : r === t ? (n - e) / (r - a) + 2 : (e - t) / (r - a) + 4) * 60), o !== void 0 && (i.alpha = o), i;
 }
-const jr = (e, t) => {
+const Wr = (e, t) => {
   switch (t) {
     case "deg":
       return +e;
@@ -1632,15 +1632,15 @@ const jr = (e, t) => {
     case "turn":
       return e * 360;
   }
-}, Kr = new RegExp(
-  `^hsla?\\(\\s*${wr}${Pe}${Be}${Pe}${Be}\\s*(?:,\\s*${Ft}\\s*)?\\)$`
-), Wr = (e) => {
-  let t = e.match(Kr);
+}, Xr = new RegExp(
+  `^hsla?\\(\\s*${yr}${Pe}${He}${Pe}${He}\\s*(?:,\\s*${jt}\\s*)?\\)$`
+), Yr = (e) => {
+  let t = e.match(Xr);
   if (!t) return;
   let n = { mode: "hsl" };
-  return t[3] !== void 0 ? n.h = +t[3] : t[1] !== void 0 && t[2] !== void 0 && (n.h = jr(t[1], t[2])), t[4] !== void 0 && (n.s = Math.min(Math.max(0, t[4] / 100), 1)), t[5] !== void 0 && (n.l = Math.min(Math.max(0, t[5] / 100), 1)), t[6] !== void 0 ? n.alpha = Math.max(0, Math.min(1, t[6] / 100)) : t[7] !== void 0 && (n.alpha = Math.max(0, Math.min(1, +t[7]))), n;
+  return t[3] !== void 0 ? n.h = +t[3] : t[1] !== void 0 && t[2] !== void 0 && (n.h = Wr(t[1], t[2])), t[4] !== void 0 && (n.s = Math.min(Math.max(0, t[4] / 100), 1)), t[5] !== void 0 && (n.l = Math.min(Math.max(0, t[5] / 100), 1)), t[6] !== void 0 ? n.alpha = Math.max(0, Math.min(1, t[6] / 100)) : t[7] !== void 0 && (n.alpha = Math.max(0, Math.min(1, +t[7]))), n;
 };
-function Xr(e, t) {
+function qr(e, t) {
   if (!t || t[0] !== "hsl" && t[0] !== "hsla")
     return;
   const n = { mode: "hsl" }, [, o, r, a, i] = t;
@@ -1667,45 +1667,45 @@ function Xr(e, t) {
     )
   )), n;
 }
-const Yr = {
+const Gr = {
   mode: "hsl",
   toMode: {
-    rgb: Hr
+    rgb: jr
   },
   fromMode: {
-    rgb: Fr
+    rgb: Kr
   },
   channels: ["h", "s", "l", "alpha"],
   ranges: {
     h: [0, 360]
   },
   gamut: "rgb",
-  parse: [Xr, Wr],
+  parse: [qr, Yr],
   serialize: (e) => `hsl(${e.h !== void 0 ? e.h : "none"} ${e.s !== void 0 ? e.s * 100 + "%" : "none"} ${e.l !== void 0 ? e.l * 100 + "%" : "none"}${e.alpha < 1 ? ` / ${e.alpha}` : ""})`,
   interpolate: {
-    h: { use: ue, fixup: Bn },
+    h: { use: ue, fixup: Hn },
     s: ue,
     l: ue,
-    alpha: { use: ue, fixup: Kt }
+    alpha: { use: ue, fixup: Wt }
   },
   difference: {
-    h: Vr
+    h: Br
   },
   average: {
-    h: Hn
+    h: Bn
   }
 }, Fn = Math.pow(29, 3) / Math.pow(3, 3), jn = Math.pow(6, 3) / Math.pow(29, 3);
-let Tt = (e) => Math.pow(e, 3) > jn ? Math.pow(e, 3) : (116 * e - 16) / Fn;
-const qr = ({ l: e, a: t, b: n, alpha: o }) => {
+let Mt = (e) => Math.pow(e, 3) > jn ? Math.pow(e, 3) : (116 * e - 16) / Fn;
+const Ur = ({ l: e, a: t, b: n, alpha: o }) => {
   e === void 0 && (e = 0), t === void 0 && (t = 0), n === void 0 && (n = 0);
   let r = (e + 16) / 116, a = t / 500 + r, i = r - n / 200, s = {
     mode: "xyz50",
-    x: Tt(a) * Ae.X,
-    y: Tt(r) * Ae.Y,
-    z: Tt(i) * Ae.Z
+    x: Mt(a) * Ae.X,
+    y: Mt(r) * Ae.Y,
+    z: Mt(i) * Ae.Z
   };
   return o !== void 0 && (s.alpha = o), s;
-}, Gr = ({ x: e, y: t, z: n, alpha: o }) => {
+}, Jr = ({ x: e, y: t, z: n, alpha: o }) => {
   e === void 0 && (e = 0), t === void 0 && (t = 0), n === void 0 && (n = 0);
   let r = Vn({
     r: e * 3.1341359569958707 - t * 1.6173863321612538 - 0.4906619460083532 * n,
@@ -1713,7 +1713,7 @@ const qr = ({ l: e, a: t, b: n, alpha: o }) => {
     b: e * 0.07195537988411677 - t * 0.2289768264158322 + 1.405386058324125 * n
   });
   return o !== void 0 && (r.alpha = o), r;
-}, Ur = (e) => Gr(qr(e)), Jr = (e) => {
+}, Zr = (e) => Jr(Ur(e)), Qr = (e) => {
   let { r: t, g: n, b: o, alpha: r } = Dn(e), a = {
     mode: "xyz50",
     x: 0.436065742824811 * t + 0.3851514688337912 * n + 0.14307845442264197 * o,
@@ -1721,20 +1721,20 @@ const qr = ({ l: e, a: t, b: n, alpha: o }) => {
     z: 0.013923904500943465 * t + 0.09708128566574634 * n + 0.7140993584005155 * o
   };
   return r !== void 0 && (a.alpha = r), a;
-}, Mt = (e) => e > jn ? Math.cbrt(e) : (Fn * e + 16) / 116, Zr = ({ x: e, y: t, z: n, alpha: o }) => {
+}, At = (e) => e > jn ? Math.cbrt(e) : (Fn * e + 16) / 116, ea = ({ x: e, y: t, z: n, alpha: o }) => {
   e === void 0 && (e = 0), t === void 0 && (t = 0), n === void 0 && (n = 0);
-  let r = Mt(e / Ae.X), a = Mt(t / Ae.Y), i = Mt(n / Ae.Z), s = {
+  let r = At(e / Ae.X), a = At(t / Ae.Y), i = At(n / Ae.Z), s = {
     mode: "lab",
     l: 116 * a - 16,
     a: 500 * (r - a),
     b: 200 * (a - i)
   };
   return o !== void 0 && (s.alpha = o), s;
-}, Qr = (e) => {
-  let t = Zr(Jr(e));
+}, ta = (e) => {
+  let t = ea(Qr(e));
   return e.r === e.b && e.b === e.g && (t.a = t.b = 0), t;
 };
-function ea(e, t) {
+function na(e, t) {
   if (!t || t[0] !== "lch")
     return;
   const n = { mode: "lch" }, [, o, r, a, i] = t;
@@ -1759,15 +1759,15 @@ function ea(e, t) {
     )
   )), n;
 }
-const ta = {
+const oa = {
   mode: "lch",
   toMode: {
-    lab: lt,
-    rgb: (e) => Ur(lt(e))
+    lab: st,
+    rgb: (e) => Zr(st(e))
   },
   fromMode: {
-    rgb: (e) => it(Qr(e)),
-    lab: it
+    rgb: (e) => lt(ta(e)),
+    lab: lt
   },
   channels: ["l", "c", "h", "alpha"],
   ranges: {
@@ -1775,21 +1775,21 @@ const ta = {
     c: [0, 150],
     h: [0, 360]
   },
-  parse: [ea],
+  parse: [na],
   serialize: (e) => `lch(${e.l !== void 0 ? e.l : "none"} ${e.c !== void 0 ? e.c : "none"} ${e.h !== void 0 ? e.h : "none"}${e.alpha < 1 ? ` / ${e.alpha}` : ""})`,
   interpolate: {
-    h: { use: ue, fixup: Bn },
+    h: { use: ue, fixup: Hn },
     c: ue,
     l: ue,
-    alpha: { use: ue, fixup: Kt }
+    alpha: { use: ue, fixup: Wt }
   },
   difference: {
-    h: Br
+    h: Fr
   },
   average: {
-    h: Hn
+    h: Bn
   }
-}, na = ({ r: e, g: t, b: n, alpha: o }) => {
+}, ra = ({ r: e, g: t, b: n, alpha: o }) => {
   e === void 0 && (e = 0), t === void 0 && (t = 0), n === void 0 && (n = 0);
   let r = Math.cbrt(
     0.412221469470763 * e + 0.5363325372617348 * t + 0.0514459932675022 * n
@@ -1804,10 +1804,10 @@ const ta = {
     b: 0.0259040424655478 * r + 0.7827717124575296 * a - 0.8086757549230774 * i
   };
   return o !== void 0 && (s.alpha = o), s;
-}, oa = (e) => {
-  let t = na(Dn(e));
+}, aa = (e) => {
+  let t = ra(Dn(e));
   return e.r === e.b && e.b === e.g && (t.a = t.b = 0), t;
-}, ra = ({ l: e, a: t, b: n, alpha: o }) => {
+}, ia = ({ l: e, a: t, b: n, alpha: o }) => {
   e === void 0 && (e = 0), t === void 0 && (t = 0), n === void 0 && (n = 0);
   let r = Math.pow(e + 0.3963377773761749 * t + 0.2158037573099136 * n, 3), a = Math.pow(e - 0.1055613458156586 * t - 0.0638541728258133 * n, 3), i = Math.pow(e - 0.0894841775298119 * t - 1.2914855480194092 * n, 3), s = {
     mode: "lrgb",
@@ -1816,8 +1816,8 @@ const ta = {
     b: -0.0041960761386756 * r - 0.7034186179359362 * a + 1.7076146940746117 * i
   };
   return o !== void 0 && (s.alpha = o), s;
-}, aa = (e) => Vn(ra(e));
-function ia(e, t) {
+}, la = (e) => Vn(ia(e));
+function sa(e, t) {
   if (!t || t[0] !== "oklch")
     return;
   const n = { mode: "oklch" }, [, o, r, a, i] = t;
@@ -1845,35 +1845,35 @@ function ia(e, t) {
     )
   )), n;
 }
-const la = {
-  ...ta,
+const ca = {
+  ...oa,
   mode: "oklch",
   toMode: {
-    oklab: (e) => lt(e, "oklab"),
-    rgb: (e) => aa(lt(e, "oklab"))
+    oklab: (e) => st(e, "oklab"),
+    rgb: (e) => la(st(e, "oklab"))
   },
   fromMode: {
-    rgb: (e) => it(oa(e), "oklch"),
-    oklab: (e) => it(e, "oklch")
+    rgb: (e) => lt(aa(e), "oklch"),
+    oklab: (e) => lt(e, "oklch")
   },
-  parse: [ia],
+  parse: [sa],
   serialize: (e) => `oklch(${e.l !== void 0 ? e.l : "none"} ${e.c !== void 0 ? e.c : "none"} ${e.h !== void 0 ? e.h : "none"}${e.alpha < 1 ? ` / ${e.alpha}` : ""})`,
   ranges: {
     l: [0, 1],
     c: [0, 0.4],
     h: [0, 360]
   }
-}, sa = (e) => Math.max(0, Math.min(1, e || 0)), tt = (e) => Math.round(sa(e) * 255), Kn = me("rgb"), Wn = (e) => {
+}, da = (e) => Math.max(0, Math.min(1, e || 0)), tt = (e) => Math.round(da(e) * 255), Kn = me("rgb"), Wn = (e) => {
   if (e === void 0)
     return;
   let t = tt(e.r), n = tt(e.g), o = tt(e.b);
   return "#" + (1 << 24 | t << 16 | n << 8 | o).toString(16).slice(1);
-}, ca = (e) => {
+}, ua = (e) => {
   if (e === void 0)
     return;
   let t = tt(e.alpha !== void 0 ? e.alpha : 1);
   return Wn(e) + (256 | t).toString(16).slice(1);
-}, da = (e) => Wn(Kn(e)), ua = (e) => ca(Kn(e)), Xn = me("rgb"), Yn = (e) => {
+}, pa = (e) => Wn(Kn(e)), fa = (e) => ua(Kn(e)), Xn = me("rgb"), Yn = (e) => {
   const t = {
     mode: e.mode,
     r: Math.max(0, Math.min(e.r !== void 0 ? e.r : 0, 1)),
@@ -1881,24 +1881,24 @@ const la = {
     b: Math.max(0, Math.min(e.b !== void 0 ? e.b : 0, 1))
   };
   return e.alpha !== void 0 && (t.alpha = e.alpha), t;
-}, pa = (e) => Yn(Xn(e)), qn = (e) => e !== void 0 && (e.r === void 0 || e.r >= 0 && e.r <= 1) && (e.g === void 0 || e.g >= 0 && e.g <= 1) && (e.b === void 0 || e.b >= 0 && e.b <= 1);
-function fa(e) {
+}, ha = (e) => Yn(Xn(e)), qn = (e) => e !== void 0 && (e.r === void 0 || e.r >= 0 && e.r <= 1) && (e.g === void 0 || e.g >= 0 && e.g <= 1) && (e.b === void 0 || e.b >= 0 && e.b <= 1);
+function ga(e) {
   return qn(Xn(e));
 }
-function Wt(e = "rgb") {
-  const { gamut: t } = dt(e);
+function Xt(e = "rgb") {
+  const { gamut: t } = ut(e);
   if (!t)
     return (o) => !0;
   const n = me(typeof t == "string" ? t : e);
   return (o) => qn(n(o));
 }
-function ha(e = "rgb") {
-  const { gamut: t } = dt(e);
+function ka(e = "rgb") {
+  const { gamut: t } = ut(e);
   if (!t)
-    return (a) => ot(a);
-  const n = typeof t == "string" ? t : e, o = me(n), r = Wt(n);
+    return (a) => rt(a);
+  const n = typeof t == "string" ? t : e, o = me(n), r = Xt(n);
   return (a) => {
-    const i = ot(a);
+    const i = rt(a);
     if (!i)
       return;
     const s = o(i);
@@ -1908,27 +1908,27 @@ function ha(e = "rgb") {
     return i.mode === d.mode ? d : me(i.mode)(d);
   };
 }
-function ga(e, t = "lch", n = "rgb") {
-  e = ot(e);
-  let o = n === "rgb" ? fa : Wt(n), r = n === "rgb" ? pa : ha(n);
+function ma(e, t = "lch", n = "rgb") {
+  e = rt(e);
+  let o = n === "rgb" ? ga : Xt(n), r = n === "rgb" ? ha : ka(n);
   if (e === void 0 || o(e)) return e;
   let a = me(e.mode);
   e = me(t)(e);
   let i = { ...e, c: 0 };
   if (!o(i))
     return a(r(i));
-  let s = 0, d = e.c !== void 0 ? e.c : 0, c = dt(t).ranges.c, u = (c[1] - c[0]) / Math.pow(2, 13), p = i.c;
+  let s = 0, d = e.c !== void 0 ? e.c : 0, c = ut(t).ranges.c, u = (c[1] - c[0]) / Math.pow(2, 13), p = i.c;
   for (; d - s > u; )
     i.c = s + (d - s) * 0.5, o(i) ? (p = i.c, s = i.c) : d = i.c;
   return a(
     o(i) ? i : { ...i, c: p }
   );
 }
-jt(la);
-jt(Or);
-jt(Yr);
-const Gn = 0.37, Un = me("oklch"), Jn = me("rgb"), ka = Wt("rgb");
-function Xt(e) {
+Kt(ca);
+Kt(Vr);
+Kt(Gr);
+const Gn = 0.37, Un = me("oklch"), Jn = me("rgb"), ba = Xt("rgb");
+function Yt(e) {
   return {
     mode: "oklch",
     l: e.l / 100,
@@ -1937,7 +1937,7 @@ function Xt(e) {
     alpha: e.a / 100
   };
 }
-function ma(e) {
+function va(e) {
   return {
     l: (e.l ?? 0) * 100,
     c: e.c ?? 0,
@@ -1952,7 +1952,7 @@ function ne(e) {
   const r = (e.a / 100).toFixed(4);
   return `oklch(${t} ${n} ${o} / ${r})`;
 }
-function ba(e) {
+function wa(e) {
   const t = { l: 0, c: 0, h: 0, a: 100 };
   try {
     const n = On(e);
@@ -1970,9 +1970,9 @@ function ba(e) {
     return t;
   }
 }
-function on(e, t) {
-  const n = Xt(e), o = Jn(n);
-  return o ? e.a < 100 ? ua({ ...o, alpha: e.a / 100 }) ?? "#000000ff" : da(o) ?? "#000000" : "#000000";
+function rn(e, t) {
+  const n = Yt(e), o = Jn(n);
+  return o ? e.a < 100 ? fa({ ...o, alpha: e.a / 100 }) ?? "#000000ff" : pa(o) ?? "#000000" : "#000000";
 }
 function _e(e) {
   const t = {
@@ -1982,10 +1982,10 @@ function _e(e) {
     l: e.l / 100,
     alpha: e.a / 100
   }, n = Un(t);
-  return n ? ma(n) : { l: 0, c: 0, h: 0, a: e.a };
+  return n ? va(n) : { l: 0, c: 0, h: 0, a: e.a };
 }
-function rn(e) {
-  const t = Xt(e), n = ga(t, "oklch", "rgb");
+function an(e) {
+  const t = Yt(e), n = ma(t, "oklch", "rgb");
   return n ? {
     l: (n.l ?? e.l / 100) * 100,
     c: n.c ?? 0,
@@ -1993,19 +1993,19 @@ function rn(e) {
     a: e.a
   } : { l: e.l, c: 0, h: e.h, a: e.a };
 }
-function va(e) {
-  const t = Jn(Xt(e));
-  return t ? ka(t) : !1;
+function xa(e) {
+  const t = Jn(Yt(e));
+  return t ? ba(t) : !1;
 }
 function qe(e, t, n) {
   return Math.min(n, Math.max(t, e));
 }
-function wa(e, t, n) {
+function ya(e, t, n) {
   if (n <= 0) return e;
   const o = Math.round((e - t) / n);
   return t + o * n;
 }
-function an({
+function ln({
   config: e,
   value: t,
   gradient: n,
@@ -2030,7 +2030,7 @@ function an({
     if (!_) return null;
     const S = _.getBoundingClientRect();
     if (S.width === 0) return null;
-    const H = qe((g - S.left) / S.width, 0, 1), K = C.current + H * (E.current - C.current), Y = wa(K, C.current, h.current);
+    const B = qe((g - S.left) / S.width, 0, 1), K = C.current + B * (E.current - C.current), Y = ya(K, C.current, h.current);
     return qe(Y, C.current, E.current);
   }
   X(() => {
@@ -2050,7 +2050,7 @@ function an({
       const ee = N(Y.clientX);
       ee !== null && x.current(ee);
     }
-    function H(Y) {
+    function B(Y) {
       if (m.current) {
         m.current = !1;
         try {
@@ -2070,8 +2070,8 @@ function an({
         w.current();
       }
     }
-    return g.addEventListener("pointerdown", _), g.addEventListener("pointermove", S), g.addEventListener("pointerup", H), g.addEventListener("pointercancel", K), () => {
-      g.removeEventListener("pointerdown", _), g.removeEventListener("pointermove", S), g.removeEventListener("pointerup", H), g.removeEventListener("pointercancel", K);
+    return g.addEventListener("pointerdown", _), g.addEventListener("pointermove", S), g.addEventListener("pointerup", B), g.addEventListener("pointercancel", K), () => {
+      g.removeEventListener("pointerdown", _), g.removeEventListener("pointermove", S), g.removeEventListener("pointerup", B), g.removeEventListener("pointercancel", K);
     };
   }, []);
   const v = z(
@@ -2136,8 +2136,8 @@ function an({
     /* @__PURE__ */ l("span", { className: "tokenpanel-color-picker-slider-value", children: p(t) })
   ] });
 }
-const Zn = "tokenpanel.colorPicker.mode", zt = [95, 78, 61, 44, 27, 10], xa = [0, 60, 120, 180, 240, 300], ya = [0, 30, 60, 90, 120, 150, 180, 210, 240, 270, 300, 330], Na = 0.18, _a = 320, $a = 400, Ca = 520, Ea = 440;
-function Sa() {
+const Zn = "tokenpanel.colorPicker.mode", zt = [95, 78, 61, 44, 27, 10], Na = [0, 60, 120, 180, 240, 300], _a = [0, 30, 60, 90, 120, 150, 180, 210, 240, 270, 300, 330], $a = 0.18, Ca = 320, Ea = 400, Sa = 520, Ta = 440;
+function Ma() {
   return [
     {
       key: "l",
@@ -2177,7 +2177,7 @@ function Sa() {
     }
   ];
 }
-function Ta() {
+function Aa() {
   return [
     {
       key: "h",
@@ -2217,15 +2217,15 @@ function Ta() {
     }
   ];
 }
-function ln(e, t, n, o) {
+function sn(e, t, n, o) {
   return {
     l: zt[e] ?? 50,
-    c: Na,
+    c: $a,
     h: o[t] ?? 0,
     a: n
   };
 }
-function Ma(e) {
+function La(e) {
   if (typeof window > "u") return e;
   try {
     const t = window.localStorage.getItem(Zn);
@@ -2234,14 +2234,14 @@ function Ma(e) {
   }
   return e;
 }
-function Aa(e) {
+function Pa(e) {
   if (!(typeof window > "u"))
     try {
       window.localStorage.setItem(Zn, e);
     } catch {
     }
 }
-function La(e, t) {
+function Ia(e, t) {
   const [n, o] = j(e);
   return X(() => {
     t.current || o(e);
@@ -2279,15 +2279,15 @@ function to({
   anchorRef: r,
   onClose: a
 }) {
-  const i = O(null), s = O(null), d = O(!1), [c, u] = La(e, d), [p, h] = j(
+  const i = O(null), s = O(null), d = O(!1), [c, u] = Ia(e, d), [p, h] = j(
     null
   ), m = O(null), $ = O(!1), [b, x] = j(
-    () => Ma(o)
+    () => La(o)
   ), [f, w] = j("mini"), [C, E] = j(c);
   X(() => {
     (/^#[0-9a-fA-F]{6}$/.test(C) || /^#[0-9a-fA-F]{8}$/.test(C)) && E(c);
   }, [c]), eo(i, a);
-  const N = Z(() => ba(c), [c]), v = Z(() => hr(c), [c]), g = z(
+  const N = Z(() => wa(c), [c]), v = Z(() => kr(c), [c]), g = z(
     (y) => {
       const R = y.toLowerCase();
       u(R), E(R), t(R);
@@ -2301,7 +2301,7 @@ function to({
         h: y.h ?? N.h,
         a: y.a ?? N.a
       };
-      g(on(R));
+      g(rn(R));
     },
     [N, g]
   ), S = z(
@@ -2312,15 +2312,15 @@ function to({
         l: y.l ?? v.l,
         a: y.a ?? v.a
       };
-      g(gr(R.h, R.s, R.l, R.a));
+      g(mr(R.h, R.s, R.l, R.a));
     },
     [v, g]
-  ), H = (y) => {
+  ), B = (y) => {
     E(y), (/^#[0-9a-fA-F]{6}$/.test(y) || /^#[0-9a-fA-F]{8}$/.test(y)) && g(y);
-  }, K = f === "expanded" ? ya : xa, Y = z(
+  }, K = f === "expanded" ? _a : Na, Y = z(
     (y, R) => {
-      const J = ln(y, R, N.a, K), F = rn(J);
-      g(on(F));
+      const J = sn(y, R, N.a, K), F = an(J);
+      g(rn(F));
     },
     [N.a, K, g]
   ), ee = z(
@@ -2342,8 +2342,8 @@ function to({
     },
     [K, Y]
   ), pe = (y) => {
-    Aa(y), x(y);
-  }, oe = Z(() => Sa(), []), ye = Z(() => Ta(), []), he = Z(() => b === "oklch" ? {
+    Pa(y), x(y);
+  }, oe = Z(() => Ma(), []), ye = Z(() => Aa(), []), he = Z(() => b === "oklch" ? {
     l: `linear-gradient(90deg in oklch, ${ne({ l: 0, c: N.c, h: N.h, a: 100 })}, ${ne({ l: 100, c: N.c, h: N.h, a: 100 })})`,
     c: `linear-gradient(90deg in oklch, ${ne({ l: N.l, c: 0, h: N.h, a: 100 })}, ${ne({ l: N.l, c: Gn, h: N.h, a: 100 })})`,
     h: `linear-gradient(90deg in oklch longer hue, ${ne({ l: N.l, c: N.c, h: 0, a: 100 })}, ${ne({ l: N.l, c: N.c, h: 360, a: 100 })})`,
@@ -2357,7 +2357,7 @@ function to({
     position: "fixed",
     visibility: "hidden"
   }));
-  yo(() => {
+  _o(() => {
     const y = r.current;
     if (!y) {
       A({ position: "fixed", visibility: "hidden" });
@@ -2366,8 +2366,8 @@ function to({
     A(
       Qn(
         y,
-        f === "mini" ? _a : Ca,
-        f === "mini" ? $a : Ea
+        f === "mini" ? Ca : Sa,
+        f === "mini" ? Ea : Ta
       )
     );
   }, [r, f]), X(() => {
@@ -2377,13 +2377,13 @@ function to({
       W.preventDefault(), W.stopPropagation();
       const T = i.current;
       if (!T) return;
-      const B = T.getBoundingClientRect();
+      const H = T.getBoundingClientRect();
       m.current = {
         pointerId: W.pointerId,
         startX: W.clientX,
         startY: W.clientY,
-        baseLeft: B.left,
-        baseTop: B.top
+        baseLeft: H.left,
+        baseTop: H.top
       }, $.current = !0;
       try {
         y.setPointerCapture(W.pointerId);
@@ -2392,7 +2392,7 @@ function to({
     }
     function J(W) {
       if (!$.current || !m.current || W.pointerId !== m.current.pointerId) return;
-      const { startX: T, startY: B, baseLeft: V, baseTop: U } = m.current, I = V + (W.clientX - T), q = U + (W.clientY - B);
+      const { startX: T, startY: H, baseLeft: V, baseTop: U } = m.current, I = V + (W.clientX - T), q = U + (W.clientY - H);
       h({ left: I, top: q });
     }
     function F(W) {
@@ -2404,12 +2404,12 @@ function to({
       }
       const T = i.current;
       if (!T) return;
-      const B = T.getBoundingClientRect(), V = 8, U = window.innerWidth, I = window.innerHeight, q = Math.max(
+      const H = T.getBoundingClientRect(), V = 8, U = window.innerWidth, I = window.innerHeight, q = Math.max(
         V,
-        Math.min(U - V - B.width, B.left)
+        Math.min(U - V - H.width, H.left)
       ), fe = Math.max(
         V,
-        Math.min(I - V - B.height, B.top)
+        Math.min(I - V - H.height, H.top)
       );
       h({ left: q, top: fe });
     }
@@ -2515,7 +2515,7 @@ function to({
               type: "text",
               className: "tokenpanel-color-picker-hex-input",
               value: C,
-              onChange: (y) => H(y.target.value),
+              onChange: (y) => B(y.target.value),
               spellcheck: !1,
               "aria-label": "Hex color value"
             }
@@ -2528,7 +2528,7 @@ function to({
             role: "grid",
             "aria-label": "Color presets",
             children: zt.map((y, R) => /* @__PURE__ */ l("div", { role: "row", children: K.map((J, F) => {
-              const W = ln(R, F, N.a, K), T = va(W), B = ne(rn(W)), V = Math.abs(N.h - W.h) % 360, U = Math.min(V, 360 - V), I = Math.abs(N.l - W.l) < 2 && U < 5 && Math.abs(N.c - W.c) < 0.05;
+              const W = sn(R, F, N.a, K), T = xa(W), H = ne(an(W)), V = Math.abs(N.h - W.h) % 360, U = Math.min(V, 360 - V), I = Math.abs(N.l - W.l) < 2 && U < 5 && Math.abs(N.c - W.c) < 0.05;
               return /* @__PURE__ */ l(
                 "div",
                 {
@@ -2539,7 +2539,7 @@ function to({
                   "aria-selected": I,
                   "aria-label": `Preset L ${W.l}% H ${W.h}°`,
                   className: "tokenpanel-color-picker-grid-cell",
-                  style: { background: B },
+                  style: { background: H },
                   tabIndex: R === 0 && F === 0 ? 0 : -1,
                   onClick: () => Y(R, F),
                   onKeyDown: (q) => ee(q, R, F)
@@ -2550,7 +2550,7 @@ function to({
           }
         ),
         /* @__PURE__ */ l("div", { className: "tokenpanel-color-picker-sliders", children: b === "oklch" ? oe.map((y) => /* @__PURE__ */ l(
-          an,
+          ln,
           {
             config: y,
             value: N[y.key] ?? 0,
@@ -2561,7 +2561,7 @@ function to({
           },
           y.key
         )) : ye.map((y) => /* @__PURE__ */ l(
-          an,
+          ln,
           {
             config: y,
             value: v[y.key] ?? 0,
@@ -2586,9 +2586,9 @@ function to({
     }
   );
 }
-const Yt = Vt(null);
+const qt = Ht(null);
 function ie({ cssVar: e }) {
-  const t = Ht(Yt);
+  const t = Ft(qt);
   if (t === null) return null;
   const { state: n, toggle: o, matchCounts: r } = t, a = n.active[e], i = a !== void 0, s = i ? n.slots[a]?.color : void 0, d = r?.[e], c = G(() => {
     o(e);
@@ -2635,11 +2635,11 @@ function ie({ cssVar: e }) {
     }
   );
 }
-function Pa({
+function Ra({
   anchorRef: e,
   onClose: t
 }) {
-  const n = No(Yt), [o, r] = j(null), a = O(Array.from({ length: 10 }, () => null)), i = O(null), s = O(null);
+  const n = $o(qt), [o, r] = j(null), a = O(Array.from({ length: 10 }, () => null)), i = O(null), s = O(null);
   if (eo(i, t), !n) return null;
   const { state: d, setSlot: c, setOutlineWidth: u, reset: p, disableAll: h } = n, m = {};
   for (const [b, x] of Object.entries(d.active))
@@ -2780,18 +2780,18 @@ function ao() {
 function io() {
   return `${Q().storagePrefix}-highlight-outline-width`;
 }
-function Ia(e) {
+function za(e) {
   const t = new Set(Object.values(e));
   for (let n = 0; n < 10; n++)
     if (!t.has(n)) return n;
   return -1;
 }
-function Ra(e, t) {
+function Oa(e, t) {
   if (t in e.active) {
     const { [t]: o, ...r } = e.active;
     return { ...e, active: r };
   }
-  const n = Ia(e.active);
+  const n = za(e.active);
   return n === -1 ? (console.warn(
     "[zudo-design-token-panel] highlight: all 10 slots are in use; cannot highlight",
     t
@@ -2800,26 +2800,26 @@ function Ra(e, t) {
     active: { ...e.active, [t]: n }
   };
 }
-function za(e) {
+function Da(e) {
   return {
     ...e,
     slots: no.map((t) => ({ ...t })),
     outlineWidth: oo
   };
 }
-function Oa(e) {
+function Va(e) {
   return { ...e, active: {} };
 }
-function Da(e, t, n) {
+function Ha(e, t, n) {
   if (t < 0 || t >= e.slots.length) return e;
   const o = e.slots.map((r, a) => a === t ? { ...r, ...n } : r);
   return { ...e, slots: o };
 }
-function Va(e, t) {
+function Ba(e, t) {
   const n = Math.max(1, t);
   return { ...e, outlineWidth: n };
 }
-function Ba() {
+function Fa() {
   let e = no.map((o) => ({ ...o })), t = oo, n = {};
   try {
     const o = localStorage.getItem(ro());
@@ -2861,7 +2861,7 @@ function Oe(e) {
   } catch {
   }
 }
-const sn = {
+const cn = {
   color: {
     sentinelA: "rgb(123, 234, 17)",
     sentinelB: "rgb(231, 17, 234)",
@@ -3065,10 +3065,10 @@ const sn = {
     longhands: ["mask-image"],
     compounds: ["mask-image"]
   }
-}, Ge = [null, "::before", "::after"], qt = ".tokenpanel-shell, [data-design-token-panel-modal], #tokenpanel-highlight-mount, #tokenpanel-elpath-mount", Ha = /^(transparent|currentcolor|currentColor|inherit|initial|unset|red|blue|green|black|white|gray|grey|silver|yellow|orange|purple|pink|brown|cyan|magenta|lime|olive|navy|maroon|teal|aqua|fuchsia|coral|salmon|gold|khaki|violet|indigo|crimson|lavender|beige|ivory|chocolate|tomato|orchid|plum|turquoise|tan|sienna|peru|papayawhip|peachpuff|moccasin|mistyrose|linen|lemonchiffon|honeydew|gainsboro)$/i, Fa = /^(rgb|rgba|hsl|hsla|color|oklch|hwb|lab|lch)\(/i, ja = /^#/, Ka = /^-?\d+(\.\d+)?(px|rem|em|vh|vw|vmin|vmax|pt|pc|in|cm|mm|ex|ch|fr)%?$/, Wa = /^-?\d+(\.\d+)?$/, Xa = /^(cubic-bezier|steps|linear)\(/i, Ya = /^-?(?:\d+\.?\d*|\.\d+)(ms|s)$/i, qa = /^".*"$/, Ga = /^url\(/i;
-function Ua(e, t) {
+}, Ge = [null, "::before", "::after"], lo = "tokenpanel-highlight-mount", so = "tokenpanel-elpath-mount", Gt = `.tokenpanel-shell, [data-design-token-panel-modal], #${lo}, #${so}`, ja = /^(transparent|currentcolor|currentColor|inherit|initial|unset|red|blue|green|black|white|gray|grey|silver|yellow|orange|purple|pink|brown|cyan|magenta|lime|olive|navy|maroon|teal|aqua|fuchsia|coral|salmon|gold|khaki|violet|indigo|crimson|lavender|beige|ivory|chocolate|tomato|orchid|plum|turquoise|tan|sienna|peru|papayawhip|peachpuff|moccasin|mistyrose|linen|lemonchiffon|honeydew|gainsboro)$/i, Ka = /^(rgb|rgba|hsl|hsla|color|oklch|hwb|lab|lch)\(/i, Wa = /^#/, Xa = /^-?\d+(\.\d+)?(px|rem|em|vh|vw|vmin|vmax|pt|pc|in|cm|mm|ex|ch|fr)%?$/, Ya = /^-?\d+(\.\d+)?$/, qa = /^(cubic-bezier|steps|linear)\(/i, Ga = /^-?(?:\d+\.?\d*|\.\d+)(ms|s)$/i, Ua = /^".*"$/, Ja = /^url\(/i;
+function Za(e, t) {
   const n = getComputedStyle(document.documentElement).getPropertyValue(e).trim();
-  return n ? Fa.test(n) || ja.test(n) || Ha.test(n) ? "color" : Ka.test(n) ? "length" : Wa.test(n) ? "number" : Xa.test(n) ? "easing" : Ya.test(n) ? "time" : qa.test(n) ? "content" : (Ga.test(n) && t.push(
+  return n ? Ka.test(n) || Wa.test(n) || ja.test(n) ? "color" : Xa.test(n) ? "length" : Ya.test(n) ? "number" : qa.test(n) ? "easing" : Ga.test(n) ? "time" : Ua.test(n) ? "content" : (Ja.test(n) && t.push(
     `type auto-detection inconclusive for ${e}: resolved value starts with url(); defaulting to text — supply kind:'cursor' or kind:'mask-image' explicitly if this is a cursor or mask-image token`
   ), "text") : (t.push(
     `type auto-detection inconclusive for ${e}; defaulting to color — supply kind explicitly if this is incorrect`
@@ -3090,7 +3090,7 @@ function Ot(e, t, n) {
       );
     } else "cssRules" in o && o.cssRules && Ot(o.cssRules, t, n);
 }
-function Ja(e, t) {
+function Qa(e, t) {
   const n = /* @__PURE__ */ new Set();
   for (const o of document.styleSheets) {
     let r;
@@ -3105,13 +3105,13 @@ function Ja(e, t) {
   }
   return n;
 }
-function Za(e) {
+function ei(e) {
   const t = /* @__PURE__ */ new Set(), n = document.querySelectorAll("[style]");
   for (const o of n)
     o.style.getPropertyValue(e) !== "" && t.add(o);
   return t;
 }
-function At(e, t, n, o, r) {
+function Lt(e, t, n, o, r) {
   const a = [], i = document.documentElement, s = /* @__PURE__ */ new WeakSet();
   a.push({
     el: i,
@@ -3121,7 +3121,7 @@ function At(e, t, n, o, r) {
   const d = (c) => {
     if (!s.has(c)) {
       try {
-        if (c.closest(qt) !== null) return;
+        if (c.closest(Gt) !== null) return;
       } catch {
       }
       a.push({
@@ -3144,13 +3144,13 @@ function At(e, t, n, o, r) {
   for (const c of o) d(c);
   return a;
 }
-function Lt(e, t) {
+function Pt(e, t) {
   for (let n = t.length - 1; n >= 0; n--) {
     const { el: o, original: r, originalPriority: a } = t[n];
     r ? o.style.setProperty(e, r, a) : o.style.removeProperty(e);
   }
 }
-function cn(e, t, n) {
+function dn(e, t, n) {
   let o;
   try {
     o = getComputedStyle(e, t);
@@ -3162,18 +3162,18 @@ function cn(e, t, n) {
     r[a] = o.getPropertyValue(a);
   return r;
 }
-function Qa(e, t) {
+function ti(e, t) {
   if (!e || !t) return null;
   for (const n in e)
     if (e[n] !== t[n]) return n;
   return null;
 }
-function dn(e, t) {
+function un(e, t) {
   let n = e.trim();
   n.startsWith("var(") && (n = n.replace(/^var\(\s*/, "").replace(/\s*\)$/, "").trim());
-  const o = [], r = t?.mode ?? "equality", a = t?.kind ?? Ua(n, o), i = sn[a] ?? sn.color, s = Ja(n, o), d = Za(n), c = [document.body, ...document.body.querySelectorAll("*")], u = /* @__PURE__ */ new Set();
+  const o = [], r = t?.mode ?? "equality", a = t?.kind ?? Za(n, o), i = cn[a] ?? cn.color, s = Qa(n, o), d = ei(n), c = [document.body, ...document.body.querySelectorAll("*")], u = /* @__PURE__ */ new Set();
   if (r === "equality") {
-    const { sentinelA: h, longhands: m, compounds: $ } = i, b = i.needleA ?? h, x = At(
+    const { sentinelA: h, longhands: m, compounds: $ } = i, b = i.needleA ?? h, x = Lt(
       n,
       h,
       s,
@@ -3208,9 +3208,9 @@ function dn(e, t) {
           break;
         }
       }
-    Lt(n, x);
+    Pt(n, x);
   } else {
-    const { sentinelA: h, sentinelB: m, longhands: $, compounds: b } = i, x = [...$, ...b], f = At(
+    const { sentinelA: h, sentinelB: m, longhands: $, compounds: b } = i, x = [...$, ...b], f = Lt(
       n,
       h,
       s,
@@ -3220,9 +3220,9 @@ function dn(e, t) {
     document.documentElement.offsetHeight;
     const w = /* @__PURE__ */ new Map();
     for (const E of c)
-      w.set(E, Ge.map((N) => cn(E, N, x)));
-    Lt(n, f);
-    const C = At(
+      w.set(E, Ge.map((N) => dn(E, N, x)));
+    Pt(n, f);
+    const C = Lt(
       n,
       m,
       s,
@@ -3233,27 +3233,27 @@ function dn(e, t) {
     for (const E of c) {
       const N = w.get(E);
       for (let v = 0; v < Ge.length; v++) {
-        const g = cn(E, Ge[v], x);
-        if (Qa(N[v], g) !== null) {
+        const g = dn(E, Ge[v], x);
+        if (ti(N[v], g) !== null) {
           u.add(E);
           break;
         }
       }
     }
-    Lt(n, C);
+    Pt(n, C);
   }
   const p = [];
   for (const h of u) {
     try {
-      if (h.closest(qt) !== null) continue;
+      if (h.closest(Gt) !== null) continue;
     } catch {
     }
     p.push(h);
   }
   return { elements: p, warnings: o };
 }
-const Te = 200, ei = 49;
-function un(e, t) {
+const Te = 200, ni = 49;
+function pn(e, t) {
   return {
     position: "fixed",
     top: `${e.top}px`,
@@ -3266,15 +3266,15 @@ function un(e, t) {
     // box-shadow inset draws the same ring without relying on outline.
     boxShadow: `inset 0 0 0 ${t.outlineWidth}px ${t.color}`,
     pointerEvents: "none",
-    zIndex: String(ei),
+    zIndex: String(ni),
     boxSizing: "border-box"
   };
 }
-function ti(e, t) {
+function oi(e, t) {
   for (const n of Object.keys(t))
     e.style[n] = t[n];
 }
-function ni({ items: e }) {
+function ri({ items: e }) {
   const t = e.length > Te ? e.slice(0, Te) : e, n = le(!1);
   e.length > Te && !n.current && (n.current = !0, console.warn(
     `HighlightOverlay: received ${e.length} items (max ${Te}). Only the first ${Te} overlays will be rendered.`
@@ -3288,7 +3288,7 @@ function ni({ items: e }) {
         const s = o.current[i];
         if (!s) continue;
         const d = t[i].element.getBoundingClientRect();
-        ti(s, un(d, t[i].slot));
+        oi(s, pn(d, t[i].slot));
       }
       r = requestAnimationFrame(a);
     }
@@ -3296,7 +3296,7 @@ function ni({ items: e }) {
       cancelAnimationFrame(r);
     };
   }, [t]), t.length === 0 ? null : /* @__PURE__ */ l(re, { children: t.map((r, a) => {
-    const i = r.element.getBoundingClientRect(), s = un(i, r.slot);
+    const i = r.element.getBoundingClientRect(), s = pn(i, r.slot);
     return /* @__PURE__ */ l(
       "div",
       {
@@ -3311,7 +3311,7 @@ function ni({ items: e }) {
     );
   }) });
 }
-function lo(e) {
+function co(e) {
   const t = le(null), [, n] = we(0);
   return se(() => {
     function o() {
@@ -3330,7 +3330,7 @@ function lo(e) {
     };
   }, [e]), t.current;
 }
-function oi(e) {
+function ai(e) {
   if (e)
     switch (e.kind) {
       case "color":
@@ -3361,7 +3361,7 @@ function oi(e) {
         return "mask-image";
     }
 }
-function ri() {
+function ii() {
   const e = /* @__PURE__ */ new Map();
   for (const t of Q().tabs)
     for (const n of t.tiers)
@@ -3369,39 +3369,38 @@ function ri() {
         e.set(o.cssVar, o.type);
   return e;
 }
-const ai = /* @__PURE__ */ new Set(["text", "cursor", "content", "mask-image"]);
-function ii(e) {
-  return e ? !ai.has(e.kind) : !0;
+const li = /* @__PURE__ */ new Set(["text", "cursor", "content", "mask-image"]);
+function si(e) {
+  return e ? !li.has(e.kind) : !0;
 }
-const li = "tokenpanel-highlight-mount";
-function si({ items: e }) {
-  const t = lo(li);
-  return t ? Bt(/* @__PURE__ */ l(ni, { items: e }), t) : null;
+function ci({ items: e }) {
+  const t = co(lo);
+  return t ? Bt(/* @__PURE__ */ l(ri, { items: e }), t) : null;
 }
-function ci({ children: e }) {
-  const [t, n] = we(Ba), [o, r] = we(0), [a, i] = we(0), s = le(/* @__PURE__ */ new Map()), d = G((x) => {
+function di({ children: e }) {
+  const [t, n] = we(Fa), [o, r] = we(0), [a, i] = we(0), s = le(/* @__PURE__ */ new Map()), d = G((x) => {
     n((f) => {
-      const w = Ra(f, x);
+      const w = Oa(f, x);
       return Oe(w), w;
     });
   }, []), c = G((x, f) => {
     n((w) => {
-      const C = Da(w, x, f);
+      const C = Ha(w, x, f);
       return Oe(C), C;
     });
   }, []), u = G((x) => {
     n((f) => {
-      const w = Va(f, x);
+      const w = Ba(f, x);
       return Oe(w), w;
     });
   }, []), p = G(() => {
     n((x) => {
-      const f = za(x);
+      const f = Da(x);
       return Oe(f), f;
     });
   }, []), h = G(() => {
     n((x) => {
-      const f = Oa(x);
+      const f = Va(x);
       return Oe(f), f;
     });
   }, []);
@@ -3411,12 +3410,12 @@ function ci({ children: e }) {
       x && x.disconnect(), x = new MutationObserver((C) => {
         for (const E of C) {
           for (const N of E.addedNodes)
-            if (pn(N)) {
+            if (fn(N)) {
               r((v) => v + 1);
               return;
             }
           for (const N of E.removedNodes)
-            if (pn(N)) {
+            if (fn(N)) {
               r((v) => v + 1);
               return;
             }
@@ -3440,22 +3439,22 @@ function ci({ children: e }) {
       attributeFilter: ["data-theme", "class"]
     }), () => x.disconnect();
   }, []);
-  const { items: m, matchCounts: $ } = Pt(() => {
-    const x = ri();
+  const { items: m, matchCounts: $ } = ot(() => {
+    const x = ii();
     function f(E) {
       const N = `${E}|${o}|${a}`, v = s.current.get(N);
       if (v) return v;
-      const g = x.get(E), _ = oi(g), S = _ ? { kind: _ } : {}, H = dn(E, S);
+      const g = x.get(E), _ = ai(g), S = _ ? { kind: _ } : {}, B = un(E, S);
       let K, Y;
-      if (ii(g)) {
-        const pe = dn(E, { ...S, mode: "differential" }), oe = new Set(H.elements);
+      if (si(g)) {
+        const pe = un(E, { ...S, mode: "differential" }), oe = new Set(B.elements);
         for (const he of pe.elements) oe.add(he);
         K = Array.from(oe);
-        const ye = new Set(H.warnings);
+        const ye = new Set(B.warnings);
         for (const he of pe.warnings) ye.add(he);
         Y = Array.from(ye);
       } else
-        K = H.elements, Y = H.warnings;
+        K = B.elements, Y = B.warnings;
       const ee = { elements: K, warnings: Y };
       return s.current.set(N, ee), ee;
     }
@@ -3473,38 +3472,38 @@ function ci({ children: e }) {
           w.push({ element: S, slot: { color: _.color, outlineWidth: t.outlineWidth } });
     }
     return { items: w, matchCounts: C };
-  }, [t.active, t.slots, t.outlineWidth, o, a]), b = Pt(
+  }, [t.active, t.slots, t.outlineWidth, o, a]), b = ot(
     () => ({ state: t, toggle: d, setSlot: c, setOutlineWidth: u, reset: p, disableAll: h, matchCounts: $ }),
     [t, d, c, u, p, h, $]
   );
   return /* @__PURE__ */ k(re, { children: [
-    /* @__PURE__ */ l(Yt.Provider, { value: b, children: e }),
-    /* @__PURE__ */ l(si, { items: m })
+    /* @__PURE__ */ l(qt.Provider, { value: b, children: e }),
+    /* @__PURE__ */ l(ci, { items: m })
   ] });
 }
-function pn(e) {
+function fn(e) {
   if (e.nodeType !== Node.ELEMENT_NODE) return !1;
   const t = e;
   return t.tagName === "STYLE" || t.tagName === "LINK" && t.getAttribute("rel") === "stylesheet";
 }
-const so = Vt(null);
-function co() {
+const uo = Ht(null);
+function po() {
   return `${Q().storagePrefix}-elpath-enabled`;
 }
-function di() {
+function ui() {
   try {
-    return localStorage.getItem(co()) === "1";
+    return localStorage.getItem(po()) === "1";
   } catch {
     return !1;
   }
 }
-function fn(e) {
+function hn(e) {
   try {
-    localStorage.setItem(co(), e ? "1" : "0");
+    localStorage.setItem(po(), e ? "1" : "0");
   } catch {
   }
 }
-const hn = 60, gn = 8, ui = [
+const gn = 60, kn = 8, pi = [
   "id",
   "data-testid",
   "data-test",
@@ -3516,7 +3515,7 @@ const hn = 60, gn = 8, ui = [
   "alt",
   "placeholder",
   "title"
-], pi = 5, fi = {
+], fi = 5, hi = {
   nav: "navigation",
   main: "main",
   header: "banner",
@@ -3540,7 +3539,7 @@ const hn = 60, gn = 8, ui = [
   h5: "heading",
   h6: "heading"
 };
-function kn(e) {
+function Dt(e) {
   if (typeof CSS < "u" && typeof CSS.escape == "function")
     return CSS.escape(e);
   let t = "";
@@ -3550,7 +3549,7 @@ function kn(e) {
   }
   return t;
 }
-function uo(e) {
+function fo(e) {
   const t = (e.getAttribute("class") ?? "").trim();
   return t ? t.split(/\s+/).filter((n) => n.length > 0).filter((n) => !/__|^sc-|^css-[a-z0-9]{4,}/i.test(n)).filter((n) => !(/[a-z][0-9]|[0-9][a-z]/i.test(n) && n.length >= 6)) : [];
 }
@@ -3564,20 +3563,20 @@ function Ue(e, t) {
     return !1;
   }
 }
-function hi(e) {
+function gi(e) {
   const t = e.parentElement;
   if (!t) return "";
   const n = e.tagName, o = Array.from(t.children).filter((a) => a.tagName === n);
   return o.length <= 1 ? "" : `:nth-of-type(${o.indexOf(e) + 1})`;
 }
-function gi(e) {
-  return e.localName + hi(e);
-}
 function ki(e) {
+  return e.localName + gi(e);
+}
+function mi(e) {
   if (e.tagName === "HTML") return "html";
   const t = e.getAttribute("id");
   if (t) {
-    const r = `#${kn(t)}`;
+    const r = `#${Dt(t)}`;
     if (Ue(r, e)) return r;
   }
   const n = [];
@@ -3585,7 +3584,7 @@ function ki(e) {
   for (; o && o.nodeType === 1 && o.tagName !== "HTML"; ) {
     const r = o.getAttribute("id");
     if (r) {
-      const i = `#${kn(r)}`;
+      const i = `#${Dt(r)}`;
       if (Ue(i, o)) {
         n.unshift(i);
         const s = n.join(" > ");
@@ -3594,23 +3593,23 @@ function ki(e) {
         continue;
       }
     }
-    n.unshift(gi(o));
+    n.unshift(ki(o));
     const a = n.join(" > ");
     if (Ue(a, e)) return a;
     o = o.parentElement;
   }
   return n.join(" > ");
 }
-function mi(e) {
+function bi(e) {
   const t = [];
   let n = e;
   for (; n && n.nodeType === 1 && n.tagName !== "HTML"; ) {
-    const o = n.localName, r = uo(n)[0];
+    const o = n.localName, r = fo(n)[0];
     t.unshift(r ? `${o}.${r}` : o), n = n.parentElement;
   }
-  return t.length > gn ? "… > " + t.slice(-gn).join(" > ") : t.join(" > ");
+  return t.length > kn ? "… > " + t.slice(-kn).join(" > ") : t.join(" > ");
 }
-function bi(e) {
+function vi(e) {
   const t = e.getAttribute("role");
   if (t && t.trim()) return t.trim();
   const n = e.tagName.toLowerCase();
@@ -3620,16 +3619,16 @@ function bi(e) {
     const o = (e.getAttribute("type") ?? "text").toLowerCase();
     return o === "checkbox" ? "checkbox" : o === "radio" ? "radio" : o === "button" || o === "submit" || o === "reset" ? "button" : o === "range" ? "slider" : o === "hidden" ? null : "textbox";
   }
-  return fi[n] ?? null;
+  return hi[n] ?? null;
 }
-function vi(e) {
+function wi(e) {
   const t = (e.textContent ?? "").replace(/\s+/g, " ").trim();
-  return t ? t.length <= hn ? t : t.slice(0, hn - 1).trimEnd() + "…" : null;
+  return t ? t.length <= gn ? t : t.slice(0, gn - 1).trimEnd() + "…" : null;
 }
-function wi(e) {
+function xi(e) {
   const t = [];
-  for (const n of ui) {
-    if (t.length >= pi) break;
+  for (const n of pi) {
+    if (t.length >= fi) break;
     const o = e.getAttribute(n);
     if (o === null) continue;
     const r = o.replace(/\s+/g, " ").trim();
@@ -3639,38 +3638,38 @@ function wi(e) {
   }
   return t;
 }
-function Dt(e) {
-  const t = e.localName, n = e.getAttribute("id"), o = uo(e).slice(0, 2);
+function Vt(e) {
+  const t = e.localName, n = e.getAttribute("id"), o = fo(e).slice(0, 2);
   let r = t;
-  n && (r += `#${n}`);
+  n && (r += `#${Dt(n)}`);
   for (const a of o) r += `.${a}`;
   return r;
 }
-function xi(e) {
+function yi(e) {
   let t = { width: 0, height: 0 };
   if (typeof e.getBoundingClientRect == "function") {
     const n = e.getBoundingClientRect();
     t = { width: Math.round(n.width), height: Math.round(n.height) };
   }
   return {
-    summary: Dt(e),
-    selector: ki(e),
-    breadcrumb: mi(e),
-    role: bi(e),
-    text: vi(e),
-    attrs: wi(e),
+    summary: Vt(e),
+    selector: mi(e),
+    breadcrumb: bi(e),
+    role: vi(e),
+    text: wi(e),
+    attrs: xi(e),
     size: t
   };
 }
-function yi(e) {
+function Ni(e) {
   const t = [];
   return t.push(`element:  ${e.summary}`), t.push(`selector: ${e.selector}`), t.push(`path:     ${e.breadcrumb}`), e.role && t.push(`role:     ${e.role}`), e.text && t.push(`text:     "${e.text}"`), e.attrs.length > 0 && t.push(`attrs:    ${e.attrs.join(", ")}`), t.push(`size:     ${e.size.width} × ${e.size.height}`), t.join(`
 `);
 }
-function Ni(e) {
-  return yi(xi(e));
+function _i(e) {
+  return Ni(yi(e));
 }
-async function _i(e, t) {
+async function $i(e, t) {
   try {
     if (typeof navigator < "u" && navigator.clipboard?.writeText)
       return await navigator.clipboard.writeText(e), !0;
@@ -3688,57 +3687,73 @@ async function _i(e, t) {
     return !1;
   }
 }
-function $i({ message: e, ok: t }) {
-  return e === null ? null : /* @__PURE__ */ k(
+const Ci = 2147483001;
+function Ei({ message: e, ok: t }) {
+  return e === null ? null : /* @__PURE__ */ l(
     "div",
     {
-      className: t ? "tokenpanel-elpath-toast" : "tokenpanel-elpath-toast is-error",
-      "aria-hidden": "true",
-      children: [
-        /* @__PURE__ */ l(
-          "svg",
-          {
-            width: "14",
-            height: "14",
-            viewBox: "0 0 24 24",
-            fill: "none",
-            stroke: "currentColor",
-            strokeWidth: "2",
-            strokeLinecap: "round",
-            strokeLinejoin: "round",
-            "aria-hidden": "true",
-            children: t ? /* @__PURE__ */ l("path", { d: "M20 6 9 17l-5-5" }) : /* @__PURE__ */ k(re, { children: [
-              /* @__PURE__ */ l("circle", { cx: "12", cy: "12", r: "10" }),
-              /* @__PURE__ */ l("line", { x1: "12", y1: "8", x2: "12", y2: "12" }),
-              /* @__PURE__ */ l("line", { x1: "12", y1: "16", x2: "12.01", y2: "16" })
-            ] })
-          }
-        ),
-        /* @__PURE__ */ l("span", { className: "tokenpanel-elpath-toast-text", children: e })
-      ]
+      style: {
+        position: "fixed",
+        top: 0,
+        left: 0,
+        right: 0,
+        zIndex: Ci,
+        display: "flex",
+        justifyContent: "center",
+        pointerEvents: "none"
+      },
+      children: /* @__PURE__ */ k(
+        "div",
+        {
+          className: t ? "tokenpanel-elpath-toast" : "tokenpanel-elpath-toast is-error",
+          "aria-hidden": "true",
+          children: [
+            /* @__PURE__ */ l(
+              "svg",
+              {
+                width: "14",
+                height: "14",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "2",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                "aria-hidden": "true",
+                children: t ? /* @__PURE__ */ l("path", { d: "M20 6 9 17l-5-5" }) : /* @__PURE__ */ k(re, { children: [
+                  /* @__PURE__ */ l("circle", { cx: "12", cy: "12", r: "10" }),
+                  /* @__PURE__ */ l("line", { x1: "12", y1: "8", x2: "12", y2: "12" }),
+                  /* @__PURE__ */ l("line", { x1: "12", y1: "16", x2: "12.01", y2: "16" })
+                ] })
+              }
+            ),
+            /* @__PURE__ */ l("span", { className: "tokenpanel-elpath-toast-text", children: e })
+          ]
+        }
+      )
     }
   );
 }
-const mn = 2147483e3, Ci = 2147483001, Ei = 2200, bn = 2;
-function Si(e) {
+const mn = 2147483e3, Si = 2200, bn = 2;
+function Ti(e) {
   try {
-    return e.closest(qt) !== null;
+    return e.closest(Gt) !== null;
   } catch {
     return !1;
   }
 }
-function Ti({ enabled: e }) {
+function Mi({ enabled: e }) {
   const [t, n] = we(!1), [o, r] = we(null), [a, i] = we(null), s = le(!1);
   s.current = t;
   const d = le(null);
   d.current = o;
   const c = le(null), u = le(null), p = le(null), h = le(0), m = le(null), $ = G(async (w) => {
-    const C = Ni(w), E = await _i(C);
+    const C = _i(w), E = await $i(C);
     h.current += 1, i({
-      message: E ? `Copied path: ${Dt(w)}` : "Copy failed — clipboard unavailable",
+      message: E ? `Copied path: ${Vt(w)}` : "Copy failed — clipboard unavailable",
       ok: E,
       key: h.current
-    }), p.current && clearTimeout(p.current), p.current = setTimeout(() => i(null), Ei);
+    }), p.current && clearTimeout(p.current), p.current = setTimeout(() => i(null), Si);
   }, []);
   se(() => {
     e || (n(!1), r(null));
@@ -3746,7 +3761,7 @@ function Ti({ enabled: e }) {
     if (!e) return;
     function w(g, _) {
       const S = document.elementFromPoint(g, _);
-      r(!S || Si(S) ? null : S);
+      r(!S || Ti(S) ? null : S);
     }
     function C(g) {
       m.current = { x: g.clientX, y: g.clientY }, s.current && w(g.clientX, g.clientY);
@@ -3764,8 +3779,8 @@ function Ti({ enabled: e }) {
     function v() {
       n(!1), r(null);
     }
-    return document.addEventListener("mousemove", C, !0), window.addEventListener("keydown", E, !0), window.addEventListener("keyup", N, !0), window.addEventListener("blur", v), () => {
-      document.removeEventListener("mousemove", C, !0), window.removeEventListener("keydown", E, !0), window.removeEventListener("keyup", N, !0), window.removeEventListener("blur", v);
+    return document.addEventListener("mousemove", C, { passive: !0 }), window.addEventListener("keydown", E, !0), window.addEventListener("keyup", N, !0), window.addEventListener("blur", v), () => {
+      document.removeEventListener("mousemove", C), window.removeEventListener("keydown", E, !0), window.removeEventListener("keyup", N, !0), window.removeEventListener("blur", v);
     };
   }, [e]), se(() => {
     if (!e || !t) return;
@@ -3810,7 +3825,10 @@ function Ti({ enabled: e }) {
   }, [t, o]), se(() => () => {
     p.current && clearTimeout(p.current);
   }, []);
-  const b = e && t && o !== null, x = b && o ? Dt(o) : "", f = b && o ? o.getBoundingClientRect() : null;
+  const b = e && t && o !== null, x = ot(
+    () => b && o ? Vt(o) : "",
+    [b, o]
+  ), f = b && o ? o.getBoundingClientRect() : null;
   return /* @__PURE__ */ k(re, { children: [
     /* @__PURE__ */ l(
       "div",
@@ -3872,48 +3890,32 @@ function Ti({ enabled: e }) {
         }
       )
     ] }),
-    a && /* @__PURE__ */ l(
-      "div",
-      {
-        style: {
-          position: "fixed",
-          top: 0,
-          left: 0,
-          right: 0,
-          zIndex: Ci,
-          display: "flex",
-          justifyContent: "center",
-          pointerEvents: "none"
-        },
-        children: /* @__PURE__ */ l($i, { message: a.message, ok: a.ok }, a.key)
-      }
-    )
+    a && /* @__PURE__ */ l(Ei, { message: a.message, ok: a.ok }, a.key)
   ] });
 }
-const Mi = "tokenpanel-elpath-mount";
 function Ai({ enabled: e }) {
-  const t = lo(Mi);
-  return t ? Bt(/* @__PURE__ */ l(Ti, { enabled: e }), t) : null;
+  const t = co(so);
+  return t ? Bt(/* @__PURE__ */ l(Mi, { enabled: e }), t) : null;
 }
 function Li({ children: e }) {
-  const [t, n] = we(di), o = G((i) => {
-    n(i), fn(i);
+  const [t, n] = we(ui), o = G((i) => {
+    n(i), hn(i);
   }, []), r = G(() => {
     n((i) => {
       const s = !i;
-      return fn(s), s;
+      return hn(s), s;
     });
-  }, []), a = Pt(
+  }, []), a = ot(
     () => ({ enabled: t, setEnabled: o, toggle: r }),
     [t, o, r]
   );
   return /* @__PURE__ */ k(re, { children: [
-    /* @__PURE__ */ l(so.Provider, { value: a, children: e }),
+    /* @__PURE__ */ l(uo.Provider, { value: a, children: e }),
     /* @__PURE__ */ l(Ai, { enabled: t })
   ] });
 }
 function Pi() {
-  const e = Ht(so);
+  const e = Ft(uo);
   if (e === null) return null;
   const { enabled: t, toggle: n } = e;
   return /* @__PURE__ */ l(
@@ -3949,7 +3951,7 @@ function Pi() {
     }
   );
 }
-const po = Vt(null);
+const ho = Ht(null);
 function Ii({ state: e }) {
   const t = le(null);
   return se(() => {
@@ -3993,13 +3995,13 @@ function Ri({ children: e }) {
       o.current && i();
     }
     return window.addEventListener("scroll", s, !0), () => window.removeEventListener("scroll", s, !0);
-  }, [i]), /* @__PURE__ */ k(po.Provider, { value: { show: r, hide: a }, children: [
+  }, [i]), /* @__PURE__ */ k(ho.Provider, { value: { show: r, hide: a }, children: [
     e,
     typeof document < "u" && Bt(/* @__PURE__ */ l(Ii, { state: t }), document.body)
   ] });
 }
-function Gt(e) {
-  const t = Ht(po), n = G(
+function Ut(e) {
+  const t = Ft(ho), n = G(
     (i) => {
       t && t.show(i.currentTarget, e);
     },
@@ -4067,7 +4069,7 @@ const vn = je(function({
       n(o, m);
     },
     [n, o]
-  ), p = z(() => s((m) => !m), []), h = Gt(`${r}: ${t}`);
+  ), p = z(() => s((m) => !m), []), h = Ut(`${r}: ${t}`);
   return /* @__PURE__ */ k("div", { className: "tokenpanel-color-swatch-wrap", children: [
     /* @__PURE__ */ l(
       "div",
@@ -4114,7 +4116,7 @@ const vn = je(function({
 }) {
   const p = a ?? ((v) => `--zd-p${v}`), [h, m] = j(!1), $ = O(null), b = O(null), x = z(() => m(!1), []), f = z(() => m((v) => !v), []), w = o === "bg" ? d ?? "#000000" : o === "fg" ? c ?? "#ffffff" : r[o] ?? "#000000", C = o === "bg" ? "bg" : o === "fg" ? "fg" : `p${o}`;
   zi($, x, h);
-  const E = Gt(`${t}: ${C}`);
+  const E = Ut(`${t}: ${C}`);
   function N(v) {
     i(n, v), m(!1);
   }
@@ -4220,7 +4222,7 @@ function Di({
   secondaryState: r,
   persistSecondary: a
 }) {
-  const i = Z(() => tn(e), [e]), s = Z(
+  const i = Z(() => nn(e), [e]), s = Z(
     () => i ?? {
       id: "stub",
       paletteSize: 0,
@@ -4235,7 +4237,7 @@ function Di({
     },
     [i]
   ), d = Z(
-    () => o ? tn(o) ?? null : null,
+    () => o ? nn(o) ?? null : null,
     [o]
   ), c = Q().colorPresets ?? {}, u = Z(
     () => ({ ...c, ...s.colorSchemes }),
@@ -4250,7 +4252,7 @@ function Di({
     (g, _) => {
       n((S) => ({
         ...S,
-        palette: S.palette.map((H, K) => K === g ? _ : H)
+        palette: S.palette.map((B, K) => K === g ? _ : B)
       }));
     },
     [n]
@@ -4258,7 +4260,7 @@ function Di({
     (g, _) => {
       a((S) => S && {
         ...S,
-        palette: S.palette.map((H, K) => K === g ? _ : H)
+        palette: S.palette.map((B, K) => K === g ? _ : B)
       });
     },
     [a]
@@ -4288,7 +4290,7 @@ function Di({
       const _ = u[g];
       if (!_) return;
       const S = $n(_);
-      n(() => S), Co(S.shikiTheme);
+      n(() => S), So(S.shikiTheme);
     },
     [n]
   );
@@ -4454,11 +4456,11 @@ function Vi(e) {
 function xn(e, t) {
   return e.tiers.find((n) => n.id === t);
 }
-function Bi(e, t) {
+function Hi(e, t) {
   return e.items.find((n) => n.id === t);
 }
-function Hi({ tab: e, tierId: t, itemId: n, value: o, onChange: r, previewValueFor: a }) {
-  const s = xn(e, t)?.referencesTier ?? "", d = s ? xn(e, s) : void 0, c = d?.items ?? [], u = d && Bi(d, o) ? o : c[0]?.id ?? "";
+function Bi({ tab: e, tierId: t, itemId: n, value: o, onChange: r, previewValueFor: a }) {
+  const s = xn(e, t)?.referencesTier ?? "", d = s ? xn(e, s) : void 0, c = d?.items ?? [], u = d && Hi(d, o) ? o : c[0]?.id ?? "";
   return /* @__PURE__ */ l("div", { className: "tokenpanel-tier-ref-selector", children: /* @__PURE__ */ k(
     "select",
     {
@@ -4483,9 +4485,9 @@ function Hi({ tab: e, tierId: t, itemId: n, value: o, onChange: r, previewValueF
     }
   ) });
 }
-const ut = je(Hi);
+const pt = je(Bi);
 function Fi({ cssVar: e, label: t, className: n }) {
-  const o = Gt(e);
+  const o = Ut(e);
   return /* @__PURE__ */ k("span", { className: n ?? "tokenpanel-row-label", ...o, children: [
     e,
     t && t !== e && /* @__PURE__ */ l("span", { className: "tokenpanel-row-label-sub", children: t })
@@ -4634,7 +4636,7 @@ function ji({ item: e, value: t, onChange: n }) {
       return null;
   }
 }
-const Ut = je(ji);
+const Jt = je(ji);
 function Ki({ tab: e, state: t, persistFont: n }) {
   const o = z(
     (a, i) => {
@@ -4699,7 +4701,7 @@ function Wi({ tab: e, tier: t, state: n, onChange: o }) {
           children: [
             /* @__PURE__ */ l(de, { cssVar: a.cssVar, label: a.label }),
             /* @__PURE__ */ l(
-              ut,
+              pt,
               {
                 tab: e,
                 tierId: t.id,
@@ -4719,7 +4721,7 @@ function Wi({ tab: e, tier: t, state: n, onChange: o }) {
         },
         a.id
       ) : /* @__PURE__ */ l(
-        Ut,
+        Jt,
         {
           item: a,
           value: i,
@@ -4794,7 +4796,7 @@ function Yi({ tab: e, tier: t, state: n, onChange: o }) {
           children: [
             /* @__PURE__ */ l(de, { cssVar: a.cssVar, label: a.label }),
             /* @__PURE__ */ l(
-              ut,
+              pt,
               {
                 tab: e,
                 tierId: t.id,
@@ -4814,7 +4816,7 @@ function Yi({ tab: e, tier: t, state: n, onChange: o }) {
         },
         a.id
       ) : /* @__PURE__ */ l(
-        Ut,
+        Jt,
         {
           item: a,
           value: i,
@@ -4889,7 +4891,7 @@ function Gi({ tab: e, tier: t, state: n, onChange: o }) {
           children: [
             /* @__PURE__ */ l(de, { cssVar: a.cssVar, label: a.label }),
             /* @__PURE__ */ l(
-              ut,
+              pt,
               {
                 tab: e,
                 tierId: t.id,
@@ -4909,7 +4911,7 @@ function Gi({ tab: e, tier: t, state: n, onChange: o }) {
         },
         a.id
       ) : /* @__PURE__ */ l(
-        Ut,
+        Jt,
         {
           item: a,
           value: i,
@@ -4926,7 +4928,7 @@ function Ui({ tab: e, tier: t, item: n, value: o, overrides: r, onChange: a }) {
     return /* @__PURE__ */ k("div", { className: "tokenpanel-row", "data-testid": `tier-ref-row-${n.id}`, children: [
       /* @__PURE__ */ l(de, { cssVar: n.cssVar, label: n.label }),
       /* @__PURE__ */ l(
-        ut,
+        pt,
         {
           tab: e,
           tierId: t.id,
@@ -5202,20 +5204,20 @@ function nl(e, t, n) {
 function Ze() {
   return {
     color: Qe(),
-    spacing: wt(),
-    typography: wt(),
-    size: wt(),
+    spacing: xt(),
+    typography: xt(),
+    size: xt(),
     secondary: Sn()
   };
 }
 function ol() {
-  const e = st(), [t, n] = j(!1), [o, r] = j(!1), [a, i] = j(!1), [s, d] = j(!1), [c, u] = j(!1), p = O(null), [h, m] = j(null), [$, b] = j(tl), [x, f] = j(Jt), [w, C] = j(Eo), [E, N] = j(So), [v, g] = j(!1), _ = O(null), S = O({
+  const e = ct(), [t, n] = j(!1), [o, r] = j(!1), [a, i] = j(!1), [s, d] = j(!1), [c, u] = j(!1), p = O(null), [h, m] = j(null), [$, b] = j(tl), [x, f] = j(Zt), [w, C] = j(To), [E, N] = j(Mo), [v, g] = j(!1), _ = O(null), S = O({
     spacing: null,
     font: null,
     size: null,
     color: null
-  }), H = O(Jt);
-  H.current = x;
+  }), B = O(Zt);
+  B.current = x;
   const K = O(w);
   K.current = w;
   const Y = O(null), ee = O(null), { persistColor: pe, persistSpacing: oe, persistFont: ye, persistSize: he, persistSecondary: Se, persistTab: A } = Qi(m);
@@ -5224,13 +5226,13 @@ function ol() {
       localStorage.getItem(Ve()) === "1" && n(!0);
     } catch {
     }
-    const T = To();
-    f(T), H.current = T;
-    const B = Mo();
-    C(B), K.current = B, N(Ao()), g(window.innerWidth < De);
+    const T = Ao();
+    f(T), B.current = T;
+    const H = Lo();
+    C(H), K.current = H, N(Po()), g(window.innerWidth < De);
   }, []);
   const D = z((T) => {
-    N(T), Lo(T);
+    N(T), Io(T);
   }, []);
   X(() => {
     try {
@@ -5245,8 +5247,8 @@ function ol() {
     }
   }, [t]), X(() => {
     if (!t) return;
-    function T(B) {
-      B.key === "Escape" && (o || a || s || (B.preventDefault(), n(!1)));
+    function T(H) {
+      H.key === "Escape" && (o || a || s || (H.preventDefault(), n(!1)));
     }
     return document.addEventListener("keydown", T), () => {
       document.removeEventListener("keydown", T);
@@ -5263,7 +5265,7 @@ function ol() {
     };
   }, []), X(() => {
     function T() {
-      mt(), m(Ze());
+      bt(), m(Ze());
     }
     return window.addEventListener("color-scheme-changed", T), () => window.removeEventListener("color-scheme-changed", T);
   }, []), X(() => {
@@ -5278,20 +5280,20 @@ function ol() {
   const te = z((T) => {
     if (window.innerWidth < De || T.target.closest("button, select, option, [role='tab'], [role='button']")) return;
     T.preventDefault();
-    const V = T.clientX, U = T.clientY, I = H.current.left, q = H.current.top, fe = _.current?.offsetWidth ?? 600;
+    const V = T.clientX, U = T.clientY, I = B.current.left, q = B.current.top, fe = _.current?.offsetWidth ?? 600;
     _.current?.offsetHeight;
     function ae(ve) {
-      const Ne = ve.clientX - V, xo = ve.clientY - U, kt = vt(
-        q + xo,
+      const Ne = ve.clientX - V, No = ve.clientY - U, mt = wt(
+        q + No,
         I + Ne,
         fe
       );
-      _.current && (_.current.style.top = `${kt.top}px`, _.current.style.left = `${kt.left}px`), H.current = kt;
+      _.current && (_.current.style.top = `${mt.top}px`, _.current.style.left = `${mt.left}px`), B.current = mt;
     }
     function ce() {
       document.removeEventListener("mousemove", ae), document.removeEventListener("mouseup", ce), Y.current = null;
-      const ve = H.current;
-      f(ve), bt(ve);
+      const ve = B.current;
+      f(ve), vt(ve);
     }
     document.addEventListener("mousemove", ae), document.addEventListener("mouseup", ce), Y.current = () => {
       document.removeEventListener("mousemove", ae), document.removeEventListener("mouseup", ce);
@@ -5299,22 +5301,22 @@ function ol() {
   }, []), be = z((T) => {
     if (window.innerWidth < De) return;
     T.preventDefault(), T.stopPropagation();
-    const B = T.clientX, V = T.clientY, U = K.current.width, I = K.current.height;
+    const H = T.clientX, V = T.clientY, U = K.current.width, I = K.current.height;
     function q(ae) {
-      const ce = ae.clientX - B, ve = ae.clientY - V, Ne = en(U + ce, I + ve);
+      const ce = ae.clientX - H, ve = ae.clientY - V, Ne = tn(U + ce, I + ve);
       _.current && (_.current.style.width = `${Ne.width}px`, _.current.style.height = `${Ne.height}px`), K.current = Ne;
     }
     function fe() {
       document.removeEventListener("mousemove", q), document.removeEventListener("mouseup", fe), ee.current = null;
       const ae = K.current;
-      C(ae), Qt(ae);
-      const ce = vt(
-        H.current.top,
-        H.current.left,
+      C(ae), en(ae);
+      const ce = wt(
+        B.current.top,
+        B.current.left,
         ae.width,
         ae.height
       );
-      (ce.top !== H.current.top || ce.left !== H.current.left) && (f(ce), bt(ce));
+      (ce.top !== B.current.top || ce.left !== B.current.left) && (f(ce), vt(ce));
     }
     document.addEventListener("mousemove", q), document.addEventListener("mouseup", fe), ee.current = () => {
       document.removeEventListener("mousemove", q), document.removeEventListener("mouseup", fe);
@@ -5325,13 +5327,13 @@ function ol() {
   }, []), X(() => {
     function T() {
       g(window.innerWidth < De), C((V) => {
-        const U = en(V.width, V.height);
-        return (U.width !== V.width || U.height !== V.height) && Qt(U), U;
+        const U = tn(V.width, V.height);
+        return (U.width !== V.width || U.height !== V.height) && en(U), U;
       });
-      const B = _.current?.offsetWidth ?? 600;
+      const H = _.current?.offsetWidth ?? 600;
       _.current?.offsetHeight, f((V) => {
-        const U = vt(V.top, V.left, B);
-        return bt(U), U;
+        const U = wt(V.top, V.left, H);
+        return vt(U), U;
       });
     }
     return window.addEventListener("resize", T), () => window.removeEventListener("resize", T);
@@ -5339,20 +5341,20 @@ function ol() {
   const Ie = z((T) => {
     nt(T), Cn(T), m(T);
   }, []), y = z(() => {
-    Zt(), mt(), m(Ze());
+    Qt(), bt(), m(Ze());
   }, []), R = z(() => {
-    Zt(), mt(), m(Ze());
+    Qt(), bt(), m(Ze());
   }, []), J = Z(() => Q().tabs.map((T) => ({ id: T.id, label: T.label })), []), F = Z(() => {
     const T = {};
-    for (const B of Q().tabs)
-      T[B.id] = B;
+    for (const H of Q().tabs)
+      T[H.id] = H;
     return T;
   }, []), W = z(
     (T) => {
-      const B = J.findIndex((I) => I.id === $);
-      if (B === -1) return;
+      const H = J.findIndex((I) => I.id === $);
+      if (H === -1) return;
       let V = null;
-      if (T.key === "ArrowRight" ? V = (B + 1) % J.length : T.key === "ArrowLeft" ? V = (B - 1 + J.length) % J.length : T.key === "Home" ? V = 0 : T.key === "End" && (V = J.length - 1), V === null) return;
+      if (T.key === "ArrowRight" ? V = (H + 1) % J.length : T.key === "ArrowLeft" ? V = (H - 1 + J.length) % J.length : T.key === "Home" ? V = 0 : T.key === "End" && (V = J.length - 1), V === null) return;
       T.preventDefault();
       const U = J[V];
       b(U.id), window.requestAnimationFrame(() => {
@@ -5361,10 +5363,10 @@ function ol() {
     },
     [$, J]
   );
-  return /* @__PURE__ */ l(ci, { children: /* @__PURE__ */ l(Li, { children: /* @__PURE__ */ l(Ri, { children: t && (() => {
+  return /* @__PURE__ */ l(di, { children: /* @__PURE__ */ l(Li, { children: /* @__PURE__ */ l(Ri, { children: t && (() => {
     const {
       width: T,
-      height: B,
+      height: H,
       narrow: V
     } = nl(
       typeof window < "u" ? window.innerWidth : 1024,
@@ -5386,12 +5388,12 @@ function ol() {
           style: {
             ...U,
             width: T,
-            height: B,
+            height: H,
             maxHeight: "calc(100vh - 32px)",
             // `--tokenpanel-grid-min` is read by .tokenpanel-tab-grid /
             // .tokenpanel-tab-advanced-grid; switching the variable rewires the
             // min-card-width without re-rendering the grids.
-            "--tokenpanel-grid-min": Po(E)
+            "--tokenpanel-grid-min": Ro(E)
           },
           children: [
             /* @__PURE__ */ k(
@@ -5631,7 +5633,7 @@ function ol() {
         }
       ),
       o && h && /* @__PURE__ */ l(
-        Zo,
+        er,
         {
           onClose: () => r(!1),
           state: h,
@@ -5639,7 +5641,7 @@ function ol() {
         }
       ),
       a && h && /* @__PURE__ */ l(
-        Qo,
+        tr,
         {
           onClose: () => i(!1),
           onLoad: Ie,
@@ -5647,7 +5649,7 @@ function ol() {
         }
       ),
       s && h && /* @__PURE__ */ l(
-        ir,
+        sr,
         {
           state: h,
           open: s,
@@ -5657,7 +5659,7 @@ function ol() {
         }
       ),
       c && /* @__PURE__ */ l(
-        Pa,
+        Ra,
         {
           anchorRef: p,
           onClose: () => u(!1)
@@ -5691,28 +5693,28 @@ function Sl(e) {
 function Tl(e) {
   return e.kind === "color";
 }
-function fo() {
-  return Ho(Q());
+function go() {
+  return jo(Q());
 }
-function ho() {
+function ko() {
   return Tn(Q());
 }
-const al = "toggle-design-token-panel", il = "toggle-color-tweak-panel", go = "__zdtp:open-state-changed";
-function pt() {
-  typeof window > "u" || window.dispatchEvent(new CustomEvent(go));
+const al = "toggle-design-token-panel", il = "toggle-color-tweak-panel", mo = "__zdtp:open-state-changed";
+function ft() {
+  typeof window > "u" || window.dispatchEvent(new CustomEvent(mo));
 }
-const Ml = go;
-function ft(e) {
+const Ml = mo;
+function ht(e) {
   if (!(typeof window > "u"))
     try {
-      window.localStorage.setItem(ho(), e ? "1" : "0");
+      window.localStorage.setItem(ko(), e ? "1" : "0");
     } catch {
     }
 }
-function ko() {
+function bo() {
   if (typeof window > "u") return !1;
   try {
-    return window.localStorage.getItem(ho()) === "1";
+    return window.localStorage.getItem(ko()) === "1";
   } catch {
     return !1;
   }
@@ -5721,12 +5723,12 @@ function ll() {
   if (typeof window > "u") return !1;
   try {
     const e = window.localStorage;
-    return e.getItem(Io()) !== null || e.getItem(Ro()) !== null;
+    return e.getItem(zo()) !== null || e.getItem(Oo()) !== null;
   } catch {
     return !1;
   }
 }
-function mo() {
+function vo() {
   if (typeof window > "u") return !1;
   try {
     return window.localStorage.getItem(Ve()) === "1";
@@ -5734,7 +5736,7 @@ function mo() {
     return !1;
   }
 }
-function ht(e) {
+function gt(e) {
   if (!(typeof window > "u"))
     try {
       const t = Ve();
@@ -5743,7 +5745,7 @@ function ht(e) {
     }
 }
 function We() {
-  return typeof document > "u" ? null : document.getElementById(fo());
+  return typeof document > "u" ? null : document.getElementById(go());
 }
 const yn = "zudo-design-token-panel-styles";
 function sl() {
@@ -5751,9 +5753,9 @@ function sl() {
   const e = document.createElement("style");
   e.id = yn, e.textContent = rl, document.head.appendChild(e);
 }
-function gt() {
+function kt() {
   if (typeof document > "u") return !1;
-  const e = fo();
+  const e = go();
   if (document.getElementById(e)) return !1;
   sl();
   const t = document.createElement("div");
@@ -5765,19 +5767,19 @@ function Al() {
 function cl() {
   if (typeof window > "u") return;
   const e = !We();
-  ht(!0), gt(), ft(!0), !e && pt();
+  gt(!0), kt(), ht(!0), !e && ft();
 }
 function dl() {
   if (typeof window > "u") return;
   const e = !We();
-  ht(!1), gt(), ft(!1), !e && pt();
+  gt(!1), kt(), ht(!1), !e && ft();
 }
 function Ll() {
   if (typeof window > "u") return;
-  const e = !mo(), t = !We();
-  ht(e), gt(), ft(e), !t && pt();
+  const e = !vo(), t = !We();
+  gt(e), kt(), ht(e), !t && ft();
 }
-function bo() {
+function wo() {
   if (!(typeof window > "u"))
     try {
       const e = En();
@@ -5785,20 +5787,20 @@ function bo() {
     } catch {
     }
 }
-function He() {
+function Be() {
   const e = We();
   if (!e) return;
-  const t = ko();
-  _n(null, e), e.remove(), t && ft(!0);
+  const t = bo();
+  _n(null, e), e.remove(), t && ht(!0);
 }
 function Le() {
-  bo(), ko() ? cl() : ll() && dl();
+  wo(), bo() ? cl() : ll() && dl();
 }
 function Nn() {
-  const e = !We(), t = e ? !0 : !mo();
-  ht(t), gt(), !e && pt();
+  const e = !We(), t = e ? !0 : !vo();
+  gt(t), kt(), !e && ft();
 }
-function vo() {
+function xo() {
   const e = window;
   if (e.__zudoDesignTokenPanelLifecycle) return e.__zudoDesignTokenPanelLifecycle;
   const t = { bound: !1, cleanups: [], adapter: null };
@@ -5813,15 +5815,15 @@ function ul(e) {
     } catch {
     }
 }
-function wo(e) {
-  typeof document > "u" || (document.addEventListener("astro:before-swap", He), document.addEventListener("astro:page-load", Le), e.cleanups.push(
-    () => document.removeEventListener("astro:before-swap", He),
+function yo(e) {
+  typeof document > "u" || (document.addEventListener("astro:before-swap", Be), document.addEventListener("astro:page-load", Le), e.cleanups.push(
+    () => document.removeEventListener("astro:before-swap", Be),
     () => document.removeEventListener("astro:page-load", Le)
   ));
 }
 function pl(e, t) {
-  if (!(typeof document > "u") && (t.onBeforeSwap ? e.cleanups.push(t.onBeforeSwap(He)) : (document.addEventListener("astro:before-swap", He), e.cleanups.push(
-    () => document.removeEventListener("astro:before-swap", He)
+  if (!(typeof document > "u") && (t.onBeforeSwap ? e.cleanups.push(t.onBeforeSwap(Be)) : (document.addEventListener("astro:before-swap", Be), e.cleanups.push(
+    () => document.removeEventListener("astro:before-swap", Be)
   )), t.onPageLoad ? e.cleanups.push(t.onPageLoad(Le)) : (document.addEventListener("astro:page-load", Le), e.cleanups.push(
     () => document.removeEventListener("astro:page-load", Le)
   )), !t.onBeforeSwap || !t.onPageLoad)) {
@@ -5836,22 +5838,22 @@ function pl(e, t) {
 }
 function Pl(e) {
   if (typeof window > "u") return;
-  const t = vo();
-  ul(t), t.adapter = e, e ? pl(t, e) : wo(t);
+  const t = xo();
+  ul(t), t.adapter = e, e ? pl(t, e) : yo(t);
 }
 const fl = () => {
-  bo(), Le();
+  wo(), Le();
 };
 if (typeof window < "u") {
-  const e = vo();
-  e.bound || (e.bound = !0, window.addEventListener(al, Nn), window.addEventListener(il, Nn), wo(e), Bo(fl));
+  const e = xo();
+  e.bound || (e.bound = !0, window.addEventListener(al, Nn), window.addEventListener(il, Nn), yo(e), Fo(fl));
 }
 export {
   zl as ZDTP_LEGACY_TYPOGRAPHY_RENAME_MAP,
   Ml as __OPEN_STATE_CHANGED_EVENT_FOR_TEST,
   Al as __panelConfigForTest,
   Dl as configurePanel,
-  wt as emptyOverrides,
+  xt as emptyOverrides,
   dl as hideDesignTokenPanel,
   Tl as isColorKind,
   El as isContentKind,
@@ -5861,7 +5863,7 @@ export {
   Nl as isNumberKind,
   _l as isSelectKind,
   $l as isTextKind,
-  bo as reapplyPersistedOverrides,
+  wo as reapplyPersistedOverrides,
   Pl as setLifecycleAdapter,
   Vl as setPanelColorPresets,
   cl as showDesignTokenPanel,