Как структуризировать классы в зависимости от конекста

В CSS классы лучше структурировать по методологии, например BEM (Block-Element-Modifier): ```css /* Блок */ .button {} /* Элемент блока */ .button__icon {} /* Модификатор */ .button--large {} ``` Для контекстных стилей можно: 1. Использовать атрибут `data-*` для контекста: ```css [data-theme="dark"] .button { background: #333; } ``` 2. Применять CSS-переменные для динамического изменения: ```css .button { background: var(--button-bg, #eee); } ``` 3. В компонентных фреймворках (React/Vue) - передавать пропсы: ```jsx ``` Главное - избегать слишком специфичных селекторов и поддерживать переиспользуемость.