/* =====================================================
   DETAIL PAGE — cinematic redesign (2026-10-09)
   Loaded by fullstory.tpl only, after neon.css. Everything is scoped to
   .nx-d (the detail page root, which also carries .nx-cine / .nx-watch),
   so the header, the other pages and the shared components elsewhere
   are not touched. The palette (the site's violet, amber only for
   IMDb and HD, no reds) lives in --d-* here; the site's own
   tokens (--accent, --surface, ...) and the older --c-* / --watch-*
   ones are remapped inside the page, so the player server bar, the
   comment form and the cards take the same colours.
===================================================== */

.nx-d {
    --d-bg: #080A0F;
    --d-bg2: #10131A;
    --d-elev: #151923;
    --d-acc: #B78CFF;
    --d-acc2: #8B5CF6;
    --d-acc-l: #D1B5FF;
    --d-warm: #E5B86B;
    --d-text: #F5F5F7;
    --d-text2: #A6AAB5;
    --d-text3: #757A87;
    --d-read: #C9CCD4;
    --d-line: rgba(255, 255, 255, .10);
    --d-line2: rgba(255, 255, 255, .16);
    --d-hot: rgba(183, 140, 255, .45);
    --d-soft: rgba(183, 140, 255, .12);
    --d-grad: linear-gradient(135deg, #B28AF8 0%, #8660E0 100%);
    --d-ease: cubic-bezier(.22, 1, .36, 1);
    --d-font-read: "Noto Sans Georgian", var(--font);
    --d-font-num: "Inter", var(--font);
    --d-wrap: 1400px;

    /* the site tokens, inside this page only */
    --accent: var(--d-acc);
    --accent-2: var(--d-acc2);
    --accent-light: var(--d-acc-l);
    --accent-dark: #6E4BC1;
    --accent-soft: var(--d-soft);
    --accent-border: var(--d-hot);
    --accent-glow: rgba(183, 140, 255, .20);
    --btn-grad: var(--d-grad);
    --surface: var(--d-bg2);
    --surface-hover: var(--d-elev);
    --surface-2: var(--d-elev);
    --border: var(--d-line);
    --border-strong: var(--d-line2);
    --text: var(--d-text);
    --text-2: var(--d-text2);
    --text-muted: var(--d-text2);
    --text-faint: var(--d-text3);

    /* the older detail-page tokens neon.css still reads */
    --c-bg: var(--d-bg);
    --c-bg2: var(--d-bg2);
    --c-panel: var(--d-bg2);
    --c-panel2: var(--d-elev);
    --c-violet: var(--d-acc2);
    --c-violet2: var(--d-acc);
    --c-magenta: var(--d-acc2);
    --c-text: var(--d-text);
    --c-text2: var(--d-text2);
    --c-muted: var(--d-text3);
    --c-line: var(--d-line);
    --c-line-hot: var(--d-hot);
    --c-grad: var(--d-grad);
    --watch-surface: var(--d-bg2);
    --watch-surface-2: var(--d-elev);
    --watch-surface-3: var(--d-elev);
    --watch-border: var(--d-line);
    --watch-text: var(--d-text);
    --watch-muted: var(--d-text2);
    --watch-accent: var(--d-acc);
    --watch-accent-light: var(--d-acc-l);
}

/* the site's light look (.darken): same layout on light surfaces, the site's light violet */
.darken .nx-d {
    --d-bg: var(--bg);
    --d-bg2: #FFFFFF;
    --d-elev: #F7F6FA;
    --d-acc: #7E57D6;
    --d-acc2: #6E4BC1;
    --d-acc-l: #6E4BC1;
    --d-warm: #A8761F;
    --d-text: #15141D;
    --d-text2: #4D505E;
    --d-text3: #7A7D8C;
    --d-read: #2E3040;
    --d-line: rgba(20, 16, 40, .10);
    --d-line2: rgba(20, 16, 40, .17);
    --d-hot: rgba(126, 87, 214, .40);
    --d-soft: rgba(126, 87, 214, .08);
    --d-grad: linear-gradient(135deg, #9B74EE 0%, #6E4BC1 100%);
}

.nx-cine.nx-d { padding-bottom: 56px; background: var(--d-bg); color: var(--d-text); }
.nx-cine.nx-d .nx-cine-w { width: min(var(--d-wrap), calc(100% - 2 * var(--pad))); }
.nx-d .nx-i { stroke-width: 1.8; }

.nx-d-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- reveal (opacity only on anything that holds the player, so no
   transform ever sits on a fullscreen ancestor) ---------- */
@keyframes nxdRise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes nxdFade { from { opacity: 0; } to { opacity: 1; } }

/* =====================================================
   HERO — poster + player
===================================================== */
.nx-d-hero { position: relative; isolation: isolate; padding: 30px 0 4px; }
.nx-d-backdrop { position: absolute; z-index: -1; inset: 0 0 -120px; overflow: hidden; pointer-events: none; }
.nx-d-backdrop img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; filter: blur(30px) saturate(1.15) brightness(.42); opacity: .95; transform: scale(1.15); }
.nx-d-backdrop::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(55% 60% at 88% 92%, rgba(139, 92, 246, .16), transparent 70%),
        radial-gradient(40% 50% at 6% 10%, rgba(229, 184, 107, .07), transparent 70%),
        linear-gradient(180deg, color-mix(in srgb, var(--d-bg) 30%, transparent) 0%, color-mix(in srgb, var(--d-bg) 55%, transparent) 55%, var(--d-bg) 100%);
}
.darken .nx-d-backdrop img { filter: blur(30px) saturate(1.1) brightness(1.05); opacity: .35; }

.nx-d-hero-in { display: grid; grid-template-columns: clamp(220px, 23%, 320px) minmax(0, 1fr); align-items: start; gap: 24px; }

/* left column: the poster, the audience rating under it */
.nx-d-aside { display: grid; gap: 16px; min-width: 0; }
.nx-d-aside .nx-d-score { width: auto; animation: nxdRise .8s .12s var(--d-ease) backwards; }

/* poster: keeps its 2:3, the main play button sits on its lower edge */
.nx-d-poster {
    position: relative;
    margin: 0;
    overflow: hidden;
    border: 1px solid var(--d-line);
    border-radius: 16px;
    background: var(--d-elev);
    box-shadow: 0 30px 60px rgba(0, 0, 0, .55), 0 1px 0 rgba(255, 255, 255, .05) inset;
    transition: transform .6s var(--d-ease), box-shadow .6s var(--d-ease);
    animation: nxdRise .8s var(--d-ease) backwards;
}
.nx-d-poster img { width: 100%; height: auto; aspect-ratio: 2 / 3; object-fit: cover; transition: transform 1.2s var(--d-ease); }
.nx-d-poster:hover { transform: translateY(-4px); box-shadow: 0 38px 70px rgba(0, 0, 0, .6), 0 0 0 1px var(--d-hot); }
.nx-d-poster:hover img { transform: scale(1.035); }
.nx-d-poster-cta { position: absolute; left: 0; right: 0; bottom: 0; padding: 70px 14px 14px; background: linear-gradient(180deg, transparent 0%, rgba(8, 10, 15, .72) 45%, rgba(8, 10, 15, .92) 100%); }

