@doneisbetter/gds-core 2.6.6 → 3.0.0

package/dist/index.js

@@ -27,6 +27,7 @@ __export(index_exports, {
   ArticleShell: () => ArticleShell,
   AuthShell: () => AuthShell,
   BrowseSurface: () => BrowseSurface,
+  ChartTokenPanel: () => ChartTokenPanel,
   ChoiceChip: () => ChoiceChip,
   ConfirmDialog: () => ConfirmDialog,
   ConsumerDashboardGrid: () => ConsumerDashboardGrid,
@@ -37,9 +38,11 @@ __export(index_exports, {
   DiscoveryShell: () => DiscoveryShell,
   DocsCodeBlock: () => DocsCodeBlock,
   DocsPageShell: () => DocsPageShell,
+  DocsShell: () => DocsShell,
   EditorialCard: () => EditorialCard,
   EditorialHero: () => EditorialHero,
   EmptyState: () => EmptyState,
+  EvidencePanel: () => EvidencePanel,
   FeatureBand: () => FeatureBand,
   FilterDrawer: () => FilterDrawer,
   FoodMenuSection: () => FoodMenuSection,
@@ -52,11 +55,15 @@ __export(index_exports, {
   MediaCard: () => MediaCard,
   MediaField: () => MediaField,
   MetricCard: () => MetricCard,
+  PROVIDER_IDENTITY_REGISTRY: () => PROVIDER_IDENTITY_REGISTRY,
   PageHeader: () => PageHeader,
+  PeriodSelector: () => PeriodSelector,
   PlaceholderPanel: () => PlaceholderPanel,
   PlaybackSurface: () => PlaybackSurface,
   ProductCard: () => ProductCard,
   ProgressCard: () => ProgressCard,
+  ProviderIdentityButton: () => ProviderIdentityButton,
+  ProviderIdentityButtonGroup: () => ProviderIdentityButtonGroup,
   PublicBrandFooter: () => PublicBrandFooter,
   PublicFlowShell: () => PublicFlowShell,
   PublicFoodCard: () => PublicFoodCard,
@@ -68,6 +75,7 @@ __export(index_exports, {
   ReferenceLocaleNotice: () => ReferenceLocaleNotice,
   ReferenceSection: () => ReferenceSection,
   ReferenceThemeExplorer: () => ReferenceThemeExplorer,
+  ReportingSection: () => ReportingSection,
   SectionPanel: () => SectionPanel,
   SemanticButton: () => SemanticButton,
   ShareButtonGroup: () => ShareButtonGroup,
@@ -89,14 +97,19 @@ __export(index_exports, {
   fr: () => fr,
   gdsLocales: () => gdsLocales,
   getGdsMessages: () => getGdsMessages,
+  getProviderIdentityLabel: () => getProviderIdentityLabel,
+  getProviderIdentityPolicy: () => getProviderIdentityPolicy,
   getSemanticActionConfig: () => getSemanticActionConfig,
   getSemanticActionLabel: () => getSemanticActionLabel,
+  getSupportedProviderIdentityIds: () => getSupportedProviderIdentityIds,
   he: () => he,
   hu: () => hu,
+  isPresentationMode: () => isPresentationMode,
   it: () => it,
   mergeGdsVocabularyPacks: () => mergeGdsVocabularyPacks,
   resolveAccentPanelStyles: () => resolveAccentPanelStyles,
   resolveSemanticActionConfig: () => resolveSemanticActionConfig,
+  resolveSurfacePresentationStyles: () => resolveSurfacePresentationStyles,
   ru: () => ru
 });
 module.exports = __toCommonJS(index_exports);
@@ -574,6 +587,51 @@ var import_core9 = require("@mantine/core");
 
 // src/SectionPanel.tsx
 var import_core8 = require("@mantine/core");
+
+// src/SurfacePresentation.ts
+var toCssLength = (value) => {
+  if (typeof value === "number") {
+    return `${value}px`;
+  }
+  return value;
+};
+function resolveSurfacePresentationStyles(props) {
+  const {
+    presentation = "inline",
+    minHeight,
+    contentAlign,
+    contentJustify
+  } = props;
+  if (presentation === "inline") {
+    return {
+      minHeight: toCssLength(minHeight)
+    };
+  }
+  const align = contentAlign ?? "center";
+  const justify = contentJustify ?? (presentation === "centered" ? "center" : "start");
+  if (presentation === "fill") {
+    return {
+      minHeight: toCssLength(minHeight),
+      display: "flex",
+      flex: 1,
+      flexDirection: "column",
+      alignItems: align === "center" ? "center" : "flex-start",
+      justifyContent: justify === "center" ? "center" : "flex-start"
+    };
+  }
+  return {
+    minHeight: toCssLength(minHeight),
+    display: "flex",
+    flexDirection: "column",
+    alignItems: align === "center" ? "center" : "flex-start",
+    justifyContent: justify === "center" ? "center" : "flex-start"
+  };
+}
+function isPresentationMode(value) {
+  return value === "inline" || value === "centered" || value === "fill";
+}
+
+// src/SectionPanel.tsx
 var import_jsx_runtime9 = require("react/jsx-runtime");
 var toneBackgrounds = {
   default: "var(--mantine-color-body)",
@@ -588,8 +646,18 @@ function SectionPanel({
   children,
   tone = "default",
   id,
-  divided = true
+  divided = true,
+  presentation = "inline",
+  minHeight,
+  contentAlign,
+  contentJustify
 }) {
+  const bodyLayout = resolveSurfacePresentationStyles({
+    presentation,
+    minHeight,
+    contentAlign,
+    contentJustify
+  });
   return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Paper, { id, withBorder: true, radius: "xl", p: "lg", style: { background: toneBackgrounds[tone] }, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core8.Stack, { gap: "md", children: [
     title || description || action ? /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core8.Group, { justify: "space-between", align: "flex-start", gap: "md", wrap: "wrap", children: [
@@ -601,7 +669,7 @@ function SectionPanel({
       ] }),
       divided ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Divider, {}) : null
     ] }) : null,
-    children
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Box, { style: bodyLayout, children })
   ] }) });
 }
 
@@ -829,20 +897,34 @@ function StateBlock({
   description,
   action,
   icon,
-  compact = false
+  compact = false,
+  presentation = "inline",
+  minHeight,
+  contentAlign,
+  contentJustify
 }) {
   const config = variantConfig[variant];
+  const layout = resolveSurfacePresentationStyles({
+    presentation,
+    minHeight,
+    contentAlign,
+    contentJustify
+  });
+  const centeredText = presentation !== "inline" ? (contentAlign ?? "center") === "center" : !compact;
+  const centeredAlign = presentation !== "inline" ? contentAlign ?? "center" : "start";
+  const headingAlign = presentation === "inline" ? compact ? "flex-start" : "center" : centeredAlign === "center" ? "center" : "flex-start";
   return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
     import_core13.Stack,
     {
-      align: compact ? "flex-start" : "center",
-      justify: "center",
+      align: headingAlign,
+      justify: presentation === "inline" ? "center" : void 0,
       gap: "md",
       py: compact ? "md" : "xl",
-      ta: compact ? "left" : "center",
+      ta: centeredText ? "center" : "left",
+      style: layout,
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.ThemeIcon, { variant: "light", color: config.color, size: compact ? "lg" : "xl", radius: "xl", children: icon ?? config.icon }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Stack, { gap: 6, align: compact ? "flex-start" : "center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_core13.Stack, { gap: 6, align: headingAlign, children: [
           /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Title, { order: compact ? 4 : 3, children: title }),
           description ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core13.Text, { c: "dimmed", maw: compact ? void 0 : 480, children: description }) : null
         ] }),
@@ -855,42 +937,77 @@ function StateBlock({
 // src/ReferenceThemeExplorer.tsx
 var import_gds_theme3 = require("@doneisbetter/gds-theme");
 var import_jsx_runtime15 = require("react/jsx-runtime");
+function resolvePreviewColorScheme(presetId, requestedScheme) {
+  if (presetId === "dark-public") {
+    return "dark";
+  }
+  return requestedScheme;
+}
 var themePresetCatalog = {
   default: {
     label: "Default runtime theme",
     bestFor: "Balanced multi-surface products that need the baseline GDS system.",
     summary: "The default shared runtime lane for most adopters.",
-    themeKey: "gdsTheme"
+    themeKey: "gdsTheme",
+    supportedUse: "Starter products, hybrid public/admin apps, and teams adopting all canonical contracts.",
+    avoidFor: "Avoid for products requiring a distinct editorial voice or guaranteed dark-first brand contrast."
   },
   "dark-public": {
     label: "Dark public theme",
     bestFor: "Dark-first public experiences and campaign-style landing surfaces.",
     summary: "A darker public presentation lane with the shipped runtime rhythm intact.",
-    themeKey: "gdsDarkPublicTheme"
+    themeKey: "gdsDarkPublicTheme",
+    supportedUse: "Products with a deliberate dark visual baseline, low-light UX, or premium media-first surfaces.",
+    avoidFor: "Avoid when mixed mode and editorial readability are core requirements."
   },
   "flat-surface": {
     label: "Flat surface theme",
     bestFor: "Operational products that prefer quieter elevation and flatter surface contrast.",
     summary: "Removes some visual weight without creating a second token authority.",
-    themeKey: "gdsFlatSurfaceTheme"
+    themeKey: "gdsFlatSurfaceTheme",
+    supportedUse: "Dashboards, admin surfaces, and dense content where elevation becomes distracting.",
+    avoidFor: "Avoid for brand-first storytelling or high-expressiveness hero-first pages."
   },
   editorial: {
     label: "Editorial serif theme",
     bestFor: "Documentation, editorial, and content-led experiences.",
     summary: "Adds a more expressive public reading tone while staying inside GDS contracts.",
-    themeKey: "gdsEditorialPublicTheme"
+    themeKey: "gdsEditorialPublicTheme",
+    supportedUse: "Guides, docs, and catalog content where reading comfort matters more than impact.",
+    avoidFor: "Avoid for dense transactional or data-first workflows with strict minimal contrast."
   },
   brand: {
     label: "Brand theme generator",
     bestFor: "Consumer teams that need controlled brand expression without forking the system.",
     summary: "Composes the shipped helpers into a governed product-authored theme lane.",
-    themeKey: "createPublicBrandTheme(...)"
+    themeKey: "createPublicBrandTheme(...)",
+    supportedUse: "Whitelisted public branding programs with narrow product-authored intent and policy guardrails.",
+    avoidFor: "Avoid for local style experiments or temporary visual fixes without compliance approval."
   }
 };
+var colorSchemeProof = [
+  {
+    id: "light",
+    label: "Light",
+    description: "Validates readable default surfaces, controls, badges, and focus states against light backgrounds."
+  },
+  {
+    id: "dark",
+    label: "Dark",
+    description: "Validates contrast for public, operational, and feedback surfaces when dark mode is active."
+  },
+  {
+    id: "auto",
+    label: "Auto",
+    description: "Documents the adopter path for OS-controlled schemes while keeping the provider contract unchanged."
+  }
+];
 function ThemePreviewSurface({
   preset,
-  colorScheme
+  colorScheme,
+  requestedColorScheme
 }) {
+  const forcedScheme = requestedColorScheme && requestedColorScheme !== colorScheme;
   return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Paper, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: "lg", children: [
     /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Group, { justify: "space-between", align: "flex-start", wrap: "wrap", children: [
       /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: 4, children: [
@@ -905,7 +1022,12 @@ function ThemePreviewSurface({
           /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("strong", { children: "Color scheme:" }),
           " ",
           colorScheme
-        ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Text, { size: "sm", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("strong", { children: "Accessibility proof:" }),
+          " status uses text, badge label, and placement, not color alone."
+        ] }),
+        forcedScheme ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { size: "sm", c: "dimmed", children: "This lane always previews in dark mode so the runtime stays inside its sanctioned contrast contract." }) : null
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(ThemeToggle, {})
     ] }),
@@ -934,7 +1056,8 @@ function ThemePreviewSurface({
           description: "This preview uses the real shipped design-system runtime rather than a docs-only styling lane.",
           metadata: [
             { id: "runtime", label: "Runtime lane", value: preset.themeKey },
-            { id: "scheme", label: "Color scheme", value: colorScheme }
+            { id: "scheme", label: "Color scheme", value: colorScheme },
+            { id: "focus", label: "A11y proof", value: "Keyboard + readable states" }
           ],
           primaryAction: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Button, { size: "sm", children: "Inspect route" })
         }
@@ -972,8 +1095,10 @@ function ReferenceThemeExplorer() {
   const comparisonSummary = themePresetCatalog[comparisonPreset];
   const selectedTheme = (0, import_react2.useMemo)(() => resolveTheme(preset), [preset, brandPrimary, brandFlatSurfaces, brandEditorialSerif]);
   const comparedTheme = (0, import_react2.useMemo)(() => resolveTheme(comparisonPreset), [comparisonPreset, brandPrimary, brandFlatSurfaces, brandEditorialSerif]);
-  const previewKey = `${preset}-${colorScheme}-${brandPrimary}-${brandFlatSurfaces}-${brandEditorialSerif}`;
-  const comparisonPreviewKey = `${comparisonPreset}-${colorScheme}-${brandPrimary}-${brandFlatSurfaces}-${brandEditorialSerif}`;
+  const effectiveColorScheme = resolvePreviewColorScheme(preset, colorScheme);
+  const effectiveComparisonScheme = resolvePreviewColorScheme(comparisonPreset, colorScheme);
+  const previewKey = `${preset}-${effectiveColorScheme}-${brandPrimary}-${brandFlatSurfaces}-${brandEditorialSerif}`;
+  const comparisonPreviewKey = `${comparisonPreset}-${effectiveComparisonScheme}-${brandPrimary}-${brandFlatSurfaces}-${brandEditorialSerif}`;
   const reset = () => {
     setPreset("default");
     setColorScheme("light");
@@ -1049,7 +1174,7 @@ function ReferenceThemeExplorer() {
             ),
             /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { size: "sm", c: "dimmed", children: "The generator composes shipped helpers instead of creating a second theme authority inside the website." })
           ] }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Paper, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: "md", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Paper, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: "md", role: "status", "aria-live": "polite", children: [
             /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Title, { order: 4, children: "Current selection summary" }),
             /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: 6, children: [
               /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { fw: 700, children: selectionSummary.label }),
@@ -1068,7 +1193,8 @@ function ReferenceThemeExplorer() {
                 /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("strong", { children: "Color scheme:" }),
                 " ",
                 colorScheme
-              ] })
+              ] }),
+              preset === "dark-public" && colorScheme !== effectiveColorScheme ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { size: "sm", c: "dimmed", children: "gdsDarkPublicTheme always renders in dark mode inside the live preview." }) : null
             ] }),
             /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
               import_core14.Checkbox,
