🎥 Kamera-Bühne — Handoff für die Katzen

Von der Snake-Bühne zum Side-Scroller. Prototyp: hoerraum/stage_snake_prototype.html.
Vorgeschichte: HANDOFF_STAGE_BAUSTEINE.md (Bausteine-Sichtung), Snake-Prototyp davor.

Die eine Idee

Zoom, Parallax und (später) Gaming sind KEINE drei Baustellen — es ist ein Treiber: die #camera-Group.
Wer die Kamera versteht, versteht alle drei. Nichts davon ist ein Neuanfang.

Was jetzt drin ist (`stage_snake_prototype.html`)

#camera-Group umschließt die ganze Szene. Darin drei Tiefen-Layer mit data-depth
(0.15 Himmel · 0.55 Boden · 1 Figuren-Vordergrund).
Zoom im Wechsel mit den Sprechern. Keyframe-Liste CAM = [storySekunde, zoom, cx, cy],
cx/cy = der Frame-Punkt, der zentriert wird. Weit beim Erzähler → rein auf Snakepy beim Reveal
(2×) → wieder raus beim Davonschlängeln. Interpoliert mit easeInOutQuad, getrieben von applyCamera(t).
Parallax aus demselben Schwenk. Jeder Layer bekommt translateX = pan · (depth−1) · 0.4
(pan = cx−500): ferne Layer schleppen hinterher → Tiefe. Keine zweite Mechanik, nur ein Faktor.
prefers-reduced-motion: Kamera bleibt weit + statisch (REDUCE in applyCamera).

Die Formel (fürs Weiterbauen)

applyScene(t) = tl.seek(t)      // Figuren-Timeline (anime.js)
              + baseTransform(t) // S-Wackeln der Schlange
              + applyCamera(t)   // Zoom + Parallax

Kamera zentriert Punkt (cx,cy) bei Zoom s:
translate(500 − cx·s, 280 − cy·s) scale(s) auf #camera (1000×560-viewBox, Mitte 500/280).

Fallstricke (schon eingetreten, nicht nochmal reinlaufen)

anime.js überschreibt style.transform komplett. Figuren brauchen zwei Ebenen: feste Platzierung
(translate/scale) im SVG-Attribut außen, anime-Ebene innen (mount()). Sonst springt alles in den Ursprung.
scale auf SVG-<circle> (Augen) wirft sie vom SVG-Ursprung weg. Nur Opazität animieren.
Kamera per Attribut, Layer-Parallax per style.transform — nicht mischen, sonst clobbert sich's.

Nächste Stufen (erst bauen, wenn eine Episode es braucht — nicht spekulativ)

In den echten Player falten: #camera um #groundScene in season_player.template.html ziehen,
CAM-Keyframes aus den Caption-Zeiten ableiten. applyCamera(t) hängt dann an audio.currentTime
statt an der Prototyp-Uhr — sonst identisch.
Parallax übers Scrollen (ganze Geschichte visualisieren): cx nicht aus Keyframes, sondern aus
Scroll-Fortschritt speisen. Gleiche applyCamera.
Gaming (zwischen Zelda & Mario): Kamera folgt einer Figur statt der Timeline. Treiber Uhr → Eingabe.
Alles andere bleibt.

Lore bleibt

Sternbild-Folgen (offen/5, kein Hexagon) behalten Fäden+Punkte. Bunt + Kamera sind pro Episode,
nicht global. 🥷 Das Keks-Handbuch-Easter-Egg bleibt versteckt.

Klang → Bits → Bühne → Wald. onezeromore <3