@fayz-ai/ui 0.40.0 → 0.43.0

package/dist/{chunk-TP4YGQY7.js → chunk-L6PNGGHM.js}

@@ -1,10 +1,11 @@
-import { cn, ConfirmDialog } from './chunk-FKYFYGAS.js';
+import { cn, ConfirmDialog, Button } from './chunk-FKYFYGAS.js';
 import { ICON_MAP } from './chunk-ZTS5S6BZ.js';
-import * as React12 from 'react';
+import * as React16 from 'react';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
-import { X, Loader2, ChevronLeft, ArrowLeft, Bell, PanelLeft, PanelLeftClose, Search, CornerDownLeft, Menu, Crown, ChevronsRight, ChevronsLeft, ChevronDown, ChevronRight, Info, ExternalLink, CreditCard, Sparkles, Home, ChevronUp, Plus, Settings, UserCog, LogOut } from 'lucide-react';
+import { X, ChevronRight, Check, Circle, Loader2, ChevronLeft, ArrowLeft, ChevronDown, MoreHorizontal, Bell, PanelLeft, PanelLeftClose, Search, CornerDownLeft, Menu, Crown, ChevronsRight, ChevronsLeft, Info, ExternalLink, CreditCard, Sparkles, Home, ChevronUp, Plus, Settings, SlidersHorizontal, MoreVertical, UserCog, LogOut } from 'lucide-react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { createPortal } from 'react-dom';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import { useTranslation, useNavReferrer, routeModule, navHistoryBack, recordNavigation } from '@fayz-ai/core';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import { create } from 'zustand';
@@ -28,11 +29,11 @@ var Modal = DialogPrimitive.Root;
 var ModalTrigger = DialogPrimitive.Trigger;
 var ModalClose = DialogPrimitive.Close;
 var ModalPortal = DialogPrimitive.Portal;
-var ModalHostContext = React12.createContext(null);
+var ModalHostContext = React16.createContext(null);
 function useModalHost() {
-  return React12.useContext(ModalHostContext);
+  return React16.useContext(ModalHostContext);
 }
-var ModalOverlay = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var ModalOverlay = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   DialogPrimitive.Overlay,
   {
     ref,
@@ -45,9 +46,9 @@ var ModalOverlay = React12.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 ModalOverlay.displayName = "ModalOverlay";
-var ModalContent = React12.forwardRef(({ className, children, size = "lg", hideClose, noPadding, onPointerDownOutside, onInteractOutside, onCloseAutoFocus, ...props }, ref) => {
-  const [host, setHost] = React12.useState(null);
-  const attach = React12.useCallback((node) => {
+var ModalContent = React16.forwardRef(({ className, children, size = "lg", hideClose, noPadding, onPointerDownOutside, onInteractOutside, onCloseAutoFocus, ...props }, ref) => {
+  const [host, setHost] = React16.useState(null);
+  const attach = React16.useCallback((node) => {
     setHost(node);
     if (typeof ref === "function") ref(node);
     else if (ref) ref.current = node;
@@ -112,16 +113,249 @@ function ModalBody({ className, ...props }) {
     }
   );
 }
-function ModalFooter({ className, ...props }) {
-  return /* @__PURE__ */ jsx("div", { className: cn("mt-auto flex flex-col-reverse gap-2 pb-[env(safe-area-inset-bottom)] sm:mt-0 sm:flex-row sm:justify-end sm:gap-0 sm:space-x-2 sm:pb-0 shrink-0", className), ...props });
+function ModalFooter({ className, variant = "inline", start, children, ...props }) {
+  if (variant === "bar") {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: cn(
+          "flex shrink-0 items-center justify-between gap-3 border-t fayz-glass-divider px-5 py-2.5",
+          "pb-[calc(0.625rem+env(safe-area-inset-bottom))] sm:pb-2.5",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "flex min-w-0 items-center gap-3", children: start }),
+          /* @__PURE__ */ jsx("div", { className: "flex shrink-0 items-center gap-2", children })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx("div", { className: cn("mt-auto flex flex-col-reverse gap-2 pb-[env(safe-area-inset-bottom)] sm:mt-0 sm:flex-row sm:justify-end sm:gap-0 sm:space-x-2 sm:pb-0 shrink-0", className), ...props, children });
 }
-var ModalTitle = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(DialogPrimitive.Title, { ref, className: cn("text-lg font-semibold leading-none tracking-tight", className), ...props }));
+var ModalTitle = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(DialogPrimitive.Title, { ref, className: cn("text-lg font-semibold leading-none tracking-tight", className), ...props }));
 ModalTitle.displayName = "ModalTitle";
-var ModalDescription = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(DialogPrimitive.Description, { ref, className: cn("text-sm text-muted-foreground", className), ...props }));
+var ModalDescription = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(DialogPrimitive.Description, { ref, className: cn("text-sm text-muted-foreground", className), ...props }));
 ModalDescription.displayName = "ModalDescription";
+function useScrim(open) {
+  const [mounted, setMounted] = React16.useState(open);
+  const [visible, setVisible] = React16.useState(open);
+  React16.useEffect(() => {
+    if (open) {
+      setMounted(true);
+      let frame = requestAnimationFrame(() => {
+        frame = requestAnimationFrame(() => setVisible(true));
+      });
+      return () => cancelAnimationFrame(frame);
+    }
+    setVisible(false);
+    const timer = window.setTimeout(() => setMounted(false), SCRIM_MS);
+    return () => window.clearTimeout(timer);
+  }, [open]);
+  return { mounted, visible };
+}
+var SCRIM_MS = 200;
+function MobileScrim({ open, onClose, focus }) {
+  const scrim = useScrim(open);
+  const [box, setBox] = React16.useState(null);
+  React16.useEffect(() => {
+    if (open) setBox(focus ? focus.getBoundingClientRect() : null);
+  }, [open, focus]);
+  if (!scrim.mounted || typeof document === "undefined") return null;
+  const fade = cn("transition-opacity duration-200 motion-reduce:transition-none", scrim.visible ? "opacity-100" : "opacity-0");
+  return createPortal(
+    box ? /* @__PURE__ */ jsx("div", { "aria-hidden": true, onClick: onClose, className: cn("fixed inset-0 z-[100] overflow-hidden md:hidden", fade), children: /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "absolute rounded-xl ring-1 ring-foreground/10 transition-transform duration-200 ease-out motion-reduce:transition-none",
+          scrim.visible ? "scale-100" : "scale-[1.04]"
+        ),
+        style: {
+          left: box.left,
+          top: box.top,
+          width: box.width,
+          height: box.height,
+          boxShadow: "0 0 0 200vmax hsl(var(--foreground) / 0.4)"
+        }
+      }
+    ) }) : /* @__PURE__ */ jsx("div", { "aria-hidden": true, onClick: onClose, className: cn("fixed inset-0 z-[100] bg-foreground/40 md:hidden", fade) }),
+    document.body
+  );
+}
+function Dropdown({ open: openProp, defaultOpen, onOpenChange, ...props }) {
+  const [own, setOwn] = React16.useState(defaultOpen ?? false);
+  const open = openProp ?? own;
+  const change = (next) => {
+    setOwn(next);
+    onOpenChange?.(next);
+  };
+  const [trigger, setTrigger] = React16.useState(null);
+  const focus = open ? trigger?.closest("[data-scrim-focus]") ?? null : null;
+  return /* @__PURE__ */ jsxs(DropdownTriggerContext.Provider, { value: setTrigger, children: [
+    /* @__PURE__ */ jsx(MobileScrim, { open, onClose: () => change(false), focus }),
+    /* @__PURE__ */ jsx(DropdownMenuPrimitive.Root, { open, onOpenChange: change, ...props })
+  ] });
+}
+var DropdownTriggerContext = React16.createContext(null);
+var DropdownTrigger = React16.forwardRef((props, ref) => {
+  const register = React16.useContext(DropdownTriggerContext);
+  const setRef = React16.useCallback((el) => {
+    register?.(el);
+    if (typeof ref === "function") ref(el);
+    else if (ref) ref.current = el;
+  }, [register, ref]);
+  return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Trigger, { ref: setRef, ...props });
+});
+DropdownTrigger.displayName = DropdownMenuPrimitive.Trigger.displayName;
+var DropdownGroup = DropdownMenuPrimitive.Group;
+var DropdownPortal = DropdownMenuPrimitive.Portal;
+var DropdownSub = DropdownMenuPrimitive.Sub;
+var DropdownRadioGroup = DropdownMenuPrimitive.RadioGroup;
+var DropdownSubTrigger = React16.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+  DropdownMenuPrimitive.SubTrigger,
+  {
+    ref,
+    className: cn(
+      "flex cursor-default select-none items-center rounded-button px-2 py-1.5 text-sm outline-none focus:bg-muted data-[state=open]:bg-muted",
+      inset && "pl-8",
+      className
+    ),
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ jsx(ChevronRight, { className: "ml-auto h-4 w-4" })
+    ]
+  }
+));
+DropdownSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
+var DropdownSubContent = React16.forwardRef(({ className, ...props }, ref) => (
+  // Portaled, like DropdownContent. Without it the submenu renders inside the
+  // parent panel's DOM — and that panel is `overflow-hidden`, so the submenu
+  // was clipped to its box: a flyout you could open and never reach.
+  /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+    DropdownMenuPrimitive.SubContent,
+    {
+      ref,
+      className: cn(
+        "fayz-glass-surface fz-menu-glass z-[110] min-w-[8rem] overflow-hidden rounded-card border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        className
+      ),
+      ...props
+    }
+  ) })
+));
+DropdownSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
+var DropdownContent = React16.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    className: cn(
+      "fayz-glass-surface fz-menu-glass z-[110] min-w-[8rem] overflow-hidden rounded-card border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      className
+    ),
+    ...props
+  }
+) }));
+DropdownContent.displayName = DropdownMenuPrimitive.Content.displayName;
+var DropdownItem = React16.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Item,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-default select-none items-center rounded-button px-2 py-1.5 text-sm outline-none transition-colors focus:bg-muted data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      inset && "pl-8",
+      className
+    ),
+    ...props
+  }
+));
+DropdownItem.displayName = DropdownMenuPrimitive.Item.displayName;
+var DropdownCheckboxItem = React16.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs(
+  DropdownMenuPrimitive.CheckboxItem,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-default select-none items-center rounded-button py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-muted data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    checked,
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) }) }),
+      children
+    ]
+  }
+));
+DropdownCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
+var DropdownRadioItem = React16.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+  DropdownMenuPrimitive.RadioItem,
+  {
+    ref,
+    className: cn(
+      "relative flex cursor-default select-none items-center rounded-button py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-muted data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    ),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(Circle, { className: "h-2 w-2 fill-current" }) }) }),
+      children
+    ]
+  }
+));
+DropdownRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
+var DropdownLabel = React16.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Label,
+  {
+    ref,
+    className: cn(
+      "px-2 py-1.5 text-sm font-semibold",
+      inset && "pl-8",
+      className
+    ),
+    ...props
+  }
+));
+DropdownLabel.displayName = DropdownMenuPrimitive.Label.displayName;
+var DropdownSeparator = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive.Separator,
+  {
+    ref,
+    className: cn("-mx-1 my-1 h-px bg-muted", className),
+    ...props
+  }
+));
+DropdownSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
+var DropdownShortcut = ({
+  className,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn("ml-auto text-xs tracking-widest opacity-60", className),
+      ...props
+    }
+  );
+};
+DropdownShortcut.displayName = "DropdownShortcut";
+var WIDE_QUERY = "(min-width: 768px)";
+function useIsWide(query = WIDE_QUERY) {
+  const [wide, setWide] = React16.useState(
+    () => typeof window === "undefined" ? true : window.matchMedia(query).matches
+  );
+  React16.useEffect(() => {
+    const mq = window.matchMedia(query);
+    const onChange = () => setWide(mq.matches);
+    mq.addEventListener("change", onChange);
+    return () => mq.removeEventListener("change", onChange);
+  }, [query]);
+  return wide;
+}
 var HIDDEN = { visible: false, saving: false };