@@ -1101,18 +1227,47 @@ function ReferenceThemeExplorer() {
         children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.SimpleGrid, { cols: { base: 1, md: 2, xl: 5 }, spacing: "md", children: Object.values(themePresetCatalog).map((lane) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Paper, { withBorder: true, radius: "lg", p: "md", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: 6, children: [
           /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { fw: 700, size: "sm", children: lane.label }),
           /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { size: "sm", c: "dimmed", children: lane.summary }),
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Code, { block: true, fz: "10px", children: lane.themeKey })
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Text, { size: "xs", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("strong", { children: "Best for:" }),
+            " ",
+            lane.supportedUse
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Code, { block: true, fz: "10px", children: lane.themeKey }),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Text, { size: "xs", c: "dimmed", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("strong", { children: "Avoid for:" }),
+            " ",
+            lane.avoidFor ?? "No special exclusion noted for this lane."
+          ] })
         ] }) }, lane.themeKey)) })
       }
     ),
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+      ReferenceSection,
+      {
+        title: "Light, dark, and auto proof",
+        description: "Every official lane must remain usable across explicit light, explicit dark, and OS-controlled auto modes. The dark-public lane is intentionally forced to dark in preview to preserve its contrast contract.",
+        children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.SimpleGrid, { cols: { base: 1, md: 3 }, spacing: "md", children: colorSchemeProof.map((item) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Paper, { withBorder: true, radius: "lg", p: "md", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: 6, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Badge, { variant: "light", color: item.id === "dark" ? "violet" : item.id === "auto" ? "teal" : "blue", w: "fit-content", children: item.label }),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { size: "sm", children: item.description }),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { size: "xs", c: "dimmed", children: "Required proof: semantic text, visible focus, and contrast-safe state treatment." })
+        ] }) }, item.id)) })
+      }
+    ),
     /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
       ReferenceSection,
       {
         title: "Live Theme Preview",
         description: "Visitors can test the shipped presets, compare lanes, and inspect actual GDS surfaces under each theme.",
         children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.SimpleGrid, { cols: { base: 1, xl: comparisonEnabled ? 2 : 1 }, spacing: "lg", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_gds_theme3.GdsProvider, { theme: selectedTheme, defaultColorScheme: colorScheme, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(ThemePreviewSurface, { preset: selectionSummary, colorScheme }) }, previewKey),
-          comparisonEnabled ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_gds_theme3.GdsProvider, { theme: comparedTheme, defaultColorScheme: colorScheme, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Paper, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: "md", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_gds_theme3.GdsProvider, { theme: selectedTheme, defaultColorScheme: effectiveColorScheme, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+            ThemePreviewSurface,
+            {
+              preset: selectionSummary,
+              colorScheme: effectiveColorScheme,
+              requestedColorScheme: colorScheme
+            }
+          ) }, previewKey),
+          comparisonEnabled ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_gds_theme3.GdsProvider, { theme: comparedTheme, defaultColorScheme: effectiveComparisonScheme, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Paper, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: "md", children: [
             /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Group, { justify: "space-between", align: "flex-start", wrap: "wrap", children: [
               /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: 4, children: [
                 /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { fw: 700, children: "Comparison Preview Surface" }),
@@ -1120,7 +1275,14 @@ function ReferenceThemeExplorer() {
               ] }),
               /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Badge, { color: "violet", variant: "light", children: comparisonSummary.label })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(ThemePreviewSurface, { preset: comparisonSummary, colorScheme })
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+              ThemePreviewSurface,
+              {
+                preset: comparisonSummary,
+                colorScheme: effectiveComparisonScheme,
+                requestedColorScheme: colorScheme
+              }
+            )
           ] }) }) }, comparisonPreviewKey) : null
         ] })
       }
@@ -1128,18 +1290,34 @@ function ReferenceThemeExplorer() {
     /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
       ReferenceSection,
       {
-        title: "Creator-Authored Experience Boundary",
-        description: "Creator-authored expression is allowed only through the sanctioned theme helpers and narrow exception process.",
+        title: "Unsupported lane boundary",
+        description: "Unsupported local theme lanes are blocked by policy and compliance because they create parallel design-system authority.",
         tone: "supporting",
-        children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-          StateBlock,
-          {
-            variant: "info",
-            title: "Shipped first, custom second",
-            description: "The official site uses shipped presets and the public brand generator first. Product-authored overrides must stay reviewable, testable, and scoped.",
-            compact: true
-          }
-        )
+        children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: "md", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+            StateBlock,
+            {
+              variant: "permission",
+              title: "Do not create local branding-layer helpers",
+              description: "If a consumer needs brand expression, use createPublicBrandTheme(...). If a lane is missing, request it for GDS instead of building extendGdsTheme(...), createTheme(...), or mergeMantineTheme(...) ownership locally.",
+              compact: true
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.SimpleGrid, { cols: { base: 1, md: 2 }, spacing: "md", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Paper, { withBorder: true, radius: "lg", p: "md", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: 6, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { fw: 700, size: "sm", children: "Approved remediation" }),
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Code, { block: true, children: [
+                "createPublicBrandTheme(",
+                `{ flatSurfaces: true, overrides: { primaryColor: 'blue' } }`,
+                ")"
+              ] })
+            ] }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Paper, { withBorder: true, radius: "lg", p: "md", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_core14.Stack, { gap: 6, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Text, { fw: 700, size: "sm", children: "Prohibited ownership" }),
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_core14.Code, { block: true, children: "extendGdsTheme(...) / createTheme(...) / mergeMantineTheme(...)" })
+            ] }) })
+          ] })
+        ] })
       }
     )
   ] });
@@ -2105,21 +2283,97 @@ function DiscoveryShell({
   );
 }
 
-// src/SidebarNav.tsx
+// src/DocsShell.tsx
 var import_react5 = require("react");
 var import_core31 = require("@mantine/core");
-var import_gds_theme4 = require("@doneisbetter/gds-theme");
 var import_jsx_runtime33 = require("react/jsx-runtime");
+function DocsShellSidebar({ primaryNavigation, secondaryNavigation }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_core31.Stack, { gap: "md", h: "100%", children: [
+    primaryNavigation ? /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_core31.Stack, { gap: "xs", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core31.Text, { size: "xs", fw: 700, c: "dimmed", children: "Primary" }),
+      primaryNavigation
+    ] }) : null,
+    secondaryNavigation ? /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_jsx_runtime33.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core31.Divider, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_core31.Stack, { gap: "xs", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core31.Text, { size: "xs", fw: 700, c: "dimmed", children: "More" }),
+        secondaryNavigation
+      ] })
+    ] }) : null
+  ] });
+}
+function resolveContentContainerSize(value) {
+  if (value === "full") {
+    return "100%";
+  }
+  return value ?? "lg";
+}
+function DocsShell({
+  brand,
+  primaryNavigation,
+  secondaryNavigation,
+  headerContext,
+  actions,
+  mobileNavigation,
+  mobileNavigationMode = "drawer",
+  footer,
+  children,
+  contentWidth = "full"
+}) {
+  const [mobileNavOpen, setMobileNavOpen] = (0, import_react5.useState)(false);
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+    DiscoveryShell,
+    {
+      header: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_core31.Group, { h: "100%", justify: "space-between", align: "center", wrap: "nowrap", gap: "md", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_core31.Group, { gap: "sm", align: "center", wrap: "nowrap", style: { minWidth: 0 }, children: [
+          mobileNavigationMode === "inline-collapse" && mobileNavigation ? /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_jsx_runtime33.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+              import_core31.Burger,
+              {
+                opened: mobileNavOpen,
+                onClick: () => setMobileNavOpen((value) => !value),
+                hiddenFrom: "sm",
+                size: "sm",
+                "aria-label": "Toggle docs navigation"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core31.Transition, { mounted: mobileNavOpen, transition: "pop", duration: 120, children: (styles) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core31.Box, { style: styles, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core31.Box, { mt: "xs", p: "sm", style: { borderRadius: 8, border: "1px solid var(--mantine-color-default-border)" }, children: mobileNavigation }) }) })
+          ] }) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core31.Box, { style: { minWidth: 0 }, children: brand }),
+          headerContext ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core31.Text, { size: "sm", c: "dimmed", lineClamp: 1, children: headerContext }) : null
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core31.Group, { gap: "sm", wrap: "nowrap", style: { minWidth: 0 }, children: actions })
+      ] }),
+      sidebar: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+        DocsShellSidebar,
+        {
+          primaryNavigation,
+          secondaryNavigation
+        }
+      ),
+      footer,
+      mobileNavigationLabel: "Open docs navigation",
+      headerHeight: 72,
+      children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core31.Container, { size: resolveContentContainerSize(contentWidth), px: "md", py: "lg", w: "100%", children })
+    }
+  );
+}
+
+// src/SidebarNav.tsx
+var import_react6 = require("react");
+var import_core32 = require("@mantine/core");
+var import_gds_theme4 = require("@doneisbetter/gds-theme");
+var import_jsx_runtime34 = require("react/jsx-runtime");
 function SidebarNav({ children, ariaLabel = "Primary navigation", gap = "md" }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core31.Stack, { component: "nav", "aria-label": ariaLabel, gap, h: "100%", children });
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_core32.Stack, { component: "nav", "aria-label": ariaLabel, gap, h: "100%", children });
 }
 function SidebarNavSection({ label, children, pushToBottom = false }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_core31.Stack, { gap: "xs", mt: pushToBottom ? "auto" : void 0, children: [
-    label ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core31.Text, { size: "xs", fw: 700, c: "dimmed", children: label }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core31.Stack, { gap: 4, children })
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_core32.Stack, { gap: "xs", mt: pushToBottom ? "auto" : void 0, children: [
+    label ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_core32.Text, { size: "xs", fw: 700, c: "dimmed", children: label }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_core32.Stack, { gap: 4, children })
   ] });
 }
-var _SidebarNavItem = (0, import_react5.forwardRef)(
+var _SidebarNavItem = (0, import_react6.forwardRef)(
   ({
     action,
     label,
@@ -2135,14 +2389,14 @@ var _SidebarNavItem = (0, import_react5.forwardRef)(
     const config = action ? resolveSemanticActionConfig(action, vocabularyPacks) : null;
     const Icon = config?.icon;
     const resolvedLabel = label ?? (action ? getSemanticActionLabel(action, t, vocabularyPacks) : void 0);
-    return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
-      import_core31.NavLink,
+    return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+      import_core32.NavLink,
       {
         ref,
         label: resolvedLabel,
         description,
-        leftSection: icon ?? (Icon ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Icon, { size: "1rem", stroke: 1.5 }) : void 0),
-        rightSection: badge ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_core31.Box, { children: badge }) : props.rightSection,
+        leftSection: icon ?? (Icon ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Icon, { size: "1rem", stroke: 1.5 }) : void 0),
+        rightSection: badge ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_core32.Box, { children: badge }) : props.rightSection,
         "aria-label": ariaLabel ?? (typeof resolvedLabel === "string" ? resolvedLabel : void 0),
         "aria-current": props.active ? "page" : ariaCurrent,
         ...props
@@ -2150,21 +2404,21 @@ var _SidebarNavItem = (0, import_react5.forwardRef)(
     );
   }
 );
-var SidebarNavItem = (0, import_core31.createPolymorphicComponent)(_SidebarNavItem);
+var SidebarNavItem = (0, import_core32.createPolymorphicComponent)(_SidebarNavItem);
 
 // src/PublicSiteFooter.tsx
-var import_core32 = require("@mantine/core");
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var import_core33 = require("@mantine/core");
+var import_jsx_runtime35 = require("react/jsx-runtime");
 function PublicSiteFooter({ children, meta }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_core32.Stack, { component: "footer", gap: "xs", children: [
-    children ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_core32.Text, { size: "sm", children }) : null,
-    meta ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_core32.Group, { gap: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_core32.Text, { size: "xs", c: "dimmed", children: meta }) }) : null
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_core33.Stack, { component: "footer", gap: "xs", children: [
+    children ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core33.Text, { size: "sm", children }) : null,
+    meta ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core33.Group, { gap: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core33.Text, { size: "xs", c: "dimmed", children: meta }) }) : null
   ] });
 }
 
 // src/PublicBrandFooter.tsx
