/* ========================================================================== 
   Space Gate Nova+ — Commercial Brand Core
   Applied as the final visual layer for VOD, Live, Auth and Player surfaces.
   The original bottom navigation markup and styling are intentionally preserved.
   ========================================================================== */

:root {
  color-scheme: dark;

  --sg-brand-primary: #6a00ff;
  --sg-brand-primary-hover: #8633ff;
  --sg-brand-primary-deep: #350080;
  --sg-brand-primary-rgb: 106, 0, 255;
  --sg-brand-premium: #d7ad55;
  --sg-brand-premium-soft: #f0c265;

  --sg-bg-absolute: #000;
  --sg-bg-elevated: #050507;
  --sg-surface-1: #0a0a0c;
  --sg-surface-2: #121216;
  --sg-surface-3: #19191f;
  --sg-surface-glass: rgba(12, 12, 16, .82);
  --sg-surface-glass-strong: rgba(8, 8, 11, .92);

  --sg-text-primary: #fff;
  --sg-text-secondary: #a4a4ad;
  --sg-text-tertiary: #74747e;
  --sg-border-light: rgba(255, 255, 255, .08);
  --sg-border-medium: rgba(255, 255, 255, .14);
  --sg-border-focus: rgba(var(--sg-brand-primary-rgb), .48);

  --sg-space-xs: 4px;
  --sg-space-sm: 8px;
  --sg-space-md: 12px;
  --sg-space-lg: 16px;
  --sg-space-xl: 24px;
  --sg-space-2xl: 32px;
  --sg-touch-target: 44px;

  --sg-radius-sm: 8px;
  --sg-radius-card: 12px;
  --sg-radius-panel: 18px;
  --sg-radius-hero: 24px;

  --sg-font-system: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --sg-shadow-card: 0 16px 42px rgba(0, 0, 0, .3);
  --sg-shadow-panel: 0 28px 90px rgba(0, 0, 0, .52);
  --sg-ease-out: cubic-bezier(.25, 1, .5, 1);

  /* Compatibility aliases for the existing interface. */
  --sg-bg: var(--sg-bg-absolute);
  --sg-surface: var(--sg-surface-1);
  --sg-surface-elevated: var(--sg-surface-2);
  --sg-accent: var(--sg-brand-primary);
  --sg-accent-hover: var(--sg-brand-primary-hover);
  --sg-accent-dark: var(--sg-brand-primary-deep);
  --sg-accent-glow: rgba(var(--sg-brand-primary-rgb), .38);
  --sg-accent-soft: rgba(var(--sg-brand-primary-rgb), .12);
  --sg-border: var(--sg-border-light);
  --sg-border-strong: var(--sg-border-focus);
  --sg-text: var(--sg-text-primary);
  --sg-muted: var(--sg-text-secondary);

  --sh-bg: var(--sg-bg-absolute);
  --sh-bg-2: var(--sg-bg-elevated);
  --sh-surface: var(--sg-surface-1);
  --sh-surface-hover: var(--sg-surface-2);
  --sh-primary: var(--sg-brand-primary);
  --sh-primary-hover: var(--sg-brand-primary-hover);
  --sh-vip: var(--sg-brand-premium);
  --sh-text: var(--sg-text-primary);
  --sh-text-muted: var(--sg-text-secondary);
  --sh-border: var(--sg-border-light);

  --sgn-live-bg: var(--sg-bg-absolute);
  --sgn-live-panel: var(--sg-surface-1);
  --sgn-live-panel-2: var(--sg-surface-2);
  --sgn-live-line: var(--sg-border-light);
  --sgn-live-purple: var(--sg-brand-primary);
  --sgn-live-purple-2: var(--sg-brand-primary-hover);
  --sgn-live-muted: var(--sg-text-secondary);
}

html {
  background: var(--sg-bg-absolute) !important;
  color-scheme: dark;
  scroll-behavior: smooth;
}

body.sg-brand-commercial,
body.sg-cinema-body,
body.sg-nova-live,
body.nova-auth-page {
  margin: 0;
  color: var(--sg-text-primary) !important;
  background-color: var(--sg-bg-absolute) !important;
  font-family: var(--sg-font-system) !important;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  overscroll-behavior-y: none;
}

