✓ Two crowns ✓ Same mass, different density ✓ Vertical slider ✓ Slider works ✓ Slider controls crowns — Slider direction correct ✓ Full slider range — Fall animation ✓ Water displacement ✓ Rising water level ✓ Splash effects ✓ Physics correct — Live mass value — Live volume value — Live density value ✓ Live displaced water ✓ Gilded displaces more ✓ Heureka animation ✓ No external deps ✓ Light bg / dark text ✓ Self-contained HTML
Slider direction is inverted (value=0/top = crown in air, value=100/bottom = fully submerged is correct mapping, but the crown position math moves them upward from bottom as slider increases, meaning dragging slider down raises crowns out of the tank rather than into it — opposite of intended UX); mass, volume, and density are static hardcoded text rather than live-updating DOM values; no fall animation (crowns teleport instantly); splash fires continuously during any mid-range slider movement rather than only on water entry events.
Slider direction is inverted (value=0/top = crown in air, value=100/bottom = fully submerged is correct mapping, but the crown position math moves them upward from bottom as slider increases, meaning dragging slider down raises crowns out of the tank rather than into it — opposite of intended UX); mass, volume, and density are static hardcoded text rather than live-updating DOM values; no fall animation (crowns teleport instantly); splash fires continuously during any mid-range slider movement rather than only on water entry events.