﻿/* -----------------------------------------------------------
   UNIFIED HOME PAGE BACKGROUND â€” One Continuous Esports Arena
   ----------------------------------------------------------- */

/* Canvas color safety (overscroll / rubber-band) */
html {
  background: #050508 !important;
}

/* ONE unified arena background for the entire page below the hero */
body:not(.admin-body) {
  isolation: isolate !important;
  background-color: #050508 !important;
  background-image:
    /* ── Edge atmospheric glow: top-left ── */
    radial-gradient(ellipse 45% 40% at 8% 12%,
      rgba(255, 18, 48, .055), transparent 70%),
    /* ── Edge atmospheric glow: bottom-right ── */
    radial-gradient(ellipse 40% 35% at 92% 88%,
      rgba(255, 18, 48, .045), transparent 65%),
    /* ── Edge glow: left side ── */
    radial-gradient(ellipse 18% 60% at 0% 50%,
      rgba(220, 20, 50, .05), transparent 70%),
    /* ── Edge glow: right side ── */
    radial-gradient(ellipse 18% 60% at 100% 50%,
      rgba(220, 20, 50, .04), transparent 70%),
    /* ── Red smoke/fog: top ── */
    radial-gradient(ellipse 130% 22% at 30% 0%,
      rgba(180, 12, 38, .06), transparent 80%),
    /* ── Red smoke/fog: bottom ── */
    radial-gradient(ellipse 110% 18% at 70% 100%,
      rgba(180, 12, 38, .05), transparent 75%),
    /* ── Center reading area darkening ── */
    radial-gradient(ellipse 60% 50% at 50% 45%,
      transparent 20%, rgba(5, 5, 8, .40) 100%),
    /* ── Cinematic vignette ── */
    radial-gradient(ellipse 140% 120% at 50% 50%,
      transparent 30%, rgba(2, 2, 5, .70) 100%) !important;
  background-attachment: scroll !important;
}

/* Desktop: pin atmosphere to viewport so lines flow continuously while scrolling */
@media (hover:hover) and (min-width:1025px) {
  body:not(.admin-body) {
    background-attachment: fixed !important;
  }
}

/* Make ALL home page sections transparent so the unified body background shows through */
body:not(.admin-body) .section,
body:not(.admin-body) section.section,
body:not(.admin-body) .section.white,
body:not(.admin-body) .section.soft,
body:not(.admin-body) .section.tight,
body:not(.admin-body) section.countdown-section,
body:not(.admin-body) section.prize-showcase-section,
body:not(.admin-body) section.sponsors-section,
body:not(.admin-body) section.leadership-section,
body:not(.admin-body) section.memories,
body:not(.admin-body) section.highlights-showcase,
body:not(.admin-body) section.phases,
body:not(.admin-body) #games.section,
/* High-specificity beats for previously-styled sections */
body:not(.admin-body) section.section.white.memories,
body:not(.admin-body) section.section.soft.phases,
body:not(.admin-body) section.section.soft.features.highlights-showcase,
body:not(.admin-body) section.section.tight.countdown-section,
body:not(.admin-body) section.section.sponsors-section[data-sponsors],
body:not(.admin-body) section.section.leadership-section[data-leadership],
body:not(.admin-body) section#games.section.white,
body:not(.admin-body) section.prize-showcase-section#prize-pool {
  background: transparent !important;
  background-image: none !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

/* No visible rectangular boundaries anywhere between sections */
body:not(.admin-body) main > section {
  border: 0 !important;
  outline: 0 !important;
}

/* Remove individual section ::before/::after diagonal lines â€” the body handles them */
body:not(.admin-body) .sponsors-section[data-sponsors]::before,
body:not(.admin-body) .sponsors-section[data-sponsors]::after,
body:not(.admin-body) .leadership-section[data-leadership]::before,
body:not(.admin-body) .leadership-section[data-leadership]::after {
  display: none !important;
}

/* One global background only â€” per-section decorative layers removed
   so nothing visually resets at section boundaries */
body:not(.admin-body) .prize-showcase-section::before,
body:not(.admin-body) .prize-showcase-section::after,
body:not(.admin-body) #games.section.white::before,
body:not(.admin-body) #games.section.white::after {
  display: none !important;
}

/* -----------------------------------------------------------
   CINEMATIC ESPORTS ARENA -- Premium Static Background Layers
   ----------------------------------------------------------- */

main:not(.admin-main) {
  isolation: isolate !important;
}

/* -- Layer 1: INTENSE corner energy beams + diagonal neon lines -- */
body:not(.admin-body)::before {
  content: '' !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  mix-blend-mode: screen !important;
  background-image:
    /* INTENSE BEAM: top-left corner */
    linear-gradient(142deg,
      rgba(255, 12, 42, .28) 0%,
      rgba(255, 12, 42, .12) 3%,
      rgba(200, 8, 30, .04) 8%,
      transparent 20%),
    /* INTENSE BEAM: bottom-right corner */
    linear-gradient(-38deg,
      rgba(255, 12, 42, .22) 0%,
      rgba(255, 12, 42, .09) 4%,
      rgba(180, 6, 25, .03) 10%,
      transparent 22%),
    /* BEAM: top-right accent */
    linear-gradient(215deg,
      rgba(255, 22, 52, .16) 0%,
      rgba(220, 10, 38, .05) 5%,
      transparent 16%),
    /* BEAM: bottom-left accent */
    linear-gradient(32deg,
      rgba(255, 22, 52, .12) 0%,
      rgba(200, 8, 32, .04) 4%,
      transparent 14%),
    /* Sharp diagonal neon line 1 */
    linear-gradient(148deg,
      transparent 36%,
      rgba(255, 18, 48, .035) 41%,
      rgba(255, 28, 62, .055) 50%,
      rgba(255, 18, 48, .035) 59%,
      transparent 64%),
    /* Sharp diagonal neon line 2 */
    linear-gradient(-32deg,
      transparent 38%,
      rgba(255, 15, 42, .025) 44%,
      rgba(255, 22, 52, .04) 50%,
      rgba(255, 15, 42, .025) 56%,
      transparent 62%),
    /* Thin repeating diagonal lines */
    repeating-linear-gradient(145deg,
      transparent 0 110px,
      rgba(255, 20, 48, .018) 110px 111px,
      transparent 111px 220px),
    repeating-linear-gradient(-35deg,
      transparent 0 150px,
      rgba(255, 18, 44, .014) 150px 151px,
      transparent 151px 300px) !important;
  background-size: auto !important;
}

