fold-ng 0.27.2 → 0.28.0

package/fesm2022/fold-ng.mjs

@@ -310,9 +310,52 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
                 }]
         }], propDecorators: { foldSurface: [{ type: i0.Input, args: [{ isSignal: true, alias: "foldSurface", required: false }] }] } });
 
-/** Width (px) at or below which the rails collapse and the primary rail becomes
- *  a mobile drawer. Kept in lockstep with the `@media`/`@container` breakpoint
- *  in the stylesheet. */
+/**
+ * Named media queries for {@link FoldAppShellComponent}'s `mobileQuery` input —
+ * the common answers to "when should the shell switch to its single-column,
+ * drawer layout?". Pass a key (`mobileQuery="phoneOrTablet"`) or a raw query built with
+ * {@link foldMediaQuery}.
+ *
+ * - `phone` (default) — viewport ≤768px. The historical behaviour.
+ * - `touchLandscape` — any device with a touch (coarse) pointer held in landscape, regardless
+ *   of width (a phone or tablet on its side), plus `phone`.
+ * - `phoneOrTablet` — `phone`, plus any viewport with a touch (coarse) pointer up to 1366px:
+ *   an iPad in either orientation, including a 12.9" in landscape. A desktop
+ *   with a mouse keeps the rails at the same width.
+ *
+ * The touch presets test `any-pointer: coarse`, not `pointer: coarse`: an iPad
+ * with a trackpad / Magic Keyboard attached can report a FINE primary pointer
+ * while its screen is still touched. The trade-off: a touch-screen laptop
+ * ≤1366px also matches `phoneOrTablet` — pick `phone` or a raw query if that matters.
+ */
+const FOLD_MOBILE_QUERIES = {
+    phone: "(max-width: 768px)",
+    touchLandscape: "(max-width: 768px), (any-pointer: coarse) and (orientation: landscape)",
+    phoneOrTablet: "(max-width: 768px), (any-pointer: coarse) and (max-width: 1366px)",
+};
+/** Marks a raw media query as intended for `mobileQuery`. */
+function foldMediaQuery(query) {
+    // The brand is type-only: every string is a valid carrier at runtime.
+    if (!isBranded(query)) {
+        throw new Error("unreachable");
+    }
+    return query;
+}
+function isBranded(query) {
+    return typeof query === "string";
+}
+function isPresetName(query) {
+    return Object.hasOwn(FOLD_MOBILE_QUERIES, query);
+}
+/** Resolves a named query to its media query; a raw query passes through. */
+function resolveFoldMobileQuery(query) {
+    return isPresetName(query) ? FOLD_MOBILE_QUERIES[query] : query;
+}
+
+/** Shell width (px) at or below which the shell is mobile whatever
+ *  `mobileQuery` says — an embedded/narrow shell (the gallery preview) collapses
+ *  on its own width. Kept in lockstep with the `@container` breakpoint in the
+ *  stylesheet. */
 const MOBILE_BREAKPOINT = 768;
 /**
  * `<fold-app-shell>` — the responsive application skeleton.
@@ -344,7 +387,7 @@ const MOBILE_BREAKPOINT = 768;
  * └────────┴──────────────┴─────────────────────┘
  * ```
  *
- * At ≤768px it becomes a single header + content + footer column and the rails
+ * In the mobile layout (`mobileQuery`, ≤768px by default) it becomes a single header + content + footer column and the rails
  * drop out. How the nav comes back is `mobileNav`:
  * - `"drawer"` (default) — the **primary** rail turns into an off-canvas drawer;
  *   bind `[(mobileNavOpen)]` and give the app a mobile-only hamburger to slide
@@ -357,7 +400,7 @@ const MOBILE_BREAKPOINT = 768;
  * ## Slots
  * | Attribute        | Region                                    |
  * |------------------|-------------------------------------------|
- * | `railPrimary`    | Left rail (intrinsic width — the rail component sizes itself; `railWidth` sets its base via `--fold-shell-rail-width`). At ≤768px it becomes the mobile drawer (see `mobileNavOpen`). |
+ * | `railPrimary`    | Left rail (intrinsic width — the rail component sizes itself; `railWidth` sets its base via `--fold-shell-rail-width`). In the mobile layout (`mobileQuery`, ≤768px by default) it becomes the mobile drawer (see `mobileNavOpen`). |
  * | `railSecondary`  | Second rail (intrinsic width; a component that collapses to `0` hides itself). |
  * | `subheader`      | The band **under** the header — a nav sub-bar, a filter strip, a context ribbon. Same placement rule as the header (`subheaderLayout`: over the content column, or full width above the rails), and like the footer it is **self-collapsing**: an empty slot claims no row. Rendered as a plain `<div>`, so the band brings its own semantics (a `<nav>`, a toolbar). |
  * | `header`         | Top bar (content column, or full-width — see `headerLayout`). Rendered as `<header>` — project plain elements into it, not another `<header>`. |
@@ -369,9 +412,9 @@ const MOBILE_BREAKPOINT = 768;
  * |----------------------|------------------------------------|---------|----------------------------|
  * | `railWidth`          | `--fold-shell-rail-width`           | `64px`  | Base width the primary rail reads (column is intrinsic). |
  * | `headerHeight`       | `--fold-shell-header-height`        | `56px`  | Header row height.         |
- * | `headerHeightMobile` | `--fold-shell-header-height-mobile` | `52px`  | Header height at ≤768px.    |
+ * | `headerHeightMobile` | `--fold-shell-header-height-mobile` | `52px`  | Header height in the mobile layout.    |
  * | `subheaderHeight`    | `--fold-shell-subheader-height`     | `52px`  | Subheader band height.     |
- * | `subheaderHeightMobile` | `--fold-shell-subheader-height-mobile` | `48px` | Subheader height at ≤768px. |
+ * | `subheaderHeightMobile` | `--fold-shell-subheader-height-mobile` | `48px` | Subheader height in the mobile layout. |
  *
  * ## Layout knobs
  * | Input          | Values                | Default   | Meaning                                    |
@@ -381,6 +424,7 @@ const MOBILE_BREAKPOINT = 768;
  * | `footerLayout` | `"inset" \| "full"`   | `"inset"` | `inset` = footer sits under the content column (rails climb its side); `full` = footer spans the full width, below the rails (the usual player-bar look). Ignored when `footerBehavior="scroll"`. |
  * | `footerBehavior`| `"pinned" \| "scroll"`| `"pinned"`| `pinned` = the footer is a fixed row, **always in sight** (a player / status bar) — supports `inset` and `full`. `scroll` = the footer flows at the **end of the content**, revealed when you scroll to the bottom (a legal / support footer) — it lives in the content column (inset). A short page still pushes it to the bottom (the content grows to fill), and a tall page reveals it below the fold; you never manage that. |
  * | `scroll`       | `"scroll" \| "stage"` | `"scroll"`| **Who owns the content scroll.** `scroll` (default) = the shell's content region owns the scroll; pages flow inside it (`fold-page-layout scroll="flow"`), the chrome stays put, a `scroll` footer sits at the true end. `stage` = the content region is a fixed-height stage that does *not* scroll — the page fills it and scrolling happens inside `[foldScrollRegion]` areas (a mail-style split view). See `docs/scroll.md`. |
+ * | `mobileQuery`  | `FoldMobileQuery` | `"phone"` | **When the shell turns mobile.** A key of `FOLD_MOBILE_QUERIES` (`"phone"` ≤768px, `"phoneOrTablet"` adds touch screens up to 1366px — an iPad in landscape —, `"touchLandscape"`) or `foldMediaQuery("<raw query>")`. Followed live; the state is readable as `shell.isMobile()` and on the host as `.is-mobile` / `[data-mobile]`. A shell whose own width is ≤768px is mobile regardless. |
  *
  * ## Elevation (the floating look)
  * The shell owns **structure**, not skin — it drives no `floating` flag. To lift
@@ -440,7 +484,7 @@ const MOBILE_BREAKPOINT = 768;
  * >
  *   <app-menu railPrimary foldElevated /><!-- a floating rail; drop it for flat -->
  *   <app-workspace-rail railSecondary />
- *   <app-header header /><!-- its hamburger toggles navOpen at ≤768px -->
+ *   <app-header header /><!-- its hamburger toggles navOpen when shell.isMobile() -->
  *   <app-nav-bar subheader /><!-- optional; omit it and the band collapses -->
  *   <router-outlet />
  *   <!-- panels / overlays / banners also go in the default slot -->
@@ -456,13 +500,13 @@ class FoldAppShellComponent {
     /** Header row height in px. Omit to inherit `--fold-shell-header-height` (56). */
     headerHeight = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "headerHeight" }] : /* istanbul ignore next */ []));
-    /** Header height at ≤768px in px. Omit to inherit `--fold-shell-header-height-mobile` (52). */
+    /** Header height in the mobile layout in px. Omit to inherit `--fold-shell-header-height-mobile` (52). */
     headerHeightMobile = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "headerHeightMobile" }] : /* istanbul ignore next */ []));
     /** Subheader band height in px. Omit to inherit `--fold-shell-subheader-height` (52). */
     subheaderHeight = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "subheaderHeight" }] : /* istanbul ignore next */ []));
-    /** Subheader band height at ≤768px in px. Omit to inherit `--fold-shell-subheader-height-mobile` (48). */
+    /** Subheader band height in the mobile layout, in px. Omit to inherit `--fold-shell-subheader-height-mobile` (48). */
     subheaderHeightMobile = input(/* @ts-ignore */
     ...(ngDevMode ? [undefined, { debugName: "subheaderHeightMobile" }] : /* istanbul ignore next */ []));
     /** `"full"` spans the header across every column, above the rails; `"inset"` (default) keeps it over the content column. */
