:root{
 --wc-bg:#02050d;--wc-card:rgba(8,19,40,.82);--wc-line:rgba(145,196,255,.13);
 --wc-text:#f7f9ff;--wc-muted:#8da0bd;--wc-cyan:#72e8ff;--wc-violet:#a77dff;
 --wc-blue:#7c9fff;--wc-gold:#f7d57f;--wc-radius:24px
}
html{background:var(--wc-bg);scroll-behavior:smooth}
body{
 color:var(--wc-text);
 background:
 radial-gradient(circle at 8% 0%,rgba(113,83,255,.18),transparent 30%),
 radial-gradient(circle at 92% 8%,rgba(62,214,255,.11),transparent 28%),
 linear-gradient(180deg,#02040b 0%,#071326 50%,#030713 100%)!important
}
body::before{
 content:"";position:fixed;inset:0;pointer-events:none;z-index:-9;
 background:
 linear-gradient(rgba(255,255,255,.012) 1px,transparent 1px),
 linear-gradient(90deg,rgba(255,255,255,.012) 1px,transparent 1px);
 background-size:64px 64px;
 mask-image:linear-gradient(to bottom,#000,transparent 92%)
}
.public-topnav.final-topnav{
 width:min(1320px,calc(100% - 30px))!important;min-height:70px!important;
 margin:12px auto 0!important;top:10px!important;padding:8px 10px!important;
 border:1px solid rgba(154,203,255,.12)!important;border-radius:20px!important;
 background:rgba(4,12,28,.84)!important;backdrop-filter:blur(28px) saturate(1.3)!important;
 box-shadow:0 18px 70px rgba(0,0,0,.34)!important
}
.public-brand-mark{
 width:44px!important;height:44px!important;border-radius:14px!important;
 background:radial-gradient(circle at 28% 23%,rgba(255,255,255,.48),transparent 21%),
 linear-gradient(145deg,#9d76ff,#6589ff 52%,#6de8ff)!important;
 box-shadow:0 10px 30px rgba(95,130,255,.28)!important
}
.public-brand strong{font-size:.82rem!important;letter-spacing:.12em!important}
.public-brand small{font-size:.48rem!important;color:#7387a7!important}
.public-tab,.ss-more-btn{
 min-height:40px!important;padding:0 12px!important;border-radius:12px!important;
 color:#98aac4!important;font-size:.63rem!important;transition:.18s ease!important
}
.public-tab:hover,.ss-more-btn:hover{color:#fff!important;background:rgba(255,255,255,.04)!important}
.public-tab.active{
 color:#fff!important;background:rgba(255,255,255,.035)!important;
 box-shadow:inset 0 -2px 0 var(--wc-cyan)!important
}
.public-cta-btn{
 min-height:42px!important;padding:0 16px!important;border-radius:12px!important;border:0!important;
 color:#06111e!important;font-weight:950!important;
 background:linear-gradient(135deg,#d5fbff,#72e7ff 53%,#95a6ff)!important;
 box-shadow:0 12px 30px rgba(80,202,255,.2)!important
}
.public-ghost-btn{
 min-height:42px!important;padding:0 14px!important;border-radius:12px!important;
 border:1px solid var(--wc-line)!important;background:rgba(255,255,255,.025)!important;color:#bac7da!important
}
.ss-home-hero{
 width:min(1320px,calc(100% - 30px))!important;min-height:590px!important;
 margin:20px auto 14px!important;padding:62px!important;border-radius:34px!important;
 border:1px solid rgba(145,204,255,.15)!important;
 background:
 radial-gradient(circle at 12% 18%,rgba(147,87,255,.22),transparent 30%),
 radial-gradient(circle at 84% 19%,rgba(78,218,255,.14),transparent 29%),
 linear-gradient(145deg,rgba(9,22,48,.98),rgba(4,13,31,.94))!important;
 box-shadow:0 38px 120px rgba(0,0,0,.39)!important;overflow:hidden!important
}
.ss-home-copy h1{
 max-width:810px!important;margin:18px 0!important;
 font-size:clamp(3.6rem,6.2vw,6.5rem)!important;line-height:.89!important;letter-spacing:-.07em!important
}
.ss-home-copy h1 span{
 background:linear-gradient(90deg,#a7ddff,#fff 44%,#c4b6ff 84%)!important;
 -webkit-background-clip:text!important;background-clip:text!important;color:transparent!important
}
.ss-home-copy p{max-width:650px!important;color:#a0b0c8!important;font-size:1rem!important;line-height:1.78!important}
.ss-home-kicker{
 padding:8px 11px!important;border:1px solid rgba(133,209,255,.13)!important;border-radius:999px!important;
 background:rgba(255,255,255,.025)!important;color:#b0bfd4!important;letter-spacing:.17em!important
}
.ss-primary,.ss-secondary{min-height:50px!important;border-radius:14px!important;padding:0 20px!important;font-size:.73rem!important;font-weight:950!important}
.ss-primary{
 color:#06111f!important;background:linear-gradient(135deg,#d7fbff,#71e8ff 52%,#94a7ff)!important;
 box-shadow:0 15px 36px rgba(72,204,255,.22)!important
}
.ss-secondary{color:#d4deed!important;background:rgba(255,255,255,.028)!important;border:1px solid var(--wc-line)!important}
.ss-feature-rail{
 width:min(1320px,calc(100% - 30px))!important;margin:14px auto!important;
 grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:11px!important
}
.ss-feature-rail a{
 min-height:118px!important;padding:18px!important;border-radius:20px!important;border:1px solid var(--wc-line)!important;
 background:linear-gradient(180deg,rgba(10,24,52,.82),rgba(6,16,36,.84))!important;transition:.2s ease!important
}
.ss-feature-rail a:hover{transform:translateY(-4px)!important;border-color:rgba(113,230,255,.24)!important}
.ss-player-day,.prestige-board{
 width:min(1320px,calc(100% - 30px))!important;margin-left:auto!important;margin-right:auto!important
}
.ss-player-day{
 min-height:138px!important;padding:24px 28px!important;border-radius:22px!important;
 border:1px solid rgba(245,211,128,.14)!important;
 background:radial-gradient(circle at 6% 50%,rgba(245,211,128,.08),transparent 26%),
 linear-gradient(120deg,rgba(12,27,56,.91),rgba(6,17,37,.88))!important
}
.card,.public-card,.prono-card,.live-card,.community-match,.social-section,.profile-side-card,
.social-composer,.calendar-card,.admin-panel,.prestige-panel{
 border:1px solid var(--wc-line)!important;border-radius:22px!important;
 background:linear-gradient(180deg,rgba(10,24,52,.81),rgba(5,15,34,.87))!important;
 box-shadow:0 18px 60px rgba(0,0,0,.20)!important
}
input,textarea,select{
 min-height:44px;border-radius:13px!important;border:1px solid rgba(137,192,255,.12)!important;
 background:rgba(2,9,22,.66)!important;color:#eef4ff!important
}
input:focus,textarea:focus,select:focus{
 outline:none!important;border-color:rgba(111,232,255,.42)!important;
 box-shadow:0 0 0 3px rgba(111,232,255,.08)!important
}
.public-page,.page-shell,.pronos-shell,.live-shell,.social-hub,.profile-social-shell,main:not(.final-landing){
 width:min(1320px,calc(100% - 30px))!important
}
.ss-footer{width:min(1320px,calc(100% - 30px))!important;border-radius:20px!important}
.wc-mobile-menu-btn{
 display:none;margin-left:auto;width:42px;height:42px;border:1px solid var(--wc-line);border-radius:12px;
 background:rgba(255,255,255,.025);align-items:center;justify-content:center;flex-direction:column;gap:4px
}
.wc-mobile-menu-btn span{width:17px;height:2px;border-radius:999px;background:#d9e4f4}
.wc-mobile-overlay{
 position:fixed;inset:0;z-index:50000;display:none;padding:10px;background:rgba(1,5,14,.74);backdrop-filter:blur(18px)
}
.wc-mobile-overlay.open{display:flex;align-items:flex-end}
.wc-mobile-sheet{
 width:100%;max-height:88vh;overflow:auto;padding:16px;border-radius:24px 24px 18px 18px;
 border:1px solid rgba(150,204,255,.13);
 background:radial-gradient(circle at 90% 0%,rgba(84,211,255,.10),transparent 27%),
 linear-gradient(180deg,rgba(8,22,47,.99),rgba(3,11,27,.99));
 box-shadow:0 -20px 70px rgba(0,0,0,.45)
}
.wc-mobile-head{display:flex;align-items:center;justify-content:space-between;padding:3px 2px 14px}
.wc-mobile-head small{display:block;color:#6f85a7;font-size:.53rem;font-weight:900;letter-spacing:.14em}
.wc-mobile-head strong{display:block;margin-top:3px;font-size:1rem}
.wc-mobile-close{
 width:40px;height:40px;border-radius:12px;border:1px solid var(--wc-line);
 background:rgba(255,255,255,.025);color:#dce7f7;font-size:1.35rem
}
.wc-mobile-links{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.wc-mobile-links a{
 display:flex;align-items:center;gap:10px;min-height:58px;padding:11px 12px;
 border:1px solid var(--wc-line);border-radius:15px;background:rgba(255,255,255,.022);color:#dce7f7
}
.wc-mobile-links span{font-size:1.08rem}.wc-mobile-links b{font-size:.69rem}
.wc-menu-open{overflow:hidden}
@media(max-width:1100px){
 .public-topnav.final-topnav{grid-template-columns:1fr auto!important;width:calc(100% - 20px)!important}
 .public-topnav-tabs,.public-topnav-actions{display:none!important}
 .wc-mobile-menu-btn{display:flex}
 .ss-home-hero{grid-template-columns:1fr!important;min-height:auto!important;padding:44px!important}
 .ss-feature-rail{grid-template-columns:repeat(3,1fr)!important}
 .prestige-board{grid-template-columns:1fr!important}
}
@media(max-width:760px){
 .public-topnav.final-topnav{
  width:calc(100% - 14px)!important;min-height:62px!important;margin-top:7px!important;top:6px!important;
  padding:7px 8px!important;border-radius:17px!important
 }
 .public-brand-mark{width:40px!important;height:40px!important;border-radius:13px!important}
 .public-brand small{display:none!important}
 .ss-home-hero{
  width:calc(100% - 14px)!important;margin:11px auto 10px!important;padding:28px 19px 26px!important;border-radius:24px!important
 }
 .ss-home-copy h1{font-size:clamp(2.8rem,16vw,4.6rem)!important;line-height:.91!important;margin:16px 0 15px!important}
 .ss-home-copy p{font-size:.87rem!important;line-height:1.66!important}
 .ss-home-actions{display:grid!important;grid-template-columns:1fr!important;gap:9px!important}
 .ss-primary,.ss-secondary{width:100%!important}
 .ss-visual{display:none!important}
 .ss-feature-rail{
  width:calc(100% - 14px)!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important
 }
 .ss-feature-rail a{min-height:108px!important;padding:15px!important;border-radius:17px!important}
 .ss-player-day,.prestige-board{width:calc(100% - 14px)!important}
 .public-page,.page-shell,.pronos-shell,.live-shell,.social-hub,.profile-social-shell,main:not(.final-landing){
  width:calc(100% - 14px)!important
 }
 .card,.public-card,.prono-card,.live-card,.community-match,.social-section,.profile-side-card,.social-composer,.calendar-card,.admin-panel,.prestige-panel{
  border-radius:18px!important
 }
 .ultimate-admin-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .ultimate-admin-split{grid-template-columns:1fr!important}
 .champions-api-row{grid-template-columns:1fr!important}
 .ss-footer{width:calc(100% - 14px)!important}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}


/* ===== MOBILE HAMBURGER FINAL ===== */
@media(max-width:1100px){
  .wc-mobile-menu-btn{
    display:flex!important;
    position:relative!important;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    padding:0!important;
    margin-left:auto!important;
    border-radius:13px!important;
    border:1px solid rgba(145,196,255,.14)!important;
    background:rgba(255,255,255,.03)!important;
    box-shadow:0 10px 28px rgba(0,0,0,.22)!important;
    cursor:pointer!important;
  }

  .wc-mobile-menu-btn span{
    position:absolute!important;
    left:50%!important;
    width:19px!important;
    height:2px!important;
    border-radius:999px!important;
    background:#eef5ff!important;
    transform:translateX(-50%)!important;
    transition:transform .2s ease,opacity .2s ease,top .2s ease!important;
  }
  .wc-mobile-menu-btn span:nth-child(1){top:14px!important}
  .wc-mobile-menu-btn span:nth-child(2){top:21px!important}
  .wc-mobile-menu-btn span:nth-child(3){top:28px!important}

  body.wc-menu-open .wc-mobile-menu-btn span:nth-child(1){
    top:21px!important;transform:translateX(-50%) rotate(45deg)!important
  }
  body.wc-menu-open .wc-mobile-menu-btn span:nth-child(2){opacity:0!important}
  body.wc-menu-open .wc-mobile-menu-btn span:nth-child(3){
    top:21px!important;transform:translateX(-50%) rotate(-45deg)!important
  }

  /* Hide legacy mobile navigation elements to avoid duplicates */
  .mobile-dock,
  .mobile-nav,
  .mobile-menu,
  .public-mobile-nav,
  .ss-mobile-dock,
  .bottom-nav,
  .bottom-navigation,
  .mobile-bottom-nav{
    display:none!important;
  }
}

@media(max-width:760px){
  .wc-mobile-overlay{
    padding:0!important;
    align-items:stretch!important;
  }

  .wc-mobile-overlay.open{
    display:flex!important;
  }

  .wc-mobile-sheet{
    margin-top:auto!important;
    max-height:92vh!important;
    border-radius:26px 26px 0 0!important;
    padding:18px 14px 20px!important;
  }

  .wc-mobile-head{
    position:sticky!important;
    top:0!important;
    z-index:2!important;
    padding:4px 2px 14px!important;
    background:linear-gradient(180deg,rgba(8,22,47,.99),rgba(8,22,47,.96),transparent)!important;
  }

  .wc-mobile-links{
    grid-template-columns:1fr 1fr!important;
    gap:9px!important;
  }

  .wc-mobile-links a{
    min-height:66px!important;
    padding:13px!important;
    border-radius:16px!important;
    background:rgba(255,255,255,.025)!important;
  }

  .wc-mobile-links a:active{
    transform:scale(.98)!important;
  }

  .wc-mobile-links span{
    font-size:1.18rem!important;
  }

  .wc-mobile-links b{
    font-size:.72rem!important;
  }
}

@media(max-width:390px){
  .wc-mobile-links{
    grid-template-columns:1fr!important;
  }
}


/* ============================================================
   WORLDCLASS ANIMATED BACKGROUND
   ============================================================ */

body::after{
  content:"";
  position:fixed;
  inset:-20%;
  z-index:-8;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 22%,rgba(105,83,255,.20),transparent 22%),
    radial-gradient(circle at 78% 18%,rgba(77,220,255,.16),transparent 20%),
    radial-gradient(circle at 66% 78%,rgba(106,117,255,.14),transparent 24%),
    radial-gradient(circle at 22% 76%,rgba(178,105,255,.10),transparent 21%);
  filter:blur(22px);
  animation:wcAuroraDrift 22s ease-in-out infinite alternate;
}

#wcAnimatedBackground{
  position:fixed;
  inset:0;
  z-index:-7;
  pointer-events:none;
  overflow:hidden;
}

.wc-aurora{
  position:absolute;
  border-radius:50%;
  filter:blur(72px);
  opacity:.22;
  mix-blend-mode:screen;
  will-change:transform;
}

.wc-aurora.a1{
  width:42vw;height:42vw;
  left:-12vw;top:8vh;
  background:radial-gradient(circle,#7c5cff 0%,rgba(124,92,255,.34) 40%,transparent 72%);
  animation:wcBlobOne 24s ease-in-out infinite alternate;
}
.wc-aurora.a2{
  width:36vw;height:36vw;
  right:-10vw;top:18vh;
  background:radial-gradient(circle,#59dfff 0%,rgba(89,223,255,.30) 38%,transparent 72%);
  animation:wcBlobTwo 28s ease-in-out infinite alternate;
}
.wc-aurora.a3{
  width:32vw;height:32vw;
  left:34vw;bottom:-14vw;
  background:radial-gradient(circle,#8d72ff 0%,rgba(141,114,255,.24) 40%,transparent 72%);
  animation:wcBlobThree 30s ease-in-out infinite alternate;
}

.wc-stars,
.wc-stars::before,
.wc-stars::after{
  position:absolute;
  inset:0;
  content:"";
  background-repeat:repeat;
  background-image:
    radial-gradient(circle,rgba(255,255,255,.75) 0 1px,transparent 1.2px);
  background-size:88px 88px;
}
.wc-stars{opacity:.11;animation:wcStarsMove 48s linear infinite}
.wc-stars::before{
  background-size:132px 132px;
  background-position:44px 26px;
  opacity:.55;
  animation:wcStarsMoveReverse 66s linear infinite;
}
.wc-stars::after{
  background-size:180px 180px;
  background-position:73px 92px;
  opacity:.36;
  animation:wcStarsMove 84s linear infinite;
}

.wc-light-streak{
  position:absolute;
  width:42vw;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(116,229,255,.42),transparent);
  filter:drop-shadow(0 0 10px rgba(116,229,255,.32));
  opacity:.28;
}
.wc-light-streak.s1{
  top:22%;
  left:-20%;
  transform:rotate(-11deg);
  animation:wcStreak 18s linear infinite;
}
.wc-light-streak.s2{
  top:68%;
  right:-20%;
  transform:rotate(13deg);
  animation:wcStreakReverse 24s linear infinite;
}

@keyframes wcAuroraDrift{
  0%{transform:translate3d(-2%,0,0) scale(1)}
  50%{transform:translate3d(3%,-2%,0) scale(1.06)}
  100%{transform:translate3d(-1%,3%,0) scale(1.02)}
}
@keyframes wcBlobOne{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(18vw,8vh,0) scale(1.08)}
  100%{transform:translate3d(8vw,24vh,0) scale(.94)}
}
@keyframes wcBlobTwo{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-17vw,12vh,0) scale(.94)}
  100%{transform:translate3d(-9vw,28vh,0) scale(1.08)}
}
@keyframes wcBlobThree{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-10vw,-18vh,0) scale(1.08)}
  100%{transform:translate3d(14vw,-30vh,0) scale(.96)}
}
@keyframes wcStarsMove{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-88px,88px,0)}
}
@keyframes wcStarsMoveReverse{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(132px,-132px,0)}
}
@keyframes wcStreak{
  0%{transform:translateX(-10vw) rotate(-11deg);opacity:0}
  20%{opacity:.25}
  80%{opacity:.25}
  100%{transform:translateX(150vw) rotate(-11deg);opacity:0}
}
@keyframes wcStreakReverse{
  0%{transform:translateX(10vw) rotate(13deg);opacity:0}
  20%{opacity:.18}
  80%{opacity:.18}
  100%{transform:translateX(-150vw) rotate(13deg);opacity:0}
}

/* Premium glass depth */
.public-topnav.final-topnav,
.ss-home-hero,
.prestige-panel,
.card,.public-card,.prono-card,.live-card,.community-match,.social-section,
.profile-side-card,.social-composer,.calendar-card,.admin-panel{
  box-shadow:
    0 24px 80px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.025)!important;
}

.ss-home-hero{
  position:relative!important;
}
.ss-home-hero::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:
    linear-gradient(120deg,transparent 0%,rgba(255,255,255,.035) 31%,transparent 46%);
  transform:translateX(-120%);
  animation:wcHeroSheen 10s ease-in-out infinite;
}
@keyframes wcHeroSheen{
  0%,72%{transform:translateX(-120%)}
  88%,100%{transform:translateX(120%)}
}

/* Button glow */
.ss-primary,.public-cta-btn,.ultimate-backup-btn,.champions-api-row button{
  position:relative;
  overflow:hidden;
}
.ss-primary::after,.public-cta-btn::after,.ultimate-backup-btn::after,.champions-api-row button::after{
  content:"";
  position:absolute;
  inset:-30% -80%;
  background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.42) 48%,transparent 60%);
  transform:translateX(-100%);
  transition:transform .55s ease;
}
.ss-primary:hover::after,.public-cta-btn:hover::after,.ultimate-backup-btn:hover::after,.champions-api-row button:hover::after{
  transform:translateX(100%);
}

