@threadlabs/looma 0.29.18 → 0.30.1

package/vue/chunks/UiText.js

@@ -432,7 +432,7 @@ var UiText_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 		const root = useTemplateRef("@html-next/root");
 		preserveRootFocus(root);
 		checkHydratedRoot(checkedProps.value.as === "span" ? "span" : checkedProps.value.as === "div" ? "div" : checkedProps.value.as === "small" ? "small" : checkedProps.value.as === "strong" ? "strong" : checkedProps.value.as === "label" ? "label" : checkedProps.value.as === "h2" ? "h2" : checkedProps.value.as === "h3" ? "h3" : checkedProps.value.as === "h4" ? "h4" : checkedProps.value.as === "h5" ? "h5" : checkedProps.value.as === "h6" ? "h6" : "p", "ui-text");
-		/** The values the styles' :host() prop and state rules test. */
+		/** The values the styles' :host() and :state() rules test. */
 		const hostState = computed(() => [
 			checkedProps.value.grow && "grow",
 			checkedProps.value.size && "size",
@@ -698,6 +698,6 @@ var UiText_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-007f4ffd"]]);
+}), [["__scopeId", "data-v-1c015f24"]]);
 //#endregion
 export { UiText_default as t };

package/vue/chunks/UiTextarea.js

@@ -228,7 +228,7 @@ var UiTextarea_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 		});
 		const root = ref(null);
 		checkHydratedRoot("textarea", "ui-textarea");
-		/** The values the styles' :host() prop and state rules test. */
+		/** The values the styles' :host() and :state() rules test. */
 		const hostState = computed(() => [
 			checkedProps.value.size && "size",
 			checkedProps.value.size != null && `size=${encodeURIComponent(checkedProps.value.size)}`,
@@ -303,6 +303,6 @@ var UiTextarea_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-a17c3eb9"]]);
+}), [["__scopeId", "data-v-e9c54464"]]);
 //#endregion
 export { UiTextarea_default as t };

package/vue/chunks/UiToast.js

@@ -85,7 +85,7 @@ var UiToast_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE
 		const root = ref(null);
 		const actionElement = useTemplateRef("actionElement");
 		checkHydratedRoot("div", "ui-toast");
-		/** The values the styles' :host() prop and state rules test. */
+		/** The values the styles' :host() and :state() rules test. */
 		const hostState = computed(() => [checkedProps.value.tone && "tone", checkedProps.value.tone != null && `tone=${encodeURIComponent(checkedProps.value.tone)}`].filter(Boolean).join(" "));
 		const isDismissDetail = (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["id"] === "string" && (detail["reason"] === "action" || detail["reason"] === "timeout") && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => [
 			"id",
@@ -156,6 +156,6 @@ var UiToast_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-16a93365"]]);
+}), [["__scopeId", "data-v-3d934282"]]);
 //#endregion
 export { UiToast_default as t };

package/vue/chunks/UiToastRegion.js

@@ -96,7 +96,7 @@ var UiToastRegion_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @
 		const toasts = ref([]);
 		provide("html-next:ui-toast-region:toasts", toasts);
 		checkHydratedRoot("div", "ui-toast-region");
-		/** The values the styles' :host() prop and state rules test. */
+		/** The values the styles' :host() and :state() rules test. */
 		const hostState = computed(() => [checkedProps.value.placement && "placement", checkedProps.value.placement != null && `placement=${encodeURIComponent(checkedProps.value.placement)}`].filter(Boolean).join(" "));
 		const isDismissDetail = (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["id"] === "string" && (detail["reason"] === "action" || detail["reason"] === "timeout") && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => [
 			"id",
@@ -256,6 +256,6 @@ var UiToastRegion_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-4af986cc"]]);
+}), [["__scopeId", "data-v-f81961a9"]]);
 //#endregion
 export { UiToastRegion_default as t };

package/vue/chunks/UiTooltip.js

@@ -209,7 +209,7 @@ var UiTooltip_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PU
 		const internalOpen = ref(false);
 		provide("html-next:ui-tooltip:internalOpen", internalOpen);
 		checkHydratedRoot("span", "ui-tooltip");
