@mkbabb/glass-ui 8.0.0 → 9.0.0

package/dist/fourier-field.js

@@ -1,104 +1,182 @@
-import { n as e } from "./useResolveTokenColor-CspQv_ik.js";
-import { t } from "./_plugin-vue_export-helper-B3ysoDQm.js";
-import { t as n } from "./usePointerVelocityField-DsIf7yyq.js";
-import { t as r } from "./useRoutePointer-B8itM7Ka.js";
-import { d as i, u as a } from "./pointerFieldMappings-DP5tla5z.js";
-import { i as o } from "./dark-z_P5QwqI.js";
-import { cssToOklch as s, oklchToLinear as c } from "./color.js";
-import { FOURIER_FIGURES as l, FOURIER_FIGURE_KEYS as u, comp as d, dftFromPoints as f, makeEllipticSpectrum as p, makeHarmonicFigure as m, partialSumAt as h, positionsAt as g } from "./fourier-math.js";
-import { m as _, n as v, o as y, r as b, s as x, u as S } from "./color.wgsl-B0N3mKMb.js";
-import { a as C } from "./rendererStatus-BxUlBLVy.js";
-import { n as w, t as T } from "./prng-2uS6J_A1.js";
-import { computed as E, createElementBlock as D, createElementVNode as O, defineComponent as k, normalizeClass as A, onMounted as j, onScopeDispose as M, openBlock as N, readonly as P, shallowRef as F, useTemplateRef as I, watch as L } from "vue";
+import { n as e } from "./springPresets-Cbe0Voqg.js";
+import { n as t } from "./useResolveTokenColor-B2FfJnd9.js";
+import { t as n } from "./_plugin-vue_export-helper-B3ysoDQm.js";
+import { t as r } from "./usePointerVelocityField-DsIf7yyq.js";
+import { i } from "./dark-CLlmo7dD.js";
+import { cssToOklch as a, gamutMapStop as o, oklchToLinear as s } from "./color.js";
+import { FOURIER_FIGURES as c, FOURIER_FIGURE_KEYS as l, comp as u, dftFromPoints as d, makeEllipticSpectrum as f, makeHarmonicFigure as p, partialSumAt as m, positionsAt as h } from "./fourier-math.js";
+import { a as g, n as _, r as v } from "./color.wgsl-BTszLY39.js";
+import { a as y } from "./rendererStatus-BxUlBLVy.js";
+import { n as b, t as x } from "./prng-2uS6J_A1.js";
+import { computed as S, createElementBlock as C, createElementVNode as w, defineComponent as T, normalizeClass as E, onMounted as D, onScopeDispose as O, openBlock as k, readonly as A, shallowRef as j, useTemplateRef as M, watch as N } from "vue";
+var P = .5, F = 720;
+function I(e) {
+	let t = Infinity, n = Infinity, r = -Infinity, i = -Infinity;
+	for (let a = 0; a < F; a++) {
+		let [o, s] = m(e, a / F);
+		o < t && (t = o), s < n && (n = s), o > r && (r = o), s > i && (i = s);
+	}
+	return isFinite(t) ? {
+		minX: t,
+		minY: n,
+		maxX: r,
+		maxY: i
+	} : {
+		minX: 0,
+		minY: 0,
+		maxX: 0,
+		maxY: 0
+	};
+}
+function L(e) {
+	let t = e.find((e) => e.index === 0), n = t ? [t.coefficient[0], t.coefficient[1]] : [0, 0], r = e.filter((e) => e.index !== 0).slice().sort((e, t) => t.amplitude - e.amplitude);
+	if (r.length === 0) return R([u(1, .5, 0)], n);
+	let i = I(r), a = Math.max(i.maxX - i.minX, 1e-6), o = Math.max(i.maxY - i.minY, 1e-6), s = 856 / Math.hypot(a, o), c = r.filter((e) => 2 * e.amplitude * s >= P);
+	return R(c.length > 0 ? c : [r[0]], n);
+}
+function R(e, t) {
+	let n = I(e), r = Math.max(n.maxX - n.minX, 1e-6), i = Math.max(n.maxY - n.minY, 1e-6), a = 0;
+	for (let t of e) a += t.amplitude;
+	return {
+		terms: e,
+		dc: t,
+		halfSpanX: r / 2,
+		halfSpanY: i / 2,
+		centerX: (n.minX + n.maxX) / 2,
+		centerY: (n.minY + n.maxY) / 2,
+		diagonal: Math.hypot(r, i),
+		chainReach: a
+	};
+}
+function z(e, t, n) {
+	let r = t / Math.max(e.diagonal, 1e-6), i = 0;
+	for (let t of e.terms) 2 * t.amplitude * r >= n && i++;
+	return i;
+}
+//#endregion
 //#region src/components/fourier-field/constants.ts
