uix-aperture-animation {
    .blade, .aperture img, g {
        will-change: transform, opacity;
        transform-style: preserve-3d;
    }
    
    @media (max-aspect-ratio: 1) {
        .aperture {
            height: 100vh;
            width: 100vh;
            display: flex;
            overflow-x: hidden;
            align-items: center;
            justify-content: center;
        }
        svg {
            height: 100vh;
            width: 100vh;
            overflow: clip;
            aspect-ratio: 1;
            position: relative;
            left: o;
            top: 0;
            align-content: center;
            align-self: center;
        }
    }
    @media (min-aspect-ratio: 1) {
        .aperture {
            width: 100vw;
            height: 100vw;
            display: flex;
            overflow-y: hidden;
            align-items: center;
            justify-content: center;
        }
    
        svg {
            width: 100vw;
            height: 100vw;
            overflow: clip;
            aspect-ratio: 1;
            position: relative;
            left: o;
            top: 0;
            align-content: center;
            align-self: center;
        }
    }
    
    .blade {
        filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0.8));
        rotate: 32deg;
        will-change: transform;
    }
    
    .aperture img {
        position: absolute;
        flex: 1;
        width: 30vw;
        height: 30vw;
    }
    
    g {
        transform-origin: 146px 146px;
        will-change: transform;
    }
    
    g:nth-child(1) {
        --angle: 0deg;
        animation-delay: 0s;
    }
    g:nth-child(2) {
        --angle: 40deg;
        animation-delay: 0s;
    }
    g:nth-child(3) {
        --angle: 80deg;
        animation-delay: 0s;
    }
    g:nth-child(4) {
        --angle: 120deg;
        animation-delay: 0s;
    }
    g:nth-child(5) {
        --angle: 160deg;
        animation-delay: 0s;
    }
    g:nth-child(6) {
        --angle: 200deg;
        animation-delay: 0s;
    }
    g:nth-child(7) {
        --angle: 240deg;
        animation-delay: 0s;
    }
    g:nth-child(8) {
        --angle: 280deg;
        animation-delay: 0s;
    }
    g:nth-child(9) {
        --angle: 320deg;
        animation-delay: 0s;
    }
    
}