/* ========================================================================== Дизайн-система «ЭУ РАН» — токены (CSS-переменные) Источник правды: design/ui-kit.html. Значения ниже переносятся 1:1. Тема применяется на страницах с . Тёмная тема: авто по prefers-color-scheme + явное переключение data-theme. ========================================================================== */ :root{ --font-ui:"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif; --font-brand:Georgia,"Times New Roman",serif; --bg:#F3F6FB; --surface:#FFFFFF; --surface-2:#EDF2F9; --surface-3:#E4EBF4; --border:#DCE4EF; --border-strong:#C6D2E1; --text:#16202B; --text-2:#54637A; --text-3:#8593A6; --accent:#1E5FBF; --accent-hover:#1A54A8; --accent-press:#164A94; --accent-weak:#E7F0FC; --accent-weak-2:#D4E4FA; --on-accent:#FFFFFF; --ring:rgba(30,95,191,.35); --success:#1E8E4E; --success-weak:#E3F4EA; --success-border:#B7E0C6; --warning:#B0730B; --warning-weak:#FAF0DA; --warning-border:#EAD09A; --danger:#C43C3C; --danger-weak:#FBE7E7; --danger-border:#EEBEBE; --info:#1E5FBF; --info-weak:#E7F0FC; --info-border:#BFD8F5; --shadow-sm:0 1px 2px rgba(16,32,54,.06),0 1px 3px rgba(16,32,54,.05); --shadow-md:0 4px 12px rgba(16,32,54,.10),0 2px 4px rgba(16,32,54,.06); --shadow-lg:0 18px 48px rgba(16,32,54,.22),0 6px 16px rgba(16,32,54,.14); --radius-xs:6px; --radius-sm:8px; --radius:12px; --radius-lg:16px; --pill:999px; --topbar-h:60px; --sidebar-w:244px; --sidebar-w-collapsed:68px; color-scheme:light; } @media (prefers-color-scheme:dark){ :root{ --bg:#0E141C; --surface:#151E29; --surface-2:#1C2734; --surface-3:#243040; --border:#2A3646; --border-strong:#3A4A60; --text:#E8EEF6; --text-2:#A4B4C6; --text-3:#73859B; --accent:#5E9BEC; --accent-hover:#78ADF0; --accent-press:#4C8AE0; --accent-weak:#15304D; --accent-weak-2:#1D3E60; --on-accent:#08121D; --ring:rgba(94,155,236,.4); --success:#4CC47D; --success-weak:#12301F; --success-border:#255C3C; --warning:#E0A64B; --warning-weak:#352A12; --warning-border:#5B4620; --danger:#E86F6F; --danger-weak:#37191A; --danger-border:#5E3030; --info:#5E9BEC; --info-weak:#15304D; --info-border:#2C4E75; --shadow-sm:0 1px 2px rgba(0,0,0,.4); --shadow-md:0 6px 16px rgba(0,0,0,.5); --shadow-lg:0 20px 52px rgba(0,0,0,.6); color-scheme:dark; } } :root[data-theme="light"]{ color-scheme:light; --bg:#F3F6FB; --surface:#FFFFFF; --surface-2:#EDF2F9; --surface-3:#E4EBF4; --border:#DCE4EF; --border-strong:#C6D2E1; --text:#16202B; --text-2:#54637A; --text-3:#8593A6; --accent:#1E5FBF; --accent-hover:#1A54A8; --accent-press:#164A94; --accent-weak:#E7F0FC; --accent-weak-2:#D4E4FA; --on-accent:#FFFFFF; --ring:rgba(30,95,191,.35); --success:#1E8E4E; --success-weak:#E3F4EA; --success-border:#B7E0C6; --warning:#B0730B; --warning-weak:#FAF0DA; --warning-border:#EAD09A; --danger:#C43C3C; --danger-weak:#FBE7E7; --danger-border:#EEBEBE; --info:#1E5FBF; --info-weak:#E7F0FC; --info-border:#BFD8F5; --shadow-sm:0 1px 2px rgba(16,32,54,.06),0 1px 3px rgba(16,32,54,.05); --shadow-md:0 4px 12px rgba(16,32,54,.10),0 2px 4px rgba(16,32,54,.06); --shadow-lg:0 18px 48px rgba(16,32,54,.22),0 6px 16px rgba(16,32,54,.14); } :root[data-theme="dark"]{ color-scheme:dark; --bg:#0E141C; --surface:#151E29; --surface-2:#1C2734; --surface-3:#243040; --border:#2A3646; --border-strong:#3A4A60; --text:#E8EEF6; --text-2:#A4B4C6; --text-3:#73859B; --accent:#5E9BEC; --accent-hover:#78ADF0; --accent-press:#4C8AE0; --accent-weak:#15304D; --accent-weak-2:#1D3E60; --on-accent:#08121D; --ring:rgba(94,155,236,.4); --success:#4CC47D; --success-weak:#12301F; --success-border:#255C3C; --warning:#E0A64B; --warning-weak:#352A12; --warning-border:#5B4620; --danger:#E86F6F; --danger-weak:#37191A; --danger-border:#5E3030; --info:#5E9BEC; --info-weak:#15304D; --info-border:#2C4E75; --shadow-sm:0 1px 2px rgba(0,0,0,.4); --shadow-md:0 6px 16px rgba(0,0,0,.5); --shadow-lg:0 20px 52px rgba(0,0,0,.6); }