.fish-layer {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    overflow: hidden;
}

/* der Fisch */
.fish {
    position: absolute;
    width: 80px;
    height: auto;

    opacity: 0.5;

    pointer-events: none;

    will-change: transform;
}

/* Bewegung */
@keyframes swim {
    0% {
        transform: translateX(-120px) translateY(0px) rotate(-2deg) scaleX(1);
    }

    25% {
        transform: translateX(25vw) translateY(-20px) rotate(2deg) scaleX(1);
    }

    50% {
        transform: translateX(50vw) translateY(10px) rotate(-1deg) scaleX(1);
    }

    75% {
        transform: translateX(75vw) translateY(-15px) rotate(1deg) scaleX(1);
    }

    100% {
        transform: translateX(110vw) translateY(5px) rotate(0deg) scaleX(1);
    }
}