@assure-one/design-system 1.1.0 → 1.3.0

package/dist/index.js

@@ -1,6 +1,6 @@
 "use client";
-import * as React36 from 'react';
-import { forwardRef, useState, useCallback, useId, useRef, useImperativeHandle, useMemo, useEffect, createContext, useContext } from 'react';
+import * as React37 from 'react';
+import { forwardRef, useId, useRef, useState, useEffect, useCallback, useImperativeHandle, useMemo, createContext, useContext } from 'react';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
@@ -8,8 +8,8 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
 import { cva } from 'class-variance-authority';
 import * as AspectRatioPrimitive from '@radix-ui/react-aspect-ratio';
-import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import { Slot } from '@radix-ui/react-slot';
+import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import { DayPicker } from 'react-day-picker';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import * as SelectPrimitive from '@radix-ui/react-select';
@@ -91,9 +91,9 @@ var colors = {
 };
 var typography = {
   family: {
-    display: '"Inter", -apple-system, system-ui, sans-serif',
-    body: '"Inter", -apple-system, system-ui, sans-serif',
-    mono: '"Inter", -apple-system, system-ui, sans-serif'
+    display: '"Plus Jakarta Sans", -apple-system, system-ui, sans-serif',
+    body: '"Plus Jakarta Sans", -apple-system, system-ui, sans-serif',
+    mono: '"Plus Jakarta Sans", -apple-system, system-ui, sans-serif'
   },
   weight: {
     regular: 400,
@@ -194,7 +194,7 @@ var systemTokens = {
     rule: "var(--color-rule)",
     ruleSoft: "var(--color-rule-soft)",
     ruleStrong: "var(--color-rule-strong)",
-    /* Accent (cyan) */
+    /* Accent (purple) */
     accent: "var(--color-accent)",
     accent2: "var(--color-accent-2)",
     accentTint: "var(--color-accent-tint)",
@@ -229,8 +229,30 @@ var systemTokens = {
     warningLine: "var(--color-warning-line)",
     dangerFg: "var(--color-danger-fg)",
     dangerBg: "var(--color-danger-bg)",
-    dangerLine: "var(--color-danger-line)"
+    dangerLine: "var(--color-danger-line)",
+    /* Data-viz — chart series ramp + area gradient stops */
+    chart1: "var(--color-chart-1)",
+    chart2: "var(--color-chart-2)",
+    chart3: "var(--color-chart-3)",
+    chart4: "var(--color-chart-4)",
+    chartLine: "var(--color-chart-line)",
+    chartAreaFrom: "var(--color-chart-area-from)",
+    chartAreaTo: "var(--color-chart-area-to)",
+    /* Practice service tones — fill + track tint */
+    serviceTax: "var(--color-service-tax)",
+    serviceTaxBg: "var(--color-service-tax-bg)",
+    serviceAudit: "var(--color-service-audit)",
+    serviceAuditBg: "var(--color-service-audit-bg)",
+    serviceAccounting: "var(--color-service-accounting)",
+    serviceAccountingBg: "var(--color-service-accounting-bg)"
   },
+  /** Ordered chart series ramp — index a series by position, cycle with `% 4`. */
+  chart: [
+    "var(--color-chart-1)",
+    "var(--color-chart-2)",
+    "var(--color-chart-3)",
+    "var(--color-chart-4)"
+  ],
   gradient: {
     brand: "var(--gradient-brand)",
     pro: "var(--gradient-pro)",
@@ -507,6 +529,45 @@ function BuildingIcon({ size = 24, ...props }) {
     }
   ) });
 }
