shaders 3.1.462 → 3.2.464

package/dist/core/{KeyFrames-CLAIRUfM.js → overlay-Sye7-I6D.js}

@@ -1,16 +1,348 @@
-import { Dt as sin, Gt as textureStorage2d, Lt as vec4f, Pt as vec2u, S as formatFloat, Wt as texture2d, _t as max, cn as i32, ct as clamp, d as ZERO, et as typegpu_default, ft as exp, ht as fract, it as abs, kt as sqrt, ln as u32, lt as cos, mt as floor, qt as struct, rt as select, sn as f32, vt as min, x as Expr, yt as mix } from "./edges-CV-BHMpI.js";
-import { F as textureDimensions, I as textureLoad, M as createGuardedCompute, R as textureStore } from "./device-DKcu50_C.js";
-import { s as TWO_PI$1 } from "./constants-BKlzQFdJ.js";
-import { D as createFeedbackTrailSim } from "./porters-j7yWJYy2.js";
-import { a as transformColor } from "./transformations-u-UZrXjj.js";
+import { $n as vec4f, En as cos, Fn as min, Gn as sqrt, In as mix, Mn as fract, Pn as max, Tn as clamp, Tt as unpremultiplyAlpha, Un as sin, W as createGuardedCompute, Xn as vec2u, _r as u32, ar as textureStorage2d, bn as select, ft as Expr, gn as textureLoad, gr as i32, hn as textureDimensions, hr as f32, ir as texture2d, jn as floor, kn as exp, mn as typegpu_default, nt as ZERO, pt as formatFloat, sr as struct, un as TWO_PI$1, vn as textureStore, xn as abs } from "./lower-z2vuXP8M.js";
+import { ft as createFeedbackTrailSim } from "./porters-B1UjrM1y.js";
+import { t as createSwappableMediaTexture } from "./mediaLifecycle-DQg13y-f.js";
+import { n as createFontDependentRaster, r as createRasterInvalidator, t as createCanvasRasterTarget } from "./canvasRaster-Clio8jcl.js";
+import { n as loadGoogleFont } from "./fonts-Dyp7nl7T.js";
+var L = formatFloat;
+function overPremul(dst, rgb, a) {
+	return `{ let av = clamp(${a}, 0.0, 1.0); ${dst} = vec4f((${rgb}) * av + ${dst}.rgb * (1.0 - av), av + ${dst}.a * (1.0 - av)); }`;
+}
+function roundRectSD(names, opts) {
+	const { q, sd } = names;
+	const { pp, half, radius } = opts;
+	if (radius === void 0) return [`let ${q} = abs(${pp}) - ${half};`, `let ${sd} = length(max(${q}, vec2f(0.0))) + min(max(${q}.x, ${q}.y), ${L(0)});`];
+	return [`let ${q} = abs(${pp}) - ${half} + ${radius};`, `let ${sd} = length(max(${q}, vec2f(0.0))) + min(max(${q}.x, ${q}.y), ${L(0)}) - ${radius};`];
+}
+function cornerBracketMask(names, opts) {
+	const { bl, inCorner } = names;
+	const { blInit, px, py, hx, hy, stroke } = opts;
+	return [
+		`let ${bl} = ${blInit};`,
+		`let ${inCorner} = abs(${px}) > ${hx} - ${bl} && abs(${py}) > ${hy} - ${bl};`,
+		`${stroke} = ${stroke} * select(${L(0)}, ${L(1)}, ${inCorner});`
+	];
+}
+function straightFromPremul(dst) {
+	return `vec4f(${dst}.rgb / max(${dst}.a, ${L(1e-4)}), ${dst}.a)`;
+}
+var ATLAS_GLYPHS = "0123456789x%";
+var ATLAS_SLOTS = 16;
+var ATLAS_CELL_W = 64;
+var ATLAS_CELL_H = 96;
+var ATLAS_W = ATLAS_SLOTS * ATLAS_CELL_W;
+var ATLAS_H = ATLAS_CELL_H;
+var WALK_SCAN = 3;
+var LEAF_SCAN = 4;
+var LUM = "vec3f(0.299, 0.587, 0.114)";
+var num$1 = (v, f) => typeof v === "number" ? v : f;
+function createGlyphStripAtlas(params, opts = {}) {
+	const { getCpuValue } = params;
+	const glyphTex = createSwappableMediaTexture(params, {
+		label: opts.label ?? "GlyphStrip:atlas",
+		initial: {
+			width: ATLAS_W,
+			height: ATLAS_H
+		}
+	});
+	const target = createCanvasRasterTarget(params, { contextAttributes: { willReadFrequently: true } });
+	const readFont = () => ({
+		family: String(getCpuValue(opts.familyProp ?? "fontFamily") ?? "Inter"),
+		weight: num$1(getCpuValue(opts.weightProp ?? "fontWeight"), 500)
+	});
+	const build = (family, weight) => {
+		if (glyphTex.disposed) return;
+		const c = target.canvas() ? target.context() : target.resize(ATLAS_W, ATLAS_H);
+		if (!c) return;
+		c.clearRect(0, 0, ATLAS_W, ATLAS_H);
+		c.fillStyle = "#ffffff";
+		c.font = `${weight} ${Math.round(ATLAS_CELL_H * .62)}px "${family}", ui-monospace, monospace`;
+		c.textAlign = "center";
+		c.textBaseline = "middle";
+		const glyphs = opts.glyphs ?? ATLAS_GLYPHS;
+		for (let i = 0; i < glyphs.length; i++) c.fillText(glyphs[i], i * ATLAS_CELL_W + ATLAS_CELL_W / 2, ATLAS_CELL_H / 2 + 1);
+		glyphTex.write(target.canvas());
+	};
+	const fp0 = readFont();
+	build(fp0.family, fp0.weight);
+	const rebuild = () => {
+		const fp = readFont();
+		build(fp.family, fp.weight);
+	};
+	const font = createFontDependentRaster({
+		key: () => {
+			const fp = readFont();
+			return `${fp.family}|${fp.weight}`;
+		},
+		load: () => {
+			const fp = readFont();
+			return loadGoogleFont(fp.family, fp.weight);
+		},
+		onLoaded: rebuild
+	});
+	setTimeout(() => font.ensure(), 0);
+	createRasterInvalidator(params, {
+		initialKey: `${fp0.family}|${fp0.weight}`,
+		minIntervalMs: 100,
+		key: () => {
+			const fp = readFont();
+			return `${fp.family}|${fp.weight}`;
+		},
+		run: () => {
+			rebuild();
+			font.ensure();
+		}
+	});
+	return glyphTex.kit;
+}
+function contentPredicate(f, sVar, uVar) {
+	const { p, L: L$1, modeStr } = f;
+	if (modeStr === "alpha") return `${sVar}.a > ${p}_thr`;
+	if (modeStr === "bright") return `dot(${uVar}.rgb, ${LUM}) > ${p}_thr && ${sVar}.a > ${L$1(.02)}`;
+	if (modeStr === "dark") return `dot(${uVar}.rgb, ${LUM}) < ${p}_thr && ${sVar}.a > ${L$1(.5)}`;
+	if (modeStr === "red") return `${uVar}.r > ${p}_thr && ${uVar}.r >= ${uVar}.g && ${uVar}.r >= ${uVar}.b && ${sVar}.a > ${L$1(.02)}`;
+	if (modeStr === "green") return `${uVar}.g > ${p}_thr && ${uVar}.g >= ${uVar}.r && ${uVar}.g >= ${uVar}.b && ${sVar}.a > ${L$1(.02)}`;
+	return `${uVar}.b > ${p}_thr && ${uVar}.b >= ${uVar}.r && ${uVar}.b >= ${uVar}.g && ${sVar}.a > ${L$1(.02)}`;
+}
+function cellScanStmts(f, sfx, originX, originY, sizeV, N, wantBounds) {
+	const { p, L: L$1, s, sampleChild, UN, modeStr } = f;
+	s.push(`var ${sfx}_cnt = ${L$1(0)};`);
+	if (wantBounds) s.push(`var ${sfx}_minX = ${L$1(1e9)}; var ${sfx}_maxX = ${L$1(-1e9)}; var ${sfx}_minY = ${L$1(1e9)}; var ${sfx}_maxY = ${L$1(-1e9)};`);
+	const inv = 1 / N;
+	let k = 0;
+	for (let sy = 0; sy < N; sy++) for (let sx = 0; sx < N; sx++) {
+		const pxX = `${sfx}_px${k}x`;
+		const pxY = `${sfx}_px${k}y`;
+		s.push(`let ${pxX} = ${originX} + ${sizeV} * ${L$1((sx + .5) * inv)};`);
+		s.push(`let ${pxY} = ${originY} + ${sizeV} * ${L$1((sy + .5) * inv)};`);
+		s.push(`let ${sfx}_s${k} = ${sampleChild(`vec2f(${pxX}, ${pxY}) / ${p}_res`)};`);
+		if (modeStr !== "alpha") s.push(`let ${sfx}_u${k} = ${UN}(${sfx}_s${k});`);
+		s.push(`let ${sfx}_c${k} = ${contentPredicate(f, `${sfx}_s${k}`, `${sfx}_u${k}`)};`);
+		s.push(`${sfx}_cnt = ${sfx}_cnt + select(${L$1(0)}, ${L$1(1)}, ${sfx}_c${k});`);
+		if (wantBounds) {
+			s.push(`${sfx}_minX = select(${sfx}_minX, min(${sfx}_minX, ${pxX}), ${sfx}_c${k});`);
+			s.push(`${sfx}_maxX = select(${sfx}_maxX, max(${sfx}_maxX, ${pxX}), ${sfx}_c${k});`);
+			s.push(`${sfx}_minY = select(${sfx}_minY, min(${sfx}_minY, ${pxY}), ${sfx}_c${k});`);
+			s.push(`${sfx}_maxY = select(${sfx}_maxY, max(${sfx}_maxY, ${pxY}), ${sfx}_c${k});`);
+		}
+		k++;
+	}
+	s.push(`let ${sfx}_coverage = ${sfx}_cnt / ${L$1(N * N)};`);
+}
+function partitionWalkStmts(f, layoutStr, D) {
+	const { p, L: L$1, s } = f;
+	s.push(`var ${p}_origin = floor(${p}_fragPx / ${p}_cellPx) * ${p}_cellPx;`);
+	s.push(`var ${p}_size = ${p}_cellPx;`);
+	for (let lvl = 0; lvl < D; lvl++) {
+		const sfx = `${p}_w${lvl}`;
+		if (layoutStr === "mosaic") {
+			s.push(`let ${sfx}_cellIx = ${p}_origin / ${p}_size;`);
+			s.push(`let ${sfx}_doSplit = fract(sin(dot(${sfx}_cellIx, vec2f(${L$1(127.1)}, ${L$1(311.7)})) + ${L$1(lvl * 53.13)}) * ${L$1(43758.5453)}) > ${L$1(.5)};`);
+		} else {
+			cellScanStmts(f, sfx, `${p}_origin.x`, `${p}_origin.y`, `${p}_size`, WALK_SCAN, false);
+			s.push(`let ${sfx}_doSplit = ${sfx}_coverage > ${L$1(.02)} && ${sfx}_coverage < ${L$1(.98)};`);
+		}
+		s.push(`let ${sfx}_half = ${p}_size * ${L$1(.5)};`);
+		s.push(`let ${sfx}_qx = step(${p}_origin.x + ${sfx}_half, ${p}_fragPx.x);`);
+		s.push(`let ${sfx}_qy = step(${p}_origin.y + ${sfx}_half, ${p}_fragPx.y);`);
+		s.push(`let ${sfx}_childOrigin = vec2f(${p}_origin.x + ${sfx}_qx * ${sfx}_half, ${p}_origin.y + ${sfx}_qy * ${sfx}_half);`);
+		s.push(`${p}_origin = select(${p}_origin, ${sfx}_childOrigin, ${sfx}_doSplit);`);
+		s.push(`${p}_size = select(${p}_size, ${sfx}_half, ${sfx}_doSplit);`);
+	}
+}
+function contentBBoxStmts(f) {
+	const { p, L: L$1, s } = f;
+	cellScanStmts(f, `${p}_leaf`, `${p}_origin.x`, `${p}_origin.y`, `${p}_size`, LEAF_SCAN, true);
+	s.push(`let ${p}_halfStep = ${p}_size / ${L$1(LEAF_SCAN)} * ${L$1(.5)};`);
+	s.push(`let ${p}_innerMinX = ${p}_origin.x + ${p}_boxInset;`);
+	s.push(`let ${p}_innerMaxX = max(${p}_origin.x + ${p}_size - ${p}_boxInset, ${p}_innerMinX);`);
+	s.push(`let ${p}_innerMinY = ${p}_origin.y + ${p}_boxInset;`);
+	s.push(`let ${p}_innerMaxY = max(${p}_origin.y + ${p}_size - ${p}_boxInset, ${p}_innerMinY);`);
+	s.push(`let ${p}_bMinX = clamp(${p}_leaf_minX - ${p}_halfStep, ${p}_innerMinX, ${p}_innerMaxX);`);
+	s.push(`let ${p}_bMaxX = clamp(${p}_leaf_maxX + ${p}_halfStep, ${p}_innerMinX, ${p}_innerMaxX);`);
+	s.push(`let ${p}_bMinY = clamp(${p}_leaf_minY - ${p}_halfStep, ${p}_innerMinY, ${p}_innerMaxY);`);
+	s.push(`let ${p}_bMaxY = clamp(${p}_leaf_maxY + ${p}_halfStep, ${p}_innerMinY, ${p}_innerMaxY);`);
+	s.push(`let ${p}_boxW = ${p}_bMaxX - ${p}_bMinX;`);
+	s.push(`let ${p}_boxH = ${p}_bMaxY - ${p}_bMinY;`);
+	s.push(`let ${p}_detected = ${p}_leaf_coverage > ${L$1(.02)} && ${p}_boxW > ${p}_minSize && ${p}_boxH > ${p}_minSize;`);
+	s.push(`let ${p}_detF = select(${L$1(0)}, ${L$1(1)}, ${p}_detected);`);
+}
+function detectionBoxStmts(f, cornerStyle) {
+	const { p, U, L: L$1, s } = f;
+	s.push(`let ${p}_center = vec2f((${p}_bMinX + ${p}_bMaxX) * ${L$1(.5)}, (${p}_bMinY + ${p}_bMaxY) * ${L$1(.5)});`);
+	s.push(`let ${p}_halfB = vec2f(${p}_boxW * ${L$1(.5)}, ${p}_boxH * ${L$1(.5)});`);
+	const cRExpr = cornerStyle ? L$1(0) : `${p}_cornerRadiusPx`;
+	s.push(`let ${p}_cR = max(min(min(${cRExpr}, ${p}_halfB.x), ${p}_halfB.y), ${L$1(0)});`);
+	s.push(`let ${p}_pp = ${p}_fragPx - ${p}_center;`);
+	s.push(...roundRectSD({
+		q: `${p}_q`,
+		sd: `${p}_sd`
+	}, {
+		pp: `${p}_pp`,
+		half: `${p}_halfB`,
+		radius: `${p}_cR`
+	}));
+	s.push(`let ${p}_fillA = (${L$1(1)} - smoothstep(${L$1(0)}, ${p}_aa, ${p}_sd)) * ${U("fillColor")}.a * ${p}_detF;`);
+	s.push(`var ${p}_strokeA = ${L$1(1)} - smoothstep(${L$1(0)}, ${p}_aa, abs(${p}_sd) - ${p}_lineHalf);`);
+	if (cornerStyle) s.push(...cornerBracketMask({
+		bl: `${p}_bl`,
+		inCorner: `${p}_inCorner`
+	}, {
+		blInit: `min(${p}_halfB.x, ${p}_halfB.y) * ${L$1(.35)}`,
+		px: `${p}_pp.x`,
+		py: `${p}_pp.y`,
+		hx: `${p}_halfB.x`,
+		hy: `${p}_halfB.y`,
+		stroke: `${p}_strokeA`
+	}));
+	s.push(`${p}_strokeA = ${p}_strokeA * ${U("strokeColor")}.a * ${p}_detF;`);
+	s.push(overPremul(`${p}_dst`, `${U("fillColor")}.rgb`, `${p}_fillA`));
+	s.push(overPremul(`${p}_dst`, `${U("strokeColor")}.rgb`, `${p}_strokeA`));
+}
+const digitsOf = (L$1, v) => `(${L$1(1)} + step(${L$1(10)}, ${v}) + step(${L$1(100)}, ${v}) + step(${L$1(1e3)}, ${v}) + step(${L$1(1e4)}, ${v}))`;
+const digitAt = (L$1, v, e) => {
+	const x = `floor(${v} / pow(${L$1(10)}, ${e}))`;
+	return `(${x} - ${L$1(10)} * floor((${x}) / ${L$1(10)}))`;
+};
+function glyphPillLabelStmts(f, opts) {
+	const { p, U, L: L$1, s } = f;
+	const { labelStr, labelPos, atlasKey } = opts;
+	s.push(`let ${p}_textH = max(${U("fontSize")} * ${p}_res.y, ${L$1(1)});`);
+	s.push(`let ${p}_glyphW = ${p}_textH * ${L$1(ATLAS_CELL_W / ATLAS_CELL_H)};`);
+	s.push(`let ${p}_advance = ${p}_glyphW + ${p}_textH * ${U("letterSpacing")};`);
+	s.push(`let ${p}_padX = ${p}_textH * ${L$1(.38)};`);
+	s.push(`let ${p}_padY = ${p}_textH * ${L$1(.24)};`);
+	s.push(`let ${p}_gap = ${p}_textH * ${L$1(.28)};`);
+	if (labelStr === "dimensions") {
+		s.push(`let ${p}_w = clamp(floor(${p}_boxW + ${L$1(.5)}), ${L$1(1)}, ${L$1(99999)});`);
+		s.push(`let ${p}_h = clamp(floor(${p}_boxH + ${L$1(.5)}), ${L$1(1)}, ${L$1(99999)});`);
+		s.push(`let ${p}_dw = ${digitsOf(L$1, `${p}_w`)};`);
+		s.push(`let ${p}_dh = ${digitsOf(L$1, `${p}_h`)};`);
+		s.push(`let ${p}_total = ${p}_dw + ${L$1(1)} + ${p}_dh;`);
+	} else {
+		s.push(`let ${p}_pc = clamp(floor(${p}_leaf_coverage * ${L$1(100)} + ${L$1(.5)}), ${L$1(0)}, ${L$1(100)});`);
+		s.push(`let ${p}_dp = ${digitsOf(L$1, `${p}_pc`)};`);
+		s.push(`let ${p}_total = ${p}_dp + ${L$1(1)};`);
+	}
+	s.push(`let ${p}_labelW = ${p}_total * ${p}_advance + ${p}_padX * ${L$1(2)};`);
+	s.push(`let ${p}_labelH = ${p}_textH + ${p}_padY * ${L$1(2)};`);
+	const isRight = labelPos === 1 || labelPos === 3;
+	const isTop = labelPos === 2 || labelPos === 3;
+	s.push(`let ${p}_inset = ${U("labelInset")} > ${L$1(.5)};`);
+	const leftIn = isRight ? `${p}_bMaxX - ${p}_labelW - ${p}_gap` : `${p}_bMinX + ${p}_gap`;
+	const leftOut = isRight ? `${p}_bMaxX - ${p}_labelW` : `${p}_bMinX`;
+	s.push(`var ${p}_labelLeft = select(${leftOut}, ${leftIn}, ${p}_inset);`);
+	const topIn = isTop ? `${p}_bMinY + ${p}_gap` : `${p}_bMaxY - ${p}_labelH - ${p}_gap`;
+	const topOut = isTop ? `${p}_bMinY - ${p}_labelH - ${p}_gap` : `${p}_bMaxY + ${p}_gap`;
+	s.push(`var ${p}_labelTop = select(${topOut}, ${topIn}, ${p}_inset);`);
+	s.push(`let ${p}_cellMaxX = ${p}_origin.x + ${p}_size;`);
+	s.push(`let ${p}_cellMaxY = ${p}_origin.y + ${p}_size;`);
+	s.push(`${p}_labelLeft = clamp(${p}_labelLeft, ${p}_origin.x, max(${p}_cellMaxX - ${p}_labelW, ${p}_origin.x));`);
+	s.push(`${p}_labelTop = clamp(${p}_labelTop, ${p}_origin.y, max(${p}_cellMaxY - ${p}_labelH, ${p}_origin.y));`);
+	s.push(`let ${p}_labelCenter = vec2f(${p}_labelLeft + ${p}_labelW * ${L$1(.5)}, ${p}_labelTop + ${p}_labelH * ${L$1(.5)});`);
+	s.push(`let ${p}_pillHalf = vec2f(${p}_labelW * ${L$1(.5)}, ${p}_labelH * ${L$1(.5)});`);
+	s.push(`let ${p}_pillR = max(min(min(${U("labelRadius")} * ${p}_scaleFactor, ${p}_pillHalf.x), ${p}_pillHalf.y), ${L$1(0)});`);
+	s.push(`let ${p}_pillP = ${p}_fragPx - ${p}_labelCenter;`);
+	s.push(...roundRectSD({
+		q: `${p}_pillQ`,
+		sd: `${p}_pillSD`
+	}, {
+		pp: `${p}_pillP`,
+		half: `${p}_pillHalf`,
+		radius: `${p}_pillR`
+	}));
+	s.push(`let ${p}_pillA = (${L$1(1)} - smoothstep(${L$1(0)}, ${p}_aa, ${p}_pillSD)) * ${U("labelBackgroundColor")}.a * ${p}_detF;`);
+	s.push(overPremul(`${p}_dst`, `${U("labelBackgroundColor")}.rgb`, `${p}_pillA`));
+	s.push(`let ${p}_rel = ${p}_fragPx.x - ${p}_labelLeft - ${p}_padX;`);
+	s.push(`let ${p}_slot = floor(${p}_rel / ${p}_advance);`);
+	s.push(`let ${p}_within = fract(${p}_rel / ${p}_advance);`);
+	s.push(`let ${p}_uInChar = ${p}_within * (${p}_advance / ${p}_glyphW);`);
+	s.push(`let ${p}_vInChar = (${p}_fragPx.y - ${p}_labelTop - ${p}_padY) / ${p}_textH;`);
+	if (labelStr === "dimensions") {
+		s.push(`let ${p}_wDigit = ${digitAt(L$1, `${p}_w`, `${p}_dw - ${L$1(1)} - ${p}_slot`)};`);
+		s.push(`let ${p}_hDigit = ${digitAt(L$1, `${p}_h`, `${p}_dh + ${p}_dw - ${p}_slot`)};`);
+		s.push(`var ${p}_g = ${p}_hDigit;`);
+		s.push(`${p}_g = select(${p}_g, ${L$1(10)}, ${p}_slot == ${p}_dw);`);
+		s.push(`${p}_g = select(${p}_g, ${p}_wDigit, ${p}_slot < ${p}_dw);`);
+	} else s.push(`var ${p}_g = select(${L$1(11)}, ${digitAt(L$1, `${p}_pc`, `${p}_dp - ${L$1(1)} - ${p}_slot`)}, ${p}_slot < ${p}_dp);`);
+	s.push(`let ${p}_atlasU = (${p}_g + clamp(${p}_uInChar, ${L$1(0)}, ${L$1(1)})) / ${L$1(ATLAS_SLOTS)};`);
+	s.push(`let ${p}_glyphCov = textureSampleLevel(tex.$.${atlasKey}, samp.$.linearClamp, vec2f(${p}_atlasU, ${p}_vInChar), 0.0).a;`);
+	s.push(`let ${p}_inText = ${p}_rel >= ${L$1(0)} && ${p}_slot >= ${L$1(0)} && ${p}_slot < ${p}_total && ${p}_uInChar <= ${L$1(1)} && ${p}_vInChar >= ${L$1(0)} && ${p}_vInChar <= ${L$1(1)};`);
+	s.push(`let ${p}_textA = ${p}_glyphCov * select(${L$1(0)}, ${L$1(1)}, ${p}_inText) * ${U("labelColor")}.a * ${p}_detF;`);
+	s.push(overPremul(`${p}_dst`, `${U("labelColor")}.rgb`, `${p}_textA`));
+}
+const diamondStamp = (f) => {
+	const { p, U, L: L$1, s } = f;
+	s.push(`let dsz = ${p}_ms * ${L$1(.16)};`);
+	s.push(`let dSd = (abs(dp.x) + abs(dp.y)) * ${L$1(.7071)} - dsz;`);
+	s.push(overPremul(`${p}_dst`, `${U("keyframeColor")}.rgb`, `(${L$1(1)} - smoothstep(${L$1(0)}, ${p}_aa, dSd)) * ${U("keyframeColor")}.a * fade * ${U("trail")}`));
+};
+function pathSegmentStamp(every) {
+	return (f) => {
+		const { p, U, L: L$1, s } = f;
+		s.push(`let validP = select(${L$1(0)}, ${L$1(1)}, abs(ePrev.w - mta.z) < ${L$1(.5)}) * select(${L$1(0)}, ${L$1(1)}, ePrev.z > ${L$1(.5)});`);
+		s.push(`let stampGap = abs(e.z - ePrev.z);`);
+		s.push(`let contiguous = select(${L$1(0)}, ${L$1(1)}, stampGap < ${L$1(every * 1.5)});`);
+		s.push(`let epp = vec2f(ePrev.x * ${p}_res.x, ePrev.y * ${p}_res.y);`);
+		s.push(`let pa = ${p}_px - epp; let ba = ep - epp;`);
+		s.push(`let h = clamp(dot(pa, ba) / max(dot(ba, ba), ${L$1(1e-4)}), ${L$1(0)}, ${L$1(1)});`);
+		s.push(`let segD = length(pa - ba * h);`);
+		s.push(overPremul(`${p}_dst`, `${U("pathColor")}.rgb`, `(${L$1(1)} - smoothstep(${p}_lw * ${L$1(.4)}, ${p}_lw * ${L$1(.4)} + ${p}_aa, segD)) * ${U("pathColor")}.a * fade * validP * contiguous * ${U("trail")} * ${L$1(.8)}`));
+	};
+}
+function ringTrailStmts(f, slots) {
+	const { p, U, L: L$1, s } = f;
+	const maxAge = slots.len * slots.every;
+	s.push(`if (${U("trail")} > ${L$1(.001)}) {`);
+	s.push(`var ePrev = ${slots.load(`${2 + slots.len - 1}u`)};`);
+	s.push(`for (var j = 0u; j < ${slots.len}u; j = j + 1u) {`);
+	s.push(`let e = ${slots.load("2u + j")};`);
+	s.push(`let valid = select(${L$1(0)}, ${L$1(1)}, abs(e.w - mta.z) < ${L$1(.5)}) * select(${L$1(0)}, ${L$1(1)}, e.z > ${L$1(.5)});`);
+	s.push(`let age = head.z - e.z;`);
+	s.push(`let fade = clamp(${L$1(1)} - age / ${L$1(maxAge)}, ${L$1(0)}, ${L$1(1)}) * valid;`);
+	s.push(`let ep = vec2f(e.x * ${p}_res.x, e.y * ${p}_res.y);`);
+	s.push(`let dp = ${p}_px - ep;`);
+	for (const stage of slots.stages) stage(f);
+	s.push(`ePrev = e;`);
+	s.push(`}`);
+	s.push(`}`);
+}
+const bracketGizmo = (f) => {
+	const { p, U, L: L$1, s } = f;
+	s.push(`let gp = ${p}_px - tp;`);
+	s.push(`let hlf = ${p}_ms * ${L$1(.5)};`);
+	s.push(...roundRectSD({
+		q: `q`,
+		sd: `boxSd`
+	}, {
+		pp: `gp`,
+		half: `vec2f(hlf)`
+	}));
+	s.push(`var strokeA = ${L$1(1)} - smoothstep(${L$1(0)}, ${p}_aa, abs(boxSd) - ${p}_lw * ${L$1(.5)});`);
+	s.push(...cornerBracketMask({
+		bl: `bl`,
+		inCorner: `inCorner`
+	}, {
+		blInit: `hlf * ${L$1(.45)}`,
+		px: `gp.x`,
+		py: `gp.y`,
+		hx: `hlf`,
+		hy: `hlf`,
+		stroke: `strokeA`
+	}));
+	s.push(overPremul(`${p}_dst`, `${U("markerColor")}.rgb`, `strokeA * ${U("markerColor")}.a * searching`));
+	s.push(`let tick = hlf * ${L$1(.55)};`);
+	s.push(`let chH = ${L$1(1)} - smoothstep(${L$1(0)}, ${p}_aa, max(abs(gp.y) - ${p}_lw * ${L$1(.5)}, abs(gp.x) - tick));`);
+	s.push(`let chV = ${L$1(1)} - smoothstep(${L$1(0)}, ${p}_aa, max(abs(gp.x) - ${p}_lw * ${L$1(.5)}, abs(gp.y) - tick));`);
+	s.push(overPremul(`${p}_dst`, `${U("markerColor")}.rgb`, `max(chH, chV) * ${L$1(.55)} * ${U("markerColor")}.a * searching`));
+	s.push(overPremul(`${p}_dst`, `vec3f(1.0, 1.0, 1.0)`, `(${L$1(1)} - smoothstep(${p}_lw, ${p}_lw + ${p}_aa, length(gp))) * searching`));
+};
 var MAX_TRACKERS = 64;
 var TRAIL_LEN = 12;
 var TRAIL_EVERY = 8;
