@makefinks/daemon 0.4.0 → 0.6.0

package/src/avatar/rig/theme/rig-theme.ts

@@ -0,0 +1,31 @@
+import type { SceneElements } from "../scene/create-scene-elements";
+import type { RigState } from "../state/rig-state";
+import { lerpColor } from "../utils/math";
+
+export function updateThemeColors(elements: SceneElements, state: RigState, dt: number): void {
+	const { theme, typing, tool } = state;
+
+	const t = dt * 4;
+	theme.current.primary = lerpColor(theme.current.primary, theme.target.primary, t);
+	theme.current.glow = lerpColor(theme.current.glow, theme.target.glow, t);
+	theme.current.eye = lerpColor(theme.current.eye, theme.target.eye, t);
+
+	let displayPrimary = theme.current.primary;
+	let displayEye = theme.current.eye;
+
+	if (typing.pulse > 0.01) {
+		const flashStrength = Math.pow(typing.pulse, 1.5) * 0.5;
+		displayPrimary = lerpColor(displayPrimary, 0xffffff, flashStrength);
+		displayEye = lerpColor(displayEye, 0xff8888, flashStrength * 0.3);
+	}
+
+	elements.glowMat.color.setHex(displayPrimary);
+	if (tool.flashTimer <= 0) {
+		elements.eyeMat.color.setHex(displayEye);
+		elements.pupilMat.color.setHex(displayEye);
+	}
+	elements.pointLight.color.setHex(theme.current.glow);
+
+	elements.rings.forEach((ring) => ring.material.color.setHex(displayPrimary));
+	elements.fragments.forEach((frag) => frag.material.color.setHex(displayPrimary));
+}

package/src/avatar/rig/tools/rig-tools.ts

@@ -0,0 +1,8 @@
+export type ToolCategory = "web" | "file" | "bash" | "subagent";
+
+export const TOOL_CATEGORY_COLORS: Record<ToolCategory, number> = {
+	web: 0x22d3ee,
+	file: 0x4ade80,
+	bash: 0xfbbf24,
+	subagent: 0xa78bfa,
+};

package/src/avatar/rig/update/update-core.ts

@@ -0,0 +1,32 @@
+import type { SceneElements } from "../scene/create-scene-elements";
+import type { RigState } from "../state/rig-state";
+import { clamp01 } from "../utils/math";
+
+export function updateCore(elements: SceneElements, state: RigState, dt: number, intensity: number): void {
+	const { phase, audio, reasoning } = state;
+
+	const coreSpeed = 0.1 + intensity * 0.9;
+	elements.glowMesh.rotation.y += dt * coreSpeed;
+	elements.glowMesh.rotation.x += dt * coreSpeed * 0.6;
+
+	const glowScale = 1 + intensity * 0.25;
+	elements.glowMesh.scale.setScalar(glowScale);
+	elements.glowMat.opacity = clamp01(0.4 + intensity * 0.4 + audio.current * 0.25);
+	const normalCorePulseSpeed = 1 + intensity * 4;
+	const reasoningCorePulseSpeed = 0.4;
+	const corePulseSpeed =
+		normalCorePulseSpeed * (1 - reasoning.blend) + reasoningCorePulseSpeed * reasoning.blend;
+	phase.corePulse += dt * corePulseSpeed;
+
+	const normalCorePulseAmount = 0.01 + intensity * 0.15;
+	const reasoningCorePulseAmount = 0.08;
+	const corePulseAmount =
+		normalCorePulseAmount * (1 - reasoning.blend) + reasoningCorePulseAmount * reasoning.blend;
+	const corePulse = 1 + Math.sin(phase.corePulse) * corePulseAmount;
+
+	elements.coreGroup.scale.setScalar(corePulse * (1 + audio.current * 0.18));
+
+	const squashStretch = 1 + audio.current * 0.15;
+	elements.coreMesh.scale.set(1, squashStretch, 1);
+	elements.glowMesh.scale.y *= squashStretch;
+}

