@olundot/ui 0.19.1 → 0.20.0-next.0

package/dist/index.js

@@ -1009,7 +1009,7 @@ function XIcon({ size }) {
   );
 }
 var Alert = React5.forwardRef(
-  ({ variant = "info", emphasis, title: title2, children, onDismiss, style, ...rest }, ref) => {
+  ({ variant = "info", emphasis, title, children, onDismiss, style, ...rest }, ref) => {
     const weight = emphasis ?? defaultEmphasis(variant);
     const strong = weight === "strong";
     const fg = SEM_FG[variant];
@@ -1042,7 +1042,7 @@ var Alert = React5.forwardRef(
               "aria-hidden": "true",
               "data-slot": "alert-dot",
               style: {
-                marginTop: title2 ? 5 : 4,
+                marginTop: title ? 5 : 4,
                 width: 7,
                 height: 7,
                 flexShrink: 0,
@@ -1052,7 +1052,7 @@ var Alert = React5.forwardRef(
             }
           ),
           /* @__PURE__ */ jsxs5("div", { "data-slot": "alert-content", style: { flex: 1, minWidth: 0 }, children: [
-            title2 ? /* @__PURE__ */ jsx5(
+            title ? /* @__PURE__ */ jsx5(
               "div",
               {
                 "data-slot": "alert-title",
@@ -1063,7 +1063,7 @@ var Alert = React5.forwardRef(
                   lineHeight: 1.35,
                   color: strong ? fg : "var(--text-primary)"
                 },
-                children: title2
+                children: title
               }
             ) : null,
             /* @__PURE__ */ jsx5(
@@ -1071,7 +1071,7 @@ var Alert = React5.forwardRef(
               {
                 "data-slot": "alert-body",
                 style: {
-                  marginTop: title2 ? 2 : 0,
+                  marginTop: title ? 2 : 0,
                   fontFamily: "var(--font-sans)",
                   fontSize: 12.5,
                   lineHeight: 1.45,
@@ -2399,7 +2399,7 @@ var PageHeader = React13.forwardRef(
     className,
     breadcrumb,
     back,
-    title: title2,
+    title,
     headingLevel = 1,
     subtitle,
     meta,
@@ -2443,7 +2443,7 @@ var PageHeader = React13.forwardRef(
               {
                 "data-slot": "page-header-title",
                 className: "max-w-full break-words font-[family-name:var(--font-display)] text-[28px] font-semibold leading-tight text-foreground",
-                children: title2
+                children: title
               }
             ),
             subtitle ? /* @__PURE__ */ jsx14(
@@ -3513,14 +3513,55 @@ var FormLayout = React19.forwardRef(
 FormLayout.displayName = "FormLayout";
 
 // src/components/ui/dialog.tsx
-import * as React22 from "react";
-import { Dialog as DialogPrimitive2 } from "radix-ui";
+import * as React26 from "react";
+import { Dialog as DialogPrimitive3 } from "radix-ui";
 
-// src/lib/use-return-focus.ts
+// src/lib/use-overlay-action.ts
 import * as React20 from "react";
+function useOverlayAction({
+  action,
+  onOpenChange,
+  loading = false,
+  disabled = false,
+  onError
+}) {
+  const [pending, setPending] = React20.useState(false);
+  const busyRef = React20.useRef(false);
+  const isBusy = loading || pending;
+  const guardOpenChange = React20.useCallback(
+    (nextOpen) => {
+      if (!nextOpen && isBusy) {
+        return;
+      }
+      onOpenChange(nextOpen);
+    },
+    [isBusy, onOpenChange]
+  );
+  const run = React20.useCallback(async () => {
+    if (busyRef.current || loading || disabled) {
+      return;
+    }
+    busyRef.current = true;
+    setPending(true);
+    try {
+      await action();
+      onOpenChange(false);
+    } catch (error) {
+      if (!onError) throw error;
+      onError(error);
+    } finally {
+      busyRef.current = false;
+      setPending(false);
+    }
+  }, [action, disabled, loading, onError, onOpenChange]);
+  return { isBusy, run, guardOpenChange };
+}
+
+// src/lib/use-return-focus.ts
+import * as React21 from "react";
 function useReturnFocus() {
-  const returnTo = React20.useRef(null);
-  const onOpenAutoFocus = React20.useCallback((event) => {
+  const returnTo = React21.useRef(null);
+  const onOpenAutoFocus = React21.useCallback((event) => {
     const active = document.activeElement;
     const content = event?.target instanceof HTMLElement ? event.target : null;
     const hasTrigger = !!content?.id && Array.from(document.querySelectorAll("[aria-controls]")).some(
@@ -3528,7 +3569,7 @@ function useReturnFocus() {
     );
     returnTo.current = !hasTrigger && active instanceof HTMLElement && active !== document.body ? active : null;
   }, []);
-  const onCloseAutoFocus = React20.useCallback((event) => {
+  const onCloseAutoFocus = React21.useCallback((event) => {
     const target = returnTo.current;
     returnTo.current = null;
     if (!target?.isConnected) return;
@@ -3540,14 +3581,136 @@ function useReturnFocus() {
   return { onOpenAutoFocus, onCloseAutoFocus };
 }
 
+// src/components/ui/overlay-anatomy.tsx
+import * as React24 from "react";
+import { AlertDialog as AlertDialogPrimitive, Dialog as DialogPrimitive2 } from "radix-ui";
+
+// src/components/ui/overlay-bottom-sheet.tsx
+import * as React22 from "react";
+import { jsx as jsx21 } from "react/jsx-runtime";
+var SWIPE_DISMISS_DISTANCE = 80;
+var SWIPE_DISMISS_VELOCITY = 0.5;
+var SWIPE_MIN_DISTANCE = 16;
+var SWIPE_VELOCITY_WINDOW = 100;
+var NON_DRAG_TARGET = 'button, a[href], input, select, textarea, label, [role="button"], [contenteditable="true"]';
+var matches = (query) => typeof window.matchMedia === "function" && window.matchMedia(query).matches;
+function setOffset(surface, distance) {
+  surface?.style.setProperty("transform", `translateY(${distance}px)`, "important");
+}
+function clearOffset(surface) {
+  surface?.style.removeProperty("transform");
+}
+function useSwipeDismiss({ enabled, onDismiss, surfaceRef, always = false }) {
+  const [dragging, setDragging] = React22.useState(false);
+  const drag = React22.useRef(null);
+  const dismiss = React22.useRef(onDismiss);
+  dismiss.current = onDismiss;
+  const handleProps = React22.useMemo(() => {
+    if (!enabled) return {};
+    const end = (event, release) => {
+      const current = drag.current;
+      if (!current || current.pointerId !== event.pointerId) return;
+      drag.current = null;
+      setDragging(false);
+      if (event.currentTarget.hasPointerCapture?.(event.pointerId)) {
+        event.currentTarget.releasePointerCapture(event.pointerId);
+      }
+      const surface = surfaceRef.current;
+      if (!release) {
+        clearOffset(surface);
+        return;
+      }
+      const now = performance.now();
+      const distance = Math.max(0, event.clientY - current.startY);
+      const from = current.samples.find((sample) => now - sample.t <= SWIPE_VELOCITY_WINDOW) ?? current.samples[current.samples.length - 1];
+      const velocity = from && now > from.t ? (event.clientY - from.y) / (now - from.t) : 0;
+      const closes = distance >= SWIPE_DISMISS_DISTANCE || velocity >= SWIPE_DISMISS_VELOCITY && distance >= SWIPE_MIN_DISTANCE;
+      if (!closes) {
+        clearOffset(surface);
+        return;
+      }
+      dismiss.current();
+      setTimeout(() => {
+        if (surface?.getAttribute("data-state") !== "closed") clearOffset(surface);
+      }, 0);
+    };
+    return {
+      onPointerDown: (event) => {
+        if (drag.current || !event.isPrimary || event.pointerType === "mouse" && event.button !== 0) return;
+        const target = event.target instanceof Element ? event.target.closest(NON_DRAG_TARGET) : null;
+        if (target && event.currentTarget.contains(target)) return;
+        if (!always && !matches("(max-width: 899px)")) return;
+        event.currentTarget.setPointerCapture?.(event.pointerId);
+        drag.current = {
+          pointerId: event.pointerId,
+          startY: event.clientY,
+          follow: !matches("(prefers-reduced-motion: reduce)"),
+          samples: [{ y: event.clientY, t: performance.now() }]
+        };
+        setDragging(true);
+      },
+      onPointerMove: (event) => {
+        const current = drag.current;
+        if (!current || current.pointerId !== event.pointerId) return;
+        const now = performance.now();
+        current.samples.push({ y: event.clientY, t: now });
+        while (current.samples.length > 1 && now - current.samples[0].t > SWIPE_VELOCITY_WINDOW) current.samples.shift();
+        if (current.follow) setOffset(surfaceRef.current, Math.max(0, event.clientY - current.startY));
+      },
+      onPointerUp: (event) => end(event, true),
+      onPointerCancel: (event) => end(event, false)
+    };
+  }, [enabled, always, surfaceRef]);
+  return { handleProps, dragging };
+}
+var overlayBottomSheet = {
+  responsive: cn(
+    "max-[899px]:inset-x-0 max-[899px]:top-auto max-[899px]:bottom-0",
+    "max-[899px]:translate-x-0 max-[899px]:translate-y-0",
+    "max-[899px]:w-full max-[899px]:max-w-none max-[899px]:max-h-[85dvh]",
+    "max-[899px]:rounded-t-[var(--radius-lg)] max-[899px]:rounded-b-none max-[899px]:border-x-0 max-[899px]:border-b-0",
+    "max-[899px]:pb-[env(safe-area-inset-bottom)]",
+    "max-[899px]:motion-safe:data-[state=open]:animate-[olun-sheet-in-from-bottom_var(--dur-slow)_var(--ease-out)_both]",
+    "max-[899px]:motion-safe:data-[state=closed]:animate-[olun-sheet-out-to-bottom_var(--dur-base)_var(--ease-in)_both]"
+  ),
+  always: cn(
+    "inset-x-0 top-auto bottom-0",
+    "w-full max-w-none max-h-[85dvh]",
+    "rounded-t-[var(--radius-lg)] rounded-b-none border-x-0 border-b-0",
+    "pb-[env(safe-area-inset-bottom)]",
+    "motion-safe:data-[state=open]:animate-[olun-sheet-in-from-bottom_var(--dur-slow)_var(--ease-out)_both]",
+    "motion-safe:data-[state=closed]:animate-[olun-sheet-out-to-bottom_var(--dur-base)_var(--ease-in)_both]"
+  )
+};
+function OverlayGrabber({
+  always = false,
+  className,
+  ...handleProps
+}) {
+  return /* @__PURE__ */ jsx21(
+    "div",
+    {
+      "aria-hidden": true,
+      "data-slot": "overlay-grabber",
+      className: cn(
+        "flex shrink-0 touch-none justify-center pt-[var(--space-2)] pb-[var(--space-1)]",
+        !always && "min-[900px]:hidden",
+        className
+      ),
+      ...handleProps,
+      children: /* @__PURE__ */ jsx21("span", { className: "h-1 w-9 rounded-[var(--radius-full)] bg-[var(--border-strong)]" })
+    }
+  );
+}
+
 // src/components/ui/overlay-close-button.tsx
 import { X } from "lucide-react";
 import { Dialog as DialogPrimitive } from "radix-ui";
 
 // src/components/ui/icon-button.tsx
-import * as React21 from "react";
+import * as React23 from "react";
 import { cva as cva9 } from "class-variance-authority";
-import { jsx as jsx21, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx22, jsxs as jsxs20 } from "react/jsx-runtime";
 var iconButtonCva = cva9(
   [
     "olun-icon-button relative inline-flex cursor-pointer shrink-0 items-center justify-center before:absolute before:content-['']",
@@ -3678,7 +3841,7 @@ var iconStrokeWidth = {
   md: 2.25,
   lg: 1.75
 };
-var IconButton = React21.forwardRef(
+var IconButton = React23.forwardRef(
   ({
     className,
     variant = "ghost",
@@ -3690,7 +3853,7 @@ var IconButton = React21.forwardRef(
     badge,
     badgeTone = "info",
     type,
-    title: title2,
+    title,
     "aria-label": ariaLabel,
     "aria-labelledby": ariaLabelledBy,
     iconPosition = "start",
@@ -3702,14 +3865,14 @@ var IconButton = React21.forwardRef(
     const usesAxes = appearance != null || tone != null;
     const isToggle = pressed !== void 0;
     const isPressed = pressed === true;
-    const hoverTitle = title2 ?? (typeof ariaLabel === "string" ? ariaLabel : void 0);
+    const hoverTitle = title ?? (typeof ariaLabel === "string" ? ariaLabel : void 0);
     const text = label ?? children;
     const hasText = text !== void 0 && text !== null && text !== false;
     const style = usesAxes ? resolveActionStyle(appearance, tone, "ghost") : void 0;
     const axisSize = usesAxes ? resolvedSize : void 0;
     const legacySize = resolvedSize;
     const textBoxSize = axisSize ?? textButtonSize[legacySize];
-    const icon = /* @__PURE__ */ jsx21(
+    const icon = /* @__PURE__ */ jsx22(
       Icon,
       {
         "aria-hidden": "true",
@@ -3750,7 +3913,7 @@ var IconButton = React21.forwardRef(
           hasText && iconPosition === "end" ? null : icon,
           hasText ? text : null,
           hasText && iconPosition === "end" ? icon : null,
-          badge !== void 0 ? /* @__PURE__ */ jsx21(
+          badge !== void 0 ? /* @__PURE__ */ jsx22(
             "span",
             {
               "aria-hidden": "true",
@@ -3768,12 +3931,319 @@ var IconButton = React21.forwardRef(
 IconButton.displayName = "IconButton";
 
 // src/components/ui/overlay-close-button.tsx
-import { jsx as jsx22 } from "react/jsx-runtime";
+import { jsx as jsx23 } from "react/jsx-runtime";
 function OverlayCloseButton({
   label = "\uB2EB\uAE30",
   className
 }) {
-  return /* @__PURE__ */ jsx22(DialogPrimitive.Close, { asChild: true, children: /* @__PURE__ */ jsx22(IconButton, { appearance: "ghost", size: "md", icon: X, "aria-label": label, className }) });
+  return /* @__PURE__ */ jsx23(DialogPrimitive.Close, { asChild: true, children: /* @__PURE__ */ jsx23(IconButton, { appearance: "ghost", size: "md", icon: X, "aria-label": label, className }) });
+}
+
+// src/components/ui/overlay-policy.ts
+var OVERLAY_POLICY = {
+  alert: {
+    closeButton: "none",
+    grabber: false,
+    closeOnOutsideClick: false,
+    closeOnEscape: true,
+    busyBlocksClose: true,
+    swipe: false,
+    scroll: "none",
+    footerDivider: false,
+    desktop: "center",
+    mobile: "center",
+    heading: "title"
+  },
+  dialog: {
+    closeButton: "visible",
+    grabber: true,
+    closeOnOutsideClick: false,
+    closeOnEscape: true,
+    busyBlocksClose: true,
+    swipe: true,
+    scroll: "body",
+    footerDivider: true,
+    desktop: "center",
+    mobile: "bottom-sheet",
+    heading: "title"
+  },
+  sheet: {
+    closeButton: "visible",
+    grabber: true,
+    closeOnOutsideClick: true,
+    closeOnEscape: true,
+    busyBlocksClose: false,
+    swipe: true,
+    scroll: "body",
+    footerDivider: true,
+    desktop: "side",
+    mobile: "bottom-sheet",
+    heading: "title"
+  },
+  menu: {
+    closeButton: "hidden",
+    grabber: true,
+    closeOnOutsideClick: true,
+    closeOnEscape: true,
+    busyBlocksClose: false,
+    swipe: true,
+    scroll: "list",
+    footerDivider: false,
+    desktop: "dropdown",
+    mobile: "menu-sheet",
+    heading: "menu"
+  }
+};
+
+// src/components/ui/overlay-anatomy.tsx
+import { jsx as jsx24, jsxs as jsxs21 } from "react/jsx-runtime";
+var overlaySurfaceTone = cn(
+  "bg-[var(--bg-raised)] text-foreground",
+  "border border-[var(--border-subtle)] rounded-[var(--radius-lg)]",
+  "shadow-[var(--shadow-16),inset_0_1px_0_var(--overlay-highlight)]"
+);
+var boxBase = cn("fixed z-[var(--z-modal)] flex flex-col outline-none", overlaySurfaceTone);
+var centerBox = {
+  always: cn(
+    "left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2",
+    "w-[calc(100vw-2rem)] max-h-[calc(100dvh-2rem)]",
+    "scale-100 motion-safe:transition-[scale] motion-safe:duration-[var(--dur-base)] motion-safe:ease-[var(--ease-out)]",
+    "motion-safe:starting:scale-97",
+    "motion-safe:data-[state=closed]:scale-98 motion-safe:data-[state=closed]:duration-[var(--dur-fast)] motion-safe:data-[state=closed]:ease-[var(--ease-in)]",
+    "motion-safe:data-[state=open]:animate-[olun-sheet-fade-in_var(--dur-base)_var(--ease-out)_both]",
+    "motion-safe:data-[state=closed]:animate-[olun-sheet-fade-out_var(--dur-fast)_var(--ease-in)_both]"
+  ),
+  desktop: cn(
+    "min-[900px]:left-1/2 min-[900px]:top-1/2 min-[900px]:-translate-x-1/2 min-[900px]:-translate-y-1/2",
+    "min-[900px]:w-[calc(100vw-2rem)] min-[900px]:max-h-[calc(100dvh-2rem)]",
+    "min-[900px]:scale-100 min-[900px]:motion-safe:transition-[scale] min-[900px]:motion-safe:duration-[var(--dur-base)] min-[900px]:motion-safe:ease-[var(--ease-out)]",
+    "min-[900px]:motion-safe:starting:scale-97",
+    "min-[900px]:motion-safe:data-[state=closed]:scale-98 min-[900px]:motion-safe:data-[state=closed]:duration-[var(--dur-fast)] min-[900px]:motion-safe:data-[state=closed]:ease-[var(--ease-in)]",
+    "min-[900px]:motion-safe:data-[state=open]:animate-[olun-sheet-fade-in_var(--dur-base)_var(--ease-out)_both]",
+    "min-[900px]:motion-safe:data-[state=closed]:animate-[olun-sheet-fade-out_var(--dur-fast)_var(--ease-in)_both]"
+  )
+};
+function overlayBoxClassName(kind) {
+  switch (kind) {
+    case "alert":
+      return cn(boxBase, centerBox.always, overlaySize.alert);
+    case "dialog":
+      return cn(boxBase, centerBox.desktop, overlayBottomSheet.responsive);
+    case "sheet":
+      return cn(boxBase, overlayBottomSheet.responsive);
+    case "menu":
+      return cn(boxBase, overlayBottomSheet.always);
+  }
+}
+var overlaySize = {
+  alert: "max-w-[420px]",
+  dialog: {
+    sm: "max-w-[420px]",
+    md: "max-w-[560px]",
+    lg: "max-w-[720px]"
+  },
+  sheet: {
+    md: "min-[900px]:w-[480px] min-[900px]:max-w-[480px]",
+    lg: "min-[900px]:w-[720px] min-[900px]:max-w-[720px]",
+    full: "min-[900px]:w-[calc(100vw_-_var(--space-8))] min-[900px]:max-w-[calc(100vw_-_var(--space-8))]"
+  }
+};
+var scrimPreset = {
+  dim: "bg-[var(--scrim-dim)]",
+  blur: "bg-[var(--scrim-soft)] [backdrop-filter:var(--scrim-blur)]",
+  root: cn(
+    "bg-[var(--scrim)]",
+    "[:root[data-scrim=dim]_&]:bg-[var(--scrim-dim)]",
+    "[:root[data-scrim=blur]_&]:bg-[var(--scrim-soft)] [:root[data-scrim=blur]_&]:[backdrop-filter:var(--scrim-blur)]"
+  )
+};
+function overlayScrimClassName(scrim) {
+  return scrim ? scrimPreset[scrim] : scrimPreset.root;
+}
+var scrimMotion = {
+  center: cn(
+    "motion-safe:data-[state=open]:animate-[olun-sheet-fade-in_var(--dur-base)_var(--ease-out)_both]",
+    "motion-safe:data-[state=closed]:animate-[olun-sheet-fade-out_var(--dur-fast)_var(--ease-in)_both]"
+  ),
+  responsive: cn(
+    "motion-safe:data-[state=open]:animate-[olun-sheet-fade-in_var(--dur-base)_var(--ease-out)_both]",
+    "motion-safe:data-[state=closed]:animate-[olun-sheet-fade-out_var(--dur-fast)_var(--ease-in)_both]",
+    "max-[899px]:motion-safe:data-[state=open]:animate-[olun-sheet-fade-in_var(--dur-slow)_var(--ease-out)_both]",
+    "max-[899px]:motion-safe:data-[state=closed]:animate-[olun-sheet-fade-out_var(--dur-base)_var(--ease-in)_both]"
+  ),
+  // `motion={false}` side panel: the box is still from 900px, so the scrim is too; below it the
+  // bottom sheet slides and the scrim fades with it.
+  responsiveBelow900: cn(
+    "max-[899px]:motion-safe:data-[state=open]:animate-[olun-sheet-fade-in_var(--dur-slow)_var(--ease-out)_both]",
+    "max-[899px]:motion-safe:data-[state=closed]:animate-[olun-sheet-fade-out_var(--dur-base)_var(--ease-in)_both]"
+  ),
+  sheet: cn(
+    "motion-safe:data-[state=open]:animate-[olun-sheet-fade-in_var(--dur-slow)_var(--ease-out)_both]",
+    "motion-safe:data-[state=closed]:animate-[olun-sheet-fade-out_var(--dur-base)_var(--ease-in)_both]"
+  )
+};
+var scrimMotionOf = {
+  alert: scrimMotion.center,
+  dialog: scrimMotion.responsive,
+  sheet: scrimMotion.responsive,
+  menu: scrimMotion.sheet
+};
+var OverlayScrimLayer = React24.forwardRef(
+  ({ scrim, kind, still, className, ...props }, ref) => {
+    const Overlay = kind === "alert" ? AlertDialogPrimitive.Overlay : DialogPrimitive2.Overlay;
+    return /* @__PURE__ */ jsx24(
+      Overlay,
+      {
+        ref,
+        "data-slot": "overlay-scrim",
+        className: cn(
+          "fixed inset-0 z-[var(--z-modal)]",
+          overlayScrimClassName(scrim),
+          kind && (still ? scrimMotion.responsiveBelow900 : scrimMotionOf[kind]),
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+OverlayScrimLayer.displayName = "OverlayScrimLayer";
+function focusBodyInput(event) {
+  const surface = event.target instanceof HTMLElement ? event.target : null;
+  const input = surface?.querySelector(
+    '[data-slot="overlay-body"] :is(input, textarea, select):not([disabled]):not([type="hidden"])'
+  );
+  if (input) {
+    event.preventDefault();
+    input.focus();
+  }
+}
+var headingClassName = {
+  title: "text-[18px] font-bold leading-snug text-foreground",
+  menu: "text-[15px] font-semibold leading-snug text-foreground"
+};
+var descriptionClassName = {
+  title: "break-keep text-[14px] leading-normal text-text-secondary",
+  menu: "break-keep text-[13px] leading-normal text-text-secondary"
+};
+function OverlayHeader({
+  kind,
+  title,
+  description,
+  caption,
+  actions,
+  closeLabel = "\uB2EB\uAE30",
+  dragHandleProps,
+  id,
+  className
+}) {
+  const policy = OVERLAY_POLICY[kind];
+  const Title = kind === "alert" ? AlertDialogPrimitive.Title : DialogPrimitive2.Title;
+  const Description = kind === "alert" ? AlertDialogPrimitive.Description : DialogPrimitive2.Description;
+  return /* @__PURE__ */ jsxs21(
+    "div",
+    {
+      id,
+      "data-slot": "overlay-header",
+      className: cn(
+        "flex shrink-0 items-start gap-[var(--space-4)] px-[var(--space-6)] pt-[var(--space-6)]",
+        kind === "menu" && "px-[var(--space-4)] pt-[var(--space-2)]",
+        kind !== "menu" && policy.grabber && "max-[899px]:pt-[var(--space-2)]",
+        policy.swipe && "touch-none",
+        className
+      ),
+      ...dragHandleProps,
+      children: [
+        /* @__PURE__ */ jsxs21("div", { className: "flex min-w-0 flex-1 flex-col gap-[var(--space-2)]", children: [
+          caption != null ? /* @__PURE__ */ jsx24("div", { "data-slot": "overlay-caption", className: "flex flex-wrap items-center gap-[var(--space-2)]", children: caption }) : null,
+          /* @__PURE__ */ jsx24(Title, { "data-slot": "overlay-title", className: headingClassName[policy.heading], children: title }),
+          description != null ? /* @__PURE__ */ jsx24(Description, { "data-slot": "overlay-description", className: descriptionClassName[policy.heading], children: description }) : null
+        ] }),
+        actions != null || policy.closeButton === "visible" ? /* @__PURE__ */ jsxs21("div", { "data-slot": "overlay-header-actions", className: "flex shrink-0 items-center gap-[var(--space-1)]", children: [
+          actions,
+          policy.closeButton === "visible" ? /* @__PURE__ */ jsx24(OverlayCloseButton, { label: closeLabel }) : null
+        ] }) : null,
+        policy.closeButton === "hidden" ? /* @__PURE__ */ jsx24(
+          DialogPrimitive2.Close,
+          {
+            "data-slot": "overlay-close-hidden",
+            className: cn(
+              "sr-only",
+              "focus-visible:not-sr-only focus-visible:absolute focus-visible:top-[var(--space-2)] focus-visible:right-[var(--space-4)]",
+              "focus-visible:rounded-[var(--radius-md)] focus-visible:border focus-visible:border-[var(--focus-ring)] focus-visible:bg-[var(--bg-raised)]",
+              "focus-visible:px-[var(--space-3)] focus-visible:py-[var(--space-1)] focus-visible:text-[13px] focus-visible:text-foreground",
+              "focus-visible:outline-none focus-visible:shadow-[0_0_0_2px_var(--focus-ring)]"
+            ),
+            children: closeLabel
+          }
+        ) : null
+      ]
+    }
+  );
+}
+var fogClassName = cn(
+  "pointer-events-none sticky z-[1] block h-[var(--space-6)] shrink-0 opacity-0",
+  "from-[var(--bg-raised)] to-transparent"
+);
+function OverlayBody({ kind, className, children, ...props }) {
+  const { scroll } = OVERLAY_POLICY[kind];
+  if (scroll !== "body") {
+    return /* @__PURE__ */ jsx24(
+      "div",
+      {
+        "data-slot": "overlay-body",
+        className: cn(
+          "min-w-0 px-[var(--space-6)] pt-[var(--space-4)] text-[14px] leading-relaxed text-text-secondary",
+          scroll === "list" && "min-h-0 flex-1 overflow-y-auto px-0",
+          className
+        ),
+        ...props,
+        children
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs21(
+    "div",
+    {
+      "data-slot": "overlay-body",
+      className: "relative flex min-h-0 flex-1 flex-col overflow-y-auto [container-type:scroll-state]",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx24(
+          "span",
+          {
+            "aria-hidden": true,
+            "data-slot": "overlay-fog-top",
+            className: cn(fogClassName, "top-0 -mb-[var(--space-6)] bg-linear-to-b", "[@container_scroll-state(scrollable:top)]:opacity-100")
+          }
+        ),
+        /* @__PURE__ */ jsx24("div", { className: cn("min-w-0 px-[var(--space-6)] py-[var(--space-4)]", className), children }),
+        /* @__PURE__ */ jsx24(
+          "span",
+          {
+            "aria-hidden": true,
+            "data-slot": "overlay-fog-bottom",
+            className: cn(fogClassName, "bottom-0 -mt-[var(--space-6)] bg-linear-to-t", "[@container_scroll-state(scrollable:bottom)]:opacity-100")
+          }
+        )
+      ]
+    }
+  );
+}
+function OverlayFooter({ kind, className, ...props }) {
+  const { footerDivider } = OVERLAY_POLICY[kind];
+  return /* @__PURE__ */ jsx24(
+    "div",
+    {
+      "data-slot": "overlay-footer",
+      className: cn(
+        "flex shrink-0 flex-wrap items-center justify-end gap-[var(--space-2)] px-[var(--space-6)]",
+        footerDivider ? "border-t border-[var(--border-subtle)] py-[var(--space-4)]" : "pt-[var(--space-6)] pb-[var(--space-6)]",
+        className
+      ),
+      ...props
+    }
+  );
 }
 
 // src/components/ui/overlay-surface.ts
@@ -3798,25 +4268,13 @@ var bottomSheet = {
    * `sm:max-w-sm` cap so the bottom sheet spans the full viewport width across the whole
    * < 900px band (not capped to 24rem).
    */
-  sheetMobile: "max-[899px]:inset-x-0 max-[899px]:bottom-0 max-[899px]:top-auto max-[899px]:h-auto max-[899px]:w-full max-[899px]:max-w-none! max-[899px]:border-t max-[899px]:border-l-0 max-[899px]:rounded-none",
-  /** SheetDrawer below 900px: `base` for every width, `full` for `width="full"` / expanded. */
-  detail: {
-    base: cn(
-      "max-[899px]:h-[min(85dvh,720px)] max-[899px]:max-h-[85dvh] max-[899px]:w-full max-[899px]:max-w-none",
-      "max-[899px]:rounded-t-[var(--radius-lg)]"
-    ),
-    full: "max-[899px]:h-[100dvh] max-[899px]:max-h-[100dvh] max-[899px]:rounded-none"
-  },
-  /** ActionSheet, a SheetContent `side="bottom"` at every width. */
-  action: cn(
-    "gap-0 max-h-[85dvh] rounded-t-[var(--radius-lg)]",
-    "pb-[env(safe-area-inset-bottom)]"
-  )
+  sheetMobile: "max-[899px]:inset-x-0 max-[899px]:bottom-0 max-[899px]:top-auto max-[899px]:h-auto max-[899px]:w-full max-[899px]:max-w-none! max-[899px]:border-t max-[899px]:border-l-0 max-[899px]:rounded-none"
 };
 
 // src/components/ui/sheet.tsx
+import * as React25 from "react";
 import { Dialog as SheetPrimitive } from "radix-ui";
-import { jsx as jsx23, jsxs as jsxs21 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs22 } from "react/jsx-runtime";
 var defaultSheetMotionConfig = {
   type: "slide",
   duration: 300,
@@ -3852,23 +4310,98 @@ function getSheetMotionStyle(motionConfig, style) {
 function getDefaultSheetMotionStyle(style) {
   return getSheetMotionStyle(defaultSheetMotionConfig, style);
 }
-function Sheet({ ...props }) {
-  return /* @__PURE__ */ jsx23(SheetPrimitive.Root, { "data-slot": "sheet", ...props });
+function Sheet(props) {
+  if (props.title !== void 0) return /* @__PURE__ */ jsx25(StructuredSheet, { ...props });
+  return /* @__PURE__ */ jsx25(SheetPrimitive.Root, { "data-slot": "sheet", ...props });
+}
+var structuredSheetSide = {
+  right: "min-[900px]:inset-y-0 min-[900px]:right-0 min-[900px]:h-full min-[900px]:rounded-none min-[900px]:border-y-0 min-[900px]:border-r-0",
+  left: "min-[900px]:inset-y-0 min-[900px]:left-0 min-[900px]:h-full min-[900px]:rounded-none min-[900px]:border-y-0 min-[900px]:border-l-0"
+};
+var structuredSheetMotion = {
+  fade: "min-[900px]:motion-safe:data-[state=open]:animate-[olun-sheet-fade-in_var(--sheet-motion-duration)_var(--sheet-motion-easing)_both] min-[900px]:motion-safe:data-[state=closed]:animate-[olun-sheet-fade-out_var(--sheet-motion-duration)_var(--sheet-motion-easing)_both]",
+  right: "min-[900px]:motion-safe:data-[state=open]:animate-[olun-sheet-in-from-right_var(--sheet-motion-duration)_var(--sheet-motion-easing)_both] min-[900px]:motion-safe:data-[state=closed]:animate-[olun-sheet-out-to-right_var(--sheet-motion-duration)_var(--sheet-motion-easing)_both]",
+  left: "min-[900px]:motion-safe:data-[state=open]:animate-[olun-sheet-in-from-left_var(--sheet-motion-duration)_var(--sheet-motion-easing)_both] min-[900px]:motion-safe:data-[state=closed]:animate-[olun-sheet-out-to-left_var(--sheet-motion-duration)_var(--sheet-motion-easing)_both]"
+};
+var preventDefault = (event) => event.preventDefault();
+function StructuredSheet({
+  open,
+  onOpenChange,
+  title,
+  description,
+  caption,
+  headerActions,
+  side = "right",
+  size = "md",
+  children,
+  footer,
+  closeLabel,
+  motion,
+  scrim,
+  className
+}) {
+  const policy = OVERLAY_POLICY.sheet;
+  const motionConfig = resolveSheetMotionConfig(motion);
+  const surfaceRef = React25.useRef(null);
+  const swipe = useSwipeDismiss({ enabled: policy.swipe, onDismiss: () => onOpenChange(false), surfaceRef });
+  const returnFocus = useReturnFocus();
+  return /* @__PURE__ */ jsx25(SheetPrimitive.Root, { open, onOpenChange, children: /* @__PURE__ */ jsxs22(SheetPrimitive.Portal, { children: [
+    /* @__PURE__ */ jsx25(OverlayScrimLayer, { kind: "sheet", scrim, still: motionConfig === false }),
+    /* @__PURE__ */ jsxs22(
+      SheetPrimitive.Content,
+      {
+        ref: surfaceRef,
+        "data-slot": "sheet",
+        className: cn(
+          overlayBoxClassName("sheet"),
+          structuredSheetSide[side],
+          overlaySize.sheet[size],
+          motionConfig && structuredSheetMotion[motionConfig.type === "fade" ? "fade" : side]
+        ),
+        style: getSheetMotionStyle(motionConfig, void 0),
+        ...description == null && { "aria-describedby": void 0 },
+        onOpenAutoFocus: (event) => {
+          returnFocus.onOpenAutoFocus(event);
+          focusBodyInput(event);
+        },
+        onCloseAutoFocus: returnFocus.onCloseAutoFocus,
+        onEscapeKeyDown: policy.closeOnEscape ? void 0 : preventDefault,
+        onInteractOutside: policy.closeOnOutsideClick ? void 0 : preventDefault,
+        children: [
+          policy.grabber ? /* @__PURE__ */ jsx25(OverlayGrabber, { ...swipe.handleProps }) : null,
+          /* @__PURE__ */ jsx25(
+            OverlayHeader,
+            {
+              kind: "sheet",
+              title,
+              description,
+              caption,
+              actions: headerActions,
+              closeLabel,
+              dragHandleProps: swipe.handleProps
+            }
+          ),
+          /* @__PURE__ */ jsx25(OverlayBody, { kind: "sheet", className, children }),
+          footer != null ? /* @__PURE__ */ jsx25(OverlayFooter, { kind: "sheet", children: footer }) : null
+        ]
+      }
+    )
+  ] }) });
 }
 function SheetTrigger({
   ...props
 }) {
-  return /* @__PURE__ */ jsx23(SheetPrimitive.Trigger, { "data-slot": "sheet-trigger", ...props });
+  return /* @__PURE__ */ jsx25(SheetPrimitive.Trigger, { "data-slot": "sheet-trigger", ...props });
 }
 function SheetClose({
   ...props
 }) {
-  return /* @__PURE__ */ jsx23(SheetPrimitive.Close, { "data-slot": "sheet-close", ...props });
+  return /* @__PURE__ */ jsx25(SheetPrimitive.Close, { "data-slot": "sheet-close", ...props });
 }
 function SheetPortal({
   ...props
 }) {
-  return /* @__PURE__ */ jsx23(SheetPrimitive.Portal, { "data-slot": "sheet-portal", ...props });
+  return /* @__PURE__ */ jsx25(SheetPrimitive.Portal, { "data-slot": "sheet-portal", ...props });
 }
 function SheetOverlay({
   className,
@@ -3877,12 +4410,11 @@ function SheetOverlay({
   ...props
 }) {
   const motionConfig = resolveSheetMotionConfig(motion);
-  return /* @__PURE__ */ jsx23(
-    SheetPrimitive.Overlay,
+  return /* @__PURE__ */ jsx25(
+    OverlayScrimLayer,
     {
       "data-slot": "sheet-overlay",
       className: cn(
-        "fixed inset-0 z-[var(--z-modal)] bg-[var(--scrim)]",
         motionConfig && cn(
           "transition-opacity motion-reduce:transition-none",
           "duration-[var(--sheet-motion-duration)]",
@@ -3905,6 +4437,7 @@ function SheetContent({
   mobileSide,
   motion,
   showCloseButton = false,
+  scrim,
   style,
   onOpenAutoFocus,
   onCloseAutoFocus,
@@ -3921,9 +4454,9 @@ function SheetContent({
     onCloseAutoFocus?.(event);
     if (!event.defaultPrevented) returnFocus.onCloseAutoFocus(event);
   };
-  return /* @__PURE__ */ jsxs21(SheetPortal, { children: [
-    /* @__PURE__ */ jsx23(SheetOverlay, { motion: motionConfig }),
-    /* @__PURE__ */ jsxs21(
+  return /* @__PURE__ */ jsxs22(SheetPortal, { children: [
+    /* @__PURE__ */ jsx25(SheetOverlay, { motion: motionConfig, scrim }),
+    /* @__PURE__ */ jsxs22(
       SheetPrimitive.Content,
       {
         "data-slot": "sheet-content",
@@ -3974,14 +4507,14 @@ function SheetContent({
         ...props,
         children: [
           children,
-          showCloseButton && /* @__PURE__ */ jsx23(OverlayCloseButton, { className: "absolute top-4 right-4" })
+          showCloseButton && /* @__PURE__ */ jsx25(OverlayCloseButton, { className: "absolute top-4 right-4" })
         ]
       }
     )
   ] });
 }
 function SheetBody({ className, ...props }) {
-  return /* @__PURE__ */ jsx23(
+  return /* @__PURE__ */ jsx25(
     "div",
     {
       "data-slot": "sheet-body",
@@ -3991,7 +4524,7 @@ function SheetBody({ className, ...props }) {
   );
 }
 function SheetHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx23(
+  return /* @__PURE__ */ jsx25(
     "div",
     {
       "data-slot": "sheet-header",
@@ -4001,7 +4534,7 @@ function SheetHeader({ className, ...props }) {
   );
 }
 function SheetFooter({ className, ...props }) {
-  return /* @__PURE__ */ jsx23(
+  return /* @__PURE__ */ jsx25(
     "div",
     {
       "data-slot": "sheet-footer",
@@ -4014,7 +4547,7 @@ function SheetTitle({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx23(
+  return /* @__PURE__ */ jsx25(
     SheetPrimitive.Title,
     {
       "data-slot": "sheet-title",
@@ -4027,7 +4560,7 @@ function SheetDescription({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx23(
+  return /* @__PURE__ */ jsx25(
     SheetPrimitive.Description,
     {
       "data-slot": "sheet-description",
@@ -4038,45 +4571,144 @@ function SheetDescription({
 }
 
 // src/components/ui/dialog.tsx
-import { jsx as jsx24, jsxs as jsxs22 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx26, jsxs as jsxs23 } from "react/jsx-runtime";
 function dialogMobileSheetStyle(style) {
   return getDefaultSheetMotionStyle(style);
 }
-var DialogModalContext = React22.createContext(true);
-function Dialog({ modal = true, ...props }) {
-  return /* @__PURE__ */ jsx24(DialogModalContext.Provider, { value: modal, children: /* @__PURE__ */ jsx24(DialogPrimitive2.Root, { modal, ...props }) });
+var DialogModalContext = React26.createContext(true);
+function Dialog(props) {
+  if (props.title !== void 0) return /* @__PURE__ */ jsx26(StructuredDialog, { ...props });
+  return /* @__PURE__ */ jsx26(DialogRoot, { ...props });
 }
-var DialogTrigger = DialogPrimitive2.Trigger;
-var DialogPortal = DialogPrimitive2.Portal;
-var DialogClose = DialogPrimitive2.Close;
-var DialogOverlay = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx24(
-  DialogPrimitive2.Overlay,
-  {
-    ref,
-    className: cn(
-      "fixed inset-0 z-[var(--z-modal)]",
-      // 2026: 글래스모피즘 블러 제거 — 단정한 scrim 딤만(FE-skill anti-slop).
-      "bg-[var(--scrim)]",
-      "data-[state=open]:animate-in data-[state=closed]:animate-out",
-      "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-      "motion-reduce:animate-none",
-      className
+var noAction = () => void 0;
+function StructuredDialog({
+  open,
+  onOpenChange,
+  title,
+  description,
+  size = "md",
+  children,
+  footer,
+  onSubmit,
+  onError,
+  submitLabel = "\uC800\uC7A5",
+  cancelLabel = "\uCDE8\uC18C",
+  loading = false,
+  closeLabel = "\uB2EB\uAE30",
+  scrim,
+  className
+}) {
+  const policy = OVERLAY_POLICY.dialog;
+  const formMode = onSubmit !== void 0;
+  const { isBusy, run, guardOpenChange } = useOverlayAction({
+    action: onSubmit ?? noAction,
+    onOpenChange,
+    loading: formMode && loading,
+    onError
+  });
+  const returnFocus = useReturnFocus();
+  const surfaceRef = React26.useRef(null);
+  const swipe = useSwipeDismiss({ enabled: policy.swipe, onDismiss: () => guardOpenChange(false), surfaceRef });
+  const body = /* @__PURE__ */ jsx26(OverlayBody, { kind: "dialog", className, children });
+  const footerRow = formMode ? /* @__PURE__ */ jsxs23(OverlayFooter, { kind: "dialog", children: [
+    /* @__PURE__ */ jsx26(
+      Button,
+      {
+        appearance: "outline",
+        tone: "neutral",
+        size: "lg",
+        className: footerButtonHitAreaClassName,
+        disabled: isBusy,
+        onClick: () => guardOpenChange(false),
+        children: cancelLabel
+      }
     ),
-    ...props
-  }
+    /* @__PURE__ */ jsx26(Button, { type: "submit", appearance: "filled", tone: "primary", size: "lg", className: footerButtonHitAreaClassName, loading: isBusy, children: submitLabel })
+  ] }) : footer != null ? /* @__PURE__ */ jsx26(OverlayFooter, { kind: "dialog", children: footer }) : null;
+  return /* @__PURE__ */ jsx26(DialogPrimitive3.Root, { open, onOpenChange: guardOpenChange, children: /* @__PURE__ */ jsxs23(DialogPrimitive3.Portal, { children: [
+    /* @__PURE__ */ jsx26(OverlayScrimLayer, { kind: "dialog", scrim }),
+    /* @__PURE__ */ jsxs23(
+      DialogPrimitive3.Content,
+      {
+        ref: surfaceRef,
+        className: cn(overlayBoxClassName("dialog"), overlaySize.dialog[size]),
+        ...description == null && { "aria-describedby": void 0 },
+        onOpenAutoFocus: (event) => {
+          returnFocus.onOpenAutoFocus(event);
+          focusBodyInput(event);
+        },
+        onCloseAutoFocus: returnFocus.onCloseAutoFocus,
+        onInteractOutside: policy.closeOnOutsideClick ? void 0 : (event) => event.preventDefault(),
+        onEscapeKeyDown: policy.closeOnEscape ? void 0 : (event) => event.preventDefault(),
+        children: [
+          /* @__PURE__ */ jsx26(OverlayGrabber, { ...swipe.handleProps }),
+          /* @__PURE__ */ jsx26(
+            OverlayHeader,
+            {
+              kind: "dialog",
+              title,
+              description,
+              closeLabel,
+              dragHandleProps: swipe.handleProps
+            }
+          ),
+          formMode ? /* @__PURE__ */ jsxs23(
+            "form",
+            {
+              className: "flex min-h-0 flex-1 flex-col",
+              onSubmit: (event) => {
+                event.preventDefault();
+                void run();
+              },
+              children: [
+                body,
+                footerRow
+              ]
+            }
+          ) : /* @__PURE__ */ jsxs23(Fragment7, { children: [
+            body,
+            footerRow
+          ] })
+        ]
+      }
+    )
+  ] }) });
+}
+function DialogRoot({ modal = true, ...props }) {
+  return /* @__PURE__ */ jsx26(DialogModalContext.Provider, { value: modal, children: /* @__PURE__ */ jsx26(DialogPrimitive3.Root, { modal, ...props }) });
+}
+var DialogTrigger = DialogPrimitive3.Trigger;
+var DialogPortal = DialogPrimitive3.Portal;
+var DialogClose = DialogPrimitive3.Close;
+var DialogOverlay = React26.forwardRef(({ className, ...props }, ref) => (
+  // Position and scrim color come from the shared scrim (overlay-anatomy).
+  /* @__PURE__ */ jsx26(
+    OverlayScrimLayer,
+    {
+      ref,
+      className: cn(
+        "data-[state=open]:animate-in data-[state=closed]:animate-out",
+        "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+        "motion-reduce:animate-none",
+        className
+      ),
+      ...props
+    }
+  )
 ));
-DialogOverlay.displayName = DialogPrimitive2.Overlay.displayName;
-var DialogContent = React22.forwardRef(
+DialogOverlay.displayName = DialogPrimitive3.Overlay.displayName;
+var DialogContent = React26.forwardRef(
   ({
     className,
     children,
     showCloseButton = false,
     mobilePresentation = "center",
+    scrim,
     onOpenAutoFocus,
     onCloseAutoFocus,
     ...props
   }, ref) => {
-    const modal = React22.useContext(DialogModalContext);
+    const modal = React26.useContext(DialogModalContext);
     const returnFocus = useReturnFocus();
     const handleOpenAutoFocus = (event) => {
       if (modal) returnFocus.onOpenAutoFocus(event);
@@ -4086,10 +4718,10 @@ var DialogContent = React22.forwardRef(
       onCloseAutoFocus?.(event);
       if (modal && !event.defaultPrevented) returnFocus.onCloseAutoFocus(event);
     };
-    return /* @__PURE__ */ jsxs22(DialogPortal, { children: [
-      /* @__PURE__ */ jsx24(DialogOverlay, {}),
-      /* @__PURE__ */ jsxs22(
-        DialogPrimitive2.Content,
+    return /* @__PURE__ */ jsxs23(DialogPortal, { children: [
+      /* @__PURE__ */ jsx26(DialogOverlay, { scrim }),
+      /* @__PURE__ */ jsxs23(
+        DialogPrimitive3.Content,
         {
           ref,
           className: cn(
@@ -4119,18 +4751,18 @@ var DialogContent = React22.forwardRef(
           onCloseAutoFocus: handleCloseAutoFocus,
           children: [
             children,
-            showCloseButton ? /* @__PURE__ */ jsx24(OverlayCloseButton, { className: "absolute right-4 top-4" }) : null
+            showCloseButton ? /* @__PURE__ */ jsx26(OverlayCloseButton, { className: "absolute right-4 top-4" }) : null
           ]
         }
       )
     ] });
   }
 );
-DialogContent.displayName = DialogPrimitive2.Content.displayName;
+DialogContent.displayName = DialogPrimitive3.Content.displayName;
 var DialogHeader = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsx24(
+}) => /* @__PURE__ */ jsx26(
   "div",
   {
     className: cn(
@@ -4145,7 +4777,7 @@ DialogHeader.displayName = "DialogHeader";
 var DialogFooter = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsx24(
+}) => /* @__PURE__ */ jsx26(
   "div",
   {
     className: cn(
@@ -4161,8 +4793,8 @@ var DialogFooter = ({
   }
 );
 DialogFooter.displayName = "DialogFooter";
-var DialogTitle = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx24(
-  DialogPrimitive2.Title,
+var DialogTitle = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx26(
+  DialogPrimitive3.Title,
   {
     ref,
     className: cn(
@@ -4172,17 +4804,17 @@ var DialogTitle = React22.forwardRef(({ className, ...props }, ref) => /* @__PUR
     ...props
   }
 ));
-DialogTitle.displayName = DialogPrimitive2.Title.displayName;
-var DialogDescription = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx24(
-  DialogPrimitive2.Description,
+DialogTitle.displayName = DialogPrimitive3.Title.displayName;
+var DialogDescription = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx26(
+  DialogPrimitive3.Description,
   {
     ref,
     className: cn("text-sm text-text-secondary", className),
     ...props
   }
 ));
-DialogDescription.displayName = DialogPrimitive2.Description.displayName;
-var DialogEyebrow = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx24(
+DialogDescription.displayName = DialogPrimitive3.Description.displayName;
+var DialogEyebrow = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx26(
   "p",
   {
     ref,
@@ -4194,251 +4826,189 @@ var DialogEyebrow = React22.forwardRef(({ className, ...props }, ref) => /* @__P
   }
 ));
 DialogEyebrow.displayName = "DialogEyebrow";
-var DialogRawContent = DialogPrimitive2.Content;
+var DialogRawContent = DialogPrimitive3.Content;
 
-// src/lib/use-overlay-action.ts
-import * as React23 from "react";
-function useOverlayAction({
-  action,
+// src/components/ui/form-modal.tsx
+import { jsx as jsx27, jsxs as jsxs24 } from "react/jsx-runtime";
+function FormModal({
+  open,
   onOpenChange,
-  loading = false,
-  disabled = false
+  title,
+  description,
+  children,
+  onSubmit,
+  submitLabel,
+  cancelLabel,
+  wide = false,
+  loading,
+  status
 }) {
-  const [pending, setPending] = React23.useState(false);
-  const busyRef = React23.useRef(false);
-  const isBusy = loading || pending;
-  const guardOpenChange = React23.useCallback(
-    (nextOpen) => {
-      if (!nextOpen && isBusy) {
-        return;
-      }
-      onOpenChange(nextOpen);
-    },
-    [isBusy, onOpenChange]
-  );
-  const run = React23.useCallback(async () => {
-    if (busyRef.current || loading || disabled) {
-      return;
-    }
-    busyRef.current = true;
-    setPending(true);
-    try {
-      await action();
-      onOpenChange(false);
-    } finally {
-      busyRef.current = false;
-      setPending(false);
+  return /* @__PURE__ */ jsxs24(
+    Dialog,
+    {
+      open,
+      onOpenChange,
+      title,
+      description,
+      size: wide ? "lg" : "md",
+      onSubmit,
+      submitLabel,
+      cancelLabel,
+      loading,
+      className: "flex flex-col gap-[var(--space-4)]",
+      children: [
+        status ? /* @__PURE__ */ jsx27("div", { "data-slot": "form-modal-status", children: status }) : null,
+        children
+      ]
     }
-  }, [action, disabled, loading, onOpenChange]);
-  return { isBusy, run, guardOpenChange };
+  );
 }
 
-// src/components/ui/overlay-tokens.ts
-var OVERLAY_WIDTH = {
-  compact: "max-w-[420px]",
-  form: "max-w-[560px]",
-  wide: "max-w-[720px]"
-};
-var OVERLAY_SHADOW = {
-  preset: "shadow-[var(--shadow-4)]"
-};
-
-// src/components/ui/preset-surface.ts
-var title = cn("text-[18px] font-bold leading-snug text-foreground");
-var modalHeader = cn(
-  "flex flex-col gap-[var(--space-2)]",
-  "border-b border-[var(--border-subtle)] pb-[var(--space-4)]",
-  "pr-[40px]"
-);
-var modalDescription = cn("break-keep text-[14px] leading-normal text-text-secondary");
-var modalFooter = cn(
-  "border-t border-[var(--border-subtle)] pt-[var(--space-4)]",
-  "flex flex-col-reverse justify-end gap-[var(--space-2)] sm:flex-row"
-);
-var modalBody = "flex flex-col gap-[var(--space-4)] py-[var(--space-6)]";
-var presetSurface = {
-  form: {
-    content: cn(
-      "w-[calc(100vw-2rem)]",
-      OVERLAY_WIDTH.form,
-      "gap-0 p-[var(--space-6)]",
-      "bg-[var(--bg-surface)]",
-      "border-[var(--border)]",
-      "rounded-[var(--radius-lg)]",
-      OVERLAY_SHADOW.preset,
-      "text-foreground"
-    ),
-    wideContent: OVERLAY_WIDTH.wide,
-    header: modalHeader,
-    title,
-    description: modalDescription,
-    body: modalBody,
-    footer: modalFooter
-  },
-  info: {
-    content: cn(
-      "w-[calc(100vw-2rem)]",
-      OVERLAY_WIDTH.compact,
-      "gap-0 p-[var(--space-6)]",
-      "bg-[var(--bg-surface)]",
-      "border border-[var(--border)]",
-      "rounded-[var(--radius-lg)]",
-      OVERLAY_SHADOW.preset,
-      "text-foreground"
-    ),
-    wideContent: OVERLAY_WIDTH.wide,
-    header: modalHeader,
-    title,
-    description: modalDescription,
-    body: cn(modalBody, "text-[14px] leading-normal text-text-secondary"),
-    footer: modalFooter
-  },
-  confirm: {
-    content: cn(
-      "fixed left-1/2 top-1/2 z-[var(--z-modal)]",
-      "-translate-x-1/2 -translate-y-1/2",
-      "w-[calc(100vw-2rem)]",
-      OVERLAY_WIDTH.compact,
-      "flex flex-col gap-[var(--space-6)]",
-      "bg-[var(--bg-surface)] border border-[var(--border)]",
-      "rounded-[var(--radius-lg)] p-[var(--space-6)]",
-      OVERLAY_SHADOW.preset,
-      "text-foreground"
-    ),
-    title,
-    description: "break-keep text-[14px] leading-relaxed text-text-secondary",
-    body: "min-w-0 text-[14px] leading-relaxed text-text-secondary",
-    footer: "flex items-center justify-end gap-[var(--space-3)]"
-  }
-};
-
-// src/components/ui/form-modal.tsx
-import { jsx as jsx25, jsxs as jsxs23 } from "react/jsx-runtime";
-function FormModal({
+// src/components/ui/alert-dialog.tsx
+import { AlertDialog as AlertDialogPrimitive2 } from "radix-ui";
+import { Fragment as Fragment8, jsx as jsx28, jsxs as jsxs25 } from "react/jsx-runtime";
+function AlertDialogFrame({
   open,
   onOpenChange,
-  title: title2,
+  title,
   description,
   children,
-  onSubmit,
-  submitLabel = "\uC800\uC7A5",
+  scrim,
+  footer
+}) {
+  const returnFocus = useReturnFocus();
+  const onOpenAutoFocus = (event) => {
+    returnFocus.onOpenAutoFocus(event);
+    focusBodyInput(event);
+    if (event.defaultPrevented) return;
+    const surface = event.target instanceof HTMLElement ? event.target : null;
+    const control = surface?.querySelector(
+      '[data-slot="overlay-footer"] :is(button, a[href], [tabindex]):not([disabled]):not([tabindex="-1"])'
+    );
+    if (control) {
+      event.preventDefault();
+      control.focus();
+    }
+  };
+  return /* @__PURE__ */ jsx28(AlertDialogPrimitive2.Root, { open, onOpenChange, children: /* @__PURE__ */ jsxs25(AlertDialogPrimitive2.Portal, { children: [
+    /* @__PURE__ */ jsx28(OverlayScrimLayer, { kind: "alert", scrim }),
+    /* @__PURE__ */ jsxs25(
+      AlertDialogPrimitive2.Content,
+      {
+        className: overlayBoxClassName("alert"),
+        onOpenAutoFocus,
+        onCloseAutoFocus: returnFocus.onCloseAutoFocus,
+        children: [
+          /* @__PURE__ */ jsx28(OverlayHeader, { kind: "alert", title, description }),
+          children != null ? description != null ? /* @__PURE__ */ jsx28(OverlayBody, { kind: "alert", children }) : /* @__PURE__ */ jsx28(AlertDialogPrimitive2.Description, { asChild: true, children: /* @__PURE__ */ jsx28(OverlayBody, { kind: "alert", children }) }) : null,
+          /* @__PURE__ */ jsx28(OverlayFooter, { kind: "alert", children: footer })
+        ]
+      }
+    )
+  ] }) });
+}
+function AlertDialog({
+  open,
+  onOpenChange,
+  title,
+  description,
+  children,
+  scrim,
+  confirmLabel,
+  onConfirm,
+  onError,
   cancelLabel = "\uCDE8\uC18C",
-  wide = false,
+  tone = "neutral",
+  confirmDisabled = false,
   loading = false,
-  status,
-  mobilePresentation = "center"
+  acknowledgeLabel = "\uD655\uC778"
 }) {
   const { isBusy, run, guardOpenChange } = useOverlayAction({
-    action: onSubmit,
+    action: onConfirm ?? noop,
     onOpenChange,
-    loading
+    loading,
+    disabled: confirmDisabled,
+    onError
   });
-  return /* @__PURE__ */ jsx25(Dialog, { open, onOpenChange: guardOpenChange, children: /* @__PURE__ */ jsx25(
-    DialogContent,
+  const footer = confirmLabel != null ? /* @__PURE__ */ jsxs25(Fragment8, { children: [
+    /* @__PURE__ */ jsx28(AlertDialogPrimitive2.Cancel, { asChild: true, children: /* @__PURE__ */ jsx28(Button, { appearance: "outline", tone: "neutral", size: "lg", className: footerButtonHitAreaClassName, disabled: isBusy, children: cancelLabel }) }),
+    /* @__PURE__ */ jsx28(
+      Button,
+      {
+        appearance: "filled",
+        tone: tone === "danger" ? "danger" : "primary",
+        size: "lg",
+        className: footerButtonHitAreaClassName,
+        loading: isBusy,
+        disabled: confirmDisabled,
+        onClick: run,
+        children: confirmLabel
+      }
+    )
+  ] }) : /* @__PURE__ */ jsx28(AlertDialogPrimitive2.Cancel, { asChild: true, children: /* @__PURE__ */ jsx28(Button, { appearance: "outline", tone: "neutral", size: "lg", className: footerButtonHitAreaClassName, children: acknowledgeLabel }) });
+  return /* @__PURE__ */ jsx28(
+    AlertDialogFrame,
     {
-      "data-slot": "form-modal-content",
-      mobilePresentation,
-      className: cn(
-        presetSurface.form.content,
-        wide && presetSurface.form.wideContent
-      ),
-      children: /* @__PURE__ */ jsxs23("form", { "data-slot": "form-modal-form", onSubmit: (event) => {
-        event.preventDefault();
-        return run();
-      }, children: [
-        /* @__PURE__ */ jsxs23("div", { "data-slot": "form-modal-header", className: presetSurface.form.header, children: [
-          /* @__PURE__ */ jsx25(DialogTitle, { className: presetSurface.form.title, children: title2 }),
-          description ? /* @__PURE__ */ jsx25(DialogDescription, { className: presetSurface.form.description, children: description }) : null,
-          status ? /* @__PURE__ */ jsx25("div", { "data-slot": "form-modal-status", children: status }) : null
-        ] }),
-        /* @__PURE__ */ jsx25("div", { "data-slot": "form-modal-body", className: presetSurface.form.body, children }),
-        /* @__PURE__ */ jsxs23(
-          "div",
-          {
-            "data-slot": "form-modal-footer",
-            className: presetSurface.form.footer,
-            children: [
-              /* @__PURE__ */ jsx25(
-                Button,
-                {
-                  variant: "secondary",
-                  size: "lg",
-                  className: footerButtonHitAreaClassName,
-                  disabled: isBusy,
-                  onClick: () => guardOpenChange(false),
-                  children: cancelLabel
-                }
-              ),
-              /* @__PURE__ */ jsx25(Button, { type: "submit", size: "lg", className: footerButtonHitAreaClassName, loading: isBusy, children: submitLabel })
-            ]
-          }
-        )
-      ] })
+      open,
+      onOpenChange: guardOpenChange,
+      title,
+      description,
+      scrim,
+      footer,
+      children
     }
-  ) });
+  );
+}
+function noop() {
 }
 
 // src/components/ui/info-modal.tsx
-import { jsx as jsx26, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx29 } from "react/jsx-runtime";
 function InfoModal({
   open,
   onOpenChange,
-  title: title2,
+  title,
   description,
   children,
   closeLabel = "\uB2EB\uAE30",
-  width = "default",
-  footer,
-  mobilePresentation = "center"
+  footer
 }) {
-  return /* @__PURE__ */ jsx26(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs24(
-    DialogContent,
+  if (footer != null) {
+    return /* @__PURE__ */ jsx29(
+      AlertDialogFrame,
+      {
+        open,
+        onOpenChange,
+        title,
+        description,
+        footer,
+        children
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx29(
+    AlertDialog,
     {
-      "data-slot": "info-modal-content",
-      mobilePresentation,
-      className: cn(
-        presetSurface.info.content,
-        width === "wide" && presetSurface.info.wideContent
-      ),
-      children: [
-        /* @__PURE__ */ jsxs24("div", { "data-slot": "info-modal-header", className: presetSurface.info.header, children: [
-          /* @__PURE__ */ jsx26(DialogTitle, { "data-slot": "info-modal-title", className: presetSurface.info.title, children: title2 }),
-          description ? /* @__PURE__ */ jsx26(
-            DialogDescription,
-            {
-              "data-slot": "info-modal-description",
-              className: presetSurface.info.description,
-              children: description
-            }
-          ) : null
-        ] }),
-        /* @__PURE__ */ jsx26("div", { "data-slot": "info-modal-body", className: presetSurface.info.body, children }),
-        /* @__PURE__ */ jsx26("div", { "data-slot": "info-modal-footer", className: presetSurface.info.footer, children: footer ?? /* @__PURE__ */ jsx26(
-          Button,
-          {
-            "data-slot": "info-modal-close-button",
-            variant: "secondary",
-            size: "lg",
-            className: footerButtonHitAreaClassName,
-            onClick: () => onOpenChange(false),
-            children: closeLabel
-          }
-        ) })
-      ]
+      open,
+      onOpenChange,
+      title,
+      description,
+      acknowledgeLabel: closeLabel,
+      children
     }
-  ) });
+  );
 }
 
 // src/components/ui/filter-toolbar.tsx
-import * as React26 from "react";
+import * as React29 from "react";
 import { SlidersHorizontal } from "lucide-react";
 
 // src/components/ui/chip.tsx
-import * as React24 from "react";
+import * as React27 from "react";
 import { cva as cva10 } from "class-variance-authority";
 import { X as X2 } from "lucide-react";
 import { Slot as Slot2 } from "radix-ui";
-import { jsx as jsx27, jsxs as jsxs25 } from "react/jsx-runtime";
+import { jsx as jsx30, jsxs as jsxs26 } from "react/jsx-runtime";
 var chipVariants = cva10(
   [
     "inline-flex w-fit shrink-0 items-center justify-center whitespace-nowrap",
@@ -4530,7 +5100,7 @@ var chipCountVariants = cva10(
     }
   }
 );
-var Chip = React24.forwardRef(
+var Chip = React27.forwardRef(
   ({
     className,
     variant = "filter",
@@ -4555,7 +5125,7 @@ var Chip = React24.forwardRef(
         value: _value,
         ...spanProps
       } = props;
-      return /* @__PURE__ */ jsxs25(
+      return /* @__PURE__ */ jsxs26(
         "span",
         {
           "data-slot": "chip",
@@ -4564,8 +5134,8 @@ var Chip = React24.forwardRef(
           className: cn(chipVariants({ variant, tone, size, pressed, className })),
           ...spanProps,
           children: [
-            /* @__PURE__ */ jsx27("span", { children }),
-            count !== void 0 ? /* @__PURE__ */ jsx27(
+            /* @__PURE__ */ jsx30("span", { children }),
+            count !== void 0 ? /* @__PURE__ */ jsx30(
               "span",
               {
                 "aria-hidden": "true",
@@ -4575,7 +5145,7 @@ var Chip = React24.forwardRef(
                 children: count
               }
             ) : null,
-            /* @__PURE__ */ jsx27(
+            /* @__PURE__ */ jsx30(
               "button",
               {
                 ref,
@@ -4585,7 +5155,7 @@ var Chip = React24.forwardRef(
                 disabled,
                 onClick,
                 className: "inline-flex size-[var(--space-4)] items-center justify-center rounded-[var(--radius-full)] text-text-tertiary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--focus-ring)]",
-                children: /* @__PURE__ */ jsx27(X2, { "aria-hidden": "true", size: 14, strokeWidth: 2.25 })
+                children: /* @__PURE__ */ jsx30(X2, { "aria-hidden": "true", size: 14, strokeWidth: 2.25 })
               }
             )
           ]
@@ -4593,7 +5163,7 @@ var Chip = React24.forwardRef(
       );
     }
     const Comp = asChild ? Slot2.Root : "button";
-    return /* @__PURE__ */ jsxs25(
+    return /* @__PURE__ */ jsxs26(
       Comp,
       {
         ref,
@@ -4608,7 +5178,7 @@ var Chip = React24.forwardRef(
         ...props,
         children: [
           children,
-          count !== void 0 ? /* @__PURE__ */ jsx27(
+          count !== void 0 ? /* @__PURE__ */ jsx30(
             "span",
             {
               "aria-hidden": "true",
@@ -4626,17 +5196,17 @@ var Chip = React24.forwardRef(
 Chip.displayName = "Chip";
 
 // src/components/ui/popover.tsx
-import * as React25 from "react";
+import * as React28 from "react";
 import { Popover as PopoverPrimitive } from "radix-ui";
-import { jsx as jsx28, jsxs as jsxs26 } from "react/jsx-runtime";
+import { jsx as jsx31, jsxs as jsxs27 } from "react/jsx-runtime";
 function Popover({ modal = false, ...props }) {
-  return /* @__PURE__ */ jsx28(PopoverPrimitive.Root, { modal, ...props });
+  return /* @__PURE__ */ jsx31(PopoverPrimitive.Root, { modal, ...props });
 }
 var popoverArrowClassName = "fill-[var(--bg-surface)] stroke-[var(--border)] [&>polygon]:[vector-effect:non-scaling-stroke]";
 var PopoverTrigger = PopoverPrimitive.Trigger;
 var PopoverAnchor = PopoverPrimitive.Anchor;
 var PopoverClose = PopoverPrimitive.Close;
-var PopoverContent = React25.forwardRef(({ className, align = "center", sideOffset = 8, collisionPadding = 8, showArrow = false, children, ...props }, ref) => /* @__PURE__ */ jsx28(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsxs26(
+var PopoverContent = React28.forwardRef(({ className, align = "center", sideOffset = 8, collisionPadding = 8, showArrow = false, children, ...props }, ref) => /* @__PURE__ */ jsx31(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsxs27(
   PopoverPrimitive.Content,
   {
     ref,
@@ -4660,7 +5230,7 @@ var PopoverContent = React25.forwardRef(({ className, align = "center", sideOffs
     ...props,
     children: [
       children,
-      showArrow ? /* @__PURE__ */ jsx28(
+      showArrow ? /* @__PURE__ */ jsx31(
         PopoverPrimitive.Arrow,
         {
           "data-slot": "popover-arrow",
@@ -4673,164 +5243,21 @@ var PopoverContent = React25.forwardRef(({ className, align = "center", sideOffs
   }
 ) }));
 PopoverContent.displayName = PopoverPrimitive.Content.displayName;
-var PopoverArrow = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx28(
+var PopoverArrow = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx31(
   PopoverPrimitive.Arrow,
   {
     ref,
     "data-slot": "popover-arrow",
-    className: cn(popoverArrowClassName, className),
-    width: 11,
-    height: 5,
-    ...props
-  }
-));
-PopoverArrow.displayName = PopoverPrimitive.Arrow.displayName;
-
-// src/components/ui/sheet-drawer.tsx
-import { Maximize2Icon, Minimize2Icon } from "lucide-react";
-import { jsx as jsx29, jsxs as jsxs27 } from "react/jsx-runtime";
-var sheetDrawerContentClassName = cn(
-  "gap-0 p-0",
-  "bg-[var(--bg-surface)] text-foreground",
-  "border-[var(--border)] shadow-[var(--shadow-16)]",
-  "min-[900px]:w-[480px] min-[900px]:max-w-[480px]",
-  bottomSheet.detail.base
-);
-var sheetDrawerWideContentClassName = "min-[900px]:w-[720px] min-[900px]:max-w-[720px]";
-var sheetDrawerFullContentClassName = cn(
-  "min-[900px]:w-[calc(100vw_-_var(--space-8))] min-[900px]:max-w-[calc(100vw_-_var(--space-8))]",
-  bottomSheet.detail.full
-);
-var sheetDrawerHeaderClassName = cn(
-  "flex items-start justify-between gap-[var(--space-4)]",
-  "border-b border-[var(--border)] px-[var(--space-6)] py-[var(--space-6)]"
-);
-var sheetDrawerHeaderTextClassName = "flex min-w-0 flex-1 flex-col gap-[var(--space-2)]";
-var sheetDrawerCaptionClassName = "flex flex-wrap items-center gap-[var(--space-2)]";
-var sheetDrawerTitleClassName = "text-[18px] font-bold leading-snug text-foreground";
-var sheetDrawerDescriptionClassName = "break-keep text-[14px] leading-normal text-text-secondary";
-var sheetDrawerHeaderActionsClassName = cn(
-  "flex shrink-0 items-center gap-[var(--space-1)]"
-);
-var sheetDrawerExpandButtonClassName = cn(
-  "inline-flex cursor-pointer items-center justify-center gap-[var(--space-1)]",
-  "rounded-[var(--radius-md)] text-text-tertiary transition-colors",
-  "hover:bg-[var(--action-hover)] hover:text-foreground",
-  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--focus-ring)] focus-visible:ring-offset-2",
-  "h-[32px] px-[var(--space-2)]"
-);
-var sheetDrawerBodyClassName = cn(
-  "min-h-0 flex-1 overflow-y-auto",
-  "px-[var(--space-6)] py-[var(--space-6)]"
-);
-var sheetDrawerFooterClassName = cn(
-  "border-t border-[var(--border)] px-[var(--space-6)] py-[var(--space-4)]",
-  "flex justify-end gap-[var(--space-2)]"
-);
-function SheetDrawer({
-  open,
-  onOpenChange,
-  caption,
-  title: title2,
-  description,
-  children,
-  expandHref,
-  onExpand,
-  expandLabel = "\uD06C\uAC8C \uBCF4\uAE30",
-  expanded = false,
-  onExpandedChange,
-  collapseLabel = "\uC791\uAC8C \uBCF4\uAE30",
-  footer,
-  width = "default",
-  motion,
-  closeLabel = "\uB2EB\uAE30"
-}) {
-  const hasExpandedToggle = typeof onExpandedChange === "function";
-  const showExpandAction = Boolean(hasExpandedToggle || expandHref || onExpand);
-  const resolvedWidth = expanded ? "full" : width;
-  const resolvedExpandLabel = hasExpandedToggle && expanded ? collapseLabel : expandLabel;
-  const ExpandActionIcon = hasExpandedToggle && expanded ? Minimize2Icon : Maximize2Icon;
-  return /* @__PURE__ */ jsx29(Sheet, { open, onOpenChange, children: /* @__PURE__ */ jsxs27(
-    SheetContent,
-    {
-      "data-slot": "sheet-drawer-content",
-      side: "right",
-      mobileSide: "bottom",
-      motion,
-      showCloseButton: false,
-      className: cn(
-        sheetDrawerContentClassName,
-        resolvedWidth === "wide" && sheetDrawerWideContentClassName,
-        resolvedWidth === "full" && sheetDrawerFullContentClassName
-      ),
-      children: [
-        /* @__PURE__ */ jsxs27("div", { "data-slot": "sheet-drawer-header", className: sheetDrawerHeaderClassName, children: [
-          /* @__PURE__ */ jsxs27("div", { className: sheetDrawerHeaderTextClassName, children: [
-            caption ? /* @__PURE__ */ jsx29("div", { "data-slot": "sheet-drawer-caption", className: sheetDrawerCaptionClassName, children: caption }) : null,
-            /* @__PURE__ */ jsx29(SheetTitle, { "data-slot": "sheet-drawer-title", className: sheetDrawerTitleClassName, children: title2 }),
-            description ? /* @__PURE__ */ jsx29(
-              SheetDescription,
-              {
-                "data-slot": "sheet-drawer-description",
-                className: sheetDrawerDescriptionClassName,
-                children: description
-              }
-            ) : null
-          ] }),
-          /* @__PURE__ */ jsxs27("div", { "data-slot": "sheet-drawer-header-actions", className: sheetDrawerHeaderActionsClassName, children: [
-            showExpandAction ? hasExpandedToggle ? /* @__PURE__ */ jsxs27(
-              "button",
-              {
-                type: "button",
-                "aria-label": resolvedExpandLabel,
-                "aria-pressed": expanded,
-                "data-slot": "sheet-drawer-expand",
-                "data-expanded": expanded ? "true" : "false",
-                className: sheetDrawerExpandButtonClassName,
-                onClick: () => onExpandedChange(!expanded),
-                children: [
-                  /* @__PURE__ */ jsx29(ExpandActionIcon, { className: "size-[16px]" }),
-                  /* @__PURE__ */ jsx29("span", { className: "hidden text-sm font-medium leading-normal md:inline", children: resolvedExpandLabel })
-                ]
-              }
-            ) : expandHref ? /* @__PURE__ */ jsxs27(
-              "a",
-              {
-                href: expandHref,
-                "aria-label": expandLabel,
-                "data-slot": "sheet-drawer-expand",
-                className: sheetDrawerExpandButtonClassName,
-                children: [
-                  /* @__PURE__ */ jsx29(ExpandActionIcon, { className: "size-[16px]" }),
-                  /* @__PURE__ */ jsx29("span", { className: "hidden text-sm font-medium leading-normal md:inline", children: expandLabel })
-                ]
-              }
-            ) : /* @__PURE__ */ jsxs27(
-              "button",
-              {
-                type: "button",
-                "aria-label": expandLabel,
-                "data-slot": "sheet-drawer-expand",
-                className: sheetDrawerExpandButtonClassName,
-                onClick: onExpand,
-                children: [
-                  /* @__PURE__ */ jsx29(ExpandActionIcon, { className: "size-[16px]" }),
-                  /* @__PURE__ */ jsx29("span", { className: "hidden text-sm font-medium leading-normal md:inline", children: expandLabel })
-                ]
-              }
-            ) : null,
-            /* @__PURE__ */ jsx29(OverlayCloseButton, { label: closeLabel })
-          ] })
-        ] }),
-        /* @__PURE__ */ jsx29("div", { "data-slot": "sheet-drawer-body", className: sheetDrawerBodyClassName, children }),
-        footer ? /* @__PURE__ */ jsx29("div", { "data-slot": "sheet-drawer-footer", className: sheetDrawerFooterClassName, children: footer }) : null
-      ]
-    }
-  ) });
-}
+    className: cn(popoverArrowClassName, className),
+    width: 11,
+    height: 5,
+    ...props
+  }
+));
+PopoverArrow.displayName = PopoverPrimitive.Arrow.displayName;
 
 // src/components/ui/filter-toolbar.tsx
-import { Fragment as Fragment7, jsx as jsx30, jsxs as jsxs28 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx32, jsxs as jsxs28 } from "react/jsx-runtime";
 var collapsibleClassNames = {
   sm: {
     inline: "hidden @[640px]:flex",
@@ -4849,7 +5276,7 @@ var collapsibleClassNames = {
     trigger: "hidden"
   }
 };
-var FilterToolbar = React26.forwardRef(
+var FilterToolbar = React29.forwardRef(
   ({
     className,
     search,
@@ -4864,15 +5291,15 @@ var FilterToolbar = React26.forwardRef(
     actions,
     ...props
   }, ref) => {
-    const [rootElement, setRootElement] = React26.useState(
+    const [rootElement, setRootElement] = React29.useState(
       null
     );
-    const [containerWidth, setContainerWidth] = React26.useState(
+    const [containerWidth, setContainerWidth] = React29.useState(
       null
     );
-    const [overlayOpen, setOverlayOpen] = React26.useState(false);
-    const triggerRef = React26.useRef(null);
-    const setRootRefs = React26.useCallback(
+    const [overlayOpen, setOverlayOpen] = React29.useState(false);
+    const triggerRef = React29.useRef(null);
+    const setRootRefs = React29.useCallback(
       (element) => {
         setRootElement(element);
         if (typeof ref === "function") ref(element);
@@ -4880,7 +5307,7 @@ var FilterToolbar = React26.forwardRef(
       },
       [ref]
     );
-    React26.useEffect(() => {
+    React29.useEffect(() => {
       if (!rootElement) return;
       const updateWidth = () => {
         setContainerWidth(rootElement.getBoundingClientRect().width);
@@ -4891,7 +5318,7 @@ var FilterToolbar = React26.forwardRef(
       observer.observe(rootElement);
       return () => observer.disconnect();
     }, [rootElement]);
-    const handleOverlayOpenChange = React26.useCallback((open) => {
+    const handleOverlayOpenChange = React29.useCallback((open) => {
       setOverlayOpen(open);
       if (!open) queueMicrotask(() => triggerRef.current?.focus());
     }, []);
@@ -4901,7 +5328,7 @@ var FilterToolbar = React26.forwardRef(
     const usesSheet = containerWidth !== null && containerWidth < 640;
     const collapseClasses = collapsibleClassNames[collapseBelow];
     const collapseTriggerLabel = hasAppliedFilters ? `${collapsedLabel}, ${activeFilterCount}\uAC1C \uC801\uC6A9` : collapsedLabel;
-    const clearFiltersButton = onClearFilters ? /* @__PURE__ */ jsx30(
+    const clearFiltersButton = onClearFilters ? /* @__PURE__ */ jsx32(
       "button",
       {
         type: "button",
@@ -4911,7 +5338,7 @@ var FilterToolbar = React26.forwardRef(
         children: "\uD574\uC81C"
       }
     ) : null;
-    const collapsedContent = collapsible ? /* @__PURE__ */ jsx30(
+    const collapsedContent = collapsible ? /* @__PURE__ */ jsx32(
       "div",
       {
         "data-slot": "filter-toolbar-collapsed-content",
@@ -4928,7 +5355,7 @@ var FilterToolbar = React26.forwardRef(
           collapseClasses.trigger
         ),
         children: [
-          /* @__PURE__ */ jsx30(
+          /* @__PURE__ */ jsx32(
             IconButton,
             {
               ref: triggerRef,
@@ -4939,7 +5366,7 @@ var FilterToolbar = React26.forwardRef(
               onClick: () => handleOverlayOpenChange(true)
             }
           ),
-          hasAppliedFilters ? /* @__PURE__ */ jsx30(
+          hasAppliedFilters ? /* @__PURE__ */ jsx32(
             "span",
             {
               "aria-hidden": "true",
@@ -4971,7 +5398,7 @@ var FilterToolbar = React26.forwardRef(
               "data-slot": "filter-toolbar-row",
               className: "flex min-h-[32px] w-full flex-wrap items-center justify-start gap-x-[var(--space-2)] gap-y-[var(--space-2)]",
               children: [
-                search ? /* @__PURE__ */ jsx30(
+                search ? /* @__PURE__ */ jsx32(
                   "div",
                   {
                     "data-slot": "filter-toolbar-search",
@@ -4981,7 +5408,7 @@ var FilterToolbar = React26.forwardRef(
                 ) : null,
                 collapsible && usesSheet ? collapseTrigger : null,
                 collapsible && !usesSheet ? /* @__PURE__ */ jsxs28(Popover, { open: overlayOpen, onOpenChange: handleOverlayOpenChange, children: [
-                  /* @__PURE__ */ jsx30(PopoverAnchor, { asChild: true, children: collapseTrigger }),
+                  /* @__PURE__ */ jsx32(PopoverAnchor, { asChild: true, children: collapseTrigger }),
                   overlayOpen ? /* @__PURE__ */ jsxs28(
                     PopoverContent,
                     {
@@ -4991,14 +5418,14 @@ var FilterToolbar = React26.forwardRef(
                       align: "start",
                       className: "w-[320px]",
                       children: [
-                        /* @__PURE__ */ jsx30("div", { className: "mb-[var(--space-3)] text-sm font-semibold", children: "\uD544\uD130" }),
+                        /* @__PURE__ */ jsx32("div", { className: "mb-[var(--space-3)] text-sm font-semibold", children: "\uD544\uD130" }),
                         collapsedContent,
-                        clearFiltersButton ? /* @__PURE__ */ jsx30("div", { className: "mt-[var(--space-4)] flex justify-end", children: clearFiltersButton }) : null
+                        clearFiltersButton ? /* @__PURE__ */ jsx32("div", { className: "mt-[var(--space-4)] flex justify-end", children: clearFiltersButton }) : null
                       ]
                     }
                   ) : null
                 ] }) : null,
-                filters ? /* @__PURE__ */ jsx30(
+                filters ? /* @__PURE__ */ jsx32(
                   "div",
                   {
                     "data-slot": "filter-toolbar-filters",
@@ -5006,7 +5433,7 @@ var FilterToolbar = React26.forwardRef(
                     children: filters
                   }
                 ) : null,
-                collapsible && !overlayOpen ? /* @__PURE__ */ jsx30(
+                collapsible && !overlayOpen ? /* @__PURE__ */ jsx32(
                   "div",
                   {
                     "data-slot": "filter-toolbar-collapsible",
@@ -5020,8 +5447,8 @@ var FilterToolbar = React26.forwardRef(
               ]
             }
           ) : null,
-          collapsible && usesSheet && overlayOpen ? /* @__PURE__ */ jsx30(
-            SheetDrawer,
+          collapsible && usesSheet && overlayOpen ? /* @__PURE__ */ jsx32(
+            Sheet,
             {
               open: overlayOpen,
               onOpenChange: handleOverlayOpenChange,
@@ -5041,9 +5468,9 @@ var FilterToolbar = React26.forwardRef(
                   activeFilterCount,
                   "\uAC1C \uC801\uC6A9"
                 ] }),
-                onClearFilters ? /* @__PURE__ */ jsxs28(Fragment7, { children: [
-                  /* @__PURE__ */ jsx30("span", { "aria-hidden": "true", children: " \xB7 " }),
-                  /* @__PURE__ */ jsx30(
+                onClearFilters ? /* @__PURE__ */ jsxs28(Fragment9, { children: [
+                  /* @__PURE__ */ jsx32("span", { "aria-hidden": "true", children: " \xB7 " }),
+                  /* @__PURE__ */ jsx32(
                     "button",
                     {
                       type: "button",
@@ -5062,7 +5489,7 @@ var FilterToolbar = React26.forwardRef(
               "data-slot": "filter-toolbar-meta",
               className: "flex min-w-0 flex-wrap items-center justify-end gap-[var(--space-2)]",
               children: [
-                resultSummary ? /* @__PURE__ */ jsx30(
+                resultSummary ? /* @__PURE__ */ jsx32(
                   "div",
                   {
                     "data-slot": "filter-toolbar-summary",
@@ -5070,8 +5497,8 @@ var FilterToolbar = React26.forwardRef(
                     children: resultSummary
                   }
                 ) : null,
-                clearAction ? /* @__PURE__ */ jsx30("div", { "data-slot": "filter-toolbar-clear", className: "shrink-0", children: clearAction }) : null,
-                actions ? /* @__PURE__ */ jsx30(
+                clearAction ? /* @__PURE__ */ jsx32("div", { "data-slot": "filter-toolbar-clear", className: "shrink-0", children: clearAction }) : null,
+                actions ? /* @__PURE__ */ jsx32(
                   "div",
                   {
                     "data-slot": "filter-toolbar-actions",
@@ -5090,16 +5517,16 @@ var FilterToolbar = React26.forwardRef(
 FilterToolbar.displayName = "FilterToolbar";
 
 // src/components/ui/data-table.tsx
-import * as React28 from "react";
+import * as React31 from "react";
 import { ChevronDown as ChevronDown3, ChevronUp as ChevronUp2, ChevronsUpDown } from "lucide-react";
 import { cva as cva12 } from "class-variance-authority";
 
 // src/components/ui/checkbox.tsx
-import * as React27 from "react";
+import * as React30 from "react";
 import { cva as cva11 } from "class-variance-authority";
 import { Check as Check3, Minus } from "lucide-react";
 import { Checkbox as CheckboxPrimitive } from "radix-ui";
-import { jsx as jsx31, jsxs as jsxs29 } from "react/jsx-runtime";
+import { jsx as jsx33, jsxs as jsxs29 } from "react/jsx-runtime";
 var checkboxFieldVariants = cva11(
   "flex flex-col gap-[var(--space-1)]",
   {
@@ -5202,11 +5629,11 @@ var checkboxGroupBoxVariants = cva11(
     }
   }
 );
-var CheckboxGroupContext = React27.createContext(null);
+var CheckboxGroupContext = React30.createContext(null);
 function getLabel(children, label) {
   return children ?? label;
 }
-var Checkbox = React27.forwardRef(
+var Checkbox = React30.forwardRef(
   ({
     className,
     size = "md",
@@ -5224,8 +5651,8 @@ var Checkbox = React27.forwardRef(
     onCheckedChange,
     ...props
   }, ref) => {
-    const group = React27.useContext(CheckboxGroupContext);
-    const generatedId = React27.useId();
+    const group = React30.useContext(CheckboxGroupContext);
+    const generatedId = React30.useId();
     const checkboxId = id ?? generatedId;
     const labelContent = getLabel(children, label);
     const isGrouped = Boolean(group && value != null);
@@ -5267,7 +5694,7 @@ var Checkbox = React27.forwardRef(
           onCheckedChange: handleCheckedChange,
           ...props,
           children: [
-            /* @__PURE__ */ jsx31(
+            /* @__PURE__ */ jsx33(
               "span",
               {
                 "aria-hidden": "true",
@@ -5276,12 +5703,12 @@ var Checkbox = React27.forwardRef(
                   checkboxBoxVariants({ size }),
                   checkboxGroupBoxVariants({ appearance })
                 ),
-                children: /* @__PURE__ */ jsx31(
+                children: /* @__PURE__ */ jsx33(
                   CheckboxPrimitive.Indicator,
                   {
                     "data-slot": "checkbox-indicator",
                     className: "flex items-center justify-center",
-                    children: resolvedChecked === "indeterminate" ? /* @__PURE__ */ jsx31(Minus, { "aria-hidden": "true", size: 14, strokeWidth: 2.5 }) : /* @__PURE__ */ jsx31(Check3, { "aria-hidden": "true", size: 14, strokeWidth: 2.5 })
+                    children: resolvedChecked === "indeterminate" ? /* @__PURE__ */ jsx33(Minus, { "aria-hidden": "true", size: 14, strokeWidth: 2.5 }) : /* @__PURE__ */ jsx33(Check3, { "aria-hidden": "true", size: 14, strokeWidth: 2.5 })
                   }
                 )
               }
@@ -5295,7 +5722,7 @@ var Checkbox = React27.forwardRef(
                   className: "text-sm font-medium leading-snug text-foreground group-disabled:text-text-disabled",
                   children: [
                     labelContent,
-                    required ? /* @__PURE__ */ jsx31(
+                    required ? /* @__PURE__ */ jsx33(
                       "span",
                       {
                         "aria-hidden": "true",
@@ -5307,7 +5734,7 @@ var Checkbox = React27.forwardRef(
                   ]
                 }
               ),
-              error ? /* @__PURE__ */ jsx31(
+              error ? /* @__PURE__ */ jsx33(
                 "span",
                 {
                   id: errorId,
@@ -5316,7 +5743,7 @@ var Checkbox = React27.forwardRef(
                   className: "text-xs font-medium leading-normal text-[var(--error)]",
                   children: error
                 }
-              ) : description ? /* @__PURE__ */ jsx31(
+              ) : description ? /* @__PURE__ */ jsx33(
                 "span",
                 {
                   id: descriptionId,
@@ -5343,7 +5770,7 @@ var Checkbox = React27.forwardRef(
         className: checkboxFieldVariants({ fullWidth }),
         children: [
           /* @__PURE__ */ jsxs29("div", { className: "inline-flex items-center gap-[var(--space-3)]", children: [
-            /* @__PURE__ */ jsx31(
+            /* @__PURE__ */ jsx33(
               CheckboxPrimitive.Root,
               {
                 ref,
@@ -5359,18 +5786,18 @@ var Checkbox = React27.forwardRef(
                 className: cn(checkboxRootVariants(), className),
                 onCheckedChange: handleCheckedChange,
                 ...props,
-                children: /* @__PURE__ */ jsx31(
+                children: /* @__PURE__ */ jsx33(
                   "span",
                   {
                     "aria-hidden": "true",
                     "data-slot": "checkbox-box",
                     className: checkboxBoxVariants({ size }),
-                    children: /* @__PURE__ */ jsx31(
+                    children: /* @__PURE__ */ jsx33(
                       CheckboxPrimitive.Indicator,
                       {
                         "data-slot": "checkbox-indicator",
                         className: "flex items-center justify-center",
-                        children: resolvedChecked === "indeterminate" ? /* @__PURE__ */ jsx31(Minus, { "aria-hidden": "true", size: 14, strokeWidth: 2.5 }) : /* @__PURE__ */ jsx31(Check3, { "aria-hidden": "true", size: 14, strokeWidth: 2.5 })
+                        children: resolvedChecked === "indeterminate" ? /* @__PURE__ */ jsx33(Minus, { "aria-hidden": "true", size: 14, strokeWidth: 2.5 }) : /* @__PURE__ */ jsx33(Check3, { "aria-hidden": "true", size: 14, strokeWidth: 2.5 })
                       }
                     )
                   }
@@ -5386,7 +5813,7 @@ var Checkbox = React27.forwardRef(
                 className: labelClassName,
                 children: [
                   labelContent,
-                  required ? /* @__PURE__ */ jsx31(
+                  required ? /* @__PURE__ */ jsx33(
                     "span",
                     {
                       "aria-hidden": "true",
@@ -5399,7 +5826,7 @@ var Checkbox = React27.forwardRef(
               }
             ) : null
           ] }),
-          error ? /* @__PURE__ */ jsx31(
+          error ? /* @__PURE__ */ jsx33(
             "p",
             {
               id: errorId,
@@ -5408,7 +5835,7 @@ var Checkbox = React27.forwardRef(
               className: "ml-[32px] text-xs font-medium leading-normal text-[var(--error)]",
               children: error
             }
-          ) : description ? /* @__PURE__ */ jsx31(
+          ) : description ? /* @__PURE__ */ jsx33(
             "p",
             {
               id: descriptionId,
@@ -5428,7 +5855,7 @@ var Checkbox = React27.forwardRef(
 Checkbox.displayName = "Checkbox";
 
 // src/components/ui/data-table.tsx
-import { jsx as jsx32, jsxs as jsxs30 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs30 } from "react/jsx-runtime";
 var dataTableVariants = cva12(
   [
     "relative overflow-hidden rounded-[var(--radius-md)] border border-[var(--border-subtle)]",
@@ -5491,7 +5918,7 @@ function getRenderedCell(row, column) {
   if (value === null || value === void 0) {
     return null;
   }
-  if (React28.isValidElement(value)) {
+  if (React31.isValidElement(value)) {
     return value;
   }
   return String(value);
@@ -5531,7 +5958,7 @@ function isInteractiveTarget(target) {
 function SortIcon({ sort, columnKey }) {
   const isActive = sort?.key === columnKey;
   if (!isActive) {
-    return /* @__PURE__ */ jsx32(
+    return /* @__PURE__ */ jsx34(
       ChevronsUpDown,
       {
         "aria-hidden": "true",
@@ -5543,7 +5970,7 @@ function SortIcon({ sort, columnKey }) {
     );
   }
   const Icon = sort.dir === "asc" ? ChevronUp2 : ChevronDown3;
-  return /* @__PURE__ */ jsx32(
+  return /* @__PURE__ */ jsx34(
     Icon,
     {
       "aria-hidden": "true",
@@ -5577,11 +6004,11 @@ function MobileSortControls({
         surfaceClassNames[surface]
       ),
       children: [
-        /* @__PURE__ */ jsx32("span", { className: "text-[12px] font-medium text-text-tertiary", children: "\uC815\uB82C" }),
+        /* @__PURE__ */ jsx34("span", { className: "text-[12px] font-medium text-text-tertiary", children: "\uC815\uB82C" }),
         sortableColumns.map((column) => {
           const active = sortBy?.key === column.key;
           const nextSort = getNextSort(sortBy, column.key);
-          return /* @__PURE__ */ jsx32(
+          return /* @__PURE__ */ jsx34(
             Button,
             {
               type: "button",
@@ -5592,8 +6019,8 @@ function MobileSortControls({
               className: active ? "border-[var(--border-strong)] bg-[var(--action-selected)] hover:border-[var(--border-strong)] hover:bg-[var(--action-selected)]" : void 0,
               onClick: () => onSortChange?.(column.key, nextSort),
               children: /* @__PURE__ */ jsxs30("span", { className: "inline-flex min-w-0 items-center gap-[var(--space-1)]", children: [
-                /* @__PURE__ */ jsx32("span", { className: "truncate", children: column.header }),
-                /* @__PURE__ */ jsx32(SortIcon, { sort: sortBy, columnKey: column.key })
+                /* @__PURE__ */ jsx34("span", { className: "truncate", children: column.header }),
+                /* @__PURE__ */ jsx34(SortIcon, { sort: sortBy, columnKey: column.key })
               ] })
             },
             column.key
@@ -5614,7 +6041,7 @@ function SkeletonRows({
     // 로딩 알림은 그 안의 row/cell 안에 둔다 — 종전에는 컨테이너가 role="status"라
     // aria-required-children(Critical)이 났다.
     /* @__PURE__ */ jsxs30("div", { role: "rowgroup", children: [
-      /* @__PURE__ */ jsx32("div", { role: "row", children: /* @__PURE__ */ jsx32("div", { role: "cell", "aria-colindex": 1, "aria-label": "\uB370\uC774\uD130 \uB85C\uB4DC \uC911", children: /* @__PURE__ */ jsx32("span", { role: "status", className: "sr-only", children: "\uB370\uC774\uD130 \uB85C\uB4DC \uC911" }) }) }),
+      /* @__PURE__ */ jsx34("div", { role: "row", children: /* @__PURE__ */ jsx34("div", { role: "cell", "aria-colindex": 1, "aria-label": "\uB370\uC774\uD130 \uB85C\uB4DC \uC911", children: /* @__PURE__ */ jsx34("span", { role: "status", className: "sr-only", children: "\uB370\uC774\uD130 \uB85C\uB4DC \uC911" }) }) }),
       Array.from({ length: count }, (_, rowIndex) => /* @__PURE__ */ jsxs30(
         "div",
         {
@@ -5622,8 +6049,8 @@ function SkeletonRows({
           className: "grid min-h-[48px] items-center border-t border-[var(--border-subtle)]",
           style: { gridTemplateColumns },
           children: [
-            selectable ? /* @__PURE__ */ jsx32("div", { "aria-hidden": "true", className: "px-[var(--space-4)]" }) : null,
-            columns.map((column, columnIndex) => /* @__PURE__ */ jsx32("div", { className: "px-[var(--space-4)] py-[var(--space-2)]", children: /* @__PURE__ */ jsx32(
+            selectable ? /* @__PURE__ */ jsx34("div", { "aria-hidden": "true", className: "px-[var(--space-4)]" }) : null,
+            columns.map((column, columnIndex) => /* @__PURE__ */ jsx34("div", { className: "px-[var(--space-4)] py-[var(--space-2)]", children: /* @__PURE__ */ jsx34(
               "div",
               {
                 className: cn(
@@ -5640,7 +6067,7 @@ function SkeletonRows({
   );
 }
 function MobileSkeletonCards({ count }) {
-  return /* @__PURE__ */ jsx32(
+  return /* @__PURE__ */ jsx34(
     "div",
     {
       "data-slot": "data-table-mobile-skeleton",
@@ -5653,9 +6080,9 @@ function MobileSkeletonCards({ count }) {
           "data-slot": "data-table-mobile-skeleton-card",
           className: "flex flex-col gap-[var(--space-2)] border-t border-[var(--border-subtle)] px-[var(--space-4)] py-[var(--space-4)]",
           children: [
-            /* @__PURE__ */ jsx32("div", { className: "h-[14px] w-[72%] animate-pulse rounded-[var(--radius-sm)] bg-[var(--bg-inset)]" }),
-            /* @__PURE__ */ jsx32("div", { className: "h-[12px] w-[56%] animate-pulse rounded-[var(--radius-sm)] bg-[var(--bg-inset)]" }),
-            /* @__PURE__ */ jsx32("div", { className: "h-[12px] w-[64%] animate-pulse rounded-[var(--radius-sm)] bg-[var(--bg-inset)]" })
+            /* @__PURE__ */ jsx34("div", { className: "h-[14px] w-[72%] animate-pulse rounded-[var(--radius-sm)] bg-[var(--bg-inset)]" }),
+            /* @__PURE__ */ jsx34("div", { className: "h-[12px] w-[56%] animate-pulse rounded-[var(--radius-sm)] bg-[var(--bg-inset)]" }),
+            /* @__PURE__ */ jsx34("div", { className: "h-[12px] w-[64%] animate-pulse rounded-[var(--radius-sm)] bg-[var(--bg-inset)]" })
           ]
         },
         rowIndex
@@ -5723,7 +6150,7 @@ function DataTableRowView({
       onClick: handlers.onClick,
       onKeyDown: handlers.onKeyDown,
       children: [
-        selectable ? /* @__PURE__ */ jsx32("div", { role: "cell", className: "px-[var(--space-4)]", children: /* @__PURE__ */ jsx32(
+        selectable ? /* @__PURE__ */ jsx34("div", { role: "cell", className: "px-[var(--space-4)]", children: /* @__PURE__ */ jsx34(
           Checkbox,
           {
             "aria-label": `${String(row[columns[0]?.key] ?? rowId)} \uD589 \uC120\uD0DD`,
@@ -5738,7 +6165,7 @@ function DataTableRowView({
         columns.map((column, columnIndex) => {
           const align = column.align ?? "left";
           const content = getRenderedCell(row, column);
-          return /* @__PURE__ */ jsx32(
+          return /* @__PURE__ */ jsx34(
             "div",
             {
               "data-slot": "data-table-cell",
@@ -5749,7 +6176,7 @@ function DataTableRowView({
                 column.tabular ? "font-[family-name:var(--font-display)] tabular-nums" : null,
                 align === "right" ? "text-text-tertiary" : null
               ),
-              children: /* @__PURE__ */ jsx32("span", { className: "min-w-0 truncate", children: linked && columnIndex === 0 && LinkComponent ? /* @__PURE__ */ jsx32(LinkComponent, { href, "data-slot": "data-table-row-link", className: rowLinkClass, children: content }) : content })
+              children: /* @__PURE__ */ jsx34("span", { className: "min-w-0 truncate", children: linked && columnIndex === 0 && LinkComponent ? /* @__PURE__ */ jsx34(LinkComponent, { href, "data-slot": "data-table-row-link", className: rowLinkClass, children: content }) : content })
             },
             column.key
           );
@@ -5804,7 +6231,7 @@ function DataTableMobileCardView({
       onKeyDown: handlers.onKeyDown,
       children: [
         /* @__PURE__ */ jsxs30("div", { className: "flex min-w-0 items-start gap-[var(--space-3)]", children: [
-          selectable ? /* @__PURE__ */ jsx32("div", { "data-slot": "data-table-mobile-card-select", className: "shrink-0 pt-[2px]", children: /* @__PURE__ */ jsx32(
+          selectable ? /* @__PURE__ */ jsx34("div", { "data-slot": "data-table-mobile-card-select", className: "shrink-0 pt-[2px]", children: /* @__PURE__ */ jsx34(
             Checkbox,
             {
               "aria-label": `${primaryText} \uBAA8\uBC14\uC77C \uCE74\uB4DC \uC120\uD0DD`,
@@ -5816,16 +6243,16 @@ function DataTableMobileCardView({
               ] })
             }
           ) }) : null,
-          /* @__PURE__ */ jsx32(
+          /* @__PURE__ */ jsx34(
             "div",
             {
               "data-slot": "data-table-mobile-card-primary",
               className: "min-w-0 flex-1 font-medium text-foreground",
-              children: linked && LinkComponent ? /* @__PURE__ */ jsx32(LinkComponent, { href, "data-slot": "data-table-row-link", className: rowLinkClass, children: primaryContent }) : primaryContent
+              children: linked && LinkComponent ? /* @__PURE__ */ jsx34(LinkComponent, { href, "data-slot": "data-table-row-link", className: rowLinkClass, children: primaryContent }) : primaryContent
             }
           )
         ] }),
-        secondaryColumns.length > 0 ? /* @__PURE__ */ jsx32("dl", { className: "grid min-w-0 gap-[var(--space-2)]", children: secondaryColumns.map((column) => {
+        secondaryColumns.length > 0 ? /* @__PURE__ */ jsx34("dl", { className: "grid min-w-0 gap-[var(--space-2)]", children: secondaryColumns.map((column) => {
           const align = column.align ?? "left";
           return /* @__PURE__ */ jsxs30(
             "div",
@@ -5833,8 +6260,8 @@ function DataTableMobileCardView({
               "data-slot": "data-table-mobile-card-field",
               className: "grid min-w-0 grid-cols-[minmax(0,0.42fr)_minmax(0,1fr)] gap-[var(--space-2)] text-[12px] leading-snug",
               children: [
-                /* @__PURE__ */ jsx32("dt", { className: "min-w-0 text-text-tertiary", children: /* @__PURE__ */ jsx32("span", { className: "truncate", children: column.header }) }),
-                /* @__PURE__ */ jsx32(
+                /* @__PURE__ */ jsx34("dt", { className: "min-w-0 text-text-tertiary", children: /* @__PURE__ */ jsx34("span", { className: "truncate", children: column.header }) }),
+                /* @__PURE__ */ jsx34(
                   "dd",
                   {
                     className: cn(
@@ -5842,7 +6269,7 @@ function DataTableMobileCardView({
                       alignmentClass[align],
                       column.tabular ? "font-[family-name:var(--font-display)] tabular-nums" : null
                     ),
-                    children: /* @__PURE__ */ jsx32("span", { className: "min-w-0 truncate", children: getRenderedCell(row, column) })
+                    children: /* @__PURE__ */ jsx34("span", { className: "min-w-0 truncate", children: getRenderedCell(row, column) })
                   }
                 )
               ]
@@ -5854,9 +6281,9 @@ function DataTableMobileCardView({
     }
   );
 }
-var MemoDataTableRow = React28.memo(DataTableRowView);
-var MemoDataTableMobileCard = React28.memo(DataTableMobileCardView);
-var useIsomorphicLayoutEffect = typeof window === "undefined" ? React28.useEffect : React28.useLayoutEffect;
+var MemoDataTableRow = React31.memo(DataTableRowView);
+var MemoDataTableMobileCard = React31.memo(DataTableMobileCardView);
+var useIsomorphicLayoutEffect = typeof window === "undefined" ? React31.useEffect : React31.useLayoutEffect;
 var VIRTUAL_DEFAULT_OVERSCAN = 8;
 var VIRTUAL_INITIAL_ROWS = 24;
 var VIRTUAL_FALLBACK_SIZE = { desktop: 48, mobile: 120 };
@@ -5879,16 +6306,16 @@ function useVirtualWindow({
   desktopListRef,
   mobileListRef
 }) {
-  const [win, setWin] = React28.useState({
+  const [win, setWin] = React31.useState({
     layout: null,
     start: 0,
     end: VIRTUAL_INITIAL_ROWS,
     size: 0
   });
-  const measuredSize = React28.useRef({ desktop: 0, mobile: 0 });
-  const update = React28.useRef(() => void 0);
-  const reported = React28.useRef("");
-  const latest = React28.useRef({ count, layout: "desktop" });
+  const measuredSize = React31.useRef({ desktop: 0, mobile: 0 });
+  const update = React31.useRef(() => void 0);
+  const reported = React31.useRef("");
+  const latest = React31.useRef({ count, layout: "desktop" });
   update.current = () => {
     if (!enabled) {
       return;
@@ -5935,7 +6362,7 @@ function useVirtualWindow({
   useIsomorphicLayoutEffect(() => {
     update.current();
   });
-  React28.useEffect(() => {
+  React31.useEffect(() => {
     if (!enabled) {
       return;
     }
@@ -5957,7 +6384,7 @@ function useVirtualWindow({
       window.cancelAnimationFrame(frame);
     };
   }, [enabled]);
-  const scrollToIndex = React28.useCallback(
+  const scrollToIndex = React31.useCallback(
     (index) => {
       const { count: rowCount, layout } = latest.current;
       const list = (layout === "desktop" ? desktopListRef : mobileListRef).current;
@@ -6014,10 +6441,10 @@ function DataTableInner({
 }, ref) {
   const virtualOptions = virtual ? virtual === true ? {} : virtual : null;
   const isVirtual = virtualOptions !== null;
-  const desktopRef = React28.useRef(null);
-  const headerRef = React28.useRef(null);
-  const desktopListRef = React28.useRef(null);
-  const mobileListRef = React28.useRef(null);
+  const desktopRef = React31.useRef(null);
+  const headerRef = React31.useRef(null);
+  const desktopListRef = React31.useRef(null);
+  const mobileListRef = React31.useRef(null);
   const { win: virtualWindow, scrollToIndex } = useVirtualWindow({
     enabled: isVirtual,
     count: data.length,
@@ -6028,7 +6455,7 @@ function DataTableInner({
     desktopListRef,
     mobileListRef
   });
-  React28.useImperativeHandle(virtualOptions?.handleRef, () => ({ scrollToIndex }), [scrollToIndex]);
+  React31.useImperativeHandle(virtualOptions?.handleRef, () => ({ scrollToIndex }), [scrollToIndex]);
   const resolvedSelectedIds = selectedIds ?? /* @__PURE__ */ new Set();
   const rowIds = data.map((row) => getRowId(row, keyField));
   const selectedCount = rowIds.filter((id) => resolvedSelectedIds.has(id)).length;
@@ -6063,19 +6490,19 @@ function DataTableInner({
       window.location.assign(href);
     }
   };
-  const latestHandlers = React28.useRef({ toggleRow, activateRow, onRowContextMenu });
+  const latestHandlers = React31.useRef({ toggleRow, activateRow, onRowContextMenu });
   useIsomorphicLayoutEffect(() => {
     latestHandlers.current = { toggleRow, activateRow, onRowContextMenu };
   });
-  const stableToggleRow = React28.useCallback(
+  const stableToggleRow = React31.useCallback(
     (id, checked) => latestHandlers.current.toggleRow(id, checked),
     []
   );
-  const stableActivateRow = React28.useCallback(
+  const stableActivateRow = React31.useCallback(
     (row, href, event) => latestHandlers.current.activateRow(row, href, event),
     []
   );
-  const stableRowContextMenu = React28.useCallback(
+  const stableRowContextMenu = React31.useCallback(
     (rowId, event) => latestHandlers.current.onRowContextMenu?.(rowId, event),
     []
   );
@@ -6133,7 +6560,7 @@ function DataTableInner({
       ),
       ...props,
       children: [
-        selectable && announceSelection ? /* @__PURE__ */ jsx32(
+        selectable && announceSelection ? /* @__PURE__ */ jsx34(
           "div",
           {
             "data-slot": "data-table-selection-status",
@@ -6142,16 +6569,16 @@ function DataTableInner({
             children: selectedCount > 0 ? `${selectedCount.toLocaleString("ko-KR")}${selectionUnit} \uC120\uD0DD\uB428` : ""
           }
         ) : null,
-        loading && data.length > 0 ? /* @__PURE__ */ jsx32(
+        loading && data.length > 0 ? /* @__PURE__ */ jsx34(
           "div",
           {
             "data-slot": "data-table-progress",
             "aria-hidden": "true",
             className: "absolute left-0 right-0 top-0 z-10 h-[2px] overflow-hidden bg-[var(--action-selected)]",
-            children: /* @__PURE__ */ jsx32("div", { className: "h-full w-1/3 animate-pulse bg-[var(--primary)]" })
+            children: /* @__PURE__ */ jsx34("div", { className: "h-full w-1/3 animate-pulse bg-[var(--primary)]" })
           }
         ) : null,
-        /* @__PURE__ */ jsx32("div", { ref: desktopRef, "data-slot": "data-table-desktop", className: "max-md:hidden md:block", children: /* @__PURE__ */ jsxs30(
+        /* @__PURE__ */ jsx34("div", { ref: desktopRef, "data-slot": "data-table-desktop", className: "max-md:hidden md:block", children: /* @__PURE__ */ jsxs30(
           "div",
           {
             role: "table",
@@ -6173,20 +6600,20 @@ function DataTableInner({
                   ),
                   style: { gridTemplateColumns },
                   children: [
-                    selectable ? /* @__PURE__ */ jsx32("div", { role: "columnheader", className: "px-[var(--space-4)]", children: /* @__PURE__ */ jsx32(
+                    selectable ? /* @__PURE__ */ jsx34("div", { role: "columnheader", className: "px-[var(--space-4)]", children: /* @__PURE__ */ jsx34(
                       Checkbox,
                       {
                         "aria-label": "\uC804\uCCB4 \uD589 \uC120\uD0DD",
                         checked: partiallySelected ? "indeterminate" : allVisibleRowsSelected,
                         onCheckedChange: (nextChecked) => toggleAllRows(nextChecked === true),
-                        children: /* @__PURE__ */ jsx32("span", { className: "sr-only", children: "\uC804\uCCB4 \uD589 \uC120\uD0DD" })
+                        children: /* @__PURE__ */ jsx34("span", { className: "sr-only", children: "\uC804\uCCB4 \uD589 \uC120\uD0DD" })
                       }
                     ) }) : null,
                     columns.map((column) => {
                       const align = column.align ?? "left";
                       const nextSort = getNextSort(sortBy, column.key);
                       const ariaSort = sortBy?.key === column.key ? sortBy.dir === "asc" ? "ascending" : "descending" : void 0;
-                      return /* @__PURE__ */ jsx32(
+                      return /* @__PURE__ */ jsx34(
                         "div",
                         {
                           role: "columnheader",
@@ -6206,11 +6633,11 @@ function DataTableInner({
                               ),
                               onClick: () => onSortChange?.(column.key, nextSort),
                               children: [
-                                /* @__PURE__ */ jsx32("span", { className: "truncate", children: column.header }),
-                                /* @__PURE__ */ jsx32(SortIcon, { sort: sortBy, columnKey: column.key })
+                                /* @__PURE__ */ jsx34("span", { className: "truncate", children: column.header }),
+                                /* @__PURE__ */ jsx34(SortIcon, { sort: sortBy, columnKey: column.key })
                               ]
                             }
-                          ) : /* @__PURE__ */ jsx32("span", { className: "truncate", children: column.header })
+                          ) : /* @__PURE__ */ jsx34("span", { className: "truncate", children: column.header })
                         },
                         column.key
                       );
@@ -6218,7 +6645,7 @@ function DataTableInner({
                   ]
                 }
               ),
-              loading && data.length === 0 ? /* @__PURE__ */ jsx32(
+              loading && data.length === 0 ? /* @__PURE__ */ jsx34(
                 SkeletonRows,
                 {
                   columns,
@@ -6229,7 +6656,7 @@ function DataTableInner({
               ) : data.length === 0 ? (
                 /* role="table" 직계 자식은 row/rowgroup이어야 한다. data-slot과 테두리는
                    그대로 유지해 시각 계약을 깨지 않는다(빈 상태에서도 표가 테두리를 그린다). */
-                /* @__PURE__ */ jsx32("div", { role: "rowgroup", children: /* @__PURE__ */ jsx32("div", { role: "row", children: /* @__PURE__ */ jsx32(
+                /* @__PURE__ */ jsx34("div", { role: "rowgroup", children: /* @__PURE__ */ jsx34("div", { role: "row", children: /* @__PURE__ */ jsx34(
                   "div",
                   {
                     role: "cell",
@@ -6239,9 +6666,9 @@ function DataTableInner({
                     children: emptyState
                   }
                 ) }) })
-              ) : /* @__PURE__ */ jsx32("div", { ref: desktopListRef, role: "rowgroup", style: desktopSlice.style, children: desktopSlice.rows.map((row, index) => {
+              ) : /* @__PURE__ */ jsx34("div", { ref: desktopListRef, role: "rowgroup", style: desktopSlice.style, children: desktopSlice.rows.map((row, index) => {
                 const itemProps = getItemProps(row);
-                return /* @__PURE__ */ jsx32(
+                return /* @__PURE__ */ jsx34(
                   RowComponent,
                   {
                     ...itemProps,
@@ -6254,7 +6681,7 @@ function DataTableInner({
             ]
           }
         ) }),
-        /* @__PURE__ */ jsx32(
+        /* @__PURE__ */ jsx34(
           MobileSortControls,
           {
             columns,
@@ -6264,14 +6691,14 @@ function DataTableInner({
             surface
           }
         ),
-        loading && data.length === 0 ? /* @__PURE__ */ jsx32(MobileSkeletonCards, { count: skeletonRowCount }) : data.length === 0 ? /* @__PURE__ */ jsx32(
+        loading && data.length === 0 ? /* @__PURE__ */ jsx34(MobileSkeletonCards, { count: skeletonRowCount }) : data.length === 0 ? /* @__PURE__ */ jsx34(
           "div",
           {
             "data-slot": "data-table-mobile-empty",
             className: "border-t border-[var(--border-subtle)] p-[var(--space-4)] md:hidden",
             children: emptyState
           }
-        ) : /* @__PURE__ */ jsx32(
+        ) : /* @__PURE__ */ jsx34(
           "div",
           {
             ref: mobileListRef,
@@ -6282,7 +6709,7 @@ function DataTableInner({
             style: mobileSlice.style,
             children: mobileSlice.rows.map((row, index) => {
               const itemProps = getItemProps(row);
-              return /* @__PURE__ */ jsx32(
+              return /* @__PURE__ */ jsx34(
                 CardComponent,
                 {
                   ...itemProps,
@@ -6298,27 +6725,27 @@ function DataTableInner({
     }
   );
 }
-var DataTable = React28.forwardRef(DataTableInner);
+var DataTable = React31.forwardRef(DataTableInner);
 DataTable.displayName = "DataTable";
 
 // src/components/ui/dropdown-menu.tsx
 import { CheckIcon, ChevronRightIcon, CircleIcon } from "lucide-react";
 import { DropdownMenu as DropdownMenuPrimitive } from "radix-ui";
-import { jsx as jsx33, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx35, jsxs as jsxs31 } from "react/jsx-runtime";
 function DropdownMenu({
   ...props
 }) {
-  return /* @__PURE__ */ jsx33(DropdownMenuPrimitive.Root, { "data-slot": "dropdown-menu", ...props });
+  return /* @__PURE__ */ jsx35(DropdownMenuPrimitive.Root, { "data-slot": "dropdown-menu", ...props });
 }
 function DropdownMenuPortal({
   ...props
 }) {
-  return /* @__PURE__ */ jsx33(DropdownMenuPrimitive.Portal, { "data-slot": "dropdown-menu-portal", ...props });
+  return /* @__PURE__ */ jsx35(DropdownMenuPrimitive.Portal, { "data-slot": "dropdown-menu-portal", ...props });
 }
 function DropdownMenuTrigger({
   ...props
 }) {
-  return /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsx35(
     DropdownMenuPrimitive.Trigger,
     {
       "data-slot": "dropdown-menu-trigger",
@@ -6331,7 +6758,7 @@ function DropdownMenuContent({
   sideOffset = 4,
   ...props
 }) {
-  return /* @__PURE__ */ jsx33(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsx35(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx35(
     DropdownMenuPrimitive.Content,
     {
       "data-slot": "dropdown-menu-content",
@@ -6354,7 +6781,7 @@ function DropdownMenuContent({
 function DropdownMenuGroup({
   ...props
 }) {
-  return /* @__PURE__ */ jsx33(DropdownMenuPrimitive.Group, { "data-slot": "dropdown-menu-group", ...props });
+  return /* @__PURE__ */ jsx35(DropdownMenuPrimitive.Group, { "data-slot": "dropdown-menu-group", ...props });
 }
 function DropdownMenuItem({
   className,
@@ -6362,7 +6789,7 @@ function DropdownMenuItem({
   variant = "default",
   ...props
 }) {
-  return /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsx35(
     DropdownMenuPrimitive.Item,
     {
       "data-slot": "dropdown-menu-item",
@@ -6405,7 +6832,7 @@ function DropdownMenuCheckboxItem({
       checked,
       ...props,
       children: [
-        /* @__PURE__ */ jsx33("span", { className: "pointer-events-none absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx33(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx33(CheckIcon, { size: 16 }) }) }),
+        /* @__PURE__ */ jsx35("span", { className: "pointer-events-none absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx35(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx35(CheckIcon, { size: 16 }) }) }),
         children
       ]
     }
@@ -6414,7 +6841,7 @@ function DropdownMenuCheckboxItem({
 function DropdownMenuRadioGroup({
   ...props
 }) {
-  return /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsx35(
     DropdownMenuPrimitive.RadioGroup,
     {
       "data-slot": "dropdown-menu-radio-group",
@@ -6442,7 +6869,7 @@ function DropdownMenuRadioItem({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx33("span", { className: "pointer-events-none absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx33(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx33(CircleIcon, { size: 8, className: "fill-current" }) }) }),
+        /* @__PURE__ */ jsx35("span", { className: "pointer-events-none absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx35(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx35(CircleIcon, { size: 8, className: "fill-current" }) }) }),
         children
       ]
     }
@@ -6453,7 +6880,7 @@ function DropdownMenuLabel({
   inset,
   ...props
 }) {
-  return /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsx35(
     DropdownMenuPrimitive.Label,
     {
       "data-slot": "dropdown-menu-label",
@@ -6470,7 +6897,7 @@ function DropdownMenuSeparator({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsx35(
     DropdownMenuPrimitive.Separator,
     {
       "data-slot": "dropdown-menu-separator",
@@ -6483,7 +6910,7 @@ function DropdownMenuShortcut({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsx35(
     "span",
     {
       "data-slot": "dropdown-menu-shortcut",
@@ -6498,7 +6925,7 @@ function DropdownMenuShortcut({
 function DropdownMenuSub({
   ...props
 }) {
-  return /* @__PURE__ */ jsx33(DropdownMenuPrimitive.Sub, { "data-slot": "dropdown-menu-sub", ...props });
+  return /* @__PURE__ */ jsx35(DropdownMenuPrimitive.Sub, { "data-slot": "dropdown-menu-sub", ...props });
 }
 function DropdownMenuSubTrigger({
   className,
@@ -6523,7 +6950,7 @@ function DropdownMenuSubTrigger({
       ...props,
       children: [
         children,
-        /* @__PURE__ */ jsx33(ChevronRightIcon, { className: "ml-auto", size: 16 })
+        /* @__PURE__ */ jsx35(ChevronRightIcon, { className: "ml-auto", size: 16 })
       ]
     }
   );
@@ -6532,7 +6959,7 @@ function DropdownMenuSubContent({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsx35(
     DropdownMenuPrimitive.SubContent,
     {
       "data-slot": "dropdown-menu-sub-content",
@@ -6552,7 +6979,7 @@ function DropdownMenuSubContent({
 }
 
 // src/components/ui/context-menu.tsx
-import { jsx as jsx34, jsxs as jsxs32 } from "react/jsx-runtime";
+import { jsx as jsx36, jsxs as jsxs32 } from "react/jsx-runtime";
 function ContextMenu({
   open,
   onOpenChange,
@@ -6564,7 +6991,7 @@ function ContextMenu({
     return null;
   }
   return /* @__PURE__ */ jsxs32(DropdownMenu, { open, onOpenChange, modal: false, children: [
-    /* @__PURE__ */ jsx34(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx34(
+    /* @__PURE__ */ jsx36(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx36(
       "span",
       {
         "aria-hidden": "true",
@@ -6578,14 +7005,14 @@ function ContextMenu({
         }
       }
     ) }),
-    /* @__PURE__ */ jsx34(DropdownMenuContent, { ...contentProps, children })
+    /* @__PURE__ */ jsx36(DropdownMenuContent, { ...contentProps, children })
   ] });
 }
 
 // src/components/ui/bulk-action-bar.tsx
-import * as React29 from "react";
+import * as React32 from "react";
 import { X as X3 } from "lucide-react";
-import { jsx as jsx35, jsxs as jsxs33 } from "react/jsx-runtime";
+import { jsx as jsx37, jsxs as jsxs33 } from "react/jsx-runtime";
 function ActionButton({ action }) {
   const danger = action.variant === "destructive";
   const off = action.disabled;
@@ -6617,7 +7044,7 @@ function ActionButton({ action }) {
         whiteSpace: "nowrap"
       },
       children: [
-        Icon ? /* @__PURE__ */ jsx35(
+        Icon ? /* @__PURE__ */ jsx37(
           Icon,
           {
             "aria-hidden": "true",
@@ -6632,7 +7059,7 @@ function ActionButton({ action }) {
   );
 }
 function Divider() {
-  return /* @__PURE__ */ jsx35(
+  return /* @__PURE__ */ jsx37(
     "span",
     {
       "aria-hidden": "true",
@@ -6647,7 +7074,7 @@ function Divider() {
   );
 }
 function ClearButton({ onClear }) {
-  return /* @__PURE__ */ jsx35(
+  return /* @__PURE__ */ jsx37(
     "button",
     {
       type: "button",
@@ -6669,7 +7096,7 @@ function ClearButton({ onClear }) {
         justifyContent: "center",
         borderRadius: "var(--radius-md)"
       },
-      children: /* @__PURE__ */ jsx35(X3, { size: 16, strokeWidth: 1.75, "aria-hidden": "true" })
+      children: /* @__PURE__ */ jsx37(X3, { size: 16, strokeWidth: 1.75, "aria-hidden": "true" })
     }
   );
 }
@@ -6724,10 +7151,10 @@ var idleLineStyle = {
   fontVariantNumeric: "tabular-nums",
   color: "var(--text-secondary)"
 };
-var useIsomorphicLayoutEffect2 = typeof window === "undefined" ? React29.useEffect : React29.useLayoutEffect;
+var useIsomorphicLayoutEffect2 = typeof window === "undefined" ? React32.useEffect : React32.useLayoutEffect;
 function useCompactSummary(slot, enabled) {
-  const [fullWidth, setFullWidth] = React29.useState(null);
-  const measure = React29.useCallback(() => {
+  const [fullWidth, setFullWidth] = React32.useState(null);
+  const measure = React32.useCallback(() => {
     if (!slot) return;
     setFullWidth((prev) => {
       if (prev === null) return slot.scrollWidth > slot.clientWidth ? slot.scrollWidth : null;
@@ -6737,7 +7164,7 @@ function useCompactSummary(slot, enabled) {
   useIsomorphicLayoutEffect2(() => {
     if (enabled) measure();
   });
-  React29.useEffect(() => {
+  React32.useEffect(() => {
     if (!enabled || !slot || typeof ResizeObserver === "undefined") return;
     const observer = new ResizeObserver(measure);
     observer.observe(slot);
@@ -6761,7 +7188,7 @@ function BulkActionBar({
   ...props
 }) {
   const inline = placement === "inline";
-  const trailingSlot = trailing !== void 0 && trailing !== null ? /* @__PURE__ */ jsx35(
+  const trailingSlot = trailing !== void 0 && trailing !== null ? /* @__PURE__ */ jsx37(
     "div",
     {
       "data-slot": "bulk-action-bar-trailing",
@@ -6774,7 +7201,7 @@ function BulkActionBar({
       children: trailing
     }
   ) : null;
-  const [summaryElement, setSummaryElement] = React29.useState(null);
+  const [summaryElement, setSummaryElement] = React32.useState(null);
   const compact = useCompactSummary(
     summaryElement,
     inline && compactSummary !== void 0 && compactSummary !== null
@@ -6790,7 +7217,7 @@ function BulkActionBar({
         style: { ...idleLineStyle, overflow: "visible", ...style },
         ...props,
         children: [
-          /* @__PURE__ */ jsx35(
+          /* @__PURE__ */ jsx37(
             "div",
             {
               role: "status",
@@ -6812,7 +7239,7 @@ function BulkActionBar({
     );
   }
   if (count === 0 && idleContent !== void 0) {
-    return /* @__PURE__ */ jsx35(
+    return /* @__PURE__ */ jsx37(
       "div",
       {
         role: "status",
@@ -6829,7 +7256,7 @@ function BulkActionBar({
   if (count === 0 && emptyHint === void 0) {
     return null;
   }
-  const countLabel = /* @__PURE__ */ jsx35(
+  const countLabel = /* @__PURE__ */ jsx37(
     "span",
     {
       "data-slot": "bulk-action-bar-count",
@@ -6846,7 +7273,7 @@ function BulkActionBar({
       children: count > 0 ? `${count.toLocaleString("ko-KR")}${unit} \uC120\uD0DD\uB428` : emptyHint
     }
   );
-  const summarySlot = summary !== void 0 && summary !== null ? /* @__PURE__ */ jsx35(
+  const summarySlot = summary !== void 0 && summary !== null ? /* @__PURE__ */ jsx37(
     "span",
     {
       ref: setSummaryElement,
@@ -6880,7 +7307,7 @@ function BulkActionBar({
       children: compact ? compactSummary : summary
     }
   ) : null;
-  const actionGroup = /* @__PURE__ */ jsx35(
+  const actionGroup = /* @__PURE__ */ jsx37(
     "div",
     {
       "data-slot": "bulk-action-bar-actions",
@@ -6892,7 +7319,7 @@ function BulkActionBar({
         justifyContent: "flex-end",
         gap: 2
       },
-      children: actions.map((action) => /* @__PURE__ */ jsx35(ActionButton, { action }, action.key))
+      children: actions.map((action) => /* @__PURE__ */ jsx37(ActionButton, { action }, action.key))
     }
   );
   if (inline) {
@@ -6936,10 +7363,10 @@ function BulkActionBar({
                 gap: "var(--space-1)"
               },
               children: [
-                count > 0 && actions.length > 0 ? /* @__PURE__ */ jsx35(Divider, {}) : null,
+                count > 0 && actions.length > 0 ? /* @__PURE__ */ jsx37(Divider, {}) : null,
                 actionGroup,
-                /* @__PURE__ */ jsx35(Divider, {}),
-                /* @__PURE__ */ jsx35(ClearButton, { onClear })
+                /* @__PURE__ */ jsx37(Divider, {}),
+                /* @__PURE__ */ jsx37(ClearButton, { onClear })
               ]
             }
           ),
@@ -6980,10 +7407,10 @@ function BulkActionBar({
             ]
           }
         ),
-        count > 0 && actions.length > 0 ? /* @__PURE__ */ jsx35(Divider, {}) : null,
+        count > 0 && actions.length > 0 ? /* @__PURE__ */ jsx37(Divider, {}) : null,
         actionGroup,
-        /* @__PURE__ */ jsx35(Divider, {}),
-        /* @__PURE__ */ jsx35(ClearButton, { onClear }),
+        /* @__PURE__ */ jsx37(Divider, {}),
+        /* @__PURE__ */ jsx37(ClearButton, { onClear }),
         trailingSlot
       ]
     }
@@ -6991,110 +7418,50 @@ function BulkActionBar({
 }
 
 // src/components/ui/confirm-dialog.tsx
-import { Fragment as Fragment8, jsx as jsx36, jsxs as jsxs34 } from "react/jsx-runtime";
+import { jsx as jsx38 } from "react/jsx-runtime";
 function ConfirmDialog({
   open,
   onOpenChange,
-  title: title2,
+  title,
   description,
   tone = "default",
   confirmLabel,
-  cancelLabel = "\uCDE8\uC18C",
+  cancelLabel,
   onConfirm,
-  loading = false,
+  loading,
   children,
-  confirmDisabled = false,
-  mobilePresentation = "center"
+  confirmDisabled,
+  scrim
 }) {
-  const returnFocus = useReturnFocus();
-  const { isBusy, run, guardOpenChange } = useOverlayAction({
-    action: onConfirm,
-    onOpenChange,
-    loading,
-    disabled: confirmDisabled
-  });
-  const dialogBody = /* @__PURE__ */ jsxs34(Fragment8, { children: [
-    /* @__PURE__ */ jsx36("div", { className: "flex items-start justify-between gap-[var(--space-4)]", children: /* @__PURE__ */ jsxs34("div", { className: "min-w-0 space-y-[var(--space-2)]", children: [
-      /* @__PURE__ */ jsx36(
-        DialogTitle,
-        {
-          "data-slot": "dialog-title",
-          className: presetSurface.confirm.title,
-          children: title2
-        }
-      ),
-      description ? /* @__PURE__ */ jsx36(
-        DialogDescription,
-        {
-          "data-slot": "dialog-description",
-          className: presetSurface.confirm.description,
-          children: description
-        }
-      ) : null
-    ] }) }),
-    children != null ? /* @__PURE__ */ jsx36("div", { "data-slot": "confirm-dialog-body", className: presetSurface.confirm.body, children }) : null,
-    /* @__PURE__ */ jsxs34(
-      "div",
-      {
-        "data-slot": "dialog-footer",
-        className: presetSurface.confirm.footer,
-        children: [
-          /* @__PURE__ */ jsx36(
-            Button,
-            {
-              variant: "secondary",
-              size: "lg",
-              className: footerButtonHitAreaClassName,
-              disabled: isBusy,
-              onClick: () => guardOpenChange(false),
-              children: cancelLabel
-            }
-          ),
-          /* @__PURE__ */ jsx36(
-            Button,
-            {
-              variant: tone === "destructive" ? "destructive" : "primary",
-              size: "lg",
-              className: footerButtonHitAreaClassName,
-              loading: isBusy,
-              disabled: confirmDisabled,
-              onClick: run,
-              children: confirmLabel
-            }
-          )
-        ]
-      }
-    )
-  ] });
-  return /* @__PURE__ */ jsx36(Dialog, { open, onOpenChange: guardOpenChange, children: /* @__PURE__ */ jsxs34(DialogPortal, { children: [
-    /* @__PURE__ */ jsx36(DialogOverlay, {}),
-    /* @__PURE__ */ jsx36(
-      DialogRawContent,
-      {
-        role: "alertdialog",
-        "data-slot": "dialog-content",
-        className: cn(
-          presetSurface.confirm.content,
-          mobilePresentation === "sheet" && bottomSheet.dialog
-        ),
-        style: mobilePresentation === "sheet" ? dialogMobileSheetStyle() : void 0,
-        ...returnFocus,
-        children: dialogBody
-      }
-    )
-  ] }) });
+  return /* @__PURE__ */ jsx38(
+    AlertDialog,
+    {
+      open,
+      onOpenChange,
+      title,
+      description,
+      tone: tone === "destructive" ? "danger" : "neutral",
+      confirmLabel,
+      cancelLabel,
+      onConfirm,
+      loading,
+      confirmDisabled,
+      scrim,
+      children
+    }
+  );
 }
 
 // src/components/ui/separator.tsx
 import { Separator as SeparatorPrimitive } from "radix-ui";
-import { jsx as jsx37 } from "react/jsx-runtime";
+import { jsx as jsx39 } from "react/jsx-runtime";
 function Separator2({
   className,
   orientation = "horizontal",
   decorative = true,
   ...props
 }) {
-  return /* @__PURE__ */ jsx37(
+  return /* @__PURE__ */ jsx39(
     SeparatorPrimitive.Root,
     {
       "data-slot": "separator",
@@ -7111,13 +7478,13 @@ function Separator2({
 
 // src/components/ui/avatar.tsx
 import { Avatar as AvatarPrimitive } from "radix-ui";
-import { jsx as jsx38 } from "react/jsx-runtime";
+import { jsx as jsx40 } from "react/jsx-runtime";
 function Avatar({
   className,
   size = "md",
   ...props
 }) {
-  return /* @__PURE__ */ jsx38(
+  return /* @__PURE__ */ jsx40(
     AvatarPrimitive.Root,
     {
       "data-slot": "avatar",
@@ -7138,7 +7505,7 @@ function AvatarImage({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx38(
+  return /* @__PURE__ */ jsx40(
     AvatarPrimitive.Image,
     {
       "data-slot": "avatar-image",
@@ -7163,7 +7530,7 @@ function AvatarFallback({
   ...props
 }) {
   const fallbackText = children ?? (name ? getAvatarFallbackText(name) : null);
-  return /* @__PURE__ */ jsx38(
+  return /* @__PURE__ */ jsx40(
     AvatarPrimitive.Fallback,
     {
       "data-slot": "avatar-fallback",
@@ -7180,95 +7547,327 @@ function AvatarFallback({
   );
 }
 
-// src/components/ui/action-sheet.tsx
-import * as React30 from "react";
-import { jsx as jsx39, jsxs as jsxs35 } from "react/jsx-runtime";
-var actionSheetHeaderClassName = cn(
-  "flex items-start gap-[var(--space-3)] px-[var(--space-4)] pt-[var(--space-4)] pb-[var(--space-3)]"
-);
-var actionSheetTitleClassName = cn(
-  "break-keep text-[15px] font-semibold leading-snug text-foreground"
-);
-var actionSheetDescriptionClassName = cn(
-  "mt-[var(--space-1)] break-keep text-[13px] leading-normal text-text-secondary"
+// src/components/ui/sheet-drawer.tsx
+import { Maximize2Icon, Minimize2Icon } from "lucide-react";
+import { jsx as jsx41, jsxs as jsxs34 } from "react/jsx-runtime";
+var expandButtonClassName = cn(
+  "inline-flex cursor-pointer items-center justify-center gap-[var(--space-1)]",
+  "rounded-[var(--radius-md)] text-text-tertiary transition-colors",
+  "hover:bg-[var(--action-hover)] hover:text-foreground",
+  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--focus-ring)] focus-visible:ring-offset-2",
+  "h-[32px] px-[var(--space-2)]"
 );
-var actionSheetListClassName = "min-h-0 overflow-y-auto";
-var actionSheetItemClassName = cn(
-  "flex min-h-12 w-full cursor-pointer items-center gap-[var(--space-3)] px-[var(--space-4)] text-left",
-  "border-t border-[var(--border-subtle)] text-[13px] font-medium text-text-primary",
+var sizeOfWidth = {
+  default: "md",
+  wide: "lg",
+  full: "full"
+};
+function SheetDrawer({
+  open,
+  onOpenChange,
+  caption,
+  title,
+  description,
+  children,
+  expandHref,
+  onExpand,
+  expandLabel = "\uD06C\uAC8C \uBCF4\uAE30",
+  expanded = false,
+  onExpandedChange,
+  collapseLabel = "\uC791\uAC8C \uBCF4\uAE30",
+  footer,
+  width = "default",
+  motion,
+  closeLabel = "\uB2EB\uAE30"
+}) {
+  const hasExpandedToggle = typeof onExpandedChange === "function";
+  const showExpandAction = Boolean(hasExpandedToggle || expandHref || onExpand);
+  const resolvedExpandLabel = hasExpandedToggle && expanded ? collapseLabel : expandLabel;
+  const ExpandActionIcon = hasExpandedToggle && expanded ? Minimize2Icon : Maximize2Icon;
+  const expandAction = showExpandAction ? hasExpandedToggle ? /* @__PURE__ */ jsxs34(
+    "button",
+    {
+      type: "button",
+      "aria-label": resolvedExpandLabel,
+      "aria-pressed": expanded,
+      "data-slot": "sheet-drawer-expand",
+      "data-expanded": expanded ? "true" : "false",
+      className: expandButtonClassName,
+      onClick: () => onExpandedChange(!expanded),
+      children: [
+        /* @__PURE__ */ jsx41(ExpandActionIcon, { className: "size-[16px]" }),
+        /* @__PURE__ */ jsx41("span", { className: "hidden text-sm font-medium leading-normal md:inline", children: resolvedExpandLabel })
+      ]
+    }
+  ) : expandHref ? /* @__PURE__ */ jsxs34("a", { href: expandHref, "aria-label": expandLabel, "data-slot": "sheet-drawer-expand", className: expandButtonClassName, children: [
+    /* @__PURE__ */ jsx41(ExpandActionIcon, { className: "size-[16px]" }),
+    /* @__PURE__ */ jsx41("span", { className: "hidden text-sm font-medium leading-normal md:inline", children: expandLabel })
+  ] }) : /* @__PURE__ */ jsxs34(
+    "button",
+    {
+      type: "button",
+      "aria-label": expandLabel,
+      "data-slot": "sheet-drawer-expand",
+      className: expandButtonClassName,
+      onClick: onExpand,
+      children: [
+        /* @__PURE__ */ jsx41(ExpandActionIcon, { className: "size-[16px]" }),
+        /* @__PURE__ */ jsx41("span", { className: "hidden text-sm font-medium leading-normal md:inline", children: expandLabel })
+      ]
+    }
+  ) : void 0;
+  return /* @__PURE__ */ jsx41(
+    Sheet,
+    {
+      open,
+      onOpenChange,
+      title,
+      description: description || void 0,
+      caption: caption || void 0,
+      headerActions: expandAction,
+      size: expanded ? "full" : sizeOfWidth[width],
+      footer: footer || void 0,
+      motion,
+      closeLabel,
+      children
+    }
+  );
+}
+
+// src/components/ui/action-menu.tsx
+import * as React33 from "react";
+import { Dialog as DialogPrimitive4, Slot as Slot3 } from "radix-ui";
+import { Fragment as Fragment11, jsx as jsx42, jsxs as jsxs35 } from "react/jsx-runtime";
+var sheetRowClassName = cn(
+  "group flex min-h-12 w-full cursor-pointer items-center gap-[var(--space-3)] px-[var(--space-4)] py-[var(--space-2)] text-left",
+  "border-t border-[var(--border-subtle)] text-[13px] font-medium leading-normal text-text-primary",
   "transition-colors motion-reduce:transition-none hover:bg-[var(--action-hover)]",
   "focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-[var(--focus-ring)]",
   "enabled:data-[destructive]:text-[var(--semantic-error-fg)]",
   "disabled:cursor-not-allowed disabled:bg-[var(--action-disabled-bg)] disabled:text-text-disabled"
 );
-function ActionSheet({
+var sheetRowDescriptionClassName = "block text-[12px] font-normal text-text-secondary group-disabled:text-text-disabled";
+var sheetGroupLabelClassName = "px-[var(--space-4)] pt-[var(--space-3)] pb-[var(--space-2)] text-[12px] font-semibold leading-normal text-text-tertiary";
+var sheetGroupSeparatorClassName = "h-[var(--space-2)] bg-[var(--bg-inset)]";
+function ActionMenuSheet({
   open,
   onOpenChange,
-  title: title2,
+  title,
   description,
-  items,
-  closeLabel = "\uB2EB\uAE30"
+  closeLabel,
+  groups,
+  onOpenAutoFocus,
+  onCloseAutoFocus
 }) {
-  const pendingRef = React30.useRef(null);
-  const returnFocus = useReturnFocus();
+  const pendingRef = React33.useRef(null);
+  const surfaceRef = React33.useRef(null);
+  const labelId = React33.useId();
   const handleOpenChange = (nextOpen) => {
     pendingRef.current = null;
     onOpenChange(nextOpen);
   };
+  const swipe = useSwipeDismiss({
+    enabled: OVERLAY_POLICY.menu.swipe,
+    onDismiss: () => handleOpenChange(false),
+    surfaceRef,
+    always: true
+  });
   const handleSelect = (item) => {
     onOpenChange(false);
     pendingRef.current = item;
   };
+  const handleOpenAutoFocus = (event) => {
+    onOpenAutoFocus?.(event);
+    const firstRow = surfaceRef.current?.querySelector('[data-slot="action-menu-item"]:enabled');
+    if (!firstRow) return;
+    event.preventDefault();
+    firstRow.focus();
+  };
   const handleCloseAutoFocus = (event) => {
-    returnFocus.onCloseAutoFocus(event);
+    onCloseAutoFocus(event);
     const item = pendingRef.current;
     pendingRef.current = null;
     item?.onSelect();
   };
-  return /* @__PURE__ */ jsx39(Sheet, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxs35(
-    SheetContent,
+  return /* @__PURE__ */ jsx42(DialogPrimitive4.Root, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxs35(DialogPrimitive4.Portal, { children: [
+    /* @__PURE__ */ jsx42(OverlayScrimLayer, { kind: "menu" }),
+    /* @__PURE__ */ jsxs35(
+      DialogPrimitive4.Content,
+      {
+        ref: surfaceRef,
+        "data-slot": "action-menu-sheet",
+        className: overlayBoxClassName("menu"),
+        onOpenAutoFocus: handleOpenAutoFocus,
+        onCloseAutoFocus: handleCloseAutoFocus,
+        ...description ? {} : { "aria-describedby": void 0 },
+        children: [
+          /* @__PURE__ */ jsx42(OverlayGrabber, { always: true, ...swipe.handleProps }),
+          /* @__PURE__ */ jsx42(
+            OverlayHeader,
+            {
+              kind: "menu",
+              title,
+              description,
+              closeLabel,
+              dragHandleProps: swipe.handleProps
+            }
+          ),
+          /* @__PURE__ */ jsx42(OverlayBody, { kind: "menu", children: groups.map((group, index) => /* @__PURE__ */ jsxs35(React33.Fragment, { children: [
+            index > 0 ? /* @__PURE__ */ jsx42("div", { role: "separator", className: sheetGroupSeparatorClassName }) : null,
+            /* @__PURE__ */ jsxs35("div", { role: "group", "aria-labelledby": group.label ? `${labelId}-${index}` : void 0, children: [
+              group.label ? /* @__PURE__ */ jsx42("div", { id: `${labelId}-${index}`, className: sheetGroupLabelClassName, children: group.label }) : null,
+              group.items.map((item) => {
+                const Icon = item.icon;
+                return /* @__PURE__ */ jsxs35(
+                  "button",
+                  {
+                    type: "button",
+                    "data-slot": "action-menu-item",
+                    "data-destructive": item.destructive ? "" : void 0,
+                    className: sheetRowClassName,
+                    disabled: item.disabled,
+                    onClick: () => handleSelect(item),
+                    children: [
+                      Icon ? /* @__PURE__ */ jsx42(Icon, { "aria-hidden": true, size: 17, strokeWidth: 1.75, className: "shrink-0" }) : null,
+                      /* @__PURE__ */ jsxs35("span", { className: "min-w-0 flex-1 break-keep", children: [
+                        item.label,
+                        item.description ? /* @__PURE__ */ jsx42("span", { className: sheetRowDescriptionClassName, children: item.description }) : null
+                      ] })
+                    ]
+                  },
+                  item.id
+                );
+              })
+            ] })
+          ] }, group.id)) })
+        ]
+      }
+    )
+  ] }) });
+}
+var DESKTOP_QUERY = "(min-width: 900px)";
+var readPresentation = () => window.matchMedia?.(DESKTOP_QUERY).matches ?? true ? "dropdown" : "sheet";
+var subscribeNothing = () => () => void 0;
+var useHydrated = () => React33.useSyncExternalStore(
+  subscribeNothing,
+  () => true,
+  () => false
+);
+function ActionMenu({
+  trigger,
+  title,
+  description,
+  open: openProp,
+  onOpenChange,
+  closeLabel,
+  items,
+  groups
+}) {
+  const [uncontrolledOpen, setUncontrolledOpen] = React33.useState(false);
+  const hydrated = useHydrated();
+  const open = (openProp ?? uncontrolledOpen) && hydrated;
+  const [shown, setShown] = React33.useState({
+    open: false,
+    presentation: "dropdown"
+  });
+  let presentation = shown.presentation;
+  if (shown.open !== open) {
+    if (open) presentation = readPresentation();
+    setShown({ open, presentation });
+  }
+  const triggerRef = React33.useRef(null);
+  const pendingRef = React33.useRef(null);
+  const setOpen = (nextOpen) => {
+    if (nextOpen) pendingRef.current = null;
+    if (openProp === void 0) setUncontrolledOpen(nextOpen);
+    onOpenChange?.(nextOpen);
+  };
+  const menuGroups = groups ?? [{ id: "items", items: items ?? [] }];
+  const handleDropdownCloseAutoFocus = (event) => {
+    const item = pendingRef.current;
+    pendingRef.current = null;
+    if (!item) return;
+    event.preventDefault();
+    triggerRef.current?.focus();
+    item.onSelect();
+  };
+  const handleSheetCloseAutoFocus = (event) => {
+    event.preventDefault();
+    triggerRef.current?.focus();
+  };
+  const triggerLabel = trigger.props["aria-label"];
+  return /* @__PURE__ */ jsxs35(Fragment11, { children: [
+    /* @__PURE__ */ jsxs35(DropdownMenu, { open: open && presentation === "dropdown", onOpenChange: setOpen, children: [
+      /* @__PURE__ */ jsx42(DropdownMenuTrigger, { asChild: true, "aria-expanded": open, children: /* @__PURE__ */ jsx42(Slot3.Root, { ref: triggerRef, children: trigger }) }),
+      /* @__PURE__ */ jsx42(DropdownMenuContent, { align: "end", onCloseAutoFocus: handleDropdownCloseAutoFocus, children: menuGroups.map((group, index) => /* @__PURE__ */ jsxs35(React33.Fragment, { children: [
+        index > 0 ? /* @__PURE__ */ jsx42(DropdownMenuSeparator, {}) : null,
+        /* @__PURE__ */ jsxs35(DropdownMenuGroup, { children: [
+          group.label ? /* @__PURE__ */ jsx42(DropdownMenuLabel, { children: group.label }) : null,
+          group.items.map((item) => {
+            const Icon = item.icon;
+            return /* @__PURE__ */ jsxs35(
+              DropdownMenuItem,
+              {
+                variant: item.destructive ? "destructive" : "default",
+                disabled: item.disabled,
+                onSelect: () => {
+                  pendingRef.current = item;
+                },
+                children: [
+                  Icon ? /* @__PURE__ */ jsx42(Icon, { "aria-hidden": true, size: 16, strokeWidth: 1.75 }) : null,
+                  item.label
+                ]
+              },
+              item.id
+            );
+          })
+        ] })
+      ] }, group.id)) })
+    ] }),
+    /* @__PURE__ */ jsx42(
+      ActionMenuSheet,
+      {
+        open: open && presentation === "sheet",
+        onOpenChange: setOpen,
+        title: title ?? /* @__PURE__ */ jsx42("span", { className: "sr-only", children: triggerLabel }),
+        description,
+        closeLabel,
+        groups: menuGroups,
+        onCloseAutoFocus: handleSheetCloseAutoFocus
+      }
+    )
+  ] });
+}
+
+// src/components/ui/action-sheet.tsx
+import { jsx as jsx43 } from "react/jsx-runtime";
+function ActionSheet({
+  open,
+  onOpenChange,
+  title,
+  description,
+  items,
+  closeLabel = "\uB2EB\uAE30"
+}) {
+  const returnFocus = useReturnFocus();
+  return /* @__PURE__ */ jsx43(
+    ActionMenuSheet,
     {
-      side: "bottom",
-      "data-slot": "action-sheet-content",
-      className: bottomSheet.action,
+      open,
+      onOpenChange,
+      title,
+      description,
+      closeLabel,
+      groups: [{ id: "items", items }],
       onOpenAutoFocus: returnFocus.onOpenAutoFocus,
-      onCloseAutoFocus: handleCloseAutoFocus,
-      ...description ? {} : { "aria-describedby": void 0 },
-      children: [
-        /* @__PURE__ */ jsxs35("div", { "data-slot": "action-sheet-header", className: actionSheetHeaderClassName, children: [
-          /* @__PURE__ */ jsxs35("div", { className: "min-w-0 flex-1", children: [
-            /* @__PURE__ */ jsx39(SheetTitle, { className: actionSheetTitleClassName, children: title2 }),
-            description ? /* @__PURE__ */ jsx39(SheetDescription, { className: actionSheetDescriptionClassName, children: description }) : null
-          ] }),
-          /* @__PURE__ */ jsx39(OverlayCloseButton, { label: closeLabel })
-        ] }),
-        /* @__PURE__ */ jsx39("div", { "data-slot": "action-sheet-list", className: actionSheetListClassName, children: items.map((item) => {
-          const Icon = item.icon;
-          return /* @__PURE__ */ jsxs35(
-            "button",
-            {
-              type: "button",
-              "data-slot": "action-sheet-item",
-              "data-destructive": item.destructive ? "" : void 0,
-              className: actionSheetItemClassName,
-              disabled: item.disabled,
-              onClick: () => handleSelect(item),
-              children: [
-                Icon ? /* @__PURE__ */ jsx39(Icon, { "aria-hidden": true, size: 17, strokeWidth: 1.75, className: "shrink-0" }) : null,
-                /* @__PURE__ */ jsx39("span", { className: "min-w-0 flex-1 break-keep", children: item.label })
-              ]
-            },
-            item.id
-          );
-        }) })
-      ]
+      onCloseAutoFocus: returnFocus.onCloseAutoFocus
     }
-  ) });
+  );
 }
 
 // src/components/ui/badge.tsx
-import * as React31 from "react";
-import { jsx as jsx40, jsxs as jsxs36 } from "react/jsx-runtime";
+import * as React34 from "react";
+import { jsx as jsx44, jsxs as jsxs36 } from "react/jsx-runtime";
 var DOT = {
   error: "var(--semantic-error-fg)",
   warning: "var(--semantic-warning-fg)",
@@ -7277,7 +7876,7 @@ var DOT = {
   neutral: "var(--text-tertiary)",
   brand: "var(--accent-pop)"
 };
-var Badge = React31.forwardRef(
+var Badge = React34.forwardRef(
   ({ tone = "neutral", className, children, ...props }, ref) => /* @__PURE__ */ jsxs36(
     "span",
     {
@@ -7292,7 +7891,7 @@ var Badge = React31.forwardRef(
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx40(
+        /* @__PURE__ */ jsx44(
           "span",
           {
             "aria-hidden": "true",
@@ -7309,8 +7908,8 @@ var Badge = React31.forwardRef(
 Badge.displayName = "Badge";
 
 // src/components/ui/two-tier-badge.tsx
-import * as React32 from "react";
-import { jsx as jsx41, jsxs as jsxs37 } from "react/jsx-runtime";
+import * as React35 from "react";
+import { jsx as jsx45, jsxs as jsxs37 } from "react/jsx-runtime";
 var FG = {
   neutral: "var(--text-secondary)",
   info: "var(--semantic-info-fg)",
@@ -7331,7 +7930,7 @@ var SEGMENT = {
   md: "gap-[7px] py-[var(--space-1)] px-[var(--space-3)] text-[14px]"
 };
 var DOT2 = { xs: 5, sm: 6, md: 7 };
-var TwoTierBadge = React32.forwardRef(
+var TwoTierBadge = React35.forwardRef(
   ({ primary, secondary, tone = "neutral", emphasis = "subtle", size = "sm", showDot = false, className, style, ...props }, ref) => {
     const strong = emphasis === "strong";
     const fg = FG[tone];
@@ -7361,7 +7960,7 @@ var TwoTierBadge = React32.forwardRef(
               className: cn("inline-flex items-center whitespace-nowrap font-semibold", SEGMENT[size]),
               style: { color: fg, background: strong ? BG[tone] : "transparent" },
               children: [
-                showDot ? /* @__PURE__ */ jsx41(
+                showDot ? /* @__PURE__ */ jsx45(
                   "span",
                   {
                     "aria-hidden": "true",
@@ -7376,11 +7975,11 @@ var TwoTierBadge = React32.forwardRef(
                     }
                   }
                 ) : null,
-                /* @__PURE__ */ jsx41("span", { children: primary })
+                /* @__PURE__ */ jsx45("span", { children: primary })
               ]
             }
           ),
-          secondary != null ? /* @__PURE__ */ jsx41(
+          secondary != null ? /* @__PURE__ */ jsx45(
             "span",
             {
               "data-slot": "two-tier-badge-secondary",
@@ -7401,8 +8000,8 @@ var TwoTierBadge = React32.forwardRef(
 TwoTierBadge.displayName = "TwoTierBadge";
 
 // src/components/ui/status-badge.tsx
-import * as React33 from "react";
-import { jsx as jsx42, jsxs as jsxs38 } from "react/jsx-runtime";
+import * as React36 from "react";
+import { jsx as jsx46, jsxs as jsxs38 } from "react/jsx-runtime";
 var ROLE = {
   error: "error",
   warning: "warning",
@@ -7431,7 +8030,7 @@ var SIZE = {
   sm: { cls: "gap-[6px] py-[var(--space-1)] px-[var(--space-2)] text-[12px]", dot: 6 },
   md: { cls: "gap-[var(--space-2)] py-[var(--space-1)] px-[14px] text-[14px]", dot: 7 }
 };
-var StatusBadge = React33.forwardRef(
+var StatusBadge = React36.forwardRef(
   ({ status = "active", emphasis = "subtle", size = "sm", showDot = true, pulse = true, className, children, style, ...props }, ref) => {
     const role = ROLE[status];
     const fg = FG2[role];
@@ -7455,7 +8054,7 @@ var StatusBadge = React33.forwardRef(
         },
         ...props,
         children: [
-          showDot ? /* @__PURE__ */ jsx42(
+          showDot ? /* @__PURE__ */ jsx46(
             "span",
             {
               "aria-hidden": "true",
@@ -7473,7 +8072,7 @@ var StatusBadge = React33.forwardRef(
             }
           ) : null,
           children,
-          /* @__PURE__ */ jsx42("style", { children: "@keyframes olun-status-pulse{0%,100%{opacity:1}50%{opacity:.4}}@media (prefers-reduced-motion: reduce){[data-slot=status-badge-dot]{animation:none!important}}" })
+          /* @__PURE__ */ jsx46("style", { children: "@keyframes olun-status-pulse{0%,100%{opacity:1}50%{opacity:.4}}@media (prefers-reduced-motion: reduce){[data-slot=status-badge-dot]{animation:none!important}}" })
         ]
       }
     );
@@ -7482,9 +8081,9 @@ var StatusBadge = React33.forwardRef(
 StatusBadge.displayName = "StatusBadge";
 
 // src/components/ui/notification-badge.tsx
-import * as React34 from "react";
+import * as React37 from "react";
 import { cva as cva13 } from "class-variance-authority";
-import { jsx as jsx43 } from "react/jsx-runtime";
+import { jsx as jsx47 } from "react/jsx-runtime";
 var notificationBadgeVariants = cva13(
   [
     "inline-flex shrink-0 items-center justify-center rounded-[var(--radius-full)]",
@@ -7515,7 +8114,7 @@ function formatNotificationCount(count, max) {
   }
   return String(count);
 }
-var NotificationBadge = React34.forwardRef(
+var NotificationBadge = React37.forwardRef(
   ({
     className,
     count,
@@ -7530,7 +8129,7 @@ var NotificationBadge = React34.forwardRef(
     }
     const normalizedMax = Math.max(1, Math.floor(max));
     const label = ariaLabel ?? (count > normalizedMax ? `\uC77D\uC9C0 \uC54A\uC740 \uC54C\uB9BC ${normalizedMax}\uAC1C \uC774\uC0C1` : `\uC77D\uC9C0 \uC54A\uC740 \uC54C\uB9BC ${count}\uAC1C`);
-    return /* @__PURE__ */ jsx43(
+    return /* @__PURE__ */ jsx47(
       "span",
       {
         ref,
@@ -7548,9 +8147,9 @@ var NotificationBadge = React34.forwardRef(
 NotificationBadge.displayName = "NotificationBadge";
 
 // src/components/ui/empty-state.tsx
-import * as React35 from "react";
+import * as React38 from "react";
 import { cva as cva14 } from "class-variance-authority";
-import { jsx as jsx44, jsxs as jsxs39 } from "react/jsx-runtime";
+import { jsx as jsx48, jsxs as jsxs39 } from "react/jsx-runtime";
 var emptyStateBaseVariants = cva14(
   [
     "flex flex-col items-center justify-center text-center",
@@ -7622,14 +8221,14 @@ var iconSize3 = {
   md: 20,
   lg: 24
 };
-var EmptyState = React35.forwardRef(
+var EmptyState = React38.forwardRef(
   ({
     className,
     size = "md",
     tone = "neutral",
     surface,
     icon: Icon,
-    title: title2,
+    title,
     description,
     hint,
     action,
@@ -7646,25 +8245,25 @@ var EmptyState = React35.forwardRef(
         className: cn(emptyStateVariants({ size, tone, surface, bordered, className })),
         ...props,
         children: [
-          Icon ? /* @__PURE__ */ jsx44(
+          Icon ? /* @__PURE__ */ jsx48(
             "span",
             {
               "aria-hidden": "true",
               "data-slot": "empty-state-icon",
               className: emptyStateIconVariants({ size: resolvedSize }),
-              children: /* @__PURE__ */ jsx44(Icon, { size: iconSize3[resolvedSize], strokeWidth: 1.75 })
+              children: /* @__PURE__ */ jsx48(Icon, { size: iconSize3[resolvedSize], strokeWidth: 1.75 })
             }
           ) : null,
           /* @__PURE__ */ jsxs39("div", { className: "flex max-w-[420px] flex-col items-center gap-[var(--space-2)]", children: [
-            /* @__PURE__ */ jsx44(
+            /* @__PURE__ */ jsx48(
               "h2",
               {
                 "data-slot": "empty-state-title",
                 className: "break-keep text-base font-semibold leading-snug text-foreground",
-                children: title2
+                children: title
               }
             ),
-            description ? /* @__PURE__ */ jsx44(
+            description ? /* @__PURE__ */ jsx48(
               "p",
               {
                 "data-slot": "empty-state-description",
@@ -7672,7 +8271,7 @@ var EmptyState = React35.forwardRef(
                 children: description
               }
             ) : null,
-            hint ? /* @__PURE__ */ jsx44(
+            hint ? /* @__PURE__ */ jsx48(
               "p",
               {
                 "data-slot": "empty-state-hint",
@@ -7681,7 +8280,7 @@ var EmptyState = React35.forwardRef(
               }
             ) : null
           ] }),
-          action ? /* @__PURE__ */ jsx44("div", { "data-slot": "empty-state-action", className: "mt-[var(--space-2)]", children: action }) : null
+          action ? /* @__PURE__ */ jsx48("div", { "data-slot": "empty-state-action", className: "mt-[var(--space-2)]", children: action }) : null
         ]
       }
     );
@@ -7690,10 +8289,10 @@ var EmptyState = React35.forwardRef(
 EmptyState.displayName = "EmptyState";
 
 // src/components/ui/error-state.tsx
-import * as React36 from "react";
+import * as React39 from "react";
 import { AlertTriangle } from "lucide-react";
 import { cva as cva15 } from "class-variance-authority";
-import { jsx as jsx45, jsxs as jsxs40 } from "react/jsx-runtime";
+import { jsx as jsx49, jsxs as jsxs40 } from "react/jsx-runtime";
 var errorStateVariants = cva15(
   [
     "flex flex-col items-center justify-center text-center",
@@ -7715,12 +8314,12 @@ var errorStateVariants = cva15(
     }
   }
 );
-var ErrorState = React36.forwardRef(
+var ErrorState = React39.forwardRef(
   ({
     className,
     size = "md",
     surface = "surface",
-    title: title2 = "\uBD88\uB7EC\uC624\uAE30 \uC2E4\uD328",
+    title = "\uBD88\uB7EC\uC624\uAE30 \uC2E4\uD328",
     message = "\uC7A0\uC2DC \uD6C4 \uB2E4\uC2DC \uC2DC\uB3C4\uD574\uC8FC\uC138\uC694.",
     errorCode,
     onRetry,
@@ -7735,25 +8334,25 @@ var ErrorState = React36.forwardRef(
       className: cn(errorStateVariants({ size, surface, className })),
       ...props,
       children: [
-        /* @__PURE__ */ jsx45(
+        /* @__PURE__ */ jsx49(
           "span",
           {
             "aria-hidden": "true",
             "data-slot": "error-state-icon",
             className: "inline-flex size-[48px] items-center justify-center rounded-[var(--radius-full)] bg-[var(--error-bg)] text-[var(--error)]",
-            children: /* @__PURE__ */ jsx45(AlertTriangle, { size: 24, strokeWidth: 1.75 })
+            children: /* @__PURE__ */ jsx49(AlertTriangle, { size: 24, strokeWidth: 1.75 })
           }
         ),
         /* @__PURE__ */ jsxs40("div", { className: "flex max-w-[420px] flex-col items-center gap-[var(--space-2)]", children: [
-          /* @__PURE__ */ jsx45(
+          /* @__PURE__ */ jsx49(
             "h2",
             {
               "data-slot": "error-state-title",
               className: "break-keep text-base font-semibold leading-snug text-foreground",
-              children: title2
+              children: title
             }
           ),
-          /* @__PURE__ */ jsx45(
+          /* @__PURE__ */ jsx49(
             "p",
             {
               "data-slot": "error-state-message",
@@ -7761,7 +8360,7 @@ var ErrorState = React36.forwardRef(
               children: message
             }
           ),
-          errorCode ? /* @__PURE__ */ jsx45(
+          errorCode ? /* @__PURE__ */ jsx49(
             "p",
             {
               "data-slot": "error-state-code",
@@ -7770,7 +8369,7 @@ var ErrorState = React36.forwardRef(
             }
           ) : null
         ] }),
-        onRetry ? /* @__PURE__ */ jsx45(Button, { size: "sm", variant: "secondary", onClick: onRetry, children: retryLabel }) : null
+        onRetry ? /* @__PURE__ */ jsx49(Button, { size: "sm", variant: "secondary", onClick: onRetry, children: retryLabel }) : null
       ]
     }
   )
@@ -7778,9 +8377,9 @@ var ErrorState = React36.forwardRef(
 ErrorState.displayName = "ErrorState";
 
 // src/components/ui/skeleton.tsx
-import * as React37 from "react";
+import * as React40 from "react";
 import { cva as cva16 } from "class-variance-authority";
-import { jsx as jsx46 } from "react/jsx-runtime";
+import { jsx as jsx50 } from "react/jsx-runtime";
 var skeletonVariants = cva16(
   [
     // bg-inset: light #F1F2F4 reads on white surfaces (bg-raised was white = invisible);
@@ -7824,8 +8423,8 @@ var spinnerVariants = cva16(
     }
   }
 );
-var Skeleton = React37.forwardRef(
-  ({ className, shape, style, ...props }, ref) => /* @__PURE__ */ jsx46(
+var Skeleton = React40.forwardRef(
+  ({ className, shape, style, ...props }, ref) => /* @__PURE__ */ jsx50(
     "div",
     {
       ref,
@@ -7838,15 +8437,15 @@ var Skeleton = React37.forwardRef(
 );
 Skeleton.displayName = "Skeleton";
 var defaultTextWidths = ["92%", "84%", "68%", "76%"];
-var SkeletonText = React37.forwardRef(
-  ({ className, lines = 3, widths = defaultTextWidths, ...props }, ref) => /* @__PURE__ */ jsx46(
+var SkeletonText = React40.forwardRef(
+  ({ className, lines = 3, widths = defaultTextWidths, ...props }, ref) => /* @__PURE__ */ jsx50(
     "div",
     {
       ref,
       "data-slot": "skeleton-text",
       className: cn("flex flex-col gap-[var(--space-2)]", className),
       ...props,
-      children: Array.from({ length: lines }, (_, index) => /* @__PURE__ */ jsx46(
+      children: Array.from({ length: lines }, (_, index) => /* @__PURE__ */ jsx50(
         Skeleton,
         {
           shape: "text",
@@ -7858,7 +8457,7 @@ var SkeletonText = React37.forwardRef(
   )
 );
 SkeletonText.displayName = "SkeletonText";
-var SkeletonRow = React37.forwardRef(
+var SkeletonRow = React40.forwardRef(
   ({
     className,
     columns,
@@ -7869,7 +8468,7 @@ var SkeletonRow = React37.forwardRef(
   }, ref) => {
     const rowCount = Math.max(5, count);
     const gridTemplateColumns = columns.map((column) => column.width ?? "1fr").join(" ");
-    return /* @__PURE__ */ jsx46(
+    return /* @__PURE__ */ jsx50(
       "div",
       {
         ref,
@@ -7883,7 +8482,7 @@ var SkeletonRow = React37.forwardRef(
           className
         ),
         ...props,
-        children: Array.from({ length: rowCount }, (_, rowIndex) => /* @__PURE__ */ jsx46(
+        children: Array.from({ length: rowCount }, (_, rowIndex) => /* @__PURE__ */ jsx50(
           "div",
           {
             "data-slot": "skeleton-row",
@@ -7891,11 +8490,11 @@ var SkeletonRow = React37.forwardRef(
               "grid min-h-[48px] items-center border-t border-[var(--border-subtle)] first:border-t-0"
             ),
             style: { gridTemplateColumns },
-            children: columns.map((column, columnIndex) => /* @__PURE__ */ jsx46(
+            children: columns.map((column, columnIndex) => /* @__PURE__ */ jsx50(
               "div",
               {
                 className: "px-[var(--space-4)] py-[var(--space-2)]",
-                children: /* @__PURE__ */ jsx46(
+                children: /* @__PURE__ */ jsx50(
                   Skeleton,
                   {
                     shape: "text",
@@ -7915,8 +8514,8 @@ var SkeletonRow = React37.forwardRef(
   }
 );
 SkeletonRow.displayName = "SkeletonRow";
-var Spinner = React37.forwardRef(
-  ({ className, size, label = "\uB85C\uB529 \uC911", ...props }, ref) => /* @__PURE__ */ jsx46(
+var Spinner = React40.forwardRef(
+  ({ className, size, label = "\uB85C\uB529 \uC911", ...props }, ref) => /* @__PURE__ */ jsx50(
     "span",
     {
       ref,
@@ -7931,12 +8530,12 @@ var Spinner = React37.forwardRef(
 Spinner.displayName = "Spinner";
 
 // src/components/ui/pagination.tsx
-import * as React38 from "react";
+import * as React41 from "react";
 import { ChevronsLeft, ChevronLeft, ChevronRight as ChevronRight2, ChevronsRight } from "lucide-react";
 import { cva as cva17 } from "class-variance-authority";
 
 // src/components/ui/page-size-select.tsx
-import { jsx as jsx47, jsxs as jsxs41 } from "react/jsx-runtime";
+import { jsx as jsx51, jsxs as jsxs41 } from "react/jsx-runtime";
 var DEFAULT_OPTIONS = [10, 20, 50, 100];
 function PageSizeSelect({
   value,
@@ -7964,8 +8563,8 @@ function PageSizeSelect({
         className
       ),
       children: [
-        label != null ? /* @__PURE__ */ jsx47("span", { children: label }) : null,
-        /* @__PURE__ */ jsx47(
+        label != null ? /* @__PURE__ */ jsx51("span", { children: label }) : null,
+        /* @__PURE__ */ jsx51(
           Select,
           {
             id,
@@ -7987,7 +8586,7 @@ function PageSizeSelect({
 }
 
 // src/components/ui/pagination.tsx
-import { jsx as jsx48, jsxs as jsxs42 } from "react/jsx-runtime";
+import { jsx as jsx52, jsxs as jsxs42 } from "react/jsx-runtime";
 var paginationVariants = cva17(
   [
     "flex w-full flex-col gap-[var(--space-3)]",
@@ -8060,7 +8659,7 @@ function NavigationButton({
   icon: Icon,
   onPageChange
 }) {
-  return /* @__PURE__ */ jsx48(
+  return /* @__PURE__ */ jsx52(
     "button",
     {
       "aria-label": label,
@@ -8068,11 +8667,11 @@ function NavigationButton({
       className: paginationControlVariants({ size }),
       type: "button",
       onClick: () => onPageChange?.(page),
-      children: /* @__PURE__ */ jsx48(Icon, { "aria-hidden": "true", "data-slot": "pagination-icon" })
+      children: /* @__PURE__ */ jsx52(Icon, { "aria-hidden": "true", "data-slot": "pagination-icon" })
     }
   );
 }
-var Pagination = React38.forwardRef(
+var Pagination = React41.forwardRef(
   ({
     className,
     size = "standard",
@@ -8108,8 +8707,8 @@ var Pagination = React38.forwardRef(
         ...props,
         children: [
           /* @__PURE__ */ jsxs42("div", { className: "flex flex-wrap items-center gap-[var(--space-3)]", children: [
-            /* @__PURE__ */ jsx48("span", { "data-slot": "pagination-total", className: "font-medium text-text-secondary", children: totalLabel(total) }),
-            showPageSize ? /* @__PURE__ */ jsx48("div", { "data-slot": "pagination-size", children: /* @__PURE__ */ jsx48(
+            /* @__PURE__ */ jsx52("span", { "data-slot": "pagination-total", className: "font-medium text-text-secondary", children: totalLabel(total) }),
+            showPageSize ? /* @__PURE__ */ jsx52("div", { "data-slot": "pagination-size", children: /* @__PURE__ */ jsx52(
               PageSizeSelect,
               {
                 label: pageSizeLabel,
@@ -8127,7 +8726,7 @@ var Pagination = React38.forwardRef(
               "data-slot": "pagination-list",
               className: "flex items-center justify-center gap-[var(--space-1)]",
               children: [
-                /* @__PURE__ */ jsx48(
+                /* @__PURE__ */ jsx52(
                   NavigationButton,
                   {
                     label: "\uCCAB \uD398\uC774\uC9C0",
@@ -8138,7 +8737,7 @@ var Pagination = React38.forwardRef(
                     onPageChange
                   }
                 ),
-                /* @__PURE__ */ jsx48(
+                /* @__PURE__ */ jsx52(
                   NavigationButton,
                   {
                     label: "\uC774\uC804 \uD398\uC774\uC9C0",
@@ -8150,7 +8749,7 @@ var Pagination = React38.forwardRef(
                   }
                 ),
                 items.map(
-                  (item, index) => item === "ellipsis" ? /* @__PURE__ */ jsx48(
+                  (item, index) => item === "ellipsis" ? /* @__PURE__ */ jsx52(
                     "span",
                     {
                       "data-slot": "pagination-ellipsis",
@@ -8162,7 +8761,7 @@ var Pagination = React38.forwardRef(
                       children: "..."
                     },
                     `ellipsis-${index}`
-                  ) : /* @__PURE__ */ jsx48(
+                  ) : /* @__PURE__ */ jsx52(
                     "button",
                     {
                       "aria-label": `${item} \uD398\uC774\uC9C0`,
@@ -8176,7 +8775,7 @@ var Pagination = React38.forwardRef(
                     item
                   )
                 ),
-                /* @__PURE__ */ jsx48(
+                /* @__PURE__ */ jsx52(
                   NavigationButton,
                   {
                     label: "\uB2E4\uC74C \uD398\uC774\uC9C0",
@@ -8187,7 +8786,7 @@ var Pagination = React38.forwardRef(
                     onPageChange
                   }
                 ),
-                /* @__PURE__ */ jsx48(
+                /* @__PURE__ */ jsx52(
                   NavigationButton,
                   {
                     label: "\uB9C8\uC9C0\uB9C9 \uD398\uC774\uC9C0",
@@ -8210,7 +8809,7 @@ Pagination.displayName = "Pagination";
 
 // src/components/ui/mode-toggle.tsx
 import { cva as cva18 } from "class-variance-authority";
-import { jsx as jsx49, jsxs as jsxs43 } from "react/jsx-runtime";
+import { jsx as jsx53, jsxs as jsxs43 } from "react/jsx-runtime";
 var modeToggleVariants = cva18(
   [
     "inline-flex items-center rounded-[var(--radius-md)] border border-[var(--border-subtle)]",
@@ -8240,7 +8839,7 @@ function ModeToggle({
   onChange,
   ...props
 }) {
-  return /* @__PURE__ */ jsx49(
+  return /* @__PURE__ */ jsx53(
     "div",
     {
       role: "group",
@@ -8266,8 +8865,8 @@ function ModeToggle({
               }
             },
             children: [
-              Icon ? /* @__PURE__ */ jsx49(Icon, { "aria-hidden": "true", "data-slot": "mode-toggle-icon" }) : null,
-              /* @__PURE__ */ jsx49("span", { children: option.label })
+              Icon ? /* @__PURE__ */ jsx53(Icon, { "aria-hidden": "true", "data-slot": "mode-toggle-icon" }) : null,
+              /* @__PURE__ */ jsx53("span", { children: option.label })
             ]
           },
           option.value
@@ -8278,9 +8877,9 @@ function ModeToggle({
 }
 
 // src/components/ui/action-footer.tsx
-import * as React39 from "react";
+import * as React42 from "react";
 import { cva as cva19 } from "class-variance-authority";
-import { jsx as jsx50, jsxs as jsxs44 } from "react/jsx-runtime";
+import { jsx as jsx54, jsxs as jsxs44 } from "react/jsx-runtime";
 var actionFooterVariants = cva19(
   [
     "flex flex-wrap items-center gap-[var(--space-4)] border-t border-[var(--border-subtle)]",
@@ -8351,7 +8950,7 @@ function getStatusLabel(status) {
   }
 }
 function renderAction(action) {
-  return /* @__PURE__ */ jsx50(
+  return /* @__PURE__ */ jsx54(
     Button,
     {
       variant: action.variant,
@@ -8366,7 +8965,7 @@ function renderAction(action) {
     action.id ?? action.label
   );
 }
-var ActionFooter = React39.forwardRef(
+var ActionFooter = React42.forwardRef(
   ({
     className,
     status,
@@ -8392,7 +8991,7 @@ var ActionFooter = React39.forwardRef(
         className: cn(actionFooterVariants({ position, surface, className })),
         ...props,
         children: [
-          destructiveActions.length > 0 ? /* @__PURE__ */ jsx50(
+          destructiveActions.length > 0 ? /* @__PURE__ */ jsx54(
             "div",
             {
               "data-slot": "action-footer-destructive-actions",
@@ -8408,7 +9007,7 @@ var ActionFooter = React39.forwardRef(
               "aria-live": "polite",
               className: cn(actionFooterStatusVariants({ kind: status.kind })),
               children: [
-                /* @__PURE__ */ jsx50(
+                /* @__PURE__ */ jsx54(
                   "span",
                   {
                     "aria-hidden": "true",
@@ -8416,11 +9015,11 @@ var ActionFooter = React39.forwardRef(
                     className: "size-[6px] shrink-0 rounded-[var(--radius-full)]"
                   }
                 ),
-                /* @__PURE__ */ jsx50("span", { className: "truncate", children: getStatusLabel(status) })
+                /* @__PURE__ */ jsx54("span", { className: "truncate", children: getStatusLabel(status) })
               ]
             }
           ) : null,
-          /* @__PURE__ */ jsx50(
+          /* @__PURE__ */ jsx54(
             "div",
             {
               "data-slot": "action-footer-main-actions",
@@ -8436,9 +9035,9 @@ var ActionFooter = React39.forwardRef(
 ActionFooter.displayName = "ActionFooter";
 
 // src/components/ui/toast.tsx
-import * as React40 from "react";
+import * as React43 from "react";
 import { cva as cva20 } from "class-variance-authority";
-import { jsx as jsx51, jsxs as jsxs45 } from "react/jsx-runtime";
+import { jsx as jsx55, jsxs as jsxs45 } from "react/jsx-runtime";
 var DOT3 = {
   default: "var(--neutral)",
   success: "var(--success)",
@@ -8556,7 +9155,7 @@ var toast = {
   }
 };
 var Toast = toast;
-var ToastRoot = React40.forwardRef(
+var ToastRoot = React43.forwardRef(
   ({
     className,
     id,
@@ -8573,10 +9172,10 @@ var ToastRoot = React40.forwardRef(
     ...props
   }, ref) => {
     const durationMs = getToastDuration({ message, variant, duration });
-    const onCloseRef = React40.useRef(onClose);
+    const onCloseRef = React43.useRef(onClose);
     onCloseRef.current = onClose;
-    const timerRef = React40.useRef(null);
-    React40.useEffect(() => {
+    const timerRef = React43.useRef(null);
+    React43.useEffect(() => {
       if (!onCloseRef.current) return void 0;
       const timer = createToastTimer(durationMs, () => onCloseRef.current?.());
       timerRef.current = timer;
@@ -8613,7 +9212,7 @@ var ToastRoot = React40.forwardRef(
         },
         ...props,
         children: [
-          /* @__PURE__ */ jsx51(
+          /* @__PURE__ */ jsx55(
             "span",
             {
               "aria-hidden": "true",
@@ -8623,7 +9222,7 @@ var ToastRoot = React40.forwardRef(
             }
           ),
           /* @__PURE__ */ jsxs45("div", { "data-slot": "toast-body", className: "min-w-0 flex-1", children: [
-            /* @__PURE__ */ jsx51(
+            /* @__PURE__ */ jsx55(
               "div",
               {
                 "data-slot": "toast-message",
@@ -8631,7 +9230,7 @@ var ToastRoot = React40.forwardRef(
                 children: message
               }
             ),
-            description ? /* @__PURE__ */ jsx51(
+            description ? /* @__PURE__ */ jsx55(
               "div",
               {
                 "data-slot": "toast-description",
@@ -8641,7 +9240,7 @@ var ToastRoot = React40.forwardRef(
             ) : null
           ] }),
           /* @__PURE__ */ jsxs45("div", { "data-slot": "toast-actions", className: "flex shrink-0 items-center gap-[2px]", children: [
-            action ? /* @__PURE__ */ jsx51(
+            action ? /* @__PURE__ */ jsx55(
               Button,
               {
                 "data-slot": "toast-action",
@@ -8651,7 +9250,7 @@ var ToastRoot = React40.forwardRef(
                 children: action.label
               }
             ) : null,
-            /* @__PURE__ */ jsx51(
+            /* @__PURE__ */ jsx55(
               "button",
               {
                 type: "button",
@@ -8673,7 +9272,7 @@ var ToastRoot = React40.forwardRef(
   }
 );
 ToastRoot.displayName = "ToastRoot";
-var ToastViewport = React40.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx51(
+var ToastViewport = React43.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx55(
   "ol",
   {
     ref,
@@ -8684,8 +9283,8 @@ var ToastViewport = React40.forwardRef(({ className, ...props }, ref) => /* @__P
 ));
 ToastViewport.displayName = "ToastViewport";
 function ToastProvider({ children, maxToasts = 3, className, ...props }) {
-  const [items, setItems] = React40.useState([]);
-  React40.useEffect(
+  const [items, setItems] = React43.useState([]);
+  React43.useEffect(
     () => toast.subscribe((nextItems) => {
       setItems(limitToasts(nextItems, maxToasts));
     }),
@@ -8693,15 +9292,15 @@ function ToastProvider({ children, maxToasts = 3, className, ...props }) {
   );
   return /* @__PURE__ */ jsxs45("div", { "data-slot": "toast-provider", className, ...props, children: [
     children,
-    /* @__PURE__ */ jsx51(ToastViewport, { children: items.map((item) => /* @__PURE__ */ jsx51("li", { children: /* @__PURE__ */ jsx51(ToastRoot, { ...item, onClose: () => toast.dismiss(item.id) }) }, item.id)) })
+    /* @__PURE__ */ jsx55(ToastViewport, { children: items.map((item) => /* @__PURE__ */ jsx55("li", { children: /* @__PURE__ */ jsx55(ToastRoot, { ...item, onClose: () => toast.dismiss(item.id) }) }, item.id)) })
   ] });
 }
 
 // src/components/ui/otp-field.tsx
-import * as React41 from "react";
+import * as React44 from "react";
 import { cva as cva21 } from "class-variance-authority";
 import { AlertCircle as AlertCircle4 } from "lucide-react";
-import { Fragment as Fragment9, jsx as jsx52, jsxs as jsxs46 } from "react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx56, jsxs as jsxs46 } from "react/jsx-runtime";
 var otpFieldVariants = cva21("flex w-full min-w-0 flex-col gap-[var(--space-3)]", {
   variants: {
     size: {
@@ -8828,7 +9427,7 @@ function fillDigitsFromIndex(slots, index, inserted, length) {
     focusIndex: Math.min(cursor, length - 1)
   };
 }
-var OTPField = React41.forwardRef(
+var OTPField = React44.forwardRef(
   ({
     className,
     defaultValue,
@@ -8850,24 +9449,24 @@ var OTPField = React41.forwardRef(
     required,
     ...props
   }, ref) => {
-    const generatedId = React41.useId();
+    const generatedId = React44.useId();
     const fieldId = id ?? generatedId;
     const labelId = `${fieldId}-label`;
     const helperId = helperText ? `${fieldId}-helper` : void 0;
     const errorId = errorText ? `${fieldId}-error` : void 0;
     const resolvedState = invalid || errorText ? "error" : "default";
     const isControlled = value !== void 0;
-    const [uncontrolledSlots, setUncontrolledSlots] = React41.useState(
+    const [uncontrolledSlots, setUncontrolledSlots] = React44.useState(
       () => toDigitsArray(onlyDigits(defaultValue, length), length)
     );
-    const resolvedSlots = React41.useMemo(
+    const resolvedSlots = React44.useMemo(
       () => isControlled ? toDigitsArray(onlyDigits(value, length), length) : uncontrolledSlots,
       [isControlled, length, uncontrolledSlots, value]
     );
     const resolvedValue = joinDigits(resolvedSlots).slice(0, length);
-    const cellsRef = React41.useRef([]);
+    const cellsRef = React44.useRef([]);
     const groupDescribedBy = [helperId, errorId].filter(Boolean).join(" ") || void 0;
-    const setResolvedValue = React41.useCallback(
+    const setResolvedValue = React44.useCallback(
       (nextSlots, focusIndex) => {
         const normalizedSlots = nextSlots.slice(0, length);
         const normalizedValue = joinDigits(normalizedSlots).slice(0, length);
@@ -8907,11 +9506,11 @@ var OTPField = React41.forwardRef(
               className: "text-sm font-medium leading-snug text-foreground",
               children: [
                 label,
-                required ? /* @__PURE__ */ jsx52("span", { "aria-hidden": "true", className: "ml-1 font-bold text-[var(--error)]", children: "*" }) : null
+                required ? /* @__PURE__ */ jsx56("span", { "aria-hidden": "true", className: "ml-1 font-bold text-[var(--error)]", children: "*" }) : null
               ]
             }
           ),
-          /* @__PURE__ */ jsx52(
+          /* @__PURE__ */ jsx56(
             "div",
             {
               "data-slot": "otp-field-group",
@@ -8921,7 +9520,7 @@ var OTPField = React41.forwardRef(
               children: Array.from({ length }, (_, index) => {
                 const digit = resolvedSlots[index] ?? "";
                 const inputId = `${fieldId}-cell-${index + 1}`;
-                return /* @__PURE__ */ jsx52(
+                return /* @__PURE__ */ jsx56(
                   "input",
                   {
                     ref: (node) => {
@@ -9016,15 +9615,15 @@ var OTPField = React41.forwardRef(
               })
             }
           ),
-          helperText || errorText ? /* @__PURE__ */ jsx52(
+          helperText || errorText ? /* @__PURE__ */ jsx56(
             "p",
             {
               id: errorText ? errorId : helperId,
               "data-slot": "otp-field-message",
               "data-kind": errorText ? "error" : "helper",
               className: otpFieldMessageVariants({ state: resolvedState }),
-              children: errorText ? /* @__PURE__ */ jsxs46(Fragment9, { children: [
-                /* @__PURE__ */ jsx52(
+              children: errorText ? /* @__PURE__ */ jsxs46(Fragment12, { children: [
+                /* @__PURE__ */ jsx56(
                   AlertCircle4,
                   {
                     "aria-hidden": "true",
@@ -9032,11 +9631,11 @@ var OTPField = React41.forwardRef(
                     strokeWidth: 2
                   }
                 ),
-                /* @__PURE__ */ jsx52("span", { children: errorText })
-              ] }) : /* @__PURE__ */ jsx52("span", { children: helperText })
+                /* @__PURE__ */ jsx56("span", { children: errorText })
+              ] }) : /* @__PURE__ */ jsx56("span", { children: helperText })
             }
           ) : null,
-          name ? /* @__PURE__ */ jsx52(
+          name ? /* @__PURE__ */ jsx56(
             "input",
             {
               "aria-hidden": "true",
@@ -9057,10 +9656,10 @@ var OTPField = React41.forwardRef(
 OTPField.displayName = "OTPField";
 
 // src/components/ui/search-field.tsx
-import * as React42 from "react";
+import * as React45 from "react";
 import { Search, X as X4 } from "lucide-react";
 import { cva as cva22 } from "class-variance-authority";
-import { jsx as jsx53, jsxs as jsxs47 } from "react/jsx-runtime";
+import { jsx as jsx57, jsxs as jsxs47 } from "react/jsx-runtime";
 var searchFieldVariants = cva22("relative flex w-full items-center", {
   variants: {
     size: {
@@ -9125,7 +9724,7 @@ var iconSize4 = {
 function hasVisibleValue(value) {
   return typeof value === "string" ? value.length > 0 : value !== void 0;
 }
-var SearchField = React42.forwardRef(
+var SearchField = React45.forwardRef(
   ({
     className,
     inputMode = "search",
@@ -9141,12 +9740,12 @@ var SearchField = React42.forwardRef(
     ...props
   }, ref) => {
     const resolvedSize = size ?? "md";
-    const inputRef = React42.useRef(null);
-    const [hasText, setHasText] = React42.useState(
+    const inputRef = React45.useRef(null);
+    const [hasText, setHasText] = React45.useState(
       () => hasVisibleValue(value ?? defaultValue)
     );
-    React42.useImperativeHandle(ref, () => inputRef.current);
-    React42.useEffect(() => {
+    React45.useImperativeHandle(ref, () => inputRef.current);
+    React45.useEffect(() => {
       if (value !== void 0) {
         setHasText(hasVisibleValue(value));
       }
@@ -9166,7 +9765,7 @@ var SearchField = React42.forwardRef(
         "data-size": resolvedSize,
         className: cn(searchFieldVariants({ size, className })),
         children: [
-          /* @__PURE__ */ jsx53(
+          /* @__PURE__ */ jsx57(
             Search,
             {
               "aria-hidden": "true",
@@ -9176,7 +9775,7 @@ var SearchField = React42.forwardRef(
               strokeWidth: resolvedSize === "sm" ? 2 : 1.75
             }
           ),
-          /* @__PURE__ */ jsx53(
+          /* @__PURE__ */ jsx57(
             "input",
             {
               ref: inputRef,
@@ -9197,7 +9796,7 @@ var SearchField = React42.forwardRef(
               ...props
             }
           ),
-          showClear ? /* @__PURE__ */ jsx53(
+          showClear ? /* @__PURE__ */ jsx57(
             "button",
             {
               type: "button",
@@ -9205,7 +9804,7 @@ var SearchField = React42.forwardRef(
               "data-slot": "search-field-clear",
               className: "absolute right-[8px] top-1/2 inline-flex size-[var(--space-4)] -translate-y-1/2 cursor-pointer items-center justify-center rounded-[var(--radius-full)] text-text-tertiary transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--focus-ring)]",
               onClick: clearInput,
-              children: /* @__PURE__ */ jsx53(X4, { "aria-hidden": "true", size: 16, strokeWidth: 1.75 })
+              children: /* @__PURE__ */ jsx57(X4, { "aria-hidden": "true", size: 16, strokeWidth: 1.75 })
             }
           ) : null
         ]
@@ -9216,9 +9815,9 @@ var SearchField = React42.forwardRef(
 SearchField.displayName = "SearchField";
 
 // src/components/ui/checkbox-group.tsx
-import * as React43 from "react";
+import * as React46 from "react";
 import { cva as cva23 } from "class-variance-authority";
-import { jsx as jsx54 } from "react/jsx-runtime";
+import { jsx as jsx58 } from "react/jsx-runtime";
 var checkboxGroupVariants = cva23("gap-[var(--space-2)]", {
   variants: {
     appearance: {
@@ -9244,7 +9843,7 @@ var checkboxGroupVariants = cva23("gap-[var(--space-2)]", {
 function toSelectionSet(value) {
   return new Set(value ?? []);
 }
-var CheckboxGroup = React43.forwardRef(
+var CheckboxGroup = React46.forwardRef(
   ({
     className,
     children,
@@ -9260,14 +9859,14 @@ var CheckboxGroup = React43.forwardRef(
     ...props
   }, ref) => {
     const isControlled = value != null;
-    const [uncontrolledValue, setUncontrolledValue] = React43.useState(
+    const [uncontrolledValue, setUncontrolledValue] = React46.useState(
       () => toSelectionSet(defaultValue)
     );
-    const selectedValues = React43.useMemo(
+    const selectedValues = React46.useMemo(
       () => isControlled ? toSelectionSet(value) : uncontrolledValue,
       [isControlled, uncontrolledValue, value]
     );
-    const toggleValue = React43.useCallback(
+    const toggleValue = React46.useCallback(
       (itemValue, checked) => {
         const nextValues = new Set(selectedValues);
         if (checked) {
@@ -9283,7 +9882,7 @@ var CheckboxGroup = React43.forwardRef(
       },
       [isControlled, onValueChange, selectedValues]
     );
-    const contextValue = React43.useMemo(
+    const contextValue = React46.useMemo(
       () => ({
         appearance,
         density,
@@ -9294,7 +9893,7 @@ var CheckboxGroup = React43.forwardRef(
       }),
       [appearance, density, disabled, name, selectedValues, toggleValue]
     );
-    return /* @__PURE__ */ jsx54(CheckboxGroupContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx54(
+    return /* @__PURE__ */ jsx58(CheckboxGroupContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx58(
       "div",
       {
         ref,
@@ -9318,11 +9917,11 @@ var CheckboxGroup = React43.forwardRef(
 CheckboxGroup.displayName = "CheckboxGroup";
 
 // src/components/ui/radio-group.tsx
-import * as React44 from "react";
+import * as React47 from "react";
 import { cva as cva24 } from "class-variance-authority";
 import { Circle } from "lucide-react";
 import { RadioGroup as RadioGroupPrimitive } from "radix-ui";
-import { jsx as jsx55, jsxs as jsxs48 } from "react/jsx-runtime";
+import { jsx as jsx59, jsxs as jsxs48 } from "react/jsx-runtime";
 var radioGroupVariants = cva24("gap-[var(--space-2)]", {
   variants: {
     appearance: {
@@ -9411,11 +10010,11 @@ var radioControlVariants = cva24(
     }
   }
 );
-var RadioGroupContext = React44.createContext({
+var RadioGroupContext = React47.createContext({
   appearance: "plain",
   density: "comfortable"
 });
-var RadioGroup = React44.forwardRef(
+var RadioGroup = React47.forwardRef(
   ({
     className,
     children,
@@ -9426,11 +10025,11 @@ var RadioGroup = React44.forwardRef(
     required,
     ...props
   }, ref) => {
-    const contextValue = React44.useMemo(
+    const contextValue = React47.useMemo(
       () => ({ appearance, density }),
       [appearance, density]
     );
-    return /* @__PURE__ */ jsx55(RadioGroupContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx55(
+    return /* @__PURE__ */ jsx59(RadioGroupContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx59(
       RadioGroupPrimitive.Root,
       {
         ref,
@@ -9453,9 +10052,9 @@ var RadioGroup = React44.forwardRef(
   }
 );
 RadioGroup.displayName = "RadioGroup";
-var Radio = React44.forwardRef(({ className, children, description, id, ...props }, ref) => {
-  const { appearance, density } = React44.useContext(RadioGroupContext);
-  const generatedId = React44.useId();
+var Radio = React47.forwardRef(({ className, children, description, id, ...props }, ref) => {
+  const { appearance, density } = React47.useContext(RadioGroupContext);
+  const generatedId = React47.useId();
   const radioId = id ?? generatedId;
   const labelId = `${radioId}-label`;
   const descriptionId = description ? `${radioId}-description` : void 0;
@@ -9470,24 +10069,24 @@ var Radio = React44.forwardRef(({ className, children, description, id, ...props
       className: cn(radioVariants({ appearance, density }), className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx55(
+        /* @__PURE__ */ jsx59(
           "span",
           {
             "aria-hidden": "true",
             "data-slot": "radio-control",
             className: radioControlVariants({ appearance }),
-            children: /* @__PURE__ */ jsx55(
+            children: /* @__PURE__ */ jsx59(
               RadioGroupPrimitive.Indicator,
               {
                 "data-slot": "radio-indicator",
                 className: "flex items-center justify-center",
-                children: /* @__PURE__ */ jsx55(Circle, { "aria-hidden": "true", size: 8, fill: "currentColor" })
+                children: /* @__PURE__ */ jsx59(Circle, { "aria-hidden": "true", size: 8, fill: "currentColor" })
               }
             )
           }
         ),
         /* @__PURE__ */ jsxs48("span", { className: "flex min-w-0 flex-col gap-[var(--space-1)]", children: [
-          /* @__PURE__ */ jsx55(
+          /* @__PURE__ */ jsx59(
             "span",
             {
               id: labelId,
@@ -9499,7 +10098,7 @@ var Radio = React44.forwardRef(({ className, children, description, id, ...props
               children
             }
           ),
-          description ? /* @__PURE__ */ jsx55(
+          description ? /* @__PURE__ */ jsx59(
             "span",
             {
               id: descriptionId,
@@ -9517,7 +10116,7 @@ Radio.displayName = "Radio";
 
 // src/components/ui/scroll-area.tsx
 import { ScrollArea as ScrollAreaPrimitive } from "radix-ui";
-import { jsx as jsx56, jsxs as jsxs49 } from "react/jsx-runtime";
+import { jsx as jsx60, jsxs as jsxs49 } from "react/jsx-runtime";
 function ScrollArea({
   className,
   children,
@@ -9530,7 +10129,7 @@ function ScrollArea({
       className: cn("relative", className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx56(
+        /* @__PURE__ */ jsx60(
           ScrollAreaPrimitive.Viewport,
           {
             "data-slot": "scroll-area-viewport",
@@ -9538,8 +10137,8 @@ function ScrollArea({
             children
           }
         ),
-        /* @__PURE__ */ jsx56(ScrollBar, {}),
-        /* @__PURE__ */ jsx56(ScrollAreaPrimitive.Corner, {})
+        /* @__PURE__ */ jsx60(ScrollBar, {}),
+        /* @__PURE__ */ jsx60(ScrollAreaPrimitive.Corner, {})
       ]
     }
   );
@@ -9549,7 +10148,7 @@ function ScrollBar({
   orientation = "vertical",
   ...props
 }) {
-  return /* @__PURE__ */ jsx56(
+  return /* @__PURE__ */ jsx60(
     ScrollAreaPrimitive.ScrollAreaScrollbar,
     {
       "data-slot": "scroll-area-scrollbar",
@@ -9561,7 +10160,7 @@ function ScrollBar({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx56(
+      children: /* @__PURE__ */ jsx60(
         ScrollAreaPrimitive.ScrollAreaThumb,
         {
           "data-slot": "scroll-area-thumb",
@@ -9573,7 +10172,7 @@ function ScrollBar({
 }
 
 // src/components/ui/progress.tsx
-import { jsx as jsx57 } from "react/jsx-runtime";
+import { jsx as jsx61 } from "react/jsx-runtime";
 var progressFillByStatus = {
   active: "bg-[var(--primary)]",
   success: "bg-[var(--success)]",
@@ -9594,7 +10193,7 @@ function Progress({
   const clamped = Math.max(0, Math.min(safeMax, value));
   const percent = clamped / safeMax * 100;
   const w = typeof width === "number" ? `${width}px` : width;
-  return /* @__PURE__ */ jsx57(
+  return /* @__PURE__ */ jsx61(
     "div",
     {
       role: "progressbar",
@@ -9608,7 +10207,7 @@ function Progress({
       ),
       style: { width: w, height: `${height}px`, ...style },
       ...props,
-      children: /* @__PURE__ */ jsx57(
+      children: /* @__PURE__ */ jsx61(
         "div",
         {
           className: cn(
@@ -9623,10 +10222,10 @@ function Progress({
 }
 
 // src/components/ui/tree-view.tsx
-import * as React45 from "react";
+import * as React48 from "react";
 import { ChevronRight as ChevronRight3 } from "lucide-react";
 import { cva as cva25 } from "class-variance-authority";
-import { jsx as jsx58, jsxs as jsxs50 } from "react/jsx-runtime";
+import { jsx as jsx62, jsxs as jsxs50 } from "react/jsx-runtime";
 var treeViewVariants = cva25(
   "m-0 list-none p-[var(--space-1)] text-body-sm text-foreground"
 );
@@ -9729,27 +10328,27 @@ function TreeView({
   ...rest
 }) {
   const isExpandedControlled = expandedIds !== void 0;
-  const [internalExpanded, setInternalExpanded] = React45.useState(
+  const [internalExpanded, setInternalExpanded] = React48.useState(
     () => defaultExpandedIds ?? []
   );
   const expandedList = isExpandedControlled ? expandedIds : internalExpanded;
-  const expandedSet = React45.useMemo(() => new Set(expandedList), [expandedList]);
-  const items = React45.useMemo(
+  const expandedSet = React48.useMemo(() => new Set(expandedList), [expandedList]);
+  const items = React48.useMemo(
     () => flattenVisibleNodes(nodes, getChildren, expandedSet),
     [nodes, getChildren, expandedSet]
   );
-  const [focusedId, setFocusedId] = React45.useState(null);
+  const [focusedId, setFocusedId] = React48.useState(null);
   const visibleIds = items.map((item) => item.id);
   const activeId = focusedId && visibleIds.includes(focusedId) ? focusedId : selectedId && visibleIds.includes(selectedId) ? selectedId : visibleIds[0] ?? null;
-  const itemRefs = React45.useRef(/* @__PURE__ */ new Map());
-  const commitExpanded = React45.useCallback(
+  const itemRefs = React48.useRef(/* @__PURE__ */ new Map());
+  const commitExpanded = React48.useCallback(
     (next) => {
       if (!isExpandedControlled) setInternalExpanded(next);
       onExpandedChange?.(next);
     },
     [isExpandedControlled, onExpandedChange]
   );
-  const setExpanded = React45.useCallback(
+  const setExpanded = React48.useCallback(
     (id, expand) => {
       const has = expandedSet.has(id);
       if (expand && !has) {
@@ -9760,7 +10359,7 @@ function TreeView({
     },
     [commitExpanded, expandedList, expandedSet]
   );
-  const focusItem = React45.useCallback((id) => {
+  const focusItem = React48.useCallback((id) => {
     setFocusedId(id);
     itemRefs.current.get(id)?.focus();
   }, []);
@@ -9830,7 +10429,7 @@ function TreeView({
                 },
                 className: treeItemRowVariants({ selected }),
                 children: [
-                  hasChildren ? /* @__PURE__ */ jsx58(
+                  hasChildren ? /* @__PURE__ */ jsx62(
                     "span",
                     {
                       "data-slot": "treeitem-toggle",
@@ -9840,7 +10439,7 @@ function TreeView({
                         setExpanded(node.id, !expanded);
                       },
                       className: "flex size-[var(--space-4)] shrink-0 items-center justify-center text-text-tertiary",
-                      children: /* @__PURE__ */ jsx58(
+                      children: /* @__PURE__ */ jsx62(
                         ChevronRight3,
                         {
                           "aria-hidden": "true",
@@ -9853,7 +10452,7 @@ function TreeView({
                         }
                       )
                     }
-                  ) : /* @__PURE__ */ jsx58(
+                  ) : /* @__PURE__ */ jsx62(
                     "span",
                     {
                       "data-slot": "treeitem-spacer",
@@ -9861,18 +10460,18 @@ function TreeView({
                       className: "size-[var(--space-4)] shrink-0"
                     }
                   ),
-                  /* @__PURE__ */ jsx58("span", { className: "flex min-w-0 flex-1 items-center gap-[var(--space-2)]", children: renderItem(node, itemState) })
+                  /* @__PURE__ */ jsx62("span", { className: "flex min-w-0 flex-1 items-center gap-[var(--space-2)]", children: renderItem(node, itemState) })
                 ]
               }
             ),
-            hasChildren && expanded && children ? /* @__PURE__ */ jsx58("ul", { role: "group", "data-slot": "tree-group", className: "m-0 list-none p-0", children: renderLevel(children, depth + 1) }) : null
+            hasChildren && expanded && children ? /* @__PURE__ */ jsx62("ul", { role: "group", "data-slot": "tree-group", className: "m-0 list-none p-0", children: renderLevel(children, depth + 1) }) : null
           ]
         },
         node.id
       );
     });
   }
-  return /* @__PURE__ */ jsx58(
+  return /* @__PURE__ */ jsx62(
     "ul",
     {
       role: "tree",
@@ -9888,7 +10487,7 @@ function TreeView({
 }
 
 // src/components/branding/olun-logo.tsx
-import { jsx as jsx59, jsxs as jsxs51 } from "react/jsx-runtime";
+import { jsx as jsx63, jsxs as jsxs51 } from "react/jsx-runtime";
 var SYMBOL_LARGE = { stroke: 24, dotX: 184, dotY: 180, dotR: 13 };
 var SYMBOL_SMALL = { stroke: 18, dotX: 185, dotY: 175, dotR: 22 };
 function OlunSymbol({ size = 28, className }) {
@@ -9904,7 +10503,7 @@ function OlunSymbol({ size = 28, className }) {
       className,
       "aria-hidden": "true",
       children: [
-        /* @__PURE__ */ jsx59(
+        /* @__PURE__ */ jsx63(
           "circle",
           {
             cx: "108",
@@ -9916,7 +10515,7 @@ function OlunSymbol({ size = 28, className }) {
             style: { color: "var(--text-primary)" }
           }
         ),
-        /* @__PURE__ */ jsx59("circle", { cx: g.dotX, cy: g.dotY, r: g.dotR, fill: "var(--accent-pop)" })
+        /* @__PURE__ */ jsx63("circle", { cx: g.dotX, cy: g.dotY, r: g.dotR, fill: "var(--accent-pop)" })
       ]
     }
   );
@@ -9937,7 +10536,7 @@ function OlunLogo({
         gap: "var(--space-3)"
       },
       children: [
-        showSymbol && /* @__PURE__ */ jsx59(OlunSymbol, { size: symbolSize }),
+        showSymbol && /* @__PURE__ */ jsx63(OlunSymbol, { size: symbolSize }),
         /* @__PURE__ */ jsxs51(
           "span",
           {
@@ -9950,7 +10549,7 @@ function OlunLogo({
             },
             children: [
               "OLUN",
-              !showSymbol && /* @__PURE__ */ jsx59("span", { style: { color: "var(--accent)" }, children: "." })
+              !showSymbol && /* @__PURE__ */ jsx63("span", { style: { color: "var(--accent)" }, children: "." })
             ]
           }
         )
@@ -9961,11 +10560,11 @@ function OlunLogo({
 
 // src/components/branding/theme-toggle.tsx
 import { Sun, Moon } from "lucide-react";
-import { jsx as jsx60 } from "react/jsx-runtime";
+import { jsx as jsx64 } from "react/jsx-runtime";
 function ThemeToggle({ className }) {
   const { resolvedTheme, toggleTheme } = useOlunTheme();
   const Icon = resolvedTheme === "dark" ? Moon : Sun;
-  return /* @__PURE__ */ jsx60(
+  return /* @__PURE__ */ jsx64(
     "button",
     {
       onClick: () => toggleTheme(),
@@ -9977,14 +10576,14 @@ function ThemeToggle({ className }) {
       ),
       "aria-label": "\uD14C\uB9C8 \uC804\uD658",
       title: resolvedTheme === "dark" ? "\uB77C\uC774\uD2B8 \uBAA8\uB4DC\uB85C" : "\uB2E4\uD06C \uBAA8\uB4DC\uB85C",
-      children: /* @__PURE__ */ jsx60(Icon, { className: "size-[18px]", strokeWidth: 1.75 })
+      children: /* @__PURE__ */ jsx64(Icon, { className: "size-[18px]", strokeWidth: 1.75 })
     }
   );
 }
 
 // src/components/branding/theme-fab.tsx
 import { Sun as Sun2, Moon as Moon2 } from "lucide-react";
-import { jsx as jsx61 } from "react/jsx-runtime";
+import { jsx as jsx65 } from "react/jsx-runtime";
 function ThemeFab({ variant = "square" } = {}) {
   const { mounted, resolvedTheme, toggleTheme } = useOlunTheme();
   if (!mounted) {
@@ -10024,7 +10623,7 @@ function ThemeFab({ variant = "square" } = {}) {
     WebkitBackdropFilter: "blur(16px)",
     zIndex: 9999
   };
-  return /* @__PURE__ */ jsx61(
+  return /* @__PURE__ */ jsx65(
     "button",
     {
       onClick: () => toggleTheme(),
@@ -10049,7 +10648,7 @@ function ThemeFab({ variant = "square" } = {}) {
           e.currentTarget.style.color = "var(--text-secondary)";
         }
       },
-      children: /* @__PURE__ */ jsx61(
+      children: /* @__PURE__ */ jsx65(
         Icon,
         {
           size: isCircle ? 22 : 16,
@@ -10061,7 +10660,7 @@ function ThemeFab({ variant = "square" } = {}) {
 }
 
 // src/components/logos/organization-logo.tsx
-import { jsx as jsx62 } from "react/jsx-runtime";
+import { jsx as jsx66 } from "react/jsx-runtime";
 var organizationLogoRegistry = {
   jbnu: {
     label: "\uC804\uBD81\uB300\uD559\uAD50 \uC5E0\uBE14\uB7FC",
@@ -10090,7 +10689,7 @@ function OrganizationLogo({
 }) {
   const asset = organizationLogoRegistry[organization];
   const isDecorative = ariaHidden === true || ariaHidden === "true";
-  return /* @__PURE__ */ jsx62(
+  return /* @__PURE__ */ jsx66(
     "svg",
     {
       viewBox: asset.viewBox,
@@ -10108,14 +10707,16 @@ function OrganizationLogo({
         ...style
       },
       ...props,
-      children: asset.paths.map((path) => /* @__PURE__ */ jsx62("path", { d: path }, path))
+      children: asset.paths.map((path) => /* @__PURE__ */ jsx66("path", { d: path }, path))
     }
   );
 }
 export {
   ActionFooter,
+  ActionMenu,
   ActionSheet,
   Alert,
+  AlertDialog,
   Avatar,
   AvatarFallback,
   AvatarImage,