/* ========================================================================== ВНЕДРУМ · tokens.css — СГЕНЕРИРОВАНО из tokens.json (source of truth). Правь tokens.json, затем зеркаль сюда 1:1. Не хардкодь цвета в style.css. Тема: по умолчанию следует prefers-color-scheme; клик по знаку ставит .theme-dark / .theme-light на и перебивает системную (см. M2). Терминал всегда тёмный (собственные --term-* токены), тему не слушает. ========================================================================== */ :root { /* — палитра (светлая) — */ --paper: #EEF0F1; /* прохладная светлая «бумага» */ --ink: #15181C; /* холодный near-black — основной текст */ --line: #D3D7DA; /* hairline-бордеры, разделители */ --paper-2: #E6E9EB; /* подложки блоков и карточек */ --dim: #7A828A; /* приглушённый текст, плейсхолдеры */ --amber: #E8B341; /* ИСКРА — только терминал + пруфы CTA */ --ok: #6FB58A; /* результат в терминале */ /* — терминал (всегда тёмный, вне темы) — */ --term-bg: #15181C; --term-bar: #1B2027; --term-code: #C8CDD2; --term-comment: #6B7178; --term-title: #8A9099; /* — радиусы — */ --radius-btn: 6px; --radius-card: 10px; /* — шрифты — */ --font-sans: 'IBM Plex Sans', system-ui, sans-serif; --font-mono: 'IBM Plex Mono', ui-monospace, monospace; /* — движение — */ --ease: cubic-bezier(0.2, 0.8, 0.2, 1); color-scheme: light; } /* Тёмная тема как значение по умолчанию системы (если пользователь не форснул светлую) */ @media (prefers-color-scheme: dark) { :root:not(.theme-light) { --paper: #15181C; --ink: #EEF0F1; --line: #333A40; --paper-2: #1E242B; /* производное: подложка чуть светлее фона (нет в tokens.json) */ --dim: #8A9199; /* производное: dim светлее для контраста на тёмном */ color-scheme: dark; } } /* Явный выбор пользователя перебивает систему в обе стороны */ :root.theme-dark { --paper: #15181C; --ink: #EEF0F1; --line: #333A40; --paper-2: #1E242B; --dim: #8A9199; color-scheme: dark; } :root.theme-light { --paper: #EEF0F1; --ink: #15181C; --line: #D3D7DA; --paper-2: #E6E9EB; --dim: #7A828A; color-scheme: light; }