@mediaradar/design-components 0.15.0 → 0.16.1

package/dist/index.cjs

@@ -35,6 +35,7 @@ __export(index_exports, {
   DataScopeFilter: () => DataScopeFilter,
   DateRangeFilter: () => DateRangeFilter,
   DateRangePicker: () => DateRangePicker,
+  Delta: () => Delta,
   FilterChipBar: () => FilterChipBar,
   FilterDropdownFooter: () => FilterDropdownFooter,
   Freshness: () => Freshness,
@@ -554,9 +555,33 @@ function Badge({ tone = "neutral", kind = "label", dot = false, children, classN
   );
 }
 
-// src/CheckBox.tsx
+// src/Delta.tsx
 var import_lucide_react4 = require("lucide-react");
 var import_jsx_runtime5 = require("react/jsx-runtime");
+function Delta({ value, suffix = "%", arrow = false, period, className }) {
+  const up = value >= 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+    "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__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react4.ArrowUpRight, { size: 13, "aria-hidden": "true" }) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react4.ArrowDownRight, { size: 13, "aria-hidden": "true" })),
+        up ? "+" : "\u2212",
+        Math.abs(value).toFixed(1),
+        suffix,
+        period && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "ml-0.5", children: period })
+      ]
+    }
+  );
+}
+
+// src/CheckBox.tsx
+var import_lucide_react5 = require("lucide-react");
+var import_jsx_runtime6 = require("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",
@@ -565,8 +590,8 @@ function boxClass(on, disabled) {
   );
 }
 function Glyph({ checked, indeterminate }) {
-  if (indeterminate) return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react4.Minus, { size: 13, strokeWidth: 3 });
-  return checked ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_lucide_react4.Check, { size: 13, strokeWidth: 3 }) : null;
+  if (indeterminate) return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react5.Minus, { size: 13, strokeWidth: 3 });
+  return checked ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react5.Check, { size: 13, strokeWidth: 3 }) : null;
 }
 function CheckBox({
   checked,
@@ -580,7 +605,7 @@ function CheckBox({
   className
 }) {
   const on = checked || !!indeterminate;
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
     "button",
     {
       type: "button",
@@ -604,18 +629,18 @@ function CheckBox({
         disabled && "hover:border-border-interactive",
         className
       ),
-      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Glyph, { checked, indeterminate })
+      children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Glyph, { checked, indeterminate })
     }
   );
 }
 function CheckBoxBox({ checked, indeterminate, disabled, className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { "aria-hidden": "true", className: cn(boxClass(checked || !!indeterminate, disabled), className), children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Glyph, { checked, indeterminate }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { "aria-hidden": "true", className: cn(boxClass(checked || !!indeterminate, disabled), className), children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Glyph, { checked, indeterminate }) });
 }
 
 // src/DateRangeFilter.tsx
 var import_react3 = require("react");
-var import_lucide_react5 = require("lucide-react");
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_lucide_react6 = require("lucide-react");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 var DEFAULT_SHORTCUTS = [
   "Year to date",
   "Rolling 3 months",
@@ -821,8 +846,8 @@ function DateRangeFilter({
     onRangeChange?.(s, e);
     setOpen(false);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "relative", ref, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "relative", ref, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
       "button",
       {
         type: "button",
@@ -831,16 +856,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__ */ (0, import_jsx_runtime6.jsx)("span", { className: "shrink-0 text-text-tertiary", children: icon }),
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: showDates ? "text-[11px] text-text-tertiary" : "text-[10px] uppercase tracking-wide text-text-tertiary", children: showDates ? displayDatesLine : caption }),
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-[12px] font-medium text-text-primary", children: displayValue })
+          icon && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "shrink-0 text-text-tertiary", children: icon }),
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: showDates ? "text-[11px] text-text-tertiary" : "text-[10px] uppercase tracking-wide text-text-tertiary", children: showDates ? displayDatesLine : caption }),
+            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-[12px] font-medium text-text-primary", children: displayValue })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react5.ChevronDown, { size: 14, "aria-hidden": "true", className: `shrink-0 text-text-secondary transition-transform ${open ? "rotate-180" : ""}` })
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_lucide_react6.ChevronDown, { size: 14, "aria-hidden": "true", className: `shrink-0 text-text-secondary transition-transform ${open ? "rotate-180" : ""}` })
         ]
       }
     ),
