/* Тема «Купе» */

@font-face { font-family: Geologica; font-weight: 100 900; font-display: swap; src: url(fonts/geologica-cyrillic.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: Geologica; font-weight: 100 900; font-display: swap; src: url(fonts/geologica-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: Onest; font-weight: 400 700; font-display: swap; src: url(fonts/onest-cyrillic.woff2) format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: Onest; font-weight: 400 700; font-display: swap; src: url(fonts/onest-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* Тёмная схема */
:root, [data-theme] .site-head, [data-theme] .hero, [data-theme] .banner, [data-theme] .ratings, [data-theme] .site-foot {
    --coal: #1b1613;
    --ash: #241e1a;
    --soot: #2f2721;
    --line: #3a3029;
    --bone: #f1e9dc;
    --smoke: #a89a8b;
    --prose: #cbc3b8;
    --ember: #e8793a;
    --glow: #ffb070;
    --flare: #ffb070;
    --head-bg: rgba(27, 22, 19, .45);
    --chip: rgba(241, 233, 220, .08);
    --chip-hover: rgba(241, 233, 220, .14);
    --pop-shadow: 0 20px 50px rgba(0, 0, 0, .45);
    color-scheme: dark;
}

/* Светлая схема */
[data-theme="light"], [data-theme="light"] body:not(:has(.hero, .banner)) .site-head, [data-theme="light"] .site-head.is-stuck:not(.is-over-dark) {
    --coal: #f3f2ef;
    --ash: #ffffff;
    --soot: #e7e4df;
    --line: #d6d1ca;
    --bone: #1f1a17;
    --smoke: #6b6058;
    --prose: #45413e;
    --ember: #e8793a;
    --glow: #b34d14;
    --flare: #f0935d;
    --head-bg: rgba(243, 242, 239, .78);
    --chip: rgba(31, 26, 23, .05);
    --chip-hover: rgba(31, 26, 23, .09);
    --pop-shadow: 0 12px 32px rgba(31, 26, 23, .1), 0 2px 8px rgba(31, 26, 23, .06);
    color-scheme: light;
}

[data-theme="light"] .timer { background: var(--ash); }

.banner { color: var(--bone); background-color: var(--coal); }

[data-theme="light"] .ratings { margin: var(--section) calc(50% - 50vw) 0; padding: var(--section) calc(50vw - 50%); background: var(--coal); color: var(--bone); }

:root {
    --ink: #1b1613;
    --display: Geologica, "Segoe UI", system-ui, sans-serif;
    --text: Onest, "Segoe UI", system-ui, sans-serif;
    --radius-card: 14px;
    --radius-md: 8px;
    --head-h: 64px;
    --section: 96px;
}

* { box-sizing: border-box; }
html { background: var(--coal); color: var(--bone); font: 16px/1.6 var(--text); -webkit-text-size-adjust: 100%; }
body { display: flex; flex-direction: column; min-height: 100vh; margin: 0; overflow-x: clip; }
#main { flex: 1 0 auto; width: 100%; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }
h1, h2, h3 { font-family: var(--display); font-weight: 600; margin: 0; letter-spacing: -0.02em; }
p { margin: 0; }
[id] { scroll-margin-top: calc(var(--head-h) + 20px); }
:focus-visible { outline: 2px solid var(--glow); outline-offset: 3px; border-radius: 4px; }
a, button, summary, input, .row, .hit, .mini, .news-card, .pick img, .pick-blank, :is(.still, .row-still, .news-still, .hit-still, .hero-still, .mini) img { transition: color .15s, background-color .15s, box-shadow .15s, filter .25s, transform .1s; }
:is(.btn, .pick, .chips a, .filters a, .tags a, .side-tabs a, .rating-scale button, .like, .reactions button, .scheme, .menu-toggle):active { transform: scale(.97); }

.wrap { max-width: 1240px; margin: 0 auto; padding: 0 24px; }
.muted, .en { color: var(--smoke); }
.kicker { color: var(--glow); font-size: 14px; margin-bottom: 8px; }
.kicker a:hover { text-decoration: underline; }
h1 .kicker { display: block; font: 14px/1.6 var(--text); letter-spacing: 0; }

.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip { position: absolute; left: -999px; top: 8px; background: var(--ember); color: var(--ink); padding: 8px 14px; border-radius: var(--radius-md); z-index: 10; }
.skip:focus { left: 8px; }

/* Шапка */
.site-head { position: sticky; top: 0; z-index: 20; color: var(--bone); background: var(--head-bg); -webkit-backdrop-filter: blur(16px) saturate(1.2); backdrop-filter: blur(16px) saturate(1.2); transition: transform .25s, background-color .25s; }
.site-head.is-away { transform: translateY(-100%); }
body:has(.hero, .banner) .site-head:not(.is-stuck) { background-color: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; }
@media (min-width: 1024px) {
    body:has(.hero:not(.is-bare)) .site-head:not(.is-stuck) { --chip: var(--head-bg); --chip-hover: rgba(27, 22, 19, .6); }
    body:has(.hero:not(.is-bare)) .site-head:not(.is-stuck) :is(.head-search input, .scheme, .menu-toggle) { -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
    body:has(.hero:not(.is-bare)) .site-head:not(.is-stuck) .head-search input::placeholder { color: rgba(241, 233, 220, .72); }
}
.site-head .wrap { display: flex; align-items: center; gap: 32px; min-height: var(--head-h); }
.mark { display: flex; align-items: center; gap: 12px; font: 600 18px var(--display); white-space: nowrap; }
.mark img { display: block; width: auto; max-width: 200px; height: 28px; object-fit: contain; }
.mark img:has(+ span) { height: 36px; }
.mark span { color: var(--glow); font-size: 15px; line-height: 1.05; white-space: pre-line; }
.site-menu { display: flex; align-items: center; gap: 24px; flex: 1; min-width: 0; }
.nav { display: flex; align-items: center; gap: 24px; font-size: 15px; font-weight: 500; }
.nav a, .drop summary { white-space: nowrap; padding: 6px 0; }
.nav a:hover, .drop summary:hover, .drop[open] summary, .nav a[aria-current] { color: var(--glow); }
.drop { position: relative; }
.drop summary { display: flex; align-items: center; gap: 8px; cursor: pointer; list-style: none; -webkit-user-select: none; user-select: none; }
.drop summary::-webkit-details-marker { display: none; }
.drop summary::after { content: ""; width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-2px); }
.drop[open] summary::after { transform: rotate(-135deg) translateY(-2px); }
.drop-list { position: absolute; top: calc(100% + 10px); left: -14px; z-index: 30; display: grid; min-width: 180px; padding: 6px; border-radius: var(--radius-card); background: var(--ash); box-shadow: var(--pop-shadow); }
.drop-list a { padding: 9px 12px; border-radius: var(--radius-md); color: var(--bone); }
.drop-list a:hover { background: var(--soot); }
.head-search { position: relative; margin-left: auto; flex: none; }
.head-search input { width: 220px; min-height: 40px; padding: 0 16px 0 40px; border: 0; border-radius: 999px; color: var(--bone); font: 14px var(--text);
    background: var(--chip) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23a89a8b' stroke-width='1.5' stroke-linecap='round'%3E%3Ccircle cx='7' cy='7' r='5'/%3E%3Cpath d='M11 11l3 3'/%3E%3C/svg%3E") no-repeat 16px 50% / 16px; }
.head-search input:hover, .head-search input:focus, .scheme:hover { background-color: var(--chip-hover); }
.search input:hover { background-color: var(--soot); }
.head-search input:focus { outline: 2px solid var(--ember); outline-offset: 2px; }
.head-search input::placeholder { color: var(--smoke); }
.head-search .suggest { left: auto; width: 360px; }
.menu-toggle { display: none; }
.scheme { display: grid; place-items: center; width: 40px; height: 40px; flex: none; border: 0; border-radius: 50%; background: var(--chip); color: var(--bone); cursor: pointer; }
.scheme svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.scheme .to-dark, [data-theme="light"] .scheme .to-light { display: none; }
[data-theme="light"] .scheme .to-dark { display: block; }
/* Подвал */
.site-foot { margin-top: var(--section); padding: 32px 0; background: var(--ash); color: var(--smoke); font-size: 14px; }
.site-foot .wrap { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 16px 32px; }
.site-foot .mark { justify-self: start; color: var(--bone); }
.foot-seasons, .foot-menu { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.foot-menu { justify-self: end; }
.site-foot nav a:hover, .foot-menu a:hover { color: var(--bone); }

/* Кнопки */
.btn { display: inline-flex; align-items: center; min-height: 48px; padding: 0 24px; border-radius: 999px; background: var(--ember); color: var(--ink); font-weight: 600; border: 0; font-family: var(--text); font-size: 16px; cursor: pointer; }
.btn:hover { background: var(--flare); }
.btn.ghost { background: var(--soot); color: var(--bone); }
.btn.ghost:hover { background: var(--line); }

/* Первый экран */
.hero { --bare: linear-gradient(0deg, #1b1613, rgba(27, 22, 19, 0) 35%),
        radial-gradient(70% 60% at 86% 78%, rgba(232, 121, 58, .22), transparent 72%),
        radial-gradient(46% 50% at 0% -6%, rgba(232, 121, 58, .16), transparent 70%);
    position: relative; isolation: isolate; display: grid; grid-template-rows: 1fr auto; gap: 48px; min-height: 100vh; min-height: 100svh;
    margin: calc(-1 * var(--head-h)) calc(50% - 50vw) 0; padding: calc(var(--head-h) + 56px) calc(50vw - 50%) 40px; color: var(--bone); background: var(--coal); }
.hero picture { position: absolute; inset: 0; z-index: -2; }
.hero-bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 70% 50%; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -1;
    background: linear-gradient(180deg, rgba(27, 22, 19, .75), rgba(27, 22, 19, 0) 200px),
        linear-gradient(0deg, #1b1613, rgba(27, 22, 19, .7) 180px, rgba(27, 22, 19, 0) 50%),
        linear-gradient(90deg, rgba(27, 22, 19, .9), rgba(27, 22, 19, .6) 40%, rgba(27, 22, 19, 0) 70%); }
.hero.is-bare::before { background: var(--bare); }
.hero::after { content: ""; display: none; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .09; mix-blend-mode: overlay;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.hero.is-bare::after { display: block; }
/* Угольки */
.embers { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.embers i { position: absolute; bottom: -8px; left: var(--x); width: var(--s); height: var(--s); border-radius: 50%; background: #ffd9a8;
    box-shadow: 0 0 6px 1px rgba(255, 140, 50, .7); opacity: 0; will-change: transform, opacity; animation: rise var(--d) linear var(--w) infinite; }
.hero.is-past .embers i { animation-play-state: paused; }
@keyframes rise {
    0% { transform: translate(0, 0); opacity: 0; }
    12% { opacity: var(--o); }
    50% { transform: translate(calc(var(--dx) * -.4), calc(var(--h) * -.5)); }
    75% { opacity: calc(var(--o) * .6); }
    100% { transform: translate(var(--dx), calc(var(--h) * -1)); opacity: 0; } }
.embers i:nth-child(1) { --x: 11.5%; --s: 2.3px; --o: 0.66; --d: 15.1s; --w: -10.5s; --dx: 12px; --h: 57vh; }
.embers i:nth-child(2) { --x: 35.4%; --s: 1.8px; --o: 0.46; --d: 14.9s; --w: -5.2s; --dx: 2px; --h: 53vh; }
.embers i:nth-child(3) { --x: 30.9%; --s: 1.6px; --o: 0.47; --d: 14.4s; --w: -11.8s; --dx: 16px; --h: 76vh; }
.embers i:nth-child(4) { --x: 50.4%; --s: 2.4px; --o: 0.56; --d: 12.7s; --w: -2.0s; --dx: 44px; --h: 80vh; }
.embers i:nth-child(5) { --x: 6.0%; --s: 3.2px; --o: 0.77; --d: 9.1s; --w: -7.8s; --dx: 34px; --h: 77vh; }
.embers i:nth-child(6) { --x: 97.8%; --s: 2.3px; --o: 0.47; --d: 10.7s; --w: -16.1s; --dx: -44px; --h: 49vh; }
.embers i:nth-child(7) { --x: 70.7%; --s: 1.7px; --o: 0.59; --d: 16.6s; --w: -2.3s; --dx: 34px; --h: 85vh; }
.embers i:nth-child(8) { --x: 65.6%; --s: 3.0px; --o: 0.67; --d: 10.9s; --w: -15.3s; --dx: -8px; --h: 70vh; }
.embers i:nth-child(9) { --x: 0.7%; --s: 1.5px; --o: 0.57; --d: 12.6s; --w: -5.1s; --dx: -52px; --h: 71vh; }
.embers i:nth-child(10) { --x: 54.1%; --s: 2.0px; --o: 0.73; --d: 9.0s; --w: -12.8s; --dx: 37px; --h: 70vh; }
.embers i:nth-child(11) { --x: 38.4%; --s: 3.1px; --o: 0.67; --d: 16.2s; --w: -4.9s; --dx: -23px; --h: 49vh; }
.embers i:nth-child(12) { --x: 57.5%; --s: 3.2px; --o: 0.62; --d: 11.9s; --w: -7.3s; --dx: -35px; --h: 48vh; }
.embers i:nth-child(13) { --x: 8.4%; --s: 1.6px; --o: 0.65; --d: 14.1s; --w: -2.5s; --dx: -36px; --h: 72vh; }
.embers i:nth-child(14) { --x: 65.8%; --s: 1.8px; --o: 0.52; --d: 16.6s; --w: -15.0s; --dx: 33px; --h: 85vh; }
.embers i:nth-child(15) { --x: 58.0%; --s: 3.0px; --o: 0.60; --d: 10.6s; --w: -1.4s; --dx: 49px; --h: 71vh; }
.embers i:nth-child(16) { --x: 61.6%; --s: 2.8px; --o: 0.64; --d: 11.3s; --w: -0.8s; --dx: 48px; --h: 80vh; }
.embers i:nth-child(17) { --x: 3.8%; --s: 2.3px; --o: 0.50; --d: 11.4s; --w: -12.6s; --dx: 13px; --h: 61vh; }
.embers i:nth-child(18) { --x: 58.4%; --s: 1.9px; --o: 0.57; --d: 14.4s; --w: -2.0s; --dx: 12px; --h: 55vh; }
.embers i:nth-child(19) { --x: 35.3%; --s: 2.4px; --o: 0.72; --d: 13.4s; --w: -7.7s; --dx: -28px; --h: 73vh; }
.embers i:nth-child(20) { --x: 59.9%; --s: 2.4px; --o: 0.46; --d: 10.4s; --w: -9.4s; --dx: -30px; --h: 60vh; }
.embers i:nth-child(21) { --x: 11.0%; --s: 2.9px; --o: 0.44; --d: 9.2s; --w: -14.8s; --dx: -21px; --h: 71vh; }
.embers i:nth-child(22) { --x: 82.2%; --s: 1.9px; --o: 0.47; --d: 15.0s; --w: -8.5s; --dx: 3px; --h: 68vh; }
.embers i:nth-child(23) { --x: 38.8%; --s: 2.4px; --o: 0.63; --d: 15.9s; --w: -3.7s; --dx: -36px; --h: 60vh; }
.embers i:nth-child(24) { --x: 56.9%; --s: 2.6px; --o: 0.54; --d: 11.5s; --w: -13.8s; --dx: -68px; --h: 53vh; }
.embers i:nth-child(25) { --x: 1.0%; --s: 2.7px; --o: 0.75; --d: 12.8s; --w: -10.0s; --dx: -70px; --h: 49vh; }
.embers i:nth-child(26) { --x: 57.4%; --s: 3.1px; --o: 0.72; --d: 15.8s; --w: -16.5s; --dx: -39px; --h: 51vh; }
.hero-text { align-self: center; max-width: 46rem; text-shadow: 0 2px 28px rgba(27, 22, 19, .45); }
.hero h1 { color: var(--glow); font-size: clamp(44px, 5.4vw, 76px); line-height: 1.05; letter-spacing: -0.025em; text-wrap: balance; }
.hero h1 span, .hero-lead { color: var(--prose); font: 400 18px/1.6 var(--text); letter-spacing: 0; }
.hero h1 span { display: block; margin-top: 16px; }
.hero-lead { max-width: 34em; margin-top: 24px; }
.hero-foot { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 24px 40px; }
.hero-last { display: flex; align-items: center; gap: 20px; }
.hero-still { position: relative; flex: none; width: 136px; aspect-ratio: 16 / 9; border-radius: var(--radius-md); overflow: hidden; background: #241e1a; }
.hero-still img { width: 100%; height: 100%; object-fit: cover; }
.hero-still .play i { width: 40px; height: 40px; box-shadow: none; }
.hero-still .play i::after { width: 15px; height: 16px; margin-left: 2px; }
.hero-last:hover .play i { transform: scale(1.08); }
.hero-ep { display: grid; gap: 4px; }
.hero-ep > span { color: var(--smoke); font-size: 14px; }
.hero-ep b { font: 600 clamp(20px, 2vw, 28px)/1.15 var(--display); letter-spacing: -0.02em; }
.hero-next { text-align: right; }
.hero-next .hero-ep > span { color: var(--glow); }
.hero-next:hover b, .hero-last:hover b { color: var(--glow); }


/* Кадр и значок плеера */
.still { position: relative; display: block; aspect-ratio: 16 / 9; border-radius: var(--radius-card); overflow: hidden; background: #241e1a; }
.still img { width: 100%; height: 100%; object-fit: cover; }
.play { position: absolute; inset: 0; display: grid; place-items: center; background: linear-gradient(0deg, rgba(27, 22, 19, .6), transparent 60%); }
.play i { width: 84px; height: 84px; border-radius: 50%; background: var(--ember); display: grid; place-items: center; box-shadow: 0 0 0 10px rgba(232, 121, 58, .18), 0 0 60px rgba(232, 121, 58, .45); transition: transform .2s; will-change: transform; }
.play i::after { content: ""; width: 30px; height: 32px; margin-left: 6px; background: var(--ink);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='4 3 17 18'%3E%3Cpath d='M5 5a2 2 0 0 1 3.008-1.728l11.997 6.998a2 2 0 0 1 .003 3.458l-12 7A2 2 0 0 1 5 19z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='4 3 17 18'%3E%3Cpath d='M5 5a2 2 0 0 1 3.008-1.728l11.997 6.998a2 2 0 0 1 .003 3.458l-12 7A2 2 0 0 1 5 19z'/%3E%3C/svg%3E") center / contain no-repeat; }
.still:hover .play i { transform: scale(1.06); }

/* Блоки главной */
.guide, .schedule, .ratings, .news, .about, .story, .faq, .cast { padding-top: var(--section); }
.guide h2, .schedule h2, .ratings h2, .news h2, .about h2, .faq h2, .cast h2 { font-size: 28px; line-height: 1.15; margin-bottom: 24px; }
.ghead { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 24px; }
.ghead h2 { margin-bottom: 0; }
/* Выбор сезона */
.picks { display: flex; gap: 12px; overflow-x: auto; padding: 4px; margin: -4px -4px 20px; scrollbar-width: thin; }
.picks[hidden] { display: none; }
.pick { display: flex; align-items: center; gap: 12px; padding: 8px 20px 8px 8px; border-radius: var(--radius-card); border: 0; background: var(--ash); color: var(--smoke); font: 14px/1.3 var(--text); text-align: left; cursor: pointer; flex: none; }
.pick img { width: 48px; aspect-ratio: 2 / 3; object-fit: cover; border-radius: var(--radius-md); }
.pick > span { display: grid; gap: 4px; }
.pick b { font: 500 16px/1.3 var(--display); color: inherit; }
.pick:hover { color: var(--bone); }
.pick[aria-pressed="true"], .pick[aria-current] { background: var(--soot); color: var(--bone); }
.pick[aria-pressed="true"] :is(img, .pick-blank), .pick[aria-current] :is(img, .pick-blank) { box-shadow: 0 0 0 2px var(--soot), 0 0 0 4px var(--ember); }
.pick[aria-pressed="true"] b, .pick[aria-current] b { color: var(--glow); }
.season + .season { margin-top: 40px; }
.season-name { font-size: 20px; line-height: 1.3; letter-spacing: -0.01em; margin-bottom: 8px; }
.season-name span { color: var(--smoke); font-weight: 400; font-family: var(--text); font-size: 16px; }
.season-name a:hover { color: var(--glow); }
.js-tabs .season-name { display: none; }
.season-text { color: var(--smoke); max-width: 72ch; margin-bottom: 24px; }

.pick-blank { display: grid; place-items: center; width: 48px; aspect-ratio: 2 / 3; border-radius: var(--radius-md); background: var(--coal); font: 500 20px var(--display); color: var(--ember); }

/* Строка серии */
.row { display: grid; grid-template-columns: 56px 200px 1fr auto; gap: 24px; align-items: center; padding: 12px; margin-inline: -12px; border-radius: var(--radius-card); }
.row:hover { background: var(--ash); }
.row-num { font: 500 28px/1.15 var(--display); color: var(--smoke); text-align: center; }
.row-still { display: block; aspect-ratio: 16 / 9; border-radius: var(--radius-md); overflow: hidden; background: var(--soot); }
.row-still img { width: 100%; height: 100%; object-fit: cover; }
.row-title { display: block; font: 500 18px/1.3 var(--display); }
.row-lead { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 4px; color: var(--smoke); font-size: 14px; max-width: 70ch; }
.row-date { min-width: 176px; color: var(--smoke); font-size: 14px; text-align: right; white-space: nowrap; }
.row.is-soon:hover { background: none; }
.row.is-soon .row-num, .row.is-soon .row-title { color: var(--smoke); }
.row-still.is-blank { position: relative; display: grid; place-items: center; background: radial-gradient(80% 90% at 50% 100%, rgba(232, 121, 58, .28), transparent 70%), #2f2721; }
.row-still.is-blank img { position: absolute; inset: 0; }
.row-still.is-blank b { position: relative; padding: 4px 12px; border-radius: 999px; background: rgba(27, 22, 19, .7); color: #ffb070; font: 500 13px var(--display); }
.row.is-soon .row-date { color: var(--glow); }
.row-when { display: none; }

@media (max-width: 767px) {
    .row { grid-template-columns: 40px 160px minmax(0, 1fr); grid-template-areas: "num still text" "num still date"; gap: 4px 20px; }
    .row-num { grid-area: num; }
    .row-still { grid-area: still; }
    .row-text { grid-area: text; align-self: end; }
    .row-date { grid-area: date; align-self: start; min-width: 0; text-align: left; }
}

@media (max-width: 639px) {
    .row-when { display: block; margin-top: 2px; color: var(--glow); font-size: 13px; }
    .row.is-soon .row-lead { display: none; }
    .row { grid-template-columns: 32px 112px minmax(0, 1fr); gap: 12px; padding: 8px; margin-inline: -8px; }
    .row-num { font-size: 20px; }
    .row-title { font-size: 16px; }
    .row-date { display: none; }
    .row-lead { -webkit-line-clamp: 1; }
}

/* График */
.timer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 40px; padding: 24px; margin-bottom: 8px; border-radius: var(--radius-card);
    background: radial-gradient(70% 140% at 100% 50%, rgba(232, 121, 58, .22), transparent 70%), var(--ash); }
.timer > div { display: grid; gap: 4px; }
.timer .kicker { margin: 0; }
.timer-title { font: 600 20px/1.3 var(--display); letter-spacing: -0.01em; }
.timer-clock { display: flex; gap: 12px; margin: 0; }
.timer-clock span { display: grid; justify-items: center; gap: 4px; min-width: 92px; padding: 12px; border-radius: var(--radius-md); background: var(--coal); }
.timer-clock b { font: 500 44px/1.05 var(--display); color: var(--glow); font-variant-numeric: tabular-nums; }
.timer-clock i { font-style: normal; color: var(--smoke); font-size: 13px; }
.slot-season + .slot-season { border-top: 1px solid var(--line); }
.slot-season summary { display: flex; align-items: center; gap: 16px; padding: 24px 0; cursor: pointer; list-style: none; }
.slot-season[open] summary { padding-bottom: 16px; }
.slot-name { font: 600 20px/1.3 var(--display); letter-spacing: -0.01em; }
.slot-range { flex: 1; color: var(--smoke); font-size: 14px; }
.slot-count { margin-left: auto; color: var(--smoke); font-size: 14px; white-space: nowrap; }
.slot-season[open] .slot-name, .slot-season.is-airing .slot-count { color: var(--glow); }
.slot-list { list-style: none; margin: 0; padding: 0 0 16px; }
.slot { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto 72px; align-items: center; gap: 16px; padding: 12px 0; }
.slot + .slot { border-top: 1px solid var(--soot); }
.slot-num { color: var(--smoke); font: 500 16px var(--display); }
.slot a.slot-title:hover { color: var(--glow); }
.slot-date { min-width: 160px; color: var(--smoke); font-size: 14px; text-align: right; white-space: nowrap; }
.slot > .slot-date:last-child { grid-column: 3 / -1; }
.slot-soon { justify-self: end; padding: 4px 12px; border-radius: 999px; background: var(--chip); color: var(--glow); font: 500 13px/1.3 var(--display); }
.slot.is-soon .slot-title { color: var(--smoke); }

/* Раскрытие графика и вопросов */
.slot-season summary::-webkit-details-marker, .faq-item summary::-webkit-details-marker { display: none; }
.slot-season summary::after, .faq-item summary::after { content: ""; flex: none; width: 20px; height: 20px; background: var(--smoke);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M10 4v12M4 10h12'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M10 4v12M4 10h12'/%3E%3C/svg%3E") center / contain no-repeat; }
.slot-season[open] summary::after, .faq-item[open] summary::after { background: var(--glow);
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M4 10h12'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M4 10h12'/%3E%3C/svg%3E"); }

/* Новости */
.more { color: var(--glow); font-size: 15px; font-weight: 500; }
.more:hover { text-decoration: underline; }
.news-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.news-card { display: grid; grid-template-rows: auto 1fr; border-radius: var(--radius-card); background: var(--ash); overflow: hidden; }
.news-card:hover { background: var(--soot); }
.news-still { display: block; aspect-ratio: 16 / 9; background: var(--soot); }
.news-still img { width: 100%; height: 100%; object-fit: cover; }
.news-text { display: grid; gap: 8px; align-content: start; padding: 20px; }
.news-card time { color: var(--smoke); font-size: 14px; }
.news-card b { font: 500 18px/1.3 var(--display); }
.news-text > span { color: var(--smoke); font-size: 14px; }
.source { margin-top: 28px; color: var(--smoke); font-size: 15px; }
.source a { color: var(--glow); }
.source a:hover { text-decoration: underline; text-underline-offset: 3px; }
.cover { border-radius: var(--radius-card); margin: 8px 0 20px; width: 100%; height: auto; }
/* Новость */
.article { display: grid; gap: 32px; max-width: 46rem; margin: 0 auto; }
.article-head { display: grid; gap: 12px; justify-items: start; }
.article-head .kicker { margin: 0; font-size: 15px; }
.article h1 { font-size: clamp(32px, 4vw, 44px); line-height: 1.05; letter-spacing: -0.025em; }
.article-head .kicker + h1 { margin-top: -4px; }
.article-head .tags { margin: 4px 0 0; }
.article > .lead, .article > .cover { margin: 0; }
.article > .lead, .article .prose, .info .prose { color: var(--prose); }
.article.is-lost { padding-top: 40px; justify-items: start; }
.article .lead a { color: var(--glow); text-decoration: underline; text-underline-offset: 3px; }
.article-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
.article-foot :is(.views, .source) { margin: 0; }

/* Оценка */
.rating { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; }
.rating-total { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; }
.rating-sum { display: flex; align-items: baseline; gap: 6px; margin: 0; }
.rating-sum b { font: 500 28px/1.15 var(--display); color: var(--glow); }
.rating-sum span, .rating-votes { color: var(--smoke); font-size: 14px; margin: 0; }
.rating-short .rating-sum b { font-size: 20px; }
.rating-vote { display: grid; gap: 8px; width: 100%; }
.rating-label { margin: 0; color: var(--smoke); font-size: 14px; line-height: 1.3; }
.rating-scale { display: flex; flex-wrap: wrap; gap: 4px; }
.rating-scale button { min-width: 32px; height: 32px; border: 0; border-radius: var(--radius-md); background: var(--soot); color: var(--smoke); font: 500 14px var(--display); cursor: pointer; }
.rating-scale button:hover, .rating-scale button[data-filled] { background: rgba(232, 121, 58, .25); color: var(--bone); }
.rating-scale button[aria-pressed="true"] { background: var(--ember); color: var(--ink); }
.rating-note { margin: 0; color: var(--smoke); font-size: 13px; }
.rating:not([data-mine]) .rating-note, .rating[data-mine=""] .rating-note { display: none; }
.rating[data-state="limit"]::after { content: "С этого адреса сегодня уже голосовали много раз"; width: 100%; color: var(--glow); font-size: 13px; }
.like { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border: 0; border-radius: 999px; background: var(--soot); color: var(--bone); font: 500 15px var(--text); cursor: pointer; }
.like svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
.like[aria-pressed="true"] { background: rgba(232, 121, 58, .25); }
.like[aria-pressed="true"] svg { fill: var(--ember); stroke: var(--ember); }
.like:disabled { cursor: default; }
.reactions { display: flex; flex-wrap: wrap; gap: 6px; }
.reactions button { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 12px; border: 0; border-radius: 999px; background: var(--soot); color: var(--bone); font: 14px var(--text); cursor: pointer; }
.reactions button b { color: var(--smoke); font-weight: 400; }
.reactions button:hover { background: rgba(232, 121, 58, .2); }
.reactions button[aria-pressed="true"] { background: rgba(232, 121, 58, .38); }
.reactions button[aria-pressed="true"] b { color: var(--glow); }
.reactions button:disabled { cursor: default; }

@media (max-width: 639px) {
    .rating-scale { flex-wrap: nowrap; }
    .rating-scale button { flex: 1 1 0; min-width: 0; height: 44px; }
}

/* Рейтинг */
.score-box { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin: 16px 0 4px; }
.views { margin: 12px 0 0; color: var(--smoke); font-size: 14px; }
.show-score { display: flex; align-items: center; gap: 20px 48px; padding: 20px 24px; border-radius: var(--radius-card);
    background: radial-gradient(70% 140% at 0% 50%, rgba(232, 121, 58, .22), transparent 70%), var(--ash); }
.show-score .rating { display: contents; }
.show-score .rating-sum b { font-size: 44px; line-height: 1.05; }
.show-score .rating-vote { width: auto; flex: none; }
.marks { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; flex: 1; gap: 16px 24px; margin: 0; padding: 0; list-style: none; }
.marks li { display: grid; gap: 4px; }
.marks i { font-style: normal; color: var(--smoke); font-size: 14px; line-height: 1.3; white-space: nowrap; }
.marks b { font: 500 20px/1.3 var(--display); }
.top { padding-top: 32px; }
.top h3 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin-bottom: 20px; font: 500 18px/1.3 var(--display); letter-spacing: 0; }
.top h3 .muted { font: 14px var(--text); }
.top-list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px 24px; margin: 0; padding: 0; list-style: none; }
.top-list a { display: flex; align-items: flex-start; gap: 12px; }
.top-list a:hover .top-title { color: var(--glow); }
.top-score { flex: none; font: 600 20px/1.3 var(--display); color: var(--glow); }
.top-text { display: grid; gap: 2px; min-width: 0; }
.top-title { font: 500 16px/1.3 var(--display); }
.top-meta { color: var(--smoke); font-size: 13px; }

/* О сериале */
.about { display: grid; grid-template-columns: minmax(0, 1fr) 280px; grid-template-rows: auto auto 1fr; grid-template-areas: "head poster" "facts poster" "text poster"; gap: 24px 64px; align-items: start; }
.about-head { grid-area: head; }
.about h2 { margin-bottom: 4px; }
.poster { grid-area: poster; width: 100%; aspect-ratio: 2 / 3; object-fit: cover; border-radius: var(--radius-card); }
.facts { grid-area: facts; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 32px; max-width: 46rem; margin: 0; }
.facts dt { color: var(--smoke); font-size: 14px; }
.facts dd { margin: 2px 0 0; }
.about-text { grid-area: text; display: grid; gap: 16px; }
.about-text, .story-part .prose, .faq-item p { max-width: 72ch; }
.lead { margin-bottom: 16px; font-size: 18px; }
.about-text .lead { margin: 0; }

/* Сюжет, создание, критика */
.story-part + .story-part { margin-top: 40px; }
.story-part h2 { font-size: 28px; line-height: 1.15; margin-bottom: 24px; }
.story-part .prose { color: var(--smoke); }
.story-tabs { display: flex; flex-wrap: wrap; gap: 8px 24px; margin-bottom: 24px; }
.story-tabs button { padding: 0; border: 0; background: none; color: var(--smoke); font: 600 28px/1.15 var(--display); letter-spacing: -0.02em; cursor: pointer; }
.story-tabs button:hover, .story-tabs button[aria-selected="true"] { color: var(--bone); }
.has-tabs .story-part + .story-part { margin-top: 0; }
.has-tabs .story-part h2 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* Вопросы и ответы */
.faq { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 24px 64px; align-items: start; }
.faq h2 { margin: 0; }
.faq-item + .faq-item { border-top: 1px solid var(--line); }
.faq-item summary { display: flex; align-items: center; gap: 24px; padding: 24px 0; cursor: pointer; list-style: none; }
.faq-item:first-child summary { padding-top: 0; }
.faq-item h3 { flex: 1; font-size: 20px; line-height: 1.3; letter-spacing: -0.01em; }
.faq-item[open] h3 { color: var(--glow); }
.faq-item p { padding-bottom: 24px; margin-top: -8px; color: var(--smoke); }

/* Персонажи */
.cast-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 32px; }
.who { display: flex; align-items: flex-start; gap: 16px; min-height: 92px; }
.who img, .who-blank { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; flex: none; background: var(--soot); }
.who-text { display: grid; gap: 2px; }
.who b { font: 500 16px/1.3 var(--display); }
.who-actor { color: var(--glow); font-size: 14px; }
.who-about { color: var(--smoke); font-size: 14px; }

/* Страница серии */
.watch { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 32px; align-items: start; }
.screen { position: relative; isolation: isolate; }
.ambient { position: absolute; inset: -6px -10px; width: calc(100% + 20px); height: calc(100% + 12px); object-fit: cover; z-index: -1; border-radius: var(--radius-card); filter: blur(48px) saturate(1.5); opacity: .45; pointer-events: none; }
[data-theme="light"] .ambient { opacity: .25; }
[data-theme="light"] .player { box-shadow: 0 8px 24px rgba(31, 26, 23, .12); }
.player { position: relative; aspect-ratio: 16 / 9; border-radius: var(--radius-card); overflow: hidden; background: #000; box-shadow: 0 30px 80px rgba(0, 0, 0, .5); }
.player iframe { width: 100%; height: 100%; border: 0; display: block; }
.player-empty { height: 100%; display: grid; place-items: center; color: var(--smoke); }
.player-note { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 12px; color: var(--smoke); font-size: 14px; text-align: center; }
.info { display: grid; gap: 32px; padding-top: 24px; }
.info h1 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 10px; font: 400 15px/1.6 var(--text); letter-spacing: 0; color: var(--smoke); }
.info h1 .kicker { margin: 0; font-size: 15px; }
.info-ep { color: var(--bone); font-weight: 500; }
.info-title { margin-top: 8px; font: 600 44px/1.05 var(--display); letter-spacing: -0.025em; }
.info .en { margin-top: 12px; }
.info-rate { display: grid; gap: 20px; justify-items: start; }
.info-rate .score-box, .info-rate .views { margin: 0; }
.crumbs { display: flex; padding: 16px 0 24px; color: var(--smoke); font-size: 14px; }
.crumbs > * + *::before { content: "/"; margin: 0 8px; color: var(--line); }
.crumbs > * { flex: none; }
.crumbs [aria-current] { flex: 0 1 auto; min-width: 0; max-width: 360px; overflow: hidden; color: var(--bone); text-overflow: ellipsis; white-space: nowrap; }
.crumbs a:hover { color: var(--bone); }
.nextbar { display: flex; gap: 12px; flex-wrap: wrap; }
.nextbar a:not([rel="prev"]) { margin-left: auto; }
/* Сезоны и серии */
.side { display: grid; gap: 12px; position: sticky; top: calc(var(--head, 0px) + 16px); transition: top .25s; }
.side-tabs, .side-box { border-radius: var(--radius-card); background: var(--ash); }
.side-tabs { display: flex; gap: 4px; padding: 8px; overflow-x: auto; scrollbar-width: none; }
.side-tabs::-webkit-scrollbar { display: none; }
.side-tabs.is-more { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 72px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 72px), transparent); }
.side-tabs:has(> :only-child) { display: none; }
.side-tabs a { flex: 1 0 auto; display: grid; place-items: center; height: 32px; padding: 0 14px; border-radius: var(--radius-md); color: var(--smoke); font: 500 14px/1.3 var(--display); white-space: nowrap; }
.side-tabs a:hover { color: var(--bone); }
.side-tabs [aria-current] { background: var(--soot); color: var(--glow); }
.side-box { position: relative; overflow: hidden; }
.side-box::after { content: ""; position: absolute; inset: auto 0 0; height: 40px; background: linear-gradient(180deg, transparent, var(--ash)); opacity: .92; pointer-events: none; transition: opacity .2s; }
.side-box.is-end::after { opacity: 0; }
.side-list { display: grid; align-content: start; max-height: 390px; padding: 8px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(168, 154, 139, .7) transparent; }
.side-list[hidden] { display: none; }
.side-list::-webkit-scrollbar { width: 4px; }
.side-list::-webkit-scrollbar-thumb { border-radius: 999px; background: rgba(168, 154, 139, .7); }
.mini { display: grid; grid-template-columns: 28px 88px 1fr; gap: 12px; align-items: center; padding: 8px 10px; border-radius: var(--radius-md); font-size: 14px; line-height: 1.3; }
.mini:hover { background: var(--soot); }
.mini img, .mini > span:empty { aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--radius-md); background: var(--soot); }
.mini b { font: 500 15px/1.3 var(--display); color: var(--smoke); text-align: center; }
.mini[aria-current] { background: var(--soot); }
.mini[aria-current] img { box-shadow: 0 0 0 2px var(--soot), 0 0 0 4px var(--ember); }
.mini[aria-current] b { color: var(--ember); }
.mini[aria-current] span:last-child { color: var(--glow); }

/* Страница сезона */
.banner { position: relative; margin: calc(-1 * var(--head-h)) calc(50% - 50vw) 0; padding: var(--head-h) calc(50vw - 50%) calc(var(--section) / 2); }
.banner-body { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 48px; align-items: center; padding-top: 32px;
    background: radial-gradient(34% 70% at 84% 55%, rgba(232, 121, 58, .22), transparent 70%); }
.banner-text { display: grid; gap: 32px; justify-items: start; }
.banner-body.no-poster { grid-template-columns: 1fr; }
.banner-still { width: 100%; aspect-ratio: 2 / 3; object-fit: cover; border-radius: var(--radius-card); background: var(--soot); }
.banner + .picks { margin-top: calc(var(--section) / 2); margin-bottom: 12px; }
.banner .crumbs { padding-bottom: 0; }
.banner h1 { font-size: clamp(32px, 4vw, 44px); line-height: 1.05; letter-spacing: -0.025em; }
.banner h1 .kicker { margin-bottom: 8px; font-size: 15px; }
.banner h1 .tail { margin-left: 16px; color: var(--smoke); font: 400 16px/1.6 var(--text); letter-spacing: 0; }
.banner .en { margin-top: -20px; }
.banner-lead { max-width: 72ch; }
.banner .score-box { margin: 0; }
.score-box .rating { align-items: center; gap: 16px 24px; }
.score-box .rating-vote { width: auto; }
.show-score .rating-total, .score-box .rating-total { display: grid; grid-template-columns: auto auto; justify-content: start; align-items: center; gap: 0 12px; flex: none; }
.show-score .rating-sum, .score-box .rating-sum { display: contents; }
.show-score .rating-sum b, .score-box .rating-sum b { grid-row: span 2; }
.show-score .rating-sum span, .show-score .rating-votes, .score-box .rating-sum span, .score-box .rating-votes { font-size: 14px; line-height: 1.3; }
.show-score .rating-sum span, .score-box .rating-sum span { align-self: end; }
.show-score .rating-votes, .score-box .rating-votes { align-self: start; }

/* Обычные страницы, ленты, поиск */
.tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; }
.tags a { display: flex; align-items: center; height: 30px; padding: 0 12px; border-radius: 999px; background: var(--soot); color: var(--smoke); font-size: 14px; }
.tags a:hover { color: var(--bone); }
.linked { margin-top: 8px; }
/* Смотреть сериал */
.go-watch { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; padding: 16px 20px; border-radius: var(--radius-card); background: var(--ash); }
.go-new { display: grid; gap: 4px; }
.go-kicker { color: var(--smoke); font-size: 14px; }
.go-kicker b { color: var(--glow); font-weight: 400; }
.go-title { font: 600 18px/1.3 var(--display); }
.go-new:hover .go-title { color: var(--glow); }
.go-watch .tags { flex: none; margin: 0; }
.go-watch .go-new, .go-watch .tags a { color: var(--bone); text-decoration: none; }
.go-watch .tags a { color: var(--smoke); }
.go-watch .tags a:hover { color: var(--bone); }
.linked h2 { font-size: 18px; margin-bottom: 10px; }
.linked ul { margin: 0; padding-left: 1.2em; }
.linked a:hover { color: var(--glow); }

.list-head { padding: 40px 0 24px; }
.crumbs + .list-head { padding-top: 0; }
.list-head h1 { font-size: clamp(32px, 4vw, 44px); line-height: 1.05; letter-spacing: -0.025em; }
.list-head .muted { margin-top: 12px; max-width: 72ch; }
.list-head h1 + .search { margin-top: 24px; }
/* Темы и отбор */
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.chips a, .filters a { display: flex; align-items: center; height: 32px; padding: 0 14px; border-radius: 999px; background: var(--ash); color: var(--smoke); font: 500 14px/1.3 var(--display); }
:is(.chips, .filters) a:hover { color: var(--bone); }
:is(.chips, .filters) [aria-current] { background: var(--soot); color: var(--glow); }
.prose > * + * { margin-top: 1em; }
.prose h2, .prose h3 { font-size: 20px; margin-top: 1.6em; }
.prose a { color: var(--glow); text-decoration: underline; text-underline-offset: 3px; }
.prose ul, .prose ol { padding-left: 1.4em; }
.prose blockquote { margin: 0; padding-left: 18px; border-left: 3px solid var(--ember); color: var(--smoke); }
.prose img { border-radius: var(--radius-md); height: auto; }
.prose figure { margin: 0; }
.prose figcaption { color: var(--smoke); font-size: 14px; margin-top: 6px; }
.search { position: relative; display: flex; gap: 12px; margin-bottom: 12px; max-width: 560px; }
.suggest { position: absolute; z-index: 10; top: calc(100% + 6px); left: 0; right: 0; margin: 0; padding: 6px; list-style: none; background: var(--ash); border-radius: var(--radius-card); box-shadow: var(--pop-shadow); }
.suggest a { display: flex; justify-content: space-between; gap: 16px; padding: 9px 12px; border-radius: var(--radius-md); }
.suggest span { color: var(--smoke); font-size: 13px; white-space: nowrap; }
.suggest [aria-selected="true"] a, .suggest a:hover { background: var(--soot); }
.search input { flex: 1; min-width: 0; min-height: 48px; padding: 0 18px; border-radius: 999px; border: 0; background: var(--ash); color: var(--bone); font: 16px var(--text); }
.search input:focus { outline: 2px solid var(--ember); outline-offset: 2px; }
/* Поиск */
.filters { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.filters span { margin-left: 6px; color: var(--smoke); font: 400 14px var(--text); }
.hits { display: grid; gap: 4px; max-width: 960px; }
.hit { display: grid; grid-template-columns: 200px 1fr; gap: 24px; align-items: start; padding: 12px; margin-inline: -12px; border-radius: var(--radius-card); }
.hit.no-still { grid-template-columns: 1fr; }
.hit:hover { background: var(--ash); }
.hit-still { display: block; aspect-ratio: 16 / 9; border-radius: var(--radius-md); overflow: hidden; background: var(--soot); }
.hit-still img { width: 100%; height: 100%; object-fit: cover; }
.hit.is-poster .hit-still { width: 96px; aspect-ratio: 2 / 3; justify-self: center; }
.hit-kind { display: block; color: var(--glow); font-size: 13px; }
.hit-title { display: block; font: 500 18px/1.3 var(--display); }
.hit-snippet { display: block; margin-top: 4px; color: var(--smoke); font-size: 14px; max-width: 75ch; }
mark { background: rgba(232, 121, 58, .22); color: var(--bone); border-radius: 3px; padding: 0 2px; }
.pager { display: flex; align-items: center; gap: 16px; color: var(--smoke); font-size: 15px; margin-top: 24px; }

/* Планшет */
@media (max-width: 1023px) {
    .hero-bg { display: none; }
    .hero::before { background: var(--bare); }
    .hero::after { display: block; }
    .watch { grid-template-columns: 1fr; }
    .banner-body { grid-template-columns: minmax(0, 1fr) 200px; gap: 32px; }
    .about { grid-template-columns: minmax(0, 1fr) 200px; column-gap: 40px; }
    .faq { grid-template-columns: minmax(0, 1fr); }
    .top-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cast-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .news-list { grid-template-columns: 1fr; }
    .news-card { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); grid-template-rows: none; }
    .news-text { align-content: center; }
    .side { position: static; max-height: none; }
    .site-head .wrap { gap: 20px; }
    .nav { overflow-x: auto; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 80%, transparent); mask-image: linear-gradient(90deg, #000 80%, transparent); padding-right: 24px; }
    .head-search { display: none; }
    .menu-toggle { display: inline-flex; align-items: center; margin-left: auto; min-height: 40px; padding: 0 16px; border: 0; border-radius: 999px; background: var(--chip); color: var(--bone); font: 500 15px var(--text); cursor: pointer; }
    .menu-toggle[aria-expanded="true"] { background: var(--chip-hover); }
    .has-menu .site-menu { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; align-items: stretch; gap: 12px; padding: 8px 24px 20px; background: var(--coal); box-shadow: 0 24px 40px rgba(0, 0, 0, .5); }
    .has-menu.is-open .site-menu { display: flex; }
    .has-menu .nav { flex-direction: column; gap: 0; -webkit-mask-image: none; mask-image: none; padding: 0; overflow: visible; font-size: 18px; }
    .has-menu .nav { align-items: stretch; }
    .has-menu .nav a, .has-menu .drop summary { padding: 12px 0; color: var(--bone); }
    .has-menu .drop-list { position: static; min-width: 0; padding: 0 0 4px 16px; background: none; box-shadow: none; }
    .has-menu .drop-list a { padding: 10px 0; }
    .has-menu .head-search { display: block; margin: 0; }
    .has-menu .head-search input { width: 100%; min-height: 48px; font-size: 16px; }
    .has-menu .head-search .suggest { left: 0; right: 0; width: auto; }
}

/* Широкий экран */
@media (min-width: 1280px) {
    .site-head .wrap { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); }
    .site-menu { display: contents; }
    .nav { grid-column: 2; }
    .head-search, .scheme { grid-area: 1 / 3; justify-self: end; }
    .head-search { margin-right: 52px; }
}

/* Уже 1280px */
@media (max-width: 1279px) {
    .show-score { flex-wrap: wrap; }
    .show-score .marks { flex-basis: 100%; padding-top: 20px; border-top: 1px solid var(--line); }
}


/* Телефон */
@media (max-width: 639px) {
    .facts { grid-template-columns: minmax(0, 1fr); }
    .hit { grid-template-columns: 112px 1fr; gap: 12px; padding: 8px; margin-inline: -8px; }
    .hit-snippet { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
    .player-note { justify-content: flex-start; text-align: left; }
    :root { --section: 56px; }
    .site-foot .wrap { grid-template-columns: minmax(0, 1fr); justify-items: start; }
    .foot-menu { justify-self: start; }
    .wrap { padding: 0 16px; }
    .has-menu .site-menu { padding-inline: 16px; }
    .about { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "poster" "facts" "text"; }
    .poster { width: 200px; justify-self: center; }
    .story-tabs { gap: 8px 20px; }
    .story-tabs button { font-size: 20px; }
    .news-card { grid-template-columns: none; grid-template-rows: auto 1fr; }
    .show-score { flex-direction: column; align-items: stretch; padding: 20px; }
    .show-score .marks { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cast-list, .top-list { grid-template-columns: minmax(0, 1fr); }
    .pick img, .pick-blank { width: 40px; }
    .hero { gap: 32px; padding-top: calc(var(--head-h) + 32px); padding-bottom: 28px; }
    .hero h1 { font-size: clamp(32px, 9vw, 44px); }
    .hero h1 span, .hero-lead { font-size: 16px; }
    .hero-lead { margin-top: 24px; }
    .hero-foot { flex-direction: column; align-items: stretch; gap: 20px; }
    .hero-last { gap: 16px; }
    .hero-still { width: 112px; }
    .hero-next { text-align: left; }
    .nextbar .btn { flex: 1; justify-content: center; padding: 0 12px; font-size: 15px; white-space: nowrap; }
    .banner-body { grid-template-columns: 1fr; gap: 24px; background-image: radial-gradient(60% 30% at 50% 22%, rgba(232, 121, 58, .22), transparent 70%); }
    .banner-text { gap: 24px; justify-items: stretch; }
    .score-box .rating-vote { width: 100%; }
    .info-title { font-size: 28px; line-height: 1.15; letter-spacing: -0.02em; }
    .banner h1 .tail { display: block; margin: 8px 0 0; }
    .banner .en { margin-top: -16px; }
    .banner-still { order: -1; width: 180px; justify-self: center; }
    .banner h1, .banner .en { text-align: center; }
    .btn { min-height: 44px; }
    .timer { padding: 20px; }
    .timer-clock { width: 100%; }
    .timer-clock span { flex: 1; min-width: 0; }
    .timer-clock b { font-size: 28px; }
    .slot-range { display: none; }
    .slot { grid-template-columns: 28px auto 1fr; gap: 4px 12px; }
    .slot-title { grid-column: 2 / -1; }
    .slot-date, .slot > .slot-date:last-child { grid-column: 2; min-width: 0; text-align: left; }
    .slot-soon { grid-column: 3; justify-self: start; }
}

/* Движение */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .2s; }
@media (hover: hover) {
    :is(.still, .row-still, .news-still, .hit-still, .hero-still, .mini) img { filter: brightness(.88); }
    :is(.still, .row, .news-card, .hit, .hero-last, .mini):hover img, .mini[aria-current] img { filter: none; }
}
.is-shown { animation: appear .2s ease-out; }
.suggest, .has-menu.is-open .site-menu, :is(.drop, .faq-item, .slot-season)[open]::details-content { animation: pop .18s ease-out; }
@keyframes appear { from { opacity: 0; } }
@keyframes pop { from { opacity: 0; transform: translateY(-4px); } }
.sparks { position: fixed; z-index: 50; width: 0; height: 0; pointer-events: none; }
.sparks i { position: absolute; width: 4px; height: 4px; margin: -2px; border-radius: 50%; background: var(--flare); box-shadow: 0 0 6px 1px rgba(255, 140, 50, .7); animation: spark .6s ease-out forwards; }
@keyframes spark { to { opacity: 0; transform: translate(var(--dx), var(--dy)) scale(.4); } }
.is-switching, .is-switching * { transition: none !important; }

/* Без анимации */
@media (prefers-reduced-motion: reduce) {
    @view-transition { navigation: none; }
    *, ::before, ::after { transition: none !important; animation: none !important; }
    .embers, .sparks { display: none; }
}