[iOS/Safari15.5]border displayed in <video>tag

I have develep web application for iOS/Safari. But, I'm having trouble with the video tag.

When I use the video tag, a border is displayed around the video. And when I put this CSS, it almost disappeared, but only the iOS / Safari 15.5 version did not disappear.

• filter: drop-shadow(0px 0px rgba(0,0,0,0));

Does anyone know how to deal with this trouble?

html.

<video id="player" style="display:none;" src="XXXXXXX" autoplay mutedplaysinline poster="YYYYYY">
</video>

javascript.

var player = $('#player');
player.show();
player.addEventListener('load', function(event) {
    player.play();
});

css.

#player {
  ...
  -webkit-filter: drop-shadow(0px 0px rgba(0, 0, 0, 0));
          filter: drop-shadow(0px 0px rgba(0, 0, 0, 0));
  outline: none;
  border: none;
}

Maybe border displayed between show() - load().