-var import_core33 = require("@mantine/core");
-var import_jsx_runtime35 = require("react/jsx-runtime");
+var import_core34 = require("@mantine/core");
+var import_jsx_runtime36 = require("react/jsx-runtime");
 function PublicBrandFooter({
   media,
   brandTitle,
@@ -2179,8 +2433,8 @@ function PublicBrandFooter({
   const mediaSpan = layoutVariant === "immersive-media" ? 5 : 4;
   const primarySpan = media ? layoutVariant === "balanced-quote" ? 4 : 4 : secondary ? 6 : 12;
   const secondarySpan = media ? Math.max(3, 12 - mediaSpan - primarySpan) : Math.max(4, 12 - primarySpan);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
-    import_core33.Paper,
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+    import_core34.Paper,
     {
       component: "footer",
       withBorder: true,
@@ -2188,19 +2442,19 @@ function PublicBrandFooter({
       p: compact ? "lg" : "xl",
       className: classNames?.root,
       "data-layout-variant": layoutVariant,
-      children: /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_core33.Stack, { gap: "lg", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_core33.Grid, { gutter: compact ? "lg" : "xl", align: "flex-start", children: [
-          media ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core33.Grid.Col, { span: { base: 12, md: mediaSpan }, children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core33.Box, { className: classNames?.media, children: media }) }) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core33.Grid.Col, { span: { base: 12, md: primarySpan }, children: /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_core33.Stack, { gap: compact ? "xs" : "sm", className: classNames?.primary, children: [
-            brandTitle ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core33.Title, { order: 4, children: brandTitle }) : null,
-            description ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core33.Text, { c: "dimmed", children: description }) : null,
-            actions ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core33.Box, { children: actions }) : null
+      children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_core34.Stack, { gap: "lg", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_core34.Grid, { gutter: compact ? "lg" : "xl", align: "flex-start", children: [
+          media ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Grid.Col, { span: { base: 12, md: mediaSpan }, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Box, { className: classNames?.media, children: media }) }) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Grid.Col, { span: { base: 12, md: primarySpan }, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_core34.Stack, { gap: compact ? "xs" : "sm", className: classNames?.primary, children: [
+            brandTitle ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Title, { order: 4, children: brandTitle }) : null,
+            description ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Text, { c: "dimmed", children: description }) : null,
+            actions ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Box, { children: actions }) : null
           ] }) }),
-          secondary ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core33.Grid.Col, { span: { base: 12, md: secondarySpan }, children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core33.Stack, { gap: compact ? "xs" : "sm", className: classNames?.secondary, children: secondary }) }) : null
+          secondary ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Grid.Col, { span: { base: 12, md: secondarySpan }, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Stack, { gap: compact ? "xs" : "sm", className: classNames?.secondary, children: secondary }) }) : null
         ] }),
-        legal ? /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(import_jsx_runtime35.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core33.Divider, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core33.Group, { justify: "space-between", gap: "sm", wrap: "wrap", className: classNames?.legal, children: typeof legal === "string" ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_core33.Text, { size: "sm", c: "dimmed", children: legal }) : legal })
+        legal ? /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_jsx_runtime36.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Divider, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Group, { justify: "space-between", gap: "sm", wrap: "wrap", className: classNames?.legal, children: typeof legal === "string" ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Text, { size: "sm", c: "dimmed", children: legal }) : legal })
         ] }) : null
       ] })
     }
@@ -2208,78 +2462,239 @@ function PublicBrandFooter({
 }
 
 // src/AuthShell.tsx
-var import_core34 = require("@mantine/core");
-var import_jsx_runtime36 = require("react/jsx-runtime");
+var import_core35 = require("@mantine/core");
+var import_jsx_runtime37 = require("react/jsx-runtime");
 function AuthShell({
   title,
   description,
+  intent = "sign-in",
   brand,
   headerActions,
   footer,
   helper,
+  error,
+  guestAction,
+  supportAction,
   socialAuth,
   dividerLabel = "Or continue with your account",
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Box, { py: { base: "xl", md: "4rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Container, { size: "xs", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_core34.Stack, { gap: "xl", children: [
-    brand || headerActions ? /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_core34.Group, { justify: brand && headerActions ? "space-between" : "center", align: "center", children: [
-      brand ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Box, { children: brand }) : /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Box, {}),
-      headerActions ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Group, { gap: "sm", children: headerActions }) : null
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Box, { py: { base: "xl", md: "4rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Container, { size: "xs", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_core35.Stack, { gap: "xl", children: [
+    brand || headerActions ? /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_core35.Group, { justify: brand && headerActions ? "space-between" : "center", align: "center", children: [
+      brand ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Box, { children: brand }) : /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Box, {}),
+      headerActions ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Group, { gap: "sm", children: headerActions }) : null
     ] }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Card, { withBorder: true, radius: "lg", padding: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_core34.Stack, { gap: "lg", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(import_core34.Stack, { gap: "xs", ta: "center", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Title, { order: 2, children: title }),
-        description ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Text, { c: "dimmed", size: "sm", children: description }) : null
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Card, { withBorder: true, radius: "lg", padding: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_core35.Stack, { gap: "lg", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_core35.Stack, { gap: "xs", ta: "center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Group, { justify: "center", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Badge, { variant: "light", color: intent === "account-linking" ? "blue" : intent === "guest-entry" ? "gray" : "teal", children: intent.replace("-", " ") }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Title, { order: 2, children: title }),
+        description ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Text, { c: "dimmed", size: "sm", children: description }) : null
       ] }),
-      socialAuth ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Box, { children: socialAuth }) : null,
-      socialAuth ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Divider, { label: dividerLabel, labelPosition: "center" }) : null,
+      error ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Alert, { color: "red", variant: "light", role: "alert", children: error }) : null,
+      socialAuth ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Box, { children: socialAuth }) : null,
+      socialAuth ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Divider, { label: dividerLabel, labelPosition: "center" }) : null,
       children,
-      helper ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Text, { size: "sm", c: "dimmed", ta: "center", children: helper }) : null
+      guestAction || supportAction ? /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_core35.Group, { justify: "center", gap: "sm", children: [
+        guestAction,
+        supportAction
+      ] }) : null,
+      helper ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Text, { size: "sm", c: "dimmed", ta: "center", children: helper }) : null
     ] }) }),
-    footer ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_core34.Text, { size: "sm", c: "dimmed", ta: "center", children: footer }) : null
+    footer ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Text, { size: "sm", c: "dimmed", ta: "center", children: footer }) : null
   ] }) }) });
 }
 
 // src/SocialAuthButtons.tsx
-var import_core35 = require("@mantine/core");
-var import_jsx_runtime37 = require("react/jsx-runtime");
-var providerConfig = {
-  google: { label: "Google", mark: "G", color: "red" },
-  apple: { label: "Apple", mark: "A", color: "dark" },
-  github: { label: "GitHub", mark: "GH", color: "gray" },
-  facebook: { label: "Facebook", mark: "F", color: "blue" },
-  microsoft: { label: "Microsoft", mark: "M", color: "cyan" },
-  linkedin: { label: "LinkedIn", mark: "in", color: "blue" },
-  discord: { label: "Discord", mark: "D", color: "indigo" },
-  x: { label: "X", mark: "X", color: "dark" },
-  email: { label: "Email", mark: "@", color: "gray" }
+var import_core37 = require("@mantine/core");
+
+// src/ProviderIdentityButtons.tsx
+var import_core36 = require("@mantine/core");
+var import_jsx_runtime38 = require("react/jsx-runtime");
+var PROVIDER_IDENTITY_REGISTRY = {
+  google: {
+    providerLabel: "Google",
+    markLabel: "G",
+    brandColor: "red"
+  },
+  apple: {
+    providerLabel: "Apple",
+    markLabel: "A",
+    brandColor: "dark"
+  },
+  github: {
+    providerLabel: "GitHub",
+    markLabel: "GH",
+    brandColor: "gray"
+  },
+  facebook: {
+    providerLabel: "Facebook",
+    markLabel: "F",
+    brandColor: "blue"
+  },
+  microsoft: {
+    providerLabel: "Microsoft",
+    markLabel: "M",
+    brandColor: "cyan"
+  },
+  linkedin: {
+    providerLabel: "LinkedIn",
+    markLabel: "in",
+    brandColor: "blue"
+  },
+  discord: {
+    providerLabel: "Discord",
+    markLabel: "D",
+    brandColor: "indigo"
+  },
+  x: {
+    providerLabel: "X",
+    markLabel: "X",
+    brandColor: "dark"
+  },
+  email: {
+    providerLabel: "Email",
+    markLabel: "@",
+    brandColor: "gray"
+  }
 };
-function ProviderMark({ id }) {
-  const config = providerConfig[id] ?? { label: id, mark: id.slice(0, 2).toUpperCase(), color: "gray" };
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.ThemeIcon, { variant: "light", color: config.color, radius: "xl", size: "md", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Text, { size: "xs", fw: 700, children: config.mark }) });
+function normalizeProviderId(provider) {
+  return (provider ?? "").trim().toLowerCase();
+}
+function isSupportedProviderId(provider) {
+  return provider in PROVIDER_IDENTITY_REGISTRY;
+}
+function getProviderIdentityMeta(provider) {
+  const normalized = normalizeProviderId(provider);
+  if (isSupportedProviderId(normalized)) {
+    return {
+      id: normalized,
+      supported: true,
+      ...PROVIDER_IDENTITY_REGISTRY[normalized]
+    };
+  }
+  return {
+    id: normalized || "provider",
+    supported: false,
+    providerLabel: provider ? provider : "Provider",
+    markLabel: (provider ?? "PR").slice(0, 2).toUpperCase(),
+    brandColor: "gray"
+  };
+}
+function resolveProviderLabel(provider, customLabel) {
+  const meta = getProviderIdentityMeta(provider);
+  if (customLabel != null) {
+    return customLabel;
+  }
+  return `Continue with ${meta.providerLabel}`;
 }
-function SocialAuthButton({ provider, compact = false }) {
-  const config = providerConfig[provider.id] ?? { label: provider.id, mark: provider.id.slice(0, 2).toUpperCase(), color: "gray" };
-  const label = provider.label ?? `Continue with ${config.label}`;
-  const buttonProps = provider.href ? { component: "a", href: provider.href } : { onClick: provider.onClick };
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
-    import_core35.Button,
+function mapVariant(variant = "neutral") {
+  if (variant === "solid") {
+    return "filled";
+  }
+  if (variant === "outline") {
+    return "outline";
+  }
+  return "default";
+}
+function getProviderIdentityLabel(provider, fallbackOverride) {
+  return resolveProviderLabel(provider, fallbackOverride);
+}
+function getSupportedProviderIdentityIds() {
+  return Object.keys(PROVIDER_IDENTITY_REGISTRY);
+}
+function getProviderIdentityPolicy(provider) {
+  const meta = getProviderIdentityMeta(provider);
+  return {
+    id: meta.id,
+    supported: meta.supported,
+    providerLabel: meta.providerLabel,
+    colorAuthority: meta.supported ? "provider" : "gds-neutral",
+    minTouchTargetPx: 44,
+    allowedVariants: ["solid", "outline", "neutral"]
+  };
+}
+function ProviderIdentityMark({ provider }) {
+  const meta = getProviderIdentityMeta(provider);
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+    import_core36.ThemeIcon,
     {
-      variant: "default",
+      variant: "light",
+      color: meta.brandColor,
+      radius: "xl",
+      size: "md",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core36.Text, { size: "xs", fw: 700, c: "inherit", children: meta.markLabel })
+    }
+  );
+}
+function ProviderIdentityButton({
+  provider,
+  label,
+  description,
+  policyNote,
+  error,
+  href,
+  onClick,
+  disabled,
+  loading,
+  tenantDisabledReason,
+  fullWidth = true,
+  size = "md",
+  variant = "neutral",
+  ariaLabel,
+  describedBy,
+  minTouchTargetPx = 44
+}) {
+  const meta = getProviderIdentityMeta(provider);
+  const buttonLabel = resolveProviderLabel(provider, label);
+  const resolvedDisabled = disabled || Boolean(tenantDisabledReason);
+  const buttonProps = href ? {
+    component: "a",
+    href
+  } : {
+    onClick
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+    import_core36.Button,
+    {
+      variant: mapVariant(variant),
+      color: variant === "solid" ? meta.brandColor : void 0,
       justify: "space-between",
-      fullWidth: true,
-      size: compact ? "sm" : "md",
-      leftSection: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(ProviderMark, { id: provider.id }),
-      disabled: provider.disabled,
-      loading: provider.loading,
+      fullWidth,
+      size,
+      "aria-label": ariaLabel ?? (typeof buttonLabel === "string" ? buttonLabel : void 0),
+      "aria-describedby": describedBy,
+      leftSection: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ProviderIdentityMark, { provider }),
+      disabled: resolvedDisabled,
+      loading,
+      styles: { root: { minHeight: minTouchTargetPx } },
       ...buttonProps,
-      children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_core35.Stack, { gap: 0, align: "flex-start", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Text, { inherit: true, children: label }),
-        provider.description ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Text, { size: "xs", c: "dimmed", lh: 1.2, children: provider.description }) : null
+      children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_core36.Stack, { gap: 0, align: "flex-start", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core36.Text, { inherit: true, children: buttonLabel }),
+        description ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core36.Text, { size: "xs", c: "dimmed", lh: 1.2, children: description }) : null,
+        policyNote ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core36.Text, { size: "xs", c: "dimmed", lh: 1.2, children: policyNote }) : null,
+        tenantDisabledReason ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core36.Text, { size: "xs", c: "orange.7", lh: 1.2, children: tenantDisabledReason }) : null,
+        error ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core36.Text, { size: "xs", c: "red.7", lh: 1.2, role: "alert", children: error }) : null
       ] })
     }
   );
 }
+function ProviderIdentityButtonGroup({ providers, layout = "stack" }) {
+  if (!providers.length) {
+    return null;
+  }
+  const content = providers.map((entry, index) => {
+    const key = `${normalizeProviderId(String(entry.provider)) || "provider"}-${index}`;
+    return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ProviderIdentityButton, { ...entry }, key);
+  });
+  if (layout === "grid") {
+    return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core36.SimpleGrid, { cols: { base: 1, sm: 2 }, spacing: "sm", children: content });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core36.Stack, { gap: "sm", children: content });
+}
+
+// src/SocialAuthButtons.tsx
+var import_jsx_runtime39 = require("react/jsx-runtime");
 function SocialAuthButtons({
   providers,
   title = "Continue with a trusted provider",
@@ -2290,44 +2705,57 @@ function SocialAuthButtons({
   if (!providers.length) {
     return null;
   }
-  const content = providers.map((provider) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(SocialAuthButton, { provider, compact }, provider.id));
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_core35.Stack, { gap: "md", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_core35.Stack, { gap: 4, ta: "center", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_core35.Group, { justify: "center", gap: "xs", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(GdsIcons.Login, { size: "1rem" }),
-        /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Text, { fw: 600, children: title })
+  const buttons = providers.map((provider) => ({
+    provider: provider.id,
+    label: provider.label,
+    description: provider.description,
+    policyNote: provider.policyNote,
+    error: provider.error,
+    href: provider.href,
+    onClick: provider.onClick,
+    disabled: provider.disabled,
+    loading: provider.loading,
+    tenantDisabledReason: provider.tenantDisabledReason,
+    size: provider.size ?? (compact ? "sm" : "md"),
+    variant: provider.variant
+  }));
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_core37.Stack, { gap: "md", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_core37.Stack, { gap: 4, ta: "center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_core37.Group, { justify: "center", gap: "xs", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(GdsIcons.Login, { size: "1rem" }),
+        /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_core37.Text, { fw: 600, children: title })
       ] }),
-      description ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Text, { size: "sm", c: "dimmed", children: description }) : null
+      description ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_core37.Text, { size: "sm", c: "dimmed", children: description }) : null
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Divider, {}),
-    layout === "grid" ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.SimpleGrid, { cols: { base: 1, sm: 2 }, spacing: "sm", children: content }) : /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_core35.Stack, { gap: "sm", children: content })
+    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_core37.Divider, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(ProviderIdentityButtonGroup, { providers: buttons, layout })
   ] });
 }
 
 // src/ArticleShell.tsx
