@mkbabb/glass-ui 5.0.0 → 6.0.0

package/dist/liquid-grid.js

@@ -1,32 +1,32 @@
 import { t as e } from "./_plugin-vue_export-helper-C1je1s0u.js";
-import { t } from "./usePointerVelocityField-CwXyeW0Z.js";
-import { n, o as r } from "./procedural-color.wgsl-ByduxnzV.js";
-import { t as i } from "./flow.glsl-CVqPSj8_.js";
-import { a, t as o } from "./useGpuSubstrate-DcY584kE.js";
-import { c as s, t as c } from "./color-Bp5jmv4Z.js";
-import { computed as l, createElementBlock as u, createElementVNode as d, defineComponent as f, normalizeStyle as p, onMounted as m, onScopeDispose as h, openBlock as g, reactive as _, useTemplateRef as v, watch as y } from "vue";
+import { t } from "./usePointerVelocityField-BdvnO0py.js";
+import { cssToOklch as n, oklchToLinear as r } from "./color.js";
+import { a as i, d as a, l as o, n as s } from "./procedural-color.wgsl-B9mLK7v0.js";
+import { t as c } from "./flow.glsl-DEGFGE11.js";
+import { a as l } from "./rendererStatus-C2-zC2Q-.js";
+import { computed as u, createElementBlock as d, createElementVNode as f, defineComponent as p, normalizeStyle as m, onMounted as h, onScopeDispose as g, openBlock as _, reactive as v, readonly as y, shallowRef as b, useTemplateRef as x, watch as S } from "vue";
 //#region src/composables/glass/wave/waveField.ts
