*{margin:0;padding:0}#root{background-color:#000}.boardContainer{display:grid;grid-row:2 / 3;height:90dvh;width:100dvw;overflow-y:scroll;scrollbar-width:none;align-items:center;justify-content:center}.board{width:min(100dvw,1200px);height:min-content;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));place-items:center}.card{position:relative;cursor:pointer;background-color:transparent;width:200px;height:300px;margin:15px;transition-duration:1s;transform-style:preserve-3d;border-radius:.33rem;border:1px solid white}.card:hover{border:1px solid white;box-shadow:0 0 10px #fff;transform:scale(1.05)}.front,.back{transition-duration:inherit;width:100%;height:100%;position:absolute;border-radius:.5rem;backface-visibility:hidden}.back{transform:rotateY(180deg)}.scoreCard{display:flex;font-size:1.5rem;width:90%;align-items:center;justify-content:center;color:#fff;flex-direction:column}.scoreCard hr{width:90%}#root{width:100dvw;height:100dvh;display:grid;place-items:center;grid-template-rows:10dvh 90dvh;position:relative}#introComponent{position:absolute;color:#fff}@keyframes makeInvisible{0%{opacity:1}to{opacity:0}}@keyframes makeVisible{0%{opacity:0}to{opacity:1}}@keyframes flipFront{0%{transform:rotateY(180deg)}to{transform:rotateY(0)}}@keyframes flipBack{0%{transform:rotateY(0)}to{transform:rotateY(180deg)}}.hide{animation-name:makeInvisible;animation-duration:.75s;animation-fill-mode:forwards}.reveal{animation-name:makeVisible;animation-duration:.75s;animation-fill-mode:forwards}.rotateReveal{animation-name:flipFront;animation-duration:1s;animation-fill-mode:forwards}.rotateHide{animation-name:flipBack;animation-duration:1s;animation-fill-mode:forwards}.overlay{width:100%;height:100%;display:grid;place-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:9;position:absolute;transition-duration:.5s}.overlay .overlayContent{color:#fff;display:grid;place-items:center;transition-duration:inherit}.overlay .overlayContent h1{-webkit-text-stroke:2px black;letter-spacing:2px;font-size:4rem}.overlay .overlayContent>*{margin:10px;text-align:center}.overlay button{transition-duration:inherit;padding:1rem;border-radius:1rem;z-index:10;outline:none;border:1px solid black}.overlay button:hover{box-shadow:0 0 10px red,0 0 10px 10px #000}.overlay button:focus{outline:none}