@juwel-development/design-system 4.2.0 → 4.3.0

package/dist/design-system.js

@@ -93,101 +93,113 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		gap: "region",
 		fill: !1
 	}
-}), ee = b("h-full min-h-0 min-w-0 [container-type:inline-size]"), te = b("min-w-0 grow-[calc(var(--column-layout-weight)/var(--column-layout-growth-unit))] basis-[clamp(0px,(var(--column-layout-threshold)-100%)*1000000,100%)] max-w-[var(--column-layout-maximum)]"), ne = b("relative min-w-0", {
+}), ee = b("h-full min-h-0 min-w-0 [container-type:inline-size]"), te = b("min-w-0 grow-[calc(var(--column-layout-weight)/var(--column-layout-growth-unit))] basis-[clamp(0px,(var(--column-layout-threshold)-100%)*1000000,100%)] max-w-[var(--column-layout-maximum)]", {
+	variants: { hasHead: {
+		true: "grid grid-cols-[minmax(0,1fr)] grid-rows-[auto_minmax(0,1fr)] gap-[var(--column-layout-gap)]",
+		false: ""
+	} },
+	defaultVariants: { hasHead: !1 }
+}), ne = b("min-w-0"), E = b("relative min-w-0", {
 	variants: { fill: {
 		false: "",
 		true: "h-full min-h-0"
 	} },
 	defaultVariants: { fill: !1 }
-}), E = b("pointer-events-none invisible absolute inset-x-0 top-0 h-0 overflow-hidden"), re = b("h-0 w-[clamp(0px,(var(--column-layout-threshold)-100%+var(--column-layout-reserve))*1000000,1px)]", {
+}), re = b("pointer-events-none invisible absolute inset-x-0 top-0 h-0 overflow-hidden"), ie = b("h-0 w-[clamp(0px,(var(--column-layout-threshold)-100%+var(--column-layout-reserve))*1000000,1px)]", {
 	variants: { gap: {
 		stack: "[--column-layout-gap:var(--space-stack)]",
 		region: "[--column-layout-gap:var(--space-region)]"
 	} },
 	defaultVariants: { gap: "region" }
-}), D = a(!1), ie = /^--[A-Za-z0-9_-]+$/, ae = (e, t) => {
+}), D = a(!1), ae = /^--[A-Za-z0-9_-]+$/, oe = (e, t) => {
 	let { weight: n, minWidth: r, maxWidth: i } = e.props;
 	if (!Number.isFinite(n) || n <= 0) throw new w(`column ${t + 1} needs a positive finite weight (got ${n})`);
-	if (!ie.test(r)) throw new w(`column ${t + 1} needs a custom-property name such as --main-column-min-width for minWidth (got ${JSON.stringify(r)})`);
-	if (i !== void 0 && !ie.test(i)) throw new w(`column ${t + 1} needs a custom-property name such as --support-column-max-width for maxWidth (got ${JSON.stringify(i)})`);
+	if (!ae.test(r)) throw new w(`column ${t + 1} needs a custom-property name such as --main-column-min-width for minWidth (got ${JSON.stringify(r)})`);
+	if (i !== void 0 && !ae.test(i)) throw new w(`column ${t + 1} needs a custom-property name such as --support-column-max-width for maxWidth (got ${JSON.stringify(i)})`);
 	return {
 		weight: n,
 		minWidth: r,
 		maxWidth: i
 	};
-}, oe = (e) => {
+}, O = (e) => {
 	let t = e.reduce((e, t) => e + t.weight, 0), n = e.map((e) => `var(${e.minWidth}) * ${t / e.weight}`);
 	return `calc(${e.length - 1} * var(--column-layout-gap) + max(${n.join(", ")}))`;
-}, O = (e) => e.some((e) => e.maxWidth !== void 0) ? Math.min(1, ...e.map((e) => e.weight)) : 1, k = (e) => o(e) && e.type === i, A = (e) => o(e) && e.type === P, j = (e) => r.toArray(e).flatMap((e) => k(e) ? j(e.props.children) : A(e) ? [e] : []), M = (e) => r.map(e, (e) => k(e) ? /* @__PURE__ */ t(i, { children: M(e.props.children) }) : A(e) ? /* @__PURE__ */ t(D.Provider, {
+}, se = (e) => e.some((e) => e.maxWidth !== void 0) ? Math.min(1, ...e.map((e) => e.weight)) : 1, k = (e) => o(e) && e.type === i, A = (e) => o(e) && e.type === P, j = (e) => r.toArray(e).flatMap((e) => k(e) ? j(e.props.children) : A(e) ? [e] : []), M = (e) => r.map(e, (e) => k(e) ? /* @__PURE__ */ t(i, { children: M(e.props.children) }) : A(e) ? /* @__PURE__ */ t(D.Provider, {
 	value: !0,
 	children: e
 }) : e), N = ({ gap: e, fill: n, children: r, testId: i }) => {
-	let a = j(r).map(ae), o = a.length === 0 ? void 0 : {
-		"--column-layout-threshold": oe(a),
-		"--column-layout-growth-unit": O(a)
+	let a = j(r).map(oe), o = a.length === 0 ? void 0 : {
+		"--column-layout-threshold": O(a),
+		"--column-layout-growth-unit": se(a)
 	}, s = /* @__PURE__ */ t("div", {
 		className: T({
 			gap: e,
 			fill: n
 		}),
 		style: o,
+		"data-height-passing": n || void 0,
 		"data-testid": i,
 		children: M(r)
 	});
 	return n ? /* @__PURE__ */ t("div", {
 		className: ee(),
+		"data-height-passing": !0,
 		children: s
 	}) : s;
-}, P = ({ weight: e, maxWidth: n, children: r, testId: i }) => {
+}, P = ({ weight: e, maxWidth: r, head: i, children: a, testId: o }) => {
 	if (!c(D)) throw new C();
-	let a = {
+	let s = {
 		"--column-layout-weight": e,
-		"--column-layout-maximum": n === void 0 ? "none" : `max(var(${n}), clamp(0px, (var(--column-layout-threshold) - 100%) * 1000000, 100%))`
-	};
+		"--column-layout-maximum": r === void 0 ? "none" : `max(var(${r}), clamp(0px, (var(--column-layout-threshold) - 100%) * 1000000, 100%))`
+	}, l = i != null && i !== !1;
 	return /* @__PURE__ */ t("div", {
-		className: te(),
-		style: a,
-		"data-testid": i,
-		children: /* @__PURE__ */ t(D.Provider, {
+		className: te({ hasHead: l }),
+		style: s,
+		"data-height-passing": !0,
+		"data-testid": o,
+		children: /* @__PURE__ */ n(D.Provider, {
 			value: !1,
-			children: r
+			children: [l && /* @__PURE__ */ t("div", {
+				className: ne(),
+				children: i
+			}), a]
 		})
 	});
-}, F = -1, I = 3, L = (e, t, n) => {
+}, ce = -1, F = 3, I = (e, t, n) => {
 	let [r, i, a, o] = e;
 	return r?.to === t && a?.to === t && r.width === n && a.width === n && i?.to === o?.to && i?.width === o?.width && o !== void 0 && o.width !== n ? Math.abs(n - o.width) : void 0;
-}, R = (e) => o(e) && e.type === N, z = (e) => r.toArray(e).flatMap((e) => {
-	if (k(e)) return z(e.props.children);
-	if (!R(e)) throw new w("Alternatives takes ColumnLayout.Root elements only (arrays and fragments are fine; other content or a wrapping component is not)");
+}, le = (e) => o(e) && e.type === N, L = (e) => r.toArray(e).flatMap((e) => {
+	if (k(e)) return L(e.props.children);
+	if (!le(e)) throw new w("Alternatives takes ColumnLayout.Root elements only (arrays and fragments are fine; other content or a wrapping component is not)");
 	return [e];
-}), se = (e, t) => {
-	let n = j(e.props.children).map(ae);
+}), ue = (e, t) => {
+	let n = j(e.props.children).map(oe);
 	if (n.length === 0) throw new w(`alternative ${t + 1} declares no columns, so it has no minimum to fit`);
 	return {
 		arrangement: e,
-		threshold: oe(n)
+		threshold: O(n)
 	};
-}, ce = (e, t) => ({
+}, de = (e, t) => ({
 	"--column-layout-threshold": e,
 	"--column-layout-reserve": t
-}), le = (e) => Array.from(e.children).findIndex((e) => e.getBoundingClientRect().width === 0), B = (e) => e === F ? Infinity : e, ue = {
+}), fe = (e) => Array.from(e.children).findIndex((e) => e.getBoundingClientRect().width === 0), R = (e) => e === ce ? Infinity : e, pe = {
 	Root: N,
 	Column: P,
 	Alternatives: ({ fill: e, fallback: r, children: a, testId: o }) => {
-		let s = z(a).map(se), c = s.map(({ arrangement: e, threshold: t }) => `${e.props.gap} ${t}`).join("\n"), l = p(null), u = p(null), [f, g] = m(void 0), [_, v] = m(0);
+		let s = L(a).map(ue), c = s.map(({ arrangement: e, threshold: t }) => `${e.props.gap} ${t}`).join("\n"), l = p(null), u = p(null), [f, g] = m(void 0), [_, v] = m(0);
 		d(() => {
 			let e = l.current;
 			if (e === null) return;
 			let t, n = [], r = (e) => {
-				let t = [...n.slice(-3), e], r = I, i = () => {
+				let t = [...n.slice(-3), e], r = F, i = () => {
 					n === t && (--r, r === 0 ? n = [] : requestAnimationFrame(i));
 				};
 				n = t, requestAnimationFrame(i);
 			}, i = () => {
-				let i = le(e);
+				let i = fe(e);
 				if (i === t) return;
-				let { width: a } = e.getBoundingClientRect(), o = L(n, i, a);
-				o !== void 0 && (v((e) => Math.max(e, o)), n = [], t !== void 0 && B(i) < B(t)) || (r({
+				let { width: a } = e.getBoundingClientRect(), o = I(n, i, a);
+				o !== void 0 && (v((e) => Math.max(e, o)), n = [], t !== void 0 && R(i) < R(t)) || (r({
 					to: i,
 					width: a
 				}), t = i, g({
@@ -211,115 +223,116 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		d(() => {
 			u.current = S;
 		});
-		let C = (e) => b !== void 0 && e < B(b.firstFit) ? `${_}px` : "0px";
+		let C = (e) => b !== void 0 && e < R(b.firstFit) ? `${_}px` : "0px";
 		return /* @__PURE__ */ n("div", {
-			className: ne({ fill: e }),
+			className: E({ fill: e }),
+			"data-height-passing": e || void 0,
 			"data-testid": o,
 			children: [/* @__PURE__ */ t("div", {
 				ref: l,
 				"aria-hidden": "true",
-				className: E(),
+				className: re(),
 				children: s.map(({ arrangement: e, threshold: n }, r) => /* @__PURE__ */ t("div", {
-					className: re({ gap: e.props.gap }),
-					style: ce(n, C(r))
+					className: ie({ gap: e.props.gap }),
+					style: de(n, C(r))
 				}, r))
 			}), S]
 		});
 	}
-}, de = .5, V = (e, t) => Math.abs(e - t) <= de, fe = (e) => {
+}, me = .5, z = (e, t) => Math.abs(e - t) <= me, he = (e) => {
 	let t = [];
-	for (let { top: n } of e) t.some((e) => V(e, n)) || t.push(n);
-	let n = t.map((t) => Math.max(...e.filter((e) => V(t, e.top)).map((e) => e.controlEdge)));
+	for (let { top: n } of e) t.some((e) => z(e, n)) || t.push(n);
+	let n = t.map((t) => Math.max(...e.filter((e) => z(t, e.top)).map((e) => e.controlEdge)));
 	return e.map(({ top: e, controlEdge: r }) => {
-		let i = t.findIndex((t) => V(t, e));
+		let i = t.findIndex((t) => z(t, e));
 		return (n[i] ?? r) - r;
 	});
-}, pe = class extends Error {
+}, B = class extends Error {
 	constructor(e) {
 		super(`FieldRow.${e} must be composed inside FieldRow.Root`), this.name = "FieldRowCompositionError";
 	}
-}, H = class extends Error {
+}, V = class extends Error {
 	constructor(e) {
 		super(`FieldRow configuration: ${e}`), this.name = "FieldRowConfigurationError";
 	}
-}, me = b("flex flex-wrap items-start gap-y-[var(--space-stack)]", {
+}, ge = b("flex flex-wrap items-start gap-y-[var(--space-stack)]", {
 	variants: { gap: {
 		stack: "gap-x-[var(--space-stack)]",
 		region: "gap-x-[var(--space-region)]"
 	} },
 	defaultVariants: { gap: "stack" }
-}), he = b("shrink basis-0"), ge = b("", {
+}), _e = b("shrink basis-0"), ve = b("", {
 	variants: { part: {
 		item: "min-w-0 max-w-full flex-none",
 		group: "flex flex-wrap items-end gap-[var(--space-stack)]"
 	} },
 	defaultVariants: { part: "item" }
-}), _e = /^--[A-Za-z0-9_-]+$/, ve = ":scope > [data-field-row-item]", ye = a(void 0), be = (e) => {
-	let t = c(ye);
-	if (t === void 0) throw new pe(e);
+}), ye = /^--[A-Za-z0-9_-]+$/, be = ":scope > [data-field-row-item]", xe = a(void 0), Se = (e) => {
+	let t = c(xe);
+	if (t === void 0) throw new B(e);
 	return t;
-}, xe = (e) => {
-	if (!(Number.isFinite(e) && e > 0)) throw new H(`weight must be a positive finite number, got ${e}`);
-}, Se = (e) => {
-	if (!_e.test(e)) throw new H(`minWidth must name a CSS custom property such as --search-field-min-width, got ${JSON.stringify(e)}`);
 }, Ce = (e) => {
+	if (!(Number.isFinite(e) && e > 0)) throw new V(`weight must be a positive finite number, got ${e}`);
+}, we = (e) => {
+	if (!ye.test(e)) throw new V(`minWidth must name a CSS custom property such as --search-field-min-width, got ${JSON.stringify(e)}`);
+}, Te = (e) => {
 	let t = e.querySelector("label[for]")?.getAttribute("for");
 	if (!t) return;
 	let n = e.ownerDocument.getElementById(t);
 	return n !== null && e.contains(n) ? n : void 0;
-}, we = (e) => getComputedStyle(e).position !== "static", Te = (e, t) => {
+}, Ee = (e) => getComputedStyle(e).position !== "static", De = (e, t) => {
 	if (getComputedStyle(e).position !== "absolute") return e;
 	let n = e.parentElement;
-	for (; n !== null && n !== t && !we(n);) n = n.parentElement;
+	for (; n !== null && n !== t && !Ee(n);) n = n.parentElement;
 	return n ?? e;
-}, Ee = (e) => {
+}, Oe = (e) => {
 	let t = e.getBoundingClientRect().top, n = e.firstElementChild;
 	if (n === null) return {
 		top: t,
 		controlEdge: 0
 	};
-	let r = n.getBoundingClientRect(), i = Ce(n);
+	let r = n.getBoundingClientRect(), i = Te(n);
 	return {
 		top: t,
-		controlEdge: (i === void 0 ? r.bottom : Te(i, n).getBoundingClientRect().bottom) - r.top
+		controlEdge: (i === void 0 ? r.bottom : De(i, n).getBoundingClientRect().bottom) - r.top
 	};
-}, De = (e) => {
-	let t = Array.from(e.querySelectorAll(ve)), n = fe(t.map(Ee));
+}, ke = (e) => {
+	let t = Array.from(e.querySelectorAll(be)), n = he(t.map(Oe));
 	t.forEach((e, t) => {
 		let r = n[t] ?? 0, i = Number.parseFloat(e.style.paddingTop) || 0;
 		Math.abs(i - r) > .01 && (e.style.paddingTop = r === 0 ? "" : `${r}px`);
 	});
-}, Oe = {
+}, Ae = {
 	Root: ({ gap: e, children: n, testId: r }) => {
 		let i = p(null), a = p(void 0), o = p(/* @__PURE__ */ new WeakSet()), s = () => {
-			i.current && De(i.current);
+			i.current && ke(i.current);
 		}, c = (e) => {
 			e && a.current && !o.current.has(e) && (o.current.add(e), a.current.observe(e));
 		};
 		return d(() => {
 			let e = i.current;
-			if (e !== null && (De(e), !(typeof ResizeObserver > "u"))) {
-				a.current ??= new ResizeObserver(() => De(e));
-				for (let t of e.querySelectorAll(ve)) {
+			if (e !== null && (ke(e), !(typeof ResizeObserver > "u"))) {
+				a.current ??= new ResizeObserver(() => ke(e));
+				for (let t of e.querySelectorAll(be)) {
 					let e = t.firstElementChild ?? void 0;
 					c(e), c(e?.querySelector("label[for]") ?? void 0);
 				}
 			}
 		}), d(() => () => a.current?.disconnect(), []), /* @__PURE__ */ t("div", {
 			ref: i,
-			className: me({ gap: e }),
+			className: ge({ gap: e }),
 			"data-testid": r,
-			children: /* @__PURE__ */ t(ye, {
+			children: /* @__PURE__ */ t(xe, {
 				value: { align: s },
 				children: n
 			})
 		});
 	},
 	Field: ({ children: e, weight: n = 1, minWidth: r, testId: i }) => {
-		let { align: a } = be("Field");
-		return xe(n), Se(r), d(() => a()), /* @__PURE__ */ t("div", {
+		let { align: a } = Se("Field");
+		return Ce(n), we(r), d(() => a()), /* @__PURE__ */ t("div", {
 			"data-field-row-item": !0,
-			className: he(),
+			className: _e(),
 			"data-testid": i,
 			style: {
 				flexGrow: n,
@@ -329,18 +342,18 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		});
 	},
 	Actions: ({ children: e, testId: n }) => {
-		let { align: r } = be("Actions");
+		let { align: r } = Se("Actions");
 		return d(() => r()), /* @__PURE__ */ t("div", {
 			"data-field-row-item": !0,
-			className: ge(),
+			className: ve(),
 			"data-testid": n,
 			children: /* @__PURE__ */ t("div", {
-				className: ge({ part: "group" }),
+				className: ve({ part: "group" }),
 				children: e
 			})
 		});
 	}
-}, ke = b("flex", {
+}, je = b("flex", {
 	variants: {
 		gap: {
 			stack: "gap-[var(--space-stack)]",
@@ -365,8 +378,8 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		measure: !1,
 		direction: "column"
 	}
-}), Ae = ({ gap: e, measure: n, direction: r, align: i, children: a, testId: o }) => /* @__PURE__ */ t("div", {
-	className: ke({
+}), Me = ({ gap: e, measure: n, direction: r, align: i, children: a, testId: o }) => /* @__PURE__ */ t("div", {
+	className: je({
 		gap: e,
 		measure: n,
 		direction: r,
@@ -374,33 +387,33 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 	}),
 	"data-testid": o,
 	children: a
-}), je = b(["min-w-0 border border-solid border-border bg-surface text-foreground", "p-[var(--space-box-inset)] [overflow-wrap:anywhere]"].join(" ")), Me = ({ children: e, name: n, testId: r }) => n === void 0 || n === "" ? /* @__PURE__ */ t("div", {
-	className: je(),
+}), Ne = b(["min-w-0 border border-solid border-border bg-surface text-foreground", "p-[var(--space-box-inset)] [overflow-wrap:anywhere]"].join(" ")), Pe = ({ children: e, name: n, testId: r }) => n === void 0 || n === "" ? /* @__PURE__ */ t("div", {
+	className: Ne(),
 	"data-testid": r,
 	children: e
 }) : /* @__PURE__ */ t("div", {
-	className: je(),
+	className: Ne(),
 	role: "group",
 	"aria-label": n,
 	"data-testid": r,
 	children: e
-}), Ne = b("inline-flex", { variants: { cut: {
+}), Fe = b("inline-flex", { variants: { cut: {
 	full: "",
 	compact: ""
-} } }), Pe = ({ name: e, cut: n, children: r, testId: i }) => e === "" ? /* @__PURE__ */ t("span", {
+} } }), Ie = ({ name: e, cut: n, children: r, testId: i }) => e === "" ? /* @__PURE__ */ t("span", {
 	"aria-hidden": "true",
 	"data-cut": n,
-	className: Ne({ cut: n }),
+	className: Fe({ cut: n }),
 	"data-testid": i,
 	children: r
 }) : /* @__PURE__ */ t("span", {
 	role: "img",
 	"aria-label": e,
 	"data-cut": n,
-	className: Ne({ cut: n }),
+	className: Fe({ cut: n }),
 	"data-testid": i,
 	children: r
-}), Fe = b("min-w-0 border-s-[length:var(--callout-mark-width)] border-solid ps-[var(--space-callout-inset)] text-foreground [overflow-wrap:anywhere] forced-colors:border-s-[CanvasText]", {
+}), Le = b("min-w-0 border-s-[length:var(--callout-mark-width)] border-solid ps-[var(--space-callout-inset)] text-foreground [overflow-wrap:anywhere] forced-colors:border-s-[CanvasText]", {
 	variants: { tone: {
 		warning: "border-warning",
 		info: "border-info",
@@ -408,54 +421,54 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		error: "border-error"
 	} },
 	defaultVariants: { tone: "warning" }
-}), Ie = ({ children: e, tone: n, name: r, testId: i }) => r === void 0 || r === "" ? /* @__PURE__ */ t("div", {
-	className: Fe({ tone: n }),
+}), Re = ({ children: e, tone: n, name: r, testId: i }) => r === void 0 || r === "" ? /* @__PURE__ */ t("div", {
+	className: Le({ tone: n }),
 	"data-testid": i,
 	children: e
 }) : /* @__PURE__ */ t("div", {
-	className: Fe({ tone: n }),
+	className: Le({ tone: n }),
 	role: "group",
 	"aria-label": r,
 	"data-testid": i,
 	children: e
-}), Le = b("m-0 list-none p-0"), Re = b([
+}), ze = b("m-0 list-none p-0"), Be = b([
 	"flex items-start gap-3 font-body text-body leading-body text-foreground",
 	"before:mt-[0.35em] before:size-[calc(var(--tick-length)*0.7)] before:shrink-0 before:rotate-45 before:[border-top:var(--tick-thickness)_solid_var(--color-rule)] before:[border-right:var(--tick-thickness)_solid_var(--color-rule)] before:content-['']",
 	"[&:not(:first-child)]:mt-[var(--space-stack)] [&:not(:first-child)]:border-border [&:not(:first-child)]:border-t [&:not(:first-child)]:border-solid [&:not(:first-child)]:pt-[var(--space-stack)]"
-].join(" ")), ze = {
+].join(" ")), Ve = {
 	Root: ({ children: e, testId: n }) => /* @__PURE__ */ t("ul", {
-		className: Le(),
+		className: ze(),
 		role: "list",
 		"data-testid": n,
 		children: e
 	}),
 	Item: ({ children: e }) => /* @__PURE__ */ t("li", {
-		className: Re(),
+		className: Be(),
 		children: e
 	})
-}, Be = b("m-0 list-none p-0"), Ve = b("py-[var(--space-collection-item)] [&+li]:border-t [&+li]:border-solid [&+li]:border-border"), He = {
+}, He = b("m-0 list-none p-0"), Ue = b("py-[var(--space-collection-item)] [&+li]:border-t [&+li]:border-solid [&+li]:border-border"), We = {
 	Root: ({ children: e, testId: n }) => /* @__PURE__ */ t("ul", {
-		className: Be(),
+		className: He(),
 		role: "list",
 		"data-testid": n,
 		children: e
 	}),
 	Item: ({ children: e, testId: n }) => /* @__PURE__ */ t("li", {
-		className: Ve(),
+		className: Ue(),
 		"data-testid": n,
 		children: e
 	})
-}, Ue = class extends Error {
+}, Ge = class extends Error {
 	constructor(e) {
 		super(`DefinitionList configuration is invalid: ${e}`), this.name = "DefinitionListConfigurationError";
 	}
-}, We = b("@container", {
+}, Ke = b("@container", {
 	variants: { density: {
 		comfortable: "[&>div]:py-[var(--space-definition-item)]",
 		compact: "[&>div]:py-[var(--space-definition-item-compact)]"
 	} },
 	defaultVariants: { density: "comfortable" }
-}), Ge = b([
+}), qe = b([
 	"grid grid-flow-row-dense gap-[var(--space-stack)] border-b border-solid border-border first:border-t",
 	"[--definition-stack:clamp(0px,(var(--definition-threshold)-100%)*1000000,100%)]",
 	"[--definition-shortfall:clamp(0px,(var(--definition-threshold)-100cqi)*1000000,1px)]",
@@ -463,46 +476,46 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 	"gap-x-[max(0px,var(--space-definition-column)-var(--definition-stack))]",
 	"[&>dt]:col-start-1 [&>dt]:self-baseline [&>dd]:col-span-full [&>dd]:self-baseline",
 	"[&>dd]:col-start-[calc(2-tan(atan2(var(--definition-shortfall),1px)))]"
-].join(" ")), Ke = b("font-body text-subtitle leading-subtitle text-foreground wrap-break-word"), qe = b("font-body text-body leading-body text-muted max-w-[var(--measure)] wrap-break-word"), Je = {
+].join(" ")), Je = b("font-body text-subtitle leading-subtitle text-foreground wrap-break-word"), Ye = b("font-body text-body leading-body text-muted max-w-[var(--measure)] wrap-break-word"), Xe = {
 	weight: 1,
 	minWidth: "--definition-term-min-width"
-}, Ye = {
+}, Ze = {
 	weight: 2,
 	minWidth: "--definition-description-min-width"
-}, Xe = /^--[A-Za-z0-9_-]+$/, Ze = (e, t) => {
-	if (!Number.isFinite(t.weight) || t.weight <= 0) throw new Ue(`${e} needs a positive finite weight (got ${t.weight})`);
-	if (!Xe.test(t.minWidth)) throw new Ue(`${e} needs a custom-property name such as --summary-term-min-width for minWidth (got ${JSON.stringify(t.minWidth)})`);
+}, Qe = /^--[A-Za-z0-9_-]+$/, $e = (e, t) => {
+	if (!Number.isFinite(t.weight) || t.weight <= 0) throw new Ge(`${e} needs a positive finite weight (got ${t.weight})`);
+	if (!Qe.test(t.minWidth)) throw new Ge(`${e} needs a custom-property name such as --summary-term-min-width for minWidth (got ${JSON.stringify(t.minWidth)})`);
 	return t;
-}, Qe = (e, t) => {
+}, et = (e, t) => {
 	let n = e.weight + t.weight;
 	return `calc(var(--space-definition-column) + max(var(${e.minWidth}) * ${n / e.weight}, var(${t.minWidth}) * ${n / t.weight}))`;
-}, $e = {
-	Root: ({ density: e, termColumn: n = Je, descriptionColumn: r = Ye, children: i, testId: a }) => {
-		let o = Ze("termColumn", n), s = Ze("descriptionColumn", r), c = {
-			"--definition-threshold": Qe(o, s),
+}, tt = {
+	Root: ({ density: e, termColumn: n = Xe, descriptionColumn: r = Ze, children: i, testId: a }) => {
+		let o = $e("termColumn", n), s = $e("descriptionColumn", r), c = {
+			"--definition-threshold": et(o, s),
 			"--definition-term-share": `calc(${o.weight} / ${o.weight + s.weight})`
 		};
 		return /* @__PURE__ */ t("dl", {
-			className: We({ density: e }),
+			className: Ke({ density: e }),
 			style: c,
 			"data-testid": a,
 			children: i
 		});
 	},
 	Item: ({ children: e, testId: n }) => /* @__PURE__ */ t("div", {
-		className: Ge(),
+		className: qe(),
 		"data-testid": n,
 		children: e
 	}),
 	Term: ({ children: e }) => /* @__PURE__ */ t("dt", {
-		className: Ke(),
+		className: Je(),
 		children: e
 	}),
 	Description: ({ children: e }) => /* @__PURE__ */ t("dd", {
-		className: qe(),
+		className: Ye(),
 		children: e
 	})
-}, et = b("block w-full object-cover bg-backing", {
+}, nt = b("block w-full object-cover bg-backing", {
 	variants: {
 		ratio: {
 			portrait: "aspect-portrait",
@@ -519,13 +532,13 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		}
 	},
 	defaultVariants: { focus: "center" }
-}), tt = ({ src: e, alt: r, width: i, height: a, ratio: o, focus: s, responsive: c, caption: l, overlay: u, priority: d, testId: f }) => {
+}), rt = ({ src: e, alt: r, width: i, height: a, ratio: o, focus: s, responsive: c, caption: l, overlay: u, priority: d, testId: f }) => {
 	let p = u != null && typeof u != "boolean", m = /* @__PURE__ */ t("img", {
 		src: e,
 		alt: r,
 		width: i,
 		height: a,
-		className: et({
+		className: nt({
 			ratio: o,
 			focus: s
 		}),
@@ -548,13 +561,13 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			children: l
 		})]
 	});
-}, nt = b("inline-block shrink-0 align-[-0.125em] forced-color-adjust-auto", { variants: { color: {
+}, it = b("inline-block shrink-0 align-[-0.125em] forced-color-adjust-auto", { variants: { color: {
 	muted: "text-muted",
 	success: "text-success",
 	warning: "text-warning",
 	error: "text-error",
 	info: "text-info"
-} } }), rt = "M3.5 2h9a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1H7.25L4 13.75V11h-.5a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1z", it = {
+} } }), at = "M3.5 2h9a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1H7.25L4 13.75V11h-.5a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1z", ot = {
 	plus: ["M3 8h10", "M8 3v10"],
 	right: ["M3 8h10", "M9 4l4 4-4 4"],
 	remove: ["M3 8h10"],
@@ -575,12 +588,12 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		"M9.25 7.25v3.5"
 	],
 	"bubble-exclamation": [
-		rt,
+		at,
 		"M8 4.5v2",
 		"M8 8.75h.01"
 	],
-	"bubble-tick": [rt, "M5.75 6.75l1.5 1.5 3-3.5"]
-}, at = ({ name: e, label: n, color: r, testId: i }) => /* @__PURE__ */ t("svg", {
+	"bubble-tick": [at, "M5.75 6.75l1.5 1.5 3-3.5"]
+}, st = ({ name: e, label: n, color: r, testId: i }) => /* @__PURE__ */ t("svg", {
 	role: n ? "img" : void 0,
 	"aria-label": n || void 0,
 	"aria-hidden": !n || void 0,
@@ -588,9 +601,9 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 	viewBox: "0 0 16 16",
 	width: "1em",
 	height: "1em",
-	className: nt({ color: r }),
+	className: it({ color: r }),
 	"data-testid": i,
-	children: it[e].map((n) => /* @__PURE__ */ t("path", {
+	children: ot[e].map((n) => /* @__PURE__ */ t("path", {
 		d: n,
 		fill: e === "dot" ? "currentColor" : "none",
 		stroke: e === "dot" ? "none" : "currentColor",
@@ -598,36 +611,36 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		strokeLinecap: "round",
 		strokeLinejoin: "round"
 	}, n))
-}), U = (e) => ({ label: n, color: r, testId: i }) => /* @__PURE__ */ t(at, {
+}), H = (e) => ({ label: n, color: r, testId: i }) => /* @__PURE__ */ t(st, {
 	name: e,
 	label: n,
 	color: r,
 	testId: i
-}), ot = Object.assign(({ name: e, label: n, color: r, testId: i }) => /* @__PURE__ */ t(at, {
+}), ct = Object.assign(({ name: e, label: n, color: r, testId: i }) => /* @__PURE__ */ t(st, {
 	name: e,
 	label: n,
 	color: r,
 	testId: i
 }), {
-	Plus: U("plus"),
-	Up: U("sort-ascending"),
-	Down: U("sort-descending"),
-	Right: U("right"),
-	Remove: U("remove")
-}), W = class extends Error {
+	Plus: H("plus"),
+	Up: H("sort-ascending"),
+	Down: H("sort-descending"),
+	Right: H("right"),
+	Remove: H("remove")
+}), lt = class extends Error {
 	constructor(e) {
 		super(`Meter configuration is invalid: ${e}`), this.name = "MeterConfigurationError";
 	}
-}, st = b("w-full h-[var(--meter-track-thickness)] bg-meter-track border border-solid border-rule"), ct = b("h-full w-[calc(var(--meter-level)*100%)]", {
+}, ut = b("w-full h-[var(--meter-track-thickness)] bg-meter-track border border-solid border-rule"), dt = b("h-full w-[calc(var(--meter-level)*100%)]", {
 	variants: { treatment: {
 		neutral: "bg-meter-fill",
 		depleting: "bg-[color-mix(in_oklab,var(--color-meter-fill)_calc(var(--meter-level)*100%),var(--color-error))]"
 	} },
 	defaultVariants: { treatment: "neutral" }
-}), lt = (e, t, n) => e <= t ? 0 : e >= n ? 1 : (e - t) / (n - t), ut = ({ value: e, min: n = 0, max: r, treatment: i, label: a, valueText: o, testId: s }) => {
-	if (!Number.isFinite(e) || !Number.isFinite(n) || !Number.isFinite(r)) throw new W(`value, min and max must be finite numbers (got value=${e}, min=${n}, max=${r})`);
-	if (n >= r) throw new W(`min must be less than max (got min=${n}, max=${r})`);
-	let c = { "--meter-level": lt(e, n, r) };
+}), ft = (e, t, n) => e <= t ? 0 : e >= n ? 1 : (e - t) / (n - t), pt = ({ value: e, min: n = 0, max: r, treatment: i, label: a, valueText: o, testId: s }) => {
+	if (!Number.isFinite(e) || !Number.isFinite(n) || !Number.isFinite(r)) throw new lt(`value, min and max must be finite numbers (got value=${e}, min=${n}, max=${r})`);
+	if (n >= r) throw new lt(`min must be less than max (got min=${n}, max=${r})`);
+	let c = { "--meter-level": ft(e, n, r) };
 	return /* @__PURE__ */ t("div", {
 		role: "meter",
 		"aria-valuenow": e,
@@ -636,28 +649,28 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		"aria-label": a,
 		"aria-valuetext": o,
 		"data-testid": s,
-		className: st(),
+		className: ut(),
 		style: c,
 		children: /* @__PURE__ */ t("div", {
 			"aria-hidden": "true",
-			className: ct({ treatment: i })
+			className: dt({ treatment: i })
 		})
 	});
-}, dt = b(["grid gap-[var(--space-stack)]", "lg:grid-cols-[10rem_minmax(0,1fr)] lg:items-start lg:gap-x-12"].join(" ")), ft = b("lg:sticky lg:top-6"), pt = b("block border-b border-solid border-border pb-1 font-secondary text-label tracking-label text-muted"), mt = b("block pt-1 font-secondary text-label tracking-label text-foreground"), ht = {
+}, mt = b(["grid gap-[var(--space-stack)]", "lg:grid-cols-[10rem_minmax(0,1fr)] lg:items-start lg:gap-x-12"].join(" ")), ht = b("lg:sticky lg:top-6"), gt = b("block border-b border-solid border-border pb-1 font-secondary text-label tracking-label text-muted"), _t = b("block pt-1 font-secondary text-label tracking-label text-foreground"), vt = {
 	Root: ({ children: e, testId: n }) => /* @__PURE__ */ t("div", {
-		className: dt(),
+		className: mt(),
 		"data-testid": n,
 		children: e
 	}),
 	Index: ({ number: e, children: r, testId: i }) => /* @__PURE__ */ n("div", {
-		className: ft(),
+		className: ht(),
 		"data-testid": i,
 		"aria-hidden": "true",
 		children: [e !== void 0 && /* @__PURE__ */ t("span", {
-			className: pt(),
+			className: gt(),
 			children: e
 		}), /* @__PURE__ */ t("span", {
-			className: mt(),
+			className: _t(),
 			children: r
 		})]
 	}),
@@ -665,15 +678,15 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		"data-testid": n,
 		children: e
 	})
-}, gt = b("w-full shrink-0 border-t border-solid border-border forced-colors:border-[CanvasText]"), _t = ({ testId: e }) => /* @__PURE__ */ t("div", {
+}, yt = b("w-full shrink-0 border-t border-solid border-border forced-colors:border-[CanvasText]"), bt = ({ testId: e }) => /* @__PURE__ */ t("div", {
 	"aria-hidden": "true",
-	className: gt(),
+	className: yt(),
 	"data-testid": e
-}), vt = class extends Error {
+}), xt = class extends Error {
 	constructor(e) {
 		super(`Table configuration is invalid: ${e}`), this.name = "TableConfigurationError";
 	}
-}, yt = "comfortable", bt = "marker", xt = b([
+}, St = "comfortable", Ct = "marker", wt = b([
 	"overflow-x-auto",
 	"[&[data-icon-actions]]:p-[calc(var(--focus-ring-width)+var(--focus-ring-offset))]",
 	"[&[data-icon-actions]]:m-[calc(-1*(var(--focus-ring-width)+var(--focus-ring-offset)))]",
@@ -709,7 +722,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		},
 		captionVisibility: {
 			visible: "[&>table>caption]:pb-3",
-			hidden: "[&>table>caption]:sr-only"
+			hidden: "relative [&>table>caption]:sr-only"
 		},
 		density: {
 			comfortable: "[--table-cell-padding-inline:var(--table-cell-inset-inline)] [--table-cell-padding-block:var(--table-cell-inset-block)]",
@@ -717,11 +730,11 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		}
 	},
 	defaultVariants: {
-		density: yt,
+		density: St,
 		captionVisibility: "visible",
-		selectionTreatment: bt
+		selectionTreatment: Ct
 	}
-}), St = b([
+}), Tt = b([
 	"border-t border-solid border-border",
 	"[&[aria-selected=true]>*:first-child]:relative",
 	"[&[aria-selected=true]>*:first-child]:before:absolute [&[aria-selected=true]>*:first-child]:before:inset-y-0 [&[aria-selected=true]>*:first-child]:before:left-0",
@@ -732,7 +745,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		false: ""
 	} },
 	defaultVariants: { interactive: !1 }
-}), Ct = [
+}), Et = [
 	"a[href]",
 	"button",
 	"input",
@@ -758,11 +771,11 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 	"[role=\"searchbox\"]",
 	"[role=\"slider\"]",
 	"[role=\"spinbutton\"]"
-].join(", "), wt = (e, t) => {
+].join(", "), Dt = (e, t) => {
 	if (!(t instanceof Element)) return !1;
-	let n = t.closest(Ct);
+	let n = t.closest(Et);
 	return n !== null && n !== e && e.contains(n);
-}, Tt = /* @__PURE__ */ new Set(["Enter", " "]), Et = b("px-[var(--table-cell-padding-inline)] py-[var(--table-cell-padding-block)] text-small first:pl-0 last:pr-0", {
+}, Ot = /* @__PURE__ */ new Set(["Enter", " "]), kt = b("px-[var(--table-cell-padding-inline)] py-[var(--table-cell-padding-block)] text-small first:pl-0 last:pr-0", {
 	variants: {
 		variant: {
 			value: "font-body text-foreground tabular-nums",
@@ -778,23 +791,23 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		variant: "value",
 		align: "left"
 	}
-}), Dt = b("px-[var(--table-cell-padding-inline)] py-[var(--table-cell-padding-block)] font-secondary font-medium text-label text-muted tracking-label first:pl-0 last:pr-0", {
+}), At = b("px-[var(--table-cell-padding-inline)] py-[var(--table-cell-padding-block)] font-secondary font-medium text-label text-muted tracking-label first:pl-0 last:pr-0", {
 	variants: { align: {
 		left: "text-left",
 		right: "text-right",
 		center: "text-center"
 	} },
 	defaultVariants: { align: "left" }
-}), Ot = (e) => `var(--table-column-${e})`, kt = (e, t) => {
+}), jt = (e) => `var(--table-column-${e})`, Mt = (e, t) => {
 	if (e.width === "icon-action") return "max-content";
-	let n = e.minWidth === void 0 ? void 0 : Ot(e.minWidth);
+	let n = e.minWidth === void 0 ? void 0 : jt(e.minWidth);
 	if (e.width !== void 0) {
-		let t = Ot(e.width);
+		let t = jt(e.width);
 		return n === void 0 ? t : `max(${n}, ${t})`;
 	}
-	if (!Number.isFinite(e.weight) || e.weight <= 0) throw new vt(`column ${t + 1} needs a positive finite weight (got ${e.weight})`);
+	if (!Number.isFinite(e.weight) || e.weight <= 0) throw new xt(`column ${t + 1} needs a positive finite weight (got ${e.weight})`);
 	return `minmax(${n ?? "0"}, ${e.weight}fr)`;
-}, At = (e) => e === void 0 || e.length === 0 ? void 0 : e.map(kt).join(" "), jt = (e, t, n, r) => {
+}, Nt = (e) => e === void 0 || e.length === 0 ? void 0 : e.map(Mt).join(" "), Pt = (e, t, n, r) => {
 	let [i, a] = m(0);
 	return d(() => {
 		let i = e.current;
@@ -804,7 +817,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 				let e = t.current?.querySelector("thead")?.getBoundingClientRect().height ?? 0, n = Number.parseFloat(getComputedStyle(i).paddingTop) || 0;
 				i.style.scrollPaddingTop = `${e + 2 * n}px`;
 			}
-			let e = getComputedStyle(i).getPropertyValue("--_scroll-released").trim() === "1", n = i === document.activeElement, o = i.scrollWidth > i.clientWidth || r && i.scrollHeight > i.clientHeight;
+			let e = r && getComputedStyle(i).getPropertyValue("--_scroll-released").trim() === "1", n = i === document.activeElement, o = i.scrollWidth > i.clientWidth || r && i.scrollHeight > i.clientHeight;
 			a(e ? n ? -1 : void 0 : o || n ? 0 : void 0);
 		};
 		o();
@@ -829,16 +842,16 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		n,
 		r
 	]), i;
-}, Mt = (e) => {
+}, Ft = (e) => {
 	let t = e.currentTarget;
 	if (getComputedStyle(t).getPropertyValue("--_scroll-released").trim() === "1") return;
 	let n = e.target;
 	if (n === t) return;
 	let r = t.getBoundingClientRect(), i = t.querySelector(":scope > table > thead"), a = n.getBoundingClientRect(), o = Number.parseFloat(getComputedStyle(t).paddingTop) || 0, s = r.top + t.clientTop + (i?.getBoundingClientRect().height ?? 0) + 2 * o, c = r.top + t.clientTop + t.clientHeight - o;
 	i?.contains(n) || (a.top < s ? t.scrollTop += a.top - s : a.bottom > c && (t.scrollTop += a.bottom - c)), a.left < r.left + o ? t.scrollLeft += a.left - r.left - o : a.right > r.left + t.clientLeft + t.clientWidth - o && (t.scrollLeft += a.right - r.left - t.clientLeft - t.clientWidth + o);
-}, Nt = {
+}, It = {
 	Root: ({ caption: e, captionVisibility: r, bounded: i, selectionTreatment: a, notes: o, columns: s, density: c, children: l, testId: u }) => {
-		let d = p(null), f = p(null), m = p(null), h = At(s), g = jt(d, f, m, i === !0), _ = g !== void 0, v = h === void 0 ? void 0 : { "--table-columns": h }, y = h === void 0 ? void 0 : s?.length, b = /* @__PURE__ */ n("table", {
+		let d = p(null), f = p(null), m = p(null), h = Nt(s), g = Pt(d, f, m, i === !0), _ = g !== void 0, v = h === void 0 ? void 0 : { "--table-columns": h }, y = h === void 0 ? void 0 : s?.length, b = /* @__PURE__ */ n("table", {
 			ref: f,
 			role: "table",
 			children: [/* @__PURE__ */ t("caption", {
@@ -847,7 +860,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			}), l]
 		});
 		return o === void 0 && !i ? /* @__PURE__ */ t("section", {
-			className: xt({
+			className: wt({
 				density: c,
 				captionVisibility: r,
 				selectionTreatment: a,
@@ -856,16 +869,16 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			style: v,
 			"data-columns": y,
 			"data-icon-actions": s?.some((e) => e.width === "icon-action") || void 0,
-			"data-density": c ?? yt,
-			"data-selection-treatment": a ?? bt,
+			"data-density": c ?? St,
+			"data-selection-treatment": a ?? Ct,
 			"data-testid": u,
 			"aria-label": e,
 			tabIndex: 0,
 			children: b
 		}) : /* @__PURE__ */ t("div", {
 			ref: d,
-			onFocus: i ? Mt : void 0,
-			className: xt({
+			onFocus: i ? Ft : void 0,
+			className: wt({
 				density: c,
 				captionVisibility: r,
 				selectionTreatment: a,
@@ -873,11 +886,12 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			}),
 			style: v,
 			"data-bounded": i || void 0,
+			"data-height-bounded": i || void 0,
 			"data-notes": o,
 			"data-columns": y,
 			"data-icon-actions": s?.some((e) => e.width === "icon-action") || void 0,
-			"data-density": c ?? yt,
-			"data-selection-treatment": a ?? bt,
+			"data-density": c ?? St,
+			"data-selection-treatment": a ?? Ct,
 			"data-testid": u,
 			role: _ ? "group" : void 0,
 			"aria-label": _ ? e : void 0,
@@ -905,13 +919,13 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			return () => e?.unsubscribe();
 		}, [i]);
 		let s = (e) => {
-			wt(e.currentTarget, e.target) || r?.next();
+			Dt(e.currentTarget, e.target) || r?.next();
 		}, c = (e) => {
-			e.target !== e.currentTarget || !Tt.has(e.key) || (e.key === " " && e.preventDefault(), e.repeat || r?.next());
+			e.target !== e.currentTarget || !Ot.has(e.key) || (e.key === " " && e.preventDefault(), e.repeat || r?.next());
 		}, l = r !== void 0;
 		return /* @__PURE__ */ t("tr", {
 			role: "row",
-			className: St({ interactive: l }),
+			className: Tt({ interactive: l }),
 			"data-testid": n,
 			tabIndex: l ? 0 : void 0,
 			"aria-selected": i === void 0 ? void 0 : a,
@@ -924,19 +938,19 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		role: e === "row" ? "rowheader" : "columnheader",
 		scope: e,
 		"aria-sort": r,
-		className: Dt({ align: n }),
+		className: At({ align: n }),
 		children: i
 	}),
 	Cell: ({ variant: e, align: n, children: r }) => /* @__PURE__ */ t("td", {
 		role: "cell",
-		className: Et({
+		className: kt({
 			variant: e,
 			align: n
 		}),
 		"data-variant": e ?? "value",
 		children: r
 	})
-}, Pt = b("font-secondary text-label tracking-label font-medium", {
+}, Lt = b("font-secondary text-label tracking-label font-medium", {
 	variants: { color: {
 		foreground: "text-foreground",
 		muted: "text-muted",
@@ -946,11 +960,11 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		info: "text-info"
 	} },
 	defaultVariants: { color: "muted" }
-}), Ft = ({ children: e, color: n, testId: r }) => /* @__PURE__ */ t("p", {
-	className: Pt({ color: n }),
+}), Rt = ({ children: e, color: n, testId: r }) => /* @__PURE__ */ t("p", {
+	className: Lt({ color: n }),
 	"data-testid": r,
 	children: e
-}), It = b("font-heading text-display leading-display tracking-optical max-w-[var(--measure-display)]", {
+}), zt = b("font-heading text-display leading-display tracking-optical max-w-[var(--measure-display)]", {
 	variants: { color: {
 		foreground: "text-foreground",
 		muted: "text-muted",
@@ -960,11 +974,11 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		info: "text-info"
 	} },
 	defaultVariants: { color: "foreground" }
-}), Lt = ({ children: e, color: n, testId: r }) => /* @__PURE__ */ t("h1", {
-	className: It({ color: n }),
+}), Bt = ({ children: e, color: n, testId: r }) => /* @__PURE__ */ t("h1", {
+	className: zt({ color: n }),
 	"data-testid": r,
 	children: e
-}), Rt = b("font-heading text-title leading-title tracking-optical", {
+}), Vt = b("font-heading text-title leading-title tracking-optical", {
 	variants: { color: {
 		foreground: "text-foreground",
 		muted: "text-muted",
@@ -974,11 +988,11 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		info: "text-info"
 	} },
 	defaultVariants: { color: "foreground" }
-}), zt = ({ children: e, color: n, testId: r }) => /* @__PURE__ */ t("h2", {
-	className: Rt({ color: n }),
+}), Ht = ({ children: e, color: n, testId: r }) => /* @__PURE__ */ t("h2", {
+	className: Vt({ color: n }),
 	"data-testid": r,
 	children: e
-}), Bt = b("font-heading text-subtitle leading-subtitle", {
+}), Ut = b("font-heading text-subtitle leading-subtitle", {
 	variants: { color: {
 		foreground: "text-foreground",
 		muted: "text-muted",
@@ -988,11 +1002,11 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		info: "text-info"
 	} },
 	defaultVariants: { color: "foreground" }
-}), Vt = ({ children: e, color: n, testId: r }) => /* @__PURE__ */ t("h3", {
-	className: Bt({ color: n }),
+}), Wt = ({ children: e, color: n, testId: r }) => /* @__PURE__ */ t("h3", {
+	className: Ut({ color: n }),
 	"data-testid": r,
 	children: e
-}), Ht = b("font-heading text-body leading-body font-bold", {
+}), Gt = b("font-heading text-body leading-body font-bold", {
 	variants: { color: {
 		foreground: "text-foreground",
 		muted: "text-muted",
@@ -1002,11 +1016,11 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		info: "text-info"
 	} },
 	defaultVariants: { color: "foreground" }
-}), Ut = ({ children: e, color: n, testId: r }) => /* @__PURE__ */ t("h4", {
-	className: Ht({ color: n }),
+}), Kt = ({ children: e, color: n, testId: r }) => /* @__PURE__ */ t("h4", {
+	className: Gt({ color: n }),
 	"data-testid": r,
 	children: e
-}), Wt = b("font-heading text-body leading-body font-semibold", {
+}), qt = b("font-heading text-body leading-body font-semibold", {
 	variants: { color: {
 		foreground: "text-foreground",
 		muted: "text-muted",
@@ -1016,11 +1030,11 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		info: "text-info"
 	} },
 	defaultVariants: { color: "foreground" }
-}), Gt = ({ children: e, color: n, testId: r }) => /* @__PURE__ */ t("h5", {
-	className: Wt({ color: n }),
+}), Jt = ({ children: e, color: n, testId: r }) => /* @__PURE__ */ t("h5", {
+	className: qt({ color: n }),
 	"data-testid": r,
 	children: e
-}), Kt = b("font-heading text-body leading-body font-medium", {
+}), Yt = b("font-heading text-body leading-body font-medium", {
 	variants: { color: {
 		foreground: "text-foreground",
 		muted: "text-muted",
@@ -1030,11 +1044,11 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		info: "text-info"
 	} },
 	defaultVariants: { color: "foreground" }
-}), qt = ({ children: e, color: n, testId: r }) => /* @__PURE__ */ t("h6", {
-	className: Kt({ color: n }),
+}), Xt = ({ children: e, color: n, testId: r }) => /* @__PURE__ */ t("h6", {
+	className: Yt({ color: n }),
 	"data-testid": r,
 	children: e
-}), Jt = b("font-secondary text-small", {
+}), Zt = b("font-secondary text-small", {
 	variants: {
 		emphasis: {
 			regular: "",
@@ -1058,15 +1072,15 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		truncate: !1,
 		emphasis: "regular"
 	}
-}), Yt = ({ children: e, color: n, emphasis: r, truncate: i, testId: a }) => /* @__PURE__ */ t("p", {
-	className: Jt({
+}), Qt = ({ children: e, color: n, emphasis: r, truncate: i, testId: a }) => /* @__PURE__ */ t("p", {
+	className: Zt({
 		color: n,
 		emphasis: r,
 		truncate: i
 	}),
 	"data-testid": a,
 	children: e
-}), Xt = b("font-body text-body leading-body", {
+}), $t = b("font-body text-body leading-body", {
 	variants: {
 		emphasis: {
 			regular: "",
@@ -1090,21 +1104,21 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		truncate: !1,
 		emphasis: "regular"
 	}
-}), Zt = ({ children: e, color: n, emphasis: r, truncate: i, testId: a }) => /* @__PURE__ */ t("p", {
-	className: Xt({
+}), en = ({ children: e, color: n, emphasis: r, truncate: i, testId: a }) => /* @__PURE__ */ t("p", {
+	className: $t({
 		color: n,
 		emphasis: r,
 		truncate: i
 	}),
 	"data-testid": a,
 	children: e
-}), Qt = b("flex flex-col gap-[var(--space-stack)]", {
+}), tn = b("flex flex-col gap-[var(--space-stack)]", {
 	variants: { variant: {
 		default: "max-w-[var(--measure)]",
 		letter: "min-w-0 max-w-[min(100%,var(--measure-letter))] font-letter text-letter"
 	} },
 	defaultVariants: { variant: "default" }
-}), $t = a(!1), en = b("font-body text-lede leading-lede text-foreground"), tn = b("", {
+}), nn = a(!1), rn = b("font-body text-lede leading-lede text-foreground"), an = b("", {
 	variants: {
 		letter: {
 			false: "font-body text-body leading-body",
@@ -1123,82 +1137,82 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		letter: !1,
 		color: "foreground"
 	}
-}), nn = b("font-body text-small text-muted"), rn = {
-	Root: ({ children: e, testId: n, variant: r }) => /* @__PURE__ */ t($t, {
+}), on = b("font-body text-small text-muted"), sn = {
+	Root: ({ children: e, testId: n, variant: r }) => /* @__PURE__ */ t(nn, {
 		value: r === "letter",
 		children: /* @__PURE__ */ t("div", {
-			className: Qt({ variant: r }),
+			className: tn({ variant: r }),
 			"data-testid": n,
 			children: e
 		})
 	}),
 	Lede: ({ children: e }) => /* @__PURE__ */ t("p", {
-		className: en(),
+		className: rn(),
 		children: e
 	}),
 	Body: ({ color: e, children: n }) => /* @__PURE__ */ t("p", {
-		className: tn({
+		className: an({
 			color: e,
-			letter: c($t)
+			letter: c(nn)
 		}),
 		children: n
 	}),
 	Tail: ({ children: e }) => /* @__PURE__ */ t("p", {
-		className: nn(),
+		className: on(),
 		children: e
 	})
-}, G = "font-control text-body text-balance wrap-anywhere rounded-[var(--radius-control)] select-none inline-flex flex-row items-center justify-center gap-2", an = b("transition-colors duration-[var(--motion-duration-color)] cursor-pointer disabled:cursor-not-allowed outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]", {
+}, U = "font-control text-body text-balance wrap-anywhere rounded-[var(--radius-control)] select-none inline-flex flex-row items-center justify-center gap-2", cn = b("transition-colors duration-[var(--motion-duration-color)] cursor-pointer disabled:cursor-not-allowed outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]", {
 	variants: { variant: {
-		primary: `${G} px-4 sm:px-6 py-2 min-w-[min(var(--control-min-width),100%)] bg-primary text-primary-foreground hover:bg-primary-hover disabled:bg-disabled disabled:hover:bg-disabled-hover forced-colors:border`,
-		secondary: `${G} px-4 sm:px-6 py-2 min-w-[min(var(--control-min-width),100%)] bg-secondary text-secondary-foreground hover:bg-secondary-hover disabled:bg-disabled disabled:hover:bg-disabled-hover forced-colors:border`,
-		ghost: `${G} px-2 py-2 min-w-0 bg-transparent text-foreground hover:underline hover:decoration-[length:var(--underline-thickness)] hover:underline-offset-[var(--underline-offset)] disabled:bg-disabled disabled:hover:bg-disabled-hover`,
-		outlined: `${G} px-[calc(1rem_-_1px)] sm:px-[calc(1.5rem_-_1px)] py-[calc(0.5rem_-_1px)] min-w-[min(var(--control-min-width),100%)] border border-solid border-secondary bg-transparent text-secondary hover:bg-backing disabled:border-disabled disabled:text-muted disabled:hover:bg-transparent`,
-		destructive: `${G} px-4 sm:px-6 py-2 min-w-[min(var(--control-min-width),100%)] bg-error text-error-foreground hover:bg-error-hover disabled:bg-disabled disabled:hover:bg-disabled-hover forced-colors:border`,
+		primary: `${U} px-4 sm:px-6 py-2 min-w-[min(var(--control-min-width),100%)] bg-primary text-primary-foreground hover:bg-primary-hover disabled:bg-disabled disabled:hover:bg-disabled-hover forced-colors:border`,
+		secondary: `${U} px-4 sm:px-6 py-2 min-w-[min(var(--control-min-width),100%)] bg-secondary text-secondary-foreground hover:bg-secondary-hover disabled:bg-disabled disabled:hover:bg-disabled-hover forced-colors:border`,
+		ghost: `${U} px-2 py-2 min-w-0 bg-transparent text-foreground hover:underline hover:decoration-[length:var(--underline-thickness)] hover:underline-offset-[var(--underline-offset)] disabled:bg-disabled disabled:hover:bg-disabled-hover`,
+		outlined: `${U} px-[calc(1rem_-_1px)] sm:px-[calc(1.5rem_-_1px)] py-[calc(0.5rem_-_1px)] min-w-[min(var(--control-min-width),100%)] border border-solid border-secondary bg-transparent text-secondary hover:bg-backing disabled:border-disabled disabled:text-muted disabled:hover:bg-transparent`,
+		destructive: `${U} px-4 sm:px-6 py-2 min-w-[min(var(--control-min-width),100%)] bg-error text-error-foreground hover:bg-error-hover disabled:bg-disabled disabled:hover:bg-disabled-hover forced-colors:border`,
 		link: "inline p-0 min-w-0 max-w-full whitespace-normal wrap-anywhere bg-transparent [font:inherit] [letter-spacing:inherit] [text-align:inherit] text-link underline decoration-[length:var(--underline-thickness)] underline-offset-[var(--underline-offset)] enabled:hover:decoration-[length:var(--underline-thickness-hover)] disabled:text-disabled",
 		plain: "inline p-0 min-w-0 max-w-full whitespace-normal wrap-anywhere bg-transparent [font:inherit] [letter-spacing:inherit] [color:inherit] [text-align:inherit] disabled:text-disabled"
 	} },
 	defaultVariants: { variant: "primary" }
-}), on = ({ children: e, disabled: n, testId: r, variant: i, onClick$: a, ariaLabel: o, type: s = "button" }) => /* @__PURE__ */ t("button", {
+}), ln = ({ children: e, disabled: n, testId: r, variant: i, onClick$: a, ariaLabel: o, type: s = "button" }) => /* @__PURE__ */ t("button", {
 	type: s,
 	"data-testid": r,
-	className: an({ variant: i }),
+	className: cn({ variant: i }),
 	onClick: () => a?.next(),
 	disabled: n,
 	"aria-label": o,
 	children: e
-}), sn = class extends Error {
+}), un = class extends Error {
 	constructor(e) {
 		super(`Choices.${e} must be composed inside Choices.Root`), this.name = "ChoicesCompositionError";
 	}
-}, cn = b("flex min-w-0 gap-[var(--space-stack)]", {
+}, dn = b("flex min-w-0 gap-[var(--space-stack)]", {
 	variants: { arrangement: {
 		vertical: "flex-col [&>[role=radio]]:w-full",
 		wrapping: "flex-row flex-wrap items-start"
 	} },
 	defaultVariants: { arrangement: "vertical" }
-}), ln = b([
+}), fn = b([
 	"group/choice flex min-w-0 max-w-full flex-none flex-row items-start gap-3 text-left wrap-anywhere",
 	"rounded-[var(--radius-control)] border border-solid border-control-border bg-transparent aria-checked:border-foreground",
 	"px-3 py-2",
 	"cursor-pointer disabled:cursor-not-allowed",
 	"transition-colors duration-[var(--motion-duration-color)]",
 	"outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]"
-].join(" ")), un = a(void 0), dn = (e) => {
-	let t = c(un);
-	if (t === void 0) throw new sn(e);
+].join(" ")), pn = a(void 0), mn = (e) => {
+	let t = c(pn);
+	if (t === void 0) throw new un(e);
 	return t;
-}, fn = (e, t) => {
+}, hn = (e, t) => {
 	let n = e.closest("[role=\"radiogroup\"]");
 	if (n === null) return;
 	let r = Array.from(n.querySelectorAll(":scope > [role=\"radio\"]"));
 	return r[(r.indexOf(e) + t + r.length) % r.length];
-}, pn = {
+}, gn = {
 	ArrowDown: 1,
 	ArrowRight: 1,
 	ArrowUp: -1,
 	ArrowLeft: -1
-}, mn = {
-	Root: ({ arrangement: e, selected: n, onSelect$: r, label: i, inert: a, children: o, testId: s }) => /* @__PURE__ */ t(un.Provider, {
+}, _n = {
+	Root: ({ arrangement: e, selected: n, onSelect$: r, label: i, inert: a, children: o, testId: s }) => /* @__PURE__ */ t(pn.Provider, {
 		value: {
 			selected: n,
 			onSelect$: r,
@@ -1208,13 +1222,13 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			role: "radiogroup",
 			"aria-label": i,
 			"aria-disabled": a === !0 ? "true" : void 0,
-			className: cn({ arrangement: e }),
+			className: dn({ arrangement: e }),
 			"data-testid": s,
 			children: o
 		})
 	}),
 	Choice: ({ value: e, children: r, description: i, testId: a }) => {
-		let { selected: o, onSelect$: s, inert: c } = dn("Choice"), l = o === e, d = u(), f = `${d}-name`, p = `${d}-description`;
+		let { selected: o, onSelect$: s, inert: c } = mn("Choice"), l = o === e, d = u(), f = `${d}-name`, p = `${d}-description`;
 		return /* @__PURE__ */ n("button", {
 			type: "button",
 			role: "radio",
@@ -1225,15 +1239,15 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			disabled: c,
 			"data-value": e,
 			"data-testid": a,
-			className: ln(),
+			className: fn(),
 			onClick: () => {
 				l || s.next(e);
 			},
 			onKeyDown: (e) => {
-				let t = pn[e.key];
+				let t = gn[e.key];
 				if (t === void 0 || c) return;
 				e.preventDefault();
-				let n = fn(e.currentTarget, t);
+				let n = hn(e.currentTarget, t);
 				if (n === void 0) return;
 				n.focus();
 				let r = n.dataset.value;
@@ -1259,14 +1273,14 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			})]
 		});
 	}
-}, hn = b("block w-full rounded-[var(--radius-control)] border border-solid border-control-border bg-transparent px-3 py-2 font-control text-body text-foreground transition-colors duration-[var(--motion-duration-color)] outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)] [&:user-invalid]:border-error aria-[invalid=true]:border-error disabled:cursor-not-allowed disabled:border-disabled disabled:text-muted", {
+}, vn = b("block w-full rounded-[var(--radius-control)] border border-solid border-control-border bg-transparent px-3 py-2 font-control text-body text-foreground transition-colors duration-[var(--motion-duration-color)] outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)] [&:user-invalid]:border-error aria-[invalid=true]:border-error disabled:cursor-not-allowed disabled:border-disabled disabled:text-muted", {
 	variants: { variant: {
 		text: "",
 		email: "",
 		url: ""
 	} },
 	defaultVariants: { variant: "text" }
-}), gn = ({ label: e, name: r, variant: i, required: a, optionalLabel: o, invalid: s, disabled: c, defaultValue: d, placeholder: f, autocomplete: m, hint: h, errorMessage: g, onInput$: _, reset$: v, testId: y }) => {
+}), yn = ({ label: e, name: r, variant: i, required: a, optionalLabel: o, invalid: s, disabled: c, defaultValue: d, placeholder: f, autocomplete: m, hint: h, errorMessage: g, onInput$: _, reset$: v, testId: y }) => {
 	let b = u(), x = `${b}-control`, S = `${b}-hint`, C = `${b}-error`, w = [h ? S : void 0, s ? C : void 0].filter(Boolean).join(" ") || void 0, T = p(null);
 	return l(() => {
 		let e = v?.subscribe(() => {
@@ -1286,7 +1300,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 				id: x,
 				name: r,
 				type: i ?? "text",
-				className: hn({ variant: i }),
+				className: vn({ variant: i }),
 				required: a,
 				disabled: c,
 				defaultValue: d,
@@ -1313,7 +1327,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			})
 		]
 	});
-}, _n = b("outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]", {
+}, bn = b("outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]", {
 	variants: { treatment: {
 		prose: "text-link underline decoration-[length:var(--underline-thickness)] underline-offset-[var(--underline-offset)] hover:decoration-[length:var(--underline-thickness-hover)]",
 		quiet: "font-secondary text-muted no-underline decoration-[length:var(--underline-thickness)] underline-offset-[var(--underline-offset)] transition-colors duration-[var(--motion-duration-color)] hover:text-foreground hover:underline",
@@ -1321,15 +1335,15 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		graphic: "text-inherit no-underline"
 	} },
 	defaultVariants: { treatment: "prose" }
-}), vn = ({ href: e, children: n, treatment: r, external: i, current: a, testId: o }) => /* @__PURE__ */ t("a", {
+}), xn = ({ href: e, children: n, treatment: r, external: i, current: a, testId: o }) => /* @__PURE__ */ t("a", {
 	href: e,
-	className: _n({ treatment: r }),
+	className: bn({ treatment: r }),
 	target: i ? "_blank" : void 0,
 	rel: i ? "noopener noreferrer" : void 0,
 	"aria-current": a ? "page" : void 0,
 	"data-testid": o,
 	children: n
-}), yn = (e, t, n, r) => {
+}), Sn = (e, t, n, r) => {
 	let i = Math.max(e.length - 1, 0) * r;
 	if (e.reduce((e, t) => e + t, 0) + i <= n) return e.length;
 	let a = 0, o = t;
@@ -1338,11 +1352,11 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		o += t + r, a += 1;
 	}
 	return a;
-}, bn = class extends Error {
+}, Cn = class extends Error {
 	constructor(e) {
 		super(`MultiSelect.${e} must be composed inside MultiSelect.Root`), this.name = "MultiSelectCompositionError";
 	}
-}, xn = "outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]", Sn = `relative inline-flex shrink-0 cursor-pointer items-center rounded-[var(--radius-control)] bg-backing px-2 py-0.5 font-secondary text-small text-foreground disabled:cursor-not-allowed disabled:text-muted pointer-events-auto ${xn}`, K = b("", {
+}, wn = "outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]", Tn = `relative inline-flex shrink-0 cursor-pointer items-center rounded-[var(--radius-control)] bg-backing px-2 py-0.5 font-secondary text-small text-foreground disabled:cursor-not-allowed disabled:text-muted pointer-events-auto ${wn}`, W = b("", {
 	variants: { part: {
 		root: [
 			"relative flex flex-col gap-[var(--space-stack)]",
@@ -1355,7 +1369,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			"font-control text-body text-foreground transition-colors duration-[var(--motion-duration-color)]",
 			"data-[disabled]:border-disabled data-[disabled]:text-muted"
 		].join(" "),
-		trigger: `absolute inset-0 flex cursor-pointer items-center justify-end rounded-[var(--radius-control)] bg-transparent px-3 text-muted disabled:cursor-not-allowed ${xn}`,
+		trigger: `absolute inset-0 flex cursor-pointer items-center justify-end rounded-[var(--radius-control)] bg-transparent px-3 text-muted disabled:cursor-not-allowed ${wn}`,
 		clip: "relative min-w-0 flex-1 overflow-hidden p-[calc(var(--focus-ring-width)+var(--focus-ring-offset))] -m-[calc(var(--focus-ring-width)+var(--focus-ring-offset))] pointer-events-none",
 		track: "relative flex min-h-[calc(var(--text-body)*var(--leading-body))] items-center gap-1",
 		chip: [
@@ -1363,9 +1377,9 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			"rounded-[var(--radius-control)] bg-backing py-0.5 pr-0.5 pl-2 font-secondary text-small text-foreground",
 			"group-data-[disabled]/field:text-muted data-[overflow]:invisible data-[overflow]:absolute"
 		].join(" "),
-		count: Sn,
-		countMeasure: `${Sn} invisible absolute`,
-		iconButton: `relative inline-flex size-6 shrink-0 cursor-pointer items-center justify-center rounded-[var(--radius-control)] text-muted transition-colors duration-[var(--motion-duration-color)] hover:text-foreground disabled:cursor-not-allowed disabled:hover:text-muted ${xn}`,
+		count: Tn,
+		countMeasure: `${Tn} invisible absolute`,
+		iconButton: `relative inline-flex size-6 shrink-0 cursor-pointer items-center justify-center rounded-[var(--radius-control)] text-muted transition-colors duration-[var(--motion-duration-color)] hover:text-foreground disabled:cursor-not-allowed disabled:hover:text-muted ${wn}`,
 		surface: [
 			"absolute left-0 right-0 z-10 flex flex-col gap-1 overflow-y-auto p-1",
 			"rounded-[var(--radius-control)] border border-solid border-border bg-surface shadow-[var(--elevation-floating)]",
@@ -1374,22 +1388,22 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		].join(" ")
 	} },
 	defaultVariants: { part: "root" }
-}), Cn = b([
+}), En = b([
 	"group/option flex w-full flex-row items-center gap-3 text-left",
 	"rounded-[var(--radius-control)] bg-transparent px-3 py-2 hover:bg-backing",
 	"cursor-pointer disabled:cursor-not-allowed",
 	"transition-colors duration-[var(--motion-duration-color)]",
 	"outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]"
-].join(" ")), wn = 8, Tn = a(void 0), En = (e) => {
-	let t = c(Tn);
-	if (t === void 0) throw new bn(e);
+].join(" ")), Dn = 8, On = a(void 0), kn = (e) => {
+	let t = c(On);
+	if (t === void 0) throw new Cn(e);
 	return t;
-}, q = (e) => (t) => {
+}, G = (e) => (t) => {
 	e.current = t ?? void 0;
-}, Dn = (e) => e.getBoundingClientRect().width, On = (e) => r.toArray(e).flatMap((e) => {
+}, An = (e) => e.getBoundingClientRect().width, jn = (e) => r.toArray(e).flatMap((e) => {
 	if (!o(e)) return [];
-	if (e.type === i) return On(e.props.children);
-	if (e.type === Ln) {
+	if (e.type === i) return jn(e.props.children);
+	if (e.type === Bn) {
 		let { value: t, children: n } = e.props;
 		return [{
 			value: t,
@@ -1397,19 +1411,19 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		}];
 	}
 	return [];
-}), kn = (e) => Array.from(e.querySelectorAll("[data-multiselect-chip]:not([data-overflow]) button")), An = (e) => {
+}), Mn = (e) => Array.from(e.querySelectorAll("[data-multiselect-chip]:not([data-overflow]) button")), Nn = (e) => {
 	let t = document.activeElement;
 	return !e.contains(t) || t instanceof Element && t.closest("[data-overflow]") !== null;
-}, jn = (e) => e.querySelector("[role=\"checkbox\"][aria-checked=\"true\"]") ?? e.querySelector("[role=\"checkbox\"]") ?? void 0, Mn = (e, t) => [...new Set(e.map(({ value: e }) => e).filter((e) => t.has(e)))], Nn = (e) => e.kind === "firstOption" || !e.control.isConnected, Pn = (e, t, n, r) => {
+}, Pn = (e) => e.querySelector("[role=\"checkbox\"][aria-checked=\"true\"]") ?? e.querySelector("[role=\"checkbox\"]") ?? void 0, Fn = (e, t) => [...new Set(e.map(({ value: e }) => e).filter((e) => t.has(e)))], In = (e) => e.kind === "firstOption" || !e.control.isConnected, Ln = (e, t, n, r) => {
 	switch (e.kind) {
-		case "firstOption": return r === void 0 ? void 0 : jn(r);
+		case "firstOption": return r === void 0 ? void 0 : Pn(r);
 		case "afterRemoval": {
-			let r = kn(t);
+			let r = Mn(t);
 			return r[e.index] ?? r[e.index - 1] ?? n;
 		}
 		case "afterClear": return n;
 	}
-}, Fn = () => /* @__PURE__ */ t("svg", {
+}, Rn = () => /* @__PURE__ */ t("svg", {
 	"aria-hidden": !0,
 	focusable: !1,
 	viewBox: "0 0 16 16",
@@ -1421,8 +1435,8 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		strokeWidth: 1.5,
 		strokeLinecap: "round"
 	})
-}), In = ({ label: e, selected$: r, onChange$: i, emptyLabel: a, removeLabel: o, clearLabel: s, overflowLabel: c, hint: h, disabled: g, testId: _, children: v }) => {
-	let y = u(), b = `${y}-label`, x = `${y}-trigger`, S = `${y}-options`, C = `${y}-hint`, w = `${y}-empty`, T = g === !0, [ee, te] = m([]), [ne, E] = m(!1), [re, D] = m(void 0), [ie, ae] = m("below"), [, oe] = f((e) => e + 1, 0), O = p(void 0), k = p(void 0), A = p(void 0), j = p(void 0), M = p(void 0), N = p(void 0), P = p(!1), F = ne && !T, I = On(v), L = new Set(ee), R = I.filter((e) => L.has(e.value)), z = re === void 0 ? R.length : Math.min(re, R.length), se = R.length - z;
+}), zn = ({ label: e, selected$: r, onChange$: i, emptyLabel: a, removeLabel: o, clearLabel: s, overflowLabel: c, hint: h, disabled: g, testId: _, children: v }) => {
+	let y = u(), b = `${y}-label`, x = `${y}-trigger`, S = `${y}-options`, C = `${y}-hint`, w = `${y}-empty`, T = g === !0, [ee, te] = m([]), [ne, E] = m(!1), [re, ie] = m(void 0), [D, ae] = m("below"), [, oe] = f((e) => e + 1, 0), O = p(void 0), se = p(void 0), k = p(void 0), A = p(void 0), j = p(void 0), M = p(void 0), N = p(!1), P = ne && !T, ce = jn(v), F = new Set(ee), I = ce.filter((e) => F.has(e.value)), le = re === void 0 ? I.length : Math.min(re, I.length), L = I.length - le;
 	d(() => {
 		te([]);
 		let e = r.subscribe((e) => te(e));
@@ -1430,80 +1444,80 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 	}, [r]), l(() => {
 		T && E(!1);
 	}, [T]), d(() => {
-		let e = j.current;
+		let e = A.current;
 		if (e === void 0 || typeof ResizeObserver > "u") return;
 		let t = new ResizeObserver(() => oe());
 		return t.observe(e), () => t.disconnect();
 	}, []), d(() => {
-		let e = j.current;
+		let e = A.current;
 		if (e === void 0) return;
-		let t = Array.from(e.querySelectorAll("[data-multiselect-chip]")), n = e.querySelector("[data-multiselect-count]"), r = Number.parseFloat(getComputedStyle(e).columnGap) || 0, i = yn(t.map(Dn), n === null ? 0 : Dn(n), Dn(e), r);
-		D((e) => e === i ? e : i);
+		let t = Array.from(e.querySelectorAll("[data-multiselect-chip]")), n = e.querySelector("[data-multiselect-count]"), r = Number.parseFloat(getComputedStyle(e).columnGap) || 0, i = Sn(t.map(An), n === null ? 0 : An(n), An(e), r);
+		ie((e) => e === i ? e : i);
 	}), d(() => {
-		let e = k.current, t = M.current;
-		if (!F || e === void 0 || t === void 0) return;
-		let n = e.getBoundingClientRect(), r = window.innerHeight - n.bottom - wn, i = n.top - wn, a = t.scrollHeight > r && i > r;
+		let e = se.current, t = j.current;
+		if (!P || e === void 0 || t === void 0) return;
+		let n = e.getBoundingClientRect(), r = window.innerHeight - n.bottom - Dn, i = n.top - Dn, a = t.scrollHeight > r && i > r;
 		t.style.setProperty("--multiselect-surface-max-height", `${Math.max(a ? i : r, 0)}px`), ae(a ? "above" : "below");
 	}), l(() => {
-		if (!F) return;
+		if (!P) return;
 		let e = (e) => {
 			let t = O.current;
-			t !== void 0 && e.target instanceof Node && !t.contains(e.target) && (P.current = !1, N.current = void 0, E(!1));
+			t !== void 0 && e.target instanceof Node && !t.contains(e.target) && (N.current = !1, M.current = void 0, E(!1));
 		};
 		return document.addEventListener("pointerdown", e), () => document.removeEventListener("pointerdown", e);
-	}, [F]), d(() => {
-		let e = O.current, t = A.current;
+	}, [P]), d(() => {
+		let e = O.current, t = k.current;
 		if (e === void 0 || t === void 0) return;
-		let n = N.current;
-		n !== void 0 && Nn(n) ? (N.current = void 0, Pn(n, e, t, F ? M.current : void 0)?.focus()) : n === void 0 && P.current && An(e) && t.focus(), P.current = e.contains(document.activeElement);
+		let n = M.current;
+		n !== void 0 && In(n) ? (M.current = void 0, Ln(n, e, t, P ? j.current : void 0)?.focus()) : n === void 0 && N.current && Nn(e) && t.focus(), N.current = e.contains(document.activeElement);
 	});
-	let ce = (e) => {
-		i.next(Mn(I, e));
-	}, le = (e) => {
+	let ue = (e) => {
+		i.next(Fn(ce, e));
+	}, de = (e) => {
 		if (T) return;
-		let t = new Set(L);
-		t.delete(e) || t.add(e), ce(t);
-	}, B = (e, t) => (n) => {
+		let t = new Set(F);
+		t.delete(e) || t.add(e), ue(t);
+	}, fe = (e, t) => (n) => {
 		if (T) return;
-		document.activeElement === n.currentTarget && (N.current = {
+		document.activeElement === n.currentTarget && (M.current = {
 			kind: "afterRemoval",
 			index: t,
 			control: n.currentTarget
 		});
-		let r = new Set(L);
-		r.delete(e), ce(r);
-	}, ue = (e) => {
-		T || (document.activeElement === e.currentTarget && (N.current = {
+		let r = new Set(F);
+		r.delete(e), ue(r);
+	}, R = (e) => {
+		T || (document.activeElement === e.currentTarget && (M.current = {
 			kind: "afterClear",
 			control: e.currentTarget
 		}), i.next([]));
-	}, de = (e) => {
-		T || (e.detail === 0 && (N.current = { kind: "firstOption" }), E(!0));
-	}, V = (e) => {
-		F ? E(!1) : de(e);
-	}, fe = (e) => {
+	}, pe = (e) => {
+		T || (e.detail === 0 && (M.current = { kind: "firstOption" }), E(!0));
+	}, me = (e) => {
+		P ? E(!1) : pe(e);
+	}, z = (e) => {
 		if (e.key !== "ArrowDown" || T) return;
 		e.preventDefault();
+		let t = j.current;
+		P && t !== void 0 ? Pn(t)?.focus() : (M.current = { kind: "firstOption" }, E(!0));
+	}, he = (e) => {
+		e.key !== "Escape" || !P || (e.preventDefault(), e.stopPropagation(), E(!1), k.current?.focus());
+	}, B = (e) => {
+		N.current = !0;
 		let t = M.current;
-		F && t !== void 0 ? jn(t)?.focus() : (N.current = { kind: "firstOption" }, E(!0));
-	}, pe = (e) => {
-		e.key !== "Escape" || !F || (e.preventDefault(), e.stopPropagation(), E(!1), A.current?.focus());
-	}, H = (e) => {
-		P.current = !0;
-		let t = N.current;
-		t !== void 0 && t.kind !== "firstOption" && e.target !== t.control && (N.current = void 0);
-	}, me = (e) => {
+		t !== void 0 && t.kind !== "firstOption" && e.target !== t.control && (M.current = void 0);
+	}, V = (e) => {
 		let t = O.current, n = e.relatedTarget;
-		t !== void 0 && n instanceof Node && t.contains(n) || e.target.isConnected && (P.current = !1, N.current = void 0, E(!1));
-	}, he = (e) => {
+		t !== void 0 && n instanceof Node && t.contains(n) || e.target.isConnected && (N.current = !1, M.current = void 0, E(!1));
+	}, ge = (e) => {
 		(!(e.target instanceof Element) || e.target.closest("button") === null) && e.preventDefault();
-	}, ge = [R.length === 0 ? w : void 0, h ? C : void 0].filter(Boolean).join(" ") || void 0;
+	}, _e = [I.length === 0 ? w : void 0, h ? C : void 0].filter(Boolean).join(" ") || void 0;
 	return /* @__PURE__ */ n("div", {
-		ref: q(O),
-		className: K(),
-		onKeyDown: pe,
-		onFocus: H,
-		onBlur: me,
+		ref: G(O),
+		className: W(),
+		onKeyDown: he,
+		onFocus: B,
+		onBlur: V,
 		children: [
 			/* @__PURE__ */ t("label", {
 				id: b,
@@ -1511,24 +1525,24 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 				children: e
 			}),
 			/* @__PURE__ */ n("div", {
-				ref: q(k),
+				ref: G(se),
 				"data-multiselect-field": !0,
 				"data-disabled": T || void 0,
-				className: K({ part: "field" }),
+				className: W({ part: "field" }),
 				children: [
 					/* @__PURE__ */ t("button", {
-						ref: q(A),
+						ref: G(k),
 						id: x,
 						type: "button",
 						"aria-labelledby": b,
-						"aria-expanded": F,
-						"aria-controls": F ? S : void 0,
-						"aria-describedby": ge,
+						"aria-expanded": P,
+						"aria-controls": P ? S : void 0,
+						"aria-describedby": _e,
 						disabled: T,
 						"data-testid": _,
-						className: K({ part: "trigger" }),
-						onClick: V,
-						onKeyDown: fe,
+						className: W({ part: "trigger" }),
+						onClick: me,
+						onKeyDown: z,
 						children: /* @__PURE__ */ t("svg", {
 							"aria-hidden": !0,
 							focusable: !1,
@@ -1545,25 +1559,25 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 						})
 					}),
 					/* @__PURE__ */ t("div", {
-						className: K({ part: "clip" }),
+						className: W({ part: "clip" }),
 						children: /* @__PURE__ */ n("div", {
-							ref: q(j),
+							ref: G(A),
 							"data-multiselect-track": !0,
-							className: K({ part: "track" }),
+							className: W({ part: "track" }),
 							children: [
-								R.length === 0 && /* @__PURE__ */ t("span", {
+								I.length === 0 && /* @__PURE__ */ t("span", {
 									id: w,
 									className: "truncate text-muted",
 									children: a
 								}),
-								R.map(({ value: e, label: r }, i) => {
-									let a = i >= z;
+								I.map(({ value: e, label: r }, i) => {
+									let a = i >= le;
 									return /* @__PURE__ */ n("span", {
 										"data-multiselect-chip": !0,
 										"data-overflow": a || void 0,
 										"aria-hidden": a || void 0,
 										inert: a || void 0,
-										className: K({ part: "chip" }),
+										className: W({ part: "chip" }),
 										children: [/* @__PURE__ */ t("span", {
 											className: "truncate",
 											children: r
@@ -1572,35 +1586,35 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 											"aria-label": o.replaceAll("{label}", r),
 											disabled: T,
 											tabIndex: a ? -1 : void 0,
-											className: K({ part: "iconButton" }),
-											onClick: B(e, i),
-											children: /* @__PURE__ */ t(Fn, {})
+											className: W({ part: "iconButton" }),
+											onClick: fe(e, i),
+											children: /* @__PURE__ */ t(Rn, {})
 										})]
 									}, e);
 								}),
-								se > 0 && /* @__PURE__ */ t("button", {
+								L > 0 && /* @__PURE__ */ t("button", {
 									type: "button",
 									disabled: T,
-									className: K({ part: "count" }),
-									onClick: de,
-									children: c.replaceAll("{count}", String(se))
+									className: W({ part: "count" }),
+									onClick: pe,
+									children: c.replaceAll("{count}", String(L))
 								}),
-								R.length > 0 && /* @__PURE__ */ t("span", {
+								I.length > 0 && /* @__PURE__ */ t("span", {
 									"aria-hidden": !0,
 									"data-multiselect-count": !0,
-									className: K({ part: "countMeasure" }),
-									children: c.replaceAll("{count}", String(R.length))
+									className: W({ part: "countMeasure" }),
+									children: c.replaceAll("{count}", String(I.length))
 								})
 							]
 						})
 					}),
-					R.length > 0 ? /* @__PURE__ */ t("button", {
+					I.length > 0 ? /* @__PURE__ */ t("button", {
 						type: "button",
 						"aria-label": s,
 						disabled: T,
-						className: K({ part: "iconButton" }),
-						onClick: ue,
-						children: /* @__PURE__ */ t(Fn, {})
+						className: W({ part: "iconButton" }),
+						onClick: R,
+						children: /* @__PURE__ */ t(Rn, {})
 					}) : /* @__PURE__ */ t("span", {
 						"aria-hidden": !0,
 						className: "size-6 shrink-0"
@@ -1609,19 +1623,19 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 						"aria-hidden": !0,
 						className: "size-6 shrink-0"
 					}),
-					F && /* @__PURE__ */ t("div", {
-						ref: q(M),
+					P && /* @__PURE__ */ t("div", {
+						ref: G(j),
 						id: S,
 						role: "group",
 						"aria-labelledby": b,
-						"data-placement": ie,
-						className: K({ part: "surface" }),
-						onMouseDown: he,
-						children: /* @__PURE__ */ t(Tn, {
+						"data-placement": D,
+						className: W({ part: "surface" }),
+						onMouseDown: ge,
+						children: /* @__PURE__ */ t(On, {
 							value: {
-								selected: L,
+								selected: F,
 								disabled: T,
-								toggle: le
+								toggle: de
 							},
 							children: v
 						})
@@ -1634,15 +1648,15 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			})
 		]
 	});
-}, Ln = ({ value: e, children: r, testId: i }) => {
-	let { selected: a, disabled: o, toggle: s } = En("Option"), c = a.has(e);
+}, Bn = ({ value: e, children: r, testId: i }) => {
+	let { selected: a, disabled: o, toggle: s } = kn("Option"), c = a.has(e);
 	return /* @__PURE__ */ n("button", {
 		type: "button",
 		role: "checkbox",
 		"aria-checked": c,
 		disabled: o,
 		"data-testid": i,
-		className: Cn(),
+		className: En(),
 		onClick: () => s(e),
 		children: [/* @__PURE__ */ t("span", {
 			className: "flex size-[var(--choice-marker-size)] shrink-0 items-center justify-center border border-solid border-control-border group-aria-checked/option:border-foreground",
@@ -1665,10 +1679,10 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			children: r
 		})]
 	});
-}, Rn = {
-	Root: In,
-	Option: Ln
-}, zn = b("block w-full rounded-[var(--radius-control)] border border-solid border-control-border bg-transparent px-3 py-2 font-control text-body text-foreground transition-colors duration-[var(--motion-duration-color)] outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)] [&:user-invalid]:border-error aria-[invalid=true]:border-error disabled:cursor-not-allowed disabled:border-disabled disabled:text-muted"), Bn = ({ label: e, name: r, required: i, optionalLabel: a, hint: o, invalid: s, errorMessage: c, disabled: d, placeholder: f, defaultValue: m, onInput$: h, reset$: g, testId: _ }) => {
+}, Vn = {
+	Root: zn,
+	Option: Bn
+}, Hn = b("block w-full rounded-[var(--radius-control)] border border-solid border-control-border bg-transparent px-3 py-2 font-control text-body text-foreground transition-colors duration-[var(--motion-duration-color)] outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)] [&:user-invalid]:border-error aria-[invalid=true]:border-error disabled:cursor-not-allowed disabled:border-disabled disabled:text-muted"), Un = ({ label: e, name: r, required: i, optionalLabel: a, hint: o, invalid: s, errorMessage: c, disabled: d, placeholder: f, defaultValue: m, onInput$: h, reset$: g, testId: _ }) => {
 	let v = u(), y = `${v}-control`, b = `${v}-hint`, x = `${v}-error`, S = [o ? b : void 0, s ? x : void 0].filter(Boolean).join(" ") || void 0, C = p(null);
 	return l(() => {
 		let e = g?.subscribe(() => {
@@ -1689,7 +1703,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 				name: r,
 				type: "text",
 				inputMode: "decimal",
-				className: zn(),
+				className: Hn(),
 				required: i,
 				disabled: d,
 				defaultValue: m,
@@ -1715,7 +1729,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			})
 		]
 	});
-}, Vn = b([
+}, Wn = b([
 	"flex flex-col gap-[var(--space-stack)]",
 	"[&>label]:font-secondary [&>label]:font-medium [&>label]:text-body [&>label]:text-foreground",
 	"[&>span]:font-secondary [&>span]:text-muted [&>span]:text-small",
@@ -1724,11 +1738,11 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 	"[&>select]:font-control [&>select]:text-body [&>select]:text-foreground [&>select]:transition-colors [&>select]:duration-[var(--motion-duration-color)]",
 	"[&>select]:outline-focus-ring [&>select]:outline-offset-[var(--focus-ring-offset)] [&>select]:focus-visible:outline [&>select]:focus-visible:outline-[length:var(--focus-ring-width)]",
 	"[&>select:user-invalid]:border-error [&>select]:aria-[invalid=true]:border-error [&>select]:disabled:cursor-not-allowed [&>select]:disabled:border-disabled [&>select]:disabled:text-muted"
-].join(" ")), Hn = {
+].join(" ")), Gn = {
 	Root: ({ label: e, name: r, required: i, optionalLabel: a, disabled: o, invalid: s, hint: c, errorMessage: l, testId: d, defaultValue: f, onChange$: p, placeholder: m, children: h }) => {
 		let g = u(), _ = `${g}-control`, v = `${g}-hint`, y = `${g}-error`, b = [c ? v : void 0, s && l ? y : void 0].filter(Boolean).join(" ") || void 0;
 		return /* @__PURE__ */ n("div", {
-			className: Vn(),
+			className: Wn(),
 			children: [
 				/* @__PURE__ */ t("label", {
 					htmlFor: _,
@@ -1767,11 +1781,11 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		"data-testid": r,
 		children: n
 	})
-}, J = class extends Error {
+}, K = class extends Error {
 	constructor(e) {
 		super(`Slider configuration: ${e}`), this.name = "SliderConfigurationError";
 	}
-}, Un = b([
+}, Kn = b([
 	"block h-[var(--slider-thumb-size)] w-full cursor-pointer appearance-none bg-transparent",
 	"disabled:cursor-not-allowed",
 	"outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]",
@@ -1782,46 +1796,55 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 	"[&::-moz-range-track]:h-[var(--slider-track-thickness)] [&::-moz-range-track]:rounded-[var(--radius-control)] [&::-moz-range-track]:bg-control-border",
 	"[&::-moz-range-thumb]:size-[var(--slider-thumb-size)] [&::-moz-range-thumb]:rounded-[var(--radius-control)] [&::-moz-range-thumb]:border-none [&::-moz-range-thumb]:bg-foreground",
 	"[&:disabled::-moz-range-track]:bg-disabled [&:disabled::-moz-range-thumb]:bg-disabled"
-].join(" ")), Wn = (e) => {
-	for (let [t, n] of Object.entries(e)) if (!Number.isFinite(n)) throw new J(`\`${t}\` must be a finite number, got ${n}`);
-	if (e.min >= e.max) throw new J(`\`min\` (${e.min}) must be below \`max\` (${e.max})`);
-	if (e.step <= 0) throw new J(`\`step\` (${e.step}) must be positive`);
-}, Gn = ({ min: e, max: r, step: i = 1, value: a, onInput$: o, label: s, valueText: c, disabled: l, testId: d }) => {
-	let f = `${u()}-control`;
-	return Wn({
+].join(" ")), qn = (e) => {
+	for (let [t, n] of Object.entries(e)) if (!Number.isFinite(n)) throw new K(`\`${t}\` must be a finite number, got ${n}`);
+	if (e.min >= e.max) throw new K(`\`min\` (${e.min}) must be below \`max\` (${e.max})`);
+	if (e.step <= 0) throw new K(`\`step\` (${e.step}) must be positive`);
+}, Jn = ({ min: e, max: r, step: i = 1, value: a, onInput$: o, label: s, visibleValue: c, valueText: l, disabled: d, testId: f }) => {
+	let p = `${u()}-control`;
+	qn({
 		min: e,
 		max: r,
 		step: i,
 		value: a
-	}), /* @__PURE__ */ n("div", {
+	});
+	let m = /* @__PURE__ */ t("label", {
+		htmlFor: p,
+		className: "font-secondary font-medium text-body text-foreground",
+		children: s
+	});
+	return /* @__PURE__ */ n("div", {
 		className: "flex flex-col gap-[var(--space-stack)]",
-		children: [/* @__PURE__ */ t("label", {
-			htmlFor: f,
-			className: "font-secondary font-medium text-body text-foreground",
-			children: s
+		children: [c === void 0 ? m : /* @__PURE__ */ n("div", {
+			className: "flex flex-wrap items-baseline justify-between gap-x-[var(--space-stack)]",
+			children: [m, /* @__PURE__ */ t("span", {
+				"aria-hidden": !0,
+				className: "min-w-0 wrap-anywhere font-secondary text-body text-foreground",
+				children: c
+			})]
 		}), /* @__PURE__ */ t("input", {
-			id: f,
+			id: p,
 			type: "range",
-			className: Un(),
+			className: Kn(),
 			min: e,
 			max: r,
 			step: i,
 			value: a,
-			disabled: l,
-			"aria-valuetext": c,
-			"data-testid": d,
+			disabled: d,
+			"aria-valuetext": l ?? c,
+			"data-testid": f,
 			onChange: (e) => o.next(e.currentTarget.valueAsNumber)
 		})]
 	});
-}, Kn = class extends Error {
+}, Yn = class extends Error {
 	constructor(e) {
 		super(`Stepper.${e} must be composed inside Stepper.Root`), this.name = "StepperCompositionError";
 	}
-}, qn = b("flex h-full min-h-0 min-w-0 flex-col gap-[var(--space-stack)]"), Jn = b([
+}, Xn = b("flex h-full min-h-0 min-w-0 flex-col gap-[var(--space-stack)]"), Zn = b([
 	"flex flex-row shrink-0 min-w-0 overflow-x-auto",
 	"p-[calc(var(--focus-ring-width)+var(--focus-ring-offset))]",
 	"scroll-p-[calc(var(--focus-ring-width)+var(--focus-ring-offset))]"
-].join(" ")), Yn = b([
+].join(" ")), Qn = b([
 	"relative isolate flex flex-1 flex-col items-center gap-[var(--space-stack)] text-center",
 	"font-secondary text-label text-foreground cursor-pointer select-none",
 	"px-[var(--step-inset-inline)] py-[var(--step-inset-block)]",
@@ -1834,28 +1857,28 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 	"forced-colors:after:border-[CanvasText] forced-colors:aria-selected:border-[Highlight]",
 	"forced-colors:border-b-0 forced-colors:aria-selected:border-b-[length:var(--step-selection-thickness)]",
 	"forced-colors:[&>[data-marker]]:bg-[Canvas] forced-colors:[&>[data-marker]]:text-[CanvasText] forced-colors:[&>[data-marker]]:border-[CanvasText]"
-]), Xn = b("min-h-0 min-w-0 flex-auto outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]"), Zn = a(void 0), Qn = (e) => r.toArray(e).flatMap((e) => o(e) && e.type === i ? Qn(e.props.children) : [e]), $n = a(void 0), er = (e) => {
-	let t = c($n);
-	if (t === void 0) throw new Kn(e);
+]), $n = b("min-h-0 min-w-0 flex-auto outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]"), er = a(void 0), tr = (e) => r.toArray(e).flatMap((e) => o(e) && e.type === i ? tr(e.props.children) : [e]), nr = a(void 0), rr = (e) => {
+	let t = c(nr);
+	if (t === void 0) throw new Yn(e);
 	return t;
-}, tr = (e) => e.split("").map((e) => e.charCodeAt(0).toString(16).padStart(4, "0")).join(""), nr = (e) => {
+}, ir = (e) => e.split("").map((e) => e.charCodeAt(0).toString(16).padStart(4, "0")).join(""), ar = (e) => {
 	e.currentTarget.scrollIntoView({
 		block: "nearest",
 		inline: "nearest"
 	});
-}, Y = (e, t) => `${e}tab-${tr(t)}`, rr = (e, t) => `${e}panel-${tr(t)}`, ir = (e, t) => {
+}, q = (e, t) => `${e}tab-${ir(t)}`, or = (e, t) => `${e}panel-${ir(t)}`, sr = (e, t) => {
 	let n = e.closest("[role=\"tablist\"]");
 	if (n === null) return;
 	let r = Array.from(n.querySelectorAll(":scope > [role=\"tab\"]"));
 	return r[(r.indexOf(e) + t + r.length) % r.length];
-}, ar = {
+}, cr = {
 	Root: ({ active$: e, onSelect$: n, label: r, children: i, testId: a }) => {
 		let o = u(), [s, c] = m();
 		return l(() => {
 			c(void 0);
 			let t = e.subscribe(c);
 			return () => t.unsubscribe();
-		}, [e]), /* @__PURE__ */ t($n.Provider, {
+		}, [e]), /* @__PURE__ */ t(nr.Provider, {
 			value: {
 				active: s,
 				onSelect$: n,
@@ -1863,52 +1886,53 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 				baseId: o
 			},
 			children: /* @__PURE__ */ t("div", {
-				className: qn(),
+				className: Xn(),
+				"data-height-passing": !0,
 				"data-testid": a,
 				children: i
 			})
 		});
 	},
 	List: ({ children: e, testId: n }) => {
-		let { label: r } = er("List");
+		let { label: r } = rr("List");
 		return /* @__PURE__ */ t("div", {
 			role: "tablist",
 			"aria-label": r,
-			className: Jn(),
+			className: Zn(),
 			"data-testid": n,
-			children: Qn(e).map((e, n) => /* @__PURE__ */ t(Zn.Provider, {
+			children: tr(e).map((e, n) => /* @__PURE__ */ t(er.Provider, {
 				value: n + 1,
 				children: e
 			}, o(e) ? e.props.value : n))
 		});
 	},
 	Step: ({ value: e, label: r, status: i, valueText: a, statusContent: o, testId: s }) => {
-		let { active: l, onSelect$: u, baseId: d } = er("Step"), f = c(Zn);
-		if (f === void 0) throw new Kn("Step (inside List)");
+		let { active: l, onSelect$: u, baseId: d } = rr("Step"), f = c(er);
+		if (f === void 0) throw new Yn("Step (inside List)");
 		let p = l === e;
 		return /* @__PURE__ */ n("button", {
 			type: "button",
 			role: "tab",
-			id: Y(d, e),
+			id: q(d, e),
 			"aria-selected": p,
-			"aria-controls": rr(d, e),
-			"aria-labelledby": `${Y(d, e)}-label ${Y(d, e)}-value`,
-			"aria-describedby": o === void 0 ? void 0 : `${Y(d, e)}-status`,
+			"aria-controls": or(d, e),
+			"aria-labelledby": `${q(d, e)}-label ${q(d, e)}-value`,
+			"aria-describedby": o === void 0 ? void 0 : `${q(d, e)}-status`,
 			tabIndex: p ? 0 : -1,
 			"data-value": e,
 			"data-testid": s,
-			className: Yn(),
+			className: Qn(),
 			onClick: () => u.next(e),
 			onKeyDown: (e) => {
 				if (e.key !== "ArrowLeft" && e.key !== "ArrowRight") return;
 				e.preventDefault();
-				let t = ir(e.currentTarget, e.key === "ArrowRight" ? 1 : -1);
+				let t = sr(e.currentTarget, e.key === "ArrowRight" ? 1 : -1);
 				if (t === void 0) return;
 				t.focus();
 				let n = t.dataset.value;
 				n !== void 0 && u.next(n);
 			},
-			onFocus: nr,
+			onFocus: ar,
 			children: [
 				/* @__PURE__ */ t("span", {
 					"data-marker": !0,
@@ -1916,36 +1940,37 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 					children: i === "done" ? "✓" : i === "blocked" ? "⊘" : f
 				}),
 				/* @__PURE__ */ t("span", {
-					id: `${Y(d, e)}-label`,
+					id: `${q(d, e)}-label`,
 					children: r
 				}),
 				/* @__PURE__ */ t("span", {
 					"data-value-text": !0,
-					id: `${Y(d, e)}-value`,
+					id: `${q(d, e)}-value`,
 					children: a
 				}),
 				o === void 0 ? void 0 : /* @__PURE__ */ t("span", {
 					"data-status-content": !0,
-					id: `${Y(d, e)}-status`,
+					id: `${q(d, e)}-status`,
 					children: o
 				})
 			]
 		});
 	},
 	Panel: ({ value: e, children: n, testId: r }) => {
-		let { active: i, baseId: a } = er("Panel"), o = i === e;
+		let { active: i, baseId: a } = rr("Panel"), o = i === e;
 		return /* @__PURE__ */ t("div", {
 			role: "tabpanel",
-			id: rr(a, e),
-			"aria-labelledby": Y(a, e),
+			id: or(a, e),
+			"aria-labelledby": q(a, e),
 			hidden: !o,
 			tabIndex: o ? 0 : void 0,
-			className: Xn(),
+			className: $n(),
+			"data-height-passing": !0,
 			"data-testid": r,
 			children: o ? n : void 0
 		});
 	}
-}, or = b([
+}, lr = b([
 	"inline-flex max-w-full items-center gap-[var(--space-stack)] rounded-[var(--radius-control)] bg-transparent p-0 text-start cursor-pointer",
 	"font-secondary font-medium text-body text-foreground disabled:text-muted disabled:cursor-not-allowed",
 	"outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]",
@@ -1957,7 +1982,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 	"forced-colors:[&>[data-track]]:[forced-color-adjust:none] forced-colors:[&>[data-track]]:border-[ButtonText] forced-colors:[&>[data-track]]:bg-[Canvas] forced-colors:[&>[data-track]::before]:bg-[ButtonText]",
 	"forced-colors:disabled:text-[GrayText] forced-colors:disabled:[&>[data-track]]:border-[GrayText] forced-colors:disabled:[&>[data-track]::before]:bg-[GrayText]",
 	"[&>[data-label]]:min-w-0 [&>[data-label]]:wrap-anywhere"
-]), sr = ({ label: e, checked$: r, onChange$: i, disabled: a, testId: o }) => {
+]), ur = ({ label: e, checked$: r, onChange$: i, disabled: a, testId: o }) => {
 	let [s, c] = m(!1);
 	return l(() => {
 		c(!1);
@@ -1969,7 +1994,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		"aria-checked": s,
 		disabled: a,
 		"data-testid": o,
-		className: or(),
+		className: lr(),
 		onClick: () => i.next(!s),
 		children: [/* @__PURE__ */ t("span", {
 			"data-track": !0,
@@ -1979,17 +2004,17 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			children: e
 		})]
 	});
-}, cr = class extends Error {
+}, dr = class extends Error {
 	constructor(e) {
 		super(`Tabs.${e} must be composed inside Tabs.Root`), this.name = "TabsCompositionError";
 	}
-}, lr = b("", {
+}, fr = b("", {
 	variants: { fill: {
 		true: "flex h-full min-h-0 min-w-0 flex-col",
 		false: ""
 	} },
 	defaultVariants: { fill: !1 }
-}), ur = b([
+}), pr = b([
 	"flex flex-row overflow-x-auto",
 	"p-[calc(var(--focus-ring-width)+var(--focus-ring-offset))]",
 	"m-[calc(-1*(var(--focus-ring-width)+var(--focus-ring-offset)))]",
@@ -1997,34 +2022,34 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 ].join(" "), { variants: { fill: {
 	true: "shrink-0",
 	false: ""
-} } }), dr = b([
+} } }), mr = b([
 	"font-secondary text-label tracking-label",
 	"text-muted hover:text-foreground aria-selected:text-foreground",
 	"border-b-[length:var(--tab-marker-thickness)] border-solid border-transparent aria-selected:border-foreground",
 	"cursor-pointer select-none px-[var(--tab-inset-inline)] py-[var(--tab-inset-block)]",
 	"transition-colors duration-[var(--motion-duration-color)]",
 	"outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]"
-].join(" ")), fr = b("outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]", { variants: { fill: {
+].join(" ")), hr = b("outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]", { variants: { fill: {
 	true: "min-h-0 min-w-0 flex-auto",
 	false: ""
-} } }), pr = a(void 0), mr = (e) => {
-	let t = c(pr);
-	if (t === void 0) throw new cr(e);
+} } }), gr = a(void 0), _r = (e) => {
+	let t = c(gr);
+	if (t === void 0) throw new dr(e);
 	return t;
-}, hr = (e) => e.split("").map((e) => e.charCodeAt(0).toString(16).padStart(4, "0")).join(""), gr = (e) => {
+}, vr = (e) => e.split("").map((e) => e.charCodeAt(0).toString(16).padStart(4, "0")).join(""), yr = (e) => {
 	e.currentTarget.scrollIntoView({
 		block: "nearest",
 		inline: "nearest"
 	});
-}, _r = (e, t) => `${e}tab-${hr(t)}`, vr = (e, t) => `${e}panel-${hr(t)}`, yr = (e, t) => {
+}, br = (e, t) => `${e}tab-${vr(t)}`, xr = (e, t) => `${e}panel-${vr(t)}`, Sr = (e, t) => {
 	let n = e.closest("[role=\"tablist\"]");
 	if (n === null) return;
 	let r = Array.from(n.querySelectorAll(":scope > [role=\"tab\"]"));
 	return r[(r.indexOf(e) + t + r.length) % r.length];
-}, br = {
+}, Cr = {
 	Root: ({ active: e, onSelect$: n, label: r, fill: i, children: a, testId: o }) => {
 		let s = u();
-		return /* @__PURE__ */ t(pr.Provider, {
+		return /* @__PURE__ */ t(gr.Provider, {
 			value: {
 				active: e,
 				onSelect$: n,
@@ -2033,62 +2058,64 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 				fill: i === !0
 			},
 			children: /* @__PURE__ */ t("div", {
-				className: lr({ fill: i }),
+				className: fr({ fill: i }),
+				"data-height-passing": i || void 0,
 				"data-testid": o,
 				children: a
 			})
 		});
 	},
 	List: ({ children: e, testId: n }) => {
-		let { label: r, fill: i } = mr("List");
+		let { label: r, fill: i } = _r("List");
 		return /* @__PURE__ */ t("div", {
 			role: "tablist",
 			"aria-label": r,
-			className: ur({ fill: i }),
+			className: pr({ fill: i }),
 			"data-testid": n,
 			children: e
 		});
 	},
 	Tab: ({ value: e, children: n, testId: r }) => {
-		let { active: i, onSelect$: a, baseId: o } = mr("Tab"), s = i === e;
+		let { active: i, onSelect$: a, baseId: o } = _r("Tab"), s = i === e;
 		return /* @__PURE__ */ t("button", {
 			type: "button",
 			role: "tab",
-			id: _r(o, e),
+			id: br(o, e),
 			"aria-selected": s,
-			"aria-controls": vr(o, e),
+			"aria-controls": xr(o, e),
 			tabIndex: s ? 0 : -1,
 			"data-value": e,
 			"data-testid": r,
-			className: dr(),
+			className: mr(),
 			onClick: () => a.next(e),
 			onKeyDown: (e) => {
 				if (e.key !== "ArrowLeft" && e.key !== "ArrowRight") return;
 				e.preventDefault();
-				let t = yr(e.currentTarget, e.key === "ArrowRight" ? 1 : -1);
+				let t = Sr(e.currentTarget, e.key === "ArrowRight" ? 1 : -1);
 				if (t === void 0) return;
 				t.focus();
 				let n = t.dataset.value;
 				n !== void 0 && a.next(n);
 			},
-			onFocus: gr,
+			onFocus: yr,
 			children: n
 		});
 	},
 	Panel: ({ value: e, children: n, testId: r }) => {
-		let { active: i, baseId: a, fill: o } = mr("Panel"), s = i === e;
+		let { active: i, baseId: a, fill: o } = _r("Panel"), s = i === e;
 		return /* @__PURE__ */ t("div", {
 			role: "tabpanel",
-			id: vr(a, e),
-			"aria-labelledby": _r(a, e),
+			id: xr(a, e),
+			"aria-labelledby": br(a, e),
 			hidden: !s,
 			tabIndex: s ? 0 : void 0,
-			className: fr({ fill: o }),
+			className: hr({ fill: o }),
+			"data-height-passing": o || void 0,
 			"data-testid": r,
 			children: s ? n : void 0
 		});
 	}
-}, xr = b("block min-h-24 w-full rounded-[var(--radius-control)] border border-solid border-control-border bg-transparent px-3 py-2 font-control text-body text-foreground transition-colors duration-[var(--motion-duration-color)] outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)] [&:user-invalid]:border-error aria-[invalid=true]:border-error disabled:cursor-not-allowed disabled:border-disabled disabled:text-muted"), Sr = ({ label: e, name: r, required: i, optionalLabel: a, invalid: o, disabled: s, defaultValue: c, placeholder: d, autocomplete: f, hint: m, errorMessage: h, onInput$: g, reset$: _, testId: v }) => {
+}, wr = b("block min-h-24 w-full rounded-[var(--radius-control)] border border-solid border-control-border bg-transparent px-3 py-2 font-control text-body text-foreground transition-colors duration-[var(--motion-duration-color)] outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)] [&:user-invalid]:border-error aria-[invalid=true]:border-error disabled:cursor-not-allowed disabled:border-disabled disabled:text-muted"), Tr = ({ label: e, name: r, required: i, optionalLabel: a, invalid: o, disabled: s, defaultValue: c, placeholder: d, autocomplete: f, hint: m, errorMessage: h, onInput$: g, reset$: _, testId: v }) => {
 	let y = u(), b = `${y}-control`, x = `${y}-hint`, S = `${y}-error`, C = [m ? x : void 0, o ? S : void 0].filter(Boolean).join(" ") || void 0, w = p(null);
 	return l(() => {
 		let e = _?.subscribe(() => {
@@ -2107,7 +2134,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 				ref: w,
 				id: b,
 				name: r,
-				className: xr(),
+				className: wr(),
 				required: i,
 				disabled: s,
 				defaultValue: c,
@@ -2134,49 +2161,49 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			})
 		]
 	});
-}, Cr = b([
+}, Er = b([
 	"flex flex-col items-center",
 	"min-h-[var(--cover-height)]",
 	"px-[var(--gutter)] py-[var(--space-region)]"
-].join(" ")), wr = "my-auto max-w-full", Tr = ({ children: e, foot: r, testId: i }) => {
+].join(" ")), Dr = "my-auto max-w-full", Or = ({ children: e, foot: r, testId: i }) => {
 	let a = r != null && typeof r != "boolean";
 	return /* @__PURE__ */ n("div", {
-		className: Cr(),
+		className: Er(),
 		"data-testid": i,
 		children: [/* @__PURE__ */ t("div", {
-			className: wr,
+			className: Dr,
 			children: e
 		}), a && /* @__PURE__ */ t("div", { children: r })]
 	});
-}, Er = class extends Error {
+}, kr = class extends Error {
 	constructor(e) {
 		super(`Dialog.${e} must be composed inside Dialog.Root`), this.name = "DialogCompositionError";
 	}
-}, Dr = class extends Error {
+}, Ar = class extends Error {
 	constructor() {
 		super("A Dialog takes exactly one accessible naming source: a visible Dialog.Title or ariaLabel on Dialog.Root, never both"), this.name = "DialogNamingError";
 	}
-}, X = (e) => Number.parseFloat(e) || 0, Or = (e) => X(e.paddingTop) + X(e.paddingBottom) + X(e.borderTopWidth) + X(e.borderBottomWidth), kr = (e) => {
+}, J = (e) => Number.parseFloat(e) || 0, Y = (e) => J(e.paddingTop) + J(e.paddingBottom) + J(e.borderTopWidth) + J(e.borderBottomWidth), jr = (e) => {
 	let t = getComputedStyle(e);
-	return X(t.marginTop) + X(t.marginBottom);
-}, Ar = (e) => {
+	return J(t.marginTop) + J(t.marginBottom);
+}, Mr = (e) => {
 	let t = getComputedStyle(e);
 	if (t.display === "none" || t.position === "absolute") return 0;
 	if (e.matches("table")) return Array.from(e.children).filter((e) => e.matches("caption, thead")).reduce((e, t) => e + t.getBoundingClientRect().height, 0) + Math.max(0, ...Array.from(e.querySelectorAll("tbody>tr")).map((e) => e.getBoundingClientRect().height));
 	if (e.querySelector("table")) {
 		let n = Array.from(e.children);
-		return Or(t) + Math.max(0, n.length - 1) * X(t.rowGap) + n.reduce((e, t) => e + kr(t) + (t.matches("table") || t.querySelector("table") ? Ar(t) : t.getBoundingClientRect().height), 0);
+		return Y(t) + Math.max(0, n.length - 1) * J(t.rowGap) + n.reduce((e, t) => e + jr(t) + (t.matches("table") || t.querySelector("table") ? Mr(t) : t.getBoundingClientRect().height), 0);
 	}
-	let n = Math.max(X(t.lineHeight) || X(t.fontSize), ...Array.from(e.querySelectorAll("button, input, select, textarea, [role=\"button\"]")).map((e) => e.getBoundingClientRect().height)), r = X(t.getPropertyValue("--focus-ring-width")) + X(t.getPropertyValue("--focus-ring-offset"));
-	return Or(t) + n + 2 * r;
-}, jr = (e) => {
+	let n = Math.max(J(t.lineHeight) || J(t.fontSize), ...Array.from(e.querySelectorAll("button, input, select, textarea, [role=\"button\"]")).map((e) => e.getBoundingClientRect().height)), r = J(t.getPropertyValue("--focus-ring-width")) + J(t.getPropertyValue("--focus-ring-offset"));
+	return Y(t) + n + 2 * r;
+}, Nr = (e) => {
 	let [t, n] = m(!1);
 	return d(() => {
 		let t = e.current;
 		if (!t) return;
 		let r = () => {
 			if (!t.open) return;
-			let e = getComputedStyle(t), r = e.maxHeight === "none" ? X(e.height) : X(e.maxHeight), i = Array.from(t.children).reduce((e, t) => e + kr(t) + (t.getAttribute("data-dialog-member") === "content" ? Ar(t) : t.getBoundingClientRect().height), Or(e));
+			let e = getComputedStyle(t), r = e.maxHeight === "none" ? J(e.height) : J(e.maxHeight), i = Array.from(t.children).reduce((e, t) => e + jr(t) + (t.getAttribute("data-dialog-member") === "content" ? Mr(t) : t.getBoundingClientRect().height), Y(e));
 			n(r < i);
 		}, i = typeof ResizeObserver > "u" ? void 0 : new ResizeObserver(r), a = () => {
 			i?.disconnect(), i?.observe(t);
@@ -2201,23 +2228,23 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			inline: "nearest"
 		});
 	}, [e, t]), t;
-}, Mr = /* @__PURE__ */ new WeakMap(), Nr = (e) => {
-	let t = e.ownerDocument.documentElement, n = Mr.get(t);
+}, Pr = /* @__PURE__ */ new WeakMap(), Fr = (e) => {
+	let t = e.ownerDocument.documentElement, n = Pr.get(t);
 	n === void 0 && (n = {
 		overflow: t.style.getPropertyValue("overflow"),
 		priority: t.style.getPropertyPriority("overflow"),
 		dialogs: /* @__PURE__ */ new Set()
-	}, Mr.set(t, n), t.style.setProperty("overflow", "hidden"));
+	}, Pr.set(t, n), t.style.setProperty("overflow", "hidden"));
 	let r = n;
 	return r.dialogs.add(e), () => {
-		r.dialogs.delete(e), r.dialogs.size === 0 && (t.style.setProperty("overflow", r.overflow, r.priority), Mr.delete(t));
+		r.dialogs.delete(e), r.dialogs.size === 0 && (t.style.setProperty("overflow", r.overflow, r.priority), Pr.delete(t));
 	};
-}, Pr = (e) => {
+}, Ir = (e) => {
 	d(() => {
 		let t = e.current;
 		if (!t) return;
 		let n, r = () => {
-			t.open && n === void 0 ? n = Nr(t) : !t.open && n !== void 0 && (n(), n = void 0);
+			t.open && n === void 0 ? n = Fr(t) : !t.open && n !== void 0 && (n(), n = void 0);
 		};
 		r();
 		let i = new MutationObserver(r);
@@ -2228,7 +2255,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			i.disconnect(), n?.();
 		};
 	}, [e]);
-}, Fr = b([
+}, Lr = b([
 	"open:flex open:flex-col m-auto p-0 overflow-hidden",
 	"[&[data-dialog-unusable]]:overflow-auto [&[data-dialog-unusable]]:[--_scroll-released:1]",
 	"[&[data-dialog-unusable]]:scroll-p-[calc(var(--focus-ring-width)+var(--focus-ring-offset))]",
@@ -2248,7 +2275,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		content: ["w-[32rem] max-w-[calc(100vw-2*var(--gutter))]", "max-h-[calc(100dvh-2*var(--space-region))]"].join(" ")
 	} },
 	defaultVariants: { extent: "screen" }
-}), Ir = b(["shrink-0 px-[var(--space-region)] pt-[var(--space-region)] pb-[var(--space-region)]", "[&:has(+[data-dialog-member=description])]:pb-0"].join(" ")), Lr = b(["shrink-0 px-[var(--space-region)] pt-[var(--space-region)] pb-[var(--space-region)]", "[[data-dialog-member=title]+&]:mt-[var(--space-stack)] [[data-dialog-member=title]+&]:pt-0"].join(" ")), Rr = b([
+}), Rr = b(["shrink-0 px-[var(--space-region)] pt-[var(--space-region)] pb-[var(--space-region)]", "[&:has(+[data-dialog-member=description])]:pb-0"].join(" ")), zr = b(["shrink-0 px-[var(--space-region)] pt-[var(--space-region)] pb-[var(--space-region)]", "[[data-dialog-member=title]+&]:mt-[var(--space-stack)] [[data-dialog-member=title]+&]:pt-0"].join(" ")), Br = b([
 	"grow shrink min-h-0 min-w-0",
 	"px-[var(--space-region)] py-[var(--space-region)]",
 	"[&:not(:first-child)]:border-t [&:not(:first-child)]:border-border"
@@ -2258,24 +2285,24 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		child: "flex flex-col"
 	} },
 	defaultVariants: { scrollOwner: "body" }
-}), zr = b([
+}), Vr = b([
 	"flex flex-row flex-wrap items-center justify-end gap-[var(--space-stack)] shrink-0",
 	"px-[var(--space-region)] pt-[var(--space-region)] pb-[var(--space-region)]",
 	"[[data-dialog-member=content]+&]:border-t [[data-dialog-member=content]+&]:border-border"
-].join(" ")), Br = a(void 0), Z = (e) => {
-	let t = c(Br);
-	if (t === void 0) throw new Er(e);
+].join(" ")), Hr = a(void 0), X = (e) => {
+	let t = c(Hr);
+	if (t === void 0) throw new kr(e);
 	return t;
-}, Vr = "a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex=\"-1\"])", Hr = (e, { presented: t, opener: n }) => {
+}, Ur = "a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex=\"-1\"])", Wr = (e, { presented: t, opener: n }) => {
 	if (e === void 0 || e.open) return;
 	let r = document.activeElement;
-	n.current = r instanceof HTMLElement && r !== document.body ? r : void 0, e.showModal(), t.current = !0, e.querySelector(Vr)?.focus();
-}, Q = (e, { presented: t }) => {
+	n.current = r instanceof HTMLElement && r !== document.body ? r : void 0, e.showModal(), t.current = !0, e.querySelector(Ur)?.focus();
+}, Z = (e, { presented: t }) => {
 	t.current = !1, e?.open && e.close();
-}, Ur = {
+}, Gr = {
 	Root: ({ children: e, onDismiss$: n, showDialog$: r, extent: i, ariaLabel: a, testId: o }) => {
-		let c = u(), d = p(void 0), f = jr(d);
-		Pr(d);
+		let c = u(), d = p(void 0), f = Nr(d);
+		Ir(d);
 		let h = p(!1), g = p(void 0), [_] = m(() => ({
 			presented: h,
 			opener: g
@@ -2294,23 +2321,23 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			isLabelled: a !== void 0,
 			registerNamePart: b
 		}, S = () => {
-			n.next(), r === void 0 ? Q(d.current, _) : r.next(!1);
+			n.next(), r === void 0 ? Z(d.current, _) : r.next(!1);
 		};
 		return l(() => {
-			if (r === void 0) return Hr(d.current, _), () => Q(d.current, _);
+			if (r === void 0) return Wr(d.current, _), () => Z(d.current, _);
 			let e = r.subscribe((e) => {
-				e ? Hr(d.current, _) : Q(d.current, _);
+				e ? Wr(d.current, _) : Z(d.current, _);
 			});
 			return () => {
-				e.unsubscribe(), Q(d.current, _);
+				e.unsubscribe(), Z(d.current, _);
 			};
-		}, [r, _]), /* @__PURE__ */ t(Br.Provider, {
+		}, [r, _]), /* @__PURE__ */ t(Hr.Provider, {
 			value: x,
 			children: /* @__PURE__ */ t("dialog", {
 				ref: (e) => {
 					d.current = e ?? void 0, e?.setAttribute("headingreset", "");
 				},
-				className: Fr({ extent: i }),
+				className: Lr({ extent: i }),
 				"data-dialog-unusable": f || void 0,
 				"aria-label": a,
 				"aria-labelledby": a === void 0 && v.title ? x.titleId : void 0,
@@ -2327,7 +2354,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 					let e = h.current;
 					h.current = !1;
 					let t = g.current;
-					g.current = void 0, t?.isConnected && (t.matches(Vr) || t.hasAttribute("tabindex")) && t.focus(), e && r?.next(!1);
+					g.current = void 0, t?.isConnected && (t.matches(Ur) || t.hasAttribute("tabindex")) && t.focus(), e && r?.next(!1);
 				},
 				"data-testid": o,
 				children: e
@@ -2335,11 +2362,11 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		});
 	},
 	Title: ({ children: e, testId: n }) => {
-		let { titleId: r, isLabelled: i, registerNamePart: a } = Z("Title");
-		if (l(() => a("title"), [a]), i) throw new Dr();
+		let { titleId: r, isLabelled: i, registerNamePart: a } = X("Title");
+		if (l(() => a("title"), [a]), i) throw new Ar();
 		return /* @__PURE__ */ t("div", {
 			"data-dialog-member": "title",
-			className: Ir(),
+			className: Rr(),
 			"data-testid": n,
 			children: /* @__PURE__ */ t("h1", {
 				id: r,
@@ -2349,10 +2376,10 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		});
 	},
 	Description: ({ children: e, testId: n }) => {
-		let { descriptionId: r, registerNamePart: i } = Z("Description");
+		let { descriptionId: r, registerNamePart: i } = X("Description");
 		return l(() => i("description"), [i]), /* @__PURE__ */ t("div", {
 			"data-dialog-member": "description",
-			className: Lr(),
+			className: zr(),
 			"data-testid": n,
 			children: /* @__PURE__ */ t("p", {
 				id: r,
@@ -2361,33 +2388,33 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			})
 		});
 	},
-	Content: ({ children: e, scrollOwner: n, testId: r }) => (Z("Content"), /* @__PURE__ */ t("div", {
+	Content: ({ children: e, scrollOwner: n, testId: r }) => (X("Content"), /* @__PURE__ */ t("div", {
 		"data-dialog-member": "content",
-		className: Rr({ scrollOwner: n }),
+		className: Br({ scrollOwner: n }),
 		"data-testid": r,
 		children: e
 	})),
-	Actions: ({ children: e, testId: n }) => (Z("Actions"), /* @__PURE__ */ t("div", {
+	Actions: ({ children: e, testId: n }) => (X("Actions"), /* @__PURE__ */ t("div", {
 		"data-dialog-member": "actions",
-		className: zr(),
+		className: Vr(),
 		"data-testid": n,
 		children: e
 	}))
-}, Wr = b("font-secondary text-small text-muted py-[var(--space-region)] px-[var(--gutter)]", {
+}, Kr = b("font-secondary text-small text-muted py-[var(--space-region)] px-[var(--gutter)]", {
 	variants: { edge: {
 		none: "",
 		rule: "border-t border-solid border-rule"
 	} },
 	defaultVariants: { edge: "rule" }
-}), Gr = ({ edge: e, children: n, testId: r }) => /* @__PURE__ */ t("footer", {
-	className: Wr({ edge: e }),
+}), qr = ({ edge: e, children: n, testId: r }) => /* @__PURE__ */ t("footer", {
+	className: Kr({ edge: e }),
 	"data-testid": r,
 	children: n
-}), Kr = class extends Error {
+}), Jr = class extends Error {
 	constructor(e) {
 		super(`Form configuration is invalid: ${e}`), this.name = "FormConfigurationError";
 	}
-}, qr = b("font-secondary text-small", {
+}, Yr = b("font-secondary text-small", {
 	variants: { state: {
 		idle: "text-muted",
 		sending: "text-muted",
@@ -2395,13 +2422,13 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		failed: "text-error"
 	} },
 	defaultVariants: { state: "idle" }
-}), Jr = {
+}), Xr = {
 	sent: "status",
 	failed: "alert"
-}, Yr = ({ action: e, method: r = "post", state: i = "idle", children: a, actions: o, note: s, testId: c }) => {
+}, Zr = ({ action: e, method: r = "post", state: i = "idle", children: a, actions: o, note: s, testId: c }) => {
 	let l = s != null && typeof s != "boolean";
-	if (i === "sent" && !l) throw new Kr("Form in the `sent` state must be given a `note` - it is the outcome message.");
-	let u = i !== "sent", d = Jr[i];
+	if (i === "sent" && !l) throw new Jr("Form in the `sent` state must be given a `note` - it is the outcome message.");
+	let u = i !== "sent", d = Xr[i];
 	return /* @__PURE__ */ n("form", {
 		action: e,
 		method: r,
@@ -2419,12 +2446,12 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			}),
 			l && /* @__PURE__ */ t("p", {
 				role: d,
-				className: qr({ state: i }),
+				className: Yr({ state: i }),
 				children: s
 			})
 		]
 	});
-}, Xr = b([
+}, Qr = b([
 	"flex items-baseline",
 	"font-secondary text-label leading-label tracking-label text-muted",
 	"py-[var(--space-region)] px-[var(--gutter)]",
@@ -2444,68 +2471,72 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		edge: "rule",
 		mode: "navigation"
 	}
-}), Zr = [
+}), $r = [
 	"inline-flex shrink-0 items-center",
 	"min-h-[calc(var(--text-label)*var(--leading-label))]",
 	"min-w-[var(--standing-min-width)]"
-].join(" "), Qr = "flex flex-wrap items-baseline gap-[var(--space-region)]", $r = "min-w-0 wrap-anywhere", ei = "ms-auto", ti = (e) => e != null && typeof e != "boolean" && e !== "", ni = ({ edge: r, testId: i, standing: a, navName: o, children: s, status: c, action: l }) => {
+].join(" "), ei = "flex flex-wrap items-baseline gap-[var(--space-region)]", ti = "min-w-0 wrap-anywhere", ni = "ms-auto", ri = (e) => e != null && typeof e != "boolean" && e !== "", ii = ({ edge: r, testId: i, standing: a, navName: o, children: s, status: c, action: l }) => {
 	let u = c !== void 0 || l !== void 0;
 	return /* @__PURE__ */ t("header", {
-		className: Xr({
+		className: Qr({
 			edge: r,
 			mode: u ? "statusAction" : "navigation"
 		}),
 		"data-testid": i,
-		children: u ? /* @__PURE__ */ n(e, { children: [ti(c) && /* @__PURE__ */ t("div", {
-			className: $r,
+		children: u ? /* @__PURE__ */ n(e, { children: [ri(c) && /* @__PURE__ */ t("div", {
+			className: ti,
 			children: c
-		}), ti(l) && /* @__PURE__ */ t("div", {
-			className: ei,
+		}), ri(l) && /* @__PURE__ */ t("div", {
+			className: ni,
 			children: l
 		})] }) : /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t("div", {
-			className: Zr,
+			className: $r,
 			children: a
 		}), /* @__PURE__ */ t("nav", {
 			"aria-label": o,
-			className: Qr,
+			className: ei,
 			children: s
 		})] })
 	});
-}, ri = b("flex flex-col min-h-[var(--fold-height)] gap-[var(--space-stack)]", {
+}, ai = b("flex flex-col min-h-[var(--fold-height)] gap-[var(--space-stack)]", {
 	variants: { place: {
 		start: "justify-start",
 		center: "justify-center",
 		between: "justify-between"
 	} },
 	defaultVariants: { place: "center" }
-}), ii = ({ place: e, children: n, testId: r }) => /* @__PURE__ */ t("div", {
-	className: ri({ place: e }),
+}), oi = ({ place: e, children: n, testId: r }) => /* @__PURE__ */ t("div", {
+	className: ai({ place: e }),
 	"data-testid": r,
 	children: n
-}), ai = b("flex flex-col gap-[var(--space-stack)] py-[var(--space-band)] px-[var(--gutter)]"), oi = b("font-heading text-title leading-title tracking-optical text-foreground"), si = b("font-body text-lede leading-lede text-foreground max-w-[var(--measure-wide)]"), ci = b("font-body text-small text-muted max-w-[var(--measure)]"), li = ({ title: e, lede: r, intro: i, testId: a }) => /* @__PURE__ */ n("header", {
-	className: ai(),
+}), si = b("flex flex-col gap-[var(--space-stack)] py-[var(--space-band)] px-[var(--gutter)]"), ci = b("font-heading text-title leading-title tracking-optical text-foreground"), li = b("font-body text-lede leading-lede text-foreground max-w-[var(--measure-wide)]"), ui = b("font-body text-small text-muted max-w-[var(--measure)]"), di = ({ title: e, lede: r, intro: i, testId: a }) => /* @__PURE__ */ n("header", {
+	className: si(),
 	"data-testid": a,
 	children: [
 		/* @__PURE__ */ t("h1", {
-			className: oi(),
+			className: ci(),
 			children: e
 		}),
 		r !== void 0 && /* @__PURE__ */ t("p", {
-			className: si(),
+			className: li(),
 			children: r
 		}),
 		i !== void 0 && /* @__PURE__ */ t("p", {
-			className: ci(),
+			className: ui(),
 			children: i
 		})
 	]
-}), ui = a(null), di = b("box-border flex h-full min-h-0 min-w-0 flex-col gap-[var(--space-stack)] border border-solid border-border bg-surface text-foreground p-[var(--space-box-inset)] [overflow-wrap:anywhere]"), fi = b("min-w-0 shrink-0"), pi = b("min-h-0 min-w-0 flex-[0_1_auto]", {
+}), fi = a(null), pi = b([
+	"box-border flex h-full min-h-0 min-w-0 flex-col gap-[var(--space-stack)] border border-solid border-border bg-surface text-foreground p-[var(--space-box-inset)] [overflow-wrap:anywhere]",
+	"[[data-screen-spacing=compact]_&:not(dialog_*)]:gap-[var(--space-pane-slot-compact)]",
+	"[[data-screen-spacing=compact]_&:not(dialog_*)]:p-[max(var(--space-pane-inset-compact),calc(var(--focus-ring-width)+var(--focus-ring-offset)))]"
+]), mi = b("min-w-0 shrink-0"), hi = b("min-h-0 min-w-0 flex-[0_1_auto]", {
 	variants: { scrollOwner: {
 		body: "[&>div]:flow-root [&>div]:w-fit [&>div]:min-w-full [&>div]:p-[calc(var(--focus-ring-width)+var(--focus-ring-offset))] overflow-auto overscroll-contain outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]",
 		child: "flex flex-col"
 	} },
 	defaultVariants: { scrollOwner: "body" }
-}), mi = (e, t, n) => {
+}), gi = (e, t, n) => {
 	let [r, i] = m(!0);
 	return d(() => {
 		let r = e.current;
@@ -2527,49 +2558,56 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		t,
 		n
 	]), r;
-}, $ = (e) => Number.parseFloat(e) || 0, hi = (e) => {
+}, Q = (e) => Number.parseFloat(e) || 0, _i = (e) => {
 	let t = getComputedStyle(e);
-	return $(t.paddingTop) + $(t.paddingBottom) + $(t.borderTopWidth) + $(t.borderBottomWidth);
-}, gi = (e) => {
+	return Q(t.paddingTop) + Q(t.paddingBottom) + Q(t.borderTopWidth) + Q(t.borderBottomWidth);
+}, vi = (e) => {
 	let t = 0;
 	for (let n of [e, ...e.querySelectorAll("*")]) {
 		let r = getComputedStyle(n);
 		if (r.display === "none") continue;
-		let i = $(r.lineHeight) || $(r.fontSize), a = $(getComputedStyle(e.firstElementChild ?? e).paddingTop), o = n.matches("tr, button, input, select, textarea, [role=\"button\"]") ? n.getBoundingClientRect().height : i;
+		let i = Q(r.lineHeight) || Q(r.fontSize), a = Q(getComputedStyle(e.firstElementChild ?? e).paddingTop), o = n.matches("tr, button, input, select, textarea, [role=\"button\"]") ? n.getBoundingClientRect().height : i;
 		t = Math.max(t, o + 2 * a);
 	}
 	let n = e.querySelector("table"), r = n ? Array.from(n.children).filter((e) => e.matches("caption, thead")).reduce((e, t) => e + t.getBoundingClientRect().height, 0) : 0;
-	return t + r + hi(e);
-}, _i = (e) => {
-	let t = c(ui), [n, r] = m(!1);
+	return t + r + _i(e);
+}, yi = (e) => {
+	let t = c(fi), [n, r] = m(!1);
 	return d(() => {
 		let n = e.current, i = t;
 		if (!n || !i) return;
 		let a = () => {
-			let e = Array.from(n.children), t = e.find((e) => e.hasAttribute("data-pane-body")), a = e.filter((e) => e !== t).reduce((e, t) => e + t.getBoundingClientRect().height, 0), o = Math.max(0, e.length - 1) * $(getComputedStyle(n).rowGap), s = i.getBoundingClientRect(), c = Math.max(0, n.getBoundingClientRect().top - s.top);
-			r(s.height - c < a + o + hi(n) + (t instanceof HTMLElement ? gi(t) : 0));
-		}, o = typeof ResizeObserver > "u" ? void 0 : new ResizeObserver(a), s = () => {
-			o?.disconnect(), o?.observe(i), o?.observe(n);
-			for (let e of n.querySelectorAll("*")) o?.observe(e);
-			a();
-		};
-		s();
-		let c = new MutationObserver(s);
-		return c.observe(n, {
+			let e = Array.from(n.children), t = e.find((e) => e.hasAttribute("data-pane-body")), a = e.filter((e) => e !== t).reduce((e, t) => e + t.getBoundingClientRect().height, 0), o = Math.max(0, e.length - 1) * Q(getComputedStyle(n).rowGap), s = i.getBoundingClientRect(), c = Math.max(0, n.getBoundingClientRect().top - s.top);
+			r(s.height - c < a + o + _i(n) + (t instanceof HTMLElement ? vi(t) : 0));
+		}, o = typeof ResizeObserver > "u" ? void 0 : new ResizeObserver(a), s = new MutationObserver(() => l()), c = {
 			childList: !0,
 			subtree: !0,
 			characterData: !0
-		}), window.addEventListener("resize", a), () => {
-			o?.disconnect(), c.disconnect(), window.removeEventListener("resize", a);
+		}, l = () => {
+			o?.disconnect(), s.disconnect(), o?.observe(i), o?.observe(n);
+			for (let e of n.querySelectorAll("*")) o?.observe(e);
+			s.observe(n, c);
+			for (let e = n; e !== i && e.parentElement; e = e.parentElement) {
+				s.observe(e.parentElement, { childList: !0 });
+				for (let t = e.previousElementSibling; t; t = t.previousElementSibling) o?.observe(t), s.observe(t, {
+					...c,
+					attributes: !0
+				});
+			}
+			a();
+		};
+		return l(), window.addEventListener("resize", a), () => {
+			o?.disconnect(), s.disconnect(), window.removeEventListener("resize", a);
 		};
 	}, [t, e]), n;
-}, vi = {
+}, bi = {
 	Root: ({ children: e, name: n, testId: r }) => {
-		let i = p(null), a = _i(i);
+		let i = p(null), a = yi(i);
 		return /* @__PURE__ */ t("div", {
 			ref: i,
 			"data-screen-unusable": a || void 0,
-			className: di(),
+			"data-height-bounded": !0,
+			className: pi(),
 			role: n ? "group" : void 0,
 			"aria-label": n || void 0,
 			"data-testid": r,
@@ -2577,16 +2615,16 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		});
 	},
 	Head: ({ children: e, testId: n }) => /* @__PURE__ */ t("div", {
-		className: fi(),
+		className: mi(),
 		"data-testid": n,
 		children: e
 	}),
 	Body: ({ children: e, ariaLabel: n, scrollOwner: r, testId: i }) => {
-		let a = p(null), o = p(null), s = r !== "child", c = mi(a, o, s) && s;
+		let a = p(null), o = p(null), s = r !== "child", c = gi(a, o, s) && s;
 		return /* @__PURE__ */ t("div", {
 			"data-pane-body": "",
 			ref: a,
-			className: pi({ scrollOwner: r ?? "body" }),
+			className: hi({ scrollOwner: r ?? "body" }),
 			role: c ? "group" : void 0,
 			"aria-label": c ? n : void 0,
 			tabIndex: c ? 0 : void 0,
@@ -2598,50 +2636,101 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		});
 	},
 	Foot: ({ children: e, testId: n }) => /* @__PURE__ */ t("div", {
-		className: fi(),
+		className: mi(),
 		"data-testid": n,
 		children: e
 	})
-}, yi = b("box-border grid h-full min-h-0 min-w-0 grid-rows-[minmax(0,1fr)] px-[var(--gutter)] py-[var(--space-region)] [&:has(>header)]:grid-rows-[auto_minmax(0,1fr)] [&:has(>header)]:gap-[var(--space-region)]"), bi = b("min-w-0"), xi = b("h-full min-h-0 min-w-0 [&>div]:h-full [&:has([data-screen-unusable])>div]:h-auto"), Si = ({ heading: e, children: r, testId: i }) => {
-	let [a, o] = m(null);
+}, xi = b("box-border grid h-full min-h-0 min-w-0 grid-rows-[minmax(0,1fr)] px-[var(--gutter)] [&:has(>header)]:grid-rows-[auto_minmax(0,1fr)]", {
+	variants: { spacing: {
+		comfortable: "py-[var(--space-region)] [&:has(>header)]:gap-[var(--space-region)]",
+		compact: "py-[max(var(--space-screen-region-compact),calc(var(--focus-ring-width)+var(--focus-ring-offset)))] [&:has(>header)]:gap-[max(var(--space-screen-region-compact),calc(var(--focus-ring-width)+var(--focus-ring-offset)))]"
+	} },
+	defaultVariants: { spacing: "comfortable" }
+}), Si = b("min-w-0"), Ci = b("h-full min-h-0 min-w-0 [&>div]:h-full [&:has([data-screen-unusable])>div]:h-auto"), wi = (e) => e.display === "none" || e.position === "absolute" || e.position === "fixed", $ = (e) => Array.from(e.children).reduce((e, t) => {
+	let n = getComputedStyle(t), r = [...e.observed, t];
+	if (wi(n) || t.hasAttribute("data-height-bounded")) return {
+		bottom: e.bottom,
+		observed: r
+	};
+	if (t.hasAttribute("data-height-passing")) {
+		let n = $(t);
+		return {
+			bottom: Math.max(e.bottom, n.bottom),
+			observed: [...r, ...n.observed]
+		};
+	}
+	let i = t.getBoundingClientRect().bottom + (Number.parseFloat(n.marginBottom) || 0);
+	return {
+		bottom: Math.max(e.bottom, i),
+		observed: r
+	};
+}, {
+	bottom: -Infinity,
+	observed: []
+}), Ti = (e) => {
+	let [t, n] = m(!1);
+	return d(() => {
+		let t = e?.firstElementChild;
+		if (!e || !t) return;
+		let r = () => n($(t).bottom > e.getBoundingClientRect().bottom), i = typeof ResizeObserver > "u" ? void 0 : new ResizeObserver(r), a = () => {
+			i?.disconnect(), i?.observe(e);
+			for (let e of $(t).observed) i?.observe(e);
+			r();
+		};
+		a();
+		let o = new MutationObserver(a);
+		return o.observe(t, {
+			childList: !0,
+			subtree: !0,
+			characterData: !0
+		}), window.addEventListener("resize", r), () => {
+			i?.disconnect(), o.disconnect(), window.removeEventListener("resize", r);
+		};
+	}, [e]), t;
+}, Ei = ({ heading: e, spacing: r, children: i, testId: a }) => {
+	let [o, s] = m(null), c = Ti(o);
 	return /* @__PURE__ */ n("main", {
-		className: yi(),
-		"data-testid": i,
+		className: xi({ spacing: r }),
+		"data-screen-spacing": r === "compact" ? r : void 0,
+		"data-testid": a,
 		children: [e != null && e !== !1 && /* @__PURE__ */ t("header", {
-			className: bi(),
+			className: Si(),
 			children: e
 		}), /* @__PURE__ */ t("div", {
-			ref: o,
-			className: xi(),
-			children: /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(ui.Provider, {
-				value: a,
-				children: r
-			}) })
+			ref: s,
+			className: Ci(),
+			children: /* @__PURE__ */ t("div", {
+				"data-screen-unusable": c || void 0,
+				children: /* @__PURE__ */ t(fi.Provider, {
+					value: o,
+					children: i
+				})
+			})
 		})]
 	});
-}, Ci = b("max-h-full max-w-full min-h-0 min-w-0 outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]", {
+}, Di = b("max-h-full max-w-full min-h-0 min-w-0 outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]", {
 	variants: { axis: {
 		both: "overflow-auto",
 		horizontal: "overflow-x-auto overflow-y-hidden",
 		vertical: "overflow-y-auto overflow-x-hidden"
 	} },
 	defaultVariants: { axis: "both" }
-}), wi = b("p-[calc(var(--focus-ring-width)+var(--focus-ring-offset))]", {
+}), Oi = b("p-[calc(var(--focus-ring-width)+var(--focus-ring-offset))]", {
 	variants: { axis: {
 		both: "w-fit min-w-full",
 		horizontal: "w-fit min-w-full",
 		vertical: "w-full"
 	} },
 	defaultVariants: { axis: "both" }
-}), Ti = (e, t) => {
+}), ki = (e, t) => {
 	let n = e.scrollWidth > e.clientWidth, r = e.scrollHeight > e.clientHeight;
 	return t !== "vertical" && n || t !== "horizontal" && r;
-}, Ei = (e, t, n) => {
+}, Ai = (e, t, n) => {
 	let [r, i] = m(!0);
 	return d(() => {
 		let r = e.current;
 		if (r === null) return;
-		let a = () => i(Ti(r, n) || r === document.activeElement);
+		let a = () => i(ki(r, n) || r === document.activeElement);
 		a();
 		let o = typeof ResizeObserver > "u" ? void 0 : new ResizeObserver(a);
 		return o?.observe(r), t.current !== null && o?.observe(t.current), window.addEventListener("resize", a), r.addEventListener("blur", a), () => {
@@ -2652,22 +2741,23 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		t,
 		n
 	]), r;
-}, Di = ({ axis: e, ariaLabel: n, children: r, testId: i }) => {
-	let a = p(null), o = p(null), s = Ei(a, o, e ?? "both");
+}, ji = ({ axis: e, ariaLabel: n, children: r, testId: i }) => {
+	let a = p(null), o = p(null), s = Ai(a, o, e ?? "both");
 	return /* @__PURE__ */ t("div", {
 		ref: a,
-		className: Ci({ axis: e }),
+		className: Di({ axis: e }),
+		"data-height-bounded": !0,
 		"data-testid": i,
 		role: s ? "group" : void 0,
 		"aria-label": s ? n : void 0,
 		tabIndex: s ? 0 : void 0,
 		children: /* @__PURE__ */ t("div", {
 			ref: o,
-			className: wi({ axis: e }),
+			className: Oi({ axis: e }),
 			children: r
 		})
 	});
-}, Oi = b([
+}, Mi = b([
 	"relative",
 	"py-[var(--space-band)]",
 	"[[data-section]+&]:border-t [[data-section]+&]:border-solid [[data-section]+&]:border-rule"
@@ -2677,19 +2767,19 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		full: ""
 	} },
 	defaultVariants: { bleed: "inset" }
-}), ki = ({ bleed: e, name: n, children: r, testId: i }) => /* @__PURE__ */ t("section", {
+}), Ni = ({ bleed: e, name: n, children: r, testId: i }) => /* @__PURE__ */ t("section", {
 	"data-section": "",
-	className: Oi({ bleed: e }),
+	className: Mi({ bleed: e }),
 	"aria-label": n,
 	"data-testid": i,
 	children: r
-}), Ai = b("h-dvh min-w-0 overflow-clip grid grid-rows-[auto_minmax(0,1fr)]"), ji = b("min-h-0 min-w-0 overflow-auto overscroll-contain p-[calc(var(--focus-ring-width)+var(--focus-ring-offset))] scroll-p-[calc(var(--focus-ring-width)+var(--focus-ring-offset))] outline-focus-ring focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)] focus-visible:outline-offset-[calc(-1*var(--focus-ring-width))]", {
+}), Pi = b("h-dvh min-w-0 overflow-clip grid grid-rows-[auto_minmax(0,1fr)]"), Fi = b("min-h-0 min-w-0 overflow-auto overscroll-contain p-[calc(var(--focus-ring-width)+var(--focus-ring-offset))] scroll-p-[calc(var(--focus-ring-width)+var(--focus-ring-offset))] outline-focus-ring focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)] focus-visible:outline-offset-[calc(-1*var(--focus-ring-width))]", {
 	variants: { mode: {
 		console: "[&>div]:h-full",
 		page: "[&>div]:min-h-full"
 	} },
 	defaultVariants: { mode: "console" }
-}), Mi = (e) => {
+}), Ii = (e) => {
 	let [t, n] = m(!0);
 	return d(() => {
 		let t = e.current;
@@ -2711,21 +2801,21 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 			i?.disconnect(), o.disconnect(), window.removeEventListener("resize", r), t.removeEventListener("blur", r);
 		};
 	}, [e]), t;
-}, Ni = ({ bar: e, children: r, ariaLabel: i, mode: a, testId: o }) => {
-	let s = p(null), c = Mi(s);
+}, Li = ({ bar: e, children: r, ariaLabel: i, mode: a, testId: o }) => {
+	let s = p(null), c = Ii(s);
 	return /* @__PURE__ */ n("div", {
-		className: Ai(),
+		className: Pi(),
 		"data-testid": o,
 		children: [/* @__PURE__ */ t("div", { children: e }), /* @__PURE__ */ t("div", {
 			ref: s,
-			className: ji({ mode: a }),
+			className: Fi({ mode: a }),
 			role: c ? "group" : void 0,
 			"aria-label": c ? i : void 0,
 			tabIndex: c ? 0 : void 0,
 			children: /* @__PURE__ */ t("div", { children: r })
 		})]
 	});
-}, Pi = b([
+}, Ri = b([
 	"grid gap-[var(--space-region)] lg:grid-cols-[12rem_minmax(0,1fr)]",
 	"[&>div:first-child]:border-solid [&>div:first-child]:border-border [&>div:first-child]:border-b [&>div:first-child]:pb-[var(--space-stack)]",
 	"lg:[&>div:first-child]:border-b-0 lg:[&>div:first-child]:border-r lg:[&>div:first-child]:pb-0 lg:[&>div:first-child]:pr-[var(--space-stack)]",
@@ -2738,7 +2828,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		true: "min-h-full lg:h-full lg:min-h-0 lg:grid-rows-[minmax(0,1fr)] lg:[&>div]:min-h-0 lg:[&>div]:h-full lg:[&>div:first-child>nav]:max-h-full"
 	} },
 	defaultVariants: { fill: !1 }
-}), Fi = (e) => {
+}), zi = (e) => {
 	if (!e) return;
 	let t = [];
 	for (let n = e.parentElement; n && n !== e.ownerDocument.documentElement; n = n.parentElement) t.push(n);
@@ -2755,7 +2845,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 	return window.addEventListener("resize", n), () => {
 		r?.disconnect(), window.removeEventListener("resize", n), e.style.removeProperty("--sidebar-scrollport-height");
 	};
-}, Ii = b([
+}, Bi = b([
 	"w-full text-left font-secondary text-label tracking-label wrap-anywhere",
 	"underline-offset-[var(--underline-offset)]",
 	"outline-focus-ring outline-offset-[var(--focus-ring-offset)] focus-visible:outline focus-visible:outline-[length:var(--focus-ring-width)]"
@@ -2766,11 +2856,11 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		inert: "text-muted cursor-not-allowed"
 	} },
 	defaultVariants: { state: "usable" }
-}), Li = a(void 0), Ri = ({ entryKey: e, children: n, inert: r, testId: i }) => {
-	let a = c(Li), o = a !== void 0 && a.active === e;
+}), Vi = a(void 0), Hi = ({ entryKey: e, children: n, inert: r, testId: i }) => {
+	let a = c(Vi), o = a !== void 0 && a.active === e;
 	return /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t("button", {
 		type: "button",
-		className: Ii({ state: r ? "inert" : o ? "active" : "usable" }),
+		className: Bi({ state: r ? "inert" : o ? "active" : "usable" }),
 		disabled: r,
 		"aria-current": o ? "true" : void 0,
 		"data-testid": i,
@@ -2779,31 +2869,31 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 		},
 		children: n
 	}) });
-}, zi = ({ children: e, testId: n }) => /* @__PURE__ */ t("div", {
+}, Ui = ({ children: e, testId: n }) => /* @__PURE__ */ t("div", {
 	"data-testid": n,
 	children: e
-}), Bi = {
+}), Wi = {
 	Root: ({ active: e, label: i, onSelect$: a, children: s, testId: c, fill: l }) => {
 		let u = r.toArray(s).filter(o);
 		return /* @__PURE__ */ n("div", {
-			className: Pi({ fill: l }),
+			className: Ri({ fill: l }),
 			"data-testid": c,
 			children: [/* @__PURE__ */ t("div", { children: /* @__PURE__ */ t("nav", {
-				ref: l ? void 0 : Fi,
+				ref: l ? void 0 : zi,
 				"aria-label": i,
-				children: /* @__PURE__ */ t(Li, {
+				children: /* @__PURE__ */ t(Vi, {
 					value: {
 						active: e,
 						onSelect$: a
 					},
-					children: /* @__PURE__ */ t("ul", { children: u.filter((e) => e.type === Ri) })
+					children: /* @__PURE__ */ t("ul", { children: u.filter((e) => e.type === Hi) })
 				})
-			}) }), u.filter((e) => e.type === zi)]
+			}) }), u.filter((e) => e.type === Ui)]
 		});
 	},
-	Item: Ri,
-	Content: zi
-}, Vi = {
+	Item: Hi,
+	Content: Ui
+}, Gi = {
 	surface: "#ffffff",
 	selectedSurface: "#f8fafc",
 	selectedError: "#cd2d7d",
@@ -2832,7 +2922,7 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 	errorHover: "#be185d",
 	errorForeground: "#ffffff",
 	info: "#0e7490"
-}, Hi = {
+}, Ki = {
 	surface: "#0f172a",
 	selectedSurface: "#151e30",
 	selectedError: "#f48fb1",
@@ -2863,4 +2953,4 @@ var v = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, y = _, b = (e
 	info: "#22d3ee"
 };
 //#endregion
-export { Me as Box, Pe as Brandmark, on as Button, Ie as Callout, ze as Checklist, mn as Choices, sn as ChoicesCompositionError, S as Cluster, He as Collection, ue as ColumnLayout, C as ColumnLayoutCompositionError, w as ColumnLayoutConfigurationError, Tr as Cover, $e as DefinitionList, Ue as DefinitionListConfigurationError, Ur as Dialog, Er as DialogCompositionError, Dr as DialogNamingError, Ft as Eyebrow, Oe as FieldRow, pe as FieldRowCompositionError, H as FieldRowConfigurationError, tt as Figure, Gr as Footer, Yr as Form, Kr as FormConfigurationError, Lt as H1, zt as H2, Vt as H3, Ut as H4, Gt as H5, qt as H6, ni as Header, ii as Hero, ot as Icon, gn as Input, vn as Link, ut as Meter, W as MeterConfigurationError, Rn as MultiSelect, bn as MultiSelectCompositionError, Yt as Note, Bn as NumberInput, Zt as P, li as PageHead, vi as Pane, rn as Prose, ht as Rail, _t as Rule, Si as Screen, Di as ScrollContainer, ki as Section, Hn as Select, Ni as Shell, Bi as Sidebar, Gn as Slider, J as SliderConfigurationError, Ae as Stack, ar as Stepper, Kn as StepperCompositionError, sr as Switch, Nt as Table, vt as TableConfigurationError, br as Tabs, cr as TabsCompositionError, Sr as TextArea, Hi as dark, Vi as light };
+export { Pe as Box, Ie as Brandmark, ln as Button, Re as Callout, Ve as Checklist, _n as Choices, un as ChoicesCompositionError, S as Cluster, We as Collection, pe as ColumnLayout, C as ColumnLayoutCompositionError, w as ColumnLayoutConfigurationError, Or as Cover, tt as DefinitionList, Ge as DefinitionListConfigurationError, Gr as Dialog, kr as DialogCompositionError, Ar as DialogNamingError, Rt as Eyebrow, Ae as FieldRow, B as FieldRowCompositionError, V as FieldRowConfigurationError, rt as Figure, qr as Footer, Zr as Form, Jr as FormConfigurationError, Bt as H1, Ht as H2, Wt as H3, Kt as H4, Jt as H5, Xt as H6, ii as Header, oi as Hero, ct as Icon, yn as Input, xn as Link, pt as Meter, lt as MeterConfigurationError, Vn as MultiSelect, Cn as MultiSelectCompositionError, Qt as Note, Un as NumberInput, en as P, di as PageHead, bi as Pane, sn as Prose, vt as Rail, bt as Rule, Ei as Screen, ji as ScrollContainer, Ni as Section, Gn as Select, Li as Shell, Wi as Sidebar, Jn as Slider, K as SliderConfigurationError, Me as Stack, cr as Stepper, Yn as StepperCompositionError, ur as Switch, It as Table, xt as TableConfigurationError, Cr as Tabs, dr as TabsCompositionError, Tr as TextArea, Ki as dark, Gi as light };