/* Card glow on hover */
.ss-feature-rail a,
.prestige-match,
.prestige-rank{
  position:relative;
  overflow:hidden;
}
.ss-feature-rail a::before,
.prestige-match::before,
.prestige-rank::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;
  background:radial-gradient(circle at var(--wc-x,50%) var(--wc-y,50%),rgba(101,228,255,.10),transparent 36%);
  transition:opacity .2s ease;
}
.ss-feature-rail a:hover::before,
.prestige-match:hover::before,
.prestige-rank:hover::before{opacity:1}

/* Mobile performance tuning */
@media(max-width:760px){
  body::after{filter:blur(32px);opacity:.72}
  .wc-aurora{filter:blur(62px);opacity:.18}
  .wc-stars{opacity:.07}
  .wc-light-streak{display:none}
}

/* Reduced motion */
@media(prefers-reduced-motion:reduce){
  body::after,
  .wc-aurora,
  .wc-stars,
  .wc-stars::before,
  .wc-stars::after,
  .wc-light-streak,
  .ss-home-hero::after{
    animation:none!important;
  }
}


/* ============================================================
   FOOTBALL STADIUM ANIMATED BACKGROUND — USER IMAGE
   ============================================================ */

body{
  position:relative;
  background:#020611!important;
}

/* The exact football image supplied by the user */
#wcFootballBackground{
  position:fixed;
  inset:-5%;
  z-index:-12;
  pointer-events:none;
  background-image:
    linear-gradient(180deg,rgba(2,6,17,.16),rgba(2,6,17,.34)),
    url("assets/football-stadium-bg.png");
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  will-change:transform,filter;
  animation:footballCinematicPan 24s ease-in-out infinite alternate;
}