package/src/avatar/rig/update/update-eye.ts

@@ -0,0 +1,31 @@
+import type { SceneElements } from "../scene/create-scene-elements";
+import type { RigState } from "../state/rig-state";
+import { clamp01, lerpColor } from "../utils/math";
+
+export function updateEye(elements: SceneElements, state: RigState, dt: number, intensity: number): void {
+	const { phase, audio, typing, reasoning, tool, theme } = state;
+
+	const eyeSpeed = 1.5 + intensity * 4;
+	phase.eyePulse += dt * eyeSpeed;
+	const eyePulseAmount = 0.1 + intensity * 0.3 + typing.pulse * 0.1;
+	const eyePulse = 0.9 + Math.sin(phase.eyePulse) * eyePulseAmount;
+	elements.eye.scale.setScalar(eyePulse * (1 + audio.current * 0.1));
+
+	const pupilSpeed = 2 + intensity * 5;
+	phase.pupilPulse += dt * pupilSpeed;
+	const pupilPulseAmount = 0.15 + intensity * 0.35 + typing.pulse * 0.15;
+	const normalPupilBase = 0.8 + Math.sin(phase.pupilPulse) * pupilPulseAmount;
+	const reasoningPupilDilation = 1.4;
+	const pupilBase = normalPupilBase * (1 - reasoning.blend) + reasoningPupilDilation * reasoning.blend;
+	elements.pupil.scale.setScalar(pupilBase * (1 + audio.current * 0.08));
+
+	if (tool.flashTimer > 0) {
+		tool.flashTimer -= dt;
+		const flashIntensity = clamp01(tool.flashTimer / 0.15);
+		elements.eyeMat.color.setHex(lerpColor(theme.current.eye, tool.flashColor, flashIntensity));
+		elements.pupilMat.color.setHex(lerpColor(theme.current.eye, tool.flashColor, flashIntensity));
+	}
+
+	elements.eyeMat.opacity = clamp01(0.85 + intensity * 0.15 + audio.current * 0.15);
+	elements.pupilMat.opacity = clamp01(0.9 + intensity * 0.1 + audio.current * 0.1);
+}

package/src/avatar/rig/update/update-fragments.ts

@@ -0,0 +1,46 @@
+import type { SceneElements } from "../scene/create-scene-elements";
+import type { RigState } from "../state/rig-state";
+import { clamp01 } from "../utils/math";
+
+export function updateFragments(
+	elements: SceneElements,
+	state: RigState,
+	dt: number,
+	intensity: number
+): void {
+	const { audio, tool, reasoning, intensity: intensityState } = state;
+
+	tool.fragmentScatterBoost += (0 - tool.fragmentScatterBoost) * dt * 6;
+	tool.settleTimer = Math.max(0, tool.settleTimer - dt);
+
+	const settleContraction = tool.settleTimer > 0 ? Math.sin(tool.settleTimer * 20) * 0.08 : 0;
+	const reasoningContraction = reasoning.blend * 0.25;
+	const fragmentScale =
+		0.5 + intensity * 0.6 + tool.fragmentScatterBoost - settleContraction - reasoningContraction;
+	elements.fragmentGroup.scale.setScalar(fragmentScale);
+
+	elements.fragments.forEach((frag) => {
+		const reasoningOrbitSlowdown = 1 - reasoning.blend * 0.6;
+		const audioOrbitBoost = audio.current * 0.4;
+		const orbitSpeed =
+			frag.orbitSpeed * (0.4 + intensity * 1.2 + audioOrbitBoost) * reasoningOrbitSlowdown +
+			intensityState.spinBoost * 0.5;
+		frag.orbitAngle += dt * orbitSpeed;
+
+		const dynamicRadius = frag.orbitRadius;
+		const bobAmount = 0.08 + intensity * 0.2;
+		const bobSpeed = frag.bobSpeed * (0.5 + intensity * 1.0);
+		frag.bobPhase += dt * bobSpeed;
+
+		const bob = Math.sin(frag.bobPhase) * bobAmount;
+		frag.mesh.position.x = Math.cos(frag.orbitAngle) * dynamicRadius;
+		frag.mesh.position.z = Math.sin(frag.orbitAngle) * dynamicRadius;
+		frag.mesh.position.y += (bob - frag.mesh.position.y) * dt * 3;
+
+		const tumbleSpeed = 0.1 + intensity * 0.5;
+		frag.mesh.rotation.x += dt * tumbleSpeed;
+		frag.mesh.rotation.y += dt * tumbleSpeed * 1.5;
+
+		frag.material.opacity = clamp01(0.45 + intensity * 0.4 + audio.current * 0.22);
+	});
+}

