Por que classes utilitárias

Abra o main.css de um projeto com dois anos de vida. Ele tem 4.200 linhas. Lá você encontra .card, depois .card--compact, depois .card--compact-sidebar e, por fim, um .sidebar .card--compact { padding: 12px !important; } adicionado numa sexta-feira à noite. Sua tarefa do dia é reduzir o padding interno de um card, em uma única página. Você não sabe quem usa .card--compact em outros lugares: a busca em texto completo retorna onze templates, e você não tem como verificar a não ser abrindo todas as páginas do site. Então você não mexe nele. Você adiciona uma décima segunda regra, com um nome um pouco mais específico, e o arquivo cresce ainda mais.

Isso não é falta de disciplina, é uma propriedade da linguagem. O CSS tem escopo global e nenhum coletor de lixo: nada avisa que uma regra está morta, nada impede você de escrever uma que sobrescreva outra à distância, e a especificidade transforma cada correção numa escalada. Uma folha de estilo se comporta como uma variável global compartilhada por todas as páginas, modificável de qualquer lugar, sem teste de regressão. Depois de dois anos, a única operação que você tem certeza de que não vai quebrar nada é a adição. É exatamente por isso que esses arquivos nunca encolhem.