/* Dark readability layer so cards/text remain crystal clear */
#wcFootballBackground::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 50% 22%,transparent 0 24%,rgba(1,5,16,.16) 48%,rgba(1,5,16,.44) 100%),
    linear-gradient(180deg,rgba(2,6,17,.05) 0%,rgba(2,6,17,.12) 48%,rgba(2,6,17,.40) 100%);
}

/* Animated stadium light haze */
#wcFootballLights{
  position:fixed;
  inset:0;
  z-index:-11;
  pointer-events:none;
  overflow:hidden;
}
#wcFootballLights::before,
#wcFootballLights::after{
  content:"";
  position:absolute;
  width:58vw;
  height:58vw;
  border-radius:50%;
  filter:blur(72px);
  opacity:.16;
  mix-blend-mode:screen;
}
#wcFootballLights::before{
  left:-23vw;
  top:-9vw;
  background:radial-gradient(circle,rgba(82,142,255,.78),rgba(82,142,255,.18) 44%,transparent 70%);
  animation:footballGlowLeft 16s ease-in-out infinite alternate;
}
#wcFootballLights::after{
  right:-22vw;
  top:0;
  background:radial-gradient(circle,rgba(149,83,255,.62),rgba(90,194,255,.15) 43%,transparent 70%);
  animation:footballGlowRight 19s ease-in-out infinite alternate;
}

