@flyos/design-system 3.11.0 → 3.13.0

package/fesm2022/flyos-design-system.mjs

@@ -47,7 +47,7 @@ import { CdkConnectedOverlay, CdkOverlayOrigin } from '@angular/cdk/overlay';
 // tools/publish-library.ps1 at bump time, and asserted by the spec beside this file.
 // Used only for the diagnostic message; the duplicate-instance detection itself is
 // version-agnostic, so a stale literal misnames a fork rather than hiding one.
-const FLY_DS_VERSION = '3.11.0';
+const FLY_DS_VERSION = '3.13.0';
 const FLY_DS_REGISTRY_KEY = '__FLY_DS_INSTANCES__';
 /**
  * Records this design-system instance on the shared `scope` and returns the
@@ -3609,8 +3609,23 @@ const FLY_REMOTE_BASE_PATH = new InjectionToken('FLY_REMOTE_BASE_PATH');
  * `FlyRemoteRouter.matchedRoute()`.
  */
 function matchFlyRoutePattern(pattern, segments) {
+    const matched = matchFlyRoutePrefix(pattern, segments);
+    return matched && matched.rest.length === 0 ? matched.params : null;
+}
+/**
+ * Match a pattern against the FRONT of `segments`, returning what it captured
+ * plus the segments it did not consume. `null` when the pattern cannot match.
+ *
+ * This is the prefix half of {@link matchFlyRoutePattern}, which is now simply
+ * "prefix-match, and insist nothing is left over". A parent route stops at the
+ * prefix and hands `rest` to its `children`.
+ *
+ * Exported for unit testing — consumers should rely on
+ * `FlyRemoteRouter.matchedRoute()`.
+ */
+function matchFlyRoutePrefix(pattern, segments) {
     const patternSegments = pattern.split('/').filter(Boolean);
-    if (patternSegments.length !== segments.length)
+    if (patternSegments.length > segments.length)
         return null;
     const params = {};
     for (let i = 0; i < patternSegments.length; i++) {
@@ -3623,8 +3638,59 @@ function matchFlyRoutePattern(pattern, segments) {
             return null;
         }
     }
-    return params;
+    return { params, rest: segments.slice(patternSegments.length) };
+}
+/**
+ * Resolve `segments` against a route table, descending into `children`.
+ *
+ * First-match-wins in declaration order, at every level. A row WITHOUT children
+ * must consume the URL exactly — the flat-table rule, unchanged. A row WITH
+ * children consumes its own prefix and must then find a matching descendant;
+ * if none matches, the row is skipped and its later siblings still get a turn,
+ * so a routing miss never renders a layout wrapped around an empty outlet.
+ *
+ * `inherited` carries ancestor params down, which is what lets a child read a
+ * `:id` captured by its layout.
+ *
+ * Exported for unit testing — consumers should rely on
+ * `FlyRemoteRouter.matchedRoute()`.
+ */
+function matchFlyRouteTable(routes, segments, inherited = {}) {
+    for (const route of routes) {
+        const prefix = matchFlyRoutePrefix(route.path, segments);
+        if (!prefix)
+            continue;
+        const params = { ...inherited, ...prefix.params };
+        if (!route.children?.length) {
+            if (prefix.rest.length > 0)
+                continue;
+            return { route, params, child: null };
+        }
+        const child = matchFlyRouteTable(route.children, prefix.rest, params);
+        if (child)
+            return { route, params, child };
+    }
+    return null;
+}
+/** Walk a match chain to its leaf — the row that actually consumed the URL. */
+function deepestFlyMatch(match) {
+    let current = match;
+    while (current.child)
+        current = current.child;
+    return current;
 }
+/**
+ * Nesting depth of a `<fly-remote-router-outlet>`, so an outlet knows which link
+ * of the match chain it is responsible for. Each outlet provides its own depth
+ * for its subtree, so the outlet a layout renders resolves to depth + 1 with no
+ * wiring on the consumer's part — the same way Angular's own `RouterOutlet`
+ * derives its level from the injector rather than an input.
+ *
+ * Consumers never provide this themselves.
+ *
+ * Available since design-system **3.12.0**.
+ */
+const FLY_REMOTE_OUTLET_DEPTH = new InjectionToken('FLY_REMOTE_OUTLET_DEPTH');
 
 /**
  * FlyOS standard navigation surface for Business / Supporting App remotes.
@@ -3753,16 +3819,12 @@ class FlyRemoteRouter {
      *
      * Match order: routes are tried in declaration order. Put more specific
      * patterns (e.g. `'signals/:id'`) before catch-alls.
+     *
+     * On a table using `children` this is the ROOT of the match chain — follow
+     * `.child` for the nested links, which is what the nested outlets do. A flat
+     * table always yields `child: null`, so this reads exactly as it always did.
      */
-    matchedRoute = computed(() => {
-        const segs = this.segments();
-        for (const route of this.routes) {
-            const params = matchFlyRoutePattern(route.path, segs);
-            if (params != null)
-                return { route, params };
-        }
-        return null;
-    }, ...(ngDevMode ? [{ debugName: "matchedRoute" }] : /* istanbul ignore next */ []));
+    matchedRoute = computed(() => matchFlyRouteTable(this.routes, this.segments()), ...(ngDevMode ? [{ debugName: "matchedRoute" }] : /* istanbul ignore next */ []));
     /**
      * Captured route params from the active route, e.g. `{ id: 'abc' }` for a
      * `'signals/:id'` match on `/signals/abc`. Empty object if no route matched
@@ -3774,7 +3836,13 @@ class FlyRemoteRouter {
      * readonly signalId = computed(() => this.flyRouter.params()['id'] ?? '');
      * ```
      */
-    params = computed(() => this.matchedRoute()?.params ?? {}, ...(ngDevMode ? [{ debugName: "params" }] : /* istanbul ignore next */ []));
+    params = computed(() => {
+        const match = this.matchedRoute();
+        // The DEEPEST link, not the root: on a nested table the leaf is the row that
+        // actually consumed the URL, and its params already carry everything its
+        // ancestors captured. Identical to the root on a flat table.
+        return match ? deepestFlyMatch(match).params : {};
+    }, ...(ngDevMode ? [{ debugName: "params" }] : /* istanbul ignore next */ []));
     destroyRef = inject(DestroyRef);
     constructor() {
         if (!this.isEmbedded && this.router) {
@@ -5311,6 +5379,27 @@ function unwrapLoaded(loaded) {
  * - No query-param / hash handling — only path segments.
  * - No `RouterLink` directive — use `(click)="router.navigate(...)"`.
  *
+ * ## Layout routes (3.12.0)
+ *
+ * A route with `children` renders its own component as a LAYOUT and resolves the
+ * rest of the URL into a nested outlet placed in that layout's template:
+ *
+ * ```html
+ * <!-- workspace-layout.component.html -->
+ * <fly-entity-header [entity]="project()" />
+ * <fly-tab-strip [projectId]="id()" />
+ * <fly-remote-router-outlet />   <!-- the tab body, and only the tab body -->
+ * ```
+ *
+ * The layout instance survives navigation between its children, because only the
+ * nested outlet's component changes. That is what stops shared chrome from
+ * re-fetching, re-animating and flashing empty on every tab switch — the failure
+ * this feature exists to remove.
+ *
+ * Nesting is derived from the injector, not declared: each outlet publishes its
+ * own depth to its subtree, so a nested outlet needs no input and no consumer
+ * wiring. Depth beyond the end of the match chain renders nothing.
+ *
  * Components rendered by this outlet read route params via `FlyRemoteRouter.params`:
  * ```ts
  * private readonly router = inject(FlyRemoteRouter);
@@ -5345,11 +5434,23 @@ function unwrapLoaded(loaded) {
 class FlyRemoteRouterOutletComponent {
     router = inject(FlyRemoteRouter);
     errorHandler = inject(ErrorHandler);
+    /** This outlet's link in the match chain — 0 at the root, +1 per nesting. */
+    depth = inject(FLY_REMOTE_OUTLET_DEPTH);
     /**
-     * Read directly from FlyRemoteRouter so the outlet re-renders whenever the
-     * URL changes (signal-based, OnPush-friendly).
+     * The match this outlet is responsible for: `matchedRoute()` walked down
+     * `depth` links. Read directly from FlyRemoteRouter so the outlet re-renders
+     * whenever the URL changes (signal-based, OnPush-friendly).
+     *
+     * `null` past the end of the chain — a nested outlet in a layout whose match
+     * has no child renders nothing rather than repeating its parent.
      */
-    matched = this.router.matchedRoute;
+    matched = computed(() => {
+        let match = this.router.matchedRoute();
+        for (let level = 0; level < this.depth && match; level++) {
+            match = match.child ?? null;
+        }
+        return match;
+    }, ...(ngDevMode ? [{ debugName: "matched" }] : /* istanbul ignore next */ []));
     /** Loaders that have resolved — consulted synchronously, so a revisit never flashes. */
     loaded = new Map();
     /** Loaders currently in flight, so a param change mid-load doesn't start a second fetch. */
@@ -5403,7 +5504,16 @@ class FlyRemoteRouterOutletComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FlyRemoteRouterOutletComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FlyRemoteRouterOutletComponent, isStandalone: true, selector: "fly-remote-router-outlet", ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FlyRemoteRouterOutletComponent, isStandalone: true, selector: "fly-remote-router-outlet", providers: [
+            {
+                // Each outlet publishes its own depth to its subtree, so an outlet a
+                // layout renders resolves one level deeper with nothing declared by the
+                // consumer. `skipSelf` reads the ANCESTOR outlet's value; absent (the
+                // top-level outlet) it starts the chain at 0.
+                provide: FLY_REMOTE_OUTLET_DEPTH,
+                useFactory: () => (inject(FLY_REMOTE_OUTLET_DEPTH, { optional: true, skipSelf: true }) ?? -1) + 1,
+            },
+        ], ngImport: i0, template: `
     @if (rendered(); as cmp) {
       <ng-container *ngComponentOutlet="cmp" />
     }
@@ -5416,6 +5526,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
                     standalone: true,
                     imports: [NgComponentOutlet],
                     changeDetection: ChangeDetectionStrategy.OnPush,
+                    providers: [
+                        {
+                            // Each outlet publishes its own depth to its subtree, so an outlet a
+                            // layout renders resolves one level deeper with nothing declared by the
+                            // consumer. `skipSelf` reads the ANCESTOR outlet's value; absent (the
+                            // top-level outlet) it starts the chain at 0.
+                            provide: FLY_REMOTE_OUTLET_DEPTH,
+                            useFactory: () => (inject(FLY_REMOTE_OUTLET_DEPTH, { optional: true, skipSelf: true }) ?? -1) + 1,
+                        },
+                    ],
                     template: `
     @if (rendered(); as cmp) {
       <ng-container *ngComponentOutlet="cmp" />
@@ -23205,34 +23325,34 @@ class FlyOverviewKpiRowComponent {
     /** Exact equal-width column count (no reflow). Omit for the default wrapping flex row. */
     columns = input(...(ngDevMode ? [undefined, { debugName: "columns" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FlyOverviewKpiRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FlyOverviewKpiRowComponent, isStandalone: true, selector: "fly-overview-kpi-row", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
-    <div class="okr" [class.okr--grid]="columns() != null" [style.--okr-columns]="columns()">
-      @for (item of items(); track item.labelKey) {
-        <div class="okr__card" [attr.data-tone]="item.tone">
-          <div class="okr__text">
-            <span class="okr__value">{{ item.value }}</span>
-            <span class="okr__label">{{ item.labelKey | translate }}</span>
-          </div>
-          <i class="pi {{ item.icon }} okr__icon" aria-hidden="true"></i>
-        </div>
-      }
-    </div>
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FlyOverviewKpiRowComponent, isStandalone: true, selector: "fly-overview-kpi-row", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
+    <div class="okr" [class.okr--grid]="columns() != null" [style.--okr-columns]="columns()">
+      @for (item of items(); track item.labelKey) {
+        <div class="okr__card" [attr.data-tone]="item.tone">
+          <div class="okr__text">
+            <span class="okr__value">{{ item.value }}</span>
+            <span class="okr__label">{{ item.labelKey | translate }}</span>
+          </div>
+          <i class="pi {{ item.icon }} okr__icon" aria-hidden="true"></i>
+        </div>
+      }
+    </div>
   `, isInline: true, styles: [":host{display:block}.okr{display:flex;align-items:stretch;gap:10px;flex-wrap:wrap}.okr--grid{--okr-columns: 1;display:grid;grid-template-columns:repeat(var(--okr-columns),minmax(0,1fr))}.okr__card{flex:1;min-width:150px;display:flex;align-items:center;gap:11px;padding:13px 14px;border-radius:var(--r-lg);background:var(--w03);border:1px solid var(--w06)}.okr__card[data-tone=blue]{--okr-tone: var(--sys-blue)}.okr__card[data-tone=purple]{--okr-tone: var(--sys-purple)}.okr__card[data-tone=orange]{--okr-tone: var(--sys-orange)}.okr__card[data-tone=red]{--okr-tone: var(--sys-red)}.okr__card[data-tone=teal]{--okr-tone: var(--sys-teal)}.okr__text{order:1;flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.okr__icon{order:2;flex:none;inline-size:32px;block-size:32px;border-radius:9px;display:grid;place-items:center;background:var(--okr-tone, var(--w6));color:var(--ink-inverse);font-size:15px}.okr__value{font-family:var(--font-family-display);font-weight:var(--fw-bold);font-size:20px;line-height:1;letter-spacing:var(--tracking-tight);font-variant-numeric:tabular-nums;color:var(--ink)}.okr__label{font-family:var(--font-family);font-weight:var(--fw-medium);font-size:var(--text-2xs);line-height:1.2;color:var(--w45)}\n"], dependencies: [{ kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FlyOverviewKpiRowComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fly-overview-kpi-row', standalone: true, imports: [TranslatePipe], changeDetection: ChangeDetectionStrategy.OnPush, template: `
-    <div class="okr" [class.okr--grid]="columns() != null" [style.--okr-columns]="columns()">
-      @for (item of items(); track item.labelKey) {
-        <div class="okr__card" [attr.data-tone]="item.tone">
-          <div class="okr__text">
-            <span class="okr__value">{{ item.value }}</span>
-            <span class="okr__label">{{ item.labelKey | translate }}</span>
-          </div>
-          <i class="pi {{ item.icon }} okr__icon" aria-hidden="true"></i>
-        </div>
-      }
-    </div>
+            args: [{ selector: 'fly-overview-kpi-row', standalone: true, imports: [TranslatePipe], changeDetection: ChangeDetectionStrategy.OnPush, template: `
+    <div class="okr" [class.okr--grid]="columns() != null" [style.--okr-columns]="columns()">
+      @for (item of items(); track item.labelKey) {
+        <div class="okr__card" [attr.data-tone]="item.tone">
+          <div class="okr__text">
+            <span class="okr__value">{{ item.value }}</span>
+            <span class="okr__label">{{ item.labelKey | translate }}</span>
+          </div>
+          <i class="pi {{ item.icon }} okr__icon" aria-hidden="true"></i>
+        </div>
+      }
+    </div>
   `, styles: [":host{display:block}.okr{display:flex;align-items:stretch;gap:10px;flex-wrap:wrap}.okr--grid{--okr-columns: 1;display:grid;grid-template-columns:repeat(var(--okr-columns),minmax(0,1fr))}.okr__card{flex:1;min-width:150px;display:flex;align-items:center;gap:11px;padding:13px 14px;border-radius:var(--r-lg);background:var(--w03);border:1px solid var(--w06)}.okr__card[data-tone=blue]{--okr-tone: var(--sys-blue)}.okr__card[data-tone=purple]{--okr-tone: var(--sys-purple)}.okr__card[data-tone=orange]{--okr-tone: var(--sys-orange)}.okr__card[data-tone=red]{--okr-tone: var(--sys-red)}.okr__card[data-tone=teal]{--okr-tone: var(--sys-teal)}.okr__text{order:1;flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.okr__icon{order:2;flex:none;inline-size:32px;block-size:32px;border-radius:9px;display:grid;place-items:center;background:var(--okr-tone, var(--w6));color:var(--ink-inverse);font-size:15px}.okr__value{font-family:var(--font-family-display);font-weight:var(--fw-bold);font-size:20px;line-height:1;letter-spacing:var(--tracking-tight);font-variant-numeric:tabular-nums;color:var(--ink)}.okr__label{font-family:var(--font-family);font-weight:var(--fw-medium);font-size:var(--text-2xs);line-height:1.2;color:var(--w45)}\n"] }]
         }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }] } });
 