+function LandmarkIcon({ size = 24, ...props }) {
+  return /* @__PURE__ */ jsx(Icon, { size, ...props, children: /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: "M3 22h18M6 18v-7M10 18v-7M14 18v-7M18 18v-7M12 2 20 7 4 7Z",
+      stroke: "currentColor",
+      strokeWidth: "1.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ) });
+}
+function FolderUpIcon({ size = 24, ...props }) {
+  return /* @__PURE__ */ jsx(Icon, { size, ...props, children: /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: "M20 20a2 2 0 002-2V8a2 2 0 00-2-2h-7.9a2 2 0 01-1.69-.9L9.6 3.9A2 2 0 007.93 3H4a2 2 0 00-2 2v13a2 2 0 002 2ZM12 10v6M9 13l3-3 3 3",
+      stroke: "currentColor",
+      strokeWidth: "1.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ) });
+}
+function PenToolIcon({ size = 24, ...props }) {
+  return /* @__PURE__ */ jsxs(Icon, { size, ...props, children: [
+    /* @__PURE__ */ jsx(
+      "path",
+      {
+        d: "M15.7 21.3a1 1 0 01-1.4 0l-1.6-1.6a1 1 0 010-1.4l5.6-5.6a1 1 0 011.4 0l1.6 1.6a1 1 0 010 1.4zM18 13l-1.4-6.9a1 1 0 00-.7-.8L3.2 2a1 1 0 00-1.2 1.2l3.3 12.7a1 1 0 00.8.7L13 18M2.3 2.3l7.3 7.3",
+        stroke: "currentColor",
+        strokeWidth: "1.5",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    ),
+    /* @__PURE__ */ jsx("circle", { cx: "11", cy: "11", r: "2", stroke: "currentColor", strokeWidth: "1.5" })
+  ] });
+}
 function MapPinIcon({ size = 24, ...props }) {
   return /* @__PURE__ */ jsxs(Icon, { size, ...props, children: [
     /* @__PURE__ */ jsx(
@@ -2224,7 +2285,7 @@ function PauseIcon({ size = 24, ...props }) {
 function StopIcon({ size = 24, ...props }) {
   return /* @__PURE__ */ jsx(Icon, { size, ...props, children: /* @__PURE__ */ jsx("rect", { x: "6", y: "6", width: "12", height: "12", rx: "2", fill: "currentColor" }) });
 }
-var Accordion = React36.forwardRef(function Accordion2({ className, ...props }, ref) {
+var Accordion = React37.forwardRef(function Accordion2({ className, ...props }, ref) {
   return /* @__PURE__ */ jsx(
     AccordionPrimitive.Root,
     {
@@ -2235,11 +2296,11 @@ var Accordion = React36.forwardRef(function Accordion2({ className, ...props },
   );
 });
 Accordion.displayName = AccordionPrimitive.Root.displayName;
-var AccordionItem = React36.forwardRef(function AccordionItem2({ className, ...props }, ref) {
+var AccordionItem = React37.forwardRef(function AccordionItem2({ className, ...props }, ref) {
   return /* @__PURE__ */ jsx(AccordionPrimitive.Item, { ref, className: cn(className), ...props });
 });
 AccordionItem.displayName = AccordionPrimitive.Item.displayName;
-var AccordionTrigger = React36.forwardRef(function AccordionTrigger2({ children, className, ...props }, ref) {
+var AccordionTrigger = React37.forwardRef(function AccordionTrigger2({ children, className, ...props }, ref) {
   return /* @__PURE__ */ jsx(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ jsxs(
     AccordionPrimitive.Trigger,
     {
@@ -2268,7 +2329,7 @@ var AccordionTrigger = React36.forwardRef(function AccordionTrigger2({ children,
   ) });
 });
 AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
-var AccordionContent = React36.forwardRef(function AccordionContent2({ children, className, ...props }, ref) {
+var AccordionContent = React37.forwardRef(function AccordionContent2({ children, className, ...props }, ref) {
   return /* @__PURE__ */ jsx(
     AccordionPrimitive.Content,
     {
@@ -2288,7 +2349,7 @@ AccordionContent.displayName = AccordionPrimitive.Content.displayName;
 var AlertDialog = AlertDialogPrimitive.Root;
 var AlertDialogTrigger = AlertDialogPrimitive.Trigger;
 var AlertDialogPortal = AlertDialogPrimitive.Portal;
-var AlertDialogOverlay = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var AlertDialogOverlay = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   AlertDialogPrimitive.Overlay,
   {
     ref,
@@ -2303,7 +2364,7 @@ var AlertDialogOverlay = React36.forwardRef(({ className, ...props }, ref) => /*
   }
 ));
 AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName;
-var AlertDialogContent = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [
+var AlertDialogContent = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [
   /* @__PURE__ */ jsx(AlertDialogOverlay, {}),
   /* @__PURE__ */ jsx(
     AlertDialogPrimitive.Content,
@@ -2338,7 +2399,7 @@ var AlertDialogFooter = ({ className, ...props }) => /* @__PURE__ */ jsx(
   }
 );
 AlertDialogFooter.displayName = "AlertDialogFooter";
-var AlertDialogTitle = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var AlertDialogTitle = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   AlertDialogPrimitive.Title,
   {
     ref,
@@ -2350,7 +2411,7 @@ var AlertDialogTitle = React36.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName;
-var AlertDialogDescription = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var AlertDialogDescription = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   AlertDialogPrimitive.Description,
   {
     ref,
@@ -2359,7 +2420,7 @@ var AlertDialogDescription = React36.forwardRef(({ className, ...props }, ref) =
   }
 ));
 AlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayName;
-var AlertDialogAction = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var AlertDialogAction = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   AlertDialogPrimitive.Action,
   {
     ref,
@@ -2375,7 +2436,7 @@ var AlertDialogAction = React36.forwardRef(({ className, ...props }, ref) => /*
   }
 ));
 AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;
-var AlertDialogCancel = React36.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
+var AlertDialogCancel = React37.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
   AlertDialogPrimitive.Cancel,
   {
     ref,
@@ -2473,7 +2534,104 @@ var AlertDescription = forwardRef(function AlertDescription2({ className, ...pro
   return /* @__PURE__ */ jsx("p", { ref, className: cn("text-sm", className), ...props });
 });
 AlertDescription.displayName = "AlertDescription";
-var AspectRatio = React36.forwardRef(function AspectRatio2({ className, ratio = 16 / 9, ...props }, ref) {
+var defaultFormat = (n) => n.toLocaleString();
+var AreaChart = forwardRef(function AreaChart2({ data, height = 140, formatValue = defaultFormat, showAxis = true, className, ...props }, ref) {
+  const gradientId = useId();
+  const wrapRef = useRef(null);
+  const [width, setWidth] = useState(620);
+  const [hover, setHover] = useState(null);
+  useEffect(() => {
+    const el = wrapRef.current;
+    if (!el) return;
+    const ro = new ResizeObserver((entries) => {
+      for (const entry of entries) setWidth(entry.contentRect.width);
+    });
+    ro.observe(el);
+    return () => ro.disconnect();
+  }, []);
+  const padX = 10;
+  const padTop = 14;
+  const padBot = 8;
+  const max = Math.max(...data.map((d) => d.value), 1) * 1.15;
+  const step = data.length > 1 ? (width - padX * 2) / (data.length - 1) : 0;
+  const pts = data.map(
+    (d, i) => [padX + i * step, height - padBot - d.value / max * (height - padTop - padBot)]
+  );
+  const line = pts.map((p, i) => `${i ? "L" : "M"}${p[0].toFixed(1)} ${p[1].toFixed(1)}`).join(" ");
+  const area = pts.length > 0 ? `${line} L${pts[pts.length - 1][0].toFixed(1)} ${height} L${pts[0][0].toFixed(1)} ${height} Z` : "";
+  return /* @__PURE__ */ jsxs("div", { ref, className: cn("w-full", className), ...props, children: [
+    /* @__PURE__ */ jsxs("div", { ref: wrapRef, className: "relative w-full", children: [
+      /* @__PURE__ */ jsxs(
+        "svg",
+        {
+          width,
+          height,
+          viewBox: `0 0 ${width} ${height}`,
+          role: "img",
+          "aria-label": "Area trend chart",
+          onMouseLeave: () => setHover(null),
+          children: [
+            /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", { id: gradientId, x1: "0", y1: "0", x2: "0", y2: "1", children: [
+              /* @__PURE__ */ jsx("stop", { offset: "0%", stopColor: "var(--color-chart-area-from)" }),
+              /* @__PURE__ */ jsx("stop", { offset: "100%", stopColor: "var(--color-chart-area-to)" })
+            ] }) }),
+            area && /* @__PURE__ */ jsx("path", { d: area, fill: `url(#${gradientId})` }),
+            line && /* @__PURE__ */ jsx(
+              "path",
+              {
+                d: line,
+                fill: "none",
+                stroke: "var(--color-chart-line)",
+                strokeWidth: "2.5",
+                strokeLinecap: "round",
+                strokeLinejoin: "round"
+              }
+            ),
+            pts.map((p, i) => /* @__PURE__ */ jsxs("g", { children: [
+              /* @__PURE__ */ jsx(
+                "circle",
+                {
+                  cx: p[0],
+                  cy: p[1],
+                  r: hover === i ? 5.5 : 4,
+                  fill: "var(--color-surface)",
+                  stroke: "var(--color-chart-line)",
+                  strokeWidth: "2.5",
+                  className: "transition-[r] duration-[var(--duration-instant)] ease-[var(--ease-out-quart)] motion-reduce:transition-none"
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "rect",
+                {
+                  x: p[0] - (step || width) / 2,
+                  y: 0,
+                  width: step || width,
+                  height,
+                  fill: "transparent",
+                  onMouseEnter: () => setHover(i)
+                }
+              )
+            ] }, i))
+          ]
+        }
+      ),
+      hover != null && pts[hover] && /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "bg-fg text-bg pointer-events-none absolute top-0 z-[var(--z-tooltip)] -translate-x-1/2 -translate-y-1 rounded-[var(--radius-icon)] px-2 py-1 text-center shadow-[var(--shadow-pop)]",
+          style: { left: `${pts[hover][0] / width * 100}%` },
+          children: [
+            /* @__PURE__ */ jsx("span", { className: "block text-xs font-semibold tabular-nums", children: formatValue(data[hover].value) }),
+            /* @__PURE__ */ jsx("span", { className: "block text-[10px] opacity-70", children: data[hover].label })
+          ]
+        }
+      )
+    ] }),
+    showAxis && /* @__PURE__ */ jsx("div", { className: "text-fg-4 mt-1.5 flex justify-between text-[11px] tabular-nums", children: data.map((d) => /* @__PURE__ */ jsx("span", { children: d.label }, d.label)) })
+  ] });
+});
+AreaChart.displayName = "AreaChart";
+var AspectRatio = React37.forwardRef(function AspectRatio2({ className, ratio = 16 / 9, ...props }, ref) {
   return /* @__PURE__ */ jsx(
     AspectRatioPrimitive.Root,
     {
@@ -2485,6 +2643,292 @@ var AspectRatio = React36.forwardRef(function AspectRatio2({ className, ratio =
   );
 });
 AspectRatio.displayName = AspectRatioPrimitive.Root.displayName;
+var spinnerVariants = cva(
+  "inline-flex shrink-0 items-center justify-center [&_svg]:motion-reduce:animate-none",
+  {
+    variants: {
+      size: {
+        xs: "[&_svg]:size-3",
+        sm: "[&_svg]:size-4",
+        md: "[&_svg]:size-5",
+        lg: "[&_svg]:size-6"
+      },
+      tone: {
+        current: "text-current",
+        muted: "text-fg-3",
+        accent: "text-accent",
+        success: "text-success-fg",
+        warning: "text-warning-fg",
+        destructive: "text-danger-fg"
+      }
+    },
+    defaultVariants: {
+      size: "md",
+      tone: "current"
+    }
+  }
+);
+var Spinner = forwardRef(function Spinner2({ size, tone, label, className, ...props }, ref) {
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      ref,
+      role: label ? "status" : void 0,
+      "aria-live": label ? "polite" : void 0,
+      className: cn(spinnerVariants({ size, tone }), className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(LoaderIcon, { className: "animate-spin", "aria-hidden": "true" }),
+        label && /* @__PURE__ */ jsx("span", { className: "sr-only", children: label })
+      ]
+    }
+  );
+});
+Spinner.displayName = "Spinner";
+var buttonVariants = cva(
+  cn(
+    "inline-flex items-center justify-center rounded-btn font-medium whitespace-nowrap cursor-pointer",
+    "transition-[color,background-color,border-color,box-shadow] duration-[var(--duration-fast)] ease-[var(--ease-out-quart)]",
+    "focus-visible:outline-none focus-visible:[box-shadow:var(--shadow-focus-ring)]",
+    "disabled:pointer-events-none disabled:bg-bg-disabled disabled:text-fg-disabled",
+    "motion-reduce:transition-none",
+    "[&_svg]:size-4 [&_svg]:shrink-0"
+  ),
+  {
+    variants: {
+      variant: {
+        primary: "bg-pro-fg text-fg-on-pro hover:bg-pro-hover active:bg-pro-active",
+        secondary: "bg-control-secondary-bg text-control-fg border border-control-border hover:bg-control-active-bg hover:border-control-border-strong",
+        destructive: "bg-danger-fg text-fg-on-danger hover:bg-danger-fg-hover active:bg-danger-fg-active",
+        success: "bg-success-fg text-fg-on-success hover:bg-success-fg-hover active:bg-success-fg-active",
+        ghost: "bg-control-bg text-control-fg hover:bg-control-hover-bg hover:text-control-hover-fg",
+        outline: "border border-control-border-strong bg-control-bg text-control-fg hover:bg-control-hover-bg hover:border-control-border-hover",
+        link: "bg-transparent text-accent underline-offset-4 hover:underline p-0 h-auto",
+        accent: "bg-accent text-fg-on-accent hover:bg-accent-hover active:bg-accent-active",
+        dashed: "border-2 border-dashed border-control-border bg-control-bg text-control-muted-fg hover:border-control-border-hover hover:bg-control-hover-bg hover:text-control-hover-fg"
+      },
+      size: {
+        sm: "h-8 px-3 text-[13px] gap-1.5",
+        md: "h-10 px-4 text-sm gap-2",
+        lg: "h-12 px-6 text-base gap-2",
+        // Icon-only sizes. Hit target ≥ 24px (WCAG 2.5.5 floor).
+        // `icon-xs` / `icon-sm` are for dense in-row action stacks where
+        // `size="icon"` (40×40) would visually crowd the row.
+        "icon-xs": "size-6 [&_svg]:size-3.5",
+        "icon-sm": "size-7 [&_svg]:size-4",
+        icon: "size-10"
+      }
+    },
+    defaultVariants: {
+      variant: "primary",
+      size: "md"
+    }
+  }
+);
+var Button = forwardRef(function Button2({
+  variant,
+  size,
+  asChild = false,
+  loading,
+  iconLeft,
+  iconRight,
+  disabled,
+  children,
+  className,
+  ...props
+}, ref) {
+  const Comp = asChild ? Slot : "button";
+  if (asChild) {
+    return /* @__PURE__ */ jsx(Comp, { ref, className: cn(buttonVariants({ variant, size }), className), ...props, children });
+  }
+  return /* @__PURE__ */ jsxs(
+    Comp,
+    {
+      ref,
+      disabled: disabled || loading,
+      className: cn(buttonVariants({ variant, size }), className),
+      ...props,
+      children: [
+        loading ? /* @__PURE__ */ jsx(Spinner, { size: "sm" }) : iconLeft && /* @__PURE__ */ jsx("span", { className: "inline-flex shrink-0", "aria-hidden": "true", children: iconLeft }),
+        children,
+        iconRight && !loading && /* @__PURE__ */ jsx("span", { className: "inline-flex shrink-0", "aria-hidden": "true", children: iconRight })
+      ]
+    }
+  );
+});
+Button.displayName = "Button";
+var fileTypeBadgeVariants = cva(
+  cn(
+    "inline-grid shrink-0 select-none place-items-center",
+    "font-extrabold uppercase leading-none tracking-wide"
+  ),
+  {
+    variants: {
+      size: {
+        sm: "size-8 rounded-btn text-[9px]",
+        md: "size-10 rounded-card text-[10px]"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+var toneStyles = {
+  danger: "bg-danger-bg text-danger-fg",
+  info: "bg-accent-tint text-accent",
+  accent: "bg-accent-tint text-accent-2",
+  success: "bg-success-bg text-success-fg",
+  warning: "bg-warning-bg text-warning-fg",
+  neutral: "bg-surface-3 text-fg-3"
+};
+var EXT_TO_TYPE = {
+  pdf: "PDF",
+  img: "IMG",
+  image: "IMG",
+  png: "IMG",
+  jpg: "IMG",
+  jpeg: "IMG",
+  gif: "IMG",
+  svg: "IMG",
+  webp: "IMG",
+  heic: "IMG",
+  heif: "IMG",
+  bmp: "IMG",
+  tif: "IMG",
+  tiff: "IMG",
+  doc: "DOC",
+  docx: "DOC",
+  rtf: "DOC",
+  txt: "DOC",
+  odt: "DOC",
+  pages: "DOC",
+  xls: "XLS",
+  xlsx: "XLS",
+  ods: "XLS",
+  numbers: "XLS",
+  csv: "CSV",
+  ppt: "PPT",
+  pptx: "PPT",
+  odp: "PPT",
+  key: "PPT",
+  zip: "ZIP",
+  rar: "ZIP",
+  "7z": "ZIP",
+  tar: "ZIP",
+  gz: "ZIP",
+  gzip: "ZIP"
+};
+var TYPE_TO_TONE = {
+  PDF: "danger",
+  IMG: "info",
+  DOC: "accent",
+  XLS: "success",
+  CSV: "success",
+  PPT: "warning",
+  ZIP: "neutral"
+};
+function normalizeFileType(input) {
+  const key = input.trim().toLowerCase().replace(/^\.+/, "");
+  if (!key) return "FILE";
+  return EXT_TO_TYPE[key] ?? key.toUpperCase().slice(0, 3);
+}
+function fileTypeFromName(fileName) {
+  const dot = fileName.lastIndexOf(".");
+  const ext = dot >= 0 && dot < fileName.length - 1 ? fileName.slice(dot + 1) : "";
+  return normalizeFileType(ext);
+}
+var FileTypeBadge = forwardRef(function FileTypeBadge2({ format: format2, type, fileName, tone = "auto", size, className, "aria-label": ariaLabel, ...props }, ref) {
+  const raw = format2 ?? type ?? (fileName != null ? fileTypeFromName(fileName) : void 0) ?? "FILE";
+  const code = normalizeFileType(raw);
+  const resolvedTone = tone !== "auto" ? tone : TYPE_TO_TONE[code] ?? "neutral";
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      ref,
+      role: "img",
+      "aria-label": ariaLabel ?? `${code} file`,
+      className: cn(fileTypeBadgeVariants({ size }), toneStyles[resolvedTone], className),
+      ...props,
+      children: code
+    }
+  );
+});
+FileTypeBadge.displayName = "FileTypeBadge";
+var attachmentChipVariants = cva(
+  cn(
+    "flex items-center gap-3 rounded-card border px-3 py-2.5 text-left",
+    "transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] motion-reduce:transition-none"
+  ),
+  {
+    variants: {
+      variant: {
+        default: "border-rule bg-surface hover:bg-bg-2",
+        onAccent: "border-white/25 bg-white/15 hover:bg-white/25"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function deriveFileType(name) {
+  const dot = name.lastIndexOf(".");
+  if (dot === -1 || dot === name.length - 1) return "FILE";
+  return name.slice(dot + 1).toUpperCase();
+}
+var AttachmentChip = forwardRef(
+  function AttachmentChip2({ name, fileType, meta, onView, onDownload, href, variant, className, ...props }, ref) {
+    const resolvedType = fileType ?? deriveFileType(name);
+    const onAccent = variant === "onAccent";
+    const actionClassName = onAccent ? "text-fg-on-pro hover:bg-white/20 hover:text-fg-on-pro" : void 0;
+    const showView = Boolean(onView) || Boolean(href);
+    return /* @__PURE__ */ jsxs("div", { ref, className: cn(attachmentChipVariants({ variant }), className), ...props, children: [
+      /* @__PURE__ */ jsx(FileTypeBadge, { format: resolvedType, size: "md", className: "shrink-0" }),
+      /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsx("p", { className: cn("truncate text-sm font-medium", onAccent ? "text-fg-on-pro" : "text-fg"), children: name }),
+        meta && /* @__PURE__ */ jsx("p", { className: cn("truncate text-xs", onAccent ? "text-fg-on-pro/75" : "text-fg-3"), children: meta })
+      ] }),
+      (showView || onDownload) && /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-0.5", children: [
+        showView && (onView ? /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            variant: "ghost",
+            size: "icon-sm",
+            "aria-label": `View ${name}`,
+            onClick: onView,
+            className: actionClassName,
+            children: /* @__PURE__ */ jsx(EyeIcon, { size: 16 })
+          }
+        ) : /* @__PURE__ */ jsx(
+          Button,
+          {
+            asChild: true,
+            variant: "ghost",
+            size: "icon-sm",
+            "aria-label": `View ${name}`,
+            className: actionClassName,
+            children: /* @__PURE__ */ jsx("a", { href, target: "_blank", rel: "noopener noreferrer", children: /* @__PURE__ */ jsx(EyeIcon, { size: 16 }) })
+          }
+        )),
+        onDownload && /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            variant: "ghost",
+            size: "icon-sm",
+            "aria-label": `Download ${name}`,
+            onClick: onDownload,
+            className: actionClassName,
+            children: /* @__PURE__ */ jsx(DownloadIcon, { size: 16 })
+          }
+        )
+      ] })
+    ] });
+  }
+);
+AttachmentChip.displayName = "AttachmentChip";
 var avatarVariants = cva(
   cn(
     "relative inline-flex shrink-0 items-center justify-center overflow-hidden rounded-full",
@@ -2526,7 +2970,7 @@ var statusDotSizes = {
 function getInitials(name) {
   return name.split(" ").map((part) => part[0]).filter(Boolean).slice(0, 2).join("").toUpperCase();
 }
-var Avatar = React36.forwardRef(
+var Avatar = React37.forwardRef(
   function Avatar2({ src, alt, name, size = "md", variant = "initials", status, className, ...props }, ref) {
     const initials = name ? getInitials(name) : "?";
     const resolvedSize = size ?? "md";
@@ -2750,120 +3194,6 @@ var BreadcrumbSeparator = forwardRef(
   }
 );
 BreadcrumbSeparator.displayName = "BreadcrumbSeparator";
-var spinnerVariants = cva(
-  "inline-flex shrink-0 items-center justify-center [&_svg]:motion-reduce:animate-none",
-  {
-    variants: {
-      size: {
-        xs: "[&_svg]:size-3",
-        sm: "[&_svg]:size-4",
-        md: "[&_svg]:size-5",
-        lg: "[&_svg]:size-6"
-      },
-      tone: {
-        current: "text-current",
-        muted: "text-fg-3",
-        accent: "text-accent",
-        success: "text-success-fg",
-        warning: "text-warning-fg",
-        destructive: "text-danger-fg"
-      }
-    },
-    defaultVariants: {
-      size: "md",
-      tone: "current"
-    }
-  }
-);
-var Spinner = forwardRef(function Spinner2({ size, tone, label, className, ...props }, ref) {
-  return /* @__PURE__ */ jsxs(
-    "span",
-    {
-      ref,
-      role: label ? "status" : void 0,
-      "aria-live": label ? "polite" : void 0,
-      className: cn(spinnerVariants({ size, tone }), className),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx(LoaderIcon, { className: "animate-spin", "aria-hidden": "true" }),
-        label && /* @__PURE__ */ jsx("span", { className: "sr-only", children: label })
-      ]
-    }
-  );
-});
-Spinner.displayName = "Spinner";
-var buttonVariants = cva(
-  cn(
-    "inline-flex items-center justify-center rounded-btn font-medium whitespace-nowrap",
-    "transition-[color,background-color,border-color,box-shadow] duration-[var(--duration-fast)] ease-[var(--ease-out-quart)]",
-    "focus-visible:outline-none focus-visible:[box-shadow:var(--shadow-focus-ring)]",
-    "disabled:pointer-events-none disabled:bg-bg-disabled disabled:text-fg-disabled",
-    "motion-reduce:transition-none",
-    "[&_svg]:size-4 [&_svg]:shrink-0"
-  ),
-  {
-    variants: {
-      variant: {
-        primary: "bg-pro-fg text-fg-on-pro hover:bg-pro-hover active:bg-pro-active",
-        secondary: "bg-control-secondary-bg text-control-fg border border-control-border hover:bg-control-active-bg hover:border-control-border-strong",
-        destructive: "bg-danger-fg text-fg-on-danger hover:bg-danger-fg-hover active:bg-danger-fg-active",
-        success: "bg-success-fg text-fg-on-success hover:bg-success-fg-hover active:bg-success-fg-active",
-        ghost: "bg-control-bg text-control-fg hover:bg-control-hover-bg hover:text-control-hover-fg",
-        outline: "border border-control-border-strong bg-control-bg text-control-fg hover:bg-control-hover-bg hover:border-control-border-hover",
-        link: "bg-transparent text-accent underline-offset-4 hover:underline p-0 h-auto",
-        accent: "bg-accent text-fg-on-accent hover:bg-accent-hover active:bg-accent-active",
-        dashed: "border-2 border-dashed border-control-border bg-control-bg text-control-muted-fg hover:border-control-border-hover hover:bg-control-hover-bg hover:text-control-hover-fg"
-      },
-      size: {
-        sm: "h-8 px-3 text-[13px] gap-1.5",
-        md: "h-10 px-4 text-sm gap-2",
-        lg: "h-12 px-6 text-base gap-2",
-        // Icon-only sizes. Hit target ≥ 24px (WCAG 2.5.5 floor).
-        // `icon-xs` / `icon-sm` are for dense in-row action stacks where
-        // `size="icon"` (40×40) would visually crowd the row.
-        "icon-xs": "size-6 [&_svg]:size-3.5",
-        "icon-sm": "size-7 [&_svg]:size-4",
-        icon: "size-10"
-      }
-    },
-    defaultVariants: {
-      variant: "primary",
-      size: "md"
-    }
-  }
-);
-var Button = forwardRef(function Button2({
-  variant,
-  size,
-  asChild = false,
-  loading,
-  iconLeft,
-  iconRight,
-  disabled,
-  children,
-  className,
-  ...props
-}, ref) {
-  const Comp = asChild ? Slot : "button";
-  if (asChild) {
-    return /* @__PURE__ */ jsx(Comp, { ref, className: cn(buttonVariants({ variant, size }), className), ...props, children });
-  }
-  return /* @__PURE__ */ jsxs(
-    Comp,
-    {
-      ref,
-      disabled: disabled || loading,
-      className: cn(buttonVariants({ variant, size }), className),
-      ...props,
-      children: [
-        loading ? /* @__PURE__ */ jsx(Spinner, { size: "sm" }) : iconLeft && /* @__PURE__ */ jsx("span", { className: "inline-flex shrink-0", "aria-hidden": "true", children: iconLeft }),
-        children,
-        iconRight && !loading && /* @__PURE__ */ jsx("span", { className: "inline-flex shrink-0", "aria-hidden": "true", children: iconRight })
-      ]
-    }
-  );
-});
-Button.displayName = "Button";
 var HIGHLIGHT_COLORS = {
   primary: "after:bg-pro-fg",
   success: "after:bg-success-fg",
@@ -2881,7 +3211,7 @@ function Calendar({
   classNames,
   ...props
 }) {
-  const { modifiers, modifiersClassNames } = React36.useMemo(() => {
+  const { modifiers, modifiersClassNames } = React37.useMemo(() => {
     const buckets = {};
     for (const h of highlights) {
       const key = h.color ?? "primary";
@@ -2896,7 +3226,7 @@ function Calendar({
     }
     return { modifiers: mods, modifiersClassNames: modClasses };
   }, [highlights]);
-  const disabledMatcher = React36.useMemo(() => {
+  const disabledMatcher = React37.useMemo(() => {
     if (!minDate && !maxDate) return void 0;
     if (minDate && maxDate) return [{ before: minDate }, { after: maxDate }];
     if (minDate) return { before: minDate };
@@ -3028,7 +3358,42 @@ var CardAction = forwardRef(
   }
 );
 CardAction.displayName = "CardAction";
-var Checkbox = React36.forwardRef(function Checkbox2({
+var categoryTagVariants = cva(
+  cn(
+    "inline-flex shrink-0 items-center gap-1.5 rounded-full px-2.5 py-1",
+    "text-xs font-bold tracking-tight"
+  ),
+  {
+    variants: {
+      tone: {
+        brand: "text-brand-pro bg-[color-mix(in_srgb,var(--color-brand-pro)_12%,transparent)]",
+        audit: "text-brand-audit bg-[color-mix(in_srgb,var(--color-brand-audit)_12%,transparent)]",
+        books: "text-brand-books bg-[color-mix(in_srgb,var(--color-brand-books)_12%,transparent)]",
+        tax: "text-brand-tax bg-[color-mix(in_srgb,var(--color-brand-tax)_12%,transparent)]",
+        neutral: "text-fg-3 bg-[color-mix(in_srgb,var(--color-fg-3)_12%,transparent)]"
+      }
+    },
+    defaultVariants: { tone: "neutral" }
+  }
+);
+var CategoryTag = forwardRef(function CategoryTag2({ label, icon, tone, className, ...props }, ref) {
+  return /* @__PURE__ */ jsxs("span", { ref, className: cn(categoryTagVariants({ tone }), className), ...props, children: [
+    icon && /* @__PURE__ */ jsx("span", { className: "inline-flex size-3.5 shrink-0", "aria-hidden": "true", children: icon }),
+    label
+  ] });
+});
+CategoryTag.displayName = "CategoryTag";
+var CategoryDivider = forwardRef(
+  function CategoryDivider2({ label, icon, tone, count, className, ...props }, ref) {
+    return /* @__PURE__ */ jsxs("div", { ref, className: cn("flex items-center gap-3", className), ...props, children: [
+      /* @__PURE__ */ jsx(CategoryTag, { label, icon, tone }),
+      /* @__PURE__ */ jsx("span", { className: "bg-rule h-px flex-1", "aria-hidden": "true" }),
+      count !== void 0 && /* @__PURE__ */ jsx("span", { className: "text-fg-3 bg-surface-2 border-rule inline-flex h-5 min-w-5 shrink-0 items-center justify-center rounded-full border px-1.5 text-[11px] font-bold", children: count })
+    ] });
+  }
+);
+CategoryDivider.displayName = "CategoryDivider";
+var Checkbox = React37.forwardRef(function Checkbox2({
   label,
   indeterminate,
   checked,
@@ -3038,7 +3403,7 @@ var Checkbox = React36.forwardRef(function Checkbox2({
   id: providedId,
   ...props
 }, ref) {
-  const generatedId = React36.useId();
+  const generatedId = React37.useId();
   const id = providedId ?? generatedId;
   const resolvedChecked = indeterminate ? "indeterminate" : checked;
   return /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center gap-2", children: [
@@ -3079,7 +3444,7 @@ Checkbox.displayName = CheckboxPrimitive.Root.displayName;
 var SelectRoot = SelectPrimitive.Root;
 var SelectGroup = SelectPrimitive.Group;
 var SelectValue = SelectPrimitive.Value;
-var SelectTrigger = React36.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+var SelectTrigger = React37.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
   SelectPrimitive.Trigger,
   {
     ref,
@@ -3110,7 +3475,7 @@ var SelectTrigger = React36.forwardRef(({ className, children, ...props }, ref)
   }
 ));
 SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-var SelectScrollUpButton = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var SelectScrollUpButton = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   SelectPrimitive.ScrollUpButton,
   {
     ref,
@@ -3120,7 +3485,7 @@ var SelectScrollUpButton = React36.forwardRef(({ className, ...props }, ref) =>
   }
 ));
 SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
-var SelectScrollDownButton = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var SelectScrollDownButton = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   SelectPrimitive.ScrollDownButton,
   {
     ref,
@@ -3130,7 +3495,7 @@ var SelectScrollDownButton = React36.forwardRef(({ className, ...props }, ref) =
   }
 ));
 SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
-var SelectContent = React36.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
+var SelectContent = React37.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
   SelectPrimitive.Content,
   {
     ref,
@@ -3164,7 +3529,7 @@ var SelectContent = React36.forwardRef(({ className, children, position = "poppe
   }
 ) }));
 SelectContent.displayName = SelectPrimitive.Content.displayName;
-var SelectLabel = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var SelectLabel = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   SelectPrimitive.Label,
   {
     ref,
@@ -3176,7 +3541,7 @@ var SelectLabel = React36.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = React36.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+var SelectItem = React37.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
   SelectPrimitive.Item,
   {
     ref,
@@ -3197,7 +3562,7 @@ var SelectItem = React36.forwardRef(({ className, children, ...props }, ref) =>
   }
 ));
 SelectItem.displayName = SelectPrimitive.Item.displayName;
-var SelectSeparator = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var SelectSeparator = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   SelectPrimitive.Separator,
   {
     ref,
@@ -3282,11 +3647,11 @@ function ClientSelect({
   ] });
 }
 ClientSelect.displayName = "ClientSelect";
-var Collapsible = React36.forwardRef(function Collapsible2({ className, ...props }, ref) {
+var Collapsible = React37.forwardRef(function Collapsible2({ className, ...props }, ref) {
   return /* @__PURE__ */ jsx(CollapsiblePrimitive.Root, { ref, className: cn(className), ...props });
 });
 Collapsible.displayName = CollapsiblePrimitive.Root.displayName;
-var CollapsibleTrigger = React36.forwardRef(function CollapsibleTrigger2({ className, ...props }, ref) {
+var CollapsibleTrigger = React37.forwardRef(function CollapsibleTrigger2({ className, ...props }, ref) {
   return /* @__PURE__ */ jsx(
     CollapsiblePrimitive.Trigger,
     {
@@ -3301,7 +3666,7 @@ var CollapsibleTrigger = React36.forwardRef(function CollapsibleTrigger2({ class
   );
 });
 CollapsibleTrigger.displayName = CollapsiblePrimitive.Trigger.displayName;
-var CollapsibleContent = React36.forwardRef(function CollapsibleContent2({ className, ...props }, ref) {
+var CollapsibleContent = React37.forwardRef(function CollapsibleContent2({ className, ...props }, ref) {
   return /* @__PURE__ */ jsx(
     CollapsiblePrimitive.Content,
     {
@@ -3378,7 +3743,7 @@ ComingSoon.displayName = "ComingSoon";
 var Dialog = DialogPrimitive.Root;
 var DialogTrigger = DialogPrimitive.Trigger;
 var DialogPortal = DialogPrimitive.Portal;
-var DialogOverlay = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var DialogOverlay = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   DialogPrimitive.Overlay,
   {
     ref,
@@ -3399,7 +3764,7 @@ var dialogSizeStyles = {
   lg: "max-w-2xl",
   full: "max-w-[calc(100vw-2rem)]"
 };
-var DialogContent = React36.forwardRef(({ size = "md", showCloseButton = true, className, children, ...props }, ref) => /* @__PURE__ */ jsxs(DialogPortal, { children: [
+var DialogContent = React37.forwardRef(({ size = "md", showCloseButton = true, className, children, ...props }, ref) => /* @__PURE__ */ jsxs(DialogPortal, { children: [
   /* @__PURE__ */ jsx(DialogOverlay, {}),
   /* @__PURE__ */ jsxs(
     DialogPrimitive.Content,
@@ -3440,7 +3805,7 @@ var DialogContent = React36.forwardRef(({ size = "md", showCloseButton = true, c
   )
 ] }));
 DialogContent.displayName = DialogPrimitive.Content.displayName;
-var DialogClose = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(DialogPrimitive.Close, { ref, className: cn(className), ...props }));
+var DialogClose = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(DialogPrimitive.Close, { ref, className: cn(className), ...props }));
 DialogClose.displayName = "DialogClose";
 var DialogHeader = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn("mb-4 flex flex-col gap-1.5 pr-8", className), ...props });
 DialogHeader.displayName = "DialogHeader";
@@ -3455,7 +3820,7 @@ var DialogFooter = ({ className, ...props }) => /* @__PURE__ */ jsx(
   }
 );
 DialogFooter.displayName = "DialogFooter";
-var DialogTitle = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var DialogTitle = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   DialogPrimitive.Title,
   {
     ref,
@@ -3467,7 +3832,7 @@ var DialogTitle = React36.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 DialogTitle.displayName = DialogPrimitive.Title.displayName;
-var DialogDescription = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var DialogDescription = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   DialogPrimitive.Description,
   {
     ref,
@@ -3497,17 +3862,17 @@ function CommandPalette({
   onOpenChange,
   placeholder = "Type a command or search..."
 }) {
-  const [internalOpen, setInternalOpen] = React36.useState(false);
+  const [internalOpen, setInternalOpen] = React37.useState(false);
   const isControlled = controlledOpen !== void 0;
   const open = isControlled ? controlledOpen : internalOpen;
-  const setOpen = React36.useCallback(
+  const setOpen = React37.useCallback(
     (value) => {
       if (!isControlled) setInternalOpen(value);
       onOpenChange?.(value);
     },
     [isControlled, onOpenChange]
   );
-  React36.useEffect(() => {
+  React37.useEffect(() => {
     function handleKeyDown(e) {
       if ((e.metaKey || e.ctrlKey) && e.key === "k") {
         e.preventDefault();
@@ -3662,10 +4027,10 @@ function ConfirmActionButton({
   onOpenChange
 }) {
   const isControlled = open !== void 0;
-  const [uncontrolledOpen, setUncontrolledOpen] = React36.useState(defaultOpen);
+  const [uncontrolledOpen, setUncontrolledOpen] = React37.useState(defaultOpen);
   const resolvedOpen = isControlled ? open : uncontrolledOpen;
-  const [pending, setPending] = React36.useState(false);
-  const setDialogOpen = React36.useCallback(
+  const [pending, setPending] = React37.useState(false);
+  const setDialogOpen = React37.useCallback(
     (nextOpen) => {
       onOpenChange?.(nextOpen);
       if (!isControlled) {
@@ -3724,7 +4089,7 @@ var ContextMenuGroup = ContextMenuPrimitive.Group;
 var ContextMenuPortal = ContextMenuPrimitive.Portal;
 var ContextMenuSub = ContextMenuPrimitive.Sub;
 var ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;
-var ContextMenuSubTrigger = React36.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+var ContextMenuSubTrigger = React37.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs(
   ContextMenuPrimitive.SubTrigger,
   {
     ref,
@@ -3745,7 +4110,7 @@ var ContextMenuSubTrigger = React36.forwardRef(({ className, inset, children, ..
   }
 ));
 ContextMenuSubTrigger.displayName = ContextMenuPrimitive.SubTrigger.displayName;
-var ContextMenuSubContent = React36.forwardRef(({ className, ...props }, ref) => (
+var ContextMenuSubContent = React37.forwardRef(({ className, ...props }, ref) => (
   // Portal the sub-content to the body. The parent Content keeps a persistent
   // `scale-100` transform (its open-state animation), which makes it the
   // containing block for `position: fixed` descendants — and its
@@ -3768,7 +4133,7 @@ var ContextMenuSubContent = React36.forwardRef(({ className, ...props }, ref) =>
   ) })
 ));
 ContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName;
-var ContextMenuContent = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+var ContextMenuContent = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
   ContextMenuPrimitive.Content,
   {
     ref,
@@ -3784,7 +4149,7 @@ var ContextMenuContent = React36.forwardRef(({ className, ...props }, ref) => /*
   }
 ) }));
 ContextMenuContent.displayName = ContextMenuPrimitive.Content.displayName;
-var ContextMenuItem = React36.forwardRef(({ className, destructive, inset, ...props }, ref) => /* @__PURE__ */ jsx(
+var ContextMenuItem = React37.forwardRef(({ className, destructive, inset, ...props }, ref) => /* @__PURE__ */ jsx(
   ContextMenuPrimitive.Item,
   {
     ref,
@@ -3802,7 +4167,7 @@ var ContextMenuItem = React36.forwardRef(({ className, destructive, inset, ...pr
   }
 ));
 ContextMenuItem.displayName = ContextMenuPrimitive.Item.displayName;
-var ContextMenuCheckboxItem = React36.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs(
+var ContextMenuCheckboxItem = React37.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs(
   ContextMenuPrimitive.CheckboxItem,
   {
     ref,
@@ -3822,7 +4187,7 @@ var ContextMenuCheckboxItem = React36.forwardRef(({ className, children, checked
   }
 ));
 ContextMenuCheckboxItem.displayName = ContextMenuPrimitive.CheckboxItem.displayName;
-var ContextMenuRadioItem = React36.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+var ContextMenuRadioItem = React37.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
   ContextMenuPrimitive.RadioItem,
   {
     ref,
@@ -3841,7 +4206,7 @@ var ContextMenuRadioItem = React36.forwardRef(({ className, children, ...props }
   }
 ));
 ContextMenuRadioItem.displayName = ContextMenuPrimitive.RadioItem.displayName;
-var ContextMenuLabel = React36.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
+var ContextMenuLabel = React37.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
   ContextMenuPrimitive.Label,
   {
     ref,
@@ -3854,7 +4219,7 @@ var ContextMenuLabel = React36.forwardRef(({ className, inset, ...props }, ref)
   }
 ));
 ContextMenuLabel.displayName = ContextMenuPrimitive.Label.displayName;
-var ContextMenuSeparator = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var ContextMenuSeparator = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   ContextMenuPrimitive.Separator,
   {
     ref,
@@ -3949,7 +4314,7 @@ var PopoverTrigger = PopoverPrimitive.Trigger;
 var PopoverAnchor = PopoverPrimitive.Anchor;
 var PopoverPortal = PopoverPrimitive.Portal;
 var PopoverClose = PopoverPrimitive.Close;
-var PopoverContent = React36.forwardRef(({ className, align = "center", side = "bottom", sideOffset = 8, ...props }, ref) => /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+var PopoverContent = React37.forwardRef(({ className, align = "center", side = "bottom", sideOffset = 8, ...props }, ref) => /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx(
   PopoverPrimitive.Content,
   {
     ref,
@@ -4494,7 +4859,7 @@ var chipVariants = cva(
     }
   }
 );
-var DismissibleChip = React36.forwardRef(function DismissibleChip2({ label, onDismiss, variant, className, ...props }, ref) {
+var DismissibleChip = React37.forwardRef(function DismissibleChip2({ label, onDismiss, variant, className, ...props }, ref) {
   return /* @__PURE__ */ jsxs(
     "button",
     {
@@ -4511,13 +4876,130 @@ var DismissibleChip = React36.forwardRef(function DismissibleChip2({ label, onDi
     }
   );
 });
+var RAMP = [
+  "var(--color-chart-1)",
+  "var(--color-chart-2)",
+  "var(--color-chart-3)",
+  "var(--color-chart-4)"
+];
+var DonutChart = forwardRef(function DonutChart2({
+  segments,
+  size = 132,
+  strokeWidth = 16,
+  centerLabel = "Total",
+  center,
+  legend = true,
+  className,
+  ...props
+}, ref) {
+  const [hover, setHover] = useState(null);
+  const titleId = useId();
+  const total = segments.reduce((sum, s) => sum + s.value, 0) || 1;
+  const radius = (size - strokeWidth) / 2;
+  const circumference = 2 * Math.PI * radius;
+  let acc = 0;
+  const arcs = segments.map((s, i) => {
+    const frac = s.value / total;
+    const arc = {
+      ...s,
+      color: s.color ?? RAMP[i % RAMP.length],
+      dash: frac * circumference,
+      offset: acc * circumference
+    };
+    acc += frac;
+    return arc;
+  });
+  const active = hover != null ? arcs[hover] : null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      className: cn("flex items-center gap-6", className),
+      role: "img",
+      "aria-labelledby": titleId,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs("span", { id: titleId, className: "sr-only", children: [
+          "Donut chart: ",
+          arcs.map((a) => `${a.label} ${a.value}`).join(", ")
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "relative shrink-0", style: { width: size, height: size }, children: [
+          /* @__PURE__ */ jsxs("svg", { width: size, height: size, viewBox: `0 0 ${size} ${size}`, "aria-hidden": "true", children: [
+            /* @__PURE__ */ jsx(
+              "circle",
+              {
+                cx: size / 2,
+                cy: size / 2,
+                r: radius,
+                fill: "none",
+                stroke: "var(--color-bg-3)",
+                strokeWidth
+              }
+            ),
+            arcs.map((s, i) => /* @__PURE__ */ jsx(
+              "circle",
+              {
+                cx: size / 2,
+                cy: size / 2,
+                r: radius,
+                fill: "none",
+                stroke: s.color,
+                strokeWidth: hover === i ? strokeWidth + 3 : strokeWidth,
+                strokeDasharray: `${s.dash} ${circumference - s.dash}`,
+                strokeDashoffset: -s.offset,
+                strokeLinecap: "butt",
+                transform: `rotate(-90 ${size / 2} ${size / 2})`,
+                className: "cursor-pointer transition-[stroke-width,opacity] duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] motion-reduce:transition-none",
+                style: { opacity: hover != null && hover !== i ? 0.35 : 1 },
+                onMouseEnter: () => setHover(i),
+                onMouseLeave: () => setHover(null)
+              },
+              i
+            ))
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-0 flex flex-col items-center justify-center text-center", children: center ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("span", { className: "text-fg text-2xl font-semibold tabular-nums", children: active ? active.value : total }),
+            /* @__PURE__ */ jsx("span", { className: "text-fg-3 text-xs", children: active ? active.label : centerLabel })
+          ] }) })
+        ] }),
+        legend && /* @__PURE__ */ jsx("ul", { className: "flex min-w-0 flex-col gap-1.5", children: arcs.map((s, i) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onMouseEnter: () => setHover(i),
+            onMouseLeave: () => setHover(null),
+            onFocus: () => setHover(i),
+            onBlur: () => setHover(null),
+            className: cn(
+              "flex w-full items-center gap-2 rounded-[var(--radius-icon)] px-1.5 py-1 text-left text-sm transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] motion-reduce:transition-none",
+              hover === i ? "bg-bg-2" : "hover:bg-bg-2"
+            ),
+            children: [
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  "aria-hidden": "true",
+                  className: "size-2.5 shrink-0 rounded-[3px]",
+                  style: { background: s.color }
+                }
+              ),
+              /* @__PURE__ */ jsx("span", { className: "text-fg-2 min-w-0 flex-1 truncate", children: s.label }),
+              /* @__PURE__ */ jsx("span", { className: "text-fg tabular-nums", children: s.value })
+            ]
+          }
+        ) }, i)) })
+      ]
+    }
+  );
+});
+DonutChart.displayName = "DonutChart";
 var DropdownMenu = DropdownMenuPrimitive.Root;
 var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
 var DropdownMenuGroup = DropdownMenuPrimitive.Group;
 var DropdownMenuPortal = DropdownMenuPrimitive.Portal;
 var DropdownMenuSub = DropdownMenuPrimitive.Sub;
 var DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
-var DropdownMenuSubTrigger = React36.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+var DropdownMenuSubTrigger = React37.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs(
   DropdownMenuPrimitive.SubTrigger,
   {
     ref,
@@ -4538,7 +5020,7 @@ var DropdownMenuSubTrigger = React36.forwardRef(({ className, inset, children, .
   }
 ));
 DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
-var DropdownMenuSubContent = React36.forwardRef(({ className, ...props }, ref) => (
+var DropdownMenuSubContent = React37.forwardRef(({ className, ...props }, ref) => (
   // Portal the sub-content to the body. The parent Content keeps a persistent
   // `scale-100` transform (its open-state animation), which makes it the
   // containing block for `position: fixed` descendants — and its
@@ -4561,7 +5043,7 @@ var DropdownMenuSubContent = React36.forwardRef(({ className, ...props }, ref) =
   ) })
 ));
 DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
-var DropdownMenuContent = React36.forwardRef(({ className, sideOffset = 6, align = "start", ...props }, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+var DropdownMenuContent = React37.forwardRef(({ className, sideOffset = 6, align = "start", ...props }, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
   DropdownMenuPrimitive.Content,
   {
     ref,
@@ -4579,7 +5061,7 @@ var DropdownMenuContent = React36.forwardRef(({ className, sideOffset = 6, align
   }
 ) }));
 DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
-var DropdownMenuItem = React36.forwardRef(({ className, destructive, inset, ...props }, ref) => /* @__PURE__ */ jsx(
+var DropdownMenuItem = React37.forwardRef(({ className, destructive, inset, ...props }, ref) => /* @__PURE__ */ jsx(
   DropdownMenuPrimitive.Item,
   {
     ref,
@@ -4597,7 +5079,7 @@ var DropdownMenuItem = React36.forwardRef(({ className, destructive, inset, ...p
   }
 ));
 DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
-var DropdownMenuCheckboxItem = React36.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs(
+var DropdownMenuCheckboxItem = React37.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs(
   DropdownMenuPrimitive.CheckboxItem,
   {
     ref,
@@ -4617,7 +5099,7 @@ var DropdownMenuCheckboxItem = React36.forwardRef(({ className, children, checke
   }
 ));
 DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
-var DropdownMenuRadioItem = React36.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+var DropdownMenuRadioItem = React37.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
   DropdownMenuPrimitive.RadioItem,
   {
     ref,
@@ -4636,7 +5118,7 @@ var DropdownMenuRadioItem = React36.forwardRef(({ className, children, ...props
   }
 ));
 DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
-var DropdownMenuLabel = React36.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
+var DropdownMenuLabel = React37.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
   DropdownMenuPrimitive.Label,
   {
     ref,
@@ -4649,7 +5131,7 @@ var DropdownMenuLabel = React36.forwardRef(({ className, inset, ...props }, ref)
   }
 ));
 DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
-var DropdownMenuSeparator = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var DropdownMenuSeparator = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   DropdownMenuPrimitive.Separator,
   {
     ref,
@@ -4692,6 +5174,44 @@ var EmptyState = forwardRef(function EmptyState2({ icon, title, description, act
   );
 });
 EmptyState.displayName = "EmptyState";
+var kindTile = {
+  doc: "bg-danger-bg text-danger-fg",
+  sheet: "bg-success-bg text-success-fg",
+  image: "bg-accent-tint text-accent",
+  generic: "bg-bg-3 text-fg-3"
+};
+var FileChip = forwardRef(function FileChip2({ name, meta, kind = "doc", icon, action, className, ...props }, ref) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      className: cn(
+        "border-rule bg-surface flex items-center gap-3 rounded-[var(--radius-input)] border p-2.5",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: cn(
+              "flex size-9 shrink-0 items-center justify-center rounded-[var(--radius-icon)] [&_svg]:size-4.5",
+              kindTile[kind]
+            ),
+            children: icon ?? /* @__PURE__ */ jsx(FileTextIcon, {})
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ jsx("p", { className: "text-fg truncate text-sm font-medium", children: name }),
+          meta != null && /* @__PURE__ */ jsx("p", { className: "text-fg-3 truncate text-xs", children: meta })
+        ] }),
+        action && /* @__PURE__ */ jsx("div", { className: "shrink-0", children: action })
+      ]
+    }
+  );
+});
+FileChip.displayName = "FileChip";
 function FileUpload({
   accept,
   maxSize,
@@ -4864,7 +5384,7 @@ FormSection.displayName = "FormSection";
 var HoverCard = HoverCardPrimitive.Root;
 var HoverCardTrigger = HoverCardPrimitive.Trigger;
 var HoverCardPortal = HoverCardPrimitive.Portal;
-var HoverCardContent = React36.forwardRef(({ className, align = "center", side = "bottom", sideOffset = 8, ...props }, ref) => /* @__PURE__ */ jsx(HoverCardPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+var HoverCardContent = React37.forwardRef(({ className, align = "center", side = "bottom", sideOffset = 8, ...props }, ref) => /* @__PURE__ */ jsx(HoverCardPrimitive.Portal, { children: /* @__PURE__ */ jsx(
   HoverCardPrimitive.Content,
   {
     ref,
@@ -4883,6 +5403,40 @@ var HoverCardContent = React36.forwardRef(({ className, align = "center", side =
   }
 ) }));
 HoverCardContent.displayName = HoverCardPrimitive.Content.displayName;
+var iconTileVariants = cva(
+  cn("relative grid shrink-0 place-items-center", "[&_svg]:shrink-0"),
+  {
+    variants: {
+      tone: {
+        pro: "bg-pro-bg text-pro-fg",
+        neutral: "bg-bg-2 text-fg-3",
+        info: "bg-accent-tint text-accent-2",
+        success: "bg-success-bg text-success-fg",
+        warning: "bg-warning-bg text-warning-fg",
+        danger: "bg-danger-bg text-danger-fg",
+        audit: "bg-[color-mix(in_srgb,var(--color-brand-audit)_12%,transparent)] text-brand-audit",
+        books: "bg-[color-mix(in_srgb,var(--color-brand-books)_12%,transparent)] text-brand-books",
+        tax: "bg-[color-mix(in_srgb,var(--color-brand-tax)_12%,transparent)] text-brand-tax"
+      },
+      size: {
+        sm: "size-[30px] rounded-[8px] [&_svg]:size-4",
+        md: "size-[38px] rounded-[10px] [&_svg]:size-[18px]",
+        lg: "size-[42px] rounded-[12px] [&_svg]:size-5"
+      }
+    },
+    defaultVariants: {
+      tone: "pro",
+      size: "md"
+    }
+  }
+);
+var IconTile = forwardRef(function IconTile2({ icon, tone, size, badge, className, ...props }, ref) {
+  return /* @__PURE__ */ jsxs("div", { ref, className: cn(iconTileVariants({ tone, size }), className), ...props, children: [
+    icon,
+    badge != null && /* @__PURE__ */ jsx("span", { className: "absolute -top-1.5 -right-1.5 z-10 flex", children: badge })
+  ] });
+});
+IconTile.displayName = "IconTile";
 var inputVariants = cva(
   [
     "flex w-full rounded-input border bg-surface font-body text-fg",
@@ -5002,8 +5556,8 @@ function KeyboardShortcutsDialog({
   sections,
   hotkey = "?"
 } = {}) {
-  const [open, setOpen] = React36.useState(false);
-  React36.useEffect(() => {
+  const [open, setOpen] = React37.useState(false);
+  React37.useEffect(() => {
     if (hotkey === null) return;
     function handleKeyDown(e) {
       const target = e.target;
@@ -5041,7 +5595,7 @@ function KeyboardShortcutsDialog({
           className: "flex items-center justify-between gap-3 py-1",
           children: [
             /* @__PURE__ */ jsx("span", { className: "text-fg text-sm", children: shortcut.description }),
-            /* @__PURE__ */ jsx("div", { className: "flex shrink-0 items-center gap-1", children: shortcut.keys.map((key, i) => /* @__PURE__ */ jsxs(React36.Fragment, { children: [
+            /* @__PURE__ */ jsx("div", { className: "flex shrink-0 items-center gap-1", children: shortcut.keys.map((key, i) => /* @__PURE__ */ jsxs(React37.Fragment, { children: [
               i > 0 && /* @__PURE__ */ jsx("span", { className: "text-fg-4 mx-0.5 text-[11px]", children: "then" }),
               /* @__PURE__ */ jsx("kbd", { className: kbdClass2, children: key })
             ] }, i)) })
@@ -5060,7 +5614,7 @@ function KeyboardShortcutsDialog({
 var labelVariants = cva(
   "text-[13px] font-medium leading-none text-fg select-none peer-disabled:cursor-not-allowed peer-disabled:text-fg-disabled has-[+input:disabled]:text-fg-disabled"
 );
-var Label4 = React36.forwardRef(
+var Label4 = React37.forwardRef(
   function Label5({ children, required, className, ...props }, ref) {
     return /* @__PURE__ */ jsxs(LabelPrimitive.Root, { ref, className: cn(labelVariants(), className), ...props, children: [
       children,
@@ -5226,6 +5780,80 @@ function Logo({
     }
   );
 }
+var MasterDetailLayout = forwardRef(
+  function MasterDetailLayout2({
+    list,
+    detail,
+    detailOpen = false,
+    onBack,
+    backLabel = "Back",
+    listWidth = 340,
+    className,
+    style,
+    ...props
+  }, ref) {
+    const resolvedWidth = typeof listWidth === "number" ? `${listWidth}px` : listWidth;
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        "data-detail-open": detailOpen ? "true" : "false",
+        className: cn(
+          "bg-surface relative flex h-full min-h-0 w-full overflow-hidden",
+          className
+        ),
+        style: { "--master-list-width": resolvedWidth, ...style },
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn(
+                "bg-surface flex min-h-0 w-full flex-col overflow-auto",
+                "md:w-[var(--master-list-width)] md:shrink-0 md:border-rule md:border-r"
+              ),
+              children: list
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: cn(
+                "bg-surface-2 flex min-h-0 flex-col overflow-auto",
+                // mobile: overlay the list and slide in from the right
+                "max-md:absolute max-md:inset-0 max-md:z-[var(--z-modal)]",
+                "max-md:transition-transform max-md:duration-[var(--duration-normal)] max-md:ease-[var(--ease-out-quart)]",
+                "motion-reduce:transition-none",
+                detailOpen ? "max-md:translate-x-0" : "max-md:pointer-events-none max-md:translate-x-full",
+                // desktop: reset to a static, independently-scrolling flex column
+                "md:static md:z-auto md:flex-1 md:translate-x-0 md:transition-none md:pointer-events-auto"
+              ),
+              children: [
+                onBack && /* @__PURE__ */ jsx("div", { className: "border-rule bg-surface sticky top-0 z-[var(--z-sticky)] flex h-12 shrink-0 items-center border-b px-2 md:hidden", children: /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: onBack,
+                    "aria-label": backLabel,
+                    className: cn(
+                      "rounded-icon text-fg-3 inline-flex size-9 items-center justify-center",
+                      "transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] motion-reduce:transition-none",
+                      "hover:bg-surface-2 hover:text-fg",
+                      "focus-visible:[box-shadow:var(--shadow-focus-ring)] focus-visible:outline-none"
+                    ),
+                    children: /* @__PURE__ */ jsx(ArrowLeftIcon, { className: "size-4", "aria-hidden": "true" })
+                  }
+                ) }),
+                detail
+              ]
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+MasterDetailLayout.displayName = "MasterDetailLayout";
 var TRIGGER_SIZE = {
   sm: "h-8 gap-1.5 px-2.5 text-[13px]",
   md: "h-9 gap-2 px-3 text-sm",
@@ -5391,7 +6019,7 @@ function MultiSelectField({
   size = "md",
   id
 }) {
-  const selected = React36.useMemo(
+  const selected = React37.useMemo(
     () => new Set(value ? value.split(",").filter(Boolean) : []),
     [value]
   );
@@ -5404,7 +6032,7 @@ function MultiSelectField({
     }
     onChange(Array.from(next).join(","));
   };
-  const generatedId = React36.useId();
+  const generatedId = React37.useId();
   const groupId = id ?? generatedId;
   return /* @__PURE__ */ jsxs("div", { className: cn("w-full", className), children: [
     /* @__PURE__ */ jsx(
@@ -6233,12 +6861,12 @@ var ProgressRing = forwardRef(function ProgressRing2({ value, max = 100, size =
   );
 });
 ProgressRing.displayName = "ProgressRing";
-var RadioGroup3 = React36.forwardRef(function RadioGroup4({ className, ...props }, ref) {
+var RadioGroup3 = React37.forwardRef(function RadioGroup4({ className, ...props }, ref) {
   return /* @__PURE__ */ jsx(RadioGroupPrimitive.Root, { ref, className: cn("grid gap-2", className), ...props });
 });
 RadioGroup3.displayName = RadioGroupPrimitive.Root.displayName;
-var RadioGroupItem = React36.forwardRef(function RadioGroupItem2({ className, label, id: providedId, ...props }, ref) {
-  const generatedId = React36.useId();
+var RadioGroupItem = React37.forwardRef(function RadioGroupItem2({ className, label, id: providedId, ...props }, ref) {
+  const generatedId = React37.useId();
   const id = providedId ?? generatedId;
   const root = /* @__PURE__ */ jsx(
     RadioGroupPrimitive.Item,
@@ -6273,30 +6901,290 @@ var RadioGroupItem = React36.forwardRef(function RadioGroupItem2({ className, la
   ] });
 });
 RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;
-var ScrollArea = React36.forwardRef(function ScrollArea2({ className, children, ...props }, ref) {
-  return /* @__PURE__ */ jsxs(
-    ScrollAreaPrimitive.Root,
-    {
-      ref,
-      className: cn("relative overflow-hidden", className),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx(
-          ScrollAreaPrimitive.Viewport,
+var RAMP2 = [
+  "var(--color-chart-1)",
+  "var(--color-chart-2)",
+  "var(--color-chart-3)",
+  "var(--color-chart-4)"
+];
+var RankedBars = forwardRef(function RankedBars2({ items, className, ...props }, ref) {
+  return /* @__PURE__ */ jsx("ul", { ref, className: cn("flex flex-col gap-4", className), ...props, children: items.map((bar, i) => {
+    const up = (bar.change ?? 0) >= 0;
+    const ChangeIcon = up ? TrendingUpIcon : TrendingDownIcon;
+    return /* @__PURE__ */ jsxs("li", { className: "flex flex-col gap-1.5", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-baseline justify-between gap-2", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-fg-2 text-sm font-medium", children: bar.label }),
+        bar.value != null && /* @__PURE__ */ jsx("span", { className: "text-fg text-sm font-semibold tabular-nums", children: bar.value })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx("div", { className: "bg-bg-3 h-2 flex-1 overflow-hidden rounded-full", children: /* @__PURE__ */ jsx(
+          "div",
           {
-            tabIndex: 0,
-            className: "h-full w-full rounded-[inherit] focus-visible:[box-shadow:var(--shadow-focus-ring)] focus-visible:outline-none",
-            children
+            className: "h-full rounded-full transition-[width] duration-[var(--duration-slow)] ease-[var(--ease-out-quart)] motion-reduce:transition-none",
+            style: {
+              width: `${Math.min(100, Math.max(0, bar.pct))}%`,
+              background: bar.color ?? RAMP2[i % RAMP2.length]
+            }
           }
-        ),
-        /* @__PURE__ */ jsx(ScrollBar, {}),
+        ) }),
+        bar.change != null && /* @__PURE__ */ jsxs(
+          "span",
+          {
+            className: cn(
+              "inline-flex shrink-0 items-center gap-0.5 text-xs font-semibold tabular-nums",
+              up ? "text-success-fg" : "text-danger-fg"
+            ),
+            children: [
+              /* @__PURE__ */ jsx(ChangeIcon, { className: "size-3", "aria-hidden": "true" }),
+              /* @__PURE__ */ jsxs("span", { className: "sr-only", children: [
+                up ? "Up" : "Down",
+                " "
+              ] }),
+              Math.abs(bar.change),
+              "%"
+            ]
+          }
+        )
+      ] }),
+      bar.sublabel != null && /* @__PURE__ */ jsx("span", { className: "text-fg-3 text-xs", children: bar.sublabel })
+    ] }, i);
+  }) });
+});
+RankedBars.displayName = "RankedBars";
+var SheetSideContext = React37.createContext({});
+var Sheet = ({ side, children, ...props }) => /* @__PURE__ */ jsx(DialogPrimitive.Root, { ...props, children: /* @__PURE__ */ jsx(SheetSideContext, { value: { side }, children }) });
+Sheet.displayName = "Sheet";
+var SheetTrigger = DialogPrimitive.Trigger;
+var SheetClose = DialogPrimitive.Close;
+var SheetPortal = DialogPrimitive.Portal;
+var SheetOverlay = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DialogPrimitive.Overlay,
+  {
+    ref,
+    className: cn(
+      "bg-overlay fixed inset-0 z-[var(--z-overlay)] backdrop-blur-[4px]",
+      "transition-opacity duration-[var(--duration-overlay)] ease-[var(--ease-out-quart)]",
+      "data-[state=closed]:opacity-0 data-[state=open]:opacity-100",
+      "motion-reduce:transition-none",
+      className
+    ),
+    ...props
+  }
+));
+SheetOverlay.displayName = DialogPrimitive.Overlay.displayName;
+var sheetVariants = cva(
+  cn(
+    "fixed z-[var(--z-modal)] flex flex-col gap-4 bg-surface text-fg shadow-pop",
+    "transition ease-in-out duration-[var(--duration-normal)] ease-[var(--ease-out-quart)]",
+    "motion-reduce:transition-none"
+  ),
+  {
+    variants: {
+      side: {
+        top: cn(
+          "inset-x-0 top-0 border-b border-rule",
+          "data-[state=closed]:-translate-y-full data-[state=open]:translate-y-0"
+        ),
+        bottom: cn(
+          "inset-x-0 bottom-0 border-t border-rule max-h-[85vh]",
+          "data-[state=closed]:translate-y-full data-[state=open]:translate-y-0"
+        ),
+        left: cn(
+          "inset-y-0 left-0 h-full w-3/4 max-w-sm border-r border-rule",
+          "data-[state=closed]:-translate-x-full data-[state=open]:translate-x-0"
+        ),
+        right: cn(
+          "inset-y-0 right-0 h-full w-3/4 max-w-sm border-l border-rule",
+          "data-[state=closed]:translate-x-full data-[state=open]:translate-x-0"
+        )
+      }
+    },
+    defaultVariants: { side: "right" }
+  }
+);
+var sheetWidthClasses = {
+  sm: "w-[95vw] max-w-[95vw] sm:w-[420px]",
+  md: "w-[95vw] max-w-[95vw] sm:w-[520px]",
+  lg: "w-[95vw] max-w-[95vw] sm:w-[640px]",
+  xl: "w-[95vw] max-w-[95vw] sm:w-[760px]",
+  full: "w-full max-w-none"
+};
+var SheetContent = React37.forwardRef(
+  ({ side, width = "default", customWidth, className, children, showCloseButton = true, style, ...props }, ref) => {
+    const ctx = React37.use(SheetSideContext);
+    const resolvedSide = side ?? ctx.side ?? "right";
+    const supportsWidth = resolvedSide === "left" || resolvedSide === "right";
+    const widthClass = supportsWidth && width !== "default" ? sheetWidthClasses[width] : null;
+    const widthStyle = supportsWidth && customWidth ? { width: customWidth, maxWidth: "95vw", ...style } : style;
+    return /* @__PURE__ */ jsxs(SheetPortal, { children: [
+      /* @__PURE__ */ jsx(SheetOverlay, {}),
+      /* @__PURE__ */ jsxs(
+        DialogPrimitive.Content,
+        {
+          ref,
+          className: cn(sheetVariants({ side: resolvedSide }), widthClass, className),
+          style: widthStyle,
+          ...props,
+          children: [
+            children,
+            showCloseButton && /* @__PURE__ */ jsx(
+              DialogPrimitive.Close,
+              {
+                className: cn(
+                  "absolute top-4 right-4 inline-flex size-7 items-center justify-center",
+                  "rounded-icon text-fg-4 transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] motion-reduce:transition-none",
+                  "hover:bg-overlay-hover hover:text-fg",
+                  "focus-visible:[box-shadow:var(--shadow-focus-ring)] focus-visible:outline-none",
+                  "disabled:pointer-events-none"
+                ),
+                "aria-label": "Close",
+                children: /* @__PURE__ */ jsx(XIcon, { className: "size-4", "aria-hidden": "true" })
+              }
+            )
+          ]
+        }
+      )
+    ] });
+  }
+);
+SheetContent.displayName = DialogPrimitive.Content.displayName;
+var SheetHeader = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn("flex flex-col gap-1.5 p-6 pr-12 pb-0", className), ...props });
+SheetHeader.displayName = "SheetHeader";
+var SheetFooter = ({ className, ...props }) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    className: cn(
+      "border-rule mt-auto flex flex-col-reverse gap-2 border-t p-6 sm:flex-row sm:items-center sm:justify-end",
+      className
+    ),
+    ...props
+  }
+);
+SheetFooter.displayName = "SheetFooter";
+var SheetTitle = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DialogPrimitive.Title,
+  {
+    ref,
+    className: cn(
+      "font-display text-fg text-base leading-tight font-medium tracking-tight",
+      className
+    ),
+    ...props
+  }
+));
+SheetTitle.displayName = DialogPrimitive.Title.displayName;
+var SheetDescription = React37.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(DialogPrimitive.Description, { ref, className: cn("text-fg-3 text-sm", className), ...props }));
+SheetDescription.displayName = DialogPrimitive.Description.displayName;
+var MOBILE_QUERY = "(max-width: 639.98px)";
+function useIsMobile() {
+  const [state, setState] = React37.useState({ isMobile: false, mounted: false });
+  React37.useEffect(() => {
+    const mql = window.matchMedia(MOBILE_QUERY);
+    const update = () => setState({ isMobile: mql.matches, mounted: true });
+    update();
+    mql.addEventListener("change", update);
+    return () => mql.removeEventListener("change", update);
+  }, []);
+  return state;
+}
+function ResponsiveDialog({
+  open,
+  onOpenChange,
+  title,
+  description,
+  children,
+  footer,
+  className,
+  side = "bottom",
+  size = "md"
+}) {
+  const { isMobile, mounted } = useIsMobile();
+  const close = React37.useCallback(() => onOpenChange(false), [onOpenChange]);
+  const resolvedFooter = typeof footer === "function" ? footer(close) : footer;
+  const hasHeader = Boolean(title || description);
+  if (mounted && isMobile) {
+    return /* @__PURE__ */ jsx(Sheet, { open, onOpenChange, children: /* @__PURE__ */ jsxs(
+      SheetContent,
+      {
+        side,
+        className: cn(side === "bottom" && "rounded-t-card", className),
+        children: [
+          side === "bottom" && /* @__PURE__ */ jsx(
+            "span",
+            {
+              "aria-hidden": "true",
+              className: "mx-auto mt-2.5 h-1 w-9 shrink-0 rounded-full bg-[color:var(--color-rule-strong)]"
+            }
+          ),
+          hasHeader ? /* @__PURE__ */ jsxs(SheetHeader, { children: [
+            /* @__PURE__ */ jsx(SheetTitle, { className: cn(!title && "sr-only"), children: title ?? "Dialog" }),
+            description && /* @__PURE__ */ jsx(SheetDescription, { children: description })
+          ] }) : /* @__PURE__ */ jsx(SheetTitle, { className: "sr-only", children: "Dialog" }),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn(
+                "scrollbar-thin flex-1 overflow-y-auto px-6",
+                !resolvedFooter && "pb-6"
+              ),
+              children
+            }
+          ),
+          resolvedFooter && /* @__PURE__ */ jsx(SheetFooter, { children: resolvedFooter })
+        ]
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(DialogContent, { size, className, children: [
+    hasHeader ? /* @__PURE__ */ jsxs(DialogHeader, { children: [
+      /* @__PURE__ */ jsx(DialogTitle, { className: cn(!title && "sr-only"), children: title ?? "Dialog" }),
+      description && /* @__PURE__ */ jsx(DialogDescription, { children: description })
+    ] }) : /* @__PURE__ */ jsx(DialogTitle, { className: "sr-only", children: "Dialog" }),
+    children,
+    resolvedFooter && /* @__PURE__ */ jsx(DialogFooter, { children: resolvedFooter })
+  ] }) });
+}
+ResponsiveDialog.displayName = "ResponsiveDialog";
+var RouteTransition = forwardRef(
+  function RouteTransition2({ routeKey, className, children, ...props }, ref) {
+    return /* @__PURE__ */ jsx("div", { ref, className: cn(className), ...props, children: /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "animate-in fade-in-0 slide-in-from-bottom-2",
+          "duration-[var(--duration-normal)] ease-[var(--ease-out-quart)]"
+        ),
+        children
+      },
+      routeKey
+    ) });
+  }
+);
+RouteTransition.displayName = "RouteTransition";
+var ScrollArea = React37.forwardRef(function ScrollArea2({ className, children, ...props }, ref) {
+  return /* @__PURE__ */ jsxs(
+    ScrollAreaPrimitive.Root,
+    {
+      ref,
+      className: cn("relative overflow-hidden", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(
+          ScrollAreaPrimitive.Viewport,
+          {
+            tabIndex: 0,
+            className: "h-full w-full rounded-[inherit] focus-visible:[box-shadow:var(--shadow-focus-ring)] focus-visible:outline-none",
+            children
+          }
+        ),
+        /* @__PURE__ */ jsx(ScrollBar, {}),
         /* @__PURE__ */ jsx(ScrollAreaPrimitive.Corner, {})
       ]
     }
   );
 });
 ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
-var ScrollBar = React36.forwardRef(function ScrollBar2({ className, orientation = "vertical", ...props }, ref) {
+var ScrollBar = React37.forwardRef(function ScrollBar2({ className, orientation = "vertical", ...props }, ref) {
   return /* @__PURE__ */ jsx(
     ScrollAreaPrimitive.ScrollAreaScrollbar,
     {
@@ -6361,7 +7249,7 @@ var searchInputVariants = cva(
     }
   }
 );
-var SearchInput = React36.forwardRef(
+var SearchInput = React37.forwardRef(
   function SearchInput2({
     value,
     onValueChange,
@@ -6374,8 +7262,8 @@ var SearchInput = React36.forwardRef(
     ...props
   }, ref) {
     const debouncedValue = useDebounce(value, debounceMs);
-    const isFirstRender = React36.useRef(true);
-    React36.useEffect(() => {
+    const isFirstRender = React37.useRef(true);
+    React37.useEffect(() => {
       if (isFirstRender.current) {
         isFirstRender.current = false;
         return;
@@ -6453,15 +7341,15 @@ function SearchSelect({
   descriptionVariant = "inline"
 }) {
   const isSingleMode = value !== void 0 || onValueChange !== void 0;
-  const singleSelectedOption = React36.useMemo(
+  const singleSelectedOption = React37.useMemo(
     () => isSingleMode && value ? options.find((o) => o.id === value) ?? null : null,
     [isSingleMode, value, options]
   );
-  const selected = React36.useMemo(
+  const selected = React37.useMemo(
     () => isSingleMode ? singleSelectedOption ? [singleSelectedOption] : [] : selectedProp ?? [],
     [isSingleMode, singleSelectedOption, selectedProp]
   );
-  const onSelect = React36.useCallback(
+  const onSelect = React37.useCallback(
     (option) => {
       if (isSingleMode) {
         onValueChange?.(option.id);
@@ -6471,7 +7359,7 @@ function SearchSelect({
     },
     [isSingleMode, onValueChange, onSelectProp]
   );
-  const onRemove = React36.useCallback(
+  const onRemove = React37.useCallback(
     (option) => {
       if (isSingleMode) {
         onValueChange?.("");
@@ -6482,15 +7370,15 @@ function SearchSelect({
     [isSingleMode, onValueChange, onRemoveProp]
   );
   const closeOnSelect = isSingleMode || closeOnSelectProp;
-  const [search, setSearch] = React36.useState("");
-  const [open, setOpen] = React36.useState(false);
-  const [activeChip, setActiveChip] = React36.useState(null);
-  const selectedIds = React36.useMemo(() => new Set(selected.map((s) => s.id)), [selected]);
-  const filtered = React36.useMemo(
+  const [search, setSearch] = React37.useState("");
+  const [open, setOpen] = React37.useState(false);
+  const [activeChip, setActiveChip] = React37.useState(null);
+  const selectedIds = React37.useMemo(() => new Set(selected.map((s) => s.id)), [selected]);
+  const filtered = React37.useMemo(
     () => options.filter((opt) => !selectedIds.has(opt.id)),
     [options, selectedIds]
   );
-  const groups = React36.useMemo(() => {
+  const groups = React37.useMemo(() => {
     const order = [];
     const byGroup = /* @__PURE__ */ new Map();
     for (const opt of filtered) {
@@ -6502,25 +7390,25 @@ function SearchSelect({
     }
     return order.map((g) => [g, byGroup.get(g)]);
   }, [filtered]);
-  const hasGroups = React36.useMemo(() => groups.some(([g]) => g != null), [groups]);
-  const pinnedSet = React36.useMemo(() => new Set(pinnedGroups ?? []), [pinnedGroups]);
-  const chips = React36.useMemo(() => {
+  const hasGroups = React37.useMemo(() => groups.some(([g]) => g != null), [groups]);
+  const pinnedSet = React37.useMemo(() => new Set(pinnedGroups ?? []), [pinnedGroups]);
+  const chips = React37.useMemo(() => {
     if (!groupFilter || !hasGroups) return [];
     return groups.map(([g]) => g).filter((g) => g != null && !pinnedSet.has(g));
   }, [groupFilter, hasGroups, groups, pinnedSet]);
-  const visibleGroups = React36.useMemo(() => {
+  const visibleGroups = React37.useMemo(() => {
     if (chips.length > 0 && activeChip) {
       return groups.filter(([g]) => g === activeChip);
     }
     return groups;
   }, [groups, chips.length, activeChip]);
   const trimmedSearch = search.trim();
-  const hasExactMatch = React36.useMemo(
+  const hasExactMatch = React37.useMemo(
     () => options.some((opt) => opt.label.toLowerCase() === trimmedSearch.toLowerCase()),
     [options, trimmedSearch]
   );
   const showCreate = !!onCreate && trimmedSearch.length > 0 && !hasExactMatch;
-  const handleSelect = React36.useCallback(
+  const handleSelect = React37.useCallback(
     (option) => {
       onSelect(option);
       setSearch("");
@@ -6528,16 +7416,16 @@ function SearchSelect({
     },
     [onSelect, closeOnSelect]
   );
-  const handleCreate = React36.useCallback(() => {
+  const handleCreate = React37.useCallback(() => {
     if (onCreate && trimmedSearch) {
       onCreate(trimmedSearch);
       setSearch("");
       setOpen(false);
     }
   }, [onCreate, trimmedSearch]);
-  const inputRef = React36.useRef(null);
-  const listboxId = React36.useId();
-  const setInputRef = React36.useCallback((node) => {
+  const inputRef = React37.useRef(null);
+  const listboxId = React37.useId();
+  const setInputRef = React37.useCallback((node) => {
     inputRef.current = node;
     node?.removeAttribute("aria-labelledby");
     node?.setAttribute("aria-controls", listboxId);
@@ -6546,12 +7434,12 @@ function SearchSelect({
   const singleValue = closeOnSelect ? selected[0] ?? null : null;
   const showValue = singleValue !== null && !open;
   const popoverOpen = open && !disabled;
-  React36.useEffect(() => {
+  React37.useEffect(() => {
     inputRef.current?.removeAttribute("aria-labelledby");
     inputRef.current?.setAttribute("aria-controls", listboxId);
     inputRef.current?.removeAttribute("aria-activedescendant");
   });
-  React36.useEffect(() => {
+  React37.useEffect(() => {
     if (open && closeOnSelect) {
       const raf = requestAnimationFrame(() => inputRef.current?.focus());
       return () => cancelAnimationFrame(raf);
@@ -6957,7 +7845,46 @@ var SectionHead = forwardRef(function SectionHead2({ eyebrow, title, meta, class
   );
 });
 SectionHead.displayName = "SectionHead";
-var Separator4 = React36.forwardRef(function Separator5({ className, orientation = "horizontal", decorative = true, ...props }, ref) {
+var toneFill = {
+  default: "var(--color-pro-fg)",
+  success: "var(--color-success-fg)",
+  warning: "var(--color-warning-fg)",
+  destructive: "var(--color-danger-fg)",
+  info: "var(--color-accent)",
+  tax: "var(--color-service-tax)",
+  audit: "var(--color-service-audit)",
+  accounting: "var(--color-service-accounting)"
+};
+var SegmentedProgress = forwardRef(
+  function SegmentedProgress2({ steps, current, tone = "default", thickness = 6, label, className, style, ...props }, ref) {
+    const filled = Math.min(steps, Math.max(0, current));
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        role: "progressbar",
+        "aria-valuenow": filled,
+        "aria-valuemin": 0,
+        "aria-valuemax": steps,
+        "aria-label": label ?? `Step ${filled} of ${steps}`,
+        className: cn("flex w-full items-center gap-1", className),
+        style: { height: thickness, ...style },
+        ...props,
+        children: Array.from({ length: steps }, (_, i) => /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: "h-full flex-1 rounded-full transition-colors duration-[var(--duration-normal)] ease-[var(--ease-out-quart)] motion-reduce:transition-none",
+            style: { background: i < filled ? toneFill[tone] : "var(--color-bg-3)" }
+          },
+          i
+        ))
+      }
+    );
+  }
+);
+SegmentedProgress.displayName = "SegmentedProgress";
+var Separator4 = React37.forwardRef(function Separator5({ className, orientation = "horizontal", decorative = true, ...props }, ref) {
   return /* @__PURE__ */ jsx(
     SeparatorPrimitive.Root,
     {
@@ -6974,160 +7901,36 @@ var Separator4 = React36.forwardRef(function Separator5({ className, orientation
   );
 });
 Separator4.displayName = SeparatorPrimitive.Root.displayName;
-var SheetSideContext = React36.createContext({});
-var Sheet = ({ side, children, ...props }) => /* @__PURE__ */ jsx(DialogPrimitive.Root, { ...props, children: /* @__PURE__ */ jsx(SheetSideContext, { value: { side }, children }) });
-Sheet.displayName = "Sheet";
-var SheetTrigger = DialogPrimitive.Trigger;
-var SheetClose = DialogPrimitive.Close;
-var SheetPortal = DialogPrimitive.Portal;
-var SheetOverlay = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  DialogPrimitive.Overlay,
-  {
-    ref,
-    className: cn(
-      "bg-overlay fixed inset-0 z-[var(--z-overlay)] backdrop-blur-[4px]",
-      "transition-opacity duration-[var(--duration-overlay)] ease-[var(--ease-out-quart)]",
-      "data-[state=closed]:opacity-0 data-[state=open]:opacity-100",
-      "motion-reduce:transition-none",
-      className
-    ),
-    ...props
-  }
-));
-SheetOverlay.displayName = DialogPrimitive.Overlay.displayName;
-var sheetVariants = cva(
+var sideDrawerVariants = cva(
   cn(
-    "fixed z-[var(--z-modal)] flex flex-col gap-4 bg-surface text-fg shadow-pop",
+    "fixed inset-y-0 z-[var(--z-modal)] flex h-full flex-col bg-surface text-fg shadow-pop",
+    "font-body",
     "transition ease-in-out duration-[var(--duration-normal)] ease-[var(--ease-out-quart)]",
     "motion-reduce:transition-none"
   ),
   {
     variants: {
       side: {
-        top: cn(
-          "inset-x-0 top-0 border-b border-rule",
-          "data-[state=closed]:-translate-y-full data-[state=open]:translate-y-0"
-        ),
-        bottom: cn(
-          "inset-x-0 bottom-0 border-t border-rule max-h-[85vh]",
-          "data-[state=closed]:translate-y-full data-[state=open]:translate-y-0"
+        right: cn(
+          "right-0 border-l border-rule",
+          "data-[state=closed]:translate-x-full data-[state=open]:translate-x-0",
+          "data-[state=open]:animate-in data-[state=open]:slide-in-from-right",
+          "data-[state=closed]:animate-out data-[state=closed]:slide-out-to-right"
         ),
         left: cn(
-          "inset-y-0 left-0 h-full w-3/4 max-w-sm border-r border-rule",
-          "data-[state=closed]:-translate-x-full data-[state=open]:translate-x-0"
-        ),
-        right: cn(
-          "inset-y-0 right-0 h-full w-3/4 max-w-sm border-l border-rule",
-          "data-[state=closed]:translate-x-full data-[state=open]:translate-x-0"
+          "left-0 border-r border-rule",
+          "data-[state=closed]:-translate-x-full data-[state=open]:translate-x-0",
+          "data-[state=open]:animate-in data-[state=open]:slide-in-from-left",
+          "data-[state=closed]:animate-out data-[state=closed]:slide-out-to-left"
         )
+      },
+      width: {
+        sm: "w-[420px] max-md:w-[95vw]",
+        md: "w-[640px] max-lg:w-[80vw] max-md:w-[95vw]",
+        lg: "w-[50vw] max-lg:w-[80vw] max-md:w-[95vw]"
       }
     },
-    defaultVariants: { side: "right" }
-  }
-);
-var sheetWidthClasses = {
-  sm: "w-[95vw] max-w-[95vw] sm:w-[420px]",
-  md: "w-[95vw] max-w-[95vw] sm:w-[520px]",
-  lg: "w-[95vw] max-w-[95vw] sm:w-[640px]",
-  xl: "w-[95vw] max-w-[95vw] sm:w-[760px]",
-  full: "w-full max-w-none"
-};
-var SheetContent = React36.forwardRef(
-  ({ side, width = "default", customWidth, className, children, showCloseButton = true, style, ...props }, ref) => {
-    const ctx = React36.use(SheetSideContext);
-    const resolvedSide = side ?? ctx.side ?? "right";
-    const supportsWidth = resolvedSide === "left" || resolvedSide === "right";
-    const widthClass = supportsWidth && width !== "default" ? sheetWidthClasses[width] : null;
-    const widthStyle = supportsWidth && customWidth ? { width: customWidth, maxWidth: "95vw", ...style } : style;
-    return /* @__PURE__ */ jsxs(SheetPortal, { children: [
-      /* @__PURE__ */ jsx(SheetOverlay, {}),
-      /* @__PURE__ */ jsxs(
-        DialogPrimitive.Content,
-        {
-          ref,
-          className: cn(sheetVariants({ side: resolvedSide }), widthClass, className),
-          style: widthStyle,
-          ...props,
-          children: [
-            children,
-            showCloseButton && /* @__PURE__ */ jsx(
-              DialogPrimitive.Close,
-              {
-                className: cn(
-                  "absolute top-4 right-4 inline-flex size-7 items-center justify-center",
-                  "rounded-icon text-fg-4 transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] motion-reduce:transition-none",
-                  "hover:bg-overlay-hover hover:text-fg",
-                  "focus-visible:[box-shadow:var(--shadow-focus-ring)] focus-visible:outline-none",
-                  "disabled:pointer-events-none"
-                ),
-                "aria-label": "Close",
-                children: /* @__PURE__ */ jsx(XIcon, { className: "size-4", "aria-hidden": "true" })
-              }
-            )
-          ]
-        }
-      )
-    ] });
-  }
-);
-SheetContent.displayName = DialogPrimitive.Content.displayName;
-var SheetHeader = ({ className, ...props }) => /* @__PURE__ */ jsx("div", { className: cn("flex flex-col gap-1.5 p-6 pr-12 pb-0", className), ...props });
-SheetHeader.displayName = "SheetHeader";
-var SheetFooter = ({ className, ...props }) => /* @__PURE__ */ jsx(
-  "div",
-  {
-    className: cn(
-      "border-rule mt-auto flex flex-col-reverse gap-2 border-t p-6 sm:flex-row sm:items-center sm:justify-end",
-      className
-    ),
-    ...props
-  }
-);
-SheetFooter.displayName = "SheetFooter";
-var SheetTitle = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  DialogPrimitive.Title,
-  {
-    ref,
-    className: cn(
-      "font-display text-fg text-base leading-tight font-medium tracking-tight",
-      className
-    ),
-    ...props
-  }
-));
-SheetTitle.displayName = DialogPrimitive.Title.displayName;
-var SheetDescription = React36.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(DialogPrimitive.Description, { ref, className: cn("text-fg-3 text-sm", className), ...props }));
-SheetDescription.displayName = DialogPrimitive.Description.displayName;
-var sideDrawerVariants = cva(
-  cn(
-    "fixed inset-y-0 z-[var(--z-modal)] flex h-full flex-col bg-surface text-fg shadow-pop",
-    "font-body",
-    "transition ease-in-out duration-[var(--duration-normal)] ease-[var(--ease-out-quart)]",
-    "motion-reduce:transition-none"
-  ),
-  {
-    variants: {
-      side: {
-        right: cn(
-          "right-0 border-l border-rule",
-          "data-[state=closed]:translate-x-full data-[state=open]:translate-x-0",
-          "data-[state=open]:animate-in data-[state=open]:slide-in-from-right",
-          "data-[state=closed]:animate-out data-[state=closed]:slide-out-to-right"
-        ),
-        left: cn(
-          "left-0 border-r border-rule",
-          "data-[state=closed]:-translate-x-full data-[state=open]:translate-x-0",
-          "data-[state=open]:animate-in data-[state=open]:slide-in-from-left",
-          "data-[state=closed]:animate-out data-[state=closed]:slide-out-to-left"
-        )
-      },
-      width: {
-        sm: "w-[420px] max-md:w-[95vw]",
-        md: "w-[640px] max-lg:w-[80vw] max-md:w-[95vw]",
-        lg: "w-[50vw] max-lg:w-[80vw] max-md:w-[95vw]"
-      }
-    },
-    defaultVariants: { side: "right", width: "lg" }
+    defaultVariants: { side: "right", width: "lg" }
   }
 );
 function SideDrawer({
@@ -7213,7 +8016,7 @@ function SideDrawerFooter({ children, className }) {
 SideDrawer.Header = SideDrawerHeader;
 SideDrawer.Body = SideDrawerBody;
 SideDrawer.Footer = SideDrawerFooter;
-var Slider = React36.forwardRef(
+var Slider = React37.forwardRef(
   function Slider2({
     className,
     label,
@@ -7225,7 +8028,7 @@ var Slider = React36.forwardRef(
     defaultValue,
     ...props
   }, ref) {
-    const generatedId = React36.useId();
+    const generatedId = React37.useId();
     const id = providedId ?? generatedId;
     const displayValue = (() => {
       const v = value ?? defaultValue;
@@ -7358,6 +8161,52 @@ var Stat = forwardRef(function Stat2({ value, label, className, ...props }, ref)
   ] });
 });
 Stat.displayName = "Stat";
+var statusDotVariants = cva("relative inline-flex shrink-0 rounded-full bg-current", {
+  variants: {
+    tone: {
+      danger: "text-danger-fg",
+      warning: "text-warning-fg",
+      info: "text-accent",
+      success: "text-success-fg",
+      pro: "text-pro-fg",
+      neutral: "text-fg-4"
+    },
+    size: {
+      sm: "size-[7px]",
+      md: "size-[9px]"
+    },
+    ring: {
+      true: "shadow-[0_0_0_2px_var(--color-surface)]",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    tone: "danger",
+    size: "sm",
+    ring: false
+  }
+});
+var StatusDot = forwardRef(function StatusDot2({ tone, size, ring, pulse, className, ...props }, ref) {
+  const ariaLabel = props["aria-label"];
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      ref,
+      role: ariaLabel ? "img" : void 0,
+      "aria-hidden": ariaLabel ? void 0 : true,
+      className: cn(statusDotVariants({ tone, size, ring }), className),
+      ...props,
+      children: pulse && /* @__PURE__ */ jsx(
+        "span",
+        {
+          "aria-hidden": "true",
+          className: "absolute inset-0 inline-flex animate-ping rounded-full bg-current opacity-75 motion-reduce:hidden"
+        }
+      )
+    }
+  );
+});
+StatusDot.displayName = "StatusDot";
 var CENTER = 8;
 var RING_RADIUS = 6;
 var STROKE_WIDTH = 2;
@@ -7478,6 +8327,25 @@ function StatusIcon({
     }
   );
 }
+var statusMap = {
+  requested: { variant: "warning", label: "Requested" },
+  "in-review": { variant: "info", label: "In review" },
+  "needs-revision": { variant: "destructive", label: "Needs revision" },
+  accepted: { variant: "success", label: "Accepted" },
+  signed: { variant: "success", label: "Signed" },
+  approved: { variant: "success", label: "Approved" },
+  paid: { variant: "success", label: "Paid" },
+  complete: { variant: "success", label: "Complete" },
+  draft: { variant: "secondary", label: "Draft" },
+  pending: { variant: "secondary", label: "Pending" },
+  overdue: { variant: "destructive", label: "Overdue" },
+  declined: { variant: "destructive", label: "Declined" }
+};
+var StatusPill = forwardRef(function StatusPill2({ status, dot = true, children, ...props }, ref) {
+  const { variant, label } = statusMap[status];
+  return /* @__PURE__ */ jsx(Badge, { ref, variant, dot, ...props, children: children ?? label });
+});
+StatusPill.displayName = "StatusPill";
 var Stepper = forwardRef(function Stepper2({ steps, currentStep, orientation = "horizontal", className, ...props }, ref) {
   const isVertical = orientation === "vertical";
   return /* @__PURE__ */ jsx(
@@ -7576,6 +8444,29 @@ var Stepper = forwardRef(function Stepper2({ steps, currentStep, orientation = "
   );
 });
 Stepper.displayName = "Stepper";
+var StickyActionBar = forwardRef(
+  function StickyActionBar2({ children, hint, offsetForMobileNav, className, ...props }, ref) {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "sticky inset-x-0 z-20 flex flex-wrap items-center gap-3",
+          "border-t border-rule bg-surface/80 px-4 py-3 backdrop-blur-md sm:px-6",
+          "supports-[backdrop-filter]:bg-surface/80",
+          offsetForMobileNav ? "bottom-[calc(3.5rem_+_env(safe-area-inset-bottom))] sm:bottom-0" : "bottom-0",
+          className
+        ),
+        ...props,
+        children: [
+          hint != null && /* @__PURE__ */ jsx("div", { className: "flex min-w-0 items-center gap-2 text-sm font-medium text-fg-3", children: hint }),
+          /* @__PURE__ */ jsx("div", { className: "ml-auto flex items-center gap-2", children })
+        ]
+      }
+    );
+  }
+);
+StickyActionBar.displayName = "StickyActionBar";
 var SubmitButton = forwardRef(function SubmitButton2({ pendingText, children, className, ...props }, ref) {
   const { pending } = useFormStatus();
   return /* @__PURE__ */ jsx(
@@ -7592,6 +8483,87 @@ var SubmitButton = forwardRef(function SubmitButton2({ pendingText, children, cl
   );
 });
 SubmitButton.displayName = "SubmitButton";
+var suiteProgressFillVariants = cva("", {
+  variants: {
+    tone: {
+      pro: "bg-brand-pro",
+      audit: "bg-brand-audit",
+      books: "bg-brand-books",
+      tax: "bg-brand-tax"
+    }
+  },
+  defaultVariants: { tone: "pro" }
+});
+var SIZE_STYLES = {
+  sm: { row: "gap-2", track: "gap-0.5", segment: "h-1", text: "text-xs" },
+  md: { row: "gap-3", track: "gap-1", segment: "h-[5px]", text: "text-sm" }
+};
+var SuiteProgress = forwardRef(
+  function SuiteProgress2({
+    value,
+    total,
+    showPercent = true,
+    percent,
+    tone = "pro",
+    size = "md",
+    label,
+    segmentClassName,
+    className,
+    ...props
+  }, ref) {
+    const styles = SIZE_STYLES[size];
+    const safeTotal = Math.max(1, Math.floor(total));
+    const safeValue = Math.min(safeTotal, Math.max(0, Math.floor(value)));
+    const resolvedPercent = percent != null ? Math.min(100, Math.max(0, Math.round(percent))) : Math.round(safeValue / safeTotal * 100);
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        role: "progressbar",
+        "aria-valuenow": resolvedPercent,
+        "aria-valuemin": 0,
+        "aria-valuemax": 100,
+        "aria-valuetext": `${safeValue} of ${safeTotal}`,
+        "aria-label": label ?? "Progress",
+        className: cn("flex items-center", styles.row, className),
+        ...props,
+        children: [
+          label && /* @__PURE__ */ jsx("span", { className: cn("text-fg-2 flex-none font-medium", styles.text), children: label }),
+          /* @__PURE__ */ jsx("div", { className: cn("flex min-w-0 flex-1", styles.track), "aria-hidden": "true", children: Array.from({ length: safeTotal }, (_, i) => {
+            const filled = i < safeValue;
+            return /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: cn(
+                  "flex-1 rounded-full",
+                  styles.segment,
+                  "transition-colors duration-[var(--duration-overlay)] ease-[var(--ease-out-quart)] motion-reduce:transition-none",
+                  filled ? suiteProgressFillVariants({ tone }) : "bg-surface-3",
+                  segmentClassName
+                )
+              },
+              i
+            );
+          }) }),
+          showPercent && /* @__PURE__ */ jsxs(
+            "span",
+            {
+              className: cn(
+                "text-fg flex-none font-bold tracking-tight tabular-nums",
+                styles.text
+              ),
+              children: [
+                resolvedPercent,
+                /* @__PURE__ */ jsx("span", { className: "text-fg-4 ml-px text-[0.72em] font-semibold", children: "%" })
+              ]
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+SuiteProgress.displayName = "SuiteProgress";
 var switchVariants = cva(
   [
     "peer inline-flex shrink-0 cursor-pointer items-center rounded-full border border-transparent",
@@ -7634,9 +8606,9 @@ var switchThumbVariants = cva(
     }
   }
 );
-var Switch = React36.forwardRef(
+var Switch = React37.forwardRef(
   function Switch2({ label, size, className, id: providedId, ...props }, ref) {
-    const generatedId = React36.useId();
+    const generatedId = React37.useId();
     const id = providedId ?? generatedId;
     const root = /* @__PURE__ */ jsx(
       SwitchPrimitive.Root,
@@ -7668,7 +8640,7 @@ var Table = forwardRef(function Table2({ className, wrapperClassName, ...props }
     "div",
     {
       className: cn(
-        "rounded-card border-rule bg-surface w-full overflow-x-auto border",
+        "rounded-card border-rule-strong bg-surface w-full overflow-x-auto border shadow-quiet",
         wrapperClassName
       ),
       children: /* @__PURE__ */ jsx(
@@ -7733,10 +8705,11 @@ var TableHead = forwardRef(function TableHead2({ className, ...props }, ref) {
     {
       ref,
       className: cn(
-        // .data-table th — mono, 10px, uppercase, tight tracking 0.12em
-        "h-9 px-3.5 py-2 text-left align-middle whitespace-nowrap",
-        "font-mono text-[10px] font-medium tracking-[0.12em] uppercase",
-        "text-fg-4 bg-surface-2",
+        // Sentence-case column labels in the body font (Plus Jakarta Sans),
+        // quiet gray — not mono uppercase eyebrows.
+        "h-11 px-4 py-2.5 text-left align-middle whitespace-nowrap",
+        "font-sans text-[14px] font-medium tracking-normal normal-case",
+        "text-fg-3 bg-surface-2",
         "border-rule border-b",
         "[&:has([role=checkbox])]:pr-0",
         className
@@ -7752,8 +8725,9 @@ var TableCell = forwardRef(function TableCell2({ className, ...props }, ref) {
     {
       ref,
       className: cn(
-        // .data-table td — 13px, fg-2, soft 1px row divider, tabular nums
-        "text-fg-2 px-3.5 py-2.5 align-middle text-[13px] tabular-nums",
+        // 13px, fg-2, soft 1px row divider, tabular nums; airier vertical
+        // rhythm (py-3) for the taller rows in the catalog layout.
+        "text-fg-2 px-4 py-3 align-middle text-[13px] tabular-nums",
         "[&:has([role=checkbox])]:pr-0",
         className
       ),
@@ -7768,18 +8742,18 @@ var TableCaption = forwardRef(
   }
 );
 TableCaption.displayName = "TableCaption";
-var Tabs = React36.forwardRef(
+var Tabs = React37.forwardRef(
   function Tabs2({ className, ...props }, ref) {
     return /* @__PURE__ */ jsx(TabsPrimitive.Root, { ref, className: cn(className), ...props });
   }
 );
 Tabs.displayName = TabsPrimitive.Root.displayName;
-var TabsList = React36.forwardRef(function TabsList2({ className, ...props }, ref) {
+var TabsList = React37.forwardRef(function TabsList2({ className, ...props }, ref) {
   return /* @__PURE__ */ jsx(
     TabsPrimitive.List,
     {
       ref,
-      className: cn("border-rule inline-flex items-center gap-0 border-b", className),
+      className: cn("border-rule flex items-center gap-0 border-b", className),
       ...props
     }
   );
@@ -7819,7 +8793,7 @@ var triggerVariants = cva(
     }
   }
 );
-var TabsTrigger = React36.forwardRef(function TabsTrigger2({ className, variant, ...props }, ref) {
+var TabsTrigger = React37.forwardRef(function TabsTrigger2({ className, variant, ...props }, ref) {
   return /* @__PURE__ */ jsx(
     TabsPrimitive.Trigger,
     {
@@ -7830,7 +8804,7 @@ var TabsTrigger = React36.forwardRef(function TabsTrigger2({ className, variant,
   );
 });
 TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
-var TabsContent = React36.forwardRef(function TabsContent2({ className, ...props }, ref) {
+var TabsContent = React37.forwardRef(function TabsContent2({ className, ...props }, ref) {
   return /* @__PURE__ */ jsx(
     TabsPrimitive.Content,
     {
@@ -7855,7 +8829,7 @@ function TeamMemberSelect({
   placeholder = "Select team member...",
   className
 }) {
-  const options = React36.useMemo(() => {
+  const options = React37.useMemo(() => {
     const meBadge = /* @__PURE__ */ jsx(
       Badge,
       {
@@ -8185,10 +9159,10 @@ var itemVariants = cva(
     }
   }
 );
-var ToggleGroupContext = React36.createContext({
+var ToggleGroupContext = React37.createContext({
   variant: "default"
 });
-var ToggleGroup = React36.forwardRef(function ToggleGroup2({ className, variant, children, ...props }, ref) {
+var ToggleGroup = React37.forwardRef(function ToggleGroup2({ className, variant, children, ...props }, ref) {
   return /* @__PURE__ */ jsx(
     ToggleGroupPrimitive.Root,
     {
@@ -8200,8 +9174,8 @@ var ToggleGroup = React36.forwardRef(function ToggleGroup2({ className, variant,
   );
 });
 ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;
-var ToggleGroupItem = React36.forwardRef(function ToggleGroupItem2({ className, variant, ...props }, ref) {
-  const ctx = React36.useContext(ToggleGroupContext);
+var ToggleGroupItem = React37.forwardRef(function ToggleGroupItem2({ className, variant, ...props }, ref) {
+  const ctx = React37.useContext(ToggleGroupContext);
   return /* @__PURE__ */ jsx(
     ToggleGroupPrimitive.Item,
     {
@@ -8220,7 +9194,7 @@ var Tooltip = ({ delayMs, delayDuration, children, ...props }) => {
   return /* @__PURE__ */ jsx(TooltipPrimitive.Provider, { delayDuration: resolvedDelay, children: /* @__PURE__ */ jsx(TooltipPrimitive.Root, { delayDuration: resolvedDelay, ...props, children }) });
 };
 Tooltip.displayName = "Tooltip";
-var TooltipContent = React36.forwardRef(({ className, sideOffset = 6, ...props }, ref) => /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+var TooltipContent = React37.forwardRef(({ className, sideOffset = 6, ...props }, ref) => /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx(
   TooltipPrimitive.Content,
   {
     ref,
@@ -8245,6 +9219,637 @@ var VisuallyHidden = forwardRef(
   }
 );
 VisuallyHidden.displayName = "VisuallyHidden";
+function AiSpark({ size = 16, className }) {
+  const id = useId();
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      width: size,
+      height: size * 12 / 16,
+      viewBox: "0 0 16 12",
+      fill: "none",
+      className: cn("block shrink-0", className),
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M6.24553 5.34293C5.91553 5.23294 5.91553 4.76699 6.24553 4.657L8.18254 4.01207C8.60834 3.87011 8.99522 3.63094 9.31252 3.3135C9.62982 2.99607 9.8688 2.6091 10.0105 2.18327L10.6555 0.247473C10.7655 -0.0824911 11.2315 -0.0824912 11.3415 0.247473L11.9866 2.18427C12.1285 2.61002 12.3677 2.99686 12.6852 3.31412C13.0027 3.63139 13.3897 3.87035 13.8156 4.01207L15.7516 4.657C15.8238 4.68071 15.8868 4.72664 15.9314 4.78823C15.976 4.84982 16 4.92392 16 4.99996C16 5.07601 15.976 5.15011 15.9314 5.2117C15.8868 5.27329 15.8238 5.31921 15.7516 5.34293L13.8146 5.98786C13.3889 6.12971 13.0021 6.36874 12.6848 6.68599C12.3675 7.00324 12.1284 7.39001 11.9866 7.81566L11.3415 9.75245C11.3178 9.82471 11.2719 9.88763 11.2103 9.93223C11.1487 9.97684 11.0746 10.0009 10.9985 10.0009C10.9225 10.0009 10.8484 9.97684 10.7868 9.93223C10.7252 9.88763 10.6793 9.82471 10.6555 9.75245L10.0105 7.81566C9.86867 7.39001 9.62962 7.00324 9.31233 6.68599C8.99505 6.36874 8.60823 6.12971 8.18254 5.98786L6.24553 5.34293ZM1.14651 9.20551C1.1032 9.19117 1.06552 9.16355 1.03881 9.12658C1.0121 9.0896 0.99772 9.04515 0.99772 8.99954C0.99772 8.95392 1.0121 8.90947 1.03881 8.87249C1.06552 8.83552 1.1032 8.8079 1.14651 8.79356L2.30851 8.4066C2.82651 8.23362 3.23252 7.82766 3.40552 7.30972L3.79252 6.14784C3.80686 6.10454 3.83448 6.06686 3.87146 6.04015C3.90844 6.01345 3.9529 5.99907 3.99852 5.99907C4.04414 5.99907 4.0886 6.01345 4.12558 6.04015C4.16256 6.06686 4.19018 6.10454 4.20452 6.14784L4.59152 7.30972C4.67664 7.56516 4.82009 7.79728 5.0105 7.98767C5.20091 8.17806 5.43305 8.32149 5.68853 8.4066L6.85053 8.79356C6.89384 8.8079 6.93152 8.83551 6.95823 8.87249C6.98494 8.90947 6.99932 8.95392 6.99932 8.99954C6.99932 9.04515 6.98494 9.0896 6.95823 9.12658C6.93152 9.16355 6.89384 9.19117 6.85053 9.20551L5.68853 9.59247C5.43305 9.67758 5.20091 9.82101 5.0105 10.0114C4.82009 10.2018 4.67664 10.4339 4.59152 10.6894L4.20452 11.8512C4.19018 11.8945 4.16256 11.9322 4.12558 11.9589C4.0886 11.9856 4.04414 12 3.99852 12C3.9529 12 3.90844 11.9856 3.87146 11.9589C3.83448 11.9322 3.80686 11.8945 3.79252 11.8512L3.40552 10.6894C3.3204 10.4339 3.17695 10.2018 2.98654 10.0114C2.79613 9.82101 2.56399 9.67758 2.30851 9.59247L1.14651 9.20551ZM0.097503 2.13727C0.0690292 2.1274 0.0443387 2.1089 0.0268643 2.08435C0.00938996 2.0598 1.317e-09 2.03042 0 2.00029C-1.318e-09 1.97015 0.00938995 1.94077 0.0268643 1.91622C0.0443387 1.89167 0.0690292 1.87317 0.097503 1.8633L0.871506 1.60533C1.21751 1.49034 1.48851 1.21937 1.60351 0.873408L1.86151 0.0994903C1.87138 0.0710193 1.88988 0.0463306 1.91443 0.0288584C1.93899 0.0113861 1.96837 0.00199815 1.99851 0.00199814C2.02865 0.00199814 2.05803 0.0113861 2.08259 0.0288583C2.10714 0.0463306 2.12564 0.0710193 2.13551 0.0994903L2.39351 0.873408C2.45024 1.0439 2.54593 1.19882 2.673 1.32588C2.80006 1.45293 2.955 1.54861 3.12552 1.60533L3.89952 1.8633C3.92799 1.87317 3.95268 1.89167 3.97016 1.91622C3.98763 1.94077 3.99702 1.97015 3.99702 2.00029C3.99702 2.03042 3.98763 2.0598 3.97016 2.08435C3.95268 2.1089 3.92799 2.1274 3.89952 2.13727L3.12552 2.39524C2.955 2.45196 2.80006 2.54764 2.673 2.6747C2.54593 2.80175 2.45024 2.95667 2.39351 3.12717L2.13551 3.90008C2.12564 3.92855 2.10714 3.95324 2.08259 3.97071C2.05804 3.98819 2.02865 3.99757 1.99851 3.99757C1.96837 3.99757 1.93899 3.98819 1.91443 3.97071C1.88988 3.95324 1.87138 3.92855 1.86151 3.90008L1.60351 3.12617C1.48851 2.7802 1.21751 2.50923 0.871506 2.39424L0.097503 2.13727Z",
+            fill: `url(#${id})`
+          }
+        ),
+        /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs(
+          "linearGradient",
+          {
+            id,
+            x1: "0.265576",
+            y1: "0.856805",
+            x2: "13.5",
+            y2: "12",
+            gradientUnits: "userSpaceOnUse",
+            children: [
+              /* @__PURE__ */ jsx("stop", { stopColor: "#9E32FF" }),
+              /* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "#1BB6FF" })
+            ]
+          }
+        ) })
+      ]
+    }
+  );
+}
+function Field({ label, value, confirmed }) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-0.5", children: [
+    /* @__PURE__ */ jsx("span", { className: "text-fg-3 text-[11px]", children: label }),
+    /* @__PURE__ */ jsxs("span", { className: "text-fg inline-flex items-center gap-1 text-sm font-medium", children: [
+      value,
+      confirmed && /* @__PURE__ */ jsx(CheckIcon, { className: "text-success-fg size-3", strokeWidth: 3 })
+    ] })
+  ] });
+}
+var AIReceiptPanel = forwardRef(function AIReceiptPanel2({ state = "idle", result, onAttach, onRemove, onViewFile, className, ...props }, ref) {
+  if (state === "reading") {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        role: "status",
+        "aria-live": "polite",
+        className: cn(
+          "border-rule bg-surface-2 flex items-center gap-3 rounded-[var(--radius-input)] border p-3",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx(AiSpark, { size: 18, className: "motion-safe:animate-pulse" }),
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("p", { className: "text-fg text-sm font-medium", children: "Reading your receipt\u2026" }),
+            /* @__PURE__ */ jsx("p", { className: "text-fg-3 text-xs", children: "Pulling the vendor, amount and a suggested category." })
+          ] })
+        ]
+      }
+    );
+  }
+  if (state === "done" && result) {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "border-rule bg-surface-2 flex flex-col gap-3 rounded-[var(--radius-input)] border p-3",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+            /* @__PURE__ */ jsxs("span", { className: "text-fg-2 inline-flex items-center gap-1.5 text-xs font-semibold", children: [
+              /* @__PURE__ */ jsx(AiSpark, { size: 14 }),
+              " Auto-filled from receipt"
+            ] }),
+            onRemove && /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onClick: onRemove, children: "Remove" })
+          ] }),
+          /* @__PURE__ */ jsx(
+            FileChip,
+            {
+              name: result.file.name,
+              meta: result.file.meta,
+              className: "bg-surface",
+              action: onViewFile && /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onClick: onViewFile, children: "View" })
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "border-rule grid grid-cols-3 gap-3 border-t pt-3", children: [
+            /* @__PURE__ */ jsx(Field, { label: "Vendor", value: result.vendor }),
+            /* @__PURE__ */ jsx(Field, { label: "Amount", value: result.amount, confirmed: true }),
+            /* @__PURE__ */ jsx(Field, { label: "Date", value: result.date, confirmed: true })
+          ] })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      ref,
+      type: "button",
+      onClick: onAttach,
+      className: cn(
+        "group border-rule-strong bg-surface hover:border-pro-fg/50 hover:bg-pro-bg/40 flex w-full items-center gap-3 rounded-[var(--radius-input)] border-2 border-dashed p-3 text-left transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] focus-visible:outline-none focus-visible:[box-shadow:var(--shadow-focus-ring)] motion-reduce:transition-none",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(AiSpark, { size: 19 }),
+        /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ jsx("span", { className: "text-fg block text-sm font-medium", children: "Attach receipt \u2014 auto-fill with AI" }),
+          /* @__PURE__ */ jsx("span", { className: "text-fg-3 block text-xs", children: "We'll read the vendor, amount & suggest a category" })
+        ] }),
+        /* @__PURE__ */ jsx(UploadIcon, { className: "text-fg-3 size-4.5 shrink-0", "aria-hidden": "true" })
+      ]
+    }
+  );
+});
+AIReceiptPanel.displayName = "AIReceiptPanel";
+
+// src/lib/service-tone.ts
+var toneToken = {
+  tax: { fill: "var(--color-service-tax)", bg: "var(--color-service-tax-bg)" },
+  audit: { fill: "var(--color-service-audit)", bg: "var(--color-service-audit-bg)" },
+  accounting: {
+    fill: "var(--color-service-accounting)",
+    bg: "var(--color-service-accounting-bg)"
+  },
+  neutral: { fill: "var(--color-pro-fg)", bg: "var(--color-pro-bg)" }
+};
+function serviceToneStyle(tone) {
+  const { fill, bg } = toneToken[tone];
+  return { "--tone": fill, "--tone-bg": bg };
+}
+var SERVICE_TONES = ["tax", "audit", "accounting", "neutral"];
+var serviceToneLabel = {
+  tax: "Tax",
+  audit: "Audit",
+  accounting: "Accounting",
+  neutral: "General"
+};
+var urgencyTile = {
+  default: "[background:var(--tone-bg)] [color:var(--tone)]",
+  warning: "bg-warning-bg text-warning-fg",
+  danger: "bg-danger-bg text-danger-fg"
+};
+var AttentionItem = forwardRef(function AttentionItem2({ icon, title, description, tone = "neutral", urgency = "default", action, onClick, className, style, ...props }, ref) {
+  const interactive = Boolean(onClick);
+  const body = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      "span",
+      {
+        "aria-hidden": "true",
+        className: cn(
+          "flex size-9 shrink-0 items-center justify-center rounded-[var(--radius-input)] [&_svg]:size-4.5",
+          urgencyTile[urgency]
+        ),
+        children: icon
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+      /* @__PURE__ */ jsx("p", { className: "text-fg text-sm font-medium", children: title }),
+      description != null && /* @__PURE__ */ jsx("p", { className: "text-fg-3 mt-0.5 text-xs", children: description })
+    ] }),
+    action ?? (interactive && /* @__PURE__ */ jsx(ArrowRightIcon, { className: "text-fg-4 size-4 shrink-0 self-center", "aria-hidden": "true" }))
+  ] });
+  const rootClass = cn(
+    "border-rule bg-surface flex items-start gap-3 rounded-[var(--radius-input)] border p-3 text-left",
+    interactive && "w-full transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] hover:bg-bg-2 focus-visible:outline-none focus-visible:[box-shadow:var(--shadow-focus-ring)] motion-reduce:transition-none",
+    className
+  );
+  const rootStyle = { ...serviceToneStyle(tone), ...style };
+  if (interactive) {
+    return /* @__PURE__ */ jsx(
+      "button",
+      {
+        ref,
+        type: "button",
+        onClick,
+        className: rootClass,
+        style: rootStyle,
+        ...props,
+        children: body
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx("div", { ref, className: rootClass, style: rootStyle, ...props, children: body });
+});
+AttentionItem.displayName = "AttentionItem";
+var BottomNav = forwardRef(function BottomNav2({ tabs, value, onChange, className, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    "nav",
+    {
+      ref,
+      "aria-label": "Primary",
+      className: cn(
+        "border-rule bg-surface/95 sticky bottom-0 z-[var(--z-sticky)] flex items-stretch border-t pb-[env(safe-area-inset-bottom)] backdrop-blur",
+        className
+      ),
+      ...props,
+      children: tabs.map((tab) => {
+        const active = tab.id === value;
+        return /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            "aria-current": active ? "page" : void 0,
+            onClick: () => onChange(tab.id),
+            className: cn(
+              "relative flex flex-1 flex-col items-center gap-1 px-1 py-2 text-[11px] font-medium transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] focus-visible:outline-none focus-visible:[box-shadow:var(--shadow-focus-ring)] motion-reduce:transition-none",
+              active ? "text-pro-fg" : "text-fg-4 hover:text-fg-2"
+            ),
+            children: [
+              /* @__PURE__ */ jsxs("span", { className: "relative [&_svg]:size-5", children: [
+                tab.icon,
+                tab.badge != null && tab.badge !== false && /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: cn(
+                      "bg-danger-fg text-fg-on-danger absolute -top-1 -right-1.5 flex min-w-3.5 items-center justify-center rounded-full px-1 text-[9px] leading-none font-semibold tabular-nums",
+                      tab.badge === true && "size-2 min-w-0 px-0"
+                    ),
+                    children: typeof tab.badge === "number" ? tab.badge : null
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsx("span", { className: "max-w-full truncate", children: tab.label })
+            ]
+          },
+          tab.id
+        );
+      })
+    }
+  );
+});
+BottomNav.displayName = "BottomNav";
+function readOrder(storageKey) {
+  if (!storageKey || typeof window === "undefined") return null;
+  try {
+    const raw = window.localStorage.getItem(storageKey);
+    return raw ? JSON.parse(raw) : null;
+  } catch {
+    return null;
+  }
+}
+var colsClass = {
+  2: "lg:grid-cols-2",
+  3: "lg:grid-cols-3",
+  4: "lg:grid-cols-4"
+};
+var spanClass = {
+  1: "",
+  2: "lg:col-span-2",
+  3: "lg:col-span-3"
+};
+var DashGrid = forwardRef(function DashGrid2({ widgets, storageKey, onReorder, columns = 3, className, ...props }, ref) {
+  const [order, setOrder] = useState(() => {
+    const stored = readOrder(storageKey);
+    const ids = widgets.map((w) => w.id);
+    if (!stored) return ids;
+    const kept = stored.filter((id) => ids.includes(id));
+    const added = ids.filter((id) => !kept.includes(id));
+    return [...kept, ...added];
+  });
+  const [dragId, setDragId] = useState(null);
+  const [overId, setOverId] = useState(null);
+  const commit = (next) => {
+    setOrder(next);
+    onReorder?.(next);
+    if (storageKey && typeof window !== "undefined") {
+      try {
+        window.localStorage.setItem(storageKey, JSON.stringify(next));
+      } catch {
+      }
+    }
+  };
+  const move = (from, to) => {
+    if (from === to) return;
+    const next = [...order];
+    const fromIdx = next.indexOf(from);
+    const toIdx = next.indexOf(to);
+    if (fromIdx < 0 || toIdx < 0) return;
+    next.splice(toIdx, 0, next.splice(fromIdx, 1)[0]);
+    commit(next);
+  };
+  const byId = new Map(widgets.map((w) => [w.id, w]));
+  const ordered = order.map((id) => byId.get(id)).filter(Boolean);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      suppressHydrationWarning: true,
+      className: cn("grid grid-cols-1 gap-4 sm:grid-cols-2", colsClass[columns], className),
+      ...props,
+      children: ordered.map((widget) => {
+        const isDragging = dragId === widget.id;
+        const isOver = overId === widget.id && dragId !== widget.id;
+        return (
+          // The wrapper is an HTML5 drag DROP target: onDragOver/onDrop carry
+          // no click semantics and aren't keyboard-reachable by design — the
+          // grab handle below is the focusable control. Pointer reordering is
+          // an enhancement (same precedent as the sidebar hover-peek); there
+          // is intentionally no keyboard analogue on the drop zone itself.
+          // eslint-disable-next-line jsx-a11y/no-static-element-interactions
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: cn(
+                "group/dash relative transition-[opacity,box-shadow] duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] motion-reduce:transition-none",
+                spanClass[widget.span ?? 1],
+                isDragging && "opacity-40",
+                isOver && "rounded-card [box-shadow:var(--shadow-focus-ring)]"
+              ),
+              onDragOver: (e) => {
+                if (!dragId) return;
+                e.preventDefault();
+                setOverId(widget.id);
+              },
+              onDrop: (e) => {
+                e.preventDefault();
+                if (dragId) move(dragId, widget.id);
+                setDragId(null);
+                setOverId(null);
+              },
+              children: [
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    "aria-label": `Reorder widget`,
+                    draggable: true,
+                    onDragStart: (e) => {
+                      setDragId(widget.id);
+                      e.dataTransfer.effectAllowed = "move";
+                    },
+                    onDragEnd: () => {
+                      setDragId(null);
+                      setOverId(null);
+                    },
+                    className: "absolute top-3 right-3 z-[var(--z-base)] flex cursor-grab touch-none items-center justify-center rounded-[var(--radius-icon)] p-1 text-fg-4 opacity-0 transition-opacity duration-[var(--duration-fast)] hover:bg-bg-2 hover:text-fg-2 focus-visible:opacity-100 focus-visible:outline-none focus-visible:[box-shadow:var(--shadow-focus-ring)] active:cursor-grabbing group-hover/dash:opacity-100 motion-reduce:transition-none",
+                    children: /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "grid grid-cols-2 gap-[3px]", children: Array.from({ length: 6 }, (_, i) => /* @__PURE__ */ jsx("span", { className: "size-[3px] rounded-full bg-current" }, i)) })
+                  }
+                ),
+                widget.content
+              ]
+            },
+            widget.id
+          )
+        );
+      })
+    }
+  );
+});
+DashGrid.displayName = "DashGrid";
+var toneToSegment = {
+  tax: "tax",
+  audit: "audit",
+  accounting: "accounting",
+  neutral: "default"
+};
+var EngagementCard = forwardRef(function EngagementCard2({
+  service,
+  serviceIcon,
+  tone = "neutral",
+  title,
+  status,
+  current,
+  steps,
+  stepLabel,
+  eta,
+  ring,
+  onOpen,
+  className,
+  style,
+  ...props
+}, ref) {
+  const pct = steps > 0 ? Math.round(current / steps * 100) : 0;
+  const interactive = Boolean(onOpen);
+  const body = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+      /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1.5 text-sm font-semibold [color:var(--tone)] [&_svg]:size-[15px]", children: [
+        serviceIcon,
+        service
+      ] }),
+      status
+    ] }),
+    /* @__PURE__ */ jsx("p", { className: "text-fg mt-2 text-base leading-snug font-medium", children: title }),
+    stepLabel != null && /* @__PURE__ */ jsxs("p", { className: "text-fg-3 mt-1 text-xs", children: [
+      stepLabel,
+      " \xB7 Step ",
+      current,
+      " of ",
+      steps
+    ] }),
+    ring ? /* @__PURE__ */ jsxs("div", { className: "mt-3 flex items-center gap-3", children: [
+      /* @__PURE__ */ jsx(
+        ProgressRing,
+        {
+          value: pct,
+          size: 52,
+          strokeWidth: 6,
+          label: `${pct}%`,
+          className: "[&_circle:last-child]:[stroke:var(--tone)]"
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: "text-fg-3 text-xs", children: "complete" })
+    ] }) : /* @__PURE__ */ jsxs("div", { className: "mt-3 flex items-center gap-3", children: [
+      /* @__PURE__ */ jsx(SegmentedProgress, { steps, current, tone: toneToSegment[tone] }),
+      /* @__PURE__ */ jsxs("span", { className: "shrink-0 text-sm font-semibold tabular-nums [color:var(--tone)]", children: [
+        pct,
+        /* @__PURE__ */ jsx("span", { className: "text-fg-4 text-xs font-normal", children: "%" })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "border-rule-soft mt-3 flex items-center justify-between gap-2 border-t pt-3", children: [
+      eta != null && /* @__PURE__ */ jsxs("span", { className: "text-fg-3 inline-flex items-center gap-1.5 text-xs [&_svg]:size-3.5", children: [
+        /* @__PURE__ */ jsx(CalendarIcon, { "aria-hidden": "true" }),
+        eta
+      ] }),
+      interactive && /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1 text-xs font-medium [color:var(--tone)] [&_svg]:size-3.5", children: [
+        "Open ",
+        /* @__PURE__ */ jsx(ArrowRightIcon, { "aria-hidden": "true" })
+      ] })
+    ] })
+  ] });
+  const rootClass = cn(
+    "border-rule bg-surface block w-full rounded-card border p-4 text-left shadow-quiet",
+    interactive && "transition-[border-color,box-shadow] duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] hover:border-[color:var(--tone)] hover:shadow-card focus-visible:outline-none focus-visible:[box-shadow:var(--shadow-focus-ring)] motion-reduce:transition-none",
+    className
+  );
+  const rootStyle = { ...serviceToneStyle(tone), ...style };
+  if (interactive) {
+    return /* @__PURE__ */ jsx(
+      "button",
+      {
+        ref,
+        type: "button",
+        onClick: onOpen,
+        className: rootClass,
+        style: rootStyle,
+        ...props,
+        children: body
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx("div", { ref, className: rootClass, style: rootStyle, ...props, children: body });
+});
+EngagementCard.displayName = "EngagementCard";
+var EngagementTimeline = forwardRef(
+  function EngagementTimeline2({ tone = "neutral", className, style, children, ...props }, ref) {
+    return /* @__PURE__ */ jsx(
+      "ol",
+      {
+        ref,
+        className: cn("flex flex-col", className),
+        style: { ...serviceToneStyle(tone), ...style },
+        ...props,
+        children
+      }
+    );
+  }
+);
+EngagementTimeline.displayName = "EngagementTimeline";
+var stateBadge = {
+  done: { label: "Done", className: "text-success-fg" },
+  active: { label: "In progress", className: "[color:var(--tone)]" },
+  todo: { label: "Upcoming", className: "text-fg-4" }
+};
+var EngagementTimelineStep = forwardRef(
+  function EngagementTimelineStep2({ state, name, index, note, date, actions, last, className, ...props }, ref) {
+    const badge = stateBadge[state];
+    return /* @__PURE__ */ jsxs("li", { ref, className: cn("flex gap-3", className), ...props, children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center", children: [
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: cn(
+              "flex size-7 shrink-0 items-center justify-center rounded-full text-xs font-semibold tabular-nums",
+              state === "done" && "bg-success-fg text-fg-on-success",
+              state === "active" && "bg-surface border-2 [border-color:var(--tone)] [color:var(--tone)]",
+              state === "todo" && "bg-bg-3 text-fg-4"
+            ),
+            children: state === "done" ? /* @__PURE__ */ jsx(CheckIcon, { className: "size-4", strokeWidth: 3 }) : index
+          }
+        ),
+        !last && /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: cn("w-0.5 flex-1", state === "done" ? "bg-success-line" : "bg-rule")
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: cn("min-w-0 flex-1", last ? "pb-0" : "pb-6"), children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn(
+                "text-sm font-medium",
+                state === "todo" ? "text-fg-3" : "text-fg"
+              ),
+              children: name
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { className: cn("shrink-0 text-[11px] font-semibold", badge.className), children: badge.label })
+        ] }),
+        note != null && /* @__PURE__ */ jsx("p", { className: "text-fg-3 mt-0.5 text-xs", children: note }),
+        state === "done" && date != null && /* @__PURE__ */ jsxs("p", { className: "text-success-fg mt-1 inline-flex items-center gap-1 text-[11px]", children: [
+          /* @__PURE__ */ jsx(CheckIcon, { className: "size-3", strokeWidth: 3, "aria-hidden": "true" }),
+          " Completed ",
+          date
+        ] }),
+        state === "active" && actions && /* @__PURE__ */ jsx("div", { className: "mt-2 flex flex-wrap gap-2", children: actions })
+      ] })
+    ] });
+  }
+);
+EngagementTimelineStep.displayName = "EngagementTimelineStep";
+var INDENT = 18;
+var FolderTree = forwardRef(function FolderTree2({ nodes, activeId, onSelect, defaultOpenIds, openIds, onOpenChange, className, ...props }, ref) {
+  const isControlled = openIds !== void 0;
+  const [internalOpen, setInternalOpen] = useState(() => new Set(defaultOpenIds ?? []));
+  const open = isControlled ? new Set(openIds) : internalOpen;
+  const toggle = (id) => {
+    const next = new Set(open);
+    if (next.has(id)) next.delete(id);
+    else next.add(id);
+    if (isControlled) onOpenChange?.([...next]);
+    else {
+      setInternalOpen(next);
+      onOpenChange?.([...next]);
+    }
+  };
+  const renderNode = (node, depth) => {
+    const hasChildren = Boolean(node.children?.length);
+    const isOpen = open.has(node.id);
+    const isActive = activeId === node.id;
+    return /* @__PURE__ */ jsxs("li", { children: [
+      /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: cn(
+            "group/row flex items-stretch rounded-[var(--radius-icon)]",
+            isActive ? "bg-pro-bg" : "hover:bg-bg-2"
+          ),
+          children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                "aria-expanded": hasChildren ? isOpen : void 0,
+                "aria-label": isOpen ? `Collapse ${node.name}` : `Expand ${node.name}`,
+                onClick: () => hasChildren && toggle(node.id),
+                disabled: !hasChildren,
+                className: "flex w-6 shrink-0 items-center justify-center self-stretch text-fg-4 disabled:opacity-0",
+                style: { marginLeft: depth * INDENT },
+                tabIndex: hasChildren ? 0 : -1,
+                children: /* @__PURE__ */ jsx(
+                  ChevronRightIcon,
+                  {
+                    className: cn(
+                      "size-3.5 transition-transform duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] motion-reduce:transition-none",
+                      isOpen && "rotate-90"
+                    ),
+                    "aria-hidden": "true"
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              "button",
+              {
+                type: "button",
+                onClick: () => onSelect?.(node.id),
+                "aria-current": isActive ? "true" : void 0,
+                className: cn(
+                  "flex min-w-0 flex-1 items-center gap-2 py-1.5 pr-2 text-left text-sm focus-visible:outline-none focus-visible:[box-shadow:var(--shadow-focus-ring)]",
+                  isActive ? "text-pro-fg font-medium" : "text-fg-2"
+                ),
+                children: [
+                  /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "shrink-0 [&_svg]:size-4", children: isOpen && hasChildren ? /* @__PURE__ */ jsx(FolderOpenIcon, {}) : /* @__PURE__ */ jsx(FolderClosedIcon, {}) }),
+                  /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: node.name }),
+                  node.count != null && /* @__PURE__ */ jsx("span", { className: "text-fg-4 shrink-0 text-xs tabular-nums", children: node.count })
+                ]
+              }
+            )
+          ]
+        }
+      ),
+      hasChildren && isOpen && /* @__PURE__ */ jsx("ul", { className: "flex flex-col", children: node.children.map((child) => renderNode(child, depth + 1)) })
+    ] }, node.id);
+  };
+  return /* @__PURE__ */ jsx("div", { ref, className: cn("w-full", className), ...props, children: /* @__PURE__ */ jsx("ul", { className: "flex flex-col", children: nodes.map((node) => renderNode(node, 0)) }) });
+});
+FolderTree.displayName = "FolderTree";
+function renderAction(action) {
+  return /* @__PURE__ */ jsxs(DropdownMenuItem, { onSelect: action.onSelect, children: [
+    action.icon && /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "text-fg-3 [&_svg]:size-4", children: action.icon }),
+    /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 flex-col", children: [
+      /* @__PURE__ */ jsx("span", { className: "truncate", children: action.label }),
+      action.description && /* @__PURE__ */ jsx("span", { className: "text-fg-3 truncate text-xs", children: action.description })
+    ] }),
+    action.shortcut && /* @__PURE__ */ jsx(DropdownMenuShortcut, { children: action.shortcut })
+  ] }, action.id);
+}
+var NewMenu = forwardRef(function NewMenu2({ actions, groups, triggerLabel = "New", trigger, align = "end" }, ref) {
+  const sections = groups ?? (actions ? [{ actions }] : []);
+  return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: trigger ?? /* @__PURE__ */ jsxs(Button, { ref, iconLeft: /* @__PURE__ */ jsx(PlusIcon, {}), children: [
+      triggerLabel,
+      /* @__PURE__ */ jsx(ChevronDownIcon, { className: "size-4 opacity-70" })
+    ] }) }),
+    /* @__PURE__ */ jsx(DropdownMenuContent, { align, className: "w-60", children: sections.map((section, i) => /* @__PURE__ */ jsxs("div", { children: [
+      i > 0 && /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+      section.label && /* @__PURE__ */ jsx(DropdownMenuLabel, { children: section.label }),
+      section.actions.map(renderAction)
+    ] }, i)) })
+  ] });
+});
+NewMenu.displayName = "NewMenu";
 var Shell = forwardRef(function Shell2({ className, ...props }, ref) {
   return /* @__PURE__ */ jsx("div", { ref, className: cn("bg-bg flex h-dvh w-full", className), ...props });
 });
@@ -8280,7 +9885,7 @@ var Content16 = forwardRef(function Content17({ padTop, padBottom, className, st
   );
 });
 Content16.displayName = "Content";
-var SidebarContext = React36.createContext(null);
+var SidebarContext = React37.createContext(null);
 var NOOP_CONTEXT = {
   state: "expanded",
   setState: () => {
@@ -8293,7 +9898,7 @@ var NOOP_CONTEXT = {
   }
 };
 function useSidebarState() {
-  return React36.useContext(SidebarContext) ?? NOOP_CONTEXT;
+  return React37.useContext(SidebarContext) ?? NOOP_CONTEXT;
 }
 var DEFAULT_SHORTCUT = "Mod+\\";
 function readStorage(key) {
@@ -8313,16 +9918,16 @@ function SidebarProvider({
   storageKey,
   shortcut = DEFAULT_SHORTCUT
 }) {
-  const [uncontrolled, setUncontrolled] = React36.useState(
+  const [uncontrolled, setUncontrolled] = React37.useState(
     controlled ?? defaultState
   );
-  React36.useEffect(() => {
+  React37.useEffect(() => {
     if (controlled !== void 0) return;
     const stored = readStorage(storageKey);
     if (stored && stored !== uncontrolled) setUncontrolled(stored);
   }, []);
   const state = controlled ?? uncontrolled;
-  const setState = React36.useCallback(
+  const setState = React37.useCallback(
     (next) => {
       if (controlled === void 0) setUncontrolled(next);
       onStateChange?.(next);
@@ -8335,11 +9940,11 @@ function SidebarProvider({
     },
     [controlled, onStateChange, storageKey]
   );
-  const toggle = React36.useCallback(() => {
+  const toggle = React37.useCallback(() => {
     setState(state === "expanded" ? "rail" : "expanded");
   }, [state, setState]);
-  const [peekLockCount, setPeekLockCount] = React36.useState(0);
-  const acquirePeekLock = React36.useCallback(() => {
+  const [peekLockCount, setPeekLockCount] = React37.useState(0);
+  const acquirePeekLock = React37.useCallback(() => {
     setPeekLockCount((n) => n + 1);
     let released = false;
     return () => {
@@ -8348,7 +9953,7 @@ function SidebarProvider({
       setPeekLockCount((n) => Math.max(0, n - 1));
     };
   }, []);
-  React36.useEffect(() => {
+  React37.useEffect(() => {
     if (!shortcut) return;
     const parts = shortcut.split("+");
     const key = parts.pop() ?? "";
@@ -8368,7 +9973,7 @@ function SidebarProvider({
     window.addEventListener("keydown", onKey);
     return () => window.removeEventListener("keydown", onKey);
   }, [shortcut, toggle]);
-  const value = React36.useMemo(
+  const value = React37.useMemo(
     () => ({ state, setState, toggle, collapsible: true, peekLockCount, acquirePeekLock }),
     [state, setState, toggle, peekLockCount, acquirePeekLock]
   );
@@ -8377,15 +9982,15 @@ function SidebarProvider({
 SidebarProvider.displayName = "SidebarProvider";
 var PEEK_ENTER_DELAY_MS = 100;
 var PEEK_LEAVE_DELAY_MS = 200;
-var Sidebar = React36.forwardRef(function Sidebar2({ className, collapsible = false, variant = "classic", onMouseEnter, onMouseLeave, style, ...props }, ref) {
+var Sidebar = React37.forwardRef(function Sidebar2({ className, collapsible = false, variant = "classic", onMouseEnter, onMouseLeave, style, ...props }, ref) {
   const isFloating = variant === "floating";
-  const ctx = React36.useContext(SidebarContext);
+  const ctx = React37.useContext(SidebarContext);
   const state = collapsible && ctx ? ctx.state : "expanded";
   const peekLockCount = collapsible && ctx ? ctx.peekLockCount : 0;
-  const [peek, setPeek] = React36.useState(false);
-  const enterTimer = React36.useRef(null);
-  const leaveTimer = React36.useRef(null);
-  const clearTimers = React36.useCallback(() => {
+  const [peek, setPeek] = React37.useState(false);
+  const enterTimer = React37.useRef(null);
+  const leaveTimer = React37.useRef(null);
+  const clearTimers = React37.useCallback(() => {
     if (enterTimer.current != null) {
       window.clearTimeout(enterTimer.current);
       enterTimer.current = null;
@@ -8395,8 +10000,8 @@ var Sidebar = React36.forwardRef(function Sidebar2({ className, collapsible = fa
       leaveTimer.current = null;
     }
   }, []);
-  React36.useEffect(() => () => clearTimers(), [clearTimers]);
-  React36.useEffect(() => {
+  React37.useEffect(() => () => clearTimers(), [clearTimers]);
+  React37.useEffect(() => {
     if (state === "expanded") {
       clearTimers();
       setPeek(false);
@@ -8477,7 +10082,7 @@ var Sidebar = React36.forwardRef(function Sidebar2({ className, collapsible = fa
   );
 });
 Sidebar.displayName = "Sidebar";
-var SidebarTrigger = React36.forwardRef(
+var SidebarTrigger = React37.forwardRef(
   function SidebarTrigger2({
     className,
     expandLabel = "Expand sidebar",
@@ -8485,7 +10090,7 @@ var SidebarTrigger = React36.forwardRef(
     onClick,
     ...props
   }, ref) {
-    const ctx = React36.useContext(SidebarContext);
+    const ctx = React37.useContext(SidebarContext);
     if (!ctx) return null;
     const { state, toggle } = ctx;
     const label = state === "expanded" ? collapseLabel : expandLabel;
@@ -8516,14 +10121,14 @@ var SidebarTrigger = React36.forwardRef(
 );
 SidebarTrigger.displayName = "SidebarTrigger";
 function useSidebarPeekLock(active) {
-  const ctx = React36.useContext(SidebarContext);
-  React36.useEffect(() => {
+  const ctx = React37.useContext(SidebarContext);
+  React37.useEffect(() => {
     if (!active || !ctx) return;
     const release = ctx.acquirePeekLock();
     return release;
   }, [active, ctx]);
 }
-var SidebarPinButton = React36.forwardRef(
+var SidebarPinButton = React37.forwardRef(
   function SidebarPinButton2({
     pinLabel = "Pin sidebar",
     unpinLabel = "Unpin sidebar",
@@ -8531,7 +10136,7 @@ var SidebarPinButton = React36.forwardRef(
     onClick,
     ...props
   }, ref) {
-    const ctx = React36.useContext(SidebarContext);
+    const ctx = React37.useContext(SidebarContext);
     if (!ctx || !ctx.collapsible) return null;
     const { state, setState } = ctx;
     const isPinned = state === "expanded";
@@ -8596,7 +10201,7 @@ function PinGlyph({
     }
   );
 }
-var SidebarBrand = React36.forwardRef(
+var SidebarBrand = React37.forwardRef(
   function SidebarBrand2({ className, ...props }, ref) {
     return /* @__PURE__ */ jsx(
       "div",
@@ -8612,7 +10217,7 @@ var SidebarBrand = React36.forwardRef(
   }
 );
 SidebarBrand.displayName = "SidebarBrand";
-var SidebarBrandText = React36.forwardRef(
+var SidebarBrandText = React37.forwardRef(
   function SidebarBrandText2({ className, ...props }, ref) {
     return /* @__PURE__ */ jsx(
       "span",
@@ -8637,16 +10242,16 @@ var SidebarBrandText = React36.forwardRef(
   }
 );
 SidebarBrandText.displayName = "SidebarBrandText";
-var SidebarGroupScopeContext = React36.createContext(null);
-var SidebarSection = React36.forwardRef(
+var SidebarGroupScopeContext = React37.createContext(null);
+var SidebarSection = React37.forwardRef(
   function SidebarSection2({ label, tone = "pro", className, children, ...props }, ref) {
     const ariaLabel = typeof label === "string" ? label : typeof label === "number" ? String(label) : void 0;
-    const [exclusiveId, setExclusiveIdState] = React36.useState(null);
-    const setExclusive = React36.useCallback(
+    const [exclusiveId, setExclusiveIdState] = React37.useState(null);
+    const setExclusive = React37.useCallback(
       (id) => setExclusiveIdState(id),
       []
     );
-    const scope = React36.useMemo(
+    const scope = React37.useMemo(
       () => ({ exclusiveId, setExclusive }),
       [exclusiveId, setExclusive]
     );
@@ -8699,12 +10304,12 @@ function getTextContent(node) {
   if (node == null || typeof node === "boolean") return "";
   if (typeof node === "string" || typeof node === "number") return String(node);
   if (Array.isArray(node)) return node.map(getTextContent).filter(Boolean).join(" ");
-  if (React36.isValidElement(node)) {
+  if (React37.isValidElement(node)) {
     return getTextContent(node.props.children);
   }
   return "";
 }
-var SidebarLink = React36.forwardRef(
+var SidebarLink = React37.forwardRef(
   function SidebarLink2({ href, icon, active = false, asChild, className, children, "aria-label": ariaLabel, ...props }, ref) {
     const Comp = asChild ? Slot : "a";
     const accessibleLabel = ariaLabel ?? (asChild ? void 0 : getTextContent(children) || void 0);
@@ -8775,7 +10380,7 @@ var SidebarLink = React36.forwardRef(
   }
 );
 SidebarLink.displayName = "SidebarLink";
-var SidebarLinkLabel = React36.forwardRef(
+var SidebarLinkLabel = React37.forwardRef(
   function SidebarLinkLabel2({ className, ...props }, ref) {
     return /* @__PURE__ */ jsx(
       "span",
@@ -8800,7 +10405,7 @@ var SidebarLinkLabel = React36.forwardRef(
   }
 );
 SidebarLinkLabel.displayName = "SidebarLinkLabel";
-var SidebarLinkAction = React36.forwardRef(
+var SidebarLinkAction = React37.forwardRef(
   function SidebarLinkAction2({ className, ...props }, ref) {
     return /* @__PURE__ */ jsx(
       "span",
@@ -8832,13 +10437,13 @@ var sidebarLinkBadgeVariants = cva(
     defaultVariants: { tone: "default" }
   }
 );
-var SidebarLinkBadge = React36.forwardRef(
+var SidebarLinkBadge = React37.forwardRef(
   function SidebarLinkBadge2({ tone, className, ...props }, ref) {
     return /* @__PURE__ */ jsx("span", { ref, className: cn(sidebarLinkBadgeVariants({ tone }), className), ...props });
   }
 );
 SidebarLinkBadge.displayName = "SidebarLinkBadge";
-var SidebarLinkGroup = React36.forwardRef(
+var SidebarLinkGroup = React37.forwardRef(
   function SidebarLinkGroup2({
     id: idProp,
     icon,
@@ -8853,19 +10458,19 @@ var SidebarLinkGroup = React36.forwardRef(
     children,
     ...props
   }, ref) {
-    const reactId = React36.useId();
+    const reactId = React37.useId();
     const id = idProp ?? reactId;
-    const scope = React36.useContext(SidebarGroupScopeContext);
-    const [uncontrolledOpen, setUncontrolledOpen] = React36.useState(defaultOpen);
+    const scope = React37.useContext(SidebarGroupScopeContext);
+    const [uncontrolledOpen, setUncontrolledOpen] = React37.useState(defaultOpen);
     const open = controlled ?? uncontrolledOpen;
-    const setOpen = React36.useCallback(
+    const setOpen = React37.useCallback(
       (next) => {
         if (controlled === void 0) setUncontrolledOpen(next);
         onOpenChange?.(next);
       },
       [controlled, onOpenChange]
     );
-    React36.useEffect(() => {
+    React37.useEffect(() => {
       if (scope?.exclusiveId && scope.exclusiveId !== id && open) {
         setOpen(false);
       }
@@ -8974,7 +10579,7 @@ var SidebarLinkGroup = React36.forwardRef(
   }
 );
 SidebarLinkGroup.displayName = "SidebarLinkGroup";
-var SidebarFooter = React36.forwardRef(
+var SidebarFooter = React37.forwardRef(
   function SidebarFooter2({ className, ...props }, ref) {
     return /* @__PURE__ */ jsx(
       "div",
@@ -8991,7 +10596,7 @@ var SidebarFooter = React36.forwardRef(
   }
 );
 SidebarFooter.displayName = "SidebarFooter";
-var SidebarUser = React36.forwardRef(function SidebarUser2({ name, subtitle, avatarSrc, className, ...props }, ref) {
+var SidebarUser = React37.forwardRef(function SidebarUser2({ name, subtitle, avatarSrc, className, ...props }, ref) {
   return /* @__PURE__ */ jsxs("div", { ref, className: cn("flex min-w-0 items-center gap-2.5", className), ...props, children: [
     /* @__PURE__ */ jsx(Avatar, { size: "sm", variant: "branded", name, src: avatarSrc ?? void 0 }),
     /* @__PURE__ */ jsxs(
@@ -9012,7 +10617,7 @@ var SidebarUser = React36.forwardRef(function SidebarUser2({ name, subtitle, ava
   ] });
 });
 SidebarUser.displayName = "SidebarUser";
-var SidebarBrandSwitcher = React36.forwardRef(
+var SidebarBrandSwitcher = React37.forwardRef(
   function SidebarBrandSwitcher2({
     brand,
     label,
@@ -9030,7 +10635,7 @@ var SidebarBrandSwitcher = React36.forwardRef(
     contentClassName,
     trailing
   }, ref) {
-    const [open, setOpen] = React36.useState(false);
+    const [open, setOpen] = React37.useState(false);
     useSidebarPeekLock(open);
     const others = items.filter((p) => p.id !== current.id);
     return (
@@ -9150,7 +10755,7 @@ function SidebarBrandSwitcherOtherRow({
   unavailableBadge
 }) {
   const reachable = item.available !== false;
-  const [launching, setLaunching] = React36.useState(false);
+  const [launching, setLaunching] = React37.useState(false);
   const handleSelect = async () => {
     if (!reachable || launching || !onLaunch) return;
     setLaunching(true);
@@ -9559,14 +11164,14 @@ var DataTable = forwardRef(function DataTable2({ withToolbar, className, childre
     "div",
     {
       ref,
+      "data-with-toolbar": withToolbar ? "true" : void 0,
       className: cn(
-        "w-full",
-        // Surface card chrome on the descendant `<table>`.
+        // Outer frame on the whole component: a single visible border +
+        // quiet shadow wrapping the toolbar (if any) and the table as one
+        // card. overflow-hidden clips the header/cell backgrounds to the
+        // rounded corners.
+        "w-full overflow-hidden rounded-card border border-rule-strong bg-surface shadow-quiet",
         "[&_table]:bg-surface [&_table]:w-full [&_table]:border-collapse",
-        "[&_table]:border-rule [&_table]:border",
-        withToolbar ? "[&_table]:rounded-b-card [&_table]:border-t-0" : "[&_table]:rounded-card",
-        // Clip cell backgrounds at the rounded corners.
-        "[&_table]:overflow-hidden",
         className
       ),
       ...props,
@@ -9583,7 +11188,7 @@ var DataTableToolbar = forwardRef(
         ref,
         className: cn(
           "flex items-center gap-2 px-3 py-2.5",
-          "rounded-t-card border-rule bg-surface border",
+          "border-rule bg-surface border-b",
           className
         ),
         ...props
@@ -9621,7 +11226,7 @@ var DataTableResultsCount = forwardRef(
       "span",
       {
         ref,
-        className: cn("text-fg-4 mr-1 font-mono text-[11px] tabular-nums", className),
+        className: cn("text-fg-4 mr-1 font-sans text-[11px] tabular-nums", className),
         ...props,
         children: [
           current.toLocaleString(),
@@ -9706,9 +11311,9 @@ var DataTableHeader = forwardRef(
         scope: "col",
         "aria-sort": ariaSort,
         className: cn(
-          "h-9 px-3.5 py-2 text-left align-middle whitespace-nowrap",
-          "font-mono text-[10px] font-medium tracking-[0.12em] uppercase",
-          "text-fg-4 bg-surface-2",
+          "h-11 px-4 py-2.5 text-left align-middle whitespace-nowrap",
+          "font-sans text-[14px] font-medium tracking-normal normal-case",
+          "text-fg-3 bg-surface-2",
           "border-rule border-b",
           "[&:has([role=checkbox])]:pr-0",
           className
@@ -9721,9 +11326,9 @@ var DataTableHeader = forwardRef(
             onClick: handleClick,
             className: cn(
               "-mx-1 -my-1 inline-flex items-center gap-1 rounded-[4px] px-1 py-1",
-              "font-mono text-[10px] font-medium tracking-[0.12em] uppercase",
-              "text-fg-4 transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] motion-reduce:transition-none",
-              "hover:text-fg-2",
+              "font-sans text-[14px] font-medium tracking-normal normal-case",
+              "text-fg-3 transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out-quart)] motion-reduce:transition-none",
+              "hover:text-fg",
               "focus-visible:[box-shadow:var(--shadow-focus-ring)] focus-visible:outline-none"
             ),
             children: [
@@ -9737,7 +11342,7 @@ var DataTableHeader = forwardRef(
   }
 );
 DataTableHeader.displayName = "DataTableHeader";
-var cellBase = "px-3.5 py-2.5 align-middle";
+var cellBase = "px-4 py-3 align-middle";
 var DataTableCell = forwardRef(
   function DataTableCell2({ className, ...props }, ref) {
     return /* @__PURE__ */ jsx(
@@ -9775,7 +11380,7 @@ var DataTableCellMono = forwardRef(
       "td",
       {
         ref,
-        className: cn(cellBase, "font-spec text-fg-2 text-[12.5px]", className),
+        className: cn(cellBase, "font-sans text-fg-2 text-[13px] tabular-nums", className),
         style,
         ...props
       }
@@ -9789,7 +11394,7 @@ var DataTableCellId = forwardRef(
       "td",
       {
         ref,
-        className: cn(cellBase, "font-spec text-fg-4 text-xs", className),
+        className: cn(cellBase, "font-sans text-fg-4 text-xs tabular-nums", className),
         style,
         ...props
       }
@@ -9814,7 +11419,7 @@ var DataTableCellDue = forwardRef(
       {
         ref,
         "data-due-state": ariaState,
-        className: cn(cellBase, "font-spec text-[12.5px]", tone, className),
+        className: cn(cellBase, "font-sans text-[13px] tabular-nums", tone, className),
         style,
         ...props,
         children: children ?? dueDateFormatter.format(value)
@@ -9840,8 +11445,8 @@ var DataTableCheckbox = forwardRef(
       {
         ref,
         className: cn(
-          "w-8 px-3.5 py-2.5 pr-0 align-middle",
-          asHeader && "bg-surface-2 border-rule h-9 border-b",
+          "w-8 px-4 py-3 pr-0 align-middle",
+          asHeader && "bg-surface-2 border-rule h-11 border-b",
           className
         ),
         ...props,
@@ -11067,7 +12672,7 @@ var FilterChip = forwardRef(function FilterChip2({ active = false, size, count,
   );
 });
 FilterChip.displayName = "FilterChip";
-var BulkActionBarContext = React36.createContext({ tone: "surface" });
+var BulkActionBarContext = React37.createContext({ tone: "surface" });
 function actionClasses(tone, destructive) {
   const base = cn(
     "inline-flex h-8 items-center gap-1.5 rounded-btn px-3 text-[13px] font-medium",
@@ -11090,8 +12695,8 @@ function actionClasses(tone, destructive) {
     destructive ? "text-control-destructive-fg hover:bg-control-destructive-hover-bg" : "text-control-fg hover:bg-control-hover-bg hover:text-control-hover-fg"
   );
 }
-var BulkActionBarAction = React36.forwardRef(function BulkActionBarAction2({ asChild = false, destructive, className, type, ...props }, ref) {
-  const { tone } = React36.use(BulkActionBarContext);
+var BulkActionBarAction = React37.forwardRef(function BulkActionBarAction2({ asChild = false, destructive, className, type, ...props }, ref) {
+  const { tone } = React37.use(BulkActionBarContext);
   const Comp = asChild ? Slot : "button";
   return /* @__PURE__ */ jsx(
     Comp,
@@ -11105,7 +12710,7 @@ var BulkActionBarAction = React36.forwardRef(function BulkActionBarAction2({ asC
 });
 BulkActionBarAction.displayName = "BulkActionBarAction";
 function BulkActionBarSeparator({ className }) {
-  const { tone } = React36.use(BulkActionBarContext);
+  const { tone } = React37.use(BulkActionBarContext);
   return /* @__PURE__ */ jsx(
     "span",
     {
@@ -11305,6 +12910,6 @@ var KbdHint = forwardRef(function KbdHint2({ className, children, ...props }, re
 });
 KbdHint.displayName = "KbdHint";
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, ActivityEventItem, ActivityItem, ActivityList, Alert, AlertCircleIcon, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AlertTriangleIcon, AlertTriangleSolidIcon, AppHeader, AppHeaderActions, AppHeaderBreadcrumb, AppHeaderSearch, AppHeaderTitle, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowRightSmallIcon, ArrowUpIcon, AspectRatio, AssureAuditBrandIcon, AssureBooksBrandIcon, AssureProBrandIcon, AssureTaxBrandIcon, AtSignIcon, Avatar, Badge, BarChartIcon, BellIcon, Blockquote, BoldIcon, Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, BriefcaseIcon, Building2Icon, BuildingIcon, BulkActionBar, BulkActionBarAction, BulkActionBarSeparator, Button, COUNTRY_CODES, Calendar, CalendarIcon, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ChatBubbleIcon, CheckCircle2Icon, CheckCircleSolidIcon, CheckIcon, Checkbox, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsUpDownIcon, CircleDotIcon, CircleIcon, ClientSelect, ClipboardCheckIcon, ClockIcon, CloseIcon, Collapsible, CollapsibleContent, CollapsibleTrigger, ComingSoon, CommandIcon, CommandPalette, ConfirmActionButton, Content16 as Content, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, CopyButton, CopyIcon, CornerDownLeftIcon, CountryFlag, CountrySelect, CreditCardIcon, DATE_DISPLAY_PLACEHOLDER, DangerAction, DataItem, DataTable, DataTableBody, DataTableCell, DataTableCellDue, DataTableCellId, DataTableCellMono, DataTableCellName, DataTableCheckbox, DataTableHead, DataTableHeader, DataTablePagination, DataTableResultsCount, DataTableRow, DataTableSearch, DataTableSpacer, DataTableToolbar, DatePicker, DateRangePicker, DetailGrid, DetailMain, DetailSpine, DetailSpineHeader, DetailSpineSection, DetailSpineStats, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DismissibleChip, DocumentIcon, DollarSignIcon, DownloadIcon, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, EyeIcon, EyeOffIcon, Eyebrow, FileIcon, FileReturnIcon, FileTextIcon, FileUpload, FilterChip, FilterIcon, FlagIcon, FolderClosedIcon, FolderOpenIcon, FolderPlusIcon, FormError, FormSection, FormSuccess, GlobeIcon, GoogleBrandIcon, HelpCircleIcon, HistoryIcon, HomeIcon, HoverCard, HoverCardContent, HoverCardPortal, HoverCardTrigger, IconAction, InboxIcon, InfoCircleSolidIcon, InfoIcon, Input, ItalicIcon, Kanban, KanbanCard, KanbanColumn, KanbanIcon, KbdHint, KeyIcon, KeyboardShortcutsDialog, KpiCard, Label4 as Label, LayoutDashboardIcon, LayoutGridIcon, LayoutListIcon, LightningIcon, Link2Icon, LinkAction, LinkButton, LinkIcon, ListChecksIcon, ListIcon, ListOrderedIcon, LoaderIcon, LoadingRows, LockIcon, LockKeyholeIcon, LockOpenIcon, LogOutIcon, Logo, MailIcon, Main, MapPinIcon, MenuIcon, MessageBubble, MessageBubbleAction, MessageBubbleTombstone, MessageCircleIcon, MessageCircleWarningIcon, MessageComposer, MetadataGrid, MicrosoftBrandIcon, MinusIcon, MonitorIcon, MoonIcon, MoreHorizontalIcon, MoveIcon, MultiFilterPill, MultiSelectField, MutedSpec, NotificationFilter, NotificationItem, NotificationList, NotificationPanel, NotificationPanelFooter, NotificationPanelHeader, Numeric, OTPInput, PageHeader, PageHeaderSep, PageHeaderSpec, Pagination, PaletteIcon, PanelLeftCloseIcon, PanelLeftIcon, PaperclipIcon, PauseIcon, PenSignIcon, PencilIcon, PhoneCountryInput, PhoneIcon, PhoneInput, PlayIcon, PlusIcon, Popover, PopoverAnchor, PopoverClose, PopoverContent, PopoverPortal, PopoverTrigger, PrimaryAction, PriorityIcon, ProgressBar, ProgressRing, RadioGroup3 as RadioGroup, RadioGroupItem, ReceiptIcon, ReplyIcon, RotateCcwIcon, SaveIcon, ScrollArea, ScrollBar, SearchIcon, SearchInput, SearchSelect, SecondaryAction, Section, SectionHead, SectionHeader, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectRoot, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, SelectableKpiCard, SendIcon, Separator4 as Separator, SettingsIcon, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Shell, ShieldIcon, SideDrawer, Sidebar, SidebarBrand, SidebarBrandSwitcher, SidebarBrandSwitcherTile, SidebarBrandText, SidebarFooter, SidebarLink, SidebarLinkAction, SidebarLinkBadge, SidebarLinkGroup, SidebarLinkLabel, SidebarPinButton, SidebarProvider, SidebarSection, SidebarTrigger, SidebarUser, Skeleton, SkeletonCircle, SkeletonText, SlashIcon, Slider, SmartphoneIcon, SparkleIcon, SparklesIcon, Spinner, StarIcon, StarRating, Stat, StatusIcon, Stepper, StopIcon, StrikethroughIcon, SubmitButton, SunIcon, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableIcon, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, TagIcon, TeamIcon, TeamMemberSelect, Textarea, TimeLogger, TimeLoggerActions, TimeLoggerBillable, TimeLoggerContextRow, TimeLoggerEntry, TimeLoggerEntryList, TimeLoggerField, TimeLoggerFooter, TimeLoggerHeader, TimeLoggerNotes, TimeLoggerTimer, ToastProvider, ToggleGroup, ToggleGroupItem, Toolbar, Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, Trash2Icon, TrashIcon, TrendingDownIcon, TrendingUpIcon, UnderlineIcon, UploadIcon, UserCircleIcon, UserIcon, UsersIcon, VisuallyHidden, WorkflowIcon, XCircleSolidIcon, XIcon, YEAR_DISPLAY_PLACEHOLDER, ZoomInIcon, ZoomOutIcon, alertVariants, applyMask, applyYearMask, badgeVariants, buttonVariants, cardVariants, cn, colors, dateToIso, displayToIso, filterChipVariants, formatClock, formatCurrency, formatDuration, getFlagEmoji, inputVariants, isoToDate, isoToDisplay, isoToYear, labelVariants, parseDuration, parsePhoneForEditing, progressBarVariants, progressRingVariants, radii, reference, searchInputVariants, shadows, sidebarLinkBadgeVariants, spacing, spinnerVariants, starRatingVariants, surfaces, systemTokens, textareaVariants, typography, useSidebarPeekLock, useSidebarState, useStopwatch, useToast, yearToIso };
+export { AIReceiptPanel, Accordion, AccordionContent, AccordionItem, AccordionTrigger, ActivityEventItem, ActivityItem, ActivityList, Alert, AlertCircleIcon, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AlertTriangleIcon, AlertTriangleSolidIcon, AppHeader, AppHeaderActions, AppHeaderBreadcrumb, AppHeaderSearch, AppHeaderTitle, AreaChart, ArrowDownIcon, ArrowLeftIcon, ArrowRightIcon, ArrowRightSmallIcon, ArrowUpIcon, AspectRatio, AssureAuditBrandIcon, AssureBooksBrandIcon, AssureProBrandIcon, AssureTaxBrandIcon, AtSignIcon, AttachmentChip, AttentionItem, Avatar, Badge, BarChartIcon, BellIcon, Blockquote, BoldIcon, BottomNav, Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, BriefcaseIcon, Building2Icon, BuildingIcon, BulkActionBar, BulkActionBarAction, BulkActionBarSeparator, Button, COUNTRY_CODES, Calendar, CalendarIcon, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CategoryDivider, CategoryTag, ChatBubbleIcon, CheckCircle2Icon, CheckCircleSolidIcon, CheckIcon, Checkbox, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsUpDownIcon, CircleDotIcon, CircleIcon, ClientSelect, ClipboardCheckIcon, ClockIcon, CloseIcon, Collapsible, CollapsibleContent, CollapsibleTrigger, ComingSoon, CommandIcon, CommandPalette, ConfirmActionButton, Content16 as Content, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, CopyButton, CopyIcon, CornerDownLeftIcon, CountryFlag, CountrySelect, CreditCardIcon, DATE_DISPLAY_PLACEHOLDER, DangerAction, DashGrid, DataItem, DataTable, DataTableBody, DataTableCell, DataTableCellDue, DataTableCellId, DataTableCellMono, DataTableCellName, DataTableCheckbox, DataTableHead, DataTableHeader, DataTablePagination, DataTableResultsCount, DataTableRow, DataTableSearch, DataTableSpacer, DataTableToolbar, DatePicker, DateRangePicker, DetailGrid, DetailMain, DetailSpine, DetailSpineHeader, DetailSpineSection, DetailSpineStats, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DismissibleChip, DocumentIcon, DollarSignIcon, DonutChart, DownloadIcon, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, EngagementCard, EngagementTimeline, EngagementTimelineStep, EyeIcon, EyeOffIcon, Eyebrow, FileChip, FileIcon, FileReturnIcon, FileTextIcon, FileTypeBadge, FileUpload, FilterChip, FilterIcon, FlagIcon, FolderClosedIcon, FolderOpenIcon, FolderPlusIcon, FolderTree, FolderUpIcon, FormError, FormSection, FormSuccess, GlobeIcon, GoogleBrandIcon, HelpCircleIcon, HistoryIcon, HomeIcon, HoverCard, HoverCardContent, HoverCardPortal, HoverCardTrigger, IconAction, IconTile, InboxIcon, InfoCircleSolidIcon, InfoIcon, Input, ItalicIcon, Kanban, KanbanCard, KanbanColumn, KanbanIcon, KbdHint, KeyIcon, KeyboardShortcutsDialog, KpiCard, Label4 as Label, LandmarkIcon, LayoutDashboardIcon, LayoutGridIcon, LayoutListIcon, LightningIcon, Link2Icon, LinkAction, LinkButton, LinkIcon, ListChecksIcon, ListIcon, ListOrderedIcon, LoaderIcon, LoadingRows, LockIcon, LockKeyholeIcon, LockOpenIcon, LogOutIcon, Logo, MailIcon, Main, MapPinIcon, MasterDetailLayout, MenuIcon, MessageBubble, MessageBubbleAction, MessageBubbleTombstone, MessageCircleIcon, MessageCircleWarningIcon, MessageComposer, MetadataGrid, MicrosoftBrandIcon, MinusIcon, MonitorIcon, MoonIcon, MoreHorizontalIcon, MoveIcon, MultiFilterPill, MultiSelectField, MutedSpec, NewMenu, NotificationFilter, NotificationItem, NotificationList, NotificationPanel, NotificationPanelFooter, NotificationPanelHeader, Numeric, OTPInput, PageHeader, PageHeaderSep, PageHeaderSpec, Pagination, PaletteIcon, PanelLeftCloseIcon, PanelLeftIcon, PaperclipIcon, PauseIcon, PenSignIcon, PenToolIcon, PencilIcon, PhoneCountryInput, PhoneIcon, PhoneInput, PlayIcon, PlusIcon, Popover, PopoverAnchor, PopoverClose, PopoverContent, PopoverPortal, PopoverTrigger, PrimaryAction, PriorityIcon, ProgressBar, ProgressRing, RadioGroup3 as RadioGroup, RadioGroupItem, RankedBars, ReceiptIcon, ReplyIcon, ResponsiveDialog, RotateCcwIcon, RouteTransition, SERVICE_TONES, SaveIcon, ScrollArea, ScrollBar, SearchIcon, SearchInput, SearchSelect, SecondaryAction, Section, SectionHead, SectionHeader, SegmentedProgress, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectRoot, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, SelectableKpiCard, SendIcon, Separator4 as Separator, SettingsIcon, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Shell, ShieldIcon, SideDrawer, Sidebar, SidebarBrand, SidebarBrandSwitcher, SidebarBrandSwitcherTile, SidebarBrandText, SidebarFooter, SidebarLink, SidebarLinkAction, SidebarLinkBadge, SidebarLinkGroup, SidebarLinkLabel, SidebarPinButton, SidebarProvider, SidebarSection, SidebarTrigger, SidebarUser, Skeleton, SkeletonCircle, SkeletonText, SlashIcon, Slider, SmartphoneIcon, SparkleIcon, SparklesIcon, Spinner, StarIcon, StarRating, Stat, StatusDot, StatusIcon, StatusPill, Stepper, StickyActionBar, StopIcon, StrikethroughIcon, SubmitButton, SuiteProgress, SunIcon, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableIcon, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, TagIcon, TeamIcon, TeamMemberSelect, Textarea, TimeLogger, TimeLoggerActions, TimeLoggerBillable, TimeLoggerContextRow, TimeLoggerEntry, TimeLoggerEntryList, TimeLoggerField, TimeLoggerFooter, TimeLoggerHeader, TimeLoggerNotes, TimeLoggerTimer, ToastProvider, ToggleGroup, ToggleGroupItem, Toolbar, Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, Trash2Icon, TrashIcon, TrendingDownIcon, TrendingUpIcon, UnderlineIcon, UploadIcon, UserCircleIcon, UserIcon, UsersIcon, VisuallyHidden, WorkflowIcon, XCircleSolidIcon, XIcon, YEAR_DISPLAY_PLACEHOLDER, ZoomInIcon, ZoomOutIcon, alertVariants, applyMask, applyYearMask, attachmentChipVariants, badgeVariants, buttonVariants, cardVariants, cn, colors, dateToIso, displayToIso, fileTypeBadgeVariants, fileTypeFromName, filterChipVariants, formatClock, formatCurrency, formatDuration, getFlagEmoji, iconTileVariants, inputVariants, isoToDate, isoToDisplay, isoToYear, labelVariants, parseDuration, parsePhoneForEditing, progressBarVariants, progressRingVariants, radii, reference, searchInputVariants, serviceToneLabel, serviceToneStyle, shadows, sidebarLinkBadgeVariants, spacing, spinnerVariants, starRatingVariants, statusDotVariants, suiteProgressFillVariants, surfaces, systemTokens, textareaVariants, typography, useSidebarPeekLock, useSidebarState, useStopwatch, useToast, yearToIso };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map