Animation flickering on IOS Safari

Question

My animation is causing a flickering effect on Safari as you can see in the image and this does not happen on regular desktop chrome. This is the relevant scss:

.board {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  margin: 1.5 * 7 auto;
  gap: 1.5;
}

.card {
  position: relative;
  color: gray;
  user-select: none;
  height: 0;
  padding-top: 100%;
  cursor: pointer;
  
  
  &__icon-container {
    box-shadow: 0pt 3pt 6pt #00000029;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background: white;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    transform: rotateY(180deg);
    transition: 200ms transform ease-in-out;
    
    border-radius: 16px;
    overflow: hidden;
    
    &--chosen, &--found {
      transform: rotateY(0);
    }
    
    &--board-complete {
      background: green;
      transition: 300ms ease-in-out;
    }
  }
  
  &__icon {
    font-size: 40px !important;
    
    &--completed {
      color: white
    }
  }
  
  &__backface {
    box-shadow: 0pt 3pt 6pt #00000029;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: gray;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    transform: rotateY(0);
    transition: 200ms transform ease-in-out;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    
    border-radius: 16px;
    overflow: hidden;
    
    &--chosen, &--found {
      transform: rotateY(180deg);
    }
  }
}

as you can see i already tried adding -webkit-backface-visibility: hidden; to the different elements as suggested in this issue but it had no effect. I would love to know the reason behind this happening and what might be the possible solution. All the animation does is rotate a card by 180 degrees.