/* Slight floating energy line across the pitch */
#wcFootballEnergy{
  position:fixed;
  z-index:-10;
  pointer-events:none;
  left:-20vw;
  bottom:19vh;
  width:140vw;
  height:2px;
  opacity:.26;
  background:linear-gradient(90deg,transparent 0%,rgba(93,148,255,.20) 25%,rgba(108,230,255,.68) 50%,rgba(166,87,255,.48) 72%,transparent 100%);
  filter:blur(.2px) drop-shadow(0 0 10px rgba(85,181,255,.40));
  animation:footballEnergySweep 10s ease-in-out infinite alternate;
}

/* Disable older synthetic background, keeping only subtle stars */
body::after{
  opacity:.18!important;
}
.wc-aurora{
  opacity:.05!important;
}
.wc-light-streak{
  opacity:.10!important;
}
.wc-stars{
  opacity:.045!important;
}

/* Strengthen glass panels over the photographic background */
.public-topnav.final-topnav,
.ss-home-hero,
.prestige-panel,
.card,.public-card,.prono-card,.live-card,.community-match,.social-section,
.profile-side-card,.social-composer,.calendar-card,.admin-panel,
.champions-api-panel,.ultimate-admin-panel{
  backdrop-filter:blur(20px) saturate(1.22)!important;
  background:linear-gradient(180deg,rgba(5,14,34,.80),rgba(3,10,26,.87))!important;
}