@@ -529,7 +573,7 @@ class FoldAppShellComponent {
     /**
      * Two-way: is the mobile nav open?
      *
-     * Below the mobile breakpoint the rails drop out; instead of vanishing, the
+     * In the mobile layout (see `mobileQuery`) the rails drop out; instead of vanishing, the
      * **primary** rail becomes an off-canvas drawer this flag slides in. The app
      * owns the trigger — a mobile-only hamburger in its header, bound
      * `[(mobileNavOpen)]` — and typically flips it back to `false` on navigation;
@@ -540,6 +584,20 @@ class FoldAppShellComponent {
      */
     mobileNavOpen = model(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "mobileNavOpen" }] : /* istanbul ignore next */ []));
+    /**
+     * When the shell switches to its mobile layout (single column, rails out,
+     * primary rail as a drawer): a key of `FOLD_MOBILE_QUERIES` — `"phone"`
+     * (default, ≤768px), `"phoneOrTablet"` (also touch screens up to 1366px, an iPad in
+     * landscape), `"touchLandscape"` — or a raw media query wrapped in
+     * `foldMediaQuery(...)`. Followed live through `matchMedia`; SSR / no
+     * `matchMedia` reads as not matching (wide first paint). A shell whose own
+     * width is ≤768px is mobile regardless (an embedded preview).
+     */
+    mobileQuery = input("phone", /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "mobileQuery" }] : /* istanbul ignore next */ []));
+    /** Live result of `matchMedia(mobileQuery)`. */
+    queryMatches = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "queryMatches" }] : /* istanbul ignore next */ []));
     /** The shell's own width, kept live by a shared `ResizeObserver` primitive. */
     width = observeElementWidth();
     /** The registry of live scroll regions. The shell registers its own content
@@ -549,29 +607,46 @@ class FoldAppShellComponent {
     /** The inner content scroll box (`scroll` mode) / stage (`stage` mode). */
     scrollBox = viewChild("scrollBox", /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "scrollBox" }] : /* istanbul ignore next */ []));
-    /** Whether the shell is narrow enough to collapse — tracked from its **own**
-     *  width, not the viewport, so the drawer engages in step with the CSS
-     *  collapse whether that fires on `@media` (the shell fills the viewport) or
-     *  `@container` (an embedded preview). `0` (unmeasured / SSR) reads as wide —
-     *  the SSR-safe first paint. */
-    isNarrow = computed(() => {
+    /**
+     * Is the shell in its mobile layout? True when `mobileQuery` matches, or when
+     * the shell's own width is ≤768px. Drives the host's `.is-mobile` class /
+     * `data-mobile` attribute (the stylesheet keys the collapse on it) and the
+     * drawer. Public, via `#shell="foldAppShell"`, so the app shows its hamburger
+     * exactly when the drawer can open: `@if (shell.isMobile()) { … }`. `false`
+     * on the server.
+     */
+    isMobile = computed(() => {
         const w = this.width();
-        return w > 0 && w <= MOBILE_BREAKPOINT;
+        return this.queryMatches() || (w > 0 && w <= MOBILE_BREAKPOINT);
     }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "isNarrow" }] : /* istanbul ignore next */ []));
+    ...(ngDevMode ? [{ debugName: "isMobile" }] : /* istanbul ignore next */ []));
     /** The drawer is live only in `drawer` mode, when the shell is narrow **and**
      *  open — so the focus-trap and scrim never engage over a full-width rail, nor
      *  when a `none`-mode shell defers the mobile nav to a launcher. */