-var import_core36 = require("@mantine/core");
-var import_jsx_runtime38 = require("react/jsx-runtime");
+var import_core38 = require("@mantine/core");
+var import_jsx_runtime40 = require("react/jsx-runtime");
 function ArticleShell({ eyebrow, title, lead, meta, sideRail, children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core36.Container, { size: "lg", py: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_core36.Group, { align: "flex-start", gap: "xl", wrap: "nowrap", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_core36.Stack, { gap: "lg", maw: 760, flex: 1, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_core36.Stack, { gap: "sm", children: [
-        eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core36.Text, { size: "sm", fw: 700, c: "dimmed", tt: "uppercase", children: eyebrow }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core36.Title, { order: 1, children: title }),
-        lead ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core36.Text, { size: "lg", c: "dimmed", children: lead }) : null,
-        meta ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core36.Group, { gap: "md", children: meta }) : null
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_core38.Container, { size: "lg", py: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_core38.Group, { align: "flex-start", gap: "xl", wrap: "nowrap", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_core38.Stack, { gap: "lg", maw: 760, flex: 1, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_core38.Stack, { gap: "sm", children: [
+        eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_core38.Text, { size: "sm", fw: 700, c: "dimmed", tt: "uppercase", children: eyebrow }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_core38.Title, { order: 1, children: title }),
+        lead ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_core38.Text, { size: "lg", c: "dimmed", children: lead }) : null,
+        meta ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_core38.Group, { gap: "md", children: meta }) : null
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core36.Stack, { gap: "md", children })
+      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_core38.Stack, { gap: "md", children })
     ] }),
-    sideRail ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_core36.Stack, { visibleFrom: "lg", gap: "md", w: 240, children: sideRail }) : null
+    sideRail ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_core38.Stack, { visibleFrom: "lg", gap: "md", w: 240, children: sideRail }) : null
   ] }) });
 }
 
 // src/DocsCodeBlock.tsx
-var import_react6 = require("react");
-var import_core37 = require("@mantine/core");
-var import_jsx_runtime39 = require("react/jsx-runtime");
+var import_react7 = require("react");
+var import_core39 = require("@mantine/core");
+var import_jsx_runtime41 = require("react/jsx-runtime");
 function DocsCodeBlock({ code, language, title, withCopy = true }) {
-  const [copied, setCopied] = (0, import_react6.useState)(false);
+  const [copied, setCopied] = (0, import_react7.useState)(false);
   const handleCopy = async () => {
     if (!navigator?.clipboard) {
       return;
@@ -2336,44 +2764,44 @@ function DocsCodeBlock({ code, language, title, withCopy = true }) {
     setCopied(true);
     window.setTimeout(() => setCopied(false), 1200);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_core37.Paper, { withBorder: true, radius: "lg", p: "md", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_core37.Stack, { gap: "sm", children: [
-    title || withCopy ? /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_core37.Group, { justify: "space-between", align: "center", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_core37.Stack, { gap: 0, children: [
-        title ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_core37.Text, { fw: 600, children: title }) : null,
-        language ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_core37.Text, { size: "xs", c: "dimmed", children: language }) : null
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_core39.Paper, { withBorder: true, radius: "lg", p: "md", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_core39.Stack, { gap: "sm", children: [
+    title || withCopy ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_core39.Group, { justify: "space-between", align: "center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_core39.Stack, { gap: 0, children: [
+        title ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_core39.Text, { fw: 600, children: title }) : null,
+        language ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_core39.Text, { size: "xs", c: "dimmed", children: language }) : null
       ] }),
-      withCopy ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
-        import_core37.ActionIcon,
+      withCopy ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+        import_core39.ActionIcon,
         {
           variant: "subtle",
           "aria-label": copied ? "Copied code block" : "Copy code block",
           onClick: () => {
             void handleCopy();
           },
-          children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(GdsIcons.Copy, { size: "1rem" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(GdsIcons.Copy, { size: "1rem" })
         }
       ) : null
     ] }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_core37.Code, { block: true, children: code })
+    /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_core39.Code, { block: true, children: code })
   ] }) });
 }
 
 // src/CtaButtonGroup.tsx
-var import_core38 = require("@mantine/core");
-var import_jsx_runtime40 = require("react/jsx-runtime");
+var import_core40 = require("@mantine/core");
+var import_jsx_runtime42 = require("react/jsx-runtime");
 function CtaButtonGroup({ primary, secondary, tertiary }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_core38.Stack, { gap: "sm", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_core38.Group, { gap: "sm", align: "stretch", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { children: primary }),
-      secondary ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { children: secondary }) : null
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_core40.Stack, { gap: "sm", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_core40.Group, { gap: "sm", align: "stretch", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { children: primary }),
+      secondary ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { children: secondary }) : null
     ] }),
-    tertiary ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { children: tertiary }) : null
+    tertiary ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { children: tertiary }) : null
   ] });
 }
 
 // src/DocsPageShell.tsx
-var import_core39 = require("@mantine/core");
-var import_jsx_runtime41 = require("react/jsx-runtime");
+var import_core41 = require("@mantine/core");
+var import_jsx_runtime43 = require("react/jsx-runtime");
 function DocsPageShell({
   breadcrumbs = [],
   title,
@@ -2384,27 +2812,27 @@ function DocsPageShell({
   footerNext,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_core39.Container, { fluid: true, py: "xl", px: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_core39.Group, { align: "flex-start", gap: "xl", wrap: "nowrap", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_core39.Stack, { component: "article", gap: "lg", flex: 1, miw: 0, children: [
-      breadcrumbs.length ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_core39.Breadcrumbs, { children: breadcrumbs.map(
-        (crumb) => crumb.href ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_core39.Anchor, { href: crumb.href, children: crumb.label }, `${crumb.label}-${crumb.href}`) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_core39.Text, { children: crumb.label }, crumb.label)
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Container, { fluid: true, py: "xl", px: { base: "md", md: "lg", lg: "xl" }, w: "100%", maw: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_core41.Group, { align: "flex-start", gap: "xl", wrap: "nowrap", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_core41.Stack, { component: "article", gap: "lg", flex: 1, miw: 0, children: [
+      breadcrumbs.length ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Breadcrumbs, { children: breadcrumbs.map(
+        (crumb) => crumb.href ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Anchor, { href: crumb.href, children: crumb.label }, `${crumb.label}-${crumb.href}`) : /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Text, { children: crumb.label }, crumb.label)
       ) }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_core39.Stack, { gap: "sm", children: [
-        eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_core39.Text, { size: "sm", fw: 700, c: "dimmed", children: eyebrow }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_core39.Title, { order: 1, children: title }),
-        lead ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_core39.Text, { size: "lg", c: "dimmed", maw: 920, children: lead }) : null,
-        meta ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_core39.Group, { gap: "md", children: meta }) : null
+      /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_core41.Stack, { gap: "sm", children: [
+        eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Text, { size: "sm", fw: 700, c: "dimmed", children: eyebrow }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Title, { order: 1, children: title }),
+        lead ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Text, { size: "lg", c: "dimmed", children: lead }) : null,
+        meta ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Group, { gap: "md", children: meta }) : null
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_core39.Stack, { gap: "md", children }),
-      footerNext ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_core39.Anchor, { href: footerNext.href, fw: 600, children: footerNext.label }) : null
+      /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Stack, { gap: "md", children }),
+      footerNext ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Anchor, { href: footerNext.href, fw: 600, children: footerNext.label }) : null
     ] }),
-    sideRail ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_core39.Stack, { visibleFrom: "lg", gap: "md", w: 240, children: sideRail }) : null
+    sideRail ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Stack, { visibleFrom: "lg", gap: "md", w: 240, children: sideRail }) : null
   ] }) });
 }
 
 // src/EditorialHero.tsx
-var import_core40 = require("@mantine/core");
-var import_jsx_runtime42 = require("react/jsx-runtime");
+var import_core42 = require("@mantine/core");
+var import_jsx_runtime44 = require("react/jsx-runtime");
 function resolveActionVariant(action, index, seenPrimary) {
   const requested = action.variant ?? (index === 0 ? "primary" : "secondary");
   if (requested === "primary" && !seenPrimary) {
@@ -2416,8 +2844,8 @@ function resolveActionVariant(action, index, seenPrimary) {
   return { variant: "default", seenPrimary };
 }
 function HeroAction({ action, variant }) {
-  const content = /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
-    import_core40.Anchor,
+  const content = /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+    import_core42.Anchor,
     {
       href: action.href,
       onClick: action.onClick,
@@ -2441,8 +2869,8 @@ function HeroAction({ action, variant }) {
     }
   );
   if (!action.href) {
-    return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
-      import_core40.Box,
+    return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+      import_core42.Box,
       {
         component: "button",
         type: "button",
@@ -2469,30 +2897,30 @@ function HeroAction({ action, variant }) {
   return content;
 }
 function LoadingHero({ compact }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Paper, { withBorder: true, radius: "xl", p: compact ? "lg" : "xl", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_core40.Grid, { gutter: compact ? "lg" : "xl", align: "center", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Grid.Col, { span: { base: 12, md: 6 }, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_core40.Stack, { gap: "md", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Skeleton, { height: 16, width: 96, radius: "xl" }),
-      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Skeleton, { height: 48, width: "90%", radius: "md" }),
-      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Skeleton, { height: 18, width: "100%", radius: "md" }),
-      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Skeleton, { height: 18, width: "82%", radius: "md" }),
-      /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_core40.Group, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Skeleton, { height: 40, width: 140, radius: "md" }),
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Skeleton, { height: 40, width: 140, radius: "md" })
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Paper, { withBorder: true, radius: "xl", p: compact ? "lg" : "xl", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_core42.Grid, { gutter: compact ? "lg" : "xl", align: "center", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Grid.Col, { span: { base: 12, md: 6 }, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_core42.Stack, { gap: "md", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Skeleton, { height: 16, width: 96, radius: "xl" }),
+      /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Skeleton, { height: 48, width: "90%", radius: "md" }),
+      /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Skeleton, { height: 18, width: "100%", radius: "md" }),
+      /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Skeleton, { height: 18, width: "82%", radius: "md" }),
+      /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_core42.Group, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Skeleton, { height: 40, width: 140, radius: "md" }),
+        /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Skeleton, { height: 40, width: 140, radius: "md" })
       ] })
     ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Grid.Col, { span: { base: 12, md: 6 }, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.AspectRatio, { ratio: 16 / 11, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Skeleton, { radius: "lg" }) }) })
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Grid.Col, { span: { base: 12, md: 6 }, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.AspectRatio, { ratio: 16 / 11, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Skeleton, { radius: "lg" }) }) })
   ] }) });
 }
 function MediaFallback() {
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.AspectRatio, { ratio: 16 / 11, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
-    import_core40.ThemeIcon,
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.AspectRatio, { ratio: 16 / 11, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+    import_core42.ThemeIcon,
     {
       size: "100%",
       radius: "lg",
       color: "gray",
       variant: "light",
       "aria-label": "Hero media is unavailable",
-      children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(GdsIcons.Gallery, { size: "2.5rem" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(GdsIcons.Gallery, { size: "2.5rem" })
     }
   ) });
 }
@@ -2512,8 +2940,8 @@ function MediaFrame({
   } else if (mediaFade === "soft-start") {
     overlayBackground = "linear-gradient(90deg, light-dark(rgba(255,255,255,0.9), rgba(17,24,39,0.72)) 0%, rgba(255,255,255,0) 28%)";
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
-    import_core40.Box,
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
+    import_core42.Box,
     {
       component: "figure",
       m: 0,
@@ -2526,9 +2954,9 @@ function MediaFrame({
       },
       "aria-label": mediaAlt,
       children: [
-        media ?? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(MediaFallback, {}),
-        media && overlayBackground ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
-          import_core40.Box,
+        media ?? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(MediaFallback, {}),
+        media && overlayBackground ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+          import_core42.Box,
           {
             "aria-hidden": true,
             style: {
@@ -2561,7 +2989,7 @@ function EditorialHero({
   classNames
 }) {
   if (loading) {
-    return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(LoadingHero, { compact });
+    return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(LoadingHero, { compact });
   }
   const stackAlign = align === "center" ? "center" : "flex-start";
   const textAlign = align === "center" ? "center" : "left";
@@ -2569,15 +2997,15 @@ function EditorialHero({
   const renderedActions = actions.slice(0, 3).map((action, index) => {
     const resolved = resolveActionVariant(action, index, seenPrimary);
     seenPrimary = resolved.seenPrimary;
-    return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(HeroAction, { action, variant: resolved.variant }, `${action.label}-${index}`);
+    return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(HeroAction, { action, variant: resolved.variant }, `${action.label}-${index}`);
   });
-  const textSlot = /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_core40.Stack, { gap: compact ? "md" : "lg", justify: "center", h: "100%", className: classNames?.content, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_core40.Stack, { gap: "sm", align: stackAlign, children: [
-      eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Text, { size: "sm", fw: 700, c: "dimmed", ta: textAlign, children: eyebrow }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Title, { order: 1, maw: 760, ta: textAlign, children: title }),
-      description ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Text, { size: compact ? "md" : "lg", c: "dimmed", maw: 720, ta: textAlign, children: description }) : null
+  const textSlot = /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_core42.Stack, { gap: compact ? "md" : "lg", justify: "center", h: "100%", className: classNames?.content, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_core42.Stack, { gap: "sm", align: stackAlign, children: [
+      eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Text, { size: "sm", fw: 700, c: "dimmed", ta: textAlign, children: eyebrow }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Title, { order: 1, maw: 760, ta: textAlign, children: title }),
+      description ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Text, { size: compact ? "md" : "lg", c: "dimmed", maw: 720, ta: textAlign, children: description }) : null
     ] }),
-    renderedActions.length ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Box, { className: classNames?.actions, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+    renderedActions.length ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Box, { className: classNames?.actions, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
       CtaButtonGroup,
       {
         primary: renderedActions[0],
@@ -2585,8 +3013,8 @@ function EditorialHero({
         tertiary: renderedActions[2]
       }
     ) }) : null,
-    meta.length ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Group, { gap: "sm", wrap: "wrap", "aria-label": "Supporting details", className: classNames?.meta, children: meta.map((item) => /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
-      import_core40.Group,
+    meta.length ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Group, { gap: "sm", wrap: "wrap", "aria-label": "Supporting details", className: classNames?.meta, children: meta.map((item) => /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
+      import_core42.Group,
       {
         gap: 6,
         px: "sm",
@@ -2597,17 +3025,17 @@ function EditorialHero({
         },
         children: [
           item.icon,
-          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Text, { size: "sm", c: "dimmed", children: item.label })
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Text, { size: "sm", c: "dimmed", children: item.label })
         ]
       },
       item.id
     )) }) : null
   ] });
-  const mediaSlot = error ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(AccentPanel, { tone: "red", variant: "soft-outline", title: "Media unavailable", children: error }) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(MediaFrame, { media, mediaAlt, mediaFade, className: classNames?.media });
-  const textCol = /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Grid.Col, { span: { base: 12, md: 6 }, order: { base: 1, md: mediaPosition === "left" ? 2 : 1 }, children: textSlot });
-  const mediaCol = /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_core40.Grid.Col, { span: { base: 12, md: 6 }, order: { base: 2, md: mediaPosition === "left" ? 1 : 2 }, children: mediaSlot });
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
-    import_core40.Paper,
+  const mediaSlot = error ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(AccentPanel, { tone: "red", variant: "soft-outline", title: "Media unavailable", children: error }) : /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(MediaFrame, { media, mediaAlt, mediaFade, className: classNames?.media });
+  const textCol = /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Grid.Col, { span: { base: 12, md: 6 }, order: { base: 1, md: mediaPosition === "left" ? 2 : 1 }, children: textSlot });
+  const mediaCol = /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Grid.Col, { span: { base: 12, md: 6 }, order: { base: 2, md: mediaPosition === "left" ? 1 : 2 }, children: mediaSlot });
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+    import_core42.Paper,
     {
       component: "section",
       withBorder: true,
@@ -2615,7 +3043,7 @@ function EditorialHero({
       p: compact ? "lg" : "xl",
       className: classNames?.root,
       style: surfaceVariant === "flat-public" ? { boxShadow: "none" } : void 0,
-      children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_core40.Grid, { gutter: compact ? "lg" : "xl", align: "center", children: [
+      children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_core42.Grid, { gutter: compact ? "lg" : "xl", align: "center", children: [
         textCol,
         mediaCol
       ] })
@@ -2624,19 +3052,19 @@ function EditorialHero({
 }
 
 // src/FeatureBand.tsx
-var import_core41 = require("@mantine/core");
-var import_jsx_runtime43 = require("react/jsx-runtime");
+var import_core43 = require("@mantine/core");
+var import_jsx_runtime45 = require("react/jsx-runtime");
 function FeatureBandSkeleton({
   columns = 3,
   bordered = true,
   variant = "default"
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.SimpleGrid, { cols: { base: 1, sm: Math.min(columns, 2), lg: columns }, spacing: "lg", children: Array.from({ length: columns }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Paper, { withBorder: bordered, radius: "lg", p: variant === "compact" ? "md" : "lg", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_core41.Stack, { gap: "md", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Skeleton, { height: variant === "process" ? 28 : 42, width: variant === "process" ? 72 : 42, radius: "xl" }),
-    /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_core41.Stack, { gap: "xs", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Skeleton, { height: 20, width: "75%", radius: "md" }),
-      /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Skeleton, { height: 14, width: "100%", radius: "md" }),
-      /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Skeleton, { height: 14, width: "82%", radius: "md" })
+  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.SimpleGrid, { cols: { base: 1, sm: Math.min(columns, 2), lg: columns }, spacing: "lg", children: Array.from({ length: columns }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Paper, { withBorder: bordered, radius: "lg", p: variant === "compact" ? "md" : "lg", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_core43.Stack, { gap: "md", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Skeleton, { height: variant === "process" ? 28 : 42, width: variant === "process" ? 72 : 42, radius: "xl" }),
+    /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_core43.Stack, { gap: "xs", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Skeleton, { height: 20, width: "75%", radius: "md" }),
+      /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Skeleton, { height: 14, width: "100%", radius: "md" }),
+      /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Skeleton, { height: 14, width: "82%", radius: "md" })
     ] })
   ] }) }, index)) });
 }
