*{box-sizing:border-box}body{margin:0;background-color:#0b2434;padding:20px;height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center}#root{height:100%;width:100%;max-height:90vh;max-width:90vw}main{background-color:#f5f5f5;height:100%;border-radius:10px;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center}.title{font-size:clamp(1.8rem,6vw,2.7rem);margin:0}.instructions{font-family:Times New Roman,Times,serif,sans-serif;font-weight:500;margin-top:0;text-align:center;width:80%;font-size:clamp(.9rem,3.5vw,1.1rem)}.dice-container{display:grid;grid-template-columns:repeat(5,minmax(50px,1fr));gap:20px;width:90%;justify-content:center;max-width:500px}.die-button{width:100%;aspect-ratio:1 / 1;box-shadow:0 2px 2px #00000026;border:none;border-radius:10px;background-color:#fff;cursor:pointer;transition:transform .15s ease;font-size:clamp(1.6rem,5vw,2.6rem);font-weight:300;font-family:Impact,sans-serif;margin:0;display:flex;justify-content:center;align-items:center}.die-button:hover{transform:scale(1.05)}.die-button:focus-visible{outline:3px solid #5035ff;outline-offset:3px}.roll-dice-button{height:50px;width:auto;white-space:nowrap;padding:10px 20px;box-shadow:0 2px 2px #00000026;border:none;border-radius:10px;background-color:#2f49da;color:#fff;cursor:pointer;font-size:1.3rem;font-weight:100;font-family:Times New Roman,Times,serif;margin-top:20px}.cs-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.timer{font-size:clamp(.9rem,3.5vw,1.1rem);font-weight:700;margin:0}.die-image{height:70%;pointer-events:none}@media(max-width:500px){.dice-container{grid-template-columns:repeat(3,1fr)}}@media(max-width:350px){.dice-container{grid-template-columns:repeat(2,1fr)}}