-    open && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+    open && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
       "div",
       {
         "data-testid": testIdPrefix && `${testIdPrefix}-popover`,
@@ -848,7 +873,7 @@ function DateRangeFilter({
         role: "dialog",
         "aria-label": "Select date range",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "flex w-44 shrink-0 flex-col gap-0.5 border-r border-border-default p-2", children: SHORTCUTS.map((s) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "flex w-44 shrink-0 flex-col gap-0.5 border-r border-border-default p-2", children: SHORTCUTS.map((s) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
             "button",
             {
               type: "button",
@@ -859,28 +884,28 @@ function DateRangeFilter({
             },
             s
           )) }),
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex flex-col p-4", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-end gap-3", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Field, { label: "Start Date", value: start ? fmt(start) : "\u2014" }),
-              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "pb-2.5 text-text-tertiary", children: "\u2014" }),
-              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Field, { label: "End Date", value: end ? fmt(end) : start ? fmt(start) : "\u2014" })
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex flex-col p-4", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-end gap-3", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Field, { label: "Start Date", value: start ? fmt(start) : "\u2014" }),
+              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "pb-2.5 text-text-tertiary", children: "\u2014" }),
+              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Field, { label: "End Date", value: end ? fmt(end) : start ? fmt(start) : "\u2014" })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "my-4 border-t border-border-default" }),
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "flex gap-8", children: [0, 1].map((offset) => {
+            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "my-4 border-t border-border-default" }),
+            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "flex gap-8", children: [0, 1].map((offset) => {
               const m = addMonths(leftMonth, offset);
               const grid = monthGrid(m.getFullYear(), m.getMonth());
-              return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "w-[252px]", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "mb-2 flex items-center justify-between", children: [
-                  offset === 0 ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(NavBtn, { onClick: () => setLeftMonth(addMonths(leftMonth, -1)), "aria-label": "Previous month", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react5.ChevronLeft, { size: 16 }) }) : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "h-7 w-7" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: "text-[15px] font-semibold text-text-primary", children: [
+              return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "w-[252px]", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "mb-2 flex items-center justify-between", children: [
+                  offset === 0 ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(NavBtn, { onClick: () => setLeftMonth(addMonths(leftMonth, -1)), "aria-label": "Previous month", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_lucide_react6.ChevronLeft, { size: 16 }) }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "h-7 w-7" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { className: "text-[15px] font-semibold text-text-primary", children: [
                     MONTHS[m.getMonth()],
                     " ",
                     m.getFullYear()
                   ] }),
-                  offset === 1 ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(NavBtn, { onClick: () => setLeftMonth(addMonths(leftMonth, 1)), "aria-label": "Next month", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lucide_react5.ChevronRight, { size: 16 }) }) : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "h-7 w-7" })
+                  offset === 1 ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(NavBtn, { onClick: () => setLeftMonth(addMonths(leftMonth, 1)), "aria-label": "Next month", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_lucide_react6.ChevronRight, { size: 16 }) }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "h-7 w-7" })
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "grid grid-cols-7", children: [
-                  WEEKDAYS.map((w) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "flex h-8 items-center justify-center text-[12px] font-semibold text-text-secondary", children: w }, w)),
+                /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "grid grid-cols-7", children: [
+                  WEEKDAYS.map((w) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("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);
@@ -895,9 +920,9 @@ function DateRangeFilter({
                       else if (end && isEnd) band = "left-0 right-1/2";
                       else band = "left-0 right-0";
                     }
-                    return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("button", { type: "button", onClick: () => pickDay(d), className: "relative flex h-9 items-center justify-center", children: [
-                      band && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: `absolute inset-y-[3px] bg-ai-tint ${band}`, "aria-hidden": "true" }),
-                      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+                    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("button", { type: "button", onClick: () => pickDay(d), className: "relative flex h-9 items-center justify-center", children: [
+                      band && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: `absolute inset-y-[3px] bg-ai-tint ${band}`, "aria-hidden": "true" }),
+                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
                         "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"}`,
@@ -909,9 +934,9 @@ function DateRangeFilter({
                 ] })
               ] }, offset);
             }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "mt-4 flex justify-end gap-2", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("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__ */ (0, import_jsx_runtime6.jsx)("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__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "mt-4 flex justify-end gap-2", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("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__ */ (0, import_jsx_runtime7.jsx)("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" })
             ] })
           ] })
         ]
@@ -920,19 +945,19 @@ function DateRangeFilter({
   ] });
 }
 function Field({ label, value }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex flex-col gap-1.5", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-[12px] font-medium text-text-secondary", children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("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__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex flex-col gap-1.5", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-[12px] font-medium text-text-secondary", children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("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__ */ (0, import_jsx_runtime6.jsx)("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__ */ (0, import_jsx_runtime7.jsx)("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
 var import_react4 = require("react");
-var import_lucide_react6 = require("lucide-react");
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_lucide_react7 = require("lucide-react");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 var DEFAULT_SEARCH_MATCH = { mode: "anyWord", wordJoin: "Or" };
 var MODE_LABEL = {
   anyWord: "Any Word",
@@ -969,7 +994,7 @@ function SearchBar({
     };
   }, [open]);
   const showMatch = variant === "filterable" && matchValue;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
     "div",
     {
       className: cx2(
@@ -977,9 +1002,9 @@ function SearchBar({
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("label", { className: "flex min-w-0 flex-1 items-center gap-2 px-2.5", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_lucide_react6.Search, { size: 15, "aria-hidden": "true", className: "shrink-0 text-text-tertiary" }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("label", { className: "flex min-w-0 flex-1 items-center gap-2 px-2.5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_lucide_react7.Search, { size: 15, "aria-hidden": "true", className: "shrink-0 text-text-tertiary" }),
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
             "input",
             {
               type: "text",
@@ -1003,8 +1028,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__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "relative shrink-0 border-l border-border-default", ref, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "relative shrink-0 border-l border-border-default", ref, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
             "button",
             {
               type: "button",
@@ -1015,8 +1040,8 @@ 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__ */ (0, import_jsx_runtime7.jsx)(
-                  import_lucide_react6.ChevronDown,
+                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                  import_lucide_react7.ChevronDown,
                   {
                     size: 14,
                     "aria-hidden": "true",
@@ -1026,25 +1051,25 @@ function SearchBar({
               ]
             }
           ),
-          open && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          open && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
             "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__ */ (0, import_jsx_runtime7.jsxs)("div", { role: "radiogroup", "aria-label": "Search match type", className: "flex flex-col", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { role: "radiogroup", "aria-label": "Search match type", className: "flex flex-col", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                   ModeRow,
                   {
                     title: "Any Word Text Search",
                     selected: matchValue.mode === "anyWord",
                     onSelect: () => onMatchChange?.({ mode: "anyWord", wordJoin: matchValue.wordJoin }),
                     testId: testIdPrefix && `${testIdPrefix}-mode-anyWord`,
-                    description: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_jsx_runtime7.Fragment, { 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__ */ (0, import_jsx_runtime8.jsx)(import_jsx_runtime8.Fragment, { 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__ */ (0, import_jsx_runtime7.jsxs)("span", { className: "flex items-center gap-3", children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                    extra: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("span", { className: "flex items-center gap-3", children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                         RadioOption,
                         {
                           label: "Or",
@@ -1053,7 +1078,7 @@ function SearchBar({
                           testId: testIdPrefix && `${testIdPrefix}-word-join-or`
                         }
                       ),
-                      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                         RadioOption,
                         {
                           label: "And",
@@ -1065,8 +1090,8 @@ function SearchBar({
                     ] })
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Divider, {}),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Divider, {}),
+                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                   ModeRow,
                   {
                     title: "Exact Match Text Search",
@@ -1077,8 +1102,8 @@ function SearchBar({
                     infoText: "Keywords are matched as a single contiguous phrase, in the order you typed them."
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Divider, {}),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Divider, {}),
+                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                   ModeRow,
                   {
                     title: "Contextual Search",
@@ -1090,8 +1115,8 @@ function SearchBar({
                     infoText: "Uses semantic matching, so results can include related terms even when the exact keyword isn't present."
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Divider, {}),
-                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Divider, {}),
+                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                   ModeRow,
                   {
                     title: "Ad Code Search",
@@ -1111,7 +1136,7 @@ function SearchBar({
   );
 }
 function Divider() {
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "my-2.5 border-t border-border-default", "aria-hidden": "true" });
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "my-2.5 border-t border-border-default", "aria-hidden": "true" });
 }
 function ModeRow({
   title,
@@ -1123,7 +1148,7 @@ function ModeRow({
   onSelect,
   testId
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
     "div",
     {
       role: "radio",
@@ -1139,18 +1164,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__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex flex-wrap items-center gap-3", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { className: "flex items-center gap-1", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-[14px] font-semibold text-text-primary", children: title }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(RowInfoTip, { text: infoText })
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex flex-wrap items-center gap-3", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("span", { className: "flex items-center gap-1", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "text-[14px] font-semibold text-text-primary", children: title }),
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(RowInfoTip, { text: infoText })
             ] }),
-            badge && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("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__ */ (0, import_jsx_runtime8.jsx)("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__ */ (0, import_jsx_runtime7.jsx)(import_lucide_react6.Check, { size: 16, strokeWidth: 2.5, "aria-hidden": "true", className: "shrink-0 text-brand-primaryAction" })
+          selected && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_lucide_react7.Check, { size: 16, strokeWidth: 2.5, "aria-hidden": "true", className: "shrink-0 text-brand-primaryAction" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "block text-[12.5px] leading-snug text-text-secondary", children: description })
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "block text-[12.5px] leading-snug text-text-secondary", children: description })
       ]
     }
   );
@@ -1161,7 +1186,7 @@ function RadioOption({
   onSelect,
   testId
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
     "button",
     {
       type: "button",
@@ -1174,14 +1199,14 @@ function RadioOption({
       "aria-checked": checked,
       className: "flex items-center gap-1.5 text-[13px] font-medium text-text-primary",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
           "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__ */ (0, import_jsx_runtime7.jsx)("span", { className: "h-2 w-2 rounded-full bg-brand-primaryAction" })
+            children: checked && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "h-2 w-2 rounded-full bg-brand-primaryAction" })
           }
         ),
         label
@@ -1200,8 +1225,8 @@ function RowInfoTip({ text }) {
     window.addEventListener("mousedown", onDown);
     return () => window.removeEventListener("mousedown", onDown);
   }, [open]);
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { className: "relative inline-flex shrink-0 items-center", ref, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("span", { className: "relative inline-flex shrink-0 items-center", ref, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       "button",
       {
         type: "button",
@@ -1212,10 +1237,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__ */ (0, import_jsx_runtime7.jsx)(import_lucide_react6.AlertCircle, { size: 13, "aria-hidden": "true" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_lucide_react7.AlertCircle, { size: 13, "aria-hidden": "true" })
       }
     ),
-    open && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    open && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       "span",
       {
         role: "tooltip",
@@ -1228,8 +1253,8 @@ function RowInfoTip({ text }) {
 
 // src/SectionRail.tsx
 var import_react5 = require("react");
-var import_lucide_react7 = require("lucide-react");
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_lucide_react8 = require("lucide-react");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 function SectionRail({
   title,
   titleSerif,
@@ -1242,20 +1267,20 @@ function SectionRail({
   const scroll = (direction) => {
     scrollRef.current?.scrollBy({ left: direction * 320, behavior: "smooth" });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("section", { className: "flex flex-col gap-4", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("header", { className: "flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("section", { className: "flex flex-col gap-4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("header", { className: "flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           "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__ */ (0, import_jsx_runtime8.jsx)("p", { className: "mt-1 text-sm text-text-secondary", children: subtitle })
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { className: "mt-1 text-sm text-text-secondary", children: subtitle })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex items-center gap-2", children: [
-        viewAllLabel && viewAllHref && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center gap-2", children: [
+        viewAllLabel && viewAllHref && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
           "a",
           {
             href: viewAllHref,
@@ -1266,29 +1291,29 @@ function SectionRail({
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           "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__ */ (0, import_jsx_runtime8.jsx)(import_lucide_react7.ChevronLeft, { size: 16 })
+            children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_lucide_react8.ChevronLeft, { size: 16 })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           "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__ */ (0, import_jsx_runtime8.jsx)(import_lucide_react7.ChevronRight, { size: 16 })
+            children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_lucide_react8.ChevronRight, { size: 16 })
           }
         )
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
       "div",
       {
         ref: scrollRef,
@@ -1301,8 +1326,8 @@ function SectionRail({
 
 // src/DataScopeFilter.tsx
 var import_react6 = require("react");
-var import_lucide_react8 = require("lucide-react");
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var import_lucide_react9 = require("lucide-react");
+var import_jsx_runtime10 = require("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(" ");
@@ -1328,8 +1353,8 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
     onChange(v);
     setOpen(false);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "relative", ref, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "relative", ref, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
       "button",
       {
         type: "button",
@@ -1338,12 +1363,12 @@ 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__ */ (0, import_jsx_runtime9.jsxs)("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: "Data" }),
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "text-[12px] font-medium text-text-primary", children: display })
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: "Data" }),
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-[12px] font-medium text-text-primary", children: display })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-            import_lucide_react8.ChevronDown,
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+            import_lucide_react9.ChevronDown,
             {
               size: 14,
               "aria-hidden": "true",
@@ -1353,7 +1378,7 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
         ]
       }
     ),
-    open && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+    open && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
       "div",
       {
         role: "listbox",
@@ -1363,8 +1388,8 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
           align === "right" ? "right-0" : "left-0"
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Option, { label: "All", selected: !value, onClick: () => choose(false) }),
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Option, { label: "Final only", selected: value, onClick: () => choose(true), hint: FINAL_ONLY_TEXT })
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Option, { label: "All", selected: !value, onClick: () => choose(false) }),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Option, { label: "Final only", selected: value, onClick: () => choose(true), hint: FINAL_ONLY_TEXT })
         ]
       }
     )
@@ -1376,7 +1401,7 @@ function Option({
   onClick,
   hint
 }) {
-  const option = /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+  const option = /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
     "button",
     {
       type: "button",
@@ -1389,23 +1414,23 @@ function Option({
         selected ? "font-semibold text-text-primary" : "text-text-secondary"
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_lucide_react8.Check, { size: 14, "aria-hidden": "true", className: cx3("shrink-0 text-brand-primaryAction", !selected && "invisible") }),
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react9.Check, { size: 14, "aria-hidden": "true", className: cx3("shrink-0 text-brand-primaryAction", !selected && "invisible") }),
         label
       ]
     }
   );
   if (!hint) return option;
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "flex items-center pr-2.5", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex items-center pr-2.5", children: [
     option,
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(InfoTip, { text: hint, trigger: "hover", label: `About ${label}` })
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(InfoTip, { text: hint, trigger: "hover", label: `About ${label}` })
   ] });
 }
 
 // src/SelectFilter.tsx
 var import_react7 = require("react");
 var import_react_dom2 = require("react-dom");
-var import_lucide_react9 = require("lucide-react");
-var import_jsx_runtime10 = require("react/jsx-runtime");
+var import_lucide_react10 = require("lucide-react");
+var import_jsx_runtime11 = require("react/jsx-runtime");
 function cx4(...classes) {
   return classes.filter(Boolean).join(" ");
 }
@@ -1455,8 +1480,8 @@ function SelectFilter({
       window.removeEventListener("scroll", reposition, true);
     };
   }, [open, close, reposition]);
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: cx4("relative", fullWidth && "w-full"), ref, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: cx4("relative", fullWidth && "w-full"), ref, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
       "button",
       {
         type: "button",
@@ -1470,12 +1495,12 @@ function SelectFilter({
           className
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: caption }),
-            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-[12px] font-medium text-text-primary", children: value })
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: caption }),
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "text-[12px] font-medium text-text-primary", children: value })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-            import_lucide_react9.ChevronDown,
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+            import_lucide_react10.ChevronDown,
             {
               size: 14,
               "aria-hidden": "true",
@@ -1486,7 +1511,7 @@ function SelectFilter({
       }
     ),
     open && pos && (0, import_react_dom2.createPortal)(
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
         "div",
         {
           ref: popoverRef,
@@ -1498,9 +1523,9 @@ function SelectFilter({
           ),
           role: "listbox",
           "aria-label": caption,
-          children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "max-h-[280px] overflow-y-auto p-1", children: options.map((o) => {
+          children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "max-h-[280px] overflow-y-auto p-1", children: options.map((o) => {
             const selected = o === value;
-            return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+            return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
               "button",
               {
                 type: "button",
@@ -1513,8 +1538,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__ */ (0, import_jsx_runtime10.jsx)("span", { className: "flex h-4 w-4 shrink-0 items-center justify-center text-brand-primaryAction", children: selected && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react9.Check, { size: 15, strokeWidth: 3 }) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "flex h-4 w-4 shrink-0 items-center justify-center text-brand-primaryAction", children: selected && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_lucide_react10.Check, { size: 15, strokeWidth: 3 }) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
                     "span",
                     {
                       className: cx4("flex-1 text-[14px]", selected ? "font-semibold text-text-primary" : "text-text-primary"),
@@ -1535,9 +1560,9 @@ function SelectFilter({
 
 // src/Card.tsx
 var import_react8 = require("react");
-var import_jsx_runtime11 = require("react/jsx-runtime");
+var import_jsx_runtime12 = require("react/jsx-runtime");
 var Card = (0, import_react8.forwardRef)(function Card2({ staticCard, title, subtitle, action, className, children, ...rest }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
     "article",
     {
       ref,
@@ -1548,23 +1573,23 @@ var Card = (0, import_react8.forwardRef)(function Card2({ staticCard, title, sub
         className
       ].filter(Boolean).join(" "),
       ...rest,
-      children: title ? /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex flex-1 flex-col p-card-padding", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex items-start justify-between gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("h3", { className: "text-[15px] font-semibold leading-snug text-text-primary", children: title }),
-            subtitle && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("p", { className: "mt-0.5 text-[12px] leading-snug text-text-tertiary", children: subtitle })
+      children: title ? /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex flex-1 flex-col p-card-padding", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex items-start justify-between gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("h3", { className: "text-[15px] font-semibold leading-snug text-text-primary", children: title }),
+            subtitle && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "mt-0.5 text-[12px] leading-snug text-text-tertiary", children: subtitle })
           ] }),
-          action && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "shrink-0 text-text-tertiary", children: action })
+          action && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "shrink-0 text-text-tertiary", children: action })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "mt-4 flex flex-1 flex-col", children })
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "mt-4 flex flex-1 flex-col", children })
       ] }) : children
     }
   );
 });
 
 // src/NoResultsEmptyState.tsx
-var import_lucide_react10 = require("lucide-react");
-var import_jsx_runtime12 = require("react/jsx-runtime");
+var import_lucide_react11 = require("lucide-react");
+var import_jsx_runtime13 = require("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) {
@@ -1586,12 +1611,12 @@ function NoResultsEmptyState({
   const showClear = hasFilters !== false && Boolean(onClearFilters);
   const showEdit = Boolean(onEditFilters);
   const hasActions = showClear || showEdit || Boolean(actions && actions.length > 0);
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex flex-col items-center justify-center gap-3 text-center", "data-testid": testIdPrefix, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "flex h-11 w-11 items-center justify-center rounded-full bg-subtle text-text-tertiary", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react10.FilterX, { size: 20, "aria-hidden": "true" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("h2", { className: "text-base font-semibold text-text-primary", children: title }),
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { className: "max-w-[420px] text-[13px] leading-relaxed text-text-secondary", children: bodyText }),
-    hasActions && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "mt-1 flex flex-col items-center gap-3", children: [
-      showClear && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-col items-center justify-center gap-3 text-center", "data-testid": testIdPrefix, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "flex h-11 w-11 items-center justify-center rounded-full bg-subtle text-text-tertiary", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_lucide_react11.FilterX, { size: 20, "aria-hidden": "true" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("h2", { className: "text-base font-semibold text-text-primary", children: title }),
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "max-w-[420px] text-[13px] leading-relaxed text-text-secondary", children: bodyText }),
+    hasActions && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "mt-1 flex flex-col items-center gap-3", children: [
+      showClear && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
         "button",
         {
           type: "button",
@@ -1601,7 +1626,7 @@ function NoResultsEmptyState({
           children: "Clear all filters"
         }
       ),
-      showEdit && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      showEdit && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
         "button",
         {
           type: "button",
@@ -1611,7 +1636,7 @@ function NoResultsEmptyState({
           children: "Edit filters"
         }
       ),
-      actions?.map((action, i) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      actions?.map((action, i) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
         "button",
         {
           type: "button",
@@ -1627,13 +1652,13 @@ function NoResultsEmptyState({
 
 // src/WorkspaceSelectedCard.tsx
 var import_react9 = require("react");
-var import_lucide_react11 = require("lucide-react");
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_lucide_react12 = require("lucide-react");
+var import_jsx_runtime14 = require("react/jsx-runtime");
 function cx5(...parts) {
   return parts.filter(Boolean).join(" ");
 }
 function WorkspaceSelectedCard({ groups, testIdPrefix }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("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__ */ (0, import_jsx_runtime13.jsx)("div", { className: "flex flex-col divide-y divide-border-default", children: groups.map((g) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SummaryGroupItem, { group: g, testIdPrefix }, g.id)) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("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__ */ (0, import_jsx_runtime14.jsx)("div", { className: "flex flex-col divide-y divide-border-default", children: groups.map((g) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(SummaryGroupItem, { group: g, testIdPrefix }, g.id)) }) });
 }
 function SummaryGroupItem({
   group,
@@ -1650,8 +1675,8 @@ function SummaryGroupItem({
     else if (expandCount === 0) setOpen(false);
     wasEmpty.current = expandCount === 0;
   }, [expandCount]);
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: nested ? "" : "py-3 first:pt-0 last:pb-0", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: nested ? "" : "py-3 first:pt-0 last:pb-0", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
       "button",
       {
         type: "button",
@@ -1660,45 +1685,45 @@ function SummaryGroupItem({
         "data-testid": testIdPrefix && `${testIdPrefix}-group-${group.id}`,
         className: "flex w-full min-w-0 items-center gap-2 text-left",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-            import_lucide_react11.ChevronDown,
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            import_lucide_react12.ChevronDown,
             {
               size: 14,
               "aria-hidden": "true",
               className: cx5("shrink-0 text-text-secondary transition-transform", !open && "-rotate-90")
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: cx5("truncate font-semibold text-text-primary", nested ? "text-[12px]" : "text-[13px]"), children: group.label }),
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "shrink-0 rounded-full bg-subtle px-1.5 py-0.5 text-[11px] font-semibold text-text-secondary", children: ownCount })
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: cx5("truncate font-semibold text-text-primary", nested ? "text-[12px]" : "text-[13px]"), children: group.label }),
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("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__ */ (0, import_jsx_runtime13.jsx)("div", { className: "pt-2.5", children: ownCount === 0 && subCount === 0 ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "text-[12px] text-text-secondary", children: "Nothing selected." }) : /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-col gap-2.5", children: [
-      ownCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-col gap-1.5", children: [
-        group.items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+    open && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "pt-2.5", children: ownCount === 0 && subCount === 0 ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: "text-[12px] text-text-secondary", children: "Nothing selected." }) : /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex flex-col gap-2.5", children: [
+      ownCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex flex-col gap-1.5", children: [
+        group.items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
           "div",
           {
             className: "flex items-center justify-between gap-2 rounded-control border border-border-default bg-canvas px-2 py-1",
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("span", { className: "min-w-0 flex-1", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "block truncate text-[12px] text-text-primary", children: item.name }),
-                item.meta && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "block truncate text-[11px] text-text-secondary", children: item.meta })
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("span", { className: "min-w-0 flex-1", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "block truncate text-[12px] text-text-primary", children: item.name }),
+                item.meta && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "block truncate text-[11px] text-text-secondary", children: item.meta })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
                 "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__ */ (0, import_jsx_runtime13.jsx)(import_lucide_react11.X, { size: 12, "aria-hidden": "true" })
+                  children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react12.X, { size: 12, "aria-hidden": "true" })
                 }
               )
             ]
           },
           item.id
         )),
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
           "button",
           {
             type: "button",
@@ -1709,13 +1734,13 @@ function SummaryGroupItem({
           }
         )
       ] }),
-      group.subGroups?.map((sg) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SummaryGroupItem, { group: sg, nested: true, testIdPrefix }, sg.id))
+      group.subGroups?.map((sg) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(SummaryGroupItem, { group: sg, nested: true, testIdPrefix }, sg.id))
     ] }) })
   ] });
 }
 
 // src/chart-placeholder-shared.tsx
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_jsx_runtime15 = require("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;
@@ -1727,9 +1752,9 @@ function AxisFrame({
   children
 }) {
   const gutter = xTicks > 0 ? X_AXIS_H : 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "w-full", style: { height }, role: "presentation", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "relative h-full w-full", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "absolute inset-y-0 right-0", style: { left: Y_AXIS_W, bottom: gutter }, children: [
-      GRID_ROWS.map((pct) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "w-full", style: { height }, role: "presentation", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "relative h-full w-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "absolute inset-y-0 right-0", style: { left: Y_AXIS_W, bottom: gutter }, children: [
+      GRID_ROWS.map((pct) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
         "div",
         {
           className: "absolute inset-x-0 border-t border-dashed",
@@ -1737,9 +1762,9 @@ function AxisFrame({
         },
         pct
       )),
-      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "absolute inset-0", children })
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "absolute inset-0", children })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "absolute left-0 top-0", style: { width: Y_AXIS_W, bottom: gutter }, children: GRID_ROWS.map((pct, i) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "absolute left-0 top-0", style: { width: Y_AXIS_W, bottom: gutter }, children: GRID_ROWS.map((pct, i) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
       "div",
       {
         className: "absolute right-2 h-2 -translate-y-1/2 rounded-xs bg-subtle",
@@ -1747,27 +1772,27 @@ function AxisFrame({
       },
       pct
     )) }),
-    xTicks > 0 && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    xTicks > 0 && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
       "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__ */ (0, import_jsx_runtime14.jsx)("div", { className: "flex flex-1 justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "h-2 w-full max-w-[26px] rounded-xs bg-subtle" }) }, i))
+        children: Array.from({ length: xTicks }, (_, i) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "flex flex-1 justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "h-2 w-full max-w-[26px] rounded-xs bg-subtle" }) }, i))
       }
     )
   ] }) });
 }
 function BlankLegend({ rows, reverse = false }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
     "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__ */ (0, import_jsx_runtime14.jsxs)("li", { className: "flex items-center justify-between gap-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("span", { className: "flex items-center gap-1.5", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "h-2.5 w-2.5 rounded-xs bg-subtle" }),
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+      children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("li", { className: "flex items-center justify-between gap-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("span", { className: "flex items-center gap-1.5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "h-2.5 w-2.5 rounded-xs bg-subtle" }),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
             "span",
             {
               className: "h-2 rounded-xs bg-subtle",
@@ -1775,21 +1800,21 @@ function BlankLegend({ rows, reverse = false }) {
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "h-2 w-6 rounded-xs bg-subtle" })
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "h-2 w-6 rounded-xs bg-subtle" })
       ] }, i))
     }
   );
 }
 
 // src/BarChartPlaceholder.tsx
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_jsx_runtime16 = require("react/jsx-runtime");
 var BAR_PROFILE = [92, 86, 76, 65, 57, 40, 30, 24, 18, 13];
 function BarChartPlaceholder({ height = 220 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(AxisFrame, { height, xTicks: BAR_PROFILE.length, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "flex h-full w-full items-end gap-2", children: BAR_PROFILE.map((pct, i) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "flex-1 rounded-t-[3px] bg-subtle", style: { height: `${pct}%` } }, i)) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(AxisFrame, { height, xTicks: BAR_PROFILE.length, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex h-full w-full items-end gap-2", children: BAR_PROFILE.map((pct, i) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex-1 rounded-t-[3px] bg-subtle", style: { height: `${pct}%` } }, i)) }) });
 }
 
 // src/LineChartPlaceholder.tsx
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_jsx_runtime17 = require("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],
@@ -1799,26 +1824,26 @@ 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__ */ (0, import_jsx_runtime16.jsxs)(AxisFrame, { height, xTicks: LINE_SERIES[0].length, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("svg", { viewBox: "0 0 100 100", preserveAspectRatio: "none", className: "absolute inset-0 h-full w-full", children: LINE_SERIES.map((pts, s) => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("g", { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(AxisFrame, { height, xTicks: LINE_SERIES[0].length, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("svg", { viewBox: "0 0 100 100", preserveAspectRatio: "none", className: "absolute inset-0 h-full w-full", children: LINE_SERIES.map((pts, s) => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("g", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
         "polyline",
         {
           points: toPath(pts, 0, LINE_FORECAST_FROM + 1),
           fill: "none",
-          stroke: "var(--mr-color-border-strong)",
+          stroke: "var(--mr-color-subtle)",
           strokeWidth: "2",
           vectorEffect: "non-scaling-stroke",
           strokeLinecap: "round",
           strokeLinejoin: "round"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
         "polyline",
         {
           points: toPath(pts, LINE_FORECAST_FROM, pts.length),
           fill: "none",
-          stroke: "var(--mr-color-border-strong)",
+          stroke: "var(--mr-color-subtle)",
           strokeWidth: "2",
           strokeDasharray: "5 4",
           vectorEffect: "non-scaling-stroke",
@@ -1828,14 +1853,14 @@ function LineChartPlaceholder({ height = 280 }) {
       )
     ] }, s)) }),
     LINE_SERIES.map(
-      (pts, s) => pts.map((y, i) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+      (pts, s) => pts.map((y, i) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
         "div",
         {
           className: "absolute h-1.5 w-1.5 -translate-x-1/2 -translate-y-1/2 rounded-full",
           style: {
             left: `${i / (pts.length - 1) * 100}%`,
             top: `${y}%`,
-            backgroundColor: "var(--mr-color-border-strong)"
+            backgroundColor: "var(--mr-color-subtle)"
           }
         },
         `${s}-${i}`
@@ -1845,35 +1870,35 @@ function LineChartPlaceholder({ height = 280 }) {
 }
 
 // src/PieChartPlaceholder.tsx
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_jsx_runtime18 = require("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__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex w-full items-center gap-3", style: { height }, role: "presentation", "aria-hidden": "true", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex h-full items-center justify-center", style: { width: "60%" }, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("svg", { viewBox: "0 0 100 100", className: "h-full", style: { aspectRatio: "1 / 1" }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("circle", { cx: "50", cy: "50", r, fill: "var(--mr-color-subtle)" }),
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex w-full items-center gap-3", style: { height }, role: "presentation", "aria-hidden": "true", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex h-full items-center justify-center", style: { width: "60%" }, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("svg", { viewBox: "0 0 100 100", className: "h-full", style: { aspectRatio: "1 / 1" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("circle", { cx: "50", cy: "50", r, fill: "var(--mr-color-subtle)" }),
       PIE_SEAMS.map((deg) => {
         const rad = (deg - 90) * Math.PI / 180;
-        return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
           "line",
           {
             x1: "50",
             y1: "50",
             x2: 50 + r * Math.cos(rad),
             y2: 50 + r * Math.sin(rad),
-            stroke: "var(--mr-color-border-default)",
+            stroke: "var(--mr-color-surface)",
             strokeWidth: "1"
           },
           deg
         );
       })
     ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(BlankLegend, { rows: legendRows })
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(BlankLegend, { rows: legendRows })
   ] });
 }
 
 // src/StackedColumnPlaceholder.tsx
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("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]);
@@ -1886,28 +1911,28 @@ function StackedColumnPlaceholder({
   legendRows = 4,
   axis = false
 }) {
-  const column = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex h-full flex-col overflow-hidden rounded-control bg-subtle", style: { width }, children: columnBands(legendRows).map((pct, i) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  const column = /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "flex h-full flex-col overflow-hidden rounded-control bg-subtle", style: { width }, children: columnBands(legendRows).map((pct, i) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
     "div",
     {
       style: {
         height: `${pct}%`,
-        /* border-strong, not border-default: on a subtle fill the softer
-           seam disappears and the stack reads as one undivided block. */
-        borderTop: i === 0 ? void 0 : "1px solid var(--mr-color-border-strong)"
+        /* A gap in the card's color, not a border tone: border-default
+           disappears on the subtle fill, border-strong reads darker. */
+        borderTop: i === 0 ? void 0 : "1px solid var(--mr-color-surface)"
       }
     },
     i
   )) });
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex w-full gap-4", style: { height }, role: "presentation", "aria-hidden": "true", children: [
-    axis ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { style: { width: "55%" }, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(AxisFrame, { height, xTicks: 0, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex h-full items-stretch justify-center", children: column }) }) }) : /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex items-stretch py-1", children: column }),
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(BlankLegend, { rows: legendRows, reverse: !axis })
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex w-full gap-4", style: { height }, role: "presentation", "aria-hidden": "true", children: [
+    axis ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { style: { width: "55%" }, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(AxisFrame, { height, xTicks: 0, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "flex h-full items-stretch justify-center", children: column }) }) }) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "flex items-stretch py-1", children: column }),
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(BlankLegend, { rows: legendRows, reverse: !axis })
   ] });
 }
 
 // src/Tooltip.tsx
 var import_react10 = require("react");
 var import_react_dom3 = require("react-dom");
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 function cx6(...parts) {
   return parts.filter(Boolean).join(" ");
 }
@@ -2077,7 +2102,7 @@ function Tooltip({
     }
   }
   const floating = anchor != null && typeof document !== "undefined" ? (0, import_react_dom3.createPortal)(
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
       "span",
       {
         ref: boxRef,
@@ -2108,7 +2133,7 @@ function Tooltip({
     document.body
   ) : null;
   if (anchorRef) return floating;
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
     "span",
     {
       ref,
@@ -2127,26 +2152,26 @@ function Tooltip({
 }
 
 // src/AdvertiserNoResults.tsx
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 function AdvertiserNoResults({
   query,
   hint = "Try checking your spelling or searching for a broader brand name."
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex flex-col items-center gap-1.5 px-4 py-8 text-center", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("p", { className: "text-[13px] font-medium text-text-primary", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col items-center gap-1.5 px-4 py-8 text-center", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("p", { className: "text-[13px] font-medium text-text-primary", children: [
       "No results found for \u201C",
       query,
       "\u201D"
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "text-[12px] leading-snug text-text-tertiary", children: hint })
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-[12px] leading-snug text-text-tertiary", children: hint })
   ] });
 }
 
 // src/SelectAllVisible.tsx
-var import_lucide_react12 = require("lucide-react");
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_lucide_react13 = require("lucide-react");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 function SelectAllVisible({ count, allSelected, onToggle, testIdPrefix }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
     "button",
     {
       type: "button",
@@ -2154,7 +2179,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__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react12.ListChecks, { size: 14, "aria-hidden": "true" }),
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react13.ListChecks, { size: 14, "aria-hidden": "true" }),
         allSelected ? `Deselect ${count} visible` : `Select all ${count} visible`
       ]
     }
@@ -2162,15 +2187,15 @@ function SelectAllVisible({ count, allSelected, onToggle, testIdPrefix }) {
 }
 
 // src/SelectedSection.tsx
-var import_lucide_react13 = require("lucide-react");
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_lucide_react14 = require("lucide-react");
+var import_jsx_runtime23 = require("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__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-col", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-col", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
       "button",
       {
         type: "button",
@@ -2179,22 +2204,22 @@ 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__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react13.ChevronDown, { size: 13, "aria-hidden": "true", className: cx7("transition-transform", !open && "-rotate-90") }),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react14.ChevronDown, { size: 13, "aria-hidden": "true", className: cx7("transition-transform", !open && "-rotate-90") }),
           "Selected (",
           count,
           ")"
         ]
       }
     ),
-    open && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex flex-col gap-0.5", children })
+    open && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex flex-col gap-0.5", children })
   ] });
 }
 
 // src/SelectionPicker.tsx
 var import_react11 = require("react");
 var import_react_dom4 = require("react-dom");
-var import_lucide_react14 = require("lucide-react");
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_lucide_react15 = require("lucide-react");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 function cx8(...parts) {
   return parts.filter(Boolean).join(" ");
 }
@@ -2289,17 +2314,17 @@ function SelectionPicker({
     }
   };
   const rowGridCols = showInfoColumn ? "grid-cols-[36px_1fr_44px]" : "grid-cols-[36px_1fr]";
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-col gap-4", children: [
-    helper && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "text-[13px] text-text-secondary", children: helper }),
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("hr", { className: "-mx-5 -mt-2 border-border-default sm:-mx-6" })
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-col gap-4", children: [
+    helper && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "text-[13px] text-text-secondary", children: helper }),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("hr", { className: "-mx-5 -mt-2 border-border-default sm:-mx-6" })
     ] }),
-    hasAccountLists && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("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: import_lucide_react14.Search },
-      { id: "lists", label: "Account lists", icon: import_lucide_react14.List }
+    hasAccountLists && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("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: import_lucide_react15.Search },
+      { id: "lists", label: "Account lists", icon: import_lucide_react15.List }
     ].map((t) => {
       const on = source === t.id;
-      return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+      return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
         "button",
         {
           type: "button",
@@ -2310,18 +2335,18 @@ function SelectionPicker({
             on ? "bg-surface text-text-primary shadow-raised" : "text-text-secondary hover:text-text-primary"
           ),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(t.icon, { size: 14, "aria-hidden": "true" }),
+            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(t.icon, { size: 14, "aria-hidden": "true" }),
             t.label
           ]
         },
         t.id
       );
     }) }),
-    source === "search" && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex min-w-0 flex-col gap-3", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-wrap items-center gap-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("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__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react14.Search, { size: 15, className: "text-text-secondary", "aria-hidden": "true" }),
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+    source === "search" && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex min-w-0 flex-col gap-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-wrap items-center gap-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("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__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react15.Search, { size: 15, className: "text-text-secondary", "aria-hidden": "true" }),
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
             "input",
             {
               value: query,
@@ -2337,7 +2362,7 @@ function SelectionPicker({
             }
           )
         ] }),
-        filters.map((f) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        filters.map((f) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
           FilterDropdown,
           {
             filter: f,
@@ -2349,14 +2374,14 @@ function SelectionPicker({
         )),
         toolbarExtra
       ] }),
-      !hasSearched ? /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-col items-center gap-3 rounded-card border border-dashed border-border-default py-10 text-center", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-subtle", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react14.Search, { size: 20, className: "text-text-tertiary", "aria-hidden": "true" }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "text-[14px] font-semibold text-text-primary", children: "Search to get started" }),
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "text-[13px] text-text-tertiary", children: "Use the search or filters above to find and add options." })
+      !hasSearched ? /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-col items-center gap-3 rounded-card border border-dashed border-border-default py-10 text-center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-subtle", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react15.Search, { size: 20, className: "text-text-tertiary", "aria-hidden": "true" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-col gap-1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "text-[14px] font-semibold text-text-primary", children: "Search to get started" }),
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "text-[13px] text-text-tertiary", children: "Use the search or filters above to find and add options." })
         ] })
-      ] }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "overflow-hidden rounded-control border border-border-default", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "overflow-hidden rounded-control border border-border-default", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
           "div",
           {
             className: cx8(
@@ -2364,7 +2389,7 @@ function SelectionPicker({
               rowGridCols
             ),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                 CheckBox,
                 {
                   checked: allSelected,
@@ -2375,18 +2400,18 @@ function SelectionPicker({
                   testId: testIdPrefix && `${testIdPrefix}-select-all`
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: cx8("grid gap-2", gridForColumns(columns)), children: columns.map((c) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: c.className, children: c.header }, c.key)) }),
-              showInfoColumn && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "text-right", children: "Info" })
+              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: cx8("grid gap-2", gridForColumns(columns)), children: columns.map((c) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: c.className, children: c.header }, c.key)) }),
+              showInfoColumn && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-right", children: "Info" })
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "max-h-[360px] overflow-y-auto", children: loading ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex items-center justify-center py-6", role: "status", "aria-label": "Loading", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react14.Loader2, { size: 18, className: "animate-spin text-text-tertiary", "aria-hidden": "true" }) }) : error ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "px-3 py-8 text-center text-[13px] text-text-tertiary", children: errorMessage }) : rows.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("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__ */ (0, import_jsx_runtime24.jsx)("div", { className: "max-h-[360px] overflow-y-auto", children: loading ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex items-center justify-center py-6", role: "status", "aria-label": "Loading", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react15.Loader2, { size: 18, className: "animate-spin text-text-tertiary", "aria-hidden": "true" }) }) : error ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "px-3 py-8 text-center text-[13px] text-text-tertiary", children: errorMessage }) : rows.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("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__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "border-t border-border-default/60 first:border-t-0", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+          return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "border-t border-border-default/60 first:border-t-0", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
               "div",
               {
                 onClick: isLocked ? void 0 : () => toggleRow(row),
@@ -2398,7 +2423,7 @@ function SelectionPicker({
                   !isLocked && isSel && "opacity-60"
                 ),
                 children: [
-                  isLocked ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { "aria-hidden": "true" }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                  isLocked ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { "aria-hidden": "true" }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                     CheckBox,
                     {
                       checked: isSel,
@@ -2407,8 +2432,8 @@ function SelectionPicker({
                       testId: testIdPrefix && `${testIdPrefix}-row-${slug4(row.id)}`
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: cx8("grid gap-2 text-[13px] text-text-primary", gridForColumns(columns)), children: columns.map((c) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: cx8("truncate", c.className), children: c.render(row) }, c.key)) }),
-                  showInfoColumn && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex items-center justify-end", children: kids && kids.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: cx8("grid gap-2 text-[13px] text-text-primary", gridForColumns(columns)), children: columns.map((c) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: cx8("truncate", c.className), children: c.render(row) }, c.key)) }),
+                  showInfoColumn && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex items-center justify-end", children: kids && kids.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                     "button",
                     {
                       type: "button",
@@ -2422,28 +2447,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__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react14.ChevronRight, { size: 15, className: cx8("transition-transform", isOpen && "rotate-90") })
+                      children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react15.ChevronRight, { size: 15, className: cx8("transition-transform", isOpen && "rotate-90") })
                     }
-                  ) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                  ) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                     "span",
                     {
                       className: "flex h-7 w-7 items-center justify-center text-text-tertiary",
                       title: "No additional details",
-                      children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react14.Info, { size: 14 })
+                      children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react15.Info, { size: 14 })
                     }
                   ) })
                 ]
               }
             ),
-            isOpen && kids && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "bg-canvas/60 pb-1.5 pl-10 pr-3", children: kids.map((kid) => {
+            isOpen && kids && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "bg-canvas/60 pb-1.5 pl-10 pr-3", children: kids.map((kid) => {
               const kidSel = selectedIds.has(kid.id);
-              return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+              return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
                 "div",
                 {
                   className: "flex items-center justify-between gap-2 border-t border-border-default/40 py-2 first:border-t-0",
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "truncate text-[13px] text-text-secondary", children: kid.name }),
-                    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+                    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "truncate text-[13px] text-text-secondary", children: kid.name }),
+                    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
                       "button",
                       {
                         type: "button",
@@ -2454,7 +2479,7 @@ function SelectionPicker({
                           kidSel ? "text-text-tertiary" : "text-text-link hover:bg-subtle"
                         ),
                         children: [
-                          kidSel ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react14.Check, { size: 13 }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react14.Plus, { size: 13 }),
+                          kidSel ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react15.Check, { size: 13 }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react15.Plus, { size: 13 }),
                           kidSel ? "Added" : "Add"
                         ]
                       }
@@ -2466,7 +2491,7 @@ function SelectionPicker({
             }) })
           ] }, row.id);
         }) }),
-        !loading && !error && hasMore && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+        !loading && !error && hasMore && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
           "button",
           {
             type: "button",
@@ -2475,19 +2500,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__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react14.Loader2, { size: 13, className: "animate-spin", "aria-hidden": "true" }) : null,
+              loadingMore ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react15.Loader2, { size: 13, className: "animate-spin", "aria-hidden": "true" }) : null,
               loadingMore ? "Loading\u2026" : "Load more"
             ]
           }
         )
       ] })
     ] }),
-    source === "lists" && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex min-w-0 flex-col gap-3", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("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__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ScrollFade, { className: "flex max-h-[396px] flex-col gap-2 overflow-y-auto pr-0.5", children: accountLists.map((list) => {
+    source === "lists" && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex min-w-0 flex-col gap-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("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__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(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__ */ (0, import_jsx_runtime23.jsxs)(
+          return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
             "button",
             {
               type: "button",
@@ -2499,19 +2524,19 @@ function SelectionPicker({
                 on ? "border-brand-primaryAction bg-brand-primarySoft" : "border-border-default bg-surface hover:bg-subtle"
               ),
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                   "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__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react14.Check, { size: 16 }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react14.Plus, { size: 16 })
+                    children: on ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react15.Check, { size: 16 }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react15.Plus, { size: 16 })
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { className: "min-w-0 flex-1", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "flex min-w-0 items-center gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "truncate text-[14px] font-medium text-text-primary", children: list.name }) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { className: "block truncate text-[12px] text-text-secondary", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("span", { className: "min-w-0 flex-1", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "flex min-w-0 items-center gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "truncate text-[14px] font-medium text-text-primary", children: list.name }) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("span", { className: "block truncate text-[12px] text-text-secondary", children: [
                     list.count,
                     " accounts \xB7 ",
                     list.entityTypes.join(", "),
@@ -2519,13 +2544,13 @@ function SelectionPicker({
                     formatListDate(list.updatedAt)
                   ] })
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: cx8("shrink-0 text-[12px] font-medium", on ? "text-brand-primaryAction" : "text-text-secondary"), children: on ? "Added" : "Add" })
+                /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: cx8("shrink-0 text-[12px] font-medium", on ? "text-brand-primaryAction" : "text-text-secondary"), children: on ? "Added" : "Add" })
               ]
             },
             list.id
           );
         }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
           "p",
           {
             className: "border-t border-border-default pt-2 text-right text-[12px] font-medium text-text-tertiary",
@@ -2537,11 +2562,11 @@ function SelectionPicker({
             ]
           }
         )
-      ] }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-col items-center gap-3 rounded-card border border-dashed border-border-default py-10 text-center", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-subtle", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react14.List, { size: 20, className: "text-text-tertiary", "aria-hidden": "true" }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-col gap-1", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "text-[14px] font-semibold text-text-primary", children: "No account lists yet" }),
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "text-[13px] text-text-tertiary", children: "Account lists set up for you will appear here." })
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-col items-center gap-3 rounded-card border border-dashed border-border-default py-10 text-center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex h-12 w-12 items-center justify-center rounded-full bg-subtle", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react15.List, { size: 20, className: "text-text-tertiary", "aria-hidden": "true" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-col gap-1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "text-[14px] font-semibold text-text-primary", children: "No account lists yet" }),
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "text-[13px] text-text-tertiary", children: "Account lists set up for you will appear here." })
         ] })
       ] })
     ] })
@@ -2573,7 +2598,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__ */ (0, import_jsx_runtime23.jsx)("div", { ref: attach, onScroll: sync, className, style: { maskImage: mask, WebkitMaskImage: mask }, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { ref: attach, onScroll: sync, className, style: { maskImage: mask, WebkitMaskImage: mask }, children });
 }
 function formatListDate(iso) {
   try {
@@ -2623,8 +2648,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__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "relative", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "relative", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
       "button",
       {
         ref: btnRef,
@@ -2636,12 +2661,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__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react14.ChevronDown, { size: 13, "aria-hidden": "true", className: cx8("transition-transform", open && "rotate-180") })
+          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react15.ChevronDown, { size: 13, "aria-hidden": "true", className: cx8("transition-transform", open && "rotate-180") })
         ]
       }
     ),
     open && pos && (0, import_react_dom4.createPortal)(
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
         "div",
         {
           ref: menuRef,
@@ -2650,9 +2675,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__ */ (0, import_jsx_runtime23.jsxs)("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__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react14.Search, { size: 14, className: "shrink-0 text-text-secondary", "aria-hidden": "true" }),
-              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            searchable && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("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__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react15.Search, { size: 14, className: "shrink-0 text-text-secondary", "aria-hidden": "true" }),
+              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                 "input",
                 {
                   autoFocus: true,
@@ -2663,14 +2688,14 @@ function FilterDropdown({
                 }
               )
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: cx8("flex flex-col gap-0.5", searchable && "max-h-[240px] overflow-y-auto"), children: shownOptions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { className: "px-2 py-3 text-center text-[12px] text-text-secondary", children: "No matches." }) : shownOptions.map((opt) => {
+            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: cx8("flex flex-col gap-0.5", searchable && "max-h-[240px] overflow-y-auto"), children: shownOptions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("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__ */ (0, import_jsx_runtime23.jsxs)(
+              return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
                 "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__ */ (0, import_jsx_runtime23.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                       CheckBox,
                       {
                         checked: on,
@@ -2701,7 +2726,7 @@ function gridForColumns(columns) {
 
 // src/PublisherBreakdownList.tsx
 var import_react12 = require("react");
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 function cx9(...parts) {
   return parts.filter(Boolean).join(" ");
 }
@@ -2716,7 +2741,7 @@ function initials(name) {
   return name.replace(/[^a-zA-Z0-9]/g, "").slice(0, 2).toUpperCase();
 }
 function Monogram({ name, size = 28 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     "span",
     {
       "aria-hidden": "true",
@@ -2727,12 +2752,12 @@ function Monogram({ name, size = 28 }) {
   );
 }
 function BreakdownTag({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("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__ */ (0, import_jsx_runtime25.jsx)("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__ */ (0, import_jsx_runtime24.jsxs)("span", { className: "group/dt relative inline-flex", tabIndex: 0, "aria-label": label, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("span", { className: "group/dt relative inline-flex", tabIndex: 0, "aria-label": label, children: [
     children,
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       "span",
       {
         role: "tooltip",
@@ -2746,22 +2771,22 @@ var COL_CURRENT = 76;
 var COL_PREVIOUS = 76;
 var COL_YOY = 44;
 function MetricListHeader({ className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: cx9("flex items-baseline gap-2 pb-2", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "flex-1" }),
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-right text-[11px] font-medium text-text-tertiary", style: { width: COL_CURRENT }, children: "Current" }),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DelayedTip, { label: "Spend during the same time period one year ago.", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-right text-[11px] font-medium text-text-tertiary", style: { width: COL_PREVIOUS }, children: "Previous" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DelayedTip, { label: "Percent change from this time period vs. the same time one year ago.", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-right text-[11px] font-medium text-text-tertiary", style: { width: COL_YOY }, children: "YoY" }) })
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: cx9("flex items-baseline gap-2 pb-2", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "flex-1" }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "text-right text-[11px] font-medium text-text-tertiary", style: { width: COL_CURRENT }, children: "Current" }),
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(DelayedTip, { label: "Spend during the same time period one year ago.", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "text-right text-[11px] font-medium text-text-tertiary", style: { width: COL_PREVIOUS }, children: "Previous" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(DelayedTip, { label: "Percent change from this time period vs. the same time one year ago.", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("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__ */ (0, import_jsx_runtime24.jsxs)("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-right text-[12px] font-bold tabular-nums text-text-primary", style: { width: COL_CURRENT }, children: fmtM(spendN) }),
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-right text-[12px] font-normal tabular-nums text-text-primary", style: { width: COL_PREVIOUS }, children: prior ?? "\u2014" }),
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "flex justify-end", style: { width: COL_YOY }, children: yoy === "NEW" ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "rounded-full bg-status-warning/15 px-1.5 text-[10px] font-semibold text-text-warning", children: "NEW" }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("span", { className: cx9("text-right text-[12px] font-semibold tabular-nums", up ? "text-text-success" : "text-text-danger"), children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "text-right text-[12px] font-bold tabular-nums text-text-primary", style: { width: COL_CURRENT }, children: fmtM(spendN) }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "text-right text-[12px] font-normal tabular-nums text-text-primary", style: { width: COL_PREVIOUS }, children: prior ?? "\u2014" }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "flex justify-end", style: { width: COL_YOY }, children: yoy === "NEW" ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "rounded-full bg-status-warning/15 px-1.5 text-[10px] font-semibold text-text-warning", children: "NEW" }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("span", { className: cx9("text-right text-[12px] font-semibold tabular-nums", up ? "text-text-success" : "text-text-danger"), children: [
       up ? "+" : "\u2212",
       Math.abs(yoy),
       "%"
@@ -2772,35 +2797,35 @@ function PublisherBreakdownList({ rows, defaultVisibleCount = 10, padded = true,
   const [showAll, setShowAll] = (0, import_react12.useState)(false);
   const visible = showAll ? rows : rows.slice(0, defaultVisibleCount);
   const rowPad = padded ? "px-5" : "";
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-col", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-col", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(MetricListHeader, { className: rowPad }),
-      visible.map((p) => /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("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__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex min-w-0 items-center gap-2.5", children: [
-          renderLogo ? renderLogo(p) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Monogram, { name: p.brand, size: 28 }),
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "min-w-0", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-wrap items-center gap-1.5", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-[14px] font-semibold text-text-primary", children: p.brand }),
-              p.tags.map((t) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(BreakdownTag, { children: t }, t))
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex flex-col", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex flex-col", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(MetricListHeader, { className: rowPad }),
+      visible.map((p) => /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("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__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex min-w-0 items-center gap-2.5", children: [
+          renderLogo ? renderLogo(p) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Monogram, { name: p.brand, size: 28 }),
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "min-w-0", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex flex-wrap items-center gap-1.5", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "text-[14px] font-semibold text-text-primary", children: p.brand }),
+              p.tags.map((t) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(BreakdownTag, { children: t }, t))
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "truncate text-[11.5px] text-text-tertiary", children: p.owner })
+            /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "truncate text-[11.5px] text-text-tertiary", children: p.owner })
           ] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(MetricCells, { spendN: p.spendN, yoy: p.yoy })
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(MetricCells, { spendN: p.spendN, yoy: p.yoy })
       ] }, p.brand))
     ] }),
-    rows.length > defaultVisibleCount && (viewAllHref ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: cx9("border-t border-border-default py-3", rowPad), children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("a", { href: viewAllHref, className: "text-[12px] font-semibold text-text-link hover:underline", children: "See all publishers" }) }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: cx9("flex items-center gap-2 border-t border-border-default py-3 text-[12px] text-text-tertiary", rowPad), children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("span", { children: [
+    rows.length > defaultVisibleCount && (viewAllHref ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: cx9("border-t border-border-default py-3", rowPad), children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("a", { href: viewAllHref, className: "text-[12px] font-semibold text-text-link hover:underline", children: "See all publishers" }) }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: cx9("flex items-center gap-2 border-t border-border-default py-3 text-[12px] text-text-tertiary", rowPad), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("span", { children: [
         "Showing ",
         visible.length,
         " of ",
         rows.length
       ] }),
-      !showAll ? /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("button", { type: "button", onClick: () => setShowAll(true), className: "font-semibold text-text-link hover:underline", children: [
+      !showAll ? /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("button", { type: "button", onClick: () => setShowAll(true), className: "font-semibold text-text-link hover:underline", children: [
         "See all (",
         rows.length - defaultVisibleCount,
         " more)"
-      ] }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("button", { type: "button", onClick: () => setShowAll(false), className: "font-semibold text-text-link hover:underline", children: "Show less" })
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("button", { type: "button", onClick: () => setShowAll(false), className: "font-semibold text-text-link hover:underline", children: "Show less" })
     ] }))
   ] });
 }
@@ -2809,45 +2834,77 @@ function PublisherBreakdownList({ rows, defaultVisibleCount = 10, padded = true,
 var import_react13 = require("react");
 var import_react_slot = require("@radix-ui/react-slot");
 var import_class_variance_authority = require("class-variance-authority");
-var import_lucide_react15 = require("lucide-react");
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_lucide_react16 = require("lucide-react");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 var buttonVariants = (0, import_class_variance_authority.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 = (0, import_react13.forwardRef)(
-  ({ className, variant, size, asChild = false, loading = false, disabled, children, ...props }, ref) => {
+  ({ className, variant, size, iconOnly, asChild = false, loading = false, disabled, children, ...props }, ref) => {
     const shared = {
-      className: cn(buttonVariants({ variant, size, className })),
+      className: cn(buttonVariants({ variant, size, iconOnly, className })),
       disabled: disabled || loading,
       "aria-busy": loading || void 0,
       ...props
     };
     if (asChild) {
-      return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_slot.Slot, { ref, ...shared, children });
+      return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_slot.Slot, { ref, ...shared, children });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("button", { ref, ...shared, children: [
-      loading && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react15.Loader2, { className: "size-4 shrink-0 animate-spin", "aria-hidden": "true" }),
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("button", { ref, ...shared, children: [
+      loading && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_lucide_react16.Loader2, { className: "size-4 shrink-0 animate-spin", "aria-hidden": "true" }),
       children
     ] });
   }
@@ -2855,14 +2912,14 @@ var Button = (0, import_react13.forwardRef)(
 Button.displayName = "Button";
 
 // src/FilterDropdownFooter.tsx
-var import_jsx_runtime26 = require("react/jsx-runtime");
+var import_jsx_runtime27 = require("react/jsx-runtime");
 function FilterDropdownFooter({
   onClear,
   onApply,
   clearLabel = "Clear all",
   applyLabel = "Apply"
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
     "div",
     {
       className: cn(
@@ -2870,8 +2927,8 @@ function FilterDropdownFooter({
         onClear ? "justify-between" : "justify-end"
       ),
       children: [
-        onClear && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Button, { type: "button", variant: "ghost", size: "sm", onClick: onClear, children: clearLabel }),
-        /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Button, { type: "button", variant: "primary", size: "sm", onClick: onApply, children: applyLabel })
+        onClear && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Button, { type: "button", variant: "ghost", size: "sm", onClick: onClear, children: clearLabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Button, { type: "button", variant: "primary", size: "sm", onClick: onApply, children: applyLabel })
       ]
     }
   );
@@ -2880,7 +2937,7 @@ function FilterDropdownFooter({
 // src/NameListModal.tsx
 var import_react14 = require("react");
 var import_react_dom5 = require("react-dom");
-var import_jsx_runtime27 = require("react/jsx-runtime");
+var import_jsx_runtime28 = require("react/jsx-runtime");
 function NameListModal({
   title,
   initialName,
@@ -2905,12 +2962,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__ */ (0, import_jsx_runtime27.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
       "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__ */ (0, import_jsx_runtime27.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
           "div",
           {
             role: "dialog",
@@ -2918,10 +2975,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__ */ (0, import_jsx_runtime27.jsx)("h2", { className: "text-[16px] font-semibold text-text-primary", children: title }),
-              /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "mt-4 flex flex-col gap-1.5", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("label", { htmlFor: "account-list-name", className: "text-[12px] font-medium text-text-secondary", children: fieldLabel }),
-                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("h2", { className: "text-[16px] font-semibold text-text-primary", children: title }),
+              /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "mt-4 flex flex-col gap-1.5", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("label", { htmlFor: "account-list-name", className: "text-[12px] font-medium text-text-secondary", children: fieldLabel }),
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
                   "input",
                   {
                     id: "account-list-name",
@@ -2933,13 +2990,13 @@ function NameListModal({
                   }
                 )
               ] }),
-              options && options.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "mt-4 flex flex-col gap-2.5", children: options.map((o) => /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("label", { className: "flex cursor-pointer items-center gap-2.5 text-[13px] text-text-primary", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(CheckBox, { checked: !!checked[o.key], onChange: () => toggle(o.key), ariaLabel: o.label }),
+              options && options.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "mt-4 flex flex-col gap-2.5", children: options.map((o) => /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("label", { className: "flex cursor-pointer items-center gap-2.5 text-[13px] text-text-primary", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(CheckBox, { checked: !!checked[o.key], onChange: () => toggle(o.key), ariaLabel: o.label }),
                 o.label
               ] }, o.key)) }),
-              /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "mt-5 flex items-center justify-end gap-2", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Button, { variant: "secondary", onClick: onCancel, children: "Cancel" }),
-                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Button, { disabled: !name.trim(), onClick: () => onSubmit(name.trim(), checked), children: submitLabel })
+              /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "mt-5 flex items-center justify-end gap-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Button, { variant: "secondary", onClick: onCancel, children: "Cancel" }),
+                /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Button, { disabled: !name.trim(), onClick: () => onSubmit(name.trim(), checked), children: submitLabel })
               ] })
             ]
           }
@@ -2951,7 +3008,7 @@ function NameListModal({
 }
 
 // src/ChipTrigger.tsx
-var import_jsx_runtime28 = require("react/jsx-runtime");
+var import_jsx_runtime29 = require("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",
@@ -2962,13 +3019,13 @@ function chipTriggerClass(variant = "box") {
   );
 }
 function ChipContent({ caption, value, icon }) {
-  const stack = /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: caption }),
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "text-[12px] font-medium text-text-primary", children: value })
+  const stack = /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: caption }),
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "text-[12px] font-medium text-text-primary", children: value })
   ] });
   if (icon) {
-    return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "shrink-0 text-text-tertiary", children: icon }),
+    return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("span", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "shrink-0 text-text-tertiary", children: icon }),
       stack
     ] });
   }
@@ -2976,12 +3033,12 @@ function ChipContent({ caption, value, icon }) {
 }
 
 // src/FilterChipBar.tsx
-var import_lucide_react16 = require("lucide-react");
-var import_jsx_runtime29 = require("react/jsx-runtime");
+var import_lucide_react17 = require("lucide-react");
+var import_jsx_runtime30 = require("react/jsx-runtime");
 function FilterChipBar({ chips, onRemove, onClearAll, parkedKeys }) {
   if (chips.length === 0) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex flex-wrap items-center gap-1.5 border-t border-border-default pt-2.5", children: [
-    chips.map((c) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "flex flex-wrap items-center gap-1.5 border-t border-border-default pt-2.5", children: [
+    chips.map((c) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       Chip,
       {
         label: c.label,
@@ -2991,7 +3048,7 @@ function FilterChipBar({ chips, onRemove, onClearAll, parkedKeys }) {
       },
       c.key
     )),
-    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("button", { type: "button", onClick: onClearAll, className: "ml-1 text-[12px] font-medium text-text-link hover:underline", children: "Clear all" })
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("button", { type: "button", onClick: onClearAll, className: "ml-1 text-[12px] font-medium text-text-link hover:underline", children: "Clear all" })
   ] });
 }
 function Chip({
@@ -3000,8 +3057,8 @@ function Chip({
   parked,
   onRemove
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("span", { className: "group relative inline-flex", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("span", { className: "group relative inline-flex", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
       "span",
       {
         className: cn(
@@ -3013,22 +3070,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__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react16.CircleSlash, { size: 11, "aria-hidden": "true", className: "shrink-0 text-text-tertiary" }),
+          parked && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react17.CircleSlash, { size: 11, "aria-hidden": "true", className: "shrink-0 text-text-tertiary" }),
           label,
-          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
             "button",
             {
               type: "button",
               onClick: onRemove,
               "aria-label": `Remove ${groupLabel}: ${label}`,
               className: "text-text-tertiary transition-colors hover:text-text-primary",
-              children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react16.X, { size: 12 })
+              children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react17.X, { size: 12 })
             }
           )
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       "span",
       {
         role: "tooltip",
@@ -3040,11 +3097,11 @@ function Chip({
 }
 
 // src/SortButton.tsx
-var import_lucide_react17 = require("lucide-react");
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var import_lucide_react18 = require("lucide-react");
+var import_jsx_runtime31 = require("react/jsx-runtime");
 function SortButton({ label, sortKey, sort, onSort, disabled = false }) {
   const active = !disabled && sort.key === sortKey;
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
     "button",
     {
       type: "button",
@@ -3072,8 +3129,8 @@ function SortButton({ label, sortKey, sort, onSort, disabled = false }) {
       ),
       children: [
         label,
-        !disabled && (active ? sort.dir === "asc" ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react17.ArrowUp, { size: 12, className: "shrink-0 text-brand-primaryAction" }) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react17.ArrowDown, { size: 12, className: "shrink-0 text-brand-primaryAction" }) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
-          import_lucide_react17.ArrowUpDown,
+        !disabled && (active ? sort.dir === "asc" ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_lucide_react18.ArrowUp, { size: 12, className: "shrink-0 text-brand-primaryAction" }) : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_lucide_react18.ArrowDown, { size: 12, className: "shrink-0 text-brand-primaryAction" }) : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+          import_lucide_react18.ArrowUpDown,
           {
             size: 12,
             className: "shrink-0 text-text-tertiary opacity-50 transition-opacity group-hover:opacity-100"
@@ -3095,8 +3152,8 @@ function sortProp(sort) {
 }
 
 // src/Pager.tsx
-var import_lucide_react18 = require("lucide-react");
-var import_jsx_runtime31 = require("react/jsx-runtime");
+var import_lucide_react19 = require("lucide-react");
+var import_jsx_runtime32 = require("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]);
@@ -3112,8 +3169,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__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "flex items-center gap-1", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "flex items-center gap-1", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
       "button",
       {
         type: "button",
@@ -3121,11 +3178,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__ */ (0, import_jsx_runtime31.jsx)(import_lucide_react18.ChevronLeft, { size: 16 })
+        children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_lucide_react19.ChevronLeft, { size: 16 })
       }
     ),
     pageWindow(page, totalPages).map(
-      (p) => typeof p === "string" ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "px-1 text-[13px] text-text-tertiary", children: "\u2026" }, p) : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+      (p) => typeof p === "string" ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "px-1 text-[13px] text-text-tertiary", children: "\u2026" }, p) : /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
         "button",
         {
           type: "button",
@@ -3140,7 +3197,7 @@ function Pager({ page, totalPages, onPage }) {
         p
       )
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
       "button",
       {
         type: "button",
@@ -3148,14 +3205,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__ */ (0, import_jsx_runtime31.jsx)(import_lucide_react18.ChevronRight, { size: 16 })
+        children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_lucide_react19.ChevronRight, { size: 16 })
       }
     )
   ] });
 }
 
 // src/WorkspaceAvatar.tsx
-var import_jsx_runtime32 = require("react/jsx-runtime");
+var import_jsx_runtime33 = require("react/jsx-runtime");
 function workspaceInitials(name) {
   const words = name.trim().split(/\s+/).filter(Boolean);
   if (words.length === 0) return "\xB7";
@@ -3171,7 +3228,7 @@ var SIZES = {
   lg: "h-11 w-11 text-[15px]"
 };
 function WorkspaceAvatar({ name, size = "md" }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
     "span",
     {
       "aria-hidden": "true",
@@ -3185,13 +3242,19 @@ function WorkspaceAvatar({ name, size = "md" }) {
 }
 
 // src/Tag.tsx
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_jsx_runtime34 = require("react/jsx-runtime");
 function Tag({ children, className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
     "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
@@ -3200,8 +3263,8 @@ function Tag({ children, className }) {
 }
 
 // src/TablePagination.tsx
-var import_lucide_react19 = require("lucide-react");
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var import_lucide_react20 = require("lucide-react");
+var import_jsx_runtime35 = require("react/jsx-runtime");
 function TablePagination({
   page,
   perPage,
@@ -3221,21 +3284,21 @@ function TablePagination({
     btn,
     "text-text-secondary hover:bg-subtle hover:text-text-primary disabled:pointer-events-none disabled:opacity-30"
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: cn("flex flex-wrap items-center justify-between gap-x-4 gap-y-2", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("label", { className: "flex items-center gap-2 text-[13px] text-text-secondary", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("span", { className: "relative", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: cn("flex flex-wrap items-center justify-between gap-x-4 gap-y-2", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("label", { className: "flex items-center gap-2 text-[13px] text-text-secondary", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("span", { className: "relative", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
           "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__ */ (0, import_jsx_runtime34.jsx)("option", { value: n, children: n }, n))
+            children: perPageOptions.map((n) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("option", { value: n, children: n }, n))
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
-          import_lucide_react19.ChevronDown,
+        /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+          import_lucide_react20.ChevronDown,
           {
             size: 13,
             "aria-hidden": "true",
@@ -3245,8 +3308,8 @@ function TablePagination({
       ] }),
       "items per page"
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("nav", { className: "flex items-center gap-1", "aria-label": "Pagination", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("nav", { className: "flex items-center gap-1", "aria-label": "Pagination", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
         "button",
         {
           type: "button",
@@ -3254,10 +3317,10 @@ function TablePagination({
           disabled: current === 1,
           "aria-label": "First page",
           className: stepBtn,
-          children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_lucide_react19.ChevronFirst, { size: 16, "aria-hidden": "true" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_lucide_react20.ChevronFirst, { size: 16, "aria-hidden": "true" })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
         "button",
         {
           type: "button",
@@ -3265,11 +3328,11 @@ function TablePagination({
           disabled: current === 1,
           "aria-label": "Previous page",
           className: stepBtn,
-          children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_lucide_react19.ChevronLeft, { size: 16, "aria-hidden": "true" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_lucide_react20.ChevronLeft, { size: 16, "aria-hidden": "true" })
         }
       ),
       pageWindow(current, totalPages).map(
-        (p) => typeof p === "string" ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "px-1 text-[13px] text-text-tertiary", children: "\u2026" }, p) : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+        (p) => typeof p === "string" ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "px-1 text-[13px] text-text-tertiary", children: "\u2026" }, p) : /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
           "button",
           {
             type: "button",
@@ -3284,7 +3347,7 @@ function TablePagination({
           p
         )
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
         "button",
         {
           type: "button",
@@ -3292,10 +3355,10 @@ function TablePagination({
           disabled: current === totalPages,
           "aria-label": "Next page",
           className: stepBtn,
-          children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_lucide_react19.ChevronRight, { size: 16, "aria-hidden": "true" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_lucide_react20.ChevronRight, { size: 16, "aria-hidden": "true" })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
         "button",
         {
           type: "button",
@@ -3303,11 +3366,11 @@ function TablePagination({
           disabled: current === totalPages,
           "aria-label": "Last page",
           className: stepBtn,
-          children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_lucide_react19.ChevronLast, { size: 16, "aria-hidden": "true" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_lucide_react20.ChevronLast, { size: 16, "aria-hidden": "true" })
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("span", { className: "text-[13px] text-text-tertiary tabular-nums", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("span", { className: "text-[13px] text-text-tertiary tabular-nums", children: [
       rangeStart.toLocaleString(),
       " \u2013 ",
       rangeEnd.toLocaleString(),
@@ -3321,8 +3384,8 @@ function TablePagination({
 
 // src/DateRangePicker.tsx
 var import_react15 = require("react");
-var import_lucide_react20 = require("lucide-react");
-var import_jsx_runtime35 = require("react/jsx-runtime");
+var import_lucide_react21 = require("lucide-react");
+var import_jsx_runtime36 = require("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"];
@@ -3358,7 +3421,7 @@ function spanLabel(label, today) {
   return `${fmtDate(s)} \u2013 ${fmtDate(e)}`;
 }
 function MiniSelect({ value, onChange, options }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     "select",
     {
       value: String(value),
@@ -3367,7 +3430,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__ */ (0, import_jsx_runtime35.jsx)("option", { value: String(o.value), children: o.label }, String(o.value)))
+      children: options.map((o) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("option", { value: String(o.value), children: o.label }, String(o.value)))
     }
   );
 }
@@ -3428,8 +3491,8 @@ function DateRangePicker({
     if (showFooter) setDraft(label);
     else commit(label);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "relative", ref, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "relative", ref, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
       "button",
       {
         type: "button",
@@ -3438,16 +3501,16 @@ function DateRangePicker({
         "aria-haspopup": "listbox",
         className: chipTriggerClass(),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "text-[10px] text-text-tertiary", children: spanLabel(value, end) }),
-            /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "text-[12px] font-medium text-text-primary", children: value })
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "text-[10px] text-text-tertiary", children: spanLabel(value, end) }),
+            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "text-[12px] font-medium text-text-primary", children: value })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_lucide_react20.ChevronDown, { size: 14, "aria-hidden": "true", className: cn("shrink-0 text-text-secondary transition-transform", open && "rotate-180") })
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_lucide_react21.ChevronDown, { size: 14, "aria-hidden": "true", className: cn("shrink-0 text-text-secondary transition-transform", open && "rotate-180") })
         ]
       }
     ),
-    open && /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("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__ */ (0, import_jsx_runtime35.jsx)(
+    open && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("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__ */ (0, import_jsx_runtime36.jsx)(
         "button",
         {
           type: "button",
@@ -3457,26 +3520,26 @@ function DateRangePicker({
         },
         p
       )),
-      /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "mt-1 border-t border-border-default px-3 pb-2 pt-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "text-[13px] font-semibold text-text-primary", children: "Custom Range" }),
-        /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "mt-2 flex flex-col gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("label", { className: "flex items-center justify-between gap-2 text-[12px] text-text-secondary", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "mt-1 border-t border-border-default px-3 pb-2 pt-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "text-[13px] font-semibold text-text-primary", children: "Custom Range" }),
+        /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "mt-2 flex flex-col gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("label", { className: "flex items-center justify-between gap-2 text-[12px] text-text-secondary", children: [
             "From",
-            /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("span", { className: "flex gap-1", children: [
-              granularity === "month" && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(MiniSelect, { value: fromMo, onChange: setFromMo, options: MONTH_ABBR.map((mm, i) => ({ label: mm, value: i })) }),
-              granularity === "quarter" && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(MiniSelect, { value: fromQ, onChange: setFromQ, options: QUARTER_ABBR.map((qq, i) => ({ label: qq, value: i })) }),
-              /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(MiniSelect, { value: fromYr, onChange: setFromYr, options: yearOptions.map((y) => ({ label: String(y), value: y })) })
+            /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("span", { className: "flex gap-1", children: [
+              granularity === "month" && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(MiniSelect, { value: fromMo, onChange: setFromMo, options: MONTH_ABBR.map((mm, i) => ({ label: mm, value: i })) }),
+              granularity === "quarter" && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(MiniSelect, { value: fromQ, onChange: setFromQ, options: QUARTER_ABBR.map((qq, i) => ({ label: qq, value: i })) }),
+              /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(MiniSelect, { value: fromYr, onChange: setFromYr, options: yearOptions.map((y) => ({ label: String(y), value: y })) })
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("label", { className: "flex items-center justify-between gap-2 text-[12px] text-text-secondary", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("label", { className: "flex items-center justify-between gap-2 text-[12px] text-text-secondary", children: [
             "To",
-            /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("span", { className: "flex gap-1", children: [
-              granularity === "month" && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(MiniSelect, { value: toMo, onChange: setToMo, options: MONTH_ABBR.map((mm, i) => ({ label: mm, value: i })) }),
-              granularity === "quarter" && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(MiniSelect, { value: toQ, onChange: setToQ, options: QUARTER_ABBR.map((qq, i) => ({ label: qq, value: i })) }),
-              /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(MiniSelect, { value: toYr, onChange: setToYr, options: yearOptions.map((y) => ({ label: String(y), value: y })) })
+            /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("span", { className: "flex gap-1", children: [
+              granularity === "month" && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(MiniSelect, { value: toMo, onChange: setToMo, options: MONTH_ABBR.map((mm, i) => ({ label: mm, value: i })) }),
+              granularity === "quarter" && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(MiniSelect, { value: toQ, onChange: setToQ, options: QUARTER_ABBR.map((qq, i) => ({ label: qq, value: i })) }),
+              /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(MiniSelect, { value: toYr, onChange: setToYr, options: yearOptions.map((y) => ({ label: String(y), value: y })) })
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
             "button",
             {
               type: "button",
@@ -3488,15 +3551,15 @@ function DateRangePicker({
           )
         ] })
       ] }),
-      showFooter && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(FilterDropdownFooter, { onApply: () => commit(draft) })
+      showFooter && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(FilterDropdownFooter, { onApply: () => commit(draft) })
     ] })
   ] });
 }
 
 // src/MultiSelectFilter.tsx
 var import_react16 = require("react");
-var import_lucide_react21 = require("lucide-react");
-var import_jsx_runtime36 = require("react/jsx-runtime");
+var import_lucide_react22 = require("lucide-react");
+var import_jsx_runtime37 = require("react/jsx-runtime");
 function MultiSelectFilter({
   caption,
   options = [],
@@ -3587,8 +3650,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__ */ (0, import_jsx_runtime36.jsxs)("div", { className: cn("relative", fullWidth && "w-full"), ref, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: cn("relative", fullWidth && "w-full"), ref, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
       "button",
       {
         type: "button",
@@ -3596,9 +3659,9 @@ function MultiSelectFilter({
         "aria-expanded": open,
         className: cn(chipTriggerClass(variant), fullWidth && "w-full justify-between"),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(ChipContent, { caption, value, icon }),
-          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
-            import_lucide_react21.ChevronDown,
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ChipContent, { caption, value, icon }),
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+            import_lucide_react22.ChevronDown,
             {
               size: 14,
               "aria-hidden": "true",
@@ -3608,7 +3671,7 @@ function MultiSelectFilter({
         ]
       }
     ),
-    open && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
+    open && /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
       "div",
       {
         className: cn(
@@ -3619,9 +3682,9 @@ function MultiSelectFilter({
         role: "dialog",
         "aria-label": caption,
         children: [
-          searchable && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "border-b border-border-default p-2", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "flex h-9 items-center gap-2 rounded-control border border-border-default bg-input px-2.5", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_lucide_react21.Search, { size: 14, className: "text-text-secondary", "aria-hidden": "true" }),
-            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+          searchable && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "border-b border-border-default p-2", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex h-9 items-center gap-2 rounded-control border border-border-default bg-input px-2.5", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react22.Search, { size: 14, className: "text-text-secondary", "aria-hidden": "true" }),
+            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
               "input",
               {
                 type: "text",
@@ -3631,37 +3694,37 @@ function MultiSelectFilter({
                 className: "h-full flex-1 bg-transparent text-[13px] outline-hidden placeholder:text-text-tertiary"
               }
             ),
-            q && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("button", { type: "button", onClick: () => setQ(""), "aria-label": "Clear search", className: "text-text-tertiary hover:text-text-primary", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_lucide_react21.X, { size: 13 }) })
+            q && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("button", { type: "button", onClick: () => setQ(""), "aria-label": "Clear search", className: "text-text-tertiary hover:text-text-primary", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react22.X, { size: 13 }) })
           ] }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "max-h-[280px] overflow-y-auto p-1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "max-h-[280px] overflow-y-auto p-1", children: [
             groups ? visibleGroups.map((g) => {
               const state = groupState(g);
-              return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
+              return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
                   "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__ */ (0, import_jsx_runtime36.jsx)(TriCheck, { state }),
-                      /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: cn("flex-1 text-[14px] text-text-primary", !plainParent && "font-semibold"), children: g.label }),
-                      counts && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(OptionCount, { n: countFor(g.id) })
+                      /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(TriCheck, { state }),
+                      /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: cn("flex-1 text-[14px] text-text-primary", !plainParent && "font-semibold"), children: g.label }),
+                      counts && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(OptionCount, { n: countFor(g.id) })
                     ]
                   }
                 ),
                 g.children.map((c) => {
                   const checked = draft.includes(c.id);
-                  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
                     "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__ */ (0, import_jsx_runtime36.jsx)(TriCheck, { state: checked ? "all" : "none" }),
-                        /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "flex-1 text-[14px] text-text-primary", children: c.label }),
-                        counts && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(OptionCount, { n: countFor(c.id) })
+                        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(TriCheck, { state: checked ? "all" : "none" }),
+                        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "flex-1 text-[14px] text-text-primary", children: c.label }),
+                        counts && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(OptionCount, { n: countFor(c.id) })
                       ]
                     },
                     c.id
@@ -3670,33 +3733,33 @@ function MultiSelectFilter({
               ] }, g.id);
             }) : items.map((o) => {
               const checked = draft.includes(o.id);
-              return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
+              return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
                 "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__ */ (0, import_jsx_runtime36.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
                       "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__ */ (0, import_jsx_runtime36.jsx)(import_lucide_react21.Check, { size: 13, strokeWidth: 3 })
+                        children: checked && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react22.Check, { size: 13, strokeWidth: 3 })
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "flex-1 text-[14px] text-text-primary", children: o.label }),
-                    counts && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(OptionCount, { n: countFor(o.id) })
+                    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "flex-1 text-[14px] text-text-primary", children: o.label }),
+                    counts && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(OptionCount, { n: countFor(o.id) })
                   ]
                 },
                 o.id
               );
             }),
-            (groups && !visibleGroups.length || !groups && !items.length) && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "py-6 text-center text-[13px] text-text-tertiary", children: "No matches." })
+            (groups && !visibleGroups.length || !groups && !items.length) && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "py-6 text-center text-[13px] text-text-tertiary", children: "No matches." })
           ] }),
-          showFooter ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(FilterDropdownFooter, { onClear: () => setDraft(clearValue), onApply: apply }) : min === 0 && draft.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "border-t border-border-default p-2", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
+          showFooter ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(FilterDropdownFooter, { onClear: () => setDraft(clearValue), onApply: apply }) : min === 0 && draft.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "border-t border-border-default p-2", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
             "button",
             {
               type: "button",
@@ -3715,7 +3778,7 @@ function MultiSelectFilter({
 }
 function TriCheck({ state }) {
   const filled = state !== "none";
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
     "span",
     {
       className: cn(
@@ -3723,14 +3786,14 @@ function TriCheck({ state }) {
         filled ? "border-transparent bg-brand-primaryAction text-brand-onprimary" : "border-border-interactive bg-input"
       ),
       children: [
-        state === "all" && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_lucide_react21.Check, { size: 13, strokeWidth: 3 }),
-        state === "some" && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_lucide_react21.Minus, { size: 13, strokeWidth: 3 })
+        state === "all" && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react22.Check, { size: 13, strokeWidth: 3 }),
+        state === "some" && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react22.Minus, { size: 13, strokeWidth: 3 })
       ]
     }
   );
 }
 function OptionCount({ n }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("span", { className: "shrink-0 text-[12px] tabular-nums text-text-tertiary", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("span", { className: "shrink-0 text-[12px] tabular-nums text-text-tertiary", children: [
     "(",
     n.toLocaleString(),
     ")"
@@ -3738,14 +3801,14 @@ function OptionCount({ n }) {
 }
 
 // src/Toggle.tsx
-var import_jsx_runtime37 = require("react/jsx-runtime");
+var import_jsx_runtime38 = require("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__ */ (0, import_jsx_runtime37.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
     "button",
     {
       type: "button",
@@ -3761,7 +3824,7 @@ function Toggle({ checked, onChange, label, size = "md", disabled, className })
         disabled && "cursor-not-allowed opacity-50",
         className
       ),
-      children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
         "span",
         {
           className: cn(
@@ -3777,21 +3840,21 @@ function Toggle({ checked, onChange, label, size = "md", disabled, className })
 
 // src/AISpark.tsx
 var import_react17 = require("react");
-var import_lucide_react22 = require("lucide-react");
-var import_jsx_runtime38 = require("react/jsx-runtime");
+var import_lucide_react23 = require("lucide-react");
+var import_jsx_runtime39 = require("react/jsx-runtime");
 function AISpark({ size = 16, className }) {
   const id = (0, import_react17.useId)();
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_jsx_runtime38.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("svg", { width: "0", height: "0", "aria-hidden": "true", style: { position: "absolute" }, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("linearGradient", { id, x1: "0", y1: "0", x2: "1", y2: "1", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("stop", { offset: "0%", stopColor: "var(--mr-color-brand-primary)" }),
-      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("stop", { offset: "100%", className: "[stop-color:#9474ff] in-data-[theme=dark]:[stop-color:#a488ff]" })
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_jsx_runtime39.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("svg", { width: "0", height: "0", "aria-hidden": "true", style: { position: "absolute" }, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("linearGradient", { id, x1: "0", y1: "0", x2: "1", y2: "1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("stop", { offset: "0%", stopColor: "var(--mr-color-brand-primary)" }),
+      /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("stop", { offset: "100%", className: "[stop-color:#9474ff] in-data-[theme=dark]:[stop-color:#a488ff]" })
     ] }) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react22.Sparkles, { size, stroke: `url(#${id})`, className, "aria-hidden": "true" })
+    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react23.Sparkles, { size, stroke: `url(#${id})`, className, "aria-hidden": "true" })
   ] });
 }
 
 // src/Freshness.tsx
-var import_jsx_runtime39 = require("react/jsx-runtime");
+var import_jsx_runtime40 = require("react/jsx-runtime");
 var dotColor = {
   fresh: "bg-status-success",
   recent: "bg-status-warning",
@@ -3803,7 +3866,7 @@ var srLabel = {
   stale: "Older than a day"
 };
 function Freshness({ level }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
     "span",
     {
       className: cn("inline-block h-1.5 w-1.5 shrink-0 rounded-full", dotColor[level]),
@@ -3829,6 +3892,7 @@ function Freshness({ level }) {
   DataScopeFilter,
   DateRangeFilter,
   DateRangePicker,
+  Delta,
   FilterChipBar,
   FilterDropdownFooter,
   Freshness,