/* Единый источник цветовых/шрифтовых токенов — общая "тёмная по умолчанию + * светлая" тема (главная, Планировщик, Выплаты, Мои задачи, Вход, Админка, * Дизайн-система). Правка значения здесь применяется сразу везде — это и * есть техническая часть "дизайн-система в одном месте" (см. также * /design-system — человекочитаемый справочник этих же токенов). * * Калькулятор стоимости и Нормативы по часам используют свою (только * светлую) палитру осознанно — не подключают этот файл, значения другие. */ :root{ --bg:#14110d; --bg-grad: radial-gradient(1200px 600px at 90% -10%, rgba(255,71,45,0.10), transparent 60%), radial-gradient(900px 500px at -10% 110%, rgba(63,167,150,0.08), transparent 60%); --surface:#1c1812; --surface-2:#241f18; --surface-3:#2c2519; --border:#352c21; --text:#f3eee6; --text-muted:#a89c8a; --text-faint:#6f6657; --brand:#ff472d; --brand-soft:rgba(255,71,45,0.14); --brand-soft-2:rgba(255,71,45,0.28); --cool:#3fa796; --cool-soft:rgba(63,167,150,0.16); --warn:#f2a93b; --warn-soft:rgba(242,169,59,0.16); --good:#4f9d5c; --good-soft:rgba(79,157,92,0.16); --danger:#e0342a; --danger-soft:rgba(224,52,42,0.18); --radius:14px; --radius-sm:9px; --font-display:'Moderustic',sans-serif; --font-body:'Moderustic',sans-serif; --font-mono:'Moderustic',sans-serif; --shadow: 0 20px 60px -20px rgba(0,0,0,0.6); --on-brand:#ffffff; --status-1:#7c9eff; --status-2:#c98be0; --status-3:#5fb3d9; --status-4:#8fc563; --topbar-bg: rgba(20,17,13,0.88); --topbar-h: 71px; --thead-h: 37px; --agency-bg: #3c1f16; color-scheme: dark; } @media (prefers-color-scheme: light){ :root:not([data-theme="dark"]){ --bg:#f7f1e7; --bg-grad: radial-gradient(1200px 600px at 90% -10%, rgba(255,71,45,0.07), transparent 60%), radial-gradient(900px 500px at -10% 110%, rgba(31,138,120,0.06), transparent 60%); --surface:#ffffff; --surface-2:#f2ebde; --surface-3:#e9dfcc; --border:#e1d4ba; --text:#23190f; --text-muted:#6e6150; --text-faint:#998c76; --brand-soft:rgba(255,71,45,0.09); --brand-soft-2:rgba(255,71,45,0.20); --cool:#1c8d79; --cool-soft:rgba(28,141,121,0.11); --warn:#b06f10; --warn-soft:rgba(176,111,16,0.13); --good:#2f7d3f; --good-soft:rgba(47,125,63,0.14); --danger:#c22a1d; --danger-soft:rgba(194,42,29,0.14); --shadow: 0 20px 50px -22px rgba(60,40,20,0.22); --topbar-bg: rgba(247,241,231,0.88); --agency-bg: #ffe5e2; color-scheme: light; } } /* Ручной переключатель темы (кнопка ☀️/🌙 в Планировщике/Выплатах) — * тот же набор значений, что и в @media выше, но по явному атрибуту * data-theme на , а не по системной настройке ОС. */ :root[data-theme="dark"]{ --bg:#14110d; --surface:#1c1812; --surface-2:#241f18; --surface-3:#2c2519; --border:#352c21; --text:#f3eee6; --text-muted:#a89c8a; --text-faint:#6f6657; --cool:#3fa796; --cool-soft:rgba(63,167,150,0.16); --warn:#f2a93b; --warn-soft:rgba(242,169,59,0.16); --good:#4f9d5c; --good-soft:rgba(79,157,92,0.16); --danger:#e0342a; --danger-soft:rgba(224,52,42,0.18); --topbar-bg: rgba(20,17,13,0.88); --agency-bg: #3c1f16; color-scheme: dark; } :root[data-theme="light"]{ --bg:#f7f1e7; --bg-grad: radial-gradient(1200px 600px at 90% -10%, rgba(255,71,45,0.07), transparent 60%), radial-gradient(900px 500px at -10% 110%, rgba(31,138,120,0.06), transparent 60%); --surface:#ffffff; --surface-2:#f2ebde; --surface-3:#e9dfcc; --border:#e1d4ba; --text:#23190f; --text-muted:#6e6150; --text-faint:#998c76; --brand-soft:rgba(255,71,45,0.09); --brand-soft-2:rgba(255,71,45,0.20); --cool:#1c8d79; --cool-soft:rgba(28,141,121,0.11); --warn:#b06f10; --warn-soft:rgba(176,111,16,0.13); --good:#2f7d3f; --good-soft:rgba(47,125,63,0.14); --danger:#c22a1d; --danger-soft:rgba(194,42,29,0.14); --shadow: 0 20px 50px -22px rgba(60,40,20,0.22); --topbar-bg: rgba(247,241,231,0.88); --agency-bg: #ffe5e2; color-scheme: light; }