package/src/avatar/rig/update/update-glitch.ts

@@ -0,0 +1,64 @@
+import type { SceneElements } from "../scene/create-scene-elements";
+import type { RigState } from "../state/rig-state";
+
+export function updateGlitchBehavior(
+	elements: SceneElements,
+	state: RigState,
+	dt: number,
+	intensity: number,
+	allowGlitch: boolean
+): void {
+	const { glitch } = state;
+
+	if (!allowGlitch) {
+		glitch.timer = 0;
+		if (glitch.isActive) {
+			glitch.isActive = false;
+			elements.coreGroup.position.set(0, 0, 0);
+			elements.fragmentGroup.scale.set(1, 1, 1);
+		}
+		return;
+	}
+
+	glitch.timer += dt;
+
+	const intensityFactor = Math.max(0.1, intensity);
+	const baseInterval = 3.0 / intensityFactor;
+	const randomFactor = 0.5 + Math.random();
+	const glitchInterval = baseInterval * randomFactor;
+
+	if (!glitch.isActive && glitch.timer > glitchInterval) {
+		glitch.isActive = true;
+		glitch.duration = 0.05 + Math.random() * 0.1 + intensity * 0.05;
+		glitch.timer = 0;
+	}
+
+	if (glitch.isActive) {
+		glitch.duration -= dt;
+
+		const displaceMult = intensity * 0.5;
+		elements.coreGroup.position.set(
+			(Math.random() - 0.5) * 0.05 * displaceMult,
+			(Math.random() - 0.5) * 0.05 * displaceMult,
+			(Math.random() - 0.5) * 0.03 * displaceMult
+		);
+
+		const scatterAmount = 1.0 + (Math.random() - 0.5) * intensity * 0.15;
+		elements.fragmentGroup.scale.setScalar(scatterAmount);
+
+		elements.rings.forEach((ring, i) => {
+			const baseOpacity = 0.5 + i * 0.15;
+			const flickerRange = intensity * 0.2;
+			ring.material.opacity = baseOpacity * (1 - flickerRange + Math.random() * flickerRange * 2);
+		});
+
+		if (glitch.duration <= 0) {
+			glitch.isActive = false;
+			elements.coreGroup.position.set(0, 0, 0);
+			elements.fragmentGroup.scale.set(1, 1, 1);
+			elements.rings.forEach((ring, i) => {
+				ring.material.opacity = 0.5 + i * 0.15;
+			});
+		}
+	}
+}

package/src/avatar/rig/update/update-idle.ts

