*,*:before,*:after{box-sizing:border-box}body{font-family:karla,sans-serif;margin:0;background-color:#0b2434;height:100vh;display:flex;justify-content:center;align-items:center;padding:10px}main{background-color:#f5f5f5;width:20rem;height:27rem;border-radius:.7rem;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center;padding:10px 27px}main>h1{font-size:26px;font-weight:700;margin:0}main>p{text-align:center;margin:0}.container{display:grid;grid-template:repeat(2,auto) / repeat(5,1fr);gap:22px}.Die{width:2.18rem;height:2.18rem;background-color:#fff;box-shadow:0 2px 2px #00000026;display:flex;justify-content:center;align-items:center;border-radius:10px;border:none;font-family:karla,sans-serif;font-weight:700;font-size:20px;cursor:pointer}.button-container{display:flex;gap:10px}.roll-button{width:92px;height:35px;border:none;border-radius:6px;background-color:#5035ff;color:#fff;font-weight:700;font-family:karla,sans-serif}.reset-button{padding:5px 15px;background-color:#000;color:#fff;font-family:karla,sans-serif;font-weight:700;border:none;border-radius:5px;cursor:pointer}.reset-button:disabled{background-color:#ccc;color:#666;cursor:not-allowed;opacity:.6}.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}