@property --c {
  syntax: '<color>';
  inherits: true;
  initial-value: #00f;
}

body {
  --c: #00f;
  overflow: hidden;
  transition: --c 1s; 

  &:hover {
    --c: #fff;
  }

  &::before {
    --p: #0000 calc(50% - 0.2vmin), var(--c) calc(50% - 0.1vmin) calc(50% + 0.1vmin), #0000 calc(50% + 0.2vmin);
    aspect-ratio: 1;
    background:
      linear-gradient(#f00 0 0) 40.5% 0 / 0.9vmin 100% no-repeat,
      linear-gradient(#f00 0 0) 59.5% 0 / 0.9vmin 100% no-repeat,
      linear-gradient(  0deg, var(--p)) -50vmin 0,
      linear-gradient(  8deg, var(--p)) -50vmin 0,
      linear-gradient( 16deg, var(--p)) -50vmin 0,
      linear-gradient( 23deg, var(--p)) -50vmin 0,
      linear-gradient( 30deg, var(--p)) -50vmin 0,
      linear-gradient( 36deg, var(--p)) -50vmin 0,
      linear-gradient( 42deg, var(--p)) -50vmin 0,
      linear-gradient( 47deg, var(--p)) -50vmin 0,
      linear-gradient( 52deg, var(--p)) -50vmin 0,
      linear-gradient( 56deg, var(--p)) -50vmin 0,
      linear-gradient( 60deg, var(--p)) -50vmin 0,
      linear-gradient( 63deg, var(--p)) -50vmin 0,
      linear-gradient( 66deg, var(--p)) -50vmin 0,
      linear-gradient( 69deg, var(--p)) -50vmin 0,
      linear-gradient( 71deg, var(--p)) -50vmin 0,
      linear-gradient( 73deg, var(--p)) -50vmin 0,
      linear-gradient( 75deg, var(--p)) -50vmin 0,
      linear-gradient( 77deg, var(--p)) -50vmin 0,
      linear-gradient( -8deg, var(--p)) -50vmin 0,
      linear-gradient(-16deg, var(--p)) -50vmin 0,
      linear-gradient(-23deg, var(--p)) -50vmin 0,
      linear-gradient(-30deg, var(--p)) -50vmin 0,
      linear-gradient(-36deg, var(--p)) -50vmin 0,
      linear-gradient(-42deg, var(--p)) -50vmin 0,
      linear-gradient(-47deg, var(--p)) -50vmin 0,
      linear-gradient(-52deg, var(--p)) -50vmin 0,
      linear-gradient(-56deg, var(--p)) -50vmin 0,
      linear-gradient(-60deg, var(--p)) -50vmin 0,
      linear-gradient(-63deg, var(--p)) -50vmin 0,
      linear-gradient(-66deg, var(--p)) -50vmin 0,
      linear-gradient(-69deg, var(--p)) -50vmin 0,
      linear-gradient(-71deg, var(--p)) -50vmin 0,
      linear-gradient(-73deg, var(--p)) -50vmin 0,
      linear-gradient(-75deg, var(--p)) -50vmin 0,
      linear-gradient(-77deg, var(--p)) -50vmin 0;
    content: "";
    left: 50%;
    position: absolute;    
    top: 50%;
    translate: -50% -50%;
    width: 100vmin;
  }
}