✓ 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 is labeled top/air but the range input with writing-mode vertical-lr + direction:rtl makes 0 visually at top which is correct semantically, however the label reads "⬆ Oben … ⬇ Unten" with no animated fall — crowns teleport rather than animate falling, and both crowns use the identical immersion fraction curve despite differing volumes, so the differential displacement is driven purely by the volume constant rather than any geometric immersion model.
Slider direction is inverted (value=0 is labeled top/air but the range input with writing-mode vertical-lr + direction:rtl makes 0 visually at top which is correct semantically, however the label reads "⬆ Oben … ⬇ Unten" with no animated fall — crowns teleport rather than animate falling, and both crowns use the identical immersion fraction curve despite differing volumes, so the differential displacement is driven purely by the volume constant rather than any geometric immersion model.