-var AABB_COL = 2 + TRAIL_LEN;
+var AABB_COL = 14;
 var STATE_W = AABB_COL + 1;
 var STATE_FORMAT = "rgba32float";
 var FEAT_GRID = 96;
-var REFERENCE_HEIGHT = 1080;
 var TWO_PI = TWO_PI$1;
 var TrackParams = /* @__PURE__ */ (globalThis.__TYPEGPU_AUTONAME__ ?? ((a) => a))(struct({
 	dt: f32,
@@ -39,7 +371,7 @@ var trackLayout = /* @__PURE__ */ (globalThis.__TYPEGPU_AUTONAME__ ?? ((a) => a)
 	present: { storageTexture: textureStorage2d(STATE_FORMAT, "write-only") },
 	params: { uniform: TrackParams }
 }), "trackLayout");
-const trackHash = typegpu_default.fn([f32], f32)(/* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((x) => {
+const trackHash = /* @__PURE__ */ (globalThis.__TYPEGPU_AUTONAME__ ?? ((a) => a))(typegpu_default.fn([f32], f32)(/* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((x) => {
 	"use gpu";
 	return fract(__tsover_mul(sin(x), 43758.5453123));
 }), {
@@ -69,8 +401,8 @@ const trackHash = typegpu_default.fn([f32], f32)(/* @__PURE__ */ (($) => (global
 		"std.fract": () => fract,
 		"std.sin": () => sin
 	}
-}) && $.f)({}));
-function buildScoreFn(mode) {
+}) && $.f)({})), "trackHash");
+function featureScoreFn(mode) {
 	return typegpu_default.fn([vec4f], f32)(/* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((c) => {
 		"use gpu";
 		const a = max(c.w, 1e-4);
@@ -674,9 +1006,9 @@ function buildScoreFn(mode) {
 			"mode": () => mode,
 			"std.select": () => select
 		}
-	}) && $.f)({})).$name(`keyframesScore_${mode}`);
+	}) && $.f)({})).$name(`featureScore_${mode}`);
 }
-function buildFeatureKernel(scoreFn) {
+function buildFeatureGridKernel(scoreFn) {
 	return typegpu_default.fn([u32, u32])(/* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((gx, gy) => {
 		"use gpu";
 		const srcDims = textureDimensions(featureLayout.$.src);
@@ -1056,10 +1388,10 @@ function buildFeatureKernel(scoreFn) {
 			"std.textureStore": () => textureStore,
 			"d.vec4f": () => vec4f
 		}
-	}) && $.f)({})).$name("keyframesFeatureGrid");
+	}) && $.f)({})).$name("featureGridScan");
 }
-function buildTrackKernel(mode, scoreFn) {
-	const score = scoreFn ?? buildScoreFn(mode);
+function buildPursuitKernel(mode, scoreFn) {
+	const score = scoreFn ?? featureScoreFn(mode);
 	return typegpu_default.fn([u32])(/* @__PURE__ */ (($) => (globalThis.__TYPEGPU_META__ ??= /* @__PURE__ */ new WeakMap()).set($.f = ((ti) => {
 		"use gpu";
 		const P = trackLayout.$.params;
@@ -4127,189 +4459,17 @@ function buildTrackKernel(mode, scoreFn) {
 			"std.textureStore": () => textureStore,
 			"AABB_COL": () => AABB_COL
 		}
-	}) && $.f)({})).$name("keyframesTrack");
+	}) && $.f)({})).$name("trackerPursuit");
 }
