@trading-game/design-intelligence-layer 1.0.3 → 1.0.5

package/dist/index.cjs

@@ -109,6 +109,7 @@ __export(index_exports, {
   CardTitle: () => CardTitle,
   Carousel: () => Carousel,
   CarouselContent: () => CarouselContent,
+  CarouselDots: () => CarouselDots,
   CarouselItem: () => CarouselItem,
   CarouselNext: () => CarouselNext,
   CarouselPrevious: () => CarouselPrevious,
@@ -251,7 +252,9 @@ __export(index_exports, {
   Numpad: () => Numpad,
   OpenPositionsBlock: () => OpenPositionsBlock,
   Pagination: () => Pagination,
+  PaginationBar: () => PaginationBar,
   PaginationContent: () => PaginationContent,
+  PaginationDots: () => PaginationDots,
   PaginationEllipsis: () => PaginationEllipsis,
   PaginationItem: () => PaginationItem,
   PaginationLink: () => PaginationLink,
@@ -273,6 +276,7 @@ __export(index_exports, {
   ResizablePanelGroup: () => ResizablePanelGroup,
   ResultBlock: () => ResultBlock,
   ResultDialog: () => ResultDialog,
+  ResultSnackbar: () => ResultSnackbar,
   ScrollArea: () => ScrollArea,
   ScrollBar: () => ScrollBar,
   SectionMessage: () => SectionMessage,
@@ -411,7 +415,7 @@ function AccordionTrigger(_a) {
     __spreadProps(__spreadValues({
       "data-slot": "accordion-trigger",
       className: cn(
-        "flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left type-accordion-trigger transition-all outline-none hover:underline focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong disabled:pointer-events-none disabled:opacity-24 [&[data-state=open]>svg]:rotate-180",
+        "flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left type-accordion-trigger transition-all outline-none hover:underline focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong disabled:pointer-events-none disabled:text-text-disabled-default [&[data-state=open]>svg]:rotate-180",
         className
       )
     }, props), {
@@ -487,44 +491,53 @@ function Spinner(_a) {
 // components/ui/button.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
 var buttonVariants = (0, import_class_variance_authority.cva)(
-  "inline-flex shrink-0 items-center justify-center whitespace-nowrap transition-[color,border-color,opacity,box-shadow,transform] outline-none focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong active:opacity-60 disabled:pointer-events-none disabled:opacity-24 aria-invalid:border-border-error-default aria-invalid:ring-ring-error-soft [&_svg]:pointer-events-none [&_svg]:shrink-0 font-display",
+  "inline-flex shrink-0 items-center justify-center whitespace-nowrap transition-[color,border-color,opacity,box-shadow,transform] outline-none focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong active:opacity-60 disabled:pointer-events-none aria-invalid:border-border-error-default aria-invalid:ring-ring-error-soft [&_svg]:pointer-events-none [&_svg]:shrink-0 font-display",
   {
     variants: {
       variant: {
         // Primary brand blue (#2323FF)
-        primary: "bg-background-brand-default text-text-on-brand-static hover:bg-background-brand-hover active:bg-background-brand-pressed active:opacity-100",
+        primary: "bg-background-brand-default text-text-on-brand-static hover:bg-background-brand-hover active:bg-background-brand-pressed active:opacity-100 disabled:[background-image:linear-gradient(var(--background-disabled-default),var(--background-disabled-default))] disabled:text-text-disabled-default",
         // Primary Inverse — white bg + blue text; for use on dark/coloured surfaces
         // On-brand family — for buttons standing on a brand-coloured surface
         // (NOT theme inverses): white pill with primary ink, white outline,
         // white text. All static, because the brand panel is the same in
         // both themes.
-        "primary-on-brand": "bg-background-static-white text-text-brand-default hover:bg-background-static-white-wash",
+        "primary-on-brand": "bg-background-static-white text-text-brand-default hover:bg-background-static-white-wash disabled:bg-(--primitive-white-alpha-24) disabled:text-text-on-brand-disabled-default",
         // Secondary — the design file's white-surface pill: card surface,
-        // hairline border, prominent ink. Hover swaps to the secondary
-        // surface (one lift up), press dims via the shared active state.
-        secondary: "bg-background-primary-surface border border-border-default-default text-text-prominent-default hover:bg-background-secondary-surface",
+        // prominent ink, hover swaps to the secondary surface (one lift up),
+        // press dims via the shared active state.
+        //
+        // The edge is 1.5px on `border-control-default`, not the shared 1px
+        // hairline. The white fill separates from the canvas by only 1.06:1,
+        // so the border — not the fill — is what contains the 16px semibold
+        // label; at 1px on the shared hairline it read as detached from both.
+        // `secondary-on-brand` matches the width and the *subtlety*
+        // (white-alpha-32 = 1.84:1 on brand, against 1.71:1 here) so both
+        // read as the same quiet edge. Its contrast is higher only because it
+        // has no fill behind it — there, the border IS the button.
+        secondary: "bg-background-primary-surface border-[1.5px] border-border-control-default text-text-prominent-default hover:bg-background-secondary-surface disabled:[background-image:linear-gradient(var(--background-disabled-default),var(--background-disabled-default))] disabled:border-border-disabled-default disabled:text-text-disabled-default",
         // Secondary Inverse — white border + white text; for use on dark/coloured surfaces
-        "secondary-on-brand": "bg-transparent border border-background-static-white text-text-on-brand-static hover:bg-(--primitive-white-alpha-8)",
-        tertiary: "bg-transparent text-text-prominent-default hover:bg-background-hover-default",
+        "secondary-on-brand": "bg-transparent border-[1.5px] border-(--primitive-white-alpha-32) text-text-on-brand-static hover:bg-(--primitive-white-alpha-8) disabled:border-(--primitive-white-alpha-16) disabled:text-text-on-brand-disabled-default",
+        tertiary: "bg-transparent text-text-prominent-default hover:bg-background-hover-default disabled:text-text-disabled-default",
         // Tertiary Inverse — transparent + white text/icon; for use on dark/coloured surfaces
-        "tertiary-on-brand": "bg-transparent text-text-on-brand-static hover:bg-(--primitive-white-alpha-8)",
+        "tertiary-on-brand": "bg-transparent text-text-on-brand-static hover:bg-(--primitive-white-alpha-8) disabled:text-text-on-brand-disabled-default",
         // Frosted — the tinted-glass family, one look per surface:
         // `frosted` sits on page surfaces (brand-selected tint + brand ink,
         // hover/pressed via the state-layer glazes stacked over the solid
         // fill); `frosted-on-brand` is the white frost for coloured/art
         // surfaces (hover thickens the frost, press thins it).
-        frosted: "bg-background-brand-selected text-text-brand-selected active:opacity-100 hover:[background-image:linear-gradient(var(--background-hover-default),var(--background-hover-default))] active:[background-image:linear-gradient(var(--background-pressed-default),var(--background-pressed-default))]",
-        "frosted-on-brand": "bg-(--primitive-white-alpha-24) backdrop-blur-md border border-(--primitive-white-alpha-24) text-text-on-brand-static hover:bg-(--primitive-white-alpha-32) active:bg-(--primitive-white-alpha-16) active:opacity-100",
+        frosted: "bg-background-brand-selected text-text-brand-selected active:opacity-100 hover:[background-image:linear-gradient(var(--background-hover-default),var(--background-hover-default))] active:[background-image:linear-gradient(var(--background-pressed-default),var(--background-pressed-default))] disabled:[background-image:linear-gradient(var(--background-disabled-default),var(--background-disabled-default))] disabled:text-text-disabled-default",
+        "frosted-on-brand": "bg-(--primitive-white-alpha-24) backdrop-blur-md text-text-on-brand-static hover:bg-(--primitive-white-alpha-32) active:bg-(--primitive-white-alpha-16) active:opacity-100 disabled:bg-(--primitive-white-alpha-8) disabled:text-text-on-brand-disabled-default",
         /* @deprecated aliases — shimmer became the `shimmer` boolean prop;
            the inverse names became the on-brand family; `glass` became
            `frosted-on-brand`. Deleted at v1.0. */
-        glass: "bg-(--primitive-white-alpha-24) backdrop-blur-md border border-(--primitive-white-alpha-24) text-text-on-brand-static hover:bg-(--primitive-white-alpha-32) active:bg-(--primitive-white-alpha-16) active:opacity-100",
+        glass: "bg-(--primitive-white-alpha-24) backdrop-blur-md border border-(--primitive-white-alpha-24) text-text-on-brand-static hover:bg-(--primitive-white-alpha-32) active:bg-(--primitive-white-alpha-16) active:opacity-100 disabled:bg-(--primitive-white-alpha-8) disabled:text-text-on-brand-disabled-default",
         "primary-shimmer": "relative overflow-hidden bg-background-brand-default text-text-on-brand-static hover:bg-background-brand-hover active:bg-background-brand-pressed active:opacity-100",
         "primary-on-brand-shimmer": "relative overflow-hidden bg-background-static-white text-text-brand-default hover:bg-background-static-white-wash",
         "primary-inverse": "bg-background-static-white text-text-brand-container-static hover:bg-background-static-white-wash",
         "primary-inverse-shimmer": "relative overflow-hidden bg-background-static-white text-text-brand-container-static hover:bg-background-static-white-wash",
         "secondary-inverse": "bg-transparent border border-background-static-white text-text-on-brand-static hover:bg-(--primitive-white-alpha-8)",
-        "tertiary-inverse": "bg-transparent text-text-on-brand-static hover:bg-(--primitive-white-alpha-8)"
+        "tertiary-inverse": "bg-transparent text-text-on-brand-static hover:bg-(--primitive-white-alpha-8) disabled:text-text-on-brand-disabled-default"
       },
       size: {
         // One primitive type step per size (16/14/12) and padding-x = half
@@ -631,16 +644,16 @@ var import_radix_ui3 = require("radix-ui");
 var import_jsx_runtime4 = require("react/jsx-runtime");
 var navigationButtonVariants = (0, import_class_variance_authority2.cva)(
   // Icon-only nav control — circular like every icon button in the system.
-  "inline-flex shrink-0 items-center justify-center rounded-full transition-all duration-fast ease-standard outline-none focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong active:opacity-60 disabled:pointer-events-none disabled:opacity-24 [&_svg]:pointer-events-none [&_svg]:shrink-0",
+  "inline-flex shrink-0 items-center justify-center rounded-full transition-all duration-fast ease-standard outline-none focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong active:opacity-60 disabled:pointer-events-none disabled:[background-image:linear-gradient(var(--background-disabled-default),var(--background-disabled-default))] disabled:text-text-disabled-default [&_svg]:pointer-events-none [&_svg]:shrink-0",
   {
     variants: {
       variant: {
         default: "bg-background-hover-default text-icon-prominent-default hover:bg-background-pressed-default",
         // Frosted circle for art/hero/brand surfaces — same recipe as
         // Button's frosted-on-brand: hover thickens the frost, press thins it.
-        "frosted-on-brand": "bg-(--primitive-white-alpha-24) backdrop-blur-md border border-(--primitive-white-alpha-24) text-text-on-brand-static hover:bg-(--primitive-white-alpha-32) active:bg-(--primitive-white-alpha-16) active:opacity-100",
+        "frosted-on-brand": "bg-(--primitive-white-alpha-24) backdrop-blur-md text-text-on-brand-static hover:bg-(--primitive-white-alpha-32) active:bg-(--primitive-white-alpha-16) active:opacity-100",
         /* @deprecated — renamed to frosted-on-brand. Deleted at v1.0. */
-        glass: "bg-(--primitive-white-alpha-24) backdrop-blur-md border border-(--primitive-white-alpha-24) text-text-on-brand-static hover:bg-(--primitive-white-alpha-32) active:bg-(--primitive-white-alpha-16) active:opacity-100"
+        glass: "bg-(--primitive-white-alpha-24) backdrop-blur-md text-text-on-brand-static hover:bg-(--primitive-white-alpha-32) active:bg-(--primitive-white-alpha-16) active:opacity-100"
       },
       size: {
         lg: "size-12 [&_svg:not([class*='size-'])]:size-6",
@@ -1771,7 +1784,7 @@ function SelectTrigger(_a) {
       "data-readonly": readOnly ? "" : void 0,
       className: cn(
         selectTriggerType[size],
-        "flex w-fit items-center justify-between gap-2 rounded-xs border border-border-default-default bg-background-primary-surface text-text-prominent-default appearance-none whitespace-nowrap transition-[color,box-shadow] outline-none focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-soft disabled:cursor-not-allowed disabled:opacity-24 aria-invalid:border-border-error-default aria-invalid:ring-ring-error-soft data-[placeholder]:text-text-subtle-default data-[size=sm]:h-8 data-[size=sm]:px-3 data-[size=sm]:py-1 data-[size=md]:h-10 data-[size=md]:px-3 data-[size=md]:py-1 data-[size=lg]:h-12 data-[size=lg]:px-4 data-[size=lg]:py-2 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-icon-subtle-default data-[readonly]:cursor-default data-[readonly]:opacity-100",
+        "flex w-fit items-center justify-between gap-2 rounded-xs border border-border-default-default bg-background-primary-surface text-text-prominent-default appearance-none whitespace-nowrap transition-[color,box-shadow] outline-none focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-soft disabled:cursor-not-allowed disabled:text-text-disabled-default disabled:[background-image:linear-gradient(var(--background-disabled-default),var(--background-disabled-default))] aria-invalid:border-border-error-default aria-invalid:ring-ring-error-soft data-[placeholder]:text-text-subtle-default data-[size=sm]:h-8 data-[size=sm]:px-3 data-[size=sm]:py-1 data-[size=md]:h-10 data-[size=md]:px-3 data-[size=md]:py-1 data-[size=lg]:h-12 data-[size=lg]:px-4 data-[size=lg]:py-2 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-icon-subtle-default data-[readonly]:cursor-default data-[readonly]:opacity-100",
         className
       )
     }, props), {
@@ -1870,7 +1883,7 @@ function SelectItem(_a) {
     __spreadProps(__spreadValues({
       "data-slot": "select-item",
       className: cn(
-        "relative flex w-full cursor-default items-center gap-2 type-menu-item rounded-md py-1.5 pr-8 pl-2 outline-hidden select-none focus:bg-background-hover-default focus:text-text-prominent-default data-[state=checked]:text-text-brand-selected data-[disabled]:pointer-events-none data-[disabled]:opacity-24 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-icon-subtle-default *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
+        "relative flex w-full cursor-default items-center gap-2 type-menu-item rounded-md py-1.5 pr-8 pl-2 outline-hidden select-none focus:bg-background-hover-default focus:text-text-prominent-default data-[state=checked]:text-text-brand-selected data-[disabled]:pointer-events-none data-[disabled]:text-text-disabled-default [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-icon-subtle-default *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
         className
       )
     }, props), {
@@ -1991,12 +2004,12 @@ function Calendar(_a) {
         ),
         button_previous: cn(
           buttonVariants({ variant: buttonVariant }),
-          "pointer-events-auto size-(--cell-size) p-0 select-none aria-disabled:opacity-24",
+          "pointer-events-auto size-(--cell-size) p-0 select-none aria-disabled:[background-image:linear-gradient(var(--background-disabled-default),var(--background-disabled-default))] disabled:text-text-disabled-default",
           defaultClassNames.button_previous
         ),
         button_next: cn(
           buttonVariants({ variant: buttonVariant }),
-          "pointer-events-auto size-(--cell-size) p-0 select-none aria-disabled:opacity-24",
+          "pointer-events-auto size-(--cell-size) p-0 select-none aria-disabled:[background-image:linear-gradient(var(--background-disabled-default),var(--background-disabled-default))] disabled:text-text-disabled-default",
           defaultClassNames.button_next
         ),
         month_caption: cn(
@@ -2275,13 +2288,226 @@ function CardFooter(_a) {
 }
 
 // components/ui/carousel.tsx
-var React5 = __toESM(require("react"), 1);
+var React6 = __toESM(require("react"), 1);
 var import_embla_carousel_react = __toESM(require("embla-carousel-react"), 1);
+var import_lucide_react9 = require("lucide-react");
+
+// components/ui/pagination.tsx
+var React5 = __toESM(require("react"), 1);
 var import_lucide_react8 = require("lucide-react");
 var import_jsx_runtime16 = require("react/jsx-runtime");
-var CarouselContext = React5.createContext(null);
+function Pagination(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+    "nav",
+    __spreadValues({
+      role: "navigation",
+      "aria-label": "pagination",
+      "data-slot": "pagination",
+      className: cn("mx-auto flex w-full justify-center", className)
+    }, props)
+  );
+}
+function PaginationContent(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+    "ul",
+    __spreadValues({
+      "data-slot": "pagination-content",
+      className: cn("flex flex-row items-center gap-1", className)
+    }, props)
+  );
+}
+function PaginationItem(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("li", __spreadValues({ "data-slot": "pagination-item" }, props));
+}
+function PaginationLink(_a) {
+  var _b = _a, {
+    className,
+    isActive
+  } = _b, props = __objRest(_b, [
+    "className",
+    "isActive"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+    "a",
+    __spreadValues({
+      "aria-current": isActive ? "page" : void 0,
+      "data-slot": "pagination-link",
+      "data-active": isActive,
+      className: cn(
+        "type-pagination inline-flex shrink-0 items-center justify-center size-10 rounded-full font-display whitespace-nowrap transition-[color,background-color,border-color] outline-none border focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong",
+        isActive ? "bg-background-brand-selected border-border-brand-selected text-text-brand-selected" : "bg-transparent border-transparent text-text-prominent-default hover:bg-background-hover-default",
+        className
+      )
+    }, props)
+  );
+}
+function PaginationPrevious(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Button, { asChild: true, variant: "tertiary", size: "icon-md", className: cn(className), children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("a", __spreadProps(__spreadValues({ "aria-label": "Go to previous page", "data-slot": "pagination-link" }, props), { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_lucide_react8.ChevronLeftIcon, { className: "size-5" }) })) });
+}
+function PaginationNext(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Button, { asChild: true, variant: "tertiary", size: "icon-md", className: cn(className), children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("a", __spreadProps(__spreadValues({ "aria-label": "Go to next page", "data-slot": "pagination-link" }, props), { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_lucide_react8.ChevronRightIcon, { className: "size-5" }) })) });
+}
+function PaginationEllipsis(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+    "span",
+    __spreadProps(__spreadValues({
+      "aria-hidden": true,
+      "data-slot": "pagination-ellipsis",
+      className: cn("flex size-10 items-center justify-center", className)
+    }, props), {
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_lucide_react8.MoreHorizontalIcon, { className: "size-4" }),
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "sr-only", children: "More pages" })
+      ]
+    })
+  );
+}
+var INDICATOR_WIDTHS = {
+  sm: "w-4",
+  md: "w-6",
+  lg: "w-8"
+};
+var ACTIVE_DOT_WIDTHS = {
+  sm: "w-4",
+  md: "w-5",
+  lg: "w-6"
+};
+var DOT_SIZES = {
+  sm: "size-1.5",
+  md: "size-2",
+  lg: "size-2.5"
+};
+function useIndicatorPages(total) {
+  return React5.useMemo(
+    () => Array.from({ length: Math.max(0, total) }, (_, i) => i),
+    [total]
+  );
+}
+function PaginationDots(_a) {
+  var _b = _a, {
+    className,
+    page,
+    total,
+    onPageChange,
+    size = "md",
+    label = "Pagination"
+  } = _b, props = __objRest(_b, [
+    "className",
+    "page",
+    "total",
+    "onPageChange",
+    "size",
+    "label"
+  ]);
+  const pages = useIndicatorPages(total);
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+    "nav",
+    __spreadProps(__spreadValues({
+      role: "navigation",
+      "aria-label": label,
+      "data-slot": "pagination-dots",
+      className: cn("flex items-center justify-center gap-1", className)
+    }, props), {
+      children: pages.map((i) => {
+        const active = i === page;
+        return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+          "button",
+          {
+            type: "button",
+            "data-slot": "pagination-dot",
+            "data-active": active || void 0,
+            "aria-current": active ? "page" : void 0,
+            "aria-label": `Go to page ${i + 1}`,
+            onClick: () => onPageChange == null ? void 0 : onPageChange(i),
+            className: cn(
+              "rounded-full outline-none transition-[width,background-color] duration-base ease-standard",
+              "focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong",
+              active ? cn("h-1.5 bg-background-brand-default", ACTIVE_DOT_WIDTHS[size]) : cn(DOT_SIZES[size], "bg-background-secondary-surface hover:bg-background-brand-selected")
+            )
+          },
+          i
+        );
+      })
+    })
+  );
+}
+function PaginationBar(_a) {
+  var _b = _a, {
+    className,
+    page,
+    total,
+    onPageChange,
+    size = "md",
+    label = "Pagination"
+  } = _b, props = __objRest(_b, [
+    "className",
+    "page",
+    "total",
+    "onPageChange",
+    "size",
+    "label"
+  ]);
+  const pages = useIndicatorPages(total);
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+    "nav",
+    __spreadProps(__spreadValues({
+      role: "navigation",
+      "aria-label": label,
+      "data-slot": "pagination-bar",
+      className: cn("flex items-center justify-center gap-1", className)
+    }, props), {
+      children: pages.map((i) => {
+        const active = i === page;
+        return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+          "button",
+          {
+            type: "button",
+            "data-slot": "pagination-segment",
+            "data-active": active || void 0,
+            "aria-current": active ? "page" : void 0,
+            "aria-label": `Go to page ${i + 1}`,
+            onClick: () => onPageChange == null ? void 0 : onPageChange(i),
+            className: cn(
+              "h-1 rounded-full outline-none transition-colors duration-base ease-standard",
+              INDICATOR_WIDTHS[size],
+              "focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong",
+              active ? "bg-background-brand-default" : "bg-background-secondary-surface hover:bg-background-brand-selected"
+            )
+          },
+          i
+        );
+      })
+    })
+  );
+}
+
+// components/ui/carousel.tsx
+var import_jsx_runtime17 = require("react/jsx-runtime");
+var CarouselContext = React6.createContext(null);
 function useCarousel() {
-  const context = React5.useContext(CarouselContext);
+  const context = React6.useContext(CarouselContext);
   if (!context) {
     throw new Error("useCarousel must be used within a <Carousel />");
   }
@@ -2309,20 +2535,27 @@ function Carousel(_a) {
     }),
     plugins
   );
-  const [canScrollPrev, setCanScrollPrev] = React5.useState(false);
-  const [canScrollNext, setCanScrollNext] = React5.useState(false);
-  const onSelect = React5.useCallback((api2) => {
+  const [canScrollPrev, setCanScrollPrev] = React6.useState(false);
+  const [canScrollNext, setCanScrollNext] = React6.useState(false);
+  const [selectedIndex, setSelectedIndex] = React6.useState(0);
+  const [slideCount, setSlideCount] = React6.useState(0);
+  const onSelect = React6.useCallback((api2) => {
     if (!api2) return;
     setCanScrollPrev(api2.canScrollPrev());
     setCanScrollNext(api2.canScrollNext());
+    setSelectedIndex(api2.selectedScrollSnap());
+    setSlideCount(api2.scrollSnapList().length);
   }, []);
-  const scrollPrev = React5.useCallback(() => {
+  const scrollPrev = React6.useCallback(() => {
     api == null ? void 0 : api.scrollPrev();
   }, [api]);
-  const scrollNext = React5.useCallback(() => {
+  const scrollNext = React6.useCallback(() => {
     api == null ? void 0 : api.scrollNext();
   }, [api]);
-  const handleKeyDown = React5.useCallback(
+  const scrollTo = React6.useCallback((index) => {
+    api == null ? void 0 : api.scrollTo(index);
+  }, [api]);
+  const handleKeyDown = React6.useCallback(
     (event) => {
       if (event.key === "ArrowLeft") {
         event.preventDefault();
@@ -2334,11 +2567,11 @@ function Carousel(_a) {
     },
     [scrollPrev, scrollNext]
   );
-  React5.useEffect(() => {
+  React6.useEffect(() => {
     if (!api || !setApi) return;
     setApi(api);
   }, [api, setApi]);
-  React5.useEffect(() => {
+  React6.useEffect(() => {
     if (!api) return;
     onSelect(api);
     api.on("reInit", onSelect);
@@ -2347,7 +2580,7 @@ function Carousel(_a) {
       api == null ? void 0 : api.off("select", onSelect);
     };
   }, [api, onSelect]);
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
     CarouselContext.Provider,
     {
       value: {
@@ -2358,9 +2591,12 @@ function Carousel(_a) {
         scrollPrev,
         scrollNext,
         canScrollPrev,
-        canScrollNext
+        canScrollNext,
+        selectedIndex,
+        slideCount,
+        scrollTo
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
         "div",
         __spreadProps(__spreadValues({
           onKeyDownCapture: handleKeyDown,
@@ -2378,13 +2614,13 @@ function Carousel(_a) {
 function CarouselContent(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
   const { carouselRef, orientation } = useCarousel();
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
     "div",
     {
       ref: carouselRef,
       className: "overflow-hidden",
       "data-slot": "carousel-content",
-      children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
         "div",
         __spreadValues({
           className: cn(
@@ -2400,7 +2636,7 @@ function CarouselContent(_a) {
 function CarouselItem(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
   const { orientation } = useCarousel();
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
     "div",
     __spreadValues({
       role: "group",
@@ -2425,7 +2661,7 @@ function CarouselPrevious(_a) {
     "size"
   ]);
   const { orientation, scrollPrev, canScrollPrev } = useCarousel();
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
     Button,
     __spreadProps(__spreadValues({
       "data-slot": "carousel-previous",
@@ -2440,8 +2676,8 @@ function CarouselPrevious(_a) {
       onClick: scrollPrev
     }, props), {
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_lucide_react8.ArrowLeft, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "sr-only", children: "Previous slide" })
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_lucide_react9.ArrowLeft, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "sr-only", children: "Previous slide" })
       ]
     })
   );
@@ -2457,7 +2693,7 @@ function CarouselNext(_a) {
     "size"
   ]);
   const { orientation, scrollNext, canScrollNext } = useCarousel();
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
     Button,
     __spreadProps(__spreadValues({
       "data-slot": "carousel-next",
@@ -2472,16 +2708,34 @@ function CarouselNext(_a) {
       onClick: scrollNext
     }, props), {
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_lucide_react8.ArrowRight, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "sr-only", children: "Next slide" })
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_lucide_react9.ArrowRight, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "sr-only", children: "Next slide" })
       ]
     })
   );
 }
+function CarouselDots(_a) {
+  var _b = _a, {
+    variant = "dots"
+  } = _b, props = __objRest(_b, [
+    "variant"
+  ]);
+  const { selectedIndex, slideCount, scrollTo } = useCarousel();
+  const Indicator = variant === "bar" ? PaginationBar : PaginationDots;
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    Indicator,
+    __spreadValues({
+      page: selectedIndex,
+      total: slideCount,
+      onPageChange: scrollTo,
+      label: "Carousel position"
+    }, props)
+  );
+}
 
 // components/ui/chip.tsx
 var import_class_variance_authority5 = require("class-variance-authority");
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 var chipVariants = (0, import_class_variance_authority5.cva)(
   "inline-flex w-fit items-center justify-center rounded-full font-body whitespace-nowrap transition-colors outline-none focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong disabled:pointer-events-none disabled:border disabled:border-border-default-default disabled:bg-transparent disabled:text-text-disabled-default",
   {
@@ -2498,7 +2752,7 @@ var chipVariants = (0, import_class_variance_authority5.cva)(
 );
 function Chip(_a) {
   var _b = _a, { children, selected = false, variant = "default", size, className, disabled } = _b, props = __objRest(_b, ["children", "selected", "variant", "size", "className", "disabled"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
     "button",
     __spreadProps(__spreadValues({
       type: "button",
@@ -2520,30 +2774,30 @@ function Chip(_a) {
 }
 
 // components/ui/checkbox.tsx
-var import_lucide_react9 = require("lucide-react");
+var import_lucide_react10 = require("lucide-react");
 var import_radix_ui11 = require("radix-ui");
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 function Checkbox(_a) {
   var _b = _a, {
     className
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
     import_radix_ui11.Checkbox.Root,
     __spreadProps(__spreadValues({
       "data-slot": "checkbox",
       className: cn(
-        "peer size-4 shrink-0 rounded-2xs border border-border-default-default bg-background-primary-surface transition-colors outline-none focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong disabled:cursor-not-allowed disabled:opacity-24 data-[state=checked]:border-transparent data-[state=checked]:bg-background-brand-default data-[state=checked]:text-text-on-brand-static",
+        "peer size-4 shrink-0 rounded-2xs border border-border-default-default bg-background-primary-surface transition-colors outline-none focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong disabled:cursor-not-allowed disabled:border-border-default-default disabled:text-text-disabled-default data-[state=checked]:border-transparent data-[state=checked]:bg-background-brand-default data-[state=checked]:text-text-on-brand-static",
         className
       )
     }, props), {
-      children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
         import_radix_ui11.Checkbox.Indicator,
         {
           "data-slot": "checkbox-indicator",
           className: "grid place-content-center text-current transition-none",
-          children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react9.CheckIcon, { className: "size-3.5" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_lucide_react10.CheckIcon, { className: "size-3.5" })
         }
       )
     })
@@ -2552,27 +2806,27 @@ function Checkbox(_a) {
 
 // components/ui/command.tsx
 var import_cmdk = require("cmdk");
-var import_lucide_react11 = require("lucide-react");
+var import_lucide_react12 = require("lucide-react");
 
 // components/ui/dialog.tsx
-var import_lucide_react10 = require("lucide-react");
+var import_lucide_react11 = require("lucide-react");
 var import_radix_ui12 = require("radix-ui");
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 function Dialog(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_radix_ui12.Dialog.Root, __spreadValues({ "data-slot": "dialog" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_radix_ui12.Dialog.Root, __spreadValues({ "data-slot": "dialog" }, props));
 }
 function DialogTrigger(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_radix_ui12.Dialog.Trigger, __spreadValues({ "data-slot": "dialog-trigger" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_radix_ui12.Dialog.Trigger, __spreadValues({ "data-slot": "dialog-trigger" }, props));
 }
 function DialogPortal(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_radix_ui12.Dialog.Portal, __spreadValues({ "data-slot": "dialog-portal" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_radix_ui12.Dialog.Portal, __spreadValues({ "data-slot": "dialog-portal" }, props));
 }
 function DialogClose(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_radix_ui12.Dialog.Close, __spreadValues({ "data-slot": "dialog-close" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_radix_ui12.Dialog.Close, __spreadValues({ "data-slot": "dialog-close" }, props));
 }
 function DialogOverlay(_a) {
   var _b = _a, {
@@ -2580,7 +2834,7 @@ function DialogOverlay(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     import_radix_ui12.Dialog.Overlay,
     __spreadValues({
       "data-slot": "dialog-overlay",
@@ -2601,9 +2855,9 @@ function DialogContent(_a) {
     "children",
     "showCloseButton"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(DialogPortal, { "data-slot": "dialog-portal", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(DialogOverlay, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(DialogPortal, { "data-slot": "dialog-portal", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(DialogOverlay, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
       import_radix_ui12.Dialog.Content,
       __spreadProps(__spreadValues({
         "data-slot": "dialog-content",
@@ -2614,14 +2868,14 @@ function DialogContent(_a) {
       }, props), {
         children: [
           children,
-          showCloseButton && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_radix_ui12.Dialog.Close, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+          showCloseButton && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_radix_ui12.Dialog.Close, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
             NavigationButton,
             {
               "data-slot": "dialog-close",
               size: "sm",
               "aria-label": "Close",
               className: "absolute top-4 right-4",
-              children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_lucide_react10.XIcon, { className: "size-4" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react11.XIcon, { className: "size-4" })
             }
           ) })
         ]
@@ -2631,7 +2885,7 @@ function DialogContent(_a) {
 }
 function DialogHeader(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     "div",
     __spreadValues({
       "data-slot": "dialog-header",
@@ -2649,7 +2903,7 @@ function DialogFooter(_a) {
     "showCloseButton",
     "children"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
     "div",
     __spreadProps(__spreadValues({
       "data-slot": "dialog-footer",
@@ -2660,7 +2914,7 @@ function DialogFooter(_a) {
     }, props), {
       children: [
         children,
-        showCloseButton && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_radix_ui12.Dialog.Close, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Button, { variant: "secondary", size: "md", children: "Close" }) })
+        showCloseButton && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_radix_ui12.Dialog.Close, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Button, { variant: "secondary", size: "md", children: "Close" }) })
       ]
     })
   );
@@ -2671,7 +2925,7 @@ function DialogTitle(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     import_radix_ui12.Dialog.Title,
     __spreadValues({
       "data-slot": "dialog-title",
@@ -2685,7 +2939,7 @@ function DialogDescription(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     import_radix_ui12.Dialog.Description,
     __spreadValues({
       "data-slot": "dialog-description",
@@ -2695,14 +2949,14 @@ function DialogDescription(_a) {
 }
 
 // components/ui/command.tsx
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 function Command(_a) {
   var _b = _a, {
     className
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     import_cmdk.Command,
     __spreadValues({
       "data-slot": "command",
@@ -2727,17 +2981,17 @@ function CommandDialog(_a) {
     "className",
     "showCloseButton"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(Dialog, __spreadProps(__spreadValues({}, props), { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(DialogHeader, { className: "sr-only", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(DialogTitle, { children: title }),
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(DialogDescription, { children: description })
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Dialog, __spreadProps(__spreadValues({}, props), { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(DialogHeader, { className: "sr-only", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DialogTitle, { children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DialogDescription, { children: description })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       DialogContent,
       {
         className: cn("overflow-hidden p-0", className),
         showCloseButton,
-        children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Command, { className: "**:data-[slot=command-input-wrapper]:h-12 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-text-subtle-default [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", children })
+        children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Command, { className: "**:data-[slot=command-input-wrapper]:h-12 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-text-subtle-default [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", children })
       }
     )
   ] }));
@@ -2748,19 +3002,19 @@ function CommandInput(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
     "div",
     {
       "data-slot": "command-input-wrapper",
       className: "flex h-9 items-center gap-2 border-b border-border-default-default px-3",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react11.SearchIcon, { className: "size-4 shrink-0 text-icon-subtle-default" }),
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react12.SearchIcon, { className: "size-4 shrink-0 text-icon-subtle-default" }),
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
           import_cmdk.Command.Input,
           __spreadValues({
             "data-slot": "command-input",
             className: cn(
-              "type-menu-item flex h-10 w-full rounded-md bg-transparent py-3 outline-hidden placeholder:text-text-subtle-default disabled:cursor-not-allowed disabled:opacity-24",
+              "type-menu-item flex h-10 w-full rounded-md bg-transparent py-3 outline-hidden placeholder:text-text-subtle-default disabled:cursor-not-allowed disabled:text-text-disabled-default",
               className
             )
           }, props)
@@ -2775,7 +3029,7 @@ function CommandList(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     import_cmdk.Command.List,
     __spreadValues({
       "data-slot": "command-list",
@@ -2788,7 +3042,7 @@ function CommandList(_a) {
 }
 function CommandEmpty(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     import_cmdk.Command.Empty,
     __spreadValues({
       "data-slot": "command-empty",
@@ -2802,7 +3056,7 @@ function CommandGroup(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     import_cmdk.Command.Group,
     __spreadValues({
       "data-slot": "command-group",
@@ -2819,7 +3073,7 @@ function CommandSeparator(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     import_cmdk.Command.Separator,
     __spreadValues({
       "data-slot": "command-separator",
@@ -2833,12 +3087,12 @@ function CommandItem(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     import_cmdk.Command.Item,
     __spreadValues({
       "data-slot": "command-item",
       className: cn(
-        "type-menu-item relative flex cursor-default items-center gap-2 rounded-md px-2 py-1.5 outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-24 data-[selected=true]:bg-background-hover-default data-[selected=true]:text-text-prominent-default [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-icon-subtle-default",
+        "type-menu-item relative flex cursor-default items-center gap-2 rounded-md px-2 py-1.5 outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:text-text-disabled-default data-[selected=true]:bg-background-hover-default data-[selected=true]:text-text-prominent-default [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-icon-subtle-default",
         className
       )
     }, props)
@@ -2850,7 +3104,7 @@ function CommandShortcut(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     "span",
     __spreadValues({
       "data-slot": "command-shortcut",
@@ -2863,32 +3117,32 @@ function CommandShortcut(_a) {
 }
 
 // components/ui/context-menu.tsx
-var import_lucide_react12 = require("lucide-react");
+var import_lucide_react13 = require("lucide-react");
 var import_radix_ui13 = require("radix-ui");
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 function ContextMenu(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_radix_ui13.ContextMenu.Root, __spreadValues({ "data-slot": "context-menu" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_radix_ui13.ContextMenu.Root, __spreadValues({ "data-slot": "context-menu" }, props));
 }
 function ContextMenuTrigger(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_radix_ui13.ContextMenu.Trigger, __spreadValues({ "data-slot": "context-menu-trigger" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_radix_ui13.ContextMenu.Trigger, __spreadValues({ "data-slot": "context-menu-trigger" }, props));
 }
 function ContextMenuGroup(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_radix_ui13.ContextMenu.Group, __spreadValues({ "data-slot": "context-menu-group" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_radix_ui13.ContextMenu.Group, __spreadValues({ "data-slot": "context-menu-group" }, props));
 }
 function ContextMenuPortal(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_radix_ui13.ContextMenu.Portal, __spreadValues({ "data-slot": "context-menu-portal" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_radix_ui13.ContextMenu.Portal, __spreadValues({ "data-slot": "context-menu-portal" }, props));
 }
 function ContextMenuSub(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_radix_ui13.ContextMenu.Sub, __spreadValues({ "data-slot": "context-menu-sub" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_radix_ui13.ContextMenu.Sub, __spreadValues({ "data-slot": "context-menu-sub" }, props));
 }
 function ContextMenuRadioGroup(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     import_radix_ui13.ContextMenu.RadioGroup,
     __spreadValues({
       "data-slot": "context-menu-radio-group"
@@ -2905,7 +3159,7 @@ function ContextMenuSubTrigger(_a) {
     "inset",
     "children"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
     import_radix_ui13.ContextMenu.SubTrigger,
     __spreadProps(__spreadValues({
       "data-slot": "context-menu-sub-trigger",
@@ -2917,7 +3171,7 @@ function ContextMenuSubTrigger(_a) {
     }, props), {
       children: [
         children,
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react12.ChevronRightIcon, { className: "ml-auto" })
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react13.ChevronRightIcon, { className: "ml-auto" })
       ]
     })
   );
@@ -2928,7 +3182,7 @@ function ContextMenuSubContent(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     import_radix_ui13.ContextMenu.SubContent,
     __spreadValues({
       "data-slot": "context-menu-sub-content",
@@ -2945,7 +3199,7 @@ function ContextMenuContent(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_radix_ui13.ContextMenu.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_radix_ui13.ContextMenu.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     import_radix_ui13.ContextMenu.Content,
     __spreadValues({
       "data-slot": "context-menu-content",
@@ -2966,14 +3220,14 @@ function ContextMenuItem(_a) {
     "inset",
     "variant"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     import_radix_ui13.ContextMenu.Item,
     __spreadValues({
       "data-slot": "context-menu-item",
       "data-inset": inset,
       "data-variant": variant,
       className: cn(
-        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md px-2 py-1.5 outline-hidden select-none focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:opacity-24 data-[inset]:pl-8 data-[variant=destructive]:text-text-error-default data-[variant=destructive]:focus:bg-background-error-default data-[variant=destructive]:focus:text-text-error-default [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-icon-subtle-default data-[variant=destructive]:*:[svg]:text-text-error-default!",
+        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md px-2 py-1.5 outline-hidden select-none focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:text-text-disabled-default data-[inset]:pl-8 data-[variant=destructive]:text-text-error-default data-[variant=destructive]:focus:bg-background-error-default data-[variant=destructive]:focus:text-text-error-default [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-icon-subtle-default data-[variant=destructive]:*:[svg]:text-text-error-default!",
         className
       )
     }, props)
@@ -2989,18 +3243,18 @@ function ContextMenuCheckboxItem(_a) {
     "children",
     "checked"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
     import_radix_ui13.ContextMenu.CheckboxItem,
     __spreadProps(__spreadValues({
       "data-slot": "context-menu-checkbox-item",
       className: cn(
-        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md py-1.5 pr-2 pl-8 outline-hidden select-none focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:opacity-24 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md py-1.5 pr-2 pl-8 outline-hidden select-none focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:text-text-disabled-default [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         className
       ),
       checked
     }, props), {
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_radix_ui13.ContextMenu.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react12.CheckIcon, { className: "size-4" }) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_radix_ui13.ContextMenu.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react13.CheckIcon, { className: "size-4" }) }) }),
         children
       ]
     })
@@ -3014,17 +3268,17 @@ function ContextMenuRadioItem(_a) {
     "className",
     "children"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
     import_radix_ui13.ContextMenu.RadioItem,
     __spreadProps(__spreadValues({
       "data-slot": "context-menu-radio-item",
       className: cn(
-        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md py-1.5 pr-2 pl-8 outline-hidden select-none focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:opacity-24 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md py-1.5 pr-2 pl-8 outline-hidden select-none focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:text-text-disabled-default [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         className
       )
     }, props), {
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_radix_ui13.ContextMenu.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react12.CircleIcon, { className: "size-2 fill-current" }) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_radix_ui13.ContextMenu.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react13.CircleIcon, { className: "size-2 fill-current" }) }) }),
         children
       ]
     })
@@ -3038,7 +3292,7 @@ function ContextMenuLabel(_a) {
     "className",
     "inset"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     import_radix_ui13.ContextMenu.Label,
     __spreadValues({
       "data-slot": "context-menu-label",
@@ -3056,7 +3310,7 @@ function ContextMenuSeparator(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     import_radix_ui13.ContextMenu.Separator,
     __spreadValues({
       "data-slot": "context-menu-separator",
@@ -3070,7 +3324,7 @@ function ContextMenuShortcut(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     "span",
     __spreadValues({
       "data-slot": "context-menu-shortcut",
@@ -3084,22 +3338,22 @@ function ContextMenuShortcut(_a) {
 
 // components/ui/drawer.tsx
 var import_vaul = require("vaul");
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 function Drawer(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_vaul.Drawer.Root, __spreadValues({ "data-slot": "drawer" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_vaul.Drawer.Root, __spreadValues({ "data-slot": "drawer" }, props));
 }
 function DrawerTrigger(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_vaul.Drawer.Trigger, __spreadValues({ "data-slot": "drawer-trigger" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_vaul.Drawer.Trigger, __spreadValues({ "data-slot": "drawer-trigger" }, props));
 }
 function DrawerPortal(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_vaul.Drawer.Portal, __spreadValues({ "data-slot": "drawer-portal" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_vaul.Drawer.Portal, __spreadValues({ "data-slot": "drawer-portal" }, props));
 }
 function DrawerClose(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_vaul.Drawer.Close, __spreadValues({ "data-slot": "drawer-close" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_vaul.Drawer.Close, __spreadValues({ "data-slot": "drawer-close" }, props));
 }
 function DrawerOverlay(_a) {
   var _b = _a, {
@@ -3107,7 +3361,7 @@ function DrawerOverlay(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     import_vaul.Drawer.Overlay,
     __spreadValues({
       "data-slot": "drawer-overlay",
@@ -3126,9 +3380,9 @@ function DrawerContent(_a) {
     "className",
     "children"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(DrawerPortal, { "data-slot": "drawer-portal", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DrawerOverlay, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(DrawerPortal, { "data-slot": "drawer-portal", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(DrawerOverlay, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
       import_vaul.Drawer.Content,
       __spreadProps(__spreadValues({
         "data-slot": "drawer-content",
@@ -3142,7 +3396,7 @@ function DrawerContent(_a) {
         )
       }, props), {
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full bg-border-default-default group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full bg-border-default-default group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }),
           children
         ]
       })
@@ -3151,7 +3405,7 @@ function DrawerContent(_a) {
 }
 function DrawerHeader(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "div",
     __spreadValues({
       "data-slot": "drawer-header",
@@ -3164,7 +3418,7 @@ function DrawerHeader(_a) {
 }
 function DrawerFooter(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     "div",
     __spreadValues({
       "data-slot": "drawer-footer",
@@ -3178,7 +3432,7 @@ function DrawerTitle(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     import_vaul.Drawer.Title,
     __spreadValues({
       "data-slot": "drawer-title",
@@ -3192,7 +3446,7 @@ function DrawerDescription(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     import_vaul.Drawer.Description,
     __spreadValues({
       "data-slot": "drawer-description",
@@ -3202,20 +3456,20 @@ function DrawerDescription(_a) {
 }
 
 // components/ui/dropdown-menu.tsx
-var import_lucide_react13 = require("lucide-react");
+var import_lucide_react14 = require("lucide-react");
 var import_radix_ui14 = require("radix-ui");
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 function DropdownMenu(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_radix_ui14.DropdownMenu.Root, __spreadValues({ "data-slot": "dropdown-menu" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_radix_ui14.DropdownMenu.Root, __spreadValues({ "data-slot": "dropdown-menu" }, props));
 }
 function DropdownMenuPortal(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_radix_ui14.DropdownMenu.Portal, __spreadValues({ "data-slot": "dropdown-menu-portal" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_radix_ui14.DropdownMenu.Portal, __spreadValues({ "data-slot": "dropdown-menu-portal" }, props));
 }
 function DropdownMenuTrigger(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     import_radix_ui14.DropdownMenu.Trigger,
     __spreadValues({
       "data-slot": "dropdown-menu-trigger"
@@ -3230,7 +3484,7 @@ function DropdownMenuContent(_a) {
     "className",
     "sideOffset"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_radix_ui14.DropdownMenu.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_radix_ui14.DropdownMenu.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     import_radix_ui14.DropdownMenu.Content,
     __spreadValues({
       "data-slot": "dropdown-menu-content",
@@ -3244,7 +3498,7 @@ function DropdownMenuContent(_a) {
 }
 function DropdownMenuGroup(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_radix_ui14.DropdownMenu.Group, __spreadValues({ "data-slot": "dropdown-menu-group" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_radix_ui14.DropdownMenu.Group, __spreadValues({ "data-slot": "dropdown-menu-group" }, props));
 }
 function DropdownMenuItem(_a) {
   var _b = _a, {
@@ -3256,14 +3510,14 @@ function DropdownMenuItem(_a) {
     "inset",
     "variant"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     import_radix_ui14.DropdownMenu.Item,
     __spreadValues({
       "data-slot": "dropdown-menu-item",
       "data-inset": inset,
       "data-variant": variant,
       className: cn(
-        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md px-2 py-1.5 outline-hidden select-none focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:opacity-24 data-[inset]:pl-8 data-[variant=destructive]:text-text-error-default data-[variant=destructive]:focus:bg-background-error-default data-[variant=destructive]:focus:text-text-error-default [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-icon-subtle-default data-[variant=destructive]:*:[svg]:text-text-error-default!",
+        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md px-2 py-1.5 outline-hidden select-none focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:text-text-disabled-default data-[inset]:pl-8 data-[variant=destructive]:text-text-error-default data-[variant=destructive]:focus:bg-background-error-default data-[variant=destructive]:focus:text-text-error-default [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-icon-subtle-default data-[variant=destructive]:*:[svg]:text-text-error-default!",
         className
       )
     }, props)
@@ -3279,18 +3533,18 @@ function DropdownMenuCheckboxItem(_a) {
     "children",
     "checked"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
     import_radix_ui14.DropdownMenu.CheckboxItem,
     __spreadProps(__spreadValues({
       "data-slot": "dropdown-menu-checkbox-item",
       className: cn(
-        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md py-1.5 pr-2 pl-8 outline-hidden select-none focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:opacity-24 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md py-1.5 pr-2 pl-8 outline-hidden select-none focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:text-text-disabled-default [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         className
       ),
       checked
     }, props), {
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_radix_ui14.DropdownMenu.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react13.CheckIcon, { className: "size-4" }) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_radix_ui14.DropdownMenu.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react14.CheckIcon, { className: "size-4" }) }) }),
         children
       ]
     })
@@ -3298,7 +3552,7 @@ function DropdownMenuCheckboxItem(_a) {
 }
 function DropdownMenuRadioGroup(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     import_radix_ui14.DropdownMenu.RadioGroup,
     __spreadValues({
       "data-slot": "dropdown-menu-radio-group"
@@ -3313,17 +3567,17 @@ function DropdownMenuRadioItem(_a) {
     "className",
     "children"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
     import_radix_ui14.DropdownMenu.RadioItem,
     __spreadProps(__spreadValues({
       "data-slot": "dropdown-menu-radio-item",
       className: cn(
-        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md py-1.5 pr-2 pl-8 outline-hidden select-none focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:opacity-24 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md py-1.5 pr-2 pl-8 outline-hidden select-none focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:text-text-disabled-default [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         className
       )
     }, props), {
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_radix_ui14.DropdownMenu.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react13.CircleIcon, { className: "size-2 fill-current" }) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_radix_ui14.DropdownMenu.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react14.CircleIcon, { className: "size-2 fill-current" }) }) }),
         children
       ]
     })
@@ -3337,7 +3591,7 @@ function DropdownMenuLabel(_a) {
     "className",
     "inset"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     import_radix_ui14.DropdownMenu.Label,
     __spreadValues({
       "data-slot": "dropdown-menu-label",
@@ -3355,7 +3609,7 @@ function DropdownMenuSeparator(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     import_radix_ui14.DropdownMenu.Separator,
     __spreadValues({
       "data-slot": "dropdown-menu-separator",
@@ -3369,7 +3623,7 @@ function DropdownMenuShortcut(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     "span",
     __spreadValues({
       "data-slot": "dropdown-menu-shortcut",
@@ -3382,7 +3636,7 @@ function DropdownMenuShortcut(_a) {
 }
 function DropdownMenuSub(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_radix_ui14.DropdownMenu.Sub, __spreadValues({ "data-slot": "dropdown-menu-sub" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_radix_ui14.DropdownMenu.Sub, __spreadValues({ "data-slot": "dropdown-menu-sub" }, props));
 }
 function DropdownMenuSubTrigger(_a) {
   var _b = _a, {
@@ -3394,7 +3648,7 @@ function DropdownMenuSubTrigger(_a) {
     "inset",
     "children"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
     import_radix_ui14.DropdownMenu.SubTrigger,
     __spreadProps(__spreadValues({
       "data-slot": "dropdown-menu-sub-trigger",
@@ -3406,7 +3660,7 @@ function DropdownMenuSubTrigger(_a) {
     }, props), {
       children: [
         children,
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react13.ChevronRightIcon, { className: "ml-auto size-4" })
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react14.ChevronRightIcon, { className: "ml-auto size-4" })
       ]
     })
   );
@@ -3417,7 +3671,7 @@ function DropdownMenuSubContent(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     import_radix_ui14.DropdownMenu.SubContent,
     __spreadValues({
       "data-slot": "dropdown-menu-sub-content",
@@ -3431,10 +3685,10 @@ function DropdownMenuSubContent(_a) {
 
 // components/ui/empty.tsx
 var import_class_variance_authority6 = require("class-variance-authority");
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 function Empty(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     "div",
     __spreadValues({
       "data-slot": "empty",
@@ -3447,7 +3701,7 @@ function Empty(_a) {
 }
 function EmptyHeader(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     "div",
     __spreadValues({
       "data-slot": "empty-header",
@@ -3480,7 +3734,7 @@ function EmptyMedia(_a) {
     "className",
     "variant"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     "div",
     __spreadValues({
       "data-slot": "empty-icon",
@@ -3491,7 +3745,7 @@ function EmptyMedia(_a) {
 }
 function EmptyTitle(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     "div",
     __spreadValues({
       "data-slot": "empty-title",
@@ -3501,7 +3755,7 @@ function EmptyTitle(_a) {
 }
 function EmptyDescription(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     "div",
     __spreadValues({
       "data-slot": "empty-description",
@@ -3514,7 +3768,7 @@ function EmptyDescription(_a) {
 }
 function EmptyContent(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
     "div",
     __spreadValues({
       "data-slot": "empty-content",
@@ -3527,27 +3781,27 @@ function EmptyContent(_a) {
 }
 
 // components/ui/field.tsx
-var React6 = __toESM(require("react"), 1);
+var React7 = __toESM(require("react"), 1);
 var import_react = require("react");
 var import_class_variance_authority7 = require("class-variance-authority");
 
 // components/ui/label.tsx
 var import_radix_ui15 = require("radix-ui");
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 function Label(_a) {
   var _b = _a, {
     className
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     import_radix_ui15.Label.Root,
     __spreadValues({
       "data-slot": "label",
       className: cn(
         // Colour is inherited on purpose: a Field marked data-invalid paints its
         // subtree error-red, and the label follows.
-        "type-label flex items-center gap-2 select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-24 peer-disabled:cursor-not-allowed peer-disabled:opacity-24",
+        "type-label flex items-center gap-2 select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:text-text-disabled-default peer-disabled:cursor-not-allowed peer-disabled:text-text-disabled-default",
         className
       )
     }, props)
@@ -3556,7 +3810,7 @@ function Label(_a) {
 
 // components/ui/separator.tsx
 var import_radix_ui16 = require("radix-ui");
-var import_jsx_runtime26 = require("react/jsx-runtime");
+var import_jsx_runtime27 = require("react/jsx-runtime");
 function Separator(_a) {
   var _b = _a, {
     className,
@@ -3567,7 +3821,7 @@ function Separator(_a) {
     "orientation",
     "decorative"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
     import_radix_ui16.Separator.Root,
     __spreadValues({
       "data-slot": "separator",
@@ -3582,10 +3836,10 @@ function Separator(_a) {
 }
 
 // components/ui/field.tsx
-var import_jsx_runtime27 = require("react/jsx-runtime");
-var FieldSizeContext = React6.createContext("md");
+var import_jsx_runtime28 = require("react/jsx-runtime");
+var FieldSizeContext = React7.createContext("md");
 function useFieldSize() {
-  return React6.useContext(FieldSizeContext);
+  return React7.useContext(FieldSizeContext);
 }
 var fieldLabelType = {
   sm: "type-field-label-sm",
@@ -3594,7 +3848,7 @@ var fieldLabelType = {
 };
 function FieldSet(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
     "fieldset",
     __spreadValues({
       "data-slot": "field-set",
@@ -3614,7 +3868,7 @@ function FieldLegend(_a) {
     "className",
     "variant"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
     "legend",
     __spreadValues({
       "data-slot": "field-legend",
@@ -3631,7 +3885,7 @@ function FieldLegend(_a) {
 }
 function FieldGroup(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
     "div",
     __spreadValues({
       "data-slot": "field-group",
@@ -3681,7 +3935,7 @@ function Field(_a) {
     "orientation",
     "size"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(FieldSizeContext.Provider, { value: size != null ? size : "md", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(FieldSizeContext.Provider, { value: size != null ? size : "md", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
     "div",
     __spreadValues({
       role: "group",
@@ -3694,7 +3948,7 @@ function Field(_a) {
 }
 function FieldContent(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
     "div",
     __spreadValues({
       "data-slot": "field-content",
@@ -3712,13 +3966,13 @@ function FieldLabel(_a) {
     "className"
   ]);
   const size = useFieldSize();
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
     Label,
     __spreadValues({
       "data-slot": "field-label",
       className: cn(
         fieldLabelType[size],
-        "group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-24",
+        "group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:text-text-disabled-default",
         "has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border has-[>[data-slot=field]]:border-border-default-default [&>*]:data-[slot=field]:p-4",
         "has-data-[state=checked]:border-border-brand-selected has-data-[state=checked]:bg-background-brand-selected",
         className
@@ -3729,13 +3983,13 @@ function FieldLabel(_a) {
 function FieldTitle(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
   const size = useFieldSize();
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
     "div",
     __spreadValues({
       "data-slot": "field-label",
       className: cn(
         fieldLabelType[size],
-        "flex w-fit items-center gap-2 group-data-[disabled=true]/field:opacity-24",
+        "flex w-fit items-center gap-2 group-data-[disabled=true]/field:text-text-disabled-default",
         className
       )
     }, props)
@@ -3743,7 +3997,7 @@ function FieldTitle(_a) {
 }
 function FieldDescription(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
     "p",
     __spreadValues({
       "data-slot": "field-description",
@@ -3764,7 +4018,7 @@ function FieldSeparator(_a) {
     "children",
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
     "div",
     __spreadProps(__spreadValues({
       "data-slot": "field-separator",
@@ -3775,8 +4029,8 @@ function FieldSeparator(_a) {
       )
     }, props), {
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Separator, { className: "absolute inset-0 top-1/2" }),
-        children && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Separator, { className: "absolute inset-0 top-1/2" }),
+        children && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
           "span",
           {
             className: "relative mx-auto block w-fit bg-background-primary-surface px-2 text-text-subtle-default",
@@ -3812,14 +4066,14 @@ function FieldError(_a) {
     if ((uniqueErrors == null ? void 0 : uniqueErrors.length) == 1) {
       return (_a2 = uniqueErrors[0]) == null ? void 0 : _a2.message;
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: uniqueErrors.map(
-      (error, index) => (error == null ? void 0 : error.message) && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("li", { children: error.message }, index)
+    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: uniqueErrors.map(
+      (error, index) => (error == null ? void 0 : error.message) && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("li", { children: error.message }, index)
     ) });
   }, [children, errors]);
   if (!content) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
     "div",
     __spreadProps(__spreadValues({
       role: "alert",
@@ -3833,14 +4087,14 @@ function FieldError(_a) {
 
 // components/ui/hover-card.tsx
 var import_radix_ui17 = require("radix-ui");
-var import_jsx_runtime28 = require("react/jsx-runtime");
+var import_jsx_runtime29 = require("react/jsx-runtime");
 function HoverCard(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_radix_ui17.HoverCard.Root, __spreadValues({ "data-slot": "hover-card" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_radix_ui17.HoverCard.Root, __spreadValues({ "data-slot": "hover-card" }, props));
 }
 function HoverCardTrigger(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_radix_ui17.HoverCard.Trigger, __spreadValues({ "data-slot": "hover-card-trigger" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_radix_ui17.HoverCard.Trigger, __spreadValues({ "data-slot": "hover-card-trigger" }, props));
 }
 function HoverCardContent(_a) {
   var _b = _a, {
@@ -3852,7 +4106,7 @@ function HoverCardContent(_a) {
     "align",
     "sideOffset"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_radix_ui17.HoverCard.Portal, { "data-slot": "hover-card-portal", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_radix_ui17.HoverCard.Portal, { "data-slot": "hover-card-portal", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
     import_radix_ui17.HoverCard.Content,
     __spreadValues({
       "data-slot": "hover-card-content",
@@ -3868,15 +4122,18 @@ function HoverCardContent(_a) {
 
 // components/ui/input.tsx
 var import_class_variance_authority8 = require("class-variance-authority");
-var import_jsx_runtime29 = require("react/jsx-runtime");
+var import_jsx_runtime30 = require("react/jsx-runtime");
 var inputVariants = (0, import_class_variance_authority8.cva)(
   [
     "w-full min-w-0 rounded-xs border font-body transition-[color,box-shadow] outline-none",
     "file:inline-flex file:border-0 file:bg-transparent file:font-medium",
-    "disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-24",
+    "disabled:pointer-events-none disabled:cursor-not-allowed disabled:text-text-disabled-default disabled:[background-image:linear-gradient(var(--background-disabled-default),var(--background-disabled-default))]",
     // Read-only stays focusable and selectable (users copy codes/amounts);
-    // only the surface flattens.
-    "read-only:border-transparent read-only:bg-background-secondary-surface",
+    // only the surface flattens. Matched on the [readonly] attribute, not the
+    // `:read-only` pseudo-class — that also matches disabled inputs, which
+    // would hand disabled the read-only surface and erase the two states'
+    // difference.
+    "[&[readonly]]:border-transparent [&[readonly]]:bg-background-secondary-surface",
     "focus-visible:ring-[3px]",
     "aria-invalid:border-border-error-default aria-invalid:ring-ring-error-soft"
   ].join(" "),
@@ -3897,7 +4154,7 @@ var inputVariants = (0, import_class_variance_authority8.cva)(
         "on-brand": [
           "border-(--primitive-white-alpha-24) bg-(--primitive-black-alpha-32) text-text-on-brand-static",
           "file:text-text-on-brand-static",
-          "placeholder:text-(--primitive-white-alpha-50)",
+          "placeholder:text-text-on-brand-subtle-static",
           "selection:bg-background-static-white selection:text-text-brand-container-static",
           "focus-visible:border-background-static-white focus-visible:ring-(--primitive-white-alpha-40)"
         ].join(" "),
@@ -3905,7 +4162,7 @@ var inputVariants = (0, import_class_variance_authority8.cva)(
         inverse: [
           "border-(--primitive-white-alpha-24) bg-(--primitive-black-alpha-32) text-text-on-brand-static",
           "file:text-text-on-brand-static",
-          "placeholder:text-(--primitive-white-alpha-50)",
+          "placeholder:text-text-on-brand-subtle-static",
           "selection:bg-background-static-white selection:text-text-brand-container-static",
           "focus-visible:border-background-static-white focus-visible:ring-(--primitive-white-alpha-40)"
         ].join(" ")
@@ -3936,7 +4193,7 @@ function Input(_a) {
   ]);
   const fieldSize = useFieldSize();
   const resolvedSize = size != null ? size : fieldSize;
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
     "input",
     __spreadValues({
       type,
@@ -3949,19 +4206,19 @@ function Input(_a) {
 }
 
 // components/ui/input-group.tsx
-var React7 = __toESM(require("react"), 1);
+var React8 = __toESM(require("react"), 1);
 var import_class_variance_authority9 = require("class-variance-authority");
 
 // components/ui/textarea.tsx
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var import_jsx_runtime31 = require("react/jsx-runtime");
 function Textarea(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
     "textarea",
     __spreadValues({
       "data-slot": "textarea",
       className: cn(
-        "type-textarea flex field-sizing-content min-h-16 w-full rounded-xs border border-border-default-default bg-background-primary-surface px-3 py-2 text-text-prominent-default font-body transition-[color,box-shadow] outline-none placeholder:text-text-subtle-default selection:bg-background-brand-default selection:text-text-on-brand-static focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-soft disabled:cursor-not-allowed disabled:opacity-24 aria-invalid:border-border-error-default aria-invalid:ring-ring-error-soft",
+        "type-textarea flex field-sizing-content min-h-16 w-full rounded-xs border border-border-default-default bg-background-primary-surface px-3 py-2 text-text-prominent-default font-body transition-[color,box-shadow] outline-none placeholder:text-text-subtle-default selection:bg-background-brand-default selection:text-text-on-brand-static focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-soft disabled:cursor-not-allowed disabled:text-text-disabled-default disabled:[background-image:linear-gradient(var(--background-disabled-default),var(--background-disabled-default))] aria-invalid:border-border-error-default aria-invalid:ring-ring-error-soft",
         className
       )
     }, props)
@@ -3969,9 +4226,9 @@ function Textarea(_a) {
 }
 
 // components/ui/input-group.tsx
-var import_jsx_runtime31 = require("react/jsx-runtime");
-var InputGroupSizeContext = React7.createContext("md");
-var InputGroupVariantContext = React7.createContext("default");
+var import_jsx_runtime32 = require("react/jsx-runtime");
+var InputGroupSizeContext = React8.createContext("md");
+var InputGroupVariantContext = React8.createContext("default");
 var inputGroupVariants = (0, import_class_variance_authority9.cva)(
   [
     "group/input-group relative flex w-full items-center rounded-xs border",
@@ -4030,11 +4287,11 @@ function InputGroup(_a) {
   ]);
   const fieldSize = useFieldSize();
   const resolvedSize = size != null ? size : fieldSize;
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
     InputGroupVariantContext.Provider,
     {
       value: variant,
-      children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(InputGroupSizeContext.Provider, { value: resolvedSize, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(InputGroupSizeContext.Provider, { value: resolvedSize, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
         "div",
         __spreadValues({
           "data-slot": "input-group",
@@ -4050,10 +4307,15 @@ function InputGroup(_a) {
 var inputGroupAddonVariants = (0, import_class_variance_authority9.cva)(
   [
     "flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-text-subtle-default select-none",
-    // Swap addon text/icon colour when inside an on-brand group.
-    "group-data-[variant=on-brand]/input-group:text-(--primitive-white-alpha-64)",
-    "group-data-[variant=inverse]/input-group:text-(--primitive-white-alpha-64)",
-    "group-data-[disabled=true]/input-group:opacity-24",
+    // Swap addon text/icon colour when inside an on-brand group. On brand the
+    // ink ladder inverts — white down through the alpha rungs — so this is the
+    // semantic subtle rung, not a hand-rolled primitive.
+    "group-data-[variant=on-brand]/input-group:text-text-on-brand-subtle-static",
+    "group-data-[variant=inverse]/input-group:text-text-on-brand-subtle-static",
+    "group-data-[disabled=true]/input-group:has-disabled:text-text-disabled-default",
+    // …but on brand the neutral disabled ink has no contrast, so the on-brand
+    // rung wins there.
+    "group-data-[variant=on-brand]/input-group:group-data-[disabled=true]/input-group:has-disabled:text-text-on-brand-disabled-default",
     "[&>kbd]:rounded-[calc(var(--radius)-5px)]",
     // Text size inherits the group's --input-* ladder (set on the group in CSS).
     "group-data-[size=sm]/input-group:py-1",
@@ -4084,7 +4346,7 @@ function InputGroupAddon(_a) {
     "className",
     "align"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
     "div",
     __spreadValues({
       role: "group",
@@ -4131,7 +4393,7 @@ function InputGroupButton(_a) {
     "variant",
     "size"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
     Button,
     __spreadValues({
       type,
@@ -4144,14 +4406,15 @@ function InputGroupButton(_a) {
 }
 function InputGroupText(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
     "span",
     __spreadValues({
       className: cn(
         "flex items-center gap-2 text-text-subtle-default",
-        // Swap text/icon colour when inside an on-brand group.
-        "group-data-[variant=on-brand]/input-group:text-(--primitive-white-alpha-64)",
-        "group-data-[variant=inverse]/input-group:text-(--primitive-white-alpha-64)",
+        // Swap text/icon colour when inside an on-brand group — the on-brand
+        // subtle rung, not a hand-rolled primitive.
+        "group-data-[variant=on-brand]/input-group:text-text-on-brand-subtle-static",
+        "group-data-[variant=inverse]/input-group:text-text-on-brand-subtle-static",
         // Text size inherits the group's --input-* ladder; icons track it.
         "group-data-[size=sm]/input-group:[&_svg:not([class*='size-'])]:size-3.5",
         "group-data-[size=md]/input-group:[&_svg:not([class*='size-'])]:size-4",
@@ -4172,11 +4435,11 @@ function InputGroupInput(_a) {
     "size",
     "variant"
   ]);
-  const groupSize = React7.useContext(InputGroupSizeContext);
-  const groupVariant = React7.useContext(InputGroupVariantContext);
+  const groupSize = React8.useContext(InputGroupSizeContext);
+  const groupVariant = React8.useContext(InputGroupVariantContext);
   const size = sizeProp != null ? sizeProp : groupSize;
   const variant = variantProp != null ? variantProp : groupVariant;
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
     Input,
     __spreadValues({
       "data-slot": "input-group-control",
@@ -4195,7 +4458,7 @@ function InputGroupTextarea(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
     Textarea,
     __spreadValues({
       "data-slot": "input-group-control",
@@ -4208,10 +4471,10 @@ function InputGroupTextarea(_a) {
 }
 
 // components/ui/input-otp.tsx
-var React8 = __toESM(require("react"), 1);
+var React9 = __toESM(require("react"), 1);
 var import_input_otp = require("input-otp");
-var import_lucide_react14 = require("lucide-react");
-var import_jsx_runtime32 = require("react/jsx-runtime");
+var import_lucide_react15 = require("lucide-react");
+var import_jsx_runtime33 = require("react/jsx-runtime");
 function InputOTP(_a) {
   var _b = _a, {
     className,
@@ -4220,12 +4483,12 @@ function InputOTP(_a) {
     "className",
     "containerClassName"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
     import_input_otp.OTPInput,
     __spreadValues({
       "data-slot": "input-otp",
       containerClassName: cn(
-        "flex items-center gap-2 has-disabled:opacity-24",
+        "flex items-center gap-2 has-disabled:text-text-disabled-default",
         containerClassName
       ),
       className: cn("disabled:cursor-not-allowed", className)
@@ -4234,7 +4497,7 @@ function InputOTP(_a) {
 }
 function InputOTPGroup(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
     "div",
     __spreadValues({
       "data-slot": "input-otp-group",
@@ -4251,9 +4514,9 @@ function InputOTPSlot(_a) {
     "className"
   ]);
   var _a2;
-  const inputOTPContext = React8.useContext(import_input_otp.OTPInputContext);
+  const inputOTPContext = React9.useContext(import_input_otp.OTPInputContext);
   const { char, hasFakeCaret, isActive } = (_a2 = inputOTPContext == null ? void 0 : inputOTPContext.slots[index]) != null ? _a2 : {};
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
     "div",
     __spreadProps(__spreadValues({
       "data-slot": "input-otp-slot",
@@ -4265,20 +4528,20 @@ function InputOTPSlot(_a) {
     }, props), {
       children: [
         char,
-        hasFakeCaret && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "h-4 w-px animate-caret-blink bg-text-prominent-default duration-1000" }) })
+        hasFakeCaret && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "h-4 w-px animate-caret-blink bg-text-prominent-default duration-1000" }) })
       ]
     })
   );
 }
 function InputOTPSeparator(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", __spreadProps(__spreadValues({ "data-slot": "input-otp-separator", role: "separator" }, props), { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_lucide_react14.MinusIcon, {}) }));
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", __spreadProps(__spreadValues({ "data-slot": "input-otp-separator", role: "separator" }, props), { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_lucide_react15.MinusIcon, {}) }));
 }
 
 // components/ui/item.tsx
 var import_class_variance_authority10 = require("class-variance-authority");
 var import_radix_ui18 = require("radix-ui");
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_jsx_runtime34 = require("react/jsx-runtime");
 function ItemGroup(_a) {
   var _b = _a, {
     className,
@@ -4287,7 +4550,7 @@ function ItemGroup(_a) {
     "className",
     "divider"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
     "div",
     __spreadValues({
       role: "list",
@@ -4320,7 +4583,7 @@ function ItemSeparator(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
     Separator,
     __spreadValues({
       "data-slot": "item-separator",
@@ -4362,7 +4625,7 @@ function Item(_a) {
     "asChild"
   ]);
   const Comp = asChild ? import_radix_ui18.Slot.Root : "div";
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
     Comp,
     __spreadValues({
       "data-slot": "item",
@@ -4395,7 +4658,7 @@ function ItemMedia(_a) {
     "className",
     "variant"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
     "div",
     __spreadValues({
       "data-slot": "item-media",
@@ -4406,7 +4669,7 @@ function ItemMedia(_a) {
 }
 function ItemContent(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
     "div",
     __spreadValues({
       "data-slot": "item-content",
@@ -4419,7 +4682,7 @@ function ItemContent(_a) {
 }
 function ItemTitle(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
     "div",
     __spreadValues({
       "data-slot": "item-title",
@@ -4432,7 +4695,7 @@ function ItemTitle(_a) {
 }
 function ItemDescription(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
     "p",
     __spreadValues({
       "data-slot": "item-description",
@@ -4446,7 +4709,7 @@ function ItemDescription(_a) {
 }
 function ItemActions(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
     "div",
     __spreadValues({
       "data-slot": "item-actions",
@@ -4456,7 +4719,7 @@ function ItemActions(_a) {
 }
 function ItemHeader(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
     "div",
     __spreadValues({
       "data-slot": "item-header",
@@ -4469,7 +4732,7 @@ function ItemHeader(_a) {
 }
 function ItemFooter(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
     "div",
     __spreadValues({
       "data-slot": "item-footer",
@@ -4484,7 +4747,7 @@ function ItemFooter(_a) {
 // components/ui/link.tsx
 var import_class_variance_authority11 = require("class-variance-authority");
 var import_radix_ui19 = require("radix-ui");
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var import_jsx_runtime35 = require("react/jsx-runtime");
 var linkVariants = (0, import_class_variance_authority11.cva)(
   [
     "inline-flex shrink-0 items-center gap-1.5 whitespace-nowrap transition-colors outline-none focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong active:opacity-60 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg]:inline font-display normal-case",
@@ -4526,7 +4789,7 @@ function Link(_a) {
     "asChild"
   ]);
   const Comp = asChild ? import_radix_ui19.Slot.Root : "a";
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
     Comp,
     __spreadValues({
       "data-slot": "link",
@@ -4538,16 +4801,16 @@ function Link(_a) {
 }
 
 // components/ui/menubar.tsx
-var import_lucide_react15 = require("lucide-react");
+var import_lucide_react16 = require("lucide-react");
 var import_radix_ui20 = require("radix-ui");
-var import_jsx_runtime35 = require("react/jsx-runtime");
+var import_jsx_runtime36 = require("react/jsx-runtime");
 function Menubar(_a) {
   var _b = _a, {
     className
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     import_radix_ui20.Menubar.Root,
     __spreadValues({
       "data-slot": "menubar",
@@ -4560,19 +4823,19 @@ function Menubar(_a) {
 }
 function MenubarMenu(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_radix_ui20.Menubar.Menu, __spreadValues({ "data-slot": "menubar-menu" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_radix_ui20.Menubar.Menu, __spreadValues({ "data-slot": "menubar-menu" }, props));
 }
 function MenubarGroup(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_radix_ui20.Menubar.Group, __spreadValues({ "data-slot": "menubar-group" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_radix_ui20.Menubar.Group, __spreadValues({ "data-slot": "menubar-group" }, props));
 }
 function MenubarPortal(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_radix_ui20.Menubar.Portal, __spreadValues({ "data-slot": "menubar-portal" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_radix_ui20.Menubar.Portal, __spreadValues({ "data-slot": "menubar-portal" }, props));
 }
 function MenubarRadioGroup(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_radix_ui20.Menubar.RadioGroup, __spreadValues({ "data-slot": "menubar-radio-group" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_radix_ui20.Menubar.RadioGroup, __spreadValues({ "data-slot": "menubar-radio-group" }, props));
 }
 function MenubarTrigger(_a) {
   var _b = _a, {
@@ -4580,7 +4843,7 @@ function MenubarTrigger(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     import_radix_ui20.Menubar.Trigger,
     __spreadValues({
       "data-slot": "menubar-trigger",
@@ -4603,7 +4866,7 @@ function MenubarContent(_a) {
     "alignOffset",
     "sideOffset"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(MenubarPortal, { children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(MenubarPortal, { children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     import_radix_ui20.Menubar.Content,
     __spreadValues({
       "data-slot": "menubar-content",
@@ -4627,14 +4890,14 @@ function MenubarItem(_a) {
     "inset",
     "variant"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     import_radix_ui20.Menubar.Item,
     __spreadValues({
       "data-slot": "menubar-item",
       "data-inset": inset,
       "data-variant": variant,
       className: cn(
-        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md px-2 py-1.5 outline-hidden select-none hover:bg-background-hover-default hover:text-text-prominent-default focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:opacity-24 data-[inset]:pl-8 data-[variant=destructive]:text-text-error-default data-[variant=destructive]:focus:bg-background-error-default data-[variant=destructive]:focus:text-text-error-default [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-icon-subtle-default data-[variant=destructive]:*:[svg]:text-text-error-default!",
+        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md px-2 py-1.5 outline-hidden select-none hover:bg-background-hover-default hover:text-text-prominent-default focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:text-text-disabled-default data-[inset]:pl-8 data-[variant=destructive]:text-text-error-default data-[variant=destructive]:focus:bg-background-error-default data-[variant=destructive]:focus:text-text-error-default [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-icon-subtle-default data-[variant=destructive]:*:[svg]:text-text-error-default!",
         className
       )
     }, props)
@@ -4650,18 +4913,18 @@ function MenubarCheckboxItem(_a) {
     "children",
     "checked"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
     import_radix_ui20.Menubar.CheckboxItem,
     __spreadProps(__spreadValues({
       "data-slot": "menubar-checkbox-item",
       className: cn(
-        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md py-1.5 pr-2 pl-8 outline-hidden select-none hover:bg-background-hover-default hover:text-text-prominent-default focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:opacity-24 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md py-1.5 pr-2 pl-8 outline-hidden select-none hover:bg-background-hover-default hover:text-text-prominent-default focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:text-text-disabled-default [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         className
       ),
       checked
     }, props), {
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_radix_ui20.Menubar.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_lucide_react15.CheckIcon, { className: "size-4" }) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_radix_ui20.Menubar.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_lucide_react16.CheckIcon, { className: "size-4" }) }) }),
         children
       ]
     })
@@ -4675,17 +4938,17 @@ function MenubarRadioItem(_a) {
     "className",
     "children"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
     import_radix_ui20.Menubar.RadioItem,
     __spreadProps(__spreadValues({
       "data-slot": "menubar-radio-item",
       className: cn(
-        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md py-1.5 pr-2 pl-8 outline-hidden select-none hover:bg-background-hover-default hover:text-text-prominent-default focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:opacity-24 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "relative flex cursor-default items-center gap-2 type-menu-item rounded-md py-1.5 pr-2 pl-8 outline-hidden select-none hover:bg-background-hover-default hover:text-text-prominent-default focus:bg-background-hover-default focus:text-text-prominent-default data-[disabled]:pointer-events-none data-[disabled]:text-text-disabled-default [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         className
       )
     }, props), {
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_radix_ui20.Menubar.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_lucide_react15.CircleIcon, { className: "size-2 fill-current" }) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_radix_ui20.Menubar.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_lucide_react16.CircleIcon, { className: "size-2 fill-current" }) }) }),
         children
       ]
     })
@@ -4699,7 +4962,7 @@ function MenubarLabel(_a) {
     "className",
     "inset"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     import_radix_ui20.Menubar.Label,
     __spreadValues({
       "data-slot": "menubar-label",
@@ -4717,7 +4980,7 @@ function MenubarSeparator(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     import_radix_ui20.Menubar.Separator,
     __spreadValues({
       "data-slot": "menubar-separator",
@@ -4731,7 +4994,7 @@ function MenubarShortcut(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     "span",
     __spreadValues({
       "data-slot": "menubar-shortcut",
@@ -4744,7 +5007,7 @@ function MenubarShortcut(_a) {
 }
 function MenubarSub(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_radix_ui20.Menubar.Sub, __spreadValues({ "data-slot": "menubar-sub" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_radix_ui20.Menubar.Sub, __spreadValues({ "data-slot": "menubar-sub" }, props));
 }
 function MenubarSubTrigger(_a) {
   var _b = _a, {
@@ -4756,7 +5019,7 @@ function MenubarSubTrigger(_a) {
     "inset",
     "children"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
     import_radix_ui20.Menubar.SubTrigger,
     __spreadProps(__spreadValues({
       "data-slot": "menubar-sub-trigger",
@@ -4768,7 +5031,7 @@ function MenubarSubTrigger(_a) {
     }, props), {
       children: [
         children,
-        /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_lucide_react15.ChevronRightIcon, { className: "ml-auto" })
+        /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_lucide_react16.ChevronRightIcon, { className: "ml-auto" })
       ]
     })
   );
@@ -4779,7 +5042,7 @@ function MenubarSubContent(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     import_radix_ui20.Menubar.SubContent,
     __spreadValues({
       "data-slot": "menubar-sub-content",
@@ -4792,8 +5055,8 @@ function MenubarSubContent(_a) {
 }
 
 // components/ui/native-select.tsx
-var import_lucide_react16 = require("lucide-react");
-var import_jsx_runtime36 = require("react/jsx-runtime");
+var import_lucide_react17 = require("lucide-react");
+var import_jsx_runtime37 = require("react/jsx-runtime");
 var sizeClasses = {
   sm: "type-native-select-sm h-8 py-1",
   md: "type-native-select-md h-10 py-2",
@@ -4809,27 +5072,27 @@ function NativeSelect(_a) {
   ]);
   const fieldSize = useFieldSize();
   const resolvedSize = size === "default" || size == null ? size == null ? fieldSize : "md" : size;
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
     "div",
     {
-      className: "group/native-select relative w-fit has-[select:disabled]:opacity-24",
+      className: "group/native-select relative w-fit has-[select:disabled]:text-text-disabled-default",
       "data-slot": "native-select-wrapper",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
           "select",
           __spreadValues({
             "data-slot": "native-select",
             "data-size": resolvedSize,
             className: cn(
-              "w-full min-w-0 appearance-none rounded-xs border border-border-default-default bg-background-primary-surface px-3 pr-9 text-text-prominent-default transition-[color,box-shadow] outline-none selection:bg-background-brand-default selection:text-text-on-brand-static disabled:pointer-events-none disabled:cursor-not-allowed",
+              "w-full min-w-0 appearance-none rounded-xs border border-border-default-default bg-background-primary-surface px-3 pr-9 text-text-prominent-default transition-[color,box-shadow] outline-none selection:bg-background-brand-default selection:text-text-on-brand-static disabled:pointer-events-none disabled:cursor-not-allowed disabled:[background-image:linear-gradient(var(--background-disabled-default),var(--background-disabled-default))]",
               "focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-soft",
               sizeClasses[resolvedSize],
               className
             )
           }, props)
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
-          import_lucide_react16.ChevronDownIcon,
+        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+          import_lucide_react17.ChevronDownIcon,
           {
             className: "pointer-events-none absolute top-1/2 right-3.5 size-4 -translate-y-1/2 text-icon-subtle-default select-none",
             "aria-hidden": "true",
@@ -4842,7 +5105,7 @@ function NativeSelect(_a) {
 }
 function NativeSelectOption(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("option", __spreadValues({ "data-slot": "native-select-option" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("option", __spreadValues({ "data-slot": "native-select-option" }, props));
 }
 function NativeSelectOptGroup(_a) {
   var _b = _a, {
@@ -4850,7 +5113,7 @@ function NativeSelectOptGroup(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
     "optgroup",
     __spreadValues({
       "data-slot": "native-select-optgroup",
@@ -4861,9 +5124,9 @@ function NativeSelectOptGroup(_a) {
 
 // components/ui/navigation-menu.tsx
 var import_class_variance_authority12 = require("class-variance-authority");
-var import_lucide_react17 = require("lucide-react");
+var import_lucide_react18 = require("lucide-react");
 var import_radix_ui21 = require("radix-ui");
-var import_jsx_runtime37 = require("react/jsx-runtime");
+var import_jsx_runtime38 = require("react/jsx-runtime");
 function NavigationMenu(_a) {
   var _b = _a, {
     className,
@@ -4874,7 +5137,7 @@ function NavigationMenu(_a) {
     "children",
     "viewport"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
     import_radix_ui21.NavigationMenu.Root,
     __spreadProps(__spreadValues({
       "data-slot": "navigation-menu",
@@ -4886,7 +5149,7 @@ function NavigationMenu(_a) {
     }, props), {
       children: [
         children,
-        viewport && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(NavigationMenuViewport, {})
+        viewport && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(NavigationMenuViewport, {})
       ]
     })
   );
@@ -4897,7 +5160,7 @@ function NavigationMenuList(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
     import_radix_ui21.NavigationMenu.List,
     __spreadValues({
       "data-slot": "navigation-menu-list",
@@ -4914,7 +5177,7 @@ function NavigationMenuItem(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
     import_radix_ui21.NavigationMenu.Item,
     __spreadValues({
       "data-slot": "navigation-menu-item",
@@ -4923,7 +5186,7 @@ function NavigationMenuItem(_a) {
   );
 }
 var navigationMenuTriggerStyle = (0, import_class_variance_authority12.cva)(
-  "group type-menu-trigger inline-flex h-10 w-max items-center justify-center rounded-md bg-background-primary-surface px-4 py-2 transition-[color,box-shadow] outline-none hover:bg-background-hover-default hover:text-text-prominent-default focus:bg-background-hover-default focus:text-text-prominent-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-24 data-[state=open]:bg-background-hover-default data-[state=open]:text-text-prominent-default data-[state=open]:hover:bg-background-hover-default data-[state=open]:focus:bg-background-hover-default"
+  "group type-menu-trigger inline-flex h-10 w-max items-center justify-center rounded-md bg-background-primary-surface px-4 py-2 transition-[color,box-shadow] outline-none hover:bg-background-hover-default hover:text-text-prominent-default focus:bg-background-hover-default focus:text-text-prominent-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong focus-visible:outline-1 disabled:pointer-events-none disabled:text-text-disabled-default data-[state=open]:bg-background-hover-default data-[state=open]:text-text-prominent-default data-[state=open]:hover:bg-background-hover-default data-[state=open]:focus:bg-background-hover-default"
 );
 function NavigationMenuTrigger(_a) {
   var _b = _a, {
@@ -4933,7 +5196,7 @@ function NavigationMenuTrigger(_a) {
     "className",
     "children"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
     import_radix_ui21.NavigationMenu.Trigger,
     __spreadProps(__spreadValues({
       "data-slot": "navigation-menu-trigger",
@@ -4942,8 +5205,8 @@ function NavigationMenuTrigger(_a) {
       children: [
         children,
         " ",
-        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
-          import_lucide_react17.ChevronDownIcon,
+        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+          import_lucide_react18.ChevronDownIcon,
           {
             className: "relative top-[1px] ml-1 size-3 transition duration-slow group-data-[state=open]:rotate-180",
             "aria-hidden": "true"
@@ -4959,7 +5222,7 @@ function NavigationMenuContent(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
     import_radix_ui21.NavigationMenu.Content,
     __spreadValues({
       "data-slot": "navigation-menu-content",
@@ -4977,13 +5240,13 @@ function NavigationMenuViewport(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
     "div",
     {
       className: cn(
         "absolute top-full left-0 isolate z-50 flex justify-center"
       ),
-      children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
         import_radix_ui21.NavigationMenu.Viewport,
         __spreadValues({
           "data-slot": "navigation-menu-viewport",
@@ -5002,7 +5265,7 @@ function NavigationMenuLink(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
     import_radix_ui21.NavigationMenu.Link,
     __spreadValues({
       "data-slot": "navigation-menu-link",
@@ -5019,7 +5282,7 @@ function NavigationMenuIndicator(_a) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
     import_radix_ui21.NavigationMenu.Indicator,
     __spreadProps(__spreadValues({
       "data-slot": "navigation-menu-indicator",
@@ -5028,15 +5291,15 @@ function NavigationMenuIndicator(_a) {
         className
       )
     }, props), {
-      children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border-default-default" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border-default-default" })
     })
   );
 }
 
 // components/ui/numpad.tsx
-var React9 = __toESM(require("react"), 1);
-var import_lucide_react18 = require("lucide-react");
-var import_jsx_runtime38 = require("react/jsx-runtime");
+var React10 = __toESM(require("react"), 1);
+var import_lucide_react19 = require("lucide-react");
+var import_jsx_runtime39 = require("react/jsx-runtime");
 var LONG_PRESS_MS = 600;
 function Numpad(_a) {
   var _b = _a, {
@@ -5052,8 +5315,8 @@ function Numpad(_a) {
     "decimal",
     "disabled"
   ]);
-  const holdTimer = React9.useRef(null);
-  const longPressFired = React9.useRef(false);
+  const holdTimer = React10.useRef(null);
+  const longPressFired = React10.useRef(false);
   const startHold = () => {
     longPressFired.current = false;
     holdTimer.current = setTimeout(() => {
@@ -5065,7 +5328,7 @@ function Numpad(_a) {
     if (holdTimer.current) clearTimeout(holdTimer.current);
     holdTimer.current = null;
   };
-  React9.useEffect(() => cancelHold, []);
+  React10.useEffect(() => cancelHold, []);
   const keys = [
     "1",
     "2",
@@ -5080,7 +5343,7 @@ function Numpad(_a) {
     "0",
     "backspace"
   ];
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
     "div",
     __spreadProps(__spreadValues({
       "data-slot": "numpad",
@@ -5088,12 +5351,12 @@ function Numpad(_a) {
       "aria-label": "Number pad",
       className: cn(
         "grid w-full grid-cols-3 gap-1",
-        disabled && "pointer-events-none opacity-24",
+        disabled && "pointer-events-none [background-image:linear-gradient(var(--background-disabled-default),var(--background-disabled-default))] text-text-disabled-default",
         className
       )
     }, props), {
       children: keys.map(
-        (key, i) => key === null ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { "aria-hidden": true }, `empty-${i}`) : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+        (key, i) => key === null ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { "aria-hidden": true }, `empty-${i}`) : /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
           "button",
           {
             type: "button",
@@ -5118,7 +5381,7 @@ function Numpad(_a) {
               }
               onKeyPress == null ? void 0 : onKeyPress(key);
             },
-            children: key === "backspace" ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react18.Delete, { className: "size-5.5" }) : key
+            children: key === "backspace" ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react19.Delete, { className: "size-5.5" }) : key
           },
           key
         )
@@ -5127,98 +5390,6 @@ function Numpad(_a) {
   );
 }
 
-// components/ui/pagination.tsx
-var import_lucide_react19 = require("lucide-react");
-var import_jsx_runtime39 = require("react/jsx-runtime");
-function Pagination(_a) {
-  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
-    "nav",
-    __spreadValues({
-      role: "navigation",
-      "aria-label": "pagination",
-      "data-slot": "pagination",
-      className: cn("mx-auto flex w-full justify-center", className)
-    }, props)
-  );
-}
-function PaginationContent(_a) {
-  var _b = _a, {
-    className
-  } = _b, props = __objRest(_b, [
-    "className"
-  ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
-    "ul",
-    __spreadValues({
-      "data-slot": "pagination-content",
-      className: cn("flex flex-row items-center gap-1", className)
-    }, props)
-  );
-}
-function PaginationItem(_a) {
-  var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("li", __spreadValues({ "data-slot": "pagination-item" }, props));
-}
-function PaginationLink(_a) {
-  var _b = _a, {
-    className,
-    isActive
-  } = _b, props = __objRest(_b, [
-    "className",
-    "isActive"
-  ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
-    "a",
-    __spreadValues({
-      "aria-current": isActive ? "page" : void 0,
-      "data-slot": "pagination-link",
-      "data-active": isActive,
-      className: cn(
-        "type-pagination inline-flex shrink-0 items-center justify-center size-10 rounded-full font-display whitespace-nowrap transition-[color,background-color,border-color] outline-none border focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong",
-        isActive ? "bg-background-brand-selected border-border-brand-selected text-text-brand-selected" : "bg-transparent border-transparent text-text-prominent-default hover:bg-background-hover-default",
-        className
-      )
-    }, props)
-  );
-}
-function PaginationPrevious(_a) {
-  var _b = _a, {
-    className
-  } = _b, props = __objRest(_b, [
-    "className"
-  ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Button, { asChild: true, variant: "tertiary", size: "icon-md", className: cn(className), children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("a", __spreadProps(__spreadValues({ "aria-label": "Go to previous page", "data-slot": "pagination-link" }, props), { children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react19.ChevronLeftIcon, { className: "size-5" }) })) });
-}
-function PaginationNext(_a) {
-  var _b = _a, {
-    className
-  } = _b, props = __objRest(_b, [
-    "className"
-  ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Button, { asChild: true, variant: "tertiary", size: "icon-md", className: cn(className), children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("a", __spreadProps(__spreadValues({ "aria-label": "Go to next page", "data-slot": "pagination-link" }, props), { children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react19.ChevronRightIcon, { className: "size-5" }) })) });
-}
-function PaginationEllipsis(_a) {
-  var _b = _a, {
-    className
-  } = _b, props = __objRest(_b, [
-    "className"
-  ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
-    "span",
-    __spreadProps(__spreadValues({
-      "aria-hidden": true,
-      "data-slot": "pagination-ellipsis",
-      className: cn("flex size-10 items-center justify-center", className)
-    }, props), {
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react19.MoreHorizontalIcon, { className: "size-4" }),
-        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "sr-only", children: "More pages" })
-      ]
-    })
-  );
-}
-
 // components/ui/popover.tsx
 var import_radix_ui22 = require("radix-ui");
 var import_jsx_runtime40 = require("react/jsx-runtime");
@@ -5293,7 +5464,7 @@ function PopoverDescription(_a) {
 }
 
 // components/ui/progress.tsx
-var React10 = __toESM(require("react"), 1);
+var React11 = __toESM(require("react"), 1);
 var import_radix_ui23 = require("radix-ui");
 var import_jsx_runtime41 = require("react/jsx-runtime");
 var BAR_HEIGHTS = {
@@ -5338,11 +5509,11 @@ function Progress(_a) {
     "onTimerEnd",
     "children"
   ]);
-  const [timerPct, setTimerPct] = React10.useState(
+  const [timerPct, setTimerPct] = React11.useState(
     timer != null ? direction === "up" ? 0 : 100 : null
   );
-  const endedRef = React10.useRef(false);
-  React10.useEffect(() => {
+  const endedRef = React11.useRef(false);
+  React11.useEffect(() => {
     if (timer == null) {
       setTimerPct(null);
       return;
@@ -5635,7 +5806,7 @@ function RadioGroupItem(_a) {
     __spreadProps(__spreadValues({
       "data-slot": "radio-group-item",
       className: cn(
-        "aspect-square size-4 shrink-0 rounded-full border border-border-default-default bg-background-primary-surface transition-[color,box-shadow] outline-none focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong data-[state=checked]:border-border-brand-selected disabled:cursor-not-allowed disabled:opacity-24 aria-invalid:border-border-error-default aria-invalid:ring-ring-error-soft",
+        "aspect-square size-4 shrink-0 rounded-full border border-border-default-default bg-background-primary-surface transition-[color,box-shadow] outline-none focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong data-[state=checked]:border-border-brand-selected disabled:cursor-not-allowed disabled:border-border-default-default disabled:text-text-disabled-default aria-invalid:border-border-error-default aria-invalid:ring-ring-error-soft",
         className
       )
     }, props), {
@@ -5892,17 +6063,17 @@ function SheetDescription(_a) {
 }
 
 // components/ui/sidebar.tsx
-var React13 = __toESM(require("react"), 1);
+var React14 = __toESM(require("react"), 1);
 var import_class_variance_authority13 = require("class-variance-authority");
 var import_lucide_react24 = require("lucide-react");
 var import_radix_ui28 = require("radix-ui");
 
 // hooks/use-mobile.ts
-var React11 = __toESM(require("react"), 1);
+var React12 = __toESM(require("react"), 1);
 var MOBILE_BREAKPOINT = 768;
 function useIsMobile() {
-  const [isMobile, setIsMobile] = React11.useState(void 0);
-  React11.useEffect(() => {
+  const [isMobile, setIsMobile] = React12.useState(void 0);
+  React12.useEffect(() => {
     const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
     const onChange = () => {
       setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
@@ -5932,10 +6103,10 @@ function Skeleton(_a) {
 }
 
 // components/ui/tooltip.tsx
-var React12 = __toESM(require("react"), 1);
+var React13 = __toESM(require("react"), 1);
 var import_radix_ui27 = require("radix-ui");
 var import_jsx_runtime48 = require("react/jsx-runtime");
-var TooltipModeContext = React12.createContext("tooltip");
+var TooltipModeContext = React13.createContext("tooltip");
 function TooltipProvider(_a) {
   var _b = _a, {
     delayDuration = 0
@@ -5969,7 +6140,7 @@ function TooltipTrigger(_a) {
   } = _b, props = __objRest(_b, [
     "children"
   ]);
-  const mode = React12.useContext(TooltipModeContext);
+  const mode = React13.useContext(TooltipModeContext);
   if (mode === "drawer") {
     return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(DrawerTrigger, __spreadProps(__spreadValues({ "data-slot": "tooltip-trigger" }, props), { children }));
   }
@@ -5991,7 +6162,7 @@ function TooltipContent(_a) {
     "closeLabel",
     "children"
   ]);
-  const mode = React12.useContext(TooltipModeContext);
+  const mode = React13.useContext(TooltipModeContext);
   if (mode === "drawer") {
     return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(DrawerContent, { "data-slot": "tooltip-content", "data-variant": variant, children: [
       /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(DrawerHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(DrawerTitle, { children: title }) }),
@@ -6029,9 +6200,9 @@ var SIDEBAR_WIDTH = "16rem";
 var SIDEBAR_WIDTH_MOBILE = "18rem";
 var SIDEBAR_WIDTH_ICON = "3rem";
 var SIDEBAR_KEYBOARD_SHORTCUT = "b";
-var SidebarContext = React13.createContext(null);
+var SidebarContext = React14.createContext(null);
 function useSidebar() {
-  const context = React13.useContext(SidebarContext);
+  const context = React14.useContext(SidebarContext);
   if (!context) {
     throw new Error("useSidebar must be used within a SidebarProvider.");
   }
@@ -6054,10 +6225,10 @@ function SidebarProvider(_a) {
     "children"
   ]);
   const isMobile = useIsMobile();
-  const [openMobile, setOpenMobile] = React13.useState(false);
-  const [_open, _setOpen] = React13.useState(defaultOpen);
+  const [openMobile, setOpenMobile] = React14.useState(false);
+  const [_open, _setOpen] = React14.useState(defaultOpen);
   const open = openProp != null ? openProp : _open;
-  const setOpen = React13.useCallback(
+  const setOpen = React14.useCallback(
     (value) => {
       const openState = typeof value === "function" ? value(open) : value;
       if (setOpenProp) {
@@ -6069,10 +6240,10 @@ function SidebarProvider(_a) {
     },
     [setOpenProp, open]
   );
-  const toggleSidebar = React13.useCallback(() => {
+  const toggleSidebar = React14.useCallback(() => {
     return isMobile ? setOpenMobile((open2) => !open2) : setOpen((open2) => !open2);
   }, [isMobile, setOpen, setOpenMobile]);
-  React13.useEffect(() => {
+  React14.useEffect(() => {
     const handleKeyDown = (event) => {
       if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
         event.preventDefault();
@@ -6083,7 +6254,7 @@ function SidebarProvider(_a) {
     return () => window.removeEventListener("keydown", handleKeyDown);
   }, [toggleSidebar]);
   const state = open ? "expanded" : "collapsed";
-  const contextValue = React13.useMemo(
+  const contextValue = React14.useMemo(
     () => ({
       state,
       open,
@@ -6449,7 +6620,7 @@ function SidebarMenuItem(_a) {
   );
 }
 var sidebarMenuButtonVariants = (0, import_class_variance_authority13.cva)(
-  "peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-sm p-2 text-left text-text-prominent-default ring-ring-focus-default outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! hover:bg-background-hover-default hover:text-text-brand-hover focus-visible:ring-2 active:bg-background-hover-default active:text-text-brand-hover disabled:pointer-events-none disabled:opacity-24 aria-disabled:pointer-events-none aria-disabled:opacity-24 data-[active=true]:bg-background-brand-selected data-[active=true]:text-text-brand-selected data-[active=true]:hover:bg-background-brand-selected data-[active=true]:hover:text-text-brand-selected data-[state=open]:hover:bg-background-hover-default data-[state=open]:hover:text-text-brand-hover [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 data-[active=true]:[&>svg]:text-text-brand-selected",
+  "peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-sm p-2 text-left text-text-prominent-default ring-ring-focus-default outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! hover:bg-background-hover-default hover:text-text-brand-hover focus-visible:ring-2 active:bg-background-hover-default active:text-text-brand-hover disabled:pointer-events-none disabled:text-text-disabled-default aria-disabled:pointer-events-none aria-disabled:text-text-disabled-default data-[active=true]:bg-background-brand-selected data-[active=true]:text-text-brand-selected data-[active=true]:hover:bg-background-brand-selected data-[active=true]:hover:text-text-brand-selected data-[state=open]:hover:bg-background-hover-default data-[state=open]:hover:text-text-brand-hover [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 data-[active=true]:[&>svg]:text-text-brand-selected",
   {
     variants: {
       variant: {
@@ -6658,7 +6829,7 @@ function SidebarMenuSubButton(_a) {
       "data-size": size,
       "data-active": isActive,
       className: cn(
-        "flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-sm px-2 text-text-prominent-default ring-ring-focus-default outline-hidden hover:bg-background-hover-default hover:text-text-brand-hover focus-visible:ring-2 active:bg-background-hover-default active:text-text-brand-hover disabled:pointer-events-none disabled:opacity-24 aria-disabled:pointer-events-none aria-disabled:opacity-24 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 data-[active=true]:[&>svg]:text-text-brand-selected",
+        "flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-sm px-2 text-text-prominent-default ring-ring-focus-default outline-hidden hover:bg-background-hover-default hover:text-text-brand-hover focus-visible:ring-2 active:bg-background-hover-default active:text-text-brand-hover disabled:pointer-events-none disabled:text-text-disabled-default aria-disabled:pointer-events-none aria-disabled:text-text-disabled-default [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 data-[active=true]:[&>svg]:text-text-brand-selected",
         "data-[active=true]:bg-background-brand-selected data-[active=true]:text-text-brand-selected",
         size === "sm" && "type-sidebar-menu-sm",
         size === "md" && "type-sidebar-menu",
@@ -6670,7 +6841,7 @@ function SidebarMenuSubButton(_a) {
 }
 
 // components/ui/slider.tsx
-var React14 = __toESM(require("react"), 1);
+var React15 = __toESM(require("react"), 1);
 var import_radix_ui29 = require("radix-ui");
 var import_jsx_runtime50 = require("react/jsx-runtime");
 function Slider(_a) {
@@ -6687,7 +6858,7 @@ function Slider(_a) {
     "min",
     "max"
   ]);
-  const _values = React14.useMemo(
+  const _values = React15.useMemo(
     () => Array.isArray(value) ? value : Array.isArray(defaultValue) ? defaultValue : [min, max],
     [value, defaultValue, min, max]
   );
@@ -6700,7 +6871,7 @@ function Slider(_a) {
       min,
       max,
       className: cn(
-        "relative flex w-full touch-none items-center select-none data-[disabled]:opacity-24 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col",
+        "relative flex w-full touch-none items-center select-none data-[disabled]:[background-image:linear-gradient(var(--background-disabled-default),var(--background-disabled-default))] data-[disabled]:text-text-disabled-default data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col",
         className
       )
     }, props), {
@@ -6739,6 +6910,7 @@ function Slider(_a) {
 }
 
 // components/ui/toast.tsx
+var React16 = __toESM(require("react"), 1);
 var import_lucide_react25 = require("lucide-react");
 var import_next_themes = require("next-themes");
 var import_sonner = require("sonner");
@@ -6779,9 +6951,174 @@ var Toaster = (_a) => {
     }, props)
   );
 };
+var RESULT_SNACKBAR_EXIT_MS = 350;
+var RESULT_SNACKBAR_ICON_DELAY_MS = 150;
+function ResultSnackbar(_a) {
+  var _b = _a, {
+    outcome,
+    amount,
+    currency,
+    contractLabel,
+    duration,
+    icon,
+    amountValue,
+    placement = "top",
+    durationMs = 2500,
+    onDismiss,
+    announcement,
+    className
+  } = _b, props = __objRest(_b, [
+    "outcome",
+    "amount",
+    "currency",
+    "contractLabel",
+    "duration",
+    "icon",
+    "amountValue",
+    "placement",
+    "durationMs",
+    "onDismiss",
+    "announcement",
+    "className"
+  ]);
+  const isWin = outcome === "win";
+  const [leaving, setLeaving] = React16.useState(false);
+  const reduced = usePrefersReducedMotion();
+  const onDismissRef = React16.useRef(onDismiss);
+  React16.useEffect(() => {
+    onDismissRef.current = onDismiss;
+  }, [onDismiss]);
+  const firedRef = React16.useRef(false);
+  const finish = React16.useCallback(() => {
+    var _a2;
+    if (firedRef.current) return;
+    firedRef.current = true;
+    (_a2 = onDismissRef.current) == null ? void 0 : _a2.call(onDismissRef);
+  }, []);
+  React16.useEffect(() => {
+    const leave = window.setTimeout(() => setLeaving(true), durationMs);
+    return () => window.clearTimeout(leave);
+  }, [durationMs]);
+  React16.useEffect(() => {
+    if (!leaving) return;
+    const done = window.setTimeout(finish, reduced ? 0 : RESULT_SNACKBAR_EXIT_MS);
+    return () => window.clearTimeout(done);
+  }, [leaving, finish, reduced]);
+  const [display, setDisplay] = React16.useState(null);
+  React16.useEffect(() => {
+    if (amountValue === void 0 || reduced || !Number.isFinite(amountValue)) {
+      setDisplay(null);
+      return;
+    }
+    const total = isWin ? 500 : 250;
+    const sign = isWin ? "+" : "\u2212";
+    const startedAt = performance.now();
+    let frame = 0;
+    const step = (now) => {
+      const t = Math.min(1, (now - startedAt) / total);
+      const eased = 1 - Math.pow(1 - t, 3);
+      if (t < 1) {
+        setDisplay(`${sign}${(amountValue * eased).toFixed(2)}`);
+        frame = requestAnimationFrame(step);
+      } else {
+        setDisplay(null);
+      }
+    };
+    frame = requestAnimationFrame(step);
+    return () => cancelAnimationFrame(frame);
+  }, [amountValue, isWin, reduced]);
+  const spoken = announcement != null ? announcement : `${isWin ? "Won" : "Lost"} ${amount} ${currency}. ${contractLabel}, ${duration}.`;
+  const enterOut = leaving ? "out" : "in";
+  const motionName = `result-snackbar-${enterOut}-${placement}`;
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
+    "div",
+    __spreadProps(__spreadValues({
+      role: "status",
+      "aria-live": "polite",
+      "data-slot": "result-snackbar",
+      "data-outcome": outcome,
+      "data-leaving": leaving || void 0,
+      className: cn(
+        // Floating chrome, the same surface family as Bottom Navigation —
+        // it floats over live chart content, so it frosts what is behind it
+        // and carries the sanctioned chrome lift.
+        "pointer-events-none absolute z-40 flex w-max items-center gap-3 overflow-hidden",
+        "rounded-2xl border border-(--border-chrome-default) bg-(--background-chrome-default)",
+        "[backdrop-filter:blur(20px)_saturate(1.4)]",
+        "[box-shadow:var(--shadow-chrome-default),inset_0_1px_0_var(--chrome-highlight-default)]",
+        "py-2 pr-4 pl-2 whitespace-nowrap",
+        className
+      ),
+      style: {
+        animation: reduced ? `result-snackbar-fade var(--motion-overlay-close) var(--ease-standard) ${leaving ? "reverse forwards" : "forwards"}` : `${motionName} ${RESULT_SNACKBAR_EXIT_MS}ms var(--primitive-ease-overshoot) forwards`
+      }
+    }, props), {
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "sr-only", children: spoken }),
+        icon ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+          "span",
+          {
+            "data-slot": "result-snackbar-icon",
+            className: "flex size-10 flex-none items-center justify-center",
+            style: reduced ? void 0 : {
+              animation: `result-snackbar-icon-${outcome} var(--motion-pop) var(--primitive-ease-overshoot) ${RESULT_SNACKBAR_ICON_DELAY_MS}ms both`
+            },
+            children: icon
+          }
+        ) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("span", { "aria-hidden": true, className: "flex min-w-max flex-col gap-0.5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
+            "span",
+            {
+              className: cn(
+                "type-result-snackbar-amount min-w-max",
+                isWin ? "text-text-success-default" : "text-text-error-default"
+              ),
+              children: [
+                display != null ? display : amount,
+                " ",
+                /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "type-result-snackbar-currency", children: currency })
+              ]
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("span", { className: "type-result-snackbar-terms min-w-max text-text-subtle-default", children: [
+            contractLabel,
+            " \xB7 ",
+            duration
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+          "span",
+          {
+            "aria-hidden": true,
+            "data-slot": "result-snackbar-drain",
+            className: cn(
+              "absolute bottom-0 left-0 h-1 w-full origin-left",
+              isWin ? "bg-background-success-solid" : "bg-background-error-solid"
+            ),
+            style: reduced ? { transform: "scaleX(0)" } : {
+              animation: `result-snackbar-drain ${durationMs}ms var(--ease-linear) forwards`
+            }
+          }
+        )
+      ]
+    })
+  );
+}
+function usePrefersReducedMotion() {
+  const [reduced, setReduced] = React16.useState(false);
+  React16.useEffect(() => {
+    const query = window.matchMedia("(prefers-reduced-motion: reduce)");
+    setReduced(query.matches);
+    const onChange = (event) => setReduced(event.matches);
+    query.addEventListener("change", onChange);
+    return () => query.removeEventListener("change", onChange);
+  }, []);
+  return reduced;
+}
 
 // components/ui/slide-to-confirm.tsx
-var React15 = __toESM(require("react"), 1);
+var React17 = __toESM(require("react"), 1);
 var import_lucide_react26 = require("lucide-react");
 var import_jsx_runtime52 = require("react/jsx-runtime");
 var CONFIRM_AT = 0.9;
@@ -6803,21 +7140,21 @@ function SlideToConfirm(_a) {
     "confirmed",
     "className"
   ]);
-  const trackRef = React15.useRef(null);
-  const [dragX, setDragX] = React15.useState(0);
-  const [dragging, setDragging] = React15.useState(false);
-  const [trackWidth, setTrackWidth] = React15.useState(0);
-  const [internalConfirmed, setInternalConfirmed] = React15.useState(false);
+  const trackRef = React17.useRef(null);
+  const [dragX, setDragX] = React17.useState(0);
+  const [dragging, setDragging] = React17.useState(false);
+  const [trackWidth, setTrackWidth] = React17.useState(0);
+  const [internalConfirmed, setInternalConfirmed] = React17.useState(false);
   const confirmed = controlledConfirmed != null ? controlledConfirmed : internalConfirmed;
-  const firedRef = React15.useRef(false);
-  React15.useEffect(() => {
+  const firedRef = React17.useRef(false);
+  React17.useEffect(() => {
     if (controlledConfirmed === false) {
       setInternalConfirmed(false);
       setDragX(0);
       firedRef.current = false;
     }
   }, [controlledConfirmed]);
-  React15.useEffect(() => {
+  React17.useEffect(() => {
     const track = trackRef.current;
     if (!track) return;
     const ro = new ResizeObserver(() => setTrackWidth(track.clientWidth));
@@ -6879,7 +7216,7 @@ function SlideToConfirm(_a) {
       onKeyDown: handleKeyDown,
       className: cn(
         "relative h-14 w-full touch-none overflow-hidden rounded-full bg-background-secondary-surface select-none",
-        disabled && "pointer-events-none opacity-24",
+        disabled && "pointer-events-none [background-image:linear-gradient(var(--background-disabled-default),var(--background-disabled-default))] text-text-disabled-default",
         "outline-none focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong",
         className
       )
@@ -6957,7 +7294,7 @@ function SlideToConfirm(_a) {
 }
 
 // components/ui/stepper.tsx
-var React16 = __toESM(require("react"), 1);
+var React18 = __toESM(require("react"), 1);
 var import_lucide_react27 = require("lucide-react");
 var import_jsx_runtime53 = require("react/jsx-runtime");
 function clamp(value, min, max) {
@@ -6987,16 +7324,16 @@ function Stepper({
   "aria-label": ariaLabel
 }) {
   const isControlled = controlledValue !== void 0;
-  const [internalValue, setInternalValue] = React16.useState(
+  const [internalValue, setInternalValue] = React18.useState(
     clamp(defaultValue, min, max)
   );
   const currentValue = isControlled ? controlledValue : internalValue;
   const decimalPlaces = getDecimalPlaces(step);
-  const [displayString, setDisplayString] = React16.useState(
+  const [displayString, setDisplayString] = React18.useState(
     formatValue(currentValue, decimalPlaces)
   );
-  const [isFocused, setIsFocused] = React16.useState(false);
-  React16.useEffect(() => {
+  const [isFocused, setIsFocused] = React18.useState(false);
+  React18.useEffect(() => {
     if (!isFocused) {
       setDisplayString(formatValue(currentValue, decimalPlaces));
     }
@@ -7126,10 +7463,10 @@ function Stepper({
 }
 
 // components/ui/steps.tsx
-var React17 = __toESM(require("react"), 1);
+var React19 = __toESM(require("react"), 1);
 var import_lucide_react28 = require("lucide-react");
 var import_jsx_runtime54 = require("react/jsx-runtime");
-var StepsContext = React17.createContext({ shape: "circle", orientation: "horizontal", size: "md" });
+var StepsContext = React19.createContext({ shape: "circle", orientation: "horizontal", size: "md" });
 function Steps(_a) {
   var _b = _a, {
     shape = "circle",
@@ -7144,7 +7481,7 @@ function Steps(_a) {
     "className",
     "children"
   ]);
-  const steps = React17.Children.toArray(children);
+  const steps = React19.Children.toArray(children);
   return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(StepsContext.Provider, { value: { shape, orientation, size }, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
     "ol",
     __spreadProps(__spreadValues({
@@ -7159,7 +7496,7 @@ function Steps(_a) {
       )
     }, props), {
       children: steps.map(
-        (child, index) => React17.isValidElement(child) ? React17.cloneElement(child, {
+        (child, index) => React19.isValidElement(child) ? React19.cloneElement(child, {
           index: index + 1,
           isFirst: index === 0,
           isLast: index === steps.length - 1
@@ -7190,7 +7527,7 @@ function Step(_a) {
     "isLast",
     "className"
   ]);
-  const { shape, orientation, size } = React17.useContext(StepsContext);
+  const { shape, orientation, size } = React19.useContext(StepsContext);
   const horizontal = orientation === "horizontal";
   const sm = size === "sm";
   const indicator = /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
@@ -7347,7 +7684,7 @@ function Switch(_a) {
       "data-slot": "switch",
       "data-size": size,
       className: cn(
-        "peer group/switch inline-flex shrink-0 items-center rounded-full border border-transparent p-[3px] transition-all outline-none focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong disabled:cursor-not-allowed disabled:opacity-24 data-[size=default]:h-6 data-[size=default]:w-11 data-[size=sm]:h-5 data-[size=sm]:w-9 data-[state=checked]:bg-background-brand-default data-[state=unchecked]:bg-border-default-default",
+        "peer group/switch inline-flex shrink-0 items-center rounded-full border border-transparent p-[3px] transition-all outline-none focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong disabled:cursor-not-allowed disabled:border-border-default-default disabled:text-text-disabled-default data-[size=default]:h-6 data-[size=default]:w-11 data-[size=sm]:h-5 data-[size=sm]:w-9 data-[state=checked]:bg-background-brand-default data-[state=unchecked]:bg-border-default-default",
         className
       )
     }, props), {
@@ -7549,7 +7886,7 @@ function TabsTrigger(_a) {
       "data-slot": "tabs-trigger",
       "data-icon-position": iconPosition,
       className: cn(
-        "relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-3 py-1 whitespace-nowrap text-text-subtle-default transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start hover:bg-background-hover-default hover:text-text-prominent-default focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong focus-visible:outline-1 focus-visible:outline-ring-focus-default disabled:pointer-events-none disabled:opacity-24 group-data-[variant=default]/tabs-list:data-[state=active]:shadow-none group-data-[variant=line]/tabs-list:data-[state=active]:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-3 py-1 whitespace-nowrap text-text-subtle-default transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start hover:bg-background-hover-default hover:text-text-prominent-default focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong focus-visible:outline-1 focus-visible:outline-ring-focus-default disabled:pointer-events-none disabled:text-text-disabled-default group-data-[variant=default]/tabs-list:data-[state=active]:shadow-none group-data-[variant=line]/tabs-list:data-[state=active]:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         "group-data-[size=sm]/tabs-list:gap-1 group-data-[size=sm]/tabs-list:rounded-sm group-data-[size=sm]/tabs-list:px-2",
         "group-data-[size=lg]/tabs-list:gap-2 group-data-[size=lg]/tabs-list:rounded-lg group-data-[size=lg]/tabs-list:px-4",
         "group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:hover:bg-transparent group-data-[variant=line]/tabs-list:hover:text-text-brand-hover group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent group-data-[variant=line]/tabs-list:data-[state=active]:border-transparent",
@@ -7583,7 +7920,7 @@ var import_class_variance_authority15 = require("class-variance-authority");
 var import_radix_ui32 = require("radix-ui");
 var import_jsx_runtime58 = require("react/jsx-runtime");
 var toggleVariants = (0, import_class_variance_authority15.cva)(
-  "type-toggle inline-flex items-center justify-center gap-2 rounded-md border border-border-default-default bg-background-primary-surface text-text-prominent-default whitespace-nowrap transition-[color,background-color,border-color,box-shadow] outline-none hover:bg-background-secondary-surface active:bg-background-secondary-wash focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong disabled:pointer-events-none disabled:opacity-24 aria-invalid:border-border-error-default aria-invalid:ring-ring-error-soft data-[state=on]:border-transparent data-[state=on]:bg-background-brand-default data-[state=on]:text-text-on-brand-static [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+  "type-toggle inline-flex items-center justify-center gap-2 rounded-md border border-border-default-default bg-background-primary-surface text-text-prominent-default whitespace-nowrap transition-[color,background-color,border-color,box-shadow] outline-none hover:bg-background-secondary-surface active:bg-background-secondary-wash focus-visible:border-ring-focus-default focus-visible:ring-[3px] focus-visible:ring-ring-focus-strong disabled:pointer-events-none disabled:border-border-default-default disabled:text-text-disabled-default aria-invalid:border-border-error-default aria-invalid:ring-ring-error-soft data-[state=on]:border-transparent data-[state=on]:bg-background-brand-default data-[state=on]:text-text-on-brand-static [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
   {
     variants: {
       size: {
@@ -7615,10 +7952,10 @@ function Toggle(_a) {
 }
 
 // components/ui/toggle-group.tsx
-var React18 = __toESM(require("react"), 1);
+var React20 = __toESM(require("react"), 1);
 var import_radix_ui33 = require("radix-ui");
 var import_jsx_runtime59 = require("react/jsx-runtime");
-var ToggleGroupContext = React18.createContext({
+var ToggleGroupContext = React20.createContext({
   size: "default",
   spacing: 0
 });
@@ -7660,7 +7997,7 @@ function ToggleGroupItem(_a) {
     "children",
     "size"
   ]);
-  const context = React18.useContext(ToggleGroupContext);
+  const context = React20.useContext(ToggleGroupContext);
   return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
     import_radix_ui33.ToggleGroup.Item,
     __spreadProps(__spreadValues({
@@ -7962,7 +8299,7 @@ function TaglinePill({
 }
 
 // components/blocks/auth-block.tsx
-var React19 = __toESM(require("react"), 1);
+var React21 = __toESM(require("react"), 1);
 var import_jsx_runtime64 = require("react/jsx-runtime");
 function AuthBlock({
   mode,
@@ -7978,7 +8315,7 @@ function AuthBlock({
   const ctaText = mode === "sign-in" ? "Sign in" : "Sign up";
   const footerPrompt = mode === "sign-in" ? "Don't have an account?" : "Already have an account?";
   const footerLinkLabel = mode === "sign-in" ? "Sign up" : "Log in";
-  const [email, setEmail] = React19.useState("");
+  const [email, setEmail] = React21.useState("");
   return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: "flex flex-col items-center gap-6 w-full", children: [
     /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)("div", { className: "flex items-center gap-2", children: [
       /* @__PURE__ */ (0, import_jsx_runtime64.jsx)("img", { src: logoSrc, alt: wordmark, className: "size-8 object-contain" }),
@@ -8046,12 +8383,12 @@ function ProviderButton({ provider }) {
 }
 
 // components/blocks/navbar-block.tsx
-var React20 = __toESM(require("react"), 1);
+var React22 = __toESM(require("react"), 1);
 var import_lucide_react32 = require("lucide-react");
 var import_jsx_runtime65 = require("react/jsx-runtime");
 function NavBarBlock({ brand, links, signIn, signUp }) {
   var _a, _b, _c, _d;
-  const [mobileMenuOpen, setMobileMenuOpen] = React20.useState(false);
+  const [mobileMenuOpen, setMobileMenuOpen] = React22.useState(false);
   return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "w-full border border-border-subtle rounded-md overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("nav", { className: "bg-prominent", children: [
     /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "flex items-center justify-between px-layout-margin-inline py-3", children: [
       /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "flex items-center gap-6", children: [
@@ -8214,7 +8551,7 @@ function DefaultEmptyState({ onViewHistory }) {
 }
 
 // components/blocks/game-loading-block.tsx
-var React21 = __toESM(require("react"), 1);
+var React23 = __toESM(require("react"), 1);
 var import_jsx_runtime67 = require("react/jsx-runtime");
 function useSmoothProgress({
   checkpoints,
@@ -8225,19 +8562,19 @@ function useSmoothProgress({
   readyLabel = "Ready"
 }) {
   var _a, _b;
-  const [progress, setProgress] = React21.useState(0);
-  const [delayed, setDelayed] = React21.useState(false);
-  const checkpointsRef = React21.useRef(checkpoints);
-  const reachedRef = React21.useRef(reached);
-  const doneRef = React21.useRef(done);
-  React21.useEffect(() => {
+  const [progress, setProgress] = React23.useState(0);
+  const [delayed, setDelayed] = React23.useState(false);
+  const checkpointsRef = React23.useRef(checkpoints);
+  const reachedRef = React23.useRef(reached);
+  const doneRef = React23.useRef(done);
+  React23.useEffect(() => {
     checkpointsRef.current = checkpoints;
     reachedRef.current = reached;
     doneRef.current = done;
   });
-  const progressRef = React21.useRef(0);
-  const lastAdvanceRef = React21.useRef(0);
-  React21.useEffect(() => {
+  const progressRef = React23.useRef(0);
+  const lastAdvanceRef = React23.useRef(0);
+  React23.useEffect(() => {
     let raf = 0;
     let last = 0;
     const tick = (ts) => {
@@ -8291,14 +8628,14 @@ function GameLoadingBlock({
   backgroundImageUrl,
   className
 }) {
-  const [go, setGo] = React21.useState(false);
-  const [reduced, setReduced] = React21.useState(false);
-  React21.useEffect(() => {
+  const [go, setGo] = React23.useState(false);
+  const [reduced, setReduced] = React23.useState(false);
+  React23.useEffect(() => {
     if (typeof window !== "undefined" && typeof window.matchMedia === "function") {
       setReduced(window.matchMedia("(prefers-reduced-motion: reduce)").matches);
     }
   }, []);
-  React21.useEffect(() => {
+  React23.useEffect(() => {
     if (!exiting) return;
     const raf = requestAnimationFrame(() => setGo(true));
     const timer = setTimeout(() => onExitEnd == null ? void 0 : onExitEnd(), reduced ? 240 : 520);
@@ -8405,6 +8742,7 @@ function GameLoadingBlock({
   CardTitle,
   Carousel,
   CarouselContent,
+  CarouselDots,
   CarouselItem,
   CarouselNext,
   CarouselPrevious,
@@ -8547,7 +8885,9 @@ function GameLoadingBlock({
   Numpad,
   OpenPositionsBlock,
   Pagination,
+  PaginationBar,
   PaginationContent,
+  PaginationDots,
   PaginationEllipsis,
   PaginationItem,
   PaginationLink,
@@ -8569,6 +8909,7 @@ function GameLoadingBlock({
   ResizablePanelGroup,
   ResultBlock,
   ResultDialog,
+  ResultSnackbar,
   ScrollArea,
   ScrollBar,
   SectionMessage,