/* -- Layer 2: Ember particles + N-shapes + geometric lines -- */
main:not(.admin-main)::before {
  content: '' !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  mix-blend-mode: screen !important;
  background-image:
    radial-gradient(320px 260px at 8% 25%, rgba(255,18,48,.04), transparent 70%),
    radial-gradient(280px 240px at 90% 70%, rgba(255,18,48,.035), transparent 65%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800' height='800'%3E%3Cpath d='M100 650L100 150L700 650L700 150' fill='none' stroke='rgba(255,25,45,.025)' stroke-width='1.8' stroke-linecap='round'/%3E%3Cpath d='M130 620L130 180L670 620' fill='none' stroke='rgba(255,30,50,.015)' stroke-width='.9'/%3E%3Cline x1='0' y1='300' x2='300' y2='0' stroke='rgba(255,25,45,.03)' stroke-width='.6'/%3E%3Cline x1='800' y1='300' x2='500' y2='0' stroke='rgba(255,25,45,.03)' stroke-width='.6'/%3E%3Cline x1='0' y1='500' x2='500' y2='800' stroke='rgba(255,25,45,.02)' stroke-width='.5'/%3E%3Cline x1='800' y1='500' x2='300' y2='800' stroke='rgba(255,25,45,.02)' stroke-width='.5'/%3E%3Ccircle cx='95' cy='48' r='5' fill='rgba(255,35,55,.10)'/%3E%3Ccircle cx='95' cy='48' r='1.5' fill='rgba(255,55,75,.55)'/%3E%3Ccircle cx='380' cy='135' r='4' fill='rgba(255,35,55,.08)'/%3E%3Ccircle cx='380' cy='135' r='1.2' fill='rgba(255,50,70,.50)'/%3E%3Ccircle cx='620' cy='75' r='3.5' fill='rgba(255,40,60,.09)'/%3E%3Ccircle cx='620' cy='75' r='1' fill='rgba(255,60,80,.52)'/%3E%3Ccircle cx='210' cy='310' r='4.5' fill='rgba(255,35,55,.07)'/%3E%3Ccircle cx='210' cy='310' r='1.3' fill='rgba(255,50,70,.48)'/%3E%3Ccircle cx='530' cy='380' r='3' fill='rgba(255,40,60,.09)'/%3E%3Ccircle cx='530' cy='380' r='1' fill='rgba(255,55,75,.50)'/%3E%3Ccircle cx='70' cy='520' r='4' fill='rgba(255,40,60,.08)'/%3E%3Ccircle cx='70' cy='520' r='1.2' fill='rgba(255,55,75,.48)'/%3E%3Ccircle cx='360' cy='580' r='3.5' fill='rgba(255,35,55,.07)'/%3E%3Ccircle cx='360' cy='580' r='1' fill='rgba(255,50,70,.45)'/%3E%3Ccircle cx='680' cy='470' r='5' fill='rgba(255,35,55,.09)'/%3E%3Ccircle cx='680' cy='470' r='1.5' fill='rgba(255,50,70,.48)'/%3E%3Ccircle cx='170' cy='180' r='2.5' fill='rgba(255,45,65,.08)'/%3E%3Ccircle cx='170' cy='180' r='.8' fill='rgba(255,65,85,.50)'/%3E%3Ccircle cx='500' cy='220' r='3' fill='rgba(255,40,60,.07)'/%3E%3Ccircle cx='500' cy='220' r='1' fill='rgba(255,55,75,.47)'/%3E%3Ccircle cx='290' cy='450' r='4' fill='rgba(255,35,55,.09)'/%3E%3Ccircle cx='290' cy='450' r='1.3' fill='rgba(255,50,70,.50)'/%3E%3Ccircle cx='710' cy='600' r='3' fill='rgba(255,40,60,.07)'/%3E%3Ccircle cx='710' cy='600' r='.9' fill='rgba(255,55,75,.45)'/%3E%3Ccircle cx='45' cy='350' r='2' fill='rgba(255,45,65,.07)'/%3E%3Ccircle cx='45' cy='350' r='.7' fill='rgba(255,65,85,.48)'/%3E%3Ccircle cx='640' cy='280' r='3.5' fill='rgba(255,35,55,.08)'/%3E%3Ccircle cx='640' cy='280' r='1.1' fill='rgba(255,50,70,.50)'/%3E%3Ccircle cx='120' cy='620' r='2.5' fill='rgba(255,40,60,.08)'/%3E%3Ccircle cx='120' cy='620' r='.8' fill='rgba(255,55,75,.50)'/%3E%3Ccircle cx='440' cy='500' r='4' fill='rgba(255,35,55,.07)'/%3E%3Ccircle cx='440' cy='500' r='1.2' fill='rgba(255,50,70,.48)'/%3E%3Ccircle cx='250' cy='70' r='3' fill='rgba(255,45,65,.08)'/%3E%3Ccircle cx='250' cy='70' r='1' fill='rgba(255,60,80,.50)'/%3E%3Ccircle cx='580' cy='160' r='2' fill='rgba(255,40,60,.07)'/%3E%3Ccircle cx='580' cy='160' r='.7' fill='rgba(255,55,75,.45)'/%3E%3Ccircle cx='750' cy='350' r='3' fill='rgba(255,35,55,.08)'/%3E%3Ccircle cx='750' cy='350' r='1' fill='rgba(255,50,70,.48)'/%3E%3Ccircle cx='480' cy='700' r='4' fill='rgba(255,40,60,.07)'/%3E%3Ccircle cx='480' cy='700' r='1.2' fill='rgba(255,55,75,.45)'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat, no-repeat, repeat !important;
  background-position: 8% 25%, 90% 70%, 0 0 !important;
}

/* -- Layer 3: Corner accents + atmospheric depth -- */
main:not(.admin-main)::after {
  content: '' !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  mix-blend-mode: screen !important;
  background-image:
    /* Top-left corner accent glow */
    radial-gradient(ellipse 30% 25% at 3% 5%,
      rgba(255, 15, 42, .06), transparent 70%),
    /* Bottom-right corner accent glow */
    radial-gradient(ellipse 28% 22% at 97% 95%,
      rgba(255, 15, 42, .05), transparent 65%),
    /* Top-right subtle glow */
    radial-gradient(ellipse 20% 18% at 95% 8%,
      rgba(255, 20, 48, .03), transparent 60%),
    /* Bottom-left subtle glow */
    radial-gradient(ellipse 20% 18% at 5% 92%,
      rgba(255, 20, 48, .025), transparent 60%),
    /* Horizontal ambient line */
    linear-gradient(0deg,
      transparent 44%,
      rgba(255, 15, 40, .012) 49%,
      rgba(255, 20, 48, .018) 50%,
      rgba(255, 15, 40, .012) 51%,
      transparent 56%) !important;
}

@media (max-width: 768px) {
  main:not(.admin-main)::before { background-size: auto !important; }
  main:not(.admin-main)::after  { background-size: auto !important; }
}
/* -----------------------------------------------------------
   COUNTDOWN SECTION â€” fully merged into the global arena.
   Panel: transparent, no border, no shadow â†’ zero division line.
   Local electric layers removed; the single global fixed system
   (body cables + main bolts) carries the effect across every
   section boundary without resetting.
   ----------------------------------------------------------- */

body:not(.admin-body) .countdown-section .countdown-panel {
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Remove cut-corner pseudo-elements on homepage */
body:not(.admin-body) .countdown-section .countdown-panel::before,
body:not(.admin-body) .countdown-section .countdown-panel::after {
  display: none !important;
}

/* Countdown text stays crisp over the shared background */
body:not(.admin-body) .countdown-section .countdown-copy,
body:not(.admin-body) .countdown-section .countdown-date {
  position: relative !important;
  z-index: 2 !important;
  text-shadow: 0 2px 14px rgba(4, 6, 10, .9) !important;
}

/* -----------------------------------------------------------
   PRIZE SHOWCASE â€” synchronized pair carousel
   ----------------------------------------------------------- */

.prize-showcase-section {
  position: relative !important;
  padding: 80px 0 88px !important;
  background: #080A12 !important;
  overflow: hidden !important;
}

/* -- Animated neon background -- */
.prize-showcase-section::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    repeating-linear-gradient(
      -55deg,
      transparent,
      transparent 80px,
      rgba(255, 23, 68, 0.025) 80px,
      rgba(255, 23, 68, 0.025) 82px
    ),
    repeating-linear-gradient(
      -55deg,
      transparent,
      transparent 120px,
      rgba(255, 193, 7, 0.02) 120px,
      rgba(255, 193, 7, 0.02) 122px
    ) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* -- Ambient glow orbs -- */
.prize-showcase-section::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    radial-gradient(ellipse 600px 500px at 8% 30%, rgba(255, 23, 68, 0.07) 0%, transparent 70%),
    radial-gradient(ellipse 500px 400px at 92% 60%, rgba(255, 193, 7, 0.05) 0%, transparent 70%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.prize-showcase-section .wrap {
  position: relative !important;
  z-index: 1 !important;
}

/* -- Heading -- */
.prize-section-heading {
  text-align: center !important;
  color: #fff !important;
  margin-bottom: 44px !important;
}
.prize-section-heading .eyebrow {
  display: inline-flex !important;
  margin-bottom: 12px !important;
  color: #ff5367 !important;
  border-color: rgba(255, 83, 103, .45) !important;
}
.prize-section-heading h2 {
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(28px, 3.2vw, 48px) !important;
  line-height: 1.05 !important;
}

/* -- 3-column showcase grid -- */
.prize-showcase {
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  align-items: center !important;
  justify-items: center !important;
  gap: 0 !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
}
.prize-showcase.is-visible {
  opacity: 1 !important;
}

.prize-card-slot {
  min-width: 0 !important;
  position: relative !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
}

/* -- Prize image card -- */
.prize-image-card {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #080c18 !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  aspect-ratio: 3/4 !important;
  cursor: pointer !important;
  transition: transform .4s ease, box-shadow .4s ease, border-color .4s ease !important;
}
.prize-image-card img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  pointer-events: none !important;
}
.prize-card-icon {
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  height: 100% !important;
  color: #ffc62c !important;
  background: linear-gradient(160deg, #482018, #161a2a) !important;
  font-size: 52px !important;
}

/* Left card ï¿½ red accent */
.prize-card-slot[data-prize-slot="left"] .prize-image-card {
  border: 2px solid rgba(255, 23, 68, .35) !important;
  box-shadow: 0 0 24px rgba(255, 23, 68, .12), 0 18px 40px rgba(0, 0, 0, .35) !important;
}
.prize-card-slot[data-prize-slot="left"] .prize-image-card:hover,
.prize-card-slot[data-prize-slot="left"] .prize-image-card.is-active {
  border-color: rgba(255, 23, 68, .7) !important;
  box-shadow: 0 0 40px rgba(255, 23, 68, .3), 0 0 80px rgba(255, 23, 68, .12), 0 24px 56px rgba(0, 0, 0, .45) !important;
}

/* Right card ï¿½ gold accent */
.prize-card-slot[data-prize-slot="right"] .prize-image-card {
  border: 2px solid rgba(255, 193, 7, .35) !important;
  box-shadow: 0 0 24px rgba(255, 193, 7, .12), 0 18px 40px rgba(0, 0, 0, .35) !important;
}
.prize-card-slot[data-prize-slot="right"] .prize-image-card:hover,
.prize-card-slot[data-prize-slot="right"] .prize-image-card.is-active {
  border-color: rgba(255, 193, 7, .7) !important;
  box-shadow: 0 0 40px rgba(255, 193, 7, .3), 0 0 80px rgba(255, 193, 7, .12), 0 24px 56px rgba(0, 0, 0, .45) !important;
}

/* -- Center award text -- */
.prize-award-center {
  display: flex !important;
  align-items: stretch !important;
  gap: 0 !important;
  padding: 0 20px !important;
}
.prize-award-block {
  flex: 1 !important;
  padding: 18px 22px !important;
  opacity: 0 !important;
  transition: none !important;
}
.prize-award-block.is-visible { opacity: 1 !important; }

.prize-award-left {
  text-align: right !important;
  position: relative !important;
}
.prize-award-left .prize-award-label { color: #ff6a79 !important; }
.prize-award-left .prize-award-title { color: #fff !important; margin: 4px 0 2px !important; }
.prize-award-left .prize-award-amount { color: #ffc62c !important; }
.prize-award-left .prize-award-note { color: #b6c0d0 !important; }

.prize-award-left::before {
  content: '' !important;
  position: absolute !important;
  right: -20px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 20px !important;
  height: 2px !important;
  background: linear-gradient(to left, rgba(255, 23, 68, .7), rgba(255, 23, 68, 0)) !important;
  box-shadow: 0 0 10px rgba(255, 23, 68, .3) !important;
}

.prize-award-divider {
  width: 1px !important;
  background: linear-gradient(to bottom, transparent, rgba(255, 255, 255, .08), transparent) !important;
  margin: 0 4px !important;
}

.prize-award-right {
  text-align: left !important;
  position: relative !important;
}
.prize-award-right .prize-award-label { color: #ff6a79 !important; }
.prize-award-right .prize-award-title { color: #fff !important; margin: 4px 0 2px !important; }
.prize-award-right .prize-award-amount { color: #ffc62c !important; }
.prize-award-right .prize-award-note { color: #b6c0d0 !important; }

.prize-award-right::after {
  content: '' !important;
  position: absolute !important;
  left: -20px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 20px !important;
  height: 2px !important;
  background: linear-gradient(to right, rgba(255, 193, 7, 0), rgba(255, 193, 7, .7)) !important;
  box-shadow: 0 0 10px rgba(255, 193, 7, .3) !important;
}

.prize-award-label {
  display: block !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}
.prize-award-title {
  font-size: clamp(18px, 1.4vw, 24px) !important;
  line-height: 1.15 !important;
  font-weight: 700 !important;
}
.prize-award-amount {
  display: block !important;
  font-size: clamp(16px, 1.2vw, 20px) !important;
}
.prize-award-note {
  margin-top: 6px !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  max-width: 220px !important;
}
.prize-award-left .prize-award-note { margin-left: auto !important; }

/* -- Carousel dots -- */
.prize-carousel-dots {
  display: flex !important;
  justify-content: center !important;
  gap: 8px !important;
  margin-top: 32px !important;
}
.prize-carousel-dots button {
  width: 8px !important;
  height: 8px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #687088 !important;
  cursor: pointer !important;
  transition: background .3s, width .3s, border-radius .3s !important;
}
.prize-carousel-dots button.active {
  width: 28px !important;
  border-radius: 5px !important;
  background: #ff5367 !important;
}

/* -- Entrance animations — cards visible immediately, cards handle their own fade -- */
.prize-card-slot.prize-entrance-active .prize-image-card,
.prize-card-slot.prize-final .prize-image-card {
  transform: scale(1) !important;
  transition: opacity 600ms ease, transform 600ms ease, box-shadow 500ms ease !important;
}

/* -- Prize modal -- */
.prize-modal-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(0, 0, 0, .72) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity .35s ease !important;
}
.prize-modal-overlay.is-open {
  opacity: 1 !important;
  pointer-events: auto !important;
}
.prize-modal {
  position: relative !important;
  width: 90% !important;
  max-width: 440px !important;
  max-height: 85vh !important;
  overflow-y: auto !important;
  border-radius: 16px !important;
  transform: scale(.92) !important;
  transition: transform .4s cubic-bezier(.22,1,.36,1) !important;
}
.prize-modal-overlay.is-open .prize-modal {
  transform: scale(1) !important;
}
.prize-modal-content {
  background: rgba(12, 16, 28, .94) !important;
  border: 1px solid rgba(255, 255, 255, .08) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
}
.prize-modal-close {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  z-index: 10 !important;
  width: 36px !important;
  height: 36px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(0, 0, 0, .55) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, .12) !important;
  border-radius: 50% !important;
  font-size: 22px !important;
  line-height: 1 !important;
  cursor: pointer !important;
  transition: background .25s !important;
}
.prize-modal-close:hover { background: rgba(255, 255, 255, .18) !important; }
.prize-modal-img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 320px !important;
  object-fit: contain !important;
  background: #050811 !important;
}
.prize-modal-divider {
  height: 1px !important;
  background: linear-gradient(to right, transparent, rgba(255, 255, 255, .08), transparent) !important;
}
.prize-modal-details { padding: 22px 28px 28px !important; }
.prize-modal-label {
  display: block !important;
  margin-bottom: 4px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}
.prize-modal-title { margin: 0 0 8px !important; color: #fff !important; font-size: 22px !important; line-height: 1.2 !important; }
.prize-modal-amount { color: #ffc62c !important; font-size: 19px !important; font-weight: 700 !important; }
.prize-modal-note { margin-top: 10px !important; color: #b6c0d0 !important; font-size: 13px !important; line-height: 1.5 !important; }

/* -- Reduced motion -- */
@media (prefers-reduced-motion: reduce) {
  .prize-showcase { transition: none !important; opacity: 1 !important; }
  .prize-card-slot.prize-entrance-active .prize-image-card,
  .prize-card-slot.prize-final .prize-image-card {
    transition: none !important; opacity: 1 !important;
  }
  .prize-award-block { transition: none !important; opacity: 1 !important; }
}

/* -- Tablet -- */
@media (max-width: 960px) {
  .prize-showcase { grid-template-columns: 1fr auto 1fr !important; max-width: 900px !important; }
  .prize-award-center { padding: 0 12px !important; }
  .prize-award-block { padding: 14px !important; }
  .prize-award-title { font-size: 16px !important; }
  .prize-award-note { font-size: 12px !important; max-width: 160px !important; }
}

/* -- Mobile ï¿½ scaled-down 3-column layout -- */
@media (max-width: 680px) {
  .prize-showcase-section { padding: 52px 0 56px !important; }
  .prize-section-heading { margin-bottom: 28px !important; }

  .prize-showcase {
    grid-template-columns: 1fr auto 1fr !important;
    gap: 6px !important;
    padding: 0 10px !important;
    max-width: 100% !important;
    margin: 0 auto !important;
  }

  .prize-card-slot { width: 100% !important; max-width: none !important; margin: 0 !important; }
  .prize-image-card { aspect-ratio: 3/4 !important; width: 100% !important; }

  .prize-award-center { padding: 0 4px !important; }
  .prize-award-block { text-align: center !important; padding: 8px 4px !important; }
  .prize-award-label { font-size: 11px !important; }
  .prize-award-title { font-size: 13px !important; }
  .prize-award-amount { font-size: 18px !important; }
  .prize-award-note { font-size: 10px !important; max-width: 120px !important; margin-left: auto !important; margin-right: auto !important; }
  .prize-award-divider { width: 40px !important; height: 1px !important; margin: 4px auto !important; }
}

/* Keep this selector deliberately stronger than legacy overrides.css. */
body section.leadership-section .wrap .leader-grid article.leader-card,
body section.leadership-section .wrap .leader-grid article.leader-card[data-index] {
  height: clamp(250px, 20vw, 300px) !important;
  min-height: 0 !important;
  grid-template-columns: 40% 60% !important;
}

body section.leadership-section .wrap .leader-grid article.leader-card .leader-left,
body section.leadership-section .wrap .leader-grid article.leader-card .leader-photo-wrap {
  height: 100% !important;
  min-height: 0 !important;
}

body section.leadership-section .wrap .leader-grid article.leader-card .leader-photo-wrap img,
body section.leadership-section .wrap .leader-grid article.leader-card .leader-initials {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  object-fit: contain !important;
}

@media (max-width: 760px) {
  body section.leadership-section .wrap .leader-grid article.leader-card,
  body section.leadership-section .wrap .leader-grid article.leader-card[data-index] {
    height: 260px !important;
    min-height: 0 !important;
    min-width: 0 !important;
  }
}



/* Mobile: keep both leadership cards in the same row, like desktop. */
@media (max-width: 620px) {
  body section.section.soft.leadership-section .wrap .leader-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  body section.leadership-section .wrap .leader-grid article.leader-card,
  body section.leadership-section .wrap .leader-grid article.leader-card[data-index] {
    height: 220px !important;
    grid-template-columns: 38% 62% !important;
    border-radius: 10px !important;
  }

  body section.leadership-section .wrap .leader-grid article.leader-card .leader-right {
    padding: 10px 8px !important;
    gap: 5px !important;
  }

  body section.leadership-section .wrap .leader-grid article.leader-card .quote-name {
    font-size: 11px !important;
    line-height: 1.12 !important;
  }

  body section.leadership-section .wrap .leader-grid article.leader-card .quote-role {
    padding: 4px 6px !important;
    font-size: 6px !important;
    letter-spacing: .04em !important;
    white-space: normal !important;
  }

  body section.leadership-section .wrap .leader-grid article.leader-card .leader-quote {
    margin: 0 !important;
    font-size: 8px !important;
    line-height: 1.45 !important;
  }
}

/* Leadership section surface and heading contrast. */
body section.section.soft.leadership-section {
  background:
    linear-gradient(135deg, #16070b 0%, #300b16 48%, #11060a 100%) !important;
}

body section.section.soft.leadership-section .section-heading.center h2,
body section.section.soft.leadership-section .section-heading.center p:not(.eyebrow) {
  color: #ffffff !important;
}

body section.section.soft.leadership-section .section-heading.center h2 {
  text-shadow: 0 3px 18px rgba(0, 0, 0, .42) !important;
}

/* -------------------------------------------
   LEADERSHIP ï¿½ CINEMATIC ESPORTS (FINAL)
   ------------------------------------------- */

/* -- Section shell -- */
body section.section.leadership-section[data-leadership] {
  background: #080A12 !important;
  padding: 70px 0 80px !important;
  border-block: none !important;
  position: relative !important;
  overflow: hidden !important;
}

/* -- Animated neon background layer -- */
body section.section.leadership-section[data-leadership]::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    /* red diagonal line ï¿½ left */
    repeating-linear-gradient(
      -55deg,
      transparent,
      transparent 80px,
      rgba(255, 23, 68, 0.03) 80px,
      rgba(255, 23, 68, 0.03) 82px
    ),
    /* gold diagonal line ï¿½ right */
    repeating-linear-gradient(
      -55deg,
      transparent,
      transparent 120px,
      rgba(255, 193, 7, 0.025) 120px,
      rgba(255, 193, 7, 0.025) 122px
    ) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* -- Ambient glow orbs -- */
body section.section.leadership-section[data-leadership]::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    radial-gradient(ellipse 600px 500px at 10% 30%, rgba(255, 23, 68, 0.08) 0%, transparent 70%),
    radial-gradient(ellipse 500px 400px at 90% 60%, rgba(255, 193, 7, 0.06) 0%, transparent 70%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* -- Reduced motion -- */
@media (prefers-reduced-motion: reduce) {
  body section.section.leadership-section[data-leadership] .leader-card,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid article.leader-card {
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* -- Wrap container -- */
body section.section.leadership-section[data-leadership] .wrap {
  position: relative !important;
  z-index: 1 !important;
  max-width: 1560px !important;
  width: 90vw !important;
  margin: 0 auto !important;
  padding: 0 40px !important;
}

/* -- Heading -- */
body section.section.leadership-section[data-leadership] .section-heading.center {
  margin-bottom: 44px !important;
}

body section.section.leadership-section[data-leadership] .eyebrow {
  color: #FFC107 !important;
  background: rgba(255, 193, 7, 0.10) !important;
  border: 1px solid rgba(255, 193, 7, 0.25) !important;
  font-family: 'Poppins', sans-serif !important;
  letter-spacing: 0.2em !important;
}

body section.section.leadership-section[data-leadership] .section-heading.center h2 {
  color: #ffffff !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 700 !important;
  font-size: clamp(32px, 4vw, 48px) !important;
  text-shadow: none !important;
}

body section.section.leadership-section[data-leadership] .section-heading.center p:not(.eyebrow) {
  color: rgba(255, 255, 255, 0.55) !important;
  font-family: 'Poppins', sans-serif !important;
  font-size: clamp(15px, 1.4vw, 18px) !important;
  max-width: 640px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* -- Leader grid ï¿½ 2 equal columns -- */
body section.section.leadership-section[data-leadership] .leader-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 28px !important;
  align-items: stretch !important;
}

/* -- Card base -- */
body section.section.leadership-section[data-leadership] .leader-card,
body section.section.leadership-section[data-leadership] .wrap .leader-grid article.leader-card,
body section.section.leadership-section[data-leadership] .wrap .leader-grid article.leader-card[data-index] {
  background: rgba(255, 255, 255, 0.04) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4) !important;
  height: 420px !important;
  display: flex !important;
  flex-direction: column !important;
  opacity: 0 !important;
  transform: translateX(-60px) scale(0.95) !important;
  transition: opacity 900ms cubic-bezier(0.22, 1, 0.36, 1),
              transform 900ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}

body section.section.leadership-section[data-leadership] .leader-card[data-index="1"],
body section.section.leadership-section[data-leadership] .wrap .leader-grid article.leader-card[data-index="1"] {
  transform: translateX(60px) scale(0.95) !important;
}

body section.section.leadership-section[data-leadership] .leader-card.leadership-animate,
body section.section.leadership-section[data-leadership] .wrap .leader-grid article.leader-card.leadership-animate {
  opacity: 1 !important;
  transform: translateX(0) scale(1) !important;
}

/* Red accent ï¿½ card 0 */
body section.section.leadership-section[data-leadership] .leader-card[data-index="0"],
body section.section.leadership-section[data-leadership] .wrap .leader-grid article.leader-card[data-index="0"] {
  border-color: rgba(255, 23, 68, 0.20) !important;
}

body section.section.leadership-section[data-leadership] .leader-card[data-index="0"].leadership-animate {
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4), 0 0 50px rgba(255, 23, 68, 0.07) !important;
}

/* Gold accent ï¿½ card 1 */
body section.section.leadership-section[data-leadership] .leader-card[data-index="1"],
body section.section.leadership-section[data-leadership] .wrap .leader-grid article.leader-card[data-index="1"] {
  border-color: rgba(255, 193, 7, 0.18) !important;
}

body section.section.leadership-section[data-leadership] .leader-card[data-index="1"].leadership-animate {
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4), 0 0 50px rgba(255, 193, 7, 0.06) !important;
}

/* -- Card inner ï¿½ horizontal split -- */
body section.section.leadership-section[data-leadership] .leader-card-inner {
  display: grid !important;
  grid-template-columns: 42% 58% !important;
  height: 100% !important;
  align-items: stretch !important;
}

/* -- Image column -- */
body section.section.leadership-section[data-leadership] .leader-image-col {
  position: relative !important;
  overflow: hidden !important;
  background: rgba(255, 255, 255, 0.03) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Photo wrapper */
body section.section.leadership-section[data-leadership] .leader-photo-wrap,
body section.section.leadership-section[data-leadership] .wrap .leader-grid .leader-photo-wrap {
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  background: transparent !important;
  margin: 0 !important;
  overflow: hidden !important;
}

body section.section.leadership-section[data-leadership] .leader-photo-wrap img,
body section.section.leadership-section[data-leadership] .wrap .leader-grid .leader-photo-wrap img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center 15% !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  display: block !important;
}

body section.section.leadership-section[data-leadership] .leader-initials,
body section.section.leadership-section[data-leadership] .wrap .leader-grid .leader-initials {
  width: 140px !important;
  height: 140px !important;
  background: rgba(255, 255, 255, 0.06) !important;
  color: #FFC107 !important;
  font: 700 56px/1 'Poppins', sans-serif !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* -- Content column -- */
body section.section.leadership-section[data-leadership] .leader-content-col {
  padding: 36px 40px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  position: relative !important;
  background: transparent !important;
}

/* Quote mark */
body section.section.leadership-section[data-leadership] .quote-mark,
body section.section.leadership-section[data-leadership] .wrap .leader-grid .quote-mark {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  font-family: 'Poppins', sans-serif !important;
  font-size: 48px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  pointer-events: none !important;
  z-index: 0 !important;
  margin: 0 !important;
  margin-top: -4px !important;
  color: rgba(255, 23, 68, 0.15) !important;
  display: block !important;
}

body section.section.leadership-section[data-leadership] .leader-card[data-index="1"] .quote-mark,
body section.section.leadership-section[data-leadership] .wrap .leader-grid article.leader-card[data-index="1"] .quote-mark {
  color: rgba(255, 193, 7, 0.12) !important;
}

/* Quote text */
body section.section.leadership-section[data-leadership] .leader-quote,
body section.section.leadership-section[data-leadership] .wrap .leader-grid .leader-quote {
  color: rgba(255, 255, 255, 0.82) !important;
  font-family: 'Poppins', sans-serif !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  font-style: italic !important;
  line-height: 1.85 !important;
  position: relative !important;
  z-index: 1 !important;
  margin: 0 !important;
  min-height: auto !important;
  word-break: break-word !important;
}

/* Name */
body section.section.leadership-section[data-leadership] .leader-name,
body section.section.leadership-section[data-leadership] .wrap .leader-grid .leader-name {
  color: #ffffff !important;
  font-family: 'Poppins', sans-serif !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0.01em !important;
}

/* Role badge */
body section.section.leadership-section[data-leadership] .leader-role-badge,
body section.section.leadership-section[data-leadership] .wrap .leader-grid .leader-role-badge {
  display: inline-block !important;
  font-family: 'Poppins', sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  padding: 6px 16px !important;
  border-radius: 999px !important;
  width: fit-content !important;
}

/* Red badge ï¿½ card 0 */
body section.section.leadership-section[data-leadership] .leader-card[data-index="0"] .leader-role-badge,
body section.section.leadership-section[data-leadership] .wrap .leader-grid article.leader-card[data-index="0"] .leader-role-badge {
  color: #FF1744 !important;
  background: rgba(255, 23, 68, 0.10) !important;
  border: 1px solid rgba(255, 23, 68, 0.25) !important;
}

/* Gold badge ï¿½ card 1 */
body section.section.leadership-section[data-leadership] .leader-card[data-index="1"] .leader-role-badge,
body section.section.leadership-section[data-leadership] .wrap .leader-grid article.leader-card[data-index="1"] .leader-role-badge {
  color: #FFC107 !important;
  background: rgba(255, 193, 7, 0.10) !important;
  border: 1px solid rgba(255, 193, 7, 0.25) !important;
}

/* Leader info ï¿½ at top of content column */
body section.section.leadership-section[data-leadership] .leader-info,
body section.section.leadership-section[data-leadership] .wrap .leader-grid .leader-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-top: 0 !important;
  margin-bottom: 4px !important;
  text-align: left !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Hide old duplicate elements from previous markup */
body section.section.leadership-section[data-leadership] .leader-left,
body section.section.leadership-section[data-leadership] .leader-right,
body section.section.leadership-section[data-leadership] .leader-quote-head,
body section.section.leadership-section[data-leadership] .quote-name,
body section.section.leadership-section[data-leadership] .quote-role,
body section.section.leadership-section[data-leadership] .leader-top,
body section.section.leadership-section[data-leadership] .leader-bottom,
body section.section.leadership-section[data-leadership] .values-strip,
body section.section.leadership-section[data-leadership] .values-item {
  display: none !important;
}

/* -- Responsive: Tablet (=1024px) -- */
@media (max-width: 1024px) {
  body section.section.leadership-section[data-leadership] .wrap {
    padding: 0 24px !important;
  }

  body section.section.leadership-section[data-leadership] .leader-grid {
    gap: 24px !important;
  }

  body section.section.leadership-section[data-leadership] .leader-card,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid article.leader-card,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid article.leader-card[data-index] {
    height: 380px !important;
  }

  body section.section.leadership-section[data-leadership] .leader-content-col {
    padding: 28px 28px !important;
  }

  body section.section.leadership-section[data-leadership] .leader-name,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid .leader-name {
    font-size: 22px !important;
  }

  body section.section.leadership-section[data-leadership] .leader-quote,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid .leader-quote {
    font-size: 14px !important;
  }
}

/* -- Responsive: Mobile (=768px) -- */
@media (max-width: 768px) {
  body section.section.leadership-section[data-leadership] {
    padding: clamp(40px, 6vw, 60px) 0 !important;
  }

  body section.section.leadership-section[data-leadership] .wrap {
    padding: 0 16px !important;
  }

  body section.section.leadership-section[data-leadership] .section-heading.center {
    margin-bottom: 32px !important;
  }

  body section.section.leadership-section[data-leadership] .leader-grid,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  body section.section.leadership-section[data-leadership] .leader-card,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid article.leader-card,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid article.leader-card[data-index] {
    height: auto !important;
    min-height: auto !important;
    border-radius: 18px !important;
    display: block !important;
  }

  body section.section.leadership-section[data-leadership] .leader-card-inner {
    grid-template-columns: 1fr !important;
    min-height: auto !important;
    height: auto !important;
  }

  body section.section.leadership-section[data-leadership] .leader-image-col {
    max-height: 320px !important;
    overflow: hidden !important;
  }

  body section.section.leadership-section[data-leadership] .leader-photo-wrap,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid .leader-photo-wrap {
    padding: 12px !important;
  }

  body section.section.leadership-section[data-leadership] .leader-photo-wrap img,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid .leader-photo-wrap img {
    object-fit: contain !important;
    object-position: center center !important;
    border-radius: 12px !important;
  }

  body section.section.leadership-section[data-leadership] .leader-content-col {
    padding: 20px 16px 24px !important;
    justify-content: flex-start !important;
  }

  body section.section.leadership-section[data-leadership] .quote-mark,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid .quote-mark {
    font-size: 40px !important;
    margin-top: -2px !important;
  }

  body section.section.leadership-section[data-leadership] .leader-quote,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid .leader-quote {
    font-size: 13.5px !important;
    line-height: 1.7 !important;
  }

  body section.section.leadership-section[data-leadership] .leader-name,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid .leader-name {
    font-size: 19px !important;
  }

  body section.section.leadership-section[data-leadership] .leader-role-badge,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid .leader-role-badge {
    font-size: 10px !important;
    padding: 5px 12px !important;
  }

  /* Mobile animation: both cards fade up */
  body section.section.leadership-section[data-leadership] .leader-card,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid article.leader-card,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid article.leader-card[data-index] {
    transform: translateY(30px) scale(0.97) !important;
  }

  body section.section.leadership-section[data-leadership] .leader-card.leadership-animate,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid article.leader-card.leadership-animate {
    transform: translateY(0) scale(1) !important;
  }
}

/* -- Responsive: Small mobile (=480px) -- */
@media (max-width: 480px) {
  body section.section.leadership-section[data-leadership] .wrap {
    padding: 0 16px !important;
  }

  body section.section.leadership-section[data-leadership] .leader-grid {
    gap: 16px !important;
  }

  body section.section.leadership-section[data-leadership] .leader-content-col {
    padding: 18px 14px 22px !important;
  }

  body section.section.leadership-section[data-leadership] .leader-quote,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid .leader-quote {
    font-size: 12.5px !important;
    line-height: 1.6 !important;
  }

  body section.section.leadership-section[data-leadership] .leader-name,
  body section.section.leadership-section[data-leadership] .wrap .leader-grid .leader-name {
    font-size: 17px !important;
  }
}
/* -------------------------------------------
   GAME SECTION ï¿½ Premium Dark Esports
   ------------------------------------------- */

#games.section.white,
body:not(.admin-body) #games.section.white {
  position: relative !important;
  isolation: isolate !important;
  background: #080A12 !important;
  border-block: none !important;
  margin-top: 0 !important;
  overflow: hidden !important;
}

#games.section.white::before,
#games.section.white::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* Red diagonal lines ï¿½ left side */
#games.section.white::before {
  background:
    repeating-linear-gradient(
      -55deg,
      transparent,
      transparent 60px,
      rgba(255, 23, 68, 0.04) 60px,
      rgba(255, 23, 68, 0.04) 61px,
      transparent 61px,
      transparent 120px
    ),
    repeating-linear-gradient(
      -55deg,
      transparent,
      transparent 90px,
      rgba(255, 23, 68, 0.06) 90px,
      rgba(255, 23, 68, 0.06) 91px,
      transparent 91px,
      transparent 180px
    ) !important;
  mask-image: linear-gradient(to right, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, transparent 65%) !important;
  -webkit-mask-image: linear-gradient(to right, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, transparent 65%) !important;
}

/* Gold diagonal lines ï¿½ right side */
#games.section.white::after {
  background:
    repeating-linear-gradient(
      55deg,
      transparent,
      transparent 60px,
      rgba(255, 193, 7, 0.04) 60px,
      rgba(255, 193, 7, 0.04) 61px,
      transparent 61px,
      transparent 120px
    ),
    repeating-linear-gradient(
      55deg,
      transparent,
      transparent 90px,
      rgba(255, 193, 7, 0.06) 90px,
      rgba(255, 193, 7, 0.06) 91px,
      transparent 91px,
      transparent 180px
    ) !important;
  mask-image: linear-gradient(to left, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, transparent 65%) !important;
  -webkit-mask-image: linear-gradient(to left, rgba(0,0,0,1) 0%, rgba(0,0,0,0.6) 40%, transparent 65%) !important;
}

#games.section.white .wrap {
  position: relative !important;
  z-index: 1 !important;
}

/* -- Heading -- */
#games.section.white .games-heading-row,
body:not(.admin-body) #games .heading-row {
  text-align: center !important;
}

#games.section.white .section-heading .eyebrow {
  color: #ff6a79 !important;
  border-color: rgba(255, 106, 121, .45) !important;
}

#games.section.white .section-heading h2 {
  color: #ffffff !important;
  margin-bottom: 4px !important;
}

#games.section.white .section-heading p {
  color: rgba(255, 255, 255, .65) !important;
}

#games.section.white .view-all-btn {
  background: linear-gradient(135deg, #FF1744, #b71c1c) !important;
  border: 1px solid rgba(255, 23, 68, .3) !important;
  color: #fff !important;
}

#games.section.white .view-all-btn:hover {
  background: linear-gradient(135deg, #ff4569, #d32f2f) !important;
  box-shadow: 0 6px 24px rgba(255, 23, 68, .35) !important;
}

/* -- Game Grid: 3 cols desktop -- */
body:not(.admin-body) #games .game-grid,
#games .game-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-auto-rows: 1fr !important;
  gap: clamp(18px, 2.2vw, 28px) !important;
  align-items: stretch !important;
}

/* -- Game Card: dark glass -- */
body:not(.admin-body) #games .game-card,
#games .game-card {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  min-width: 0 !important;
  background: rgba(14, 18, 30, .88) !important;
  border: 1px solid rgba(255, 255, 255, .07) !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  box-shadow:
    0 4px 20px rgba(0, 0, 0, .45),
    0 0 0 1px rgba(255, 23, 68, .04) !important;
  transition: transform .45s cubic-bezier(.2,.8,.2,1), box-shadow .45s, border-color .45s !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  position: relative !important;
}

body:not(.admin-body) #games .game-card:hover,
#games .game-card:hover {
  transform: translateY(-8px) !important;
  border-color: rgba(255, 193, 7, .28) !important;
  box-shadow:
    0 20px 48px rgba(255, 193, 7, .1),
    0 4px 16px rgba(0, 0, 0, .4) !important;
}

/* -- Game Image -- */
body:not(.admin-body) #games .game-image,
#games .game-image {
  aspect-ratio: 16 / 10 !important;
  background-size: cover !important;
  background-position: center !important;
  background-color: #0d1120 !important;
  position: relative !important;
}

/* -- Game Body -- */
body:not(.admin-body) #games .game-body,
#games .game-body {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 20px 20px 22px !important;
  position: relative !important;
  border-top: 1px solid rgba(255, 255, 255, .06) !important;
  background: transparent !important;
}

