@mt-gloss/ui 0.1.121 → 0.1.123

package/composites-panels.js

@@ -1,28 +1,28 @@
-import { u as O, h as fe, j as V, g as we, S as Ee, b as Pe, k as xe } from "./COMMITS-8eHelQHO.js";
-import { C as Ut, N as zt, o as Ht, d as Vt, p as Bt, l as Kt, c as Yt, n as Wt, P as Gt, m as Qt, f as qt, i as jt, r as Zt, e as Xt } from "./COMMITS-8eHelQHO.js";
-import { jsx as n, jsxs as f, Fragment as B } from "react/jsx-runtime";
-import U, { useState as x, useRef as K, createContext as ge, useContext as be, useMemo as ie, useEffect as R, useCallback as L, useLayoutEffect as Ae } from "react";
-import { useSensors as ke, useSensor as ce, PointerSensor as De, KeyboardSensor as Le, DndContext as Oe, closestCenter as Me } from "@dnd-kit/core";
-import { sortableKeyboardCoordinates as Ie, SortableContext as $e, horizontalListSortingStrategy as Re, arrayMove as Fe, useSortable as Ue } from "@dnd-kit/sortable";
-import { CSS as ze } from "@dnd-kit/utilities";
-import { M as de } from "./MetricCard-Cyoxhb_S.js";
+import { u as O, h as he, j as Y, g as we, S as Pe, b as Te, k as Ae } from "./COMMITS-C1VHNgld.js";
+import { C as zt, N as Ht, o as Ut, d as Bt, p as Yt, l as Vt, c as Kt, n as qt, P as Qt, m as Wt, f as Gt, i as jt, r as Zt, e as Xt } from "./COMMITS-C1VHNgld.js";
+import { jsx as n, jsxs as f, Fragment as V } from "react/jsx-runtime";
+import H, { useState as A, useRef as K, createContext as fe, useContext as ge, useMemo as le, useEffect as F, useCallback as D, useLayoutEffect as xe } from "react";
+import { useSensors as ke, useSensor as ie, PointerSensor as De, KeyboardSensor as Le, DndContext as Oe, closestCenter as Me } from "@dnd-kit/core";
+import { sortableKeyboardCoordinates as Ie, SortableContext as Re, horizontalListSortingStrategy as $e, arrayMove as Fe, useSortable as ze } from "@dnd-kit/sortable";
+import { CSS as He } from "@dnd-kit/utilities";
+import { M as ce } from "./MetricCard-Cyoxhb_S.js";
 function wt() {
   const e = O();
   if (e?.state.activePanelId !== "settings") return null;
   const t = e.state.activeTrigger;
   return t?.kind === "card-overflow" ? t.cardId : null;
 }
