@xenide-io/the-old-ui-theme 0.4.3 → 0.4.6

package/dist/suite.js

@@ -68,10 +68,16 @@ __export(suite_exports, {
   AppSwitcherMark: () => AppSwitcherMark,
   CommandPaletteHost: () => CommandPaletteHost,
   DeferredChrome: () => DeferredChrome,
+  SIDEBAR_COLLAPSE_THRESHOLD: () => SIDEBAR_COLLAPSE_THRESHOLD,
+  SIDEBAR_DEFAULT_WIDTH: () => SIDEBAR_DEFAULT_WIDTH,
+  SIDEBAR_MAX_WIDTH: () => SIDEBAR_MAX_WIDTH,
+  SIDEBAR_MIN_EXPANDED_WIDTH: () => SIDEBAR_MIN_EXPANDED_WIDTH,
+  SIDEBAR_RAIL_WIDTH: () => SIDEBAR_RAIL_WIDTH,
   SUITE_APPS: () => SUITE_APPS2,
   SUITE_APP_MAP: () => SUITE_APP_MAP,
   SUITE_GLYPHS: () => SUITE_GLYPHS,
   SUITE_ICON_NAMES: () => SUITE_ICON_NAMES,
+  SUITE_OPEN_ASK_AI_EVENT: () => SUITE_OPEN_ASK_AI_EVENT,
   SUITE_SPRINGS: () => SUITE_SPRINGS,
   SourceAppGlyph: () => SourceAppGlyph,
   SuiteAiPanel: () => SuiteAiPanel,
@@ -89,6 +95,7 @@ __export(suite_exports, {
   SuitePage: () => SuitePage,
   SuitePageHeader: () => SuitePageHeader,
   SuiteSectionHeader: () => SuiteSectionHeader,
+  SuiteSettingsLayout: () => SuiteSettingsLayout,
   SuiteSettingsMobileNav: () => SuiteSettingsMobileNav,
   SuiteSidebar: () => SuiteSidebar,
   SuiteSkeleton: () => SuiteSkeleton,
@@ -98,11 +105,15 @@ __export(suite_exports, {
   SuiteThemeProvider: () => SuiteThemeProvider,
   SuiteToolbar: () => SuiteToolbar,
   SuiteUserMenu: () => SuiteUserMenu,
+  TodayAskAiCard: () => TodayAskAiCard,
   TodayCalibrating: () => TodayCalibrating,
+  TodayEmptyAction: () => TodayEmptyAction,
   TodayEmptyState: () => TodayEmptyState,
   TodayHero: () => TodayHero,
+  TodayLayout: () => TodayLayout,
   TodayPageFrame: () => TodayPageFrame,
   TodayPanel: () => TodayPanel,
+  TodayPrimaryAction: () => TodayPrimaryAction,
   TodaySection: () => TodaySection,
   TodayTimeIcon: () => TodayTimeIcon,
   TodayTopBar: () => TodayTopBar,
@@ -111,11 +122,14 @@ __export(suite_exports, {
   appSwitcherTriggerClass: () => appSwitcherTriggerClass,
   cn: () => cn,
   getTodayGreeting: () => getTodayGreeting,
-  m: () => import_react8.m,
+  m: () => import_react10.m,
+  openSuiteAskAi: () => openSuiteAskAi,
+  resolveSuiteNotificationHref: () => resolveSuiteNotificationHref,
   sourceToSuiteApp: () => sourceToSuiteApp,
   suiteAppBaseUrl: () => suiteAppBaseUrl,
   suiteAppLabel: () => suiteAppLabel,
   useIdleMount: () => useIdleMount,
+  useSidebarWidth: () => useSidebarWidth,
   useSuiteTheme: () => useSuiteTheme
 });
 module.exports = __toCommonJS(suite_exports);
@@ -127,24 +141,32 @@ function TodayPageFrame({ children }) {
     "div",
     {
       "data-test": "today-page",
-      className: "today-page-frame relative flex min-h-0 flex-1 flex-col overflow-y-auto overflow-x-hidden",
+      className: "today-page-frame relative flex min-h-0 w-full flex-1 flex-col overflow-x-hidden",
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
           "div",
           {
-            className: "pointer-events-none absolute inset-x-0 top-0 h-[34rem] overflow-hidden",
+            className: "pointer-events-none absolute inset-0 overflow-hidden",
             "aria-hidden": true,
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "today-page-frame__glow absolute inset-0" }),
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "today-page-frame__sun absolute -right-16 -top-16 h-72 w-72 rounded-full bg-gradient-to-br from-amber-300/30 via-rose-300/20 to-rose-400/10 blur-3xl opacity-60 motion-safe:animate-[pulse_8s_ease-in-out_infinite] motion-reduce:opacity-40" }),
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "today-page-frame__top-fade absolute inset-x-0 top-0 h-64" }),
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "today-page-frame__cloud today-page-frame__cloud--1 absolute -left-24 top-28 h-80 w-[26rem] rounded-[45%]" }),
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "today-page-frame__cloud today-page-frame__cloud--2 absolute -right-20 top-40 h-72 w-80 rounded-[40%]" }),
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "today-page-frame__cloud today-page-frame__cloud--3 absolute left-[28%] top-[58%] h-64 w-[22rem] rounded-[50%]" })
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "today-page-frame__top-fade absolute inset-x-0 top-0 h-[28rem]" }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "today-page-frame__cloud today-page-frame__cloud--1 absolute -left-28 top-16 h-96 w-[30rem] rounded-[45%]" }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "today-page-frame__cloud today-page-frame__cloud--2 absolute -right-24 top-24 h-80 w-[22rem] rounded-[40%]" }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "today-page-frame__cloud today-page-frame__cloud--3 absolute left-[22%] top-48 h-72 w-[24rem] rounded-[50%]" }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "today-page-frame__cloud today-page-frame__cloud--4 absolute right-[18%] top-[42%] h-64 w-[20rem] rounded-[48%]" }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "today-page-frame__cloud today-page-frame__cloud--5 absolute left-[8%] top-[68%] h-56 w-[18rem] rounded-[42%]" })
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "relative flex-1 px-4 pb-10 pt-5 sm:px-6 sm:pt-6 lg:px-8 [&_.list-row]:min-h-[52px] [&_.list-row]:sm:min-h-[44px]", children })
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "div",
+          {
+            "data-width": "full",
+            className: "suite-page-stage suite-page-inset relative z-[1] flex w-full min-w-0 flex-1 flex-col [&_.list-row]:min-h-[52px] [&_.list-row]:sm:min-h-[44px]",
+            children
+          }
+        )
       ]
     }
   );