/* Remove ticket punch-holes for cleaner look */
body:not(.admin-body) #games .game-body::before,
body:not(.admin-body) #games .game-body::after,
#games .game-body::before,
#games .game-body::after {
  display: none !important;
}

body:not(.admin-body) #games .game-body h3,
#games .game-body h3 {
  color: #ffffff !important;
  font-size: 20px !important;
  letter-spacing: .03em !important;
}

/* -- Platform pill -- */
body:not(.admin-body) #games .platform-pill-new,
#games .platform-pill-new {
  background: rgba(255, 23, 68, .1) !important;
  color: #ff6a79 !important;
  border: 1px solid rgba(255, 23, 68, .18) !important;
}

/* -- Status pill -- */
body:not(.admin-body) #games .status-pill {
  font-weight: 700 !important;
}

/* -- Window note -- */
body:not(.admin-body) #games .window-note,
#games .window-note {
  color: #ff6a79 !important;
  font-weight: 700 !important;
}

/* -- Discount chip -- */
body:not(.admin-body) #games .game-body > .discount-chip,
#games .game-body > .discount-chip {
  color: #ffc62c !important;
  background: rgba(255, 193, 7, .1) !important;
  border-color: rgba(255, 193, 7, .22) !important;
}

body:not(.admin-body) #games .game-body > .discount-chip i,
#games .game-body > .discount-chip i {
  color: #ffc62c !important;
}

