:root{--front-face: #EEEEFF;--front-face-content:#5AB46A;--back-face: #C5CDDE}.scene{perspective:600px}.card{width:100%;height:100%;position:relative;transition:transform .6s ease-in-out;transform-style:preserve-3d}.card img{width:60%;height:auto;margin:0;padding:0}.front-face-content{width:80%;height:80%;transform-style:preserve-3d;border:2px solid var(--front-face-content);margin:1em;transform:translateZ(50px);border-radius:10%}.front-face img{width:100%;transform:translateZ(150px)}.front-face,.back-face{text-align:center;color:#fff;position:absolute;height:100%;width:100%;backface-visibility:hidden;display:flex;align-items:center;justify-content:center;place-items:center;box-shadow:0 4px 8px #0003;border-radius:20px;transform-style:preserve-3d}.front-face{background-color:var(--front-face)}.back-face{background:var(--back-face);transform:rotateY(180deg)}.flipped{transform:rotateY(180deg)}.scene:hover{transform:scale(1.05);transition:transform .2s}body{margin:0;padding:0}.game-over{display:flex;align-items:center;justify-content:center;height:100vh}.game-over div h2{font-size:4rem;border:20px double black;padding:10px 1em}.game-over div{padding:1em 4em;display:flex;flex-direction:column}.game-over div p{margin:0}.game-over button{font-size:1em;padding:1em 2em}.loading-screen{height:100vh;display:flex;justify-content:center;align-items:center;animation:loading-animation 1s linear infinite}.loading-screen img{width:5em;height:auto}@keyframes loading-animation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@font-face{font-family:myFont;src:url(/assets/LuckiestGuy-Regular-D4vvJGjA.ttf)}body{background-color:#c5cdde;font-family:myFont}button{font-family:myFont}.card-container{display:grid;grid-template-columns:repeat(auto-fill,200px);grid-template-rows:250px;grid-auto-rows:250px;gap:3em}main{padding:1em}
