/* Nova Düello Prep v2 — 2/4 kişi, telefon + masaüstü, köy arka planı */

/* Eski prep override'larını etkisizleştir */
#nova-duel-epic-root.ndep-kids-village #nova-duel-prep-phase.ndep-prep-v2.ndep-active::before,
body.nova-duel-land-flow #nova-duel-prep-phase.ndep-prep-v2.ndep-active::before {
  content: none !important;
  display: none !important;
}

#nova-duel-prep-phase.ndep-prep-v2 {
  position: relative;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: none;
  align-items: stretch;
  justify-content: stretch;
  overflow: hidden;
  box-sizing: border-box;
  color: #143528;
  animation: none !important;
  transform: none !important;
}

#nova-duel-prep-phase.ndep-prep-v2.ndep-active {
  display: flex;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    var(--ndep-prep-bg, none) center / cover no-repeat,
    linear-gradient(160deg, #7ec8e8 0%, #b8e6a8 45%, #f0d48a 100%);
  transform: scale(1.03);
  animation: ndep-prep-bg-pan 20s ease-in-out infinite alternate;
}

@keyframes ndep-prep-bg-pan {
  from { transform: scale(1.03) translate3d(-1%, 0, 0); }
  to { transform: scale(1.07) translate3d(1.2%, -0.8%, 0); }
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-veil {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(255, 252, 245, 0.42), rgba(255, 255, 255, 0.18) 40%, rgba(20, 50, 40, 0.28)),
    radial-gradient(ellipse 80% 70% at 50% 45%, rgba(255, 255, 255, 0.2), transparent 70%);
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-stage {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding:
    max(10px, env(safe-area-inset-top, 0px))
    max(12px, env(safe-area-inset-right, 0px))
    max(10px, env(safe-area-inset-bottom, 0px))
    max(12px, env(safe-area-inset-left, 0px));
  box-sizing: border-box;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: clamp(8px, 1.6vh, 16px);
  min-height: 0;
}

/* —— Üst: marka + başlık + geri sayım —— */
#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-top {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 8px 12px;
  min-height: 0;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-brand {
  justify-self: start;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: clamp(11px, 2.2vh, 14px);
  font-weight: 900;
  letter-spacing: 0.04em;
  color: #0f5132;
  background: linear-gradient(90deg, rgba(212, 245, 200, 0.95), rgba(200, 238, 254, 0.95));
  border: 2px solid rgba(255, 255, 255, 0.95);
  box-shadow: 0 4px 12px rgba(40, 100, 60, 0.14);
  white-space: nowrap;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-heading {
  margin: 0;
  justify-self: center;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-title-main {
  display: block;
  font-size: clamp(20px, 4.2vh, 34px);
  font-weight: 900;
  line-height: 1.05;
  color: #143528;
  text-shadow: 0 2px 0 rgba(255, 255, 255, 0.75);
  background: none;
  -webkit-background-clip: unset;
  background-clip: unset;
  filter: none;
  animation: none;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-title-sub {
  display: block;
  font-size: clamp(11px, 2.2vh, 14px);
  font-weight: 800;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #2f6b48;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-timer {
  position: relative;
  justify-self: end;
  width: clamp(64px, 12vh, 92px);
  height: clamp(64px, 12vh, 92px);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-ring-glow {
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 168, 40, 0.45), transparent 70%);
  filter: blur(5px);
  animation: ndep-ring-glow 1.5s ease-in-out infinite alternate;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: conic-gradient(#f59e0b var(--ndep-pct, 0%), #ff8a00 var(--ndep-pct, 0%), rgba(255, 255, 255, 0.28) 0);
  mask: radial-gradient(farthest-side, transparent calc(100% - 8px), #000 calc(100% - 7px));
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 8px), #000 calc(100% - 7px));
}

#nova-duel-prep-phase.ndep-prep-v2 #ndep-count {
  position: relative;
  z-index: 1;
  font-size: clamp(26px, 5.5vh, 40px);
  font-weight: 900;
  color: #143528;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.85);
}

/* —— Oyuncu kartları —— */
#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-roster {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(10px, 2vw, 20px);
  align-content: stretch;
  min-height: 0;
  height: 100%;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-roster.is-lobby-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-card {
  min-width: 0;
  min-height: 0;
  height: 100%;
  max-height: 100%;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: clamp(6px, 1.2vh, 12px);
  padding: clamp(8px, 1.6vh, 14px);
  border-radius: clamp(16px, 2.5vw, 24px);
  background: linear-gradient(165deg, rgba(255, 252, 245, 0.94), rgba(255, 255, 255, 0.88));
  border: 3px solid rgba(255, 255, 255, 0.95);
  box-shadow:
    0 12px 28px rgba(40, 90, 50, 0.16),
    0 0 0 3px rgba(90, 170, 90, 0.14);
  box-sizing: border-box;
  overflow: hidden;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-card--a {
  box-shadow:
    0 12px 28px rgba(30, 120, 160, 0.18),
    0 0 0 3px rgba(56, 180, 230, 0.28);
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-card--b,
#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-card--c,
#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-card--d {
  box-shadow:
    0 12px 28px rgba(160, 100, 30, 0.16),
    0 0 0 3px rgba(245, 176, 70, 0.28);
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-card-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: clamp(8px, 1.4vw, 12px);
  align-items: center;
  min-width: 0;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-avatar-wrap {
  width: clamp(48px, 9vh, 72px);
  max-width: 72px;
  margin: 0;
  flex-shrink: 0;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-avatar-wrap .avatar-frame-wrap {
  width: 100%;
  display: block;
  line-height: 0;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-avatar-wrap img,
#nova-duel-prep-phase.ndep-prep-v2 .ndep-avatar-wrap .avatar-framed {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1;
  max-height: none;
  object-fit: cover !important;
  border-radius: 14px !important;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.2);
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-card-meta {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-name {
  width: 100%;
  max-width: 100%;
  font-size: clamp(13px, 2.8vh, 18px);
  font-weight: 900;
  color: #143528 !important;
  text-align: left;
  text-shadow: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 0;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-cups {
  margin: 0;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(253, 230, 138, 0.55);
  border: 1px solid rgba(217, 119, 6, 0.35);
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-cup-val {
  font-size: clamp(11px, 2.2vh, 14px);
  font-weight: 900;
  color: #92400e;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-cup-ico,
#nova-duel-prep-phase.ndep-prep-v2 .ndep-cup-lbl {
  font-size: clamp(10px, 2vh, 12px);
  color: #a16207;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-card-hero {
  min-height: 0;
  height: 100%;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 6px;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-hero-box {
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: none;
  border-radius: 16px;
  background:
    radial-gradient(ellipse 90% 70% at 50% 100%, rgba(56, 189, 248, 0.18), transparent 58%),
    linear-gradient(180deg, rgba(236, 253, 245, 0.9), rgba(220, 242, 255, 0.85));
  border: 2px solid rgba(90, 170, 90, 0.28);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: relative;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-hero-box.ndep-has-hero {
  border-color: rgba(56, 160, 90, 0.45);
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-hero-badge-out {
  height: auto;
  min-height: 0;
  margin: 0;
  max-height: 36px;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-hero-badge-out:empty {
  display: none;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-hero-stage,
#nova-duel-prep-phase.ndep-prep-v2 .ndep-hero-mount {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

#nova-duel-prep-phase.ndep-prep-v2 .ndep-hero-mount {
  transform: scale(var(--ndep-hero-scale, 0.85));
  transform-origin: center bottom;
}

/* —— Dar / kısa ekranlar —— */
@media (max-width: 820px) and (orientation: landscape) {
  #nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-top {
    grid-template-columns: auto 1fr auto;
  }
  #nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-brand {
    font-size: 11px;
    padding: 4px 10px;
  }
  #nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-title-main {
    font-size: clamp(16px, 4.5vh, 22px);
  }
  #nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-roster.is-lobby-4 .ndep-prep-card-head {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
  }
  #nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-roster.is-lobby-4 .ndep-prep-card-meta {
    align-items: center;
  }
  #nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-roster.is-lobby-4 .ndep-name {
    text-align: center;
  }
  #nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-roster.is-lobby-4 .ndep-avatar-wrap {
    width: clamp(40px, 10vh, 56px);
  }
}

@media (max-height: 420px) {
  #nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-stage {
    gap: 6px;
    padding-top: max(6px, env(safe-area-inset-top, 0px));
    padding-bottom: max(6px, env(safe-area-inset-bottom, 0px));
  }
  #nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-title-sub {
    display: none;
  }
  #nova-duel-prep-phase.ndep-prep-v2 .ndep-cups {
    display: none;
  }
  #nova-duel-prep-phase.ndep-prep-v2 .ndep-hero-badge-out {
    display: none !important;
  }
  #nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-card {
    padding: 6px;
    gap: 4px;
  }
}

/* Portrait fallback: 2 sütun / 4'te 2x2 */
@media (orientation: portrait) and (max-width: 700px) {
  #nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-top {
    grid-template-columns: 1fr;
    justify-items: center;
  }
  #nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-brand,
  #nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-timer {
    justify-self: center;
  }
  #nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-roster.is-lobby-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Eski prep parçalarını etkisizleştir (kalıntı class varsa) */
#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-flares,
#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-vignette,
#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-gridlines,
#nova-duel-prep-phase.ndep-prep-v2 .ndep-prep-hint,
#nova-duel-prep-phase.ndep-prep-v2 .ndep-vs-wrap {
  display: none !important;
}