body.sg-brand-commercial,
body.sg-cinema-body,
body.sg-nova-live {
  background-image:
    radial-gradient(900px 420px at 50% -140px, rgba(var(--sg-brand-primary-rgb), .16), transparent 72%),
    linear-gradient(180deg, #020203 0, #000 52%, #030304 100%) !important;
  background-attachment: fixed !important;
}

::selection {
  background: rgba(var(--sg-brand-primary-rgb), .72);
  color: #fff;
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--sg-brand-primary-hover) !important;
  outline-offset: 3px !important;
}

/* Header and brand presence ------------------------------------------------ */
.sg-header,
.bein-header,
.sh-navbar,
.sg-glass-header {
  background: var(--sg-surface-glass) !important;
  border-bottom: 1px solid var(--sg-border-light) !important;
  box-shadow: 0 12px 36px rgba(0, 0, 0, .24) !important;
  backdrop-filter: saturate(180%) blur(24px) !important;
  -webkit-backdrop-filter: saturate(180%) blur(24px) !important;
}

.sg-header.is-scrolled,
.bein-header.is-scrolled,
.sh-navbar.is-scrolled {
  background: var(--sg-surface-glass-strong) !important;
  border-bottom-color: var(--sg-border-medium) !important;
}

.brand,
.connect-logo,
.sh-brand,
.nova-brand {
  font-family: var(--sg-font-system) !important;
  letter-spacing: -.01em;
}

.brand__mark,
.connect-logo img,
.sh-brand img,
.nova-brand img {
  filter: none !important;
}

.brand__mark {
  background: rgba(255, 255, 255, .035) !important;
  border: 1px solid var(--sg-border-light) !important;
  box-shadow: 0 8px 26px rgba(var(--sg-brand-primary-rgb), .24) !important;
}

.brand__mark img {
  width: 26px !important;
  height: 26px !important;
  object-fit: contain !important;
  filter: none !important;
}

.brand__text,
.connect-logo,
.sh-brand {
  color: var(--sg-text-primary) !important;
  font-weight: 800 !important;
}

.brand__text span,
.connect-logo span,
.sh-brand span,
.nova-brand span,
.sg3-footer__brand h2 span {
  color: var(--sg-brand-primary-hover) !important;
}

.top-links a,
.top-nav a,
.sh-nav-links a {
  color: var(--sg-text-secondary) !important;
  transition: color .18s ease, background-color .18s ease !important;
}

.top-links a:hover,
.top-nav a:hover,
.sh-nav-links a:hover,
.top-links a.active,
.top-nav a.active,
.sh-nav-links a.active {
  color: #fff !important;
  background: rgba(255, 255, 255, .055) !important;
}

.top-links a.active::after,
.top-nav a.active::after,
.sh-nav-links a.active::after {
  background: var(--sg-brand-primary) !important;
  box-shadow: 0 0 18px rgba(var(--sg-brand-primary-rgb), .48) !important;
}

.icon-btn,
.sh-icon-btn,
.control-btn {
  min-width: var(--sg-touch-target) !important;
  min-height: var(--sg-touch-target) !important;
  border-color: var(--sg-border-light) !important;
  background: rgba(255, 255, 255, .045) !important;
  color: var(--sg-text-primary) !important;
}

.icon-btn:hover,
.sh-icon-btn:hover,
.control-btn:hover {
  border-color: var(--sg-border-focus) !important;
  background: rgba(var(--sg-brand-primary-rgb), .12) !important;
}

.btn-subscribe,
.sh-btn-vip,
.btn-connect,
.sg3-btn--primary,
.sgx-btn--primary,
.cinema-primary,
.sg-subscription-primary,
.nova-btn.primary {
  border: 1px solid rgba(255, 255, 255, .12) !important;
  background: linear-gradient(135deg, var(--sg-brand-primary-hover), var(--sg-brand-primary)) !important;
  color: #fff !important;
  box-shadow: 0 12px 30px rgba(var(--sg-brand-primary-rgb), .28) !important;
}

