@mkbabb/glass-ui 4.1.0 → 4.2.0

package/dist/fourier-field.js

@@ -1,15 +1,15 @@
-import { t as e } from "./_plugin-vue_export-helper-C1je1s0u.js";
-import { n as t } from "./useResolveTokenColor-vAylyR0x.js";
-import { t as n } from "./usePointerVelocityField-QLsy3_kv.js";
-import { n as r, o as i, r as a, s as o } from "./procedural-color.wgsl-m7Zgv35j.js";
-import { a as s, t as c } from "./useGpuSubstrate-4pTcp6mX.js";
-import { c as l, t as u } from "./color-Cs0-oxYL.js";
-import { t as d } from "./useGlobalDark-CmjB9E32.js";
-import { n as f, t as p } from "./prng-B-d9eYX8.js";
-import { a as m, i as h, n as g, r as _, t as v } from "./math-Eb0w3LqU.js";
+import { t as e } from "./_plugin-vue_export-helper-gLzyemvl.js";
+import { n as t } from "./useResolveTokenColor-ChOnCckA.js";
+import { t as n } from "./usePointerVelocityField-BrkqZFhj.js";
+import { n as r, o as i, r as a, s as o } from "./procedural-color.wgsl-C1Y5PkM6.js";
+import { a as s, t as c } from "./useGpuSubstrate-Ceet70xq.js";
+import { c as l, t as u } from "./color-B9jZdhJX.js";
+import { t as d } from "./useGlobalDark-B4HO9LXG.js";
+import { n as f, t as p } from "./prng-B5tIXTtj.js";
+import { a as m, i as h, n as g, r as _, t as v } from "./math-5RcIgCB4.js";
 import { computed as y, createElementBlock as b, createElementVNode as x, defineComponent as S, normalizeClass as C, onMounted as w, onScopeDispose as T, openBlock as E, shallowRef as D, useTemplateRef as O, watch as k } from "vue";
 //#region src/components/custom/fourier-field/constants.ts
