WebKit FOUC when animation-play-state:paused→running

dabblet.css

/* WebKit FOUC when animation-play-state:paused→running */
/* that’s flash of unanimated content, or the element’s default state */ 

@keyframes runaway {
  0% {left: 5%;}
  to {left: 80%;}
}
.wrapper:hover .box {animation: runaway 2s ease-in-out infinite
 alternate;}
.box:hover {animation-play-state: paused;}

.wrapper {
  position: relative;
  height: 100%;
  padding: 100px 0 172px;
  background-color: #e9e9e9;
}
.box {
  position: absolute;
  left: 5%;
  width: 9em;
  border: 5px solid #999;
  border-radius: 5px;
  padding: .75em;
  text-align: center;
  background-color: #fff;
}

dabblet.html

<div class="wrapper">
<div class="box">hover me to pause</div>
</div>

settings.json

{"version":"1.1","settings":{"prefixfree":"1"},"view":[{"template":"r\nc","active":true,"seethrough":false},{"template":"r\nh","active":false,"seethrough":false},{"template":"r\nch","active":false,"seethrough":false}]}