How to animate keyframes in SCSS without breaking the syntax?

Question

css

Goodnight. It is necessary to make the animation long enough in frames, I decided to do it on SCSS, but I ran into the fact that the variable next to % causes a syntax error.

@for $i from 100 to 33 {
  @keyframes backwheel {
    #{$i}% {
      background: radial-gradient(circle at center, transparent, rgba(0, 0, 0, 0.6186274509803921) #{$i} %);
      }
  }
}

The documentation says nothing about this.