- Карточки: #e8f0ec (светло-зелёный) / #0d1a16 (тёмный) — чётко виден на Panel
- Внутренние блоки: #ffffff / #142822 — контраст с карточкой
- Название города: #10211b / #ecf5f2 — тёмный/светлый, жирный
- Все цвета заданы через CSS классы с [data-theme=dark] — без var()
- Toggle: #22c55e / #c8d8d2 — виден в обеих темах
- Карточки профиля: accent-soft (зелёный оттенок) — виден на Panel
- Внутренние блоки: surface-strong (непрозрачный) — контраст с карточкой
- Инпуты: color-base — отличается от карточек
- Все цвета через CSS variables — работают в обеих темах
- Никаких Tailwind классов с var() которые могут не разрешиться
- Внешние карточки: --color-surface (полупрозрачный, виден на фоне)
- Внутренние блоки: --color-surface-strong (непрозрачный, контраст)
- Inputs/select: --color-base (отличается от карточек)
- Option элементы: явный bg + color для тёмной темы
- Светлая: карточки голубовато-зелёные, внутри — белые блоки
- Тёмная: карточки чуть светлее фона, внутри — ещё светлее
- bg-[var(--color-surface-strong)] вместо --color-bg внутри карточек
- Карточки профилей: --color-surface-strong, вложенные блоки: --color-surface
- Текст всегда var(--color-text) — виден в светлой и тёмной теме
- Toggle: компактнее (h-5 w-10)
- Выравнивание: flex-wrap, gap, border-t для разделения секций
- SMS ON/OFF badge вместо toggle в строке заголовка
root