.tile{width:3.5rem;height:4rem;@media (max-width:768px){width:14vw;height:15vw}position:relative;transform-style:preserve-3d;transition:transform .6s ease-in-out}.tile .back,.tile .front{position:absolute;width:100%;height:100%;backface-visibility:hidden;display:grid;place-content:center;border-radius:.375rem;border:1px solid black}.tile .front{background-color:rgb(243 244 246);transform:rotateX(0deg)}.tile .back,.tile.flip{transform:rotateX(180deg)}.tile .back.correct{color:white;background-color:#22c55e}.tile .back.present{color:white;background-color:#eab308}.tile .back.incorrect{color:white;background-color:#1d1f23}.tile .back.empty{background-color:rgb(243 244 246)}.tile .letter{font-size:1.5rem;font-weight:700;color:black}.tile .back .letter{color:white}