@magmonium/one 0.4.42 → 0.4.44

package/fesm2022/magmonium-one.mjs

@@ -1,30 +1,30 @@
 import { t as __exportAll } from "./magmonium-one-rolldown-runtime-DpJrqANO.mjs";
-import { $ as WC_BUNDLE, A as isUrlLocalhost, B as IS_DESIGN_MODE, C as setWcLocalPort, D as getTierFromPreviewPath, E as wcTierOf, F as AppAvailability, G as MODAL_STORE_REF, H as LOADING_ACTIONS_REF, I as AppRelationType, J as OPTIONS_SOURCE, K as NAV_STORE_REF, L as COMPONENT_INPUT_REGISTRY, M as APP_CONTEXT_REF, N as APP_LINK, O as isLocalhost, P as ASSET_BASE_URL, Q as USER_STORE_REF, R as FOLDER_PICK_LISTENER, S as recordDefinedWcTier, T as wcLocalBaseOf, U as LOGIN_COMPONENT, V as IS_SIDE_PANEL, W as LOGIN_STORE, X as SEARCH_RESULTS_EVENT, Y as SEARCH_QUERY, Z as TRANSLATION_SOURCE, _ as ACCESS_DOMAINS, a as resolveSpacing, at as Size, b as definedWcBundleOf, c as TranslatePipe, d as browserLocale, et as WC_SEARCH_GROUPS, f as miniMarkToHtml, g as isJson, h as StorageService, i as resolveSize, it as DEFAULT_SIZE, j as isWebComponent, k as isTierPreview, l as TranslateService, m as SharedStoreRegistry, n as isSize, nt as LAYOUT_ASSET_FOLDER, o as toCssLength, p as AssetStore, q as ONE_ASSET_BASE_URL, r as resolveIconSize, rt as Assets, s as toLength, t as coerceSize, tt as FORM_ASSET_FOLDER, u as BrowserLocaleService, v as HttpService, w as setWcTier, x as definedWcTierOf, y as buildWcBaseUrl, z as ICON_SOURCE } from "./magmonium-one-size-converter-C5fG_dgw.mjs";
-import { a as OverlayService, c as DeviceService, i as OverlayRef, n as Direction, o as ScrollService, r as ThemeService, s as DomService, t as SelectorDirective } from "./magmonium-one-selector-DeRIUUBA.mjs";
+import { $ as WC_BUNDLE, A as isUrlLocalhost, B as IS_DESIGN_MODE, C as setWcLocalPort, D as getTierFromPreviewPath, E as wcTierOf, F as AppAvailability, G as MODAL_STORE_REF, H as LOADING_ACTIONS_REF, I as AppRelationType, J as OPTIONS_SOURCE, K as NAV_STORE_REF, L as COMPONENT_INPUT_REGISTRY, M as APP_CONTEXT_REF, N as APP_LINK, O as isLocalhost, P as ASSET_BASE_URL, Q as USER_STORE_REF, R as FOLDER_PICK_LISTENER, S as recordDefinedWcTier, T as wcLocalBaseOf, U as LOGIN_COMPONENT, V as IS_SIDE_PANEL, W as LOGIN_STORE, X as SEARCH_RESULTS_EVENT, Y as SEARCH_QUERY, Z as TRANSLATION_SOURCE, _ as ACCESS_DOMAINS, a as resolveSpacing, at as Size, b as definedWcBundleOf, c as TranslatePipe, d as browserLocale, et as WC_SEARCH_GROUPS, f as miniMarkToHtml, g as isJson, h as StorageService, i as resolveSize, it as DEFAULT_SIZE, j as isWebComponent, k as isTierPreview, l as TranslateService, m as SharedStoreRegistry, n as isSize, nt as LAYOUT_ASSET_FOLDER, o as toCssLength, p as AssetStore, q as ONE_ASSET_BASE_URL, r as resolveIconSize, rt as Assets, s as toLength, t as coerceSize, tt as FORM_ASSET_FOLDER, u as BrowserLocaleService, v as HttpService, w as setWcTier, x as definedWcTierOf, y as buildWcBaseUrl, z as ICON_SOURCE } from "./magmonium-one-size-converter-BOBD8nHy.mjs";
+import { a as OverlayService, c as DeviceService, i as OverlayRef, n as Direction, o as ScrollService, r as ThemeService, s as DomService, t as SelectorDirective } from "./magmonium-one-selector-DAEI_0JX.mjs";
 import { t as FileService } from "./magmonium-one-file.service-Bo06pU3_.mjs";
-import { a as calculateLuminance, c as hexToRgb, d as derivePropertyName, f as getProperty, h as ThemeDataService, i as deriveOppositeColor, l as hslToRgb, m as ThemeStore, n as resolvePallet, o as rgbToHex, p as setProperty, r as deriveContrastColor, s as rgbToHsl, t as applyColorsToElement, u as parseColor } from "./magmonium-one-color-utl-D86GGpz5.mjs";
-import "./magmonium-one-theme-CT4cWpe7.mjs";
-import { a as sectionTableColumnWidths, c as AssetUrlPipe, d as MoneyPipe, f as TimeAgoPipe, i as sectionTableColumnId, l as CompactNumberPipe, n as SectionTableSortPipe, o as sectionTableFrozenCount, r as nextSectionTableSort, s as sortSectionTableRows, t as LabelComponent, u as PercentagePipe } from "./magmonium-one-label-DjvJthAB.mjs";
-import { i as getScrollParent, n as activeElementWithin, r as classListSignal, t as BaseTextInputComponent } from "./magmonium-one-base-text-BCSqKmVs.mjs";
-import { a as appLogoShadowColor, c as normalizeAppColor, d as SIZE_CONTEXT, f as injectParentSize, g as AppLogoState, h as APP_LOGO_SOURCE, i as LOGO_GLYPH_MAX_BYTES, l as rebuildLogoGlyph, m as SHARED_ICONS, n as CustomIconClass, o as isLightAppColor, p as provideSizeContext, r as IconComponent, s as logoGlyphMaskUrl, t as CustomIconEditComponent, u as APP_LOGO_ICON } from "./magmonium-one-icon-BgbtOdMv.mjs";
-import { i as resolveConfigAsset, n as toAttrNumber, r as ConfigComponent, t as toAttrBool } from "./magmonium-one-attribute-value-DCTXt4Sr.mjs";
-import { a as isButtonName, c as formatBadgeCount, l as shouldShowBadge, n as SECTION_FORM_CONTEXT, o as ReactiveElementComponent, r as ImgComponent, s as BadgeComponent, t as ButtonComponent } from "./magmonium-one-button-BZQOf-Pm.mjs";
-import { t as MRefDirective } from "./magmonium-one-m-ref-C8c4Vf1G.mjs";
-import { t as HeaderComponent } from "./magmonium-one-header-DhK9NuZW.mjs";
-import { t as TextOutputComponent } from "./magmonium-one-text-output-Ci93Hi9Y.mjs";
-import { t as BaseInputComponent } from "./magmonium-one-base-input-BTxhUtYO.mjs";
-import { a as stringToColor, c as ToolTipDirective, d as DragListItemDirective, f as DragListDirective, i as MHeroColorDirective, l as FileUploadDirective, n as PaddingDirective, o as HighlightDirective, p as DraggableDirective, r as SPACING_INWARD, s as PositionDirective, t as MarginDirective, u as AutosizeDirective } from "./magmonium-one-directives-DePukAj8.mjs";
-import { n as DROPDOWN_IMPORTS, r as DROPDOWN_TEMPLATE, t as BaseDropdownComponent } from "./magmonium-one-base-dropdown-CcZ0lBQv.mjs";
+import { C as isLightAppColor, D as ThemeDataService, E as rebuildLogoGlyph, S as appLogoShadowColor, T as normalizeAppColor, _ as AppLogoState, a as calculateLuminance, b as LOGO_GLYPH_MAX_BYTES, c as hexToRgb, d as derivePropertyName, f as getProperty, g as APP_THEME_COLOR, h as APP_LOGO_SOURCE, i as deriveOppositeColor, l as hslToRgb, m as ThemeStore, n as resolvePallet, o as rgbToHex, p as setProperty, r as deriveContrastColor, s as rgbToHsl, t as applyColorsToElement, u as parseColor, v as appThemeColorFactory, w as logoGlyphMaskUrl, x as appColorBrand, y as paintAppColor } from "./magmonium-one-color-utl-DI5p24iQ.mjs";
+import "./magmonium-one-theme-DYvNIWmo.mjs";
+import { a as sectionTableColumnWidths, c as AssetUrlPipe, d as MoneyPipe, f as TimeAgoPipe, i as sectionTableColumnId, l as CompactNumberPipe, n as SectionTableSortPipe, o as sectionTableFrozenCount, r as nextSectionTableSort, s as sortSectionTableRows, t as LabelComponent, u as PercentagePipe } from "./magmonium-one-label-D_rU82nD.mjs";
+import { i as getScrollParent, n as activeElementWithin, r as classListSignal, t as BaseTextInputComponent } from "./magmonium-one-base-text-Di2V2ojp.mjs";
+import { a as SIZE_CONTEXT, c as SHARED_ICONS, i as APP_LOGO_ICON, n as CustomIconClass, o as injectParentSize, r as IconComponent, s as provideSizeContext, t as CustomIconEditComponent } from "./magmonium-one-icon-C3jwzbb2.mjs";
+import { i as resolveConfigAsset, n as toAttrNumber, r as ConfigComponent, t as toAttrBool } from "./magmonium-one-attribute-value-C1lqou2L.mjs";
+import { a as isButtonName, c as formatBadgeCount, l as shouldShowBadge, n as SECTION_FORM_CONTEXT, o as ReactiveElementComponent, r as ImgComponent, s as BadgeComponent, t as ButtonComponent } from "./magmonium-one-button-DZ4wCJgb.mjs";
+import { t as MRefDirective } from "./magmonium-one-m-ref-CEms7B6-.mjs";
+import { t as HeaderComponent } from "./magmonium-one-header-DUiBhPUP.mjs";
+import { t as TextOutputComponent } from "./magmonium-one-text-output-BZU61QIF.mjs";
+import { t as BaseInputComponent } from "./magmonium-one-base-input-C1Ek0Ezm.mjs";
+import { a as stringToColor, c as ToolTipDirective, d as DragListItemDirective, f as DragListDirective, i as MHeroColorDirective, l as FileUploadDirective, n as PaddingDirective, o as HighlightDirective, p as DraggableDirective, r as SPACING_INWARD, s as PositionDirective, t as MarginDirective, u as AutosizeDirective } from "./magmonium-one-directives-B93p5bAL.mjs";
+import { n as DROPDOWN_IMPORTS, r as DROPDOWN_TEMPLATE, t as BaseDropdownComponent } from "./magmonium-one-base-dropdown-XpTWe4Ii.mjs";
 import { t as InputType } from "./magmonium-one-input-DqHPorA1.mjs";
-import { t as TextInputComponent } from "./magmonium-one-text-BvXdAX0i.mjs";
-import { i as OptionsSourceDirective, n as normalizeAssetOptions, r as presetDefaultOption, t as assetOptions } from "./magmonium-one-options-asset-EVsv0DL7.mjs";
-import { r as PLACED_CHECKBOX, t as CheckboxInputComponent } from "./magmonium-one-checkbox-D5-5WhJ-.mjs";
-import { i as mergeUniqueWith, n as mergeUnique, r as mergeUniqueBy, t as ButtonGroupComponent } from "./magmonium-one-group-Dl2bp-y-.mjs";
-import { n as ContextMenuBoxComponent, r as MenuComponent, t as ContextMenuComponent } from "./magmonium-one-menu-bI7lVUYI.mjs";
-import { t as BaseCheckboxInputComponent } from "./magmonium-one-base-checkbox-BNQAkyYU.mjs";
-import { t as RadioInputComponent } from "./magmonium-one-radio-C2wOB_Nb.mjs";
-import { r as BaseArrayInputComponent, t as MultiRangeInputComponent } from "./magmonium-one-multi-range-o57TiVJU.mjs";
-import { t as RangeInputComponent } from "./magmonium-one-range-rgDe4O8u.mjs";
+import { t as TextInputComponent } from "./magmonium-one-text-BnTkYLJe.mjs";
+import { i as OptionsSourceDirective, n as normalizeAssetOptions, r as presetDefaultOption, t as assetOptions } from "./magmonium-one-options-asset-BMd7W0Mk.mjs";
+import { r as PLACED_CHECKBOX, t as CheckboxInputComponent } from "./magmonium-one-checkbox-R-hPZrCa.mjs";
+import { i as mergeUniqueWith, n as mergeUnique, r as mergeUniqueBy, t as ButtonGroupComponent } from "./magmonium-one-group-B7YeUd1u.mjs";
+import { n as ContextMenuBoxComponent, r as MenuComponent, t as ContextMenuComponent } from "./magmonium-one-menu-cO34OcJc.mjs";
+import { t as BaseCheckboxInputComponent } from "./magmonium-one-base-checkbox-CIxAiA4Q.mjs";
+import { t as RadioInputComponent } from "./magmonium-one-radio-BAL3-3j5.mjs";
+import { r as BaseArrayInputComponent, t as MultiRangeInputComponent } from "./magmonium-one-multi-range-Bq3_3NHg.mjs";
+import { t as RangeInputComponent } from "./magmonium-one-range-Cf7yUnhN.mjs";
 import { o as isEditableImage, s as outputSize } from "./magmonium-one-image-frame-BTSaUSAi.mjs";
 import * as i0 from "@angular/core";
 import { ApplicationRef, CUSTOM_ELEMENTS_SCHEMA, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChild, DOCUMENT, DestroyRef, Directive, ElementRef, EventEmitter, HostAttributeToken, HostBinding, HostListener, Injectable, InjectionToken, Injector, Input, Output, TemplateRef, ViewChild, ViewContainerRef, ViewEncapsulation, afterEveryRender, afterNextRender, afterRenderEffect, computed, contentChild, contentChildren, createComponent, effect, forwardRef, inject, input, inputBinding, linkedSignal, makeEnvironmentProviders, model, numberAttribute, output, outputBinding, provideAppInitializer, provideBrowserGlobalErrorListeners, provideZonelessChangeDetection, reflectComponentType, runInInjectionContext, signal, twoWayBinding, untracked, viewChild, viewChildren } from "@angular/core";
@@ -1274,6 +1274,7 @@ const NavStore = signalStore({ providedIn: "root" }, withState(initialState$3),
 		router
 	};
 }), withComputed((store) => {
+	const assetStore = inject(AssetStore);
 	const navWidgetMaps = inject(NAV_WIDGET_MAP, { optional: true });
 	const anchorRouteNavId = computed(() => visibleNavId(store.routeNavId() ?? "root"), ...ngDevMode ? [{ debugName: "anchorRouteNavId" }] : /* istanbul ignore next */ []);
 	const id = computed(() => store.menuNavId() ?? navIdFor(anchorRouteNavId(), store.murl()), ...ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []);
@@ -1544,21 +1545,46 @@ const NavStore = signalStore({ providedIn: "root" }, withState(initialState$3),
 		const appLink = store.appLink();
 		return appLink && !activeAppOpen() ? store.identityMap()[appLink] : void 0;
 	}, ...ngDevMode ? [{ debugName: "currentIdentity" }] : /* istanbul ignore next */ []);
+	const appLogoLink = computed(() => store.appLink() ?? assetStore.appLink(), ...ngDevMode ? [{ debugName: "appLogoLink" }] : /* istanbul ignore next */ []);
 	const appLogo = computed(() => {
-		const appLink = store.appLink();
-		if (appLink && !activeAppOpen()) {
-			const identity = store.identityMap()[appLink];
-			return {
-				glyph: identity?.logoGlyph ?? null,
-				name: identity?.name ?? appLink
-			};
-		}
+		const appLink = appLogoLink();
+		const identity = appLink ? store.identityMap()[appLink] : void 0;
+		if (identity?.logoGlyph) return {
+			glyph: identity.logoGlyph,
+			name: identity.name
+		};
+		if (appLink && !activeAppOpen()) return {
+			glyph: null,
+			name: identity?.name ?? appLink
+		};
 		const root = store.navMap()[ROOT_NAV];
-		return root ? {
+		if (root?.logo) return {
 			src: root.logo,
 			name: root.title
-		} : void 0;
+		};
+		return { name: identity?.name ?? appLink ?? root?.title };
 	}, ...ngDevMode ? [{ debugName: "appLogo" }] : /* istanbul ignore next */ []);
+	const appLogos = computed(() => {
+		const logos = {};
+		for (const [link, identity] of Object.entries(store.identityMap())) {
+			const color = identity.appColor;
+			if (identity.logoGlyph) logos[link] = {
+				glyph: identity.logoGlyph,
+				name: identity.name,
+				color
+			};
+			else if (!identity.open) logos[link] = {
+				glyph: null,
+				name: identity.name || link,
+				color
+			};
+			else if (color) logos[link] = {
+				name: identity.name || link,
+				color
+			};
+		}
+		return logos;
+	}, ...ngDevMode ? [{ debugName: "appLogos" }] : /* istanbul ignore next */ []);
 	const answeringNavId = (candidates, hit) => {
 		if (hit) return hit.navId;
 		const map = store.navMap();
@@ -1597,8 +1623,32 @@ const NavStore = signalStore({ providedIn: "root" }, withState(initialState$3),
 			hasOwnContent: !!widgetConfig || !!emittedMenu?.length
 		});
 	}, ...ngDevMode ? [{ debugName: "breadcrumbResult" }] : /* istanbul ignore next */ []);
