@tapizlabs/ui 0.2.10 → 0.2.12

package/dist/index.js

@@ -237,6 +237,18 @@ var ExternalLink = ({ size = 14, className, style }) => /* @__PURE__ */ jsxs2("s
   /* @__PURE__ */ jsx2("polyline", { points: "15 3 21 3 21 9" }),
   /* @__PURE__ */ jsx2("line", { x1: "10", y1: "14", x2: "21", y2: "3" })
 ] });
+var GitHubIcon = ({ size = 14, className, style }) => /* @__PURE__ */ jsx2(
+  "svg",
+  {
+    width: size,
+    height: size,
+    viewBox: "0 0 24 24",
+    fill: "currentColor",
+    style,
+    className,
+    children: /* @__PURE__ */ jsx2("path", { d: "M12 .5C5.37.5 0 5.87 0 12.5c0 5.3 3.44 9.8 8.2 11.38.6.11.82-.26.82-.58 0-.29-.01-1.04-.02-2.05-3.34.73-4.04-1.61-4.04-1.61-.55-1.38-1.33-1.75-1.33-1.75-1.09-.74.08-.73.08-.73 1.2.09 1.84 1.24 1.84 1.24 1.08 1.84 2.81 1.31 3.49 1 .11-.78.42-1.31.76-1.61-2.67-.31-5.47-1.33-5.47-5.93 0-1.31.47-2.39 1.24-3.23-.12-.3-.54-1.54.12-3.2 0 0 1.01-.32 3.3 1.23a11.38 11.38 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.66 1.66.24 2.9.12 3.2.77.84 1.23 1.92 1.23 3.23 0 4.61-2.8 5.62-5.48 5.92.43.37.82 1.1.82 2.21 0 1.6-.01 2.88-.01 3.27 0 .32.21.7.83.58A12.01 12.01 0 0 0 24 12.5C24 5.87 18.63.5 12 .5Z" })
+  }
+);
 var Image = ({ size = 14, className, style }) => /* @__PURE__ */ jsxs2("svg", { ...base(null, size, style), className, children: [
   /* @__PURE__ */ jsx2("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", ry: "2" }),
   /* @__PURE__ */ jsx2("circle", { cx: "8.5", cy: "8.5", r: "1.5" }),
@@ -498,85 +510,122 @@ var LogoMark = ({
   bgClassName,
   bgFill = "#1496b3",
   bgOpacity = 1,
+  tone: tone2 = "solid",
   variant = "lms"
-}) => /* @__PURE__ */ jsxs6(
-  "svg",
-  {
-    width: size,
-    height: size,
-    className,
-    viewBox: "0 0 64 64",
-    fill: "none",
-    children: [
-      /* @__PURE__ */ jsx6("rect", { width: "64", height: "64", rx: "14", fill: bgFill, opacity: bgOpacity, className: bgClassName }),
-      variant === "lms" && /* @__PURE__ */ jsxs6("g", { fill: "#fff", children: [
-        /* @__PURE__ */ jsx6("rect", { x: "14", y: "14", width: "36", height: "10", rx: "3" }),
-        /* @__PURE__ */ jsx6("rect", { x: "27", y: "14", width: "10", height: "36", rx: "3" })
-      ] }),
-      variant === "boards" && /* @__PURE__ */ jsxs6("g", { fill: "#fff", children: [
-        /* @__PURE__ */ jsx6("rect", { x: "13", y: "15", width: "10", height: "26", rx: "5" }),
-        /* @__PURE__ */ jsx6("rect", { x: "27", y: "15", width: "10", height: "34", rx: "5" }),
-        /* @__PURE__ */ jsx6("rect", { x: "41", y: "15", width: "10", height: "20", rx: "5" })
-      ] }),
-      variant === "playground" && /* @__PURE__ */ jsxs6(Fragment, { children: [
-        /* @__PURE__ */ jsxs6("g", { fill: "#fff", children: [
-          /* @__PURE__ */ jsx6("rect", { x: "13", y: "12", width: "38", height: "9", rx: "3" }),
-          /* @__PURE__ */ jsx6("rect", { x: "27", y: "12", width: "10", height: "30", rx: "3" })
-        ] }),
-        /* @__PURE__ */ jsx6(
-          "path",
-          {
-            d: "M16 46 L23 51 L16 56",
-            stroke: "#d4ff3a",
-            strokeWidth: "4.5",
-            strokeLinecap: "round",
-            strokeLinejoin: "round",
-            fill: "none"
-          }
-        ),
-        /* @__PURE__ */ jsx6("rect", { x: "30", y: "52.5", width: "14", height: "4.5", rx: "2.25", fill: "#fff" })
-      ] }),
-      variant === "whiteboard" && /* @__PURE__ */ jsxs6(Fragment, { children: [
-        /* @__PURE__ */ jsx6("rect", { x: "12", y: "15", width: "40", height: "28", rx: "4", fill: "#fff" }),
-        /* @__PURE__ */ jsx6(
-          "path",
-          {
-            d: "M19 35 C24 24, 30 24, 33 31 C35.5 37, 41 36, 45 27",
-            stroke: "#1496b3",
-            strokeWidth: "3.4",
-            strokeLinecap: "round",
-            strokeLinejoin: "round",
-            fill: "none"
-          }
-        ),
-        /* @__PURE__ */ jsx6("circle", { cx: "19", cy: "35", r: "2.6", fill: "#1496b3" }),
-        /* @__PURE__ */ jsx6("circle", { cx: "45", cy: "27", r: "2.6", fill: "#d4ff3a" }),
-        /* @__PURE__ */ jsx6(
-          "path",
-          {
-            d: "M22 43 L19 51 M42 43 L45 51",
-            stroke: "#fff",
-            strokeWidth: "4",
-            strokeLinecap: "round"
-          }
-        )
-      ] }),
-      variant === "cloud" && /* @__PURE__ */ jsxs6(Fragment, { children: [
+}) => {
+  const outline = tone2 === "outline";
+  const glyph = outline ? "currentColor" : "#fff";
+  const accentDetail = outline ? bgFill : "#1496b3";
+  return /* @__PURE__ */ jsxs6(
+    "svg",
+    {
+      width: size,
+      height: size,
+      className,
+      viewBox: "0 0 64 64",
+      fill: "none",
+      children: [
         /* @__PURE__ */ jsx6(
-          "path",
+          "rect",
           {
-            fill: "#fff",
-            d: "M23 45 q-4.6 0-7.8-3.2Q12 38.6 12 34 q0-3.95 2.5-7 2.5-3.05 6.4-3.83 1.05-4.25 4.6-6.91Q29.05 13.6 33.7 13.6 q5.75 0 9.78 3.9 4.03 3.9 4.22 9.52 3.26.29 5.38 2.69 2.12 2.4 2.12 5.63 0 3.58-2.56 6.11T46 47 H23Z"
+            width: "64",
+            height: "64",
+            rx: "14",
+            fill: outline ? "none" : bgFill,
+            opacity: outline ? 1 : bgOpacity,
+            stroke: outline ? "currentColor" : void 0,
+            strokeWidth: outline ? 4 : void 0,
+            className: bgClassName
           }
         ),
-        /* @__PURE__ */ jsxs6("g", { fill: "#1496b3", children: [
-          /* @__PURE__ */ jsx6("rect", { x: "25", y: "30", width: "16", height: "3.6", rx: "1.6" }),
-          /* @__PURE__ */ jsx6("rect", { x: "31.2", y: "30", width: "3.6", height: "12", rx: "1.6" })
+        variant === "lms" && /* @__PURE__ */ jsxs6("g", { fill: glyph, children: [
+          /* @__PURE__ */ jsx6("rect", { x: "14", y: "14", width: "36", height: "10", rx: "3" }),
+          /* @__PURE__ */ jsx6("rect", { x: "27", y: "14", width: "10", height: "36", rx: "3" })
+        ] }),
+        variant === "boards" && /* @__PURE__ */ jsxs6("g", { fill: glyph, children: [
+          /* @__PURE__ */ jsx6("rect", { x: "13", y: "15", width: "10", height: "26", rx: "5" }),
+          /* @__PURE__ */ jsx6("rect", { x: "27", y: "15", width: "10", height: "34", rx: "5" }),
+          /* @__PURE__ */ jsx6("rect", { x: "41", y: "15", width: "10", height: "20", rx: "5" })
+        ] }),
+        variant === "playground" && /* @__PURE__ */ jsxs6(Fragment, { children: [
+          /* @__PURE__ */ jsxs6("g", { fill: glyph, children: [
+            /* @__PURE__ */ jsx6("rect", { x: "13", y: "12", width: "38", height: "9", rx: "3" }),
+            /* @__PURE__ */ jsx6("rect", { x: "27", y: "12", width: "10", height: "30", rx: "3" })
+          ] }),
+          /* @__PURE__ */ jsx6(
+            "path",
+            {
+              d: "M16 46 L23 51 L16 56",
+              stroke: "#d4ff3a",
+              strokeWidth: "4.5",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              fill: "none"
+            }
+          ),
+          /* @__PURE__ */ jsx6("rect", { x: "30", y: "52.5", width: "14", height: "4.5", rx: "2.25", fill: glyph })
+        ] }),
+        variant === "whiteboard" && /* @__PURE__ */ jsxs6(Fragment, { children: [
+          /* @__PURE__ */ jsx6("rect", { x: "12", y: "15", width: "40", height: "28", rx: "4", fill: glyph }),
+          /* @__PURE__ */ jsx6(
+            "path",
+            {
+              d: "M19 35 C24 24, 30 24, 33 31 C35.5 37, 41 36, 45 27",
+              stroke: accentDetail,
+              strokeWidth: "3.4",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              fill: "none"
+            }
+          ),
+          /* @__PURE__ */ jsx6("circle", { cx: "19", cy: "35", r: "2.6", fill: accentDetail }),
+          /* @__PURE__ */ jsx6("circle", { cx: "45", cy: "27", r: "2.6", fill: "#d4ff3a" }),
+          /* @__PURE__ */ jsx6(
+            "path",
+            {
+              d: "M22 43 L19 51 M42 43 L45 51",
+              stroke: glyph,
+              strokeWidth: "4",
+              strokeLinecap: "round"
+            }
+          )
+        ] }),
+        variant === "cloud" && /* @__PURE__ */ jsxs6(Fragment, { children: [
+          /* @__PURE__ */ jsx6(
+            "path",
+            {
+              fill: glyph,
+              d: "M23 45 q-4.6 0-7.8-3.2Q12 38.6 12 34 q0-3.95 2.5-7 2.5-3.05 6.4-3.83 1.05-4.25 4.6-6.91Q29.05 13.6 33.7 13.6 q5.75 0 9.78 3.9 4.03 3.9 4.22 9.52 3.26.29 5.38 2.69 2.12 2.4 2.12 5.63 0 3.58-2.56 6.11T46 47 H23Z"
+            }
+          ),
+          /* @__PURE__ */ jsxs6("g", { fill: accentDetail, children: [
+            /* @__PURE__ */ jsx6("rect", { x: "25", y: "30", width: "16", height: "3.6", rx: "1.6" }),
+            /* @__PURE__ */ jsx6("rect", { x: "31.2", y: "30", width: "3.6", height: "12", rx: "1.6" })
+          ] })
+        ] }),
+        variant === "specs" && /* @__PURE__ */ jsxs6(Fragment, { children: [
+          /* @__PURE__ */ jsx6("rect", { x: "16", y: "12", width: "32", height: "40", rx: "4", fill: glyph }),
+          /* @__PURE__ */ jsxs6("g", { fill: accentDetail, children: [
+            /* @__PURE__ */ jsx6("rect", { x: "21", y: "19", width: "22", height: "3.4", rx: "1.7" }),
+            /* @__PURE__ */ jsx6("rect", { x: "21", y: "26", width: "22", height: "3.4", rx: "1.7" }),
+            /* @__PURE__ */ jsx6("rect", { x: "21", y: "33", width: "14", height: "3.4", rx: "1.7" })
+          ] }),
+          /* @__PURE__ */ jsx6(
+            "path",
+            {
+              d: "M22 43 L26 47 L34 39",
+              stroke: "#d4ff3a",
+              strokeWidth: "4",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              fill: "none"
+            }
+          )
         ] })
-      ] })
-    ]
-  }
-);
+      ]
+    }
+  );
+};
 
 // src/components/icons/FormsIcons.tsx
 import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
@@ -1599,8 +1648,27 @@ function InfoBanner(props) {
   );
 }
 
+// src/components/shared/ThemeIconButton.tsx
+import { jsx as jsx33 } from "react/jsx-runtime";
+function ThemeIconButton({
+  icon,
+  className = "",
+  type = "button",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx33(
+    "button",
+    {
+      type,
+      className: `inline-flex h-9 w-9 cursor-pointer items-center justify-center border-0 bg-transparent p-1.5 text-txt-3 transition-colors duration-150 hover:text-primary-300 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[color:var(--tapiz-border-focus)] focus-visible:ring-offset-2 focus-visible:ring-offset-[color:var(--tapiz-bg-surface)] ${className}`.trim(),
+      ...props,
+      children: /* @__PURE__ */ jsx33("span", { className: "inline-flex h-4 w-4 items-center justify-center", children: icon })
+    }
+  );
+}
+
 // src/components/shared/PageHeader.tsx
-import { jsx as jsx33, jsxs as jsxs23 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs23 } from "react/jsx-runtime";
 function PageHeader({
   title,
   subtitle,
@@ -1617,25 +1685,25 @@ function PageHeader({
   const resolvedActions = actions ?? action;
   const variantClass = variant === "brutal" ? "border-2 border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] p-5 shadow-[var(--tapiz-shadow-brutal)]" : variant === "enterprise" ? "border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] p-5 shadow-[var(--tapiz-shadow-sm)]" : "border-b border-[var(--tapiz-border-subtle)] pb-4";
   return /* @__PURE__ */ jsxs23("div", { className: `page-header mb-5 flex flex-col gap-3 animate-fade-in-up ${variantClass} ${className}`.trim(), children: [
-    breadcrumbs ? /* @__PURE__ */ jsx33("div", { className: "font-mono text-[10px] uppercase tracking-[0.16em] text-[var(--tapiz-text-muted)]", children: breadcrumbs }) : null,
+    breadcrumbs ? /* @__PURE__ */ jsx34("div", { className: "font-mono text-[10px] uppercase tracking-[0.16em] text-[var(--tapiz-text-muted)]", children: breadcrumbs }) : null,
     /* @__PURE__ */ jsxs23("div", { className: "flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between", children: [
       /* @__PURE__ */ jsxs23("div", { className: "min-w-0", children: [
-        subtitle ? /* @__PURE__ */ jsx33("div", { className: "kicker mb-1.5", children: subtitle }) : null,
+        subtitle ? /* @__PURE__ */ jsx34("div", { className: "kicker mb-1.5", children: subtitle }) : null,
         /* @__PURE__ */ jsxs23("div", { className: "flex items-center gap-2.5", children: [
-          icon ? /* @__PURE__ */ jsx33("span", { className: "text-[var(--tapiz-accent)]", children: icon }) : null,
-          /* @__PURE__ */ jsx33("h2", { className: "font-(--font-display) text-[22px] tracking-[-0.03em] text-[var(--tapiz-text-primary)] md:text-[26px]", children: title })
+          icon ? /* @__PURE__ */ jsx34("span", { className: "text-[var(--tapiz-accent)]", children: icon }) : null,
+          /* @__PURE__ */ jsx34("h2", { className: "font-(--font-display) text-[22px] tracking-[-0.03em] text-[var(--tapiz-text-primary)] md:text-[26px]", children: title })
         ] }),
-        description ? /* @__PURE__ */ jsx33("div", { className: "mt-2 max-w-3xl text-sm leading-6 text-[var(--tapiz-text-muted)]", children: description }) : null,
-        meta ? /* @__PURE__ */ jsx33("div", { className: "mt-3 font-mono text-[11px] text-[var(--tapiz-text-disabled)]", children: meta }) : null
+        description ? /* @__PURE__ */ jsx34("div", { className: "mt-2 max-w-3xl text-sm leading-6 text-[var(--tapiz-text-muted)]", children: description }) : null,
+        meta ? /* @__PURE__ */ jsx34("div", { className: "mt-3 font-mono text-[11px] text-[var(--tapiz-text-disabled)]", children: meta }) : null
       ] }),
-      resolvedActions ? /* @__PURE__ */ jsx33("div", { className: "flex shrink-0 flex-wrap gap-2", children: resolvedActions }) : null
+      resolvedActions ? /* @__PURE__ */ jsx34("div", { className: "flex shrink-0 flex-wrap gap-2", children: resolvedActions }) : null
     ] }),
     banner ? banner : null
   ] });
 }
 
 // src/components/shared/MetricCard.tsx
-import { jsx as jsx34, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx35, jsxs as jsxs24 } from "react/jsx-runtime";
 var trendClasses = {
   positive: "border-[var(--tapiz-success)] text-[var(--tapiz-success)] bg-[var(--tapiz-success-soft)]",
   negative: "border-[var(--tapiz-danger)] text-[var(--tapiz-danger)] bg-[var(--tapiz-danger-soft)]",
@@ -1655,22 +1723,22 @@ function MetricCard({
   return /* @__PURE__ */ jsxs24(Card, { variant, padding: "md", hover: true, className: `relative overflow-hidden ${className}`, children: [
     /* @__PURE__ */ jsxs24("div", { className: "flex items-start justify-between gap-4", children: [
       /* @__PURE__ */ jsxs24("div", { className: "min-w-0", children: [
-        /* @__PURE__ */ jsx34("p", { className: "font-mono text-[10px] font-bold uppercase tracking-[0.18em] text-[var(--tapiz-text-muted)]", children: label }),
-        /* @__PURE__ */ jsx34("div", { className: "mt-2 font-display text-3xl font-semibold tracking-[-0.05em] text-[var(--tapiz-text-primary)]", children: value })
+        /* @__PURE__ */ jsx35("p", { className: "font-mono text-[10px] font-bold uppercase tracking-[0.18em] text-[var(--tapiz-text-muted)]", children: label }),
+        /* @__PURE__ */ jsx35("div", { className: "mt-2 font-display text-3xl font-semibold tracking-[-0.05em] text-[var(--tapiz-text-primary)]", children: value })
       ] }),
-      icon ? /* @__PURE__ */ jsx34("div", { className: "grid h-10 w-10 shrink-0 place-items-center border border-[var(--tapiz-border-strong)] bg-[var(--color-icon-bg)] text-[var(--tapiz-accent)]", children: icon }) : null
+      icon ? /* @__PURE__ */ jsx35("div", { className: "grid h-10 w-10 shrink-0 place-items-center border border-[var(--tapiz-border-strong)] bg-[var(--color-icon-bg)] text-[var(--tapiz-accent)]", children: icon }) : null
     ] }),
     description || trend ? /* @__PURE__ */ jsxs24("div", { className: "mt-4 flex flex-wrap items-center gap-2", children: [
-      trend ? /* @__PURE__ */ jsx34("span", { className: `inline-flex border px-2 py-0.5 font-mono text-[10px] font-bold uppercase tracking-widest ${trendClasses[trendTone]}`, children: trend }) : null,
-      description ? /* @__PURE__ */ jsx34("p", { className: "text-xs text-[var(--tapiz-text-muted)]", children: description }) : null
+      trend ? /* @__PURE__ */ jsx35("span", { className: `inline-flex border px-2 py-0.5 font-mono text-[10px] font-bold uppercase tracking-widest ${trendClasses[trendTone]}`, children: trend }) : null,
+      description ? /* @__PURE__ */ jsx35("p", { className: "text-xs text-[var(--tapiz-text-muted)]", children: description }) : null
     ] }) : null
   ] });
 }
 
 // src/components/shared/StatGrid.tsx
-import { jsx as jsx35 } from "react/jsx-runtime";
+import { jsx as jsx36 } from "react/jsx-runtime";
 function StatGrid({ children, className = "", minColumnWidth = "14rem" }) {
-  return /* @__PURE__ */ jsx35(
+  return /* @__PURE__ */ jsx36(
     "div",
     {
       className: `grid gap-4 ${className}`,
@@ -1681,23 +1749,23 @@ function StatGrid({ children, className = "", minColumnWidth = "14rem" }) {
 }
 
 // src/components/shared/SectionCard.tsx
-import { jsx as jsx36, jsxs as jsxs25 } from "react/jsx-runtime";
+import { jsx as jsx37, jsxs as jsxs25 } from "react/jsx-runtime";
 function SectionCard({ title, eyebrow, description, action, children, className = "" }) {
   return /* @__PURE__ */ jsxs25(Card, { variant: "surface", padding: "none", className, children: [
     title || eyebrow || description || action ? /* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-3 border-b border-[var(--tapiz-border-subtle)] px-5 py-4 sm:flex-row sm:items-start sm:justify-between", children: [
       /* @__PURE__ */ jsxs25("div", { className: "min-w-0", children: [
-        eyebrow ? /* @__PURE__ */ jsx36("div", { className: "kicker mb-1", children: eyebrow }) : null,
-        title ? /* @__PURE__ */ jsx36("h3", { className: "text-lg font-semibold text-[var(--tapiz-text-primary)]", children: title }) : null,
-        description ? /* @__PURE__ */ jsx36("p", { className: "mt-1 text-sm text-[var(--tapiz-text-muted)]", children: description }) : null
+        eyebrow ? /* @__PURE__ */ jsx37("div", { className: "kicker mb-1", children: eyebrow }) : null,
+        title ? /* @__PURE__ */ jsx37("h3", { className: "text-lg font-semibold text-[var(--tapiz-text-primary)]", children: title }) : null,
+        description ? /* @__PURE__ */ jsx37("p", { className: "mt-1 text-sm text-[var(--tapiz-text-muted)]", children: description }) : null
       ] }),
-      action ? /* @__PURE__ */ jsx36("div", { className: "shrink-0", children: action }) : null
+      action ? /* @__PURE__ */ jsx37("div", { className: "shrink-0", children: action }) : null
     ] }) : null,
-    /* @__PURE__ */ jsx36("div", { className: "p-5", children })
+    /* @__PURE__ */ jsx37("div", { className: "p-5", children })
   ] });
 }
 
 // src/components/shared/SearchInput.tsx
-import { jsx as jsx37, jsxs as jsxs26 } from "react/jsx-runtime";
+import { jsx as jsx38, jsxs as jsxs26 } from "react/jsx-runtime";
 function SearchInput({
   value,
   onChange,
@@ -1711,8 +1779,8 @@ function SearchInput({
   ...props
 }) {
   return /* @__PURE__ */ jsxs26("div", { className: `relative ${wrapperClassName}`.trim(), style: wrapperStyle, children: [
-    /* @__PURE__ */ jsx37("span", { className: `pointer-events-none absolute left-3 top-1/2 -translate-y-1/2 ${iconClassName}`.trim(), children: /* @__PURE__ */ jsx37(Search, { size: 15 }) }),
-    /* @__PURE__ */ jsx37(
+    /* @__PURE__ */ jsx38("span", { className: `pointer-events-none absolute left-3 top-1/2 -translate-y-1/2 ${iconClassName}`.trim(), children: /* @__PURE__ */ jsx38(Search, { size: 15 }) }),
+    /* @__PURE__ */ jsx38(
       Input,
       {
         ...props,
@@ -1723,21 +1791,21 @@ function SearchInput({
         className: `pl-9 ${inputClassName}`.trim()
       }
     ),
-    clearable && value ? /* @__PURE__ */ jsx37(
+    clearable && value ? /* @__PURE__ */ jsx38(
       "button",
       {
         type: "button",
         onClick: () => onChange(""),
         className: "absolute right-2 top-1/2 -translate-y-1/2 rounded-lg p-1 text-txt-4 transition-colors hover:bg-ink-300 hover:text-txt-2",
         title: clearTitle,
-        children: /* @__PURE__ */ jsx37(X, { size: 14 })
+        children: /* @__PURE__ */ jsx38(X, { size: 14 })
       }
     ) : null
   ] });
 }
 
 // src/components/shared/Pagination.tsx
-import { jsx as jsx38, jsxs as jsxs27 } from "react/jsx-runtime";
+import { jsx as jsx39, jsxs as jsxs27 } from "react/jsx-runtime";
 function getPageNumbers(page, totalPages) {
   if (totalPages <= 7) return Array.from({ length: totalPages }, (_, i) => i + 1);
   const pages = [1];
@@ -1762,7 +1830,7 @@ function Pagination({ page, totalPages, onChange, totalItems, pageSize, labels }
   const from = pageSize ? (page - 1) * pageSize + 1 : null;
   const to = pageSize && totalItems ? Math.min(page * pageSize, totalItems) : null;
   return /* @__PURE__ */ jsxs27("div", { className: "flex flex-col items-center justify-between gap-3 border-t border-border pt-3 sm:flex-row", children: [
-    totalItems != null && from != null && to != null ? /* @__PURE__ */ jsx38("span", { className: "order-2 font-mono text-[12px] text-txt-4 sm:order-1", children: copy.showing({ from, to, total: totalItems }) }) : /* @__PURE__ */ jsx38("span", { className: "order-2 font-mono text-[11px] text-txt-4 sm:order-1", children: copy.page({ page, totalPages }) }),
+    totalItems != null && from != null && to != null ? /* @__PURE__ */ jsx39("span", { className: "order-2 font-mono text-[12px] text-txt-4 sm:order-1", children: copy.showing({ from, to, total: totalItems }) }) : /* @__PURE__ */ jsx39("span", { className: "order-2 font-mono text-[11px] text-txt-4 sm:order-1", children: copy.page({ page, totalPages }) }),
     /* @__PURE__ */ jsxs27("div", { className: "order-1 flex items-center gap-1 sm:order-2", children: [
       /* @__PURE__ */ jsxs27(
         "button",
@@ -1773,13 +1841,13 @@ function Pagination({ page, totalPages, onChange, totalItems, pageSize, labels }
           title: copy.prevTitle,
           className: "flex items-center gap-1 border border-border px-2.5 py-1.5 font-mono text-[11px] text-txt-3 transition-colors hover:border-border-hi hover:text-txt-1 disabled:cursor-not-allowed disabled:opacity-30",
           children: [
-            /* @__PURE__ */ jsx38(ChevronLeft, { size: 12 }),
-            /* @__PURE__ */ jsx38("span", { className: "hidden sm:inline", children: copy.prev })
+            /* @__PURE__ */ jsx39(ChevronLeft, { size: 12 }),
+            /* @__PURE__ */ jsx39("span", { className: "hidden sm:inline", children: copy.prev })
           ]
         }
       ),
-      /* @__PURE__ */ jsx38("div", { className: "flex items-center gap-1", children: pageNumbers.map(
-        (entry, index) => entry === "\u2026" ? /* @__PURE__ */ jsx38("span", { className: "w-7 text-center font-mono text-[11px] text-txt-4", children: "\u2026" }, `ellipsis-${index}`) : /* @__PURE__ */ jsx38(
+      /* @__PURE__ */ jsx39("div", { className: "flex items-center gap-1", children: pageNumbers.map(
+        (entry, index) => entry === "\u2026" ? /* @__PURE__ */ jsx39("span", { className: "w-7 text-center font-mono text-[11px] text-txt-4", children: "\u2026" }, `ellipsis-${index}`) : /* @__PURE__ */ jsx39(
           "button",
           {
             type: "button",
@@ -1799,8 +1867,8 @@ function Pagination({ page, totalPages, onChange, totalItems, pageSize, labels }
           title: copy.nextTitle,
           className: "flex items-center gap-1 border border-border px-2.5 py-1.5 font-mono text-[10px] text-txt-3 transition-colors hover:border-border-hi hover:text-txt-1 disabled:cursor-not-allowed disabled:opacity-30",
           children: [
-            /* @__PURE__ */ jsx38("span", { className: "hidden sm:inline", children: copy.next }),
-            /* @__PURE__ */ jsx38(ChevronRight, { size: 12 })
+            /* @__PURE__ */ jsx39("span", { className: "hidden sm:inline", children: copy.next }),
+            /* @__PURE__ */ jsx39(ChevronRight, { size: 12 })
           ]
         }
       )
@@ -1809,13 +1877,13 @@ function Pagination({ page, totalPages, onChange, totalItems, pageSize, labels }
 }
 
 // src/components/shared/SectionTitle.tsx
-import { jsx as jsx39 } from "react/jsx-runtime";
+import { jsx as jsx40 } from "react/jsx-runtime";
 function SectionTitle({ children, className = "" }) {
-  return /* @__PURE__ */ jsx39("h3", { className: `mb-1 text-sm font-semibold text-txt-1 ${className}`.trim(), children });
+  return /* @__PURE__ */ jsx40("h3", { className: `mb-1 text-sm font-semibold text-txt-1 ${className}`.trim(), children });
 }
 
 // src/components/shared/StatusBadge.tsx
-import { jsx as jsx40 } from "react/jsx-runtime";
+import { jsx as jsx41 } from "react/jsx-runtime";
 var BASE = "inline-flex items-center border px-2 py-0.5 font-mono text-[9px] font-bold uppercase tracking-[0.15em]";
 var variantStyles = {
   default: "border-[var(--tapiz-border-strong)] text-[var(--tapiz-text-secondary)] bg-[var(--tapiz-bg-surface-muted)]",
@@ -1828,13 +1896,13 @@ var variantStyles = {
   pending: "border-[var(--tapiz-text-muted)] text-[var(--tapiz-text-muted)] bg-transparent"
 };
 function StatusBadge({ label, variant = "default", className = "" }) {
-  return /* @__PURE__ */ jsx40("span", { className: `${BASE} ${variantStyles[variant]} ${className}`.trim(), children: label });
+  return /* @__PURE__ */ jsx41("span", { className: `${BASE} ${variantStyles[variant]} ${className}`.trim(), children: label });
 }
 
 // src/components/shared/ActionMenu.tsx
 import { useEffect as useEffect2, useLayoutEffect, useRef as useRef2, useState as useState5 } from "react";
 import { createPortal as createPortal4 } from "react-dom";
-import { Fragment as Fragment2, jsx as jsx41, jsxs as jsxs28 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx42, jsxs as jsxs28 } from "react/jsx-runtime";
 var defaultMenuStyle = {
   background: "var(--color-ink-200)",
   border: "1px solid var(--color-border-hi)",
@@ -1919,8 +1987,8 @@ function ActionMenu({
     };
   }, [open]);
   const menuNode = open && pos ? /* @__PURE__ */ jsxs28(Fragment2, { children: [
-    /* @__PURE__ */ jsx41("div", { className: "fixed inset-0 z-9998", onClick: () => setOpen(false) }),
-    /* @__PURE__ */ jsx41(
+    /* @__PURE__ */ jsx42("div", { className: "fixed inset-0 z-9998", onClick: () => setOpen(false) }),
+    /* @__PURE__ */ jsx42(
       "div",
       {
         ref: menuRef,
@@ -1938,7 +2006,7 @@ function ActionMenu({
           ...menuStyle
         },
         children: items.map((item, index) => /* @__PURE__ */ jsxs28("div", { children: [
-          index > 0 && item.danger ? /* @__PURE__ */ jsx41("div", { style: { borderTop: "1px solid var(--color-border)" } }) : null,
+          index > 0 && item.danger ? /* @__PURE__ */ jsx42("div", { style: { borderTop: "1px solid var(--color-border)" } }) : null,
           /* @__PURE__ */ jsxs28(
             "button",
             {
@@ -1951,8 +2019,8 @@ function ActionMenu({
                 item.onSelect();
               },
               children: [
-                item.loading ? /* @__PURE__ */ jsx41(Spinner, { color: "text-[var(--color-txt-3)]" }) : /* @__PURE__ */ jsx41("span", { className: item.danger ? "shrink-0 text-warn" : "shrink-0 text-primary-300", children: item.icon }),
-                /* @__PURE__ */ jsx41("span", { children: item.label })
+                item.loading ? /* @__PURE__ */ jsx42(Spinner, { color: "text-[var(--color-txt-3)]" }) : /* @__PURE__ */ jsx42("span", { className: item.danger ? "shrink-0 text-warn" : "shrink-0 text-primary-300", children: item.icon }),
+                /* @__PURE__ */ jsx42("span", { children: item.label })
               ]
             }
           )
@@ -1961,13 +2029,13 @@ function ActionMenu({
     )
   ] }) : null;
   return /* @__PURE__ */ jsxs28("div", { ref: btnRef, className: fullWidth ? "relative w-full" : "relative inline-block max-w-full", children: [
-    /* @__PURE__ */ jsx41(
+    /* @__PURE__ */ jsx42(
       Button,
       {
         size: buttonSize,
         variant: buttonVariant,
         icon,
-        iconRight: /* @__PURE__ */ jsx41(ChevronDown, { size: 11 }),
+        iconRight: /* @__PURE__ */ jsx42(ChevronDown, { size: 11 }),
         onClick: () => setOpen((value) => !value),
         className: buttonClassName,
         fullWidth,
@@ -1983,7 +2051,7 @@ import { useMemo as useMemo2, useState as useState6 } from "react";
 
 // src/components/table/DataTableRow.tsx
 import { memo } from "react";
-import { jsx as jsx42, jsxs as jsxs29 } from "react/jsx-runtime";
+import { jsx as jsx43, jsxs as jsxs29 } from "react/jsx-runtime";
 var ALIGN_CLASS = {
   left: "text-left",
   center: "text-center",
@@ -1997,7 +2065,7 @@ function DataTableRowInner({ row, columns, onRowClick, rowActions, densityCellCl
       onClick: clickable ? () => onRowClick?.(row) : void 0,
       className: `border-b border-[var(--tapiz-border-subtle)] transition-colors hover:bg-[var(--tapiz-bg-surface-muted)] ${striped ? "even:bg-[color-mix(in_srgb,var(--tapiz-bg-surface-muted)_35%,var(--tapiz-bg-surface))]" : ""} ${clickable ? "cursor-pointer" : ""}`,
       children: [
-        columns.map((column) => /* @__PURE__ */ jsx42(
+        columns.map((column) => /* @__PURE__ */ jsx43(
           "td",
           {
             className: `${densityCellClass} text-xs text-[var(--tapiz-text-secondary)] ${ALIGN_CLASS[column.align ?? "left"]} ${column.className ?? ""}`,
@@ -2005,7 +2073,7 @@ function DataTableRowInner({ row, columns, onRowClick, rowActions, densityCellCl
           },
           column.id
         )),
-        rowActions !== void 0 && /* @__PURE__ */ jsx42("td", { className: `${densityCellClass} text-right`, children: rowActions(row) })
+        rowActions !== void 0 && /* @__PURE__ */ jsx43("td", { className: `${densityCellClass} text-right`, children: rowActions(row) })
       ]
     }
   );
@@ -2013,7 +2081,7 @@ function DataTableRowInner({ row, columns, onRowClick, rowActions, densityCellCl
 var DataTableRow = memo(DataTableRowInner);
 
 // src/components/table/DataTable.tsx
-import { jsx as jsx43, jsxs as jsxs30 } from "react/jsx-runtime";
+import { jsx as jsx44, jsxs as jsxs30 } from "react/jsx-runtime";
 var ALIGN_CLASS2 = {
   left: "text-left",
   center: "text-center",
@@ -2082,17 +2150,17 @@ function DataTable({
     className
   ].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsxs30("div", { className: wrapperClass, children: [
-    mobileCard !== void 0 && /* @__PURE__ */ jsx43("div", { className: "md:hidden", children: isLoading ? Array.from({ length: loadingRows }).map((_, i) => /* @__PURE__ */ jsx43("div", { className: "h-16 animate-pulse bg-ink-300" }, i)) : sortedData.length === 0 ? emptyState : sortedData.map((row) => /* @__PURE__ */ jsx43("div", { children: mobileCard(row) }, rowKey(row))) }),
+    mobileCard !== void 0 && /* @__PURE__ */ jsx44("div", { className: "md:hidden", children: isLoading ? Array.from({ length: loadingRows }).map((_, i) => /* @__PURE__ */ jsx44("div", { className: "h-16 animate-pulse bg-ink-300" }, i)) : sortedData.length === 0 ? emptyState : sortedData.map((row) => /* @__PURE__ */ jsx44("div", { children: mobileCard(row) }, rowKey(row))) }),
     /* @__PURE__ */ jsxs30("table", { className: tableClass, children: [
-      /* @__PURE__ */ jsx43("thead", { children: /* @__PURE__ */ jsxs30("tr", { className: "border-b border-border bg-ink-300", children: [
+      /* @__PURE__ */ jsx44("thead", { children: /* @__PURE__ */ jsxs30("tr", { className: "border-b border-border bg-ink-300", children: [
         columns.map((column) => {
           const baseClass = `${densityHeaderClass} ${stickyHeader ? "sticky top-0 z-10" : ""} ${ALIGN_CLASS2[column.align ?? "left"]} font-mono text-[11px] tracking-[.08em] text-txt-4 font-semibold whitespace-nowrap`;
           if (!column.sortable || !column.sortAccessor) {
-            return /* @__PURE__ */ jsx43("th", { scope: "col", className: baseClass, children: column.header }, column.id);
+            return /* @__PURE__ */ jsx44("th", { scope: "col", className: baseClass, children: column.header }, column.id);
           }
           const active = serverSort ? serverSort.field === column.id : sort?.columnId === column.id;
           const direction = serverSort ? serverSort.dir : sort?.direction ?? "asc";
-          return /* @__PURE__ */ jsx43(
+          return /* @__PURE__ */ jsx44(
             "th",
             {
               scope: "col",
@@ -2106,7 +2174,7 @@ function DataTable({
                   className: `inline-flex items-center gap-1 select-none transition-colors hover:text-txt-1 ${active ? "text-txt-1" : ""}`,
                   children: [
                     column.header,
-                    active && (direction === "asc" ? /* @__PURE__ */ jsx43(ChevronUp, { size: 12 }) : /* @__PURE__ */ jsx43(ChevronDown, { size: 12 }))
+                    active && (direction === "asc" ? /* @__PURE__ */ jsx44(ChevronUp, { size: 12 }) : /* @__PURE__ */ jsx44(ChevronDown, { size: 12 }))
                   ]
                 }
               )
@@ -2114,9 +2182,9 @@ function DataTable({
             column.id
           );
         }),
-        hasActions && /* @__PURE__ */ jsx43("th", { scope: "col", className: "px-3 py-2.5 text-right font-mono text-[11px] tracking-[.08em] text-txt-4 font-semibold whitespace-nowrap" })
+        hasActions && /* @__PURE__ */ jsx44("th", { scope: "col", className: "px-3 py-2.5 text-right font-mono text-[11px] tracking-[.08em] text-txt-4 font-semibold whitespace-nowrap" })
       ] }) }),
-      /* @__PURE__ */ jsx43("tbody", { children: isLoading ? Array.from({ length: loadingRows }).map((_, rowIndex) => /* @__PURE__ */ jsx43("tr", { className: "border-b border-[var(--tapiz-border-subtle)]", children: Array.from({ length: colCount }).map((__, colIndex) => /* @__PURE__ */ jsx43("td", { className: densityCellClass, children: /* @__PURE__ */ jsx43("div", { className: "h-4 w-24 animate-pulse bg-[var(--tapiz-bg-surface-muted)]" }) }, colIndex)) }, rowIndex)) : sortedData.length === 0 ? /* @__PURE__ */ jsx43("tr", { children: /* @__PURE__ */ jsx43("td", { colSpan: colCount, className: "px-4 py-10 text-center text-txt-4 text-sm font-mono", children: emptyState }) }) : sortedData.map((row) => /* @__PURE__ */ jsx43(
+      /* @__PURE__ */ jsx44("tbody", { children: isLoading ? Array.from({ length: loadingRows }).map((_, rowIndex) => /* @__PURE__ */ jsx44("tr", { className: "border-b border-[var(--tapiz-border-subtle)]", children: Array.from({ length: colCount }).map((__, colIndex) => /* @__PURE__ */ jsx44("td", { className: densityCellClass, children: /* @__PURE__ */ jsx44("div", { className: "h-4 w-24 animate-pulse bg-[var(--tapiz-bg-surface-muted)]" }) }, colIndex)) }, rowIndex)) : sortedData.length === 0 ? /* @__PURE__ */ jsx44("tr", { children: /* @__PURE__ */ jsx44("td", { colSpan: colCount, className: "px-4 py-10 text-center text-txt-4 text-sm font-mono", children: emptyState }) }) : sortedData.map((row) => /* @__PURE__ */ jsx44(
         DataTableRow,
         {
           row,
@@ -2134,9 +2202,9 @@ function DataTable({
 }
 
 // src/components/marketing/MarketingShell.tsx
-import { jsx as jsx44 } from "react/jsx-runtime";
+import { jsx as jsx45 } from "react/jsx-runtime";
 function MarketingShell({ children, className = "", grid = true, noise = true }) {
-  return /* @__PURE__ */ jsx44(
+  return /* @__PURE__ */ jsx45(
     "main",
     {
       className: [
@@ -2151,93 +2219,93 @@ function MarketingShell({ children, className = "", grid = true, noise = true })
 }
 
 // src/components/marketing/HeroFrame.tsx
-import { jsx as jsx45, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx46, jsxs as jsxs31 } from "react/jsx-runtime";
 function HeroFrame({ eyebrow, title, description, actions, visual, meta, className = "" }) {
   return /* @__PURE__ */ jsxs31("section", { className: `mx-auto grid max-w-7xl gap-10 px-[var(--tapiz-space-page-x)] py-[var(--tapiz-space-section-y)] lg:grid-cols-[1fr_0.9fr] lg:items-center ${className}`, children: [
     /* @__PURE__ */ jsxs31("div", { className: "animate-fade-in-up", children: [
-      eyebrow ? /* @__PURE__ */ jsx45("div", { className: "kicker mb-4", children: eyebrow }) : null,
-      /* @__PURE__ */ jsx45("h1", { className: "max-w-4xl text-5xl font-semibold leading-[0.95] tracking-[-0.07em] text-[var(--tapiz-text-primary)] md:text-7xl", children: title }),
-      description ? /* @__PURE__ */ jsx45("p", { className: "mt-6 max-w-2xl text-base leading-7 text-[var(--tapiz-text-secondary)] md:text-lg", children: description }) : null,
-      actions ? /* @__PURE__ */ jsx45("div", { className: "mt-8 flex flex-wrap gap-3", children: actions }) : null,
-      meta ? /* @__PURE__ */ jsx45("div", { className: "mt-8 border-l-2 border-[var(--tapiz-accent)] pl-4 font-mono text-xs text-[var(--tapiz-text-muted)]", children: meta }) : null
+      eyebrow ? /* @__PURE__ */ jsx46("div", { className: "kicker mb-4", children: eyebrow }) : null,
+      /* @__PURE__ */ jsx46("h1", { className: "max-w-4xl text-5xl font-semibold leading-[0.95] tracking-[-0.07em] text-[var(--tapiz-text-primary)] md:text-7xl", children: title }),
+      description ? /* @__PURE__ */ jsx46("p", { className: "mt-6 max-w-2xl text-base leading-7 text-[var(--tapiz-text-secondary)] md:text-lg", children: description }) : null,
+      actions ? /* @__PURE__ */ jsx46("div", { className: "mt-8 flex flex-wrap gap-3", children: actions }) : null,
+      meta ? /* @__PURE__ */ jsx46("div", { className: "mt-8 border-l-2 border-[var(--tapiz-accent)] pl-4 font-mono text-xs text-[var(--tapiz-text-muted)]", children: meta }) : null
     ] }),
-    visual ? /* @__PURE__ */ jsx45("div", { className: "animate-scale-in border-2 border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] p-3 shadow-[var(--tapiz-shadow-brutal-lg)]", children: visual }) : null
+    visual ? /* @__PURE__ */ jsx46("div", { className: "animate-scale-in border-2 border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] p-3 shadow-[var(--tapiz-shadow-brutal-lg)]", children: visual }) : null
   ] });
 }
 
 // src/components/marketing/FeatureCard.tsx
-import { jsx as jsx46, jsxs as jsxs32 } from "react/jsx-runtime";
+import { jsx as jsx47, jsxs as jsxs32 } from "react/jsx-runtime";
 function FeatureCard({ title, description, icon, eyebrow, children, className = "", variant = "surface" }) {
   return /* @__PURE__ */ jsxs32(Card, { variant, hover: true, className: `group ${className}`, children: [
     /* @__PURE__ */ jsxs32("div", { className: "flex items-start gap-4", children: [
-      icon ? /* @__PURE__ */ jsx46("div", { className: "grid h-11 w-11 shrink-0 place-items-center border border-[var(--tapiz-border-strong)] bg-[var(--color-icon-bg)] text-[var(--tapiz-accent)] group-hover:translate-x-[-1px] group-hover:translate-y-[-1px]", children: icon }) : null,
+      icon ? /* @__PURE__ */ jsx47("div", { className: "grid h-11 w-11 shrink-0 place-items-center border border-[var(--tapiz-border-strong)] bg-[var(--color-icon-bg)] text-[var(--tapiz-accent)] group-hover:translate-x-[-1px] group-hover:translate-y-[-1px]", children: icon }) : null,
       /* @__PURE__ */ jsxs32("div", { className: "min-w-0", children: [
-        eyebrow ? /* @__PURE__ */ jsx46("div", { className: "kicker mb-1", children: eyebrow }) : null,
-        /* @__PURE__ */ jsx46("h3", { className: "text-lg font-semibold text-[var(--tapiz-text-primary)]", children: title }),
-        description ? /* @__PURE__ */ jsx46("p", { className: "mt-2 text-sm leading-6 text-[var(--tapiz-text-muted)]", children: description }) : null
+        eyebrow ? /* @__PURE__ */ jsx47("div", { className: "kicker mb-1", children: eyebrow }) : null,
+        /* @__PURE__ */ jsx47("h3", { className: "text-lg font-semibold text-[var(--tapiz-text-primary)]", children: title }),
+        description ? /* @__PURE__ */ jsx47("p", { className: "mt-2 text-sm leading-6 text-[var(--tapiz-text-muted)]", children: description }) : null
       ] })
     ] }),
-    children ? /* @__PURE__ */ jsx46("div", { className: "mt-5", children }) : null
+    children ? /* @__PURE__ */ jsx47("div", { className: "mt-5", children }) : null
   ] });
 }
 
 // src/components/marketing/FeatureGrid.tsx
-import { jsx as jsx47 } from "react/jsx-runtime";
+import { jsx as jsx48 } from "react/jsx-runtime";
 function FeatureGrid({ children, className = "" }) {
-  return /* @__PURE__ */ jsx47("div", { className: `grid gap-4 md:grid-cols-2 xl:grid-cols-3 ${className}`, children });
+  return /* @__PURE__ */ jsx48("div", { className: `grid gap-4 md:grid-cols-2 xl:grid-cols-3 ${className}`, children });
 }
 
 // src/components/marketing/CTASection.tsx
-import { jsx as jsx48, jsxs as jsxs33 } from "react/jsx-runtime";
+import { jsx as jsx49, jsxs as jsxs33 } from "react/jsx-runtime";
 function CTASection({ eyebrow, title, description, actions, className = "" }) {
-  return /* @__PURE__ */ jsx48("section", { className: `mx-auto max-w-7xl px-[var(--tapiz-space-page-x)] py-[var(--tapiz-space-section-y)] ${className}`, children: /* @__PURE__ */ jsxs33("div", { className: "border-2 border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] p-8 shadow-[var(--tapiz-shadow-brutal-lg)] md:p-12", children: [
-    eyebrow ? /* @__PURE__ */ jsx48("div", { className: "kicker mb-3", children: eyebrow }) : null,
+  return /* @__PURE__ */ jsx49("section", { className: `mx-auto max-w-7xl px-[var(--tapiz-space-page-x)] py-[var(--tapiz-space-section-y)] ${className}`, children: /* @__PURE__ */ jsxs33("div", { className: "border-2 border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] p-8 shadow-[var(--tapiz-shadow-brutal-lg)] md:p-12", children: [
+    eyebrow ? /* @__PURE__ */ jsx49("div", { className: "kicker mb-3", children: eyebrow }) : null,
     /* @__PURE__ */ jsxs33("div", { className: "grid gap-6 lg:grid-cols-[1fr_auto] lg:items-end", children: [
       /* @__PURE__ */ jsxs33("div", { children: [
-        /* @__PURE__ */ jsx48("h2", { className: "max-w-3xl text-3xl font-semibold tracking-[-0.05em] md:text-5xl", children: title }),
-        description ? /* @__PURE__ */ jsx48("p", { className: "mt-4 max-w-2xl text-base leading-7 text-[var(--tapiz-text-secondary)]", children: description }) : null
+        /* @__PURE__ */ jsx49("h2", { className: "max-w-3xl text-3xl font-semibold tracking-[-0.05em] md:text-5xl", children: title }),
+        description ? /* @__PURE__ */ jsx49("p", { className: "mt-4 max-w-2xl text-base leading-7 text-[var(--tapiz-text-secondary)]", children: description }) : null
       ] }),
-      actions ? /* @__PURE__ */ jsx48("div", { className: "flex flex-wrap gap-3", children: actions }) : null
+      actions ? /* @__PURE__ */ jsx49("div", { className: "flex flex-wrap gap-3", children: actions }) : null
     ] })
   ] }) });
 }
 
 // src/components/marketing/MockupFrame.tsx
-import { jsx as jsx49, jsxs as jsxs34 } from "react/jsx-runtime";
+import { jsx as jsx50, jsxs as jsxs34 } from "react/jsx-runtime";
 function MockupFrame({ children, title, toolbar, className = "" }) {
   return /* @__PURE__ */ jsxs34("div", { className: `overflow-hidden border-2 border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] shadow-[var(--tapiz-shadow-brutal)] ${className}`, children: [
     /* @__PURE__ */ jsxs34("div", { className: "flex items-center justify-between border-b border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface-muted)] px-3 py-2", children: [
       /* @__PURE__ */ jsxs34("div", { className: "flex items-center gap-1.5", children: [
-        /* @__PURE__ */ jsx49("span", { className: "h-2.5 w-2.5 border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-danger)]" }),
-        /* @__PURE__ */ jsx49("span", { className: "h-2.5 w-2.5 border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-warning)]" }),
-        /* @__PURE__ */ jsx49("span", { className: "h-2.5 w-2.5 border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-success)]" })
+        /* @__PURE__ */ jsx50("span", { className: "h-2.5 w-2.5 border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-danger)]" }),
+        /* @__PURE__ */ jsx50("span", { className: "h-2.5 w-2.5 border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-warning)]" }),
+        /* @__PURE__ */ jsx50("span", { className: "h-2.5 w-2.5 border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-success)]" })
       ] }),
-      title ? /* @__PURE__ */ jsx49("div", { className: "font-mono text-[10px] uppercase tracking-widest text-[var(--tapiz-text-muted)]", children: title }) : null,
-      /* @__PURE__ */ jsx49("div", { children: toolbar })
+      title ? /* @__PURE__ */ jsx50("div", { className: "font-mono text-[10px] uppercase tracking-widest text-[var(--tapiz-text-muted)]", children: title }) : null,
+      /* @__PURE__ */ jsx50("div", { children: toolbar })
     ] }),
-    /* @__PURE__ */ jsx49("div", { className: "p-4", children })
+    /* @__PURE__ */ jsx50("div", { className: "p-4", children })
   ] });
 }
 
 // src/components/marketing/ComparisonTable.tsx
-import { jsx as jsx50, jsxs as jsxs35 } from "react/jsx-runtime";
+import { jsx as jsx51, jsxs as jsxs35 } from "react/jsx-runtime";
 function ComparisonTable({ rows, featureHeader = "Feature", includedHeader = "Tapiz", alternativeHeader = "Other", className = "" }) {
-  return /* @__PURE__ */ jsx50("div", { className: `overflow-x-auto border border-[var(--tapiz-border-strong)] ${className}`, children: /* @__PURE__ */ jsxs35("table", { className: "w-full text-sm", children: [
-    /* @__PURE__ */ jsx50("thead", { children: /* @__PURE__ */ jsxs35("tr", { children: [
-      /* @__PURE__ */ jsx50("th", { className: "px-4 py-3 text-left", children: featureHeader }),
-      /* @__PURE__ */ jsx50("th", { className: "px-4 py-3 text-left", children: includedHeader }),
-      /* @__PURE__ */ jsx50("th", { className: "px-4 py-3 text-left", children: alternativeHeader })
+  return /* @__PURE__ */ jsx51("div", { className: `overflow-x-auto border border-[var(--tapiz-border-strong)] ${className}`, children: /* @__PURE__ */ jsxs35("table", { className: "w-full text-sm", children: [
+    /* @__PURE__ */ jsx51("thead", { children: /* @__PURE__ */ jsxs35("tr", { children: [
+      /* @__PURE__ */ jsx51("th", { className: "px-4 py-3 text-left", children: featureHeader }),
+      /* @__PURE__ */ jsx51("th", { className: "px-4 py-3 text-left", children: includedHeader }),
+      /* @__PURE__ */ jsx51("th", { className: "px-4 py-3 text-left", children: alternativeHeader })
     ] }) }),
-    /* @__PURE__ */ jsx50("tbody", { children: rows.map((row, index) => /* @__PURE__ */ jsxs35("tr", { className: "border-t border-[var(--tapiz-border-subtle)]", children: [
-      /* @__PURE__ */ jsx50("td", { className: "px-4 py-3 font-medium text-[var(--tapiz-text-primary)]", children: row.feature }),
-      /* @__PURE__ */ jsx50("td", { className: "px-4 py-3 text-[var(--tapiz-text-secondary)]", children: row.included }),
-      /* @__PURE__ */ jsx50("td", { className: "px-4 py-3 text-[var(--tapiz-text-muted)]", children: row.alternative })
+    /* @__PURE__ */ jsx51("tbody", { children: rows.map((row, index) => /* @__PURE__ */ jsxs35("tr", { className: "border-t border-[var(--tapiz-border-subtle)]", children: [
+      /* @__PURE__ */ jsx51("td", { className: "px-4 py-3 font-medium text-[var(--tapiz-text-primary)]", children: row.feature }),
+      /* @__PURE__ */ jsx51("td", { className: "px-4 py-3 text-[var(--tapiz-text-secondary)]", children: row.included }),
+      /* @__PURE__ */ jsx51("td", { className: "px-4 py-3 text-[var(--tapiz-text-muted)]", children: row.alternative })
     ] }, index)) })
   ] }) });
 }
 
 // src/components/layout/AppShell.tsx
-import { jsx as jsx51, jsxs as jsxs36 } from "react/jsx-runtime";
+import { jsx as jsx52, jsxs as jsxs36 } from "react/jsx-runtime";
 var variantClasses4 = {
   default: "bg-[var(--tapiz-bg-page)]",
   grid: "bg-[var(--tapiz-bg-page)] tapiz-grid-bg",
@@ -2247,15 +2315,15 @@ function AppShell({ sidebar, topbar, children, aside, className = "", contentCla
   return /* @__PURE__ */ jsxs36("div", { className: `min-h-screen text-[var(--tapiz-text-primary)] ${variantClasses4[variant]} ${className}`, children: [
     topbar,
     /* @__PURE__ */ jsxs36("div", { className: "mx-auto flex w-full max-w-[1600px]", children: [
-      sidebar ? /* @__PURE__ */ jsx51("aside", { className: "hidden min-h-[calc(100vh-1px)] w-72 shrink-0 border-r border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] lg:block", children: sidebar }) : null,
-      /* @__PURE__ */ jsx51("main", { className: `min-w-0 flex-1 px-[var(--tapiz-space-page-x)] py-6 ${contentClassName}`, children }),
-      aside ? /* @__PURE__ */ jsx51("aside", { className: "hidden w-80 shrink-0 border-l border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] xl:block", children: aside }) : null
+      sidebar ? /* @__PURE__ */ jsx52("aside", { className: "hidden min-h-[calc(100vh-1px)] w-72 shrink-0 border-r border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] lg:block", children: sidebar }) : null,
+      /* @__PURE__ */ jsx52("main", { className: `min-w-0 flex-1 px-[var(--tapiz-space-page-x)] py-6 ${contentClassName}`, children }),
+      aside ? /* @__PURE__ */ jsx52("aside", { className: "hidden w-80 shrink-0 border-l border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] xl:block", children: aside }) : null
     ] })
   ] });
 }
 
 // src/components/layout/SplitPane.tsx
-import { jsx as jsx52, jsxs as jsxs37 } from "react/jsx-runtime";
+import { jsx as jsx53, jsxs as jsxs37 } from "react/jsx-runtime";
 var ratios = {
   "50/50": "lg:grid-cols-2",
   "60/40": "lg:grid-cols-[minmax(0,3fr)_minmax(320px,2fr)]",
@@ -2263,48 +2331,48 @@ var ratios = {
 };
 function SplitPane({ primary, secondary, ratio = "60/40", reverseOnMobile = false, className = "" }) {
   return /* @__PURE__ */ jsxs37("div", { className: `grid gap-5 ${ratios[ratio]} ${className}`, children: [
-    /* @__PURE__ */ jsx52("div", { className: reverseOnMobile ? "order-2 lg:order-1" : "", children: primary }),
-    /* @__PURE__ */ jsx52("div", { className: reverseOnMobile ? "order-1 lg:order-2" : "", children: secondary })
+    /* @__PURE__ */ jsx53("div", { className: reverseOnMobile ? "order-2 lg:order-1" : "", children: primary }),
+    /* @__PURE__ */ jsx53("div", { className: reverseOnMobile ? "order-1 lg:order-2" : "", children: secondary })
   ] });
 }
 
 // src/components/layout/Stack.tsx
-import { jsx as jsx53 } from "react/jsx-runtime";
+import { jsx as jsx54 } from "react/jsx-runtime";
 var gapClasses = { xs: "gap-1", sm: "gap-2", md: "gap-4", lg: "gap-6", xl: "gap-8" };
 var alignClasses = { start: "items-start", center: "items-center", end: "items-end", stretch: "items-stretch" };
 var justifyClasses = { start: "justify-start", center: "justify-center", between: "justify-between", end: "justify-end" };
 function Stack({ children, gap = "md", direction = "vertical", align = "stretch", justify = "start", wrap = false, className = "" }) {
-  return /* @__PURE__ */ jsx53("div", { className: `flex ${direction === "vertical" ? "flex-col" : "flex-row"} ${gapClasses[gap]} ${alignClasses[align]} ${justifyClasses[justify]} ${wrap ? "flex-wrap" : ""} ${className}`, children });
+  return /* @__PURE__ */ jsx54("div", { className: `flex ${direction === "vertical" ? "flex-col" : "flex-row"} ${gapClasses[gap]} ${alignClasses[align]} ${justifyClasses[justify]} ${wrap ? "flex-wrap" : ""} ${className}`, children });
 }
 
 // src/components/layout/Cluster.tsx
-import { jsx as jsx54 } from "react/jsx-runtime";
+import { jsx as jsx55 } from "react/jsx-runtime";
 var gapClasses2 = { xs: "gap-1", sm: "gap-2", md: "gap-3", lg: "gap-5" };
 var alignClasses2 = { start: "items-start", center: "items-center", end: "items-end" };
 var justifyClasses2 = { start: "justify-start", center: "justify-center", between: "justify-between", end: "justify-end" };
 function Cluster({ children, gap = "sm", align = "center", justify = "start", className = "" }) {
-  return /* @__PURE__ */ jsx54("div", { className: `flex flex-wrap ${gapClasses2[gap]} ${alignClasses2[align]} ${justifyClasses2[justify]} ${className}`, children });
+  return /* @__PURE__ */ jsx55("div", { className: `flex flex-wrap ${gapClasses2[gap]} ${alignClasses2[align]} ${justifyClasses2[justify]} ${className}`, children });
 }
 
 // src/components/navigation/Breadcrumbs.tsx
-import { jsx as jsx55, jsxs as jsxs38 } from "react/jsx-runtime";
+import { jsx as jsx56, jsxs as jsxs38 } from "react/jsx-runtime";
 function Breadcrumbs({ items, separator = "/", className = "" }) {
-  return /* @__PURE__ */ jsx55("nav", { "aria-label": "Breadcrumb", className: `font-mono text-[10px] uppercase tracking-[0.18em] text-[var(--tapiz-text-muted)] ${className}`, children: /* @__PURE__ */ jsx55("ol", { className: "flex flex-wrap items-center gap-2", children: items.map((item, index) => /* @__PURE__ */ jsxs38("li", { className: "flex items-center gap-2", children: [
-    index > 0 ? /* @__PURE__ */ jsx55("span", { "aria-hidden": "true", className: "text-[var(--tapiz-text-disabled)]", children: separator }) : null,
-    item.href && !item.current ? /* @__PURE__ */ jsx55("a", { className: "hover:text-[var(--tapiz-accent)]", href: item.href, children: item.label }) : /* @__PURE__ */ jsx55("span", { "aria-current": item.current ? "page" : void 0, className: item.current ? "text-[var(--tapiz-text-primary)]" : "", children: item.label })
+  return /* @__PURE__ */ jsx56("nav", { "aria-label": "Breadcrumb", className: `font-mono text-[10px] uppercase tracking-[0.18em] text-[var(--tapiz-text-muted)] ${className}`, children: /* @__PURE__ */ jsx56("ol", { className: "flex flex-wrap items-center gap-2", children: items.map((item, index) => /* @__PURE__ */ jsxs38("li", { className: "flex items-center gap-2", children: [
+    index > 0 ? /* @__PURE__ */ jsx56("span", { "aria-hidden": "true", className: "text-[var(--tapiz-text-disabled)]", children: separator }) : null,
+    item.href && !item.current ? /* @__PURE__ */ jsx56("a", { className: "hover:text-[var(--tapiz-accent)]", href: item.href, children: item.label }) : /* @__PURE__ */ jsx56("span", { "aria-current": item.current ? "page" : void 0, className: item.current ? "text-[var(--tapiz-text-primary)]" : "", children: item.label })
   ] }, index)) }) });
 }
 
 // src/components/navigation/SidebarNav.tsx
-import { Fragment as Fragment3, jsx as jsx56, jsxs as jsxs39 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx57, jsxs as jsxs39 } from "react/jsx-runtime";
 function SidebarNav({ groups, header, footer, className = "" }) {
   return /* @__PURE__ */ jsxs39("div", { className: `flex h-full min-h-screen flex-col bg-[var(--tapiz-bg-surface)] ${className}`, children: [
-    header ? /* @__PURE__ */ jsx56("div", { className: "border-b border-[var(--tapiz-border-subtle)] p-4", children: header }) : null,
-    /* @__PURE__ */ jsx56("nav", { className: "flex-1 space-y-6 p-3", children: groups.map((group, groupIndex) => /* @__PURE__ */ jsxs39("div", { children: [
-      group.label ? /* @__PURE__ */ jsx56("div", { className: "mb-2 px-2 font-mono text-[10px] font-bold uppercase tracking-[0.18em] text-[var(--tapiz-text-muted)]", children: group.label }) : null,
-      /* @__PURE__ */ jsx56("div", { className: "space-y-1", children: group.items.map((item, itemIndex) => /* @__PURE__ */ jsx56(SidebarNavLink, { item }, itemIndex)) })
+    header ? /* @__PURE__ */ jsx57("div", { className: "border-b border-[var(--tapiz-border-subtle)] p-4", children: header }) : null,
+    /* @__PURE__ */ jsx57("nav", { className: "flex-1 space-y-6 p-3", children: groups.map((group, groupIndex) => /* @__PURE__ */ jsxs39("div", { children: [
+      group.label ? /* @__PURE__ */ jsx57("div", { className: "mb-2 px-2 font-mono text-[10px] font-bold uppercase tracking-[0.18em] text-[var(--tapiz-text-muted)]", children: group.label }) : null,
+      /* @__PURE__ */ jsx57("div", { className: "space-y-1", children: group.items.map((item, itemIndex) => /* @__PURE__ */ jsx57(SidebarNavLink, { item }, itemIndex)) })
     ] }, groupIndex)) }),
-    footer ? /* @__PURE__ */ jsx56("div", { className: "border-t border-[var(--tapiz-border-subtle)] p-4", children: footer }) : null
+    footer ? /* @__PURE__ */ jsx57("div", { className: "border-t border-[var(--tapiz-border-subtle)] p-4", children: footer }) : null
   ] });
 }
 function SidebarNavLink({ item }) {
@@ -2314,28 +2382,28 @@ function SidebarNavLink({ item }) {
     item.disabled ? "pointer-events-none opacity-40" : ""
   ].filter(Boolean).join(" ");
   const content = /* @__PURE__ */ jsxs39(Fragment3, { children: [
-    item.icon ? /* @__PURE__ */ jsx56("span", { className: "grid size-5 place-items-center text-[var(--tapiz-text-muted)]", children: item.icon }) : null,
-    /* @__PURE__ */ jsx56("span", { className: "min-w-0 flex-1 truncate", children: item.label }),
-    item.badge ? /* @__PURE__ */ jsx56("span", { children: item.badge }) : null
+    item.icon ? /* @__PURE__ */ jsx57("span", { className: "grid size-5 place-items-center text-[var(--tapiz-text-muted)]", children: item.icon }) : null,
+    /* @__PURE__ */ jsx57("span", { className: "min-w-0 flex-1 truncate", children: item.label }),
+    item.badge ? /* @__PURE__ */ jsx57("span", { children: item.badge }) : null
   ] });
-  return item.href ? /* @__PURE__ */ jsx56("a", { className, href: item.href, children: content }) : /* @__PURE__ */ jsx56("button", { type: "button", className, onClick: item.onClick, disabled: item.disabled, children: content });
+  return item.href ? /* @__PURE__ */ jsx57("a", { className, href: item.href, children: content }) : /* @__PURE__ */ jsx57("button", { type: "button", className, onClick: item.onClick, disabled: item.disabled, children: content });
 }
 
 // src/components/navigation/TopNav.tsx
-import { jsx as jsx57, jsxs as jsxs40 } from "react/jsx-runtime";
+import { jsx as jsx58, jsxs as jsxs40 } from "react/jsx-runtime";
 function TopNav({ brand, links = [], actions, className = "", sticky = true }) {
-  return /* @__PURE__ */ jsx57("header", { className: `${sticky ? "sticky top-0 z-40" : ""} border-b border-[var(--tapiz-border-subtle)] bg-[color-mix(in_srgb,var(--tapiz-bg-surface)_88%,transparent)] backdrop-blur-xl ${className}`, children: /* @__PURE__ */ jsxs40("div", { className: "mx-auto flex h-16 max-w-[1600px] items-center gap-6 px-[var(--tapiz-space-page-x)]", children: [
-    brand ? /* @__PURE__ */ jsx57("div", { className: "shrink-0", children: brand }) : null,
-    /* @__PURE__ */ jsx57("nav", { className: "hidden items-center gap-1 md:flex", children: links.map((link, index) => {
+  return /* @__PURE__ */ jsx58("header", { className: `${sticky ? "sticky top-0 z-40" : ""} border-b border-[var(--tapiz-border-subtle)] bg-[color-mix(in_srgb,var(--tapiz-bg-surface)_88%,transparent)] backdrop-blur-xl ${className}`, children: /* @__PURE__ */ jsxs40("div", { className: "mx-auto flex h-16 max-w-[1600px] items-center gap-6 px-[var(--tapiz-space-page-x)]", children: [
+    brand ? /* @__PURE__ */ jsx58("div", { className: "shrink-0", children: brand }) : null,
+    /* @__PURE__ */ jsx58("nav", { className: "hidden items-center gap-1 md:flex", children: links.map((link, index) => {
       const cls = `border px-3 py-1.5 text-sm font-medium ${link.active ? "border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface-muted)] text-[var(--tapiz-text-primary)]" : "border-transparent text-[var(--tapiz-text-secondary)] hover:border-[var(--tapiz-border-subtle)] hover:text-[var(--tapiz-text-primary)]"}`;
-      return link.href ? /* @__PURE__ */ jsx57("a", { href: link.href, className: cls, children: link.label }, index) : /* @__PURE__ */ jsx57("button", { type: "button", onClick: link.onClick, className: cls, children: link.label }, index);
+      return link.href ? /* @__PURE__ */ jsx58("a", { href: link.href, className: cls, children: link.label }, index) : /* @__PURE__ */ jsx58("button", { type: "button", onClick: link.onClick, className: cls, children: link.label }, index);
     }) }),
-    actions ? /* @__PURE__ */ jsx57("div", { className: "ml-auto flex items-center gap-2", children: actions }) : null
+    actions ? /* @__PURE__ */ jsx58("div", { className: "ml-auto flex items-center gap-2", children: actions }) : null
   ] }) });
 }
 
 // src/components/disclosure/Tabs.tsx
-import { jsx as jsx58, jsxs as jsxs41 } from "react/jsx-runtime";
+import { jsx as jsx59, jsxs as jsxs41 } from "react/jsx-runtime";
 var variants = {
   line: "border-b border-[var(--tapiz-border-subtle)]",
   boxed: "border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)] p-1",
@@ -2344,7 +2412,7 @@ var variants = {
 function Tabs({ items, activeId, onChange, className = "", variant = "line" }) {
   const active = items.find((item) => item.id === activeId) ?? items[0];
   return /* @__PURE__ */ jsxs41("div", { className, children: [
-    /* @__PURE__ */ jsx58("div", { role: "tablist", className: `flex flex-wrap gap-1 ${variants[variant]}`, children: items.map((item) => {
+    /* @__PURE__ */ jsx59("div", { role: "tablist", className: `flex flex-wrap gap-1 ${variants[variant]}`, children: items.map((item) => {
       const selected = item.id === active?.id;
       return /* @__PURE__ */ jsxs41(
         "button",
@@ -2363,14 +2431,14 @@ function Tabs({ items, activeId, onChange, className = "", variant = "line" }) {
         item.id
       );
     }) }),
-    /* @__PURE__ */ jsx58("div", { role: "tabpanel", className: "pt-4", children: active?.content })
+    /* @__PURE__ */ jsx59("div", { role: "tabpanel", className: "pt-4", children: active?.content })
   ] });
 }
 
 // src/components/disclosure/Accordion.tsx
-import { jsx as jsx59, jsxs as jsxs42 } from "react/jsx-runtime";
+import { jsx as jsx60, jsxs as jsxs42 } from "react/jsx-runtime";
 function Accordion({ items, openIds = [], onToggle, className = "" }) {
-  return /* @__PURE__ */ jsx59("div", { className: `divide-y divide-[var(--tapiz-border-subtle)] border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] ${className}`, children: items.map((item) => {
+  return /* @__PURE__ */ jsx60("div", { className: `divide-y divide-[var(--tapiz-border-subtle)] border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] ${className}`, children: items.map((item) => {
     const open = openIds.includes(item.id);
     return /* @__PURE__ */ jsxs42("section", { children: [
       /* @__PURE__ */ jsxs42(
@@ -2382,21 +2450,21 @@ function Accordion({ items, openIds = [], onToggle, className = "" }) {
           onClick: () => onToggle?.(item.id),
           className: "flex w-full items-center justify-between gap-4 px-4 py-3 text-left disabled:opacity-40",
           children: [
-            /* @__PURE__ */ jsx59("span", { className: "font-semibold text-[var(--tapiz-text-primary)]", children: item.title }),
+            /* @__PURE__ */ jsx60("span", { className: "font-semibold text-[var(--tapiz-text-primary)]", children: item.title }),
             /* @__PURE__ */ jsxs42("span", { className: "flex items-center gap-3 text-[var(--tapiz-text-muted)]", children: [
               item.meta,
-              /* @__PURE__ */ jsx59("span", { "aria-hidden": "true", className: "font-mono text-lg", children: open ? "\u2212" : "+" })
+              /* @__PURE__ */ jsx60("span", { "aria-hidden": "true", className: "font-mono text-lg", children: open ? "\u2212" : "+" })
             ] })
           ]
         }
       ),
-      open ? /* @__PURE__ */ jsx59("div", { className: "border-t border-[var(--tapiz-border-subtle)] px-4 py-4 text-sm text-[var(--tapiz-text-secondary)]", children: item.content }) : null
+      open ? /* @__PURE__ */ jsx60("div", { className: "border-t border-[var(--tapiz-border-subtle)] px-4 py-4 text-sm text-[var(--tapiz-text-secondary)]", children: item.content }) : null
     ] }, item.id);
   }) });
 }
 
 // src/components/disclosure/Stepper.tsx
-import { jsx as jsx60, jsxs as jsxs43 } from "react/jsx-runtime";
+import { jsx as jsx61, jsxs as jsxs43 } from "react/jsx-runtime";
 var tone = {
   complete: "border-[var(--tapiz-success)] bg-[var(--tapiz-success-soft)] text-[var(--tapiz-success)]",
   current: "border-[var(--tapiz-accent)] bg-[var(--tapiz-accent-soft)] text-[var(--tapiz-accent)]",
@@ -2404,65 +2472,65 @@ var tone = {
   error: "border-[var(--tapiz-danger)] bg-[var(--tapiz-danger-soft)] text-[var(--tapiz-danger)]"
 };
 function Stepper({ steps, orientation = "horizontal", className = "" }) {
-  return /* @__PURE__ */ jsx60("ol", { className: `grid gap-3 ${orientation === "horizontal" ? "md:grid-cols-[repeat(auto-fit,minmax(0,1fr))]" : ""} ${className}`, children: steps.map((step, index) => {
+  return /* @__PURE__ */ jsx61("ol", { className: `grid gap-3 ${orientation === "horizontal" ? "md:grid-cols-[repeat(auto-fit,minmax(0,1fr))]" : ""} ${className}`, children: steps.map((step, index) => {
     const status = step.status ?? "upcoming";
     return /* @__PURE__ */ jsxs43("li", { className: "flex gap-3", children: [
-      /* @__PURE__ */ jsx60("span", { className: `grid size-8 shrink-0 place-items-center border font-mono text-xs font-bold ${tone[status]}`, children: status === "complete" ? "\u2713" : index + 1 }),
+      /* @__PURE__ */ jsx61("span", { className: `grid size-8 shrink-0 place-items-center border font-mono text-xs font-bold ${tone[status]}`, children: status === "complete" ? "\u2713" : index + 1 }),
       /* @__PURE__ */ jsxs43("span", { className: "min-w-0", children: [
-        /* @__PURE__ */ jsx60("span", { className: "block text-sm font-semibold text-[var(--tapiz-text-primary)]", children: step.label }),
-        step.description ? /* @__PURE__ */ jsx60("span", { className: "mt-1 block text-xs text-[var(--tapiz-text-muted)]", children: step.description }) : null
+        /* @__PURE__ */ jsx61("span", { className: "block text-sm font-semibold text-[var(--tapiz-text-primary)]", children: step.label }),
+        step.description ? /* @__PURE__ */ jsx61("span", { className: "mt-1 block text-xs text-[var(--tapiz-text-muted)]", children: step.description }) : null
       ] })
     ] }, step.id);
   }) });
 }
 
 // src/components/overlays/Drawer.tsx
-import { jsx as jsx61, jsxs as jsxs44 } from "react/jsx-runtime";
+import { jsx as jsx62, jsxs as jsxs44 } from "react/jsx-runtime";
 function Drawer({ open, onClose, title, description, children, footer, side = "right", className = "" }) {
   if (!open) return null;
   return /* @__PURE__ */ jsxs44("div", { className: "fixed inset-0 z-50", children: [
-    /* @__PURE__ */ jsx61("button", { type: "button", "aria-label": "Close drawer", className: "absolute inset-0 bg-(--tapiz-bg-overlay)", onClick: onClose }),
+    /* @__PURE__ */ jsx62("button", { type: "button", "aria-label": "Close drawer", className: "absolute inset-0 bg-(--tapiz-bg-overlay)", onClick: onClose }),
     /* @__PURE__ */ jsxs44("section", { className: `absolute top-0 h-full w-full max-w-md border-(--tapiz-border-strong) bg-(--tapiz-bg-surface) shadow-(--tapiz-shadow-lg) ${side === "right" ? "right-0 border-l" : "left-0 border-r"} ${className}`, children: [
       /* @__PURE__ */ jsxs44("header", { className: "flex items-start justify-between gap-4 border-b border-(--tapiz-border-subtle) p-5", children: [
         /* @__PURE__ */ jsxs44("div", { children: [
-          title ? /* @__PURE__ */ jsx61("h2", { className: "text-lg font-semibold text-(--tapiz-text-primary)", children: title }) : null,
-          description ? /* @__PURE__ */ jsx61("p", { className: "mt-1 text-sm text-(--tapiz-text-muted)", children: description }) : null
+          title ? /* @__PURE__ */ jsx62("h2", { className: "text-lg font-semibold text-(--tapiz-text-primary)", children: title }) : null,
+          description ? /* @__PURE__ */ jsx62("p", { className: "mt-1 text-sm text-(--tapiz-text-muted)", children: description }) : null
         ] }),
-        /* @__PURE__ */ jsx61("button", { type: "button", onClick: onClose, className: "border border-(--tapiz-border-subtle) px-2 py-1 font-mono text-sm text-(--tapiz-text-muted) hover:text-(--tapiz-text-primary)", children: "\xD7" })
+        /* @__PURE__ */ jsx62("button", { type: "button", onClick: onClose, className: "border border-(--tapiz-border-subtle) px-2 py-1 font-mono text-sm text-(--tapiz-text-muted) hover:text-(--tapiz-text-primary)", children: "\xD7" })
       ] }),
-      /* @__PURE__ */ jsx61("div", { className: "max-h-[calc(100vh-9rem)] overflow-auto p-5", children }),
-      footer ? /* @__PURE__ */ jsx61("footer", { className: "border-t border-(--tapiz-border-subtle) p-4", children: footer }) : null
+      /* @__PURE__ */ jsx62("div", { className: "max-h-[calc(100vh-9rem)] overflow-auto p-5", children }),
+      footer ? /* @__PURE__ */ jsx62("footer", { className: "border-t border-(--tapiz-border-subtle) p-4", children: footer }) : null
     ] })
   ] });
 }
 
 // src/components/overlays/Popover.tsx
-import { jsx as jsx62, jsxs as jsxs45 } from "react/jsx-runtime";
+import { jsx as jsx63, jsxs as jsxs45 } from "react/jsx-runtime";
 function Popover({ trigger, children, open = false, align = "start", className = "" }) {
   return /* @__PURE__ */ jsxs45("div", { className: `relative inline-block ${className}`, children: [
     trigger,
-    open ? /* @__PURE__ */ jsx62("div", { className: `absolute top-full z-40 mt-2 min-w-64 border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] p-2 shadow-[var(--tapiz-shadow-md)] ${align === "end" ? "right-0" : "left-0"}`, children }) : null
+    open ? /* @__PURE__ */ jsx63("div", { className: `absolute top-full z-40 mt-2 min-w-64 border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] p-2 shadow-[var(--tapiz-shadow-md)] ${align === "end" ? "right-0" : "left-0"}`, children }) : null
   ] });
 }
 
 // src/components/overlays/CommandMenu.tsx
-import { jsx as jsx63, jsxs as jsxs46 } from "react/jsx-runtime";
+import { jsx as jsx64, jsxs as jsxs46 } from "react/jsx-runtime";
 function CommandMenu({ open, onClose, query = "", onQueryChange, groups, placeholder = "Search commands\u2026", empty = "No commands found." }) {
   if (!open) return null;
   const hasItems = groups.some((group) => group.items.length > 0);
-  return /* @__PURE__ */ jsx63("div", { className: "fixed inset-0 z-50 grid place-items-start bg-[var(--tapiz-bg-overlay)] px-4 pt-[12vh]", onClick: onClose, children: /* @__PURE__ */ jsxs46("div", { className: "mx-auto w-full max-w-2xl border-2 border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] shadow-[var(--tapiz-shadow-brutal-lg)]", onClick: (e) => e.stopPropagation(), children: [
-    /* @__PURE__ */ jsx63("div", { className: "border-b border-[var(--tapiz-border-subtle)] p-3", children: /* @__PURE__ */ jsx63(SearchInput, { value: query, onChange: (value) => onQueryChange?.(value), placeholder, autoFocus: true }) }),
+  return /* @__PURE__ */ jsx64("div", { className: "fixed inset-0 z-50 grid place-items-start bg-[var(--tapiz-bg-overlay)] px-4 pt-[12vh]", onClick: onClose, children: /* @__PURE__ */ jsxs46("div", { className: "mx-auto w-full max-w-2xl border-2 border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] shadow-[var(--tapiz-shadow-brutal-lg)]", onClick: (e) => e.stopPropagation(), children: [
+    /* @__PURE__ */ jsx64("div", { className: "border-b border-[var(--tapiz-border-subtle)] p-3", children: /* @__PURE__ */ jsx64(SearchInput, { value: query, onChange: (value) => onQueryChange?.(value), placeholder, autoFocus: true }) }),
     /* @__PURE__ */ jsxs46("div", { className: "max-h-[50vh] overflow-auto p-2", children: [
-      !hasItems ? /* @__PURE__ */ jsx63("div", { className: "p-6 text-center text-sm text-[var(--tapiz-text-muted)]", children: empty }) : null,
+      !hasItems ? /* @__PURE__ */ jsx64("div", { className: "p-6 text-center text-sm text-[var(--tapiz-text-muted)]", children: empty }) : null,
       groups.map((group, groupIndex) => /* @__PURE__ */ jsxs46("div", { className: "py-2", children: [
-        group.label ? /* @__PURE__ */ jsx63("div", { className: "px-2 pb-2 font-mono text-[10px] font-bold uppercase tracking-[0.18em] text-[var(--tapiz-text-muted)]", children: group.label }) : null,
+        group.label ? /* @__PURE__ */ jsx64("div", { className: "px-2 pb-2 font-mono text-[10px] font-bold uppercase tracking-[0.18em] text-[var(--tapiz-text-muted)]", children: group.label }) : null,
         group.items.map((item) => /* @__PURE__ */ jsxs46("button", { type: "button", disabled: item.disabled, onClick: item.onSelect, className: "flex w-full items-center gap-3 border border-transparent px-3 py-2 text-left hover:border-[var(--tapiz-border-subtle)] hover:bg-[var(--tapiz-bg-surface-muted)] disabled:opacity-40", children: [
-          item.icon ? /* @__PURE__ */ jsx63("span", { className: "grid size-8 place-items-center border border-[var(--tapiz-border-subtle)] text-[var(--tapiz-text-muted)]", children: item.icon }) : null,
+          item.icon ? /* @__PURE__ */ jsx64("span", { className: "grid size-8 place-items-center border border-[var(--tapiz-border-subtle)] text-[var(--tapiz-text-muted)]", children: item.icon }) : null,
           /* @__PURE__ */ jsxs46("span", { className: "min-w-0 flex-1", children: [
-            /* @__PURE__ */ jsx63("span", { className: "block text-sm font-semibold text-[var(--tapiz-text-primary)]", children: item.label }),
-            item.description ? /* @__PURE__ */ jsx63("span", { className: "block text-xs text-[var(--tapiz-text-muted)]", children: item.description }) : null
+            /* @__PURE__ */ jsx64("span", { className: "block text-sm font-semibold text-[var(--tapiz-text-primary)]", children: item.label }),
+            item.description ? /* @__PURE__ */ jsx64("span", { className: "block text-xs text-[var(--tapiz-text-muted)]", children: item.description }) : null
           ] }),
-          item.shortcut ? /* @__PURE__ */ jsx63("span", { className: "font-mono text-[10px] text-[var(--tapiz-text-muted)]", children: item.shortcut }) : null
+          item.shortcut ? /* @__PURE__ */ jsx64("span", { className: "font-mono text-[10px] text-[var(--tapiz-text-muted)]", children: item.shortcut }) : null
         ] }, item.id))
       ] }, groupIndex))
     ] })
@@ -2470,7 +2538,7 @@ function CommandMenu({ open, onClose, query = "", onQueryChange, groups, placeho
 }
 
 // src/components/forms/FormField.tsx
-import { jsx as jsx64, jsxs as jsxs47 } from "react/jsx-runtime";
+import { jsx as jsx65, jsxs as jsxs47 } from "react/jsx-runtime";
 function FormField({ label, hint, error, required, htmlFor, children, className = "" }) {
   return /* @__PURE__ */ jsxs47("div", { className: `space-y-1.5 ${className}`, children: [
     label ? /* @__PURE__ */ jsxs47(FieldLabel, { htmlFor, children: [
@@ -2478,15 +2546,15 @@ function FormField({ label, hint, error, required, htmlFor, children, className
       required ? " *" : ""
     ] }) : null,
     children,
-    error ? /* @__PURE__ */ jsx64(FormError, { message: String(error) }) : hint ? /* @__PURE__ */ jsx64(FieldHint, { children: hint }) : null
+    error ? /* @__PURE__ */ jsx65(FormError, { message: String(error) }) : hint ? /* @__PURE__ */ jsx65(FieldHint, { children: hint }) : null
   ] });
 }
 
 // src/components/forms/Switch.tsx
-import { jsx as jsx65, jsxs as jsxs48 } from "react/jsx-runtime";
+import { jsx as jsx66, jsxs as jsxs48 } from "react/jsx-runtime";
 function Switch({ checked = false, onChange, disabled, label, description, className = "" }) {
   return /* @__PURE__ */ jsxs48("label", { className: `flex cursor-pointer items-start gap-3 ${disabled ? "cursor-not-allowed opacity-50" : ""} ${className}`, children: [
-    /* @__PURE__ */ jsx65(
+    /* @__PURE__ */ jsx66(
       "button",
       {
         type: "button",
@@ -2495,22 +2563,22 @@ function Switch({ checked = false, onChange, disabled, label, description, class
         disabled,
         onClick: () => onChange?.(!checked),
         className: `relative mt-0.5 h-6 w-11 border border-[var(--tapiz-border-strong)] ${checked ? "bg-[var(--tapiz-accent)]" : "bg-[var(--tapiz-bg-surface-muted)]"}`,
-        children: /* @__PURE__ */ jsx65("span", { className: `absolute top-0.5 size-4 border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] transition-transform ${checked ? "left-5" : "left-0.5"}` })
+        children: /* @__PURE__ */ jsx66("span", { className: `absolute top-0.5 size-4 border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] transition-transform ${checked ? "left-5" : "left-0.5"}` })
       }
     ),
     label || description ? /* @__PURE__ */ jsxs48("span", { children: [
-      label ? /* @__PURE__ */ jsx65("span", { className: "block text-sm font-semibold text-[var(--tapiz-text-primary)]", children: label }) : null,
-      description ? /* @__PURE__ */ jsx65("span", { className: "block text-xs text-[var(--tapiz-text-muted)]", children: description }) : null
+      label ? /* @__PURE__ */ jsx66("span", { className: "block text-sm font-semibold text-[var(--tapiz-text-primary)]", children: label }) : null,
+      description ? /* @__PURE__ */ jsx66("span", { className: "block text-xs text-[var(--tapiz-text-muted)]", children: description }) : null
     ] }) : null
   ] });
 }
 
 // src/components/forms/ToggleGroup.tsx
-import { jsx as jsx66 } from "react/jsx-runtime";
+import { jsx as jsx67 } from "react/jsx-runtime";
 function ToggleGroup({ options, value, onChange, className = "", fullWidth = false }) {
-  return /* @__PURE__ */ jsx66("div", { className: `inline-flex border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface-muted)] p-1 ${fullWidth ? "w-full" : ""} ${className}`, children: options.map((option) => {
+  return /* @__PURE__ */ jsx67("div", { className: `inline-flex border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface-muted)] p-1 ${fullWidth ? "w-full" : ""} ${className}`, children: options.map((option) => {
     const selected = option.value === value;
-    return /* @__PURE__ */ jsx66(
+    return /* @__PURE__ */ jsx67(
       "button",
       {
         type: "button",
@@ -2525,17 +2593,17 @@ function ToggleGroup({ options, value, onChange, className = "", fullWidth = fal
 }
 
 // src/components/forms/InputGroup.tsx
-import { jsx as jsx67, jsxs as jsxs49 } from "react/jsx-runtime";
+import { jsx as jsx68, jsxs as jsxs49 } from "react/jsx-runtime";
 function InputGroup({ prefix, suffix, children, className = "" }) {
   return /* @__PURE__ */ jsxs49("div", { className: `flex items-stretch border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] focus-within:border-[var(--tapiz-border-focus)] focus-within:shadow-[inset_3px_0_0_var(--tapiz-signal)] ${className}`, children: [
-    prefix ? /* @__PURE__ */ jsx67("div", { className: "flex items-center border-r border-[var(--tapiz-border-subtle)] px-3 text-sm text-[var(--tapiz-text-muted)]", children: prefix }) : null,
-    /* @__PURE__ */ jsx67("div", { className: "min-w-0 flex-1 [&_input]:border-0 [&_input]:shadow-none [&_input]:focus:shadow-none", children }),
-    suffix ? /* @__PURE__ */ jsx67("div", { className: "flex items-center border-l border-[var(--tapiz-border-subtle)] px-3 text-sm text-[var(--tapiz-text-muted)]", children: suffix }) : null
+    prefix ? /* @__PURE__ */ jsx68("div", { className: "flex items-center border-r border-[var(--tapiz-border-subtle)] px-3 text-sm text-[var(--tapiz-text-muted)]", children: prefix }) : null,
+    /* @__PURE__ */ jsx68("div", { className: "min-w-0 flex-1 [&_input]:border-0 [&_input]:shadow-none [&_input]:focus:shadow-none", children }),
+    suffix ? /* @__PURE__ */ jsx68("div", { className: "flex items-center border-l border-[var(--tapiz-border-subtle)] px-3 text-sm text-[var(--tapiz-text-muted)]", children: suffix }) : null
   ] });
 }
 
 // src/components/feedback/Alert.tsx
-import { jsx as jsx68, jsxs as jsxs50 } from "react/jsx-runtime";
+import { jsx as jsx69, jsxs as jsxs50 } from "react/jsx-runtime";
 var toneClasses = {
   info: "border-[var(--tapiz-info)] bg-[var(--tapiz-info-soft)] text-[var(--tapiz-info)]",
   success: "border-[var(--tapiz-success)] bg-[var(--tapiz-success-soft)] text-[var(--tapiz-success)]",
@@ -2545,17 +2613,17 @@ var toneClasses = {
 };
 function Alert2({ tone: tone2 = "info", title, children, icon, actions, className = "" }) {
   return /* @__PURE__ */ jsxs50("div", { className: `flex gap-3 border p-4 ${toneClasses[tone2]} ${className}`, children: [
-    icon ? /* @__PURE__ */ jsx68("div", { className: "mt-0.5 shrink-0", children: icon }) : null,
+    icon ? /* @__PURE__ */ jsx69("div", { className: "mt-0.5 shrink-0", children: icon }) : null,
     /* @__PURE__ */ jsxs50("div", { className: "min-w-0 flex-1", children: [
-      title ? /* @__PURE__ */ jsx68("div", { className: "font-semibold text-[var(--tapiz-text-primary)]", children: title }) : null,
-      children ? /* @__PURE__ */ jsx68("div", { className: "mt-1 text-sm text-[var(--tapiz-text-secondary)]", children }) : null
+      title ? /* @__PURE__ */ jsx69("div", { className: "font-semibold text-[var(--tapiz-text-primary)]", children: title }) : null,
+      children ? /* @__PURE__ */ jsx69("div", { className: "mt-1 text-sm text-[var(--tapiz-text-secondary)]", children }) : null
     ] }),
-    actions ? /* @__PURE__ */ jsx68("div", { className: "shrink-0", children: actions }) : null
+    actions ? /* @__PURE__ */ jsx69("div", { className: "shrink-0", children: actions }) : null
   ] });
 }
 
 // src/components/feedback/Progress.tsx
-import { jsx as jsx69, jsxs as jsxs51 } from "react/jsx-runtime";
+import { jsx as jsx70, jsxs as jsxs51 } from "react/jsx-runtime";
 var tones = {
   accent: "bg-[var(--tapiz-accent)]",
   success: "bg-[var(--tapiz-success)]",
@@ -2566,32 +2634,32 @@ function Progress({ value, max = 100, label, showValue = false, tone: tone2 = "a
   const percentage = Math.max(0, Math.min(100, value / max * 100));
   return /* @__PURE__ */ jsxs51("div", { className, children: [
     label || showValue ? /* @__PURE__ */ jsxs51("div", { className: "mb-1 flex items-center justify-between gap-3 text-xs text-[var(--tapiz-text-muted)]", children: [
-      label ? /* @__PURE__ */ jsx69("span", { children: label }) : /* @__PURE__ */ jsx69("span", {}),
+      label ? /* @__PURE__ */ jsx70("span", { children: label }) : /* @__PURE__ */ jsx70("span", {}),
       showValue ? /* @__PURE__ */ jsxs51("span", { className: "font-mono", children: [
         Math.round(percentage),
         "%"
       ] }) : null
     ] }) : null,
-    /* @__PURE__ */ jsx69("div", { className: "h-2 border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface-muted)]", children: /* @__PURE__ */ jsx69("div", { className: `h-full ${tones[tone2]}`, style: { width: `${percentage}%` } }) })
+    /* @__PURE__ */ jsx70("div", { className: "h-2 border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface-muted)]", children: /* @__PURE__ */ jsx70("div", { className: `h-full ${tones[tone2]}`, style: { width: `${percentage}%` } }) })
   ] });
 }
 
 // src/components/shared/Avatar.tsx
-import { jsx as jsx70 } from "react/jsx-runtime";
+import { jsx as jsx71 } from "react/jsx-runtime";
 var sizes = { xs: "size-6 text-[10px]", sm: "size-8 text-xs", md: "size-10 text-sm", lg: "size-14 text-base" };
 function Avatar({ src, name = "?", size = "md", className = "" }) {
   const initials = name.split(" ").filter(Boolean).slice(0, 2).map((part) => part[0]?.toUpperCase()).join("") || "?";
-  return src ? /* @__PURE__ */ jsx70("img", { src, alt: name, className: `border border-[var(--tapiz-border-strong)] object-cover ${sizes[size]} ${className}` }) : /* @__PURE__ */ jsx70("span", { className: `inline-grid place-items-center border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-accent-soft)] font-mono font-bold text-[var(--tapiz-accent)] ${sizes[size]} ${className}`, children: initials });
+  return src ? /* @__PURE__ */ jsx71("img", { src, alt: name, className: `border border-[var(--tapiz-border-strong)] object-cover ${sizes[size]} ${className}` }) : /* @__PURE__ */ jsx71("span", { className: `inline-grid place-items-center border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-accent-soft)] font-mono font-bold text-[var(--tapiz-accent)] ${sizes[size]} ${className}`, children: initials });
 }
 
 // src/components/shared/Kbd.tsx
-import { jsx as jsx71 } from "react/jsx-runtime";
+import { jsx as jsx72 } from "react/jsx-runtime";
 function Kbd({ children, className = "" }) {
-  return /* @__PURE__ */ jsx71("kbd", { className: `inline-flex min-w-5 items-center justify-center border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface-muted)] px-1.5 py-0.5 font-mono text-[10px] font-bold text-[var(--tapiz-text-secondary)] shadow-[1px_1px_0_var(--tapiz-border-strong)] ${className}`, children });
+  return /* @__PURE__ */ jsx72("kbd", { className: `inline-flex min-w-5 items-center justify-center border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface-muted)] px-1.5 py-0.5 font-mono text-[10px] font-bold text-[var(--tapiz-text-secondary)] shadow-[1px_1px_0_var(--tapiz-border-strong)] ${className}`, children });
 }
 
 // src/components/shared/Timeline.tsx
-import { jsx as jsx72, jsxs as jsxs52 } from "react/jsx-runtime";
+import { jsx as jsx73, jsxs as jsxs52 } from "react/jsx-runtime";
 var tones2 = {
   neutral: "border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] text-[var(--tapiz-text-muted)]",
   info: "border-[var(--tapiz-info)] bg-[var(--tapiz-info-soft)] text-[var(--tapiz-info)]",
@@ -2600,53 +2668,53 @@ var tones2 = {
   danger: "border-[var(--tapiz-danger)] bg-[var(--tapiz-danger-soft)] text-[var(--tapiz-danger)]"
 };
 function Timeline({ items, className = "" }) {
-  return /* @__PURE__ */ jsx72("ol", { className: `relative space-y-4 before:absolute before:left-4 before:top-2 before:h-[calc(100%-1rem)] before:w-px before:bg-[var(--tapiz-border-subtle)] ${className}`, children: items.map((item) => /* @__PURE__ */ jsxs52("li", { className: "relative flex gap-3", children: [
-    /* @__PURE__ */ jsx72("span", { className: `z-10 grid size-8 shrink-0 place-items-center border text-xs ${tones2[item.tone ?? "neutral"]}`, children: item.icon ?? "\u2022" }),
+  return /* @__PURE__ */ jsx73("ol", { className: `relative space-y-4 before:absolute before:left-4 before:top-2 before:h-[calc(100%-1rem)] before:w-px before:bg-[var(--tapiz-border-subtle)] ${className}`, children: items.map((item) => /* @__PURE__ */ jsxs52("li", { className: "relative flex gap-3", children: [
+    /* @__PURE__ */ jsx73("span", { className: `z-10 grid size-8 shrink-0 place-items-center border text-xs ${tones2[item.tone ?? "neutral"]}`, children: item.icon ?? "\u2022" }),
     /* @__PURE__ */ jsxs52("span", { className: "min-w-0 flex-1 pb-2", children: [
       /* @__PURE__ */ jsxs52("span", { className: "flex flex-wrap items-baseline justify-between gap-2", children: [
-        /* @__PURE__ */ jsx72("span", { className: "font-semibold text-[var(--tapiz-text-primary)]", children: item.title }),
-        item.time ? /* @__PURE__ */ jsx72("span", { className: "font-mono text-[10px] uppercase tracking-[0.14em] text-[var(--tapiz-text-muted)]", children: item.time }) : null
+        /* @__PURE__ */ jsx73("span", { className: "font-semibold text-[var(--tapiz-text-primary)]", children: item.title }),
+        item.time ? /* @__PURE__ */ jsx73("span", { className: "font-mono text-[10px] uppercase tracking-[0.14em] text-[var(--tapiz-text-muted)]", children: item.time }) : null
       ] }),
-      item.description ? /* @__PURE__ */ jsx72("span", { className: "mt-1 block text-sm text-[var(--tapiz-text-secondary)]", children: item.description }) : null
+      item.description ? /* @__PURE__ */ jsx73("span", { className: "mt-1 block text-sm text-[var(--tapiz-text-secondary)]", children: item.description }) : null
     ] })
   ] }, item.id)) });
 }
 
 // src/components/shared/KeyValueList.tsx
-import { jsx as jsx73, jsxs as jsxs53 } from "react/jsx-runtime";
+import { jsx as jsx74, jsxs as jsxs53 } from "react/jsx-runtime";
 function KeyValueList({ items, className = "", density = "normal" }) {
-  return /* @__PURE__ */ jsx73("dl", { className: `divide-y divide-[var(--tapiz-border-subtle)] border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] ${className}`, children: items.map((item, index) => /* @__PURE__ */ jsxs53("div", { className: `grid gap-2 ${density === "compact" ? "p-3 md:grid-cols-[160px_1fr]" : "p-4 md:grid-cols-[220px_1fr]"}`, children: [
-    /* @__PURE__ */ jsx73("dt", { className: "font-mono text-[10px] font-bold uppercase tracking-[0.18em] text-[var(--tapiz-text-muted)]", children: item.keyLabel }),
+  return /* @__PURE__ */ jsx74("dl", { className: `divide-y divide-[var(--tapiz-border-subtle)] border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] ${className}`, children: items.map((item, index) => /* @__PURE__ */ jsxs53("div", { className: `grid gap-2 ${density === "compact" ? "p-3 md:grid-cols-[160px_1fr]" : "p-4 md:grid-cols-[220px_1fr]"}`, children: [
+    /* @__PURE__ */ jsx74("dt", { className: "font-mono text-[10px] font-bold uppercase tracking-[0.18em] text-[var(--tapiz-text-muted)]", children: item.keyLabel }),
     /* @__PURE__ */ jsxs53("dd", { children: [
-      /* @__PURE__ */ jsx73("div", { className: "text-sm font-semibold text-[var(--tapiz-text-primary)]", children: item.value }),
-      item.description ? /* @__PURE__ */ jsx73("div", { className: "mt-1 text-xs text-[var(--tapiz-text-muted)]", children: item.description }) : null
+      /* @__PURE__ */ jsx74("div", { className: "text-sm font-semibold text-[var(--tapiz-text-primary)]", children: item.value }),
+      item.description ? /* @__PURE__ */ jsx74("div", { className: "mt-1 text-xs text-[var(--tapiz-text-muted)]", children: item.description }) : null
     ] })
   ] }, index)) });
 }
 
 // src/components/shared/CodeBlock.tsx
-import { jsx as jsx74, jsxs as jsxs54 } from "react/jsx-runtime";
+import { jsx as jsx75, jsxs as jsxs54 } from "react/jsx-runtime";
 function CodeBlock({ children, language, title, actions, className = "" }) {
   return /* @__PURE__ */ jsxs54("figure", { className: `overflow-hidden border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] ${className}`, children: [
     title || language || actions ? /* @__PURE__ */ jsxs54("figcaption", { className: "flex items-center justify-between gap-3 border-b border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)] px-3 py-2", children: [
-      /* @__PURE__ */ jsx74("span", { className: "font-mono text-[10px] font-bold uppercase tracking-[0.18em] text-[var(--tapiz-text-muted)]", children: title ?? language }),
+      /* @__PURE__ */ jsx75("span", { className: "font-mono text-[10px] font-bold uppercase tracking-[0.18em] text-[var(--tapiz-text-muted)]", children: title ?? language }),
       actions
     ] }) : null,
-    /* @__PURE__ */ jsx74("pre", { className: "overflow-auto p-4 text-sm leading-6 text-[var(--tapiz-text-secondary)]", children: /* @__PURE__ */ jsx74("code", { children }) })
+    /* @__PURE__ */ jsx75("pre", { className: "overflow-auto p-4 text-sm leading-6 text-[var(--tapiz-text-secondary)]", children: /* @__PURE__ */ jsx75("code", { children }) })
   ] });
 }
 
 // src/components/marketing/LogoCloud.tsx
-import { jsx as jsx75, jsxs as jsxs55 } from "react/jsx-runtime";
+import { jsx as jsx76, jsxs as jsxs55 } from "react/jsx-runtime";
 function LogoCloud({ title, items, className = "" }) {
-  return /* @__PURE__ */ jsx75("section", { className: `border-y border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] py-8 ${className}`, children: /* @__PURE__ */ jsxs55("div", { className: "mx-auto max-w-7xl px-[var(--tapiz-space-page-x)]", children: [
-    title ? /* @__PURE__ */ jsx75("p", { className: "mb-6 text-center font-mono text-[10px] font-bold uppercase tracking-[0.18em] text-[var(--tapiz-text-muted)]", children: title }) : null,
-    /* @__PURE__ */ jsx75("div", { className: "grid grid-cols-2 gap-3 md:grid-cols-4 lg:grid-cols-6", children: items.map((item) => /* @__PURE__ */ jsx75("div", { className: "grid min-h-20 place-items-center border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)] px-4 text-center text-sm font-semibold text-[var(--tapiz-text-secondary)]", children: item.logo ?? item.name }, item.name)) })
+  return /* @__PURE__ */ jsx76("section", { className: `border-y border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] py-8 ${className}`, children: /* @__PURE__ */ jsxs55("div", { className: "mx-auto max-w-7xl px-[var(--tapiz-space-page-x)]", children: [
+    title ? /* @__PURE__ */ jsx76("p", { className: "mb-6 text-center font-mono text-[10px] font-bold uppercase tracking-[0.18em] text-[var(--tapiz-text-muted)]", children: title }) : null,
+    /* @__PURE__ */ jsx76("div", { className: "grid grid-cols-2 gap-3 md:grid-cols-4 lg:grid-cols-6", children: items.map((item) => /* @__PURE__ */ jsx76("div", { className: "grid min-h-20 place-items-center border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)] px-4 text-center text-sm font-semibold text-[var(--tapiz-text-secondary)]", children: item.logo ?? item.name }, item.name)) })
   ] }) });
 }
 
 // src/components/marketing/TestimonialCard.tsx
-import { jsx as jsx76, jsxs as jsxs56 } from "react/jsx-runtime";
+import { jsx as jsx77, jsxs as jsxs56 } from "react/jsx-runtime";
 function TestimonialCard({ quote, author, role, avatarSrc, className = "", variant = "surface" }) {
   return /* @__PURE__ */ jsxs56("figure", { className: `border bg-[var(--tapiz-bg-surface)] p-5 ${variant === "brutal" ? "border-2 border-[var(--tapiz-border-strong)] shadow-[var(--tapiz-shadow-brutal)]" : "border-[var(--tapiz-border-subtle)] shadow-[var(--tapiz-shadow-sm)]"} ${className}`, children: [
     /* @__PURE__ */ jsxs56("blockquote", { className: "text-base leading-7 text-[var(--tapiz-text-secondary)]", children: [
@@ -2655,39 +2723,39 @@ function TestimonialCard({ quote, author, role, avatarSrc, className = "", varia
       "\u201D"
     ] }),
     /* @__PURE__ */ jsxs56("figcaption", { className: "mt-5 flex items-center gap-3", children: [
-      /* @__PURE__ */ jsx76(Avatar, { name: author, src: avatarSrc, size: "sm" }),
+      /* @__PURE__ */ jsx77(Avatar, { name: author, src: avatarSrc, size: "sm" }),
       /* @__PURE__ */ jsxs56("span", { children: [
-        /* @__PURE__ */ jsx76("span", { className: "block text-sm font-semibold text-[var(--tapiz-text-primary)]", children: author }),
-        role ? /* @__PURE__ */ jsx76("span", { className: "block text-xs text-[var(--tapiz-text-muted)]", children: role }) : null
+        /* @__PURE__ */ jsx77("span", { className: "block text-sm font-semibold text-[var(--tapiz-text-primary)]", children: author }),
+        role ? /* @__PURE__ */ jsx77("span", { className: "block text-xs text-[var(--tapiz-text-muted)]", children: role }) : null
       ] })
     ] })
   ] });
 }
 
 // src/components/marketing/PricingCard.tsx
-import { jsx as jsx77, jsxs as jsxs57 } from "react/jsx-runtime";
+import { jsx as jsx78, jsxs as jsxs57 } from "react/jsx-runtime";
 function PricingCard({ name, price, description, features = [], cta, highlighted = false, className = "" }) {
   return /* @__PURE__ */ jsxs57("section", { className: `flex h-full flex-col border bg-[var(--tapiz-bg-surface)] p-6 ${highlighted ? "border-2 border-[var(--tapiz-border-strong)] shadow-[var(--tapiz-shadow-brutal-lg)]" : "border-[var(--tapiz-border-subtle)] shadow-[var(--tapiz-shadow-sm)]"} ${className}`, children: [
     /* @__PURE__ */ jsxs57("div", { className: "flex-1", children: [
-      /* @__PURE__ */ jsx77("h3", { className: "text-lg font-semibold text-[var(--tapiz-text-primary)]", children: name }),
-      description ? /* @__PURE__ */ jsx77("p", { className: "mt-2 text-sm text-[var(--tapiz-text-muted)]", children: description }) : null,
-      /* @__PURE__ */ jsx77("div", { className: "mt-6 text-4xl font-semibold tracking-tight text-[var(--tapiz-text-primary)]", children: price }),
-      /* @__PURE__ */ jsx77("ul", { className: "mt-6 space-y-3 text-sm text-[var(--tapiz-text-secondary)]", children: features.map((feature, index) => /* @__PURE__ */ jsxs57("li", { className: "flex gap-2", children: [
-        /* @__PURE__ */ jsx77("span", { className: "text-[var(--tapiz-success)]", children: "\u2713" }),
-        /* @__PURE__ */ jsx77("span", { children: feature })
+      /* @__PURE__ */ jsx78("h3", { className: "text-lg font-semibold text-[var(--tapiz-text-primary)]", children: name }),
+      description ? /* @__PURE__ */ jsx78("p", { className: "mt-2 text-sm text-[var(--tapiz-text-muted)]", children: description }) : null,
+      /* @__PURE__ */ jsx78("div", { className: "mt-6 text-4xl font-semibold tracking-tight text-[var(--tapiz-text-primary)]", children: price }),
+      /* @__PURE__ */ jsx78("ul", { className: "mt-6 space-y-3 text-sm text-[var(--tapiz-text-secondary)]", children: features.map((feature, index) => /* @__PURE__ */ jsxs57("li", { className: "flex gap-2", children: [
+        /* @__PURE__ */ jsx78("span", { className: "text-[var(--tapiz-success)]", children: "\u2713" }),
+        /* @__PURE__ */ jsx78("span", { children: feature })
       ] }, index)) })
     ] }),
-    /* @__PURE__ */ jsx77("div", { className: "mt-6", children: cta ?? /* @__PURE__ */ jsx77(Button, { variant: highlighted ? "primary" : "secondary", fullWidth: true, children: "Get started" }) })
+    /* @__PURE__ */ jsx78("div", { className: "mt-6", children: cta ?? /* @__PURE__ */ jsx78(Button, { variant: highlighted ? "primary" : "secondary", fullWidth: true, children: "Get started" }) })
   ] });
 }
 
 // src/components/marketing/StatsBand.tsx
-import { jsx as jsx78, jsxs as jsxs58 } from "react/jsx-runtime";
+import { jsx as jsx79, jsxs as jsxs58 } from "react/jsx-runtime";
 function StatsBand({ items, className = "" }) {
-  return /* @__PURE__ */ jsx78("section", { className: `border-y border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface-inverse)] text-[var(--tapiz-text-inverse)] ${className}`, children: /* @__PURE__ */ jsx78("div", { className: "mx-auto grid max-w-7xl divide-y divide-[color-mix(in_srgb,var(--tapiz-text-inverse)_24%,transparent)] px-[var(--tapiz-space-page-x)] md:grid-cols-3 md:divide-x md:divide-y-0", children: items.map((item, index) => /* @__PURE__ */ jsxs58("div", { className: "p-6 md:p-8", children: [
-    /* @__PURE__ */ jsx78("div", { className: "text-3xl font-semibold tracking-tight", children: item.value }),
-    /* @__PURE__ */ jsx78("div", { className: "mt-2 font-mono text-[10px] font-bold uppercase tracking-[0.18em] opacity-70", children: item.label }),
-    item.description ? /* @__PURE__ */ jsx78("div", { className: "mt-3 text-sm opacity-70", children: item.description }) : null
+  return /* @__PURE__ */ jsx79("section", { className: `border-y border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface-inverse)] text-[var(--tapiz-text-inverse)] ${className}`, children: /* @__PURE__ */ jsx79("div", { className: "mx-auto grid max-w-7xl divide-y divide-[color-mix(in_srgb,var(--tapiz-text-inverse)_24%,transparent)] px-[var(--tapiz-space-page-x)] md:grid-cols-3 md:divide-x md:divide-y-0", children: items.map((item, index) => /* @__PURE__ */ jsxs58("div", { className: "p-6 md:p-8", children: [
+    /* @__PURE__ */ jsx79("div", { className: "text-3xl font-semibold tracking-tight", children: item.value }),
+    /* @__PURE__ */ jsx79("div", { className: "mt-2 font-mono text-[10px] font-bold uppercase tracking-[0.18em] opacity-70", children: item.label }),
+    item.description ? /* @__PURE__ */ jsx79("div", { className: "mt-3 text-sm opacity-70", children: item.description }) : null
   ] }, index)) }) });
 }
 
@@ -2726,7 +2794,7 @@ var tapizFrameworkPresets = {
 };
 
 // src/components/layout/Container.tsx
-import { jsx as jsx79 } from "react/jsx-runtime";
+import { jsx as jsx80 } from "react/jsx-runtime";
 var sizeClasses2 = {
   sm: "max-w-3xl",
   md: "max-w-5xl",
@@ -2735,7 +2803,7 @@ var sizeClasses2 = {
   full: "max-w-none"
 };
 function Container({ children, size = "lg", padded = true, className = "", style }) {
-  return /* @__PURE__ */ jsx79(
+  return /* @__PURE__ */ jsx80(
     "div",
     {
       className: ["mx-auto w-full", sizeClasses2[size], padded ? "px-[var(--tapiz-space-page-x)]" : "", className].filter(Boolean).join(" "),
@@ -2746,7 +2814,7 @@ function Container({ children, size = "lg", padded = true, className = "", style
 }
 
 // src/components/layout/Surface.tsx
-import { jsx as jsx80 } from "react/jsx-runtime";
+import { jsx as jsx81 } from "react/jsx-runtime";
 var variantClasses5 = {
   canvas: "bg-[var(--tapiz-bg-page)] text-[var(--tapiz-text-primary)]",
   surface: "bg-[var(--tapiz-bg-surface)] text-[var(--tapiz-text-primary)]",
@@ -2763,7 +2831,7 @@ var paddingClasses2 = {
   xl: "p-8"
 };
 function Surface({ children, variant = "surface", padding = "md", bordered = true, className = "", style }) {
-  return /* @__PURE__ */ jsx80(
+  return /* @__PURE__ */ jsx81(
     "section",
     {
       className: [variantClasses5[variant], paddingClasses2[padding], bordered && variant !== "brutal" ? "border border-[var(--tapiz-border-subtle)]" : "", className].filter(Boolean).join(" "),
@@ -2774,23 +2842,23 @@ function Surface({ children, variant = "surface", padding = "md", bordered = tru
 }
 
 // src/components/layout/Divider.tsx
-import { jsx as jsx81, jsxs as jsxs59 } from "react/jsx-runtime";
+import { jsx as jsx82, jsxs as jsxs59 } from "react/jsx-runtime";
 function Divider({ orientation = "horizontal", label, className = "" }) {
   if (orientation === "vertical") {
-    return /* @__PURE__ */ jsx81("div", { className: `mx-2 min-h-6 w-px bg-[var(--tapiz-border-subtle)] ${className}`, "aria-hidden": "true" });
+    return /* @__PURE__ */ jsx82("div", { className: `mx-2 min-h-6 w-px bg-[var(--tapiz-border-subtle)] ${className}`, "aria-hidden": "true" });
   }
   if (label) {
     return /* @__PURE__ */ jsxs59("div", { className: `flex items-center gap-3 ${className}`, children: [
-      /* @__PURE__ */ jsx81("div", { className: "h-px flex-1 bg-[var(--tapiz-border-subtle)]" }),
-      /* @__PURE__ */ jsx81("span", { className: "font-mono text-[10px] uppercase tracking-[0.18em] text-[var(--tapiz-text-muted)]", children: label }),
-      /* @__PURE__ */ jsx81("div", { className: "h-px flex-1 bg-[var(--tapiz-border-subtle)]" })
+      /* @__PURE__ */ jsx82("div", { className: "h-px flex-1 bg-[var(--tapiz-border-subtle)]" }),
+      /* @__PURE__ */ jsx82("span", { className: "font-mono text-[10px] uppercase tracking-[0.18em] text-[var(--tapiz-text-muted)]", children: label }),
+      /* @__PURE__ */ jsx82("div", { className: "h-px flex-1 bg-[var(--tapiz-border-subtle)]" })
     ] });
   }
-  return /* @__PURE__ */ jsx81("hr", { className: `border-[var(--tapiz-border-subtle)] ${className}` });
+  return /* @__PURE__ */ jsx82("hr", { className: `border-[var(--tapiz-border-subtle)] ${className}` });
 }
 
 // src/components/layout/ResponsiveGrid.tsx
-import { jsx as jsx82 } from "react/jsx-runtime";
+import { jsx as jsx83 } from "react/jsx-runtime";
 var gapClasses3 = {
   sm: "gap-3",
   md: "gap-4",
@@ -2798,7 +2866,7 @@ var gapClasses3 = {
   xl: "gap-8"
 };
 function ResponsiveGrid({ children, min = "18rem", gap = "md", className = "", style }) {
-  return /* @__PURE__ */ jsx82(
+  return /* @__PURE__ */ jsx83(
     "div",
     {
       className: `grid ${gapClasses3[gap]} ${className}`,
@@ -2809,7 +2877,7 @@ function ResponsiveGrid({ children, min = "18rem", gap = "md", className = "", s
 }
 
 // src/components/data-display/Sparkline.tsx
-import { jsx as jsx83, jsxs as jsxs60 } from "react/jsx-runtime";
+import { jsx as jsx84, jsxs as jsxs60 } from "react/jsx-runtime";
 function Sparkline({ values, width = 160, height = 48, label = "Trend", className = "", style }) {
   const safeValues = values.length ? values : [0];
   const min = Math.min(...safeValues);
@@ -2822,30 +2890,30 @@ function Sparkline({ values, width = 160, height = 48, label = "Trend", classNam
     return `${x},${y}`;
   }).join(" ");
   return /* @__PURE__ */ jsxs60("svg", { className, style, width, height, viewBox: `0 0 ${width} ${height}`, role: "img", "aria-label": label, children: [
-    /* @__PURE__ */ jsx83("polyline", { points, fill: "none", stroke: "var(--tapiz-accent)", strokeWidth: "2", strokeLinecap: "square", strokeLinejoin: "miter" }),
-    /* @__PURE__ */ jsx83("line", { x1: "0", x2: width, y1: height - 1, y2: height - 1, stroke: "var(--tapiz-border-subtle)", strokeWidth: "1" })
+    /* @__PURE__ */ jsx84("polyline", { points, fill: "none", stroke: "var(--tapiz-accent)", strokeWidth: "2", strokeLinecap: "square", strokeLinejoin: "miter" }),
+    /* @__PURE__ */ jsx84("line", { x1: "0", x2: width, y1: height - 1, y2: height - 1, stroke: "var(--tapiz-border-subtle)", strokeWidth: "1" })
   ] });
 }
 
 // src/components/data-display/BarList.tsx
-import { jsx as jsx84, jsxs as jsxs61 } from "react/jsx-runtime";
+import { jsx as jsx85, jsxs as jsxs61 } from "react/jsx-runtime";
 function BarList({ items, max, valueFormatter = (value) => value, className = "" }) {
   const computedMax = max ?? Math.max(1, ...items.map((item) => item.value));
-  return /* @__PURE__ */ jsx84("div", { className: `space-y-3 ${className}`, children: items.map((item, index) => {
+  return /* @__PURE__ */ jsx85("div", { className: `space-y-3 ${className}`, children: items.map((item, index) => {
     const percent = Math.max(0, Math.min(100, item.value / computedMax * 100));
     return /* @__PURE__ */ jsxs61("div", { children: [
       /* @__PURE__ */ jsxs61("div", { className: "mb-1 flex items-center justify-between gap-3 text-sm", children: [
-        /* @__PURE__ */ jsx84("span", { className: "font-medium text-[var(--tapiz-text-secondary)]", children: item.label }),
-        /* @__PURE__ */ jsx84("span", { className: "font-mono text-xs text-[var(--tapiz-text-muted)]", children: valueFormatter(item.value) })
+        /* @__PURE__ */ jsx85("span", { className: "font-medium text-[var(--tapiz-text-secondary)]", children: item.label }),
+        /* @__PURE__ */ jsx85("span", { className: "font-mono text-xs text-[var(--tapiz-text-muted)]", children: valueFormatter(item.value) })
       ] }),
-      /* @__PURE__ */ jsx84("div", { className: "h-2 border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)]", children: /* @__PURE__ */ jsx84("div", { className: "h-full bg-[var(--tapiz-accent)]", style: { width: `${percent}%` } }) }),
-      item.detail ? /* @__PURE__ */ jsx84("div", { className: "mt-1 text-xs text-[var(--tapiz-text-muted)]", children: item.detail }) : null
+      /* @__PURE__ */ jsx85("div", { className: "h-2 border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)]", children: /* @__PURE__ */ jsx85("div", { className: "h-full bg-[var(--tapiz-accent)]", style: { width: `${percent}%` } }) }),
+      item.detail ? /* @__PURE__ */ jsx85("div", { className: "mt-1 text-xs text-[var(--tapiz-text-muted)]", children: item.detail }) : null
     ] }, index);
   }) });
 }
 
 // src/components/data-display/DonutMetric.tsx
-import { jsx as jsx85, jsxs as jsxs62 } from "react/jsx-runtime";
+import { jsx as jsx86, jsxs as jsxs62 } from "react/jsx-runtime";
 function DonutMetric({ value, max = 100, label, caption, size = 112, className = "" }) {
   const radius = 42;
   const circumference = 2 * Math.PI * radius;
@@ -2853,8 +2921,8 @@ function DonutMetric({ value, max = 100, label, caption, size = 112, className =
   const offset = circumference * (1 - ratio);
   return /* @__PURE__ */ jsxs62("div", { className: `inline-flex items-center gap-4 ${className}`, children: [
     /* @__PURE__ */ jsxs62("svg", { width: size, height: size, viewBox: "0 0 112 112", role: "img", "aria-label": `${Math.round(ratio * 100)}%`, children: [
-      /* @__PURE__ */ jsx85("circle", { cx: "56", cy: "56", r: radius, fill: "none", stroke: "var(--tapiz-border-subtle)", strokeWidth: "10" }),
-      /* @__PURE__ */ jsx85(
+      /* @__PURE__ */ jsx86("circle", { cx: "56", cy: "56", r: radius, fill: "none", stroke: "var(--tapiz-border-subtle)", strokeWidth: "10" }),
+      /* @__PURE__ */ jsx86(
         "circle",
         {
           cx: "56",
@@ -2875,14 +2943,14 @@ function DonutMetric({ value, max = 100, label, caption, size = 112, className =
       ] })
     ] }),
     label || caption ? /* @__PURE__ */ jsxs62("div", { children: [
-      label ? /* @__PURE__ */ jsx85("div", { className: "text-sm font-semibold text-[var(--tapiz-text-primary)]", children: label }) : null,
-      caption ? /* @__PURE__ */ jsx85("div", { className: "mt-1 text-xs leading-5 text-[var(--tapiz-text-muted)]", children: caption }) : null
+      label ? /* @__PURE__ */ jsx86("div", { className: "text-sm font-semibold text-[var(--tapiz-text-primary)]", children: label }) : null,
+      caption ? /* @__PURE__ */ jsx86("div", { className: "mt-1 text-xs leading-5 text-[var(--tapiz-text-muted)]", children: caption }) : null
     ] }) : null
   ] });
 }
 
 // src/components/data-display/FilterChip.tsx
-import { jsx as jsx86, jsxs as jsxs63 } from "react/jsx-runtime";
+import { jsx as jsx87, jsxs as jsxs63 } from "react/jsx-runtime";
 function FilterChip({ children, active = false, onRemove, className = "" }) {
   return /* @__PURE__ */ jsxs63(
     "span",
@@ -2894,56 +2962,56 @@ function FilterChip({ children, active = false, onRemove, className = "" }) {
       ].join(" "),
       children: [
         children,
-        onRemove ? /* @__PURE__ */ jsx86("button", { type: "button", onClick: onRemove, className: "text-[var(--tapiz-text-muted)] hover:text-[var(--tapiz-danger)]", "aria-label": "Remove filter", children: "\xD7" }) : null
+        onRemove ? /* @__PURE__ */ jsx87("button", { type: "button", onClick: onRemove, className: "text-[var(--tapiz-text-muted)] hover:text-[var(--tapiz-danger)]", "aria-label": "Remove filter", children: "\xD7" }) : null
       ]
     }
   );
 }
 
 // src/components/data-display/DataToolbar.tsx
-import { jsx as jsx87, jsxs as jsxs64 } from "react/jsx-runtime";
+import { jsx as jsx88, jsxs as jsxs64 } from "react/jsx-runtime";
 function DataToolbar({ title, description, search, filters, actions, className = "" }) {
   return /* @__PURE__ */ jsxs64("div", { className: `border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] p-4 ${className}`, children: [
     /* @__PURE__ */ jsxs64("div", { className: "flex flex-col gap-4 lg:flex-row lg:items-start lg:justify-between", children: [
       /* @__PURE__ */ jsxs64("div", { children: [
-        title ? /* @__PURE__ */ jsx87("h3", { className: "text-base font-semibold text-[var(--tapiz-text-primary)]", children: title }) : null,
-        description ? /* @__PURE__ */ jsx87("p", { className: "mt-1 text-sm text-[var(--tapiz-text-muted)]", children: description }) : null
+        title ? /* @__PURE__ */ jsx88("h3", { className: "text-base font-semibold text-[var(--tapiz-text-primary)]", children: title }) : null,
+        description ? /* @__PURE__ */ jsx88("p", { className: "mt-1 text-sm text-[var(--tapiz-text-muted)]", children: description }) : null
       ] }),
-      actions ? /* @__PURE__ */ jsx87("div", { className: "flex flex-wrap gap-2", children: actions }) : null
+      actions ? /* @__PURE__ */ jsx88("div", { className: "flex flex-wrap gap-2", children: actions }) : null
     ] }),
     search || filters ? /* @__PURE__ */ jsxs64("div", { className: "mt-4 flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between", children: [
-      search ? /* @__PURE__ */ jsx87("div", { className: "min-w-0 flex-1", children: search }) : null,
-      filters ? /* @__PURE__ */ jsx87("div", { className: "flex flex-wrap gap-2", children: filters }) : null
+      search ? /* @__PURE__ */ jsx88("div", { className: "min-w-0 flex-1", children: search }) : null,
+      filters ? /* @__PURE__ */ jsx88("div", { className: "flex flex-wrap gap-2", children: filters }) : null
     ] }) : null
   ] });
 }
 
 // src/components/framework/ResourceCard.tsx
-import { Fragment as Fragment4, jsx as jsx88, jsxs as jsxs65 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx89, jsxs as jsxs65 } from "react/jsx-runtime";
 function ResourceCard({ title, description, eyebrow, icon, meta, status, actions, href, className = "" }) {
   const content = /* @__PURE__ */ jsxs65(Fragment4, { children: [
     /* @__PURE__ */ jsxs65("div", { className: "flex items-start justify-between gap-4", children: [
       /* @__PURE__ */ jsxs65("div", { className: "flex min-w-0 items-start gap-3", children: [
-        icon ? /* @__PURE__ */ jsx88("div", { className: "border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)] p-2 text-[var(--tapiz-accent)]", children: icon }) : null,
+        icon ? /* @__PURE__ */ jsx89("div", { className: "border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)] p-2 text-[var(--tapiz-accent)]", children: icon }) : null,
         /* @__PURE__ */ jsxs65("div", { className: "min-w-0", children: [
-          eyebrow ? /* @__PURE__ */ jsx88("div", { className: "kicker mb-2", children: eyebrow }) : null,
-          /* @__PURE__ */ jsx88("h3", { className: "truncate text-base font-semibold text-[var(--tapiz-text-primary)]", children: title }),
-          description ? /* @__PURE__ */ jsx88("p", { className: "mt-2 line-clamp-2 text-sm leading-6 text-[var(--tapiz-text-muted)]", children: description }) : null
+          eyebrow ? /* @__PURE__ */ jsx89("div", { className: "kicker mb-2", children: eyebrow }) : null,
+          /* @__PURE__ */ jsx89("h3", { className: "truncate text-base font-semibold text-[var(--tapiz-text-primary)]", children: title }),
+          description ? /* @__PURE__ */ jsx89("p", { className: "mt-2 line-clamp-2 text-sm leading-6 text-[var(--tapiz-text-muted)]", children: description }) : null
         ] })
       ] }),
-      status ? /* @__PURE__ */ jsx88(Badge, { children: status }) : null
+      status ? /* @__PURE__ */ jsx89(Badge, { children: status }) : null
     ] }),
     meta || actions ? /* @__PURE__ */ jsxs65("div", { className: "mt-5 flex flex-wrap items-center justify-between gap-3 border-t border-[var(--tapiz-border-subtle)] pt-4", children: [
-      meta ? /* @__PURE__ */ jsx88("div", { className: "font-mono text-xs text-[var(--tapiz-text-muted)]", children: meta }) : /* @__PURE__ */ jsx88("span", {}),
-      actions ? /* @__PURE__ */ jsx88("div", { className: "flex flex-wrap gap-2", children: actions }) : null
+      meta ? /* @__PURE__ */ jsx89("div", { className: "font-mono text-xs text-[var(--tapiz-text-muted)]", children: meta }) : /* @__PURE__ */ jsx89("span", {}),
+      actions ? /* @__PURE__ */ jsx89("div", { className: "flex flex-wrap gap-2", children: actions }) : null
     ] }) : null
   ] });
   const classes = `block border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] p-5 shadow-[var(--tapiz-shadow-sm)] hover:border-[var(--tapiz-border-strong)] hover:shadow-[var(--tapiz-shadow-md)] ${className}`;
-  return href ? /* @__PURE__ */ jsx88("a", { href, className: classes, children: content }) : /* @__PURE__ */ jsx88("article", { className: classes, children: content });
+  return href ? /* @__PURE__ */ jsx89("a", { href, className: classes, children: content }) : /* @__PURE__ */ jsx89("article", { className: classes, children: content });
 }
 
 // src/components/framework/IntegrationCard.tsx
-import { jsx as jsx89, jsxs as jsxs66 } from "react/jsx-runtime";
+import { jsx as jsx90, jsxs as jsxs66 } from "react/jsx-runtime";
 var statusLabel = {
   connected: "Connected",
   disconnected: "Disconnected",
@@ -2960,23 +3028,23 @@ function IntegrationCard({ name, description, logo, status = "disconnected", las
   return /* @__PURE__ */ jsxs66("article", { className: `border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] p-5 ${className}`, children: [
     /* @__PURE__ */ jsxs66("div", { className: "flex items-start justify-between gap-4", children: [
       /* @__PURE__ */ jsxs66("div", { className: "flex items-start gap-3", children: [
-        /* @__PURE__ */ jsx89("div", { className: "flex size-11 items-center justify-center border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface-muted)] text-[var(--tapiz-accent)]", children: logo ?? /* @__PURE__ */ jsx89("span", { className: "font-mono text-xs", children: "API" }) }),
+        /* @__PURE__ */ jsx90("div", { className: "flex size-11 items-center justify-center border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface-muted)] text-[var(--tapiz-accent)]", children: logo ?? /* @__PURE__ */ jsx90("span", { className: "font-mono text-xs", children: "API" }) }),
         /* @__PURE__ */ jsxs66("div", { children: [
-          /* @__PURE__ */ jsx89("h3", { className: "text-sm font-semibold text-[var(--tapiz-text-primary)]", children: name }),
-          description ? /* @__PURE__ */ jsx89("p", { className: "mt-1 text-sm leading-5 text-[var(--tapiz-text-muted)]", children: description }) : null
+          /* @__PURE__ */ jsx90("h3", { className: "text-sm font-semibold text-[var(--tapiz-text-primary)]", children: name }),
+          description ? /* @__PURE__ */ jsx90("p", { className: "mt-1 text-sm leading-5 text-[var(--tapiz-text-muted)]", children: description }) : null
         ] })
       ] }),
-      /* @__PURE__ */ jsx89(StatusBadge, { variant: statusVariant[status], label: statusLabel[status] })
+      /* @__PURE__ */ jsx90(StatusBadge, { variant: statusVariant[status], label: statusLabel[status] })
     ] }),
     /* @__PURE__ */ jsxs66("div", { className: "mt-5 flex flex-wrap items-center justify-between gap-3 border-t border-[var(--tapiz-border-subtle)] pt-4", children: [
-      /* @__PURE__ */ jsx89("div", { className: "font-mono text-xs text-[var(--tapiz-text-muted)]", children: lastSync ?? "No sync yet" }),
-      actions ? /* @__PURE__ */ jsx89("div", { className: "flex gap-2", children: actions }) : null
+      /* @__PURE__ */ jsx90("div", { className: "font-mono text-xs text-[var(--tapiz-text-muted)]", children: lastSync ?? "No sync yet" }),
+      actions ? /* @__PURE__ */ jsx90("div", { className: "flex gap-2", children: actions }) : null
     ] })
   ] });
 }
 
 // src/components/framework/HealthIndicator.tsx
-import { jsx as jsx90, jsxs as jsxs67 } from "react/jsx-runtime";
+import { jsx as jsx91, jsxs as jsxs67 } from "react/jsx-runtime";
 var toneClasses2 = {
   operational: "bg-[var(--tapiz-success)]",
   degraded: "bg-[var(--tapiz-warning)]",
@@ -2991,33 +3059,33 @@ var defaultLabel = {
 };
 function HealthIndicator({ tone: tone2 = "unknown", label, detail, className = "" }) {
   return /* @__PURE__ */ jsxs67("div", { className: `inline-flex items-center gap-3 border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] px-3 py-2 ${className}`, children: [
-    /* @__PURE__ */ jsx90("span", { className: `size-2.5 ${toneClasses2[tone2]}`, "aria-hidden": "true" }),
-    /* @__PURE__ */ jsx90("span", { className: "text-sm font-medium text-[var(--tapiz-text-primary)]", children: label ?? defaultLabel[tone2] }),
-    detail ? /* @__PURE__ */ jsx90("span", { className: "font-mono text-xs text-[var(--tapiz-text-muted)]", children: detail }) : null
+    /* @__PURE__ */ jsx91("span", { className: `size-2.5 ${toneClasses2[tone2]}`, "aria-hidden": "true" }),
+    /* @__PURE__ */ jsx91("span", { className: "text-sm font-medium text-[var(--tapiz-text-primary)]", children: label ?? defaultLabel[tone2] }),
+    detail ? /* @__PURE__ */ jsx91("span", { className: "font-mono text-xs text-[var(--tapiz-text-muted)]", children: detail }) : null
   ] });
 }
 
 // src/components/framework/AuditLog.tsx
-import { jsx as jsx91, jsxs as jsxs68 } from "react/jsx-runtime";
+import { jsx as jsx92, jsxs as jsxs68 } from "react/jsx-runtime";
 function AuditLog({ items, className = "" }) {
-  return /* @__PURE__ */ jsx91("div", { className: `divide-y divide-[var(--tapiz-border-subtle)] border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] ${className}`, children: items.map((item, index) => /* @__PURE__ */ jsxs68("div", { className: "flex gap-3 p-4", children: [
-    /* @__PURE__ */ jsx91(Avatar, { name: item.initials ?? item.actor, size: "sm" }),
+  return /* @__PURE__ */ jsx92("div", { className: `divide-y divide-[var(--tapiz-border-subtle)] border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] ${className}`, children: items.map((item, index) => /* @__PURE__ */ jsxs68("div", { className: "flex gap-3 p-4", children: [
+    /* @__PURE__ */ jsx92(Avatar, { name: item.initials ?? item.actor, size: "sm" }),
     /* @__PURE__ */ jsxs68("div", { className: "min-w-0 flex-1", children: [
       /* @__PURE__ */ jsxs68("div", { className: "flex flex-wrap items-center justify-between gap-2", children: [
         /* @__PURE__ */ jsxs68("p", { className: "text-sm text-[var(--tapiz-text-secondary)]", children: [
-          /* @__PURE__ */ jsx91("strong", { className: "text-[var(--tapiz-text-primary)]", children: item.actor }),
+          /* @__PURE__ */ jsx92("strong", { className: "text-[var(--tapiz-text-primary)]", children: item.actor }),
           " ",
           item.action
         ] }),
-        /* @__PURE__ */ jsx91("span", { className: "font-mono text-[11px] text-[var(--tapiz-text-muted)]", children: item.timestamp })
+        /* @__PURE__ */ jsx92("span", { className: "font-mono text-[11px] text-[var(--tapiz-text-muted)]", children: item.timestamp })
       ] }),
-      item.detail ? /* @__PURE__ */ jsx91("div", { className: "mt-1 text-xs leading-5 text-[var(--tapiz-text-muted)]", children: item.detail }) : null
+      item.detail ? /* @__PURE__ */ jsx92("div", { className: "mt-1 text-xs leading-5 text-[var(--tapiz-text-muted)]", children: item.detail }) : null
     ] })
   ] }, index)) });
 }
 
 // src/components/framework/KanbanBoard.tsx
-import { jsx as jsx92, jsxs as jsxs69 } from "react/jsx-runtime";
+import { jsx as jsx93, jsxs as jsxs69 } from "react/jsx-runtime";
 var toneClasses3 = {
   default: "border-[var(--tapiz-border-subtle)]",
   accent: "border-[var(--tapiz-accent)]",
@@ -3026,65 +3094,65 @@ var toneClasses3 = {
   danger: "border-[var(--tapiz-danger)]"
 };
 function KanbanBoard({ columns, className = "" }) {
-  return /* @__PURE__ */ jsx92("div", { className: `grid gap-4 overflow-x-auto md:grid-flow-col md:auto-cols-[minmax(18rem,1fr)] ${className}`, children: columns.map((column) => /* @__PURE__ */ jsxs69("section", { className: "border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)] p-3", children: [
+  return /* @__PURE__ */ jsx93("div", { className: `grid gap-4 overflow-x-auto md:grid-flow-col md:auto-cols-[minmax(18rem,1fr)] ${className}`, children: columns.map((column) => /* @__PURE__ */ jsxs69("section", { className: "border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)] p-3", children: [
     /* @__PURE__ */ jsxs69("div", { className: "mb-3 flex items-start justify-between gap-3", children: [
       /* @__PURE__ */ jsxs69("div", { children: [
-        /* @__PURE__ */ jsx92("h3", { className: "text-sm font-semibold text-[var(--tapiz-text-primary)]", children: column.title }),
-        column.description ? /* @__PURE__ */ jsx92("p", { className: "mt-1 text-xs text-[var(--tapiz-text-muted)]", children: column.description }) : null
+        /* @__PURE__ */ jsx93("h3", { className: "text-sm font-semibold text-[var(--tapiz-text-primary)]", children: column.title }),
+        column.description ? /* @__PURE__ */ jsx93("p", { className: "mt-1 text-xs text-[var(--tapiz-text-muted)]", children: column.description }) : null
       ] }),
-      /* @__PURE__ */ jsx92("span", { className: "font-mono text-xs text-[var(--tapiz-text-muted)]", children: column.items.length })
+      /* @__PURE__ */ jsx93("span", { className: "font-mono text-xs text-[var(--tapiz-text-muted)]", children: column.items.length })
     ] }),
-    /* @__PURE__ */ jsx92("div", { className: "space-y-3", children: column.items.map((item) => /* @__PURE__ */ jsxs69("article", { className: `border-l-2 bg-[var(--tapiz-bg-surface)] p-3 shadow-[var(--tapiz-shadow-sm)] ${toneClasses3[item.tone ?? "default"]}`, children: [
-      /* @__PURE__ */ jsx92("h4", { className: "text-sm font-medium text-[var(--tapiz-text-primary)]", children: item.title }),
-      item.description ? /* @__PURE__ */ jsx92("p", { className: "mt-1 text-xs leading-5 text-[var(--tapiz-text-muted)]", children: item.description }) : null,
-      item.meta ? /* @__PURE__ */ jsx92("div", { className: "mt-3 font-mono text-[11px] text-[var(--tapiz-text-muted)]", children: item.meta }) : null
+    /* @__PURE__ */ jsx93("div", { className: "space-y-3", children: column.items.map((item) => /* @__PURE__ */ jsxs69("article", { className: `border-l-2 bg-[var(--tapiz-bg-surface)] p-3 shadow-[var(--tapiz-shadow-sm)] ${toneClasses3[item.tone ?? "default"]}`, children: [
+      /* @__PURE__ */ jsx93("h4", { className: "text-sm font-medium text-[var(--tapiz-text-primary)]", children: item.title }),
+      item.description ? /* @__PURE__ */ jsx93("p", { className: "mt-1 text-xs leading-5 text-[var(--tapiz-text-muted)]", children: item.description }) : null,
+      item.meta ? /* @__PURE__ */ jsx93("div", { className: "mt-3 font-mono text-[11px] text-[var(--tapiz-text-muted)]", children: item.meta }) : null
     ] }, item.id)) })
   ] }, column.id)) });
 }
 
 // src/components/framework/AccessMatrix.tsx
-import { jsx as jsx93, jsxs as jsxs70 } from "react/jsx-runtime";
+import { jsx as jsx94, jsxs as jsxs70 } from "react/jsx-runtime";
 function AccessMatrix({ roles, permissions, className = "" }) {
-  return /* @__PURE__ */ jsx93("div", { className: `overflow-x-auto border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] ${className}`, children: /* @__PURE__ */ jsxs70("table", { className: "min-w-full text-sm", children: [
-    /* @__PURE__ */ jsx93("thead", { children: /* @__PURE__ */ jsxs70("tr", { children: [
-      /* @__PURE__ */ jsx93("th", { className: "px-4 py-3 text-left", children: "Permission" }),
-      roles.map((role) => /* @__PURE__ */ jsx93("th", { className: "px-4 py-3 text-center", children: role.label }, role.key))
+  return /* @__PURE__ */ jsx94("div", { className: `overflow-x-auto border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] ${className}`, children: /* @__PURE__ */ jsxs70("table", { className: "min-w-full text-sm", children: [
+    /* @__PURE__ */ jsx94("thead", { children: /* @__PURE__ */ jsxs70("tr", { children: [
+      /* @__PURE__ */ jsx94("th", { className: "px-4 py-3 text-left", children: "Permission" }),
+      roles.map((role) => /* @__PURE__ */ jsx94("th", { className: "px-4 py-3 text-center", children: role.label }, role.key))
     ] }) }),
-    /* @__PURE__ */ jsx93("tbody", { children: permissions.map((permission) => /* @__PURE__ */ jsxs70("tr", { children: [
+    /* @__PURE__ */ jsx94("tbody", { children: permissions.map((permission) => /* @__PURE__ */ jsxs70("tr", { children: [
       /* @__PURE__ */ jsxs70("td", { className: "px-4 py-3", children: [
-        /* @__PURE__ */ jsx93("div", { className: "font-medium text-[var(--tapiz-text-primary)]", children: permission.label }),
-        permission.description ? /* @__PURE__ */ jsx93("div", { className: "mt-1 text-xs text-[var(--tapiz-text-muted)]", children: permission.description }) : null
+        /* @__PURE__ */ jsx94("div", { className: "font-medium text-[var(--tapiz-text-primary)]", children: permission.label }),
+        permission.description ? /* @__PURE__ */ jsx94("div", { className: "mt-1 text-xs text-[var(--tapiz-text-muted)]", children: permission.description }) : null
       ] }),
-      roles.map((role) => /* @__PURE__ */ jsx93("td", { className: "px-4 py-3 text-center", children: /* @__PURE__ */ jsx93("span", { className: permission.roles[role.key] ? "text-[var(--tapiz-success)]" : "text-[var(--tapiz-text-disabled)]", children: permission.roles[role.key] ? "\u2713" : "\u2014" }) }, role.key))
+      roles.map((role) => /* @__PURE__ */ jsx94("td", { className: "px-4 py-3 text-center", children: /* @__PURE__ */ jsx94("span", { className: permission.roles[role.key] ? "text-[var(--tapiz-success)]" : "text-[var(--tapiz-text-disabled)]", children: permission.roles[role.key] ? "\u2713" : "\u2014" }) }, role.key))
     ] }, permission.key)) })
   ] }) });
 }
 
 // src/components/framework/CalendarGrid.tsx
-import { jsx as jsx94, jsxs as jsxs71 } from "react/jsx-runtime";
+import { jsx as jsx95, jsxs as jsxs71 } from "react/jsx-runtime";
 var defaultWeekdays = ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"];
 function CalendarGrid({ days, weekdays = defaultWeekdays, className = "" }) {
   return /* @__PURE__ */ jsxs71("div", { className: `border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] ${className}`, children: [
-    /* @__PURE__ */ jsx94("div", { className: "grid grid-cols-7 border-b border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)]", children: weekdays.map((day, index) => /* @__PURE__ */ jsx94("div", { className: "px-3 py-2 font-mono text-[10px] uppercase tracking-[0.16em] text-[var(--tapiz-text-muted)]", children: day }, index)) }),
-    /* @__PURE__ */ jsx94("div", { className: "grid grid-cols-7", children: days.map((day, index) => /* @__PURE__ */ jsxs71("div", { className: `min-h-28 border-b border-r border-[var(--tapiz-border-subtle)] p-2 ${day.muted ? "opacity-45" : ""} ${day.selected ? "bg-[var(--tapiz-accent-soft)]" : ""}`, children: [
+    /* @__PURE__ */ jsx95("div", { className: "grid grid-cols-7 border-b border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)]", children: weekdays.map((day, index) => /* @__PURE__ */ jsx95("div", { className: "px-3 py-2 font-mono text-[10px] uppercase tracking-[0.16em] text-[var(--tapiz-text-muted)]", children: day }, index)) }),
+    /* @__PURE__ */ jsx95("div", { className: "grid grid-cols-7", children: days.map((day, index) => /* @__PURE__ */ jsxs71("div", { className: `min-h-28 border-b border-r border-[var(--tapiz-border-subtle)] p-2 ${day.muted ? "opacity-45" : ""} ${day.selected ? "bg-[var(--tapiz-accent-soft)]" : ""}`, children: [
       /* @__PURE__ */ jsxs71("div", { className: "flex items-center justify-between gap-2", children: [
-        /* @__PURE__ */ jsx94("span", { className: "font-mono text-xs text-[var(--tapiz-text-primary)]", children: day.date }),
-        day.label ? /* @__PURE__ */ jsx94("span", { className: "text-[10px] text-[var(--tapiz-text-muted)]", children: day.label }) : null
+        /* @__PURE__ */ jsx95("span", { className: "font-mono text-xs text-[var(--tapiz-text-primary)]", children: day.date }),
+        day.label ? /* @__PURE__ */ jsx95("span", { className: "text-[10px] text-[var(--tapiz-text-muted)]", children: day.label }) : null
       ] }),
-      day.events?.length ? /* @__PURE__ */ jsx94("div", { className: "mt-2 space-y-1", children: day.events.map((event, eventIndex) => /* @__PURE__ */ jsx94("div", { className: "truncate border-l-2 border-[var(--tapiz-accent)] bg-[var(--tapiz-bg-surface-muted)] px-2 py-1 text-[11px] text-[var(--tapiz-text-secondary)]", children: event }, eventIndex)) }) : null
+      day.events?.length ? /* @__PURE__ */ jsx95("div", { className: "mt-2 space-y-1", children: day.events.map((event, eventIndex) => /* @__PURE__ */ jsx95("div", { className: "truncate border-l-2 border-[var(--tapiz-accent)] bg-[var(--tapiz-bg-surface-muted)] px-2 py-1 text-[11px] text-[var(--tapiz-text-secondary)]", children: event }, eventIndex)) }) : null
     ] }, index)) })
   ] });
 }
 
 // src/components/forms/Slider.tsx
-import { jsx as jsx95, jsxs as jsxs72 } from "react/jsx-runtime";
+import { jsx as jsx96, jsxs as jsxs72 } from "react/jsx-runtime";
 function Slider({ label, valueLabel, className = "", ...props }) {
   return /* @__PURE__ */ jsxs72("label", { className: `block ${className}`, children: [
     label || valueLabel ? /* @__PURE__ */ jsxs72("span", { className: "mb-2 flex items-center justify-between gap-3 text-sm", children: [
-      label ? /* @__PURE__ */ jsx95("span", { className: "font-medium text-[var(--tapiz-text-secondary)]", children: label }) : /* @__PURE__ */ jsx95("span", {}),
-      valueLabel ? /* @__PURE__ */ jsx95("span", { className: "font-mono text-xs text-[var(--tapiz-text-muted)]", children: valueLabel }) : null
+      label ? /* @__PURE__ */ jsx96("span", { className: "font-medium text-[var(--tapiz-text-secondary)]", children: label }) : /* @__PURE__ */ jsx96("span", {}),
+      valueLabel ? /* @__PURE__ */ jsx96("span", { className: "font-mono text-xs text-[var(--tapiz-text-muted)]", children: valueLabel }) : null
     ] }) : null,
-    /* @__PURE__ */ jsx95(
+    /* @__PURE__ */ jsx96(
       "input",
       {
         ...props,
@@ -3096,19 +3164,19 @@ function Slider({ label, valueLabel, className = "", ...props }) {
 }
 
 // src/components/forms/FileDropzone.tsx
-import { jsx as jsx96, jsxs as jsxs73 } from "react/jsx-runtime";
+import { jsx as jsx97, jsxs as jsxs73 } from "react/jsx-runtime";
 function FileDropzone({ title = "Drop files here", description, actionLabel = "Browse", className = "", ...props }) {
   return /* @__PURE__ */ jsxs73("label", { className: `block cursor-pointer border-2 border-dashed border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] p-6 text-center hover:bg-[var(--tapiz-bg-surface-muted)] ${className}`, children: [
-    /* @__PURE__ */ jsx96("input", { ...props, type: "file", className: "sr-only" }),
-    /* @__PURE__ */ jsx96("span", { className: "block text-sm font-semibold text-[var(--tapiz-text-primary)]", children: title }),
-    description ? /* @__PURE__ */ jsx96("span", { className: "mt-2 block text-sm text-[var(--tapiz-text-muted)]", children: description }) : null,
-    /* @__PURE__ */ jsx96("span", { className: "mt-4 inline-flex border border-[var(--tapiz-border-strong)] px-3 py-1.5 font-mono text-xs uppercase tracking-[0.12em] text-[var(--tapiz-accent)]", children: actionLabel })
+    /* @__PURE__ */ jsx97("input", { ...props, type: "file", className: "sr-only" }),
+    /* @__PURE__ */ jsx97("span", { className: "block text-sm font-semibold text-[var(--tapiz-text-primary)]", children: title }),
+    description ? /* @__PURE__ */ jsx97("span", { className: "mt-2 block text-sm text-[var(--tapiz-text-muted)]", children: description }) : null,
+    /* @__PURE__ */ jsx97("span", { className: "mt-4 inline-flex border border-[var(--tapiz-border-strong)] px-3 py-1.5 font-mono text-xs uppercase tracking-[0.12em] text-[var(--tapiz-accent)]", children: actionLabel })
   ] });
 }
 
 // src/components/forms/PasswordInput.tsx
 import { useState as useState7 } from "react";
-import { jsx as jsx97, jsxs as jsxs74 } from "react/jsx-runtime";
+import { jsx as jsx98, jsxs as jsxs74 } from "react/jsx-runtime";
 function PasswordInput({
   revealLabel = "Show password",
   className = "",
@@ -3120,7 +3188,7 @@ function PasswordInput({
     {
       className: `flex border border-(--tapiz-border-strong) bg-(--tapiz-bg-surface) focus-within:border-(--tapiz-border-focus) focus-within:shadow-[inset_3px_0_0_0_var(--tapiz-signal)] ${className}`,
       children: [
-        /* @__PURE__ */ jsx97(
+        /* @__PURE__ */ jsx98(
           "input",
           {
             ...props,
@@ -3128,7 +3196,7 @@ function PasswordInput({
             className: "min-w-0 flex-1 border-0 bg-transparent px-3 py-2 text-sm text-(--tapiz-text-primary) outline-none focus:shadow-none!"
           }
         ),
-        /* @__PURE__ */ jsx97(
+        /* @__PURE__ */ jsx98(
           "button",
           {
             type: "button",
@@ -3137,7 +3205,7 @@ function PasswordInput({
             onClick: () => setVisible((v) => !v),
             tabIndex: -1,
             className: "grid place-items-center px-3 text-(--tapiz-text-muted) transition-colors hover:text-(--tapiz-text-primary)",
-            children: visible ? /* @__PURE__ */ jsx97(EyeOff, { size: 15 }) : /* @__PURE__ */ jsx97(Eye, { size: 15 })
+            children: visible ? /* @__PURE__ */ jsx98(EyeOff, { size: 15 }) : /* @__PURE__ */ jsx98(Eye, { size: 15 })
           }
         )
       ]
@@ -3146,11 +3214,11 @@ function PasswordInput({
 }
 
 // src/components/forms/TextareaCounter.tsx
-import { jsx as jsx98, jsxs as jsxs75 } from "react/jsx-runtime";
+import { jsx as jsx99, jsxs as jsxs75 } from "react/jsx-runtime";
 function TextareaCounter({ maxLength, value = "", className = "", ...props }) {
   const count = value.length;
   return /* @__PURE__ */ jsxs75("div", { className, children: [
-    /* @__PURE__ */ jsx98("textarea", { ...props, value, maxLength, className: "input-field min-h-28" }),
+    /* @__PURE__ */ jsx99("textarea", { ...props, value, maxLength, className: "input-field min-h-28" }),
     /* @__PURE__ */ jsxs75("div", { className: "mt-1 text-right font-mono text-[11px] text-[var(--tapiz-text-muted)]", children: [
       count,
       "/",
@@ -3160,7 +3228,7 @@ function TextareaCounter({ maxLength, value = "", className = "", ...props }) {
 }
 
 // src/components/feedback/Callout.tsx
-import { jsx as jsx99, jsxs as jsxs76 } from "react/jsx-runtime";
+import { jsx as jsx100, jsxs as jsxs76 } from "react/jsx-runtime";
 var toneClasses4 = {
   info: "border-[var(--tapiz-info)] bg-[var(--tapiz-info-soft)]",
   success: "border-[var(--tapiz-success)] bg-[var(--tapiz-success-soft)]",
@@ -3169,73 +3237,73 @@ var toneClasses4 = {
   neutral: "border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface-muted)]"
 };
 function Callout({ title, children, tone: tone2 = "info", icon, actions, className = "" }) {
-  return /* @__PURE__ */ jsx99("aside", { className: `border-l-4 p-4 ${toneClasses4[tone2]} ${className}`, children: /* @__PURE__ */ jsxs76("div", { className: "flex gap-3", children: [
-    icon ? /* @__PURE__ */ jsx99("div", { className: "text-[var(--tapiz-text-primary)]", children: icon }) : null,
+  return /* @__PURE__ */ jsx100("aside", { className: `border-l-4 p-4 ${toneClasses4[tone2]} ${className}`, children: /* @__PURE__ */ jsxs76("div", { className: "flex gap-3", children: [
+    icon ? /* @__PURE__ */ jsx100("div", { className: "text-[var(--tapiz-text-primary)]", children: icon }) : null,
     /* @__PURE__ */ jsxs76("div", { className: "min-w-0 flex-1", children: [
-      title ? /* @__PURE__ */ jsx99("h3", { className: "text-sm font-semibold text-[var(--tapiz-text-primary)]", children: title }) : null,
-      children ? /* @__PURE__ */ jsx99("div", { className: "mt-1 text-sm leading-6 text-[var(--tapiz-text-secondary)]", children }) : null,
-      actions ? /* @__PURE__ */ jsx99("div", { className: "mt-3 flex flex-wrap gap-2", children: actions }) : null
+      title ? /* @__PURE__ */ jsx100("h3", { className: "text-sm font-semibold text-[var(--tapiz-text-primary)]", children: title }) : null,
+      children ? /* @__PURE__ */ jsx100("div", { className: "mt-1 text-sm leading-6 text-[var(--tapiz-text-secondary)]", children }) : null,
+      actions ? /* @__PURE__ */ jsx100("div", { className: "mt-3 flex flex-wrap gap-2", children: actions }) : null
     ] })
   ] }) });
 }
 
 // src/components/feedback/LoadingOverlay.tsx
-import { jsx as jsx100, jsxs as jsxs77 } from "react/jsx-runtime";
+import { jsx as jsx101, jsxs as jsxs77 } from "react/jsx-runtime";
 function LoadingOverlay({ visible = false, label = "Loading", children, className = "" }) {
   return /* @__PURE__ */ jsxs77("div", { className: `relative ${className}`, children: [
     children,
-    visible ? /* @__PURE__ */ jsx100("div", { className: "absolute inset-0 grid place-items-center border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-overlay)] backdrop-blur-sm", children: /* @__PURE__ */ jsxs77("div", { className: "flex items-center gap-3 border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] px-4 py-3 text-sm text-[var(--tapiz-text-primary)] shadow-[var(--tapiz-shadow-brutal)]", children: [
-      /* @__PURE__ */ jsx100(Spinner, {}),
-      /* @__PURE__ */ jsx100("span", { children: label })
+    visible ? /* @__PURE__ */ jsx101("div", { className: "absolute inset-0 grid place-items-center border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-overlay)] backdrop-blur-sm", children: /* @__PURE__ */ jsxs77("div", { className: "flex items-center gap-3 border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface)] px-4 py-3 text-sm text-[var(--tapiz-text-primary)] shadow-[var(--tapiz-shadow-brutal)]", children: [
+      /* @__PURE__ */ jsx101(Spinner, {}),
+      /* @__PURE__ */ jsx101("span", { children: label })
     ] }) }) : null
   ] });
 }
 
 // src/components/feedback/NotificationList.tsx
-import { jsx as jsx101, jsxs as jsxs78 } from "react/jsx-runtime";
+import { jsx as jsx102, jsxs as jsxs78 } from "react/jsx-runtime";
 function NotificationList({ items, className = "" }) {
-  return /* @__PURE__ */ jsx101("div", { className: `divide-y divide-[var(--tapiz-border-subtle)] border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] ${className}`, children: items.map((item) => /* @__PURE__ */ jsxs78("article", { className: "flex gap-3 p-4", children: [
-    /* @__PURE__ */ jsx101("span", { className: `mt-1 size-2.5 ${item.unread ? "bg-[var(--tapiz-accent)]" : "bg-[var(--tapiz-border-subtle)]"}`, "aria-hidden": "true" }),
+  return /* @__PURE__ */ jsx102("div", { className: `divide-y divide-[var(--tapiz-border-subtle)] border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] ${className}`, children: items.map((item) => /* @__PURE__ */ jsxs78("article", { className: "flex gap-3 p-4", children: [
+    /* @__PURE__ */ jsx102("span", { className: `mt-1 size-2.5 ${item.unread ? "bg-[var(--tapiz-accent)]" : "bg-[var(--tapiz-border-subtle)]"}`, "aria-hidden": "true" }),
     /* @__PURE__ */ jsxs78("div", { className: "min-w-0 flex-1", children: [
       /* @__PURE__ */ jsxs78("div", { className: "flex items-start justify-between gap-3", children: [
-        /* @__PURE__ */ jsx101("h3", { className: "text-sm font-medium text-[var(--tapiz-text-primary)]", children: item.title }),
-        item.time ? /* @__PURE__ */ jsx101("span", { className: "font-mono text-[11px] text-[var(--tapiz-text-muted)]", children: item.time }) : null
+        /* @__PURE__ */ jsx102("h3", { className: "text-sm font-medium text-[var(--tapiz-text-primary)]", children: item.title }),
+        item.time ? /* @__PURE__ */ jsx102("span", { className: "font-mono text-[11px] text-[var(--tapiz-text-muted)]", children: item.time }) : null
       ] }),
-      item.description ? /* @__PURE__ */ jsx101("p", { className: "mt-1 text-sm leading-5 text-[var(--tapiz-text-muted)]", children: item.description }) : null,
-      item.action ? /* @__PURE__ */ jsx101("div", { className: "mt-3", children: item.action }) : null
+      item.description ? /* @__PURE__ */ jsx102("p", { className: "mt-1 text-sm leading-5 text-[var(--tapiz-text-muted)]", children: item.description }) : null,
+      item.action ? /* @__PURE__ */ jsx102("div", { className: "mt-3", children: item.action }) : null
     ] })
   ] }, item.id)) });
 }
 
 // src/components/layout/MasonryGrid.tsx
-import { jsx as jsx102 } from "react/jsx-runtime";
+import { jsx as jsx103 } from "react/jsx-runtime";
 var columnClasses = { 2: "md:columns-2", 3: "md:columns-2 xl:columns-3", 4: "md:columns-2 lg:columns-3 xl:columns-4" };
 var gapClasses4 = { sm: "gap-3", md: "gap-5", lg: "gap-8" };
 function MasonryGrid({ children, columns = 3, gap = "md", className = "", style }) {
-  return /* @__PURE__ */ jsx102("div", { className: [columnClasses[columns], gapClasses4[gap], className].filter(Boolean).join(" "), style, children });
+  return /* @__PURE__ */ jsx103("div", { className: [columnClasses[columns], gapClasses4[gap], className].filter(Boolean).join(" "), style, children });
 }
 
 // src/components/layout/PageRail.tsx
-import { Fragment as Fragment5, jsx as jsx103, jsxs as jsxs79 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx104, jsxs as jsxs79 } from "react/jsx-runtime";
 function PageRail({ title, items, actions, className = "", style }) {
   return /* @__PURE__ */ jsxs79("aside", { className: ["sticky top-20 rounded-none border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] p-3 shadow-[var(--tapiz-shadow-sm)]", className].filter(Boolean).join(" "), style, children: [
-    title ? /* @__PURE__ */ jsx103("div", { className: "kicker mb-3 px-2", children: title }) : null,
-    /* @__PURE__ */ jsx103("nav", { className: "flex flex-col gap-1", children: items.map((item, index) => {
+    title ? /* @__PURE__ */ jsx104("div", { className: "kicker mb-3 px-2", children: title }) : null,
+    /* @__PURE__ */ jsx104("nav", { className: "flex flex-col gap-1", children: items.map((item, index) => {
       const content = /* @__PURE__ */ jsxs79(Fragment5, { children: [
-        /* @__PURE__ */ jsx103("span", { className: "truncate", children: item.label }),
-        item.meta ? /* @__PURE__ */ jsx103("span", { className: "font-mono text-[10px] text-[var(--tapiz-text-muted)]", children: item.meta }) : null
+        /* @__PURE__ */ jsx104("span", { className: "truncate", children: item.label }),
+        item.meta ? /* @__PURE__ */ jsx104("span", { className: "font-mono text-[10px] text-[var(--tapiz-text-muted)]", children: item.meta }) : null
       ] });
       const classes = ["flex items-center justify-between gap-3 border px-3 py-2 text-sm transition", item.active ? "border-[var(--tapiz-border-strong)] bg-[var(--tapiz-accent-soft)] text-[var(--tapiz-text-primary)]" : "border-transparent text-[var(--tapiz-text-muted)] hover:border-[var(--tapiz-border-subtle)] hover:text-[var(--tapiz-text-primary)]"].join(" ");
-      return item.href ? /* @__PURE__ */ jsx103("a", { href: item.href, className: classes, children: content }, index) : /* @__PURE__ */ jsx103("div", { className: classes, children: content }, index);
+      return item.href ? /* @__PURE__ */ jsx104("a", { href: item.href, className: classes, children: content }, index) : /* @__PURE__ */ jsx104("div", { className: classes, children: content }, index);
     }) }),
-    actions ? /* @__PURE__ */ jsx103("div", { className: "mt-3 border-t border-[var(--tapiz-border-subtle)] pt-3", children: actions }) : null
+    actions ? /* @__PURE__ */ jsx104("div", { className: "mt-3 border-t border-[var(--tapiz-border-subtle)] pt-3", children: actions }) : null
   ] });
 }
 
 // src/components/layout/StickyBar.tsx
-import { jsx as jsx104 } from "react/jsx-runtime";
+import { jsx as jsx105 } from "react/jsx-runtime";
 function StickyBar({ children, position = "top", className = "", style }) {
-  return /* @__PURE__ */ jsx104(
+  return /* @__PURE__ */ jsx105(
     "div",
     {
       className: ["z-30 border-[var(--tapiz-border-subtle)] bg-[color-mix(in_srgb,var(--tapiz-bg-canvas)_88%,transparent)] px-4 py-3 backdrop-blur-xl", position === "top" ? "sticky top-0 border-b" : "sticky bottom-0 border-t", className].filter(Boolean).join(" "),
@@ -3246,53 +3314,53 @@ function StickyBar({ children, position = "top", className = "", style }) {
 }
 
 // src/components/forms/Combobox.tsx
-import { jsx as jsx105, jsxs as jsxs80 } from "react/jsx-runtime";
+import { jsx as jsx106, jsxs as jsxs80 } from "react/jsx-runtime";
 function Combobox({ options, placeholder = "Select option", invalid = false, className = "", ...props }) {
   return /* @__PURE__ */ jsxs80("select", { ...props, className: ["input-field appearance-none bg-[var(--tapiz-bg-surface)]", invalid ? "border-warn focus:border-warn" : "", className].filter(Boolean).join(" "), children: [
-    /* @__PURE__ */ jsx105("option", { value: "", children: placeholder }),
-    options.map((option) => /* @__PURE__ */ jsx105("option", { value: option.value, children: String(option.label) }, option.value))
+    /* @__PURE__ */ jsx106("option", { value: "", children: placeholder }),
+    options.map((option) => /* @__PURE__ */ jsx106("option", { value: option.value, children: String(option.label) }, option.value))
   ] });
 }
 
 // src/components/forms/DateRangePicker.tsx
-import { jsx as jsx106, jsxs as jsxs81 } from "react/jsx-runtime";
+import { jsx as jsx107, jsxs as jsxs81 } from "react/jsx-runtime";
 function DateRangePicker({ startLabel = "From", endLabel = "To", startProps, endProps, className = "" }) {
   return /* @__PURE__ */ jsxs81("div", { className: ["grid gap-3 md:grid-cols-2", className].filter(Boolean).join(" "), children: [
     /* @__PURE__ */ jsxs81("label", { className: "flex flex-col gap-1.5 text-sm text-[var(--tapiz-text-muted)]", children: [
-      /* @__PURE__ */ jsx106("span", { children: startLabel }),
-      /* @__PURE__ */ jsx106("input", { type: "date", ...startProps, className: ["input-field", startProps?.className || ""].join(" ") })
+      /* @__PURE__ */ jsx107("span", { children: startLabel }),
+      /* @__PURE__ */ jsx107("input", { type: "date", ...startProps, className: ["input-field", startProps?.className || ""].join(" ") })
     ] }),
     /* @__PURE__ */ jsxs81("label", { className: "flex flex-col gap-1.5 text-sm text-[var(--tapiz-text-muted)]", children: [
-      /* @__PURE__ */ jsx106("span", { children: endLabel }),
-      /* @__PURE__ */ jsx106("input", { type: "date", ...endProps, className: ["input-field", endProps?.className || ""].join(" ") })
+      /* @__PURE__ */ jsx107("span", { children: endLabel }),
+      /* @__PURE__ */ jsx107("input", { type: "date", ...endProps, className: ["input-field", endProps?.className || ""].join(" ") })
     ] })
   ] });
 }
 
 // src/components/forms/ColorSwatchPicker.tsx
-import { jsx as jsx107, jsxs as jsxs82 } from "react/jsx-runtime";
+import { jsx as jsx108, jsxs as jsxs82 } from "react/jsx-runtime";
 function ColorSwatchPicker({ options, value, onChange, className = "" }) {
-  return /* @__PURE__ */ jsx107("div", { className: ["flex flex-wrap gap-2", className].filter(Boolean).join(" "), children: options.map((option) => {
+  return /* @__PURE__ */ jsx108("div", { className: ["flex flex-wrap gap-2", className].filter(Boolean).join(" "), children: options.map((option) => {
     const selected = option.value === value;
     return /* @__PURE__ */ jsxs82("button", { type: "button", "aria-pressed": selected, onClick: () => onChange?.(option.value), className: ["flex items-center gap-2 border px-3 py-2 text-sm transition", selected ? "border-[var(--tapiz-border-strong)] bg-[var(--tapiz-accent-soft)]" : "border-[var(--tapiz-border-subtle)] hover:border-[var(--tapiz-border-strong)]"].join(" "), children: [
-      /* @__PURE__ */ jsx107("span", { className: "h-4 w-4 border border-[var(--tapiz-border-strong)]", style: { background: option.color } }),
-      /* @__PURE__ */ jsx107("span", { children: option.label })
+      /* @__PURE__ */ jsx108("span", { className: "h-4 w-4 border border-[var(--tapiz-border-strong)]", style: { background: option.color } }),
+      /* @__PURE__ */ jsx108("span", { children: option.label })
     ] }, option.value);
   }) });
 }
 
 // src/components/forms/RatingInput.tsx
-import { jsx as jsx108 } from "react/jsx-runtime";
+import { jsx as jsx109 } from "react/jsx-runtime";
 function RatingInput({ value = 0, max = 5, icon = "\u2605", onChange, label = "Rating", className = "" }) {
-  return /* @__PURE__ */ jsx108("div", { className: ["inline-flex items-center gap-1", className].filter(Boolean).join(" "), role: "radiogroup", "aria-label": label, children: Array.from({ length: max }, (_, index) => {
+  return /* @__PURE__ */ jsx109("div", { className: ["inline-flex items-center gap-1", className].filter(Boolean).join(" "), role: "radiogroup", "aria-label": label, children: Array.from({ length: max }, (_, index) => {
     const score = index + 1;
     const active = score <= value;
-    return /* @__PURE__ */ jsx108("button", { type: "button", role: "radio", "aria-checked": active, onClick: () => onChange?.(score), className: ["grid h-9 w-9 place-items-center border text-base transition", active ? "border-[var(--tapiz-border-strong)] bg-[var(--tapiz-accent-soft)] text-[var(--tapiz-accent)]" : "border-[var(--tapiz-border-subtle)] text-[var(--tapiz-text-muted)] hover:border-[var(--tapiz-border-strong)]"].join(" "), children: icon }, score);
+    return /* @__PURE__ */ jsx109("button", { type: "button", role: "radio", "aria-checked": active, onClick: () => onChange?.(score), className: ["grid h-9 w-9 place-items-center border text-base transition", active ? "border-[var(--tapiz-border-strong)] bg-[var(--tapiz-accent-soft)] text-[var(--tapiz-accent)]" : "border-[var(--tapiz-border-subtle)] text-[var(--tapiz-text-muted)] hover:border-[var(--tapiz-border-strong)]"].join(" "), children: icon }, score);
   }) });
 }
 
 // src/components/data-display/ScoreRing.tsx
-import { jsx as jsx109, jsxs as jsxs83 } from "react/jsx-runtime";
+import { jsx as jsx110, jsxs as jsxs83 } from "react/jsx-runtime";
 function ScoreRing({ value, max = 100, label, size = 112, className = "" }) {
   const normalized = Math.max(0, Math.min(1, value / max));
   const radius = 42;
@@ -3300,131 +3368,131 @@ function ScoreRing({ value, max = 100, label, size = 112, className = "" }) {
   const dash = circumference * normalized;
   return /* @__PURE__ */ jsxs83("div", { className: ["inline-grid place-items-center", className].filter(Boolean).join(" "), style: { width: size, height: size }, children: [
     /* @__PURE__ */ jsxs83("svg", { viewBox: "0 0 100 100", className: "h-full w-full -rotate-90", children: [
-      /* @__PURE__ */ jsx109("circle", { cx: "50", cy: "50", r: radius, fill: "none", stroke: "var(--tapiz-border-subtle)", strokeWidth: "10" }),
-      /* @__PURE__ */ jsx109("circle", { cx: "50", cy: "50", r: radius, fill: "none", stroke: "var(--tapiz-accent)", strokeWidth: "10", strokeLinecap: "square", strokeDasharray: `${dash} ${circumference - dash}` })
+      /* @__PURE__ */ jsx110("circle", { cx: "50", cy: "50", r: radius, fill: "none", stroke: "var(--tapiz-border-subtle)", strokeWidth: "10" }),
+      /* @__PURE__ */ jsx110("circle", { cx: "50", cy: "50", r: radius, fill: "none", stroke: "var(--tapiz-accent)", strokeWidth: "10", strokeLinecap: "square", strokeDasharray: `${dash} ${circumference - dash}` })
     ] }),
     /* @__PURE__ */ jsxs83("div", { className: "absolute text-center", children: [
       /* @__PURE__ */ jsxs83("div", { className: "font-display text-2xl font-semibold text-[var(--tapiz-text-primary)]", children: [
         Math.round(normalized * 100),
         "%"
       ] }),
-      label ? /* @__PURE__ */ jsx109("div", { className: "font-mono text-[10px] uppercase tracking-[0.16em] text-[var(--tapiz-text-muted)]", children: label }) : null
+      label ? /* @__PURE__ */ jsx110("div", { className: "font-mono text-[10px] uppercase tracking-[0.16em] text-[var(--tapiz-text-muted)]", children: label }) : null
     ] })
   ] });
 }
 
 // src/components/data-display/HeatmapGrid.tsx
-import { jsx as jsx110 } from "react/jsx-runtime";
+import { jsx as jsx111 } from "react/jsx-runtime";
 function HeatmapGrid({ cells, columns = 7, max, className = "" }) {
   const peak = max ?? Math.max(1, ...cells.map((cell) => cell.value));
-  return /* @__PURE__ */ jsx110("div", { className: ["grid gap-1", className].filter(Boolean).join(" "), style: { gridTemplateColumns: `repeat(${columns}, minmax(0, 1fr))` }, children: cells.map((cell, index) => {
+  return /* @__PURE__ */ jsx111("div", { className: ["grid gap-1", className].filter(Boolean).join(" "), style: { gridTemplateColumns: `repeat(${columns}, minmax(0, 1fr))` }, children: cells.map((cell, index) => {
     const opacity = 0.15 + Math.min(1, cell.value / peak) * 0.75;
-    return /* @__PURE__ */ jsx110("div", { title: cell.title, className: "aspect-square border border-[var(--tapiz-border-subtle)]", style: { background: `color-mix(in srgb, var(--tapiz-accent) ${Math.round(opacity * 100)}%, transparent)` }, children: cell.label ? /* @__PURE__ */ jsx110("span", { className: "sr-only", children: cell.label }) : null }, index);
+    return /* @__PURE__ */ jsx111("div", { title: cell.title, className: "aspect-square border border-[var(--tapiz-border-subtle)]", style: { background: `color-mix(in srgb, var(--tapiz-accent) ${Math.round(opacity * 100)}%, transparent)` }, children: cell.label ? /* @__PURE__ */ jsx111("span", { className: "sr-only", children: cell.label }) : null }, index);
   }) });
 }
 
 // src/components/data-display/FunnelChart.tsx
-import { jsx as jsx111, jsxs as jsxs84 } from "react/jsx-runtime";
+import { jsx as jsx112, jsxs as jsxs84 } from "react/jsx-runtime";
 function FunnelChart({ steps, className = "" }) {
   const max = Math.max(1, ...steps.map((step) => step.value));
-  return /* @__PURE__ */ jsx111("div", { className: ["space-y-3", className].filter(Boolean).join(" "), children: steps.map((step, index) => {
+  return /* @__PURE__ */ jsx112("div", { className: ["space-y-3", className].filter(Boolean).join(" "), children: steps.map((step, index) => {
     const width = Math.max(8, step.value / max * 100);
     return /* @__PURE__ */ jsxs84("div", { children: [
       /* @__PURE__ */ jsxs84("div", { className: "mb-1 flex items-center justify-between gap-3 text-sm", children: [
-        /* @__PURE__ */ jsx111("span", { className: "font-medium text-[var(--tapiz-text-primary)]", children: step.label }),
+        /* @__PURE__ */ jsx112("span", { className: "font-medium text-[var(--tapiz-text-primary)]", children: step.label }),
         /* @__PURE__ */ jsxs84("span", { className: "font-mono text-xs text-[var(--tapiz-text-muted)]", children: [
           step.value,
           step.meta ? ` \xB7 ${String(step.meta)}` : ""
         ] })
       ] }),
-      /* @__PURE__ */ jsx111("div", { className: "h-9 border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)]", children: /* @__PURE__ */ jsx111("div", { className: "h-full border-r border-[var(--tapiz-border-strong)] bg-[var(--tapiz-accent-soft)]", style: { width: `${width}%` } }) })
+      /* @__PURE__ */ jsx112("div", { className: "h-9 border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)]", children: /* @__PURE__ */ jsx112("div", { className: "h-full border-r border-[var(--tapiz-border-strong)] bg-[var(--tapiz-accent-soft)]", style: { width: `${width}%` } }) })
     ] }, index);
   }) });
 }
 
 // src/components/data-display/ComparisonMeter.tsx
-import { jsx as jsx112, jsxs as jsxs85 } from "react/jsx-runtime";
+import { jsx as jsx113, jsxs as jsxs85 } from "react/jsx-runtime";
 function ComparisonMeter({ leftLabel, rightLabel, value, className = "" }) {
   const clamped = Math.max(0, Math.min(100, value));
   return /* @__PURE__ */ jsxs85("div", { className, children: [
     /* @__PURE__ */ jsxs85("div", { className: "mb-2 flex justify-between gap-3 text-sm text-[var(--tapiz-text-muted)]", children: [
-      /* @__PURE__ */ jsx112("span", { children: leftLabel }),
-      /* @__PURE__ */ jsx112("span", { children: rightLabel })
+      /* @__PURE__ */ jsx113("span", { children: leftLabel }),
+      /* @__PURE__ */ jsx113("span", { children: rightLabel })
     ] }),
     /* @__PURE__ */ jsxs85("div", { className: "relative h-3 border border-[var(--tapiz-border-strong)] bg-[var(--tapiz-bg-surface-muted)]", children: [
-      /* @__PURE__ */ jsx112("div", { className: "h-full bg-[var(--tapiz-accent)]", style: { width: `${clamped}%` } }),
-      /* @__PURE__ */ jsx112("div", { className: "absolute top-[-6px] h-6 w-px bg-[var(--tapiz-border-strong)]", style: { left: `${clamped}%` } })
+      /* @__PURE__ */ jsx113("div", { className: "h-full bg-[var(--tapiz-accent)]", style: { width: `${clamped}%` } }),
+      /* @__PURE__ */ jsx113("div", { className: "absolute top-[-6px] h-6 w-px bg-[var(--tapiz-border-strong)]", style: { left: `${clamped}%` } })
     ] })
   ] });
 }
 
 // src/components/framework/ActivityFeed.tsx
-import { jsx as jsx113, jsxs as jsxs86 } from "react/jsx-runtime";
+import { jsx as jsx114, jsxs as jsxs86 } from "react/jsx-runtime";
 function ActivityFeed({ items, className = "" }) {
-  return /* @__PURE__ */ jsx113("div", { className: ["divide-y divide-[var(--tapiz-border-subtle)] border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)]", className].filter(Boolean).join(" "), children: items.map((item, index) => /* @__PURE__ */ jsxs86("div", { className: "flex gap-3 p-4", children: [
-    /* @__PURE__ */ jsx113(Avatar, { name: item.actor, src: item.avatarUrl, size: "sm" }),
+  return /* @__PURE__ */ jsx114("div", { className: ["divide-y divide-[var(--tapiz-border-subtle)] border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)]", className].filter(Boolean).join(" "), children: items.map((item, index) => /* @__PURE__ */ jsxs86("div", { className: "flex gap-3 p-4", children: [
+    /* @__PURE__ */ jsx114(Avatar, { name: item.actor, src: item.avatarUrl, size: "sm" }),
     /* @__PURE__ */ jsxs86("div", { className: "min-w-0 flex-1", children: [
       /* @__PURE__ */ jsxs86("p", { className: "text-sm text-[var(--tapiz-text-primary)]", children: [
-        /* @__PURE__ */ jsx113("strong", { children: item.actor }),
+        /* @__PURE__ */ jsx114("strong", { children: item.actor }),
         " ",
         item.action
       ] }),
-      item.meta ? /* @__PURE__ */ jsx113("div", { className: "mt-1 text-sm text-[var(--tapiz-text-muted)]", children: item.meta }) : null
+      item.meta ? /* @__PURE__ */ jsx114("div", { className: "mt-1 text-sm text-[var(--tapiz-text-muted)]", children: item.meta }) : null
     ] }),
-    item.time ? /* @__PURE__ */ jsx113("div", { className: "font-mono text-[10px] uppercase tracking-[0.14em] text-[var(--tapiz-text-muted)]", children: item.time }) : null
+    item.time ? /* @__PURE__ */ jsx114("div", { className: "font-mono text-[10px] uppercase tracking-[0.14em] text-[var(--tapiz-text-muted)]", children: item.time }) : null
   ] }, index)) });
 }
 
 // src/components/framework/InboxList.tsx
-import { jsx as jsx114, jsxs as jsxs87 } from "react/jsx-runtime";
+import { jsx as jsx115, jsxs as jsxs87 } from "react/jsx-runtime";
 function InboxList({ items, className = "" }) {
-  return /* @__PURE__ */ jsx114("div", { className: ["divide-y divide-[var(--tapiz-border-subtle)] border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)]", className].filter(Boolean).join(" "), children: items.map((item, index) => /* @__PURE__ */ jsxs87("article", { className: ["p-4 transition hover:bg-[var(--tapiz-bg-surface-muted)]", item.unread ? "border-l-4 border-l-[var(--tapiz-accent)]" : ""].join(" "), children: [
+  return /* @__PURE__ */ jsx115("div", { className: ["divide-y divide-[var(--tapiz-border-subtle)] border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)]", className].filter(Boolean).join(" "), children: items.map((item, index) => /* @__PURE__ */ jsxs87("article", { className: ["p-4 transition hover:bg-[var(--tapiz-bg-surface-muted)]", item.unread ? "border-l-4 border-l-[var(--tapiz-accent)]" : ""].join(" "), children: [
     /* @__PURE__ */ jsxs87("div", { className: "flex items-start justify-between gap-3", children: [
       /* @__PURE__ */ jsxs87("div", { className: "min-w-0", children: [
-        /* @__PURE__ */ jsx114("h3", { className: "truncate text-sm font-semibold text-[var(--tapiz-text-primary)]", children: item.title }),
-        item.sender ? /* @__PURE__ */ jsx114("p", { className: "mt-1 text-xs text-[var(--tapiz-text-muted)]", children: item.sender }) : null
+        /* @__PURE__ */ jsx115("h3", { className: "truncate text-sm font-semibold text-[var(--tapiz-text-primary)]", children: item.title }),
+        item.sender ? /* @__PURE__ */ jsx115("p", { className: "mt-1 text-xs text-[var(--tapiz-text-muted)]", children: item.sender }) : null
       ] }),
       /* @__PURE__ */ jsxs87("div", { className: "flex shrink-0 items-center gap-2", children: [
-        item.tag ? /* @__PURE__ */ jsx114(Badge, { children: item.tag }) : null,
-        item.time ? /* @__PURE__ */ jsx114("span", { className: "font-mono text-[10px] text-[var(--tapiz-text-muted)]", children: item.time }) : null
+        item.tag ? /* @__PURE__ */ jsx115(Badge, { children: item.tag }) : null,
+        item.time ? /* @__PURE__ */ jsx115("span", { className: "font-mono text-[10px] text-[var(--tapiz-text-muted)]", children: item.time }) : null
       ] })
     ] }),
-    item.snippet ? /* @__PURE__ */ jsx114("p", { className: "mt-2 line-clamp-2 text-sm text-[var(--tapiz-text-muted)]", children: item.snippet }) : null
+    item.snippet ? /* @__PURE__ */ jsx115("p", { className: "mt-2 line-clamp-2 text-sm text-[var(--tapiz-text-muted)]", children: item.snippet }) : null
   ] }, index)) });
 }
 
 // src/components/framework/ApprovalQueue.tsx
-import { jsx as jsx115, jsxs as jsxs88 } from "react/jsx-runtime";
+import { jsx as jsx116, jsxs as jsxs88 } from "react/jsx-runtime";
 function ApprovalQueue({ items, onApprove, onReject, className = "" }) {
-  return /* @__PURE__ */ jsx115("div", { className: ["space-y-3", className].filter(Boolean).join(" "), children: items.map((item, index) => /* @__PURE__ */ jsx115("article", { className: "border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] p-4", children: /* @__PURE__ */ jsxs88("div", { className: "flex flex-col gap-4 md:flex-row md:items-start md:justify-between", children: [
+  return /* @__PURE__ */ jsx116("div", { className: ["space-y-3", className].filter(Boolean).join(" "), children: items.map((item, index) => /* @__PURE__ */ jsx116("article", { className: "border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] p-4", children: /* @__PURE__ */ jsxs88("div", { className: "flex flex-col gap-4 md:flex-row md:items-start md:justify-between", children: [
     /* @__PURE__ */ jsxs88("div", { children: [
       /* @__PURE__ */ jsxs88("div", { className: "flex flex-wrap items-center gap-2", children: [
-        /* @__PURE__ */ jsx115("h3", { className: "font-semibold text-[var(--tapiz-text-primary)]", children: item.title }),
-        item.priority ? /* @__PURE__ */ jsx115(Badge, { variant: item.priority === "high" ? "danger" : item.priority === "medium" ? "warning" : "default", children: item.priority }) : null
+        /* @__PURE__ */ jsx116("h3", { className: "font-semibold text-[var(--tapiz-text-primary)]", children: item.title }),
+        item.priority ? /* @__PURE__ */ jsx116(Badge, { variant: item.priority === "high" ? "danger" : item.priority === "medium" ? "warning" : "default", children: item.priority }) : null
       ] }),
       item.requester ? /* @__PURE__ */ jsxs88("p", { className: "mt-1 text-xs text-[var(--tapiz-text-muted)]", children: [
         "Requested by ",
         item.requester
       ] }) : null,
-      item.description ? /* @__PURE__ */ jsx115("p", { className: "mt-2 text-sm text-[var(--tapiz-text-muted)]", children: item.description }) : null
+      item.description ? /* @__PURE__ */ jsx116("p", { className: "mt-2 text-sm text-[var(--tapiz-text-muted)]", children: item.description }) : null
     ] }),
     /* @__PURE__ */ jsxs88("div", { className: "flex gap-2", children: [
-      /* @__PURE__ */ jsx115(Button, { size: "sm", variant: "secondary", onClick: () => onReject?.(index), children: "Reject" }),
-      /* @__PURE__ */ jsx115(Button, { size: "sm", onClick: () => onApprove?.(index), children: "Approve" })
+      /* @__PURE__ */ jsx116(Button, { size: "sm", variant: "secondary", onClick: () => onReject?.(index), children: "Reject" }),
+      /* @__PURE__ */ jsx116(Button, { size: "sm", onClick: () => onApprove?.(index), children: "Approve" })
     ] })
   ] }) }, index)) });
 }
 
 // src/components/framework/SLAStatus.tsx
-import { jsx as jsx116, jsxs as jsxs89 } from "react/jsx-runtime";
+import { jsx as jsx117, jsxs as jsxs89 } from "react/jsx-runtime";
 function SLAStatus({ label, value, target = 95, className = "" }) {
   const ok = value >= target;
   return /* @__PURE__ */ jsxs89("div", { className: ["border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] p-4", className].filter(Boolean).join(" "), children: [
     /* @__PURE__ */ jsxs89("div", { className: "flex items-center justify-between gap-3", children: [
-      /* @__PURE__ */ jsx116("span", { className: "text-sm font-medium text-[var(--tapiz-text-primary)]", children: label }),
-      /* @__PURE__ */ jsx116("span", { className: ["font-mono text-xs", ok ? "text-[var(--tapiz-success)]" : "text-[var(--tapiz-warning)]"].join(" "), children: ok ? "Within SLA" : "At risk" })
+      /* @__PURE__ */ jsx117("span", { className: "text-sm font-medium text-[var(--tapiz-text-primary)]", children: label }),
+      /* @__PURE__ */ jsx117("span", { className: ["font-mono text-xs", ok ? "text-[var(--tapiz-success)]" : "text-[var(--tapiz-warning)]"].join(" "), children: ok ? "Within SLA" : "At risk" })
     ] }),
-    /* @__PURE__ */ jsx116("div", { className: "mt-3 h-2 border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)]", children: /* @__PURE__ */ jsx116("div", { className: "h-full bg-[var(--tapiz-accent)]", style: { width: `${Math.max(0, Math.min(100, value))}%` } }) }),
+    /* @__PURE__ */ jsx117("div", { className: "mt-3 h-2 border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)]", children: /* @__PURE__ */ jsx117("div", { className: "h-full bg-[var(--tapiz-accent)]", style: { width: `${Math.max(0, Math.min(100, value))}%` } }) }),
     /* @__PURE__ */ jsxs89("div", { className: "mt-2 flex justify-between font-mono text-[10px] uppercase tracking-[0.14em] text-[var(--tapiz-text-muted)]", children: [
       /* @__PURE__ */ jsxs89("span", { children: [
         value,
@@ -3440,81 +3508,81 @@ function SLAStatus({ label, value, target = 95, className = "" }) {
 }
 
 // src/components/framework/FeatureFlagTable.tsx
-import { jsx as jsx117, jsxs as jsxs90 } from "react/jsx-runtime";
+import { jsx as jsx118, jsxs as jsxs90 } from "react/jsx-runtime";
 function FeatureFlagTable({ flags, onToggle, className = "" }) {
-  return /* @__PURE__ */ jsx117("div", { className: ["overflow-hidden border border-[var(--tapiz-border-subtle)]", className].filter(Boolean).join(" "), children: flags.map((flag) => /* @__PURE__ */ jsxs90("div", { className: "grid gap-3 border-b border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] p-4 last:border-b-0 md:grid-cols-[1fr_auto_auto] md:items-center", children: [
+  return /* @__PURE__ */ jsx118("div", { className: ["overflow-hidden border border-[var(--tapiz-border-subtle)]", className].filter(Boolean).join(" "), children: flags.map((flag) => /* @__PURE__ */ jsxs90("div", { className: "grid gap-3 border-b border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] p-4 last:border-b-0 md:grid-cols-[1fr_auto_auto] md:items-center", children: [
     /* @__PURE__ */ jsxs90("div", { children: [
       /* @__PURE__ */ jsxs90("div", { className: "flex flex-wrap items-center gap-2", children: [
-        /* @__PURE__ */ jsx117("h3", { className: "text-sm font-semibold text-[var(--tapiz-text-primary)]", children: flag.name }),
-        /* @__PURE__ */ jsx117(Badge, { children: flag.key })
+        /* @__PURE__ */ jsx118("h3", { className: "text-sm font-semibold text-[var(--tapiz-text-primary)]", children: flag.name }),
+        /* @__PURE__ */ jsx118(Badge, { children: flag.key })
       ] }),
-      flag.description ? /* @__PURE__ */ jsx117("p", { className: "mt-1 text-sm text-[var(--tapiz-text-muted)]", children: flag.description }) : null
+      flag.description ? /* @__PURE__ */ jsx118("p", { className: "mt-1 text-sm text-[var(--tapiz-text-muted)]", children: flag.description }) : null
     ] }),
-    /* @__PURE__ */ jsx117("div", { className: "text-sm text-[var(--tapiz-text-muted)]", children: flag.rollout }),
-    /* @__PURE__ */ jsx117(Switch, { checked: flag.enabled, onChange: (checked) => onToggle?.(flag.key, checked) })
+    /* @__PURE__ */ jsx118("div", { className: "text-sm text-[var(--tapiz-text-muted)]", children: flag.rollout }),
+    /* @__PURE__ */ jsx118(Switch, { checked: flag.enabled, onChange: (checked) => onToggle?.(flag.key, checked) })
   ] }, flag.key)) });
 }
 
 // src/components/framework/PlanUsage.tsx
-import { jsx as jsx118, jsxs as jsxs91 } from "react/jsx-runtime";
+import { jsx as jsx119, jsxs as jsxs91 } from "react/jsx-runtime";
 function PlanUsage({ title = "Plan usage", items, className = "" }) {
   return /* @__PURE__ */ jsxs91("section", { className: ["border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] p-5", className].filter(Boolean).join(" "), children: [
-    /* @__PURE__ */ jsx118("h3", { className: "text-sm font-semibold text-[var(--tapiz-text-primary)]", children: title }),
-    /* @__PURE__ */ jsx118("div", { className: "mt-4 space-y-4", children: items.map((item, index) => {
+    /* @__PURE__ */ jsx119("h3", { className: "text-sm font-semibold text-[var(--tapiz-text-primary)]", children: title }),
+    /* @__PURE__ */ jsx119("div", { className: "mt-4 space-y-4", children: items.map((item, index) => {
       const pct = item.limit ? Math.min(100, item.used / item.limit * 100) : 0;
       return /* @__PURE__ */ jsxs91("div", { children: [
         /* @__PURE__ */ jsxs91("div", { className: "mb-1 flex justify-between text-sm", children: [
-          /* @__PURE__ */ jsx118("span", { className: "text-[var(--tapiz-text-primary)]", children: item.label }),
+          /* @__PURE__ */ jsx119("span", { className: "text-[var(--tapiz-text-primary)]", children: item.label }),
           /* @__PURE__ */ jsxs91("span", { className: "font-mono text-xs text-[var(--tapiz-text-muted)]", children: [
             item.used,
             "/",
             item.limit
           ] })
         ] }),
-        /* @__PURE__ */ jsx118("div", { className: "h-2 border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)]", children: /* @__PURE__ */ jsx118("div", { className: "h-full bg-[var(--tapiz-accent)]", style: { width: `${pct}%` } }) })
+        /* @__PURE__ */ jsx119("div", { className: "h-2 border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface-muted)]", children: /* @__PURE__ */ jsx119("div", { className: "h-full bg-[var(--tapiz-accent)]", style: { width: `${pct}%` } }) })
       ] }, index);
     }) })
   ] });
 }
 
 // src/components/marketing/AnnouncementBar.tsx
-import { jsx as jsx119, jsxs as jsxs92 } from "react/jsx-runtime";
+import { jsx as jsx120, jsxs as jsxs92 } from "react/jsx-runtime";
 function AnnouncementBar({ children, action, className = "" }) {
-  return /* @__PURE__ */ jsx119("div", { className: ["border-b border-[var(--tapiz-border-strong)] bg-[var(--tapiz-accent-soft)] px-4 py-3 text-sm text-[var(--tapiz-text-primary)]", className].filter(Boolean).join(" "), children: /* @__PURE__ */ jsxs92("div", { className: "mx-auto flex max-w-7xl flex-wrap items-center justify-center gap-3 text-center", children: [
+  return /* @__PURE__ */ jsx120("div", { className: ["border-b border-[var(--tapiz-border-strong)] bg-[var(--tapiz-accent-soft)] px-4 py-3 text-sm text-[var(--tapiz-text-primary)]", className].filter(Boolean).join(" "), children: /* @__PURE__ */ jsxs92("div", { className: "mx-auto flex max-w-7xl flex-wrap items-center justify-center gap-3 text-center", children: [
     " ",
-    /* @__PURE__ */ jsx119("span", { children }),
-    action ? /* @__PURE__ */ jsx119("span", { children: action }) : null
+    /* @__PURE__ */ jsx120("span", { children }),
+    action ? /* @__PURE__ */ jsx120("span", { children: action }) : null
   ] }) });
 }
 
 // src/components/marketing/FAQSection.tsx
-import { jsx as jsx120, jsxs as jsxs93 } from "react/jsx-runtime";
+import { jsx as jsx121, jsxs as jsxs93 } from "react/jsx-runtime";
 function FAQSection({ title = "Frequently asked questions", description, items, className = "" }) {
   return /* @__PURE__ */ jsxs93("section", { className, children: [
     /* @__PURE__ */ jsxs93("div", { className: "mb-6 max-w-2xl", children: [
-      /* @__PURE__ */ jsx120("div", { className: "kicker", children: "FAQ" }),
-      /* @__PURE__ */ jsx120("h2", { className: "mt-2 text-3xl font-semibold tracking-[-0.05em] text-[var(--tapiz-text-primary)]", children: title }),
-      description ? /* @__PURE__ */ jsx120("p", { className: "mt-2 text-sm leading-6 text-[var(--tapiz-text-muted)]", children: description }) : null
+      /* @__PURE__ */ jsx121("div", { className: "kicker", children: "FAQ" }),
+      /* @__PURE__ */ jsx121("h2", { className: "mt-2 text-3xl font-semibold tracking-[-0.05em] text-[var(--tapiz-text-primary)]", children: title }),
+      description ? /* @__PURE__ */ jsx121("p", { className: "mt-2 text-sm leading-6 text-[var(--tapiz-text-muted)]", children: description }) : null
     ] }),
-    /* @__PURE__ */ jsx120(Accordion, { items: items.map((item, index) => ({ id: `faq-${index}`, title: item.question, content: item.answer })) })
+    /* @__PURE__ */ jsx121(Accordion, { items: items.map((item, index) => ({ id: `faq-${index}`, title: item.question, content: item.answer })) })
   ] });
 }
 
 // src/components/marketing/RoadmapList.tsx
-import { jsx as jsx121, jsxs as jsxs94 } from "react/jsx-runtime";
+import { jsx as jsx122, jsxs as jsxs94 } from "react/jsx-runtime";
 function RoadmapList({ items, className = "" }) {
-  return /* @__PURE__ */ jsx121("div", { className: ["grid gap-3 md:grid-cols-3", className].filter(Boolean).join(" "), children: items.map((item, index) => /* @__PURE__ */ jsxs94("article", { className: "border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] p-5", children: [
+  return /* @__PURE__ */ jsx122("div", { className: ["grid gap-3 md:grid-cols-3", className].filter(Boolean).join(" "), children: items.map((item, index) => /* @__PURE__ */ jsxs94("article", { className: "border border-[var(--tapiz-border-subtle)] bg-[var(--tapiz-bg-surface)] p-5", children: [
     /* @__PURE__ */ jsxs94("div", { className: "flex items-center justify-between gap-3", children: [
-      /* @__PURE__ */ jsx121("span", { className: "kicker", children: item.quarter ?? `0${index + 1}` }),
-      item.status ? /* @__PURE__ */ jsx121(Badge, { children: item.status }) : null
+      /* @__PURE__ */ jsx122("span", { className: "kicker", children: item.quarter ?? `0${index + 1}` }),
+      item.status ? /* @__PURE__ */ jsx122(Badge, { children: item.status }) : null
     ] }),
-    /* @__PURE__ */ jsx121("h3", { className: "mt-4 font-semibold text-[var(--tapiz-text-primary)]", children: item.title }),
-    item.description ? /* @__PURE__ */ jsx121("p", { className: "mt-2 text-sm leading-6 text-[var(--tapiz-text-muted)]", children: item.description }) : null
+    /* @__PURE__ */ jsx122("h3", { className: "mt-4 font-semibold text-[var(--tapiz-text-primary)]", children: item.title }),
+    item.description ? /* @__PURE__ */ jsx122("p", { className: "mt-2 text-sm leading-6 text-[var(--tapiz-text-muted)]", children: item.description }) : null
   ] }, index)) });
 }
 
 // src/components/feedback/InlineStatus.tsx
-import { jsx as jsx122, jsxs as jsxs95 } from "react/jsx-runtime";
+import { jsx as jsx123, jsxs as jsxs95 } from "react/jsx-runtime";
 var toneClasses5 = {
   neutral: "bg-[var(--tapiz-text-muted)]",
   success: "bg-[var(--tapiz-success)]",
@@ -3524,7 +3592,7 @@ var toneClasses5 = {
 };
 function InlineStatus({ tone: tone2 = "neutral", children, pulse = false, className = "" }) {
   return /* @__PURE__ */ jsxs95("span", { className: ["inline-flex items-center gap-2 text-sm text-[var(--tapiz-text-muted)]", className].filter(Boolean).join(" "), children: [
-    /* @__PURE__ */ jsx122("span", { className: ["h-2 w-2 rounded-full", toneClasses5[tone2], pulse ? "animate-pulse" : ""].filter(Boolean).join(" ") }),
+    /* @__PURE__ */ jsx123("span", { className: ["h-2 w-2 rounded-full", toneClasses5[tone2], pulse ? "animate-pulse" : ""].filter(Boolean).join(" ") }),
     children
   ] });
 }
@@ -3619,6 +3687,7 @@ export {
   FormulaIcon,
   FunnelChart,
   Gear,
+  GitHubIcon,
   Globe,
   GooglePlayIcon,
   GraduationCap,
@@ -3731,6 +3800,7 @@ export {
   TextIcon,
   Textarea,
   TextareaCounter,
+  ThemeIconButton,
   Timeline,
   Toast,
   ToastProvider,