@@ -597,15 +619,15 @@ function AnimatedSun({ className }) {
           /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("stop", { stopColor: "#f59e0b" }),
           /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("stop", { offset: "1", stopColor: "#fb923c" })
         ] }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("g", { className: "origin-center motion-safe:animate-[spin_20s_linear_infinite] motion-reduce:animate-none", children: [0, 45, 90, 135, 180, 225, 270, 315].map((angle) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("g", { className: "origin-center opacity-80 motion-safe:animate-[pulse_8s_ease-in-out_infinite] motion-reduce:animate-none", children: [0, 45, 90, 135, 180, 225, 270, 315].map((angle) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
           "line",
           {
             x1: "20",
-            y1: "4",
+            y1: "5",
             x2: "20",
             y2: "9",
             stroke: "#fbbf24",
-            strokeWidth: "2",
+            strokeWidth: "1.75",
             strokeLinecap: "round",
             transform: `rotate(${angle} 20 20)`
           },
@@ -639,10 +661,9 @@ function AnimatedMoon({ className }) {
             fill: "url(#animatedMoonBody)"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("g", { className: "motion-safe:animate-[pulse_4s_ease-in-out_infinite] motion-reduce:animate-none", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("circle", { cx: "29", cy: "10", r: "1.4", fill: "#c7d2fe" }),
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("circle", { cx: "34", cy: "16", r: "1", fill: "#c7d2fe" }),
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("circle", { cx: "25", cy: "5.5", r: "0.9", fill: "#c7d2fe" })
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("g", { className: "opacity-70 motion-safe:animate-[pulse_10s_ease-in-out_infinite] motion-reduce:animate-none", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("circle", { cx: "29", cy: "10", r: "1.2", fill: "#c7d2fe" }),
+          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("circle", { cx: "34", cy: "16", r: "0.9", fill: "#c7d2fe" })
         ] })
       ]
     }
@@ -704,30 +725,193 @@ function getTodayGreeting(user, stats) {
   const overdueCount = (_d = stats == null ? void 0 : stats.overdueCount) != null ? _d : 0;
   const hours = (_e = stats == null ? void 0 : stats.hours) != null ? _e : 0;
   if (overdueCount > 0) {
-    return `${greeting}. You have ${taskCount} task${taskCount === 1 ? "" : "s"} due today, ${overdueCount} overdue.`;
+    return `${greeting}. ${taskCount} task${taskCount === 1 ? "" : "s"} due today, ${overdueCount} overdue.`;
   }
   if (taskCount > 0) {
-    return `${greeting}. You have ${taskCount} task${taskCount === 1 ? "" : "s"} due today.`;
+    return `${greeting}. ${taskCount} task${taskCount === 1 ? "" : "s"} due today.`;
   }
   if (hours > 0) {
-    return `${greeting}. You logged ${hours} hour${hours === 1 ? "" : "s"} today.`;
+    return `${greeting}. ${hours} hour${hours === 1 ? "" : "s"} logged today.`;
   }
   if (period === "evening" || period === "night") {
-    return `${greeting}. Time to wrap up.`;
+    return `${greeting}. Nice work \u2014 time to wrap up.`;
   }
-  return `${greeting}. Nothing overdue \u2014 take a nice, deep breath.`;
+  return `${greeting}. Clear queue \u2014 take a nice, deep breath.`;
 }
 function TodayHero({
-  message = "Take a nice, deep breath."
+  message = "Take a nice, deep breath.",
+  brief,
+  briefMeta
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "mt-4 sm:mt-6", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+      "p",
+      {
+        className: "today-hero max-w-2xl font-display text-lg font-semibold tracking-tight text-ph-ink sm:text-xl sm:leading-snug",
+        children: message
+      },
+      typeof message === "string" ? message : "hero"
+    ),
+    brief ? /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "mt-4 max-w-2xl", "data-test": "today-focus-brief", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "text-[15px] leading-[1.65] text-ph-ink", children: brief }),
+      briefMeta ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "mt-1.5 text-xs text-ph-mutedtext", children: briefMeta }) : null
+    ] }) : null
+  ] });
+}
+function TodayPrimaryAction({
+  label,
+  description,
+  icon,
+  accent = "neutral",
+  onClick,
+  href,
+  loading = false,
+  active = false,
+  className,
+  dataTest = "today-primary-action"
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "mt-8 text-center sm:mt-10", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-    "p",
+  const classes = cn(
+    "today-primary-action group relative flex w-full max-w-md items-center gap-3 overflow-hidden rounded-xl px-3.5 py-2.5 text-left transition sm:px-4 sm:py-3",
+    `today-primary-action--${accent}`,
+    active && "today-primary-action--active",
+    loading && "pointer-events-none opacity-70",
+    className
+  );
+  const body = /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "today-primary-action__icon inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-lg sm:h-10 sm:w-10", children: icon }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: "min-w-0 flex-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "block text-sm font-semibold tracking-tight sm:text-base", children: label }),
+      description ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "mt-0.5 block text-xs opacity-80 sm:text-sm", children: description }) : null
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+      "span",
+      {
+        className: "today-primary-action__chevron shrink-0 text-base opacity-60 transition group-hover:translate-x-0.5 group-hover:opacity-100",
+        "aria-hidden": true,
+        children: "\u2192"
+      }
+    )
+  ] });
+  if (href && !onClick) {
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+      "a",
+      {
+        href,
+        className: classes,
+        "data-test": dataTest,
+        "aria-busy": loading,
+        children: body
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    "button",
     {
-      className: "today-hero font-display text-2xl font-bold tracking-tight text-ph-ink sm:text-[1.75rem] sm:leading-tight",
-      children: message
-    },
-    typeof message === "string" ? message : "hero"
-  ) });
+      type: "button",
+      onClick,
+      disabled: loading,
+      className: classes,
+      "data-test": dataTest,
+      "aria-busy": loading,
+      children: body
+    }
+  );
+}
+function TodayEmptyAction({
+  title,
+  description,
+  actionLabel,
+  href,
+  onClick,
+  dataTest
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+    "div",
+    {
+      className: "rounded-lg border border-dashed border-ph-border/80 bg-ph-muted/30 px-4 py-4 text-center",
+      "data-test": dataTest,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "text-sm font-semibold text-ph-ink", children: title }),
+        description ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "mx-auto mt-1 max-w-sm text-xs leading-relaxed text-ph-subtle sm:text-sm", children: description }) : null,
+        actionLabel && (href || onClick) ? href ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          "a",
+          {
+            href,
+            className: "mt-2.5 inline-flex text-sm font-semibold text-ph-brand hover:underline",
+            children: actionLabel
+          }
+        ) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick,
+            className: "mt-2.5 inline-flex text-sm font-semibold text-ph-brand hover:underline",
+            children: actionLabel
+          }
+        ) : null
+      ]
+    }
+  );
+}
+function TodayLayout({
+  primary,
+  main,
+  aside,
+  className
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+    "div",
+    {
+      className: cn("mt-5 space-y-6 sm:mt-6", className),
+      "data-test": "today-layout",
+      children: [
+        primary ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "max-w-md", children: primary }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "grid gap-6 lg:grid-cols-[minmax(0,1fr)_minmax(16rem,20rem)] lg:items-start lg:gap-8", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "min-w-0 space-y-8", children: main }),
+          aside ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("aside", { className: "space-y-3 lg:sticky lg:top-6 lg:self-start", children: aside }) : null
+        ] })
+      ]
+    }
+  );
+}
+function TodayAskAiCard({
+  title = "Ask AI",
+  description = "Ask about your workspace, draft something, or look a fact up online.",
+  cta = "Ask",
+  className,
+  onClick,
+  href
+}) {
+  const classes = cn(
+    "group flex w-full items-start gap-3.5 rounded-2xl border border-ph-border/70 bg-ph-surface px-4 py-3.5 text-left shadow-[0_1px_12px_-8px_rgba(15,23,42,0.1)] transition hover:border-ph-brand/35 hover:bg-[color-mix(in_oklab,var(--ph-accent)_6%,var(--ph-surface))] sm:px-5",
+    className
+  );
+  const body = /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-2xl bg-ph-brand/15 text-ph-brand shadow-sm ring-1 ring-black/[0.06]", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SuiteIcon, { name: "stack-hex", accent: "shellstack", className: "h-5 w-5" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: "min-w-0 flex-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: "flex flex-wrap items-baseline justify-between gap-x-3 gap-y-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "font-display text-sm font-bold tracking-tight text-ph-ink", children: title }),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "text-sm font-medium text-ph-brand transition group-hover:underline", children: cta })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "mt-1 block text-sm leading-relaxed text-ph-subtle", children: description })
+    ] })
+  ] });
+  if (onClick) {
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+      "button",
+      {
+        type: "button",
+        onClick,
+        className: classes,
+        "data-test": "today-ask-ai",
+        children: body
+      }
+    );
+  }
+  if (href) {
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("a", { href, className: classes, "data-test": "today-ask-ai", children: body });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: classes, "data-test": "today-ask-ai", children: body });
 }
 function TodaySection({
   icon: Icon,
@@ -738,7 +922,7 @@ function TodaySection({
   testId,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("section", { "data-test": testId, className: "space-y-4", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("section", { "data-test": testId, className: "space-y-5", children: [
     /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex items-start justify-between gap-4", children: [
       /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex min-w-0 items-start gap-3.5", children: [
         /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
@@ -769,8 +953,7 @@ function TodayPanel({
     "div",
     {
       className: cn(
-        "border-ph-border/70 rounded-2xl border bg-ph-surface p-6 shadow-[0_2px_28px_-10px_rgba(15,23,42,0.14)] transition-all duration-200 ease-out sm:p-6",
-        "hover:shadow-[0_8px_32px_-12px_rgba(15,23,42,0.18)] hover:-translate-y-0.5 motion-reduce:transition-none motion-reduce:hover:transform-none",
+        "border-ph-border/70 rounded-2xl border bg-ph-surface p-5 shadow-[0_1px_16px_-8px_rgba(15,23,42,0.12)] sm:p-5",
         className
       ),
       children
@@ -948,6 +1131,70 @@ function AppSwitcher({
 var import_react2 = require("react");
 var import_navigation = require("next/navigation");
 var import_iconoir_react3 = require("iconoir-react");
+
+// src/suite/lib/apps.ts
+var SUITE_APPS2 = [
+  {
+    slug: "shellstack",
+    name: "ShellStack",
+    description: "Organisation and billing",
+    icon: "/icon-shellstack.svg",
+    landing: "/home",
+    baseUrlEnv: "NEXT_PUBLIC_SHELLSTACK_URL",
+    baseUrlFallback: "http://localhost:3002"
+  },
+  {
+    slug: "tides",
+    name: "Tides",
+    description: "Projects and tasks",
+    icon: "/tides-icon.svg",
+    landing: "/today",
+    baseUrlEnv: "NEXT_PUBLIC_TIDES_URL",
+    baseUrlFallback: "http://localhost:3001"
+  },
+  {
+    slug: "turtletime",
+    name: "TurtleTime",
+    description: "Time tracking",
+    icon: "/turtletime-icon.svg",
+    landing: "/today",
+    baseUrlEnv: "NEXT_PUBLIC_TURTLETIME_URL",
+    baseUrlFallback: "http://localhost:3000"
+  },
+  {
+    slug: "kraken",
+    name: "Kraken",
+    description: "Documents and knowledge",
+    icon: "/kraken-icon.svg",
+    landing: "/today",
+    baseUrlEnv: "NEXT_PUBLIC_KRAKEN_URL",
+    baseUrlFallback: "http://localhost:3003"
+  }
+];
+var SUITE_APP_MAP = Object.fromEntries(SUITE_APPS2.map((app) => [app.slug, app]));
+function suiteAppBaseUrl(slug) {
+  const def = SUITE_APP_MAP[slug];
+  const fromEnv = typeof process !== "undefined" ? process.env[def.baseUrlEnv] : void 0;
+  return (fromEnv || def.baseUrlFallback).replace(/\/$/, "");
+}
+var SOURCE_APP_SLUG = {
+  turtletime: "turtletime",
+  tides: "tides",
+  kraken: "kraken",
+  portal: "shellstack",
+  shellstack: "shellstack"
+};
+function resolveSuiteNotificationHref(href, sourceApp) {
+  const value = (href || "").trim();
+  if (!value) return "";
+  if (/^(https?:|mailto:|\/\/)/i.test(value)) return value;
+  const path = value.startsWith("/") ? value : `/${value}`;
+  const slug = SOURCE_APP_SLUG[(sourceApp || "").toLowerCase()];
+  if (!slug) return path;
+  return `${suiteAppBaseUrl(slug)}${path}`;
+}
+
+// src/suite/components/suite-notification-bell.tsx
 var import_jsx_runtime7 = require("react/jsx-runtime");
 var POLL_MS = 6e4;
 function timeAgo(iso) {
@@ -1038,9 +1285,13 @@ function SuiteNotificationBell({
         } catch (e) {
         }
       }
-      if (!n.href) return;
-      if (/^https?:\/\//i.test(n.href)) window.location.assign(n.href);
-      else router.push(n.href);
+      const target = resolveSuiteNotificationHref(n.href, n.source_app);
+      if (!target) return;
+      if (/^https?:\/\//i.test(target)) {
+        window.location.assign(target);
+        return;
+      }
+      router.push(target);
     },
     [router, markRead]
   );
@@ -1193,6 +1444,7 @@ function SuiteMobileDrawer({
   children,
   side = "left",
   showCloseButton = false,
+  title,
   closeLabel = "Close navigation",
   backdropLabel = "Close navigation",
   dialogLabel = "Navigation",
@@ -1270,23 +1522,35 @@ function SuiteMobileDrawer({
         tabIndex: -1,
         "data-test": panelDataTest,
         className: cn(
-          "suite-scroll-lock relative flex h-full w-[86%] max-w-64 flex-col overflow-hidden bg-ph-surface shadow-xl outline-none motion-safe:transition-transform motion-safe:ease-spring-fast",
+          "suite-scroll-lock relative flex h-full w-[86%] max-w-72 flex-col overflow-hidden bg-ph-surface shadow-xl outline-none motion-safe:transition-transform motion-safe:ease-spring-fast",
           side === "right" && "ml-auto",
           shown ? "translate-x-0" : side === "right" ? "translate-x-full" : "-translate-x-full",
           panelClassName
         ),
         style: { transitionDuration: `${durationMs}ms` },
         children: [
-          showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "flex h-14 shrink-0 items-center justify-end border-b border-ph-border px-3", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-            "button",
+          showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+            "div",
             {
-              type: "button",
-              onClick: onClose,
-              className: "-mr-1.5 inline-flex h-11 w-11 items-center justify-center rounded-lg text-ph-mutedtext transition-colors hover:bg-ph-muted hover:text-ph-ink focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ph-brand",
-              "aria-label": closeLabel,
-              children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_iconoir_react4.Xmark, { className: "h-4 w-4", "aria-hidden": true })
+              className: cn(
+                "flex h-14 shrink-0 items-center border-b border-ph-border px-3",
+                title ? "justify-between" : "justify-end"
+              ),
+              children: [
+                title ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "truncate text-sm font-semibold text-ph-ink", children: title }) : null,
+                /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: onClose,
+                    className: "-mr-1.5 inline-flex h-11 w-11 items-center justify-center rounded-lg text-ph-mutedtext transition-colors hover:bg-ph-muted hover:text-ph-ink focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ph-brand",
+                    "aria-label": closeLabel,
+                    children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_iconoir_react4.Xmark, { className: "h-4 w-4", "aria-hidden": true })
+                  }
+                )
+              ]
             }
-          ) }) : null,
+          ) : null,
           children
         ]
       }
@@ -1343,95 +1607,378 @@ function SuiteMobileHeader({
   );
 }
 
-// src/suite/components/suite-user-menu.tsx
-var import_image2 = __toESM(require("next/image"));
-var import_navigation2 = require("next/navigation");
-var import_iconoir_react6 = require("iconoir-react");
-
-// src/components/ui/DropdownMenu.tsx
-var DropdownPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"));
-
-// src/lib/cn.ts
-function cn2(...parts) {
-  return parts.filter(Boolean).join(" ");
-}
-
-// src/components/ui/DropdownMenu.tsx
+// src/suite/components/suite-layout.tsx
+var import_react6 = require("react");
 var import_jsx_runtime12 = require("react/jsx-runtime");
-function DropdownContent({
+function SuiteBreadcrumbs({ items, className }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("nav", { "aria-label": "Breadcrumb", className, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("ol", { className: "flex min-w-0 items-center gap-1.5", children: items.map((item, index) => {
+    const isLast = index === items.length - 1;
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("li", { className: "flex min-w-0 items-center gap-1.5", children: [
+      index > 0 ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "select-none text-ph-border", "aria-hidden": "true", children: "/" }) : null,
+      item.href && !isLast ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+        "a",
+        {
+          href: item.href,
+          className: "truncate transition hover:text-ph-ink",
+          children: item.label
+        }
+      ) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+        "span",
+        {
+          className: cn(
+            "truncate",
+            isLast ? "font-medium text-ph-ink" : "text-ph-subtle"
+          ),
+          "aria-current": isLast ? "page" : void 0,
+          children: item.label
+        }
+      )
+    ] }, index);
+  }) }) });
+}
+function SuitePage({
   children,
-  align = "start",
-  side = "bottom",
-  sideOffset = 7,
-  alignOffset = 0,
-  collisionPadding = 8,
-  avoidCollisions = true,
-  panelClassName
+  width = "full",
+  inset = true,
+  className,
+  as: Component = "div",
+  dataTest,
+  id,
+  role,
+  "aria-live": ariaLive
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(DropdownPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
-    DropdownPrimitive.Content,
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    Component,
     {
-      className: cn2("ph-dropdown-panel", panelClassName),
-      align,
-      side,
-      sideOffset,
-      alignOffset,
-      collisionPadding,
-      avoidCollisions,
-      sticky: "partial",
-      children: [
-        children,
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(DropdownPrimitive.Arrow, { className: "ph-dropdown-arrow", width: 12, height: 6 })
-      ]
+      id,
+      "data-test": dataTest,
+      "data-width": width,
+      role,
+      "aria-live": ariaLive,
+      className: cn(
+        "suite-page-stage flex w-full min-w-0 flex-col",
+        inset && "suite-page-inset",
+        className
+      ),
+      children
     }
-  ) });
+  );
 }
-function DropdownMenu(_a) {
-  var _b = _a, {
-    trigger,
-    children,
-    align,
-    side,
-    sideOffset,
-    alignOffset,
-    collisionPadding,
-    avoidCollisions,
-    className,
-    panelClassName,
-    "aria-label": ariaLabel,
-    open,
-    defaultOpen,
-    onOpenChange,
-    modal = false,
-    disabled
-  } = _b, props = __objRest(_b, [
-    "trigger",
-    "children",
-    "align",
-    "side",
-    "sideOffset",
-    "alignOffset",
-    "collisionPadding",
-    "avoidCollisions",
-    "className",
-    "panelClassName",
-    "aria-label",
-    "open",
-    "defaultOpen",
-    "onOpenChange",
-    "modal",
-    "disabled"
-  ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", __spreadProps(__spreadValues({ className: cn2("ph-dropdown", className) }, props), { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
-    DropdownPrimitive.Root,
-    {
+function SuitePageHeader({
+  title,
+  description,
+  eyebrow,
+  actions,
+  className,
+  titleClassName,
+  dataTest,
+  /** Optional icon rendered before the title. */
+  icon,
+  /** Use the animated sun/moon icon from the Today page. */
+  todayIcon,
+  todayIconClassName,
+  /** Small badge/pill next to the title (e.g. "Beta", org name). */
+  badge,
+  /** Breadcrumb line rendered above the title. */
+  breadcrumb,
+  /** Stick to the top of the scrollport (desktop page titles). */
+  sticky = false
+}) {
+  const headerRef = (0, import_react6.useRef)(null);
+  const [stuck, setStuck] = (0, import_react6.useState)(false);
+  (0, import_react6.useEffect)(() => {
+    var _a;
+    if (!sticky) return;
+    const el = headerRef.current;
+    if (!el) return;
+    const sentinel = document.createElement("div");
+    sentinel.setAttribute("aria-hidden", "true");
+    sentinel.style.cssText = "position:relative;height:1px;width:100%;margin:0;padding:0;pointer-events:none";
+    (_a = el.parentElement) == null ? void 0 : _a.insertBefore(sentinel, el);
+    const observer = new IntersectionObserver(
+      ([entry]) => {
+        setStuck(!entry.isIntersecting);
+      },
+      { threshold: [1], root: null }
+    );
+    observer.observe(sentinel);
+    return () => {
+      observer.disconnect();
+      sentinel.remove();
+    };
+  }, [sticky]);
+  const resolvedIcon = todayIcon ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    TodayTimeIcon,
+    {
+      className: cn(
+        "h-7 w-7 text-amber-500 sm:h-8 sm:w-8",
+        todayIconClassName
+      )
+    }
+  ) : icon;
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+    "header",
+    {
+      ref: headerRef,
+      "data-test": dataTest,
+      "data-stuck": sticky ? stuck ? "true" : "false" : void 0,
+      className: cn(
+        "flex items-start justify-between gap-4 pb-2 sm:pb-3",
+        // No extra pt here — page inset sets the shared title baseline.
+        // Stuck state adds pad via .suite-page-header-sticky[data-stuck].
+        sticky && "suite-page-header-sticky",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "min-w-0 flex-1", children: [
+          eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "mb-0.5 flex min-w-0 items-center gap-1.5 text-xs text-ph-subtle", children: eyebrow }) : null,
+          breadcrumb ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "mb-0.5 flex min-w-0 items-center gap-1.5 text-xs text-ph-subtle", children: breadcrumb }) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex min-w-0 items-center gap-3", children: [
+            resolvedIcon ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+              "div",
+              {
+                className: "hidden shrink-0 sm:flex sm:items-center [&_svg]:h-7 [&_svg]:w-7 sm:[&_svg]:h-8 sm:[&_svg]:w-8",
+                "aria-hidden": "true",
+                children: resolvedIcon
+              }
+            ) : null,
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex min-w-0 flex-wrap items-center gap-x-2 gap-y-1", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+                "h1",
+                {
+                  className: cn(
+                    "font-display text-[1.625rem] font-bold leading-none tracking-tight text-ph-ink sm:text-[2.25rem]",
+                    titleClassName
+                  ),
+                  children: title
+                }
+              ),
+              badge ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "rounded-md bg-ph-muted px-2 py-0.5 text-[11px] font-semibold uppercase tracking-wide text-ph-subtle", children: badge }) : null
+            ] })
+          ] }),
+          description ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+            "div",
+            {
+              className: cn(
+                "mt-1.5 max-w-2xl text-pretty text-sm leading-5 text-ph-subtle",
+                resolvedIcon && "sm:pl-11"
+              ),
+              children: description
+            }
+          ) : null
+        ] }),
+        actions ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "flex shrink-0 items-center gap-2 self-center", children: actions }) : null
+      ]
+    }
+  );
+}
+function SuiteToolbar({
+  children,
+  className,
+  label = "Page tools",
+  dataTest
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    "div",
+    {
+      role: "toolbar",
+      "aria-label": label,
+      "data-test": dataTest,
+      className: cn("flex min-w-0 flex-wrap items-center gap-2", className),
+      children
+    }
+  );
+}
+function SuiteTabList({
+  children,
+  className,
+  label,
+  dataTest
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    "nav",
+    {
+      "aria-label": label,
+      "data-test": dataTest,
+      className: cn(
+        "flex min-w-0 flex-wrap gap-2 [&_a]:min-h-[48px] [&_button]:min-h-[48px] sm:[&_a]:min-h-[44px] sm:[&_button]:min-h-[44px]",
+        className
+      ),
+      children
+    }
+  );
+}
+function SuiteSectionHeader({
+  title,
+  description,
+  action,
+  className
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+    "div",
+    {
+      className: cn(
+        "flex min-w-0 flex-col gap-4 sm:flex-row sm:items-end sm:justify-between",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "min-w-0", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("h2", { className: "font-display text-balance text-lg font-semibold tracking-tight text-ph-ink sm:text-xl", children: title }),
+          description ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "mt-1 max-w-2xl text-pretty text-sm leading-5 text-ph-subtle", children: description }) : null
+        ] }),
+        action ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "flex min-h-[44px] shrink-0 items-center", children: action }) : null
+      ]
+    }
+  );
+}
+
+// src/suite/components/suite-settings-layout.tsx
+var import_jsx_runtime13 = require("react/jsx-runtime");
+function SuiteSettingsLayout({
+  children,
+  sidebar,
+  mobileNav,
+  loading,
+  title = "Settings",
+  description,
+  header,
+  dataTest = "settings-page",
+  headerDataTest = "settings-page-header",
+  className,
+  contentClassName
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+    SuitePage,
+    {
+      dataTest,
+      className: cn("flex h-full flex-col overflow-hidden", className),
+      children: [
+        header != null ? header : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+          SuitePageHeader,
+          {
+            sticky: true,
+            dataTest: headerDataTest,
+            title,
+            description
+          }
+        ),
+        loading != null ? loading : /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "suite-page-body mt-6 flex min-h-0 flex-1 flex-col", children: [
+          mobileNav ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "sticky top-0 z-20 mb-2 shrink-0 bg-ph-canvas/95 backdrop-blur lg:hidden", children: mobileNav }) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex min-h-0 flex-1 flex-col gap-6 lg:flex-row lg:gap-8", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+              "aside",
+              {
+                "aria-label": "Settings",
+                className: "hidden w-56 shrink-0 bg-transparent lg:block lg:self-stretch lg:overflow-y-auto lg:overscroll-contain",
+                children: sidebar
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+              "div",
+              {
+                className: cn(
+                  "min-h-0 min-w-0 flex-1 overflow-y-auto overscroll-contain pb-6",
+                  contentClassName
+                ),
+                children
+              }
+            )
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/suite/components/suite-user-menu.tsx
+var import_image2 = __toESM(require("next/image"));
+var import_navigation2 = require("next/navigation");
+var import_iconoir_react6 = require("iconoir-react");
+
+// src/components/ui/DropdownMenu.tsx
+var DropdownPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"));
+
+// src/lib/cn.ts
+function cn2(...parts) {
+  return parts.filter(Boolean).join(" ");
+}
+
+// src/components/ui/DropdownMenu.tsx
+var import_jsx_runtime14 = require("react/jsx-runtime");
+function DropdownContent({
+  children,
+  align = "start",
+  side = "bottom",
+  sideOffset = 7,
+  alignOffset = 0,
+  collisionPadding = 8,
+  avoidCollisions = true,
+  panelClassName
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DropdownPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+    DropdownPrimitive.Content,
+    {
+      className: cn2("ph-dropdown-panel", panelClassName),
+      align,
+      side,
+      sideOffset,
+      alignOffset,
+      collisionPadding,
+      avoidCollisions,
+      sticky: "partial",
+      children: [
+        children,
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DropdownPrimitive.Arrow, { className: "ph-dropdown-arrow", width: 12, height: 6 })
+      ]
+    }
+  ) });
+}
+function DropdownMenu(_a) {
+  var _b = _a, {
+    trigger,
+    children,
+    align,
+    side,
+    sideOffset,
+    alignOffset,
+    collisionPadding,
+    avoidCollisions,
+    className,
+    panelClassName,
+    "aria-label": ariaLabel,
+    open,
+    defaultOpen,
+    onOpenChange,
+    modal = false,
+    disabled
+  } = _b, props = __objRest(_b, [
+    "trigger",
+    "children",
+    "align",
+    "side",
+    "sideOffset",
+    "alignOffset",
+    "collisionPadding",
+    "avoidCollisions",
+    "className",
+    "panelClassName",
+    "aria-label",
+    "open",
+    "defaultOpen",
+    "onOpenChange",
+    "modal",
+    "disabled"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", __spreadProps(__spreadValues({ className: cn2("ph-dropdown", className) }, props), { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+    DropdownPrimitive.Root,
+    {
       open,
       defaultOpen,
       onOpenChange,
       modal,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(DropdownPrimitive.Trigger, { asChild: true, disabled, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("button", { type: "button", className: "ph-dropdown-trigger", "aria-label": ariaLabel, children: trigger }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DropdownPrimitive.Trigger, { asChild: true, disabled, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("button", { type: "button", className: "ph-dropdown-trigger", "aria-label": ariaLabel, children: trigger }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
           DropdownContent,
           {
             align,
@@ -1450,7 +1997,7 @@ function DropdownMenu(_a) {
 }
 function DropdownItem(_a) {
   var _b = _a, { className, children, disabled } = _b, props = __objRest(_b, ["className", "children", "disabled"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(DropdownPrimitive.Item, { asChild: true, disabled, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DropdownPrimitive.Item, { asChild: true, disabled, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
     "button",
     __spreadProps(__spreadValues({
       type: "button",
@@ -1463,7 +2010,7 @@ function DropdownItem(_a) {
 }
 
 // src/suite/components/suite-user-menu.tsx
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 function computeInitials(name, email) {
   const source = (name || email || "?").trim();
   return source.split(/[\s@]+/).filter(Boolean).slice(0, 2).map((part) => part[0]).join("").toUpperCase();
@@ -1480,7 +2027,7 @@ function SuiteUserMenu({
 }) {
   const router = (0, import_navigation2.useRouter)();
   const initials = fallbackInitials != null ? fallbackInitials : computeInitials(name, email);
-  const avatar = /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "inline-flex h-11 w-11 items-center justify-center rounded-full transition-colors hover:bg-ph-muted", children: image ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+  const avatar = /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "inline-flex h-11 w-11 items-center justify-center rounded-full transition-colors hover:bg-ph-muted", children: image ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
     import_image2.default,
     {
       src: image,
@@ -1490,8 +2037,8 @@ function SuiteUserMenu({
       className: "h-8 w-8 rounded-full object-cover",
       unoptimized: true
     }
-  ) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "flex h-8 w-8 items-center justify-center rounded-full bg-ph-muted text-sm font-semibold text-ph-brand", children: initials }) });
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+  ) : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "flex h-8 w-8 items-center justify-center rounded-full bg-ph-muted text-sm font-semibold text-ph-brand", children: initials }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
     DropdownMenu,
     {
       trigger: avatar,
@@ -1504,29 +2051,29 @@ function SuiteUserMenu({
       className,
       "data-test": dataTest,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "px-2 py-1.5", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "truncate text-sm font-medium text-ph-ink", children: name || email || "Account" }),
-          email ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "truncate text-xs text-ph-mutedtext", children: email }) : null
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "px-2 py-1.5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { className: "truncate text-sm font-medium text-ph-ink", children: name || email || "Account" }),
+          email ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { className: "truncate text-xs text-ph-mutedtext", children: email }) : null
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "my-1 border-t border-ph-border" }),
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "my-1 border-t border-ph-border" }),
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
           DropdownItem,
           {
             "data-test": `${dataTest}-settings`,
             onClick: () => router.push(settingsHref),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_iconoir_react6.Settings, { className: "h-4 w-4 text-ph-mutedtext", "aria-hidden": true }),
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_iconoir_react6.Settings, { className: "h-4 w-4 text-ph-mutedtext", "aria-hidden": true }),
               "Profile settings"
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
           DropdownItem,
           {
             "data-test": `${dataTest}-sign-out`,
             onClick: onSignOut,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_iconoir_react6.LogOut, { className: "h-4 w-4 text-ph-mutedtext", "aria-hidden": true }),
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_iconoir_react6.LogOut, { className: "h-4 w-4 text-ph-mutedtext", "aria-hidden": true }),
               "Sign out"
             ]
           }
@@ -1538,7 +2085,7 @@ function SuiteUserMenu({
 
 // src/suite/components/suite-bottom-nav.tsx
 var import_link = __toESM(require("next/link"));
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_jsx_runtime16 = require("react/jsx-runtime");
 function SuiteBottomNav({
   items,
   ariaLabel = "Primary navigation",
@@ -1551,8 +2098,8 @@ function SuiteBottomNav({
     );
   }
   const activeIndex = items.findIndex((item) => item.active);
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
       "div",
       {
         "aria-hidden": true,
@@ -1560,7 +2107,7 @@ function SuiteBottomNav({
         style: { height: "calc(60px + env(safe-area-inset-bottom))" }
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
       "nav",
       {
         "aria-label": ariaLabel,
@@ -1575,12 +2122,12 @@ function SuiteBottomNav({
           "--suite-nav-active": activeIndex >= 0 ? activeIndex : 0
         },
         children: [
-          activeIndex >= 0 ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { "aria-hidden": true, className: "suite-bottom-nav__indicator" }) : null,
+          activeIndex >= 0 ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { "aria-hidden": true, className: "suite-bottom-nav__indicator" }) : null,
           items.map((item) => {
             var _a;
             const Icon = item.icon;
             const active = Boolean(item.active);
-            return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+            return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
               import_link.default,
               {
                 href: item.href,
@@ -1591,14 +2138,14 @@ function SuiteBottomNav({
                   active && "font-semibold text-ph-brand"
                 ),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
                     "span",
                     {
                       className: cn(
                         "suite-bottom-nav__icon relative z-10 inline-flex items-center justify-center",
                         active && "suite-bottom-nav__icon--active"
                       ),
-                      children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+                      children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
                         Icon,
                         {
                           className: "h-6 w-6",
@@ -1608,7 +2155,7 @@ function SuiteBottomNav({
                       )
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "relative z-10 max-w-full truncate", children: item.label })
+                  /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "relative z-10 max-w-full truncate", children: item.label })
                 ]
               },
               item.href
@@ -1620,117 +2167,39 @@ function SuiteBottomNav({
   ] });
 }
 
-// src/suite/lib/apps.ts
-var SUITE_APPS2 = [
-  {
-    slug: "shellstack",
-    name: "ShellStack",
-    description: "Organisation and billing",
-    icon: "/icon-shellstack.svg",
-    landing: "/home",
-    baseUrlEnv: "NEXT_PUBLIC_SHELLSTACK_URL",
-    baseUrlFallback: "http://localhost:3002"
-  },
-  {
-    slug: "tides",
-    name: "Tides",
-    description: "Projects and tasks",
-    icon: "/tides-icon.svg",
-    landing: "/today",
-    baseUrlEnv: "NEXT_PUBLIC_TIDES_URL",
-    baseUrlFallback: "http://localhost:3001"
-  },
-  {
-    slug: "turtletime",
-    name: "TurtleTime",
-    description: "Time tracking",
-    icon: "/turtletime-icon.svg",
-    landing: "/tracker",
-    baseUrlEnv: "NEXT_PUBLIC_TURTLETIME_URL",
-    baseUrlFallback: "http://localhost:3000"
-  },
-  {
-    slug: "kraken",
-    name: "Kraken",
-    description: "Documents and knowledge",
-    icon: "/kraken-icon.svg",
-    landing: "/today",
-    baseUrlEnv: "NEXT_PUBLIC_KRAKEN_URL",
-    baseUrlFallback: "http://localhost:3003"
-  }
-];
-var SUITE_APP_MAP = Object.fromEntries(SUITE_APPS2.map((app) => [app.slug, app]));
-function suiteAppBaseUrl(slug) {
-  const def = SUITE_APP_MAP[slug];
-  const fromEnv = typeof process !== "undefined" ? process.env[def.baseUrlEnv] : void 0;
-  return (fromEnv || def.baseUrlFallback).replace(/\/$/, "");
-}
-
 // src/suite/components/today-calibrating.tsx
 var import_iconoir_react7 = require("iconoir-react");
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 function TodayCalibrating({
   onRetry,
   retrying = false,
   className,
   spinner: Spinner,
-  variant = "ring",
+  variant: _variant = "ring",
   retrySpinnerClassName = "text-ph-brand"
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+  void _variant;
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
     "div",
     {
       className: cn(
-        "relative flex min-h-[14rem] flex-col items-center justify-center overflow-hidden rounded-2xl border border-ph-border bg-ph-surface px-5 py-8 text-center shadow-sm",
+        "suite-auth-handoff relative flex min-h-[14rem] flex-col items-center justify-center overflow-hidden rounded-2xl border border-ph-border bg-ph-surface px-5 py-8 text-center shadow-sm",
         className
       ),
       "data-test": "today-calibrating",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
           "div",
           {
-            className: "pointer-events-none absolute inset-0 bg-[radial-gradient(circle_at_50%_35%,rgba(251,191,36,0.12),transparent_55%)]",
+            className: "pointer-events-none absolute inset-0 bg-[radial-gradient(circle_at_50%_35%,rgba(251,191,36,0.1),transparent_55%)]",
             "aria-hidden": true
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "relative mb-6 flex h-24 w-24 items-center justify-center", children: [
-          variant === "ring" ? /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_jsx_runtime15.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-              Spinner,
-              {
-                size: "lg",
-                className: "absolute inset-0 m-auto opacity-40",
-                label: "Loading today"
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-              "span",
-              {
-                className: "bg-ph-muted/30 absolute inset-2 animate-ping rounded-full",
-                "aria-hidden": true
-              }
-            )
-          ] }) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "relative flex h-14 w-14 items-center justify-center rounded-2xl border border-ph-border bg-ph-surface text-ph-ink shadow-sm", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-            import_iconoir_react7.SunLight,
-            {
-              className: cn("h-9 w-9", variant === "pulse" && "animate-pulse"),
-              strokeWidth: 2,
-              "aria-hidden": true
-            }
-          ) })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("h2", { className: "relative text-base font-semibold tracking-tight text-ph-ink sm:text-lg md:text-xl", children: "Calibrating your day" }),
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { className: "relative mt-1.5 max-w-sm text-sm sm:text-[15px] leading-relaxed text-ph-subtle", children: "Pulling together tasks, time and updates from your workspace\u2026" }),
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "relative mt-5 flex gap-1.5", "aria-hidden": true, children: [0, 1, 2, 3, 4].map((i) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-          "span",
-          {
-            className: "h-1.5 w-5 animate-pulse rounded-full bg-ph-muted",
-            style: { animationDelay: `${i * 120}ms` }
-          },
-          i
-        )) }),
-        onRetry ? /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "relative mb-5 flex h-14 w-14 items-center justify-center rounded-2xl border border-ph-border bg-ph-surface text-ph-ink shadow-sm", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_iconoir_react7.SunLight, { className: "h-8 w-8", strokeWidth: 2, "aria-hidden": true }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("h2", { className: "relative text-base font-semibold tracking-tight text-ph-ink sm:text-lg md:text-xl", children: "Calibrating your day" }),
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("p", { className: "relative mt-1.5 max-w-sm text-sm sm:text-[15px] leading-relaxed text-ph-subtle", children: "Pulling together tasks, time and updates from your workspace\u2026" }),
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "relative mt-5 flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Spinner, { size: "sm", className: "opacity-70", label: "Loading today" }) }),
+        onRetry ? /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
           "button",
           {
             type: "button",
@@ -1738,7 +2207,7 @@ function TodayCalibrating({
             disabled: retrying,
             className: "relative mt-6 inline-flex items-center gap-2 rounded-xl border border-ph-border bg-ph-canvas px-4 py-2 text-sm font-medium text-ph-ink transition hover:bg-ph-muted disabled:opacity-60",
             children: [
-              retrying ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Spinner, { size: "sm", className: retrySpinnerClassName }) : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_iconoir_react7.Refresh, { className: "h-4 w-4", "aria-hidden": true }),
+              retrying ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Spinner, { size: "sm", className: retrySpinnerClassName }) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_iconoir_react7.Refresh, { className: "h-4 w-4", "aria-hidden": true }),
               "Try again"
             ]
           }
@@ -1749,9 +2218,9 @@ function TodayCalibrating({
 }
 
 // src/suite/components/theme-provider.tsx
-var import_react6 = require("react");
-var import_jsx_runtime16 = require("react/jsx-runtime");
-var SuiteThemeContext = (0, import_react6.createContext)(null);
+var import_react7 = require("react");
+var import_jsx_runtime18 = require("react/jsx-runtime");
+var SuiteThemeContext = (0, import_react7.createContext)(null);
 function systemTheme(fallback) {
   if (typeof window === "undefined") return fallback;
   return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
@@ -1788,7 +2257,7 @@ function SuiteThemeProvider({
   config,
   children
 }) {
-  const [state, setState] = (0, import_react6.useState)(() => {
+  const [state, setState] = (0, import_react7.useState)(() => {
     const theme2 = readStoredTheme(config.storageKey);
     if (typeof document === "undefined") {
       return { theme: theme2, resolvedTheme: config.fallbackTheme };
@@ -1798,7 +2267,7 @@ function SuiteThemeProvider({
     return { theme: theme2, resolvedTheme: resolvedTheme2 };
   });
   const { theme, resolvedTheme } = state;
-  (0, import_react6.useEffect)(() => {
+  (0, import_react7.useEffect)(() => {
     if (theme !== "system") return;
     const media = window.matchMedia("(prefers-color-scheme: dark)");
     const update = () => {
@@ -1808,7 +2277,7 @@ function SuiteThemeProvider({
     media.addEventListener("change", update);
     return () => media.removeEventListener("change", update);
   }, [theme, config]);
-  const setTheme = (0, import_react6.useCallback)(
+  const setTheme = (0, import_react7.useCallback)(
     (next) => {
       const resolved = applyTheme(next, config);
       setState({ theme: next, resolvedTheme: resolved });
@@ -1816,7 +2285,7 @@ function SuiteThemeProvider({
     },
     [config]
   );
-  const toggleTheme = (0, import_react6.useCallback)(() => {
+  const toggleTheme = (0, import_react7.useCallback)(() => {
     setState((prev) => {
       const next = resolveTheme(prev.theme, config.fallbackTheme) === "dark" ? "light" : "dark";
       const resolved = applyTheme(next, config);
@@ -1824,52 +2293,119 @@ function SuiteThemeProvider({
       return { theme: next, resolvedTheme: resolved };
     });
   }, [config]);
-  const value = (0, import_react6.useMemo)(
+  const value = (0, import_react7.useMemo)(
     () => ({ theme, resolvedTheme, setTheme, toggleTheme }),
     [theme, resolvedTheme, setTheme, toggleTheme]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(SuiteThemeContext.Provider, { value, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SuiteThemeContext.Provider, { value, children });
 }
 function useSuiteTheme() {
-  const ctx = (0, import_react6.useContext)(SuiteThemeContext);
+  const ctx = (0, import_react7.useContext)(SuiteThemeContext);
   if (!ctx) throw new Error("useTheme must be used within ThemeProvider");
   return ctx;
 }
 
 // src/suite/components/ai-panel.tsx
-var import_react7 = require("react");
+var import_react8 = require("react");
 var import_iconoir_react8 = require("iconoir-react");
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("react/jsx-runtime");
+var SUITE_OPEN_ASK_AI_EVENT = "shellstack:open-ask-ai";
+function openSuiteAskAi(detail) {
+  if (typeof window === "undefined") return;
+  window.dispatchEvent(
+    new CustomEvent(SUITE_OPEN_ASK_AI_EVENT, {
+      detail: detail != null ? detail : {}
+    })
+  );
+}
 function SuiteAiPanel({
-  presets,
-  emptyState,
-  fetchStatus,
-  complete,
+  presets = [],
+  emptyState = "Ask anything about your workspace, or look something up online.",
+  title = "Ask AI",
+  fetchChat,
+  sendMessage,
+  clearChat,
   brandIcon: BrandIcon,
-  spinner: Spinner
+  spinner: Spinner,
+  hideLauncher = false
 }) {
-  const [open, setOpen] = (0, import_react7.useState)(false);
-  const [prompt, setPrompt] = (0, import_react7.useState)("");
-  const [loading, setLoading] = (0, import_react7.useState)(false);
-  const [answer, setAnswer] = (0, import_react7.useState)("");
-  const [error, setError] = (0, import_react7.useState)("");
-  const [copied, setCopied] = (0, import_react7.useState)(false);
+  const [open, setOpen] = (0, import_react8.useState)(false);
+  const [prompt, setPrompt] = (0, import_react8.useState)("");
+  const [messages, setMessages] = (0, import_react8.useState)([]);
+  const [loading, setLoading] = (0, import_react8.useState)(false);
+  const [hydrating, setHydrating] = (0, import_react8.useState)(false);
+  const [error, setError] = (0, import_react8.useState)("");
+  const [copiedId, setCopiedId] = (0, import_react8.useState)(null);
+  const scrollerRef = (0, import_react8.useRef)(null);
+  const pendingPromptRef = (0, import_react8.useRef)(null);
+  const scrollToBottom = (0, import_react8.useCallback)(() => {
+    const el = scrollerRef.current;
+    if (!el) return;
+    el.scrollTop = el.scrollHeight;
+  }, []);
+  const hydrate = (0, import_react8.useCallback)(async () => {
+    var _a;
+    setHydrating(true);
+    setError("");
+    try {
+      const data = await fetchChat();
+      setMessages((_a = data.messages) != null ? _a : []);
+      if (!data.configured) {
+        setError("ShellStack AI is not configured for this workspace yet.");
+      }
+    } catch (err) {
+      setError(
+        err instanceof Error ? err.message : "Could not load your Ask AI chat."
+      );
+    } finally {
+      setHydrating(false);
+    }
+  }, [fetchChat]);
+  (0, import_react8.useEffect)(() => {
+    function onOpen(event) {
+      var _a;
+      const detail = event.detail;
+      setOpen(true);
+      if ((_a = detail == null ? void 0 : detail.prompt) == null ? void 0 : _a.trim()) {
+        pendingPromptRef.current = detail.prompt.trim();
+        setPrompt(detail.prompt.trim());
+      }
+    }
+    window.addEventListener(SUITE_OPEN_ASK_AI_EVENT, onOpen);
+    return () => window.removeEventListener(SUITE_OPEN_ASK_AI_EVENT, onOpen);
+  }, []);
+  (0, import_react8.useEffect)(() => {
+    if (!open) return;
+    void hydrate().then(() => {
+      const pending = pendingPromptRef.current;
+      pendingPromptRef.current = null;
+      if (pending) {
+        setPrompt(pending);
+      }
+    });
+  }, [open, hydrate]);
+  (0, import_react8.useEffect)(() => {
+    if (open) scrollToBottom();
+  }, [messages, loading, open, scrollToBottom]);
   async function ask(text) {
+    var _a;
     const trimmed = text.trim();
     if (!trimmed || loading) return;
     setLoading(true);
     setError("");
-    setAnswer("");
-    setCopied(false);
+    setPrompt("");
+    setMessages((prev) => [...prev, { role: "user", content: trimmed }]);
     try {
-      const status = await fetchStatus();
-      if (!status.configured) {
-        setError("ShellStack AI is not configured for this workspace yet.");
-        return;
-      }
-      const result = await complete({ prompt: trimmed });
-      setAnswer(result.text);
+      const result = await sendMessage({ prompt: trimmed });
+      setMessages((_a = result.messages) != null ? _a : []);
     } catch (err) {
+      setMessages(
+        (prev) => {
+          var _a2, _b;
+          return ((_a2 = prev[prev.length - 1]) == null ? void 0 : _a2.role) === "user" && ((_b = prev[prev.length - 1]) == null ? void 0 : _b.content) === trimmed ? prev.slice(0, -1) : prev;
+        }
+      );
+      setPrompt(trimmed);
       setError(
         err instanceof Error ? err.message : "The AI request failed. Try again."
       );
@@ -1877,133 +2413,278 @@ function SuiteAiPanel({
       setLoading(false);
     }
   }
-  async function copyAnswer() {
-    if (!answer) return;
+  async function handleClear() {
+    if (loading) return;
     try {
-      await navigator.clipboard.writeText(answer);
-      setCopied(true);
-      window.setTimeout(() => setCopied(false), 1500);
+      await clearChat();
+      setMessages([]);
+      setError("");
+    } catch (err) {
+      setError(
+        err instanceof Error ? err.message : "Could not clear this chat."
+      );
+    }
+  }
+  async function copyMessage(index, content) {
+    try {
+      await navigator.clipboard.writeText(content);
+      setCopiedId(index);
+      window.setTimeout(() => setCopiedId(null), 1500);
     } catch (e) {
     }
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+  const Icon = BrandIcon != null ? BrandIcon : import_iconoir_react8.Sparks;
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
+    !hideLauncher ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
       "button",
       {
         type: "button",
         "data-test": "ai-panel-launcher",
         onClick: () => setOpen(true),
         className: "fixed bottom-5 right-5 z-30 flex items-center gap-2 rounded-full border border-ph-border bg-ph-surface px-4 py-2.5 text-sm font-medium text-ph-ink shadow-ph hover:bg-ph-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ph-brand",
-        "aria-label": "Open ShellStack AI",
+        "aria-label": "Open Ask AI",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(BrandIcon, { className: "h-4 w-4 text-ph-brand" }),
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Icon, { className: "h-4 w-4 text-ph-brand" }),
           "Ask AI"
         ]
       }
-    ),
-    open && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "fixed inset-0 z-40", role: "dialog", "aria-modal": "true", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    ) : null,
+    open ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "fixed inset-0 z-40", role: "dialog", "aria-modal": "true", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
         "button",
         {
           type: "button",
           className: "absolute inset-0 bg-black/25",
           onClick: () => setOpen(false),
-          "aria-label": "Close AI panel"
+          "aria-label": "Close Ask AI"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("aside", { className: "absolute inset-y-0 right-0 flex w-full max-w-md flex-col border-l border-ph-border bg-ph-surface shadow-2xl", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center justify-between border-b border-ph-border px-4 py-3", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(BrandIcon, { className: "h-4 w-4 text-ph-brand" }),
-            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "text-sm font-semibold text-ph-ink", children: "ShellStack AI" })
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-            "button",
-            {
-              type: "button",
-              onClick: () => setOpen(false),
-              className: "rounded p-1 hover:bg-ph-muted",
-              "aria-label": "Close",
-              children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_iconoir_react8.Xmark, { className: "h-4 w-4" })
-            }
-          )
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex flex-wrap gap-1.5 border-b border-ph-border px-4 py-2", children: presets.map((preset) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-          "button",
-          {
-            type: "button",
-            onClick: () => {
-              setPrompt(preset.prompt);
-              void ask(preset.prompt);
-            },
-            disabled: loading,
-            className: "rounded-md border border-ph-border px-2 py-1 text-xs text-ph-ink hover:bg-ph-muted disabled:opacity-50",
-            children: preset.label
-          },
-          preset.label
-        )) }),
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex-1 space-y-3 overflow-y-auto p-4", children: [
-          error && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("p", { className: "bg-ph-danger/10 rounded-lg px-3 py-2 text-sm text-ph-danger", children: error }),
-          loading && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center gap-2 text-sm text-ph-mutedtext", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Spinner, { className: "h-4 w-4 animate-spin" }),
-            "Thinking\u2026"
-          ] }),
-          answer && !loading && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "rounded-lg bg-ph-muted px-3 py-2 text-sm text-ph-ink", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("p", { className: "whitespace-pre-wrap", children: answer }),
-            /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+        "aside",
+        {
+          className: "absolute inset-y-0 right-0 flex w-full max-w-md flex-col border-l border-ph-border bg-ph-surface shadow-2xl",
+          "data-test": "suite-ask-ai-panel",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center justify-between border-b border-ph-border px-4 py-3", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "min-w-0", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Icon, { className: "h-4 w-4 shrink-0 text-ph-brand" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "text-sm font-semibold text-ph-ink", children: title })
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "mt-0.5 text-[11px] text-ph-mutedtext", children: "Shared across your suite \xB7 same chat in every app" })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center gap-1", children: [
+                messages.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => void handleClear(),
+                    disabled: loading,
+                    className: "rounded-md px-2 py-1 text-xs text-ph-mutedtext hover:bg-ph-muted hover:text-ph-ink disabled:opacity-50",
+                    "data-test": "ask-ai-clear",
+                    children: "Clear"
+                  }
+                ) : null,
+                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => setOpen(false),
+                    className: "rounded p-1 hover:bg-ph-muted",
+                    "aria-label": "Close",
+                    children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_iconoir_react8.Xmark, { className: "h-4 w-4" })
+                  }
+                )
+              ] })
+            ] }),
+            presets.length > 0 && messages.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "flex flex-wrap gap-1.5 border-b border-ph-border px-4 py-2", children: presets.map((preset) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
               "button",
               {
                 type: "button",
-                onClick: () => void copyAnswer(),
-                className: "mt-2 inline-flex items-center gap-1 text-xs text-ph-mutedtext hover:text-ph-ink",
+                onClick: () => void ask(preset.prompt),
+                disabled: loading || hydrating,
+                className: "rounded-full border border-ph-border px-2.5 py-1 text-xs text-ph-ink hover:bg-ph-muted disabled:opacity-50",
+                children: preset.label
+              },
+              preset.label
+            )) }) : null,
+            /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+              "div",
+              {
+                ref: scrollerRef,
+                className: "flex-1 space-y-3 overflow-y-auto p-4",
                 children: [
-                  copied ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_iconoir_react8.Check, { className: "h-3 w-3" }) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_iconoir_react8.Copy, { className: "h-3 w-3" }),
-                  copied ? "Copied" : "Copy"
+                  error ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "bg-ph-danger/10 rounded-lg px-3 py-2 text-sm text-ph-danger", children: error }) : null,
+                  hydrating && messages.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center gap-2 text-sm text-ph-mutedtext", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Spinner, { className: "h-4 w-4 animate-spin" }),
+                    "Loading chat\u2026"
+                  ] }) : null,
+                  !hydrating && messages.length === 0 && !error ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "mt-10 px-2 text-center", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "font-display text-base font-semibold text-ph-ink", children: "How can I help?" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "mt-2 text-sm leading-relaxed text-ph-subtle", children: emptyState })
+                  ] }) : null,
+                  messages.map((message, index) => {
+                    const isUser = message.role === "user";
+                    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+                      "div",
+                      {
+                        className: isUser ? "ml-8 rounded-2xl bg-ph-brand/10 px-3.5 py-2.5 text-sm text-ph-ink" : "mr-4 rounded-2xl bg-ph-muted px-3.5 py-2.5 text-sm text-ph-ink",
+                        "data-test": isUser ? "ask-ai-user" : "ask-ai-assistant",
+                        children: [
+                          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { className: "whitespace-pre-wrap", children: message.content }),
+                          !isUser ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+                            "button",
+                            {
+                              type: "button",
+                              onClick: () => void copyMessage(index, message.content),
+                              className: "mt-2 inline-flex items-center gap-1 text-xs text-ph-mutedtext hover:text-ph-ink",
+                              children: [
+                                copiedId === index ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_iconoir_react8.Check, { className: "h-3 w-3" }) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_iconoir_react8.Copy, { className: "h-3 w-3" }),
+                                copiedId === index ? "Copied" : "Copy"
+                              ]
+                            }
+                          ) : null
+                        ]
+                      },
+                      `${message.role}-${index}-${message.content.slice(0, 24)}`
+                    );
+                  }),
+                  loading ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex items-center gap-2 text-sm text-ph-mutedtext", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Spinner, { className: "h-4 w-4 animate-spin" }),
+                    "Thinking\u2026"
+                  ] }) : null
                 ]
               }
