В чем разница между свойствами @media и @media screen

@media — это общее правило для применения стилей в зависимости от условий (ширина, высота, ориентация и т. д.). @media screen — частный случай, который применяет стили только для экранов (не для печати, speech и др.).

Пример:

/* Применяется для всех типов устройств */
@media (max-width: 768px) {
  body { font-size: 14px; }
}

/* Только для экранов */
@media screen and (max-width: 768px) {
  .header { display: none; }
}

Если не указать screen, стили могут примениться, например, при печати (@media print).