*{box-sizing:border-box}body{margin:0;font-family:Karla,sans-serif;background-color:#2c3e50;padding:20px;height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#ecf0f1}div#root{height:100%;width:100%;max-height:500px;max-width:500px}main{background-color:#ecf0f1;height:100%;border-radius:8px;gap:1rem;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center;padding:20px}.title{font-size:40px;margin:0;color:#34495e}.instructions{font-family:Inter,sans-serif;font-weight:400;margin-top:0;text-align:center;color:#7f8c8d}.dice-container{display:grid;grid-template:auto auto / repeat(5,1fr);gap:20px;margin-bottom:40px}button{font-family:Karla,sans-serif;cursor:pointer;border-radius:8px}.dice-container button{height:60px;width:60px;box-shadow:0 4px 6px #0000001a;border:none;background-color:#fdfefe;font-size:1.75rem;font-weight:700;color:#2c3e50;display:flex;justify-content:center;align-items:center;transition:background-color .3s ease,transform .2s ease}.dice-container button:hover{background-color:#f39c12;transform:scale(1.1)}.dice-container button:focus{outline:2px solid #3498db}button.roll-dice{height:50px;white-space:nowrap;width:auto;padding:8px 24px;border:none;border-radius:6px;background-color:#3498db;color:#fff;font-size:1.2rem;transition:background-color .3s ease,transform .2s ease}button.roll-dice:hover{background-color:#2980b9;transform:scale(1.05)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media (max-width: 600px){.dice-container button{height:40px;width:40px;font-size:1.25rem;display:flex;justify-content:center;align-items:center}button.roll-dice{padding:5px 16px;font-size:1rem}}@media (min-width: 601px) and (max-width: 1024px){.dice-container button{height:50px;width:50px;font-size:1.5rem;justify-content:space-evenly;align-items:center}button.roll-dice{padding:6px 20px;font-size:1.1rem}}@media (min-width: 1025px){.dice-container button{height:60px;width:60px;font-size:1.75rem;justify-content:space-evenly;align-items:center}button.roll-dice{padding:8px 24px;font-size:1.2rem}}