feat: implement keyframe animation system

Add keyframe support for transform, opacity, and volume properties.
Includes animation engine (interpolation, mutations, resolvers), timeline
markers with selection/snapping, properties panel toggles, keyframe-aware
renderer, and full undo/redo command support.

Also refactor element command constructors to object params, extract
timeline pixel math to pixel-utils.ts, and update cursor rules.

1 files changed, 33 insertions, 0 deletions

diff --git a/apps/web/src/lib/timeline/track-element-update.ts b/apps/web/src/lib/timeline/track-element-update.ts
new file mode 100644
index 00000000..6118b327
--- /dev/null
+++ b/apps/web/src/lib/timeline/track-element-update.ts
@@ -0,0 +1,33 @@
+import type { TimelineElement, TimelineTrack } from "@/types/timeline";
+
+export function updateElementInTracks({
+	tracks,
+	trackId,
+	elementId,
+	update,
+	elementPredicate,
+}: {
+	tracks: TimelineTrack[];
+	trackId: string;
+	elementId: string;
+	update: (element: TimelineElement) => TimelineElement;
+	elementPredicate?: (element: TimelineElement) => boolean;
+}): TimelineTrack[] {
+	return tracks.map((track) => {
+		if (track.id !== trackId) {
+			return track;
+		}
+
+		const nextElements = track.elements.map((element) => {
+			if (element.id !== elementId) {
+				return element;
+			}
+			if (elementPredicate && !elementPredicate(element)) {
+				return element;
+			}
+			return update(element);
+		});
+
+		return { ...track, elements: nextElements } as TimelineTrack;
+	});
+}