@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Karla:ital,wght@0,200..800;1,200..800&display=swap";*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{min-height:100vh;display:grid;background-color:#0b2434;padding:1rem}main{background-color:#f5f5f5;width:100%;height:100%;border-radius:10px;display:flex;flex-direction:column;justify-content:center;align-items:center}.title{color:#2b283a;font-family:Karla,sans-serif;font-size:2rem}.instructions{color:#4a4e74;font-family:Inter,sans-serif;font-size:.9rem;text-align:center}span{display:block}.dice-container{max-width:600px;margin-block:1.5rem;display:grid;gap:1rem;grid-template-columns:repeat(5,1fr)}button{border-radius:4px;border:none;cursor:pointer;font-family:Karla,sans-serif;font-weight:700;font-size:1.2rem}.dice-container button{width:2rem;height:2rem;background-color:#fff;color:#2b283a;box-shadow:0 2px 2px #00000026}.roll-btn{background-color:#5035ff;color:#fff;padding:.3rem 1rem}.held{background-color:#59e391!important}.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 (min-width: 460px){html{font-size:18px}}@media (min-width: 560px){html{font-size:20px}}@media (min-width: 660px){html{font-size:22px}}@media (min-width: 760px){html{font-size:24px}}@media (min-width: 860px){html{font-size:26px}}@media (min-width: 960px){html{font-size:28px}}