✓ 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 is horizontal (not vertical) and inverted (0%=crowns in air, 100%=crowns in water, but conceptually the slider direction requirement means top=air/bottom=water which a horizontal slider cannot satisfy); physics values are implausible (gilded crown density ~5.5 g/cm³ is too low, submersion calculations are ad-hoc approximations rather than proper Archimedes displacement, and water-level rise from total displaced ~4.5 cm³ / 58 px-wide container is nearly imperceptible).
Slider is horizontal (not vertical) and inverted (0%=crowns in air, 100%=crowns in water, but conceptually the slider direction requirement means top=air/bottom=water which a horizontal slider cannot satisfy); physics values are implausible (gilded crown density ~5.5 g/cm³ is too low, submersion calculations are ad-hoc approximations rather than proper Archimedes displacement, and water-level rise from total displaced ~4.5 cm³ / 58 px-wide container is nearly imperceptible).