@@ -0,0 +1,95 @@
+import type { SceneElements } from "../scene/create-scene-elements";
+import type { RigState } from "../state/rig-state";
+
+export function updateIdleAmbience(
+	elements: SceneElements,
+	state: RigState,
+	dt: number,
+	isIdle: boolean
+): void {
+	const { idleMicroGlitch, eyeDrift, particlePulse, coreDrift, typing } = state;
+
+	if (isIdle) {
+		idleMicroGlitch.timer += dt;
+		if (!idleMicroGlitch.active && idleMicroGlitch.timer > idleMicroGlitch.cooldown) {
+			idleMicroGlitch.active = true;
+			idleMicroGlitch.duration = 0.08 + Math.random() * 0.12;
+			idleMicroGlitch.timer = 0;
+			idleMicroGlitch.cooldown = 3 + Math.random() * 5;
+		}
+		if (idleMicroGlitch.active) {
+			idleMicroGlitch.duration -= dt;
+			const jitterAmount = 0.06;
+			elements.coreGroup.position.x += (Math.random() - 0.5) * jitterAmount;
+			elements.coreGroup.position.y += (Math.random() - 0.5) * jitterAmount;
+			if (idleMicroGlitch.duration <= 0) {
+				idleMicroGlitch.active = false;
+				elements.coreGroup.position.x = 0;
+				elements.coreGroup.position.y = 0;
+			}
+		}
+	} else {
+		idleMicroGlitch.timer = 0;
+		idleMicroGlitch.active = false;
+	}
+
+	if (typing.active) {
+		typing.eyeScanTimer += dt;
+		if (typing.eyeScanTimer > typing.eyeScanInterval) {
+			typing.eyeScanTimer = 0;
+			const scanWidth = 0.2;
+			eyeDrift.targetX = (Math.random() - 0.5) * scanWidth;
+			eyeDrift.targetY = (Math.random() - 0.5) * 0.05;
+			typing.eyeScanInterval = 0.3 + Math.random() * 0.8;
+		}
+		const trackSpeed = 5;
+		eyeDrift.x += (eyeDrift.targetX - eyeDrift.x) * dt * trackSpeed;
+		eyeDrift.y += (eyeDrift.targetY - eyeDrift.y) * dt * trackSpeed;
+	} else if (isIdle) {
+		eyeDrift.timer += dt;
+		if (eyeDrift.timer > eyeDrift.interval) {
+			eyeDrift.timer = 0;
+			const isFast = Math.random() > 0.4;
+			eyeDrift.interval = isFast ? 0.15 + Math.random() * 0.25 : 2.0 + Math.random() * 3.0;
+			eyeDrift.targetX = (Math.random() - 0.5) * 0.25;
+			eyeDrift.targetY = (Math.random() - 0.5) * 0.15;
+		}
+		const interpSpeed = eyeDrift.interval < 0.5 ? 30 : 1.5;
+		eyeDrift.x += (eyeDrift.targetX - eyeDrift.x) * dt * interpSpeed;
+		eyeDrift.y += (eyeDrift.targetY - eyeDrift.y) * dt * interpSpeed;
+	} else {
+		eyeDrift.x += (0 - eyeDrift.x) * dt * 4;
+		eyeDrift.y += (0 - eyeDrift.y) * dt * 4;
+	}
+
+	elements.eye.position.x = eyeDrift.x;
+	elements.eye.position.y = eyeDrift.y;
+	elements.pupil.position.x = eyeDrift.x;
+	elements.pupil.position.y = eyeDrift.y;
+
+	if (isIdle) {
+		particlePulse.timer += dt;
+		if (particlePulse.timer > particlePulse.interval) {
+			particlePulse.timer = 0;
+			particlePulse.interval = 1 + Math.random() * 2;
+			particlePulse.brightness = 1.0;
+		}
+	}
+	particlePulse.brightness = Math.max(0, particlePulse.brightness - dt * 1.5);
+
+	const coreDriftSpeed = 0.4;
+	const coreDriftAmount = 0.08;
+	coreDrift.phaseX += dt * coreDriftSpeed;
+	coreDrift.phaseY += dt * coreDriftSpeed * 0.7;
+	coreDrift.phaseZ += dt * coreDriftSpeed * 0.5;
+
+	const targetDriftX = Math.sin(coreDrift.phaseX) * coreDriftAmount;
+	const targetDriftY = Math.sin(coreDrift.phaseY) * coreDriftAmount;
+	const targetDriftZ = Math.sin(coreDrift.phaseZ) * coreDriftAmount * 0.5;
+
+	coreDrift.x += (targetDriftX - coreDrift.x) * dt * 2;
+	coreDrift.y += (targetDriftY - coreDrift.y) * dt * 2;
+	coreDrift.z += (targetDriftZ - coreDrift.z) * dt * 2;
+
+	elements.mainAnchor.position.set(coreDrift.x, coreDrift.y, coreDrift.z);
+}