-function He({ span: e, rotating: t = !0, children: r }) {
+function Ue({ span: e, rotating: t = !0, children: r }) {
   const l = ["clone-card", `span-${e}`, t ? "rotating" : ""].filter(Boolean).join(" "), a = r != null ? "full" : "fallback";
   return /* @__PURE__ */ n("div", { className: l, "data-clone-fidelity": a, children: r });
 }
-function Et({ primary: e, secondary: t }) {
+function Pt({ primary: e, secondary: t }) {
   return /* @__PURE__ */ f("div", { className: "gloss-panel-chrome-v2__footer-msg", children: [
     /* @__PURE__ */ n("span", { className: "gloss-panel-chrome-v2__footer-msg-primary", children: e }),
     t != null && /* @__PURE__ */ n("span", { className: "gloss-panel-chrome-v2__footer-msg-secondary", children: t })
   ] });
 }
-function Ve({
+function Be({
   value: e,
   onChange: t,
   enabled: r = !1,
@@ -46,7 +46,7 @@ function Ve({
         }
       )
     ] }),
-    r ? /* @__PURE__ */ f(B, { children: [
+    r ? /* @__PURE__ */ f(V, { children: [
       /* @__PURE__ */ n("span", { className: "settings-shell__label", "aria-hidden": "true", children: "Alert level (%)" }),
       /* @__PURE__ */ f("div", { className: "settings-shell__slider-row", children: [
         /* @__PURE__ */ n(
@@ -73,7 +73,7 @@ function Ve({
     ] }) : /* @__PURE__ */ n("p", { className: "settings-shell__help", "aria-live": "polite", children: "Off — the card uses its default styling. Turn on to tint values below the threshold." })
   ] });
 }
-function Be({ value: e, onChange: t }) {
+function Ye({ value: e, onChange: t }) {
   return /* @__PURE__ */ f("div", { className: "settings-shell__field settings-shell__field--timeframe", children: [
     /* @__PURE__ */ n("span", { className: "settings-shell__label", "aria-hidden": "true", children: "Rolling period (days)" }),
     /* @__PURE__ */ f("div", { className: "settings-shell__slider-row", children: [
@@ -100,9 +100,9 @@ function Be({ value: e, onChange: t }) {
     ] })
   ] });
 }
-function Ke({ id: e, onRemove: t }) {
-  const { attributes: r, listeners: l, setNodeRef: a, transform: i, transition: u, isDragging: o } = Ue({ id: e }), s = {
-    transform: ze.Transform.toString(i),
+function Ve({ id: e, onRemove: t }) {
+  const { attributes: r, listeners: l, setNodeRef: a, transform: i, transition: u, isDragging: o } = ze({ id: e }), s = {
+    transform: He.Transform.toString(i),
     transition: u,
     opacity: o ? 0.6 : 1
   };
@@ -139,11 +139,11 @@ function Ke({ id: e, onRemove: t }) {
     }
   );
 }
-function Ye({ value: e, onChange: t }) {
+function Ke({ value: e, onChange: t }) {
   const r = ke(
-    ce(De, { activationConstraint: { distance: 4 } }),
-    ce(Le, { coordinateGetter: Ie })
-  ), l = U.useRef(!1), [a, i] = U.useState(!1), u = (s) => {
+    ie(De, { activationConstraint: { distance: 4 } }),
+    ie(Le, { coordinateGetter: Ie })
+  ), l = H.useRef(!1), [a, i] = H.useState(!1), u = (s) => {
     const { active: c, over: d } = s;
     if (!d || c.id === d.id) return;
     const m = e.findIndex((b) => b === c.id), h = e.findIndex((b) => b === d.id);
@@ -152,13 +152,13 @@ function Ye({ value: e, onChange: t }) {
     l.current || (l.current = !0, i(!0)), t(e.filter((c) => c !== s));
   };
   return /* @__PURE__ */ f("div", { className: "settings-shell__field settings-shell__field--slots", "aria-label": "Stack slots", children: [
-    /* @__PURE__ */ n(Oe, { sensors: r, collisionDetection: Me, onDragEnd: u, children: /* @__PURE__ */ n($e, { items: [...e], strategy: Re, children: /* @__PURE__ */ n("ul", { className: "settings-shell__slots-list", role: "list", children: e.map((s) => /* @__PURE__ */ n(Ke, { id: s, onRemove: () => o(s) }, s)) }) }) }),
+    /* @__PURE__ */ n(Oe, { sensors: r, collisionDetection: Me, onDragEnd: u, children: /* @__PURE__ */ n(Re, { items: [...e], strategy: $e, children: /* @__PURE__ */ n("ul", { className: "settings-shell__slots-list", role: "list", children: e.map((s) => /* @__PURE__ */ n(Ve, { id: s, onRemove: () => o(s) }, s)) }) }) }),
     e.length === 0 && a && /* @__PURE__ */ n("p", { className: "settings-shell__help", children: "All slots removed. Apply to commit, or Reset to restore." }),
     /* @__PURE__ */ n("p", { className: "settings-shell__help settings-shell__help--small", children: "Drag to reorder · click × to remove" })
   ] });
 }
-const We = ["#1d6fd8", "#10b981", "#f59e0b", "#ef4444", "#8b5cf6"];
-function Ge({
+const qe = ["#1d6fd8", "#10b981", "#f59e0b", "#ef4444", "#8b5cf6"];
+function Qe({
   value: e,
   onSelect: t,
   enabled: r = !1,
@@ -182,9 +182,9 @@ function Ge({
         }
       )
     ] }),
-    r ? /* @__PURE__ */ f(B, { children: [
+    r ? /* @__PURE__ */ f(V, { children: [
       /* @__PURE__ */ n("span", { className: "settings-shell__label", children: "Accent color" }),
-      /* @__PURE__ */ n("div", { className: "settings-shell__swatch-row", children: We.map((i) => {
+      /* @__PURE__ */ n("div", { className: "settings-shell__swatch-row", children: qe.map((i) => {
         const u = e === i;
         return /* @__PURE__ */ n(
           "button",
@@ -202,40 +202,40 @@ function Ge({
     ] }) : /* @__PURE__ */ n("p", { className: "settings-shell__help", "aria-live": "polite", children: "Off — the card uses its default accent. Turn on to override." })
   ] });
 }
-const Qe = ["Orders", "Quota", "Unassigned"], qe = ["threshold", "timeframe", "color"];
-function Pt({
+const We = ["Orders", "Quota", "Unassigned"], Ge = ["threshold", "timeframe", "color"];
+function Tt({
   isOpen: e,
   cardSpan: t,
   cardLabel: r = "Metric",
   cardValue: l = "—",
   previewSlot: a,
-  dimensions: i = qe,
+  dimensions: i = Ge,
   initialTab: u,
   initialValues: o
 }) {
-  const s = O(), c = s?.state.activeTrigger, d = c?.kind === "card-overflow" ? c.cardId : null, m = fe(), h = c?.span, b = t ?? h ?? 1, p = i[0] ?? "threshold", [y, E] = U.useState(u ?? p);
-  U.useEffect(() => {
-    i.includes(y) || E(p);
-  }, [i, y, p]);
-  const v = d != null ? s?.state?.bufferByCard?.[d]?.changes ?? {} : {}, N = typeof v.threshold == "number" ? v.threshold : typeof o?.threshold == "number" ? o.threshold : 80, I = typeof v.timeframe == "number" ? v.timeframe : typeof o?.timeframe == "number" ? o.timeframe : 30, $ = typeof v.accent == "string" ? v.accent : typeof o?.accent == "string" ? o.accent : null, w = Array.isArray(v.slots) ? v.slots : Array.isArray(o?.slots) ? o.slots : Qe, A = typeof v.thresholdEnabled == "boolean" ? v.thresholdEnabled : typeof o?.thresholdEnabled == "boolean" ? o.thresholdEnabled : !1, Y = typeof v.accentEnabled == "boolean" ? v.accentEnabled : typeof o?.accentEnabled == "boolean" ? o.accentEnabled : !1, W = (P) => {
-    d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "threshold", value: Number(P.target.value) });
-  }, G = (P) => {
-    d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "timeframe", value: Number(P.target.value) });
-  }, le = (P) => {
-    d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "accent", value: P });
-  }, Q = (P) => {
-    d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "slots", value: P });
-  }, q = (P) => {
-    d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "thresholdEnabled", value: P });
-  }, g = (P) => {
-    d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "accentEnabled", value: P });
-  }, C = s?.state.isDirty ?? !1, S = d;
+  const s = O(), c = s?.state.activeTrigger, d = c?.kind === "card-overflow" ? c.cardId : null, m = he(), h = c?.span, b = t ?? h ?? 1, p = i[0] ?? "threshold", [_, P] = H.useState(u ?? p);
+  H.useEffect(() => {
+    i.includes(_) || P(p);
+  }, [i, _, p]);
+  const y = d != null ? s?.state?.bufferByCard?.[d]?.changes ?? {} : {}, N = typeof y.threshold == "number" ? y.threshold : typeof o?.threshold == "number" ? o.threshold : 80, I = typeof y.timeframe == "number" ? y.timeframe : typeof o?.timeframe == "number" ? o.timeframe : 30, R = typeof y.accent == "string" ? y.accent : typeof o?.accent == "string" ? o.accent : null, $ = Array.isArray(y.slots) ? y.slots : Array.isArray(o?.slots) ? o.slots : We, S = typeof y.thresholdEnabled == "boolean" ? y.thresholdEnabled : typeof o?.thresholdEnabled == "boolean" ? o.thresholdEnabled : !1, L = typeof y.accentEnabled == "boolean" ? y.accentEnabled : typeof o?.accentEnabled == "boolean" ? o.accentEnabled : !1, q = (T) => {
+    d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "threshold", value: Number(T.target.value) });
+  }, Q = (T) => {
+    d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "timeframe", value: Number(T.target.value) });
+  }, oe = (T) => {
+    d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "accent", value: T });
+  }, W = (T) => {
+    d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "slots", value: T });
+  }, G = (T) => {
+    d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "thresholdEnabled", value: T });
+  }, g = (T) => {
+    d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "accentEnabled", value: T });
+  }, C = s?.state.isDirty ?? !1, w = d;
   return /* @__PURE__ */ n(
-    V,
+    Y,
     {
       variant: "with-stage",
       onClose: () => s?.dispatch({ type: "CLOSE_PANEL", reason: "header-x" }),
-      stage: /* @__PURE__ */ n(He, { span: b, rotating: !m, children: a ?? /* @__PURE__ */ f(B, { children: [
+      stage: /* @__PURE__ */ n(Ue, { span: b, rotating: !m, children: a ?? /* @__PURE__ */ f(V, { children: [
         /* @__PURE__ */ n("div", { style: { fontSize: 9, textTransform: "uppercase", letterSpacing: "0.06em", color: "#9ca3af", marginBottom: 6 }, children: r }),
         /* @__PURE__ */ n("div", { style: { fontSize: 22, fontWeight: 700, color: "#111827", lineHeight: 1 }, children: l })
       ] }) }),
@@ -243,8 +243,8 @@ function Pt({
         we,
         {
           dimensions: i,
-          activeTab: y,
-          onSelect: E,
+          activeTab: _,
+          onSelect: P,
           reduced: m
         }
       ),
@@ -257,7 +257,7 @@ function Pt({
             className: "gloss-panel-chrome-v2__footer-btn",
             disabled: !C,
             onClick: () => {
-              S != null && s?.dispatch({ type: "CLEAR_BUFFER", cardId: S });
+              w != null && s?.dispatch({ type: "CLEAR_BUFFER", cardId: w });
             },
             children: "Reset"
           }
@@ -278,28 +278,28 @@ function Pt({
         "div",
         {
           role: "tabpanel",
-          id: `settings-tabpanel-${y}`,
+          id: `settings-tabpanel-${_}`,
           "aria-label": "Settings dimension controls",
           tabIndex: 0,
           className: "settings-shell__tabpanel",
           children: [
-            y === "threshold" && /* @__PURE__ */ n(
-              Ve,
+            _ === "threshold" && /* @__PURE__ */ n(
+              Be,
               {
                 value: N,
-                onChange: W,
-                enabled: A,
-                onToggleEnabled: q
+                onChange: q,
+                enabled: S,
+                onToggleEnabled: G
               }
             ),
-            y === "timeframe" && /* @__PURE__ */ n(Be, { value: I, onChange: G }),
-            y === "slots" && /* @__PURE__ */ n(Ye, { value: w, onChange: Q }),
-            y === "color" && /* @__PURE__ */ n(
-              Ge,
+            _ === "timeframe" && /* @__PURE__ */ n(Ye, { value: I, onChange: Q }),
+            _ === "slots" && /* @__PURE__ */ n(Ke, { value: $, onChange: W }),
+            _ === "color" && /* @__PURE__ */ n(
+              Qe,
               {
-                value: $,
-                onSelect: le,
-                enabled: Y,
+                value: R,
+                onSelect: oe,
+                enabled: L,
                 onToggleEnabled: g
               }
             )
@@ -309,190 +309,41 @@ function Pt({
     }
   );
 }
-const ve = [
-  "Overbought",
-  "What's selling",
-  "On track vs plan",
-  "Orders on time",
-  "Vendor performance",
-  "Assortment mix",
-  "Customer retention"
-], ye = "Overbought", ae = {
-  Overbought: {
-    headline: "Am I overbought?",
-    helper: "Find slow-moving inventory before discount cycles eat margin."
+const be = [
+  "Revenue",
+  "Order flow",
+  "Rep performance",
+  "Brand portfolio",
+  "Account coverage",
+  "Commission"
+], ye = "Revenue", ve = {
+  Revenue: {
+    headline: "Are we hitting our number?",
+    helper: "Top-line sales, growth, average order value, and pace-to-plan signals."
   },
-  "What's selling": {
-    headline: "What's selling right now?",
-    helper: "Velocity leaders and sleepers across your assortment."
+  "Order flow": {
+    headline: "Are orders flowing through?",
+    helper: "Daily activity, pipeline, unassigned work, and cancel-rate health."
   },
-  "On track vs plan": {
-    headline: "Am I on track vs plan?",
-    helper: "Pace-to-plan signals across revenue, units, and margin."
+  "Rep performance": {
+    headline: "How are my reps performing?",
+    helper: "Quota attainment, leaderboards, and activity flags across the rep team."
   },
-  "Orders on time": {
-    headline: "Are orders going out on time?",
-    helper: "Fulfillment SLA performance and at-risk shipments."
+  "Brand portfolio": {
+    headline: "Which brands matter?",
+    helper: "Manufacturer mix, top performers, and emerging line health."
   },
-  "Vendor performance": {
-    headline: "Who are my best and worst vendors?",
-    helper: "Sell-through, lead time, and fill-rate across the vendor mix."
+  "Account coverage": {
+    headline: "Where are the gaps?",
+    helper: "New, active, inactive, and at-risk customer accounts."
   },
-  "Assortment mix": {
-    headline: "Is my assortment balanced?",
-    helper: "Brand and category mix concentration vs target ranges."
-  },
-  "Customer retention": {
-    headline: "Are my best customers coming back?",
-    helper: "Repeat-rate and lapsed-account signals from the buyer file."
+  Commission: {
+    headline: "What's our commission rate?",
+    helper: "Outstanding balances, aging buckets, and effective commission yield."
   }
-};
-ae["Customer retention"].beta = !0;
-const _e = {
-  Overbought: {
+}, _e = {
+  Revenue: {
     primary: [
-      {
-        id: "ob-units-at-risk",
-        label: "Units at risk",
-        value: "12,840",
-        desc: "Inventory units flagged as overbought relative to forward demand.",
-        variants: ["1×1"],
-        startHere: !0,
-        isNew: !0,
-        cardType: "standard"
-      },
-      {
-        id: "ob-weeks-of-supply",
-        label: "Weeks of supply",
-        value: "18.4",
-        desc: "Weighted average weeks of forward cover across the assortment.",
-        variants: ["1×1"],
-        cardType: "standard"
-      },
-      {
-        id: "ob-discount-exposure",
-        label: "Discount exposure",
-        value: "$184K",
-        desc: "Estimated markdown dollars to clear excess at current sell-through.",
-        variants: ["1×3"],
-        subStats: [
-          { label: "MTD", value: "$48K" },
-          { label: "QTD", value: "$112K" },
-          { label: "YTD", value: "$184K" }
-        ],
-        cardType: "stacked-group",
-        stackedTimeframes: ["MTD", "QTD", "YTD"]
-      }
-    ],
-    secondary: [
-      {
-        id: "ob-sku-coverage",
-        label: "SKUs over plan",
-        value: "342",
-        desc: "SKUs exceeding planned forward cover.",
-        cardType: "standard"
-      },
-      {
-        id: "ob-vendor-share",
-        label: "Top vendor share",
-        value: "38%",
-        desc: "Share of overbought inventory concentrated in the top vendor.",
-        donut: !0,
-        accent: "#7c3aed",
-        cardType: "donut",
-        donutValue: 0.38,
-        accentColor: "#7c3aed"
-      }
-    ]
-  },
-  "What's selling": {
-    primary: [
-      {
-        id: "ws-top-sku",
-        label: "Top SKU",
-        value: "SKU-9241",
-        desc: "Highest-velocity SKU over the trailing 7 days.",
-        startHere: !0,
-        cardType: "name"
-      },
-      {
-        id: "ws-velocity",
-        label: "Velocity Δ",
-        value: "+12.4%",
-        desc: "Rolling 7-day velocity change versus the prior comparable period.",
-        variants: ["1×1"],
-        cardType: "sparkline",
-        sparklineData: [10, 12, 15, 14, 18, 21, 19, 23, 25, 28]
-      },
-      {
-        id: "ws-sellthrough",
-        label: "Sell-through",
-        value: "see breakdown",
-        variants: ["1×5"],
-        subStats: [
-          { label: "MTD", value: "64%" },
-          { label: "QTD", value: "71%" },
-          { label: "YTD", value: "68%" },
-          { label: "LYTD", value: "62%" },
-          { label: "7D", value: "74%" }
-        ],
-        desc: "Sell-through across multiple windows.",
-        cardType: "stacked-group",
-        stackedTimeframes: ["MTD", "QTD", "YTD", "LYTD", "7D"]
-      }
-    ],
-    secondary: [
-      {
-        id: "ws-new-arrivals",
-        label: "New arrival lift",
-        value: "+8.1%",
-        desc: "Velocity boost from new-arrival SKUs versus the assortment mean.",
-        isNew: !0,
-        cardType: "sparkline",
-        sparklineData: [3, 4, 5, 6, 6, 7, 8, 8]
-      }
-    ]
-  },
-  "On track vs plan": {
-    primary: [
-      {
-        id: "pl-revenue-pace",
-        label: "Revenue pace",
-        value: "102%",
-        desc: "Revenue pace versus plan, period-to-date.",
-        donut: !0,
-        accent: "#16a34a",
-        startHere: !0,
-        cardType: "donut",
-        donutValue: 1.02,
-        accentColor: "#16a34a"
-      },
-      {
-        id: "pl-units-pace",
-        label: "Units pace",
-        value: "94%",
-        desc: "Units pace versus plan, period-to-date.",
-        donut: !0,
-        accent: "#f59e0b",
-        cardType: "donut",
-        donutValue: 0.94,
-        accentColor: "#f59e0b"
-      },
-      {
-        id: "pl-margin-pace",
-        label: "Margin pace",
-        value: "see breakdown",
-        variants: ["1×3"],
-        subStats: [
-          { label: "MTD", value: "38.4%" },
-          { label: "QTD", value: "37.9%" },
-          { label: "YTD", value: "38.1%" }
-        ],
-        desc: "Gross margin pace across multiple windows.",
-        cardType: "stacked-group",
-        stackedTimeframes: ["MTD", "QTD", "YTD"]
-      },
-      // PHASE 17 D1 — agency-revenue port (J1) + commission-economics port (J6)
       {
         id: "agency-sales",
         label: "Sales",
@@ -500,15 +351,22 @@ const _e = {
         desc: "Agency total sales with trend sparkline",
         cardType: "sparkline",
         sparklineData: [620, 640, 680, 700, 740, 760, 790, 820, 850, 892],
-        prefix: "$"
+        prefix: "$",
+        startHere: !0
       },
       {
-        id: "agency-commission",
-        label: "Commissions",
-        value: "$133,868",
-        desc: "Total commission earned by the agency",
-        cardType: "standard",
-        prefix: "$"
+        id: "agency-sales-stacked",
+        label: "Sales",
+        value: "$892,450",
+        desc: "Agency sales across three timeframes at a glance (MTD shown)",
+        variants: ["1×3"],
+        subStats: [
+          { label: "MTD", value: "$892K" },
+          { label: "QTD", value: "$2.4M" },
+          { label: "YTD", value: "$8.6M" }
+        ],
+        cardType: "stacked-group",
+        stackedTimeframes: ["MTD", "QTD", "YTD"]
       },
       {
         id: "agency-growth",
@@ -528,6 +386,20 @@ const _e = {
         sparklineData: [2100, 2150, 2200, 2180, 2250, 2280, 2300, 2320, 2335, 2340],
         prefix: "$"
       },
+      {
+        id: "agency-aov-stacked",
+        label: "Avg Order",
+        value: "$2,340",
+        desc: "Average order value across three timeframes",
+        variants: ["1×3"],
+        subStats: [
+          { label: "MTD", value: "$2,340" },
+          { label: "QTD", value: "$2,280" },
+          { label: "YTD", value: "$2,210" }
+        ],
+        cardType: "stacked-group",
+        stackedTimeframes: ["MTD", "QTD", "YTD"]
+      },
       {
         id: "agency-conversion",
         label: "Conversion",
@@ -537,7 +409,9 @@ const _e = {
         donutValue: 0.68,
         accentColor: "#10b981",
         suffix: "%"
-      },
+      }
+    ],
+    secondary: [
       {
         id: "agency-revenue-compact",
         label: "Total Revenue",
@@ -547,23 +421,6 @@ const _e = {
         sparklineData: [620, 660, 700, 740, 780, 820, 860, 892],
         prefix: "$"
       },
-      // degrade-to-standard: stacked-group with MTD segment shown at span-1
-      {
-        id: "agency-sales-stacked",
-        label: "Sales",
-        value: "$892,450",
-        desc: "Agency sales across three timeframes at a glance (MTD shown)",
-        cardType: "stacked-group",
-        stackedTimeframes: ["MTD", "QTD", "YTD"]
-      },
-      {
-        id: "agency-aov-stacked",
-        label: "Avg Order",
-        value: "$2,340",
-        desc: "Average order value across three timeframes (MTD shown)",
-        cardType: "stacked-group",
-        stackedTimeframes: ["MTD", "QTD", "YTD"]
-      },
       {
         id: "agency-yoy-versus",
         label: "YoY Comparison",
@@ -587,70 +444,19 @@ const _e = {
           { label: "C", value: 22, color: "#10b981" },
           { label: "D", value: 15, color: "#f59e0b" }
         ]
-      },
-      {
-        id: "agency-outstanding",
-        label: "Outstanding",
-        value: "$24,500",
-        desc: "Unpaid order balance across all accounts",
-        cardType: "standard",
-        prefix: "$"
-      },
-      {
-        id: "agency-commission-rate",
-        label: "Commission",
-        value: "8.4%",
-        desc: "Effective commission rate %",
-        cardType: "standard",
-        suffix: "%"
-      },
-      {
-        id: "agency-commission-aging",
-        label: "Commission Aging",
-        value: "$24K",
-        desc: "Unpaid commission aging by buckets",
-        cardType: "bars",
-        barData: [4, 8, 7, 5]
       }
     ]
   },
-  "Orders on time": {
+  "Order flow": {
     primary: [
-      {
-        id: "ot-on-time-rate",
-        label: "On-time rate",
-        value: "94.2%",
-        desc: "Share of orders shipped within SLA.",
-        startHere: !0,
-        cardType: "donut",
-        donutValue: 0.942,
-        accentColor: "#16a34a",
-        suffix: "%"
-      },
-      {
-        id: "ot-at-risk",
-        label: "At-risk shipments",
-        value: "18",
-        desc: "Open shipments projected to miss SLA.",
-        isNew: !0,
-        cardType: "highlight",
-        highlightColor: "#f59e0b"
-      },
-      // PHASE 17 D1 — agency-order-flow port (J5)
       {
         id: "agency-activity",
         label: "Orders",
         value: "47 Orders",
         desc: "Daily team order count with bar chart",
         cardType: "bars",
-        barData: [12, 18, 15, 22, 19, 25, 28]
-      },
-      {
-        id: "agency-unassigned-orders",
-        label: "Unassigned",
-        value: "0",
-        desc: "Orders awaiting salesperson assignment",
-        cardType: "standard"
+        barData: [12, 18, 15, 22, 19, 25, 28],
+        startHere: !0
       },
       {
         id: "agency-orders-compact",
@@ -660,12 +466,17 @@ const _e = {
         cardType: "bars",
         barData: [18, 22, 19, 24, 26, 23, 28]
       },
-      // degrade-to-standard: stacked-group with MTD segment shown at span-1
       {
         id: "agency-orders-stacked",
         label: "Orders",
         value: "156",
-        desc: "Order count across three timeframes at a glance (MTD shown)",
+        desc: "Order count across three timeframes",
+        variants: ["1×3"],
+        subStats: [
+          { label: "MTD", value: "156" },
+          { label: "QTD", value: "482" },
+          { label: "YTD", value: "1,847" }
+        ],
         cardType: "stacked-group",
         stackedTimeframes: ["MTD", "QTD", "YTD"]
       },
@@ -677,6 +488,13 @@ const _e = {
         cardType: "standard",
         prefix: "$"
       },
+      {
+        id: "agency-unassigned-orders",
+        label: "Unassigned",
+        value: "0",
+        desc: "Orders awaiting salesperson assignment",
+        cardType: "standard"
+      },
       {
         id: "agency-cancel-rate",
         label: "Cancel Rate",
@@ -688,29 +506,37 @@ const _e = {
       }
     ]
   },
-  "Vendor performance": {
+  "Rep performance": {
     primary: [
       {
-        id: "vp-top-vendor",
-        label: "Top vendor",
-        value: "Acme Co.",
-        desc: "Highest sell-through vendor over the trailing 30 days.",
-        startHere: !0,
-        cardType: "name"
+        id: "agency-top-rep",
+        label: "#1 Rep",
+        value: "Sarah Mitchell",
+        desc: "Top-performing rep on the team this period",
+        cardType: "name",
+        startHere: !0
       },
       {
-        id: "vp-fill-rate",
-        label: "Fill rate",
-        value: "97.1%",
-        desc: "Vendor fill rate against placed orders.",
-        donut: !0,
-        accent: "#2563eb",
-        cardType: "donut",
-        donutValue: 0.971,
-        accentColor: "#2563eb",
-        suffix: "%"
+        id: "agency-quota",
+        label: "Below Quota",
+        value: "3 of 12",
+        desc: "Reps currently tracking under their quota",
+        cardType: "ratio",
+        numerator: 3,
+        denominator: 12
       },
-      // PHASE 17 D1 — agency-brand-portfolio port (J3)
+      {
+        id: "agency-rep-leaderboard-sales",
+        label: "Rep Sales",
+        value: "Top 5",
+        desc: "Sales leaderboard across the rep team",
+        cardType: "leaderboard",
+        catalogValue: "Top 5"
+      }
+    ]
+  },
+  "Brand portfolio": {
+    primary: [
       {
         id: "agency-mfr-mix",
         label: "Mfr Mix",
@@ -722,7 +548,8 @@ const _e = {
           { label: "B", value: 28, color: "#1d6fd8" },
           { label: "C", value: 22, color: "#10b981" },
           { label: "D", value: 15, color: "#f59e0b" }
-        ]
+        ],
+        startHere: !0
       },
       {
         id: "agency-mfr-new-line",
@@ -733,58 +560,15 @@ const _e = {
       }
     ]
   },
-  "Assortment mix": {
+  "Account coverage": {
     primary: [
-      {
-        id: "am-brand-mix",
-        label: "Brand mix",
-        value: "see breakdown",
-        variants: ["1×3"],
-        subStats: [
-          { label: "Core", value: "58%" },
-          { label: "Growth", value: "27%" },
-          { label: "Test", value: "15%" }
-        ],
-        desc: "Assortment mix across brand tiers.",
-        startHere: !0,
-        cardType: "segmented",
-        segments: [
-          { label: "Core", value: 58, color: "#7c3aed" },
-          { label: "Growth", value: 27, color: "#10b981" },
-          { label: "Test", value: 15, color: "#f59e0b" }
-        ]
-      }
-    ]
-  },
-  "Customer retention": {
-    primary: [
-      {
-        id: "cr-repeat-rate",
-        label: "Repeat rate",
-        value: "62.4%",
-        desc: "Share of buyers placing two or more orders in the period.",
-        startHere: !0,
-        isNew: !0,
-        cardType: "donut",
-        donutValue: 0.624,
-        accentColor: "#1d6fd8",
-        suffix: "%"
-      },
-      {
-        id: "cr-lapsed",
-        label: "Lapsed accounts",
-        value: "47",
-        desc: "Accounts with zero orders in the last 90 days.",
-        cardType: "highlight",
-        highlightColor: "#f59e0b"
-      },
-      // PHASE 17 D1 — agency-account-coverage port (J4)
       {
         id: "agency-new-accounts",
         label: "New Accounts",
         value: "12",
         desc: "New customer accounts opened this period",
-        cardType: "standard"
+        cardType: "standard",
+        startHere: !0
       },
       {
         id: "agency-customers-compact",
@@ -811,6 +595,35 @@ const _e = {
         suffix: "%"
       }
     ]
+  },
+  Commission: {
+    primary: [
+      {
+        id: "agency-outstanding",
+        label: "Outstanding",
+        value: "$24,500",
+        desc: "Unpaid order balance across all accounts",
+        cardType: "standard",
+        prefix: "$",
+        startHere: !0
+      },
+      {
+        id: "agency-commission-rate",
+        label: "Commission",
+        value: "8.4%",
+        desc: "Effective commission rate %",
+        cardType: "standard",
+        suffix: "%"
+      },
+      {
+        id: "agency-commission-aging",
+        label: "Commission Aging",
+        value: "$24K",
+        desc: "Unpaid commission aging by buckets",
+        cardType: "bars",
+        barData: [4, 8, 7, 5]
+      }
+    ]
   }
 };
 function Ce({
@@ -818,7 +631,7 @@ function Ce({
   activeLens: t,
   onLensChange: r,
   variant: l = "pills",
-  lensMeta: a = ae
+  lensMeta: a = ve
 }) {
   return l === "pills" ? /* @__PURE__ */ n("div", { className: "cat-pills-wrap", children: /* @__PURE__ */ n("div", { className: "cat-pills", role: "tablist", "aria-label": "Metric lenses", children: e.map((i) => {
     const u = i === t, o = a[i], s = ["cat-pill"];
@@ -847,7 +660,7 @@ function je({
   activeLens: t,
   onLensChange: r
 }) {
-  const [l, a] = x(!1), i = K(null), u = () => {
+  const [l, a] = A(!1), i = K(null), u = () => {
     i.current != null && (window.clearTimeout(i.current), i.current = null);
   }, o = () => {
     u(), i.current = window.setTimeout(() => a(!1), 100);
@@ -939,7 +752,7 @@ function te({ tiles: e, selectedTileId: t, onSelectTile: r, renderTile: l }) {
               style: { pointerEvents: "none", width: "100%", height: "100%" },
               "aria-hidden": "true",
               children: a.donut ? /* @__PURE__ */ n(
-                de,
+                ce,
                 {
                   variant: "donut",
                   label: a.label,
@@ -950,7 +763,7 @@ function te({ tiles: e, selectedTileId: t, onSelectTile: r, renderTile: l }) {
                   colSpan: c
                 }
               ) : /* @__PURE__ */ n(
-                de,
+                ce,
                 {
                   variant: "standard",
                   label: a.label,
@@ -968,12 +781,12 @@ function te({ tiles: e, selectedTileId: t, onSelectTile: r, renderTile: l }) {
     );
   }) });
 }
-const se = ge(null);
-function re() {
-  return be(se);
+const ae = fe(null);
+function se() {
+  return ge(ae);
 }
-function xt({ mode: e, dispatch: t }) {
-  const r = re();
+function At({ mode: e, dispatch: t }) {
+  const r = se();
   if (r == null && e == null) return null;
   const l = r?.mode ?? e ?? "add", a = r?.selectedTileId ?? null, i = r?.description ?? null, u = a == null;
   return /* @__PURE__ */ f("div", { className: "panel-footer catalog", children: [
@@ -1015,7 +828,7 @@ function xt({ mode: e, dispatch: t }) {
     ] })
   ] });
 }
-function ue(e, t) {
+function de(e, t) {
   if (t.length === 0) return !0;
   const r = t.toLowerCase();
   if (e.label.toLowerCase().includes(r) || e.value.toLowerCase().includes(r)) return !0;
@@ -1026,34 +839,37 @@ function ue(e, t) {
   return !1;
 }
 function Ze() {
-  const t = re()?.description ?? null;
+  const t = se()?.description ?? null;
   return t == null ? /* @__PURE__ */ n("span", { style: { fontStyle: "italic" }, children: "Tap a metric to see its description" }) : /* @__PURE__ */ n("span", { children: t });
 }
-function At({
+function xt({
   isOpen: e,
-  lenses: t = ve,
+  lenses: t = be,
   defaultLens: r = ye,
   tilesByLens: l = _e,
-  lensMeta: a = ae,
-  renderTile: i
+  lensMeta: a = ve,
+  renderTile: i,
+  onAdd: u
 }) {
-  const u = O(), [o, s] = x(r), [c, d] = x(null), [m, h] = x(null), [b, p] = x(""), y = l[o] ?? { primary: [] }, E = a[o], T = ie(
-    () => y.primary.filter((w) => ue(w, b)),
-    [y.primary, b]
-  ), v = ie(
-    () => (y.secondary ?? []).filter((w) => ue(w, b)),
-    [y.secondary, b]
-  ), N = () => u?.dispatch({ type: "CLOSE_PANEL", reason: "apply-button" }), I = () => u?.dispatch({ type: "CLOSE_PANEL", reason: "header-x" }), $ = c == null;
+  const o = O(), [s, c] = A(r), [d, m] = A(null), [h, b] = A(null), [p, _] = A(""), P = l[s] ?? { primary: [] }, E = a[s], y = le(
+    () => P.primary.filter((S) => de(S, p)),
+    [P.primary, p]
+  ), N = le(
+    () => (P.secondary ?? []).filter((S) => de(S, p)),
+    [P.secondary, p]
+  ), I = () => {
+    d != null && u?.(d), o?.dispatch({ type: "CLOSE_PANEL", reason: "apply-button" });
+  }, R = () => o?.dispatch({ type: "CLOSE_PANEL", reason: "header-x" }), $ = d == null;
   return /* @__PURE__ */ n(
-    se.Provider,
+    ae.Provider,
     {
-      value: { mode: "add", selectedTileId: c, description: m },
+      value: { mode: "add", selectedTileId: d, description: h },
       children: /* @__PURE__ */ n(
-        V,
+        Y,
         {
           variant: "no-stage",
           title: "Add a metric",
-          onClose: I,
+          onClose: R,
           footer: {
             left: /* @__PURE__ */ n(Ze, {}),
             right: /* @__PURE__ */ n(
@@ -1063,7 +879,7 @@ function At({
                 type: "button",
                 className: "gloss-panel-chrome-v2__footer-btn gloss-panel-chrome-v2__footer-btn--primary",
                 disabled: $,
-                onClick: N,
+                onClick: I,
                 children: "Add metric"
               }
             )
@@ -1076,19 +892,19 @@ function At({
                 className: "cat-search-input",
                 placeholder: "Search metrics",
                 "aria-label": "Search metrics",
-                value: b,
-                onChange: (w) => p(w.target.value)
+                value: p,
+                onChange: (S) => _(S.target.value)
               }
             ) }),
             /* @__PURE__ */ n(
               Ce,
               {
                 lenses: t,
-                activeLens: o,
+                activeLens: s,
                 lensMeta: a,
                 variant: "pills",
-                onLensChange: (w) => {
-                  s(w), d(null), h(null), p("");
+                onLensChange: (S) => {
+                  c(S), m(null), b(null), _("");
                 }
               }
             ),
@@ -1099,31 +915,31 @@ function At({
             /* @__PURE__ */ n(
               te,
               {
-                tiles: T,
-                selectedTileId: c,
-                onSelectTile: (w, A) => {
-                  d(w), h(A);
+                tiles: y,
+                selectedTileId: d,
+                onSelectTile: (S, L) => {
+                  m(S), b(L);
                 },
                 renderTile: i
               }
             ),
-            v.length > 0 && /* @__PURE__ */ f("div", { className: "cat-more-in-lens", children: [
+            N.length > 0 && /* @__PURE__ */ f("div", { className: "cat-more-in-lens", children: [
               /* @__PURE__ */ n("div", { className: "cat-more-in-lens__heading", children: "MORE IN THIS LENS" }),
               /* @__PURE__ */ n(
                 te,
                 {
-                  tiles: v,
-                  selectedTileId: c,
-                  onSelectTile: (w, A) => {
-                    d(w), h(A);
+                  tiles: N,
+                  selectedTileId: d,
+                  onSelectTile: (S, L) => {
+                    m(S), b(L);
                   },
                   renderTile: i
                 }
               )
             ] }),
-            T.length === 0 && v.length === 0 && b.length > 0 && /* @__PURE__ */ f("div", { className: "cat-empty", children: [
+            y.length === 0 && N.length === 0 && p.length > 0 && /* @__PURE__ */ f("div", { className: "cat-empty", children: [
               'No metrics match "',
-              b,
+              p,
               '".'
             ] })
           ] })
@@ -1133,28 +949,28 @@ function At({
   );
 }
 function Xe() {
-  const t = re()?.description ?? null;
-  return t == null ? /* @__PURE__ */ n("em", { children: "Tap a metric to see its description" }) : /* @__PURE__ */ n(B, { children: t });
+  const t = se()?.description ?? null;
+  return t == null ? /* @__PURE__ */ n("em", { children: "Tap a metric to see its description" }) : /* @__PURE__ */ n(V, { children: t });
 }
 function kt({
   isOpen: e,
   replacingLabel: t,
-  lenses: r = ve,
+  lenses: r = be,
   defaultLens: l = ye,
   tilesByLens: a = _e,
   renderTile: i
 }) {
-  const u = O(), [o, s] = x(l), [c, d] = x(null), [m, h] = x(null), b = a[o] ?? { primary: [] }, p = [...b.primary, ...b.secondary ?? []], y = () => u?.dispatch({ type: "CLOSE_PANEL", reason: "apply-button" }), E = () => u?.dispatch({ type: "CLOSE_PANEL", reason: "header-x" }), T = c == null;
+  const u = O(), [o, s] = A(l), [c, d] = A(null), [m, h] = A(null), b = a[o] ?? { primary: [] }, p = [...b.primary, ...b.secondary ?? []], _ = () => u?.dispatch({ type: "CLOSE_PANEL", reason: "apply-button" }), P = () => u?.dispatch({ type: "CLOSE_PANEL", reason: "header-x" }), E = c == null;
   return /* @__PURE__ */ n(
-    se.Provider,
+    ae.Provider,
     {
       value: { mode: "replace", selectedTileId: c, description: m },
       children: /* @__PURE__ */ n(
-        V,
+        Y,
         {
           variant: "no-stage",
           title: "Replace metric",
-          onClose: E,
+          onClose: P,
           footer: {
             left: /* @__PURE__ */ n(Xe, {}),
             right: /* @__PURE__ */ n(
@@ -1163,8 +979,8 @@ function kt({
                 id: "btn-cat-replace",
                 type: "button",
                 className: "gloss-panel-chrome-v2__footer-btn gloss-panel-chrome-v2__footer-btn--primary",
-                disabled: T,
-                onClick: y,
+                disabled: E,
+                onClick: _,
                 children: "Replace metric"
               }
             )
@@ -1179,8 +995,8 @@ function kt({
               {
                 lenses: r,
                 activeLens: o,
-                onLensChange: (v) => {
-                  s(v), d(null), h(null);
+                onLensChange: (y) => {
+                  s(y), d(null), h(null);
                 }
               }
             ),
@@ -1189,8 +1005,8 @@ function kt({
               {
                 tiles: p,
                 selectedTileId: c,
-                onSelectTile: (v, N) => {
-                  d(v), h(N);
+                onSelectTile: (y, N) => {
+                  d(y), h(N);
                 },
                 renderTile: i
               }
@@ -1201,12 +1017,12 @@ function kt({
     }
   );
 }
-const Ne = ge(null);
-function Te() {
-  return be(Ne);
+const Ne = fe(null);
+function Se() {
+  return ge(Ne);
 }
 function Je(e = {}) {
-  const t = Te(), r = t?.createPage, l = t?.setPages;
+  const t = Se(), r = t?.createPage, l = t?.setPages;
   return /* @__PURE__ */ f(
     "div",
     {
@@ -1237,12 +1053,12 @@ function Je(e = {}) {
     }
   );
 }
-function pe({ page: e, onRename: t, onKebab: r, onDragStart: l, onSwitchPage: a }) {
-  const i = Te(), [u, o] = x(!1), s = K(null);
-  R(() => {
+function ue({ page: e, onRename: t, onKebab: r, onDragStart: l, onSwitchPage: a }) {
+  const i = Se(), [u, o] = A(!1), s = K(null);
+  F(() => {
     if (!u) return;
-    const p = (y) => {
-      s.current && (s.current.contains(y.target) || o(!1));
+    const p = (_) => {
+      s.current && (s.current.contains(_.target) || o(!1));
     };
     return document.addEventListener("mousedown", p, !0), () => document.removeEventListener("mousedown", p, !0);
   }, [u]);
@@ -1294,7 +1110,7 @@ function pe({ page: e, onRename: t, onKebab: r, onDragStart: l, onSwitchPage: a
         onMouseDown: (p) => p.stopPropagation(),
         onClick: (p) => {
           if (p.stopPropagation(), r) return r(e.id);
-          o((y) => !y);
+          o((_) => !_);
         },
         children: "⋯"
       }
@@ -1343,39 +1159,39 @@ function Dt({
   onCreatePage: s,
   onSwitchPage: c
 }) {
-  const d = O(), [m, h] = x(() => [...t]), b = L((g, C) => {
-    h((S) => S.map((k) => k.id === g ? { ...k, name: C } : k));
-  }, []), p = L((g) => {
+  const d = O(), [m, h] = A(() => [...t]), b = D((g, C) => {
+    h((w) => w.map((x) => x.id === g ? { ...x, name: C } : x));
+  }, []), p = D((g) => {
     h((C) => {
-      const S = C.find((F) => F.id === g);
-      if (!S) return C;
-      const k = {
-        id: `${S.id}-copy-${Date.now()}`,
-        name: `${S.name} copy`,
+      const w = C.find((z) => z.id === g);
+      if (!w) return C;
+      const x = {
+        id: `${w.id}-copy-${Date.now()}`,
+        name: `${w.name} copy`,
         active: !1
-      }, D = C.findIndex((F) => F.id === g);
-      return [...C.slice(0, D + 1), k, ...C.slice(D + 1)];
+      }, k = C.findIndex((z) => z.id === g);
+      return [...C.slice(0, k + 1), x, ...C.slice(k + 1)];
     });
-  }, []), y = L((g) => {
-    h((C) => C.filter((S) => S.id !== g));
-  }, []), E = L((g) => {
+  }, []), _ = D((g) => {
+    h((C) => C.filter((w) => w.id !== g));
+  }, []), P = D((g) => {
     h((C) => {
-      const S = new Map(C.map((D) => [D.id, D])), k = g.map((D) => S.get(D)).filter(Boolean);
-      return k.length === C.length ? k : C;
+      const w = new Map(C.map((k) => [k.id, k])), x = g.map((k) => w.get(k)).filter(Boolean);
+      return x.length === C.length ? x : C;
     });
-  }, []), T = r != null, v = T ? r : m, N = l != null ? v.map((g) => ({ ...g, active: g.id === l })) : [...v], I = a ?? (T ? void 0 : b), $ = i ?? (T ? void 0 : p), w = u ?? (T ? void 0 : y), A = o ?? (T ? void 0 : E), Y = L(
+  }, []), E = r != null, y = E ? r : m, N = l != null ? y.map((g) => ({ ...g, active: g.id === l })) : [...y], I = a ?? (E ? void 0 : b), R = i ?? (E ? void 0 : p), $ = u ?? (E ? void 0 : _), S = o ?? (E ? void 0 : P), L = D(
     (g) => {
-      T || h(g);
+      E || h(g);
     },
-    [T]
-  ), W = L(
+    [E]
+  ), q = D(
     (g) => {
-      const C = g[0]?.items.map((S) => S.id) ?? [];
-      C.length > 0 && A && A(C);
+      const C = g[0]?.items.map((w) => w.id) ?? [];
+      C.length > 0 && S && S(C);
     },
-    [A]
-  ), G = N.map((g) => `${g.id}:${g.name}`).join("|"), Q = A != null && N.length > 1 ? /* @__PURE__ */ n(
-    Ee,
+    [S]
+  ), Q = N.map((g) => `${g.id}:${g.name}`).join("|"), W = S != null && N.length > 1 ? /* @__PURE__ */ n(
+    Pe,
     {
       zones: [
         {
@@ -1383,10 +1199,10 @@ function Dt({
           items: N.map((g) => ({ ...g, id: g.id }))
         }
       ],
-      onZoneChange: W,
-      renderZone: (g, C, S) => /* @__PURE__ */ n("div", { className: "pm-list", role: "list", children: S }),
+      onZoneChange: q,
+      renderZone: (g, C, w) => /* @__PURE__ */ n("div", { className: "pm-list", role: "list", children: w }),
       renderItem: (g) => /* @__PURE__ */ n(
-        pe,
+        ue,
         {
           page: g,
           onSwitchPage: c
@@ -1394,35 +1210,35 @@ function Dt({
         g.id
       )
     },
-    G
+    Q
   ) : /* @__PURE__ */ n("div", { className: "pm-list", role: "list", children: N.map((g) => /* @__PURE__ */ n(
-    pe,
+    ue,
     {
       page: g,
       onSwitchPage: c
     },
     g.id
-  )) }), q = () => d?.dispatch({ type: "CLOSE_PANEL", reason: "header-x" });
+  )) }), G = () => d?.dispatch({ type: "CLOSE_PANEL", reason: "header-x" });
   return /* @__PURE__ */ n(
     Ne.Provider,
     {
       value: {
         pages: N,
-        setPages: Y,
+        setPages: L,
         renamePage: I,
-        duplicatePage: $,
-        deletePage: w,
+        duplicatePage: R,
+        deletePage: $,
         // Sprint 2026-05-20 — propagate live create binding for footer.
         createPage: s
       },
       children: /* @__PURE__ */ n(
-        V,
+        Y,
         {
           variant: "no-stage",
           title: "Manage pages",
-          onClose: q,
+          onClose: G,
           footer: { right: /* @__PURE__ */ n(Je, {}) },
-          children: /* @__PURE__ */ n("div", { "data-shell": "page-management", "aria-hidden": !e, children: Q })
+          children: /* @__PURE__ */ n("div", { "data-shell": "page-management", "aria-hidden": !e, children: W })
         }
       )
     }
@@ -1449,8 +1265,8 @@ const Lt = {
   background: "rgba(0, 0, 0, 0.04)"
 };
 function Ot() {
-  const { state: e, dispatch: t, getCloseLog: r } = Pe();
-  R(() => {
+  const { state: e, dispatch: t, getCloseLog: r } = Te();
+  F(() => {
     if (e.activePanelId == null) return;
     function i(u) {
       u.key === "Escape" && t({ type: "CLOSE_PANEL", reason: "escape-key" });
@@ -1458,9 +1274,9 @@ function Ot() {
     return document.addEventListener("keydown", i), () => document.removeEventListener("keydown", i);
   }, [e.activePanelId, t]);
   const l = K(e);
-  Ae(() => {
+  xe(() => {
     l.current = e;
-  }), R(() => {
+  }), F(() => {
     if (process.env.NODE_ENV === "production") return;
     const i = window;
     return i.__panelsHostHandle && console.warn("[panels] multiple PanelHost/PanelHostShell instances mounted; dev handle is unreliable"), i.__panelsHostHandle = {
@@ -1471,7 +1287,7 @@ function Ot() {
       i.__panelsHostHandle?.dispatch === t && delete window.__panelsHostHandle;
     };
   }, [t, r]);
-  const a = L(() => {
+  const a = D(() => {
     t({ type: "CLOSE_PANEL", reason: "nav-escape-hatch" });
   }, [t]);
   return /* @__PURE__ */ n("div", { "data-panel-host": "true", style: tt, children: e.activePanelId != null && /* @__PURE__ */ n(
@@ -1485,8 +1301,8 @@ function Ot() {
 }
 const at = 700;
 function st(e) {
-  const [t, r] = x(null), l = K(null);
-  return R(() => {
+  const [t, r] = A(null), l = K(null);
+  return F(() => {
     if (e != null) {
       l.current != null && (clearTimeout(l.current), l.current = null), r(null);
       return;
@@ -1496,7 +1312,7 @@ function st(e) {
     }, at), () => {
       l.current != null && (clearTimeout(l.current), l.current = null);
     };
-  }, [e]), R(() => {
+  }, [e]), F(() => {
     e != null && r(e);
   }, [e]), e != null ? { panelId: e, isOpen: !0 } : t != null ? { panelId: t, isOpen: !1 } : { panelId: null, isOpen: !1 };
 }
@@ -1507,13 +1323,13 @@ function Mt({ panelComponents: e, children: t }) {
   return u == null && t == null ? (process.env.NODE_ENV !== "production" && console.error(
     "[panels] No panel component registered for activePanelId:",
     a
-  ), null) : /* @__PURE__ */ n(xe, { isOpen: i, children: u != null ? /* @__PURE__ */ n(u, { isOpen: i }) : t });
+  ), null) : /* @__PURE__ */ n(Ae, { isOpen: i, children: u != null ? /* @__PURE__ */ n(u, { isOpen: i }) : t });
 }
-function me(e) {
+function pe(e) {
   return e === null ? null : e.kind === "manage-pages-action" ? `global-${e.align ?? "left"}` : e.kind === "card-overflow" || e.kind === "empty-cell" ? `section-${e.sectionIndex}` : null;
 }
-const rt = 685, he = 627, ot = "cubic-bezier(0.22, 1, 0.36, 1)", lt = 200;
-function Se(e, t) {
+const rt = 685, me = 627, ot = "cubic-bezier(0.22, 1, 0.36, 1)", lt = 200;
+function Ee(e, t) {
   if (typeof window > "u") return t;
   const r = window.getComputedStyle(document.documentElement).getPropertyValue(e).trim();
   if (!r) return t;
@@ -1523,13 +1339,13 @@ function Se(e, t) {
 function it(e, t) {
   return typeof window > "u" ? t : window.getComputedStyle(document.documentElement).getPropertyValue(e).trim() || t;
 }
-function z(e) {
+function U(e) {
   e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger });
 }
 function ct(e) {
   const { mountEl: t, chromeEl: r, reducedMotion: l, onAssert: a } = e;
   if (t == null || r == null) {
-    z(e), a?.({ branch: "slide-fallback-no-dom", timestamp: Date.now() });
+    U(e), a?.({ branch: "slide-fallback-no-dom", timestamp: Date.now() });
     return;
   }
   if (l) {
@@ -1537,12 +1353,12 @@ function ct(e) {
     return;
   }
   if (typeof r.animate != "function") {
-    z(e), a?.({ branch: "slide-no-waapi", timestamp: Date.now() });
+    U(e), a?.({ branch: "slide-no-waapi", timestamp: Date.now() });
     return;
   }
   const i = r.cloneNode(!0);
   i.id = "panel-chrome-frozen", i.style.cssText = "position:absolute;left:8px;right:8px;top:8px;z-index:1;pointer-events:none;", t.appendChild(i), r.style.zIndex = "2", e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger });
-  const u = Se("--panel-open-dur", rt), o = it("--panel-easing", ot), s = r.animate(
+  const u = Ee("--panel-open-dur", rt), o = it("--panel-easing", ot), s = r.animate(
     [{ transform: "translateY(100%)" }, { transform: "translateY(0)" }],
     { duration: u, easing: o, fill: "forwards" }
   );
@@ -1557,10 +1373,10 @@ function ct(e) {
 function dt(e) {
   const { mountEl: t, onAssert: r } = e;
   if (t == null) {
-    e.dispatch({ type: "CLOSE_PANEL", reason: "mutex-handoff" }), setTimeout(() => z(e), he), r?.({ branch: "handoff-fallback-no-mount", timestamp: Date.now() });
+    e.dispatch({ type: "CLOSE_PANEL", reason: "mutex-handoff" }), setTimeout(() => U(e), me), r?.({ branch: "handoff-fallback-no-mount", timestamp: Date.now() });
     return;
   }
-  const l = Se("--panel-close-dur", he);
+  const l = Ee("--panel-close-dur", me);
   let a = !1, i = null;
   const u = (s) => {
     s.target !== t || s.propertyName !== "max-height" || a || (a = !0, i != null && clearTimeout(i), t.removeEventListener("transitionend", u), e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }), r?.({ branch: "handoff-complete", timestamp: Date.now() }));
@@ -1575,7 +1391,7 @@ function ut(e) {
     e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }), r?.({ branch: "blocked-dirty", timestamp: Date.now() });
     return;
   }
-  const l = me(t.activeTrigger), a = me(e.trigger);
+  const l = pe(t.activeTrigger), a = pe(e.trigger);
   if (!!t.activePanelId && l != null && l === a) {
     ct(e);
     return;
@@ -1584,15 +1400,15 @@ function ut(e) {
     dt(e);
     return;
   }
-  z(e), r?.({ branch: "fresh-open", timestamp: Date.now() });
+  U(e), r?.({ branch: "fresh-open", timestamp: Date.now() });
 }
 function pt() {
   if (!(typeof window > "u"))
     return window.__panelsAsserter;
 }
 function It() {
-  const e = O(), t = fe();
-  return L(
+  const e = O(), t = he();
+  return D(
     (r, l) => {
       if (!e)
         return;
@@ -1613,10 +1429,10 @@ function It() {
     [e, t]
   );
 }
-function $t({ children: e }) {
+function Rt({ children: e }) {
   return /* @__PURE__ */ n("div", { className: "clone-stage", children: e });
 }
-let H = !1, j = null;
+let B = !1, j = null;
 function ne() {
   const e = [];
   let t = "cleaned";
@@ -1641,21 +1457,21 @@ function ne() {
   };
 }
 const Z = "8px 8px 0px", X = "64px", J = "inset(0px 0px 60px 0px)", ee = "inset(0px -40px -40px -40px)";
-function _(e, t, r, l, a) {
+function v(e, t, r, l, a) {
   return { id: e, constraint: t, expected: r, actual: l, pass: a };
 }
 function M(e) {
   const t = parseInt(e, 10);
   return Number.isFinite(t) ? t : NaN;
 }
-function oe() {
+function re() {
   const e = [], t = document.querySelector(".gloss-panel-mount"), r = t?.querySelector(".gloss-panel-chrome") ?? null, l = document.querySelector(".gloss-panel-coordinator") ?? document.querySelector("[data-panel-coordinator]"), a = document.querySelector(".bell-cutout"), i = document.querySelector(".bell-popover"), u = document.querySelector(".gloss-bottom-toolbar");
   if (!t)
-    e.push(_("C1", "mount --reveal-y matches clip-path inset-bottom Npx", "mount present", "absent", !1));
+    e.push(v("C1", "mount --reveal-y matches clip-path inset-bottom Npx", "mount present", "absent", !1));
   else {
     const o = getComputedStyle(t), s = o.getPropertyValue("--reveal-y").trim() || t.style.getPropertyValue("--reveal-y").trim(), c = o.clipPath || t.style.clipPath || "", d = c.match(/inset\(\s*0(?:px)?\s+0(?:px)?\s+(\d+)px\s+0(?:px)?\s*\)/), m = d ? parseInt(d[1], 10) : NaN, h = M(s), b = Number.isFinite(m) && Number.isFinite(h) && m === h;
     e.push(
-      _(
+      v(
         "C1",
         "mount --reveal-y matches clip-path inset-bottom Npx",
         `inset(0 0 ${h}px 0) === --reveal-y(${h}px)`,
@@ -1665,19 +1481,19 @@ function oe() {
     );
   }
   if (!t)
-    e.push(_("C2", "mount padding constant", Z, "absent", !1));
+    e.push(v("C2", "mount padding constant", Z, "absent", !1));
   else {
     const o = t.style.padding, s = getComputedStyle(t), c = o || s.padding || "", d = c === Z || c === "8px 8px 0px 8px";
-    e.push(_("C2", "mount padding constant", Z, c || "n/a", d));
+    e.push(v("C2", "mount padding constant", Z, c || "n/a", d));
   }
   if (!t)
-    e.push(_("C3", "mount.bottom resolves to var(--tb-h)=64px", X, "absent", !1));
+    e.push(v("C3", "mount.bottom resolves to var(--tb-h)=64px", X, "absent", !1));
   else {
     const s = getComputedStyle(t).bottom || t.style.bottom || "", c = s === X;
-    e.push(_("C3", "mount.bottom resolves to var(--tb-h)=64px", X, s || "n/a", c));
+    e.push(v("C3", "mount.bottom resolves to var(--tb-h)=64px", X, s || "n/a", c));
   }
   if (!r)
-    e.push(_("C4", "panel-chrome height formula = (row-h*3)+(row-gap*3)-8px", "formula match", "absent", !1));
+    e.push(v("C4", "panel-chrome height formula = (row-h*3)+(row-gap*3)-8px", "formula match", "absent", !1));
   else {
     const o = getComputedStyle(r), s = M(
       o.getPropertyValue("--row-h").trim() || r.style.getPropertyValue("--row-h").trim() || "0"
@@ -1685,7 +1501,7 @@ function oe() {
       o.getPropertyValue("--row-gap").trim() || r.style.getPropertyValue("--row-gap").trim() || "0"
     ), d = s * 3 + c * 3 - 8, m = M(o.height || r.style.height || ""), h = Number.isFinite(s) && Number.isFinite(c) && Number.isFinite(m) && Number.isFinite(d) && m === d;
     e.push(
-      _(
+      v(
         "C4",
         "panel-chrome height formula = (row-h*3)+(row-gap*3)-8px",
         `${d}px (rh=${s} rg=${c})`,
@@ -1696,7 +1512,7 @@ function oe() {
   }
   if (!l || !r)
     e.push(
-      _(
+      v(
         "C5",
         'coordinator perspective + origin "center bottom"; chrome perspective-style flat',
         "present",
@@ -1705,14 +1521,14 @@ function oe() {
       )
     );
   else {
-    const o = getComputedStyle(l), s = getComputedStyle(r), c = o.perspective || l.style.perspective || "", d = (o.perspectiveOrigin || l.style.perspectiveOrigin || "").trim(), m = s.perspectiveStyle || r.style.perspectiveStyle || "", y = c !== "" && c !== "none" && (d === "center bottom" || d === "50% 100%") && m === "flat";
+    const o = getComputedStyle(l), s = getComputedStyle(r), c = o.perspective || l.style.perspective || "", d = (o.perspectiveOrigin || l.style.perspectiveOrigin || "").trim(), m = s.perspectiveStyle || r.style.perspectiveStyle || "", _ = c !== "" && c !== "none" && (d === "center bottom" || d === "50% 100%") && m === "flat";
     e.push(
-      _(
+      v(
         "C5",
         'coordinator perspective + origin "center bottom"; chrome perspective-style flat',
         "perspective:not-none, origin:center bottom, chrome-style:flat",
         `perspective=${c} origin=${d} chrome-style=${m}`,
-        y
+        _
       )
     );
   }
@@ -1728,8 +1544,8 @@ function oe() {
         }
         for (const m of d)
           if (m.name === "stage-spin") {
-            const b = Array.from(m.cssRules), p = b.find((N) => N.keyText === "0%" || N.keyText === "from"), y = b.find((N) => N.keyText === "100%" || N.keyText === "to"), E = p?.style.transform ?? "", T = y?.style.transform ?? "", v = /rotateY\(\s*0(?:deg)?\s*\)/;
-            o = v.test(E) && v.test(T), s = `0%=${E || "n/a"} 100%=${T || "n/a"}`;
+            const b = Array.from(m.cssRules), p = b.find((N) => N.keyText === "0%" || N.keyText === "from"), _ = b.find((N) => N.keyText === "100%" || N.keyText === "to"), P = p?.style.transform ?? "", E = _?.style.transform ?? "", y = /rotateY\(\s*0(?:deg)?\s*\)/;
+            o = y.test(P) && y.test(E), s = `0%=${P || "n/a"} 100%=${E || "n/a"}`;
             break;
           }
         if (s !== "absent") break;
@@ -1738,7 +1554,7 @@ function oe() {
       s = "inspection-error";
     }
     e.push(
-      _(
+      v(
         "C6",
         "@keyframes stage-spin 0% AND 100% anchor at rotateY(0)",
         "both frames rotateY(0)",
@@ -1750,15 +1566,15 @@ function oe() {
   {
     const o = document.documentElement, s = getComputedStyle(o), c = s.getPropertyValue("--panel-open-dur").trim() || o.style.getPropertyValue("--panel-open-dur").trim(), d = s.getPropertyValue("--panel-close-dur").trim() || o.style.getPropertyValue("--panel-close-dur").trim(), m = M(c) || parseFloat(c) * (c.endsWith("s") && !c.endsWith("ms") ? 1e3 : 1), h = M(d) || parseFloat(d) * (d.endsWith("s") && !d.endsWith("ms") ? 1e3 : 1), b = Number.isFinite(m) && Number.isFinite(h) && m > h;
     e.push(
-      _("C7", "--panel-open-dur > --panel-close-dur", "open > close", `open=${c || "n/a"} close=${d || "n/a"}`, b)
+      v("C7", "--panel-open-dur > --panel-close-dur", "open > close", `open=${c || "n/a"} close=${d || "n/a"}`, b)
     );
   }
   if (!a)
-    e.push(_("C8", "BellCutout zero computed animation/transition", "no inline timing", "absent", !1));
+    e.push(v("C8", "BellCutout zero computed animation/transition", "no inline timing", "absent", !1));
   else {
     const o = getComputedStyle(a), s = o.animationName || "", c = o.transitionProperty || "", d = (s === "" || s === "none") && (c === "" || c === "none" || c === "all");
     e.push(
-      _(
+      v(
         "C8",
         "BellCutout zero computed animation/transition",
         "animation:none AND transition:none",
@@ -1768,17 +1584,17 @@ function oe() {
     );
   }
   if (!t)
-    e.push(_("C9", "mount closed-state clipPath", J, "absent", !1));
+    e.push(v("C9", "mount closed-state clipPath", J, "absent", !1));
   else {
     const o = t.style.clipPath, s = getComputedStyle(t), c = o || s.clipPath || "", d = c === J;
-    e.push(_("C9", "mount closed-state clipPath", J, c || "n/a", d));
+    e.push(v("C9", "mount closed-state clipPath", J, c || "n/a", d));
   }
   if (!i)
-    e.push(_("C10", "bell-popover parentElement === document.body (open)", "body", "absent", !1));
+    e.push(v("C10", "bell-popover parentElement === document.body (open)", "body", "absent", !1));
   else {
     const o = i.parentElement, s = o === document.body;
     e.push(
-      _(
+      v(
         "C10",
         "bell-popover parentElement === document.body (open)",
         "body",
@@ -1788,19 +1604,19 @@ function oe() {
     );
   }
   if (!l)
-    e.push(_("C11", "coordinator overflow === visible", "visible", "absent", !1));
+    e.push(v("C11", "coordinator overflow === visible", "visible", "absent", !1));
   else {
     const s = getComputedStyle(l).overflow || l.style.overflow || "", c = s === "visible";
-    e.push(_("C11", "coordinator overflow === visible", "visible", s || "n/a", c));
+    e.push(v("C11", "coordinator overflow === visible", "visible", s || "n/a", c));
   }
   if (!u)
-    e.push(_("C12", "toolbar clipPath = inset(0 -40 -40 -40)", ee, "absent", !1));
+    e.push(v("C12", "toolbar clipPath = inset(0 -40 -40 -40)", ee, "absent", !1));
   else {
     const o = u.style.clipPath, s = getComputedStyle(u), c = o || s.clipPath || "", d = c === ee;
-    e.push(_("C12", "toolbar clipPath = inset(0 -40 -40 -40)", ee, c || "n/a", d));
+    e.push(v("C12", "toolbar clipPath = inset(0 -40 -40 -40)", ee, c || "n/a", d));
   }
   return e.push(
-    _(
+    v(
       "C13",
       "same-position slide via WAAPI (mid-transition getAnimations().length > 0)",
       "WAAPI driver wired in orchestrator (source-proof)",
@@ -1808,7 +1624,7 @@ function oe() {
       "wiring_only"
     )
   ), e.push(
-    _(
+    v(
       "C14",
       'cross-position handoff transitionend filtered by propertyName="max-height"',
       "transitionend filter wired in orchestrator (source-proof)",
@@ -1818,7 +1634,7 @@ function oe() {
   ), e;
 }
 function mt(e) {
-  return oe().find((t) => t.id === e);
+  return re().find((t) => t.id === e);
 }
 function ht() {
   const e = ne();
@@ -1830,84 +1646,84 @@ function ht() {
       actual: `valid=${e.valid} mount=${e.mount} chrome=${e.chrome} frozen=${e.frozen} orphans=[${e.orphans.join(",")}]`,
       pass: e.valid
     }
-  ], cc: oe() };
+  ], cc: re() };
 }
 function ft() {
   return {
     enable: gt,
     disable: bt,
-    isEnabled: () => H,
+    isEnabled: () => B,
     getLastReport: () => j,
     recordTransition: (e) => {
-      H && (j = { ...e, ...ne() });
+      B && (j = { ...e, ...ne() });
     },
     assertOnce: () => {
       const e = ne();
       return j = e, e;
     },
-    assertCcOnly: oe,
+    assertCcOnly: re,
     getCcRowById: mt,
     assertPanelTruths: ht
   };
 }
 function gt() {
-  if (H = !0, typeof window > "u") return;
+  if (B = !0, typeof window > "u") return;
   window.__panelsAsserter || (window.__panelsAsserter = ft(), console.info(
     "[panels] asserter enabled (P3b Q12-12 + P6 W5 cc:C1..C14). Inspect via window.__panelsAsserter."
   ));
 }
 function bt() {
-  H = !1;
+  B = !1;
 }
 export {
-  Ut as COMMITS,
-  At as CatalogAddShell,
-  xt as CatalogFooter,
+  zt as COMMITS,
+  xt as CatalogAddShell,
+  At as CatalogFooter,
   kt as CatalogReplaceShell,
-  se as CatalogStateContext,
-  He as CloneCard,
-  $t as CloneStage,
+  ae as CatalogStateContext,
+  Ue as CloneCard,
+  Rt as CloneStage,
   ye as MOCK_DEFAULT_LENS,
-  ve as MOCK_LENSES,
-  ae as MOCK_LENS_META,
+  be as MOCK_LENSES,
+  ve as MOCK_LENS_META,
   et as MOCK_PAGES,
   _e as MOCK_TILES_BY_LENS,
-  zt as NotificationCenterShell,
+  Ht as NotificationCenterShell,
   Lt as PANEL_IDS,
   Je as PageMgmtFooter,
   Dt as PageMgmtShell,
   Ne as PageMgmtStateContext,
-  Ht as PanelBody,
-  Vt as PanelChrome,
-  V as PanelChromeV2,
-  Bt as PanelFooter,
-  Et as PanelFooterMessage,
-  Kt as PanelHeader,
-  Yt as PanelHost,
+  Ut as PanelBody,
+  Bt as PanelChrome,
+  Y as PanelChromeV2,
+  Yt as PanelFooter,
+  Pt as PanelFooterMessage,
+  Vt as PanelHeader,
+  Kt as PanelHost,
   Ot as PanelHostShell,
-  xe as PanelMount,
-  Wt as PanelNavigation,
-  Gt as PanelProvider,
+  Ae as PanelMount,
+  qt as PanelNavigation,
+  Qt as PanelProvider,
   Mt as PanelSlot,
-  Qt as PanelStage,
-  Pt as SettingsShell,
-  oe as assertCcOnly,
+  Wt as PanelStage,
+  Tt as SettingsShell,
+  re as assertCcOnly,
   ne as assertPanelDomShape,
   ht as assertPanelTruths,
-  qt as deriveSurfaceState,
+  Gt as deriveSurfaceState,
   bt as disablePanelAsserter,
   gt as enablePanelAsserter,
   mt as getCcRowById,
   jt as initialState,
-  me as positionKey,
+  pe as positionKey,
   Zt as reducer,
   ut as transitionToPanel,
-  re as useCatalogState,
+  se as useCatalogState,
   wt as useEditingCardId,
-  Te as usePageMgmtState,
-  Pe as usePanelContext,
+  Se as usePageMgmtState,
+  Te as usePanelContext,
   O as usePanelContextOptional,
   Xt as usePanelCoordinator,
-  fe as useReducedMotionPanel,
+  he as useReducedMotionPanel,
   It as useTransitionToPanel
 };