/* Hero lets more of the stadium show through */
.ss-home-hero{
  background:
    radial-gradient(circle at 12% 18%,rgba(129,88,255,.13),transparent 31%),
    radial-gradient(circle at 84% 19%,rgba(67,210,255,.09),transparent 29%),
    linear-gradient(145deg,rgba(5,15,36,.70),rgba(2,9,24,.78))!important;
}

/* Cinematic movement */
@keyframes footballCinematicPan{
  0%{
    transform:scale(1.04) translate3d(-1.3%,0,0);
    filter:saturate(1.02) brightness(.94);
  }
  35%{
    transform:scale(1.075) translate3d(.5%,-.8%,0);
    filter:saturate(1.08) brightness(.98);
  }
  70%{
    transform:scale(1.055) translate3d(1.4%,.4%,0);
    filter:saturate(1.04) brightness(.95);
  }
  100%{
    transform:scale(1.085) translate3d(-.2%,-1.1%,0);
    filter:saturate(1.10) brightness(.99);
  }
}
@keyframes footballGlowLeft{
  from{transform:translate3d(-4vw,0,0) scale(.92);opacity:.11}
  to{transform:translate3d(12vw,8vh,0) scale(1.15);opacity:.20}
}
@keyframes footballGlowRight{
  from{transform:translate3d(4vw,-2vh,0) scale(1.05);opacity:.10}
  to{transform:translate3d(-12vw,10vh,0) scale(.92);opacity:.19}
}
@keyframes footballEnergySweep{
  from{transform:translateX(-5vw) scaleX(.94);opacity:.16}
  to{transform:translateX(5vw) scaleX(1.04);opacity:.34}
}

/* Phone: same background, lighter animation for smoothness */
@media(max-width:760px){
  #wcFootballBackground{
    inset:-3%;
    background-position:68% center;
    animation:footballMobilePan 26s ease-in-out infinite alternate;
  }
  #wcFootballLights::before,
  #wcFootballLights::after{
    filter:blur(58px);
    opacity:.12;
  }
  #wcFootballEnergy{
    bottom:22vh;
    opacity:.16;
  }
  @keyframes footballMobilePan{
    from{transform:scale(1.06) translate3d(-1%,0,0)}
    to{transform:scale(1.09) translate3d(1%,-.6%,0)}
  }
}

