/* CINZO — Arabic vertical streaming platform */
:root {
  --bg: #07070a;
  --bg-soft: #0d0d13;
  --panel: rgba(17, 17, 25, 0.82);
  --panel-strong: #111119;
  --panel-light: rgba(255,255,255,.065);
  --text: #f7f7fb;
  --muted: #a6a7b3;
  --muted-2: #757683;
  --line: rgba(255,255,255,.1);
  --line-strong: rgba(255,255,255,.18);
  --primary: #e50914;
  --primary-2: #7b0009;
  --gold: #f8c75b;
  --success: #39d98a;
  --warning: #f7b84b;
  --danger: #ff5c68;
  --radius-xs: 10px;
  --radius-sm: 14px;
  --radius: 20px;
  --radius-lg: 30px;
  --radius-xl: 42px;
  --shadow: 0 24px 80px rgba(0,0,0,.42);
  --shadow-soft: 0 14px 40px rgba(0,0,0,.25);
  --header-h: 76px;
  --container: 1440px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(circle at 85% -5%, rgba(124,60,255,.13), transparent 35%),
    radial-gradient(circle at 15% 0%, rgba(255,61,113,.10), transparent 32%),
    var(--bg);
  color: var(--text);
  font-family: "Cairo", Tahoma, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
::selection { background: rgba(255,61,113,.35); color: white; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #09090d; }
::-webkit-scrollbar-thumb { background: #2e2e38; border-radius: 99px; border: 2px solid #09090d; }
::-webkit-scrollbar-thumb:hover { background: #444451; }

.app-noise {
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  opacity: .032;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.75'/%3E%3C/svg%3E");
  mix-blend-mode: soft-light;
}
.hidden { display: none !important; }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.ltr { direction: ltr; }
.muted { color: var(--muted); }
.text-primary { color: var(--primary); }
.text-success { color: var(--success); }
.center { text-align: center; }
.container { width: min(var(--container), calc(100% - 48px)); margin-inline: auto; }
.page-shell { min-height: 100vh; padding-top: var(--header-h); }
.page-content { padding: 34px 0 90px; }
.stack { display: flex; flex-direction: column; gap: 18px; }
.row { display: flex; align-items: center; gap: 12px; }
.row-between { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.wrap { flex-wrap: wrap; }

.icon {
  width: 21px;
  height: 21px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.icon svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }

.site-header {
  position: fixed;
  inset: 0 0 auto 0;
  height: var(--header-h);
  z-index: 90;
  background: linear-gradient(to bottom, rgba(7,7,10,.94), rgba(7,7,10,.68));
  backdrop-filter: blur(18px) saturate(130%);
  border-bottom: 1px solid rgba(255,255,255,.055);
  transition: .25s ease;
}
.site-header.scrolled { background: rgba(7,7,10,.92); box-shadow: 0 12px 35px rgba(0,0,0,.25); }
.header-inner {
  height: 100%;
  width: min(var(--container), calc(100% - 48px));
  margin-inline: auto;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 32px;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-width: max-content;
}
.brand-mark {
  position: relative;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(255,61,113,.16), rgba(124,60,255,.16));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 10px 28px rgba(124,60,255,.16);
}
.brand-mark::before {
  content: "";
  position: absolute;
  width: 21px;
  height: 21px;
  border: 5px solid transparent;
  border-top-color: var(--primary);
  border-right-color: var(--primary-2);
  border-bottom-color: var(--primary-2);
  border-radius: 50%;
  inset: 6px auto auto 6px;
  transform: rotate(45deg);
}
.brand-mark::after {
  content: "";
  position: absolute;
  inset: 13px 12px auto auto;
  width: 0; height: 0;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-right: 10px solid white;
  transform: rotate(180deg);
}
.brand-copy strong {
  display: block;
  font-size: 1.06rem;
  line-height: 1;
  letter-spacing: 2.8px;
  font-weight: 900;
}
.brand-copy small {
  display: block;
  font-size: .66rem;
  color: var(--muted);
  margin-top: 4px;
  letter-spacing: 0;
}
.desktop-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
}
.nav-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #c7c7cf;
  padding: 10px 13px;
  border-radius: 12px;
  font-size: .91rem;
  transition: .2s ease;
}
.nav-link:hover, .nav-link.active { background: rgba(255,255,255,.07); color: white; }
.nav-link.active { box-shadow: inset 0 0 0 1px rgba(255,255,255,.055); }
.header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 9px; }
.icon-btn {
  width: 42px;
  height: 42px;
  border: 1px solid var(--line);
  border-radius: 13px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.04);
  cursor: pointer;
  transition: .2s ease;
}
.icon-btn:hover { background: rgba(255,255,255,.09); border-color: var(--line-strong); transform: translateY(-1px); }
.avatar-btn {
  width: 43px;
  height: 43px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.17);
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  display: grid;
  place-items: center;
  color: white;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(124,60,255,.28);
}
.search-popover {
  position: fixed;
  z-index: 95;
  top: 86px;
  left: 50%;
  transform: translateX(-50%);
  width: min(660px, calc(100% - 32px));
  padding: 14px;
  border-radius: 20px;
  background: rgba(15,15,22,.96);
  border: 1px solid var(--line-strong);
  box-shadow: var(--shadow);
  backdrop-filter: blur(24px);
  animation: pop .18s ease;
}
.search-box {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 15px;
  padding: 0 14px;
  background: rgba(255,255,255,.045);
}
.search-box input {
  flex: 1;
  height: 48px;
  border: 0;
  outline: 0;
  color: white;
  background: transparent;
}
.search-results { max-height: 420px; overflow: auto; margin-top: 10px; }
.search-result {
  display: grid;
  grid-template-columns: 58px 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 9px;
  border-radius: 13px;
  transition: .2s;
}
.search-result:hover { background: rgba(255,255,255,.06); }
.search-result img { width: 58px; height: 72px; object-fit: cover; border-radius: 10px; }
.search-result h4 { margin: 0 0 5px; font-size: .95rem; }
.search-result p { margin: 0; color: var(--muted); font-size: .78rem; }

.btn {
  min-height: 44px;
  border: 0;
  border-radius: 13px;
  padding: 0 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  cursor: pointer;
  font-weight: 800;
  font-size: .91rem;
  transition: transform .2s ease, filter .2s ease, background .2s ease, border-color .2s ease;
  white-space: nowrap;
}
.btn:hover { transform: translateY(-2px); filter: brightness(1.06); }
.btn:active { transform: translateY(0) scale(.985); }
.btn:disabled { opacity: .48; pointer-events: none; }
.btn-primary {
  color: white;
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  box-shadow: 0 12px 30px rgba(124,60,255,.26);
}
.btn-secondary {
  color: white;
  border: 1px solid var(--line-strong);
  background: rgba(255,255,255,.075);
  backdrop-filter: blur(12px);
}
.btn-ghost { background: transparent; border: 1px solid var(--line); color: #dddde4; }
.btn-danger { background: rgba(255,92,104,.13); color: #ff8c94; border: 1px solid rgba(255,92,104,.23); }
.btn-success { background: rgba(57,217,138,.13); color: #63eaa7; border: 1px solid rgba(57,217,138,.22); }
.btn-sm { min-height: 36px; padding-inline: 13px; border-radius: 10px; font-size: .82rem; }
.btn-lg { min-height: 54px; padding-inline: 25px; border-radius: 16px; font-size: 1rem; }

.hero {
  position: relative;
  min-height: min(790px, calc(100vh - 20px));
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  isolation: isolate;
}
.hero-bg {
  position: absolute;
  inset: 0;
  z-index: -4;
  background-size: cover;
  background-position: center 25%;
  transform: scale(1.035);
  animation: heroDrift 18s ease-in-out infinite alternate;
}
.hero-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to left, rgba(7,7,10,.15), rgba(7,7,10,.78) 70%),
    linear-gradient(to top, var(--bg) 0%, rgba(7,7,10,.38) 48%, rgba(7,7,10,.18) 100%);
}
.hero-glow {
  position: absolute;
  z-index: -2;
  width: 620px;
  height: 620px;
  left: -150px;
  bottom: -210px;
  border-radius: 50%;
  filter: blur(90px);
  background: rgba(124,60,255,.17);
  animation: breathe 7s ease-in-out infinite;
}
.hero-content {
  width: min(var(--container), calc(100% - 48px));
  margin-inline: auto;
  padding: 80px 0 100px;
  position: relative;
  z-index: 2;
}
.hero-copy { max-width: 720px; }
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: .8rem;
  font-weight: 900;
  letter-spacing: .2px;
  padding: 8px 12px;
  border-radius: 99px;
  color: #ffe7ee;
  border: 1px solid rgba(255,61,113,.25);
  background: rgba(255,61,113,.10);
  backdrop-filter: blur(8px);
}
.eyebrow .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--primary); box-shadow: 0 0 15px var(--primary); }
.hero h1 {
  margin: 20px 0 12px;
  font-size: clamp(3rem, 7vw, 6.6rem);
  line-height: .97;
  letter-spacing: -4px;
  text-shadow: 0 10px 50px rgba(0,0,0,.5);
}
.hero .english-title {
  color: rgba(255,255,255,.55);
  font-size: clamp(.88rem, 1.5vw, 1.1rem);
  letter-spacing: 5px;
  text-transform: uppercase;
  direction: ltr;
  display: inline-block;
}
.meta-line {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin: 18px 0;
  color: #e4e4e9;
  font-size: .9rem;
}
.meta-pill {
  padding: 5px 9px;
  border-radius: 8px;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.1);
}
.hero-description {
  max-width: 660px;
  margin: 0 0 26px;
  color: #dadbe1;
  line-height: 1.9;
  font-size: 1.03rem;
  text-shadow: 0 3px 20px rgba(0,0,0,.8);
}
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.hero-side-card {
  position: absolute;
  left: 0;
  bottom: 100px;
  width: 270px;
  padding: 18px;
  border-radius: 22px;
  border: 1px solid var(--line);
  background: rgba(12,12,18,.62);
  backdrop-filter: blur(20px);
  box-shadow: var(--shadow-soft);
}
.hero-side-card strong { font-size: 1.8rem; display: block; margin-bottom: 3px; }
.hero-side-card p { margin: 0; color: var(--muted); font-size: .82rem; line-height: 1.6; }

.content-section { padding: 28px 0 12px; position: relative; }
.section-head { margin-bottom: 17px; }
.section-title { margin: 0; font-size: clamp(1.3rem, 2vw, 1.8rem); letter-spacing: -.4px; }
.section-subtitle { margin: 6px 0 0; color: var(--muted); font-size: .87rem; }
.section-link { color: #c9c9d3; font-size: .85rem; display: inline-flex; gap: 6px; align-items: center; }
.section-link:hover { color: white; }

.media-row {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(185px, 15.5vw);
  gap: 16px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: inline mandatory;
  padding: 5px 2px 24px;
}
.media-row.wide { grid-auto-columns: minmax(280px, 25vw); }
.media-row::-webkit-scrollbar { height: 5px; }
.media-card {
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  background: #14141b;
  aspect-ratio: 2 / 3;
  scroll-snap-align: start;
  border: 1px solid rgba(255,255,255,.075);
  box-shadow: 0 12px 30px rgba(0,0,0,.23);
  cursor: pointer;
  transition: transform .32s cubic-bezier(.2,.8,.2,1), border-color .25s, box-shadow .25s;
}
.media-card.horizontal { aspect-ratio: 16 / 10; }
.media-card:hover { transform: translateY(-7px) scale(1.018); border-color: rgba(255,255,255,.2); box-shadow: 0 24px 50px rgba(0,0,0,.42); z-index: 3; }
.media-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.media-card:hover img { transform: scale(1.06); }
.media-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(5,5,8,.96), rgba(5,5,8,.1) 58%, transparent);
}
.media-card-content { position: absolute; z-index: 2; inset: auto 14px 14px; }
.media-card h3 { margin: 0 0 6px; font-size: 1rem; }
.media-card p { margin: 0; color: #c1c2cb; font-size: .74rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-badges { position: absolute; z-index: 3; top: 11px; right: 11px; left: 11px; display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 25px;
  padding: 3px 8px;
  border-radius: 8px;
  font-size: .69rem;
  font-weight: 900;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.4);
}
.badge-primary { background: rgba(255,61,113,.84); border-color: rgba(255,255,255,.12); }
.badge-gold { color: #241701; background: var(--gold); border-color: transparent; }
.badge-success { background: rgba(57,217,138,.82); color: #042817; }
.badge-dark { background: rgba(8,8,12,.7); }
.card-play {
  position: absolute;
  z-index: 4;
  inset: 50% auto auto 50%;
  transform: translate(-50%,-45%) scale(.8);
  opacity: 0;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.92);
  color: #08080b;
  transition: .25s ease;
  box-shadow: 0 10px 35px rgba(0,0,0,.3);
}
.media-card:hover .card-play { opacity: 1; transform: translate(-50%,-50%) scale(1); }

.feature-strip {
  position: relative;
  margin: 35px 0;
  padding: 30px;
  border-radius: 30px;
  border: 1px solid var(--line);
  background:
    radial-gradient(circle at 10% 20%, rgba(255,61,113,.13), transparent 28%),
    radial-gradient(circle at 90% 70%, rgba(124,60,255,.16), transparent 30%),
    rgba(255,255,255,.035);
  overflow: hidden;
}
.feature-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 15px; }
.feature-item { padding: 18px; border-radius: 18px; background: rgba(255,255,255,.035); border: 1px solid rgba(255,255,255,.065); }
.feature-icon { width: 42px; height: 42px; border-radius: 13px; display: grid; place-items: center; background: linear-gradient(135deg, rgba(255,61,113,.18), rgba(124,60,255,.2)); color: #fff; margin-bottom: 13px; }
.feature-item h4 { margin: 0 0 6px; }
.feature-item p { margin: 0; color: var(--muted); line-height: 1.7; font-size: .82rem; }

.site-footer { margin-top: 60px; padding: 55px 0 100px; border-top: 1px solid var(--line); background: rgba(255,255,255,.018); }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; }
.footer-copy p { color: var(--muted); line-height: 1.8; max-width: 440px; }
.footer-col h4 { margin: 0 0 14px; }
.footer-col a { display: block; color: var(--muted); padding: 6px 0; font-size: .87rem; }
.footer-col a:hover { color: white; }

