@import url(fonts.css);
:root{--paper:#ECEFEE;--card:#FFFFFF;--ink:#16191C;--muted:#59626A;--line:#D3D8DA;--amber:#E9A800;--amber-ink:#1B1600;
--f-display:"Unbounded","Arial Black",system-ui,sans-serif;--f-body:"Golos Text",system-ui,-apple-system,"Segoe UI",sans-serif}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--paper:#101214;--card:#191C1F;--ink:#ECEEEF;--muted:#9BA4AC;--line:#2B3034;--amber:#F2B705;color-scheme:dark}}
:root[data-theme="dark"]{--paper:#101214;--card:#191C1F;--ink:#ECEEEF;--muted:#9BA4AC;--line:#2B3034;--amber:#F2B705;color-scheme:dark}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 var(--f-body)}
a{color:inherit}
.top{border-bottom:1px solid var(--line)}
.top div,main,footer div{max-width:820px;margin:0 auto;padding-inline:20px}
.top div{display:flex;justify-content:space-between;align-items:center;padding-block:14px}
.logo{font-family:var(--f-display);font-weight:700;font-size:18px;text-decoration:none}
.logo b{background:var(--amber);color:var(--amber-ink);padding:2px 7px;border-radius:5px;margin-right:8px}
main{padding-block:36px 48px}
h1{font-family:var(--f-display);font-weight:700;font-size:clamp(26px,4vw,38px);line-height:1.1;letter-spacing:-.02em;margin:0 0 6px;text-wrap:balance}
.upd{color:var(--muted);margin:0 0 28px}
h2{font-family:var(--f-display);font-weight:500;font-size:19px;margin:34px 0 8px;scroll-margin-top:16px}
p,li{max-width:68ch}
ol,ul{padding-left:22px}
.box{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px 18px;margin:14px 0}
.box p{margin:.3em 0}
footer{border-top:1px solid var(--line);color:var(--muted);font-size:14px}
footer div{display:flex;flex-wrap:wrap;gap:8px 22px;padding-block:22px}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px}
