<div role="img" aria-label="Flag of Taiwan" class="flag taiwan"></div>

.flag.taiwan {
  aspect-ratio: 3 / 2;
  position: relative;
  background: linear-gradient(rgb(19, 53, 129) 0 0) 0 0 / 50% 50% no-repeat,
    rgb(205, 44, 36);

  &::before {
    content: "";
    position: absolute;
    top: 14.375%;
    left: 17.92%;
    width: calc(17 / 120 * 100%);
    height: calc(17 / 80 * 100%);
    background: radial-gradient(
      circle,
      white 62.3917%,
      rgb(19, 53, 129) 62.3917%
    );
    border-radius: 50%;
    z-index: 2;
  }
  &::after {
    content: "";
    position: absolute;
    top: 6.25%;
    left: 12.5%;
    width: 25%;
    height: calc(3 / 8 * 100%);
    background: white;
    clip-path: polygon(
      50% 0%,
      56.6987% 25%,
      75% 6.6987%,
      68.3013% 31.6987%,
      93.3013% 25%,
      75% 43.3013%,
      100% 50%,
      75% 56.6987%,
      93.3013% 75%,
      68.3013% 68.3013%,
      75% 93.3013%,
      56.6987% 75%,
      50% 100%,
      43.3013% 75%,
      25% 93.3013%,
      31.6987% 68.3013%,
      6.6983% 75%,
      25% 56.6987%,
      0% 50%,
      25% 43.3013%,
      6.6983% 25%,
      31.6987% 31.6987%,
      25% 6.6983%,
      43.3013% 25%
    );
  }
}