-	const breadcrumb = computed(() => breadcrumbResult().breadcrumb, ...ngDevMode ? [{ debugName: "breadcrumb" }] : /* istanbul ignore next */ []);
-	const navMenus = computed(() => breadcrumbResult().navMenus, ...ngDevMode ? [{ debugName: "navMenus" }] : /* istanbul ignore next */ []);
+	const appLinkByNavId = computed(() => Object.fromEntries([...allMounts(), ...menuMounts()].flatMap(({ appNavId, link }) => link ? [[appNavId, link]] : [])), ...ngDevMode ? [{ debugName: "appLinkByNavId" }] : /* istanbul ignore next */ []);
+	const withAppLogo = computed(() => {
+		const links = appLinkByNavId();
+		const identities = store.identityMap();
+		return (entry) => {
+			const link = links[entry.nav ?? entry.id];
+			const identity = link ? identities[link] : void 0;
+			if (!link || !identity || identity.open && !identity.logoGlyph) return entry;
+			return {
+				...entry,
+				appLogo: {
+					glyph: identity.logoGlyph,
+					color: identity.appColor,
+					name: identity.name || link
+				}
+			};
+		};
+	}, ...ngDevMode ? [{ debugName: "withAppLogo" }] : /* istanbul ignore next */ []);
+	const breadcrumb = computed(() => {
+		const crumb = breadcrumbResult().breadcrumb;
+		return {
+			...crumb,
+			header: withAppLogo()(crumb.header)
+		};
+	}, ...ngDevMode ? [{ debugName: "breadcrumb" }] : /* istanbul ignore next */ []);
+	const navMenus = computed(() => breadcrumbResult().navMenus.map(withAppLogo()), ...ngDevMode ? [{ debugName: "navMenus" }] : /* istanbul ignore next */ []);
 	return {
 		id,
 		allMounts,
@@ -1624,7 +1674,9 @@ const NavStore = signalStore({ providedIn: "root" }, withState(initialState$3),
 		}, ...ngDevMode ? [{ debugName: "navHasContent" }] : /* istanbul ignore next */ []),
 		currentWcConfig,
 		currentIdentity,
+		appLogoLink,
 		appLogo,
+		appLogos,
 		activeAppOpen,
 		transparentNavIds,
 		resolvedNavMenuConfig,
