Тёплый луч над палитрой

Сцену рисует фрагментный шейдер на WebGL 2, DOM держит палитру команд и ряды клавиш. Слои считаются в экранных координатах: конус с мягкими краями (источник висит над кадром, поэтому у верхней кромки луч уже широкий), дрожание воздуха низкочастотным шумом, пылинки порогом по шуму, накал на кромке палитры, косые полосы вдоль конуса и тёплый разлив по палитре и клавишам. Цвет складывается ступенями (угли, янтарь, белое золото) и проходит тонмаппинг Рейнхарда: тёплый свет выгорает в белое быстрее холодного, и без сжатия сердцевина теряет цвет. Полотно лежит поверх сцены в режиме screen, поэтому свет ложится на поверхности, а не подсвечивает их снизу. Курсор двигает добавочное пятно прямо в шейдере, React при этом ничего не перерисовывает. Кадры считаются только когда компонент виден и вкладка активна, devicePixelRatio ограничен двойкой, prefers-reduced-motion оставляет один статичный кадр. Там, где WebGL 2 нет, сцену держат градиенты того же рисунка. Фон под лучом не пустой: по нему идёт сетка с точками, а поверх лежит невидимое поле символов — обрывки команд и клавиш. Оно проявляется только под лучом курсора: координаты уходят в CSS-переменные, поэтому проявление ничего не перерисовывает. Содержимое сцены задаётся через children.