body{display:flex;justify-content:center;align-items:center;background-color:#000;color:#f0f8ff;height:100vh;margin:0}.container{padding:50px;border:5px solid white;display:flex;flex-direction:column;border-radius:20px;background-color:#7fffd4}@media (width<1024px){.container{padding:50px 40px}}@media (width<800px){.container{padding:50px 30px}}@media (width<600px){.container{padding:50px 20px}}h1,p{margin:0}h1{margin-bottom:20px;text-align:center}p{font-size:1rem;line-height:1.5;font-weight:500;font-family:Courier New,Courier,monospace}.dies-container{display:grid;grid-template-columns:repeat(5,1fr);gap:20px;margin:50px 0}@media (width<1024px){.dies-container{gap:15px}}@media (width<800px){.dies-container{gap:15px}}@media (width<600px){.dies-container{gap:10px}}button.die-button{padding:10px;font-size:2rem;font-weight:500;background-color:#fff;border-radius:10px;border:none;box-shadow:5px 5px 5px #000000bf;-webkit-box-shadow:5px 5px 5px 0px rgba(0,0,0,.75);-moz-box-shadow:5px 5px 5px 0px rgba(0,0,0,.75)}button.roll{padding:10px 20px;font-size:2rem;font-weight:500;margin:0 auto;background-color:#8a2be2;border-radius:10px;border:none;box-shadow:5px 5px 5px #000000bf;-webkit-box-shadow:5px 5px 5px 0px rgba(0,0,0,.75);-moz-box-shadow:5px 5px 5px 0px rgba(0,0,0,.75)}