.btn-subscribe:hover,
.sh-btn-vip:hover,
.btn-connect:hover,
.sg3-btn--primary:hover,
.sgx-btn--primary:hover,
.cinema-primary:hover,
.sg-subscription-primary:hover,
.nova-btn.primary:hover {
  background: linear-gradient(135deg, #9851ff, var(--sg-brand-primary-hover)) !important;
  box-shadow: 0 16px 38px rgba(var(--sg-brand-primary-rgb), .38) !important;
}

/* Hero -------------------------------------------------------------------- */
.sg-hero-banner,
.cinema-hero,
.sg3-hero,
.sgx-hero,
.cinema-detail__hero,
.sg3-topic__hero,
.sh-live-hero,
.player-hero-shell {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate;
  border: 1px solid var(--sg-border-light) !important;
  border-radius: var(--sg-radius-hero) !important;
  background-color: var(--sg-bg-elevated) !important;
  box-shadow: var(--sg-shadow-panel) !important;
}

.cinema-hero::after,
.sg3-hero::after,
.sgx-hero::after,
.cinema-detail__hero::after,
.sg3-topic__hero::after,
.sh-live-hero::after,
.player-hero-shell::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(0, 0, 0, .18) 0, transparent 34%, rgba(0, 0, 0, .9) 100%),
    linear-gradient(90deg, rgba(0, 0, 0, .78) 0, rgba(0, 0, 0, .22) 52%, transparent 78%) !important;
}

:where(.cinema-hero__content, .sg3-hero__content, .sgx-hero__content, .cinema-detail__copy, .sg3-topic__body, .now-playing) {
  position: relative;
  z-index: 2;
}

:where(.cinema-hero h1, .sg3-hero h1, .sgx-hero h1, .cinema-detail__copy h1, .sg3-topic h1) {
  max-width: 18ch;
  font-weight: 850 !important;
  letter-spacing: -.035em !important;
  text-wrap: balance;
  text-shadow: 0 12px 34px rgba(0, 0, 0, .55) !important;
}

:where(.cinema-hero p, .sg3-hero p, .sgx-hero p, .cinema-detail__copy p, .sg3-topic p) {
  color: #d1d1d7 !important;
  max-width: 62ch;
}

/* Section rhythm and typography ------------------------------------------ */
.main,
.bein-page {
  color: var(--sg-text-primary);
}

.sg-section-container,
.cinema-section,
.sg3-section,
.sgx-section,
.section,
.sg-content-categories,
.sg-app-sections,
.sg3-library,
.sgx-library {
  position: relative;
}

.section__head,
.sg3-section__head,
.sgx-section__head,
.cinema-listing__head,
.sg-content-categories__head,
.sg-app-sections__head,
.sh-section-header,
.sg3-library__head,
.sgx-library__head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: var(--sg-space-md) !important;
}

:where(.section__head h2, .sg3-section__head h2, .sgx-section__title, .cinema-listing__head h2, .sg-content-categories__head h2, .sg-app-sections__head h2, .sh-section-title, .sg3-library__head h1, .sgx-library__head h1) {
  position: relative;
  margin: 0 !important;
  color: #fff !important;
  font-weight: 780 !important;
  letter-spacing: -.02em !important;
}

:where(.section__head h2, .sg3-section__head h2, .sgx-section__title, .cinema-listing__head h2, .sg-content-categories__head h2, .sg-app-sections__head h2, .sh-section-title)::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 1em;
  margin-inline-end: 9px;
  border-radius: 999px;
  vertical-align: -.08em;
  background: var(--sg-brand-primary) !important;
  box-shadow: 0 0 14px rgba(var(--sg-brand-primary-rgb), .42);
}

:where(.section__head a, .sg3-section__head a, .sgx-section__head a, .cinema-listing__head a, .sg-content-categories__head a, .sg-app-sections__head a) {
  color: var(--sg-brand-primary-hover) !important;
  font-weight: 650 !important;
  text-decoration: none;
}

/* Commercial content cards ------------------------------------------------ */
.sg-content-card,
.cinema-card,
.sg3-card,
.sgx-card,
.card,
.cinema-rank-card,
.sg-content-category,
.sg-app-category-card,
.episode-card,
.cinema-episode,
.dash-card,
.channel-card,
.plan-card,
.sg-fixture-card {
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid var(--sg-border-light) !important;
  border-radius: var(--sg-radius-card) !important;
  background: var(--sg-surface-1) !important;
  box-shadow: var(--sg-shadow-card) !important;
  transition: transform .22s var(--sg-ease-out), border-color .22s ease, box-shadow .22s ease !important;
}

:where(.sg-content-card, .cinema-card, .sg3-card, .sgx-card, .card, .cinema-rank-card, .sg-content-category, .sg-app-category-card, .episode-card, .cinema-episode, .dash-card, .channel-card, .plan-card, .sg-fixture-card):hover {
  z-index: 2;
  border-color: var(--sg-border-medium) !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 22px 54px rgba(0, 0, 0, .44) !important;
}