@@ -2649,10 +3077,10 @@ function FeatureBand({
   variant = "default"
 }) {
   if (loading) {
-    return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(FeatureBandSkeleton, { columns, bordered, variant });
+    return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(FeatureBandSkeleton, { columns, bordered, variant });
   }
   if (!items.length) {
-    return emptyState ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_jsx_runtime43.Fragment, { children: emptyState }) : /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+    return emptyState ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_jsx_runtime45.Fragment, { children: emptyState }) : /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
       EmptyState,
       {
         title: "No supporting details available",
@@ -2660,9 +3088,9 @@ function FeatureBand({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Box, { component: "section", "aria-label": "Supporting features", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.SimpleGrid, { cols: { base: 1, sm: Math.min(columns, 2), lg: columns }, spacing: "lg", children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Paper, { withBorder: bordered, radius: "lg", p: variant === "compact" ? "md" : "lg", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_core41.Stack, { gap: "md", children: [
-    variant === "process" ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Group, { children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
-      import_core41.Text,
+  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Box, { component: "section", "aria-label": "Supporting features", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.SimpleGrid, { cols: { base: 1, sm: Math.min(columns, 2), lg: columns }, spacing: "lg", children: items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Paper, { withBorder: bordered, radius: "lg", p: variant === "compact" ? "md" : "lg", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_core43.Stack, { gap: "md", children: [
+    variant === "process" ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Group, { children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+      import_core43.Text,
       {
         fw: 800,
         size: "sm",
@@ -2674,18 +3102,18 @@ function FeatureBand({
         },
         children: item.stepLabel ?? `Step ${index + 1}`
       }
-    ) }) : item.media ? item.media : item.icon ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Group, { children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.ThemeIcon, { size: "xl", radius: "xl", variant: "light", color: "violet", children: item.icon }) }) : /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Group, { children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.ThemeIcon, { size: "xl", radius: "xl", variant: "light", color: "gray", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(GdsIcons.Info, { size: "1.25rem" }) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_core41.Stack, { gap: "xs", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Title, { order: 4, children: item.title }),
-      item.description ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Text, { c: "dimmed", children: item.description }) : null,
-      item.meta ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_core41.Text, { size: "sm", c: "dimmed", children: item.meta }) : null
+    ) }) : item.media ? item.media : item.icon ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Group, { children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.ThemeIcon, { size: "xl", radius: "xl", variant: "light", color: "violet", children: item.icon }) }) : /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Group, { children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.ThemeIcon, { size: "xl", radius: "xl", variant: "light", color: "gray", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(GdsIcons.Info, { size: "1.25rem" }) }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_core43.Stack, { gap: "xs", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Title, { order: 4, children: item.title }),
+      item.description ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Text, { c: "dimmed", children: item.description }) : null,
+      item.meta ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Text, { size: "sm", c: "dimmed", children: item.meta }) : null
     ] })
   ] }) }, item.id)) }) });
 }
 
 // src/MapPanel.tsx
-var import_core42 = require("@mantine/core");
-var import_jsx_runtime44 = require("react/jsx-runtime");
+var import_core44 = require("@mantine/core");
+var import_jsx_runtime46 = require("react/jsx-runtime");
 function MapPanel({
   title,
   description,
@@ -2701,7 +3129,7 @@ function MapPanel({
 }) {
   let body;
   if (loading) {
-    body = /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+    body = /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
       StateBlock,
       {
         variant: "loading",
@@ -2711,9 +3139,9 @@ function MapPanel({
       }
     );
   } else if (error) {
-    body = /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(StateBlock, { variant: "error", title: "Map unavailable", description: error, compact: true });
+    body = /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(StateBlock, { variant: "error", title: "Map unavailable", description: error, compact: true });
   } else if (!iframeSrc && !renderMap) {
-    body = /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+    body = /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
       StateBlock,
       {
         variant: "empty",
@@ -2723,9 +3151,9 @@ function MapPanel({
       }
     );
   } else if (renderMap) {
-    body = /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Box, { style: { minHeight }, children: renderMap() });
+    body = /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_core44.Box, { style: { minHeight }, children: renderMap() });
   } else {
-    body = /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.AspectRatio, { ratio: 16 / 9, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+    body = /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_core44.AspectRatio, { ratio: 16 / 9, children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
       "iframe",
       {
         src: iframeSrc,
@@ -2737,21 +3165,21 @@ function MapPanel({
       }
     ) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Paper, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_core42.Stack, { gap: "md", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_core42.Group, { justify: "space-between", align: "flex-start", gap: "md", wrap: "wrap", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_core42.Stack, { gap: 4, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Title, { order: 3, children: title }),
-        description ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_core42.Text, { size: "sm", c: "dimmed", children: description }) : null
+  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_core44.Paper, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_core44.Stack, { gap: "md", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_core44.Group, { justify: "space-between", align: "flex-start", gap: "md", wrap: "wrap", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_core44.Stack, { gap: 4, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_core44.Title, { order: 3, children: title }),
+        description ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_core44.Text, { size: "sm", c: "dimmed", children: description }) : null
       ] }),
-      actions ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(ActionBar, { ...actions }) : null
+      actions ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(ActionBar, { ...actions }) : null
     ] }),
     body
   ] }) });
 }
 
 // src/PublicFlowShell.tsx
-var import_core43 = require("@mantine/core");
-var import_jsx_runtime45 = require("react/jsx-runtime");
+var import_core45 = require("@mantine/core");
+var import_jsx_runtime47 = require("react/jsx-runtime");
 var stageTone = {
   idle: { label: "Idle", color: "gray" },
   loading: { label: "Loading", color: "blue" },
@@ -2803,7 +3231,7 @@ function PublicFlowShell({
   const actionBar = toActionBar(stage.actions);
   let body = stage.body;
   if (stage.status === "loading") {
-    body = /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+    body = /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
       StateBlock,
       {
         variant: "loading",
@@ -2812,7 +3240,7 @@ function PublicFlowShell({
       }
     );
   } else if (stage.status === "error") {
-    body = errorState ?? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+    body = errorState ?? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
       StateBlock,
       {
         variant: "error",
@@ -2821,7 +3249,7 @@ function PublicFlowShell({
       }
     );
   } else if (!stage.body && !hardwareSurface) {
-    body = emptyState ?? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+    body = emptyState ?? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
       EmptyState,
       {
         title: "No stage content available",
@@ -2829,29 +3257,29 @@ function PublicFlowShell({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Paper, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_core43.Stack, { gap: "lg", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_core43.Group, { justify: "space-between", align: "flex-start", gap: "md", wrap: "wrap", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_core43.Stack, { gap: 4, children: [
-        eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Text, { size: "xs", fw: 700, c: "dimmed", tt: "uppercase", children: eyebrow }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_core43.Group, { gap: "sm", wrap: "wrap", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Title, { order: 2, children: stage.title }),
-          /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Badge, { variant: "light", color: tone.color, children: tone.label })
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_core45.Paper, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_core45.Stack, { gap: "lg", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_core45.Group, { justify: "space-between", align: "flex-start", gap: "md", wrap: "wrap", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_core45.Stack, { gap: 4, children: [
+        eyebrow ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_core45.Text, { size: "xs", fw: 700, c: "dimmed", tt: "uppercase", children: eyebrow }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_core45.Group, { gap: "sm", wrap: "wrap", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_core45.Title, { order: 2, children: stage.title }),
+          /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_core45.Badge, { variant: "light", color: tone.color, children: tone.label })
         ] }),
-        stage.description ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Text, { size: "sm", c: "dimmed", children: stage.description }) : null
+        stage.description ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_core45.Text, { size: "sm", c: "dimmed", children: stage.description }) : null
       ] }),
       exitAction
     ] }),
-    stage.notice ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_core43.Text, { size: "sm", c: "dimmed", children: stage.notice }) : null,
+    stage.notice ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_core45.Text, { size: "sm", c: "dimmed", children: stage.notice }) : null,
     body,
     hardwareSurface,
     stage.aside,
-    actionBar ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(ActionBar, { ...actionBar }) : null
+    actionBar ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(ActionBar, { ...actionBar }) : null
   ] }) });
 }
 
 // src/PlaybackSurface.tsx