.detail-hero {
  position: relative;
  min-height: 600px;
  display: flex;
  align-items: flex-end;
  isolation: isolate;
  overflow: hidden;
}
.detail-hero-bg {
  position: absolute;
  inset: 0;
  z-index: -2;
  background-size: cover;
  background-position: center 25%;
}
.detail-hero-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to top, var(--bg) 2%, rgba(7,7,10,.55) 47%, rgba(7,7,10,.24)),
    linear-gradient(to left, transparent, rgba(7,7,10,.75));
}
.detail-content {
  width: min(var(--container), calc(100% - 48px));
  margin-inline: auto;
  display: grid;
  grid-template-columns: minmax(0,1fr) 260px;
  gap: 44px;
  align-items: end;
  padding: 110px 0 52px;
}
.detail-title { font-size: clamp(2.7rem, 6vw, 5.7rem); margin: 0 0 8px; line-height: 1; letter-spacing: -3px; }
.detail-description { max-width: 720px; color: #d0d0d8; line-height: 1.9; font-size: 1rem; }
.detail-poster {
  width: 100%;
  aspect-ratio: 2/3;
  object-fit: cover;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: var(--shadow);
}
.detail-tabs { display: flex; gap: 8px; margin-bottom: 22px; overflow-x: auto; }
.tab-btn {
  border: 1px solid var(--line);
  color: var(--muted);
  background: transparent;
  border-radius: 12px;
  padding: 10px 15px;
  cursor: pointer;
  white-space: nowrap;
}
.tab-btn.active { background: white; color: #08080b; border-color: white; font-weight: 800; }
.episodes-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 15px; }
.episode-card {
  position: relative;
  min-height: 165px;
  padding: 17px;
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.025));
  border: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: .2s ease;
  cursor: pointer;
}
.episode-card:hover { transform: translateY(-3px); border-color: var(--line-strong); background: rgba(255,255,255,.07); }
.episode-card.locked { opacity: .78; }
.episode-number { font-size: 2.2rem; font-weight: 900; color: rgba(255,255,255,.12); line-height: 1; }
.episode-card h4 { margin: 13px 0 5px; }
.episode-card p { margin: 0; color: var(--muted); font-size: .78rem; line-height: 1.6; }
.episode-footer { display: flex; justify-content: space-between; align-items: center; margin-top: 15px; }
.lock-chip { display: inline-flex; gap: 5px; align-items: center; color: #ffc8d7; font-size: .72rem; }
.free-chip { color: var(--success); font-size: .72rem; font-weight: 800; }

.auth-page {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 1fr minmax(420px, 560px);
  background:
    radial-gradient(circle at 15% 20%, rgba(124,60,255,.16), transparent 38%),
    radial-gradient(circle at 90% 80%, rgba(255,61,113,.13), transparent 35%),
    var(--bg);
}
.auth-visual {
  position: relative;
  padding: 60px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  background-image:
    linear-gradient(to top, rgba(7,7,10,.9), rgba(7,7,10,.12)),
    url("https://images.unsplash.com/photo-1485846234645-a62644f84728?auto=format&fit=crop&w=1600&q=90");
  background-size: cover;
  background-position: center;
}
.auth-visual h1 { font-size: clamp(2.5rem, 5vw, 5.4rem); line-height: 1; max-width: 700px; margin: 0; letter-spacing: -3px; }
.auth-visual p { color: #dedee5; max-width: 600px; line-height: 1.9; }
.auth-panel { display: grid; place-items: center; padding: 40px; border-right: 1px solid var(--line); }
.auth-card { width: 100%; max-width: 430px; }
.auth-card h2 { font-size: 2rem; margin: 0 0 8px; }
.auth-card > p { margin: 0 0 25px; color: var(--muted); }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.form-group { display: flex; flex-direction: column; gap: 8px; margin-bottom: 14px; }
.form-group label { color: #d7d7df; font-size: .82rem; font-weight: 700; }
.input, .select, .textarea {
  width: 100%;
  border: 1px solid var(--line);
  color: white;
  background: rgba(255,255,255,.045);
  border-radius: 13px;
  outline: 0;
  transition: .2s;
}
.input, .select { height: 48px; padding: 0 14px; }
.textarea { min-height: 110px; resize: vertical; padding: 13px 14px; line-height: 1.7; }
.input:focus, .select:focus, .textarea:focus { border-color: rgba(124,60,255,.75); box-shadow: 0 0 0 4px rgba(124,60,255,.10); }
.select option { color: #111; }
.form-note { color: var(--muted); font-size: .76rem; line-height: 1.6; }
.form-error { color: #ff8891; font-size: .78rem; min-height: 18px; }
.auth-switch { text-align: center; color: var(--muted); margin-top: 20px; font-size: .86rem; }
.auth-switch a { color: white; font-weight: 800; }
.demo-credentials {
  margin-top: 18px;
  padding: 13px;
  border-radius: 13px;
  background: rgba(248,199,91,.075);
  border: 1px solid rgba(248,199,91,.16);
  color: #e9d9b0;
  font-size: .75rem;
  line-height: 1.7;
}

.pricing-hero { padding: 75px 0 30px; text-align: center; }
.pricing-hero h1 { font-size: clamp(2.5rem, 5vw, 5rem); margin: 0 0 14px; letter-spacing: -3px; }
.pricing-hero p { color: var(--muted); max-width: 700px; margin: auto; line-height: 1.8; }
.pricing-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; margin: 38px auto 60px; max-width: 1100px; }
.plan-card {
  position: relative;
  padding: 28px;
  border-radius: 26px;
  border: 1px solid var(--line);
  background: linear-gradient(155deg, rgba(255,255,255,.065), rgba(255,255,255,.02));
  box-shadow: var(--shadow-soft);
}
.plan-card.featured {
  border-color: rgba(255,61,113,.4);
  background:
    radial-gradient(circle at 70% 0%, rgba(124,60,255,.17), transparent 35%),
    linear-gradient(155deg, rgba(255,61,113,.08), rgba(255,255,255,.025));
  transform: translateY(-10px);
}
.plan-popular { position: absolute; top: -13px; left: 22px; padding: 6px 11px; border-radius: 99px; background: linear-gradient(135deg,var(--primary),var(--primary-2)); font-size: .72rem; font-weight: 900; }
.plan-card h3 { margin: 0 0 7px; font-size: 1.4rem; }
.plan-card > p { color: var(--muted); min-height: 45px; line-height: 1.6; font-size: .83rem; }
.plan-price { font-size: 2.75rem; font-weight: 900; margin: 25px 0 4px; direction: ltr; text-align: right; }
.plan-price small { font-size: .78rem; color: var(--muted); font-weight: 500; }
.plan-features { list-style: none; padding: 0; margin: 25px 0; display: flex; flex-direction: column; gap: 12px; color: #d7d7df; font-size: .85rem; }
.plan-features li { display: flex; align-items: center; gap: 8px; }
.plan-features .icon { color: var(--success); width: 18px; height: 18px; }

.panel {
  border: 1px solid var(--line);
  background: rgba(255,255,255,.035);
  border-radius: 22px;
  padding: 22px;
  box-shadow: var(--shadow-soft);
}
.dashboard-grid { display: grid; grid-template-columns: 280px 1fr; gap: 24px; }
.sidebar {
  position: sticky;
  top: calc(var(--header-h) + 24px);
  align-self: start;
  padding: 18px;
  border-radius: 22px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.035);
}
.sidebar-user { display: flex; gap: 12px; align-items: center; padding: 8px 5px 18px; border-bottom: 1px solid var(--line); margin-bottom: 12px; }
.sidebar-avatar { width: 46px; height: 46px; border-radius: 15px; display: grid; place-items: center; background: linear-gradient(135deg,var(--primary),var(--primary-2)); font-weight: 900; }
.sidebar-user h4 { margin: 0 0 4px; }
.sidebar-user p { margin: 0; color: var(--muted); font-size: .74rem; overflow: hidden; text-overflow: ellipsis; max-width: 160px; }
.sidebar-nav { display: flex; flex-direction: column; gap: 5px; }
.sidebar-link {
  width: 100%;
  min-height: 44px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: #babac4;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 12px;
  cursor: pointer;
  text-align: right;
}
.sidebar-link:hover, .sidebar-link.active { background: rgba(255,255,255,.07); color: white; }
.dashboard-main h1 { margin: 0 0 8px; font-size: 2.1rem; }
.dashboard-main > p { color: var(--muted); margin: 0 0 26px; }
.stats-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin-bottom: 24px; }
.stat-card { padding: 19px; border-radius: 18px; border: 1px solid var(--line); background: rgba(255,255,255,.035); }
.stat-card .stat-label { color: var(--muted); font-size: .78rem; }
.stat-card strong { display: block; font-size: 1.9rem; margin: 7px 0 3px; }
.stat-card small { color: var(--muted-2); font-size: .72rem; }
.subscription-card {
  position: relative;
  overflow: hidden;
  padding: 25px;
  border-radius: 24px;
  border: 1px solid rgba(124,60,255,.24);
  background:
    radial-gradient(circle at 90% 10%, rgba(124,60,255,.22), transparent 35%),
    radial-gradient(circle at 10% 90%, rgba(255,61,113,.15), transparent 32%),
    rgba(255,255,255,.035);
}
.subscription-card.active { border-color: rgba(57,217,138,.25); }
.subscription-card h3 { margin: 0 0 8px; }
.subscription-status { display: inline-flex; align-items: center; gap: 7px; color: var(--success); font-size: .8rem; font-weight: 800; }
.subscription-status .pulse { width: 8px; height: 8px; background: var(--success); border-radius: 50%; box-shadow: 0 0 0 5px rgba(57,217,138,.1); }
.progress-bar { height: 8px; border-radius: 99px; background: rgba(255,255,255,.08); overflow: hidden; }
.progress-bar > span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--primary),var(--primary-2)); }

