@mediaradar/design-components 0.14.0 → 0.16.0

package/dist/index.js

@@ -479,9 +479,33 @@ function Badge({ tone = "neutral", kind = "label", dot = false, children, classN
   );
 }
 
+// src/Delta.tsx
+import { ArrowDownRight, ArrowUpRight } from "lucide-react";
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+function Delta({ value, suffix = "%", arrow = false, period, className }) {
+  const up = value >= 0;
+  return /* @__PURE__ */ jsxs5(
+    "span",
+    {
+      className: cn(
+        "inline-flex items-center gap-0.5 font-medium tabular-nums",
+        up ? "text-text-success" : "text-text-danger",
+        className
+      ),
+      children: [
+        arrow && (up ? /* @__PURE__ */ jsx5(ArrowUpRight, { size: 13, "aria-hidden": "true" }) : /* @__PURE__ */ jsx5(ArrowDownRight, { size: 13, "aria-hidden": "true" })),
+        up ? "+" : "\u2212",
+        Math.abs(value).toFixed(1),
+        suffix,
+        period && /* @__PURE__ */ jsx5("span", { className: "ml-0.5", children: period })
+      ]
+    }
+  );
+}
+
 // src/CheckBox.tsx
 import { Check as Check2, Minus } from "lucide-react";