package/src/avatar/rig/update/update-intensity.ts

@@ -0,0 +1,16 @@
+import type { RigState } from "../state/rig-state";
+
+export function updateIntensityAndAudio(state: RigState, dt: number): number {
+	const { intensity, audio, typing, reasoning } = state;
+
+	typing.pulse = Math.max(0, typing.pulse - dt * 5);
+
+	const intensityRate = intensity.target > intensity.current ? 10 : 8;
+	intensity.current += (intensity.target - intensity.current) * dt * intensityRate;
+
+	intensity.spinBoost += (0 - intensity.spinBoost) * dt * 2.5;
+	audio.current += (audio.target - audio.current) * dt * 25;
+	reasoning.blend += ((reasoning.active ? 1 : 0) - reasoning.blend) * dt * 6;
+
+	return intensity.current;
+}

package/src/avatar/rig/update/update-main-anchor.ts

@@ -0,0 +1,20 @@
+import type { SceneElements } from "../scene/create-scene-elements";
+import type { RigState } from "../state/rig-state";
+
+export function updateMainAnchor(
+	elements: SceneElements,
+	state: RigState,
+	dt: number,
+	intensity: number
+): void {
+	const { phase, audio } = state;
+
+	const driftSpeed = 0.08 + intensity * 0.3;
+	phase.drift += dt * driftSpeed;
+	const driftAmount = 0.03 + intensity * 0.12;
+
+	elements.mainAnchor.rotation.y = Math.sin(phase.drift) * driftAmount;
+	elements.mainAnchor.rotation.x = Math.sin(phase.drift * 0.7) * driftAmount * 0.5;
+	elements.mainAnchor.rotation.z = Math.sin(phase.drift * 0.5) * intensity * 0.08;
+	elements.mainAnchor.scale.setScalar(1 + audio.current * 0.12);
+}

package/src/avatar/rig/update/update-particles.ts

@@ -0,0 +1,49 @@
+import type { SceneElements } from "../scene/create-scene-elements";
+import type { RigState } from "../state/rig-state";
+import { clamp01 } from "../utils/math";
+
+export function updateParticles(
+	elements: SceneElements,
+	state: RigState,
+	dt: number,
+	intensity: number,
+	allowGlitch: boolean
+): void {
+	const { audio, particlePulse } = state;
+	const particleCount = elements.particleVelocities.length;
+
+	const glitchChance = allowGlitch ? 0.0002 + intensity * 0.006 : 0;
+	const audioJitterBoost = 1 + audio.current * 0.8;
+	const particleSpeedMult = (0.3 + intensity * 1.2) * audioJitterBoost;
+
+	for (let i = 0; i < particleCount; i++) {
+		const vel = elements.particleVelocities[i]!;
+		let x = elements.particlePos.getX(i) + vel.x * dt * particleSpeedMult;
+		let y = elements.particlePos.getY(i) + vel.y * dt * particleSpeedMult;
+		let z = elements.particlePos.getZ(i) + vel.z * dt * particleSpeedMult;
+
+		if (Math.random() < glitchChance) {
+			const r = 1.5 + Math.random() * 2;
+			const theta = Math.random() * Math.PI * 2;
+			const phi = Math.acos(Math.random() * 2 - 1);
+			x = r * Math.sin(phi) * Math.cos(theta);
+			y = r * Math.sin(phi) * Math.sin(theta);
+			z = r * Math.cos(phi);
+		}
+
+		const distSq = x * x + y * y + z * z;
+		if (distSq > 20) {
+			x *= -0.8;
+			y *= -0.8;
+			z *= -0.8;
+		}
+
+		elements.particlePos.setXYZ(i, x, y, z);
+	}
+	elements.particlePos.needsUpdate = true;
+
+	const idleParticleBoost = particlePulse.brightness * 0.4;
+	elements.particleMat.opacity = clamp01(0.3 + intensity * 0.4 + audio.current * 0.25 + idleParticleBoost);
+	elements.particleMat.size =
+		0.02 + intensity * 0.015 + audio.current * 0.01 + particlePulse.brightness * 0.02;
+}