/* -- Price chips -- */
body:not(.admin-body) #games .price-chips p,
#games .price-chips p {
  background: rgba(255, 23, 68, .06) !important;
  border-color: rgba(255, 23, 68, .15) !important;
}

body:not(.admin-body) #games .price-chips p+p,
#games .price-chips p+p {
  background: rgba(255, 193, 7, .06) !important;
  border-color: rgba(255, 193, 7, .15) !important;
}

body:not(.admin-body) #games .price-chips small,
#games .price-chips small {
  color: rgba(255, 255, 255, .5) !important;
}

body:not(.admin-body) #games .price-chips strong,
#games .price-chips strong {
  color: #ffffff !important;
}

body:not(.admin-body) #games .price-chips del,
#games .price-chips del {
  color: rgba(255, 255, 255, .35) !important;
  text-decoration-color: currentColor !important;
}

/* Price chip notch color fix */
body:not(.admin-body) #games .price-chips p::after,
#games .price-chips p::after {
  background: #0e121e !important;
  border-color: rgba(255, 23, 68, .15) !important;
}

body:not(.admin-body) #games .price-chips p+p::after,
#games .price-chips p+p::after {
  border-color: rgba(255, 193, 7, .15) !important;
}

/* -- CTA button -- */
body:not(.admin-body) #games .card-cta,
#games .card-cta {
  background: linear-gradient(135deg, #b71c1c, #FF1744) !important;
  border: none !important;
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(255, 23, 68, .25) !important;
}