@@ -23328,111 +23448,11 @@ class FlyLifecyclePipelineComponent {
     /** i18n key for the `role="list"` accessible name. */
     ariaLabelKey = input.required(...(ngDevMode ? [{ debugName: "ariaLabelKey" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FlyLifecyclePipelineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FlyLifecyclePipelineComponent, isStandalone: true, selector: "fly-lifecycle-pipeline", inputs: { steps: { classPropertyName: "steps", publicName: "steps", isSignal: true, isRequired: true, transformFunction: null }, rollup: { classPropertyName: "rollup", publicName: "rollup", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelKey: { classPropertyName: "ariaLabelKey", publicName: "ariaLabelKey", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
-    <div class="lp">
-      <div class="lp__row" role="list" [attr.aria-label]="ariaLabelKey() | translate">
-        @for (
-          step of steps();
-          track step.label ?? step.labelKey;
-          let i = $index;
-          let last = $last
-        ) {
-          <div
-            class="lp__step"
-            [class.lp__step--current]="step.current"
-            role="listitem"
-            [attr.aria-current]="step.current ? 'step' : null"
-          >
-            <span class="lp__index" [attr.data-tone]="step.tone">
-              @if (step.tone === 'success') {
-                <i class="pi pi-check" aria-hidden="true"></i>
-              } @else {
-                {{ i + 1 }}
-              }
-            </span>
-            <span class="lp__name">
-              @if (step.label) {
-                {{ step.label }}
-              } @else if (step.labelKey) {
-                {{ step.labelKey | translate }}
-              }
-            </span>
-            <fly-chip [tone]="step.tone">{{ step.statusLabelKey | translate }}</fly-chip>
-            @if (step.progress) {
-              <span class="lp__progress">{{ step.progress }}</span>
-            }
-          </div>
-          @if (!last) {
-            <span class="lp__connector" aria-hidden="true"></span>
-          }
-        }
-      </div>
-      @if (rollup().length) {
-        <div class="lp__rollup">
-          @for (item of rollup(); track item.labelKey) {
-            <span class="lp__rollup-item">
-              <span class="lp__rollup-label">{{ item.labelKey | translate }}</span>
-              <span class="lp__rollup-value">{{ item.value }}</span>
-            </span>
-          }
-        </div>
-      }
-    </div>
-  `, isInline: true, styles: [":host{display:block}.lp{display:flex;flex-direction:column;gap:var(--sp-3)}.lp__row{display:flex;align-items:center;flex-wrap:wrap;row-gap:var(--sp-3)}.lp__step{display:flex;align-items:center;gap:var(--sp-2);padding:6px 10px;border-radius:var(--r-lg);border:1px solid transparent}.lp__step--current{border-color:var(--accent-fill);background:var(--tint-sel)}.lp__index{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:22px;height:22px;border-radius:999px;font-family:var(--font-family);font-size:11px;font-weight:var(--fw-bold);line-height:1}.lp__index .pi{font-size:10px}.lp__index[data-tone=neutral]{background:var(--w06);color:var(--w85)}.lp__index[data-tone=accent]{background:var(--accent-fill);color:var(--on-accent-fill)}.lp__index[data-tone=success]{background:var(--success-bg);color:var(--success)}.lp__index[data-tone=warning]{background:var(--warning-bg);color:var(--warning-fg)}.lp__index[data-tone=danger]{background:var(--danger-bg);color:var(--danger)}.lp__name{font-family:var(--font-family);font-weight:var(--fw-medium);font-size:var(--text-sm);color:var(--ink);white-space:nowrap}.lp__step--current .lp__name{font-weight:var(--fw-bold)}.lp__progress{font-family:var(--font-family);font-size:var(--text-xs);color:var(--w45);font-variant-numeric:tabular-nums}.lp__connector{flex:1 1 32px;min-width:20px;height:1px;background:var(--w16);margin-inline:2px}.lp__rollup{display:flex;flex-wrap:wrap;gap:var(--sp-1) var(--sp-4);padding-block-start:var(--sp-2);border-block-start:1px solid var(--w06)}.lp__rollup-item{display:inline-flex;align-items:baseline;gap:5px;font-family:var(--font-family);font-size:var(--text-xs)}.lp__rollup-label{color:var(--w45)}.lp__rollup-value{color:var(--w85);font-weight:var(--fw-bold);font-variant-numeric:tabular-nums}\n"], dependencies: [{ kind: "component", type: FlyChipComponent, selector: "fly-chip", inputs: ["tone"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FlyLifecyclePipelineComponent, isStandalone: true, selector: "fly-lifecycle-pipeline", inputs: { steps: { classPropertyName: "steps", publicName: "steps", isSignal: true, isRequired: true, transformFunction: null }, rollup: { classPropertyName: "rollup", publicName: "rollup", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelKey: { classPropertyName: "ariaLabelKey", publicName: "ariaLabelKey", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"lp\">\n  <div class=\"lp__row\" role=\"list\" [attr.aria-label]=\"ariaLabelKey() | translate\">\n    @for (\n      step of steps();\n      track step.label ?? step.labelKey;\n      let i = $index;\n      let last = $last\n    ) {\n      <div\n        class=\"lp__step\"\n        [class.lp__step--current]=\"step.current\"\n        role=\"listitem\"\n        [attr.aria-current]=\"step.current ? 'step' : null\"\n      >\n        <span class=\"lp__index\" [attr.data-tone]=\"step.tone\">\n          @if (step.tone === 'success') {\n            <i class=\"pi pi-check\" aria-hidden=\"true\"></i>\n          } @else {\n            {{ i + 1 }}\n          }\n        </span>\n        <span class=\"lp__name\">\n          @if (step.label) {\n            {{ step.label }}\n          } @else if (step.labelKey) {\n            {{ step.labelKey | translate }}\n          }\n        </span>\n        <fly-chip [tone]=\"step.tone\">{{ step.statusLabelKey | translate }}</fly-chip>\n        @if (step.progress) {\n          <span class=\"lp__progress\">{{ step.progress }}</span>\n        }\n      </div>\n      @if (!last) {\n        <span class=\"lp__connector\" aria-hidden=\"true\"></span>\n      }\n    }\n  </div>\n  @if (rollup().length) {\n    <div class=\"lp__rollup\">\n      @for (item of rollup(); track item.labelKey) {\n        <span class=\"lp__rollup-item\">\n          <span class=\"lp__rollup-label\">{{ item.labelKey | translate }}</span>\n          <span class=\"lp__rollup-value\">{{ item.value }}</span>\n        </span>\n      }\n    </div>\n  }\n</div>\n", styles: [":host{display:block}.lp{display:flex;flex-direction:column;gap:var(--sp-3)}.lp__row{display:flex;align-items:center;flex-wrap:wrap;row-gap:var(--sp-3)}.lp__step{display:flex;align-items:center;gap:var(--sp-2);padding:6px 10px;border-radius:var(--r-lg);border:1px solid transparent}.lp__step--current{border-color:var(--accent-fill);background:var(--tint-sel)}.lp__index{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:22px;height:22px;border-radius:999px;font-family:var(--font-family);font-size:11px;font-weight:var(--fw-bold);line-height:1}.lp__index .pi{font-size:10px}.lp__index[data-tone=neutral]{background:var(--w06);color:var(--w85)}.lp__index[data-tone=accent]{background:var(--accent-fill);color:var(--on-accent-fill)}.lp__index[data-tone=success]{background:var(--success-bg);color:var(--success)}.lp__index[data-tone=warning]{background:var(--warning-bg);color:var(--warning-fg)}.lp__index[data-tone=danger]{background:var(--danger-bg);color:var(--danger)}.lp__name{font-family:var(--font-family);font-weight:var(--fw-medium);font-size:var(--text-sm);color:var(--ink);white-space:nowrap}.lp__step--current .lp__name{font-weight:var(--fw-bold)}.lp__progress{font-family:var(--font-family);font-size:var(--text-xs);color:var(--w45);font-variant-numeric:tabular-nums}.lp__connector{flex:1 1 32px;min-width:20px;height:1px;background:var(--w16);margin-inline:2px}.lp__rollup{display:flex;flex-wrap:wrap;gap:var(--sp-1) var(--sp-4);padding-block-start:var(--sp-2);border-block-start:1px solid var(--w06)}.lp__rollup-item{display:inline-flex;align-items:baseline;gap:5px;font-family:var(--font-family);font-size:var(--text-xs)}.lp__rollup-label{color:var(--w45)}.lp__rollup-value{color:var(--w85);font-weight:var(--fw-bold);font-variant-numeric:tabular-nums}\n"], dependencies: [{ kind: "component", type: FlyChipComponent, selector: "fly-chip", inputs: ["tone"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FlyLifecyclePipelineComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fly-lifecycle-pipeline', standalone: true, imports: [TranslatePipe, FlyChipComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: `
-    <div class="lp">
-      <div class="lp__row" role="list" [attr.aria-label]="ariaLabelKey() | translate">
-        @for (
-          step of steps();
-          track step.label ?? step.labelKey;
-          let i = $index;
-          let last = $last
-        ) {
-          <div
-            class="lp__step"
-            [class.lp__step--current]="step.current"
-            role="listitem"
-            [attr.aria-current]="step.current ? 'step' : null"
-          >
-            <span class="lp__index" [attr.data-tone]="step.tone">
-              @if (step.tone === 'success') {
-                <i class="pi pi-check" aria-hidden="true"></i>
-              } @else {
-                {{ i + 1 }}
-              }
-            </span>
-            <span class="lp__name">
-              @if (step.label) {
-                {{ step.label }}
-              } @else if (step.labelKey) {
-                {{ step.labelKey | translate }}
-              }
-            </span>
-            <fly-chip [tone]="step.tone">{{ step.statusLabelKey | translate }}</fly-chip>
-            @if (step.progress) {
-              <span class="lp__progress">{{ step.progress }}</span>
-            }
-          </div>
-          @if (!last) {
-            <span class="lp__connector" aria-hidden="true"></span>
-          }
-        }
-      </div>
-      @if (rollup().length) {
-        <div class="lp__rollup">
-          @for (item of rollup(); track item.labelKey) {
-            <span class="lp__rollup-item">
-              <span class="lp__rollup-label">{{ item.labelKey | translate }}</span>
-              <span class="lp__rollup-value">{{ item.value }}</span>
-            </span>
-          }
-        </div>
-      }
-    </div>
-  `, styles: [":host{display:block}.lp{display:flex;flex-direction:column;gap:var(--sp-3)}.lp__row{display:flex;align-items:center;flex-wrap:wrap;row-gap:var(--sp-3)}.lp__step{display:flex;align-items:center;gap:var(--sp-2);padding:6px 10px;border-radius:var(--r-lg);border:1px solid transparent}.lp__step--current{border-color:var(--accent-fill);background:var(--tint-sel)}.lp__index{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:22px;height:22px;border-radius:999px;font-family:var(--font-family);font-size:11px;font-weight:var(--fw-bold);line-height:1}.lp__index .pi{font-size:10px}.lp__index[data-tone=neutral]{background:var(--w06);color:var(--w85)}.lp__index[data-tone=accent]{background:var(--accent-fill);color:var(--on-accent-fill)}.lp__index[data-tone=success]{background:var(--success-bg);color:var(--success)}.lp__index[data-tone=warning]{background:var(--warning-bg);color:var(--warning-fg)}.lp__index[data-tone=danger]{background:var(--danger-bg);color:var(--danger)}.lp__name{font-family:var(--font-family);font-weight:var(--fw-medium);font-size:var(--text-sm);color:var(--ink);white-space:nowrap}.lp__step--current .lp__name{font-weight:var(--fw-bold)}.lp__progress{font-family:var(--font-family);font-size:var(--text-xs);color:var(--w45);font-variant-numeric:tabular-nums}.lp__connector{flex:1 1 32px;min-width:20px;height:1px;background:var(--w16);margin-inline:2px}.lp__rollup{display:flex;flex-wrap:wrap;gap:var(--sp-1) var(--sp-4);padding-block-start:var(--sp-2);border-block-start:1px solid var(--w06)}.lp__rollup-item{display:inline-flex;align-items:baseline;gap:5px;font-family:var(--font-family);font-size:var(--text-xs)}.lp__rollup-label{color:var(--w45)}.lp__rollup-value{color:var(--w85);font-weight:var(--fw-bold);font-variant-numeric:tabular-nums}\n"] }]
+            args: [{ selector: 'fly-lifecycle-pipeline', standalone: true, imports: [TranslatePipe, FlyChipComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"lp\">\n  <div class=\"lp__row\" role=\"list\" [attr.aria-label]=\"ariaLabelKey() | translate\">\n    @for (\n      step of steps();\n      track step.label ?? step.labelKey;\n      let i = $index;\n      let last = $last\n    ) {\n      <div\n        class=\"lp__step\"\n        [class.lp__step--current]=\"step.current\"\n        role=\"listitem\"\n        [attr.aria-current]=\"step.current ? 'step' : null\"\n      >\n        <span class=\"lp__index\" [attr.data-tone]=\"step.tone\">\n          @if (step.tone === 'success') {\n            <i class=\"pi pi-check\" aria-hidden=\"true\"></i>\n          } @else {\n            {{ i + 1 }}\n          }\n        </span>\n        <span class=\"lp__name\">\n          @if (step.label) {\n            {{ step.label }}\n          } @else if (step.labelKey) {\n            {{ step.labelKey | translate }}\n          }\n        </span>\n        <fly-chip [tone]=\"step.tone\">{{ step.statusLabelKey | translate }}</fly-chip>\n        @if (step.progress) {\n          <span class=\"lp__progress\">{{ step.progress }}</span>\n        }\n      </div>\n      @if (!last) {\n        <span class=\"lp__connector\" aria-hidden=\"true\"></span>\n      }\n    }\n  </div>\n  @if (rollup().length) {\n    <div class=\"lp__rollup\">\n      @for (item of rollup(); track item.labelKey) {\n        <span class=\"lp__rollup-item\">\n          <span class=\"lp__rollup-label\">{{ item.labelKey | translate }}</span>\n          <span class=\"lp__rollup-value\">{{ item.value }}</span>\n        </span>\n      }\n    </div>\n  }\n</div>\n", styles: [":host{display:block}.lp{display:flex;flex-direction:column;gap:var(--sp-3)}.lp__row{display:flex;align-items:center;flex-wrap:wrap;row-gap:var(--sp-3)}.lp__step{display:flex;align-items:center;gap:var(--sp-2);padding:6px 10px;border-radius:var(--r-lg);border:1px solid transparent}.lp__step--current{border-color:var(--accent-fill);background:var(--tint-sel)}.lp__index{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:22px;height:22px;border-radius:999px;font-family:var(--font-family);font-size:11px;font-weight:var(--fw-bold);line-height:1}.lp__index .pi{font-size:10px}.lp__index[data-tone=neutral]{background:var(--w06);color:var(--w85)}.lp__index[data-tone=accent]{background:var(--accent-fill);color:var(--on-accent-fill)}.lp__index[data-tone=success]{background:var(--success-bg);color:var(--success)}.lp__index[data-tone=warning]{background:var(--warning-bg);color:var(--warning-fg)}.lp__index[data-tone=danger]{background:var(--danger-bg);color:var(--danger)}.lp__name{font-family:var(--font-family);font-weight:var(--fw-medium);font-size:var(--text-sm);color:var(--ink);white-space:nowrap}.lp__step--current .lp__name{font-weight:var(--fw-bold)}.lp__progress{font-family:var(--font-family);font-size:var(--text-xs);color:var(--w45);font-variant-numeric:tabular-nums}.lp__connector{flex:1 1 32px;min-width:20px;height:1px;background:var(--w16);margin-inline:2px}.lp__rollup{display:flex;flex-wrap:wrap;gap:var(--sp-1) var(--sp-4);padding-block-start:var(--sp-2);border-block-start:1px solid var(--w06)}.lp__rollup-item{display:inline-flex;align-items:baseline;gap:5px;font-family:var(--font-family);font-size:var(--text-xs)}.lp__rollup-label{color:var(--w45)}.lp__rollup-value{color:var(--w85);font-weight:var(--fw-bold);font-variant-numeric:tabular-nums}\n"] }]
         }], propDecorators: { steps: [{ type: i0.Input, args: [{ isSignal: true, alias: "steps", required: true }] }], rollup: [{ type: i0.Input, args: [{ isSignal: true, alias: "rollup", required: false }] }], ariaLabelKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelKey", required: true }] }] } });
 
 function canGoPrev$1(page) {
@@ -25351,6 +25371,15 @@ function sectionHintKey(section, expanded) {
  * Icons reuse `flyModuleIcon` — the SAME directive the topbar takes — so an app that
  * renders both declares its icon templates once per surface, in the same syntax.
  *
+ * ## App colour (3.12.0)
+ *
+ * The launch-card family (feature tile, hover wash, hover ring) follows the app's
+ * authored brand colour, received by CSS CASCADE rather than input: the shell window
+ * publishes the app's derived palette (`--app-color`, `--app-color-deep`, `--app-ink`)
+ * on `.window`, so a federated landing is branded with zero wiring; a standalone host
+ * brands itself by setting the same custom properties on any ancestor element. Where
+ * nothing cascades, the fixed `--module-teal` family renders exactly as before.
+ *
  * a11y: cards are real `<button>`s in a labelled group; a collapsible section is a
  * disclosure (`aria-expanded` + `aria-controls`), and the region carries the section
  * heading. Layout is logical-property only, so it mirrors under `dir="rtl"` on its own —
@@ -25406,11 +25435,11 @@ class FlyAppHomeComponent {
         return `fly-app-home-sec-${index}`;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FlyAppHomeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FlyAppHomeComponent, isStandalone: true, selector: "fly-app-home", inputs: { brandLabelKey: { classPropertyName: "brandLabelKey", publicName: "brandLabelKey", isSignal: true, isRequired: false, transformFunction: null }, titleKey: { classPropertyName: "titleKey", publicName: "titleKey", isSignal: true, isRequired: false, transformFunction: null }, subtitleKey: { classPropertyName: "subtitleKey", publicName: "subtitleKey", isSignal: true, isRequired: false, transformFunction: null }, sections: { classPropertyName: "sections", publicName: "sections", isSignal: true, isRequired: false, transformFunction: null }, modulesLabelKey: { classPropertyName: "modulesLabelKey", publicName: "modulesLabelKey", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { moduleSelected: "moduleSelected", brandSelected: "brandSelected" }, queries: [{ propertyName: "icons", predicate: FlyModuleIconDirective, isSignal: true }], ngImport: i0, template: "<div class=\"ah\">\r\n  <header class=\"ah__util\">\r\n    <button type=\"button\" class=\"ah__brand\" (click)=\"brandSelected.emit()\">\r\n      <span class=\"ah__brand-mark\"><ng-content select=\"[app-home-brand]\" /></span>\r\n      @if (brandLabelKey(); as key) {\r\n        <span class=\"ah__brand-name\">{{ key | translate }}</span>\r\n      }\r\n    </button>\r\n    <ng-content select=\"[app-home-actions]\" />\r\n  </header>\r\n\r\n  <main class=\"ah__main\">\r\n    @if (titleKey() || subtitleKey()) {\r\n      <section class=\"ah__hero\">\r\n        @if (titleKey(); as key) {\r\n          <h1 class=\"ah__title\">{{ key | translate }}</h1>\r\n        }\r\n        @if (subtitleKey(); as key) {\r\n          <p class=\"ah__sub\">{{ key | translate }}</p>\r\n        }\r\n      </section>\r\n    }\r\n\r\n    @for (row of rows(); track row.index) {\r\n      <section\r\n        class=\"ah__sec\"\r\n        [class.ah__sec--secondary]=\"row.index > 0\"\r\n        [attr.aria-label]=\"row.section.titleKey ? null : (modulesLabelKey() | translate)\"\r\n      >\r\n        @if (row.section.titleKey; as titleKey) {\r\n          @if (row.section.collapsible) {\r\n            <button\r\n              type=\"button\"\r\n              class=\"ah__sec-hd\"\r\n              (click)=\"toggle(row.index)\"\r\n              [attr.aria-expanded]=\"row.expanded\"\r\n              [attr.aria-controls]=\"sectionId(row.index)\"\r\n            >\r\n              <!-- Points end-ward when shut, down when open. `--open` wins over the RTL\r\n                   flip below because a downward chevron has no direction to mirror. -->\r\n              <svg\r\n                class=\"ah__sec-chev\"\r\n                [class.ah__sec-chev--open]=\"row.expanded\"\r\n                width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\"\r\n                stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"\r\n              >\r\n                <polyline points=\"9 6 15 12 9 18\" />\r\n              </svg>\r\n              <span class=\"ah__sec-title\">{{ titleKey | translate }}</span>\r\n              <span class=\"ah__sec-count\">{{ row.section.modules.length }}</span>\r\n              @if (row.hintKey; as hint) {\r\n                <span class=\"ah__sec-hint\">{{ hint | translate }}</span>\r\n              }\r\n            </button>\r\n          } @else {\r\n            <h2 class=\"ah__sec-title ah__sec-title--static\">{{ titleKey | translate }}</h2>\r\n          }\r\n        }\r\n\r\n        @if (row.expanded) {\r\n          <div class=\"ah__grid\" [class.ah__grid--compact]=\"row.layout === 'compact'\" [id]=\"sectionId(row.index)\">\r\n            @for (mod of row.section.modules; track mod.key) {\r\n              <button\r\n                type=\"button\"\r\n                class=\"ah__card\"\r\n                [class.ah__card--compact]=\"row.layout === 'compact'\"\r\n                [disabled]=\"mod.disabled\"\r\n                (click)=\"select(mod)\"\r\n              >\r\n                <span class=\"ah__card-ico\">\r\n                  @if (iconFor(mod.key); as tpl) {\r\n                    <ng-container *ngTemplateOutlet=\"tpl\" />\r\n                  } @else if (mod.iconClass) {\r\n                    <i [class]=\"mod.iconClass\" aria-hidden=\"true\"></i>\r\n                  }\r\n                </span>\r\n\r\n                @if (row.layout === 'compact') {\r\n                  <span class=\"ah__card-main\">\r\n                    <span class=\"ah__card-title\">{{ mod.labelKey | translate }}</span>\r\n                    @if (mod.descKey; as descKey) {\r\n                      <span class=\"ah__card-desc\">{{ descKey | translate }}</span>\r\n                    }\r\n                  </span>\r\n                  <svg\r\n                    class=\"ah__card-arrow\" width=\"11\" height=\"11\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n                    stroke=\"currentColor\" stroke-width=\"2.6\" stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\" aria-hidden=\"true\"\r\n                  >\r\n                    <polyline points=\"9 6 15 12 9 18\" />\r\n                  </svg>\r\n                } @else {\r\n                  <!-- No \"Open \u203A\" affordance row \u2014 the design's module card (MainContent.dc.html)\r\n                       ends at the description; the whole card is the click target and hover carries\r\n                       the affordance. Removed at the 2026-08-17 fidelity pass. -->\r\n                  <!-- Text stack: icon-to-text spacing is `.ah__card`'s own gap; this wrapper's\r\n                       gap is title-to-description only (module-card fidelity pass, 2026-08-20). -->\r\n                  <span class=\"ah__card-text\">\r\n                    <span class=\"ah__card-title ah__card-title--feature\">{{ mod.labelKey | translate }}</span>\r\n                    @if (mod.descKey; as descKey) {\r\n                      <span class=\"ah__card-desc ah__card-desc--feature\">{{ descKey | translate }}</span>\r\n                    }\r\n                  </span>\r\n                }\r\n              </button>\r\n            }\r\n          </div>\r\n        }\r\n      </section>\r\n    }\r\n  </main>\r\n</div>\r\n", styles: [":host{display:flex;flex-direction:column;min-height:100%;container-type:inline-size}.ah{display:flex;flex-direction:column;flex:1;min-height:100%}.ah__util{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);padding:var(--sp-4) var(--sp-6)}:host-context(.window-content) .ah__brand{display:none}:host-context(.window-content) .ah__util{justify-content:flex-end}:host-context(.window-content) .ah__util:not(:has(>:not(.ah__brand))){display:none}.ah__brand{display:inline-flex;align-items:center;gap:var(--sp-2);padding:0;border:0;background:none;color:var(--ink);font-family:inherit;cursor:pointer}.ah__brand:focus-visible{outline:2px solid;outline-color:var(--focus-ring);outline-offset:2px}.ah__brand-name{font-size:var(--text-md);font-weight:var(--fw-semibold);letter-spacing:-.01em}.ah__main{flex:1;inline-size:100%;max-inline-size:1120px;margin-inline:auto;padding:56px 40px;display:flex;flex-direction:column;justify-content:center;gap:44px}.ah__hero{max-inline-size:640px}.ah__title{margin:0 0 var(--sp-3);font-size:44px;font-weight:var(--fw-semibold);letter-spacing:-.03em;text-wrap:balance;background:linear-gradient(180deg,var(--ink),var(--ink-2));-webkit-background-clip:text;background-clip:text;color:transparent}.ah__sub{margin:0;max-inline-size:560px;font-size:var(--text-lg);line-height:1.55;color:var(--ink-3);text-wrap:pretty}.ah__sec{display:flex;flex-direction:column;gap:var(--sp-4)}.ah__sec--secondary{padding-block-start:28px;border-block-start:1px solid var(--w08)}.ah__sec-hd{display:flex;align-items:center;gap:var(--sp-3);inline-size:100%;padding:0;background:none;border:0;cursor:pointer;font-family:inherit;color:var(--ink);text-align:start}.ah__sec-hd:focus-visible{outline:2px solid;outline-color:var(--focus-ring);outline-offset:2px}.ah__sec-chev{flex-shrink:0;color:var(--ink-3);transition:transform var(--t-overlay)}.ah__sec-title{font-size:var(--text-md);font-weight:var(--fw-semibold);letter-spacing:-.01em}.ah__sec-title--static{margin:0;color:var(--ink-3);font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase}.ah__sec-count{display:inline-grid;place-items:center;min-inline-size:22px;block-size:20px;padding-inline:6px;border-radius:999px;background:var(--bg-3);border:1px solid var(--line);font-size:var(--text-2xs);font-weight:var(--fw-medium);font-variant-numeric:tabular-nums;color:var(--ink-3)}.ah__sec-hint{margin-inline-start:auto;font-size:var(--text-xs);color:var(--ink-3)}.ah__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-top:4px;justify-content:flex-start}.ah__card{display:flex;flex-direction:column;align-items:stretch;position:relative;overflow:hidden;text-align:start;padding:20px;gap:16px;background:linear-gradient(160deg,var(--w055),var(--w02));border:1px solid var(--w09);border-radius:20px;color:inherit;font-family:inherit;cursor:pointer;animation:appTileIn .3s var(--nova-ease-micro) both}.ah__card:nth-child(1){animation-delay:0ms}.ah__card:nth-child(2){animation-delay:20ms}.ah__card:nth-child(3){animation-delay:40ms}.ah__card:nth-child(4){animation-delay:60ms}.ah__card:nth-child(5){animation-delay:80ms}.ah__card:nth-child(6){animation-delay:.1s}.ah__card:nth-child(7){animation-delay:.12s}.ah__card:nth-child(8){animation-delay:.14s}.ah__card:nth-child(9){animation-delay:.16s}.ah__card:nth-child(10){animation-delay:.18s}.ah__card:nth-child(11){animation-delay:.2s}.ah__card:nth-child(12){animation-delay:.22s}.ah__card:nth-child(n+13){animation-delay:.22s}.ah__card{transition:transform var(--t-overlay),box-shadow var(--t-overlay),border-color var(--t-state),background var(--t-state)}.ah__card:hover:not(:disabled){transform:translateY(-3px);background:linear-gradient(160deg,color-mix(in srgb,var(--module-teal) 22%,transparent),color-mix(in srgb,var(--sys-teal) 5%,transparent));border-color:color-mix(in srgb,var(--module-teal) 50%,transparent);box-shadow:inset 0 1px color-mix(in srgb,var(--edge-highlight) 20%,transparent),0 20px 46px color-mix(in srgb,var(--module-teal) 16%,transparent),var(--shadow-filter)}.ah__card:focus-visible{outline:0;border-color:color-mix(in oklab,var(--accent) 50%,transparent);background-image:linear-gradient(160deg,var(--tint-hover),transparent);box-shadow:0 0 0 3px var(--accent-soft),0 20px 46px color-mix(in oklab,var(--accent) 16%,transparent),var(--shadow-filter)}.ah__card:disabled{cursor:default;opacity:.5}.ah__card-ico{display:grid;place-items:center;inline-size:42px;block-size:42px;flex:none;border-radius:13px;background:linear-gradient(140deg,color-mix(in srgb,var(--module-teal-deep) 62%,transparent),color-mix(in srgb,var(--module-teal) 30%,transparent));box-shadow:0 6px 16px color-mix(in srgb,var(--module-teal-deep) 30%,transparent),inset 0 1px color-mix(in srgb,var(--edge-highlight) 50%,transparent);border:0;color:var(--ink-inverse);font-size:18px;transition:transform var(--t-overlay)}.ah__card--compact:hover:not(:disabled) .ah__card-ico,.ah__card--compact:focus-visible .ah__card-ico{background:linear-gradient(135deg,var(--accent),var(--sys-teal));box-shadow:inset 0 1px 0 var(--edge-highlight);color:var(--on-accent)}.ah__card-title{font-size:var(--text-sm);font-weight:var(--fw-semibold);letter-spacing:-.01em;color:var(--ink)}.ah__card-text{display:flex;flex-direction:column;gap:5px}.ah__card-title--feature{font-family:var(--font-family);font-weight:var(--fw-semibold);font-size:16.5px;line-height:1.25;letter-spacing:-.005em;color:var(--ink)}.ah__card-desc{font-size:var(--text-xs);line-height:1.45;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ah__card-desc--feature{font-family:var(--font-family);font-weight:400;font-size:13px;line-height:1.45;color:var(--w55);text-wrap:pretty;overflow:visible;white-space:normal}.ah__card-arrow{flex-shrink:0;transition:color var(--t-overlay),transform var(--t-overlay)}.ah__card--compact{flex-direction:row;align-items:center;gap:var(--sp-3);padding:14px 16px;background-color:var(--bg);background-image:linear-gradient(160deg,var(--w035),var(--w035));border-radius:16px;border-color:var(--w08)}.ah__card--compact:hover:not(:disabled),.ah__card--compact:focus-visible{border-color:color-mix(in oklab,var(--accent) 40%,transparent);background-image:linear-gradient(160deg,var(--tint-hover),transparent);box-shadow:0 20px 46px color-mix(in oklab,var(--accent) 16%,transparent),var(--shadow-filter)}.ah__card--compact .ah__card-ico{inline-size:32px;block-size:32px;margin-block-end:0;flex-shrink:0;border-radius:10px;font-size:var(--icon-md);background:var(--bg-3);box-shadow:none;color:var(--ink)}.ah__card-main{display:flex;flex-direction:column;gap:2px;flex:1;min-inline-size:0}.ah__card--compact .ah__card-arrow{color:var(--ink-4)}.ah__card--compact:hover:not(:disabled) .ah__card-arrow{color:var(--accent);transform:translate(2px)}:host-context([dir=rtl]) .ah__card-arrow{transform:scaleX(-1)}:host-context([dir=rtl]) .ah__sec-chev:not(.ah__sec-chev--open){transform:scaleX(-1)}:host-context([dir=rtl]) .ah__card--compact:hover:not(:disabled) .ah__card-arrow{transform:scaleX(-1) translate(2px)}.ah__sec-chev--open{transform:rotate(90deg)}@container (width <= 900px){.ah__main{padding:40px 24px;gap:36px}.ah__title{font-size:36px}.ah__util{padding:var(--sp-3) var(--sp-5)}}@media(width<=900px){.ah__main{padding:40px 24px;gap:36px}.ah__title{font-size:36px}.ah__util{padding:var(--sp-3) var(--sp-5)}}@container (width <= 560px){.ah__title{font-size:30px}.ah__sub{font-size:var(--text-sm)}.ah__sec-hint{display:none}}@media(width<=560px){.ah__title{font-size:30px}.ah__sub{font-size:var(--text-sm)}.ah__sec-hint{display:none}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: FlyAppHomeComponent, isStandalone: true, selector: "fly-app-home", inputs: { brandLabelKey: { classPropertyName: "brandLabelKey", publicName: "brandLabelKey", isSignal: true, isRequired: false, transformFunction: null }, titleKey: { classPropertyName: "titleKey", publicName: "titleKey", isSignal: true, isRequired: false, transformFunction: null }, subtitleKey: { classPropertyName: "subtitleKey", publicName: "subtitleKey", isSignal: true, isRequired: false, transformFunction: null }, sections: { classPropertyName: "sections", publicName: "sections", isSignal: true, isRequired: false, transformFunction: null }, modulesLabelKey: { classPropertyName: "modulesLabelKey", publicName: "modulesLabelKey", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { moduleSelected: "moduleSelected", brandSelected: "brandSelected" }, queries: [{ propertyName: "icons", predicate: FlyModuleIconDirective, isSignal: true }], ngImport: i0, template: "<div class=\"ah\">\r\n  <header class=\"ah__util\">\r\n    <button type=\"button\" class=\"ah__brand\" (click)=\"brandSelected.emit()\">\r\n      <span class=\"ah__brand-mark\"><ng-content select=\"[app-home-brand]\" /></span>\r\n      @if (brandLabelKey(); as key) {\r\n        <span class=\"ah__brand-name\">{{ key | translate }}</span>\r\n      }\r\n    </button>\r\n    <ng-content select=\"[app-home-actions]\" />\r\n  </header>\r\n\r\n  <main class=\"ah__main\">\r\n    @if (titleKey() || subtitleKey()) {\r\n      <section class=\"ah__hero\">\r\n        @if (titleKey(); as key) {\r\n          <h1 class=\"ah__title\">{{ key | translate }}</h1>\r\n        }\r\n        @if (subtitleKey(); as key) {\r\n          <p class=\"ah__sub\">{{ key | translate }}</p>\r\n        }\r\n      </section>\r\n    }\r\n\r\n    @for (row of rows(); track row.index) {\r\n      <section\r\n        class=\"ah__sec\"\r\n        [class.ah__sec--secondary]=\"row.index > 0\"\r\n        [attr.aria-label]=\"row.section.titleKey ? null : (modulesLabelKey() | translate)\"\r\n      >\r\n        @if (row.section.titleKey; as titleKey) {\r\n          @if (row.section.collapsible) {\r\n            <button\r\n              type=\"button\"\r\n              class=\"ah__sec-hd\"\r\n              (click)=\"toggle(row.index)\"\r\n              [attr.aria-expanded]=\"row.expanded\"\r\n              [attr.aria-controls]=\"sectionId(row.index)\"\r\n            >\r\n              <!-- Points end-ward when shut, down when open. `--open` wins over the RTL\r\n                   flip below because a downward chevron has no direction to mirror. -->\r\n              <svg\r\n                class=\"ah__sec-chev\"\r\n                [class.ah__sec-chev--open]=\"row.expanded\"\r\n                width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\"\r\n                stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"\r\n              >\r\n                <polyline points=\"9 6 15 12 9 18\" />\r\n              </svg>\r\n              <span class=\"ah__sec-title\">{{ titleKey | translate }}</span>\r\n              <span class=\"ah__sec-count\">{{ row.section.modules.length }}</span>\r\n              @if (row.hintKey; as hint) {\r\n                <span class=\"ah__sec-hint\">{{ hint | translate }}</span>\r\n              }\r\n            </button>\r\n          } @else {\r\n            <h2 class=\"ah__sec-title ah__sec-title--static\">{{ titleKey | translate }}</h2>\r\n          }\r\n        }\r\n\r\n        @if (row.expanded) {\r\n          <div class=\"ah__grid\" [class.ah__grid--compact]=\"row.layout === 'compact'\" [id]=\"sectionId(row.index)\">\r\n            @for (mod of row.section.modules; track mod.key) {\r\n              <button\r\n                type=\"button\"\r\n                class=\"ah__card\"\r\n                [class.ah__card--compact]=\"row.layout === 'compact'\"\r\n                [disabled]=\"mod.disabled\"\r\n                (click)=\"select(mod)\"\r\n              >\r\n                <span class=\"ah__card-ico\">\r\n                  @if (iconFor(mod.key); as tpl) {\r\n                    <ng-container *ngTemplateOutlet=\"tpl\" />\r\n                  } @else if (mod.iconClass) {\r\n                    <i [class]=\"mod.iconClass\" aria-hidden=\"true\"></i>\r\n                  }\r\n                </span>\r\n\r\n                @if (row.layout === 'compact') {\r\n                  <span class=\"ah__card-main\">\r\n                    <span class=\"ah__card-title\">{{ mod.labelKey | translate }}</span>\r\n                    @if (mod.descKey; as descKey) {\r\n                      <span class=\"ah__card-desc\">{{ descKey | translate }}</span>\r\n                    }\r\n                  </span>\r\n                  <svg\r\n                    class=\"ah__card-arrow\" width=\"11\" height=\"11\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n                    stroke=\"currentColor\" stroke-width=\"2.6\" stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\" aria-hidden=\"true\"\r\n                  >\r\n                    <polyline points=\"9 6 15 12 9 18\" />\r\n                  </svg>\r\n                } @else {\r\n                  <!-- No \"Open \u203A\" affordance row \u2014 the design's module card (MainContent.dc.html)\r\n                       ends at the description; the whole card is the click target and hover carries\r\n                       the affordance. Removed at the 2026-08-17 fidelity pass. -->\r\n                  <!-- Text stack: icon-to-text spacing is `.ah__card`'s own gap; this wrapper's\r\n                       gap is title-to-description only (module-card fidelity pass, 2026-08-20). -->\r\n                  <span class=\"ah__card-text\">\r\n                    <span class=\"ah__card-title ah__card-title--feature\">{{ mod.labelKey | translate }}</span>\r\n                    @if (mod.descKey; as descKey) {\r\n                      <span class=\"ah__card-desc ah__card-desc--feature\">{{ descKey | translate }}</span>\r\n                    }\r\n                  </span>\r\n                }\r\n              </button>\r\n            }\r\n          </div>\r\n        }\r\n      </section>\r\n    }\r\n  </main>\r\n</div>\r\n", styles: [":host{display:flex;flex-direction:column;min-height:100%;container-type:inline-size;--ah-brand: var(--app-color, var(--module-teal));--ah-brand-deep: var(--app-color-deep, var(--module-teal-deep));--ah-brand-soft: var(--app-color, var(--sys-teal));--ah-brand-ink: var(--app-ink, var(--ink-inverse))}.ah{display:flex;flex-direction:column;flex:1;min-height:100%}.ah__util{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);padding:var(--sp-4) var(--sp-6)}:host-context(.window-content) .ah__brand{display:none}:host-context(.window-content) .ah__util{justify-content:flex-end}:host-context(.window-content) .ah__util:not(:has(>:not(.ah__brand))){display:none}.ah__brand{display:inline-flex;align-items:center;gap:var(--sp-2);padding:0;border:0;background:none;color:var(--ink);font-family:inherit;cursor:pointer}.ah__brand:focus-visible{outline:2px solid;outline-color:var(--focus-ring);outline-offset:2px}.ah__brand-name{font-size:var(--text-md);font-weight:var(--fw-semibold);letter-spacing:-.01em}.ah__main{flex:1;inline-size:100%;max-inline-size:1120px;margin-inline:auto;padding:56px 40px;display:flex;flex-direction:column;justify-content:center;gap:44px}.ah__hero{max-inline-size:640px}.ah__title{margin:0 0 var(--sp-3);font-size:44px;font-weight:var(--fw-semibold);letter-spacing:-.03em;text-wrap:balance;background:linear-gradient(180deg,var(--ink),var(--ink-2));-webkit-background-clip:text;background-clip:text;color:transparent}.ah__sub{margin:0;max-inline-size:560px;font-size:var(--text-lg);line-height:1.55;color:var(--ink-3);text-wrap:pretty}.ah__sec{display:flex;flex-direction:column;gap:var(--sp-4)}.ah__sec--secondary{padding-block-start:28px;border-block-start:1px solid var(--w08)}.ah__sec-hd{display:flex;align-items:center;gap:var(--sp-3);inline-size:100%;padding:0;background:none;border:0;cursor:pointer;font-family:inherit;color:var(--ink);text-align:start}.ah__sec-hd:focus-visible{outline:2px solid;outline-color:var(--focus-ring);outline-offset:2px}.ah__sec-chev{flex-shrink:0;color:var(--ink-3);transition:transform var(--t-overlay)}.ah__sec-title{font-size:var(--text-md);font-weight:var(--fw-semibold);letter-spacing:-.01em}.ah__sec-title--static{margin:0;color:var(--ink-3);font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase}.ah__sec-count{display:inline-grid;place-items:center;min-inline-size:22px;block-size:20px;padding-inline:6px;border-radius:999px;background:var(--bg-3);border:1px solid var(--line);font-size:var(--text-2xs);font-weight:var(--fw-medium);font-variant-numeric:tabular-nums;color:var(--ink-3)}.ah__sec-hint{margin-inline-start:auto;font-size:var(--text-xs);color:var(--ink-3)}.ah__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-top:4px;justify-content:flex-start}.ah__card{display:flex;flex-direction:column;align-items:stretch;position:relative;overflow:hidden;text-align:start;padding:20px;gap:16px;background:linear-gradient(160deg,var(--w055),var(--w02));border:1px solid var(--w09);border-radius:20px;color:inherit;font-family:inherit;cursor:pointer;animation:appTileIn .3s var(--nova-ease-micro) both}.ah__card:nth-child(1){animation-delay:0ms}.ah__card:nth-child(2){animation-delay:20ms}.ah__card:nth-child(3){animation-delay:40ms}.ah__card:nth-child(4){animation-delay:60ms}.ah__card:nth-child(5){animation-delay:80ms}.ah__card:nth-child(6){animation-delay:.1s}.ah__card:nth-child(7){animation-delay:.12s}.ah__card:nth-child(8){animation-delay:.14s}.ah__card:nth-child(9){animation-delay:.16s}.ah__card:nth-child(10){animation-delay:.18s}.ah__card:nth-child(11){animation-delay:.2s}.ah__card:nth-child(12){animation-delay:.22s}.ah__card:nth-child(n+13){animation-delay:.22s}.ah__card{transition:transform var(--t-overlay),box-shadow var(--t-overlay),border-color var(--t-state),background var(--t-state)}.ah__card:hover:not(:disabled){transform:translateY(-3px);background:linear-gradient(160deg,color-mix(in srgb,var(--ah-brand) 22%,transparent),color-mix(in srgb,var(--ah-brand-soft) 5%,transparent));border-color:color-mix(in srgb,var(--ah-brand) 50%,transparent);box-shadow:inset 0 1px color-mix(in srgb,var(--edge-highlight) 20%,transparent),0 20px 46px color-mix(in srgb,var(--ah-brand) 16%,transparent),var(--shadow-filter)}.ah__card:focus-visible{outline:0;border-color:color-mix(in oklab,var(--accent) 50%,transparent);background-image:linear-gradient(160deg,var(--tint-hover),transparent);box-shadow:0 0 0 3px var(--accent-soft),0 20px 46px color-mix(in oklab,var(--accent) 16%,transparent),var(--shadow-filter)}.ah__card:disabled{cursor:default;opacity:.5}.ah__card-ico{display:grid;place-items:center;inline-size:42px;block-size:42px;flex:none;border-radius:13px;background:linear-gradient(140deg,color-mix(in srgb,var(--ah-brand-deep) 62%,transparent),color-mix(in srgb,var(--ah-brand) 30%,transparent));box-shadow:0 6px 16px color-mix(in srgb,var(--ah-brand-deep) 30%,transparent),inset 0 1px color-mix(in srgb,var(--edge-highlight) 50%,transparent);border:0;color:var(--ah-brand-ink);font-size:18px;transition:transform var(--t-overlay)}.ah__card--compact:hover:not(:disabled) .ah__card-ico,.ah__card--compact:focus-visible .ah__card-ico{background:linear-gradient(135deg,var(--accent),var(--sys-teal));box-shadow:inset 0 1px 0 var(--edge-highlight);color:var(--on-accent)}.ah__card-title{font-size:var(--text-sm);font-weight:var(--fw-semibold);letter-spacing:-.01em;color:var(--ink)}.ah__card-text{display:flex;flex-direction:column;gap:5px}.ah__card-title--feature{font-family:var(--font-family);font-weight:var(--fw-semibold);font-size:16.5px;line-height:1.25;letter-spacing:-.005em;color:var(--ink)}.ah__card-desc{font-size:var(--text-xs);line-height:1.45;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ah__card-desc--feature{font-family:var(--font-family);font-weight:400;font-size:13px;line-height:1.45;color:var(--w55);text-wrap:pretty;overflow:visible;white-space:normal}.ah__card-arrow{flex-shrink:0;transition:color var(--t-overlay),transform var(--t-overlay)}.ah__card--compact{flex-direction:row;align-items:center;gap:var(--sp-3);padding:14px 16px;background-color:var(--bg);background-image:linear-gradient(160deg,var(--w035),var(--w035));border-radius:16px;border-color:var(--w08)}.ah__card--compact:hover:not(:disabled),.ah__card--compact:focus-visible{border-color:color-mix(in oklab,var(--accent) 40%,transparent);background-image:linear-gradient(160deg,var(--tint-hover),transparent);box-shadow:0 20px 46px color-mix(in oklab,var(--accent) 16%,transparent),var(--shadow-filter)}.ah__card--compact .ah__card-ico{inline-size:32px;block-size:32px;margin-block-end:0;flex-shrink:0;border-radius:10px;font-size:var(--icon-md);background:var(--bg-3);box-shadow:none;color:var(--ink)}.ah__card-main{display:flex;flex-direction:column;gap:2px;flex:1;min-inline-size:0}.ah__card--compact .ah__card-arrow{color:var(--ink-4)}.ah__card--compact:hover:not(:disabled) .ah__card-arrow{color:var(--accent);transform:translate(2px)}:host-context([dir=rtl]) .ah__card-arrow{transform:scaleX(-1)}:host-context([dir=rtl]) .ah__sec-chev:not(.ah__sec-chev--open){transform:scaleX(-1)}:host-context([dir=rtl]) .ah__card--compact:hover:not(:disabled) .ah__card-arrow{transform:scaleX(-1) translate(2px)}.ah__sec-chev--open{transform:rotate(90deg)}@container (width <= 900px){.ah__main{padding:40px 24px;gap:36px}.ah__title{font-size:36px}.ah__util{padding:var(--sp-3) var(--sp-5)}}@media(width<=900px){.ah__main{padding:40px 24px;gap:36px}.ah__title{font-size:36px}.ah__util{padding:var(--sp-3) var(--sp-5)}}@container (width <= 560px){.ah__title{font-size:30px}.ah__sub{font-size:var(--text-sm)}.ah__sec-hint{display:none}}@media(width<=560px){.ah__title{font-size:30px}.ah__sub{font-size:var(--text-sm)}.ah__sec-hint{display:none}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: FlyAppHomeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fly-app-home', standalone: true, imports: [NgTemplateOutlet, TranslatePipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"ah\">\r\n  <header class=\"ah__util\">\r\n    <button type=\"button\" class=\"ah__brand\" (click)=\"brandSelected.emit()\">\r\n      <span class=\"ah__brand-mark\"><ng-content select=\"[app-home-brand]\" /></span>\r\n      @if (brandLabelKey(); as key) {\r\n        <span class=\"ah__brand-name\">{{ key | translate }}</span>\r\n      }\r\n    </button>\r\n    <ng-content select=\"[app-home-actions]\" />\r\n  </header>\r\n\r\n  <main class=\"ah__main\">\r\n    @if (titleKey() || subtitleKey()) {\r\n      <section class=\"ah__hero\">\r\n        @if (titleKey(); as key) {\r\n          <h1 class=\"ah__title\">{{ key | translate }}</h1>\r\n        }\r\n        @if (subtitleKey(); as key) {\r\n          <p class=\"ah__sub\">{{ key | translate }}</p>\r\n        }\r\n      </section>\r\n    }\r\n\r\n    @for (row of rows(); track row.index) {\r\n      <section\r\n        class=\"ah__sec\"\r\n        [class.ah__sec--secondary]=\"row.index > 0\"\r\n        [attr.aria-label]=\"row.section.titleKey ? null : (modulesLabelKey() | translate)\"\r\n      >\r\n        @if (row.section.titleKey; as titleKey) {\r\n          @if (row.section.collapsible) {\r\n            <button\r\n              type=\"button\"\r\n              class=\"ah__sec-hd\"\r\n              (click)=\"toggle(row.index)\"\r\n              [attr.aria-expanded]=\"row.expanded\"\r\n              [attr.aria-controls]=\"sectionId(row.index)\"\r\n            >\r\n              <!-- Points end-ward when shut, down when open. `--open` wins over the RTL\r\n                   flip below because a downward chevron has no direction to mirror. -->\r\n              <svg\r\n                class=\"ah__sec-chev\"\r\n                [class.ah__sec-chev--open]=\"row.expanded\"\r\n                width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\"\r\n                stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"\r\n              >\r\n                <polyline points=\"9 6 15 12 9 18\" />\r\n              </svg>\r\n              <span class=\"ah__sec-title\">{{ titleKey | translate }}</span>\r\n              <span class=\"ah__sec-count\">{{ row.section.modules.length }}</span>\r\n              @if (row.hintKey; as hint) {\r\n                <span class=\"ah__sec-hint\">{{ hint | translate }}</span>\r\n              }\r\n            </button>\r\n          } @else {\r\n            <h2 class=\"ah__sec-title ah__sec-title--static\">{{ titleKey | translate }}</h2>\r\n          }\r\n        }\r\n\r\n        @if (row.expanded) {\r\n          <div class=\"ah__grid\" [class.ah__grid--compact]=\"row.layout === 'compact'\" [id]=\"sectionId(row.index)\">\r\n            @for (mod of row.section.modules; track mod.key) {\r\n              <button\r\n                type=\"button\"\r\n                class=\"ah__card\"\r\n                [class.ah__card--compact]=\"row.layout === 'compact'\"\r\n                [disabled]=\"mod.disabled\"\r\n                (click)=\"select(mod)\"\r\n              >\r\n                <span class=\"ah__card-ico\">\r\n                  @if (iconFor(mod.key); as tpl) {\r\n                    <ng-container *ngTemplateOutlet=\"tpl\" />\r\n                  } @else if (mod.iconClass) {\r\n                    <i [class]=\"mod.iconClass\" aria-hidden=\"true\"></i>\r\n                  }\r\n                </span>\r\n\r\n                @if (row.layout === 'compact') {\r\n                  <span class=\"ah__card-main\">\r\n                    <span class=\"ah__card-title\">{{ mod.labelKey | translate }}</span>\r\n                    @if (mod.descKey; as descKey) {\r\n                      <span class=\"ah__card-desc\">{{ descKey | translate }}</span>\r\n                    }\r\n                  </span>\r\n                  <svg\r\n                    class=\"ah__card-arrow\" width=\"11\" height=\"11\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n                    stroke=\"currentColor\" stroke-width=\"2.6\" stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\" aria-hidden=\"true\"\r\n                  >\r\n                    <polyline points=\"9 6 15 12 9 18\" />\r\n                  </svg>\r\n                } @else {\r\n                  <!-- No \"Open \u203A\" affordance row \u2014 the design's module card (MainContent.dc.html)\r\n                       ends at the description; the whole card is the click target and hover carries\r\n                       the affordance. Removed at the 2026-08-17 fidelity pass. -->\r\n                  <!-- Text stack: icon-to-text spacing is `.ah__card`'s own gap; this wrapper's\r\n                       gap is title-to-description only (module-card fidelity pass, 2026-08-20). -->\r\n                  <span class=\"ah__card-text\">\r\n                    <span class=\"ah__card-title ah__card-title--feature\">{{ mod.labelKey | translate }}</span>\r\n                    @if (mod.descKey; as descKey) {\r\n                      <span class=\"ah__card-desc ah__card-desc--feature\">{{ descKey | translate }}</span>\r\n                    }\r\n                  </span>\r\n                }\r\n              </button>\r\n            }\r\n          </div>\r\n        }\r\n      </section>\r\n    }\r\n  </main>\r\n</div>\r\n", styles: [":host{display:flex;flex-direction:column;min-height:100%;container-type:inline-size}.ah{display:flex;flex-direction:column;flex:1;min-height:100%}.ah__util{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);padding:var(--sp-4) var(--sp-6)}:host-context(.window-content) .ah__brand{display:none}:host-context(.window-content) .ah__util{justify-content:flex-end}:host-context(.window-content) .ah__util:not(:has(>:not(.ah__brand))){display:none}.ah__brand{display:inline-flex;align-items:center;gap:var(--sp-2);padding:0;border:0;background:none;color:var(--ink);font-family:inherit;cursor:pointer}.ah__brand:focus-visible{outline:2px solid;outline-color:var(--focus-ring);outline-offset:2px}.ah__brand-name{font-size:var(--text-md);font-weight:var(--fw-semibold);letter-spacing:-.01em}.ah__main{flex:1;inline-size:100%;max-inline-size:1120px;margin-inline:auto;padding:56px 40px;display:flex;flex-direction:column;justify-content:center;gap:44px}.ah__hero{max-inline-size:640px}.ah__title{margin:0 0 var(--sp-3);font-size:44px;font-weight:var(--fw-semibold);letter-spacing:-.03em;text-wrap:balance;background:linear-gradient(180deg,var(--ink),var(--ink-2));-webkit-background-clip:text;background-clip:text;color:transparent}.ah__sub{margin:0;max-inline-size:560px;font-size:var(--text-lg);line-height:1.55;color:var(--ink-3);text-wrap:pretty}.ah__sec{display:flex;flex-direction:column;gap:var(--sp-4)}.ah__sec--secondary{padding-block-start:28px;border-block-start:1px solid var(--w08)}.ah__sec-hd{display:flex;align-items:center;gap:var(--sp-3);inline-size:100%;padding:0;background:none;border:0;cursor:pointer;font-family:inherit;color:var(--ink);text-align:start}.ah__sec-hd:focus-visible{outline:2px solid;outline-color:var(--focus-ring);outline-offset:2px}.ah__sec-chev{flex-shrink:0;color:var(--ink-3);transition:transform var(--t-overlay)}.ah__sec-title{font-size:var(--text-md);font-weight:var(--fw-semibold);letter-spacing:-.01em}.ah__sec-title--static{margin:0;color:var(--ink-3);font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase}.ah__sec-count{display:inline-grid;place-items:center;min-inline-size:22px;block-size:20px;padding-inline:6px;border-radius:999px;background:var(--bg-3);border:1px solid var(--line);font-size:var(--text-2xs);font-weight:var(--fw-medium);font-variant-numeric:tabular-nums;color:var(--ink-3)}.ah__sec-hint{margin-inline-start:auto;font-size:var(--text-xs);color:var(--ink-3)}.ah__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-top:4px;justify-content:flex-start}.ah__card{display:flex;flex-direction:column;align-items:stretch;position:relative;overflow:hidden;text-align:start;padding:20px;gap:16px;background:linear-gradient(160deg,var(--w055),var(--w02));border:1px solid var(--w09);border-radius:20px;color:inherit;font-family:inherit;cursor:pointer;animation:appTileIn .3s var(--nova-ease-micro) both}.ah__card:nth-child(1){animation-delay:0ms}.ah__card:nth-child(2){animation-delay:20ms}.ah__card:nth-child(3){animation-delay:40ms}.ah__card:nth-child(4){animation-delay:60ms}.ah__card:nth-child(5){animation-delay:80ms}.ah__card:nth-child(6){animation-delay:.1s}.ah__card:nth-child(7){animation-delay:.12s}.ah__card:nth-child(8){animation-delay:.14s}.ah__card:nth-child(9){animation-delay:.16s}.ah__card:nth-child(10){animation-delay:.18s}.ah__card:nth-child(11){animation-delay:.2s}.ah__card:nth-child(12){animation-delay:.22s}.ah__card:nth-child(n+13){animation-delay:.22s}.ah__card{transition:transform var(--t-overlay),box-shadow var(--t-overlay),border-color var(--t-state),background var(--t-state)}.ah__card:hover:not(:disabled){transform:translateY(-3px);background:linear-gradient(160deg,color-mix(in srgb,var(--module-teal) 22%,transparent),color-mix(in srgb,var(--sys-teal) 5%,transparent));border-color:color-mix(in srgb,var(--module-teal) 50%,transparent);box-shadow:inset 0 1px color-mix(in srgb,var(--edge-highlight) 20%,transparent),0 20px 46px color-mix(in srgb,var(--module-teal) 16%,transparent),var(--shadow-filter)}.ah__card:focus-visible{outline:0;border-color:color-mix(in oklab,var(--accent) 50%,transparent);background-image:linear-gradient(160deg,var(--tint-hover),transparent);box-shadow:0 0 0 3px var(--accent-soft),0 20px 46px color-mix(in oklab,var(--accent) 16%,transparent),var(--shadow-filter)}.ah__card:disabled{cursor:default;opacity:.5}.ah__card-ico{display:grid;place-items:center;inline-size:42px;block-size:42px;flex:none;border-radius:13px;background:linear-gradient(140deg,color-mix(in srgb,var(--module-teal-deep) 62%,transparent),color-mix(in srgb,var(--module-teal) 30%,transparent));box-shadow:0 6px 16px color-mix(in srgb,var(--module-teal-deep) 30%,transparent),inset 0 1px color-mix(in srgb,var(--edge-highlight) 50%,transparent);border:0;color:var(--ink-inverse);font-size:18px;transition:transform var(--t-overlay)}.ah__card--compact:hover:not(:disabled) .ah__card-ico,.ah__card--compact:focus-visible .ah__card-ico{background:linear-gradient(135deg,var(--accent),var(--sys-teal));box-shadow:inset 0 1px 0 var(--edge-highlight);color:var(--on-accent)}.ah__card-title{font-size:var(--text-sm);font-weight:var(--fw-semibold);letter-spacing:-.01em;color:var(--ink)}.ah__card-text{display:flex;flex-direction:column;gap:5px}.ah__card-title--feature{font-family:var(--font-family);font-weight:var(--fw-semibold);font-size:16.5px;line-height:1.25;letter-spacing:-.005em;color:var(--ink)}.ah__card-desc{font-size:var(--text-xs);line-height:1.45;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ah__card-desc--feature{font-family:var(--font-family);font-weight:400;font-size:13px;line-height:1.45;color:var(--w55);text-wrap:pretty;overflow:visible;white-space:normal}.ah__card-arrow{flex-shrink:0;transition:color var(--t-overlay),transform var(--t-overlay)}.ah__card--compact{flex-direction:row;align-items:center;gap:var(--sp-3);padding:14px 16px;background-color:var(--bg);background-image:linear-gradient(160deg,var(--w035),var(--w035));border-radius:16px;border-color:var(--w08)}.ah__card--compact:hover:not(:disabled),.ah__card--compact:focus-visible{border-color:color-mix(in oklab,var(--accent) 40%,transparent);background-image:linear-gradient(160deg,var(--tint-hover),transparent);box-shadow:0 20px 46px color-mix(in oklab,var(--accent) 16%,transparent),var(--shadow-filter)}.ah__card--compact .ah__card-ico{inline-size:32px;block-size:32px;margin-block-end:0;flex-shrink:0;border-radius:10px;font-size:var(--icon-md);background:var(--bg-3);box-shadow:none;color:var(--ink)}.ah__card-main{display:flex;flex-direction:column;gap:2px;flex:1;min-inline-size:0}.ah__card--compact .ah__card-arrow{color:var(--ink-4)}.ah__card--compact:hover:not(:disabled) .ah__card-arrow{color:var(--accent);transform:translate(2px)}:host-context([dir=rtl]) .ah__card-arrow{transform:scaleX(-1)}:host-context([dir=rtl]) .ah__sec-chev:not(.ah__sec-chev--open){transform:scaleX(-1)}:host-context([dir=rtl]) .ah__card--compact:hover:not(:disabled) .ah__card-arrow{transform:scaleX(-1) translate(2px)}.ah__sec-chev--open{transform:rotate(90deg)}@container (width <= 900px){.ah__main{padding:40px 24px;gap:36px}.ah__title{font-size:36px}.ah__util{padding:var(--sp-3) var(--sp-5)}}@media(width<=900px){.ah__main{padding:40px 24px;gap:36px}.ah__title{font-size:36px}.ah__util{padding:var(--sp-3) var(--sp-5)}}@container (width <= 560px){.ah__title{font-size:30px}.ah__sub{font-size:var(--text-sm)}.ah__sec-hint{display:none}}@media(width<=560px){.ah__title{font-size:30px}.ah__sub{font-size:var(--text-sm)}.ah__sec-hint{display:none}}\n"] }]
+            args: [{ selector: 'fly-app-home', standalone: true, imports: [NgTemplateOutlet, TranslatePipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"ah\">\r\n  <header class=\"ah__util\">\r\n    <button type=\"button\" class=\"ah__brand\" (click)=\"brandSelected.emit()\">\r\n      <span class=\"ah__brand-mark\"><ng-content select=\"[app-home-brand]\" /></span>\r\n      @if (brandLabelKey(); as key) {\r\n        <span class=\"ah__brand-name\">{{ key | translate }}</span>\r\n      }\r\n    </button>\r\n    <ng-content select=\"[app-home-actions]\" />\r\n  </header>\r\n\r\n  <main class=\"ah__main\">\r\n    @if (titleKey() || subtitleKey()) {\r\n      <section class=\"ah__hero\">\r\n        @if (titleKey(); as key) {\r\n          <h1 class=\"ah__title\">{{ key | translate }}</h1>\r\n        }\r\n        @if (subtitleKey(); as key) {\r\n          <p class=\"ah__sub\">{{ key | translate }}</p>\r\n        }\r\n      </section>\r\n    }\r\n\r\n    @for (row of rows(); track row.index) {\r\n      <section\r\n        class=\"ah__sec\"\r\n        [class.ah__sec--secondary]=\"row.index > 0\"\r\n        [attr.aria-label]=\"row.section.titleKey ? null : (modulesLabelKey() | translate)\"\r\n      >\r\n        @if (row.section.titleKey; as titleKey) {\r\n          @if (row.section.collapsible) {\r\n            <button\r\n              type=\"button\"\r\n              class=\"ah__sec-hd\"\r\n              (click)=\"toggle(row.index)\"\r\n              [attr.aria-expanded]=\"row.expanded\"\r\n              [attr.aria-controls]=\"sectionId(row.index)\"\r\n            >\r\n              <!-- Points end-ward when shut, down when open. `--open` wins over the RTL\r\n                   flip below because a downward chevron has no direction to mirror. -->\r\n              <svg\r\n                class=\"ah__sec-chev\"\r\n                [class.ah__sec-chev--open]=\"row.expanded\"\r\n                width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\"\r\n                stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"\r\n              >\r\n                <polyline points=\"9 6 15 12 9 18\" />\r\n              </svg>\r\n              <span class=\"ah__sec-title\">{{ titleKey | translate }}</span>\r\n              <span class=\"ah__sec-count\">{{ row.section.modules.length }}</span>\r\n              @if (row.hintKey; as hint) {\r\n                <span class=\"ah__sec-hint\">{{ hint | translate }}</span>\r\n              }\r\n            </button>\r\n          } @else {\r\n            <h2 class=\"ah__sec-title ah__sec-title--static\">{{ titleKey | translate }}</h2>\r\n          }\r\n        }\r\n\r\n        @if (row.expanded) {\r\n          <div class=\"ah__grid\" [class.ah__grid--compact]=\"row.layout === 'compact'\" [id]=\"sectionId(row.index)\">\r\n            @for (mod of row.section.modules; track mod.key) {\r\n              <button\r\n                type=\"button\"\r\n                class=\"ah__card\"\r\n                [class.ah__card--compact]=\"row.layout === 'compact'\"\r\n                [disabled]=\"mod.disabled\"\r\n                (click)=\"select(mod)\"\r\n              >\r\n                <span class=\"ah__card-ico\">\r\n                  @if (iconFor(mod.key); as tpl) {\r\n                    <ng-container *ngTemplateOutlet=\"tpl\" />\r\n                  } @else if (mod.iconClass) {\r\n                    <i [class]=\"mod.iconClass\" aria-hidden=\"true\"></i>\r\n                  }\r\n                </span>\r\n\r\n                @if (row.layout === 'compact') {\r\n                  <span class=\"ah__card-main\">\r\n                    <span class=\"ah__card-title\">{{ mod.labelKey | translate }}</span>\r\n                    @if (mod.descKey; as descKey) {\r\n                      <span class=\"ah__card-desc\">{{ descKey | translate }}</span>\r\n                    }\r\n                  </span>\r\n                  <svg\r\n                    class=\"ah__card-arrow\" width=\"11\" height=\"11\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n                    stroke=\"currentColor\" stroke-width=\"2.6\" stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\" aria-hidden=\"true\"\r\n                  >\r\n                    <polyline points=\"9 6 15 12 9 18\" />\r\n                  </svg>\r\n                } @else {\r\n                  <!-- No \"Open \u203A\" affordance row \u2014 the design's module card (MainContent.dc.html)\r\n                       ends at the description; the whole card is the click target and hover carries\r\n                       the affordance. Removed at the 2026-08-17 fidelity pass. -->\r\n                  <!-- Text stack: icon-to-text spacing is `.ah__card`'s own gap; this wrapper's\r\n                       gap is title-to-description only (module-card fidelity pass, 2026-08-20). -->\r\n                  <span class=\"ah__card-text\">\r\n                    <span class=\"ah__card-title ah__card-title--feature\">{{ mod.labelKey | translate }}</span>\r\n                    @if (mod.descKey; as descKey) {\r\n                      <span class=\"ah__card-desc ah__card-desc--feature\">{{ descKey | translate }}</span>\r\n                    }\r\n                  </span>\r\n                }\r\n              </button>\r\n            }\r\n          </div>\r\n        }\r\n      </section>\r\n    }\r\n  </main>\r\n</div>\r\n", styles: [":host{display:flex;flex-direction:column;min-height:100%;container-type:inline-size;--ah-brand: var(--app-color, var(--module-teal));--ah-brand-deep: var(--app-color-deep, var(--module-teal-deep));--ah-brand-soft: var(--app-color, var(--sys-teal));--ah-brand-ink: var(--app-ink, var(--ink-inverse))}.ah{display:flex;flex-direction:column;flex:1;min-height:100%}.ah__util{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);padding:var(--sp-4) var(--sp-6)}:host-context(.window-content) .ah__brand{display:none}:host-context(.window-content) .ah__util{justify-content:flex-end}:host-context(.window-content) .ah__util:not(:has(>:not(.ah__brand))){display:none}.ah__brand{display:inline-flex;align-items:center;gap:var(--sp-2);padding:0;border:0;background:none;color:var(--ink);font-family:inherit;cursor:pointer}.ah__brand:focus-visible{outline:2px solid;outline-color:var(--focus-ring);outline-offset:2px}.ah__brand-name{font-size:var(--text-md);font-weight:var(--fw-semibold);letter-spacing:-.01em}.ah__main{flex:1;inline-size:100%;max-inline-size:1120px;margin-inline:auto;padding:56px 40px;display:flex;flex-direction:column;justify-content:center;gap:44px}.ah__hero{max-inline-size:640px}.ah__title{margin:0 0 var(--sp-3);font-size:44px;font-weight:var(--fw-semibold);letter-spacing:-.03em;text-wrap:balance;background:linear-gradient(180deg,var(--ink),var(--ink-2));-webkit-background-clip:text;background-clip:text;color:transparent}.ah__sub{margin:0;max-inline-size:560px;font-size:var(--text-lg);line-height:1.55;color:var(--ink-3);text-wrap:pretty}.ah__sec{display:flex;flex-direction:column;gap:var(--sp-4)}.ah__sec--secondary{padding-block-start:28px;border-block-start:1px solid var(--w08)}.ah__sec-hd{display:flex;align-items:center;gap:var(--sp-3);inline-size:100%;padding:0;background:none;border:0;cursor:pointer;font-family:inherit;color:var(--ink);text-align:start}.ah__sec-hd:focus-visible{outline:2px solid;outline-color:var(--focus-ring);outline-offset:2px}.ah__sec-chev{flex-shrink:0;color:var(--ink-3);transition:transform var(--t-overlay)}.ah__sec-title{font-size:var(--text-md);font-weight:var(--fw-semibold);letter-spacing:-.01em}.ah__sec-title--static{margin:0;color:var(--ink-3);font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase}.ah__sec-count{display:inline-grid;place-items:center;min-inline-size:22px;block-size:20px;padding-inline:6px;border-radius:999px;background:var(--bg-3);border:1px solid var(--line);font-size:var(--text-2xs);font-weight:var(--fw-medium);font-variant-numeric:tabular-nums;color:var(--ink-3)}.ah__sec-hint{margin-inline-start:auto;font-size:var(--text-xs);color:var(--ink-3)}.ah__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-top:4px;justify-content:flex-start}.ah__card{display:flex;flex-direction:column;align-items:stretch;position:relative;overflow:hidden;text-align:start;padding:20px;gap:16px;background:linear-gradient(160deg,var(--w055),var(--w02));border:1px solid var(--w09);border-radius:20px;color:inherit;font-family:inherit;cursor:pointer;animation:appTileIn .3s var(--nova-ease-micro) both}.ah__card:nth-child(1){animation-delay:0ms}.ah__card:nth-child(2){animation-delay:20ms}.ah__card:nth-child(3){animation-delay:40ms}.ah__card:nth-child(4){animation-delay:60ms}.ah__card:nth-child(5){animation-delay:80ms}.ah__card:nth-child(6){animation-delay:.1s}.ah__card:nth-child(7){animation-delay:.12s}.ah__card:nth-child(8){animation-delay:.14s}.ah__card:nth-child(9){animation-delay:.16s}.ah__card:nth-child(10){animation-delay:.18s}.ah__card:nth-child(11){animation-delay:.2s}.ah__card:nth-child(12){animation-delay:.22s}.ah__card:nth-child(n+13){animation-delay:.22s}.ah__card{transition:transform var(--t-overlay),box-shadow var(--t-overlay),border-color var(--t-state),background var(--t-state)}.ah__card:hover:not(:disabled){transform:translateY(-3px);background:linear-gradient(160deg,color-mix(in srgb,var(--ah-brand) 22%,transparent),color-mix(in srgb,var(--ah-brand-soft) 5%,transparent));border-color:color-mix(in srgb,var(--ah-brand) 50%,transparent);box-shadow:inset 0 1px color-mix(in srgb,var(--edge-highlight) 20%,transparent),0 20px 46px color-mix(in srgb,var(--ah-brand) 16%,transparent),var(--shadow-filter)}.ah__card:focus-visible{outline:0;border-color:color-mix(in oklab,var(--accent) 50%,transparent);background-image:linear-gradient(160deg,var(--tint-hover),transparent);box-shadow:0 0 0 3px var(--accent-soft),0 20px 46px color-mix(in oklab,var(--accent) 16%,transparent),var(--shadow-filter)}.ah__card:disabled{cursor:default;opacity:.5}.ah__card-ico{display:grid;place-items:center;inline-size:42px;block-size:42px;flex:none;border-radius:13px;background:linear-gradient(140deg,color-mix(in srgb,var(--ah-brand-deep) 62%,transparent),color-mix(in srgb,var(--ah-brand) 30%,transparent));box-shadow:0 6px 16px color-mix(in srgb,var(--ah-brand-deep) 30%,transparent),inset 0 1px color-mix(in srgb,var(--edge-highlight) 50%,transparent);border:0;color:var(--ah-brand-ink);font-size:18px;transition:transform var(--t-overlay)}.ah__card--compact:hover:not(:disabled) .ah__card-ico,.ah__card--compact:focus-visible .ah__card-ico{background:linear-gradient(135deg,var(--accent),var(--sys-teal));box-shadow:inset 0 1px 0 var(--edge-highlight);color:var(--on-accent)}.ah__card-title{font-size:var(--text-sm);font-weight:var(--fw-semibold);letter-spacing:-.01em;color:var(--ink)}.ah__card-text{display:flex;flex-direction:column;gap:5px}.ah__card-title--feature{font-family:var(--font-family);font-weight:var(--fw-semibold);font-size:16.5px;line-height:1.25;letter-spacing:-.005em;color:var(--ink)}.ah__card-desc{font-size:var(--text-xs);line-height:1.45;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ah__card-desc--feature{font-family:var(--font-family);font-weight:400;font-size:13px;line-height:1.45;color:var(--w55);text-wrap:pretty;overflow:visible;white-space:normal}.ah__card-arrow{flex-shrink:0;transition:color var(--t-overlay),transform var(--t-overlay)}.ah__card--compact{flex-direction:row;align-items:center;gap:var(--sp-3);padding:14px 16px;background-color:var(--bg);background-image:linear-gradient(160deg,var(--w035),var(--w035));border-radius:16px;border-color:var(--w08)}.ah__card--compact:hover:not(:disabled),.ah__card--compact:focus-visible{border-color:color-mix(in oklab,var(--accent) 40%,transparent);background-image:linear-gradient(160deg,var(--tint-hover),transparent);box-shadow:0 20px 46px color-mix(in oklab,var(--accent) 16%,transparent),var(--shadow-filter)}.ah__card--compact .ah__card-ico{inline-size:32px;block-size:32px;margin-block-end:0;flex-shrink:0;border-radius:10px;font-size:var(--icon-md);background:var(--bg-3);box-shadow:none;color:var(--ink)}.ah__card-main{display:flex;flex-direction:column;gap:2px;flex:1;min-inline-size:0}.ah__card--compact .ah__card-arrow{color:var(--ink-4)}.ah__card--compact:hover:not(:disabled) .ah__card-arrow{color:var(--accent);transform:translate(2px)}:host-context([dir=rtl]) .ah__card-arrow{transform:scaleX(-1)}:host-context([dir=rtl]) .ah__sec-chev:not(.ah__sec-chev--open){transform:scaleX(-1)}:host-context([dir=rtl]) .ah__card--compact:hover:not(:disabled) .ah__card-arrow{transform:scaleX(-1) translate(2px)}.ah__sec-chev--open{transform:rotate(90deg)}@container (width <= 900px){.ah__main{padding:40px 24px;gap:36px}.ah__title{font-size:36px}.ah__util{padding:var(--sp-3) var(--sp-5)}}@media(width<=900px){.ah__main{padding:40px 24px;gap:36px}.ah__title{font-size:36px}.ah__util{padding:var(--sp-3) var(--sp-5)}}@container (width <= 560px){.ah__title{font-size:30px}.ah__sub{font-size:var(--text-sm)}.ah__sec-hint{display:none}}@media(width<=560px){.ah__title{font-size:30px}.ah__sub{font-size:var(--text-sm)}.ah__sec-hint{display:none}}\n"] }]
         }], propDecorators: { brandLabelKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "brandLabelKey", required: false }] }], titleKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleKey", required: false }] }], subtitleKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitleKey", required: false }] }], sections: [{ type: i0.Input, args: [{ isSignal: true, alias: "sections", required: false }] }], modulesLabelKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "modulesLabelKey", required: false }] }], moduleSelected: [{ type: i0.Output, args: ["moduleSelected"] }], brandSelected: [{ type: i0.Output, args: ["brandSelected"] }], icons: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => FlyModuleIconDirective), { isSignal: true }] }] } });
 
 /**
@@ -27838,5 +27867,5 @@ const AUDIENCE_ERROR_CODES = {
  * Generated bundle index. Do not edit.
  */
 
-export { AGENT_DRAG_MIME, AGENT_PAYLOAD_VERSION, APP_LOOKUP, AUDIENCE_ERROR_CODES, AUDIENCE_LIMITS, AUDIENCE_PRESETS, AUDIENCE_TERM_KINDS, AgentActionBus, AgentActionUnsupportedDispatchError, AgentCommandRegistry, AgentDropRegistry, AgentFlightAnimator, AgentLookupRegistry, AgentPayloadOversizeError, AudienceBuilderComponent, AuthService, BilingualFieldComponent, CRON_MODES, CRON_WEEKDAYS, ContextMenuComponent, DEFAULT_AGENT_PAYLOAD_LIMITS, DEFAULT_FLY_THEME_MODE, DS_BASELINE_LOCALES, DashboardKpiComponent, DialogResult, ENTITY_LINK_LAUNCHER, EntityLookupComponent, FLYOS_LAUNCH_EVENT, FLYOS_LAUNCH_REQUEST_EVENT, FLYOS_REMOTE_ROUTE_EVENT, FLY_ACCENT_PROPERTY, FLY_ADMIN_ROLES, FLY_CHUNK_RELOAD_FLAG, FLY_COMPACT_THRESHOLD, FLY_COUNTRIES, FLY_CURRENCIES_BRIEF_ENDPOINT, FLY_CURRENCY_DEFAULT_ENDPOINT, FLY_EMOJI_BY_ID, FLY_EMOJI_CATEGORIES, FLY_EMOJI_CATEGORY_BY_ID, FLY_EMOJI_DEFAULT_CATEGORIES, FLY_EMOJI_PACK, FLY_EMOJI_PACK_MISSING_MESSAGE, FLY_EMOJI_PREVIEW_COUNT, FLY_EMPTY_VALUE, FLY_LOCALE_CATALOG, FLY_MAGIC_BAR_EVENT, FLY_MAGIC_BAR_ICONS, FLY_MAGIC_BAR_STORE_KEY, FLY_NF_CACHE_HEAL_FLAG, FLY_RELOAD_DEBOUNCE_MS, FLY_RELOAD_REARM_MS, FLY_REMOTE_BASE_PATH, FLY_REMOTE_CONTEXT_EVENT, FLY_REMOTE_CONTEXT_STORE_KEY, FLY_REMOTE_ROUTES, FLY_SCAN_PENDING_DEFAULT_DELAY_MS, FLY_SCAN_PENDING_MAX_RETRIES, FLY_SCAN_PENDING_STATUS, FLY_SEARCH_DEBOUNCE_MS, FLY_SKIN_TONES, FLY_STANDALONE_AUTH_CONFIG, FLY_STRATEGY_OBJECTIVES_LOOKUP_ENDPOINT, FLY_THEME_MODE_IDS, FLY_VIEWPORT_IS_MOBILE, FLY_WINDOW_BREADCRUMBS_EVENT, FLY_WINDOW_BREADCRUMBS_STORE_KEY, FLY_WINDOW_HELP_HINT_EVENT, FLY_WINDOW_PAGE_TITLE_EVENT, FlyAchievementProgressComponent, FlyActionMenuComponent, FlyActionStackComponent, FlyAgentDraggableDirective, FlyAnimatedEmojiComponent, FlyAppHomeComponent, FlyAppTopbarComponent, FlyAppUnavailableComponent, FlyAuthLiveRefresh, FlyBadgeWallComponent, FlyBlockUiComponent, FlyBreadcrumbComponent, FlyButtonComponent, FlyBytesPipe, FlyCaptchaComponent, FlyCardActionsComponent, FlyCardBodyComponent, FlyCardComponent, FlyCardFooterComponent, FlyCardGridComponent, FlyCardMediaComponent, FlyCardMetaComponent, FlyCardStatusComponent, FlyCardTitleComponent, FlyCellDirective, FlyCheckboxComponent, FlyChipComponent, FlyChunkReloadErrorHandler, FlyClickOutsideDirective, FlyCollapsibleComponent, FlyCommentThreadComponent, FlyCompactNumberPipe, FlyConfirmDialogComponent, FlyControlDirective, FlyCronBuilderComponent, FlyCurrencyCatalogService, FlyCurrencySelectorComponent, FlyDataTableComponent, FlyDatePipe, FlyDateTimePipe, FlyDebouncer, FlyDecimalNumberPipe, FlyDeepLinkPrefetchService, FlyDetailCardComponent, FlyDetailShellComponent, FlyDrawerComponent, FlyDurationPipe, FlyDynamicFormComponent, FlyEmojiPickerComponent, FlyFieldComponent, FlyFileDownloadService, FlyFileUploadComponent, FlyFilterPanelComponent, FlyFormBannerComponent, FlyFormFooterComponent, FlyFormGridComponent, FlyFormSectionComponent, FlyFullNumberPipe, FlyGanttComponent, FlyHubClient, FlyIconButtonComponent, FlyIfAdminDirective, FlyIfRoleDirective, FlyImageUploadComponent, FlyLeaderboardComponent, FlyLifecyclePipelineComponent, FlyMagicActionsComponent, FlyMetaListComponent, FlyModalComponent, FlyModerationQueueComponent, FlyModuleIconDirective, FlyMoneyPipe, FlyOverviewKpiRowComponent, FlyOverviewRowsComponent, FlyOverviewSectionComponent, FlyOverviewSurfaceComponent, FlyPagerComponent, FlyPaginationComponent, FlyPeoplePickerComponent, FlyPointsTierComponent, FlyProgressComponent, FlyRelativeTimePipe, FlyRemoteContextService, FlyRemoteRouter, FlyRemoteRouterOutletComponent, FlySearchInputComponent, FlySectionHeaderComponent, FlySecureSrcDirective, FlySegmentedComponent, FlySelectComponent, FlySkeletonComponent, FlySliderComponent, FlySparklineComponent, FlySpinnerComponent, FlyStandaloneAuthCallbackComponent, FlyStandaloneAuthService, FlyStandaloneMagicActionsComponent, FlyStateMessageComponent, FlyStrategySelectorComponent, FlyDynamicFormComponent as FlySurveyFormComponent, FlyTabComponent, FlyTabsComponent, FlyTagsInputComponent, FlyThemeService, FlyTimePipe, FlyToastService, FlyToggleComponent, FlyTooltipDirective, FlyTreeNavComponent, FlyTypeaheadComponent, FlyUserDirectoryService, FlyWindowHelpService, FlyWindowTitleService, FlyosPendingLaunchesGlobalKey, FlyosShellHandlesLaunchRequestsGlobalKey, FlyosShellOwnsHistoryGlobalKey, GANTT_DEPENDENCY_TYPES, GANTT_ROW_TINT_ALPHA, GANTT_ZOOMS, I18nService, LAUNCH_CONTEXT, MAGIC_BAR_SEARCH_WIDTH_DEFAULT, MAGIC_BAR_SEARCH_WIDTH_MAX, MAGIC_BAR_SEARCH_WIDTH_MIN, MagicBarRegistry, MessageBoxButtons, MessageBoxComponent, MessageBoxIcon, MessageBoxService, MockAuthService, NOVA_PRIORITY_TONE, NOVA_STATUS_TONE, NOVA_TONE_FALLBACK, OverlayStack, PRESENCE_COLORS, PageHeaderComponent, RTL_LOCALE_SET, SHARE_ORG_CHART_SYSTEM_KEY_APPS, SHARE_ORG_CHART_SYSTEM_KEY_DEFAULT, SHARE_PANEL_DEFAULT_FILE_LEVELS, STATE_DEFAULT_ICONS, STATE_DEFAULT_MESSAGE_KEYS, STEP_UP_CODE, STEP_UP_REAUTH_HANDLER, STEP_UP_RETURN_KEY, SUPPORTED_AGENT_PAYLOAD_VERSIONS, SharePanelComponent, SourceAppResolver, StandaloneWindowManagerService, StatusBadgeComponent, StepUpService, ToastHostComponent, TranslatePipe, WINDOW_DATA, WINDOW_HELP_HINT, WindowBreadcrumbsRegistry, WindowManagerService, applySkinTone, applySuggestion, ariaSort, buildCron, canConfirm, canGoNext$1 as canGoNext, canGoPrev$1 as canGoPrev, captureFocus, clampMagicBarSearchWidth, clampPage$1 as clampPage, clampSliderValue, connectRemoteLaunch, enterActivatesNatively, filterGroup, filterSuggestions, findLocaleByDialect, findLocaleByPrefix, firstEnabledIndex, firstModuleIndex, flattenModules, flyAdminGuard, flyApiErrorMessage, flyCaptchaBase64Utf8, flyCaptchaBuildToken, flyCaptchaSha256Hex, flyCompactNumber, flyDebounced, flyDecimalNumber, flyDownloadBlob, flyDuration, flyEmojiFor, flyEmojiIsTonable, flyEmojiPackUrl, flyExportFileName, flyFirstEnabledIndex, flyFormatBytes, flyFormatDate, flyFormatDateTime, flyFormatMoney, flyFormatTime, flyFullNumber, flyNextEnabledIndex, flyNextSegmentIndex, flyRelativeTime, flyResolveActiveTab, flyRoleGuard, flyScanPendingDelayMs, flyScanRetry, flySignedCompact, flySkinToneLabelKey, flyStandaloneAuthGuard, flyStandaloneAuthInterceptor, flyToDateOnly, flyToPage, flyUnwrap, flyUnwrapCurrencies, flyUnwrapCurrency, flyUnwrapLenient, flyUnwrapObjectiveLookup, hasAnyRoleIn, healNativeFederationCacheOnce, initialExpanded, isAccentColor, isChunkLoadError, isFlyAuthStorePopulated, isNativeFederationCacheError, isRtlLocale, isRtlLocaleEntry, isValidCron, isValidSingleField, loadRemoteStyles, magicBarOwnerKey, magicBarSearchText, matchFlyRoutePattern, nextEnabledIndex, nextModuleIndex, nextSegmentIndex, nextSort, normalizeFlyTheme, normalizeRoles, novaPriorityToneVar, novaStatusToneVar, overlayStack, canGoNext as pagerCanGoNext, canGoPrev as pagerCanGoPrev, clampPage as pagerClampPage, parseCron, parseStepUpChallenge, parseTags, prefetchRemoteStyles, presenceColorFor, printConsoleSecurityWarning, provideFlyChunkReloadRecovery, provideFlyEmojiPack, provideFlyOfflineAuth, provideFlyStandaloneAuth, reloadOnceForChunkError, requestAppLaunch, resolveActiveModule, resolveActiveSection, resolveActiveTab, resolveCellValue, resolveStateIcon, resolveStateMessageKey, restoreFocus, sameTags, sectionHintKey, sectionLayout, sliderTrackGradient, sparklinePath, sparklinePoints, stepUpInterceptor, stepUpReturnKey, trimAgentPayload, trimAgentString, unloadRemoteStyles, utf8ByteLength, validateAgentPayload, warnIfEmbeddedSessionMissing };
+export { AGENT_DRAG_MIME, AGENT_PAYLOAD_VERSION, APP_LOOKUP, AUDIENCE_ERROR_CODES, AUDIENCE_LIMITS, AUDIENCE_PRESETS, AUDIENCE_TERM_KINDS, AgentActionBus, AgentActionUnsupportedDispatchError, AgentCommandRegistry, AgentDropRegistry, AgentFlightAnimator, AgentLookupRegistry, AgentPayloadOversizeError, AudienceBuilderComponent, AuthService, BilingualFieldComponent, CRON_MODES, CRON_WEEKDAYS, ContextMenuComponent, DEFAULT_AGENT_PAYLOAD_LIMITS, DEFAULT_FLY_THEME_MODE, DS_BASELINE_LOCALES, DashboardKpiComponent, DialogResult, ENTITY_LINK_LAUNCHER, EntityLookupComponent, FLYOS_LAUNCH_EVENT, FLYOS_LAUNCH_REQUEST_EVENT, FLYOS_REMOTE_ROUTE_EVENT, FLY_ACCENT_PROPERTY, FLY_ADMIN_ROLES, FLY_CHUNK_RELOAD_FLAG, FLY_COMPACT_THRESHOLD, FLY_COUNTRIES, FLY_CURRENCIES_BRIEF_ENDPOINT, FLY_CURRENCY_DEFAULT_ENDPOINT, FLY_EMOJI_BY_ID, FLY_EMOJI_CATEGORIES, FLY_EMOJI_CATEGORY_BY_ID, FLY_EMOJI_DEFAULT_CATEGORIES, FLY_EMOJI_PACK, FLY_EMOJI_PACK_MISSING_MESSAGE, FLY_EMOJI_PREVIEW_COUNT, FLY_EMPTY_VALUE, FLY_LOCALE_CATALOG, FLY_MAGIC_BAR_EVENT, FLY_MAGIC_BAR_ICONS, FLY_MAGIC_BAR_STORE_KEY, FLY_NF_CACHE_HEAL_FLAG, FLY_RELOAD_DEBOUNCE_MS, FLY_RELOAD_REARM_MS, FLY_REMOTE_BASE_PATH, FLY_REMOTE_CONTEXT_EVENT, FLY_REMOTE_CONTEXT_STORE_KEY, FLY_REMOTE_OUTLET_DEPTH, FLY_REMOTE_ROUTES, FLY_SCAN_PENDING_DEFAULT_DELAY_MS, FLY_SCAN_PENDING_MAX_RETRIES, FLY_SCAN_PENDING_STATUS, FLY_SEARCH_DEBOUNCE_MS, FLY_SKIN_TONES, FLY_STANDALONE_AUTH_CONFIG, FLY_STRATEGY_OBJECTIVES_LOOKUP_ENDPOINT, FLY_THEME_MODE_IDS, FLY_VIEWPORT_IS_MOBILE, FLY_WINDOW_BREADCRUMBS_EVENT, FLY_WINDOW_BREADCRUMBS_STORE_KEY, FLY_WINDOW_HELP_HINT_EVENT, FLY_WINDOW_PAGE_TITLE_EVENT, FlyAchievementProgressComponent, FlyActionMenuComponent, FlyActionStackComponent, FlyAgentDraggableDirective, FlyAnimatedEmojiComponent, FlyAppHomeComponent, FlyAppTopbarComponent, FlyAppUnavailableComponent, FlyAuthLiveRefresh, FlyBadgeWallComponent, FlyBlockUiComponent, FlyBreadcrumbComponent, FlyButtonComponent, FlyBytesPipe, FlyCaptchaComponent, FlyCardActionsComponent, FlyCardBodyComponent, FlyCardComponent, FlyCardFooterComponent, FlyCardGridComponent, FlyCardMediaComponent, FlyCardMetaComponent, FlyCardStatusComponent, FlyCardTitleComponent, FlyCellDirective, FlyCheckboxComponent, FlyChipComponent, FlyChunkReloadErrorHandler, FlyClickOutsideDirective, FlyCollapsibleComponent, FlyCommentThreadComponent, FlyCompactNumberPipe, FlyConfirmDialogComponent, FlyControlDirective, FlyCronBuilderComponent, FlyCurrencyCatalogService, FlyCurrencySelectorComponent, FlyDataTableComponent, FlyDatePipe, FlyDateTimePipe, FlyDebouncer, FlyDecimalNumberPipe, FlyDeepLinkPrefetchService, FlyDetailCardComponent, FlyDetailShellComponent, FlyDrawerComponent, FlyDurationPipe, FlyDynamicFormComponent, FlyEmojiPickerComponent, FlyFieldComponent, FlyFileDownloadService, FlyFileUploadComponent, FlyFilterPanelComponent, FlyFormBannerComponent, FlyFormFooterComponent, FlyFormGridComponent, FlyFormSectionComponent, FlyFullNumberPipe, FlyGanttComponent, FlyHubClient, FlyIconButtonComponent, FlyIfAdminDirective, FlyIfRoleDirective, FlyImageUploadComponent, FlyLeaderboardComponent, FlyLifecyclePipelineComponent, FlyMagicActionsComponent, FlyMetaListComponent, FlyModalComponent, FlyModerationQueueComponent, FlyModuleIconDirective, FlyMoneyPipe, FlyOverviewKpiRowComponent, FlyOverviewRowsComponent, FlyOverviewSectionComponent, FlyOverviewSurfaceComponent, FlyPagerComponent, FlyPaginationComponent, FlyPeoplePickerComponent, FlyPointsTierComponent, FlyProgressComponent, FlyRelativeTimePipe, FlyRemoteContextService, FlyRemoteRouter, FlyRemoteRouterOutletComponent, FlySearchInputComponent, FlySectionHeaderComponent, FlySecureSrcDirective, FlySegmentedComponent, FlySelectComponent, FlySkeletonComponent, FlySliderComponent, FlySparklineComponent, FlySpinnerComponent, FlyStandaloneAuthCallbackComponent, FlyStandaloneAuthService, FlyStandaloneMagicActionsComponent, FlyStateMessageComponent, FlyStrategySelectorComponent, FlyDynamicFormComponent as FlySurveyFormComponent, FlyTabComponent, FlyTabsComponent, FlyTagsInputComponent, FlyThemeService, FlyTimePipe, FlyToastService, FlyToggleComponent, FlyTooltipDirective, FlyTreeNavComponent, FlyTypeaheadComponent, FlyUserDirectoryService, FlyWindowHelpService, FlyWindowTitleService, FlyosPendingLaunchesGlobalKey, FlyosShellHandlesLaunchRequestsGlobalKey, FlyosShellOwnsHistoryGlobalKey, GANTT_DEPENDENCY_TYPES, GANTT_ROW_TINT_ALPHA, GANTT_ZOOMS, I18nService, LAUNCH_CONTEXT, MAGIC_BAR_SEARCH_WIDTH_DEFAULT, MAGIC_BAR_SEARCH_WIDTH_MAX, MAGIC_BAR_SEARCH_WIDTH_MIN, MagicBarRegistry, MessageBoxButtons, MessageBoxComponent, MessageBoxIcon, MessageBoxService, MockAuthService, NOVA_PRIORITY_TONE, NOVA_STATUS_TONE, NOVA_TONE_FALLBACK, OverlayStack, PRESENCE_COLORS, PageHeaderComponent, RTL_LOCALE_SET, SHARE_ORG_CHART_SYSTEM_KEY_APPS, SHARE_ORG_CHART_SYSTEM_KEY_DEFAULT, SHARE_PANEL_DEFAULT_FILE_LEVELS, STATE_DEFAULT_ICONS, STATE_DEFAULT_MESSAGE_KEYS, STEP_UP_CODE, STEP_UP_REAUTH_HANDLER, STEP_UP_RETURN_KEY, SUPPORTED_AGENT_PAYLOAD_VERSIONS, SharePanelComponent, SourceAppResolver, StandaloneWindowManagerService, StatusBadgeComponent, StepUpService, ToastHostComponent, TranslatePipe, WINDOW_DATA, WINDOW_HELP_HINT, WindowBreadcrumbsRegistry, WindowManagerService, applySkinTone, applySuggestion, ariaSort, buildCron, canConfirm, canGoNext$1 as canGoNext, canGoPrev$1 as canGoPrev, captureFocus, clampMagicBarSearchWidth, clampPage$1 as clampPage, clampSliderValue, connectRemoteLaunch, deepestFlyMatch, enterActivatesNatively, filterGroup, filterSuggestions, findLocaleByDialect, findLocaleByPrefix, firstEnabledIndex, firstModuleIndex, flattenModules, flyAdminGuard, flyApiErrorMessage, flyCaptchaBase64Utf8, flyCaptchaBuildToken, flyCaptchaSha256Hex, flyCompactNumber, flyDebounced, flyDecimalNumber, flyDownloadBlob, flyDuration, flyEmojiFor, flyEmojiIsTonable, flyEmojiPackUrl, flyExportFileName, flyFirstEnabledIndex, flyFormatBytes, flyFormatDate, flyFormatDateTime, flyFormatMoney, flyFormatTime, flyFullNumber, flyNextEnabledIndex, flyNextSegmentIndex, flyRelativeTime, flyResolveActiveTab, flyRoleGuard, flyScanPendingDelayMs, flyScanRetry, flySignedCompact, flySkinToneLabelKey, flyStandaloneAuthGuard, flyStandaloneAuthInterceptor, flyToDateOnly, flyToPage, flyUnwrap, flyUnwrapCurrencies, flyUnwrapCurrency, flyUnwrapLenient, flyUnwrapObjectiveLookup, hasAnyRoleIn, healNativeFederationCacheOnce, initialExpanded, isAccentColor, isChunkLoadError, isFlyAuthStorePopulated, isNativeFederationCacheError, isRtlLocale, isRtlLocaleEntry, isValidCron, isValidSingleField, loadRemoteStyles, magicBarOwnerKey, magicBarSearchText, matchFlyRoutePattern, matchFlyRoutePrefix, matchFlyRouteTable, nextEnabledIndex, nextModuleIndex, nextSegmentIndex, nextSort, normalizeFlyTheme, normalizeRoles, novaPriorityToneVar, novaStatusToneVar, overlayStack, canGoNext as pagerCanGoNext, canGoPrev as pagerCanGoPrev, clampPage as pagerClampPage, parseCron, parseStepUpChallenge, parseTags, prefetchRemoteStyles, presenceColorFor, printConsoleSecurityWarning, provideFlyChunkReloadRecovery, provideFlyEmojiPack, provideFlyOfflineAuth, provideFlyStandaloneAuth, reloadOnceForChunkError, requestAppLaunch, resolveActiveModule, resolveActiveSection, resolveActiveTab, resolveCellValue, resolveStateIcon, resolveStateMessageKey, restoreFocus, sameTags, sectionHintKey, sectionLayout, sliderTrackGradient, sparklinePath, sparklinePoints, stepUpInterceptor, stepUpReturnKey, trimAgentPayload, trimAgentString, unloadRemoteStyles, utf8ByteLength, validateAgentPayload, warnIfEmbeddedSessionMissing };
 //# sourceMappingURL=flyos-design-system.mjs.map