-var import_core44 = require("@mantine/core");
-var import_jsx_runtime46 = require("react/jsx-runtime");
+var import_core46 = require("@mantine/core");
+var import_jsx_runtime48 = require("react/jsx-runtime");
 var stateTone = {
   loading: { label: "Loading", color: "blue" },
   ready: { label: "Ready", color: "teal" },
@@ -2874,7 +3302,7 @@ function PlaybackSurface({
   const tone = stateTone[state];
   let content;
   if (state === "loading") {
-    content = /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+    content = /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
       StateBlock,
       {
         variant: "loading",
@@ -2883,7 +3311,7 @@ function PlaybackSurface({
       }
     );
   } else if (state === "empty") {
-    content = emptyState ?? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+    content = emptyState ?? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
       EmptyState,
       {
         title: "No playback content available",
@@ -2891,7 +3319,7 @@ function PlaybackSurface({
       }
     );
   } else if (state === "error") {
-    content = errorState ?? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+    content = errorState ?? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
       StateBlock,
       {
         variant: "error",
@@ -2900,23 +3328,23 @@ function PlaybackSurface({
       }
     );
   } else {
-    content = /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_core44.Stack, { gap: "md", children: [
+    content = /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_core46.Stack, { gap: "md", children: [
       media,
       overlays
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_core44.Paper, { withBorder: true, radius: "xl", p: "lg", "data-playback-mode": mode, children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_core44.Stack, { gap: "md", children: [
-    title || statusMessage || controls ? /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_core44.Group, { justify: "space-between", align: "flex-start", gap: "md", wrap: "wrap", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_core44.Stack, { gap: 4, children: [
-        title ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_core44.Title, { order: 3, children: title }) : null,
-        statusMessage ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_core44.Text, { size: "sm", c: "dimmed", children: statusMessage }) : null
+  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_core46.Paper, { withBorder: true, radius: "xl", p: "lg", "data-playback-mode": mode, children: /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_core46.Stack, { gap: "md", children: [
+    title || statusMessage || controls ? /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_core46.Group, { justify: "space-between", align: "flex-start", gap: "md", wrap: "wrap", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_core46.Stack, { gap: 4, children: [
+        title ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_core46.Title, { order: 3, children: title }) : null,
+        statusMessage ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_core46.Text, { size: "sm", c: "dimmed", children: statusMessage }) : null
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_core44.Group, { gap: "sm", align: "center", wrap: "wrap", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_core44.Badge, { variant: "light", color: tone.color, children: tone.label }),
+      /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_core46.Group, { gap: "sm", align: "center", wrap: "wrap", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_core46.Badge, { variant: "light", color: tone.color, children: tone.label }),
         controls
       ] })
     ] }) : null,
-    state === "degraded" ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+    state === "degraded" ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
       StateBlock,
       {
         variant: "info",
@@ -2930,9 +3358,9 @@ function PlaybackSurface({
 }
 
 // src/ShareButtonGroup.tsx
-var import_react7 = require("react");
-var import_core45 = require("@mantine/core");
-var import_jsx_runtime47 = require("react/jsx-runtime");
+var import_react8 = require("react");
+var import_core47 = require("@mantine/core");
+var import_jsx_runtime49 = require("react/jsx-runtime");
 var channelLabels = {
   native: "Share",
   copy: "Copy link",
@@ -2967,9 +3395,9 @@ function ShareAction({
   const label = channelLabels[channel];
   const Icon = channel === "copy" ? GdsIcons.Copy : channel === "mail" ? GdsIcons.Mail : channel === "message" ? GdsIcons.Message : GdsIcons.Refer;
   if (compact) {
-    return href ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_core45.ActionIcon, { component: "a", href, target: "_blank", rel: "noreferrer", variant: "subtle", size: "lg", "aria-label": label, children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Icon, { size: "1rem", stroke: 1.75 }) }) : /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_core45.ActionIcon, { variant: "subtle", size: "lg", "aria-label": label, onClick, children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Icon, { size: "1rem", stroke: 1.75 }) });
+    return href ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.ActionIcon, { component: "a", href, target: "_blank", rel: "noreferrer", variant: "subtle", size: "lg", "aria-label": label, children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Icon, { size: "1rem", stroke: 1.75 }) }) : /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.ActionIcon, { variant: "subtle", size: "lg", "aria-label": label, onClick, children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Icon, { size: "1rem", stroke: 1.75 }) });
   }
-  return href ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_core45.Button, { component: "a", href, target: "_blank", rel: "noreferrer", variant: "default", leftSection: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Icon, { size: "1rem", stroke: 1.75 }), children: label }) : /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_core45.Button, { variant: "default", leftSection: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Icon, { size: "1rem", stroke: 1.75 }), onClick, children: label });
+  return href ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.Button, { component: "a", href, target: "_blank", rel: "noreferrer", variant: "default", leftSection: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Icon, { size: "1rem", stroke: 1.75 }), children: label }) : /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.Button, { variant: "default", leftSection: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(Icon, { size: "1rem", stroke: 1.75 }), onClick, children: label });
 }
 function ShareButtonGroup({
   url,
@@ -2980,8 +3408,8 @@ function ShareButtonGroup({
   label = "Share this",
   description
 }) {
-  const [copied, setCopied] = (0, import_react7.useState)(false);
-  const [shared, setShared] = (0, import_react7.useState)(false);
+  const [copied, setCopied] = (0, import_react8.useState)(false);
+  const [shared, setShared] = (0, import_react8.useState)(false);
   const hrefs = encodeShare(url, title, text);
   async function handleCopy() {
     await navigator.clipboard?.writeText?.(url);
@@ -2997,52 +3425,67 @@ function ShareButtonGroup({
     }
     await handleCopy();
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_core45.Stack, { gap: "sm", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_core45.Stack, { gap: 2, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_core45.Text, { fw: 600, children: label }),
-      description ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_core45.Text, { size: "sm", c: "dimmed", children: description }) : null
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_core47.Stack, { gap: "sm", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_core47.Stack, { gap: 2, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.Text, { fw: 600, children: label }),
+      description ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.Text, { size: "sm", c: "dimmed", children: description }) : null
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_core45.Group, { gap: "sm", wrap: "wrap", children: channels.map((channel) => {
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.Group, { gap: "sm", wrap: "wrap", children: channels.map((channel) => {
       if (channel === "copy") {
-        return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(ShareAction, { channel, compact, onClick: () => void handleCopy() }, channel);
+        return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(ShareAction, { channel, compact, onClick: () => void handleCopy() }, channel);
       }
       if (channel === "native") {
-        return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(ShareAction, { channel, compact, onClick: () => void handleNativeShare() }, channel);
+        return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(ShareAction, { channel, compact, onClick: () => void handleNativeShare() }, channel);
       }
-      return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(ShareAction, { channel, compact, href: hrefs[channel] }, channel);
+      return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(ShareAction, { channel, compact, href: hrefs[channel] }, channel);
     }) }),
-    copied ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_core45.Text, { size: "sm", c: "teal", children: "Link copied." }) : null,
-    shared ? /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_core45.Text, { size: "sm", c: "teal", children: "Share sheet opened." }) : null
+    copied ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.Text, { size: "sm", c: "teal", children: "Link copied." }) : null,
+    shared ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.Text, { size: "sm", c: "teal", children: "Share sheet opened." }) : null
   ] });
 }
 
 // src/UploadDropzone.tsx
-var import_react8 = require("react");
-var import_core46 = require("@mantine/core");
-var import_jsx_runtime48 = require("react/jsx-runtime");
+var import_react9 = require("react");
+var import_core48 = require("@mantine/core");
+var import_jsx_runtime50 = require("react/jsx-runtime");
 function UploadDropzone({
   title,
   description,
   onFilesSelected,
   accept,
+  acceptedTypesLabel,
+  maxSizeLabel,
   multiple = true,
   actionLabel = "Choose files",
-  mode = "panel"
+  mode = "panel",
+  state = "idle",
+  selectedFiles = [],
+  error,
+  policyText,
+  retryAction,
+  removeAction,
+  readonly = false
 }) {
-  const inputRef = (0, import_react8.useRef)(null);
-  const [dragging, setDragging] = (0, import_react8.useState)(false);
+  const inputRef = (0, import_react9.useRef)(null);
+  const [dragging, setDragging] = (0, import_react9.useState)(false);
   const UploadIcon = GdsIcons.Upload;
+  const effectiveState = readonly ? "readonly" : dragging ? "drag-active" : state;
+  const isDisabled = readonly || effectiveState === "upload-pending";
+  const isError = ["upload-failed", "unsupported-type", "too-large"].includes(effectiveState);
   const forwardFiles = (files) => {
-    if (!files?.length || !onFilesSelected) {
+    if (isDisabled || !files?.length || !onFilesSelected) {
       return;
     }
     onFilesSelected(Array.from(files));
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
-    import_core46.Box,
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
+    import_core48.Box,
     {
       onDragOver: (event) => {
         event.preventDefault();
+        if (isDisabled) {
+          return;
+        }
         setDragging(true);
       },
       onDragLeave: () => setDragging(false),
@@ -3053,12 +3496,13 @@ function UploadDropzone({
       },
       p: mode === "inline" ? "md" : "xl",
       style: {
-        border: `1px dashed var(${dragging ? "--mantine-color-violet-6" : "--mantine-color-default-border"})`,
+        border: `1px dashed var(${effectiveState === "drag-active" ? "--mantine-color-violet-6" : isError ? "--mantine-color-red-6" : "--mantine-color-default-border"})`,
         borderRadius: "var(--mantine-radius-lg)",
-        background: dragging ? "var(--mantine-color-violet-light)" : "transparent"
+        background: effectiveState === "drag-active" ? "var(--mantine-color-violet-light)" : "transparent"
       },
+      "aria-invalid": isError || void 0,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
           "input",
           {
             ref: inputRef,
@@ -3066,14 +3510,30 @@ function UploadDropzone({
             hidden: true,
             accept,
             multiple,
+            disabled: isDisabled,
             onChange: (event) => forwardFiles(event.currentTarget.files)
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_core46.Stack, { align: mode === "inline" ? "flex-start" : "center", ta: mode === "inline" ? "left" : "center", gap: "sm", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(UploadIcon, { size: "1.5rem" }),
-          /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_core46.Text, { fw: 600, children: title }),
-          description ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_core46.Text, { size: "sm", c: "dimmed", children: description }) : null,
-          /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_core46.Group, { children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_core46.Button, { variant: "light", onClick: () => inputRef.current?.click(), children: actionLabel }) })
+        /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_core48.Stack, { align: mode === "inline" ? "flex-start" : "center", ta: mode === "inline" ? "left" : "center", gap: "sm", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(UploadIcon, { size: "1.5rem" }),
+          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_core48.Badge, { variant: "light", color: isError ? "red" : effectiveState === "selected" ? "blue" : effectiveState === "upload-pending" ? "violet" : "gray", children: effectiveState.replace("-", " ") }),
+          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_core48.Text, { fw: 600, children: title }),
+          description ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_core48.Text, { size: "sm", c: "dimmed", children: description }) : null,
+          acceptedTypesLabel || maxSizeLabel ? /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_core48.Group, { gap: "xs", justify: mode === "inline" ? "flex-start" : "center", children: [
+            acceptedTypesLabel ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_core48.Badge, { variant: "outline", color: "gray", children: acceptedTypesLabel }) : null,
+            maxSizeLabel ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_core48.Badge, { variant: "outline", color: "gray", children: maxSizeLabel }) : null
+          ] }) : null,
+          selectedFiles.length ? /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_core48.Text, { size: "sm", children: [
+            "Selected: ",
+            selectedFiles.join(", ")
+          ] }) : null,
+          policyText ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_core48.Text, { size: "sm", c: isError ? "red.7" : "dimmed", children: policyText }) : null,
+          error ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_core48.Text, { size: "sm", c: "red.7", role: "alert", children: error }) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_core48.Group, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_core48.Button, { variant: "light", onClick: () => inputRef.current?.click(), disabled: isDisabled, children: actionLabel }),
+            retryAction,
+            removeAction
+          ] })
         ] })
       ]
     }
@@ -3081,14 +3541,21 @@ function UploadDropzone({
 }
 
 // src/MediaField.tsx
-var import_core47 = require("@mantine/core");
-var import_jsx_runtime49 = require("react/jsx-runtime");
+var import_core49 = require("@mantine/core");
+var import_jsx_runtime51 = require("react/jsx-runtime");
 var stateLabels = {
   empty: { label: "Empty", color: "gray" },
+  "drag-active": { label: "Drop to select", color: "violet" },
   selected: { label: "Selected", color: "blue" },
+  "preview-loading": { label: "Preview loading", color: "violet" },
   saved: { label: "Saved", color: "teal" },
   invalid: { label: "Needs attention", color: "red" },
-  uploading: { label: "Uploading", color: "violet" }
+  uploading: { label: "Uploading", color: "violet" },
+  "upload-failed": { label: "Upload failed", color: "red" },
+  "unsupported-type": { label: "Unsupported type", color: "red" },
+  "too-large": { label: "Too large", color: "red" },
+  removed: { label: "Removed", color: "gray" },
+  readonly: { label: "Read only", color: "gray" }
 };
 function MediaField({
   label,
@@ -3101,41 +3568,60 @@ function MediaField({
   policyText,
   error,
   retryAction,
+  replaceAction,
   onRemove,
   onReset,
   removeAction,
   resetAction,
   statusAction,
+  acceptedTypes,
+  maxSize,
+  progress,
+  readonly = false,
   state = "empty",
   mode = "stacked"
 }) {
-  const stateBadge = stateLabels[state];
-  const resolvedRemoveAction = removeAction ?? (onRemove ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.Button, { type: "button", variant: "light", color: "red", onClick: onRemove, children: "Remove" }) : null);
-  const resolvedResetAction = resetAction ?? (onReset ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.Button, { type: "button", variant: "default", onClick: onReset, children: "Reset" }) : null);
-  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+  const resolvedState = readonly ? "readonly" : state;
+  const stateBadge = stateLabels[resolvedState];
+  const resolvedRemoveAction = removeAction ?? (!readonly && onRemove ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Button, { type: "button", variant: "light", color: "red", onClick: onRemove, children: "Remove" }) : null);
+  const resolvedResetAction = resetAction ?? (!readonly && onReset ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Button, { type: "button", variant: "default", onClick: onReset, children: "Reset" }) : null);
+  const boundedProgress = typeof progress === "number" ? Math.max(0, Math.min(100, progress)) : void 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
     FormField,
     {
       label,
       description,
       error,
-      children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.Paper, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_core47.Stack, { gap: "md", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.Group, { justify: "flex-end", align: "center", gap: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_core47.Group, { gap: "xs", justify: "flex-end", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.Badge, { variant: "light", color: stateBadge.color, children: stateBadge.label }),
+      children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Paper, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_core49.Stack, { gap: "md", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Group, { justify: "flex-end", align: "center", gap: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_core49.Group, { gap: "xs", justify: "flex-end", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Badge, { variant: "light", color: stateBadge.color, children: stateBadge.label }),
           statusAction
         ] }) }),
         preview ? preview : null,
