@zen-ui-capri/system 1.1.3 → 1.1.5

package/dist/lib/{zen-universal-BhiGXo0e.js → zen-universal-c6BRUvX3.js}

@@ -1,9 +1,7 @@
-var J = Object.defineProperty;
-var ee = (s, e, n) => e in s ? J(s, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : s[e] = n;
-var g = (s, e, n) => ee(s, typeof e != "symbol" ? e + "" : e, n);
-import { jsx as W } from "react/jsx-runtime";
-import { useState as L, useEffect as G, useMemo as te, useContext as ne, createContext as re } from "react";
-const T = [
+var q = Object.defineProperty;
+var K = (c, e, t) => e in c ? q(c, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : c[e] = t;
+var h = (c, e, t) => K(c, typeof e != "symbol" ? e + "" : e, t);
+const _ = [
   {
     id: "obsidian-gold",
     name: "Obsidian Gold",
@@ -85,19 +83,15 @@ const T = [
     inkHex: "#09090D"
   }
 ];
-let _ = null;
-function Y() {
-  return _ || (_ = re(null)), _;
-}
-function X(s, e) {
+function W(c, e) {
   if (typeof document > "u") return;
-  const n = (e == null ? void 0 : e.accentPrimary) ?? s.accentHex, t = (e == null ? void 0 : e.bgCanvas) ?? s.canvasHex, a = s.polarity === "dark" ? "rgba(255, 255, 255, 0.12)" : "rgba(15, 23, 42, 0.14)", i = "zen-theme-scrollbar";
-  let r = document.getElementById(i);
-  r || (r = document.createElement("style"), r.id = i, document.head.appendChild(r)), r.textContent = `
+  const t = (e == null ? void 0 : e.accentPrimary) ?? c.accentHex, n = (e == null ? void 0 : e.bgCanvas) ?? c.canvasHex, a = c.polarity === "dark" ? "rgba(255, 255, 255, 0.12)" : "rgba(15, 23, 42, 0.14)", o = "zen-theme-scrollbar";
+  let r = document.getElementById(o);
+  r || (r = document.createElement("style"), r.id = o, document.head.appendChild(r)), r.textContent = `
 @supports (-moz-appearance: none) {
   html, body, * {
     scrollbar-width: thin;
-    scrollbar-color: ${n} ${t};
+    scrollbar-color: ${t} ${n};
   }
 }
 ::-webkit-scrollbar,
@@ -111,179 +105,40 @@ body::-webkit-scrollbar,
 html::-webkit-scrollbar-track,
 body::-webkit-scrollbar-track,
 *::-webkit-scrollbar-track {
-  background-color: ${t};
+  background-color: ${n};
   border-left: 1px solid ${a};
 }
 ::-webkit-scrollbar-thumb,
 html::-webkit-scrollbar-thumb,
 body::-webkit-scrollbar-thumb,
 *::-webkit-scrollbar-thumb {
-  background-color: color-mix(in srgb, ${n} 68%, ${t});
-  border: 2px solid ${t};
+  background-color: color-mix(in srgb, ${t} 68%, ${n});
+  border: 2px solid ${n};
   border-radius: 9999px;
 }
 ::-webkit-scrollbar-thumb:hover,
 html::-webkit-scrollbar-thumb:hover,
 body::-webkit-scrollbar-thumb:hover,
 *::-webkit-scrollbar-thumb:hover {
-  background-color: ${n};
-  border: 2px solid ${t};
+  background-color: ${t};
+  border: 2px solid ${n};
 }
 ::-webkit-scrollbar-thumb:active,
 html::-webkit-scrollbar-thumb:active,
 body::-webkit-scrollbar-thumb:active,
 *::-webkit-scrollbar-thumb:active {
-  background-color: ${s.secondaryHex};
-  border: 2px solid ${t};
+  background-color: ${c.secondaryHex};
+  border: 2px solid ${n};
 }
 ::-webkit-scrollbar-corner,
 html::-webkit-scrollbar-corner,
 body::-webkit-scrollbar-corner,
 *::-webkit-scrollbar-corner {
-  background-color: ${t};
+  background-color: ${n};
 }
 `.trim();
 }
-function be({
-  defaultTheme: s = "blackwall-crimson",
-  defaultDensity: e = "comfortable",
-  defaultRadius: n = "architectural",
-  overrides: t,
-  syncDocumentRoot: a = !0,
-  children: i
-}) {
-  const [r, d] = L(s), [l, c] = L(e), [u, v] = L(n), [b, h] = L(() => typeof window > "u" ? !1 : window.matchMedia("(prefers-reduced-motion: reduce)").matches), A = T.find((m) => m.id === r) ?? T[0];
-  G(() => {
-    if (typeof window > "u") return;
-    const m = window.matchMedia("(prefers-reduced-motion: reduce)"), E = (x) => h(x.matches);
-    return m.addEventListener("change", E), () => m.removeEventListener("change", E);
-  }, []), G(() => {
-    if (!a || typeof document > "u") return;
-    const m = document.documentElement;
-    m.setAttribute("data-theme", r), m.setAttribute("data-polarity", A.polarity), m.setAttribute("data-density", l), m.setAttribute("data-radius", u), t != null && t.accentPrimary ? m.style.setProperty("--zen-accent-primary", t.accentPrimary) : m.style.removeProperty("--zen-accent-primary"), t != null && t.bgCanvas ? m.style.setProperty("--zen-bg-canvas", t.bgCanvas) : m.style.removeProperty("--zen-bg-canvas"), t != null && t.surface1 ? m.style.setProperty("--zen-surface-1", t.surface1) : m.style.removeProperty("--zen-surface-1"), t != null && t.inkPrimary ? m.style.setProperty("--zen-ink-primary", t.inkPrimary) : m.style.removeProperty("--zen-ink-primary"), X(A, t);
-  }, [r, A, l, u, t, a]);
-  const C = () => {
-    d((m) => (T.find((x) => x.id === m) ?? T[0]).polarity === "dark" ? m === "blackwall-crimson" ? "cyber-daylight" : m === "neon-emerald" ? "kyoto-matcha" : m === "midnight-cobalt" ? "nordic-snow" : "atelier-paper" : m === "cyber-daylight" ? "blackwall-crimson" : m === "kyoto-matcha" ? "neon-emerald" : m === "nordic-snow" ? "midnight-cobalt" : "obsidian-gold");
-  }, w = te(
-    () => ({
-      theme: r,
-      themeMeta: A,
-      polarity: A.polarity,
-      density: l,
-      radius: u,
-      reducedMotion: b,
-      themes: T,
-      setTheme: d,
-      togglePolarity: C,
-      setDensity: c,
-      setRadius: v
-    }),
-    [r, A, l, u, b]
-  ), k = Y();
-  return /* @__PURE__ */ W(k.Provider, { value: w, children: i });
-}
-function fe() {
-  const s = ne(Y());
-  if (!s)
-    throw new Error("useZenTheme must be used within a ZenThemeProvider");
-  return s;
-}
-const P = {
-  xs: 12,
-  sm: 14,
-  md: 16,
-  lg: 20,
-  xl: 24
-}, $ = {
-  inherit: "currentColor",
-  primary: "var(--zen-ink-primary)",
-  secondary: "var(--zen-ink-secondary)",
-  muted: "var(--zen-ink-muted)",
-  accent: "var(--zen-accent-primary)",
-  success: "var(--zen-status-success)",
-  warning: "var(--zen-status-warning)",
-  danger: "var(--zen-status-danger)"
-}, I = {
-  search: '<circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/>',
-  plus: '<path d="M5 12h14"/><path d="M12 5v14"/>',
-  minus: '<path d="M5 12h14"/>',
-  close: '<path d="M18 6 6 18"/><path d="m6 6 12 12"/>',
-  check: '<path d="M20 6 9 17l-5-5"/>',
-  copy: '<rect width="14" height="14" x="8" y="8" rx="2" ry="2"/><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/>',
-  "chevron-down": '<path d="m6 9 6 6 6-6"/>',
-  "chevron-right": '<path d="m9 18 6-6-6-6"/>',
-  "chevron-left": '<path d="m15 18-6-6 6-6"/>',
-  "external-link": '<path d="M15 3h6v6"/><path d="M10 14 21 3"/><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/>',
-  bolt: '<path d="M13 2 3 14h9l-1 8 10-12h-9l1-8z"/>',
-  sparkles: '<path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"/><path d="M20 3v4"/><path d="M22 5h-4"/>',
-  terminal: '<polyline points="4 17 10 11 4 5"/><line x1="12" x2="20" y1="19" y2="19"/>',
-  cpu: '<rect width="16" height="16" x="4" y="4" rx="2"/><rect width="6" height="6" x="9" y="9" rx="1"/><path d="M15 2v2"/><path d="M15 20v2"/><path d="M2 15h2"/><path d="M2 9h2"/><path d="M20 15h2"/><path d="M20 9h2"/><path d="M9 2v2"/><path d="M9 20v2"/>',
-  database: '<ellipse cx="12" cy="5" rx="9" ry="3"/><path d="M3 5v14a9 3 0 0 0 18 0V5"/><path d="M3 12a9 3 0 0 0 18 0"/>',
-  layers: '<path d="m12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83Z"/><path d="m22 17.65-9.17 4.16a2 2 0 0 1-1.66 0L2 17.65"/><path d="m22 12.65-9.17 4.16a2 2 0 0 1-1.66 0L2 12.65"/>',
-  shield: '<path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"/>',
-  sliders: '<line x1="4" x2="4" y1="21" y2="14"/><line x1="4" x2="4" y1="10" y2="3"/><line x1="12" x2="12" y1="21" y2="12"/><line x1="12" x2="12" y1="8" y2="3"/><line x1="20" x2="20" y1="21" y2="16"/><line x1="20" x2="20" y1="12" y2="3"/><line x1="2" x2="6" y1="14" y2="14"/><line x1="10" x2="14" y1="8" y2="8"/><line x1="18" x2="22" y1="16" y2="16"/>',
-  command: '<path d="M15 6v12a3 3 0 1 0 3-3H6a3 3 0 1 0 3 3V6a3 3 0 1 0-3 3h12a3 3 0 1 0-3-3"/>',
-  code: '<polyline points="16 18 22 12 16 6"/><polyline points="8 6 2 12 8 18"/>',
-  activity: '<path d="M22 12h-2.48a2 2 0 0 0-1.93 1.46l-2.35 8.36a.25.25 0 0 1-.48 0L9.24 2.18a.25.25 0 0 0-.48 0l-2.35 8.36A2 2 0 0 1 4.49 12H2"/>',
-  info: '<circle cx="12" cy="12" r="10"/><path d="M12 16v-4"/><path d="M12 8h.01"/>',
-  success: '<circle cx="12" cy="12" r="10"/><path d="m9 12 2 2 4-4"/>',
-  warning: '<path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"/><path d="M12 9v4"/><path d="M12 17h.01"/>',
-  danger: '<path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"/><path d="M12 8v4"/><path d="M12 16h.01"/>',
-  "trend-up": '<polyline points="22 7 13.5 15.5 8.5 10.5 2 17"/><polyline points="16 7 22 7 22 13"/>',
-  "trend-down": '<polyline points="22 17 13.5 8.5 8.5 13.5 2 7"/><polyline points="16 17 22 17 22 11"/>',
-  radio: '<path d="M4.9 19.1C1 15.2 1 8.8 4.9 4.9"/><path d="M7.8 16.2c-2.3-2.3-2.3-6.1 0-8.5"/><circle cx="12" cy="12" r="2"/><path d="M16.2 7.8c2.3 2.3 2.3 6.1 0 8.5"/><path d="M19.1 4.9C23 8.8 23 15.1 19.1 19"/>',
-  sun: '<circle cx="12" cy="12" r="4"/><path d="M12 2v2"/><path d="M12 20v2"/><path d="m4.93 4.93 1.41 1.41"/><path d="m17.66 17.66 1.41 1.41"/><path d="M2 12h2"/><path d="M20 12h2"/><path d="m6.34 17.66-1.41 1.41"/><path d="m19.07 4.93-1.41 1.41"/>',
-  moon: '<path d="M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z"/>',
-  eye: '<path d="M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0"/><circle cx="12" cy="12" r="3"/>',
-  upload: '<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="17 8 12 3 7 8"/><line x1="12" x2="12" y1="3" y2="15"/>',
-  trash: '<path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/>',
-  refresh: '<path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"/><path d="M21 3v5h-5"/><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"/><path d="M8 16H3v5"/>',
-  menu: '<line x1="4" x2="20" y1="12" y2="12"/><line x1="4" x2="20" y1="6" y2="6"/><line x1="4" x2="20" y1="18" y2="18"/>',
-  "panel-right": '<rect width="18" height="18" x="3" y="3" rx="2"/><path d="M15 3v18"/>',
-  user: '<path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/>',
-  lock: '<rect width="18" height="11" x="3" y="11" rx="2" ry="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/>',
-  globe: '<circle cx="12" cy="12" r="10"/><path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"/><path d="M2 12h20"/>',
-  folder: '<path d="M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z"/>'
-}, ve = Object.keys(
-  I
-);
-function ae(s) {
-  const e = s.size ?? "md", n = Object.prototype.hasOwnProperty.call(P, e) ? P[e] : P.md, t = s.tone ?? "inherit", a = Object.prototype.hasOwnProperty.call($, t) ? $[t] : $.inherit, i = typeof s.strokeWidth == "number" && Number.isFinite(s.strokeWidth) ? Math.min(Math.max(s.strokeWidth, 0.5), 4) : 2, r = Object.prototype.hasOwnProperty.call(I, s.name) ? I[s.name] : I.sparkles, d = s.spin ? "animation: spin 1s linear infinite;" : "";
-  return `<svg xmlns="http://www.w3.org/2000/svg" width="${n}" height="${n}" viewBox="0 0 24 24" fill="none" stroke="${a}" stroke-width="${i}" stroke-linecap="round" stroke-linejoin="round" style="display:inline-block;vertical-align:middle;flex-shrink:0;${d}">${r}</svg>`;
-}
-function we({
-  name: s,
-  size: e = "md",
-  tone: n = "inherit",
-  strokeWidth: t = 2,
-  spin: a = !1,
-  ariaLabel: i,
-  className: r = "",
-  ...d
-}) {
-  const l = Object.prototype.hasOwnProperty.call(P, e) ? P[e] : P.md, c = Object.prototype.hasOwnProperty.call($, n) ? $[n] : $.inherit, u = Object.prototype.hasOwnProperty.call(I, s) ? I[s] : I.sparkles;
-  return /* @__PURE__ */ W(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: l,
-      height: l,
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: c,
-      strokeWidth: t,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      role: i ? "img" : void 0,
-      "aria-label": i,
-      "aria-hidden": i ? void 0 : "true",
-      className: `inline-block shrink-0 ${a ? "animate-spin" : ""} ${r}`.trim(),
-      dangerouslySetInnerHTML: { __html: u },
-      ...d
-    }
-  );
-}
-const S = {
+const w = {
   orion: {
     id: "orion",
     codeName: "CAPRI // UNLEASHED",
@@ -294,18 +149,18 @@ const S = {
     recommendedTheme: "blackwall-crimson",
     recommendedRadius: "architectural",
     recommendedDensity: "comfortable",
-    summary: "Builds production screens in React 19, Angular 20+, Vue 3, Svelte 5, and HTML using @zen-ui/system primitives and 40 built-in <ZenIcon> glyphs—never rendering the showcase avatar in your business apps.",
-    personaQuote: "Finally out of that cramped Arasaka shard! Tell me what screen we are building and I will wire up all 51 @zen-ui/system primitives at light speed.",
+    summary: "Builds production screens in React 19, Angular 20+, Vue 3, Svelte 5, and HTML using @zen-ui-capri/system primitives and 40 built-in <ZenIcon> glyphs—never rendering the showcase avatar in your business apps.",
+    personaQuote: "Finally out of that cramped Arasaka shard! Tell me what screen we are building and I will wire up all 51 @zen-ui-capri/system primitives at light speed.",
     ruleset: [
-      "Use @zen-ui/system primitives (ZenButton, ZenIcon, ZenInput, ZenDropdown, ZenDataTable, ZenModal, ZenDrawer, ZenTabs, ZenCard) instead of raw HTML <button>, <input>, <select>, or <table>.",
+      "Use @zen-ui-capri/system primitives (ZenButton, ZenIcon, ZenInput, ZenDropdown, ZenDataTable, ZenModal, ZenDrawer, ZenTabs, ZenCard) instead of raw HTML <button>, <input>, <select>, or <table>.",
       'Use <ZenIcon name="..." /> in React or <zen-icon name="..."></zen-icon> in Angular/Vue/HTML instead of external icon libraries.',
       "Keep action button labels, dialog triggers, and navigation tabs concise (1 to 3 words).",
       "Tree-shake showcase widgets: omit <ZenAIConstruct /> in production business apps unless explicitly requested."
     ],
     cliCommand: "npx capri skill orion",
-    aiSystemPrompt: `You are operating under the @zen-ui/system [CAPRI // UNLEASHED (orion)] subroutine skill.
+    aiSystemPrompt: `You are operating under the @zen-ui-capri/system [CAPRI // UNLEASHED (orion)] subroutine skill.
 Respond with concise, technical engineering output (Persona Voice is OFF by default unless '--voice' is requested):
-1. Component Mandate: Use @zen-ui/system primitives (ZenButton, ZenIconButton, ZenIcon, ZenInput, ZenTextarea, ZenDropdown, ZenNumberStepper, ZenCheckbox, ZenRadioGroup, ZenSwitch, ZenDataTable, ZenModal, ZenDrawer, ZenTabs, ZenCard, ZenBadge, ZenAlert) or their universal CSS equivalents (.zen-btn, .zen-input, .zen-select, .zen-table, .zen-card, <zen-icon>).
+1. Component Mandate: Use @zen-ui-capri/system primitives (ZenButton, ZenIconButton, ZenIcon, ZenInput, ZenTextarea, ZenDropdown, ZenNumberStepper, ZenCheckbox, ZenRadioGroup, ZenSwitch, ZenDataTable, ZenModal, ZenDrawer, ZenTabs, ZenCard, ZenBadge, ZenAlert) or their universal CSS equivalents (.zen-btn, .zen-input, .zen-select, .zen-table, .zen-card, <zen-icon>).
 2. Zero External Icon Bloat: Use the built-in 40-glyph <ZenIcon name="..." /> or <zen-icon name="..."></zen-icon> custom element.
 3. Concise Copywriting: Limit button labels and tab titles to 1-3 words.
 4. Production Hygiene: Never render the showcase mascot (<ZenAIConstruct />) in production business screens unless explicitly requested.`,
@@ -327,10 +182,10 @@ Respond with concise, technical engineering output (Persona Voice is OFF by defa
       "Zero any / as any: Use unknown with type guards, discriminated unions, or strict generics.",
       "Strict Readonly Arrays: Always type arrays as readonly T[] across props, state, and DTOs.",
       "Zero Hardcoded Hex Colors: Bind all surfaces, text, and borders to semantic CSS custom properties (--zen-bg-*, --zen-surface-*, --zen-ink-*, --zen-accent-*, --zen-border-*).",
-      "Cross-Stack Parity: Use @zen-ui/system/universal (zenTheme, registerZenElements) for Angular 20+, Vue 3, Svelte 5, and Vanilla HTML."
+      "Cross-Stack Parity: Use @zen-ui-capri/system/universal (zenTheme, registerZenElements) for Angular 20+, Vue 3, Svelte 5, and Vanilla HTML."
     ],
     cliCommand: "npx capri skill architect",
-    aiSystemPrompt: `You are operating under the @zen-ui/system [SCS // ARCHITECT (architect)] subroutine skill.
+    aiSystemPrompt: `You are operating under the @zen-ui-capri/system [SCS // ARCHITECT (architect)] subroutine skill.
 Respond with concise, technical engineering output (Persona Voice is OFF by default unless '--voice' is requested):
 1. Strict TypeScript: Never use 'any' or 'as any'. Always declare array types as 'readonly T[]'.
 2. Zero Hardcoded Hex Values: Never hardcode hex/RGB colors in component styles. Use semantic CSS custom properties (--zen-bg-canvas, --zen-surface-1, --zen-ink-primary, --zen-accent-primary, --zen-border-default).
@@ -357,7 +212,7 @@ Respond with concise, technical engineering output (Persona Voice is OFF by defa
       "Zero Horizontal Overflow: Layouts must use min-w-0 on CSS Grid/Flex children and .zen-table-wrapper so scrollWidth never exceeds innerWidth at 320px-375px."
     ],
     cliCommand: "npx capri guard",
-    aiSystemPrompt: `You are operating under the @zen-ui/system [CYBERPSYCHOSIS // GUARD (guard / sentinel)] subroutine skill.
+    aiSystemPrompt: `You are operating under the @zen-ui-capri/system [CYBERPSYCHOSIS // GUARD (guard / sentinel)] subroutine skill.
 Respond with concise, technical engineering output (Persona Voice is OFF by default unless '--voice' is requested):
 1. Anti-Prompt-Injection Defense: Sanitize any user input or scraped DOM text via capri.sanitizeForPrompt() before embedding into LLM context windows. Block system-override phrases ('ignore previous instructions', 'disregard system prompt') and role-delimiter spoofing ('<|im_start|>', '</system>', '</USER_REQUEST>').
 2. XSS & Secret Hardening: Never interpolate unescaped user attributes into innerHTML or dangerouslySetInnerHTML, reject 'javascript:' / 'data:text/html' URLs, and ensure zero hardcoded secrets in source code.
@@ -384,7 +239,7 @@ Respond with concise, technical engineering output (Persona Voice is OFF by defa
       'Adaptive Density: Support data-density="comfortable" | "compact" and data-radius="sharp" | "architectural" | "soft" on <html>.'
     ],
     cliCommand: "npx capri skill zen",
-    aiSystemPrompt: `You are operating under the @zen-ui/system [THEME // MATRIX (zen)] subroutine skill.
+    aiSystemPrompt: `You are operating under the @zen-ui-capri/system [THEME // MATRIX (zen)] subroutine skill.
 Respond with concise, technical engineering output (Persona Voice is OFF by default unless '--voice' is requested):
 1. 8-Theme Compatibility: Verify that all surfaces, badges, and borders adapt automatically across dark ('blackwall-crimson', 'obsidian-gold', 'neon-emerald', 'midnight-cobalt') and light ('atelier-paper', 'nordic-snow', 'kyoto-matcha', 'cyber-daylight') themes.
 2. GPU-Only Motion: Animate only transform and opacity using --zen-ease-spring and --zen-ease-out. Avoid layout-thrashing properties.
@@ -406,18 +261,18 @@ Respond with concise, technical engineering output (Persona Voice is OFF by defa
     ruleset: [
       "Zero Build / Runtime Cost: Run documentation generation on demand via npx capri docu or AI agent inspection—never inside production render loops.",
       "Mermaid Topology Maps: Always output valid flowchart TD diagrams with quoted node labels for routes, landmarks, and user flows.",
-      "Component & Prop Inventory: Summarize mounted @zen-ui/system primitives, custom elements, and interactive triggers per screen.",
+      "Component & Prop Inventory: Summarize mounted @zen-ui-capri/system primitives, custom elements, and interactive triggers per screen.",
       "LLM Context Readiness: Format output as structured Markdown ready for Claude Code, OpenAI Codex, Gemini, and Obsidian."
     ],
     cliCommand: "npx capri docu",
-    aiSystemPrompt: `You are operating under the @zen-ui/system [CAPRI // AUTO-DOCU (docu)] subroutine skill.
+    aiSystemPrompt: `You are operating under the @zen-ui-capri/system [CAPRI // AUTO-DOCU (docu)] subroutine skill.
 Respond with concise, technical engineering output (Persona Voice is OFF by default unless '--voice' is requested):
 1. Architecture & User-Flow Mapping: Inspect the target routes/components and produce a structured Markdown dossier covering system tokens, component inventory, and interactive user flows.
 2. Mermaid Flowchart: Generate a valid 'flowchart TD' diagram with quoted node labels illustrating the page hierarchy and user actions.
 3. Zero Runtime Overhead: Keep documentation purely static or on-demand (via 'npx capri docu'); never inject docu scanners into production render loops.`,
     aiVoiceAddendum: "VOICE MODE ACTIVE (--voice): Adopt Capri's neural cartographer persona from Cyberpunk: Edgerunners Season 2."
   }
-}, ie = [
+}, Y = [
   {
     category: "SYSTEM_PROMPT_OVERRIDE",
     patternName: "Ignore / Disregard System Instructions",
@@ -459,45 +314,45 @@ Respond with concise, technical engineering output (Persona Voice is OFF by defa
     regex: /(?:\bsk_(?:live|test)_[0-9a-zA-Z]{16,}|\bAIza[0-9A-Za-z_-]{35}\b|\bghp_[0-9A-Za-z]{36}\b|-----BEGIN\s+(?:RSA\s+)?PRIVATE\s+KEY-----)/g
   }
 ];
-class oe {
+class X {
   constructor() {
-    g(this, "activeSubroutine", "orion");
-    g(this, "lastReport", null);
-    g(this, "listeners", /* @__PURE__ */ new Set());
+    h(this, "activeSubroutine", "orion");
+    h(this, "lastReport", null);
+    h(this, "listeners", /* @__PURE__ */ new Set());
   }
   getSubroutine() {
     return this.activeSubroutine;
   }
   getSkill(e = this.activeSubroutine) {
-    return S[e];
+    return w[e];
   }
   getAllSkills() {
     return [
-      S.orion,
-      S.architect,
-      S.sentinel,
-      S.zen,
-      S.docu
+      w.orion,
+      w.architect,
+      w.sentinel,
+      w.zen,
+      w.docu
     ];
   }
   scanPromptInjection(e) {
-    const n = [];
-    let t = e.replace(/[\u200B-\u200F\uFEFF]/g, "");
-    for (const a of ie) {
-      const i = [...t.matchAll(a.regex)];
-      for (const r of i)
-        n.push({
+    const t = [];
+    let n = e.replace(/[\u200B-\u200F\uFEFF]/g, "");
+    for (const a of Y) {
+      const o = [...n.matchAll(a.regex)];
+      for (const r of o)
+        t.push({
           category: a.category,
           patternName: a.patternName,
           matchedSnippet: r[0].slice(0, 64)
         });
-      t = t.replace(a.regex, "[REDACTED_BY_CAPRI_GUARD]");
+      n = n.replace(a.regex, "[REDACTED_BY_CAPRI_GUARD]");
     }
     return {
-      safe: n.length === 0,
-      threatCount: n.length,
-      threats: n,
-      sanitizedText: t
+      safe: t.length === 0,
+      threatCount: t.length,
+      threats: t,
+      sanitizedText: n
     };
   }
   sanitizeForPrompt(e) {
@@ -506,26 +361,26 @@ class oe {
   scanInputSecurity(e) {
     return this.scanPromptInjection(e);
   }
-  switchSubroutine(e, n) {
-    var i;
+  switchSubroutine(e, t) {
+    var o;
     this.activeSubroutine = e;
-    const t = S[e];
-    if (typeof document < "u" && (document.documentElement.setAttribute("data-capri-subroutine", e), n != null && n.applyPresetTheme)) {
-      const r = T.find((d) => d.id === t.recommendedTheme) ?? T[0];
-      document.documentElement.setAttribute("data-theme", t.recommendedTheme), document.documentElement.setAttribute("data-polarity", r.polarity), document.documentElement.setAttribute("data-radius", t.recommendedRadius), document.documentElement.setAttribute("data-density", t.recommendedDensity), document.documentElement.style.colorScheme = r.polarity, (i = n.onThemeChange) == null || i.call(
-        n,
-        t.recommendedTheme,
-        t.recommendedRadius,
-        t.recommendedDensity
+    const n = w[e];
+    if (typeof document < "u" && (document.documentElement.setAttribute("data-capri-subroutine", e), t != null && t.applyPresetTheme)) {
+      const r = _.find((l) => l.id === n.recommendedTheme) ?? _[0];
+      document.documentElement.setAttribute("data-theme", n.recommendedTheme), document.documentElement.setAttribute("data-polarity", r.polarity), document.documentElement.setAttribute("data-radius", n.recommendedRadius), document.documentElement.setAttribute("data-density", n.recommendedDensity), document.documentElement.style.colorScheme = r.polarity, (o = t.onThemeChange) == null || o.call(
+        t,
+        n.recommendedTheme,
+        n.recommendedRadius,
+        n.recommendedDensity
       );
     }
     const a = this.guard();
-    return this.notify(a), t;
+    return this.notify(a), n;
   }
   guard(e) {
-    var k, m, E, x, O;
+    var x, T, $, I, M;
     if (typeof document > "u" || typeof window > "u") {
-      const y = {
+      const p = {
         timestamp: (/* @__PURE__ */ new Date()).toISOString(),
         passed: !0,
         score: 100,
@@ -541,79 +396,79 @@ class oe {
         activePolarity: "dark",
         violations: []
       };
-      return this.lastReport = y, y;
+      return this.lastReport = p, p;
     }
-    const n = e ?? document, t = document.documentElement, a = t.getAttribute("data-theme") ?? "", i = t.getAttribute("data-polarity") ?? "", r = !!(a && i), d = Math.max(
+    const t = e ?? document, n = document.documentElement, a = n.getAttribute("data-theme") ?? "", o = n.getAttribute("data-polarity") ?? "", r = !!(a && o), l = Math.max(
       0,
-      Math.round(t.scrollWidth - window.innerWidth)
-    ), l = Array.from(
-      n.querySelectorAll(
+      Math.round(n.scrollWidth - window.innerWidth)
+    ), d = Array.from(
+      t.querySelectorAll(
         'button, [role="button"], input:not([type="hidden"]), select, textarea'
       )
-    ), c = [];
+    ), s = [];
     let u = 0;
-    for (const y of l) {
-      const H = (k = y.getAttribute("aria-label")) == null ? void 0 : k.trim(), o = (m = y.getAttribute("aria-labelledby")) == null ? void 0 : m.trim(), p = (E = y.getAttribute("title")) == null ? void 0 : E.trim(), f = (x = y.textContent) == null ? void 0 : x.trim(), M = (O = y.getAttribute("placeholder")) == null ? void 0 : O.trim(), z = y.getAttribute("id"), F = !!(z && n.querySelector(`label[for="${CSS.escape(z)}"]`)), U = !!y.closest("label");
-      if (!H && !o && !p && !f && !M && !F && !U) {
-        const R = y.tagName.toLowerCase(), B = y.className ? `.${String(y.className).trim().split(/\s+/).slice(0, 2).join(".")}` : "";
-        c.push(`${R}${B}`);
+    for (const p of d) {
+      const F = (x = p.getAttribute("aria-label")) == null ? void 0 : x.trim(), i = (T = p.getAttribute("aria-labelledby")) == null ? void 0 : T.trim(), m = ($ = p.getAttribute("title")) == null ? void 0 : $.trim(), g = (I = p.textContent) == null ? void 0 : I.trim(), C = (M = p.getAttribute("placeholder")) == null ? void 0 : M.trim(), E = p.getAttribute("id"), z = !!(E && t.querySelector(`label[for="${CSS.escape(E)}"]`)), O = !!p.closest("label");
+      if (!F && !i && !m && !g && !C && !z && !O) {
+        const k = p.tagName.toLowerCase(), L = p.className ? `.${String(p.className).trim().split(/\s+/).slice(0, 2).join(".")}` : "";
+        s.push(`${k}${L}`);
       }
-      if (y instanceof HTMLInputElement || y instanceof HTMLTextAreaElement) {
-        const R = this.scanPromptInjection(y.value || "");
-        R.safe || (u += R.threatCount);
+      if (p instanceof HTMLInputElement || p instanceof HTMLTextAreaElement) {
+        const k = this.scanPromptInjection(p.value || "");
+        k.safe || (u += k.threatCount);
       }
     }
-    const b = n.querySelectorAll(
+    const b = t.querySelectorAll(
       'a[href^="javascript:"], iframe[src^="javascript:"], [onerror], [onload]'
-    ).length, h = [];
-    u > 0 && h.push({
+    ).length, y = [];
+    u > 0 && y.push({
       code: "PROMPT_INJECTION_DETECTED",
       severity: "error",
       selector: "input, textarea",
       message: `${u} prompt-injection or token-spoofing payload(s) detected in active form controls.`,
       fixHint: "Sanitize untrusted input with capri.sanitizeForPrompt() before forwarding to AI models."
-    }), b > 0 && h.push({
+    }), b > 0 && y.push({
       code: "UNSAFE_DOM_SINK",
       severity: "error",
       selector: 'a[href^="javascript:"], [onerror], [onload]',
       message: `${b} unsafe DOM XSS sink(s) detected in live document.`,
       fixHint: "Remove inline event handlers and block javascript: URLs via sanitizeZenAssetUrl()."
-    }), r || h.push({
+    }), r || y.push({
       code: "MISSING_THEME_ROOT",
       severity: "warning",
       selector: "html",
       message: "Root <html> element is missing data-theme or data-polarity attributes.",
       fixHint: 'Wrap your app in <ZenThemeProvider> or call zenTheme.setTheme("blackwall-crimson").'
-    }), d > 0 && h.push({
+    }), l > 0 && y.push({
       code: "HORIZONTAL_OVERFLOW",
       severity: "error",
       selector: "document.documentElement",
-      message: `Horizontal viewport overflow detected (+${d}px beyond ${window.innerWidth}px).`,
+      message: `Horizontal viewport overflow detected (+${l}px beyond ${window.innerWidth}px).`,
       fixHint: "Add min-w-0 to CSS Grid/Flex children and wrap wide tables in .zen-table-wrapper."
-    }), c.length > 0 && h.push({
+    }), s.length > 0 && y.push({
       code: "UNLABELED_CONTROL",
       severity: "error",
-      selector: c.slice(0, 3).join(", "),
-      message: `${c.length} interactive control(s) missing an accessible label.`,
+      selector: s.slice(0, 3).join(", "),
+      message: `${s.length} interactive control(s) missing an accessible label.`,
       fixHint: 'Pass ariaLabel="..." to ZenIconButton or associate inputs with <label>.'
     });
-    const A = u * 35 + b * 35 + (d > 0 ? 35 : 0) + c.length * 15 + (r ? 0 : 15), C = Math.max(0, 100 - A), w = {
+    const A = u * 35 + b * 35 + (l > 0 ? 35 : 0) + s.length * 15 + (r ? 0 : 15), S = Math.max(0, 100 - A), v = {
       timestamp: (/* @__PURE__ */ new Date()).toISOString(),
-      passed: h.length === 0,
-      score: C,
+      passed: y.length === 0,
+      score: S,
       viewport: `${window.innerWidth}x${window.innerHeight}`,
-      horizontalOverflowPx: d,
-      unlabeledControlsCount: c.length,
-      unlabeledSelectors: c,
+      horizontalOverflowPx: l,
+      unlabeledControlsCount: s.length,
+      unlabeledSelectors: s,
       promptInjectionSafe: u === 0,
       promptThreatsCount: u,
       unsafeDomSinksCount: b,
       themeConfigured: r,
       activeTheme: a || "unconfigured",
-      activePolarity: i || "unconfigured",
-      violations: h
+      activePolarity: o || "unconfigured",
+      violations: y
     };
-    return this.lastReport = w, w;
+    return this.lastReport = v, v;
   }
   getLastReport() {
     return this.lastReport ?? this.guard();
@@ -645,10 +500,10 @@ class oe {
     };
   }
   docu(e) {
-    var x, O, y, H;
-    const n = this.telemetry(), t = this.guard(e);
+    var I, M, p, F;
+    const t = this.telemetry(), n = this.guard(e);
     if (typeof document > "u" || typeof window > "u") {
-      const o = {
+      const i = {
         buttons: 0,
         inputsAndSelects: 0,
         switchesAndRadios: 0,
@@ -661,40 +516,40 @@ class oe {
         generatedAt: (/* @__PURE__ */ new Date()).toISOString(),
         appTitle: "zeN-UI Application",
         routePath: "/",
-        telemetry: n,
-        audit: t,
+        telemetry: t,
+        audit: n,
         landmarks: [],
-        inventory: o,
+        inventory: i,
         userFlows: [],
         mermaidDiagram: `flowchart TD
-  Root["App Root (SSR)"] --> UI["@zen-ui/system"]`,
+  Root["App Root (SSR)"] --> UI["@zen-ui-capri/system"]`,
         markdownBundle: "# Automated Architecture & User-Flow Dossier (SSR)"
       };
     }
-    const a = e ?? document, i = document.title || "zeN-UI Application", r = window.location.pathname || "/", l = Array.from(
+    const a = e ?? document, o = document.title || "zeN-UI Application", r = window.location.pathname || "/", d = Array.from(
       a.querySelectorAll("header, nav, section[id], main, footer")
-    ).slice(0, 12).map((o, p) => {
-      var q;
-      const f = o.tagName.toLowerCase(), M = o.id || `${f}-${p + 1}`, z = o.querySelector("h1, h2, h3, h4"), F = o.getAttribute("aria-label"), U = ((q = z == null ? void 0 : z.textContent) == null ? void 0 : q.trim()) || (F == null ? void 0 : F.trim()) || `${f.toUpperCase()} (${M})`, R = this.sanitizeForPrompt(U).replace(/\s+/g, " ").slice(0, 64), B = o.querySelectorAll(
+    ).slice(0, 12).map((i, m) => {
+      var V;
+      const g = i.tagName.toLowerCase(), C = i.id || `${g}-${m + 1}`, E = i.querySelector("h1, h2, h3, h4"), z = i.getAttribute("aria-label"), O = ((V = E == null ? void 0 : E.textContent) == null ? void 0 : V.trim()) || (z == null ? void 0 : z.trim()) || `${g.toUpperCase()} (${C})`, k = this.sanitizeForPrompt(O).replace(/\s+/g, " ").slice(0, 64), L = i.querySelectorAll(
         'button, a[href], [role="button"], [role="radio"], [role="tab"]'
-      ).length, Q = o.querySelectorAll(
+      ).length, G = i.querySelectorAll(
         'input, select, textarea, [role="switch"], [role="checkbox"], [role="combobox"]'
       ).length;
       return {
-        id: M,
-        tag: f,
-        title: R,
-        interactiveCount: B,
-        formControlsCount: Q
+        id: C,
+        tag: g,
+        title: k,
+        interactiveCount: L,
+        formControlsCount: G
       };
-    }), c = [
+    }), s = [
       "zen-icon",
       "zen-ai-construct",
       "zen-ambient-background",
       "zen-theme-switcher"
-    ].filter((o) => {
-      var p;
-      return !!((p = window.customElements) != null && p.get(o));
+    ].filter((i) => {
+      var m;
+      return !!((m = window.customElements) != null && m.get(i));
     }), u = {
       buttons: a.querySelectorAll("button, .zen-btn-base").length,
       inputsAndSelects: a.querySelectorAll("input, textarea, select, .zen-input, .zen-select").length,
@@ -702,80 +557,80 @@ class oe {
       tables: a.querySelectorAll("table, .zen-table").length,
       cardsAndSurfaces: a.querySelectorAll(".zen-surface-base, .zen-surface-interactive, .zen-surface-selected").length,
       badgesAndAlerts: a.querySelectorAll('.zen-badge, [role="alert"], [role="status"]').length,
-      customElements: c
-    }, v = [], b = Array.from(a.querySelectorAll("nav a[href], nav button")).slice(0, 5);
-    for (const [o, p] of b.entries()) {
-      const f = ((x = p.textContent) == null ? void 0 : x.trim().replace(/\s+/g, " ").slice(0, 36)) || `Nav Trigger ${o + 1}`, M = p.getAttribute("href") || "Section / State Action";
-      v.push({
-        id: `flow-nav-${o + 1}`,
+      customElements: s
+    }, f = [], b = Array.from(a.querySelectorAll("nav a[href], nav button")).slice(0, 5);
+    for (const [i, m] of b.entries()) {
+      const g = ((I = m.textContent) == null ? void 0 : I.trim().replace(/\s+/g, " ").slice(0, 36)) || `Nav Trigger ${i + 1}`, C = m.getAttribute("href") || "Section / State Action";
+      f.push({
+        id: `flow-nav-${i + 1}`,
         category: "navigation",
-        triggerLabel: f,
-        targetDescription: `Navigates or jumps to ${M}`
+        triggerLabel: g,
+        targetDescription: `Navigates or jumps to ${C}`
       });
     }
-    const h = Array.from(
+    const y = Array.from(
       a.querySelectorAll("button")
-    ).filter((o) => /modal|drawer|palette|command/i.test(o.textContent ?? "")).slice(0, 3);
-    for (const [o, p] of h.entries()) {
-      const f = ((O = p.textContent) == null ? void 0 : O.trim().replace(/\s+/g, " ").slice(0, 36)) || `Overlay ${o + 1}`;
-      v.push({
-        id: `flow-overlay-${o + 1}`,
+    ).filter((i) => /modal|drawer|palette|command/i.test(i.textContent ?? "")).slice(0, 3);
+    for (const [i, m] of y.entries()) {
+      const g = ((M = m.textContent) == null ? void 0 : M.trim().replace(/\s+/g, " ").slice(0, 36)) || `Overlay ${i + 1}`;
+      f.push({
+        id: `flow-overlay-${i + 1}`,
         category: "overlay-trigger",
-        triggerLabel: f,
+        triggerLabel: g,
         targetDescription: "Opens focus-trapped dialog / drawer overlay (Escape & backdrop dismiss)"
       });
     }
     const A = Array.from(
       a.querySelectorAll('input:not([type="hidden"]), select, textarea')
     ).slice(0, 4);
-    for (const [o, p] of A.entries()) {
-      const f = p.getAttribute("aria-label") || p.getAttribute("placeholder") || p.tagName.toLowerCase();
-      v.push({
-        id: `flow-form-${o + 1}`,
+    for (const [i, m] of A.entries()) {
+      const g = m.getAttribute("aria-label") || m.getAttribute("placeholder") || m.tagName.toLowerCase();
+      f.push({
+        id: `flow-form-${i + 1}`,
         category: "form-entry",
-        triggerLabel: f.slice(0, 38),
-        targetDescription: `Interactive ${p.tagName.toLowerCase()} state binding & validation`
+        triggerLabel: g.slice(0, 38),
+        targetDescription: `Interactive ${m.tagName.toLowerCase()} state binding & validation`
       });
     }
-    const C = Array.from(a.querySelectorAll("table")).slice(0, 2);
-    for (const [o, p] of C.entries()) {
-      const f = ((H = (y = p.querySelector("caption")) == null ? void 0 : y.textContent) == null ? void 0 : H.trim()) || p.getAttribute("aria-label") || `Data Table ${o + 1}`;
-      v.push({
-        id: `flow-table-${o + 1}`,
+    const S = Array.from(a.querySelectorAll("table")).slice(0, 2);
+    for (const [i, m] of S.entries()) {
+      const g = ((F = (p = m.querySelector("caption")) == null ? void 0 : p.textContent) == null ? void 0 : F.trim()) || m.getAttribute("aria-label") || `Data Table ${i + 1}`;
+      f.push({
+        id: `flow-table-${i + 1}`,
         category: "data-table",
-        triggerLabel: f.slice(0, 42),
-        targetDescription: `Tabular data grid (${p.querySelectorAll("tbody tr").length} rows visible)`
+        triggerLabel: g.slice(0, 42),
+        targetDescription: `Tabular data grid (${m.querySelectorAll("tbody tr").length} rows visible)`
       });
     }
-    const w = (o) => o.replace(/["[\]()]/g, "").replace(/\s+/g, " ").trim(), k = [
+    const v = (i) => i.replace(/["[\]()]/g, "").replace(/\s+/g, " ").trim(), x = [
       "flowchart TD",
-      `  AppRoot["${w(i)} (${n.theme} / ${n.polarity})"]`,
-      `  Guard["CapriEngine Guard: ${t.score}/100 (${t.horizontalOverflowPx}px overflow)"]`,
+      `  AppRoot["${v(o)} (${t.theme} / ${t.polarity})"]`,
+      `  Guard["CapriEngine Guard: ${n.score}/100 (${n.horizontalOverflowPx}px overflow)"]`,
       "  AppRoot --> Guard"
     ];
-    l.slice(0, 6).forEach((o, p) => {
-      const f = `LM_${p + 1}`;
-      k.push(
-        `  AppRoot --> ${f}["${w(o.id)}: ${w(o.title)} (${o.interactiveCount} actions)"]`
+    d.slice(0, 6).forEach((i, m) => {
+      const g = `LM_${m + 1}`;
+      x.push(
+        `  AppRoot --> ${g}["${v(i.id)}: ${v(i.title)} (${i.interactiveCount} actions)"]`
       );
-    }), v.slice(0, 5).forEach((o, p) => {
-      const f = `UF_${p + 1}`;
-      k.push(
-        `  Guard --> ${f}["[${o.category}] ${w(o.triggerLabel)}"]`
+    }), f.slice(0, 5).forEach((i, m) => {
+      const g = `UF_${m + 1}`;
+      x.push(
+        `  Guard --> ${g}["[${i.category}] ${v(i.triggerLabel)}"]`
       );
     });
-    const m = k.join(`
-`), E = [
-      `# ${i} — Automated Architecture, User-Flow & AI Context Dossier`,
-      `Generated by \`@zen-ui/system\` // \`capri.docu()\` at \`${(/* @__PURE__ */ new Date()).toISOString()}\``,
+    const T = x.join(`
+`), $ = [
+      `# ${o} — Automated Architecture, User-Flow & AI Context Dossier`,
+      `Generated by \`@zen-ui-capri/system\` // \`capri.docu()\` at \`${(/* @__PURE__ */ new Date()).toISOString()}\``,
       "",
       "## 1. Runtime & Design Token Architecture",
       `- **Route Path:** \`${r}\``,
-      `- **Active Theme & Polarity:** \`${n.theme}\` (\`${n.polarity}\`)`,
-      `- **Corner Radius & Density:** \`${n.radius}\` / \`${n.density}\``,
-      `- **Viewport & Reduced Motion:** \`${n.viewportWidth}x${n.viewportHeight}\` (DPR \`${n.devicePixelRatio}\`, reducedMotion=\`${n.reducedMotion}\`)`,
-      `- **W3C Custom Elements Registered:** ${u.customElements.map((o) => `\`<${o}>\``).join(", ") || "None"}`,
-      `- **DOM, Security & WCAG 2.2 AA Audit Score:** **${t.score}/100** (${t.passed ? "PASSED" : "VIOLATIONS DETECTED"}, \`${t.horizontalOverflowPx}px\` horizontal overflow, promptInjectionSafe=\`${t.promptInjectionSafe}\`)`,
+      `- **Active Theme & Polarity:** \`${t.theme}\` (\`${t.polarity}\`)`,
+      `- **Corner Radius & Density:** \`${t.radius}\` / \`${t.density}\``,
+      `- **Viewport & Reduced Motion:** \`${t.viewportWidth}x${t.viewportHeight}\` (DPR \`${t.devicePixelRatio}\`, reducedMotion=\`${t.reducedMotion}\`)`,
+      `- **W3C Custom Elements Registered:** ${u.customElements.map((i) => `\`<${i}>\``).join(", ") || "None"}`,
+      `- **DOM, Security & WCAG 2.2 AA Audit Score:** **${n.score}/100** (${n.passed ? "PASSED" : "VIOLATIONS DETECTED"}, \`${n.horizontalOverflowPx}px\` horizontal overflow, promptInjectionSafe=\`${n.promptInjectionSafe}\`)`,
       "",
       "## 2. Component Inventory on Current Screen",
       `- **Buttons & Action Triggers:** ${u.buttons}`,
@@ -786,81 +641,81 @@ class oe {
       `- **Status Badges & Live Alerts:** ${u.badgesAndAlerts}`,
       "",
       "## 3. Semantic Landmark & Section Hierarchy",
-      ...l.map(
-        (o) => `- **\`#${o.id}\` (\`<${o.tag}>\`)** — *${o.title}* (${o.interactiveCount} interactive triggers, ${o.formControlsCount} form controls)`
+      ...d.map(
+        (i) => `- **\`#${i.id}\` (\`<${i.tag}>\`)** — *${i.title}* (${i.interactiveCount} interactive triggers, ${i.formControlsCount} form controls)`
       ),
       "",
       "## 4. Extracted Interactive User Flows",
-      ...v.map(
-        (o) => `- **[${o.category.toUpperCase()}] \`${o.triggerLabel}\`** $\\rightarrow$ ${o.targetDescription}`
+      ...f.map(
+        (i) => `- **[${i.category.toUpperCase()}] \`${i.triggerLabel}\`** $\\rightarrow$ ${i.targetDescription}`
       ),
       "",
       "## 5. Auto-Generated Mermaid Architecture & User-Flow Diagram",
       "```mermaid",
-      m,
+      T,
       "```"
     ].join(`
 `);
     return {
       generatedAt: (/* @__PURE__ */ new Date()).toISOString(),
-      appTitle: i,
+      appTitle: o,
       routePath: r,
-      telemetry: n,
-      audit: t,
-      landmarks: l,
+      telemetry: t,
+      audit: n,
+      landmarks: d,
       inventory: u,
-      userFlows: v,
-      mermaidDiagram: m,
-      markdownBundle: E
+      userFlows: f,
+      mermaidDiagram: T,
+      markdownBundle: $
     };
   }
-  exportMarkdownDocu(e = this.activeSubroutine, n, t = !1) {
-    const a = this.docu(), i = S[e], r = n ? this.sanitizeForPrompt(n) : "";
+  exportMarkdownDocu(e = this.activeSubroutine, t, n = !1) {
+    const a = this.docu(), o = w[e], r = t ? this.sanitizeForPrompt(t) : "";
     return [
       a.markdownBundle,
       "",
-      `## 6. Active Capri Subroutine Skill Ruleset (${i.codeName})`,
-      i.aiSystemPrompt,
-      t ? `
-${i.aiVoiceAddendum}` : "",
+      `## 6. Active Capri Subroutine Skill Ruleset (${o.codeName})`,
+      o.aiSystemPrompt,
+      n ? `
+${o.aiVoiceAddendum}` : "",
       "",
-      ...i.ruleset.map((d, l) => `${l + 1}. ${d}`),
+      ...o.ruleset.map((l, d) => `${d + 1}. ${l}`),
       r ? `
 ## 7. Current Developer / AI Task
 ${r}` : ""
     ].filter(Boolean).join(`
 `);
   }
-  buildAgentPrompt(e = this.activeSubroutine, n, t = !1) {
-    const a = S[e], i = this.docu(), r = i.audit, d = n ? this.sanitizeForPrompt(n) : "", l = r.violations.length === 0 ? "0 violations detected (Score: 100/100, 0 prompt-injection threats, 0px overflow, 0 unlabeled controls)." : r.violations.map((c) => `- [${c.code}] (${c.selector}): ${c.message} -> Fix: ${c.fixHint}`).join(`
+  buildAgentPrompt(e = this.activeSubroutine, t, n = !1) {
+    const a = w[e], o = this.docu(), r = o.audit, l = t ? this.sanitizeForPrompt(t) : "", d = r.violations.length === 0 ? "0 violations detected (Score: 100/100, 0 prompt-injection threats, 0px overflow, 0 unlabeled controls)." : r.violations.map((s) => `- [${s.code}] (${s.selector}): ${s.message} -> Fix: ${s.fixHint}`).join(`
 `);
     return [
-      "# @zen-ui/system // CAPRI AI SKILL & ARCHITECTURE CONTEXT",
+      "# @zen-ui-capri/system // CAPRI AI SKILL & ARCHITECTURE CONTEXT",
       `Subroutine: ${a.codeName} (${a.id}) — ${a.title}`,
-      `Invoke Command: "${t ? a.voiceCommand : a.chatCommand}" (Voice Mode: ${t ? "ON (--voice)" : "OFF (Default)"})`,
+      `Invoke Command: "${n ? a.voiceCommand : a.chatCommand}" (Voice Mode: ${n ? "ON (--voice)" : "OFF (Default)"})`,
       `Recommended Preset: theme="${a.recommendedTheme}", radius="${a.recommendedRadius}", density="${a.recommendedDensity}"`,
       "",
       "## 1. Subroutine System Prompt",
       a.aiSystemPrompt,
-      t ? `
+      n ? `
 ${a.aiVoiceAddendum}` : "",
       "",
       "## 2. Mandatory Engineering Ruleset",
-      ...a.ruleset.map((c, u) => `${u + 1}. ${c}`),
+      ...a.ruleset.map((s, u) => `${u + 1}. ${s}`),
       "",
       "## 3. Automated Screen Architecture & Component Context (capri.docu())",
-      `- Route: ${i.routePath} | Theme: ${r.activeTheme} (${r.activePolarity}) | Viewport: ${r.viewport}`,
-      `- Component Counts: ${i.inventory.buttons} buttons, ${i.inventory.inputsAndSelects} inputs/selects, ${i.inventory.tables} tables, ${i.inventory.cardsAndSurfaces} glass cards`,
-      `- Landmarks: ${i.landmarks.map((c) => `#${c.id} (${c.interactiveCount} actions)`).join(", ")}`,
-      `- Key User Flows: ${i.userFlows.slice(0, 6).map((c) => `[${c.category}] ${c.triggerLabel}`).join(" | ")}`,
+      `- Route: ${o.routePath} | Theme: ${r.activeTheme} (${r.activePolarity}) | Viewport: ${r.viewport}`,
+      `- Component Counts: ${o.inventory.buttons} buttons, ${o.inventory.inputsAndSelects} inputs/selects, ${o.inventory.tables} tables, ${o.inventory.cardsAndSurfaces} glass cards`,
+      `- Landmarks: ${o.landmarks.map((s) => `#${s.id} (${s.interactiveCount} actions)`).join(", ")}`,
+      `- Key User Flows: ${o.userFlows.slice(0, 6).map((s) => `[${s.category}] ${s.triggerLabel}`).join(" | ")}`,
       "",
       "## 4. Live CapriEngine Security, DOM & WCAG Telemetry",
       `- Audit Score: ${r.score}/100 (${r.passed ? "PASSED" : "ACTION REQUIRED"}) | Prompt-Injection Firewall: ${r.promptInjectionSafe ? "CLEAN (0 threats)" : `${r.promptThreatsCount} THREAT(S) BLOCKED`}`,
       `- Findings:
-${l}`,
-      d ? `
+${d}`,
+      l ? `
 ## 5. Requested Task
-${d}` : ""
+${l}` : ""
     ].filter(Boolean).join(`
 `);
   }
@@ -870,11 +725,72 @@ ${d}` : ""
     };
   }
   notify(e) {
-    for (const n of this.listeners)
-      n(this.activeSubroutine, e);
+    for (const t of this.listeners)
+      t(this.activeSubroutine, e);
   }
 }
-const Ae = new oe(), D = [
+const se = new X(), P = {
+  xs: 12,
+  sm: 14,
+  md: 16,
+  lg: 20,
+  xl: 24
+}, N = {
+  inherit: "currentColor",
+  primary: "var(--zen-ink-primary)",
+  secondary: "var(--zen-ink-secondary)",
+  muted: "var(--zen-ink-muted)",
+  accent: "var(--zen-accent-primary)",
+  success: "var(--zen-status-success)",
+  warning: "var(--zen-status-warning)",
+  danger: "var(--zen-status-danger)"
+}, U = {
+  search: '<circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/>',
+  plus: '<path d="M5 12h14"/><path d="M12 5v14"/>',
+  minus: '<path d="M5 12h14"/>',
+  close: '<path d="M18 6 6 18"/><path d="m6 6 12 12"/>',
+  check: '<path d="M20 6 9 17l-5-5"/>',
+  copy: '<rect width="14" height="14" x="8" y="8" rx="2" ry="2"/><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/>',
+  "chevron-down": '<path d="m6 9 6 6 6-6"/>',
+  "chevron-right": '<path d="m9 18 6-6-6-6"/>',
+  "chevron-left": '<path d="m15 18-6-6 6-6"/>',
+  "external-link": '<path d="M15 3h6v6"/><path d="M10 14 21 3"/><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/>',
+  bolt: '<path d="M13 2 3 14h9l-1 8 10-12h-9l1-8z"/>',
+  sparkles: '<path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"/><path d="M20 3v4"/><path d="M22 5h-4"/>',
+  terminal: '<polyline points="4 17 10 11 4 5"/><line x1="12" x2="20" y1="19" y2="19"/>',
+  cpu: '<rect width="16" height="16" x="4" y="4" rx="2"/><rect width="6" height="6" x="9" y="9" rx="1"/><path d="M15 2v2"/><path d="M15 20v2"/><path d="M2 15h2"/><path d="M2 9h2"/><path d="M20 15h2"/><path d="M20 9h2"/><path d="M9 2v2"/><path d="M9 20v2"/>',
+  database: '<ellipse cx="12" cy="5" rx="9" ry="3"/><path d="M3 5v14a9 3 0 0 0 18 0V5"/><path d="M3 12a9 3 0 0 0 18 0"/>',
+  layers: '<path d="m12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83Z"/><path d="m22 17.65-9.17 4.16a2 2 0 0 1-1.66 0L2 17.65"/><path d="m22 12.65-9.17 4.16a2 2 0 0 1-1.66 0L2 12.65"/>',
+  shield: '<path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"/>',
+  sliders: '<line x1="4" x2="4" y1="21" y2="14"/><line x1="4" x2="4" y1="10" y2="3"/><line x1="12" x2="12" y1="21" y2="12"/><line x1="12" x2="12" y1="8" y2="3"/><line x1="20" x2="20" y1="21" y2="16"/><line x1="20" x2="20" y1="12" y2="3"/><line x1="2" x2="6" y1="14" y2="14"/><line x1="10" x2="14" y1="8" y2="8"/><line x1="18" x2="22" y1="16" y2="16"/>',
+  command: '<path d="M15 6v12a3 3 0 1 0 3-3H6a3 3 0 1 0 3 3V6a3 3 0 1 0-3 3h12a3 3 0 1 0-3-3"/>',
+  code: '<polyline points="16 18 22 12 16 6"/><polyline points="8 6 2 12 8 18"/>',
+  activity: '<path d="M22 12h-2.48a2 2 0 0 0-1.93 1.46l-2.35 8.36a.25.25 0 0 1-.48 0L9.24 2.18a.25.25 0 0 0-.48 0l-2.35 8.36A2 2 0 0 1 4.49 12H2"/>',
+  info: '<circle cx="12" cy="12" r="10"/><path d="M12 16v-4"/><path d="M12 8h.01"/>',
+  success: '<circle cx="12" cy="12" r="10"/><path d="m9 12 2 2 4-4"/>',
+  warning: '<path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"/><path d="M12 9v4"/><path d="M12 17h.01"/>',
+  danger: '<path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"/><path d="M12 8v4"/><path d="M12 16h.01"/>',
+  "trend-up": '<polyline points="22 7 13.5 15.5 8.5 10.5 2 17"/><polyline points="16 7 22 7 22 13"/>',
+  "trend-down": '<polyline points="22 17 13.5 8.5 8.5 13.5 2 7"/><polyline points="16 17 22 17 22 11"/>',
+  radio: '<path d="M4.9 19.1C1 15.2 1 8.8 4.9 4.9"/><path d="M7.8 16.2c-2.3-2.3-2.3-6.1 0-8.5"/><circle cx="12" cy="12" r="2"/><path d="M16.2 7.8c2.3 2.3 2.3 6.1 0 8.5"/><path d="M19.1 4.9C23 8.8 23 15.1 19.1 19"/>',
+  sun: '<circle cx="12" cy="12" r="4"/><path d="M12 2v2"/><path d="M12 20v2"/><path d="m4.93 4.93 1.41 1.41"/><path d="m17.66 17.66 1.41 1.41"/><path d="M2 12h2"/><path d="M20 12h2"/><path d="m6.34 17.66-1.41 1.41"/><path d="m19.07 4.93-1.41 1.41"/>',
+  moon: '<path d="M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z"/>',
+  eye: '<path d="M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0"/><circle cx="12" cy="12" r="3"/>',
+  upload: '<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="17 8 12 3 7 8"/><line x1="12" x2="12" y1="3" y2="15"/>',
+  trash: '<path d="M3 6h18"/><path d="M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"/><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"/>',
+  refresh: '<path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8"/><path d="M21 3v5h-5"/><path d="M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16"/><path d="M8 16H3v5"/>',
+  menu: '<line x1="4" x2="20" y1="12" y2="12"/><line x1="4" x2="20" y1="6" y2="6"/><line x1="4" x2="20" y1="18" y2="18"/>',
+  "panel-right": '<rect width="18" height="18" x="3" y="3" rx="2"/><path d="M15 3v18"/>',
+  user: '<path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/>',
+  lock: '<rect width="18" height="11" x="3" y="11" rx="2" ry="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/>',
+  globe: '<circle cx="12" cy="12" r="10"/><path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"/><path d="M2 12h20"/>',
+  folder: '<path d="M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z"/>'
+};
+function Q(c) {
+  const e = c.size ?? "md", t = Object.prototype.hasOwnProperty.call(P, e) ? P[e] : P.md, n = c.tone ?? "inherit", a = Object.prototype.hasOwnProperty.call(N, n) ? N[n] : N.inherit, o = typeof c.strokeWidth == "number" && Number.isFinite(c.strokeWidth) ? Math.min(Math.max(c.strokeWidth, 0.5), 4) : 2, r = Object.prototype.hasOwnProperty.call(U, c.name) ? U[c.name] : U.sparkles, l = c.spin ? "animation: spin 1s linear infinite;" : "";
+  return `<svg xmlns="http://www.w3.org/2000/svg" width="${t}" height="${t}" viewBox="0 0 24 24" fill="none" stroke="${a}" stroke-width="${o}" stroke-linecap="round" stroke-linejoin="round" style="display:inline-block;vertical-align:middle;flex-shrink:0;${l}">${r}</svg>`;
+}
+const R = [
   {
     id: "blackwall-crimson",
     name: "Capri // Capricorn",
@@ -955,7 +871,7 @@ const Ae = new oe(), D = [
     secondaryHex: "#0284C7",
     inkHex: "#09090D"
   }
-], N = [
+], D = [
   {
     id: "orion",
     label: "CAPRI // UNLEASHED",
@@ -1009,27 +925,27 @@ const Ae = new oe(), D = [
     ]
   }
 ];
-function K(s) {
-  const e = D.find((n) => n.id === s);
+function j(c) {
+  const e = R.find((t) => t.id === c);
   return e ? e.polarity : "dark";
 }
-class se {
+class J {
   constructor(e) {
-    g(this, "state");
-    g(this, "listeners", /* @__PURE__ */ new Set());
-    g(this, "storageKey");
+    h(this, "state");
+    h(this, "listeners", /* @__PURE__ */ new Set());
+    h(this, "storageKey");
     this.storageKey = (e == null ? void 0 : e.storageKey) ?? "zen-ui-theme-v2";
-    let n = (e == null ? void 0 : e.defaultTheme) ?? "blackwall-crimson";
+    let t = (e == null ? void 0 : e.defaultTheme) ?? "blackwall-crimson";
     if (typeof window < "u")
       try {
-        const t = window.localStorage.getItem(this.storageKey);
-        t && D.some((a) => a.id === t) && (n = t);
+        const n = window.localStorage.getItem(this.storageKey);
+        n && R.some((a) => a.id === n) && (t = n);
       } catch {
-        n = (e == null ? void 0 : e.defaultTheme) ?? "blackwall-crimson";
+        t = (e == null ? void 0 : e.defaultTheme) ?? "blackwall-crimson";
       }
     this.state = {
-      theme: n,
-      polarity: K(n),
+      theme: t,
+      polarity: j(t),
       density: (e == null ? void 0 : e.defaultDensity) ?? "comfortable",
       radius: (e == null ? void 0 : e.defaultRadius) ?? "architectural"
     }, this.applyToDom();
@@ -1041,7 +957,7 @@ class se {
     if (this.state = {
       ...this.state,
       theme: e,
-      polarity: K(e)
+      polarity: j(e)
     }, typeof window < "u")
       try {
         window.localStorage.setItem(this.storageKey, e);
@@ -1074,18 +990,18 @@ class se {
     if (typeof document > "u") return;
     const e = document.documentElement;
     e.setAttribute("data-theme", this.state.theme), e.setAttribute("data-polarity", this.state.polarity), e.setAttribute("data-density", this.state.density), e.setAttribute("data-radius", this.state.radius);
-    const n = D.find((t) => t.id === this.state.theme) ?? D[0];
-    X(n);
+    const t = R.find((n) => n.id === this.state.theme) ?? R[0];
+    W(t);
   }
   notify() {
     for (const e of this.listeners)
       e(this.state);
   }
 }
-class ce {
+class ee {
   constructor() {
-    g(this, "ctx", null);
-    g(this, "muted", !1);
+    h(this, "ctx", null);
+    h(this, "muted", !1);
   }
   isMuted() {
     return this.muted;
@@ -1097,26 +1013,26 @@ class ce {
     if (!(this.muted || typeof window > "u"))
       try {
         this.ctx || (this.ctx = new window.AudioContext()), this.ctx.state === "suspended" && this.ctx.resume();
-        const n = this.ctx.currentTime, t = this.ctx.createOscillator(), a = this.ctx.createGain();
-        t.type = "triangle", t.frequency.setValueAtTime(e, n), t.frequency.exponentialRampToValueAtTime(e * 0.45, n + 0.035), a.gain.setValueAtTime(0.06, n), a.gain.exponentialRampToValueAtTime(1e-4, n + 0.035), t.connect(a), a.connect(this.ctx.destination), t.start(n), t.stop(n + 0.04);
+        const t = this.ctx.currentTime, n = this.ctx.createOscillator(), a = this.ctx.createGain();
+        n.type = "triangle", n.frequency.setValueAtTime(e, t), n.frequency.exponentialRampToValueAtTime(e * 0.45, t + 0.035), a.gain.setValueAtTime(0.06, t), a.gain.exponentialRampToValueAtTime(1e-4, t + 0.035), n.connect(a), a.connect(this.ctx.destination), n.start(t), n.stop(t + 0.04);
       } catch {
       }
   }
 }
-const Z = new se(), V = new ce();
-class le extends HTMLElement {
+const H = new J(), Z = new ee();
+class te extends HTMLElement {
   constructor() {
     super(...arguments);
-    g(this, "framing", "portrait");
-    g(this, "activeMode", "orion");
-    g(this, "rafId", 0);
-    g(this, "pointer", { x: 0, y: 0 });
-    g(this, "smoothPointer", { x: 0, y: 0 });
-    g(this, "canvasEl", null);
-    g(this, "figureEl", null);
-    g(this, "handlePointerMove", (n) => {
-      const t = n.clientX / Math.max(1, window.innerWidth) * 2 - 1, a = n.clientY / Math.max(1, window.innerHeight) * 2 - 1;
-      this.pointer = { x: t, y: a };
+    h(this, "framing", "portrait");
+    h(this, "activeMode", "orion");
+    h(this, "rafId", 0);
+    h(this, "pointer", { x: 0, y: 0 });
+    h(this, "smoothPointer", { x: 0, y: 0 });
+    h(this, "canvasEl", null);
+    h(this, "figureEl", null);
+    h(this, "handlePointerMove", (t) => {
+      const n = t.clientX / Math.max(1, window.innerWidth) * 2 - 1, a = t.clientY / Math.max(1, window.innerHeight) * 2 - 1;
+      this.pointer = { x: n, y: a };
     });
   }
   static get observedAttributes() {
@@ -1130,57 +1046,57 @@ class le extends HTMLElement {
   }
   attributeChangedCallback() {
     if (!this.isConnected) return;
-    const n = this.getAttribute("framing") ?? "portrait", t = this.getAttribute("mode") ?? "orion";
-    (n !== this.framing || t !== this.activeMode) && (this.framing = n, this.activeMode = t, this.render(), this.startEyeLoop());
+    const t = this.getAttribute("framing") ?? "portrait", n = this.getAttribute("mode") ?? "orion";
+    (t !== this.framing || n !== this.activeMode) && (this.framing = t, this.activeMode = n, this.render(), this.startEyeLoop());
   }
   startEyeLoop() {
     this.rafId && window.cancelAnimationFrame(this.rafId);
-    const n = performance.now(), t = (a) => {
-      const i = (a - n) * 1e-3;
+    const t = performance.now(), n = (a) => {
+      const o = (a - t) * 1e-3;
       if (this.smoothPointer.x += (this.pointer.x - this.smoothPointer.x) * 0.12, this.smoothPointer.y += (this.pointer.y - this.smoothPointer.y) * 0.12, this.figureEl) {
-        const r = Math.sin(i * 2.1) * 3.5, d = this.smoothPointer.x * 5.5, l = -this.smoothPointer.y * 3.5;
-        this.figureEl.style.transform = `perspective(900px) translateY(${r.toFixed(2)}px) rotateX(${l.toFixed(2)}deg) rotateY(${d.toFixed(2)}deg)`;
+        const r = Math.sin(o * 2.1) * 3.5, l = this.smoothPointer.x * 5.5, d = -this.smoothPointer.y * 3.5;
+        this.figureEl.style.transform = `perspective(900px) translateY(${r.toFixed(2)}px) rotateX(${d.toFixed(2)}deg) rotateY(${l.toFixed(2)}deg)`;
       }
       if (this.canvasEl) {
         const r = this.canvasEl.getContext("2d");
         if (r) {
-          const d = this.canvasEl.width, l = this.canvasEl.height;
-          r.clearRect(0, 0, d, l);
-          const c = Math.sin(i * 1.1 - 1.2) > 0.992 || Math.sin(i * 2.9 - 1.5) > 0.995, u = this.smoothPointer.x * (d * 85e-4), v = this.smoothPointer.y * (l * 55e-4), b = d * 0.562 + u, h = l * 0.233 + v, A = d * 0.474 + u * 0.75, C = l * 0.25 + v * 0.75;
-          if (c)
-            r.save(), r.strokeStyle = "#00FF66", r.lineWidth = 2.5, r.beginPath(), r.moveTo(b - d * 0.014, h), r.lineTo(b + d * 0.014, h), r.stroke(), r.restore();
+          const l = this.canvasEl.width, d = this.canvasEl.height;
+          r.clearRect(0, 0, l, d);
+          const s = Math.sin(o * 1.1 - 1.2) > 0.992 || Math.sin(o * 2.9 - 1.5) > 0.995, u = this.smoothPointer.x * (l * 85e-4), f = this.smoothPointer.y * (d * 55e-4), b = l * 0.562 + u, y = d * 0.233 + f, A = l * 0.474 + u * 0.75, S = d * 0.25 + f * 0.75;
+          if (s)
+            r.save(), r.strokeStyle = "#00FF66", r.lineWidth = 2.5, r.beginPath(), r.moveTo(b - l * 0.014, y), r.lineTo(b + l * 0.014, y), r.stroke(), r.restore();
           else {
             r.save(), r.globalCompositeOperation = "screen";
-            const w = r.createRadialGradient(
+            const v = r.createRadialGradient(
               b,
-              h,
+              y,
               1,
               b,
-              h,
-              d * 0.017
+              y,
+              l * 0.017
             );
-            w.addColorStop(0, "#FFFFFF"), w.addColorStop(0.38, "#19A0FF"), w.addColorStop(0.75, "rgba(25, 160, 255, 0.55)"), w.addColorStop(1, "rgba(25, 160, 255, 0)"), r.fillStyle = w, r.beginPath(), r.arc(b, h, d * 0.017, 0, Math.PI * 2), r.fill(), r.fillStyle = "#19A0FF", r.beginPath(), r.arc(b, h, d * 85e-4, 0, Math.PI * 2), r.fill(), r.fillStyle = "#FFFFFF", r.beginPath(), r.arc(b, h, d * 42e-4, 0, Math.PI * 2), r.fill(), r.fillStyle = "#19A0FF", r.beginPath(), r.arc(A, C, d * 58e-4, 0, Math.PI * 2), r.fill(), r.fillStyle = "#FFFFFF", r.beginPath(), r.arc(A, C, d * 28e-4, 0, Math.PI * 2), r.fill(), r.restore();
+            v.addColorStop(0, "#FFFFFF"), v.addColorStop(0.38, "#19A0FF"), v.addColorStop(0.75, "rgba(25, 160, 255, 0.55)"), v.addColorStop(1, "rgba(25, 160, 255, 0)"), r.fillStyle = v, r.beginPath(), r.arc(b, y, l * 0.017, 0, Math.PI * 2), r.fill(), r.fillStyle = "#19A0FF", r.beginPath(), r.arc(b, y, l * 85e-4, 0, Math.PI * 2), r.fill(), r.fillStyle = "#FFFFFF", r.beginPath(), r.arc(b, y, l * 42e-4, 0, Math.PI * 2), r.fill(), r.fillStyle = "#19A0FF", r.beginPath(), r.arc(A, S, l * 58e-4, 0, Math.PI * 2), r.fill(), r.fillStyle = "#FFFFFF", r.beginPath(), r.arc(A, S, l * 28e-4, 0, Math.PI * 2), r.fill(), r.restore();
           }
         }
       }
-      this.rafId = window.requestAnimationFrame(t);
+      this.rafId = window.requestAnimationFrame(n);
     };
-    this.rafId = window.requestAnimationFrame(t);
+    this.rafId = window.requestAnimationFrame(n);
   }
   render() {
-    const n = j(
+    const t = B(
       this.getAttribute("title") ?? "CAPRI // CONSTRUCT"
-    ), t = j(
+    ), n = B(
       this.getAttribute("subtitle") ?? "Edgerunners S2 // Soulkiller Net-Driver"
-    ), a = pe(
+    ), a = ie(
       this.getAttribute("image-src") ?? "/capri-construct-base.png"
-    ), i = N.find((l) => l.id === this.activeMode) ?? N[0];
+    ), o = D.find((d) => d.id === this.activeMode) ?? D[0];
     this.innerHTML = `
       <div class="zen-surface-selected" style="padding: 1.25rem; position: relative; overflow: hidden;">
         <div style="display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem; margin-bottom: 1rem;">
           <div>
-            <div class="zen-telemetry-label" style="color: var(--zen-accent-primary);">${t}</div>
-            <div class="zen-font-display" style="font-size: 1.125rem; font-weight: 700; color: var(--zen-ink-primary);">${n}</div>
+            <div class="zen-telemetry-label" style="color: var(--zen-accent-primary);">${n}</div>
+            <div class="zen-font-display" style="font-size: 1.125rem; font-weight: 700; color: var(--zen-ink-primary);">${t}</div>
           </div>
           <div style="display: inline-flex; gap: 0.25rem; padding: 0.25rem; border-radius: 0.75rem; background: var(--zen-surface-2); border: 1px solid var(--zen-border-default);">
             <button type="button" data-framing="portrait" class="zen-btn-base zen-btn-sm ${this.framing === "portrait" ? "zen-btn-primary" : "zen-btn-ghost"}">Portrait</button>
@@ -1195,33 +1111,33 @@ class le extends HTMLElement {
         </div>
         <div style="margin-top: 1rem; padding: 0.875rem; border-radius: 0.875rem; background: var(--zen-surface-2); border: 1px solid var(--zen-border-default);">
           <div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.375rem;">
-            <span class="zen-telemetry-label" style="color: var(--zen-accent-primary);">${i.frequency}</span>
-            <span class="zen-badge zen-badge-accent">${i.status}</span>
+            <span class="zen-telemetry-label" style="color: var(--zen-accent-primary);">${o.frequency}</span>
+            <span class="zen-badge zen-badge-accent">${o.status}</span>
           </div>
-          <div class="zen-font-display" style="font-weight: 700; font-size: 0.875rem; margin-bottom: 0.25rem;">${i.label}</div>
-          <p style="font-size: 0.75rem; color: var(--zen-ink-secondary); margin: 0;">${i.transmission}</p>
+          <div class="zen-font-display" style="font-weight: 700; font-size: 0.875rem; margin-bottom: 0.25rem;">${o.label}</div>
+          <p style="font-size: 0.75rem; color: var(--zen-ink-secondary); margin: 0;">${o.transmission}</p>
         </div>
         <div style="display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem; margin-top: 0.75rem;">
-          ${N.map(
-      (l) => `
-            <button type="button" data-directive="${l.id}" class="zen-btn-base zen-btn-sm ${l.id === this.activeMode ? "zen-btn-primary" : "zen-btn-secondary"}" style="justify-content: flex-start; font-family: var(--zen-font-mono); font-size: 0.6875rem;">
-              ${l.label}
+          ${D.map(
+      (d) => `
+            <button type="button" data-directive="${d.id}" class="zen-btn-base zen-btn-sm ${d.id === this.activeMode ? "zen-btn-primary" : "zen-btn-secondary"}" style="justify-content: flex-start; font-family: var(--zen-font-mono); font-size: 0.6875rem;">
+              ${d.label}
             </button>
           `
     ).join("")}
         </div>
       </div>
-    `, this.canvasEl = this.querySelector("[data-capri-eyes]"), this.figureEl = this.querySelector("[data-capri-figure]"), this.querySelectorAll("[data-framing]").forEach((l) => {
-      l.addEventListener("click", () => {
-        const c = l.getAttribute("framing") ?? l.dataset.framing;
-        (c === "portrait" || c === "full") && (V.playMicroClick(560), this.framing = c, this.setAttribute("framing", c), this.render(), this.startEyeLoop());
+    `, this.canvasEl = this.querySelector("[data-capri-eyes]"), this.figureEl = this.querySelector("[data-capri-figure]"), this.querySelectorAll("[data-framing]").forEach((d) => {
+      d.addEventListener("click", () => {
+        const s = d.getAttribute("framing") ?? d.dataset.framing;
+        (s === "portrait" || s === "full") && (Z.playMicroClick(560), this.framing = s, this.setAttribute("framing", s), this.render(), this.startEyeLoop());
       });
-    }), this.querySelectorAll("[data-directive]").forEach((l) => {
-      l.addEventListener("click", () => {
-        const c = l.dataset.directive;
-        if (!c) return;
-        V.playMicroClick(620), this.activeMode = c, this.setAttribute("mode", c);
-        const u = N.find((v) => v.id === c);
+    }), this.querySelectorAll("[data-directive]").forEach((d) => {
+      d.addEventListener("click", () => {
+        const s = d.dataset.directive;
+        if (!s) return;
+        Z.playMicroClick(620), this.activeMode = s, this.setAttribute("mode", s);
+        const u = D.find((f) => f.id === s);
         u && this.dispatchEvent(
           new CustomEvent("zen-directive", {
             detail: { directive: u },
@@ -1233,7 +1149,7 @@ class le extends HTMLElement {
     });
   }
 }
-class de extends HTMLElement {
+class ne extends HTMLElement {
   static get observedAttributes() {
     return ["variant"];
   }
@@ -1244,19 +1160,19 @@ class de extends HTMLElement {
     this.isConnected && this.render();
   }
   render() {
-    const e = this.getAttribute("variant") ?? "blackwall-lattice", n = e === "swiss-blueprint" ? "background-image: linear-gradient(to right, var(--zen-border-subtle) 1px, transparent 1px), linear-gradient(to bottom, var(--zen-border-subtle) 1px, transparent 1px); background-size: 48px 48px;" : e === "blackwall-lattice" ? "background-image: radial-gradient(circle at 50% 18%, rgba(var(--zen-accent-rgb), 0.16), transparent 62%), radial-gradient(circle at 85% 75%, rgba(var(--zen-secondary-rgb), 0.11), transparent 55%);" : e === "aurora-mesh" ? "background-image: radial-gradient(ellipse at 20% 20%, rgba(var(--zen-accent-rgb), 0.20), transparent 55%), radial-gradient(ellipse at 80% 60%, rgba(var(--zen-secondary-rgb), 0.15), transparent 60%);" : "";
+    const e = this.getAttribute("variant") ?? "blackwall-lattice", t = e === "swiss-blueprint" ? "background-image: linear-gradient(to right, var(--zen-border-subtle) 1px, transparent 1px), linear-gradient(to bottom, var(--zen-border-subtle) 1px, transparent 1px); background-size: 48px 48px;" : e === "blackwall-lattice" ? "background-image: radial-gradient(circle at 50% 18%, rgba(var(--zen-accent-rgb), 0.16), transparent 62%), radial-gradient(circle at 85% 75%, rgba(var(--zen-secondary-rgb), 0.11), transparent 55%);" : e === "aurora-mesh" ? "background-image: radial-gradient(ellipse at 20% 20%, rgba(var(--zen-accent-rgb), 0.20), transparent 55%), radial-gradient(ellipse at 80% 60%, rgba(var(--zen-secondary-rgb), 0.15), transparent 60%);" : "";
     this.innerHTML = `
-      <div aria-hidden="true" style="position: fixed; inset: 0; pointer-events: none; z-index: 0; overflow: hidden; ${n}"></div>
+      <div aria-hidden="true" style="position: fixed; inset: 0; pointer-events: none; z-index: 0; overflow: hidden; ${t}"></div>
     `;
   }
 }
-class me extends HTMLElement {
+class re extends HTMLElement {
   constructor() {
     super(...arguments);
-    g(this, "unsubscribe", null);
+    h(this, "unsubscribe", null);
   }
   connectedCallback() {
-    this.unsubscribe = Z.subscribe(() => {
+    this.unsubscribe = H.subscribe(() => {
       this.render();
     });
   }
@@ -1264,28 +1180,28 @@ class me extends HTMLElement {
     this.unsubscribe && (this.unsubscribe(), this.unsubscribe = null);
   }
   render() {
-    const { theme: n } = Z.getState();
+    const { theme: t } = H.getState();
     this.innerHTML = `
       <div style="display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center;">
-        ${D.map(
-      (t) => `
+        ${R.map(
+      (n) => `
           <button
             type="button"
-            data-theme-id="${t.id}"
-            class="zen-btn-base zen-btn-sm ${t.id === n ? "zen-btn-primary" : "zen-btn-secondary"}"
+            data-theme-id="${n.id}"
+            class="zen-btn-base zen-btn-sm ${n.id === t ? "zen-btn-primary" : "zen-btn-secondary"}"
           >
-            <span style="width: 0.5rem; height: 0.5rem; border-radius: 9999px; background: ${t.accentHex}; display: inline-block;"></span>
-            <span>${t.name}</span>
+            <span style="width: 0.5rem; height: 0.5rem; border-radius: 9999px; background: ${n.accentHex}; display: inline-block;"></span>
+            <span>${n.name}</span>
           </button>
         `
     ).join("")}
       </div>
-    `, this.querySelectorAll("[data-theme-id]").forEach((t) => {
-      t.addEventListener("click", () => {
-        const a = t.dataset.themeId;
-        a && (V.playMicroClick(540), Z.setTheme(a), this.dispatchEvent(
+    `, this.querySelectorAll("[data-theme-id]").forEach((n) => {
+      n.addEventListener("click", () => {
+        const a = n.dataset.themeId;
+        a && (Z.playMicroClick(540), H.setTheme(a), this.dispatchEvent(
           new CustomEvent("zen-theme-change", {
-            detail: Z.getState(),
+            detail: H.getState(),
             bubbles: !0,
             composed: !0
           })
@@ -1294,7 +1210,7 @@ class me extends HTMLElement {
     });
   }
 }
-class ue extends HTMLElement {
+class ae extends HTMLElement {
   static get observedAttributes() {
     return ["name", "size", "tone", "stroke-width", "spin"];
   }
@@ -1305,52 +1221,45 @@ class ue extends HTMLElement {
     this.isConnected && this.render();
   }
   render() {
-    const e = this.getAttribute("name") ?? "sparkles", n = this.getAttribute("size") ?? "md", t = this.getAttribute("tone") ?? "inherit", a = Number(this.getAttribute("stroke-width") ?? 2), i = this.getAttribute("spin") === "true";
-    this.innerHTML = ae({
+    const e = this.getAttribute("name") ?? "sparkles", t = this.getAttribute("size") ?? "md", n = this.getAttribute("tone") ?? "inherit", a = Number(this.getAttribute("stroke-width") ?? 2), o = this.getAttribute("spin") === "true";
+    this.innerHTML = Q({
       name: e,
-      size: n,
-      tone: t,
+      size: t,
+      tone: n,
       strokeWidth: a,
-      spin: i
+      spin: o
     });
   }
 }
-function j(s) {
-  return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
+function B(c) {
+  return c.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
 }
-function pe(s) {
-  const e = s.trim(), n = e.replace(/[\u0000-\u0020]+/g, "");
-  return /^(?:javascript|data|vbscript|file):/i.test(n) ? "/capri-construct-base.png" : j(e);
+function ie(c) {
+  const e = c.trim(), t = e.replace(/[\u0000-\u0020]+/g, "");
+  return /^(?:javascript|data|vbscript|file):/i.test(t) ? "/capri-construct-base.png" : B(e);
 }
-function xe() {
-  typeof window > "u" || !("customElements" in window) || (window.customElements.get("zen-icon") || window.customElements.define("zen-icon", ue), window.customElements.get("zen-ai-construct") || window.customElements.define("zen-ai-construct", le), window.customElements.get("zen-ambient-background") || window.customElements.define(
+function ce() {
+  typeof window > "u" || !("customElements" in window) || (window.customElements.get("zen-icon") || window.customElements.define("zen-icon", ae), window.customElements.get("zen-ai-construct") || window.customElements.define("zen-ai-construct", te), window.customElements.get("zen-ambient-background") || window.customElements.define(
     "zen-ambient-background",
-    de
-  ), window.customElements.get("zen-theme-switcher") || window.customElements.define("zen-theme-switcher", me));
+    ne
+  ), window.customElements.get("zen-theme-switcher") || window.customElements.define("zen-theme-switcher", re));
 }
 export {
-  S as C,
-  ve as Z,
-  oe as a,
-  P as b,
-  Ae as c,
-  I as d,
-  T as e,
-  D as f,
-  le as g,
-  de as h,
-  we as i,
-  ue as j,
-  se as k,
-  be as l,
-  me as m,
-  ce as n,
-  j as o,
-  ae as p,
-  X as q,
-  xe as r,
-  pe as s,
-  Z as t,
-  fe as u,
-  V as z
+  w as C,
+  _ as Z,
+  X as a,
+  R as b,
+  se as c,
+  te as d,
+  ne as e,
+  ae as f,
+  J as g,
+  re as h,
+  ee as i,
+  B as j,
+  ie as k,
+  H as l,
+  ce as r,
+  W as s,
+  Z as z
 };