-            )
-          ] }),
-          !answer && !loading && !error && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("p", { className: "mt-8 text-center text-xs text-ph-mutedtext", children: emptyState })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "border-t border-ph-border p-3", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-            "textarea",
-            {
-              value: prompt,
-              onChange: (e) => setPrompt(e.target.value),
-              onKeyDown: (e) => {
-                if (e.key === "Enter" && !e.shiftKey) {
-                  e.preventDefault();
-                  void ask(prompt);
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "border-t border-ph-border p-3", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex gap-2", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+                "textarea",
+                {
+                  value: prompt,
+                  onChange: (e) => setPrompt(e.target.value),
+                  onKeyDown: (e) => {
+                    if (e.key === "Enter" && !e.shiftKey) {
+                      e.preventDefault();
+                      void ask(prompt);
+                    }
+                  },
+                  placeholder: "Ask anything\u2026",
+                  rows: 2,
+                  disabled: loading,
+                  "data-test": "ask-ai-input",
+                  className: "flex-1 resize-none rounded-xl border border-ph-border bg-ph-canvas p-2.5 text-sm text-ph-ink outline-none focus:ring-1 focus:ring-ph-brand"
                 }
-              },
-              placeholder: "Ask anything\u2026",
-              rows: 2,
-              disabled: loading,
-              className: "flex-1 resize-none rounded-lg border border-ph-border bg-ph-canvas p-2 text-sm text-ph-ink outline-none focus:ring-1 focus:ring-ph-brand"
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-            "button",
-            {
-              type: "button",
-              onClick: () => void ask(prompt),
-              disabled: loading || !prompt.trim(),
-              className: "self-end rounded-lg bg-ph-brand px-3 py-2 text-sm font-medium text-white disabled:opacity-50",
-              children: "Ask"
-            }
-          )
-        ] }) })
-      ] })
-    ] })
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => void ask(prompt),
+                  disabled: loading || !prompt.trim(),
+                  "data-test": "ask-ai-send",
+                  className: "self-end rounded-xl bg-ph-brand px-3.5 py-2 text-sm font-medium text-white disabled:opacity-50",
+                  children: "Ask"
+                }
+              )
+            ] }) })
+          ]
+        }
+      )
+    ] }) : null
   ] });
 }
 