-import { jsx as jsx5 } from "react/jsx-runtime";
+import { jsx as jsx6 } from "react/jsx-runtime";
 function boxClass(on, disabled) {
   return cn(
     "flex h-[18px] w-[18px] shrink-0 items-center justify-center rounded-[5px] border transition-colors",
@@ -490,8 +514,8 @@ function boxClass(on, disabled) {
   );
 }
 function Glyph({ checked, indeterminate }) {
-  if (indeterminate) return /* @__PURE__ */ jsx5(Minus, { size: 13, strokeWidth: 3 });
-  return checked ? /* @__PURE__ */ jsx5(Check2, { size: 13, strokeWidth: 3 }) : null;
+  if (indeterminate) return /* @__PURE__ */ jsx6(Minus, { size: 13, strokeWidth: 3 });
+  return checked ? /* @__PURE__ */ jsx6(Check2, { size: 13, strokeWidth: 3 }) : null;
 }
 function CheckBox({
   checked,
@@ -505,7 +529,7 @@ function CheckBox({
   className
 }) {
   const on = checked || !!indeterminate;
-  return /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsx6(
     "button",
     {
       type: "button",
@@ -529,18 +553,18 @@ function CheckBox({
         disabled && "hover:border-border-interactive",
         className
       ),
-      children: /* @__PURE__ */ jsx5(Glyph, { checked, indeterminate })
+      children: /* @__PURE__ */ jsx6(Glyph, { checked, indeterminate })
     }
   );
 }
 function CheckBoxBox({ checked, indeterminate, disabled, className }) {
-  return /* @__PURE__ */ jsx5("span", { "aria-hidden": "true", className: cn(boxClass(checked || !!indeterminate, disabled), className), children: /* @__PURE__ */ jsx5(Glyph, { checked, indeterminate }) });
+  return /* @__PURE__ */ jsx6("span", { "aria-hidden": "true", className: cn(boxClass(checked || !!indeterminate, disabled), className), children: /* @__PURE__ */ jsx6(Glyph, { checked, indeterminate }) });
 }
 
 // src/DateRangeFilter.tsx
 import { useEffect as useEffect3, useMemo as useMemo2, useRef as useRef3, useState as useState3 } from "react";
 import { ChevronDown as ChevronDown2, ChevronLeft, ChevronRight } from "lucide-react";
-import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
 var DEFAULT_SHORTCUTS = [
   "Year to date",
   "Rolling 3 months",
@@ -746,8 +770,8 @@ function DateRangeFilter({
     onRangeChange?.(s, e);
     setOpen(false);
   };
-  return /* @__PURE__ */ jsxs5("div", { className: "relative", ref, children: [
-    /* @__PURE__ */ jsxs5(
+  return /* @__PURE__ */ jsxs6("div", { className: "relative", ref, children: [
+    /* @__PURE__ */ jsxs6(
       "button",
       {
         type: "button",
@@ -756,16 +780,16 @@ function DateRangeFilter({
         "aria-expanded": open,
         className: "flex h-11 items-center gap-2 rounded-control border border-border-strong bg-input px-2.5 text-text-secondary transition-colors hover:bg-subtle hover:text-text-primary focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-border-focus",
         children: [
-          icon && /* @__PURE__ */ jsx6("span", { className: "shrink-0 text-text-tertiary", children: icon }),
-          /* @__PURE__ */ jsxs5("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
-            /* @__PURE__ */ jsx6("span", { className: showDates ? "text-[11px] text-text-tertiary" : "text-[10px] uppercase tracking-wide text-text-tertiary", children: showDates ? displayDatesLine : caption }),
-            /* @__PURE__ */ jsx6("span", { className: "text-[12px] font-medium text-text-primary", children: displayValue })
+          icon && /* @__PURE__ */ jsx7("span", { className: "shrink-0 text-text-tertiary", children: icon }),
+          /* @__PURE__ */ jsxs6("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
+            /* @__PURE__ */ jsx7("span", { className: showDates ? "text-[11px] text-text-tertiary" : "text-[10px] uppercase tracking-wide text-text-tertiary", children: showDates ? displayDatesLine : caption }),
+            /* @__PURE__ */ jsx7("span", { className: "text-[12px] font-medium text-text-primary", children: displayValue })
           ] }),
-          /* @__PURE__ */ jsx6(ChevronDown2, { size: 14, "aria-hidden": "true", className: `shrink-0 text-text-secondary transition-transform ${open ? "rotate-180" : ""}` })
+          /* @__PURE__ */ jsx7(ChevronDown2, { size: 14, "aria-hidden": "true", className: `shrink-0 text-text-secondary transition-transform ${open ? "rotate-180" : ""}` })
         ]
       }
     ),
-    open && /* @__PURE__ */ jsxs5(
+    open && /* @__PURE__ */ jsxs6(
       "div",
       {
         "data-testid": testIdPrefix && `${testIdPrefix}-popover`,
@@ -773,7 +797,7 @@ function DateRangeFilter({
         role: "dialog",
         "aria-label": "Select date range",
         children: [
-          /* @__PURE__ */ jsx6("div", { className: "flex w-44 shrink-0 flex-col gap-0.5 border-r border-border-default p-2", children: SHORTCUTS.map((s) => /* @__PURE__ */ jsx6(
+          /* @__PURE__ */ jsx7("div", { className: "flex w-44 shrink-0 flex-col gap-0.5 border-r border-border-default p-2", children: SHORTCUTS.map((s) => /* @__PURE__ */ jsx7(
             "button",
             {
               type: "button",
@@ -784,28 +808,28 @@ function DateRangeFilter({
             },
             s
           )) }),
-          /* @__PURE__ */ jsxs5("div", { className: "flex flex-col p-4", children: [
-            /* @__PURE__ */ jsxs5("div", { className: "flex items-end gap-3", children: [
-              /* @__PURE__ */ jsx6(Field, { label: "Start Date", value: start ? fmt(start) : "\u2014" }),
-              /* @__PURE__ */ jsx6("span", { className: "pb-2.5 text-text-tertiary", children: "\u2014" }),
-              /* @__PURE__ */ jsx6(Field, { label: "End Date", value: end ? fmt(end) : start ? fmt(start) : "\u2014" })
+          /* @__PURE__ */ jsxs6("div", { className: "flex flex-col p-4", children: [
+            /* @__PURE__ */ jsxs6("div", { className: "flex items-end gap-3", children: [
+              /* @__PURE__ */ jsx7(Field, { label: "Start Date", value: start ? fmt(start) : "\u2014" }),
+              /* @__PURE__ */ jsx7("span", { className: "pb-2.5 text-text-tertiary", children: "\u2014" }),
+              /* @__PURE__ */ jsx7(Field, { label: "End Date", value: end ? fmt(end) : start ? fmt(start) : "\u2014" })
             ] }),
-            /* @__PURE__ */ jsx6("div", { className: "my-4 border-t border-border-default" }),
-            /* @__PURE__ */ jsx6("div", { className: "flex gap-8", children: [0, 1].map((offset) => {
+            /* @__PURE__ */ jsx7("div", { className: "my-4 border-t border-border-default" }),
+            /* @__PURE__ */ jsx7("div", { className: "flex gap-8", children: [0, 1].map((offset) => {
               const m = addMonths(leftMonth, offset);
               const grid = monthGrid(m.getFullYear(), m.getMonth());
-              return /* @__PURE__ */ jsxs5("div", { className: "w-[252px]", children: [
-                /* @__PURE__ */ jsxs5("div", { className: "mb-2 flex items-center justify-between", children: [
-                  offset === 0 ? /* @__PURE__ */ jsx6(NavBtn, { onClick: () => setLeftMonth(addMonths(leftMonth, -1)), "aria-label": "Previous month", children: /* @__PURE__ */ jsx6(ChevronLeft, { size: 16 }) }) : /* @__PURE__ */ jsx6("span", { className: "h-7 w-7" }),
-                  /* @__PURE__ */ jsxs5("span", { className: "text-[15px] font-semibold text-text-primary", children: [
+              return /* @__PURE__ */ jsxs6("div", { className: "w-[252px]", children: [
+                /* @__PURE__ */ jsxs6("div", { className: "mb-2 flex items-center justify-between", children: [
+                  offset === 0 ? /* @__PURE__ */ jsx7(NavBtn, { onClick: () => setLeftMonth(addMonths(leftMonth, -1)), "aria-label": "Previous month", children: /* @__PURE__ */ jsx7(ChevronLeft, { size: 16 }) }) : /* @__PURE__ */ jsx7("span", { className: "h-7 w-7" }),
+                  /* @__PURE__ */ jsxs6("span", { className: "text-[15px] font-semibold text-text-primary", children: [
                     MONTHS[m.getMonth()],
                     " ",
                     m.getFullYear()
                   ] }),
-                  offset === 1 ? /* @__PURE__ */ jsx6(NavBtn, { onClick: () => setLeftMonth(addMonths(leftMonth, 1)), "aria-label": "Next month", children: /* @__PURE__ */ jsx6(ChevronRight, { size: 16 }) }) : /* @__PURE__ */ jsx6("span", { className: "h-7 w-7" })
+                  offset === 1 ? /* @__PURE__ */ jsx7(NavBtn, { onClick: () => setLeftMonth(addMonths(leftMonth, 1)), "aria-label": "Next month", children: /* @__PURE__ */ jsx7(ChevronRight, { size: 16 }) }) : /* @__PURE__ */ jsx7("span", { className: "h-7 w-7" })
                 ] }),
-                /* @__PURE__ */ jsxs5("div", { className: "grid grid-cols-7", children: [
-                  WEEKDAYS.map((w) => /* @__PURE__ */ jsx6("div", { className: "flex h-8 items-center justify-center text-[12px] font-semibold text-text-secondary", children: w }, w)),
+                /* @__PURE__ */ jsxs6("div", { className: "grid grid-cols-7", children: [
+                  WEEKDAYS.map((w) => /* @__PURE__ */ jsx7("div", { className: "flex h-8 items-center justify-center text-[12px] font-semibold text-text-secondary", children: w }, w)),
                   grid.map((d, i) => {
                     const inMonth = d.getMonth() === m.getMonth();
                     const hasRange = !!(start && end);
@@ -820,9 +844,9 @@ function DateRangeFilter({
                       else if (end && isEnd) band = "left-0 right-1/2";
                       else band = "left-0 right-0";
                     }
-                    return /* @__PURE__ */ jsxs5("button", { type: "button", onClick: () => pickDay(d), className: "relative flex h-9 items-center justify-center", children: [
-                      band && /* @__PURE__ */ jsx6("span", { className: `absolute inset-y-[3px] bg-ai-tint ${band}`, "aria-hidden": "true" }),
-                      /* @__PURE__ */ jsx6(
+                    return /* @__PURE__ */ jsxs6("button", { type: "button", onClick: () => pickDay(d), className: "relative flex h-9 items-center justify-center", children: [
+                      band && /* @__PURE__ */ jsx7("span", { className: `absolute inset-y-[3px] bg-ai-tint ${band}`, "aria-hidden": "true" }),
+                      /* @__PURE__ */ jsx7(
                         "span",
                         {
                           className: `relative z-10 flex h-8 w-8 items-center justify-center rounded-full text-[13px] tabular-nums ${endpoint ? "bg-brand-primaryAction font-semibold text-white" : inMonth ? "text-text-primary hover:bg-subtle" : "text-text-tertiary"}`,
@@ -834,9 +858,9 @@ function DateRangeFilter({
                 ] })
               ] }, offset);
             }) }),
-            /* @__PURE__ */ jsxs5("div", { className: "mt-4 flex justify-end gap-2", children: [
-              /* @__PURE__ */ jsx6("button", { type: "button", "data-testid": testIdPrefix && `${testIdPrefix}-cancel`, onClick: () => setOpen(false), className: "rounded-control border border-border-default bg-surface px-5 py-2 text-[13px] font-semibold text-text-primary transition-colors hover:bg-subtle", children: "Cancel" }),
-              /* @__PURE__ */ jsx6("button", { type: "button", "data-testid": testIdPrefix && `${testIdPrefix}-apply`, onClick: apply, className: "rounded-control bg-brand-primaryAction px-5 py-2 text-[13px] font-semibold text-white transition-[filter] hover:brightness-110", children: "Apply" })
+            /* @__PURE__ */ jsxs6("div", { className: "mt-4 flex justify-end gap-2", children: [
+              /* @__PURE__ */ jsx7("button", { type: "button", "data-testid": testIdPrefix && `${testIdPrefix}-cancel`, onClick: () => setOpen(false), className: "rounded-control border border-border-default bg-surface px-5 py-2 text-[13px] font-semibold text-text-primary transition-colors hover:bg-subtle", children: "Cancel" }),
+              /* @__PURE__ */ jsx7("button", { type: "button", "data-testid": testIdPrefix && `${testIdPrefix}-apply`, onClick: apply, className: "rounded-control bg-brand-primaryAction px-5 py-2 text-[13px] font-semibold text-white transition-[filter] hover:brightness-110", children: "Apply" })
             ] })
           ] })
         ]
@@ -845,19 +869,19 @@ function DateRangeFilter({
   ] });
 }
 function Field({ label, value }) {
-  return /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-1.5", children: [
-    /* @__PURE__ */ jsx6("span", { className: "text-[12px] font-medium text-text-secondary", children: label }),
-    /* @__PURE__ */ jsx6("div", { className: "flex h-10 min-w-[140px] items-center rounded-control border border-border-default bg-input px-3 text-[14px] font-medium text-text-primary", children: value })
+  return /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-1.5", children: [
+    /* @__PURE__ */ jsx7("span", { className: "text-[12px] font-medium text-text-secondary", children: label }),
+    /* @__PURE__ */ jsx7("div", { className: "flex h-10 min-w-[140px] items-center rounded-control border border-border-default bg-input px-3 text-[14px] font-medium text-text-primary", children: value })
   ] });
 }
 function NavBtn({ children, onClick, ...rest }) {
-  return /* @__PURE__ */ jsx6("button", { type: "button", onClick, className: "flex h-7 w-7 items-center justify-center rounded-full text-text-secondary transition-colors hover:bg-subtle hover:text-text-primary", ...rest, children });
+  return /* @__PURE__ */ jsx7("button", { type: "button", onClick, className: "flex h-7 w-7 items-center justify-center rounded-full text-text-secondary transition-colors hover:bg-subtle hover:text-text-primary", ...rest, children });
 }
 
 // src/SearchBar.tsx
 import { useEffect as useEffect4, useRef as useRef4, useState as useState4 } from "react";
 import { AlertCircle, Check as Check3, ChevronDown as ChevronDown3, Search as Search3 } from "lucide-react";
-import { Fragment as Fragment3, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
 var DEFAULT_SEARCH_MATCH = { mode: "anyWord", wordJoin: "Or" };
 var MODE_LABEL = {
   anyWord: "Any Word",
@@ -894,7 +918,7 @@ function SearchBar({
     };
   }, [open]);
   const showMatch = variant === "filterable" && matchValue;
-  return /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsxs7(
     "div",
     {
       className: cx2(
@@ -902,9 +926,9 @@ function SearchBar({
         className
       ),
       children: [
-        /* @__PURE__ */ jsxs6("label", { className: "flex min-w-0 flex-1 items-center gap-2 px-2.5", children: [
-          /* @__PURE__ */ jsx7(Search3, { size: 15, "aria-hidden": "true", className: "shrink-0 text-text-tertiary" }),
-          /* @__PURE__ */ jsx7(
+        /* @__PURE__ */ jsxs7("label", { className: "flex min-w-0 flex-1 items-center gap-2 px-2.5", children: [
+          /* @__PURE__ */ jsx8(Search3, { size: 15, "aria-hidden": "true", className: "shrink-0 text-text-tertiary" }),
+          /* @__PURE__ */ jsx8(
             "input",
             {
               type: "text",
@@ -928,8 +952,8 @@ function SearchBar({
         // token package (insights-studio-prototype's own src/index.css;
         // mr-clientapps' own tailwind.config.ts `colors.border.DEFAULT`) --
         // an alias this shared component can't rely on existing.
-        /* @__PURE__ */ jsxs6("div", { className: "relative shrink-0 border-l border-border-default", ref, children: [
-          /* @__PURE__ */ jsxs6(
+        /* @__PURE__ */ jsxs7("div", { className: "relative shrink-0 border-l border-border-default", ref, children: [
+          /* @__PURE__ */ jsxs7(
             "button",
             {
               type: "button",
@@ -940,7 +964,7 @@ function SearchBar({
               className: "flex h-full items-center gap-1 px-2.5 text-[13px] font-medium text-text-primary transition-colors hover:bg-subtle",
               children: [
                 matchValue.mode === "anyWord" ? `${MODE_LABEL.anyWord} (${matchValue.wordJoin})` : MODE_LABEL[matchValue.mode],
-                /* @__PURE__ */ jsx7(
+                /* @__PURE__ */ jsx8(
                   ChevronDown3,
                   {
                     size: 14,
@@ -951,25 +975,25 @@ function SearchBar({
               ]
             }
           ),
-          open && /* @__PURE__ */ jsx7(
+          open && /* @__PURE__ */ jsx8(
             "div",
             {
               role: "dialog",
               "aria-label": "Search match type",
               "data-testid": testIdPrefix && `${testIdPrefix}-mode-popover`,
               className: "absolute right-0 top-[calc(100%+8px)] z-50 w-[400px] rounded-card border border-border-default bg-surface p-3 shadow-overlay",
-              children: /* @__PURE__ */ jsxs6("div", { role: "radiogroup", "aria-label": "Search match type", className: "flex flex-col", children: [
-                /* @__PURE__ */ jsx7(
+              children: /* @__PURE__ */ jsxs7("div", { role: "radiogroup", "aria-label": "Search match type", className: "flex flex-col", children: [
+                /* @__PURE__ */ jsx8(
                   ModeRow,
                   {
                     title: "Any Word Text Search",
                     selected: matchValue.mode === "anyWord",
                     onSelect: () => onMatchChange?.({ mode: "anyWord", wordJoin: matchValue.wordJoin }),
                     testId: testIdPrefix && `${testIdPrefix}-mode-anyWord`,
-                    description: /* @__PURE__ */ jsx7(Fragment3, { children: "Find creatives that contain your keyword(s) using an \u201COr\u201D (match any) or \u201CAnd\u201D (match all) conditional in any order." }),
+                    description: /* @__PURE__ */ jsx8(Fragment3, { children: "Find creatives that contain your keyword(s) using an \u201COr\u201D (match any) or \u201CAnd\u201D (match all) conditional in any order." }),
                     infoText: "The Or/And choice applies only when Any Word is the active search mode.",
-                    extra: /* @__PURE__ */ jsxs6("span", { className: "flex items-center gap-3", children: [
-                      /* @__PURE__ */ jsx7(
+                    extra: /* @__PURE__ */ jsxs7("span", { className: "flex items-center gap-3", children: [
+                      /* @__PURE__ */ jsx8(
                         RadioOption,
                         {
                           label: "Or",
@@ -978,7 +1002,7 @@ function SearchBar({
                           testId: testIdPrefix && `${testIdPrefix}-word-join-or`
                         }
                       ),
-                      /* @__PURE__ */ jsx7(
+                      /* @__PURE__ */ jsx8(
                         RadioOption,
                         {
                           label: "And",
@@ -990,8 +1014,8 @@ function SearchBar({
                     ] })
                   }
                 ),
-                /* @__PURE__ */ jsx7(Divider, {}),
-                /* @__PURE__ */ jsx7(
+                /* @__PURE__ */ jsx8(Divider, {}),
+                /* @__PURE__ */ jsx8(
                   ModeRow,
                   {
                     title: "Exact Match Text Search",
@@ -1002,8 +1026,8 @@ function SearchBar({
                     infoText: "Keywords are matched as a single contiguous phrase, in the order you typed them."
                   }
                 ),
-                /* @__PURE__ */ jsx7(Divider, {}),
-                /* @__PURE__ */ jsx7(
+                /* @__PURE__ */ jsx8(Divider, {}),
+                /* @__PURE__ */ jsx8(
                   ModeRow,
                   {
                     title: "Contextual Search",
@@ -1015,8 +1039,8 @@ function SearchBar({
                     infoText: "Uses semantic matching, so results can include related terms even when the exact keyword isn't present."
                   }
                 ),
-                /* @__PURE__ */ jsx7(Divider, {}),
-                /* @__PURE__ */ jsx7(
+                /* @__PURE__ */ jsx8(Divider, {}),
+                /* @__PURE__ */ jsx8(
                   ModeRow,
                   {
                     title: "Ad Code Search",
@@ -1036,7 +1060,7 @@ function SearchBar({
   );
 }
 function Divider() {
-  return /* @__PURE__ */ jsx7("div", { className: "my-2.5 border-t border-border-default", "aria-hidden": "true" });
+  return /* @__PURE__ */ jsx8("div", { className: "my-2.5 border-t border-border-default", "aria-hidden": "true" });
 }
 function ModeRow({
   title,
@@ -1048,7 +1072,7 @@ function ModeRow({
   onSelect,
   testId
 }) {
-  return /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsxs7(
     "div",
     {
       role: "radio",
@@ -1064,18 +1088,18 @@ function ModeRow({
       },
       className: "flex cursor-pointer flex-col items-stretch gap-1 rounded-control p-1.5 text-left transition-colors hover:bg-subtle focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-border-focus",
       children: [
-        /* @__PURE__ */ jsxs6("div", { className: "flex items-center justify-between gap-2", children: [
-          /* @__PURE__ */ jsxs6("div", { className: "flex flex-wrap items-center gap-3", children: [
-            /* @__PURE__ */ jsxs6("span", { className: "flex items-center gap-1", children: [
-              /* @__PURE__ */ jsx7("span", { className: "text-[14px] font-semibold text-text-primary", children: title }),
-              /* @__PURE__ */ jsx7(RowInfoTip, { text: infoText })
+        /* @__PURE__ */ jsxs7("div", { className: "flex items-center justify-between gap-2", children: [
+          /* @__PURE__ */ jsxs7("div", { className: "flex flex-wrap items-center gap-3", children: [
+            /* @__PURE__ */ jsxs7("span", { className: "flex items-center gap-1", children: [
+              /* @__PURE__ */ jsx8("span", { className: "text-[14px] font-semibold text-text-primary", children: title }),
+              /* @__PURE__ */ jsx8(RowInfoTip, { text: infoText })
             ] }),
-            badge && /* @__PURE__ */ jsx7("span", { className: "rounded-full bg-subtle px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide text-text-secondary", children: badge }),
+            badge && /* @__PURE__ */ jsx8("span", { className: "rounded-full bg-subtle px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide text-text-secondary", children: badge }),
             extra
           ] }),
-          selected && /* @__PURE__ */ jsx7(Check3, { size: 16, strokeWidth: 2.5, "aria-hidden": "true", className: "shrink-0 text-brand-primaryAction" })
+          selected && /* @__PURE__ */ jsx8(Check3, { size: 16, strokeWidth: 2.5, "aria-hidden": "true", className: "shrink-0 text-brand-primaryAction" })
         ] }),
-        /* @__PURE__ */ jsx7("span", { className: "block text-[12.5px] leading-snug text-text-secondary", children: description })
+        /* @__PURE__ */ jsx8("span", { className: "block text-[12.5px] leading-snug text-text-secondary", children: description })
       ]
     }
   );
@@ -1086,7 +1110,7 @@ function RadioOption({
   onSelect,
   testId
 }) {
-  return /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsxs7(
     "button",
     {
       type: "button",
@@ -1099,14 +1123,14 @@ function RadioOption({
       "aria-checked": checked,
       className: "flex items-center gap-1.5 text-[13px] font-medium text-text-primary",
       children: [
-        /* @__PURE__ */ jsx7(
+        /* @__PURE__ */ jsx8(
           "span",
           {
             className: cx2(
               "flex h-4 w-4 shrink-0 items-center justify-center rounded-full border-2 transition-colors",
               checked ? "border-brand-primaryAction" : "border-border-interactive"
             ),
-            children: checked && /* @__PURE__ */ jsx7("span", { className: "h-2 w-2 rounded-full bg-brand-primaryAction" })
+            children: checked && /* @__PURE__ */ jsx8("span", { className: "h-2 w-2 rounded-full bg-brand-primaryAction" })
           }
         ),
         label
@@ -1125,8 +1149,8 @@ function RowInfoTip({ text }) {
     window.addEventListener("mousedown", onDown);
     return () => window.removeEventListener("mousedown", onDown);
   }, [open]);
-  return /* @__PURE__ */ jsxs6("span", { className: "relative inline-flex shrink-0 items-center", ref, children: [
-    /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsxs7("span", { className: "relative inline-flex shrink-0 items-center", ref, children: [
+    /* @__PURE__ */ jsx8(
       "button",
       {
         type: "button",
@@ -1137,10 +1161,10 @@ function RowInfoTip({ text }) {
         "aria-label": "More information",
         "aria-expanded": open,
         className: "inline-flex text-text-tertiary transition-colors hover:text-text-primary",
-        children: /* @__PURE__ */ jsx7(AlertCircle, { size: 13, "aria-hidden": "true" })
+        children: /* @__PURE__ */ jsx8(AlertCircle, { size: 13, "aria-hidden": "true" })
       }
     ),
-    open && /* @__PURE__ */ jsx7(
+    open && /* @__PURE__ */ jsx8(
       "span",
       {
         role: "tooltip",
@@ -1154,7 +1178,7 @@ function RowInfoTip({ text }) {
 // src/SectionRail.tsx
 import { useRef as useRef5 } from "react";
 import { ChevronLeft as ChevronLeft2, ChevronRight as ChevronRight2 } from "lucide-react";
-import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
 function SectionRail({
   title,
   titleSerif,
@@ -1167,20 +1191,20 @@ function SectionRail({
   const scroll = (direction) => {
     scrollRef.current?.scrollBy({ left: direction * 320, behavior: "smooth" });
   };
-  return /* @__PURE__ */ jsxs7("section", { className: "flex flex-col gap-4", children: [
-    /* @__PURE__ */ jsxs7("header", { className: "flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between", children: [
-      /* @__PURE__ */ jsxs7("div", { children: [
-        /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsxs8("section", { className: "flex flex-col gap-4", children: [
+    /* @__PURE__ */ jsxs8("header", { className: "flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between", children: [
+      /* @__PURE__ */ jsxs8("div", { children: [
+        /* @__PURE__ */ jsx9(
           "h2",
           {
             className: titleSerif ? "font-serif text-2xl font-normal tracking-tight text-text-primary sm:text-[28px]" : "text-xl font-medium tracking-tight text-text-primary sm:text-2xl",
             children: title
           }
         ),
-        /* @__PURE__ */ jsx8("p", { className: "mt-1 text-sm text-text-secondary", children: subtitle })
+        /* @__PURE__ */ jsx9("p", { className: "mt-1 text-sm text-text-secondary", children: subtitle })
       ] }),
-      /* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-2", children: [
-        viewAllLabel && viewAllHref && /* @__PURE__ */ jsxs7(
+      /* @__PURE__ */ jsxs8("div", { className: "flex items-center gap-2", children: [
+        viewAllLabel && viewAllHref && /* @__PURE__ */ jsxs8(
           "a",
           {
             href: viewAllHref,
@@ -1191,29 +1215,29 @@ function SectionRail({
             ]
           }
         ),
-        /* @__PURE__ */ jsx8(
+        /* @__PURE__ */ jsx9(
           "button",
           {
             type: "button",
             onClick: () => scroll(-1),
             "aria-label": "Previous",
             className: "hidden h-10 w-10 items-center justify-center rounded-control border border-border-default text-text-secondary transition-colors hover:bg-subtle hover:text-text-primary sm:flex lg:hidden",
-            children: /* @__PURE__ */ jsx8(ChevronLeft2, { size: 16 })
+            children: /* @__PURE__ */ jsx9(ChevronLeft2, { size: 16 })
           }
         ),
-        /* @__PURE__ */ jsx8(
+        /* @__PURE__ */ jsx9(
           "button",
           {
             type: "button",
             onClick: () => scroll(1),
             "aria-label": "Next",
             className: "hidden h-10 w-10 items-center justify-center rounded-control border border-border-default text-text-secondary transition-colors hover:bg-subtle hover:text-text-primary sm:flex lg:hidden",
-            children: /* @__PURE__ */ jsx8(ChevronRight2, { size: 16 })
+            children: /* @__PURE__ */ jsx9(ChevronRight2, { size: 16 })
           }
         )
       ] })
     ] }),
-    /* @__PURE__ */ jsx8(
+    /* @__PURE__ */ jsx9(
       "div",
       {
         ref: scrollRef,
@@ -1227,7 +1251,7 @@ function SectionRail({
 // src/DataScopeFilter.tsx
 import { useEffect as useEffect5, useRef as useRef6, useState as useState5 } from "react";
 import { Check as Check4, ChevronDown as ChevronDown4 } from "lucide-react";
-import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
 var FINAL_ONLY_TEXT = "Trims time periods to data that has finalized across the selected media formats. Some formats (e.g. Network TV and Cinema) finalize later, so the most recent periods may still change. Turn on for stable, report-ready numbers.";
 function cx3(...classes) {
   return classes.filter(Boolean).join(" ");
@@ -1253,8 +1277,8 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
     onChange(v);
     setOpen(false);
   };
-  return /* @__PURE__ */ jsxs8("div", { className: "relative", ref, children: [
-    /* @__PURE__ */ jsxs8(
+  return /* @__PURE__ */ jsxs9("div", { className: "relative", ref, children: [
+    /* @__PURE__ */ jsxs9(
       "button",
       {
         type: "button",
@@ -1263,11 +1287,11 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
         "aria-haspopup": "listbox",
         className: "flex h-11 items-center gap-2 rounded-control border border-border-strong bg-input px-2.5 text-text-secondary transition-colors hover:bg-subtle hover:text-text-primary focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-border-focus",
         children: [
-          /* @__PURE__ */ jsxs8("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
-            /* @__PURE__ */ jsx9("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: "Data" }),
-            /* @__PURE__ */ jsx9("span", { className: "text-[12px] font-medium text-text-primary", children: display })
+          /* @__PURE__ */ jsxs9("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
+            /* @__PURE__ */ jsx10("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: "Data" }),
+            /* @__PURE__ */ jsx10("span", { className: "text-[12px] font-medium text-text-primary", children: display })
           ] }),
-          /* @__PURE__ */ jsx9(
+          /* @__PURE__ */ jsx10(
             ChevronDown4,
             {
               size: 14,
@@ -1278,7 +1302,7 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
         ]
       }
     ),
-    open && /* @__PURE__ */ jsxs8(
+    open && /* @__PURE__ */ jsxs9(
       "div",
       {
         role: "listbox",
@@ -1288,8 +1312,8 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
           align === "right" ? "right-0" : "left-0"
         ),
         children: [
-          /* @__PURE__ */ jsx9(Option, { label: "All", selected: !value, onClick: () => choose(false) }),
-          /* @__PURE__ */ jsx9(Option, { label: "Final only", selected: value, onClick: () => choose(true), hint: FINAL_ONLY_TEXT })
+          /* @__PURE__ */ jsx10(Option, { label: "All", selected: !value, onClick: () => choose(false) }),
+          /* @__PURE__ */ jsx10(Option, { label: "Final only", selected: value, onClick: () => choose(true), hint: FINAL_ONLY_TEXT })
         ]
       }
     )
@@ -1301,7 +1325,7 @@ function Option({
   onClick,
   hint
 }) {
-  const option = /* @__PURE__ */ jsxs8(
+  const option = /* @__PURE__ */ jsxs9(
     "button",
     {
       type: "button",
@@ -1314,15 +1338,15 @@ function Option({
         selected ? "font-semibold text-text-primary" : "text-text-secondary"
       ),
       children: [
-        /* @__PURE__ */ jsx9(Check4, { size: 14, "aria-hidden": "true", className: cx3("shrink-0 text-brand-primaryAction", !selected && "invisible") }),
+        /* @__PURE__ */ jsx10(Check4, { size: 14, "aria-hidden": "true", className: cx3("shrink-0 text-brand-primaryAction", !selected && "invisible") }),
         label
       ]
     }
   );
   if (!hint) return option;
-  return /* @__PURE__ */ jsxs8("div", { className: "flex items-center pr-2.5", children: [
+  return /* @__PURE__ */ jsxs9("div", { className: "flex items-center pr-2.5", children: [
     option,
-    /* @__PURE__ */ jsx9(InfoTip, { text: hint, trigger: "hover", label: `About ${label}` })
+    /* @__PURE__ */ jsx10(InfoTip, { text: hint, trigger: "hover", label: `About ${label}` })
   ] });
 }
 
@@ -1330,7 +1354,7 @@ function Option({
 import { useCallback as useCallback2, useEffect as useEffect6, useLayoutEffect, useRef as useRef7, useState as useState6 } from "react";
 import { createPortal as createPortal2 } from "react-dom";
 import { Check as Check5, ChevronDown as ChevronDown5 } from "lucide-react";
-import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
 function cx4(...classes) {
   return classes.filter(Boolean).join(" ");
 }
@@ -1380,8 +1404,8 @@ function SelectFilter({
       window.removeEventListener("scroll", reposition, true);
     };
   }, [open, close, reposition]);
-  return /* @__PURE__ */ jsxs9("div", { className: cx4("relative", fullWidth && "w-full"), ref, children: [
-    /* @__PURE__ */ jsxs9(
+  return /* @__PURE__ */ jsxs10("div", { className: cx4("relative", fullWidth && "w-full"), ref, children: [
+    /* @__PURE__ */ jsxs10(
       "button",
       {
         type: "button",
@@ -1395,11 +1419,11 @@ function SelectFilter({
           className
         ),
         children: [
-          /* @__PURE__ */ jsxs9("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
-            /* @__PURE__ */ jsx10("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: caption }),
-            /* @__PURE__ */ jsx10("span", { className: "text-[12px] font-medium text-text-primary", children: value })
+          /* @__PURE__ */ jsxs10("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
+            /* @__PURE__ */ jsx11("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: caption }),
+            /* @__PURE__ */ jsx11("span", { className: "text-[12px] font-medium text-text-primary", children: value })
           ] }),
-          /* @__PURE__ */ jsx10(
+          /* @__PURE__ */ jsx11(
             ChevronDown5,
             {
               size: 14,
@@ -1411,7 +1435,7 @@ function SelectFilter({
       }
     ),
     open && pos && createPortal2(
-      /* @__PURE__ */ jsx10(
+      /* @__PURE__ */ jsx11(
         "div",
         {
           ref: popoverRef,
@@ -1423,9 +1447,9 @@ function SelectFilter({
           ),
           role: "listbox",
           "aria-label": caption,
-          children: /* @__PURE__ */ jsx10("div", { className: "max-h-[280px] overflow-y-auto p-1", children: options.map((o) => {
+          children: /* @__PURE__ */ jsx11("div", { className: "max-h-[280px] overflow-y-auto p-1", children: options.map((o) => {
             const selected = o === value;
-            return /* @__PURE__ */ jsxs9(
+            return /* @__PURE__ */ jsxs10(
               "button",
               {
                 type: "button",
@@ -1438,8 +1462,8 @@ function SelectFilter({
                 },
                 className: "flex w-full items-center gap-2.5 rounded-control px-2 py-2 text-left transition-colors hover:bg-subtle",
                 children: [
-                  /* @__PURE__ */ jsx10("span", { className: "flex h-4 w-4 shrink-0 items-center justify-center text-brand-primaryAction", children: selected && /* @__PURE__ */ jsx10(Check5, { size: 15, strokeWidth: 3 }) }),
-                  /* @__PURE__ */ jsx10(
+                  /* @__PURE__ */ jsx11("span", { className: "flex h-4 w-4 shrink-0 items-center justify-center text-brand-primaryAction", children: selected && /* @__PURE__ */ jsx11(Check5, { size: 15, strokeWidth: 3 }) }),
+                  /* @__PURE__ */ jsx11(
                     "span",
                     {
                       className: cx4("flex-1 text-[14px]", selected ? "font-semibold text-text-primary" : "text-text-primary"),
@@ -1460,9 +1484,9 @@ function SelectFilter({
 
 // src/Card.tsx
 import { forwardRef } from "react";
-import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
 var Card = forwardRef(function Card2({ staticCard, title, subtitle, action, className, children, ...rest }, ref) {
-  return /* @__PURE__ */ jsx11(
+  return /* @__PURE__ */ jsx12(
     "article",
     {
       ref,
@@ -1473,15 +1497,15 @@ var Card = forwardRef(function Card2({ staticCard, title, subtitle, action, clas
         className
       ].filter(Boolean).join(" "),
       ...rest,
-      children: title ? /* @__PURE__ */ jsxs10("div", { className: "flex flex-1 flex-col p-card-padding", children: [
-        /* @__PURE__ */ jsxs10("div", { className: "flex items-start justify-between gap-2", children: [
-          /* @__PURE__ */ jsxs10("div", { children: [
-            /* @__PURE__ */ jsx11("h3", { className: "text-[15px] font-semibold leading-snug text-text-primary", children: title }),
-            subtitle && /* @__PURE__ */ jsx11("p", { className: "mt-0.5 text-[12px] leading-snug text-text-tertiary", children: subtitle })
+      children: title ? /* @__PURE__ */ jsxs11("div", { className: "flex flex-1 flex-col p-card-padding", children: [
+        /* @__PURE__ */ jsxs11("div", { className: "flex items-start justify-between gap-2", children: [
+          /* @__PURE__ */ jsxs11("div", { children: [
+            /* @__PURE__ */ jsx12("h3", { className: "text-[15px] font-semibold leading-snug text-text-primary", children: title }),
+            subtitle && /* @__PURE__ */ jsx12("p", { className: "mt-0.5 text-[12px] leading-snug text-text-tertiary", children: subtitle })
           ] }),
-          action && /* @__PURE__ */ jsx11("div", { className: "shrink-0 text-text-tertiary", children: action })
+          action && /* @__PURE__ */ jsx12("div", { className: "shrink-0 text-text-tertiary", children: action })
         ] }),
-        /* @__PURE__ */ jsx11("div", { className: "mt-4 flex flex-1 flex-col", children })
+        /* @__PURE__ */ jsx12("div", { className: "mt-4 flex flex-1 flex-col", children })
       ] }) : children
     }
   );
@@ -1489,7 +1513,7 @@ var Card = forwardRef(function Card2({ staticCard, title, subtitle, action, clas
 
 // src/NoResultsEmptyState.tsx
 import { FilterX } from "lucide-react";
-import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
 var NO_RESULTS_TITLE = "No results match your filters";
 var NO_RESULTS_BODY = "Your filters may be too narrow, conflict with each other, or have no activity in this period.";
 function noResultsBody(workspaceName) {
@@ -1511,12 +1535,12 @@ function NoResultsEmptyState({
   const showClear = hasFilters !== false && Boolean(onClearFilters);
   const showEdit = Boolean(onEditFilters);
   const hasActions = showClear || showEdit || Boolean(actions && actions.length > 0);
-  return /* @__PURE__ */ jsxs11("div", { className: "flex flex-col items-center justify-center gap-3 text-center", "data-testid": testIdPrefix, children: [
-    /* @__PURE__ */ jsx12("span", { className: "flex h-11 w-11 items-center justify-center rounded-full bg-subtle text-text-tertiary", children: /* @__PURE__ */ jsx12(FilterX, { size: 20, "aria-hidden": "true" }) }),
-    /* @__PURE__ */ jsx12("h2", { className: "text-base font-semibold text-text-primary", children: title }),
-    /* @__PURE__ */ jsx12("p", { className: "max-w-[420px] text-[13px] leading-relaxed text-text-secondary", children: bodyText }),
-    hasActions && /* @__PURE__ */ jsxs11("div", { className: "mt-1 flex flex-col items-center gap-3", children: [
-      showClear && /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsxs12("div", { className: "flex flex-col items-center justify-center gap-3 text-center", "data-testid": testIdPrefix, children: [
+    /* @__PURE__ */ jsx13("span", { className: "flex h-11 w-11 items-center justify-center rounded-full bg-subtle text-text-tertiary", children: /* @__PURE__ */ jsx13(FilterX, { size: 20, "aria-hidden": "true" }) }),
+    /* @__PURE__ */ jsx13("h2", { className: "text-base font-semibold text-text-primary", children: title }),
+    /* @__PURE__ */ jsx13("p", { className: "max-w-[420px] text-[13px] leading-relaxed text-text-secondary", children: bodyText }),
+    hasActions && /* @__PURE__ */ jsxs12("div", { className: "mt-1 flex flex-col items-center gap-3", children: [
+      showClear && /* @__PURE__ */ jsx13(
         "button",
         {
           type: "button",
@@ -1526,7 +1550,7 @@ function NoResultsEmptyState({
           children: "Clear all filters"
         }
       ),
-      showEdit && /* @__PURE__ */ jsx12(
+      showEdit && /* @__PURE__ */ jsx13(
         "button",
         {
           type: "button",
@@ -1536,7 +1560,7 @@ function NoResultsEmptyState({
           children: "Edit filters"
         }
       ),
-      actions?.map((action, i) => /* @__PURE__ */ jsx12(
+      actions?.map((action, i) => /* @__PURE__ */ jsx13(
         "button",
         {
           type: "button",
@@ -1553,12 +1577,12 @@ function NoResultsEmptyState({
 // src/WorkspaceSelectedCard.tsx
 import { useEffect as useEffect7, useRef as useRef8, useState as useState7 } from "react";
 import { ChevronDown as ChevronDown6, X as X2 } from "lucide-react";
-import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
 function cx5(...parts) {
   return parts.filter(Boolean).join(" ");
 }
 function WorkspaceSelectedCard({ groups, testIdPrefix }) {
-  return /* @__PURE__ */ jsx13("aside", { className: "sticky top-4 flex min-w-0 flex-col gap-4 self-start rounded-card border border-border-default bg-surface px-5 pb-5 pt-4 shadow-raised sm:px-6 sm:pb-6", children: /* @__PURE__ */ jsx13("div", { className: "flex flex-col divide-y divide-border-default", children: groups.map((g) => /* @__PURE__ */ jsx13(SummaryGroupItem, { group: g, testIdPrefix }, g.id)) }) });
+  return /* @__PURE__ */ jsx14("aside", { className: "sticky top-4 flex min-w-0 flex-col gap-4 self-start rounded-card border border-border-default bg-surface px-5 pb-5 pt-4 shadow-raised sm:px-6 sm:pb-6", children: /* @__PURE__ */ jsx14("div", { className: "flex flex-col divide-y divide-border-default", children: groups.map((g) => /* @__PURE__ */ jsx14(SummaryGroupItem, { group: g, testIdPrefix }, g.id)) }) });
 }
 function SummaryGroupItem({
   group,
@@ -1575,8 +1599,8 @@ function SummaryGroupItem({
     else if (expandCount === 0) setOpen(false);
     wasEmpty.current = expandCount === 0;
   }, [expandCount]);
-  return /* @__PURE__ */ jsxs12("div", { className: nested ? "" : "py-3 first:pt-0 last:pb-0", children: [
-    /* @__PURE__ */ jsxs12(
+  return /* @__PURE__ */ jsxs13("div", { className: nested ? "" : "py-3 first:pt-0 last:pb-0", children: [
+    /* @__PURE__ */ jsxs13(
       "button",
       {
         type: "button",
@@ -1585,7 +1609,7 @@ function SummaryGroupItem({
         "data-testid": testIdPrefix && `${testIdPrefix}-group-${group.id}`,
         className: "flex w-full min-w-0 items-center gap-2 text-left",
         children: [
-          /* @__PURE__ */ jsx13(
+          /* @__PURE__ */ jsx14(
             ChevronDown6,
             {
               size: 14,
@@ -1593,37 +1617,37 @@ function SummaryGroupItem({
               className: cx5("shrink-0 text-text-secondary transition-transform", !open && "-rotate-90")
             }
           ),
-          /* @__PURE__ */ jsx13("span", { className: cx5("truncate font-semibold text-text-primary", nested ? "text-[12px]" : "text-[13px]"), children: group.label }),
-          /* @__PURE__ */ jsx13("span", { className: "shrink-0 rounded-full bg-subtle px-1.5 py-0.5 text-[11px] font-semibold text-text-secondary", children: ownCount })
+          /* @__PURE__ */ jsx14("span", { className: cx5("truncate font-semibold text-text-primary", nested ? "text-[12px]" : "text-[13px]"), children: group.label }),
+          /* @__PURE__ */ jsx14("span", { className: "shrink-0 rounded-full bg-subtle px-1.5 py-0.5 text-[11px] font-semibold text-text-secondary", children: ownCount })
         ]
       }
     ),
-    open && /* @__PURE__ */ jsx13("div", { className: "pt-2.5", children: ownCount === 0 && subCount === 0 ? /* @__PURE__ */ jsx13("p", { className: "text-[12px] text-text-secondary", children: "Nothing selected." }) : /* @__PURE__ */ jsxs12("div", { className: "flex flex-col gap-2.5", children: [
-      ownCount > 0 && /* @__PURE__ */ jsxs12("div", { className: "flex flex-col gap-1.5", children: [
-        group.items.map((item) => /* @__PURE__ */ jsxs12(
+    open && /* @__PURE__ */ jsx14("div", { className: "pt-2.5", children: ownCount === 0 && subCount === 0 ? /* @__PURE__ */ jsx14("p", { className: "text-[12px] text-text-secondary", children: "Nothing selected." }) : /* @__PURE__ */ jsxs13("div", { className: "flex flex-col gap-2.5", children: [
+      ownCount > 0 && /* @__PURE__ */ jsxs13("div", { className: "flex flex-col gap-1.5", children: [
+        group.items.map((item) => /* @__PURE__ */ jsxs13(
           "div",
           {
             className: "flex items-center justify-between gap-2 rounded-control border border-border-default bg-canvas px-2 py-1",
             children: [
-              /* @__PURE__ */ jsxs12("span", { className: "min-w-0 flex-1", children: [
-                /* @__PURE__ */ jsx13("span", { className: "block truncate text-[12px] text-text-primary", children: item.name }),
-                item.meta && /* @__PURE__ */ jsx13("span", { className: "block truncate text-[11px] text-text-secondary", children: item.meta })
+              /* @__PURE__ */ jsxs13("span", { className: "min-w-0 flex-1", children: [
+                /* @__PURE__ */ jsx14("span", { className: "block truncate text-[12px] text-text-primary", children: item.name }),
+                item.meta && /* @__PURE__ */ jsx14("span", { className: "block truncate text-[11px] text-text-secondary", children: item.meta })
               ] }),
-              /* @__PURE__ */ jsx13(
+              /* @__PURE__ */ jsx14(
                 "button",
                 {
                   type: "button",
                   "aria-label": `Remove ${item.name}`,
                   onClick: () => group.onRemove(item.id),
                   className: "flex h-5 w-5 shrink-0 items-center justify-center rounded-control text-text-secondary hover:bg-subtle hover:text-text-danger",
-                  children: /* @__PURE__ */ jsx13(X2, { size: 12, "aria-hidden": "true" })
+                  children: /* @__PURE__ */ jsx14(X2, { size: 12, "aria-hidden": "true" })
                 }
               )
             ]
           },
           item.id
         )),
-        /* @__PURE__ */ jsx13(
+        /* @__PURE__ */ jsx14(
           "button",
           {
             type: "button",
@@ -1634,13 +1658,13 @@ function SummaryGroupItem({
           }
         )
       ] }),
-      group.subGroups?.map((sg) => /* @__PURE__ */ jsx13(SummaryGroupItem, { group: sg, nested: true, testIdPrefix }, sg.id))
+      group.subGroups?.map((sg) => /* @__PURE__ */ jsx14(SummaryGroupItem, { group: sg, nested: true, testIdPrefix }, sg.id))
     ] }) })
   ] });
 }
 
 // src/chart-placeholder-shared.tsx
-import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
 var GRID_ROWS = [0, 25, 50, 75, 100];
 var Y_TICK_WIDTHS = [26, 30, 30, 26, 20];
 var Y_AXIS_W = 48;
@@ -1652,9 +1676,9 @@ function AxisFrame({
   children
 }) {
   const gutter = xTicks > 0 ? X_AXIS_H : 0;
-  return /* @__PURE__ */ jsx14("div", { className: "w-full", style: { height }, role: "presentation", "aria-hidden": "true", children: /* @__PURE__ */ jsxs13("div", { className: "relative h-full w-full", children: [
-    /* @__PURE__ */ jsxs13("div", { className: "absolute inset-y-0 right-0", style: { left: Y_AXIS_W, bottom: gutter }, children: [
-      GRID_ROWS.map((pct) => /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx15("div", { className: "w-full", style: { height }, role: "presentation", "aria-hidden": "true", children: /* @__PURE__ */ jsxs14("div", { className: "relative h-full w-full", children: [
+    /* @__PURE__ */ jsxs14("div", { className: "absolute inset-y-0 right-0", style: { left: Y_AXIS_W, bottom: gutter }, children: [
+      GRID_ROWS.map((pct) => /* @__PURE__ */ jsx15(
         "div",
         {
           className: "absolute inset-x-0 border-t border-dashed",
@@ -1662,9 +1686,9 @@ function AxisFrame({
         },
         pct
       )),
-      /* @__PURE__ */ jsx14("div", { className: "absolute inset-0", children })
+      /* @__PURE__ */ jsx15("div", { className: "absolute inset-0", children })
     ] }),
-    /* @__PURE__ */ jsx14("div", { className: "absolute left-0 top-0", style: { width: Y_AXIS_W, bottom: gutter }, children: GRID_ROWS.map((pct, i) => /* @__PURE__ */ jsx14(
+    /* @__PURE__ */ jsx15("div", { className: "absolute left-0 top-0", style: { width: Y_AXIS_W, bottom: gutter }, children: GRID_ROWS.map((pct, i) => /* @__PURE__ */ jsx15(
       "div",
       {
         className: "absolute right-2 h-2 -translate-y-1/2 rounded-xs bg-subtle",
@@ -1672,27 +1696,27 @@ function AxisFrame({
       },
       pct
     )) }),
-    xTicks > 0 && /* @__PURE__ */ jsx14(
+    xTicks > 0 && /* @__PURE__ */ jsx15(
       "div",
       {
         className: "absolute bottom-0 right-0 flex items-center",
         style: { left: Y_AXIS_W, height: X_AXIS_H },
-        children: Array.from({ length: xTicks }, (_, i) => /* @__PURE__ */ jsx14("div", { className: "flex flex-1 justify-center", children: /* @__PURE__ */ jsx14("div", { className: "h-2 w-full max-w-[26px] rounded-xs bg-subtle" }) }, i))
+        children: Array.from({ length: xTicks }, (_, i) => /* @__PURE__ */ jsx15("div", { className: "flex flex-1 justify-center", children: /* @__PURE__ */ jsx15("div", { className: "h-2 w-full max-w-[26px] rounded-xs bg-subtle" }) }, i))
       }
     )
   ] }) });
 }
 function BlankLegend({ rows, reverse = false }) {
-  return /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx15(
     "ul",
     {
       className: `flex flex-1 justify-center gap-1.5 ${reverse ? "flex-col-reverse" : "flex-col"}`,
       role: "presentation",
       "aria-hidden": "true",
-      children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */ jsxs13("li", { className: "flex items-center justify-between gap-2", children: [
-        /* @__PURE__ */ jsxs13("span", { className: "flex items-center gap-1.5", children: [
-          /* @__PURE__ */ jsx14("span", { className: "h-2.5 w-2.5 rounded-xs bg-subtle" }),
-          /* @__PURE__ */ jsx14(
+      children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */ jsxs14("li", { className: "flex items-center justify-between gap-2", children: [
+        /* @__PURE__ */ jsxs14("span", { className: "flex items-center gap-1.5", children: [
+          /* @__PURE__ */ jsx15("span", { className: "h-2.5 w-2.5 rounded-xs bg-subtle" }),
+          /* @__PURE__ */ jsx15(
             "span",
             {
               className: "h-2 rounded-xs bg-subtle",
@@ -1700,21 +1724,21 @@ function BlankLegend({ rows, reverse = false }) {
             }
           )
         ] }),
-        /* @__PURE__ */ jsx14("span", { className: "h-2 w-6 rounded-xs bg-subtle" })
+        /* @__PURE__ */ jsx15("span", { className: "h-2 w-6 rounded-xs bg-subtle" })
       ] }, i))
     }
   );
 }
 
 // src/BarChartPlaceholder.tsx
-import { jsx as jsx15 } from "react/jsx-runtime";
+import { jsx as jsx16 } from "react/jsx-runtime";
 var BAR_PROFILE = [92, 86, 76, 65, 57, 40, 30, 24, 18, 13];
 function BarChartPlaceholder({ height = 220 }) {
-  return /* @__PURE__ */ jsx15(AxisFrame, { height, xTicks: BAR_PROFILE.length, children: /* @__PURE__ */ jsx15("div", { className: "flex h-full w-full items-end gap-2", children: BAR_PROFILE.map((pct, i) => /* @__PURE__ */ jsx15("div", { className: "flex-1 rounded-t-[3px] bg-subtle", style: { height: `${pct}%` } }, i)) }) });
+  return /* @__PURE__ */ jsx16(AxisFrame, { height, xTicks: BAR_PROFILE.length, children: /* @__PURE__ */ jsx16("div", { className: "flex h-full w-full items-end gap-2", children: BAR_PROFILE.map((pct, i) => /* @__PURE__ */ jsx16("div", { className: "flex-1 rounded-t-[3px] bg-subtle", style: { height: `${pct}%` } }, i)) }) });
 }
 
 // src/LineChartPlaceholder.tsx
-import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
 var LINE_SERIES = [
   [58, 52, 55, 41, 45, 33, 36, 25, 28, 17],
   [74, 71, 66, 68, 59, 61, 54, 56, 48, 45],
@@ -1724,9 +1748,9 @@ var LINE_SERIES = [
 var LINE_FORECAST_FROM = 7;
 function LineChartPlaceholder({ height = 280 }) {
   const toPath = (pts, from, to) => pts.slice(from, to).map((y, i) => `${(i + from) / (pts.length - 1) * 100},${y}`).join(" ");
-  return /* @__PURE__ */ jsxs14(AxisFrame, { height, xTicks: LINE_SERIES[0].length, children: [
-    /* @__PURE__ */ jsx16("svg", { viewBox: "0 0 100 100", preserveAspectRatio: "none", className: "absolute inset-0 h-full w-full", children: LINE_SERIES.map((pts, s) => /* @__PURE__ */ jsxs14("g", { children: [
-      /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsxs15(AxisFrame, { height, xTicks: LINE_SERIES[0].length, children: [
+    /* @__PURE__ */ jsx17("svg", { viewBox: "0 0 100 100", preserveAspectRatio: "none", className: "absolute inset-0 h-full w-full", children: LINE_SERIES.map((pts, s) => /* @__PURE__ */ jsxs15("g", { children: [
+      /* @__PURE__ */ jsx17(
         "polyline",
         {
           points: toPath(pts, 0, LINE_FORECAST_FROM + 1),
@@ -1738,7 +1762,7 @@ function LineChartPlaceholder({ height = 280 }) {
           strokeLinejoin: "round"
         }
       ),
-      /* @__PURE__ */ jsx16(
+      /* @__PURE__ */ jsx17(
         "polyline",
         {
           points: toPath(pts, LINE_FORECAST_FROM, pts.length),
@@ -1753,7 +1777,7 @@ function LineChartPlaceholder({ height = 280 }) {
       )
     ] }, s)) }),
     LINE_SERIES.map(
-      (pts, s) => pts.map((y, i) => /* @__PURE__ */ jsx16(
+      (pts, s) => pts.map((y, i) => /* @__PURE__ */ jsx17(
         "div",
         {
           className: "absolute h-1.5 w-1.5 -translate-x-1/2 -translate-y-1/2 rounded-full",
@@ -1770,16 +1794,16 @@ function LineChartPlaceholder({ height = 280 }) {
 }
 
 // src/PieChartPlaceholder.tsx
-import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
 var PIE_SEAMS = [0, 115, 180, 230, 262, 288, 310, 332];
 function PieChartPlaceholder({ height = 220, legendRows = 8 }) {
   const r = 45;
-  return /* @__PURE__ */ jsxs15("div", { className: "flex w-full items-center gap-3", style: { height }, role: "presentation", "aria-hidden": "true", children: [
-    /* @__PURE__ */ jsx17("div", { className: "flex h-full items-center justify-center", style: { width: "60%" }, children: /* @__PURE__ */ jsxs15("svg", { viewBox: "0 0 100 100", className: "h-full", style: { aspectRatio: "1 / 1" }, children: [
-      /* @__PURE__ */ jsx17("circle", { cx: "50", cy: "50", r, fill: "var(--mr-color-subtle)" }),
+  return /* @__PURE__ */ jsxs16("div", { className: "flex w-full items-center gap-3", style: { height }, role: "presentation", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx18("div", { className: "flex h-full items-center justify-center", style: { width: "60%" }, children: /* @__PURE__ */ jsxs16("svg", { viewBox: "0 0 100 100", className: "h-full", style: { aspectRatio: "1 / 1" }, children: [
+      /* @__PURE__ */ jsx18("circle", { cx: "50", cy: "50", r, fill: "var(--mr-color-subtle)" }),
       PIE_SEAMS.map((deg) => {
         const rad = (deg - 90) * Math.PI / 180;
-        return /* @__PURE__ */ jsx17(
+        return /* @__PURE__ */ jsx18(
           "line",
           {
             x1: "50",
@@ -1793,12 +1817,12 @@ function PieChartPlaceholder({ height = 220, legendRows = 8 }) {
         );
       })
     ] }) }),
-    /* @__PURE__ */ jsx17(BlankLegend, { rows: legendRows })
+    /* @__PURE__ */ jsx18(BlankLegend, { rows: legendRows })
   ] });
 }
 
 // src/StackedColumnPlaceholder.tsx
-import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
 var COLUMN_WEIGHTS = [20, 30, 15, 35, 24, 12, 28, 18];
 function columnBands(count) {
   const weights = Array.from({ length: count }, (_, i) => COLUMN_WEIGHTS[i % COLUMN_WEIGHTS.length]);
@@ -1811,7 +1835,7 @@ function StackedColumnPlaceholder({
   legendRows = 4,
   axis = false
 }) {
-  const column = /* @__PURE__ */ jsx18("div", { className: "flex h-full flex-col overflow-hidden rounded-control bg-subtle", style: { width }, children: columnBands(legendRows).map((pct, i) => /* @__PURE__ */ jsx18(
+  const column = /* @__PURE__ */ jsx19("div", { className: "flex h-full flex-col overflow-hidden rounded-control bg-subtle", style: { width }, children: columnBands(legendRows).map((pct, i) => /* @__PURE__ */ jsx19(
     "div",
     {
       style: {
@@ -1823,19 +1847,32 @@ function StackedColumnPlaceholder({
     },
     i
   )) });
-  return /* @__PURE__ */ jsxs16("div", { className: "flex w-full gap-4", style: { height }, role: "presentation", "aria-hidden": "true", children: [
-    axis ? /* @__PURE__ */ jsx18("div", { style: { width: "55%" }, children: /* @__PURE__ */ jsx18(AxisFrame, { height, xTicks: 0, children: /* @__PURE__ */ jsx18("div", { className: "flex h-full items-stretch justify-center", children: column }) }) }) : /* @__PURE__ */ jsx18("div", { className: "flex items-stretch py-1", children: column }),
-    /* @__PURE__ */ jsx18(BlankLegend, { rows: legendRows, reverse: !axis })
+  return /* @__PURE__ */ jsxs17("div", { className: "flex w-full gap-4", style: { height }, role: "presentation", "aria-hidden": "true", children: [
+    axis ? /* @__PURE__ */ jsx19("div", { style: { width: "55%" }, children: /* @__PURE__ */ jsx19(AxisFrame, { height, xTicks: 0, children: /* @__PURE__ */ jsx19("div", { className: "flex h-full items-stretch justify-center", children: column }) }) }) : /* @__PURE__ */ jsx19("div", { className: "flex items-stretch py-1", children: column }),
+    /* @__PURE__ */ jsx19(BlankLegend, { rows: legendRows, reverse: !axis })
   ] });
 }
 
 // src/Tooltip.tsx
 import { useEffect as useEffect8, useId, useLayoutEffect as useLayoutEffect2, useRef as useRef9, useState as useState8 } from "react";
 import { createPortal as createPortal3 } from "react-dom";
-import { jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs18 } from "react/jsx-runtime";
 function cx6(...parts) {
   return parts.filter(Boolean).join(" ");
 }
+function exitDurationMs(el) {
+  if (typeof window.matchMedia === "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches) return 0;
+  const cs = window.getComputedStyle(el);
+  if (cs.transitionProperty === "none") return 0;
+  const toMs = (v) => {
+    const n = parseFloat(v);
+    if (!Number.isFinite(n)) return 0;
+    return v.trim().endsWith("ms") ? n : n * 1e3;
+  };
+  const durations = cs.transitionDuration.split(",").map(toMs);
+  const delays = cs.transitionDelay.split(",").map(toMs);
+  return Math.max(0, ...durations.map((d, i) => d + (delays[i] ?? delays[0] ?? 0)));
+}
 function Tooltip({
   label,
   children,
@@ -1855,6 +1892,10 @@ function Tooltip({
   const boxRef = useRef9(null);
   const hideTimer = useRef9(null);
   const showTimer = useRef9(null);
+  const exitTimer = useRef9(null);
+  const [shown, setShown] = useState8(false);
+  const openRef = useRef9(false);
+  const mountedRef = useRef9(false);
   const id = useId();
   const clearHideTimer = () => {
     if (hideTimer.current) {
@@ -1868,10 +1909,17 @@ function Tooltip({
       showTimer.current = null;
     }
   };
+  const clearExitTimer = () => {
+    if (exitTimer.current) {
+      clearTimeout(exitTimer.current);
+      exitTimer.current = null;
+    }
+  };
   useEffect8(
     () => () => {
       clearHideTimer();
       clearShowTimer();
+      clearExitTimer();
     },
     []
   );
@@ -1879,26 +1927,56 @@ function Tooltip({
     const el = anchorRef ? anchorRef.current : ref.current;
     if (!el) return;
     if (whenTruncated && el.scrollWidth <= el.clientWidth) return;
+    clearExitTimer();
+    openRef.current = true;
     const r = el.getBoundingClientRect();
-    setBoxWidth(null);
+    if (!mountedRef.current) setBoxWidth(null);
+    mountedRef.current = true;
     setAnchor({ top: r.top, left: r.left, width: r.width, height: r.height, bottom: r.bottom, right: r.right });
     if (anchorRef) el.setAttribute("aria-describedby", id);
   };
   const show = () => {
     clearHideTimer();
-    if (delay > 0) {
+    clearShowTimer();
+    if (delay > 0 && !mountedRef.current) {
       showTimer.current = setTimeout(reveal, delay);
     } else {
       reveal();
     }
   };
-  const hideNow = () => {
-    clearShowTimer();
-    clearHideTimer();
+  const unmount = () => {
+    clearExitTimer();
+    if (openRef.current || !mountedRef.current) return;
+    mountedRef.current = false;
     setAnchor(null);
     setBoxWidth(null);
     if (anchorRef?.current) anchorRef.current.removeAttribute("aria-describedby");
   };
+  const hideNow = () => {
+    clearShowTimer();
+    clearHideTimer();
+    openRef.current = false;
+    if (!mountedRef.current) return;
+    setShown(false);
+    clearExitTimer();
+    const ms = boxRef.current ? exitDurationMs(boxRef.current) : 0;
+    if (ms === 0) {
+      unmount();
+      return;
+    }
+    exitTimer.current = setTimeout(unmount, ms + 50);
+  };
+  const keepOpen = () => {
+    clearHideTimer();
+    if (openRef.current || !mountedRef.current) return;
+    clearExitTimer();
+    openRef.current = true;
+    setShown(true);
+  };
+  const onBoxTransitionEnd = (e) => {
+    if (e.target !== e.currentTarget || e.propertyName !== "opacity") return;
+    if (!openRef.current) unmount();
+  };
   const hide = () => {
     clearShowTimer();
     if (!interactive) {
@@ -1928,6 +2006,7 @@ function Tooltip({
     const el = boxRef.current;
     if (!el) return;
     setBoxWidth(el.getBoundingClientRect().width);
+    if (openRef.current) setShown(true);
   }, [anchor, label]);
   const margin = 8;
   let style = { top: 0, left: 0 };
@@ -1947,7 +2026,7 @@ function Tooltip({
     }
   }
   const floating = anchor != null && typeof document !== "undefined" ? createPortal3(
-    /* @__PURE__ */ jsx19(
+    /* @__PURE__ */ jsx20(
       "span",
       {
         ref: boxRef,
@@ -1955,10 +2034,19 @@ function Tooltip({
         id,
         "data-testid": testIdPrefix && `${testIdPrefix}-tooltip`,
         style: { top: style.top, left: style.left, right: style.right, visibility: boxWidth == null ? "hidden" : "visible" },
-        onMouseEnter: interactive ? clearHideTimer : void 0,
+        onMouseEnter: interactive ? keepOpen : void 0,
         onMouseLeave: interactive ? hide : void 0,
+        onTransitionEnd: onBoxTransitionEnd,
         className: cx6(
           "fixed z-[90] w-max max-w-xs whitespace-normal break-words px-2.5 py-1.5 text-xs leading-snug",
+          // Fade in/out. The sys duration token rather than a ref one:
+          // it is what Button's hover/press transition uses, and a
+          // tooltip's fade is the same kind of interactive feedback.
+          // design-tokens has no in-out curve (ease-interactive is the
+          // decelerating "standard" curve), so ease-in-out is Tailwind's.
+          "transition-opacity duration-(--mr-motion-duration-interactive) ease-in-out motion-reduce:transition-none",
+          shown ? "opacity-100" : "opacity-0",
+          // Non-interactive: never a pointer target, fade-out included.
           interactive ? "pointer-events-auto" : "pointer-events-none",
           variant === "inverted" ? "rounded-control bg-text-primary text-surface" : "rounded-control border border-border-default bg-surface text-text-primary shadow-overlay",
           translate
@@ -1969,7 +2057,7 @@ function Tooltip({
     document.body
   ) : null;
   if (anchorRef) return floating;
-  return /* @__PURE__ */ jsxs17(
+  return /* @__PURE__ */ jsxs18(
     "span",
     {
       ref,
@@ -1988,26 +2076,26 @@ function Tooltip({
 }
 
 // src/AdvertiserNoResults.tsx
-import { jsx as jsx20, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs19 } from "react/jsx-runtime";
 function AdvertiserNoResults({
   query,
   hint = "Try checking your spelling or searching for a broader brand name."
 }) {
-  return /* @__PURE__ */ jsxs18("div", { className: "flex flex-col items-center gap-1.5 px-4 py-8 text-center", children: [
-    /* @__PURE__ */ jsxs18("p", { className: "text-[13px] font-medium text-text-primary", children: [
+  return /* @__PURE__ */ jsxs19("div", { className: "flex flex-col items-center gap-1.5 px-4 py-8 text-center", children: [
+    /* @__PURE__ */ jsxs19("p", { className: "text-[13px] font-medium text-text-primary", children: [
       "No results found for \u201C",
       query,
       "\u201D"
     ] }),
-    /* @__PURE__ */ jsx20("p", { className: "text-[12px] leading-snug text-text-tertiary", children: hint })
+    /* @__PURE__ */ jsx21("p", { className: "text-[12px] leading-snug text-text-tertiary", children: hint })
   ] });
 }
 
 // src/SelectAllVisible.tsx
 import { ListChecks as ListChecks2 } from "lucide-react";
-import { jsx as jsx21, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx22, jsxs as jsxs20 } from "react/jsx-runtime";
 function SelectAllVisible({ count, allSelected, onToggle, testIdPrefix }) {
-  return /* @__PURE__ */ jsxs19(
+  return /* @__PURE__ */ jsxs20(
     "button",
     {
       type: "button",
@@ -2015,7 +2103,7 @@ function SelectAllVisible({ count, allSelected, onToggle, testIdPrefix }) {
       onClick: onToggle,
       className: "flex w-full items-center gap-2 rounded-control px-2 py-1.5 text-left text-[12px] font-semibold text-text-link transition-colors hover:bg-subtle",
       children: [
-        /* @__PURE__ */ jsx21(ListChecks2, { size: 14, "aria-hidden": "true" }),
+        /* @__PURE__ */ jsx22(ListChecks2, { size: 14, "aria-hidden": "true" }),
         allSelected ? `Deselect ${count} visible` : `Select all ${count} visible`
       ]
     }
@@ -2024,14 +2112,14 @@ function SelectAllVisible({ count, allSelected, onToggle, testIdPrefix }) {
 
 // src/SelectedSection.tsx
 import { ChevronDown as ChevronDown7 } from "lucide-react";
-import { jsx as jsx22, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx23, jsxs as jsxs21 } from "react/jsx-runtime";
 function cx7(...parts) {
   return parts.filter(Boolean).join(" ");
 }
 function SelectedSection({ count, open, onToggle, children, testIdPrefix }) {
   if (count === 0) return null;
-  return /* @__PURE__ */ jsxs20("div", { className: "flex flex-col", children: [
-    /* @__PURE__ */ jsxs20(
+  return /* @__PURE__ */ jsxs21("div", { className: "flex flex-col", children: [
+    /* @__PURE__ */ jsxs21(
       "button",
       {
         type: "button",
@@ -2040,14 +2128,14 @@ function SelectedSection({ count, open, onToggle, children, testIdPrefix }) {
         "aria-expanded": open,
         className: "flex w-full items-center gap-1.5 rounded-control px-2 py-1 text-left text-[11px] font-semibold uppercase tracking-wide text-text-tertiary transition-colors hover:text-text-primary",
         children: [
-          /* @__PURE__ */ jsx22(ChevronDown7, { size: 13, "aria-hidden": "true", className: cx7("transition-transform", !open && "-rotate-90") }),
+          /* @__PURE__ */ jsx23(ChevronDown7, { size: 13, "aria-hidden": "true", className: cx7("transition-transform", !open && "-rotate-90") }),
           "Selected (",
           count,
           ")"
         ]
       }
     ),
-    open && /* @__PURE__ */ jsx22("div", { className: "flex flex-col gap-0.5", children })
+    open && /* @__PURE__ */ jsx23("div", { className: "flex flex-col gap-0.5", children })
   ] });
 }
 
@@ -2055,7 +2143,7 @@ function SelectedSection({ count, open, onToggle, children, testIdPrefix }) {
 import { useCallback as useCallback3, useEffect as useEffect9, useLayoutEffect as useLayoutEffect3, useMemo as useMemo3, useRef as useRef10, useState as useState9 } from "react";
 import { createPortal as createPortal4 } from "react-dom";
 import { Search as Search4, Plus, Info as Info2, ChevronRight as ChevronRight3, ChevronDown as ChevronDown8, Check as Check6, List, Loader2 } from "lucide-react";
-import { Fragment as Fragment4, jsx as jsx23, jsxs as jsxs21 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx24, jsxs as jsxs22 } from "react/jsx-runtime";
 function cx8(...parts) {
   return parts.filter(Boolean).join(" ");
 }
@@ -2150,17 +2238,17 @@ function SelectionPicker({
     }
   };
   const rowGridCols = showInfoColumn ? "grid-cols-[36px_1fr_44px]" : "grid-cols-[36px_1fr]";
-  return /* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-4", children: [
-    helper && /* @__PURE__ */ jsxs21(Fragment4, { children: [
-      /* @__PURE__ */ jsx23("p", { className: "text-[13px] text-text-secondary", children: helper }),
-      /* @__PURE__ */ jsx23("hr", { className: "-mx-5 -mt-2 border-border-default sm:-mx-6" })
+  return /* @__PURE__ */ jsxs22("div", { className: "flex flex-col gap-4", children: [
+    helper && /* @__PURE__ */ jsxs22(Fragment4, { children: [
+      /* @__PURE__ */ jsx24("p", { className: "text-[13px] text-text-secondary", children: helper }),
+      /* @__PURE__ */ jsx24("hr", { className: "-mx-5 -mt-2 border-border-default sm:-mx-6" })
     ] }),
-    hasAccountLists && /* @__PURE__ */ jsx23("div", { className: "inline-flex gap-0.5 self-start rounded-control border border-border-default bg-canvas p-0.5", children: [
+    hasAccountLists && /* @__PURE__ */ jsx24("div", { className: "inline-flex gap-0.5 self-start rounded-control border border-border-default bg-canvas p-0.5", children: [
       { id: "search", label: "Search", icon: Search4 },
       { id: "lists", label: "Account lists", icon: List }
     ].map((t) => {
       const on = source === t.id;
-      return /* @__PURE__ */ jsxs21(
+      return /* @__PURE__ */ jsxs22(
         "button",
         {
           type: "button",
@@ -2171,18 +2259,18 @@ function SelectionPicker({
             on ? "bg-surface text-text-primary shadow-raised" : "text-text-secondary hover:text-text-primary"
           ),
           children: [
-            /* @__PURE__ */ jsx23(t.icon, { size: 14, "aria-hidden": "true" }),
+            /* @__PURE__ */ jsx24(t.icon, { size: 14, "aria-hidden": "true" }),
             t.label
           ]
         },
         t.id
       );
     }) }),
-    source === "search" && /* @__PURE__ */ jsxs21("div", { className: "flex min-w-0 flex-col gap-3", children: [
-      /* @__PURE__ */ jsxs21("div", { className: "flex flex-wrap items-center gap-2", children: [
-        /* @__PURE__ */ jsxs21("div", { className: "flex h-9 min-w-[200px] flex-1 items-center gap-2 rounded-control border border-border-default bg-input px-3", children: [
-          /* @__PURE__ */ jsx23(Search4, { size: 15, className: "text-text-secondary", "aria-hidden": "true" }),
-          /* @__PURE__ */ jsx23(
+    source === "search" && /* @__PURE__ */ jsxs22("div", { className: "flex min-w-0 flex-col gap-3", children: [
+      /* @__PURE__ */ jsxs22("div", { className: "flex flex-wrap items-center gap-2", children: [
+        /* @__PURE__ */ jsxs22("div", { className: "flex h-9 min-w-[200px] flex-1 items-center gap-2 rounded-control border border-border-default bg-input px-3", children: [
+          /* @__PURE__ */ jsx24(Search4, { size: 15, className: "text-text-secondary", "aria-hidden": "true" }),
+          /* @__PURE__ */ jsx24(
             "input",
             {
               value: query,
@@ -2198,7 +2286,7 @@ function SelectionPicker({
             }
           )
         ] }),
-        filters.map((f) => /* @__PURE__ */ jsx23(
+        filters.map((f) => /* @__PURE__ */ jsx24(
           FilterDropdown,
           {
             filter: f,
@@ -2210,14 +2298,14 @@ function SelectionPicker({
         )),
         toolbarExtra
       ] }),
-      !hasSearched ? /* @__PURE__ */ jsxs21("div", { className: "flex flex-col items-center gap-3 rounded-card border border-dashed border-border-default py-10 text-center", children: [
-        /* @__PURE__ */ jsx23("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-subtle", children: /* @__PURE__ */ jsx23(Search4, { size: 20, className: "text-text-tertiary", "aria-hidden": "true" }) }),
-        /* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ jsx23("p", { className: "text-[14px] font-semibold text-text-primary", children: "Search to get started" }),
-          /* @__PURE__ */ jsx23("p", { className: "text-[13px] text-text-tertiary", children: "Use the search or filters above to find and add options." })
+      !hasSearched ? /* @__PURE__ */ jsxs22("div", { className: "flex flex-col items-center gap-3 rounded-card border border-dashed border-border-default py-10 text-center", children: [
+        /* @__PURE__ */ jsx24("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-subtle", children: /* @__PURE__ */ jsx24(Search4, { size: 20, className: "text-text-tertiary", "aria-hidden": "true" }) }),
+        /* @__PURE__ */ jsxs22("div", { className: "flex flex-col gap-1", children: [
+          /* @__PURE__ */ jsx24("p", { className: "text-[14px] font-semibold text-text-primary", children: "Search to get started" }),
+          /* @__PURE__ */ jsx24("p", { className: "text-[13px] text-text-tertiary", children: "Use the search or filters above to find and add options." })
         ] })
-      ] }) : /* @__PURE__ */ jsxs21("div", { className: "overflow-hidden rounded-control border border-border-default", children: [
-        /* @__PURE__ */ jsxs21(
+      ] }) : /* @__PURE__ */ jsxs22("div", { className: "overflow-hidden rounded-control border border-border-default", children: [
+        /* @__PURE__ */ jsxs22(
           "div",
           {
             className: cx8(
@@ -2225,7 +2313,7 @@ function SelectionPicker({
               rowGridCols
             ),
             children: [
-              /* @__PURE__ */ jsx23(
+              /* @__PURE__ */ jsx24(
                 CheckBox,
                 {
                   checked: allSelected,
@@ -2236,18 +2324,18 @@ function SelectionPicker({
                   testId: testIdPrefix && `${testIdPrefix}-select-all`
                 }
               ),
-              /* @__PURE__ */ jsx23("div", { className: cx8("grid gap-2", gridForColumns(columns)), children: columns.map((c) => /* @__PURE__ */ jsx23("span", { className: c.className, children: c.header }, c.key)) }),
-              showInfoColumn && /* @__PURE__ */ jsx23("span", { className: "text-right", children: "Info" })
+              /* @__PURE__ */ jsx24("div", { className: cx8("grid gap-2", gridForColumns(columns)), children: columns.map((c) => /* @__PURE__ */ jsx24("span", { className: c.className, children: c.header }, c.key)) }),
+              showInfoColumn && /* @__PURE__ */ jsx24("span", { className: "text-right", children: "Info" })
             ]
           }
         ),
-        /* @__PURE__ */ jsx23("div", { className: "max-h-[360px] overflow-y-auto", children: loading ? /* @__PURE__ */ jsx23("div", { className: "flex items-center justify-center py-6", role: "status", "aria-label": "Loading", children: /* @__PURE__ */ jsx23(Loader2, { size: 18, className: "animate-spin text-text-tertiary", "aria-hidden": "true" }) }) : error ? /* @__PURE__ */ jsx23("p", { className: "px-3 py-8 text-center text-[13px] text-text-tertiary", children: errorMessage }) : rows.length === 0 ? /* @__PURE__ */ jsx23("div", { className: "px-3 py-8 text-center text-[13px] text-text-tertiary", children: "No matches. Try a different search or filter." }) : rows.map((row) => {
+        /* @__PURE__ */ jsx24("div", { className: "max-h-[360px] overflow-y-auto", children: loading ? /* @__PURE__ */ jsx24("div", { className: "flex items-center justify-center py-6", role: "status", "aria-label": "Loading", children: /* @__PURE__ */ jsx24(Loader2, { size: 18, className: "animate-spin text-text-tertiary", "aria-hidden": "true" }) }) : error ? /* @__PURE__ */ jsx24("p", { className: "px-3 py-8 text-center text-[13px] text-text-tertiary", children: errorMessage }) : rows.length === 0 ? /* @__PURE__ */ jsx24("div", { className: "px-3 py-8 text-center text-[13px] text-text-tertiary", children: "No matches. Try a different search or filter." }) : rows.map((row) => {
           const isSel = selectedIds.has(row.id);
           const isLocked = lockedIds?.has(row.id) ?? false;
           const kids = getChildren?.(row);
           const isOpen = expanded.has(row.id);
-          return /* @__PURE__ */ jsxs21("div", { className: "border-t border-border-default/60 first:border-t-0", children: [
-            /* @__PURE__ */ jsxs21(
+          return /* @__PURE__ */ jsxs22("div", { className: "border-t border-border-default/60 first:border-t-0", children: [
+            /* @__PURE__ */ jsxs22(
               "div",
               {
                 onClick: isLocked ? void 0 : () => toggleRow(row),
@@ -2259,7 +2347,7 @@ function SelectionPicker({
                   !isLocked && isSel && "opacity-60"
                 ),
                 children: [
-                  isLocked ? /* @__PURE__ */ jsx23("span", { "aria-hidden": "true" }) : /* @__PURE__ */ jsx23(
+                  isLocked ? /* @__PURE__ */ jsx24("span", { "aria-hidden": "true" }) : /* @__PURE__ */ jsx24(
                     CheckBox,
                     {
                       checked: isSel,
@@ -2268,8 +2356,8 @@ function SelectionPicker({
                       testId: testIdPrefix && `${testIdPrefix}-row-${slug4(row.id)}`
                     }
                   ),
-                  /* @__PURE__ */ jsx23("div", { className: cx8("grid gap-2 text-[13px] text-text-primary", gridForColumns(columns)), children: columns.map((c) => /* @__PURE__ */ jsx23("span", { className: cx8("truncate", c.className), children: c.render(row) }, c.key)) }),
-                  showInfoColumn && /* @__PURE__ */ jsx23("div", { className: "flex items-center justify-end", children: kids && kids.length > 0 ? /* @__PURE__ */ jsx23(
+                  /* @__PURE__ */ jsx24("div", { className: cx8("grid gap-2 text-[13px] text-text-primary", gridForColumns(columns)), children: columns.map((c) => /* @__PURE__ */ jsx24("span", { className: cx8("truncate", c.className), children: c.render(row) }, c.key)) }),
+                  showInfoColumn && /* @__PURE__ */ jsx24("div", { className: "flex items-center justify-end", children: kids && kids.length > 0 ? /* @__PURE__ */ jsx24(
                     "button",
                     {
                       type: "button",
@@ -2283,28 +2371,28 @@ function SelectionPicker({
                         });
                       },
                       className: "flex h-7 w-7 items-center justify-center rounded-control text-text-secondary hover:bg-canvas hover:text-text-primary",
-                      children: /* @__PURE__ */ jsx23(ChevronRight3, { size: 15, className: cx8("transition-transform", isOpen && "rotate-90") })
+                      children: /* @__PURE__ */ jsx24(ChevronRight3, { size: 15, className: cx8("transition-transform", isOpen && "rotate-90") })
                     }
-                  ) : /* @__PURE__ */ jsx23(
+                  ) : /* @__PURE__ */ jsx24(
                     "span",
                     {
                       className: "flex h-7 w-7 items-center justify-center text-text-tertiary",
                       title: "No additional details",
-                      children: /* @__PURE__ */ jsx23(Info2, { size: 14 })
+                      children: /* @__PURE__ */ jsx24(Info2, { size: 14 })
                     }
                   ) })
                 ]
               }
             ),
-            isOpen && kids && /* @__PURE__ */ jsx23("div", { className: "bg-canvas/60 pb-1.5 pl-10 pr-3", children: kids.map((kid) => {
+            isOpen && kids && /* @__PURE__ */ jsx24("div", { className: "bg-canvas/60 pb-1.5 pl-10 pr-3", children: kids.map((kid) => {
               const kidSel = selectedIds.has(kid.id);
-              return /* @__PURE__ */ jsxs21(
+              return /* @__PURE__ */ jsxs22(
                 "div",
                 {
                   className: "flex items-center justify-between gap-2 border-t border-border-default/40 py-2 first:border-t-0",
                   children: [
-                    /* @__PURE__ */ jsx23("span", { className: "truncate text-[13px] text-text-secondary", children: kid.name }),
-                    /* @__PURE__ */ jsxs21(
+                    /* @__PURE__ */ jsx24("span", { className: "truncate text-[13px] text-text-secondary", children: kid.name }),
+                    /* @__PURE__ */ jsxs22(
                       "button",
                       {
                         type: "button",
@@ -2315,7 +2403,7 @@ function SelectionPicker({
                           kidSel ? "text-text-tertiary" : "text-text-link hover:bg-subtle"
                         ),
                         children: [
-                          kidSel ? /* @__PURE__ */ jsx23(Check6, { size: 13 }) : /* @__PURE__ */ jsx23(Plus, { size: 13 }),
+                          kidSel ? /* @__PURE__ */ jsx24(Check6, { size: 13 }) : /* @__PURE__ */ jsx24(Plus, { size: 13 }),
                           kidSel ? "Added" : "Add"
                         ]
                       }
@@ -2327,7 +2415,7 @@ function SelectionPicker({
             }) })
           ] }, row.id);
         }) }),
-        !loading && !error && hasMore && /* @__PURE__ */ jsxs21(
+        !loading && !error && hasMore && /* @__PURE__ */ jsxs22(
           "button",
           {
             type: "button",
@@ -2336,19 +2424,19 @@ function SelectionPicker({
             "data-testid": testIdPrefix && `${testIdPrefix}-load-more`,
             className: "flex w-full items-center justify-center gap-2 border-t border-border-default px-2 py-1.5 text-[13px] text-brand-primaryAction transition-colors hover:bg-subtle disabled:opacity-50",
             children: [
-              loadingMore ? /* @__PURE__ */ jsx23(Loader2, { size: 13, className: "animate-spin", "aria-hidden": "true" }) : null,
+              loadingMore ? /* @__PURE__ */ jsx24(Loader2, { size: 13, className: "animate-spin", "aria-hidden": "true" }) : null,
               loadingMore ? "Loading\u2026" : "Load more"
             ]
           }
         )
       ] })
     ] }),
-    source === "lists" && /* @__PURE__ */ jsxs21("div", { className: "flex min-w-0 flex-col gap-3", children: [
-      /* @__PURE__ */ jsx23("p", { className: "text-[13px] text-text-secondary", children: "Select an account list to add all of its accounts at once. Your workspace stays in sync as the list is updated." }),
-      accountLists && accountLists.length > 0 ? /* @__PURE__ */ jsxs21(Fragment4, { children: [
-        /* @__PURE__ */ jsx23(ScrollFade, { className: "flex max-h-[396px] flex-col gap-2 overflow-y-auto pr-0.5", children: accountLists.map((list) => {
+    source === "lists" && /* @__PURE__ */ jsxs22("div", { className: "flex min-w-0 flex-col gap-3", children: [
+      /* @__PURE__ */ jsx24("p", { className: "text-[13px] text-text-secondary", children: "Select an account list to add all of its accounts at once. Your workspace stays in sync as the list is updated." }),
+      accountLists && accountLists.length > 0 ? /* @__PURE__ */ jsxs22(Fragment4, { children: [
+        /* @__PURE__ */ jsx24(ScrollFade, { className: "flex max-h-[396px] flex-col gap-2 overflow-y-auto pr-0.5", children: accountLists.map((list) => {
           const on = (selectedListIds ?? []).includes(list.id);
-          return /* @__PURE__ */ jsxs21(
+          return /* @__PURE__ */ jsxs22(
             "button",
             {
               type: "button",
@@ -2360,19 +2448,19 @@ function SelectionPicker({
                 on ? "border-brand-primaryAction bg-brand-primarySoft" : "border-border-default bg-surface hover:bg-subtle"
               ),
               children: [
-                /* @__PURE__ */ jsx23(
+                /* @__PURE__ */ jsx24(
                   "span",
                   {
                     className: cx8(
                       "flex h-5 w-5 shrink-0 items-center justify-center rounded-full",
                       on ? "text-brand-primaryAction" : "text-text-secondary"
                     ),
-                    children: on ? /* @__PURE__ */ jsx23(Check6, { size: 16 }) : /* @__PURE__ */ jsx23(Plus, { size: 16 })
+                    children: on ? /* @__PURE__ */ jsx24(Check6, { size: 16 }) : /* @__PURE__ */ jsx24(Plus, { size: 16 })
                   }
                 ),
-                /* @__PURE__ */ jsxs21("span", { className: "min-w-0 flex-1", children: [
-                  /* @__PURE__ */ jsx23("span", { className: "flex min-w-0 items-center gap-2", children: /* @__PURE__ */ jsx23("span", { className: "truncate text-[14px] font-medium text-text-primary", children: list.name }) }),
-                  /* @__PURE__ */ jsxs21("span", { className: "block truncate text-[12px] text-text-secondary", children: [
+                /* @__PURE__ */ jsxs22("span", { className: "min-w-0 flex-1", children: [
+                  /* @__PURE__ */ jsx24("span", { className: "flex min-w-0 items-center gap-2", children: /* @__PURE__ */ jsx24("span", { className: "truncate text-[14px] font-medium text-text-primary", children: list.name }) }),
+                  /* @__PURE__ */ jsxs22("span", { className: "block truncate text-[12px] text-text-secondary", children: [
                     list.count,
                     " accounts \xB7 ",
                     list.entityTypes.join(", "),
@@ -2380,13 +2468,13 @@ function SelectionPicker({
                     formatListDate(list.updatedAt)
                   ] })
                 ] }),
-                /* @__PURE__ */ jsx23("span", { className: cx8("shrink-0 text-[12px] font-medium", on ? "text-brand-primaryAction" : "text-text-secondary"), children: on ? "Added" : "Add" })
+                /* @__PURE__ */ jsx24("span", { className: cx8("shrink-0 text-[12px] font-medium", on ? "text-brand-primaryAction" : "text-text-secondary"), children: on ? "Added" : "Add" })
               ]
             },
             list.id
           );
         }) }),
-        /* @__PURE__ */ jsxs21(
+        /* @__PURE__ */ jsxs22(
           "p",
           {
             className: "border-t border-border-default pt-2 text-right text-[12px] font-medium text-text-tertiary",
@@ -2398,11 +2486,11 @@ function SelectionPicker({
             ]
           }
         )
-      ] }) : /* @__PURE__ */ jsxs21("div", { className: "flex flex-col items-center gap-3 rounded-card border border-dashed border-border-default py-10 text-center", children: [
-        /* @__PURE__ */ jsx23("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-subtle", children: /* @__PURE__ */ jsx23(List, { size: 20, className: "text-text-tertiary", "aria-hidden": "true" }) }),
-        /* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ jsx23("p", { className: "text-[14px] font-semibold text-text-primary", children: "No account lists yet" }),
-          /* @__PURE__ */ jsx23("p", { className: "text-[13px] text-text-tertiary", children: "Account lists set up for you will appear here." })
+      ] }) : /* @__PURE__ */ jsxs22("div", { className: "flex flex-col items-center gap-3 rounded-card border border-dashed border-border-default py-10 text-center", children: [
+        /* @__PURE__ */ jsx24("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-subtle", children: /* @__PURE__ */ jsx24(List, { size: 20, className: "text-text-tertiary", "aria-hidden": "true" }) }),
+        /* @__PURE__ */ jsxs22("div", { className: "flex flex-col gap-1", children: [
+          /* @__PURE__ */ jsx24("p", { className: "text-[14px] font-semibold text-text-primary", children: "No account lists yet" }),
+          /* @__PURE__ */ jsx24("p", { className: "text-[13px] text-text-tertiary", children: "Account lists set up for you will appear here." })
         ] })
       ] })
     ] })
@@ -2434,7 +2522,7 @@ function ScrollFade({ className, children }) {
     [sync]
   );
   const mask = edges.top || edges.bottom ? `linear-gradient(to bottom, transparent 0, #000 ${edges.top ? EDGE_FADE : 0}px, #000 calc(100% - ${edges.bottom ? EDGE_FADE : 0}px), transparent 100%)` : void 0;
-  return /* @__PURE__ */ jsx23("div", { ref: attach, onScroll: sync, className, style: { maskImage: mask, WebkitMaskImage: mask }, children });
+  return /* @__PURE__ */ jsx24("div", { ref: attach, onScroll: sync, className, style: { maskImage: mask, WebkitMaskImage: mask }, children });
 }
 function formatListDate(iso) {
   try {
@@ -2484,8 +2572,8 @@ function FilterDropdown({
   const count = active.size;
   const label = count === 0 ? filter.label : count === 1 ? [...active][0] : "Multiple";
   const filterSlug = slug4(filter.label);
-  return /* @__PURE__ */ jsxs21("div", { className: "relative", children: [
-    /* @__PURE__ */ jsxs21(
+  return /* @__PURE__ */ jsxs22("div", { className: "relative", children: [
+    /* @__PURE__ */ jsxs22(
       "button",
       {
         ref: btnRef,
@@ -2497,12 +2585,12 @@ function FilterDropdown({
         className: "inline-flex h-9 items-center gap-1.5 whitespace-nowrap rounded-control border border-border-default bg-input px-3 text-[13px] font-medium text-text-secondary transition-colors hover:bg-subtle",
         children: [
           label,
-          /* @__PURE__ */ jsx23(ChevronDown8, { size: 13, "aria-hidden": "true", className: cx8("transition-transform", open && "rotate-180") })
+          /* @__PURE__ */ jsx24(ChevronDown8, { size: 13, "aria-hidden": "true", className: cx8("transition-transform", open && "rotate-180") })
         ]
       }
     ),
     open && pos && createPortal4(
-      /* @__PURE__ */ jsxs21(
+      /* @__PURE__ */ jsxs22(
         "div",
         {
           ref: menuRef,
@@ -2511,9 +2599,9 @@ function FilterDropdown({
           style: { top: pos.top, left: pos.left },
           className: "fixed z-[80] min-w-[220px] rounded-card border border-border-default bg-surface p-2 shadow-overlay",
           children: [
-            searchable && /* @__PURE__ */ jsxs21("div", { className: "mb-1.5 flex h-8 items-center gap-2 rounded-control border border-border-default bg-input px-2.5", children: [
-              /* @__PURE__ */ jsx23(Search4, { size: 14, className: "shrink-0 text-text-secondary", "aria-hidden": "true" }),
-              /* @__PURE__ */ jsx23(
+            searchable && /* @__PURE__ */ jsxs22("div", { className: "mb-1.5 flex h-8 items-center gap-2 rounded-control border border-border-default bg-input px-2.5", children: [
+              /* @__PURE__ */ jsx24(Search4, { size: 14, className: "shrink-0 text-text-secondary", "aria-hidden": "true" }),
+              /* @__PURE__ */ jsx24(
                 "input",
                 {
                   autoFocus: true,
@@ -2524,14 +2612,14 @@ function FilterDropdown({
                 }
               )
             ] }),
-            /* @__PURE__ */ jsx23("div", { className: cx8("flex flex-col gap-0.5", searchable && "max-h-[240px] overflow-y-auto"), children: shownOptions.length === 0 ? /* @__PURE__ */ jsx23("p", { className: "px-2 py-3 text-center text-[12px] text-text-secondary", children: "No matches." }) : shownOptions.map((opt) => {
+            /* @__PURE__ */ jsx24("div", { className: cx8("flex flex-col gap-0.5", searchable && "max-h-[240px] overflow-y-auto"), children: shownOptions.length === 0 ? /* @__PURE__ */ jsx24("p", { className: "px-2 py-3 text-center text-[12px] text-text-secondary", children: "No matches." }) : shownOptions.map((opt) => {
               const on = active.has(opt);
-              return /* @__PURE__ */ jsxs21(
+              return /* @__PURE__ */ jsxs22(
                 "label",
                 {
                   className: "flex cursor-pointer items-center gap-2 rounded-control px-2 py-1.5 text-[13px] text-text-primary hover:bg-subtle",
                   children: [
-                    /* @__PURE__ */ jsx23(
+                    /* @__PURE__ */ jsx24(
                       CheckBox,
                       {
                         checked: on,
@@ -2562,7 +2650,7 @@ function gridForColumns(columns) {
 
 // src/PublisherBreakdownList.tsx
 import { useState as useState10 } from "react";
-import { jsx as jsx24, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs23 } from "react/jsx-runtime";
 function cx9(...parts) {
   return parts.filter(Boolean).join(" ");
 }
@@ -2577,7 +2665,7 @@ function initials(name) {
   return name.replace(/[^a-zA-Z0-9]/g, "").slice(0, 2).toUpperCase();
 }
 function Monogram({ name, size = 28 }) {
-  return /* @__PURE__ */ jsx24(
+  return /* @__PURE__ */ jsx25(
     "span",
     {
       "aria-hidden": "true",
@@ -2588,12 +2676,12 @@ function Monogram({ name, size = 28 }) {
   );
 }
 function BreakdownTag({ children }) {
-  return /* @__PURE__ */ jsx24("span", { className: "inline-flex items-center whitespace-nowrap rounded-full bg-subtle px-2 py-0.5 text-[11px] font-medium text-text-secondary", children });
+  return /* @__PURE__ */ jsx25("span", { className: "inline-flex items-center whitespace-nowrap rounded-full bg-subtle px-2 py-0.5 text-[11px] font-medium text-text-secondary", children });
 }
 function DelayedTip({ label, children }) {
-  return /* @__PURE__ */ jsxs22("span", { className: "group/dt relative inline-flex", tabIndex: 0, "aria-label": label, children: [
+  return /* @__PURE__ */ jsxs23("span", { className: "group/dt relative inline-flex", tabIndex: 0, "aria-label": label, children: [
     children,
-    /* @__PURE__ */ jsx24(
+    /* @__PURE__ */ jsx25(
       "span",
       {
         role: "tooltip",
@@ -2607,22 +2695,22 @@ var COL_CURRENT = 76;
 var COL_PREVIOUS = 76;
 var COL_YOY = 44;
 function MetricListHeader({ className }) {
-  return /* @__PURE__ */ jsxs22("div", { className: cx9("flex items-baseline gap-2 pb-2", className), children: [
-    /* @__PURE__ */ jsx24("span", { className: "flex-1" }),
-    /* @__PURE__ */ jsxs22("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
-      /* @__PURE__ */ jsx24("span", { className: "text-right text-[11px] font-medium text-text-tertiary", style: { width: COL_CURRENT }, children: "Current" }),
-      /* @__PURE__ */ jsx24(DelayedTip, { label: "Spend during the same time period one year ago.", children: /* @__PURE__ */ jsx24("span", { className: "text-right text-[11px] font-medium text-text-tertiary", style: { width: COL_PREVIOUS }, children: "Previous" }) }),
-      /* @__PURE__ */ jsx24(DelayedTip, { label: "Percent change from this time period vs. the same time one year ago.", children: /* @__PURE__ */ jsx24("span", { className: "text-right text-[11px] font-medium text-text-tertiary", style: { width: COL_YOY }, children: "YoY" }) })
+  return /* @__PURE__ */ jsxs23("div", { className: cx9("flex items-baseline gap-2 pb-2", className), children: [
+    /* @__PURE__ */ jsx25("span", { className: "flex-1" }),
+    /* @__PURE__ */ jsxs23("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
+      /* @__PURE__ */ jsx25("span", { className: "text-right text-[11px] font-medium text-text-tertiary", style: { width: COL_CURRENT }, children: "Current" }),
+      /* @__PURE__ */ jsx25(DelayedTip, { label: "Spend during the same time period one year ago.", children: /* @__PURE__ */ jsx25("span", { className: "text-right text-[11px] font-medium text-text-tertiary", style: { width: COL_PREVIOUS }, children: "Previous" }) }),
+      /* @__PURE__ */ jsx25(DelayedTip, { label: "Percent change from this time period vs. the same time one year ago.", children: /* @__PURE__ */ jsx25("span", { className: "text-right text-[11px] font-medium text-text-tertiary", style: { width: COL_YOY }, children: "YoY" }) })
     ] })
   ] });
 }
 function MetricCells({ spendN, yoy }) {
   const prior = priorYearAmt(spendN, yoy);
   const up = yoy !== "NEW" && yoy >= 0;
-  return /* @__PURE__ */ jsxs22("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
-    /* @__PURE__ */ jsx24("span", { className: "text-right text-[12px] font-bold tabular-nums text-text-primary", style: { width: COL_CURRENT }, children: fmtM(spendN) }),
-    /* @__PURE__ */ jsx24("span", { className: "text-right text-[12px] font-normal tabular-nums text-text-primary", style: { width: COL_PREVIOUS }, children: prior ?? "\u2014" }),
-    /* @__PURE__ */ jsx24("span", { className: "flex justify-end", style: { width: COL_YOY }, children: yoy === "NEW" ? /* @__PURE__ */ jsx24("span", { className: "rounded-full bg-status-warning/15 px-1.5 text-[10px] font-semibold text-text-warning", children: "NEW" }) : /* @__PURE__ */ jsxs22("span", { className: cx9("text-right text-[12px] font-semibold tabular-nums", up ? "text-text-success" : "text-text-danger"), children: [
+  return /* @__PURE__ */ jsxs23("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
+    /* @__PURE__ */ jsx25("span", { className: "text-right text-[12px] font-bold tabular-nums text-text-primary", style: { width: COL_CURRENT }, children: fmtM(spendN) }),
+    /* @__PURE__ */ jsx25("span", { className: "text-right text-[12px] font-normal tabular-nums text-text-primary", style: { width: COL_PREVIOUS }, children: prior ?? "\u2014" }),
+    /* @__PURE__ */ jsx25("span", { className: "flex justify-end", style: { width: COL_YOY }, children: yoy === "NEW" ? /* @__PURE__ */ jsx25("span", { className: "rounded-full bg-status-warning/15 px-1.5 text-[10px] font-semibold text-text-warning", children: "NEW" }) : /* @__PURE__ */ jsxs23("span", { className: cx9("text-right text-[12px] font-semibold tabular-nums", up ? "text-text-success" : "text-text-danger"), children: [
       up ? "+" : "\u2212",
       Math.abs(yoy),
       "%"
@@ -2633,35 +2721,35 @@ function PublisherBreakdownList({ rows, defaultVisibleCount = 10, padded = true,
   const [showAll, setShowAll] = useState10(false);
   const visible = showAll ? rows : rows.slice(0, defaultVisibleCount);
   const rowPad = padded ? "px-5" : "";
-  return /* @__PURE__ */ jsxs22("div", { className: "flex flex-col", children: [
-    /* @__PURE__ */ jsxs22("div", { className: "flex flex-col", children: [
-      /* @__PURE__ */ jsx24(MetricListHeader, { className: rowPad }),
-      visible.map((p) => /* @__PURE__ */ jsxs22("div", { className: cx9("flex items-center justify-between gap-3 border-t border-border-default/60 py-2.5 first:border-t-0", rowPad), children: [
-        /* @__PURE__ */ jsxs22("div", { className: "flex min-w-0 items-center gap-2.5", children: [
-          renderLogo ? renderLogo(p) : /* @__PURE__ */ jsx24(Monogram, { name: p.brand, size: 28 }),
-          /* @__PURE__ */ jsxs22("div", { className: "min-w-0", children: [
-            /* @__PURE__ */ jsxs22("div", { className: "flex flex-wrap items-center gap-1.5", children: [
-              /* @__PURE__ */ jsx24("span", { className: "text-[14px] font-semibold text-text-primary", children: p.brand }),
-              p.tags.map((t) => /* @__PURE__ */ jsx24(BreakdownTag, { children: t }, t))
+  return /* @__PURE__ */ jsxs23("div", { className: "flex flex-col", children: [
+    /* @__PURE__ */ jsxs23("div", { className: "flex flex-col", children: [
+      /* @__PURE__ */ jsx25(MetricListHeader, { className: rowPad }),
+      visible.map((p) => /* @__PURE__ */ jsxs23("div", { className: cx9("flex items-center justify-between gap-3 border-t border-border-default/60 py-2.5 first:border-t-0", rowPad), children: [
+        /* @__PURE__ */ jsxs23("div", { className: "flex min-w-0 items-center gap-2.5", children: [
+          renderLogo ? renderLogo(p) : /* @__PURE__ */ jsx25(Monogram, { name: p.brand, size: 28 }),
+          /* @__PURE__ */ jsxs23("div", { className: "min-w-0", children: [
+            /* @__PURE__ */ jsxs23("div", { className: "flex flex-wrap items-center gap-1.5", children: [
+              /* @__PURE__ */ jsx25("span", { className: "text-[14px] font-semibold text-text-primary", children: p.brand }),
+              p.tags.map((t) => /* @__PURE__ */ jsx25(BreakdownTag, { children: t }, t))
             ] }),
-            /* @__PURE__ */ jsx24("div", { className: "truncate text-[11.5px] text-text-tertiary", children: p.owner })
+            /* @__PURE__ */ jsx25("div", { className: "truncate text-[11.5px] text-text-tertiary", children: p.owner })
           ] })
         ] }),
-        /* @__PURE__ */ jsx24(MetricCells, { spendN: p.spendN, yoy: p.yoy })
+        /* @__PURE__ */ jsx25(MetricCells, { spendN: p.spendN, yoy: p.yoy })
       ] }, p.brand))
     ] }),
-    rows.length > defaultVisibleCount && (viewAllHref ? /* @__PURE__ */ jsx24("div", { className: cx9("border-t border-border-default py-3", rowPad), children: /* @__PURE__ */ jsx24("a", { href: viewAllHref, className: "text-[12px] font-semibold text-text-link hover:underline", children: "See all publishers" }) }) : /* @__PURE__ */ jsxs22("div", { className: cx9("flex items-center gap-2 border-t border-border-default py-3 text-[12px] text-text-tertiary", rowPad), children: [
-      /* @__PURE__ */ jsxs22("span", { children: [
+    rows.length > defaultVisibleCount && (viewAllHref ? /* @__PURE__ */ jsx25("div", { className: cx9("border-t border-border-default py-3", rowPad), children: /* @__PURE__ */ jsx25("a", { href: viewAllHref, className: "text-[12px] font-semibold text-text-link hover:underline", children: "See all publishers" }) }) : /* @__PURE__ */ jsxs23("div", { className: cx9("flex items-center gap-2 border-t border-border-default py-3 text-[12px] text-text-tertiary", rowPad), children: [
+      /* @__PURE__ */ jsxs23("span", { children: [
         "Showing ",
         visible.length,
         " of ",
         rows.length
       ] }),
-      !showAll ? /* @__PURE__ */ jsxs22("button", { type: "button", onClick: () => setShowAll(true), className: "font-semibold text-text-link hover:underline", children: [
+      !showAll ? /* @__PURE__ */ jsxs23("button", { type: "button", onClick: () => setShowAll(true), className: "font-semibold text-text-link hover:underline", children: [
         "See all (",
         rows.length - defaultVisibleCount,
         " more)"
-      ] }) : /* @__PURE__ */ jsx24("button", { type: "button", onClick: () => setShowAll(false), className: "font-semibold text-text-link hover:underline", children: "Show less" })
+      ] }) : /* @__PURE__ */ jsx25("button", { type: "button", onClick: () => setShowAll(false), className: "font-semibold text-text-link hover:underline", children: "Show less" })
     ] }))
   ] });
 }
@@ -2671,61 +2759,91 @@ import { forwardRef as forwardRef2 } from "react";
 import { Slot } from "@radix-ui/react-slot";
 import { cva } from "class-variance-authority";
 import { Loader2 as Loader22 } from "lucide-react";
-import { jsx as jsx25, jsxs as jsxs23 } from "react/jsx-runtime";
+import { jsx as jsx26, jsxs as jsxs24 } from "react/jsx-runtime";
 var buttonVariants = cva(
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-control font-medium transition-all duration-(--mr-motion-duration-interactive) ease-interactive disabled:pointer-events-none disabled:opacity-40 focus-visible:outline-hidden focus-visible:ring-0",
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-control transition-all duration-(--mr-motion-duration-interactive) ease-interactive disabled:pointer-events-none disabled:opacity-40 focus-visible:outline-hidden focus-visible:ring-0",
   {
     variants: {
       variant: {
         primary: "bg-brand-primaryAction text-brand-onprimary hover:brightness-110",
-        secondary: "bg-surface text-text-primary border border-border-interactive hover:bg-subtle",
+        // border-strong, not border-interactive. The interactive token is #6b6358
+        // -- 5.9:1 against the surface, nearly as dark as body text -- which is
+        // right for an input the eye must find in a form, and far too heavy for
+        // a button sitting beside other buttons. It reads heaviest on icon-only,
+        // where there is least fill inside the line to balance it.
+        secondary: "bg-surface text-text-primary border border-border-strong hover:bg-subtle hover:border-border-interactive",
         ghost: "text-text-primary hover:bg-subtle",
         danger: "bg-status-danger text-status-onstatus hover:brightness-110",
+        // Quiet destructive: neutral at rest, red only on hover. This is what
+        // the product actually reaches for -- nearly every hand-rolled
+        // destructive control is an icon that reddens on hover, while filled
+        // `danger` is right only for the confirm button in a dialog the user
+        // already opened.
+        dangerGhost: "text-text-secondary hover:bg-subtle hover:text-text-danger",
         link: "text-text-link underline-offset-4 hover:underline px-0"
       },
+      // Type scales with the box. One size across all three left xs cramped --
+      // 14px inside a 24px box leaves five pixels above and below, so the label
+      // fills the button instead of sitting in it.
       size: {
+        xs: "h-6 px-2 text-xs",
         sm: "h-8 px-3 text-sm",
-        md: "h-10 px-4 text-sm",
-        lg: "h-11 px-6 text-sm",
-        icon: "h-9 w-9 p-0"
+        md: "h-10 px-4 text-sm"
+      },
+      // Shape is orthogonal to size. As a fourth SIZE, `icon` could only ever
+      // be one dimension, so an icon button never lined up with the labelled
+      // buttons beside it in a toolbar. As a shape it squares the box at
+      // whichever height you picked.
+      iconOnly: {
+        true: "p-0",
+        false: ""
       }
     },
+    compoundVariants: [
+      { size: "xs", iconOnly: true, class: "w-6" },
+      { size: "sm", iconOnly: true, class: "w-8" },
+      { size: "md", iconOnly: true, class: "w-10" },
+      // A boxed button is a target you aim at, so its label carries the weight
+      // of one. `link` sits inline in a sentence, where semibold reads as
+      // emphasis on the words rather than as a control.
+      { variant: ["primary", "secondary", "ghost", "danger", "dangerGhost"], class: "font-semibold" },
+      { variant: "link", class: "font-medium h-auto p-0" }
+    ],
     defaultVariants: {
       variant: "primary",
-      size: "md"
+      size: "md",
+      iconOnly: false
     }
   }
 );
 var Button = forwardRef2(
-  ({ className, variant, size, asChild = false, loading = false, disabled, children, ...props }, ref) => {
-    const Comp = asChild ? Slot : "button";
-    return /* @__PURE__ */ jsxs23(
-      Comp,
-      {
-        className: cn(buttonVariants({ variant, size, className })),
-        ref,
-        disabled: disabled || loading,
-        "aria-busy": loading || void 0,
-        ...props,
-        children: [
-          loading && /* @__PURE__ */ jsx25(Loader22, { className: "size-4 shrink-0 animate-spin", "aria-hidden": "true" }),
-          children
-        ]
-      }
-    );
+  ({ className, variant, size, iconOnly, asChild = false, loading = false, disabled, children, ...props }, ref) => {
+    const shared = {
+      className: cn(buttonVariants({ variant, size, iconOnly, className })),
+      disabled: disabled || loading,
+      "aria-busy": loading || void 0,
+      ...props
+    };
+    if (asChild) {
+      return /* @__PURE__ */ jsx26(Slot, { ref, ...shared, children });
+    }
+    return /* @__PURE__ */ jsxs24("button", { ref, ...shared, children: [
+      loading && /* @__PURE__ */ jsx26(Loader22, { className: "size-4 shrink-0 animate-spin", "aria-hidden": "true" }),
+      children
+    ] });
   }
 );
 Button.displayName = "Button";
 
 // src/FilterDropdownFooter.tsx
-import { jsx as jsx26, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs25 } from "react/jsx-runtime";
 function FilterDropdownFooter({
   onClear,
   onApply,
   clearLabel = "Clear all",
   applyLabel = "Apply"
 }) {
-  return /* @__PURE__ */ jsxs24(
+  return /* @__PURE__ */ jsxs25(
     "div",
     {
       className: cn(
@@ -2733,8 +2851,8 @@ function FilterDropdownFooter({
         onClear ? "justify-between" : "justify-end"
       ),
       children: [
-        onClear && /* @__PURE__ */ jsx26(Button, { type: "button", variant: "ghost", size: "sm", onClick: onClear, children: clearLabel }),
-        /* @__PURE__ */ jsx26(Button, { type: "button", variant: "primary", size: "sm", onClick: onApply, children: applyLabel })
+        onClear && /* @__PURE__ */ jsx27(Button, { type: "button", variant: "ghost", size: "sm", onClick: onClear, children: clearLabel }),
+        /* @__PURE__ */ jsx27(Button, { type: "button", variant: "primary", size: "sm", onClick: onApply, children: applyLabel })
       ]
     }
   );
@@ -2743,7 +2861,7 @@ function FilterDropdownFooter({
 // src/NameListModal.tsx
 import { useEffect as useEffect10, useState as useState11 } from "react";
 import { createPortal as createPortal5 } from "react-dom";
-import { jsx as jsx27, jsxs as jsxs25 } from "react/jsx-runtime";
+import { jsx as jsx28, jsxs as jsxs26 } from "react/jsx-runtime";
 function NameListModal({
   title,
   initialName,
@@ -2768,12 +2886,12 @@ function NameListModal({
     // bg-scrim, not a literal: design-tokens gained a scrim token in 2.5.0.
     // No in-data-[theme=dark] override needed any more -- the token redefines
     // itself under that attribute in dark.css, so one class covers both themes.
-    /* @__PURE__ */ jsx27(
+    /* @__PURE__ */ jsx28(
       "div",
       {
         className: "fixed inset-0 z-70 flex items-center justify-center bg-scrim px-4",
         onMouseDown: (e) => e.target === e.currentTarget && onCancel(),
-        children: /* @__PURE__ */ jsxs25(
+        children: /* @__PURE__ */ jsxs26(
           "div",
           {
             role: "dialog",
@@ -2781,10 +2899,10 @@ function NameListModal({
             "aria-label": title,
             className: "w-full max-w-[420px] rounded-card border border-border-default bg-surface p-5 shadow-overlay",
             children: [
-              /* @__PURE__ */ jsx27("h2", { className: "text-[16px] font-semibold text-text-primary", children: title }),
-              /* @__PURE__ */ jsxs25("div", { className: "mt-4 flex flex-col gap-1.5", children: [
-                /* @__PURE__ */ jsx27("label", { htmlFor: "account-list-name", className: "text-[12px] font-medium text-text-secondary", children: fieldLabel }),
-                /* @__PURE__ */ jsx27(
+              /* @__PURE__ */ jsx28("h2", { className: "text-[16px] font-semibold text-text-primary", children: title }),
+              /* @__PURE__ */ jsxs26("div", { className: "mt-4 flex flex-col gap-1.5", children: [
+                /* @__PURE__ */ jsx28("label", { htmlFor: "account-list-name", className: "text-[12px] font-medium text-text-secondary", children: fieldLabel }),
+                /* @__PURE__ */ jsx28(
                   "input",
                   {
                     id: "account-list-name",
@@ -2796,13 +2914,13 @@ function NameListModal({
                   }
                 )
               ] }),
-              options && options.length > 0 && /* @__PURE__ */ jsx27("div", { className: "mt-4 flex flex-col gap-2.5", children: options.map((o) => /* @__PURE__ */ jsxs25("label", { className: "flex cursor-pointer items-center gap-2.5 text-[13px] text-text-primary", children: [
-                /* @__PURE__ */ jsx27(CheckBox, { checked: !!checked[o.key], onChange: () => toggle(o.key), ariaLabel: o.label }),
+              options && options.length > 0 && /* @__PURE__ */ jsx28("div", { className: "mt-4 flex flex-col gap-2.5", children: options.map((o) => /* @__PURE__ */ jsxs26("label", { className: "flex cursor-pointer items-center gap-2.5 text-[13px] text-text-primary", children: [
+                /* @__PURE__ */ jsx28(CheckBox, { checked: !!checked[o.key], onChange: () => toggle(o.key), ariaLabel: o.label }),
                 o.label
               ] }, o.key)) }),
-              /* @__PURE__ */ jsxs25("div", { className: "mt-5 flex items-center justify-end gap-2", children: [
-                /* @__PURE__ */ jsx27(Button, { variant: "secondary", onClick: onCancel, children: "Cancel" }),
-                /* @__PURE__ */ jsx27(Button, { disabled: !name.trim(), onClick: () => onSubmit(name.trim(), checked), children: submitLabel })
+              /* @__PURE__ */ jsxs26("div", { className: "mt-5 flex items-center justify-end gap-2", children: [
+                /* @__PURE__ */ jsx28(Button, { variant: "secondary", onClick: onCancel, children: "Cancel" }),
+                /* @__PURE__ */ jsx28(Button, { disabled: !name.trim(), onClick: () => onSubmit(name.trim(), checked), children: submitLabel })
               ] })
             ]
           }
@@ -2814,7 +2932,7 @@ function NameListModal({
 }
 
 // src/ChipTrigger.tsx
-import { jsx as jsx28, jsxs as jsxs26 } from "react/jsx-runtime";
+import { jsx as jsx29, jsxs as jsxs27 } from "react/jsx-runtime";
 function chipTriggerClass(variant = "box") {
   return cn(
     "flex h-11 items-center gap-2 rounded-control border bg-input px-2.5 text-text-secondary transition-colors hover:bg-subtle hover:text-text-primary focus-visible:outline-solid focus-visible:outline-2 focus-visible:outline-border-focus",
@@ -2825,13 +2943,13 @@ function chipTriggerClass(variant = "box") {
   );
 }
 function ChipContent({ caption, value, icon }) {
-  const stack = /* @__PURE__ */ jsxs26("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
-    /* @__PURE__ */ jsx28("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: caption }),
-    /* @__PURE__ */ jsx28("span", { className: "text-[12px] font-medium text-text-primary", children: value })
+  const stack = /* @__PURE__ */ jsxs27("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
+    /* @__PURE__ */ jsx29("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: caption }),
+    /* @__PURE__ */ jsx29("span", { className: "text-[12px] font-medium text-text-primary", children: value })
   ] });
   if (icon) {
-    return /* @__PURE__ */ jsxs26("span", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsx28("span", { className: "shrink-0 text-text-tertiary", children: icon }),
+    return /* @__PURE__ */ jsxs27("span", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx29("span", { className: "shrink-0 text-text-tertiary", children: icon }),
       stack
     ] });
   }
@@ -2840,11 +2958,11 @@ function ChipContent({ caption, value, icon }) {
 
 // src/FilterChipBar.tsx
 import { CircleSlash, X as X3 } from "lucide-react";
-import { jsx as jsx29, jsxs as jsxs27 } from "react/jsx-runtime";
+import { jsx as jsx30, jsxs as jsxs28 } from "react/jsx-runtime";
 function FilterChipBar({ chips, onRemove, onClearAll, parkedKeys }) {
   if (chips.length === 0) return null;
-  return /* @__PURE__ */ jsxs27("div", { className: "flex flex-wrap items-center gap-1.5 border-t border-border-default pt-2.5", children: [
-    chips.map((c) => /* @__PURE__ */ jsx29(
+  return /* @__PURE__ */ jsxs28("div", { className: "flex flex-wrap items-center gap-1.5 border-t border-border-default pt-2.5", children: [
+    chips.map((c) => /* @__PURE__ */ jsx30(
       Chip,
       {
         label: c.label,
@@ -2854,7 +2972,7 @@ function FilterChipBar({ chips, onRemove, onClearAll, parkedKeys }) {
       },
       c.key
     )),
-    /* @__PURE__ */ jsx29("button", { type: "button", onClick: onClearAll, className: "ml-1 text-[12px] font-medium text-text-link hover:underline", children: "Clear all" })
+    /* @__PURE__ */ jsx30("button", { type: "button", onClick: onClearAll, className: "ml-1 text-[12px] font-medium text-text-link hover:underline", children: "Clear all" })
   ] });
 }
 function Chip({
@@ -2863,8 +2981,8 @@ function Chip({
   parked,
   onRemove
 }) {
-  return /* @__PURE__ */ jsxs27("span", { className: "group relative inline-flex", children: [
-    /* @__PURE__ */ jsxs27(
+  return /* @__PURE__ */ jsxs28("span", { className: "group relative inline-flex", children: [
+    /* @__PURE__ */ jsxs28(
       "span",
       {
         className: cn(
@@ -2876,22 +2994,22 @@ function Chip({
           ) : "bg-subtle text-text-secondary ring-transparent group-hover:bg-border-default group-hover:text-text-primary group-hover:ring-border-interactive"
         ),
         children: [
-          parked && /* @__PURE__ */ jsx29(CircleSlash, { size: 11, "aria-hidden": "true", className: "shrink-0 text-text-tertiary" }),
+          parked && /* @__PURE__ */ jsx30(CircleSlash, { size: 11, "aria-hidden": "true", className: "shrink-0 text-text-tertiary" }),
           label,
-          /* @__PURE__ */ jsx29(
+          /* @__PURE__ */ jsx30(
             "button",
             {
               type: "button",
               onClick: onRemove,
               "aria-label": `Remove ${groupLabel}: ${label}`,
               className: "text-text-tertiary transition-colors hover:text-text-primary",
-              children: /* @__PURE__ */ jsx29(X3, { size: 12 })
+              children: /* @__PURE__ */ jsx30(X3, { size: 12 })
             }
           )
         ]
       }
     ),
-    /* @__PURE__ */ jsx29(
+    /* @__PURE__ */ jsx30(
       "span",
       {
         role: "tooltip",
@@ -2904,10 +3022,10 @@ function Chip({
 
 // src/SortButton.tsx
 import { ArrowUp, ArrowDown, ArrowUpDown } from "lucide-react";
-import { jsx as jsx30, jsxs as jsxs28 } from "react/jsx-runtime";
+import { jsx as jsx31, jsxs as jsxs29 } from "react/jsx-runtime";
 function SortButton({ label, sortKey, sort, onSort, disabled = false }) {
   const active = !disabled && sort.key === sortKey;
-  return /* @__PURE__ */ jsxs28(
+  return /* @__PURE__ */ jsxs29(
     "button",
     {
       type: "button",
@@ -2935,7 +3053,7 @@ function SortButton({ label, sortKey, sort, onSort, disabled = false }) {
       ),
       children: [
         label,
-        !disabled && (active ? sort.dir === "asc" ? /* @__PURE__ */ jsx30(ArrowUp, { size: 12, className: "shrink-0 text-brand-primaryAction" }) : /* @__PURE__ */ jsx30(ArrowDown, { size: 12, className: "shrink-0 text-brand-primaryAction" }) : /* @__PURE__ */ jsx30(
+        !disabled && (active ? sort.dir === "asc" ? /* @__PURE__ */ jsx31(ArrowUp, { size: 12, className: "shrink-0 text-brand-primaryAction" }) : /* @__PURE__ */ jsx31(ArrowDown, { size: 12, className: "shrink-0 text-brand-primaryAction" }) : /* @__PURE__ */ jsx31(
           ArrowUpDown,
           {
             size: 12,
@@ -2959,7 +3077,7 @@ function sortProp(sort) {
 
 // src/Pager.tsx
 import { ChevronLeft as ChevronLeft3, ChevronRight as ChevronRight4 } from "lucide-react";
-import { jsx as jsx31, jsxs as jsxs29 } from "react/jsx-runtime";
+import { jsx as jsx32, jsxs as jsxs30 } from "react/jsx-runtime";
 function pageWindow(current, total) {
   if (total <= 7) return Array.from({ length: total }, (_, i) => i + 1);
   const keep = /* @__PURE__ */ new Set([1, total, current, current - 1, current + 1]);
@@ -2975,8 +3093,8 @@ function pageWindow(current, total) {
 }
 function Pager({ page, totalPages, onPage }) {
   const btn = "flex h-8 min-w-8 items-center justify-center rounded-control px-2 text-[13px] transition-colors";
-  return /* @__PURE__ */ jsxs29("div", { className: "flex items-center gap-1", children: [
-    /* @__PURE__ */ jsx31(
+  return /* @__PURE__ */ jsxs30("div", { className: "flex items-center gap-1", children: [
+    /* @__PURE__ */ jsx32(
       "button",
       {
         type: "button",
@@ -2984,11 +3102,11 @@ function Pager({ page, totalPages, onPage }) {
         disabled: page === 1,
         "aria-label": "Previous page",
         className: cn(btn, "text-text-secondary hover:bg-subtle hover:text-text-primary disabled:pointer-events-none disabled:opacity-30"),
-        children: /* @__PURE__ */ jsx31(ChevronLeft3, { size: 16 })
+        children: /* @__PURE__ */ jsx32(ChevronLeft3, { size: 16 })
       }
     ),
     pageWindow(page, totalPages).map(
-      (p) => typeof p === "string" ? /* @__PURE__ */ jsx31("span", { className: "px-1 text-[13px] text-text-tertiary", children: "\u2026" }, p) : /* @__PURE__ */ jsx31(
+      (p) => typeof p === "string" ? /* @__PURE__ */ jsx32("span", { className: "px-1 text-[13px] text-text-tertiary", children: "\u2026" }, p) : /* @__PURE__ */ jsx32(
         "button",
         {
           type: "button",
@@ -3003,7 +3121,7 @@ function Pager({ page, totalPages, onPage }) {
         p
       )
     ),
-    /* @__PURE__ */ jsx31(
+    /* @__PURE__ */ jsx32(
       "button",
       {
         type: "button",
@@ -3011,14 +3129,14 @@ function Pager({ page, totalPages, onPage }) {
         disabled: page === totalPages,
         "aria-label": "Next page",
         className: cn(btn, "text-text-secondary hover:bg-subtle hover:text-text-primary disabled:pointer-events-none disabled:opacity-30"),
-        children: /* @__PURE__ */ jsx31(ChevronRight4, { size: 16 })
+        children: /* @__PURE__ */ jsx32(ChevronRight4, { size: 16 })
       }
     )
   ] });
 }
 
 // src/WorkspaceAvatar.tsx
-import { jsx as jsx32 } from "react/jsx-runtime";
+import { jsx as jsx33 } from "react/jsx-runtime";
 function workspaceInitials(name) {
   const words = name.trim().split(/\s+/).filter(Boolean);
   if (words.length === 0) return "\xB7";
@@ -3034,7 +3152,7 @@ var SIZES = {
   lg: "h-11 w-11 text-[15px]"
 };
 function WorkspaceAvatar({ name, size = "md" }) {
-  return /* @__PURE__ */ jsx32(
+  return /* @__PURE__ */ jsx33(
     "span",
     {
       "aria-hidden": "true",
@@ -3048,13 +3166,19 @@ function WorkspaceAvatar({ name, size = "md" }) {
 }
 
 // src/Tag.tsx
-import { jsx as jsx33 } from "react/jsx-runtime";
+import { jsx as jsx34 } from "react/jsx-runtime";
 function Tag({ children, className }) {
-  return /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsx34(
     "span",
     {
       className: cn(
-        "inline-flex items-center whitespace-nowrap rounded-full bg-subtle px-2 py-0.5 text-[11px] font-medium text-text-secondary",
+        // text-micro and tertiary ink. The component used to sit at 11px in
+        // secondary -- a step darker than the ten hand-rolled copies the audit
+        // found, which had independently drifted to tertiary. Ten people
+        // reaching for "quieter" is worth more than the component's original
+        // guess: a tag names what a row IS, which is background to the row
+        // itself rather than part of it.
+        "inline-flex items-center whitespace-nowrap rounded-full bg-subtle px-2 py-0.5 text-micro font-medium text-text-tertiary",
         className
       ),
       children
@@ -3064,7 +3188,7 @@ function Tag({ children, className }) {
 
 // src/TablePagination.tsx
 import { ChevronDown as ChevronDown9, ChevronFirst, ChevronLast, ChevronLeft as ChevronLeft4, ChevronRight as ChevronRight5 } from "lucide-react";
-import { jsx as jsx34, jsxs as jsxs30 } from "react/jsx-runtime";
+import { jsx as jsx35, jsxs as jsxs31 } from "react/jsx-runtime";
 function TablePagination({
   page,
   perPage,
@@ -3084,20 +3208,20 @@ function TablePagination({
     btn,
     "text-text-secondary hover:bg-subtle hover:text-text-primary disabled:pointer-events-none disabled:opacity-30"
   );
-  return /* @__PURE__ */ jsxs30("div", { className: cn("flex flex-wrap items-center justify-between gap-x-4 gap-y-2", className), children: [
-    /* @__PURE__ */ jsxs30("label", { className: "flex items-center gap-2 text-[13px] text-text-secondary", children: [
-      /* @__PURE__ */ jsxs30("span", { className: "relative", children: [
-        /* @__PURE__ */ jsx34(
+  return /* @__PURE__ */ jsxs31("div", { className: cn("flex flex-wrap items-center justify-between gap-x-4 gap-y-2", className), children: [
+    /* @__PURE__ */ jsxs31("label", { className: "flex items-center gap-2 text-[13px] text-text-secondary", children: [
+      /* @__PURE__ */ jsxs31("span", { className: "relative", children: [
+        /* @__PURE__ */ jsx35(
           "select",
           {
             value: perPage,
             onChange: (e) => onPerPageChange(Number(e.target.value)),
             "aria-label": "Items per page",
             className: "appearance-none rounded-control border border-border-default bg-input py-1 pl-2.5 pr-7 text-[13px] font-medium text-text-primary focus:outline focus:outline-2 focus:outline-border-focus",
-            children: perPageOptions.map((n) => /* @__PURE__ */ jsx34("option", { value: n, children: n }, n))
+            children: perPageOptions.map((n) => /* @__PURE__ */ jsx35("option", { value: n, children: n }, n))
           }
         ),
-        /* @__PURE__ */ jsx34(
+        /* @__PURE__ */ jsx35(
           ChevronDown9,
           {
             size: 13,
@@ -3108,8 +3232,8 @@ function TablePagination({
       ] }),
       "items per page"
     ] }),
-    /* @__PURE__ */ jsxs30("nav", { className: "flex items-center gap-1", "aria-label": "Pagination", children: [
-      /* @__PURE__ */ jsx34(
+    /* @__PURE__ */ jsxs31("nav", { className: "flex items-center gap-1", "aria-label": "Pagination", children: [
+      /* @__PURE__ */ jsx35(
         "button",
         {
           type: "button",
@@ -3117,10 +3241,10 @@ function TablePagination({
           disabled: current === 1,
           "aria-label": "First page",
           className: stepBtn,
-          children: /* @__PURE__ */ jsx34(ChevronFirst, { size: 16, "aria-hidden": "true" })
+          children: /* @__PURE__ */ jsx35(ChevronFirst, { size: 16, "aria-hidden": "true" })
         }
       ),
-      /* @__PURE__ */ jsx34(
+      /* @__PURE__ */ jsx35(
         "button",
         {
           type: "button",
@@ -3128,11 +3252,11 @@ function TablePagination({
           disabled: current === 1,
           "aria-label": "Previous page",
           className: stepBtn,
-          children: /* @__PURE__ */ jsx34(ChevronLeft4, { size: 16, "aria-hidden": "true" })
+          children: /* @__PURE__ */ jsx35(ChevronLeft4, { size: 16, "aria-hidden": "true" })
         }
       ),
       pageWindow(current, totalPages).map(
-        (p) => typeof p === "string" ? /* @__PURE__ */ jsx34("span", { className: "px-1 text-[13px] text-text-tertiary", children: "\u2026" }, p) : /* @__PURE__ */ jsx34(
+        (p) => typeof p === "string" ? /* @__PURE__ */ jsx35("span", { className: "px-1 text-[13px] text-text-tertiary", children: "\u2026" }, p) : /* @__PURE__ */ jsx35(
           "button",
           {
             type: "button",
@@ -3147,7 +3271,7 @@ function TablePagination({
           p
         )
       ),
-      /* @__PURE__ */ jsx34(
+      /* @__PURE__ */ jsx35(
         "button",
         {
           type: "button",
@@ -3155,10 +3279,10 @@ function TablePagination({
           disabled: current === totalPages,
           "aria-label": "Next page",
           className: stepBtn,
-          children: /* @__PURE__ */ jsx34(ChevronRight5, { size: 16, "aria-hidden": "true" })
+          children: /* @__PURE__ */ jsx35(ChevronRight5, { size: 16, "aria-hidden": "true" })
         }
       ),
-      /* @__PURE__ */ jsx34(
+      /* @__PURE__ */ jsx35(
         "button",
         {
           type: "button",
@@ -3166,11 +3290,11 @@ function TablePagination({
           disabled: current === totalPages,
           "aria-label": "Last page",
           className: stepBtn,
-          children: /* @__PURE__ */ jsx34(ChevronLast, { size: 16, "aria-hidden": "true" })
+          children: /* @__PURE__ */ jsx35(ChevronLast, { size: 16, "aria-hidden": "true" })
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs30("span", { className: "text-[13px] text-text-tertiary tabular-nums", children: [
+    /* @__PURE__ */ jsxs31("span", { className: "text-[13px] text-text-tertiary tabular-nums", children: [
       rangeStart.toLocaleString(),
       " \u2013 ",
       rangeEnd.toLocaleString(),
@@ -3185,7 +3309,7 @@ function TablePagination({
 // src/DateRangePicker.tsx
 import { useEffect as useEffect11, useMemo as useMemo4, useRef as useRef11, useState as useState12 } from "react";
 import { ChevronDown as ChevronDown10 } from "lucide-react";
-import { jsx as jsx35, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx36, jsxs as jsxs32 } from "react/jsx-runtime";
 var MONTH_ABBR = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
 var QUARTER_ABBR = ["Q1", "Q2", "Q3", "Q4"];
 var PRESETS = ["Rolling 3 months", "Rolling 6 months", "Rolling 12 months"];
@@ -3221,7 +3345,7 @@ function spanLabel(label, today) {
   return `${fmtDate(s)} \u2013 ${fmtDate(e)}`;
 }
 function MiniSelect({ value, onChange, options }) {
-  return /* @__PURE__ */ jsx35(
+  return /* @__PURE__ */ jsx36(
     "select",
     {
       value: String(value),
@@ -3230,7 +3354,7 @@ function MiniSelect({ value, onChange, options }) {
         if (opt) onChange(opt.value);
       },
       className: "rounded-control border border-border-default bg-input px-1.5 py-1 text-[12px] text-text-primary outline-hidden focus:border-border-focus",
-      children: options.map((o) => /* @__PURE__ */ jsx35("option", { value: String(o.value), children: o.label }, String(o.value)))
+      children: options.map((o) => /* @__PURE__ */ jsx36("option", { value: String(o.value), children: o.label }, String(o.value)))
     }
   );
 }
@@ -3291,8 +3415,8 @@ function DateRangePicker({
     if (showFooter) setDraft(label);
     else commit(label);
   };
-  return /* @__PURE__ */ jsxs31("div", { className: "relative", ref, children: [
-    /* @__PURE__ */ jsxs31(
+  return /* @__PURE__ */ jsxs32("div", { className: "relative", ref, children: [
+    /* @__PURE__ */ jsxs32(
       "button",
       {
         type: "button",
@@ -3301,16 +3425,16 @@ function DateRangePicker({
         "aria-haspopup": "listbox",
         className: chipTriggerClass(),
         children: [
-          /* @__PURE__ */ jsxs31("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
-            /* @__PURE__ */ jsx35("span", { className: "text-[10px] text-text-tertiary", children: spanLabel(value, end) }),
-            /* @__PURE__ */ jsx35("span", { className: "text-[12px] font-medium text-text-primary", children: value })
+          /* @__PURE__ */ jsxs32("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
+            /* @__PURE__ */ jsx36("span", { className: "text-[10px] text-text-tertiary", children: spanLabel(value, end) }),
+            /* @__PURE__ */ jsx36("span", { className: "text-[12px] font-medium text-text-primary", children: value })
           ] }),
-          /* @__PURE__ */ jsx35(ChevronDown10, { size: 14, "aria-hidden": "true", className: cn("shrink-0 text-text-secondary transition-transform", open && "rotate-180") })
+          /* @__PURE__ */ jsx36(ChevronDown10, { size: 14, "aria-hidden": "true", className: cn("shrink-0 text-text-secondary transition-transform", open && "rotate-180") })
         ]
       }
     ),
-    open && /* @__PURE__ */ jsxs31("div", { className: cn("absolute top-[calc(100%+8px)] z-30 w-[280px] overflow-hidden rounded-card border border-border-default bg-surface py-1 shadow-overlay", align === "right" ? "right-0" : "left-0"), children: [
-      presets.map((p) => /* @__PURE__ */ jsx35(
+    open && /* @__PURE__ */ jsxs32("div", { className: cn("absolute top-[calc(100%+8px)] z-30 w-[280px] overflow-hidden rounded-card border border-border-default bg-surface py-1 shadow-overlay", align === "right" ? "right-0" : "left-0"), children: [
+      presets.map((p) => /* @__PURE__ */ jsx36(
         "button",
         {
           type: "button",
@@ -3320,26 +3444,26 @@ function DateRangePicker({
         },
         p
       )),
-      /* @__PURE__ */ jsxs31("div", { className: "mt-1 border-t border-border-default px-3 pb-2 pt-2", children: [
-        /* @__PURE__ */ jsx35("div", { className: "text-[13px] font-semibold text-text-primary", children: "Custom Range" }),
-        /* @__PURE__ */ jsxs31("div", { className: "mt-2 flex flex-col gap-2", children: [
-          /* @__PURE__ */ jsxs31("label", { className: "flex items-center justify-between gap-2 text-[12px] text-text-secondary", children: [
+      /* @__PURE__ */ jsxs32("div", { className: "mt-1 border-t border-border-default px-3 pb-2 pt-2", children: [
+        /* @__PURE__ */ jsx36("div", { className: "text-[13px] font-semibold text-text-primary", children: "Custom Range" }),
+        /* @__PURE__ */ jsxs32("div", { className: "mt-2 flex flex-col gap-2", children: [
+          /* @__PURE__ */ jsxs32("label", { className: "flex items-center justify-between gap-2 text-[12px] text-text-secondary", children: [
             "From",
-            /* @__PURE__ */ jsxs31("span", { className: "flex gap-1", children: [
-              granularity === "month" && /* @__PURE__ */ jsx35(MiniSelect, { value: fromMo, onChange: setFromMo, options: MONTH_ABBR.map((mm, i) => ({ label: mm, value: i })) }),
-              granularity === "quarter" && /* @__PURE__ */ jsx35(MiniSelect, { value: fromQ, onChange: setFromQ, options: QUARTER_ABBR.map((qq, i) => ({ label: qq, value: i })) }),
-              /* @__PURE__ */ jsx35(MiniSelect, { value: fromYr, onChange: setFromYr, options: yearOptions.map((y) => ({ label: String(y), value: y })) })
+            /* @__PURE__ */ jsxs32("span", { className: "flex gap-1", children: [
+              granularity === "month" && /* @__PURE__ */ jsx36(MiniSelect, { value: fromMo, onChange: setFromMo, options: MONTH_ABBR.map((mm, i) => ({ label: mm, value: i })) }),
+              granularity === "quarter" && /* @__PURE__ */ jsx36(MiniSelect, { value: fromQ, onChange: setFromQ, options: QUARTER_ABBR.map((qq, i) => ({ label: qq, value: i })) }),
+              /* @__PURE__ */ jsx36(MiniSelect, { value: fromYr, onChange: setFromYr, options: yearOptions.map((y) => ({ label: String(y), value: y })) })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs31("label", { className: "flex items-center justify-between gap-2 text-[12px] text-text-secondary", children: [
+          /* @__PURE__ */ jsxs32("label", { className: "flex items-center justify-between gap-2 text-[12px] text-text-secondary", children: [
             "To",
-            /* @__PURE__ */ jsxs31("span", { className: "flex gap-1", children: [
-              granularity === "month" && /* @__PURE__ */ jsx35(MiniSelect, { value: toMo, onChange: setToMo, options: MONTH_ABBR.map((mm, i) => ({ label: mm, value: i })) }),
-              granularity === "quarter" && /* @__PURE__ */ jsx35(MiniSelect, { value: toQ, onChange: setToQ, options: QUARTER_ABBR.map((qq, i) => ({ label: qq, value: i })) }),
-              /* @__PURE__ */ jsx35(MiniSelect, { value: toYr, onChange: setToYr, options: yearOptions.map((y) => ({ label: String(y), value: y })) })
+            /* @__PURE__ */ jsxs32("span", { className: "flex gap-1", children: [
+              granularity === "month" && /* @__PURE__ */ jsx36(MiniSelect, { value: toMo, onChange: setToMo, options: MONTH_ABBR.map((mm, i) => ({ label: mm, value: i })) }),
+              granularity === "quarter" && /* @__PURE__ */ jsx36(MiniSelect, { value: toQ, onChange: setToQ, options: QUARTER_ABBR.map((qq, i) => ({ label: qq, value: i })) }),
+              /* @__PURE__ */ jsx36(MiniSelect, { value: toYr, onChange: setToYr, options: yearOptions.map((y) => ({ label: String(y), value: y })) })
             ] })
           ] }),
-          /* @__PURE__ */ jsx35(
+          /* @__PURE__ */ jsx36(
             "button",
             {
               type: "button",
@@ -3351,7 +3475,7 @@ function DateRangePicker({
           )
         ] })
       ] }),
-      showFooter && /* @__PURE__ */ jsx35(FilterDropdownFooter, { onApply: () => commit(draft) })
+      showFooter && /* @__PURE__ */ jsx36(FilterDropdownFooter, { onApply: () => commit(draft) })
     ] })
   ] });
 }
@@ -3359,7 +3483,7 @@ function DateRangePicker({
 // src/MultiSelectFilter.tsx
 import { useCallback as useCallback4, useEffect as useEffect12, useRef as useRef12, useState as useState13 } from "react";
 import { ChevronDown as ChevronDown11, Check as Check7, Minus as Minus2, Search as Search5, X as X4 } from "lucide-react";
-import { jsx as jsx36, jsxs as jsxs32 } from "react/jsx-runtime";
+import { jsx as jsx37, jsxs as jsxs33 } from "react/jsx-runtime";
 function MultiSelectFilter({
   caption,
   options = [],
@@ -3450,8 +3574,8 @@ function MultiSelectFilter({
     const kids = live.filter((c) => c.label.toLowerCase().includes(ql));
     return kids.length ? { ...g, children: kids } : null;
   }).filter((g) => g !== null) : [];
-  return /* @__PURE__ */ jsxs32("div", { className: cn("relative", fullWidth && "w-full"), ref, children: [
-    /* @__PURE__ */ jsxs32(
+  return /* @__PURE__ */ jsxs33("div", { className: cn("relative", fullWidth && "w-full"), ref, children: [
+    /* @__PURE__ */ jsxs33(
       "button",
       {
         type: "button",
@@ -3459,8 +3583,8 @@ function MultiSelectFilter({
         "aria-expanded": open,
         className: cn(chipTriggerClass(variant), fullWidth && "w-full justify-between"),
         children: [
-          /* @__PURE__ */ jsx36(ChipContent, { caption, value, icon }),
-          /* @__PURE__ */ jsx36(
+          /* @__PURE__ */ jsx37(ChipContent, { caption, value, icon }),
+          /* @__PURE__ */ jsx37(
             ChevronDown11,
             {
               size: 14,
@@ -3471,7 +3595,7 @@ function MultiSelectFilter({
         ]
       }
     ),
-    open && /* @__PURE__ */ jsxs32(
+    open && /* @__PURE__ */ jsxs33(
       "div",
       {
         className: cn(
@@ -3482,9 +3606,9 @@ function MultiSelectFilter({
         role: "dialog",
         "aria-label": caption,
         children: [
-          searchable && /* @__PURE__ */ jsx36("div", { className: "border-b border-border-default p-2", children: /* @__PURE__ */ jsxs32("div", { className: "flex h-9 items-center gap-2 rounded-control border border-border-default bg-input px-2.5", children: [
-            /* @__PURE__ */ jsx36(Search5, { size: 14, className: "text-text-secondary", "aria-hidden": "true" }),
-            /* @__PURE__ */ jsx36(
+          searchable && /* @__PURE__ */ jsx37("div", { className: "border-b border-border-default p-2", children: /* @__PURE__ */ jsxs33("div", { className: "flex h-9 items-center gap-2 rounded-control border border-border-default bg-input px-2.5", children: [
+            /* @__PURE__ */ jsx37(Search5, { size: 14, className: "text-text-secondary", "aria-hidden": "true" }),
+            /* @__PURE__ */ jsx37(
               "input",
               {
                 type: "text",
@@ -3494,37 +3618,37 @@ function MultiSelectFilter({
                 className: "h-full flex-1 bg-transparent text-[13px] outline-hidden placeholder:text-text-tertiary"
               }
             ),
-            q && /* @__PURE__ */ jsx36("button", { type: "button", onClick: () => setQ(""), "aria-label": "Clear search", className: "text-text-tertiary hover:text-text-primary", children: /* @__PURE__ */ jsx36(X4, { size: 13 }) })
+            q && /* @__PURE__ */ jsx37("button", { type: "button", onClick: () => setQ(""), "aria-label": "Clear search", className: "text-text-tertiary hover:text-text-primary", children: /* @__PURE__ */ jsx37(X4, { size: 13 }) })
           ] }) }),
-          /* @__PURE__ */ jsxs32("div", { className: "max-h-[280px] overflow-y-auto p-1", children: [
+          /* @__PURE__ */ jsxs33("div", { className: "max-h-[280px] overflow-y-auto p-1", children: [
             groups ? visibleGroups.map((g) => {
               const state = groupState(g);
-              return /* @__PURE__ */ jsxs32("div", { children: [
-                /* @__PURE__ */ jsxs32(
+              return /* @__PURE__ */ jsxs33("div", { children: [
+                /* @__PURE__ */ jsxs33(
                   "button",
                   {
                     type: "button",
                     onClick: () => toggleGroup(g),
                     className: "flex w-full items-center gap-2.5 rounded-control px-2 py-2 text-left transition-colors hover:bg-subtle",
                     children: [
-                      /* @__PURE__ */ jsx36(TriCheck, { state }),
-                      /* @__PURE__ */ jsx36("span", { className: cn("flex-1 text-[14px] text-text-primary", !plainParent && "font-semibold"), children: g.label }),
-                      counts && /* @__PURE__ */ jsx36(OptionCount, { n: countFor(g.id) })
+                      /* @__PURE__ */ jsx37(TriCheck, { state }),
+                      /* @__PURE__ */ jsx37("span", { className: cn("flex-1 text-[14px] text-text-primary", !plainParent && "font-semibold"), children: g.label }),
+                      counts && /* @__PURE__ */ jsx37(OptionCount, { n: countFor(g.id) })
                     ]
                   }
                 ),
                 g.children.map((c) => {
                   const checked = draft.includes(c.id);
-                  return /* @__PURE__ */ jsxs32(
+                  return /* @__PURE__ */ jsxs33(
                     "button",
                     {
                       type: "button",
                       onClick: () => toggle(c.id),
                       className: "flex w-full items-center gap-2.5 rounded-control py-2 pl-9 pr-2 text-left transition-colors hover:bg-subtle",
                       children: [
-                        /* @__PURE__ */ jsx36(TriCheck, { state: checked ? "all" : "none" }),
-                        /* @__PURE__ */ jsx36("span", { className: "flex-1 text-[14px] text-text-primary", children: c.label }),
-                        counts && /* @__PURE__ */ jsx36(OptionCount, { n: countFor(c.id) })
+                        /* @__PURE__ */ jsx37(TriCheck, { state: checked ? "all" : "none" }),
+                        /* @__PURE__ */ jsx37("span", { className: "flex-1 text-[14px] text-text-primary", children: c.label }),
+                        counts && /* @__PURE__ */ jsx37(OptionCount, { n: countFor(c.id) })
                       ]
                     },
                     c.id
@@ -3533,33 +3657,33 @@ function MultiSelectFilter({
               ] }, g.id);
             }) : items.map((o) => {
               const checked = draft.includes(o.id);
-              return /* @__PURE__ */ jsxs32(
+              return /* @__PURE__ */ jsxs33(
                 "button",
                 {
                   type: "button",
                   onClick: () => toggle(o.id),
                   className: "flex w-full items-center gap-2.5 rounded-control px-2 py-2 text-left transition-colors hover:bg-subtle",
                   children: [
-                    /* @__PURE__ */ jsx36(
+                    /* @__PURE__ */ jsx37(
                       "span",
                       {
                         className: cn(
                           "flex h-[18px] w-[18px] shrink-0 items-center justify-center rounded-[5px] border transition-colors",
                           checked ? "border-transparent bg-brand-primaryAction text-brand-onprimary" : "border-border-interactive bg-input"
                         ),
-                        children: checked && /* @__PURE__ */ jsx36(Check7, { size: 13, strokeWidth: 3 })
+                        children: checked && /* @__PURE__ */ jsx37(Check7, { size: 13, strokeWidth: 3 })
                       }
                     ),
-                    /* @__PURE__ */ jsx36("span", { className: "flex-1 text-[14px] text-text-primary", children: o.label }),
-                    counts && /* @__PURE__ */ jsx36(OptionCount, { n: countFor(o.id) })
+                    /* @__PURE__ */ jsx37("span", { className: "flex-1 text-[14px] text-text-primary", children: o.label }),
+                    counts && /* @__PURE__ */ jsx37(OptionCount, { n: countFor(o.id) })
                   ]
                 },
                 o.id
               );
             }),
-            (groups && !visibleGroups.length || !groups && !items.length) && /* @__PURE__ */ jsx36("div", { className: "py-6 text-center text-[13px] text-text-tertiary", children: "No matches." })
+            (groups && !visibleGroups.length || !groups && !items.length) && /* @__PURE__ */ jsx37("div", { className: "py-6 text-center text-[13px] text-text-tertiary", children: "No matches." })
           ] }),
-          showFooter ? /* @__PURE__ */ jsx36(FilterDropdownFooter, { onClear: () => setDraft(clearValue), onApply: apply }) : min === 0 && draft.length > 0 && /* @__PURE__ */ jsx36("div", { className: "border-t border-border-default p-2", children: /* @__PURE__ */ jsxs32(
+          showFooter ? /* @__PURE__ */ jsx37(FilterDropdownFooter, { onClear: () => setDraft(clearValue), onApply: apply }) : min === 0 && draft.length > 0 && /* @__PURE__ */ jsx37("div", { className: "border-t border-border-default p-2", children: /* @__PURE__ */ jsxs33(
             "button",
             {
               type: "button",
@@ -3578,7 +3702,7 @@ function MultiSelectFilter({
 }
 function TriCheck({ state }) {
   const filled = state !== "none";
-  return /* @__PURE__ */ jsxs32(
+  return /* @__PURE__ */ jsxs33(
     "span",
     {
       className: cn(
@@ -3586,14 +3710,14 @@ function TriCheck({ state }) {
         filled ? "border-transparent bg-brand-primaryAction text-brand-onprimary" : "border-border-interactive bg-input"
       ),
       children: [
-        state === "all" && /* @__PURE__ */ jsx36(Check7, { size: 13, strokeWidth: 3 }),
-        state === "some" && /* @__PURE__ */ jsx36(Minus2, { size: 13, strokeWidth: 3 })
+        state === "all" && /* @__PURE__ */ jsx37(Check7, { size: 13, strokeWidth: 3 }),
+        state === "some" && /* @__PURE__ */ jsx37(Minus2, { size: 13, strokeWidth: 3 })
       ]
     }
   );
 }
 function OptionCount({ n }) {
-  return /* @__PURE__ */ jsxs32("span", { className: "shrink-0 text-[12px] tabular-nums text-text-tertiary", children: [
+  return /* @__PURE__ */ jsxs33("span", { className: "shrink-0 text-[12px] tabular-nums text-text-tertiary", children: [
     "(",
     n.toLocaleString(),
     ")"
@@ -3601,14 +3725,14 @@ function OptionCount({ n }) {
 }
 
 // src/Toggle.tsx
-import { jsx as jsx37 } from "react/jsx-runtime";
+import { jsx as jsx38 } from "react/jsx-runtime";
 var SIZES2 = {
   sm: { track: "h-5 w-9", knob: "h-4 w-4", on: "translate-x-[18px]" },
   md: { track: "h-6 w-11", knob: "h-5 w-5", on: "translate-x-[22px]" }
 };
 function Toggle({ checked, onChange, label, size = "md", disabled, className }) {
   const s = SIZES2[size];
-  return /* @__PURE__ */ jsx37(
+  return /* @__PURE__ */ jsx38(
     "button",
     {
       type: "button",
@@ -3624,7 +3748,7 @@ function Toggle({ checked, onChange, label, size = "md", disabled, className })
         disabled && "cursor-not-allowed opacity-50",
         className
       ),
-      children: /* @__PURE__ */ jsx37(
+      children: /* @__PURE__ */ jsx38(
         "span",
         {
           className: cn(
@@ -3641,20 +3765,20 @@ function Toggle({ checked, onChange, label, size = "md", disabled, className })
 // src/AISpark.tsx
 import { useId as useId2 } from "react";
 import { Sparkles } from "lucide-react";
-import { Fragment as Fragment5, jsx as jsx38, jsxs as jsxs33 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx39, jsxs as jsxs34 } from "react/jsx-runtime";
 function AISpark({ size = 16, className }) {
   const id = useId2();
-  return /* @__PURE__ */ jsxs33(Fragment5, { children: [
-    /* @__PURE__ */ jsx38("svg", { width: "0", height: "0", "aria-hidden": "true", style: { position: "absolute" }, children: /* @__PURE__ */ jsx38("defs", { children: /* @__PURE__ */ jsxs33("linearGradient", { id, x1: "0", y1: "0", x2: "1", y2: "1", children: [
-      /* @__PURE__ */ jsx38("stop", { offset: "0%", stopColor: "var(--mr-color-brand-primary)" }),
-      /* @__PURE__ */ jsx38("stop", { offset: "100%", className: "[stop-color:#9474ff] in-data-[theme=dark]:[stop-color:#a488ff]" })
+  return /* @__PURE__ */ jsxs34(Fragment5, { children: [
+    /* @__PURE__ */ jsx39("svg", { width: "0", height: "0", "aria-hidden": "true", style: { position: "absolute" }, children: /* @__PURE__ */ jsx39("defs", { children: /* @__PURE__ */ jsxs34("linearGradient", { id, x1: "0", y1: "0", x2: "1", y2: "1", children: [
+      /* @__PURE__ */ jsx39("stop", { offset: "0%", stopColor: "var(--mr-color-brand-primary)" }),
+      /* @__PURE__ */ jsx39("stop", { offset: "100%", className: "[stop-color:#9474ff] in-data-[theme=dark]:[stop-color:#a488ff]" })
     ] }) }) }),
-    /* @__PURE__ */ jsx38(Sparkles, { size, stroke: `url(#${id})`, className, "aria-hidden": "true" })
+    /* @__PURE__ */ jsx39(Sparkles, { size, stroke: `url(#${id})`, className, "aria-hidden": "true" })
   ] });
 }
 
 // src/Freshness.tsx
-import { jsx as jsx39 } from "react/jsx-runtime";
+import { jsx as jsx40 } from "react/jsx-runtime";
 var dotColor = {
   fresh: "bg-status-success",
   recent: "bg-status-warning",
@@ -3666,7 +3790,7 @@ var srLabel = {
   stale: "Older than a day"
 };
 function Freshness({ level }) {
-  return /* @__PURE__ */ jsx39(
+  return /* @__PURE__ */ jsx40(
     "span",
     {
       className: cn("inline-block h-1.5 w-1.5 shrink-0 rounded-full", dotColor[level]),
@@ -3691,6 +3815,7 @@ export {
   DataScopeFilter,
   DateRangeFilter,
   DateRangePicker,
+  Delta,
   FilterChipBar,
   FilterDropdownFooter,
   Freshness,