@media(prefers-reduced-motion:reduce){
  #wcFootballBackground,
  #wcFootballLights::before,
  #wcFootballLights::after,
  #wcFootballEnergy{
    animation:none!important;
  }
}


/* ============================================================
   HOME CLEAN — simplified homepage
   ============================================================ */
.prestige-home .ss-home-hero{
  min-height:500px!important;
  margin-bottom:12px!important;
}

.home-clean-quick{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  max-width:980px!important;
  margin-top:12px!important;
  margin-bottom:14px!important;
}

.home-clean-quick a{
  min-height:104px!important;
}

.prestige-home .prestige-board{
  grid-template-columns:1.35fr .65fr!important;
  margin-top:10px!important;
  margin-bottom:28px!important;
}

.prestige-home .prestige-panel-head{
  min-height:64px!important;
}

.prestige-home .prestige-match-list{
  padding:5px!important;
}

.prestige-home .prestige-match{
  min-height:78px!important;
}

.prestige-home .ss-player-day,
.prestige-home .sig-page-ribbon,
.prestige-home .imperium-auth-header,
.prestige-home #authChoiceScreen,
.prestige-home #authFormScreen{
  display:none!important;
}

@media(max-width:900px){
  .home-clean-quick{
    grid-template-columns:1fr 1fr 1fr!important;
    max-width:none!important;
  }
  .prestige-home .prestige-board{
    grid-template-columns:1fr!important;
  }
}

@media(max-width:700px){
  .prestige-home .ss-home-hero{
    min-height:auto!important;
  }
  .home-clean-quick{
    width:calc(100% - 14px)!important;
    grid-template-columns:1fr!important;
  }
  .home-clean-quick a{
    min-height:82px!important;
  }
}


/* ============================================================
   HOME MINIMAL — hero only
   ============================================================ */
.prestige-home .ss-home-hero{
  min-height:calc(100vh - 118px)!important;
  display:grid!important;
  align-items:center!important;
  margin-bottom:24px!important;
}

.prestige-home .ss-home-copy{
  max-width:760px!important;
}

.prestige-home .ss-home-copy p{
  max-width:600px!important;
}

.prestige-home .ss-home-actions{
  display:flex!important;
  gap:10px!important;
  flex-wrap:wrap!important;
}

.prestige-home .ss-feature-rail,
.prestige-home .home-clean-quick,
.prestige-home .prestige-board,
.prestige-home .ss-player-day,
.prestige-home .sig-page-ribbon,
.prestige-home .imperium-auth-header,
.prestige-home #authChoiceScreen,
.prestige-home #authFormScreen{
  display:none!important;
}

.prestige-home .ss-footer{
  margin-top:12px!important;
}

@media(max-width:760px){
  .prestige-home .ss-home-hero{
    min-height:calc(100vh - 86px)!important;
    display:flex!important;
    align-items:center!important;
    padding-top:28px!important;
    padding-bottom:28px!important;
  }

  .prestige-home .ss-home-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    width:100%!important;
  }
}


/* ============================================================
   HOME ULTRA MINIMAL
   ============================================================ */
.prestige-home .ss-home-hero,
.prestige-home .ss-feature-rail,
.prestige-home .home-clean-quick,
.prestige-home .prestige-board,
.prestige-home .ss-player-day,
.prestige-home .sig-page-ribbon,
.prestige-home .imperium-auth-header,
.prestige-home #authChoiceScreen,
.prestige-home #authFormScreen,
.prestige-home .ss-footer,
.prestige-home .global-disclaimer{
  display:none!important;
}

.ultra-home{
  width:min(1320px,calc(100% - 30px));
  min-height:calc(100vh - 105px);
  margin:18px auto 0;
  display:grid;
  place-items:center;
  text-align:center;
}

.ultra-home-inner{
  display:grid;
  justify-items:center;
  gap:0;
  padding:32px 20px;
}

.ultra-home-mark{
  width:72px;
  height:72px;
  display:grid;
  place-items:center;
  margin-bottom:20px;
  border-radius:22px;
  color:white;
  font-size:1.8rem;
  background:
    radial-gradient(circle at 30% 25%,rgba(255,255,255,.42),transparent 20%),
    linear-gradient(145deg,#9c74ff,#6589ff 55%,#6ce7ff);
  box-shadow:0 22px 70px rgba(89,123,255,.34);
  animation:ultraFloat 5.5s ease-in-out infinite;
}

.ultra-home h1{
  margin:0;
  font-size:clamp(3.8rem,9vw,8rem);
  line-height:.88;
  letter-spacing:-.075em;
  font-weight:950;
  background:linear-gradient(90deg,#b8e6ff,#ffffff 45%,#c8b8ff 84%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  text-shadow:0 14px 50px rgba(76,139,255,.10);
}

.ultra-home p{
  margin:18px 0 26px;
  color:#9aaeca;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.ultra-home-enter{
  min-width:210px;
  min-height:52px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 22px;
  border-radius:15px;
  color:#06111f;
  font-size:.76rem;
  font-weight:950;
  background:linear-gradient(135deg,#d8fbff,#71e8ff 52%,#94a8ff);
  box-shadow:0 16px 40px rgba(73,202,255,.25);
  transition:transform .18s ease,box-shadow .18s ease;
}

.ultra-home-enter:hover{
  transform:translateY(-3px);
  box-shadow:0 22px 54px rgba(73,202,255,.31);
}

@keyframes ultraFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-8px)}
}