+// src/suite/lib/use-sidebar-width.ts
+var import_react9 = require("react");
+var SIDEBAR_RAIL_WIDTH = 56;
+var SIDEBAR_COLLAPSE_THRESHOLD = 80;
+var SIDEBAR_MIN_EXPANDED_WIDTH = 180;
+var SIDEBAR_MAX_WIDTH = 320;
+var SIDEBAR_DEFAULT_WIDTH = 320;
+function clampWidth(width) {
+  return Math.min(SIDEBAR_MAX_WIDTH, Math.max(SIDEBAR_RAIL_WIDTH, width));
+}
+function snapWidth(width) {
+  if (width <= SIDEBAR_COLLAPSE_THRESHOLD) return SIDEBAR_RAIL_WIDTH;
+  if (width < SIDEBAR_MIN_EXPANDED_WIDTH) return SIDEBAR_MIN_EXPANDED_WIDTH;
+  return Math.min(SIDEBAR_MAX_WIDTH, width);
+}
+function useSidebarWidth(storageKey) {
+  const [width, setWidth] = (0, import_react9.useState)(SIDEBAR_DEFAULT_WIDTH);
+  const [narrowViewport, setNarrowViewport] = (0, import_react9.useState)(false);
+  const collapsed = narrowViewport || width <= SIDEBAR_COLLAPSE_THRESHOLD;
+  (0, import_react9.useEffect)(() => {
+    let stored = null;
+    try {
+      stored = localStorage.getItem(storageKey);
+    } catch (e) {
+    }
+    if (!stored) return;
+    const parsed = Number.parseInt(stored, 10);
+    if (!Number.isNaN(parsed)) {
+      queueMicrotask(() => setWidth(snapWidth(clampWidth(parsed))));
+    }
+  }, [storageKey]);
+  (0, import_react9.useEffect)(() => {
+    const media = window.matchMedia("(max-width: 639px)");
+    const sync = () => setNarrowViewport(media.matches);
+    sync();
+    media.addEventListener("change", sync);
+    return () => media.removeEventListener("change", sync);
+  }, []);
+  const persist = (0, import_react9.useCallback)(
+    (value) => {
+      try {
+        localStorage.setItem(storageKey, String(value));
+      } catch (e) {
+      }
+    },
+    [storageKey]
+  );
+  const setCollapsed = (0, import_react9.useCallback)(
+    (value) => {
+      setWidth((current) => {
+        const next = value ? SIDEBAR_RAIL_WIDTH : current <= SIDEBAR_COLLAPSE_THRESHOLD ? SIDEBAR_DEFAULT_WIDTH : snapWidth(current);
+        persist(next);
+        return next;
+      });
+    },
+    [persist]
+  );
+  const resetWidth = (0, import_react9.useCallback)(() => {
+    setWidth(SIDEBAR_DEFAULT_WIDTH);
+    persist(SIDEBAR_DEFAULT_WIDTH);
+  }, [persist]);
+  const startResize = (0, import_react9.useCallback)(
+    (event) => {
+      event.preventDefault();
+      const startX = event.clientX;
+      const startWidth = width;
+      const onMove = (moveEvent) => {
+        setWidth(clampWidth(startWidth + moveEvent.clientX - startX));
+      };
+      const onUp = () => {
+        document.removeEventListener("pointermove", onMove);
+        document.removeEventListener("pointerup", onUp);
+        setWidth((current) => {
+          const snapped = snapWidth(current);
+          persist(snapped);
+          return snapped;
+        });
+      };
+      document.addEventListener("pointermove", onMove);
+      document.addEventListener("pointerup", onUp);
+    },
+    [persist, width]
+  );
+  return { width, collapsed, setCollapsed, resetWidth, startResize };
+}
+
 // src/suite/lib/motion.tsx
