.flip-tile {
    perspective: 600px;
    aspect-ratio: 1/1;
    margin: -0.5px;
}
.flip-inner {
    width: 100%;
    height: 100%;
    position: relative;
    transform-style: preserve-3d;
    transition: transform 0.9s ease;
    transition-delay: var(--d);
}
.flip-inner.flipped {
    transform: rotateY(180deg);
}
.flip-front, .flip-back {
    position: absolute;
    inset: 0;
    backface-visibility: hidden;
    background-size: 500% 500%;
}
.flip-front {
    background-image: url('/images/martin-toth.png');
}
.flip-back {
    background-image: url('/images/martin-toth-prague.jpeg');
    transform: rotateY(180deg);
}

/* Column positions */
.flip-tile:nth-child(5n+1) .flip-front, .flip-tile:nth-child(5n+1) .flip-back { background-position-x: 0%; }
.flip-tile:nth-child(5n+2) .flip-front, .flip-tile:nth-child(5n+2) .flip-back { background-position-x: 25%; }
.flip-tile:nth-child(5n+3) .flip-front, .flip-tile:nth-child(5n+3) .flip-back { background-position-x: 50%; }
.flip-tile:nth-child(5n+4) .flip-front, .flip-tile:nth-child(5n+4) .flip-back { background-position-x: 75%; }
.flip-tile:nth-child(5n+5) .flip-front, .flip-tile:nth-child(5n+5) .flip-back { background-position-x: 100%; }

/* Row positions */
.flip-tile:nth-child(n+1):nth-child(-n+5) .flip-front, .flip-tile:nth-child(n+1):nth-child(-n+5) .flip-back { background-position-y: 0%; }
.flip-tile:nth-child(n+6):nth-child(-n+10) .flip-front, .flip-tile:nth-child(n+6):nth-child(-n+10) .flip-back { background-position-y: 25%; }
.flip-tile:nth-child(n+11):nth-child(-n+15) .flip-front, .flip-tile:nth-child(n+11):nth-child(-n+15) .flip-back { background-position-y: 50%; }
.flip-tile:nth-child(n+16):nth-child(-n+20) .flip-front, .flip-tile:nth-child(n+16):nth-child(-n+20) .flip-back { background-position-y: 75%; }
.flip-tile:nth-child(n+21):nth-child(-n+25) .flip-front, .flip-tile:nth-child(n+21):nth-child(-n+25) .flip-back { background-position-y: 100%; }