/* ==========================================================================
   xVibe Movies & Series (module) - Netflix-like rows, hero, hover cards, details window, player, manager
   ========================================================================== */
.mvx, .mvx-hover, .mvx-modal, .mvx-gate, .mvp-body { --mv-red: #e50914; --mv-bg: #141414; --mv-card: #181818; --mv-pop: #2f2f2f; --mv-txt: #fff; --mv-txt2: #bcbcbc; --mv-green: #46d369; }
.mvx *, .mvx-hover *, .mvx-modal *, .mvx-gate *, .mvp-body * { box-sizing: border-box; }
.mvx svg, .mvx-hover svg, .mvx-modal svg, .mvx-gate svg, .mvp svg { width: 1em; height: 1em; fill: currentColor; display: block; }
html.mvx-noscroll, html.mvx-noscroll body { overflow: hidden !important; }

/* ---------------------------------------------------------------- buttons, badges */
.mvx-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 42px; padding: 0 22px 0 18px; border-radius: 5px; border: 0; font-size: 17px; font-weight: 700; cursor: pointer; text-decoration: none !important; white-space: nowrap; transition: background .15s, opacity .15s; }
.mvx-btn svg, .mvx-btn .material-icons { font-size: 28px; width: 28px; height: 28px; }
.mvx-btn-play, .mvx-btn-play:hover, .mvx-btn-play:focus { background: #fff; color: #000 !important; }
.mvx-btn-play:hover { background: rgba(255, 255, 255, .78); }
.mvx-btn-info, .mvx-btn-info:hover, .mvx-btn-info:focus { background: rgba(109, 109, 110, .7); color: #fff !important; }
.mvx-btn-info:hover { background: rgba(109, 109, 110, .45); }
.mvx-circle { width: 36px; height: 36px; flex: 0 0 36px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .5); background: rgba(42, 42, 42, .6); color: #fff; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; font-size: 20px; transition: border-color .15s, background .15s; }
.mvx-circle:hover { border-color: #fff; background: rgba(255, 255, 255, .12); }
.mvx-circle.is-white { background: #fff; border-color: #fff; color: #000; }
.mvx-circle.is-white:hover { background: rgba(255, 255, 255, .8); }
.mvx-circle.is-on[data-act="like"] { color: #fff; background: rgba(255, 255, 255, .22); border-color: #fff; }
.mvx-circle.is-right { margin-left: auto; }
.mvx-round { width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .7); background: transparent; color: #fff; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; font-size: 22px; }
.mvx-round:hover { background: rgba(255, 255, 255, .1); }
.mvx-round .material-icons { font-size: 22px; }
.mvx-cc:not(.is-on) { opacity: .55; }
.mvx-age { display: inline-block; border: 1px solid rgba(255, 255, 255, .45); padding: 0 6px; font-size: 12px; line-height: 18px; border-radius: 2px; color: #fff; }
.mvx-hd { display: inline-block; border: 1px solid rgba(255, 255, 255, .45); padding: 0 4px; font-size: 10px; line-height: 15px; border-radius: 3px; color: rgba(255, 255, 255, .9); font-weight: 600; }
.mvx-x { position: absolute; top: 14px; right: 14px; z-index: 5; width: 36px; height: 36px; border-radius: 50%; border: 0; background: #181818; color: #fff; font-size: 22px; display: flex; align-items: center; justify-content: center; cursor: pointer; }

/* ---------------------------------------------------------------- the rows (homepage: follows the site colours) */
.mvx-home { margin: 40px 0 30px; padding: 0 4px; }
/* the homepage: a nice break between the videos and the movies */
.mvx-intro { position: relative; text-align: center; margin: 10px auto 26px; padding: 34px 20px 30px; max-width: 760px; border-radius: 22px; overflow: hidden; color: #fff;
  background: radial-gradient(120% 140% at 50% 0%, #3a0a0e 0%, #141414 62%); box-shadow: 0 18px 50px rgba(0, 0, 0, .25); }
.mvx-intro:before { content: ""; position: absolute; left: 50%; top: -60px; width: 340px; height: 160px; margin-left: -170px; background: radial-gradient(closest-side, rgba(229, 9, 20, .55), transparent); pointer-events: none; }
.mvx-intro-ico { position: relative; display: inline-flex; width: 58px; height: 58px; border-radius: 50%; align-items: center; justify-content: center; background: #e50914; box-shadow: 0 6px 22px rgba(229, 9, 20, .5); margin-bottom: 12px; }
.mvx-intro-ico .material-icons { font-size: 30px; color: #fff; }
.mvx .mvx-intro h2 { position: relative; margin: 0 0 6px; font-size: clamp(22px, 3vw, 32px); font-weight: 900; color: #fff !important; letter-spacing: -.02em; }
.mvx-intro p { position: relative; margin: 0 0 16px; color: #d6d6d6; font-size: 15px; }
.mvx-intro-btn { position: relative; display: inline-block; background: #fff; color: #000 !important; font-weight: 800; padding: 9px 20px; border-radius: 6px; }
.mvx-intro-btn:hover { background: rgba(255, 255, 255, .82); color: #000 !important; }
.mvx-home-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 6px; padding: 0 12px; }
.mvx-home-head h2 { margin: 0; font-size: 21px; font-weight: 800; display: flex; align-items: center; gap: 8px; }
.mvx-home-head h2 .material-icons { color: var(--mv-red); font-size: 26px; }
.mvx-home-head a { font-weight: 700; color: var(--text-2, #888); white-space: nowrap; }
.mvx-home-head a:hover { color: var(--accent, #e50914); }
.mvx-row { position: relative; margin: 6px 0 26px; }
.mvx .mvx-row-h { margin: 0 0 8px; padding: 0 12px; font-size: 19px; font-weight: 700; letter-spacing: -.01em; }
.mvx-slider { position: relative; }
.mvx-track { display: flex; gap: 8px; overflow-x: auto; overflow-y: hidden; scroll-behavior: smooth; scroll-snap-type: x proximity; scroll-padding: 0 12px; padding: 4px 12px 10px; scrollbar-width: none; -ms-overflow-style: none; }
.mvx-track::-webkit-scrollbar { display: none; }
.mvx-item { position: relative; flex: 0 0 calc((100% - 5 * 8px) / 6); scroll-snap-align: start; min-width: 0; }
.mvx-card { position: relative; display: block; border-radius: 6px; overflow: hidden; background: #222; aspect-ratio: 16 / 9; color: #fff !important; text-decoration: none !important; }
.mvx-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s; }
.mvx-card:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 55%; background: linear-gradient(to top, rgba(0, 0, 0, .85), rgba(0, 0, 0, 0)); pointer-events: none; }
.mvx-name { position: absolute; left: 10px; right: 10px; bottom: 8px; z-index: 1; font-size: 14px; font-weight: 800; line-height: 1.15; text-shadow: 0 1px 4px rgba(0, 0, 0, .6); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mvx-tag { position: absolute; top: 7px; left: 7px; z-index: 1; background: var(--mv-red); color: #fff; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; padding: 2px 6px; border-radius: 3px; }
.mvx-badge { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); z-index: 2; background: #e50914; color: #fff; font-size: 11px; font-weight: 800; padding: 3px 8px; border-radius: 3px 3px 0 0; white-space: nowrap; letter-spacing: .01em; }
.mvx-item:not(.is-top) .mvx-badge { left: auto; right: 8px; top: 8px; bottom: auto; transform: none; border-radius: 3px; }
.mvx-prog { position: absolute; left: 10px; right: 10px; bottom: 4px; z-index: 2; height: 3px; background: rgba(255, 255, 255, .35); border-radius: 2px; overflow: hidden; }
.mvx-prog i { display: block; height: 100%; background: var(--mv-red); }
.mvx-row .mvx-prog ~ .mvx-name, .mvx-item:has(.mvx-prog) .mvx-name { bottom: 12px; }
.mvx-card-info { position: absolute; right: 6px; bottom: 6px; z-index: 3; width: 26px; height: 26px; border-radius: 50%; background: rgba(0, 0, 0, .55); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 18px; }
.mvx-row .mvx-card-info ~ * { }
.mvx-arrow { position: absolute; top: 4px; bottom: 10px; z-index: 4; width: 44px; border: 0; padding: 0; background: rgba(20, 20, 20, .55); color: #fff; font-size: 44px; line-height: 1; cursor: pointer; opacity: 0; transition: opacity .2s, background .2s; }
.mvx-arrow.is-l { left: 0; border-radius: 0 6px 6px 0; }
.mvx-arrow.is-r { right: 0; border-radius: 6px 0 0 6px; }
.mvx-arrow:hover { background: rgba(20, 20, 20, .8); }
.mvx-slider.can-l:hover .mvx-arrow.is-l, .mvx-slider.can-r:hover .mvx-arrow.is-r { opacity: 1; }
.mvx-slider:not(.can-l) .is-l, .mvx-slider:not(.can-r) .is-r { pointer-events: none; }

/* Top 10: the big number + a vertical poster */
.mvx-item.is-top { flex-basis: calc((100% - 6 * 8px) / 7); display: flex; align-items: stretch; }
.mvx-num { flex: 0 0 46%; position: relative; font-size: clamp(90px, 11vw, 190px); line-height: .76; font-weight: 900; letter-spacing: -.08em; color: #141414; -webkit-text-stroke: 4px #595959; text-align: right; align-self: flex-end; margin-right: -3%; font-family: "Arial Black", Inter, Arial, sans-serif !important; user-select: none; }
html:not(.vd-dark) .mvx-home .mvx-num { color: #fff; -webkit-text-stroke: 4px #9a9a9a; }
.mvx-item.is-top .mvx-card { flex: 1 1 auto; aspect-ratio: 2 / 3; border-radius: 4px; }
.mvx-item.is-top .mvx-card:after { display: none; }

/* responsive number of cards per row */
@media (max-width: 1400px) { .mvx-item { flex-basis: calc((100% - 4 * 8px) / 5); } .mvx-item.is-top { flex-basis: calc((100% - 4 * 8px) / 5.4); } }
@media (max-width: 1100px) { .mvx-item { flex-basis: calc((100% - 3 * 8px) / 4); } .mvx-item.is-top { flex-basis: calc((100% - 3 * 8px) / 3.3); } }
@media (max-width: 800px) { .mvx-item { flex-basis: calc((100% - 2 * 8px) / 3); } .mvx-item.is-top { flex-basis: calc((100% - 2 * 8px) / 2.5); } .mvx-arrow { display: none; } }
@media (max-width: 520px) { .mvx-item { flex-basis: 44%; } .mvx-item.is-top { flex-basis: 60%; } .mvx .mvx-row-h { font-size: 16px; } .mvx-name { font-size: 12px; } .mvx-home-head h2 { font-size: 18px; } }

/* ---------------------------------------------------------------- the /movie/ page: always dark, like Netflix */
#mvx-page.mvx-page { background: var(--mv-bg); color: var(--mv-txt); min-height: calc(100vh - var(--hdr, 64px)); padding: 0 0 40px !important; position: relative; }
.mvx-page h1, .mvx-page h2, .mvx-page h3, .mvx-page h4 { color: #fff !important; }
.mvx-page a { color: #fff; }
.mvx-top { position: absolute; top: 0; left: 0; right: 0; z-index: 6; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 4% 30px; background: linear-gradient(to bottom, rgba(0, 0, 0, .7), rgba(0, 0, 0, 0)); }
.mvx-tabs { display: flex; gap: 18px; flex-wrap: wrap; }
.mvx-tabs a { color: #e5e5e5 !important; font-size: 15px; font-weight: 500; opacity: .85; }
.mvx-tabs a.is-on { font-weight: 800; opacity: 1; color: #fff !important; }
.mvx-tabs a:hover { opacity: 1; color: #b3b3b3 !important; }
.mvx-manage { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; background: rgba(0, 0, 0, .45); border: 1px solid rgba(255, 255, 255, .25); padding: 6px 12px; border-radius: 4px; color: #fff !important; }
.mvx-manage .material-icons { font-size: 18px; }
.mvx-page-h { padding: 90px 4% 10px; margin: 0; font-size: 28px; }
.mvx-rows { position: relative; z-index: 3; margin: 22px auto 0; max-width: 1760px; }
.mvx-rows.no-hero { margin-top: 0; padding-top: 70px; }
.mvx-page .mvx-track { padding-left: 4%; padding-right: 4%; scroll-padding: 0 4%; }
.mvx-page .mvx-row-h { padding: 0 4%; }
.mvx-page .mvx-num { color: var(--mv-bg); }
.mvx-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 30px 8px; padding: 0 4%; }
.mvx-empty { text-align: center; padding: 120px 20px 60px; color: var(--mv-txt2); }
.mvx-empty .material-icons { font-size: 64px; color: #555; display: block; margin: 0 auto 10px; }
.mvx-empty p { font-size: 17px; margin: 0 0 20px; }

/* the hero */
.mvx-hero { position: relative; height: 40vw; max-height: 600px; min-height: 360px; overflow: hidden; background: #000; max-width: 1760px; margin: 0 auto; }
@media (min-width: 1800px) { .mvx-hero { border-radius: 0 0 14px 14px; } }
.mvx-hero-media, .mvx-hero-img, .mvx-hero-v { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mvx-hero-v { opacity: 0; transition: opacity .8s; }
.mvx-hero.is-playing .mvx-hero-v { opacity: 1; }
.mvx-hero.is-playing .mvx-hero-img { opacity: 0; transition: opacity .8s; }
.mvx-hero-v::cue { background: transparent; color: #fff; font-size: 1.2vw; font-weight: 700; text-shadow: 0 0 3px #000, 0 0 3px #000, 1px 1px 2px #000, -1px -1px 2px #000, 1px -1px 2px #000, -1px 1px 2px #000; }
.mvx-hero-shade { position: absolute; inset: 0; background: linear-gradient(77deg, rgba(0, 0, 0, .65) 0%, rgba(0, 0, 0, 0) 60%), linear-gradient(to top, var(--mv-bg) 0%, rgba(20, 20, 20, 0) 30%); pointer-events: none; }
.mvx-hero-info { position: absolute; left: 4%; bottom: 16%; width: min(44%, 620px); z-index: 2; }
.mvx-kind { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; letter-spacing: .3em; font-weight: 700; color: #ddd; margin-bottom: 6px; }
.mvx-kind b { color: var(--mv-red); font-size: 26px; letter-spacing: 0; font-weight: 900; }
.mvx-page h1.mvx-hero-title { margin: 0 0 12px; font-size: clamp(28px, 3.8vw, 62px); line-height: .98; font-weight: 900; letter-spacing: -.02em; text-shadow: 2px 2px 6px rgba(0, 0, 0, .45); transition: font-size .6s; }
.mvx-hero.is-playing .mvx-hero-title { font-size: clamp(26px, 3.6vw, 58px); }
.mvx-hero-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 15px; color: #e5e5e5; margin-bottom: 10px; font-weight: 500; }
.mvx-hero-meta i { font-style: normal; color: #999; }
.mvx-hero-tag { font-weight: 800; font-size: 16px; margin: 0 0 6px; }
.mvx-hero-desc { font-size: clamp(13px, 1.25vw, 18px); line-height: 1.35; margin: 0 0 18px; text-shadow: 1px 1px 3px rgba(0, 0, 0, .5); transition: opacity .6s, max-height .6s; max-height: 8em; overflow: hidden; }
.mvx-hero.is-playing .mvx-hero-desc, .mvx-hero.is-playing .mvx-hero-tag { opacity: 0; max-height: 0; margin: 0; }
.mvx-hero-btns { display: flex; gap: 10px; flex-wrap: wrap; }
.mvx-hero-side { position: absolute; right: 0; bottom: 16%; z-index: 2; display: flex; align-items: center; gap: 10px; }
.mvx-hero-age { background: rgba(51, 51, 51, .6); border-left: 3px solid #dcdcdc; padding: 6px 40px 6px 10px; font-size: 16px; color: #fff; }

@media (max-width: 800px) {
    .mvx-hero { height: 110vw; max-height: 70vh; min-height: 0; }
    .mvx-hero-shade { background: linear-gradient(to top, var(--mv-bg) 0%, rgba(20, 20, 20, .35) 45%, rgba(0, 0, 0, .25) 100%); }
    .mvx-hero-info { left: 0; right: 0; width: auto; bottom: 12%; padding: 0 5%; text-align: center; }
    .mvx-hero-meta, .mvx-hero-btns { justify-content: center; }
    .mvx-hero-desc { display: none; }
    .mvx-hero-side { bottom: auto; top: 64px; right: 4%; }
    .mvx-hero-age { padding-right: 14px; }
    .mvx-rows { margin-top: 0; }
    .mvx-btn { height: 40px; font-size: 15px; padding: 0 16px 0 12px; }
    .mvx-top { padding-bottom: 20px; }
    .mvx-tabs { gap: 12px; }
    .mvx-tabs a { font-size: 14px; }
}

/* ---------------------------------------------------------------- the hover card */
.mvx-hover { position: absolute; z-index: 1200; background: var(--mv-card); border-radius: 8px; overflow: hidden; color: #fff; box-shadow: 0 6px 22px rgba(0, 0, 0, .75); transform: translateY(-50%) scale(.68); opacity: 0; transition: transform .25s cubic-bezier(.2, .8, .3, 1), opacity .2s; pointer-events: none; }
.mvx-hover.is-on { transform: translateY(-62%) scale(1); opacity: 1; pointer-events: auto; }
.mvx-hv-media { position: relative; aspect-ratio: 16 / 9; background: #000; cursor: pointer; }
.mvx-hv-media img, .mvx-hv-media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mvx-hv-media video { opacity: 0; transition: opacity .4s; }
.mvx-hover.is-playing .mvx-hv-media video { opacity: 1; }
.mvx-hv-media video::cue { font-size: 13px; background: transparent; color: #fff; font-weight: 700; text-shadow: 0 0 3px #000, 0 0 3px #000, 1px 1px 2px #000, -1px -1px 2px #000, 1px -1px 2px #000, -1px 1px 2px #000; }
.mvx-hv-title { position: absolute; left: 12px; bottom: 10px; right: 60px; font-size: 18px; font-weight: 900; line-height: 1.1; text-shadow: 0 1px 6px rgba(0, 0, 0, .8); transition: opacity .4s; }
.mvx-hover.is-playing .mvx-hv-title { opacity: 0; }
.mvx-hv-mute { position: absolute; right: 10px; bottom: 10px; width: 32px; height: 32px; font-size: 17px; background: rgba(0, 0, 0, .35); }
.mvx-hv-info { padding: 14px 16px 16px; cursor: pointer; }
.mvx-hv-btns { display: flex; gap: 8px; align-items: center; margin-bottom: 12px; }
.mvx-hv-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 14px; color: #bcbcbc; margin-bottom: 10px; font-weight: 600; }
.mvx-hv-meta .mvx-age { color: #fff; }
.mvx-hv-genres { font-size: 14px; color: #fff; display: flex; flex-wrap: wrap; gap: 6px; }
.mvx-hv-genres i { color: #646464; font-style: normal; }

/* ---------------------------------------------------------------- the details window */
.mvx-modal { position: fixed; inset: 0; z-index: 3000; background: rgba(0, 0, 0, .7); overflow-y: auto; overscroll-behavior: contain; padding: 30px 12px 40px; opacity: 0; transition: opacity .2s; }
.mvx-modal.is-on { opacity: 1; }
.mvx-modal-box { position: relative; max-width: 850px; margin: 0 auto; background: var(--mv-card); color: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 3px 30px rgba(0, 0, 0, .7); transform: scale(.94); transition: transform .25s; min-height: 200px; }
.mvx-modal.is-on .mvx-modal-box { transform: none; }
.mvx-modal-load { padding: 80px; text-align: center; color: #aaa; }
.mvx-m-media { position: relative; aspect-ratio: 16 / 9; background: #000; }
.mvx-m-media img, .mvx-m-media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mvx-m-media video { opacity: 0; transition: opacity .5s; }
.mvx-modal-box.is-playing .mvx-m-media video { opacity: 1; }
.mvx-m-media video::cue { font-size: 18px; background: transparent; color: #fff; font-weight: 700; text-shadow: 0 0 3px #000, 0 0 3px #000, 1px 1px 2px #000, -1px -1px 2px #000, 1px -1px 2px #000, -1px 1px 2px #000; }
.mvx-m-yt { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; z-index: 4; background: #000; }
.mvx-modal-box.has-yt .mvx-m-head, .mvx-modal-box.has-yt .mvx-m-mute { display: none; }
.mvx-hero-logo { display: block; max-width: min(100%, 460px); max-height: 180px; object-fit: contain; object-position: left bottom; margin: 0 0 14px; filter: drop-shadow(0 2px 8px rgba(0, 0, 0, .5)); transition: max-height .6s; }
.mvx-hero.is-playing .mvx-hero-logo { max-height: 120px; }
/* the title logo is inside the picture block: it must not take the size of the picture */
.mvx-m-media .mvx-m-logo, .mvx-m-logo { position: static !important; inset: auto !important; display: block; width: auto !important; height: auto !important; max-width: min(60%, 420px); max-height: 110px; object-fit: contain; object-position: left bottom; margin: 0 0 18px; filter: drop-shadow(0 2px 10px rgba(0, 0, 0, .7)); }
@media (max-width: 700px) { .mvx-m-media .mvx-m-logo { max-width: 70%; max-height: 70px; margin-bottom: 12px; } }
@media (max-width: 800px) { .mvx-hero-logo { margin: 0 auto 12px; object-position: center bottom; max-height: 120px; } }
.mvx-m-shade { position: absolute; inset: 0; background: linear-gradient(to top, var(--mv-card) 0%, rgba(24, 24, 24, .55) 28%, rgba(24, 24, 24, 0) 60%); pointer-events: none; }
.mvx-m-head { position: absolute; left: 48px; right: 48px; bottom: 9%; z-index: 2; }
.mvx-modal h2 { margin: 0 0 18px; font-size: clamp(26px, 4.4vw, 44px); font-weight: 900; line-height: 1.02; color: #fff !important; text-shadow: 0 2px 8px rgba(0, 0, 0, .55); max-width: 80%; }
.mvx-m-btns { display: flex; align-items: center; gap: 10px; }
.mvx-m-btns .mvx-circle { width: 42px; height: 42px; flex-basis: 42px; font-size: 22px; }
.mvx-m-mute { position: absolute; right: 48px; bottom: 9%; z-index: 3; width: 42px; height: 42px; font-size: 22px; }
.mvx-m-body { padding: 4px 48px 40px; }
.mvx-m-cols { display: grid; grid-template-columns: 2fr 1fr; gap: 32px; }
.mvx-m-meta { display: flex; align-items: center; gap: 8px; color: #bcbcbc; font-size: 16px; margin-bottom: 6px; }
.mvx-m-age { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 15px; color: #fff; margin-bottom: 18px; }
.mvx-m-prog { height: 4px; background: #4d4d4d; border-radius: 2px; overflow: hidden; margin: 0 0 16px; max-width: 320px; }
.mvx-m-prog i { display: block; height: 100%; background: var(--mv-red); }
.mvx-modal h3.mvx-m-tag { font-size: 17px; font-weight: 800; margin: 0 0 8px; color: #fff !important; }
.mvx-m-desc { font-size: 15px; line-height: 1.5; margin: 0; color: #fff; }
.mvx-m-right p, .mvx-about p { font-size: 14px; line-height: 1.45; margin: 0 0 10px; color: #ddd; word-break: break-word; }
.mvx-m-right span:first-child, .mvx-about p > span:first-child { color: #777; }
.mvx-m-right a { color: #fff; font-style: italic; }
.mvx-m-sec { margin-top: 44px; }
.mvx-modal .mvx-m-sec h3 { font-size: 24px; font-weight: 800; margin: 0 0 18px; color: #fff !important; }
.mvx-modal .mvx-about h3 { font-weight: 400; }
.mvx-modal .mvx-about h3 b { font-weight: 800; }
.mvx-m-sech { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 18px; }
.mvx-modal .mvx-m-sech h3 { margin: 0; }
.mvx-season { background: #242424; color: #fff; border: 1px solid #4d4d4d; border-radius: 4px; padding: 8px 14px; font-size: 16px; font-weight: 700; }
.mvx-season-one { font-size: 16px; color: #ddd; }
.mvx-ep { display: grid; grid-template-columns: 40px 140px 1fr; align-items: center; gap: 16px; padding: 18px 16px; border-bottom: 1px solid #404040; border-radius: 4px; color: #fff !important; text-decoration: none !important; }
.mvx-ep:hover, .mvx-ep.is-now { background: #333; }
.mvx-ep[hidden], .mvx-modal [hidden], .mvx-hero [hidden], .mvx-hover [hidden] { display: none !important; }
.mvx-ep.is-off { opacity: .45; cursor: default; }
.mvx-ep > b { font-size: 24px; color: #d2d2d2; text-align: center; font-weight: 500; }
.mvx-ep-img { position: relative; display: block; aspect-ratio: 16 / 9; border-radius: 4px; overflow: hidden; background: #000; }
.mvx-ep-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mvx-ep-img i { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 30px; opacity: 0; transition: opacity .2s; background: rgba(0, 0, 0, .25); }
.mvx-ep:hover .mvx-ep-img i { opacity: 1; }
.mvx-ep-img u { position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: rgba(255, 255, 255, .35); }
.mvx-ep-img s { display: block; height: 100%; background: var(--mv-red); }
.mvx-ep-txt { display: block; font-size: 14px; color: #d2d2d2; line-height: 1.4; min-width: 0; }
.mvx-ep-top { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 4px; color: #fff; }
.mvx-ep-top strong { font-size: 16px; }
.mvx-ep-top em { font-style: normal; white-space: nowrap; }
.mvx-sim { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.mvx-sim-card { background: #2f2f2f; border-radius: 6px; overflow: hidden; }
.mvx-sim-img { position: relative; display: block; aspect-ratio: 16 / 9; color: #fff !important; }
.mvx-sim-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mvx-sim-img em { position: absolute; top: 8px; right: 8px; font-style: normal; font-size: 13px; font-weight: 700; text-shadow: 0 1px 4px rgba(0, 0, 0, .9); }
.mvx-sim-img i { position: absolute; left: 50%; top: 50%; width: 44px; height: 44px; margin: -22px 0 0 -22px; border-radius: 50%; border: 1px solid #fff; background: rgba(30, 30, 20, .5); display: flex; align-items: center; justify-content: center; font-size: 24px; opacity: 0; transition: opacity .2s; }
.mvx-sim-card:hover .mvx-sim-img i { opacity: 1; }
.mvx-sim-img strong { position: absolute; left: 10px; bottom: 8px; right: 10px; font-size: 14px; font-weight: 800; text-shadow: 0 1px 4px rgba(0, 0, 0, .9); }
.mvx-sim-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 14px 14px 0; }
.mvx-sim-meta div { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; color: #bcbcbc; font-size: 14px; }
.mvx-sim-card p { padding: 10px 14px 16px; margin: 0; font-size: 13.5px; line-height: 1.45; color: #d2d2d2; }
.mvx-sim-card.is-trailer p { padding-top: 12px; }
.mvx-about { border-top: 0; }
@media (max-width: 700px) {
    .mvx-modal { padding: 0; }
    .mvx-modal-box { border-radius: 0; min-height: 100%; }
    .mvx-m-head, .mvx-m-body { padding-left: 0; padding-right: 0; left: 16px; right: 16px; }
    .mvx-m-body { padding: 4px 16px 40px; }
    .mvx-m-mute { right: auto; left: 16px; top: 16px; bottom: auto; }
    .mvx-m-cols { grid-template-columns: 1fr; gap: 14px; }
    .mvx-sim { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .mvx-ep { grid-template-columns: 110px 1fr; padding: 12px 6px; }
    .mvx-ep > b { display: none; }
    .mvx-modal h2 { font-size: 26px; margin-bottom: 12px; }
    .mvx-m-btns .mvx-btn { flex: 1; }
}

/* ---------------------------------------------------------------- "you need Premium" */
.mvx-gate { position: fixed; inset: 0; z-index: 3100; background: rgba(0, 0, 0, .72); display: flex; align-items: center; justify-content: center; padding: 16px; opacity: 0; transition: opacity .2s; }
.mvx-gate.is-on { opacity: 1; }
.mvx-gate-in { position: relative; width: 100%; max-width: 420px; background: #181818; color: #fff; border-radius: 10px; padding: 34px 26px 28px; text-align: center; box-shadow: 0 10px 40px rgba(0, 0, 0, .7); }
.mvx-gate-star { display: inline-flex; width: 58px; height: 58px; border-radius: 50%; align-items: center; justify-content: center; font-size: 30px; background: linear-gradient(135deg, #f7c948, #e8a400); color: #241800; margin-bottom: 12px; }
.mvx-gate h3 { margin: 0 0 8px; font-size: 22px; font-weight: 800; color: #fff !important; }
.mvx-gate p { color: #cfcfcf; font-size: 15px; margin: 0 0 20px; line-height: 1.5; }
.mvx-gate p b { color: #fff; }
.mvx-gate .mvx-btn { margin: 4px; }

/* ---------------------------------------------------------------- the player page */
.mvp-body { margin: 0; background: #000; color: #fff; font-family: "Netflix Sans", Inter, "Helvetica Neue", "Segoe UI", Roboto, Arial, sans-serif; overflow: hidden; height: 100%; }
html:has(.mvp-body) { height: 100%; background: #000; }
.mvp { position: fixed; inset: 0; background: #000; outline: none; user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent; }
.mvp-v { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #000; }
.mvp:not(.is-ui) { cursor: none; }
.mvp-top, .mvp-bottom { position: absolute; left: 0; right: 0; z-index: 5; transition: opacity .35s; }
.mvp-top { top: 0; padding: 22px 26px 60px; background: linear-gradient(to bottom, rgba(0, 0, 0, .7), rgba(0, 0, 0, 0)); display: flex; align-items: center; gap: 16px; }
.mvp-bottom { bottom: 0; padding: 70px 24px 18px; background: linear-gradient(to top, rgba(0, 0, 0, .8), rgba(0, 0, 0, 0)); }
.mvp:not(.is-ui) .mvp-top, .mvp:not(.is-ui) .mvp-bottom { opacity: 0; pointer-events: none; }
.mvp-back { color: #fff; font-size: 40px; display: inline-flex; padding: 4px; border-radius: 50%; transition: transform .15s; }
.mvp-back:hover { transform: scale(1.15); }
.mvp-bar { display: flex; align-items: center; gap: 16px; margin-bottom: 8px; }
.mvp-track { position: relative; flex: 1; height: 20px; cursor: pointer; display: flex; align-items: center; touch-action: none; }
.mvp-track:before { content: ""; position: absolute; left: 0; right: 0; height: 4px; background: rgba(255, 255, 255, .25); border-radius: 2px; transition: height .15s; }
.mvp-buf, .mvp-fill { position: absolute; left: 0; height: 4px; border-radius: 2px; transition: height .15s; pointer-events: none; }
.mvp-buf { background: rgba(255, 255, 255, .4); }
.mvp-fill { background: var(--mv-red); }
.mvp-track:hover:before, .mvp-track:hover .mvp-buf, .mvp-track:hover .mvp-fill, .mvp.is-drag .mvp-track:before, .mvp.is-drag .mvp-fill { height: 7px; }
.mvp-knob { position: absolute; width: 18px; height: 18px; margin-left: -9px; border-radius: 50%; background: var(--mv-red); transform: scale(.8); transition: transform .15s; pointer-events: none; }
.mvp-track:hover .mvp-knob, .mvp.is-drag .mvp-knob { transform: scale(1.1); }
.mvp-tip { position: absolute; bottom: 24px; transform: translateX(-50%); background: rgba(20, 20, 20, .9); padding: 4px 8px; border-radius: 4px; font-size: 13px; font-weight: 600; opacity: 0; pointer-events: none; transition: opacity .15s; }
.mvp-track:hover .mvp-tip, .mvp.is-drag .mvp-tip { opacity: 1; }
.mvp-left { font-size: 15px; min-width: 52px; text-align: right; font-variant-numeric: tabular-nums; }
.mvp-ctrls { display: flex; align-items: center; gap: 18px; }
.mvp-b { background: transparent; border: 0; color: #fff; font-size: 42px; width: 48px; height: 48px; padding: 3px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; border-radius: 50%; transition: transform .12s; flex: 0 0 auto; }
.mvp-b svg { width: 100%; height: 100%; }
.mvp-b:hover { transform: scale(1.22); }
.mvp-b[hidden] { display: none; }
.mvp-b text { font-size: 7px; font-weight: 800; fill: currentColor; font-family: Arial, sans-serif; }
.mvp-pp .i-pause, .mvp.is-paused .mvp-pp .i-play { display: block; }
.mvp-pp .i-play, .mvp.is-paused .mvp-pp .i-pause { display: none; }
.mvp-vol .i-off, .mvp.is-muted .mvp-vol .i-on { display: none; }
.mvp.is-muted .mvp-vol .i-off { display: block; }
.mvp-fs .i-out, .mvp.is-fs .mvp-fs .i-in { display: none; }
.mvp.is-fs .mvp-fs .i-out { display: block; }
.mvp-volw { position: relative; display: flex; }
.mvp-volpop { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); padding: 14px 16px; background: #262626; border-radius: 4px; display: none; margin-bottom: 4px; }
.mvp-volw:hover .mvp-volpop { display: block; }
.mvp-volbar { position: relative; width: 8px; height: 120px; background: #5b5b5b; border-radius: 4px; cursor: pointer; }
.mvp-volbar i { position: absolute; left: 0; right: 0; bottom: 0; background: var(--mv-red); border-radius: 4px; }
.mvp-volbar i:after { content: ""; position: absolute; top: -8px; left: 50%; width: 16px; height: 16px; margin-left: -8px; border-radius: 50%; background: var(--mv-red); }
.mvp-name { flex: 1; min-width: 0; text-align: center; font-size: 19px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mvp-name strong { font-weight: 800; }
.mvp-name span { margin-left: 8px; color: #ddd; }
.mvp-name em { font-style: normal; font-weight: 700; color: #fff; }
.mvp-big { position: absolute; left: 50%; top: 50%; z-index: 4; width: 96px; height: 96px; margin: -48px 0 0 -48px; border-radius: 50%; border: 0; background: rgba(0, 0, 0, .45); color: #fff; padding: 20px; cursor: pointer; display: none; }
.mvp.is-paused:not(.has-msg) .mvp-big { display: block; }
.mvp.is-paused.is-ui .mvp-big { display: none; }
.is-touch.mvp.is-paused .mvp-big, .is-touch.mvp.is-paused.is-ui .mvp-big { display: block; }
.mvp-spin { position: absolute; left: 50%; top: 50%; width: 70px; height: 70px; margin: -35px 0 0 -35px; z-index: 3; display: none; pointer-events: none; }
.mvp-spin i { display: block; width: 100%; height: 100%; border-radius: 50%; border: 5px solid rgba(255, 255, 255, .2); border-top-color: var(--mv-red); animation: mvpspin .9s linear infinite; }
.mvp.is-wait:not(.is-paused) .mvp-spin { display: block; }
@keyframes mvpspin { to { transform: rotate(360deg); } }
.mvp-msg { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 4; max-width: 90%; text-align: center; background: rgba(0, 0, 0, .7); padding: 18px 24px; border-radius: 8px; font-size: 17px; }
.mvp-cues { position: absolute; left: 6%; right: 6%; bottom: 7%; z-index: 2; text-align: center; pointer-events: none; transition: bottom .3s; }
.mvp.is-ui .mvp-cues { bottom: 150px; }
/* subtitles without a background: only the text, with a black outline (readable on any picture) */
.mvp-cues span { display: inline; background: none; color: #fff; font-weight: 700; line-height: 1.35; padding: 0 4px; -webkit-box-decoration-break: clone; box-decoration-break: clone; text-shadow: 0 0 3px #000, 0 0 3px #000, 1px 1px 2px #000, -1px -1px 2px #000, 1px -1px 2px #000, -1px 1px 2px #000 , 0 2px 6px rgba(0, 0, 0, .9); font-size: 2.6vw; }
.mvp[data-subsize="s"] .mvp-cues span { font-size: 1.9vw; }
.mvp[data-subsize="l"] .mvp-cues span { font-size: 3.5vw; }
@media (max-aspect-ratio: 1/1) { .mvp-cues, .mvp.is-ui .mvp-cues { bottom: calc(50% - 28.1vw - 3.4em); } }
@media (max-aspect-ratio: 4/3) { .mvp-cues span { font-size: 4.2vw; } .mvp[data-subsize="s"] .mvp-cues span { font-size: 3.4vw; } .mvp[data-subsize="l"] .mvp-cues span { font-size: 5.4vw; } }
.mvp-flash { position: absolute; top: 50%; z-index: 4; width: 90px; height: 90px; margin-top: -45px; border-radius: 50%; background: rgba(0, 0, 0, .45); display: flex; align-items: center; justify-content: center; font-size: 22px; font-weight: 800; animation: mvpflash .65s ease-out forwards; pointer-events: none; }
.mvp-flash.is-rew { left: 18%; }
.mvp-flash.is-fwd { right: 18%; }
@keyframes mvpflash { from { opacity: 1; transform: scale(.85); } to { opacity: 0; transform: scale(1.15); } }
.mvp-toast { position: absolute; left: 50%; top: 80px; transform: translateX(-50%); z-index: 6; background: rgba(20, 20, 20, .92); border-radius: 6px; padding: 10px 12px 10px 18px; display: flex; align-items: center; gap: 14px; font-size: 15px; transition: opacity .4s; }
.mvp-toast button { background: #fff; color: #000; border: 0; border-radius: 4px; padding: 6px 12px; font-weight: 700; cursor: pointer; }
.mvp-toast.is-out { opacity: 0; }
.mvp-pop { position: absolute; right: 24px; bottom: 110px; z-index: 7; background: #262626; border-radius: 6px; padding: 16px 8px 10px; display: flex; gap: 6px; max-height: calc(100% - 140px); overflow: auto; box-shadow: 0 4px 30px rgba(0, 0, 0, .6); }
.mvp-pop[hidden] { display: none; }
.mvp-pcol { min-width: 170px; display: flex; flex-direction: column; }
.mvp-pcol h4 { margin: 0 12px 8px; font-size: 18px; font-weight: 800; color: #fff; }
.mvp-pcol button { background: transparent; border: 0; color: #b3b3b3; text-align: left; font-size: 16px; padding: 8px 12px 8px 34px; cursor: pointer; position: relative; border-radius: 4px; }
.mvp-pcol button small { opacity: .7; }
.mvp-pcol button:hover { color: #fff; background: rgba(255, 255, 255, .06); }
.mvp-pcol button.is-on { color: #fff; font-weight: 700; }
.mvp-pcol button.is-on:before { content: "\2713"; position: absolute; left: 12px; }
.mvp-spdrow { min-width: 0; }
.mvp-spdline { display: flex; gap: 0; padding: 18px 12px 6px; position: relative; }
.mvp-spdline:before { content: ""; position: absolute; left: 40px; right: 40px; top: 25px; height: 2px; background: #5b5b5b; }
.mvp-spdline button { padding: 30px 6px 4px; text-align: center; min-width: 92px; font-size: 14px; }
.mvp-spdline button i { position: absolute; left: 50%; top: 0; width: 16px; height: 16px; margin-left: -8px; border-radius: 50%; background: #5b5b5b; transition: transform .15s; }
.mvp-spdline button.is-on:before { display: none; }
.mvp-spdline button.is-on i { background: #fff; transform: scale(1.5); }
.mvp-epsbox { width: min(560px, 80vw); }
.mvp-epshead { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 12px 10px; }
.mvp-epshead strong { font-size: 20px; }
.mvp-season { background: #1a1a1a; color: #fff; border: 1px solid #555; border-radius: 4px; padding: 6px 10px; font-size: 15px; }
.mvp-epslist { max-height: 56vh; overflow: auto; }
.mvp-ep { display: grid; grid-template-columns: 26px 120px 1fr; gap: 12px; align-items: center; width: 100%; background: transparent; border: 0; color: #ddd; text-align: left; padding: 10px 12px; cursor: pointer; border-radius: 4px; }
.mvp-ep[hidden] { display: none; }
.mvp-ep:hover, .mvp-ep.is-now { background: #3a3a3a; color: #fff; }
.mvp-ep.is-off { opacity: .4; cursor: default; }
.mvp-ep b { font-size: 18px; text-align: center; }
.mvp-ep img { width: 120px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 3px; background: #000; }
.mvp-ep span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mvp-ep strong { font-size: 15px; color: #fff; }
.mvp-ep small { color: #aaa; }
.mvp-ep em { font-style: normal; font-size: 13px; color: #bbb; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mvp-upnext { position: absolute; right: 30px; bottom: 140px; z-index: 6; background: rgba(20, 20, 20, .94); border-radius: 8px; padding: 16px 18px; display: flex; align-items: center; gap: 14px; max-width: 520px; box-shadow: 0 4px 24px rgba(0, 0, 0, .6); }
.mvp-upnext[hidden] { display: none; }
.mvp-upnext small { display: block; color: #bbb; font-size: 13px; }
.mvp-upnext strong { font-size: 16px; }
.mvp-upgo { background: #fff; color: #000; border: 0; border-radius: 4px; padding: 10px 14px; font-weight: 800; cursor: pointer; white-space: nowrap; }
.mvp-upx { background: transparent; border: 0; color: #aaa; font-size: 26px; cursor: pointer; }
.mvp.is-near-end .mvp-next { animation: mvppulse 1.6s ease-in-out infinite; }
@keyframes mvppulse { 50% { transform: scale(1.18); } }
@media (max-width: 760px) {
    .mvp-top { padding: 12px 12px 40px; }
    .mvp-back { font-size: 30px; }
    .mvp-bottom { padding: 50px 10px 10px; padding-bottom: max(10px, env(safe-area-inset-bottom)); }
    .mvp-ctrls { gap: 4px; }
    .mvp-b { font-size: 30px; width: 38px; height: 38px; }
    .mvp-name { font-size: 13px; }
    .mvp-name span { display: none; }
    .mvp-volw, .mvp-q { display: none; }
    .mvp-pop { left: 8px; right: 8px; bottom: 86px; flex-wrap: wrap; justify-content: center; }
    .mvp-pcol { min-width: 140px; }
    .mvp-spdline button { min-width: 58px; font-size: 12px; }
    .mvp.is-ui .mvp-cues { bottom: 110px; }
    .mvp-upnext { left: 10px; right: 10px; bottom: 100px; flex-wrap: wrap; }
    .mvp-ep { grid-template-columns: 90px 1fr; }
    .mvp-ep b { display: none; }
    .mvp-ep img { width: 90px; }
}
.mvp-lock { position: fixed; inset: 0; background: #000 center / cover no-repeat; display: flex; align-items: center; justify-content: center; padding: 20px; }
.mvp-lock:before { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .72); }
.mvp-lock-back { position: absolute; top: 20px; left: 20px; z-index: 2; color: #fff; font-size: 36px; display: inline-flex; }
.mvp-lock-back svg { width: 1em; height: 1em; fill: currentColor; }
.mvp-lock-box { position: relative; z-index: 2; max-width: 520px; text-align: center; }
.mvp-lock-ico { display: inline-flex; width: 70px; height: 70px; border-radius: 50%; align-items: center; justify-content: center; font-size: 36px; background: linear-gradient(135deg, #f7c948, #e8a400); color: #241800; margin-bottom: 16px; }
.mvp-lock h1 { margin: 0 0 10px; font-size: 34px; font-weight: 900; }
.mvp-lock p { font-size: 17px; line-height: 1.5; color: #ddd; margin: 0 0 24px; }
.mvp-lock-btns { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

/* ---------------------------------------------------------------- the manager (site colours) */
.mvm *, .mvm *:before, .mvm *:after { box-sizing: border-box; }
.mvm [hidden] { display: none !important; }
.mvm { padding-top: 18px !important; padding-bottom: 50px !important; max-width: 1100px; }
/* the manager in the middle of the page */
.main-holder.mvm { float: none !important; margin-left: auto !important; margin-right: auto !important; width: 100% !important; }
.mvm-bg { display: block; font-size: 12px; color: var(--text-2, #777); margin-top: 3px; }
.mvm-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 18px; }
.mvm-head h1 { margin: 0; font-size: 26px; font-weight: 800; display: flex; align-items: center; gap: 8px; }
.mvm-head h1 .material-icons { color: #e50914; font-size: 30px; }
.mvm-head p { margin: 4px 0 0; color: var(--text-2, #777); }
.mvm-head-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.mvm-head-btns .btn, .mvm .btn { display: inline-flex; align-items: center; gap: 6px; }
.mvm .btn .material-icons { font-size: 19px; }
.mvm-back { color: var(--text-2, #777); font-weight: 600; }
.mvm-empty { text-align: center; padding: 70px 10px; color: var(--text-2, #777); }
.mvm-empty .material-icons { font-size: 60px; }
.mvm-list { display: flex; flex-direction: column; gap: 10px; }
.mvm-row { display: flex; align-items: center; gap: 14px; background: var(--surface, #fff); border: 1px solid var(--border, #e5e5e5); border-radius: 12px; padding: 10px; }
.mvm-thumb { flex: 0 0 150px; aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden; background: #000; }
.mvm-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mvm-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.mvm-info strong { font-size: 16px; }
.mvm-info > span { color: var(--text-2, #777); font-size: 13px; }
.mvm-acts { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.mvm-badge { font-style: normal; font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 20px; background: var(--surface-2, #eee); color: var(--text, #222); text-transform: uppercase; letter-spacing: .03em; }
.mvm-badge.is-off { background: #6b6b6b; color: #fff; }
.mvm-badge.is-wait { background: #f59e0b; color: #111; }
.mvm-badge.is-feat { background: #e50914; color: #fff; }
.mvm-st { font-style: normal; font-weight: 700; font-size: 12px; }
.mvm-st.is-ready { color: #1a9d4a; }
.mvm-st.is-run, .mvm-st.is-wait, .mvm-st.is-queue { color: #e08a00; }
.mvm-st.is-none { color: var(--text-3, #999); }
.mvm-q { display: inline-block; font-size: 11px; font-weight: 700; background: var(--surface-2, #eee); border-radius: 4px; padding: 1px 5px; margin: 0 2px; }
.mvm-card { background: var(--surface, #fff); border: 1px solid var(--border, #e5e5e5); border-radius: 14px; padding: 18px 20px; margin-bottom: 16px; }
.mvm-card h3 { margin: 0 0 14px; font-size: 18px; font-weight: 800; }
.mvm-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; }
.mvm-grid label, .mvm-img { display: flex; flex-direction: column; gap: 5px; margin: 0; font-weight: 400; }
.mvm-grid label > span, .mvm-img > span { font-size: 13px; font-weight: 700; color: var(--text-2, #666); }
.mvm-grid .is-wide { grid-column: 1 / -1; }
.mvm input[type=text], .mvm input[type=number], .mvm textarea, .mvm select { width: 100%; background: var(--surface-2, #f5f5f5); border: 1px solid var(--border, #ddd); color: var(--text, #222); border-radius: 8px; padding: 9px 11px; font-size: 14px; }
.mvm textarea { resize: vertical; }
.mvm-chk { flex-direction: row !important; align-items: center; gap: 8px !important; font-weight: 600 !important; cursor: pointer; }
.mvm-imgbox { width: 100%; aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden; background: var(--surface-2, #eee); border: 1px dashed var(--border, #ccc); }
.mvm-imgbox.is-poster { width: 46%; aspect-ratio: 2 / 3; }
.mvm-imgbox img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mvm-img small { color: var(--text-3, #999); }
.mvm-save { display: flex; align-items: center; gap: 12px; margin-top: 16px; }
.mvm-msg.is-ok { color: #1a9d4a; font-weight: 700; }
.mvm-msg.is-err { color: #e50914; font-weight: 700; }
.mvm-media { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.mvm-media.is-busy .mvm-pick { pointer-events: none; opacity: .5; }
.mvm-state { min-width: 120px; }
.mvm-up, .mvm-ep-up { flex: 1 1 100%; display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--text-2, #666); }
.mvm-up[hidden], .mvm-ep-up[hidden] { display: none; }
.mvm-upbar { height: 8px; border-radius: 4px; background: var(--surface-3, #e5e5e5); overflow: hidden; }
.mvm-upbar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #e50914, #ff6a3d); transition: width .3s; }
.mvm-hint { color: var(--text-3, #999); font-size: 13px; margin: 10px 0 0; }
.mvm-subs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.mvm-sub { display: inline-flex; align-items: center; gap: 5px; background: var(--surface-2, #eee); border-radius: 20px; padding: 3px 4px 3px 10px; font-size: 13px; }
.mvm-subdel { border: 0; background: transparent; color: var(--text-2, #777); font-size: 17px; line-height: 1; cursor: pointer; padding: 0 5px; }
.mvm-subadd { display: inline-flex; align-items: center; gap: 8px; }
.mvm-subadd select { width: auto; }
.mvm-bulk { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; }
.mvm-bulk label { margin: 0; }
.mvm-bulk > label:first-child { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 700; color: var(--text-2, #666); }
.mvm-bulk .mvm-bseason { width: 90px; }
.mvm-bulk.is-subs { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--border, #e5e5e5); align-items: center; }
.mvm-bulk.is-subs select { width: auto; }
.mvm-bsmsg { font-size: 13px; color: var(--text-2, #666); }
.mvm-queue { display: flex; flex-direction: column; gap: 6px; margin-top: 12px; }
.mvm-job { display: grid; grid-template-columns: 70px 1fr 160px 90px; align-items: center; gap: 10px; background: var(--surface-2, #f3f3f3); border-radius: 8px; padding: 8px 12px; font-size: 13px; }
.mvm-job-n { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mvm-job em { font-style: normal; text-align: right; color: var(--text-2, #666); }
.mvm-job.is-done em { color: #1a9d4a; font-weight: 700; }
.mvm-job.is-err em { color: #e50914; }
.mvm-sh { margin: 22px 0 8px; font-size: 15px; font-weight: 800; color: var(--text-2, #666); text-transform: uppercase; letter-spacing: .05em; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.mvm-sh .btn { text-transform: none; letter-spacing: 0; }
.mvm-ep { display: grid; grid-template-columns: 150px 1fr auto; gap: 14px; align-items: start; padding: 12px 0; border-top: 1px solid var(--border, #e5e5e5); }
.mvm-ep-n { display: flex; gap: 6px; }
.mvm-ep-n label { display: flex; align-items: center; gap: 3px; font-weight: 800; margin: 0; }
.mvm-ep-n input { width: 52px !important; padding: 6px !important; }
.mvm-ep-main { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.mvm-ep-main .mvm-subs { margin: 0; }
.mvm-ep-acts { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; max-width: 300px; }
.mvm-ep-acts .mvm-subadd select { padding: 4px 6px; font-size: 12px; max-width: 100px; }
.mvm-ep-l { display: flex; flex-direction: column; gap: 6px; }
.mvm-ep-img { aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden; background: var(--surface-2, #eee); display: flex; align-items: center; justify-content: center; color: var(--text-3, #999); }
.mvm-ep-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mvm-ep.is-nofile .mvm-ep-img { opacity: .6; }
.mvm-ep-need { display: flex; gap: 6px; flex-wrap: wrap; padding: 8px; border: 1px dashed #e08a00; border-radius: 8px; background: rgba(224, 138, 0, .06); }
.mvm-tmdb h3 { display: flex; align-items: center; gap: 6px; }
.mvm-tmdb h3 .material-icons { color: #01b4e4; }
.mvm-tmdbrow { display: flex; gap: 8px; flex-wrap: wrap; }
.mvm-tmdbrow input { flex: 1; min-width: 220px; }
.mvm-tmdbmsg { font-weight: 700; }
.mvm-tmdbmsg.is-ok { color: #1a9d4a; } .mvm-tmdbmsg.is-err { color: #e50914; }
.mvm-add { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: 12px; border-radius: 12px; background: var(--surface-2, #f4f4f6); }
.mvm-add-s, .mvm-add-b { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.mvm-add-s span { font-weight: 700; font-size: 13px; }
.mvm-add select.mvm-bseason { width: auto; min-width: 120px; }
.mvm-modal { position: fixed; inset: 0; z-index: 5000; background: rgba(0, 0, 0, .6); display: flex; align-items: center; justify-content: center; padding: 16px; }
.mvm-modal[hidden] { display: none !important; }
.mvm-modal * { box-sizing: border-box; }
.mvm-modal-box { width: 100%; max-width: 760px; max-height: 88vh; display: flex; flex-direction: column; background: var(--surface, #fff); color: var(--text, #222); border-radius: 14px; box-shadow: 0 10px 40px rgba(0, 0, 0, .4); overflow: hidden; }
.mvm-modal-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 18px; border-bottom: 1px solid var(--border, #eee); }
.mvm-modal-h strong { font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mvm-modal-x { border: 0; background: transparent; font-size: 28px; line-height: 1; cursor: pointer; color: inherit; }
.mvm-modal-b { padding: 12px 18px; overflow: auto; flex: 1; }
.mvm-modal-f { padding: 12px 18px; border-top: 1px solid var(--border, #eee); display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.mvm-modal-f .btn { display: inline-flex; align-items: center; gap: 5px; }
.mvm-ftplist { display: flex; flex-direction: column; gap: 6px; }
.mvm-ftpf { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; background: var(--surface-2, #f4f4f6); }
.mvm-ftpf.is-busy { opacity: .55; }
.mvm-ftpn { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.mvm-ftpn strong { font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mvm-ftpn small { color: var(--text-2, #777); }
.mvm-ftpse { display: flex; align-items: center; gap: 3px; font-weight: 800; }
.mvm-ftpse input { width: 54px !important; padding: 5px !important; }
.mvm-ftpempty { text-align: center; padding: 30px 10px; color: var(--text-2, #777); }
.mvm-ftpempty .material-icons { font-size: 48px; }
.mvm-ftpempty code { font-size: 14px; }
.mvm-pv { display: flex; gap: 16px; align-items: flex-end; flex-wrap: wrap; margin-top: 12px; }
.mvm-pv video { width: 320px; max-width: 100%; border-radius: 8px; background: #000; }
.mvm-pv label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 700; margin-bottom: 8px; }
.mvm-pv .mvm-pvat { width: 120px; }
.mvm-danger { text-align: right; }
@media (max-width: 760px) {
    .mvm-grid { grid-template-columns: 1fr; }
    .mvm-row { flex-wrap: wrap; }
    .mvm-thumb { flex-basis: 110px; }
    .mvm-acts { width: 100%; }
    .mvm-ep { grid-template-columns: 1fr; }
    .mvm-ep-acts { justify-content: flex-start; max-width: none; }
    .mvm-job { grid-template-columns: 54px 1fr; }
    .mvm-job .mvm-upbar, .mvm-job em { grid-column: 1 / -1; text-align: left; }
}

/* ---------------------------------------------------------------- old TV browsers without aspect-ratio */
@supports not (aspect-ratio: 1 / 1) {
    .mvx-card, .mvx-hv-media, .mvx-m-media, .mvx-ep-img, .mvx-sim-img, .mvm-thumb, .mvm-imgbox { height: auto; }
    .mvx-card:before, .mvx-hv-media:before, .mvx-m-media:before, .mvx-ep-img:before, .mvx-sim-img:before, .mvm-thumb:before, .mvm-imgbox:before { content: ""; display: block; padding-top: 56.25%; }
    .mvx-item.is-top .mvx-card:before, .mvm-imgbox.is-poster:before { padding-top: 150%; }
    .mvx-card img, .mvx-hv-media img, .mvx-hv-media video, .mvx-m-media img, .mvx-m-media video, .mvx-ep-img img, .mvx-sim-img img { position: absolute; top: 0; left: 0; }
    .mvm-thumb, .mvm-imgbox { position: relative; }
    .mvm-thumb img, .mvm-imgbox img { position: absolute; top: 0; left: 0; }
}

/* ==========================================================================
   /movie layout v2 (like Netflix 2026): a bar with the tabs on top, the big title in a rounded box
   with space around it, the rows aligned with the box
   ========================================================================== */
.mvx-page .mvx-top { position: relative; top: auto; left: auto; right: auto; max-width: 1760px; margin: 0 auto; padding: 14px 4% 14px; background: none; z-index: 6; }
.mvx-page .mvx-tabs { gap: 6px; align-items: center; }
.mvx-page .mvx-tabs a { padding: 8px 16px; border-radius: 22px; font-size: 15px; font-weight: 600; opacity: 1; color: #e5e5e5 !important; text-decoration: none !important; transition: background .15s; }
.mvx-page .mvx-tabs a:hover { background: rgba(255, 255, 255, .08); color: #fff !important; }
.mvx-page .mvx-tabs a.is-on { background: rgba(255, 255, 255, .16); color: #fff !important; font-weight: 800; }
.mvx-page .mvx-manage { border-radius: 22px; padding: 7px 14px; background: rgba(255, 255, 255, .06); }
.mvx-page .mvx-hero { width: 92%; max-width: 1640px; margin: 0 auto; height: clamp(360px, 33vw, 580px); min-height: 0; max-height: none; border-radius: 18px; box-shadow: 0 20px 60px rgba(0, 0, 0, .5); }
.mvx-page .mvx-hero-shade { background: linear-gradient(90deg, rgba(0, 0, 0, .85) 0%, rgba(0, 0, 0, .55) 32%, rgba(0, 0, 0, 0) 62%), linear-gradient(to top, rgba(0, 0, 0, .55) 0%, rgba(0, 0, 0, 0) 40%); }
.mvx-page .mvx-hero-info { left: 4%; bottom: auto; top: 50%; transform: translateY(-50%); width: min(46%, 700px); }
.mvx-page .mvx-hero-logo { max-height: clamp(70px, 9vw, 170px); max-width: min(100%, 520px); margin-bottom: 14px; }
.mvx-page .mvx-hero.is-playing .mvx-hero-logo { max-height: clamp(60px, 7vw, 130px); }
.mvx-page h1.mvx-hero-title { font-size: clamp(28px, 3.6vw, 60px); }
.mvx-page .mvx-hero-meta { font-weight: 700; color: #fff; }
.mvx-page .mvx-hero-desc { -webkit-line-clamp: 3; display: -webkit-box; -webkit-box-orient: vertical; max-height: 4.2em; font-size: clamp(14px, 1.15vw, 19px); }
.mvx-page .mvx-hero-btns .mvx-btn { border-radius: 24px; }
.mvx-page .mvx-hero-btns .mvx-btn-info { background: rgba(109, 109, 110, .55); }
.mvx-page .mvx-hero-side { right: 2.5%; bottom: auto; top: 6%; }
.mvx-page .mvx-hero-age { border-radius: 4px; padding: 5px 12px; border-left: 3px solid #fff; background: rgba(0, 0, 0, .45); }
.mvx-hero-badges { position: absolute; right: 2.5%; bottom: 8%; z-index: 2; display: flex; gap: 18px; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.mvx-hb { display: inline-flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 800; color: #fff; text-shadow: 0 1px 4px rgba(0, 0, 0, .7); }
.mvx-hb .material-icons { font-size: 18px; color: #e50914; }
.mvx-hb-top { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 3px; background: #e50914; color: #fff; font-size: 7px; line-height: 7px; font-weight: 900; text-align: center; }
.mvx-page .mvx-rows { margin: 34px auto 0; }
.mvx-page .mvx-rows.no-hero { padding-top: 10px; }
.mvx-page .mvx-page-h { padding-top: 10px; }
@media (max-width: 800px) {
    .mvx-page .mvx-top { padding: 10px 4%; flex-wrap: wrap; }
    .mvx-page .mvx-tabs a { padding: 6px 12px; font-size: 14px; }
    .mvx-page .mvx-hero { width: 94%; height: 125vw; max-height: 68vh; border-radius: 14px; }
    .mvx-page .mvx-hero-shade { background: linear-gradient(to top, rgba(0, 0, 0, .92) 0%, rgba(0, 0, 0, .5) 45%, rgba(0, 0, 0, 0) 75%); }
    .mvx-page .mvx-hero-info { top: auto; bottom: 6%; transform: none; left: 0; right: 0; width: auto; padding: 0 5%; }
    .mvx-page .mvx-hero-side { top: 4%; right: 4%; }
    .mvx-hero-badges { display: none; }
    .mvx-page .mvx-hero-desc, .mvx-page .mvx-hero-tag { display: none; }
    .mvx-page .mvx-hero-logo { margin: 0 auto 10px; object-position: center bottom; max-height: 90px; }
    .mvx-page .mvx-hero-meta { font-size: 13px; justify-content: center; }
    .mvx-page .mvx-hero-btns { flex-wrap: nowrap; justify-content: center; }
    .mvx-page .mvx-hero-btns .mvx-btn { flex: 1 1 0; max-width: 220px; font-size: 14px; padding: 0 10px; height: 40px; }
    .mvx-page .mvx-hero-btns .mvx-btn svg { width: 22px; height: 22px; }
    .mvx-page .mvx-hero { height: 112vw; max-height: 62vh; }
}

/* ==========================================================================
   /movie v3: the site's own colours (the same grey as the video page, light or dark), everything from the
   left edge (no centred column), a bigger featured title, the menu as a drawer
   ========================================================================== */
#mvx-page.mvx-page { background: var(--bg, #0b0b0f) !important; color: var(--text, #fff); }
.mvx-page .mvx-row-h, .mvx-page .mvx-page-h, .mvx-page .mvx-empty p { color: var(--text, #fff) !important; }
.mvx-page .mvx-empty { color: var(--text-2, #aaa); }
.mvx-page .mvx-tabs a { color: var(--text-2, #ddd) !important; }
.mvx-page .mvx-tabs a:hover { background: var(--surface-2, rgba(255, 255, 255, .08)); color: var(--text, #fff) !important; }
.mvx-page .mvx-tabs a.is-on { background: var(--surface-3, rgba(255, 255, 255, .16)); color: var(--text, #fff) !important; }
.mvx-page .mvx-manage { color: var(--text, #fff) !important; background: var(--surface-2, rgba(255, 255, 255, .06)); border-color: var(--border, rgba(255, 255, 255, .2)); }
.mvx-page .mvx-num { color: var(--bg, #0b0b0f); }
html:not(.vd-dark) .mvx-page .mvx-num { -webkit-text-stroke: 4px #a3a3ad; }
.mvx-page .mvx-hero h1, .mvx-page .mvx-hero .mvx-hero-title { color: #fff !important; }
/* from the left edge */
.mvx-page .mvx-top, .mvx-page .mvx-rows { max-width: none; margin-left: 0; margin-right: 0; }
.mvx-page .mvx-top { padding: 14px 2.6% 14px; }
.mvx-page .mvx-track { padding-left: 2.6%; padding-right: 2.6%; scroll-padding: 0 2.6%; }
.mvx-page .mvx-row-h, .mvx-page .mvx-page-h { padding-left: 2.6%; padding-right: 2.6%; }
.mvx-page .mvx-grid { padding: 0 2.6%; }
.mvx-page .mvx-hero { width: auto; max-width: none; margin: 0 2.6%; height: clamp(400px, 38vw, 720px); }
.mvx-page .mvx-hero-info { left: 3.5%; width: min(46%, 760px); }
.mvx-page .mvx-hero-logo { max-height: clamp(80px, 10vw, 200px); max-width: min(100%, 560px); }
/* the menu: a drawer here (also with an older theme script); the page uses the whole width */
@media (min-width: 1024px) {
    html body.mvx-body #wrapper, html.vs-js body.mvx-body #wrapper, html.vs-js.vs-open body.mvx-body #wrapper { margin-left: 0 !important; margin-right: 0 !important; width: auto !important; max-width: none !important; padding: 0 !important; }
    html.vs-js body.mvx-body #sidebar { width: 260px !important; transform: translateX(-102%); background: var(--bg-2) !important; box-shadow: var(--shadow) !important; padding: 8px 12px 0 !important; z-index: 1030; }
    html.vs-js:not(.vs-drawer-open) body.mvx-body #sidebar.hide { display: none !important; }
    html.vs-js.vs-drawer-open body.mvx-body #sidebar { display: block !important; transform: none; }
}
@media (max-width: 800px) {
    .mvx-page .mvx-hero { margin: 0 3%; height: 112vw; max-height: 64vh; }
}
/* "tap for sound" on the previews */
.mvx-snd-hint { position: absolute; z-index: 5; display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 20px; background: rgba(0, 0, 0, .6); color: #fff; font-size: 13px; font-weight: 700; border: 1px solid rgba(255, 255, 255, .35); cursor: pointer; animation: mvxpulse 2s ease-in-out infinite; }
.mvx-snd-hint svg { width: 18px; height: 18px; }
.mvx-hero .mvx-snd-hint { right: 2.5%; top: 18%; }
@keyframes mvxpulse { 50% { box-shadow: 0 0 0 6px rgba(255, 255, 255, .12); } }

/* the homepage band "And now, the movies!": the whole width, soft on the sides, lower */
.mvx-home .mvx-intro { max-width: none; margin: 6px 0 22px; padding: 18px 24px; border-radius: 0; display: flex; align-items: center; justify-content: center; gap: 18px; flex-wrap: wrap; text-align: left;
    background: linear-gradient(90deg, rgba(20, 20, 20, 0) 0%, #1b0b0d 18%, #2a0b10 50%, #1b0b0d 82%, rgba(20, 20, 20, 0) 100%); box-shadow: none; }
.mvx-home .mvx-intro:before { left: 50%; top: -40px; width: 60%; height: 140px; margin-left: -30%; background: radial-gradient(closest-side, rgba(229, 9, 20, .35), transparent); }
.mvx-home .mvx-intro:after { content: ""; position: absolute; left: 10%; right: 10%; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(229, 9, 20, .7), transparent); }
.mvx-home .mvx-intro-ico { width: 46px; height: 46px; margin: 0; flex: 0 0 46px; }
.mvx-home .mvx-intro-ico .material-icons { font-size: 24px; }
.mvx-home .mvx-intro-txt { position: relative; }
.mvx .mvx-home .mvx-intro h2, .mvx-home .mvx-intro h2 { font-size: clamp(19px, 2vw, 25px); margin: 0 0 2px; }
.mvx-home .mvx-intro p { margin: 0; font-size: 14px; }
.mvx-home .mvx-intro-btn { padding: 8px 16px; font-size: 14px; border-radius: 20px; }
@media (max-width: 700px) { .mvx-home .mvx-intro { text-align: center; padding: 16px 12px; } .mvx-home .mvx-intro-txt { flex: 1 1 100%; } }
/* the save bar of the editor (always at the bottom of the window) */
.mvm-savebar { position: fixed; left: 50%; bottom: 14px; transform: translateX(-50%); z-index: 1040; width: min(1100px, calc(100% - 24px)); display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
    padding: 10px 12px 10px 18px; border-radius: 14px; background: var(--surface, #1b1b22); color: var(--text, #fff); border: 1px solid var(--border, rgba(255, 255, 255, .12)); box-shadow: 0 12px 40px rgba(0, 0, 0, .35); box-sizing: border-box; }
.mvm-savebar .mvm-sb-txt { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; }
.mvm-savebar .mvm-sb-txt .material-icons { font-size: 22px; color: #1a9d4a; }
.mvm-savebar small { flex: 1 1 260px; color: var(--text-3, #999); font-size: 12px; line-height: 1.35; }
.mvm-savebar .btn { display: inline-flex; align-items: center; gap: 6px; }
.mvm-savebar b { display: none; }
.mvm-savebar[data-state="saved"] .is-saved, .mvm-savebar[data-state="dirty"] .is-dirty, .mvm-savebar[data-state="saving"] .is-saving { display: inline; }
.mvm-savebar[data-state="dirty"] { border-color: #e08a00; box-shadow: 0 12px 40px rgba(0, 0, 0, .35), 0 0 0 2px rgba(224, 138, 0, .35); }
.mvm-savebar[data-state="dirty"] .mvm-sb-txt .material-icons { color: #e08a00; }
.mvm-savebar[data-state="dirty"] .btn-primary { animation: mvxpulse 1.6s ease-in-out infinite; }
.mvm { padding-bottom: 120px !important; }
.mvm-ep.is-dirty { box-shadow: inset 3px 0 0 #e08a00; }
.mvm-danger { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
@media (max-width: 700px) { .mvm-savebar small { display: none; } .mvm-savebar { bottom: 8px; padding: 8px 10px; } }

/* "Update from the FTP folder" */
.mvm-synch { margin: 14px 0 8px; font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--text-2, #777); }
.mvm-sync select { width: auto !important; max-width: 260px; padding: 6px 8px !important; font-size: 13px !important; }
.mvm-sync .mvm-synlang { max-width: 70px; }
.mvm-match { font-style: normal; font-size: 10.5px; font-weight: 800; background: #1a9d4a; color: #fff; border-radius: 4px; padding: 1px 6px; margin-right: 4px; text-transform: uppercase; }
@media (max-width: 700px) { .mvm-sync { flex-wrap: wrap; } .mvm-sync select { max-width: 100%; flex: 1 1 100%; } }

/* ==========================================================================
   v6 rows like Netflix (2026): wide pictures 16:9 with the title logo, 8 in a row on big screens,
   6 px apart, a calm hover (the preview card opens); Top 10 = the big outlined number + the poster;
   "Recently added" at the bottom middle; the progress line under the picture
   ========================================================================== */
.mvx .mvx-row { margin: 0 0 3vw; }
.mvx .mvx-row-h { display: block; margin: 0 0 .5em; font-size: clamp(16px, 1.25vw, 22px); font-weight: 700; letter-spacing: 0; line-height: 1.25; }
.mvx .mvx-track { gap: 6px; padding-top: 0; padding-bottom: 6px; }
.mvx .mvx-item { flex: 0 0 calc((100% - 7 * 6px) / 8); min-width: 0; }
.mvx .mvx-card { border-radius: 4px; background: #232323; box-shadow: none; outline: 0; transform: none !important; transition: none; }
.mvx .mvx-card img { transition: none; transform: none !important; filter: none !important; }
.mvx .mvx-card:after { display: none; }
.mvx .mvx-item:hover .mvx-card { transform: none; box-shadow: none; }
/* the title on the wide picture: the TMDB logo, else the name */
.mvx .mvx-card img.mvx-logo { position: absolute; inset: auto; left: 7%; bottom: 11%; top: auto; right: auto; width: auto; height: auto; max-width: 72%; max-height: 40%; object-fit: contain; object-position: left bottom; z-index: 1; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .6)) !important; }
.mvx-ttl { position: absolute; left: 7%; right: 7%; bottom: 10%; z-index: 1; color: #fff; font-family: "Arial Black", "Inter", Arial, sans-serif; font-size: clamp(13px, 1.05vw, 19px); font-weight: 900; line-height: 1.05; text-transform: uppercase; letter-spacing: .01em; text-shadow: 0 2px 8px rgba(0, 0, 0, .85), 0 0 2px rgba(0, 0, 0, .9); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mvx .mvx-badge, .mvx .mvx-item:not(.is-top) .mvx-badge, .mvx .mvx-item.is-top .mvx-badge { left: 50%; right: auto; top: auto; bottom: 0; transform: translateX(-50%); z-index: 2; border-radius: 2px 2px 0 0; background: #e50914; color: #fff; font-size: clamp(10px, .65vw, 13px); font-weight: 700; letter-spacing: 0; text-transform: none; padding: 3px 7px 2px; box-shadow: none; white-space: nowrap; }
.mvx .mvx-tag { display: none; }
/* the progress line under the picture */
.mvx .mvx-prog { position: relative; display: block; left: auto; right: auto; bottom: auto; width: 60%; height: 2px; margin: 4px auto 0; border-radius: 0; background: #4d4d4d; overflow: hidden; z-index: 1; }
.mvx .mvx-prog i { background: #e50914; }
/* Top 10: the number behind, the poster on the right half */
.mvx .mvx-item.is-top { display: block; position: relative; aspect-ratio: 1.4 / 1; container-type: inline-size; }
.mvx .mvx-item.is-top .mvx-card { position: absolute; right: 0; top: 0; bottom: 0; width: 50%; height: 100%; aspect-ratio: auto; border-radius: 4px; z-index: 1; }
.mvx .mvx-num { display: block !important; position: absolute; left: 0; top: 0; bottom: 0; right: 42%; z-index: 0; margin: 0; padding: 0; text-align: right; overflow: visible; user-select: none; pointer-events: none;
    font-family: "Arial Black", "Helvetica Neue", Arial, sans-serif !important; font-weight: 900; font-size: 13.5vw; font-size: 103cqw; line-height: .96; letter-spacing: -.07em;
    color: var(--mv-bg, #141414); -webkit-text-stroke: 4px #595959; white-space: nowrap; display: flex !important; align-items: flex-end; justify-content: flex-end; }
.mvx-page .mvx-num, .mvx-home .mvx-num { color: var(--bg, #141414); }
html:not(.vd-dark) .mvx .mvx-num { -webkit-text-stroke-color: #a8a8b3; }
.mvx .mvx-item.is-top:nth-child(n+10) .mvx-num { letter-spacing: -.12em; font-size: 9.5vw; font-size: 76cqw; }
/* hover: nothing moves (the preview card opens over it); the picture gets a little lighter */
.mvx .mvx-item:hover .mvx-card img { filter: brightness(1.08) !important; }
/* how many in a row */
@media (max-width: 1799px) { .mvx .mvx-item { flex-basis: calc((100% - 5 * 6px) / 6); } }
@media (max-width: 1399px) { .mvx .mvx-item { flex-basis: calc((100% - 4 * 6px) / 5); } }
@media (max-width: 1099px) { .mvx .mvx-item { flex-basis: calc((100% - 3 * 6px) / 4); } }
@media (max-width: 799px) { .mvx .mvx-item { flex-basis: calc((100% - 2 * 6px) / 3); } .mvx .mvx-num { -webkit-text-stroke-width: 3px; } }
@media (max-width: 499px) { .mvx .mvx-item { flex-basis: calc((100% - 1 * 6px) / 2.2); } .mvx .mvx-num { -webkit-text-stroke-width: 2px; } }
/* My list: the same cards in a grid */
.mvx-page .mvx-grid { gap: 26px 6px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.mvx-page .mvx-grid .mvx-item { flex: none; }
/* old TV browsers without aspect-ratio / container queries */
@supports not (aspect-ratio: 1 / 1) { .mvx .mvx-item.is-top { height: 0; padding-top: 71.4%; } }
/* v6 fine tuning: the number narrower (it stays in its own place), the title above "Recently added" */
.mvx .mvx-num { right: 40%; overflow: hidden; font-family: "Helvetica Neue", Arial, "Liberation Sans", sans-serif !important; font-weight: 700; letter-spacing: -.04em; font-size: 12.5vw; font-size: 100cqw; }
.mvx .mvx-item.is-top:nth-child(n+10) .mvx-num { letter-spacing: -.1em; font-size: 9vw; font-size: 70cqw; right: 38%; }
.mvx .mvx-card img.mvx-logo { bottom: 22%; }
.mvx-ttl { bottom: 21%; }
/* the manager: Movies and Series apart */
.mvm-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 18px; }
.mvm-tabs a { display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; border-radius: 22px; background: var(--surface-2, #eee); color: var(--text, #222) !important; font-weight: 700; text-decoration: none !important; }
.mvm-tabs a .material-icons { font-size: 18px; }
.mvm-tabs a b { font-size: 12px; background: rgba(127, 127, 127, .22); border-radius: 10px; padding: 1px 7px; }
.mvm-tabs a.is-on { background: #e50914; color: #fff !important; }
.mvm-tabs a.is-on b { background: rgba(255, 255, 255, .25); }
.mvm-group { margin: 0 0 30px; }
.mvm-group-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 12px; padding: 0 0 10px; border-bottom: 2px solid var(--border, #e5e5e5); }
.mvm-group-h h2 { margin: 0; font-size: 20px; font-weight: 800; display: flex; align-items: center; gap: 8px; }
.mvm-group-h h2 .material-icons { color: #e50914; }
.mvm-group-h h2 span { font-size: 13px; font-weight: 800; color: var(--text-2, #777); background: var(--surface-2, #eee); border-radius: 12px; padding: 2px 9px; }
.mvm-group-h .btn { display: inline-flex; align-items: center; gap: 5px; }
/* the Top 10 number as tall as the poster: its top at the top of the poster, its foot on the bottom line */
.mvx .mvx-num { top: 0; bottom: 0; font-size: 12.2vw; font-size: 97cqw; line-height: 1; align-items: flex-end; padding-bottom: 0; }
.mvx .mvx-num { overflow: visible; }
.mvx .mvx-item.is-top { overflow: hidden; }
.mvx .mvx-num { transform: translateY(.15em); } /* fine-tuned by movies.js (fitNums) for the real font */
.mvx .mvx-item.is-top:nth-child(n+10) .mvx-num { font-size: 9.5vw; font-size: 76cqw; }
@media (max-width: 800px) { .mvx-page .mvx-hero-info { left: 0; right: 0; width: auto; top: auto; bottom: 6%; transform: none; } }
/* the number starts behind the poster (its right part is covered, like Netflix) */
.mvx .mvx-num { right: 33%; }
.mvx .mvx-item.is-top:nth-child(n+10) .mvx-num { right: 30%; }
/* the sound hint: only the icon, a round button */
.mvx-snd-hint { width: 42px; height: 42px; padding: 0; gap: 0; justify-content: center; border-radius: 50%; font-size: 0; }
.mvx-snd-hint svg { width: 22px; height: 22px; fill: currentColor; }
/* TV browsers that draw the pictures taller than 16:9: movies.js measures it and sets the heights in px
   (html.mvx-fixar is set only there - computers and phones never get it) */
html.mvx-fixar .mvx-card, html.mvx-fixar .mvx-hv-media, html.mvx-fixar .mvx-m-media, html.mvx-fixar .mvx-ep-img, html.mvx-fixar .mvx-sim-img { aspect-ratio: auto !important; overflow: hidden; }
html.mvx-fixar .mvx-card:before, html.mvx-fixar .mvx-hv-media:before, html.mvx-fixar .mvx-m-media:before, html.mvx-fixar .mvx-ep-img:before, html.mvx-fixar .mvx-sim-img:before { content: none !important; display: none !important; padding: 0 !important; }
html.mvx-fixar .mvx .mvx-item.is-top { aspect-ratio: auto !important; padding-top: 0 !important; overflow: hidden; }
html.mvx-fixar .mvx .mvx-item.is-top .mvx-card { position: absolute; right: 0; top: 0; width: 50%; }
html.mvx-fixar .mvx-card > img:not(.mvx-logo), html.mvx-fixar .mvx-hv-media > img, html.mvx-fixar .mvx-hv-media > video, html.mvx-fixar .mvx-m-media > img, html.mvx-fixar .mvx-m-media > video, html.mvx-fixar .mvx-ep-img > img, html.mvx-fixar .mvx-sim-img > img {
    position: absolute; top: 0; left: 0; right: auto; bottom: auto; width: 100%; height: 100%; max-height: none; object-fit: cover; }
/* the manager: a stopped conversion, the summary of the episodes */
.mvm-st.is-fail { color: #d0021b; }
.mvm-srcf { font-size: 11.5px; color: var(--text-3, #888); word-break: break-all; }
.mvm-reconv { display: inline-flex !important; align-items: center; gap: 3px; margin-left: 4px; }
.mvm-epsum { margin: 12px 0 16px; padding: 12px 14px; border-radius: 12px; background: var(--surface-2, #f3f3f6); border: 1px solid var(--border, #e5e5ea); }
.mvm-sum-h { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-bottom: 8px; }
.mvm-sum-h b { font-size: 14px; margin-right: 4px; }
.mvm-sum-h em { font-style: normal; font-size: 12px; font-weight: 800; padding: 2px 9px; border-radius: 12px; }
.mvm-sum-h em.is-ok, .mvm-sum-ep.is-ok i { background: rgba(26, 157, 74, .14); color: #1a9d4a; }
.mvm-sum-h em.is-run, .mvm-sum-ep.is-run i { background: rgba(224, 138, 0, .15); color: #c77700; }
.mvm-sum-h em.is-fail, .mvm-sum-ep.is-fail i { background: rgba(208, 2, 27, .13); color: #d0021b; }
.mvm-sum-h em.is-none, .mvm-sum-ep.is-none i { background: rgba(127, 127, 127, .16); color: var(--text-3, #888); }
.mvm-sum-s { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 6px 0 0; }
.mvm-sum-s > b { font-size: 12px; min-width: 70px; color: var(--text-2, #666); }
.mvm-sum-ep { display: inline-flex; align-items: center; gap: 0; border-radius: 8px; overflow: hidden; border: 1px solid var(--border, #ddd); background: var(--surface, #fff); color: var(--text, #222) !important; text-decoration: none !important; font-size: 12px; font-weight: 800; }
.mvm-sum-ep span { padding: 3px 7px; }
.mvm-sum-ep i { font-style: normal; padding: 3px 7px; font-size: 11px; }
.mvm-sum-ep.is-fail { border-color: rgba(208, 2, 27, .5); }
.mvm-ep.is-flash { box-shadow: 0 0 0 3px #e50914; transition: box-shadow .3s; }
/* the manager: calm buttons (no glow, no gradient), one "Add" button with a choice */
#mvm .btn { box-shadow: none !important; filter: none !important; text-shadow: none !important; transform: none !important; }
#mvm .btn-primary, #mvm .btn-primary:focus { background: #e50914 !important; border: 0 !important; color: #fff !important; }
#mvm .btn-primary:hover { background: #c40812 !important; }
#mvm .btn-default { background: var(--surface-2, #eee) !important; border: 1px solid var(--border, #ddd) !important; color: var(--text, #222) !important; }
#mvm .btn-default:hover { background: var(--surface-3, #e2e2e8) !important; }
.mvm-head { align-items: center; padding: 0 0 16px; margin-bottom: 16px; border-bottom: 1px solid var(--border, #e5e5ea); }
.mvm-head h1 { font-size: 24px; }
.mvm-head h1 .material-icons { font-size: 26px; }
.mvm-head p { font-size: 13px; }
.mvm-head-btns { align-items: center; gap: 8px; }
.mvm-flat { height: 40px; padding: 0 16px !important; border-radius: 10px !important; font-weight: 700 !important; font-size: 14px !important; }
.mvm-addnew { position: relative; }
.mvm-add-btn .mvm-caret { font-size: 20px; margin-left: -2px; transition: transform .15s; }
.mvm-addnew.is-open .mvm-caret { transform: rotate(180deg); }
.mvm-add-menu { position: absolute; right: 0; top: calc(100% + 6px); z-index: 50; width: 300px; padding: 6px; border-radius: 14px; background: var(--surface, #fff); border: 1px solid var(--border, #e5e5ea); box-shadow: 0 14px 36px rgba(0, 0, 0, .28); }
.mvm-add-menu[hidden] { display: none; }
.mvm-add-h { display: block; padding: 6px 10px 4px; font-size: 11.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--text-3, #888); }
.mvm-add-menu a { display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: 10px; color: var(--text, #222) !important; text-decoration: none !important; }
.mvm-add-menu a:hover { background: var(--surface-2, #f1f1f4); }
.mvm-add-menu a > .material-icons { width: 40px; height: 40px; flex: 0 0 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: rgba(229, 9, 20, .12); color: #e50914; font-size: 22px; }
.mvm-add-menu b { display: block; font-size: 14.5px; }
.mvm-add-menu small { display: block; font-size: 12px; color: var(--text-2, #777); line-height: 1.35; }
/* the tabs and the groups: quieter */
.mvm-tabs { gap: 6px; margin: 0 0 20px; }
.mvm-tabs a { padding: 6px 14px; border-radius: 10px; font-size: 13.5px; background: transparent; border: 1px solid var(--border, #ddd); }
.mvm-tabs a:hover { background: var(--surface-2, #eee); }
.mvm-tabs a.is-on { background: var(--text, #222); border-color: var(--text, #222); color: var(--bg, #fff) !important; }
.mvm-tabs a.is-on b { background: rgba(127, 127, 127, .3); }
.mvm-group-h { border-bottom-width: 1px; padding-bottom: 8px; }
.mvm-group-h h2 { font-size: 17px; }
.mvm-group-h h2 .material-icons { font-size: 20px; color: var(--text-2, #888); }
.mvm-gadd { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 700; color: var(--text-2, #777) !important; text-decoration: none !important; padding: 4px 8px; border-radius: 8px; }
.mvm-gadd .material-icons { font-size: 18px; }
.mvm-gadd:hover { background: var(--surface-2, #eee); color: var(--text, #222) !important; }
.mvm-row .mvm-st + .mvm-st { margin-left: 4px; }
@media (max-width: 600px) { .mvm-head-btns .mvm-flat span { display: none; } .mvm-add-menu { width: min(300px, 86vw); } }
#mvm .btn, #mvm .btn:hover, .mvm-add-menu a { text-decoration: none !important; }
.mvm-add-menu .material-icons, .mvm-add-btn .material-icons { animation: none !important; }
/* the player: Cast to TV (top right) and the small remote while casting */
.mvp-top .mvp-cast { margin-left: auto; width: 46px; height: 46px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, .25); }
.mvp-top .mvp-cast svg { width: 28px; height: 28px; fill: #fff; }
.mvp-top .mvp-cast:hover { background: rgba(255, 255, 255, .15); }
.mvp-tv { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 6; min-width: min(380px, 88vw); padding: 22px 24px; border-radius: 18px; background: rgba(15, 15, 18, .88); color: #fff; text-align: center; box-shadow: 0 20px 60px rgba(0, 0, 0, .6); }
.mvp-tv[hidden] { display: none; }
.mvp-tv svg { width: 44px; height: 44px; fill: #e50914; }
.mvp-tv b { display: block; font-size: 18px; margin: 6px 0 2px; }
.mvp-tv small { display: block; color: #bbb; font-size: 13px; margin-bottom: 14px; }
.mvp-tv div { display: flex; gap: 10px; justify-content: center; }
.mvp-tv button { border: 0; border-radius: 10px; padding: 10px 18px; font-weight: 800; font-size: 14px; cursor: pointer; background: #fff; color: #111; }
.mvp-tv .mvp-tv-stop { background: rgba(255, 255, 255, .14); color: #fff; }
.mvp.is-casting .mvp-big, .mvp.is-casting .mvp-cues, .mvp.is-casting .mvp-spin { display: none !important; }
@media (max-width: 700px) { .mvp-top .mvp-cast { width: 40px; height: 40px; } .mvp-top .mvp-cast svg { width: 24px; height: 24px; } }
.mvp-tv > svg { display: block; margin: 0 auto; }
.mvm-pvstat { margin: 8px 0 10px; font-size: 13px; }
.mvm-pvlog { margin: 8px 0 0; padding: 10px; border-radius: 8px; background: #111; color: #f88; font-size: 11.5px; white-space: pre-wrap; word-break: break-word; max-height: 180px; overflow: auto; }
.mvm-pverr { margin-top: 6px; color: #d0021b; font-size: 12.5px; font-weight: 700; word-break: break-all; }
.mvm-q.is-bad { background: rgba(208, 2, 27, .15) !important; color: #d0021b !important; text-decoration: line-through; }
/* the preview card: the title (TMDB logo, else the name) stays at the bottom left while the clip plays, like Netflix */
.mvx-hover .mvx-hv-logo { position: absolute; inset: auto auto 14px 14px !important; left: 14px; bottom: 14px; z-index: 2; max-width: 55%; max-height: 34%; width: auto; height: auto; object-fit: contain; object-position: left bottom; filter: drop-shadow(0 2px 8px rgba(0, 0, 0, .75)); pointer-events: none; }
.mvx-hover .mvx-hv-title, .mvx-hover.is-playing .mvx-hv-title { opacity: 1; z-index: 2; font-family: "Arial Black", Arial, sans-serif; text-transform: uppercase; letter-spacing: .06em; font-size: 20px; bottom: 14px; left: 14px; text-shadow: 0 2px 10px rgba(0, 0, 0, .9); pointer-events: none; }
.mvx-hover .mvx-hv-media:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 45%; background: linear-gradient(to top, rgba(0, 0, 0, .55), rgba(0, 0, 0, 0)); pointer-events: none; z-index: 1; }
.mvx-hover .mvx-hv-mute { z-index: 3; }
/* cast: the "why the TV could not play it" box */
.mvp-tv .mvp-tv-err { display: block; white-space: pre-line; text-align: left; font-style: normal; font-size: 12.5px; line-height: 1.45; color: #ffd27a; background: rgba(255, 255, 255, .06); border-radius: 10px; padding: 10px 12px; margin: -4px 0 14px; max-width: 440px; word-break: break-word; }
.mvp-tv .mvp-tv-err[hidden] { display: none; }
.mvp-tv.is-fail > svg { fill: #888; }
.mvp-tv.is-fail small { word-break: break-word; }
.mvp-tv button[hidden] { display: none; }
.mvp-tv div { flex-wrap: wrap; }
.mvp-tv .mvp-tv-test { background: rgba(255, 255, 255, .14); color: #fff; }
.mvm-site-lbl { font-size: 12px; font-weight: 700; opacity: .75; margin-right: 2px; }
.mvm-tvc { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 10px 0 2px; padding: 9px 12px; border-radius: 10px; border: 1px solid rgba(59, 130, 246, .35); background: rgba(59, 130, 246, .07); font-size: 12px; }
.mvm-tvc b { font-size: 12.5px; margin-right: 4px; }
.mvm-tvc-c { padding: 2px 8px; border-radius: 6px; background: rgba(59, 130, 246, .14); font-weight: 600; }
.mvm-tvc-c.is-q { background: #3b82f6; color: #fff; }
.mvm-tvc-c.is-run { background: rgba(234, 179, 8, .2); }
.mvm-tvc-c.is-left { background: transparent; opacity: .8; font-weight: 500; }
.mvm-tvc small { flex-basis: 100%; opacity: .65; font-size: 11.5px; }
.mvp-tv .mvp-tv-err.is-ok { color: #7ee2a8; text-align: center; }
#mvp video, .mvp-v { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
.mvm-tvc-row { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }

/* ==========================================================================
   /movie/request/ - "Request a movie" (follows the site colours: dark / light)
   ========================================================================== */
.mvr { --r-red: #e50914; --r-card: var(--surface-1, var(--bg-2, rgba(255, 255, 255, .04))); --r-line: var(--border, rgba(255, 255, 255, .12)); --r-t: var(--text, #fff); --r-t2: var(--text-2, #aaa); padding-bottom: 60px; }
.mvr h1, .mvr h2, .mvr h3 { color: var(--r-t) !important; }
.mvr .material-icons { vertical-align: middle; }
.mvr-badge { display: inline-block; min-width: 20px; padding: 0 6px; margin-left: 4px; border-radius: 10px; background: var(--r-red); color: #fff; font-size: 12px; line-height: 20px; text-align: center; }
.mvr-hero { position: relative; margin: 0 2.6%; border-radius: 22px; overflow: hidden; background: radial-gradient(1200px 400px at 85% -10%, rgba(229, 9, 20, .55), transparent 60%), radial-gradient(800px 300px at 0% 120%, rgba(120, 40, 200, .35), transparent 60%), linear-gradient(135deg, #1a0d10, #0d0d14 60%, #101018); color: #fff; }
.mvr-hero-in { padding: clamp(26px, 4vw, 54px) clamp(20px, 4vw, 56px); max-width: 1180px; }
.mvr-hero h1 { font-size: clamp(26px, 3.2vw, 46px); font-weight: 900; line-height: 1.05; letter-spacing: -.02em; margin: 10px 0 12px; color: #fff !important; }
.mvr-hero p { font-size: clamp(14px, 1.2vw, 18px); color: rgba(255, 255, 255, .82); max-width: 760px; margin: 0 0 24px; }
.mvr-kicker { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 20px; background: rgba(229, 9, 20, .18); color: #ff6b73; font-weight: 800; font-size: 13px; letter-spacing: .02em; text-transform: uppercase; }
.mvr-kicker .material-icons { font-size: 18px; }
.mvr-steps { list-style: none; padding: 0; margin: 0 0 22px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.mvr-steps li { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: 14px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .09); }
.mvr-steps li > b { flex: 0 0 34px; height: 34px; border-radius: 50%; background: var(--r-red); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 900; }
.mvr-steps strong { display: block; color: #fff; font-size: 15px; margin-bottom: 2px; }
.mvr-steps span { font-size: 13px; color: rgba(255, 255, 255, .72); line-height: 1.4; }
.mvr-stats { display: flex; flex-wrap: wrap; gap: 8px 22px; font-size: 14px; color: rgba(255, 255, 255, .75); }
.mvr-stats b { color: #fff; font-size: 20px; font-weight: 900; margin-right: 2px; }
.mvr-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 22px; margin: 22px 2.6% 0; align-items: start; }
.mvr-form-box, .mvr-tip, .mvr-done { background: var(--r-card); border: 1px solid var(--r-line); border-radius: 18px; }
.mvr-form-box { padding: 22px 24px 24px; }
.mvr-form-box h2, .mvr-sec h2 { font-size: 20px; font-weight: 800; margin: 0 0 16px; display: flex; align-items: center; gap: 8px; }
.mvr-form-box h2 .material-icons, .mvr-sec h2 .material-icons { color: var(--r-red); }
.mvr-login { display: flex; align-items: center; gap: 14px; padding: 18px; border-radius: 14px; background: rgba(229, 9, 20, .08); border: 1px dashed rgba(229, 9, 20, .4); color: var(--r-t); }
.mvr-login > .material-icons { font-size: 34px; color: var(--r-red); }
.mvr-login div { flex: 1; } .mvr-login b { display: block; } .mvr-login span { color: var(--r-t2); font-size: 13px; }
.mvr-seg { display: inline-flex; padding: 4px; border-radius: 30px; background: var(--surface-2, rgba(255, 255, 255, .07)); margin-bottom: 16px; }
.mvr-seg label { display: inline-flex; align-items: center; gap: 6px; padding: 8px 18px; border-radius: 26px; cursor: pointer; font-weight: 700; color: var(--r-t2); margin: 0; transition: background .15s, color .15s; }
.mvr-seg label.is-on { background: var(--r-red); color: #fff; }
.mvr-seg input, .mvr-chip input { position: absolute; opacity: 0; pointer-events: none; }
.mvr-field { margin-bottom: 16px; position: relative; }
.mvr-field > label { display: block; font-weight: 700; color: var(--r-t); margin-bottom: 6px; font-size: 14px; }
.mvr-field > label em { font-style: normal; font-weight: 400; color: var(--r-t2); }
.mvr-field small { display: block; color: var(--r-t2); font-size: 12px; margin-top: 6px; }
.mvr-field input[type=text], .mvr-field input[type=number], .mvr-field input[type=url], .mvr-field textarea { width: 100%; border-radius: 12px; border: 1px solid var(--r-line); background: var(--bg, rgba(0, 0, 0, .25)); color: var(--r-t); padding: 11px 14px; font-size: 15px; outline: none; transition: border-color .15s, box-shadow .15s; }
.mvr-field input:focus, .mvr-field textarea:focus { border-color: var(--r-red); box-shadow: 0 0 0 3px rgba(229, 9, 20, .18); }
.mvr-q-wrap { position: relative; }
.mvr-q-wrap .material-icons { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--r-t2); }
.mvr-q-wrap input[type=text] { padding-left: 44px; font-size: 17px; height: 52px; }
.mvr-sugg { position: absolute; left: 0; right: 0; top: 84px; z-index: 30; max-height: 420px; overflow: auto; border-radius: 14px; background: var(--bg-2, #1d1d22); border: 1px solid var(--r-line); box-shadow: 0 18px 50px rgba(0, 0, 0, .45); padding: 6px; }
.mvr-sugg-h { padding: 12px; color: var(--r-t2); font-size: 14px; }
.mvr-sg { display: flex; gap: 12px; align-items: center; width: 100%; text-align: left; padding: 8px; border: 0; border-radius: 10px; background: transparent; color: var(--r-t); cursor: pointer; }
.mvr-sg:hover { background: var(--surface-2, rgba(255, 255, 255, .07)); }
.mvr-sg img, .mvr-sg-noimg { width: 44px; height: 66px; border-radius: 6px; object-fit: cover; flex: 0 0 44px; background: rgba(127, 127, 127, .2); display: flex; align-items: center; justify-content: center; }
.mvr-sg-t { display: block; min-width: 0; }
.mvr-sg-t b { font-size: 15px; } .mvr-sg-t > span { color: var(--r-t2); }
.mvr-sg-t small { display: block; color: var(--r-t2); font-size: 12px; }
.mvr-sg-t em, .mvr-pk-note { display: inline-block; margin-top: 4px; font-style: normal; font-size: 11.5px; font-weight: 700; padding: 2px 8px; border-radius: 8px; }
.is-have { background: rgba(70, 211, 105, .16); color: #2fbf71; }
.is-open { background: rgba(245, 158, 11, .16); color: #f59e0b; }
.mvr-picked { display: flex; gap: 16px; padding: 14px; border-radius: 14px; border: 1px solid rgba(229, 9, 20, .35); background: rgba(229, 9, 20, .06); margin: -4px 0 16px; color: var(--r-t); }
.mvr-picked img { width: 92px; height: 138px; border-radius: 10px; object-fit: cover; flex: 0 0 92px; box-shadow: 0 6px 18px rgba(0, 0, 0, .35); }
.mvr-picked b { font-size: 18px; } .mvr-picked small { display: block; color: var(--r-t2); }
.mvr-picked p { margin: 8px 0; color: var(--r-t2); font-size: 13px; line-height: 1.45; }
.mvr-pk-act { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.mvr-y { color: var(--r-t2); font-weight: 600; }
.mvr-row2 { display: grid; grid-template-columns: 180px 1fr; gap: 14px; }
.mvr-chips { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px; }
.mvr-chips.mvr-q2 { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.mvr-chip { position: relative; display: flex; gap: 10px; align-items: center; padding: 11px 13px; border-radius: 12px; border: 1px solid var(--r-line); cursor: pointer; margin: 0; color: var(--r-t); transition: border-color .15s, background .15s; }
.mvr-chip:hover { border-color: rgba(229, 9, 20, .5); }
.mvr-chip.is-on { border-color: var(--r-red); background: rgba(229, 9, 20, .1); box-shadow: inset 0 0 0 1px var(--r-red); }
.mvr-chip-i { font-size: 22px; flex: 0 0 auto; }
.mvr-chip b { display: block; font-size: 14px; } .mvr-chip small { display: block; color: var(--r-t2); font-size: 12px; font-weight: 400; }
.mvr-chip.is-small { justify-content: center; text-align: center; padding: 10px; }
.mvr-more { margin: 4px 0 16px; border-top: 1px solid var(--r-line); padding-top: 12px; }
.mvr-more summary { cursor: pointer; font-weight: 700; color: var(--r-t2); margin-bottom: 12px; }
.mvr-send { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.mvr-msg { font-weight: 600; font-size: 14px; }
.mvr-msg.is-ok { color: #2fbf71; } .mvr-msg.is-err { color: #ff6b73; } .mvr-msg a { color: inherit; text-decoration: underline; }
.mvr-btn { display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 16px; border-radius: 20px; border: 1px solid var(--r-line); background: var(--surface-2, rgba(255, 255, 255, .06)); color: var(--r-t) !important; font-weight: 700; font-size: 14px; cursor: pointer; text-decoration: none !important; transition: background .15s, transform .1s; }
.mvr-btn:hover { background: var(--surface-3, rgba(255, 255, 255, .12)); }
.mvr-btn:active { transform: scale(.97); }
.mvr-btn .material-icons { font-size: 19px; }
.mvr-btn.is-red { background: var(--r-red); border-color: var(--r-red); color: #fff !important; }
.mvr-btn.is-red:hover { background: #f6121d; }
.mvr-btn.is-ghost { background: transparent; }
.mvr-btn.is-big { height: 48px; padding: 0 26px; font-size: 16px; border-radius: 26px; }
.mvr-btn[disabled] { opacity: .6; pointer-events: none; }
.mvr-side { display: flex; flex-direction: column; gap: 16px; }
.mvr-tip { display: flex; gap: 12px; padding: 18px; color: var(--r-t); }
.mvr-tip > .material-icons { color: #60a5fa; }
.mvr-tip ul { margin: 8px 0 0; padding-left: 18px; color: var(--r-t2); font-size: 13px; line-height: 1.5; }
.mvr-tip li { margin-bottom: 6px; }
.mvr-done { padding: 16px 18px; color: var(--r-t); }
.mvr-done b { display: flex; align-items: center; gap: 6px; margin-bottom: 12px; } .mvr-done b .material-icons { color: #2fbf71; }
.mvr-done-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.mvr-done-grid a { display: block; aspect-ratio: 2 / 3; border-radius: 10px; overflow: hidden; background: rgba(127, 127, 127, .2); }
.mvr-done-grid img { width: 100%; height: 100%; object-fit: cover; transition: transform .2s; }
.mvr-done-grid a:hover img { transform: scale(1.05); }
.mvr-done-grid span { display: flex; align-items: center; justify-content: center; height: 100%; padding: 6px; text-align: center; font-size: 12px; }
.mvr-sec { margin: 34px 2.6% 0; }
.mvr-sub, .mvr-empty { color: var(--r-t2); margin: -8px 0 16px; }
.mvr-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 14px; }
.mvr-req { display: flex; gap: 14px; padding: 14px; border-radius: 16px; background: var(--r-card); border: 1px solid var(--r-line); color: var(--r-t); transition: border-color .2s, box-shadow .2s; }
.mvr-req.is-new { animation: mvrNew 1.6s ease 2; }
@keyframes mvrNew { 50% { box-shadow: 0 0 0 3px rgba(229, 9, 20, .55); } }
.mvr-req-pic { flex: 0 0 74px; height: 111px; border-radius: 10px; overflow: hidden; background: rgba(127, 127, 127, .18); display: flex; align-items: center; justify-content: center; }
.mvr-req-pic img { width: 100%; height: 100%; object-fit: cover; }
.mvr-req-pic .material-icons { font-size: 30px; color: var(--r-t2); }
.mvr-req-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.mvr-req-top b { font-size: 16px; }
.mvr-req-meta { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12.5px; color: var(--r-t2); }
.mvr-votes .material-icons { font-size: 15px; }
.mvr-st { align-self: flex-start; display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: 12px; font-size: 12px; font-weight: 800; }
.mvr-st .material-icons { font-size: 15px; }
.mvr-st.is-new { background: rgba(148, 163, 184, .18); color: #94a3b8; }
.mvr-st.is-work { background: rgba(245, 158, 11, .16); color: #f59e0b; }
.mvr-st.is-done { background: rgba(70, 211, 105, .16); color: #2fbf71; }
.mvr-st.is-no { background: rgba(239, 68, 68, .14); color: #f87171; }
.mvr-reply { display: flex; gap: 8px; padding: 9px 12px; border-radius: 12px; background: var(--surface-2, rgba(255, 255, 255, .06)); font-size: 13px; line-height: 1.45; }
.mvr-reply .material-icons { font-size: 18px; color: var(--r-red); }
.mvr-req-act { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 4px; }
.mvr-req-act .mvr-btn { height: 34px; font-size: 13px; padding: 0 13px; }
.mvr-vote.is-on { background: rgba(70, 211, 105, .14); border-color: rgba(70, 211, 105, .5); color: #2fbf71 !important; }
/* the entry on /movie (discreet, next to the tabs) and the call at the end of the page */
.mvx-askbtn { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; padding: 7px 14px; border-radius: 22px; border: 1px solid var(--border, rgba(255, 255, 255, .2)); background: var(--surface-2, rgba(255, 255, 255, .06)); color: var(--text, #fff) !important; text-decoration: none !important; margin-left: auto; }
.mvx-askbtn .material-icons { font-size: 18px; color: #e50914; }
.mvx-top .mvx-askbtn + .mvx-manage { margin-left: 8px; }
.mvx-askcta { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: 40px 2.6% 10px; padding: 22px 26px; border-radius: 18px; background: linear-gradient(135deg, rgba(229, 9, 20, .16), rgba(120, 40, 200, .12)); border: 1px solid rgba(229, 9, 20, .25); color: var(--text, #fff); }
.mvx-askcta b { display: block; font-size: 18px; } .mvx-askcta span { color: var(--text-2, #bbb); font-size: 14px; }
@media (max-width: 980px) { .mvr-wrap { grid-template-columns: 1fr; } .mvr-steps { grid-template-columns: 1fr; } }
@media (max-width: 600px) {
    .mvr-hero, .mvr-wrap, .mvr-sec { margin-left: 12px; margin-right: 12px; }
    .mvr-form-box { padding: 18px 16px; }
    .mvr-row2 { grid-template-columns: 1fr; }
    .mvr-list { grid-template-columns: 1fr; }
    .mvr-chips { grid-template-columns: 1fr; }
    .mvr-chips.mvr-q2 { grid-template-columns: repeat(3, 1fr); }
    .mvr-sugg { top: 84px; }
    .mvx-askbtn span { display: none; }
}
.mvr-picked[hidden], .mvr-sugg[hidden], .mvr-season[hidden], .mvra-title[hidden] { display: none !important; }

/* ---------------------------------------------------------------- rating like on Netflix (Not for me / I like this / Love this!) */
.mvx-rate { position: relative; display: inline-flex; flex: 0 0 auto; }
.mvx-rate-main.is-on { color: #fff; background: rgba(255, 255, 255, .22); border-color: #fff; }
.mvx-rate-pop { position: absolute; left: 50%; top: 50%; z-index: 12; display: flex; align-items: center; gap: 4px; padding: 4px 6px; border-radius: 30px; background: #232323; box-shadow: 0 6px 22px rgba(0, 0, 0, .65), 0 0 0 1px rgba(255, 255, 255, .06); transform: translate(-50%, -50%) scale(.6); opacity: 0; visibility: hidden; transition: transform .16s ease, opacity .16s ease, visibility 0s .16s; }
.mvx-rate:hover .mvx-rate-pop, .mvx-rate.is-open .mvx-rate-pop { transform: translate(-50%, -50%) scale(1); opacity: 1; visibility: visible; transition: transform .16s ease, opacity .16s ease; }
html.mvx-touch .mvx-rate:hover:not(.is-open) .mvx-rate-pop { opacity: 0; visibility: hidden; }
.mvx-rate-o { position: relative; width: 38px; height: 38px; border: 0; border-radius: 50%; background: transparent; color: #fff; padding: 8px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: background .12s, transform .12s; }
.mvx-rate-o svg { width: 22px; height: 22px; }
.mvx-rate-o:hover { background: rgba(255, 255, 255, .14); transform: scale(1.12); }
.mvx-rate-o.is-on { background: rgba(255, 255, 255, .22); }
.mvx-rate-tip { position: absolute; bottom: calc(100% + 10px); left: 50%; transform: translateX(-50%); white-space: nowrap; padding: 5px 10px; border-radius: 4px; background: #e6e6e6; color: #111; font-size: 13px; font-weight: 700; pointer-events: none; opacity: 0; transition: opacity .12s; box-shadow: 0 3px 10px rgba(0, 0, 0, .4); }
.mvx-rate-tip::after { content: ''; position: absolute; top: 100%; left: 50%; margin-left: -6px; border: 6px solid transparent; border-top-color: #e6e6e6; }
.mvx-rate-o:hover .mvx-rate-tip, .mvx-rate-o:focus-visible .mvx-rate-tip { opacity: 1; }
.mvx-m-btns .mvx-rate-main { width: 42px; height: 42px; flex-basis: 42px; font-size: 22px; }
.mvx-m-btns .mvx-rate-o { width: 44px; height: 44px; }

/* the conversion running now (manager): quality, percent, a bar */
.mvm-conv { display: block; width: 100%; max-width: 460px; margin: 6px 0 2px; padding: 10px 12px; border-radius: 12px; background: var(--surface-2, rgba(59, 130, 246, .06)); border: 1px solid var(--border, rgba(59, 130, 246, .2)); }
.mvm-conv.is-small { display: inline-block; vertical-align: middle; width: 320px; max-width: 100%; padding: 6px 10px; margin: 2px 0; }
.mvm-conv-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13px; }
.mvm-conv-top b { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; }
.mvm-conv-q { padding: 1px 7px; border-radius: 6px; background: #3b82f6; color: #fff; font-size: 11.5px; }
.mvm-conv-pct { font-weight: 800; font-variant-numeric: tabular-nums; color: #3b82f6; }
.mvm-conv-dot { width: 8px; height: 8px; border-radius: 50%; background: #3b82f6; animation: mvmPulse 1.2s ease-in-out infinite; }
@keyframes mvmPulse { 50% { opacity: .25; } }
.mvm-conv-bar { position: relative; height: 8px; margin: 7px 0 4px; border-radius: 6px; background: rgba(127, 127, 127, .2); overflow: hidden; }
.mvm-conv-bar i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 6px; background: linear-gradient(90deg, #3b82f6, #22c55e); transition: width .8s ease; }
.mvm-conv-bar i::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .35), transparent); animation: mvmShine 1.6s linear infinite; }
@keyframes mvmShine { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
.mvm-conv small { display: block; font-size: 11.5px; color: var(--text-2, #888); }
.mvm-conv.is-small .mvm-conv-bar { height: 6px; margin: 5px 0 2px; }
/* the list: the conversion box in the free space of the row (between the title and the buttons), centered */
@media (min-width: 900px) {
    .mvm-row { position: relative; }
    .mvm-lst-st .mvm-conv.is-small { position: absolute; left: 57%; top: 50%; transform: translate(-50%, -50%); width: 340px; margin: 0; z-index: 1; }
}
/* manage list: 5 per group, then "Show more" */
.mvm-row[hidden] { display: none !important; }
.mvm-more { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; margin-top: 10px; padding: 10px 14px; border: 1px dashed rgba(127,127,127,.45); border-radius: 12px; background: rgba(127,127,127,.04); color: inherit; font-weight: 600; font-size: 14px; cursor: pointer; transition: background .15s, border-color .15s; }
.mvm-more:hover { background: rgba(127,127,127,.08); border-color: #e50914; }
.mvm-more .material-icons { font-size: 20px; }

/* manage list: the qualities and the subtitles of each film / series, small, under its details */
.mvm-lst-files { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 6px; font-size: 12px; }
.mvm-lf-grp { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 4px; }
.mvm-lf-grp > .material-icons { font-size: 16px; opacity: .55; margin-right: 1px; }
.mvm-lst-q { display: inline-flex; flex-wrap: wrap; gap: 4px; }
.mvm-lfq, .mvm-lfs { display: inline-block; font-size: 11px; font-weight: 700; line-height: 1; padding: 3px 6px; border-radius: 5px; background: rgba(127,127,127,.14); color: inherit; letter-spacing: .2px; }
.mvm-lfq.is-hd { background: #f5c518; color: #111; } /* HD: gold (not red - red means a problem) */
.mvm-lfs { background: rgba(46,160,67,.14); color: #2ea043; }
.mvm-lfs small { font-size: 10px; font-weight: 600; opacity: .8; }
.mvm-lf-none { font-style: normal; opacity: .55; }
.mvm-lf-lbl { opacity: .7; font-weight: 600; margin-right: 2px; }

/* ---------- the info window like Netflix (computers only; phones stay as they are) ---------- */
.mvx-season-one b, .mvx-m-hprog, .mvx-sim-more { display: none; }
.mvx-m-epnow { font-size: 17px; font-weight: 400; margin: 0 0 10px; color: #fff !important; }
.mvx-m-epnow b { font-weight: 800; }
.mvx-age-w { font-style: normal; }
.mvx-age-w em { display: none; }
@media (min-width: 701px) { .mvx-age-w { display: inline-block; vertical-align: top; } }
@media (min-width: 701px) {
    .mvx-m-hprog { display: flex; align-items: center; gap: 12px; margin: 0 0 16px; max-width: 520px; }
    .mvx-m-hprog span { flex: 1; height: 2px; background: #5a5a5a; }
    .mvx-m-hprog i { display: block; height: 100%; background: var(--mv-red); }
    .mvx-m-hprog em { font-style: normal; font-size: 16px; color: #fff; white-space: nowrap; text-shadow: 0 1px 4px rgba(0, 0, 0, .6); }
    .mvx-m-prog { display: none; }
    .mvx-m-btns .mvx-btn-play { padding: 0 28px; height: 44px; font-size: 18px; font-weight: 700; border-radius: 4px; }
    .mvx-m-btns .mvx-circle, .mvx-m-btns .mvx-rate-main, .mvx-m-mute { border-width: 2px; }
    .mvx-m-meta { font-size: 16px; margin-bottom: 4px; }
    .mvx-m-age { font-size: 14px; margin-bottom: 14px; }
    .mvx-modal h3.mvx-m-tag { font-size: 18px; margin: 0 0 22px; }
    .mvx-m-epnow { font-size: 18px; margin: 0 0 16px; }
    .mvx-m-desc { font-size: 18px; line-height: 1.45; }
    .mvx-m-right p { font-size: 14px; line-height: 1.35; margin: 0 0 14px; color: #fff; }
    .mvx-m-sec { margin-top: 48px; }
    .mvx-modal .mvx-m-sec h3 { font-size: 24px; }
    .mvx-m-sech { align-items: flex-start; margin-bottom: 20px; }
    .mvx-season-one { font-size: 18px; color: #fff; max-width: 34%; line-height: 1.25; }
    .mvx-season-one b { display: block; font-weight: 400; }
    .mvx-season-one span { display: none; }
    .mvx-ep { grid-template-columns: 7% 130px 1fr; gap: 0 16px; padding: 32px 28px 32px 16px; min-height: 140px; border-radius: 4px; }
    .mvx-ep > b { font-size: 24px; }
    .mvx-ep-txt { font-size: 14px; line-height: 1.4; padding-right: 40px; }
    .mvx-ep-top { margin-bottom: 6px; }
    .mvx-ep-top strong { font-size: 16px; font-weight: 700; }
    .mvx-ep-top em { font-size: 16px; font-weight: 700; margin-right: -40px; }
    .mvx-sim { gap: 16px; }
    .mvx-sim-card { border-radius: 4px; }
    .mvx-sim-meta div { font-size: 16px; }
    .mvx-sim-card p { font-size: 14.5px; line-height: 1.45; padding: 12px 16px 18px; }
    .mvx-sim.is-short .mvx-sim-card:nth-child(n+7) { display: none; }
    .mvx-sim.is-short { max-height: none; }
    .mvx-sim-more { display: block; position: relative; height: 2px; background: #404040; margin: 26px 0 0; }
    .mvx-sim-more:before { content: ""; position: absolute; left: 0; right: 0; bottom: 2px; height: 90px; background: linear-gradient(to bottom, rgba(24, 24, 24, 0), var(--mv-card)); pointer-events: none; transform: translateY(-26px); }
    .mvx-sim-more.is-open:before { display: none; }
    .mvx-sim-more .mvx-circle { position: absolute; left: 50%; top: 50%; width: 40px; height: 40px; margin: -20px 0 0 -20px; font-size: 26px; background: rgba(42, 42, 42, .6); border: 2px solid rgba(255, 255, 255, .5); z-index: 1; }
    .mvx-sim-more.is-open .mvx-circle svg { transform: rotate(180deg); }
    /* trailers: the picture, the name under it (no card) */
    .mvx-sim-card.is-trailer { background: transparent; border-radius: 0; overflow: visible; }
    .mvx-sim-card.is-trailer .mvx-sim-img { border-radius: 4px; overflow: hidden; }
    .mvx-sim-card.is-trailer p { padding: 12px 0 0; font-size: 16px; color: #fff; }
    .mvx-about p { font-size: 14px; line-height: 1.5; margin: 0 0 8px; color: #fff; }
    .mvx-about p.mvx-about-age { display: flex; gap: 0 6px; align-items: flex-start; }
    .mvx-about-age > span:first-child { white-space: nowrap; }
    .mvx-about-age em { display: block; font-style: normal; margin: 6px 0 0; }
}

/* Netflix-like growing: the hover box out of the card, the info window out of the hover box / card (computers) */
.mvx-hover { transform: translateY(-50%) scale(var(--hv-s, .68)); transition: transform .45s cubic-bezier(.25, .8, .25, 1), opacity .24s ease, box-shadow .45s; box-shadow: 0 2px 8px rgba(0, 0, 0, .4); }
.mvx-hover.is-on { transform: translateY(-62%) scale(1); box-shadow: 0 6px 22px rgba(0, 0, 0, .75); }
.mvx-modal.is-morph { opacity: 1; background: rgba(0, 0, 0, 0); transition: background .5s ease; }
.mvx-modal.is-morph.is-on { background: rgba(0, 0, 0, .7); }
.mvx-modal.is-morph .mvx-modal-box { will-change: transform; }
@media (prefers-reduced-motion: reduce) { .mvx-hover, .mvx-hover.is-on { transition: opacity .15s; } }
/* the X next to a quality: deletes only that file */
.mvm-q { position: relative; }
.mvm-qdel { border: 0; background: rgba(208, 2, 27, .12); color: #d0021b; width: 15px; height: 15px; line-height: 13px; padding: 0; margin: 0 -2px 0 4px; border-radius: 50%; font-size: 13px; font-weight: 700; cursor: pointer; vertical-align: 0; opacity: .55; transition: opacity .15s, background .15s; }
.mvm-qdel:hover, .mvm-qdel:focus { opacity: 1; background: #d0021b; color: #fff; outline: 0; }
.mvm-qdel:disabled { opacity: .3; cursor: wait; }
/* the episode buttons: small, each with what it does under it */
.mvm-add { align-items: flex-start; }
.mvm-add-b.mvm-acts { display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr)); gap: 8px; flex: 1 1 100%; align-items: stretch; }
.mvm-act { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 9px 10px; border-radius: 10px; background: var(--surface, #fff); border: 1px solid var(--border, #e5e5ea); min-width: 0; }
.mvm-act .btn { display: inline-flex !important; align-items: center; gap: 5px; font-size: 12px !important; padding: 4px 10px !important; line-height: 1.4 !important; margin: 0 !important; white-space: nowrap; }
.mvm-act .btn .material-icons { font-size: 16px !important; }
.mvm-act small { font-size: 11.5px; line-height: 1.4; color: var(--text-2, #777); }
@media (max-width: 900px) { .mvm-add-b.mvm-acts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .mvm-add-b.mvm-acts { grid-template-columns: 1fr; } }
.mvm-swap { margin-top: 6px; padding: 7px 10px; border-radius: 9px; background: rgba(124, 92, 255, .1); border: 1px solid rgba(124, 92, 255, .3); font-size: 12.5px; line-height: 1.45; }
.mvm-swap .material-icons { font-size: 16px; vertical-align: -3px; color: #7c5cff; }
.mvm-swap small { color: var(--text-2, #777); }
.mvm-ep-cr { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 6px 0 0; font-size: 12px; font-weight: 600; color: var(--text-2, #777); }
.mvm-ep-cr .material-icons { font-size: 16px; }
.mvm-ep-cr input.ep-cr { width: 78px !important; height: 26px !important; padding: 2px 8px !important; font-size: 12px !important; margin: 0 !important; }
.mvm-ep-cr small { font-weight: 400; flex-basis: 100%; }

/* ---- "Next episode" card (Netflix-like): the next episode's picture + title + story, the button fills while it counts */
.mvp-upnext.mvp-un { right: 3.2vw; bottom: 130px; display: flex; flex-direction: column; align-items: stretch; gap: 12px; width: min(440px, 92vw); max-width: none; padding: 0; background: transparent; box-shadow: none; animation: mvpUnIn .35s ease-out; }
@keyframes mvpUnIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.mvp-un-card { display: flex; gap: 14px; align-items: stretch; padding: 12px; border-radius: 10px; background: rgba(20, 20, 20, .92); border: 1px solid rgba(255, 255, 255, .12); box-shadow: 0 12px 40px rgba(0, 0, 0, .65); cursor: pointer; transition: border-color .15s; }
.mvp-un-card:hover { border-color: rgba(255, 255, 255, .45); }
.mvp-un-img { position: relative; flex: 0 0 150px; aspect-ratio: 16 / 9; border-radius: 6px; overflow: hidden; background: #222; }
.mvp-un-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mvp-un-ico { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, .25); }
.mvp-un-ico svg { width: 34px; height: 34px; fill: #fff; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .6)); }
.mvp-un-t { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.mvp-un-t small { color: #b3b3b3; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.mvp-un-t strong { font-size: 15px; line-height: 1.3; color: #fff; }
.mvp-un-t p { margin: 2px 0 0; font-size: 12.5px; line-height: 1.4; color: #c8c8c8; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.mvp-un-b { display: flex; justify-content: flex-end; gap: 10px; }
.mvp-un .mvp-upx { font-size: 15px; font-weight: 700; color: #fff; padding: 11px 18px; border-radius: 6px; background: rgba(109, 109, 110, .7); border: 0; cursor: pointer; }
.mvp-un .mvp-upx:hover { background: rgba(109, 109, 110, .45); }
.mvp-un .mvp-upgo { position: relative; overflow: hidden; padding: 11px 20px; border-radius: 6px; font-size: 15px; background: rgba(255, 255, 255, .62); color: #000; }
.mvp-un .mvp-upgo span { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 6px; }
.mvp-un .mvp-upgo svg { width: 20px; height: 20px; fill: #000; }
.mvp-un .mvp-upgo b { display: inline-block; min-width: 1.1em; font-variant-numeric: tabular-nums; }
.mvp-un-fill { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: #fff; transition: width 1s linear; }
.mvp.is-ui .mvp-upnext.mvp-un { bottom: 140px; }
@media (max-width: 700px) {
    .mvp-upnext.mvp-un { left: 10px; right: 10px; width: auto; bottom: 96px; }
    .mvp-un-img { flex-basis: 110px; }
    .mvp-un-t p { display: none; }
    .mvp-un .mvp-upx, .mvp-un .mvp-upgo { font-size: 14px; padding: 10px 14px; }
}

/* ---- paused for 5 seconds: "You are watching ..." over a dark left side (Netflix) */
.mvp-pausei { position: absolute; inset: 0; z-index: 5; display: flex; align-items: center; padding: 0 6vw; background: linear-gradient(90deg, rgba(0, 0, 0, .86) 0%, rgba(0, 0, 0, .62) 38%, rgba(0, 0, 0, .15) 75%, rgba(0, 0, 0, 0) 100%); opacity: 0; transition: opacity .35s ease; cursor: pointer; }
.mvp-pausei[hidden] { display: none; }
.mvp-pausei.is-on { opacity: 1; }
.mvp-pi-in { max-width: min(620px, 58vw); transform: translateY(10px); transition: transform .45s ease; cursor: default; }
.mvp-pausei.is-on .mvp-pi-in { transform: none; }
.mvp-pi-in small { display: block; color: #b3b3b3; font-size: clamp(14px, 1.4vw, 19px); margin-bottom: 6px; }
.mvp-pi-in h2 { margin: 0 0 10px; font-size: clamp(30px, 4.2vw, 64px); line-height: 1.04; font-weight: 800; letter-spacing: -.01em; color: #fff; text-shadow: 0 2px 18px rgba(0, 0, 0, .5); }
.mvp-pi-in h3 { margin: 0 0 12px; font-size: clamp(16px, 1.7vw, 24px); font-weight: 700; color: #fff; }
.mvp-pi-in h3 b { color: #b3b3b3; font-weight: 700; margin-right: 6px; }
.mvp-pi-in p { margin: 0 0 22px; font-size: clamp(14px, 1.25vw, 18px); line-height: 1.5; color: #d2d2d2; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.mvp-pi-b { display: flex; gap: 12px; flex-wrap: wrap; }
.mvp-pi-b button { display: inline-flex; align-items: center; gap: 8px; border: 0; border-radius: 6px; padding: 11px 22px; font-size: 16px; font-weight: 800; cursor: pointer; }
.mvp-pi-go { background: #fff; color: #000; }
.mvp-pi-go:hover { background: rgba(255, 255, 255, .8); }
.mvp-pi-go svg { width: 22px; height: 22px; fill: #000; }
.mvp-pi-eps { background: rgba(109, 109, 110, .7); color: #fff; }
.mvp-pi-eps:hover { background: rgba(109, 109, 110, .45); }
.mvp-pi-tag { position: absolute; right: 4vw; bottom: 9vh; font-size: clamp(16px, 1.6vw, 22px); font-weight: 700; color: #e5e5e5; letter-spacing: .02em; }
.mvp.is-pinfo .mvp-cues { opacity: 0; }
@media (max-width: 700px) {
    .mvp-pausei { padding: 0 20px; background: linear-gradient(90deg, rgba(0, 0, 0, .9), rgba(0, 0, 0, .55)); }
    .mvp-pi-in { max-width: 100%; }
    .mvp-pi-in p { -webkit-line-clamp: 3; }
    .mvp-pi-tag { display: none; }
}
.mvp-pausei { z-index: 8; }
.mvp.is-pinfo .mvp-top, .mvp.is-pinfo .mvp-bottom { opacity: 0; pointer-events: none; }

/* ---- the pause screen, Netflix style (logo, meta, age, tagline, story, cast, thumbs, the red "watched" line, the list of actions) */
.mvp-pausei { align-items: center; padding: 0 5vw; background: linear-gradient(90deg, rgba(0, 0, 0, .9) 0%, rgba(0, 0, 0, .72) 40%, rgba(0, 0, 0, .25) 75%, rgba(0, 0, 0, .05) 100%); }
.mvp-pi-in { max-width: min(640px, 56vw); max-height: 100%; overflow: hidden; padding: 4vh 0; }
.mvp-pi-kicker { display: block; color: #b3b3b3; font-size: clamp(13px, 1.2vw, 17px); margin-bottom: 8px; }
.mvp-pi-logo { display: block; max-width: min(460px, 100%); max-height: 22vh; width: auto; height: auto; object-fit: contain; object-position: left bottom; margin: 0 0 14px; filter: drop-shadow(0 4px 18px rgba(0, 0, 0, .55)); }
.mvp-pi-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: clamp(14px, 1.3vw, 19px); color: #e5e5e5; font-weight: 600; margin: 0 0 6px; }
.mvp-pi-meta i { font-style: normal; color: #8c8c8c; }
.mvp-pi-hd { border: 1px solid rgba(255, 255, 255, .45); border-radius: 4px; padding: 0 6px; font-size: .78em; line-height: 1.5; color: #ddd; }
.mvp-pi-meta2 { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; font-size: clamp(13px, 1.15vw, 17px); color: #d0d0d0; }
.mvp-pi-age { display: inline-block; background: rgba(255, 255, 255, .16); border-radius: 4px; padding: 1px 7px; font-weight: 800; font-size: .9em; color: #fff; }
.mvp-pi-in h3 { margin: 4px 0 8px; font-size: clamp(16px, 1.55vw, 23px); font-weight: 800; }
.mvp-pi-in p { margin: 0 0 12px; font-size: clamp(14px, 1.25vw, 18px); line-height: 1.45; -webkit-line-clamp: 3; }
.mvp-pi-cr { font-size: clamp(12.5px, 1.05vw, 15px); color: #e0e0e0; line-height: 1.5; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mvp-pi-cr span { color: #8c8c8c; }
.mvp-pi-prog { display: flex; align-items: center; gap: 12px; margin: 16px 0 4px; max-width: 520px; }
.mvp-pi-bar { flex: 1; height: 4px; border-radius: 2px; background: rgba(255, 255, 255, .28); overflow: hidden; }
.mvp-pi-bar i { display: block; height: 100%; background: #e50914; border-radius: 2px; }
.mvp-pi-prog span { font-size: 13px; color: #bdbdbd; white-space: nowrap; font-variant-numeric: tabular-nums; }
.mvp-pi-rate { display: flex; gap: 22px; margin: 14px 0 16px; }
.mvp-pi-rate button { width: 44px; height: 44px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .45); background: rgba(42, 42, 42, .6); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; transition: border-color .15s, background .15s, transform .15s; }
.mvp-pi-rate button svg { width: 22px; height: 22px; fill: #fff; }
.mvp-pi-rate button:hover { border-color: #fff; transform: scale(1.08); }
.mvp-pi-rate button.is-on { background: #fff; border-color: #fff; }
.mvp-pi-rate button.is-on svg { fill: #000; }
.mvp-pi-b { flex-direction: column; align-items: stretch; gap: 6px; max-width: 460px; }
.mvp-pi-b > * { justify-content: flex-start; width: 100%; text-decoration: none; }
.mvp-pi-go { border-radius: 999px !important; padding: 12px 24px !important; font-size: clamp(16px, 1.4vw, 20px) !important; }
.mvp-pi-lnk { background: transparent !important; color: #e5e5e5 !important; padding: 10px 24px !important; font-size: clamp(15px, 1.3vw, 19px) !important; font-weight: 600 !important; border-radius: 999px !important; }
.mvp-pi-lnk svg { width: 22px; height: 22px; fill: currentColor; }
.mvp-pi-lnk:hover, .mvp-pi-lnk:focus-visible { background: rgba(255, 255, 255, .14) !important; color: #fff !important; outline: 0; }
.mvp-pi-go:focus-visible { outline: 3px solid rgba(255, 255, 255, .5); outline-offset: 2px; }
@media (max-width: 700px) {
    .mvp-pi-in { max-width: 100%; padding: 70px 0 20px; }
    .mvp-pi-logo { max-height: 70px; }
    .mvp-pi-cr { white-space: normal; }
    .mvp-pi-rate { gap: 14px; margin: 10px 0 12px; }
    .mvp-pi-rate button { width: 40px; height: 40px; }
    .mvp-pi-b { max-width: none; }
}
@media (max-height: 560px) { .mvp-pi-cr, .mvp-pi-rate { display: none; } .mvp-pi-in p { -webkit-line-clamp: 2; } }

/* ---- the end of a film: the picture goes small in a corner, the recommendations take the screen */
.mvp-v { transition: inset .5s ease, width .5s ease, height .5s ease, border-radius .5s ease, box-shadow .5s ease; }
.mvp.is-endrec .mvp-v { inset: auto; top: 26px; right: 26px; width: 30vw; height: calc(30vw * 9 / 16); border-radius: 8px; z-index: 9; box-shadow: 0 10px 40px rgba(0, 0, 0, .7); cursor: pointer; }
.mvp.is-endrec .mvp-top, .mvp.is-endrec .mvp-bottom, .mvp.is-endrec .mvp-cues, .mvp.is-endrec .mvp-big { opacity: 0; pointer-events: none; }
.mvp-endrec { position: absolute; inset: 0; z-index: 8; background: #141414; opacity: 0; transition: opacity .45s ease; overflow: hidden; }
.mvp-endrec[hidden] { display: none; }
.mvp-endrec.is-on { opacity: 1; }
.mvp-er-bg { position: absolute; inset: 0; background-size: cover; background-position: center top; transform: scale(1.03); }
.mvp-er-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20, 20, 20, .97) 0%, rgba(20, 20, 20, .8) 40%, rgba(20, 20, 20, .2) 75%), linear-gradient(0deg, #141414 0%, rgba(20, 20, 20, 0) 45%); }
.mvp-er-main { position: absolute; left: 5vw; top: 12vh; max-width: min(560px, 50vw); }
.mvp-er-main h2 { margin: 0 0 12px; font-size: clamp(30px, 3.8vw, 58px); line-height: 1.05; font-weight: 800; }
.mvp-er-main p { margin: 10px 0 18px; font-size: clamp(14px, 1.25vw, 18px); line-height: 1.45; color: #d2d2d2; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.mvp-er-main .mvp-pi-b { display: flex; flex-direction: row; flex-wrap: wrap; gap: 10px; max-width: none; }
.mvp-er-main .mvp-pi-b > * { width: auto; display: inline-flex; align-items: center; gap: 8px; border: 0; cursor: pointer; font-weight: 800; }
.mvp-er-main .mvp-pi-go { background: #fff; color: #000; }
.mvp-er-main .mvp-pi-go svg { width: 22px; height: 22px; fill: #000; }
.mvp-er-main .mvp-pi-lnk { background: rgba(109, 109, 110, .7) !important; color: #fff !important; }
.mvp-er-row { position: absolute; left: 5vw; right: 5vw; bottom: 5vh; }
.mvp-er-row > small { display: block; font-size: clamp(15px, 1.3vw, 20px); font-weight: 800; color: #e5e5e5; margin: 0 0 10px; }
.mvp-er-cards { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.mvp-er-card { display: block; color: #fff; text-decoration: none; min-width: 0; }
.mvp-er-img { position: relative; display: block; aspect-ratio: 16 / 9; border-radius: 6px; overflow: hidden; background: #2a2a2a; transition: transform .2s; }
.mvp-er-img > img:first-child { width: 100%; height: 100%; object-fit: cover; display: block; }
.mvp-er-logo { position: absolute; left: 8px; bottom: 8px; max-width: 70%; max-height: 40%; object-fit: contain; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .8)); }
.mvp-er-img > b { position: absolute; left: 8px; right: 8px; bottom: 8px; font-size: 14px; text-shadow: 0 2px 6px #000; }
.mvp-er-play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, .35); opacity: 0; transition: opacity .2s; }
.mvp-er-play svg { width: 40px; height: 40px; fill: #fff; }
.mvp-er-card:hover .mvp-er-img, .mvp-er-card:focus-visible .mvp-er-img { transform: scale(1.05); }
.mvp-er-card:hover .mvp-er-play, .mvp-er-card:focus-visible .mvp-er-play { opacity: 1; }
.mvp-er-t { display: block; font-size: 13.5px; font-weight: 700; margin-top: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mvp-er-m { display: block; font-size: 12px; color: #aaa; margin-top: 2px; }
.mvp-er-m i { font-style: normal; }
@media (max-width: 1100px) { .mvp-er-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); } .mvp-er-card:nth-child(n+5) { display: none; } }
@media (max-width: 700px) {
    .mvp.is-endrec .mvp-v { top: 12px; right: 12px; width: 42vw; height: calc(42vw * 9 / 16); }
    .mvp-er-main { left: 16px; right: 16px; top: calc(12px + 42vw * 9 / 16 + 14px); max-width: none; }
    .mvp-er-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mvp-er-card:nth-child(n+3) { display: none; }
    .mvp-er-row { left: 16px; right: 16px; bottom: 16px; }
}
/* "Trailers & more" over the pause screen */
.mvp-trl { position: absolute; inset: 0; z-index: 12; background: #000; display: flex; align-items: center; justify-content: center; animation: mvpUnIn .3s ease-out; }
.mvp-trl video { width: 100%; height: 100%; object-fit: contain; background: #000; }
.mvp-trl-top { position: absolute; left: 0; right: 0; top: 0; display: flex; align-items: center; gap: 12px; padding: 18px 22px 40px; background: linear-gradient(to bottom, rgba(0, 0, 0, .75), rgba(0, 0, 0, 0)); pointer-events: none; }
.mvp-trl-top strong { font-size: 17px; }
.mvp-trl-x { pointer-events: auto; margin-left: auto; width: 46px; height: 46px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .14); color: #fff; font-size: 30px; line-height: 1; cursor: pointer; }
.mvp-trl-x:hover { background: rgba(255, 255, 255, .28); }
/* the "Profiles" module: the logo on the left, the profile avatar on the right (no bar of the video site here) */
.mvx-brand { display: inline-flex; align-items: center; margin-right: 22px; flex: 0 0 auto; }
.mvx-brand img { max-height: 30px; width: auto; display: block; }
.mvx-top:has(.mvx-sp) { justify-content: flex-start; }
.mvx-top:has(.mvx-sp) .mvx-tabs { flex: 1; }
.mvx-sp { display: inline-flex; align-items: center; margin-left: 10px; }
@media (max-width: 700px) { .mvx-brand { margin-right: 10px; } .mvx-brand img { max-height: 24px; } }
/* the choice lit by the arrows (pause screen / end screen) */
.mvp-pausei .is-foc, .mvp-endrec .is-foc { outline: 3px solid #fff !important; outline-offset: 3px; }
.mvp-pi-lnk.is-foc { background: rgba(255, 255, 255, .18) !important; color: #fff !important; }
.mvp-pi-go.is-foc { transform: scale(1.03); }
.mvp-er-card.is-foc { outline: 0 !important; } .mvp-er-card.is-foc .mvp-er-img { transform: scale(1.06); box-shadow: 0 0 0 3px #fff; } .mvp-er-card.is-foc .mvp-er-play { opacity: 1; }
.mvp-pi-rate button.is-foc { transform: scale(1.12); border-color: #fff; }
/* staff: "The credits start here" */
.mvp-crbtn { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; background: rgba(0, 0, 0, .45); border: 1px solid rgba(255, 255, 255, .3); color: #fff; border-radius: 20px; padding: 7px 12px; font-size: 13px; font-weight: 700; cursor: pointer; }
.mvp-crbtn svg { width: 18px; height: 18px; fill: #f5c518; }
.mvp-crbtn:hover { background: rgba(255, 255, 255, .15); }
.mvp-top .mvp-crbtn + .mvp-cast { margin-left: 8px; }
.mvp-crp { position: absolute; top: 80px; right: 26px; z-index: 20; width: min(380px, 92vw); padding: 14px 16px; border-radius: 10px; background: rgba(20, 20, 20, .96); border: 1px solid rgba(255, 255, 255, .18); box-shadow: 0 14px 40px rgba(0, 0, 0, .6); }
.mvp-crp b { display: block; font-size: 15px; margin-bottom: 4px; } .mvp-crp small { display: block; color: #aaa; font-size: 12.5px; line-height: 1.4; margin-bottom: 10px; }
.mvp-crp div { display: flex; flex-wrap: wrap; gap: 8px; }
.mvp-crp button { border: 0; border-radius: 6px; padding: 8px 12px; font-weight: 700; cursor: pointer; background: #fff; color: #000; }
.mvp-crp button[data-a="1"] { background: rgba(109, 109, 110, .8); color: #fff; } .mvp-crp button[data-a="x"] { background: transparent; color: #aaa; font-size: 20px; padding: 2px 8px; margin-left: auto; }
@media (max-width: 700px) { .mvp-crbtn span { display: none; } }
.mvx-brand.logo { height: auto !important; line-height: 1 !important; padding: 0 !important; }
.mvx-brand .xlogo-tx b { color: #fff !important; }
.mvx-brand .xlogo-tx small { color: #b3b3b3; }
.mvx-brand .xlogo-ic { width: 34px !important; height: 34px !important; flex-basis: 34px !important; }
.mvm-ep-cr input.ep-inf, .mvm-ep-cr input.ep-int { width: 78px !important; height: 26px !important; padding: 2px 8px !important; font-size: 12px !important; margin: 0 !important; }
.mvm-introw { display: flex; align-items: center; gap: 8px; } .mvm-introw input { max-width: 140px; }
.mvp-crg { display: flex; flex-direction: column; gap: 6px; }
.mvp-crg button { text-align: left; }
.mvp-crg button[disabled] { opacity: .45; cursor: default; }
.mvp-crp { padding-right: 40px; } .mvp-crp .mvp-crx { position: absolute; top: 6px; right: 6px; background: transparent !important; color: #aaa !important; font-size: 22px; padding: 2px 8px !important; }
/* "Skip intro" */
.mvp-skip { position: absolute; right: 3.2vw; bottom: 130px; z-index: 6; display: inline-flex; align-items: center; gap: 8px; padding: 12px 22px; border-radius: 6px; border: 2px solid rgba(255, 255, 255, .85); background: rgba(30, 30, 30, .55); color: #fff; font-size: 16px; font-weight: 800; cursor: pointer; backdrop-filter: blur(4px); animation: mvpUnIn .3s ease-out; }
.mvp-skip[hidden] { display: none; }
.mvp-skip svg { width: 20px; height: 20px; fill: #fff; }
.mvp-skip:hover, .mvp-skip:focus-visible { background: #fff; color: #000; outline: 0; } .mvp-skip:hover svg { fill: #000; }
@media (max-width: 700px) { .mvp-skip { bottom: 96px; right: 12px; font-size: 14px; padding: 9px 14px; } }
/* mobile: logo + account on the first row, the tabs on their own row (only when the profiles are on) */
@media (max-width: 700px) {
    .mvx-top:has(.mvx-sp) { flex-wrap: wrap; row-gap: 10px; column-gap: 8px; }
    .mvx-top:has(.mvx-sp) .mvx-brand { order: 1; margin-right: auto; }
    .mvx-top:has(.mvx-sp) .mvx-askbtn { order: 2; margin-left: 0; }
    .mvx-top:has(.mvx-sp) .mvx-manage { order: 3; margin-left: 0; }
    .mvx-top:has(.mvx-sp) .mvx-manage, .mvx-top:has(.mvx-sp) .mvx-askbtn span { font-size: 0; }
    .mvx-top:has(.mvx-sp) .mvx-manage .material-icons { font-size: 18px; }
    .mvx-top:has(.mvx-sp) .mvx-sp { order: 4; }
    .mvx-top:has(.mvx-sp) .mvx-tabs { order: 5; flex: 1 1 100%; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
    .mvx-top:has(.mvx-sp) .mvx-tabs::-webkit-scrollbar { display: none; }
    .mvx-top:has(.mvx-sp) .mvx-tabs a { white-space: nowrap; padding: 7px 14px; font-size: 14px; }
}
.mvx-brand, .mvx-brand:hover, .mvx-brand * { text-decoration: none !important; }
/* the conversion box of a new file that replaces the old one */
.mvm-swap .mvm-conv { margin: 7px 0 5px; }
.mvm-swap > small { display: block; margin-top: 4px; }
/* ---- the pause screen on phones (update 187): only on phones, the computer / TV stay as they are ---- */
/* touch: no keyboard focus ring on "Continue watching" (the arrows are for the keyboard / TV remote) */
@media (hover: none) and (pointer: coarse) {
    .mvp-pausei .is-foc, .mvp-endrec .is-foc { outline: 0 !important; transform: none !important; }
    .mvp-pausei .mvp-pi-lnk.is-foc { background: transparent !important; }
}
/* phone held upright: the whole screen darkened, everything a bit smaller, fits on the screen */
@media (max-width: 700px) and (orientation: portrait) {
    .mvp-pausei { padding: 0 20px; background: rgba(0, 0, 0, .86); align-items: center; }
    .mvp-pausei .mvp-pi-in { max-width: 100%; width: 100%; max-height: 100%; overflow-y: auto; padding: 60px 0 18px; scrollbar-width: none; }
    .mvp-pausei .mvp-pi-kicker { font-size: 13px; margin-bottom: 4px; }
    .mvp-pausei .mvp-pi-in h2 { font-size: 26px; margin-bottom: 8px; }
    .mvp-pausei .mvp-pi-logo { max-height: 60px; margin-bottom: 8px; }
    .mvp-pausei .mvp-pi-meta { font-size: 14px; }
    .mvp-pausei .mvp-pi-meta2 { margin-bottom: 10px; }
    .mvp-pausei .mvp-pi-in h3 { font-size: 16px; margin: 2px 0 6px; }
    .mvp-pausei .mvp-pi-in p { font-size: 14px; -webkit-line-clamp: 2; margin-bottom: 8px; }
    .mvp-pausei .mvp-pi-cr { font-size: 12.5px; white-space: nowrap; }
    .mvp-pausei .mvp-pi-prog { margin: 12px 0 2px; }
    .mvp-pausei .mvp-pi-rate { gap: 12px; margin: 10px 0 12px; }
    .mvp-pausei .mvp-pi-rate button { width: 38px; height: 38px; }
    .mvp-pausei .mvp-pi-rate button svg { width: 19px; height: 19px; }
    .mvp-pausei .mvp-pi-b { gap: 2px; }
    .mvp-pausei .mvp-pi-go { justify-content: center; padding: 11px 20px !important; font-size: 16px !important; margin-bottom: 4px; }
    .mvp-pausei .mvp-pi-lnk { padding: 9px 20px !important; font-size: 15px !important; }
    .mvp-pausei .mvp-pi-go svg, .mvp-pausei .mvp-pi-lnk svg { width: 20px; height: 20px; }
}
/* phone turned sideways (low screen): compact, the buttons on one row */
@media (max-height: 500px) and (orientation: landscape) {
    .mvp-pausei { padding: 0 5vw; background: linear-gradient(90deg, rgba(0, 0, 0, .93) 0%, rgba(0, 0, 0, .82) 55%, rgba(0, 0, 0, .4) 100%); }
    .mvp-pausei .mvp-pi-in { max-width: min(600px, 74vw); max-height: 100%; overflow-y: auto; padding: 46px 0 12px; scrollbar-width: none; }
    .mvp-pausei .mvp-pi-kicker { font-size: 12px; margin-bottom: 2px; }
    .mvp-pausei .mvp-pi-in h2 { font-size: 24px; margin-bottom: 4px; }
    .mvp-pausei .mvp-pi-logo { max-height: 46px; margin-bottom: 6px; }
    .mvp-pausei .mvp-pi-meta { font-size: 13px; margin-bottom: 2px; }
    .mvp-pausei .mvp-pi-meta2 { font-size: 12px; margin-bottom: 4px; }
    .mvp-pausei .mvp-pi-in h3 { font-size: 15px; margin: 2px 0; }
    .mvp-pausei .mvp-pi-in p, .mvp-pausei .mvp-pi-cr { display: none; }
    .mvp-pausei .mvp-pi-prog { margin: 6px 0; max-width: 420px; }
    .mvp-pausei .mvp-pi-rate { display: flex; gap: 10px; margin: 4px 0 8px; }
    .mvp-pausei .mvp-pi-rate button { width: 32px; height: 32px; border-width: 1.5px; }
    .mvp-pausei .mvp-pi-rate button svg { width: 16px; height: 16px; }
    .mvp-pausei .mvp-pi-b { flex-direction: row; flex-wrap: wrap; gap: 6px; max-width: none; }
    .mvp-pausei .mvp-pi-b > * { width: auto; }
    .mvp-pausei .mvp-pi-go { padding: 8px 16px !important; font-size: 14px !important; }
    .mvp-pausei .mvp-pi-lnk { padding: 8px 12px !important; font-size: 13.5px !important; background: rgba(255, 255, 255, .1) !important; }
    .mvp-pausei .mvp-pi-go svg, .mvp-pausei .mvp-pi-lnk svg { width: 18px; height: 18px; }
    .mvp-pi-tag { display: none; }
}
/* "Skip intro": bottom left, already chosen (white) - Enter skips (update 197) */
.mvp-skip { right: auto; left: 3.2vw; background: #fff; color: #000; border-color: #fff; box-shadow: 0 8px 26px rgba(0, 0, 0, .45); }
.mvp-skip svg { fill: #000; }
.mvp-skip:hover, .mvp-skip:focus-visible { background: rgba(255, 255, 255, .85); }
.mvp-skip kbd { margin-left: 6px; padding: 2px 6px; border-radius: 4px; background: rgba(0, 0, 0, .12); font: inherit; font-size: 11px; font-weight: 800; letter-spacing: .03em; }
@media (max-width: 700px) { .mvp-skip { left: 12px; right: auto; } }
@media (hover: none), (max-width: 900px) { .mvp-skip kbd { display: none; } }
/* the "Marks" button of the team: only on a computer (not on phones / tablets) */
@media (hover: none), (pointer: coarse), (max-width: 900px) { .mvp-crbtn, .mvp-crp { display: none !important; } }
/* the hover card of a title already started (like Netflix): the episode, the red line, "27 of 41 min." */
.mvx-hv-prog { display: flex; flex-direction: column; gap: 8px; }
.mvx-hv-prog b { font-size: 14px; font-weight: 700; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mvx-hv-pl { display: flex; align-items: center; gap: 12px; }
.mvx-hv-pl span { flex: 1; height: 3px; background: rgba(255, 255, 255, .3); border-radius: 2px; overflow: hidden; }
.mvx-hv-pl i { display: block; height: 100%; background: #e50914; }
.mvx-hv-pl em { font-style: normal; font-size: 13.5px; color: #e5e5e5; white-space: nowrap; font-weight: 600; }

/* ---------------------------------------------------------------- downloads to watch offline (Premium) */
.mvx-dlb svg { width: 20px; height: 20px; fill: currentColor; }
.mvx-dlb.is-done { border-color: #fff; }
.mvx-dlb.is-err { border-color: #f5c518; color: #f5c518; }
.mvx-dlb span { display: none; }
.mvdl-ring { width: 24px !important; height: 24px !important; transform: rotate(-90deg); }
.mvdl-ring circle { fill: none; stroke: rgba(255, 255, 255, .25); stroke-width: 2.6; }
.mvdl-ring circle.is-v { stroke: #e50914; stroke-linecap: round; transition: stroke-dashoffset .3s; }
.mvx-ep-top:has(.mvx-dlb-ep) { align-items: center; }
.mvx-ep-top:has(.mvx-dlb-ep) strong { margin-right: auto; }
.mvx-ep-top .mvx-dlb-ep { width: 32px; height: 32px; flex: 0 0 32px; margin-left: 4px; }
.mvx-ep-top .mvx-dlb-ep svg { width: 18px; height: 18px; }
@media (min-width: 701px) { .mvx-ep-top:has(.mvx-dlb-ep) em { margin-right: 0; } .mvx-ep-top .mvx-dlb-ep { margin-right: -40px; } }
.mvx-top .mvx-dltop svg { width: 18px; height: 18px; fill: #e50914; }
.mvx-top .mvx-askbtn + .mvx-dltop, .mvx-top .mvx-dltop + .mvx-manage { margin-left: 8px; }
@media (max-width: 700px) { .mvx-top .mvx-dltop span { display: none; } }
.mvdl-pop { position: fixed; z-index: 100000; min-width: 230px; background: #1f1f1f; color: #fff; border: 1px solid rgba(255, 255, 255, .15); border-radius: 8px; padding: 10px; box-shadow: 0 12px 40px rgba(0, 0, 0, .6); font-size: 14px; }
.mvdl-pop > b { display: block; padding: 2px 6px 8px; font-size: 13px; color: #bbb; }
.mvdl-pop button { display: flex; width: 100%; align-items: baseline; gap: 10px; border: 0; background: transparent; color: #fff; padding: 9px 8px; border-radius: 5px; text-align: left; cursor: pointer; font: inherit; }
.mvdl-pop button span { font-weight: 800; min-width: 52px; }
.mvdl-pop button em { font-style: normal; color: #aaa; font-size: 12.5px; }
.mvdl-pop button:hover, .mvdl-pop button.is-on { background: rgba(255, 255, 255, .1); }
.mvdl-pop small { display: block; padding: 8px 6px 2px; color: #8c8c8c; font-size: 12px; line-height: 1.35; }
.mvdl-toast { position: fixed; left: 50%; bottom: 24px; z-index: 100001; transform: translate(-50%, 30px); opacity: 0; pointer-events: none; display: flex; align-items: center; gap: 14px; max-width: calc(100vw - 32px); background: #262626; color: #fff; padding: 12px 16px; border-radius: 8px; box-shadow: 0 10px 30px rgba(0, 0, 0, .5); font-size: 14px; transition: opacity .2s, transform .2s; }
.mvdl-toast.is-on { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
.mvdl-toast a { color: #fff; font-weight: 800; white-space: nowrap; text-decoration: underline; }
.mvdl-pill { position: fixed; left: 16px; bottom: 16px; z-index: 9000; display: none; align-items: center; gap: 10px; max-width: min(340px, calc(100vw - 32px)); background: rgba(31, 31, 31, .96); color: #fff !important; text-decoration: none !important; padding: 9px 14px 9px 10px; border-radius: 30px; box-shadow: 0 8px 26px rgba(0, 0, 0, .5); border: 1px solid rgba(255, 255, 255, .1); }
.mvdl-pill.is-on { display: flex; }
.mvdl-pill > span { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.mvdl-pill b { font-size: 13px; }
.mvdl-pill em { font-style: normal; font-size: 12px; color: #aaa; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 700px) { .mvdl-pill { bottom: calc(70px + env(safe-area-inset-bottom)); left: 12px; } }
/* mobile, profiles on: the logo and every button on ONE row (request, downloads, manage = round icons of the same size) */
@media (max-width: 700px) {
    .mvx-top:has(.mvx-sp) { column-gap: 6px; }
    .mvx-top:has(.mvx-sp) .mvx-askbtn, .mvx-top:has(.mvx-sp) .mvx-manage { flex: 0 0 38px; width: 38px; height: 38px; padding: 0 !important; margin: 0 !important; gap: 0; justify-content: center; align-items: center; border-radius: 50%; }
    .mvx-top:has(.mvx-sp) .mvx-askbtn span, .mvx-top:has(.mvx-sp) .mvx-manage span { display: none; }
    .mvx-top:has(.mvx-sp) .mvx-manage, .mvx-top:has(.mvx-sp) .mvx-manage * { text-decoration: none !important; border-bottom: 0; }
    .mvx-top:has(.mvx-sp) .mvx-sp { margin-left: 2px; gap: 6px; }
    .mvx-top:has(.mvx-sp) .mvx-brand { min-width: 0; overflow: hidden; }
}
@media (max-width: 380px) {
    .mvx-top:has(.mvx-sp) .mvx-askbtn, .mvx-top:has(.mvx-sp) .mvx-manage { flex-basis: 34px; width: 34px; height: 34px; }
    .mvx-top:has(.mvx-sp) .mvx-brand { transform-origin: left center; zoom: .85; }
}
/* the sound for iPhones (editor) */
.mvm-aud { margin-top: 6px; display: inline-block; padding: 4px 10px; border-radius: 8px; font-size: 12px; font-style: normal; border: 1px solid rgba(34, 197, 94, .35); background: rgba(34, 197, 94, .08); color: #16a34a; }
.mvm-aud.is-run, .mvm-aud.is-wait { border-color: rgba(245, 158, 11, .4); background: rgba(245, 158, 11, .08); color: #d97706; }
.mvm-aud.is-fail, .mvm-aud.is-off { border-color: rgba(239, 68, 68, .4); background: rgba(239, 68, 68, .08); color: #dc2626; }
.mvm-aud.is-small { margin: 0 0 0 4px; padding: 1px 6px; font-size: 11px; display: inline; }
.mvm-aud.is-check { border-color: rgba(148, 163, 184, .45); background: rgba(148, 163, 184, .1); color: #64748b; }

/* the same for browsers without ":has" (older phones): the class has-sp is put on the bar by the page */
.mvx-top.has-sp { justify-content: flex-start; }
.mvx-top.has-sp .mvx-tabs { flex: 1; }
/* mobile: logo + account on the first row, the tabs on their own row (only when the profiles are on) */
@media (max-width: 700px) {
    .mvx-top.has-sp { flex-wrap: wrap; row-gap: 10px; column-gap: 8px; }
    .mvx-top.has-sp .mvx-brand { order: 1; margin-right: auto; }
    .mvx-top.has-sp .mvx-askbtn { order: 2; margin-left: 0; }
    .mvx-top.has-sp .mvx-manage { order: 3; margin-left: 0; }
    .mvx-top.has-sp .mvx-manage, .mvx-top.has-sp .mvx-askbtn span { font-size: 0; }
    .mvx-top.has-sp .mvx-manage .material-icons { font-size: 18px; }
    .mvx-top.has-sp .mvx-sp { order: 4; }
    .mvx-top.has-sp .mvx-tabs { order: 5; flex: 1 1 100%; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
    .mvx-top.has-sp .mvx-tabs::-webkit-scrollbar { display: none; }
    .mvx-top.has-sp .mvx-tabs a { white-space: nowrap; padding: 7px 14px; font-size: 14px; }
}
/* mobile, profiles on: the logo and every button on ONE row (request, downloads, manage = round icons of the same size) */
@media (max-width: 700px) {
    .mvx-top.has-sp { column-gap: 6px; }
    .mvx-top.has-sp .mvx-askbtn, .mvx-top.has-sp .mvx-manage { flex: 0 0 38px; width: 38px; height: 38px; padding: 0 !important; margin: 0 !important; gap: 0; justify-content: center; align-items: center; border-radius: 50%; }
    .mvx-top.has-sp .mvx-askbtn span, .mvx-top.has-sp .mvx-manage span { display: none; }
    .mvx-top.has-sp .mvx-manage, .mvx-top.has-sp .mvx-manage * { text-decoration: none !important; border-bottom: 0; }
    .mvx-top.has-sp .mvx-sp { margin-left: 2px; gap: 6px; }
    .mvx-top.has-sp .mvx-brand { min-width: 0; overflow: hidden; }
}
@media (max-width: 380px) {
    .mvx-top.has-sp .mvx-askbtn, .mvx-top.has-sp .mvx-manage { flex-basis: 34px; width: 34px; height: 34px; }
    .mvx-top.has-sp .mvx-brand { transform-origin: left center; zoom: .85; }
}
/* the hero buttons on phones: the (i) of "More info" never squeezed away when the text is long */
.mvx-btn svg { flex: none; }
@media (max-width: 700px) {
    .mvx-page .mvx-hero-btns .mvx-btn-info { flex-grow: 1.3; max-width: 250px; }
    .mvx-page .mvx-hero-btns .mvx-btn { gap: 6px; white-space: nowrap; }
}
@media (max-width: 380px) { .mvx-page .mvx-hero-btns .mvx-btn { font-size: 13px; padding: 0 8px; } }
.mvm-aud2 { display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: 20px; font-size: 11.5px; font-weight: 700; border: 1px solid rgba(34, 197, 94, .35); background: rgba(34, 197, 94, .08); color: #16a34a; white-space: nowrap; }
.mvm-aud2.is-wait { border-color: rgba(245, 158, 11, .4); background: rgba(245, 158, 11, .08); color: #d97706; }
.mvm-aud2.is-fail { border-color: rgba(239, 68, 68, .4); background: rgba(239, 68, 68, .08); color: #dc2626; }
.mvm-aud2.is-check { border-color: rgba(148, 163, 184, .45); background: rgba(148, 163, 184, .1); color: #64748b; }
.mvm-aud-sum { margin-left: 10px; font-size: 12px; }
.mvm-group-h .mvm-aud-sum { margin-right: auto; }
/* the report after a delete */
.mvm-delrep-top { display: flex; align-items: baseline; gap: 10px; padding: 14px 16px; border-radius: 14px; background: rgba(34, 197, 94, .1); border: 1px solid rgba(34, 197, 94, .3); margin-bottom: 12px; }
.mvm-delrep-top b { font-size: 26px; font-weight: 800; color: #16a34a; }
.mvm-delrep-top span { font-size: 13.5px; color: var(--text-2, #888); }
.mvm-delrep ul { list-style: none; margin: 0; padding: 0; max-height: 46vh; overflow: auto; display: flex; flex-direction: column; gap: 4px; }
.mvm-delrep li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 10px; border-radius: 10px; background: var(--surface-2, rgba(255, 255, 255, .05)); font-size: 12.5px; }
.mvm-delrep li > span { display: flex; align-items: center; gap: 8px; min-width: 0; }
.mvm-delrep li em { flex: none; font-style: normal; font-weight: 800; font-size: 11px; padding: 2px 7px; border-radius: 6px; background: rgba(255, 45, 85, .12); color: #ff2d55; }
.mvm-delrep li code { background: none; color: inherit; padding: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12px; }
.mvm-delrep li > b { flex: none; font-variant-numeric: tabular-nums; }

/* ---------------------------------------------------------------- the profiles of the account (like Netflix): the avatar + the menu */
.mvp-av{position:relative;display:inline-block;width:36px;height:36px;border-radius:8px;overflow:hidden;flex:none;vertical-align:middle}
.mvp-av .mvp-svg{width:100%;height:100%;display:block}
.sp-av-mv .sp-av-btn .mvp-av{width:36px;height:36px}
.mvp-head .mvp-av{width:44px;height:44px;border-radius:10px}
.mvp-head small{color:#aaa}
.mvp-switch{display:flex;gap:10px;padding:4px 14px 10px;overflow-x:auto;scrollbar-width:none}
.mvp-switch a{display:flex;flex-direction:column;align-items:center;gap:5px;width:56px;text-decoration:none!important;color:#bbb!important;font-size:11.5px;flex:none}
.mvp-switch a:hover{color:#fff!important}
.mvp-switch .mvp-av{width:44px;height:44px;border-radius:10px;transition:box-shadow .15s}
.mvp-switch a:hover .mvp-av{box-shadow:0 0 0 2px #fff}
.mvp-switch small{max-width:56px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mvp-lk{position:absolute;right:2px;bottom:2px;font-size:13px!important;color:#fff;background:rgba(0,0,0,.6);border-radius:50%;padding:2px}
.sp-av-it.is-prem{color:#f5c518!important}.sp-av-it.is-prem .material-icons,.sp-av-it.is-gold .material-icons{color:#f5c518!important}
/* phone, own movies menu: "Request a movie" and "Downloads" are in the menu of the avatar, not in the bar too */
@media (max-width: 700px) { .mvx-top:has(.sp-av-mv) .mvx-askbtn { display: none !important; } }
/* the other profiles in the avatar menu: up to 4 (5 profiles per account) side by side, never cut off */
.mvp-switch{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:4px 12px 10px;overflow:visible}
.mvp-switch a{width:auto;min-width:0}
.mvp-switch small{max-width:100%}
/* the stereo sound for iOS: one green label + the "iOS checked" seal (update 234) */
.mvm-aud2 .material-icons, .mvm-aud .material-icons { font-size: 15px; vertical-align: -3px; }
.mvm-ios { display: inline-flex; align-items: center; gap: 2px; margin-left: 4px; padding: 1px 6px 1px 4px; border-radius: 10px; background: #fff; color: #111 !important; font-size: 10.5px; font-weight: 800; letter-spacing: .02em; line-height: 16px; vertical-align: middle; }
.mvm-ios .material-icons { font-size: 13px !important; vertical-align: 0 !important; color: #111; }
.mvm-ios .mvm-ios-v { color: #1d9bf0 !important; font-size: 14px !important; }
.mvm-aud.is-small .mvm-ios { margin-left: 0; }
/* only the sound icon + the iOS seal, no box around (update 236) */
.mvm-aud2.is-bare, .mvm-aud.is-bare { border: 0 !important; background: none !important; padding: 0 !important; gap: 3px; color: #22c55e; display: inline-flex; align-items: center; }
.mvm-aud2.is-bare .material-icons:first-child, .mvm-aud.is-bare .material-icons:first-child { font-size: 18px; vertical-align: middle; }
/* update 237: the subtitle layer on a layer of its own (redrawn even when nothing else on the page moves) */
.mvp-cues { will-change: transform; transform: translateZ(0); }
/* a TV browser: the subtitles drawn by the TV (text track of the video), the same look */
.mvp.is-tvsub .mvp-cues { display: none; }
.mvp.is-tvsub video::cue { background: transparent; color: #fff; font-weight: 700; font-size: 2.6vw; line-height: 1.35; text-shadow: 0 0 3px #000, 0 0 3px #000, 1px 1px 2px #000, -1px -1px 2px #000, 1px -1px 2px #000, -1px 1px 2px #000; }
.mvp.is-tvsub[data-subsize="s"] video::cue { font-size: 1.9vw; }
.mvp.is-tvsub[data-subsize="l"] video::cue { font-size: 3.5vw; }

/* Update 247 - a picture set as the logo of Movies (Settings) */
.mvx-brand .xlogo-pic img { display: block; max-height: 40px; width: auto; max-width: 200px; object-fit: contain; }
.mvx-brand .xlogo-tx b span, .mvx-brand .xlogo-tx b em { color: #fff !important; }
.mvx-brand .xlogo-tx b em { font-weight: 700; letter-spacing: -.01em; }

/* Update 254: the Movies logo without the coloured square (white play + dot), like before; no pink glow */
.mvx-brand .xlogo-movies .xlogo-ic { filter: none !important; }

/* ==========================================================================
   Update 259 - the collection band (like "Chills on Netflix" at Halloween) and its page /movie/genre/<slug>
   ========================================================================== */
.mvx-col { --sbw: 0px; position: relative; isolation: isolate; display: flex; align-items: center; gap: clamp(14px, 2vw, 40px);
    width: calc(100vw - var(--sbw)); margin: clamp(26px, 3vw, 60px) 0 clamp(26px, 3vw, 60px) calc(50% - (100vw - var(--sbw)) / 2);
    min-height: clamp(360px, 31vw, 760px); padding: clamp(40px, 5vw, 110px) 0; overflow: hidden; }
.mvx-col-bg { position: absolute; inset: 0; z-index: -1; background: var(--colbg) center / cover no-repeat; }
.mvx-col-bg::after { content: ""; position: absolute; inset: 0;
    background: linear-gradient(180deg, var(--mv-bg, #141414) 0%, rgba(20, 20, 20, .25) 18%, rgba(20, 20, 20, .1) 50%, rgba(20, 20, 20, .25) 82%, var(--mv-bg, #141414) 100%),
                linear-gradient(90deg, rgba(0, 0, 0, .55) 0%, rgba(0, 0, 0, .2) 28%, rgba(0, 0, 0, 0) 45%); }
.mvx-col-info { flex: 0 0 clamp(250px, 24%, 560px); padding-left: 4%; text-align: center; display: flex; flex-direction: column; align-items: center; }
.mvx-col-logo { display: block; margin: 0 0 clamp(10px, 1vw, 20px); color: var(--colc, #e50914) !important; text-decoration: none !important;
    font-family: Anton, Impact, "Haettenschweiler", "Arial Narrow Bold", "Arial Black", sans-serif !important; font-weight: 400; font-style: normal;
    font-size: clamp(46px, 4.4vw, 118px); line-height: .92; letter-spacing: -.005em; transform: skewX(-7deg);
    text-shadow: 0 4px 22px rgba(0, 0, 0, .55), 0 0 2px rgba(0, 0, 0, .6); }
.mvx-col-kick { display: inline-block; padding: clamp(8px, .7vw, 14px) clamp(18px, 1.6vw, 34px) 0; border-top: 1px solid rgba(255, 255, 255, .45);
    color: #fff; font-weight: 800; font-size: clamp(11px, .78vw, 18px); letter-spacing: .2em; text-transform: uppercase; text-shadow: 0 2px 8px rgba(0, 0, 0, .8); }
.mvx-col-desc { margin: clamp(14px, 1.3vw, 26px) 0 clamp(18px, 1.6vw, 34px); max-width: 420px; color: #f2f2f2; font-size: clamp(14px, .95vw, 21px); line-height: 1.45; text-shadow: 0 2px 10px rgba(0, 0, 0, .85); }
.mvx-col-btn { display: inline-flex; align-items: center; justify-content: center; padding: clamp(10px, .8vw, 16px) clamp(22px, 1.8vw, 40px); border-radius: 999px; background: #fff; color: #000 !important;
    font-weight: 800; font-size: clamp(15px, 1vw, 22px); text-decoration: none !important; box-shadow: 0 8px 26px rgba(0, 0, 0, .35); transition: transform .15s, background .15s; }
.mvx-col-btn:hover { background: #e6e6e6; transform: scale(1.03); }
.mvx-col-row { flex: 1 1 auto; min-width: 0; }
.mvx-col-row .mvx-track { padding-left: 0 !important; scroll-padding-left: 0 !important; }
.mvx .mvx-col-row .mvx-item { flex-basis: calc((100% - 4 * 8px) / 4.5); }
@media (max-width: 1400px) { .mvx .mvx-col-row .mvx-item { flex-basis: calc((100% - 3 * 8px) / 3.5); } }
@media (max-width: 1000px) { .mvx .mvx-col-row .mvx-item { flex-basis: calc((100% - 2 * 8px) / 2.6); } }
/* phones / tablets: the title on top (centred), the row under it */
@media (max-width: 800px) {
    .mvx-col-logo { font-size: clamp(44px, 14vw, 76px); }
    .mvx-col { flex-direction: column; align-items: stretch; min-height: 0; padding: 40px 0 26px; gap: 18px; }
    .mvx-col-info { flex: none; padding: 0 6%; }
    .mvx-col-bg::after { background: linear-gradient(180deg, var(--mv-bg, #141414) 0%, rgba(20, 20, 20, .35) 20%, rgba(20, 20, 20, .45) 60%, var(--mv-bg, #141414) 100%); }
    .mvx-col-row .mvx-track { padding-left: 4% !important; }
    .mvx .mvx-col-row .mvx-item { flex-basis: 62%; }
}
@media (min-width: 520px) and (max-width: 800px) { .mvx .mvx-col-row .mvx-item { flex-basis: 40%; } }

/* the page of the collection */
.mvx-colhero { position: relative; isolation: isolate; display: flex; align-items: flex-end; width: calc(100vw - var(--sbw, 0px)); margin-left: calc(50% - (100vw - var(--sbw, 0px)) / 2);
    min-height: clamp(380px, 56vw, 1100px); max-height: 82vh; margin-top: -70px; padding: 0 4% clamp(30px, 4vw, 90px); overflow: hidden; }
.mvx-colhero-bg { position: absolute; inset: 0; z-index: -1; background: var(--colbg) center 30% / cover no-repeat; }
.mvx-colhero-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20, 20, 20, .55) 0%, rgba(20, 20, 20, 0) 22%, rgba(20, 20, 20, 0) 55%, var(--mv-bg, #141414) 100%), linear-gradient(90deg, rgba(0, 0, 0, .6) 0%, rgba(0, 0, 0, 0) 50%); }
.mvx-colhero-info { display: flex; flex-direction: column; align-items: flex-start; max-width: 640px; }
.mvx-colhero .mvx-col-logo { font-size: clamp(54px, 6.4vw, 160px); transform-origin: left bottom; margin-left: .06em; }
.mvx-page .mvx-col-logo, .mvx-page h1.mvx-col-logo { color: var(--colc, #e50914) !important; }
.mvx-colhero .mvx-col-kick { padding-left: 0; padding-right: 0; border-top: 0; }
.mvx-colhero .mvx-col-desc { margin-bottom: 0; }
.mvx-colpage .mvx-top { position: relative; z-index: 6; }
.mvx-colrows .mvx-page-h { padding-top: 26px; }
.mvx-genre-h { display: flex; align-items: center; gap: 12px; max-width: 1760px; margin: 20px auto 0; padding: 0 4%; }
.mvx-genre-h h1 { margin: 0; font-size: clamp(26px, 2.6vw, 48px); font-weight: 900; }
.mvx-genre-h a { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: rgba(255, 255, 255, .1); text-decoration: none !important; }
@media (max-width: 800px) { .mvx-colhero { margin-top: 0; min-height: 62vw; max-height: none; padding-bottom: 22px; } .mvx-colhero-info { max-width: none; } }

/* ==========================================================================
   Update 260 - the collection picture is a real <img> and reaches BEHIND the row above (Top 10 series) and the row
   under it, fading out at the top and the bottom ("lost" into the page), like Netflix. The rows stay on top of it.
   ========================================================================== */
.mvx-col { isolation: auto; overflow: visible; z-index: auto; }
.mvx-col-bg { --colup: clamp(230px, 19vw, 560px); --coldn: clamp(200px, 16vw, 480px);
    top: calc(-1 * var(--colup)); bottom: calc(-1 * var(--coldn)); left: 0; right: 0; z-index: -1; background: none !important; pointer-events: none;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 30%, #000 72%, transparent 100%); mask-image: linear-gradient(180deg, transparent 0%, #000 30%, #000 72%, transparent 100%); }
.mvx-col-bg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; display: block; }
.mvx-col-bg::after { z-index: 1; background: linear-gradient(90deg, rgba(0, 0, 0, .55) 0%, rgba(0, 0, 0, .18) 30%, rgba(0, 0, 0, 0) 50%), rgba(20, 20, 20, .22) !important; }
/* the rows over the picture stay readable */
.mvx-rows .mvx-row { position: relative; }
.mvx-col + .mvx-row .mvx-row-h, .mvx-row:has(+ .mvx-col) .mvx-row-h { text-shadow: 0 2px 10px rgba(0, 0, 0, .8); }
.mvx-row:has(+ .mvx-col) .mvx-num { color: rgba(20, 20, 20, .55); }
@media (max-width: 800px) {
    .mvx-col-bg { --colup: 90px; --coldn: 60px; -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 22%, #000 80%, transparent 100%); mask-image: linear-gradient(180deg, transparent 0%, #000 22%, #000 80%, transparent 100%); }
    .mvx-col-bg::after { background: rgba(20, 20, 20, .35) !important; }
}
/* the page of the collection: the picture as a real <img> too */
.mvx-colhero-bg { background: none !important; }
.mvx-colhero-bg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; display: block; }
.mvx-colhero-bg::after { z-index: 1; }

/* ==========================================================================
   Update 261 - like Netflix: the band smaller (the title, the texts, the cards like in the other rows);
   the page "Explore all": the title at the TOP, the picture faded behind it, then the rows by category
   ========================================================================== */
.mvx-col { min-height: clamp(280px, 17.5vw, 600px); padding: clamp(24px, 2.4vw, 70px) 0; margin-top: clamp(14px, 1.6vw, 40px); margin-bottom: clamp(14px, 1.6vw, 40px); gap: clamp(10px, 1.4vw, 34px); }
.mvx-col-info { flex-basis: clamp(220px, 21%, 520px); }
.mvx-col-logo { font-size: clamp(34px, 2.9vw, 86px); margin-bottom: clamp(8px, .7vw, 16px); }
.mvx-col-kick { font-size: clamp(10px, .62vw, 15px); padding-top: clamp(6px, .5vw, 12px); letter-spacing: .18em; }
.mvx-col-desc { font-size: clamp(13px, .82vw, 19px); margin: clamp(10px, .9vw, 20px) 0 clamp(12px, 1.1vw, 24px); max-width: 360px; }
.mvx-col-btn { font-size: clamp(14px, .9vw, 20px); padding: clamp(8px, .6vw, 14px) clamp(18px, 1.3vw, 32px); }
.mvx .mvx-col-row .mvx-item { flex-basis: calc((100% - 5 * 8px) / 6.3); }
@media (max-width: 1400px) { .mvx .mvx-col-row .mvx-item { flex-basis: calc((100% - 4 * 8px) / 4.4); } }
@media (max-width: 1000px) { .mvx .mvx-col-row .mvx-item { flex-basis: calc((100% - 2 * 8px) / 3.2); } }
@media (max-width: 800px) { .mvx-col-logo { font-size: clamp(38px, 11vw, 60px); } .mvx .mvx-col-row .mvx-item { flex-basis: 46%; } }
@media (min-width: 520px) and (max-width: 800px) { .mvx .mvx-col-row .mvx-item { flex-basis: 31%; } }

/* the page of the collection */
.mvx-colpage .mvx-colhero { display: block; min-height: 0; max-height: none; margin-top: 0; padding: clamp(10px, 1.2vw, 30px) 4% 0; overflow: visible; z-index: 2; }
.mvx-colpage .mvx-colhero-bg { top: -90px; bottom: auto; height: clamp(420px, 44vw, 1300px); z-index: -1; opacity: .7;
    -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 35%, transparent 100%); mask-image: linear-gradient(180deg, #000 0%, #000 35%, transparent 100%); }
.mvx-colpage .mvx-colhero-bg::after { background: linear-gradient(90deg, rgba(0, 0, 0, .65) 0%, rgba(0, 0, 0, .15) 55%, rgba(0, 0, 0, .35) 100%) !important; }
.mvx-colpage .mvx-colhero-info { max-width: 1760px; margin: 0 auto; }
.mvx-colpage .mvx-colhero .mvx-col-logo { font-size: clamp(56px, 5.2vw, 150px); margin: 0 0 clamp(10px, 1vw, 24px); }
.mvx-colpage .mvx-colhero .mvx-col-kick { display: none; }
.mvx-colpage .mvx-colhero .mvx-col-desc { max-width: 900px; font-size: clamp(15px, 1vw, 24px); margin: 0; }
.mvx-colpage .mvx-colrows { margin-top: clamp(18px, 1.8vw, 44px) !important; position: relative; z-index: 3; }
.mvx-colpage .mvx-colrows .mvx-row { margin-bottom: clamp(16px, 1.6vw, 36px); }
@media (max-width: 800px) {
    .mvx-colpage .mvx-colhero { padding-top: 14px; }
    .mvx-colpage .mvx-colhero-bg { top: -70px; height: 90vw; }
    .mvx-colpage .mvx-colhero .mvx-col-logo { font-size: clamp(44px, 13vw, 70px); }
}
.mvx-colpage .mvx-colhero { padding-left: 2.6%; padding-right: 2.6%; }
.mvx-colpage .mvx-colhero-info { max-width: none; margin: 0; }
.mvx-colpage .mvx-colhero .mvx-col-logo { margin-left: .04em; transform-origin: left bottom; }
.mvx-col-info { padding-left: 2.6%; }

/* Update 262: the page of a collection - the rows start lower, a clear space under the title and the text */
.mvx-colpage .mvx-colrows { margin-top: clamp(46px, 4.6vw, 140px) !important; }
.mvx-colpage .mvx-colhero .mvx-col-desc { margin-top: clamp(6px, .5vw, 14px); }
@media (max-width: 800px) { .mvx-colpage .mvx-colrows { margin-top: 34px !important; } }
/* the Christmas title: gold, a soft glow */
.mvx-col-xmas .mvx-col-logo { text-shadow: 0 4px 22px rgba(0, 0, 0, .55), 0 0 18px rgba(255, 211, 107, .35); }

/* Update 264: the big title - room above each line for the Romanian accents (Ă Â Î Ș Ț), they were cut off / hidden
   by the line above ("CRACIUNULUI"); and much more space between the text and the first row of the collection page */
.mvx-col-logo { line-height: 1.08 !important; padding-top: .08em; }
.mvx-col-logo { overflow: visible; }
.mvx-colpage .mvx-colrows { margin-top: clamp(120px, 11vw, 340px) !important; }
@media (max-width: 800px) { .mvx-colpage .mvx-colrows { margin-top: 70px !important; } }

/* Update 265: each line of the big title is a block, with a real gap above the next one (the breve of Ă, the ^ of  Î) */
.mvx-col-logo { line-height: 1 !important; padding-top: 0; }
.mvx-col-ln { display: block; line-height: .95; }
.mvx-col-ln + .mvx-col-ln { margin-top: .3em; }

/* Update 266: the Easter title - pink, a soft white glow (readable on the bright spring picture) */
.mvx-col-easter .mvx-col-logo { text-shadow: 0 3px 16px rgba(0, 0, 0, .55), 0 0 2px rgba(0, 0, 0, .6), 0 0 22px rgba(255, 255, 255, .25); }
.mvx-col-easter .mvx-col-bg::after, .mvx-colhero.mvx-col-easter .mvx-colhero-bg::after { background: linear-gradient(90deg, rgba(0, 0, 0, .62) 0%, rgba(0, 0, 0, .3) 32%, rgba(0, 0, 0, .1) 55%), rgba(20, 20, 20, .3) !important; }