/* ────────────────────────────────────────────────────────────────────────── tokens.css — ДИЗАЙН-ТОКЕНЫ (единый «пульт» для цветов интерфейса). Фаза 0 рефакторинга стилей. Этот файл ПОКА чисто аддитивный: он только ОБЪЯВЛЯЕТ переменные, ничего ими не перекрашивая. Визуально приложение не меняется. Дальше (Фаза 2) захардкоженные hex в JS/HTML постепенно заменяются на var(--…), и тогда менять тему можно в одном месте. Значения подобраны под самые частые цвета, найденные аудитом (например #2c2c2c — 102 раза, #1e1e1e — 64, #3b82f6 — 25 и т.д.). ────────────────────────────────────────────────────────────────────────── */ :root { /* Бренд / акценты */ --c-brand: #3b82f6; /* основной синий (кнопки, ссылки) */ --c-brand-strong: #2563eb; /* насыщенный синий (hover/active) */ --c-indigo: #6366f1; /* индиго (плашка периода и т.п.) */ --c-success: #10b981; /* зелёный (верно/выполнено) */ --c-success-soft: #34d399; --c-danger: #ef4444; /* красный (ошибка/неверно) */ --c-danger-soft: #f43f5e; /* розово-красный */ --c-warn: #f59e0b; /* янтарный (предупреждение/акцент) */ --c-warn-strong: #ca8a04; --c-accent: #fde047; /* жёлтый акцент */ --c-purple: #8b5cf6; /* фиолетовый (задание №5) */ /* Поверхности */ --c-bg: #f7f7f8; /* фон страницы */ --c-card: #ffffff; /* фон карточек */ --c-card-2: #f1f5f9; /* вторичная поверхность */ --c-border: #e5e7eb; /* рамки */ --c-border-2: #d1d5db; /* рамки инпутов/чипов (сильнее) */ --c-border-soft: rgba(128,128,128,0.18); /* Текст */ --c-text: #111827; /* основной текст */ --c-text-soft: #374151; --c-muted: #9ca3af; /* приглушённый текст */ --c-muted-2: #6b7280; --c-muted-3: #94a3b8; /* Тени / радиусы (про запас, для будущей унификации) */ --radius-card: 1rem; --radius-pill: 999px; } /* Тёмная тема — переопределяем ТОЛЬКО токены (стратегия darkMode: class на ). */ .dark { --c-bg: #121212; --c-card: #1e1e1e; --c-card-2: #181818; --c-border: #2c2c2c; --c-border-2: #3f3f46; --c-border-soft: rgba(255,255,255,0.10); --c-text: #e5e7eb; --c-text-soft: #d1d5db; --c-muted: #94a3b8; --c-muted-2: #9ca3af; --c-muted-3: #64748b; }