-var import_react8 = require("motion/react");
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_react10 = require("motion/react");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 function SuiteMotionProvider({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react8.LazyMotion, { features: import_react8.domAnimation, strict: true, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react10.LazyMotion, { features: import_react10.domAnimation, strict: true, children });
 }
 var SUITE_SPRINGS = {
   /** Snappy panel/sheet entrances — small overshoot. */
@@ -2014,217 +2695,25 @@ var SUITE_SPRINGS = {
   press: { type: "spring", stiffness: 600, damping: 35, mass: 0.5 }
 };
 
-// src/suite/components/suite-layout.tsx
-var import_jsx_runtime19 = require("react/jsx-runtime");
-var WIDTHS = {
-  full: "max-w-none",
-  wide: "max-w-7xl",
-  content: "max-w-6xl",
-  narrow: "max-w-4xl"
-};
-function SuiteBreadcrumbs({ items, className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("nav", { "aria-label": "Breadcrumb", className, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("ol", { className: "flex min-w-0 items-center gap-1.5", children: items.map((item, index) => {
-    const isLast = index === items.length - 1;
-    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("li", { className: "flex min-w-0 items-center gap-1.5", children: [
-      index > 0 ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "select-none text-ph-border", "aria-hidden": "true", children: "/" }) : null,
-      item.href && !isLast ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-        "a",
-        {
-          href: item.href,
-          className: "truncate transition hover:text-ph-ink",
-          children: item.label
-        }
-      ) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-        "span",
-        {
-          className: cn(
-            "truncate",
-            isLast ? "font-medium text-ph-ink" : "text-ph-subtle"
-          ),
-          "aria-current": isLast ? "page" : void 0,
-          children: item.label
-        }
-      )
-    ] }, index);
-  }) }) });
-}
-function SuitePage({
-  children,
-  width = "wide",
-  inset = true,
-  className,
-  as: Component = "div",
-  dataTest,
-  id,
-  role,
-  "aria-live": ariaLive
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-    Component,
-    {
-      id,
-      "data-test": dataTest,
-      role,
-      "aria-live": ariaLive,
-      className: cn(
-        "mx-auto flex w-full min-w-0 flex-col",
-        WIDTHS[width],
-        // Tight inset keeps page titles aligned without excessive whitespace.
-        inset && "px-4 pb-6 pt-4 sm:px-6 sm:pb-7 sm:pt-5 lg:px-8",
-        className
-      ),
-      children
-    }
-  );
-}
-function SuitePageHeader({
-  title,
-  description,
-  eyebrow,
-  actions,
-  className,
-  titleClassName,
-  dataTest,
-  /** Optional icon rendered before the title. */
-  icon,
-  /** Use the animated sun/moon icon from the Today page. */
-  todayIcon,
-  todayIconClassName,
-  /** Small badge/pill next to the title (e.g. "Beta", org name). */
-  badge,
-  /** Breadcrumb line rendered above the title. */
-  breadcrumb
-}) {
-  const resolvedIcon = todayIcon ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-    TodayTimeIcon,
-    {
-      className: cn(
-        "h-6 w-6 sm:h-7 sm:w-7 text-amber-500",
-        todayIconClassName
-      )
-    }
-  ) : icon;
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
-    "header",
-    {
-      "data-test": dataTest,
-      className: cn(
-        "flex items-start justify-between gap-4 pb-4 sm:pb-5",
-        className
-      ),
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex min-w-0 items-start gap-3", children: [
-          resolvedIcon ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-            "div",
-            {
-              className: "hidden shrink-0 pt-1 sm:block",
-              "aria-hidden": "true",
-              children: resolvedIcon
-            }
-          ) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex min-w-0 flex-col gap-1", children: [
-            eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "mb-0.5 flex min-w-0 items-center gap-1.5 text-xs text-ph-subtle", children: eyebrow }) : null,
-            breadcrumb ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "mb-0.5 flex min-w-0 items-center gap-1.5 text-xs text-ph-subtle", children: breadcrumb }) : null,
-            /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex min-w-0 flex-wrap items-center gap-x-2 gap-y-1", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-                "h1",
-                {
-                  className: cn(
-                    "font-display text-[1.625rem] font-bold leading-tight tracking-tight text-ph-ink sm:text-[2.25rem]",
-                    titleClassName
-                  ),
-                  children: title
-                }
-              ),
-              badge ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "rounded-md bg-ph-muted px-2 py-0.5 text-[11px] font-semibold uppercase tracking-wide text-ph-subtle", children: badge }) : null
-            ] }),
-            description ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "mt-1 max-w-2xl text-pretty text-sm leading-5 text-ph-subtle", children: description }) : null
-          ] })
-        ] }),
-        actions ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "flex shrink-0 items-center gap-2 pt-1", children: actions }) : null
-      ]
-    }
-  );
-}
-function SuiteToolbar({
-  children,
-  className,
-  label = "Page tools",
-  dataTest
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-    "div",
-    {
-      role: "toolbar",
-      "aria-label": label,
-      "data-test": dataTest,
-      className: cn("flex min-w-0 flex-wrap items-center gap-2", className),
-      children
-    }
-  );
-}
-function SuiteTabList({
-  children,
-  className,
-  label,
-  dataTest
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-    "nav",
-    {
-      "aria-label": label,
-      "data-test": dataTest,
-      className: cn(
-        "flex min-w-0 flex-wrap gap-2 [&_a]:min-h-[48px] [&_button]:min-h-[48px] sm:[&_a]:min-h-[44px] sm:[&_button]:min-h-[44px]",
-        className
-      ),
-      children
-    }
-  );
-}
-function SuiteSectionHeader({
-  title,
-  description,
-  action,
-  className
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
-    "div",
-    {
-      className: cn(
-        "flex min-w-0 flex-col gap-4 sm:flex-row sm:items-end sm:justify-between",
-        className
-      ),
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "min-w-0", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("h2", { className: "font-display text-balance text-lg font-semibold tracking-tight text-ph-ink sm:text-xl", children: title }),
-          description ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "mt-1 max-w-2xl text-pretty text-sm leading-5 text-ph-subtle", children: description }) : null
-        ] }),
-        action ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "flex min-h-[44px] shrink-0 items-center", children: action }) : null
-      ]
-    }
-  );
-}
-
 // src/suite/components/suite-skeleton.tsx
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 function SuiteSkeleton({
   className,
   lines = 1,
   circle,
   width
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     "div",
     {
       className: cn("space-y-2", circle ? "flex flex-col items-center" : ""),
       "aria-hidden": true,
-      children: Array.from({ length: lines }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+      children: Array.from({ length: lines }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
         "div",
         {
           className: "animate-[skeleton-stagger_0.6s_ease-out_both]",
           style: { animationDelay: `${index * 80}ms` },
-          children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
             "div",
             {
               className: cn(
@@ -2248,35 +2737,35 @@ function SuiteSkeletonCard({
   rows = 3,
   header = true
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
     "div",
     {
       className: cn(
-        "ph-skeleton-card animate-[skeleton-stagger_0.5s_ease-out_both] rounded-2xl border border-ph-border/70 bg-ph-surface p-6 shadow-sm",
+        "ph-skeleton-card animate-[skeleton-stagger_0.5s_ease-out_both] rounded-2xl border border-ph-border bg-ph-surface p-6 shadow-sm",
         className
       ),
       "aria-hidden": true,
       children: [
-        header ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+        header ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
           "div",
           {
             className: "mb-5 flex items-center gap-3 animate-[skeleton-stagger_0.5s_ease-out_both]",
             style: { animationDelay: "100ms" },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "ph-skeleton h-10 w-10 rounded-xl" }),
-              /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex-1 space-y-2", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "ph-skeleton h-4 w-1/3" }),
-                /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "ph-skeleton h-3 w-1/2" })
+              /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "ph-skeleton h-10 w-10 rounded-xl" }),
+              /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex-1 space-y-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "ph-skeleton h-4 w-1/3" }),
+                /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "ph-skeleton h-3 w-1/2" })
               ] })
             ]
           }
         ) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "space-y-3", children: Array.from({ length: rows }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "space-y-3", children: Array.from({ length: rows }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
           "div",
           {
             className: "animate-[skeleton-stagger_0.5s_ease-out_both]",
             style: { animationDelay: `${200 + index * 80}ms` },
-            children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
               "div",
               {
                 className: "ph-skeleton h-3",
@@ -2294,16 +2783,16 @@ function SuiteSkeletonList({
   className,
   items = 4
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: cn("space-y-3", className), "aria-hidden": true, children: Array.from({ length: items }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: cn("space-y-3", className), "aria-hidden": true, children: Array.from({ length: items }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     "div",
     {
       className: "animate-[skeleton-stagger_0.6s_ease-out_both]",
       style: { animationDelay: `${index * 100}ms` },
-      children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex items-center gap-3 rounded-xl border border-ph-border/60 bg-ph-surface p-4", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "ph-skeleton h-10 w-10 rounded-lg" }),
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "min-w-0 flex-1 space-y-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "ph-skeleton h-3.5 w-3/4" }),
-          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "ph-skeleton h-3 w-1/2" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center gap-3 rounded-xl border border-ph-border bg-ph-surface p-4", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "ph-skeleton h-10 w-10 rounded-lg" }),
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "min-w-0 flex-1 space-y-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "ph-skeleton h-3.5 w-3/4" }),
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "ph-skeleton h-3 w-1/2" })
         ] })
       ] })
     },