@@ -1971,7 +2023,9 @@ const NavStore = signalStore({ providedIn: "root" }, withState(initialState$3),
 	const appLogoState = inject(AppLogoState);
 	return { onInit() {
 		store.syncFromRouter(store.navigationEnd);
+		store.loadIdentity(store.appLogoLink);
 		effect(() => appLogoState.set(store.appLogo()));
+		effect(() => appLogoState.setLogos(store.appLogos()));
 		const loadedFor = /* @__PURE__ */ new Set();
 		effect(() => {
 			const loaders = store.visibilityLoaders();
@@ -3420,6 +3474,7 @@ function initMagmoniumApp({ backend, authUrl, socketUrl }) {
 		SharedStoreRegistry.setTranslateService(translateService);
 		SharedStoreRegistry.setLoadingActions(loadingActions);
 		SharedStoreRegistry.setNotificationStore(inject(NotificationStore));
+		SharedStoreRegistry.setAppLogoState(inject(AppLogoState));
 		if (navStore) SharedStoreRegistry.setNavStore(navStore);
 		if (loginStore) SharedStoreRegistry.setLoginStore(loginStore);
 		const effectiveBackend = backend || "http://localhost:8000";
@@ -4156,12 +4211,12 @@ var SectionFormItemComponent = class SectionFormItemComponent extends ConfigComp
 		try {
 			switch (type) {
 				case InputType.RADIO: {
-					const { RadioInputComponent } = await import("./magmonium-one-radio-C2wOB_Nb.mjs").then((n) => n.n);
+					const { RadioInputComponent } = await import("./magmonium-one-radio-BAL3-3j5.mjs").then((n) => n.n);
 					this.createDynamicComponent(seq, RadioInputComponent);
 					break;
 				}
 				case InputType.TOGGLE: {
-					const { ToggleInputComponent } = await import("./magmonium-one-toggle-BTK2lzqA.mjs");
+					const { ToggleInputComponent } = await import("./magmonium-one-toggle-V_YnZXx5.mjs");
 					this.createDynamicComponent(seq, ToggleInputComponent, [], true);
 					break;
 				}
@@ -4171,12 +4226,12 @@ var SectionFormItemComponent = class SectionFormItemComponent extends ConfigComp
 					break;
 				}
 				case InputType.PASSWORD: {
-					const { PasswordInputComponent } = await import("./magmonium-one-password-BIs_YxJ5.mjs");
+					const { PasswordInputComponent } = await import("./magmonium-one-password-IdllPMUw.mjs");
 					this.createDynamicComponent(seq, PasswordInputComponent);
 					break;
 				}
 				case InputType.OTP: {
-					const { OtpInputComponent } = await import("./magmonium-one-otp-CE4L1RcG.mjs");
+					const { OtpInputComponent } = await import("./magmonium-one-otp-V2tFztLx.mjs");
 					this.createDynamicComponent(seq, OtpInputComponent);
 					break;
 				}
@@ -4186,7 +4241,7 @@ var SectionFormItemComponent = class SectionFormItemComponent extends ConfigComp
 					break;
 				}
 				case InputType.CHECKBOX: {
-					const { CheckboxInputComponent } = await import("./magmonium-one-checkbox-D5-5WhJ-.mjs").then((n) => n.n);
+					const { CheckboxInputComponent } = await import("./magmonium-one-checkbox-R-hPZrCa.mjs").then((n) => n.n);
 					this.createDynamicComponent(seq, CheckboxInputComponent, [], true);
 					break;
 				}
@@ -4201,12 +4256,12 @@ var SectionFormItemComponent = class SectionFormItemComponent extends ConfigComp
 					break;
 				}
 				case InputType.RANGE: {
-					const { RangeInputComponent } = await import("./magmonium-one-range-rgDe4O8u.mjs").then((n) => n.n);
+					const { RangeInputComponent } = await import("./magmonium-one-range-Cf7yUnhN.mjs").then((n) => n.n);
 					this.createDynamicComponent(seq, RangeInputComponent);
 					break;
 				}
 				case InputType.MULTI_RANGE: {
-					const { MultiRangeInputComponent } = await import("./magmonium-one-multi-range-o57TiVJU.mjs").then((n) => n.n);
+					const { MultiRangeInputComponent } = await import("./magmonium-one-multi-range-Bq3_3NHg.mjs").then((n) => n.n);
 					this.createDynamicComponent(seq, MultiRangeInputComponent);
 					break;
 				}
@@ -4257,7 +4312,7 @@ var SectionFormItemComponent = class SectionFormItemComponent extends ConfigComp
 					break;
 				}
 				default: {
-					const { TextInputComponent } = await import("./magmonium-one-text-BvXdAX0i.mjs").then((n) => n.n);
+					const { TextInputComponent } = await import("./magmonium-one-text-BnTkYLJe.mjs").then((n) => n.n);
 					this.createDynamicComponent(seq, TextInputComponent);
 					break;
 				}
@@ -16808,8 +16863,8 @@ var SectionHeaderComponent = class SectionHeaderComponent {
 			classAttribute: "m-section-header"
 		},
 		ngImport: i0,
-		template: "<!-- One declaration of the row, rendered by whichever branch `spacing` picks.\n     Hoisted into a template rather than written twice: an `<ng-content>` may\n     appear once per selector in a component, so the duplicated copy caught\n     nothing and a header projecting a title rendered it in the `spacing`\n     branch alone. -->\n<ng-template #body>\n  @if (accordion(); as accordionRef) {\n    <div\n      class=\"section-header__toggle\"\n      [class.section-header__toggle--rotate]=\"toggleRotates()\"\n      [class.section-header__toggle--open]=\"accordionRef.isOpen()\"\n      [id]=\"accordionRef.headerId\"\n      [attr.aria-expanded]=\"accordionRef.isOpen()\"\n      [attr.aria-controls]=\"accordionRef.bodyId\"\n    >\n      <m-button\n        [config]=\"{ icon: toggleIconName(), iconOnly: true, variant: 'ghost' }\"\n        (clicked)=\"onToggleClick()\" />\n    </div>\n  }\n  @if (showBack()) {\n    <div class=\"section-header__back\">\n      <m-button\n        [config]=\"{ icon: 'chevron-left', iconOnly: true }\"\n        (clicked)=\"back.emit()\" />\n    </div>\n  } @else if (!label() && icon(); as iconName) {\n    <!-- Only where no label is written. A header with one hands the icon to\n         `m-header`, which draws it inside the heading's line box and so on the\n         heading's own centre line. Beside a projected title there is no such\n         box to borrow, so the glyph is boxed to the level's line box here and\n         centred in it — otherwise it centres against the whole title column,\n         which on the Canvas is the label slot's drop rect stacked above the\n         heading. -->\n    <div class=\"section-header__icon\">\n      <m-icon [name]=\"iconName\" />\n    </div>\n  }\n  <div\n    class=\"section-header__title\"\n    [class.section-header__title--reverse]=\"reverse()\"\n  >\n    <!-- The title slot is the catch-all rather than a `[label]` one: every\n         header already projecting a heading writes it unselected, and a\n         selector here would drop that content on the floor. What the design\n         page emits — `<span label>` — is caught by it too, nothing else\n         claiming the node. -->\n    <ng-content />\n    <!-- The written label, drawn beside the slot rather than as its\n         `ng-content` fallback. A fallback renders only while *nothing* is\n         projected, and the design Canvas always projects the slot span —\n         empty until a Control is dropped in it — so a fallback there would\n         blank the label a header is still configured with. `label` answers\n         instead, which no header projecting a title sets. -->\n    @if (label()) {\n      <m-header\n        [level]=\"level()\"\n        [label]=\"label()\"\n        [icon]=\"icon()\"\n        [params]=\"params()\"\n        [noTranslate]=\"noTranslate()\" />\n    }\n    @if (subText(); as sub) {\n      <span class=\"section-header__sub\">{{ sub }}</span>\n    }\n  </div>\n  <!-- A FilterGroup projected into the header row, selected by tag rather than\n       by an attribute — the same shape a Section catches its `m-action` with.\n       A header has room for one icon and not for a row, so a group landing\n       here is squeezed by placement (ADR 0025); nothing here enforces that,\n       the caller binding `[squeeze]` on the tag it projects. -->\n  <div class=\"section-header__filters\">\n    <ng-content select=\"m-section-filter-group\" />\n  </div>\n  @if (actionConfig(); as action) {\n    <div class=\"section-header__action\">\n      <m-button [config]=\"action\" (clicked)=\"actionClick.emit()\" />\n    </div>\n  }\n  @if (hasMenu()) {\n    <div class=\"section-header__menu\">\n      <m-context-menu\n        [config]=\"menu()\"\n        [name]=\"menuName()\"\n        [visibilityRule]=\"visibilityRule()\"\n        [disableRule]=\"disableRule()\"\n        [extraData]=\"extraData()\"\n        (action)=\"action.emit($event)\"\n      />\n    </div>\n  }\n</ng-template>\n\n<!-- Always the same two boxes, whether or not a `maxWidth` is in force. The\n     border and the sticky backdrop live on the host and keep spanning the\n     Section's full width; only this container narrows and is placed by the\n     Section's `align`, so the heading lines up with the body under it. -->\n<div class=\"section-header__container\">\n  <div class=\"section-header__inner\">\n    <ng-container [ngTemplateOutlet]=\"body\" />\n  </div>\n</div>\n",
-		styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:flex;align-items:center;gap:.5rem;min-height:var(--section-header-min-height, calc(var(--section-header-py, .5rem) * 2 + 1.25rem));border-bottom:1px solid var(--m-backdrop-border);padding:var(--section-header-py, .85rem) var(--section-px, 1rem);width:100%;grid-column:1/-1}:host(.no-border){border-bottom:none}:host(.spacing){padding:0;width:100%}.section-header__container{width:100%;min-width:0;max-width:var(--m-section-header-max-width, none);margin-inline:0 auto}:host(.box-center) .section-header__container{margin-inline:auto}:host(.box-right) .section-header__container{margin-inline:auto 0}.section-header__inner{display:flex;align-items:center;gap:.5rem;width:100%;min-width:0}.section-header__inner .section-header__title{flex:1;min-width:0;gap:.5rem}:host(.spacing) .section-header__inner{padding:1rem 1.5rem}:host(.has-sidepanel){padding-right:50px}:host(.has-sidepanel.has-menu){padding-right:50px}:host(.spacing.has-sidepanel) .section-header__inner{padding-right:calc(1.5rem + 50px)}:host(.is-sticky-enabled){position:sticky;top:var(--m-section-header-sticky-top, 0);z-index:var(--m-section-header-sticky-z, 10)}:host(.is-sticky){background:color-mix(in srgb,var(--m-background) 80%,transparent);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%)}:host(.is-accordion){cursor:pointer}.section-header__toggle{display:flex;flex-shrink:0}.section-header__toggle.section-header__toggle--rotate m-button{display:flex;transition:transform .3s cubic-bezier(.4,0,.2,1)}.section-header__toggle.section-header__toggle--rotate.section-header__toggle--open m-button{transform:rotate(180deg)}.section-header__title{flex:1;min-width:0;display:flex;flex-direction:column;gap:.1rem}m-header{min-width:0}.section-header__title--reverse{flex-direction:column-reverse}.section-header__sub{font-size:.8rem;color:var(--m-text-secondary);line-height:1.2}:host(.align-center){--m-header-justify: center}:host(.align-right){--m-header-justify: flex-end}:host(.has-menu){padding-right:0}:host(.spacing.has-menu) .section-header__inner{padding-right:0}.section-header__filters{display:contents}.section-header__filters m-section-filter-group{width:auto;flex-shrink:0;border-bottom:none}.section-header__back{display:flex;align-items:center;flex-shrink:0}.section-header__icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;align-self:flex-start;height:var(--m-section-header-icon-box, 1.5125rem)}.section-header__menu,.section-header__action{margin-left:auto;flex-shrink:0;display:flex;align-items:center}.section-header__action+.section-header__menu{margin-left:0}\n"],
+		template: "<!-- One declaration of the row, rendered by whichever branch `spacing` picks.\n     Hoisted into a template rather than written twice: an `<ng-content>` may\n     appear once per selector in a component, so the duplicated copy caught\n     nothing and a header projecting a title rendered it in the `spacing`\n     branch alone. -->\n<ng-template #body>\n  @if (accordion(); as accordionRef) {\n    <div\n      class=\"section-header__toggle\"\n      [class.section-header__toggle--rotate]=\"toggleRotates()\"\n      [class.section-header__toggle--open]=\"accordionRef.isOpen()\"\n      [id]=\"accordionRef.headerId\"\n      [attr.aria-expanded]=\"accordionRef.isOpen()\"\n      [attr.aria-controls]=\"accordionRef.bodyId\"\n    >\n      <m-button\n        [config]=\"{ icon: toggleIconName(), iconOnly: true, variant: 'ghost' }\"\n        (clicked)=\"onToggleClick()\" />\n    </div>\n  }\n  @if (showBack()) {\n    <div class=\"section-header__back\">\n      <m-button\n        [config]=\"{ icon: 'chevron-left', iconOnly: true }\"\n        (clicked)=\"back.emit()\" />\n    </div>\n  } @else if (!label() && icon(); as iconName) {\n    <!-- Only where no label is written. A header with one hands the icon to\n         `m-header`, which draws it inside the heading's line box and so on the\n         heading's own centre line. Beside a projected title there is no such\n         box to borrow, so the glyph is boxed to the level's line box here and\n         centred in it — otherwise it centres against the whole title column,\n         which on the Canvas is the label slot's drop rect stacked above the\n         heading. -->\n    <div class=\"section-header__icon\">\n      <m-icon [name]=\"iconName\" />\n    </div>\n  }\n  <!-- An AppLogo projected in the icon's place, selected by tag like the\n       FilterGroup below — boxed to the heading's line box the same way. -->\n  <div class=\"section-header__logo\">\n    <ng-content select=\"m-app-logo\" />\n  </div>\n  <div\n    class=\"section-header__title\"\n    [class.section-header__title--reverse]=\"reverse()\"\n  >\n    <!-- The title slot is the catch-all rather than a `[label]` one: every\n         header already projecting a heading writes it unselected, and a\n         selector here would drop that content on the floor. What the design\n         page emits — `<span label>` — is caught by it too, nothing else\n         claiming the node. -->\n    <ng-content />\n    <!-- The written label, drawn beside the slot rather than as its\n         `ng-content` fallback. A fallback renders only while *nothing* is\n         projected, and the design Canvas always projects the slot span —\n         empty until a Control is dropped in it — so a fallback there would\n         blank the label a header is still configured with. `label` answers\n         instead, which no header projecting a title sets. -->\n    @if (label()) {\n      <m-header\n        [level]=\"level()\"\n        [label]=\"label()\"\n        [icon]=\"icon()\"\n        [params]=\"params()\"\n        [noTranslate]=\"noTranslate()\" />\n    }\n    @if (subText(); as sub) {\n      <span class=\"section-header__sub\">{{ sub }}</span>\n    }\n  </div>\n  <!-- A FilterGroup projected into the header row, selected by tag rather than\n       by an attribute — the same shape a Section catches its `m-action` with.\n       A header has room for one icon and not for a row, so a group landing\n       here is squeezed by placement (ADR 0025); nothing here enforces that,\n       the caller binding `[squeeze]` on the tag it projects. -->\n  <div class=\"section-header__filters\">\n    <ng-content select=\"m-section-filter-group\" />\n  </div>\n  @if (actionConfig(); as action) {\n    <div class=\"section-header__action\">\n      <m-button [config]=\"action\" (clicked)=\"actionClick.emit()\" />\n    </div>\n  }\n  @if (hasMenu()) {\n    <div class=\"section-header__menu\">\n      <m-context-menu\n        [config]=\"menu()\"\n        [name]=\"menuName()\"\n        [visibilityRule]=\"visibilityRule()\"\n        [disableRule]=\"disableRule()\"\n        [extraData]=\"extraData()\"\n        (action)=\"action.emit($event)\"\n      />\n    </div>\n  }\n</ng-template>\n\n<!-- Always the same two boxes, whether or not a `maxWidth` is in force. The\n     border and the sticky backdrop live on the host and keep spanning the\n     Section's full width; only this container narrows and is placed by the\n     Section's `align`, so the heading lines up with the body under it. -->\n<div class=\"section-header__container\">\n  <div class=\"section-header__inner\">\n    <ng-container [ngTemplateOutlet]=\"body\" />\n  </div>\n</div>\n",
+		styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:flex;align-items:center;gap:.5rem;min-height:var(--section-header-min-height, calc(var(--section-header-py, .5rem) * 2 + 1.25rem));border-bottom:1px solid var(--m-backdrop-border);padding:var(--section-header-py, .85rem) var(--section-px, 1rem);width:100%;grid-column:1/-1}:host(.no-border){border-bottom:none}:host(.spacing){padding:0;width:100%}.section-header__container{width:100%;min-width:0;max-width:var(--m-section-header-max-width, none);margin-inline:0 auto}:host(.box-center) .section-header__container{margin-inline:auto}:host(.box-right) .section-header__container{margin-inline:auto 0}.section-header__inner{display:flex;align-items:center;gap:.5rem;width:100%;min-width:0}.section-header__inner .section-header__title{flex:1;min-width:0;gap:.5rem}:host(.spacing) .section-header__inner{padding:1rem 1.5rem}:host(.has-sidepanel){padding-right:50px}:host(.has-sidepanel.has-menu){padding-right:50px}:host(.spacing.has-sidepanel) .section-header__inner{padding-right:calc(1.5rem + 50px)}:host(.is-sticky-enabled){position:sticky;top:var(--m-section-header-sticky-top, 0);z-index:var(--m-section-header-sticky-z, 10)}:host(.is-sticky){background:color-mix(in srgb,var(--m-background) 80%,transparent);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%)}:host(.is-accordion){cursor:pointer}.section-header__toggle{display:flex;flex-shrink:0}.section-header__toggle.section-header__toggle--rotate m-button{display:flex;transition:transform .3s cubic-bezier(.4,0,.2,1)}.section-header__toggle.section-header__toggle--rotate.section-header__toggle--open m-button{transform:rotate(180deg)}.section-header__title{flex:1;min-width:0;display:flex;flex-direction:column;gap:.1rem}m-header{min-width:0}.section-header__title--reverse{flex-direction:column-reverse}.section-header__sub{font-size:.8rem;color:var(--m-text-secondary);line-height:1.2}:host(.align-center){--m-header-justify: center}:host(.align-right){--m-header-justify: flex-end}:host(.has-menu){padding-right:0}:host(.spacing.has-menu) .section-header__inner{padding-right:0}.section-header__filters,.section-header__logo{display:contents}.section-header__logo m-section-filter-group{width:auto;flex-shrink:0;border-bottom:none}.section-header__back{display:flex;align-items:center;flex-shrink:0}.section-header__icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;align-self:flex-start;height:var(--m-section-header-icon-box, 1.5125rem)}.section-header__menu,.section-header__action{margin-left:auto;flex-shrink:0;display:flex;align-items:center}.section-header__action+.section-header__menu{margin-left:0}\n"],
 		dependencies: [
 			{
 				kind: "directive",
@@ -16941,8 +16996,8 @@ i0.ɵɵngDeclareClassMetadata({
 				"[class.is-accordion]": "!!accordion()",
 				"(click)": "onHeaderClick($event)"
 			},
-			template: "<!-- One declaration of the row, rendered by whichever branch `spacing` picks.\n     Hoisted into a template rather than written twice: an `<ng-content>` may\n     appear once per selector in a component, so the duplicated copy caught\n     nothing and a header projecting a title rendered it in the `spacing`\n     branch alone. -->\n<ng-template #body>\n  @if (accordion(); as accordionRef) {\n    <div\n      class=\"section-header__toggle\"\n      [class.section-header__toggle--rotate]=\"toggleRotates()\"\n      [class.section-header__toggle--open]=\"accordionRef.isOpen()\"\n      [id]=\"accordionRef.headerId\"\n      [attr.aria-expanded]=\"accordionRef.isOpen()\"\n      [attr.aria-controls]=\"accordionRef.bodyId\"\n    >\n      <m-button\n        [config]=\"{ icon: toggleIconName(), iconOnly: true, variant: 'ghost' }\"\n        (clicked)=\"onToggleClick()\" />\n    </div>\n  }\n  @if (showBack()) {\n    <div class=\"section-header__back\">\n      <m-button\n        [config]=\"{ icon: 'chevron-left', iconOnly: true }\"\n        (clicked)=\"back.emit()\" />\n    </div>\n  } @else if (!label() && icon(); as iconName) {\n    <!-- Only where no label is written. A header with one hands the icon to\n         `m-header`, which draws it inside the heading's line box and so on the\n         heading's own centre line. Beside a projected title there is no such\n         box to borrow, so the glyph is boxed to the level's line box here and\n         centred in it — otherwise it centres against the whole title column,\n         which on the Canvas is the label slot's drop rect stacked above the\n         heading. -->\n    <div class=\"section-header__icon\">\n      <m-icon [name]=\"iconName\" />\n    </div>\n  }\n  <div\n    class=\"section-header__title\"\n    [class.section-header__title--reverse]=\"reverse()\"\n  >\n    <!-- The title slot is the catch-all rather than a `[label]` one: every\n         header already projecting a heading writes it unselected, and a\n         selector here would drop that content on the floor. What the design\n         page emits — `<span label>` — is caught by it too, nothing else\n         claiming the node. -->\n    <ng-content />\n    <!-- The written label, drawn beside the slot rather than as its\n         `ng-content` fallback. A fallback renders only while *nothing* is\n         projected, and the design Canvas always projects the slot span —\n         empty until a Control is dropped in it — so a fallback there would\n         blank the label a header is still configured with. `label` answers\n         instead, which no header projecting a title sets. -->\n    @if (label()) {\n      <m-header\n        [level]=\"level()\"\n        [label]=\"label()\"\n        [icon]=\"icon()\"\n        [params]=\"params()\"\n        [noTranslate]=\"noTranslate()\" />\n    }\n    @if (subText(); as sub) {\n      <span class=\"section-header__sub\">{{ sub }}</span>\n    }\n  </div>\n  <!-- A FilterGroup projected into the header row, selected by tag rather than\n       by an attribute — the same shape a Section catches its `m-action` with.\n       A header has room for one icon and not for a row, so a group landing\n       here is squeezed by placement (ADR 0025); nothing here enforces that,\n       the caller binding `[squeeze]` on the tag it projects. -->\n  <div class=\"section-header__filters\">\n    <ng-content select=\"m-section-filter-group\" />\n  </div>\n  @if (actionConfig(); as action) {\n    <div class=\"section-header__action\">\n      <m-button [config]=\"action\" (clicked)=\"actionClick.emit()\" />\n    </div>\n  }\n  @if (hasMenu()) {\n    <div class=\"section-header__menu\">\n      <m-context-menu\n        [config]=\"menu()\"\n        [name]=\"menuName()\"\n        [visibilityRule]=\"visibilityRule()\"\n        [disableRule]=\"disableRule()\"\n        [extraData]=\"extraData()\"\n        (action)=\"action.emit($event)\"\n      />\n    </div>\n  }\n</ng-template>\n\n<!-- Always the same two boxes, whether or not a `maxWidth` is in force. The\n     border and the sticky backdrop live on the host and keep spanning the\n     Section's full width; only this container narrows and is placed by the\n     Section's `align`, so the heading lines up with the body under it. -->\n<div class=\"section-header__container\">\n  <div class=\"section-header__inner\">\n    <ng-container [ngTemplateOutlet]=\"body\" />\n  </div>\n</div>\n",
-			styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:flex;align-items:center;gap:.5rem;min-height:var(--section-header-min-height, calc(var(--section-header-py, .5rem) * 2 + 1.25rem));border-bottom:1px solid var(--m-backdrop-border);padding:var(--section-header-py, .85rem) var(--section-px, 1rem);width:100%;grid-column:1/-1}:host(.no-border){border-bottom:none}:host(.spacing){padding:0;width:100%}.section-header__container{width:100%;min-width:0;max-width:var(--m-section-header-max-width, none);margin-inline:0 auto}:host(.box-center) .section-header__container{margin-inline:auto}:host(.box-right) .section-header__container{margin-inline:auto 0}.section-header__inner{display:flex;align-items:center;gap:.5rem;width:100%;min-width:0}.section-header__inner .section-header__title{flex:1;min-width:0;gap:.5rem}:host(.spacing) .section-header__inner{padding:1rem 1.5rem}:host(.has-sidepanel){padding-right:50px}:host(.has-sidepanel.has-menu){padding-right:50px}:host(.spacing.has-sidepanel) .section-header__inner{padding-right:calc(1.5rem + 50px)}:host(.is-sticky-enabled){position:sticky;top:var(--m-section-header-sticky-top, 0);z-index:var(--m-section-header-sticky-z, 10)}:host(.is-sticky){background:color-mix(in srgb,var(--m-background) 80%,transparent);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%)}:host(.is-accordion){cursor:pointer}.section-header__toggle{display:flex;flex-shrink:0}.section-header__toggle.section-header__toggle--rotate m-button{display:flex;transition:transform .3s cubic-bezier(.4,0,.2,1)}.section-header__toggle.section-header__toggle--rotate.section-header__toggle--open m-button{transform:rotate(180deg)}.section-header__title{flex:1;min-width:0;display:flex;flex-direction:column;gap:.1rem}m-header{min-width:0}.section-header__title--reverse{flex-direction:column-reverse}.section-header__sub{font-size:.8rem;color:var(--m-text-secondary);line-height:1.2}:host(.align-center){--m-header-justify: center}:host(.align-right){--m-header-justify: flex-end}:host(.has-menu){padding-right:0}:host(.spacing.has-menu) .section-header__inner{padding-right:0}.section-header__filters{display:contents}.section-header__filters m-section-filter-group{width:auto;flex-shrink:0;border-bottom:none}.section-header__back{display:flex;align-items:center;flex-shrink:0}.section-header__icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;align-self:flex-start;height:var(--m-section-header-icon-box, 1.5125rem)}.section-header__menu,.section-header__action{margin-left:auto;flex-shrink:0;display:flex;align-items:center}.section-header__action+.section-header__menu{margin-left:0}\n"]
+			template: "<!-- One declaration of the row, rendered by whichever branch `spacing` picks.\n     Hoisted into a template rather than written twice: an `<ng-content>` may\n     appear once per selector in a component, so the duplicated copy caught\n     nothing and a header projecting a title rendered it in the `spacing`\n     branch alone. -->\n<ng-template #body>\n  @if (accordion(); as accordionRef) {\n    <div\n      class=\"section-header__toggle\"\n      [class.section-header__toggle--rotate]=\"toggleRotates()\"\n      [class.section-header__toggle--open]=\"accordionRef.isOpen()\"\n      [id]=\"accordionRef.headerId\"\n      [attr.aria-expanded]=\"accordionRef.isOpen()\"\n      [attr.aria-controls]=\"accordionRef.bodyId\"\n    >\n      <m-button\n        [config]=\"{ icon: toggleIconName(), iconOnly: true, variant: 'ghost' }\"\n        (clicked)=\"onToggleClick()\" />\n    </div>\n  }\n  @if (showBack()) {\n    <div class=\"section-header__back\">\n      <m-button\n        [config]=\"{ icon: 'chevron-left', iconOnly: true }\"\n        (clicked)=\"back.emit()\" />\n    </div>\n  } @else if (!label() && icon(); as iconName) {\n    <!-- Only where no label is written. A header with one hands the icon to\n         `m-header`, which draws it inside the heading's line box and so on the\n         heading's own centre line. Beside a projected title there is no such\n         box to borrow, so the glyph is boxed to the level's line box here and\n         centred in it — otherwise it centres against the whole title column,\n         which on the Canvas is the label slot's drop rect stacked above the\n         heading. -->\n    <div class=\"section-header__icon\">\n      <m-icon [name]=\"iconName\" />\n    </div>\n  }\n  <!-- An AppLogo projected in the icon's place, selected by tag like the\n       FilterGroup below — boxed to the heading's line box the same way. -->\n  <div class=\"section-header__logo\">\n    <ng-content select=\"m-app-logo\" />\n  </div>\n  <div\n    class=\"section-header__title\"\n    [class.section-header__title--reverse]=\"reverse()\"\n  >\n    <!-- The title slot is the catch-all rather than a `[label]` one: every\n         header already projecting a heading writes it unselected, and a\n         selector here would drop that content on the floor. What the design\n         page emits — `<span label>` — is caught by it too, nothing else\n         claiming the node. -->\n    <ng-content />\n    <!-- The written label, drawn beside the slot rather than as its\n         `ng-content` fallback. A fallback renders only while *nothing* is\n         projected, and the design Canvas always projects the slot span —\n         empty until a Control is dropped in it — so a fallback there would\n         blank the label a header is still configured with. `label` answers\n         instead, which no header projecting a title sets. -->\n    @if (label()) {\n      <m-header\n        [level]=\"level()\"\n        [label]=\"label()\"\n        [icon]=\"icon()\"\n        [params]=\"params()\"\n        [noTranslate]=\"noTranslate()\" />\n    }\n    @if (subText(); as sub) {\n      <span class=\"section-header__sub\">{{ sub }}</span>\n    }\n  </div>\n  <!-- A FilterGroup projected into the header row, selected by tag rather than\n       by an attribute — the same shape a Section catches its `m-action` with.\n       A header has room for one icon and not for a row, so a group landing\n       here is squeezed by placement (ADR 0025); nothing here enforces that,\n       the caller binding `[squeeze]` on the tag it projects. -->\n  <div class=\"section-header__filters\">\n    <ng-content select=\"m-section-filter-group\" />\n  </div>\n  @if (actionConfig(); as action) {\n    <div class=\"section-header__action\">\n      <m-button [config]=\"action\" (clicked)=\"actionClick.emit()\" />\n    </div>\n  }\n  @if (hasMenu()) {\n    <div class=\"section-header__menu\">\n      <m-context-menu\n        [config]=\"menu()\"\n        [name]=\"menuName()\"\n        [visibilityRule]=\"visibilityRule()\"\n        [disableRule]=\"disableRule()\"\n        [extraData]=\"extraData()\"\n        (action)=\"action.emit($event)\"\n      />\n    </div>\n  }\n</ng-template>\n\n<!-- Always the same two boxes, whether or not a `maxWidth` is in force. The\n     border and the sticky backdrop live on the host and keep spanning the\n     Section's full width; only this container narrows and is placed by the\n     Section's `align`, so the heading lines up with the body under it. -->\n<div class=\"section-header__container\">\n  <div class=\"section-header__inner\">\n    <ng-container [ngTemplateOutlet]=\"body\" />\n  </div>\n</div>\n",
+			styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:flex;align-items:center;gap:.5rem;min-height:var(--section-header-min-height, calc(var(--section-header-py, .5rem) * 2 + 1.25rem));border-bottom:1px solid var(--m-backdrop-border);padding:var(--section-header-py, .85rem) var(--section-px, 1rem);width:100%;grid-column:1/-1}:host(.no-border){border-bottom:none}:host(.spacing){padding:0;width:100%}.section-header__container{width:100%;min-width:0;max-width:var(--m-section-header-max-width, none);margin-inline:0 auto}:host(.box-center) .section-header__container{margin-inline:auto}:host(.box-right) .section-header__container{margin-inline:auto 0}.section-header__inner{display:flex;align-items:center;gap:.5rem;width:100%;min-width:0}.section-header__inner .section-header__title{flex:1;min-width:0;gap:.5rem}:host(.spacing) .section-header__inner{padding:1rem 1.5rem}:host(.has-sidepanel){padding-right:50px}:host(.has-sidepanel.has-menu){padding-right:50px}:host(.spacing.has-sidepanel) .section-header__inner{padding-right:calc(1.5rem + 50px)}:host(.is-sticky-enabled){position:sticky;top:var(--m-section-header-sticky-top, 0);z-index:var(--m-section-header-sticky-z, 10)}:host(.is-sticky){background:color-mix(in srgb,var(--m-background) 80%,transparent);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%)}:host(.is-accordion){cursor:pointer}.section-header__toggle{display:flex;flex-shrink:0}.section-header__toggle.section-header__toggle--rotate m-button{display:flex;transition:transform .3s cubic-bezier(.4,0,.2,1)}.section-header__toggle.section-header__toggle--rotate.section-header__toggle--open m-button{transform:rotate(180deg)}.section-header__title{flex:1;min-width:0;display:flex;flex-direction:column;gap:.1rem}m-header{min-width:0}.section-header__title--reverse{flex-direction:column-reverse}.section-header__sub{font-size:.8rem;color:var(--m-text-secondary);line-height:1.2}:host(.align-center){--m-header-justify: center}:host(.align-right){--m-header-justify: flex-end}:host(.has-menu){padding-right:0}:host(.spacing.has-menu) .section-header__inner{padding-right:0}.section-header__filters,.section-header__logo{display:contents}.section-header__logo m-section-filter-group{width:auto;flex-shrink:0;border-bottom:none}.section-header__back{display:flex;align-items:center;flex-shrink:0}.section-header__icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;align-self:flex-start;height:var(--m-section-header-icon-box, 1.5125rem)}.section-header__menu,.section-header__action{margin-left:auto;flex-shrink:0;display:flex;align-items:center}.section-header__action+.section-header__menu{margin-left:0}\n"]
 		}]
 	}],
 	propDecorators: {
@@ -21726,12 +21781,12 @@ var WrapperInputComponent = class WrapperInputComponent extends ConfigComponent
 		const seq = ++this.dynamicSeq;
 		switch (this.config()?.type) {
 			case InputType.RADIO: {
-				const { RadioInputComponent } = await import("./magmonium-one-radio-C2wOB_Nb.mjs").then((n) => n.n);
+				const { RadioInputComponent } = await import("./magmonium-one-radio-BAL3-3j5.mjs").then((n) => n.n);
 				this.createDynamicComponent(seq, RadioInputComponent);
 				break;
 			}
 			case InputType.TOGGLE: {
-				const { ToggleInputComponent } = await import("./magmonium-one-toggle-BTK2lzqA.mjs");
+				const { ToggleInputComponent } = await import("./magmonium-one-toggle-V_YnZXx5.mjs");
 				this.createDynamicComponent(seq, ToggleInputComponent, [], true);
 				break;
 			}
@@ -21741,12 +21796,12 @@ var WrapperInputComponent = class WrapperInputComponent extends ConfigComponent
 				break;
 			}
 			case InputType.PASSWORD: {
-				const { PasswordInputComponent } = await import("./magmonium-one-password-BIs_YxJ5.mjs");
+				const { PasswordInputComponent } = await import("./magmonium-one-password-IdllPMUw.mjs");
 				this.createDynamicComponent(seq, PasswordInputComponent);
 				break;
 			}
 			case InputType.OTP: {
-				const { OtpInputComponent } = await import("./magmonium-one-otp-CE4L1RcG.mjs");
+				const { OtpInputComponent } = await import("./magmonium-one-otp-V2tFztLx.mjs");
 				this.createDynamicComponent(seq, OtpInputComponent);
 				break;
 			}
@@ -21756,7 +21811,7 @@ var WrapperInputComponent = class WrapperInputComponent extends ConfigComponent
 				break;
 			}
 			case InputType.CHECKBOX: {
-				const { CheckboxInputComponent } = await import("./magmonium-one-checkbox-D5-5WhJ-.mjs").then((n) => n.n);
+				const { CheckboxInputComponent } = await import("./magmonium-one-checkbox-R-hPZrCa.mjs").then((n) => n.n);
 				this.createDynamicComponent(seq, CheckboxInputComponent, [], true);
 				break;
 			}