@media(max-width:760px){
  .ultra-home{
    width:calc(100% - 14px);
    min-height:calc(100vh - 76px);
    margin-top:7px;
  }
  .ultra-home-mark{
    width:62px;
    height:62px;
    border-radius:19px;
    font-size:1.55rem;
  }
  .ultra-home h1{
    font-size:clamp(3rem,18vw,5.2rem);
  }
  .ultra-home p{
    margin-top:14px;
    margin-bottom:22px;
    font-size:.63rem;
    letter-spacing:.12em;
  }
  .ultra-home-enter{
    width:100%;
    max-width:300px;
  }
}

@media(prefers-reduced-motion:reduce){
  .ultra-home-mark{animation:none!important}
}


/* ============================================================
   TRUE MINIMAL HOME — this page contains no legacy content
   ============================================================ */
.true-minimal-home{
  min-height:100vh;
  overflow-x:hidden;
}

.true-minimal-home .public-topnav.final-topnav{
  z-index:10000!important;
}

.true-home-stage{
  width:min(1320px,calc(100% - 30px))!important;
  min-height:calc(100vh - 94px);
  margin:0 auto!important;
  display:grid;
  place-items:center;
  position:relative;
  z-index:1;
}

.true-home-content{
  display:grid;
  justify-items:center;
  text-align:center;
  padding:28px 18px 54px;
}

.true-home-mark{
  width:70px;
  height:70px;
  display:grid;
  place-items:center;
  margin-bottom:20px;
  border-radius:22px;
  color:#fff;
  font-size:1.75rem;
  background:
    radial-gradient(circle at 30% 24%,rgba(255,255,255,.45),transparent 20%),
    linear-gradient(145deg,#9b74ff,#6689ff 55%,#6ce8ff);
  box-shadow:0 22px 70px rgba(83,125,255,.34);
  animation:trueHomeFloat 5.5s ease-in-out infinite;
}

.true-home-content h1{
  margin:0;
  font-size:clamp(4rem,9vw,8rem);
  line-height:.88;
  letter-spacing:-.075em;
  font-weight:950;
  background:linear-gradient(90deg,#b9e6ff,#fff 46%,#cabaff 84%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.true-home-content p{
  margin:18px 0 28px;
  color:#a3b4cc;
  font-size:.76rem;
  font-weight:900;
  letter-spacing:.17em;
}

.true-home-enter{
  min-width:220px;
  min-height:52px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 24px;
  border-radius:15px;
  color:#06111f;
  font-size:.76rem;
  font-weight:950;
  background:linear-gradient(135deg,#d9fbff,#72e8ff 52%,#95a7ff);
  box-shadow:0 16px 42px rgba(72,202,255,.26);
  transition:transform .18s ease,box-shadow .18s ease;
}

.true-home-enter:hover{
  transform:translateY(-3px);
  box-shadow:0 22px 54px rgba(72,202,255,.33);
}

@keyframes trueHomeFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-8px)}
}

@media(max-width:1100px){
  .true-home-stage{
    width:calc(100% - 14px)!important;
    min-height:calc(100vh - 70px);
  }
}

@media(max-width:760px){
  .true-home-content{
    width:100%;
    padding:22px 15px 40px;
  }

  .true-home-mark{
    width:60px;
    height:60px;
    border-radius:19px;
    font-size:1.45rem;
    margin-bottom:17px;
  }

  .true-home-content h1{
    font-size:clamp(3rem,18vw,5.2rem);
  }

  .true-home-content p{
    margin:14px 0 23px;
    font-size:.61rem;
    letter-spacing:.12em;
  }

  .true-home-enter{
    width:min(300px,100%);
  }
}

@media(prefers-reduced-motion:reduce){
  .true-home-mark{animation:none!important}
}


/* ============================================================
   CLEANSTART HOME — no legacy blocks, no desktop mega-nav
   ============================================================ */
.cleanstart-home{
  min-height:100vh;
  margin:0;
  overflow-x:hidden;
  background:#020611!important;
  color:#f7f9ff;
}

.cs-header{
  position:fixed;
  top:12px;
  left:50%;
  transform:translateX(-50%);
  z-index:20000;
  width:min(1180px,calc(100% - 24px));
  min-height:64px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:8px 10px;
  border:1px solid rgba(145,196,255,.13);
  border-radius:18px;
  background:rgba(3,11,27,.74);
  backdrop-filter:blur(22px) saturate(1.2);
  box-shadow:0 18px 60px rgba(0,0,0,.28);
}