@@ -2318,22 +2807,22 @@ function SuiteEmptyState({
   className,
   size = "md"
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
     "div",
     {
       className: cn(
-        "relative overflow-hidden rounded-2xl border border-ph-border/80 bg-ph-surface text-center",
+        "relative overflow-hidden rounded-2xl border border-ph-border bg-ph-surface text-center",
         size === "sm" ? "px-5 py-8" : "px-6 py-12 sm:px-10 sm:py-16",
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "pointer-events-none absolute inset-0 overflow-hidden opacity-60", "aria-hidden": true, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "absolute -left-10 -top-10 h-40 w-40 rounded-full bg-ph-brand/10 blur-3xl" }),
-          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "absolute -bottom-10 -right-10 h-40 w-40 rounded-full bg-ph-accent/10 blur-3xl" })
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "pointer-events-none absolute inset-0 overflow-hidden opacity-60", "aria-hidden": true, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "absolute -left-10 -top-10 h-40 w-40 rounded-full bg-ph-brand/10 blur-3xl" }),
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "absolute -bottom-10 -right-10 h-40 w-40 rounded-full bg-ph-accent/10 blur-3xl" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "relative", children: [
-          icon ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "mx-auto mb-4 inline-flex items-center justify-center rounded-2xl bg-ph-muted p-3 shadow-sm ring-1 ring-black/[0.06]", children: icon }) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "relative", children: [
+          icon ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "mx-auto mb-4 inline-flex items-center justify-center rounded-2xl bg-ph-muted p-3 shadow-sm ring-1 ring-black/[0.06]", children: icon }) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
             "h3",
             {
               className: cn(
@@ -2343,8 +2832,8 @@ function SuiteEmptyState({
               children: title
             }
           ),
-          description ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { className: "mx-auto mt-2 max-w-sm text-sm leading-relaxed text-ph-subtle", children: description }) : null,
-          action ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "mt-5 flex flex-wrap items-center justify-center gap-2", children: action }) : null
+          description ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "mx-auto mt-2 max-w-sm text-sm leading-relaxed text-ph-subtle", children: description }) : null,
+          action ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "mt-5 flex flex-wrap items-center justify-center gap-2", children: action }) : null
         ] })
       ]
     }
