/* HTML: <div class="loader"></div> */
.loader {
    height: 40px;
    aspect-ratio: 2;
    --c: no-repeat linear-gradient(#25b09b 0 0);
    background: var(--c), var(--c), var(--c), var(--c);
    background-size: 26% 50%;
    animation: l18 1s infinite cubic-bezier(0.5, 150, 0.5, -150);
}

@keyframes l18 {
    0% {
        background-position: calc(0*100%/3) 50%, calc(1*100%/3) 50%, calc(2*100%/3) 50%, calc(3*100%/3) 50%
    }

    100% {
        background-position: calc(0*100%/3) 51%, calc(1*100%/3) 50.5%, calc(2*100%/3) 49.5%, calc(3*100%/3) 49%
    }
}

.state-svg {
    background: url(//s1.hdslb.com/bfs/static/player/img/play.svg) 50% no-repeat;
    display: block;
    height: 64px;
    width: 64px;
}