.flip-container{perspective:1200px;width:400px;margin:auto;transition:height .7s ease-in}.flip-card{width:100%;height:100%;transform-style:preserve-3d;transition:transform .7s ease-in-out;position:relative}.flip-card.flipped{transform:rotateY(180deg)}.flip-face{backface-visibility:hidden;background:#fff;border-radius:12px;position:absolute;inset:0;overflow:hidden;box-shadow:0 10px 30px #0000001a}.flip-face-inner{flex-direction:column;gap:16px;padding:24px;display:flex}.flip-front{transform:rotateY(0)}.flip-back{transform:rotateY(180deg)}div#root{width:100dvw;height:100dvh}