-var b = Math.PI * 2;
-function x(e, t, n, r, i, a) {
-	let o = ((e.x * n.x + e.y * n.y) * r - t * i) / b;
+var C = Math.PI * 2;
+function w(e, t, n, r, i, a) {
+	let o = ((e.x * n.x + e.y * n.y) * r - t * i) / C;
 	o -= Math.floor(o);
 	let s = (o - .5) * 2;
 	return Math.exp(-(s * s) / Math.max(a, .001));
 }
-function S(e, t, n, r, i, a, o) {
-	return x(e, t, n, r, i, a) * o;
+function T(e, t, n, r, i, a, o) {
+	return w(e, t, n, r, i, a) * o;
 }
-function C(e, t, n, r, i, a, o, s) {
-	let c = Math.max(t, .001) * .5, l = S({
+function E(e, t, n, r, i, a, o, s) {
+	let c = Math.max(t, .001) * .5, l = T({
 		x: e.x + c,
 		y: e.y
-	}, n, r, i, a, o, s), u = S({
+	}, n, r, i, a, o, s), u = T({
 		x: e.x - c,
 		y: e.y
-	}, n, r, i, a, o, s), d = S({
+	}, n, r, i, a, o, s), d = T({
 		x: e.x,
 		y: e.y + c
-	}, n, r, i, a, o, s), f = S({
+	}, n, r, i, a, o, s), f = T({
 		x: e.x,
 		y: e.y - c
 	}, n, r, i, a, o, s);
@@ -35,23 +35,23 @@ function C(e, t, n, r, i, a, o, s) {
 		y: (d - f) / (2 * c)
 	};
 }
-function w(e, t, n) {
+function D(e, t, n) {
 	let r = 1 - Math.abs((e.x - Math.floor(e.x)) * 2 - 1), i = 1 - Math.abs((e.y - Math.floor(e.y)) * 2 - 1), a = Math.min(r, i), o = Math.max(n.x, n.y) * 1.5, s = t, c = t + 2 * o, l = Math.max(c - s, 1e-6), u = Math.min(Math.max((a - s) / l, 0), 1);
 	return u * u * (3 - 2 * u);
 }
-function T(e, t, n, r) {
+function O(e, t, n, r) {
 	let i = e.x - t.x, a = e.y - t.y, o = i * i + a * a, s = Math.max(r, 1e-4), c = n * Math.exp(-o / (2 * s * s)), l = Math.cos(c), u = Math.sin(c);
 	return {
 		x: t.x + (l * i - u * a),
 		y: t.y + (u * i + l * a)
 	};
 }
-var E = 1.833333;
-function D(e, t, n, r, i, a, o, s, c, l = .6) {
-	let u = x(t, n, r, i, a, o) * c, d = e({
+var k = 1.833333;
+function A(e, t, n, r, i, a, o, s, c, l = .6) {
+	let u = w(t, n, r, i, a, o) * c, d = e({
 		x: t.x * l + n * .05,
 		y: t.y * l - n * .04
-	}), f = l * E, p = e({
+	}), f = l * k, p = e({
 		x: t.x * f - n * .03,
 		y: t.y * f + n * .035
 	}), m = s * u;
@@ -63,8 +63,8 @@ function D(e, t, n, r, i, a, o, s, c, l = .6) {
 //#endregion
 //#region src/components/liquid-grid/composables/liquidGrid.ts
 Math.PI * 2;
-var O = .012, k = .03;
-function A(e, t) {
+var j = .012, M = .03;
+function N(e, t) {
 	let n = e * .1031 % 1, r = t * .1031 % 1, i = e * .1031 % 1;
 	n < 0 && (n += 1), r < 0 && (r += 1), i < 0 && (i += 1);
 	let a = n * (r + 33.33) + r * (i + 33.33) + i * (n + 33.33);
@@ -72,90 +72,90 @@ function A(e, t) {
 	let o = (n + r) * i % 1;
 	return o < 0 && (o += 1), o;
 }
-function j(e, t, n) {
+function P(e, t, n) {
 	return e + (t - e) * n;
 }
-function M(e, t) {
-	let n = Math.floor(e), r = Math.floor(t), i = e - n, a = t - r, o = i * i * i * (i * (i * 6 - 15) + 10), s = a * a * a * (a * (a * 6 - 15) + 10), c = A(n, r), l = A(n + 1, r), u = A(n, r + 1), d = A(n + 1, r + 1);
-	return j(j(c, l, o), j(u, d, o), s);
+function F(e, t) {
+	let n = Math.floor(e), r = Math.floor(t), i = e - n, a = t - r, o = i * i * i * (i * (i * 6 - 15) + 10), s = a * a * a * (a * (a * 6 - 15) + 10), c = N(n, r), l = N(n + 1, r), u = N(n, r + 1), d = N(n + 1, r + 1);
+	return P(P(c, l, o), P(u, d, o), s);
 }
-function N(e) {
+function I(e) {
 	let t = 0, n = .5, r = 1, i = e.x, a = e.y;
 	for (let e = 0; e < 3; e++) {
-		t += n * M(i * r, a * r);
+		t += n * F(i * r, a * r);
 		let e = .8 * i - .6 * a, o = .6 * i + .8 * a;
 		i = e, a = o, r *= 2, n *= .5;
 	}
 	return t;
 }
-function P(e) {
-	let t = N({
-		x: e.x + O,
+function L(e) {
+	let t = I({
+		x: e.x + j,
 		y: e.y
-	}) - N({
-		x: e.x - O,
+	}) - I({
+		x: e.x - j,
 		y: e.y
-	}), n = N({
+	}), n = I({
 		x: e.x,
-		y: e.y + O
-	}) - N({
+		y: e.y + j
+	}) - I({
 		x: e.x,
-		y: e.y - O
-	}), r = t / (2 * O);
+		y: e.y - j
+	}), r = t / (2 * j);
 	return {
-		x: n / (2 * O),
+		x: n / (2 * j),
 		y: -r
 	};
 }
-function F(e, t, n) {
+function R(e, t, n) {
 	let r = t - e, i = Math.abs(r) < 1e-9 ? r < 0 ? -1e-9 : 1e-9 : r, a = Math.min(Math.max((n - e) / i, 0), 1);
 	return a * a * (3 - 2 * a);
 }
-function I(e, t, n) {
+function z(e, t, n) {
 	return Math.min(Math.max(e, t), n);
 }
-function L(e, t, n) {
-	let r = 1 - Math.abs((e.x - Math.floor(e.x)) * 2 - 1), i = 1 - Math.abs((e.y - Math.floor(e.y)) * 2 - 1), a = I(t, n.x, .5), o = I(t, n.y, .5), s = n.x * 1.5, c = n.y * 1.5, l = F(a + s, a - s, r), u = F(o + c, o - c, i);
-	return l *= I(t / Math.max(a, 1e-6), 0, 1), u *= I(t / Math.max(o, 1e-6), 0, 1), l = j(l, t, I(n.x * 2 - 1, 0, 1)), u = j(u, t, I(n.y * 2 - 1, 0, 1)), Math.max(l, u);
+function B(e, t, n) {
+	let r = 1 - Math.abs((e.x - Math.floor(e.x)) * 2 - 1), i = 1 - Math.abs((e.y - Math.floor(e.y)) * 2 - 1), a = z(t, n.x, .5), o = z(t, n.y, .5), s = n.x * 1.5, c = n.y * 1.5, l = R(a + s, a - s, r), u = R(o + c, o - c, i);
+	return l *= z(t / Math.max(a, 1e-6), 0, 1), u *= z(t / Math.max(o, 1e-6), 0, 1), l = P(l, t, z(n.x * 2 - 1, 0, 1)), u = P(u, t, z(n.y * 2 - 1, 0, 1)), Math.max(l, u);
 }
-function R(e, t, n) {
-	let r = D(P, {
+function ee(e, t, n) {
+	let r = A(L, {
 		x: e.x * n.gridScale,
 		y: e.y * n.gridScale
-	}, t, n.waveDir, n.waveK, n.waveOmega, n.waveSigma, n.twistMax, n.amp, k);
-	n.interactive > .5 && (r = T(r, n.cursor, n.bulgeStrength * n.bulgeMode, n.bulgeRadius));
-	let i = L(r, n.targetWidth, n.uvDeriv), a = Math.max(n.majorEvery, 1), o = {
+	}, t, n.waveDir, n.waveK, n.waveOmega, n.waveSigma, n.twistMax, n.amp, M);
+	n.interactive > .5 && (r = O(r, n.cursor, n.bulgeStrength * n.bulgeMode, n.bulgeRadius));
+	let i = B(r, n.targetWidth, n.uvDeriv), a = Math.max(n.majorEvery, 1), o = {
 		x: r.x / a,
 		y: r.y / a
 	}, s = {
 		x: n.uvDeriv.x / a,
 		y: n.uvDeriv.y / a
-	}, c = L(o, n.targetWidthMajor, s), l = Math.max(i * n.minorAlpha, c * n.majorAlpha), u = n.faceAlpha ?? 0, d = n.faceReliefGain ?? 0, f = n.squashK ?? 0, p = n.baseInset ?? 0, m = n.lightDir ?? {
+	}, c = B(o, n.targetWidthMajor, s), l = Math.max(i * n.minorAlpha, c * n.majorAlpha), u = n.faceAlpha ?? 0, d = n.faceReliefGain ?? 0, f = n.squashK ?? 0, p = n.baseInset ?? 0, m = n.lightDir ?? {
 		x: .6,
 		y: .8
 	}, h = {
 		x: Math.floor(r.x) + .5,
 		y: Math.floor(r.y) + .5
-	}, g = S(h, t, n.waveDir, n.waveK, n.waveOmega, n.waveSigma, n.amp), _ = C(h, 1, t, n.waveDir, n.waveK, n.waveOmega, n.waveSigma, n.amp), v = -_.x * d, y = -_.y * d, b = Math.hypot(v, y, 1), x = Math.hypot(m.x, m.y) || 1, E = I(.5 + (v * m.x + y * m.y) / (b * x) * .5, 0, 1), O = p * (1 - f * g), A = w(r, O, n.uvDeriv), j = A * u * n.fieldAlpha, M = I(E * .5 + g * .5, 0, 1);
+	}, g = T(h, t, n.waveDir, n.waveK, n.waveOmega, n.waveSigma, n.amp), _ = E(h, 1, t, n.waveDir, n.waveK, n.waveOmega, n.waveSigma, n.amp), v = -_.x * d, y = -_.y * d, b = Math.hypot(v, y, 1), x = Math.hypot(m.x, m.y) || 1, S = z(.5 + (v * m.x + y * m.y) / (b * x) * .5, 0, 1), C = p * (1 - f * g), w = D(r, C, n.uvDeriv), k = w * u * n.fieldAlpha, j = z(S * .5 + g * .5, 0, 1);
 	return {
 		line: l,
 		alpha: l * n.fieldAlpha,
 		face: {
 			env: g,
 			h: g,
-			shade: E,
-			faceCov: A,
-			faceA: j,
-			rampT: M
+			shade: S,
+			faceCov: w,
+			faceA: k,
+			rampT: j
 		}
 	};
 }
-function z(e, t) {
+function V(e, t) {
 	return e / Math.max(t, 1);
 }
 //#endregion
 //#region src/components/liquid-grid/shaders/liquid-grid.wgsl.ts
-var B = `
+var H = `
 const TAU: f32 = 6.283185307179586;
 
 // ── Paper-grid uniforms (the typed-struct source-of-truth — see uniformBridgeWGPU.ts) ──
@@ -192,7 +192,7 @@ struct LiquidGridUniforms {
 
 @group(0) @binding(0) var<uniform> u: LiquidGridUniforms;
 
-${n}
+${s}
 
 // ── The host noise basis (transcribes liquidGrid.ts hash21/valueNoise/potentialFBM) ──
 // A quintic-faded 2D value-noise fbm potential — the SAME basis the dot-flow-field carries
@@ -528,7 +528,7 @@ fn fs_main(in: VSOut) -> @location(0) vec4f {
   let a = lineA + faceA * (1.0 - lineA);
   return vec4f(outPremult, a);                           // premultiplied over transparent
 }
-`, V = {
+`, U = {
 	u0: 0,
 	face: 4,
 	warp2: 8,
@@ -544,48 +544,48 @@ fn fs_main(in: VSOut) -> @location(0) vec4f {
 	faceMid: 48,
 	faceHi: 52
 };
-function H() {
+function W() {
 	let e = /* @__PURE__ */ new ArrayBuffer(224);
 	return {
 		buffer: e,
 		f32: new Float32Array(e)
 	};
 }
-function U(e, t, n, r, i, a, o) {
-	let { f32: c } = e, l = z(i, t.cellSize);
-	c[V.u0 + 0] = n, c[V.u0 + 1] = l, c[V.u0 + 2] = t.cellSize, c[V.u0 + 3] = t.majorEvery, c[V.face + 0] = t.faceAlpha, c[V.face + 1] = t.faceRelief, c[V.face + 2] = t.squashK, c[V.face + 3] = t.baseInset, c[V.warp2 + 0] = 0, c[V.warp2 + 1] = r, c[V.warp2 + 2] = t.lightDir[0], c[V.warp2 + 3] = t.lightDir[1];
+function G(e, t, n, i, a, o, s) {
+	let { f32: c } = e, l = V(a, t.cellSize);
+	c[U.u0 + 0] = n, c[U.u0 + 1] = l, c[U.u0 + 2] = t.cellSize, c[U.u0 + 3] = t.majorEvery, c[U.face + 0] = t.faceAlpha, c[U.face + 1] = t.faceRelief, c[U.face + 2] = t.squashK, c[U.face + 3] = t.baseInset, c[U.warp2 + 0] = 0, c[U.warp2 + 1] = i, c[U.warp2 + 2] = t.lightDir[0], c[U.warp2 + 3] = t.lightDir[1];
 	let u = Math.max(t.cellSize, 1), d = t.lineWidth / u, f = t.lineWidth * 1.6 / u;
-	c[V.grid + 0] = d, c[V.grid + 1] = f, c[V.grid + 2] = t.minorAlpha, c[V.grid + 3] = t.majorAlpha;
+	c[U.grid + 0] = d, c[U.grid + 1] = f, c[U.grid + 2] = t.minorAlpha, c[U.grid + 3] = t.majorAlpha;
 	let p = t.background === "transparent" ? 0 : 1;
-	c[V.field + 0] = t.fieldAlpha, c[V.field + 1] = p, c[V.field + 2] = 0, c[V.field + 3] = 0, c[V.cursor + 0] = a.x, c[V.cursor + 1] = a.y, c[V.cursor + 2] = t.bulgeStrength, c[V.cursor + 3] = t.bulgeRadius, c[V.cursor2 + 0] = t.bulgeMode === "attract" ? -1 : 1, c[V.cursor2 + 1] = +!!t.interactive, c[V.cursor2 + 2] = 0, c[V.cursor2 + 3] = 0;
-	let m = s(t.lineColor);
-	if (c[V.line + 0] = m[0], c[V.line + 1] = m[1], c[V.line + 2] = m[2], c[V.line + 3] = 0, t.background === "transparent") c[V.bg + 0] = 0, c[V.bg + 1] = 0, c[V.bg + 2] = 0, c[V.bg + 3] = 0;
+	c[U.field + 0] = t.fieldAlpha, c[U.field + 1] = p, c[U.field + 2] = 0, c[U.field + 3] = 0, c[U.cursor + 0] = o.x, c[U.cursor + 1] = o.y, c[U.cursor + 2] = t.bulgeStrength, c[U.cursor + 3] = t.bulgeRadius, c[U.cursor2 + 0] = t.bulgeMode === "attract" ? -1 : 1, c[U.cursor2 + 1] = +!!t.interactive, c[U.cursor2 + 2] = 0, c[U.cursor2 + 3] = 0;
+	let m = r(t.lineColor);
+	if (c[U.line + 0] = m[0], c[U.line + 1] = m[1], c[U.line + 2] = m[2], c[U.line + 3] = 0, t.background === "transparent") c[U.bg + 0] = 0, c[U.bg + 1] = 0, c[U.bg + 2] = 0, c[U.bg + 3] = 0;
 	else {
-		let e = s(t.background);
-		c[V.bg + 0] = e[0], c[V.bg + 1] = e[1], c[V.bg + 2] = e[2], c[V.bg + 3] = 0;
+		let e = r(t.background);
+		c[U.bg + 0] = e[0], c[U.bg + 1] = e[1], c[U.bg + 2] = e[2], c[U.bg + 3] = 0;
 	}
-	c[V.wave + 0] = t.waveDir[0], c[V.wave + 1] = t.waveDir[1], c[V.wave + 2] = t.waveK, c[V.wave + 3] = t.waveOmega, c[V.wave2 + 0] = t.waveSigma, c[V.wave2 + 1] = t.twistMax, c[V.wave2 + 2] = 0, c[V.wave2 + 3] = o;
-	let h = s(t.faceWarmLo), g = s(t.faceWarmMid), _ = s(t.faceWarmHi);
-	return c[V.faceLo + 0] = h[0], c[V.faceLo + 1] = h[1], c[V.faceLo + 2] = h[2], c[V.faceLo + 3] = 0, c[V.faceMid + 0] = g[0], c[V.faceMid + 1] = g[1], c[V.faceMid + 2] = g[2], c[V.faceMid + 3] = 0, c[V.faceHi + 0] = _[0], c[V.faceHi + 1] = _[1], c[V.faceHi + 2] = _[2], c[V.faceHi + 3] = 0, e;
+	c[U.wave + 0] = t.waveDir[0], c[U.wave + 1] = t.waveDir[1], c[U.wave + 2] = t.waveK, c[U.wave + 3] = t.waveOmega, c[U.wave2 + 0] = t.waveSigma, c[U.wave2 + 1] = t.twistMax, c[U.wave2 + 2] = 0, c[U.wave2 + 3] = s;
+	let h = r(t.faceWarmLo), g = r(t.faceWarmMid), _ = r(t.faceWarmHi);
+	return c[U.faceLo + 0] = h[0], c[U.faceLo + 1] = h[1], c[U.faceLo + 2] = h[2], c[U.faceLo + 3] = 0, c[U.faceMid + 0] = g[0], c[U.faceMid + 1] = g[1], c[U.faceMid + 2] = g[2], c[U.faceMid + 3] = 0, c[U.faceHi + 0] = _[0], c[U.faceHi + 1] = _[1], c[U.faceHi + 2] = _[2], c[U.faceHi + 3] = 0, e;
 }
 //#endregion
 //#region src/components/liquid-grid/composables/liquidGridWGPUSetup.ts
-var W = 64, G = 8, K = 2;
-function ee(e) {
+var K = 64, te = 8, ne = 2;
+function re(e) {
 	let { canvas: t, config: n, getCursor: r, getAmp: i, shouldContinue: a, onFrame: o } = e;
 	return function(e, s, c) {
 		let l = e.createShaderModule({
 			label: "[LiquidGrid] liquid-grid.wgsl",
-			code: B
-		}), u = H(), d = e.createBuffer({
+			code: H
+		}), u = W(), d = e.createBuffer({
 			label: "[LiquidGrid] uniforms",
 			size: u.buffer.byteLength,
-			usage: W | G
+			usage: K | te
 		}), f = e.createBindGroupLayout({
 			label: "[LiquidGrid] bgl",
 			entries: [{
 				binding: 0,
-				visibility: K,
+				visibility: ne,
 				buffer: { type: "uniform" }
 			}]
 		}), p = e.createRenderPipeline({
@@ -625,7 +625,7 @@ function ee(e) {
 		});
 		function h(e) {}
 		function g(a) {
-			o?.(a), U(u, n, a, t.width / Math.max(t.height, 1), t.height || 1, r(), i()), e.queue.writeBuffer(d, 0, u.buffer);
+			o?.(a), G(u, n, a, t.width / Math.max(t.height, 1), t.height || 1, r(), i()), e.queue.writeBuffer(d, 0, u.buffer);
 			let c = e.createCommandEncoder({ label: "[LiquidGrid] frame" }), l = s.getCurrentTexture().createView(), f = c.beginRenderPass({ colorAttachments: [{
 				view: l,
 				clearValue: {
@@ -651,7 +651,7 @@ function ee(e) {
 }
 //#endregion
 //#region src/composables/glass/wave/waveField.glsl.ts
-var te = "\n#ifndef WAVE_FIELD_TAU\n#define WAVE_FIELD_TAU 6.283185307179586\n#endif\n\n// The traveling-wave envelope — a moving Gaussian crest band sweeping along waveDir.\nfloat travelingEnvelope(vec2 pivot, float t, vec2 waveDir, float waveK, float waveOmega, float waveSigma) {\n  float coord = dot(pivot, waveDir) * waveK - t * waveOmega;\n  float crest = fract(coord / WAVE_FIELD_TAU);\n  float z = (crest - 0.5) * 2.0;\n  return exp(-(z * z) / max(waveSigma, 1e-3));\n}\n\n// The curl-direction scalar — the smooth low-freq director the per-cell twist follows.\nfloat curlScalar(vec2 cc, float t) {\n  vec2 f = curlFBM(vec2(cc.x * 0.5 + t * 0.08, cc.y * 0.5 - t * 0.06));\n  return clamp(f.x, -1.0, 1.0);\n}\n\n// The directed-twist FLOOR (the visibility cure): keep the curl SIGN (adjacent cells lean\n// together) but floor the magnitude so a crest-band cell ALWAYS rotates decisively.\n#ifndef WAVE_FIELD_TWIST_FLOOR\n#define WAVE_FIELD_TWIST_FLOOR 0.62\n#endif\nfloat directedTwist(float s, float floorMag) {\n  float mag = max(floorMag, abs(s));\n  float sgn = tanh(s * 6.0);\n  return sgn * mag;\n}\n\n// ── The FACE leaf (the structurally-absent RE-INVENT — height-lit filled cell interior) ──\n// Defined ABOVE cellTwist: cellTwist rides cellHeight via the driver so twist + face read ONE\n// envelope.\n\n// The sheet displacement at a cell center = the EXACT traveling-wave scalar the twist rides.\nfloat cellHeight(vec2 cc, float t, vec2 waveDir, float waveK, float waveOmega, float waveSigma, float amp) {\n  return travelingEnvelope(cc, t, waveDir, waveK, waveOmega, waveSigma) * amp;\n}\n\n// The pre-twist driver (FOLD A): the cell pivot cc + the crest envelope env the twist AND the\n// face both ride. The face samples height/relief at THIS pre-twist cc (floor(twisted_g) at the\n// crest lights a NEIGHBOUR cell). cc in .xy, env in .z.\nvec3 cellDriver(vec2 g, float cellSize, float t, vec2 waveDir, float waveK, float waveOmega,\n                float waveSigma, float amp) {\n  float cs = max(cellSize, 1e-3);\n  vec2 cc = (floor(g / cs) + 0.5) * cs;\n  float env = cellHeight(cc, t, waveDir, waveK, waveOmega, waveSigma, amp);\n  return vec3(cc, env);\n}\n\n// The central-difference slope of cellHeight across a cell (eps = 0.5·cellSize) — derivative-\n// FREE (NO dFdx on the height) → Safari WebGL2-safe. Returns ∇H.\nvec2 faceRelief(vec2 cc, float cellSize, float t, vec2 waveDir, float waveK, float waveOmega,\n                float waveSigma, float amp) {\n  float eps = max(cellSize, 1e-3) * 0.5;\n  float hxp = cellHeight(cc + vec2(eps, 0.0), t, waveDir, waveK, waveOmega, waveSigma, amp);\n  float hxm = cellHeight(cc - vec2(eps, 0.0), t, waveDir, waveK, waveOmega, waveSigma, amp);\n  float hyp = cellHeight(cc + vec2(0.0, eps), t, waveDir, waveK, waveOmega, waveSigma, amp);\n  float hym = cellHeight(cc - vec2(0.0, eps), t, waveDir, waveK, waveOmega, waveSigma, amp);\n  return vec2((hxp - hxm) / (2.0 * eps), (hyp - hym) / (2.0 * eps));\n}\n\n// Soft inset-square coverage inside a (warped) cell — the filled FACE plateau. d is the distance\n// into the cell from the nearest gutter (the Golus triangle-wave); the inset retreats as it grows\n// (the squash). aa = the shader's fwidth(g) (JS passes a fixed uvDeriv).\nfloat facePlateau(vec2 g, float inset, vec2 uvDeriv) {\n  vec2 tri = 1.0 - abs(fract(g) * 2.0 - 1.0);\n  float d = min(tri.x, tri.y);\n  float aa = max(uvDeriv.x, uvDeriv.y) * 1.5;\n  return smoothstep(inset, inset + 2.0 * aa, d);\n}\n\n// The cell-local twist about each cell's own center, gated by the traveling wave + directed\n// by the curl flow. amp is the spring-eased envelope amplitude the JS host drives. FOLD C: the\n// TWIST_FLOOR is crest-gated by env so OFF-crest cells relax to flat calm paper (the traveling\n// read, not static foil).\nvec2 cellTwist(vec2 g, float cellSize, float t, vec2 waveDir, float waveK, float waveOmega,\n               float waveSigma, float twistMax, float shearMax, float amp) {\n  vec3 drv = cellDriver(g, cellSize, t, waveDir, waveK, waveOmega, waveSigma, amp);\n  vec2 cc = drv.xy;\n  float env = drv.z;\n  float floorMag = WAVE_FIELD_TWIST_FLOOR * env;   // FOLD C: crest-gated floor\n  float theta = twistMax * env * directedTwist(curlScalar(cc, t), floorMag);\n  float shear = shearMax * env * directedTwist(curlScalar(cc + vec2(17.3, 9.1), t), floorMag);\n  vec2 local = g - cc;\n  float ct = cos(theta);\n  float st = sin(theta);\n  vec2 rot = vec2(ct * local.x - st * local.y, st * local.x + ct * local.y);\n  rot.x += shear * rot.y;   // a small skew so the box MORPHS, not just rotates\n  return cc + rot;\n}\n\n// The CONTINUOUS traveling-wave FLOW warp — the SMOOTH twin of cellTwist (no per-cell seam;\n// for the level-set contours that shatter into a mesh under the cell discontinuity).\n// BG.W-GRID-AFFINE — warpFreq is the HOST-supplied curl-sampling spatial frequency (the caller's\n// own coordinate units): an order of magnitude BELOW its grid frequency so the warp is locally\n// affine (major lines bow as ONE smooth curve, no sub-cell crackle). liquid-grid (cell-scale g0)\n// passes ~0.03; concentric (unit-scale p) passes 0.6. The 1.833333 second-flow ratio transcribes\n// WAVE_FLOW_SECOND_RATIO. Amplitude unchanged — curl magnitude is the intrinsic gradient at the\n// fixed CURL_EPS, independent of warpFreq; the t-drift is host-agnostic.\nvec2 waveFlow(vec2 g, float t, vec2 waveDir, float waveK, float waveOmega, float waveSigma,\n              float twistMax, float amp, float warpFreq) {\n  float env = travelingEnvelope(g, t, waveDir, waveK, waveOmega, waveSigma) * amp;\n  vec2 f = curlFBM(vec2(g.x * warpFreq + t * 0.05, g.y * warpFreq - t * 0.04));\n  float wf2 = warpFreq * 1.833333;\n  vec2 f2 = curlFBM(vec2(g.x * wf2 - t * 0.03, g.y * wf2 + t * 0.035));\n  float k = twistMax * env;\n  return g + (f + f2 * 0.5) * k;\n}\n\n// The local cursor swirl — the finger twists the cells around it (re-aimed cursorBulge).\nvec2 cursorSwirl(vec2 g, vec2 cursor, float strength, float radius) {\n  vec2 to = g - cursor;\n  float d2 = dot(to, to);\n  float r = max(radius, 1e-4);\n  float theta = strength * exp(-d2 / (2.0 * r * r));\n  float ct = cos(theta);\n  float st = sin(theta);\n  return cursor + vec2(ct * to.x - st * to.y, st * to.x + ct * to.y);\n}\n\n// The LOW-octave value-noise topography — the scalar field concentric extracts contours of.\nfloat heightField(vec2 p, float octavesF, float seed) {\n  float v = 0.0;\n  float amp = 0.5;\n  float freq = 1.0;\n  float px = p.x + seed;\n  float py = p.y - seed;\n  int n = int(clamp(octavesF, 1.0, 6.0));\n  for (int i = 0; i < 6; i++) {\n    if (i >= n) break;\n    v += amp * valueNoise(px * freq, py * freq);\n    float rx = 0.8 * px - 0.6 * py;\n    float ry = 0.6 * px + 0.8 * py;\n    px = rx;\n    py = ry;\n    freq *= 2.0;\n    amp *= 0.5;\n  }\n  return v;\n}\n\n// The ω=√(g·k) breathing swell — basins inflate/deflate with weight.\nfloat waveSwell(float t, float phase) {\n  return sin(t * 0.35 + phase) * 0.5 + sin(t * 0.21 + phase * 1.7) * 0.5;\n}\n", ne = "#version 300 es\nprecision highp float;\nin vec2 aPosition;\nout vec2 vUv;\nvoid main() {\n  vUv = aPosition;            // [-1,1]² domain\n  gl_Position = vec4(aPosition, 0.0, 1.0);\n}", re = `#version 300 es
+var ie = "\n#ifndef WAVE_FIELD_TAU\n#define WAVE_FIELD_TAU 6.283185307179586\n#endif\n\n// The traveling-wave envelope — a moving Gaussian crest band sweeping along waveDir.\nfloat travelingEnvelope(vec2 pivot, float t, vec2 waveDir, float waveK, float waveOmega, float waveSigma) {\n  float coord = dot(pivot, waveDir) * waveK - t * waveOmega;\n  float crest = fract(coord / WAVE_FIELD_TAU);\n  float z = (crest - 0.5) * 2.0;\n  return exp(-(z * z) / max(waveSigma, 1e-3));\n}\n\n// The curl-direction scalar — the smooth low-freq director the per-cell twist follows.\nfloat curlScalar(vec2 cc, float t) {\n  vec2 f = curlFBM(vec2(cc.x * 0.5 + t * 0.08, cc.y * 0.5 - t * 0.06));\n  return clamp(f.x, -1.0, 1.0);\n}\n\n// The directed-twist FLOOR (the visibility cure): keep the curl SIGN (adjacent cells lean\n// together) but floor the magnitude so a crest-band cell ALWAYS rotates decisively.\n#ifndef WAVE_FIELD_TWIST_FLOOR\n#define WAVE_FIELD_TWIST_FLOOR 0.62\n#endif\nfloat directedTwist(float s, float floorMag) {\n  float mag = max(floorMag, abs(s));\n  float sgn = tanh(s * 6.0);\n  return sgn * mag;\n}\n\n// ── The FACE leaf (the structurally-absent RE-INVENT — height-lit filled cell interior) ──\n// Defined ABOVE cellTwist: cellTwist rides cellHeight via the driver so twist + face read ONE\n// envelope.\n\n// The sheet displacement at a cell center = the EXACT traveling-wave scalar the twist rides.\nfloat cellHeight(vec2 cc, float t, vec2 waveDir, float waveK, float waveOmega, float waveSigma, float amp) {\n  return travelingEnvelope(cc, t, waveDir, waveK, waveOmega, waveSigma) * amp;\n}\n\n// The pre-twist driver (FOLD A): the cell pivot cc + the crest envelope env the twist AND the\n// face both ride. The face samples height/relief at THIS pre-twist cc (floor(twisted_g) at the\n// crest lights a NEIGHBOUR cell). cc in .xy, env in .z.\nvec3 cellDriver(vec2 g, float cellSize, float t, vec2 waveDir, float waveK, float waveOmega,\n                float waveSigma, float amp) {\n  float cs = max(cellSize, 1e-3);\n  vec2 cc = (floor(g / cs) + 0.5) * cs;\n  float env = cellHeight(cc, t, waveDir, waveK, waveOmega, waveSigma, amp);\n  return vec3(cc, env);\n}\n\n// The central-difference slope of cellHeight across a cell (eps = 0.5·cellSize) — derivative-\n// FREE (NO dFdx on the height) → Safari WebGL2-safe. Returns ∇H.\nvec2 faceRelief(vec2 cc, float cellSize, float t, vec2 waveDir, float waveK, float waveOmega,\n                float waveSigma, float amp) {\n  float eps = max(cellSize, 1e-3) * 0.5;\n  float hxp = cellHeight(cc + vec2(eps, 0.0), t, waveDir, waveK, waveOmega, waveSigma, amp);\n  float hxm = cellHeight(cc - vec2(eps, 0.0), t, waveDir, waveK, waveOmega, waveSigma, amp);\n  float hyp = cellHeight(cc + vec2(0.0, eps), t, waveDir, waveK, waveOmega, waveSigma, amp);\n  float hym = cellHeight(cc - vec2(0.0, eps), t, waveDir, waveK, waveOmega, waveSigma, amp);\n  return vec2((hxp - hxm) / (2.0 * eps), (hyp - hym) / (2.0 * eps));\n}\n\n// Soft inset-square coverage inside a (warped) cell — the filled FACE plateau. d is the distance\n// into the cell from the nearest gutter (the Golus triangle-wave); the inset retreats as it grows\n// (the squash). aa = the shader's fwidth(g) (JS passes a fixed uvDeriv).\nfloat facePlateau(vec2 g, float inset, vec2 uvDeriv) {\n  vec2 tri = 1.0 - abs(fract(g) * 2.0 - 1.0);\n  float d = min(tri.x, tri.y);\n  float aa = max(uvDeriv.x, uvDeriv.y) * 1.5;\n  return smoothstep(inset, inset + 2.0 * aa, d);\n}\n\n// The cell-local twist about each cell's own center, gated by the traveling wave + directed\n// by the curl flow. amp is the spring-eased envelope amplitude the JS host drives. FOLD C: the\n// TWIST_FLOOR is crest-gated by env so OFF-crest cells relax to flat calm paper (the traveling\n// read, not static foil).\nvec2 cellTwist(vec2 g, float cellSize, float t, vec2 waveDir, float waveK, float waveOmega,\n               float waveSigma, float twistMax, float shearMax, float amp) {\n  vec3 drv = cellDriver(g, cellSize, t, waveDir, waveK, waveOmega, waveSigma, amp);\n  vec2 cc = drv.xy;\n  float env = drv.z;\n  float floorMag = WAVE_FIELD_TWIST_FLOOR * env;   // FOLD C: crest-gated floor\n  float theta = twistMax * env * directedTwist(curlScalar(cc, t), floorMag);\n  float shear = shearMax * env * directedTwist(curlScalar(cc + vec2(17.3, 9.1), t), floorMag);\n  vec2 local = g - cc;\n  float ct = cos(theta);\n  float st = sin(theta);\n  vec2 rot = vec2(ct * local.x - st * local.y, st * local.x + ct * local.y);\n  rot.x += shear * rot.y;   // a small skew so the box MORPHS, not just rotates\n  return cc + rot;\n}\n\n// The CONTINUOUS traveling-wave FLOW warp — the SMOOTH twin of cellTwist (no per-cell seam;\n// for the level-set contours that shatter into a mesh under the cell discontinuity).\n// BG.W-GRID-AFFINE — warpFreq is the HOST-supplied curl-sampling spatial frequency (the caller's\n// own coordinate units): an order of magnitude BELOW its grid frequency so the warp is locally\n// affine (major lines bow as ONE smooth curve, no sub-cell crackle). liquid-grid (cell-scale g0)\n// passes ~0.03; concentric (unit-scale p) passes 0.6. The 1.833333 second-flow ratio transcribes\n// WAVE_FLOW_SECOND_RATIO. Amplitude unchanged — curl magnitude is the intrinsic gradient at the\n// fixed CURL_EPS, independent of warpFreq; the t-drift is host-agnostic.\nvec2 waveFlow(vec2 g, float t, vec2 waveDir, float waveK, float waveOmega, float waveSigma,\n              float twistMax, float amp, float warpFreq) {\n  float env = travelingEnvelope(g, t, waveDir, waveK, waveOmega, waveSigma) * amp;\n  vec2 f = curlFBM(vec2(g.x * warpFreq + t * 0.05, g.y * warpFreq - t * 0.04));\n  float wf2 = warpFreq * 1.833333;\n  vec2 f2 = curlFBM(vec2(g.x * wf2 - t * 0.03, g.y * wf2 + t * 0.035));\n  float k = twistMax * env;\n  return g + (f + f2 * 0.5) * k;\n}\n\n// The local cursor swirl — the finger twists the cells around it (re-aimed cursorBulge).\nvec2 cursorSwirl(vec2 g, vec2 cursor, float strength, float radius) {\n  vec2 to = g - cursor;\n  float d2 = dot(to, to);\n  float r = max(radius, 1e-4);\n  float theta = strength * exp(-d2 / (2.0 * r * r));\n  float ct = cos(theta);\n  float st = sin(theta);\n  return cursor + vec2(ct * to.x - st * to.y, st * to.x + ct * to.y);\n}\n\n// The LOW-octave value-noise topography — the scalar field concentric extracts contours of.\nfloat heightField(vec2 p, float octavesF, float seed) {\n  float v = 0.0;\n  float amp = 0.5;\n  float freq = 1.0;\n  float px = p.x + seed;\n  float py = p.y - seed;\n  int n = int(clamp(octavesF, 1.0, 6.0));\n  for (int i = 0; i < 6; i++) {\n    if (i >= n) break;\n    v += amp * valueNoise(px * freq, py * freq);\n    float rx = 0.8 * px - 0.6 * py;\n    float ry = 0.6 * px + 0.8 * py;\n    px = rx;\n    py = ry;\n    freq *= 2.0;\n    amp *= 0.5;\n  }\n  return v;\n}\n\n// The ω=√(g·k) breathing swell — basins inflate/deflate with weight.\nfloat waveSwell(float t, float phase) {\n  return sin(t * 0.35 + phase) * 0.5 + sin(t * 0.21 + phase * 1.7) * 0.5;\n}\n", ae = "#version 300 es\nprecision highp float;\nin vec2 aPosition;\nout vec2 vUv;\nvoid main() {\n  vUv = aPosition;            // [-1,1]² domain\n  gl_Position = vec4(aPosition, 0.0, 1.0);\n}", oe = `#version 300 es
 precision highp float;
 
 #define TAU 6.283185307179586
@@ -682,7 +682,7 @@ uniform vec3  uFaceLo;        // linear-sRGB rose-umber trough (FOLD B, 3-stop)
 uniform vec3  uFaceMid;       // linear-sRGB ember-amber mid
 uniform vec3  uFaceHi;        // linear-sRGB warm-wheat crest
 
-${r}
+${a}
 
 // The 3-stop warm-divergent FACE ramp (FOLD B — height-keyed, NOT a 2-point mid-park). All stops
 // warm hue ∈ [20,90]; linear-space (the OETF runs in main, FOLD E).
@@ -696,7 +696,7 @@ vec3 faceRamp(float rampT) {
 
 // The shared divergence-free 2D-curl operator (flow.glsl.ts) — the prototype declares
 // potentialFBM; the host defines its BODY below the splice (GLSL forward-declaration).
-${i}
+${c}
 
 // ── The host noise basis (transcribes liquidGrid.ts hash21/valueNoise/potentialFBM) ──
 float hash21(float x, float y) {
@@ -748,7 +748,7 @@ float potentialFBM(vec2 p) {
 // travelingEnvelope + the FACE leaf; spliced AFTER valueNoise + potentialFBM bodies + the curlFBM
 // chunk). liquid-grid + concentric read the SAME waveFlow continuous affine sheet-warp (the DRY
 // coupling — a leaf tune moves both, never the retired per-cell twist / LINE-warp).
-${te}
+${ie}
 
 // ── §1 The Ben Golus derivative-AA grid coverage (transcribes liquidGrid.ts gridCoverage) ──
 float gridCoverage(vec2 g, float targetWidth, vec2 uvDeriv) {
@@ -836,10 +836,10 @@ function q(e, t, n) {
 	}
 	return r;
 }
-function ie(e) {
-	let { canvas: t, config: n, getCursor: r, getAmp: i, shouldContinue: a, onFrame: o } = e;
+function se(e) {
+	let { canvas: t, config: n, getCursor: i, getAmp: a, shouldContinue: o, onFrame: s } = e;
 	return function(e) {
-		let c = q(e, e.VERTEX_SHADER, ne), l = q(e, e.FRAGMENT_SHADER, re), u = e.createProgram();
+		let c = q(e, e.VERTEX_SHADER, ae), l = q(e, e.FRAGMENT_SHADER, oe), u = e.createProgram();
 		if (e.attachShader(u, c), e.attachShader(u, l), e.linkProgram(u), !e.getProgramParameter(u, e.LINK_STATUS)) throw Error(`[LiquidGrid] link failed: ${e.getProgramInfoLog(u)}`);
 		e.deleteShader(c), e.deleteShader(l);
 		let d = e.createVertexArray();
@@ -859,28 +859,28 @@ function ie(e) {
 		function P(n) {
 			e.viewport(0, 0, n?.w ?? t.width, n?.h ?? t.height);
 		}
-		function F(a) {
-			o?.(a);
-			let c = t.width / Math.max(t.height, 1), l = z(t.height || 1, n.cellSize);
-			e.useProgram(u), e.bindVertexArray(d), e.enable(e.BLEND), e.blendFunc(e.ONE, e.ONE_MINUS_SRC_ALPHA), e.clearColor(0, 0, 0, 0), e.clear(e.COLOR_BUFFER_BIT), e.uniform1f(h, a), e.uniform1f(g, l), e.uniform1f(_, n.majorEvery), e.uniform1f(v, c), e.uniform4f(T, n.waveDir[0], n.waveDir[1], n.waveK, n.waveOmega), e.uniform4f(E, n.waveSigma, n.twistMax, 0, i()), e.uniform1f(w, +!!n.interactive);
+		function F(o) {
+			s?.(o);
+			let c = t.width / Math.max(t.height, 1), l = V(t.height || 1, n.cellSize);
+			e.useProgram(u), e.bindVertexArray(d), e.enable(e.BLEND), e.blendFunc(e.ONE, e.ONE_MINUS_SRC_ALPHA), e.clearColor(0, 0, 0, 0), e.clear(e.COLOR_BUFFER_BIT), e.uniform1f(h, o), e.uniform1f(g, l), e.uniform1f(_, n.majorEvery), e.uniform1f(v, c), e.uniform4f(T, n.waveDir[0], n.waveDir[1], n.waveK, n.waveOmega), e.uniform4f(E, n.waveSigma, n.twistMax, 0, a()), e.uniform1f(w, +!!n.interactive);
 			let f = Math.max(n.cellSize, 1), p = n.lineWidth / f, m = n.lineWidth * 1.6 / f;
 			e.uniform4f(y, p, m, n.minorAlpha, n.majorAlpha), e.uniform1f(b, n.fieldAlpha);
-			let P = r();
+			let P = i();
 			e.uniform4f(S, P.x, P.y, n.bulgeStrength, n.bulgeRadius), e.uniform1f(C, n.bulgeMode === "attract" ? -1 : 1);
-			let F = s(n.lineColor);
+			let F = r(n.lineColor);
 			e.uniform3f(D, F[0], F[1], F[2]), e.uniform4f(k, n.faceAlpha, n.faceRelief, n.squashK, n.baseInset), e.uniform2f(A, n.lightDir[0], n.lightDir[1]);
-			let I = s(n.faceWarmLo), L = s(n.faceWarmMid), R = s(n.faceWarmHi);
+			let I = r(n.faceWarmLo), L = r(n.faceWarmMid), R = r(n.faceWarmHi);
 			if (e.uniform3f(j, I[0], I[1], I[2]), e.uniform3f(M, L[0], L[1], L[2]), e.uniform3f(N, R[0], R[1], R[2]), n.background === "transparent") e.uniform1f(x, 0), e.uniform3f(O, 0, 0, 0);
 			else {
 				e.uniform1f(x, 1);
-				let t = s(n.background);
+				let t = r(n.background);
 				e.uniform3f(O, t[0], t[1], t[2]);
 			}
 			e.drawArrays(e.TRIANGLES, 0, 3), e.bindVertexArray(null);
 		}
 		return {
 			frame: F,
-			shouldContinue: a,
+			shouldContinue: o,
 			resize: P,
 			teardown: () => {
 				e.deleteProgram(u), e.deleteVertexArray(d), e.deleteBuffer(f);
@@ -891,85 +891,92 @@ function ie(e) {
 //#endregion
 //#region src/components/liquid-grid/composables/useLiquidGrid.ts
 function J(e, n) {
-	let { config: r } = n, i = n.mode ?? "live", s = t({ respectReducedMotion: r.respectReducedMotion }), c = {
+	let { config: r } = n, a = n.mode ?? "live", s = t({ respectReducedMotion: r.respectReducedMotion }), c = {
 		x: 1e6,
 		y: 1e6
-	}, l = () => c, u = 0, d = () => u, f = 0, p = null;
-	function m(t) {
-		let n = f > 0 ? (t - f) * 1e3 : 16.7;
-		if (f = t, s.tick(n), p?.reducedMotion ? u = 0 : (u += (1.06 - u) * .04, u > 1 && (u = 1 + (u - 1) * .85)), !r.interactive || !s.active.value) {
+	}, u = () => c, d = 0, f = () => d, p = 0, m = null, h = b(l("webgpu")), _ = !1;
+	function v(t) {
+		let n = p > 0 ? (t - p) * 1e3 : 16.7;
+		p = t;
+		let i = Math.min(Math.max(n, 0), 50);
+		if (s.tick(i), m?.reducedMotion ? d = 0 : (d += (1.06 - d) * .04, d > 1 && (d = 1 + (d - 1) * .85)), !r.interactive || !s.active.value) {
 			c = {
 				x: 1e6,
 				y: 1e6
 			};
 			return;
 		}
-		let i = e.value, a = (i?.width || 1) / Math.max(i?.height || 1, 1), o = z(i?.height || 320, r.cellSize), l = s.smoothedPosition.value, d = s.velocity.value, m = s.burst.value, h = (l.x * 2 - 1) * a, g = -(l.y * 2 - 1), _ = .12 + Math.min(.4, m);
+		let a = e.value, o = (a?.width || 1) / Math.max(a?.height || 1, 1), l = V(a?.height || 320, r.cellSize), u = s.smoothedPosition.value, f = s.velocity.value, h = s.burst.value, g = (u.x * 2 - 1) * o, _ = -(u.y * 2 - 1), v = .12 + Math.min(.4, h);
 		c = {
-			x: (h + d.x * _) * o,
-			y: (g - d.y * _) * o
+			x: (g + f.x * v) * l,
+			y: (_ - f.y * v) * l
 		};
 	}
-	let g = () => {
-		s.onPointerEnter(), r.interactive && p?.wake();
-	}, _ = (e) => {
-		s.onPointerMove(e), r.interactive && p?.wake();
-	}, v = (e) => e.parentElement ?? e;
-	function y(e) {
-		let t = v(e);
-		t.addEventListener("pointermove", _), t.addEventListener("pointerenter", g), t.addEventListener("pointerleave", s.onPointerLeave);
+	let x = () => {
+		s.onPointerEnter(), r.interactive && m?.wake();
+	}, S = (e) => {
+		s.onPointerMove(e), r.interactive && m?.wake();
+	}, C = (e) => e.parentElement ?? e;
+	function w(e) {
+		let t = C(e);
+		t.addEventListener("pointermove", S), t.addEventListener("pointerenter", x), t.addEventListener("pointerleave", s.onPointerLeave);
 	}
-	function b(e) {
-		let t = v(e);
-		t.removeEventListener("pointermove", _), t.removeEventListener("pointerenter", g), t.removeEventListener("pointerleave", s.onPointerLeave);
+	function T(e) {
+		let t = C(e);
+		t.removeEventListener("pointermove", S), t.removeEventListener("pointerenter", x), t.removeEventListener("pointerleave", s.onPointerLeave);
 	}
-	let x = () => {
+	let E = () => {
+		if (_) return null;
 		let t = e.value;
-		return t ? (p || (y(t), p = o(t, {
-			mode: i,
+		return t ? (m || (w(t), m = i(t, {
+			mode: a,
 			respectReducedMotion: r.respectReducedMotion,
-			dprPolicy: a,
+			dprPolicy: o,
 			revealBloom: !0,
-			setupWGPU: ee({
+			setupWGPU: re({
 				canvas: t,
 				config: r,
-				getCursor: l,
-				getAmp: d,
+				getCursor: u,
+				getAmp: f,
 				shouldContinue: () => !0,
-				onFrame: m
+				onFrame: v
 			}),
-			setupGL: ie({
+			setupGL: se({
 				canvas: t,
 				config: r,
-				getCursor: l,
-				getAmp: d,
+				getCursor: u,
+				getAmp: f,
 				shouldContinue: () => !0,
-				onFrame: m
-			})
-		}), p.armAsync()), p) : null;
+				onFrame: v
+			}),
+			onStatus: (e) => h.value = e
+		}), m.armAsync().catch(() => void 0)), m) : null;
 	};
-	queueMicrotask(() => x());
-	let S = {
+	queueMicrotask(() => E());
+	let D = {
 		get backend() {
-			return x()?.backend ?? "webgpu";
+			return E()?.backend ?? "webgpu";
 		},
-		pause: () => x()?.suspend("manual"),
-		resume: () => x()?.resume("manual"),
-		wake: () => x()?.wake(),
-		renderAt: (e) => x()?.renderAt(e),
+		pause: () => E()?.suspend("manual"),
+		resume: () => E()?.resume("manual"),
+		wake: () => E()?.wake(),
+		renderAt: (e) => E()?.renderAt(e),
 		get reducedMotion() {
-			return p?.reducedMotion ?? !1;
+			return m?.reducedMotion ?? !1;
 		},
+		rendererStatus: y(h),
 		dispose: () => {
+			if (_) return;
+			_ = !0;
 			let t = e.value;
-			t && b(t), s.dispose(), p?.dispose();
+			t && T(t), s.dispose(), m?.dispose();
 		}
 	};
-	return h(() => S.dispose()), S;
+	return g(() => D.dispose()), D;
 }
 //#endregion
 //#region src/components/liquid-grid/constants.ts
-var ae = 16, Y = {
+var ce = 16, Y = {
 	L: .62,
 	C: .05,
 	h: 62
@@ -1012,7 +1019,7 @@ var ae = 16, Y = {
 	background: "transparent",
 	interactive: !0,
 	respectReducedMotion: !0
-}, oe = /* @__PURE__ */ e(/* @__PURE__ */ f({
+}, le = /* @__PURE__ */ e(/* @__PURE__ */ p({
 	__name: "LiquidGrid",
 	props: {
 		config: { default: () => $ },
@@ -1021,44 +1028,48 @@ var ae = 16, Y = {
 			default: !1
 		}
 	},
-	emits: ["update:paused"],
-	setup(e, { expose: t }) {
-		let n = v("wrapperRef"), r = v("canvasRef"), i = _({ ...e.config });
-		y(() => e.config, (e) => Object.assign(i, e), { deep: !0 }), m(() => {
+	emits: ["update:paused", "rendererStatus"],
+	setup(e, { expose: t, emit: r }) {
+		let i = r, a = x("wrapperRef"), o = x("canvasRef"), s = v({ ...e.config });
+		S(() => e.config, (e) => Object.assign(s, e), { deep: !0 }), h(() => {
 			if (e.config.lineColor === $.lineColor) {
-				let e = n.value;
+				let e = a.value;
 				if (e) {
 					let t = getComputedStyle(e).getPropertyValue("--foreground").trim();
 					if (t) try {
-						i.lineColor = c(t);
+						s.lineColor = n(t);
 					} catch {}
 				}
 			}
 		});
-		let a = J(r, { config: i });
-		y(() => e.paused, (e) => e ? a.pause() : a.resume(), { immediate: !0 });
-		let o = l(() => {
+		let c = J(o, { config: s });
+		S(c.rendererStatus, (e) => i("rendererStatus", e), {
+			immediate: !0,
+			flush: "sync"
+		}), S(() => e.paused, (e) => e ? c.pause() : c.resume(), { immediate: !0 });
+		let l = u(() => {
 			let t = e.config.background;
 			if (t !== "transparent") return `oklch(${t.L} ${t.C} ${t.h})`;
 		});
 		return t({
-			pause: a.pause,
-			resume: a.resume,
-			wake: a.wake,
-			renderAt: a.renderAt
-		}), (e, t) => (g(), u("div", {
+			pause: c.pause,
+			resume: c.resume,
+			wake: c.wake,
+			renderAt: c.renderAt,
+			rendererStatus: c.rendererStatus
+		}), (e, t) => (_(), d("div", {
 			ref_key: "wrapperRef",
-			ref: n,
+			ref: a,
 			class: "liquid-grid-wrapper",
-			style: p(o.value ? { background: o.value } : void 0)
-		}, [d("canvas", {
+			style: m(l.value ? { background: l.value } : void 0)
+		}, [f("canvas", {
 			ref_key: "canvasRef",
-			ref: r,
+			ref: o,
 			class: "liquid-grid-canvas",
 			"aria-hidden": "true",
 			"data-testid": "liquid-grid-canvas"
 		}, null, 512)], 4));
 	}
-}), [["__scopeId", "data-v-fc828b9e"]]);
+}), [["__scopeId", "data-v-b7537b22"]]);
 //#endregion
-export { O as CURL_EPS, $ as DEFAULT_LIQUID_GRID_CONFIG, Q as FACE_WARM_HI, X as FACE_WARM_LO, Z as FACE_WARM_MID, ae as LIQUID_GRID_MAX_MAJOR_EVERY, oe as LiquidGrid, Y as WARM_IDENTITY_INK, P as curlFBM, L as gridCoverage, z as gridScaleFor, N as potentialFBM, R as sampleLiquidGrid, J as useLiquidGrid };
+export { j as CURL_EPS, $ as DEFAULT_LIQUID_GRID_CONFIG, Q as FACE_WARM_HI, X as FACE_WARM_LO, Z as FACE_WARM_MID, ce as LIQUID_GRID_MAX_MAJOR_EVERY, le as LiquidGrid, Y as WARM_IDENTITY_INK, L as curlFBM, B as gridCoverage, V as gridScaleFor, I as potentialFBM, ee as sampleLiquidGrid, J as useLiquidGrid };