body:not(.admin-body) #games .card-cta i,
#games .card-cta i {
  transition: transform .25s ease !important;
}

body:not(.admin-body) #games .game-card:hover .card-cta,
#games .game-card:hover .card-cta {
  box-shadow: 0 12px 28px rgba(255, 23, 68, .4) !important;
  filter: brightness(1.1) !important;
}

/* -- Closed card -- */
body:not(.admin-body) #games .game-card.is-closed,
#games .game-card.is-closed {
  opacity: .72 !important;
  filter: grayscale(.3) !important;
}

body:not(.admin-body) #games .game-card.is-closed:hover,
#games .game-card.is-closed:hover {
  opacity: 1 !important;
  filter: none !important;
}

/* -- Gallery CTA -- */
body:not(.admin-body) #games .gallery-cta .btn,
#games .gallery-cta .btn {
  color: #fff !important;
  border-color: rgba(255, 255, 255, .2) !important;
}

body:not(.admin-body) #games .gallery-cta .btn:hover,
#games .gallery-cta .btn:hover {
  border-color: #FF1744 !important;
  color: #FF1744 !important;
}

/* -- TABLET: 2 cols (761ï¿½1024px) -- */
@media (min-width: 761px) and (max-width: 1024px) {
  body:not(.admin-body) #games .game-grid,
  #games .game-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
  }
}

