A animação CSS não funciona com "estouro: oculto"

Eu apreciaria se alguém pudesse me apontar na direção certa, dizendo-me o que estou fazendo de errado. Por favor, olhe para istoexemplo. Como você pode ver, estou tentando mover "div 2" para "div 1" quando o botão é clicado. Na verdade, funciona bem, a segunda div aparece na primeira div como esperado, mas, por algum motivo, o clique não aciona a animação CSS, o que deve dar ao segundo div um efeito de slide.

Eu reduzi isso a algo que tem a ver com o atributo 'estouro: oculto', porque a animação realmente funciona quando é removida do 'div 1', mas como você provavelmente descobriu que eu quero o segundo div para só fica visível quando está posicionado no primeiro div.

Por que a animação não funciona?

Estou usando o Chrome, OSX.

Desde já, obrigado!

/ Christofer

questionAnswers(2)

yourAnswerToTheQuestion