Why Utility Classes

Open the main.css of a two-year-old project. It's 4,200 lines long. In it you find .card, then .card--compact, then .card--compact-sidebar, and finally a .sidebar .card--compact { padding: 12px !important; } added late on a Friday night. Your task for the day is to reduce the inner padding of a card, on a single page. You don't know who else uses .card--compact: a full-text search turns up eleven templates, and you have no way to check other than opening every page on the site. So you leave it alone. You add a twelfth rule, with a slightly more specific name, and the file grows again.

This isn't a lack of discipline, it's a property of the language. CSS has global scope and no garbage collector: nothing tells you a rule is dead, nothing stops you from writing one that overrides another from a distance, and specificity turns every fix into an escalation. A stylesheet behaves like a global variable shared by every page, modifiable from anywhere, with no regression tests. After two years, the only operation you're certain won't break anything is adding. That is exactly why these files never shrink.