:where(.sg-content-card, .cinema-card, .sg3-card, .sgx-card, .card, .cinema-rank-card, .sg-content-category, .sg-app-category-card, .episode-card, .cinema-episode, .channel-card):active {
  transform: scale(.975) !important;
  border-color: var(--sg-border-focus) !important;
}

:where(.cinema-card__poster, .sg3-card__media, .sgx-card__media, .poster, .episode-thumb, .channel-logo) {
  background: #08080a !important;
}

:where(.cinema-card__poster, .sg3-card__media, .sgx-card__media, .poster, .episode-thumb) img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .45s var(--sg-ease-out), filter .3s ease !important;
}

:where(.cinema-card, .sg3-card, .sgx-card, .card):hover :where(.cinema-card__poster, .sg3-card__media, .sgx-card__media, .poster) img {
  transform: scale(1.035);
  filter: saturate(1.04) contrast(1.02);
}

:where(.cinema-card__body, .sg3-card__body, .sgx-card__body, .episode-info, .channel-copy) {
  background: linear-gradient(180deg, rgba(10, 10, 12, .94), var(--sg-surface-1)) !important;
}

:where(.cinema-card h3, .sg3-card h3, .sgx-card h3, .card h3, .episode-title-btn, .channel-title) {
  color: var(--sg-text-primary) !important;
  font-weight: 680 !important;
}

:where(.cinema-card small, .sg3-card small, .sgx-card small, .card small, .episode-info span, .channel-time, .recommended-line) {
  color: var(--sg-text-secondary) !important;
}

.sg-premium-badge,
.channel-access-badge.is-paid,
:where(.plan-card.featured, .plan-card.is-featured) .plan-tag,
:where(.sg3-card, .sgx-card, .cinema-card) [data-premium="true"] {
  border: 0 !important;
  background: linear-gradient(135deg, var(--sg-brand-premium-soft), var(--sg-brand-premium)) !important;
  color: #080604 !important;
  font-weight: 800 !important;
  box-shadow: 0 5px 16px rgba(215, 173, 85, .24) !important;
}

/* Chips, filters and forms ------------------------------------------------ */
.sg3-chip,
.sgx-chip,
.chip,
.filter-chip,
.sg3-select,
.sgx-select,
.quality-select,
.network-mode-select,
.qbtn,
.channel-view-btn,
input,
select,
textarea,
.form-control {
  min-height: var(--sg-touch-target);
  color: var(--sg-text-primary) !important;
  border-color: var(--sg-border-light) !important;
  background: rgba(255, 255, 255, .045) !important;
}

:where(.sg3-chip, .sgx-chip, .chip, .filter-chip, .qbtn, .channel-view-btn):hover {
  border-color: var(--sg-border-medium) !important;
  background: rgba(255, 255, 255, .075) !important;
}

:where(.sg3-chip, .sgx-chip, .chip, .filter-chip, .qbtn, .channel-view-btn).active,
:where(.sg3-chip, .sgx-chip, .chip, .filter-chip, .qbtn, .channel-view-btn)[aria-pressed="true"] {
  border-color: var(--sg-brand-primary) !important;
  background: rgba(var(--sg-brand-primary-rgb), .18) !important;
  color: #fff !important;
  box-shadow: 0 0 0 1px rgba(var(--sg-brand-primary-rgb), .14) inset !important;
}

input::placeholder,
textarea::placeholder {
  color: var(--sg-text-tertiary) !important;
}

/* Anime and wrestling brand portals -------------------------------------- */
.sg-brand-portals {
  padding: var(--sg-space-xl) 0 var(--sg-space-lg);
}

.sg-brand-portals__head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: var(--sg-space-md);
  padding-inline: clamp(16px, 3vw, 32px);
  margin-bottom: var(--sg-space-md);
}

.sg-brand-portals__head h2 {
  margin: 0;
  font-size: clamp(19px, 2.2vw, 28px);
  line-height: 1.25;
  letter-spacing: -.025em;
}

.sg-brand-portals__head p {
  margin: 4px 0 0;
  color: var(--sg-text-secondary);
  font-size: 13px;
}

.sg-brand-portals__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sg-space-md);
  padding-inline: clamp(16px, 3vw, 32px);
}