@@ -2352,24 +2841,26 @@ function SuiteEmptyState({
 }
 
 // src/suite/components/suite-settings-mobile-nav.tsx
-var import_react9 = require("react");
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_react11 = require("react");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 function SuiteSettingsMobileNav({
   items,
   activeHref,
   onSelect,
-  dataTest
+  dataTest,
+  ariaLabel = "Settings sections",
+  className
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     "nav",
     {
       "data-test": dataTest,
-      "aria-label": "Settings sections",
-      className: "-mx-4 px-4 lg:hidden",
-      children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex snap-x gap-2 overflow-x-auto pb-3 pt-1 scrollbar-hide [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden", children: items.map((item) => {
+      "aria-label": ariaLabel,
+      className: cn("suite-settings-mobile-nav lg:hidden", className),
+      children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex snap-x gap-2 overflow-x-auto pb-3 pt-1 scrollbar-hide [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden", children: items.map((item) => {
         const Icon = item.icon;
         const active = activeHref === item.href || activeHref.startsWith(`${item.href}/`);
-        const iconNode = (0, import_react9.isValidElement)(item.icon) ? item.icon : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+        const iconNode = (0, import_react11.isValidElement)(item.icon) ? item.icon : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
           Icon,
           {
             className: cn(
@@ -2379,7 +2870,7 @@ function SuiteSettingsMobileNav({
             "aria-hidden": true
           }
         );
-        return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+        return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
           "button",
           {
             type: "button",
@@ -2387,14 +2878,14 @@ function SuiteSettingsMobileNav({
             onClick: () => onSelect(item.href),
             "aria-current": active ? "page" : void 0,
             className: cn(
-              "group relative flex shrink-0 snap-start items-center gap-2 rounded-full px-3.5 py-2.5 text-sm font-medium transition",
+              "group relative flex shrink-0 snap-start items-center gap-2 rounded-full px-3.5 py-2.5 text-sm font-medium transition-colors",
               "min-h-[44px] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ph-brand",
               active ? "bg-ph-ink text-ph-surface shadow-sm" : "bg-ph-surface text-ph-subtle ring-1 ring-ph-border hover:bg-ph-muted hover:text-ph-ink"
             ),
             children: [
               iconNode,
-              /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "whitespace-nowrap", children: item.label }),
-              active ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "absolute inset-x-0 -bottom-3 h-0.5 rounded-full bg-ph-ink lg:hidden" }) : null
+              /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "whitespace-nowrap", children: item.label }),
+              active ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "absolute inset-x-0 -bottom-3 h-0.5 rounded-full bg-ph-ink lg:hidden" }) : null
             ]
           },
           item.href
@@ -2408,10 +2899,10 @@ function SuiteSettingsMobileNav({
 var import_link2 = __toESM(require("next/link"));
 
 // src/components/ui/Tooltip.tsx
-var import_react10 = require("react");
+var import_react12 = require("react");
 var import_react_dom = require("react-dom");
-var import_jsx_runtime22 = require("react/jsx-runtime");
-var TooltipDelayContext = (0, import_react10.createContext)(0);
+var import_jsx_runtime23 = require("react/jsx-runtime");
+var TooltipDelayContext = (0, import_react12.createContext)(0);
 function tooltipPosition(trigger, side, align, offset) {
   const horizontal = align === "start" ? trigger.left : align === "end" ? trigger.right : trigger.left + trigger.width / 2;
   const vertical = align === "start" ? trigger.top : align === "end" ? trigger.bottom : trigger.top + trigger.height / 2;
@@ -2451,12 +2942,12 @@ function Tooltip({
   onOpenChange,
   delayDuration
 }) {
-  const providerDelay = (0, import_react10.useContext)(TooltipDelayContext);
-  const generatedId = (0, import_react10.useId)().replace(/:/g, "");
-  const triggerRef = (0, import_react10.useRef)(null);
-  const timerRef = (0, import_react10.useRef)(null);
-  const [internalOpen, setInternalOpen] = (0, import_react10.useState)(defaultOpen);
-  const [position, setPosition] = (0, import_react10.useState)(null);
+  const providerDelay = (0, import_react12.useContext)(TooltipDelayContext);
+  const generatedId = (0, import_react12.useId)().replace(/:/g, "");
+  const triggerRef = (0, import_react12.useRef)(null);
+  const timerRef = (0, import_react12.useRef)(null);
+  const [internalOpen, setInternalOpen] = (0, import_react12.useState)(defaultOpen);
+  const [position, setPosition] = (0, import_react12.useState)(null);
   const isOpen = open != null ? open : internalOpen;
   const triggerId = children.props.id;
   const tooltipId = triggerId ? `${triggerId}-tooltip` : `ph-tooltip-${generatedId}`;
@@ -2490,7 +2981,7 @@ function Tooltip({
     clearTimer();
     setOpen(false);
   }
-  (0, import_react10.useEffect)(() => {
+  (0, import_react12.useEffect)(() => {
     if (!isOpen) return;
     const reposition = () => updatePosition();
     window.addEventListener("resize", reposition);
@@ -2500,11 +2991,11 @@ function Tooltip({
       window.removeEventListener("scroll", reposition, true);
     };
   });
-  (0, import_react10.useEffect)(() => () => clearTimer(), []);
+  (0, import_react12.useEffect)(() => () => clearTimer(), []);
   const describedBy = [children.props["aria-describedby"], tooltipId].filter(Boolean).join(" ");
-  const trigger = (0, import_react10.cloneElement)(children, { "aria-describedby": describedBy });
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  const trigger = (0, import_react12.cloneElement)(children, { "aria-describedby": describedBy });
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
       "span",
       {
         ref: triggerRef,
@@ -2520,12 +3011,12 @@ function Tooltip({
       }
     ),
     isOpen && position && typeof document !== "undefined" ? (0, import_react_dom.createPortal)(
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
         "span",
         {
           style: __spreadValues({ position: "fixed" }, position),
           className: "pointer-events-none z-[200]",
-          children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
             "span",
             {
               id: tooltipId,
@@ -2543,7 +3034,7 @@ function Tooltip({
 }
 
 // src/suite/components/suite-sidebar.tsx
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 function renderNode(node, collapsed) {
   if (typeof node === "function") return node(collapsed);
   return node;
@@ -2560,7 +3051,7 @@ function SuiteSidebar({
   className,
   surface = false
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
     "div",
     {
       className: cn(
@@ -2569,7 +3060,7 @@ function SuiteSidebar({
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
           "div",
           {
             className: cn(
@@ -2578,12 +3069,12 @@ function SuiteSidebar({
               collapsed ? "flex-col items-center gap-1 px-1 py-2" : "h-14 items-center justify-between gap-2 px-3"
             ),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: cn("min-w-0", collapsed ? "shrink-0" : "flex-1"), children: renderNode(appSwitcher, collapsed) }),
-              collapsed ? null : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "shrink-0", children: renderNode(notificationBell, collapsed) })
+              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: cn("min-w-0", collapsed ? "shrink-0" : "flex-1"), children: renderNode(appSwitcher, collapsed) }),
+              collapsed ? null : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "shrink-0", children: renderNode(notificationBell, collapsed) })
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
           "div",
           {
             className: cn(
@@ -2592,17 +3083,17 @@ function SuiteSidebar({
               collapsed ? "px-1.5 py-2" : "p-2"
             ),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+              /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
                 "nav",
                 {
                   "aria-label": "Pages",
                   className: "shrink-0 space-y-0.5",
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: cn("mb-3", collapsed && "flex justify-center"), children: renderNode(contextSwitcher, collapsed) }),
-                    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "space-y-0.5", children: navItems.map((item) => {
+                    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: cn("mb-3", collapsed && "flex justify-center"), children: renderNode(contextSwitcher, collapsed) }),
+                    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "space-y-0.5", children: navItems.map((item) => {
                       const Icon = item.icon;
                       const active = Boolean(item.active);
-                      const link = /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+                      const link = /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
                         import_link2.default,
                         {
                           href: item.href,
@@ -2615,7 +3106,7 @@ function SuiteSidebar({
                             collapsed ? "mx-auto size-10 shrink-0 justify-center gap-0 px-0 py-0" : "w-full px-2.5 py-2"
                           ),
                           children: [
-                            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                               "span",
                               {
                                 className: cn(
@@ -2623,7 +3114,7 @@ function SuiteSidebar({
                                   item.iconClassName
                                 ),
                                 "aria-hidden": true,
-                                children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                                children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                                   Icon,
                                   {
                                     className: "h-full w-full",
@@ -2632,7 +3123,7 @@ function SuiteSidebar({
                                 )
                               }
                             ),
-                            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                               "span",
                               {
                                 className: cn(
@@ -2643,17 +3134,17 @@ function SuiteSidebar({
                                 children: item.label
                               }
                             ),
-                            !collapsed && item.badge ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "relative ml-auto shrink-0", children: item.badge }) : null
+                            !collapsed && item.badge ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "relative ml-auto shrink-0", children: item.badge }) : null
                           ]
                         },
                         item.label
                       );
-                      return collapsed ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Tooltip, { content: item.label, side: "right", children: link }, item.label) : link;
+                      return collapsed ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Tooltip, { content: item.label, side: "right", children: link }, item.label) : link;
                     }) })
                   ]
                 }
               ),
-              secondaryNav ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              secondaryNav ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
                 "div",
                 {
                   className: "min-h-0 flex-1",
@@ -2664,7 +3155,7 @@ function SuiteSidebar({
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
           "div",
           {
             className: cn(
@@ -2672,7 +3163,7 @@ function SuiteSidebar({
               surface ? "bg-ph-surface" : "bg-ph-canvas",
               collapsed ? "p-1.5" : "p-3"
             ),
-            children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
               "div",
               {
                 className: cn(
@@ -2681,7 +3172,7 @@ function SuiteSidebar({
                 ),
                 children: [
                   renderNode(userMenu, collapsed),
-                  !collapsed && footerExtras ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "ml-auto shrink-0", children: renderNode(footerExtras, collapsed) }) : null
+                  !collapsed && footerExtras ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "ml-auto shrink-0", children: renderNode(footerExtras, collapsed) }) : null
                 ]
               }
             )
@@ -2693,7 +3184,7 @@ function SuiteSidebar({
 }
 
 // src/suite/components/suite-app-layout.tsx
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 function SuiteAppLayout({
   sidebar,
   children,
@@ -2701,41 +3192,59 @@ function SuiteAppLayout({
   bottomNav,
   sidebarWidth = 240,
   collapsed = false,
+  lockMainScroll = false,
   onStartResize,
   onResetWidth,
   className
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { "data-test": "app-shell", className: cn("min-h-screen", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "hidden lg:flex h-screen overflow-hidden", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
-        "aside",
-        {
-          className: "relative flex shrink-0 flex-col border-r border-ph-border transition-[width] duration-200 ease-out",
-          style: { width: `${sidebarWidth}px` },
-          children: [
-            sidebar,
-            onStartResize ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-              "div",
-              {
-                role: "separator",
-                "aria-orientation": "vertical",
-                "aria-label": "Resize sidebar",
-                onPointerDown: onStartResize,
-                onDoubleClick: onResetWidth,
-                className: "absolute inset-y-0 right-0 z-10 w-1 cursor-col-resize transition-colors hover:bg-[color-mix(in_oklab,var(--ph-accent)_30%,transparent)]"
-              }
-            ) : null
-          ]
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("main", { className: "min-w-0 flex-1 overflow-y-auto bg-ph-canvas", children })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex min-h-screen flex-col lg:hidden", children: [
-      mobileHeader ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "shrink-0", children: mobileHeader }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("main", { className: "min-w-0 flex-1 overflow-y-auto bg-ph-canvas", children }),
-      bottomNav ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "shrink-0", children: bottomNav }) : null
-    ] })
-  ] });
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+    "div",
+    {
+      "data-test": "app-shell",
+      className: cn("flex min-h-dvh lg:h-screen lg:overflow-hidden", className),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+          "aside",
+          {
+            className: "relative hidden shrink-0 flex-col overflow-hidden border-r border-ph-border transition-[width] duration-200 ease-out lg:flex",
+            style: { width: `${sidebarWidth}px` },
+            "data-collapsed": collapsed ? "true" : "false",
+            children: [
+              sidebar,
+              onStartResize ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+                "div",
+                {
+                  role: "separator",
+                  "aria-orientation": "vertical",
+                  "aria-label": "Resize sidebar",
+                  onPointerDown: onStartResize,
+                  onDoubleClick: onResetWidth,
+                  className: "absolute inset-y-0 right-0 z-10 w-1 cursor-col-resize transition-colors hover:bg-[color-mix(in_oklab,var(--ph-accent)_30%,transparent)]"
+                }
+              ) : null
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex min-h-0 min-w-0 flex-1 flex-col", children: [
+          mobileHeader ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "shrink-0 lg:hidden", children: mobileHeader }) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+            "main",
+            {
+              id: "main-content",
+              tabIndex: -1,
+              "data-lock-scroll": lockMainScroll ? "true" : void 0,
+              className: cn(
+                "flex min-h-0 min-w-0 flex-1 flex-col overflow-x-hidden overscroll-contain bg-ph-canvas focus:outline-none",
+                lockMainScroll ? "overflow-hidden" : "overflow-y-auto"
+              ),
+              children
+            }
+          ),
+          bottomNav ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "shrink-0 lg:hidden", children: bottomNav }) : null
+        ] })
+      ]
+    }
+  );
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
@@ -2748,10 +3257,16 @@ function SuiteAppLayout({
   AppSwitcherMark,
   CommandPaletteHost,
   DeferredChrome,
+  SIDEBAR_COLLAPSE_THRESHOLD,
+  SIDEBAR_DEFAULT_WIDTH,
+  SIDEBAR_MAX_WIDTH,
+  SIDEBAR_MIN_EXPANDED_WIDTH,
+  SIDEBAR_RAIL_WIDTH,
   SUITE_APPS,
   SUITE_APP_MAP,
   SUITE_GLYPHS,
   SUITE_ICON_NAMES,
+  SUITE_OPEN_ASK_AI_EVENT,
   SUITE_SPRINGS,
   SourceAppGlyph,
   SuiteAiPanel,
@@ -2769,6 +3284,7 @@ function SuiteAppLayout({
   SuitePage,
   SuitePageHeader,
   SuiteSectionHeader,
+  SuiteSettingsLayout,
   SuiteSettingsMobileNav,
   SuiteSidebar,
   SuiteSkeleton,
@@ -2778,11 +3294,15 @@ function SuiteAppLayout({
   SuiteThemeProvider,
   SuiteToolbar,
   SuiteUserMenu,
+  TodayAskAiCard,
   TodayCalibrating,
+  TodayEmptyAction,
   TodayEmptyState,
   TodayHero,
+  TodayLayout,
   TodayPageFrame,
   TodayPanel,
+  TodayPrimaryAction,
   TodaySection,
   TodayTimeIcon,
   TodayTopBar,
@@ -2792,9 +3312,12 @@ function SuiteAppLayout({
   cn,
   getTodayGreeting,
   m,
+  openSuiteAskAi,
+  resolveSuiteNotificationHref,
   sourceToSuiteApp,
   suiteAppBaseUrl,
   suiteAppLabel,
   useIdleMount,
+  useSidebarWidth,
   useSuiteTheme
 });