:root{--serif:Georgia,"Noto Serif","Times New Roman",serif;--sans:-apple-system,"Segoe UI","Helvetica Neue","Noto Sans",Arial,sans-serif;--mono:ui-monospace,Menlo,Consolas,monospace;--t1:13px;--t2:14px;--t3:16px;--t4:19px;--t5:24px;--t6:30px;--lh-t:1.16;--lh-s:1.3;--lh-b:1.62;--s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:36px;--s7:52px;--page:1060px;--tap:36px;--hr:1px;
/* 🔴 Каждая цветовая роль объявлена ДВАЖДЫ: сначала hex, следом oklch. Старые движки
   (UC Browser, Opera Mini, дешёвые Android — ровно аудитория лёгкой версии) oklch не
   понимают, переменная становится невалидной при подстановке, и страница схлопывается
   в чёрное по белому без линий и акцентов. */
--bg:#fbfaf6;--bg:oklch(98.6% .006 85);--bg2:#f4f2ec;--bg2:oklch(96.4% .008 85);
--fg:#2b2723;--fg:oklch(26% .012 60);--fg2:#55504a;--fg2:oklch(44% .012 60);
--fg3:#6a655e;--fg3:oklch(52% .012 60);--ln:#d5cfc6;--ln:oklch(84% .01 75);
--ln2:#e8e3db;--ln2:oklch(91% .008 75);--ln3:#837c72;--ln3:oklch(60% .014 70);
--lk:#17518f;--lk:oklch(44% .1 248);--ac:#9c4530;--ac:oklch(49% .14 35);
--foc:#1c62b5;--foc:oklch(52% .17 250);
--d-bg:#211f1c;--d-bg:oklch(21.5% .008 75);--d-bg2:#2a2724;--d-bg2:oklch(25.5% .009 75);
--d-fg:#e8e2d7;--d-fg:oklch(90% .014 85);--d-fg2:#c0b9ae;--d-fg2:oklch(76% .013 85);
--d-fg3:#9f9a90;--d-fg3:oklch(65% .012 85);--d-ln:#3a3733;--d-ln:oklch(33% .01 75);
--d-ln2:#2f2c29;--d-ln2:oklch(28% .009 75);--d-ln3:#5b5650;--d-ln3:oklch(47% .012 75);
--d-lk:#8fc6ee;--d-lk:oklch(81% .09 235);--d-ac:#eeae87;--d-ac:oklch(80% .12 55);
--d-foc:#90caf9;--d-foc:oklch(82% .13 240)}
:root,[data-t=light]{color-scheme:light}
/* 🔴 Тема — атрибутом от СЕРВЕРА (cookie mg-theme), а не CSS-трюком на :target из макета:
   :target-состояние умирало на первом же переходе по ссылке. */
[data-t=dark]{color-scheme:dark;--bg:var(--d-bg);--bg2:var(--d-bg2);--fg:var(--d-fg);--fg2:var(--d-fg2);--fg3:var(--d-fg3);--ln:var(--d-ln);--ln2:var(--d-ln2);--ln3:var(--d-ln3);--lk:var(--d-lk);--ac:var(--d-ac);--foc:var(--d-foc)}
@media (prefers-color-scheme:dark){[data-t=auto]{color-scheme:dark;--bg:var(--d-bg);--bg2:var(--d-bg2);--fg:var(--d-fg);--fg2:var(--d-fg2);--fg3:var(--d-fg3);--ln:var(--d-ln);--ln2:var(--d-ln2);--ln3:var(--d-ln3);--lk:var(--d-lk);--ac:var(--d-ac);--foc:var(--d-foc)}}
*,::before,::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:var(--t3)/var(--lh-b) var(--sans);font-variant-numeric:tabular-nums}
.w{max-width:var(--page);margin:0 auto;padding:0 var(--s4)}
h1,h2,h3{font-weight:600;margin:0}ul{margin:0;padding:0;list-style:none}p{margin:0}
:focus-visible{outline:2px solid var(--foc);outline-offset:2px}
a{color:var(--fg);text-decoration:none}a:visited{color:var(--fg2)}
a:hover{color:var(--lk);text-decoration:underline;text-underline-offset:3px}
.u{color:var(--lk);font-size:var(--t2);text-decoration:none}
.rub,.rub:visited,.row>a{font-size:var(--t1);color:var(--ac);text-decoration:none}
.rub:hover,.row>a:hover{text-decoration:underline}
.mn a,.ft nav a,.bar a,.full{display:inline-flex;align-items:center;min-height:var(--tap);font-size:var(--t2);text-decoration:none;color:var(--fg2)}
.mn a:hover,.ft nav a:hover,.bar a:hover{color:var(--lk)}
.full{color:var(--lk);white-space:nowrap}
.top{border-bottom:var(--hr) solid var(--ln3)}
.top-in{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2) var(--s5);padding:var(--s3) var(--s4)}
.wm{font:700 var(--t4)/1 var(--serif);color:var(--fg);text-decoration:none}
.wm i,.city{font-style:normal;font-weight:400;color:var(--fg3)}.city{font-size:var(--t2)}
.mn{display:flex;flex-wrap:wrap;gap:0 var(--s4);margin-left:auto}
.ft{margin-top:var(--s7);border-top:var(--hr) solid var(--ln3);background:var(--bg2)}
.ft-in{padding:var(--s5) var(--s4) var(--s6);display:grid;gap:var(--s3)}
.ft nav{display:flex;flex-wrap:wrap;gap:0 var(--s4)}
.fn{font-size:var(--t1);color:var(--fg3);max-width:76ch}.fn a{color:var(--fg2)}
h1{font:400 var(--t6)/var(--lh-t) var(--serif)}h1 span{color:var(--fg3)}
.lede{font-size:var(--t2);color:var(--fg2);max-width:56ch;margin-top:var(--s2)}
.sh{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s4);padding:0 var(--s4) var(--s2);border-bottom:var(--hr) solid var(--ln3)}
.sh h2,.idx h3,.dsep{font:400 var(--t1)/1.4 var(--sans);font-variant-caps:all-small-caps;letter-spacing:.1em;color:var(--fg3)}
.sh h2{font-weight:600;color:var(--fg)}
.sh a{font-size:var(--t1);color:var(--fg3);text-decoration:none}.sh a:hover{color:var(--lk)}
.mono,.row time,.ad b,.pg em,.cnt{font-family:var(--mono);font-weight:400;font-style:normal}
.mono,.row time,.pg em,.cnt{font-size:var(--t1);color:var(--fg3)}
.row,.ad{display:grid;align-items:baseline;gap:var(--s1) var(--s3);padding:var(--s3) 0;border-bottom:var(--hr) solid var(--ln2)}
.list{padding:0 var(--s4)}
.aft{padding:var(--s5) var(--s4) 0;font-size:var(--t2)}
.day{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s5);padding:var(--s3) var(--s4);border-bottom:var(--hr) solid var(--ln);font-size:var(--t2);color:var(--fg2)}
.day b{color:var(--fg);font-weight:600}
.head{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--s3) var(--s5);padding:var(--s6) var(--s4) var(--s5)}
.idx{padding:var(--s5) var(--s4) 0;columns:4 200px;column-gap:var(--s6);column-rule:var(--hr) solid var(--ln2)}
.idx>div{break-inside:avoid;margin:0 0 var(--s5)}
.idx h3{padding-bottom:var(--s1);border-bottom:var(--hr) solid var(--ln)}
.idx li{display:flex;align-items:center;gap:var(--s2);border-bottom:var(--hr) solid var(--ln2)}
.idx a{flex:1;display:flex;align-items:center;min-height:var(--tap)}
.cols{display:grid;grid-template-columns:1.6fr 1fr;gap:var(--s7);padding:var(--s6) var(--s4) 0}
.cols .sh{padding-left:0;padding-right:0}
.row{grid-template-columns:auto auto 1fr}
.row h3{font:400 var(--t4)/var(--lh-s) var(--serif)}
.ad{grid-template-columns:1fr auto}
.ad i{font-style:normal;font-size:var(--t1);color:var(--fg3);grid-column:1/-1}
.ad b{font-size:var(--t2)}
.bar{display:flex;flex-wrap:wrap;gap:0 var(--s4);padding:0 var(--s4);border-bottom:var(--hr) solid var(--ln)}
.bar a[aria-current]{color:var(--fg);box-shadow:inset 0 -2px 0 var(--ac)}
.pg{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--s3) var(--s4);padding:var(--s4);margin-top:var(--s5);border-top:var(--hr) solid var(--ln3);font-size:var(--t2)}
.pgn{justify-content:center;gap:var(--s2);border-top:0;padding-top:var(--s3);margin-top:var(--s3)}
.pgn a,.pgn b{min-width:var(--tap);padding:var(--s1) var(--s3);border:var(--hr) solid var(--ln3);text-align:center;font-weight:600}
.pgn b{background:var(--fg);color:var(--bg)}
.tv{background:var(--fg);color:var(--bg)}
.tv-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s2) var(--s4);padding:var(--s2) var(--s4);font-size:var(--t2)}
.tv-off{display:inline-flex;align-items:center;min-height:var(--tap);padding:0 var(--s3);border:var(--hr) solid var(--bg);color:var(--bg);font-weight:700;text-decoration:none;white-space:nowrap}
.tv-off:hover{background:var(--bg);color:var(--fg)}
.dsep{display:flex;align-items:center;gap:var(--s3);padding:var(--s6) var(--s4) var(--s2)}
.dsep::after{content:"";flex:1;height:var(--hr);background:var(--ln)}
.crumbs{padding:var(--s4) var(--s4) 0;font-size:var(--t1);color:var(--fg3)}
.crumbs a{color:var(--fg2);text-decoration:none}.crumbs a:hover{color:var(--lk)}
.art{padding:0 var(--s4)}.art p,.cm,.rel,h2.h{max-width:66ch}
.art p{font:400 var(--t4)/var(--lh-b) var(--serif);margin:0 0 var(--s4);text-wrap:pretty}
.art p:first-of-type{font-size:var(--t5);line-height:1.45}
/* 🔴 Инлайновая ссылка в теле статьи обязана быть видна: в макете `a{text-decoration:none}`
   делал её неотличимой от текста (в списках это нормально — там ссылка вся строка). */