-const keyframesFeatureKernelBright = buildFeatureKernel(buildScoreFn("bright"));
-const componentDefinition = {
-	name: "KeyFrames",
-	boundingBoxDeclaration: { aspectRatio: null },
-	category: "Stylize",
-	description: "Motion-tracking overlay — trackers hunt and follow features in the content, dropping keyframe diamonds behind them along their motion paths, like a compositor mid-track",
-	requiresRTT: true,
-	requiresChild: true,
-	props: {
-		trackers: {
-			default: 12,
-			description: "Number of simultaneous trackers.",
-			ui: {
-				type: ["range", "map"],
-				min: 1,
-				max: 64,
-				step: 1,
-				label: "Trackers",
-				group: "Tracking"
-			}
-		},
-		detect: {
-			default: "bright",
-			compileTime: true,
-			description: "What the trackers hunt for.",
-			ui: {
-				type: "select",
-				options: [
-					{
-						label: "Brightness",
-						value: "bright"
-					},
-					{
-						label: "Darkness",
-						value: "dark"
-					},
-					{
-						label: "Transparency",
-						value: "alpha"
-					},
-					{
-						label: "Red",
-						value: "red"
-					},
-					{
-						label: "Green",
-						value: "green"
-					},
-					{
-						label: "Blue",
-						value: "blue"
-					}
-				],
-				label: "Detect",
-				group: "Tracking"
-			}
-		},
-		threshold: {
-			default: .15,
-			description: "Feature floor — content scoring below this doesn't count as trackable at all.",
-			ui: {
-				type: "range",
-				min: 0,
-				max: .9,
-				step: .01,
-				label: "Threshold",
-				group: "Tracking"
-			}
-		},
-		variance: {
-			default: .8,
-			description: "Spread of tracker preferences — 0 hunts only the strongest features, 1 distributes trackers across the whole brightness range.",
-			ui: {
-				type: ["range", "map"],
-				min: 0,
-				max: 1,
-				step: .01,
-				label: "Variance",
-				group: "Tracking"
-			}
-		},
-		agility: {
-			default: .5,
-			description: "How fast trackers travel and how wide they search.",
-			ui: {
-				type: ["range", "map"],
-				min: 0,
-				max: 1,
-				step: .01,
-				label: "Agility",
-				group: "Tracking"
-			}
-		},
-		lifespan: {
-			default: 6,
-			description: "Seconds a tracker follows its target before retiring and reacquiring elsewhere. 0 = track forever.",
-			ui: {
-				type: ["range", "map"],
-				min: 0,
-				max: 20,
-				step: .5,
-				label: "Lifespan",
-				group: "Tracking"
-			}
-		},
-		trail: {
-			default: 1,
-			description: "Visibility of the keyframe trail each tracker leaves behind.",
-			ui: {
-				type: ["range", "map"],
-				min: 0,
-				max: 1,
-				step: .01,
-				label: "Trail",
-				group: "Style"
-			}
-		},
-		markerSize: {
-			default: 28,
-			description: "Tracker gizmo size in pixels.",
-			ui: {
-				type: "range",
-				min: 8,
-				max: 80,
-				step: 1,
-				label: "Marker Size",
-				group: "Style"
-			}
-		},
-		lineWidth: {
-			default: 1.5,
-			description: "Stroke width in pixels.",
-			ui: {
-				type: "range",
-				min: .5,
-				max: 6,
-				step: .25,
-				label: "Line Width",
-				group: "Style"
-			}
-		},
-		markerColor: {
-			default: "#54d66b",
-			transform: transformColor,
-			description: "Tracker gizmo color.",
-			ui: {
-				type: "color",
-				label: "Tracker",
-				group: "Colors"
-			}
-		},
-		keyframeColor: {
-			default: "#ffcf33",
-			transform: transformColor,
-			description: "Keyframe diamond color.",
-			ui: {
-				type: "color",
-				label: "Keyframes",
-				group: "Colors"
-			}
-		},
-		pathColor: {
-			default: "#ffffffb8",
-			transform: transformColor,
-			description: "Motion path color.",
-			ui: {
-				type: "color",
-				label: "Path",
-				group: "Colors"
-			}
-		}
-	},
-	compute: (params) => {
-		const { childNode, gpu, getCpuValue, propValues } = params;
+function createTrackerPursuitSim(slots) {
+	return (params) => {
+		const { childNode, gpu, getCpuValue } = params;
 		if (!childNode) return null;
 		const root = gpu?.root;
 		if (!root) return null;
-		const mode = typeof propValues.detect === "string" ? propValues.detect : "bright";
-		const scoreFn = buildScoreFn(mode);
-		const featureKernel = buildFeatureKernel(scoreFn);
-		const trackKernel = buildTrackKernel(mode, scoreFn);
+		const scoreFn = featureScoreFn(slots.mode);
+		const featureKernel = buildFeatureGridKernel(scoreFn);
+		const trackKernel = buildPursuitKernel(slots.mode, scoreFn);
 		const paramsBuf = /* @__PURE__ */ (globalThis.__TYPEGPU_AUTONAME__ ?? ((a) => a))(root.createUniform(TrackParams), "paramsBuf");
 		const sim = createFeedbackTrailSim(params, {
 			size: [STATE_W, MAX_TRACKERS],
@@ -4380,97 +4540,173 @@ const componentDefinition = {
 			getComputeNodes: (frameParams) => sim.tick(frameParams, ({ groups, shared, dt }) => {
 				paramsBuf.write({
 					dt,
-					trackersF: getCpuValue("trackers") ?? 4,
-					agility: getCpuValue("agility") ?? .5,
-					threshold: getCpuValue("threshold") ?? .15,
-					variance: getCpuValue("variance") ?? .5,
-					lifespan: getCpuValue("lifespan") ?? 6
+					trackersF: getCpuValue(slots.trackers) ?? 4,
+					agility: getCpuValue(slots.agility) ?? .5,
+					threshold: getCpuValue(slots.threshold) ?? .15,
+					variance: getCpuValue(slots.variance) ?? .5,
+					lifespan: getCpuValue(slots.lifespan) ?? 6
 				});
 				return [featurePipeline.with(shared), simPipeline.with(groups)];
 			})
 		};
-	},
-	fragment: (params) => {
+	};
+}
+var num = (v, f) => typeof v === "number" ? v : f;
+var DETECTION_REFERENCE_HEIGHT = 1080;
+function detectionOverlay(slots) {
+	return (params) => {
+		const { uniforms, ctx, childNode, convertToTexture, propValues } = params;
+		if (!childNode) return ZERO;
+		const texKey = convertToTexture(childNode).key;
+		const modeMap = {
+			alpha: 0,
+			bright: 1,
+			dark: 2,
+			red: 3,
+			green: 4,
+			blue: 5
+		};
+		const layoutMap = {
+			grid: 0,
+			quadtree: 1,
+			mosaic: 2
+		};
+		const labelMap = {
+			none: 0,
+			dimensions: 1,
+			percentage: 2
+		};
+		const posMap = {
+			"bottom-left": 0,
+			"bottom-right": 1,
+			"top-left": 2,
+			"top-right": 3
+		};
+		const rawMode = propValues[slots.detectionMode.name];
+		const modeStr = [
+			"alpha",
+			"bright",
+			"dark",
+			"red",
+			"green",
+			"blue"
+		][typeof rawMode === "number" ? rawMode : modeMap[rawMode] ?? 1];
+		const rawLayout = propValues[slots.layout.name];
+		const layoutStr = [
+			"grid",
+			"quadtree",
+			"mosaic"
+		][typeof rawLayout === "number" ? rawLayout : layoutMap[rawLayout] ?? 2];
+		let D = Math.round(num(propValues[slots.maxDepth.name], 2));
+		if (!Number.isFinite(D)) D = 2;
+		D = Math.max(0, Math.min(5, D));
+		if (layoutStr === "grid") D = 0;
+		const rawBox = propValues[slots.boxStyle.name];
+		const cornerStyle = (typeof rawBox === "string" ? rawBox : "corners") === "corners";
+		const rawLabel = propValues[slots.labelMode.name];
+		const labelStr = [
+			"none",
+			"dimensions",
+			"percentage"
+		][typeof rawLabel === "number" ? rawLabel : labelMap[rawLabel] ?? 0];
+		const labelsOn = labelStr !== "none";
+		const rawPos = propValues[slots.labelPosition.name];
+		const labelPos = typeof rawPos === "number" ? rawPos : posMap[rawPos] ?? 1;
+		const atlasKey = labelsOn ? createGlyphStripAtlas(params, {
+			label: "DetectionOverlay:atlas",
+			familyProp: slots.fontFamily.name,
+			weightProp: slots.fontWeight.name
+		}).key : void 0;
+		return new Expr((ec) => {
+			const p = ec.freshLocal("ot");
+			const s = [];
+			const f = {
+				p,
+				U: (name) => uniforms[slots[name].name]._emit(ec),
+				L: (n) => formatFloat(n),
+				s,
+				sampleChild: (uvWgsl) => `textureSampleLevel(tex.$.${texKey}, samp.$.linearClamp, ${uvWgsl}, 0.0)`,
+				UN: ec.external(unpremultiplyAlpha, "unpremultiplyAlpha"),
+				modeStr
+			};
+			const { U, L: L$1 } = f;
+			s.push(`let ${p}_res = ${ctx.logicalViewportSize._emit(ec)};`);
+			s.push(`let ${p}_scaleFactor = ${p}_res.y / ${L$1(DETECTION_REFERENCE_HEIGHT)};`);
+			const uvE = ctx.uv._emit(ec);
+			s.push(`let ${p}_fragPx = vec2f((${uvE}).x * ${p}_res.x, (${uvE}).y * ${p}_res.y);`);
+			s.push(`let ${p}_aa = max(max(fwidth(${p}_fragPx.x), fwidth(${p}_fragPx.y)), ${L$1(1e-4)});`);
+			s.push(`let ${p}_cellPx = max(${U("cellSize")} * ${p}_scaleFactor, ${L$1(4)});`);
+			s.push(`let ${p}_minSize = ${L$1(3)} * ${p}_scaleFactor;`);
+			s.push(`let ${p}_lineHalf = max(${U("lineWidth")} * ${p}_scaleFactor * ${L$1(.5)}, ${L$1(.5)});`);
+			s.push(`let ${p}_cornerRadiusPx = ${U("cornerRadius")} * ${p}_scaleFactor;`);
+			s.push(`let ${p}_boxInset = ${p}_lineHalf + ${p}_scaleFactor * ${L$1(1.5)};`);
+			s.push(`let ${p}_thr = ${U("threshold")};`);
+			partitionWalkStmts(f, layoutStr, D);
+			contentBBoxStmts(f);
+			s.push(`var ${p}_dst = ${f.sampleChild(`(${uvE})`)};`);
+			detectionBoxStmts(f, cornerStyle);
+			if (labelsOn && atlasKey) glyphPillLabelStmts(f, {
+				labelStr,
+				labelPos,
+				atlasKey
+			});
+			for (const line of s) ec.statement(line);
+			return straightFromPremul(`${p}_dst`);
+		});
+	};
+}
+function motionTrackerHud(slots) {
+	return (params) => {
 		const { uniforms, ctx, childNode, convertToTexture, computeOutputs } = params;
 		if (!childNode) return ZERO;
 		const texKey = (computeOutputs?.childTexture ?? convertToTexture(childNode)).key;
 		const stateKit = computeOutputs?.trackState;
 		return new Expr((ec) => {
-			const U = (name) => uniforms[name]._emit(ec);
-			const L = (n) => formatFloat(n);
 			const p = ec.freshLocal("kft");
 			const s = [];
+			const f = {
+				p,
+				U: (name) => uniforms[slots[name].name]._emit(ec),
+				L: (n) => formatFloat(n),
+				s
+			};
+			const { U, L: L$1 } = f;
 			const uvE = ctx.uv._emit(ec);
 			s.push(`let ${p}_res = ${ctx.logicalViewportSize._emit(ec)};`);
-			s.push(`let ${p}_sf = ${p}_res.y / ${L(REFERENCE_HEIGHT)};`);
+			s.push(`let ${p}_sf = ${p}_res.y / ${L$1(DETECTION_REFERENCE_HEIGHT)};`);
 			s.push(`let ${p}_px = vec2f((${uvE}).x * ${p}_res.x, (${uvE}).y * ${p}_res.y);`);
-			s.push(`let ${p}_aa = max(max(fwidth(${p}_px.x), fwidth(${p}_px.y)), ${L(1e-4)});`);
-			s.push(`let ${p}_lw = max(${U("lineWidth")} * ${p}_sf, ${L(.5)});`);
-			s.push(`let ${p}_ms = max(${U("markerSize")} * ${p}_sf, ${L(4)});`);
+			s.push(`let ${p}_aa = max(max(fwidth(${p}_px.x), fwidth(${p}_px.y)), ${L$1(1e-4)});`);
+			s.push(`let ${p}_lw = max(${U("lineWidth")} * ${p}_sf, ${L$1(.5)});`);
+			s.push(`let ${p}_ms = max(${U("markerSize")} * ${p}_sf, ${L$1(4)});`);
 			s.push(`var ${p}_dst = textureSampleLevel(tex.$.${texKey}, samp.$.linearClamp, (${uvE}), 0.0);`);
-			const overP = (rgb, a) => {
-				s.push(`{ let av = clamp(${a}, 0.0, 1.0); ${p}_dst = vec4f((${rgb}) * av + ${p}_dst.rgb * (1.0 - av), av + ${p}_dst.a * (1.0 - av)); }`);
-			};
 			if (stateKit) {
 				const stateKey = stateKit.key;
 				const load = (col) => `textureLoad(tex.$.${stateKey}, vec2u(${col}, ti), 0)`;
-				const maxAge = TRAIL_LEN * TRAIL_EVERY;
-				s.push(`let ${p}_n = u32(clamp(${U("trackers")}, ${L(1)}, ${L(MAX_TRACKERS)}));`);
+				s.push(`let ${p}_n = u32(clamp(${U("trackers")}, ${L$1(1)}, ${L$1(64)}));`);
 				s.push(`for (var ti = 0u; ti < ${p}_n; ti = ti + 1u) {`);
 				s.push(`let head = ${load("0u")};`);
 				s.push(`if (head.w < 0.5) { continue; }`);
-				s.push(`let bb = ${load(`${AABB_COL}u`)};`);
-				s.push(`let pad = ${p}_ms + ${p}_lw * ${L(4)} + ${p}_aa * ${L(2)};`);
+				s.push(`let bb = ${load(`14u`)};`);
+				s.push(`let pad = ${p}_ms + ${p}_lw * ${L$1(4)} + ${p}_aa * ${L$1(2)};`);
 				s.push(`let bbMin = vec2f(bb.x * ${p}_res.x, bb.y * ${p}_res.y) - vec2f(pad);`);
 				s.push(`let bbMax = vec2f(bb.z * ${p}_res.x, bb.w * ${p}_res.y) + vec2f(pad);`);
 				s.push(`if (all(${p}_px >= bbMin) && all(${p}_px <= bbMax)) {`);
 				s.push(`let mta = ${load("1u")};`);
 				s.push(`let tp = vec2f(head.x * ${p}_res.x, head.y * ${p}_res.y);`);
-				s.push(`let searching = select(${L(1)}, ${L(.45)}, mta.x > ${L(4)});`);
-				s.push(`if (${U("trail")} > ${L(.001)}) {`);
-				s.push(`var ePrev = ${load(`${2 + TRAIL_LEN - 1}u`)};`);
-				s.push(`for (var j = 0u; j < ${TRAIL_LEN}u; j = j + 1u) {`);
-				s.push(`let e = ${load("2u + j")};`);
-				s.push(`let valid = select(${L(0)}, ${L(1)}, abs(e.w - mta.z) < ${L(.5)}) * select(${L(0)}, ${L(1)}, e.z > ${L(.5)});`);
-				s.push(`let age = head.z - e.z;`);
-				s.push(`let fade = clamp(${L(1)} - age / ${L(maxAge)}, ${L(0)}, ${L(1)}) * valid;`);
-				s.push(`let ep = vec2f(e.x * ${p}_res.x, e.y * ${p}_res.y);`);
-				s.push(`let dp = ${p}_px - ep;`);
-				s.push(`let dsz = ${p}_ms * ${L(.16)};`);
-				s.push(`let dSd = (abs(dp.x) + abs(dp.y)) * ${L(.7071)} - dsz;`);
-				overP(`${U("keyframeColor")}.rgb`, `(${L(1)} - smoothstep(${L(0)}, ${p}_aa, dSd)) * ${U("keyframeColor")}.a * fade * ${U("trail")}`);
-				s.push(`let validP = select(${L(0)}, ${L(1)}, abs(ePrev.w - mta.z) < ${L(.5)}) * select(${L(0)}, ${L(1)}, ePrev.z > ${L(.5)});`);
-				s.push(`let stampGap = abs(e.z - ePrev.z);`);
-				s.push(`let contiguous = select(${L(0)}, ${L(1)}, stampGap < ${L(TRAIL_EVERY * 1.5)});`);
-				s.push(`let epp = vec2f(ePrev.x * ${p}_res.x, ePrev.y * ${p}_res.y);`);
-				s.push(`let pa = ${p}_px - epp; let ba = ep - epp;`);
-				s.push(`let h = clamp(dot(pa, ba) / max(dot(ba, ba), ${L(1e-4)}), ${L(0)}, ${L(1)});`);
-				s.push(`let segD = length(pa - ba * h);`);
-				overP(`${U("pathColor")}.rgb`, `(${L(1)} - smoothstep(${p}_lw * ${L(.4)}, ${p}_lw * ${L(.4)} + ${p}_aa, segD)) * ${U("pathColor")}.a * fade * validP * contiguous * ${U("trail")} * ${L(.8)}`);
-				s.push(`ePrev = e;`);
-				s.push(`}`);
-				s.push(`}`);
-				s.push(`let gp = ${p}_px - tp;`);
-				s.push(`let hlf = ${p}_ms * ${L(.5)};`);
-				s.push(`let q = abs(gp) - vec2f(hlf);`);
-				s.push(`let boxSd = length(max(q, vec2f(0.0))) + min(max(q.x, q.y), ${L(0)});`);
-				s.push(`var strokeA = ${L(1)} - smoothstep(${L(0)}, ${p}_aa, abs(boxSd) - ${p}_lw * ${L(.5)});`);
-				s.push(`let bl = hlf * ${L(.45)};`);
-				s.push(`let inCorner = abs(gp.x) > hlf - bl && abs(gp.y) > hlf - bl;`);
-				s.push(`strokeA = strokeA * select(${L(0)}, ${L(1)}, inCorner);`);
-				overP(`${U("markerColor")}.rgb`, `strokeA * ${U("markerColor")}.a * searching`);
-				s.push(`let tick = hlf * ${L(.55)};`);
-				s.push(`let chH = ${L(1)} - smoothstep(${L(0)}, ${p}_aa, max(abs(gp.y) - ${p}_lw * ${L(.5)}, abs(gp.x) - tick));`);
-				s.push(`let chV = ${L(1)} - smoothstep(${L(0)}, ${p}_aa, max(abs(gp.x) - ${p}_lw * ${L(.5)}, abs(gp.y) - tick));`);
-				overP(`${U("markerColor")}.rgb`, `max(chH, chV) * ${L(.55)} * ${U("markerColor")}.a * searching`);
-				overP(`vec3f(1.0, 1.0, 1.0)`, `(${L(1)} - smoothstep(${p}_lw, ${p}_lw + ${p}_aa, length(gp))) * searching`);
+				s.push(`let searching = select(${L$1(1)}, ${L$1(.45)}, mta.x > ${L$1(4)});`);
+				ringTrailStmts(f, {
+					len: 12,
+					every: 8,
+					load,
+					stages: [diamondStamp, pathSegmentStamp(8)]
+				});
+				bracketGizmo(f);
 				s.push(`}`);
 				s.push(`}`);
 			}
 			for (const line of s) ec.statement(line);
-			return `vec4f(${p}_dst.rgb / max(${p}_dst.a, ${L(1e-4)}), ${p}_dst.a)`;
+			return straightFromPremul(`${p}_dst`);
 		});
-	}
-};
-var KeyFrames_default = componentDefinition;
-export { trackHash as a, keyframesFeatureKernelBright as i, buildTrackKernel as n, componentDefinition as r, KeyFrames_default as t };
+	};
+}
+export { motionTrackerHud as n, createTrackerPursuitSim as r, detectionOverlay as t };