.sg-brand-portal {
  min-height: 220px;
  position: relative;
  display: flex;
  align-items: end;
  overflow: hidden;
  border: 1px solid var(--sg-border-light);
  border-radius: var(--sg-radius-panel);
  background: var(--sg-surface-1);
  color: #fff;
  text-decoration: none;
  isolation: isolate;
  box-shadow: var(--sg-shadow-card);
  transition: transform .22s var(--sg-ease-out), border-color .22s ease;
}

.sg-brand-portal:hover {
  transform: translateY(-3px);
  border-color: var(--sg-border-medium);
}

.sg-brand-portal img {
  position: absolute;
  inset: 0;
  z-index: -3;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s var(--sg-ease-out);
}

.sg-brand-portal:hover img { transform: scale(1.035); }

.sg-brand-portal::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background: linear-gradient(180deg, rgba(0, 0, 0, .08), rgba(0, 0, 0, .24) 44%, rgba(0, 0, 0, .94));
}

.sg-brand-portal::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: radial-gradient(440px 180px at 10% 100%, rgba(var(--sg-brand-primary-rgb), .3), transparent 70%);
}

.sg-brand-portal__copy {
  width: 100%;
  padding: 22px;
}

.sg-brand-portal__eyebrow {
  display: block;
  margin-bottom: 6px;
  color: #d6bcff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
}

.sg-brand-portal h3 {
  margin: 0 0 5px;
  font-size: clamp(22px, 3vw, 34px);
  font-weight: 850;
  letter-spacing: -.035em;
}

.sg-brand-portal p {
  margin: 0;
  color: #d2d2d8;
  font-size: 13px;
}

/* Live player ------------------------------------------------------------- */
body.sg-nova-live .bein-page {
  color: var(--sg-text-primary) !important;
}

body.sg-nova-live .player-hero-shell,
body.sg-nova-live .guide-panel {
  background: linear-gradient(180deg, rgba(16, 16, 20, .97), rgba(7, 7, 9, .99)) !important;
  border-color: var(--sg-border-light) !important;
  box-shadow: var(--sg-shadow-panel) !important;
}

body.sg-nova-live .player-shell {
  overflow: hidden !important;
  border: 1px solid var(--sg-border-light) !important;
  border-radius: 16px !important;
  background: #000 !important;
  box-shadow: 0 20px 62px rgba(0, 0, 0, .62) !important;
}

body.sg-nova-live .player-shell::before {
  background: linear-gradient(180deg, rgba(0, 0, 0, .48), transparent 24%, transparent 62%, rgba(0, 0, 0, .88)) !important;
}

body.sg-nova-live .big-play {
  border: 1px solid rgba(255, 255, 255, .2) !important;
  background: linear-gradient(145deg, var(--sg-brand-primary-hover), var(--sg-brand-primary)) !important;
  box-shadow: 0 18px 52px rgba(var(--sg-brand-primary-rgb), .4) !important;
}

body.sg-nova-live .player-controls {
  background: linear-gradient(180deg, transparent, rgba(0, 0, 0, .9)) !important;
}

body.sg-nova-live .progress {
  accent-color: var(--sg-brand-primary-hover) !important;
}

body.sg-nova-live .now-playing {
  border-top-color: var(--sg-border-light) !important;
  background: rgba(8, 8, 10, .82) !important;
}

body.sg-nova-live .channel-card {
  background: var(--sg-surface-1) !important;
  border-color: var(--sg-border-light) !important;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .28) !important;
}

body.sg-nova-live .channel-card:hover,
body.sg-nova-live .channel-card.active,
body.sg-nova-live .channel-card.active-channel {
  border-color: var(--sg-border-focus) !important;
  background: var(--sg-surface-2) !important;
  box-shadow: 0 18px 46px rgba(0, 0, 0, .44), 0 0 0 1px rgba(var(--sg-brand-primary-rgb), .1) inset !important;
}

body.sg-nova-live .channel-card.active::before,
body.sg-nova-live .channel-card.active-channel::before {
  background: var(--sg-brand-primary) !important;
}

.sg-player-watermark {
  position: absolute !important;
  top: 18px !important;
  right: 18px !important;
  z-index: 50 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  opacity: .78 !important;
  pointer-events: none !important;
  color: #fff !important;
  font-family: var(--sg-font-system) !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, .88) !important;
}

.sg-player-watermark__brand {
  font-size: 15px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: .08em;
}

