/* СОБИРАЕТСЯ tokens.py. Руками не править. */ @font-face{font-family:Unbounded;src:url(../fonts/Unbounded-600.woff2) format('woff2');font-weight:600;font-display:block} @font-face{font-family:Onest;src:url(../fonts/Onest-400.woff2) format('woff2');font-weight:400;font-display:swap} @font-face{font-family:Onest;src:url(../fonts/Onest-600.woff2) format('woff2');font-weight:600;font-display:swap} @font-face{font-family:JBM;src:url(../fonts/JBMono-400.woff2) format('woff2');font-weight:400;font-display:swap} @font-face{font-family:JBM;src:url(../fonts/JBMono-600.woff2) format('woff2');font-weight:600;font-display:swap} @font-face{font-family:Spectral;src:url(../fonts/Spectral-600.woff2) format('woff2');font-weight:400 700;font-display:swap} @font-face{font-family:Plex;src:url(../fonts/Plex-400.woff2) format('woff2');font-weight:400;font-display:swap} @font-face{font-family:Plex;src:url(../fonts/Plex-600.woff2) format('woff2');font-weight:600 800;font-display:swap} :root{ --ink:#0F1411; --paper:#F6F4EF; --accent:#FF3B1F; --rail:64px; --pad:48px; --s1:6px; --s2:12px; --s3:18px; --s4:26px; --s5:36px; --s6:48px; --s7:72px; --hair:1px; --tap:44px; color-scheme:light; --rail-bg:#F6F4EF; --rail-fg:#0F1411; --rail-rule:#C6C9C5; --sel-bg:#FF3B1F; --sel-fg:#0F1411; --a-bg:#F6F4EF; --a-fg:#0F1411; --a-fg2:#3A403D; --a-fg3:#5C6360; --a-rule:#C6C9C5; --a-rule2:#0F1411; --a-lit:rgba(15,20,17,.055); --a-well:#EDEAE3; --b-bg:#0F1411; --b-fg:#F6F4EF; --b-fg2:#CDD2CF; --b-fg3:#9AA39F; --b-rule:#39403C; --b-rule2:#6B7370; --b-lit:rgba(255,255,255,.062); --b-well:#161C18; --a-accent-text:#0F1411; --b-accent-text:#FF3B1F; --sheet-shadow:0 26px 60px -22px rgba(15,20,17,.42),0 2px 6px rgba(15,20,17,.10); } [data-theme="dark"]{ color-scheme:dark; --rail-bg:#0B0E0C; --rail-fg:#F1EEE7; --rail-rule:#2C3330; --sel-bg:#FF3B1F; --sel-fg:#0F1411; --a-bg:#0F1411; --a-fg:#F1EEE7; --a-fg2:#CBD1CD; --a-fg3:#9AA39F; --a-rule:#333B37; --a-rule2:#6B7370; --a-lit:rgba(255,255,255,.058); --a-well:#161C18; --b-bg:#070908; --b-fg:#F1EEE7; --b-fg2:#C7CDC9; --b-fg3:#96A09B; --b-rule:#282E2B; --b-rule2:#5E6663; --b-lit:rgba(255,255,255,.05); --b-well:#101512; --a-accent-text:#FF3B1F; --b-accent-text:#FF3B1F; --sheet-shadow:0 30px 70px -20px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.06); } /* Первый заход и работа без JS: слушаем системную тему. Как только пользователь нажал переключатель, на появляется data-theme и решает уже он. */ @media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){ color-scheme:dark; --rail-bg:#0B0E0C; --rail-fg:#F1EEE7; --rail-rule:#2C3330; --sel-bg:#FF3B1F; --sel-fg:#0F1411; --a-bg:#0F1411; --a-fg:#F1EEE7; --a-fg2:#CBD1CD; --a-fg3:#9AA39F; --a-rule:#333B37; --a-rule2:#6B7370; --a-lit:rgba(255,255,255,.058); --a-well:#161C18; --b-bg:#070908; --b-fg:#F1EEE7; --b-fg2:#C7CDC9; --b-fg3:#96A09B; --b-rule:#282E2B; --b-rule2:#5E6663; --b-lit:rgba(255,255,255,.05); --b-well:#101512; --a-accent-text:#FF3B1F; --b-accent-text:#FF3B1F; --sheet-shadow:0 30px 70px -20px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.06); } } /* Главы: A — нечётные, B — чётные. Ритм смены глав держится в обеих темах, меняются только значения токенов. */ .ch--a{--bg:var(--a-bg);--fg:var(--a-fg);--fg2:var(--a-fg2);--fg3:var(--a-fg3); --rule:var(--a-rule);--rule2:var(--a-rule2);--lit:var(--a-lit);--well:var(--a-well); --accent-text:var(--a-accent-text)} .ch--b{--bg:var(--b-bg);--fg:var(--b-fg);--fg2:var(--b-fg2);--fg3:var(--b-fg3); --rule:var(--b-rule);--rule2:var(--b-rule2);--lit:var(--b-lit);--well:var(--b-well); --accent-text:var(--b-accent-text)} /* Палитры клиентских работ. Тема их не трогает. */ .w-flax{--w-bg:#F7F5F0;--w-fg:#12140F;--w-mut:#3A3F34;--w-wek:#6D7266;--w-rule:#CFCABB;--w-rule2:#E3DFD4;--w-acc:#2E4B3C;--w-neg:#8B2C1F;} .w-kordat{--w-bg:#0B0C0C;--w-fg:#FFFFFF;--w-mut:#CFD4D2;--w-wek:#A9B0AD;--w-rule:rgba(255,255,255,.28);--w-rule2:rgba(255,255,255,.16);--w-acc:#FFFFFF;--w-neg:#FF6A4D;} .w-nofa{--w-bg:#EFF2F2;--w-fg:#0D1B21;--w-mut:#4C5F66;--w-wek:#5D7078;--w-rule:#B9C4C7;--w-rule2:#C9D2D4;--w-acc:#12484F;--w-neg:#8B2C1F;} .w-artel{--w-bg:#0E0D0C;--w-fg:#EFE9E0;--w-mut:#B6ADA0;--w-wek:#8D857A;--w-rule:#2A2724;--w-rule2:#2A2724;--w-acc:#9A7B3F;--w-neg:#B4553C;} .w-volga{--w-bg:#FFFFFF;--w-fg:#14171A;--w-mut:#4A545A;--w-wek:#6D787F;--w-rule:#E1E5E8;--w-rule2:#14171A;--w-acc:#1B3A5C;--w-neg:#8B2C1F;--w-c1:#1B3A5C;--w-c2:#8B2C1F;--w-c3:#4E7396;--w-c4:#9BB0C4;--w-c5:#D3D8DD;} .w-nline{--w-bg:#EDEDE8;--w-fg:#16211C;--w-mut:#4A574F;--w-wek:#5C6B63;--w-rule:#CBD2CC;--w-rule2:#1E3A2F;--w-acc:#1E3A2F;--w-neg:#8B2C1F;} .w-doc{--w-bg:#FCFBF8;--w-fg:#15181A;--w-mut:#22282B;--w-wek:#6D787F;--w-rule:#DEE2E4;--w-rule2:#EBEEF0;--w-acc:#14171A;--w-neg:#8B2C1F;} .w-page{--w-bg:#F2F1ED;--w-fg:#14171A;--w-mut:#4D5155;--w-wek:#5F6367;--w-rule:#D5D4CE;--w-rule2:#C9C8C3;--w-acc:#14171A;--w-neg:#8B2C1F;}