"Ponto de partida" aleatório para animação de quadros-chave CSS

Eu tenho uma lista de caixas com uma imagem de fundo que rola verticalmente com:

@keyframes movie {
   0% { background-position: 50% 5%; }
   50% { background-position: 50% 95%; }
   0% { background-position: 50% 5%; }
}

.movie {
    animation: movie 50s linear infinite;
}

O "problema" é que, dessa maneira, todas as caixas têm o plano de fundo se movendo ao mesmo tempo.
Eu gostaria de ter um "ponto de partida aleatório" para que cada caixa tenha uma animação diferente.

Por exemplo, um plano de fundo está se movendo enquanto outro está subindo.

É possível com CSS puro? Não consigo encontrar uma maneira simples nem com Javascript ..

questionAnswers(4)

yourAnswerToTheQuestion