The Exploded Cluster

Interactive scroll-driven teardown of Kubernetes / OpenShift / Docker, in the estate's Bat-Computer visual world (void #070b14, cyan #3fbaf5 → magenta #e879f9).

• v2 (tag v2) — CSS preserve-3d diagrams. Parked: eyeballed px positions, misaligned at some widths.
• v3 (in progress) — ships PUBLIC at learn.bztmon.com.
• v3 build — Nano Banana 2 exploded hero shots, hand-sliced into clip-path parts and scrubbed collapsed → hero with GSAP. Spec: homelab/specs/SPEC-exploded-cluster-v3.md.

Layout

Path	What
exploded-cluster.html	v2 assembled single file (174KB)
ec2-part1.html / ec2-part2.html	v2 source split — markup+CSS / app JS
gsap.min.js · st.min.js	GSAP 3.13 + ScrollTrigger, inlined at assemble time
prompts/	NB2 prompt contract — master style block + per-scene prompts
tools/slicer.html	slice editor: load a hero, tune cut lines, export the manifest
assets/raw/	curated NB2 heroes, straight from the generator

Rebuild v2: cat ec2-part1.html <(echo "<script>") gsap.min.js <(echo "</script><script>") st.min.js <(echo "</script>") ec2-part2.html > exploded-cluster.html

The slicing rule (load-bearing — read before touching the engine)

Parts occlude each other in 2D, so every slice carries a hidden notch where the part in front covers it. Animating collapsed → hero only ever increases occlusion, so notches stay buried. Never overshoot past the hero layout and never fan parts sideways — either exposes the tears. Region boundaries overlap upward by EPS; expanding downward would ghost.