/* Layout: новость — компактная шапка без полноэкранной обложки, кадр 16:9, короткий текст в колонке ~680px; справа лента последних новостей. Быстро читается, быстро грузится. */

.ni{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:56px;padding-top:clamp(96px,11vw,128px);align-items:start}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:.85rem;color:var(--fg-3)}
.crumbs a:hover{color:var(--fg)}
.n-head{display:grid;gap:16px;max-width:780px}
.when{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;font:600 .85rem/1 var(--font-ui);color:var(--fg-3)}
.when time{color:var(--accent)}
.cat{font:600 .72rem/1 var(--font-ui);letter-spacing:.06em;text-transform:uppercase;padding:5px 8px;border-radius:6px;background:rgba(255,255,255,.08);color:var(--fg-2)}
.n-head h1{font:800 clamp(2rem,4.2vw,3.3rem)/1.04 var(--font-display);letter-spacing:-.04em;text-wrap:balance}
.n-head .dek{font-size:1.2rem;line-height:1.5;color:var(--fg-2);max-width:60ch}
.byline{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;font-size:.9rem;color:var(--fg-3);padding-bottom:4px}
.byline b{color:var(--fg);font-weight:600}
.share{display:flex;gap:8px;margin-left:auto}
.share a,.share button{all:unset;cursor:pointer;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.08);display:grid;place-items:center;font:600 .75rem/1 var(--font-ui);color:var(--fg)}
.share a:hover,.share button:hover{background:rgba(255,255,255,.18)}
.share :focus-visible{outline:2px solid var(--fg);outline-offset:2px}
.n-fig{margin-top:28px;display:grid;gap:10px}
.n-fig img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r-lg)}
.n-fig figcaption{font-size:.85rem;color:var(--fg-3)}
.prose{max-width:680px;margin-top:28px;font-size:1.15rem;line-height:1.7;color:rgba(245,245,247,.88)}
.prose>*+*{margin-top:1.1em}
.prose strong{color:var(--fg);font-weight:600}
.prose h2{font:700 1.5rem/1.2 var(--font-display);letter-spacing:-.025em;color:var(--fg);margin-top:1.8em}
.prose ul{list-style:none;padding:0;display:grid;gap:8px}
.prose li{padding-left:22px;position:relative}
.prose li::before{content:"";position:absolute;left:4px;top:.7em;width:7px;height:7px;border-radius:50%;background:var(--accent)}
.film-card{display:grid;grid-template-columns:88px minmax(0,1fr) auto;gap:18px;align-items:center;padding:14px;border-radius:var(--r-lg);background:var(--card);font-size:1rem;line-height:1.4}
.film-card img{border-radius:var(--r-sm);aspect-ratio:2/3;object-fit:cover;width:88px}
.film-card b{display:block;font:700 1.15rem/1.2 var(--font-display);color:var(--fg)}
.film-card span{font-size:.85rem;color:var(--fg-3)}
.film-card .score{display:inline-flex;gap:6px;align-items:center;margin-top:8px;font:700 .82rem/1 var(--font-ui);padding:6px 9px;border-radius:8px;background:var(--fg);color:#000}
.film-card .btns{display:grid;gap:8px}
.source{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;padding:14px 18px;border-radius:var(--r-md);border:1px solid var(--line);font-size:.92rem;color:var(--fg-3)}
.source a{color:var(--fg);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.tags a{font:500 .85rem/1 var(--font-ui);padding:9px 13px;border-radius:999px;background:rgba(255,255,255,.08)}
.tags a:hover{background:rgba(255,255,255,.16)}
.sample-box{margin-top:20px;padding:12px 16px;border-radius:var(--r-md);background:rgba(255,159,10,.1);color:#ffb340;font-size:.88rem}
.aside{position:sticky;top:84px;display:grid;gap:16px}
.box{background:var(--card);border-radius:var(--r-lg);padding:20px;display:grid}
.box h2{font:700 1.1rem/1.2 var(--font-display);margin-bottom:8px}
.latest a{display:grid;gap:4px;padding-block:12px;border-top:1px solid var(--line)}
.latest a:first-of-type{border-top:0}
.latest time{font:600 .78rem/1 var(--font-ui);color:var(--accent)}
.latest b{font:600 .95rem/1.3 var(--font-display)}
.latest a:hover b{color:var(--accent)}
.tg{background:linear-gradient(135deg,rgba(255,55,95,.28),rgba(94,92,230,.22)),var(--card);gap:10px}
.tg p{color:var(--fg-2);font-size:.9rem}
@media (max-width:1060px){.ni{grid-template-columns:minmax(0,1fr)}.aside{position:static}}
@media (max-width:620px){.film-card{grid-template-columns:72px minmax(0,1fr)}.film-card img{width:72px}.film-card .btns{grid-column:1 / -1;grid-auto-flow:column}.prose{font-size:1.06rem}.share{margin-left:0}}
.related{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.related a{display:grid;gap:10px}
.related .img{aspect-ratio:16/10}
.related time{font:600 .78rem/1 var(--font-ui);color:var(--accent)}
.related h3{font:700 1.02rem/1.3 var(--font-display)}
@media (max-width:860px){.related{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}
.n-fig[style*="--nat"]{justify-items:start}
.n-fig[style*="--nat"] img{width:var(--nat);max-width:100%}
