Что такое scoped styles во Vue и как они работают?

Во Vue scoped CSS преобразует селекторы и добавляет специальный атрибут элементам компонента, ограничивая область действия стилей.

Это не Shadow DOM: внешние стили всё ещё могут влиять на элементы. Корневой узел дочернего компонента может получить scoped-стили родителя, а для внутреннего содержимого дочерних компонентов используют :deep(). Псевдоселекторы :slotted() и :global() позволяют явно задать другие области действия.

Источник: vuejs.org.