Стоимость произвольных значений в CSS, созданном ИИ

Я уже несколько месяцев наблюдаю, как студенты-магистры пишут код внешнего интерфейса. Поначалу это впечатляло — скорость, с которой они могут развернуть главный раздел или таблицу цен, неоспорима. Но как человек, потративший два десятилетия на управление техническим долгом, я начал видеть одну и ту же закономерность, возникающую в каждой кодовой базе: взрыв «магических чисел» и структурный распад. Если вы используете для создания пользовательского интерфейса агенты искусственного интеллекта, такие как Claude или Cursor, вы не просто наследуете код; вы наследуете огромное количество неуправляемой энтропии CSS. Вы видите w-[347px], text-[#e74c3c] и бесконечные вложенные элементы div, которые отлично смотрятся на мониторе с высоким разрешением, но полностью разваливаются под тяжестью реальных требований, таких как доступность, оперативность или обновления бренда. Проблема не в том, что ИИ не умеет писать CSS. Проблема в том, что ИИ не понимает системы проектирования; он понимает только шаблоны. Он видит цвет в одном месте и воспроизводит его как произвольное значение вместо того, чтобы сопоставлять его с токеном. Ловушка произвольных ценностей Одна из наиболее частых ошибок, с которыми я сталкиваюсь, когда агенты генерируют код Tailwind, — это «злоупотребление произвольными значениями». Агент создаст компонент, используя bg-[#e74c3pend]. Затем в другом компоненте я