.art p a{color:var(--lk);text-decoration:underline;text-underline-offset:3px}
.cmts{padding-top:var(--s4)}.cm{padding:var(--s3) 0;border-top:var(--hr) solid var(--ln2)}
.cm b{font-size:var(--t2)}.cm time{margin-left:var(--s3);color:var(--fg3);font-size:var(--t1)}
.cm p{margin:var(--s1) 0 0;font-size:var(--t3);line-height:var(--lh-b)}
.meta{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s4);padding:0 var(--s4) var(--s3);margin-bottom:var(--s5);border-bottom:var(--hr) solid var(--ln);font-size:var(--t1);color:var(--fg3)}
.meta time,.meta b{font-family:var(--mono);font-weight:400;color:var(--fg2)}
.narrow{padding:0 var(--s4)}
.kv{padding:0 var(--s4)}
.kv div{display:flex;justify-content:space-between;gap:var(--s4);padding:var(--s3) 0;border-bottom:var(--hr) solid var(--ln2);max-width:56ch}
.kv b{font-weight:600}
h2.h{font:400 var(--t5)/var(--lh-s) var(--serif);margin:var(--s6) 0 var(--s2)}
[dir=rtl] .mn{margin-left:0;margin-right:auto}
[dir=rtl] .idx{column-rule:none}
@media (max-width:720px){
.cols{grid-template-columns:1fr;gap:var(--s6)}
.idx{columns:2 150px;column-gap:var(--s5)}
.head{padding:var(--s5) var(--s4) var(--s4)}h1{font-size:var(--t5)}
.mn{margin-left:0;width:100%}
.row{grid-template-columns:auto 1fr}.row h3{grid-column:1/-1;font-size:var(--t3)}
.row h3 a{display:block;padding-bottom:var(--s2)}
.art p{font-size:var(--t3)}.art p:first-of-type{font-size:var(--t4)}}
@media (max-width:430px){.idx{columns:1}}