@@ -21771,12 +21826,12 @@ var WrapperInputComponent = class WrapperInputComponent extends ConfigComponent
 				break;
 			}
 			case InputType.RANGE: {
-				const { RangeInputComponent } = await import("./magmonium-one-range-rgDe4O8u.mjs").then((n) => n.n);
+				const { RangeInputComponent } = await import("./magmonium-one-range-Cf7yUnhN.mjs").then((n) => n.n);
 				this.createDynamicComponent(seq, RangeInputComponent);
 				break;
 			}
 			case InputType.MULTI_RANGE: {
-				const { MultiRangeInputComponent } = await import("./magmonium-one-multi-range-o57TiVJU.mjs").then((n) => n.n);
+				const { MultiRangeInputComponent } = await import("./magmonium-one-multi-range-Bq3_3NHg.mjs").then((n) => n.n);
 				this.createDynamicComponent(seq, MultiRangeInputComponent);
 				break;
 			}
@@ -21827,7 +21882,7 @@ var WrapperInputComponent = class WrapperInputComponent extends ConfigComponent
 				break;
 			}
 			default: {
-				const { TextInputComponent } = await import("./magmonium-one-text-BvXdAX0i.mjs").then((n) => n.n);
+				const { TextInputComponent } = await import("./magmonium-one-text-BnTkYLJe.mjs").then((n) => n.n);
 				this.createDynamicComponent(seq, TextInputComponent);
 				break;
 			}
@@ -24145,7 +24200,7 @@ var FileUploadInputComponent = class FileUploadInputComponent extends BaseInputC
 	openEditor = async (file, size) => {
 		const modalStore = this.modalStore;
 		if (!modalStore) return void 0;
-		const { ImageEditorComponent } = await import("./magmonium-one-image-editor-oGxg59hV.mjs");
+		const { ImageEditorComponent } = await import("./magmonium-one-image-editor-BRTk8i4O.mjs");
 		const ratio = String(this.config()?.ratio ?? "");
 		return new Promise((resolve) => {
 			const modalRef = new ModalRef();
@@ -29166,12 +29221,232 @@ const remoteOutletRoute = (name) => ({
 	children: [],
 	data: { remoteOutlet: true }
 });
+var AppLogoComponent = class AppLogoComponent {
+	glyph = input(...ngDevMode ? [void 0, { debugName: "glyph" }] : /* istanbul ignore next */ []);
+	appColor = input(...ngDevMode ? [void 0, { debugName: "appColor" }] : /* istanbul ignore next */ []);
+	name = input(...ngDevMode ? [void 0, { debugName: "name" }] : /* istanbul ignore next */ []);
+	link = input(...ngDevMode ? [void 0, { debugName: "link" }] : /* istanbul ignore next */ []);
+	variant = input("tile", ...ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []);
+	tone = input("app", ...ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []);
+	size = input(...ngDevMode ? [void 0, { debugName: "size" }] : /* istanbul ignore next */ []);
+	#state = inject(AppLogoState);
+	#own = inject(APP_LOGO_SOURCE);
+	lookup = computed(() => {
+		const link = this.link()?.trim();
+		if (link) return this.#state.logos()[link];
+		return this.glyph() !== void 0 || this.appColor() !== void 0 || this.name() !== void 0 ? void 0 : this.#own();
+	}, ...ngDevMode ? [{ debugName: "lookup" }] : /* istanbul ignore next */ []);
+	color = computed(() => {
+		const value = this.appColor() !== void 0 ? this.appColor() : this.lookup()?.color;
+		return value ? normalizeAppColor(value) ?? null : null;
+	}, ...ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []);
+	label = computed(() => (this.name() !== void 0 ? this.name() : this.lookup()?.name) || this.link()?.trim() || "", ...ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []);
+	shadow = computed(() => {
+		const color = this.color();
+		return color ? appLogoShadowColor(color) : null;
+	}, ...ngDevMode ? [{ debugName: "shadow" }] : /* istanbul ignore next */ []);
+	mask = computed(() => {
+		if (this.glyph() !== void 0) {
+			const glyph = this.glyph();
+			return glyph ? logoGlyphMaskUrl(glyph) : void 0;
+		}
+		const found = this.lookup();
+		if (found?.glyph) return logoGlyphMaskUrl(found.glyph);
+		return found?.src ? `url("${encodeURI(found.src)}")` : void 0;
+	}, ...ngDevMode ? [{ debugName: "mask" }] : /* istanbul ignore next */ []);
+	letter = computed(() => this.label().trim().charAt(0).toUpperCase(), ...ngDevMode ? [{ debugName: "letter" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: AppLogoComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: AppLogoComponent,
+		isStandalone: true,
+		selector: "m-app-logo",
+		inputs: {
+			glyph: {
+				classPropertyName: "glyph",
+				publicName: "glyph",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			appColor: {
+				classPropertyName: "appColor",
+				publicName: "appColor",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			name: {
+				classPropertyName: "name",
+				publicName: "name",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			link: {
+				classPropertyName: "link",
+				publicName: "link",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			variant: {
+				classPropertyName: "variant",
+				publicName: "variant",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			tone: {
+				classPropertyName: "tone",
+				publicName: "tone",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			size: {
+				classPropertyName: "size",
+				publicName: "size",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		host: {
+			attributes: { "role": "img" },
+			properties: {
+				"class.m-app-logo--glow": "variant() === 'glow'",
+				"class.m-app-logo--light": "tone() === 'light'",
+				"attr.aria-label": "label() || null",
+				"style.width": "size() || null",
+				"style.height": "size() || null",
+				"style.--m-app-logo-color": "color()",
+				"style.--m-app-logo-shadow": "shadow()"
+			},
+			classAttribute: "m-app-logo"
+		},
+		ngImport: i0,
+		template: `
+    <span class="m-app-logo__mark">
+      @if (mask(); as url) {
+        <span class="m-app-logo__glyph" [style.mask-image]="url"></span>
+      } @else {
+        <span class="m-app-logo__letter">{{ letter() }}</span>
+      }
+    </span>
+  `,
+		isInline: true,
+		styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;aspect-ratio:1;container-type:size;border-radius:22%;overflow:hidden;background:var(--m-app-logo-color, var(--m-text-quaternary))}.m-app-logo__mark{display:flex;align-items:center;justify-content:center;width:100%;height:100%;filter:drop-shadow(0 4cqmin 3cqmin var(--m-app-logo-shadow, rgba(0, 0, 0, .25)))}.m-app-logo__glyph{width:60%;height:60%;background:#fff;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}.m-app-logo__letter{color:#fff;font-size:50cqmin;font-weight:700;line-height:1}:host(.m-app-logo--glow){border-radius:0;overflow:visible;background:none}:host(.m-app-logo--glow) .m-app-logo__mark{filter:drop-shadow(0 0 8cqmin color-mix(in srgb,var(--m-app-logo-color, var(--m-mm)) 55%,transparent)) drop-shadow(0 6cqmin 18cqmin color-mix(in srgb,var(--m-app-logo-color, var(--m-mm)) 35%,transparent))}:host(.m-app-logo--glow) .m-app-logo__glyph{width:100%;height:100%;background:var(--m-app-logo-color, var(--m-mm))}:host(.m-app-logo--glow) .m-app-logo__letter{color:var(--m-app-logo-color, var(--m-mm));font-size:80cqmin}:host(.m-app-logo--glow.m-app-logo--light) .m-app-logo__glyph{background:#fff}:host(.m-app-logo--glow.m-app-logo--light) .m-app-logo__letter{color:#fff}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: AppLogoComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "m-app-logo",
+			template: `
+    <span class="m-app-logo__mark">
+      @if (mask(); as url) {
+        <span class="m-app-logo__glyph" [style.mask-image]="url"></span>
+      } @else {
+        <span class="m-app-logo__letter">{{ letter() }}</span>
+      }
+    </span>
+  `,
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			host: {
+				class: "m-app-logo",
+				"[class.m-app-logo--glow]": "variant() === 'glow'",
+				"[class.m-app-logo--light]": "tone() === 'light'",
+				role: "img",
+				"[attr.aria-label]": "label() || null",
+				"[style.width]": "size() || null",
+				"[style.height]": "size() || null",
+				"[style.--m-app-logo-color]": "color()",
+				"[style.--m-app-logo-shadow]": "shadow()"
+			},
+			styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;aspect-ratio:1;container-type:size;border-radius:22%;overflow:hidden;background:var(--m-app-logo-color, var(--m-text-quaternary))}.m-app-logo__mark{display:flex;align-items:center;justify-content:center;width:100%;height:100%;filter:drop-shadow(0 4cqmin 3cqmin var(--m-app-logo-shadow, rgba(0, 0, 0, .25)))}.m-app-logo__glyph{width:60%;height:60%;background:#fff;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}.m-app-logo__letter{color:#fff;font-size:50cqmin;font-weight:700;line-height:1}:host(.m-app-logo--glow){border-radius:0;overflow:visible;background:none}:host(.m-app-logo--glow) .m-app-logo__mark{filter:drop-shadow(0 0 8cqmin color-mix(in srgb,var(--m-app-logo-color, var(--m-mm)) 55%,transparent)) drop-shadow(0 6cqmin 18cqmin color-mix(in srgb,var(--m-app-logo-color, var(--m-mm)) 35%,transparent))}:host(.m-app-logo--glow) .m-app-logo__glyph{width:100%;height:100%;background:var(--m-app-logo-color, var(--m-mm))}:host(.m-app-logo--glow) .m-app-logo__letter{color:var(--m-app-logo-color, var(--m-mm));font-size:80cqmin}:host(.m-app-logo--glow.m-app-logo--light) .m-app-logo__glyph{background:#fff}:host(.m-app-logo--glow.m-app-logo--light) .m-app-logo__letter{color:#fff}\n"]
+		}]
+	}],
+	propDecorators: {
+		glyph: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "glyph",
+				required: false
+			}]
+		}],
+		appColor: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "appColor",
+				required: false
+			}]
+		}],
+		name: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "name",
+				required: false
+			}]
+		}],
+		link: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "link",
+				required: false
+			}]
+		}],
+		variant: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "variant",
+				required: false
+			}]
+		}],
+		tone: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "tone",
+				required: false
+			}]
+		}],
+		size: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "size",
+				required: false
+			}]
+		}]
+	}
+});
 const REMOTE_PAGE_RELOAD = new InjectionToken("REMOTE_PAGE_RELOAD", {
 	providedIn: "root",
 	factory: () => () => window.location.reload()
 });
 const tierReloadKey = (link) => `m-remote-tier-reload:${window.location.pathname}|${link ?? ""}|${link && wcTierOf(link) || "status"}`;
 const isBootRedirect = (pending, sent, path) => pending && (sent === void 0 || !samePath(path, sent));
+const REMOTE_BOOT_TIMEOUT_MS = 1e4;
 var RemoteComponent = class RemoteComponent {
 	config = input(...ngDevMode ? [void 0, { debugName: "config" }] : /* istanbul ignore next */ []);
 	link = input(...ngDevMode ? [void 0, { debugName: "link" }] : /* istanbul ignore next */ []);
@@ -29192,6 +29467,8 @@ var RemoteComponent = class RemoteComponent {
 		return typeof mount === "string" ? parseMountPattern(mount) : mount;
 	}, ...ngDevMode ? [{ debugName: "pattern" }] : /* istanbul ignore next */ []);
 	beta = input(false, ...ngDevMode ? [{ debugName: "beta" }] : /* istanbul ignore next */ []);
+	glyph = input(...ngDevMode ? [void 0, { debugName: "glyph" }] : /* istanbul ignore next */ []);
+	appColor = input(...ngDevMode ? [void 0, { debugName: "appColor" }] : /* istanbul ignore next */ []);
 	loaded = output();
 	failed = output();
 	loader = inject(RemoteLoaderService);