-		/** The values the styles' :host() prop and state rules test. */
+		/** The values the styles' :host() and :state() rules test. */
 		const hostState = computed(() => [checkedProps.value.inverse && "inverse"].filter(Boolean).join(" "));
 		const isOpenDetail = (detail) => detail !== null && typeof detail === "object" && !Array.isArray(detail) && typeof detail["open"] === "boolean" && (detail["reason"] === "action" || detail["reason"] === "programmatic" || detail["reason"] === "light-dismiss" || detail["reason"] === "escape") && (detail["trigger"] === "keyboard" || detail["trigger"] === "pointer" || detail["trigger"] === "programmatic") && Object.keys(detail).every((key) => [
 			"open",
@@ -283,6 +283,6 @@ var UiTooltip_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PU
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-de7b5e63"]]);
+}), [["__scopeId", "data-v-047804e4"]]);
 //#endregion
 export { UiTooltip_default as t };

package/vue/chunks/UiTopBar.js

@@ -36,6 +36,6 @@ var UiTopBar_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PUR
 			], 16);
 		};
 	}
-}), [["__scopeId", "data-v-5f781fcb"]]);
+}), [["__scopeId", "data-v-999d7e3a"]]);
 //#endregion
 export { UiTopBar_default as t };

package/vue/chunks/UiTree.js

@@ -183,7 +183,7 @@ var UiTree_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 		const emit = __emit;
 		const root = ref(null);
 		checkHydratedRoot("div", "ui-tree");
-		/** The values the styles' :host() prop and state rules test. */
+		/** The values the styles' :host() and :state() rules test. */
 		const hostState = computed(() => [
 			checkedProps.value.marquee && "marquee",
 			checkedProps.value.density && "density",
@@ -269,6 +269,6 @@ var UiTree_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE_
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-11e6bf73"]]);
+}), [["__scopeId", "data-v-68fd9a36"]]);
 //#endregion
 export { UiTree_default as t };

package/vue/chunks/UiTreeItem.js

@@ -405,7 +405,7 @@ var UiTreeItem_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 		provide("html-next:ui-tree-item:isContainer", isContainer);
 		provide("html-next:ui-tree-item:moving", moving);
 		checkHydratedRoot("div", "ui-tree-item");
-		/** The values the styles' :host() prop and state rules test. */
+		/** The values the styles' :host() and :state() rules test. */
 		const hostState = computed(() => [
 			checkedProps.value.selected && "selected",
 			checkedProps.value.disabled && "disabled",
@@ -690,6 +690,6 @@ var UiTreeItem_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__P
 			}]]);
 		};
 	}
-}), [["__scopeId", "data-v-94992850"]]);
+}), [["__scopeId", "data-v-5bc299b7"]]);
 //#endregion
 export { UiTreeItem_default as t };

package/vue/chunks/_plugin-vue_export-helper.js

@@ -333,12 +333,13 @@ function useComponentHost(controllerLoader, options) {
 			validate: validity
 		});
 	}
