Simple Sass @extends and % issue

%list {
  @include mixins.reset-list();

  &-navigation {
    display: none;

    @media (min-width: tokens.$bp-main-nav) {
      @include mixins.flex(row, center, center, 4);
    }
  }
}

.list {
  @extend %list;

  &-navigation {
    @extend %list-navigation;
  }
}