-var R = 64, z = 384, B = .15, V = 3.6214285714285714, H = .55, ee = .35, U = [{
-	L: .62,
-	C: .19,
-	h: 34
-}, {
-	L: .86,
-	C: .06,
-	h: 70
-}], te = {
+var B = .1, ee = .22, te = .11, ne = .35, re = .4, ie = .5, ae = .15, V = 1 / 64, H = 1 / 8, U = {
 	source: "elliptic",
 	harmonics: 6,
-	showEpicycles: !0,
-	epicycleArms: 6,
+	showMachine: !0,
 	rainbowChain: !0,
 	trailArc: .43,
-	trailWidth: 5,
+	markStroke: 8,
+	inkOffset: .7,
+	squash: .55,
+	glow: .14,
 	intensity: 1,
-	harmonicScale: .24,
+	richness: .5,
 	speed: 1,
-	palette: U,
-	respectReducedMotion: !0,
-	interactive: !0,
-	squashGain: H,
-	celGain: ee
-}, ne = "\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", re = `
-// The instanced-ribbon LAYER selector (a pipeline-overridable constant — 5 pipelines share the
-// ONE module, each specializing this): 0 trail · 1 epicycle · 2 head · 3 cel-rope · 4 cel-arm.
+	palette: [{
+		L: .62,
+		C: .19,
+		h: 34
+	}, {
+		L: .86,
+		C: .06,
+		h: 70
+	}],
+	respectReducedMotion: !0
+}, W = e("world"), G = 2 * Math.PI / W.response, oe = W.dampingFraction, se = .22, ce = .06, le = ie * G * G;
+function ue() {
+	let e = 0, t = 0, n = 0, r = !0;
+	function i(e) {
+		!Number.isFinite(e) || e === 0 || (n = Math.min(Math.abs(e), le) * Math.sign(e));
+	}
+	function a(e) {
+		if (t === 0 && n === 0) return;
+		let r = -G * G * t - 2 * oe * G * n;
+		n += r * e, t += n * e, Math.abs(t) < 1e-4 && Math.abs(n) < 1e-4 && (t = 0, n = 0);
+	}
+	return {
+		get headT() {
+			return e;
+		},
+		get momentum() {
+			return t;
+		},
+		step(o) {
+			if (o.frozen) return t = 0, n = 0, 0;
+			let s = Math.min(Math.max(o.dt, 0), .05), c = o.speed / 16;
+			return o.engaged ? (c += o.scrubVelocity * ae, r && o.burst >= se ? (r = !1, i(o.burst * 4 * Math.sign(o.scrubVelocity || 1))) : !r && o.burst <= ce && (r = !0)) : r = !0, c = Math.max(0, c + t), e = (e + c * s) % 1, e < 0 && (e += 1), a(s), c;
+		},
+		set(t) {
+			e = (t % 1 + 1) % 1;
+		},
+		flick(e) {
+			i(e);
+		}
+	};
+}
+//#endregion
+//#region src/components/fourier-field/shaders/compute.wgsl.ts
+var de = "\nconst TAU: f32 = 6.283185307179586;\n\nstruct Phasor {\n  // (re, im, index, _pad)\n  data: vec4<f32>,\n};\n\nstruct ComputeUniforms {\n  // c0: (headT, trailArc, _pad, _pad)\n  c0: vec4<f32>,\n  // ints: (harmonicN, sampleCount, termCount, _pad)\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) in MODEL space\n@group(0) @binding(2) var<storage, read_write> curveSamples: array<vec4<f32>>;\n// chainTips[k] = (x, y, _pad, _pad) in MODEL space\n@group(0) @binding(3) var<storage, read_write> chainTips: array<vec4<f32>>;\n\n// The truncated inverse DFT at parameter t over the first n terms — the transcription of\n// math.ts partialSumAt:  c += vec2(re*cos - im*sin, re*sin + im*cos), angle = TAU*index*t.\nfn partialSumAt(t: f32, n: i32) -> vec2<f32> {\n  var c = vec2<f32>(0.0, 0.0);\n  let lim = min(n, i32(arrayLength(&phasors)));\n  for (var i = 0; i < lim; i = i + 1) {\n    let p = phasors[i].data;\n    let angle = TAU * p.z * t;\n    let cs = cos(angle);\n    let sn = sin(angle);\n    c = c + vec2<f32>(p.x * cs - p.y * sn, p.x * sn + p.y * cs);\n  }\n  return c;\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 sampleCount = u.ints.y;\n\n  // ── The comet body ──\n  if (i < sampleCount) {\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    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 chain tips (k = 0..N). chainTips[0] is the origin. ──\n  if (i <= harmonicN && i < i32(arrayLength(&chainTips))) {\n    let tip = partialSumAt(headT, i);\n    chainTips[i] = vec4<f32>(tip.x, tip.y, 0.0, 0.0);\n  }\n}\n", fe = `
+// 0 chain · 1 trail · 2 head — a pipeline-overridable constant, three pipelines, one module.
 override LAYER: i32 = 0;
 
+// THE SPLICE CONTRACT, honoured. OKLCH_MATRICES_WGSL states it at color.wgsl.ts:52-53 —
+// "PI must be in scope (the consumer defines it first, as the GLSL chunk requires)" — and
+// spends it at :105 folding the OKLCh hue to [0, 2pi). This module splices that chunk
+// below and defined PI nowhere, so every CreateShaderModule on this source failed
+// validation with "unresolved value 'PI'" and the stage painted NOTHING. The two other
+// WGSL primaries carry the same line for the same reason (aurora.wgsl.ts:49,
+// metaball.wgsl.ts:53); this is that house idiom, not a local patch. The CLASS is gated
+// by tests/components/fourier-field/wgsl-splice-contract.test.ts, which resolves every
+// assembled module against the chunks it splices.
 const PI: f32 = 3.141592653589793;
-// The degenerate-tangent guard must equal FOURIER_TANGENT_EPS in
-// constants.ts and the GL CPU bead path so a cusp resolves identically across both engines.
+
 const TANGENT_EPS: f32 = 1e-4;
 const SPEED_REF_HALFWIDTHS: f32 = 6.0;
-// The thick luminous ribbon mirrors RIBBON_TAIL_FRAC verbatim
-// from constants.ts because the WGSL twin cannot import a TS const; parity coverage verifies the
-// two copies are equal so the mid-body floor (RIBBON_HEAD_FLOOR_PX) can never drift off it.
-const RIBBON_TAIL_FRAC: f32 = 0.4;
-const RIBBON_UNDERGLOW_SCALE: f32 = 2.2;
-const RIBBON_UNDERGLOW_ALPHA: f32 = 0.16;
+// The trail's taper: the mark keeps this fraction of its width at the oldest tail.
+const TAIL_TAPER: f32 = 0.55;
 
-// ── Render uniforms (the typed-struct source-of-truth — see uniformBridgeWGPU.ts) ──
 struct RenderUniforms {
-  // r0: (centerX, centerY, scale, aspect)  — model→clip fit transform
+  // r0: (centerX, centerY, scale, aspect)
   r0: vec4<f32>,
-  // r1: (trailWidth, peakAlpha, headGlowAlpha, trailFadeExp)
+  // r1: (markHalf, inkOffsetStrokes, scaffoldFrac, edgeMargin)
   r1: vec4<f32>,
-  // r2: (trailFloor, intensity, showEpicycles, rainbowChain)
+  // r2: (peakAlpha, glow, squash, trailFadeExp)
   r2: vec4<f32>,
-  // r3: (squashGain, celGain, edgeMargin, _pad) — FOURIER-LOOM §2b/§3b + the ribbon bbox slop
+  // r3: (trailFloor, hueSweep, ringStrokeModel, showMachine)
   r3: vec4<f32>,
-  // ints: (sampleCount, armCount, stopCount, _pad)
+  // ink: (linear rgb, rainbowChain)
+  ink: vec4<f32>,
+  // head: (linear rgb, _pad)
+  head: vec4<f32>,
+  // ints: (sampleCount, lutSize, chainCount, _pad)
   ints: vec4<i32>,
-  // palette stops: linear-sRGB rgb + _pad
-  palette: array<vec4<f32>, 4>,
+  // the CPU-resolved linear-sRGB ramp — the length is the TS constant, not a second copy
+  lut: array<vec4<f32>, 16>,
 };
 
 @group(0) @binding(0) var<uniform> u: RenderUniforms;
-// curveSamples[i] = (x, y, age, _pad) in MODEL space — the render VERTEX-PULLS these.
 @group(0) @binding(1) var<storage, read> curveSamples: array<vec4<f32>>;
-// chainTips[k] = (x, y, _pad, _pad) in MODEL space.
 @group(0) @binding(2) var<storage, read> chainTips: array<vec4<f32>>;
 
+${_}
 ${v}
-${b}
 
-fn samplePaletteLin(t: f32) -> vec3<f32> {
-  let stopCount = u.ints.z;
-  if (stopCount <= 1) { return u.palette[0].rgb; }
-  let n = f32(stopCount);
-  let ft = clamp(t, 0.0, 1.0) * (n - 1.0);
+// Read the CPU-resolved ramp. No colour-space conversion happens here — the LUT already
+// carries the chroma floor and the gamut map.
+fn sampleRamp(t: f32) -> vec3<f32> {
+  let n = u.ints.y;
+  let ft = clamp(t, 0.0, 1.0) * f32(n - 1);
   let i0 = i32(floor(ft));
-  let i1 = min(i0 + 1, stopCount - 1);
-  let f = ft - f32(i0);
-  let labA = LMS_TO_OKLAB * cbrt3(LINEAR_SRGB_TO_LMS * u.palette[i0].rgb);
-  let labB = LMS_TO_OKLAB * cbrt3(LINEAR_SRGB_TO_LMS * u.palette[i1].rgb);
-  return oklabToLinearSrgb(mix(labA, labB, f));
+  let i1 = min(i0 + 1, n - 1);
+  return mix(u.lut[i0].rgb, u.lut[i1].rgb, ft - f32(i0));
 }
 
-fn chainColorLin(seg: f32, rainbow: bool) -> vec3<f32> {
-  let baseLin = u.palette[0].rgb;
-  if (!rainbow) { return baseLin; }
-  let lab = LMS_TO_OKLAB * cbrt3(LINEAR_SRGB_TO_LMS * baseLin);
+// The chain's hue sweep, taken ONCE PER INSTANCE in the vertex stage: the ramp entry for
+// this arm, rotated about the palette anchor by ±hueSweep. Anchored warm, the sweep is
+// bounded by its own arithmetic — it cannot arrive anywhere the palette is not.
+fn chainTint(seg: f32) -> vec3<f32> {
+  let base = sampleRamp(seg * 0.6);
+  if (u.ink.w < 0.5) { return base; }
+  let lab = LMS_TO_OKLAB * cbrt3(LINEAR_SRGB_TO_LMS * base);
   let lch = oklabToOklch(lab);
-  let hueShift = mix(-0.45, 1.15, clamp(seg, 0.0, 1.0));
-  let h = lch.z + hueShift;
-  let lifted = vec3<f32>(0.66, max(lch.y, 0.14), h);
-  return oklabToLinearSrgb(oklchToOklab(lifted));
+  let swept = vec3<f32>(lch.x, lch.y, lch.z + mix(-u.r3.y, u.r3.y, clamp(seg, 0.0, 1.0)));
+  return oklabToLinearSrgb(oklchToOklab(swept));
 }
 
 fn segDist(p: vec2<f32>, a: vec2<f32>, b: vec2<f32>) -> f32 {
@@ -108,10 +186,10 @@ fn segDist(p: vec2<f32>, a: vec2<f32>, b: vec2<f32>) -> f32 {
   return length(pa - ba * h);
 }
 
-// The head travel frame + the volume-preserving anisotropic distance.
+// The head's travel frame + its volume-preserving anisotropic metric.
 struct HeadFrame { T: vec2<f32>, sHat: f32, };
-fn headFrame(head: vec2<f32>, headBack: vec2<f32>, halfW: f32) -> HeadFrame {
-  let d = head - headBack;
+fn headFrame(head: vec2<f32>, back: vec2<f32>, halfW: f32) -> HeadFrame {
+  let d = head - back;
   let s = length(d);
   var out: HeadFrame;
   if (s <= TANGENT_EPS) {
@@ -120,8 +198,7 @@ fn headFrame(head: vec2<f32>, headBack: vec2<f32>, halfW: f32) -> HeadFrame {
     return out;
   }
   out.T = d / s;
-  let refScale = max(halfW * SPEED_REF_HALFWIDTHS, 1e-6);
-  out.sHat = clamp(s / refScale, 0.0, 1.0);
+  out.sHat = clamp(s / max(halfW * SPEED_REF_HALFWIDTHS, 1e-6), 0.0, 1.0);
   return out;
 }
 
@@ -129,19 +206,9 @@ 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));
+  return length(vec2<f32>(dot(rel, fr.T) / g, dot(rel, n) * g));
 }
 
-// The cel ink lags behind the travel — the SAME −T·halfW·1.4 offset both engines apply (the
-// head frame is read straight off the compute-filled curveSamples[0]/[1], parity by construction).
-fn celOffset(halfW: f32) -> vec2<f32> {
-  let fr = headFrame(curveSamples[0].xy, curveSamples[1].xy, halfW);
-  return -fr.T * halfW * 1.4;
-}
-
-// The unit quad as two triangles (6 verts) in [0,1]² — the instanced vertex expands it.
 fn quadCorner(vi: u32) -> vec2<f32> {
   var c = array<vec2<f32>, 6>(
     vec2<f32>(0.0, 0.0), vec2<f32>(1.0, 0.0), vec2<f32>(0.0, 1.0),
@@ -152,10 +219,12 @@ fn quadCorner(vi: u32) -> vec2<f32> {
 
 struct VSOut {
   @builtin(position) pos: vec4<f32>,
-  @location(0) p: vec2<f32>,      // model-space fragment coordinate
+  @location(0) p: vec2<f32>,
   @location(1) a: vec2<f32>,
   @location(2) b: vec2<f32>,
-  @location(3) segData: vec3<f32>,   // (age, strokeHalf, arg2)
+  // (age, strokeHalf, drawRing)
+  @location(3) seg: vec3<f32>,
+  @location(4) @interpolate(flat) tint: vec3<f32>,
 };
 
 @vertex
@@ -164,54 +233,44 @@ fn vs_main(@builtin(vertex_index) vi: u32, @builtin(instance_index) inst: u32) -
   let center = u.r0.xy;
   let scale = max(u.r0.z, 1e-6);
   let aspect = max(u.r0.w, 1e-4);
-  let halfW = u.r1.x * 0.5;
-  let margin = u.r3.z;
-
-  var a: vec2<f32> = vec2<f32>(0.0);
-  var b: vec2<f32> = vec2<f32>(0.0);
-  var strokeHalf: f32 = halfW;
-  var age: f32 = 0.0;
-  var arg2: f32 = 0.0;
-  var isCapsule: bool = true;
-  var ext: f32 = halfW;
+  let markHalf = u.r1.x;
+  let margin = u.r1.w;
+
+  var a = vec2<f32>(0.0);
+  var b = vec2<f32>(0.0);
+  var strokeHalf = markHalf;
+  var age = 0.0;
+  var drawRing = 0.0;
+  var tint = vec3<f32>(0.0);
+  var isCapsule = true;
+  var ext = markHalf;
 
   if (LAYER == 0) {
-    // TRAIL — the curve capsule; the covered extent is the head-width under-glow.
+    // CHAIN — the AABB around this arm's own orbit (radius = |b − a| = |c_k|).
+    a = chainTips[inst].xy;
+    b = chainTips[inst + 1u].xy;
+    let radius = length(b - a);
+    // THE RING LAW, asked of the live stage: a circle narrower than its own line is a blob.
+    if (2.0 * radius >= u.r3.z) { drawRing = 1.0; }
+    strokeHalf = markHalf * u.r1.z;
+    tint = chainTint(f32(inst) / max(f32(u.ints.z) - 1.0, 1.0));
+    ext = radius + strokeHalf * 2.0;
+    isCapsule = false;
+  } else if (LAYER == 1) {
+    // TRAIL — the curve capsule, padded for the ink's own offset.
     a = curveSamples[inst].xy;
     b = curveSamples[inst + 1u].xy;
     age = max(curveSamples[inst].z, curveSamples[inst + 1u].z);
-    ext = halfW * RIBBON_UNDERGLOW_SCALE;
+    tint = sampleRamp(1.0 - age);
+    ext = markHalf * (1.0 + 2.0 * max(u.r1.y, 0.0));
     isCapsule = true;
-  } else if (LAYER == 1) {
-    // EPICYCLE — the chain AABB around a (radius = |b−a|).
-    a = chainTips[inst].xy;
-    b = chainTips[inst + 1u].xy;
-    arg2 = f32(inst) / max(f32(u.ints.y - 1), 1.0);
-    ext = length(b - a) + halfW * 0.7;
-    isCapsule = false;
-  } else if (LAYER == 2) {
-    // HEAD — the comet head at curveSamples[0], AABB by the halo radius.
+  } else {
+    // HEAD — centred on the newest curve sample; the AABB is the halo.
     a = curveSamples[0].xy;
     b = curveSamples[1].xy;
-    ext = halfW * 4.5;
+    tint = u.head.rgb;
+    ext = markHalf * 5.0;
     isCapsule = false;
-  } else if (LAYER == 3) {
-    // CEL-ROPE — the curve capsule, offset opposite travel; full-width ink.
-    let off = celOffset(halfW);
-    a = curveSamples[inst].xy + off;
-    b = curveSamples[inst + 1u].xy + off;
-    arg2 = 1.0;
-    ext = halfW;
-    isCapsule = true;
-  } else {
-    // CEL-ARM (LAYER == 4) — the chain capsule, offset; the narrower arm ink (0.55·halfW).
-    let off = celOffset(halfW);
-    a = chainTips[inst].xy + off;
-    b = chainTips[inst + 1u].xy + off;
-    strokeHalf = halfW * 0.55;
-    arg2 = 0.7;
-    ext = halfW * 0.55;
-    isCapsule = true;
   }
   ext = ext + margin;
 
@@ -222,20 +281,18 @@ fn vs_main(@builtin(vertex_index) vi: u32, @builtin(instance_index) inst: u32) -
     var dir = vec2<f32>(1.0, 0.0);
     if (len > 1e-6) { dir = d / len; }
     let perp = vec2<f32>(-dir.y, dir.x);
-    let along = mix(a - dir * ext, b + dir * ext, corner.x);
-    pos = along + perp * (corner.y * 2.0 - 1.0) * ext;
+    pos = mix(a - dir * ext, b + dir * ext, corner.x) + perp * (corner.y * 2.0 - 1.0) * ext;
   } else {
     pos = a + (corner * 2.0 - vec2<f32>(1.0)) * ext;
   }
 
-  let clipX = (pos.x - center.x) * scale / aspect;
-  let clipY = (pos.y - center.y) * scale;
   var out: VSOut;
-  out.pos = vec4<f32>(clipX, clipY, 0.0, 1.0);
+  out.pos = vec4<f32>((pos.x - center.x) * scale / aspect, (pos.y - center.y) * scale, 0.0, 1.0);
   out.p = pos;
   out.a = a;
   out.b = b;
-  out.segData = vec3<f32>(age, strokeHalf, arg2);
+  out.seg = vec3<f32>(age, strokeHalf, drawRing);
+  out.tint = tint;
   return out;
 }
 
@@ -243,270 +300,223 @@ fn vs_main(@builtin(vertex_index) vi: u32, @builtin(instance_index) inst: u32) -
 fn fs_main(in: VSOut) -> @location(0) vec4<f32> {
   let p = in.p;
   let aa = max(fwidth(p.x) + fwidth(p.y), 1e-5) * 0.75;
-  let peak = u.r1.y * u.r2.y;
-  let headGlow = u.r1.z * u.r2.y;
-  let fadeExp = u.r1.w;
-  let trailFloor = u.r2.x;
-  let rainbow = u.r2.w > 0.5;
-  let squashGain = u.r3.x;
-  let celGain = u.r3.y;
-  let halfW = in.segData.y;
-  let age = in.segData.x;
-  let arg2 = in.segData.z;
+  let peak = u.r2.x;
+  let glow = u.r2.y;
+  let squash = u.r2.z;
+  let fadeExp = u.r2.w;
+  let trailFloor = u.r3.x;
+  let markHalf = u.r1.x;
+  let strokeHalf = in.seg.y;
+  let age = in.seg.x;
   let a = in.a;
   let b = in.b;
 
   if (LAYER == 0) {
-    // ── TRAIL — the tapered luminous ribbon over its own soft under-glow ──
-    let d = segDist(p, a, b);
-    let ribbonHalf = halfW * (RIBBON_TAIL_FRAC + (1.0 - RIBBON_TAIL_FRAC) * age);
-    let lin = samplePaletteLin(1.0 - age * 0.4);
-    let rgb = clamp(linearToSrgb(lin), vec3<f32>(0.0), vec3<f32>(1.0));
-    let glowHalf = ribbonHalf * RIBBON_UNDERGLOW_SCALE;
-    let glowCover = 1.0 - smoothstep(glowHalf, glowHalf + aa * 3.0, d);
-    let ga = peak * RIBBON_UNDERGLOW_ALPHA * pow(age, fadeExp) * glowCover;
-    let cover = 1.0 - smoothstep(ribbonHalf, ribbonHalf + aa, d);
-    let ca = max(peak * pow(age, fadeExp), peak * trailFloor) * cover;
-    let outA = ca + ga * (1.0 - ca);
-    return vec4<f32>(rgb * outA, outA);
-  } else if (LAYER == 1) {
-    // ── EPICYCLE — orbit RING + ARM + joint DOT union (MAX-blended, no join seam) ──
-    let lin = chainColorLin(arg2, rainbow);
-    let rgb = clamp(linearToSrgb(lin), vec3<f32>(0.0), vec3<f32>(1.0));
+    // ── THE MACHINE — ring (conditionally), arm, joint dot; one scaffold rung ──
     let radius = length(b - a);
-    let dRing = abs(length(p - a) - radius);
-    let ringW = max(halfW * 0.45, aa);
-    let ringMask = (1.0 - smoothstep(ringW, ringW + aa, dRing)) * 0.5;
-    let dArm = segDist(p, a, b);
-    let armMask = 1.0 - smoothstep(halfW * 0.55, halfW * 0.55 + aa, dArm);
-    let dotR = max(halfW * 0.7, aa * 2.0);
-    let dDot = length(p - a);
-    let dotMask = 1.0 - smoothstep(dotR, dotR + aa, dDot);
-    let m = clamp(max(max(ringMask, armMask), dotMask), 0.0, 1.0) * peak * 0.7;
-    return vec4<f32>(rgb * m, m);
-  } else if (LAYER == 2) {
-    // ── HEAD — squash-and-stretch (§2b): halo + saturated core + white specular ──
-    let head = a;
-    let headBack = b;
-    let fr = headFrame(head, headBack, halfW);
-    let dHead = headAniso(p, head, fr, squashGain);
-    let coreR = halfW * 1.5;
-    let haloR = coreR * 3.0;
-    let headRgb = clamp(linearToSrgb(samplePaletteLin(0.0)), vec3<f32>(0.0), vec3<f32>(1.0));
-    let halo = (1.0 - smoothstep(0.0, haloR, dHead)) * headGlow * 0.35;
-    var accum = vec4<f32>(headRgb * halo, halo);
-    let core = (1.0 - smoothstep(coreR, coreR + aa, dHead)) * headGlow;
-    accum = vec4<f32>(headRgb * core, core) + accum * (1.0 - core);
-    let spec = (1.0 - smoothstep(coreR * 0.4, coreR * 0.4 + aa, dHead)) * headGlow * 0.9;
-    accum = vec4<f32>(vec3<f32>(1.0) * spec, spec) + accum * (1.0 - spec);
-    return accum;
+    var m = 0.0;
+    if (in.seg.z > 0.5) {
+      let dRing = abs(length(p - a) - radius);
+      m = max(m, 1.0 - smoothstep(strokeHalf, strokeHalf + aa, dRing));
+    }
+    m = max(m, 1.0 - smoothstep(strokeHalf, strokeHalf + aa, segDist(p, a, b)));
+    // The joint dot is the mark's own diameter — the machine's one solid rung.
+    m = max(m, 1.0 - smoothstep(markHalf, markHalf + aa, length(p - a)));
+    let alpha = clamp(m, 0.0, 1.0) * peak;
+    let rgb = clamp(linearToSrgb(in.tint), vec3<f32>(0.0), vec3<f32>(1.0));
+    return vec4<f32>(rgb * alpha, alpha);
+  } else if (LAYER == 1) {
+    // ── THE CURVE — ink under mark, composited at α1, then ONE envelope ──
+    let taper = TAIL_TAPER + (1.0 - TAIL_TAPER) * age;
+    let half = markHalf * taper;
+    // The ink rides THIS segment's own tangent, opposite the travel: the head runs from
+    // b toward a, so the ink lands behind at (b − a).
+    var dir = vec2<f32>(1.0, 0.0);
+    let d = b - a;
+    let len = length(d);
+    if (len > 1e-6) { dir = d / len; }
+    let off = dir * (markHalf * 2.0 * u.r1.y);
+
+    let aMark = 1.0 - smoothstep(half, half + aa, segDist(p, a, b));
+    let aInk = 1.0 - smoothstep(half, half + aa, segDist(p, a + off, b + off));
+
+    let markRgb = clamp(linearToSrgb(in.tint), vec3<f32>(0.0), vec3<f32>(1.0));
+    let inkRgb = clamp(linearToSrgb(u.ink.rgb), vec3<f32>(0.0), vec3<f32>(1.0));
+
+    // Mark OVER ink, both fully opaque where they cover — the pair, then the envelope.
+    let aPair = aMark + aInk * (1.0 - aMark);
+    let rgbPair = markRgb * aMark + inkRgb * aInk * (1.0 - aMark);
+    let env = peak * max(pow(max(age, 0.0), fadeExp), trailFloor);
+    return vec4<f32>(rgbPair * env, aPair * env);
   } else {
-    // ── CEL — the technicolor ink shadow (rope LAYER==3, arm LAYER==4) ──
-    let celA = clamp(celGain, 0.0, 1.0);
-    let d = segDist(p, a, b);
-    let cover = 1.0 - smoothstep(halfW, halfW + aa, d);
-    let m = cover * celA * peak * arg2; // arg2 = celStrength (1.0 rope / 0.7 arm)
-    return vec4<f32>(0.0, 0.0, 0.0, m);
+    // ── THE HEAD — palette-lifted core over its own halo. Light-led, never white. ──
+    let fr = headFrame(a, b, markHalf);
+    let dHead = headAniso(p, a, fr, squash);
+    let coreR = markHalf * 1.5;
+    let haloR = coreR * 3.0;
+    let rgb = clamp(linearToSrgb(in.tint), vec3<f32>(0.0), vec3<f32>(1.0));
+    let halo = (1.0 - smoothstep(0.0, haloR, dHead)) * glow;
+    let core = (1.0 - smoothstep(coreR, coreR + aa, dHead)) * peak;
+    let alpha = clamp(max(core, halo), 0.0, 1.0);
+    return vec4<f32>(rgb * alpha, alpha);
   }
 }
-`, W = {
-	trail: 0,
-	epicycle: 1,
-	head: 2,
-	"cel-rope": 3,
-	"cel-arm": 4
-};
-function ie(e) {
-	let t = Math.max(0, Math.floor(e.sampleCount) - 1), n = e.showEpicycles ? Math.max(0, Math.floor(e.armCount)) : 0, r = e.celGain > .001, i = [];
-	return r && t > 0 && i.push({
-		kind: "cel-rope",
-		instanceCount: t,
-		blend: "over"
-	}), r && n > 0 && i.push({
-		kind: "cel-arm",
-		instanceCount: n,
-		blend: "over"
-	}), n > 0 && i.push({
-		kind: "epicycle",
-		instanceCount: n,
-		blend: "max"
-	}), t > 0 && i.push({
-		kind: "trail",
-		instanceCount: t,
-		blend: "over"
-	}), i.push({
-		kind: "head",
-		instanceCount: 1,
-		blend: "over"
-	}), i;
-}
-var ae = new Float32Array([
-	0,
-	0,
-	1,
-	0,
-	0,
-	1,
-	1,
-	1
-]), oe = 32, G = {
+`, pe = 32, K = {
 	c0: 0,
 	ints: 4
 };
-function K() {
-	let e = /* @__PURE__ */ new ArrayBuffer(oe);
+function q() {
+	let e = /* @__PURE__ */ new ArrayBuffer(pe);
 	return {
 		buffer: e,
 		f32: new Float32Array(e),
 		i32: new Int32Array(e)
 	};
 }
-function se(e, t, n, r, i, a, o) {
-	let { f32: s, i32: c } = e;
-	return s[G.c0 + 0] = t, s[G.c0 + 1] = n, s[G.c0 + 2] = 0, s[G.c0 + 3] = 0, c[G.ints + 0] = r, c[G.ints + 1] = i, c[G.ints + 2] = a, c[G.ints + 3] = o, e;
+function me(e, t, n, r, i, a) {
+	let { f32: o, i32: s } = e;
+	return o[K.c0 + 0] = t, o[K.c0 + 1] = n, o[K.c0 + 2] = 0, o[K.c0 + 3] = 0, s[K.ints + 0] = r, s[K.ints + 1] = i, s[K.ints + 2] = a, s[K.ints + 3] = 0, e;
 }
-var q = 144, J = {
+var he = 368, J = {
 	r0: 0,
 	r1: 4,
 	r2: 8,
 	r3: 12,
-	ints: 16,
-	palette: 20
+	ink: 16,
+	head: 20,
+	ints: 24,
+	lut: 28
 };
 function Y() {
-	let e = new ArrayBuffer(q);
+	let e = new ArrayBuffer(he);
 	return {
 		buffer: e,
 		f32: new Float32Array(e),
 		i32: new Int32Array(e)
 	};
 }
-function X(e) {
-	let t = Infinity, n = Infinity, r = -Infinity, i = -Infinity, a = e;
-	for (let e = 0; e < 720; e++) {
-		let o = g(a, e / 720), [s, c] = o[o.length - 1];
-		s < t && (t = s), c < n && (n = c), s > r && (r = s), c > i && (i = c);
-	}
-	if (!isFinite(t)) return {
-		centerX: 0,
-		centerY: 0,
-		scale: 1
-	};
-	let o = Math.max(.001, r - t), s = Math.max(.001, i - n), c = 2 * .82 / Math.max(o, s);
+var ge = .82;
+function _e(e, t) {
+	let n = Math.max(e.halfSpanX, e.halfSpanY, 1e-6), r = t ? e.chainReach : 0, i = Math.max(n, r, 1e-6);
 	return {
-		centerX: (t + r) / 2,
-		centerY: (n + i) / 2,
-		scale: c
+		centerX: e.centerX,
+		centerY: e.centerY,
+		scale: ge / i
 	};
 }
-function ce(e, t, n) {
-	let r = Math.max(e, V), i = Math.max(n, 1) / 2;
-	return r / Math.max(t, 1e-6) / i;
+function X(e, t, n) {
+	let r = Math.max(n, 1) / 2;
+	return e / Math.max(t, 1e-6) / r;
 }
-function Z(e, t, n, r, i, a, o, s, l, u, d, f, p, m, h, g, _) {
-	let { f32: v, i32: y } = e;
-	v[J.r0 + 0] = t.centerX, v[J.r0 + 1] = t.centerY, v[J.r0 + 2] = t.scale, v[J.r0 + 3] = n, v[J.r1 + 0] = r, v[J.r1 + 1] = i, v[J.r1 + 2] = a, v[J.r1 + 3] = o, v[J.r2 + 0] = s, v[J.r2 + 1] = l, v[J.r2 + 2] = +!!u, v[J.r2 + 3] = +!!d, v[J.r3 + 0] = f, v[J.r3 + 1] = p, v[J.r3 + 2] = m, v[J.r3 + 3] = 0;
-	let b = Math.min(_.length, 4);
-	y[J.ints + 0] = h, y[J.ints + 1] = g, y[J.ints + 2] = b, y[J.ints + 3] = 0;
-	for (let e = 0; e < 4; e++) {
-		let t = J.palette + e * 4, n = c(_[Math.min(e, b - 1)] ?? _[0]);
-		v[t + 0] = n[0], v[t + 1] = n[1], v[t + 2] = n[2], v[t + 3] = 0;
+function ve(e, t, n) {
+	let r = t.h - e.h;
+	for (; r > 180;) r -= 360;
+	for (; r < -180;) r += 360;
+	return {
+		L: e.L + (t.L - e.L) * n,
+		C: e.C + (t.C - e.C) * n,
+		h: e.h + r * n
+	};
+}
+function Z(e) {
+	let t = e.length > 0 ? e.slice(0, 4) : [], n = t.length > 0 ? t : [{
+		L: .62,
+		C: .19,
+		h: 34
+	}], r = /* @__PURE__ */ new Float32Array(64);
+	for (let e = 0; e < 16; e++) {
+		let t = e / 15 * (n.length - 1), i = Math.min(Math.floor(t), n.length - 1), a = Math.min(i + 1, n.length - 1), c = ve(n[i], n[a], t - i), l = s(o({
+			L: c.L,
+			C: Math.max(c.C, B),
+			h: c.h
+		}));
+		r[e * 4 + 0] = l[0], r[e * 4 + 1] = l[1], r[e * 4 + 2] = l[2], r[e * 4 + 3] = 0;
 	}
+	let i = n[0];
+	return {
+		lut: r,
+		ink: s(o({
+			L: Math.max(0, i.L - ee),
+			C: i.C,
+			h: i.h
+		})),
+		head: s(o({
+			L: Math.min(1, i.L + te),
+			C: i.C,
+			h: i.h
+		}))
+	};
+}
+function ye(e, t) {
+	let { f32: n, i32: r } = e;
+	n[J.r0 + 0] = t.fit.centerX, n[J.r0 + 1] = t.fit.centerY, n[J.r0 + 2] = t.fit.scale, n[J.r0 + 3] = t.aspect, n[J.r1 + 0] = t.markHalfModel, n[J.r1 + 1] = t.inkOffsetStrokes, n[J.r1 + 2] = t.scaffoldFrac, n[J.r1 + 3] = t.edgeMargin, n[J.r2 + 0] = Math.min(Math.max(t.peakAlpha, 0), 1), n[J.r2 + 1] = t.glow, n[J.r2 + 2] = t.squash, n[J.r2 + 3] = t.trailFadeExp, n[J.r3 + 0] = t.trailFloor, n[J.r3 + 1] = t.hueSweep, n[J.r3 + 2] = t.ringStrokeModel, n[J.r3 + 3] = +!!t.showMachine, n[J.ink + 0] = t.ramp.ink[0], n[J.ink + 1] = t.ramp.ink[1], n[J.ink + 2] = t.ramp.ink[2], n[J.ink + 3] = +!!t.rainbowChain, n[J.head + 0] = t.ramp.head[0], n[J.head + 1] = t.ramp.head[1], n[J.head + 2] = t.ramp.head[2], n[J.head + 3] = 0, r[J.ints + 0] = t.sampleCount, r[J.ints + 1] = 16, r[J.ints + 2] = t.chainCount, r[J.ints + 3] = 0;
+	for (let e = 0; e < 64; e++) n[J.lut + e] = t.ramp.lut[e];
 	return e;
 }
-function Q(e) {
-	let t = Math.min(e.length, 64), n = /* @__PURE__ */ new Float32Array(256);
-	for (let r = 0; r < t; r++) {
-		let t = e[r], i = r * 4;
-		n[i + 0] = t.coefficient[0], n[i + 1] = t.coefficient[1], n[i + 2] = t.index, n[i + 3] = 0;
+function be(e) {
+	let t = new Float32Array(Math.max(e.length, 1) * 4);
+	for (let n = 0; n < e.length; n++) {
+		let r = e[n], i = n * 4;
+		t[i + 0] = r.coefficient[0], t[i + 1] = r.coefficient[1], t[i + 2] = r.index, t[i + 3] = 0;
 	}
-	return n;
+	return t;
 }
 //#endregion
-//#region src/components/fourier-field/composables/fourierFieldWGPUSetup.ts
-var le = 128, $ = 4, ue = 64, de = .92, fe = .95, pe = 1.35, me = .34;
-function he(e) {
-	let { canvas: t, config: n, getSpectrum: r, getPalette: i, getHeadT: a, shouldContinue: o, onFrame: s } = e, c = e.getPointerLean;
-	return function(e, l, u) {
-		let d = e.createShaderModule({
-			label: "[FourierField] fourier-field.compute.wgsl",
-			code: ne
-		}), f = e.createShaderModule({
-			label: "[FourierField] fourier-field.render.wgsl",
-			code: re
-		}), p = e.createBuffer({
-			label: "[FourierField] phasors",
-			size: 1024,
-			usage: 136
-		}), m = e.createBuffer({
-			label: "[FourierField] curve-samples",
-			size: 384 * 16,
-			usage: le
-		}), h = e.createBuffer({
-			label: "[FourierField] chain-tips",
-			size: 1040,
-			usage: le
-		}), g = e.createBuffer({
+//#region src/components/fourier-field/renderer/wgpu.ts
+var xe = 128, Q = 4, Se = 64, Ce = 1.35, we = .34, Te = .92, $ = {
+	chain: 0,
+	trail: 1,
+	head: 2
+};
+function Ee(e) {
+	let { canvas: t, config: n, getSpectrum: r, getPalette: i, getHeadT: a, shouldContinue: o, onFrame: s } = e;
+	return function(e, c, l) {
+		let u = e.createShaderModule({
+			label: "[FourierField] compute.wgsl",
+			code: de
+		}), d = e.createShaderModule({
+			label: "[FourierField] render.wgsl",
+			code: fe
+		}), f = e.createBuffer({
 			label: "[FourierField] compute-uniforms",
-			size: K().buffer.byteLength,
+			size: q().buffer.byteLength,
 			usage: 72
-		}), v = e.createBuffer({
+		}), p = e.createBuffer({
 			label: "[FourierField] render-uniforms",
 			size: Y().buffer.byteLength,
 			usage: 72
-		}), y = e.createBindGroupLayout({
+		}), m = e.createBindGroupLayout({
 			label: "[FourierField] compute-bgl",
 			entries: [
 				{
 					binding: 0,
-					visibility: $,
+					visibility: Q,
 					buffer: { type: "uniform" }
 				},
 				{
 					binding: 1,
-					visibility: $,
+					visibility: Q,
 					buffer: { type: "read-only-storage" }
 				},
 				{
 					binding: 2,
-					visibility: $,
+					visibility: Q,
 					buffer: { type: "storage" }
 				},
 				{
 					binding: 3,
-					visibility: $,
+					visibility: Q,
 					buffer: { type: "storage" }
 				}
 			]
-		}), b = e.createComputePipeline({
+		}), h = e.createComputePipeline({
 			label: "[FourierField] compute-pipeline",
-			layout: e.createPipelineLayout({ bindGroupLayouts: [y] }),
+			layout: e.createPipelineLayout({ bindGroupLayouts: [m] }),
 			compute: {
-				module: d,
+				module: u,
 				entryPoint: "cs_main"
 			}
-		}), x = e.createBindGroup({
-			label: "[FourierField] compute-bg",
-			layout: y,
-			entries: [
-				{
-					binding: 0,
-					resource: { buffer: g }
-				},
-				{
-					binding: 1,
-					resource: { buffer: p }
-				},
-				{
-					binding: 2,
-					resource: { buffer: m }
-				},
-				{
-					binding: 3,
-					resource: { buffer: h }
-				}
-			]
-		}), S = e.createBindGroupLayout({
+		}), g = e.createBindGroupLayout({
 			label: "[FourierField] render-bgl",
 			entries: [
 				{
@@ -525,18 +535,7 @@ function he(e) {
 					buffer: { type: "read-only-storage" }
 				}
 			]
-		}), C = e.createPipelineLayout({ bindGroupLayouts: [S] }), w = {
-			color: {
-				srcFactor: "one",
-				dstFactor: "one-minus-src-alpha",
-				operation: "add"
-			},
-			alpha: {
-				srcFactor: "one",
-				dstFactor: "one-minus-src-alpha",
-				operation: "add"
-			}
-		}, T = {
+		}), _ = e.createPipelineLayout({ bindGroupLayouts: [g] }), v = {
 			color: {
 				srcFactor: "one",
 				dstFactor: "one",
@@ -547,74 +546,132 @@ function he(e) {
 				dstFactor: "one",
 				operation: "max"
 			}
-		}, E = (t, n) => e.createRenderPipeline({
-			label: `[FourierField] ribbon-pipeline-L${t}`,
-			layout: C,
+		}, y = (t) => e.createRenderPipeline({
+			label: `[FourierField] pipeline-L${t}`,
+			layout: _,
 			vertex: {
-				module: f,
+				module: d,
 				entryPoint: "vs_main",
 				constants: { LAYER: t }
 			},
 			fragment: {
-				module: f,
+				module: d,
 				entryPoint: "fs_main",
 				constants: { LAYER: t },
 				targets: [{
-					format: u,
-					blend: n
+					format: l,
+					blend: v
 				}]
 			},
 			primitive: { topology: "triangle-list" }
-		}), D = {
-			trail: E(W.trail, w),
-			epicycle: E(W.epicycle, T),
-			head: E(W.head, w),
-			"cel-rope": E(W["cel-rope"], w),
-			"cel-arm": E(W["cel-arm"], w)
-		}, O = e.createBindGroup({
-			label: "[FourierField] render-bg",
-			layout: S,
-			entries: [
-				{
-					binding: 0,
-					resource: { buffer: v }
-				},
-				{
-					binding: 1,
-					resource: { buffer: m }
-				},
-				{
-					binding: 2,
-					resource: { buffer: h }
-				}
-			]
-		}), k = K(), A = Y(), j = null, M = {
+		}), b = {
+			chain: y($.chain),
+			trail: y($.trail),
+			head: y($.head)
+		}, x = q(), S = Y(), C = null, w = null, T = null, E = null, D = null, O = null, k = {
 			centerX: 0,
 			centerY: 0,
 			scale: 1
-		}, N = 0;
-		function P() {
-			let t = r();
-			t !== j && (j = t, N = Math.min(t.length, 64), M = X(t), e.queue.writeBuffer(p, 0, Q(t)));
+		}, A = n.showMachine;
+		function j() {
+			w?.destroy(), T?.destroy(), E?.destroy(), w = null, T = null, E = null;
 		}
-		function F(e) {}
-		function I(r) {
-			s?.(r), P();
-			let o = a(), u = Math.max(1, Math.min(Math.round(n.harmonics), N)), d = n.showEpicycles ? Math.max(1, Math.min(Math.round(n.epicycleArms), u)) : 0;
-			se(k, o, n.trailArc, u, d, 384, N), e.queue.writeBuffer(g, 0, k.buffer);
-			let f = Math.min(t.width, t.height) / Math.max(_(), 1), p = t.width / Math.max(t.height, 1), m = ce(n.trailWidth, M.scale, f), h = 12 / (Math.max(M.scale, 1e-6) * Math.max(f, 1)), y = c?.() ?? {
-				x: 0,
-				y: 0
-			}, S = y.x !== 0 || y.y !== 0 ? {
-				...M,
-				centerX: M.centerX - y.x,
-				centerY: M.centerY - y.y
-			} : M;
-			Z(A, S, p, m, de, fe, pe, me, n.intensity, n.showEpicycles, n.rainbowChain, n.squashGain, n.celGain, h, 384, d, i()), e.queue.writeBuffer(v, 0, A.buffer);
-			let C = e.createCommandEncoder({ label: "[FourierField] frame" }), w = C.beginComputePass();
-			w.setPipeline(b), w.setBindGroup(0, x), w.dispatchWorkgroups(Math.ceil(384 / ue)), w.end();
-			let T = l.getCurrentTexture().createView(), E = C.beginRenderPass({ colorAttachments: [{
-				view: T,
+		function M() {
+			let t = r(), i = A !== n.showMachine;
+			if (!(t === C && !i)) {
+				if (t !== C) {
+					C = t, j();
+					let n = Math.max(t.terms.length, 1);
+					w = e.createBuffer({
+						label: "[FourierField] phasors",
+						size: n * 16,
+						usage: 136
+					}), T = e.createBuffer({
+						label: "[FourierField] curve-samples",
+						size: 384 * 16,
+						usage: xe
+					}), E = e.createBuffer({
+						label: "[FourierField] chain-tips",
+						size: (n + 1) * 16,
+						usage: xe
+					}), e.queue.writeBuffer(w, 0, be(t.terms)), D = e.createBindGroup({
+						label: "[FourierField] compute-bg",
+						layout: m,
+						entries: [
+							{
+								binding: 0,
+								resource: { buffer: f }
+							},
+							{
+								binding: 1,
+								resource: { buffer: w }
+							},
+							{
+								binding: 2,
+								resource: { buffer: T }
+							},
+							{
+								binding: 3,
+								resource: { buffer: E }
+							}
+						]
+					}), O = e.createBindGroup({
+						label: "[FourierField] render-bg",
+						layout: g,
+						entries: [
+							{
+								binding: 0,
+								resource: { buffer: p }
+							},
+							{
+								binding: 1,
+								resource: { buffer: T }
+							},
+							{
+								binding: 2,
+								resource: { buffer: E }
+							}
+						]
+					});
+				}
+				A = n.showMachine, k = _e(C, A);
+			}
+		}
+		let N = Z(i()), P = De(i());
+		function F() {
+			let e = i(), t = De(e);
+			t !== P && (P = t, N = Z(e));
+		}
+		function I(e) {}
+		function L(r) {
+			if (s?.(r), M(), F(), !C || !D || !O) return;
+			let i = C.terms.length, o = Math.max(1, Math.min(Math.round(n.harmonics), i)), l = n.showMachine ? o : 0;
+			me(x, a(), n.trailArc, o, 384, i), e.queue.writeBuffer(f, 0, x.buffer);
+			let u = Math.min(typeof window > "u" ? 1 : window.devicePixelRatio || 1, 2), d = Math.min(t.width, t.height) / Math.max(u, 1), m = t.width / Math.max(t.height, 1), g = X(n.markStroke, k.scale, d) * .5, _ = X(n.markStroke, k.scale, d), v = 12 / (Math.max(k.scale, 1e-6) * Math.max(d, 1));
+			ye(S, {
+				fit: k,
+				aspect: m,
+				markHalfModel: g,
+				inkOffsetStrokes: n.inkOffset,
+				scaffoldFrac: re,
+				edgeMargin: v,
+				peakAlpha: Te * n.intensity,
+				glow: n.glow,
+				squash: n.squash,
+				trailFadeExp: Ce,
+				trailFloor: we,
+				hueSweep: ne,
+				ringStrokeModel: _,
+				showMachine: n.showMachine,
+				rainbowChain: n.rainbowChain,
+				sampleCount: 384,
+				chainCount: l,
+				ramp: N
+			}), e.queue.writeBuffer(p, 0, S.buffer);
+			let y = e.createCommandEncoder({ label: "[FourierField] frame" }), w = y.beginComputePass();
+			w.setPipeline(h), w.setBindGroup(0, D), w.dispatchWorkgroups(Math.ceil(384 / Se)), w.end();
+			let T = y.beginRenderPass({ colorAttachments: [{
+				view: c.getCurrentTexture().createView(),
 				clearValue: {
 					r: 0,
 					g: 0,
@@ -624,484 +681,174 @@ function he(e) {
 				loadOp: "clear",
 				storeOp: "store"
 			}] });
-			E.setBindGroup(0, O);
-			let j = ie({
-				sampleCount: 384,
-				armCount: d,
-				showEpicycles: n.showEpicycles,
-				celGain: n.celGain
-			});
-			for (let e of j) E.setPipeline(D[e.kind]), E.draw(6, e.instanceCount, 0, 0);
-			E.end(), e.queue.submit([C.finish()]);
+			T.setBindGroup(0, O), l > 0 && (T.setPipeline(b.chain), T.draw(6, l, 0, 0)), T.setPipeline(b.trail), T.draw(6, 383, 0, 0), T.setPipeline(b.head), T.draw(6, 1, 0, 0), T.end(), e.queue.submit([y.finish()]);
 		}
 		return {
-			frame: I,
+			frame: L,
 			shouldContinue: o,
-			resize: F,
+			resize: I,
 			teardown: () => {
-				p.destroy(), m.destroy(), h.destroy(), g.destroy(), v.destroy();
+				j(), f.destroy(), p.destroy();
 			}
 		};
 	};
 }
-//#endregion
-//#region src/components/fourier-field/shaders/fourier-field.glsl.ts
-var ge = "#version 300 es\n// Must equal the WGSL twin and FOURIER_TANGENT_EPS in constants.ts.\n#define RIBBON_UNDERGLOW_SCALE 2.2\n\nin vec2 aCorner;   // the unit quad corner ∈ [0,1]²\nin vec4 aSeg;      // (ax, ay, bx, by) — segment endpoints in MODEL space\nin vec4 aData;     // (age, strokeHalf, arg2, _pad) — strokeHalf/age/arg2 per layer\n\nuniform vec4 uFit;         // (centerX, centerY, scale, aspect) — model→clip fit\nuniform int  uLayer;       // 0 trail · 1 epicycle · 2 head · 3 cel-rope · 4 cel-arm\nuniform float uEdgeMargin; // AA-feather slop in MODEL units (a few CSS px), padding the bbox\n\nout vec2 vP;       // the MODEL-space fragment coordinate (the fs runs the SDF on it)\nout vec2 vA;\nout vec2 vB;\nout float vAge;\nout float vHalf;\nout float vArg2;\n\nvoid main() {\n  vec2 a = aSeg.xy;\n  vec2 b = aSeg.zw;\n  float strokeHalf = aData.y;\n  vA = a; vB = b; vAge = aData.x; vHalf = strokeHalf; vArg2 = aData.z;\n\n  vec2 pos;\n  if (uLayer == 1 || uLayer == 2) {\n    // AABB around a — the epicycle orbit RING (radius = |b-a|) or the head HALO.\n    float ext = (uLayer == 1) ? (length(b - a) + strokeHalf * 0.7) : (strokeHalf * 4.5);\n    ext += uEdgeMargin;\n    pos = a + (aCorner * 2.0 - 1.0) * ext;\n  } else {\n    // Capsule along a→b padded by the covered extent (trail under-glow, cel stroke).\n    float ext = (uLayer == 0) ? (strokeHalf * RIBBON_UNDERGLOW_SCALE) : strokeHalf;\n    ext += uEdgeMargin;\n    vec2 d = b - a;\n    float len = length(d);\n    vec2 dir = len > 1e-6 ? d / len : vec2(1.0, 0.0);\n    vec2 perp = vec2(-dir.y, dir.x);\n    vec2 along = mix(a - dir * ext, b + dir * ext, aCorner.x);\n    pos = along + perp * (aCorner.y * 2.0 - 1.0) * ext;\n  }\n\n  vP = pos;\n  vec2 center = uFit.xy;\n  float scale = max(uFit.z, 1e-6);\n  float aspect = max(uFit.w, 1e-4);\n  // model → clip (the inverse of the fs's p = center + vClip·aspect, scale).\n  float clipX = (pos.x - center.x) * scale / aspect;\n  float clipY = (pos.y - center.y) * scale;\n  gl_Position = vec4(clipX, clipY, 0.0, 1.0);\n}\n", _e = `#version 300 es
-precision highp float;
-
-#define MAX_FOURIER_STOPS 4
-// Must equal the WGSL twin and FOURIER_TANGENT_EPS in constants.ts.
-#define TANGENT_EPS 1e-4
-#define SPEED_REF_HALFWIDTHS 6.0
-// The thick luminous ribbon mirrors RIBBON_TAIL_FRAC verbatim
-// from constants.ts because the GLSL twin cannot import a TS const; parity coverage verifies the
-// two copies are equal so the mid-body floor (RIBBON_HEAD_FLOOR_PX) can never drift off it.
-#define RIBBON_TAIL_FRAC 0.4
-#define RIBBON_UNDERGLOW_SCALE 2.2
-#define RIBBON_UNDERGLOW_ALPHA 0.16
-
-in vec2 vP;
-in vec2 vA;
-in vec2 vB;
-in float vAge;
-in float vHalf;
-in float vArg2;
-out vec4 fragColor;
-
-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  uLayer;      // 0 trail · 1 epicycle · 2 head · 3 cel-rope · 4 cel-arm
-uniform int  uStopCount;
-uniform vec3 uPalette[MAX_FOURIER_STOPS]; // linear-sRGB stops
-
-const float PI = 3.141592653589793;
-
-${y}
-${x}
-
-// Negative-safe cube root (the WGSL chunk's cbrt3 twin; the GLSL chunk inlines it).
-vec3 cbrt3(vec3 v) { return sign(v) * pow(abs(v), vec3(1.0 / 3.0)); }
-
-vec3 samplePaletteLin(float t) {
-  if (uStopCount <= 1) return uPalette[0];
-  float n = float(uStopCount);
-  float ft = clamp(t, 0.0, 1.0) * (n - 1.0);
-  int i0 = int(floor(ft));
-  int i1 = min(i0 + 1, uStopCount - 1);
-  float f = ft - float(i0);
-  vec3 labA = LMS_TO_OKLAB * cbrt3(LINEAR_SRGB_TO_LMS * uPalette[i0]);
-  vec3 labB = LMS_TO_OKLAB * cbrt3(LINEAR_SRGB_TO_LMS * uPalette[i1]);
-  return oklabToLinearSrgb(mix(labA, labB, f));
+function De(e) {
+	let t = "";
+	for (let n of e) t += `${n.L.toFixed(4)},${n.C.toFixed(4)},${n.h.toFixed(2)};`;
+	return t;
 }
-
-vec3 chainColorLin(float seg, bool rainbow) {
-  vec3 baseLin = uPalette[0];
-  if (!rainbow) return baseLin;
-  vec3 lab = LMS_TO_OKLAB * cbrt3(LINEAR_SRGB_TO_LMS * baseLin);
-  vec3 lch = oklabToOklch(lab);
-  float hueShift = mix(-0.45, 1.15, clamp(seg, 0.0, 1.0));
-  vec3 lifted = vec3(0.66, max(lch.y, 0.14), lch.z + hueShift);
-  return oklabToLinearSrgb(oklchToOklab(lifted));
-}
-
-float segDist(vec2 p, vec2 a, vec2 b) {
-  vec2 pa = p - a;
-  vec2 ba = b - a;
-  float h = clamp(dot(pa, ba) / max(dot(ba, ba), 1e-8), 0.0, 1.0);
-  return length(pa - ba * h);
-}
-
-// The head travel frame (T, ŝ), the GLSL twin of the WGSL headFrame.
-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 p = vP;
-  float aa = max(fwidth(p.x) + fwidth(p.y), 1e-5) * 0.75;
-  float peak = uTrail.y * uEnv.y;
-  float headGlow = uTrail.z * uEnv.y;
-  float fadeExp = uTrail.w;
-  float trailFloor = uEnv.x;
-  bool rainbow = uEnv.w > 0.5;
-  float squashGain = uLoom.x;
-  float celGain = uLoom.y;
-  float halfW = vHalf;
-
-  if (uLayer == 0) {
-    // ── TRAIL — the tapered luminous ribbon over its own soft under-glow ──
-    float age = vAge;
-    float d = segDist(p, vA, vB);
-    // Head→tail taper: the ribbon half-width scales with age (thick head, thin tail).
-    float ribbonHalf = halfW * (RIBBON_TAIL_FRAC + (1.0 - RIBBON_TAIL_FRAC) * age);
-    vec3 lin = samplePaletteLin(1.0 - age * 0.4);
-    vec3 rgb = clamp(linearToSrgb(lin), vec3(0.0), vec3(1.0));
-    // Soft under-glow: a wider, low-alpha copy under the crisp ribbon (one color event).
-    float glowHalf = ribbonHalf * RIBBON_UNDERGLOW_SCALE;
-    float glowCover = 1.0 - smoothstep(glowHalf, glowHalf + aa * 3.0, d);
-    float ga = peak * RIBBON_UNDERGLOW_ALPHA * pow(age, fadeExp) * glowCover;
-    // The crisp tapered ribbon core.
-    float cover = 1.0 - smoothstep(ribbonHalf, ribbonHalf + aa, d);
-    float ca = max(peak * pow(age, fadeExp), peak * trailFloor) * cover;
-    // core OVER glow OVER transparent (both premultiplied on the SAME rgb → out = rgb·outA).
-    float outA = ca + ga * (1.0 - ca);
-    fragColor = vec4(rgb * outA, outA);
-  } else if (uLayer == 1) {
-    // ── EPICYCLE — orbit RING + ARM + joint DOT union (MAX-blended, no join seam) ──
-    float seg = vArg2;
-    vec3 lin = chainColorLin(seg, rainbow);
-    vec3 rgb = clamp(linearToSrgb(lin), vec3(0.0), vec3(1.0));
-    float radius = length(vB - vA);
-    float dRing = abs(length(p - vA) - radius);
-    float ringW = max(halfW * 0.45, aa);
-    float ringMask = (1.0 - smoothstep(ringW, ringW + aa, dRing)) * 0.5;
-    float dArm = segDist(p, vA, vB);
-    float armMask = 1.0 - smoothstep(halfW * 0.55, halfW * 0.55 + aa, dArm);
-    float dotR = max(halfW * 0.7, aa * 2.0);
-    float dDot = length(p - vA);
-    float dotMask = 1.0 - smoothstep(dotR, dotR + aa, dDot);
-    float m = clamp(max(max(ringMask, armMask), dotMask), 0.0, 1.0) * peak * 0.7;
-    fragColor = vec4(rgb * m, m);
-  } else if (uLayer == 2) {
-    // ── HEAD — squash-and-stretch (§2b): halo + saturated core + white specular ──
-    vec2 head = vA;
-    vec2 headBack = vB;
-    HeadFrame fr = headFrame(head, headBack, halfW);
-    float dHead = headAniso(p, head, fr, squashGain);
-    float coreR = halfW * 1.5;
-    float haloR = coreR * 3.0;
-    vec3 headRgb = clamp(linearToSrgb(samplePaletteLin(0.0)), vec3(0.0), vec3(1.0));
-    float halo = (1.0 - smoothstep(0.0, haloR, dHead)) * headGlow * 0.35;
-    vec4 accum = vec4(headRgb * halo, halo);
-    float core = (1.0 - smoothstep(coreR, coreR + aa, dHead)) * headGlow;
-    accum = vec4(headRgb * core, core) + accum * (1.0 - core);
-    float spec = (1.0 - smoothstep(coreR * 0.4, coreR * 0.4 + aa, dHead)) * headGlow * 0.9;
-    accum = vec4(vec3(1.0) * spec, spec) + accum * (1.0 - spec);
-    fragColor = accum;
-  } else {
-    // ── CEL — the technicolor ink shadow (rope uLayer==3, arm uLayer==4) ──
-    float celA = clamp(celGain, 0.0, 1.0);
-    float d = segDist(p, vA, vB);
-    float cover = 1.0 - smoothstep(halfW, halfW + aa, d);
-    float m = cover * celA * peak * vArg2; // vArg2 = celStrength (1.0 rope / 0.7 arm)
-    fragColor = vec4(0.0, 0.0, 0.0, m);
-  }
-}
-`, ve = 256, ye = 64, be = .92, xe = .95, Se = 1.35, Ce = .34;
-function we(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);
-		throw e.deleteShader(r), Error(`[FourierField] shader compile failed: ${t}`);
-	}
-	return r;
-}
-function Te(e) {
-	let { canvas: t, config: n, getSpectrum: r, getPalette: i, getHeadT: a, shouldContinue: o, onFrame: s } = e, l = e.getPointerLean;
-	return function(e) {
-		let u = we(e, e.VERTEX_SHADER, ge), d = we(e, e.FRAGMENT_SHADER, _e), 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, ae, e.STATIC_DRAW);
-		let g = e.getAttribLocation(f, "aCorner");
-		e.enableVertexAttribArray(g), e.vertexAttribPointer(g, 2, e.FLOAT, !1, 0, 0), e.vertexAttribDivisor(g, 0);
-		let v = new Float32Array(639 * 8), y = e.createBuffer();
-		e.bindBuffer(e.ARRAY_BUFFER, y), e.bufferData(e.ARRAY_BUFFER, v.byteLength, e.DYNAMIC_DRAW);
-		let b = e.getAttribLocation(f, "aSeg"), x = e.getAttribLocation(f, "aData");
-		e.enableVertexAttribArray(b), e.enableVertexAttribArray(x), e.vertexAttribPointer(b, 4, e.FLOAT, !1, 32, 0), e.vertexAttribPointer(x, 4, e.FLOAT, !1, 32, 16), e.vertexAttribDivisor(b, 1), e.vertexAttribDivisor(x, 1), e.bindVertexArray(null);
-		let S = (t) => e.getUniformLocation(f, t), C = S("uFit"), w = S("uTrail"), T = S("uEnv"), E = S("uLoom"), D = S("uLayer"), O = S("uEdgeMargin"), k = S("uStopCount"), A = S("uPalette[0]"), j = new Float32Array(ve * 3), M = /* @__PURE__ */ new Float32Array(130), N = /* @__PURE__ */ new Float32Array(12), P = null, F = {
-			centerX: 0,
-			centerY: 0,
-			scale: 1
-		}, I = 0;
-		function L() {
-			let e = r();
-			e !== P && (P = e, I = Math.min(e.length, ye), F = X(e));
-		}
-		function R(t) {
-			e.viewport(0, 0, t.w, t.h);
-		}
-		function z(r) {
-			s?.(r), L();
-			let o = P;
-			if (!o) return;
-			let u = a(), d = Math.max(1, Math.min(Math.round(n.harmonics), I)), m = n.showEpicycles ? Math.max(1, Math.min(Math.round(n.epicycleArms), d)) : 0, g = ve, S = Math.max(g - 1, 1);
-			for (let e = 0; e < g; e++) {
-				let t = e / S, r = 1 - t, i = u - n.trailArc * t;
-				i -= Math.floor(i);
-				let [a, s] = h(o, i, d), c = e * 3;
-				j[c + 0] = a, j[c + 1] = s, j[c + 2] = r;
-			}
-			let R = Math.min(m, d);
-			for (let e = 0; e <= ye; e++) {
-				let t = e * 2;
-				if (e <= R) {
-					let [n, r] = h(o, u, e);
-					M[t + 0] = n, M[t + 1] = r;
-				} else M[t + 0] = 0, M[t + 1] = 0;
-			}
-			let z = t.width / Math.max(t.height, 1), B = Math.min(t.width, t.height) / Math.max(_(), 1), V = ce(n.trailWidth, F.scale, B), H = V * .5, ee = 12 / (Math.max(F.scale, 1e-6) * Math.max(B, 1)), U = j[0], te = j[1], ne = j[3], re = j[4], ae = U - ne, oe = te - re, G = Math.hypot(ae, oe), K = G > 1e-4 ? ae / G : 1, se = G > 1e-4 ? oe / G : 0, q = -K * H * 1.4, J = -se * H * 1.4, Y = ie({
-				sampleCount: g,
-				armCount: m,
-				showEpicycles: n.showEpicycles,
-				celGain: n.celGain
-			}), X = /* @__PURE__ */ new Map(), Z = 0, Q = (e, t, n, r, i, a, o) => {
-				v[Z++] = e, v[Z++] = t, v[Z++] = n, v[Z++] = r, v[Z++] = i, v[Z++] = a, v[Z++] = o, v[Z++] = 0;
-			};
-			for (let e of Y) if (X.set(e.kind, Z), e.kind === "cel-rope") for (let e = 0; e < g - 1; e++) {
-				let t = e * 3;
-				Q(j[t] + q, j[t + 1] + J, j[t + 3] + q, j[t + 4] + J, 0, H, 1);
-			}
-			else if (e.kind === "cel-arm") for (let e = 0; e < m; e++) {
-				let t = e * 2;
-				Q(M[t] + q, M[t + 1] + J, M[t + 2] + q, M[t + 3] + J, 0, H * .55, .7);
-			}
-			else if (e.kind === "epicycle") {
-				let e = Math.max(m - 1, 1);
-				for (let t = 0; t < m; t++) {
-					let n = t * 2;
-					Q(M[n], M[n + 1], M[n + 2], M[n + 3], 0, H, t / e);
-				}
-			} else if (e.kind === "trail") for (let e = 0; e < g - 1; e++) {
-				let t = e * 3, n = Math.max(j[t + 2], j[t + 5]);
-				Q(j[t], j[t + 1], j[t + 3], j[t + 4], n, H, 0);
-			}
-			else Q(j[0], j[1], j[3], j[4], 0, H, 0);
-			let le = Z, $ = i(), ue = Math.min($.length, 4);
-			for (let e = 0; e < 4; e++) {
-				let t = c($[Math.min(e, ue - 1)] ?? $[0]);
-				N[e * 3 + 0] = t[0], N[e * 3 + 1] = t[1], N[e * 3 + 2] = t[2];
-			}
-			e.useProgram(f), e.bindVertexArray(p), e.enable(e.BLEND), e.clearColor(0, 0, 0, 0), e.clear(e.COLOR_BUFFER_BIT), e.bindBuffer(e.ARRAY_BUFFER, y), e.bufferSubData(e.ARRAY_BUFFER, 0, v.subarray(0, le));
-			let de = l?.() ?? {
-				x: 0,
-				y: 0
-			};
-			e.uniform4f(C, F.centerX - de.x, F.centerY - de.y, F.scale, z), e.uniform4f(w, V, be, xe, Se), e.uniform4f(T, Ce, n.intensity, +!!n.showEpicycles, +!!n.rainbowChain), e.uniform4f(E, n.squashGain, n.celGain, 0, 0), e.uniform1f(O, ee), e.uniform1i(k, ue), e.uniform3fv(A, N);
-			for (let t of Y) {
-				let n = (X.get(t.kind) ?? 0) * 4;
-				e.vertexAttribPointer(b, 4, e.FLOAT, !1, 32, n), e.vertexAttribPointer(x, 4, e.FLOAT, !1, 32, n + 16), e.uniform1i(D, W[t.kind]), t.blend === "max" ? (e.blendEquation(e.MAX), e.blendFunc(e.ONE, e.ONE)) : (e.blendEquation(e.FUNC_ADD), e.blendFunc(e.ONE, e.ONE_MINUS_SRC_ALPHA)), e.drawArraysInstanced(e.TRIANGLE_STRIP, 0, 4, t.instanceCount);
-			}
-			e.blendEquation(e.FUNC_ADD);
-		}
-		return {
-			frame: z,
-			shouldContinue: o,
-			resize: R,
-			teardown: () => {
-				e.deleteProgram(f), e.deleteBuffer(m), e.deleteBuffer(y), e.deleteVertexArray(p);
-			}
-		};
+var Oe = "[FourierField] WebGPU is required. This field paints the transform itself, so it ships one renderer and no lookalike — where WebGPU is absent it declares the failure and paints nothing.";
+function ke() {
+	return function() {
+		throw Error(Oe);
 	};
 }
 //#endregion
-//#region src/components/fourier-field/composables/useFourierField.ts
-function Ee(e, t) {
-	let { config: r, getSpectrum: o, getPalette: s } = t, c = t.mode ?? "live", l = t.frozenT ?? .34, u = t.periodS ?? 16, d = 0, f = -1, p = 0, m = 0;
-	function h(e) {
-		if (p === 0 && m === 0) return;
-		let t = -64 * p - 2 * .62 * 8 * m;
-		m += t * e, p += m * e, Math.abs(p) < 1e-4 && Math.abs(m) < 1e-4 && (p = 0, m = 0);
-	}
-	let g = n({ respectReducedMotion: r.respectReducedMotion }), v = () => (t.freeze?.() ?? !1) || (I?.reducedMotion ?? !1);
-	function y(e) {
-		b(e);
-	}
-	function b(e) {
-		let n = f >= 0 ? (e - f) * 1e3 : 16.7;
-		f = e;
-		let i = t.routePointer?.();
-		if (t.routePointer && (g.setActive(i?.active ?? !1), i?.active && g.setPointer(i.x, i.y)), g.tick(n), v()) {
-			d = l, p = 0, m = 0;
-			return;
-		}
-		let a = Math.min(Math.max(n / 1e3, 0), .05);
-		if (r.interactive && g.active.value) {
-			let e = r.speed / u + g.velocity.value.x * B + p;
-			d = (d + e * a) % 1, d < 0 && (d += 1);
-			let t = g.burst.value * 4;
-			t !== 0 && (p = t, m = 0), h(a);
-			return;
-		}
-		let o = r.speed / u + p;
-		d = (d + o * a) % 1, d < 0 && (d += 1), h(a);
-	}
-	let x = () => d, w = null, T = {
-		centerX: 0,
-		centerY: 0,
-		scale: 1
-	}, E = () => {
-		let e = o();
-		return e !== w && (w = e, T = X(e)), T;
-	}, D = () => {
-		if (!r.interactive) return {
-			x: 0,
-			y: 0
-		};
-		let t = e.value;
-		if (!t || !t.width || !t.height) return {
-			x: 0,
-			y: 0
-		};
-		let { leanX: n, leanY: o } = a(i(g), {
-			aspect: t.width / t.height,
-			scale: Math.max(E().scale, 1e-6)
+//#region src/components/fourier-field/useFourierField.ts
+function Ae(e, t) {
+	let { config: n, getSpectrum: i, getPalette: a } = t, o = t.mode ?? "live", s = t.interactive, c = ue(), l = -1, u = j(0), d = -Infinity, f = r({ respectReducedMotion: n.respectReducedMotion }), p = () => (t.freeze?.() ?? !1) || (C?.reducedMotion ?? !1);
+	function m(e) {
+		let t = l >= 0 ? (e - l) * 1e3 : 16.7;
+		l = e, f.tick(t);
+		let r = s() && f.active.value;
+		c.step({
+			dt: t / 1e3,
+			speed: n.speed,
+			scrubVelocity: r ? f.velocity.value.x : 0,
+			burst: r ? f.burst.value : 0,
+			engaged: r,
+			frozen: p()
 		});
-		return {
-			x: n,
-			y: o
-		};
-	}, O = (e) => {
-		g.onPointerMove(e), r.interactive && I?.wake();
-	}, k = () => {
-		g.onPointerEnter(), r.interactive && I?.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);
+		let i = e * 1e3;
+		i - d >= 100 && (d = i, u.value = c.headT);
 	}
-	function N(e) {
-		let t = A(e);
-		t.removeEventListener("pointermove", O), t.removeEventListener("pointerenter", k), t.removeEventListener("pointerleave", g.onPointerLeave);
+	let h = (e) => {
+		f.onPointerMove(e), s() && C?.wake();
+	}, _ = () => {
+		f.onPointerEnter(), s() && C?.wake();
+	}, v = () => {
+		f.onPointerLeave();
+	}, b = (e) => e.parentElement ?? e;
+	function x(e) {
+		let t = b(e);
+		t.addEventListener("pointermove", h), t.addEventListener("pointerenter", _), t.addEventListener("pointerleave", v);
 	}
-	let I = null, L = F(C("webgpu")), R = !1, z = () => {
-		if (R) return null;
+	function S(e) {
+		let t = b(e);
+		t.removeEventListener("pointermove", h), t.removeEventListener("pointerenter", _), t.removeEventListener("pointerleave", v);
+	}
+	let C = null, w = j(y("webgpu")), T = (e) => e.engine === "webgpu" ? e : {
+		...e,
+		engine: "webgpu",
+		adapter: "WebGPU unavailable"
+	}, E = !1, D = () => {
+		if (E) return null;
 		let t = e.value;
-		return t ? (I || (j(t), I = S(t, {
-			mode: c,
-			respectReducedMotion: r.respectReducedMotion,
-			dprPolicy: _,
+		return t ? (C || (x(t), C = g(t, {
+			mode: o,
+			respectReducedMotion: n.respectReducedMotion,
+			dprPolicy: () => 2,
+			composeIntersectionPark: !0,
 			revealBloom: !0,
-			setupWGPU: he({
+			setupWGPU: Ee({
 				canvas: t,
-				config: r,
-				getSpectrum: o,
-				getPalette: s,
-				getHeadT: x,
+				config: n,
+				getSpectrum: i,
+				getPalette: a,
+				getHeadT: () => c.headT,
 				shouldContinue: () => !0,
-				onFrame: y,
-				getPointerLean: D
+				onFrame: m
 			}),
-			setupGL: Te({
-				canvas: t,
-				config: r,
-				getSpectrum: o,
-				getPalette: s,
-				getHeadT: x,
-				shouldContinue: () => !0,
-				onFrame: y,
-				getPointerLean: D
-			}),
-			onStatus: (e) => L.value = e
-		}), I.armAsync().catch(() => void 0)), I) : null;
+			setupGL: ke(),
+			onStatus: (e) => w.value = T(e)
+		}), C.armAsync().catch(() => void 0)), C) : null;
 	};
-	queueMicrotask(() => z());
-	let V = {
+	queueMicrotask(() => D());
+	let k = {
 		get backend() {
-			return z()?.backend ?? "webgpu";
+			return D()?.backend ?? "webgpu";
 		},
-		pause: () => z()?.suspend("manual"),
-		resume: () => z()?.resume("manual"),
-		wake: () => z()?.wake(),
-		renderAt: (e) => z()?.renderAt(e),
+		pause: () => D()?.suspend("manual"),
+		resume: () => D()?.resume("manual"),
+		wake: () => D()?.wake(),
 		get reducedMotion() {
-			return I?.reducedMotion ?? !1;
+			return C?.reducedMotion ?? !1;
 		},
 		get headT() {
-			return d;
+			return c.headT;
 		},
-		rendererStatus: P(L),
+		headTLive: A(u),
+		rendererStatus: A(w),
 		setHeadT: (e) => {
-			d = (e % 1 + 1) % 1, z()?.wake();
+			c.set(e), u.value = c.headT, D()?.wake();
+		},
+		flick: (e) => {
+			c.flick(e), D()?.wake();
 		},
 		dispose: () => {
-			if (R) return;
-			R = !0;
+			if (E) return;
+			E = !0;
 			let t = e.value;
-			t && N(t), g.dispose(), I?.dispose();
+			t && S(t), f.dispose(), C?.dispose();
 		}
 	};
-	return M(() => V.dispose()), V;
+	return O(() => k.dispose()), k;
 }
 //#endregion
-//#region src/components/fourier-field/FourierField.vue
-var De = /*#__PURE__*/ t(/* @__PURE__ */ k({
+//#region src/components/fourier-field/FourierField.vue?vue&type=script&setup=true&lang.ts
+var je = [
+	"role",
+	"tabindex",
+	"aria-label",
+	"aria-valuemin",
+	"aria-valuemax",
+	"aria-valuenow",
+	"aria-valuetext"
+], Me = /*#__PURE__*/ n(/* @__PURE__ */ T({
 	__name: "FourierField",
 	props: {
 		config: {},
 		spectrum: {},
 		getPalette: {},
 		color: {},
-		colorResolver: {},
 		seed: { default: "" },
 		freeze: {
 			type: Boolean,
 			default: !1
+		},
+		interactive: {
+			type: Boolean,
+			default: !0
 		}
 	},
 	emits: ["rendererStatus"],
-	setup(t, { expose: n, emit: i }) {
-		let a = i, c = t, u = I("hostRef"), d = I("canvasRef"), { isDark: f } = o(), h = r(), g = E(() => {
-			let e = c.config ?? te, t = !c.config || e.interactive;
-			return {
-				...e,
-				interactive: t
-			};
-		}), _ = E(() => !!c.config && g.value.interactive), v = c.config ? void 0 : () => ({
-			x: h.pointer.value.x,
-			y: h.pointer.value.y,
-			active: h.active.value
-		}), y = E(() => {
-			if (c.spectrum && c.spectrum.length > 0) return c.spectrum;
-			let e = l[g.value.source];
-			return e ? m(e) : p(w(T((c.freeze ? "fourier-field/frozen" : c.seed || "fourier-field") + c.seed)), {
-				harmonics: Math.min(g.value.harmonics + 4, 62),
-				harmonicScale: g.value.harmonicScale
-			});
-		}), b = () => y.value;
-		function x(t) {
-			if (!t.includes("var(") && !t.includes("light-dark(")) return t;
-			let n = u.value;
-			if (typeof window > "u" || !n) return t;
-			if (t.includes("var(")) return e(t, n);
+	setup(e, { expose: n, emit: r }) {
+		let o = r, s = e, l = M("hostRef"), u = M("canvasRef"), { isDark: d } = i(), m = S(() => s.config ?? U), h = S(() => {
+			if (s.spectrum && s.spectrum.length > 0) return L(s.spectrum);
+			let e = m.value.source;
+			if (e !== "elliptic" && !(e in c)) throw Error(`[FourierField] unknown source "${String(e)}". Pass "elliptic", a key of FOURIER_FIGURES, or an explicit \`spectrum\`.`);
+			return L(e === "elliptic" ? f(b(x(`fourier-field/${s.seed}`)), m.value.richness) : p(c[e]));
+		}), g = () => h.value, _ = S(() => h.value.terms.length), v = S(() => Math.max(1, Math.min(Math.round(m.value.harmonics), _.value))), y = S(() => `N ${v.value}/${_.value}`);
+		function T(e) {
+			if (!e.includes("var(") && !e.includes("light-dark(")) return e;
+			let n = l.value;
+			if (typeof window > "u" || !n) return e;
+			if (e.includes("var(")) return t(e, n);
 			let r = n.style.color;
-			n.style.color = t;
+			n.style.color = e;
 			let i = getComputedStyle(n).color;
-			return n.style.color = r, i || t;
+			return n.style.color = r, i || e;
 		}
-		let S = F(g.value.palette);
-		function C() {
-			if (c.getPalette) {
-				S.value = c.getPalette();
-				return;
-			}
-			if (f.value, c.color) {
-				let e = x(c.color);
+		let O = j(m.value.palette);
+		function A() {
+			if (s.getPalette) O.value = s.getPalette();
+			else if (s.color) {
+				d.value;
+				let e = T(s.color);
 				if (e.includes("var(") || e.includes("light-dark(")) return;
-				let t = s(e);
-				S.value = [{
+				let t = a(e);
+				O.value = [{
 					L: Math.max(.5, t.L),
 					C: Math.max(.12, t.C),
 					h: t.h
@@ -1110,50 +857,91 @@ var De = /*#__PURE__*/ t(/* @__PURE__ */ k({
 					C: t.C * .4,
 					h: t.h + 18
 				}];
-				return;
-			}
-			S.value = g.value.palette;
+			} else O.value = m.value.palette;
+			if (O.value.length === 0) throw Error("[FourierField] the palette is empty — there is nothing to paint with.");
 		}
-		let k = Ee(d, {
+		let P = Ae(u, {
 			config: new Proxy({}, {
-				get: (e, t) => Reflect.get(g.value, t),
-				has: (e, t) => Reflect.has(g.value, t),
-				ownKeys: () => Reflect.ownKeys(g.value),
-				getOwnPropertyDescriptor: (e, t) => Reflect.getOwnPropertyDescriptor(g.value, t)
+				get: (e, t) => Reflect.get(m.value, t),
+				has: (e, t) => Reflect.has(m.value, t),
+				ownKeys: () => Reflect.ownKeys(m.value),
+				getOwnPropertyDescriptor: (e, t) => Reflect.getOwnPropertyDescriptor(m.value, t)
 			}),
-			getSpectrum: b,
-			getPalette: () => S.value,
-			freeze: () => c.freeze,
-			routePointer: v
+			getSpectrum: g,
+			getPalette: () => O.value,
+			interactive: () => s.interactive,
+			freeze: () => s.freeze
 		});
-		return L(k.rendererStatus, (e) => a("rendererStatus", e), {
+		N(P.rendererStatus, (e) => o("rendererStatus", e), {
 			immediate: !0,
 			flush: "sync"
-		}), L(() => c.config, () => k.wake(), { deep: !0 }), L([
-			() => c.color,
-			() => c.getPalette,
-			f
-		], C, { immediate: !0 }), j(() => {
-			C();
-		}), L(f, () => k.wake()), L(() => c.freeze, () => k.wake()), n({
-			backend: () => k.backend,
-			pause: k.pause,
-			resume: k.resume,
-			wake: k.wake,
-			renderAt: k.renderAt,
-			setHeadT: k.setHeadT,
-			rendererStatus: k.rendererStatus
-		}), (e, t) => (N(), D("div", {
+		}), N(() => s.config, () => P.wake(), { deep: !0 }), N([
+			() => s.color,
+			() => s.getPalette,
+			d
+		], A, { immediate: !0 }), D(A), N(d, () => P.wake()), N(() => s.freeze, () => P.wake());
+		let F = j(!1), I = S(() => Number(P.headTLive.value.toFixed(3))), R = S(() => `${y.value} · ${Math.round(P.headTLive.value * 100)}% through the period`);
+		function z(e) {
+			P.setHeadT(P.headT + e);
+		}
+		function B(e) {
+			if (s.interactive) {
+				switch (e.key) {
+					case "ArrowRight":
+						z(V);
+						break;
+					case "ArrowLeft":
+						z(-V);
+						break;
+					case "ArrowUp":
+						z(H);
+						break;
+					case "ArrowDown":
+						z(-H);
+						break;
+					case "Home":
+						P.setHeadT(0);
+						break;
+					case "End":
+						P.setHeadT(.999);
+						break;
+					case " ":
+					case "Spacebar":
+						F.value = !F.value, F.value ? P.pause() : P.resume();
+						break;
+					default: return;
+				}
+				e.preventDefault();
+			}
+		}
+		return n({
+			backend: () => P.backend,
+			pause: P.pause,
+			resume: P.resume,
+			wake: P.wake,
+			setHeadT: P.setHeadT,
+			headT: P.headTLive,
+			flick: P.flick,
+			rendererStatus: P.rendererStatus
+		}), (e, t) => (k(), C("div", {
 			ref_key: "hostRef",
-			ref: u,
-			class: A(["fourier-field", { "fourier-field--interactive": _.value }])
-		}, [O("canvas", {
+			ref: l,
+			class: E(["fourier-field", { "fourier-field--interactive": s.interactive }]),
+			role: s.interactive ? "slider" : void 0,
+			tabindex: s.interactive ? 0 : void 0,
+			"aria-label": s.interactive ? "Fourier reconstruction parameter" : void 0,
+			"aria-valuemin": s.interactive ? 0 : void 0,
+			"aria-valuemax": s.interactive ? 1 : void 0,
+			"aria-valuenow": s.interactive ? I.value : void 0,
+			"aria-valuetext": s.interactive ? R.value : void 0,
+			onKeydown: B
+		}, [w("canvas", {
 			ref_key: "canvasRef",
-			ref: d,
+			ref: u,
 			class: "fourier-field-canvas",
 			"aria-hidden": "true"
-		}, null, 512)], 2));
+		}, null, 512)], 42, je));
 	}
-}), [["__scopeId", "data-v-c4976ac3"]]);
+}), [["__scopeId", "data-v-4f0910ab"]]);
 //#endregion
-export { te as DEFAULT_FOURIER_CONFIG, l as FOURIER_FIGURES, u as FOURIER_FIGURE_KEYS, De as FourierField, z as MAX_CURVE_SAMPLES, R as MAX_PHASORS, U as WARM_IDENTITY_PALETTE, d as comp, f as dftFromPoints, p as makeEllipticSpectrum, m as makeHarmonicFigure, h as partialSumAt, g as positionsAt, Ee as useFourierField };
+export { U as DEFAULT_FOURIER_CONFIG, c as FOURIER_FIGURES, l as FOURIER_FIGURE_KEYS, Me as FourierField, d as dftFromPoints, f as makeEllipticSpectrum, p as makeHarmonicFigure, L as mintSpectrum, m as partialSumAt, h as positionsAt, z as ringsAt };