/* ═══════════════════════════════════════════════════════════════ PERF · СЛАБЫЕ УСТРОЙСТВА (html.low-end) Гасит дорогой `backdrop-filter: blur()` — один из главных тормозов GPU на бюджетных Android (≈187 вхождений в 32 CSS-файлах). Класс .low-end ставит ранний синхронный скрипт в index.html (navigator.hardwareConcurrency <= 4 ИЛИ deviceMemory <= 4) ещё до первой отрисовки. См. memory/project_low_end_animations.md. Приём тот же, что уже обкатан на мобиле (responsive-mobile.css, медиа ≤768px): убрать блюр и сделать «стеклянные» поверхности СПЛОШНЫМИ, подмешивая белый в сплошной --bg темы. Здесь — без привязки к ширине экрана: слабым может быть и планшет/ноут, где ещё виден десктопный шелл (топбар + сайдбар), который мобила прячет. Файл подключён в index.html ПОСЛЕ всех тем/компонентов и ПЕРЕД responsive-mobile.css — чтобы перебить тему, но уступить мобиле. ═══════════════════════════════════════════════════════════════ */ /* 1 · Полностью убираем backdrop-filter везде. Это и есть цель — снять нагрузку с GPU; пункты ниже лишь возвращают читаемость поверхностям, которые держались на блюре. */ html.low-end *, html.low-end *::before, html.low-end *::after { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } /* 2 · Полупрозрачные дизайн-токены → сплошные. Без блюра blur-стекло теряет контраст; пересчитываем поверхности в непрозрачные цвета поверх сплошного --bg (он сплошной во всех темах, включая glass/gold). Так панели выглядят матовыми — тот же эффект, что давал backdrop-filter, но без рекомпозиции каждый кадр. Заодно solid-фон получают inputs/select (reset.css → var(--bg3)). */ html.low-end body { --surface: color-mix(in srgb, #fff 9%, var(--bg)) !important; --surface2: color-mix(in srgb, #fff 15%, var(--bg)) !important; --surface3: color-mix(in srgb, #fff 22%, var(--bg)) !important; --bg2: color-mix(in srgb, #fff 6%, var(--bg)) !important; --bg3: color-mix(in srgb, #fff 10%, var(--bg)) !important; } /* 3 · Шелл получает СПЛОШНОЙ фон. Пользовательские обои (body background-image, js/settings.js) и «стекло» glass/gold без блюра превратились бы в пёструю подложку под полупрозрачными панелями (.page прозрачна на ~97%). Кладём контент на сплошной цвет — текст и карточки остаются читаемыми. (Тот же шаг, что .main-area{background:var(--bg)} на мобиле.) */ html.low-end .main-area { background: var(--bg) !important; } /* 4 · Топбар и сайдбар в темах заданы хардкодным rgba мимо токенов (.theme-night .topbar{background:rgba(0,0,0,.35)} и т.п.) и держались на блюре. Возвращаем их на сплошной --bg2 (пересчитан в п.2). */ html.low-end .topbar, html.low-end .sidebar { background: var(--bg2) !important; } /* 5 · Экран входа — критичный кейс (с него и началась жалоба на лаги). .login-card всего 28% непрозрачности и держится на блюре поверх яркого WebGL-вихря. Без блюра форма легла бы на пёстрый фон — делаем карточку сплошной. Берём СПЛОШНОЙ --bg3 (а не фикс. тёмный цвет): текст карточки наследует var(--text), а пара --text/--bg3 контрастна в каждой теме (на тёмных — фирменный тёмно-синий #0f172a, на светлых — светлая поверхность с тёмным текстом). Фикс. тёмный фон давал бы тёмный текст на тёмном на светлых темах. */ html.low-end .login-card { background: var(--bg3) !important; }