@takazudo/zdtp 0.7.0 → 0.8.1

package/dist/{panel-config-Crn5QJGy.js → panel-config-DKfob-1r.js}

@@ -1,66 +1,71 @@
-import { DEFAULT_STORAGE_PREFIX as z, resolveToggleEventName as M, READABLE_STATE_KEY_SUFFIXES as v } from "./constants.js";
+import { DEFAULT_STORAGE_PREFIX as M, resolveToggleEventName as z, READABLE_STATE_KEY_SUFFIXES as E } from "./constants.js";
 class k extends Error {
   constructor(t) {
     super(t), this.name = "TierResolverError", Object.setPrototypeOf(this, k.prototype);
   }
 }
-function S(e, t) {
+function x(e, t) {
   return e.tiers.find((n) => n.id === t);
 }
 function $(e, t) {
   return e.items.find((n) => n.id === t);
 }
-function te(e, t, n, a) {
-  const u = S(e, t);
-  if (!u)
+function te(e, t, n, c) {
+  const p = x(e, t);
+  if (!p)
     throw new k(
-      `Tier "${t}" not found in tab "${e.id}". Available tiers: ${e.tiers.map((f) => f.id).join(", ")}.`
+      `Tier "${t}" not found in tab "${e.id}". Available tiers: ${e.tiers.map((d) => d.id).join(", ")}.`
     );
-  const d = $(u, n);
-  if (!d)
+  const g = $(p, n);
+  if (!g)
     throw new k(
       `Item "${n}" not found in tier "${t}" of tab "${e.id}".`
     );
-  const r = a[t]?.[n];
-  if (u.referencesTier !== void 0) {
-    const f = u.referencesTier, l = S(e, f);
-    if (!l)
+  const r = c[t]?.[n];
+  if (r === void 0 && g.modes !== void 0)
+    return {
+      kind: "literal",
+      value: `light-dark(${g.modes.light}, ${g.modes.dark})`
+    };
+  if (p.referencesTier !== void 0) {
+    const d = p.referencesTier, a = x(e, d);
+    if (!a)
       throw new k(
-        `Tier "${t}" declares referencesTier "${f}" but that tier does not exist in tab "${e.id}".`
+        `Tier "${t}" declares referencesTier "${d}" but that tier does not exist in tab "${e.id}".`
       );
-    const o = $(l, r ?? n);
-    if (!o) {
-      const c = $(l, d.default) ?? $(l, n) ?? l.items[0];
-      if (!c)
+    const l = $(a, r ?? n);
+    if (!l) {
+      const i = $(a, g.default) ?? $(a, n) ?? a.items[0];
+      if (!i)
         throw new k(
-          `Referenced tier "${f}" has no items; cannot resolve fallback for item "${n}" in tier "${t}" of tab "${e.id}".`
+          `Referenced tier "${d}" has no items; cannot resolve fallback for item "${n}" in tier "${t}" of tab "${e.id}".`
         );
-      return { kind: "ref", targetCssVar: c.cssVar };
+      return { kind: "ref", targetCssVar: i.cssVar };
     }
-    return { kind: "ref", targetCssVar: o.cssVar };
+    return { kind: "ref", targetCssVar: l.cssVar };
   }
-  return r !== void 0 ? d.pill && r === d.pill.value ? { kind: "literal", value: d.pill.value } : { kind: "literal", value: r } : d.pill ? { kind: "literal", value: d.pill.customDefault } : { kind: "literal", value: d.default };
+  return r !== void 0 ? g.pill && r === g.pill.value ? { kind: "literal", value: g.pill.value } : { kind: "literal", value: r } : g.pill ? { kind: "literal", value: g.pill.customDefault } : { kind: "literal", value: g.default };
 }
 function ne(e) {
   return e.kind === "literal" ? e.value : `var(${e.targetCssVar})`;
 }
 function D(e, t, n = [t]) {
-  const a = e.tab === void 0 || e.tab === t.id ? t : n.find((s) => s.id === e.tab);
-  if (!a)
+  const c = e.tab === void 0 || e.tab === t.id ? t : n.find((s) => s.id === e.tab);
+  if (!c)
     throw new k(
       `Cross-tab ref target tab "${e.tab}" not found. Available tabs: ${n.map((s) => s.id).join(", ")}.`
     );
-  const u = S(a, e.tier);
-  if (!u)
+  const p = x(c, e.tier);
+  if (!p)
     throw new k(
-      `Cross-tab ref target tier "${e.tier}" not found in tab "${a.id}". Available tiers: ${a.tiers.map((s) => s.id).join(", ")}.`
+      `Cross-tab ref target tier "${e.tier}" not found in tab "${c.id}". Available tiers: ${c.tiers.map((s) => s.id).join(", ")}.`
     );
-  const d = $(u, e.item);
-  if (!d)
+  const g = $(p, e.item);
+  if (!g)
     throw new k(
-      `Cross-tab ref target item "${e.item}" not found in tier "${e.tier}" of tab "${a.id}". Available items: ${u.items.map((s) => s.id).join(", ")}.`
+      `Cross-tab ref target item "${e.item}" not found in tier "${e.tier}" of tab "${c.id}". Available items: ${p.items.map((s) => s.id).join(", ")}.`
     );
-  return d.cssVar;
+  return g.cssVar;
 }
 function re(e, t) {
   return e.paletteCssVarTemplate.replace("{n}", String(t));
@@ -222,83 +227,77 @@ const H = /* @__PURE__ */ new Set([
   "revert",
   "revert-layer"
 ]);
-function B(e) {
+function J(e) {
   return e.startsWith("#") || e.includes("(") || H.has(e.toLowerCase());
 }
-function J(e, t, n, a) {
-  const u = [], d = e.indexOf(":");
-  if (d !== -1) {
-    const r = e.slice(0, d), f = e.slice(d + 1), l = t.find((i) => i.tier === r);
-    l && u.push({ tab: l.tab, tier: l.tier, item: f });
+function B(e, t, n, c) {
+  const p = [], g = e.indexOf(":");
+  if (g !== -1) {
+    const r = e.slice(0, g), d = e.slice(g + 1), a = t.find((o) => o.tier === r);
+    a && p.push({ tab: a.tab, tier: a.tier, item: d });
   }
   const [s] = t;
-  u.push({ tab: s.tab, tier: s.tier, item: e });
-  for (const r of u)
+  p.push({ tab: s.tab, tier: s.tier, item: e });
+  for (const r of p)
     try {
-      return D(r, n, a), { ref: r };
+      return D(r, n, c), { ref: r };
     } catch {
     }
-  return { ref: u[0] };
+  return { ref: p[0] };
 }
-function F(e, t, n, a, u, d) {
+function F(e, t, n, c, p, g) {
   const s = t.get(e.default);
-  return s !== void 0 ? s : e.default === "bg" || e.default === "fg" ? e.default : n && n.length > 0 && !B(e.default) ? J(e.default, n, a, u) : d ? (console.warn(
+  return s !== void 0 ? s : e.default === "bg" || e.default === "fg" ? e.default : n && n.length > 0 && !J(e.default) ? B(e.default, n, c, p) : g ? (console.warn(
     `[design-token-panel] semantic item "${e.id}" default "${e.default}" names no palette item; falling back to palette index 0`
   ), 0) : { literal: e.default };
 }
 function _(e, t = [e]) {
   const n = e.colorExtras;
   if (!n) return;
-  const a = e.tiers.find(
-    (o) => !o.referencesTier && !o.semantic && o.items.length > 0 && o.items[0].type.kind === "color"
-  ), u = e.tiers.find(
-    (o) => a && o.referencesTier === a.id || o.semantic === !0
-  );
-  if (!a && !u)
-    return {
-      id: n.id,
-      label: n.label,
-      paletteSize: 0,
-      baseRoles: n.baseRoles,
-      paletteCssVarTemplate: "--zudo-stub-p{n}",
-      semanticDefaults: {},
-      semanticCssNames: {},
-      baseDefaults: n.baseDefaults,
-      defaultShikiTheme: n.defaultShikiTheme,
-      colorSchemes: n.colorSchemes,
-      panelSettings: n.panelSettings
-    };
-  const d = a?.items ?? [], s = d.length, r = d[0] ? d[0].cssVar.replace(/\d+$/, "{n}") : "--zudo-stub-p{n}", f = /* @__PURE__ */ new Map();
-  for (let o = 0; o < d.length; o++)
-    f.set(d[o].id, o);
-  const l = {}, i = {};
-  if (u) {
-    const o = !u.semantic, c = n.semanticDefaults;
-    for (const g of u.items)
-      i[g.id] = g.cssVar, l[g.id] = c && g.id in c ? c[g.id] : F(
-        g,
-        f,
-        u.referencesRamps,
+  const c = e.tiers.find(
+    (i) => !i.referencesTier && !i.semantic && i.items.length > 0 && (i.items[0].type.kind === "color" || i.items[0].modes !== void 0)
+  ), p = e.tiers.find(
+    (i) => c && i.referencesTier === c.id || i.semantic === !0
+  ), g = c?.items ?? [], s = g.length, r = {};
+  for (let i = 0; i < g.length; i++) {
+    const f = g[i].modes;
+    f && (r[i] = { ...f });
+  }
+  const d = g[0] ? g[0].cssVar.replace(/\d+$/, "{n}") : "--zudo-stub-p{n}", a = /* @__PURE__ */ new Map();
+  for (let i = 0; i < g.length; i++)
+    a.set(g[i].id, i);
+  const o = {}, l = {};
+  if (p) {
+    const i = !p.semantic, f = n.semanticDefaults;
+    for (const u of p.items)
+      l[u.id] = u.cssVar, u.modes ? o[u.id] = { literal: { ...u.modes } } : o[u.id] = f && u.id in f ? f[u.id] : F(
+        u,
+        a,
+        p.referencesRamps,
         e,
         t,
-        o
+        i
       );
   }
+  for (const i of e.tiers)
+    for (const f of i.items)
+      !f.modes || a.has(f.id) || f.id in o || (o[f.id] = { literal: { ...f.modes } }, l[f.id] = f.cssVar);
   return {
     id: n.id,
     label: n.label,
     paletteSize: s,
+    ...Object.keys(r).length > 0 ? { paletteModes: r } : {},
     baseRoles: n.baseRoles,
-    paletteCssVarTemplate: r,
-    semanticDefaults: l,
-    semanticCssNames: i,
+    paletteCssVarTemplate: d,
+    semanticDefaults: o,
+    semanticCssNames: l,
     baseDefaults: n.baseDefaults,
     defaultShikiTheme: n.defaultShikiTheme,
     colorSchemes: n.colorSchemes,
     panelSettings: n.panelSettings
   };
 }
-function ie(e) {
+function oe(e) {
   const t = e.find((n) => n.id === "color");
   if (t)
     return _(t, e);
@@ -307,26 +306,26 @@ function L(e) {
   const t = e.find((n) => n.id === "color-secondary");
   return t ? _(t, e) ?? null : null;
 }
-function x(e, t) {
+function S(e, t) {
   if (Object.is(e, t)) return !0;
   if (e === null || t === null || typeof e != typeof t || typeof e != "object") return !1;
   if (Array.isArray(e)) {
     if (!Array.isArray(t) || e.length !== t.length) return !1;
-    for (let d = 0; d < e.length; d++)
-      if (!x(e[d], t[d])) return !1;
+    for (let g = 0; g < e.length; g++)
+      if (!S(e[g], t[g])) return !1;
     return !0;
   }
   if (Array.isArray(t)) return !1;
-  const n = Object.keys(e), a = Object.keys(t);
-  if (n.length !== a.length) return !1;
-  const u = new Set(a);
-  for (const d of n)
-    if (!u.has(d) || !x(e[d], t[d]))
+  const n = Object.keys(e), c = Object.keys(t);
+  if (n.length !== c.length) return !1;
+  const p = new Set(c);
+  for (const g of n)
+    if (!p.has(g) || !S(e[g], t[g]))
       return !1;
   return !0;
 }
 const q = {
-  storagePrefix: z,
+  storagePrefix: M,
   consoleNamespace: "zudo",
   modalClassPrefix: "zudo-design-token-panel-modal",
   schemaId: "zudo-design-tokens/v1",
@@ -372,7 +371,7 @@ function G(e) {
     }
   };
 }
-function oe(e) {
+function ie(e) {
   h().lifecycleHooks = {
     configured: e.configured,
     open: e.open,
@@ -382,21 +381,21 @@ function oe(e) {
   };
 }
 function se(e) {
-  const t = h(), n = e.storagePrefix, a = t.instances.get(n);
-  if (a) {
-    const l = (i) => ({ ...i, applySink: void 0 });
-    if (x(l(a.suppliedConfig), l(e)))
-      return t.defaultPrefix = n, a.handle;
+  const t = h(), n = e.storagePrefix, c = t.instances.get(n);
+  if (c) {
+    const a = (o) => ({ ...o, applySink: void 0 });
+    if (S(a(c.suppliedConfig), a(e)))
+      return t.defaultPrefix = n, c.handle;
     throw new Error(
       `[design-token-panel] configurePanel() was already called with different values for storagePrefix "${n}". Configuration is one-shot per prefix per page lifecycle. To re-configure this prefix, call handle.destroy() first, then configurePanel() again. (Use a distinct storagePrefix for a second panel instance.)`
     );
   }
-  const u = t.pendingColorPresets, d = u ? { ...e, colorPresets: u } : { ...e };
+  const p = t.pendingColorPresets, g = p ? { ...e, colorPresets: p } : { ...e };
   t.pendingColorPresets = null;
   const s = t.instances.size === 0, r = s ? [...t.pendingPostConfigureHooks] : [];
   s && (t.pendingPostConfigureHooks.length = 0);
-  const f = {
-    config: d,
+  const d = {
+    config: g,
     // Snapshot the as-supplied config before any runtime merges. Used by the
     // idempotency guard so view-transition re-calls with the original inline
     // config keep passing even after setPanelColorPresets mutates `config`.
@@ -405,17 +404,17 @@ function se(e) {
     postConfigureHooks: r,
     handle: G(n)
   };
-  t.instances.set(n, f), t.defaultPrefix = n;
-  for (const l of f.postConfigureHooks)
-    l();
-  return t.lifecycleHooks.configured?.(n), f.handle;
+  t.instances.set(n, d), t.defaultPrefix = n;
+  for (const a of d.postConfigureHooks)
+    a();
+  return t.lifecycleHooks.configured?.(n), d.handle;
 }
-function T() {
+function j() {
   const e = h();
   return e.defaultPrefix === null ? null : e.instances.get(e.defaultPrefix) ?? null;
 }
 function ae(e) {
-  const t = T();
+  const t = j();
   if (t === null) {
     const n = h();
     if (n.pendingPostConfigureHooks.includes(e)) return;
@@ -424,8 +423,8 @@ function ae(e) {
   }
   t.postConfigureHooks.includes(e) || (t.postConfigureHooks.push(e), e());
 }
-function j() {
-  return T()?.config ?? q;
+function T() {
+  return j()?.config ?? q;
 }
 function le() {
   return [...h().instances.values()].map((e) => e.config);
@@ -441,29 +440,29 @@ function A() {
   const e = h();
   return e.colorSchemeOwners || (e.colorSchemeOwners = /* @__PURE__ */ new Set()), e.colorSchemeOwners;
 }
-function ge(e) {
+function de(e) {
   A().add(e);
 }
-function de(e) {
+function ge(e) {
   A().delete(e);
 }
 function ue(e) {
   return A().has(e);
 }
-function pe(e = j()) {
+function pe(e = T()) {
   return L(e.tabs);
 }
 function me(e) {
-  return e.storagePrefix + v.v2;
+  return e.storagePrefix + E.v2;
 }
 function ye(e) {
-  return e.storagePrefix + v.v3;
+  return e.storagePrefix + E.v3;
 }
 function he(e) {
-  return e.storagePrefix + v.v4;
+  return e.storagePrefix + E.v4;
 }
 function we(e) {
-  return e.storagePrefix + v.v1;
+  return e.storagePrefix + E.v1;
 }
 function be(e) {
   return `${e.storagePrefix}-spawn-ordinal`;
@@ -480,32 +479,32 @@ function Ce(e) {
 function Pe(e) {
   return `${e.storagePrefix}-dock`;
 }
-function Ee(e) {
+function ve(e) {
   return `${e.storagePrefix}-dock-size`;
 }
-function ve(e) {
+function Ee(e) {
   return `${e.storagePrefix}-density`;
 }
 function Ae(e) {
   return `${e.storagePrefix}-specimen`;
 }
-function Se(e, t) {
+function xe(e, t) {
   return `${e.storagePrefix}-snapshot-${t}`;
 }
-function xe(e) {
+function Se(e) {
   return `${e.storagePrefix}-last-applied`;
 }
-function Te(e) {
+function je(e) {
   return `${e.storagePrefix}:visible`;
 }
-function je(e) {
+function Te(e) {
   return `${e.storagePrefix}:autoload`;
 }
 function Oe(e) {
   return `${e.storagePrefix}-root`;
 }
 function Re(e) {
-  return M(e);
+  return z(e);
 }
 const U = "__zdtp:open-state-changed";
 function Ve(e) {
@@ -549,10 +548,10 @@ function Ke(e) {
     );
     return;
   }
-  const a = { ...e };
-  a[N] = !0, t.zdtp = a;
+  const c = { ...e };
+  c[N] = !0, t.zdtp = c;
 }
-function ze(e) {
+function Me(e) {
   if (e === null || typeof e != "object" || Array.isArray(e))
     throw new Error("[design-token-panel] PanelConfig must be a non-null object");
   const t = e;
@@ -578,8 +577,8 @@ function ze(e) {
   if (t.applyRouting !== void 0) {
     if (t.applyRouting === null || typeof t.applyRouting != "object" || Array.isArray(t.applyRouting))
       throw new Error("[design-token-panel] PanelConfig.applyRouting must be a plain object");
-    for (const [n, a] of Object.entries(t.applyRouting))
-      if (typeof a != "string")
+    for (const [n, c] of Object.entries(t.applyRouting))
+      if (typeof c != "string")
         throw new Error(
           `[design-token-panel] PanelConfig.applyRouting[${JSON.stringify(n)}] must be a string`
         );
@@ -588,10 +587,10 @@ function ze(e) {
     if (t.domTweaker === null || typeof t.domTweaker != "object" || Array.isArray(t.domTweaker))
       throw new Error("[design-token-panel] PanelConfig.domTweaker must be a plain object");
     const n = t.domTweaker;
-    for (const a of Object.keys(n))
-      if (a !== "themeCss")
+    for (const c of Object.keys(n))
+      if (c !== "themeCss")
         throw new Error(
-          `[design-token-panel] PanelConfig.domTweaker.${a} is not a supported field`
+          `[design-token-panel] PanelConfig.domTweaker.${c} is not a supported field`
         );
     if (n.themeCss !== void 0) {
       if (typeof n.themeCss != "string")
@@ -608,9 +607,9 @@ function ze(e) {
     if (t.dock === null || typeof t.dock != "object" || Array.isArray(t.dock))
       throw new Error("[design-token-panel] PanelConfig.dock must be a plain object");
     const n = t.dock;
-    for (const a of Object.keys(n))
-      if (a !== "reflow")
-        throw new Error(`[design-token-panel] PanelConfig.dock.${a} is not a supported field`);
+    for (const c of Object.keys(n))
+      if (c !== "reflow")
+        throw new Error(`[design-token-panel] PanelConfig.dock.${c} is not a supported field`);
     if (n.reflow !== void 0 && n.reflow !== "body-margin" && n.reflow !== "none")
       throw new Error(
         '[design-token-panel] PanelConfig.dock.reflow must be "body-margin" or "none" when set'
@@ -623,10 +622,10 @@ function ze(e) {
   if (t.legacyIdRenameMap !== void 0) {
     if (t.legacyIdRenameMap === null || typeof t.legacyIdRenameMap != "object" || Array.isArray(t.legacyIdRenameMap))
       throw new Error("[design-token-panel] PanelConfig.legacyIdRenameMap must be a plain object");
-    for (const [n, a] of Object.entries(t.legacyIdRenameMap))
-      if (a !== null && typeof a != "string")
+    for (const [n, c] of Object.entries(t.legacyIdRenameMap))
+      if (c !== null && typeof c != "string")
         throw new Error(
-          `[design-token-panel] PanelConfig.legacyIdRenameMap[${JSON.stringify(n)}] must be a string or null (got ${typeof a})`
+          `[design-token-panel] PanelConfig.legacyIdRenameMap[${JSON.stringify(n)}] must be a string or null (got ${typeof c})`
         );
   }
 }
@@ -637,14 +636,14 @@ function Z(e) {
   for (const n of e) {
     if (n === null || typeof n != "object" || Array.isArray(n))
       throw new Error("[design-token-panel] PanelConfig.tabs: each tab must be a non-null object");
-    const a = n;
-    if (typeof a.id != "string" || a.id.length === 0)
+    const c = n;
+    if (typeof c.id != "string" || c.id.length === 0)
       throw new Error("[design-token-panel] PanelConfig.tabs: each tab must have a non-empty string id");
-    if (t.has(a.id))
+    if (t.has(c.id))
       throw new Error(
-        `[design-token-panel] PanelConfig.tabs: duplicate tab id "${a.id}"`
+        `[design-token-panel] PanelConfig.tabs: duplicate tab id "${c.id}"`
       );
-    t.add(a.id), Q(a.id, a, e);
+    t.add(c.id), Q(c.id, c, e);
   }
 }
 function X(e) {
@@ -655,14 +654,14 @@ function X(e) {
     const n = t.literal;
     if (typeof n == "string") return !0;
     if (n === null || typeof n != "object" || Array.isArray(n)) return !1;
-    const a = n;
-    return typeof a.light == "string" && typeof a.dark == "string";
+    const c = n;
+    return typeof c.light == "string" && typeof c.dark == "string";
   }
   if ("ref" in t) {
     const n = t.ref;
     if (n === null || typeof n != "object" || Array.isArray(n)) return !1;
-    const a = n;
-    return !(typeof a.tier != "string" || typeof a.item != "string" || a.tab !== void 0 && typeof a.tab != "string");
+    const c = n;
+    return !(typeof c.tier != "string" || typeof c.item != "string" || c.tab !== void 0 && typeof c.tab != "string");
   }
   return !1;
 }
@@ -671,7 +670,7 @@ function Q(e, t, n) {
     throw new Error(
       `[design-token-panel] PanelConfig.tabs["${e}"].tiers must be an array`
     );
-  const a = /* @__PURE__ */ new Set(), u = /* @__PURE__ */ new Map();
+  const c = /* @__PURE__ */ new Set(), p = /* @__PURE__ */ new Map();
   for (const s of t.tiers) {
     if (s === null || typeof s != "object" || Array.isArray(s))
       throw new Error(
@@ -682,15 +681,15 @@ function Q(e, t, n) {
       throw new Error(
         `[design-token-panel] PanelConfig.tabs["${e}"].tiers: each tier must have a non-empty string id`
       );
-    if (a.has(r.id))
+    if (c.has(r.id))
       throw new Error(
         `[design-token-panel] PanelConfig.tabs["${e}"]: duplicate tier id "${r.id}"`
       );
-    if (a.add(r.id), r.semantic !== void 0 && r.semantic !== !0)
+    if (c.add(r.id), r.semantic !== void 0 && r.semantic !== !0)
       throw new Error(
         `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${r.id}"].semantic must be exactly \`true\` when present (got ${JSON.stringify(r.semantic)})`
       );
-    const f = /* @__PURE__ */ new Set([
+    const d = /* @__PURE__ */ new Set([
       "size",
       "line-height",
       "family",
@@ -699,7 +698,7 @@ function Q(e, t, n) {
       "radius",
       "duration"
     ]);
-    if (r.preview !== void 0 && !f.has(r.preview))
+    if (r.preview !== void 0 && !d.has(r.preview))
       throw new Error(
         `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${r.id}"].preview has unsupported value ${JSON.stringify(r.preview)}`
       );
@@ -715,150 +714,164 @@ function Q(e, t, n) {
       throw new Error(
         `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${r.id}"].items must be an array`
       );
-    let l;
-    for (const i of r.items) {
+    let a;
+    for (const o of r.items) {
+      if (o === null || typeof o != "object" || Array.isArray(o)) continue;
+      const i = o.type;
       if (i === null || typeof i != "object" || Array.isArray(i)) continue;
-      const c = i.type;
-      if (c === null || typeof c != "object" || Array.isArray(c)) continue;
-      const g = c.kind;
-      if (typeof g == "string") {
-        if (l === void 0)
-          l = g;
-        else if (l !== g)
+      const f = i.kind;
+      if (typeof f == "string") {
+        if (a === void 0)
+          a = f;
+        else if (a !== f)
           throw new Error(
-            `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${r.id}"]: mixed item kinds — found "${l}" and "${g}" in the same tier (all items must share the same kind)`
+            `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${r.id}"]: mixed item kinds — found "${a}" and "${f}" in the same tier (all items must share the same kind)`
           );
       }
     }
-    l !== void 0 && u.set(r.id, l);
+    a !== void 0 && p.set(r.id, a);
   }
-  const d = /* @__PURE__ */ new Set();
+  const g = /* @__PURE__ */ new Set();
   for (const s of t.tiers) {
-    const r = s, f = r.id;
-    for (const l of r.items) {
-      if (l === null || typeof l != "object" || Array.isArray(l))
+    const r = s, d = r.id;
+    for (const a of r.items) {
+      if (a === null || typeof a != "object" || Array.isArray(a))
         throw new Error(
-          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].items: each item must be a non-null object`
+          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].items: each item must be a non-null object`
         );
-      const i = l;
-      if (typeof i.id != "string" || i.id.length === 0)
+      const o = a;
+      if (typeof o.id != "string" || o.id.length === 0)
         throw new Error(
-          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].items: each item must have a non-empty string id`
+          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].items: each item must have a non-empty string id`
         );
-      if (d.has(i.id))
+      if (g.has(o.id))
         throw new Error(
-          `[design-token-panel] PanelConfig.tabs["${e}"]: duplicate item id "${i.id}" (item ids must be unique across all tiers within a tab)`
+          `[design-token-panel] PanelConfig.tabs["${e}"]: duplicate item id "${o.id}" (item ids must be unique across all tiers within a tab)`
         );
-      if (d.add(i.id), typeof i.cssVar != "string" || !i.cssVar.startsWith("--"))
+      if (g.add(o.id), typeof o.cssVar != "string" || !o.cssVar.startsWith("--"))
         throw new Error(
-          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].items["${i.id}"].cssVar must start with "--" (got ${JSON.stringify(i.cssVar)})`
+          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].items["${o.id}"].cssVar must start with "--" (got ${JSON.stringify(o.cssVar)})`
         );
-      if (i.cssVar.length <= 2)
+      if (o.cssVar.length <= 2)
         throw new Error(
-          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].items["${i.id}"].cssVar must be non-empty after "--"`
+          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].items["${o.id}"].cssVar must be non-empty after "--"`
         );
-      const o = i.type;
-      if (o !== null && typeof o == "object" && !Array.isArray(o) && o.kind === "length" && o.units !== void 0) {
-        const c = o.units;
-        if (!Array.isArray(c))
+      const l = o.type;
+      if (o.modes !== void 0) {
+        const i = `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].items["${o.id}"].modes`;
+        if (o.modes === null || typeof o.modes != "object" || Array.isArray(o.modes))
+          throw new Error(`${i} must be a plain object`);
+        const f = l !== null && typeof l == "object" && !Array.isArray(l) ? l.kind : void 0;
+        if (f !== "color" && f !== "text")
+          throw new Error(
+            `${i} is only valid when type.kind is "color" or "text" (got ${JSON.stringify(f)})`
+          );
+        const u = o.modes;
+        for (const m of ["light", "dark"])
+          if (typeof u[m] != "string" || u[m].trim().length === 0)
+            throw new Error(`${i}.${m} must be a non-empty string`);
+      }
+      if (l !== null && typeof l == "object" && !Array.isArray(l) && l.kind === "length" && l.units !== void 0) {
+        const i = l.units;
+        if (!Array.isArray(i))
           throw new Error(
-            `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].items["${i.id}"].type.units must be an array`
+            `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].items["${o.id}"].type.units must be an array`
           );
-        const g = /* @__PURE__ */ new Set();
-        for (const p of c) {
-          if (typeof p != "string" || p.length === 0)
+        const f = /* @__PURE__ */ new Set();
+        for (const u of i) {
+          if (typeof u != "string" || u.length === 0)
             throw new Error(
-              `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].items["${i.id}"].type.units entries must be non-empty strings (got ${JSON.stringify(p)})`
+              `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].items["${o.id}"].type.units entries must be non-empty strings (got ${JSON.stringify(u)})`
             );
-          if (g.has(p))
+          if (f.has(u))
             throw new Error(
-              `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].items["${i.id}"].type.units: duplicate unit ${JSON.stringify(p)}`
+              `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].items["${o.id}"].type.units: duplicate unit ${JSON.stringify(u)}`
             );
-          g.add(p);
+          f.add(u);
         }
       }
     }
   }
   for (const s of t.tiers) {
-    const r = s, f = r.id;
+    const r = s, d = r.id;
     if (r.referencesTier !== void 0) {
       if (typeof r.referencesTier != "string")
         throw new Error(
-          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].referencesTier must be a string`
+          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].referencesTier must be a string`
         );
-      const l = r.referencesTier;
-      if (!a.has(l))
+      const a = r.referencesTier;
+      if (!c.has(a))
         throw new Error(
-          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].referencesTier: tier "${l}" does not exist in this tab`
+          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].referencesTier: tier "${a}" does not exist in this tab`
         );
-      const i = u.get(f), o = u.get(l);
-      if (i !== void 0 && o !== void 0 && i !== "text" && i !== o)
+      const o = p.get(d), l = p.get(a);
+      if (o !== void 0 && l !== void 0 && o !== "text" && o !== l)
         throw new Error(
-          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].referencesTier: referencing tier has kind "${i}" but referenced tier "${l}" has kind "${o}" (cross-kind reference is only allowed when the referencing tier has kind "text")`
+          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].referencesTier: referencing tier has kind "${o}" but referenced tier "${a}" has kind "${l}" (cross-kind reference is only allowed when the referencing tier has kind "text")`
         );
     }
   }
   for (const s of t.tiers) {
-    const r = s, f = r.id, l = r.preview;
-    if (l === void 0) continue;
-    const i = u.get(f), o = typeof r.referencesTier == "string" ? u.get(r.referencesTier) : void 0, c = (g) => {
+    const r = s, d = r.id, a = r.preview;
+    if (a === void 0) continue;
+    const o = p.get(d), l = typeof r.referencesTier == "string" ? p.get(r.referencesTier) : void 0, i = (f) => {
       throw new Error(
-        `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].preview "${l}" requires ${g}`
+        `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].preview "${a}" requires ${f}`
       );
     };
-    if (l === "size" && (r.referencesTier === void 0 ? i !== "length" : o !== "length") && c("a length tier or a reference tier resolving to length"), l === "line-height" && i !== "number" && c("a number tier"), l === "family" && i !== "text" && c("a text tier"), l === "weight" && i !== "select" && i !== "number" && c("a select or number tier"), (l === "bar" || l === "radius") && i !== "length" && c("a length tier"), l === "duration") {
-      i !== "length" && i !== "number" && c('a length or number tier with unit "ms" or "s"');
-      for (const g of r.items) {
-        if (g === null || typeof g != "object" || Array.isArray(g))
+    if (a === "size" && (r.referencesTier === void 0 ? o !== "length" : l !== "length") && i("a length tier or a reference tier resolving to length"), a === "line-height" && o !== "number" && i("a number tier"), a === "family" && o !== "text" && i("a text tier"), a === "weight" && o !== "select" && o !== "number" && i("a select or number tier"), (a === "bar" || a === "radius") && o !== "length" && i("a length tier"), a === "duration") {
+      o !== "length" && o !== "number" && i('a length or number tier with unit "ms" or "s"');
+      for (const f of r.items) {
+        if (f === null || typeof f != "object" || Array.isArray(f))
           continue;
-        const p = g.type, m = p !== null && typeof p == "object" && !Array.isArray(p) ? p.unit : void 0;
-        m !== "ms" && m !== "s" && c('a length or number tier with unit "ms" or "s"');
+        const u = f.type, m = u !== null && typeof u == "object" && !Array.isArray(u) ? u.unit : void 0;
+        m !== "ms" && m !== "s" && i('a length or number tier with unit "ms" or "s"');
       }
     }
   }
   for (const s of t.tiers) {
-    const r = s, f = r.id;
+    const r = s, d = r.id;
     if (r.referencesRamps === void 0) continue;
     if (r.semantic !== !0)
       throw new Error(
-        `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].referencesRamps is only valid on a tier with semantic: true`
+        `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].referencesRamps is only valid on a tier with semantic: true`
       );
     if (!Array.isArray(r.referencesRamps))
       throw new Error(
-        `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].referencesRamps must be an array`
+        `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].referencesRamps must be an array`
       );
     if (e !== "color" && e !== "color-secondary")
       throw new Error(
-        `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].referencesRamps is only supported on tabs with id "color" or "color-secondary" (got "${e}")`
+        `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].referencesRamps is only supported on tabs with id "color" or "color-secondary" (got "${e}")`
       );
-    const l = u.get(f), i = r.referencesRamps;
-    for (let o = 0; o < i.length; o++) {
-      const c = i[o];
-      if (c === null || typeof c != "object" || Array.isArray(c))
+    const a = p.get(d), o = r.referencesRamps;
+    for (let l = 0; l < o.length; l++) {
+      const i = o[l];
+      if (i === null || typeof i != "object" || Array.isArray(i))
         throw new Error(
-          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].referencesRamps[${o}] must be a non-null object`
+          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].referencesRamps[${l}] must be a non-null object`
         );
-      const g = c;
-      if (typeof g.tier != "string" || g.tier.length === 0)
+      const f = i;
+      if (typeof f.tier != "string" || f.tier.length === 0)
         throw new Error(
-          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].referencesRamps[${o}].tier must be a non-empty string`
+          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].referencesRamps[${l}].tier must be a non-empty string`
         );
-      if (g.tab !== void 0 && (typeof g.tab != "string" || g.tab.length === 0))
+      if (f.tab !== void 0 && (typeof f.tab != "string" || f.tab.length === 0))
         throw new Error(
-          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].referencesRamps[${o}].tab must be a non-empty string when set`
+          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].referencesRamps[${l}].tab must be a non-empty string when set`
         );
-      const p = g.tab === void 0 ? e : g.tab;
+      const u = f.tab === void 0 ? e : f.tab;
       let m;
-      if (p === e)
+      if (u === e)
         m = t;
       else {
         const b = n.find(
-          (y) => y !== null && typeof y == "object" && !Array.isArray(y) && y.id === p
+          (y) => y !== null && typeof y == "object" && !Array.isArray(y) && y.id === u
         );
         if (!b) {
           const y = n.filter((w) => w !== null && typeof w == "object" && !Array.isArray(w)).map((w) => w.id).join(", ");
           throw new Error(
-            `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].referencesRamps[${o}]: tab "${p}" does not exist. Available tabs: ${y}.`
+            `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].referencesRamps[${l}]: tab "${u}" does not exist. Available tabs: ${y}.`
           );
         }
         m = b;
@@ -868,28 +881,28 @@ function Q(e, t, n) {
       for (const b of C) {
         if (b === null || typeof b != "object" || Array.isArray(b)) continue;
         const y = b;
-        typeof y.id == "string" && (O.push(y.id), y.id === g.tier && (P = y));
+        typeof y.id == "string" && (O.push(y.id), y.id === f.tier && (P = y));
       }
       if (!P)
         throw new Error(
-          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].referencesRamps[${o}]: tier "${g.tier}" does not exist in tab "${p}". Available tiers: ${O.join(", ")}.`
+          `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].referencesRamps[${l}]: tier "${f.tier}" does not exist in tab "${u}". Available tiers: ${O.join(", ")}.`
         );
-      if (l !== void 0) {
+      if (a !== void 0) {
         const b = Array.isArray(P.items) ? P.items : [];
         let y;
         for (const w of b) {
           if (w === null || typeof w != "object" || Array.isArray(w)) continue;
-          const E = w.type;
-          if (E === null || typeof E != "object" || Array.isArray(E)) continue;
-          const R = E.kind;
+          const v = w.type;
+          if (v === null || typeof v != "object" || Array.isArray(v)) continue;
+          const R = v.kind;
           if (typeof R == "string") {
             y = R;
             break;
           }
         }
-        if (y !== void 0 && l !== y)
+        if (y !== void 0 && a !== y)
           throw new Error(
-            `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${f}"].referencesRamps[${o}]: referencing semantic tier has kind "${l}" but target tier "${g.tier}" in tab "${p}" has kind "${y}" (cross-tab ramp sources must share the semantic tier's kind)`
+            `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${d}"].referencesRamps[${l}]: referencing semantic tier has kind "${a}" but target tier "${f.tier}" in tab "${u}" has kind "${y}" (cross-tab ramp sources must share the semantic tier's kind)`
           );
       }
     }
@@ -900,31 +913,31 @@ function Q(e, t, n) {
         '[design-token-panel] PanelConfig.tabs["palette"].colorExtras must be absent — multiple kind:"color" tiers are only safe when resolveColorClusterFromTab is not invoked'
       );
     for (const s of t.tiers) {
-      const r = s.items, f = `[design-token-panel] PanelConfig.tabs["palette"].tiers["${s.id}"]`;
+      const r = s.items, d = `[design-token-panel] PanelConfig.tabs["palette"].tiers["${s.id}"]`;
       if (r.length === 0)
-        throw new Error(`${f}.items must be non-empty`);
-      for (const [o, c] of r.entries())
-        if (c.type.kind !== "color")
-          throw new Error(`${f}.items[${o}].type.kind must be "color"`);
-      const l = r[0].cssVar, i = l.replace(/\d+$/, "{n}");
-      if (i.includes("{n}")) {
-        const o = Number(l.match(/\d+$/)[0]);
-        for (const [c, g] of r.entries()) {
-          const p = i.replace("{n}", String(o + c));
-          if (!Number.isSafeInteger(o + c) || g.cssVar !== p)
+        throw new Error(`${d}.items must be non-empty`);
+      for (const [l, i] of r.entries())
+        if (i.type.kind !== "color")
+          throw new Error(`${d}.items[${l}].type.kind must be "color"`);
+      const a = r[0].cssVar, o = a.replace(/\d+$/, "{n}");
+      if (o.includes("{n}")) {
+        const l = Number(a.match(/\d+$/)[0]);
+        for (const [i, f] of r.entries()) {
+          const u = o.replace("{n}", String(l + i));
+          if (!Number.isSafeInteger(l + i) || f.cssVar !== u)
             throw new Error(
-              `${f}.items[${c}].cssVar is ${JSON.stringify(g.cssVar)} but expected ${JSON.stringify(p)} — palette item cssVars must share one prefix and be numbered consecutively in tier order`
+              `${d}.items[${i}].cssVar is ${JSON.stringify(f.cssVar)} but expected ${JSON.stringify(u)} — palette item cssVars must share one prefix and be numbered consecutively in tier order`
             );
         }
       } else {
-        const o = l.slice(0, l.lastIndexOf("-") + 1), c = /* @__PURE__ */ new Set();
-        for (const [g, p] of r.entries()) {
-          const m = p.cssVar;
-          if (r.length > 1 && o === "--" || !m.startsWith(o) || m.length === o.length || /\d+$/.test(m) || c.has(m))
+        const l = a.slice(0, a.lastIndexOf("-") + 1), i = /* @__PURE__ */ new Set();
+        for (const [f, u] of r.entries()) {
+          const m = u.cssVar;
+          if (r.length > 1 && l === "--" || !m.startsWith(l) || m.length === l.length || /\d+$/.test(m) || i.has(m))
             throw new Error(
-              `${f}.items[${g}].cssVar ${JSON.stringify(m)} — named palette item cssVars must share one prefix and have unique non-numbered suffixes`
+              `${d}.items[${f}].cssVar ${JSON.stringify(m)} — named palette item cssVars must share one prefix and have unique non-numbered suffixes`
             );
-          c.add(m);
+          i.add(m);
         }
       }
     }
@@ -935,15 +948,15 @@ function Q(e, t, n) {
       throw new Error(
         `[design-token-panel] PanelConfig.tabs["${e}"].colorExtras must be a plain object`
       );
-    for (const i of ["id", "defaultShikiTheme"])
-      if (typeof s[i] != "string" || s[i].length === 0)
+    for (const o of ["id", "defaultShikiTheme"])
+      if (typeof s[o] != "string" || s[o].length === 0)
         throw new Error(
-          `[design-token-panel] PanelConfig.tabs["${e}"].colorExtras.${i} must be a non-empty string (got ${typeof s[i]})`
+          `[design-token-panel] PanelConfig.tabs["${e}"].colorExtras.${o} must be a non-empty string (got ${typeof s[o]})`
         );
-    for (const i of ["colorSchemes", "baseRoles", "baseDefaults"])
-      if (s[i] === void 0 || s[i] === null || typeof s[i] != "object" || Array.isArray(s[i]))
+    for (const o of ["colorSchemes", "baseRoles", "baseDefaults"])
+      if (s[o] === void 0 || s[o] === null || typeof s[o] != "object" || Array.isArray(s[o]))
         throw new Error(
-          `[design-token-panel] PanelConfig.tabs["${e}"].colorExtras.${i} must be a plain object`
+          `[design-token-panel] PanelConfig.tabs["${e}"].colorExtras.${o} must be a plain object`
         );
     if (s.panelSettings === void 0 || s.panelSettings === null || typeof s.panelSettings != "object" || Array.isArray(s.panelSettings))
       throw new Error(
@@ -959,15 +972,15 @@ function Q(e, t, n) {
         throw new Error(
           `[design-token-panel] PanelConfig.tabs["${e}"].colorExtras.panelSettings.colorMode must be false or a plain object`
         );
-      const i = r.colorMode;
-      for (const o of ["lightScheme", "darkScheme"])
-        if (typeof i[o] != "string" || i[o].length === 0)
+      const o = r.colorMode;
+      for (const l of ["lightScheme", "darkScheme"])
+        if (typeof o[l] != "string" || o[l].length === 0)
           throw new Error(
-            `[design-token-panel] PanelConfig.tabs["${e}"].colorExtras.panelSettings.colorMode.${o} must be a non-empty string`
+            `[design-token-panel] PanelConfig.tabs["${e}"].colorExtras.panelSettings.colorMode.${l} must be a non-empty string`
           );
-      if (i.defaultMode !== "light" && i.defaultMode !== "dark")
+      if (o.defaultMode !== "light" && o.defaultMode !== "dark")
         throw new Error(
-          `[design-token-panel] PanelConfig.tabs["${e}"].colorExtras.panelSettings.colorMode.defaultMode must be "light" or "dark" (got ${JSON.stringify(i.defaultMode)})`
+          `[design-token-panel] PanelConfig.tabs["${e}"].colorExtras.panelSettings.colorMode.defaultMode must be "light" or "dark" (got ${JSON.stringify(o.defaultMode)})`
         );
     }
     if (s.semanticDefaults !== void 0) {
@@ -975,37 +988,37 @@ function Q(e, t, n) {
         throw new Error(
           `[design-token-panel] PanelConfig.tabs["${e}"].colorExtras.semanticDefaults must be a plain object`
         );
-      const i = s.semanticDefaults;
-      for (const [o, c] of Object.entries(i))
-        if (!X(c))
+      const o = s.semanticDefaults;
+      for (const [l, i] of Object.entries(o))
+        if (!X(i))
           throw new Error(
-            `[design-token-panel] PanelConfig.tabs["${e}"].colorExtras.semanticDefaults["${o}"] must be a valid SemanticValue (number | 'bg' | 'fg' | { literal: string } | { literal: { light, dark } } | { ref: { tier, item, tab? } }), got ${JSON.stringify(c)}`
+            `[design-token-panel] PanelConfig.tabs["${e}"].colorExtras.semanticDefaults["${l}"] must be a valid SemanticValue (number | 'bg' | 'fg' | { literal: string } | { literal: { light, dark } } | { ref: { tier, item, tab? } }), got ${JSON.stringify(i)}`
           );
     }
-    const l = t.tiers.find((i) => {
-      if (i.referencesTier !== void 0 || i.semantic === !0) return !1;
-      const o = i.items;
-      if (!Array.isArray(o) || o.length === 0) return !1;
-      const c = o[0];
-      if (c === null || typeof c != "object" || Array.isArray(c)) return !1;
-      const g = c.type;
-      return g === null || typeof g != "object" || Array.isArray(g) ? !1 : g.kind === "color";
+    const a = t.tiers.find((o) => {
+      if (o.referencesTier !== void 0 || o.semantic === !0) return !1;
+      const l = o.items;
+      if (!Array.isArray(l) || l.length === 0) return !1;
+      const i = l[0];
+      if (i === null || typeof i != "object" || Array.isArray(i)) return !1;
+      const f = i.type;
+      return f === null || typeof f != "object" || Array.isArray(f) ? !1 : f.kind === "color";
     });
-    if (l) {
-      const i = l.id, o = l.items, c = o[0]?.cssVar;
-      if (c !== void 0) {
-        const g = c.replace(/\d+$/, "{n}");
-        if (g.includes("{n}"))
-          for (let p = 0; p < o.length; p++) {
-            const m = o[p], C = g.replace("{n}", String(p));
+    if (a) {
+      const o = a.id, l = a.items, i = l[0]?.cssVar;
+      if (i !== void 0) {
+        const f = i.replace(/\d+$/, "{n}");
+        if (f.includes("{n}"))
+          for (let u = 0; u < l.length; u++) {
+            const m = l[u], C = f.replace("{n}", String(u));
             if (m.cssVar !== C)
               throw new Error(
-                `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${i}"].items[${p}].cssVar is ${JSON.stringify(m.cssVar)} but expected ${JSON.stringify(C)} — palette item cssVars must share one prefix and be numbered 0..n-1 in tier order (template derived from first item: ${JSON.stringify(g)})`
+                `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${o}"].items[${u}].cssVar is ${JSON.stringify(m.cssVar)} but expected ${JSON.stringify(C)} — palette item cssVars must share one prefix and be numbered 0..n-1 in tier order (template derived from first item: ${JSON.stringify(f)})`
               );
           }
-        else if (o.length > 1)
+        else if (l.length > 1)
           throw new Error(
-            `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${i}"].items[0].cssVar ${JSON.stringify(c)} has no trailing digit — palette item cssVars must share one prefix and be numbered 0..n-1 in tier order (e.g. "--pal-0" … "--pal-15")`
+            `[design-token-panel] PanelConfig.tabs["${e}"].tiers["${o}"].items[0].cssVar ${JSON.stringify(i)} has no trailing digit — palette item cssVars must share one prefix and be numbered 0..n-1 in tier order (e.g. "--pal-0" … "--pal-15")`
           );
       }
     }
@@ -1034,14 +1047,14 @@ function Q(e, t, n) {
       `[design-token-panel] PanelConfig.tabs["${e}"].notesExtras must only be set on a tab with id "notes"`
     );
 }
-function I(e = j()) {
+function I(e = T()) {
   return e.applyRouting ?? {};
 }
-function Me(e = j()) {
+function ze(e = T()) {
   return !!e.applyEndpoint && Object.keys(I(e)).length > 0;
 }
 function De(e) {
-  const t = T();
+  const t = j();
   if (t === null) {
     h().pendingColorPresets = e;
     return;
@@ -1051,15 +1064,15 @@ function De(e) {
 export {
   D as A,
   _ as B,
-  x as C,
+  S as C,
   Ne as D,
   I as E,
-  Me as F,
-  xe as G,
-  Se as H,
+  ze as F,
+  Se as G,
+  xe as H,
   Ae as I,
   Ve as J,
-  oe as K,
+  ie as K,
   ae as L,
   Re as M,
   le as N,
@@ -1067,30 +1080,30 @@ export {
   Oe as P,
   be as Q,
   ce as _,
-  Te as a,
-  ze as b,
+  je as a,
+  Me as b,
   se as c,
   ke as d,
   $e as e,
   we as f,
-  j as g,
+  T as g,
   me as h,
   Ke as i,
-  je as j,
-  he as k,
-  ye as l,
+  Te as j,
+  te as k,
+  ne as l,
   _e as m,
   de as n,
-  pe as o,
-  te as p,
-  ne as q,
-  ie as r,
+  he as o,
+  ye as p,
+  ge as q,
+  oe as r,
   De as s,
-  Ce as t,
-  ve as u,
+  pe as t,
+  Ce as u,
   Ee as v,
-  Pe as w,
-  re as x,
-  ge as y,
+  ve as w,
+  Pe as x,
+  re as y,
   ue as z
 };