-        uploadControl || urlInput ? /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_jsx_runtime49.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.Divider, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_core47.Stack, { gap: "sm", style: mode === "split" ? { display: "grid", gridTemplateColumns: "repeat(auto-fit, minmax(220px, 1fr))" } : void 0, children: [
+        typeof boundedProgress === "number" ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_core49.Stack, { gap: 4, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Progress, { value: boundedProgress, "aria-label": "Upload progress" }),
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_core49.Text, { size: "xs", c: "dimmed", children: [
+            boundedProgress,
+            "% complete"
+          ] })
+        ] }) : null,
+        (uploadControl || urlInput) && !readonly ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Divider, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_core49.Stack, { gap: "sm", style: mode === "split" ? { display: "grid", gridTemplateColumns: "repeat(auto-fit, minmax(220px, 1fr))" } : void 0, children: [
             uploadControl,
             urlInput
           ] })
         ] }) : null,
-        value ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.Text, { size: "sm", c: "dimmed", style: { wordBreak: "break-all" }, children: value }) : null,
-        helpText ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.Text, { size: "sm", c: "dimmed", children: helpText }) : null,
-        policyText ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_core47.Text, { size: "sm", c: error ? "red.7" : "dimmed", children: policyText }) : null,
+        value ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Text, { size: "sm", c: "dimmed", style: { wordBreak: "break-all" }, children: value }) : null,
+        helpText ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Text, { size: "sm", c: "dimmed", children: helpText }) : null,
+        acceptedTypes || maxSize ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_core49.Group, { gap: "xs", wrap: "wrap", children: [
+          acceptedTypes ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Badge, { variant: "outline", color: "gray", children: acceptedTypes }) : null,
+          maxSize ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Badge, { variant: "outline", color: "gray", children: maxSize }) : null
+        ] }) : null,
+        policyText ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Text, { size: "sm", c: error ? "red.7" : "dimmed", children: policyText }) : null,
         typeof error !== "string" && error ? error : null,
-        resolvedRemoveAction || resolvedResetAction ? /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_core47.Group, { gap: "sm", children: [
+        replaceAction || resolvedRemoveAction || resolvedResetAction || retryAction ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_core49.Group, { gap: "sm", children: [
+          replaceAction,
           resolvedResetAction,
           retryAction,
           resolvedRemoveAction
@@ -3146,53 +3632,68 @@ function MediaField({
 }
 
 // src/MediaCard.tsx
-var import_core48 = require("@mantine/core");
-var import_jsx_runtime50 = require("react/jsx-runtime");
+var import_core50 = require("@mantine/core");
+var import_jsx_runtime52 = require("react/jsx-runtime");
 function MediaCard({ title, image, description, status, overlay, actions = [] }) {
   const EyeIcon = GdsIcons.Eye;
-  return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_core48.Card, { withBorder: true, radius: "lg", padding: "md", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_core48.Card.Section, { pos: "relative", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_core50.Card, { withBorder: true, radius: "lg", padding: "md", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_core50.Card.Section, { pos: "relative", children: [
       image,
-      overlay ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { style: { position: "absolute", inset: 12, display: "flex", justifyContent: "flex-end", alignItems: "flex-start" }, children: overlay }) : null
+      overlay ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { style: { position: "absolute", inset: 12, display: "flex", justifyContent: "flex-end", alignItems: "flex-start" }, children: overlay }) : null
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_core48.Stack, { gap: "sm", mt: "md", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_core48.Group, { justify: "space-between", align: "flex-start", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_core48.Stack, { gap: 4, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_core48.Title, { order: 4, children: title }),
-          description ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_core48.Text, { size: "sm", c: "dimmed", lineClamp: 2, children: description }) : null
+    /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_core50.Stack, { gap: "sm", mt: "md", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_core50.Group, { justify: "space-between", align: "flex-start", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_core50.Stack, { gap: 4, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_core50.Title, { order: 4, children: title }),
+          description ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_core50.Text, { size: "sm", c: "dimmed", lineClamp: 2, children: description }) : null
         ] }),
-        status ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_core48.Badge, { variant: "light", children: status }) : null
+        status ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_core50.Badge, { variant: "light", children: status }) : null
       ] }),
-      actions.length ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_core48.Group, { justify: "flex-end", gap: "xs", children: actions.map((action) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_core48.ActionIcon, { variant: "light", "aria-label": action.label, onClick: action.onClick, children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(EyeIcon, { size: "1rem" }) }, action.label)) }) : null
+      actions.length ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_core50.Group, { justify: "flex-end", gap: "xs", children: actions.map((action) => /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_core50.ActionIcon, { variant: "light", "aria-label": action.label, onClick: action.onClick, children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(EyeIcon, { size: "1rem" }) }, action.label)) }) : null
     ] })
   ] });
 }
 
 // src/AccessSummary.tsx
-var import_core49 = require("@mantine/core");
-var import_jsx_runtime51 = require("react/jsx-runtime");
-function AccessSummary({ title, roles, scope, blocked = false, description }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Card, { withBorder: true, radius: "lg", padding: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_core49.Stack, { gap: "sm", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_core49.Group, { justify: "space-between", align: "center", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Title, { order: 4, children: title }),
-      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Badge, { color: blocked ? "red" : "teal", variant: "light", children: blocked ? "Blocked" : "Allowed" })
+var import_core51 = require("@mantine/core");
+var import_jsx_runtime53 = require("react/jsx-runtime");
+var accessStateMeta = {
+  allowed: { label: "Allowed", color: "teal" },
+  blocked: { label: "Blocked", color: "red" },
+  forbidden: { label: "Forbidden", color: "red" },
+  expired: { label: "Expired", color: "orange" },
+  "permission-limited": { label: "Permission limited", color: "grape" }
+};
+function AccessSummary({ title, roles, scope, blocked = false, state, owner, recoveryHint, description }) {
+  const resolvedState = state ?? (blocked ? "blocked" : "allowed");
+  const meta = accessStateMeta[resolvedState];
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_core51.Card, { withBorder: true, radius: "lg", padding: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_core51.Stack, { gap: "sm", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_core51.Group, { justify: "space-between", align: "center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_core51.Title, { order: 4, children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_core51.Badge, { color: meta.color, variant: "light", children: meta.label })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Group, { gap: "xs", children: roles.map((role) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Badge, { variant: "outline", children: role }, role)) }),
-    scope ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_core49.Text, { size: "sm", c: "dimmed", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_core51.Group, { gap: "xs", children: roles.map((role) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_core51.Badge, { variant: "outline", children: role }, role)) }),
+    scope ? /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_core51.Text, { size: "sm", c: "dimmed", children: [
       "Scope: ",
       scope
     ] }) : null,
-    description ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_core49.Text, { size: "sm", children: description }) : null
+    owner ? /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_core51.Text, { size: "sm", c: "dimmed", children: [
+      "Owner: ",
+      owner
+    ] }) : null,
+    recoveryHint ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_core51.Text, { size: "sm", c: resolvedState === "allowed" ? "dimmed" : "red.7", children: recoveryHint }) : null,
+    description ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_core51.Text, { size: "sm", children: description }) : null
   ] }) });
 }
 
 // src/AccessRecoveryPanel.tsx
-var import_core50 = require("@mantine/core");
+var import_core52 = require("@mantine/core");
 var import_gds_theme5 = require("@doneisbetter/gds-theme");
