.ex-flip{perspective:1200px}.ex-card{box-shadow:8px 8px 0 #ff007f}.ex-flip-btn{cursor:pointer}.ex-tap{display:inline-flex}@media (hover:hover){.ex-tap{display:none}}.ex-flip-inner{position:relative;display:block;width:100%;transform-style:preserve-3d;transition:transform .5s ease}.ex-flip-inner.is-flipped{transform:rotateY(180deg)}@media (hover:hover){.ex-flip:hover .ex-flip-inner{transform:rotateY(180deg)}}.ex-face{position:absolute;inset:0;display:block;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}.ex-face-back{transform:rotateY(180deg)}.ex-flip-btn:focus-visible{outline:4px solid #000000;outline-offset:4px}.ex-face-back>:focus-visible{outline:4px solid #ff007f;outline-offset:-4px}.ex-flip:has(.ex-face-back :focus-visible) .ex-flip-inner{transform:rotateY(180deg)}@media (prefers-reduced-motion:reduce){.ex-flip-inner,.ex-flip-inner.is-flipped,.ex-flip:has(.ex-face-back :focus-visible) .ex-flip-inner,.ex-flip:hover .ex-flip-inner{transform:none;transition:opacity .2s ease}.ex-face-back{transform:none;opacity:0;transition:opacity .2s ease}.ex-flip-inner.is-flipped .ex-face-back,.ex-flip:has(.ex-face-back :focus-visible) .ex-face-back,.ex-flip:hover .ex-face-back{opacity:1}}