package/src/avatar/rig/update/update-rings.ts

@@ -0,0 +1,35 @@
+import type { SceneElements } from "../scene/create-scene-elements";
+import type { RigState } from "../state/rig-state";
+import { clamp01 } from "../utils/math";
+
+export function updateRings(elements: SceneElements, state: RigState, dt: number, intensity: number): void {
+	const { audio, intensity: intensityState } = state;
+
+	const orbitScale = 0.75 + intensity * 0.4;
+	elements.orbitGroup.scale.setScalar(orbitScale);
+
+	elements.rings.forEach((ring, i) => {
+		const ringIntensity = Math.pow(intensity, 1.35);
+		const ringSpeed = ring.speed * (0.4 + ringIntensity * 1.5) + intensityState.spinBoost * (1 + i * 0.2);
+		ring.mesh.rotateOnAxis(ring.axis, dt * ringSpeed);
+
+		const wobbleSpeed = 3 + i * 0.5;
+		ring.wobblePhase += dt * wobbleSpeed;
+		const wobbleAmount = audio.current * 0.06;
+		const wobbleX = Math.sin(ring.wobblePhase) * wobbleAmount;
+		const wobbleZ = Math.cos(ring.wobblePhase * 1.3) * wobbleAmount;
+		ring.mesh.rotation.x += wobbleX;
+		ring.mesh.rotation.z += wobbleZ;
+
+		const phaseSpeed = 1 + intensity * 3;
+		ring.phase += dt * phaseSpeed;
+
+		const baseOpacity = 0.4 + intensity * 0.4 + i * 0.1;
+		if (intensity > 0.1) {
+			const wave = Math.sin(ring.phase + i * 1.5) * 0.2 * intensity;
+			ring.material.opacity = clamp01(baseOpacity + wave + audio.current * 0.25);
+		} else {
+			ring.material.opacity = clamp01(baseOpacity + audio.current * 0.25);
+		}
+	});
+}

package/src/avatar/rig/update/update-sigils.ts

@@ -0,0 +1,26 @@
+import type { SceneElements } from "../scene/create-scene-elements";
+import type { RigState } from "../state/rig-state";
+import { clamp01 } from "../utils/math";
+
+export function updateSigils(elements: SceneElements, state: RigState, dt: number, intensity: number): void {
+	const { phase, audio, tool } = state;
+
+	for (let i = 0; i < elements.fragments.length; i++) {
+		const curr = elements.fragments[i]!;
+		const next = elements.fragments[(i + 1) % elements.fragments.length]!;
+		elements.sigilPos.setXYZ(i * 2, curr.mesh.position.x, curr.mesh.position.y, curr.mesh.position.z);
+		elements.sigilPos.setXYZ(i * 2 + 1, next.mesh.position.x, next.mesh.position.y, next.mesh.position.z);
+	}
+	elements.sigilPos.needsUpdate = true;
+
+	const sigilPulseSpeed = 1 + intensity * 2;
+	phase.sigilPulse += dt * sigilPulseSpeed;
+
+	tool.sigilBrightnessBoost += ((tool.active ? 1 : 0) - tool.sigilBrightnessBoost) * dt * 8;
+
+	const sigilBaseOpacity = 0.2 + intensity * 0.2 + tool.sigilBrightnessBoost * 0.5;
+	const sigilPulseAmount = 0.05 + intensity * 0.12;
+	elements.sigilMat.opacity = clamp01(
+		sigilBaseOpacity + Math.sin(phase.sigilPulse) * sigilPulseAmount + audio.current * 0.2
+	);
+}

