[Bug] @font-face accidental prefixing

Before

.class-selector
  @font-face
    font-family: 'icons'

  @keyframes inv-ajax-loader-spin
    0%
      transform: scale(1) rotate(0deg)

    50%
      transform: scale(1.2) rotate(180deg)

    100%
      transform: scale(1) rotate(360deg)

After

@font-face {
  .class-selector {
    font-family: "icons"; } }
@keyframes inv-ajax-loader-spin {
  0% {
    transform: scale(1) rotate(0deg); }
  50% {
    transform: scale(1.2) rotate(180deg); }
  100% {
    transform: scale(1) rotate(360deg); } }

/*# sourceMappingURL=icons.css.map */

Correct

@font-face {
    font-family: "icons"; } 
@keyframes inv-ajax-loader-spin {
  0% {
    transform: scale(1) rotate(0deg); }
  50% {
    transform: scale(1.2) rotate(180deg); }
  100% {
    transform: scale(1) rotate(360deg); } }

/*# sourceMappingURL=icons.css.map */

[nex3]

@martinoppitz If you’re willing to volunteer in perpetuity to maintain a list of all CSS at-rules that cannot contain style rules, as well as test cases for that logic and the code to implement it across the three major implementations, then we can add this feature. But I’m not willing to allocate my time to perpetually chasing CSS specs any more than necessary.

[deleonio]

Compare with less (https://lesstester.com)

.class-selector{
  @font-face{
    font-family: 'icons'}
  

  .kjh{
    display : none
  }}

After

@font-face {
  font-family: 'icons';
}
.class-selector .kjh {
  display: none;
}