@import url(https://fonts.googleapis.com/css2?family=Roboto&display=swap);@viewport{zoom:1;width:device-width}:root{--clr-background:#0b2434;--clr-accent:#59e391;--clr-light:#f5f5f5;--clr-lighter:#fff;--crl-text:#4a4e74;--crl-text-darker:#2b283a;--clr-button:#5035ff;--ff-main:"Roboto",sans-serif;--ff-dice:"Karla",sans-serif}*,:after,:before{box-sizing:border-box;margin:0;padding:0}img{display:block;width:100%}@media (prefers-reduced-motion:reduce){*,:after,:before{-webkit-animation-duration:.01ms!important;animation-duration:.01ms!important;-webkit-animation-iteration-count:1!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}html{background-color:#0b2434;background-color:var(--clr-background);font-family:Roboto,sans-serif;font-family:var(--ff-main)}p{color:#4a4e74;color:var(--crl-text)}main{background-color:#f5f5f5;background-color:var(--clr-light);border-radius:1em;justify-content:space-around;margin:2em;min-height:60vh;padding:2em;width:min(80vw,500px)}.app-container,main{align-items:center;display:flex;flex-direction:column}.app-container{justify-content:center;min-height:100vh}.title{color:#2b283a;color:var(--crl-text-darker);font-size:3em;text-transform:uppercase}.instructions{text-align:center}.winner{color:#5035ff;color:var(--clr-button);font-size:1.5rem;font-weight:700;margin-top:.5em;text-transform:uppercase}.gradient-text{-webkit-text-fill-color:transparent;-webkit-animation:rainbow-text-simple-animation-rev .75s ease forwards;animation:rainbow-text-simple-animation-rev .75s ease forwards;-webkit-background-clip:text;background-clip:text;background-color:#ca4246;background-image:linear-gradient(45deg,#ca4246 16.666%,#e16541 0,#e16541 33.333%,#f18f43 0,#f18f43 50%,#8b9862 0,#8b9862 66.666%,#476098 0,#476098 83.333%,#a7489b 0);background-repeat:repeat;background-size:100%}.gradient-text:hover{-webkit-animation:rainbow-text-simple-animation .5s ease-in forwards;animation:rainbow-text-simple-animation .5s ease-in forwards}@-webkit-keyframes rainbow-text-simple-animation-rev{0%{background-size:650%}40%{background-size:650%}to{background-size:100%}}@keyframes rainbow-text-simple-animation-rev{0%{background-size:650%}40%{background-size:650%}to{background-size:100%}}@-webkit-keyframes rainbow-text-simple-animation{0%{background-size:100%}80%{background-size:650%}to{background-size:650%}}@keyframes rainbow-text-simple-animation{0%{background-size:100%}80%{background-size:650%}to{background-size:650%}}.dice-container{grid-gap:1em;display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(2,1fr);margin-block:1em}.die-face{align-items:center;background-color:#fff;background-color:var(--clr-lighter);border-radius:5px;box-shadow:0 2px 2px rgba(0,0,0,.15);color:#2b283a;color:var(--crl-text-darker);cursor:pointer;display:flex;flex-direction:column;height:2.5em;justify-content:center;padding:1.2em;transition:all .1s ease-in-out;width:2.5em}.die-face:hover{box-shadow:0 2px 1px rgba(0,0,0,.09),0 4px 2px rgba(0,0,0,.09),0 8px 4px rgba(0,0,0,.09),0 16px 8px rgba(0,0,0,.09);-webkit-transform:scale(1.1);transform:scale(1.1)}.die-face.isHeld{background-color:#59e391;background-color:var(--clr-accent)}.roll-dice{background-color:#5035ff;background-color:var(--clr-button);border:none;border-radius:10px;box-shadow:0 2px 1px rgba(0,0,0,.09),0 4px 2px rgba(0,0,0,.09),0 8px 4px rgba(0,0,0,.09),0 16px 8px rgba(0,0,0,.09);color:#fff;color:var(--clr-lighter);cursor:pointer;font-family:Roboto,sans-serif;font-family:var(--ff-main);font-size:1rem;font-weight:700;letter-spacing:2px;padding:1em 3em;transition:all .1s ease-in-out}.roll-dice:focus-visible,.roll-dice:hover{box-shadow:0 2px 2px rgba(0,0,0,.15);-webkit-transform:scale(.95);transform:scale(.95)}.roll-dice:active{box-shadow:inset 5px 5px 10px -3px rgba(0,0,0,.7)}.stats-container{align-items:center;display:flex;font-size:1.1rem;gap:2em;justify-content:center;margin-top:1em;width:100%}.rolls-best,.time-best{align-items:center;color:#2b283a;color:var(--crl-text-darker);display:flex;flex-direction:column;font-weight:700}.rolls-best>p:last-child,.time-best>p:last-child{margin-block:.5em}.underline-animation{position:relative;text-decoration:none}.underline-animation:focus,.underline-animation:hover{color:#59e391;color:var(--clr-accent)}.underline-animation:before{background-color:#59e391;background-color:var(--clr-accent);bottom:-2px;content:"";display:block;height:2px;left:0;position:absolute;-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:bottom right;transform-origin:bottom right;transition:-webkit-transform .3s ease-in-out;transition:transform .3s ease-in-out;transition:transform .3s ease-in-out,-webkit-transform .3s ease-in-out;width:100%}.underline-animation:focus:before,.underline-animation:hover:before{-webkit-transform:scaleX(1);transform:scaleX(1);-webkit-transform-origin:bottom left;transform-origin:bottom left}.shadow-longer{box-shadow:0 2px 1px rgba(0,0,0,.09),0 4px 2px rgba(0,0,0,.09),0 8px 4px rgba(0,0,0,.09),0 16px 8px rgba(0,0,0,.09),0 32px 16px rgba(0,0,0,.09)}.shadow-shorter{box-shadow:0 1px 1px hsla(0,0%,100%,.11),0 2px 2px hsla(0,0%,100%,.11),0 4px 4px hsla(0,0%,100%,.11),0 6px 8px hsla(0,0%,100%,.11),0 8px 16px hsla(0,0%,100%,.11)}@media screen and (max-width:375px){.dice-container{grid-gap:1em;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(5,1fr);margin-block:1em}}
/*# sourceMappingURL=main.a2bce5ee.css.map*/