@flamingo-stack/openframe-frontend-core 0.0.705-snapshot.20261006160157 → 0.0.705

package/dist/{chunk-BHI6GVC4.js → chunk-G5A3PSPV.js}

@@ -1,62 +1,38 @@
 "use client";
 import {
   useOptionalTicketLive
-} from "./chunk-3EZ4HHAP.js";
+} from "./chunk-QFXRPRFT.js";
 import {
   AppLayoutDrawerContainerContext,
   AppLayoutDrawerCoordinationContext,
   HUBSPOT_DO_NOT_COLLECT_FORM_PROPS,
   HeaderButton,
   NotificationDrawer,
-  SocialIconRow,
   TimeTrackerHeaderButton,
   UnreadCountBadge,
   UnreadDot,
   buildTicketOpenHref,
   useOptionalNotifications
-} from "./chunk-G6UMNAVI.js";
+} from "./chunk-FCGC42TS.js";
 import {
-  resolveActiveSection,
-  shortcutLabel,
-  useActiveSection,
   useFocusTrap,
-  useLocalStorage,
-  useNavMenus,
-  useVisitorOs,
-  usesCommandKey
-} from "./chunk-KUC673HM.js";
+  useLocalStorage
+} from "./chunk-MKXO4Q5P.js";
 import {
   OVERLAY_BACKDROP_CLASS,
   useIsHydrated
-} from "./chunk-7GEBFJT2.js";
+} from "./chunk-7VVFKJY5.js";
 import {
   useHeaderHeight
-} from "./chunk-CZ7Y7UG4.js";
-import {
-  CaseStudyCard,
-  EntityIcon,
-  SquareAvatar,
-  Tag
-} from "./chunk-FI6GMDO7.js";
-import {
-  ContentAreaWidthContext,
-  breakpoints,
-  useIsomorphicLayoutEffect,
-  useLgUp,
-  useMdUp,
-  useMediaQuery
-} from "./chunk-FXJ3WWUB.js";
+} from "./chunk-PDWVPI3S.js";
 import {
   LogOutIcon,
   MingoIcon,
-  OpenFrameLogo,
   OpenFrameText,
   UserIcon
-} from "./chunk-N45D4ZXQ.js";
+} from "./chunk-2YXVWZVF.js";
 import {
   BellIcon,
-  Chevron02DownIcon,
-  Chevron02RightIcon,
   Chevrons03LeftIcon,
   Filter02Icon,
   LifeBuoyIcon,
@@ -65,7 +41,22 @@ import {
   PenEditIcon,
   UserSearchIcon,
   XmarkIcon
-} from "./chunk-NCPTID44.js";
+} from "./chunk-Z2VNQQ74.js";
+import {
+  SquareAvatar,
+  Tag
+} from "./chunk-CH5232HV.js";
+import {
+  ContentAreaWidthContext,
+  breakpoints,
+  useIsomorphicLayoutEffect,
+  useLgUp,
+  useMdUp,
+  useMediaQuery
+} from "./chunk-NDESEPW5.js";
+import {
+  OpenFrameLogo
+} from "./chunk-O43V3EOS.js";
 import {
   DropdownMenu,
   DropdownMenuContent,
@@ -85,331 +76,207 @@ import {
   cn
 } from "./chunk-7RXWKTAP.js";
 
-// src/components/navigation/site-header.tsx
-import { useEffect as useEffect2, useRef, useState } from "react";
+// src/components/navigation/header.tsx
+import React, { useEffect, useRef as useRef2, useState } from "react";
 
 // src/components/navigation/mingo-ai-button.tsx
-import { useEffect } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 var MINGO_ACCENT = "var(--ods-flamingo-cyan-base)";
-var ASK_AI_OPEN_EVENT = "ask-ai:open";
-function openAskAi(source) {
-  window.dispatchEvent(new CustomEvent(ASK_AI_OPEN_EVENT, { detail: { source: source ?? "" } }));
-}
-function MingoAiButton({
-  source,
-  icon,
-  label = "Mingo AI",
-  shortcutHint = false,
-  variant = "inline",
-  className,
-  onClick,
-  ...props
-}) {
-  const visitor = useVisitorOs();
-  const field = variant === "field";
-  const commandKey = visitor.known && usesCommandKey(visitor.os);
-  useEffect(() => {
-    if (!shortcutHint) return void 0;
-    const onKeyDown = (event) => {
-      if (event.defaultPrevented || event.altKey || event.shiftKey) return;
-      const modifier = commandKey ? event.metaKey && !event.ctrlKey : event.ctrlKey && !event.metaKey;
-      if (event.key.toLowerCase() !== "k" || !modifier) return;
-      event.preventDefault();
-      openAskAi(source);
-    };
-    window.addEventListener("keydown", onKeyDown);
-    return () => window.removeEventListener("keydown", onKeyDown);
-  }, [shortcutHint, source, commandKey]);
-  return /* @__PURE__ */ jsxs(
-    Button,
+function MingoAiButton({ source, icon, label = "Mingo AI", className, onClick, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "button",
     {
       ...props,
       type: "button",
-      variant: field ? "glyph" : "transparent",
-      size: "wrap",
-      font: "regular",
       "aria-label": label,
-      "aria-keyshortcuts": shortcutHint && visitor.known ? commandKey ? "Meta+K" : "Control+K" : void 0,
       onClick: (e) => {
-        openAskAi(source);
+        window.dispatchEvent(new CustomEvent("ask-ai:open", { detail: { source: source ?? "" } }));
         onClick?.(e);
       },
       className: cn(
-        "group/mingo flex shrink-0 justify-start focus-visible:ring-ods-accent",
-        field ? (
-          // A row of the mobile menu like the groups under it: same height,
-          // type and divider, no surface and no ring of its own.
-          "min-h-14 w-full gap-[var(--spacing-system-sf)] rounded-none border-b border-ods-border text-left text-h4 [&_svg]:h-6 [&_svg]:w-6"
-        ) : (
-          // Transparent at rest so it inherits the bar's background; the hover
-          // wash is the menu items' own.
-          "h-10 gap-[var(--spacing-system-xsf)] rounded-md pl-[var(--spacing-system-xsf)] pr-2.5 text-ods-text-secondary hover:text-ods-text-primary"
-        ),
+        // Unified ODS top-navigation cell (Figma 2797-6808 desktop /
+        // 2797-7275 mobile): full-height cell with a leading divider,
+        // transparent at rest so it inherits the bar's background.
+        // No hover background on the cell: the animated ring + shimmer are
+        // the ONLY hover treatment (a bg flip on top read as a double
+        // animation).
+        "group/mingo relative flex h-full shrink-0 items-center border-l border-ods-border bg-transparent px-[var(--spacing-system-m)] focus:outline-none focus-visible:ring-2 focus-visible:ring-ods-accent",
         className
       ),
-      children: [
-        !field && /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "mingo-edge-frame pointer-events-none absolute inset-0 rounded-md", children: /* @__PURE__ */ jsx("span", { className: "mingo-edge" }) }),
-          /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "pointer-events-none absolute inset-0 overflow-hidden rounded-md", children: /* @__PURE__ */ jsx(
-            "span",
-            {
-              className: "mingo-shimmer absolute inset-y-0 left-0 w-1/2",
-              style: {
-                background: "linear-gradient(105deg, transparent, color-mix(in srgb, var(--ods-system-greys-white) 12%, transparent), transparent)"
-              }
-            }
-          ) })
-        ] }),
-        icon ? /* @__PURE__ */ jsx(
+      children: /* @__PURE__ */ jsxs("span", { className: "relative flex h-11 items-center gap-[var(--spacing-system-xsf)] rounded-md px-[var(--spacing-system-m)] md:h-12", children: [
+        /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "mingo-edge-frame pointer-events-none absolute inset-0 rounded-md", children: /* @__PURE__ */ jsx("span", { className: "mingo-edge" }) }),
+        /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "pointer-events-none absolute inset-0 overflow-hidden rounded-md", children: /* @__PURE__ */ jsx(
           "span",
           {
-            className: cn(
-              "relative inline-flex shrink-0 items-center justify-center overflow-hidden rounded-full",
-              field ? "size-6" : "size-5"
-            ),
-            children: icon
+            className: "mingo-shimmer absolute inset-y-0 left-0 w-1/2",
+            style: {
+              background: "linear-gradient(105deg, transparent, color-mix(in srgb, var(--ods-system-greys-white) 12%, transparent), transparent)"
+            }
           }
-        ) : /* @__PURE__ */ jsx(
+        ) }),
+        icon ? /* @__PURE__ */ jsx("span", { className: "relative inline-flex size-6 shrink-0 items-center justify-center", children: icon }) : /* @__PURE__ */ jsx(
           MingoIcon,
           {
             color: "currentColor",
             eyesColor: MINGO_ACCENT,
             cornerColor: MINGO_ACCENT,
-            className: cn("relative shrink-0 text-ods-text-primary", field ? "size-6" : "size-5")
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "span",
-          {
-            className: cn("relative whitespace-nowrap", field ? "min-w-0 flex-1 truncate" : "hidden text-h6 lg:inline"),
-            children: label
+            className: "relative h-6 w-6 shrink-0 text-ods-text-primary"
           }
         ),
-        shortcutHint && !field && // A key cap in the label's own type (never smaller: a hint nobody can
-        // read is decoration) and the label's colour, which clears 4.5:1 on
-        // the bar. It keeps its width before the platform is known.
-        /* @__PURE__ */ jsx("kbd", { className: "relative hidden h-6 min-w-9 items-center justify-center rounded border border-ods-border px-[var(--spacing-system-xxs)] text-h6 lg:inline-flex", children: visitor.known ? shortcutLabel(visitor.os, "K") : "" })
-      ]
+        /* @__PURE__ */ jsx("span", { className: "relative hidden whitespace-nowrap text-ods-text-primary text-h3 md:inline", children: label })
+      ] })
     }
   );
 }
 