+	let lastRoot = null;
 	const host = {
 		get element() {
-			return root.value;
+			return root.value ?? lastRoot;
 		},
 		get root() {
-			return root.value;
+			return root.value ?? lastRoot;
 		},
 		...controllerNamespaces({
 			state: Object.fromEntries(Object.entries(state).map(([name, value]) => [name, {
@@ -451,6 +452,7 @@ function useComponentHost(controllerLoader, options) {
 	};
 	const synchronize = () => {
 		if (unmounted) return;
+		lastRoot = root.value ?? lastRoot;
 		if (root.value?.isConnected !== true) {
 			disconnect();
 			return;
@@ -614,6 +616,14 @@ function useReflectedProp() {
 		return Array.isArray(value) && separator !== void 0 ? value.join(separator) : typeof value === "object" ? JSON.stringify(value) : String(value);
 	};
 }
+/** A scoped slot's name, which the consumer must fill with a `<template slot>` rather than plain children. */
+function useScopedSlotName() {
+	const slots = useSlots();
+	return (name) => {
+		if (slots[name] === void 0 && slots.default?.().some((node) => node.props?.slot === name)) throw diagnostic("HR007", "Scoped slot `" + name + "` requires a consumer <template slot=\"" + name + "\">.");
+		return name;
+	};
+}
 var KeyedFailure = /* @__PURE__ */ defineComponent({
 	props: { error: {
 		type: null,
@@ -1012,4 +1022,4 @@ var _plugin_vue_export_helper_default = (sfc, props) => {
 	return target;
 };
 //#endregion
-export { uniqueKeys as _, concat as a, warnUnless as b, decimalMultiply as c, list as d, math as f, text as g, preserveRootFocus as h, checkHydratedRoot as i, decimalSubtract as l, number as m, KeyedBoundary as n, createDispatch as o, nativeAttrs as p, attribute as r, cycleCheckedComputed as s, _plugin_vue_export_helper_default as t, formatValue as u, useComponentHost as v, useReflectedProp as y };
+export { uniqueKeys as _, concat as a, useScopedSlotName as b, decimalMultiply as c, list as d, math as f, text as g, preserveRootFocus as h, checkHydratedRoot as i, decimalSubtract as l, number as m, KeyedBoundary as n, createDispatch as o, nativeAttrs as p, attribute as r, cycleCheckedComputed as s, _plugin_vue_export_helper_default as t, formatValue as u, useComponentHost as v, warnUnless as x, useReflectedProp as y };

package/vue/components.css

@@ -945,12 +945,12 @@ ol:where([data-hn-ui-breadcrumbs]) {
 }
 
 /* A rounded SVG arc grows and recedes over a quiet full-circle track. */
-@keyframes ui-spinner-rotate-39d314ea {
+@keyframes ui-spinner-rotate-8edf9e1e {
 100% {
     transform: rotate(1turn);
 }
 }
-@keyframes ui-spinner-dash-39d314ea {
+@keyframes ui-spinner-dash-8edf9e1e {
 0% {
     stroke-dasharray: 1, 150;
     stroke-dashoffset: 0;
@@ -986,7 +986,7 @@ svg {
     display: block;
     inline-size: 100%;
     block-size: 100%;
-    animation: ui-spinner-rotate-39d314ea 2s linear infinite;
+    animation: ui-spinner-rotate-8edf9e1e 2s linear infinite;
 }
 circle {
     stroke-width: 3;
@@ -999,7 +999,7 @@ circle {
     stroke: currentColor;
     stroke-dasharray: 90, 150;
     stroke-dashoffset: 0;
-    animation: ui-spinner-dash-39d314ea 1.5s ease-in-out infinite;
+    animation: ui-spinner-dash-8edf9e1e 1.5s ease-in-out infinite;
 }
 @media (prefers-reduced-motion: reduce) {
 svg,.arc {
@@ -1783,7 +1783,7 @@ html[data-ui-input-modality="touch"]
 /* The label, and under it an optional line saying what the choice means. */
 
 /* Centre the tick's box and lift it slightly for the rotated check shape. */
-@keyframes ui-checkbox-check-6e1c7414 {
+@keyframes ui-checkbox-check-ecf9c529 {
 from {
     opacity: 0;
     transform: translateY(-0.09rem) rotate(45deg) scale(0.55);
@@ -1878,7 +1878,7 @@ input:checked:where([data-hn-ui-checkbox])::after {
     border-width: 0 0.125rem 0.125rem 0;
     opacity: 1;
     transform: translateY(-0.09rem) rotate(45deg);
-    animation: ui-checkbox-check-6e1c7414 180ms var(--ui-motion-ease-out, cubic-bezier(0.16, 1, 0.3, 1))
+    animation: ui-checkbox-check-ecf9c529 180ms var(--ui-motion-ease-out, cubic-bezier(0.16, 1, 0.3, 1))
       both;
 }
 input:indeterminate:where([data-hn-ui-checkbox])::after {
@@ -2807,7 +2807,8 @@ button:where([data-hn-ui-combobox]) {
 :scope:where([data-hn-ui-cover]) {
     display: flex;
     flex-direction: column;
-    align-items: center;
+    /* Safe: a child wider than the cover keeps its start edge in view instead of overflowing both ways. */
+    align-items: safe center;
     justify-content: center;
     gap: var(--ui-space-6);
     box-sizing: border-box;
@@ -2818,9 +2819,6 @@ button:where([data-hn-ui-combobox]) {
     flex: 1;
     min-block-size: 100%;
 }
-:scope > :where(:not([data-hn-ui-cover])):is(*) {
-    max-inline-size: 100%;
-}
 :scope[hidden]:where([data-hn-ui-cover]) {
     display: none;
 }
@@ -3042,13 +3040,13 @@ dd:where([data-hn-ui-description-item]) {
 /* A CSS-drawn X. */
 
 /* A touch target, like Button on coarse pointers. */
-@keyframes ui-dialog-enter-c6e7c0af {
+@keyframes ui-dialog-enter-be1feedc {
 from {
     opacity: 0;
     transform: scale(0.96);
 }
 }
-@keyframes ui-dialog-backdrop-enter-c6e7c0af {
+@keyframes ui-dialog-backdrop-enter-be1feedc {
 from {
     background-color: transparent;
 }
@@ -3096,7 +3094,7 @@ from {
     pointer-events: auto;
     opacity: 1;
     transform: scale(1);
-    animation: ui-dialog-enter-c6e7c0af var(--ui-dialog-duration, var(--ui-motion-base))
+    animation: ui-dialog-enter-be1feedc var(--ui-dialog-duration, var(--ui-motion-base))
       var(--ui-motion-ease);
 }
 :scope[data-ui-dialog-state~="size=sm"]:where([data-hn-ui-dialog]) {
@@ -3214,7 +3212,7 @@ footer:empty:where([data-hn-ui-dialog]) {
 }
 :scope[open]:modal:where([data-hn-ui-dialog])::backdrop {
     background-color: var(--ui-overlay-backdrop);
-    animation: ui-dialog-backdrop-enter-c6e7c0af var(--_ui-dialog-duration, var(--ui-motion-base))
+    animation: ui-dialog-backdrop-enter-be1feedc var(--_ui-dialog-duration, var(--ui-motion-base))
       var(--ui-motion-ease);
 }
 :scope[open][data-ui-backdrop-hidden]:where([data-hn-ui-dialog])::backdrop {
@@ -7802,12 +7800,14 @@ input:focus-visible:where([data-hn-ui-radio]) {
 /* A component that sets its display still honours the hidden attribute on its root. */
 @scope (.ui-reel) to ([data-hn]) {
 :scope:where([data-hn-ui-reel]) {
-    /* Hooks do not inherit, so the parts below read them from the root. */
-    --_ui-reel-item-width: var(--ui-reel-item-width);
-
     --_reel-gap: var(--ui-space-4);
-    --_reel-item-width: auto;
-    display: flex;
+    --_reel-item-width: max-content;
+    /* Sizes its children from its own box: one row of columns, each the item width, that never
+       shrinks to fit, so the reel scrolls once they overflow. */
+    display: grid;
+    grid-auto-flow: column;
+    grid-auto-columns: var(--ui-reel-item-width, var(--_reel-item-width));
+    justify-content: start;
     inline-size: 100%;
     gap: var(--ui-reel-gap, var(--_reel-gap));
     min-inline-size: 0;
@@ -7842,10 +7842,6 @@ input:focus-visible:where([data-hn-ui-radio]) {
 :scope:dir(rtl):where([data-hn-ui-reel]) {
     --_ui-scroll-fade-direction: to left;
 }
-:scope > :where(:not([data-hn-ui-reel])):is(*) {
-    min-inline-size: 0;
-    flex: 0 0 var(--_ui-reel-item-width, var(--_reel-item-width));
-}
 :scope[data-ui-reel-state~="gap=xs"]:where([data-hn-ui-reel]) {
     --_reel-gap: var(--ui-space-2);
 }
@@ -8801,25 +8797,25 @@ input:where([data-hn-ui-switch]),input:where([data-hn-ui-switch])::after {
 /* A component that sets its display still honours the hidden attribute on its root. */
 @scope (.ui-switcher) to ([data-hn]) {
 :scope:where([data-hn-ui-switcher]) {
-    /* Hooks do not inherit, so the parts below read them from the root. */
-    --_ui-switcher-threshold: var(--ui-switcher-threshold);
-
     --_switcher-gap: var(--ui-space-4);
-    display: flex;
-    flex-wrap: wrap;
+    --_switcher-threshold: 30rem;
+    --_switcher-track: clamp(
+      1px,
+      (var(--ui-switcher-threshold, var(--_switcher-threshold)) - 100%) * 999,
+      100%
+    );
+    /* Lays its children out from its own box: below the threshold each track takes the full width;
+       at or above it, tracks shrink to 1px so every child fits one row and empty tracks collapse.
+       The large multiplier makes the whole row flip at once. */
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(var(--_switcher-track), 1fr));
     gap: var(--ui-switcher-gap, var(--_switcher-gap));
     min-inline-size: 0;
     max-inline-size: 100%;
     margin: 0;
 }
-:scope > :where(:not([data-hn-ui-switcher])):is(*) {
-    min-inline-size: 0;
-    flex-grow: 1;
-    /* The large multiplier makes the basis flip as a group at the intrinsic threshold. */
-    flex-basis: calc((var(--_ui-switcher-threshold, 30rem) - 100%) * 999);
-}
-:scope[data-ui-switcher-state~="overLimit"] > :where(:not([data-hn-ui-switcher])):is(*) {
-    flex-basis: 100%;
+:scope[data-ui-switcher-state~="overLimit"]:where([data-hn-ui-switcher]) {
+    grid-template-columns: minmax(0, 1fr);
 }
 :scope[data-ui-switcher-state~="gap=xs"]:where([data-hn-ui-switcher]) {
     --_switcher-gap: var(--ui-space-2);
@@ -8836,26 +8832,23 @@ input:where([data-hn-ui-switch]),input:where([data-hn-ui-switch])::after {
 :scope[data-ui-switcher-state~="gap=xl"]:where([data-hn-ui-switcher]) {
     --_switcher-gap: var(--ui-space-6);
 }
-:scope[data-ui-switcher-state~="threshold=xs"]
-    > :where(:not([data-hn-ui-switcher])):is(*) {
-    flex-basis: calc((var(--_ui-switcher-threshold, 20rem) - 100%) * 999);
+:scope[data-ui-switcher-state~="threshold=xs"]:where([data-hn-ui-switcher]) {
+    --_switcher-threshold: 20rem;
 }
-:scope[data-ui-switcher-state~="threshold=md"]
-    > :where(:not([data-hn-ui-switcher])):is(*) {
-    flex-basis: calc((var(--_ui-switcher-threshold, 45rem) - 100%) * 999);
+:scope[data-ui-switcher-state~="threshold=md"]:where([data-hn-ui-switcher]) {
+    --_switcher-threshold: 45rem;
 }
-:scope[data-ui-switcher-state~="threshold=lg"]
-    > :where(:not([data-hn-ui-switcher])):is(*) {
-    flex-basis: calc((var(--_ui-switcher-threshold, 60rem) - 100%) * 999);
+:scope[data-ui-switcher-state~="threshold=lg"]:where([data-hn-ui-switcher]) {
+    --_switcher-threshold: 60rem;
 }
 :scope[data-ui-switcher-state~="align=start"]:where([data-hn-ui-switcher]) {
-    align-items: flex-start;
+    align-items: start;
 }
 :scope[data-ui-switcher-state~="align=center"]:where([data-hn-ui-switcher]) {
     align-items: center;
 }
 :scope[data-ui-switcher-state~="align=end"]:where([data-hn-ui-switcher]) {
-    align-items: flex-end;
+    align-items: end;
 }
 :scope[hidden]:where([data-hn-ui-switcher]) {
     display: none;
@@ -9438,7 +9431,7 @@ input:where([data-hn-ui-switch]),input:where([data-hn-ui-switch])::after {
 }
 
 /* Leaving slides on down and fades; the controller removes the toast when this ends. */
-@keyframes ui-toast-enter-4af986cc {
+@keyframes ui-toast-enter-f81961a9 {
 from {
     opacity: 0;
     transform: translateY(-1rem);
@@ -9448,7 +9441,7 @@ to {
     transform: translateY(0);
 }
 }
-@keyframes ui-toast-exit-4af986cc {
+@keyframes ui-toast-exit-f81961a9 {
 from {
     opacity: 1;
     transform: translateY(0);
@@ -9458,7 +9451,7 @@ to {
     transform: translateY(0.75rem);
 }
 }
-@keyframes ui-toast-enter-bottom-4af986cc {
+@keyframes ui-toast-enter-bottom-f81961a9 {
 from {
     opacity: 0;
     transform: translateY(1rem);
@@ -9468,7 +9461,7 @@ to {
     transform: translateY(0);
 }
 }
-@keyframes ui-toast-exit-bottom-4af986cc {
+@keyframes ui-toast-exit-bottom-f81961a9 {
 from {
     opacity: 1;
     transform: translateY(0);
@@ -9559,7 +9552,7 @@ to {
       --_ui-toast-region-shadow,
       var(--ui-overlay-shadow, var(--ui-elevation-overlay, var(--ui-shadow-lg)))
     );
-    animation: ui-toast-enter-4af986cc var(--_ui-toast-region-enter-duration, 0.32s)
+    animation: ui-toast-enter-f81961a9 var(--_ui-toast-region-enter-duration, 0.32s)
       var(--ui-motion-ease-out, cubic-bezier(0.16, 1, 0.3, 1)) both;
 }
 .toast[data-tone="info"]:where([data-hn-ui-toast-region]) {
@@ -9579,17 +9572,17 @@ to {
     --_ui-toast-region-tone-surface: var(--ui-danger-soft);
 }
 .toast.closing:where([data-hn-ui-toast-region]) {
-    animation: ui-toast-exit-4af986cc var(--_ui-toast-region-exit-duration, 0.22s) var(--ui-motion-ease)
+    animation: ui-toast-exit-f81961a9 var(--_ui-toast-region-exit-duration, 0.22s) var(--ui-motion-ease)
       both;
     pointer-events: none;
 }
 :is(:scope[data-ui-toast-region-state~="placement=bottom"], :scope[data-ui-toast-region-state~="placement=bottom-start"], :scope[data-ui-toast-region-state~="placement=bottom-end"])
     .toast:where([data-hn-ui-toast-region]) {
-    animation-name: ui-toast-enter-bottom-4af986cc;
+    animation-name: ui-toast-enter-bottom-f81961a9;
 }
 :is(:scope[data-ui-toast-region-state~="placement=bottom"], :scope[data-ui-toast-region-state~="placement=bottom-start"], :scope[data-ui-toast-region-state~="placement=bottom-end"])
     .toast.closing:where([data-hn-ui-toast-region]) {
-    animation-name: ui-toast-exit-bottom-4af986cc;
+    animation-name: ui-toast-exit-bottom-f81961a9;
 }
 @media (prefers-reduced-motion: reduce) {
 .toast:where([data-hn-ui-toast-region]),.toast.closing:where([data-hn-ui-toast-region]) {
@@ -9790,7 +9783,7 @@ to {
    slides, the label reaches back under the icon (the controller measures how far) with its text
    where it was, and fades out across the gap before the icon, fully gone where the icon begins
    to cover it: the name slips under the icon rather than stopping at a hard edge beside it. */
-@keyframes ui-tree-item-marquee-94992850 {
+@keyframes ui-tree-item-marquee-5bc299b7 {
 from {
     transform: translateX(0);
 }
@@ -10046,7 +10039,7 @@ to {
 .row[data-ui-marquee] > .label > .label-text:where([data-hn-ui-tree-item]) {
     /* Once per pass: the controller restarts it after a rest at the end, so the name holds still
        long enough to read rather than sliding back and forth. */
-    animation: ui-tree-item-marquee-94992850 var(--_marquee-duration) linear 0.5s 1 normal forwards;
+    animation: ui-tree-item-marquee-5bc299b7 var(--_marquee-duration) linear 0.5s 1 normal forwards;
     will-change: transform;
 }
 .row[data-ui-marquee] > .label:where([data-hn-ui-tree-item]) {
@@ -10990,7 +10983,7 @@ html[data-ui-input-modality="touch"]
   width: 3px;
   background: var(--ui-affordance-direct-color, var(--ui-accent-solid, #5b55d6));
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -11539,7 +11532,7 @@ html[data-ui-input-modality="touch"]
 
     /* A component that sets its display still honours the hidden attribute on its root. */
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -11573,7 +11566,7 @@ html[data-ui-input-modality="touch"]
 
     /* A component that sets its display still honours the hidden attribute on its root. */
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -11674,7 +11667,7 @@ html[data-ui-input-modality="touch"]
 
     /* A component that sets its display still honours the hidden attribute on its root. */
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -11805,7 +11798,7 @@ html[data-ui-input-modality="touch"]
 
     /* A component that sets its display still honours the hidden attribute on its root. */
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -11859,7 +11852,7 @@ html[data-ui-input-modality="touch"]
 
     /* A component that sets its display still honours the hidden attribute on its root. */
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -12335,7 +12328,7 @@ html[data-ui-input-modality="touch"]
 
     /* A component that sets its display still honours the hidden attribute on its root. */
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -12433,7 +12426,7 @@ html[data-ui-input-modality="touch"]
 
     /* A component that sets its display still honours the hidden attribute on its root. */
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -12597,7 +12590,7 @@ html[data-ui-input-modality="touch"]
     @media (prefers-reduced-motion: reduce) {
     }
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -12792,7 +12785,7 @@ html[data-ui-input-modality="touch"]
 
     /* A component that sets its display still honours the hidden attribute on its root. */
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -12925,7 +12918,7 @@ html[data-ui-input-modality="touch"]
     @media (prefers-reduced-motion: reduce) {
     }
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -13012,7 +13005,7 @@ html[data-ui-input-modality="touch"]
 
     /* A component that sets its display still honours the hidden attribute on its root. */
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -13166,7 +13159,7 @@ html[data-ui-input-modality="touch"]
 
     /* A component that sets its display still honours the hidden attribute on its root. */
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -13411,7 +13404,7 @@ html[data-ui-input-modality="touch"]
     @media (prefers-reduced-motion: reduce) {
     }
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -13632,7 +13625,7 @@ html[data-ui-input-modality="touch"]
 
     /* A component that sets its display still honours the hidden attribute on its root. */
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -13856,7 +13849,7 @@ html[data-ui-input-modality="touch"]
 
     /* A component that sets its display still honours the hidden attribute on its root. */
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -14067,7 +14060,7 @@ html[data-ui-input-modality="touch"]
 
     /* A component that sets its display still honours the hidden attribute on its root. */
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -14122,7 +14115,7 @@ html[data-ui-input-modality="touch"]
 
     /* The root is the hr, so the rules name :host; a bare hr matches only a descendant. */
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }
@@ -14302,7 +14295,7 @@ html[data-ui-input-modality="touch"]
 
     /* A component that sets its display still honours the hidden attribute on its root. */
 }
-/* Generated by HTML Next 1.0.0-alpha.57. Do not edit. */
+/* Generated by HTML Next 1.0.0-alpha.58. Do not edit. */
 @supports (-moz-appearance: none) {
 :where([data-component], [data-slotted]) { --html-next-scope-owner: boundary; }
 :where([data-slotted]:not([data-component])) { --html-next-scope-owner: projected !important; }