framefields 2.13.1 → 2.15.0

package/dist/{renderer-Dv_iRIyx.mjs → renderer-4nXkaAWu.mjs}

@@ -1,83 +1,29 @@
 import "./chunk-DOL2i2sR.mjs";
 import { It as getActiveMediaMetadata, _n as reportRenderDiagnostic, p as DEFAULT_DURATION_MS, rn as mediaSourceTime, vn as resolveBoolean, xn as resolveNumber } from "./dist-C8XSqfTx.mjs";
 import { i as effectReach, n as defineRenderer, r as effectMaxPixelScale, s as resolveFrameNumber, t as audioRegistry, u as solveHomography } from "./renderer-BuvKGwk3.mjs";
-import { $ as poseNodes, B as jointMatrices, F as getPrimitiveGeometry, G as measureMaxCaptionHeight, J as parseDashArray, M as fitSpansToText, N as generateExtrudedTextGeometry, _t as Light3D, ct as srtLoader, d as ScreenSpaceRelightPipeline, dt as transformScale, it as sampleMorphWeights, l as Renderer3D, mt as Camera3D, n as AudioLatentTrackCache, p as SlugFontCache, pt as resolveMediaSourceUrl, q as parseColor, rt as resolveTextSpans, st as spansText, xt as Vector3Math, yt as Matrix4Math } from "./dist-DtPPPsZV.mjs";
-import { a as createFullscreenPipeline, l as fragmentBindGroupLayout, n as PREMULTIPLIED_BLEND, t as FULLSCREEN_QUAD_WGSL } from "./gpu-D2HT3KcE.mjs";
-import { i as keyedGain, m as measureText, n as decodeAudioSource, s as resolveLayerDuration } from "./dist-CCrYOkcc.mjs";
+import { $ as measureMaxCaptionHeight, B as fractureModel, Dt as resolveMediaSourceUrl, Ft as Light3D, J as jointMatrices, Kt as defaultCubeFaceSize, Lt as Matrix4Math, S as blendClipLayers, Tt as trsMatrix, U as getPrimitiveGeometry, Ut as createRandom, V as generateExtrudedTextGeometry, Vt as cameraBasis, Wt as cubeFaceCameras, Zt as lensCenterDensity, _ as SpringBones, a as FRACTURE_INTERIOR_MATERIAL, b as applyConstraints, bt as srtLoader, f as ScreenSpaceRelightPipeline, ft as resolveTextSpans, gt as seatOnSurface, ht as scatterOnSurface, kt as Camera3D, m as SlugFontCache, mt as sampleMorphWeights, n as AudioLatentTrackCache, nt as parseDashArray, pt as rotateByQuat, st as poseNodes, tt as parseColor, u as Renderer3D, ut as resolveClips, wt as transformScale, x as bakeCrowdPalette, yt as spansText, z as fitSpansToText, zt as Vector3Math } from "./dist-XqlFM2a8.mjs";
+import { a as createFullscreenPipeline, l as fragmentBindGroupLayout, n as PREMULTIPLIED_BLEND, t as FULLSCREEN_QUAD_WGSL } from "./gpu-CH1PdM4T.mjs";
+import { i as keyedGain, m as measureText, n as decodeAudioSource, s as resolveLayerDuration } from "./dist-COOpgG9G.mjs";
 import { o as TemporalDeflickerPipeline } from "./dist-DgZpN6IK.mjs";
-import { B as evaluateKeyframes, I as computeLayout, N as collectNodeOps, U as initLayout, V as evaluateTrackAtFrame } from "./program-BfiB9ttP.mjs";
+import { B as collectNodeOps, U as computeLayout, Y as initLayout, Z as mappedEase, et as numberAt, it as vec3At, q as evaluateTrackAtFrame, rt as sampleTrack } from "./program-CMigyfso.mjs";
 import gsapModule from "gsap";
 
-//#region ../../nodes/node-compositor/dist/renderers-C0dsKt0u.mjs
-/**
-* Solves a cubic bezier curve defined by control points (x1, y1) and (x2, y2)
-* for a given progress parameter t in [0, 1].
-*/
-function solveCubicBezier(x1, y1, x2, y2, t) {
-	if (t <= 0) return 0;
-	if (t >= 1) return 1;
-	if (x1 === y1 && x2 === y2) return t;
-	let u = t;
-	for (let i = 0; i < 8; i++) {
-		const oneMinusU$1 = 1 - u;
-		const oneMinusU2 = oneMinusU$1 * oneMinusU$1;
-		const u2 = u * u;
-		const diff = 3 * oneMinusU2 * u * x1 + 3 * oneMinusU$1 * u2 * x2 + u2 * u - t;
-		if (Math.abs(diff) < 1e-6) break;
-		const dx = 3 * oneMinusU2 * x1 + 6 * oneMinusU$1 * u * (x2 - x1) + 3 * u2 * (1 - x2);
-		if (Math.abs(dx) < 1e-6) break;
-		u -= diff / dx;
-		u = Math.max(0, Math.min(1, u));
-	}
-	const oneMinusU = 1 - u;
-	const checkX = 3 * oneMinusU * oneMinusU * u * x1 + 3 * oneMinusU * u * u * x2 + u * u * u;
-	if (Math.abs(checkX - t) > .001) {
-		let low = 0;
-		let high = 1;
-		u = t;
-		for (let i = 0; i < 16; i++) {
-			const mid = (low + high) * .5;
-			const oMid = 1 - mid;
-			const xMid = 3 * oMid * oMid * mid * x1 + 3 * oMid * mid * mid * x2 + mid * mid * mid;
-			if (Math.abs(xMid - t) < 1e-5) {
-				u = mid;
-				break;
-			}
-			if (xMid < t) low = mid;
-			else high = mid;
-			u = mid;
-		}
-	}
-	const oU = 1 - u;
-	return 3 * oU * oU * u * y1 + 3 * oU * u * u * y2 + u * u * u;
-}
+//#region ../../nodes/node-compositor/dist/renderers-CrRYcARA.mjs
 const gsap = gsapModule.timeline ? gsapModule : gsapModule.default || gsapModule;
-/** GSAP's shaping for a keyframe segment, so draw-time tracks ease like baked ones. */
-function gsapEase(fps) {
-	return (ease, deltaFrames, t) => {
-		const e = mappedEase(ease, deltaFrames, fps);
-		const fn = typeof e === "function" ? e : gsap.parseEase(e);
-		return fn ? fn(t) : t;
-	};
-}
-function evaluateLive(live, frame, fps, signals) {
-	if ((live.track.source ?? { type: "keyframe" }).type === "keyframe") return evaluateKeyframes(live.track, frame - live.startFrame, gsapEase(fps));
-	return evaluateTrackAtFrame(live.track, frame, fps, {
-		startFrame: live.startFrame,
-		baseValues: live.stub,
-		signals
-	});
-}
 /** Seeks the compiled timeline to a frame and applies its live signal tracks. */
 function seekTimeline(result, frame, fps) {
 	result.tl.seek(frame / fps);
 	for (const live of result.live) {
 		let f = Math.max(live.startFrame, Math.min(live.endFrame, frame));
 		if (live.step && live.step > 1) f = live.startFrame + Math.floor((f - live.startFrame) / live.step) * live.step;
-		live.stub[live.track.prop] = evaluateLive(live, f, fps, result.signals);
+		live.stub[live.track.prop] = sampleTrack(live.track, f, fps, {
+			startFrame: live.startFrame,
+			base: live.stub,
+			signals: result.signals
+		});
 	}
 }
-const cache = /* @__PURE__ */ new Map();
+const cache$1 = /* @__PURE__ */ new Map();
 const nodesHashMemo = /* @__PURE__ */ new WeakMap();
 /** Entries untouched for this long are dropped (and their timeline killed). */
 const CACHE_TTL_MS = 1e4;
