@import"https://fonts.googleapis.com/css2?family=Karla:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400;1,700&display=swap";:root{background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}#root{margin:0 auto;padding:2rem;text-align:center}body{margin:0;display:flex}.main{background-color:#aed3d6;width:35rem;height:35rem;border-radius:.7em;background-size:cover;box-shadow:inset 0 0 0 1000px #c9f9ffb3;display:flex;place-items:center;flex-direction:column}button{min-width:5.5em;padding:.7em;background-color:#fff;color:#2ea2ab;border:none;border-radius:.7em;font-size:1.2em;font-family:Karla,sans-serif;font-weight:700}button:focus{outline:none}button:active{box-shadow:inset 5px 5px 10px -3px #000000b3}.text-wraper{display:flex;place-items:center;flex-direction:column;width:18rem;margin-top:3rem}h1{margin:0 0 .2em;padding:0;font-style:normal;font-weight:700;font-size:2em;line-height:1.5em;font-family:Karla,sans-serif}p{font-style:normal;font-weight:600;font-size:1.1em;line-height:1.1em;font-family:Karla,sans-serif;margin:0}span{color:#2ea2ab;font-weight:700;text-transform:uppercase;text-shadow:-1px -1px 0 rgb(255,255,255),1px -1px 0 rgb(255,255,255),-1px 1px 0 rgb(255,255,255),1px 1px 0 rgb(255,255,255)}.die{width:3rem;height:3rem;border-radius:.4rem;display:flex;place-items:center;justify-content:center}.die-number{margin:0;padding:0}.dice-wraper{margin:4em 0 1em;padding-bottom:1.5em;display:grid;grid-template:auto auto / repeat(5,1fr);gap:2em}.div-container{width:3.5rem;height:3.5rem;display:flex;justify-content:center;align-items:center}.dice-numer{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;width:2.2rem;height:2.2rem}.dott{border-radius:10rem;background-color:#2ea2ab;width:.5rem;height:.5rem}.dott-none{border-radius:10rem;background-color:none;width:.5rem;height:.5rem}.dice-space{display:flex;justify-content:space-between;width:2.2rem}.dice-space-center{display:flex;justify-content:center;width:2.2rem}@media only screen and (max-width: 650px){.dice-wraper{grid-template:auto auto / repeat(2,1fr);gap:1rem;margin:1rem;padding-bottom:1rem}.main{min-height:37rem;width:80vw}.text-wraper{margin:1.5rem}}