@@ -29203,6 +29480,7 @@ var RemoteComponent = class RemoteComponent {
 	navRef = inject(NAV_STORE_REF, { optional: true });
 	reloadPage = inject(REMOTE_PAGE_RELOAD);
 	assetStore = inject(AssetStore);
+	appLogoState = inject(AppLogoState);
 	loadedElement;
 	loadId = 0;
 	mountedLink;
@@ -29216,6 +29494,13 @@ var RemoteComponent = class RemoteComponent {
 	pinnedLink;
 	state = signal("idle", ...ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []);
 	failure = signal({}, ...ngDevMode ? [{ debugName: "failure" }] : /* istanbul ignore next */ []);
+	booting = signal(false, ...ngDevMode ? [{ debugName: "booting" }] : /* istanbul ignore next */ []);
+	bootTimer;
+	endBoot = () => {
+		clearTimeout(this.bootTimer);
+		this.bootTimer = void 0;
+		this.booting.set(false);
+	};
 	hostQuery = this.router ? toSignal(this.router.events.pipe(filter((e) => e instanceof NavigationEnd), map(() => this.currentQuery())), { initialValue: this.currentQuery() }) : signal("");
 	hostSegments = this.router ? toSignal(this.router.events.pipe(filter((e) => e instanceof NavigationEnd), map(() => this.primarySegments())), { initialValue: this.primarySegments() }) : signal([]);
 	mountMatch = linkedSignal({
@@ -29237,7 +29522,29 @@ var RemoteComponent = class RemoteComponent {
 		return navUrl === void 0 ? void 0 : `${navUrl}${this.hostQuery()}`;
 	}, ...ngDevMode ? [{ debugName: "remotePath" }] : /* istanbul ignore next */ []);
 	ownTail = computed(() => this.mountMatch()?.navUrl ?? this.tail(), ...ngDevMode ? [{ debugName: "ownTail" }] : /* istanbul ignore next */ []);
+	mountColor = computed(() => {
+		const chosen = normalizeAppColor(this.appColor() ?? "");
+		if (chosen) return chosen;
+		const link = this.appLink();
+		const color = link ? this.appLogoState.logos()[link]?.color : void 0;
+		return color ? normalizeAppColor(color) : void 0;
+	}, ...ngDevMode ? [{ debugName: "mountColor" }] : /* istanbul ignore next */ []);
+	chosenGlyph = computed(() => {
+		const glyph = this.glyph()?.trim();
+		return glyph ? rebuildLogoGlyph(glyph).svg || void 0 : void 0;
+	}, ...ngDevMode ? [{ debugName: "chosenGlyph" }] : /* istanbul ignore next */ []);
+	splash = computed(() => {
+		const link = this.appLink() ?? "";
+		const own = link ? this.appLogoState.logos()[link] : void 0;
+		const logo = own && own.glyph !== void 0 ? own : this.appLogoState.source();
+		return {
+			glyph: this.chosenGlyph() ?? logo?.glyph ?? null,
+			color: this.mountColor() ?? null,
+			name: own?.name?.trim() || link
+		};
+	}, ...ngDevMode ? [{ debugName: "splash" }] : /* istanbul ignore next */ []);
 	constructor() {
+		effect(() => paintAppColor(this.elementRef.nativeElement, this.mountColor()));
 		effect(() => {
 			this.loginStore?.isLoggedIn();
 			const config = this.config();
@@ -29303,6 +29610,7 @@ var RemoteComponent = class RemoteComponent {
 		});
 	}
 	ngOnDestroy() {
+		clearTimeout(this.bootTimer);
 		if (this.pinnedLink) setWcTier(this.pinnedLink, void 0);
 		this.dismountElement();
 		this.url()?.clear(this.queryKeys);
@@ -29349,6 +29657,7 @@ var RemoteComponent = class RemoteComponent {
 	};
 	onReport = (event) => {
 		const detail = event.detail;
+		this.endBoot();
 		const raw = detail?.path;
 		if (raw === void 0) return;
 		const path = raw.replace(/^\//, "");
@@ -29423,6 +29732,8 @@ var RemoteComponent = class RemoteComponent {
 		} catch {}
 		result.element.addEventListener(WC_ROUTE_CHANGED_EVENT, this.onReport);
 		host.appendChild(result.element);
+		this.booting.set(true);
+		this.bootTimer = setTimeout(this.endBoot, REMOTE_BOOT_TIMEOUT_MS);
 		this.state.set("loaded");
 		const loadedConfig = result.config ?? config;
 		if (loadedConfig) this.loaded.emit(loadedConfig);
@@ -29440,6 +29751,7 @@ var RemoteComponent = class RemoteComponent {
 	};
 	dismountElement = () => {
 		const host = this.elementRef.nativeElement;
+		this.endBoot();
 		this.loadedElement?.removeEventListener(WC_ROUTE_CHANGED_EVENT, this.onReport);
 		if (this.loadedElement?.parentNode === host) host.removeChild(this.loadedElement);
 		this.loadedElement = void 0;
@@ -29563,33 +29875,79 @@ var RemoteComponent = class RemoteComponent {
 				isSignal: true,
 				isRequired: false,
 				transformFunction: null
+			},
+			glyph: {
+				classPropertyName: "glyph",
+				publicName: "glyph",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			appColor: {
+				classPropertyName: "appColor",
+				publicName: "appColor",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
 			}
 		},
 		outputs: {
 			loaded: "loaded",
 			failed: "failed"
 		},
-		host: { classAttribute: "m-remote" },
+		host: {
+			properties: { "class.m-remote--booting": "booting()" },
+			classAttribute: "m-remote"
+		},
 		ngImport: i0,
 		template: `
-    @if (state() === 'loading') {
-      <div class="m-remote__loading"><div class="m-remote__spinner"></div></div>
+    @if (state() === 'loading' || booting()) {
+      <div class="m-remote__splash">
+        <span class="m-remote__splash-mark">
+          <m-app-logo
+            variant="glow"
+            tone="light"
+            [glyph]="splash().glyph"
+            [appColor]="splash().color"
+            [name]="splash().name"
+          />
+        </span>
+      </div>
     } @else if (state() === 'self-beta') {
       <div class="m-remote__self-beta">
-        <span class="m-remote__reason">{{ 'remote-self-beta' | translate }}</span>
-        <m-button label="open-beta" icon="chevrons-right" variant="primary" (clicked)="openBeta()" />
+        <span class="m-remote__reason">{{
+          'remote-self-beta' | translate
+        }}</span>
+        <m-button
+          label="open-beta"
+          icon="chevrons-right"
+          variant="primary"
+          (clicked)="openBeta()"
+        />
       </div>
     } @else if (state() === 'failed') {
       <div class="m-remote__broken">
         <m-icon name="link-broken" color="currentColor" />
         <span class="m-remote__reason">
           @switch (failure().reason) {
-            @case ('invalid-link') { {{ 'remote-invalid-link' | translate }} }
-            @case ('config-not-found') { {{ 'remote-config-not-found' | translate }} }
-            @case ('script-failed') { {{ 'remote-script-failed' | translate }} }
-            @case ('element-timeout') { {{ 'remote-element-timeout' | translate }} }
-            @case ('offline') { {{ 'remote-offline' | translate }} }
-            @case ('tier-conflict') { {{ 'remote-tier-conflict' | translate }} }
+            @case ('invalid-link') {
+              {{ 'remote-invalid-link' | translate }}
+            }
+            @case ('config-not-found') {
+              {{ 'remote-config-not-found' | translate }}
+            }
+            @case ('script-failed') {
+              {{ 'remote-script-failed' | translate }}
+            }
+            @case ('element-timeout') {
+              {{ 'remote-element-timeout' | translate }}
+            }
+            @case ('offline') {
+              {{ 'remote-offline' | translate }}
+            }
+            @case ('tier-conflict') {
+              {{ 'remote-tier-conflict' | translate }}
+            }
           }
         </span>
         <span class="m-remote__detail">{{ appLink() }}</span>
@@ -29600,7 +29958,7 @@ var RemoteComponent = class RemoteComponent {
     }
   `,
 		isInline: true,
-		styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-remote{display:block;width:100%;min-height:100%;flex:1;isolation:isolate}.m-remote__loading,.m-remote__broken,.m-remote__self-beta{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:24px}.m-remote__spinner{width:20px;height:20px;border:2px solid var(--m-backdrop-border);border-top-color:var(--m-mm);border-radius:50%;animation:m-remote-spin .8s linear infinite}.m-remote__broken,.m-remote__self-beta{color:var(--m-text-secondary)}.m-remote__detail{font-size:.85em}@keyframes m-remote-spin{to{transform:rotate(360deg)}}\n"],
+		styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-remote{display:block;width:100%;min-height:100%;flex:1;isolation:isolate}.m-remote__broken,.m-remote__self-beta{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:24px}.m-remote__broken,.m-remote__self-beta{color:var(--m-text-secondary)}.m-remote--booting{position:relative;min-height:100vh}.m-remote--booting>.m-remote__splash{position:absolute;inset:0;z-index:1}.m-remote--booting>:not(.m-remote__splash){visibility:hidden}.m-remote__splash{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:100vh;background:var(--m-background)}.m-remote__splash-mark{display:flex;width:96px;height:96px;animation:m-remote-breathe 1.6s ease-in-out infinite}@media(prefers-reduced-motion:reduce){.m-remote__splash-mark{animation:none}}.m-remote__detail{font-size:.85em}@keyframes m-remote-breathe{0%,to{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(.93)}}\n"],
 		dependencies: [
 			{
 				kind: "component",
@@ -29652,6 +30010,20 @@ var RemoteComponent = class RemoteComponent {
 				],
 				outputs: ["configChange", "clicked"]
 			},
+			{
+				kind: "component",
+				type: AppLogoComponent,
+				selector: "m-app-logo",
+				inputs: [
+					"glyph",
+					"appColor",
+					"name",
+					"link",
+					"variant",
+					"tone",
+					"size"
+				]
+			},
 			{
 				kind: "pipe",
 				type: TranslatePipe,
@@ -29674,28 +30046,61 @@ i0.ɵɵngDeclareClassMetadata({
 			imports: [
 				TranslatePipe,
 				IconComponent,
-				ButtonComponent
+				ButtonComponent,
+				AppLogoComponent
 			],
-			host: { class: "m-remote" },
+			host: {
+				class: "m-remote",
+				"[class.m-remote--booting]": "booting()"
+			},
 			template: `
-    @if (state() === 'loading') {
-      <div class="m-remote__loading"><div class="m-remote__spinner"></div></div>
+    @if (state() === 'loading' || booting()) {
+      <div class="m-remote__splash">
+        <span class="m-remote__splash-mark">
+          <m-app-logo
+            variant="glow"
+            tone="light"
+            [glyph]="splash().glyph"
+            [appColor]="splash().color"
+            [name]="splash().name"
+          />
+        </span>
+      </div>
     } @else if (state() === 'self-beta') {
       <div class="m-remote__self-beta">
-        <span class="m-remote__reason">{{ 'remote-self-beta' | translate }}</span>
-        <m-button label="open-beta" icon="chevrons-right" variant="primary" (clicked)="openBeta()" />
+        <span class="m-remote__reason">{{
+          'remote-self-beta' | translate
+        }}</span>
+        <m-button
+          label="open-beta"
+          icon="chevrons-right"
+          variant="primary"
+          (clicked)="openBeta()"
+        />
       </div>
     } @else if (state() === 'failed') {
       <div class="m-remote__broken">
         <m-icon name="link-broken" color="currentColor" />
         <span class="m-remote__reason">
           @switch (failure().reason) {
-            @case ('invalid-link') { {{ 'remote-invalid-link' | translate }} }
-            @case ('config-not-found') { {{ 'remote-config-not-found' | translate }} }
-            @case ('script-failed') { {{ 'remote-script-failed' | translate }} }
-            @case ('element-timeout') { {{ 'remote-element-timeout' | translate }} }
-            @case ('offline') { {{ 'remote-offline' | translate }} }
-            @case ('tier-conflict') { {{ 'remote-tier-conflict' | translate }} }
+            @case ('invalid-link') {
+              {{ 'remote-invalid-link' | translate }}
+            }
+            @case ('config-not-found') {
+              {{ 'remote-config-not-found' | translate }}
+            }
+            @case ('script-failed') {
+              {{ 'remote-script-failed' | translate }}
+            }
+            @case ('element-timeout') {
+              {{ 'remote-element-timeout' | translate }}
+            }
+            @case ('offline') {
+              {{ 'remote-offline' | translate }}
+            }
+            @case ('tier-conflict') {
+              {{ 'remote-tier-conflict' | translate }}
+            }
           }
         </span>
         <span class="m-remote__detail">{{ appLink() }}</span>
@@ -29707,7 +30112,7 @@ i0.ɵɵngDeclareClassMetadata({
   `,
 			changeDetection: ChangeDetectionStrategy.OnPush,
 			encapsulation: ViewEncapsulation.None,
-			styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-remote{display:block;width:100%;min-height:100%;flex:1;isolation:isolate}.m-remote__loading,.m-remote__broken,.m-remote__self-beta{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:24px}.m-remote__spinner{width:20px;height:20px;border:2px solid var(--m-backdrop-border);border-top-color:var(--m-mm);border-radius:50%;animation:m-remote-spin .8s linear infinite}.m-remote__broken,.m-remote__self-beta{color:var(--m-text-secondary)}.m-remote__detail{font-size:.85em}@keyframes m-remote-spin{to{transform:rotate(360deg)}}\n"]
+			styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.m-remote{display:block;width:100%;min-height:100%;flex:1;isolation:isolate}.m-remote__broken,.m-remote__self-beta{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:24px}.m-remote__broken,.m-remote__self-beta{color:var(--m-text-secondary)}.m-remote--booting{position:relative;min-height:100vh}.m-remote--booting>.m-remote__splash{position:absolute;inset:0;z-index:1}.m-remote--booting>:not(.m-remote__splash){visibility:hidden}.m-remote__splash{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:100vh;background:var(--m-background)}.m-remote__splash-mark{display:flex;width:96px;height:96px;animation:m-remote-breathe 1.6s ease-in-out infinite}@media(prefers-reduced-motion:reduce){.m-remote__splash-mark{animation:none}}.m-remote__detail{font-size:.85em}@keyframes m-remote-breathe{0%,to{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(.93)}}\n"]
 		}]
 	}],
 	ctorParameters: () => [],
@@ -29832,6 +30237,22 @@ i0.ɵɵngDeclareClassMetadata({
 				required: false
 			}]
 		}],
+		glyph: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "glyph",
+				required: false
+			}]
+		}],
+		appColor: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "appColor",
+				required: false
+			}]
+		}],
 		loaded: [{
 			type: i0.Output,
 			args: ["loaded"]
@@ -37915,140 +38336,6 @@ i0.ɵɵngDeclareClassMetadata({
 		args: ["inner", { isSignal: true }]
 	}] }
 });
