drop shadow chrome issue iframe

HTML

<div class="box"></div>
<div class="box transformed"></div>

CSS

.box {
  width: 100px; height: 100px; background: #ccc;
  filter: drop-shadow(rgb(0, 0, 0) 5px 5px 20px);
  position: absolute;
}

.transformed {
  transform: matrix(1, 0, 0, 1, 118, 302);
  -webkit-backface-visibility: hidden;
}