.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 18px; }
.data-table { width: 100%; border-collapse: collapse; min-width: 780px; }
.data-table th, .data-table td { padding: 14px 15px; text-align: right; border-bottom: 1px solid var(--line); vertical-align: middle; }
.data-table th { color: var(--muted); font-size: .75rem; background: rgba(255,255,255,.03); }
.data-table td { font-size: .83rem; }
.data-table tr:last-child td { border-bottom: 0; }
.data-table tr:hover td { background: rgba(255,255,255,.022); }
.status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border-radius: 99px;
  padding: 5px 9px;
  font-size: .69rem;
  font-weight: 800;
}
.status.pending { color: #ffd999; background: rgba(247,184,75,.11); }
.status.approved, .status.active, .status.published { color: #80efb6; background: rgba(57,217,138,.11); }
.status.rejected, .status.expired, .status.draft { color: #ff969e; background: rgba(255,92,104,.11); }
.admin-tabs { display: flex; gap: 7px; overflow-x: auto; margin-bottom: 20px; padding-bottom: 4px; }
.admin-tab {
  min-height: 40px;
  border-radius: 11px;
  border: 1px solid var(--line);
  background: transparent;
  color: var(--muted);
  padding: 0 14px;
  cursor: pointer;
  white-space: nowrap;
}
.admin-tab.active { color: #08080b; background: white; border-color: white; font-weight: 900; }
.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 120;
  background: rgba(0,0,0,.75);
  backdrop-filter: blur(10px);
  display: grid;
  place-items: center;
  padding: 20px;
  animation: fade .18s ease;
}
.modal {
  width: min(680px, 100%);
  max-height: min(90vh, 860px);
  overflow: auto;
  padding: 24px;
  border-radius: 24px;
  border: 1px solid var(--line-strong);
  background: #111118;
  box-shadow: var(--shadow);
  animation: pop .2s ease;
}
.modal h3 { margin: 0 0 6px; font-size: 1.45rem; }
.modal > p { color: var(--muted); margin: 0 0 20px; }

.watch-page { min-height: 100vh; padding: 22px; background: #020204; }
.watch-topbar { height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 14px; max-width: 1600px; margin: auto; }
.watch-brand { display: flex; gap: 10px; align-items: center; }
.watch-layout { max-width: 1600px; margin: 8px auto 0; display: grid; grid-template-columns: minmax(0,1fr) 360px; gap: 18px; }
.video-stage {
  position: relative;
  min-height: calc(100vh - 110px);
  border-radius: 24px;
  overflow: hidden;
  background:
    radial-gradient(circle at center, #17171f, #050507 70%);
  border: 1px solid rgba(255,255,255,.08);
  display: grid;
  place-items: center;
}
.video-stage.vertical video { width: auto; height: min(calc(100vh - 145px), 900px); max-width: 100%; aspect-ratio: 9/16; object-fit: contain; background: black; }
.video-stage.horizontal video { width: 100%; height: auto; max-height: calc(100vh - 130px); aspect-ratio: 16/9; object-fit: contain; background: black; }
.video-stage video { display: block; }
.video-watermark {
  position: absolute;
  top: 26px;
  right: 26px;
  z-index: 4;
  color: rgba(255,255,255,.34);
  font-size: .7rem;
  letter-spacing: 1px;
  pointer-events: none;
  text-shadow: 0 2px 8px #000;
}
.watch-sidebar {
  min-height: calc(100vh - 110px);
  max-height: calc(100vh - 110px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border-radius: 24px;
  border: 1px solid var(--line);
  background: #0d0d12;
}
.watch-info { padding: 20px; border-bottom: 1px solid var(--line); }
.watch-info h1 { margin: 0 0 6px; font-size: 1.4rem; }
.watch-info p { margin: 0; color: var(--muted); font-size: .8rem; }
.episode-list { overflow-y: auto; padding: 10px; }
.watch-episode {
  display: grid;
  grid-template-columns: 43px 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 11px;
  border-radius: 13px;
  cursor: pointer;
  border: 1px solid transparent;
}
.watch-episode:hover { background: rgba(255,255,255,.05); }
.watch-episode.active { background: rgba(124,60,255,.12); border-color: rgba(124,60,255,.25); }
.watch-episode .num { width: 38px; height: 38px; border-radius: 11px; background: rgba(255,255,255,.06); display: grid; place-items: center; font-weight: 900; }
.watch-episode h4 { margin: 0 0 4px; font-size: .83rem; }
.watch-episode p { margin: 0; color: var(--muted); font-size: .68rem; }
.gate {
  width: min(480px, calc(100% - 30px));
  padding: 32px;
  text-align: center;
  border-radius: 28px;
  border: 1px solid var(--line-strong);
  background: rgba(14,14,20,.88);
  backdrop-filter: blur(22px);
  box-shadow: var(--shadow);
}
.gate-icon { width: 68px; height: 68px; border-radius: 22px; display: grid; place-items: center; margin: 0 auto 18px; background: linear-gradient(135deg,rgba(255,61,113,.18),rgba(124,60,255,.2)); }
.gate h2 { margin: 0 0 9px; font-size: 1.8rem; }
.gate p { color: var(--muted); line-height: 1.8; margin: 0 0 22px; }

.empty-state { padding: 50px 20px; text-align: center; border: 1px dashed var(--line-strong); border-radius: 20px; color: var(--muted); }
.empty-state .icon { width: 46px; height: 46px; margin: 0 auto 12px; color: #727381; }
.empty-state h3 { color: white; margin: 0 0 8px; }
.loading-screen { min-height: 100vh; display: grid; place-items: center; }
.loader {
  width: 66px;
  height: 66px;
  border-radius: 50%;
  border: 3px solid rgba(255,255,255,.08);
  border-top-color: var(--primary);
  border-right-color: var(--primary-2);
  animation: spin .8s linear infinite;
}
.skeleton { position: relative; overflow: hidden; background: rgba(255,255,255,.055); }
.skeleton::after { content:""; position:absolute; inset:0; transform:translateX(100%); background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent); animation: shimmer 1.3s infinite; }
.toast-root { position: fixed; z-index: 200; left: 20px; bottom: 20px; display: flex; flex-direction: column; gap: 10px; width: min(380px, calc(100% - 40px)); }
.toast {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 11px;
  padding: 14px;
  border: 1px solid var(--line-strong);
  border-radius: 15px;
  background: rgba(17,17,24,.96);
  box-shadow: var(--shadow-soft);
  animation: toastIn .25s ease;
}
.toast.success .toast-dot { background: var(--success); }
.toast.error .toast-dot { background: var(--danger); }
.toast.info .toast-dot { background: var(--primary-2); }
.toast-dot { width: 9px; height: 9px; border-radius: 50%; box-shadow: 0 0 14px currentColor; }
.toast p { margin: 0; font-size: .83rem; line-height: 1.5; }
.toast button { border:0; background:transparent; color:var(--muted); cursor:pointer; }

.mobile-nav {
  display: none;
  position: fixed;
  z-index: 100;
  left: 12px; right: 12px; bottom: max(12px, env(safe-area-inset-bottom));
  height: 66px;
  border-radius: 22px;
  border: 1px solid var(--line-strong);
  background: rgba(15,15,22,.91);
  backdrop-filter: blur(22px);
  box-shadow: 0 18px 45px rgba(0,0,0,.45);
  grid-template-columns: repeat(5,1fr);
  padding: 7px;
}
.mobile-link { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; color:var(--muted); font-size:.61rem; border-radius:15px; }
.mobile-link.active { color:white; background:rgba(255,255,255,.07); }
.mobile-link .icon { width:20px; height:20px; }

@keyframes spin { to { transform: rotate(360deg); } }
@keyframes shimmer { to { transform: translateX(-100%); } }
@keyframes fade { from { opacity:0; } to { opacity:1; } }
@keyframes pop { from { opacity:0; transform: translateY(10px) scale(.98); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes toastIn { from { opacity:0; transform:translateX(-20px); } to { opacity:1; transform:translateX(0); } }
@keyframes breathe { 50% { transform:scale(1.08); opacity:.7; } }
@keyframes heroDrift { from { transform:scale(1.035) translate3d(0,0,0); } to { transform:scale(1.08) translate3d(1.2%,-.8%,0); } }

@media (max-width: 1180px) {
  .desktop-nav { display: none; }
  .header-inner { grid-template-columns: auto 1fr; }
  .header-actions { justify-self: end; }
  .hero-side-card { display: none; }
  .episodes-grid { grid-template-columns: repeat(3,1fr); }
  .stats-grid { grid-template-columns: repeat(2,1fr); }
  .feature-grid { grid-template-columns: repeat(2,1fr); }
  .footer-grid { grid-template-columns: 1.5fr 1fr 1fr; }
  .footer-grid .footer-col:last-child { display:none; }
}
@media (max-width: 900px) {
  :root { --header-h: 68px; }
  .container, .header-inner, .hero-content, .detail-content { width: min(100% - 30px, var(--container)); }
  .header-inner { gap: 12px; }
  .brand-copy small { display:none; }
  .brand-copy strong { font-size:.95rem; }
  .header-actions .btn { display:none; }
  .hero { min-height: 720px; }
  .hero-content { padding-bottom: 74px; }
  .hero h1 { letter-spacing:-2px; }
  .detail-content { grid-template-columns: 1fr; }
  .detail-poster { display:none; }
  .episodes-grid { grid-template-columns: repeat(2,1fr); }
  .pricing-grid { grid-template-columns: 1fr; max-width:560px; }
  .plan-card.featured { transform:none; }
  .dashboard-grid { grid-template-columns:1fr; }
  .sidebar { position:relative; top:auto; }
  .sidebar-nav { flex-direction:row; overflow-x:auto; }
  .sidebar-link { min-width:max-content; }
  .watch-layout { grid-template-columns:1fr; }
  .watch-sidebar { min-height:420px; max-height:600px; }
  .video-stage { min-height:65vh; }
  .auth-page { grid-template-columns:1fr; }
  .auth-visual { display:none; }
  .auth-panel { border:0; min-height:100vh; padding:28px 20px; }
}
@media (max-width: 680px) {
  body { padding-bottom:88px; }
  .site-header { height:64px; }
  .header-inner { width:calc(100% - 24px); }
  .brand-mark { width:37px; height:37px; border-radius:12px; }
  .brand-copy strong { letter-spacing:1.8px; }
  .header-actions .icon-btn:first-child { display:none; }
  .hero { min-height:680px; }
  .hero-bg { background-position:center; }
  .hero-content { width:calc(100% - 28px); padding-bottom:65px; }
  .hero h1 { font-size:3rem; }
  .hero-description { font-size:.91rem; line-height:1.8; }
  .hero-actions .btn { flex:1; }
  .media-row { grid-auto-columns: minmax(155px, 44vw); gap:12px; }
  .media-row.wide { grid-auto-columns:minmax(260px,78vw); }
  .content-section { padding-top:20px; }
  .section-title { font-size:1.25rem; }
  .feature-strip { padding:18px; border-radius:22px; }
  .feature-grid { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .footer-copy { grid-column:1/-1; }
  .detail-hero { min-height:560px; }
  .detail-content { width:calc(100% - 28px); padding-bottom:36px; }
  .detail-title { font-size:3rem; }
  .detail-description { font-size:.9rem; }
  .episodes-grid { grid-template-columns:1fr; }
  .episode-card { min-height:145px; }
  .form-grid { grid-template-columns:1fr; gap:0; }
  .page-content { padding-top:22px; }
  .pricing-hero { padding-top:45px; }
  .pricing-hero h1 { font-size:2.7rem; }
  .pricing-grid { margin-top:28px; }
  .stats-grid { grid-template-columns:1fr 1fr; }
  .panel { padding:17px; border-radius:18px; }
  .watch-page { padding:9px; }
  .watch-topbar { height:52px; }
  .watch-layout { gap:10px; }
  .video-stage { min-height:70vh; border-radius:18px; }
  .watch-sidebar { border-radius:18px; }
  .video-stage.vertical video { height:auto; width:100%; max-height:75vh; }
  .mobile-nav { display:grid; }
  .toast-root { bottom:92px; left:12px; width:calc(100% - 24px); }
}
@media (max-width: 420px) {
  .stats-grid { grid-template-columns:1fr; }
  .hero-actions { flex-direction:column; }
  .hero-actions .btn { width:100%; }
  .meta-line { gap:7px; font-size:.79rem; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-copy { grid-column:auto; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}

/* ===== CINZO immersive home redesign ===== */
.site-header.home-header {
  background: linear-gradient(to bottom, rgba(4,6,9,.68), transparent);
  border-bottom-color: transparent;
  backdrop-filter: none;
}
.site-header.home-header.scrolled {
  background: rgba(7,8,11,.9);
  border-bottom-color: rgba(255,255,255,.06);
  backdrop-filter: blur(22px) saturate(130%);
}
.home-page { overflow: hidden; }

.cinematic-hero {
  position: relative;
  min-height: 100vh;
  padding: 94px 4.5vw 64px;
  display: grid;
  place-items: center;
  isolation: isolate;
  background: #090b0e;
}
.hero-ambient {
  position: absolute;
  inset: -50px;
  z-index: -3;
  background-position: center;
  background-size: cover;
  filter: blur(38px) saturate(.78) brightness(.48);
  transform: scale(1.12);
  opacity: .82;
}
.cinematic-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    radial-gradient(circle at 50% 42%, transparent 0 28%, rgba(3,5,7,.42) 78%),
    linear-gradient(to bottom, rgba(5,7,9,.05), #090b0e 98%);
}
.cinema-frame {
  position: relative;
  width: min(1420px, 100%);
  min-height: min(720px, calc(100vh - 145px));
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 8px;
  background: #15191e;
  box-shadow: 0 40px 110px rgba(0,0,0,.54), inset 0 1px 0 rgba(255,255,255,.1);
}
.cinema-backdrop {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  filter: saturate(.74) contrast(1.08);
  transform: scale(1.035);
  animation: cinemaDrift 18s ease-in-out infinite alternate;
}
.cinema-character {
  position: absolute;
  z-index: 1;
  top: -4%;
  left: 43%;
  width: min(44vw, 650px);
  height: 105%;
  object-fit: cover;
  object-position: center 20%;
  opacity: .92;
  filter: saturate(.75) contrast(1.06);
  -webkit-mask-image: linear-gradient(to bottom, #000 0 72%, transparent 98%), linear-gradient(to right, transparent, #000 18% 82%, transparent);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to bottom, #000 0 72%, transparent 98%), linear-gradient(to right, transparent, #000 18% 82%, transparent);
  mask-composite: intersect;
  mix-blend-mode: screen;
}
.cinema-vignette {
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    linear-gradient(90deg, rgba(8,11,14,.88) 0%, rgba(8,11,14,.5) 36%, rgba(8,11,14,.04) 68%, rgba(8,11,14,.36) 100%),
    linear-gradient(to top, rgba(6,8,10,.92) 0%, transparent 38%),
    radial-gradient(circle at 60% 46%, rgba(31,183,216,.18), transparent 35%);
  pointer-events: none;
}
.cinema-copy {
  position: relative;
  z-index: 4;
  width: min(520px, 47%);
  padding: 150px 0 170px 5.5%;
  direction: rtl;
  text-align: right;
}
.cinema-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: rgba(255,255,255,.72);
  font-size: .72rem;
  font-weight: 700;
}
.cinema-kicker i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ff1d2e;
  box-shadow: 0 0 16px rgba(51,217,255,.8);
}
.cinema-original {
  display: block;
  direction: ltr;
  width: max-content;
  margin: 18px 0 8px auto;
  color: #ff1d2e;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: 4px;
}
.cinema-copy h1 {
  margin: 0;
  max-width: 520px;
  font-size: clamp(3.1rem, 6.1vw, 6.7rem);
  line-height: .93;
  letter-spacing: -4px;
  text-shadow: 0 16px 45px rgba(0,0,0,.72);
}
.cinema-en-title {
  display: block;
  direction: ltr;
  width: max-content;
  margin: 12px 0 18px auto;
  color: rgba(255,255,255,.52);
  font-size: .74rem;
  letter-spacing: 3.8px;
  text-transform: uppercase;
}
.cinema-copy > p {
  margin: 0;
  color: rgba(245,248,250,.76);
  font-size: .93rem;
  line-height: 1.85;
  max-width: 470px;
  text-shadow: 0 4px 22px rgba(0,0,0,.9);
}
.cinema-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin: 17px 0 24px;
  color: rgba(255,255,255,.7);
  font-size: .77rem;
}
.cinema-meta span {
  padding: 5px 8px;
  border: 1px solid rgba(255,255,255,.15);
  background: rgba(0,0,0,.18);
  backdrop-filter: blur(8px);
}
.cinema-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.cinema-watch,
.cinema-info {
  min-height: 43px;
  padding: 0 17px;
  border-radius: 2px;
  border: 1px solid rgba(255,255,255,.22);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  cursor: pointer;
  font-weight: 800;
  font-size: .78rem;
  transition: .22s ease;
}
.cinema-watch {
  color: #031116;
  background: #ff1d2e;
  border-color: #ff1d2e;
  box-shadow: 0 10px 28px rgba(56,218,248,.2);
}
.cinema-info { color: white; background: rgba(0,0,0,.2); backdrop-filter: blur(12px); }
.cinema-watch:hover,
.cinema-info:hover { transform: translateY(-2px); filter: brightness(1.08); }
.cinema-bottom-rail {
  position: absolute;
  z-index: 5;
  inset: auto 4.5% 28px;
  display: grid;
  grid-template-columns: 1fr minmax(230px, .65fr) 1fr;
  align-items: end;
  gap: 28px;
  direction: ltr;
}
.rail-title {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  direction: rtl;
  text-align: right;
  color: white;
}
.rail-title-end { justify-content: flex-end; }
.rail-title img {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid rgba(255,255,255,.25);
  box-shadow: 0 9px 24px rgba(0,0,0,.34);
}
.rail-title div { min-width: 0; }
.rail-title small { display: block; color: rgba(255,255,255,.46); font-size: .62rem; margin-bottom: 4px; }
.rail-title strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .92rem; }
.rail-title span { color: rgba(255,255,255,.58); font-size: .66rem; }
.rail-controller {
  display: grid;
  grid-template-columns: 35px 1fr 35px;
  align-items: center;
  gap: 10px;
  color: white;
  direction: ltr;
}
.rail-controller button {
  width: 35px;
  height: 35px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.28);
  background: rgba(255,255,255,.88);
  color: #111;
  display: grid;
  place-items: center;
}
.rail-controller button:last-child { transform: rotate(180deg); }
.rail-controller > span {
  height: 1px;
  background: rgba(255,255,255,.26);
  position: relative;
}
.rail-controller > span i { position: absolute; inset: 0 auto 0 0; width: 42%; background: #ff1d2e; }
.rail-controller small { grid-column: 2; text-align: center; color: rgba(255,255,255,.52); font-size: .58rem; letter-spacing: 1px; text-transform: uppercase; }
.hero-scroll-cue {
  position: absolute;
  z-index: 4;
  bottom: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  color: rgba(255,255,255,.48);
  font-size: .63rem;
  animation: scrollCue 2s ease-in-out infinite;
}
.hero-scroll-cue .icon { transform: rotate(-90deg); width: 17px; height: 17px; }

.home-library {
  position: relative;
  padding: 82px 4.5vw 95px;
  background:
    radial-gradient(circle at 12% 8%, rgba(45,91,88,.14), transparent 28%),
    radial-gradient(circle at 90% 65%, rgba(125,50,67,.1), transparent 30%),
    #0b0e10;
}
.library-shell {
  width: min(1450px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 116px minmax(0,1fr);
  min-height: 760px;
  overflow: hidden;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(27,32,32,.88);
  box-shadow: 0 45px 120px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter: blur(28px);
  direction: ltr;
}
.library-sidebar {
  position: relative;
  padding: 24px 14px;
  background: linear-gradient(to bottom, rgba(19,23,23,.98), rgba(14,17,18,.93));
  border-right: 1px solid rgba(255,255,255,.07);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}
.library-mini-logo .brand-mark { width: 46px; height: 46px; border-radius: 15px; display: block; }
.library-nav { display: flex; flex-direction: column; width: 100%; gap: 8px; }
.library-nav a,
.library-nav button {
  width: 100%;
  min-height: 58px;
  padding: 7px 4px;
  border: 0;
  border-radius: 15px;
  background: transparent;
  color: #777f7e;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  cursor: pointer;
  font-size: .59rem;
  transition: .2s ease;
}
.library-nav a:hover,
.library-nav button:hover,
.library-nav .active { color: white; background: rgba(255,255,255,.07); }
.library-nav .active { box-shadow: inset 3px 0 0 #e23b4d; }
.library-nav .icon { width: 20px; height: 20px; }
.library-trailers {
  width: 100%;
  margin-top: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
}
.library-trailers > span { color: rgba(255,255,255,.4); font-size: .55rem; text-align: center; }
.library-trailers a { position: relative; width: 68px; height: 86px; border-radius: 12px; overflow: hidden; border: 1px solid rgba(255,255,255,.08); }
.library-trailers img { width: 100%; height: 100%; object-fit: cover; }
.library-trailers i { position: absolute; right: 5px; bottom: 5px; width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.88); color: #111; }
.library-trailers i .icon { width: 11px; height: 11px; }
.library-main {
  min-width: 0;
  padding: 24px 26px 38px;
  direction: rtl;
  background:
    linear-gradient(135deg, rgba(255,255,255,.02), transparent 42%),
    rgba(33,39,38,.7);
}
.library-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  margin-bottom: 18px;
}
.library-search {
  width: min(420px, 48%);
  min-height: 42px;
  padding: 0 14px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.07);
  background: rgba(255,255,255,.055);
  color: rgba(255,255,255,.5);
  display: flex;
  align-items: center;
  gap: 9px;
  cursor: pointer;
  text-align: right;
}
.library-search span { flex: 1; }
.library-search kbd { direction: ltr; padding: 3px 7px; border: 1px solid rgba(255,255,255,.1); border-radius: 6px; background: rgba(0,0,0,.18); color: rgba(255,255,255,.42); font-size: .63rem; }
.library-profile {
  display: flex;
  align-items: center;
  gap: 9px;
  direction: rtl;
}
.library-profile > span {
  width: 37px;
  height: 37px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #d9384f, #7b0009);
  font-weight: 900;
}
.library-profile div { min-width: 0; }
.library-profile strong,
.library-profile small { display: block; white-space: nowrap; }
.library-profile strong { font-size: .72rem; }
.library-profile small { color: rgba(255,255,255,.42); margin-top: 3px; font-size: .59rem; }
.library-profile > .icon { width: 14px; height: 14px; color: rgba(255,255,255,.35); transform: rotate(180deg); }
.library-spotlight {
  position: relative;
  min-height: 260px;
  display: flex;
  align-items: center;
  overflow: hidden;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.1);
  background: #161c1b;
  box-shadow: 0 20px 45px rgba(0,0,0,.25);
}
.library-spotlight-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center 30%;
  filter: saturate(.74) contrast(1.05);
  transition: transform .7s ease;
}
.library-spotlight:hover .library-spotlight-bg { transform: scale(1.035); }
.library-spotlight::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(12,15,15,.12), rgba(12,15,15,.85) 70%);
}
.library-spotlight-copy {
  position: relative;
  z-index: 2;
  width: min(570px, 68%);
  padding: 30px 38px;
}
.library-spotlight-copy > span { color: #f31320; font-size: .67rem; font-weight: 900; }
.library-spotlight-copy h2 { margin: 8px 0 8px; font-size: clamp(2rem, 4vw, 3.4rem); letter-spacing: -2px; }
.library-spotlight-copy p { margin: 0 0 17px; color: rgba(255,255,255,.68); font-size: .77rem; line-height: 1.75; max-width: 480px; }
.library-spotlight-copy > div { display: flex; align-items: center; gap: 12px; }
.library-spotlight-copy strong { display: inline-flex; align-items: center; gap: 7px; color: #fff; font-size: .75rem; }
.library-spotlight-copy small { color: rgba(255,255,255,.42); font-size: .65rem; }
.spotlight-play {
  position: absolute;
  z-index: 3;
  left: 8%;
  width: 55px;
  height: 55px;
  border-radius: 50%;
  border: 0;
  display: grid;
  place-items: center;
  color: white;
  background: #e13e52;
  box-shadow: 0 15px 36px rgba(225,62,82,.35);
  cursor: pointer;
}
.library-section-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 16px;
  margin: 28px 0 13px;
}
.library-section-head h2 { margin: 0 0 4px; font-size: 1rem; }
.library-section-head p { margin: 0; color: rgba(255,255,255,.38); font-size: .65rem; }
.library-section-head a { display: inline-flex; align-items: center; gap: 5px; color: rgba(255,255,255,.45); font-size: .65rem; }
.library-section-head a .icon { width: 14px; height: 14px; }
.dashboard-poster-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: 13px;
}
.dashboard-poster-card {
  position: relative;
  min-width: 0;
  aspect-ratio: 1.58 / 1;
  border-radius: 13px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  background: #131817;
  transition: .26s ease;
}
.dashboard-poster-card:hover { transform: translateY(-5px); border-color: rgba(255,255,255,.2); box-shadow: 0 14px 30px rgba(0,0,0,.3); }
.dashboard-poster-card::after { content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(6,8,8,.92), transparent 62%); }
.dashboard-poster-card img { width:100%; height:100%; object-fit:cover; transition:.45s ease; }
.dashboard-poster-card:hover img { transform:scale(1.06); }
.dashboard-card-copy { position:absolute; z-index:2; right:10px; bottom:9px; left:10px; }
.dashboard-card-copy h3 { margin:0 0 3px; font-size:.72rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dashboard-card-copy p { margin:0; color:rgba(255,255,255,.52); font-size:.55rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dashboard-card-play { position:absolute; z-index:3; left:8px; bottom:8px; width:25px; height:25px; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.92); color:#111; }
.dashboard-card-play .icon { width:12px; height:12px; }
.continue-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; }
.continue-card {
  position:relative;
  overflow:hidden;
  aspect-ratio:1.75/1;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:#131817;
  transition:.25s ease;
}
.continue-card:hover { transform:translateY(-4px); }
.continue-card::after { content:""; position:absolute; inset:0; background:linear-gradient(to top,rgba(5,7,7,.9),transparent 66%); }
.continue-card img { width:100%; height:100%; object-fit:cover; }
.continue-copy { position:absolute; z-index:2; right:10px; bottom:10px; }
.continue-copy h3 { margin:0 0 3px; font-size:.72rem; }
.continue-copy p { margin:0; color:rgba(255,255,255,.48); font-size:.55rem; }
.continue-play { position:absolute; z-index:3; inset:50% 50% auto auto; transform:translate(50%,-50%); width:33px; height:33px; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.9); color:#111; opacity:0; transition:.2s; }
.continue-card:hover .continue-play { opacity:1; }
.continue-progress { position:absolute; z-index:4; right:0; left:0; bottom:0; height:3px; background:rgba(255,255,255,.16); }
.continue-progress i { display:block; height:100%; background:#e34254; }
.dashboard-wide-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; }
.dashboard-wide-card {
  position:relative;
  overflow:hidden;
  aspect-ratio:1.9/1;
  border-radius:13px;
  border:1px solid rgba(255,255,255,.08);
  background:#131817;
  transition:.25s ease;
}
.dashboard-wide-card:hover { transform:translateY(-4px); border-color:rgba(255,255,255,.18); }
.dashboard-wide-card::after { content:""; position:absolute; inset:0; background:linear-gradient(to top,rgba(6,8,8,.9),transparent 68%); }
.dashboard-wide-card img { width:100%; height:100%; object-fit:cover; transition:.45s; }
.dashboard-wide-card:hover img { transform:scale(1.05); }
.dashboard-wide-copy { position:absolute; z-index:2; right:11px; bottom:10px; }
.dashboard-wide-copy h3 { margin:0 0 3px; font-size:.78rem; }
.dashboard-wide-copy p { margin:0; color:rgba(255,255,255,.5); font-size:.57rem; }
.dashboard-wide-type { position:absolute; z-index:3; top:8px; right:8px; padding:4px 7px; border-radius:6px; background:rgba(0,0,0,.55); color:#fff; font-size:.53rem; backdrop-filter:blur(8px); }

@keyframes cinemaDrift { from { transform:scale(1.035) translate3d(0,0,0); } to { transform:scale(1.08) translate3d(-1%,.7%,0); } }
@keyframes scrollCue { 50% { transform:translateY(5px); opacity:.75; } }

@media (max-width: 1180px) {
  .cinema-character { left:39%; width:52vw; }
  .cinema-copy { width:55%; }
  .cinema-bottom-rail { grid-template-columns:1fr 220px 1fr; }
  .library-shell { grid-template-columns:96px minmax(0,1fr); }
  .dashboard-poster-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .dashboard-poster-card:nth-child(5) { display:none; }
}
@media (max-width: 900px) {
  .cinematic-hero { padding:76px 15px 54px; }
  .cinema-frame { min-height:720px; border-radius:18px; }
  .cinema-character { left:20%; top:0; width:80%; height:70%; opacity:.68; }
  .cinema-vignette { background:linear-gradient(to top,rgba(7,9,11,.98) 8%,rgba(7,9,11,.5) 62%,rgba(7,9,11,.08)),linear-gradient(90deg,rgba(7,9,11,.45),transparent); }
  .cinema-copy { position:absolute; inset:auto 24px 125px; width:auto; padding:0; }
  .cinema-copy h1 { font-size:clamp(3.2rem,12vw,5.3rem); }
  .cinema-copy > p { max-width:580px; }
  .cinema-bottom-rail { inset:auto 24px 25px; grid-template-columns:1fr; }
  .rail-title { display:none; }
  .rail-controller { max-width:320px; margin:auto; width:100%; }
  .home-library { padding:55px 15px 80px; }
  .library-shell { grid-template-columns:78px minmax(0,1fr); border-radius:22px; }
  .library-sidebar { padding:18px 9px; }
  .library-nav a,.library-nav button { min-height:54px; }
  .library-trailers { display:none; }
  .library-main { padding:18px; }
  .library-profile div,.library-profile > .icon { display:none; }
  .library-search { width:70%; }
  .dashboard-poster-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .dashboard-poster-card:nth-child(4),.dashboard-poster-card:nth-child(5){display:none;}
  .continue-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dashboard-wide-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 680px) {
  .site-header.home-header .brand-copy { display:none; }
  .cinematic-hero { min-height:760px; padding:70px 10px 50px; }
  .cinema-frame { min-height:680px; }
  .cinema-character { left:0; width:100%; height:65%; }
  .cinema-copy { inset:auto 18px 108px; }
  .cinema-kicker { max-width:90%; line-height:1.5; }
  .cinema-original { letter-spacing:2.5px; }
  .cinema-copy h1 { letter-spacing:-2px; }
  .cinema-copy > p { font-size:.82rem; line-height:1.7; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
  .cinema-meta { margin:12px 0 17px; }
  .cinema-actions { flex-direction:row; }
  .cinema-watch,.cinema-info { flex:1; }
  .cinema-bottom-rail { bottom:18px; }
  .hero-scroll-cue { display:none; }
  .home-library { padding:36px 10px 68px; }
  .library-shell { display:block; border-radius:18px; }
  .library-sidebar { display:none; }
  .library-main { padding:14px; }
  .library-toolbar { margin-bottom:13px; }
  .library-search { width:calc(100% - 48px); }
  .library-search kbd { display:none; }
  .library-profile > span { width:38px; height:38px; }
  .library-spotlight { min-height:230px; }
  .library-spotlight::after { background:linear-gradient(to top,rgba(11,14,14,.94),rgba(11,14,14,.25)); }
  .library-spotlight-copy { width:100%; padding:85px 18px 20px; align-self:flex-end; }
  .library-spotlight-copy p { display:none; }
  .library-spotlight-copy h2 { font-size:2.2rem; }
  .spotlight-play { left:18px; top:18px; width:45px; height:45px; }
  .library-section-head { margin-top:23px; }
  .dashboard-poster-grid { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:7px; }
  .dashboard-poster-card,.dashboard-poster-card:nth-child(4),.dashboard-poster-card:nth-child(5) { display:block; flex:0 0 72%; scroll-snap-align:start; }
  .continue-grid { display:flex; overflow-x:auto; padding-bottom:7px; }
  .continue-card { flex:0 0 82%; }
  .dashboard-wide-grid { grid-template-columns:1fr; }
  .dashboard-wide-card:nth-child(n+5) { display:none; }
}
@media (max-width: 420px) {
  .cinematic-hero { min-height:720px; }
  .cinema-frame { min-height:650px; }
  .cinema-copy { bottom:96px; }
  .cinema-copy h1 { font-size:2.85rem; }
  .cinema-en-title { letter-spacing:2px; }
  .cinema-meta span:last-child { display:none; }
  .cinema-watch,.cinema-info { min-height:41px; padding:0 10px; }
  .dashboard-poster-card { flex-basis:82%; }
}
.spotlight-details { display:inline-flex; align-items:center; gap:7px; color:#fff; font-size:.75rem; font-weight:800; }
.spotlight-details:hover { color:#f31320; }
.spotlight-details .icon { width:16px; height:16px; }

/* ===== CINZO V3 — cinematic landing + streaming hub ===== */
.home-page-v2 { overflow:hidden; background:#07090b; }
.hero-stage-v2 {
  position:relative;
  min-height:100svh;
  padding:96px 3.2vw 55px;
  display:grid;
  place-items:center;
  isolation:isolate;
  overflow:hidden;
  background:#080a0d;
}
.hero-stage-bg,.hero-stage-video,.hero-stage-wash,.hero-stage-grid { position:absolute; inset:0; }
.hero-stage-bg { z-index:-5; background-size:cover; background-position:center; transform:scale(1.035); filter:saturate(.76) contrast(1.08); animation:heroV3Drift 17s ease-in-out infinite alternate; }
.hero-stage-video { z-index:-4; width:100%; height:100%; object-fit:cover; opacity:.34; filter:saturate(.75) contrast(1.08); }
.hero-stage-wash { z-index:-3; background:
  linear-gradient(90deg,rgba(4,7,10,.96) 0%,rgba(4,7,10,.72) 35%,rgba(4,7,10,.08) 68%,rgba(4,7,10,.65) 100%),
  linear-gradient(to top,rgba(5,8,10,.98) 0%,rgba(5,8,10,.18) 48%,rgba(5,8,10,.34) 100%),
  radial-gradient(circle at 63% 43%,rgba(32,198,231,.17),transparent 34%); }
.hero-stage-grid { z-index:-2; opacity:.11; background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px); background-size:85px 85px; mask-image:linear-gradient(to bottom,transparent,#000 35%,transparent); }
.hero-stage-inner {
  position:relative;
  width:min(1540px,100%);
  min-height:min(800px,calc(100svh - 150px));
  border:1px solid rgba(255,255,255,.13);
  background:rgba(5,8,11,.08);
  box-shadow:0 45px 140px rgba(0,0,0,.54),inset 0 1px 0 rgba(255,255,255,.08);
  overflow:hidden;
}
.hero-stage-inner::before { content:""; position:absolute; inset:0; border:1px solid rgba(255,255,255,.035); margin:12px; pointer-events:none; }
.hero-stage-topline { position:absolute; z-index:6; top:30px; right:42px; left:42px; display:flex; align-items:center; justify-content:space-between; gap:20px; color:rgba(255,255,255,.55); font-size:.68rem; }
.hero-stage-topline > span { display:flex; align-items:center; gap:8px; }
.hero-stage-topline > span::before { content:""; width:6px; height:6px; border-radius:50%; background:#ff1d2e; box-shadow:0 0 15px #ff1d2e; }
.hero-stage-topline > div { display:flex; gap:7px; direction:ltr; }
.hero-stage-topline button { width:24px; height:3px; border:0; padding:0; background:rgba(255,255,255,.25); cursor:pointer; transition:.25s; }
.hero-stage-topline button.active { width:48px; background:#ff1d2e; }
.hero-stage-copy { position:absolute; z-index:5; top:50%; right:6%; width:min(590px,43%); transform:translateY(-50%); text-align:right; }
.hero-stage-original { display:block; width:max-content; margin:0 0 14px auto; direction:ltr; color:#fff; letter-spacing:4px; font-size:.72rem; font-weight:900; }
.hero-stage-original i { color:#ff1d2e; font-style:normal; }
.hero-stage-copy h1 { margin:0; max-width:620px; font-size:clamp(4rem,7vw,8rem); line-height:.88; letter-spacing:-6px; text-shadow:0 16px 48px rgba(0,0,0,.78); }
.hero-stage-copy > strong { display:block; direction:ltr; width:max-content; margin:13px 0 20px auto; color:rgba(255,255,255,.55); letter-spacing:5px; text-transform:uppercase; font-size:.78rem; }
.hero-stage-meta { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:0 0 18px; color:rgba(255,255,255,.65); font-size:.73rem; }
.hero-stage-meta b { color:#ff1d2e; }
.hero-stage-meta span { padding:5px 8px; border:1px solid rgba(255,255,255,.16); background:rgba(0,0,0,.18); backdrop-filter:blur(10px); }
.hero-stage-copy > p { max-width:540px; margin:0 0 25px; color:rgba(255,255,255,.76); font-size:.94rem; line-height:1.9; text-shadow:0 5px 20px rgba(0,0,0,.9); }
.hero-stage-actions { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
.hero-primary,.hero-secondary,.hero-sound { min-height:46px; border:1px solid rgba(255,255,255,.2); display:inline-flex; align-items:center; justify-content:center; gap:8px; cursor:pointer; transition:.22s ease; }
.hero-primary { padding:0 20px; color:#061014; background:#ff1d2e; border-color:#ff1d2e; font-weight:900; box-shadow:0 12px 32px rgba(44,218,250,.22); }
.hero-secondary { padding:0 18px; color:#fff; background:rgba(0,0,0,.24); backdrop-filter:blur(14px); font-weight:800; }
.hero-sound { width:46px; padding:0; border-radius:50%; color:#fff; background:rgba(0,0,0,.28); backdrop-filter:blur(14px); }
.hero-primary:hover,.hero-secondary:hover,.hero-sound:hover { transform:translateY(-3px); filter:brightness(1.08); }
.hero-stage-poster { position:absolute; z-index:2; top:3%; bottom:0; left:38%; width:40%; display:flex; align-items:flex-start; justify-content:center; pointer-events:none; }
.hero-stage-poster img { width:100%; height:100%; object-fit:cover; object-position:center 20%; filter:saturate(.75) contrast(1.08); opacity:.75; mix-blend-mode:screen; mask-image:linear-gradient(to bottom,#000 0 68%,transparent 96%),linear-gradient(90deg,transparent,#000 20% 80%,transparent); mask-composite:intersect; }
.hero-stage-poster span { position:absolute; left:50%; bottom:14%; width:60%; height:20%; transform:translateX(-50%); background:rgba(34,210,242,.18); filter:blur(55px); border-radius:50%; }
.hero-stage-switcher { position:absolute; z-index:7; right:4%; left:4%; bottom:28px; display:grid; grid-template-columns:1fr minmax(280px,.75fr) 1fr; align-items:end; gap:28px; direction:ltr; }
.hero-switch-item { border:0; padding:0; background:transparent; color:#fff; display:flex; align-items:center; gap:12px; direction:rtl; text-align:right; cursor:pointer; opacity:.68; transition:.2s; }
.hero-switch-item:hover { opacity:1; transform:translateY(-2px); }
.hero-switch-item.end { justify-content:flex-end; }
.hero-switch-item img { width:62px; height:62px; border-radius:50%; object-fit:cover; border:2px solid rgba(255,255,255,.23); }
.hero-switch-item small,.hero-switch-item em { display:block; color:rgba(255,255,255,.43); font-size:.59rem; font-style:normal; }
.hero-switch-item strong { display:block; margin:3px 0; font-size:.84rem; }
.hero-switch-control { display:grid; grid-template-columns:36px 1fr auto 36px; gap:10px; align-items:center; color:#fff; }
.hero-switch-control button { width:36px; height:36px; border-radius:50%; border:1px solid rgba(255,255,255,.25); background:rgba(255,255,255,.91); color:#111; display:grid; place-items:center; cursor:pointer; }
.hero-switch-control button:last-child { transform:rotate(180deg); }
.hero-switch-control > span { position:relative; height:1px; background:rgba(255,255,255,.25); }
.hero-switch-control > span i { position:absolute; inset:0 auto 0 0; background:#ff1d2e; transition:.4s; }
.hero-switch-control small { color:rgba(255,255,255,.48); font-size:.59rem; direction:ltr; }
.hero-stage-scroll { position:absolute; z-index:8; bottom:10px; display:flex; flex-direction:column; align-items:center; gap:5px; color:rgba(255,255,255,.45); font-size:.59rem; }
.hero-stage-scroll span { width:1px; height:28px; background:linear-gradient(to bottom,#ff1d2e,transparent); animation:heroScroll 1.9s ease-in-out infinite; }

.watch-hub { width:min(1560px,calc(100% - 5vw)); margin:0 auto; padding:92px 0 105px; display:grid; grid-template-columns:112px minmax(0,1fr); direction:ltr; }
.watch-hub-sidebar { position:sticky; top:92px; align-self:start; height:calc(100svh - 115px); min-height:690px; padding:22px 13px; border:1px solid rgba(255,255,255,.1); border-right:0; border-radius:28px 0 0 28px; background:linear-gradient(180deg,rgba(27,31,34,.96),rgba(13,16,18,.92)); backdrop-filter:blur(28px); display:flex; flex-direction:column; align-items:center; z-index:4; box-shadow:-18px 28px 70px rgba(0,0,0,.22); }
.watch-hub-logo .brand-copy { display:none; }
.watch-hub-logo .brand-mark { width:48px; height:48px; border-radius:16px; }
.watch-hub-sidebar nav { width:100%; margin-top:25px; display:flex; flex-direction:column; gap:7px; }
.watch-hub-sidebar nav a,.watch-hub-sidebar nav button { width:100%; min-height:61px; border:0; border-radius:16px; background:transparent; color:#747c80; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; cursor:pointer; font-size:.57rem; transition:.2s; }
.watch-hub-sidebar nav a:hover,.watch-hub-sidebar nav button:hover,.watch-hub-sidebar nav a.active { color:#fff; background:rgba(255,255,255,.075); }
.watch-hub-sidebar nav a.active { box-shadow:inset 3px 0 0 #e50914; }
.watch-hub-sidebar .icon { width:19px; height:19px; }
.watch-hub-mini-list { margin-top:auto; width:100%; display:grid; gap:9px; }
.watch-hub-mini-list > span { color:rgba(255,255,255,.38); font-size:.56rem; text-align:center; }
.watch-hub-mini-list a { position:relative; display:block; overflow:hidden; aspect-ratio:1.45/1; border-radius:11px; border:1px solid rgba(255,255,255,.08); }
.watch-hub-mini-list img { width:100%; height:100%; object-fit:cover; }
.watch-hub-mini-list i { position:absolute; inset:50% auto auto 50%; transform:translate(-50%,-50%); width:25px; height:25px; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.88); color:#111; }
.watch-hub-main { min-width:0; padding:24px 28px 42px; border:1px solid rgba(255,255,255,.1); border-radius:0 28px 28px 0; background:linear-gradient(160deg,rgba(35,39,40,.88),rgba(15,18,20,.93)); backdrop-filter:blur(30px); direction:rtl; overflow:hidden; box-shadow:28px 35px 110px rgba(0,0,0,.34); }
.watch-hub-toolbar { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:22px; }
.watch-hub-toolbar > button { width:min(520px,52%); min-height:45px; padding:0 16px; border:1px solid rgba(255,255,255,.08); border-radius:13px; background:rgba(6,8,10,.45); color:rgba(255,255,255,.42); display:flex; align-items:center; gap:10px; cursor:text; text-align:right; }
.watch-hub-toolbar > button span { flex:1; }
.watch-hub-toolbar kbd { padding:4px 7px; border:1px solid rgba(255,255,255,.1); border-radius:6px; color:rgba(255,255,255,.35); background:rgba(255,255,255,.04); direction:ltr; }
.watch-hub-quick { display:flex; align-items:center; gap:10px; }
.watch-hub-quick > a:first-child { min-height:40px; padding:0 13px; border-radius:11px; display:flex; align-items:center; gap:7px; background:rgba(255,255,255,.055); color:rgba(255,255,255,.72); font-size:.68rem; }
.watch-hub-user { display:flex; align-items:center; gap:9px; direction:rtl; }
.watch-hub-user > i { width:41px; height:41px; border-radius:50%; display:grid; place-items:center; color:#fff; background:linear-gradient(135deg,#e50914,#770008); font-style:normal; font-weight:900; }
.watch-hub-user strong,.watch-hub-user small { display:block; }
.watch-hub-user strong { font-size:.7rem; }
.watch-hub-user small { margin-top:3px; color:rgba(255,255,255,.38); font-size:.56rem; }
.hub-feature { position:relative; min-height:330px; overflow:hidden; border-radius:20px; border:1px solid rgba(255,255,255,.09); background:#101416; isolation:isolate; }
.hub-feature > img,.hub-feature .card-preview-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hub-feature > img { z-index:-3; }
.hub-feature .card-preview-video { z-index:-2; opacity:.68; }
.hub-feature-overlay { position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(10,13,15,.08),rgba(10,13,15,.88) 68%),linear-gradient(to top,rgba(10,13,15,.86),transparent 60%); }
.hub-feature-copy { width:min(610px,64%); padding:45px 42px; }
.hub-feature-copy > span { color:#e50914; font-size:.65rem; font-weight:900; }
.hub-feature-copy h2 { margin:7px 0 10px; font-size:clamp(2.6rem,5vw,5rem); line-height:.92; letter-spacing:-4px; }
.hub-feature-copy p { margin:0 0 22px; max-width:530px; color:rgba(255,255,255,.68); font-size:.79rem; line-height:1.8; }
.hub-feature-copy > div { display:flex; gap:8px; }
.hub-feature-copy button,.hub-feature-copy a { min-height:39px; padding:0 14px; border:1px solid rgba(255,255,255,.17); display:inline-flex; align-items:center; gap:7px; font-size:.68rem; font-weight:800; }
.hub-feature-copy button { border-color:#e50914; background:#e50914; color:#fff; cursor:pointer; }
.hub-feature-copy a { background:rgba(0,0,0,.2); backdrop-filter:blur(10px); }
.hub-feature-stats { position:absolute; left:20px; bottom:18px; display:flex; gap:7px; direction:ltr; }
.hub-feature-stats span { min-width:82px; padding:9px 10px; border:1px solid rgba(255,255,255,.11); border-radius:10px; background:rgba(5,7,9,.46); backdrop-filter:blur(12px); color:rgba(255,255,255,.43); font-size:.52rem; text-align:center; }
.hub-feature-stats b { display:block; color:#fff; font-size:.75rem; margin-bottom:2px; }
.hub-chips { display:flex; gap:8px; overflow-x:auto; padding:17px 0 0; scrollbar-width:none; }
.hub-chips::-webkit-scrollbar { display:none; }
.hub-chips a { flex:0 0 auto; min-height:32px; padding:0 13px; border-radius:999px; border:1px solid rgba(255,255,255,.08); display:flex; align-items:center; color:rgba(255,255,255,.45); font-size:.61rem; }
.hub-chips a:hover,.hub-chips a.active { background:#fff; color:#151719; border-color:#fff; }
.stream-section { margin-top:34px; }
.stream-section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:14px; }
.stream-section-head > div:first-child > span { color:#e50914; font-size:.55rem; font-weight:900; letter-spacing:1.8px; direction:ltr; display:block; }
.stream-section-head h2 { margin:3px 0 3px; font-size:1.17rem; }
.stream-section-head p { margin:0; color:rgba(255,255,255,.34); font-size:.59rem; }
.stream-section-tools { display:flex; align-items:center; gap:6px; }
.stream-section-tools > a { margin-left:5px; display:flex; align-items:center; gap:5px; color:rgba(255,255,255,.4); font-size:.59rem; }
.stream-section-tools button { width:31px; height:31px; border-radius:50%; border:1px solid rgba(255,255,255,.1); background:rgba(255,255,255,.04); display:grid; place-items:center; cursor:pointer; color:rgba(255,255,255,.65); }
.stream-section-tools button:first-of-type { transform:rotate(180deg); }
.stream-section-tools button:hover { background:rgba(255,255,255,.1); color:#fff; }
.stream-row,.continue-row-v2 { display:flex; gap:13px; overflow-x:auto; overflow-y:hidden; padding:5px 3px 15px; scroll-snap-type:x proximity; scrollbar-width:none; scroll-behavior:smooth; direction:rtl; }
.stream-row::-webkit-scrollbar,.continue-row-v2::-webkit-scrollbar { display:none; }
.stream-card { position:relative; flex:0 0 clamp(225px,19vw,290px); min-width:0; scroll-snap-align:start; transition:.25s ease; z-index:1; }
.stream-card.vertical { flex-basis:clamp(165px,14vw,215px); }
.stream-card.ranked { padding-right:38px; }
.stream-card:hover { transform:translateY(-6px) scale(1.025); z-index:5; }
.stream-card-media { position:relative; display:block; overflow:hidden; aspect-ratio:1.72/1; border-radius:13px; border:1px solid rgba(255,255,255,.09); background:#121618; box-shadow:0 12px 28px rgba(0,0,0,.2); }
.stream-card.vertical .stream-card-media { aspect-ratio:2/3; }
.stream-card-media > img,.stream-card-media > video { width:100%; height:100%; object-fit:cover; }
.card-preview-video { position:absolute; inset:0; z-index:1; width:100%; height:100%; object-fit:cover; animation:previewFade .35s ease both; }
.stream-card-shade { position:absolute; inset:0; z-index:2; background:linear-gradient(to top,rgba(5,7,9,.95),transparent 65%); opacity:.52; }
.stream-card-play { position:absolute; z-index:4; inset:50% auto auto 50%; transform:translate(-50%,-45%); width:39px; height:39px; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.92); color:#101214; opacity:0; transition:.22s; }
.stream-card:hover .stream-card-play { opacity:1; transform:translate(-50%,-50%); }
.stream-card-tag { position:absolute; z-index:4; top:8px; right:8px; padding:4px 7px; border-radius:6px; background:rgba(0,0,0,.55); backdrop-filter:blur(8px); color:#fff; font-size:.5rem; }
.stream-card-body { position:relative; padding:8px 3px 0; }
.stream-card-body h3 { margin:0 0 4px; font-size:.75rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.stream-card-body > div:not(.stream-card-actions) { display:flex; align-items:center; gap:6px; color:rgba(255,255,255,.4); font-size:.53rem; white-space:nowrap; overflow:hidden; }
.stream-card-body > div i { width:3px; height:3px; border-radius:50%; background:#e50914; }
.stream-card-actions { position:absolute; left:2px; top:5px; display:flex; gap:5px; opacity:0; transform:translateY(4px); transition:.2s; }
.stream-card:hover .stream-card-actions { opacity:1; transform:none; }
.stream-card-actions button,.stream-card-actions a { width:27px; height:27px; border-radius:50%; border:1px solid rgba(255,255,255,.1); background:#fff; color:#111; display:grid; place-items:center; cursor:pointer; }
.stream-card-actions a { background:rgba(255,255,255,.1); color:#fff; backdrop-filter:blur(8px); }
.stream-card-actions .icon { width:13px; height:13px; }
.stream-rank { position:absolute; z-index:-1; right:-3px; bottom:17px; color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.27); font-size:4.3rem; line-height:1; font-weight:950; letter-spacing:-8px; }
.continue-card-v2 { position:relative; flex:0 0 clamp(290px,25vw,390px); aspect-ratio:1.78/1; overflow:hidden; border-radius:13px; border:1px solid rgba(255,255,255,.09); background:#121618; scroll-snap-align:start; transition:.24s; }
.continue-card-v2:hover { transform:translateY(-5px); }
.continue-card-v2 img { width:100%; height:100%; object-fit:cover; transition:.4s; }
.continue-card-v2:hover img { transform:scale(1.05); }
.continue-card-v2-shade { position:absolute; inset:0; background:linear-gradient(to top,rgba(4,6,8,.95),transparent 68%); }
.continue-card-v2-copy { position:absolute; z-index:3; right:12px; bottom:13px; }
.continue-card-v2-copy h3 { margin:0 0 4px; font-size:.77rem; }
.continue-card-v2-copy p { margin:0; color:rgba(255,255,255,.43); font-size:.53rem; }
.continue-card-v2-play { position:absolute; z-index:4; inset:50% auto auto 50%; transform:translate(-50%,-50%); width:38px; height:38px; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.92); color:#111; opacity:0; transition:.2s; }
.continue-card-v2:hover .continue-card-v2-play { opacity:1; }
.continue-card-v2-progress { position:absolute; z-index:5; right:0; left:0; bottom:0; height:3px; background:rgba(255,255,255,.14); }
.continue-card-v2-progress i { display:block; height:100%; background:#e50914; }
.stream-footer { width:min(1500px,calc(100% - 48px)); margin:0 auto; padding:34px 0 42px; border-top:1px solid rgba(255,255,255,.07); display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:30px; color:rgba(255,255,255,.42); }
.stream-footer > div p { max-width:520px; margin:10px 0 0; font-size:.65rem; line-height:1.7; }
.stream-footer nav { display:flex; flex-wrap:wrap; gap:17px; font-size:.62rem; }
.stream-footer small { font-size:.57rem; direction:ltr; }

@keyframes heroV3Drift { from { transform:scale(1.035) translate3d(0,0,0); } to { transform:scale(1.09) translate3d(-1.2%,.6%,0); } }
@keyframes heroScroll { 50% { transform:scaleY(.55); opacity:.55; } }
@keyframes previewFade { from { opacity:0; } to { opacity:1; } }

@media (max-width:1180px) {
  .hero-stage-copy { width:50%; right:5%; }
  .hero-stage-poster { left:34%; width:48%; }
  .hero-stage-switcher { grid-template-columns:1fr 260px 1fr; }
  .watch-hub { grid-template-columns:94px minmax(0,1fr); }
  .watch-hub-sidebar { padding-inline:9px; }
  .stream-card { flex-basis:250px; }
}
@media (max-width:900px) {
  .hero-stage-v2 { padding:80px 14px 48px; }
  .hero-stage-inner { min-height:730px; border-radius:18px; }
  .hero-stage-poster { top:0; left:5%; width:90%; height:68%; opacity:.68; }
  .hero-stage-copy { top:auto; right:28px; left:28px; bottom:115px; width:auto; transform:none; }
  .hero-stage-copy h1 { font-size:clamp(3.6rem,13vw,6rem); letter-spacing:-4px; }
  .hero-stage-copy > p { max-width:650px; }
  .hero-stage-switcher { right:28px; left:28px; grid-template-columns:1fr; }
  .hero-switch-item { display:none; }
  .hero-switch-control { max-width:380px; margin:auto; width:100%; }
  .watch-hub { width:calc(100% - 28px); grid-template-columns:78px minmax(0,1fr); padding-top:60px; }
  .watch-hub-sidebar { min-height:640px; border-radius:22px 0 0 22px; }
  .watch-hub-main { padding:20px 18px 35px; border-radius:0 22px 22px 0; }
  .watch-hub-user span,.watch-hub-quick > a:first-child { display:none; }
  .watch-hub-toolbar > button { width:75%; }
  .hub-feature { min-height:300px; }
  .hub-feature-copy { width:76%; padding:36px 28px; }
  .hub-feature-stats span:nth-child(2) { display:none; }
}
@media (max-width:680px) {
  .site-header.home-header .desktop-nav { display:none; }
  .hero-stage-v2 { min-height:760px; padding:70px 8px 36px; }
  .hero-stage-inner { min-height:690px; }
  .hero-stage-topline { top:18px; right:18px; left:18px; }
  .hero-stage-topline > span { max-width:70%; line-height:1.5; }
  .hero-stage-copy { right:18px; left:18px; bottom:96px; }
  .hero-stage-copy h1 { font-size:3.25rem; letter-spacing:-2px; }
  .hero-stage-copy > strong { letter-spacing:2.5px; margin-bottom:12px; }
  .hero-stage-copy > p { font-size:.78rem; line-height:1.7; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
  .hero-stage-meta span:nth-last-child(-n+2) { display:none; }
  .hero-stage-actions { gap:7px; }
  .hero-primary,.hero-secondary { flex:1; padding-inline:10px; font-size:.68rem; }
  .hero-sound { width:43px; flex:0 0 43px; }
  .hero-stage-poster { left:0; width:100%; height:64%; }
  .hero-stage-switcher { bottom:17px; right:18px; left:18px; }
  .hero-stage-scroll { display:none; }
  .watch-hub { display:block; width:calc(100% - 16px); padding:40px 0 78px; }
  .watch-hub-sidebar { display:none; }
  .watch-hub-main { border-radius:20px; padding:13px 12px 28px; }
  .watch-hub-toolbar { margin-bottom:12px; }
  .watch-hub-toolbar > button { width:calc(100% - 50px); min-height:41px; }
  .watch-hub-toolbar kbd { display:none; }
  .watch-hub-quick > a:first-child { display:none; }
  .hub-feature { min-height:270px; border-radius:16px; }
  .hub-feature-overlay { background:linear-gradient(to top,rgba(8,11,13,.95),rgba(8,11,13,.12)); }
  .hub-feature-copy { width:100%; padding:96px 18px 20px; align-self:end; }
  .hub-feature-copy h2 { font-size:2.6rem; }
  .hub-feature-copy p { display:none; }
  .hub-feature-stats { display:none; }
  .hub-chips { padding-top:12px; }
  .stream-section { margin-top:26px; }
  .stream-section-head p { display:none; }
  .stream-section-tools button { display:none; }
  .stream-section-tools > a { margin:0; }
  .stream-card { flex-basis:78%; }
  .stream-card.vertical { flex-basis:50%; }
  .stream-card.ranked { padding-right:33px; }
  .continue-card-v2 { flex-basis:88%; }
  .stream-footer { width:calc(100% - 28px); grid-template-columns:1fr; gap:18px; padding-bottom:90px; }
}
@media (max-width:420px) {
  .hero-stage-copy { bottom:88px; }
  .hero-stage-copy h1 { font-size:2.8rem; }
  .hero-stage-copy > p { -webkit-line-clamp:2; }
  .hero-stage-original { letter-spacing:2px; }
  .hero-stage-topline > div button { width:15px; }
  .hero-stage-topline > div button.active { width:30px; }
  .stream-card { flex-basis:84%; }
  .stream-card.vertical { flex-basis:57%; }
}

/* ===== CINZO V4 — one full-screen streaming application ===== */
.home-page-v4 {
  min-height: 100vh;
  overflow: hidden;
  background: #07090b;
}
.watch-hub-full {
  width: 100%;
  min-height: 100svh;
  margin: 0;
  padding: 0;
  grid-template-columns: 104px minmax(0, 1fr);
  align-items: stretch;
}
.watch-hub-sidebar-full {
  position: sticky;
  top: 0;
  height: 100svh;
  min-height: 0;
  padding: 24px 11px 18px;
  border: 0;
  border-left: 1px solid rgba(255,255,255,.08);
  border-radius: 0;
  background: linear-gradient(180deg, rgba(19,23,25,.99), rgba(8,11,13,.98));
  box-shadow: 18px 0 65px rgba(0,0,0,.3);
}
.watch-hub-main-full {
  min-height: 100svh;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: #090c0e;
  box-shadow: none;
  overflow: visible;
}

.hub-cinematic-hero {
  position: relative;
  min-height: 100svh;
  overflow: hidden;
  isolation: isolate;
  background: #080b0e;
}
.hub-cinematic-bg,
.hub-cinematic-video,
.hub-cinematic-wash,
.hub-cinematic-grid {
  position: absolute;
  inset: 0;
}
.hub-cinematic-bg {
  z-index: -5;
  background-size: cover;
  background-position: center 28%;
  transform: scale(1.035);
  filter: saturate(.82) contrast(1.08);
  animation: heroV3Drift 18s ease-in-out infinite alternate;
}
.hub-cinematic-video {
  z-index: -4;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .32;
  filter: saturate(.8) contrast(1.08);
}
.hub-cinematic-wash {
  z-index: -3;
  background:
    linear-gradient(90deg, rgba(5,8,11,.94) 0%, rgba(5,8,11,.63) 36%, rgba(5,8,11,.04) 68%, rgba(5,8,11,.48) 100%),
    linear-gradient(to top, #090c0e 0%, rgba(7,10,12,.22) 35%, rgba(7,10,12,.42) 100%),
    radial-gradient(circle at 61% 42%, rgba(35,201,235,.18), transparent 32%);
}
.hub-cinematic-grid {
  z-index: -2;
  opacity: .09;
  background-image:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size: 88px 88px;
  mask-image: linear-gradient(to bottom, transparent, #000 25%, transparent 96%);
}
.hub-cinematic-nav {
  position: absolute;
  z-index: 12;
  top: 0;
  right: 0;
  left: 0;
  min-height: 84px;
  padding: 0 4vw;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 34px;
  background: linear-gradient(to bottom, rgba(5,8,11,.86), transparent);
}
.hub-cinematic-brand .brand-mark { width: 43px; height: 43px; }
.hub-cinematic-brand .brand-copy strong { font-size: .95rem; }
.hub-cinematic-nav > nav {
  display: flex;
  justify-content: center;
  gap: 7px;
}
.hub-cinematic-nav > nav a {
  padding: 10px 14px;
  border-radius: 11px;
  color: rgba(255,255,255,.65);
  font-size: .78rem;
  transition: .2s ease;
}
.hub-cinematic-nav > nav a:hover,
.hub-cinematic-nav > nav a.active {
  color: #fff;
  background: rgba(255,255,255,.075);
}
.hub-cinematic-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 9px;
}
.hub-cinematic-actions > button,
.hub-cinematic-avatar {
  width: 43px;
  height: 43px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.14);
  display: grid;
  place-items: center;
  color: #fff;
  background: rgba(4,7,9,.38);
  backdrop-filter: blur(14px);
  cursor: pointer;
}
.hub-cinematic-avatar {
  background: linear-gradient(135deg, #e50914, #770008);
  font-style: normal;
  font-weight: 900;
}
.hub-cinematic-login {
  min-height: 43px;
  padding: 0 15px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #fff;
  background: linear-gradient(135deg, #e50914, #770008);
  font-size: .72rem;
  font-weight: 900;
  box-shadow: 0 12px 30px rgba(116,72,233,.22);
}
.hub-cinematic-copy {
  position: absolute;
  z-index: 7;
  top: 48%;
  right: 6.2%;
  width: min(620px, 46%);
  transform: translateY(-50%);
  text-align: right;
}
.hub-cinematic-copy h1 {
  margin: 0;
  max-width: 680px;
  font-size: clamp(4.6rem, 7.4vw, 9rem);
  line-height: .86;
  letter-spacing: -7px;
  text-shadow: 0 18px 55px rgba(0,0,0,.82);
}
.hub-cinematic-copy > strong {
  display: block;
  direction: ltr;
  width: max-content;
  margin: 15px 0 20px auto;
  color: rgba(255,255,255,.54);
  letter-spacing: 5px;
  text-transform: uppercase;
  font-size: .78rem;
}
.hub-cinematic-copy > p {
  max-width: 560px;
  margin: 0 0 27px;
  color: rgba(255,255,255,.75);
  font-size: .92rem;
  line-height: 1.9;
  text-shadow: 0 5px 22px rgba(0,0,0,.92);
}
.hub-cinematic-poster {
  position: absolute;
  z-index: 2;
  top: 4%;
  bottom: 0;
  left: 32%;
  width: 46%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  pointer-events: none;
}
.hub-cinematic-poster img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 20%;
  filter: saturate(.78) contrast(1.09);
  opacity: .76;
  mix-blend-mode: screen;
  mask-image:
    linear-gradient(to bottom, #000 0 70%, transparent 97%),
    linear-gradient(90deg, transparent, #000 16% 83%, transparent);
  mask-composite: intersect;
}
.hub-cinematic-poster span {
  position: absolute;
  left: 50%;
  bottom: 15%;
  width: 62%;
  height: 18%;
  transform: translateX(-50%);
  border-radius: 50%;
  background: rgba(38,208,240,.18);
  filter: blur(60px);
}
.hub-cinematic-progress {
  position: absolute;
  z-index: 10;
  right: 5%;
  left: 5%;
  bottom: 34px;
  display: grid;
  grid-template-columns: 1fr minmax(300px,.7fr) 1fr;
  align-items: end;
  gap: 30px;
  direction: ltr;
}
.hub-cinematic-neighbor {
  border: 0;
  padding: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  color: #fff;
  background: transparent;
  direction: rtl;
  text-align: right;
  cursor: pointer;
  opacity: .62;
  transition: .2s ease;
}
.hub-cinematic-neighbor:hover { opacity: 1; transform: translateY(-2px); }
.hub-cinematic-neighbor.end { justify-content: flex-end; }
.hub-cinematic-neighbor img {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid rgba(255,255,255,.22);
}
.hub-cinematic-neighbor small { display: block; color: rgba(255,255,255,.42); font-size: .57rem; }
.hub-cinematic-neighbor strong { display: block; margin-top: 4px; font-size: .78rem; }
.hub-cinematic-dots {
  position: absolute;
  z-index: 12;
  top: 104px;
  left: 4vw;
  display: flex;
  gap: 7px;
  direction: ltr;
}
.hub-cinematic-dots button {
  width: 25px;
  height: 3px;
  padding: 0;
  border: 0;
  background: rgba(255,255,255,.25);
  cursor: pointer;
  transition: .25s ease;
}
.hub-cinematic-dots button.active { width: 52px; background: #ff1d2e; }
.hub-cinematic-scroll {
  position: absolute;
  z-index: 11;
  right: 50%;
  bottom: 8px;
  transform: translateX(50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  color: rgba(255,255,255,.42);
  font-size: .55rem;
}
.hub-cinematic-scroll span {
  width: 1px;
  height: 25px;
  background: linear-gradient(to bottom, #ff1d2e, transparent);
  animation: heroScroll 1.9s ease-in-out infinite;
}
.watch-content {
  padding: 24px 4vw 95px;
  background:
    radial-gradient(circle at 95% 0, rgba(239,64,87,.06), transparent 24%),
    #090c0e;
}
.watch-content .hub-chips { padding-top: 0; }
.watch-content .stream-section { margin-top: 46px; }
.watch-content .stream-section-head h2 { font-size: 1.35rem; }
.watch-content .stream-card { flex-basis: clamp(250px, 20vw, 340px); }
.watch-content .stream-card.vertical { flex-basis: clamp(180px, 14.5vw, 235px); }
.watch-content .continue-card-v2 { flex-basis: clamp(330px, 28vw, 470px); }

body:has(.home-page-v4) .stream-footer {
  width: calc(100% - 104px);
  margin: 0 0 0 auto;
  padding-inline: 4vw;
  background: #080a0c;
}
body:has(.home-page-v4) .search-popover { top: 24px; }

@media (max-width: 1180px) {
  .watch-hub-full { grid-template-columns: 86px minmax(0,1fr); }
  .watch-hub-sidebar-full { padding-inline: 8px; }
  .hub-cinematic-nav { padding-inline: 3vw; }
  .hub-cinematic-copy { right: 5%; width: 50%; }
  .hub-cinematic-poster { left: 27%; width: 52%; }
  .hub-cinematic-progress { grid-template-columns: 1fr 270px 1fr; }
  body:has(.home-page-v4) .stream-footer { width: calc(100% - 86px); }
}

@media (max-width: 900px) {
  .hub-cinematic-nav > nav { display: none; }
  .hub-cinematic-nav { grid-template-columns: 1fr auto; }
  .hub-cinematic-brand { display: block; }
  .hub-cinematic-poster { top: 0; left: 2%; width: 96%; height: 70%; opacity: .73; }
  .hub-cinematic-copy {
    top: auto;
    right: 5vw;
    left: 5vw;
    bottom: 116px;
    width: auto;
    transform: none;
  }
  .hub-cinematic-copy h1 { font-size: clamp(4rem, 13vw, 7rem); letter-spacing: -5px; }
  .hub-cinematic-copy > p { max-width: 680px; }
  .hub-cinematic-progress { right: 5vw; left: 5vw; grid-template-columns: 1fr; }
  .hub-cinematic-neighbor { display: none; }
  .hub-cinematic-progress .hero-switch-control { width: min(400px,100%); margin: auto; }
  .watch-content { padding-inline: 3vw; }
}

@media (max-width: 680px) {
  .watch-hub-full { display: block; width: 100%; }
  .watch-hub-sidebar-full { display: none; }
  .watch-hub-main-full { width: 100%; }
  .hub-cinematic-hero { min-height: 780px; }
  .hub-cinematic-nav { min-height: 70px; padding: 0 16px; }
  .hub-cinematic-brand .brand-mark { width: 39px; height: 39px; }
  .hub-cinematic-brand .brand-copy { display: block; }
  .hub-cinematic-brand .brand-copy strong { font-size: .78rem; }
  .hub-cinematic-login { width: 43px; padding: 0; font-size: 0; border-radius: 50%; }
  .hub-cinematic-login .icon { width: 19px; height: 19px; }
  .hub-cinematic-dots { top: 82px; left: 17px; }
  .hub-cinematic-poster { left: 0; width: 100%; height: 63%; }
  .hub-cinematic-copy { right: 18px; left: 18px; bottom: 100px; }
  .hub-cinematic-copy h1 { font-size: 3.65rem; letter-spacing: -3px; }
  .hub-cinematic-copy > strong { margin: 10px 0 14px auto; letter-spacing: 2.5px; }
  .hub-cinematic-copy > p {
    font-size: .78rem;
    line-height: 1.7;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .hub-cinematic-copy .hero-stage-meta span:nth-last-child(-n+2) { display: none; }
  .hub-cinematic-copy .hero-stage-actions { gap: 7px; }
  .hub-cinematic-copy .hero-primary,
  .hub-cinematic-copy .hero-secondary { flex: 1; padding-inline: 10px; font-size: .68rem; }
  .hub-cinematic-copy .hero-sound { width: 43px; flex: 0 0 43px; }
  .hub-cinematic-progress { bottom: 23px; right: 18px; left: 18px; }
  .hub-cinematic-scroll { display: none; }
  .watch-content { padding: 16px 12px 82px; }
  .watch-content .stream-section { margin-top: 34px; }
  .watch-content .stream-section-head h2 { font-size: 1.12rem; }
  .watch-content .stream-card { flex-basis: 78vw; }
  .watch-content .stream-card.vertical { flex-basis: 48vw; }
  .watch-content .continue-card-v2 { flex-basis: 84vw; }
  body:has(.home-page-v4) .stream-footer { width: 100%; margin: 0; padding-inline: 18px; }
}

@media (max-width: 420px) {
  .hub-cinematic-hero { min-height: 740px; }
  .hub-cinematic-copy h1 { font-size: 3.15rem; }
  .hub-cinematic-actions > button,
  .hub-cinematic-avatar,
  .hub-cinematic-login { width: 39px; height: 39px; min-height: 39px; }
}


/* ==========================================================================
   CINZO V4 — red / white / black vertical experience
   ========================================================================== */
:root {
  --bg: #050505;
  --bg-soft: #0a0a0b;
  --panel: rgba(17,17,18,.88);
  --panel-strong: #111112;
  --text: #ffffff;
  --muted: #aaa9ad;
  --muted-2: #77767b;
  --line: rgba(255,255,255,.10);
  --line-strong: rgba(255,255,255,.20);
  --primary: #e50914;
  --primary-2: #8a000a;
  --danger: #ff3340;
  --success: #38cf82;
}
body {
  font-family: "Cairo", Tahoma, Arial, sans-serif;
  background:
    radial-gradient(circle at 84% 0, rgba(229,9,20,.13), transparent 31%),
    radial-gradient(circle at 10% 18%, rgba(120,0,8,.09), transparent 26%),
    #050505;
}
::selection { background: rgba(229,9,20,.48); }
.btn-primary,
.hero-primary {
  background: linear-gradient(135deg,#f31320,#bd000b);
  border-color: rgba(255,255,255,.08);
  color:#fff;
  box-shadow: 0 14px 38px rgba(229,9,20,.25);
}
.btn-primary:hover,
.hero-primary:hover { box-shadow:0 17px 45px rgba(229,9,20,.38); }
.btn-premium {
  background:linear-gradient(135deg,#fff,#d9d9dc);
  border:0;
  color:#080808;
  font-weight:900;
}
.dot,
.pulse { background:#e50914 !important; }
.eyebrow.premium { color:#ff5962; }
.eyebrow.free { color:#62e5a4; }

/* Exact uploaded CINZO identity */
.brand {
  min-width:0;
  gap:0;
  overflow:visible;
}
.brand-logo-image {
  display:block;
  width:clamp(160px,15vw,235px);
  height:auto;
  object-fit:contain;
}
.brand-icon-image {
  display:block;
  width:48px;
  height:48px;
  border-radius:15px;
  object-fit:cover;
  box-shadow:0 10px 30px rgba(229,9,20,.17);
}
.site-header .brand-logo-image { width:150px; }
.watch-hub-logo .brand-icon-image { width:49px; height:49px; }
.hub-cinematic-brand .brand-logo-image { width:clamp(150px,13vw,220px); }
.footer-copy .brand-logo-image,
.stream-footer .brand-logo-image { width:190px; }

/* Full cinematic hero */
.cinzo-cinematic-hero {
  min-height:max(760px,100svh);
  background:#050505;
}
.cinzo-cinematic-hero .hub-cinematic-wash {
  background:
    linear-gradient(90deg,rgba(5,5,5,.96) 0%,rgba(5,5,5,.67) 38%,rgba(5,5,5,.08) 69%,rgba(5,5,5,.55) 100%),
    linear-gradient(to top,#050505 0%,rgba(5,5,5,.18) 38%,rgba(5,5,5,.38) 100%),
    radial-gradient(circle at 60% 44%,rgba(229,9,20,.24),transparent 31%);
}
.cinzo-cinematic-hero .hub-cinematic-bg { filter:saturate(.75) contrast(1.12) brightness(.72); }
.cinzo-cinematic-hero .hub-cinematic-video { filter:saturate(.55) contrast(1.15) brightness(.6); opacity:.3; }
.cinzo-cinematic-hero .hub-cinematic-poster img {
  mix-blend-mode:normal;
  opacity:.78;
  filter:saturate(.82) contrast(1.08);
}
.cinzo-cinematic-hero .hub-cinematic-poster span { background:rgba(229,9,20,.25); }
.cinzo-cinematic-hero .hub-cinematic-dots button.active,
.cinzo-cinematic-hero .hero-switch-control > span i { background:#e50914; }
.cinzo-cinematic-hero .hub-cinematic-scroll span { background:linear-gradient(to bottom,#e50914,transparent); }
.hub-cinematic-login,
.hub-cinematic-avatar {
  background:linear-gradient(135deg,#f31320,#8a000a);
  box-shadow:0 12px 35px rgba(229,9,20,.24);
}
.hero-stage-original {
  display:inline-flex;
  width:max-content;
  align-items:center;
  padding:7px 11px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:999px;
  color:#fff;
  background:rgba(0,0,0,.38);
  backdrop-filter:blur(12px);
  font-size:.65rem;
  font-weight:900;
}
.hero-stage-original.premium { border-color:rgba(229,9,20,.52); color:#ff7a82; }
.hero-stage-original.free { border-color:rgba(56,207,130,.38); color:#8aefba; }
.hero-premium-price {
  display:flex;
  align-items:center;
  gap:10px;
  width:max-content;
  margin:0 0 22px;
  padding:9px 12px;
  border:1px solid rgba(229,9,20,.35);
  border-radius:13px;
  background:rgba(111,0,7,.22);
  backdrop-filter:blur(12px);
}
.hero-premium-price strong { font-size:1.1rem; color:#fff; }
.hero-premium-price span { color:rgba(255,255,255,.65); font-size:.72rem; }

/* CINZO home business model */
.cinzo-model-strip {
  display:grid;
  grid-template-columns:1fr 1fr auto;
  gap:12px;
  align-items:stretch;
  margin:0 0 22px;
  padding:12px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:22px;
  background:linear-gradient(135deg,rgba(229,9,20,.08),rgba(255,255,255,.025));
}
.cinzo-model-strip > div {
  display:grid;
  grid-template-columns:42px 1fr;
  column-gap:11px;
  align-content:center;
  min-height:78px;
  padding:12px 14px;
  border-radius:15px;
  background:rgba(255,255,255,.035);
}
.cinzo-model-strip > div > span {
  grid-row:1/3;
  width:42px;
  height:42px;
  border-radius:13px;
  display:grid;
  place-items:center;
  color:#fff;
  background:rgba(229,9,20,.16);
}
.cinzo-model-strip strong { font-size:.82rem; }
.cinzo-model-strip p { margin:4px 0 0;color:var(--muted);font-size:.63rem;line-height:1.65; }
.cinzo-model-strip > a {
  min-width:180px;
  padding:0 19px;
  border-radius:15px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:#e50914;
  color:#fff;
  font-size:.75rem;
  font-weight:900;
}

/* Side ads — never cover content */
.cinzo-content-with-ads {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:22px;
  align-items:start;
}
.cinzo-content-with-ads.has-ads {
  grid-template-columns:150px minmax(0,1fr) 150px;
}
.cinzo-content-core { min-width:0; }
.cinzo-ad-rail {
  position:sticky;
  top:96px;
  min-width:0;
}
.cinzo-ad-rail > a,
.cinzo-ad-rail > div {
  min-height:470px;
  padding:15px 12px;
  border:1px solid rgba(255,255,255,.085);
  border-radius:20px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:11px;
  text-align:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 18%,rgba(229,9,20,.16),transparent 32%),
    linear-gradient(180deg,#121214,#09090a);
  box-shadow:0 24px 60px rgba(0,0,0,.22);
}
.cinzo-ad-rail img { width:100%;height:auto;max-height:440px;object-fit:cover;border-radius:13px; }
.cinzo-ad-rail > div img { width:56px;height:56px;object-fit:cover;border-radius:17px; }
.cinzo-ad-rail-kicker {
  padding:5px 8px;
  border-radius:999px;
  color:rgba(255,255,255,.46);
  background:rgba(255,255,255,.05);
  font-size:.54rem;
}
.cinzo-ad-rail strong { font-size:.72rem;line-height:1.6; }
.cinzo-ad-rail small { color:rgba(255,255,255,.42);font-size:.56rem;line-height:1.7; }

/* All catalogue media is vertical 9:16 */
.stream-row.vertical { align-items:flex-start; }
.watch-content .stream-card,
.watch-content .stream-card.vertical,
.stream-card,
.stream-card.vertical {
  flex-basis:clamp(175px,13vw,225px);
}
.stream-card-media,
.stream-card.vertical .stream-card-media {
  aspect-ratio:9/16;
  border-radius:17px;
}
.stream-card-tag.premium {
  background:linear-gradient(135deg,#e50914,#8a000a);
}
.stream-card-tag.free {
  background:rgba(17,142,79,.86);
}
.stream-rank {
  color:transparent;
  -webkit-text-stroke:2px rgba(255,255,255,.42);
}
.cinzo-continue-reel {
  flex:0 0 clamp(175px,13vw,225px) !important;
  aspect-ratio:9/16;
  border-radius:17px;
}
.cinzo-continue-reel > img { object-position:center; }
.cinzo-reels-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:21px;
}
.cinzo-reel-card,
.media-card.cinzo-reel-card {
  aspect-ratio:9/16;
  min-height:0;
}
.media-card.cinzo-reel-card > img { width:100%;height:100%;object-fit:cover; }
.badge-premium { color:#fff;background:linear-gradient(135deg,#e50914,#870008); }
.cinzo-page-title {
  margin:0 0 8px;
  font-size:clamp(2.3rem,5vw,4.5rem);
  letter-spacing:-2px;
}

/* Details */
.cinzo-detail-hero { min-height:760px; }
.cinzo-detail-poster {
  width:min(340px,30vw);
  aspect-ratio:9/16;
  object-fit:cover;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.13);
  box-shadow:0 35px 90px rgba(0,0,0,.58);
}
.premium-preview-note {
  max-width:610px;
  margin:0 0 22px;
  padding:13px 15px;
  border:1px solid rgba(229,9,20,.28);
  border-radius:14px;
  color:rgba(255,255,255,.74);
  background:rgba(92,0,5,.21);
  line-height:1.8;
  font-size:.78rem;
}
.premium-preview-note strong { color:#fff; }

/* Subscription */
.cinzo-subscribe {
  background:
    radial-gradient(circle at 50% 10%,rgba(229,9,20,.19),transparent 32%),
    #050505;
}
.cinzo-single-plan {
  grid-template-columns:minmax(300px,520px);
  justify-content:center;
}
.cinzo-single-plan .plan-card { border-color:rgba(229,9,20,.4); }
.plan-brand-icon { width:84px;height:84px;margin:6px auto 14px;border-radius:24px;object-fit:cover; }
.cinzo-payment-note { max-width:850px;margin:0 auto 80px; }

/* Vertical player + ads */
.cinzo-watch-page { min-height:100vh;padding-bottom:60px;background:#030303; }
.cinzo-watch-grid {
  width:min(1180px,calc(100% - 32px));
  margin:18px auto 0;
  display:grid;
  grid-template-columns:minmax(300px,520px);
  justify-content:center;
  align-items:start;
  gap:22px;
}
.cinzo-watch-grid.with-ads {
  grid-template-columns:150px minmax(300px,520px) 150px;
}
.cinzo-watch-grid .cinzo-ad-rail { top:94px; }
.cinzo-video-stage,
.video-stage.vertical.cinzo-video-stage {
  position:relative;
  width:min(100%,520px);
  aspect-ratio:9/16;
  min-height:0;
  max-height:calc(100svh - 120px);
  margin:auto;
  overflow:hidden;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.13);
  background:#000;
  box-shadow:0 35px 100px rgba(0,0,0,.65),0 0 70px rgba(229,9,20,.09);
}
.cinzo-video-stage video,
.cinzo-video-stage iframe { width:100%;height:100%;object-fit:contain;background:#000; }
.cinzo-watch-info {
  width:min(820px,calc(100% - 32px));
  margin:18px auto 0;
  padding:16px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  background:#0d0d0e;
}
.cinzo-watch-info h1 { margin:7px 0 3px;font-size:1.25rem; }
.cinzo-watch-info p { margin:0;color:var(--muted);font-size:.72rem; }
.cinzo-watch-episodes {
  width:min(820px,calc(100% - 32px));
  margin:12px auto 0;
  max-height:320px;
  overflow:auto;
  padding:8px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:18px;
  background:#09090a;
}
.preview-complete-overlay {
  position:absolute;
  z-index:12;
  inset:0;
  padding:28px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  opacity:0;
  visibility:hidden;
  transform:scale(.98);
  transition:.28s ease;
  background:
    radial-gradient(circle at 50% 32%,rgba(229,9,20,.25),transparent 34%),
    rgba(3,3,3,.95);
  backdrop-filter:blur(16px);
}
.preview-complete-overlay.show { opacity:1;visibility:visible;transform:none; }
.preview-complete-overlay img { width:88px;height:88px;border-radius:25px;margin-bottom:15px; }
.preview-complete-overlay > span { color:#ff6069;font-size:.7rem;font-weight:900; }
.preview-complete-overlay h2 { margin:8px 0;font-size:clamp(1.6rem,5vw,2.4rem); }
.preview-complete-overlay p { max-width:420px;margin:0 0 20px;color:var(--muted);line-height:1.8;font-size:.78rem; }
.preview-complete-overlay .btn { margin:4px; }

/* Ad blocker message — polite and non-blocking after dismissal */
.adblock-notice {
  position:fixed;
  z-index:10000;
  inset:0;
  padding:20px;
  display:grid;
  place-items:center;
  background:rgba(0,0,0,.76);
  backdrop-filter:blur(14px);
  animation:cinzoFade .28s ease both;
}
.adblock-card {
  position:relative;
  width:min(560px,100%);
  padding:30px;
  border:1px solid rgba(229,9,20,.32);
  border-radius:27px;
  text-align:center;
  background:
    radial-gradient(circle at 50% 0,rgba(229,9,20,.18),transparent 35%),
    #101011;
  box-shadow:0 35px 120px rgba(0,0,0,.72);
}
.adblock-card > img { width:82px;height:82px;margin:0 auto 14px;border-radius:24px; }
.adblock-card > span { color:#ff6570;font-size:.66rem;font-weight:900; }
.adblock-card h2 { margin:8px 0 10px;font-size:clamp(1.45rem,5vw,2rem); }
.adblock-card > p { margin:0 auto 18px;max-width:480px;color:var(--muted);line-height:1.9;font-size:.8rem; }
.adblock-points { display:flex;justify-content:center;gap:7px;flex-wrap:wrap;margin-bottom:20px; }
.adblock-points b { padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.045);font-size:.6rem; }
.adblock-points .icon { width:14px;height:14px;color:#4ada94; }
.adblock-actions { display:flex;justify-content:center;gap:9px;flex-wrap:wrap; }
.adblock-card > small { display:block;margin-top:14px;color:rgba(255,255,255,.35);font-size:.56rem; }
.adblock-close {
  position:absolute;
  top:14px;
  left:14px;
  width:36px;height:36px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:50%;
  display:grid;place-items:center;
  background:rgba(255,255,255,.035);
  cursor:pointer;
}
@keyframes cinzoFade { from{opacity:0} to{opacity:1} }

/* Admin ad controls */
.cinzo-admin-ad-settings { margin:20px 0;background:rgba(229,9,20,.035); }
.cinzo-admin-ad-settings h4 { margin:0 0 3px; }

/* Arabic-only visible headings */
.stream-section-head > div > span { color:#ff5862; }
.stream-card-body > div i { background:#e50914; }
.mobile-link.active { color:#ff3944; }

/* Responsive */
@media (max-width:1400px) {
  .cinzo-content-with-ads.has-ads,
  .cinzo-watch-grid.with-ads { grid-template-columns:minmax(0,1fr); }
  .cinzo-content-with-ads > .cinzo-ad-rail,
  .cinzo-watch-grid > .cinzo-ad-rail { display:none; }
}
@media (max-width:900px) {
  .hub-cinematic-brand .brand-logo-image { width:165px; }
  .cinzo-model-strip { grid-template-columns:1fr 1fr; }
  .cinzo-model-strip > a { grid-column:1/-1;min-height:48px; }
  .cinzo-detail-poster { width:min(290px,35vw); }
  .cinzo-reels-grid { grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:14px; }
}
@media (max-width:680px) {
  .hub-cinematic-brand .brand-logo-image { width:135px; }
  .hub-cinematic-copy h1 { letter-spacing:-2px; }
  .hero-premium-price { margin-bottom:14px; }
  .cinzo-model-strip { grid-template-columns:1fr;padding:9px; }
  .cinzo-model-strip > a { grid-column:auto;min-height:48px; }
  .watch-content .stream-card,
  .watch-content .stream-card.vertical,
  .stream-card,
  .stream-card.vertical { flex-basis:46vw; }
  .cinzo-continue-reel { flex-basis:46vw !important; }
  .cinzo-reels-grid { grid-template-columns:repeat(2,minmax(0,1fr));gap:11px; }
  .cinzo-detail-hero { min-height:720px; }
  .cinzo-detail-poster { position:absolute;inset:85px 10px auto auto;width:calc(100% - 20px);height:58%;opacity:.42;mask-image:linear-gradient(to bottom,#000,transparent); }
  .cinzo-watch-grid { width:100%;margin-top:0; }
  .cinzo-video-stage,
  .video-stage.vertical.cinzo-video-stage { width:100%;max-height:none;border-radius:0;border-inline:0; }
  .cinzo-watch-info { border-radius:14px;align-items:flex-start; }
  .cinzo-watch-info .btn { font-size:.62rem;padding-inline:10px; }
  .adblock-card { padding:26px 18px; }
  .adblock-actions { flex-direction:column; }
  .adblock-actions .btn { width:100%; }
}
@media (max-width:420px) {
  .hub-cinematic-brand .brand-logo-image { width:118px; }
  .cinzo-reels-grid { gap:8px; }
  .stream-card-body h3 { font-size:.7rem; }
}

/* ========================================================================== 
   CINZO Launch Edition 5.0 — final responsive/performance overrides
   ========================================================================== */
:root{--cinzo-red:#ef101b;--cinzo-red-2:#ff3540;--cinzo-bg:#050505;--cinzo-panel:#111315;--cinzo-line:rgba(255,255,255,.095);--cinzo-text:#fff;--cinzo-muted:#a7a7aa;--rail-width:84px}
html{scroll-behavior:smooth;background:var(--cinzo-bg)}
body{overflow-x:hidden;background:var(--cinzo-bg);font-family:"Cairo",system-ui,-apple-system,"Segoe UI",sans-serif}
button,input,textarea,select{font:inherit}
img{max-width:100%}
.brand,.brand img,.hub-cinematic-brand,.watch-hub-logo{background:transparent!important;box-shadow:none!important;border:0!important}
.brand-logo-image{display:block;width:clamp(120px,11vw,190px)!important;height:auto!important;object-fit:contain;filter:none!important;mix-blend-mode:normal}
.brand-icon-image{display:block;width:46px!important;height:46px!important;object-fit:contain;border-radius:13px}
.hub-cinematic-brand .brand-logo-image{width:150px!important}
.site-header .brand-logo-image{width:132px!important}
.app-noise{opacity:.018;pointer-events:none}

/* Home frame */
.watch-hub-full{min-height:100dvh;width:100%;display:block}
.watch-hub-sidebar-full{position:fixed!important;inset:0 auto 0 0!important;width:var(--rail-width)!important;height:100dvh!important;z-index:80;background:rgba(7,8,9,.93)!important;border-right:1px solid var(--cinzo-line);padding:max(16px,env(safe-area-inset-top)) 8px max(16px,env(safe-area-inset-bottom))!important}
.watch-hub-main-full{margin-left:var(--rail-width)!important;width:calc(100% - var(--rail-width))!important;min-width:0!important}
.watch-hub-sidebar nav{gap:8px!important}
.watch-hub-sidebar nav a,.watch-hub-sidebar nav button{min-height:58px;border-radius:14px!important}
.watch-hub-sidebar nav span{font-size:.68rem!important}
.watch-hub-sidebar .watch-hub-mini-list{display:none!important}
.cinzo-cinematic-hero{height:min(100dvh,980px)!important;min-height:680px!important;width:100%!important;border-radius:0!important;margin:0!important;overflow:hidden!important;isolation:isolate;background:#070707}
.hub-cinematic-bg,.hub-cinematic-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 20%;transform:none!important}
.hub-cinematic-video{z-index:0;opacity:.72}
.hub-cinematic-bg{z-index:-1;background-size:cover;background-position:center 20%;transform:scale(1.015)!important}
.hub-cinematic-wash{background:linear-gradient(90deg,rgba(3,3,3,.94) 0%,rgba(3,3,3,.67) 31%,rgba(3,3,3,.14) 63%,rgba(3,3,3,.36) 100%),linear-gradient(0deg,#08090a 0%,transparent 38%,rgba(0,0,0,.26) 100%)!important;z-index:1}
.hub-cinematic-nav{z-index:5!important;padding:22px clamp(24px,4vw,72px)!important;min-height:84px;align-items:center!important}
.hub-cinematic-nav nav{gap:clamp(16px,2.4vw,36px)!important}
.hub-cinematic-copy{z-index:4!important;position:absolute!important;right:auto!important;left:clamp(34px,6vw,100px)!important;bottom:clamp(112px,15vh,170px)!important;top:auto!important;width:min(600px,48vw)!important;max-width:none!important;padding:0!important;text-align:right!important;direction:rtl;display:flex;flex-direction:column;align-items:flex-start}
.hub-cinematic-copy::before{content:"";position:absolute;inset:-70px -65px -70px -90px;background:radial-gradient(ellipse at center,rgba(0,0,0,.64),transparent 69%);z-index:-1;pointer-events:none}
.hub-cinematic-copy h1{font-size:clamp(3.5rem,6.5vw,7.2rem)!important;line-height:.96!important;letter-spacing:-.055em!important;margin:12px 0 16px!important;max-width:100%;text-wrap:balance}
.hub-cinematic-copy>p{font-size:clamp(.94rem,1.15vw,1.16rem)!important;line-height:1.9!important;max-width:590px!important;margin:12px 0 18px!important;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.hero-stage-meta{display:flex!important;flex-wrap:wrap!important;gap:7px!important;align-items:center!important;margin:0 0 4px!important}
.hero-stage-meta>*{white-space:nowrap!important}
.hero-premium-price{display:flex!important;align-items:center!important;gap:12px!important;margin:4px 0 16px!important;min-height:52px!important;padding:9px 14px!important}
.hero-premium-price strong{font-size:1.1rem!important;white-space:nowrap}
.hero-stage-actions{display:flex!important;flex-wrap:wrap!important;gap:10px!important;margin-top:0!important;align-items:center!important}
.hero-stage-actions button,.hero-stage-actions a{min-height:48px!important}
.hub-cinematic-poster{right:clamp(24px,7vw,130px)!important;left:auto!important;bottom:95px!important;width:min(25vw,315px)!important;opacity:.98}
.hub-cinematic-poster img{aspect-ratio:9/16;object-fit:cover}
.hub-cinematic-dots{bottom:40px!important;z-index:6!important}
.hub-cinematic-scroll{bottom:26px!important}
.watch-content{padding:46px clamp(18px,3vw,54px) 70px!important;background:#090a0b!important;min-height:100vh}
.cinzo-model-strip,.stream-section,.cinzo-content-core>section{content-visibility:auto;contain-intrinsic-size:auto 620px}
.stream-row{overscroll-behavior-inline:contain;scroll-snap-type:x proximity;scrollbar-width:none}
.stream-row::-webkit-scrollbar,.continue-row-v2::-webkit-scrollbar{display:none}
.stream-card,.continue-card-v2{scroll-snap-align:start;transform:translateZ(0)}
.stream-card-media img,.continue-card-v2 img,.media-card img{content-visibility:auto}
.card-preview-video{will-change:opacity;transform:translateZ(0)}
.cinzo-content-with-ads.has-ads{grid-template-columns:minmax(100px,150px) minmax(0,1fr) minmax(100px,150px)!important;gap:20px!important;align-items:start}
.cinzo-ad-rail{position:sticky!important;top:22px!important;max-height:600px;min-height:320px;border-radius:18px!important;overflow:hidden!important}
.cinzo-ad-rail img{width:100%;height:auto;max-height:600px;object-fit:cover}

/* Header/logo */
.site-header{background:linear-gradient(180deg,rgba(5,5,5,.94),rgba(5,5,5,.72))!important}
.site-header.scrolled{background:rgba(5,5,5,.96)!important}

/* Player */
.cinzo-watch-page{min-height:100dvh;padding:70px clamp(16px,3vw,50px) 45px!important}
.cinzo-watch-layout{width:min(1180px,100%);margin:auto;display:grid!important;grid-template-columns:minmax(110px,150px) minmax(280px,500px) minmax(110px,150px)!important;justify-content:center;gap:22px!important;align-items:start}
.cinzo-vertical-player-shell{width:100%!important;max-width:500px!important;aspect-ratio:9/16!important;margin:0 auto!important;border-radius:22px!important;background:#000;overflow:hidden;position:relative}
.cinzo-vertical-video{width:100%!important;height:100%!important;object-fit:contain!important;background:#000}
.preview-badge{position:absolute;top:14px;right:14px;z-index:3;background:rgba(239,16,27,.92);padding:7px 12px;border-radius:999px;font-weight:800;font-size:.75rem}
.cinzo-watch-info{width:min(760px,100%);margin:24px auto!important;display:flex;justify-content:space-between;gap:16px;align-items:center}
.cinzo-watch-info h1{margin:8px 0 2px!important;line-height:1.12!important}
.cinzo-watch-episodes{width:min(760px,100%);margin:24px auto 0!important}

/* Forms/admin */
.media-field-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;align-items:center}
.upload-button{height:48px;display:flex;align-items:center;gap:7px;padding:0 16px;border-radius:11px;background:#242628;border:1px solid var(--cinzo-line);cursor:pointer;font-weight:700;white-space:nowrap}
.upload-button input{position:absolute;inline-size:1px;block-size:1px;opacity:0;pointer-events:none}
.media-field small{display:block;color:var(--cinzo-muted);font-size:.72rem;margin-top:7px}
.media-field-preview{display:none;margin-top:12px;width:130px;aspect-ratio:9/12;object-fit:cover;border-radius:12px;border:1px solid var(--cinzo-line);background:#080808}
.media-field-preview.show{display:block}
.admin-page{min-height:100dvh;background:#08090a;display:grid;grid-template-columns:260px minmax(0,1fr);direction:rtl}
.admin-sidebar{position:sticky;top:0;height:100dvh;background:#0e1012;border-left:1px solid var(--cinzo-line);padding:24px 14px;overflow:auto}
.admin-owner{display:flex;align-items:center;gap:11px;padding:10px 8px 24px;border-bottom:1px solid var(--cinzo-line)}
.admin-owner>div{width:44px;height:44px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(135deg,var(--cinzo-red),#8b0710);font-weight:900}
.admin-owner span{display:grid}.admin-owner small{color:var(--cinzo-muted);font-size:.7rem}
.admin-sidebar nav{display:grid;gap:5px;margin-top:20px}
.admin-sidebar nav button,.admin-sidebar nav a{width:100%;display:flex;align-items:center;gap:11px;min-height:46px;padding:0 13px;border:0;border-radius:11px;background:transparent;color:#c5c5c7;text-decoration:none;cursor:pointer;text-align:right}
.admin-sidebar nav button.active{background:rgba(239,16,27,.13);color:#fff;border:1px solid rgba(239,16,27,.28)}
.admin-sidebar nav b{margin-right:auto;background:var(--cinzo-red);border-radius:99px;min-width:22px;height:22px;display:grid;place-items:center;font-size:.68rem}
.admin-main{padding:clamp(20px,3vw,46px);min-width:0;max-width:1600px;width:100%;margin:auto}
.admin-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.admin-top span{color:var(--cinzo-red);font-size:.75rem;font-weight:800}.admin-top h1{margin:3px 0 0;font-size:clamp(1.8rem,3vw,3rem)}
.admin-mobile-tabs{display:none}
.admin-toolbar{display:flex;justify-content:space-between;gap:18px;align-items:center;margin:0 0 22px}.admin-toolbar h2{margin:0}.admin-toolbar p{color:var(--cinzo-muted);margin:5px 0 0}
.admin-content-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:18px}
.admin-title-card{display:grid;grid-template-columns:120px minmax(0,1fr);background:#111315;border:1px solid var(--cinzo-line);border-radius:18px;overflow:hidden;min-width:0}
.admin-title-card>img{width:100%;height:100%;min-height:250px;object-fit:cover}.admin-title-card-copy{padding:18px;min-width:0}.admin-title-card h3{font-size:1.35rem;margin:9px 0 4px}.admin-title-card p{color:var(--cinzo-muted);margin:0}
.admin-card-actions{display:flex;gap:6px}.admin-card-actions button,.admin-episode-list button{width:34px;height:34px;border-radius:9px;border:1px solid var(--cinzo-line);background:#202225;color:#fff;display:grid;place-items:center;cursor:pointer}.admin-card-actions .danger,.admin-episode-list .danger{color:#ff7078}
.admin-episode-list{display:grid;gap:7px;margin:16px 0}.admin-episode-list>div{display:grid;grid-template-columns:24px minmax(0,1fr) auto 34px 34px;gap:7px;align-items:center;padding:8px;background:#0b0c0d;border-radius:10px}.admin-episode-list strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.admin-episode-list small{color:var(--cinzo-muted);font-size:.65rem}
.admin-list-cards{display:grid;gap:10px}.admin-list-cards>article{display:flex;align-items:center;justify-content:space-between;gap:15px;background:#111315;border:1px solid var(--cinzo-line);padding:16px;border-radius:14px}.admin-list-cards h3{margin:0 0 4px}.admin-list-cards p{margin:0;color:var(--cinzo-muted)}
.admin-settings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}.admin-settings>.panel{margin:0}.admin-settings h3{margin-top:0}.admin-settings .admin-save{grid-column:1/-1;position:sticky;bottom:16px;z-index:3;box-shadow:0 14px 45px rgba(239,16,27,.25)}
.textarea.tall{min-height:220px}
.admin-subheading{margin-top:32px}
.responsive-table{overflow:auto;border:1px solid var(--cinzo-line);border-radius:15px;background:#111315}
.admin-edit-modal{width:min(850px,calc(100vw - 28px))!important;max-height:92dvh!important;overflow:auto!important}
.payment-option,.manual-payment{border:1px solid var(--cinzo-line);border-radius:14px;padding:16px;margin-top:16px;background:#111315}.manual-payment summary{cursor:pointer;font-weight:800}.manual-details{background:#090a0b;padding:12px;border-radius:10px;margin:12px 0}
.checkbox-group{display:flex!important;align-items:center;justify-content:center;gap:9px;border:1px solid var(--cinzo-line);border-radius:12px;min-height:48px;margin-top:28px}

/* Auth/setup */
.setup-page{min-height:100dvh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 50% 10%,rgba(239,16,27,.15),transparent 38%),#050505}
.setup-card{width:min(620px,100%);text-align:center;background:#101113;border:1px solid var(--cinzo-line);border-radius:24px;padding:clamp(26px,6vw,54px)}.setup-card img{width:min(300px,75%);background:transparent}.setup-card>span{display:block;color:var(--cinzo-red);font-weight:900;margin:22px 0 8px}.setup-card h1{font-size:clamp(2rem,5vw,3.5rem);line-height:1.1}.setup-code{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:20px}.setup-code code{background:#050505;padding:8px 11px;border-radius:8px;color:#ff737a}
.auth-brand .brand-logo-image{width:180px!important}
.auth-page{min-height:100dvh}
.text-button{background:transparent;border:0;color:#ddd;text-decoration:underline;cursor:pointer;margin:-6px 0 15px}
.payment-result-card{width:min(620px,100%);margin:12vh auto;text-align:center;background:#111315;border:1px solid var(--cinzo-line);border-radius:22px;padding:44px}
.legal-content{max-width:980px!important}.legal-text{line-height:2;color:#d0d0d3;white-space:normal}

/* Brave / low motion performance */
html.is-brave .app-noise,html.reduced-motion .app-noise{display:none!important}
html.is-brave *{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html.is-brave .hub-cinematic-grid,html.is-touch .hub-cinematic-grid{display:none!important}
html.is-brave .card-preview-video,html.is-touch .card-preview-video{display:none!important}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}.hero-stage-video,.card-preview-video{display:none!important}}

@media(max-width:1180px){
  .cinzo-content-with-ads.has-ads{grid-template-columns:120px minmax(0,1fr)!important}.cinzo-ad-rail.left{display:none!important}
  .hub-cinematic-poster{width:min(25vw,270px)!important;right:32px!important}
  .hub-cinematic-copy{width:min(600px,58vw)!important;left:42px!important}
  .admin-settings{grid-template-columns:1fr}
  .admin-settings .admin-save{grid-column:1}
}

@media(max-width:900px){
  :root{--rail-width:0px}
  .watch-hub-sidebar-full{display:none!important}.watch-hub-main-full{margin-left:0!important;width:100%!important}
  .cinzo-cinematic-hero{height:100dvh!important;min-height:620px!important}
  .hub-cinematic-nav{padding:max(15px,env(safe-area-inset-top)) 16px 14px!important;min-height:70px}.hub-cinematic-nav nav{display:none!important}.hub-cinematic-brand .brand-logo-image{width:124px!important}.hub-cinematic-login{font-size:0!important;padding:0!important;width:42px!important}.hub-cinematic-login .icon{margin:0!important}
  .hub-cinematic-bg,.hub-cinematic-video{object-position:center top!important}.hub-cinematic-wash{background:linear-gradient(180deg,rgba(0,0,0,.28),rgba(0,0,0,.06) 35%,rgba(0,0,0,.93) 78%,#08090a 100%)!important}
  .hub-cinematic-copy{left:16px!important;right:16px!important;bottom:max(78px,calc(env(safe-area-inset-bottom) + 68px))!important;width:auto!important;align-items:flex-start!important}
  .hub-cinematic-copy::before{inset:-35px -18px -40px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.72))}
  .hub-cinematic-copy h1{font-size:clamp(2.35rem,11.5vw,4.2rem)!important;line-height:1.02!important;letter-spacing:-.04em!important;margin:8px 0 10px!important;max-width:90%!important}
  .hub-cinematic-copy>p{font-size:.87rem!important;line-height:1.75!important;-webkit-line-clamp:2;max-width:96%!important;margin:7px 0 11px!important}
  .hero-stage-meta{gap:5px!important;margin-bottom:0!important}.hero-stage-meta>*{font-size:.67rem!important;padding:4px 7px!important}
  .hero-stage-original{font-size:.66rem!important}.hero-premium-price{min-height:42px!important;padding:6px 10px!important;margin:2px 0 9px!important}.hero-premium-price strong{font-size:.92rem!important}.hero-premium-price span{font-size:.66rem!important}
  .hero-stage-actions{width:100%;gap:7px!important}.hero-stage-actions button,.hero-stage-actions a{min-height:43px!important;padding:0 13px!important;font-size:.78rem!important}.hero-sound{width:43px!important;padding:0!important}
  .hub-cinematic-poster,.hub-cinematic-scroll{display:none!important}.hub-cinematic-dots{bottom:56px!important;left:16px!important;right:auto!important;transform:none!important}
  .watch-content{padding:30px 12px 98px!important}.cinzo-model-strip{grid-template-columns:1fr!important}.cinzo-model-strip>div:nth-child(2){display:none}
  .cinzo-content-with-ads.has-ads{display:block!important}.cinzo-ad-rail{display:none!important}
  .stream-section-head{align-items:flex-end!important}.stream-section-tools button{display:none!important}.stream-section-tools a{font-size:.7rem!important}
  .stream-row.vertical{gap:10px!important}.stream-card.vertical{min-width:min(42vw,180px)!important;width:min(42vw,180px)!important}.continue-card-v2{min-width:min(58vw,260px)!important}
  .cinzo-watch-layout{display:block!important}.cinzo-watch-layout .cinzo-ad-rail{display:none!important}.cinzo-watch-page{padding:58px 0 32px!important}.cinzo-vertical-player-shell{max-width:100%!important;width:100%!important;border-radius:0!important;height:calc(100dvh - 120px);aspect-ratio:auto!important}.cinzo-vertical-video{object-fit:contain!important}.watch-back{top:12px!important;right:12px!important}.cinzo-watch-info,.cinzo-watch-episodes{padding-inline:15px!important}
  .admin-page{display:block!important;padding-bottom:32px}.admin-sidebar{display:none!important}.admin-main{padding:max(18px,env(safe-area-inset-top)) 12px 48px!important}.admin-top{margin-bottom:18px;align-items:flex-start}.admin-top .brand-logo-image{width:110px!important}.admin-mobile-tabs{display:flex;gap:7px;overflow:auto;position:sticky;top:0;z-index:20;background:rgba(8,9,10,.96);padding:10px 0 13px;margin-bottom:18px;scrollbar-width:none}.admin-mobile-tabs button{white-space:nowrap;border:1px solid var(--cinzo-line);background:#141618;color:#bbb;padding:9px 13px;border-radius:999px}.admin-mobile-tabs button.active{background:var(--cinzo-red);color:#fff;border-color:var(--cinzo-red)}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.admin-toolbar{align-items:flex-end}.admin-toolbar p{font-size:.75rem}.admin-content-grid{grid-template-columns:1fr!important}.admin-title-card{grid-template-columns:92px minmax(0,1fr)}.admin-title-card>img{min-height:225px}.admin-title-card-copy{padding:13px}.admin-title-card h3{font-size:1.05rem}.admin-episode-list>div{grid-template-columns:20px minmax(0,1fr) 30px 30px}.admin-episode-list small{display:none}
  .responsive-table{border:0;background:transparent;overflow:visible}.responsive-table table,.responsive-table tbody,.responsive-table tr,.responsive-table td{display:block;width:100%}.responsive-table thead{display:none}.responsive-table tr{background:#111315;border:1px solid var(--cinzo-line);border-radius:14px;margin-bottom:10px;padding:10px}.responsive-table td{display:flex;justify-content:space-between;gap:12px;border:0!important;padding:7px!important;text-align:left}.responsive-table td::before{content:attr(data-label);font-weight:800;color:#aaa;text-align:right}.admin-list-cards>article{align-items:flex-start}.admin-settings{display:block}.admin-settings>.panel{margin-bottom:14px}.admin-settings .admin-save{position:static!important;width:100%;bottom:auto!important;margin-top:12px}.admin-edit-modal{padding:18px!important;border-radius:18px!important}.form-grid{grid-template-columns:1fr!important}.media-field-row{grid-template-columns:1fr auto}.media-field-preview{width:100px}.checkbox-group{margin-top:0}
  .auth-page{display:block!important;padding:80px 14px 30px!important}.auth-visual{position:fixed!important;inset:0!important;opacity:.23!important}.auth-card{position:relative!important;width:100%!important;max-width:560px!important;margin:auto!important}.auth-brand{position:absolute!important;top:22px!important;right:22px!important;z-index:4}
}

@media(max-width:520px){
  .hub-cinematic-copy{bottom:max(86px,calc(env(safe-area-inset-bottom) + 74px))!important}.hub-cinematic-copy h1{font-size:clamp(2.15rem,11vw,3.2rem)!important;max-width:100%!important}.hub-cinematic-copy>p{display:none!important}.hero-stage-actions .hero-secondary{display:none!important}.hero-premium-price{max-width:100%}.hero-stage-meta span:nth-last-child(1){display:none!important}
  .hub-cinematic-dots{display:none!important}.stream-card.vertical{min-width:44vw!important;width:44vw!important}.cinzo-model-strip{padding:13px!important}.hub-chips{overflow:auto;flex-wrap:nowrap!important;scrollbar-width:none}.hub-chips a{white-space:nowrap}
  .stats-grid{grid-template-columns:1fr 1fr!important;gap:8px!important}.stat-card{padding:14px!important}.stat-card strong{font-size:1.7rem!important}.admin-title-card{grid-template-columns:80px minmax(0,1fr)}.admin-title-card>img{min-height:210px}.admin-episode-list{margin-inline:-4px}.admin-toolbar{display:grid;grid-template-columns:1fr}.admin-toolbar .btn{width:100%}
  .site-header .brand-logo-image{width:105px!important}.desktop-nav{display:none!important}.header-actions .btn span:not(.icon){display:none}
  .payment-result-card{padding:28px 18px;margin:8vh auto}.modal{width:calc(100vw - 16px)!important;max-height:94dvh!important;padding:18px!important}.media-field-row{grid-template-columns:1fr}.upload-button{justify-content:center}.media-field-preview{width:100%;max-height:210px;aspect-ratio:16/9}
}