/* -- MOBILE: 1 col (=760px) -- */
@media (max-width: 760px) {
  body:not(.admin-body) #games .game-grid,
  #games .game-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    grid-auto-rows: auto !important;
  }

  body:not(.admin-body) #games .game-card,
  #games .game-card {
    max-width: 100% !important;
    margin-inline: 0 !important;
    border-radius: 16px !important;
    height: auto !important;
  }

  body:not(.admin-body) #games .game-image,
  #games .game-image {
    aspect-ratio: 16 / 9 !important;
  }

  body:not(.admin-body) #games .game-body,
  #games .game-body {
    padding: 16px 16px 18px !important;
  }

  body:not(.admin-body) #games .game-body h3,
  #games .game-body h3 {
    font-size: 18px !important;
  }

  body:not(.admin-body) #games .price-chips,
  #games .price-chips {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  body:not(.admin-body) #games .price-chips p,
  #games .price-chips p {
    padding: 10px 12px !important;
    min-height: 60px !important;
  }

  body:not(.admin-body) #games .price-chips strong,
  #games .price-chips strong {
    font-size: 16px !important;
  }

  body:not(.admin-body) #games .card-cta,
  #games .card-cta {
    width: 100% !important;
    justify-content: center !important;
    padding: 12px 18px !important;
    font-size: 13px !important;
  }

  body:not(.admin-body) #games .heading-row.games-heading-row,
  #games .heading-row.games-heading-row {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
  }

  body:not(.admin-body) #games .heading-row .view-all-btn,
  #games .heading-row .view-all-btn {
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
  }

  body:not(.admin-body) #games .section-heading,
  #games .section-heading {
    text-align: center !important;
  }

  body:not(.admin-body) #games .section-heading h2,
  #games .section-heading h2 {
    font-size: clamp(24px, 6vw, 32px) !important;
  }

  body:not(.admin-body) #games .section-heading p,
  #games .section-heading p {
    font-size: 14px !important;
  }
}