.sg-player-watermark__live,
.sg-player-watermark small {
  margin-top: 5px;
  color: var(--sg-brand-primary-hover) !important;
  font-size: 9px !important;
  line-height: 1;
  font-weight: 850 !important;
  letter-spacing: .19em;
}

.sg-subscription-gate {
  background: rgba(0, 0, 0, .84) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}

.sg-subscription-card {
  border: 1px solid var(--sg-border-medium) !important;
  border-radius: var(--sg-radius-panel) !important;
  background: linear-gradient(180deg, var(--sg-surface-2), var(--sg-surface-1)) !important;
  box-shadow: var(--sg-shadow-panel) !important;
}

.sg-subscription-icon {
  color: var(--sg-brand-premium) !important;
  background: rgba(215, 173, 85, .1) !important;
}

/* Auth/account surfaces --------------------------------------------------- */
body.nova-auth-page {
  min-height: 100vh;
  background:
    radial-gradient(760px 400px at 50% -8%, rgba(var(--sg-brand-primary-rgb), .2), transparent 72%),
    #000 !important;
}

.nova-auth-shell {
  border: 1px solid var(--sg-border-light) !important;
  border-radius: var(--sg-radius-panel) !important;
  background: rgba(10, 10, 12, .88) !important;
  box-shadow: var(--sg-shadow-panel) !important;
  backdrop-filter: blur(24px) saturate(150%);
  -webkit-backdrop-filter: blur(24px) saturate(150%);
}

.nova-badge {
  border-color: rgba(var(--sg-brand-primary-rgb), .3) !important;
  background: rgba(var(--sg-brand-primary-rgb), .1) !important;
  color: #d8c1ff !important;
}

.nova-google,
.nova-btn,
.nova-profile,
.nova-row {
  border-color: var(--sg-border-light) !important;
}

/* Footer ------------------------------------------------------------------ */
.sg3-footer {
  border-top-color: var(--sg-border-light) !important;
  background: linear-gradient(180deg, rgba(7, 7, 9, .92), #000) !important;
}

.sg3-footer a { color: var(--sg-text-secondary) !important; }
.sg3-footer a:hover { color: #fff !important; }

/* Mobile system ----------------------------------------------------------- */
@media (max-width: 760px) {
  body.sg-brand-commercial,
  body.sg-cinema-body,
  body.sg-nova-live,
  body.nova-auth-page {
    font-family: var(--sg-font-system) !important;
    background-image: none !important;
  }

  .sg-header,
  .bein-header,
  .sh-navbar {
    background: rgba(0, 0, 0, .86) !important;
    backdrop-filter: saturate(170%) blur(20px) !important;
    -webkit-backdrop-filter: saturate(170%) blur(20px) !important;
  }

  .cinema-hero,
  .sg3-hero,
  .sgx-hero,
  .cinema-detail__hero,
  .sg3-topic__hero,
  .sh-live-hero,
  .player-hero-shell {
    border-radius: 0 !important;
    border-inline: 0 !important;
  }

  .sg-brand-portals {
    padding-top: 18px;
  }

  .sg-brand-portals__head {
    padding-inline: var(--sg-space-lg);
  }

  .sg-brand-portals__grid {
    display: flex;
    gap: var(--sg-space-md);
    overflow-x: auto;
    padding-inline: var(--sg-space-lg);
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .sg-brand-portals__grid::-webkit-scrollbar { display: none; }

  .sg-brand-portal {
    flex: 0 0 min(82vw, 340px);
    min-height: 190px;
    scroll-snap-align: start;
  }

  .sg-brand-portal__copy { padding: 18px; }

  body.sg-nova-live .player-shell {
    border-radius: 0 !important;
    border-inline: 0 !important;
  }

  .sg-player-watermark {
    top: 12px !important;
    right: 12px !important;
  }
}

@media (hover: none) {
  :where(.sg-content-card, .cinema-card, .sg3-card, .sgx-card, .card, .channel-card):hover {
    transform: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* Mixed-direction brand lockup: prevent RTL reordering and legacy pseudo labels. */
.brand__text {
  direction: ltr;
  unicode-bidi: isolate;
  display: inline-flex !important;
  align-items: baseline;
  gap: 6px;
  white-space: nowrap;
}

.sgx-signature .brand__text::after {
  content: none !important;
  display: none !important;
}

.sg3-footer__brand h2,
.nova-brand strong {
  direction: ltr;
  unicode-bidi: isolate;
}