-var SaveBarApiContext = React12.createContext(null);
-var SaveBarStateContext = React12.createContext({ visible: false, saving: false });
+var SaveBarApiContext = React16.createContext(null);
+var SaveBarStateContext = React16.createContext({ visible: false, saving: false });
 var _saveBarVisible = false;
 var saveFlow = { current: null };
 var requestSave = (onSave) => {
@@ -140,7 +374,7 @@ function setSaveBarVisibleSignal(v) {
   _saveBarSubs.forEach((fn) => fn());
 }
 function useSaveBarVisible() {
-  return React12.useSyncExternalStore(
+  return React16.useSyncExternalStore(
     (cb) => {
       _saveBarSubs.add(cb);
       return () => {
@@ -152,10 +386,10 @@ function useSaveBarVisible() {
   );
 }
 function SaveBarProvider({ children }) {
-  const [state, setState] = React12.useState({ visible: false, saving: false });
-  const handlers = React12.useRef({});
-  const entries = React12.useRef([]);
-  const api = React12.useMemo(() => ({
+  const [state, setState] = React16.useState({ visible: false, saving: false });
+  const handlers = React16.useRef({});
+  const entries = React16.useRef([]);
+  const api = React16.useMemo(() => ({
     setState,
     handlers,
     entries,
@@ -165,16 +399,16 @@ function SaveBarProvider({ children }) {
       setState(top ? top.state : HIDDEN);
     }
   }), []);
-  const backStack = React12.useRef([]);
-  const backApi = React12.useMemo(() => ({ stack: backStack }), []);
-  React12.useEffect(() => {
+  const backStack = React16.useRef([]);
+  const backApi = React16.useMemo(() => ({ stack: backStack }), []);
+  React16.useEffect(() => {
     setSaveBarVisibleSignal(state.visible);
   }, [state.visible]);
-  const [leaveTo, setLeaveTo] = React12.useState(null);
-  const bypass = React12.useRef(false);
+  const [leaveTo, setLeaveTo] = React16.useState(null);
+  const bypass = React16.useRef(false);
   if (state.saving && saveFlow.current) saveFlow.current.started = true;
   const t = useTranslation();
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (!state.dirty || state.host || typeof window === "undefined") return;
     const guarded = window.location.href;
     const onNav = (e) => {
@@ -209,7 +443,7 @@ function SaveBarProvider({ children }) {
       bypass.current = false;
     }, 0);
   };
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     function onKey(e) {
       if (state.visible && !state.saving) {
         if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) {
@@ -252,7 +486,7 @@ function SaveBarProvider({ children }) {
     )
   ] }) }) });
 }
-var BackNavApiContext = React12.createContext(null);
+var BackNavApiContext = React16.createContext(null);
 function isEditableTarget(target) {
   const el = target;
   if (!el || !el.tagName) return false;
@@ -260,12 +494,12 @@ function isEditableTarget(target) {
   return tag === "input" || tag === "textarea" || tag === "select" || el.isContentEditable;
 }
 function useBackHandler(onBack) {
-  const api = React12.useContext(BackNavApiContext);
-  const ref = React12.useRef(onBack);
-  React12.useEffect(() => {
+  const api = React16.useContext(BackNavApiContext);
+  const ref = React16.useRef(onBack);
+  React16.useEffect(() => {
     ref.current = onBack;
   });
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (!api) return;
     const stack = api.stack.current;
     stack.push(ref);
@@ -276,16 +510,16 @@ function useBackHandler(onBack) {
   }, [api]);
 }
 function useSaveBar({ dirty, alwaysVisible, saving = false, onSave, onDiscard, message, saveLabel, discardLabel }) {
-  const api = React12.useContext(SaveBarApiContext);
+  const api = React16.useContext(SaveBarApiContext);
   const host = useModalHost();
-  const entry = React12.useRef({ state: HIDDEN, handlers: {} });
-  React12.useEffect(() => {
+  const entry = React16.useRef({ state: HIDDEN, handlers: {} });
+  React16.useEffect(() => {
     entry.current.handlers = { onSave, onDiscard };
     if (api && api.entries.current[api.entries.current.length - 1] === entry.current) {
       api.handlers.current = entry.current.handlers;
     }
   });
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (!api) return;
     const list = api.entries.current;
     list.push(entry.current);
@@ -296,19 +530,19 @@ function useSaveBar({ dirty, alwaysVisible, saving = false, onSave, onDiscard, m
       api.sync();
     };
   }, [api]);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (!api) return;
     entry.current.state = { visible: dirty || !!alwaysVisible, dirty, saving, message, saveLabel, discardLabel, host };
     if (api.entries.current[api.entries.current.length - 1] === entry.current) api.sync();
   }, [api, dirty, alwaysVisible, saving, message, saveLabel, discardLabel, host]);
 }
 function SaveBar({ className }) {
-  const state = React12.useContext(SaveBarStateContext);
-  const api = React12.useContext(SaveBarApiContext);
+  const state = React16.useContext(SaveBarStateContext);
+  const api = React16.useContext(SaveBarApiContext);
   const t = useTranslation();
-  const [rendered, setRendered] = React12.useState(state.visible);
-  const [closing, setClosing] = React12.useState(false);
-  React12.useEffect(() => {
+  const [rendered, setRendered] = React16.useState(state.visible);
+  const [closing, setClosing] = React16.useState(false);
+  React16.useEffect(() => {
     if (state.visible) {
       setRendered(true);
       setClosing(false);
@@ -374,7 +608,7 @@ function SaveBar({ className }) {
 var TooltipProvider = TooltipPrimitive.Provider;
 var Tooltip = TooltipPrimitive.Root;
 var TooltipTrigger = TooltipPrimitive.Trigger;
-var TooltipContent = React12.forwardRef(({ className, sideOffset = 4, ...props }, ref) => (
+var TooltipContent = React16.forwardRef(({ className, sideOffset = 4, ...props }, ref) => (
   // Portaled: inside a scroll box (a table, a modal body) the tip was clipped by its container.
   /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx(
     TooltipPrimitive.Content,
@@ -419,7 +653,7 @@ var usePageHeaderStore = create((set, get) => ({
 function useRegisterPageActions() {
   const add = usePageHeaderStore((s) => s.addActions);
   const remove = usePageHeaderStore((s) => s.removeActions);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     add();
     return remove;
   }, [add, remove]);
@@ -442,7 +676,7 @@ function usePageTitleSlotHost() {
 function usePageHeaderHost() {
   const addHost = usePageHeaderStore((s) => s.addHost);
   const removeHost = usePageHeaderStore((s) => s.removeHost);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     addHost();
     return removeHost;
   }, [addHost, removeHost]);
@@ -460,30 +694,30 @@ function PageHeaderOutlet({ className, active = true }) {
   const hasActions = usePageHeaderStore((s) => s.actions > 0);
   const addOutlet = usePageHeaderStore((s) => s.addOutlet);
   const removeOutlet = usePageHeaderStore((s) => s.removeOutlet);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (!active) return;
     addOutlet();
     return removeOutlet;
   }, [active, addOutlet, removeOutlet]);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (active) return;
     setOutletSlot(null);
     setOutletActionsSlot(null);
   }, [active, setOutletSlot, setOutletActionsSlot]);
   if (!active) return null;
-  return React12.createElement(
+  return React16.createElement(
     "div",
     { className: `flex min-h-9 items-center justify-between gap-3${claimed || hasActions ? "" : " hidden"} ${className ?? "mb-3"}` },
-    React12.createElement("div", { ref: setOutletSlot, className: "flex min-w-0 flex-1 items-center" }),
-    React12.createElement("div", { ref: setOutletActionsSlot, className: "flex shrink-0 items-center gap-2" })
+    React16.createElement("div", { ref: setOutletSlot, className: "flex min-w-0 flex-1 items-center" }),
+    React16.createElement("div", { ref: setOutletActionsSlot, className: "flex shrink-0 items-center gap-2" })
   );
 }
 function usePageHeader(active, options) {
-  const id = React12.useId();
+  const id = React16.useId();
   const claim = usePageHeaderStore((s) => s.claim);
   const release = usePageHeaderStore((s) => s.release);
   const back = options?.back ?? false;
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (!active) {
       release(id);
       return;
@@ -500,18 +734,18 @@ function useModuleViewLabel() {
 }
 function usePublishModuleViewLabel(label) {
   const setLabel = usePageHeaderStore((s) => s.setModuleViewLabel);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     setLabel(label ?? null);
     return () => setLabel(null);
   }, [label, setLabel]);
 }
 function PageTitlePortal({ children }) {
   const slot = usePageTitleSlot();
-  if (!slot) return React12.createElement(React12.Fragment, null, children);
+  if (!slot) return React16.createElement(React16.Fragment, null, children);
   return createPortal(children, slot);
 }
-var Hint = React12.forwardRef(function Hint2({ label, children, side = "top", delayDuration = 0, ...rest }, ref) {
-  if (!label) return React12.cloneElement(children, { ...rest, ref });
+var Hint = React16.forwardRef(function Hint2({ label, children, side = "top", delayDuration = 0, ...rest }, ref) {
+  if (!label) return React16.cloneElement(children, { ...rest, ref });
   return /* @__PURE__ */ jsx(TooltipPrimitive.Provider, { delayDuration, children: /* @__PURE__ */ jsxs(Tooltip, { children: [
     /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, ...rest, ref, children }),
     /* @__PURE__ */ jsx(TooltipContent, { side, className: "px-2 py-1 text-xs font-medium", children: label })
@@ -600,7 +834,7 @@ function PageHeader({ title, onBack, parentLabel, backLabel }) {
   const hasHost = useHasPageHeaderHost();
   const { onBack: effectiveOnBack, parentLabel: effectiveParent } = useCrossModuleBack(onBack, parentLabel);
   useBackHandler(effectiveOnBack);
-  const node = React12.useMemo(() => /* @__PURE__ */ jsx(
+  const node = React16.useMemo(() => /* @__PURE__ */ jsx(
     PageHeaderCrumb,
     {
       title,
@@ -612,17 +846,198 @@ function PageHeader({ title, onBack, parentLabel, backLabel }) {
   if (hasHost) return /* @__PURE__ */ jsx(PageTitlePortal, { children: node });
   return /* @__PURE__ */ jsx("div", { className: "mb-4", children: node });
 }
+function iconOf(action, className) {
+  const Icon = action.icon;
+  return Icon ? /* @__PURE__ */ jsx(Icon, { className }) : null;
+}
+function PageActionBar({ actions, className }) {
+  const wide = useIsWide();
+  const visible = actions.filter((a) => !a.hidden);
+  if (visible.length === 0) return null;
+  if (!wide) {
+    const usable = visible.filter((a) => !a.desktopOnly);
+    if (usable.length === 0) return null;
+    const fab = /* @__PURE__ */ jsx(PageActionFab, { actions: usable });
+    const fabHost = typeof document !== "undefined" ? document.querySelector(".shell-enter") ?? document.body : null;
+    return fabHost ? createPortal(fab, fabHost) : fab;
+  }
+  let seenPrimary = false;
+  const primary = [];
+  const secondary = [];
+  const utility = [];
+  const danger = [];
+  for (const a of visible) {
+    const intent = a.intent ?? "secondary";
+    if (intent === "primary" && !seenPrimary) {
+      seenPrimary = true;
+      primary.push(a);
+      continue;
+    }
+    if (intent === "danger") {
+      danger.push(a);
+      continue;
+    }
+    if (intent === "utility") {
+      utility.push(a);
+      continue;
+    }
+    secondary.push(a);
+  }
+  const head = primary[0];
+  const menu = [...secondary, ...danger];
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex shrink-0 items-center gap-2", className), children: [
+    utility.map((a) => (
+      // Um botão só de ícone não diz o que faz. `title=` parecia resolver e
+      // não resolve: espera ~1s que ninguém controla, sai na pintura do
+      // sistema operacional, nunca aparece no toque e vários leitores de tela
+      // pulam. Hint é o tooltip do design system, e o texto é ANUNCIADO.
+      /* @__PURE__ */ jsx(Hint, { label: a.label, children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "ghost",
+          size: "icon",
+          onClick: () => void a.onSelect(),
+          disabled: a.disabled,
+          "aria-label": a.label,
+          "data-testid": a.testId,
+          "data-tour": `action.${a.id}`,
+          children: iconOf(a, "h-4 w-4")
+        }
+      ) }, a.id)
+    )),
+    head && menu.length === 0 && /* @__PURE__ */ jsxs(Button, { className: head.ai ? "fz-ai-button" : void 0, onClick: () => void head.onSelect(), disabled: head.disabled, "data-testid": head.testId, "data-tour": `action.${head.id}`, children: [
+      iconOf(head, "mr-1.5 h-4 w-4"),
+      head.label
+    ] }),
+    head && menu.length > 0 && /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
+      /* @__PURE__ */ jsxs(Button, { className: "rounded-r-none", onClick: () => void head.onSelect(), disabled: head.disabled, "data-testid": head.testId, "data-tour": `action.${head.id}`, children: [
+        iconOf(head, "mr-1.5 h-4 w-4"),
+        head.label
+      ] }),
+      /* @__PURE__ */ jsxs(Dropdown, { children: [
+        /* @__PURE__ */ jsx(DropdownTrigger, { asChild: true, children: /* @__PURE__ */ jsx(Hint, { label: `${head.label}\u2026`, children: /* @__PURE__ */ jsx(
+          Button,
+          {
+            className: "-ml-px rounded-l-none px-2",
+            "aria-label": `${head.label}\u2026`,
+            "data-tour": menu.map((a) => `action.${a.id}`).join(" "),
+            children: /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4" })
+          }
+        ) }) }),
+        /* @__PURE__ */ jsx(DropdownContent, { align: "end", className: "w-56", children: /* @__PURE__ */ jsx(ActionItems, { actions: menu }) })
+      ] })
+    ] }),
+    !head && menu.length > 0 && /* @__PURE__ */ jsxs(Dropdown, { children: [
+      /* @__PURE__ */ jsx(DropdownTrigger, { asChild: true, children: /* @__PURE__ */ jsx(Hint, { label: "A\xE7\xF5es", children: /* @__PURE__ */ jsx(Button, { variant: "outline", size: "icon", "aria-label": "A\xE7\xF5es", children: /* @__PURE__ */ jsx(MoreHorizontal, { className: "h-4 w-4" }) }) }) }),
+      /* @__PURE__ */ jsx(DropdownContent, { align: "end", className: "w-56", children: /* @__PURE__ */ jsx(ActionItems, { actions: menu }) })
+    ] })
+  ] });
+}
+function ActionItems({ actions, stagger }) {
+  const out = [];
+  actions.forEach((a, i) => {
+    const isDanger = a.intent === "danger";
+    const prevSafe = i > 0 && actions[i - 1].intent !== "danger";
+    if (isDanger && prevSafe) out.push(/* @__PURE__ */ jsx(DropdownSeparator, {}, `${a.id}-sep`));
+    out.push(
+      /* @__PURE__ */ jsxs(
+        DropdownItem,
+        {
+          disabled: a.disabled,
+          onSelect: () => void a.onSelect(),
+          "data-testid": a.testId,
+          style: stagger ? { ["--i"]: i } : void 0,
+          className: cn("gap-2", stagger && "fz-fab-item min-h-12 gap-3 px-3 text-[15px]", isDanger && "text-destructive focus:text-destructive", a.ai && "fz-ai-action"),
+          children: [
+            iconOf(a, "h-4 w-4 shrink-0"),
+            /* @__PURE__ */ jsxs("span", { className: "min-w-0", children: [
+              /* @__PURE__ */ jsx("span", { className: "block truncate", children: a.label }),
+              a.description && /* @__PURE__ */ jsx("span", { className: "block truncate text-xs text-muted-foreground", children: a.description })
+            ] })
+          ]
+        },
+        a.id
+      )
+    );
+  });
+  return /* @__PURE__ */ jsx(Fragment, { children: out });
+}
+function PageActionFab({ actions }) {
+  const byIntent = (i) => actions.filter((a) => (a.intent ?? "secondary") === i);
+  const utility = byIntent("utility");
+  const main = [...byIntent("primary"), ...byIntent("secondary"), ...byIntent("danger")];
+  if (main.length === 0) return /* @__PURE__ */ jsx(FabButton, { actions: utility, tone: "neutral" });
+  const isCreate = main.every((a) => a.creates ?? a.icon === Plus);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    utility.length > 0 && /* @__PURE__ */ jsx(FabButton, { actions: utility, tone: "neutral", mini: true }),
+    /* @__PURE__ */ jsx(FabButton, { actions: main, tone: isCreate ? "primary" : "neutral" })
+  ] });
+}
+function FabButton({ actions, tone, mini }) {
+  const [open, setOpen] = React16.useState(false);
+  if (actions.length === 0) return null;
+  const isCreate = tone === "primary";
+  const FabIcon = isCreate ? Plus : MoreVertical;
+  const style = {
+    bottom: mini ? "calc(var(--fz-bottom-bar, 0px) + 4.75rem)" : "calc(var(--fz-bottom-bar, 0px) + 1rem)"
+  };
+  const shell = cn(
+    "fz-tap fixed z-40 flex items-center justify-center rounded-full",
+    "transition-transform active:scale-95 md:hidden",
+    // Centred on the main circle's column, so the two read as one stack.
+    mini ? "right-5 h-12 w-12" : "right-4 h-14 w-14",
+    // Glass, like the bars it floats between: a tinted fill over a heavy blur,
+    // lit on the top edge. The blur is what keeps the glyph legible over
+    // whatever scrolls beneath — the fill alone would not.
+    "backdrop-blur-xl backdrop-saturate-150",
+    isCreate ? "bg-primary/75 text-primary-foreground ring-1 ring-white/25 shadow-[inset_0_1px_0_rgb(255_255_255/0.35),0_10px_24px_-8px_hsl(var(--primary)/0.5)]" : "bg-card/60 text-foreground ring-1 ring-border/60 shadow-[inset_0_1px_0_rgb(255_255_255/0.5),0_10px_24px_-10px_rgb(0_0_0/0.35)]"
+  );
+  if (actions.length === 1) {
+    const only = actions[0];
+    const Icon = only.icon ?? FabIcon;
+    return /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        style,
+        className: shell,
+        onClick: () => void only.onSelect(),
+        disabled: only.disabled,
+        "aria-label": only.label,
+        "data-testid": only.testId,
+        children: /* @__PURE__ */ jsx(Icon, { className: mini ? "h-5 w-5" : "h-6 w-6" })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(Dropdown, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(DropdownTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        style,
+        className: cn(shell, open && "z-[105]", isCreate && "fz-fab-trigger"),
+        "aria-label": actionsMenuLabel,
+        children: /* @__PURE__ */ jsx(FabIcon, { className: mini ? "h-5 w-5" : "h-6 w-6" })
+      }
+    ) }),
+    /* @__PURE__ */ jsx(DropdownContent, { side: "top", align: "end", sideOffset: 12, className: "fz-fab-menu w-72 p-1.5 md:hidden", children: /* @__PURE__ */ jsx(ActionItems, { actions, stagger: true }) })
+  ] });
+}
+var actionsMenuLabel = "A\xE7\xF5es";
+function setActionsMenuLabel(label) {
+  actionsMenuLabel = label;
+}
 var GUTTER_PX = 8;
 var CLOSE_DELAY_MS = 140;
-var useIsomorphicLayoutEffect = typeof window !== "undefined" ? React12.useLayoutEffect : React12.useEffect;
-function iconOf(name) {
+var useIsomorphicLayoutEffect = typeof window !== "undefined" ? React16.useLayoutEffect : React16.useEffect;
+function iconOf2(name) {
   if (!name) return null;
   return ICON_MAP[name] ?? null;
 }
-var RailFlyoutContext = React12.createContext(null);
+var RailFlyoutContext = React16.createContext(null);
 var RailFlyoutProvider = RailFlyoutContext.Provider;
 function useRailRow(content) {
-  const flyout = React12.useContext(RailFlyoutContext);
+  const flyout = React16.useContext(RailFlyoutContext);
   if (!flyout || !content) return {};
   return flyout.rowProps(content);
 }
@@ -632,19 +1047,19 @@ function useRailFlyout({
   activeRoute,
   onNavigate
 }) {
-  const [state, setState] = React12.useState(null);
-  const [pos, setPos] = React12.useState({ top: 0, arrow: 20 });
-  const [animate, setAnimate] = React12.useState(false);
-  const panelRef = React12.useRef(null);
-  const closeTimer = React12.useRef(null);
-  const lastContent = React12.useRef(null);
-  const cancelClose = React12.useCallback(() => {
+  const [state, setState] = React16.useState(null);
+  const [pos, setPos] = React16.useState({ top: 0, arrow: 20 });
+  const [animate, setAnimate] = React16.useState(false);
+  const panelRef = React16.useRef(null);
+  const closeTimer = React16.useRef(null);
+  const lastContent = React16.useRef(null);
+  const cancelClose = React16.useCallback(() => {
     if (closeTimer.current) {
       clearTimeout(closeTimer.current);
       closeTimer.current = null;
     }
   }, []);
-  const show = React12.useCallback(
+  const show = React16.useCallback(
     (anchor, content2) => {
       if (!enabled) return;
       cancelClose();
@@ -652,19 +1067,19 @@ function useRailFlyout({
     },
     [enabled, cancelClose]
   );
-  const hide = React12.useCallback(() => {
+  const hide = React16.useCallback(() => {
     cancelClose();
     closeTimer.current = setTimeout(() => setState(null), CLOSE_DELAY_MS);
   }, [cancelClose]);
-  const dismiss = React12.useCallback(() => {
+  const dismiss = React16.useCallback(() => {
     cancelClose();
     setState(null);
   }, [cancelClose]);
-  React12.useEffect(() => () => cancelClose(), [cancelClose]);
-  React12.useEffect(() => {
+  React16.useEffect(() => () => cancelClose(), [cancelClose]);
+  React16.useEffect(() => {
     if (!enabled) dismiss();
   }, [enabled, dismiss]);
-  const reposition = React12.useCallback(() => {
+  const reposition = React16.useCallback(() => {
     const rail = railRef.current;
     const anchor = state?.anchor;
     if (!rail || !anchor) return;
@@ -679,7 +1094,7 @@ function useRailFlyout({
     setPos({ top, arrow });
   }, [railRef, state]);
   useIsomorphicLayoutEffect(reposition, [reposition, state?.content.key]);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (!state) return;
     const rail = railRef.current;
     const onScroll = () => reposition();
@@ -691,7 +1106,7 @@ function useRailFlyout({
     };
   }, [state, railRef, reposition]);
   const visible = !!state;
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (!visible) {
       setAnimate(false);
       return;
@@ -699,7 +1114,7 @@ function useRailFlyout({
     const id = requestAnimationFrame(() => setAnimate(true));
     return () => cancelAnimationFrame(id);
   }, [visible]);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (!visible) return;
     const onKey = (event) => {
       if (event.key === "Escape") dismiss();
@@ -707,7 +1122,7 @@ function useRailFlyout({
     window.addEventListener("keydown", onKey);
     return () => window.removeEventListener("keydown", onKey);
   }, [visible, dismiss]);
-  const rowProps = React12.useCallback(
+  const rowProps = React16.useCallback(
     (content2) => ({
       onMouseEnter: (event) => show(event.currentTarget, content2),
       onFocus: (event) => show(event.currentTarget, content2),
@@ -817,7 +1232,7 @@ function FlyoutBody({
     hasEntries && /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx("div", { className: "my-1 h-px bg-sidebar-border" }),
       /* @__PURE__ */ jsx("div", { className: "flex flex-col", children: entries.map((entry) => {
-        const EntryIcon = iconOf(entry.icon);
+        const EntryIcon = iconOf2(entry.icon);
         const isActive = !!entry.route && entry.route === activeRoute;
         return /* @__PURE__ */ jsxs(
           "button",
@@ -888,7 +1303,7 @@ function NavChildConnector({ onPath, active }) {
   ] });
 }
 var RAIL_PUSH_MS = 260;
-var useIsomorphicLayoutEffect2 = typeof window !== "undefined" ? React12.useLayoutEffect : React12.useEffect;
+var useIsomorphicLayoutEffect2 = typeof window !== "undefined" ? React16.useLayoutEffect : React16.useEffect;
 function getIcon(name) {
   return ICON_MAP[name] ?? Home;
 }
@@ -1099,7 +1514,7 @@ function NavGroup({
         // case in an app that groups its rail).
         /* @__PURE__ */ jsx("button", { "data-tour": `nav.${child.route}`, onClick: () => onNavigate(child.route), className: childClass, children: childInner })
       );
-      if (!childConnector) return /* @__PURE__ */ jsx(React12.Fragment, { children: row }, child.id);
+      if (!childConnector) return /* @__PURE__ */ jsx(React16.Fragment, { children: row }, child.id);
       const activeIndex = item.children.findIndex((c) => c.route === activeRoute);
       const onPath = activeIndex >= 0 && childIndex < activeIndex;
       return (
@@ -1121,9 +1536,9 @@ function NavGroup({
   ] });
 }
 function withCollapsed(slot, collapsed) {
-  if (!React12.isValidElement(slot)) return slot;
+  if (!React16.isValidElement(slot)) return slot;
   if (typeof slot.type === "string") return slot;
-  return React12.cloneElement(slot, { collapsed });
+  return React16.cloneElement(slot, { collapsed });
 }
 var SKELETON_ROWS = [
   { width: 56, group: false },
@@ -1165,7 +1580,7 @@ function Sidebar({
 }) {
   const currentPath = currentPathProp;
   const activeRoute = resolveActiveRoute(navigation, currentPath);
-  const railRef = React12.useRef(null);
+  const railRef = React16.useRef(null);
   const flyout = useRailFlyout({
     enabled: collapsed,
     railRef,
@@ -1178,14 +1593,14 @@ function Sidebar({
   const handleNavigate = (route) => {
     onNavigate?.(route);
   };
-  const groupWithActiveRoute = React12.useMemo(() => {
+  const groupWithActiveRoute = React16.useMemo(() => {
     const groups = navigation.filter((item) => item.children && item.children.length > 0);
     return groups.find(
       (item) => item.route === activeRoute || item.children.some((child) => child.route === activeRoute)
     )?.id ?? null;
   }, [navigation, activeRoute]);
-  const [openGroup, setOpenGroup] = React12.useState(groupWithActiveRoute);
-  React12.useEffect(() => {
+  const [openGroup, setOpenGroup] = React16.useState(groupWithActiveRoute);
+  React16.useEffect(() => {
     if (groupWithActiveRoute) setOpenGroup(groupWithActiveRoute);
   }, [groupWithActiveRoute]);
   const sectionHeading = (label) => label && !collapsed ? /* @__PURE__ */ jsx("p", { className: "px-2.5 pb-0.5 pt-1 text-[10px] font-semibold uppercase tracking-wider text-sidebar-muted", children: label }) : null;
@@ -1237,10 +1652,10 @@ function Sidebar({
     mainItems.length > 0 && renderSection(mainItems, sectionLabels?.main),
     secondaryItems.length > 0 && /* @__PURE__ */ jsx("div", { className: "mt-6", children: renderSection(secondaryItems, sectionLabels?.secondary) })
   ] });
-  const [outgoing, setOutgoing] = React12.useState(null);
-  const lastBodyRef = React12.useRef(null);
-  const lastKeyRef = React12.useRef(navKey);
-  const timerRef = React12.useRef(null);
+  const [outgoing, setOutgoing] = React16.useState(null);
+  const lastBodyRef = React16.useRef(null);
+  const lastKeyRef = React16.useRef(navKey);
+  const timerRef = React16.useRef(null);
   useIsomorphicLayoutEffect2(() => {
     if (lastKeyRef.current !== navKey) {
       const previousBody = lastBodyRef.current;
@@ -1253,7 +1668,7 @@ function Sidebar({
     }
     lastBodyRef.current = navBody;
   });
-  React12.useEffect(() => () => {
+  React16.useEffect(() => () => {
     if (timerRef.current) clearTimeout(timerRef.current);
   }, []);
   return (
@@ -1497,7 +1912,7 @@ function ShellSearch({
   const rail = tone === "rail";
   const contextual = !!onValueChange && !collapsed;
   const query = value ?? "";
-  const inputRef = React12.useRef(null);
+  const inputRef = React16.useRef(null);
   const escalate = () => setCommandPaletteOpen(true, query);
   const surface = rail ? "bg-sidebar-accent/40 text-sidebar-muted hover:bg-sidebar-accent/70 hover:text-sidebar-foreground" : "bg-accent/40 text-muted-foreground hover:bg-accent/70 hover:text-foreground";
   const ring = rail ? "focus-within:bg-sidebar-accent/70 focus-within:ring-1 focus-within:ring-sidebar-accent-foreground/25" : "focus-within:bg-accent/70 focus-within:ring-1 focus-within:ring-ring/40";
@@ -1608,7 +2023,7 @@ function TopbarUserMenu({
   onBilling,
   userMenuExtras
 }) {
-  const [open, setOpen] = React12.useState(false);
+  const [open, setOpen] = React16.useState(false);
   if (!user) return null;
   const initial = (user.fullName?.trim()?.[0] ?? user.email?.[0] ?? "?").toUpperCase();
   const item = (label, onClick, Icon) => onClick ? /* @__PURE__ */ jsxs(
@@ -1692,7 +2107,7 @@ function getIcon2(name) {
   return ICON_MAP[name] ?? Home;
 }
 function NavDropdown({ item, currentPath, onNavigate }) {
-  const [open, setOpen] = React12.useState(false);
+  const [open, setOpen] = React16.useState(false);
   const Icon = getIcon2(item.icon);
   const isChildActive = item.children?.some(
     (child) => currentPath === child.route || currentPath.startsWith(child.route + "/")
@@ -1860,9 +2275,9 @@ function Topbar({
   ] });
 }
 function useSheetDrag({ onDismiss, canDrag }) {
-  const [offset, setOffset] = React12.useState(0);
-  const [dragging, setDragging] = React12.useState(false);
-  const start = React12.useRef(null);
+  const [offset, setOffset] = React16.useState(0);
+  const [dragging, setDragging] = React16.useState(false);
+  const start = React16.useRef(null);
   const onPointerDown = (e) => {
     if (e.pointerType === "mouse") return;
     if (canDrag && !canDrag()) return;
@@ -1896,9 +2311,9 @@ function useSheetDrag({ onDismiss, canDrag }) {
     handlers: { onPointerDown, onPointerMove, onPointerUp: end, onPointerCancel: end }
   };
 }
-var SheetCloseContext = React12.createContext(null);
+var SheetCloseContext = React16.createContext(null);
 function useSheetClose() {
-  const close = React12.useContext(SheetCloseContext);
+  const close = React16.useContext(SheetCloseContext);
   return close ?? (() => {
   });
 }
@@ -1912,9 +2327,9 @@ function BottomSheet({
   className,
   label
 }) {
-  const [leaving, setLeaving] = React12.useState(false);
-  const scroller = React12.useRef(null);
-  const close = React12.useCallback(() => {
+  const [leaving, setLeaving] = React16.useState(false);
+  const scroller = React16.useRef(null);
+  const close = React16.useCallback(() => {
     setLeaving(true);
     window.setTimeout(onClose, 200);
   }, [onClose]);
@@ -1922,7 +2337,7 @@ function BottomSheet({
     onDismiss: close,
     canDrag: () => (scroller.current?.scrollTop ?? 0) <= 0
   });
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     const onKey = (e) => {
       if (e.key !== "Escape") return;
       if (onBack) onBack();
@@ -1931,15 +2346,15 @@ function BottomSheet({
     window.addEventListener("keydown", onKey);
     return () => window.removeEventListener("keydown", onKey);
   }, [close, onBack]);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     const previous = document.body.style.overflow;
     document.body.style.overflow = "hidden";
     return () => {
       document.body.style.overflow = previous;
     };
   }, []);
-  const [host, setHost] = React12.useState(null);
-  React12.useEffect(() => {
+  const [host, setHost] = React16.useState(null);
+  React16.useEffect(() => {
     setHost(document.body);
   }, []);
   if (!host) return null;
@@ -2054,17 +2469,17 @@ function SheetRow({
     }
   );
 }
-var ModuleHeaderSlotContext = React12.createContext(null);
+var ModuleHeaderSlotContext = React16.createContext(null);
 function useModuleHeaderSlot() {
-  return React12.useContext(ModuleHeaderSlotContext);
+  return React16.useContext(ModuleHeaderSlotContext);
 }
-var ModuleHeaderActionsSlotContext = React12.createContext(null);
+var ModuleHeaderActionsSlotContext = React16.createContext(null);
 function useModuleHeaderActionsSlot() {
-  return React12.useContext(ModuleHeaderActionsSlotContext);
+  return React16.useContext(ModuleHeaderActionsSlotContext);
 }
-var PageRailSlotContext = React12.createContext(null);
+var PageRailSlotContext = React16.createContext(null);
 function usePageRailSlot() {
-  return React12.useContext(PageRailSlotContext);
+  return React16.useContext(PageRailSlotContext);
 }
 function isCreateRoute(route) {
   return !!route && /\/(new|create)$/.test(route);
@@ -2091,6 +2506,62 @@ function ShellPageTitle({
     }
   );
 }
+function MobileQuickControls({ children }) {
+  const [open, setOpen] = React16.useState(false);
+  const [hasItems, setHasItems] = React16.useState(false);
+  const rootRef = React16.useRef(null);
+  const panelRef = React16.useRef(null);
+  React16.useEffect(() => {
+    const panel = panelRef.current;
+    if (!panel) return;
+    const read2 = () => setHasItems(!!panel.querySelector("button, a, input, select, [role]"));
+    read2();
+    const observer = new MutationObserver(read2);
+    observer.observe(panel, { childList: true, subtree: true });
+    return () => observer.disconnect();
+  }, []);
+  React16.useEffect(() => {
+    if (!open) return;
+    const onDown = (e) => {
+      const target = e.target;
+      if (!target || rootRef.current?.contains(target)) return;
+      if (target.closest('[data-radix-popper-content-wrapper], [role="dialog"]')) return;
+      setOpen(false);
+    };
+    document.addEventListener("pointerdown", onDown);
+    return () => document.removeEventListener("pointerdown", onDown);
+  }, [open]);
+  return /* @__PURE__ */ jsxs("div", { ref: rootRef, className: cn("relative", open && "z-[105]", !hasItems && "hidden"), children: [
+    /* @__PURE__ */ jsx(MobileScrim, { open, onClose: () => setOpen(false) }),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: () => setOpen((v) => !v),
+        "aria-label": "Ajustes r\xE1pidos",
+        "aria-expanded": open,
+        className: cn(
+          "inline-flex h-9 w-9 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent",
+          open && "bg-accent text-foreground"
+        ),
+        children: /* @__PURE__ */ jsx(SlidersHorizontal, { className: "h-5 w-5" })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref: panelRef,
+        className: cn(
+          "absolute right-0 top-full z-30 mt-2 flex w-[min(20rem,calc(100vw-2rem))] flex-col items-stretch gap-1.5 rounded-2xl border border-border bg-popover p-3 text-[15px] text-popover-foreground shadow-lg fz-menu-glass [&>*]:min-h-11",
+          // Rail-shaped controls are written in the rail's tokens; here they sit on paper.
+          "[--sidebar-accent-foreground:var(--accent-foreground)] [--sidebar-accent:var(--accent)] [--sidebar-foreground:var(--foreground)] [--sidebar-muted:var(--muted-foreground)]",
+          !open && "hidden"
+        ),
+        children
+      }
+    )
+  ] });
+}
 function SidebarLayout({
   navigation = [],
   navLoading = false,
@@ -2152,10 +2623,11 @@ function SidebarLayout({
   const setSidebarCollapsed = useLayoutStore((s) => s.setSidebarCollapsed);
   const mobileMenuOpen = useLayoutStore((st) => st.mobileDrawerOpen);
   const setMobileMenuOpen = useLayoutStore((st) => st.setMobileDrawerOpen);
-  const [headerSlot, setHeaderSlot] = React12.useState(null);
-  const [actionsSlot, setActionsSlot] = React12.useState(null);
-  const [pageRailSlot, setPageRailSlot] = React12.useState(null);
+  const [headerSlot, setHeaderSlot] = React16.useState(null);
+  const [actionsSlot, setActionsSlot] = React16.useState(null);
+  const [pageRailSlot, setPageRailSlot] = React16.useState(null);
   const hasPageActions = useHasPageActions();
+  const wide = useIsWide();
   return /* @__PURE__ */ jsx(SaveBarProvider, { children: /* @__PURE__ */ jsx(ModuleHeaderSlotContext.Provider, { value: headerSlot, children: /* @__PURE__ */ jsx(ModuleHeaderActionsSlotContext.Provider, { value: actionsSlot, children: /* @__PURE__ */ jsx(PageRailSlotContext.Provider, { value: pageRailSlot, children: /* @__PURE__ */ jsxs("div", { className: cn(
     "shell-enter fz-viewport-h flex overflow-hidden bg-background",
     hasBottomNav && "fz-has-bottom-bar",
@@ -2210,7 +2682,7 @@ function SidebarLayout({
         // 44px on a phone — the height every other bar in this product now
         // uses (the "Mais" screen, a sheet's header) and the height a phone's
         // own navigation bar has. Desktop keeps its 56px band.
-        "min-h-[44px] md:min-h-14 border-b border-border",
+        "min-h-[44px] md:min-h-14 md:border-b md:border-border",
         // On a phone this band IS the navigation bar, so it is made of the
         // same glass as the tab bar below it and the sheets between them —
         // one material for the chrome, the page reading through all of it.
@@ -2262,11 +2734,12 @@ function SidebarLayout({
             }
           ),
           topbarStart,
+          barOwnsNav && pagePrimary && pageTitle && /* @__PURE__ */ jsx("h1", { className: "absolute left-1/2 top-1/2 max-w-[50%] -translate-x-1/2 -translate-y-1/2 truncate text-[15px] font-semibold text-foreground md:hidden", children: pageTitle }),
           /* @__PURE__ */ jsx("div", { ref: setHeaderSlot, className: "flex min-w-0 flex-1 items-center" })
         ] }),
         /* @__PURE__ */ jsx("div", { className: "hidden min-w-0 flex-1 justify-center px-2 md:flex", children: /* @__PURE__ */ jsx(ShellSearch, { tone: "bar", label: searchLabel, className: "w-full max-w-[280px]" }) }),
         /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 shrink-0 items-center justify-end gap-2 md:flex-1", children: [
-          topbarEnd,
+          wide ? topbarEnd : /* @__PURE__ */ jsx(MobileQuickControls, { children: topbarEnd }),
           notificationSlot
         ] })
       ] }),
@@ -2436,9 +2909,9 @@ function TopbarLayout({
   const saveBarVisible = useSaveBarVisible();
   const mobileMenuOpen = useLayoutStore((st) => st.mobileDrawerOpen);
   const setMobileMenuOpen = useLayoutStore((st) => st.setMobileDrawerOpen);
-  const [headerSlot, setHeaderSlot] = React12.useState(null);
-  const [actionsSlot, setActionsSlot] = React12.useState(null);
-  const [pageRailSlot, setPageRailSlot] = React12.useState(null);
+  const [headerSlot, setHeaderSlot] = React16.useState(null);
+  const [actionsSlot, setActionsSlot] = React16.useState(null);
+  const [pageRailSlot, setPageRailSlot] = React16.useState(null);
   const rawClaimed = usePageHeaderClaimed();
   const setTitleSlot = usePageTitleSlotHost();
   const hasOutlet = useHasPageHeaderOutlet();
@@ -2577,10 +3050,10 @@ function MobileMoreScreen({
   onDismiss,
   onClose
 }) {
-  const [pushed, setPushed] = React12.useState(null);
-  const [query, setQuery] = React12.useState("");
-  const scroller = React12.useRef(null);
-  const close = React12.useCallback(() => {
+  const [pushed, setPushed] = React16.useState(null);
+  const [query, setQuery] = React16.useState("");
+  const scroller = React16.useRef(null);
+  const close = React16.useCallback(() => {
     onClose();
   }, [onClose]);
   const drag = useSheetDrag({
@@ -2589,7 +3062,7 @@ function MobileMoreScreen({
     // a pushed section would dismiss the screen the back button is for.
     canDrag: () => !pushed && (scroller.current?.scrollTop ?? 0) <= 0
   });
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     const onKey = (e) => {
       if (e.key !== "Escape") return;
       if (pushed) setPushed(null);
@@ -2598,7 +3071,7 @@ function MobileMoreScreen({
     window.addEventListener("keydown", onKey);
     return () => window.removeEventListener("keydown", onKey);
   }, [close, pushed]);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     const previous = document.body.style.overflow;
     document.body.style.overflow = "hidden";
     return () => {
@@ -2618,13 +3091,13 @@ function MobileMoreScreen({
     else onNavigate?.(route);
   };
   const q = query.trim().toLowerCase();
-  const flat = React12.useMemo(
+  const flat = React16.useMemo(
     () => navigation.flatMap((n) => n.children?.length ? n.children : [n]),
     [navigation]
   );
   const searching = q.length > 0;
   const hits = searching ? flat.filter((n) => n.label.toLowerCase().includes(q)) : [];
-  const sections = React12.useMemo(() => {
+  const sections = React16.useMemo(() => {
     const out = [];
     for (const key of ["main", "secondary", "settings"]) {
       const items = navigation.filter((n) => n.section === key);
@@ -2893,23 +3366,23 @@ function MinimalLayout({
   ] });
 }
 function MobileOverlay({ onClose, onNavigate, ...sidebarProps }) {
-  const [visible, setVisible] = React12.useState(false);
-  React12.useEffect(() => {
+  const [visible, setVisible] = React16.useState(false);
+  React16.useEffect(() => {
     const id = requestAnimationFrame(() => setVisible(true));
     return () => cancelAnimationFrame(id);
   }, []);
-  const close = React12.useCallback(() => {
+  const close = React16.useCallback(() => {
     setVisible(false);
     window.setTimeout(onClose, 250);
   }, [onClose]);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     const previous = document.body.style.overflow;
     document.body.style.overflow = "hidden";
     return () => {
       document.body.style.overflow = previous;
     };
   }, []);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     const onKey = (e) => {
       if (e.key === "Escape") close();
     };
@@ -3009,14 +3482,16 @@ function MobileBottomNav({
   onAssistant,
   assistantOpen,
   moreOpen,
-  retracted
+  retracted,
+  frame,
+  assistantFace
 }) {
   const path = currentPath ?? "";
-  const [openSheet, setOpenSheet] = React12.useState(null);
-  React12.useEffect(() => {
+  const [openSheet, setOpenSheet] = React16.useState(null);
+  React16.useEffect(() => {
     setOpenSheet(null);
   }, [currentPath]);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (retracted) setOpenSheet(null);
   }, [retracted]);
   const sheetItem = openSheet != null ? items[openSheet] : void 0;
@@ -3028,9 +3503,13 @@ function MobileBottomNav({
         "aria-hidden": retracted || void 0,
         className: cn(
           "fz-safe-b fixed inset-x-0 bottom-0 z-50 flex min-h-16 items-stretch justify-around md:hidden",
-          "border-t border-sidebar-border bg-sidebar text-sidebar-foreground shadow-[0_-8px_24px_hsl(var(--sidebar)/0.18)]",
+          "fz-glass-tabbar text-sidebar-foreground",
           "motion-safe:transition-transform motion-safe:duration-200 motion-safe:ease-out",
-          retracted && "pointer-events-none translate-y-full"
+          // The framed shell rounds its content card; the bar is the phone's
+          // piece of that same frame.
+          frame && "rounded-t-[28px]",
+          // Past its own height: the assistant button stands above the bar's edge.
+          retracted && "pointer-events-none translate-y-[calc(100%+2.5rem)]"
         ),
         children: items.map((item, i) => {
           if ("kind" in item && item.kind === "action") {
@@ -3046,18 +3525,36 @@ function MobileBottomNav({
               }
             ) }, item.id);
           }
+          if ("kind" in item && item.kind === "assistant") {
+            const AssistantIcon = bottomNavIcon(item.icon, Sparkles);
+            const label2 = item.label ?? "IA";
+            return /* @__PURE__ */ jsx("div", { className: "flex flex-1 items-start justify-center", children: /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => {
+                  setOpenSheet(null);
+                  onAssistant?.();
+                },
+                "aria-label": label2,
+                "aria-expanded": !!assistantOpen,
+                className: cn(
+                  "-mt-3 flex h-[60px] w-[60px] items-center justify-center rounded-full shadow-lg ring-[5px] ring-sidebar transition-transform active:scale-95",
+                  assistantFace ? "bg-card" : "bg-primary text-primary-foreground",
+                  assistantOpen && "ring-sidebar-accent-foreground"
+                ),
+                children: assistantFace ?? /* @__PURE__ */ jsx(AssistantIcon, { className: "h-6 w-6" })
+              }
+            ) }, "assistant");
+          }
           const isMore = "kind" in item && item.kind === "more";
-          const isAssistant = "kind" in item && item.kind === "assistant";
-          const label = isMore ? item.label ?? "Mais" : isAssistant ? item.label ?? "IA" : item.label;
-          const Icon = bottomNavIcon(
-            item.icon,
-            isMore ? Menu : isAssistant ? Sparkles : Home
-          );
-          const route = isMore || isAssistant ? void 0 : item.route;
-          const children = isMore || isAssistant ? void 0 : item.children?.filter((c) => !isCreateRoute(c.route));
+          const label = isMore ? item.label ?? "Mais" : item.label;
+          const Icon = bottomNavIcon(item.icon, isMore ? Menu : Home);
+          const route = isMore ? void 0 : item.route;
+          const children = isMore ? void 0 : item.children?.filter((c) => !isCreateRoute(c.route));
           const hasChoices = !!children && children.length > 1;
           const sheetOpen = openSheet === i;
-          const isActive = isMore ? !!moreOpen : isAssistant ? !!assistantOpen : sheetOpen ? true : route === "/" ? path === "/" || path === "" : !!route && (path === route || path.startsWith(route + "/"));
+          const isActive = isMore ? !!moreOpen : sheetOpen ? true : route === "/" ? path === "/" || path === "" : !!route && (path === route || path.startsWith(route + "/"));
           return /* @__PURE__ */ jsxs(
             "button",
             {
@@ -3067,15 +3564,11 @@ function MobileBottomNav({
                   setOpenSheet(null);
                   return onMore?.();
                 }
-                if (isAssistant) {
-                  setOpenSheet(null);
-                  return onAssistant?.();
-                }
                 if (hasChoices) return setOpenSheet(sheetOpen ? null : i);
                 onNavigate?.(children?.[0]?.route ?? route);
               },
               "aria-current": isActive && route && !hasChoices ? "page" : void 0,
-              "aria-expanded": isMore || isAssistant ? isActive : hasChoices ? sheetOpen : void 0,
+              "aria-expanded": isMore ? isActive : hasChoices ? sheetOpen : void 0,
               "aria-haspopup": hasChoices ? "menu" : void 0,
               className: cn(
                 // min-h-[44px] is the floor a finger needs; the bar was letting
@@ -3084,16 +3577,6 @@ function MobileBottomNav({
                 isActive ? "text-sidebar-accent-foreground" : "text-sidebar-muted"
               ),
               children: [
-                /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    "aria-hidden": true,
-                    className: cn(
-                      "absolute inset-x-3 top-0 h-0.5 rounded-full transition-opacity",
-                      isActive ? "bg-sidebar-accent-foreground opacity-100" : "opacity-0"
-                    )
-                  }
-                ),
                 /* @__PURE__ */ jsxs("span", { className: "relative flex items-center", children: [
                   /* @__PURE__ */ jsx(Icon, { className: "h-5 w-5 shrink-0" }),
                   hasChoices && /* @__PURE__ */ jsx(
@@ -3107,10 +3590,10 @@ function MobileBottomNav({
                     }
                   )
                 ] }),
-                /* @__PURE__ */ jsx("span", { className: "max-w-full truncate text-[11px] leading-tight", children: label })
+                /* @__PURE__ */ jsx("span", { className: cn("max-w-full truncate text-[11px] leading-tight", isActive && "font-semibold"), children: label })
               ]
             },
-            isMore ? "more" : isAssistant ? "assistant" : `${route}-${i}`
+            isMore ? "more" : `${route}-${i}`
           );
         })
       }
@@ -3166,6 +3649,7 @@ function AppShell({
   onBottomNavAction,
   onAssistantToggle,
   assistantOpen,
+  assistantFace,
   mobileHeader = "minimal",
   immersive = false,
   userMenuSlot,
@@ -3188,7 +3672,7 @@ function AppShell({
   const hasBottomNav = !!bottomNav?.length;
   const barOwnsNav = bottomNavReachesAll(bottomNav);
   const menuNavigation = appNavigation ?? navigation;
-  const routeLabel = React12.useCallback((path) => {
+  const routeLabel = React16.useCallback((path) => {
     let best;
     const consider = (route, label) => {
       if (!route || !label) return;
@@ -3203,14 +3687,14 @@ function AppShell({
     }
     return best?.label ?? pageTitle ?? "";
   }, [menuNavigation, pageTitle]);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (!currentPath) return;
     if (currentPath === MENU_ROUTE) return;
     const label = routeLabel(currentPath);
     if (!label) return;
     recordNavigation(currentPath, label);
   }, [currentPath, routeLabel]);
-  const destinationRoutes = React12.useMemo(() => {
+  const destinationRoutes = React16.useMemo(() => {
     const routes = [];
     for (const item of menuNavigation) {
       if (item.route) routes.push(item.route);
@@ -3219,7 +3703,7 @@ function AppShell({
     return routes;
   }, [menuNavigation]);
   const isDestination = !!currentPath && destinationRoutes.includes(currentPath);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     setDestinationRoutes(destinationRoutes);
   }, [destinationRoutes]);
   const pageClaimedBack = useHasPageHeaderBack();
@@ -3227,7 +3711,7 @@ function AppShell({
   const barRetracted = !!pageBack || pageClaimedBack || inSettings;
   const mobileDrawerOpen = useLayoutStore((st) => st.mobileDrawerOpen);
   const setMobileDrawerOpen = useLayoutStore((st) => st.setMobileDrawerOpen);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (useLayoutStore.getState().drawerKeepOpenOnce) {
       useLayoutStore.setState({ drawerKeepOpenOnce: false });
       return;
@@ -3235,12 +3719,12 @@ function AppShell({
     setMobileDrawerOpen(false);
   }, [currentPath]);
   const menuRouteOpen = barOwnsNav && currentPath === MENU_ROUTE;
-  const firstDestination = React12.useMemo(() => {
+  const firstDestination = React16.useMemo(() => {
     const first = bottomNav?.find((i) => !("kind" in i) || i.kind === "route");
     return first?.route ?? "/";
   }, [bottomNav]);
-  const menuOrigin = React12.useRef(void 0);
-  const openMenu = React12.useCallback(() => {
+  const menuOrigin = React16.useRef(void 0);
+  const openMenu = React16.useCallback(() => {
     if (!barOwnsNav) {
       setMobileDrawerOpen(true);
       return;
@@ -3251,10 +3735,10 @@ function AppShell({
     menuOrigin.current = currentPath;
     onNavigate?.(MENU_ROUTE);
   }, [barOwnsNav, currentPath, onNavigate, setMobileDrawerOpen]);
-  const [menuLeaving, setMenuLeaving] = React12.useState(false);
-  const [menuLingering, setMenuLingering] = React12.useState(false);
-  const menuTimer = React12.useRef(void 0);
-  const dismissMenu = React12.useCallback((navigate) => {
+  const [menuLeaving, setMenuLeaving] = React16.useState(false);
+  const [menuLingering, setMenuLingering] = React16.useState(false);
+  const menuTimer = React16.useRef(void 0);
+  const dismissMenu = React16.useCallback((navigate) => {
     window.clearTimeout(menuTimer.current);
     setMenuLingering(true);
     setMenuLeaving(true);
@@ -3264,8 +3748,8 @@ function AppShell({
       setMenuLingering(false);
     }, 240);
   }, []);
-  React12.useEffect(() => () => window.clearTimeout(menuTimer.current), []);
-  const closeMenu = React12.useCallback(() => {
+  React16.useEffect(() => () => window.clearTimeout(menuTimer.current), []);
+  const closeMenu = React16.useCallback(() => {
     if (!barOwnsNav) {
       setMobileDrawerOpen(false);
       return;
@@ -3278,7 +3762,7 @@ function AppShell({
       onNavigate?.(back);
     });
   }, [barOwnsNav, setMobileDrawerOpen, onNavigate, firstDestination, dismissMenu]);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (!menuRouteOpen || typeof window === "undefined") return;
     const wide = window.matchMedia("(min-width: 768px)");
     const settle = () => {
@@ -3300,6 +3784,8 @@ function AppShell({
       moreOpen: barOwnsNav ? menuRouteOpen : mobileDrawerOpen,
       onAssistant: onAssistantToggle,
       assistantOpen,
+      assistantFace,
+      frame: contentFrame,
       retracted: barRetracted
     }
   ) : null;
@@ -3439,13 +3925,13 @@ function SplitWithRightRail({
   maxWidth = 720,
   resizeLabel = "Resize panel"
 }) {
-  const [width, setWidth] = React12.useState(defaultWidth);
-  const [dragging, setDragging] = React12.useState(false);
-  const clamp = React12.useCallback(
+  const [width, setWidth] = React16.useState(defaultWidth);
+  const [dragging, setDragging] = React16.useState(false);
+  const clamp = React16.useCallback(
     (value) => Math.min(maxWidth, Math.max(minWidth, value)),
     [minWidth, maxWidth]
   );
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (!dragging) return;
     const onMove = (event) => {
       event.preventDefault();
@@ -3467,7 +3953,7 @@ function SplitWithRightRail({
       document.body.style.cursor = previousCursor;
     };
   }, [dragging, clamp]);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (dragging) return;
     onWidthChange?.(width);
   }, [dragging]);
@@ -3682,12 +4168,12 @@ function ViewTabs({ value, onChange, options, "aria-label": ariaLabel, className
     );
   }) });
 }
-var NavTransitionContext = React12.createContext("slide");
+var NavTransitionContext = React16.createContext("slide");
 function NavTransitionProvider({ value, children }) {
   return /* @__PURE__ */ jsx(NavTransitionContext.Provider, { value, children });
 }
 function useNavTransition() {
-  return React12.useContext(NavTransitionContext);
+  return React16.useContext(NavTransitionContext);
 }
 function resolveTransitionClass(transition, direction) {
   if (transition === "none") return "";
@@ -3707,26 +4193,26 @@ function PageTransition({
   return /* @__PURE__ */ jsx("div", { className: cn(animClass, className), children }, transitionKey);
 }
 var EMPTY = [];
-var PageTrailContext = React12.createContext(EMPTY);
+var PageTrailContext = React16.createContext(EMPTY);
 function PageTrail({
   label,
   href,
   onNavigate,
   children
 }) {
-  const parent = React12.useContext(PageTrailContext);
-  const trail = React12.useMemo(
+  const parent = React16.useContext(PageTrailContext);
+  const trail = React16.useMemo(
     () => [...parent, { label, href, onNavigate }],
     [parent, label, href, onNavigate]
   );
   return /* @__PURE__ */ jsx(PageTrailContext.Provider, { value: trail, children });
 }
 function usePageTrail() {
-  return React12.useContext(PageTrailContext);
+  return React16.useContext(PageTrailContext);
 }
 function usePageTrailParent(href) {
-  const trail = React12.useContext(PageTrailContext);
-  return React12.useMemo(() => {
+  const trail = React16.useContext(PageTrailContext);
+  return React16.useMemo(() => {
     const above = href ? trail.filter((c) => c.href !== href) : trail;
     return above[above.length - 1];
   }, [trail, href]);
@@ -3742,8 +4228,8 @@ function useCurrentRouteHref() {
     const clean = hash.split("?")[0];
     return clean.startsWith("/") ? clean : `/${clean}`;
   };
-  const [href, setHref] = React12.useState(read2);
-  React12.useEffect(() => {
+  const [href, setHref] = React16.useState(read2);
+  React16.useEffect(() => {
     const handler = () => setHref(read2());
     window.addEventListener("hashchange", handler);
     handler();
@@ -3754,7 +4240,7 @@ function useCurrentRouteHref() {
 function useTrailBack(href) {
   const current = useCurrentRouteHref();
   const parent = usePageTrailParent(href ?? current);
-  return React12.useMemo(
+  return React16.useMemo(
     () => parent ? { onBack: () => navigateToCrumb(parent), parentLabel: parent.label } : {},
     [parent]
   );
@@ -3781,23 +4267,23 @@ function CollapsibleColumn({
   "aria-label": ariaLabel
 }) {
   const pinnedKey = `${storageKey}.pinned`;
-  const [collapsed, setCollapsed] = React12.useState(() => read(storageKey));
-  const [pinned, setPinned] = React12.useState(() => read(pinnedKey));
-  const [hovering, setHovering] = React12.useState(false);
-  const hoveringRef = React12.useRef(false);
-  const collapsedRef = React12.useRef(collapsed);
+  const [collapsed, setCollapsed] = React16.useState(() => read(storageKey));
+  const [pinned, setPinned] = React16.useState(() => read(pinnedKey));
+  const [hovering, setHovering] = React16.useState(false);
+  const hoveringRef = React16.useRef(false);
+  const collapsedRef = React16.useRef(collapsed);
   collapsedRef.current = collapsed;
-  const autoRef = React12.useRef(false);
+  const autoRef = React16.useRef(false);
   const open = !collapsed || hovering;
   const width = open ? COLUMN_WIDTH : COLUMN_COLLAPSED_WIDTH;
   const setHover = (on) => {
     hoveringRef.current = on;
     setHovering(on);
   };
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     onWidth?.(width);
   }, [width, onWidth]);
-  const setOpenState = React12.useCallback((nextCollapsed) => {
+  const setOpenState = React16.useCallback((nextCollapsed) => {
     setCollapsed(nextCollapsed);
     setPinned(!nextCollapsed);
     autoRef.current = false;
@@ -3808,7 +4294,7 @@ function CollapsibleColumn({
     }
     if (nextCollapsed) setHover(false);
   }, [storageKey, pinnedKey]);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (squeezed === void 0) return;
     if (squeezed) {
       if (!collapsedRef.current) {
@@ -3820,8 +4306,8 @@ function CollapsibleColumn({
       setCollapsed(false);
     }
   }, [squeezed]);
-  const seen = React12.useRef(null);
-  React12.useEffect(() => {
+  const seen = React16.useRef(null);
+  React16.useEffect(() => {
     if (autoCollapseKey === void 0) return;
     if (seen.current === null) {
       seen.current = autoCollapseKey;
@@ -3835,14 +4321,14 @@ function CollapsibleColumn({
     }, autoCollapseMs);
     return () => clearTimeout(t);
   }, [autoCollapseKey, collapsed, pinned, autoCollapseMs]);
-  const scrollRef = React12.useRef(null);
-  const [hasMore, setHasMore] = React12.useState(false);
-  const onScroll = React12.useCallback(() => {
+  const scrollRef = React16.useRef(null);
+  const [hasMore, setHasMore] = React16.useState(false);
+  const onScroll = React16.useCallback(() => {
     const el = scrollRef.current;
     if (!el) return;
     setHasMore(el.scrollHeight - el.scrollTop - el.clientHeight > 4);
   }, []);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     onScroll();
     const el = scrollRef.current;
     if (!el) return;
@@ -3852,11 +4338,11 @@ function CollapsibleColumn({
       ro.disconnect();
     };
   }, [onScroll, open, children]);
-  const boxRef = React12.useRef(null);
-  const panelRef = React12.useRef(null);
-  const [seamed, setSeamed] = React12.useState(false);
-  const armedRef = React12.useRef(false);
-  const publish = React12.useCallback(() => {
+  const boxRef = React16.useRef(null);
+  const panelRef = React16.useRef(null);
+  const [seamed, setSeamed] = React16.useState(false);
+  const armedRef = React16.useRef(false);
+  const publish = React16.useCallback(() => {
     if (!seamTop) return;
     const el = panelRef.current;
     const card = el?.closest(".fz-page-surface");
@@ -3879,10 +4365,10 @@ function CollapsibleColumn({
       });
     }
   }, [seamTop]);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     publish();
   }, [publish, width]);
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     if (!seamTop) return;
     const el = panelRef.current;
     const card = el?.closest(".fz-page-surface");
@@ -4012,7 +4498,7 @@ function viewBarSubscribe(l) {
   };
 }
 function ViewBarHost() {
-  const active = React12.useSyncExternalStore(viewBarSubscribe, () => viewBarCount > 0);
+  const active = React16.useSyncExternalStore(viewBarSubscribe, () => viewBarCount > 0);
   return /* @__PURE__ */ jsx(
     "div",
     {
@@ -4025,8 +4511,8 @@ function ViewBarHost() {
   );
 }
 function PageViewBar({ children }) {
-  const slot = React12.useSyncExternalStore(viewBarSubscribe, () => viewBarSlot);
-  React12.useEffect(() => {
+  const slot = React16.useSyncExternalStore(viewBarSubscribe, () => viewBarSlot);
+  React16.useEffect(() => {
     viewBarCount++;
     viewBarNotify();
     return () => {
@@ -4063,9 +4549,9 @@ function RailSections({ sections, search, collapsed }) {
 }
 var RAIL_COLLAPSED_KEY = "fayz.subnav.collapsed";
 function RailColumn({ className, "aria-label": ariaLabel, sections, search, footer }) {
-  const boxRef = React12.useRef(null);
-  const [squeezed, setSqueezed] = React12.useState(void 0);
-  React12.useEffect(() => {
+  const boxRef = React16.useRef(null);
+  const [squeezed, setSqueezed] = React16.useState(void 0);
+  React16.useEffect(() => {
     if (typeof window === "undefined") return;
     const row = boxRef.current?.parentElement?.parentElement;
     if (!row) return;
@@ -4125,10 +4611,10 @@ function unpublishSubNav(id) {
   subNavNotify();
 }
 function useSubNavPublished() {
-  return React12.useSyncExternalStore(subNavSubscribe, () => published, () => published);
+  return React16.useSyncExternalStore(subNavSubscribe, () => published, () => published);
 }
 function useSubNavHost() {
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     subNavHosts++;
     subNavNotify();
     return () => {
@@ -4138,7 +4624,7 @@ function useSubNavHost() {
   }, []);
 }
 function useHasSubNavHost() {
-  return React12.useSyncExternalStore(subNavSubscribe, () => subNavHosts > 0, () => false);
+  return React16.useSyncExternalStore(subNavSubscribe, () => subNavHosts > 0, () => false);
 }
 function SubNavBand({ sections, "aria-label": ariaLabel, className }) {
   const items = sections.flatMap((s) => s.items);
@@ -4170,13 +4656,13 @@ function SubNavBandHost({ leading, label }) {
   );
 }
 function PageSubNav({ items, sections, search, footer, style, "aria-label": ariaLabel }) {
-  const id = React12.useId();
+  const id = React16.useId();
   const hasHost = useHasSubNavHost();
   const resolved = sections ?? (items ? [{ items }] : []);
-  const ref = React12.useRef(resolved);
+  const ref = React16.useRef(resolved);
   ref.current = resolved;
   const signature = JSON.stringify(resolved.map((s) => [s.key, s.heading, s.items.map((i) => [i.id, i.label, i.icon, !!i.active, !!i.premium])]));
-  React12.useEffect(() => {
+  React16.useEffect(() => {
     publishSubNav({ id, label: ariaLabel, sections: ref.current });
     return () => unpublishSubNav(id);
   }, [id, ariaLabel, signature]);
@@ -4204,16 +4690,16 @@ function PremiumBadge({ className }) {
   const tip = t("upgrade.badgeTooltip");
   return /* @__PURE__ */ jsx("span", { title: tip, "aria-label": tip, className: cn("inline-flex shrink-0", className), children: /* @__PURE__ */ jsx(Crown, { className: "h-3.5 w-3.5 text-amber-500", "aria-hidden": true }) });
 }
-var ModuleLayoutContext = React12.createContext("rail");
+var ModuleLayoutContext = React16.createContext("rail");
 function ModuleLayoutProvider({ variant, children }) {
   return /* @__PURE__ */ jsx(ModuleLayoutContext.Provider, { value: variant, children });
 }
 function useModuleLayout() {
-  return React12.useContext(ModuleLayoutContext);
+  return React16.useContext(ModuleLayoutContext);
 }
 function RailNavItem({ item, collapsed }) {
-  const [expanded, setExpanded] = React12.useState(false);
-  React12.useEffect(() => {
+  const [expanded, setExpanded] = React16.useState(false);
+  React16.useEffect(() => {
     if (collapsed) setExpanded(false);
   }, [collapsed]);
   const Icon = item.icon ? ICON_MAP[item.icon] ?? null : null;
@@ -4280,9 +4766,9 @@ function defaultChildOf(item) {
   return kids.find((c) => c.defaultChild) ?? kids.find((c) => /(^|-)list$/i.test(c.id)) ?? kids.find((c) => !/(^|-)(new|novo|nova|create)$/i.test(c.id)) ?? kids[0];
 }
 function MobileTabs({ nav }) {
-  const scrollRef = React12.useRef(null);
-  const [expandedId, setExpandedId] = React12.useState(null);
-  React12.useEffect(() => {
+  const scrollRef = React16.useRef(null);
+  const [expandedId, setExpandedId] = React16.useState(null);
+  React16.useEffect(() => {
     const container = scrollRef.current;
     if (!container) return;
     const activeEl = container.querySelector('[data-active="true"]');
@@ -4355,12 +4841,12 @@ function MobileTabs({ nav }) {
     })()
   ] });
 }
-var BackStyleContext = React12.createContext("link");
+var BackStyleContext = React16.createContext("link");
 function BackStyleProvider({ style, children }) {
   return /* @__PURE__ */ jsx(BackStyleContext.Provider, { value: style, children });
 }
 function useBackStyle() {
-  return React12.useContext(BackStyleContext);
+  return React16.useContext(BackStyleContext);
 }
 function SubpageHeader({ title, subtitle, description, icon, onBack, parentLabel, actions, backStyle, inline }) {
   const t = useTranslation();
@@ -4516,8 +5002,8 @@ function ModuleHeader({ nav }) {
 function ModulePage({ title: _title, subtitle, nav, children, className, headerAction, showHeader = true, sidebarFooter, navVariant, viewKey, direction, navFilterPlaceholder }) {
   const ctxVariant = useModuleLayout();
   const variant = navVariant ?? ctxVariant;
-  const [navQuery, setNavQuery] = React12.useState("");
-  const filteredNav = React12.useMemo(() => {
+  const [navQuery, setNavQuery] = React16.useState("");
+  const filteredNav = React16.useMemo(() => {
     const q = navQuery.trim().toLowerCase();
     if (!q) return nav;
     const hit = (label) => label.toLowerCase().includes(q);
@@ -4529,7 +5015,7 @@ function ModulePage({ title: _title, subtitle, nav, children, className, headerA
   }, [nav, navQuery]);
   const transitionKey = viewKey ?? "view";
   const onSubpage = useHasPageHeaderBack();
-  const activeLabel = React12.useMemo(() => {
+  const activeLabel = React16.useMemo(() => {
     if (onSubpage) return null;
     for (const item of nav) {
       const kid = item.children?.find((c) => c.active);
@@ -4570,6 +5056,6 @@ function ModulePage({ title: _title, subtitle, nav, children, className, headerA
   ] });
 }
 
-export { AppShell, BackStyleProvider, BottomSheet, COLUMN_WIDTH, CollapsibleColumn, HeaderTabs, Hint, Modal, ModalBody, ModalClose, ModalContent, ModalDescription, ModalFooter, ModalHeader, ModalOverlay, ModalPortal, ModalTitle, ModalTrigger, ModuleLayoutProvider, ModulePage, NavTransitionProvider, PageHeader, PageHeaderActions, PageHeaderCrumb, PageHeaderOutlet, PageRail, PageSubNav, PageTabs, PageTitlePortal, PageTrail, PageTransition, PageViewBar, RailColumn, RailNavItem, SUB_NAV_STYLE, SaveBar, SaveBarProvider, SheetCard, SheetRow, ShellSearch, Sidebar, SubpageHeader, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Topbar, ViewTabs, bottomNavReachesAll, isCreateRoute, navigateToCrumb, useBackHandler, useBackStyle, useCrossModuleBack, useCurrentRouteHref, useHasPageActions, useHasPageHeaderBack, useHasPageHeaderHost, useHasPageHeaderOutlet, useLayoutStore, useModalHost, useModuleHeaderActionsSlot, useModuleHeaderSlot, useModuleLayout, useModuleViewLabel, useNavTransition, usePageHeader, usePageHeaderClaimed, usePageHeaderHost, usePageTrail, usePageTrailParent, usePublishModuleViewLabel, useRailRow, useRegisterPageActions, useSaveBar, useSaveBarVisible, useSheetClose, useSheetDrag, useTrailBack };
-//# sourceMappingURL=chunk-TP4YGQY7.js.map
-//# sourceMappingURL=chunk-TP4YGQY7.js.map
+export { AppShell, BackStyleProvider, BottomSheet, COLUMN_WIDTH, CollapsibleColumn, Dropdown, DropdownCheckboxItem, DropdownContent, DropdownGroup, DropdownItem, DropdownLabel, DropdownPortal, DropdownRadioGroup, DropdownRadioItem, DropdownSeparator, DropdownShortcut, DropdownSub, DropdownSubContent, DropdownSubTrigger, DropdownTrigger, HeaderTabs, Hint, MobileScrim, Modal, ModalBody, ModalClose, ModalContent, ModalDescription, ModalFooter, ModalHeader, ModalOverlay, ModalPortal, ModalTitle, ModalTrigger, ModuleLayoutProvider, ModulePage, NavTransitionProvider, PageActionBar, PageHeader, PageHeaderActions, PageHeaderCrumb, PageHeaderOutlet, PageRail, PageSubNav, PageTabs, PageTitlePortal, PageTrail, PageTransition, PageViewBar, RailColumn, RailNavItem, SUB_NAV_STYLE, SaveBar, SaveBarProvider, SheetCard, SheetRow, ShellSearch, Sidebar, SubpageHeader, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Topbar, ViewTabs, WIDE_QUERY, bottomNavReachesAll, isCreateRoute, navigateToCrumb, setActionsMenuLabel, useBackHandler, useBackStyle, useCrossModuleBack, useCurrentRouteHref, useHasPageActions, useHasPageHeaderBack, useHasPageHeaderHost, useHasPageHeaderOutlet, useIsWide, useLayoutStore, useModalHost, useModuleHeaderActionsSlot, useModuleHeaderSlot, useModuleLayout, useModuleViewLabel, useNavTransition, usePageHeader, usePageHeaderClaimed, usePageHeaderHost, usePageTrail, usePageTrailParent, usePublishModuleViewLabel, useRailRow, useRegisterPageActions, useSaveBar, useSaveBarVisible, useSheetClose, useSheetDrag, useTrailBack };
+//# sourceMappingURL=chunk-L6PNGGHM.js.map
+//# sourceMappingURL=chunk-L6PNGGHM.js.map