-    drawerOpen = computed(() => this.mobileNav() === "drawer" && this.isNarrow() && this.mobileNavOpen(), /* @ts-ignore */
+    drawerOpen = computed(() => this.mobileNav() === "drawer" && this.isMobile() && this.mobileNavOpen(), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "drawerOpen" }] : /* istanbul ignore next */ []));
     constructor() {
         // Widening past the breakpoint closes the drawer so it can't linger as a
         // stuck off-canvas panel once the rails are back in view.
         effect(() => {
-            if (!this.isNarrow() && this.mobileNavOpen()) {
+            if (!this.isMobile() && this.mobileNavOpen()) {
                 this.mobileNavOpen.set(false);
             }
         });
+        // Follow `mobileQuery` live; a new query swaps the listener (onCleanup).
+        // No `matchMedia` (SSR, old test DOM) → stays `false`, the wide first paint.
+        const view = this.document.defaultView;
+        effect((onCleanup) => {
+            const query = resolveFoldMobileQuery(this.mobileQuery());
+            if (!view || typeof view.matchMedia !== "function") {
+                return;
+            }
+            const mql = view.matchMedia(query);
+            this.queryMatches.set(mql.matches);
+            const onChange = (e) => this.queryMatches.set(e.matches);
+            mql.addEventListener("change", onChange);
+            onCleanup(() => mql.removeEventListener("change", onChange));
+        });
         // Register the content scroll box so overlays can freeze it. Client-only
         // (afterNextRender) — SSR has no live scroll to coordinate, and the view
         // child is resolved by then.
@@ -621,7 +696,7 @@ class FoldAppShellComponent {
     subheaderHeightMobileVar = computed(() => pxVar(this.subheaderHeightMobile()), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "subheaderHeightMobileVar" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: FoldAppShellComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: FoldAppShellComponent, isStandalone: true, selector: "fold-app-shell", inputs: { railWidth: { classPropertyName: "railWidth", publicName: "railWidth", isSignal: true, isRequired: false, transformFunction: null }, headerHeight: { classPropertyName: "headerHeight", publicName: "headerHeight", isSignal: true, isRequired: false, transformFunction: null }, headerHeightMobile: { classPropertyName: "headerHeightMobile", publicName: "headerHeightMobile", isSignal: true, isRequired: false, transformFunction: null }, subheaderHeight: { classPropertyName: "subheaderHeight", publicName: "subheaderHeight", isSignal: true, isRequired: false, transformFunction: null }, subheaderHeightMobile: { classPropertyName: "subheaderHeightMobile", publicName: "subheaderHeightMobile", isSignal: true, isRequired: false, transformFunction: null }, headerLayout: { classPropertyName: "headerLayout", publicName: "headerLayout", isSignal: true, isRequired: false, transformFunction: null }, subheaderLayout: { classPropertyName: "subheaderLayout", publicName: "subheaderLayout", isSignal: true, isRequired: false, transformFunction: null }, footerLayout: { classPropertyName: "footerLayout", publicName: "footerLayout", isSignal: true, isRequired: false, transformFunction: null }, footerBehavior: { classPropertyName: "footerBehavior", publicName: "footerBehavior", isSignal: true, isRequired: false, transformFunction: null }, scroll: { classPropertyName: "scroll", publicName: "scroll", isSignal: true, isRequired: false, transformFunction: null }, skipLinkLabel: { classPropertyName: "skipLinkLabel", publicName: "skipLinkLabel", isSignal: true, isRequired: false, transformFunction: null }, drawerLabel: { classPropertyName: "drawerLabel", publicName: "drawerLabel", isSignal: true, isRequired: false, transformFunction: null }, mobileNav: { classPropertyName: "mobileNav", publicName: "mobileNav", isSignal: true, isRequired: false, transformFunction: null }, mobileNavOpen: { classPropertyName: "mobileNavOpen", publicName: "mobileNavOpen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { mobileNavOpen: "mobileNavOpenChange" }, host: { listeners: { "document:keydown.escape": "onEscape()" }, properties: { "style.--fold-shell-rail-width": "railWidthVar()", "style.--fold-shell-header-height": "headerHeightVar()", "style.--fold-shell-header-height-mobile": "headerHeightMobileVar()", "style.--fold-shell-subheader-height": "subheaderHeightVar()", "style.--fold-shell-subheader-height-mobile": "subheaderHeightMobileVar()", "class.header-full": "headerLayout() === \"full\"", "class.subheader-full": "subheaderLayout() === \"full\"", "class.footer-full": "footerLayout() === \"full\"", "class.footer-scroll": "footerBehavior() === \"scroll\"", "class.mobile-drawer": "mobileNav() === \"drawer\"", "class.mobile-nav-open": "drawerOpen()", "attr.data-scroll": "scroll()" } }, viewQueries: [{ propertyName: "scrollBox", first: true, predicate: ["scrollBox"], descendants: true, isSignal: true }], exportAs: ["foldAppShell"], ngImport: i0, template: "<!-- Skip-link: the first Tab stop \u2014 visually hidden until focused, then jumps\n     keyboard users past the rails to <main> (which is focusable, tabindex=-1). -->\n<a class=\"skip-link\" [href]=\"'#' + contentId\" (click)=\"skipToContent($event)\">{{\n  skipLinkLabel()\n}}</a>\n\n<!-- The primary rail. While the mobile drawer is open it is a real modal dialog\n     (named, aria-modal, focus-trapped) and every sibling region is inert \u2014 the\n     same bar the panel host holds; on desktop it's a plain nav rail. -->\n<div\n  class=\"rail-primary\"\n  [id]=\"drawerId\"\n  foldSurface=\"chrome\"\n  [foldFocusTrap]=\"drawerOpen()\"\n  [attr.role]=\"drawerOpen() ? 'dialog' : null\"\n  [attr.aria-modal]=\"drawerOpen() ? 'true' : null\"\n  [attr.aria-label]=\"drawerOpen() ? drawerLabel() : null\"\n  tabindex=\"-1\"\n>\n  <ng-content select=\"[railPrimary]\" />\n</div>\n<div\n  class=\"rail-secondary\"\n  foldSurface=\"chrome\"\n  [attr.inert]=\"drawerOpen() ? '' : null\"\n>\n  <ng-content select=\"[railSecondary]\" />\n</div>\n\n<!-- Mobile drawer scrim \u2014 only rendered while the drawer is actually open (the\n     shell is narrow AND mobileNavOpen). A darkening veil that dismisses on\n     click; Escape and widening close it too. aria-hidden: the focus-trapped\n     drawer + Escape are the accessible path, the scrim is a mouse convenience. -->\n@if (drawerOpen()) {\n  <div class=\"mobile-scrim\" (click)=\"closeMobileNav()\" aria-hidden=\"true\"></div>\n}\n<header\n  class=\"header\"\n  foldSurface=\"chrome\"\n  [attr.inert]=\"drawerOpen() ? '' : null\"\n>\n  <ng-content select=\"[header]\" />\n</header>\n\n<!-- The band under the header: a nav sub-bar, a filter strip, a context ribbon.\n     A plain <div> on purpose \u2014 <header> is taken, and the band's own semantics\n     (a <nav>, a toolbar) belong to what the app projects into it. Like the\n     footer, it claims a grid row only when something is actually projected. -->\n<div\n  class=\"subheader\"\n  foldSurface=\"chrome\"\n  [attr.inert]=\"drawerOpen() ? '' : null\"\n>\n  <ng-content select=\"[subheader]\" />\n</div>\n\n<!-- One footer, stamped in one of two positions \u2014 a grid row (pinned, always in\n     sight) or inside the content scroll (revealed on the way down). A single\n     <ng-content> in a template avoids duplicate-selector projection loss. -->\n<ng-template #footerTpl>\n  <footer\n    class=\"footer\"\n    [class.footer-inflow]=\"footerBehavior() === 'scroll'\"\n    foldSurface=\"chrome\"\n    [attr.inert]=\"drawerOpen() ? '' : null\"\n  >\n    <ng-content select=\"[footer]\" />\n  </footer>\n</ng-template>\n\n<!-- The content region is the fixed, positioned FRAME \u2014 never scrolls, so a\n     docked overlay (the panel host) anchored to it stays put. The scroll lives on\n     the inner `.content-scroll` box; because its containing block is this frame\n     (above the scroll box), an absolutely-positioned panel dock escapes the\n     scroll and floats over the frame. `.content-flow` grows to fill, so a short\n     page still pushes a trailing `scroll` footer to the true bottom. -->\n<main\n  class=\"content\"\n  foldSurface=\"page\"\n  [id]=\"contentId\"\n  tabindex=\"-1\"\n  [attr.inert]=\"drawerOpen() ? '' : null\"\n>\n  <div class=\"content-scroll fold-shell-scroll\" #scrollBox>\n    <div class=\"content-flow\"><ng-content /></div>\n    @if (footerBehavior() === \"scroll\") {\n      <ng-container [ngTemplateOutlet]=\"footerTpl\" />\n    }\n  </div>\n</main>\n@if (footerBehavior() !== \"scroll\") {\n  <ng-container [ngTemplateOutlet]=\"footerTpl\" />\n}\n", styles: ["@charset \"UTF-8\";:host{display:grid;height:100%;width:100%;position:relative;box-sizing:border-box;overflow:hidden;background:var(--fold-color-bg-page);grid-template-columns:auto auto minmax(0,1fr)}:host{--fold-shell-chrome-offset: var(--fold-shell-header-height-mobile, 52px)}:host(:has([subheader])){--fold-shell-chrome-offset: calc( var(--fold-shell-header-height-mobile, 52px) + var(--fold-shell-subheader-height-mobile, 48px) )}.skip-link{position:absolute;top:0;left:0;z-index:60;margin:var(--fold-space-sm, 8px);padding:var(--fold-space-sm) var(--fold-space-md);border:1px solid var(--fold-color-border);border-radius:var(--fold-radius-md);background:var(--fold-color-surface-card);color:var(--fold-color-text);font-size:var(--fold-text-sm);font-weight:var(--fold-weight-semibold);text-decoration:none;transform:translateY(-150%);transition:transform .12s ease}.skip-link:focus{transform:translateY(0)}@media(prefers-reduced-motion:reduce){.skip-link{transition:none}}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):not(:has([subheader])).footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full).footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):has([subheader]).subheader-full.footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr;grid-template-areas:\"header header header\" \"rail-primary rail-secondary content\"}:host(.header-full:not(:has([subheader])).footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr;grid-template-areas:\"header header header\" \"rail-primary rail-secondary content\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr auto;grid-template-areas:\"header header header\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr auto;grid-template-areas:\"header header header\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"header header header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\"}:host(.header-full:has([subheader]):not(.subheader-full).footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"header header header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"header header header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"header header header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"header header header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\"}:host(.header-full:has([subheader]).subheader-full.footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"header header header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"header header header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"header header header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\" \"footer footer footer\"}.rail-primary{grid-area:rail-primary;min-height:0;background:var(--fold-color-bg-rail-primary)}.rail-secondary{grid-area:rail-secondary;min-height:0;background:var(--fold-color-bg-rail-secondary)}.header{grid-area:header;min-width:0;background:var(--fold-color-bg-header)}.subheader{grid-area:subheader;min-width:0;background:var(--fold-color-bg-header)}.footer{grid-area:footer;min-width:0;min-height:0;background:var(--fold-color-bg-header)}.content{grid-area:content;position:relative;display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden}.content:focus{outline:none}.content-scroll{flex:1 1 auto;min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden;scrollbar-width:thin;scrollbar-color:var(--fold-scrollbar-thumb, color-mix(in srgb, currentColor 24%, transparent)) var(--fold-scrollbar-track, transparent);overflow-anchor:auto}:host([data-scroll=scroll]) .content-scroll,:host(.footer-scroll) .content-scroll{overflow-y:auto}.content-flow{flex:1 0 auto;min-width:0;min-height:0;display:flex;flex-direction:column}.footer-inflow{flex:none}.rail-primary:has([data-elevated]),.rail-secondary:has([data-elevated]),.header:has([data-elevated]),.subheader:has([data-elevated]),.footer:has([data-elevated]),.content:has([data-elevated]){padding:var(--fold-surface-inset, var(--fold-space-md))}@media(max-width:768px){:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(:not(.header-full):not(:has([subheader])).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]).subheader-full.footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.header-full:not(:has([subheader])).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]):not(.subheader-full).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]).subheader-full.footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}.rail-primary,.rail-secondary{display:none}:host(.mobile-drawer) .rail-primary{display:block;position:absolute;top:var(--fold-shell-chrome-offset);bottom:0;left:0;z-index:41;width:auto;max-width:85%;overflow-y:auto;visibility:hidden;transform:translate(-100%);transition:transform .24s cubic-bezier(.4,0,.2,1),visibility .24s}:host(.mobile-drawer.mobile-nav-open) .rail-primary{visibility:visible;transform:translate(0)}.mobile-scrim{position:absolute;inset:var(--fold-shell-chrome-offset) 0 0 0;z-index:40;border:0;padding:0;background:var(--fold-color-scrim);animation:fold-shell-scrim-in .24s ease}:host(.mobile-nav-open) .content-scroll{overflow:hidden}}@container (max-width: 1024px){.rail-secondary{display:none}}@container (max-width: 768px){:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(:not(.header-full):not(:has([subheader])).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]).subheader-full.footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.header-full:not(:has([subheader])).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]):not(.subheader-full).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]).subheader-full.footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}.rail-primary,.rail-secondary{display:none}:host(.mobile-drawer) .rail-primary{display:block;position:absolute;top:var(--fold-shell-chrome-offset);bottom:0;left:0;z-index:41;width:auto;max-width:85%;overflow-y:auto;visibility:hidden;transform:translate(-100%);transition:transform .24s cubic-bezier(.4,0,.2,1),visibility .24s}:host(.mobile-drawer.mobile-nav-open) .rail-primary{visibility:visible;transform:translate(0)}.mobile-scrim{position:absolute;inset:var(--fold-shell-chrome-offset) 0 0 0;z-index:40;border:0;padding:0;background:var(--fold-color-scrim);animation:fold-shell-scrim-in .24s ease}:host(.mobile-nav-open) .content-scroll{overflow:hidden}}@keyframes fold-shell-scrim-in{0%{opacity:0}to{opacity:1}}@media(prefers-reduced-motion:reduce){.rail-primary,.mobile-scrim{transition:none;animation:none}}\n"], dependencies: [{ kind: "directive", type: FoldSurfaceDirective, selector: "[foldSurface]", inputs: ["foldSurface"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: FocusTrapDirective, selector: "[foldFocusTrap]", inputs: ["foldFocusTrap"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: FoldAppShellComponent, isStandalone: true, selector: "fold-app-shell", inputs: { railWidth: { classPropertyName: "railWidth", publicName: "railWidth", isSignal: true, isRequired: false, transformFunction: null }, headerHeight: { classPropertyName: "headerHeight", publicName: "headerHeight", isSignal: true, isRequired: false, transformFunction: null }, headerHeightMobile: { classPropertyName: "headerHeightMobile", publicName: "headerHeightMobile", isSignal: true, isRequired: false, transformFunction: null }, subheaderHeight: { classPropertyName: "subheaderHeight", publicName: "subheaderHeight", isSignal: true, isRequired: false, transformFunction: null }, subheaderHeightMobile: { classPropertyName: "subheaderHeightMobile", publicName: "subheaderHeightMobile", isSignal: true, isRequired: false, transformFunction: null }, headerLayout: { classPropertyName: "headerLayout", publicName: "headerLayout", isSignal: true, isRequired: false, transformFunction: null }, subheaderLayout: { classPropertyName: "subheaderLayout", publicName: "subheaderLayout", isSignal: true, isRequired: false, transformFunction: null }, footerLayout: { classPropertyName: "footerLayout", publicName: "footerLayout", isSignal: true, isRequired: false, transformFunction: null }, footerBehavior: { classPropertyName: "footerBehavior", publicName: "footerBehavior", isSignal: true, isRequired: false, transformFunction: null }, scroll: { classPropertyName: "scroll", publicName: "scroll", isSignal: true, isRequired: false, transformFunction: null }, skipLinkLabel: { classPropertyName: "skipLinkLabel", publicName: "skipLinkLabel", isSignal: true, isRequired: false, transformFunction: null }, drawerLabel: { classPropertyName: "drawerLabel", publicName: "drawerLabel", isSignal: true, isRequired: false, transformFunction: null }, mobileNav: { classPropertyName: "mobileNav", publicName: "mobileNav", isSignal: true, isRequired: false, transformFunction: null }, mobileNavOpen: { classPropertyName: "mobileNavOpen", publicName: "mobileNavOpen", isSignal: true, isRequired: false, transformFunction: null }, mobileQuery: { classPropertyName: "mobileQuery", publicName: "mobileQuery", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { mobileNavOpen: "mobileNavOpenChange" }, host: { listeners: { "document:keydown.escape": "onEscape()" }, properties: { "style.--fold-shell-rail-width": "railWidthVar()", "style.--fold-shell-header-height": "headerHeightVar()", "style.--fold-shell-header-height-mobile": "headerHeightMobileVar()", "style.--fold-shell-subheader-height": "subheaderHeightVar()", "style.--fold-shell-subheader-height-mobile": "subheaderHeightMobileVar()", "class.header-full": "headerLayout() === \"full\"", "class.subheader-full": "subheaderLayout() === \"full\"", "class.footer-full": "footerLayout() === \"full\"", "class.footer-scroll": "footerBehavior() === \"scroll\"", "class.mobile-drawer": "mobileNav() === \"drawer\"", "class.mobile-nav-open": "drawerOpen()", "class.is-mobile": "isMobile()", "attr.data-mobile": "isMobile() ? \"\" : null", "attr.data-scroll": "scroll()" } }, viewQueries: [{ propertyName: "scrollBox", first: true, predicate: ["scrollBox"], descendants: true, isSignal: true }], exportAs: ["foldAppShell"], ngImport: i0, template: "<!-- Skip-link: the first Tab stop \u2014 visually hidden until focused, then jumps\n     keyboard users past the rails to <main> (which is focusable, tabindex=-1). -->\n<a class=\"skip-link\" [href]=\"'#' + contentId\" (click)=\"skipToContent($event)\">{{\n  skipLinkLabel()\n}}</a>\n\n<!-- The primary rail. While the mobile drawer is open it is a real modal dialog\n     (named, aria-modal, focus-trapped) and every sibling region is inert \u2014 the\n     same bar the panel host holds; on desktop it's a plain nav rail. -->\n<div\n  class=\"rail-primary\"\n  [id]=\"drawerId\"\n  foldSurface=\"chrome\"\n  [foldFocusTrap]=\"drawerOpen()\"\n  [attr.role]=\"drawerOpen() ? 'dialog' : null\"\n  [attr.aria-modal]=\"drawerOpen() ? 'true' : null\"\n  [attr.aria-label]=\"drawerOpen() ? drawerLabel() : null\"\n  tabindex=\"-1\"\n>\n  <ng-content select=\"[railPrimary]\" />\n</div>\n<div\n  class=\"rail-secondary\"\n  foldSurface=\"chrome\"\n  [attr.inert]=\"drawerOpen() ? '' : null\"\n>\n  <ng-content select=\"[railSecondary]\" />\n</div>\n\n<!-- Mobile drawer scrim \u2014 only rendered while the drawer is actually open (the\n     shell is narrow AND mobileNavOpen). A darkening veil that dismisses on\n     click; Escape and widening close it too. aria-hidden: the focus-trapped\n     drawer + Escape are the accessible path, the scrim is a mouse convenience. -->\n@if (drawerOpen()) {\n  <div class=\"mobile-scrim\" (click)=\"closeMobileNav()\" aria-hidden=\"true\"></div>\n}\n<header\n  class=\"header\"\n  foldSurface=\"chrome\"\n  [attr.inert]=\"drawerOpen() ? '' : null\"\n>\n  <ng-content select=\"[header]\" />\n</header>\n\n<!-- The band under the header: a nav sub-bar, a filter strip, a context ribbon.\n     A plain <div> on purpose \u2014 <header> is taken, and the band's own semantics\n     (a <nav>, a toolbar) belong to what the app projects into it. Like the\n     footer, it claims a grid row only when something is actually projected. -->\n<div\n  class=\"subheader\"\n  foldSurface=\"chrome\"\n  [attr.inert]=\"drawerOpen() ? '' : null\"\n>\n  <ng-content select=\"[subheader]\" />\n</div>\n\n<!-- One footer, stamped in one of two positions \u2014 a grid row (pinned, always in\n     sight) or inside the content scroll (revealed on the way down). A single\n     <ng-content> in a template avoids duplicate-selector projection loss. -->\n<ng-template #footerTpl>\n  <footer\n    class=\"footer\"\n    [class.footer-inflow]=\"footerBehavior() === 'scroll'\"\n    foldSurface=\"chrome\"\n    [attr.inert]=\"drawerOpen() ? '' : null\"\n  >\n    <ng-content select=\"[footer]\" />\n  </footer>\n</ng-template>\n\n<!-- The content region is the fixed, positioned FRAME \u2014 never scrolls, so a\n     docked overlay (the panel host) anchored to it stays put. The scroll lives on\n     the inner `.content-scroll` box; because its containing block is this frame\n     (above the scroll box), an absolutely-positioned panel dock escapes the\n     scroll and floats over the frame. `.content-flow` grows to fill, so a short\n     page still pushes a trailing `scroll` footer to the true bottom. -->\n<main\n  class=\"content\"\n  foldSurface=\"page\"\n  [id]=\"contentId\"\n  tabindex=\"-1\"\n  [attr.inert]=\"drawerOpen() ? '' : null\"\n>\n  <div class=\"content-scroll fold-shell-scroll\" #scrollBox>\n    <div class=\"content-flow\"><ng-content /></div>\n    @if (footerBehavior() === \"scroll\") {\n      <ng-container [ngTemplateOutlet]=\"footerTpl\" />\n    }\n  </div>\n</main>\n@if (footerBehavior() !== \"scroll\") {\n  <ng-container [ngTemplateOutlet]=\"footerTpl\" />\n}\n", styles: ["@charset \"UTF-8\";:host{display:grid;height:100%;width:100%;position:relative;box-sizing:border-box;overflow:hidden;background:var(--fold-color-bg-page);grid-template-columns:auto auto minmax(0,1fr)}:host{--fold-shell-chrome-offset: var(--fold-shell-header-height-mobile, 52px)}:host(:has([subheader])){--fold-shell-chrome-offset: calc( var(--fold-shell-header-height-mobile, 52px) + var(--fold-shell-subheader-height-mobile, 48px) )}.skip-link{position:absolute;top:0;left:0;z-index:60;margin:var(--fold-space-sm, 8px);padding:var(--fold-space-sm) var(--fold-space-md);border:1px solid var(--fold-color-border);border-radius:var(--fold-radius-md);background:var(--fold-color-surface-card);color:var(--fold-color-text);font-size:var(--fold-text-sm);font-weight:var(--fold-weight-semibold);text-decoration:none;transform:translateY(-150%);transition:transform .12s ease}.skip-link:focus{transform:translateY(0)}@media(prefers-reduced-motion:reduce){.skip-link{transition:none}}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):not(:has([subheader])).footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full).footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):has([subheader]).subheader-full.footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr;grid-template-areas:\"header header header\" \"rail-primary rail-secondary content\"}:host(.header-full:not(:has([subheader])).footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr;grid-template-areas:\"header header header\" \"rail-primary rail-secondary content\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr auto;grid-template-areas:\"header header header\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr auto;grid-template-areas:\"header header header\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"header header header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\"}:host(.header-full:has([subheader]):not(.subheader-full).footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"header header header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"header header header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"header header header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"header header header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\"}:host(.header-full:has([subheader]).subheader-full.footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"header header header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"header header header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"header header header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\" \"footer footer footer\"}.rail-primary{grid-area:rail-primary;min-height:0;background:var(--fold-color-bg-rail-primary)}.rail-secondary{grid-area:rail-secondary;min-height:0;background:var(--fold-color-bg-rail-secondary)}.header{grid-area:header;min-width:0;background:var(--fold-color-bg-header)}.subheader{grid-area:subheader;min-width:0;background:var(--fold-color-bg-header)}.footer{grid-area:footer;min-width:0;min-height:0;background:var(--fold-color-bg-header)}.content{grid-area:content;position:relative;display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden}.content:focus{outline:none}.content-scroll{flex:1 1 auto;min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden;scrollbar-width:thin;scrollbar-color:var(--fold-scrollbar-thumb, color-mix(in srgb, currentColor 24%, transparent)) var(--fold-scrollbar-track, transparent);overflow-anchor:auto}:host([data-scroll=scroll]) .content-scroll,:host(.footer-scroll) .content-scroll{overflow-y:auto}.content-flow{flex:1 0 auto;min-width:0;min-height:0;display:flex;flex-direction:column}.footer-inflow{flex:none}.rail-primary:has([data-elevated]),.rail-secondary:has([data-elevated]),.header:has([data-elevated]),.subheader:has([data-elevated]),.footer:has([data-elevated]),.content:has([data-elevated]){padding:var(--fold-surface-inset, var(--fold-space-md))}:host(.is-mobile:not(.header-full):not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.is-mobile:not(.header-full):not(:has([subheader])).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.is-mobile:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.is-mobile:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.is-mobile:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.is-mobile:not(.header-full):has([subheader]):not(.subheader-full).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.is-mobile:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.is-mobile:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.is-mobile:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.is-mobile:not(.header-full):has([subheader]).subheader-full.footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.is-mobile:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.is-mobile:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.is-mobile.header-full:not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.is-mobile.header-full:not(:has([subheader])).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.is-mobile.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.is-mobile.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.is-mobile.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.is-mobile.header-full:has([subheader]):not(.subheader-full).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.is-mobile.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.is-mobile.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.is-mobile.header-full:has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.is-mobile.header-full:has([subheader]).subheader-full.footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.is-mobile.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.is-mobile.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.is-mobile) .rail-primary,:host(.is-mobile) .rail-secondary{display:none}:host(.is-mobile.mobile-drawer) .rail-primary{display:block;position:absolute;top:var(--fold-shell-chrome-offset);bottom:0;left:0;z-index:41;width:auto;max-width:85%;overflow-y:auto;visibility:hidden;transform:translate(-100%);transition:transform .24s cubic-bezier(.4,0,.2,1),visibility .24s}:host(.is-mobile.mobile-drawer.mobile-nav-open) .rail-primary{visibility:visible;transform:translate(0)}:host(.is-mobile) .mobile-scrim{position:absolute;inset:var(--fold-shell-chrome-offset) 0 0 0;z-index:40;border:0;padding:0;background:var(--fold-color-scrim);animation:fold-shell-scrim-in .24s ease}:host(.is-mobile.mobile-nav-open) .content-scroll{overflow:hidden}@container (max-width: 1024px){.rail-secondary{display:none}}@container (max-width: 768px){:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(:not(.header-full):not(:has([subheader])).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]).subheader-full.footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.header-full:not(:has([subheader])).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]):not(.subheader-full).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]).subheader-full.footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host .rail-primary,:host .rail-secondary{display:none}:host(.mobile-drawer) .rail-primary{display:block;position:absolute;top:var(--fold-shell-chrome-offset);bottom:0;left:0;z-index:41;width:auto;max-width:85%;overflow-y:auto;visibility:hidden;transform:translate(-100%);transition:transform .24s cubic-bezier(.4,0,.2,1),visibility .24s}:host(.mobile-drawer.mobile-nav-open) .rail-primary{visibility:visible;transform:translate(0)}:host .mobile-scrim{position:absolute;inset:var(--fold-shell-chrome-offset) 0 0 0;z-index:40;border:0;padding:0;background:var(--fold-color-scrim);animation:fold-shell-scrim-in .24s ease}:host(.mobile-nav-open) .content-scroll{overflow:hidden}}@keyframes fold-shell-scrim-in{0%{opacity:0}to{opacity:1}}@media(prefers-reduced-motion:reduce){.rail-primary,.mobile-scrim{transition:none;animation:none}}\n"], dependencies: [{ kind: "directive", type: FoldSurfaceDirective, selector: "[foldSurface]", inputs: ["foldSurface"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: FocusTrapDirective, selector: "[foldFocusTrap]", inputs: ["foldFocusTrap"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: FoldAppShellComponent, decorators: [{
             type: Component,
@@ -637,9 +712,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
                         "[class.footer-scroll]": 'footerBehavior() === "scroll"',
                         "[class.mobile-drawer]": 'mobileNav() === "drawer"',
                         "[class.mobile-nav-open]": "drawerOpen()",
+                        "[class.is-mobile]": "isMobile()",
+                        "[attr.data-mobile]": 'isMobile() ? "" : null',
                         "[attr.data-scroll]": "scroll()",
-                    }, template: "<!-- Skip-link: the first Tab stop \u2014 visually hidden until focused, then jumps\n     keyboard users past the rails to <main> (which is focusable, tabindex=-1). -->\n<a class=\"skip-link\" [href]=\"'#' + contentId\" (click)=\"skipToContent($event)\">{{\n  skipLinkLabel()\n}}</a>\n\n<!-- The primary rail. While the mobile drawer is open it is a real modal dialog\n     (named, aria-modal, focus-trapped) and every sibling region is inert \u2014 the\n     same bar the panel host holds; on desktop it's a plain nav rail. -->\n<div\n  class=\"rail-primary\"\n  [id]=\"drawerId\"\n  foldSurface=\"chrome\"\n  [foldFocusTrap]=\"drawerOpen()\"\n  [attr.role]=\"drawerOpen() ? 'dialog' : null\"\n  [attr.aria-modal]=\"drawerOpen() ? 'true' : null\"\n  [attr.aria-label]=\"drawerOpen() ? drawerLabel() : null\"\n  tabindex=\"-1\"\n>\n  <ng-content select=\"[railPrimary]\" />\n</div>\n<div\n  class=\"rail-secondary\"\n  foldSurface=\"chrome\"\n  [attr.inert]=\"drawerOpen() ? '' : null\"\n>\n  <ng-content select=\"[railSecondary]\" />\n</div>\n\n<!-- Mobile drawer scrim \u2014 only rendered while the drawer is actually open (the\n     shell is narrow AND mobileNavOpen). A darkening veil that dismisses on\n     click; Escape and widening close it too. aria-hidden: the focus-trapped\n     drawer + Escape are the accessible path, the scrim is a mouse convenience. -->\n@if (drawerOpen()) {\n  <div class=\"mobile-scrim\" (click)=\"closeMobileNav()\" aria-hidden=\"true\"></div>\n}\n<header\n  class=\"header\"\n  foldSurface=\"chrome\"\n  [attr.inert]=\"drawerOpen() ? '' : null\"\n>\n  <ng-content select=\"[header]\" />\n</header>\n\n<!-- The band under the header: a nav sub-bar, a filter strip, a context ribbon.\n     A plain <div> on purpose \u2014 <header> is taken, and the band's own semantics\n     (a <nav>, a toolbar) belong to what the app projects into it. Like the\n     footer, it claims a grid row only when something is actually projected. -->\n<div\n  class=\"subheader\"\n  foldSurface=\"chrome\"\n  [attr.inert]=\"drawerOpen() ? '' : null\"\n>\n  <ng-content select=\"[subheader]\" />\n</div>\n\n<!-- One footer, stamped in one of two positions \u2014 a grid row (pinned, always in\n     sight) or inside the content scroll (revealed on the way down). A single\n     <ng-content> in a template avoids duplicate-selector projection loss. -->\n<ng-template #footerTpl>\n  <footer\n    class=\"footer\"\n    [class.footer-inflow]=\"footerBehavior() === 'scroll'\"\n    foldSurface=\"chrome\"\n    [attr.inert]=\"drawerOpen() ? '' : null\"\n  >\n    <ng-content select=\"[footer]\" />\n  </footer>\n</ng-template>\n\n<!-- The content region is the fixed, positioned FRAME \u2014 never scrolls, so a\n     docked overlay (the panel host) anchored to it stays put. The scroll lives on\n     the inner `.content-scroll` box; because its containing block is this frame\n     (above the scroll box), an absolutely-positioned panel dock escapes the\n     scroll and floats over the frame. `.content-flow` grows to fill, so a short\n     page still pushes a trailing `scroll` footer to the true bottom. -->\n<main\n  class=\"content\"\n  foldSurface=\"page\"\n  [id]=\"contentId\"\n  tabindex=\"-1\"\n  [attr.inert]=\"drawerOpen() ? '' : null\"\n>\n  <div class=\"content-scroll fold-shell-scroll\" #scrollBox>\n    <div class=\"content-flow\"><ng-content /></div>\n    @if (footerBehavior() === \"scroll\") {\n      <ng-container [ngTemplateOutlet]=\"footerTpl\" />\n    }\n  </div>\n</main>\n@if (footerBehavior() !== \"scroll\") {\n  <ng-container [ngTemplateOutlet]=\"footerTpl\" />\n}\n", styles: ["@charset \"UTF-8\";:host{display:grid;height:100%;width:100%;position:relative;box-sizing:border-box;overflow:hidden;background:var(--fold-color-bg-page);grid-template-columns:auto auto minmax(0,1fr)}:host{--fold-shell-chrome-offset: var(--fold-shell-header-height-mobile, 52px)}:host(:has([subheader])){--fold-shell-chrome-offset: calc( var(--fold-shell-header-height-mobile, 52px) + var(--fold-shell-subheader-height-mobile, 48px) )}.skip-link{position:absolute;top:0;left:0;z-index:60;margin:var(--fold-space-sm, 8px);padding:var(--fold-space-sm) var(--fold-space-md);border:1px solid var(--fold-color-border);border-radius:var(--fold-radius-md);background:var(--fold-color-surface-card);color:var(--fold-color-text);font-size:var(--fold-text-sm);font-weight:var(--fold-weight-semibold);text-decoration:none;transform:translateY(-150%);transition:transform .12s ease}.skip-link:focus{transform:translateY(0)}@media(prefers-reduced-motion:reduce){.skip-link{transition:none}}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):not(:has([subheader])).footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full).footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):has([subheader]).subheader-full.footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr;grid-template-areas:\"header header header\" \"rail-primary rail-secondary content\"}:host(.header-full:not(:has([subheader])).footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr;grid-template-areas:\"header header header\" \"rail-primary rail-secondary content\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr auto;grid-template-areas:\"header header header\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr auto;grid-template-areas:\"header header header\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"header header header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\"}:host(.header-full:has([subheader]):not(.subheader-full).footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"header header header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"header header header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"header header header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"header header header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\"}:host(.header-full:has([subheader]).subheader-full.footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"header header header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"header header header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"header header header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\" \"footer footer footer\"}.rail-primary{grid-area:rail-primary;min-height:0;background:var(--fold-color-bg-rail-primary)}.rail-secondary{grid-area:rail-secondary;min-height:0;background:var(--fold-color-bg-rail-secondary)}.header{grid-area:header;min-width:0;background:var(--fold-color-bg-header)}.subheader{grid-area:subheader;min-width:0;background:var(--fold-color-bg-header)}.footer{grid-area:footer;min-width:0;min-height:0;background:var(--fold-color-bg-header)}.content{grid-area:content;position:relative;display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden}.content:focus{outline:none}.content-scroll{flex:1 1 auto;min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden;scrollbar-width:thin;scrollbar-color:var(--fold-scrollbar-thumb, color-mix(in srgb, currentColor 24%, transparent)) var(--fold-scrollbar-track, transparent);overflow-anchor:auto}:host([data-scroll=scroll]) .content-scroll,:host(.footer-scroll) .content-scroll{overflow-y:auto}.content-flow{flex:1 0 auto;min-width:0;min-height:0;display:flex;flex-direction:column}.footer-inflow{flex:none}.rail-primary:has([data-elevated]),.rail-secondary:has([data-elevated]),.header:has([data-elevated]),.subheader:has([data-elevated]),.footer:has([data-elevated]),.content:has([data-elevated]){padding:var(--fold-surface-inset, var(--fold-space-md))}@media(max-width:768px){:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(:not(.header-full):not(:has([subheader])).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]).subheader-full.footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.header-full:not(:has([subheader])).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]):not(.subheader-full).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]).subheader-full.footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}.rail-primary,.rail-secondary{display:none}:host(.mobile-drawer) .rail-primary{display:block;position:absolute;top:var(--fold-shell-chrome-offset);bottom:0;left:0;z-index:41;width:auto;max-width:85%;overflow-y:auto;visibility:hidden;transform:translate(-100%);transition:transform .24s cubic-bezier(.4,0,.2,1),visibility .24s}:host(.mobile-drawer.mobile-nav-open) .rail-primary{visibility:visible;transform:translate(0)}.mobile-scrim{position:absolute;inset:var(--fold-shell-chrome-offset) 0 0 0;z-index:40;border:0;padding:0;background:var(--fold-color-scrim);animation:fold-shell-scrim-in .24s ease}:host(.mobile-nav-open) .content-scroll{overflow:hidden}}@container (max-width: 1024px){.rail-secondary{display:none}}@container (max-width: 768px){:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(:not(.header-full):not(:has([subheader])).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]).subheader-full.footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.header-full:not(:has([subheader])).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]):not(.subheader-full).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]).subheader-full.footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}.rail-primary,.rail-secondary{display:none}:host(.mobile-drawer) .rail-primary{display:block;position:absolute;top:var(--fold-shell-chrome-offset);bottom:0;left:0;z-index:41;width:auto;max-width:85%;overflow-y:auto;visibility:hidden;transform:translate(-100%);transition:transform .24s cubic-bezier(.4,0,.2,1),visibility .24s}:host(.mobile-drawer.mobile-nav-open) .rail-primary{visibility:visible;transform:translate(0)}.mobile-scrim{position:absolute;inset:var(--fold-shell-chrome-offset) 0 0 0;z-index:40;border:0;padding:0;background:var(--fold-color-scrim);animation:fold-shell-scrim-in .24s ease}:host(.mobile-nav-open) .content-scroll{overflow:hidden}}@keyframes fold-shell-scrim-in{0%{opacity:0}to{opacity:1}}@media(prefers-reduced-motion:reduce){.rail-primary,.mobile-scrim{transition:none;animation:none}}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { railWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "railWidth", required: false }] }], headerHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerHeight", required: false }] }], headerHeightMobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerHeightMobile", required: false }] }], subheaderHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "subheaderHeight", required: false }] }], subheaderHeightMobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "subheaderHeightMobile", required: false }] }], headerLayout: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerLayout", required: false }] }], subheaderLayout: [{ type: i0.Input, args: [{ isSignal: true, alias: "subheaderLayout", required: false }] }], footerLayout: [{ type: i0.Input, args: [{ isSignal: true, alias: "footerLayout", required: false }] }], footerBehavior: [{ type: i0.Input, args: [{ isSignal: true, alias: "footerBehavior", required: false }] }], scroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "scroll", required: false }] }], skipLinkLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "skipLinkLabel", required: false }] }], drawerLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "drawerLabel", required: false }] }], mobileNav: [{ type: i0.Input, args: [{ isSignal: true, alias: "mobileNav", required: false }] }], mobileNavOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "mobileNavOpen", required: false }] }, { type: i0.Output, args: ["mobileNavOpenChange"] }], scrollBox: [{ type: i0.ViewChild, args: ["scrollBox", { isSignal: true }] }], onEscape: [{
+                    }, template: "<!-- Skip-link: the first Tab stop \u2014 visually hidden until focused, then jumps\n     keyboard users past the rails to <main> (which is focusable, tabindex=-1). -->\n<a class=\"skip-link\" [href]=\"'#' + contentId\" (click)=\"skipToContent($event)\">{{\n  skipLinkLabel()\n}}</a>\n\n<!-- The primary rail. While the mobile drawer is open it is a real modal dialog\n     (named, aria-modal, focus-trapped) and every sibling region is inert \u2014 the\n     same bar the panel host holds; on desktop it's a plain nav rail. -->\n<div\n  class=\"rail-primary\"\n  [id]=\"drawerId\"\n  foldSurface=\"chrome\"\n  [foldFocusTrap]=\"drawerOpen()\"\n  [attr.role]=\"drawerOpen() ? 'dialog' : null\"\n  [attr.aria-modal]=\"drawerOpen() ? 'true' : null\"\n  [attr.aria-label]=\"drawerOpen() ? drawerLabel() : null\"\n  tabindex=\"-1\"\n>\n  <ng-content select=\"[railPrimary]\" />\n</div>\n<div\n  class=\"rail-secondary\"\n  foldSurface=\"chrome\"\n  [attr.inert]=\"drawerOpen() ? '' : null\"\n>\n  <ng-content select=\"[railSecondary]\" />\n</div>\n\n<!-- Mobile drawer scrim \u2014 only rendered while the drawer is actually open (the\n     shell is narrow AND mobileNavOpen). A darkening veil that dismisses on\n     click; Escape and widening close it too. aria-hidden: the focus-trapped\n     drawer + Escape are the accessible path, the scrim is a mouse convenience. -->\n@if (drawerOpen()) {\n  <div class=\"mobile-scrim\" (click)=\"closeMobileNav()\" aria-hidden=\"true\"></div>\n}\n<header\n  class=\"header\"\n  foldSurface=\"chrome\"\n  [attr.inert]=\"drawerOpen() ? '' : null\"\n>\n  <ng-content select=\"[header]\" />\n</header>\n\n<!-- The band under the header: a nav sub-bar, a filter strip, a context ribbon.\n     A plain <div> on purpose \u2014 <header> is taken, and the band's own semantics\n     (a <nav>, a toolbar) belong to what the app projects into it. Like the\n     footer, it claims a grid row only when something is actually projected. -->\n<div\n  class=\"subheader\"\n  foldSurface=\"chrome\"\n  [attr.inert]=\"drawerOpen() ? '' : null\"\n>\n  <ng-content select=\"[subheader]\" />\n</div>\n\n<!-- One footer, stamped in one of two positions \u2014 a grid row (pinned, always in\n     sight) or inside the content scroll (revealed on the way down). A single\n     <ng-content> in a template avoids duplicate-selector projection loss. -->\n<ng-template #footerTpl>\n  <footer\n    class=\"footer\"\n    [class.footer-inflow]=\"footerBehavior() === 'scroll'\"\n    foldSurface=\"chrome\"\n    [attr.inert]=\"drawerOpen() ? '' : null\"\n  >\n    <ng-content select=\"[footer]\" />\n  </footer>\n</ng-template>\n\n<!-- The content region is the fixed, positioned FRAME \u2014 never scrolls, so a\n     docked overlay (the panel host) anchored to it stays put. The scroll lives on\n     the inner `.content-scroll` box; because its containing block is this frame\n     (above the scroll box), an absolutely-positioned panel dock escapes the\n     scroll and floats over the frame. `.content-flow` grows to fill, so a short\n     page still pushes a trailing `scroll` footer to the true bottom. -->\n<main\n  class=\"content\"\n  foldSurface=\"page\"\n  [id]=\"contentId\"\n  tabindex=\"-1\"\n  [attr.inert]=\"drawerOpen() ? '' : null\"\n>\n  <div class=\"content-scroll fold-shell-scroll\" #scrollBox>\n    <div class=\"content-flow\"><ng-content /></div>\n    @if (footerBehavior() === \"scroll\") {\n      <ng-container [ngTemplateOutlet]=\"footerTpl\" />\n    }\n  </div>\n</main>\n@if (footerBehavior() !== \"scroll\") {\n  <ng-container [ngTemplateOutlet]=\"footerTpl\" />\n}\n", styles: ["@charset \"UTF-8\";:host{display:grid;height:100%;width:100%;position:relative;box-sizing:border-box;overflow:hidden;background:var(--fold-color-bg-page);grid-template-columns:auto auto minmax(0,1fr)}:host{--fold-shell-chrome-offset: var(--fold-shell-header-height-mobile, 52px)}:host(:has([subheader])){--fold-shell-chrome-offset: calc( var(--fold-shell-header-height-mobile, 52px) + var(--fold-shell-subheader-height-mobile, 48px) )}.skip-link{position:absolute;top:0;left:0;z-index:60;margin:var(--fold-space-sm, 8px);padding:var(--fold-space-sm) var(--fold-space-md);border:1px solid var(--fold-color-border);border-radius:var(--fold-radius-md);background:var(--fold-color-surface-card);color:var(--fold-color-text);font-size:var(--fold-text-sm);font-weight:var(--fold-weight-semibold);text-decoration:none;transform:translateY(-150%);transition:transform .12s ease}.skip-link:focus{transform:translateY(0)}@media(prefers-reduced-motion:reduce){.skip-link{transition:none}}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):not(:has([subheader])).footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full).footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):has([subheader]).subheader-full.footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"rail-primary rail-secondary header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"rail-primary rail-secondary header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr;grid-template-areas:\"header header header\" \"rail-primary rail-secondary content\"}:host(.header-full:not(:has([subheader])).footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr;grid-template-areas:\"header header header\" \"rail-primary rail-secondary content\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr auto;grid-template-areas:\"header header header\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) 1fr auto;grid-template-areas:\"header header header\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"header header header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\"}:host(.header-full:has([subheader]):not(.subheader-full).footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"header header header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"header header header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"header header header\" \"rail-primary rail-secondary subheader\" \"rail-primary rail-secondary content\" \"footer footer footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"header header header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\"}:host(.header-full:has([subheader]).subheader-full.footer-scroll){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr;grid-template-areas:\"header header header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"header header header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\" \"rail-primary rail-secondary footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-rows:var(--fold-shell-header-height, 56px) var(--fold-shell-subheader-height, 52px) 1fr auto;grid-template-areas:\"header header header\" \"subheader subheader subheader\" \"rail-primary rail-secondary content\" \"footer footer footer\"}.rail-primary{grid-area:rail-primary;min-height:0;background:var(--fold-color-bg-rail-primary)}.rail-secondary{grid-area:rail-secondary;min-height:0;background:var(--fold-color-bg-rail-secondary)}.header{grid-area:header;min-width:0;background:var(--fold-color-bg-header)}.subheader{grid-area:subheader;min-width:0;background:var(--fold-color-bg-header)}.footer{grid-area:footer;min-width:0;min-height:0;background:var(--fold-color-bg-header)}.content{grid-area:content;position:relative;display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden}.content:focus{outline:none}.content-scroll{flex:1 1 auto;min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden;scrollbar-width:thin;scrollbar-color:var(--fold-scrollbar-thumb, color-mix(in srgb, currentColor 24%, transparent)) var(--fold-scrollbar-track, transparent);overflow-anchor:auto}:host([data-scroll=scroll]) .content-scroll,:host(.footer-scroll) .content-scroll{overflow-y:auto}.content-flow{flex:1 0 auto;min-width:0;min-height:0;display:flex;flex-direction:column}.footer-inflow{flex:none}.rail-primary:has([data-elevated]),.rail-secondary:has([data-elevated]),.header:has([data-elevated]),.subheader:has([data-elevated]),.footer:has([data-elevated]),.content:has([data-elevated]){padding:var(--fold-surface-inset, var(--fold-space-md))}:host(.is-mobile:not(.header-full):not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.is-mobile:not(.header-full):not(:has([subheader])).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.is-mobile:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.is-mobile:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.is-mobile:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.is-mobile:not(.header-full):has([subheader]):not(.subheader-full).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.is-mobile:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.is-mobile:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.is-mobile:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.is-mobile:not(.header-full):has([subheader]).subheader-full.footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.is-mobile:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.is-mobile:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.is-mobile.header-full:not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.is-mobile.header-full:not(:has([subheader])).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.is-mobile.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.is-mobile.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.is-mobile.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.is-mobile.header-full:has([subheader]):not(.subheader-full).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.is-mobile.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.is-mobile.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.is-mobile.header-full:has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.is-mobile.header-full:has([subheader]).subheader-full.footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.is-mobile.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.is-mobile.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.is-mobile) .rail-primary,:host(.is-mobile) .rail-secondary{display:none}:host(.is-mobile.mobile-drawer) .rail-primary{display:block;position:absolute;top:var(--fold-shell-chrome-offset);bottom:0;left:0;z-index:41;width:auto;max-width:85%;overflow-y:auto;visibility:hidden;transform:translate(-100%);transition:transform .24s cubic-bezier(.4,0,.2,1),visibility .24s}:host(.is-mobile.mobile-drawer.mobile-nav-open) .rail-primary{visibility:visible;transform:translate(0)}:host(.is-mobile) .mobile-scrim{position:absolute;inset:var(--fold-shell-chrome-offset) 0 0 0;z-index:40;border:0;padding:0;background:var(--fold-color-scrim);animation:fold-shell-scrim-in .24s ease}:host(.is-mobile.mobile-nav-open) .content-scroll{overflow:hidden}@container (max-width: 1024px){.rail-secondary{display:none}}@container (max-width: 768px){:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(:not(.header-full):not(:has([subheader])).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(:not(.header-full):not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]).subheader-full.footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(:not(.header-full):has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.header-full:not(:has([subheader])).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr;grid-template-areas:\"header\" \"content\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.header-full:not(:has([subheader])):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) 1fr auto;grid-template-areas:\"header\" \"content\" \"footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]):not(.subheader-full).footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]):not(.subheader-full):not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):not(:has([footer]))){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]).subheader-full.footer-scroll){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr;grid-template-areas:\"header\" \"subheader\" \"content\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]):not(.footer-full)){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host(.header-full:has([subheader]).subheader-full:not(.footer-scroll):has([footer]).footer-full){grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fold-shell-header-height-mobile, 52px) var(--fold-shell-subheader-height-mobile, 48px) 1fr auto;grid-template-areas:\"header\" \"subheader\" \"content\" \"footer\"}:host .rail-primary,:host .rail-secondary{display:none}:host(.mobile-drawer) .rail-primary{display:block;position:absolute;top:var(--fold-shell-chrome-offset);bottom:0;left:0;z-index:41;width:auto;max-width:85%;overflow-y:auto;visibility:hidden;transform:translate(-100%);transition:transform .24s cubic-bezier(.4,0,.2,1),visibility .24s}:host(.mobile-drawer.mobile-nav-open) .rail-primary{visibility:visible;transform:translate(0)}:host .mobile-scrim{position:absolute;inset:var(--fold-shell-chrome-offset) 0 0 0;z-index:40;border:0;padding:0;background:var(--fold-color-scrim);animation:fold-shell-scrim-in .24s ease}:host(.mobile-nav-open) .content-scroll{overflow:hidden}}@keyframes fold-shell-scrim-in{0%{opacity:0}to{opacity:1}}@media(prefers-reduced-motion:reduce){.rail-primary,.mobile-scrim{transition:none;animation:none}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { railWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "railWidth", required: false }] }], headerHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerHeight", required: false }] }], headerHeightMobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerHeightMobile", required: false }] }], subheaderHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "subheaderHeight", required: false }] }], subheaderHeightMobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "subheaderHeightMobile", required: false }] }], headerLayout: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerLayout", required: false }] }], subheaderLayout: [{ type: i0.Input, args: [{ isSignal: true, alias: "subheaderLayout", required: false }] }], footerLayout: [{ type: i0.Input, args: [{ isSignal: true, alias: "footerLayout", required: false }] }], footerBehavior: [{ type: i0.Input, args: [{ isSignal: true, alias: "footerBehavior", required: false }] }], scroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "scroll", required: false }] }], skipLinkLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "skipLinkLabel", required: false }] }], drawerLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "drawerLabel", required: false }] }], mobileNav: [{ type: i0.Input, args: [{ isSignal: true, alias: "mobileNav", required: false }] }], mobileNavOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "mobileNavOpen", required: false }] }, { type: i0.Output, args: ["mobileNavOpenChange"] }], mobileQuery: [{ type: i0.Input, args: [{ isSignal: true, alias: "mobileQuery", required: false }] }], scrollBox: [{ type: i0.ViewChild, args: ["scrollBox", { isSignal: true }] }], onEscape: [{
                 type: HostListener,
                 args: ["document:keydown.escape"]
             }] } });