-var import_jsx_runtime52 = require("react/jsx-runtime");
+var import_jsx_runtime54 = require("react/jsx-runtime");
 var stateBlockVariantByState = {
   unauthenticated: "permission",
   "expired-session": "info",
+  timeout: "error",
   forbidden: "permission",
   missing: "error",
   unavailable: "error"
@@ -3206,6 +3707,10 @@ var defaultCopyByState = {
     title: "Session expired",
     description: "Sign in again or retry to continue where you left off."
   },
+  timeout: {
+    title: "Request timed out",
+    description: "The recovery action took too long. Retry or choose a safe destination."
+  },
   forbidden: {
     title: "You do not have access",
     description: "This content is outside your current permissions or scope."
@@ -3237,6 +3742,12 @@ function defaultActionsForState(state, {
         secondary: retryAction && signInAction ? retryAction : backAction,
         tertiary: supportAction ?? null
       };
+    case "timeout":
+      return {
+        primary: retryAction ?? backAction,
+        secondary: retryAction && backAction ? backAction : supportAction ?? null,
+        tertiary: retryAction && backAction ? supportAction ?? null : null
+      };
     case "forbidden":
       return { primary: backAction, secondary: supportAction ?? null, tertiary: null };
     case "missing":
@@ -3258,7 +3769,7 @@ function ActionGroup({
   if (actions.length === 0) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_core50.Group, { gap: "sm", justify: "center", wrap: "wrap", children: actions.map((actionConfig, index) => /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_core52.Group, { gap: "sm", justify: "center", wrap: "wrap", children: actions.map((actionConfig, index) => /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
     SemanticButton,
     {
       action: actionConfig.action,
@@ -3292,14 +3803,14 @@ function AccessRecoveryPanel({
     onBack,
     supportAction
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
     StateBlock,
     {
       variant: stateBlockVariantByState[state],
       compact,
       title: title ?? t(`gds.accessRecovery.${state}.title`, defaultCopy.title),
       description: description ?? t(`gds.accessRecovery.${state}.description`, defaultCopy.description),
-      action: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+      action: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
         ActionGroup,
         {
           primaryAction: primaryAction ?? defaults.primary,
@@ -3312,8 +3823,8 @@ function AccessRecoveryPanel({
 }
 
 // src/PageHeader.tsx
-var import_core51 = require("@mantine/core");
-var import_jsx_runtime53 = require("react/jsx-runtime");
+var import_core53 = require("@mantine/core");
+var import_jsx_runtime55 = require("react/jsx-runtime");
 function PageHeader({
   title,
   description,
@@ -3324,19 +3835,19 @@ function PageHeader({
 }) {
   const resolvedDescription = description ?? subtitle;
   const eyebrowProps = eyebrowVariant === "ornamental" ? { tt: "uppercase", style: { letterSpacing: "0.12em" } } : {};
-  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_core51.Group, { justify: "space-between", align: "flex-start", gap: "lg", wrap: "wrap", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_core51.Stack, { gap: "xs", children: [
-      eyebrow && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_core51.Text, { size: "xs", fw: 700, c: "dimmed", ...eyebrowProps, children: eyebrow }),
-      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_core51.Title, { order: 1, children: title }),
-      resolvedDescription && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_core51.Text, { c: "dimmed", maw: 720, children: resolvedDescription })
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_core53.Group, { justify: "space-between", align: "flex-start", gap: "lg", wrap: "wrap", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_core53.Stack, { gap: "xs", children: [
+      eyebrow && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_core53.Text, { size: "xs", fw: 700, c: "dimmed", ...eyebrowProps, children: eyebrow }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_core53.Title, { order: 1, children: title }),
+      resolvedDescription && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_core53.Text, { c: "dimmed", maw: 720, children: resolvedDescription })
     ] }),
-    actions ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_core51.Box, { children: actions }) : null
+    actions ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_core53.Box, { children: actions }) : null
   ] });
 }
 
 // src/FilterDrawer.tsx
-var import_core52 = require("@mantine/core");
-var import_jsx_runtime54 = require("react/jsx-runtime");
+var import_core54 = require("@mantine/core");
+var import_jsx_runtime56 = require("react/jsx-runtime");
 function FilterDrawer({
   opened,
   onClose,
@@ -3352,8 +3863,8 @@ function FilterDrawer({
 }) {
   const resolvedPrimaryAction = applyAction ?? primaryAction;
   const resolvedSecondaryAction = resetAction ?? secondaryAction;
-  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
-    import_core52.Drawer,
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+    import_core54.Drawer,
     {
       opened,
       onClose,
@@ -3361,11 +3872,11 @@ function FilterDrawer({
       position: mode === "bottom-sheet" ? "bottom" : "right",
       size: mode === "bottom-sheet" ? "auto" : "md",
       radius: mode === "bottom-sheet" ? "xl" : void 0,
-      children: /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_core52.Stack, { gap: "md", children: [
-        description ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_core52.Text, { size: "sm", c: "dimmed", children: description }) : null,
+      children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_core54.Stack, { gap: "md", children: [
+        description ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_core54.Text, { size: "sm", c: "dimmed", children: description }) : null,
         children,
-        resolvedPrimaryAction || resolvedSecondaryAction || closeAction ? /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_core52.Group, { justify: "space-between", mt: "md", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_core52.Group, { gap: "sm", children: [
+        resolvedPrimaryAction || resolvedSecondaryAction || closeAction ? /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_core54.Group, { justify: "space-between", mt: "md", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_core54.Group, { gap: "sm", children: [
             closeAction,
             resolvedSecondaryAction
           ] }),
@@ -3377,8 +3888,8 @@ function FilterDrawer({
 }
 
 // src/PlaceholderPanel.tsx
-var import_core53 = require("@mantine/core");
-var import_jsx_runtime55 = require("react/jsx-runtime");
+var import_core55 = require("@mantine/core");
+var import_jsx_runtime57 = require("react/jsx-runtime");
 function PlaceholderPanel({
   title,
   description,
@@ -3388,16 +3899,16 @@ function PlaceholderPanel({
   mode
 }) {
   if (mode === "live" && children) {
-    return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_jsx_runtime55.Fragment, { children });
+    return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_jsx_runtime57.Fragment, { children });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_core53.Card, { children: /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_core53.Stack, { gap: "md", children: [
-    badge ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_core53.Badge, { variant: "light", color: "blue", w: "fit-content", children: badge }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_core53.Stack, { gap: "xs", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_core53.Title, { order: 4, children: title }),
-      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_core53.Text, { c: "dimmed", children: description })
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_core55.Card, { children: /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_core55.Stack, { gap: "md", children: [
+    badge ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_core55.Badge, { variant: "light", color: "blue", w: "fit-content", children: badge }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_core55.Stack, { gap: "xs", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_core55.Title, { order: 4, children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_core55.Text, { c: "dimmed", children: description })
     ] }),
-    footer ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_core53.Text, { size: "sm", children: footer }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+    footer ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_core55.Text, { size: "sm", children: footer }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
       StateBlock,
       {
         variant: "not-enough-data",
@@ -3410,8 +3921,8 @@ function PlaceholderPanel({
 }
 
 // src/SimpleDataTable.tsx
-var import_core54 = require("@mantine/core");
-var import_jsx_runtime56 = require("react/jsx-runtime");
+var import_core56 = require("@mantine/core");
+var import_jsx_runtime58 = require("react/jsx-runtime");
 function SimpleDataTable({
   columns,
   rows,
@@ -3422,23 +3933,23 @@ function SimpleDataTable({
   getRowKey
 }) {
   if (error) {
-    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(StateBlock, { variant: "error", title: "Unable to load data", description: error, compact: true });
+    return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(StateBlock, { variant: "error", title: "Unable to load data", description: error, compact: true });
   }
   if (loading) {
-    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(StateBlock, { variant: "loading", title: "Loading data", description: "Please wait while the shared dataset is prepared.", compact: true });
+    return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(StateBlock, { variant: "loading", title: "Loading data", description: "Please wait while the shared dataset is prepared.", compact: true });
   }
   if (!rows.length) {
-    return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(StateBlock, { variant: "empty", title: emptyTitle, description: emptyDescription, compact: true });
+    return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(StateBlock, { variant: "empty", title: emptyTitle, description: emptyDescription, compact: true });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_core54.ScrollArea, { children: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_core54.Table, { striped: true, highlightOnHover: true, withTableBorder: true, withColumnBorders: true, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_core54.Table.Thead, { children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_core54.Table.Tr, { children: columns.map((column) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_core54.Table.Th, { children: column.header }, String(column.key))) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_core54.Table.Tbody, { children: rows.map((row, index) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_core54.Table.Tr, { children: columns.map((column) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_core54.Table.Td, { children: column.render ? column.render(row) : String(row[column.key] ?? "") }, String(column.key))) }, getRowKey ? getRowKey(row, index) : index)) })
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_core56.ScrollArea, { children: /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(import_core56.Table, { striped: true, highlightOnHover: true, withTableBorder: true, withColumnBorders: true, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_core56.Table.Thead, { children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_core56.Table.Tr, { children: columns.map((column) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_core56.Table.Th, { children: column.header }, String(column.key))) }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_core56.Table.Tbody, { children: rows.map((row, index) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_core56.Table.Tr, { children: columns.map((column) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_core56.Table.Td, { children: column.render ? column.render(row) : String(row[column.key] ?? "") }, String(column.key))) }, getRowKey ? getRowKey(row, index) : index)) })
   ] }) });
 }
 
 // src/StatsSection.tsx
-var import_core55 = require("@mantine/core");
-var import_jsx_runtime57 = require("react/jsx-runtime");
+var import_core57 = require("@mantine/core");
+var import_jsx_runtime59 = require("react/jsx-runtime");
 function StatsSection({
   title,
   loading = false,
@@ -3450,11 +3961,11 @@ function StatsSection({
 }) {
   let content = children;
   if (error) {
-    content = /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(StateBlock, { variant: "error", title: "Unable to load statistics", description: error, compact: true });
+    content = /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(StateBlock, { variant: "error", title: "Unable to load statistics", description: error, compact: true });
   } else if (loading) {
-    content = /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(StateBlock, { variant: "loading", title: "Loading statistics", description: "This shared data surface is still synchronizing.", compact: true });
+    content = /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(StateBlock, { variant: "loading", title: "Loading statistics", description: "This shared data surface is still synchronizing.", compact: true });
   } else if (belowThreshold) {
-    content = /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+    content = /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
       StateBlock,
       {
         variant: "not-enough-data",
@@ -3464,14 +3975,210 @@ function StatsSection({
       }
     );
   } else if (placeholder) {
-    content = /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(PlaceholderPanel, { ...placeholder, mode: "placeholder" });
+    content = /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(PlaceholderPanel, { ...placeholder, mode: "placeholder" });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_core55.Stack, { gap: "md", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_core55.Title, { order: 3, children: title }),
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(import_core57.Stack, { gap: "md", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_core57.Title, { order: 3, children: title }),
     content
   ] });
 }
 
+// src/PeriodSelector.tsx
+var import_core58 = require("@mantine/core");
+var import_jsx_runtime60 = require("react/jsx-runtime");
+function PeriodSelector({
+  label,
+  description,
+  value,
+  options,
+  onChange,
+  timezone,
+  scope,
+  helperText,
+  error,
+  stale = false,
+  filtered = false,
+  disabled = false
+}) {
+  const selectedOption = options.find((option) => option.value === value);
+  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(FormField, { label, description, error, children: /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_core58.Stack, { gap: "sm", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+      "select",
+      {
+        "aria-label": typeof label === "string" ? label : "Reporting period",
+        value,
+        disabled,
+        onChange: (event) => onChange?.(event.currentTarget.value),
+        children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("option", { value: option.value, children: option.label }, option.value))
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_core58.Group, { gap: "xs", wrap: "wrap", children: [
+      timezone ? /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_core58.Badge, { variant: "outline", color: "gray", children: [
+        "Timezone: ",
+        timezone
+      ] }) : null,
+      filtered ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_core58.Badge, { variant: "light", color: "blue", children: "Filtered" }) : null,
+      stale ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_core58.Badge, { variant: "light", color: "orange", children: "Stale data" }) : null,
+      scope ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_core58.Badge, { variant: "outline", color: "gray", children: scope }) : null
+    ] }),
+    selectedOption?.description ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_core58.Text, { size: "sm", c: "dimmed", children: selectedOption.description }) : null,
+    helperText ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(import_core58.Text, { size: "sm", c: "dimmed", children: helperText }) : null
+  ] }) });
+}
+
+// src/EvidencePanel.tsx
+var import_core59 = require("@mantine/core");
+var import_jsx_runtime61 = require("react/jsx-runtime");
+var stateTone2 = {
+  current: { label: "Current", color: "teal" },
+  stale: { label: "Stale", color: "orange" },
+  partial: { label: "Partial data", color: "yellow" },
+  "permission-limited": { label: "Permission limited", color: "grape" },
+  loading: { label: "Loading", color: "blue" },
+  empty: { label: "No evidence", color: "gray" },
+  error: { label: "Needs attention", color: "red" }
+};
+function EvidencePanel({
+  title,
+  description,
+  source,
+  freshness,
+  confidence,
+  state = "current",
+  evidenceCount,
+  permissionNote,
+  retryAction,
+  details,
+  children
+}) {
+  const tone = stateTone2[state];
+  const isProblem = state === "error" || state === "permission-limited" || state === "stale" || state === "partial";
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_core59.Paper, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_core59.Stack, { gap: "md", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_core59.Group, { justify: "space-between", align: "flex-start", gap: "sm", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_core59.Stack, { gap: 4, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_core59.Title, { order: 4, children: title }),
+        description ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_core59.Text, { size: "sm", c: "dimmed", children: description }) : null
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_core59.Badge, { variant: "light", color: tone.color, children: tone.label })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_core59.Group, { gap: "xs", wrap: "wrap", children: [
+      source ? /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_core59.Badge, { variant: "outline", color: "gray", children: [
+        "Source: ",
+        source
+      ] }) : null,
+      freshness ? /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_core59.Badge, { variant: "outline", color: "gray", children: [
+        "Freshness: ",
+        freshness
+      ] }) : null,
+      confidence ? /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_core59.Badge, { variant: "outline", color: "gray", children: [
+        "Confidence: ",
+        confidence
+      ] }) : null,
+      typeof evidenceCount === "number" ? /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_core59.Badge, { variant: "outline", color: "gray", children: [
+        "Evidence: ",
+        evidenceCount
+      ] }) : null
+    ] }),
+    permissionNote ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_core59.Alert, { color: isProblem ? tone.color : "gray", variant: "light", children: permissionNote }) : null,
+    details,
+    children,
+    retryAction
+  ] }) });
+}
+
+// src/ChartTokenPanel.tsx
+var import_core60 = require("@mantine/core");
+var import_jsx_runtime62 = require("react/jsx-runtime");
+function ChartTokenPanel({
+  title,
+  description,
+  summary,
+  state = "ready",
+  legend = [],
+  children,
+  tableFallback,
+  retryAction
+}) {
+  if (state === "loading") {
+    return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(StateBlock, { variant: "loading", title: "Loading chart", description: summary, compact: true, action: retryAction });
+  }
+  if (state === "empty") {
+    return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(StateBlock, { variant: "empty", title: "No chart data", description: summary, compact: true, action: retryAction });
+  }
+  if (state === "below-threshold") {
+    return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(StateBlock, { variant: "not-enough-data", title: "Not enough data for chart", description: summary, compact: true, action: retryAction });
+  }
+  if (state === "error") {
+    return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(StateBlock, { variant: "error", title: "Unable to load chart", description: summary, compact: true, action: retryAction });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_core60.Paper, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_core60.Stack, { gap: "md", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_core60.Group, { justify: "space-between", align: "flex-start", gap: "sm", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_core60.Stack, { gap: 4, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_core60.Title, { order: 4, children: title }),
+        description ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_core60.Text, { size: "sm", c: "dimmed", children: description }) : null
+      ] }),
+      state !== "ready" ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_core60.Badge, { variant: "light", color: state === "permission-limited" ? "grape" : "yellow", children: state.replace("-", " ") }) : null
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_core60.Text, { size: "sm", children: summary }),
+    legend.length ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_core60.Group, { gap: "xs", wrap: "wrap", "aria-label": "Chart legend", children: legend.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_core60.Badge, { variant: "outline", color: "gray", title: typeof item.description === "string" ? item.description : void 0, children: [
+      item.label,
+      ": ",
+      item.token
+    ] }, `${String(item.label)}-${index}`)) }) : null,
+    children,
+    tableFallback ? /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(import_core60.Stack, { gap: "xs", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_core60.Text, { size: "sm", fw: 600, children: "Accessible data fallback" }),
+      tableFallback
+    ] }) : null
+  ] }) });
+}
+
+// src/ReportingSection.tsx
+var import_core61 = require("@mantine/core");
+var import_jsx_runtime63 = require("react/jsx-runtime");
+function ReportingSection({
+  title,
+  description,
+  state = "ready",
+  periodControl,
+  evidence,
+  metrics,
+  chart,
+  table,
+  action,
+  stateMessage,
+  retryAction
+}) {
+  let stateBlock = null;
+  if (state === "loading") {
+    stateBlock = /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(StateBlock, { variant: "loading", title: "Loading report", description: stateMessage ?? "The reporting surface is synchronizing.", compact: true });
+  } else if (state === "empty") {
+    stateBlock = /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(StateBlock, { variant: "empty", title: "No report data", description: stateMessage ?? "No records match this reporting scope yet.", compact: true });
+  } else if (state === "error") {
+    stateBlock = /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(StateBlock, { variant: "error", title: "Unable to load report", description: stateMessage ?? "The report could not be prepared.", compact: true, action: retryAction });
+  } else if (state === "below-threshold") {
+    stateBlock = /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(StateBlock, { variant: "not-enough-data", title: "Not enough data", description: stateMessage ?? "This report is hidden until the threshold is met.", compact: true });
+  } else if (state === "permission-limited") {
+    stateBlock = /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(StateBlock, { variant: "permission", title: "Permission-limited report", description: stateMessage ?? "Some evidence is hidden by access rules.", compact: true, action: retryAction });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_core61.Paper, { withBorder: true, radius: "xl", p: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(import_core61.Stack, { gap: "lg", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(import_core61.Group, { justify: "space-between", align: "flex-start", gap: "md", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(import_core61.Stack, { gap: 4, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_core61.Title, { order: 3, children: title }),
+        description ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_core61.Text, { size: "sm", c: "dimmed", children: description }) : null
+      ] }),
+      action
+    ] }),
+    periodControl,
+    (state === "partial" || state === "stale" || state === "filtered") && stateMessage ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(StateBlock, { variant: "info", title: state === "partial" ? "Partial report" : state === "stale" ? "Stale report" : "Filtered report", description: stateMessage, compact: true }) : null,
+    stateBlock,
+    metrics,
+    chart,
+    table,
+    evidence
+  ] }) });
+}
+
 // src/locales/ar.ts
 var ar = {
   "gds.action.settings": "\u0627\u0644\u0625\u0639\u062F\u0627\u062F\u0627\u062A",
@@ -4783,6 +5490,7 @@ function getGdsMessages(locale) {
   ArticleShell,
   AuthShell,
   BrowseSurface,
+  ChartTokenPanel,
   ChoiceChip,
   ConfirmDialog,
   ConsumerDashboardGrid,
@@ -4793,9 +5501,11 @@ function getGdsMessages(locale) {
   DiscoveryShell,
   DocsCodeBlock,
   DocsPageShell,
+  DocsShell,
   EditorialCard,
   EditorialHero,
   EmptyState,
+  EvidencePanel,
   FeatureBand,
   FilterDrawer,
   FoodMenuSection,
@@ -4808,11 +5518,15 @@ function getGdsMessages(locale) {
   MediaCard,
   MediaField,
   MetricCard,
+  PROVIDER_IDENTITY_REGISTRY,
   PageHeader,
+  PeriodSelector,
   PlaceholderPanel,
   PlaybackSurface,
   ProductCard,
   ProgressCard,
+  ProviderIdentityButton,
+  ProviderIdentityButtonGroup,
   PublicBrandFooter,
   PublicFlowShell,
   PublicFoodCard,
@@ -4824,6 +5538,7 @@ function getGdsMessages(locale) {
   ReferenceLocaleNotice,
   ReferenceSection,
   ReferenceThemeExplorer,
+  ReportingSection,
   SectionPanel,
   SemanticButton,
   ShareButtonGroup,
@@ -4845,13 +5560,18 @@ function getGdsMessages(locale) {
   fr,
   gdsLocales,
   getGdsMessages,
+  getProviderIdentityLabel,
+  getProviderIdentityPolicy,
   getSemanticActionConfig,
   getSemanticActionLabel,
+  getSupportedProviderIdentityIds,
   he,
   hu,
+  isPresentationMode,
   it,
   mergeGdsVocabularyPacks,
   resolveAccentPanelStyles,
   resolveSemanticActionConfig,
+  resolveSurfacePresentationStyles,
   ru
 });