.game{font-size:1.8rem;text-align:center;display:grid;grid-template-columns:1fr 1fr;padding:8rem 3rem;grid-row-gap:2rem;row-gap:2rem}.board{position:relative;grid-row:span 3;margin:0 auto;text-align:left;text-align:initial}.cta{font-family:"Nunito",-apple-system,cursive,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;font-size:1.2rem;font-weight:600;padding:1.8rem 4rem;text-transform:uppercase;cursor:pointer;border:none;background-color:#bffcfb;margin-top:2rem;border-radius:10px;box-shadow:0 4px 0 0 #002726}.cta:hover{background-color:#71e6e4}.instruction{font-size:1.5rem;text-align:left;color:#fff;width:100%;padding:0 2rem;margin-top:2rem}@media screen and (max-width:600px){.instruction{font-size:1.2rem;width:100%}.game{grid-template-columns:1fr}.desc{font-size:1.4rem;margin:0 auto 4rem}.cta{padding:1rem 2rem}.board{margin:4rem auto}}@media screen and (max-width:900px){.game{flex-direction:column;min-width:auto}.desc{margin:0 auto 4rem;min-width:60%}}.circle{width:6rem;height:6rem;border-radius:100%;cursor:pointer;box-shadow:0 0 5px .4px rgb(0 0 0);background-color:#d3fbd8}.row{display:flex;justify-content:center}.row--1>.quad-container:first-child>.counter{left:-6rem;transform:rotateX(180deg) rotate(-90deg)}.row--1>.quad-container:first-child>.clock{top:-6rem;left:0}.row--1>.quad-container:nth-child(2)>.counter{transform:rotateY(180deg);right:0;top:-6rem}.row--1>.quad-container:nth-child(2)>.clock{right:-6rem;transform:rotate(90deg)}.row--2>.quad-container:first-child>.counter{left:0;bottom:-6rem;transform:rotateX(-180deg)}.row--2>.quad-container:first-child>.clock{bottom:0;left:-6rem;transform:rotate(-90deg)}.row--2>.quad-container:nth-child(2)>.counter{right:-6rem;bottom:0;transform:rotate(90deg) rotateY(180deg)}.row--2>.quad-container:nth-child(2)>.clock{bottom:-6rem;right:0;transform:rotateX(180deg) rotateY(180deg)}.black{box-shadow:0 0 10px 2.4px #aed5eb,inset -1px -1px 21.2px 13.8px #000}.red{box-shadow:0 0 10px 2.4px #d98ea1,inset -2px -1px 21.2px 13.8px #d92525}img{position:absolute;width:4rem;cursor:pointer}.fade-in{opacity:1;transition:all .3s ease-in}.fade-out{opacity:0;visibility:hidden;transition:all .3s ease-out}.quad-container{position:relative;padding:.75rem;background-color:#591c21;border-radius:10px;border:1px solid #200508}.quad{padding:2rem;border-radius:10px;background-color:#8c1f28;box-shadow:0 0 3px 1px #000}.quad>.row:not(:last-child){padding-bottom:1rem}.row .circle:not(:last-child){margin-right:1rem}@media screen and (max-width:600px){.circle{width:3rem;height:3rem}.quad{padding:1rem}img{width:3rem}.row--1>.quad-container:first-child>.clock,.row--1>.quad-container:nth-child(2)>.counter{top:-4.5rem}.row--1>.quad-container:nth-child(2)>.clock,.row--2>.quad-container:nth-child(2)>.counter{right:-4.5rem}.row--2>.quad-container:first-child>.counter,.row--2>.quad-container:nth-child(2)>.clock{bottom:-4.5rem}.row--1>.quad-container:first-child>.counter,.row--2>.quad-container:first-child>.clock{left:-4.5rem}}.score{justify-self:center;display:grid;justify-items:center;grid-template-columns:1fr 1fr;width:60%;border:1px solid hsla(0,0%,100%,.1);padding:2rem;background-color:hsla(0,0%,100%,.1);border-radius:5px}.player{width:50%}.player h4{border-bottom:1px solid hsla(0,0%,100%,.7);padding-bottom:1rem}.player p{padding-top:1rem}.score .cta{grid-column:span 2}.status{color:#aed4eb;flex-basis:30%}.status h1{margin-bottom:1rem;text-transform:uppercase}.status .red{color:#b1111b;box-shadow:none}.status .black{color:#000;box-shadow:none}.winner-box{position:absolute;width:41.7rem;height:7rem;border-radius:100px;border:3px solid gold;z-index:1000}.horizontal.end{right:1rem}.horizontal.start{left:1rem}.vertical{transform:rotate(90deg);transform-origin:3.5rem 3.5rem}.vertical.end{top:1rem}.vertical.start{top:8.7rem}.cross-right{transform-origin:3.5rem 3.5rem;width:57rem}.cross-right.start{transform:rotate(45deg) translateX(1.5rem)}.cross-right.end{transform:rotate(45deg) translateX(11.5rem)}.cross-left{transform-origin:calc(100% - 3.5rem) 3.5rem;width:57rem;right:0}.cross-left.start{transform:rotate(-45deg) translateX(-1.5rem)}.cross-left.end{transform:rotate(-45deg) translateX(-11.5rem)}.vertical.start{top:4.7rem}@media screen and (max-width:600px){.winner-box{width:24rem;height:4rem}.cross-left.end{transform-origin:calc(100% - 2rem) 2rem;transform:rotate(-45deg) translateX(-5.5rem)}.cross-left.start{transform:rotate(-45deg) translateX(-.5rem);transform-origin:calc(100% - 2rem) 2rem}.cross-left,.cross-right{width:34rem}.cross-right.start{transform:rotate(45deg) translateX(.5rem);transform-origin:2rem 2rem}.cross-right.end{transform:rotate(45deg) translateX(5.5rem);transform-origin:2rem 2rem}.vertical{transform-origin:2rem 2rem}}body{font-family:"Nunito",-apple-system,cursive,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-image:url("../../static/media/blob-haikei (1).fe905418.svg");background-size:cover}*,:after,:before{margin:0;padding:0;box-sizing:inherit}html{font-size:62.5%;box-sizing:border-box}@media screen and (max-width:900px){html{font-size:50%}}@media screen and (max-width:1200px){html{font-size:55.25%}}.clock-rotate-enter-active{transform:rotate(90deg);transition:all .3s ease}.counter-rotate-enter-active{transform:rotate(-90deg);transition:all .3s ease}
/*# sourceMappingURL=main.31e5c1e3.chunk.css.map */