.cs-brand{
  display:flex;
  align-items:center;
  gap:10px;
  color:#fff;
  text-decoration:none;
}
.cs-logo{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:
    radial-gradient(circle at 30% 22%,rgba(255,255,255,.42),transparent 20%),
    linear-gradient(145deg,#9b74ff,#6689ff 55%,#6ce8ff);
  box-shadow:0 10px 28px rgba(82,124,255,.28);
}
.cs-brand-copy strong{
  display:block;
  font-size:.78rem;
  letter-spacing:.11em;
}
.cs-brand-copy small{
  display:block;
  margin-top:2px;
  color:#7f93b0;
  font-size:.48rem;
  font-weight:800;
}

.cs-menu-btn{
  position:relative;
  width:44px;
  height:44px;
  border:1px solid rgba(145,196,255,.13);
  border-radius:13px;
  background:rgba(255,255,255,.025);
  cursor:pointer;
}
.cs-menu-btn span{
  position:absolute;
  left:50%;
  width:19px;
  height:2px;
  border-radius:99px;
  background:#eef5ff;
  transform:translateX(-50%);
}
.cs-menu-btn span:nth-child(1){top:14px}
.cs-menu-btn span:nth-child(2){top:21px}
.cs-menu-btn span:nth-child(3){top:28px}

.cs-stage{
  position:relative;
  z-index:2;
  width:min(1180px,calc(100% - 24px));
  min-height:100vh;
  margin:0 auto;
  display:grid;
  place-items:center;
  padding:96px 0 24px;
}
.cs-hero{
  display:grid;
  justify-items:center;
  text-align:center;
  padding:24px;
}
.cs-hero-logo{
  width:68px;
  height:68px;
  display:grid;
  place-items:center;
  margin-bottom:20px;
  border-radius:21px;
  color:#fff;
  font-size:1.65rem;
  background:
    radial-gradient(circle at 30% 22%,rgba(255,255,255,.45),transparent 20%),
    linear-gradient(145deg,#9b74ff,#6689ff 55%,#6ce8ff);
  box-shadow:0 22px 70px rgba(82,124,255,.34);
  animation:csFloat 5.5s ease-in-out infinite;
}
.cs-hero h1{
  margin:0;
  font-size:clamp(4rem,9vw,8rem);
  line-height:.88;
  letter-spacing:-.075em;
  font-weight:950;
  background:linear-gradient(90deg,#b9e6ff,#fff 46%,#cabaff 84%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.cs-hero p{
  margin:18px 0 27px;
  color:#a5b6ce;
  font-size:.75rem;
  font-weight:900;
  letter-spacing:.16em;
}
.cs-enter{
  min-width:220px;
  min-height:52px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 24px;
  border-radius:15px;
  color:#06111f;
  text-decoration:none;
  font-size:.76rem;
  font-weight:950;
  background:linear-gradient(135deg,#d9fbff,#72e8ff 52%,#95a7ff);
  box-shadow:0 16px 42px rgba(72,202,255,.26);
}

.cs-drawer{
  position:fixed;
  inset:0;
  z-index:50000;
  display:none;
  padding:12px;
  background:rgba(1,5,14,.72);
  backdrop-filter:blur(18px);
}
.cs-drawer.open{
  display:flex;
  align-items:flex-end;
}
.cs-drawer-panel{
  width:min(620px,100%);
  max-height:90vh;
  margin:0 auto;
  overflow:auto;
  padding:16px;
  border:1px solid rgba(145,196,255,.13);
  border-radius:24px;
  background:
    radial-gradient(circle at 90% 0%,rgba(84,211,255,.10),transparent 27%),
    linear-gradient(180deg,rgba(8,22,47,.99),rgba(3,11,27,.99));
  box-shadow:0 -20px 70px rgba(0,0,0,.42);
}
.cs-drawer-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:14px;
}
.cs-drawer-head small{
  display:block;
  color:#7186a6;
  font-size:.53rem;
  font-weight:900;
  letter-spacing:.14em;
}
.cs-drawer-head strong{
  display:block;
  margin-top:3px;
  font-size:1rem;
}
.cs-drawer-head button{
  width:40px;
  height:40px;
  border:1px solid rgba(145,196,255,.13);
  border-radius:12px;
  background:rgba(255,255,255,.025);
  color:#fff;
  font-size:1.3rem;
}
.cs-links{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.cs-links a{
  min-height:58px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 12px;
  border:1px solid rgba(145,196,255,.12);
  border-radius:15px;
  background:rgba(255,255,255,.022);
  color:#dce7f7;
  text-decoration:none;
  font-size:.72rem;
  font-weight:850;
}

@keyframes csFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-8px)}
}

@media(max-width:700px){
  .cs-header{
    top:7px;
    width:calc(100% - 14px);
    min-height:60px;
  }
  .cs-brand-copy small{display:none}
  .cs-stage{
    width:calc(100% - 14px);
    padding-top:82px;
  }
  .cs-hero h1{
    font-size:clamp(3rem,18vw,5.1rem);
  }
  .cs-hero p{
    font-size:.61rem;
    letter-spacing:.12em;
  }
  .cs-enter{
    width:min(300px,100%);
  }
}

@media(max-width:390px){
  .cs-links{grid-template-columns:1fr}
}

@media(prefers-reduced-motion:reduce){
  .cs-hero-logo{animation:none}
}

.mm-admin-command-center{
  width:min(1220px,calc(100% - 24px));margin:20px auto;padding:24px;
  display:flex;justify-content:space-between;gap:20px;align-items:center;
  border:1px solid rgba(255,193,45,.32);border-radius:20px;
  background:radial-gradient(circle at 90% 0%,rgba(255,190,38,.09),transparent 28%),linear-gradient(180deg,#091a3b,#051229);
  box-shadow:0 24px 70px rgba(0,0,0,.25)
}
.mm-admin-command-center small{color:#ffd34a;font-weight:900;letter-spacing:.1em}
.mm-admin-command-center h1{margin:7px 0;font-size:2rem}
.mm-admin-command-center p{margin:0;color:#9eb0c9;max-width:720px;line-height:1.6}
.mm-admin-command-actions{display:flex;flex-wrap:wrap;gap:8px}
.mm-admin-command-actions a{padding:11px 13px;border-radius:10px;border:1px solid rgba(255,193,45,.28);background:#0a1a36;color:#fff}
@media(max-width:760px){.mm-admin-command-center{display:grid}.mm-admin-command-actions{display:grid}}