package/src/avatar/rig/update/update-spawn.ts

@@ -0,0 +1,83 @@
+import type { SceneElements } from "../scene/create-scene-elements";
+import type { RigState } from "../state/rig-state";
+
+import { STARTUP_BANNER_DURATION_S } from "../../../ui/startup";
+
+const SPAWN_DURATION = STARTUP_BANNER_DURATION_S;
+
+/** Easing for jitter intensity - high at start, fades quickly */
+function jitterEasing(t: number): number {
+	return Math.pow(1 - t, 2);
+}
+
+/**
+ * Updates the spawn animation state and applies visual effects.
+ * Returns the current spawn progress (0-1) for other systems to use.
+ */
+export function updateSpawn(elements: SceneElements, state: RigState, dt: number): number {
+	const easedProgress = advanceSpawn(state, dt);
+	applySpawn(elements, state);
+	return easedProgress;
+}
+
+/**
+ * Advances spawn timers/state (no rendering side effects).
+ * Returns the eased progress (0-1).
+ */
+export function advanceSpawn(state: RigState, dt: number): number {
+	if (state.spawn.complete) return 1;
+
+	state.spawn.elapsed += dt;
+	const rawProgress = Math.min(1, state.spawn.elapsed / SPAWN_DURATION);
+	state.spawn.progress = rawProgress;
+	state.spawn.glitchIntensity = jitterEasing(rawProgress);
+
+	// Mark complete when done
+	if (rawProgress >= 1) {
+		state.spawn.complete = true;
+		state.spawn.progress = 1;
+		state.spawn.glitchIntensity = 0;
+		return 1;
+	}
+
+	return rawProgress;
+}
+
+/**
+ * Applies spawn animation effects to scene elements using current state.
+ * Safe to call multiple times per frame.
+ */
+export function applySpawn(elements: SceneElements, state: RigState): void {
+	// Minimal startup effect: jitter only (synced to banner reveal duration).
+	if (state.spawn.complete) {
+		elements.coreGroup.position.x = 0;
+		elements.coreGroup.position.y = 0;
+		return;
+	}
+
+	const jitterAmount = state.spawn.glitchIntensity * 0.15;
+	const jitterX = (Math.random() - 0.5) * jitterAmount;
+	const jitterY = (Math.random() - 0.5) * jitterAmount;
+	elements.coreGroup.position.x = jitterX;
+	elements.coreGroup.position.y = jitterY;
+}
+
+/**
+ * Resets spawn state for a fresh spawn animation.
+ */
+export function resetSpawnState(state: RigState): void {
+	state.spawn.progress = 0;
+	state.spawn.elapsed = 0;
+	state.spawn.complete = false;
+	state.spawn.glitchIntensity = 1;
+}
+
+/**
+ * Skips spawn animation and sets everything to fully spawned.
+ */
+export function skipSpawnAnimation(state: RigState): void {
+	state.spawn.progress = 1;
+	state.spawn.elapsed = SPAWN_DURATION;
+	state.spawn.complete = true;
+	state.spawn.glitchIntensity = 0;
+}

package/src/avatar/rig/utils/math.ts

@@ -0,0 +1,17 @@
+export const clamp = (value: number, min: number, max: number): number => Math.max(min, Math.min(max, value));
+
+export const clamp01 = (value: number): number => clamp(value, 0, 1);
+
+export function lerpColor(current: number, target: number, t: number): number {
+	const cr = (current >> 16) & 0xff;
+	const cg = (current >> 8) & 0xff;
+	const cb = current & 0xff;
+	const tr = (target >> 16) & 0xff;
+	const tg = (target >> 8) & 0xff;
+	const tb = target & 0xff;
+	return (
+		(Math.round(cr + (tr - cr) * t) << 16) |
+		(Math.round(cg + (tg - cg) * t) << 8) |
+		Math.round(cb + (tb - cb) * t)
+	);
+}

