.flip-wrapper{perspective:1000px;width:100%;max-width:320px;height:3.5rem;margin:0 auto;font-size:2.5rem;font-weight:700;text-align:center;color:var(--foreground);line-height:3.25rem}.flip-card{position:relative;transform-style:preserve-3d}.flip-card,.greeting{width:100%;height:100%}.greeting{position:absolute;backface-visibility:hidden;display:flex;align-items:center;justify-content:center}.flip,.flip-card,.greeting{background:transparent;box-shadow:none!important}.flip{position:absolute;width:100%;height:100%;backface-visibility:hidden;display:flex;align-items:center;justify-content:center}.flip-top{transform-origin:bottom;animation:flipTop .3s ease-in forwards;z-index:2}.flip-bottom,.flip-top{box-shadow:inset 0 -2px 5px rgba(0,0,0,.3)}.flip-bottom{transform-origin:top;transform:rotateX(90deg);animation:flipBottom .3s ease-out .3s forwards;z-index:1}@keyframes flipTop{0%{transform:rotateX(0deg)}to{transform:rotateX(-90deg)}}@keyframes flipBottom{0%{transform:rotateX(90deg)}to{transform:rotateX(0deg)}}.flip-wrapper{opacity:0;animation:fadeIn 1s ease-out forwards;animation-delay:.5s}@keyframes fadeIn{to{opacity:1}}