:root{--paper:#E9E6DD;--card:#F7F5EF;--ink:#14140F;--muted:#6A6559;--rule:#D3CDBE;--accent:#C9331B;color-scheme:light}
@media(prefers-color-scheme:dark){:root{--paper:#100F0D;--card:#191713;--ink:#EDE9DF;--muted:#AAA397;--rule:#383329;--accent:#F04A2C;color-scheme:dark}}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.7 'Golos Text',Arial,sans-serif}a{color:inherit;text-underline-offset:4px}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.article-header,.article-footer{max-width:1080px;margin:auto;padding:24px;display:flex;align-items:center;justify-content:space-between;gap:24px}.article-header{border-bottom:1px solid var(--rule)}.article-header nav{display:flex;gap:22px;font-size:13px}.article-brand{display:flex;gap:10px;align-items:center;text-decoration:none;font:600 17px 'Oswald',sans-serif;letter-spacing:.14em}.article-brand svg{width:28px;height:28px;flex-shrink:0}.article-header nav a{text-decoration:none;color:var(--muted)}
.article{max-width:740px;margin:auto;padding:56px 24px 80px}.breadcrumbs{font-size:12px;color:var(--muted);margin-bottom:32px}.breadcrumbs a{text-decoration:none}.article-category{font:500 11px 'JetBrains Mono',monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}h1{font-size:clamp(30px,4.5vw,45px);line-height:1.14;font-weight:500;letter-spacing:-.02em;margin:18px 0 24px;text-wrap:balance}h2{clear:both;font-size:25px;line-height:1.3;font-weight:500;letter-spacing:-.01em;margin:42px 0 18px}p{margin:0 0 20px}.lead{font-size:19px;line-height:1.6}.article-meta{display:flex;flex-wrap:wrap;gap:6px 18px;color:var(--muted);font-size:12px;margin-bottom:34px}ol{padding-left:26px;margin:22px 0}li{padding-left:5px;margin-bottom:12px}strong{font-weight:600}
.article-toc{margin:28px 0 34px;padding:18px 0;border-block:1px solid var(--rule);font-size:13px}.article-toc ul{list-style:none;padding:0;margin:10px 0 0;display:grid;gap:6px}.article-toc li{margin:0;padding:0}.article-toc a{text-decoration-color:var(--rule)}
.inline-figure{float:right;width:198px;margin:6px 0 18px 26px;padding:18px;background:var(--card);border:1px solid var(--rule);border-radius:2px;break-inside:avoid}.inline-figure svg{width:100%;height:auto;display:block;overflow:visible}.inline-figure figcaption{font-size:11px;line-height:1.5;color:var(--muted);margin-top:12px}.inline-figure .move{transform-box:fill-box;transform-origin:center;transform:translate(-10px,54px) rotate(-9deg)}.inline-figure[data-play=true] .move{animation:change-rule 1000ms cubic-bezier(.23,1,.32,1) both}.inline-figure .option{opacity:.22}.inline-figure .option.chosen{opacity:1}.inline-figure[data-play=true] .option.chosen{animation:choose-option 900ms cubic-bezier(.23,1,.32,1) both}.inline-figure .question{opacity:1}.inline-figure[data-play=true] .question{animation:show-question 900ms cubic-bezier(.23,1,.32,1) both}
@keyframes change-rule{from{transform:translate(0,0) rotate(0)}to{transform:translate(-10px,54px) rotate(-9deg)}}@keyframes choose-option{from{opacity:.22;transform:translateY(5px)}to{opacity:1;transform:none}}@keyframes show-question{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.article-action{clear:both;border:1px solid var(--rule);padding:24px;background:var(--card);margin:38px 0}.article-action p{font-size:15px;margin-bottom:18px}.article-action a{display:inline-flex;align-items:center;min-height:46px;padding:10px 18px;background:var(--accent);color:#fff;text-decoration:none;border-radius:2px;font-size:14px;font-weight:500}
.article-share{clear:both;border-block:1px solid var(--rule);padding:18px 0;display:flex;align-items:center;flex-wrap:wrap;gap:12px}.article-share button{border:1px solid var(--rule);background:transparent;color:var(--ink);font-size:13px;min-height:40px;padding:8px 12px;border-radius:2px}.article-share span{font-size:12px;color:var(--muted)}.related-list{display:grid;gap:14px;list-style:none;padding:0;margin:0}.related-list li{padding:0;margin:0}.related-list a{display:block;padding:18px 0;border-bottom:1px solid var(--rule);text-decoration:none;line-height:1.4}.related-list a:hover{color:var(--accent)}.related-list small{display:block;font-size:12px;color:var(--muted);margin-top:7px}
.article-footer{border-top:1px solid var(--rule);align-items:flex-start;font-size:12px;color:var(--muted)}.article-footer nav{display:flex;flex-wrap:wrap;gap:12px 20px;justify-content:flex-end}.article-footer a{text-decoration:none}
.article-index{max-width:900px;margin:auto;padding:56px 24px 80px}.article-index>p{max-width:640px}.article-list{margin-top:42px}.article-list article{border-top:1px solid var(--rule);padding:28px 0}.article-list h2{margin:10px 0 14px;font-size:28px}.article-list h2 a{text-decoration:none}.article-list p{max-width:660px;font-size:15px;color:var(--muted)}
@media(max-width:640px){body{font-size:16px}.article-header,.article-footer{padding:20px;flex-wrap:wrap;gap:12px}.article-header nav{font-size:12px;gap:16px}.article{padding:34px 20px 56px}h1{font-size:30px;line-height:1.18}h2{font-size:23px}.lead{font-size:17px}.inline-figure{float:none;width:190px;margin:22px auto}.article-footer nav{justify-content:flex-start}.article-index{padding:34px 20px 56px}.article-list h2{font-size:25px}}
@media(prefers-reduced-motion:reduce){.inline-figure *{animation:none!important;transition:none!important}}
@media print{.article-header,.article-footer,.article-share,.article-action{display:none}body{background:white;color:black}.article{max-width:none;padding:0}.inline-figure{background:white}h2{break-after:avoid}}
