/* Ana ekran — Bunny arka plan videosu (döngü, muted) */
#main-screen,
#main-screen.container {
  background: transparent !important;
  background-image: none !important;
}

#main-screen {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.nova-main-bg-video-layer {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  background: transparent;
  opacity: 0;
  transition: opacity 0.35s ease;
}

body.nova-main-bg-video-on .nova-main-bg-video-layer {
  opacity: 1;
}

body.nova-main-bg-video-on .nova-main-bg-video-layer.is-active {
  opacity: 1;
}

.nova-main-bg-video-layer.is-active {
  opacity: 1;
}

/* Video yüklenemezse siyah yerine hafif gradyan */
.nova-main-bg-video-layer.is-gradient-fallback {
  opacity: 1;
  background:
    radial-gradient(ellipse 120% 80% at 50% 0%, rgba(30, 58, 138, 0.38) 0%, transparent 58%),
    radial-gradient(ellipse 90% 60% at 80% 100%, rgba(6, 78, 59, 0.22) 0%, transparent 55%),
    linear-gradient(180deg, #0a1628 0%, #020611 48%, #0b1220 100%);
}

body.nova-main-bg-gradient-fallback #main-screen::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse 100% 70% at 50% -10%, rgba(59, 130, 246, 0.12) 0%, transparent 60%),
    linear-gradient(180deg, rgba(2, 6, 17, 0) 0%, rgba(2, 6, 17, 0.35) 100%);
}

.nova-main-bg-video,
.nova-main-bg-image {
  position: absolute;
  inset: -1%;
  width: 102%;
  height: 102%;
  object-fit: cover;
  object-position: center center;
  transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  pointer-events: none;
  z-index: 1;
}

.nova-main-bg-backdrop {
  display: none !important;
  pointer-events: none;
}

.nova-main-bg-image[hidden] {
  display: none !important;
}

/* Tarayıcı oynatıcı kontrolleri / ortadaki play — asla görünmesin */
.nova-main-bg-video::-webkit-media-controls {
  display: none !important;
}
.nova-main-bg-video::-webkit-media-controls-enclosure {
  display: none !important;
}
.nova-main-bg-video::-webkit-media-controls-start-playback-button {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.nova-main-bg-video-scrim {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(2, 6, 17, 0.55) 0%, rgba(2, 6, 17, 0.2) 35%, rgba(2, 6, 17, 0.35) 100%),
    radial-gradient(ellipse 90% 70% at 50% 40%, transparent 0%, rgba(2, 6, 17, 0.45) 100%);
}

.nova-main-bg-video-iframe-wrap {
  display: none !important;
  visibility: hidden !important;
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.nova-main-bg-video-iframe {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 120%;
  height: 120%;
  transform: translate(-50%, -50%);
  border: 0;
  pointer-events: none;
}

#main-screen {
  z-index: 1;
}

#main-screen > :not(.nova-main-bg-video-layer) {
  position: relative;
  z-index: 2;
}

#main-screen > .buttons:not(.nova-main-lobby),
#main-screen > .nova-main-lobby.buttons,
#main-screen > .nova-admin-portal-slot {
  z-index: 12 !important;
}

body.nova-main-bg-video-on #main-screen.container {
  background: transparent !important;
}

/* Windows “animasyonları azalt” açık olsa bile arka plan videosu kalsın */
@media (prefers-reduced-motion: reduce) {
  .nova-main-bg-video-layer {
    transition: none;
  }
}

/* Masaüstü: Bunny iframe yedek — play düğmesi kırpılır */
.nova-main-bg-video-iframe-wrap.is-bg-fallback {
  display: block !important;
  visibility: visible !important;
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  opacity: 1;
}
.nova-main-bg-video-iframe-wrap.is-bg-fallback .nova-main-bg-video-iframe {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 180vmax;
  height: 180vmax;
  max-width: none;
  max-height: none;
  transform: translate(-50%, -50%);
  border: 0;
  pointer-events: none;
}

/* Masaüstü: büyük telefon kabuğu — ekranı doldurur, telefon oranı bozulmaz */
@media (min-width: 901px) and (hover: hover) and (pointer: fine) {
  body.nova-main-screen-visible {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: clamp(4px, 0.8vh, 10px) !important;
    min-height: 100dvh !important;
    min-height: 100svh !important;
    background: #020611 !important;
    box-sizing: border-box !important;
  }

  body.nova-main-screen-visible #main-screen,
  body.nova-main-screen-visible #main-screen.container {
    --nova-main-phone-h: min(98dvh, 98svh, calc(100dvh - 8px));
    /* ~modern telefon oranı; yükseklik öncelikli, olabildiğince büyük */
    --nova-main-phone-w: min(
      96vw,
      calc(100vw - 8px),
      calc(var(--nova-main-phone-h) * 0.52),
      720px
    );
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    width: var(--nova-main-phone-w) !important;
    max-width: var(--nova-main-phone-w) !important;
    height: var(--nova-main-phone-h) !important;
    max-height: var(--nova-main-phone-h) !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    overflow: hidden !important;
    border-radius: clamp(18px, 2vw, 28px) !important;
    box-sizing: border-box !important;
    padding:
      clamp(10px, 1.4vh, 16px)
      clamp(10px, 2.2%, 18px)
      clamp(8px, 1.2vh, 14px) !important;
    gap: clamp(8px, 1.2vh, 14px) !important;
  }

  body.nova-main-screen-visible #main-screen .main-profile-hero {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.nova-main-screen-visible #main-screen > .buttons,
  body.nova-main-screen-visible #main-screen > .nova-main-lobby.buttons {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  body.nova-main-bg-video-on .nova-main-bg-video-layer {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border-radius: inherit;
  }

  body.nova-main-bg-video-on .nova-main-bg-video,
  body.nova-main-bg-video-on .nova-main-bg-image {
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    object-position: center 38%;
    border-radius: inherit;
  }

  body.nova-main-bg-video-on .nova-main-bg-video-scrim {
    border-radius: inherit;
  }

  body.nova-main-bg-video-on .nova-main-bg-video-iframe-wrap.is-bg-fallback {
    position: absolute !important;
    inset: 0 !important;
    border-radius: inherit;
  }

  body.nova-main-bg-video-on .nova-main-bg-video-iframe-wrap.is-bg-fallback .nova-main-bg-video-iframe {
    width: 140vmax;
    height: 140vmax;
  }
}

#main-screen .duel-entry-gate-note,
.duel-entry-gate-note {
  display: none !important;
  visibility: hidden !important;
}