App a2

```html

``` ```css body { font-family: Arial, sans-serif; transition: background-color 0.5s, color 0.5s; } .light-mode { background-color: #f0e7db; color: #222; } .dark-mode { background-color: #131416; color: #f0e7db; } button { padding: 10px 20px; font-size: 18px; border: none; cursor: pointer; transition: transform 0.2s; } button:hover { transform: scale(1.1); } ``` ```js document.addEventListener("DOMContentLoaded", () => { const toggleModeBtn = document.getElementById("toggleMode"); const resetSoundBtn = document.getElementById("resetSound"); let isDarkMode = false; toggleModeBtn.addEventListener("click", () => { isDarkMode = !isDarkMode; document.body.classList.toggle("dark-mode", isDarkMode); document.body.classList.toggle("light-mode", !isDarkMode); }); resetSoundBtn.addEventListener("click", () => { alert("🔊 Sonido restablecido a valores predeterminados"); }); });