h1{font-family:Pacifico,cursive;font-size:2.5rem;color:#2e8b57}.wrapper{width:100vw;height:100vh;display:grid;justify-content:center;margin:0;background:linear-gradient(to bottom,#b4ec51,#56ab2f)}.cards{display:grid;grid-template-columns:repeat(4,200px);grid-template-rows:repeat(3,200px);gap:1em}.cards.hyperspace{animation:hyperspaceTwirl 3s ease-in forwards}@keyframes hyperspaceTwirl{0%{transform:scale(1) rotate(0) translateZ(0);opacity:1}50%{transform:scale(1.2) rotate(360deg);opacity:.7}to{transform:scale(0) rotate(1440deg) translateZ(-1000px);opacity:0}}.flip-card{width:200px;height:200px;perspective:1000px}.flip-card-inner{position:relative;width:100%;height:100%;transition:transform .6s ease-in-out;transform-style:preserve-3d}.flip-card-inner.flipped{transform:rotateY(180deg)}.flip-card-front,.flip-card-back{position:absolute;width:100%;height:100%;backface-visibility:hidden}.flip-card-front{background:#222;cursor:pointer;background-color:#add8e6;border-radius:1em;background:linear-gradient(to bottom,peru,#8b4513,#3e1f0f)}.flip-card-back{transform:rotateY(180deg);border-radius:1em}.flip-card-back img{width:200px;height:200px;object-fit:cover;border-radius:1em}