SCSS - Как объединить @media запросы?

Есть такой миксин:

/* 
$property - Название свойства
$minValue - MIN размер свойства; 
$maxValue - MAX размер свойства; 
$sizeWidthPage - Минимальная ширина макета(страницы)
*/

@mixin dynamicProperty($property, $minValue, $maxValue, $sizeWidthPage) {
  #{$property}: $maxValue;
  @media (min-width: $sizeWidthPage + px) {
    #{$property}: $minValue + px;
  }
}

Вызов миксина:

.test1 {
  @include dynamicProperty('font-size', 15, 30, 960);
}
.test2 {
  @include dynamicProperty('width', 20, 25, 960);
}

При применении генерируется следующий CSS:

.test1 {
  font-size: 30;
}
@media (min-width: 320px) {
  .test1 {
    font-size: 15px;
 }
}

.test2 {
  width: 25;
}
@media (min-width: 320px) {
  .test2 {
    width: 20px;
 }
}

А хотелось бы, чтобы все похожие @media запросы в CSS объединялись так:

.test1 {
  font-size: 30;
}
.test2 {
  width: 25;
}

@media (min-width: 320px) {
  .test1 {
    font-size: 15px;
  }
  .test2 {
    width: 20px;
  }
}

Возможно ли такое реализовать только синтаксисом SCSS? Библиотеку для этого загружать особо не хочется.