Styling direct children within a @supports rule, triggers a linting rule incorrectly

[peeke]

Targeting direct children within an @supports rule, triggers the following linting error:

missing `display: grid;`
`grid-area` can only be used when the containing root rule has `display: grid;` - add `display: grid;` to the containing root rule or, if this is caused by a media query that overrides `display: grid;`, use `grid: unset`stylelint(kaliber/parent-child-policy)

Snippet: this incorrectly raises the linting error

.component {
  @supports (display: grid) {
    display: grid;
    grid-template-areas: 'content';

    & > .content {
      grid-area: content;
    }
  }
}

The following snippet doesn't raise the error (isn't a desirable situation of course, but it might provide a hint as to where things go wrong):

.component {
  @supports (display: grid) {
    display: grid;
    grid-template-areas: 'content';

    & > .content {
      @supports (display: grid) {
        grid-area: content;
      }
    }
  }
}