<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Dice Roller Widget</title><style>body {font-family: Arial, sans-serif;text-align: center;}#dice {font-size: 24px;padding: 10px;border: 1px solid #ccc;border-radius: 5px;cursor: pointer;}</style></head><body><h1>Dice Roller Widget</h1><p>Click the button below to roll the dice:</p><button id="dice">Roll Dice</button><p id="result"></p><script>document.getElementById('dice').addEventListener('click', function() {const resultElement = document.getElementById('result');const rollResult = Math.floor(Math.random() * 6) + 1; // Generate a random number between 1 and 6resultElement.textContent = `You rolled a ${rollResult}!`;});</script></body></html>