@keyframes shake{10%,90%{transform:translate3d(-1px,0,0)}20%,80%{transform:translate3d(2px,0,0)}30%,50%,70%{transform:translate3d(-4px,0,0)}40%,60%{transform:translate3d(4px,0,0)}}@keyframes bounce-tile{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}@keyframes flip-green{0%{transform:rotateX(0);border-color:#787c7e}45%{transform:rotateX(90deg);border-color:#787c7e}55%{transform:rotateX(90deg);background:#12B980;border:none;color:#fff}to{transform:rotateX(0);background:#12B980;border:none;color:#fff}}@keyframes flip-yellow{0%{transform:rotateX(0);border-color:#787c7e}45%{transform:rotateX(90deg);border-color:#787c7e}55%{transform:rotateX(90deg);background:#FBBF23;border:none;color:#1f2937}to{transform:rotateX(0);background:#FBBF23;border:none;color:#1f2937}}@keyframes flip-grey{0%{transform:rotateX(0);border-color:#787c7e}45%{transform:rotateX(90deg);border-color:#787c7e}55%{transform:rotateX(90deg);background:#9CA3AF;border:none;color:#fff}to{transform:rotateX(0);background:#9CA3AF;border:none;color:#fff}}@keyframes flip-blue{0%{transform:rotateX(0);border-color:#787c7e}45%{transform:rotateX(90deg);border-color:#787c7e}55%{transform:rotateX(90deg);background:#4b6bfc;border:none;color:#fff}to{transform:rotateX(0);background:#4b6bfc;border:none;color:#fff}}@keyframes flip-yellow-blue{0%{transform:rotateX(0);border-color:#787c7e}45%{transform:rotateX(90deg);border-color:#787c7e}55%{transform:rotateX(90deg);background:linear-gradient(45deg,#FBBF23 50%,#4b6bfc 50%);border:none;color:#fff;text-shadow:0 1px 2px rgb(0 0 0 / .7)}to{transform:rotateX(0);background:linear-gradient(45deg,#FBBF23 50%,#4b6bfc 50%);border:none;color:#fff;text-shadow:0 1px 2px rgb(0 0 0 / .7)}}.animate-shake{animation:shake .5s ease forwards}.animate-bounce-tile{animation:bounce-tile .2s ease-in-out forwards}.animate-flip-green{animation:flip-green .5s ease forwards}.animate-flip-yellow{animation:flip-yellow .5s ease forwards}.animate-flip-grey{animation:flip-grey .5s ease forwards}.animate-flip-blue{animation:flip-blue .5s ease forwards}.animate-flip-yellow-blue{animation:flip-yellow-blue .5s ease forwards}.tile{width:var(--tile-w, 107px);height:var(--tile-h, 107px);display:flex;justify-content:center;align-items:center;border:2px solid #787c7e;text-align:center;font-weight:700;font-size:var(--tile-font, 1.5rem);line-height:1;user-select:none;box-sizing:border-box}.tile-tutorial{width:min(3.75rem,calc((100vw - 4rem)/5));height:min(3.75rem,calc((100vw - 4rem)/5));font-size:.95rem}.tile-legend{width:1.75rem;height:1.75rem;flex-shrink:0}.tile-solution{width:100%;height:3rem;font-size:clamp(.8rem,4vw,1.125rem)}@media (min-width: 640px){.tile-solution{height:3.5rem}}@media (prefers-reduced-motion: reduce){.animate-shake,.animate-bounce-tile{animation:none}[class*=animate-flip-]{animation-duration:.01s;animation-delay:0s!important}}