@mkbabb/glass-ui 5.0.0 → 7.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 as e } from "./_plugin-vue_export-helper-B3ysoDQm.js";
+import { t } from "./usePointerVelocityField-DsIf7yyq.js";
+import { cssToOklch as n, oklchToLinear as r } from "./color.js";
+import { m as i, n as a, o, u as s } from "./color.wgsl-Ct5o9dpf.js";
+import { a as c } from "./rendererStatus-BxUlBLVy.js";
+import { n as l, t as u } from "./flow.wgsl-Cd2GUkPx.js";
+import { computed as d, createElementBlock as f, createElementVNode as p, defineComponent as m, normalizeStyle as h, onMounted as g, onScopeDispose as _, openBlock as v, reactive as y, readonly as b, shallowRef as x, useTemplateRef as S, watch as C } 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 w = Math.PI * 2;
+function T(e, t, n, r, i, a) {
+	let o = ((e.x * n.x + e.y * n.y) * r - t * i) / w;
 	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 E(e, t, n, r, i, a, o) {
+	return T(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 D(e, t, n, r, i, a, o, s) {
+	let c = Math.max(t, .001) * .5, l = E({
 		x: e.x + c,
 		y: e.y
-	}, n, r, i, a, o, s), u = S({
+	}, n, r, i, a, o, s), u = E({
 		x: e.x - c,
 		y: e.y
-	}, n, r, i, a, o, s), d = S({
+	}, n, r, i, a, o, s), d = E({
 		x: e.x,
 		y: e.y + c
-	}, n, r, i, a, o, s), f = S({
+	}, n, r, i, a, o, s), f = E({
 		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 O(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 k(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 A = 1.833333;
+function j(e, t, n, r, i, a, o, s, c, l = .6) {
+	let u = T(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 * A, 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 M = .012, N = .03;
+function P(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 F(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 I(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 = P(n, r), l = P(n + 1, r), u = P(n, r + 1), d = P(n + 1, r + 1);
+	return F(F(c, l, o), F(u, d, o), s);
 }
-function N(e) {
+function L(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 * I(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 R(e) {
+	let t = L({
+		x: e.x + M,
 		y: e.y
-	}) - N({
-		x: e.x - O,
+	}) - L({
+		x: e.x - M,
 		y: e.y
-	}), n = N({
+	}), n = L({
 		x: e.x,
-		y: e.y + O
-	}) - N({
+		y: e.y + M
+	}) - L({
 		x: e.x,
-		y: e.y - O
-	}), r = t / (2 * O);
+		y: e.y - M
+	}), r = t / (2 * M);
 	return {
-		x: n / (2 * O),
+		x: n / (2 * M),
 		y: -r
 	};
 }
-function F(e, t, n) {
+function z(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 B(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 V(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 = B(t, n.x, .5), o = B(t, n.y, .5), s = n.x * 1.5, c = n.y * 1.5, l = z(a + s, a - s, r), u = z(o + c, o - c, i);
+	return l *= B(t / Math.max(a, 1e-6), 0, 1), u *= B(t / Math.max(o, 1e-6), 0, 1), l = F(l, t, B(n.x * 2 - 1, 0, 1)), u = F(u, t, B(n.y * 2 - 1, 0, 1)), Math.max(l, u);
 }
-function R(e, t, n) {
-	let r = D(P, {
+function H(e, t, n) {
+	let r = j(R, {
 		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, N);
+	n.interactive > .5 && (r = k(r, n.cursor, n.bulgeStrength * n.bulgeMode, n.bulgeRadius));
+	let i = V(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 = V(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 = E(h, t, n.waveDir, n.waveK, n.waveOmega, n.waveSigma, n.amp), _ = D(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 = B(.5 + (v * m.x + y * m.y) / (b * x) * .5, 0, 1), C = p * (1 - f * g), w = O(r, C, n.uvDeriv), T = w * u * n.fieldAlpha, A = B(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: T,
+			rampT: A
 		}
 	};
 }
-function z(e, t) {
+function U(e, t) {
 	return e / Math.max(t, 1);
 }
 //#endregion
 //#region src/components/liquid-grid/shaders/liquid-grid.wgsl.ts
-var B = `
+var W = `
 const TAU: f32 = 6.283185307179586;
 
 // ── Paper-grid uniforms (the typed-struct source-of-truth — see uniformBridgeWGPU.ts) ──
@@ -182,17 +182,17 @@ struct LiquidGridUniforms {
   wave: vec4<f32>,
   // wave2: (waveSigma, twistMax, _pad, amp) — the affine sheet-warp envelope (amp: spring-eased)
   wave2: vec4<f32>,
-  // faceLo: (rose-umber trough .rgb (linear), _pad) — the warm-divergent ramp (FOLD B, 3-stop)
+  // faceLo: (rose-umber trough.rgb (linear), _pad) — the warm-divergent ramp (FOLD B, 3-stop)
   faceLo: vec4<f32>,
-  // faceMid: (ember-amber mid .rgb (linear), _pad)
+  // faceMid: (ember-amber mid.rgb (linear), _pad)
   faceMid: vec4<f32>,
-  // faceHi: (warm-wheat crest .rgb (linear), _pad)
+  // faceHi: (warm-wheat crest.rgb (linear), _pad)
   faceHi: vec4<f32>,
 };
 
 @group(0) @binding(0) var<uniform> u: LiquidGridUniforms;
 
-${n}
+${a}
 
 // ── 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
@@ -244,19 +244,7 @@ fn potentialFBM(p: vec2f) -> f32 {
 }
 
 // The shared divergence-free 2D-curl operator (flow.wgsl.ts — the FIRST WGSL curl consumer).
-
-const CURL_EPS: f32 = 0.012;
-
-// ∇×ψ in 2D — the divergence-free flow direction. Central finite differences of the
-// scalar potential give the partials; the cross-pairing (∂y, −∂x) is the 2D curl.
-fn curlFBM(p: vec2f) -> vec2f {
-  let dx = potentialFBM(p + vec2f(CURL_EPS, 0.0)) - potentialFBM(p - vec2f(CURL_EPS, 0.0));
-  let dy = potentialFBM(p + vec2f(0.0, CURL_EPS)) - potentialFBM(p - vec2f(0.0, CURL_EPS));
-  // ψ-gradient is (dx, dy)/(2·eps); the curl rotates it 90°: (∂ψ/∂y, −∂ψ/∂x).
-  let g = vec2f(dx, dy) / (2.0 * CURL_EPS);
-  return vec2f(g.y, -g.x);
-}
-
+${u}
 
 // The shared traveling-wave WARP chunk (waveField.wgsl.ts — waveFlow/cursorSwirl/
 // travelingEnvelope + the FACE leaf; splices AFTER valueNoise + curlFBM are declared). liquid-grid
@@ -299,7 +287,7 @@ fn cellHeight(cc: vec2f, t: f32, waveDir: vec2f, waveK: f32, waveOmega: f32, wav
 
 // The pre-twist driver (FOLD A): the cell pivot cc + the crest envelope env the twist AND the
 // face both ride. The face samples height/relief at THIS pre-twist cc (the crest twist crosses
-// the cell boundary → floor(twisted_g) would light a NEIGHBOUR cell). cc in .xy, env in .z.
+// the cell boundary → floor(twisted_g) would light a neighbouring cell). cc is in .xy and env in .z.
 fn cellDriver(g: vec2f, cellSize: f32, t: f32, waveDir: vec2f, waveK: f32, waveOmega: f32,
               waveSigma: f32, amp: f32) -> vec3f {
   let cs = max(cellSize, 1e-3);
@@ -352,9 +340,9 @@ fn cellTwist(g: vec2f, cellSize: f32, t: f32, waveDir: vec2f, waveK: f32, waveOm
 
 // The CONTINUOUS traveling-wave FLOW warp — the SMOOTH twin of cellTwist (no per-cell seam;
 // for the level-set contours that shatter into a mesh under the cell discontinuity).
-// BG.W-GRID-AFFINE — warpFreq is the HOST-supplied curl-sampling spatial frequency (the caller's
+// warpFreq is the host-supplied curl-sampling spatial frequency (the caller's
 // own coordinate units): an order of magnitude BELOW its grid frequency so the warp is locally
-// affine (major lines bow as ONE smooth curve, no sub-cell crackle). liquid-grid (cell-scale g0)
+// affine (major lines bow as one smooth curve, no sub-cell crackle). LiquidGrid (cell-scale g0)
 // passes ~0.03; concentric (unit-scale p) passes 0.6. The 1.833333 second-flow ratio transcribes
 // WAVE_FLOW_SECOND_RATIO. Amplitude unchanged — curl magnitude is the intrinsic gradient at the
 // fixed CURL_EPS, independent of warpFreq; the t-drift is host-agnostic.
@@ -407,7 +395,7 @@ fn waveSwell(t: f32, phase: f32) -> f32 {
 
 
 // ── §1 The crisp line: Ben Golus derivative-AA grid coverage (transcribes gridCoverage) ──
-// targetWidth is the line half-width in GRID UNITS (lineWidthPx / minorPitchPx); uvDeriv is
+// targetWidth is the line half-width in grid units (lineWidthPx / minorPitchPx); uvDeriv is
 // the per-axis screen-space derivative of g (length(vec2(dpdx, dpdy)) per axis). Returns
 // line coverage [0..1] — exactly N device-pixels wide at ANY DPR/zoom (the blur-kill).
 fn gridCoverage(g: vec2f, targetWidth: f32, uvDeriv: vec2f) -> f32 {
@@ -470,12 +458,12 @@ fn fs_main(in: VSOut) -> @location(0) vec4f {
   // no per-cell seam); cursorSwirl twists the cells about the finger. The Golus dv reads the FINAL
   // warped coord (the crisp-line fence survives).
   let g0 = uv * gridScale;
-  // BG.W-GRID-AFFINE — g0 is CELL-scale, so pass the tiny 0.03 curl-sampling frequency (== the JS
+  // g0 is CELL-scale, so pass the tiny 0.03 curl-sampling frequency (== the JS
   // LIQUID_GRID_WARP_FREQ) so the warp is locally affine at the cell scale (major lines bow as ONE
   // smooth curve, no sub-cell crackle). Concentric passes 0.6 (its p is unit-scale).
   var g = waveFlow(g0, t, u.wave.xy, u.wave.z, u.wave.w, u.wave2.x, u.wave2.y, u.wave2.w, 0.03);
   if (u.cursor2.y > 0.5) {
-    // bulgeMode (cursor2.x: +repel / −attract) signs the swirl direction.
+    // bulgeMode (cursor2.x: +repel, −attract) signs the swirl direction.
     g = cursorSwirl(g, u.cursor.xy, u.cursor.z * u.cursor2.x, u.cursor.w);
   }
 
@@ -487,12 +475,12 @@ fn fs_main(in: VSOut) -> @location(0) vec4f {
   );
 
   let minor = gridCoverage(g, u.grid.x, dv);
-  // The major tier evals at g / majorEvery with its own derivative scaling.
+  // The major tier evaluates at g / majorEvery with its own derivative scaling.
   let me = max(u.u0.w, 1.0);
   let major = gridCoverage(g / me, u.grid.y, dv / me);
   let line = max(minor * u.grid.z, major * u.grid.w);
 
-  // ── The FACE (BD.W-PAPERGRID-FACE) — height-lit filled cell interior ──────────────────
+  // ── The FACE — height-lit filled cell interior ──────────────────
   // Sample height/relief at the WARPED-space cell center (floor(g)+0.5, the cell the fragment
   // lands in under the affine warp); Lambert the ∇H slope against the fixed cel key-light; squash
   // the inset so the crest face inflates; multi-stop warm-divergent ramp keyed on mix(shade, h)
@@ -520,7 +508,7 @@ fn fs_main(in: VSOut) -> @location(0) vec4f {
   }
   // transparent ground: the FACE composites UNDER the line, the SOURCE-OVER operator in
   // PREMULTIPLIED space (the page reads through the gutters). faceAlpha:0 → faceA=0 → the face
-  // term vanishes → vec4f(col·line, line) = byte-identical to the HEAD line-only render.
+  // term vanishes → vec4f(col·line, line) = the line-only render.
   let linePremult = (col * line) * u.field.x;            // line layer (the FieldAlpha global subtlety)
   let lineA = line * u.field.x;
   let facePremult = faceInk * faceA;                     // face layer premultiplied (faceA folds field.x)
@@ -528,7 +516,7 @@ fn fs_main(in: VSOut) -> @location(0) vec4f {
   let a = lineA + faceA * (1.0 - lineA);
   return vec4f(outPremult, a);                           // premultiplied over transparent
 }
-`, V = {
+`, G = {
 	u0: 0,
 	face: 4,
 	warp2: 8,
@@ -544,48 +532,48 @@ fn fs_main(in: VSOut) -> @location(0) vec4f {
 	faceMid: 48,
 	faceHi: 52
 };
-function H() {
+function K() {
 	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 ee(e, t, n, i, a, o, s) {
+	let { f32: c } = e, l = U(a, t.cellSize);
+	c[G.u0 + 0] = n, c[G.u0 + 1] = l, c[G.u0 + 2] = t.cellSize, c[G.u0 + 3] = t.majorEvery, c[G.face + 0] = t.faceAlpha, c[G.face + 1] = t.faceRelief, c[G.face + 2] = t.squashK, c[G.face + 3] = t.baseInset, c[G.warp2 + 0] = 0, c[G.warp2 + 1] = i, c[G.warp2 + 2] = t.lightDir[0], c[G.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[G.grid + 0] = d, c[G.grid + 1] = f, c[G.grid + 2] = t.minorAlpha, c[G.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[G.field + 0] = t.fieldAlpha, c[G.field + 1] = p, c[G.field + 2] = 0, c[G.field + 3] = 0, c[G.cursor + 0] = o.x, c[G.cursor + 1] = o.y, c[G.cursor + 2] = t.bulgeStrength, c[G.cursor + 3] = t.bulgeRadius, c[G.cursor2 + 0] = t.bulgeMode === "attract" ? -1 : 1, c[G.cursor2 + 1] = +!!t.interactive, c[G.cursor2 + 2] = 0, c[G.cursor2 + 3] = 0;
+	let m = r(t.lineColor);
+	if (c[G.line + 0] = m[0], c[G.line + 1] = m[1], c[G.line + 2] = m[2], c[G.line + 3] = 0, t.background === "transparent") c[G.bg + 0] = 0, c[G.bg + 1] = 0, c[G.bg + 2] = 0, c[G.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[G.bg + 0] = e[0], c[G.bg + 1] = e[1], c[G.bg + 2] = e[2], c[G.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[G.wave + 0] = t.waveDir[0], c[G.wave + 1] = t.waveDir[1], c[G.wave + 2] = t.waveK, c[G.wave + 3] = t.waveOmega, c[G.wave2 + 0] = t.waveSigma, c[G.wave2 + 1] = t.twistMax, c[G.wave2 + 2] = 0, c[G.wave2 + 3] = s;
+	let h = r(t.faceWarmLo), g = r(t.faceWarmMid), _ = r(t.faceWarmHi);
+	return c[G.faceLo + 0] = h[0], c[G.faceLo + 1] = h[1], c[G.faceLo + 2] = h[2], c[G.faceLo + 3] = 0, c[G.faceMid + 0] = g[0], c[G.faceMid + 1] = g[1], c[G.faceMid + 2] = g[2], c[G.faceMid + 3] = 0, c[G.faceHi + 0] = _[0], c[G.faceHi + 1] = _[1], c[G.faceHi + 2] = _[2], c[G.faceHi + 3] = 0, e;
 }
 //#endregion
 //#region src/components/liquid-grid/composables/liquidGridWGPUSetup.ts
-var W = 64, G = 8, K = 2;
-function ee(e) {
+var te = 2;
+function ne(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: W
+		}), u = K(), d = e.createBuffer({
 			label: "[LiquidGrid] uniforms",
 			size: u.buffer.byteLength,
-			usage: W | G
+			usage: 72
 		}), f = e.createBindGroupLayout({
 			label: "[LiquidGrid] bgl",
 			entries: [{
 				binding: 0,
-				visibility: K,
+				visibility: te,
 				buffer: { type: "uniform" }
 			}]
 		}), p = e.createRenderPipeline({
@@ -625,9 +613,11 @@ 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);
-			let c = e.createCommandEncoder({ label: "[LiquidGrid] frame" }), l = s.getCurrentTexture().createView(), f = c.beginRenderPass({ colorAttachments: [{
-				view: l,
+			o?.(a);
+			let c = t.width / Math.max(t.height, 1), l = t.height || 1;
+			ee(u, n, a, c, l, r(), i()), e.queue.writeBuffer(d, 0, u.buffer);
+			let f = e.createCommandEncoder({ label: "[LiquidGrid] frame" }), h = s.getCurrentTexture().createView(), g = f.beginRenderPass({ colorAttachments: [{
+				view: h,
 				clearValue: {
 					r: 0,
 					g: 0,
@@ -637,7 +627,7 @@ function ee(e) {
 				loadOp: "clear",
 				storeOp: "store"
 			}] });
-			f.setPipeline(p), f.setBindGroup(0, m), f.draw(3, 1, 0, 0), f.end(), e.queue.submit([c.finish()]);
+			g.setPipeline(p), g.setBindGroup(0, m), g.draw(3, 1, 0, 0), g.end(), e.queue.submit([f.finish()]);
 		}
 		return {
 			frame: g,
@@ -651,7 +641,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 re = "\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 neighbouring cell). cc is in .xy and 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// 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). LiquidGrid (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", ie = "#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}", ae = `#version 300 es
 precision highp float;
 
 #define TAU 6.283185307179586
@@ -675,14 +665,14 @@ uniform vec4  uWave;          // (waveDirX, waveDirY, waveK, waveOmega)
 uniform vec4  uWave2;         // (waveSigma, twistMax, _pad, amp) — affine sheet-warp envelope
 uniform vec3  uLineColor;     // linear-sRGB ink
 uniform vec3  uBg;            // linear-sRGB themed bg
-// ── The FACE (BD.W-PAPERGRID-FACE) — the height-lit filled cell interior ──
+// ── The FACE — the height-lit filled cell interior ──
 uniform vec4  uFace;          // (faceAlpha, faceRelief, squashK, baseInset)
 uniform vec2  uLightDir;      // the cel key-light direction
 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}
+${o}
 
 // 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 +686,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}
+${l}
 
 // ── The host noise basis (transcribes liquidGrid.ts hash21/valueNoise/potentialFBM) ──
 float hash21(float x, float y) {
@@ -747,8 +737,8 @@ float potentialFBM(vec2 p) {
 // The shared traveling-wave WARP chunk (waveField.glsl.ts — waveFlow/cursorSwirl/
 // 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}
+// coupling — a leaf tune moves both, never the retired per-cell twist or line warp).
+${re}
 
 // ── §1 The Ben Golus derivative-AA grid coverage (transcribes liquidGrid.ts gridCoverage) ──
 float gridCoverage(vec2 g, float targetWidth, vec2 uvDeriv) {
@@ -772,7 +762,7 @@ void main() {
   // no per-cell seam); cursorSwirl twists the cells about the finger. The Golus dv reads the FINAL
   // warped coord (the crisp-line fence survives).
   vec2 g0 = uv * uGridScale;
-  // BG.W-GRID-AFFINE — g0 is CELL-scale, so pass the tiny 0.03 curl-sampling frequency (== the JS
+  // g0 is cell-scale, so pass the tiny 0.03 curl-sampling frequency (== the JS
   // LIQUID_GRID_WARP_FREQ) so the warp is locally affine at the cell scale (major lines bow as ONE
   // smooth curve, no sub-cell crackle). Concentric passes 0.6 (its p is unit-scale).
   vec2 g = waveFlow(g0, uTime, uWave.xy, uWave.z, uWave.w, uWave2.x, uWave2.y, uWave2.w, 0.03);
@@ -792,7 +782,7 @@ void main() {
   float major = gridCoverage(g / me, uGrid.y, dv / me);
   float line = max(minor * uGrid.z, major * uGrid.w);
 
-  // ── The FACE (BD.W-PAPERGRID-FACE) — height-lit filled cell interior ──────────────────
+  // ── The FACE — height-lit filled cell interior ──────────────────
   // Sample height/relief at the WARPED-space cell center (floor(g)+0.5, the cell the fragment
   // lands in under the affine warp); Lambert the ∇H slope against the fixed cel key-light; squash
   // the inset so the crest face inflates; multi-stop warm-divergent ramp keyed on mix(shade, h)
@@ -818,7 +808,7 @@ void main() {
   }
   // transparent ground: the FACE composites UNDER the line, the SOURCE-OVER operator in
   // PREMULTIPLIED space. faceAlpha:0 → faceA=0 → the face term vanishes → vec4(col·line, line) =
-  // byte-identical to the HEAD line-only render.
+  // identical to the plain line-only render.
   vec3 linePremult = (col * line) * uFieldAlpha;          // line layer (the FieldAlpha subtlety)
   float lineA = line * uFieldAlpha;
   vec3 facePremult = faceInk * faceA;                     // face layer premultiplied (faceA folds field)
@@ -836,10 +826,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 oe(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, ie), l = q(e, e.FRAGMENT_SHADER, ae), 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 +849,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 = U(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 +881,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", o = t({ respectReducedMotion: r.respectReducedMotion }), l = {
 		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) {
-			c = {
+	}, u = () => l, d = 0, f = () => d, p = 0, m = null, h = x(c("webgpu")), g = !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 (o.tick(i), m?.reducedMotion ? d = 0 : (d += (1.06 - d) * .04, d > 1 && (d = 1 + (d - 1) * .85)), !r.interactive || !o.active.value) {
+			l = {
 				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);
-		c = {
-			x: (h + d.x * _) * o,
-			y: (g - d.y * _) * o
+		let a = e.value, s = (a?.width || 1) / Math.max(a?.height || 1, 1), c = U(a?.height || 320, r.cellSize), u = o.smoothedPosition.value, f = o.velocity.value, h = o.burst.value, g = (u.x * 2 - 1) * s, _ = -(u.y * 2 - 1), v = .12 + Math.min(.4, h);
+		l = {
+			x: (g + f.x * v) * c,
+			y: (_ - f.y * v) * c
 		};
 	}
-	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 y = () => {
+		o.onPointerEnter(), r.interactive && m?.wake();
+	}, S = (e) => {
+		o.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", y), t.addEventListener("pointerleave", o.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", y), t.removeEventListener("pointerleave", o.onPointerLeave);
 	}
-	let x = () => {
+	let E = () => {
+		if (g) return null;
 		let t = e.value;
-		return t ? (p || (y(t), p = o(t, {
-			mode: i,
+		return t ? (m || (w(t), m = s(t, {
+			mode: a,
 			respectReducedMotion: r.respectReducedMotion,
-			dprPolicy: a,
+			dprPolicy: i,
 			revealBloom: !0,
-			setupWGPU: ee({
+			setupWGPU: ne({
 				canvas: t,
 				config: r,
-				getCursor: l,
-				getAmp: d,
+				getCursor: u,
+				getAmp: f,
 				shouldContinue: () => !0,
-				onFrame: m
+				onFrame: v
 			}),
-			setupGL: ie({
+			setupGL: oe({
 				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: b(h),
 		dispose: () => {
+			if (g) return;
+			g = !0;
 			let t = e.value;
-			t && b(t), s.dispose(), p?.dispose();
+			t && T(t), o.dispose(), m?.dispose();
 		}
 	};
-	return h(() => S.dispose()), S;
+	return _(() => D.dispose()), D;
 }
 //#endregion
 //#region src/components/liquid-grid/constants.ts
-var ae = 16, Y = {
+var se = 16, Y = {
 	L: .62,
 	C: .05,
 	h: 62
@@ -1012,7 +1009,7 @@ var ae = 16, Y = {
 	background: "transparent",
 	interactive: !0,
 	respectReducedMotion: !0
-}, oe = /* @__PURE__ */ e(/* @__PURE__ */ f({
+}, ce = /*#__PURE__*/ e(/* @__PURE__ */ m({
 	__name: "LiquidGrid",
 	props: {
 		config: { default: () => $ },
@@ -1021,44 +1018,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 = S("wrapperRef"), o = S("canvasRef"), s = y({ ...e.config });
+		C(() => e.config, (e) => Object.assign(s, e), { deep: !0 }), g(() => {
 			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 });
+		C(c.rendererStatus, (e) => i("rendererStatus", e), {
+			immediate: !0,
+			flush: "sync"
+		}), C(() => e.paused, (e) => e ? c.pause() : c.resume(), { immediate: !0 });
+		let l = d(() => {
 			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) => (v(), f("div", {
 			ref_key: "wrapperRef",
-			ref: n,
+			ref: a,
 			class: "liquid-grid-wrapper",
-			style: p(o.value ? { background: o.value } : void 0)
-		}, [d("canvas", {
+			style: h(l.value ? { background: l.value } : void 0)
+		}, [p("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-4075ca62"]]);
 //#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 { M as CURL_EPS, $ as DEFAULT_LIQUID_GRID_CONFIG, Q as FACE_WARM_HI, X as FACE_WARM_LO, Z as FACE_WARM_MID, se as LIQUID_GRID_MAX_MAJOR_EVERY, ce as LiquidGrid, Y as WARM_IDENTITY_INK, R as curlFBM, V as gridCoverage, U as gridScaleFor, L as potentialFBM, H as sampleLiquidGrid, J as useLiquidGrid };