# Итог: тёмная тема UI (изменение 038)
План: `PLAN.md` (с разделом доработки по проверке пользователя). У UI появилась тёмная тема. По умолчанию тема следует настройке ОС и браузера (`prefers-color-scheme`),
её можно переключить пиктограммой в шапке: авто / светлая / тёмная. Выбор хранится в браузере (`localStorage["ipam.theme"]`).
## Что сделано
| Файл | Изменение |
|---|---|
| `web/styles.css` | Все цвета — CSS-переменные в `:root`, светлые значения прежние. Тёмная палитра в двух одинаковых блоках: `@media (prefers-color-scheme: dark){:root:not([data-theme="light"])}` для режима «авто» и `:root[data-theme="dark"]` для принудительной тёмной; `color-scheme`. Контраст — WCAG AA; в тёмной теме у основных кнопок тёмный текст на светло-синем фоне (белый дал бы ≈2.7:1) |
| `web/theme.js` (новый) | Синхронно в `` до CSS ставит `data-theme` по сохранённому выбору — без вспышки светлой темы. Отдельный файл, так как CSP `default-src 'self'` запрещает инлайн-скрипты; CSP не менялся |
| `web/index.html` | ``, подключение `theme.js` |
| `web/app.js` | Цвета (`utilColor`, полосы загрузки, инлайн-стили, иконка логотипа) — через токены. Кнопка-пиктограмма темы в шапке слева от логина (солнце / луна / монитор) с выпадающим списком «Авто (как в системе) / Светлая / Тёмная». QR 2FA — на белой подложке (`.qr-frame`) ради сканируемости |
| `README.md` | «Интерфейс» — тёмная тема и переключатель; строка 038 в истории |
## Доработка по проверке пользователя
Сначала переключатель был пунктами «Тема: …» в меню логина. По замечанию пользователя вынесен в отдельную пиктограмму на панели шапки;
в меню пользователя остались «Сменить пароль», «Двухфакторная аутентификация», «Выйти».
## Проверки
- Светлая тема не изменилась: во всех 49 объявлениях с цветом прежнего `styles.css` после подстановки светлых токенов значения совпадают (скриптовое сравнение).
- Литеральные цвета вне токенов:
- `.qr-frame` (белый) — QR 2FA;
- стрелка `