@@ -15074,5 +15151,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { FOLD_AUTO_PALETTES, FOLD_BLUR_TOKENS, FOLD_BUILTIN_ICONS, FOLD_BUILTIN_ICON_CATEGORIES, FOLD_CALENDAR_DEFAULT_LABELS, FOLD_CALENDAR_FORMATS, FOLD_CALENDAR_LABELS, FOLD_COMMON_DEFAULT_LABELS, FOLD_COMMON_LABELS, FOLD_DATA_TABLE_DEFAULT_LABELS, FOLD_DATA_TABLE_LABELS, FOLD_DEFAULT_WEEKEND_DAYS, FOLD_FALLBACK_WEEK_INFO, FOLD_FONT_TOKENS, FOLD_INLINE_CONFIRM_DEFAULT_LABELS, FOLD_INLINE_CONFIRM_LABELS, FOLD_LEADING_TOKENS, FOLD_MINUTES_PER_DAY, FOLD_MOTION_TOKENS, FOLD_PAGINATOR_DEFAULT_LABELS, FOLD_PAGINATOR_LABELS, FOLD_PALETTE_DEFAULT, FOLD_PANEL_CLOSE_LABEL, FOLD_PANEL_DEFAULTS, FOLD_RADIUS_TOKENS, FOLD_SEMANTIC_COLOR_TOKENS, FOLD_SHADOW_TOKENS, FOLD_SPACE_TOKENS, FOLD_TEXT_TOKENS, FOLD_TOAST_CONFIG, FOLD_TRACKING_TOKENS, FOLD_WEIGHT_TOKENS, FoldAppShellComponent, FoldAsideLayoutComponent, FoldAvatarComponent, FoldAvatarDetailComponent, FoldAvatarListComponent, FoldBackLinkComponent, FoldBadgeComponent, FoldBreadcrumbComponent, FoldButtonComponent, FoldButtonIconComponent, FoldCalendarAgendaComponent, FoldCalendarChromeDirective, FoldCalendarDayComponent, FoldCalendarDayDirective, FoldCalendarEventDirective, FoldCalendarHeadingDirective, FoldCalendarListComponent, FoldCalendarMonthComponent, FoldCalendarOverflowDirective, FoldCalendarSourceFilterComponent, FoldCalendarTimegridComponent, FoldCalendarTitleDirective, FoldCalendarToolbarComponent, FoldCalendarWeekComponent, FoldCalloutComponent, FoldCardComponent, FoldCheckboxComponent, FoldChecklistComponent, FoldChoiceRowComponent, FoldContextCardComponent, FoldDangerZoneComponent, FoldDataTableCellDirective, FoldDataTableComponent, FoldDataTableRowCardDirective, FoldDataTableRowDetailDirective, FoldDataTableRowNoteDirective, FoldDateComponent, FoldDisclosureComponent, FoldDropdownComponent, FoldDropdownItemComponent, FoldElementTitleComponent, FoldElevatedDirective, FoldEmptyStateComponent, FoldFieldComponent, FoldFieldIdDirective, FoldFieldListComponent, FoldFieldsetComponent, FoldFileDropzoneComponent, FoldHeroCardComponent, FoldHeroSectionComponent, FoldIconComponent, FoldIconRegistry, FoldIdService, FoldInfoComponent, FoldInlineConfirmComponent, FoldInputComponent, FoldLinkComponent, FoldListboxComponent, FoldLoadingStateComponent, FoldMenuComponent, FoldMenuItemComponent, FoldMenuSectionComponent, FoldMenuSeparatorComponent, FoldMeterComponent, FoldMultiselectComponent, FoldNavGroupComponent, FoldNavLauncherComponent, FoldNavLayoutComponent, FoldNavTileComponent, FoldNumberInputComponent, FoldOptgroupComponent, FoldOptionComponent, FoldPageLayoutComponent, FoldPageSectionComponent, FoldPageTitleDirective, FoldPaginatorComponent, FoldPaletteRegistry, FoldPanelBodyComponent, FoldPanelComponentOutletDirective, FoldPanelFooterComponent, FoldPanelHeaderComponent, FoldPanelHostComponent, FoldPanelHostService, FoldPanelRef, FoldPanelToggle, FoldPasswordFieldComponent, FoldPopoverComponent, FoldPopoverTriggerDirective, FoldRangeSliderComponent, FoldRepeatPressDirective, FoldScrollRegionDirective, FoldSearchComponent, FoldSelectComponent, FoldSliderComponent, FoldSpinnerComponent, FoldStatusBadgeComponent, FoldStickyColumnDirective, FoldSurfaceDirective, FoldTabPanelComponent, FoldTabsComponent, FoldTextareaComponent, FoldTimeComponent, FoldTimelineComponent, FoldToastComponent, FoldToastContainerComponent, FoldToastService, FoldToggleIconComponent, FoldViewNavComponent, FoldViewToggleComponent, ScrollRegionRegistry, autoUpdate, computePlacement, foldAddDays, foldAddMinutes, foldAddMonths, foldBlurVar, foldBuildAgenda, foldBuildDay, foldBuildMonthGrid, foldBuildTimeGrid, foldBuildWeek, foldCalendarNextFocus, foldCardBandChrome, foldColorProperty, foldColorVar, foldCountActionable, foldDaysBetween, foldDefaultPasswordRules, foldEndOfMonth, foldEventsInRange, foldEventsOnDay, foldFilterBySource, foldFontVar, foldFromMinutes, foldFromNativeDate, foldFromTemporal, foldHashSeed, foldIsActionable, foldIsCalendarDate, foldIsCalendarTime, foldIsTimed, foldIsWeekend, foldIsoWeek, foldIsoWeekYear, foldLayOutOverlaps, foldLeadingVar, foldLocaleWeekInfo, foldMotionVar, foldRadiusVar, foldRangeForView, foldRegexRule, foldResolvePalette, foldShadowVar, foldShiftDate, foldSpaceVar, foldStartOfMonth, foldStartOfWeek, foldTextVar, foldToMinutes, foldToNativeDate, foldToday, foldTrackingVar, foldViewTitle, foldWeekdayIndex, foldWeekdayOf, foldWeightVar, isFoldSelectOptionGroup, observeElementWidth, provideFoldCalendarLabels, provideFoldCommonLabels, provideFoldDataTableLabels, provideFoldIcons, provideFoldInlineConfirmLabels, provideFoldPaginatorLabels, provideFoldPalette, provideFoldPanelDefaults, provideFoldPanelLabels, provideFoldToasts };
+export { FOLD_AUTO_PALETTES, FOLD_BLUR_TOKENS, FOLD_BUILTIN_ICONS, FOLD_BUILTIN_ICON_CATEGORIES, FOLD_CALENDAR_DEFAULT_LABELS, FOLD_CALENDAR_FORMATS, FOLD_CALENDAR_LABELS, FOLD_COMMON_DEFAULT_LABELS, FOLD_COMMON_LABELS, FOLD_DATA_TABLE_DEFAULT_LABELS, FOLD_DATA_TABLE_LABELS, FOLD_DEFAULT_WEEKEND_DAYS, FOLD_FALLBACK_WEEK_INFO, FOLD_FONT_TOKENS, FOLD_INLINE_CONFIRM_DEFAULT_LABELS, FOLD_INLINE_CONFIRM_LABELS, FOLD_LEADING_TOKENS, FOLD_MINUTES_PER_DAY, FOLD_MOBILE_QUERIES, FOLD_MOTION_TOKENS, FOLD_PAGINATOR_DEFAULT_LABELS, FOLD_PAGINATOR_LABELS, FOLD_PALETTE_DEFAULT, FOLD_PANEL_CLOSE_LABEL, FOLD_PANEL_DEFAULTS, FOLD_RADIUS_TOKENS, FOLD_SEMANTIC_COLOR_TOKENS, FOLD_SHADOW_TOKENS, FOLD_SPACE_TOKENS, FOLD_TEXT_TOKENS, FOLD_TOAST_CONFIG, FOLD_TRACKING_TOKENS, FOLD_WEIGHT_TOKENS, FoldAppShellComponent, FoldAsideLayoutComponent, FoldAvatarComponent, FoldAvatarDetailComponent, FoldAvatarListComponent, FoldBackLinkComponent, FoldBadgeComponent, FoldBreadcrumbComponent, FoldButtonComponent, FoldButtonIconComponent, FoldCalendarAgendaComponent, FoldCalendarChromeDirective, FoldCalendarDayComponent, FoldCalendarDayDirective, FoldCalendarEventDirective, FoldCalendarHeadingDirective, FoldCalendarListComponent, FoldCalendarMonthComponent, FoldCalendarOverflowDirective, FoldCalendarSourceFilterComponent, FoldCalendarTimegridComponent, FoldCalendarTitleDirective, FoldCalendarToolbarComponent, FoldCalendarWeekComponent, FoldCalloutComponent, FoldCardComponent, FoldCheckboxComponent, FoldChecklistComponent, FoldChoiceRowComponent, FoldContextCardComponent, FoldDangerZoneComponent, FoldDataTableCellDirective, FoldDataTableComponent, FoldDataTableRowCardDirective, FoldDataTableRowDetailDirective, FoldDataTableRowNoteDirective, FoldDateComponent, FoldDisclosureComponent, FoldDropdownComponent, FoldDropdownItemComponent, FoldElementTitleComponent, FoldElevatedDirective, FoldEmptyStateComponent, FoldFieldComponent, FoldFieldIdDirective, FoldFieldListComponent, FoldFieldsetComponent, FoldFileDropzoneComponent, FoldHeroCardComponent, FoldHeroSectionComponent, FoldIconComponent, FoldIconRegistry, FoldIdService, FoldInfoComponent, FoldInlineConfirmComponent, FoldInputComponent, FoldLinkComponent, FoldListboxComponent, FoldLoadingStateComponent, FoldMenuComponent, FoldMenuItemComponent, FoldMenuSectionComponent, FoldMenuSeparatorComponent, FoldMeterComponent, FoldMultiselectComponent, FoldNavGroupComponent, FoldNavLauncherComponent, FoldNavLayoutComponent, FoldNavTileComponent, FoldNumberInputComponent, FoldOptgroupComponent, FoldOptionComponent, FoldPageLayoutComponent, FoldPageSectionComponent, FoldPageTitleDirective, FoldPaginatorComponent, FoldPaletteRegistry, FoldPanelBodyComponent, FoldPanelComponentOutletDirective, FoldPanelFooterComponent, FoldPanelHeaderComponent, FoldPanelHostComponent, FoldPanelHostService, FoldPanelRef, FoldPanelToggle, FoldPasswordFieldComponent, FoldPopoverComponent, FoldPopoverTriggerDirective, FoldRangeSliderComponent, FoldRepeatPressDirective, FoldScrollRegionDirective, FoldSearchComponent, FoldSelectComponent, FoldSliderComponent, FoldSpinnerComponent, FoldStatusBadgeComponent, FoldStickyColumnDirective, FoldSurfaceDirective, FoldTabPanelComponent, FoldTabsComponent, FoldTextareaComponent, FoldTimeComponent, FoldTimelineComponent, FoldToastComponent, FoldToastContainerComponent, FoldToastService, FoldToggleIconComponent, FoldViewNavComponent, FoldViewToggleComponent, ScrollRegionRegistry, autoUpdate, computePlacement, foldAddDays, foldAddMinutes, foldAddMonths, foldBlurVar, foldBuildAgenda, foldBuildDay, foldBuildMonthGrid, foldBuildTimeGrid, foldBuildWeek, foldCalendarNextFocus, foldCardBandChrome, foldColorProperty, foldColorVar, foldCountActionable, foldDaysBetween, foldDefaultPasswordRules, foldEndOfMonth, foldEventsInRange, foldEventsOnDay, foldFilterBySource, foldFontVar, foldFromMinutes, foldFromNativeDate, foldFromTemporal, foldHashSeed, foldIsActionable, foldIsCalendarDate, foldIsCalendarTime, foldIsTimed, foldIsWeekend, foldIsoWeek, foldIsoWeekYear, foldLayOutOverlaps, foldLeadingVar, foldLocaleWeekInfo, foldMediaQuery, foldMotionVar, foldRadiusVar, foldRangeForView, foldRegexRule, foldResolvePalette, foldShadowVar, foldShiftDate, foldSpaceVar, foldStartOfMonth, foldStartOfWeek, foldTextVar, foldToMinutes, foldToNativeDate, foldToday, foldTrackingVar, foldViewTitle, foldWeekdayIndex, foldWeekdayOf, foldWeightVar, isFoldSelectOptionGroup, observeElementWidth, provideFoldCalendarLabels, provideFoldCommonLabels, provideFoldDataTableLabels, provideFoldIcons, provideFoldInlineConfirmLabels, provideFoldPaginatorLabels, provideFoldPalette, provideFoldPanelDefaults, provideFoldPanelLabels, provideFoldToasts, resolveFoldMobileQuery };
 //# sourceMappingURL=fold-ng.mjs.map