-var AppLogoComponent = class AppLogoComponent {
-	glyph = input(...ngDevMode ? [void 0, { debugName: "glyph" }] : /* istanbul ignore next */ []);
-	appColor = input(...ngDevMode ? [void 0, { debugName: "appColor" }] : /* istanbul ignore next */ []);
-	name = input(...ngDevMode ? [void 0, { debugName: "name" }] : /* istanbul ignore next */ []);
-	color = computed(() => {
-		const value = this.appColor();
-		return value ? normalizeAppColor(value) ?? null : null;
-	}, ...ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []);
-	shadow = computed(() => {
-		const color = this.color();
-		return color ? appLogoShadowColor(color) : null;
-	}, ...ngDevMode ? [{ debugName: "shadow" }] : /* istanbul ignore next */ []);
-	mask = computed(() => {
-		const glyph = this.glyph();
-		return glyph ? logoGlyphMaskUrl(glyph) : void 0;
-	}, ...ngDevMode ? [{ debugName: "mask" }] : /* istanbul ignore next */ []);
-	letter = computed(() => (this.name()?.trim().charAt(0) ?? "").toUpperCase(), ...ngDevMode ? [{ debugName: "letter" }] : /* istanbul ignore next */ []);
-	static ɵfac = i0.ɵɵngDeclareFactory({
-		minVersion: "12.0.0",
-		version: "22.2.1",
-		ngImport: i0,
-		type: AppLogoComponent,
-		deps: [],
-		target: i0.ɵɵFactoryTarget.Component
-	});
-	static ɵcmp = i0.ɵɵngDeclareComponent({
-		minVersion: "17.0.0",
-		version: "22.2.1",
-		type: AppLogoComponent,
-		isStandalone: true,
-		selector: "m-app-logo",
-		inputs: {
-			glyph: {
-				classPropertyName: "glyph",
-				publicName: "glyph",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			},
-			appColor: {
-				classPropertyName: "appColor",
-				publicName: "appColor",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			},
-			name: {
-				classPropertyName: "name",
-				publicName: "name",
-				isSignal: true,
-				isRequired: false,
-				transformFunction: null
-			}
-		},
-		host: {
-			attributes: { "role": "img" },
-			properties: {
-				"attr.aria-label": "name() || null",
-				"style.--m-app-logo-color": "color()",
-				"style.--m-app-logo-shadow": "shadow()"
-			},
-			classAttribute: "m-app-logo"
-		},
-		ngImport: i0,
-		template: `
-    <span class="m-app-logo__mark">
-      @if (mask(); as url) {
-        <span class="m-app-logo__glyph" [style.mask-image]="url"></span>
-      } @else {
-        <span class="m-app-logo__letter">{{ letter() }}</span>
-      }
-    </span>
-  `,
-		isInline: true,
-		styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;aspect-ratio:1;container-type:size;border-radius:22%;overflow:hidden;background:var(--m-app-logo-color, var(--m-text-quaternary))}.m-app-logo__mark{display:flex;align-items:center;justify-content:center;width:100%;height:100%;filter:drop-shadow(0 4cqmin 3cqmin var(--m-app-logo-shadow, rgba(0, 0, 0, .25)))}.m-app-logo__glyph{width:60%;height:60%;background:#fff;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}.m-app-logo__letter{color:#fff;font-size:50cqmin;font-weight:700;line-height:1}\n"],
-		changeDetection: i0.ChangeDetectionStrategy.OnPush
-	});
-};
-i0.ɵɵngDeclareClassMetadata({
-	minVersion: "12.0.0",
-	version: "22.2.1",
-	ngImport: i0,
-	type: AppLogoComponent,
-	decorators: [{
-		type: Component,
-		args: [{
-			selector: "m-app-logo",
-			template: `
-    <span class="m-app-logo__mark">
-      @if (mask(); as url) {
-        <span class="m-app-logo__glyph" [style.mask-image]="url"></span>
-      } @else {
-        <span class="m-app-logo__letter">{{ letter() }}</span>
-      }
-    </span>
-  `,
-			changeDetection: ChangeDetectionStrategy.OnPush,
-			host: {
-				class: "m-app-logo",
-				role: "img",
-				"[attr.aria-label]": "name() || null",
-				"[style.--m-app-logo-color]": "color()",
-				"[style.--m-app-logo-shadow]": "shadow()"
-			},
-			styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%;aspect-ratio:1;container-type:size;border-radius:22%;overflow:hidden;background:var(--m-app-logo-color, var(--m-text-quaternary))}.m-app-logo__mark{display:flex;align-items:center;justify-content:center;width:100%;height:100%;filter:drop-shadow(0 4cqmin 3cqmin var(--m-app-logo-shadow, rgba(0, 0, 0, .25)))}.m-app-logo__glyph{width:60%;height:60%;background:#fff;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}.m-app-logo__letter{color:#fff;font-size:50cqmin;font-weight:700;line-height:1}\n"]
-		}]
-	}],
-	propDecorators: {
-		glyph: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "glyph",
-				required: false
-			}]
-		}],
-		appColor: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "appColor",
-				required: false
-			}]
-		}],
-		name: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "name",
-				required: false
-			}]
-		}]
-	}
-});
 var AppCardComponent = class AppCardComponent {
 	app = input.required(...ngDevMode ? [{ debugName: "app" }] : /* istanbul ignore next */ []);
 	variant = input("card", ...ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []);
@@ -38168,7 +38455,11 @@ var AppCardComponent = class AppCardComponent {
 				inputs: [
 					"glyph",
 					"appColor",
-					"name"
+					"name",
+					"link",
+					"variant",
+					"tone",
+					"size"
 				]
 			},
 			{
@@ -38462,7 +38753,11 @@ var LogoGlyphInputComponent = class LogoGlyphInputComponent {
 				inputs: [
 					"glyph",
 					"appColor",
-					"name"
+					"name",
+					"link",
+					"variant",
+					"tone",
+					"size"
 				]
 			},
 			{
@@ -41109,8 +41404,8 @@ var NavHeaderComponent = class NavHeaderComponent {
 			classAttribute: "m-nav-header"
 		},
 		ngImport: i0,
-		template: "<m-section>\n  @if (_isSearch() && _searchOpen()) {\n    <!-- Searching: the field takes the row the trail was on, so the nav is\n         hidden while there is something to type into. -->\n    <m-section-search\n      class=\"nav-header__search\"\n      [(isOpen)]=\"_searchOpen\"\n      [value]=\"_searchStore.query()\"\n      [searchLabel]=\"_searchLabel()\"\n      (searchChange)=\"_searchStore.updateQuery($event)\"\n    />\n  } @else if (_trail() || _isSearch()) {\n    <!-- The nav's row, and the bar's toggle stands in it rather than in a row\n         stacked on top of it. Both slots are written a single `@if` deep: a\n         Section matches its projected slots by tag, and a node nested deeper\n         falls through to the body instead. -->\n    <m-section-back [back]=\"_hasParent()\" (navigate)=\"_navStore.back()\">\n      @if (_trail(); as trail) {\n        <m-nav-trail [config]=\"trail\" />\n      }\n      @if (_isSearch()) {\n        <m-button\n          class=\"nav-header__search-toggle\"\n          [config]=\"_searchToggle\"\n          (clicked)=\"_openSearch()\"\n        />\n      }\n    </m-section-back>\n  }\n\n  @if (_user(); as user) {\n    <m-user class=\"nav-header__user\" [id]=\"user.id\" [user]=\"user\" mRef=\"root_user\">\n      <span class=\"nav-header__username\">&#64;{{ user.username }}</span>\n    </m-user>\n  } @else if (_header(); as h) {\n    @if (h.label) {\n      <m-section-header class=\"nav-header__title\" [icon]=\"h.icon\" [label]=\"h.label\" />\n    }\n  }\n</m-section>\n",
-		styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.nav-header__user{display:block;padding:1rem}.nav-header__username{font-size:.6875rem;font-weight:600;color:var(--m-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}m-section-search.nav-header__search{--_nav-row-height: var(--section-header-min-height, calc(var(--section-header-py, .5rem) * 2 + 1.25rem));min-height:var(--_nav-row-height);padding-block:0;--m-input-clear-height: calc(var(--_nav-row-height) - .5rem);--m-input-clear-min-height: calc(var(--_nav-row-height) - .5rem)}\n"],
+		template: "<m-section>\n  @if (_isSearch() && _searchOpen()) {\n    <!-- Searching: the field takes the row the trail was on, so the nav is\n         hidden while there is something to type into. -->\n    <m-section-search\n      class=\"nav-header__search\"\n      [(isOpen)]=\"_searchOpen\"\n      [value]=\"_searchStore.query()\"\n      [searchLabel]=\"_searchLabel()\"\n      (searchChange)=\"_searchStore.updateQuery($event)\"\n    />\n  } @else if (_trail() || _isSearch()) {\n    <!-- The nav's row, and the bar's toggle stands in it rather than in a row\n         stacked on top of it. Both slots are written a single `@if` deep: a\n         Section matches its projected slots by tag, and a node nested deeper\n         falls through to the body instead. -->\n    <m-section-back [back]=\"_hasParent()\" (navigate)=\"_navStore.back()\">\n      @if (_trail(); as trail) {\n        <m-nav-trail [config]=\"trail\" />\n      }\n      @if (_isSearch()) {\n        <m-button\n          class=\"nav-header__search-toggle\"\n          [config]=\"_searchToggle\"\n          (clicked)=\"_openSearch()\"\n        />\n      }\n    </m-section-back>\n  }\n\n  @if (_user(); as user) {\n    <m-user class=\"nav-header__user\" [id]=\"user.id\" [user]=\"user\" mRef=\"root_user\">\n      <span class=\"nav-header__username\">&#64;{{ user.username }}</span>\n    </m-user>\n  } @else if (_header(); as h) {\n    @if (h.label) {\n      @if (h.appLogo; as logo) {\n        <!-- A mounted app's header draws its AppLogo in the icon's place. -->\n        <m-section-header class=\"nav-header__title\" [label]=\"h.label\">\n          <m-app-logo class=\"nav-header__app-logo\" [glyph]=\"logo.glyph\" [appColor]=\"logo.color\" [name]=\"logo.name\" />\n        </m-section-header>\n      } @else {\n        <m-section-header class=\"nav-header__title\" [icon]=\"h.icon\" [label]=\"h.label\" />\n      }\n    }\n  }\n</m-section>\n",
+		styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.nav-header__user{display:block;padding:1rem}.nav-header__username{font-size:.6875rem;font-weight:600;color:var(--m-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}m-section-search.nav-header__search{--_nav-row-height: var(--section-header-min-height, calc(var(--section-header-py, .5rem) * 2 + 1.25rem));min-height:var(--_nav-row-height);padding-block:0;--m-input-clear-height: calc(var(--_nav-row-height) - .5rem);--m-input-clear-min-height: calc(var(--_nav-row-height) - .5rem)}.nav-header__title .nav-header__app-logo{flex-shrink:0;align-self:flex-start;width:var(--m-section-header-icon-box, 1.5125rem);height:var(--m-section-header-icon-box, 1.5125rem)}\n"],
 		dependencies: [
 			{
 				kind: "component",
@@ -41267,6 +41562,20 @@ var NavHeaderComponent = class NavHeaderComponent {
 					"mRefToggle",
 					"mRefParams"
 				]
+			},
+			{
+				kind: "component",
+				type: AppLogoComponent,
+				selector: "m-app-logo",
+				inputs: [
+					"glyph",
+					"appColor",
+					"name",
+					"link",
+					"variant",
+					"tone",
+					"size"
+				]
 			}
 		],
 		changeDetection: i0.ChangeDetectionStrategy.OnPush,
@@ -41290,7 +41599,8 @@ i0.ɵɵngDeclareClassMetadata({
 				SectionSearchComponent,
 				ButtonComponent,
 				UserComponent,
-				MRefDirective
+				MRefDirective,
+				AppLogoComponent
 			],
 			encapsulation: ViewEncapsulation.None,
 			changeDetection: ChangeDetectionStrategy.OnPush,
@@ -41299,8 +41609,8 @@ i0.ɵɵngDeclareClassMetadata({
 				"[style.display]": "\"block\"",
 				"[style.--m-section-min-height]": "\"0\""
 			},
-			template: "<m-section>\n  @if (_isSearch() && _searchOpen()) {\n    <!-- Searching: the field takes the row the trail was on, so the nav is\n         hidden while there is something to type into. -->\n    <m-section-search\n      class=\"nav-header__search\"\n      [(isOpen)]=\"_searchOpen\"\n      [value]=\"_searchStore.query()\"\n      [searchLabel]=\"_searchLabel()\"\n      (searchChange)=\"_searchStore.updateQuery($event)\"\n    />\n  } @else if (_trail() || _isSearch()) {\n    <!-- The nav's row, and the bar's toggle stands in it rather than in a row\n         stacked on top of it. Both slots are written a single `@if` deep: a\n         Section matches its projected slots by tag, and a node nested deeper\n         falls through to the body instead. -->\n    <m-section-back [back]=\"_hasParent()\" (navigate)=\"_navStore.back()\">\n      @if (_trail(); as trail) {\n        <m-nav-trail [config]=\"trail\" />\n      }\n      @if (_isSearch()) {\n        <m-button\n          class=\"nav-header__search-toggle\"\n          [config]=\"_searchToggle\"\n          (clicked)=\"_openSearch()\"\n        />\n      }\n    </m-section-back>\n  }\n\n  @if (_user(); as user) {\n    <m-user class=\"nav-header__user\" [id]=\"user.id\" [user]=\"user\" mRef=\"root_user\">\n      <span class=\"nav-header__username\">&#64;{{ user.username }}</span>\n    </m-user>\n  } @else if (_header(); as h) {\n    @if (h.label) {\n      <m-section-header class=\"nav-header__title\" [icon]=\"h.icon\" [label]=\"h.label\" />\n    }\n  }\n</m-section>\n",
-			styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.nav-header__user{display:block;padding:1rem}.nav-header__username{font-size:.6875rem;font-weight:600;color:var(--m-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}m-section-search.nav-header__search{--_nav-row-height: var(--section-header-min-height, calc(var(--section-header-py, .5rem) * 2 + 1.25rem));min-height:var(--_nav-row-height);padding-block:0;--m-input-clear-height: calc(var(--_nav-row-height) - .5rem);--m-input-clear-min-height: calc(var(--_nav-row-height) - .5rem)}\n"]
+			template: "<m-section>\n  @if (_isSearch() && _searchOpen()) {\n    <!-- Searching: the field takes the row the trail was on, so the nav is\n         hidden while there is something to type into. -->\n    <m-section-search\n      class=\"nav-header__search\"\n      [(isOpen)]=\"_searchOpen\"\n      [value]=\"_searchStore.query()\"\n      [searchLabel]=\"_searchLabel()\"\n      (searchChange)=\"_searchStore.updateQuery($event)\"\n    />\n  } @else if (_trail() || _isSearch()) {\n    <!-- The nav's row, and the bar's toggle stands in it rather than in a row\n         stacked on top of it. Both slots are written a single `@if` deep: a\n         Section matches its projected slots by tag, and a node nested deeper\n         falls through to the body instead. -->\n    <m-section-back [back]=\"_hasParent()\" (navigate)=\"_navStore.back()\">\n      @if (_trail(); as trail) {\n        <m-nav-trail [config]=\"trail\" />\n      }\n      @if (_isSearch()) {\n        <m-button\n          class=\"nav-header__search-toggle\"\n          [config]=\"_searchToggle\"\n          (clicked)=\"_openSearch()\"\n        />\n      }\n    </m-section-back>\n  }\n\n  @if (_user(); as user) {\n    <m-user class=\"nav-header__user\" [id]=\"user.id\" [user]=\"user\" mRef=\"root_user\">\n      <span class=\"nav-header__username\">&#64;{{ user.username }}</span>\n    </m-user>\n  } @else if (_header(); as h) {\n    @if (h.label) {\n      @if (h.appLogo; as logo) {\n        <!-- A mounted app's header draws its AppLogo in the icon's place. -->\n        <m-section-header class=\"nav-header__title\" [label]=\"h.label\">\n          <m-app-logo class=\"nav-header__app-logo\" [glyph]=\"logo.glyph\" [appColor]=\"logo.color\" [name]=\"logo.name\" />\n        </m-section-header>\n      } @else {\n        <m-section-header class=\"nav-header__title\" [icon]=\"h.icon\" [label]=\"h.label\" />\n      }\n    }\n  }\n</m-section>\n",
+			styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}.nav-header__user{display:block;padding:1rem}.nav-header__username{font-size:.6875rem;font-weight:600;color:var(--m-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}m-section-search.nav-header__search{--_nav-row-height: var(--section-header-min-height, calc(var(--section-header-py, .5rem) * 2 + 1.25rem));min-height:var(--_nav-row-height);padding-block:0;--m-input-clear-height: calc(var(--_nav-row-height) - .5rem);--m-input-clear-min-height: calc(var(--_nav-row-height) - .5rem)}.nav-header__title .nav-header__app-logo{flex-shrink:0;align-self:flex-start;width:var(--m-section-header-icon-box, 1.5125rem);height:var(--m-section-header-icon-box, 1.5125rem)}\n"]
 		}]
 	}],
 	ctorParameters: () => []
@@ -41406,6 +41716,14 @@ var NavMenuComponent = class NavMenuComponent {
 		},
 		ngImport: i0,
 		template: `
+    <!-- A row standing for a mounted app draws its AppLogo, else its icon. -->
+    <ng-template #iconTemplate let-item>
+      @if (item.appLogo; as logo) {
+        <m-app-logo class="nav-menu__app-logo" [glyph]="logo.glyph" [appColor]="logo.color" [name]="logo.name" />
+      } @else {
+        <m-icon [name]="item.icon || 'menu'" [baseUrl]="baseUrl()" />
+      }
+    </ng-template>
     <ng-template #menuTemplate let-item="row">
       <div class="nav-menu__item">
         @if (item.nav; as nav) {
@@ -41419,7 +41737,7 @@ var NavMenuComponent = class NavMenuComponent {
             class="nav-menu__link"
           >
             <span class="nav-menu__icon">
-              <m-icon [name]="item.icon || 'menu'" [baseUrl]="baseUrl()" />
+              <ng-container *ngTemplateOutlet="iconTemplate; context: { $implicit: item }" />
             </span>
             <span class="nav-menu__label">{{ item.label | translate }}</span>
           </a>
@@ -41437,13 +41755,13 @@ var NavMenuComponent = class NavMenuComponent {
         } @else if (item.href; as href) {
           <a [href]="href" class="nav-menu__link">
             <span class="nav-menu__icon">
-              <m-icon [name]="item.icon || 'menu'" [baseUrl]="baseUrl()" />
+              <ng-container *ngTemplateOutlet="iconTemplate; context: { $implicit: item }" />
             </span>
             <span class="nav-menu__label">{{ item.label | translate }}</span>
           </a>
         } @else {
           <span class="nav-menu__icon">
-            <m-icon [name]="item.icon || 'menu'" [baseUrl]="baseUrl()" />
+            <ng-container *ngTemplateOutlet="iconTemplate; context: { $implicit: item }" />
           </span>
           <span class="nav-menu__label">
             <span class="nav-menu__text">{{ item.label | translate }}</span>
@@ -41456,8 +41774,18 @@ var NavMenuComponent = class NavMenuComponent {
     </div>
   `,
 		isInline: true,
-		styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:block;width:100%}.nav-menu{padding:0;margin:0}.nav-menu ul{display:flex;flex-direction:column;gap:0;padding:0;margin:0}.nav-menu li{padding:0;list-style:none;width:100%;border-bottom:1px solid rgba(0,0,0,.02)}.nav-menu li:last-child{border-bottom:none}.nav-menu__item{display:flex;align-items:center;gap:.75rem;width:100%;position:relative;color:var(--m-text-secondary);background:transparent}.nav-menu__item:not(:has(.nav-menu__link)){padding:.625rem 1rem}.nav-menu__link{display:flex;align-items:center;gap:.75rem;padding:.625rem 1rem;border-radius:0;transition:all .15s cubic-bezier(.4,0,.2,1);cursor:pointer;width:100%;color:inherit;text-decoration:none}.nav-menu__link:hover{background:#00000008;color:var(--m-text)}.nav-menu__link:hover .nav-menu__icon{color:var(--m-text)}.nav-menu__link:hover .nav-menu__label{color:var(--m-text);font-weight:600}.nav-menu__browse{flex:none;margin-inline-end:.5rem;color:var(--m-text-tertiary)}.nav-menu__icon{display:flex;align-items:center;justify-content:center;color:var(--m-text-tertiary);transition:color .15s ease;width:1.15rem;height:1.15rem}.nav-menu__icon .m-icon{display:flex;align-items:center}.nav-menu__label{flex:1;display:block;width:100%;font-size:.8125rem;font-weight:500;letter-spacing:.01em;color:inherit;text-decoration:none}.nav-menu__item:has(.active){background:linear-gradient(90deg,color-mix(in srgb,var(--m-mm) 6%,transparent) 0%,color-mix(in srgb,var(--m-mm) 2%,transparent) 60%,transparent 100%);color:var(--m-mm);border-radius:0}.nav-menu__item:has(.active):after{content:\"\";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.3) 0%,rgba(255,255,255,.05) 50%,transparent 100%);z-index:3}.nav-menu__item:has(.active) .nav-menu__icon{color:var(--m-mm);filter:drop-shadow(0 0 3px color-mix(in srgb,var(--m-mm) 20%,transparent))}.nav-menu__item:has(.active) .nav-menu__label{color:var(--m-mm);font-weight:700;letter-spacing:.015em}\n"],
+		styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:block;width:100%}.nav-menu{padding:0;margin:0}.nav-menu ul{display:flex;flex-direction:column;gap:0;padding:0;margin:0}.nav-menu li{padding:0;list-style:none;width:100%;border-bottom:1px solid rgba(0,0,0,.02)}.nav-menu li:last-child{border-bottom:none}.nav-menu__item{display:flex;align-items:center;gap:.75rem;width:100%;position:relative;color:var(--m-text-secondary);background:transparent}.nav-menu__item:not(:has(.nav-menu__link)){padding:.625rem 1rem}.nav-menu__link{display:flex;align-items:center;gap:.75rem;padding:.625rem 1rem;border-radius:0;transition:all .15s cubic-bezier(.4,0,.2,1);cursor:pointer;width:100%;color:inherit;text-decoration:none}.nav-menu__link:hover{background:#00000008;color:var(--m-text)}.nav-menu__link:hover .nav-menu__icon{color:var(--m-text)}.nav-menu__link:hover .nav-menu__label{color:var(--m-text);font-weight:600}.nav-menu__browse{flex:none;margin-inline-end:.5rem;color:var(--m-text-tertiary)}.nav-menu__icon{display:flex;align-items:center;justify-content:center;color:var(--m-text-tertiary);transition:color .15s ease;width:1.15rem;height:1.15rem}.nav-menu__app-logo{display:block;width:100%;height:100%}.nav-menu__icon .m-icon{display:flex;align-items:center}.nav-menu__label{flex:1;display:block;width:100%;font-size:.8125rem;font-weight:500;letter-spacing:.01em;color:inherit;text-decoration:none}.nav-menu__item:has(.active){background:linear-gradient(90deg,color-mix(in srgb,var(--m-mm) 6%,transparent) 0%,color-mix(in srgb,var(--m-mm) 2%,transparent) 60%,transparent 100%);color:var(--m-mm);border-radius:0}.nav-menu__item:has(.active):after{content:\"\";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.3) 0%,rgba(255,255,255,.05) 50%,transparent 100%);z-index:3}.nav-menu__item:has(.active) .nav-menu__icon{color:var(--m-mm);filter:drop-shadow(0 0 3px color-mix(in srgb,var(--m-mm) 20%,transparent))}.nav-menu__item:has(.active) .nav-menu__label{color:var(--m-mm);font-weight:700;letter-spacing:.015em}\n"],
 		dependencies: [
+			{
+				kind: "directive",
+				type: NgTemplateOutlet,
+				selector: "[ngTemplateOutlet]",
+				inputs: [
+					"ngTemplateOutletContext",
+					"ngTemplateOutlet",
+					"ngTemplateOutletInjector"
+				]
+			},
 			{
 				kind: "component",
 				type: IconComponent,
@@ -41474,6 +41802,20 @@ var NavMenuComponent = class NavMenuComponent {
 				],
 				outputs: ["configChange"]
 			},
+			{
+				kind: "component",
+				type: AppLogoComponent,
+				selector: "m-app-logo",
+				inputs: [
+					"glyph",
+					"appColor",
+					"name",
+					"link",
+					"variant",
+					"tone",
+					"size"
+				]
+			},
 			{
 				kind: "directive",
 				type: MRefDirective,
@@ -41555,6 +41897,14 @@ i0.ɵɵngDeclareClassMetadata({
 		args: [{
 			selector: "m-nav-menu",
 			template: `
+    <!-- A row standing for a mounted app draws its AppLogo, else its icon. -->
+    <ng-template #iconTemplate let-item>
+      @if (item.appLogo; as logo) {
+        <m-app-logo class="nav-menu__app-logo" [glyph]="logo.glyph" [appColor]="logo.color" [name]="logo.name" />
+      } @else {
+        <m-icon [name]="item.icon || 'menu'" [baseUrl]="baseUrl()" />
+      }
+    </ng-template>
     <ng-template #menuTemplate let-item="row">
       <div class="nav-menu__item">
         @if (item.nav; as nav) {
@@ -41568,7 +41918,7 @@ i0.ɵɵngDeclareClassMetadata({
             class="nav-menu__link"
           >
             <span class="nav-menu__icon">
-              <m-icon [name]="item.icon || 'menu'" [baseUrl]="baseUrl()" />
+              <ng-container *ngTemplateOutlet="iconTemplate; context: { $implicit: item }" />
             </span>
             <span class="nav-menu__label">{{ item.label | translate }}</span>
           </a>
@@ -41586,13 +41936,13 @@ i0.ɵɵngDeclareClassMetadata({
         } @else if (item.href; as href) {
           <a [href]="href" class="nav-menu__link">
             <span class="nav-menu__icon">
-              <m-icon [name]="item.icon || 'menu'" [baseUrl]="baseUrl()" />
+              <ng-container *ngTemplateOutlet="iconTemplate; context: { $implicit: item }" />
             </span>
             <span class="nav-menu__label">{{ item.label | translate }}</span>
           </a>
         } @else {
           <span class="nav-menu__icon">
-            <m-icon [name]="item.icon || 'menu'" [baseUrl]="baseUrl()" />
+            <ng-container *ngTemplateOutlet="iconTemplate; context: { $implicit: item }" />
           </span>
           <span class="nav-menu__label">
             <span class="nav-menu__text">{{ item.label | translate }}</span>
@@ -41606,13 +41956,15 @@ i0.ɵɵngDeclareClassMetadata({
   `,
 			changeDetection: ChangeDetectionStrategy.OnPush,
 			imports: [
+				NgTemplateOutlet,
 				IconComponent,
+				AppLogoComponent,
 				MRefDirective,
 				TranslatePipe,
 				ListComponent,
 				ButtonComponent
 			],
-			styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:block;width:100%}.nav-menu{padding:0;margin:0}.nav-menu ul{display:flex;flex-direction:column;gap:0;padding:0;margin:0}.nav-menu li{padding:0;list-style:none;width:100%;border-bottom:1px solid rgba(0,0,0,.02)}.nav-menu li:last-child{border-bottom:none}.nav-menu__item{display:flex;align-items:center;gap:.75rem;width:100%;position:relative;color:var(--m-text-secondary);background:transparent}.nav-menu__item:not(:has(.nav-menu__link)){padding:.625rem 1rem}.nav-menu__link{display:flex;align-items:center;gap:.75rem;padding:.625rem 1rem;border-radius:0;transition:all .15s cubic-bezier(.4,0,.2,1);cursor:pointer;width:100%;color:inherit;text-decoration:none}.nav-menu__link:hover{background:#00000008;color:var(--m-text)}.nav-menu__link:hover .nav-menu__icon{color:var(--m-text)}.nav-menu__link:hover .nav-menu__label{color:var(--m-text);font-weight:600}.nav-menu__browse{flex:none;margin-inline-end:.5rem;color:var(--m-text-tertiary)}.nav-menu__icon{display:flex;align-items:center;justify-content:center;color:var(--m-text-tertiary);transition:color .15s ease;width:1.15rem;height:1.15rem}.nav-menu__icon .m-icon{display:flex;align-items:center}.nav-menu__label{flex:1;display:block;width:100%;font-size:.8125rem;font-weight:500;letter-spacing:.01em;color:inherit;text-decoration:none}.nav-menu__item:has(.active){background:linear-gradient(90deg,color-mix(in srgb,var(--m-mm) 6%,transparent) 0%,color-mix(in srgb,var(--m-mm) 2%,transparent) 60%,transparent 100%);color:var(--m-mm);border-radius:0}.nav-menu__item:has(.active):after{content:\"\";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.3) 0%,rgba(255,255,255,.05) 50%,transparent 100%);z-index:3}.nav-menu__item:has(.active) .nav-menu__icon{color:var(--m-mm);filter:drop-shadow(0 0 3px color-mix(in srgb,var(--m-mm) 20%,transparent))}.nav-menu__item:has(.active) .nav-menu__label{color:var(--m-mm);font-weight:700;letter-spacing:.015em}\n"]
+			styles: ["@keyframes toggle-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes thumb-slide{0%{transform:translate(0) scale(1)}50%{transform:translate(.3em) scale(.9)}to{transform:translate(.6em) scale(1)}}:host{display:block;width:100%}.nav-menu{padding:0;margin:0}.nav-menu ul{display:flex;flex-direction:column;gap:0;padding:0;margin:0}.nav-menu li{padding:0;list-style:none;width:100%;border-bottom:1px solid rgba(0,0,0,.02)}.nav-menu li:last-child{border-bottom:none}.nav-menu__item{display:flex;align-items:center;gap:.75rem;width:100%;position:relative;color:var(--m-text-secondary);background:transparent}.nav-menu__item:not(:has(.nav-menu__link)){padding:.625rem 1rem}.nav-menu__link{display:flex;align-items:center;gap:.75rem;padding:.625rem 1rem;border-radius:0;transition:all .15s cubic-bezier(.4,0,.2,1);cursor:pointer;width:100%;color:inherit;text-decoration:none}.nav-menu__link:hover{background:#00000008;color:var(--m-text)}.nav-menu__link:hover .nav-menu__icon{color:var(--m-text)}.nav-menu__link:hover .nav-menu__label{color:var(--m-text);font-weight:600}.nav-menu__browse{flex:none;margin-inline-end:.5rem;color:var(--m-text-tertiary)}.nav-menu__icon{display:flex;align-items:center;justify-content:center;color:var(--m-text-tertiary);transition:color .15s ease;width:1.15rem;height:1.15rem}.nav-menu__app-logo{display:block;width:100%;height:100%}.nav-menu__icon .m-icon{display:flex;align-items:center}.nav-menu__label{flex:1;display:block;width:100%;font-size:.8125rem;font-weight:500;letter-spacing:.01em;color:inherit;text-decoration:none}.nav-menu__item:has(.active){background:linear-gradient(90deg,color-mix(in srgb,var(--m-mm) 6%,transparent) 0%,color-mix(in srgb,var(--m-mm) 2%,transparent) 60%,transparent 100%);color:var(--m-mm);border-radius:0}.nav-menu__item:has(.active):after{content:\"\";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.3) 0%,rgba(255,255,255,.05) 50%,transparent 100%);z-index:3}.nav-menu__item:has(.active) .nav-menu__icon{color:var(--m-mm);filter:drop-shadow(0 0 3px color-mix(in srgb,var(--m-mm) 20%,transparent))}.nav-menu__item:has(.active) .nav-menu__label{color:var(--m-mm);font-weight:700;letter-spacing:.015em}\n"]
 		}]
 	}],
 	propDecorators: {
@@ -42398,7 +42750,11 @@ var NavComponent = class NavComponent {
 				inputs: [
 					"glyph",
 					"appColor",
-					"name"
+					"name",
+					"link",
+					"variant",
+					"tone",
+					"size"
 				]
 			}
 		],
@@ -46182,6 +46538,14 @@ function provideMagWcConfig(options) {
 			provide: NavStore,
 			useFactory: () => SharedStoreRegistry.getNavStore() || SharedStoreRegistry.getHostInjector()?.get(NavStore, null) || null
 		},
+		{
+			provide: AppLogoState,
+			useFactory: () => SharedStoreRegistry.getAppLogoState() ?? new AppLogoState()
+		},
+		{
+			provide: APP_THEME_COLOR,
+			useFactory: appThemeColorFactory
+		},
 		{
 			provide: MODAL_STORE_REF,
 			useFactory: () => {
@@ -46382,6 +46746,14 @@ function provideMagAppConfig(options) {
 			provide: NavStore,
 			useFactory: () => SharedStoreRegistry.getNavStore() || SharedStoreRegistry.getHostInjector()?.get(NavStore, null) || new NavStore()
 		},
+		{
+			provide: AppLogoState,
+			useFactory: () => SharedStoreRegistry.getAppLogoState() ?? new AppLogoState()
+		},
+		{
+			provide: APP_THEME_COLOR,
+			useFactory: appThemeColorFactory
+		},
 		{
 			provide: NAV_STORE_REF,
 			useFactory: (localStore) => SharedStoreRegistry.getNavStore() || SharedStoreRegistry.getHostInjector()?.get(NAV_STORE_REF, null) || localStore,
@@ -46401,6 +46773,11 @@ function provideMagAppConfig(options) {
 			provide: APP_CONTEXT_REF,
 			useFactory: provideAppContext
 		},
+		provideAppInitializer(() => {
+			const color = inject(APP_THEME_COLOR);
+			const body = inject(DOCUMENT).body;
+			effect(() => paintAppColor(body, color()));
+		}),
 		provideAppInitializer(() => {
 			inject(APP_CONTEXT_REF);
 		}),
@@ -46459,6 +46836,60 @@ function bootstrapMagApp(routesOrOptions, maybeOptions) {
       `;
 	});
 }
+const SPLASH_ID = "m-splash";
+const escapeHtml = (value) => value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+const splashHtml = ({ appColor, glyph, link }) => {
+	const color = normalizeAppColor(appColor) ?? "#0f172a";
+	const mark = glyph?.trim() ? `<div class="${SPLASH_ID}__glyph"></div>` : `<div class="${SPLASH_ID}__letter">${escapeHtml(link.trim().charAt(0).toUpperCase())}</div>`;
+	const mask = glyph?.trim() ? `
+        #${SPLASH_ID} .${SPLASH_ID}__glyph {
+          width: 100%;
+          height: 100%;
+          background: #fff;
+          -webkit-mask: ${logoGlyphMaskUrl(glyph.trim())} center / contain no-repeat;
+          mask: ${logoGlyphMaskUrl(glyph.trim())} center / contain no-repeat;
+        }` : "";
+	return `    <div id="${SPLASH_ID}">
+      <div class="${SPLASH_ID}__mark" aria-hidden="true">${mark}</div>
+      <style>
+        #${SPLASH_ID} {
+          position: fixed;
+          inset: 0;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          background: ${color};
+          z-index: 99999;
+          transition: opacity 0.35s ease, visibility 0.35s ease;
+        }
+        #${SPLASH_ID}.hidden {
+          opacity: 0;
+          visibility: hidden;
+          pointer-events: none;
+        }
+        #${SPLASH_ID} .${SPLASH_ID}__mark {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          width: 72px;
+          height: 72px;
+          animation: m-splash-breathe 1.6s ease-in-out infinite;
+        }${mask}
+        #${SPLASH_ID} .${SPLASH_ID}__letter {
+          color: #fff;
+          font: 700 56px/1 system-ui, sans-serif;
+        }
+        @keyframes m-splash-breathe {
+          0%, 100% { opacity: 1; transform: scale(1); }
+          50%       { opacity: 0.55; transform: scale(0.93); }
+        }
+        @media (prefers-reduced-motion: reduce) {
+          #${SPLASH_ID} .${SPLASH_ID}__mark { animation: none; }
+        }
+      </style>
+    </div>
+`;
+};
 var Domain;
 (function(Domain) {
 	Domain["AUTH"] = "auth";
@@ -49831,7 +50262,11 @@ var AppTileComponent = class AppTileComponent {
 				inputs: [
 					"glyph",
 					"appColor",
-					"name"
+					"name",
+					"link",
+					"variant",
+					"tone",
+					"size"
 				]
 			},
 			{
@@ -50586,6 +51021,6 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
-export { ACCESS_DOMAINS, APP_CONTEXT_REF, APP_LINK, APP_LOGO_ICON, APP_LOGO_SOURCE, ASSET_BASE_URL, AUDIENCE_ICONS, AUDIENCE_LEVELS, AccordionBodyDirective, AccordionComponent, AccordionGroupComponent, ActionComponent, AnimatedGraphsComponent, AppAvailability, AppCardComponent, AppIdentityService, AppLogoComponent, AppLogoState, AppRelationType, AppTileComponent, AssetStore, AssetUrlPipe, Assets, AudiencePickerBoxComponent, AudiencePickerComponent, AuthActivityPageComponent, AuthApiService, AuthStore, AutosizeDirective, BadgeComponent, BandingComponent, BaseArrayInputComponent, BaseRootWebComponent, BaseWebComponent, BrowserLocaleService, ButtonComponent, ButtonGroupComponent, CALLING_APP_HEADER, COMPONENT_INPUT_REGISTRY, CardComponent, CardWrapperComponent, CarouselComponent, ChartComponent, ChatBubbleComponent, CheckboxGroupComponent, CheckboxInputComponent, ClearableInputComponent, ClipboardService, ColComponent, ColorPickerInputComponent, CommentItemComponent, CommentsApiService, CommentsComponent, CommentsStore, CompactNumberPipe, ComponentInputComponent, ComponentStepperComponent, ConfigComponent, ConfirmComponent, ContextMenuComponent, CustomIconClass, CustomIconEditComponent, DEFAULT_AUDIENCE, DEFAULT_DENIAL, DEFAULT_DOC_ALIGN, DEFAULT_DOC_DENSITY, DEFAULT_DOC_VARIANT, DEFAULT_FILTER_RANGE_MODE, DEFAULT_FILTER_VARIANT, DEFAULT_NAV_PARAM, DEFAULT_NAV_SEGMENT, DEFAULT_SIZE, DOCK_MIN_PAGE_REMAINDER, DOCS_FOLDER, DOC_ACTION_ICONS, DOC_ALIGNS, DOC_DENSITIES, DOC_EDIT_ACTIONS, DOC_TOOLBAR_GROUPS, DOC_VARIANTS, DashboardCardComponent, DateInputComponent, DatePickerComponent, DeviceService, DocComponent, DocEditorComponent, DomService, Domain, DotGridComponent, DragListDirective, DragListItemDirective, DraggableDirective, DropdownInputComponent, FILTER_GROUP_CONTEXT, FILTER_RANGE_MODES, FILTER_VARIANTS, FLEX_VARIANTS, FOLDER_PICK_LISTENER, FORM_ASSET_FOLDER, FileService, FileUploadDirective, FileUploadInputComponent, FlexComponent, FlexItemComponent, FormGroupComponent, FrameComponent, FreezeService, GRID_BREAKPOINTS, GetNavService, HeaderComponent, HighlightDirective, HttpService, HttpSharingClient, ICON_SOURCE, IS_DESIGN_MODE, IS_SIDE_PANEL, IconComponent, ImgComponent, InputType, InstrumentScoreComponent, InterceptorObservables, JumbotronComponent, KeyValueComponent, LAYOUT_ASSET_FOLDER, LOADING_ACTIONS_REF, LOGIN_COMPONENT, LOGIN_STORE, LOGO_GLYPH_MAX_BYTES, LanguageComponent, ListComponent, LogoComponent, LogoGlyphInputComponent, MAG_SOCKET_EVENT, MHeroColorDirective, MHeroComponent, MODAL_REF, MODAL_STORE_REF, MOUNT_STATIC_SEGMENT, MOUNT_TOKEN, MRefDirective, MStepComponent, MURL_PARAM, MURL_SEP, ManifestEnrichmentService, MarginDirective, MenuComponent, ModalDirective, ModalRef, ModalStore, MoneyPipe, MultiRangeInputComponent, MultiselectInputComponent, MurlUrlSerializer, NAV_DEFAULT_MURL, NAV_ID_SEP, NAV_MAIN_BUTTONS, NAV_SEGMENT_RE, NAV_STORE_REF, NAV_WC_COMPONENTS, NAV_WIDGET_MAP, NavComponent, NavDetailsComponent, NavHeaderComponent, NavMenuComponent, NavStore, NavTrailComponent, NothingComponent, NotificationElementComponent, NotificationGroupComponent, NotificationPopupComponent, NotificationService, NotificationStore, NotificationType, NotificationWidgetComponent, ONE_ASSET_BASE_URL, OPTIONS_SOURCE, OVERLAY_WIDGETS, OneApp, OptionsSourceDirective, OverlayBodyComponent, OverlayRef, OverlayService, PLATFORM_BUTTON_NAV_IDS, PLATFORM_EXTENSIBLE_NAV_IDS, PLATFORM_NAV_MAP, PLATFORM_ROOT_CHILDREN, PLUGIN_FALLBACK_LANG, PLUGIN_OUTPUT_EVENT, PLUGIN_SCREENS, PaddingDirective, PaginationComponent, PanelComponent, PercentagePipe, PlaygroundComponent, PluginComponent, PluginInputComponent, PluginOutputComponent, PositionDirective, PwaInstallComponent, RECENT_SEARCH_LIMIT, REMOTE_PAGE_RELOAD, ROOT_NAV, RadioGroupComponent, RadioInputComponent, RangeInputComponent, RatingInputComponent, ReactiveElementComponent, RemoteComponent, RemoteLoaderService, ResizeElementComponent, RouteContainer, RowComponent, SEARCH_ANSWER_KEY, SEARCH_LABEL_KEY, SEARCH_QUERY, SEARCH_RESULTS_EVENT, SECTION_ACCORDION_GROUP, SECTION_FORM_CONTEXT, SECTION_TABLE_VARIANTS, SHARED_ICONS, SHARING_CLIENT, SIZE_CONTEXT, SPACING_INWARD, ScoreComponent, ScrollComponent, ScrollService, SearchPanelComponent, SearchStore, SearchUserPanelComponent, SectionAccordionDirective, SectionAccordionGroupDirective, SectionBackComponent, SectionBadgesComponent, SectionButtonGroupComponent, SectionCardComponent, SectionCarouselComponent, SectionComponent, SectionFilterComponent, SectionFilterGroupComponent, SectionFilterMenuComponent, SectionFilterPanelComponent, SectionFilterRangePanelComponent, SectionFooterComponent, SectionFormComponent, SectionFormItemComponent, SectionHeaderComponent, SectionHeroComponent, SectionPaginationComponent, SectionSearchComponent, SectionStepperComponent, SectionTableCellComponent, SectionTableComponent, SectionTableRowComponent, SectionTableSortPipe, SectionTabsComponent, SectionToggleComponent, SectionToggleItemDirective, SelectableCardInputComponent, SelectorDirective, SettingsSearchBarComponent, SettingsSearchService, ShapeComponent, SharedStoreRegistry, SidePanelDirective, Size, SocketStore, SortComponent, StatComponent, StepComponent, StepperComponent, StepsComponent, StorageService, StrokeLinecap, StrokeLinejoin, SummaryComponent, SvgGeneratorComponent, SvgGeneratorService, SvgService, TOTAL_COLUMNS, TRANSLATION_SOURCE, TableComponent, TechnicalMeterComponent, TextInputComponent, TextOutputComponent, TextareaInputComponent, ThemeComponent, ThemeDataService, ThemeService, ThemeStore, TimeAgoPipe, TimelineComponent, ToggleButtonComponent, ToggleInputComponent, ToggleRadioInputComponent, ToolTipDirective, TooltipComponent, TranslatePipe, TranslateService, TreeGridComponent, URL_SEP, USER_STORE_REF, USER_TAB_MAP, UniverseComponent, UserApiService, UserAvatarComponent, UserComponent, UserNavComponent, UserSettingsComponent, UserStore, WC_BUNDLE, WC_NAVIGATE_EVENT, WC_ROUTE_CHANGED_EVENT, WC_SEARCH_GROUPS, WIN_USER_TAB_HOOK, WIN_USER_TAB_KEY, WatermarkComponent, WcRouterStore, WrapperInputComponent, activeElementWithin, allowedCodes, anchorNavId, appLogoShadowColor, applyColorsToElement, applyDocEdit, assetOptions, baseUnderHost, bootstrapMagApp, bootstrapPwaInstall, browserLocale, buildWcBaseUrl, calculateLuminance, calculateRanks, cellText, checkDoc, checkFilterCondition, childNavId, claimDenial, classListSignal, coerceSize, cornerEdge, cornerSide, createLoadingState, createMap, createPlatformNavMap, createPluginElement, definePluginScreens, definedWcBundleOf, definedWcTierOf, deriveAvatarGradient, deriveContrastColor, deriveOppositeColor, derivePropertyName, docActionKey, docAssetCandidates, docProblemKey, docRemotePath, emailValidation, evaluate, evaluateBool, exposeScreens, exposedScreensOf, fieldBoolean, fieldNumber, fieldString, filterHoldsList, filterHoldsOneBound, filterHoldsOptions, filterHoldsRange, filterList, filterNumber, filterNumberList, filterOne, filterPanelOf, filterPanelWidth, filterRange, filterTreeGridRows, filterValueList, filterValues, flattenTreeGridRows, formatBadgeCount, fullName, generateClipPath, generateTransform, getClassList, getProperty, getScrollParent, getTierFromPreviewPath, getTreeGridRow, getUniqueId, getValue, hasErrorComputed, hexToRgb, hslToRgb, initMagmoniumApp, initialNotificationState, initialState, initials, injectAuthenticate, injectDefaultDenial, injectInstallApp, injectParentSize, injectScrollSticky, isBootRedirect, isButtonName, isCancelledComputed, isExtensiblePlatformNavId, isJson, isLightAppColor, isLoadingComputed, isLocalhost, isNavInstanceConfig, isNavMenuConfig, isNavRowsConfig, isNavVisibilityConfig, isPlatformNavId, isPlatformPanelNavId, isSize, isTierPreview, isUrlLocalhost, isValidNavId, isValidNavSegment, isWebComponent, linkToId, linkToNav, loadingActions, logoGlyphMaskUrl, mInterceptor, manualValidation, matchFieldValidation, matchMount, maxLengthValidation, maxValidation, mergePlatformNav, mergeUnique, mergeUniqueBy, mergeUniqueWith, minAgeValidation, minLengthValidation, minValidation, miniMarkToHtml, mountFor, mountPatternProblem, mountPatternText, mountSegmentOf, mountTokenOf, navIdChain, navIdFor, navIdSegment, navIdToRoutePath, navIdToSegments, navParamOf, navTailMatcher, navToId, navVisibilityGuard, nextSectionTableSort, normalizeAppColor, normalizeAssetOptions, offsetOfLine, outletPathOf, outletSegmentsOf, parentNavId, parseAddress, parseColor, parseMountPattern, parsePatternNames, patternValidation, patternsValidation, permissionRefusal, pickCount, pickSupportedLanguage, picksMembers, platformNavWidgets, pluginTag, presetDefaultOption, privateGuard, processImageToSvg, provideAppContext, provideMagAppConfig, provideMagWcConfig, provideMagWcRoutes, provideModalComponents, provideMurlUrlSerializer, provideNavWidgets, provideOverlayWidgets, providePlatformNavWidgets, providePluginRuntime, provideSearch, provideSizeContext, provideUserTabs, publicGuard, readFieldPatterns, rebuildLogoGlyph, recordDefinedWcTier, remoteOutletRoute, renderAddress, renderDocument, requiredValidation, resolveConfigAsset, resolveIconSize, resolvePallet, resolvePatternRules, resolveSize, resolveSpacing, rgbToHex, rgbToHsl, rowHasChildren, samePatterns, sectionTableColumnId, sectionTableColumnWidths, sectionTableFrozenCount, segmentsToNavId, setProperty, setTreeGridChildren, setWcLocalPort, setWcTier, settingsWidgets, shouldShowBadge, sortSectionTableRows, splitNavId, splitOnMatch, splitPath, stringToColor, tailRouteOf, toAttrBool, toAttrNumber, toCssLength, toHostNavId, toLength, toLocalNavId, toggleGroup, toggleTreeGridRow, toggleUid, unfetchedPlatformNav, ungroupedDocActions, urlValidation, wcLocalBaseOf, wcTierOf, withLevel };
+export { ACCESS_DOMAINS, APP_CONTEXT_REF, APP_LINK, APP_LOGO_ICON, APP_LOGO_SOURCE, APP_THEME_COLOR, ASSET_BASE_URL, AUDIENCE_ICONS, AUDIENCE_LEVELS, AccordionBodyDirective, AccordionComponent, AccordionGroupComponent, ActionComponent, AnimatedGraphsComponent, AppAvailability, AppCardComponent, AppIdentityService, AppLogoComponent, AppLogoState, AppRelationType, AppTileComponent, AssetStore, AssetUrlPipe, Assets, AudiencePickerBoxComponent, AudiencePickerComponent, AuthActivityPageComponent, AuthApiService, AuthStore, AutosizeDirective, BadgeComponent, BandingComponent, BaseArrayInputComponent, BaseRootWebComponent, BaseWebComponent, BrowserLocaleService, ButtonComponent, ButtonGroupComponent, CALLING_APP_HEADER, COMPONENT_INPUT_REGISTRY, CardComponent, CardWrapperComponent, CarouselComponent, ChartComponent, ChatBubbleComponent, CheckboxGroupComponent, CheckboxInputComponent, ClearableInputComponent, ClipboardService, ColComponent, ColorPickerInputComponent, CommentItemComponent, CommentsApiService, CommentsComponent, CommentsStore, CompactNumberPipe, ComponentInputComponent, ComponentStepperComponent, ConfigComponent, ConfirmComponent, ContextMenuComponent, CustomIconClass, CustomIconEditComponent, DEFAULT_AUDIENCE, DEFAULT_DENIAL, DEFAULT_DOC_ALIGN, DEFAULT_DOC_DENSITY, DEFAULT_DOC_VARIANT, DEFAULT_FILTER_RANGE_MODE, DEFAULT_FILTER_VARIANT, DEFAULT_NAV_PARAM, DEFAULT_NAV_SEGMENT, DEFAULT_SIZE, DOCK_MIN_PAGE_REMAINDER, DOCS_FOLDER, DOC_ACTION_ICONS, DOC_ALIGNS, DOC_DENSITIES, DOC_EDIT_ACTIONS, DOC_TOOLBAR_GROUPS, DOC_VARIANTS, DashboardCardComponent, DateInputComponent, DatePickerComponent, DeviceService, DocComponent, DocEditorComponent, DomService, Domain, DotGridComponent, DragListDirective, DragListItemDirective, DraggableDirective, DropdownInputComponent, FILTER_GROUP_CONTEXT, FILTER_RANGE_MODES, FILTER_VARIANTS, FLEX_VARIANTS, FOLDER_PICK_LISTENER, FORM_ASSET_FOLDER, FileService, FileUploadDirective, FileUploadInputComponent, FlexComponent, FlexItemComponent, FormGroupComponent, FrameComponent, FreezeService, GRID_BREAKPOINTS, GetNavService, HeaderComponent, HighlightDirective, HttpService, HttpSharingClient, ICON_SOURCE, IS_DESIGN_MODE, IS_SIDE_PANEL, IconComponent, ImgComponent, InputType, InstrumentScoreComponent, InterceptorObservables, JumbotronComponent, KeyValueComponent, LAYOUT_ASSET_FOLDER, LOADING_ACTIONS_REF, LOGIN_COMPONENT, LOGIN_STORE, LOGO_GLYPH_MAX_BYTES, LanguageComponent, ListComponent, LogoComponent, LogoGlyphInputComponent, MAG_SOCKET_EVENT, MHeroColorDirective, MHeroComponent, MODAL_REF, MODAL_STORE_REF, MOUNT_STATIC_SEGMENT, MOUNT_TOKEN, MRefDirective, MStepComponent, MURL_PARAM, MURL_SEP, ManifestEnrichmentService, MarginDirective, MenuComponent, ModalDirective, ModalRef, ModalStore, MoneyPipe, MultiRangeInputComponent, MultiselectInputComponent, MurlUrlSerializer, NAV_DEFAULT_MURL, NAV_ID_SEP, NAV_MAIN_BUTTONS, NAV_SEGMENT_RE, NAV_STORE_REF, NAV_WC_COMPONENTS, NAV_WIDGET_MAP, NavComponent, NavDetailsComponent, NavHeaderComponent, NavMenuComponent, NavStore, NavTrailComponent, NothingComponent, NotificationElementComponent, NotificationGroupComponent, NotificationPopupComponent, NotificationService, NotificationStore, NotificationType, NotificationWidgetComponent, ONE_ASSET_BASE_URL, OPTIONS_SOURCE, OVERLAY_WIDGETS, OneApp, OptionsSourceDirective, OverlayBodyComponent, OverlayRef, OverlayService, PLATFORM_BUTTON_NAV_IDS, PLATFORM_EXTENSIBLE_NAV_IDS, PLATFORM_NAV_MAP, PLATFORM_ROOT_CHILDREN, PLUGIN_FALLBACK_LANG, PLUGIN_OUTPUT_EVENT, PLUGIN_SCREENS, PaddingDirective, PaginationComponent, PanelComponent, PercentagePipe, PlaygroundComponent, PluginComponent, PluginInputComponent, PluginOutputComponent, PositionDirective, PwaInstallComponent, RECENT_SEARCH_LIMIT, REMOTE_BOOT_TIMEOUT_MS, REMOTE_PAGE_RELOAD, ROOT_NAV, RadioGroupComponent, RadioInputComponent, RangeInputComponent, RatingInputComponent, ReactiveElementComponent, RemoteComponent, RemoteLoaderService, ResizeElementComponent, RouteContainer, RowComponent, SEARCH_ANSWER_KEY, SEARCH_LABEL_KEY, SEARCH_QUERY, SEARCH_RESULTS_EVENT, SECTION_ACCORDION_GROUP, SECTION_FORM_CONTEXT, SECTION_TABLE_VARIANTS, SHARED_ICONS, SHARING_CLIENT, SIZE_CONTEXT, SPACING_INWARD, SPLASH_ID, ScoreComponent, ScrollComponent, ScrollService, SearchPanelComponent, SearchStore, SearchUserPanelComponent, SectionAccordionDirective, SectionAccordionGroupDirective, SectionBackComponent, SectionBadgesComponent, SectionButtonGroupComponent, SectionCardComponent, SectionCarouselComponent, SectionComponent, SectionFilterComponent, SectionFilterGroupComponent, SectionFilterMenuComponent, SectionFilterPanelComponent, SectionFilterRangePanelComponent, SectionFooterComponent, SectionFormComponent, SectionFormItemComponent, SectionHeaderComponent, SectionHeroComponent, SectionPaginationComponent, SectionSearchComponent, SectionStepperComponent, SectionTableCellComponent, SectionTableComponent, SectionTableRowComponent, SectionTableSortPipe, SectionTabsComponent, SectionToggleComponent, SectionToggleItemDirective, SelectableCardInputComponent, SelectorDirective, SettingsSearchBarComponent, SettingsSearchService, ShapeComponent, SharedStoreRegistry, SidePanelDirective, Size, SocketStore, SortComponent, StatComponent, StepComponent, StepperComponent, StepsComponent, StorageService, StrokeLinecap, StrokeLinejoin, SummaryComponent, SvgGeneratorComponent, SvgGeneratorService, SvgService, TOTAL_COLUMNS, TRANSLATION_SOURCE, TableComponent, TechnicalMeterComponent, TextInputComponent, TextOutputComponent, TextareaInputComponent, ThemeComponent, ThemeDataService, ThemeService, ThemeStore, TimeAgoPipe, TimelineComponent, ToggleButtonComponent, ToggleInputComponent, ToggleRadioInputComponent, ToolTipDirective, TooltipComponent, TranslatePipe, TranslateService, TreeGridComponent, URL_SEP, USER_STORE_REF, USER_TAB_MAP, UniverseComponent, UserApiService, UserAvatarComponent, UserComponent, UserNavComponent, UserSettingsComponent, UserStore, WC_BUNDLE, WC_NAVIGATE_EVENT, WC_ROUTE_CHANGED_EVENT, WC_SEARCH_GROUPS, WIN_USER_TAB_HOOK, WIN_USER_TAB_KEY, WatermarkComponent, WcRouterStore, WrapperInputComponent, activeElementWithin, allowedCodes, anchorNavId, appColorBrand, appLogoShadowColor, appThemeColorFactory, applyColorsToElement, applyDocEdit, assetOptions, baseUnderHost, bootstrapMagApp, bootstrapPwaInstall, browserLocale, buildWcBaseUrl, calculateLuminance, calculateRanks, cellText, checkDoc, checkFilterCondition, childNavId, claimDenial, classListSignal, coerceSize, cornerEdge, cornerSide, createLoadingState, createMap, createPlatformNavMap, createPluginElement, definePluginScreens, definedWcBundleOf, definedWcTierOf, deriveAvatarGradient, deriveContrastColor, deriveOppositeColor, derivePropertyName, docActionKey, docAssetCandidates, docProblemKey, docRemotePath, emailValidation, evaluate, evaluateBool, exposeScreens, exposedScreensOf, fieldBoolean, fieldNumber, fieldString, filterHoldsList, filterHoldsOneBound, filterHoldsOptions, filterHoldsRange, filterList, filterNumber, filterNumberList, filterOne, filterPanelOf, filterPanelWidth, filterRange, filterTreeGridRows, filterValueList, filterValues, flattenTreeGridRows, formatBadgeCount, fullName, generateClipPath, generateTransform, getClassList, getProperty, getScrollParent, getTierFromPreviewPath, getTreeGridRow, getUniqueId, getValue, hasErrorComputed, hexToRgb, hslToRgb, initMagmoniumApp, initialNotificationState, initialState, initials, injectAuthenticate, injectDefaultDenial, injectInstallApp, injectParentSize, injectScrollSticky, isBootRedirect, isButtonName, isCancelledComputed, isExtensiblePlatformNavId, isJson, isLightAppColor, isLoadingComputed, isLocalhost, isNavInstanceConfig, isNavMenuConfig, isNavRowsConfig, isNavVisibilityConfig, isPlatformNavId, isPlatformPanelNavId, isSize, isTierPreview, isUrlLocalhost, isValidNavId, isValidNavSegment, isWebComponent, linkToId, linkToNav, loadingActions, logoGlyphMaskUrl, mInterceptor, manualValidation, matchFieldValidation, matchMount, maxLengthValidation, maxValidation, mergePlatformNav, mergeUnique, mergeUniqueBy, mergeUniqueWith, minAgeValidation, minLengthValidation, minValidation, miniMarkToHtml, mountFor, mountPatternProblem, mountPatternText, mountSegmentOf, mountTokenOf, navIdChain, navIdFor, navIdSegment, navIdToRoutePath, navIdToSegments, navParamOf, navTailMatcher, navToId, navVisibilityGuard, nextSectionTableSort, normalizeAppColor, normalizeAssetOptions, offsetOfLine, outletPathOf, outletSegmentsOf, paintAppColor, parentNavId, parseAddress, parseColor, parseMountPattern, parsePatternNames, patternValidation, patternsValidation, permissionRefusal, pickCount, pickSupportedLanguage, picksMembers, platformNavWidgets, pluginTag, presetDefaultOption, privateGuard, processImageToSvg, provideAppContext, provideMagAppConfig, provideMagWcConfig, provideMagWcRoutes, provideModalComponents, provideMurlUrlSerializer, provideNavWidgets, provideOverlayWidgets, providePlatformNavWidgets, providePluginRuntime, provideSearch, provideSizeContext, provideUserTabs, publicGuard, readFieldPatterns, rebuildLogoGlyph, recordDefinedWcTier, remoteOutletRoute, renderAddress, renderDocument, requiredValidation, resolveConfigAsset, resolveIconSize, resolvePallet, resolvePatternRules, resolveSize, resolveSpacing, rgbToHex, rgbToHsl, rowHasChildren, samePatterns, sectionTableColumnId, sectionTableColumnWidths, sectionTableFrozenCount, segmentsToNavId, setProperty, setTreeGridChildren, setWcLocalPort, setWcTier, settingsWidgets, shouldShowBadge, sortSectionTableRows, splashHtml, splitNavId, splitOnMatch, splitPath, stringToColor, tailRouteOf, toAttrBool, toAttrNumber, toCssLength, toHostNavId, toLength, toLocalNavId, toggleGroup, toggleTreeGridRow, toggleUid, unfetchedPlatformNav, ungroupedDocActions, urlValidation, wcLocalBaseOf, wcTierOf, withLevel };
 
 //# sourceMappingURL=magmonium-one.mjs.map