.nx-d .nx-d-watch {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    height: 50px;
    padding: 0 18px;
    border-radius: 999px;
    background: var(--d-grad);
    box-shadow: 0 12px 30px rgba(134, 96, 224, .38), 0 1px 0 rgba(255, 255, 255, .25) inset;
    color: #fff !important;
    font-size: 15px;
    font-weight: 700;
    white-space: nowrap;
    transition: transform .25s var(--d-ease), box-shadow .25s var(--d-ease), filter .25s;
}
.nx-d-watch-i { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: rgba(255, 255, 255, .2); }
.nx-d-watch-i .nx-i { width: 12px; height: 12px; margin-left: 2px; }
.nx-d .nx-d-watch:hover { transform: translateY(-1px); filter: brightness(1.07); box-shadow: 0 16px 36px rgba(134, 96, 224, .48), 0 1px 0 rgba(255, 255, 255, .25) inset; }
.nx-d .nx-d-watch:active { transform: scale(.98); }

/* player frame: the server bar, the player and the hint below sit in one panel */
.nx-d-stage { min-width: 0; animation: nxdFade .9s .1s ease backwards; }
.nx-cine.nx-d .nx-w-player {
    position: relative;
    padding: 10px;
    border: 1px solid var(--d-line);
    border-radius: 18px;
    background: color-mix(in srgb, var(--d-bg2) 88%, transparent);
    box-shadow: 0 30px 70px rgba(0, 0, 0, .5), 0 1px 0 rgba(255, 255, 255, .04) inset;
}
.nx-cine.nx-d .nx-w-player .fullstory__player,
.nx-cine.nx-d .nx-w-player .tab-pane > iframe,
.nx-cine.nx-d .nx-w-player .tab-content { border-radius: 12px; }
.nx-cine.nx-d .nx-w-player .tab-content { overflow: hidden; background: #000; }
.nx-cine.nx-d .nx-srv { margin: 0 0 10px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
.nx-cine.nx-d .nx-srv-tab { height: 38px; border-radius: 10px; }
.nx-cine.nx-d .nx-srv-tab.is-on { box-shadow: 0 8px 20px rgba(134, 96, 224, .32); }
.nx-cine.nx-d .nx-srv-pick select { height: 38px; border-radius: 10px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B78CFF' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; background-size: 14px; }
.nx-cine.nx-d .nx-w-player .warning-box {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 10px 2px 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none !important;
    box-shadow: none;
    color: var(--d-text3) !important;
    font-family: var(--d-font-read);
    font-size: 12.5px;
    line-height: 1.5;
}
.nx-cine.nx-d .nx-w-player .warning-box::before { content: "i"; flex: 0 0 auto; display: grid; place-items: center; width: 16px; height: 16px; margin-top: 1px; border: 1px solid var(--d-line2); border-radius: 50%; color: var(--d-text2); font: 700 10px/1 var(--d-font-num); }
.nx-cine.nx-d .nx-w-admin { z-index: 6; }

/* the PlayerJS episode list, only when the server bar did not take over */
.nx-cine.nx-d .nx-d-eps { margin-top: 14px; padding: 14px; border: 1px solid var(--d-line); border-radius: 16px; background: var(--d-bg2); }
.nx-cine.nx-d .nx-d-eps .nx-ep-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 6px; max-height: 340px; overflow-y: auto; }
.nx-cine.nx-d .nx-d-eps[hidden] { display: none; }

/* =====================================================
   TITLE, FACTS, ACTIONS, RATINGS
===================================================== */
.nx-d-main { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 400px); align-items: start; gap: 48px; margin-top: 32px; }
.nx-d-col { min-width: 0; }
.nx-d-info { position: relative; animation: nxdRise .8s .15s var(--d-ease) backwards; }
.nx-d-head { display: grid; grid-template-columns: minmax(0, 1fr); align-items: end; gap: 18px 32px; }
.nx-d .nx-d-thumb { display: none; }
.nx-d-titles { min-width: 0; }
.nx-d-titleline { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
.nx-cine.nx-d .nx-d-title { margin: 0; color: var(--d-text); font-size: clamp(26px, 2.5vw, 38px) !important; font-weight: 700 !important; line-height: 1.18 !important; letter-spacing: 0; overflow-wrap: anywhere; text-wrap: balance; }
.nx-d-title-year { display: inline-flex; align-items: center; gap: 14px; color: var(--d-text2); font: 500 clamp(18px, 1.6vw, 24px)/1 var(--d-font-num); }
.nx-d-title-year::before { content: ""; width: 1px; height: .9em; background: var(--d-line2); }
.nx-d-q { display: inline-flex; align-items: center; height: 21px; padding: 0 7px; border: 1px solid color-mix(in srgb, var(--d-warm) 60%, transparent); border-radius: 5px; color: var(--d-warm); font: 700 10.5px/1 var(--d-font-num); letter-spacing: .08em; }
.nx-d-orig { margin: 8px 0 0; color: var(--d-text2); font: 500 13px/1.45 var(--d-font-num); letter-spacing: .14em; text-transform: uppercase; overflow-wrap: anywhere; }

/* actions: real handlers only (DLE favourites / complaint, neon.js share / download / trailer) */
.nx-d-actions { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 8px; }
.nx-d .nx-d-act:not(:has(> a)),
.nx-d .nx-d-act > a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 42px;
    margin: 0;
    padding: 0 16px;
    border: 1px solid var(--d-line2);
    border-radius: 12px;
    background: color-mix(in srgb, var(--d-bg2) 60%, transparent);
    color: var(--d-text) !important;
    font-family: var(--font);
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
    transition: border-color .22s var(--d-ease), background-color .22s var(--d-ease), color .22s, transform .15s;
}
.nx-d .nx-d-act:has(> a) { display: inline-flex; height: auto; padding: 0; border: 0; background: none; }
.nx-d .nx-d-act:empty { display: none; }
.nx-d .nx-d-act .nx-i { width: 17px; height: 17px; color: var(--d-text2); transition: color .22s, transform .22s var(--d-ease); }
.nx-d .nx-d-act:not(:has(> a)):hover,
.nx-d .nx-d-act > a:hover { border-color: var(--d-hot); background: var(--d-soft); color: var(--d-text) !important; }
.nx-d .nx-d-act:hover .nx-i { color: var(--d-acc); }
.nx-d .nx-d-act:active, .nx-d .nx-d-act > a:active { transform: scale(.97); }
.nx-d .nx-d-act .nx-i-fill { color: var(--d-acc); }
.nx-d .nx-d-act.is-done { border-color: color-mix(in srgb, var(--d-warm) 60%, transparent); color: var(--d-warm) !important; }
.nx-d .nx-d-act.is-done .nx-i { color: var(--d-warm); }
.nx-d .nx-d-act-icon > a, .nx-d .nx-d-act-icon:not(:has(> a)) { width: 42px; padding: 0; }
.nx-d .nx-d-act-watch { display: none !important; }

/* facts row */
.nx-d-factsrow { display: grid; grid-template-columns: minmax(0, 1fr); align-items: center; gap: 20px 28px; margin-top: 22px; padding: 16px 0; border-top: 1px solid var(--d-line); border-bottom: 1px solid var(--d-line); }
.nx-d-meta { display: flex; flex-wrap: wrap; align-items: center; row-gap: 14px; margin: 0; padding: 0; }
.nx-d-m { position: relative; display: flex; align-items: center; gap: 10px; min-width: 0; padding: 0 18px; list-style: none; }
.nx-d-m:first-child, .nx-d-m[hidden] + .nx-d-m { padding-left: 0; }
.nx-d-m[hidden] { display: none; }
.nx-d-m:not([hidden]) ~ .nx-d-m:not([hidden]) { padding-left: 18px; }
.nx-d-m:not([hidden]) ~ .nx-d-m:not([hidden])::before { content: ""; position: absolute; left: 0; top: 50%; width: 1px; height: 30px; margin-top: -15px; background: var(--d-line); }
.nx-d-m > .nx-i { width: 22px; height: 22px; color: var(--d-text2); stroke-width: 1.6; }
.nx-d-m > span { display: grid; min-width: 0; line-height: 1.25; }
.nx-d-m b { overflow: hidden; color: var(--d-text); font-size: 14px; font-weight: 600; white-space: nowrap; text-overflow: ellipsis; }
.nx-d-m em { color: var(--d-text3); font-size: 11.5px; font-style: normal; }
.nx-d-m-imdb > .nx-i { width: 24px; height: 24px; color: var(--d-warm); }
.nx-d-m-imdb > span { grid-template-columns: auto auto; column-gap: 9px; align-items: center; }
.nx-d-m-imdb b { grid-row: 1 / 3; font: 700 26px/1 var(--d-font-num); }
.nx-d-m-imdb em { align-self: end; color: var(--d-warm); font: 700 11px/1 var(--d-font-num); letter-spacing: .06em; }
.nx-d-m-imdb small { align-self: start; color: var(--d-text3); font: 500 11px/1.4 var(--d-font-num); }
.nx-d-age { display: inline-grid; place-items: center; min-width: 40px; height: 28px; padding: 0 7px; border: 1px solid var(--d-line2); border-radius: 7px; color: var(--d-text); font: 700 12.5px/1 var(--d-font-num); }
/* genres in the facts row: the /categories/ links only, the first two (nx-detail.js trims the rest) */
.nx-d-mgenres { font-size: 0 !important; }
.nx-d-mgenres a { display: none; }
.nx-d-mgenres a.is-g { display: inline; color: var(--d-text) !important; font-size: 14px; transition: color .2s; }
.nx-d-mgenres a.is-g:hover { color: var(--d-acc-l) !important; }
.nx-d-mgenres a.is-g ~ a.is-g::before { content: ", "; color: var(--d-text2); }

/* the site's audience rating (likes / dislikes) — distinct from IMDb */
.nx-d-score { display: grid; gap: 10px; width: 270px; padding: 13px 14px 12px; border: 1px solid var(--d-line); border-radius: 14px; background: linear-gradient(160deg, color-mix(in srgb, var(--d-elev) 90%, transparent), color-mix(in srgb, var(--d-bg2) 70%, transparent)); }
.nx-d-score-top { display: flex; align-items: center; gap: 12px; }
.nx-d-score-pct { display: inline-flex; align-items: baseline; gap: 5px; }
.nx-d-score-pct b { color: var(--d-text); font: 700 26px/1 var(--d-font-num); }
.nx-d-score-pct small { color: var(--d-text2); font-size: 11.5px; }
.nx-d-score-top { flex-wrap: wrap; row-gap: 8px; }
.nx-d-score-l { order: -1; display: flex; align-items: baseline; justify-content: space-between; gap: 10px; width: 100%; color: var(--d-text2); font-size: 12px; line-height: 1.35; }
.nx-d-score-l small { color: var(--d-text3); font: 500 11px/1.4 var(--d-font-num); }
.nx-d-score-bar { height: 4px; overflow: hidden; border-radius: 4px; background: var(--d-line); }
.nx-d-score-bar i { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--d-acc), var(--d-warm)); transition: width 1s var(--d-ease); }
.nx-d-score-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.nx-d-score-btns > a { display: block; color: inherit !important; }
.nx-d-vote { display: flex; align-items: center; justify-content: center; gap: 7px; height: 34px; border: 1px solid var(--d-line); border-radius: 9px; color: var(--d-text2); font-size: 12.5px; transition: border-color .2s, background-color .2s, color .2s; }
.nx-d-vote .nx-i { width: 16px; height: 16px; }
.nx-d-vote b { color: var(--d-text); font: 600 12.5px/1 var(--d-font-num); }
.nx-d-score-btns > a:hover .nx-d-vote { border-color: var(--d-hot); background: var(--d-soft); color: var(--d-acc-l); }
.nx-d-score-btns > a:hover .nx-d-vote.is-minus { border-color: var(--d-line2); background: color-mix(in srgb, var(--d-elev) 80%, transparent); color: var(--d-text); }
.nx-d-score-btns > a:active .nx-d-vote { transform: scale(.97); }