/* -------------------------------------------
   SPONSORS ï¿½ Premium Dark Esports
   ------------------------------------------- */

/* -- Section shell -- */
body section.section.sponsors-section[data-sponsors] {
  background: #080A12 !important;
  padding: 70px 0 80px !important;
  border-block: none !important;
  position: relative !important;
  overflow: hidden !important;
}

/* -- Animated neon background layer -- */
body section.section.sponsors-section[data-sponsors]::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    repeating-linear-gradient(
      -55deg,
      transparent,
      transparent 80px,
      rgba(255, 23, 68, 0.03) 80px,
      rgba(255, 23, 68, 0.03) 82px
    ),
    repeating-linear-gradient(
      -55deg,
      transparent,
      transparent 120px,
      rgba(255, 193, 7, 0.025) 120px,
      rgba(255, 193, 7, 0.025) 122px
    ) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* -- Ambient glow orbs -- */
body section.section.sponsors-section[data-sponsors]::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    radial-gradient(ellipse 600px 500px at 10% 30%, rgba(255, 23, 68, 0.07) 0%, transparent 70%),
    radial-gradient(ellipse 500px 400px at 90% 60%, rgba(255, 193, 7, 0.05) 0%, transparent 70%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* -- Reduced motion -- */
@media (prefers-reduced-motion: reduce) {
  body section.section.sponsors-section[data-sponsors] .sponsor-marquee-track {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
  body section.section.sponsors-section[data-sponsors] [data-sponsors-heading] {
    opacity: 1 !important;
    transform: none !important;
  }
  body section.section.sponsors-section[data-sponsors] [data-sponsors-row] {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* -- Wrap container -- */
body section.section.sponsors-section[data-sponsors] .wrap {
  position: relative !important;
  z-index: 1 !important;
  max-width: 1500px !important;
  padding: 0 32px !important;
}

/* -- Heading entrance -- */
body section.section.sponsors-section[data-sponsors] [data-sponsors-heading] {
  text-align: center !important;
  opacity: 0 !important;
  transform: translateY(30px) !important;
  transition: opacity 700ms cubic-bezier(0.22, 1, 0.36, 1),
              transform 700ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}

body section.section.sponsors-section[data-sponsors].sponsors-entrance [data-sponsors-heading] {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

/* -- Heading typography -- */
body section.section.sponsors-section[data-sponsors] .eyebrow {
  color: #FFC107 !important;
  background: rgba(255, 193, 7, 0.10) !important;
  border: 1px solid rgba(255, 193, 7, 0.25) !important;
  font-family: 'Poppins', sans-serif !important;
  letter-spacing: 0.2em !important;
}

body section.section.sponsors-section[data-sponsors] .section-heading.center h2 {
  color: #ffffff !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 700 !important;
  font-size: clamp(28px, 4vw, 44px) !important;
  text-shadow: 0 3px 18px rgba(0, 0, 0, 0.42) !important;
}

body section.section.sponsors-section[data-sponsors] .section-heading.center p:not(.eyebrow) {
  color: rgba(255, 255, 255, 0.55) !important;
  font-family: 'Poppins', sans-serif !important;
  font-size: clamp(14px, 1.4vw, 17px) !important;
  max-width: 600px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* -- Marquee container -- */
body section.section.sponsors-section[data-sponsors] .sponsor-marquee {
  position: relative !important;
  overflow: hidden !important;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent) !important;
  mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent) !important;
  padding: 10px 0 !important;
  opacity: 0 !important;
  transform: translateX(60px) !important;
  transition: opacity 800ms cubic-bezier(0.22, 1, 0.36, 1) 200ms,
              transform 800ms cubic-bezier(0.22, 1, 0.36, 1) 200ms !important;
}

body section.section.sponsors-section[data-sponsors] .sponsor-marquee-reverse {
  transform: translateX(-60px) !important;
}

body section.section.sponsors-section[data-sponsors].sponsors-entrance .sponsor-marquee {
  opacity: 1 !important;
  transform: translateX(0) !important;
}

body section.section.sponsors-section[data-sponsors] .sponsor-marquee + .sponsor-marquee {
  margin-top: 14px !important;
}

/* -- Marquee track -- */
body section.section.sponsors-section[data-sponsors] .sponsor-marquee-track {
  display: flex !important;
  gap: 16px !important;
  width: max-content !important;
  animation: sponsor-scroll var(--marquee-duration, 34s) linear infinite !important;
}

body section.section.sponsors-section[data-sponsors] .sponsor-marquee-track.is-reversed {
  animation-direction: reverse !important;
}

body section.section.sponsors-section[data-sponsors] .sponsor-marquee:hover .sponsor-marquee-track {
  animation-play-state: paused !important;
}

@keyframes sponsor-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* -- Sponsor card ï¿½ dark glass -- */
body section.section.sponsors-section[data-sponsors] .sponsor-card {
  display: grid !important;
  gap: 10px !important;
  justify-items: center !important;
  text-align: center !important;
  padding: 22px 18px !important;
  background: rgba(255, 255, 255, 0.04) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  border: 1px solid rgba(255, 193, 7, 0.25) !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35) !important;
  width: 220px !important;
  flex: 0 0 220px !important;
  transition: transform 280ms cubic-bezier(0.22, 1, 0.36, 1),
              box-shadow 280ms ease,
              border-color 280ms ease !important;
  text-decoration: none !important;
  cursor: default !important;
}

body section.section.sponsors-section[data-sponsors] a.sponsor-card {
  cursor: pointer !important;
}

body section.section.sponsors-section[data-sponsors] .sponsor-card:hover {
  transform: scale(1.04) !important;
  border-color: rgba(255, 193, 7, 0.45) !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45),
              0 0 30px rgba(255, 193, 7, 0.08) !important;
}

/* Card 0 red accent glow on hover */
body section.section.sponsors-section[data-sponsors] .sponsor-card:nth-child(odd):hover {
  border-color: rgba(255, 23, 68, 0.35) !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45),
              0 0 30px rgba(255, 23, 68, 0.07) !important;
}

/* -- Logo box -- */
body section.section.sponsors-section[data-sponsors] .sponsor-logo-box {
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  height: 72px !important;
  padding: 8px !important;
  border-radius: 10px !important;
  background: transparent !important;
  border: none !important;
}

body section.section.sponsors-section[data-sponsors] .sponsor-logo-box img {
  max-height: 56px !important;
  max-width: 100% !important;
  width: auto !important;
  object-fit: contain !important;
  filter: brightness(0.95) !important;
  transition: filter 280ms ease !important;
}

body section.section.sponsors-section[data-sponsors] .sponsor-card:hover .sponsor-logo-box img {
  filter: brightness(1.1) !important;
}

body section.section.sponsors-section[data-sponsors] .sponsor-logo-box .logo-fallback {
  font-family: 'Poppins', sans-serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  color: #FFC107 !important;
}

/* -- Sponsor name -- */
body section.section.sponsors-section[data-sponsors] .sponsor-card strong {
  font-family: 'Poppins', sans-serif !important;
  font-size: 13px !important;
  color: rgba(255, 255, 255, 0.75) !important;
  overflow-wrap: anywhere !important;
  letter-spacing: 0.01em !important;
}

body section.section.sponsors-section[data-sponsors] .sponsor-card:hover strong {
  color: #ffffff !important;
}

/* -- RESPONSIVE -- */

/* Tablet (=1024px) */
@media (max-width: 1024px) {
  body section.section.sponsors-section[data-sponsors] .wrap {
    padding: 0 24px !important;
  }

  body section.section.sponsors-section[data-sponsors] .sponsor-card {
    width: 180px !important;
    flex: 0 0 180px !important;
    padding: 18px 14px !important;
  }

  body section.section.sponsors-section[data-sponsors] .sponsor-logo-box {
    height: 60px !important;
  }

  body section.section.sponsors-section[data-sponsors] .sponsor-logo-box img {
    max-height: 46px !important;
  }

  body section.section.sponsors-section[data-sponsors] .sponsor-card strong {
    font-size: 12px !important;
  }
}

/* Mobile (=768px) */
@media (max-width: 768px) {
  body section.section.sponsors-section[data-sponsors] {
    padding: clamp(40px, 6vw, 60px) 0 clamp(50px, 6vw, 70px) !important;
  }

  body section.section.sponsors-section[data-sponsors] .wrap {
    padding: 0 16px !important;
  }

  body section.section.sponsors-section[data-sponsors] .section-heading.center {
    margin-bottom: 28px !important;
  }

  body section.section.sponsors-section[data-sponsors] .sponsor-marquee {
    padding: 6px 0 !important;
  }

  body section.section.sponsors-section[data-sponsors] .sponsor-marquee + .sponsor-marquee {
    margin-top: 10px !important;
  }

  body section.section.sponsors-section[data-sponsors] .sponsor-card {
    width: 150px !important;
    flex: 0 0 150px !important;
    padding: 16px 12px !important;
    border-radius: 14px !important;
  }

  body section.section.sponsors-section[data-sponsors] .sponsor-logo-box {
    height: 50px !important;
  }

  body section.section.sponsors-section[data-sponsors] .sponsor-logo-box img {
    max-height: 38px !important;
  }

  body section.section.sponsors-section[data-sponsors] .sponsor-card strong {
    font-size: 11px !important;
  }

  body section.section.sponsors-section[data-sponsors] .sponsor-logo-box .logo-fallback {
    font-size: 18px !important;
  }
}

/* Small mobile (=480px) */
@media (max-width: 480px) {
  body section.section.sponsors-section[data-sponsors] .sponsor-card {
    width: 130px !important;
    flex: 0 0 130px !important;
    padding: 14px 10px !important;
  }

  body section.section.sponsors-section[data-sponsors] .sponsor-logo-box {
    height: 44px !important;
  }

  body section.section.sponsors-section[data-sponsors] .sponsor-logo-box img {
    max-height: 34px !important;
  }
}

/* â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•
   EVENT MOMENTS â€” missing marquee keyframes (right â†’ left loop)
   The track is 4 identical cloned sets; shifting -50% (2 sets)
   lands exactly on an identical copy = seamless infinite loop.
   â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â• */
@keyframes memoryMarquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* Spacing mechanic swap (visually identical): trailing margins instead
   of flex-gap so every card occupies an equal pitch â€” this makes the
   -50% translation land exactly on a clone boundary (no jump/reset).
   Desktop spacing remains 18px, exactly as before. */
.memory-track {
  gap: 0 !important;
}
.memory-track > .memory-card {
  margin-right: 18px !important;
}

@media (prefers-reduced-motion: reduce) {
  .memory-track.is-auto-marquee { animation: none !important; transform: none !important; }
}

/* â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•
   MOBILE-ONLY FIXES (â‰¤768px) â€” Event Moments + Tournament Rewards
   Desktop is untouched: every rule below sits inside this query
   except the keyframes above, which simply restore the already-
   coded marquee animation.
   â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â• */
@media (max-width: 768px) {

  /* â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€
     1) EVENT MOMENTS â€” smooth Râ†’L, ~1.3 cards visible
     Trailing margin instead of flex gap makes the
     -50% shift pixel-perfect (no jump, no empty gap).
     â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
  .memory-track {
    gap: 0 !important;
    will-change: transform;
  }

  .memory-track > .memory-card {
    width: min(74vw, 300px) !important;
    flex: 0 0 min(74vw, 300px) !important;
    margin-right: 16px !important;
  }

  .memory-viewport {
    padding: 12px 0 10px !important;
    overflow: hidden !important;
  }

  .memories .gallery-cta { margin-top: 18px !important; }

  /* â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€
     2) TOURNAMENT REWARDS â€” stacked premium cards
     `display:contents` flattens the center text group
     into the showcase so each text pairs with ITS card:
       [card L] [text L] [divider] [card R] [text R]
     â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
  .prize-showcase-section { padding: 48px 0 54px !important; }
  .prize-section-heading { margin-bottom: 26px !important; padding: 0 16px !important; }

  .prize-showcase {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 16px !important;
    max-width: 420px !important;
    margin: 0 auto !important;
    padding: 0 16px !important;
  }

  .prize-card-slot {
    order: 0 !important;
    width: auto !important;
  }
  .prize-card-slot[data-prize-slot="right"] { order: 4 !important; }

  .prize-image-card {
    width: min(66vw, 240px) !important;
    max-width: 100% !important;
    aspect-ratio: 3 / 4 !important;
  }
  .prize-card-icon { font-size: 44px !important; }

  .prize-award-center {
    display: contents !important;
    padding: 0 !important;
    gap: 0 !important;
  }

  .prize-award-block {
    order: 0 !important;
    width: 100% !important;
    max-width: 360px !important;
    padding: 6px 8px 2px !important;
    text-align: center !important;
    overflow-wrap: anywhere;
  }
  .prize-award-left  { order: 2 !important; text-align: center !important; }
  .prize-award-right { order: 5 !important; text-align: center !important; }

  /* connector dashes don't apply to the stacked layout */
  .prize-award-left::before,
  .prize-award-right::after { display: none !important; }

  /* horizontal divider between the two rewards */
  .prize-award-divider {
    order: 3 !important;
    width: min(72%, 260px) !important;
    height: 1px !important;
    margin: 6px auto 2px !important;
    background: linear-gradient(90deg,
        rgba(255, 23, 68, 0),
        rgba(255, 23, 68, .55) 30%,
        rgba(255, 193, 7, .5) 70%,
        rgba(255, 193, 7, 0)) !important;
  }

  /* slightly reduced but clearly readable typography */
  .prize-award-label {
    font-size: 10.5px !important;
    letter-spacing: .14em !important;
  }
  .prize-award-title {
    font-size: clamp(17px, 4.8vw, 20px) !important;
    line-height: 1.22 !important;
    margin: 5px 0 3px !important;
  }
  .prize-award-amount {
    font-size: clamp(21px, 6vw, 26px) !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
  }
  .prize-award-note {
    font-size: 12.5px !important;
    line-height: 1.55 !important;
    margin-top: 7px !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 4px !important;
  }

  .prize-carousel-dots { margin-top: 24px !important; }
}