@@ -121,17 +67,17 @@ function release(value) {
 * the least-recently-used entry if the cache is at capacity. Every dropped
 * timeline MUST be killed — see `release`.
 */
-function evictForInsert(cache$1, maxSize) {
+function evictForInsert(cache$2, maxSize) {
 	const now = Date.now();
-	for (const [key, entry] of cache$1.entries()) if (now - entry.cacheTime > CACHE_TTL_MS) {
-		cache$1.delete(key);
+	for (const [key, entry] of cache$2.entries()) if (now - entry.cacheTime > CACHE_TTL_MS) {
+		cache$2.delete(key);
 		release(entry.value);
 	}
-	if (cache$1.size >= maxSize) {
-		const oldestKey = cache$1.keys().next().value;
+	if (cache$2.size >= maxSize) {
+		const oldestKey = cache$2.keys().next().value;
 		if (oldestKey !== void 0) {
-			const oldest = cache$1.get(oldestKey);
-			cache$1.delete(oldestKey);
+			const oldest = cache$2.get(oldestKey);
+			cache$2.delete(oldestKey);
 			if (oldest) release(oldest.value);
 		}
 	}
@@ -147,76 +93,26 @@ function stableStringify(obj) {
 	}).join(",") + "}";
 }
 function getCachedTimeline(cacheKey) {
-	const entry = cache.get(cacheKey);
+	const entry = cache$1.get(cacheKey);
 	if (entry) {
 		if (Date.now() - entry.cacheTime > CACHE_TTL_MS) {
-			cache.delete(cacheKey);
+			cache$1.delete(cacheKey);
 			release(entry.value);
 			return;
 		}
 		entry.cacheTime = Date.now();
-		cache.delete(cacheKey);
-		cache.set(cacheKey, entry);
+		cache$1.delete(cacheKey);
+		cache$1.set(cacheKey, entry);
 		return entry.value;
 	}
 }
 function setCachedTimeline(cacheKey, value) {
-	evictForInsert(cache, TIMELINE_CACHE_MAX);
-	cache.set(cacheKey, {
+	evictForInsert(cache$1, TIMELINE_CACHE_MAX);
+	cache$1.set(cacheKey, {
 		cacheTime: Date.now(),
 		value
 	});
 }
-function mappedEase(ease, durationFrames, fps = 24) {
-	if (!ease) return "none";
-	const { name, dir, params } = ease;
-	if (name === "none") return "none";
-	if (name === "spring") {
-		const damping = Math.max(.001, params?.[0] ?? 10);
-		const stiffness = Math.max(.001, params?.[1] ?? 100);
-		const mass = Math.max(.001, params?.[2] ?? 1);
-		return (p) => {
-			const t = p * (durationFrames && durationFrames > 0 ? durationFrames / (fps > 0 ? fps : 24) : 1);
-			const m = mass;
-			const k = stiffness;
-			const c = damping;
-			const w0 = Math.sqrt(k / m);
-			const zeta = c / (2 * Math.sqrt(k * m));
-			let x = 0;
-			if (zeta < 1) {
-				const wd = w0 * Math.sqrt(1 - zeta * zeta);
-				const A = -1;
-				const B = -zeta * w0 / wd;
-				x = Math.exp(-zeta * w0 * t) * (A * Math.cos(wd * t) + B * Math.sin(wd * t));
-			} else if (zeta === 1) {
-				const A = -1;
-				const B = -w0;
-				x = Math.exp(-w0 * t) * (A + B * t);
-			} else {
-				const r1 = -w0 * (zeta - Math.sqrt(zeta * zeta - 1));
-				const r2 = -w0 * (zeta + Math.sqrt(zeta * zeta - 1));
-				const C1 = -1 / (1 - r1 / r2);
-				const C2 = -1 - C1;
-				x = C1 * Math.exp(r1 * t) + C2 * Math.exp(r2 * t);
-			}
-			return 1 + x;
-		};
-	}
-	if (name === "cubic") {
-		const x1 = params?.[0] ?? .25;
-		const y1 = params?.[1] ?? .1;
-		const x2 = params?.[2] ?? .25;
-		const y2 = params?.[3] ?? 1;
-		return (p) => solveCubicBezier(x1, y1, x2, y2, p);
-	}
-	if (name === "hold") return (p) => p >= .9999 ? 1 : 0;
-	const easeName = name;
-	let suffix = "";
-	if (params && params.length > 0) suffix = `(${params.join(", ")})`;
-	else if (name === "back") suffix = "(1.7)";
-	else if (name === "elastic") suffix = "(1, 0.3)";
-	return `${easeName}.${dir}${suffix}`;
-}
 /** Props that switch rather than tween: each key is a set from its frame on. */
 const DISCRETE_PROPS = new Set(["hidden", "muted"]);
 function compileTrackToTimeline(tl, stub, track, startFrame, fps, durationFrames, signals, live, step) {
@@ -231,7 +127,11 @@ function compileTrackToTimeline(tl, stub, track, startFrame, fps, durationFrames
 			endFrame: startFrame + (Number.isFinite(durationFrames) ? durationFrames : Math.round(fps * 5)),
 			...stepped && { step }
 		};
-		stub[prop] = evaluateLive(entry, startFrame, fps, signals);
+		stub[prop] = sampleTrack(track, startFrame, fps, {
+			startFrame,
+			base: stub,
+			signals
+		});
 		live.push(entry);
 		return {
 			dropped: 0,
@@ -366,6 +266,28 @@ function compileTrackToTimeline(tl, stub, track, startFrame, fps, durationFrames
 		maxAuthoredFrame
 	};
 }
+/** A camera's `x` / `y` / `z` are its eye, the same as `cameraX` / `cameraY` / `cameraZ`. */
+const CAMERA_EYE = {
+	x: "cameraX",
+	y: "cameraY",
+	z: "cameraZ"
+};
+/**
+* A layer's tracks, with a camera's `x` / `y` / `z` tracks driving its eye:
+* the eye is read from `cameraX` / `cameraY` / `cameraZ`, which the static
+* `x` / `y` / `z` seed, so a track left on `x` would never move it.
+*/
+function layerTracks(lop) {
+	const tracks = lop.animation?.tracks ?? [];
+	if (lop.kind !== "camera") return tracks;
+	return tracks.map((t) => {
+		const eye = CAMERA_EYE[t.prop];
+		return eye ? {
+			...t,
+			prop: eye
+		} : t;
+	});
+}
 /**
 * Dedupe per compiled cache key — a fresh render of the same broken doc SHOULD
 * re-warn. Single-frame renders are the exception: each `renderFrame` call has
@@ -434,6 +356,7 @@ function hashNodes(nodeOps, width, height, fps, durationSec) {
 				maxBlurRadius: lop.maxBlurRadius,
 				shakeTranslation: lop.shakeTranslation,
 				shakeRotation: lop.shakeRotation,
+				relativitySpeed: lop.relativitySpeed,
 				orbitRadius: lop.orbitRadius,
 				orbitAzimuth: lop.orbitAzimuth,
 				orbitElevation: lop.orbitElevation,
@@ -443,11 +366,35 @@ function hashNodes(nodeOps, width, height, fps, durationSec) {
 				specularIntensity: lop.specularIntensity,
 				ambientIntensity: lop.ambientIntensity,
 				metallic: lop.metallic,
+				emissive: lop.emissive,
+				emissiveIntensity: lop.emissiveIntensity,
+				clearcoat: lop.clearcoat,
+				clearcoatRoughness: lop.clearcoatRoughness,
+				anisotropy: lop.anisotropy,
+				anisotropyRotation: lop.anisotropyRotation,
+				subsurface: lop.subsurface,
+				subsurfaceColor: lop.subsurfaceColor,
+				sheen: lop.sheen,
+				sheenColor: lop.sheenColor,
+				sheenRoughness: lop.sheenRoughness,
+				iridescence: lop.iridescence,
+				iridescenceThickness: lop.iridescenceThickness,
+				iridescenceIor: lop.iridescenceIor,
+				triplanar: lop.triplanar,
+				triplanarScale: lop.triplanarScale,
+				triplanarSharpness: lop.triplanarSharpness,
 				lightType: lop.lightType,
+				color: lop.color,
 				intensity: lop.intensity,
 				radius: lop.radius,
 				angle: lop.angle,
 				penumbra: lop.penumbra,
+				exposure: lop.exposure,
+				hdri: typeof lop.hdri === "string" ? lop.hdri : Boolean(lop.hdri),
+				volumetricFog: lop.volumetricFog,
+				volumetricFogDensity: lop.volumetricFogDensity,
+				volumetricFogAnisotropy: lop.volumetricFogAnisotropy,
+				volumetricFogNoiseStrength: lop.volumetricFogNoiseStrength,
 				animationProgress: lop.animationProgress,
 				animationTime: lop.animationTime,
 				animationSpeed: lop.animationSpeed,
@@ -540,13 +487,30 @@ function compileTimeline(renderId, virtualMedia, options) {
 			is3D: lop.is3D ?? (lop.kind === "camera" || lop.kind === "light" || lop.kind === "model3d" ? true : false),
 			z: lop.z ?? (lop.kind === "camera" ? lop.z ?? -1500 : 0),
 			scaleZ: lop.scaleZ ?? 1,
-			twoSided: lop.twoSided ?? true,
+			twoSided: lop.twoSided ?? lop.kind !== "light",
 			material: lop.material,
 			shininess: lop.shininess,
 			roughness: lop.roughness,
 			specularIntensity: lop.specularIntensity,
 			ambientIntensity: lop.ambientIntensity,
 			metallic: lop.metallic,
+			emissive: lop.emissive,
+			emissiveIntensity: lop.emissiveIntensity,
+			clearcoat: lop.clearcoat,
+			clearcoatRoughness: lop.clearcoatRoughness,
+			anisotropy: lop.anisotropy,
+			anisotropyRotation: lop.anisotropyRotation,
+			subsurface: lop.subsurface,
+			subsurfaceColor: lop.subsurfaceColor,
+			sheen: lop.sheen,
+			sheenColor: lop.sheenColor,
+			sheenRoughness: lop.sheenRoughness,
+			iridescence: lop.iridescence,
+			iridescenceThickness: lop.iridescenceThickness,
+			iridescenceIor: lop.iridescenceIor,
+			triplanar: lop.triplanar,
+			triplanarScale: lop.triplanarScale,
+			triplanarSharpness: lop.triplanarSharpness,
 			animationProgress: lop.animationProgress ?? 0,
 			animationTime: lop.animationTime ?? 0,
 			animationSpeed: lop.animationSpeed ?? 1,
@@ -570,17 +534,23 @@ function compileTimeline(renderId, virtualMedia, options) {
 			maxBlurRadius: lop.maxBlurRadius ?? lop.dof?.maxBlurRadius ?? 24,
 			shakeTranslation: lop.shakeTranslation ?? (lop.shake?.enabled ? lop.shake?.translationAmplitude ?? 0 : 0),
 			shakeRotation: lop.shakeRotation ?? (lop.shake?.enabled ? lop.shake?.rotationAmplitude ?? 0 : 0),
+			relativitySpeed: lop.relativitySpeed ?? lop.relativity?.speed ?? 0,
 			orbitRadius: lop.orbitRadius,
 			orbitAzimuth: lop.orbitAzimuth,
 			orbitElevation: lop.orbitElevation,
 			lightType: lop.lightType,
+			color: lop.color,
 			intensity: lop.intensity ?? (lop.kind === "light" ? 1 : void 0),
 			radius: lop.radius,
 			angle: lop.angle,
 			penumbra: lop.penumbra,
-			decay: lop.decay
+			decay: lop.decay,
+			exposure: lop.exposure,
+			volumetricFogDensity: lop.volumetricFogDensity,
+			volumetricFogAnisotropy: lop.volumetricFogAnisotropy,
+			volumetricFogNoiseStrength: lop.volumetricFogNoiseStrength
 		};
-		for (const track of lop.animation?.tracks ?? []) if ((track.source ?? { type: "keyframe" }).type !== "keyframe") stub[track.prop] = evaluateTrackAtFrame(track, lop.startFrame ?? 0, fps, {
+		for (const track of layerTracks(lop)) if ((track.source ?? { type: "keyframe" }).type !== "keyframe") stub[track.prop] = evaluateTrackAtFrame(track, lop.startFrame ?? 0, fps, {
 			startFrame: lop.startFrame ?? 0,
 			baseValues: stub,
 			signals
@@ -610,7 +580,7 @@ function compileTimeline(renderId, virtualMedia, options) {
 			const durationMs = resolveLayerDuration(void 0, childMeta?.durationMs ?? void 0, composeDuration, layerType);
 			durationFrames = Math.max(1, Math.round(durationMs / 1e3 * fps));
 		}
-		for (const track of lop.animation?.tracks ?? []) {
+		for (const track of layerTracks(lop)) {
 			const { dropped, maxAuthoredFrame } = compileTrackToTimeline(tl, stub, track, startFrame, fps, durationFrames, signals, live, lop.animation?.frameStep);
 			if (dropped > 0) truncations.push({
 				layerId,
@@ -633,6 +603,7 @@ function compileTimeline(renderId, virtualMedia, options) {
 	tl.seek(1e-6);
 	tl.seek(0);
 	const compileResult = {
+		key: cacheKey,
 		tl,
 		targetsById,
 		nodes: nodeOps,
@@ -687,6 +658,232 @@ function compileLayerTimeline(layerId, animation, baseVolume, baseMuted, fps) {
 	return result;
 }
 /**
+* Character animation for the compositor: poses a model from its clip
+* layers, look-at and IK constraints (targets in scene coordinates) and
+* spring bones (replayed from frame 0 and cached, so frames render the
+* same in any order); and the per-instance records of skinned crowds.
+*/
+const transformPoint$1 = (m, p) => [
+	m[0] * p[0] + m[4] * p[1] + m[8] * p[2] + m[12],
+	m[1] * p[0] + m[5] * p[1] + m[9] * p[2] + m[13],
+	m[2] * p[0] + m[6] * p[1] + m[10] * p[2] + m[14]
+];
+const transformDir = (m, v) => [
+	m[0] * v[0] + m[4] * v[1] + m[8] * v[2],
+	m[1] * v[0] + m[5] * v[1] + m[9] * v[2],
+	m[2] * v[0] + m[6] * v[1] + m[10] * v[2]
+];
+/**
+* A mesh's morph weights: the clip's (or the file's defaults), with any
+* target the layer names in `morphs` set from its track. Names match
+* case-insensitively against the mesh's `morphTargetNames`.
+*/
+function namedMorphWeights(names, base, morphs, clock) {
+	if (!morphs || !names?.length) return base;
+	const out = [...base];
+	const index = new Map(names.map((n, i) => [n.toLowerCase(), i]));
+	for (const [name, track] of Object.entries(morphs)) {
+		const i = index.get(name.toLowerCase());
+		if (i !== void 0) out[i] = numberAt(track, clock, out[i] ?? 0);
+	}
+	return out;
+}
+/** Whether a node needs the rig evaluator (anything beyond one plain clip). */
+function hasRig(n) {
+	return Boolean(n.animationLayers?.length || n.ik?.length || n.lookAt?.length || n.springBones?.length || n.pose && Object.keys(n.pose).length || n.aim?.length || n.drive?.length);
+}
+/** Local rotation for Euler degrees, applied Z, then Y, then X (R = Rz · Ry · Rx), like layers. */
+function eulerQuat(rx, ry, rz) {
+	const h = (d) => d * Math.PI / 360;
+	const [sx, cx] = [Math.sin(h(rx)), Math.cos(h(rx))];
+	const [sy, cy] = [Math.sin(h(ry)), Math.cos(h(ry))];
+	const [sz, cz] = [Math.sin(h(rz)), Math.cos(h(rz))];
+	return [
+		cz * cy * sx - sz * sy * cx,
+		cz * sy * cx + sz * cy * sx,
+		sz * cy * cx - cz * sy * sx,
+		cz * cy * cx + sz * sy * sx
+	];
+}
+function jointPoses(p, clock) {
+	return Object.entries(p.node.pose ?? {}).map(([joint, j]) => ({
+		joint,
+		rotation: eulerQuat(numberAt(j.rotateX, clock, 0), numberAt(j.rotateY, clock, 0), numberAt(j.rotateZ, clock, 0)),
+		offset: [
+			numberAt(j.x, clock, 0),
+			numberAt(j.y, clock, 0),
+			numberAt(j.z, clock, 0)
+		],
+		weight: numberAt(j.weight, clock, 1),
+		mode: j.mode ?? "additive"
+	}));
+}
+function clipLayers(p, frame) {
+	const layers = p.node.animationLayers;
+	if (!layers?.length) return p.clip ? [{
+		clip: p.clip,
+		time: p.clipSec,
+		weight: 1
+	}] : [];
+	const out = [];
+	for (const l of layers) {
+		const [clip] = resolveClips(p.model, [l.clip]);
+		if (!clip) continue;
+		let time = (l.timeOffset ?? 0) + frame / p.fps * (l.speed ?? 1);
+		if (clip.duration > 0) time = l.loop ?? true ? (time % clip.duration + clip.duration) % clip.duration : Math.min(Math.max(time, 0), clip.duration);
+		out.push({
+			clip,
+			time,
+			weight: numberAt(l.weight, {
+				frame,
+				fps: p.fps
+			}, 1),
+			mask: l.mask
+		});
+	}
+	return out;
+}
+function constraintsAt(p, frame, toModel) {
+	const clock = {
+		frame,
+		fps: p.fps
+	};
+	const point = (t) => transformPoint$1(toModel, vec3At(t, clock));
+	const direction = (t) => transformDir(toModel, vec3At(t, clock));
+	return {
+		pose: jointPoses(p, clock),
+		aim: (p.node.aim ?? []).map((a) => ({
+			joint: a.joint,
+			direction: direction(a.direction),
+			weight: numberAt(a.weight, clock, 1),
+			...a.axis && { axis: a.axis }
+		})),
+		ik: (p.node.ik ?? []).map((c) => ({
+			chain: c.chain,
+			target: point(c.target),
+			pole: c.poleTarget ? point(c.poleTarget) : void 0,
+			weight: numberAt(c.weight, clock, 1)
+		})),
+		drive: [...p.model.drivers ?? [], ...p.node.drive ?? []],
+		lookAt: (p.node.lookAt ?? []).map((c) => ({
+			joint: c.joint,
+			target: point(c.target),
+			weight: numberAt(c.weight, clock, 1),
+			maxAngleDeg: c.maxAngleDeg ?? 70,
+			axis: c.axis ?? [
+				0,
+				0,
+				1
+			]
+		}))
+	};
+}
+/** The pose before springs: blended clips, then constraints. */
+function basePose(p, frame, toModel) {
+	const rig = blendClipLayers(p.model, clipLayers(p, frame));
+	applyConstraints(rig, constraintsAt(p, frame, toModel));
+	return rig;
+}
+const springStates = /* @__PURE__ */ new Map();
+function springsAt(p, toModel, rig) {
+	const chains = p.node.springBones;
+	if (!chains?.length) return void 0;
+	const config = JSON.stringify([
+		chains,
+		p.node.animationLayers,
+		p.node.pose,
+		p.node.aim,
+		p.fps
+	]);
+	let s = springStates.get(p.key);
+	const frame = Math.max(0, Math.floor(p.frame));
+	if (!s || s.model !== p.model || s.config !== config || s.frame > frame) {
+		const gravityModel = (g) => transformDir(toModel, g ?? [
+			0,
+			0,
+			0
+		]);
+		s = {
+			model: p.model,
+			config,
+			springs: new SpringBones(rig, chains.map((c) => ({
+				...c,
+				gravity: gravityModel(c.gravity)
+			}))),
+			frame: -1
+		};
+		if (springStates.size > 256) springStates.clear();
+		springStates.set(p.key, s);
+	}
+	for (let f = s.frame + 1; f <= frame; f++) {
+		s.springs.step(basePose(p, f, toModel), 1 / p.fps);
+		s.frame = f;
+	}
+	return s.springs;
+}
+/** Model-space node matrices for this frame. */
+function poseCharacter(p) {
+	if (!hasRig(p.node) && !p.model.drivers?.length) return poseNodes(p.model, p.clip, p.clipSec);
+	const toModel = Matrix4Math.invert(p.sceneRoot) ?? Matrix4Math.identity();
+	const rig = basePose(p, p.frame, toModel);
+	springsAt(p, toModel, rig)?.apply(rig);
+	return rig.world();
+}
+const bakes = /* @__PURE__ */ new WeakMap();
+const palettes = /* @__PURE__ */ new WeakMap();
+/** A baked palette on the GPU, uploaded once. */
+function paletteBuffer(device, palette) {
+	let buffer = palettes.get(palette);
+	if (!buffer) {
+		buffer = device.createBuffer({
+			label: "CrowdPalette",
+			size: Math.max(64, palette.byteLength),
+			usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_DST
+		});
+		device.queue.writeBuffer(buffer, 0, palette);
+		palettes.set(palette, buffer);
+	}
+	return buffer;
+}
+/** The model's crowd palette for these clips, baked once. */
+function crowdBake(model, crowd) {
+	const key = JSON.stringify([crowd.clips, crowd.fps ?? 30]);
+	let byKey = bakes.get(model);
+	if (!byKey) {
+		byKey = /* @__PURE__ */ new Map();
+		bakes.set(model, byKey);
+	}
+	let bake = byKey.get(key);
+	if (!bake) {
+		const clips = resolveClips(model, crowd.clips);
+		if (!clips.length) return void 0;
+		bake = bakeCrowdPalette(model, clips, crowd.fps ?? 30);
+		byKey.set(key, bake);
+	}
+	return bake;
+}
+/**
+* Instance `i`'s second record: (first baked frame, frames per loop, phase
+* in frames, frames per second of playback). Unset fields come from the seed: clip i % n, a random
+* phase, a speed within `speedRange`.
+*/
+function crowdRecord(bake, crowd, i, anim) {
+	const rand = createRandom((crowd.seed ?? 1) * 7919 + i * 104729);
+	const pick = rand();
+	const speedDraw = rand();
+	const clipIndex = (anim.clip ?? i) % bake.clips.length;
+	const range = bake.clips[Math.max(0, clipIndex)];
+	const [s0, s1] = crowd.speedRange ?? [1, 1];
+	const offset = anim.animOffset ?? ((crowd.phase ?? "random") === "random" ? pick * range.duration : 0);
+	const rate = range.duration > 0 ? range.count / range.duration : bake.fps;
+	return [
+		range.base,
+		range.count,
+		offset * rate,
+		(anim.animSpeed ?? s0 + (s1 - s0) * speedDraw) * rate
+	];
+}
+/**
 * Which container kinds paint their own background.
 *
 * flex/block/box all accept an optional `background` in the program schema.
@@ -698,6 +895,110 @@ function shouldPaintContainerBackground(kind, background) {
 	if (!background) return false;
 	return kind === "flex" || kind === "block" || kind === "box";
 }
+/** Largest face a cube camera picks on its own; `lens.cubeSize` may go higher. */
+const DEFAULT_MAX_FACE = 4096;
+/**
+* The cube camera an authored camera asks for, or null for an ordinary
+* perspective view. A camera with `relativity` is always a cube camera, even
+* at speed 0, so a shot that accelerates from rest never switches pipelines.
+*/
+function resolveCubeCamera(authored, camera, speed, width, height, maxTextureSize) {
+	const projection = authored?.lens?.projection ?? "perspective";
+	const relativity = authored?.relativity;
+	if (projection === "perspective" && !relativity) return null;
+	const lens = {
+		projection,
+		fov: camera.fov,
+		zoom: camera.zoom
+	};
+	const requested = authored?.lens?.cubeSize;
+	const faceSize = Math.min(maxTextureSize, requested ?? defaultCubeFaceSize(lens, width, height, Math.min(DEFAULT_MAX_FACE, maxTextureSize)));
+	const basis = cameraBasis(camera);
+	const observer = relativity ? {
+		speed,
+		direction: relativity.direction ? Vector3Math.normalize(relativity.direction) : basis.forward,
+		doppler: relativity.doppler ?? true,
+		beaming: relativity.beaming ?? true,
+		exposure: relativity.exposure ?? "auto"
+	} : null;
+	return {
+		faceSize,
+		remap: {
+			...lens,
+			basis,
+			observer
+		},
+		centerDensity: lensCenterDensity(lens, width, height)
+	};
+}
+/**
+* Whether the pieces are all still where they started at `frame` (or there
+* is no track): the layer looks whole, and its cut faces, hidden inside,
+* need not draw (where pieces meet, a cut face can tie the surface's depth).
+*/
+function fractureWhole(model, spec, frame) {
+	const track = spec.track;
+	const stride = (model.nodes?.length ?? 0) * 7;
+	if (!track?.length || !stride) return true;
+	const frames = Math.floor(track.length / stride);
+	const at = Math.min(Math.max(Math.ceil(frame), 0), frames - 1) * stride;
+	for (let i = 0; i < stride; i++) if (track[at + i] !== track[i]) return false;
+	return true;
+}
+/** The fractured model for a node's source model (cached per model and spec). */
+function fracturedModel(model, spec) {
+	return fractureModel(model, spec).model;
+}
+function poseAt(track, at) {
+	return {
+		p: [
+			track[at],
+			track[at + 1],
+			track[at + 2]
+		],
+		q: [
+			track[at + 3],
+			track[at + 4],
+			track[at + 5],
+			track[at + 6]
+		]
+	};
+}
+function blend(a, b, t) {
+	if (t <= 0) return a;
+	const sign = a.q.reduce((s, v, i) => s + v * b.q[i], 0) < 0 ? -1 : 1;
+	const q = a.q.map((v, i) => v + (b.q[i] * sign - v) * t);
+	const len = Math.hypot(...q) || 1;
+	return {
+		p: a.p.map((v, i) => v + (b.p[i] - v) * t),
+		q: q.map((v) => v / len)
+	};
+}
+/**
+* Model-space matrices of the pieces' nodes at `frame`. The track is in the
+* layer's parent space (physics reads the layer's own x/y/z, as for any
+* body), and `layerProps` is the layer's matrix in that space, L. A piece
+* at pose (p, q) has node matrix L⁻¹ · T(p) · R(q) · S, so with its inverse
+* bind T(−centroid) a vertex lands at parent · (p + q · S · (v − centroid)):
+* pieces fly in their group, like other bodies. Undefined without a track.
+*/
+function fracturePose(model, spec, frame, layerProps, scale$1) {
+	const track = spec.track;
+	const pieces = model.nodes?.length ?? 0;
+	const stride = pieces * 7;
+	if (!track?.length || !stride || track.length % stride !== 0) return void 0;
+	const frames = track.length / stride;
+	const f = Math.min(Math.max(frame, 0), frames - 1);
+	const f0 = Math.floor(f);
+	const f1 = Math.min(frames - 1, f0 + 1);
+	const toModel = Matrix4Math.invert(layerProps) ?? Matrix4Math.identity();
+	const out = [];
+	for (let i = 0; i < pieces; i++) {
+		const { p, q } = blend(poseAt(track, f0 * stride + i * 7), poseAt(track, f1 * stride + i * 7), f - f0);
+		out.push(Matrix4Math.multiply(toModel, trsMatrix(p, q, scale$1)));
+	}
+	return out;
+}
 const TRANSFORMS = new Set([
 	"position",
 	"rotation",
@@ -729,6 +1030,253 @@ function compatibleMeshDraws(a, b) {
 	for (const key of keys) if (!TRANSFORMS.has(key) && !sameValue(left[key], right[key])) return false;
 	return true;
 }
+/** Two frames of one value: the latest and the one before it. */
+var Slots = class {
+	frame = NaN;
+	value;
+	prevFrame = NaN;
+	prevValue;
+	write(frame, value) {
+		if (frame !== this.frame) {
+			this.prevFrame = this.frame;
+			this.prevValue = this.value;
+		}
+		this.frame = frame;
+		this.value = value;
+	}
+	/** The value at `frame`, if it is one of the two held. */
+	at(frame) {
+		if (frame === this.frame) return this.value;
+		if (frame === this.prevFrame) return this.prevValue;
+	}
+};
+var MotionHistory = class {
+	states = /* @__PURE__ */ new Map();
+	instances;
+	vertices;
+	camera = new Slots();
+	/** Frames recorded, latest last (two kept). */
+	frames = new Slots();
+	constructor(device) {
+		this.instances = new GpuPairs(device, "Instances");
+		this.vertices = new GpuPairs(device, "Vertices");
+	}
+	/** Whether rendering `frame` must render `frame - 1` first to know its motion. */
+	needsPrevious(frame) {
+		return frame > 0 && this.frames.at(frame - 1) === void 0;
+	}
+	previousCamera(frame) {
+		return this.camera.at(frame - 1);
+	}
+	/** A mesh's state at `frame - 1`, shaped for the velocity pass. */
+	previousMesh(key, frame, now) {
+		const prev = this.states.get(key)?.at(frame - 1);
+		if (prev?.kind !== "mesh") return void 0;
+		const out = { modelMatrix: prev.modelMatrix };
+		if (now.skinning && prev.skinning?.length === now.skinning.length) out.skinningMatrices = prev.skinning;
+		const copy = this.instances.at(key, frame - 1);
+		if (now.instanceBuffer && copy && prev.instanceBytes === now.instanceBuffer.size) out.instanceBuffer = copy;
+		const vertices = this.vertices.at(key, frame - 1);
+		if (now.vertexBytes && vertices && prev.vertexBytes === now.vertexBytes) out.vertexBuffer = vertices;
+		if (now.wind && prev.windTime !== void 0) out.wind = {
+			...now.wind,
+			time: prev.windTime
+		};
+		if (now.crowd && prev.crowdTime !== void 0) out.crowd = {
+			...now.crowd,
+			time: prev.crowdTime
+		};
+		return out;
+	}
+	previousQuad(key, frame) {
+		const prev = this.states.get(key)?.at(frame - 1);
+		return prev?.kind === "quad" ? prev.modelMatrix : void 0;
+	}
+	/**
+	* Records a mesh at `frame`; its instance records and deformed vertices
+	* (when the GPU deforms it) are copied in `encoder`.
+	*/
+	recordMesh(encoder, key, frame, state, buffers) {
+		const { instanceBuffer, vertices } = buffers;
+		if (instanceBuffer) this.instances.copy(encoder, key, frame, instanceBuffer, instanceBuffer.size, GPUBufferUsage.STORAGE);
+		if (vertices) this.vertices.copy(encoder, key, frame, vertices.buffer, vertices.bytes, GPUBufferUsage.VERTEX);
+		this.slots(key).write(frame, {
+			kind: "mesh",
+			...state,
+			...state.skinning && { skinning: state.skinning.slice() },
+			instanceBytes: instanceBuffer?.size,
+			vertexBytes: vertices?.bytes
+		});
+	}
+	previousSlug(key, frame) {
+		const prev = this.states.get(key)?.at(frame - 1);
+		return prev?.kind === "slug" ? prev : void 0;
+	}
+	/** Records a text plane at `frame`; glyph records are copied (batches are rebuilt each frame). */
+	recordSlug(key, frame, modelMatrix, batches) {
+		this.slots(key).write(frame, {
+			kind: "slug",
+			modelMatrix,
+			batches: batches.map((b) => ({
+				...b,
+				instances: b.instances.slice(0, b.instanceCount * 24)
+			}))
+		});
+	}
+	recordQuad(key, frame, modelMatrix) {
+		this.slots(key).write(frame, {
+			kind: "quad",
+			modelMatrix
+		});
+	}
+	recordFrame(frame, camera) {
+		this.camera.write(frame, camera);
+		this.frames.write(frame, true);
+	}
+	slots(key) {
+		let s = this.states.get(key);
+		if (!s) {
+			s = new Slots();
+			this.states.set(key, s);
+		}
+		return s;
+	}
+};
+/** GPU copies of a buffer per key, one per frame parity. */
+var GpuPairs = class {
+	pairs = /* @__PURE__ */ new Map();
+	constructor(device, label) {
+		this.device = device;
+		this.label = label;
+	}
+	at(key, frame) {
+		return this.pairs.get(key)?.[frame & 1];
+	}
+	copy(encoder, key, frame, source, bytes, usage) {
+		const pair = this.pairs.get(key) ?? [];
+		const slot = frame & 1;
+		let copy = pair[slot];
+		if (!copy || copy.size !== bytes) {
+			copy?.destroy();
+			copy = this.device.createBuffer({
+				label: `MotionHistory${this.label}:${key}`,
+				size: bytes,
+				usage: usage | GPUBufferUsage.COPY_DST
+			});
+			pair[slot] = copy;
+			this.pairs.set(key, pair);
+		}
+		encoder.copyBufferToBuffer(source, 0, copy, 0, bytes);
+	}
+};
+const histories = /* @__PURE__ */ new Map();
+/** The motion history of one composition render (by render id). */
+function motionHistory(device, renderId) {
+	let h = histories.get(renderId);
+	if (!h) {
+		if (histories.size > 64) histories.clear();
+		h = new MotionHistory(device);
+		histories.set(renderId, h);
+	}
+	return h;
+}
+/** T · Rz · Ry · Rx · S: the transform the compositor draws a model with. */
+function nodeMatrix(n) {
+	const rad = Math.PI / 180;
+	const s = n.scale ?? 1;
+	let m = Matrix4Math.translate(n.x ?? 0, n.y ?? 0, n.z ?? 0);
+	if (n.rotateZ) m = Matrix4Math.multiply(m, Matrix4Math.rotateZ(n.rotateZ * rad));
+	if (n.rotateY) m = Matrix4Math.multiply(m, Matrix4Math.rotateY(n.rotateY * rad));
+	if (n.rotateX) m = Matrix4Math.multiply(m, Matrix4Math.rotateX(n.rotateX * rad));
+	return Matrix4Math.multiply(m, Matrix4Math.scale(s * (n.scaleX ?? 1), s * (n.scaleY ?? 1), s * (n.scaleZ ?? 1)));
+}
+const isModel = (v) => typeof v === "object" && v !== null && "meshes" in v;
+/** The surface's mesh: in memory, rebuilt from its primitive spec, or loaded. */
+async function surfaceModel(n, load) {
+	if (isModel(n.modelData)) return n.modelData;
+	if (n.primitive3d) return getPrimitiveGeometry(n.primitive3d);
+	if (n.src) return load(n.src, n);
+}
+const NO_PRE = {
+	q: [
+		0,
+		0,
+		0,
+		1
+	],
+	s: 1
+};
+function composeQuat(a, b) {
+	return [
+		a[3] * b[0] + a[0] * b[3] + a[1] * b[2] - a[2] * b[1],
+		a[3] * b[1] - a[0] * b[2] + a[1] * b[3] + a[2] * b[0],
+		a[3] * b[2] + a[0] * b[1] - a[1] * b[0] + a[2] * b[3],
+		a[3] * b[3] - a[0] * b[0] - a[1] * b[1] - a[2] * b[2]
+	];
+}
+/** The variant's lowest point after its own rotation and scale: the largest y (up is -y). */
+function variantBottom(model, pre) {
+	const b = model.bounds;
+	if (!b) return 0;
+	let bottom = Number.NEGATIVE_INFINITY;
+	for (let k = 0; k < 8; k++) {
+		const corner = [
+			k & 1 ? b.max[0] : b.min[0],
+			k & 2 ? b.max[1] : b.min[1],
+			k & 4 ? b.max[2] : b.min[2]
+		];
+		bottom = Math.max(bottom, rotateByQuat(pre.q, corner)[1] * pre.s);
+	}
+	return bottom;
+}
+const cache = /* @__PURE__ */ new WeakMap();
+/**
+* Instance transforms for a scatter: points on the surface, each seated on
+* its variant's base (instance i draws variant i % bottoms.length; bottoms
+* already include the variant's own rotation and scale).
+*/
+function scatterTransforms(scatter, surface, bottoms) {
+	const surfaceNode = scatter.surface;
+	const key = JSON.stringify([bottoms, surface.bounds?.size]);
+	const hit = cache.get(scatter);
+	if (hit && hit.key === key) return hit.out;
+	const { points } = scatterOnSurface({
+		model: surface,
+		matrix: nodeMatrix(surfaceNode)
+	}, scatter);
+	const n = Math.max(1, bottoms.length);
+	const out = points.map((p, i) => {
+		const [x, y, z] = seatOnSurface(p, bottoms[i % n] ?? 0, scatter.sink ?? 0);
+		return {
+			x,
+			y,
+			z,
+			rotation: p.rotation,
+			scale: p.scale
+		};
+	});
+	cache.set(scatter, {
+		key,
+		out
+	});
+	return out;
+}
+/** The wind a mesh of `model` sways in at `seconds`, or undefined when calm. */
+function meshWind(wind, model, seconds) {
+	if (!wind) return void 0;
+	const b = model.bounds;
+	const height = b ? b.size[1] : 0;
+	if (!b || height <= 0) return void 0;
+	return {
+		amplitudeDeg: wind.amplitudeDeg ?? 8,
+		frequency: wind.frequency ?? .4,
+		direction: wind.direction ?? [1, 0],
+		waveScale: wind.waveScale ?? 600,
+		time: seconds,
+		baseY: b.max[1],
+		height
+	};
+}
 function translate(tx, ty) {
 	return {
 		a: 1,
@@ -855,16 +1403,20 @@ const MAX_RASTER_SCALE = 4;
 * Pixels per layout px to rasterize a 2D layer at, so it stays sharp when its
 * transform onto the canvas scales it up by `axisScale` (the transform's
 * larger axis scale). Rounded up to a quarter, so an animated zoom reuses a
-* few texture sizes instead of allocating new ones every frame; never below 1
+* few texture sizes instead of allocating new ones every frame; not below 1
 * (a shrunk layer keeps its layout raster). Capped, rounded down to a quarter,
 * by MAX_RASTER_SCALE, by `limits.maxDimension` (the GPU's texture side), by
 * `limits.maxPixels` (a pixel budget for one texture) and by
 * `limits.effects`, the highest scale the layer's effects keep their look at.
+* The texture side is a hard limit: a layer longer than it at layout scale
+* (a tall reel strip, a long scroll) rasterizes just under it, below 1.
 */
 function layerRasterScale(axisScale, size, limits) {
 	const w = Math.max(1, size.width);
 	const h = Math.max(1, size.height);
 	const cap = Math.min(MAX_RASTER_SCALE, limits.maxDimension / Math.max(w, h), Math.sqrt(limits.maxPixels / (w * h)), limits.effects);
+	const fits = limits.maxDimension / Math.max(w, h);
+	if (fits < 1) return Math.floor(fits * 1024) / 1024;
 	const wanted = Math.ceil(axisScale * 4 - 1e-6) / 4;
 	return Math.max(1, Math.min(wanted, Math.floor(cap * 4 + 1e-6) / 4));
 }
@@ -1084,6 +1636,25 @@ function has3DTransform(target, lop) {
 	return false;
 }
 const meshHasAlpha = /* @__PURE__ */ new WeakMap();
+/**
+* How far a text node's ink can reach past its layout box, in px: an outside
+* stroke reaches its full width past the outline (any other alignment, half),
+* a shadow its offset plus blur. One px of slack covers antialiasing.
+*/
+function textInkOutset(target, lop) {
+	const num = (v) => typeof v === "number" && v > 0 ? v : 0;
+	const width = num(target?.strokeWidth ?? lop.strokeWidth);
+	const stroke = Boolean(target?.stroke ?? target?.strokeColor ?? lop.stroke) ? lop.strokeAlign === "outside" ? width : width / 2 : 0;
+	let shadow = 0;
+	const shadows = lop.shadows;
+	if (Array.isArray(shadows)) for (const s of shadows) shadow = Math.max(shadow, Math.max(Math.abs(s.offset?.x ?? 0), Math.abs(s.offset?.y ?? 0)) + 2 * num(s.blurRadius));
+	const reach = stroke + shadow;
+	return reach > 0 ? Math.ceil(reach) + 1 : 0;
+}
+/** Bytes of a mesh's vertex buffer: 16 floats per vertex. */
+function deformedBytes(mesh) {
+	return mesh.positions.length / 3 * 64;
+}
 function hasVertexAlpha(mesh) {
 	const cached = meshHasAlpha.get(mesh);
 	if (cached !== void 0) return cached;
@@ -1177,6 +1748,8 @@ const audioTrackLatentCache = /* @__PURE__ */ new Map();
 const swarmStateMap = /* @__PURE__ */ new WeakMap();
 const deviceRenderer3DCache = /* @__PURE__ */ new WeakMap();
 /** One Renderer3D per device, target format and MSAA sample count. */
+/** The command encoder the 3D pools were last recycled for, per device. */
+const poolEncoder = /* @__PURE__ */ new WeakMap();
 function getRenderer3D(device, format, sampleCount) {
 	let byConfig = deviceRenderer3DCache.get(device);
 	if (!byConfig) {
@@ -1329,8 +1902,37 @@ function surfaceProps(target, lop, mat) {
 		out.emissiveIntensity = target?.emissiveIntensity ?? lop.emissiveIntensity ?? mat?.emissiveStrength ?? 1;
 	}
 	if (lop.castShadow !== void 0) out.castShadow = lop.castShadow;
+	out.toon = target?.toon ?? lop.toon;
+	out.outline = target?.outline ?? lop.outline;
+	const file = mat?.surface;
+	const lobes = {
+		clearcoat: target?.clearcoat ?? lop.clearcoat ?? file?.clearcoat,
+		clearcoatRoughness: target?.clearcoatRoughness ?? lop.clearcoatRoughness ?? file?.clearcoatRoughness,
+		anisotropy: target?.anisotropy ?? lop.anisotropy ?? file?.anisotropy,
+		anisotropyRotation: target?.anisotropyRotation ?? lop.anisotropyRotation ?? file?.anisotropyRotation,
+		subsurface: target?.subsurface ?? lop.subsurface ?? file?.subsurface,
+		subsurfaceColor: target?.subsurfaceColor ?? lop.subsurfaceColor ?? file?.subsurfaceColor,
+		sheen: target?.sheen ?? lop.sheen ?? file?.sheen,
+		sheenColor: target?.sheenColor ?? lop.sheenColor ?? file?.sheenColor,
+		sheenRoughness: target?.sheenRoughness ?? lop.sheenRoughness ?? file?.sheenRoughness,
+		iridescence: target?.iridescence ?? lop.iridescence ?? file?.iridescence,
+		iridescenceThickness: target?.iridescenceThickness ?? lop.iridescenceThickness ?? file?.iridescenceThickness,
+		iridescenceIor: target?.iridescenceIor ?? lop.iridescenceIor ?? file?.iridescenceIor
+	};
+	for (const [key, value] of Object.entries(lobes)) if (value !== void 0) out[key] = value;
+	const triplanar = target?.triplanar ?? lop.triplanar;
+	if (triplanar !== void 0) out.triplanar = triplanar;
+	const triplanarScale = target?.triplanarScale ?? lop.triplanarScale;
+	if (triplanarScale !== void 0) out.triplanarScale = triplanarScale;
+	const triplanarSharpness = target?.triplanarSharpness ?? lop.triplanarSharpness;
+	if (triplanarSharpness !== void 0) out.triplanarSharpness = triplanarSharpness;
 	return out;
 }
+/** A transform's mean scale: the average length of its basis columns. */
+function matrixScale(m) {
+	const c = (i) => Math.hypot(m[i], m[i + 1], m[i + 2]);
+	return (c(0) + c(4) + c(8)) / 3;
+}
 function computeContainerScissor(matrix, width, height) {
 	const corners = [
 		matrix.transformPoint(new DOMPoint(0, 0)),
@@ -1642,6 +2244,7 @@ const CompositorWebGPURenderer = async (args) => {
 		const inheritedSeekOffset = props.inheritedSeekOffset ?? 0;
 		const shiftedFrame = Math.max(0, frame != null && fps != null ? frame + Math.round(inheritedSeekOffset * fps) : frame ?? 0);
 		const compositionFrame = props.compositionFrame ?? shiftedFrame;
+		const historyOnly = props.motionHistoryOnly === true;
 		const compTex = ctx.renderer.getTemporaryTexture(nativeWidth, nativeHeight, [...props.excludeTextures || [], targetTexture]);
 		const compView = compTex.createView();
 		const composeDuration = virtualMedia?.metadata?.durationMs ?? DEFAULT_DURATION_MS;
@@ -1651,9 +2254,15 @@ const CompositorWebGPURenderer = async (args) => {
 			durationSec
 		});
 		const { targetsById } = compiled;
+		if (!historyOnly && frame != null && sceneMotionBlur(virtualMedia) && motionHistory(ctx.device, compiled.key).needsPrevious(shiftedFrame)) await renderMotionHistory(args, frame - 1);
 		seekTimeline(compiled, shiftedFrame, fps ?? 24);
-		getRenderer3D(ctx.device, ctx.renderer.format ?? "rgba8unorm", sampleCount3d).resetPools();
-		getScreenSpaceRelightPipeline(ctx.device, ctx.renderer.format ?? "rgba8unorm").resetPools();
+		const r3d = getRenderer3D(ctx.device, ctx.renderer.format ?? "rgba8unorm", sampleCount3d);
+		const relightPipe = getScreenSpaceRelightPipeline(ctx.device, ctx.renderer.format ?? "rgba8unorm");
+		if (poolEncoder.get(ctx.device) !== encoder) {
+			poolEncoder.set(ctx.device, encoder);
+			r3d.resetPools();
+			relightPipe.resetPools();
+		}
 		const clearColor = parseColor(vop.backgroundColor);
 		ctx.renderer.beginFrame(encoder, compView, clearColor, nativeWidth, nativeHeight, "clear").end();
 		let currentCompTex = compTex;
@@ -1724,6 +2333,7 @@ const CompositorWebGPURenderer = async (args) => {
 					const textStyle = {
 						fontSize: node.fontSize ?? 48,
 						fontWeight: node.fontWeight,
+						fontVariations: node.fontVariations,
 						fontFamily: node.fontFamily,
 						letterSpacing: node.letterSpacing,
 						lineHeight: node.lineHeight,
@@ -1787,6 +2397,11 @@ const CompositorWebGPURenderer = async (args) => {
 			0
 		];
 		let dofEnabled = false;
+		/** Shutter motion blur of the 3D scene, and what its draws looked like a frame ago. */
+		let motionBlur = null;
+		let history = null;
+		/** Set when the camera draws a cube map and remaps it through its lens. */
+		let cubeCamera = null;
 		const sceneLights = [];
 		let sceneEnvironment = null;
 		let sceneBloom = null;
@@ -1849,6 +2464,13 @@ const CompositorWebGPURenderer = async (args) => {
 				camera.fStop = camStub?.fStop ?? camOp?.dof?.fStop ?? 2.8;
 				camera.maxBlurRadius = camStub?.maxBlurRadius ?? camOp?.dof?.maxBlurRadius ?? 24;
 			}
+			const blur = camOp?.motionBlur;
+			if (blur && fps) {
+				motionBlur = blur === true ? {} : blur;
+				history = motionHistory(ctx.device, compiled.key);
+			}
+			cubeCamera = resolveCubeCamera(camOp, camera, camStub?.relativitySpeed ?? camOp?.relativity?.speed ?? 0, nativeWidth, nativeHeight, ctx.device.limits.maxTextureDimension2D);
+			if (cubeCamera && dofEnabled) throw new Error(`Camera '${camOp?.id}' is a cube camera (${camOp?.relativity ? "relativity" : camOp?.lens?.projection}) with depth of field: depth of field needs a single perspective view.`);
 			for (const lvm of lightVMs) {
 				const lop = lvm.operation;
 				const targetId = lop.id || lop.inputHandleId;
@@ -1863,8 +2485,23 @@ const CompositorWebGPURenderer = async (args) => {
 				const lightType = target?.lightType ?? lop.lightType ?? "point";
 				if (lightType === "environment") {
 					const intensity$1 = target?.intensity ?? lop.intensity;
+					const vfDensity = target?.volumetricFogDensity ?? lop.volumetricFogDensity;
+					const vfAnisotropy = target?.volumetricFogAnisotropy ?? lop.volumetricFogAnisotropy;
+					const vfNoiseStrength = target?.volumetricFogNoiseStrength ?? lop.volumetricFogNoiseStrength;
+					const rawVf = lop.volumetricFog;
+					const baseVf = rawVf === true ? {} : rawVf && typeof rawVf === "object" ? { ...rawVf } : void 0;
+					const volumetricFog = baseVf ? {
+						...baseVf,
+						...vfDensity !== void 0 && { density: vfDensity },
+						...vfAnisotropy !== void 0 && { anisotropy: vfAnisotropy },
+						...vfNoiseStrength !== void 0 && { noise: {
+							...typeof baseVf.noise === "object" ? baseVf.noise : {},
+							strength: vfNoiseStrength
+						} }
+					} : void 0;
 					sceneEnvironment = {
 						preset: lop.preset,
+						hdri: lop.hdri,
 						top: lop.top,
 						horizon: lop.horizon,
 						bottom: lop.bottom,
@@ -1874,6 +2511,10 @@ const CompositorWebGPURenderer = async (args) => {
 						toneMapping: lop.toneMapping,
 						fog: lop.fog,
 						floor: lop.floor,
+						outlines: lop.outlines,
+						ssr: lop.ssr,
+						gi: lop.gi,
+						...volumetricFog && { volumetricFog },
 						...intensity$1 !== void 0 && { intensity: intensity$1 }
 					};
 					sceneBloom = lop.bloom === true ? {} : lop.bloom && typeof lop.bloom === "object" ? { ...lop.bloom } : null;
@@ -1891,6 +2532,10 @@ const CompositorWebGPURenderer = async (args) => {
 				const angle = target?.angle ?? lop.angle ?? 45;
 				const penumbra = target?.penumbra ?? lop.penumbra ?? .2;
 				const decay = target?.decay ?? lop.decay ?? 1;
+				const width = typeof (target?.width ?? lop.width) === "number" ? target?.width ?? lop.width : void 0;
+				const height = typeof (target?.height ?? lop.height) === "number" ? target?.height ?? lop.height : void 0;
+				const twoSided = Boolean(target?.twoSided ?? lop.twoSided);
+				const rotation = target?.rotation ?? lop.rotation ?? 0;
 				sceneLights.push({
 					type: lightType,
 					color,
@@ -1905,10 +2550,15 @@ const CompositorWebGPURenderer = async (args) => {
 						targetY,
 						targetZ
 					],
+					...Array.isArray(lop.direction) && { direction: lop.direction },
 					radius,
 					angle,
 					penumbra,
 					decay,
+					...width !== void 0 && { width },
+					...height !== void 0 && { height },
+					twoSided,
+					rotation,
 					castShadow: Boolean(lop.castShadow),
 					shadowSoftness: target?.shadowSoftness ?? lop.shadowSoftness,
 					shadowDarkness: target?.shadowDarkness ?? lop.shadowDarkness
@@ -1942,16 +2592,79 @@ const CompositorWebGPURenderer = async (args) => {
 				eye: reliefEye
 			} };
 		};
+		/** Each queued item with its motion key: owner id and its index among the owner's items. */
+		const motionItems = () => {
+			const seen = /* @__PURE__ */ new Map();
+			return pending3DItems.map((item) => {
+				if (item.owner === void 0) return [item, void 0];
+				const n = seen.get(item.owner) ?? 0;
+				seen.set(item.owner, n + 1);
+				return [item, `${item.owner}#${n}`];
+			});
+		};
+		/** Writes this frame's draws (and camera) into the motion history. */
+		const recordMotion = (h, cam) => {
+			const r3d$1 = getRenderer3D(ctx.device, ctx.renderer.format ?? "rgba8unorm", sampleCount3d);
+			for (const [item, key] of motionItems()) {
+				if (!key) continue;
+				if (item.kind === "mesh") h.recordMesh(encoder, key, shiftedFrame, {
+					modelMatrix: r3d$1.meshModelMatrix(item.opts),
+					skinning: item.opts.skinningMatrices,
+					windTime: item.opts.wind?.time,
+					crowdTime: item.opts.crowd?.time
+				}, {
+					instanceBuffer: item.opts.instanceBuffer,
+					vertices: item.meshBuffers && {
+						buffer: item.meshBuffers.vertexBuffer,
+						bytes: deformedBytes(item.mesh)
+					}
+				});
+				else if (item.kind === "quad") h.recordQuad(key, shiftedFrame, r3d$1.quadModelMatrix(item.opts));
+				else h.recordSlug(key, shiftedFrame, r3d$1.quadModelMatrix(item.opts), item.batches);
+			}
+			h.recordFrame(shiftedFrame, cam);
+		};
+		/** Draws the queued items' screen motion since the last frame, then blurs `color` by it into `into`. */
+		const blurScene = (h, cam, color, into, blur, floor) => {
+			const r3d$1 = getRenderer3D(ctx.device, ctx.renderer.format ?? "rgba8unorm", sampleCount3d);
+			const vel = r3d$1.beginVelocityPass(encoder, nativeWidth, nativeHeight, cam, h.previousCamera(shiftedFrame) ?? cam);
+			if (floor) r3d$1.drawFloorVelocity(vel.pass, vel.cameraBindGroup, floor);
+			for (const [item, key] of motionItems()) if (item.kind === "mesh") {
+				const prev = key ? h.previousMesh(key, shiftedFrame, {
+					skinning: item.opts.skinningMatrices,
+					instanceBuffer: item.opts.instanceBuffer,
+					vertexBytes: item.meshBuffers && deformedBytes(item.mesh),
+					wind: item.opts.wind,
+					crowd: item.opts.crowd
+				}) : void 0;
+				r3d$1.drawMeshVelocity(vel.pass, vel.cameraBindGroup, item.meshBuffers ?? item.mesh, item.texture, item.opts, prev);
+			} else if (item.kind === "quad") r3d$1.drawQuadVelocity(vel.pass, vel.cameraBindGroup, item.texture, item.opts, key ? h.previousQuad(key, shiftedFrame) : void 0);
+			else r3d$1.drawSlugVelocity(vel.pass, vel.cameraBindGroup, item.batches, item.opts, item.stackBase, key ? h.previousSlug(key, shiftedFrame) : void 0);
+			vel.pass.end();
+			r3d$1.applyMotionBlur(encoder, color, vel.velocity, into.createView(), {
+				shutterAngle: blur.shutter,
+				sampleCount: blur.samples,
+				maxBlur: blur.maxBlur
+			});
+		};
 		const flush3DPass = (curTex, curView, curExcludes) => {
 			if (pending3DItems.length === 0 || !camera) return {
 				finalTex: curTex,
 				finalView: curView
 			};
-			const r3d = getRenderer3D(ctx.device, ctx.renderer.format ?? "rgba8unorm", sampleCount3d);
+			const r3d$1 = getRenderer3D(ctx.device, ctx.renderer.format ?? "rgba8unorm", sampleCount3d);
 			for (const item of pending3DItems) {
 				if (item.kind !== "mesh") continue;
-				if (item.opts.morphWeights?.length) item.meshBuffers = r3d.morphMesh(encoder, item.mesh, item.opts.morphWeights, item.opts.wireframe);
-				if (item.opts.audioDeform) item.meshBuffers = r3d.deformMesh(encoder, item.mesh, item.opts.audioDeform, item.opts.wireframe, item.meshBuffers);
+				if (item.opts.morphWeights?.length) item.meshBuffers = r3d$1.morphMesh(encoder, item.mesh, item.opts.morphWeights, item.opts.wireframe);
+				if (item.opts.audioDeform) item.meshBuffers = r3d$1.deformMesh(encoder, item.mesh, item.opts.audioDeform, item.opts.wireframe, item.meshBuffers);
+			}
+			if (historyOnly) {
+				if (history) recordMotion(history, camera);
+				pending3DItems.length = 0;
+				return {
+					finalTex: curTex,
+					finalView: curView
+				};
 			}
 			const itemTextures = pendingTextures();
 			const scene3dTex = ctx.renderer.getTemporaryTexture(nativeWidth, nativeHeight, [
@@ -1961,17 +2674,25 @@ const CompositorWebGPURenderer = async (args) => {
 				...itemTextures
 			]);
 			const scene3dView = scene3dTex.createView();
+			const outlineSetting = sceneEnvironment?.outlines;
+			const outlines = outlineSetting === true ? {} : outlineSetting || null;
+			const volumetricFogEnabled = Boolean(sceneEnvironment?.volumetricFog);
+			const screenIndirectEnabled = Boolean(sceneEnvironment?.ssr || sceneEnvironment?.gi);
+			const geometryEnabled = dofEnabled || Boolean(outlines) || volumetricFogEnabled || screenIndirectEnabled;
 			let linearDepthTex;
 			let linearDepthView;
-			if (dofEnabled) {
-				linearDepthTex = r3d.getOrCreateLinearDepthTexture(nativeWidth, nativeHeight);
+			if (geometryEnabled) {
+				linearDepthTex = r3d$1.getOrCreateLinearDepthTexture(nativeWidth, nativeHeight);
 				linearDepthView = linearDepthTex.createView();
 			}
 			const shadow = [];
 			const shadowLights = sceneLights.filter((light) => (light.lightType ?? light.type) !== "ambient").map((light, index) => ({
 				light,
 				index
-			})).filter(({ light }) => light.castShadow && ((light.lightType ?? light.type) === "directional" || (light.lightType ?? light.type) === "spot"));
+			})).filter(({ light }) => {
+				const k = light.lightType ?? light.type;
+				return light.castShadow && (k === "directional" || k === "spot" || k === "rect" || k === "point");
+			});
 			if (shadowLights.length > 0) {
 				const casters = [];
 				const receivers = [];
@@ -1982,7 +2703,7 @@ const CompositorWebGPURenderer = async (args) => {
 						buffers: item.meshBuffers,
 						opts: item.opts
 					};
-					receivers.push(r3d.worldBounds(caster));
+					receivers.push(r3d$1.worldBounds(caster));
 					if (item.opts.castShadow !== false && item.opts.material !== "unlit") casters.push(caster);
 				} else if (item.kind === "quad") {
 					const caster = {
@@ -1990,16 +2711,26 @@ const CompositorWebGPURenderer = async (args) => {
 						texture: item.texture,
 						opts: item.opts
 					};
-					receivers.push(r3d.worldBounds(caster));
+					receivers.push(r3d$1.worldBounds(caster));
 					if (item.opts.castShadow === true) casters.push(caster);
 				}
-				if (casters.length > 0) for (const { light, index } of shadowLights) {
-					const result = r3d.renderShadowMap(encoder, light, index, casters, receivers, {
-						mapSize: shadowMapSize,
-						layer: shadow.length,
-						layerCount: shadowLights.length
-					});
-					if (result) shadow.push(result);
+				if (casters.length > 0) {
+					const totalShadowLayers = shadowLights.reduce((sum, { light }) => sum + ((light.lightType ?? light.type) === "point" ? 6 : 1), 0);
+					const allPointShadows = shadowLights.every(({ light }) => (light.lightType ?? light.type) === "point");
+					const resolvedShadowMapSize = shadowMapSize ?? (allPointShadows ? 1024 : 2048);
+					let currentLayer = 0;
+					for (const { light, index } of shadowLights) {
+						const needed = (light.lightType ?? light.type) === "point" ? 6 : 1;
+						const result = r3d$1.renderShadowMap(encoder, light, index, casters, receivers, {
+							mapSize: resolvedShadowMapSize,
+							layer: currentLayer,
+							layerCount: totalShadowLayers
+						});
+						if (result) {
+							shadow.push(result);
+							currentLayer += result.layerCount ?? needed;
+						}
+					}
 				}
 			}
 			const isGlass = (item) => item.kind === "mesh" && (item.opts.material === "glass" || item.opts.material === "acrylic" || item.opts.material === "frosted");
@@ -2009,7 +2740,7 @@ const CompositorWebGPURenderer = async (args) => {
 			const forward = Vector3Math.subtract(camera.target, camera.eye);
 			for (const item of pending3DItems) if (isGlass(item)) glass.push(item);
 			else if (item.kind === "mesh" && item.opts.transparent) {
-				const bounds = r3d.worldBounds({
+				const bounds = r3d$1.worldBounds({
 					kind: "mesh",
 					mesh: item.mesh,
 					opts: item.opts
@@ -2043,7 +2774,7 @@ const CompositorWebGPURenderer = async (args) => {
 					for (let j = i; j < end; j++) {
 						const item = opaque[j];
 						if (item.kind !== "mesh") throw new Error("Invalid mesh batch");
-						const matrix = r3d.meshModelMatrix(item.opts);
+						const matrix = r3d$1.meshModelMatrix(item.opts);
 						data.set(matrix, (j - i) * 32);
 						data.set(item.opts.normalMatrix ?? Light3D.computeNormalMatrix(matrix), (j - i) * 32 + 16);
 					}
@@ -2053,7 +2784,7 @@ const CompositorWebGPURenderer = async (args) => {
 							...first.opts,
 							modelMatrix: Matrix4Math.identity(),
 							normalMatrix: Matrix4Math.identity(),
-							instanceBuffer: r3d.uploadInstanceData(data),
+							instanceBuffer: r3d$1.uploadInstanceData(data),
 							instanceCount: end - i,
 							matrixInstances: true
 						}
@@ -2066,65 +2797,192 @@ const CompositorWebGPURenderer = async (args) => {
 				...transparent.map(({ item }) => item),
 				...glass
 			];
+			if (cubeCamera) {
+				const single = [screenIndirectEnabled && "screen-space reflections and GI (ssr, gi)", motionBlur && "motion blur"].filter(Boolean);
+				if (single.length) throw new Error(`A cube camera (${cubeCamera.remap.projection ?? "lens"}) cannot draw ${single.join(" or ")}: they need a single perspective view.`);
+			}
 			const floorSpec = sceneEnvironment?.floor;
-			let blurredReflectionTex = null;
-			if (floorSpec && typeof floorSpec.y === "number" && camera.eye[1] < floorSpec.y) {
+			const sceneShadow = shadow.length ? shadow : null;
+			/** The floor's mirror image from `view`, blurred by its roughness, when the eye is above it. */
+			const floorReflection = (view, width, height) => {
+				if (!floorSpec || typeof floorSpec.y !== "number" || view.eye[1] >= floorSpec.y) return null;
 				const reflectedCamera = {
-					...camera,
+					...view,
 					eye: [
-						camera.eye[0],
-						2 * floorSpec.y - camera.eye[1],
-						camera.eye[2]
+						view.eye[0],
+						2 * floorSpec.y - view.eye[1],
+						view.eye[2]
 					],
 					target: [
-						camera.target[0],
-						2 * floorSpec.y - camera.target[1],
-						camera.target[2]
+						view.target[0],
+						2 * floorSpec.y - view.target[1],
+						view.target[2]
 					],
 					up: [
-						camera.up[0],
-						camera.up[1],
-						camera.up[2]
+						view.up[0],
+						view.up[1],
+						view.up[2]
 					]
 				};
-				const { pass: reflPass, cameraBindGroup: reflCamBind, lightsBindGroup: reflLightsBind, reflectionTexture: reflTex } = r3d.beginReflectionPass(encoder, nativeWidth, nativeHeight, reflectedCamera, sceneLights, {
+				const { pass: reflPass, cameraBindGroup: reflCamBind, lightsBindGroup: reflLightsBind, reflectionTexture: reflTex } = r3d$1.beginReflectionPass(encoder, width, height, reflectedCamera, sceneLights, {
 					environment: sceneEnvironment,
 					shadow: null
 				});
-				for (const item of ordered) if (item.kind === "quad") r3d.drawTextureQuad(reflPass, reflCamBind, reflLightsBind, item.texture, item.opts, false);
-				else if (item.kind === "slug") r3d.drawSlugText(reflPass, reflCamBind, reflLightsBind, item.batches, item.opts, item.stackBase, false);
-				else if (item.kind === "mesh") r3d.drawMesh3D(reflPass, reflCamBind, reflLightsBind, item.meshBuffers ?? item.mesh, item.texture, item.opts, false);
+				for (const item of ordered) if (item.kind === "quad") r3d$1.drawTextureQuad(reflPass, reflCamBind, reflLightsBind, item.texture, item.opts, false);
+				else if (item.kind === "slug") r3d$1.drawSlugText(reflPass, reflCamBind, reflLightsBind, item.batches, item.opts, item.stackBase, false);
+				else if (item.kind === "mesh") r3d$1.drawMesh3D(reflPass, reflCamBind, reflLightsBind, item.meshBuffers ?? item.mesh, item.texture, item.opts, false);
 				reflPass.end();
-				blurredReflectionTex = r3d.blurReflection(encoder, reflTex, floorSpec.roughness ?? .35);
-			}
-			const { pass: pass3d, cameraBindGroup, cameraBuffer, lightsBindGroup } = r3d.beginPass(encoder, scene3dView, nativeWidth, nativeHeight, camera, "clear", {
-				r: 0,
-				g: 0,
-				b: 0,
-				a: 0
-			}, linearDepthView, sceneLights, {
-				environment: sceneEnvironment,
-				shadow: shadow.length ? shadow : null
-			}, Boolean(sceneBloom));
-			if (floorSpec && blurredReflectionTex) r3d.drawFloor(pass3d, cameraBindGroup, lightsBindGroup, blurredReflectionTex, floorSpec, dofEnabled, Boolean(sceneBloom));
-			for (const item of ordered) if (item.kind === "quad") r3d.drawTextureQuad(pass3d, cameraBindGroup, lightsBindGroup, item.texture, item.opts, dofEnabled);
-			else if (item.kind === "slug") r3d.drawSlugText(pass3d, cameraBindGroup, lightsBindGroup, item.batches, item.opts, item.stackBase, dofEnabled);
-			else if (item.kind === "mesh") r3d.drawMesh3D(pass3d, cameraBindGroup, lightsBindGroup, item.meshBuffers ?? item.mesh, item.texture, isGlass(item) ? {
-				...item.opts,
-				backdrop: curTex
-			} : item.opts, dofEnabled);
-			pass3d.end();
+				return r3d$1.blurReflection(encoder, reflTex, floorSpec.roughness ?? .35);
+			};
+			/**
+			* One forward pass over the batch: floor, then the sorted draws.
+			* `glassBackdrop` is the 2D picture glass refracts: undefined draws
+			* glass over the 3D scene alone (a cube face), null leaves the glass
+			* out (the pre-pass that makes that picture).
+			*/
+			const drawView = (target, screenIndirect, writeHdr, glassBackdrop) => {
+				const begun = r3d$1.beginPass(encoder, target.color, target.width, target.height, target.view, "clear", {
+					r: 0,
+					g: 0,
+					b: 0,
+					a: 0
+				}, target.geometry, sceneLights, {
+					environment: sceneEnvironment,
+					shadow: sceneShadow,
+					screenIndirect
+				}, writeHdr, target.hdr);
+				const { pass: pass$1, cameraBindGroup, lightsBindGroup } = begun;
+				if (floorSpec && target.reflection) r3d$1.drawFloor(pass$1, cameraBindGroup, lightsBindGroup, target.reflection, floorSpec, geometryEnabled, writeHdr);
+				for (const item of ordered) {
+					if (glassBackdrop === null && isGlass(item)) continue;
+					if (item.kind === "quad") r3d$1.drawTextureQuad(pass$1, cameraBindGroup, lightsBindGroup, item.texture, item.opts, geometryEnabled);
+					else if (item.kind === "slug") r3d$1.drawSlugText(pass$1, cameraBindGroup, lightsBindGroup, item.batches, item.opts, item.stackBase, geometryEnabled);
+					else if (item.kind === "mesh") r3d$1.drawMesh3D(pass$1, cameraBindGroup, lightsBindGroup, item.meshBuffers ?? item.mesh, item.texture, isGlass(item) ? {
+						...item.opts,
+						backdrop: glassBackdrop ?? void 0
+					} : item.opts, geometryEnabled);
+				}
+				pass$1.end();
+				return begun;
+			};
+			const sceneSeconds = shiftedFrame / Math.max(1, fps ?? 24);
 			let final3dTex = scene3dTex;
-			if (dofEnabled && linearDepthTex) {
+			let mainReflection = null;
+			let mainPass = null;
+			if (cubeCamera) {
+				const size = cubeCamera.faceSize;
+				const cube = r3d$1.getOrCreateCubeTexture(size, false);
+				const hdrCube = sceneBloom ? r3d$1.getOrCreateCubeTexture(size, true) : null;
+				const faceOutlines = outlines && {
+					...outlines,
+					referenceHeight: (outlines.referenceHeight ?? 1080) * 2 * cubeCamera.centerDensity / nativeHeight
+				};
+				const post = Boolean(faceOutlines) || volumetricFogEnabled;
+				const faceExcludes = [
+					curTex,
+					targetTexture,
+					scene3dTex,
+					...curExcludes,
+					...itemTextures
+				];
+				const faceTex = post ? ctx.renderer.getTemporaryTexture(size, size, faceExcludes) : null;
+				const fogTex = faceOutlines && volumetricFogEnabled ? ctx.renderer.getTemporaryTexture(size, size, [...faceExcludes, ...faceTex ? [faceTex] : []]) : null;
+				const faceGeometry = geometryEnabled ? r3d$1.getOrCreateLinearDepthTexture(size, size) : null;
+				cubeFaceCameras(camera.eye, camera.near, camera.far).forEach((face, i) => {
+					const faceView = r3d$1.cubeFaceView(cube, i);
+					const { cameraBindGroup, lightsBindGroup } = drawView({
+						view: face,
+						width: size,
+						height: size,
+						color: faceTex ? faceTex.createView() : faceView,
+						geometry: faceGeometry?.createView(),
+						hdr: hdrCube ? r3d$1.cubeFaceView(hdrCube, i) : void 0,
+						reflection: floorReflection(face, size, size)
+					}, void 0, Boolean(sceneBloom), void 0);
+					if (!faceTex || !faceGeometry) return;
+					if (volumetricFogEnabled) r3d$1.resolveGeometry(encoder, faceGeometry);
+					let source = faceTex;
+					if (faceOutlines) {
+						const inked = fogTex ?? null;
+						r3d$1.applyOutlines(encoder, faceTex, faceGeometry, inked ? inked.createView() : faceView, face, faceOutlines, sceneEnvironment?.fog);
+						if (!inked) return;
+						source = inked;
+					}
+					if (volumetricFogEnabled && sceneEnvironment) r3d$1.applyVolumetricFog(encoder, source, faceGeometry, faceView, cameraBindGroup, lightsBindGroup, sceneEnvironment, sceneSeconds, shiftedFrame);
+				});
+				r3d$1.remapLens(encoder, cube, hdrCube, scene3dView, nativeWidth, nativeHeight, cubeCamera.remap);
+			} else {
+				mainReflection = floorReflection(camera, nativeWidth, nativeHeight);
+				const target = {
+					view: camera,
+					width: nativeWidth,
+					height: nativeHeight,
+					color: scene3dView,
+					geometry: linearDepthView,
+					reflection: mainReflection
+				};
+				if (screenIndirectEnabled && sceneEnvironment) {
+					const { cameraBuffer: radianceCamera } = drawView(target, "radiance", true, curTex);
+					r3d$1.traceScreenIndirect(encoder, radianceCamera, sceneEnvironment);
+				}
+				let glassBackdrop = curTex;
+				if (glass.length) {
+					drawView(target, screenIndirectEnabled ? "apply" : void 0, false, null);
+					glassBackdrop = ctx.renderer.composite(encoder, curTex, scene3dTex, "normal", [
+						targetTexture,
+						scene3dTex,
+						...curExcludes
+					]);
+				}
+				mainPass = drawView(target, screenIndirectEnabled ? "apply" : void 0, Boolean(sceneBloom), glassBackdrop);
+			}
+			if (mainPass && outlines && linearDepthTex) {
+				if (dofEnabled || volumetricFogEnabled) r3d$1.resolveGeometry(encoder, linearDepthTex);
+				const outlinedTex = ctx.renderer.getTemporaryTexture(nativeWidth, nativeHeight, [
+					curTex,
+					targetTexture,
+					scene3dTex,
+					linearDepthTex,
+					...curExcludes
+				]);
+				r3d$1.applyOutlines(encoder, scene3dTex, linearDepthTex, outlinedTex.createView(), camera, outlines, sceneEnvironment?.fog);
+				final3dTex = outlinedTex;
+			}
+			if (mainPass && volumetricFogEnabled && sceneEnvironment && linearDepthTex) {
+				const vfogTex = ctx.renderer.getTemporaryTexture(nativeWidth, nativeHeight, [
+					curTex,
+					targetTexture,
+					scene3dTex,
+					final3dTex,
+					linearDepthTex,
+					...curExcludes
+				]);
+				r3d$1.applyVolumetricFog(encoder, final3dTex, linearDepthTex, vfogTex.createView(), mainPass.cameraBindGroup, mainPass.lightsBindGroup, sceneEnvironment, sceneSeconds, shiftedFrame);
+				final3dTex = vfogTex;
+			}
+			if (mainPass && dofEnabled && linearDepthTex) {
 				const dofResultTex = ctx.renderer.getTemporaryTexture(nativeWidth, nativeHeight, [
 					curTex,
 					targetTexture,
 					scene3dTex,
+					final3dTex,
 					...curExcludes
 				]);
-				r3d.applyDepthOfField(encoder, scene3dTex, linearDepthTex, dofResultTex.createView(), cameraBuffer);
+				r3d$1.applyDepthOfField(encoder, final3dTex, linearDepthTex, dofResultTex.createView(), mainPass.cameraBuffer);
 				final3dTex = dofResultTex;
 			}
+			if (motionBlur && history) {
+				const blurredTex = ctx.renderer.getTemporaryTexture(nativeWidth, nativeHeight, [
+					curTex,
+					targetTexture,
+					scene3dTex,
+					final3dTex,
+					...curExcludes
+				]);
+				blurScene(history, camera, final3dTex, blurredTex, motionBlur, floorSpec && mainReflection ? floorSpec : void 0);
+				final3dTex = blurredTex;
+			}
+			if (history) recordMotion(history, camera);
 			if (sceneBloom) {
 				const bloomTex = ctx.renderer.getTemporaryTexture(nativeWidth, nativeHeight, [
 					curTex,
@@ -2133,7 +2991,7 @@ const CompositorWebGPURenderer = async (args) => {
 					scene3dTex,
 					...curExcludes
 				]);
-				r3d.applyBloom(encoder, final3dTex, bloomTex, sceneBloom, r3d.hdrSource());
+				r3d$1.applyBloom(encoder, final3dTex, bloomTex, sceneBloom, r3d$1.hdrSource());
 				final3dTex = bloomTex;
 			}
 			const nextTex = ctx.renderer.composite(encoder, curTex, final3dTex, "normal", [targetTexture, ...curExcludes]);
@@ -2185,15 +3043,17 @@ const CompositorWebGPURenderer = async (args) => {
 			let activeExcludes = excludes;
 			const mattesByOwner = /* @__PURE__ */ new Map();
 			const reliefsByOwner = /* @__PURE__ */ new Map();
+			const texturesByOwner = /* @__PURE__ */ new Map();
 			for (const vm of vms) {
 				const op$1 = vm.operation;
 				if (op$1?.matteOf) mattesByOwner.set(op$1.matteOf, vm);
 				if (op$1?.reliefOf) reliefsByOwner.set(op$1.reliefOf, vm);
+				if (op$1?.textureOf) texturesByOwner.set(op$1.textureOf, vm);
 			}
 			for (const child of sorted) {
 				const lop = child.operation;
 				if (lop.kind === "camera" || lop.kind === "light") continue;
-				if (lop.matteOf || lop.reliefOf) continue;
+				if (lop.matteOf || lop.reliefOf || lop.textureOf) continue;
 				const targetId = lop.id || lop.inputHandleId;
 				const target = targetId ? targetsById[targetId] : void 0;
 				const isChild3D = Boolean(target?.is3D ?? lop.is3D) || Boolean(camera && ((target?.z ?? lop.z ?? 0) !== 0 || lop.is3D)) || Boolean(parent3DMatrix);
@@ -2252,10 +3112,37 @@ const CompositorWebGPURenderer = async (args) => {
 						amount: lop.reliefAmount ?? 0
 					});
 				}
+				const textureVM = lop.textureLayerId ? texturesByOwner.get(lop.id) : void 0;
+				let wrapTexture;
+				if (textureVM) {
+					const texture = await isolate(textureVM, nodeIndex);
+					activeExcludes = [...activeExcludes, texture];
+					nodeIndex += 1;
+					const r = rects[lop.textureLayerId];
+					const uvRect = r ? [
+						r.x / targetW,
+						r.y / targetH,
+						r.width / targetW,
+						r.height / targetH
+					] : [
+						0,
+						0,
+						1,
+						1
+					];
+					const from = pending3DItems.length;
+					wrapTexture = () => {
+						for (const item of pending3DItems.slice(from)) {
+							if (item.kind !== "mesh") continue;
+							item.texture = texture;
+							item.opts.uvRect = uvRect;
+						}
+					};
+				}
 				const matteVM = lop.matteId ? mattesByOwner.get(lop.id) : void 0;
 				if (matteVM) {
 					const mode = matteVM.operation.matteMode ?? "alpha";
-					const blend = mode === "luma" ? "luma-in" : mode === "luma-inverted" ? "luma-out" : mode === "alpha-inverted" ? "destination-out" : "destination-in";
+					const blend$1 = mode === "luma" ? "luma-in" : mode === "luma-inverted" ? "luma-out" : mode === "alpha-inverted" ? "destination-out" : "destination-in";
 					if (isChild3D) {
 						let coverage = await isolate(matteVM, nodeIndex);
 						activeExcludes = [...activeExcludes, coverage];
@@ -2273,7 +3160,7 @@ const CompositorWebGPURenderer = async (args) => {
 								b: 1,
 								a: 1
 							}, targetW, targetH, "clear").end();
-							coverage = ctx.renderer.composite(encoder, white, coverage, blend, [
+							coverage = ctx.renderer.composite(encoder, white, coverage, blend$1, [
 								targetTexture,
 								activeTex,
 								...activeExcludes,
@@ -2285,6 +3172,7 @@ const CompositorWebGPURenderer = async (args) => {
 						const before = pending3DItems.length;
 						const res$1 = await renderLayerVM(child, nodeIndex, activeTex, activeView, activeExcludes, accumulatedOpacity, parentMatrix, parentRect, targetW, targetH, parent3DMatrix, isRootScene);
 						for (const item of pending3DItems.slice(before)) item.opts.matte = coverage;
+						wrapTexture?.();
 						if (res$1) {
 							if (res$1.finalTex !== activeTex) activeExcludes = [...activeExcludes, res$1.finalTex];
 							activeTex = res$1.finalTex;
@@ -2296,7 +3184,7 @@ const CompositorWebGPURenderer = async (args) => {
 					activeExcludes = [...activeExcludes, contentTex];
 					nodeIndex += 1;
 					const matteTex = await isolate(matteVM, nodeIndex);
-					const masked = ctx.renderer.composite(encoder, contentTex, matteTex, blend, [
+					const masked = ctx.renderer.composite(encoder, contentTex, matteTex, blend$1, [
 						targetTexture,
 						activeTex,
 						...activeExcludes,
@@ -2313,6 +3201,7 @@ const CompositorWebGPURenderer = async (args) => {
 					continue;
 				}
 				const res = await renderLayerVM(child, nodeIndex, activeTex, activeView, activeExcludes, accumulatedOpacity, parentMatrix, parentRect, targetW, targetH, parent3DMatrix, isRootScene);
+				wrapTexture?.();
 				if (res) {
 					if (res.finalTex !== activeTex) activeExcludes = [...activeExcludes, res.finalTex];
 					activeTex = res.finalTex;
@@ -2345,8 +3234,10 @@ const CompositorWebGPURenderer = async (args) => {
 				if (shiftedFrame < startFrame) return;
 				if (durationFrames !== void 0 && shiftedFrame >= startFrame + durationFrames) return;
 			}
+			const isTrue3D = Boolean(target?.is3D ?? lop.is3D) || Boolean(camera && ((target?.z ?? lop.z ?? 0) !== 0 || lop.is3D));
+			if (historyOnly && !isContainer && kind !== "model3d" && !isTrue3D && !has3DTransform(target, lop)) return;
 			if (kind === "model3d") {
-				const r3d = getRenderer3D(ctx.device, ctx.renderer.format ?? "rgba8unorm", sampleCount3d);
+				const r3d$1 = getRenderer3D(ctx.device, ctx.renderer.format ?? "rgba8unorm", sampleCount3d);
 				let modelSrc = lop.modelData ?? lop.src;
 				if (!modelSrc && lop.text3dOptions) {
 					const tOpts = lop.text3dOptions;
@@ -2366,13 +3257,14 @@ const CompositorWebGPURenderer = async (args) => {
 				if (!modelSrc) return;
 				let model;
 				try {
-					model = typeof modelSrc === "object" && modelSrc !== null && "meshes" in modelSrc ? modelSrc : await r3d.loadModelAsync(modelSrc, lop.modelFormat ?? "auto", {
+					model = typeof modelSrc === "object" && modelSrc !== null && "meshes" in modelSrc ? modelSrc : await r3d$1.loadModelAsync(modelSrc, lop.modelFormat ?? "auto", {
 						center: lop.center,
 						normalizeSize: lop.normalizeSize
 					});
 				} catch (err) {
 					throw new Error(`Failed to load 3D model ${lop.id ?? "(unnamed)"}: ${err instanceof Error ? err.message : String(err)}`, { cause: err });
 				}
+				if (model && lop.fracture3d) model = fracturedModel(model, lop.fracture3d);
 				if (!model || model.meshes.length === 0) return;
 				const baseX$1 = lop.x ?? 0;
 				const baseY$1 = lop.y ?? 0;
@@ -2428,6 +3320,7 @@ const CompositorWebGPURenderer = async (args) => {
 					const instOpt = lop.instances3d;
 					const rawMeshes = Array.isArray(instOpt.mesh) ? instOpt.mesh : instOpt.mesh ? [instOpt.mesh] : lop.modelData ? [lop.modelData] : lop.primitive3d ? [getPrimitiveGeometry(lop.primitive3d)] : [];
 					const variants = [];
+					const variantPres = [];
 					for (const m of rawMeshes) {
 						let vModel;
 						if (typeof m === "object" && m !== null) {
@@ -2435,25 +3328,56 @@ const CompositorWebGPURenderer = async (args) => {
 							else if (m.modelData && "meshes" in m.modelData) vModel = m.modelData;
 							else if (m.primitive3d) vModel = getPrimitiveGeometry(m.primitive3d);
 							else if (m.src) try {
-								vModel = r3d.loadModel(m.src, m.modelFormat ?? "auto", {
+								vModel = r3d$1.loadModel(m.src, m.modelFormat ?? "auto", {
 									center: m.center,
 									normalizeSize: m.normalizeSize
 								});
 							} catch {}
 						}
-						if (vModel && vModel.meshes && vModel.meshes.length > 0) variants.push(vModel);
+						if (vModel && vModel.meshes && vModel.meshes.length > 0) {
+							variants.push(vModel);
+							const isNode = !("meshes" in m);
+							variantPres.push(isNode ? {
+								q: quatFromEulerAngles(m.rotateX ?? 0, m.rotateY ?? 0, m.rotateZ ?? 0),
+								s: m.scale ?? 1
+							} : NO_PRE);
+						}
+					}
+					if (variants.length === 0 && model) {
+						variants.push(model);
+						variantPres.push(NO_PRE);
+					}
+					if (lop.scatter3d && variants.length > 0) {
+						const scatter = lop.scatter3d;
+						const surface = await surfaceModel(scatter.surface, (src, n) => r3d$1.loadModelAsync(src, n.modelFormat ?? "auto", {
+							center: n.center,
+							normalizeSize: n.normalizeSize
+						}));
+						instOpt.transforms = surface ? scatterTransforms(scatter, surface, variants.map((v, k) => variantBottom(v, variantPres[k]))) : [];
+						instOpt.count = instOpt.transforms.length;
 					}
-					if (variants.length === 0 && model) variants.push(model);
 					if (variants.length > 0) {
 						const count = instOpt.bodies && Array.isArray(instOpt.bodies) && instOpt.bodies.length > 0 ? instOpt.bodies.length : instOpt.count ?? (Array.isArray(instOpt.transforms) ? instOpt.transforms.length : 0);
 						if (count > 0) {
 							const numVariants = variants.length;
 							const bucketCounts = new Uint32Array(numVariants);
 							for (let i$1 = 0; i$1 < count; i$1++) bucketCounts[i$1 % numVariants]++;
+							const crowdCfg = lop.crowd;
+							const crowdBakes = variants.map((v) => crowdCfg ? crowdBake(v, crowdCfg) : void 0);
+							const strides = crowdBakes.map((b) => b ? 32 : 16);
+							const crowdOpts = (bake, mesh) => {
+								const baked = bake?.meshes.get(mesh);
+								if (!bake || !baked) return void 0;
+								return {
+									palette: paletteBuffer(ctx.device, baked.palette),
+									jointCount: baked.jointCount,
+									time: (shiftedFrame ?? 0) / (fps || 30)
+								};
+							};
 							const bucketItems = [];
 							const bucketBounds = [];
 							for (let k = 0; k < numVariants; k++) {
-								bucketItems.push(new Float32Array(bucketCounts[k] * 16));
+								bucketItems.push(new Float32Array(bucketCounts[k] * strides[k]));
 								bucketBounds.push({
 									min: [
 										Infinity,
@@ -2482,7 +3406,8 @@ const CompositorWebGPURenderer = async (args) => {
 								const cursor = bucketCursors[k];
 								const bData = bucketItems[k];
 								const bBox = bucketBounds[k];
-								const off = cursor * 16;
+								const off = cursor * strides[k];
+								let ianim = {};
 								let ix = 0;
 								let iy = 0;
 								let iz = 0;
@@ -2539,6 +3464,7 @@ const CompositorWebGPURenderer = async (args) => {
 								} else if (typeof instOpt.instanceAt === "function") {
 									const t = instOpt.instanceAt(i$1, shiftedFrame ?? 0, fps || 30);
 									if (!t) continue;
+									ianim = t;
 									ix = t.x ?? 0;
 									iy = t.y ?? 0;
 									iz = t.z ?? 0;
@@ -2585,6 +3511,7 @@ const CompositorWebGPURenderer = async (args) => {
 									}
 								} else if (Array.isArray(instOpt.transforms) && instOpt.transforms[i$1]) {
 									const t = instOpt.transforms[i$1];
+									ianim = t;
 									ix = t.x ?? 0;
 									iy = t.y ?? 0;
 									iz = t.z ?? 0;
@@ -2631,6 +3558,16 @@ const CompositorWebGPURenderer = async (args) => {
 									}
 								} else continue;
 								bucketCursors[k]++;
+								const pre = variantPres[k];
+								if (pre !== NO_PRE) {
+									[iqx, iqy, iqz, iqw] = composeQuat([
+										iqx,
+										iqy,
+										iqz,
+										iqw
+									], pre.q);
+									iscale *= pre.s;
+								}
 								bData[off + 0] = ix;
 								bData[off + 1] = iy;
 								bData[off + 2] = iz;
@@ -2647,7 +3584,10 @@ const CompositorWebGPURenderer = async (args) => {
 								bData[off + 13] = ieg;
 								bData[off + 14] = ieb;
 								bData[off + 15] = iew;
-								const rad = 50 * iscale;
+								const bake = crowdBakes[k];
+								if (bake && crowdCfg) bData.set(crowdRecord(bake, crowdCfg, i$1, ianim), off + 16);
+								const vb = variants[k].bounds;
+								const rad = (vb ? vb.boundingSphereRadius + Math.hypot(...vb.center) : 50) * iscale;
 								bBox.min[0] = Math.min(bBox.min[0], ix - rad);
 								bBox.min[1] = Math.min(bBox.min[1], iy - rad);
 								bBox.min[2] = Math.min(bBox.min[2], iz - rad);
@@ -2659,15 +3599,26 @@ const CompositorWebGPURenderer = async (args) => {
 								const bCount = bucketCursors[k];
 								if (bCount === 0) continue;
 								const v = variants[k];
-								const activeSlice = bCount === bucketCounts[k] ? bucketItems[k] : bucketItems[k].subarray(0, bCount * 16);
-								const instanceBuffer = r3d.uploadInstanceData(activeSlice);
+								const activeSlice = bCount === bucketCounts[k] ? bucketItems[k] : bucketItems[k].subarray(0, bCount * strides[k]);
+								const instanceBuffer = r3d$1.uploadInstanceData(activeSlice);
 								const bounds = Number.isFinite(bucketBounds[k].min[0]) ? bucketBounds[k] : void 0;
 								for (const mesh of v.meshes) {
 									const mat = mesh.materialName ? v.materials[mesh.materialName] : void 0;
+									const diffuse = mat?.diffuseColor ?? [
+										1,
+										1,
+										1,
+										1
+									];
 									const meshOpts = {
 										modelMatrix: finalModelMatrix,
 										opacity: modelOpacity * (mat?.opacity ?? 1),
-										colorTint,
+										colorTint: [
+											colorTint[0] * diffuse[0],
+											colorTint[1] * diffuse[1],
+											colorTint[2] * diffuse[2],
+											colorTint[3] * (diffuse[3] ?? 1)
+										],
 										transparent: false,
 										twoSided: target?.twoSided ?? lop.twoSided ?? true,
 										wireframe: Boolean(target?.wireframe ?? lop.wireframe),
@@ -2679,12 +3630,15 @@ const CompositorWebGPURenderer = async (args) => {
 										...surfaceProps(target, lop, mat),
 										instanceBuffer,
 										instanceCount: bCount,
-										bounds
+										bounds,
+										wind: meshWind(lop.wind, v, (shiftedFrame ?? 0) / (fps || 30)),
+										crowd: crowdOpts(crowdBakes[k], mesh)
 									};
 									pending3DItems.push({
+										owner: lop.id,
 										kind: "mesh",
 										mesh,
-										texture: mat ? await r3d.materialTexture(mat) : void 0,
+										texture: mat ? await r3d$1.materialTexture(mat) : void 0,
 										opts: meshOpts
 									});
 								}
@@ -2800,7 +3754,7 @@ const CompositorWebGPURenderer = async (args) => {
 							else if (m.modelData && "meshes" in m.modelData) vModel = m.modelData;
 							else if (m.primitive3d) vModel = getPrimitiveGeometry(m.primitive3d);
 							else if (m.src) try {
-								vModel = r3d.loadModel(m.src, m.modelFormat ?? "auto", {
+								vModel = r3d$1.loadModel(m.src, m.modelFormat ?? "auto", {
 									center: m.center,
 									normalizeSize: m.normalizeSize
 								});
@@ -2905,7 +3859,7 @@ const CompositorWebGPURenderer = async (args) => {
 					};
 					let swarmState = swarmStateMap.get(lop);
 					if (!swarmState || swarmState.device !== ctx.device) {
-						swarmState = r3d.swarm3dPipeline.createState(staticConfig);
+						swarmState = r3d$1.swarm3dPipeline.createState(staticConfig);
 						swarmStateMap.set(lop, swarmState);
 					}
 					const targetF = shiftedFrame ?? 0;
@@ -2995,7 +3949,7 @@ const CompositorWebGPURenderer = async (args) => {
 							emitterPos
 						};
 					};
-					r3d.swarm3dPipeline.advance(swarmState, staticConfig, targetF, fps || 30, frameSampler);
+					r3d$1.swarm3dPipeline.advance(swarmState, staticConfig, targetF, fps || 30, frameSampler);
 					if (variants.length > 0) {
 						const sliceCount = swarmState.sliceCount;
 						for (let vIdx = 0; vIdx < variants.length; vIdx++) {
@@ -3021,9 +3975,10 @@ const CompositorWebGPURenderer = async (args) => {
 									firstInstance
 								};
 								pending3DItems.push({
+									owner: lop.id,
 									kind: "mesh",
 									mesh,
-									texture: mat ? await r3d.materialTexture(mat) : void 0,
+									texture: mat ? await r3d$1.materialTexture(mat) : void 0,
 									opts: meshOpts
 								});
 							}
@@ -3051,9 +4006,10 @@ const CompositorWebGPURenderer = async (args) => {
 									firstInstance: sparkFirst
 								};
 								pending3DItems.push({
+									owner: lop.id,
 									kind: "mesh",
 									mesh,
-									texture: mat ? await r3d.materialTexture(mat) : void 0,
+									texture: mat ? await r3d$1.materialTexture(mat) : void 0,
 									opts: sparkOpts
 								});
 							}
@@ -3075,7 +4031,22 @@ const CompositorWebGPURenderer = async (args) => {
 					if (lop.loop ?? true) clipSec %= clip.duration;
 				}
 				const sceneRoot = Matrix4Math.multiply(finalModelMatrix, model.rootTransform ?? Matrix4Math.identity());
-				const posed = model.nodes ? poseNodes(model, clip, clipSec) : void 0;
+				const layerProps = Matrix4Math.multiply(Matrix4Math.translate(sampledX$1 - posX, sampledY$1 - posY, 0), localM);
+				const wholeFracture = Boolean(lop.fracture3d && fractureWhole(model, lop.fracture3d, shiftedFrame ?? 0));
+				const posed = lop.fracture3d && !wholeFracture && fracturePose(model, lop.fracture3d, shiftedFrame ?? 0, layerProps, [
+					scX,
+					scY,
+					scZ
+				]) || (model.nodes ? poseCharacter({
+					model,
+					node: lop,
+					frame: shiftedFrame ?? 0,
+					fps: fps || 30,
+					clip,
+					clipSec,
+					sceneRoot,
+					key: `${compiled.key}:${lop.id}`
+				}) : void 0);
 				const skinCache = /* @__PURE__ */ new Map();
 				const placeMesh = (mesh) => {
 					if (!posed) return { matrix: sceneRoot };
@@ -3136,6 +4107,7 @@ const CompositorWebGPURenderer = async (args) => {
 					}
 				}
 				for (const mesh of model.meshes) {
+					if (wholeFracture && mesh.materialName === FRACTURE_INTERIOR_MATERIAL) continue;
 					const mat = mesh.materialName ? model.materials[mesh.materialName] : void 0;
 					const placed = placeMesh(mesh);
 					const meshSkin = placed.joints ?? skinningMatrices;
@@ -3238,7 +4210,10 @@ const CompositorWebGPURenderer = async (args) => {
 					}
 					const meshOpts = {
 						modelMatrix: placed.matrix,
-						morphWeights: sampleMorphWeights(mesh, clip, clipSec),
+						morphWeights: namedMorphWeights(mesh.morphTargetNames, sampleMorphWeights(mesh, clip, clipSec), target?.morphs ?? lop.morphs, {
+							frame: shiftedFrame ?? 0,
+							fps: fps || 30
+						}),
 						opacity: modelOpacity * (mat?.opacity ?? 1),
 						colorTint: meshColorTint,
 						transparent: mat?.alphaMode === "blend" || modelOpacity * (mat?.opacity ?? 1) < 1 || meshColorTint[3] < 1 || hasVertexAlpha(mesh),
@@ -3257,16 +4232,19 @@ const CompositorWebGPURenderer = async (args) => {
 						ambientIntensity: target?.ambientIntensity ?? lop.ambientIntensity ?? 1,
 						metallic: target?.metallic ?? lop.metallic ?? mat?.metallic,
 						...surfaceProps(target, lop, mat),
-						ior: target?.ior ?? lop.ior,
+						ior: target?.ior ?? lop.ior ?? mat?.ior,
 						dispersion: target?.dispersion ?? lop.dispersion,
 						thickness: target?.thickness ?? lop.thickness,
-						audioDeform: meshAudioDeform
+						...mat?.thickness !== void 0 ? { worldThickness: mat.thickness * matrixScale(placed.matrix) } : {},
+						audioDeform: meshAudioDeform,
+						wind: meshWind(lop.wind, model, (shiftedFrame ?? 0) / (fps || 30))
 					};
-					if (mat) meshOpts.maps = await r3d.materialMaps(mat);
+					if (mat) meshOpts.maps = await r3d$1.materialMaps(mat);
 					pending3DItems.push({
+						owner: lop.id,
 						kind: "mesh",
 						mesh,
-						texture: mat ? await r3d.materialTexture(mat) : void 0,
+						texture: mat ? await r3d$1.materialTexture(mat) : void 0,
 						opts: meshOpts
 					});
 				}
@@ -3326,14 +4304,17 @@ const CompositorWebGPURenderer = async (args) => {
 				padX = Math.max(80, Math.ceil(rect.width * .2));
 				padY = Math.max(50, Math.ceil(rect.height * .5));
 			}
+			if (kind === "text" && !isPathText) {
+				const ink = textInkOutset(target, lop);
+				padX = Math.max(padX, ink);
+				padY = Math.max(padY, ink);
+			}
 			const layerW = isPathText ? targetW : rect.width + padX * 2;
 			const layerH = isPathText ? targetH : rect.height + padY * 2;
-			if (!isPathText && hasKineticAnimators) {
-				localX -= padX;
-				localY -= padY;
-			}
-			const anchorX = lop.anchorX ?? .5;
-			const anchorY = lop.anchorY ?? .5;
+			localX -= padX;
+			localY -= padY;
+			const anchorX = isPathText ? (lop.anchorX ?? .5) * rect.width / layerW : (padX + (lop.anchorX ?? .5) * rect.width) / layerW;
+			const anchorY = isPathText ? (lop.anchorY ?? .5) * rect.height / layerH : (padY + (lop.anchorY ?? .5) * rect.height) / layerH;
 			const localMatrix = toDOMMatrix(buildLayerMatrix({
 				x: localX,
 				y: localY,
@@ -3343,8 +4324,8 @@ const CompositorWebGPURenderer = async (args) => {
 				scale: scale$1,
 				scaleX,
 				scaleY,
-				anchorX: isPathText ? anchorX * rect.width / layerW : anchorX,
-				anchorY: isPathText ? anchorY * rect.height / layerH : anchorY
+				anchorX,
+				anchorY
 			}));
 			const layerMatrix = parentMatrix.multiply(localMatrix);
 			const blendMode = lop.blendMode || "normal";
@@ -3356,8 +4337,8 @@ const CompositorWebGPURenderer = async (args) => {
 			const rotateZ = target?.rotateZ ?? lop.rotateZ ?? 0;
 			const translateZ = target?.translateZ ?? lop.translateZ ?? 0;
 			const perspective = target?.perspective ?? lop.perspective ?? 0;
-			const perspectiveOriginX = target?.perspectiveOriginX ?? lop.perspectiveOriginX ?? lop.anchorX ?? .5;
-			const perspectiveOriginY = target?.perspectiveOriginY ?? lop.perspectiveOriginY ?? lop.anchorY ?? .5;
+			const perspectiveOriginX = target?.perspectiveOriginX ?? lop.perspectiveOriginX ?? anchorX;
+			const perspectiveOriginY = target?.perspectiveOriginY ?? lop.perspectiveOriginY ?? anchorY;
 			const backfaceVisibility = target?.backfaceVisibility ?? lop.backfaceVisibility ?? "visible";
 			let quad3D = null;
 			if (is3D) {
@@ -3386,7 +4367,6 @@ const CompositorWebGPURenderer = async (args) => {
 				if (backfaceVisibility === "hidden" && Transform3DMath.computeSignedArea(q) < 0) return;
 				quad3D = q;
 			}
-			const isTrue3D = Boolean(target?.is3D ?? lop.is3D) || Boolean(camera && ((target?.z ?? lop.z ?? 0) !== 0 || lop.is3D));
 			if (isContainer) {
 				if (lop.transformStyle === "preserve-3d" && isTrue3D) {
 					let current3DMatrix = Matrix4Math.identity();
@@ -3471,30 +4451,6 @@ const CompositorWebGPURenderer = async (args) => {
 						}, { opacity: 1 });
 						borderPass.end();
 					}
-					let modelMatrix;
-					if (parent3DMatrix) {
-						let localM = Matrix4Math.identity();
-						const childX = target?.x ?? lop.x ?? 0;
-						const childY = target?.y ?? lop.y ?? 0;
-						const childZ = target?.z ?? lop.z ?? 0;
-						localM = Matrix4Math.multiply(localM, Matrix4Math.translate(childX, childY, childZ));
-						const rxRad = (target?.rotateX ?? lop.rotateX ?? 0) * Math.PI / 180;
-						const ryRad = (target?.rotateY ?? lop.rotateY ?? 0) * Math.PI / 180;
-						const rzRad = ((target?.rotateZ ?? lop.rotateZ ?? 0) !== 0 ? target?.rotateZ ?? lop.rotateZ ?? 0 : rotation) * (Math.PI / 180);
-						if (rzRad !== 0) localM = Matrix4Math.multiply(localM, Matrix4Math.rotateZ(rzRad));
-						if (ryRad !== 0) localM = Matrix4Math.multiply(localM, Matrix4Math.rotateY(ryRad));
-						if (rxRad !== 0) localM = Matrix4Math.multiply(localM, Matrix4Math.rotateX(rxRad));
-						const sx = layerW * scale$1 * scaleX;
-						const sy = layerH * scale$1 * scaleY;
-						const sz = target?.scaleZ ?? lop.scaleZ ?? 1;
-						localM = Matrix4Math.multiply(localM, Matrix4Math.scale(sx, sy, sz));
-						const ax = lop.anchorX ?? .5;
-						const ay = lop.anchorY ?? .5;
-						const pivotX = .5 - ax;
-						const pivotY = .5 - ay;
-						if (pivotX !== 0 || pivotY !== 0) localM = Matrix4Math.multiply(localM, Matrix4Math.translate(pivotX, pivotY, 0));
-						modelMatrix = Matrix4Math.multiply(parent3DMatrix, localM);
-					}
 					const quadOpts = {
 						position: [
 							localX + layerW * .5,
@@ -3527,10 +4483,21 @@ const CompositorWebGPURenderer = async (args) => {
 						ambientIntensity: target?.ambientIntensity ?? lop.ambientIntensity,
 						metallic: target?.metallic ?? lop.metallic,
 						...surfaceProps(target, lop),
-						...modelMatrix && { modelMatrix },
 						...reliefOpts(lop.id, localX, localY, layerW, layerH)
 					};
+					if (parent3DMatrix) {
+						const r3d$1 = getRenderer3D(ctx.device, ctx.renderer.format ?? "rgba8unorm", sampleCount3d);
+						quadOpts.modelMatrix = Matrix4Math.multiply(parent3DMatrix, r3d$1.quadModelMatrix({
+							...quadOpts,
+							position: [
+								target?.x ?? lop.x ?? 0,
+								target?.y ?? lop.y ?? 0,
+								target?.z ?? lop.z ?? 0
+							]
+						}));
+					}
 					pending3DItems.push({
+						owner: lop.id,
 						kind: "quad",
 						texture: activeGroupTex$1,
 						opts: quadOpts
@@ -3639,7 +4606,7 @@ const CompositorWebGPURenderer = async (args) => {
 						finalView: activeView
 					};
 				}
-				const shouldClip = lop.overflow !== "visible";
+				const shouldClip = (target?.overflow ?? lop.overflow) === "hidden";
 				const scissorRect = shouldClip ? computeContainerScissor(layerMatrix, layerW, layerH) : null;
 				const clipRadius = shouldClip ? Math.min(target?.borderRadius ?? lop.borderRadius ?? 0, layerW / 2, layerH / 2) : 0;
 				if ((kind === "flex" || kind === "block") && (!Array.isArray(lop.effects) || lop.effects.length === 0) && clipRadius <= 0 && !shouldPaintContainerBackground(kind, lop.background) && layerOpacity === 1 && blendMode === "normal" && !lop.borderWidth && !lop.borderColor && (typeof lop.relighting !== "object" || !lop.relighting) && (typeof lop.relight !== "object" || !lop.relight) && (typeof target?.relighting !== "object" || !target?.relighting) && (typeof target?.relight !== "object" || !target?.relight) && (typeof lop.deflicker !== "object" || !lop.deflicker) && (typeof target?.deflicker !== "object" || !target?.deflicker)) {
@@ -4034,6 +5001,7 @@ const CompositorWebGPURenderer = async (args) => {
 						fontFamily: lop.fontFamily,
 						fontStyle: lop.fontStyle,
 						fontWeight: lop.fontWeight,
+						fontVariations: lop.fontVariations,
 						fill: target?.fill ?? target?.color ?? lop.fill,
 						align: lop.align,
 						direction: lop.direction,
@@ -4284,8 +5252,9 @@ const CompositorWebGPURenderer = async (args) => {
 				if (Math.hypot(vx, vy) > .5) {
 					if (!isTrue3D && !(is3D && quad3D)) {
 						const reach = shutterAngle / 360;
-						const padX$1 = Math.ceil(Math.abs(vx) * rasterScale * reach);
-						const padY$1 = Math.ceil(Math.abs(vy) * rasterScale * reach);
+						const side = ctx.device.limits.maxTextureDimension2D;
+						const padX$1 = Math.min(Math.ceil(Math.abs(vx) * rasterScale * reach), Math.max(0, Math.floor((side - texW) / 2)));
+						const padY$1 = Math.min(Math.ceil(Math.abs(vy) * rasterScale * reach), Math.max(0, Math.floor((side - texH) / 2)));
 						blurPadX = padX$1 / rasterScale;
 						blurPadY = padY$1 / rasterScale;
 						const paddedTex = ctx.renderer.getTemporaryTexture(texW + padX$1 * 2, texH + padY$1 * 2, [
@@ -4350,30 +5319,6 @@ const CompositorWebGPURenderer = async (args) => {
 					}, { opacity: 1 });
 					borderPass.end();
 				}
-				let modelMatrix;
-				if (parent3DMatrix) {
-					let localM = Matrix4Math.identity();
-					const childX = target?.x ?? lop.x ?? 0;
-					const childY = target?.y ?? lop.y ?? 0;
-					const childZ = target?.z ?? lop.z ?? 0;
-					localM = Matrix4Math.multiply(localM, Matrix4Math.translate(childX, childY, childZ));
-					const rxRad = (target?.rotateX ?? lop.rotateX ?? 0) * Math.PI / 180;
-					const ryRad = (target?.rotateY ?? lop.rotateY ?? 0) * Math.PI / 180;
-					const rzRad = ((target?.rotateZ ?? lop.rotateZ ?? 0) !== 0 ? target?.rotateZ ?? lop.rotateZ ?? 0 : rotation) * (Math.PI / 180);
-					if (rzRad !== 0) localM = Matrix4Math.multiply(localM, Matrix4Math.rotateZ(rzRad));
-					if (ryRad !== 0) localM = Matrix4Math.multiply(localM, Matrix4Math.rotateY(ryRad));
-					if (rxRad !== 0) localM = Matrix4Math.multiply(localM, Matrix4Math.rotateX(rxRad));
-					const sx = layerW * scale$1 * scaleX;
-					const sy = layerH * scale$1 * scaleY;
-					const sz = target?.scaleZ ?? lop.scaleZ ?? 1;
-					localM = Matrix4Math.multiply(localM, Matrix4Math.scale(sx, sy, sz));
-					const ax = lop.anchorX ?? .5;
-					const ay = lop.anchorY ?? .5;
-					const pivotX = .5 - ax;
-					const pivotY = .5 - ay;
-					if (pivotX !== 0 || pivotY !== 0) localM = Matrix4Math.multiply(localM, Matrix4Math.translate(pivotX, pivotY, 0));
-					modelMatrix = Matrix4Math.multiply(parent3DMatrix, localM);
-				}
 				const quadOpts = {
 					position: [
 						localX + layerW * .5,
@@ -4406,16 +5351,28 @@ const CompositorWebGPURenderer = async (args) => {
 					ambientIntensity: target?.ambientIntensity ?? lop.ambientIntensity,
 					metallic: target?.metallic ?? lop.metallic,
 					...surfaceProps(target, lop),
-					...modelMatrix && { modelMatrix },
 					...reliefOpts(lop.id, localX, localY, layerW, layerH)
 				};
+				if (parent3DMatrix) {
+					const r3d$1 = getRenderer3D(ctx.device, ctx.renderer.format ?? "rgba8unorm", sampleCount3d);
+					quadOpts.modelMatrix = Matrix4Math.multiply(parent3DMatrix, r3d$1.quadModelMatrix({
+						...quadOpts,
+						position: [
+							target?.x ?? lop.x ?? 0,
+							target?.y ?? lop.y ?? 0,
+							target?.z ?? lop.z ?? 0
+						]
+					}));
+				}
 				const quadHasContent = layerHasRaster || Boolean(quadOpts.borderWidth && quadOpts.borderWidth > 0 && quadOpts.borderColor);
 				if (!glyphBatches || quadHasContent) pending3DItems.push({
+					owner: lop.id,
 					kind: "quad",
 					texture: renderedTex,
 					opts: quadOpts
 				});
 				if (glyphBatches && glyphBatches.length > 0) pending3DItems.push({
+					owner: lop.id,
 					kind: "slug",
 					batches: glyphBatches,
 					opts: quadOpts,
@@ -4542,6 +5499,7 @@ const CompositorWebGPURenderer = async (args) => {
 			...props.excludeTextures || []
 		];
 		currentCompTex = (await renderNodeTree(virtualMedia.children ?? [], compTex, compView, initialExcludes, 1, new DOMMatrix(), null, nativeWidth, nativeHeight, null, true)).finalTex;
+		if (history && camera) history.recordFrame(shiftedFrame, camera);
 		ctx.renderer.popTransform();
 		ctx.renderer.popScissor();
 		const finalPass = ctx.renderer.beginFrame(encoder, targetView, {
@@ -4559,6 +5517,43 @@ const CompositorWebGPURenderer = async (args) => {
 		args.pass = finalPass;
 	}
 };
+/** Whether a composition's camera asks for shutter motion blur. */
+function sceneMotionBlur(virtualMedia) {
+	return collectNodeOps(virtualMedia.children).some((vm) => {
+		const op = vm.operation;
+		return op?.kind === "camera" && Boolean(op.motionBlur);
+	});
+}
+/**
+* Renders `frame` of the composition into a scratch target only to record
+* its 3D motion history (the frame after it reads it).
+*/
+async function renderMotionHistory(args, frame) {
+	const { ctx, encoder, props, targetTexture, targetWidth, targetHeight } = args;
+	const excludeTextures = [...props.excludeTextures ?? [], targetTexture];
+	const scratch = ctx.renderer.getTemporaryTexture(targetWidth, targetHeight, excludeTextures);
+	const view = scratch.createView();
+	const sub = {
+		...args,
+		targetView: view,
+		targetTexture: scratch,
+		pass: ctx.renderer.beginFrame(encoder, view, {
+			r: 0,
+			g: 0,
+			b: 0,
+			a: 0
+		}, targetWidth, targetHeight, "clear"),
+		props: {
+			...props,
+			frame,
+			...props.compositionFrame !== void 0 && { compositionFrame: props.compositionFrame - 1 },
+			motionHistoryOnly: true,
+			excludeTextures
+		}
+	};
+	await CompositorWebGPURenderer(sub);
+	sub.pass.end();
+}
 /** Pixels of room around a border texture for its anti-aliased edge. */
 const BORDER_AA_MARGIN = 2;
 /**
@@ -4732,4 +5727,4 @@ var renderers_default = defineRenderer({ WebGPURenderer: CompositorWebGPURendere
 
 //#endregion
 export { Transform3DMath, renderers_default as default, has3DTransform };
-//# sourceMappingURL=renderer-Dv_iRIyx.mjs.map
+//# sourceMappingURL=renderer-4nXkaAWu.mjs.map