/* =====================================================
   SECTION TABS — anchors, the active one follows the scroll (neon.js)
===================================================== */
.nx-cine.nx-d .nx-cine-nav { margin-top: 24px; background: color-mix(in srgb, var(--d-bg) 88%, transparent); box-shadow: 0 1px 0 var(--d-line); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.nx-cine.nx-d .nx-cine-nav > .nx-cine-w { gap: 4px; padding: 8px 0; }
.nx-cine.nx-d .nx-cine-nav a {
    gap: 8px;
    height: 42px;
    padding: 0 16px;
    border-radius: 11px;
    color: var(--d-text2) !important;
    font-size: 13.5px;
    font-weight: 600;
    transition: color .25s, background-color .25s var(--d-ease), box-shadow .25s var(--d-ease);
}
.nx-cine.nx-d .nx-cine-nav a::after { display: none; }
.nx-cine.nx-d .nx-cine-nav a .nx-i { display: block; width: 17px; height: 17px; color: var(--d-text3); transition: color .25s; }
.nx-cine.nx-d .nx-cine-nav a:hover { background: color-mix(in srgb, var(--d-elev) 70%, transparent); color: var(--d-text) !important; }
.nx-cine.nx-d .nx-cine-nav a.is-active { background: linear-gradient(135deg, rgba(134, 96, 224, .22), rgba(139, 92, 246, .08)); box-shadow: inset 0 0 0 1px var(--d-hot); color: var(--d-text) !important; }
.nx-cine.nx-d .nx-cine-nav a.is-active .nx-i { color: var(--d-acc); }
.nx-cine.nx-d .nx-cine-nav a:focus-visible { outline: 2px solid var(--d-acc); outline-offset: -2px; }

/* =====================================================
   SYNOPSIS + DETAILS
===================================================== */
.nx-d-synopsis { margin-top: 34px; }
.nx-d-score-slot:empty { display: none; }
.nx-cine.nx-d .nx-d-h,
.nx-cine.nx-d .nx-d-sh { display: flex; align-items: center; gap: 12px; margin: 0 0 16px; color: var(--d-text); font-size: 19px !important; font-weight: 700 !important; line-height: 1.3 !important; }
.nx-d-h-i { display: grid; place-items: center; flex: 0 0 auto; width: 32px; height: 32px; border-radius: 10px; background: var(--d-soft); color: var(--d-acc); }
.nx-d-h-i .nx-i { width: 17px; height: 17px; }

.nx-cine.nx-d .nx-d-text { max-width: 74ch; color: var(--d-read); font-family: var(--d-font-read); font-size: 15.5px; line-height: 1.85; }
.nx-cine.nx-d .nx-d-text p { margin: 0 0 .85em; }
.nx-cine.nx-d .nx-d-text p:last-child { margin-bottom: 0; }
.nx-cine.nx-d .nx-d-text.is-clamped { -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent 100%); mask-image: linear-gradient(180deg, #000 55%, transparent 100%); }
.nx-cine.nx-d .nx-d-more { margin-top: 12px; color: var(--d-acc-l); font-size: 13px; font-weight: 600; }
.nx-cine.nx-d .nx-d-more:hover { color: var(--d-text); }

.nx-cine.nx-d .nx-d-genres { gap: 8px; margin-top: 22px; }
.nx-cine.nx-d .nx-d-genres a[href*="/categories/"] { height: 32px; padding: 0 15px; border: 1px solid var(--d-line2); border-radius: 999px; background: transparent; color: var(--d-text) !important; font-size: 12.5px; font-weight: 500; transition: border-color .22s, background-color .22s, color .22s; }
.nx-cine.nx-d .nx-d-genres a[href*="/categories/"]:hover { border-color: var(--d-hot); background: var(--d-soft); color: var(--d-text) !important; }
.nx-cine.nx-d .nx-d-genres a.is-first { border-color: color-mix(in srgb, var(--d-warm) 55%, transparent); background: color-mix(in srgb, var(--d-warm) 10%, transparent); color: var(--d-warm) !important; }

.nx-cine.nx-d .nx-d-keys { margin: 22px 0 0; padding: 16px 0 0; border: 0; border-top: 1px solid var(--d-line); border-radius: 0; background: none; }

.nx-cine.nx-d .nx-d-facts { padding: 22px 24px 14px; border: 1px solid var(--d-line); border-radius: 18px; background: linear-gradient(180deg, var(--d-bg2), color-mix(in srgb, var(--d-bg2) 50%, var(--d-bg))); }
.nx-cine.nx-d .nx-d-facts .nx-d-h { margin-bottom: 8px; }
.nx-cine.nx-d .nx-d-facts dl { display: grid; gap: 0; margin: 0; }
.nx-cine.nx-d .nx-d-facts dl > div { display: grid; grid-template-columns: 150px minmax(0, 1fr); align-items: baseline; gap: 12px; min-height: 0; padding: 11px 0; border-bottom: 1px solid var(--d-line); }
.nx-cine.nx-d .nx-d-facts dl > div:last-child { border-bottom: 0; }
.nx-cine.nx-d .nx-d-facts dt { color: var(--d-text3); font-size: 12.5px; font-weight: 500; }
.nx-cine.nx-d .nx-d-facts dd { margin: 0; color: var(--d-text); font-size: 13.5px; line-height: 1.5; overflow-wrap: anywhere; }
.nx-cine.nx-d .nx-d-facts dd a { color: var(--d-text) !important; transition: color .2s; }
.nx-cine.nx-d .nx-d-facts dd a:hover { color: var(--d-acc-l) !important; }

/* =====================================================
   SECTIONS BELOW
===================================================== */
.nx-d-block { margin-top: 48px; }
.nx-d-sechead { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.nx-cine.nx-d .nx-d-sechead .nx-d-sh { margin: 0; }
.nx-d .nx-d-all { display: inline-flex; align-items: center; gap: 6px; color: var(--d-acc-l) !important; font-size: 13px; font-weight: 600; white-space: nowrap; }
.nx-d .nx-d-all .nx-i { width: 16px; height: 16px; transition: transform .25s var(--d-ease); }
.nx-d .nx-d-all:hover .nx-i { transform: translateX(3px); }
.nx-d-count { display: inline-grid; place-items: center; min-width: 30px; height: 24px; padding: 0 9px; border-radius: 999px; background: var(--d-soft); color: var(--d-acc-l); font: 700 12px/1 var(--d-font-num); }

/* gallery arrows (neon.js adds them to .nx-carousel) */
.nx-d .nx-arrow { width: 40px; height: 40px; border-color: var(--d-line2); background: color-mix(in srgb, var(--d-bg2) 92%, transparent); color: var(--d-text); }
.nx-d .nx-arrow:hover { border-color: var(--d-hot); background: var(--d-acc2); color: #fff; }

/* parts / seasons that are their own posts */
.nx-cine.nx-d .nx-d-parts[hidden] { display: none; }
.nx-cine.nx-d .nx-d-parts-row { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 290px); gap: 14px; max-height: none; margin: 0; padding: 2px 0 6px; overflow-x: auto; scrollbar-width: none; scroll-snap-type: x proximity; }
.nx-cine.nx-d .nx-d-parts-row::-webkit-scrollbar { display: none; }
.nx-cine.nx-d .nx-d-parts .nx-ep { display: grid; grid-template-columns: 112px minmax(0, 1fr); grid-template-rows: auto auto; align-content: center; column-gap: 12px; row-gap: 3px; padding: 6px; border: 1px solid var(--d-line); border-radius: 14px; background: var(--d-bg2); color: var(--d-text) !important; scroll-snap-align: start; transition: border-color .25s, transform .25s var(--d-ease); }
.nx-cine.nx-d .nx-d-parts .nx-ep:hover { border-color: var(--d-hot); transform: translateY(-2px); }
.nx-cine.nx-d .nx-d-parts .nx-ep-media { position: relative; grid-row: 1 / 3; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 9px; background: var(--d-elev); }
.nx-cine.nx-d .nx-d-parts .nx-ep-media img { width: 100%; height: 100%; object-fit: cover; }
.nx-cine.nx-d .nx-d-parts .nx-ep-play { display: none; }
.nx-cine.nx-d .nx-d-parts .nx-ep-title { align-self: end; overflow: hidden; font-size: 13px; font-weight: 600; line-height: 1.3; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.nx-cine.nx-d .nx-d-parts .nx-ep-len { align-self: start; color: var(--d-text3); font-size: 12px; }

/* ---------- cast: portrait gallery ---------- */
.nx-cine.nx-d .nx-d-castcar { position: relative; }
.nx-cine.nx-d .nx-w-cast-row.nx-row { --cols: 10; --gap: 16px; padding: 6px 0 4px; }
.nx-cine.nx-d .nx-w-actor { overflow: visible; border: 0; border-radius: 0; background: none; text-align: center; transform: none; }
.nx-cine.nx-d .nx-w-actor:hover { border: 0; transform: none; filter: none; }
.nx-cine.nx-d .nx-w-actor img { width: 100%; aspect-ratio: 4 / 5; border: 1px solid var(--d-line); border-radius: 14px; background: var(--d-elev); object-fit: cover; object-position: center 20%; box-shadow: 0 10px 24px rgba(0, 0, 0, .3); transition: transform .45s var(--d-ease), box-shadow .45s var(--d-ease), border-color .3s; }
.nx-cine.nx-d .nx-w-actor:hover img { transform: translateY(-4px); border-color: var(--d-hot); box-shadow: 0 18px 32px rgba(0, 0, 0, .45); }
.nx-cine.nx-d .nx-w-actor span { display: grid; gap: 3px; padding: 11px 2px 0; }
.nx-cine.nx-d .nx-w-actor b { overflow: hidden; color: var(--d-text); font-size: 13px; font-weight: 600; white-space: nowrap; text-overflow: ellipsis; transition: color .2s; }
.nx-cine.nx-d .nx-w-actor:hover b { color: var(--d-acc-l); }
.nx-cine.nx-d .nx-w-actor small { overflow: hidden; color: var(--d-text3); font-size: 11.5px; white-space: nowrap; text-overflow: ellipsis; }
.nx-cine.nx-d .nx-d-castcar .nx-arrow { top: 42%; }

/* ---------- comments beside similar titles ---------- */
.nx-d-bottom { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 480px); align-items: start; gap: 48px; padding-top: 44px; border-top: 1px solid var(--d-line); }
.nx-d-talk { min-width: 0; }
.nx-cine.nx-d .nx-d-talk .nx-w-comments { margin: 0; }
.nx-cine.nx-d .nx-d-talk .nx-cform { border-color: var(--d-line); border-radius: 16px; background: var(--d-bg2); }
.nx-cine.nx-d .nx-d-talk .nx-cform-ico { background: var(--d-soft); color: var(--d-acc); }

.nx-d-side { display: grid; gap: 40px; min-width: 0; }
.nx-cine.nx-d .nx-d-grid.nx-row { display: grid; grid-auto-flow: row; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-columns: auto; gap: 20px 14px; padding: 0; overflow: visible; scroll-snap-type: none; }
.nx-cine.nx-d .nx-d-grid .nx-card-media { border-color: var(--d-line); border-radius: 14px; box-shadow: 0 12px 26px rgba(0, 0, 0, .35); transition: transform .45s var(--d-ease), box-shadow .45s var(--d-ease), border-color .3s; }
.nx-cine.nx-d .nx-d-grid .nx-card-media img { transition: transform 1s var(--d-ease); }
.nx-cine.nx-d .nx-d-grid .nx-card:hover .nx-card-media { transform: translateY(-3px); border-color: var(--d-hot); box-shadow: 0 20px 36px rgba(0, 0, 0, .5); }
.nx-cine.nx-d .nx-d-grid .nx-card:hover .nx-card-media img { transform: scale(1.05); }
.nx-cine.nx-d .nx-d-grid .nx-card-title { margin-top: 9px; font-size: 13px; }
.nx-cine.nx-d .nx-d-grid .nx-card-sub { color: var(--d-text3); }

/* jumps land below the header and the sticky tabs */
.nx-cine.nx-d #nx-facts { scroll-margin-top: calc(var(--header-h, 58px) + 72px); }
.nx-cine.nx-d #nx-desc, .nx-cine.nx-d #nx-cast, .nx-cine.nx-d #nx-comments, .nx-cine.nx-d #nx-related, .nx-cine.nx-d #nx-also { scroll-margin-top: calc(var(--header-h, 58px) + 72px); }

/* =====================================================
   RESPONSIVE
===================================================== */
@media (max-width: 1279px) {
    .nx-d-main { grid-template-columns: minmax(0, 1fr) minmax(0, 340px); gap: 36px; }
    .nx-d-bottom { grid-template-columns: minmax(0, 1fr) minmax(0, 380px); gap: 36px; }
    .nx-cine.nx-d .nx-d-grid.nx-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .nx-cine.nx-d .nx-w-cast-row.nx-row { --cols: 8; }
}

/* tablet: the player takes the full width, the poster moves next to the title */
@media (max-width: 1023px) {
    .nx-d-hero { padding-top: 20px; }
    .nx-d-hero-in { grid-template-columns: minmax(0, 1fr); }
    .nx-d .nx-d-poster { display: none; }
    .nx-d-aside:not(:has(.nx-d-score)) { display: none; }
    .nx-d-head { grid-template-columns: 110px minmax(0, 1fr); align-items: center; gap: 16px 20px; }
    .nx-d .nx-d-thumb { display: block; grid-row: 1; width: 110px; height: auto; aspect-ratio: 2 / 3; border: 1px solid var(--d-line); border-radius: 12px; object-fit: cover; box-shadow: 0 16px 30px rgba(0, 0, 0, .45); }
    .nx-d-actions { grid-column: 1 / -1; }
    .nx-d .nx-d-act-watch { display: inline-flex !important; }
    .nx-d .nx-d-act-watch { border-color: transparent !important; background: var(--d-grad) !important; box-shadow: 0 10px 24px rgba(134, 96, 224, .32); color: #fff !important; }
    .nx-d .nx-d-act-watch .nx-i { width: 13px; height: 13px; color: #fff !important; }
    /* toolbar: the play button on its own row, the rest as equal icon tiles */
    .nx-d-actions { display: flex; flex-wrap: wrap; gap: 8px; }
    .nx-d .nx-d-act-watch { flex: 1 0 100%; height: 48px !important; font-size: 14.5px !important; }
    .nx-d .nx-d-actions > .nx-d-act:not(.nx-d-act-watch) { flex: 1 1 0; min-width: 0; }
    .nx-d .nx-d-actions > .nx-d-act:not(.nx-d-act-watch):not(:has(> a)),
    .nx-d .nx-d-actions > .nx-d-act:not(.nx-d-act-watch) > a { flex-direction: column; gap: 4px; width: 100%; height: 58px; padding: 0 4px; font-size: 11px; font-weight: 500; }
    .nx-d .nx-d-actions > .nx-d-act span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
    .nx-d .nx-d-actions > .nx-d-act.nx-d-act-icon { flex: 0 0 52px; }

    .nx-d-factsrow { grid-template-columns: minmax(0, 1fr); }
    .nx-d-score { width: 100%; max-width: 420px; }
    .nx-d-main { grid-template-columns: minmax(0, 1fr); gap: 32px; margin-top: 24px; }
    .nx-d-bottom { grid-template-columns: minmax(0, 1fr); }
    .nx-d-side { order: -1; }
    .nx-cine.nx-d .nx-d-grid.nx-row { grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: calc((100% - 3 * 14px) / 4); gap: 14px; overflow-x: auto; scroll-snap-type: x proximity; }
    .nx-cine.nx-d .nx-w-cast-row.nx-row { --cols: 6; }
}

@media (max-width: 767px) {
    .nx-d-hero { padding-top: 14px; }
    .nx-cine.nx-d .nx-w-player { padding: 6px; border-radius: 14px; }
    .nx-cine.nx-d .nx-w-player .warning-box { font-size: 12px; }
    .nx-d-head { grid-template-columns: 84px minmax(0, 1fr); gap: 14px; }
    .nx-d .nx-d-thumb { width: 84px; border-radius: 10px; }
    .nx-cine.nx-d .nx-d-title { font-size: 23px !important; }
    .nx-d-title-year { font-size: 17px; gap: 10px; }
    .nx-d-orig { font-size: 12px; letter-spacing: .1em; }

    .nx-d-factsrow { margin-top: 18px; padding: 14px 0; }
    .nx-d-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 12px; }
    .nx-d-m, .nx-d-m:not([hidden]) ~ .nx-d-m:not([hidden]) { padding: 0; }
    .nx-d-m:not([hidden]) ~ .nx-d-m:not([hidden])::before { display: none; }
    .nx-d-m-imdb { grid-column: 1 / -1; }
    .nx-d-score { max-width: none; }

    .nx-cine.nx-d .nx-cine-nav { margin-top: 20px; }
    .nx-cine.nx-d .nx-cine-nav > .nx-cine-w { padding: 6px 0; }
    .nx-cine.nx-d .nx-cine-nav a { height: 38px; padding: 0 12px; font-size: 13px; }

    .nx-d-synopsis { margin-top: 28px; }
    .nx-cine.nx-d .nx-d-text { font-size: 15px; line-height: 1.8; }
    .nx-cine.nx-d .nx-d-facts { padding: 18px 16px 8px; }
    .nx-cine.nx-d .nx-d-facts dl > div { grid-template-columns: 128px minmax(0, 1fr); }

    .nx-d-block { margin-top: 36px; }
    .nx-d-bottom { gap: 36px; padding-top: 32px; }
    .nx-cine.nx-d .nx-w-cast-row.nx-row { --cols: 3.4; --gap: 12px; }
    .nx-cine.nx-d .nx-d-grid.nx-row { grid-auto-columns: calc((100% - 2 * 12px) / 2.4); gap: 12px; }
    .nx-cine.nx-d .nx-d-parts-row { grid-auto-columns: minmax(240px, 82%); }
    .nx-d .nx-arrow { display: none; }
}

@media (max-width: 520px) {
    .nx-d .nx-d-actions > .nx-d-act:not(.nx-d-act-watch) { flex: 1 1 28%; }
    .nx-d .nx-d-actions > .nx-d-act.nx-d-act-icon { flex: 0 0 58px; }
    .nx-d-m-genre b { white-space: normal; }
}

@media (prefers-reduced-motion: reduce) {
    .nx-d *, .nx-d *::before, .nx-d *::after { animation: none !important; transition-duration: .01ms !important; }
    .nx-d-poster:hover, .nx-d-poster:hover img, .nx-cine.nx-d .nx-w-actor:hover img, .nx-cine.nx-d .nx-d-grid .nx-card:hover .nx-card-media, .nx-cine.nx-d .nx-d-grid .nx-card:hover .nx-card-media img { transform: none; }
}

/* the aside's sections carry .nx-section for neon.js's empty check only */
.nx-cine.nx-d .nx-d-similar { margin: 0; padding: 0; }
.darken .nx-cine.nx-d .nx-w-player, .darken .nx-d-poster { box-shadow: 0 22px 50px rgba(30, 24, 60, .14); }

/* =====================================================
   root-59 · 2026-10-09 · "დეტალური ინფორმაცია" across the full width
   The facts box no longer sits in a 400px side column: it spans from the
   poster's left edge to the player's right edge (the width of .nx-d-main),
   under the synopsis, with its rows in three even columns.
===================================================== */
.nx-cine.nx-d .nx-d-main { grid-template-columns: minmax(0, 1fr); gap: 36px; }
.nx-cine.nx-d .nx-d-facts { padding: 24px 28px 10px; }
.nx-cine.nx-d .nx-d-facts .nx-d-h { margin-bottom: 6px; }
.nx-cine.nx-d .nx-d-facts dl { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 40px; }
.nx-cine.nx-d .nx-d-facts dl > div { grid-template-columns: 150px minmax(0, 1fr); padding: 13px 0; border-bottom: 1px solid var(--d-line); }
/* no rule under the last row, whatever the count (cells of the last row of 3) */
.nx-cine.nx-d .nx-d-facts dl > div:nth-child(3n+1):nth-last-child(-n+3),
.nx-cine.nx-d .nx-d-facts dl > div:nth-child(3n+1):nth-last-child(-n+3) ~ div { border-bottom: 0; }
@media (max-width: 1100px) {
    .nx-cine.nx-d .nx-d-facts dl { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; }
    .nx-cine.nx-d .nx-d-facts dl > div { border-bottom: 1px solid var(--d-line) !important; }
    .nx-cine.nx-d .nx-d-facts dl > div:nth-child(2n+1):nth-last-child(-n+2),
    .nx-cine.nx-d .nx-d-facts dl > div:nth-child(2n+1):nth-last-child(-n+2) ~ div { border-bottom: 0 !important; }
}
@media (max-width: 680px) {
    .nx-cine.nx-d .nx-d-facts { padding: 18px 16px 6px; }
    .nx-cine.nx-d .nx-d-facts dl { grid-template-columns: minmax(0, 1fr); }
    .nx-cine.nx-d .nx-d-facts dl > div { grid-template-columns: 128px minmax(0, 1fr); padding: 11px 0; }
    .nx-cine.nx-d .nx-d-facts dl > div { border-bottom: 1px solid var(--d-line) !important; }
    .nx-cine.nx-d .nx-d-facts dl > div:last-child { border-bottom: 0 !important; }
}

/* =====================================================
   root-59 · 2026-10-09 · cinematic redesign (reference image)
   1. the title's actions live under the poster as an icon row
   2. "დეტალური ინფორმაცია" | "სეზონები / სერიები" side by side
      (films have no episode panel: the facts box takes the row)
   3. episode rows: thumbnail, name, state; the playing one is lit
   4. trailer row (only when the post has a trailer)
   Supersedes the full-width facts block above.
===================================================== */

/* 1. poster actions */
.nx-cine.nx-d .nx-d-quick { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 2px; margin-top: 10px; padding: 6px; border: 1px solid var(--d-line); border-radius: 16px; background: color-mix(in srgb, var(--d-bg2) 88%, transparent); }
.nx-cine.nx-d .nx-d-quick .nx-d-act:empty { display: none; }
.nx-cine.nx-d .nx-d-quick .nx-d-act:not(:has(> a)),
.nx-cine.nx-d .nx-d-quick .nx-d-act > a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; width: 100%; height: 62px; min-width: 0; padding: 0 2px; border: 0; border-radius: 12px; background: transparent; color: var(--d-text2) !important; font-size: 11px; font-weight: 600; line-height: 1.15; text-align: center; white-space: normal; cursor: pointer; transition: background-color .2s, color .2s; }
.nx-cine.nx-d .nx-d-quick .nx-d-act:has(> a) { display: flex; height: auto; padding: 0; border: 0; background: none; }
.nx-cine.nx-d .nx-d-quick .nx-d-act span { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nx-cine.nx-d .nx-d-quick .nx-d-act .nx-i { width: 19px; height: 19px; margin: 0; color: var(--d-text2); }
.nx-cine.nx-d .nx-d-quick .nx-d-act:not(:has(> a)):hover,
.nx-cine.nx-d .nx-d-quick .nx-d-act > a:hover { background: var(--d-soft); color: var(--d-text) !important; }
.nx-cine.nx-d .nx-d-quick .nx-d-act:hover .nx-i { color: var(--d-acc); }
.nx-cine.nx-d .nx-d-quick .nx-d-act:focus-visible, .nx-cine.nx-d .nx-d-quick .nx-d-act > a:focus-visible { outline: 2px solid var(--d-acc); outline-offset: -2px; }

/* 2. facts | episodes */
.nx-cine.nx-d .nx-d-main { grid-template-columns: minmax(0, 1fr) minmax(0, 420px); align-items: stretch; column-gap: 24px; row-gap: 28px; }
.nx-cine.nx-d .nx-d-main > .nx-d-col { grid-column: 1 / -1; }
.nx-cine.nx-d .nx-d-main:not(:has(> .nx-d-eppanel:not([hidden]))) > .nx-d-facts { grid-column: 1 / -1; }
.nx-cine.nx-d .nx-d-main:has(> .nx-d-eppanel:not([hidden])) .nx-d-facts dl { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; }
.nx-cine.nx-d .nx-d-main:has(> .nx-d-eppanel:not([hidden])) .nx-d-facts dl > div { border-bottom: 1px solid var(--d-line); }
.nx-cine.nx-d .nx-d-main:has(> .nx-d-eppanel:not([hidden])) .nx-d-facts dl > div:nth-child(2n+1):nth-last-child(-n+2),
.nx-cine.nx-d .nx-d-main:has(> .nx-d-eppanel:not([hidden])) .nx-d-facts dl > div:nth-child(2n+1):nth-last-child(-n+2) ~ div { border-bottom: 0; }

/* 3. the episode panel */
.nx-cine.nx-d .nx-d-eppanel { display: flex; flex-direction: column; min-width: 0; padding: 22px 18px 14px; border: 1px solid var(--d-line); border-radius: 18px; background: linear-gradient(180deg, var(--d-bg2), color-mix(in srgb, var(--d-bg2) 55%, var(--d-bg))); }
.nx-cine.nx-d .nx-d-eppanel[hidden] { display: none; }
.nx-cine.nx-d .nx-d-eph { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 4px 10px; }
.nx-cine.nx-d .nx-d-eph .nx-d-h { margin: 0; }
.nx-cine.nx-d .nx-d-epcount { flex: 0 0 auto; color: var(--d-text3); font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; }
.nx-cine.nx-d .nx-d-epseasons { display: flex; gap: 6px; margin: 0 4px 10px; overflow-x: auto; scrollbar-width: none; }
.nx-cine.nx-d .nx-d-epseasons[hidden] { display: none; }
.nx-cine.nx-d .nx-d-epseason { flex: 0 0 auto; height: 32px; padding: 0 13px; border: 1px solid var(--d-line2); border-radius: 10px; background: transparent; color: var(--d-text2); font: 600 12.5px var(--font); cursor: pointer; transition: border-color .2s, color .2s, background-color .2s; }
.nx-cine.nx-d .nx-d-epseason:hover { border-color: var(--d-hot); color: var(--d-text); }
.nx-cine.nx-d .nx-d-epseason.is-on { border-color: transparent; background: var(--d-grad); color: #fff; }
.nx-cine.nx-d .nx-d-eplist { display: grid; gap: 4px; flex: 1 1 auto; min-height: 0; max-height: 452px; margin: 0 -6px; padding: 2px 6px 4px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--d-acc) 55%, transparent) transparent; }
.nx-cine.nx-d .nx-d-ep { position: relative; display: grid; grid-template-columns: 92px minmax(0, 1fr) auto; align-items: center; gap: 12px; width: 100%; min-height: 64px; padding: 6px 10px 6px 6px; border: 1px solid transparent; border-radius: 12px; background: transparent; color: var(--d-text); text-align: left; cursor: pointer; transition: background-color .2s, border-color .2s; }
.nx-cine.nx-d .nx-d-ep:hover { background: color-mix(in srgb, var(--d-elev) 80%, transparent); }
.nx-cine.nx-d .nx-d-ep:focus-visible { outline: 2px solid var(--d-acc); outline-offset: -2px; }
.nx-cine.nx-d .nx-d-ep.is-on { border-color: var(--d-hot); background: linear-gradient(90deg, var(--d-soft), color-mix(in srgb, var(--d-soft) 40%, transparent)); box-shadow: 0 0 0 1px color-mix(in srgb, var(--d-acc) 18%, transparent) inset; }
.nx-cine.nx-d .nx-d-ep-media { position: relative; display: block; width: 92px; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 8px; background: var(--d-elev); }
.nx-cine.nx-d .nx-d-ep-media img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 25%; filter: saturate(.9) brightness(.8); transition: filter .2s; }
.nx-cine.nx-d .nx-d-ep:hover .nx-d-ep-media img, .nx-cine.nx-d .nx-d-ep.is-on .nx-d-ep-media img { filter: none; }
.nx-cine.nx-d .nx-d-ep-play { position: absolute; left: 50%; top: 50%; display: grid; place-items: center; width: 26px; height: 26px; border: 1px solid rgba(255, 255, 255, .35); border-radius: 50%; background: rgba(8, 10, 16, .55); color: #fff; opacity: 0; transform: translate(-50%, -50%) scale(.9); transition: opacity .2s, transform .2s; }
.nx-cine.nx-d .nx-d-ep-play .nx-i { width: 11px; height: 11px; margin-left: 2px; }
.nx-cine.nx-d .nx-d-ep:hover .nx-d-ep-play, .nx-cine.nx-d .nx-d-ep.is-on .nx-d-ep-play { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.nx-cine.nx-d .nx-d-ep.is-on .nx-d-ep-play { border-color: transparent; background: var(--d-grad); }
.nx-cine.nx-d .nx-d-ep-txt { display: grid; gap: 3px; min-width: 0; }
.nx-cine.nx-d .nx-d-ep-txt b { overflow: hidden; color: var(--d-text); font-size: 13.5px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.nx-cine.nx-d .nx-d-ep-txt small { color: var(--d-text3); font-size: 11.5px; }
.nx-cine.nx-d .nx-d-ep.is-on .nx-d-ep-txt small { color: var(--d-acc-l); font-weight: 600; }
.nx-cine.nx-d .nx-d-ep-seen { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: color-mix(in srgb, #5EE0A0 16%, transparent); color: #5EE0A0; font-size: 11px; font-weight: 800; }

/* 4. trailer */
.nx-cine.nx-d .nx-d-trailers .nx-d-tcard { position: relative; display: block; width: min(100%, 360px); aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid var(--d-line); border-radius: 14px; background: var(--d-elev); }
.nx-cine.nx-d .nx-d-tcard img { display: block; width: 100%; height: 100%; object-fit: cover; transform: scale(1.02); transition: transform .4s var(--d-ease), filter .3s; filter: brightness(.82); }
.nx-cine.nx-d .nx-d-tcard::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(8, 10, 16, .85)); }
.nx-cine.nx-d .nx-d-tplay { position: absolute; z-index: 1; left: 50%; top: 50%; display: grid; place-items: center; width: 52px; height: 52px; border: 1px solid rgba(255, 255, 255, .35); border-radius: 50%; background: rgba(8, 10, 16, .5); color: #fff; transform: translate(-50%, -50%); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: background-color .25s, transform .25s; }
.nx-cine.nx-d .nx-d-tplay .nx-i { width: 18px; height: 18px; margin-left: 3px; }
.nx-cine.nx-d .nx-d-tlabel { position: absolute; z-index: 1; left: 14px; bottom: 11px; color: #fff; font-size: 13px; font-weight: 700; }
.nx-cine.nx-d .nx-d-tcard:hover img { transform: scale(1.06); filter: none; }
.nx-cine.nx-d .nx-d-tcard:hover .nx-d-tplay { background: var(--d-grad); border-color: transparent; transform: translate(-50%, -50%) scale(1.06); }
.nx-cine.nx-d .nx-d-tcard:focus-visible { outline: 2px solid var(--d-acc); outline-offset: 3px; }

@media (max-width: 1279px) {
    .nx-cine.nx-d .nx-d-main { grid-template-columns: minmax(0, 1fr) minmax(0, 360px); }
    .nx-cine.nx-d .nx-d-main:has(> .nx-d-eppanel:not([hidden])) .nx-d-facts dl { grid-template-columns: minmax(0, 1fr); }
    .nx-cine.nx-d .nx-d-main:has(> .nx-d-eppanel:not([hidden])) .nx-d-facts dl > div { border-bottom: 1px solid var(--d-line) !important; }
    .nx-cine.nx-d .nx-d-main:has(> .nx-d-eppanel:not([hidden])) .nx-d-facts dl > div:last-child { border-bottom: 0 !important; }
}
@media (max-width: 1023px) {
    .nx-cine.nx-d .nx-d-main { grid-template-columns: minmax(0, 1fr); }
    .nx-cine.nx-d .nx-d-main > * { grid-column: 1 / -1 !important; }
    .nx-cine.nx-d .nx-d-eplist { max-height: 380px; }
}
@media (max-width: 680px) {
    .nx-cine.nx-d .nx-d-eppanel { padding: 18px 12px 10px; }
    .nx-cine.nx-d .nx-d-ep { grid-template-columns: 80px minmax(0, 1fr) auto; gap: 10px; }
    .nx-cine.nx-d .nx-d-ep-media { width: 80px; }
    .nx-cine.nx-d .nx-d-quick .nx-d-act:not(:has(> a)), .nx-cine.nx-d .nx-d-quick .nx-d-act > a { height: 56px; font-size: 10.5px; }
}
/* poster actions: four in a 2 × 2 grid, icon beside a readable label (the trailer has its own row and tab) */
.nx-cine.nx-d .nx-d-quick { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; }
.nx-cine.nx-d .nx-d-quick > [data-nx-trailer] { display: none !important; }
.nx-cine.nx-d .nx-d-quick .nx-d-act:not(:has(> a)),
.nx-cine.nx-d .nx-d-quick .nx-d-act > a { flex-direction: row; justify-content: flex-start; gap: 8px; height: 42px; padding: 0 10px; font-size: 12px; text-align: left; }
.nx-cine.nx-d .nx-d-quick .nx-d-act .nx-i { flex: 0 0 auto; width: 17px; height: 17px; }
@media (max-width: 680px) {
    .nx-cine.nx-d .nx-d-quick .nx-d-act:not(:has(> a)), .nx-cine.nx-d .nx-d-quick .nx-d-act > a { height: 42px; font-size: 12px; }
}
/* tablet / phone: the action row under the title, four across, icon above label */
.nx-d-quick-slot:empty { display: none; }
@media (max-width: 1023px) {
    .nx-cine.nx-d .nx-d-quick-slot { margin-top: 16px; }
    .nx-cine.nx-d .nx-d-quick-slot .nx-d-quick { grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; }
    .nx-cine.nx-d .nx-d-quick-slot .nx-d-quick .nx-d-act:not(:has(> a)),
    .nx-cine.nx-d .nx-d-quick-slot .nx-d-quick .nx-d-act > a { flex-direction: column; justify-content: center; gap: 5px; height: 60px; padding: 0 4px; font-size: 11.5px; text-align: center; }
}
@media (max-width: 1023px) {
    .nx-cine.nx-d .nx-d-quick-slot .nx-d-quick .nx-d-act span { overflow: visible; white-space: normal; line-height: 1.15; }
    .nx-cine.nx-d .nx-d-quick-slot .nx-d-quick .nx-d-act:not(:has(> a)), .nx-cine.nx-d .nx-d-quick-slot .nx-d-quick .nx-d-act > a { height: 64px; font-size: 11px; }
}