@pieai/swimmer-ui-kit 2.2.0 → 2.3.0

package/dist/index.js

@@ -286,7 +286,7 @@ var w = {
 	desktopProofHeightPx: 900,
 	mobileLandscapeProofWidthPx: 844,
 	mobileLandscapeProofHeightPx: 390
-}, te = {
+}, I = {
 	iconSm: "var(--game-ui-asset-icon-sm)",
 	iconMd: "var(--game-ui-asset-icon-md)",
 	iconLg: "var(--game-ui-asset-icon-lg)",
@@ -298,7 +298,7 @@ var w = {
 	terrainToolHitSize: "var(--game-ui-terrain-tool-hit-size)",
 	buildRailCardSize: "var(--game-ui-build-rail-card-size)",
 	brushNumberWidth: "var(--game-ui-brush-number-width)"
-}, ne = {
+}, te = {
 	colors: w,
 	semantic: O,
 	typography: k,
@@ -309,52 +309,52 @@ var w = {
 	motion: N,
 	layers: P,
 	targets: F,
-	assetSizing: te,
+	assetSizing: I,
 	overlayGlass: D,
 	liquidMetal: T,
 	liquidGooey: E
-}, re = 2, ie = 48e4, ae = 2, I = ie, L = 0;
-function oe(e, t) {
+}, ne = 2, re = 48e4, L = 2, R = re, z = 0;
+function ie(e, t) {
 	return Number.isFinite(e) ? Math.max(0, Math.floor(e)) : t;
 }
-function se() {
+function ae() {
 	return {
-		maxAnimatedGroups: ae,
-		maxFilterArea: I,
-		activeGroups: L
+		maxAnimatedGroups: L,
+		maxFilterArea: R,
+		activeGroups: z
 	};
 }
-function R(e) {
+function B(e) {
 	if (typeof e == "number") {
-		ae = oe(e, 0);
+		L = ie(e, 0);
 		return;
 	}
-	e.maxAnimatedGroups !== void 0 && (ae = oe(e.maxAnimatedGroups, 0)), e.maxFilterArea !== void 0 && (I = oe(e.maxFilterArea, 0));
+	e.maxAnimatedGroups !== void 0 && (L = ie(e.maxAnimatedGroups, 0)), e.maxFilterArea !== void 0 && (R = ie(e.maxFilterArea, 0));
 }
-function ce(e) {
-	return L >= ae || (Number.isFinite(e) ? Math.max(0, e) : Infinity) > I ? !1 : (L += 1, !0);
+function oe(e) {
+	return z >= L || (Number.isFinite(e) ? Math.max(0, e) : Infinity) > R ? !1 : (z += 1, !0);
 }
-function le() {
-	L > 0 && --L;
+function se() {
+	z > 0 && --z;
 }
 //#endregion
 //#region src/liquidGooeyFilter.tsx
-var ue = "1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 60 -29.5", de = 1.3, fe = 1 / .3902;
-function pe(e, t) {
-	return e <= 0 ? t : Math.min(t, fe * e / de);
+var ce = "1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 60 -29.5", le = 1.3, ue = 1 / .3902;
+function de(e, t) {
+	return e <= 0 ? t : Math.min(t, ue * e / le);
 }
-var me = {
+var fe = {
 	waviness: 0,
 	wavinessFreq: .018
 };
-function he(e) {
+function pe(e) {
 	return e.spread === 0 ? "shape" : "bin";
 }
-function ge(e, t) {
+function me(e, t) {
 	return t !== null || e.some((e) => e.spread !== 0);
 }
-function _e({ index: e, shadow: t }) {
-	let n = [], r = he(t), i = r;
+function he({ index: e, shadow: t }) {
+	let n = [], r = pe(t), i = r;
 	return t.spread !== 0 && (n.push(/* @__PURE__ */ m("feMorphology", {
 		in: i,
 		operator: t.spread > 0 ? "erode" : "dilate",
@@ -384,7 +384,7 @@ function _e({ index: e, shadow: t }) {
 		result: `shadow-${e}`
 	}, "fill")), /* @__PURE__ */ m(p, { children: n });
 }
-function z({ index: e, shadow: t }) {
+function ge({ index: e, shadow: t }) {
 	let n = [], r = "shape";
 	return t.spread !== 0 && (n.push(/* @__PURE__ */ m("feMorphology", {
 		in: "bin",
@@ -410,7 +410,7 @@ function z({ index: e, shadow: t }) {
 		result: `shadow-${e}`
 	}, "fill")), /* @__PURE__ */ m(p, { children: n });
 }
-function B({ stroke: e }) {
+function _e({ stroke: e }) {
 	let t = [];
 	return t.push(/* @__PURE__ */ m("feMorphology", {
 		in: "bin",
@@ -432,8 +432,8 @@ function B({ stroke: e }) {
 		result: "stroke-out"
 	}, "fill")), /* @__PURE__ */ m(p, { children: t });
 }
-function ve({ blur: e, contrast: t, shadows: n, stroke: r, gloss: i = 0, waviness: a = me.waviness, wavinessFreq: o = me.wavinessFreq }) {
-	let s = pe(e, t), c = Math.round((.5 - 5 / 12 * s) * 100) / 100, l = a > 0;
+function ve({ blur: e, contrast: t, shadows: n, stroke: r, gloss: i = 0, waviness: a = fe.waviness, wavinessFreq: o = fe.wavinessFreq }) {
+	let s = de(e, t), c = Math.round((.5 - 5 / 12 * s) * 100) / 100, l = a > 0;
 	return /* @__PURE__ */ h(p, { children: [
 		/* @__PURE__ */ m("feGaussianBlur", {
 			in: "SourceGraphic",
@@ -501,20 +501,20 @@ function ve({ blur: e, contrast: t, shadows: n, stroke: r, gloss: i = 0, wavines
 				result: "shape"
 			})
 		] }) : null,
-		ge(n, r) ? /* @__PURE__ */ m("feColorMatrix", {
+		me(n, r) ? /* @__PURE__ */ m("feColorMatrix", {
 			in: "shape",
 			type: "matrix",
-			values: ue,
+			values: ce,
 			result: "bin"
 		}) : null,
-		n.map((e, t) => e.inset ? /* @__PURE__ */ m(_e, {
+		n.map((e, t) => e.inset ? /* @__PURE__ */ m(he, {
 			index: t,
 			shadow: e
-		}, t) : /* @__PURE__ */ m(z, {
+		}, t) : /* @__PURE__ */ m(ge, {
 			index: t,
 			shadow: e
 		}, t)),
-		r ? /* @__PURE__ */ m(B, { stroke: r }) : null,
+		r ? /* @__PURE__ */ m(_e, { stroke: r }) : null,
 		n.length > 0 || r ? /* @__PURE__ */ h("feMerge", { children: [
 			n.map((e, t) => e.inset ? -1 : t).filter((e) => e >= 0).reverse().map((e) => /* @__PURE__ */ m("feMergeNode", { in: `shadow-${e}` }, e)),
 			/* @__PURE__ */ m("feMergeNode", { in: "shape" }),
@@ -1051,7 +1051,7 @@ function st(e, t, n, r, i, a) {
 	];
 	return {
 		path: Ee(-e.w / 2, -e.h / 2, e.w, e.h, A, a),
-		transform: `translate(${ot(e.cx)} ${ot(e.cy)}) scale(${ot(t.scale)})`,
+		transform: `translate(${ot(e.cx)} ${ot(e.cy)}) scale(${ot(t.scale)} ${ot(t.scaleY ?? t.scale)})`,
 		contentBlur: E,
 		moving: !k
 	};
@@ -1073,6 +1073,11 @@ var ct = {
 		stiffness: 320,
 		damping: 17,
 		mass: 1
+	},
+	wobbly: {
+		stiffness: 400,
+		damping: 9.6,
+		mass: 1
 	}
 }, lt = 1 / 240;
 function ut(e) {
@@ -1162,7 +1167,8 @@ function vt(e) {
 		observe: e.observe ?? !1,
 		x: _t(e.x, 0),
 		y: _t(e.y, 0),
-		scale: Math.max(.01, _t(e.scale, 1))
+		scale: Math.max(.01, _t(e.scale, 1)),
+		scaleY: Math.max(.01, _t(e.scaleY ?? e.scale, 1))
 	};
 	return e.effect !== void 0 && (t.effect = e.effect), e.morph !== void 0 && (t.morph = e.morph), e.bend !== void 0 && (t.bend = e.bend), e.transition !== void 0 && (t.transition = e.transition), e.delay !== void 0 && (t.delay = Math.max(0, _t(e.delay, 0))), e.radius !== void 0 && (t.radius = e.radius), e.blob !== void 0 && (t.blob = e.blob), t;
 }
@@ -1170,11 +1176,12 @@ function yt(e) {
 	return {
 		x: e.x,
 		y: e.y,
-		scale: e.scale
+		scale: e.scale,
+		scaleY: e.scaleY
 	};
 }
 function bt(e, t) {
-	return e.x === t.x && e.y === t.y && e.scale === t.scale;
+	return e.x === t.x && e.y === t.y && e.scale === t.scale && e.scaleY === t.scaleY;
 }
 function xt(e, t) {
 	return e.effect === t.effect && e.observe === t.observe && JSON.stringify(e.morph) === JSON.stringify(t.morph) && JSON.stringify(e.bend) === JSON.stringify(t.bend) && JSON.stringify(e.transition) === JSON.stringify(t.transition) && e.delay === t.delay && St(e.radius) === St(t.radius);
@@ -1276,7 +1283,7 @@ var Tt = class {
 	setFilterArea(e) {
 		let t = Number.isFinite(e) ? Math.max(0, e) : Infinity;
 		if (!(Math.abs(t - this.filterArea) < .5)) {
-			if (this.filterArea = t, this.claimed && t > se().maxFilterArea) {
+			if (this.filterArea = t, this.claimed && t > ae().maxFilterArea) {
 				for (let e of this.items.values()) this.snapEntry(e), this.resetMoveEntry(e), this.resetDynamicEntry(e);
 				this.releaseClaim(), this.setMode(this.reducedMotion ? "reduced" : "static");
 			}
@@ -1315,19 +1322,19 @@ var Tt = class {
 	ensureClaim() {
 		if (this.claimed) return !0;
 		let e = this.getFilterArea();
-		return Number.isFinite(e) && (this.filterArea = Math.max(0, e)), ce(this.filterArea) ? (this.claimed = !0, this.moveOptions = Me(this.getGroup()), !0) : (this.warnBudgetFallback(), !1);
+		return Number.isFinite(e) && (this.filterArea = Math.max(0, e)), oe(this.filterArea) ? (this.claimed = !0, this.moveOptions = Me(this.getGroup()), !0) : (this.warnBudgetFallback(), !1);
 	}
 	warnBudgetFallback() {
 		if (this.budgetWarningEmitted) return;
 		this.budgetWarningEmitted = !0;
-		let e = se(), t = e.activeGroups >= e.maxAnimatedGroups ? "the active-group limit is reached" : "the filter-area limit is exceeded";
+		let e = ae(), t = e.activeGroups >= e.maxAnimatedGroups ? "the active-group limit is reached" : "the filter-area limit is exceeded";
 		console.warn(`LiquidGroup: the liquid animation budget is insufficient (${t}); degrading to static rendering for this group.`);
 	}
 	revive() {
 		this.disposed && (this.disposed = !1, this.mutationObserver = null, this.removeListeners.length = 0, this.lastFrameTime = null, this.budgetWarningEmitted = !1);
 	}
 	releaseClaim() {
-		this.claimed &&= (le(), !1);
+		this.claimed &&= (se(), !1);
 	}
 	isBend(e) {
 		return e.config.effect === "bend";
@@ -1404,7 +1411,8 @@ var Tt = class {
 		return e.current = {
 			x: n.from.x + (n.to.x - n.from.x) * i,
 			y: n.from.y + (n.to.y - n.from.y) * i,
-			scale: n.from.scale + (n.to.scale - n.from.scale) * i
+			scale: n.from.scale + (n.to.scale - n.from.scale) * i,
+			scaleY: n.from.scaleY + (n.to.scaleY - n.from.scaleY) * i
 		}, this.applyHost(e), r >= 1 ? (e.current = { ...n.to }, e.motion = null, e.host.style.willChange = "", this.applyHost(e), !1) : !0;
 	}
 	applyHost(e) {
@@ -1412,7 +1420,7 @@ var Tt = class {
 			e.ownTransform && e.host.style.transform === e.ownTransform && e.host.style.removeProperty("transform"), e.ownTransform = "";
 			return;
 		}
-		let t = `translate(${wt(e.current.x)}px, ${wt(e.current.y)}px) scale(${wt(e.current.scale)})`;
+		let t = `translate(${wt(e.current.x)}px, ${wt(e.current.y)}px) scale(${wt(e.current.scale)}, ${wt(e.current.scaleY)})`;
 		e.ownTransform !== t && (e.ownTransform = t, e.host.style.transform = t);
 	}
 	createTailElements(e) {
@@ -1444,7 +1452,8 @@ var Tt = class {
 		return {
 			cx: t.x + t.w / 2 + e.current.x,
 			cy: t.y + t.h / 2 + e.current.y,
-			scale: e.current.scale
+			scale: e.current.scale,
+			scaleY: e.current.scaleY
 		};
 	}
 	readBox(e, t) {
@@ -1471,6 +1480,7 @@ var Tt = class {
 			cx: t.x + t.w / 2 + (n ? 0 : e.current.x),
 			cy: t.y + t.h / 2 + (n ? 0 : e.current.y),
 			scale: n ? 1 : e.current.scale,
+			scaleY: n ? 1 : e.current.scaleY,
 			w: t.w,
 			h: t.h,
 			r: t.r[0] ?? 0
@@ -1504,7 +1514,7 @@ var Tt = class {
 		};
 	}
 	paintEntry(e, t) {
-		let n = t.x + e.current.x + t.w * (1 - e.current.scale) / 2, r = t.y + e.current.y + t.h * (1 - e.current.scale) / 2, i = `translate(${wt(n)} ${wt(r)}) scale(${wt(e.current.scale)})`, a = Ee(0, 0, t.w, t.h, t.r, e.config.blob), o = `${a}|${i}`;
+		let n = t.x + e.current.x + t.w * (1 - e.current.scale) / 2, r = t.y + e.current.y + t.h * (1 - e.current.scaleY) / 2, i = `translate(${wt(n)} ${wt(r)}) scale(${wt(e.current.scale)} ${wt(e.current.scaleY)})`, a = Ee(0, 0, t.w, t.h, t.r, e.config.blob), o = `${a}|${i}`;
 		return e.lastPaint === o ? !1 : (e.lastPaint = o, e.blob.setAttribute("d", a), e.blob.setAttribute("transform", i), !0);
 	}
 	loop = (e) => {
@@ -1995,14 +2005,14 @@ var gn = class {
 		e.painted !== t && (e.painted = t, e.target.style.opacity = t ? "0" : e.previousOpacity);
 	}
 	releaseClaim() {
-		this.claimed &&= (le(), !1);
+		this.claimed &&= (se(), !1);
 	}
 	ensureClaim(e, t, n) {
 		if (this.claimed) return !0;
-		if (!ce(un(e, t, n))) {
+		if (!oe(un(e, t, n))) {
 			if (!this.budgetWarningEmitted) {
 				this.budgetWarningEmitted = !0;
-				let e = se(), t = e.activeGroups >= e.maxAnimatedGroups ? "the active-group limit is reached" : "the filter-area limit is exceeded";
+				let e = ae(), t = e.activeGroups >= e.maxAnimatedGroups ? "the active-group limit is reached" : "the filter-area limit is exceeded";
 				console.warn(`LiquidGroup: the Melt/dissolve image filter budget is insufficient (${t}); degrading to crisp imagery for this group.`);
 			}
 			return !1;
@@ -2165,7 +2175,7 @@ function _n({ a: e, b: t, srcA: n, srcB: r, opts: i, width: a, height: o, prox:
 	}, w = Math.hypot(e.w, e.h) / 2 * f * c, T = Math.hypot(t.w, t.h) / 2 * f * c, E = {
 		x: (S.x + C.x) / 2,
 		y: (S.y + C.y) / 2
-	}, D = C.x - S.x, O = C.y - S.y, k = Math.max(.001, Math.hypot(D, O)), A = -O / k, ee = D / k, j = Math.max(0, (e.w + t.w) / 2 - Math.abs(D)), M = Math.max(0, (e.h + t.h) / 2 - Math.abs(O)), N = .5 * (j * Math.abs(A) + M * Math.abs(ee)) * c, P = Math.round(Math.atan2(ee, A) * 180 / Math.PI), F = Math.round(v * c * 100) / 100, te = Math.round((2 + (u - 2) * c) * 10) / 10, ne = Math.round(_ * c * 10) / 10, re = Math.round(te * 2.5 * 10) / 10, ie = Math.round((.4 + (2 + u * .8) * c) * 10) / 10, ae = `translate(${e.x}, ${e.y})`, I = `translate(${t.x}, ${t.y})`;
+	}, D = C.x - S.x, O = C.y - S.y, k = Math.max(.001, Math.hypot(D, O)), A = -O / k, ee = D / k, j = Math.max(0, (e.w + t.w) / 2 - Math.abs(D)), M = Math.max(0, (e.h + t.h) / 2 - Math.abs(O)), N = .5 * (j * Math.abs(A) + M * Math.abs(ee)) * c, P = Math.round(Math.atan2(ee, A) * 180 / Math.PI), F = Math.round(v * c * 100) / 100, I = Math.round((2 + (u - 2) * c) * 10) / 10, te = Math.round(_ * c * 10) / 10, ne = Math.round(I * 2.5 * 10) / 10, re = Math.round((.4 + (2 + u * .8) * c) * 10) / 10, L = `translate(${e.x}, ${e.y})`, R = `translate(${t.x}, ${t.y})`;
 	return /* @__PURE__ */ h("svg", {
 		"aria-hidden": "true",
 		focusable: "false",
@@ -2215,7 +2225,7 @@ function _n({ a: e, b: t, srcA: n, srcB: r, opts: i, width: a, height: o, prox:
 					children: [
 						/* @__PURE__ */ m("feGaussianBlur", {
 							in: "SourceGraphic",
-							stdDeviation: te,
+							stdDeviation: I,
 							result: "b"
 						}),
 						/* @__PURE__ */ m("feColorMatrix", {
@@ -2226,7 +2236,7 @@ function _n({ a: e, b: t, srcA: n, srcB: r, opts: i, width: a, height: o, prox:
 						}),
 						/* @__PURE__ */ m("feGaussianBlur", {
 							in: "SourceGraphic",
-							stdDeviation: re,
+							stdDeviation: ne,
 							result: "bc"
 						}),
 						/* @__PURE__ */ m("feComposite", {
@@ -2245,7 +2255,7 @@ function _n({ a: e, b: t, srcA: n, srcB: r, opts: i, width: a, height: o, prox:
 						/* @__PURE__ */ m("feDisplacementMap", {
 							in: "mix",
 							in2: "wn",
-							scale: ne,
+							scale: te,
 							xChannelSelector: "R",
 							yChannelSelector: "G",
 							result: "warped"
@@ -2344,7 +2354,7 @@ function _n({ a: e, b: t, srcA: n, srcB: r, opts: i, width: a, height: o, prox:
 						}),
 						/* @__PURE__ */ m("feGaussianBlur", {
 							in: "SourceGraphic",
-							stdDeviation: te,
+							stdDeviation: I,
 							result: "mb"
 						}),
 						/* @__PURE__ */ m("feColorMatrix", {
@@ -2363,7 +2373,7 @@ function _n({ a: e, b: t, srcA: n, srcB: r, opts: i, width: a, height: o, prox:
 						/* @__PURE__ */ m("feDisplacementMap", {
 							in: "mg",
 							in2: "mwn",
-							scale: ne,
+							scale: te,
 							xChannelSelector: "R",
 							yChannelSelector: "G",
 							result: "mshape"
@@ -2399,7 +2409,7 @@ function _n({ a: e, b: t, srcA: n, srcB: r, opts: i, width: a, height: o, prox:
 					y: "-40%",
 					width: "180%",
 					height: "180%",
-					children: /* @__PURE__ */ m("feGaussianBlur", { stdDeviation: ie })
+					children: /* @__PURE__ */ m("feGaussianBlur", { stdDeviation: re })
 				}),
 				/* @__PURE__ */ h("mask", {
 					id: `${l}-ma`,
@@ -2411,7 +2421,7 @@ function _n({ a: e, b: t, srcA: n, srcB: r, opts: i, width: a, height: o, prox:
 					children: [/* @__PURE__ */ m("g", {
 						filter: `url(#${l}-edge)`,
 						children: /* @__PURE__ */ m("g", {
-							transform: ae,
+							transform: L,
 							children: /* @__PURE__ */ m("rect", {
 								width: e.w,
 								height: e.h,
@@ -2441,7 +2451,7 @@ function _n({ a: e, b: t, srcA: n, srcB: r, opts: i, width: a, height: o, prox:
 					children: [/* @__PURE__ */ m("g", {
 						filter: `url(#${l}-edge)`,
 						children: /* @__PURE__ */ m("g", {
-							transform: I,
+							transform: R,
 							children: /* @__PURE__ */ m("rect", {
 								width: t.w,
 								height: t.h,
@@ -2465,7 +2475,7 @@ function _n({ a: e, b: t, srcA: n, srcB: r, opts: i, width: a, height: o, prox:
 			/* @__PURE__ */ h("g", {
 				filter: `url(#${l}-goo)`,
 				children: [/* @__PURE__ */ m("g", {
-					transform: ae,
+					transform: L,
 					children: /* @__PURE__ */ m("rect", {
 						width: e.w,
 						height: e.h,
@@ -2473,7 +2483,7 @@ function _n({ a: e, b: t, srcA: n, srcB: r, opts: i, width: a, height: o, prox:
 						fill: `url(#${l}-pa)`
 					})
 				}), /* @__PURE__ */ m("g", {
-					transform: I,
+					transform: R,
 					children: /* @__PURE__ */ m("rect", {
 						width: t.w,
 						height: t.h,
@@ -2487,7 +2497,7 @@ function _n({ a: e, b: t, srcA: n, srcB: r, opts: i, width: a, height: o, prox:
 				children: /* @__PURE__ */ h("g", {
 					filter: `url(#${l}-marble)`,
 					children: [/* @__PURE__ */ m("g", {
-						transform: ae,
+						transform: L,
 						children: /* @__PURE__ */ m("rect", {
 							width: e.w,
 							height: e.h,
@@ -2495,7 +2505,7 @@ function _n({ a: e, b: t, srcA: n, srcB: r, opts: i, width: a, height: o, prox:
 							fill: `url(#${l}-pa)`
 						})
 					}), /* @__PURE__ */ m("g", {
-						transform: I,
+						transform: R,
 						children: /* @__PURE__ */ m("rect", {
 							width: t.w,
 							height: t.h,
@@ -2508,7 +2518,7 @@ function _n({ a: e, b: t, srcA: n, srcB: r, opts: i, width: a, height: o, prox:
 			/* @__PURE__ */ m("g", {
 				mask: `url(#${l}-ma)`,
 				children: /* @__PURE__ */ m("g", {
-					transform: ae,
+					transform: L,
 					children: /* @__PURE__ */ m("rect", {
 						width: e.w,
 						height: e.h,
@@ -2520,7 +2530,7 @@ function _n({ a: e, b: t, srcA: n, srcB: r, opts: i, width: a, height: o, prox:
 			/* @__PURE__ */ m("g", {
 				mask: `url(#${l}-mb)`,
 				children: /* @__PURE__ */ m("g", {
-					transform: I,
+					transform: R,
 					children: /* @__PURE__ */ m("rect", {
 						width: t.w,
 						height: t.h,
@@ -2809,6 +2819,7 @@ function Dn(e) {
 		"x",
 		"y",
 		"scale",
+		"scaleY",
 		"transition",
 		"delay",
 		"radius",
@@ -2824,12 +2835,12 @@ var On = n(function({ blur: e = 6, contrast: t = 18, gloss: n = 0, fill: r = "va
 		w: 0,
 		h: 0
 	}), [ee, j] = d({
-		waviness: me.waviness,
-		wavinessFreq: me.wavinessFreq
-	}), [M, N] = d(0), P = u(0), F = Ot(), te = y === "reduced" || F, [ne, re] = d(te ? "reduced" : "static"), ae = Math.max(0, Cn(e, 6)), I = Math.max(1, Cn(t, 18)), L = Math.max(0, Cn(a, 24)), oe = Math.max(0, Cn(g ?? ee.waviness, me.waviness)), se = v !== !1 && Math.max(0, Cn(v ?? .3, ye)), R = V(oe, k.w > 0 && k.h > 0 ? Math.min(k.w, k.h) : 0, se), ce = Math.max(0, Cn(_ ?? ee.wavinessFreq, me.wavinessFreq)), le = wn(f, T.current), ue = wn(p, T.current), de = l(() => jt(le), [le]), fe = l(() => Ft(de), [de]), pe = l(() => Pt(de), [de]), he = l(() => Mt(ue), [ue]), ge = Math.ceil(ae * 3 + L + It(fe) + (he ? he.width : 0) + R), _e = u(ge);
+		waviness: fe.waviness,
+		wavinessFreq: fe.wavinessFreq
+	}), [M, N] = d(0), P = u(0), F = Ot(), I = y === "reduced" || F, [te, ne] = d(I ? "reduced" : "static"), L = Math.max(0, Cn(e, 6)), R = Math.max(1, Cn(t, 18)), z = Math.max(0, Cn(a, 24)), ie = Math.max(0, Cn(g ?? ee.waviness, fe.waviness)), ae = v !== !1 && Math.max(0, Cn(v ?? .3, ye)), B = V(ie, k.w > 0 && k.h > 0 ? Math.min(k.w, k.h) : 0, ae), oe = Math.max(0, Cn(_ ?? ee.wavinessFreq, fe.wavinessFreq)), se = wn(f, T.current), ce = wn(p, T.current), le = l(() => jt(se), [se]), ue = l(() => Ft(le), [le]), de = l(() => Pt(le), [le]), pe = l(() => Mt(ce), [ce]), me = Math.ceil(L * 3 + z + It(ue) + (pe ? pe.width : 0) + B), he = u(me);
+	he.current = me;
+	let ge = Math.ceil(me + M), _e = u(ge);
 	_e.current = ge;
-	let z = Math.ceil(ge + M), B = u(z);
-	B.current = z;
 	let H = `liquid-gooey-${Sn(s())}`, be = i((e) => {
 		T.current = e, typeof w == "function" ? w(e) : w && (w.current = e);
 	}, [w]), xe = i((e) => O(e), []);
@@ -2837,8 +2848,8 @@ var On = n(function({ blur: e = 6, contrast: t = 18, gloss: n = 0, fill: r = "va
 		let e = T.current;
 		if (!e) return;
 		let t = {
-			waviness: Math.max(0, g === void 0 ? Tn(E.waviness, e, me.waviness) : Cn(g, me.waviness)),
-			wavinessFreq: Math.max(0, _ === void 0 ? Tn(E.wavinessFreq, e, me.wavinessFreq) : Cn(_, me.wavinessFreq))
+			waviness: Math.max(0, g === void 0 ? Tn(E.waviness, e, fe.waviness) : Cn(g, fe.waviness)),
+			wavinessFreq: Math.max(0, _ === void 0 ? Tn(E.wavinessFreq, e, fe.wavinessFreq) : Cn(_, fe.wavinessFreq))
 		};
 		j((e) => e.waviness === t.waviness && e.wavinessFreq === t.wavinessFreq ? e : t);
 	}, [g, _]);
@@ -2846,9 +2857,9 @@ var On = n(function({ blur: e = 6, contrast: t = 18, gloss: n = 0, fill: r = "va
 		getGroup: () => T.current,
 		getFilterArea: () => {
 			let e = T.current;
-			return e ? (e.offsetWidth + (_e.current + P.current) * 2) * (e.offsetHeight + (_e.current + P.current) * 2) : 0;
+			return e ? (e.offsetWidth + (he.current + P.current) * 2) * (e.offsetHeight + (he.current + P.current) * 2) : 0;
 		},
-		onModeChange: re,
+		onModeChange: ne,
 		onFeaturePaddingChange: (e) => {
 			P.current = e, N((t) => Math.abs(t - e) < .5 ? t : e);
 		},
@@ -2862,24 +2873,24 @@ var On = n(function({ blur: e = 6, contrast: t = 18, gloss: n = 0, fill: r = "va
 				w: e.offsetWidth,
 				h: e.offsetHeight
 			};
-			A((e) => e.w === t.w && e.h === t.h ? e : t), U.setFilterArea((t.w + B.current * 2) * (t.h + B.current * 2));
+			A((e) => e.w === t.w && e.h === t.h ? e : t), U.setFilterArea((t.w + _e.current * 2) * (t.h + _e.current * 2));
 		};
 		if (t(), typeof ResizeObserver > "u") return;
 		let n = new ResizeObserver(t);
 		return n.observe(e), () => n.disconnect();
-	}, [U, z]), o(() => {
-		U.setReducedMotion(te);
-	}, [U, te]), o(() => () => U.dispose(), [U]);
+	}, [U, ge]), o(() => {
+		U.setReducedMotion(I);
+	}, [U, I]), o(() => () => U.dispose(), [U]);
 	let Ce = Math.max(1, k.w), we = Math.max(1, k.h), Te = En("game-ui-liquid-group", b);
 	return /* @__PURE__ */ h("div", {
 		...C,
 		ref: be,
 		className: Te,
-		"data-liquid-filter-area": Math.round((k.w + z * 2) * (k.h + z * 2)),
-		"data-liquid-filter-budget": ie,
+		"data-liquid-filter-area": Math.round((k.w + ge * 2) * (k.h + ge * 2)),
+		"data-liquid-filter-budget": re,
 		"data-liquid-feature-padding": Math.round(M * 10) / 10,
-		"data-liquid-motion": ne,
-		"data-liquid-waviness": Math.round(R * 100) / 100,
+		"data-liquid-motion": te,
+		"data-liquid-waviness": Math.round(B * 100) / 100,
 		style: x,
 		children: [
 			/* @__PURE__ */ h("svg", {
@@ -2887,24 +2898,24 @@ var On = n(function({ blur: e = 6, contrast: t = 18, gloss: n = 0, fill: r = "va
 				className: "game-ui-liquid-silhouette",
 				"data-liquid-gooey-silhouette": "",
 				focusable: "false",
-				style: pe ? { filter: pe } : void 0,
+				style: de ? { filter: de } : void 0,
 				viewBox: `0 0 ${Ce} ${we}`,
 				children: [/* @__PURE__ */ m("defs", { children: /* @__PURE__ */ m("filter", {
 					colorInterpolationFilters: "sRGB",
 					filterUnits: "userSpaceOnUse",
-					height: we + z * 2,
+					height: we + ge * 2,
 					id: H,
-					width: Ce + z * 2,
-					x: -z,
-					y: -z,
+					width: Ce + ge * 2,
+					x: -ge,
+					y: -ge,
 					children: /* @__PURE__ */ m(ve, {
-						blur: ae,
-						contrast: I,
+						blur: L,
+						contrast: R,
 						gloss: n,
-						shadows: fe,
-						stroke: he,
-						waviness: R,
-						wavinessFreq: ce
+						shadows: ue,
+						stroke: pe,
+						waviness: B,
+						wavinessFreq: oe
 					})
 				}) }), /* @__PURE__ */ m("g", {
 					ref: xe,
@@ -2930,95 +2941,97 @@ var On = n(function({ blur: e = 6, contrast: t = 18, gloss: n = 0, fill: r = "va
 			})
 		]
 	});
-}), kn = n(function({ effect: e, melt: t, dissolve: n, x: r = 0, y: a = 0, scale: d = 1, transition: g, delay: _, radius: v, blob: y, morph: b, bend: x, observe: S, className: C, style: w, children: T, ...E }, D) {
-	let { portal: O, engine: k, follow: A, imageMelt: ee } = xn(), j = `liquid-item-${Sn(s())}`, M = u(null), N = u(null), P = u(null), F = u(null), te = JSON.stringify(n ?? null), ne = n !== void 0 && n !== !1, re = l(() => {
-		let t = e === "morph" || e === "bend" ? e : void 0, n = t === "bend", i = e === "bend" || A && b === void 0 && e !== "morph" || ne && b === void 0 && e !== "morph" ? void 0 : b ?? {}, o = {
+}), kn = n(function({ effect: e, melt: t, dissolve: n, x: r = 0, y: a = 0, scale: d = 1, scaleY: g, transition: _, delay: v, radius: y, blob: b, morph: x, bend: S, observe: C, className: w, style: T, children: E, ...D }, O) {
+	let { portal: k, engine: A, follow: ee, imageMelt: j } = xn(), M = `liquid-item-${Sn(s())}`, N = u(null), P = u(null), F = u(null), I = u(null), te = JSON.stringify(n ?? null), ne = n !== void 0 && n !== !1, re = l(() => {
+		let t = e === "morph" || e === "bend" ? e : void 0, n = t === "bend", i = e === "bend" || ee && x === void 0 && e !== "morph" || ne && x === void 0 && e !== "morph" ? void 0 : x ?? {}, o = {
 			...t === void 0 ? {} : { effect: t },
 			...i === void 0 ? {} : { morph: i },
-			...x === void 0 ? {} : { bend: x },
-			...S === void 0 && !n ? {} : { observe: n || S },
+			...S === void 0 ? {} : { bend: S },
+			...C === void 0 && !n ? {} : { observe: n || C },
 			x: Cn(r, 0),
 			y: Cn(a, 0),
-			scale: Cn(d, 1)
+			scale: Cn(d, 1),
+			...g === void 0 ? {} : { scaleY: Cn(g, 1) }
 		};
-		return g !== void 0 && (o.transition = g), _ !== void 0 && (o.delay = _), v !== void 0 && (o.radius = v), y !== void 0 && (o.blob = y), o;
+		return _ !== void 0 && (o.transition = _), v !== void 0 && (o.delay = v), y !== void 0 && (o.radius = y), b !== void 0 && (o.blob = b), o;
 	}, [
-		x,
-		y,
-		_,
-		e,
-		A,
-		ne,
-		b,
 		S,
+		b,
 		v,
+		e,
+		ee,
+		ne,
+		x,
+		C,
+		y,
 		d,
 		g,
+		_,
 		r,
 		a
 	]);
-	P.current === null && (P.current = re);
-	let ie = i((e) => {
-		M.current = e, typeof D == "function" ? D(e) : D && (D.current = e);
-	}, [D]);
+	F.current === null && (F.current = re);
+	let L = i((e) => {
+		N.current = e, typeof O == "function" ? O(e) : O && (O.current = e);
+	}, [O]);
 	return c(() => {
-		let e = M.current, t = N.current;
-		if (!(!O || !e || !t || !P.current)) return k.register({
-			id: j,
+		let e = N.current, t = P.current;
+		if (!(!k || !e || !t || !F.current)) return A.register({
+			id: M,
 			host: e,
 			blob: t,
-			config: P.current
+			config: F.current
 		});
 	}, [
-		k,
-		j,
-		O
+		A,
+		M,
+		k
 	]), c(() => {
-		k.update(j, re);
+		A.update(M, re);
 	}, [
 		re,
-		k,
-		j
+		A,
+		M
 	]), c(() => () => {
-		F.current?.unregister(), F.current = null;
-	}, [ee]), c(() => {
+		I.current?.unregister(), I.current = null;
+	}, [j]), c(() => {
 		if (e === "move" || n === void 0 || n === !1) {
-			F.current?.unregister(), F.current = null;
+			I.current?.unregister(), I.current = null;
 			return;
 		}
-		let t = M.current;
+		let t = N.current;
 		if (t) {
-			if (F.current) {
-				F.current.update(n);
+			if (I.current) {
+				I.current.update(n);
 				return;
 			}
-			F.current = Qt(ee, t, n);
+			I.current = Qt(j, t, n);
 		}
 	}, [
 		te,
 		e,
-		ee
+		j
 	]), o(() => {
 		let t = e;
 		t === "move" && console.warn("[swimmer-ui] effect=\"move\" is not an item effect. Use <LiquidGroup motion=\"follow\"> for selection and progress."), !(t !== "move" || !ne) && console.warn("[swimmer-ui] dissolve is ignored for effect=\"move\" because Move intentionally lags the measured image rect.");
 	}, [e, ne]), c(() => {
-		let e = M.current;
+		let e = N.current;
 		if (!e) return;
 		let t = e.firstElementChild;
 		if (!t) return;
 		let n = window.getComputedStyle(t), r = n.borderStyle !== "none" && n.borderWidth !== "0px" && n.borderWidth !== "", i = n.outlineStyle !== "none" && n.outlineWidth !== "0px" && n.outlineWidth !== "", a = n.boxShadow && n.boxShadow !== "none";
 		(r || i || a) && console.warn("LiquidGroup.Item children should not have their own border, outline, or box-shadow. They exist on the content layer and will not merge with the liquid silhouette. Use the `stroke` and `shadow` props on <LiquidGroup> instead.");
 	}, []), /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m("div", {
-		...E,
-		ref: ie,
-		className: En("game-ui-liquid-item", C),
-		style: w,
-		children: T
-	}), O ? f(/* @__PURE__ */ m("path", {
-		ref: N,
+		...D,
+		ref: L,
+		className: En("game-ui-liquid-item", w),
+		style: T,
+		children: E
+	}), k ? f(/* @__PURE__ */ m("path", {
+		ref: P,
 		d: "",
 		"data-liquid-gooey-blob": ""
-	}), O) : null] });
+	}), k) : null] });
 }), An = n(function(e, t) {
 	let { imageMelt: n } = xn();
 	if (e.effect !== "melt") return /* @__PURE__ */ m(kn, {
@@ -3053,7 +3066,7 @@ var On = n(function({ blur: e = 6, contrast: t = 18, gloss: n = 0, fill: r = "va
 				bounce: .35,
 				contentBlur: 0
 			},
-			transition: "bouncy"
+			transition: "wobbly"
 		}
 	},
 	settle: {
@@ -3074,7 +3087,7 @@ var On = n(function({ blur: e = 6, contrast: t = 18, gloss: n = 0, fill: r = "va
 				bounce: .55,
 				contentBlur: 0
 			},
-			transition: "bouncy"
+			transition: "wobbly"
 		}
 	},
 	merge: {
@@ -3177,36 +3190,44 @@ function Fn(e, t) {
 //#region src/LiquidSurface.tsx
 var In = {
 	press: {
-		scale: .95,
-		y: 1.5
+		scale: 1.05,
+		scaleY: .9,
+		y: 2
 	},
 	settle: {
 		scale: 1,
+		scaleY: 1,
 		y: 0
 	},
 	fill: {
 		scale: 1,
+		scaleY: 1,
 		y: 0
 	},
 	drain: {
-		scale: .92,
-		y: 0
+		scale: 1.08,
+		scaleY: .84,
+		y: 4
 	},
 	merge: {
 		scale: 1,
+		scaleY: 1,
 		y: 0
 	},
 	follow: {
 		scale: 1,
+		scaleY: 1,
 		y: 0
 	}
 }, Ln = { settle: {
-	scale: .97,
-	y: -6
+	scale: .94,
+	scaleY: 1.08,
+	y: -8
 } };
 function Rn({ children: e, form: t = "press", active: n = !1, fill: r = "var(--game-ui-liquid-surface-fill, var(--game-ui-surface-raised))", stroke: i, shadow: a, radius: o = 999, className: s, style: c }) {
 	let u = Ot(), d = l(() => Pn(t), [t]), f = l(() => Fn(t), [t]), p = n && !u, g = p ? In[t] : Ln[t] ?? {
 		scale: 1,
+		scaleY: 1,
 		y: 0
 	};
 	return /* @__PURE__ */ h("span", {
@@ -3236,6 +3257,7 @@ function Rn({ children: e, form: t = "press", active: n = !1, fill: r = "var(--g
 				...f.dissolve === void 0 ? {} : { dissolve: f.dissolve && p },
 				radius: o,
 				scale: g.scale,
+				scaleY: g.scaleY,
 				...f.transition === void 0 ? {} : { transition: f.transition },
 				y: g.y,
 				children: /* @__PURE__ */ m("span", { className: "game-ui-liquid-surface__fill" })
@@ -3724,7 +3746,7 @@ function fr(e, t, n, r) {
 	function A(t) {
 		e.bindFramebuffer(e.FRAMEBUFFER, t ? t.fbo : null), e.viewport(0, 0, t ? t.w : b, t ? t.h : x), e.drawArrays(e.TRIANGLES, 0, 3);
 	}
-	let ee = new Float32Array(nr.length), j = new Float32Array(ir.length), M = 0, N = 0, P = 0, F = performance.now(), te = [
+	let ee = new Float32Array(nr.length), j = new Float32Array(ir.length), M = 0, N = 0, P = 0, F = performance.now(), I = [
 		0,
 		1,
 		2
@@ -3733,61 +3755,61 @@ function fr(e, t, n, r) {
 		y: 0,
 		t: -99,
 		on: 0
-	})), ne = /* @__PURE__ */ new Float32Array(12), re = 0, ie = 0, ae = 0, I = {
+	})), te = /* @__PURE__ */ new Float32Array(12), ne = 0, re = 0, L = 0, R = {
 		x: 0,
 		y: 0
-	}, L = {
+	}, z = {
 		x: 0,
 		y: 0
-	}, oe = 0, se = 0, R = {
+	}, ie = 0, ae = 0, B = {
 		over: !1,
 		press: !1,
 		focus: !1
 	};
-	function ce(e, t) {
-		let n = te[re];
-		n && (re = (re + 1) % te.length, n.x = e, n.y = t, n.t = P, n.on = 1);
+	function oe(e, t) {
+		let n = I[ne];
+		n && (ne = (ne + 1) % I.length, n.x = e, n.y = t, n.t = P, n.on = 1);
 	}
-	function le(e) {
+	function se(e) {
 		let t = n.getBoundingClientRect(), r = t.height || 1;
 		return [(e.clientX - (t.left + t.width / 2)) / r, (e.clientY - (t.top + t.height / 2)) / r];
 	}
-	function ue() {
-		N = R.over || R.press || R.focus ? 1 : 0, ae = +!!R.press;
+	function ce() {
+		N = B.over || B.press || B.focus ? 1 : 0, L = +!!B.press;
 	}
-	let de = window.matchMedia("(prefers-reduced-motion: reduce)"), fe = null, pe = 0, me = !1, he = !1;
-	function ge() {
+	let le = window.matchMedia("(prefers-reduced-motion: reduce)"), ue = null, de = 0, fe = !1, pe = !1;
+	function me() {
 		let e = getComputedStyle(n);
 		return rr.base = sr(e, "--game-ui-liquid-metal-rest", rr.base), rr.speed = sr(e, "--game-ui-liquid-metal-sweep-speed", rr.speed), tr.disp = sr(e, "--game-ui-liquid-metal-dispersion", tr.disp), ar.glow = sr(e, "--game-ui-liquid-metal-bloom", ar.glow), { accent: or(getComputedStyle(O).color) };
 	}
-	function _e(t) {
-		if (pe = 0, me || he) return;
+	function he(t) {
+		if (de = 0, fe || pe) return;
 		let r = (t - F) / 1e3;
 		F = t;
 		let l = Math.min(r, 1 / 20);
-		de.matches || (P += l);
+		le.matches || (P += l);
 		let u = N > M ? 1 - .0012 ** l : 1 - 12e-5 ** l;
 		M += (N - M) * u, Math.abs(N - M) < 8e-4 && (M = N);
-		let d = ae > ie ? 1 - 1e-9 ** l : 1 - .004 ** l;
-		ie += (ae - ie) * d, Math.abs(ae - ie) < .002 && (ie = ae);
+		let d = L > re ? 1 - 1e-9 ** l : 1 - .004 ** l;
+		re += (L - re) * d, Math.abs(L - re) < .002 && (re = L);
 		let f = !1;
-		for (let e = 0; e < te.length; e += 1) {
-			let t = te[e];
-			t && (t.on && P - t.t > 4 && (t.on = 0), t.on && (f = !0), ne[e * 4] = t.x, ne[e * 4 + 1] = t.y, ne[e * 4 + 2] = t.t, ne[e * 4 + 3] = t.on);
+		for (let e = 0; e < I.length; e += 1) {
+			let t = I[e];
+			t && (t.on && P - t.t > 4 && (t.on = 0), t.on && (f = !0), te[e * 4] = t.x, te[e * 4 + 1] = t.y, te[e * 4 + 2] = t.t, te[e * 4 + 3] = t.on);
 		}
-		let p = 1 - Y.ptrLag ** +l, O = (I.x - L.x) * p, re = (I.y - L.y) * p;
-		L.x += O, L.y += re;
-		let ce = Math.min(Math.hypot(O, re) / Math.max(l, .001) / Y.ptrVref, 1);
-		se += (ce - se) * (1 - (ce > se ? .001 : .02) ** l);
-		let le = R.over || R.press ? 1 : 0;
-		oe += (le - oe) * (1 - .004 ** l), Math.abs(le - oe) < .002 && (oe = le), R.over = n.matches(":hover"), R.focus = n.matches(":focus-visible"), ue(), D && k();
-		let z = de.matches && !f && oe < .002 ? `${M}|${ie}|${b}|${x}` : null;
-		if (z !== null && z === fe) {
-			pe = requestAnimationFrame(_e);
+		let p = 1 - Y.ptrLag ** +l, O = (R.x - z.x) * p, ne = (R.y - z.y) * p;
+		z.x += O, z.y += ne;
+		let oe = Math.min(Math.hypot(O, ne) / Math.max(l, .001) / Y.ptrVref, 1);
+		ae += (oe - ae) * (1 - (oe > ae ? .001 : .02) ** l);
+		let se = B.over || B.press ? 1 : 0;
+		ie += (se - ie) * (1 - .004 ** l), Math.abs(se - ie) < .002 && (ie = se), B.over = n.matches(":hover"), B.focus = n.matches(":focus-visible"), ce(), D && k();
+		let ge = le.matches && !f && ie < .002 ? `${M}|${re}|${b}|${x}` : null;
+		if (ge !== null && ge === ue) {
+			de = requestAnimationFrame(he);
 			return;
 		}
-		fe = z;
-		let { accent: B } = ge();
+		ue = ge;
+		let { accent: _e } = me();
 		for (let e = 0; e < ee.length; e += 1) {
 			let t = nr[e];
 			t && (ee[e] = tr[t]);
@@ -3797,7 +3819,7 @@ function fr(e, t, n, r) {
 			t && (j[e] = rr[t]);
 		}
 		let ve = Math.max(C, 110), ye = Math.max(2.4, ve / 516 * 3.2), V = cr(e, i.u), H = cr(e, a.u), be = cr(e, o.u), xe = cr(e, s.u), U = cr(e, c.u);
-		e.useProgram(i.p), V.f2("uC", w, T), V.f2("uHalf", S / 2, C / 2), V.f1("uT", P), V.f1("uHover", M), V.f1("uPress", ie), V.fv4("uRip", ne), V.f4("uRipK", Y.speed, Y.width, Y.decay, Y.amp), V.f4("uRipK2", Y.facet, Y.lobes, Y.sharp, Y.emit), V.f4("uPtr", L.x, L.y, oe, se), V.f4("uPtrK", Y.ptrRad, Y.ptrAmp, Y.ptrFast, Y.ptrRim), V.f3("uAccent", B[0], B[1], B[2]), V.fv1("uP", ee), A(m), e.useProgram(a.p), H.f2("uC", w, T), H.f2("uHalf", S / 2, C / 2), H.f1("uT", P), H.f1("uBw", ye), H.f1("uPress", ie), H.fv4("uRip", ne), H.f4("uRipK", Y.speed, Y.width, Y.decay, Y.amp), H.f4("uRipK2", Y.facet, Y.lobes, Y.sharp, Y.emit), H.f4("uPtr", L.x, L.y, oe, se), H.f4("uPtrK", Y.ptrRad, Y.ptrAmp, Y.ptrFast, Y.ptrRim), H.f3("uAccent", B[0], B[1], B[2]), H.fv1("uE", j), A(h), e.useProgram(o.p), e.activeTexture(e.TEXTURE0), e.bindTexture(e.TEXTURE_2D, m.tex), be.i1("uTex", 0), be.f1("uAdd", 0), be.f2("uDstTexel", 1 / g.w, 1 / g.h), be.f2("uSrcTexel", 1 / b, 1 / x), A(g), e.useProgram(s.p), xe.i1("uTex", 0), xe.f2("uTexel", 1 / g.w, 1 / g.h);
+		e.useProgram(i.p), V.f2("uC", w, T), V.f2("uHalf", S / 2, C / 2), V.f1("uT", P), V.f1("uHover", M), V.f1("uPress", re), V.fv4("uRip", te), V.f4("uRipK", Y.speed, Y.width, Y.decay, Y.amp), V.f4("uRipK2", Y.facet, Y.lobes, Y.sharp, Y.emit), V.f4("uPtr", z.x, z.y, ie, ae), V.f4("uPtrK", Y.ptrRad, Y.ptrAmp, Y.ptrFast, Y.ptrRim), V.f3("uAccent", _e[0], _e[1], _e[2]), V.fv1("uP", ee), A(m), e.useProgram(a.p), H.f2("uC", w, T), H.f2("uHalf", S / 2, C / 2), H.f1("uT", P), H.f1("uBw", ye), H.f1("uPress", re), H.fv4("uRip", te), H.f4("uRipK", Y.speed, Y.width, Y.decay, Y.amp), H.f4("uRipK2", Y.facet, Y.lobes, Y.sharp, Y.emit), H.f4("uPtr", z.x, z.y, ie, ae), H.f4("uPtrK", Y.ptrRad, Y.ptrAmp, Y.ptrFast, Y.ptrRim), H.f3("uAccent", _e[0], _e[1], _e[2]), H.fv1("uE", j), A(h), e.useProgram(o.p), e.activeTexture(e.TEXTURE0), e.bindTexture(e.TEXTURE_2D, m.tex), be.i1("uTex", 0), be.f1("uAdd", 0), be.f2("uDstTexel", 1 / g.w, 1 / g.h), be.f2("uSrcTexel", 1 / b, 1 / x), A(g), e.useProgram(s.p), xe.i1("uTex", 0), xe.f2("uTexel", 1 / g.w, 1 / g.h);
 		let Se = ar.soften * (ve * .5) * .95;
 		if (Se > .1) {
 			let t = Math.min(4, Math.max(1, Math.ceil(Se / 3)));
@@ -3812,45 +3834,45 @@ function fr(e, t, n, r) {
 			5.2,
 			9
 		].map((e) => e * Ce)) xe.f1("uR", t), e.bindTexture(e.TEXTURE_2D, v.tex), xe.f2("uDir", 1, 0), A(y), e.bindTexture(e.TEXTURE_2D, y.tex), xe.f2("uDir", 0, 1), A(v);
-		e.useProgram(c.p), e.activeTexture(e.TEXTURE0), e.bindTexture(e.TEXTURE_2D, g.tex), U.i1("uSoft", 0), e.activeTexture(e.TEXTURE1), e.bindTexture(e.TEXTURE_2D, h.tex), U.i1("uRim", 1), e.activeTexture(e.TEXTURE2), e.bindTexture(e.TEXTURE_2D, v.tex), U.i1("uGlow", 2), U.f2("uRes", b, x), U.f2("uC", w, T), U.f2("uHalf", S / 2, C / 2), U.f1("uT", P), U.fv4("uRip", ne), U.f4("uRipK", Y.speed, Y.width, Y.decay, Y.amp), U.f4("uRipK2", Y.facet, Y.lobes, Y.sharp, Y.emit), U.f3("uAccent", B[0], B[1], B[2]), U.f1("uGlowGain", ar.glow), U.f1("uGlowIn", ar.glowIn), U.f1("uOccl", ar.occl), U.f1("uDim", tr.dim), U.f1("uPunch", ar.punch), A(null), pe = requestAnimationFrame(_e);
+		e.useProgram(c.p), e.activeTexture(e.TEXTURE0), e.bindTexture(e.TEXTURE_2D, g.tex), U.i1("uSoft", 0), e.activeTexture(e.TEXTURE1), e.bindTexture(e.TEXTURE_2D, h.tex), U.i1("uRim", 1), e.activeTexture(e.TEXTURE2), e.bindTexture(e.TEXTURE_2D, v.tex), U.i1("uGlow", 2), U.f2("uRes", b, x), U.f2("uC", w, T), U.f2("uHalf", S / 2, C / 2), U.f1("uT", P), U.fv4("uRip", te), U.f4("uRipK", Y.speed, Y.width, Y.decay, Y.amp), U.f4("uRipK2", Y.facet, Y.lobes, Y.sharp, Y.emit), U.f3("uAccent", _e[0], _e[1], _e[2]), U.f1("uGlowGain", ar.glow), U.f1("uGlowIn", ar.glowIn), U.f1("uOccl", ar.occl), U.f1("uDim", tr.dim), U.f1("uPunch", ar.punch), A(null), de = requestAnimationFrame(he);
 	}
-	let z = (e) => {
+	let ge = (e) => {
 		if (e.pointerType !== "mouse") return;
-		let [t, n] = le(e);
-		I.x = t, I.y = n, L.x = t, L.y = n, se = 0, R.over = !0, ue();
-	}, B = (e) => {
-		e.pointerType === "mouse" && (R.over = !1, ue());
+		let [t, n] = se(e);
+		R.x = t, R.y = n, z.x = t, z.y = n, ae = 0, B.over = !0, ce();
+	}, _e = (e) => {
+		e.pointerType === "mouse" && (B.over = !1, ce());
 	}, ve = (e) => {
-		if (!R.over && !R.press) return;
-		let [t, n] = le(e);
-		I.x = t, I.y = n;
+		if (!B.over && !B.press) return;
+		let [t, n] = se(e);
+		R.x = t, R.y = n;
 	}, ye = (e) => {
-		let [t, n] = le(e);
-		I.x = t, I.y = n, R.press = !0, ue(), ce(t, n);
+		let [t, n] = se(e);
+		R.x = t, R.y = n, B.press = !0, ce(), oe(t, n);
 	}, V = () => {
-		R.press = !1, ue();
+		B.press = !1, ce();
 	}, H = () => {
-		R.focus = n.matches(":focus-visible"), ue();
+		B.focus = n.matches(":focus-visible"), ce();
 	}, be = () => {
-		R.focus = !1, ue();
+		B.focus = !1, ce();
 	}, xe = (e) => {
-		e.key !== "Enter" && e.key !== " " || e.repeat || (R.press = !0, ue(), ce(0, 0));
+		e.key !== "Enter" && e.key !== " " || e.repeat || (B.press = !0, ce(), oe(0, 0));
 	}, U = (e) => {
-		e.key !== "Enter" && e.key !== " " || (R.press = !1, ue());
+		e.key !== "Enter" && e.key !== " " || (B.press = !1, ce());
 	};
-	n.addEventListener("pointerenter", z), n.addEventListener("pointerleave", B), window.addEventListener("pointermove", ve, { passive: !0 }), n.addEventListener("pointerdown", ye), window.addEventListener("pointerup", V), window.addEventListener("pointercancel", V), n.addEventListener("focus", H), n.addEventListener("blur", be), n.addEventListener("keydown", xe), n.addEventListener("keyup", U);
+	n.addEventListener("pointerenter", ge), n.addEventListener("pointerleave", _e), window.addEventListener("pointermove", ve, { passive: !0 }), n.addEventListener("pointerdown", ye), window.addEventListener("pointerup", V), window.addEventListener("pointercancel", V), n.addEventListener("focus", H), n.addEventListener("blur", be), n.addEventListener("keydown", xe), n.addEventListener("keyup", U);
 	let Se = new ResizeObserver(() => {
 		D = !0;
 	});
-	return Se.observe(r), Se.observe(n), k(), pe = requestAnimationFrame(_e), {
+	return Se.observe(r), Se.observe(n), k(), de = requestAnimationFrame(he), {
 		pause: () => {
-			me = !0, pe && cancelAnimationFrame(pe), pe = 0;
+			fe = !0, de && cancelAnimationFrame(de), de = 0;
 		},
 		resume: () => {
-			he || (me = !1, F = performance.now(), fe = null, pe ||= requestAnimationFrame(_e));
+			pe || (fe = !1, F = performance.now(), ue = null, de ||= requestAnimationFrame(he));
 		},
 		dispose: () => {
-			he || (he = !0, me = !0, pe && cancelAnimationFrame(pe), pe = 0, Se.disconnect(), n.removeEventListener("pointerenter", z), n.removeEventListener("pointerleave", B), window.removeEventListener("pointermove", ve), n.removeEventListener("pointerdown", ye), window.removeEventListener("pointerup", V), window.removeEventListener("pointercancel", V), n.removeEventListener("focus", H), n.removeEventListener("blur", be), n.removeEventListener("keydown", xe), n.removeEventListener("keyup", U), O.remove(), e.getExtension("WEBGL_lose_context")?.loseContext());
+			pe || (pe = !0, fe = !0, de && cancelAnimationFrame(de), de = 0, Se.disconnect(), n.removeEventListener("pointerenter", ge), n.removeEventListener("pointerleave", _e), window.removeEventListener("pointermove", ve), n.removeEventListener("pointerdown", ye), window.removeEventListener("pointerup", V), window.removeEventListener("pointercancel", V), n.removeEventListener("focus", H), n.removeEventListener("blur", be), n.removeEventListener("keydown", xe), n.removeEventListener("keyup", U), O.remove(), e.getExtension("WEBGL_lose_context")?.loseContext());
 		}
 	};
 }
@@ -6699,7 +6721,7 @@ var ba = [
 	...M,
 	...N,
 	...P,
-	...te,
+	...I,
 	...E
 }, Sa = {
 	toneAttr: "data-game-ui-tone",
@@ -6720,6 +6742,7 @@ var ba = [
 			components: "Component surface",
 			forms: "Forms, inputs and status",
 			overlayGlass: "Overlay glass HUD",
+			liquid: "Liquid surface",
 			liquidMetal: "Liquid metal CTA",
 			firstSession: "First-session shell",
 			orientation: "Orientation gate preview",
@@ -6822,6 +6845,17 @@ var ba = [
 			sliderLabel: "Effects volume",
 			toggleLabel: "Sound on"
 		},
+		liquid: {
+			body: "The brand’s own surface. `surface=\"liquid\"` is a second axis on GameButton, not a variant — tone still says what the action means, so a destructive action can be liquid too. The silhouette behind is what deforms; the real button never does, so the hit target, the focus ring and the text stay exactly where they were. Press one.",
+			surfacesTitle: "Flat and liquid, same tone",
+			disabledTitle: "Disabled",
+			disabledBody: "A disabled control drops the liquid entirely. Liquid is how this kit says “press me”, and putting that on something that cannot be pressed is a lie told loudly.",
+			formsTitle: "The named forms",
+			formsBody: "Each name is a measured bundle of blur, contrast, outline and spring — a behaviour to pick, not a physics configuration to tune.",
+			trigger: "Trigger",
+			reset: "Reset",
+			press: "hold to press"
+		},
 		liquidMetal: {
 			body: "For the few screens that take money or a yes: checkout, sign-up, badge unlock, landing CTA. Not for reading, queues, or the map — a moving rim is a tax you pay every glance, and the aesthetic-usability effect is strongest in the first seconds. More than two of these on a page means the page is the wrong place.",
 			cssTitle: "CSS renderer · zero WebGL context",
@@ -6924,6 +6958,7 @@ var ba = [
 			components: "组件总览",
 			forms: "表单、输入与状态",
 			overlayGlass: "叠加玻璃 HUD",
+			liquid: "液体表面",
 			liquidMetal: "液态金属 CTA",
 			firstSession: "首次会话外壳",
 			orientation: "横屏门预览",
@@ -7026,6 +7061,17 @@ var ba = [
 			sliderLabel: "音效音量",
 			toggleLabel: "声音开"
 		},
+		liquid: {
+			body: "品牌自己的表面。`surface=\"liquid\"` 是 GameButton 上的第二个轴，不是一种 variant——色调仍然负责说明这个动作是什么意思，所以危险动作也可以是液体的。变形的是后面那层轮廓，真正的按钮从不变形，点击区、焦点环和文字都停在原地。按一下试试。",
+			surfacesTitle: "同一色调，扁平与液体",
+			disabledTitle: "禁用",
+			disabledBody: "禁用的控件完全不穿液体。液体是这套 UI 说「按我」的方式，把这句话放在按不动的东西上，是大声说一句假话。",
+			formsTitle: "命名形态",
+			formsBody: "每个名字是一组实测过的 blur / contrast / 外形 / 弹簧——挑的是一种行为，不是一组物理参数。",
+			trigger: "触发",
+			reset: "复位",
+			press: "按住看看"
+		},
 		liquidMetal: {
 			body: "只用在掏钱或拍板的那几屏：付款、注册、徽章解锁、落地页主按钮。阅读、复习队列、3D 地图一个都不要加——会流动的边框在干活面上是每一次都要付的税。美观可用性效应在第一印象最强、随使用次数衰减。一页出现两个以上，就是用错了地方。",
 			cssTitle: "CSS 渲染器 · 零 WebGL 上下文",
@@ -7193,7 +7239,7 @@ var ba = [
 	},
 	{
 		id: "assetSizing",
-		tokens: te
+		tokens: I
 	}
 ];
 function ka({ id: e, label: t, tokens: n }) {
@@ -7595,6 +7641,101 @@ function Pa() {
 	});
 }
 function Fa() {
+	let { liquid: e } = Da(), [t, n] = d(null);
+	return /* @__PURE__ */ h("div", {
+		className: "game-ui-liquid-showcase",
+		children: [
+			/* @__PURE__ */ m(X, {
+				title: e.surfacesTitle,
+				tone: "strong",
+				children: /* @__PURE__ */ m("div", {
+					className: "game-ui-liquid-showcase__grid",
+					children: [
+						"primary",
+						"secondary",
+						"success",
+						"danger"
+					].map((t) => /* @__PURE__ */ h("div", {
+						className: "game-ui-liquid-showcase__pair",
+						children: [
+							/* @__PURE__ */ m(J, {
+								variant: t,
+								children: t
+							}),
+							/* @__PURE__ */ m(J, {
+								surface: "liquid",
+								variant: t,
+								children: t
+							}),
+							/* @__PURE__ */ m("small", { children: e.press })
+						]
+					}, t))
+				})
+			}),
+			/* @__PURE__ */ h(X, {
+				title: e.disabledTitle,
+				tone: "strong",
+				children: [/* @__PURE__ */ m("p", {
+					className: "game-ui-small-copy",
+					children: e.disabledBody
+				}), /* @__PURE__ */ m("div", {
+					className: "game-ui-liquid-showcase__grid",
+					children: /* @__PURE__ */ h("div", {
+						className: "game-ui-liquid-showcase__pair",
+						children: [/* @__PURE__ */ m(J, {
+							disabled: !0,
+							variant: "primary",
+							children: "flat"
+						}), /* @__PURE__ */ m(J, {
+							disabled: !0,
+							surface: "liquid",
+							variant: "primary",
+							children: "liquid"
+						})]
+					})
+				})]
+			}),
+			/* @__PURE__ */ h(X, {
+				title: e.formsTitle,
+				tone: "strong",
+				children: [/* @__PURE__ */ m("p", {
+					className: "game-ui-small-copy",
+					children: e.formsBody
+				}), /* @__PURE__ */ m("div", {
+					className: "game-ui-liquid-showcase__grid",
+					children: [
+						"press",
+						"settle",
+						"fill",
+						"drain"
+					].map((r) => /* @__PURE__ */ h("div", {
+						className: "game-ui-liquid-showcase__pair",
+						children: [
+							/* @__PURE__ */ m(Rn, {
+								active: t === r,
+								fill: "var(--game-ui-accent)",
+								form: r,
+								radius: 20,
+								children: /* @__PURE__ */ m("span", { className: "game-ui-liquid-showcase__body" })
+							}),
+							/* @__PURE__ */ m(J, {
+								onClick: () => n((e) => e === r ? null : r),
+								variant: "ghost",
+								children: t === r ? e.reset : e.trigger
+							}),
+							/* @__PURE__ */ h("small", { children: [
+								r,
+								" · ",
+								zn(r)
+							] })
+						]
+					}, r))
+				})]
+			})
+		]
+	});
+}
+function Ia() {
 	let { liquidMetal: e } = Da();
 	return /* @__PURE__ */ h("div", {
 		className: "game-ui-liquid-metal-compare",
@@ -7621,7 +7762,7 @@ function Fa() {
 		})]
 	});
 }
-function Ia() {
+function La() {
 	let { modals: e } = Da();
 	return /* @__PURE__ */ h("div", {
 		className: "game-ui-preview-two-up",
@@ -7658,7 +7799,7 @@ function Ia() {
 		})]
 	});
 }
-function La() {
+function Ra() {
 	let { cards: e } = Da();
 	return /* @__PURE__ */ h("div", {
 		className: "game-ui-preview-two-up",
@@ -7706,7 +7847,7 @@ function La() {
 		})]
 	});
 }
-var Ra = [
+var za = [
 	{
 		id: "terrain",
 		label: "Terrain",
@@ -7722,7 +7863,7 @@ var Ra = [
 		label: "Place",
 		icon: "gem"
 	}
-], za = [
+], Ba = [
 	{
 		id: "raise",
 		label: "Raise",
@@ -7748,7 +7889,7 @@ var Ra = [
 		label: "Paint",
 		shortcut: "5"
 	}
-], Ba = [
+], Va = [
 	{
 		id: "grass",
 		label: "Grass",
@@ -7764,7 +7905,7 @@ var Ra = [
 		label: "Path",
 		color: "#b98d5d"
 	}
-], Va = [{
+], Ha = [{
 	id: "foundation",
 	label: "Foundation",
 	icon: "home",
@@ -7783,7 +7924,7 @@ var Ra = [
 		status: "ready"
 	}]
 }];
-function Ha() {
+function Ua() {
 	return /* @__PURE__ */ h("div", {
 		className: "game-ui-preview-two-up",
 		children: [/* @__PURE__ */ m(Ki, {
@@ -7795,10 +7936,10 @@ function Ha() {
 				radius: 2.75,
 				strength: .45
 			},
-			buildCategories: Va,
+			buildCategories: Ha,
 			label: "Desktop terrain and build tools",
-			materials: Ba,
-			modes: Ra,
+			materials: Va,
+			modes: za,
 			selectedBuildItemId: "floor-2x2",
 			status: {
 				label: "Ready",
@@ -7809,7 +7950,7 @@ function Ha() {
 				progressValue: 68
 			},
 			title: "Island tools",
-			tools: za,
+			tools: Ba,
 			undoRedo: {
 				canRedo: !1,
 				canUndo: !0
@@ -7823,11 +7964,11 @@ function Ha() {
 				radius: 1.5,
 				strength: .3
 			},
-			buildCategories: Va,
+			buildCategories: Ha,
 			drawerOpen: !0,
 			label: "Small mobile terrain drawer",
-			materials: Ba,
-			modes: Ra,
+			materials: Va,
+			modes: za,
 			selectedBuildItemId: "floor-2x2",
 			status: {
 				label: "Blocked",
@@ -7835,7 +7976,7 @@ function Ha() {
 				description: "This edit would bury a placed object."
 			},
 			title: "Tools",
-			tools: za,
+			tools: Ba,
 			undoRedo: {
 				canRedo: !0,
 				canUndo: !0
@@ -7844,7 +7985,7 @@ function Ha() {
 		})]
 	});
 }
-function Ua({ label: e, mode: t }) {
+function Wa({ label: e, mode: t }) {
 	return /* @__PURE__ */ h("div", {
 		className: "game-ui-construction-preview-card",
 		"data-preview": t,
@@ -7858,7 +7999,7 @@ function Ua({ label: e, mode: t }) {
 		]
 	});
 }
-var Wa = [
+var Ga = [
 	{
 		id: "preview-deck",
 		title: "Deck robot crew",
@@ -7919,7 +8060,7 @@ var Wa = [
 		before: {
 			label: "Before",
 			caption: "Uneven terrain pad.",
-			content: /* @__PURE__ */ m(Ua, {
+			content: /* @__PURE__ */ m(Wa, {
 				label: "Rough pad",
 				mode: "before"
 			})
@@ -7927,7 +8068,7 @@ var Wa = [
 		after: {
 			label: "After",
 			caption: "Flattened foundation pad with safe clearance.",
-			content: /* @__PURE__ */ m(Ua, {
+			content: /* @__PURE__ */ m(Wa, {
 				label: "Foundation ready",
 				mode: "after"
 			})
@@ -7956,11 +8097,11 @@ var Wa = [
 		}]
 	}
 ];
-function Ga() {
+function Ka() {
 	return /* @__PURE__ */ h("div", {
 		className: "game-ui-preview-two-up",
 		children: [/* @__PURE__ */ m(fa, {
-			jobs: Wa,
+			jobs: Ga,
 			label: "AI contractor jobs",
 			selectedJobId: "review-house-pad",
 			subtitle: "Official contractor UI covers drafts, previews, robot work, validation, review, and local-only provider boundaries.",
@@ -7968,7 +8109,7 @@ function Ga() {
 			variant: "desktop"
 		}), /* @__PURE__ */ m(fa, {
 			drawerOpen: !0,
-			jobs: Wa,
+			jobs: Ga,
 			label: "Small mobile contractor jobs",
 			selectedJobId: "blocked-fence",
 			title: "Contractor",
@@ -7976,7 +8117,7 @@ function Ga() {
 		})]
 	});
 }
-function Ka() {
+function qa() {
 	return /* @__PURE__ */ m(gi, {
 		title: "OwnMySpace island editor preview",
 		hud: /* @__PURE__ */ m(vi, {
@@ -8090,7 +8231,7 @@ function Ka() {
 		})
 	});
 }
-var qa = [{
+var Ja = [{
 	id: "starter",
 	label: "Starter pieces",
 	source: "starter",
@@ -8121,7 +8262,7 @@ var qa = [{
 		}
 	]
 }];
-function Ja() {
+function Ya() {
 	return /* @__PURE__ */ m("div", {
 		className: "game-ui-asset-compression-repro",
 		"aria-label": "Asset card compression repro",
@@ -8147,7 +8288,7 @@ function Ja() {
 			style: { "--repro-width": e.width },
 			children: [/* @__PURE__ */ m(Q, { children: e.label }), /* @__PURE__ */ m(Oi, {
 				density: "dense",
-				groups: qa,
+				groups: Ja,
 				label: `${e.label} assets`,
 				selectedAssetId: "asset-repro-chair",
 				title: "Build"
@@ -8155,7 +8296,7 @@ function Ja() {
 		}, e.id))
 	});
 }
-function Ya() {
+function Xa() {
 	let { firstSession: e } = Da();
 	return /* @__PURE__ */ h("div", {
 		className: "game-ui-first-session-preview",
@@ -8223,7 +8364,7 @@ function Ya() {
 		})]
 	});
 }
-function Xa() {
+function Za() {
 	let { responsive: e } = Da();
 	return /* @__PURE__ */ h("div", {
 		className: "game-ui-proof-frames",
@@ -8236,7 +8377,7 @@ function Xa() {
 		})]
 	});
 }
-function Za() {
+function Qa() {
 	let { forms: e } = Da();
 	return /* @__PURE__ */ h("div", {
 		className: "game-ui-preview-two-up",
@@ -8318,8 +8459,8 @@ function Za() {
 		})]
 	});
 }
-var Qa = Ar.filter((e) => Pr(e).includes("game")), $a = Ar.filter((e) => Pr(e).includes("line"));
-function eo({ names: e, style: t }) {
+var $a = Ar.filter((e) => Pr(e).includes("game")), eo = Ar.filter((e) => Pr(e).includes("line"));
+function to({ names: e, style: t }) {
 	return /* @__PURE__ */ m("div", {
 		className: "game-ui-icon-grid",
 		children: e.map((e) => /* @__PURE__ */ h("figure", {
@@ -8332,7 +8473,7 @@ function eo({ names: e, style: t }) {
 		}, `${t}-${e}`))
 	});
 }
-function to() {
+function no() {
 	return /* @__PURE__ */ m("div", {
 		className: "game-ui-icon-grid",
 		children: Ir.map((e) => /* @__PURE__ */ h("figure", {
@@ -8350,7 +8491,7 @@ function to() {
 		}, `sprite-${e}`))
 	});
 }
-function no() {
+function ro() {
 	let { gallery: e } = Da();
 	return /* @__PURE__ */ h("div", {
 		className: "game-ui-icon-gallery",
@@ -8366,8 +8507,8 @@ function no() {
 						className: "game-ui-small-copy",
 						children: e.gameHint
 					})]
-				}), /* @__PURE__ */ m(eo, {
-					names: Qa,
+				}), /* @__PURE__ */ m(to, {
+					names: $a,
 					style: "game"
 				})]
 			}),
@@ -8379,8 +8520,8 @@ function no() {
 						className: "game-ui-small-copy",
 						children: e.lineHint
 					})]
-				}), /* @__PURE__ */ m(eo, {
-					names: $a,
+				}), /* @__PURE__ */ m(to, {
+					names: eo,
 					style: "line"
 				})]
 			}),
@@ -8395,12 +8536,12 @@ function no() {
 						className: "game-ui-small-copy",
 						children: e.spriteHint
 					})]
-				}), /* @__PURE__ */ m(to, {})]
+				}), /* @__PURE__ */ m(no, {})]
 			})
 		]
 	});
 }
-function ro({ title: e, body: t }) {
+function io({ title: e, body: t }) {
 	let [n, r] = d("en"), i = Ta[n], a = e && n === "en" ? e : i.heroTitle, s = t && n === "en" ? t : i.heroBody;
 	return o(() => (document.documentElement.dataset.gameUiPreview = "clay", () => {
 		delete document.documentElement.dataset.gameUiPreview;
@@ -8467,7 +8608,7 @@ function ro({ title: e, body: t }) {
 							className: "game-ui-small-copy",
 							children: i.iconsIntro
 						}),
-						/* @__PURE__ */ m(no, {})
+						/* @__PURE__ */ m(ro, {})
 					]
 				}),
 				/* @__PURE__ */ h("section", {
@@ -8488,8 +8629,8 @@ function ro({ title: e, body: t }) {
 						}),
 						/* @__PURE__ */ m(Ma, {}),
 						/* @__PURE__ */ m(Na, {}),
-						/* @__PURE__ */ m(Ia, {}),
 						/* @__PURE__ */ m(La, {}),
+						/* @__PURE__ */ m(Ra, {}),
 						/* @__PURE__ */ m(gr, {
 							entries: i.history,
 							label: i.historyLabel
@@ -8502,7 +8643,7 @@ function ro({ title: e, body: t }) {
 					children: [/* @__PURE__ */ m("h2", {
 						id: "game-ui-preview-forms-title",
 						children: i.sections.forms
-					}), /* @__PURE__ */ m(Za, {})]
+					}), /* @__PURE__ */ m(Qa, {})]
 				}),
 				/* @__PURE__ */ h("section", {
 					"aria-labelledby": "game-ui-preview-overlay-glass-title",
@@ -8519,6 +8660,21 @@ function ro({ title: e, body: t }) {
 						/* @__PURE__ */ m(Pa, {})
 					]
 				}),
+				/* @__PURE__ */ h("section", {
+					"aria-labelledby": "game-ui-preview-liquid-title",
+					className: "game-ui-preview-section",
+					children: [
+						/* @__PURE__ */ m("h2", {
+							id: "game-ui-preview-liquid-title",
+							children: i.sections.liquid
+						}),
+						/* @__PURE__ */ m("p", {
+							className: "game-ui-small-copy",
+							children: i.liquid.body
+						}),
+						/* @__PURE__ */ m(Fa, {})
+					]
+				}),
 				/* @__PURE__ */ h("section", {
 					"aria-labelledby": "game-ui-preview-liquid-metal-title",
 					className: "game-ui-preview-section",
@@ -8531,7 +8687,7 @@ function ro({ title: e, body: t }) {
 							className: "game-ui-small-copy",
 							children: i.liquidMetal.body
 						}),
-						/* @__PURE__ */ m(Fa, {})
+						/* @__PURE__ */ m(Ia, {})
 					]
 				}),
 				/* @__PURE__ */ h("section", {
@@ -8540,7 +8696,7 @@ function ro({ title: e, body: t }) {
 					children: [/* @__PURE__ */ m("h2", {
 						id: "game-ui-preview-ownmyspace-title",
 						children: "OwnMySpace game surface pack"
-					}), /* @__PURE__ */ m(Ka, {})]
+					}), /* @__PURE__ */ m(qa, {})]
 				}),
 				/* @__PURE__ */ h("section", {
 					"aria-labelledby": "game-ui-preview-terrain-build-title",
@@ -8554,7 +8710,7 @@ function ro({ title: e, body: t }) {
 							className: "game-ui-small-copy",
 							children: "Official terrain controls cover mode, brush, material, undo/redo, build library, status, progress, and compact mobile drawer surfaces."
 						}),
-						/* @__PURE__ */ m(Ha, {})
+						/* @__PURE__ */ m(Ua, {})
 					]
 				}),
 				/* @__PURE__ */ h("section", {
@@ -8569,7 +8725,7 @@ function ro({ title: e, body: t }) {
 							className: "game-ui-small-copy",
 							children: "Official construction surfaces cover job queue states, before/after review, robot crew status, validation warnings, approval actions, and local-only provider badges."
 						}),
-						/* @__PURE__ */ m(Ga, {})
+						/* @__PURE__ */ m(Ka, {})
 					]
 				}),
 				/* @__PURE__ */ h("section", {
@@ -8584,7 +8740,7 @@ function ro({ title: e, body: t }) {
 							className: "game-ui-small-copy",
 							children: "Official asset cards must stay visually complete when a game shell uses dense, narrow, or rail-style inventory slots."
 						}),
-						/* @__PURE__ */ m(Ja, {})
+						/* @__PURE__ */ m(Ya, {})
 					]
 				}),
 				/* @__PURE__ */ h("section", {
@@ -8593,7 +8749,7 @@ function ro({ title: e, body: t }) {
 					children: [/* @__PURE__ */ m("h2", {
 						id: "game-ui-preview-first-session-title",
 						children: i.sections.firstSession
-					}), /* @__PURE__ */ m(Ya, {})]
+					}), /* @__PURE__ */ m(Xa, {})]
 				}),
 				/* @__PURE__ */ h("section", {
 					"aria-labelledby": "game-ui-preview-orientation-title",
@@ -8616,11 +8772,11 @@ function ro({ title: e, body: t }) {
 					children: [/* @__PURE__ */ m("h2", {
 						id: "game-ui-preview-responsive-title",
 						children: i.sections.responsive
-					}), /* @__PURE__ */ m(Xa, {})]
+					}), /* @__PURE__ */ m(Za, {})]
 				})
 			]
 		})
 	});
 }
 //#endregion
-export { Lr as CLAY_ASSETS, Or as CLAY_ASSET_BASE_PATH, te as CLAY_ASSET_SIZE_TOKENS, w as CLAY_COLOR_TOKENS, M as CLAY_ELEVATION_TOKENS, Fr as CLAY_GAME_SPRITES, Ir as CLAY_GAME_SPRITE_NAMES, Ar as CLAY_ICON_NAMES, kr as CLAY_ICON_VARIANTS, P as CLAY_LAYER_TOKENS, E as CLAY_LIQUID_GOOEY_TOKENS, E as GAME_UI_LIQUID_GOOEY_TOKENS, T as CLAY_LIQUID_METAL_TOKENS, T as GAME_UI_LIQUID_METAL_TOKENS, N as CLAY_MOTION_TOKENS, D as CLAY_OVERLAY_GLASS_TOKENS, D as GAME_UI_OVERLAY_GLASS_TOKENS, ee as CLAY_RADIUS_TOKENS, j as CLAY_SCROLLBAR_TOKENS, O as CLAY_SEMANTIC_TOKENS, A as CLAY_SPACE_TOKENS, F as CLAY_TARGET_TOKENS, k as CLAY_TYPE_TOKENS, ne as CLAY_UI_TOKENS, re as DEFAULT_LIQUID_GOOEY_ANIMATION_BUDGET, ie as DEFAULT_LIQUID_GOOEY_FILTER_AREA_BUDGET, Bn as DEFAULT_LIQUID_METAL_CONTEXT_BUDGET, K as DISSOLVE_DEFAULTS, oi as FirstSessionHud, si as FirstSessionOnboarding, Sa as GAME_UI_OVERLAY, ba as GAME_UI_PREVIEW_MESSAGES, Ca as GAME_UI_TARGETS, wa as GAME_UI_THEME_CONTRACT, xa as GAME_UI_TOKENS, bi as GameActionGrid, Di as GameAssetCard, $ as GameAssetIcon, Oi as GameAssetLibrary, pi as GameAvatar, Q as GameBadge, la as GameBeforeAfterToggle, zi as GameBrushControls, Hi as GameBuildLibrary, J as GameButton, mr as GameCallout, Qr as GameCardFan, di as GameCheckbox, ha as GameCollapsiblePanel, Ui as GameCompactGameDrawer, da as GameCompactJobDrawer, sa as GameConstructionApprovalBar, ua as GameConstructionJobCard, oa as GameConstructionProgress, fa as GameContractorPanel, hr as GameDialog, hi as GameEmptyState, vi as GameFactList, ui as GameField, gr as GameHistoryPanel, Zr as GameHud, _r as GameHudActions, vr as GameIconButton, ci as GameInput, ni as GameLanguageMenu, ri as GameLoadingState, Bi as GameMaterialSwatches, ya as GameModal, Ci as GameMovementPad, Ai as GameObjectToolbar, ti as GameOrientationGate, X as GamePanel, ki as GamePlacementToolbar, mi as GameProgress, Dr as GamePrompt, Tr as GameRadialMenu, ca as GameRobotCrewStatus, _i as GameSceneHudLayout, Sr as GameSegmentedControl, gi as GameShell, Cr as GameSlider, $r as GameStageTile, yi as GameStatList, br as GameTabs, Ki as GameTerrainBuildToolbox, Li as GameTerrainModeControl, Ri as GameTerrainToolStrip, li as GameTextArea, Er as GameToast, wr as GameToggle, yr as GameTooltip, ro as GameUiPreview, Vi as GameUndoRedoActions, va as GameWindowPanel, Vt as IMAGE_MELT_DEFAULTS, Mn as LIQUID_FORMS, Nn as LIQUID_FORM_NAMES, ye as LIQUID_GOOEY_WAVINESS_MAX_FRACTION, jn as LiquidGroup, An as LiquidItem, pr as LiquidMetalButton, Rn as LiquidSurface, Jr as acknowledgeClayPlaceholders, Gr as getClayAssetBasePath, Ur as getClayAssetMode, ii as getClayCatalogPaths, Yr as getClayIconPath, Pr as getClayIconStyles, Xr as getClaySourceAssetPath, se as getLiquidGooeyBudget, Un as getLiquidMetalContextBudget, Pn as liquidFormGroup, Fn as liquidFormItem, zn as liquidFormSummary, C as playGameInteractionSound, S as playGameInteractionSoundForContext, Kt as resolveDissolveOptions, Wr as setClayAssetBasePath, Hr as setClayAssetMode, R as setLiquidGooeyBudget, Wn as setLiquidMetalContextBudget };
+export { Lr as CLAY_ASSETS, Or as CLAY_ASSET_BASE_PATH, I as CLAY_ASSET_SIZE_TOKENS, w as CLAY_COLOR_TOKENS, M as CLAY_ELEVATION_TOKENS, Fr as CLAY_GAME_SPRITES, Ir as CLAY_GAME_SPRITE_NAMES, Ar as CLAY_ICON_NAMES, kr as CLAY_ICON_VARIANTS, P as CLAY_LAYER_TOKENS, E as CLAY_LIQUID_GOOEY_TOKENS, E as GAME_UI_LIQUID_GOOEY_TOKENS, T as CLAY_LIQUID_METAL_TOKENS, T as GAME_UI_LIQUID_METAL_TOKENS, N as CLAY_MOTION_TOKENS, D as CLAY_OVERLAY_GLASS_TOKENS, D as GAME_UI_OVERLAY_GLASS_TOKENS, ee as CLAY_RADIUS_TOKENS, j as CLAY_SCROLLBAR_TOKENS, O as CLAY_SEMANTIC_TOKENS, A as CLAY_SPACE_TOKENS, F as CLAY_TARGET_TOKENS, k as CLAY_TYPE_TOKENS, te as CLAY_UI_TOKENS, ne as DEFAULT_LIQUID_GOOEY_ANIMATION_BUDGET, re as DEFAULT_LIQUID_GOOEY_FILTER_AREA_BUDGET, Bn as DEFAULT_LIQUID_METAL_CONTEXT_BUDGET, K as DISSOLVE_DEFAULTS, oi as FirstSessionHud, si as FirstSessionOnboarding, Sa as GAME_UI_OVERLAY, ba as GAME_UI_PREVIEW_MESSAGES, Ca as GAME_UI_TARGETS, wa as GAME_UI_THEME_CONTRACT, xa as GAME_UI_TOKENS, bi as GameActionGrid, Di as GameAssetCard, $ as GameAssetIcon, Oi as GameAssetLibrary, pi as GameAvatar, Q as GameBadge, la as GameBeforeAfterToggle, zi as GameBrushControls, Hi as GameBuildLibrary, J as GameButton, mr as GameCallout, Qr as GameCardFan, di as GameCheckbox, ha as GameCollapsiblePanel, Ui as GameCompactGameDrawer, da as GameCompactJobDrawer, sa as GameConstructionApprovalBar, ua as GameConstructionJobCard, oa as GameConstructionProgress, fa as GameContractorPanel, hr as GameDialog, hi as GameEmptyState, vi as GameFactList, ui as GameField, gr as GameHistoryPanel, Zr as GameHud, _r as GameHudActions, vr as GameIconButton, ci as GameInput, ni as GameLanguageMenu, ri as GameLoadingState, Bi as GameMaterialSwatches, ya as GameModal, Ci as GameMovementPad, Ai as GameObjectToolbar, ti as GameOrientationGate, X as GamePanel, ki as GamePlacementToolbar, mi as GameProgress, Dr as GamePrompt, Tr as GameRadialMenu, ca as GameRobotCrewStatus, _i as GameSceneHudLayout, Sr as GameSegmentedControl, gi as GameShell, Cr as GameSlider, $r as GameStageTile, yi as GameStatList, br as GameTabs, Ki as GameTerrainBuildToolbox, Li as GameTerrainModeControl, Ri as GameTerrainToolStrip, li as GameTextArea, Er as GameToast, wr as GameToggle, yr as GameTooltip, io as GameUiPreview, Vi as GameUndoRedoActions, va as GameWindowPanel, Vt as IMAGE_MELT_DEFAULTS, Mn as LIQUID_FORMS, Nn as LIQUID_FORM_NAMES, ye as LIQUID_GOOEY_WAVINESS_MAX_FRACTION, jn as LiquidGroup, An as LiquidItem, pr as LiquidMetalButton, Rn as LiquidSurface, Jr as acknowledgeClayPlaceholders, Gr as getClayAssetBasePath, Ur as getClayAssetMode, ii as getClayCatalogPaths, Yr as getClayIconPath, Pr as getClayIconStyles, Xr as getClaySourceAssetPath, ae as getLiquidGooeyBudget, Un as getLiquidMetalContextBudget, Pn as liquidFormGroup, Fn as liquidFormItem, zn as liquidFormSummary, C as playGameInteractionSound, S as playGameInteractionSoundForContext, Kt as resolveDissolveOptions, Wr as setClayAssetBasePath, Hr as setClayAssetMode, B as setLiquidGooeyBudget, Wn as setLiquidMetalContextBudget };