-var A = 64, j = 384, M = [{
+var A = 64, j = 384, M = .15, N = .12, P = .55, F = .35, I = [{
 	L: .62,
 	C: .19,
 	h: 34
@@ -17,7 +17,7 @@ var A = 64, j = 384, M = [{
 	L: .86,
 	C: .06,
 	h: 70
-}], N = {
+}], L = {
 	source: "elliptic",
 	harmonics: 6,
 	showEpicycles: !0,
@@ -28,15 +28,23 @@ var A = 64, j = 384, M = [{
 	intensity: 1,
 	harmonicScale: .24,
 	speed: 1,
-	palette: M,
+	palette: I,
 	respectReducedMotion: !0,
-	interactive: !0
-}, P = "\nconst MAX_PHASORS: i32 = 64;\nconst TAU: f32 = 6.283185307179586;\n\nstruct Phasor {\n  // (re, im, index, _pad)\n  data: vec4<f32>,\n};\n\n// ── Compute uniforms (the typed-struct source-of-truth — see uniformBridgeWGPU.ts) ──\nstruct ComputeUniforms {\n  // c0: (headT, trailArc, _pad, _pad)\n  c0: vec4<f32>,\n  // ints: (harmonicN, epicycleArmN, sampleCount, phasorCount)\n  ints: vec4<i32>,\n};\n\n@group(0) @binding(0) var<uniform> u: ComputeUniforms;\n@group(0) @binding(1) var<storage, read> phasors: array<Phasor>;\n// curveSamples[i] = (x, y, age, _pad)\n@group(0) @binding(2) var<storage, read_write> curveSamples: array<vec4<f32>>;\n// chainTips[k] = (x, y, _pad, _pad) — the running tip after stacking phasor k\n@group(0) @binding(3) var<storage, read_write> chainTips: array<vec4<f32>>;\n\n// The PARTIAL-SUM curve point at parameter t over the first n phasors — the WGSL\n// transcription of math.ts:78-95 (partialSumAt). EXACTLY:\n//   c += vec2(re·cos − im·sin, re·sin + im·cos)  with angle = TAU·index·t.\nfn partialSumAt(t: f32, n: i32) -> vec2<f32> {\n  var c = vec2<f32>(0.0, 0.0);\n  let phasorCount = u.ints.w;\n  let lim = min(n, phasorCount);\n  for (var i = 0; i < MAX_PHASORS; i = i + 1) {\n    if (i >= lim) { break; }\n    let p = phasors[i].data;\n    let re = p.x;\n    let im = p.y;\n    let index = p.z;\n    let angle = TAU * index * t;\n    let cs = cos(angle);\n    let sn = sin(angle);\n    c = c + vec2<f32>(re * cs - im * sn, re * sn + im * cs);\n  }\n  return c;\n}\n\n// The epicycle chain tip after stacking the first k phasors at head_t — the WGSL\n// transcription of math.ts:41-60 (positionsAt, read at the running tip). The running tip\n// after phasor (k−1) is exactly the partial sum over the first k terms.\nfn epicycleChainTip(t: f32, k: i32) -> vec2<f32> {\n  return partialSumAt(t, k);\n}\n\n@compute @workgroup_size(64)\nfn cs_main(@builtin(global_invocation_id) gid: vec3<u32>) {\n  let i = i32(gid.x);\n  let headT = u.c0.x;\n  let trailArc = u.c0.y;\n  let harmonicN = u.ints.x;\n  let armN = u.ints.y;\n  let sampleCount = u.ints.z;\n\n  // ── The comet body samples ──\n  if (i < sampleCount) {\n    // age: 0 at the oldest tail (i = sampleCount−1), 1 at the head (i = 0).\n    let denom = max(f32(sampleCount - 1), 1.0);\n    let frac = f32(i) / denom;                 // 0 = head, 1 = tail\n    let age = 1.0 - frac;                       // 1 = head, 0 = tail\n    // sample back along the period from the head by trailArc.\n    var t = headT - trailArc * frac;\n    t = t - floor(t);                           // fract → [0,1)\n    let pt = partialSumAt(t, harmonicN);\n    curveSamples[i] = vec4<f32>(pt.x, pt.y, age, 0.0);\n  }\n\n  // ── The epicycle chain tips (k = 0..armN, capped to harmonicN) ──\n  // chainTips[0] is the origin; chainTips[k] is the tip after phasor (k−1).\n  let armLim = min(armN, harmonicN);\n  if (i <= armLim && i <= MAX_PHASORS) {\n    let tip = epicycleChainTip(headT, i);\n    chainTips[i] = vec4<f32>(tip.x, tip.y, 0.0, 0.0);\n  }\n}\n", F = `
+	interactive: !0,
+	squashGain: P,
+	celGain: F
+}, R = "\nconst MAX_PHASORS: i32 = 64;\nconst TAU: f32 = 6.283185307179586;\n\nstruct Phasor {\n  // (re, im, index, _pad)\n  data: vec4<f32>,\n};\n\n// ── Compute uniforms (the typed-struct source-of-truth — see uniformBridgeWGPU.ts) ──\nstruct ComputeUniforms {\n  // c0: (headT, trailArc, _pad, _pad)\n  c0: vec4<f32>,\n  // ints: (harmonicN, epicycleArmN, sampleCount, phasorCount)\n  ints: vec4<i32>,\n};\n\n@group(0) @binding(0) var<uniform> u: ComputeUniforms;\n@group(0) @binding(1) var<storage, read> phasors: array<Phasor>;\n// curveSamples[i] = (x, y, age, _pad)\n@group(0) @binding(2) var<storage, read_write> curveSamples: array<vec4<f32>>;\n// chainTips[k] = (x, y, _pad, _pad) — the running tip after stacking phasor k\n@group(0) @binding(3) var<storage, read_write> chainTips: array<vec4<f32>>;\n\n// The PARTIAL-SUM curve point at parameter t over the first n phasors — the WGSL\n// transcription of math.ts:78-95 (partialSumAt). EXACTLY:\n//   c += vec2(re·cos − im·sin, re·sin + im·cos)  with angle = TAU·index·t.\nfn partialSumAt(t: f32, n: i32) -> vec2<f32> {\n  var c = vec2<f32>(0.0, 0.0);\n  let phasorCount = u.ints.w;\n  let lim = min(n, phasorCount);\n  for (var i = 0; i < MAX_PHASORS; i = i + 1) {\n    if (i >= lim) { break; }\n    let p = phasors[i].data;\n    let re = p.x;\n    let im = p.y;\n    let index = p.z;\n    let angle = TAU * index * t;\n    let cs = cos(angle);\n    let sn = sin(angle);\n    c = c + vec2<f32>(re * cs - im * sn, re * sn + im * cs);\n  }\n  return c;\n}\n\n// The epicycle chain tip after stacking the first k phasors at head_t — the WGSL\n// transcription of math.ts:41-60 (positionsAt, read at the running tip). The running tip\n// after phasor (k−1) is exactly the partial sum over the first k terms.\nfn epicycleChainTip(t: f32, k: i32) -> vec2<f32> {\n  return partialSumAt(t, k);\n}\n\n@compute @workgroup_size(64)\nfn cs_main(@builtin(global_invocation_id) gid: vec3<u32>) {\n  let i = i32(gid.x);\n  let headT = u.c0.x;\n  let trailArc = u.c0.y;\n  let harmonicN = u.ints.x;\n  let armN = u.ints.y;\n  let sampleCount = u.ints.z;\n\n  // ── The comet body samples ──\n  if (i < sampleCount) {\n    // age: 0 at the oldest tail (i = sampleCount−1), 1 at the head (i = 0).\n    let denom = max(f32(sampleCount - 1), 1.0);\n    let frac = f32(i) / denom;                 // 0 = head, 1 = tail\n    let age = 1.0 - frac;                       // 1 = head, 0 = tail\n    // sample back along the period from the head by trailArc.\n    var t = headT - trailArc * frac;\n    t = t - floor(t);                           // fract → [0,1)\n    let pt = partialSumAt(t, harmonicN);\n    curveSamples[i] = vec4<f32>(pt.x, pt.y, age, 0.0);\n  }\n\n  // ── The epicycle chain tips (k = 0..armN, capped to harmonicN) ──\n  // chainTips[0] is the origin; chainTips[k] is the tip after phasor (k−1).\n  let armLim = min(armN, harmonicN);\n  if (i <= armLim && i <= MAX_PHASORS) {\n    let tip = epicycleChainTip(headT, i);\n    chainTips[i] = vec4<f32>(tip.x, tip.y, 0.0, 0.0);\n  }\n}\n", z = `
 const PI: f32 = 3.141592653589793;
 const TAU: f32 = 6.283185307179586;
 const MAX_CURVE_SAMPLES: i32 = 384;
 const MAX_PHASORS: i32 = 64;
 const MAX_FOURIER_STOPS: i32 = 4;
+// BD.W-FOURIER-LOOM §2b — the degenerate-tangent guard (must equal FOURIER_TANGENT_EPS in
+// constants.ts + the GL CPU bead path so a cusp resolves IDENTICALLY across both engines).
+const TANGENT_EPS: f32 = 1e-4;
+// The speed yardstick: the head speed (model units between curveSamples[0] and [1]) is
+// normalized against this many trail half-widths so ŝ ∈ [0,1] is scale-free + parity-safe.
+const SPEED_REF_HALFWIDTHS: f32 = 6.0;
 
 // ── Render uniforms (the typed-struct source-of-truth — see uniformBridgeWGPU.ts) ──
 struct RenderUniforms {
@@ -46,6 +54,8 @@ struct RenderUniforms {
   r1: vec4<f32>,
   // r2: (trailFloor, intensity, showEpicycles, rainbowChain)
   r2: vec4<f32>,
+  // r3: (squashGain, celGain, _pad, _pad) — FOURIER-LOOM §2b/§3b
+  r3: vec4<f32>,
   // ints: (sampleCount, armCount, stopCount, _pad)
   ints: vec4<i32>,
   // palette stops: linear-sRGB rgb + _pad
@@ -97,6 +107,37 @@ fn segDist(p: vec2<f32>, a: vec2<f32>, b: vec2<f32>) -> f32 {
   return length(pa - ba * h);
 }
 
+// BD.W-FOURIER-LOOM §2b — the head travel frame: the unit tangent T from curveSamples[0]
+// (head) vs [1] (one step back) + the normalized speed ŝ ∈ [0,1]. The cusp guard returns
+// the +x axis as the stable fallback when s ≤ TANGENT_EPS, identical to the GL CPU path.
+struct HeadFrame { T: vec2<f32>, sHat: f32, };
+fn headFrame(head: vec2<f32>, headBack: vec2<f32>, halfW: f32) -> HeadFrame {
+  let d = head - headBack;
+  let s = length(d);
+  var out: HeadFrame;
+  if (s <= TANGENT_EPS) {
+    out.T = vec2<f32>(1.0, 0.0);
+    out.sHat = 0.0;
+    return out;
+  }
+  out.T = d / s;
+  let refScale = max(halfW * SPEED_REF_HALFWIDTHS, 1e-6);
+  out.sHat = clamp(s / refScale, 0.0, 1.0);
+  return out;
+}
+
+// The volume-preserving anisotropic head distance: project (p − head) onto T and T⊥, stretch
+// the tangent extent by (1 + k·ŝ) and squeeze the normal extent by 1/(1 + k·ŝ), then length.
+// k = 0 (or ŝ = 0) collapses to the round disc length(p − head) — byte-frozen at rest.
+fn headAniso(p: vec2<f32>, head: vec2<f32>, fr: HeadFrame, k: f32) -> f32 {
+  let g = 1.0 + k * fr.sHat;
+  let n = vec2<f32>(-fr.T.y, fr.T.x);
+  let rel = p - head;
+  let along = dot(rel, fr.T) / g;
+  let across = dot(rel, n) * g;
+  return length(vec2<f32>(along, across));
+}
+
 struct VSOut {
   @builtin(position) pos: vec4<f32>,
   @location(0) model: vec2<f32>,   // model-space coordinate of this fragment
@@ -137,10 +178,53 @@ fn fs_main(in: VSOut) -> @location(0) vec4<f32> {
   let armCount = u.ints.y;
   let showEpicycles = u.r2.z > 0.5;
   let rainbow = u.r2.w > 0.5;
+  let squashGain = u.r3.x;                 // FOURIER-LOOM §2b
+  let celGain = u.r3.y;                    // FOURIER-LOOM §3b
   let halfW = trailWidth * 0.5;
 
+  // BD.W-FOURIER-LOOM §2b — the head travel frame (the SAME curveSamples[0]/[1] both engines
+  // read → parity by construction). The cel offset (§3b) rides −T (opposite travel).
+  var headFr: HeadFrame;
+  headFr.T = vec2<f32>(1.0, 0.0);
+  headFr.sHat = 0.0;
+  if (sampleCount >= 2) {
+    headFr = headFrame(curveSamples[0].xy, curveSamples[1].xy, halfW);
+  }
+  let celOff = -headFr.T * halfW * 1.4;    // the ink lags behind the travel
+
   var accum = vec4<f32>(0.0);              // premultiplied accumulation
 
+  // ── §3b — the cartoon CEL-SHADOW: a darker offset copy of the chain + rope, opposite
+  //    travel, painted FIRST (it sits UNDER the lit chain). PRM-static (the frozen-T travel
+  //    frame is a fixed offset, no live sweep). celGain = 0 → no pass (byte-frozen). ──
+  if (celGain > 0.001) {
+    let ink = vec3<f32>(0.0);              // pure ink — the technicolor 2-tone shadow
+    let celA = clamp(celGain, 0.0, 1.0);
+    // the rope cel (one offset distance-to-curve band).
+    for (var i = 0; i < MAX_CURVE_SAMPLES; i = i + 1) {
+      if (i >= sampleCount - 1) { break; }
+      let sa = curveSamples[i].xy + celOff;
+      let sb = curveSamples[i + 1].xy + celOff;
+      let d = segDist(p, sa, sb);
+      let cover = 1.0 - smoothstep(halfW, halfW + aa, d);
+      if (cover < 0.002) { continue; }
+      let m = cover * celA * peak;
+      accum = vec4<f32>(ink * m, m) + accum * (1.0 - m);
+    }
+    // the chain cel (arms only — the bold scaffold ink).
+    if (showEpicycles && armCount >= 1) {
+      for (var k = 0; k < MAX_PHASORS; k = k + 1) {
+        if (k >= armCount) { break; }
+        let a = chainTips[k].xy + celOff;
+        let b = chainTips[k + 1].xy + celOff;
+        let dArm = segDist(p, a, b);
+        let armMask = 1.0 - smoothstep(halfW * 0.55, halfW * 0.55 + aa, dArm);
+        let m = armMask * celA * peak * 0.7;
+        accum = vec4<f32>(ink * m, m) + accum * (1.0 - m);
+      }
+    }
+  }
+
   // ── Epicycle scaffolding (orbit rings + arms + joint dots) UNDER the curve ──
   if (showEpicycles && armCount >= 1) {
     for (var k = 0; k < MAX_PHASORS; k = k + 1) {
@@ -185,10 +269,12 @@ fn fs_main(in: VSOut) -> @location(0) vec4<f32> {
     accum = vec4<f32>(rgb * a, a) + accum * (1.0 - a);
   }
 
-  // ── The comet HEAD — halo + saturated core + white specular at curveSamples[0] ──
+  // ── The comet HEAD — squash-and-stretch (§2b) halo + saturated core + white specular.
+  //    dHead is the volume-preserving anisotropic distance off the travel frame; at rest
+  //    (sHat=0) or squashGain=0 it collapses to the round disc length(p − head). ──
   if (sampleCount >= 1) {
     let head = curveSamples[0].xy;
-    let dHead = length(p - head);
+    let dHead = headAniso(p, head, headFr, squashGain);
     let coreR = halfW * 1.5;
     let haloR = coreR * 3.0;
     let headLin = samplePaletteLin(0.0);
@@ -206,11 +292,11 @@ fn fs_main(in: VSOut) -> @location(0) vec4<f32> {
 
   return accum;
 }
-`, I = {
+`, B = {
 	c0: 0,
 	ints: 4
 };
-function L() {
+function V() {
 	let e = /* @__PURE__ */ new ArrayBuffer(32);
 	return {
 		buffer: e,
@@ -218,26 +304,27 @@ function L() {
 		i32: new Int32Array(e)
 	};
 }
-function R(e, t, n, r, i, a, o) {
+function H(e, t, n, r, i, a, o) {
 	let { f32: s, i32: c } = e;
-	return s[I.c0 + 0] = t, s[I.c0 + 1] = n, s[I.c0 + 2] = 0, s[I.c0 + 3] = 0, c[I.ints + 0] = r, c[I.ints + 1] = i, c[I.ints + 2] = a, c[I.ints + 3] = o, e;
+	return s[B.c0 + 0] = t, s[B.c0 + 1] = n, s[B.c0 + 2] = 0, s[B.c0 + 3] = 0, c[B.ints + 0] = r, c[B.ints + 1] = i, c[B.ints + 2] = a, c[B.ints + 3] = o, e;
 }
-var z = 128, B = {
+var U = 144, W = {
 	r0: 0,
 	r1: 4,
 	r2: 8,
-	ints: 12,
-	palette: 16
+	r3: 12,
+	ints: 16,
+	palette: 20
 };
-function V() {
-	let e = new ArrayBuffer(z);
+function G() {
+	let e = new ArrayBuffer(U);
 	return {
 		buffer: e,
 		f32: new Float32Array(e),
 		i32: new Int32Array(e)
 	};
 }
-function H(e) {
+function K(e) {
 	let t = Infinity, n = Infinity, r = -Infinity, i = -Infinity, a = e;
 	for (let e = 0; e < 720; e++) {
 		let o = m(a, e / 720), [s, c] = o[o.length - 1];
@@ -255,22 +342,29 @@ function H(e) {
 		scale: c
 	};
 }
-function U(e, t, n) {
+function ee(e, t, n, r) {
+	let i = Math.max(r, 1e-4), a = (e - n.centerX) * n.scale / i, o = (t - n.centerY) * n.scale;
+	return {
+		x: a * .5 + .5,
+		y: 1 - (o * .5 + .5)
+	};
+}
+function q(e, t, n) {
 	let r = Math.max(n, 1) / 2;
 	return e / Math.max(t, 1e-6) / r;
 }
-function W(e, t, n, r, i, a, o, s, c, u, d, f, p, m) {
-	let { f32: h, i32: g } = e;
-	h[B.r0 + 0] = t.centerX, h[B.r0 + 1] = t.centerY, h[B.r0 + 2] = t.scale, h[B.r0 + 3] = n, h[B.r1 + 0] = r, h[B.r1 + 1] = i, h[B.r1 + 2] = a, h[B.r1 + 3] = o, h[B.r2 + 0] = s, h[B.r2 + 1] = c, h[B.r2 + 2] = +!!u, h[B.r2 + 3] = +!!d;
-	let _ = Math.min(m.length, 4);
-	g[B.ints + 0] = f, g[B.ints + 1] = p, g[B.ints + 2] = _, g[B.ints + 3] = 0;
+function te(e, t, n, r, i, a, o, s, c, u, d, f, p, m, h, g) {
+	let { f32: _, i32: v } = e;
+	_[W.r0 + 0] = t.centerX, _[W.r0 + 1] = t.centerY, _[W.r0 + 2] = t.scale, _[W.r0 + 3] = n, _[W.r1 + 0] = r, _[W.r1 + 1] = i, _[W.r1 + 2] = a, _[W.r1 + 3] = o, _[W.r2 + 0] = s, _[W.r2 + 1] = c, _[W.r2 + 2] = +!!u, _[W.r2 + 3] = +!!d, _[W.r3 + 0] = f, _[W.r3 + 1] = p, _[W.r3 + 2] = 0, _[W.r3 + 3] = 0;
+	let y = Math.min(g.length, 4);
+	v[W.ints + 0] = m, v[W.ints + 1] = h, v[W.ints + 2] = y, v[W.ints + 3] = 0;
 	for (let e = 0; e < 4; e++) {
-		let t = B.palette + e * 4, n = l(m[Math.min(e, _ - 1)] ?? m[0]);
-		h[t + 0] = n[0], h[t + 1] = n[1], h[t + 2] = n[2], h[t + 3] = 0;
+		let t = W.palette + e * 4, n = l(g[Math.min(e, y - 1)] ?? g[0]);
+		_[t + 0] = n[0], _[t + 1] = n[1], _[t + 2] = n[2], _[t + 3] = 0;
 	}
 	return e;
 }
-function ee(e) {
+function ne(e) {
 	let t = Math.min(e.length, 64), n = new Float32Array(256);
 	for (let r = 0; r < t; r++) {
 		let t = e[r], i = r * 4;
@@ -280,119 +374,119 @@ function ee(e) {
 }
 //#endregion
 //#region src/components/custom/fourier-field/composables/fourierFieldWGPUSetup.ts
-var G = 64, K = 128, q = 8, te = 1, J = 2, Y = 4, ne = 64, re = .92, ie = .95, ae = 1.35, oe = .34;
-function se(e) {
-	let { canvas: t, config: n, getSpectrum: r, getPalette: i, getHeadT: a, shouldContinue: o, onFrame: c } = e;
-	return function(e, l, u) {
-		let d = e.createShaderModule({
+var J = 64, Y = 128, X = 8, re = 1, Z = 2, Q = 4, ie = 64, ae = .92, oe = .95, se = 1.35, ce = .34;
+function le(e) {
+	let { canvas: t, config: n, getSpectrum: r, getPalette: i, getHeadT: a, shouldContinue: o, onFrame: c } = e, l = e.getPointerLean;
+	return function(e, u, d) {
+		let f = e.createShaderModule({
 			label: "[FourierField] fourier-field.compute.wgsl",
-			code: P
-		}), f = e.createShaderModule({
+			code: R
+		}), p = e.createShaderModule({
 			label: "[FourierField] fourier-field.render.wgsl",
-			code: F
-		}), p = e.createBuffer({
+			code: z
+		}), m = e.createBuffer({
 			label: "[FourierField] phasors",
 			size: 1024,
-			usage: K | q
-		}), m = e.createBuffer({
+			usage: Y | X
+		}), h = e.createBuffer({
 			label: "[FourierField] curve-samples",
 			size: 384 * 16,
-			usage: K
-		}), h = e.createBuffer({
+			usage: Y
+		}), g = e.createBuffer({
 			label: "[FourierField] chain-tips",
 			size: 1040,
-			usage: K
-		}), g = e.createBuffer({
-			label: "[FourierField] compute-uniforms",
-			size: L().buffer.byteLength,
-			usage: G | q
+			usage: Y
 		}), _ = e.createBuffer({
-			label: "[FourierField] render-uniforms",
+			label: "[FourierField] compute-uniforms",
 			size: V().buffer.byteLength,
-			usage: G | q
-		}), v = e.createBindGroupLayout({
+			usage: J | X
+		}), v = e.createBuffer({
+			label: "[FourierField] render-uniforms",
+			size: G().buffer.byteLength,
+			usage: J | X
+		}), y = e.createBindGroupLayout({
 			label: "[FourierField] compute-bgl",
 			entries: [
 				{
 					binding: 0,
-					visibility: Y,
+					visibility: Q,
 					buffer: { type: "uniform" }
 				},
 				{
 					binding: 1,
-					visibility: Y,
+					visibility: Q,
 					buffer: { type: "read-only-storage" }
 				},
 				{
 					binding: 2,
-					visibility: Y,
+					visibility: Q,
 					buffer: { type: "storage" }
 				},
 				{
 					binding: 3,
-					visibility: Y,
+					visibility: Q,
 					buffer: { type: "storage" }
 				}
 			]
-		}), y = e.createComputePipeline({
+		}), b = e.createComputePipeline({
 			label: "[FourierField] compute-pipeline",
-			layout: e.createPipelineLayout({ bindGroupLayouts: [v] }),
+			layout: e.createPipelineLayout({ bindGroupLayouts: [y] }),
 			compute: {
-				module: d,
+				module: f,
 				entryPoint: "cs_main"
 			}
-		}), b = e.createBindGroup({
+		}), x = e.createBindGroup({
 			label: "[FourierField] compute-bg",
-			layout: v,
+			layout: y,
 			entries: [
 				{
 					binding: 0,
-					resource: { buffer: g }
+					resource: { buffer: _ }
 				},
 				{
 					binding: 1,
-					resource: { buffer: p }
+					resource: { buffer: m }
 				},
 				{
 					binding: 2,
-					resource: { buffer: m }
+					resource: { buffer: h }
 				},
 				{
 					binding: 3,
-					resource: { buffer: h }
+					resource: { buffer: g }
 				}
 			]
-		}), x = e.createBindGroupLayout({
+		}), S = e.createBindGroupLayout({
 			label: "[FourierField] render-bgl",
 			entries: [
 				{
 					binding: 0,
-					visibility: te | J,
+					visibility: re | Z,
 					buffer: { type: "uniform" }
 				},
 				{
 					binding: 1,
-					visibility: J,
+					visibility: Z,
 					buffer: { type: "read-only-storage" }
 				},
 				{
 					binding: 2,
-					visibility: J,
+					visibility: Z,
 					buffer: { type: "read-only-storage" }
 				}
 			]
-		}), S = e.createRenderPipeline({
+		}), C = e.createRenderPipeline({
 			label: "[FourierField] render-pipeline",
-			layout: e.createPipelineLayout({ bindGroupLayouts: [x] }),
+			layout: e.createPipelineLayout({ bindGroupLayouts: [S] }),
 			vertex: {
-				module: f,
+				module: p,
 				entryPoint: "vs_main"
 			},
 			fragment: {
-				module: f,
+				module: p,
 				entryPoint: "fs_main",
 				targets: [{
-					format: u,
+					format: d,
 					blend: {
 						color: {
 							srcFactor: "one",
@@ -408,46 +502,53 @@ function se(e) {
 				}]
 			},
 			primitive: { topology: "triangle-list" }
-		}), C = e.createBindGroup({
+		}), w = e.createBindGroup({
 			label: "[FourierField] render-bg",
-			layout: x,
+			layout: S,
 			entries: [
 				{
 					binding: 0,
-					resource: { buffer: _ }
+					resource: { buffer: v }
 				},
 				{
 					binding: 1,
-					resource: { buffer: m }
+					resource: { buffer: h }
 				},
 				{
 					binding: 2,
-					resource: { buffer: h }
+					resource: { buffer: g }
 				}
 			]
-		}), w = L(), T = V(), E = null, D = {
+		}), T = V(), E = G(), D = null, O = {
 			centerX: 0,
 			centerY: 0,
 			scale: 1
-		}, O = 0;
-		function k() {
+		}, k = 0;
+		function A() {
 			let t = r();
-			t !== E && (E = t, O = Math.min(t.length, 64), D = H(t), e.queue.writeBuffer(p, 0, ee(t)));
+			t !== D && (D = t, k = Math.min(t.length, 64), O = K(t), e.queue.writeBuffer(m, 0, ne(t)));
 		}
-		function A() {
+		function j() {
 			let e = s(), n = t.clientWidth || 320, r = t.clientHeight || 320, i = Math.max(1, Math.round(n * e)), a = Math.max(1, Math.round(r * e));
 			(t.width !== i || t.height !== a) && (t.width = i, t.height = a);
 		}
-		function j(r) {
-			c?.(r), k();
-			let o = a(), s = Math.max(1, Math.min(Math.round(n.harmonics), O)), u = n.showEpicycles ? Math.max(1, Math.min(Math.round(n.epicycleArms), s)) : 0;
-			R(w, o, n.trailArc, s, u, 384, O), e.queue.writeBuffer(g, 0, w.buffer);
-			let d = Math.min(t.clientWidth || 320, t.clientHeight || 320), f = (t.clientWidth || 320) / Math.max(t.clientHeight || 320, 1), p = U(n.trailWidth, D.scale, d);
-			W(T, D, f, p, re, ie, ae, oe, n.intensity, n.showEpicycles, n.rainbowChain, 384, u, i()), e.queue.writeBuffer(_, 0, T.buffer);
-			let m = e.createCommandEncoder({ label: "[FourierField] frame" }), h = m.beginComputePass();
-			h.setPipeline(y), h.setBindGroup(0, b), h.dispatchWorkgroups(Math.ceil(384 / ne)), h.end();
-			let v = l.getCurrentTexture().createView(), x = m.beginRenderPass({ colorAttachments: [{
-				view: v,
+		function M(r) {
+			c?.(r), A();
+			let o = a(), s = Math.max(1, Math.min(Math.round(n.harmonics), k)), d = n.showEpicycles ? Math.max(1, Math.min(Math.round(n.epicycleArms), s)) : 0;
+			H(T, o, n.trailArc, s, d, 384, k), e.queue.writeBuffer(_, 0, T.buffer);
+			let f = Math.min(t.clientWidth || 320, t.clientHeight || 320), p = (t.clientWidth || 320) / Math.max(t.clientHeight || 320, 1), m = q(n.trailWidth, O.scale, f), h = l?.() ?? {
+				x: 0,
+				y: 0
+			};
+			te(E, h.x !== 0 || h.y !== 0 ? {
+				...O,
+				centerX: O.centerX - h.x,
+				centerY: O.centerY - h.y
+			} : O, p, m, ae, oe, se, ce, n.intensity, n.showEpicycles, n.rainbowChain, n.squashGain, n.celGain, 384, d, i()), e.queue.writeBuffer(v, 0, E.buffer);
+			let g = e.createCommandEncoder({ label: "[FourierField] frame" }), y = g.beginComputePass();
+			y.setPipeline(b), y.setBindGroup(0, x), y.dispatchWorkgroups(Math.ceil(384 / ie)), y.end();
+			let S = u.getCurrentTexture().createView(), D = g.beginRenderPass({ colorAttachments: [{
+				view: S,
 				clearValue: {
 					r: 0,
 					g: 0,
@@ -457,25 +558,28 @@ function se(e) {
 				loadOp: "clear",
 				storeOp: "store"
 			}] });
-			x.setPipeline(S), x.setBindGroup(0, C), x.draw(3, 1, 0, 0), x.end(), e.queue.submit([m.finish()]);
+			D.setPipeline(C), D.setBindGroup(0, w), D.draw(3, 1, 0, 0), D.end(), e.queue.submit([g.finish()]);
 		}
 		return {
-			frame: j,
+			frame: M,
 			shouldContinue: o,
-			resize: A,
+			resize: j,
 			teardown: () => {
-				p.destroy(), m.destroy(), h.destroy(), g.destroy(), _.destroy();
+				m.destroy(), h.destroy(), g.destroy(), _.destroy(), v.destroy();
 			}
 		};
 	};
 }
 //#endregion
 //#region src/components/custom/fourier-field/shaders/fourier-field.glsl.ts
-var ce = "#version 300 es\nin vec2 aPosition;\nout vec2 vClip;\nvoid main() {\n  vClip = aPosition;\n  gl_Position = vec4(aPosition, 0.0, 1.0);\n}\n", le = `#version 300 es
+var ue = "#version 300 es\nin vec2 aPosition;\nout vec2 vClip;\nvoid main() {\n  vClip = aPosition;\n  gl_Position = vec4(aPosition, 0.0, 1.0);\n}\n", de = `#version 300 es
 precision highp float;
 
 #define MAX_CURVE_SAMPLES 256
 #define MAX_PHASORS 64
+// BD.W-FOURIER-LOOM §2b — MUST equal the WGSL twin + FOURIER_TANGENT_EPS (constants.ts).
+#define TANGENT_EPS 1e-4
+#define SPEED_REF_HALFWIDTHS 6.0
 
 in vec2 vClip;
 out vec4 fragColor;
@@ -483,6 +587,7 @@ out vec4 fragColor;
 uniform vec4 uFit;          // (centerX, centerY, scale, aspect)
 uniform vec4 uTrail;        // (trailWidth, peakAlpha, headGlowAlpha, trailFadeExp)
 uniform vec4 uEnv;          // (trailFloor, intensity, showEpicycles, rainbowChain)
+uniform vec4 uLoom;         // (squashGain, celGain, _pad, _pad) — FOURIER-LOOM §2b/§3b
 uniform int  uSampleCount;
 uniform int  uArmCount;
 uniform int  uStopCount;
@@ -528,6 +633,31 @@ float segDist(vec2 p, vec2 a, vec2 b) {
   return length(pa - ba * h);
 }
 
+// BD.W-FOURIER-LOOM §2b — the head travel frame (T, ŝ), the GLSL twin of the WGSL headFrame.
+// The cusp guard returns +x as the stable fallback when s ≤ TANGENT_EPS — identical to the
+// WGSL twin + the CPU bead path.
+struct HeadFrame { vec2 T; float sHat; };
+HeadFrame headFrame(vec2 head, vec2 headBack, float halfW) {
+  vec2 d = head - headBack;
+  float s = length(d);
+  HeadFrame fr;
+  if (s <= TANGENT_EPS) { fr.T = vec2(1.0, 0.0); fr.sHat = 0.0; return fr; }
+  fr.T = d / s;
+  float refScale = max(halfW * SPEED_REF_HALFWIDTHS, 1e-6);
+  fr.sHat = clamp(s / refScale, 0.0, 1.0);
+  return fr;
+}
+
+// The volume-preserving anisotropic head distance (the WGSL headAniso twin).
+float headAniso(vec2 p, vec2 head, HeadFrame fr, float k) {
+  float g = 1.0 + k * fr.sHat;
+  vec2 n = vec2(-fr.T.y, fr.T.x);
+  vec2 rel = p - head;
+  float along = dot(rel, fr.T) / g;
+  float across = dot(rel, n) * g;
+  return length(vec2(along, across));
+}
+
 void main() {
   vec2 center = uFit.xy;
   float scale = max(uFit.z, 1e-6);
@@ -543,10 +673,49 @@ void main() {
   float trailFloor = uEnv.x;
   bool showEpicycles = uEnv.z > 0.5;
   bool rainbow = uEnv.w > 0.5;
+  float squashGain = uLoom.x;            // FOURIER-LOOM §2b
+  float celGain = uLoom.y;               // FOURIER-LOOM §3b
   float halfW = trailWidth * 0.5;
 
+  // §2b — the head travel frame (SAME uCurve[0]/[1] the WGSL twin reads → parity).
+  HeadFrame headFr;
+  headFr.T = vec2(1.0, 0.0);
+  headFr.sHat = 0.0;
+  if (uSampleCount >= 2) {
+    headFr = headFrame(uCurve[0].xy, uCurve[1].xy, halfW);
+  }
+  vec2 celOff = -headFr.T * halfW * 1.4;
+
   vec4 accum = vec4(0.0);
 
+  // §3b — the cartoon CEL-SHADOW: a darker offset copy of the rope + chain, opposite travel,
+  // painted FIRST (under the lit chain). PRM-static; celGain = 0 → no pass (byte-frozen).
+  if (celGain > 0.001) {
+    vec3 ink = vec3(0.0);
+    float celA = clamp(celGain, 0.0, 1.0);
+    for (int i = 0; i < MAX_CURVE_SAMPLES; i++) {
+      if (i >= uSampleCount - 1) break;
+      vec2 sa = uCurve[i].xy + celOff;
+      vec2 sb = uCurve[i + 1].xy + celOff;
+      float d = segDist(p, sa, sb);
+      float cover = 1.0 - smoothstep(halfW, halfW + aa, d);
+      if (cover < 0.002) continue;
+      float m = cover * celA * peak;
+      accum = vec4(ink * m, m) + accum * (1.0 - m);
+    }
+    if (showEpicycles && uArmCount >= 1) {
+      for (int k = 0; k < MAX_PHASORS; k++) {
+        if (k >= uArmCount) break;
+        vec2 a = uChain[k] + celOff;
+        vec2 b = uChain[k + 1] + celOff;
+        float dArm = segDist(p, a, b);
+        float armMask = 1.0 - smoothstep(halfW * 0.55, halfW * 0.55 + aa, dArm);
+        float m = armMask * celA * peak * 0.7;
+        accum = vec4(ink * m, m) + accum * (1.0 - m);
+      }
+    }
+  }
+
   if (showEpicycles && uArmCount >= 1) {
     for (int k = 0; k < MAX_PHASORS; k++) {
       if (k >= uArmCount) break;
@@ -586,7 +755,8 @@ void main() {
 
   if (uSampleCount >= 1) {
     vec2 head = uCurve[0].xy;
-    float dHead = length(p - head);
+    // §2b — the squash-and-stretch anisotropic head (collapses to the round disc at rest).
+    float dHead = headAniso(p, head, headFr, squashGain);
     float coreR = halfW * 1.5;
     float haloR = coreR * 3.0;
     vec3 headRgb = clamp(linearToSrgb(samplePaletteLin(0.0)), vec3(0.0), vec3(1.0));
@@ -600,8 +770,8 @@ void main() {
 
   fragColor = accum;
 }
-`, X = 256, Z = 64, ue = .92, de = .95, fe = 1.35, pe = .34;
-function Q(e, t, n) {
+`, fe = 256, $ = 64, pe = .92, me = .95, he = 1.35, ge = .34;
+function _e(e, t, n) {
 	let r = e.createShader(t);
 	if (e.shaderSource(r, n), e.compileShader(r), !e.getShaderParameter(r, e.COMPILE_STATUS)) {
 		let t = e.getShaderInfoLog(r);
@@ -609,16 +779,16 @@ function Q(e, t, n) {
 	}
 	return r;
 }
-function me(e) {
-	let { canvas: t, config: n, getSpectrum: r, getPalette: i, getHeadT: a, shouldContinue: o, onFrame: c } = e;
+function ve(e) {
+	let { canvas: t, config: n, getSpectrum: r, getPalette: i, getHeadT: a, shouldContinue: o, onFrame: c } = e, u = e.getPointerLean;
 	return function(e) {
-		let u = Q(e, e.VERTEX_SHADER, ce), d = Q(e, e.FRAGMENT_SHADER, le), f = e.createProgram();
-		if (e.attachShader(f, u), e.attachShader(f, d), e.linkProgram(f), !e.getProgramParameter(f, e.LINK_STATUS)) throw Error(`[FourierField] link failed: ${e.getProgramInfoLog(f)}`);
-		e.deleteShader(u), e.deleteShader(d);
-		let p = e.createVertexArray();
-		e.bindVertexArray(p);
-		let m = e.createBuffer();
-		e.bindBuffer(e.ARRAY_BUFFER, m), e.bufferData(e.ARRAY_BUFFER, new Float32Array([
+		let d = _e(e, e.VERTEX_SHADER, ue), f = _e(e, e.FRAGMENT_SHADER, de), p = e.createProgram();
+		if (e.attachShader(p, d), e.attachShader(p, f), e.linkProgram(p), !e.getProgramParameter(p, e.LINK_STATUS)) throw Error(`[FourierField] link failed: ${e.getProgramInfoLog(p)}`);
+		e.deleteShader(d), e.deleteShader(f);
+		let m = e.createVertexArray();
+		e.bindVertexArray(m);
+		let g = e.createBuffer();
+		e.bindBuffer(e.ARRAY_BUFFER, g), e.bufferData(e.ARRAY_BUFFER, new Float32Array([
 			-1,
 			-1,
 			3,
@@ -626,141 +796,195 @@ function me(e) {
 			-1,
 			3
 		]), e.STATIC_DRAW);
-		let g = e.getAttribLocation(f, "aPosition");
-		e.enableVertexAttribArray(g), e.vertexAttribPointer(g, 2, e.FLOAT, !1, 0, 0), e.bindVertexArray(null);
-		let _ = (t) => e.getUniformLocation(f, t), v = _("uFit"), y = _("uTrail"), b = _("uEnv"), x = _("uSampleCount"), S = _("uArmCount"), C = _("uStopCount"), w = _("uPalette[0]"), T = _("uCurve[0]"), E = _("uChain[0]"), D = new Float32Array(X * 3), O = new Float32Array((Z + 1) * 2), k = new Float32Array(12), A = null, j = {
+		let _ = e.getAttribLocation(p, "aPosition");
+		e.enableVertexAttribArray(_), e.vertexAttribPointer(_, 2, e.FLOAT, !1, 0, 0), e.bindVertexArray(null);
+		let v = (t) => e.getUniformLocation(p, t), y = v("uFit"), b = v("uTrail"), x = v("uEnv"), S = v("uLoom"), C = v("uSampleCount"), w = v("uArmCount"), T = v("uStopCount"), E = v("uPalette[0]"), D = v("uCurve[0]"), O = v("uChain[0]"), k = new Float32Array(fe * 3), A = new Float32Array(($ + 1) * 2), j = new Float32Array(12), M = null, N = {
 			centerX: 0,
 			centerY: 0,
 			scale: 1
-		}, M = 0;
-		function N() {
+		}, P = 0;
+		function F() {
 			let e = r();
-			e !== A && (A = e, M = Math.min(e.length, Z), j = H(e));
+			e !== M && (M = e, P = Math.min(e.length, $), N = K(e));
 		}
-		function P() {
+		function I() {
 			let n = s(), r = t.clientWidth || 320, i = t.clientHeight || 320, a = Math.max(1, Math.round(r * n)), o = Math.max(1, Math.round(i * n));
 			(t.width !== a || t.height !== o) && (t.width = a, t.height = o), e.viewport(0, 0, t.width, t.height);
 		}
-		function F(r) {
-			c?.(r), N();
-			let o = A;
+		function L(r) {
+			c?.(r), F();
+			let o = M;
 			if (!o) return;
-			let s = a(), u = Math.max(1, Math.min(Math.round(n.harmonics), M)), d = n.showEpicycles ? Math.max(1, Math.min(Math.round(n.epicycleArms), u)) : 0, m = X, g = Math.max(m - 1, 1);
-			for (let e = 0; e < m; e++) {
-				let t = e / g, r = 1 - t, i = s - n.trailArc * t;
+			let s = a(), d = Math.max(1, Math.min(Math.round(n.harmonics), P)), f = n.showEpicycles ? Math.max(1, Math.min(Math.round(n.epicycleArms), d)) : 0, g = fe, _ = Math.max(g - 1, 1);
+			for (let e = 0; e < g; e++) {
+				let t = e / _, r = 1 - t, i = s - n.trailArc * t;
 				i -= Math.floor(i);
-				let [a, c] = h(o, i, u), l = e * 3;
-				D[l + 0] = a, D[l + 1] = c, D[l + 2] = r;
+				let [a, c] = h(o, i, d), l = e * 3;
+				k[l + 0] = a, k[l + 1] = c, k[l + 2] = r;
 			}
-			let _ = Math.min(d, u);
-			for (let e = 0; e <= Z; e++) {
+			let v = Math.min(f, d);
+			for (let e = 0; e <= $; e++) {
 				let t = e * 2;
-				if (e <= _) {
+				if (e <= v) {
 					let [n, r] = h(o, s, e);
-					O[t + 0] = n, O[t + 1] = r;
-				} else O[t + 0] = 0, O[t + 1] = 0;
+					A[t + 0] = n, A[t + 1] = r;
+				} else A[t + 0] = 0, A[t + 1] = 0;
 			}
-			let P = t.clientWidth || 320, F = t.clientHeight || 320, I = Math.min(P, F), L = P / Math.max(F, 1), R = U(n.trailWidth, j.scale, I), z = i(), B = Math.min(z.length, 4);
+			let I = t.clientWidth || 320, L = t.clientHeight || 320, R = Math.min(I, L), z = I / Math.max(L, 1), B = q(n.trailWidth, N.scale, R), V = i(), H = Math.min(V.length, 4);
 			for (let e = 0; e < 4; e++) {
-				let t = l(z[Math.min(e, B - 1)] ?? z[0]);
-				k[e * 3 + 0] = t[0], k[e * 3 + 1] = t[1], k[e * 3 + 2] = t[2];
+				let t = l(V[Math.min(e, H - 1)] ?? V[0]);
+				j[e * 3 + 0] = t[0], j[e * 3 + 1] = t[1], j[e * 3 + 2] = t[2];
 			}
-			e.useProgram(f), e.bindVertexArray(p), 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.uniform4f(v, j.centerX, j.centerY, j.scale, L), e.uniform4f(y, R, ue, de, fe), e.uniform4f(b, pe, n.intensity, +!!n.showEpicycles, +!!n.rainbowChain), e.uniform1i(x, m), e.uniform1i(S, d), e.uniform1i(C, B), e.uniform3fv(w, k), e.uniform3fv(T, D), e.uniform2fv(E, O), e.drawArrays(e.TRIANGLES, 0, 3);
+			e.useProgram(p), e.bindVertexArray(m), 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);
+			let U = u?.() ?? {
+				x: 0,
+				y: 0
+			};
+			e.uniform4f(y, N.centerX - U.x, N.centerY - U.y, N.scale, z), e.uniform4f(b, B, pe, me, he), e.uniform4f(x, ge, n.intensity, +!!n.showEpicycles, +!!n.rainbowChain), e.uniform4f(S, n.squashGain, n.celGain, 0, 0), e.uniform1i(C, g), e.uniform1i(w, f), e.uniform1i(T, H), e.uniform3fv(E, j), e.uniform3fv(D, k), e.uniform2fv(O, A), e.drawArrays(e.TRIANGLES, 0, 3);
 		}
 		return {
-			frame: F,
+			frame: L,
 			shouldContinue: o,
-			resize: P,
+			resize: I,
 			teardown: () => {
-				e.deleteProgram(f), e.deleteBuffer(m), e.deleteVertexArray(p);
+				e.deleteProgram(p), e.deleteBuffer(g), e.deleteVertexArray(m);
 			}
 		};
 	};
 }
 //#endregion
 //#region src/components/custom/fourier-field/composables/useFourierField.ts
-function $(e, t) {
-	let { config: r, getSpectrum: i, getPalette: a } = t, o = t.mode ?? "live", s = t.frozenT ?? .34, l = t.periodS ?? 16, u = 0, d = -1, f = 0, p = n({ respectReducedMotion: r.respectReducedMotion }), m = () => (t.freeze?.() ?? !1) || (S?.reducedMotion ?? !1);
-	function h(e) {
+function ye(e, t) {
+	let { config: r, getSpectrum: i, getPalette: a } = t, o = t.mode ?? "live", s = t.frozenT ?? .34, l = t.periodS ?? 16, u = 0, d = -1, f = 0, p = 0;
+	function m(e) {
+		if (f === 0 && p === 0) return;
+		let t = -64 * f - 2 * .62 * 8 * p;
+		p += t * e, f += p * e, Math.abs(f) < 1e-4 && Math.abs(p) < 1e-4 && (f = 0, p = 0);
+	}
+	let g = n({ respectReducedMotion: r.respectReducedMotion }), _ = () => (t.freeze?.() ?? !1) || (F?.reducedMotion ?? !1);
+	function v(e) {
+		y(e), t.onHeadFrame?.(E());
+	}
+	function y(e) {
 		let t = d >= 0 ? (e - d) * 1e3 : 16.7;
-		if (d = e, p.tick(t), m()) {
-			u = s, f = 0;
+		if (d = e, g.tick(t), _()) {
+			u = s, f = 0, p = 0;
 			return;
 		}
 		let n = Math.min(Math.max(t / 1e3, 0), .05);
-		if (r.interactive && p.active.value) {
-			u = p.smoothedPosition.value.x % 1, u < 0 && (u += 1), f = p.burst.value * 4;
+		if (r.interactive && g.active.value) {
+			let e = r.speed / l + g.velocity.value.x * M + f;
+			u = (u + e * n) % 1, u < 0 && (u += 1);
+			let t = g.burst.value * 4;
+			t !== 0 && (f = t, p = 0), m(n);
 			return;
 		}
 		let i = r.speed / l + f;
-		u = (u + i * n) % 1, u < 0 && (u += 1), f *= .92 ** (n * 60), Math.abs(f) < 1e-4 && (f = 0);
+		u = (u + i * n) % 1, u < 0 && (u += 1), m(n);
 	}
-	let g = () => u, _ = (e) => {
-		p.onPointerMove(e), r.interactive && S?.wake();
-	}, v = () => {
-		p.onPointerEnter(), r.interactive && S?.wake();
-	}, y = (e) => e.parentElement ?? e;
-	function b(e) {
-		let t = y(e);
-		t.addEventListener("pointermove", _), t.addEventListener("pointerenter", v), t.addEventListener("pointerleave", p.onPointerLeave);
+	let b = () => u, x = null, S = {
+		centerX: 0,
+		centerY: 0,
+		scale: 1
+	}, C = () => {
+		let e = i();
+		return e !== x && (x = e, S = K(e)), S;
+	}, w = () => {
+		let e = i(), t = Math.max(1, Math.min(Math.round(r.harmonics), e.length, 64)), [n, a] = h(e, u, t);
+		return {
+			x: n,
+			y: a
+		};
+	}, E = () => {
+		let t = e.value;
+		if (!t) return null;
+		let n = t.clientWidth || 0, r = t.clientHeight || 0;
+		if (n <= 0 || r <= 0) return null;
+		let i = n / r, a = w(), o = C(), s = D(), c = s.x !== 0 || s.y !== 0 ? {
+			...o,
+			centerX: o.centerX - s.x,
+			centerY: o.centerY - s.y
+		} : o;
+		return ee(a.x, a.y, c, i);
+	}, D = () => {
+		if (!r.interactive || !g.active.value) return {
+			x: 0,
+			y: 0
+		};
+		let e = g.smoothedPosition.value;
+		return {
+			x: (e.x * 2 - 1) * N,
+			y: (e.y * 2 - 1) * N
+		};
+	}, O = (e) => {
+		g.onPointerMove(e), r.interactive && F?.wake();
+	}, k = () => {
+		g.onPointerEnter(), r.interactive && F?.wake();
+	}, A = (e) => e.parentElement ?? e;
+	function j(e) {
+		let t = A(e);
+		t.addEventListener("pointermove", O), t.addEventListener("pointerenter", k), t.addEventListener("pointerleave", g.onPointerLeave);
 	}
-	function x(e) {
-		let t = y(e);
-		t.removeEventListener("pointermove", _), t.removeEventListener("pointerenter", v), t.removeEventListener("pointerleave", p.onPointerLeave);
+	function P(e) {
+		let t = A(e);
+		t.removeEventListener("pointermove", O), t.removeEventListener("pointerenter", k), t.removeEventListener("pointerleave", g.onPointerLeave);
 	}
-	let S = null, C = () => {
+	let F = null, I = () => {
 		let t = e.value;
-		return t ? (S || (b(t), S = c(t, {
+		return t ? (F || (j(t), F = c(t, {
 			mode: o,
 			respectReducedMotion: r.respectReducedMotion,
-			setupWGPU: se({
+			setupWGPU: le({
 				canvas: t,
 				config: r,
 				getSpectrum: i,
 				getPalette: a,
-				getHeadT: g,
+				getHeadT: b,
 				shouldContinue: () => !0,
-				onFrame: h
+				onFrame: v,
+				getPointerLean: D
 			}),
-			setupGL: me({
+			setupGL: ve({
 				canvas: t,
 				config: r,
 				getSpectrum: i,
 				getPalette: a,
-				getHeadT: g,
+				getHeadT: b,
 				shouldContinue: () => !0,
-				onFrame: h
+				onFrame: v,
+				getPointerLean: D
 			})
-		}), S.armAsync()), S) : null;
+		}), F.armAsync()), F) : null;
 	};
-	queueMicrotask(() => C());
-	let w = {
+	queueMicrotask(() => I());
+	let L = {
 		get backend() {
-			return C()?.backend ?? "webgpu";
+			return I()?.backend ?? "webgpu";
 		},
-		pause: () => C()?.suspend("manual"),
-		resume: () => C()?.resume("manual"),
-		wake: () => C()?.wake(),
-		renderAt: (e) => C()?.renderAt(e),
+		pause: () => I()?.suspend("manual"),
+		resume: () => I()?.resume("manual"),
+		wake: () => I()?.wake(),
+		renderAt: (e) => I()?.renderAt(e),
 		get reducedMotion() {
-			return S?.reducedMotion ?? !1;
+			return F?.reducedMotion ?? !1;
 		},
 		get headT() {
 			return u;
 		},
 		setHeadT: (e) => {
-			u = (e % 1 + 1) % 1, C()?.wake();
+			u = (e % 1 + 1) % 1, I()?.wake();
 		},
+		headUnit: E,
 		dispose: () => {
 			let t = e.value;
-			t && x(t), p.dispose(), S?.dispose();
+			t && P(t), g.dispose(), F?.dispose();
 		}
 	};
-	return T(() => w.dispose()), w;
+	return T(() => L.dispose()), L;
 }
 //#endregion
 //#region src/components/custom/fourier-field/FourierField.vue
-var he = /* @__PURE__ */ e(/* @__PURE__ */ S({
+var be = /* @__PURE__ */ e(/* @__PURE__ */ S({
 	__name: "FourierField",
 	props: {
 		config: {},
@@ -777,7 +1001,7 @@ var he = /* @__PURE__ */ e(/* @__PURE__ */ S({
 	},
 	setup(e, { expose: n }) {
 		let r = e, i = O("hostRef"), a = O("canvasRef"), { isDark: o } = d(), s = y(() => {
-			let e = r.config ?? N, t = r.intensity == null ? e.intensity : Math.max(0, Math.min(2, r.intensity)), n = r.config ? e.interactive : !1;
+			let e = r.config ?? L, t = r.intensity == null ? e.intensity : Math.max(0, Math.min(2, r.intensity)), n = r.config ? e.interactive : !1;
 			return {
 				...e,
 				intensity: t,
@@ -820,23 +1044,43 @@ var he = /* @__PURE__ */ e(/* @__PURE__ */ S({
 			}
 			h.value = s.value.palette;
 		}
-		let v = $(a, {
-			config: s.value,
+		let v = () => h.value, S = new Proxy({}, {
+			get: (e, t) => Reflect.get(s.value, t),
+			has: (e, t) => Reflect.has(s.value, t),
+			ownKeys: () => Reflect.ownKeys(s.value),
+			getOwnPropertyDescriptor: (e, t) => Reflect.getOwnPropertyDescriptor(s.value, t)
+		});
+		function T(e) {
+			let t = i.value;
+			!t || !e || t.style.setProperty("--ff-head-xy", `${e.x.toFixed(4)} ${e.y.toFixed(4)}`);
+		}
+		let A = ye(a, {
+			config: S,
 			getSpectrum: l,
-			getPalette: () => h.value,
-			freeze: () => r.freeze
+			getPalette: v,
+			freeze: () => r.freeze,
+			onHeadFrame: T
 		});
-		return k([
+		function j() {
+			let e = i.value;
+			if (!e) return;
+			let t = h.value[0];
+			t && e.style.setProperty("--ff-head-hue", `${t.h.toFixed(1)}`);
+		}
+		return k(() => r.config, () => A.wake(), { deep: !0 }), k([
 			() => r.color,
 			() => r.getPalette,
 			o
-		], g, { immediate: !0 }), w(g), k(o, () => v.wake()), k(() => r.freeze, () => v.wake()), n({
-			backend: () => v.backend,
-			pause: v.pause,
-			resume: v.resume,
-			wake: v.wake,
-			renderAt: v.renderAt,
-			setHeadT: v.setHeadT
+		], g, { immediate: !0 }), k(h, j), w(() => {
+			g(), j();
+		}), k(o, () => A.wake()), k(() => r.freeze, () => A.wake()), n({
+			backend: () => A.backend,
+			pause: A.pause,
+			resume: A.resume,
+			wake: A.wake,
+			renderAt: A.renderAt,
+			setHeadT: A.setHeadT,
+			headUnit: A.headUnit
 		}), (e, t) => (E(), b("div", {
 			ref_key: "hostRef",
 			ref: i,
@@ -848,6 +1092,6 @@ var he = /* @__PURE__ */ e(/* @__PURE__ */ S({
 			"aria-hidden": "true"
 		}, null, 512)], 2));
 	}
-}), [["__scopeId", "data-v-b0591225"]]);
+}), [["__scopeId", "data-v-4914c4f3"]]);
 //#endregion
-export { N as DEFAULT_FOURIER_CONFIG, he as FourierField, j as MAX_CURVE_SAMPLES, A as MAX_PHASORS, M as WARM_IDENTITY_PALETTE, v as comp, g as dftFromPoints, _ as makeEllipticSpectrum, h as partialSumAt, m as positionsAt, $ as useFourierField };
+export { L as DEFAULT_FOURIER_CONFIG, be as FourierField, j as MAX_CURVE_SAMPLES, A as MAX_PHASORS, I as WARM_IDENTITY_PALETTE, v as comp, g as dftFromPoints, _ as makeEllipticSpectrum, h as partialSumAt, m as positionsAt, ye as useFourierField };