Определение и назначение препроцессора.

В обычном CSS нету элементов программирования, но появились переменные и встроенные функции. В препроцессорах есть элементы программирования такие как переменные, списки, функции, миксины, циклы. Казалось бы зачем они вообще нужны в CSS... но препроцессоры это реально мощные инструменты, которые помогают разработчику. Вот пример есть стилевой блок состоящий из 15-50 строк кода, этот же фрагмент кода у тебя используется и в других частях ток небольшими изменениями значений, в чистом CSS тебе потребовалось бы копировать фрагмент кода и вставлять его, в препроцессорах всё наоборот, в SCSS есть штука под названием миксины это функции как в программировании, ты берешь этот код и заносишь в свой объявленный миксин, и указываешь какие параметры ему принимать, и если этот фрагмент кода понадобится тебе где-то ещё, тебе достаточно вызвать этот миксин и передать ему параметры и после компиляции, в чистом готовом CSS файле появится этот же кусок кода, но уже с измененными значениями. Также препроцессоры хороши по синтаксису написания кода. На разных статьях всякие умники могут написать, что препроцессоры не нужны, это полная чушь, препроцессоры это ДОБРО а не ЗЛО. Написанный код на препроцессорах будет скомпилирован в обычный CSS код который уже будет работать в браузерах, препроцессоры не оказывают никакое влияние на производительность в коде или на его рендеринг в браузерах. Я описал лишь малую часть возможности препроцессоров, для подробной информации лучше почитать тут https://webref.ru/layout/less https://webref.ru/layout/sass в качестве первого препроцессора можно взять less и практиковаться на нем, а дальше можно взяться за SASS.

Кратко, доступно, беспристрастно:
Препроцессоры CSS - это синтаксический сахар в чистом виде.

Используются они для генерации текста стилевых правил, набирать который вручную было бы дольше и мучительнее.

Ну вот есть файлы .css, а есть .scss, и он типа круче, с расширенными возможностями и синтаксисом, можно вложенности делать например и т. д.
Это если доступным языком.

https://www.youtube.com/watch?v=u1b1s2Wj24s