package/src/components/ContentBlockView.tsx

@@ -41,6 +41,10 @@ export function ContentBlockView({
 
 		// Show full reasoning if enabled
 		if (showFullReasoning) {
+			const durationLabel =
+				block.durationMs !== undefined
+					? ` · ${formatElapsedTime(block.durationMs, { style: "detailed" })}`
+					: "";
 			return (
 				<box
 					flexDirection="column"
@@ -51,6 +55,7 @@ export function ContentBlockView({
 				>
 					<text>
 						<span fg={COLORS.REASONING}>{"REASONING"}</span>
+						<span fg={COLORS.REASONING_DIM}>{durationLabel}</span>
 					</text>
 					<code
 						content={cleanedContent}
@@ -74,7 +79,7 @@ export function ContentBlockView({
 		return (
 			<text>
 				<span fg={COLORS.REASONING_DIM}>
-					{"// REASONING"}
+					{"REASONING"}
 					{durationLabel}
 				</span>
 			</text>

package/src/components/ToolCallView.tsx

@@ -1,18 +1,18 @@
 import { useMemo } from "react";
-import { COLORS } from "../ui/constants";
+import { useToolApprovalForCall } from "../hooks/use-tool-approval";
 import type { ToolCall } from "../types";
+import { COLORS } from "../ui/constants";
+import { ApprovalPicker } from "./ApprovalPicker";
 import {
-	getToolLayout,
+	ErrorPreviewView,
+	ResultPreviewView,
+	ToolBodyView,
+	ToolHeaderView,
 	defaultToolLayout,
 	getDefaultAbbreviation,
-	ToolHeaderView,
-	ToolBodyView,
-	ResultPreviewView,
-	ErrorPreviewView,
 	getStatusBorderColor,
+	getToolLayout,
 } from "./tool-layouts";
-import { ApprovalPicker } from "./ApprovalPicker";
-import { useToolApprovalForCall } from "../hooks/use-tool-approval";
 
 interface ToolCallViewProps {
 	call: ToolCall;
@@ -68,10 +68,7 @@ export function ToolCallView({ call, result, showOutput = true }: ToolCallViewPr
 	const toolName = layout.abbreviation ?? getDefaultAbbreviation(call.name);
 	const borderColor = getStatusBorderColor(call.status);
 
-	const customBody = useMemo(() => {
-		if (!layout.renderBody) return null;
-		return layout.renderBody({ call, result, showOutput });
-	}, [layout, call, result, showOutput]);
+	const customBody = layout.renderBody ? layout.renderBody({ call, result, showOutput }) : null;
 
 	return (
 		<box

package/src/components/tool-layouts/components.tsx

@@ -1,7 +1,7 @@
 import { TextAttributes } from "@opentui/core";
-import { COLORS } from "../../ui/constants";
-import type { ToolHeader, ToolBody, ToolBodyLine } from "./types";
 import type { ToolCallStatus } from "../../types";
+import { COLORS } from "../../ui/constants";
+import type { ToolBody, ToolBodyLine, ToolHeader } from "./types";
 
 interface ToolHeaderViewProps {
 	toolName: string;
@@ -11,11 +11,12 @@ interface ToolHeaderViewProps {
 }
 
 export function ToolHeaderView({ toolName, header, isRunning, toolColor }: ToolHeaderViewProps) {
+	const displayName = toolName.toUpperCase();
 	return (
 		<box flexDirection="row" alignItems="center" justifyContent="space-between" width="100%">
 			<text>
 				<span fg={toolColor}>{"↯ "}</span>
-				<span fg={toolColor}>{toolName}</span>
+				<span fg={toolColor}>{displayName}</span>
 				{header?.primary && <span fg={COLORS.TOOL_INPUT_TEXT}>{` ${header.primary}`}</span>}
 				{header?.secondary && (
 					<span