-// src/components/navigation/mobile-nav-sheet-id.ts
-var MOBILE_NAV_SHEET_ID = "mobile-nav-sheet";
-
-// src/components/navigation/nav-panel.tsx
-import { forwardRef } from "react";
-
-// src/components/navigation/site-nav-link.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
-var defaultRenderSiteNavLink = ({ link, children, ...rest }) => link.external ? /* @__PURE__ */ jsx2(next_link_default, { href: link.href, target: "_blank", rel: "noopener noreferrer", ...rest, children }) : /* @__PURE__ */ jsx2(next_link_default, { href: link.href, ...rest, children });
-function navLinkLabel(link) {
-  return link.count === void 0 ? link.label : link.label.replace("{count}", String(link.count));
-}
-var NAV_FOCUS_CLASS = "outline-none focus-visible:ring-2 focus-visible:ring-ods-accent";
-
-// src/components/navigation/nav-item-row.tsx
-import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
-var ROW_CLASSES = {
-  panel: "flex items-start gap-[var(--spacing-system-sf)] rounded-lg p-[var(--spacing-system-sf)] text-ods-text-primary transition-colors hover:bg-ods-bg-hover",
-  sheet: "flex min-h-[52px] items-center gap-[var(--spacing-system-sf)] py-1.5 text-ods-text-primary",
-  side: "flex items-center gap-[var(--spacing-system-xsf)] rounded-md px-[var(--spacing-system-sf)] py-2.5 text-ods-text-secondary transition-colors text-h6 hover:bg-ods-bg-hover hover:text-ods-text-primary",
-  label: "inline-flex items-center gap-[var(--spacing-system-xsf)] text-ods-text-secondary transition-colors text-h6 hover:text-ods-text-primary"
-};
-function RowGlyph({ link, box, glyph }) {
-  if (link.icon) {
-    return /* @__PURE__ */ jsx3(
-      "span",
-      {
-        "aria-hidden": "true",
-        className: cn("flex shrink-0 items-center justify-center overflow-hidden rounded-full", box),
-        children: /* @__PURE__ */ jsx3(EntityIcon, { icon: link.icon, className: "h-full w-full" })
+// src/components/navigation/mobile-nav-panel.tsx
+import { usePreventScroll } from "@react-aria/overlays";
+import { X } from "lucide-react";
+import { useRef } from "react";
+import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var MOBILE_NAV_PANEL_ID = "mobile-nav-panel";
+function MobileNavPanel({ isOpen, config }) {
+  const panelRef = useRef(null);
+  usePreventScroll({ isDisabled: !isOpen });
+  useFocusTrap(panelRef, isOpen, { onEscape: config.onClose });
+  const headerHeight = useHeaderHeight(64, { enabled: isOpen });
+  if (!isOpen) return null;
+  const renderNavigationItem = (item) => {
+    if (item.element) {
+      return /* @__PURE__ */ jsx2("div", { children: item.element }, item.id);
+    }
+    const handleClick = () => {
+      if (item.onClick) {
+        item.onClick();
       }
-    );
-  }
-  if (!link.iconName) return null;
-  return /* @__PURE__ */ jsx3(
-    "span",
-    {
-      "aria-hidden": "true",
-      className: cn(
-        "flex shrink-0 items-center justify-center rounded-lg border border-ods-border bg-ods-bg text-ods-text-primary",
-        box
-      ),
-      children: /* @__PURE__ */ jsx3(EntityIcon, { icon: { name: link.iconName }, size: glyph })
+      config.onClose?.();
+    };
+    if (item.href) {
+      return /* @__PURE__ */ jsx2(
+        Button,
+        {
+          variant: "outline",
+          size: "small-legacy",
+          href: item.href,
+          onClick: handleClick,
+          leftIcon: item.icon,
+          rightIcon: item.badge,
+          className: cn(
+            "h-12 justify-start gap-3 rounded-md border-none bg-transparent px-4 text-ods-text-primary transition-colors hover:bg-ods-bg-hover",
+            item.isActive ? "bg-ods-bg-hover" : ""
+          ),
+          children: item.label
+        },
+        item.id
+      );
     }
-  );
-}
-function NavItemRow({
-  link,
-  variant = "panel",
-  renderLink = defaultRenderSiteNavLink,
-  badge,
-  onNavigate,
-  className
-}) {
-  const label = navLinkLabel(link);
-  const counter = badge ? /* @__PURE__ */ jsx3(UnreadCountBadge, { count: badge, className: "static shrink-0" }) : null;
-  const singleLine = !link.description && !link.builtOn;
-  const rowClassName = cn(
-    ROW_CLASSES[variant],
-    variant === "panel" && singleLine && "items-center",
-    NAV_FOCUS_CLASS,
-    className
-  );
-  const onClick = onNavigate ? () => onNavigate() : void 0;
-  let children;
-  if (variant === "label") {
-    children = /* @__PURE__ */ jsxs2(Fragment2, { children: [
-      label,
-      counter
-    ] });
-  } else if (variant === "side") {
-    children = /* @__PURE__ */ jsxs2(Fragment2, { children: [
-      link.iconName && /* @__PURE__ */ jsx3("span", { "aria-hidden": "true", className: "flex shrink-0", children: /* @__PURE__ */ jsx3(EntityIcon, { icon: { name: link.iconName }, size: 18 }) }),
-      /* @__PURE__ */ jsx3("span", { className: "min-w-0 flex-1", children: label }),
-      counter
-    ] });
-  } else {
-    const sheet = variant === "sheet";
-    children = /* @__PURE__ */ jsxs2(Fragment2, { children: [
-      /* @__PURE__ */ jsx3(RowGlyph, { link, box: sheet ? "h-8 w-8" : "h-9 w-9", glyph: sheet ? 18 : 20 }),
-      /* @__PURE__ */ jsxs2("span", { className: "flex min-w-0 flex-1 flex-col", children: [
-        /* @__PURE__ */ jsxs2("span", { className: "flex items-center gap-[var(--spacing-system-xsf)] text-h6", children: [
-          /* @__PURE__ */ jsx3("span", { className: "min-w-0", children: label }),
-          counter
-        ] }),
-        link.description && /* @__PURE__ */ jsx3("span", { className: "text-ods-text-muted text-h6", children: link.description }),
-        link.builtOn && /* @__PURE__ */ jsxs2("span", { className: "text-ods-text-muted text-h6", children: [
-          "Built on ",
-          link.builtOn
-        ] })
-      ] })
-    ] });
-  }
-  return /* @__PURE__ */ jsx3(Fragment2, { children: renderLink({ link, className: rowClassName, children, onClick }) });
-}
-
-// src/components/navigation/nav-panel.tsx
-import { Fragment as Fragment3, jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
-var TWO_COLUMN_OVER = 4;
-function isMegaMenu(menu) {
-  return (menu.columns?.length ?? 0) > 1 || !!menu.features?.length || !!menu.sideLinks?.length;
-}
-var HEADING_CLASS = "mb-[var(--spacing-system-xsf)] ml-[var(--spacing-system-sf)] text-ods-text-muted text-h5";
-function Column({
-  group,
-  wide,
-  rowProps
-}) {
-  const twoColumns = wide && group.links.length > TWO_COLUMN_OVER;
-  return /* @__PURE__ */ jsxs3("div", { className: cn("flex min-w-0 flex-col", wide && (twoColumns ? "flex-[2]" : "flex-1")), children: [
-    group.title && /* @__PURE__ */ jsx4("div", { className: HEADING_CLASS, children: group.title }),
-    /* @__PURE__ */ jsx4(
+    return /* @__PURE__ */ jsxs2(
+      Button,
+      {
+        variant: "outline",
+        size: "small-legacy",
+        onClick: handleClick,
+        leftIcon: item.icon,
+        className: cn(
+          "h-12 justify-start gap-3 rounded-md border-none bg-transparent px-4 text-ods-text-primary transition-colors hover:bg-ods-bg-hover",
+          item.isActive ? "bg-ods-bg-hover" : ""
+        ),
+        children: [
+          /* @__PURE__ */ jsx2("span", { className: "flex-1 text-left", children: item.label }),
+          item.badge !== void 0 && /* @__PURE__ */ jsx2("span", { className: "ml-auto", children: item.badge })
+        ]
+      },
+      item.id
+    );
+  };
+  return /* @__PURE__ */ jsxs2(Fragment, { children: [
+    /* @__PURE__ */ jsx2("div", { className: cn("fixed inset-0 z-[9998]", OVERLAY_BACKDROP_CLASS), onClick: config.onClose }),
+    /* @__PURE__ */ jsxs2(
       "div",
       {
-        className: twoColumns ? "grid grid-cols-2 gap-x-[var(--spacing-system-mf)] gap-y-[var(--spacing-system-xxs)]" : "flex flex-col gap-[var(--spacing-system-xxs)]",
-        children: group.links.map((link) => /* @__PURE__ */ jsx4(
-          NavItemRow,
-          {
-            link,
-            renderLink: rowProps.renderLink,
-            onNavigate: rowProps.onNavigate,
-            badge: link.badgeKey ? rowProps.badges?.[link.badgeKey] : void 0
-          },
-          link.id
-        ))
+        ref: panelRef,
+        id: MOBILE_NAV_PANEL_ID,
+        role: "dialog",
+        "aria-modal": "true",
+        "aria-label": "Navigation menu",
+        tabIndex: -1,
+        style: { "--mobile-nav-top": `${headerHeight + 16}px` },
+        className: cn(
+          "fixed z-[9999] rounded-lg shadow-xl",
+          config.className ? "" : "border border-ods-border bg-ods-card",
+          // Responsive positioning and sizing — LEFT-anchored from md, flush
+          // under the burger cell at the left edge of the unified
+          // top-navigation (a larger inset read as a stray gap between the
+          // burger and its panel).
+          "left-2 right-2 md:right-auto",
+          "md:left-2 md:w-[400px] md:max-w-[calc(100vw-1rem)]",
+          // Small-viewport (svh) sizing anchored below the measured header —
+          // 100vh overflowed under mobile browser chrome, leaving the bottom
+          // entries and footer unreachable while the body was scroll-locked.
+          "top-[var(--mobile-nav-top)]",
+          "max-h-[calc(100svh-var(--mobile-nav-top)-50px)] md:max-h-[calc(100svh-var(--mobile-nav-top)-8px)]",
+          "flex flex-col",
+          config.className || ""
+        ),
+        onClick: (e) => e.stopPropagation(),
+        children: [
+          /* @__PURE__ */ jsx2("div", { className: "flex flex-shrink-0 justify-end border-b border-ods-border p-2", children: /* @__PURE__ */ jsx2(
+            Button,
+            {
+              "aria-label": "Close menu",
+              size: "icon",
+              variant: "transparent",
+              leftIcon: /* @__PURE__ */ jsx2(X, { className: "h-4 w-4 text-ods-text-primary" }),
+              onClick: config.onClose,
+              className: "hover:bg-ods-bg-hover"
+            }
+          ) }),
+          /* @__PURE__ */ jsx2("div", { className: "flex-1 overflow-y-auto overflow-x-hidden overscroll-contain px-2 py-2", children: /* @__PURE__ */ jsx2("div", { className: "flex flex-col space-y-1", children: config.sections.map((section, index) => /* @__PURE__ */ jsxs2("div", { children: [
+            section.title && /* @__PURE__ */ jsx2("div", { className: "px-4 pb-1 pt-2 font-semibold uppercase text-ods-text-secondary text-h6", children: section.title }),
+            /* @__PURE__ */ jsx2("div", { className: "flex flex-col gap-1", children: section.items.map(renderNavigationItem) })
+          ] }, index)) }) }),
+          config.footer && /* @__PURE__ */ jsx2("div", { className: "flex-shrink-0 border-t border-ods-border p-4 pb-[max(1rem,env(safe-area-inset-bottom))]", children: config.footer })
+        ]
       }
     )
   ] });
 }
-var NavPanel = forwardRef(function NavPanelImpl({
-  menu,
-  open,
-  renderLink = defaultRenderSiteNavLink,
-  badges,
-  social,
-  onNavigate,
-  motion: motion2 = "open",
-  handoff = false,
-  className,
-  ...panelProps
-}, ref) {
-  const columns = menu.columns ?? [];
-  const mega = isMegaMenu(menu);
-  const rowProps = { renderLink, badges, onNavigate };
-  const socialRow = menu.showSocial && social ? social : null;
-  return /* @__PURE__ */ jsx4(
-    "div",
+
+// src/components/navigation/ticket-alerts-button.tsx
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function TicketAlertsButton({ href, onNavigate, disabled, className }) {
+  const live = useOptionalTicketLive();
+  if (!live || !live.authed || live.unreadTotal === 0) return null;
+  const targetId = live.nextUnreadTicketId;
+  const target = targetId ? buildTicketOpenHref(href, targetId) : href;
+  const handleClick = () => {
+    if (onNavigate) onNavigate(target);
+    else window.location.assign(target);
+  };
+  return /* @__PURE__ */ jsx3(
+    HeaderButton,
     {
-      inert: !open,
-      "data-state": open ? "open" : "closed",
-      ...panelProps,
-      ref,
-      className: cn(
-        "absolute top-full z-[60]",
-        // Between two mega menus the surface is handed over in one frame (same
-        // place, same size, same colour) and only the content moves; a fade
-        // here would let the page show through both for its whole length.
-        mega && (open ? motion2 !== "open" : handoff) ? "transition-none" : "transition-opacity duration-150",
-        mega ? "left-0 right-0 border-b border-ods-border bg-ods-card shadow-xl" : "left-0 mt-[var(--spacing-system-xxs)] min-w-[260px] rounded-lg border border-ods-border bg-ods-card p-[var(--spacing-system-xsf)] shadow-xl",
-        open ? "visible opacity-100" : "pointer-events-none invisible opacity-0",
-        className
+      icon: (
+        // Glyph inherits HeaderButton's standard cell coloring (secondary at
+        // rest, primary on active) — SAME treatment as the notifications
+        // bell and time-tracker cells. The indication is carried by the
+        // count pill (sidebar count-pill precedent) and by the cell only
+        // existing while updates are unread — never by tinting the glyph.
+        /* @__PURE__ */ jsxs3("span", { className: "relative inline-flex", children: [
+          /* @__PURE__ */ jsx3(LifeBuoyIcon, { className: "h-6 w-6" }),
+          /* @__PURE__ */ jsx3(UnreadCountBadge, { count: live.unreadTotal })
+        ] })
       ),
-      children: mega ? (
-        // ONE height for every mega menu, so moving between menus (and a
-        // card's cover loading) never resizes the panel under the pointer.
-        /* @__PURE__ */ jsxs3(
-          "div",
-          {
-            "data-motion": open ? motion2 : void 0,
-            className: "nav-panel-content flex h-[400px] max-h-[calc(100svh-var(--top-nav-height,72px))] flex-col gap-[var(--spacing-system-mf)] overflow-y-auto px-[var(--spacing-system-lf)] pb-[var(--spacing-system-xlf)] pt-8",
-            children: [
-              /* @__PURE__ */ jsxs3("div", { className: "flex min-h-0 flex-1 gap-[var(--spacing-system-xlf)]", children: [
-                columns.map((group) => /* @__PURE__ */ jsx4(Column, { group, wide: true, rowProps }, group.id)),
-                !!menu.features?.length && // One row of cards, as many as the bar's width holds: a card that
-                // would wrap lands on a zero-height row, where its cell clips it.
-                /* @__PURE__ */ jsx4("div", { className: "grid min-w-0 flex-[3] auto-rows-[0px] grid-cols-[repeat(auto-fit,minmax(240px,1fr))] grid-rows-[minmax(0,1fr)] gap-x-[var(--spacing-system-mf)]", children: menu.features.map((feature) => /* @__PURE__ */ jsx4("div", { className: "min-h-0 min-w-0 overflow-hidden", children: /* @__PURE__ */ jsx4(
-                  CaseStudyCard,
-                  {
-                    size: "menu",
-                    study: feature.study,
-                    href: feature.href,
-                    mediaMounted: open,
-                    onNavigate,
-                    className: "h-full"
-                  }
-                ) }, feature.id)) }),
-                !!menu.sideLinks?.length && /* @__PURE__ */ jsxs3("div", { className: "flex w-[260px] shrink-0 flex-col gap-0.5 border-l border-ods-border pl-8 pt-5", children: [
-                  menu.sideTitle && /* @__PURE__ */ jsx4("div", { className: HEADING_CLASS, children: menu.sideTitle }),
-                  menu.sideLinks.map((link) => /* @__PURE__ */ jsx4(
-                    NavItemRow,
-                    {
-                      link,
-                      variant: "side",
-                      ...rowProps,
-                      badge: link.badgeKey ? badges?.[link.badgeKey] : void 0
-                    },
-                    link.id
-                  ))
-                ] })
-              ] }),
-              socialRow && /* @__PURE__ */ jsx4("div", { className: "border-t border-ods-border px-[var(--spacing-system-sf)] pt-[var(--spacing-system-mf)]", children: socialRow })
-            ]
-          }
-        )
-      ) : /* @__PURE__ */ jsxs3(Fragment3, { children: [
-        columns.map((group) => /* @__PURE__ */ jsx4(Column, { group, wide: false, rowProps }, group.id)),
-        socialRow && /* @__PURE__ */ jsx4("div", { className: "mt-[var(--spacing-system-xsf)] border-t border-ods-border px-[var(--spacing-system-sf)] pt-[var(--spacing-system-sf)]", children: socialRow })
-      ] })
+      "aria-label": `Support tickets \u2014 ${live.unreadTotal} unread ${live.unreadTotal === 1 ? "update" : "updates"}`,
+      onClick: handleClick,
+      disabled,
+      className: cn(className)
     }
   );
-});
-NavPanel.displayName = "NavPanel";
+}
 
 // src/components/navigation/top-navigation.tsx
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 var SIZE_CLASSES = {
   small: "h-14 [--top-nav-cell:3.5rem]",
   big: "h-[72px] [--top-nav-cell:4.5rem]"
@@ -453,7 +320,7 @@ function TopNavigation({
       ...props,
       children: [
         leading,
-        hasContent(logo) && /* @__PURE__ */ jsx5(
+        hasContent(logo) && /* @__PURE__ */ jsx4(
           "div",
           {
             className: cn(
@@ -465,7 +332,7 @@ function TopNavigation({
             children: logo
           }
         ),
-        /* @__PURE__ */ jsx5(
+        /* @__PURE__ */ jsx4(
           "div",
           {
             className: cn(
@@ -476,7 +343,7 @@ function TopNavigation({
             children: center
           }
         ),
-        hasContent(cta) && /* @__PURE__ */ jsx5("div", { className: cn("flex h-full shrink-0 items-center px-[var(--spacing-system-m)]", ctaClassName), children: cta }),
+        hasContent(cta) && /* @__PURE__ */ jsx4("div", { className: cn("flex h-full shrink-0 items-center px-[var(--spacing-system-m)]", ctaClassName), children: cta }),
         sideActions,
         children
       ]
@@ -484,568 +351,352 @@ function TopNavigation({
   );
 }
 
-// src/components/navigation/site-header.tsx
-import { Fragment as Fragment4, jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
-var TOP_ITEM_CLASS = "relative inline-flex h-10 items-center gap-1.5 whitespace-nowrap rounded-md px-3.5 text-ods-text-secondary transition-colors text-h6 hover:bg-ods-bg-hover hover:text-ods-text-primary";
-var TOP_ITEM_CURRENT_CLASS = "rounded-b-none bg-gradient-to-b from-transparent to-ods-accent/10 text-ods-text-primary after:absolute after:inset-x-0 after:bottom-0 after:h-0.5 after:bg-ods-accent";
-var menuIcon = (menu) => menu.iconName ? /* @__PURE__ */ jsx6(EntityIcon, { icon: { name: menu.iconName }, size: 20, className: "size-5 shrink-0" }) : null;
-function SiteHeader({
-  nav,
-  pathname,
-  logo,
-  logoHref,
-  renderLink = defaultRenderSiteNavLink,
-  leading,
-  actions,
-  cta,
-  sideActions,
-  mingo,
-  mobile,
-  badges,
-  social,
-  autoHide = false,
-  backgroundClassName,
-  className,
-  style,
-  skipToContentId = "main-content"
-}) {
+// src/components/navigation/header.tsx
+import { Fragment as Fragment2, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+var NAV_ITEM_CLASSES = "text-h6 [&_svg]:h-6 [&_svg]:w-6";
+function Header({ config }) {
   const [show, setShow] = useState(true);
-  const lastScrollY = useRef(0);
-  const activeId = useActiveSection(nav.menus, pathname);
-  const { openId, close, getTriggerProps, getPanelProps } = useNavMenus({ pathname });
-  const [trail, setTrail] = useState({ id: null, from: null });
-  if (trail.id !== openId) setTrail({ id: openId, from: trail.id });
-  const previousId = trail.id === openId ? trail.from : trail.id;
-  const megaIds = nav.menus.filter(isMegaMenu).map((menu) => menu.id);
-  const openMegaIndex = openId === null ? -1 : megaIds.indexOf(openId);
-  const previousMegaIndex = previousId === null ? -1 : megaIds.indexOf(previousId);
-  const megaMotion = openMegaIndex < 0 || previousMegaIndex < 0 ? "open" : openMegaIndex > previousMegaIndex ? "from-end" : "from-start";
-  useEffect2(() => {
-    if (!autoHide) return void 0;
+  const lastScrollY = useRef2(0);
+  const [openDropdowns, setOpenDropdowns] = useState({});
+  const dropdownRefs = useRef2({});
+  const triggerRefs = useRef2({});
+  useEffect(() => {
+    const handleClickOutside = (event) => {
+      const target = event.target;
+      if (!target) return;
+      const isOutsideAllDropdowns = Object.keys(openDropdowns).every((id) => {
+        const dropdown = dropdownRefs.current[id];
+        const trigger = triggerRefs.current[id];
+        if (!dropdown || !trigger) return true;
+        return !dropdown.contains(target) && !trigger.contains(target);
+      });
+      if (isOutsideAllDropdowns) {
+        setOpenDropdowns({});
+      }
+    };
+    const handleEscapeKey = (event) => {
+      if (event.key === "Escape") {
+        setOpenDropdowns({});
+      }
+    };
+    const hasOpenDropdowns = Object.values(openDropdowns).some(Boolean);
+    if (hasOpenDropdowns) {
+      document.addEventListener("mousedown", handleClickOutside);
+      document.addEventListener("keydown", handleEscapeKey);
+    }
+    return () => {
+      document.removeEventListener("mousedown", handleClickOutside);
+      document.removeEventListener("keydown", handleEscapeKey);
+    };
+  }, [openDropdowns]);
+  useEffect(() => {
+    return () => {
+      setOpenDropdowns({});
+      dropdownRefs.current = {};
+      triggerRefs.current = {};
+    };
+  }, []);
+  useEffect(() => {
+    if (!config.autoHide) return void 0;
     const handleScroll = () => {
       const currentScrollY = window.scrollY;
       const prevScrollY = lastScrollY.current;
       lastScrollY.current = currentScrollY;
-      if (currentScrollY > prevScrollY && currentScrollY > 50) setShow(false);
-      else if (currentScrollY < prevScrollY || currentScrollY <= 10) setShow(true);
+      const shouldHide = currentScrollY > prevScrollY && currentScrollY > 50;
+      const shouldShow = currentScrollY < prevScrollY || currentScrollY <= 10;
+      if (shouldHide) {
+        setShow(false);
+      } else if (shouldShow) {
+        setShow(true);
+      }
     };
     window.addEventListener("scroll", handleScroll, { passive: true });
-    return () => window.removeEventListener("scroll", handleScroll);
-  }, [autoHide]);
-  const headerShown = !autoHide || show || openId !== null;
-  const renderMenu = (menu) => {
-    const current = menu.id === activeId;
-    const hasPanel = !!menu.columns?.length || !!menu.features?.length || !!menu.sideLinks?.length;
-    if (!hasPanel) {
-      if (!menu.href) return null;
-      return /* @__PURE__ */ jsx6("div", { className: "flex", children: /* @__PURE__ */ jsx6(
-        Button,
-        {
-          asChild: true,
-          variant: "transparent",
-          size: "wrap",
-          font: "regular",
-          className: cn(TOP_ITEM_CLASS, NAV_FOCUS_CLASS, current && TOP_ITEM_CURRENT_CLASS),
-          children: renderLink({
-            link: { href: menu.href },
-            "aria-current": current ? "page" : void 0,
-            children: /* @__PURE__ */ jsxs5(Fragment4, { children: [
-              menuIcon(menu),
-              menu.label
-            ] })
-          })
-        }
-      ) }, menu.id);
+    return () => {
+      window.removeEventListener("scroll", handleScroll);
+    };
+  }, [config.autoHide]);
+  const renderNavigationItem = (item) => {
+    if (item.element) {
+      return /* @__PURE__ */ jsx5(React.Fragment, { children: item.element }, item.id);
     }
-    const open = openId === menu.id;
-    return (
-      // A dropdown is anchored to its trigger (`relative`); a mega menu to the
-      // bar itself, so its wrapper stays unpositioned.
-      /* @__PURE__ */ jsxs5("div", { className: cn("flex", !isMegaMenu(menu) && "relative"), children: [
-        /* @__PURE__ */ jsxs5(
+    if (item.children && item.children.length > 0) {
+      const isOpen = openDropdowns[item.id] || false;
+      return /* @__PURE__ */ jsxs5("div", { className: "relative", children: [
+        /* @__PURE__ */ jsx5(
           Button,
           {
-            type: "button",
+            ref: (el) => {
+              triggerRefs.current[item.id] = el;
+            },
             variant: "transparent",
-            size: "wrap",
+            leftIcon: item.icon,
+            rightIcon: item.badge,
+            onClick: () => {
+              setOpenDropdowns((prev) => ({
+                [item.id]: !prev[item.id]
+              }));
+            },
+            size: "default",
             font: "regular",
-            ...getTriggerProps(menu.id),
-            "aria-current": current ? "page" : void 0,
             className: cn(
-              TOP_ITEM_CLASS,
-              NAV_FOCUS_CLASS,
-              open && "bg-ods-bg-hover text-ods-text-primary",
-              current && TOP_ITEM_CURRENT_CLASS
+              // Top-level nav links (Figma 2936-6815): compact h6 label
+              // (DM Sans 500, 14/20) with 24px icons — overrides the
+              // font="regular" h4 step and the button's 20px svg cap.
+              NAV_ITEM_CLASSES,
+              item.isActive && "bg-ods-bg-hover",
+              // Active items get subtle gray background
+              isOpen && "bg-ods-bg-hover",
+              // Open dropdowns get gray background
+              item.className
             ),
-            children: [
-              menuIcon(menu),
-              menu.label,
-              /* @__PURE__ */ jsx6(
-                Chevron02DownIcon,
-                {
-                  "aria-hidden": "true",
-                  className: cn("!h-4 !w-4 transition-transform duration-150", open && "rotate-180")
-                }
-              )
-            ]
+            children: item.label
           }
         ),
-        /* @__PURE__ */ jsx6(
-          NavPanel,
-          {
-            ...getPanelProps(menu.id),
-            menu,
-            open,
-            motion: open ? megaMotion : void 0,
-            handoff: openMegaIndex >= 0,
-            renderLink,
-            badges,
-            social,
-            onNavigate: close
-          }
-        )
-      ] }, menu.id)
-    );
-  };
-  const primaryCta = typeof nav.primaryCta === "object" ? /* @__PURE__ */ jsx6(Button, { variant: "accent", href: nav.primaryCta.href, children: nav.primaryCta.label }) : nav.primaryCta === "none" ? null : cta ?? null;
-  const hasRight = !!mingo || !!nav.signIn || !!actions || !!primaryCta;
-  return /* @__PURE__ */ jsxs5(
-    "div",
-    {
-      "data-site-header": "",
-      className: "sticky top-0 z-[50] w-full transition-transform duration-300 ease-in-out",
-      style: { transform: headerShown ? "translateY(0)" : "translateY(-100%)" },
-      children: [
-        /* @__PURE__ */ jsx6(
-          next_link_default,
+        /* @__PURE__ */ jsxs5(
+          "div",
           {
-            href: `#${skipToContentId}`,
+            ref: (el) => {
+              dropdownRefs.current[item.id] = el;
+            },
+            inert: !isOpen,
             className: cn(
-              "sr-only left-[var(--spacing-system-lf)] top-3 z-[70] rounded-md bg-ods-text-primary px-[var(--spacing-system-mf)] py-[var(--spacing-system-xsf)] text-ods-bg text-h6 focus:not-sr-only focus:absolute",
-              NAV_FOCUS_CLASS
+              "absolute left-0 top-full mt-1",
+              item.dropdownClassName ? "" : "border border-ods-border bg-ods-card",
+              "z-[9999] rounded-lg shadow-xl",
+              item.id === "community" ? "min-w-[240px]" : "min-w-[220px]",
+              "transition-opacity duration-150",
+              isOpen ? "pointer-events-auto visible opacity-100" : "pointer-events-none invisible opacity-0",
+              item.dropdownClassName || ""
             ),
-            children: "Skip to content"
-          }
-        ),
-        /* @__PURE__ */ jsx6(
-          TopNavigation,
-          {
-            className: cn("relative", className),
-            style,
-            backgroundClassName,
-            centerBreakpoint: "lg",
-            size: "big",
-            leading: /* @__PURE__ */ jsxs5(Fragment4, { children: [
-              leading,
-              mobile && /* @__PURE__ */ jsx6(
-                HeaderButton,
-                {
-                  className: "border-r border-ods-border lg:hidden",
-                  onClick: mobile.onToggle,
-                  isActive: mobile.isOpen,
-                  "aria-label": mobile.isOpen ? "Close menu" : "Open menu",
-                  "aria-expanded": mobile.isOpen,
-                  "aria-controls": mobile.isOpen ? mobile.controlsId ?? MOBILE_NAV_SHEET_ID : void 0,
-                  icon: mobile.isOpen ? /* @__PURE__ */ jsx6(XmarkIcon, { className: "h-6 w-6" }) : /* @__PURE__ */ jsx6(Menu01Icon, { className: "h-6 w-6" })
-                }
-              )
-            ] }),
-            logo: logoHref ? renderLink({
-              link: { href: logoHref },
-              className: cn(
-                "flex min-w-0 items-center rounded-md transition-opacity duration-200 hover:opacity-80",
-                NAV_FOCUS_CLASS
-              ),
-              "aria-label": nav.brand.name,
-              children: logo
-            }) : logo,
-            logoClassName: "shrink pl-[var(--spacing-system-lf)] md:pl-[var(--spacing-system-lf)] lg:pl-[var(--spacing-system-lf)]",
-            center: nav.menus.length > 0 ? /* @__PURE__ */ jsx6("nav", { "aria-label": "Main", className: "flex items-center gap-[var(--spacing-system-xxs)]", children: nav.menus.map(renderMenu) }) : void 0,
-            centerClassName: "justify-start pl-[var(--spacing-system-xlf)]",
-            cta: hasRight ? /* @__PURE__ */ jsxs5(Fragment4, { children: [
-              mingo && /* @__PURE__ */ jsx6(
-                MingoAiButton,
-                {
-                  source: mingo.source,
-                  icon: mingo.icon,
-                  label: mingo.label,
-                  shortcutHint: mingo.shortcutHint
-                }
-              ),
-              nav.signIn && /* @__PURE__ */ jsx6("div", { className: "hidden lg:flex", children: /* @__PURE__ */ jsx6(
+            children: [
+              /* @__PURE__ */ jsx5("div", { className: "p-2", children: item.children.map((child, index) => /* @__PURE__ */ jsx5(
                 Button,
                 {
-                  asChild: true,
                   variant: "transparent",
-                  size: "wrap",
-                  font: "regular",
-                  className: cn(TOP_ITEM_CLASS, NAV_FOCUS_CLASS),
-                  children: renderLink({ link: nav.signIn, children: nav.signIn.label })
-                }
-              ) }),
-              actions,
-              primaryCta
-            ] }) : void 0,
-            ctaClassName: "gap-[var(--spacing-system-xsf)]",
-            sideActions
+                  size: "small-legacy",
+                  href: child.href,
+                  leftIcon: child.icon,
+                  rightIcon: child.badge,
+                  onClick: () => {
+                    setOpenDropdowns((prev) => ({ ...prev, [item.id]: false }));
+                    if (child.onClick) {
+                      child.onClick();
+                    }
+                  },
+                  className: cn(
+                    "flex w-full justify-start",
+                    // Same caption step as the top-level nav links (designer:
+                    // dropdowns follow the h6 caption size/weight too). The
+                    // explicit font-medium beats small-legacy's font-bold via
+                    // tailwind-merge instead of stylesheet order.
+                    "font-medium text-h6",
+                    index < (item.children?.length ?? 0) - 1 && "mb-1",
+                    "text-ods-text-primary",
+                    // All dropdown items use primary text color
+                    child.isActive && "bg-ods-bg-hover"
+                    // Active dropdown items get gray background
+                  ),
+                  ...child.isExternal && { isExternal: true },
+                  children: child.label
+                },
+                child.id
+              )) }),
+              item.dropdownContent && /* @__PURE__ */ jsxs5(Fragment2, { children: [
+                item.showDropdownDivider !== false && /* @__PURE__ */ jsx5("div", { className: "mx-2 my-2 h-px bg-ods-border" }),
+                /* @__PURE__ */ jsx5("div", { className: "px-2 pb-2", children: item.dropdownContent })
+              ] })
+            ]
           }
         )
-      ]
+      ] }, item.id);
     }
-  );
-}
-
-// src/components/navigation/mobile-nav-sheet.tsx
-import { usePreventScroll } from "@react-aria/overlays";
-import { useRef as useRef2, useState as useState2 } from "react";
-import { Fragment as Fragment5, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
-function siteNavHasMobileMenus(nav) {
-  return (nav.mobileMenus ?? nav.menus).length > 0;
-}
-var GROUP_ROW_CLASS = "flex min-h-14 w-full items-center justify-between gap-[var(--spacing-system-sf)] text-left text-ods-text-primary text-h4";
-var menuLinks = (menu) => [
-  ...(menu.columns ?? []).flatMap((group) => group.links),
-  ...menu.sideLinks ?? []
-];
-function MobileNavSheet(props) {
-  if (!props.isOpen) return null;
-  return /* @__PURE__ */ jsx7(MobileNavSheetBody, { ...props });
-}
-function MobileNavSheetBody({
-  nav,
-  onClose,
-  pathname,
-  logo,
-  renderLink = defaultRenderSiteNavLink,
-  cta,
-  actions,
-  askAI,
-  extraMenus,
-  badges,
-  social,
-  backgroundClassName
-}) {
-  const sheetRef = useRef2(null);
-  const menus = [...nav.mobileMenus ?? nav.menus, ...extraMenus ?? []];
-  usePreventScroll();
-  useFocusTrap(sheetRef, true, { onEscape: onClose });
-  const [openGroups, setOpenGroups] = useState2(() => {
-    const active = resolveActiveSection(menus, pathname);
-    return active ? { [active]: true } : {};
-  });
-  const primaryCta = typeof nav.primaryCta === "object" ? /* @__PURE__ */ jsx7(Button, { variant: "accent", href: nav.primaryCta.href, onClick: onClose, className: "w-full", children: nav.primaryCta.label }) : nav.primaryCta === "none" ? null : cta ?? null;
-  const hasFooter = !!actions || !!primaryCta || !!nav.signIn;
-  return /* @__PURE__ */ jsxs6(
-    "div",
-    {
-      ref: sheetRef,
-      id: MOBILE_NAV_SHEET_ID,
-      role: "dialog",
-      "aria-modal": "true",
-      "aria-label": "Navigation menu",
-      tabIndex: -1,
-      className: cn(
-        "fixed inset-0 z-[9999] flex h-[100svh] flex-col text-ods-text-primary outline-none",
-        backgroundClassName ?? "bg-ods-bg"
-      ),
-      children: [
-        /* @__PURE__ */ jsxs6("div", { className: "flex h-14 shrink-0 items-center justify-between border-b border-ods-border pl-5 pr-[var(--spacing-system-xsf)]", children: [
-          /* @__PURE__ */ jsx7("div", { className: "flex min-w-0 items-center", children: logo }),
-          /* @__PURE__ */ jsx7(
-            Button,
-            {
-              type: "button",
-              variant: "transparent",
-              size: "icon",
-              "aria-label": "Close menu",
-              onClick: onClose,
-              className: cn("h-11 w-11 shrink-0 md:h-11 md:w-11", NAV_FOCUS_CLASS),
-              children: /* @__PURE__ */ jsx7(XmarkIcon, { "aria-hidden": "true", className: "!h-6 !w-6" })
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxs6("div", { className: "min-h-0 flex-1 overflow-y-auto overflow-x-hidden overscroll-contain px-5", children: [
-          askAI && /* @__PURE__ */ jsx7(
-            MingoAiButton,
-            {
-              variant: "field",
-              source: askAI.source,
-              icon: askAI.icon,
-              label: askAI.label,
-              onClick: onClose
-            }
+    if (item.href || item.onClick) {
+      return /* @__PURE__ */ jsx5(
+        Button,
+        {
+          variant: "transparent",
+          href: item.href,
+          onClick: item.onClick,
+          leftIcon: item.icon,
+          rightIcon: item.badge,
+          size: "default",
+          font: "regular",
+          className: cn(
+            NAV_ITEM_CLASSES,
+            "hover:bg-ods-bg-hover focus:bg-ods-bg-hover",
+            "whitespace-nowrap",
+            "text-ods-text-primary",
+            // All items use primary text color
+            item.isActive && "bg-ods-bg-hover",
+            // Active items get subtle gray background
+            item.className
           ),
-          /* @__PURE__ */ jsx7("nav", { "aria-label": "Main", children: menus.map((menu) => {
-            const links = menuLinks(menu);
-            if (links.length === 0) {
-              if (!menu.href) return null;
-              return /* @__PURE__ */ jsx7("div", { className: "border-b border-ods-border", children: renderLink({
-                link: { href: menu.href },
-                className: cn(GROUP_ROW_CLASS, NAV_FOCUS_CLASS),
-                onClick: onClose,
-                children: /* @__PURE__ */ jsxs6(Fragment5, { children: [
-                  menu.label,
-                  /* @__PURE__ */ jsx7(Chevron02RightIcon, { "aria-hidden": "true", className: "h-5 w-5 shrink-0 text-ods-text-muted" })
-                ] })
-              }) }, menu.id);
-            }
-            const open = !!openGroups[menu.id];
-            const listId = `${MOBILE_NAV_SHEET_ID}-${menu.id}`;
-            return /* @__PURE__ */ jsxs6("div", { className: "border-b border-ods-border", children: [
-              /* @__PURE__ */ jsxs6(
-                Button,
-                {
-                  type: "button",
-                  variant: "glyph",
-                  size: "wrap",
-                  font: "regular",
-                  "aria-expanded": open,
-                  "aria-controls": open ? listId : void 0,
-                  onClick: () => setOpenGroups((prev) => ({ ...prev, [menu.id]: !prev[menu.id] })),
-                  className: cn(GROUP_ROW_CLASS, NAV_FOCUS_CLASS),
-                  children: [
-                    menu.label,
-                    /* @__PURE__ */ jsx7(
-                      Chevron02DownIcon,
-                      {
-                        "aria-hidden": "true",
-                        className: cn(
-                          "h-5 w-5 shrink-0 text-ods-text-muted transition-transform duration-150",
-                          open && "rotate-180"
-                        )
-                      }
-                    )
-                  ]
-                }
-              ),
-              open && /* @__PURE__ */ jsxs6("div", { id: listId, className: "flex flex-col pb-[var(--spacing-system-sf)]", children: [
-                links.map((link) => /* @__PURE__ */ jsx7(
-                  NavItemRow,
-                  {
-                    link,
-                    variant: "sheet",
-                    renderLink,
-                    badge: link.badgeKey ? badges?.[link.badgeKey] : void 0,
-                    onNavigate: onClose
-                  },
-                  link.id
-                )),
-                menu.showSocial && social && /* @__PURE__ */ jsx7("div", { className: "pt-[var(--spacing-system-xsf)]", children: social })
-              ] })
-            ] }, menu.id);
-          }) })
-        ] }),
-        hasFooter && /* @__PURE__ */ jsxs6("div", { className: "flex shrink-0 flex-col gap-[var(--spacing-system-xxs)] border-t border-ods-border px-5 pb-[max(1.75rem,env(safe-area-inset-bottom))] pt-[var(--spacing-system-mf)] [&_a]:w-full [&_button]:w-full", children: [
-          actions,
-          primaryCta,
-          nav.signIn && renderLink({
-            link: nav.signIn,
-            className: cn(
-              "flex h-12 items-center justify-center rounded-md text-ods-text-primary text-h4",
-              NAV_FOCUS_CLASS
-            ),
-            onClick: onClose,
-            children: nav.signIn.label
-          })
-        ] })
-      ]
+          ...item.isExternal && { isExternal: true },
+          children: item.label
+        },
+        item.id
+      );
     }
-  );
-}
-
-// src/components/navigation/site-footer.tsx
-import { useState as useState3 } from "react";
-import { Fragment as Fragment6, jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
-var ACCORDION_OVER = 2;
-var DESKTOP_COLUMNS = {
-  1: "md:grid-cols-1",
-  2: "md:grid-cols-2",
-  3: "md:grid-cols-3",
-  4: "md:grid-cols-3 lg:grid-cols-4",
-  5: "md:grid-cols-3 lg:grid-cols-5",
-  6: "md:grid-cols-3 lg:grid-cols-6"
-};
-var HEADING_CLASS2 = "text-ods-text-muted text-h5";
-function FooterColumn({
-  group,
-  accordion,
-  renderLink
-}) {
-  const [open, setOpen] = useState3(false);
-  const listId = `site-footer-${group.id}`;
-  const links = group.links.map((link) => /* @__PURE__ */ jsx8("li", { children: /* @__PURE__ */ jsx8(NavItemRow, { link, variant: "label", renderLink }) }, link.id));
-  return /* @__PURE__ */ jsxs7(
+    return /* @__PURE__ */ jsx5(
+      Button,
+      {
+        variant: "transparent",
+        onClick: item.onClick,
+        leftIcon: item.icon,
+        rightIcon: item.badge,
+        size: "default",
+        font: "regular",
+        className: cn(
+          NAV_ITEM_CLASSES,
+          "hover:bg-ods-bg-hover focus:bg-ods-bg-hover",
+          "whitespace-nowrap",
+          "text-ods-text-primary",
+          // All items use primary text color
+          item.isActive && "bg-ods-bg-hover",
+          // Active items get gray background
+          item.className
+        ),
+        children: item.label
+      },
+      item.id
+    );
+  };
+  const headerShown = !config.autoHide || show;
+  const hasNav = !!config.navigation && config.navigation.items.length > 0;
+  const hasCta = !!config.actions?.right?.length || !!(config.actions?.persistent && config.actions.persistent.length > 0);
+  return /* @__PURE__ */ jsx5(
     "div",
     {
-      className: cn(
-        "flex min-w-0 flex-col md:gap-[var(--spacing-system-mf)]",
-        accordion ? "border-b border-ods-border md:border-b-0" : "gap-[var(--spacing-system-mf)]"
-      ),
-      children: [
-        group.title && (accordion ? /* @__PURE__ */ jsxs7(Fragment6, { children: [
-          /* @__PURE__ */ jsx8("h3", { className: "md:hidden", children: /* @__PURE__ */ jsxs7(
-            Button,
+      className: cn("sticky top-0 z-[50] w-full transition-transform duration-300 ease-in-out"),
+      style: {
+        transform: !headerShown ? "translateY(-100%)" : "translateY(0)"
+      },
+      children: /* @__PURE__ */ jsx5(
+        TopNavigation,
+        {
+          className: cn("relative", config.className),
+          style: config.style,
+          backgroundClassName: config.backgroundColor,
+          centerBreakpoint: "lg",
+          size: "big",
+          leading: /* @__PURE__ */ jsxs5(Fragment2, { children: [
+            !!config.actions?.left?.length && /* @__PURE__ */ jsx5("div", { className: "flex h-full items-center border-r border-ods-border", children: config.actions.left }),
+            config.mobile?.enabled && /* @__PURE__ */ jsx5(
+              HeaderButton,
+              {
+                className: "border-r border-ods-border lg:hidden",
+                onClick: () => {
+                  config.mobile?.onToggle?.();
+                },
+                isActive: config.mobile?.isOpen ?? false,
+                "aria-label": config.mobile?.isOpen ? "Close menu" : "Open menu",
+                "aria-expanded": config.mobile?.isOpen ?? false,
+                "aria-controls": config.mobile?.isOpen ? MOBILE_NAV_PANEL_ID : void 0,
+                icon: config.mobile?.isOpen ? config.mobile?.closeIcon || /* @__PURE__ */ jsx5(XmarkIcon, { className: "h-6 w-6" }) : config.mobile?.menuIcon || /* @__PURE__ */ jsx5(Menu01Icon, { className: "h-6 w-6" })
+              }
+            )
+          ] }),
+          logo: config.logo.href ? /* @__PURE__ */ jsx5(next_link_default, { href: config.logo.href, className: "transition-opacity duration-200 hover:opacity-80", children: config.logo.element }) : config.logo.element,
+          logoClassName: "pl-[var(--spacing-system-lf)] md:pl-[var(--spacing-system-lf)] lg:pl-[var(--spacing-system-lf)]",
+          center: hasNav ? /* @__PURE__ */ jsx5(
+            "nav",
             {
-              type: "button",
-              variant: "glyph",
-              size: "wrap",
-              font: "regular",
-              "aria-expanded": open,
-              "aria-controls": listId,
-              onClick: () => setOpen((prev) => !prev),
               className: cn(
-                "flex min-h-14 w-full items-center justify-between gap-[var(--spacing-system-sf)] text-left",
-                HEADING_CLASS2,
-                NAV_FOCUS_CLASS
+                "flex items-center gap-2",
+                // True centering relative to the bar (not the leftover flex
+                // space) — same treatment the pre-unification header had.
+                config.navigation?.position === "center" && "absolute left-1/2 -translate-x-1/2"
               ),
-              children: [
-                group.title,
-                /* @__PURE__ */ jsx8(
-                  Chevron02DownIcon,
-                  {
-                    "aria-hidden": "true",
-                    className: cn("h-5 w-5 shrink-0 transition-transform duration-150", open && "rotate-180")
-                  }
-                )
-              ]
+              role: "navigation",
+              "aria-label": "Main navigation",
+              children: config.navigation?.items.map(renderNavigationItem)
             }
-          ) }),
-          /* @__PURE__ */ jsx8("h3", { className: cn("hidden md:block", HEADING_CLASS2), children: group.title })
-        ] }) : /* @__PURE__ */ jsx8("h3", { className: HEADING_CLASS2, children: group.title })),
-        /* @__PURE__ */ jsx8(
-          "ul",
-          {
-            id: listId,
-            className: cn(
-              "flex-col md:flex md:gap-[var(--spacing-system-sf)] md:pb-0",
-              accordion ? open ? "flex gap-[var(--spacing-system-sf)] pb-[var(--spacing-system-mf)]" : "hidden" : "flex gap-[var(--spacing-system-sf)]"
+          ) : void 0,
+          centerClassName: cn(
+            config.navigation?.position === "left" && "justify-start",
+            config.navigation?.position === "right" && "justify-end pr-[var(--spacing-system-m)]"
+          ),
+          cta: hasCta ? /* @__PURE__ */ jsxs5(Fragment2, { children: [
+            !!config.actions?.right?.length && /* @__PURE__ */ jsx5("div", { className: "hidden items-center gap-3 lg:flex", children: config.actions.right }),
+            config.actions?.persistent && config.actions.persistent.length > 0 && /* @__PURE__ */ jsx5("div", { className: "flex items-center", children: config.actions.persistent })
+          ] }) : void 0,
+          ctaClassName: "gap-3",
+          sideActions: config.tickets || config.mingo?.enabled ? /* @__PURE__ */ jsxs5(Fragment2, { children: [
+            config.tickets && /* @__PURE__ */ jsx5(
+              TicketAlertsButton,
+              {
+                href: config.tickets.href,
+                onNavigate: config.tickets.onClick,
+                className: "border-l border-ods-border"
+              }
             ),
-            children: links
-          }
-        )
-      ]
+            config.mingo?.enabled && /* @__PURE__ */ jsx5(
+              MingoAiButton,
+              {
+                source: config.mingo.source,
+                icon: config.mingo.icon,
+                label: config.mingo.label,
+                className: config.mingo.className
+              }
+            )
+          ] }) : void 0
+        }
+      )
     }
   );
 }
-function SiteFooter({
-  nav,
-  logo,
-  name,
-  renderLink = defaultRenderSiteNavLink,
-  cta,
-  social,
-  brandExtra,
-  backgroundClassName,
-  year = (/* @__PURE__ */ new Date()).getFullYear()
-}) {
-  const band = nav.closingBand;
-  const bandPrimary = typeof nav.primaryCta === "object" ? /* @__PURE__ */ jsx8(Button, { variant: "accent", href: nav.primaryCta.href, children: nav.primaryCta.label }) : nav.primaryCta === "none" ? null : cta ?? null;
-  const columns = nav.footerColumns;
-  const accordion = columns.length > ACCORDION_OVER;
-  const socialRow = social ?? (nav.brand.social.length > 0 ? /* @__PURE__ */ jsx8(
-    SocialIconRow,
-    {
-      compact: true,
-      links: nav.brand.social.map((link) => ({
-        platform: link.iconName ?? link.id,
-        href: link.href,
-        label: link.label
-      }))
-    }
-  ) : null);
-  return /* @__PURE__ */ jsxs7(
-    "footer",
+
+// src/components/navigation/header-skeleton.tsx
+import { Fragment as Fragment3, jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+function HeaderSkeleton({ config }) {
+  const showNavigation = config?.navigation && config.navigation.items.length > 0;
+  const showActions = config?.actions?.right && config.actions.right.length > 0;
+  const showMobileMenu = config?.mobile?.enabled;
+  const showLeftActions = !!config?.actions?.left;
+  return /* @__PURE__ */ jsx6("div", { className: "sticky top-0 z-[50] w-full", children: /* @__PURE__ */ jsxs6(
+    "header",
     {
       className: cn(
-        "relative z-[44] w-full border-t border-ods-border px-[var(--spacing-system-lf)] text-ods-text-primary",
-        backgroundClassName ?? "bg-ods-bg"
+        "flex h-[72px] w-full items-center border-b border-t border-ods-border md:border-t-0",
+        config?.backgroundColor || "bg-ods-card",
+        config?.className
       ),
       children: [
-        band && /* @__PURE__ */ jsxs7("div", { className: "flex flex-col gap-[var(--spacing-system-lf)] border-b border-ods-border py-[var(--spacing-system-xlf)] md:flex-row md:items-center md:justify-between md:gap-[var(--spacing-system-xlf)] md:py-14", children: [
-          /* @__PURE__ */ jsxs7("div", { className: "flex min-w-0 flex-col gap-[var(--spacing-system-xsf)]", children: [
-            /* @__PURE__ */ jsx8("h2", { className: "text-h2", children: band.heading }),
-            /* @__PURE__ */ jsx8("p", { className: "text-ods-text-secondary text-h4", children: band.subheading })
-          ] }),
-          /* @__PURE__ */ jsxs7("div", { className: "flex shrink-0 flex-col gap-[var(--spacing-system-sf)] md:flex-row", children: [
-            bandPrimary,
-            band.secondary && /* @__PURE__ */ jsx8(Button, { variant: "outline", href: band.secondary.href, openInNewTab: band.secondary.external, children: navLinkLabel(band.secondary) })
-          ] })
+        showLeftActions && /* @__PURE__ */ jsx6("div", { className: "flex h-full w-[72px] items-center justify-center border-r border-ods-border", children: /* @__PURE__ */ jsx6("div", { className: "h-6 w-6 animate-pulse rounded bg-ods-border" }) }),
+        showMobileMenu && /* @__PURE__ */ jsx6("div", { className: "flex h-full w-[72px] items-center justify-center border-r border-ods-border lg:hidden", children: /* @__PURE__ */ jsx6("div", { className: "h-6 w-6 animate-pulse rounded bg-ods-border" }) }),
+        /* @__PURE__ */ jsxs6("div", { className: "flex h-full flex-1 items-center gap-2 p-[var(--spacing-system-m)] md:pl-[var(--spacing-system-l)] lg:flex-none lg:pl-[var(--spacing-system-xxl)]", children: [
+          /* @__PURE__ */ jsx6("div", { className: "h-6 w-6 animate-pulse rounded bg-ods-border" }),
+          /* @__PURE__ */ jsx6("div", { className: "h-5 w-24 animate-pulse rounded bg-ods-border" })
         ] }),
-        /* @__PURE__ */ jsxs7("div", { className: "flex flex-col gap-8 py-[var(--spacing-system-xlf)] lg:flex-row lg:gap-16 lg:py-14", children: [
-          /* @__PURE__ */ jsxs7("div", { className: "flex w-full shrink-0 flex-col items-start gap-[var(--spacing-system-mf)] lg:w-60", children: [
-            /* @__PURE__ */ jsxs7("span", { className: "flex items-center gap-[var(--spacing-system-xsf)]", children: [
-              logo,
-              typeof name === "string" ? /* @__PURE__ */ jsx8("span", { className: "whitespace-nowrap text-ods-text-primary text-wordmark", children: name }) : name
-            ] }),
-            /* @__PURE__ */ jsx8("p", { className: "text-ods-text-secondary text-h6", children: nav.brand.tagline }),
-            socialRow,
-            nav.brand.statusUrl && renderLink({
-              link: { href: nav.brand.statusUrl, external: true },
-              className: cn(
-                "inline-flex items-center gap-[var(--spacing-system-xsf)] text-ods-text-secondary transition-colors text-h6 hover:text-ods-text-primary",
-                NAV_FOCUS_CLASS
-              ),
-              children: /* @__PURE__ */ jsxs7(Fragment6, { children: [
-                /* @__PURE__ */ jsx8("span", { "aria-hidden": "true", className: "h-2 w-2 rounded-full bg-ods-success" }),
-                "System status"
-              ] })
-            }),
-            brandExtra
-          ] }),
-          columns.length > 0 && /* @__PURE__ */ jsx8(
-            "nav",
-            {
-              "aria-label": "Footer",
-              className: cn(
-                "grid min-w-0 flex-1 md:gap-7",
-                accordion ? "grid-cols-1" : "grid-cols-2 gap-7",
-                DESKTOP_COLUMNS[Math.min(columns.length, 6)]
-              ),
-              children: columns.map((group) => /* @__PURE__ */ jsx8(FooterColumn, { group, accordion, renderLink }, group.id))
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxs7(
-          "div",
-          {
-            className: cn(
-              "flex flex-col gap-[var(--spacing-system-xxs)] border-t border-ods-border pb-[var(--spacing-system-xlf)] pt-[var(--spacing-system-lf)] text-ods-text-muted text-h6 md:flex-row md:items-center md:justify-between md:gap-[var(--spacing-system-lf)]"
-            ),
-            children: [
-              /* @__PURE__ */ jsxs7("span", { children: [
-                "\xA9 ",
-                year,
-                " ",
-                nav.legal.company
-              ] }),
-              /* @__PURE__ */ jsxs7("span", { className: "flex flex-wrap items-center gap-x-[var(--spacing-system-mf)] gap-y-[var(--spacing-system-xxs)]", children: [
-                nav.legal.notes.length > 0 && /* @__PURE__ */ jsx8("span", { children: nav.legal.notes.join(" \xB7 ") }),
-                nav.legal.links.map((link) => /* @__PURE__ */ jsx8(
-                  NavItemRow,
-                  {
-                    link,
-                    variant: "label",
-                    renderLink,
-                    className: "text-ods-accent hover:text-ods-accent hover:underline"
-                  },
-                  link.id
-                ))
-              ] })
-            ]
-          }
-        )
+        /* @__PURE__ */ jsx6("div", { className: "hidden h-full min-w-0 flex-1 items-center justify-center gap-2 lg:flex", children: showNavigation && /* @__PURE__ */ jsxs6(Fragment3, { children: [
+          /* @__PURE__ */ jsx6("div", { className: "h-8 w-20 animate-pulse rounded bg-ods-border" }),
+          /* @__PURE__ */ jsx6("div", { className: "h-8 w-28 animate-pulse rounded bg-ods-border" }),
+          /* @__PURE__ */ jsx6("div", { className: "h-8 w-24 animate-pulse rounded bg-ods-border" })
+        ] }) }),
+        showActions && /* @__PURE__ */ jsx6("div", { className: "hidden h-full items-center px-[var(--spacing-system-m)] lg:flex", children: /* @__PURE__ */ jsx6("div", { className: "h-8 w-24 animate-pulse rounded bg-ods-border" }) }),
+        config?.mingo?.enabled && /* @__PURE__ */ jsx6("div", { className: "flex h-full items-center border-l border-ods-border px-[var(--spacing-system-l)]", children: /* @__PURE__ */ jsx6("div", { className: "h-8 w-8 animate-pulse rounded bg-ods-border md:w-28" }) })
       ]
     }
-  );
+  ) });
+}
+
+// src/components/navigation/client-only-header.tsx
+import { jsx as jsx7 } from "react/jsx-runtime";
+function ClientOnlyHeader({ config, skeleton }) {
+  const isClient = useIsHydrated();
+  if (!isClient) {
+    return skeleton || /* @__PURE__ */ jsx7(HeaderSkeleton, { config });
+  }
+  return /* @__PURE__ */ jsx7(Header, { config });
 }
 
 // src/components/navigation/sliding-sidebar.tsx
 import { usePreventScroll as usePreventScroll2 } from "@react-aria/overlays";
 import { motion, AnimatePresence, useReducedMotion } from "framer-motion";
-import { useState as useState4, useRef as useRef3 } from "react";
-import { Fragment as Fragment7, jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+import { useState as useState2, useRef as useRef3 } from "react";
+import { Fragment as Fragment4, jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
 function SlidingSidebar({ config }) {
-  const [expandedItems, setExpandedItems] = useState4(/* @__PURE__ */ new Set());
+  const [expandedItems, setExpandedItems] = useState2(/* @__PURE__ */ new Set());
   const mounted = useIsHydrated();
   const headerHeight = useHeaderHeight();
   const asideRef = useRef3(null);
@@ -1063,24 +714,24 @@ function SlidingSidebar({ config }) {
   };
   const renderMenuItem = (item, level = 0) => {
     if (item.element) {
-      return /* @__PURE__ */ jsx9("div", { children: item.element }, item.id);
+      return /* @__PURE__ */ jsx8("div", { children: item.element }, item.id);
     }
     const children = item.children ?? [];
     const hasChildren = children.length > 0;
     const isExpanded = expandedItems.has(item.id);
     if (hasChildren) {
-      const chevronIcon = /* @__PURE__ */ jsx9(
+      const chevronIcon = /* @__PURE__ */ jsx8(
         "svg",
         {
           className: cn("h-4 w-4 transition-transform", isExpanded && "rotate-90"),
           fill: "none",
           stroke: "currentColor",
           viewBox: "0 0 24 24",
-          children: /* @__PURE__ */ jsx9("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" })
+          children: /* @__PURE__ */ jsx8("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" })
         }
       );
-      return /* @__PURE__ */ jsxs8("div", { className: "space-y-1", children: [
-        /* @__PURE__ */ jsxs8(
+      return /* @__PURE__ */ jsxs7("div", { className: "space-y-1", children: [
+        /* @__PURE__ */ jsxs7(
           Button,
           {
             variant: "transparent",
@@ -1094,12 +745,12 @@ function SlidingSidebar({ config }) {
               item.isActive ? "bg-ods-accent text-ods-text-on-accent hover:bg-ods-accent/90" : "text-ods-text-primary hover:bg-ods-border"
             ),
             children: [
-              /* @__PURE__ */ jsx9("span", { className: "truncate", children: item.label }),
-              item.badge !== void 0 && /* @__PURE__ */ jsx9("span", { className: "ml-auto mr-2 flex-shrink-0", children: item.badge })
+              /* @__PURE__ */ jsx8("span", { className: "truncate", children: item.label }),
+              item.badge !== void 0 && /* @__PURE__ */ jsx8("span", { className: "ml-auto mr-2 flex-shrink-0", children: item.badge })
             ]
           }
         ),
-        /* @__PURE__ */ jsx9(AnimatePresence, { children: isExpanded && /* @__PURE__ */ jsx9(
+        /* @__PURE__ */ jsx8(AnimatePresence, { children: isExpanded && /* @__PURE__ */ jsx8(
           motion.div,
           {
             initial: { height: 0, opacity: 0 },
@@ -1112,13 +763,13 @@ function SlidingSidebar({ config }) {
               opacity: { duration: 0.1 }
             },
             className: "overflow-hidden",
-            children: /* @__PURE__ */ jsx9("div", { className: "space-y-1 pl-4", children: children.map((child) => renderMenuItem(child, level + 1)) })
+            children: /* @__PURE__ */ jsx8("div", { className: "space-y-1 pl-4", children: children.map((child) => renderMenuItem(child, level + 1)) })
           }
         ) })
       ] }, item.id);
     }
     if (item.href) {
-      return /* @__PURE__ */ jsxs8(
+      return /* @__PURE__ */ jsxs7(
         Button,
         {
           variant: "transparent",
@@ -1134,14 +785,14 @@ function SlidingSidebar({ config }) {
             item.isActive ? "bg-ods-accent text-ods-text-on-accent hover:bg-ods-accent/90" : "text-ods-text-primary hover:bg-ods-border"
           ),
           children: [
-            /* @__PURE__ */ jsx9("span", { className: "truncate", children: item.label }),
-            item.badge !== void 0 && /* @__PURE__ */ jsx9("span", { className: "ml-auto flex-shrink-0", children: item.badge })
+            /* @__PURE__ */ jsx8("span", { className: "truncate", children: item.label }),
+            item.badge !== void 0 && /* @__PURE__ */ jsx8("span", { className: "ml-auto flex-shrink-0", children: item.badge })
           ]
         },
         item.id
       );
     }
-    return /* @__PURE__ */ jsxs8(
+    return /* @__PURE__ */ jsxs7(
       Button,
       {
         variant: "transparent",
@@ -1157,8 +808,8 @@ function SlidingSidebar({ config }) {
           item.isActive ? "bg-ods-accent text-ods-text-on-accent hover:bg-ods-accent/90" : "text-ods-text-primary hover:bg-ods-border"
         ),
         children: [
-          /* @__PURE__ */ jsx9("span", { className: "truncate", children: item.label }),
-          item.badge !== void 0 && /* @__PURE__ */ jsx9("span", { className: "ml-auto flex-shrink-0", children: item.badge })
+          /* @__PURE__ */ jsx8("span", { className: "truncate", children: item.label }),
+          item.badge !== void 0 && /* @__PURE__ */ jsx8("span", { className: "ml-auto flex-shrink-0", children: item.badge })
         ]
       },
       item.id
@@ -1167,8 +818,8 @@ function SlidingSidebar({ config }) {
   if (!mounted) {
     return null;
   }
-  return /* @__PURE__ */ jsxs8(Fragment7, { children: [
-    /* @__PURE__ */ jsx9(AnimatePresence, { children: config.isOpen && /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsxs7(Fragment4, { children: [
+    /* @__PURE__ */ jsx8(AnimatePresence, { children: config.isOpen && /* @__PURE__ */ jsx8(
       motion.div,
       {
         initial: { opacity: 0 },
@@ -1182,7 +833,7 @@ function SlidingSidebar({ config }) {
         onClick: () => config.onClose()
       }
     ) }),
-    /* @__PURE__ */ jsxs8(
+    /* @__PURE__ */ jsxs7(
       motion.aside,
       {
         ref: asideRef,
@@ -1209,9 +860,9 @@ function SlidingSidebar({ config }) {
           config.className
         ),
         children: [
-          /* @__PURE__ */ jsx9("div", { className: "flex-shrink-0", style: { height: `${headerHeight}px` } }),
-          /* @__PURE__ */ jsx9("nav", { className: "flex-1 space-y-2 overflow-y-auto overscroll-contain p-4", children: config.items.map((item) => renderMenuItem(item)) }),
-          config.footer && /* @__PURE__ */ jsx9("div", { className: "border-t border-ods-border p-4 pb-[max(1rem,env(safe-area-inset-bottom))]", children: config.footer })
+          /* @__PURE__ */ jsx8("div", { className: "flex-shrink-0", style: { height: `${headerHeight}px` } }),
+          /* @__PURE__ */ jsx8("nav", { className: "flex-1 space-y-2 overflow-y-auto overscroll-contain p-4", children: config.items.map((item) => renderMenuItem(item)) }),
+          config.footer && /* @__PURE__ */ jsx8("div", { className: "border-t border-ods-border p-4 pb-[max(1rem,env(safe-area-inset-bottom))]", children: config.footer })
         ]
       }
     )
@@ -1219,13 +870,13 @@ function SlidingSidebar({ config }) {
 }
 
 // src/components/navigation/navigation-sidebar.tsx
-import { useCallback, useEffect as useEffect3, useMemo, useState as useState5 } from "react";
+import { useCallback, useEffect as useEffect2, useMemo, useState as useState3 } from "react";
 
 // src/components/navigation/navigation-sidebar-header.tsx
-import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
 function NavigationSidebarHeader({ minimized }) {
-  return /* @__PURE__ */ jsxs9("div", { className: "flex h-14 items-center justify-start border-b border-ods-border p-[var(--spacing-system-m)]", children: [
-    /* @__PURE__ */ jsx10("div", { className: "flex-shrink-0", children: /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsxs8("div", { className: "flex h-14 items-center justify-start border-b border-ods-border p-[var(--spacing-system-m)]", children: [
+    /* @__PURE__ */ jsx9("div", { className: "flex-shrink-0", children: /* @__PURE__ */ jsx9(
       OpenFrameLogo,
       {
         className: "h-6 w-6",
@@ -1233,7 +884,7 @@ function NavigationSidebarHeader({ minimized }) {
         lowerPathColor: "var(--color-accent-primary)"
       }
     ) }),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx9(
       "div",
       {
         className: cn(
@@ -1241,7 +892,7 @@ function NavigationSidebarHeader({ minimized }) {
           minimized ? "ml-0 opacity-0" : "ml-[var(--spacing-system-xs)] opacity-100"
         ),
         "aria-hidden": minimized,
-        children: /* @__PURE__ */ jsx10(OpenFrameText, { textColor: "var(--color-text-primary)" })
+        children: /* @__PURE__ */ jsx9(OpenFrameText, { textColor: "var(--color-text-primary)" })
       }
     )
   ] });
@@ -1251,9 +902,9 @@ function NavigationSidebarHeader({ minimized }) {
 import { cloneElement, memo } from "react";
 
 // src/components/navigation/navigation-item-badge.tsx
-import { jsx as jsx11 } from "react/jsx-runtime";
+import { jsx as jsx10 } from "react/jsx-runtime";
 function NavigationItemBadge({ label, compact = false, className, ...rest }) {
-  return /* @__PURE__ */ jsx11(
+  return /* @__PURE__ */ jsx10(
     Tag,
     {
       as: "span",
@@ -1267,7 +918,7 @@ function NavigationItemBadge({ label, compact = false, className, ...rest }) {
 }
 
 // src/components/navigation/navigation-sidebar-item.tsx
-import { Fragment as Fragment8, jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
 var NavigationSidebarItemButton = memo(function NavigationSidebarItemButtonImpl({
   item,
   isActive,
@@ -1314,14 +965,14 @@ var NavigationSidebarItemButton = memo(function NavigationSidebarItemButtonImpl(
     isActive && disabled && "text-ods-text-secondary [&_svg]:fill-ods-text-secondary",
     disabled && "cursor-not-allowed opacity-50"
   );
-  const content = /* @__PURE__ */ jsxs10(Fragment8, { children: [
-    /* @__PURE__ */ jsxs10("div", { className: "relative flex flex-shrink-0 items-center justify-center", children: [
+  const content = /* @__PURE__ */ jsxs9(Fragment5, { children: [
+    /* @__PURE__ */ jsxs9("div", { className: "relative flex flex-shrink-0 items-center justify-center", children: [
       cloneElement(item.icon, {
         color: isActive && !disabled ? "text-ods-accent" : "text-ods-text-secondary"
       }),
-      hasUnread && !showLabel && /* @__PURE__ */ jsx12(UnreadDot, { size: "fixed" })
+      hasUnread && !showLabel && /* @__PURE__ */ jsx11(UnreadDot, { size: "fixed" })
     ] }),
-    /* @__PURE__ */ jsxs10(
+    /* @__PURE__ */ jsxs9(
       "span",
       {
         className: cn(
@@ -1330,12 +981,12 @@ var NavigationSidebarItemButton = memo(function NavigationSidebarItemButtonImpl(
         ),
         "aria-hidden": !showLabel,
         children: [
-          /* @__PURE__ */ jsx12("span", { className: "min-w-0 truncate text-h4", children: item.label }),
-          item.badge && /* @__PURE__ */ jsx12(NavigationItemBadge, { label: item.badge, className: "ml-[var(--spacing-system-xs)] shrink-0" })
+          /* @__PURE__ */ jsx11("span", { className: "min-w-0 truncate text-h4", children: item.label }),
+          item.badge && /* @__PURE__ */ jsx11(NavigationItemBadge, { label: item.badge, className: "ml-[var(--spacing-system-xs)] shrink-0" })
         ]
       }
     ),
-    hasUnread && showLabel && /* @__PURE__ */ jsx12("span", { className: "ml-[var(--spacing-system-xs)] flex size-6 flex-shrink-0 items-center justify-center rounded-md bg-ods-accent p-2", children: /* @__PURE__ */ jsx12("span", { className: "text-ods-text-on-accent text-h5", children: unreadCount > 99 ? "99+" : unreadCount }) })
+    hasUnread && showLabel && /* @__PURE__ */ jsx11("span", { className: "ml-[var(--spacing-system-xs)] flex size-6 flex-shrink-0 items-center justify-center rounded-md bg-ods-accent p-2", children: /* @__PURE__ */ jsx11("span", { className: "text-ods-text-on-accent text-h5", children: unreadCount > 99 ? "99+" : unreadCount }) })
   ] });
   const shared = {
     className,
@@ -1344,21 +995,21 @@ var NavigationSidebarItemButton = memo(function NavigationSidebarItemButtonImpl(
     "aria-current": isActive ? "page" : void 0
   };
   if (disabled || !item.path || item.onClick) {
-    return /* @__PURE__ */ jsx12("button", { type: "button", onClick: (event) => onClick(item, event), disabled, ...shared, children: content });
+    return /* @__PURE__ */ jsx11("button", { type: "button", onClick: (event) => onClick(item, event), disabled, ...shared, children: content });
   }
-  return /* @__PURE__ */ jsx12(next_link_default, { href: item.path, onClick: (event) => onClick(item, event), ...shared, children: content });
+  return /* @__PURE__ */ jsx11(next_link_default, { href: item.path, onClick: (event) => onClick(item, event), ...shared, children: content });
 });
 function NavigationSidebarItemSkeleton({ showLabel }) {
-  return /* @__PURE__ */ jsxs10("div", { className: "flex h-14 w-full items-center justify-start p-[var(--spacing-system-m)]", "aria-hidden": "true", children: [
-    /* @__PURE__ */ jsx12("div", { className: "relative flex flex-shrink-0 items-center justify-center", children: /* @__PURE__ */ jsx12("div", { className: "h-6 w-6 animate-pulse rounded bg-ods-border" }) }),
-    showLabel && /* @__PURE__ */ jsx12("div", { className: "ml-[var(--spacing-system-xs)] h-4 flex-1 animate-pulse rounded bg-ods-border" })
+  return /* @__PURE__ */ jsxs9("div", { className: "flex h-14 w-full items-center justify-start p-[var(--spacing-system-m)]", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx11("div", { className: "relative flex flex-shrink-0 items-center justify-center", children: /* @__PURE__ */ jsx11("div", { className: "h-6 w-6 animate-pulse rounded bg-ods-border" }) }),
+    showLabel && /* @__PURE__ */ jsx11("div", { className: "ml-[var(--spacing-system-xs)] h-4 flex-1 animate-pulse rounded bg-ods-border" })
   ] });
 }
 
 // src/components/navigation/navigation-sidebar-toggle.tsx
-import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
 function NavigationSidebarToggle({ minimized, showLabel, onToggle }) {
-  return /* @__PURE__ */ jsx13("div", { className: "border-t border-ods-border", children: /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsx12("div", { className: "border-t border-ods-border", children: /* @__PURE__ */ jsxs10(
     "button",
     {
       onClick: onToggle,
@@ -1372,8 +1023,8 @@ function NavigationSidebarToggle({ minimized, showLabel, onToggle }) {
       title: minimized ? "Hide Menu" : void 0,
       "aria-label": "Hide Menu",
       children: [
-        /* @__PURE__ */ jsx13("div", { className: "flex flex-shrink-0 items-center justify-center", children: /* @__PURE__ */ jsx13(Chevrons03LeftIcon, { className: "h-6 w-6 rotate-180 text-ods-text-secondary transition-transform duration-300 @[140px]/of-nav-sidebar:rotate-0" }) }),
-        /* @__PURE__ */ jsx13(
+        /* @__PURE__ */ jsx12("div", { className: "flex flex-shrink-0 items-center justify-center", children: /* @__PURE__ */ jsx12(Chevrons03LeftIcon, { className: "h-6 w-6 rotate-180 text-ods-text-secondary transition-transform duration-300 @[140px]/of-nav-sidebar:rotate-0" }) }),
+        /* @__PURE__ */ jsx12(
           "span",
           {
             className: cn(
@@ -1390,7 +1041,7 @@ function NavigationSidebarToggle({ minimized, showLabel, onToggle }) {
 }
 
 // src/components/navigation/navigation-sidebar.tsx
-import { Fragment as Fragment9, jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
 var MINIMIZED_WIDTH = 56;
 var EXPANDED_WIDTH = 224;
 var STORAGE_KEY = "of.navigationSidebar.minimized";
@@ -1414,15 +1065,15 @@ function NavigationSidebar({ config, disabled = false, pushOnTablet = false }) {
   const isLgUp = useLgUp() ?? false;
   const isTablet = isMdUp && !isLgUp;
   const [desktopMinimized, setDesktopMinimized] = useLocalStorage(STORAGE_KEY, config.minimized ?? false);
-  const [tabletMinimized, setTabletMinimized] = useState5(true);
-  const [tabletFor, setTabletFor] = useState5(isTablet);
+  const [tabletMinimized, setTabletMinimized] = useState3(true);
+  const [tabletFor, setTabletFor] = useState3(isTablet);
   if (tabletFor !== isTablet) {
     setTabletFor(isTablet);
     if (isTablet) setTabletMinimized(true);
   }
   const hydrated = useIsHydrated();
   const minimized = hydrated ? isTablet ? tabletMinimized : desktopMinimized : config.minimized ?? false;
-  const [transitionsEnabled, setTransitionsEnabled] = useState5(false);
+  const [transitionsEnabled, setTransitionsEnabled] = useState3(false);
   const isOverlayOpen = isTablet && !minimized;
   const showLabel = !minimized;
   const handleToggle = useCallback(() => {
@@ -1436,7 +1087,7 @@ function NavigationSidebar({ config, disabled = false, pushOnTablet = false }) {
   const closeOverlay = useCallback(() => {
     setTabletMinimized(true);
   }, []);
-  useEffect3(() => {
+  useEffect2(() => {
     if (!isOverlayOpen) return void 0;
     const handleKeyDown = (e) => {
       if (e.key === "Escape") closeOverlay();
@@ -1444,9 +1095,9 @@ function NavigationSidebar({ config, disabled = false, pushOnTablet = false }) {
     document.addEventListener("keydown", handleKeyDown);
     return () => document.removeEventListener("keydown", handleKeyDown);
   }, [isOverlayOpen, closeOverlay]);
-  const [pendingItemId, setPendingItemId] = useState5(null);
+  const [pendingItemId, setPendingItemId] = useState3(null);
   const committedActiveId = useMemo(() => config.items.find((item) => item.isActive)?.id ?? null, [config.items]);
-  const [pendingClearedFor, setPendingClearedFor] = useState5(committedActiveId);
+  const [pendingClearedFor, setPendingClearedFor] = useState3(committedActiveId);
   if (pendingClearedFor !== committedActiveId) {
     setPendingClearedFor(committedActiveId);
     setPendingItemId(null);
@@ -1497,8 +1148,8 @@ function NavigationSidebar({ config, disabled = false, pushOnTablet = false }) {
     });
     return () => cancelAnimationFrame(id);
   }, [transitionsEnabled]);
-  return /* @__PURE__ */ jsxs12(Fragment9, { children: [
-    /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsxs11(Fragment6, { children: [
+    /* @__PURE__ */ jsx13(
       "div",
       {
         className: cn(
@@ -1511,7 +1162,7 @@ function NavigationSidebar({ config, disabled = false, pushOnTablet = false }) {
         "aria-hidden": "true"
       }
     ),
-    /* @__PURE__ */ jsx14(
+    /* @__PURE__ */ jsx13(
       "div",
       {
         className: cn(
@@ -1522,7 +1173,7 @@ function NavigationSidebar({ config, disabled = false, pushOnTablet = false }) {
         "aria-hidden": "true"
       }
     ),
-    /* @__PURE__ */ jsxs12(
+    /* @__PURE__ */ jsxs11(
       "aside",
       {
         className: cn(
@@ -1539,11 +1190,11 @@ function NavigationSidebar({ config, disabled = false, pushOnTablet = false }) {
         ),
         "aria-label": "Main navigation sidebar",
         children: [
-          /* @__PURE__ */ jsx14(NavigationSidebarHeader, { minimized }),
-          /* @__PURE__ */ jsxs12("div", { className: "flex flex-1 flex-col justify-between overflow-y-auto py-4", children: [
-            /* @__PURE__ */ jsxs12("div", { className: "flex flex-col", children: [
+          /* @__PURE__ */ jsx13(NavigationSidebarHeader, { minimized }),
+          /* @__PURE__ */ jsxs11("div", { className: "flex flex-1 flex-col justify-between overflow-y-auto py-4", children: [
+            /* @__PURE__ */ jsxs11("div", { className: "flex flex-col", children: [
               config.topSlot?.({ minimized }),
-              /* @__PURE__ */ jsx14("nav", { className: "flex flex-col", "aria-label": "Primary navigation", "aria-busy": !!loadingRows, children: loadingRows ? loadingRows.primary.map((key) => /* @__PURE__ */ jsx14(NavigationSidebarItemSkeleton, { showLabel }, key)) : primaryItems.map((item) => /* @__PURE__ */ jsx14(
+              /* @__PURE__ */ jsx13("nav", { className: "flex flex-col", "aria-label": "Primary navigation", "aria-busy": !!loadingRows, children: loadingRows ? loadingRows.primary.map((key) => /* @__PURE__ */ jsx13(NavigationSidebarItemSkeleton, { showLabel }, key)) : primaryItems.map((item) => /* @__PURE__ */ jsx13(
                 NavigationSidebarItemButton,
                 {
                   item,
@@ -1556,7 +1207,7 @@ function NavigationSidebar({ config, disabled = false, pushOnTablet = false }) {
                 item.id
               )) })
             ] }),
-            (loadingRows ? loadingRows.secondary.length > 0 : secondaryItems.length > 0) && /* @__PURE__ */ jsx14("nav", { className: "flex flex-col", "aria-label": "Secondary navigation", "aria-busy": !!loadingRows, children: loadingRows ? loadingRows.secondary.map((key) => /* @__PURE__ */ jsx14(NavigationSidebarItemSkeleton, { showLabel }, key)) : secondaryItems.map((item) => /* @__PURE__ */ jsx14(
+            (loadingRows ? loadingRows.secondary.length > 0 : secondaryItems.length > 0) && /* @__PURE__ */ jsx13("nav", { className: "flex flex-col", "aria-label": "Secondary navigation", "aria-busy": !!loadingRows, children: loadingRows ? loadingRows.secondary.map((key) => /* @__PURE__ */ jsx13(NavigationSidebarItemSkeleton, { showLabel }, key)) : secondaryItems.map((item) => /* @__PURE__ */ jsx13(
               NavigationSidebarItemButton,
               {
                 item,
@@ -1569,7 +1220,7 @@ function NavigationSidebar({ config, disabled = false, pushOnTablet = false }) {
               item.id
             )) })
           ] }),
-          /* @__PURE__ */ jsx14(NavigationSidebarToggle, { minimized, showLabel, onToggle: handleToggle })
+          /* @__PURE__ */ jsx13(NavigationSidebarToggle, { minimized, showLabel, onToggle: handleToggle })
         ]
       }
     )
@@ -1577,11 +1228,11 @@ function NavigationSidebar({ config, disabled = false, pushOnTablet = false }) {
 }
 
 // src/components/navigation/app-header.tsx
-import React2 from "react";
+import React3 from "react";
 
 // src/components/navigation/header-global-search.tsx
-import React from "react";
-import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
+import React2 from "react";
+import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
 function HeaderGlobalSearch({
   value = "",
   onChange,
@@ -1589,7 +1240,7 @@ function HeaderGlobalSearch({
   placeholder = "Global Search",
   className
 }) {
-  const [internalValue, setInternalValue] = React.useState(value);
+  const [internalValue, setInternalValue] = React2.useState(value);
   const currentValue = onChange ? value : internalValue;
   const handleChange = (e) => {
     const newValue = e.target.value;
@@ -1608,7 +1259,7 @@ function HeaderGlobalSearch({
       onSubmit?.(currentValue);
     }
   };
-  return /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs12(
     "form",
     {
       onSubmit: handleSubmit,
@@ -1621,8 +1272,8 @@ function HeaderGlobalSearch({
         className
       ),
       children: [
-        /* @__PURE__ */ jsx15(SearchIcon, { className: "h-6 w-6 shrink-0 text-ods-text-secondary" }),
-        /* @__PURE__ */ jsx15(
+        /* @__PURE__ */ jsx14(SearchIcon, { className: "h-6 w-6 shrink-0 text-ods-text-secondary" }),
+        /* @__PURE__ */ jsx14(
           "input",
           {
             type: "text",
@@ -1644,7 +1295,7 @@ function HeaderGlobalSearch({
 }
 
 // src/components/navigation/header-mingo-button.tsx
-import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
 function HeaderMingoButton({
   isActive = false,
   iconOnly = false,
@@ -1653,7 +1304,7 @@ function HeaderMingoButton({
   ...props
 }) {
   const showClose = isActive && (iconOnly || closeWhenActive);
-  return /* @__PURE__ */ jsxs14(
+  return /* @__PURE__ */ jsxs13(
     "button",
     {
       type: "button",
@@ -1679,11 +1330,11 @@ function HeaderMingoButton({
           // Mobile, drawer open: the icon-only button doubles as the close
           // affordance, so swap the Mingo logo for an X. Match the other header
           // icons (e.g. notifications): secondary color, w-4 h-4 → md:w-6 h-6.
-          /* @__PURE__ */ jsx16(XmarkIcon, { className: "h-6 w-6 shrink-0 text-ods-text-secondary" })
+          /* @__PURE__ */ jsx15(XmarkIcon, { className: "h-6 w-6 shrink-0 text-ods-text-secondary" })
         ) : (
           // Outer frame follows the button's text color (currentColor); the eyes
           // and corner block are ODS cyan.
-          /* @__PURE__ */ jsx16(
+          /* @__PURE__ */ jsx15(
             MingoIcon,
             {
               color: "currentColor",
@@ -1693,14 +1344,14 @@ function HeaderMingoButton({
             }
           )
         ),
-        !iconOnly && /* @__PURE__ */ jsx16("span", { className: "whitespace-nowrap font-bold tracking-[-0.36px] text-h3", children: "Mingo AI" })
+        !iconOnly && /* @__PURE__ */ jsx15("span", { className: "whitespace-nowrap font-bold tracking-[-0.36px] text-h3", children: "Mingo AI" })
       ]
     }
   );
 }
 
 // src/components/navigation/header-organization-filter.tsx
-import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
 function HeaderOrganizationFilter({
   organizations = [],
   selectedOrgId,
@@ -1711,8 +1362,8 @@ function HeaderOrganizationFilter({
   const selectedOrg = organizations.find((o) => o.id === selectedOrgId);
   const displayName = selectedOrg?.name || "All Organizations";
   const deviceCount = selectedOrg?.deviceCount ?? totalDeviceCount;
-  return /* @__PURE__ */ jsxs15(DropdownMenu, { children: [
-    /* @__PURE__ */ jsx17(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs15(
+  return /* @__PURE__ */ jsxs14(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx16(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs14(
       "button",
       {
         className: cn(
@@ -1724,10 +1375,10 @@ function HeaderOrganizationFilter({
           className
         ),
         children: [
-          /* @__PURE__ */ jsx17(Filter02Icon, { className: "h-4 w-4 shrink-0 text-ods-text-secondary" }),
-          /* @__PURE__ */ jsxs15("div", { className: "flex min-w-0 flex-col items-start justify-center", children: [
-            /* @__PURE__ */ jsx17("span", { className: "truncate text-ods-text-primary text-h5", title: displayName, children: displayName }),
-            deviceCount !== void 0 && /* @__PURE__ */ jsxs15("span", { className: "truncate text-ods-text-secondary text-h6", children: [
+          /* @__PURE__ */ jsx16(Filter02Icon, { className: "h-4 w-4 shrink-0 text-ods-text-secondary" }),
+          /* @__PURE__ */ jsxs14("div", { className: "flex min-w-0 flex-col items-start justify-center", children: [
+            /* @__PURE__ */ jsx16("span", { className: "truncate text-ods-text-primary text-h5", title: displayName, children: displayName }),
+            deviceCount !== void 0 && /* @__PURE__ */ jsxs14("span", { className: "truncate text-ods-text-secondary text-h6", children: [
               deviceCount.toLocaleString(),
               " Devices"
             ] })
@@ -1735,49 +1386,16 @@ function HeaderOrganizationFilter({
         ]
       }
     ) }),
-    /* @__PURE__ */ jsxs15(DropdownMenuContent, { align: "end", className: "min-w-[240px]", children: [
-      /* @__PURE__ */ jsx17(DropdownMenuItem, { onClick: () => onOrgChange?.(""), children: "All Organizations" }),
-      organizations.map((org) => /* @__PURE__ */ jsx17(DropdownMenuItem, { onClick: () => onOrgChange?.(org.id), children: org.name }, org.id))
+    /* @__PURE__ */ jsxs14(DropdownMenuContent, { align: "end", className: "min-w-[240px]", children: [
+      /* @__PURE__ */ jsx16(DropdownMenuItem, { onClick: () => onOrgChange?.(""), children: "All Organizations" }),
+      organizations.map((org) => /* @__PURE__ */ jsx16(DropdownMenuItem, { onClick: () => onOrgChange?.(org.id), children: org.name }, org.id))
     ] })
   ] });
 }
 
-// src/components/navigation/ticket-alerts-button.tsx
-import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
-function TicketAlertsButton({ href, onNavigate, disabled, className }) {
-  const live = useOptionalTicketLive();
-  if (!live || !live.authed || live.unreadTotal === 0) return null;
-  const targetId = live.nextUnreadTicketId;
-  const target = targetId ? buildTicketOpenHref(href, targetId) : href;
-  const handleClick = () => {
-    if (onNavigate) onNavigate(target);
-    else window.location.assign(target);
-  };
-  return /* @__PURE__ */ jsx18(
-    HeaderButton,
-    {
-      icon: (
-        // Glyph inherits HeaderButton's standard cell coloring (secondary at
-        // rest, primary on active) — SAME treatment as the notifications
-        // bell and time-tracker cells. The indication is carried by the
-        // count pill (sidebar count-pill precedent) and by the cell only
-        // existing while updates are unread — never by tinting the glyph.
-        /* @__PURE__ */ jsxs16("span", { className: "relative inline-flex", children: [
-          /* @__PURE__ */ jsx18(LifeBuoyIcon, { className: "h-6 w-6" }),
-          /* @__PURE__ */ jsx18(UnreadCountBadge, { count: live.unreadTotal })
-        ] })
-      ),
-      "aria-label": `Support tickets \u2014 ${live.unreadTotal} unread ${live.unreadTotal === 1 ? "update" : "updates"}`,
-      onClick: handleClick,
-      disabled,
-      className: cn(className)
-    }
-  );
-}
-
 // src/components/navigation/app-header.tsx
-import { Fragment as Fragment10, jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
-var AppHeader = React2.memo(function AppHeaderImpl({
+import { Fragment as Fragment7, jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
+var AppHeader = React3.memo(function AppHeaderImpl({
   showSearch,
   onSearch,
   showOrganizations,
@@ -1809,7 +1427,7 @@ var AppHeader = React2.memo(function AppHeaderImpl({
 }) {
   const isMdUp = useMdUp() ?? false;
   if (loading) {
-    return /* @__PURE__ */ jsx19(
+    return /* @__PURE__ */ jsx17(
       AppHeaderSkeleton,
       {
         showSearch,
@@ -1832,27 +1450,27 @@ var AppHeader = React2.memo(function AppHeaderImpl({
   }
   const dimmedClass = disabled ? "pointer-events-none opacity-50" : "";
   const cellDivider = "border-l border-ods-border";
-  return /* @__PURE__ */ jsx19(
+  return /* @__PURE__ */ jsx17(
     TopNavigation,
     {
       className: cn("sticky top-0 z-40", className),
       centerBreakpoint: "md",
       leading: (
         // Mobile: Burger Menu Button
-        !isMdUp && /* @__PURE__ */ jsx19(
+        !isMdUp && /* @__PURE__ */ jsx17(
           HeaderButton,
           {
             onClick: onToggleMobileMenu,
             isActive: isMobileMenuOpen,
-            icon: isMobileMenuOpen ? /* @__PURE__ */ jsx19(XmarkIcon, { className: "h-6 w-6" }) : /* @__PURE__ */ jsx19(Menu01Icon, { className: "h-6 w-6" }),
+            icon: isMobileMenuOpen ? /* @__PURE__ */ jsx17(XmarkIcon, { className: "h-6 w-6" }) : /* @__PURE__ */ jsx17(Menu01Icon, { className: "h-6 w-6" }),
             "aria-label": isMobileMenuOpen ? "Close menu" : "Open menu",
             "aria-expanded": isMobileMenuOpen,
             className: "border-r border-ods-border"
           }
         )
       ),
-      logo: !isMdUp && /* @__PURE__ */ jsxs17(Fragment10, { children: [
-        /* @__PURE__ */ jsx19(
+      logo: !isMdUp && /* @__PURE__ */ jsxs15(Fragment7, { children: [
+        /* @__PURE__ */ jsx17(
           OpenFrameLogo,
           {
             className: "h-6 w-6 shrink-0",
@@ -1860,21 +1478,21 @@ var AppHeader = React2.memo(function AppHeaderImpl({
             lowerPathColor: "var(--color-accent-primary)"
           }
         ),
-        /* @__PURE__ */ jsx19(OpenFrameText, { textColor: "var(--color-text-primary)", className: "h-4" })
+        /* @__PURE__ */ jsx17(OpenFrameText, { textColor: "var(--color-text-primary)", className: "h-4" })
       ] }),
       logoClassName: "gap-2",
-      center: showSearch ? /* @__PURE__ */ jsx19(HeaderGlobalSearch, { onSubmit: onSearch, className: cn("w-full", dimmedClass) }) : void 0,
-      sideActions: /* @__PURE__ */ jsxs17(Fragment10, { children: [
-        showSearch && /* @__PURE__ */ jsx19(
+      center: showSearch ? /* @__PURE__ */ jsx17(HeaderGlobalSearch, { onSubmit: onSearch, className: cn("w-full", dimmedClass) }) : void 0,
+      sideActions: /* @__PURE__ */ jsxs15(Fragment7, { children: [
+        showSearch && /* @__PURE__ */ jsx17(
           HeaderButton,
           {
-            icon: /* @__PURE__ */ jsx19(SearchIcon, { className: "h-6 w-6" }),
+            icon: /* @__PURE__ */ jsx17(SearchIcon, { className: "h-6 w-6" }),
             "aria-label": "Search",
             className: cn("md:hidden", cellDivider, dimmedClass),
             disabled
           }
         ),
-        showOrganizations && /* @__PURE__ */ jsx19(
+        showOrganizations && /* @__PURE__ */ jsx17(
           HeaderOrganizationFilter,
           {
             organizations,
@@ -1883,8 +1501,8 @@ var AppHeader = React2.memo(function AppHeaderImpl({
             className: cn("hidden lg:flex", dimmedClass)
           }
         ),
-        showTimeTracker && /* @__PURE__ */ jsx19(TimeTrackerHeaderButton, { disabled, className: cn(cellDivider, dimmedClass) }),
-        showNotifications && /* @__PURE__ */ jsx19(
+        showTimeTracker && /* @__PURE__ */ jsx17(TimeTrackerHeaderButton, { disabled, className: cn(cellDivider, dimmedClass) }),
+        showNotifications && /* @__PURE__ */ jsx17(
           NotificationsHeaderButton,
           {
             fallbackUnreadCount: unreadCount,
@@ -1892,7 +1510,7 @@ var AppHeader = React2.memo(function AppHeaderImpl({
             dimmedClass: cn(cellDivider, dimmedClass)
           }
         ),
-        showTicketAlerts && /* @__PURE__ */ jsx19(
+        showTicketAlerts && /* @__PURE__ */ jsx17(
           TicketAlertsButton,
           {
             href: ticketAlertsHref ?? "/tickets",
@@ -1901,11 +1519,11 @@ var AppHeader = React2.memo(function AppHeaderImpl({
             className: cn(cellDivider, dimmedClass)
           }
         ),
-        isMdUp && showUser && /* @__PURE__ */ jsxs17(DropdownMenu, { children: [
-          /* @__PURE__ */ jsx19(DropdownMenuTrigger, { asChild: true, disabled, children: /* @__PURE__ */ jsx19(
+        isMdUp && showUser && /* @__PURE__ */ jsxs15(DropdownMenu, { children: [
+          /* @__PURE__ */ jsx17(DropdownMenuTrigger, { asChild: true, disabled, children: /* @__PURE__ */ jsx17(
             HeaderButton,
             {
-              icon: /* @__PURE__ */ jsx19(
+              icon: /* @__PURE__ */ jsx17(
                 SquareAvatar,
                 {
                   src: userAvatarUrl || void 0,
@@ -1924,14 +1542,14 @@ var AppHeader = React2.memo(function AppHeaderImpl({
               )
             }
           ) }),
-          /* @__PURE__ */ jsxs17(
+          /* @__PURE__ */ jsxs15(
             DropdownMenuContent,
             {
               align: "end",
               className: "z-[104] w-[280px] overflow-hidden rounded-[6px] border-ods-border bg-ods-bg p-0",
               children: [
-                /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2 border-b border-ods-border bg-ods-card p-3", children: [
-                  /* @__PURE__ */ jsx19(
+                /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-2 border-b border-ods-border bg-ods-card p-3", children: [
+                  /* @__PURE__ */ jsx17(
                     SquareAvatar,
                     {
                       src: userAvatarUrl || void 0,
@@ -1941,30 +1559,30 @@ var AppHeader = React2.memo(function AppHeaderImpl({
                       className: "shrink-0"
                     }
                   ),
-                  /* @__PURE__ */ jsxs17("div", { className: "min-w-0 flex-1", children: [
-                    userName && /* @__PURE__ */ jsx19("div", { className: "truncate text-ods-text-primary text-h4", children: userName }),
-                    userEmail && /* @__PURE__ */ jsx19("div", { className: "truncate text-ods-text-secondary text-h6", children: userEmail })
+                  /* @__PURE__ */ jsxs15("div", { className: "min-w-0 flex-1", children: [
+                    userName && /* @__PURE__ */ jsx17("div", { className: "truncate text-ods-text-primary text-h4", children: userName }),
+                    userEmail && /* @__PURE__ */ jsx17("div", { className: "truncate text-ods-text-secondary text-h6", children: userEmail })
                   ] })
                 ] }),
-                /* @__PURE__ */ jsx19(
+                /* @__PURE__ */ jsx17(
                   DropdownMenuItem,
                   {
                     onClick: onProfile,
                     className: "cursor-pointer rounded-none border-b border-ods-border bg-ods-card px-3 py-3 hover:bg-ods-card/80 focus:bg-ods-card/80",
-                    children: /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
-                      /* @__PURE__ */ jsx19(UserIcon, { className: "h-6 w-6 shrink-0 text-ods-text-primary" }),
-                      /* @__PURE__ */ jsx19("span", { className: "text-ods-text-primary text-h4", children: "Profile Settings" })
+                    children: /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-2", children: [
+                      /* @__PURE__ */ jsx17(UserIcon, { className: "h-6 w-6 shrink-0 text-ods-text-primary" }),
+                      /* @__PURE__ */ jsx17("span", { className: "text-ods-text-primary text-h4", children: "Profile Settings" })
                     ] })
                   }
                 ),
-                /* @__PURE__ */ jsx19(
+                /* @__PURE__ */ jsx17(
                   DropdownMenuItem,
                   {
                     onClick: onLogout,
                     className: "cursor-pointer rounded-none bg-ods-card px-3 py-3 hover:bg-ods-card/80 focus:bg-ods-card/80",
-                    children: /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
-                      /* @__PURE__ */ jsx19(LogOutIcon, { className: "shrink-0 text-ods-error", size: 24 }),
-                      /* @__PURE__ */ jsx19("span", { className: "text-ods-text-primary text-h4", children: "Log Out" })
+                    children: /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-2", children: [
+                      /* @__PURE__ */ jsx17(LogOutIcon, { className: "shrink-0 text-ods-error", size: 24 }),
+                      /* @__PURE__ */ jsx17("span", { className: "text-ods-text-primary text-h4", children: "Log Out" })
                     ] })
                   }
                 )
@@ -1972,7 +1590,7 @@ var AppHeader = React2.memo(function AppHeaderImpl({
             }
           )
         ] }),
-        showMingoAI && /* @__PURE__ */ jsx19(
+        showMingoAI && /* @__PURE__ */ jsx17(
           HeaderMingoButton,
           {
             onClick: onMingoAI,
@@ -1992,10 +1610,10 @@ function NotificationsHeaderButton({ fallbackUnreadCount, disabled, dimmedClass
   const hasUnread = (ctx?.unreadCount ?? fallbackUnreadCount) > 0;
   const isActive = ctx?.isOpen ?? false;
   const onClick = ctx?.toggle;
-  return /* @__PURE__ */ jsx19(
+  return /* @__PURE__ */ jsx17(
     HeaderButton,
     {
-      icon: isActive ? /* @__PURE__ */ jsx19(XmarkIcon, { className: "h-6 w-6" }) : /* @__PURE__ */ jsx19(BellIcon, { className: "h-6 w-6" }),
+      icon: isActive ? /* @__PURE__ */ jsx17(XmarkIcon, { className: "h-6 w-6" }) : /* @__PURE__ */ jsx17(BellIcon, { className: "h-6 w-6" }),
       showUnreadDot: !isActive && hasUnread,
       "aria-label": isActive ? "Close notifications" : "Notifications",
       onClick,
@@ -2011,12 +1629,12 @@ var CELL_VISIBILITY = {
   "icon-lg": "hidden lg:flex"
 };
 function HeaderCellSkeleton({ className }) {
-  return /* @__PURE__ */ jsx19("div", { className: cn("flex h-full w-14 shrink-0 items-center justify-center border-l border-ods-border", className), children: /* @__PURE__ */ jsx19("div", { className: "h-6 w-6 animate-pulse rounded bg-ods-border" }) });
+  return /* @__PURE__ */ jsx17("div", { className: cn("flex h-full w-14 shrink-0 items-center justify-center border-l border-ods-border", className), children: /* @__PURE__ */ jsx17("div", { className: "h-6 w-6 animate-pulse rounded bg-ods-border" }) });
 }
 function HeaderWideCellSkeleton() {
-  return /* @__PURE__ */ jsxs17("div", { className: "flex h-full w-14 shrink-0 items-center justify-center gap-2 border-l border-ods-border md:w-[140px] md:px-4", children: [
-    /* @__PURE__ */ jsx19("div", { className: "h-6 w-6 shrink-0 animate-pulse rounded bg-ods-border" }),
-    /* @__PURE__ */ jsx19("div", { className: "hidden h-5 animate-pulse rounded bg-ods-border md:block md:w-[72px]" })
+  return /* @__PURE__ */ jsxs15("div", { className: "flex h-full w-14 shrink-0 items-center justify-center gap-2 border-l border-ods-border md:w-[140px] md:px-4", children: [
+    /* @__PURE__ */ jsx17("div", { className: "h-6 w-6 shrink-0 animate-pulse rounded bg-ods-border" }),
+    /* @__PURE__ */ jsx17("div", { className: "hidden h-5 animate-pulse rounded bg-ods-border md:block md:w-[72px]" })
   ] });
 }
 function AppHeaderSkeleton({
@@ -2025,7 +1643,7 @@ function AppHeaderSkeleton({
   className
 }) {
   const cells = typeof actionCells === "number" ? Array.from({ length: Math.max(0, actionCells) }, () => "icon") : actionCells;
-  return /* @__PURE__ */ jsx19(
+  return /* @__PURE__ */ jsx17(
     TopNavigation,
     {
       className: cn("sticky top-0 z-40", className),
@@ -2033,18 +1651,18 @@ function AppHeaderSkeleton({
       "aria-busy": "true",
       leading: (
         // Burger cell: mobile only, in CSS.
-        /* @__PURE__ */ jsx19("div", { className: "flex h-full w-14 shrink-0 items-center justify-center border-r border-ods-border md:hidden", children: /* @__PURE__ */ jsx19("div", { className: "h-6 w-6 animate-pulse rounded bg-ods-border" }) })
+        /* @__PURE__ */ jsx17("div", { className: "flex h-full w-14 shrink-0 items-center justify-center border-r border-ods-border md:hidden", children: /* @__PURE__ */ jsx17("div", { className: "h-6 w-6 animate-pulse rounded bg-ods-border" }) })
       ),
-      logo: /* @__PURE__ */ jsxs17(Fragment10, { children: [
-        /* @__PURE__ */ jsx19("div", { className: "h-6 w-6 shrink-0 animate-pulse rounded bg-ods-border" }),
-        /* @__PURE__ */ jsx19("div", { className: "h-4 w-24 animate-pulse rounded bg-ods-border" })
+      logo: /* @__PURE__ */ jsxs15(Fragment7, { children: [
+        /* @__PURE__ */ jsx17("div", { className: "h-6 w-6 shrink-0 animate-pulse rounded bg-ods-border" }),
+        /* @__PURE__ */ jsx17("div", { className: "h-4 w-24 animate-pulse rounded bg-ods-border" })
       ] }),
       logoClassName: "gap-2 md:hidden",
-      center: showSearch ? /* @__PURE__ */ jsx19("div", { className: "h-10 w-full animate-pulse rounded-md bg-ods-border" }) : void 0,
-      sideActions: /* @__PURE__ */ jsxs17(Fragment10, { children: [
-        showSearch && /* @__PURE__ */ jsx19(HeaderCellSkeleton, { className: "md:hidden" }),
+      center: showSearch ? /* @__PURE__ */ jsx17("div", { className: "h-10 w-full animate-pulse rounded-md bg-ods-border" }) : void 0,
+      sideActions: /* @__PURE__ */ jsxs15(Fragment7, { children: [
+        showSearch && /* @__PURE__ */ jsx17(HeaderCellSkeleton, { className: "md:hidden" }),
         cells.map(
-          (cell, i) => cell === "wide" ? /* @__PURE__ */ jsx19(HeaderWideCellSkeleton, {}, i) : /* @__PURE__ */ jsx19(HeaderCellSkeleton, { className: CELL_VISIBILITY[cell] }, i)
+          (cell, i) => cell === "wide" ? /* @__PURE__ */ jsx17(HeaderWideCellSkeleton, {}, i) : /* @__PURE__ */ jsx17(HeaderCellSkeleton, { className: CELL_VISIBILITY[cell] }, i)
         )
       ] })
     }
@@ -2052,17 +1670,17 @@ function AppHeaderSkeleton({
 }
 
 // src/components/navigation/app-layout.tsx
-import { useCallback as useCallback3, useEffect as useEffect5, useMemo as useMemo2, useRef as useRef6, useState as useState7 } from "react";
+import { useCallback as useCallback3, useEffect as useEffect4, useMemo as useMemo2, useRef as useRef6, useState as useState5 } from "react";
 
 // src/components/navigation/app-layout-side-panel.tsx
 import {
-  useEffect as useEffect4,
+  useEffect as useEffect3,
   useId,
   useRef as useRef4,
-  useState as useState6,
+  useState as useState4,
   useSyncExternalStore
 } from "react";
-import { jsx as jsx20, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
 var SIDE_PANEL_INSET = 16;
 var SIDE_PANEL_FRAME_WIDTH = 2;
 var MOBILE_QUERY = `not all and ${breakpoints.md}`;
@@ -2123,7 +1741,7 @@ function useStoredSize(storageKey, fallback) {
     },
     () => null
   );
-  const [sessionSize, setSessionSize] = useState6(null);
+  const [sessionSize, setSessionSize] = useState4(null);
   const size = (storageKey ? parseSize(raw) : sessionSize) ?? fallback;
   const setSize = (next) => {
     if (!storageKey) {
@@ -2146,7 +1764,7 @@ function useAppLayoutSidePanel(config, row) {
   const collapsed = config?.collapsed ?? false;
   const minimum = { width: minWidth, expanded: false };
   const defaultWidth = Math.max(minWidth, config?.defaultWidth ?? minWidth);
-  const [rowWidth, setRowWidth] = useState6(0);
+  const [rowWidth, setRowWidth] = useState4(0);
   useIsomorphicLayoutEffect(() => {
     if (!enabled || !row) return void 0;
     const update = () => setRowWidth(row.clientWidth);
@@ -2157,18 +1775,18 @@ function useAppLayoutSidePanel(config, row) {
   }, [enabled, row]);
   const isMobile = useMediaQuery(MOBILE_QUERY) === true;
   const reduceMotion = useMediaQuery(REDUCED_MOTION_QUERY) === true;
-  const [morph, setMorph] = useState6(null);
-  const [liveWidth, setLiveWidth] = useState6(null);
+  const [morph, setMorph] = useState4(null);
+  const [liveWidth, setLiveWidth] = useState4(null);
   const [storedSize, setStoredSize] = useStoredSize(config?.storageKey, { width: defaultWidth, expanded: false });
-  const [ownIsOpen, setOwnIsOpen] = useState6(false);
+  const [ownIsOpen, setOwnIsOpen] = useState4(false);
   const isOpen = config?.open ?? ownIsOpen;
   const onOpenChange = config?.onOpenChange;
   const setIsOpen = (next) => {
     if (config?.open === void 0) setOwnIsOpen(next);
     onOpenChange?.(next);
   };
-  const [collapsedSize, setCollapsedSize] = useState6(null);
-  const [prevCollapsed, setPrevCollapsed] = useState6(collapsed);
+  const [collapsedSize, setCollapsedSize] = useState4(null);
+  const [prevCollapsed, setPrevCollapsed] = useState4(collapsed);
   if (collapsed !== prevCollapsed) {
     setPrevCollapsed(collapsed);
     setCollapsedSize(null);
@@ -2176,13 +1794,13 @@ function useAppLayoutSidePanel(config, row) {
   const size = collapsed ? collapsedSize ?? minimum : storedSize;
   const setSize = collapsed ? setCollapsedSize : setStoredSize;
   const layout = resolveSidePanelLayout({ rowWidth, isMobile, isOpen, size, minWidth, minContentWidth });
-  const [prevCanDock, setPrevCanDock] = useState6(layout.canDock);
+  const [prevCanDock, setPrevCanDock] = useState4(layout.canDock);
   if (layout.canDock !== prevCanDock) {
     setPrevCanDock(layout.canDock);
     setOwnIsOpen(false);
   }
   const prevCanDockRef = useRef4(layout.canDock);
-  useEffect4(() => {
+  useEffect3(() => {
     const couldDock = prevCanDockRef.current;
     prevCanDockRef.current = layout.canDock;
     if (!couldDock && layout.canDock && config?.open) onOpenChange?.(false);
@@ -2265,7 +1883,7 @@ function SidePanelResizeHandle({ state, label, controls }) {
   const pendingRef = useRef4(null);
   const measured = Number.isFinite(maxDockedWidth);
   const current = peekWidth ?? (mode === "full" && measured ? maxDockedWidth + 1 : width);
-  useEffect4(
+  useEffect3(
     () => () => {
       if (frameRef.current !== null) cancelAnimationFrame(frameRef.current);
     },
@@ -2322,7 +1940,7 @@ function SidePanelResizeHandle({ state, label, controls }) {
     event.preventDefault();
     resize(next);
   };
-  return /* @__PURE__ */ jsx20(
+  return /* @__PURE__ */ jsx18(
     "div",
     {
       role: "separator",
@@ -2340,12 +1958,12 @@ function SidePanelResizeHandle({ state, label, controls }) {
       onPointerCancel: endDrag,
       onKeyDown: handleKeyDown,
       className: "group absolute inset-y-0 left-0 z-10 flex w-4 -translate-x-1/2 cursor-col-resize touch-none select-none items-center justify-center outline-none",
-      children: /* @__PURE__ */ jsx20(
+      children: /* @__PURE__ */ jsx18(
         "span",
         {
           "aria-hidden": true,
           className: "flex h-8 w-4 items-center justify-center rounded-sm border border-ods-border bg-ods-card text-ods-text-secondary transition-colors group-hover:border-ods-border-hover group-focus-visible:border-ods-accent group-focus-visible:text-ods-accent",
-          children: /* @__PURE__ */ jsx20(Menu01Icon, { size: 12 })
+          children: /* @__PURE__ */ jsx18(Menu01Icon, { size: 12 })
         }
       )
     }
@@ -2354,7 +1972,7 @@ function SidePanelResizeHandle({ state, label, controls }) {
 function AppLayoutSidePanel({ config, state }) {
   const panelId = useId();
   const { mode, width, dockedWidth, canDock, isOpen, close, morph, endMorph, peekWidth } = state;
-  useEffect4(() => {
+  useEffect3(() => {
     if (!morph) return void 0;
     const timer = window.setTimeout(endMorph, MORPH_MS * 3);
     return () => window.clearTimeout(timer);
@@ -2367,7 +1985,7 @@ function AppLayoutSidePanel({ config, state }) {
     event.preventDefault();
     close();
   };
-  return /* @__PURE__ */ jsx20(
+  return /* @__PURE__ */ jsx18(
     "aside",
     {
       id: panelId,
@@ -2385,7 +2003,7 @@ function AppLayoutSidePanel({ config, state }) {
         mode === "overlay" && "absolute inset-0 z-[99] bg-ods-bg"
       ),
       style: mode !== "overlay" && inColumn ? { width: dockedWidth + SIDE_PANEL_INSET } : void 0,
-      children: /* @__PURE__ */ jsxs18(
+      children: /* @__PURE__ */ jsxs16(
         "div",
         {
           onTransitionEnd: (event) => {
@@ -2401,8 +2019,8 @@ function AppLayoutSidePanel({ config, state }) {
           ),
           style: mode === "overlay" ? void 0 : { width: peekWidth ?? width },
           children: [
-            canDock && /* @__PURE__ */ jsx20(SidePanelResizeHandle, { state, label: `Resize ${label}`, controls: panelId }),
-            /* @__PURE__ */ jsx20(
+            canDock && /* @__PURE__ */ jsx18(SidePanelResizeHandle, { state, label: `Resize ${label}`, controls: panelId }),
+            /* @__PURE__ */ jsx18(
               "div",
               {
                 className: cn(
@@ -2430,10 +2048,10 @@ function AppLayoutSidePanel({ config, state }) {
 
 // src/components/navigation/mobile-burger-menu.tsx
 import { usePreventScroll as usePreventScroll3 } from "@react-aria/overlays";
-import React3, { useCallback as useCallback2, useRef as useRef5 } from "react";
-import { Fragment as Fragment11, jsx as jsx21, jsxs as jsxs19 } from "react/jsx-runtime";
+import React4, { useCallback as useCallback2, useRef as useRef5 } from "react";
+import { Fragment as Fragment8, jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
 var HEADER_HEIGHT = 56;
-var MobileBurgerMenu = React3.memo(function MobileBurgerMenuImpl({
+var MobileBurgerMenu = React4.memo(function MobileBurgerMenuImpl({
   isOpen,
   onClose,
   config,
@@ -2461,7 +2079,7 @@ var MobileBurgerMenu = React3.memo(function MobileBurgerMenuImpl({
   const secondaryItems = config.items.filter((item) => item.section === "secondary");
   const renderNavigationItem = (item, isGridItem = false) => {
     const isActive = item.isActive ?? false;
-    return /* @__PURE__ */ jsxs19(
+    return /* @__PURE__ */ jsxs17(
       "button",
       {
         onClick: () => handleItemClick(item),
@@ -2481,12 +2099,12 @@ var MobileBurgerMenu = React3.memo(function MobileBurgerMenuImpl({
         "aria-current": isActive ? "page" : void 0,
         "aria-label": item.badge ? `${item.label} (${item.badge})` : void 0,
         children: [
-          item.icon && /* @__PURE__ */ jsx21("div", { className: "flex size-4 flex-shrink-0 items-center justify-center", children: React3.cloneElement(item.icon, {
+          item.icon && /* @__PURE__ */ jsx19("div", { className: "flex size-4 flex-shrink-0 items-center justify-center", children: React4.cloneElement(item.icon, {
             size: 16,
             color: isActive && !disabled ? "var(--color-accent-primary)" : "var(--color-text-secondary)"
           }) }),
-          /* @__PURE__ */ jsxs19("span", { className: "flex min-w-0 flex-1 items-center gap-[var(--spacing-system-xxs)]", children: [
-            /* @__PURE__ */ jsx21(
+          /* @__PURE__ */ jsxs17("span", { className: "flex min-w-0 flex-1 items-center gap-[var(--spacing-system-xxs)]", children: [
+            /* @__PURE__ */ jsx19(
               "span",
               {
                 className: cn(
@@ -2496,16 +2114,16 @@ var MobileBurgerMenu = React3.memo(function MobileBurgerMenuImpl({
                 children: item.label
               }
             ),
-            item.badge && /* @__PURE__ */ jsx21(NavigationItemBadge, { compact: true, label: item.badge })
+            item.badge && /* @__PURE__ */ jsx19(NavigationItemBadge, { compact: true, label: item.badge })
           ] })
         ]
       },
       item.id
     );
   };
-  const renderNavigationGrid = (items) => /* @__PURE__ */ jsx21("div", { className: "grid grid-cols-2 gap-3", children: items.map((item) => /* @__PURE__ */ jsx21(React3.Fragment, { children: renderNavigationItem(item, true) }, item.id)) });
-  return /* @__PURE__ */ jsxs19(Fragment11, { children: [
-    /* @__PURE__ */ jsx21(
+  const renderNavigationGrid = (items) => /* @__PURE__ */ jsx19("div", { className: "grid grid-cols-2 gap-3", children: items.map((item) => /* @__PURE__ */ jsx19(React4.Fragment, { children: renderNavigationItem(item, true) }, item.id)) });
+  return /* @__PURE__ */ jsxs17(Fragment8, { children: [
+    /* @__PURE__ */ jsx19(
       "div",
       {
         className: cn(
@@ -2519,7 +2137,7 @@ var MobileBurgerMenu = React3.memo(function MobileBurgerMenuImpl({
         "aria-hidden": "true"
       }
     ),
-    /* @__PURE__ */ jsx21(
+    /* @__PURE__ */ jsx19(
       "div",
       {
         ref: panelRef,
@@ -2540,8 +2158,8 @@ var MobileBurgerMenu = React3.memo(function MobileBurgerMenuImpl({
         "aria-label": "Mobile navigation menu",
         tabIndex: -1,
         inert: !isOpen || void 0,
-        children: /* @__PURE__ */ jsxs19("div", { className: "flex flex-1 flex-col gap-4 overflow-y-auto overflow-x-hidden overscroll-contain p-4", children: [
-          user && /* @__PURE__ */ jsxs19(
+        children: /* @__PURE__ */ jsxs17("div", { className: "flex flex-1 flex-col gap-4 overflow-y-auto overflow-x-hidden overscroll-contain p-4", children: [
+          user && /* @__PURE__ */ jsxs17(
             "div",
             {
               className: cn(
@@ -2550,7 +2168,7 @@ var MobileBurgerMenu = React3.memo(function MobileBurgerMenuImpl({
               ),
               "aria-disabled": disabled || void 0,
               children: [
-                /* @__PURE__ */ jsx21(
+                /* @__PURE__ */ jsx19(
                   SquareAvatar,
                   {
                     src: user.userAvatarUrl || void 0,
@@ -2561,24 +2179,24 @@ var MobileBurgerMenu = React3.memo(function MobileBurgerMenuImpl({
                     className: "h-14 w-14 shrink-0"
                   }
                 ),
-                /* @__PURE__ */ jsxs19("div", { className: "flex min-w-0 flex-1 flex-col", children: [
-                  /* @__PURE__ */ jsxs19("div", { className: "flex items-center gap-2", children: [
-                    /* @__PURE__ */ jsx21("span", { className: "truncate text-ods-text-primary text-h6", children: user.userName || "User" }),
-                    user.userRole && /* @__PURE__ */ jsx21("span", { className: "shrink-0 rounded-md border border-ods-border bg-ods-card px-2 py-0.5 uppercase text-ods-text-primary text-h6", children: user.userRole })
+                /* @__PURE__ */ jsxs17("div", { className: "flex min-w-0 flex-1 flex-col", children: [
+                  /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
+                    /* @__PURE__ */ jsx19("span", { className: "truncate text-ods-text-primary text-h6", children: user.userName || "User" }),
+                    user.userRole && /* @__PURE__ */ jsx19("span", { className: "shrink-0 rounded-md border border-ods-border bg-ods-card px-2 py-0.5 uppercase text-ods-text-primary text-h6", children: user.userRole })
                   ] }),
-                  user.userEmail && /* @__PURE__ */ jsx21("span", { className: "truncate text-ods-text-secondary text-h6", children: user.userEmail })
+                  user.userEmail && /* @__PURE__ */ jsx19("span", { className: "truncate text-ods-text-secondary text-h6", children: user.userEmail })
                 ] }),
-                /* @__PURE__ */ jsxs19("div", { className: "flex shrink-0 items-center gap-2", children: [
-                  onSearchUser && /* @__PURE__ */ jsx21(Button, { size: "icon", onClick: onSearchUser, variant: "outline", "aria-label": "Search users", children: /* @__PURE__ */ jsx21(UserSearchIcon, { className: "size-4 text-ods-text-primary" }) }),
-                  onEditProfile && /* @__PURE__ */ jsx21(Button, { size: "icon", onClick: onEditProfile, variant: "outline", "aria-label": "Edit profile", children: /* @__PURE__ */ jsx21(PenEditIcon, { className: "size-4 text-ods-text-primary" }) })
+                /* @__PURE__ */ jsxs17("div", { className: "flex shrink-0 items-center gap-2", children: [
+                  onSearchUser && /* @__PURE__ */ jsx19(Button, { size: "icon", onClick: onSearchUser, variant: "outline", "aria-label": "Search users", children: /* @__PURE__ */ jsx19(UserSearchIcon, { className: "size-4 text-ods-text-primary" }) }),
+                  onEditProfile && /* @__PURE__ */ jsx19(Button, { size: "icon", onClick: onEditProfile, variant: "outline", "aria-label": "Edit profile", children: /* @__PURE__ */ jsx19(PenEditIcon, { className: "size-4 text-ods-text-primary" }) })
                 ] })
               ]
             }
           ),
           config.topSlot?.({ minimized: false }),
-          /* @__PURE__ */ jsx21("nav", { "aria-label": "Primary navigation", children: renderNavigationGrid(primaryItems) }),
-          secondaryItems.length > 0 && /* @__PURE__ */ jsx21("nav", { "aria-label": "Secondary navigation", className: "flex flex-col gap-3", children: secondaryItems.map((item) => /* @__PURE__ */ jsx21(React3.Fragment, { children: renderNavigationItem(item, false) }, item.id)) }),
-          onLogout && /* @__PURE__ */ jsxs19(
+          /* @__PURE__ */ jsx19("nav", { "aria-label": "Primary navigation", children: renderNavigationGrid(primaryItems) }),
+          secondaryItems.length > 0 && /* @__PURE__ */ jsx19("nav", { "aria-label": "Secondary navigation", className: "flex flex-col gap-3", children: secondaryItems.map((item) => /* @__PURE__ */ jsx19(React4.Fragment, { children: renderNavigationItem(item, false) }, item.id)) }),
+          onLogout && /* @__PURE__ */ jsxs17(
             "button",
             {
               onClick: onLogout,
@@ -2589,8 +2207,8 @@ var MobileBurgerMenu = React3.memo(function MobileBurgerMenuImpl({
                 disabled && "cursor-not-allowed opacity-50"
               ),
               children: [
-                /* @__PURE__ */ jsx21(Logout02Icon, { className: "size-4 text-ods-error" }),
-                /* @__PURE__ */ jsx21("span", { className: "flex-1 text-left text-ods-text-primary text-h6", children: "Log Out" })
+                /* @__PURE__ */ jsx19(Logout02Icon, { className: "size-4 text-ods-error" }),
+                /* @__PURE__ */ jsx19("span", { className: "flex-1 text-left text-ods-text-primary text-h6", children: "Log Out" })
               ]
             }
           )
@@ -2601,7 +2219,7 @@ var MobileBurgerMenu = React3.memo(function MobileBurgerMenuImpl({
 });
 
 // src/components/navigation/app-layout.tsx
-import { jsx as jsx22, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs18 } from "react/jsx-runtime";
 function AppLayout({
   children,
   sidebarConfig,
@@ -2614,10 +2232,10 @@ function AppLayout({
   topBar,
   sidePanel
 }) {
-  const [mobileMenuOpen, setMobileMenuOpen] = useState7(false);
-  const [drawerContainer, setDrawerContainer] = useState7(null);
-  const [mainElement, setMainElement] = useState7(null);
-  const [contentWidth, setContentWidth] = useState7(null);
+  const [mobileMenuOpen, setMobileMenuOpen] = useState5(false);
+  const [drawerContainer, setDrawerContainer] = useState5(null);
+  const [mainElement, setMainElement] = useState5(null);
+  const [contentWidth, setContentWidth] = useState5(null);
   const hasSidePanel = sidePanel !== void 0;
   const sidePanelState = useAppLayoutSidePanel(sidePanel, drawerContainer);
   useIsomorphicLayoutEffect(() => {
@@ -2637,7 +2255,7 @@ function AppLayout({
   };
   const contentCovered = sidePanelState?.coversContent === true;
   const mobileMenuOpenRef = useRef6(mobileMenuOpen);
-  useEffect5(() => {
+  useEffect4(() => {
     mobileMenuOpenRef.current = mobileMenuOpen;
   });
   const drawerHandlesRef = useRef6(/* @__PURE__ */ new Set());
@@ -2666,11 +2284,11 @@ function AppLayout({
     }),
     []
   );
-  return /* @__PURE__ */ jsx22(AppLayoutDrawerContainerContext.Provider, { value: drawerContainer, children: /* @__PURE__ */ jsx22(AppLayoutDrawerCoordinationContext.Provider, { value: drawerCoordination, children: /* @__PURE__ */ jsxs20("div", { className: cn("flex h-screen flex-col bg-ods-bg", className), children: [
+  return /* @__PURE__ */ jsx20(AppLayoutDrawerContainerContext.Provider, { value: drawerContainer, children: /* @__PURE__ */ jsx20(AppLayoutDrawerCoordinationContext.Provider, { value: drawerCoordination, children: /* @__PURE__ */ jsxs18("div", { className: cn("flex h-screen flex-col bg-ods-bg", className), children: [
     topBar,
-    /* @__PURE__ */ jsxs20("div", { className: "relative flex min-h-0 flex-1", children: [
-      /* @__PURE__ */ jsx22(NavigationSidebar, { config: sidebarConfig, disabled, pushOnTablet: hasSidePanel }),
-      /* @__PURE__ */ jsx22(
+    /* @__PURE__ */ jsxs18("div", { className: "relative flex min-h-0 flex-1", children: [
+      /* @__PURE__ */ jsx20(NavigationSidebar, { config: sidebarConfig, disabled, pushOnTablet: hasSidePanel }),
+      /* @__PURE__ */ jsx20(
         MobileBurgerMenu,
         {
           ...mobileBurgerMenuProps,
@@ -2680,8 +2298,8 @@ function AppLayout({
           disabled
         }
       ),
-      /* @__PURE__ */ jsxs20("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
-        /* @__PURE__ */ jsx22(
+      /* @__PURE__ */ jsxs18("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
+        /* @__PURE__ */ jsx20(
           AppHeader,
           {
             ...resolvedHeaderProps,
@@ -2690,8 +2308,8 @@ function AppLayout({
             disabled
           }
         ),
-        /* @__PURE__ */ jsx22(NotificationDrawer, {}),
-        /* @__PURE__ */ jsxs20(
+        /* @__PURE__ */ jsx20(NotificationDrawer, {}),
+        /* @__PURE__ */ jsxs18(
           "div",
           {
             ref: setDrawerContainer,
@@ -2700,7 +2318,7 @@ function AppLayout({
               sidePanel ? (
                 // `hidden` while the panel covers the area: the page stays
                 // mounted, it just takes no room.
-                /* @__PURE__ */ jsx22(
+                /* @__PURE__ */ jsx20(
                   "main",
                   {
                     ref: setMainElement,
@@ -2712,11 +2330,11 @@ function AppLayout({
                       sidePanelState?.overlapsContent && "isolate",
                       mainClassName
                     ),
-                    children: /* @__PURE__ */ jsx22(ContentAreaWidthContext.Provider, { value: contentWidth, children: /* @__PURE__ */ jsx22("div", { className: "ods-content-scope", children }) })
+                    children: /* @__PURE__ */ jsx20(ContentAreaWidthContext.Provider, { value: contentWidth, children: /* @__PURE__ */ jsx20("div", { className: "ods-content-scope", children }) })
                   }
                 )
-              ) : /* @__PURE__ */ jsx22("main", { className: cn("flex-1 overflow-y-auto", mainClassName), children }),
-              sidePanel && sidePanelState && /* @__PURE__ */ jsx22(AppLayoutSidePanel, { config: sidePanel, state: sidePanelState }),
+              ) : /* @__PURE__ */ jsx20("main", { className: cn("flex-1 overflow-y-auto", mainClassName), children }),
+              sidePanel && sidePanelState && /* @__PURE__ */ jsx20(AppLayoutSidePanel, { config: sidePanel, state: sidePanelState }),
               drawer
             ]
           }
@@ -2727,20 +2345,14 @@ function AppLayout({
 }
 
 export {
-  ASK_AI_OPEN_EVENT,
-  openAskAi,
   MingoAiButton,
-  MOBILE_NAV_SHEET_ID,
-  defaultRenderSiteNavLink,
-  navLinkLabel,
-  NavItemRow,
-  isMegaMenu,
-  NavPanel,
+  MOBILE_NAV_PANEL_ID,
+  MobileNavPanel,
+  TicketAlertsButton,
   TopNavigation,
-  SiteHeader,
-  siteNavHasMobileMenus,
-  MobileNavSheet,
-  SiteFooter,
+  Header,
+  HeaderSkeleton,
+  ClientOnlyHeader,
   SlidingSidebar,
   NavigationItemBadge,
   NAVIGATION_SIDEBAR_WIDTH_VAR,
@@ -2748,7 +2360,6 @@ export {
   HeaderGlobalSearch,
   HeaderMingoButton,
   HeaderOrganizationFilter,
-  TicketAlertsButton,
   AppHeader,
   SIDE_PANEL_FRAME_WIDTH,
   MobileBurgerMenu,