/* =========================================================
   BattleRanking.com — CLEAN FINAL CSS
   Last cleanup: image ratios + legal spacing + mobile battle view

   FINAL IMAGE MAP

   - portrait 4:5  -> /assets/images/entities/portrait/
     Used for single entities, Global Top avatars, Spotlight sides, modal sides, battle page sides.

   - hero 16:9     -> /assets/images/battles/hero/
     Used for big battle background, Spotlight background, modal background, battle page background,
     Rising Battles, Explore / Closest / Latest compact cards, and social/share preview for now.

   - card 4:5      -> /assets/images/battles/card/
     Used ONLY for Main Battle hero cards, the vertical rotating cards in the homepage hero.

   - share         -> no separate file for MVP.
     Social/share preview uses hero 16:9 for now.
========================================================= */

:root{
  --bg:#02040a;
  --bg2:#050812;
  --panel:rgba(8,12,22,.76);
  --panel2:rgba(10,16,30,.90);
  --line:rgba(255,255,255,.10);
  --line2:rgba(255,255,255,.18);
  --text:#f7f9ff;
  --muted:#aab4c8;
  --soft:#78839a;
  --blue:#287cff;
  --blue2:#73b2ff;
  --red:#ff244d;
  --red2:#ff5a36;
  --gold:#e4bd66;
  --shadow:0 34px 120px rgba(0,0,0,.50);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg);-webkit-text-size-adjust:100%}
body{
  margin:0;
  min-height:100vh;
  background:var(--bg);
  color:var(--text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:-.02em;
  overflow-x:hidden;
  text-rendering:geometricPrecision;
  -webkit-font-smoothing:antialiased;
}
body.modal-open{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit}
button{border:0;-webkit-tap-highlight-color:transparent}
button:not(:disabled){cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.68;filter:saturate(.7)}
img,canvas,video{max-width:100%}
h1,h2,h3,p{margin-top:0}
::selection{background:rgba(255,36,77,.34);color:#fff}

#home,
#spotlight,
#featured-battle,
#explore,
#top50-preview,
#top-battles,
#suggest,
#how,
#full-ranking,
#battle-ranking{
  scroll-margin-top:108px;
}

/* =========================================================
   BACKGROUND
========================================================= */

.page-glow{
  position:fixed;
  inset:0;
  z-index:-5;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 12%, rgba(40,124,255,.32), transparent 32%),
    radial-gradient(circle at 88% 18%, rgba(255,36,77,.26), transparent 34%),
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.10), transparent 30%),
    linear-gradient(180deg,#030713 0%, #02040a 52%, #03050b 100%);
}
.page-glow:after{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size:70px 70px;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.88), transparent 78%);
  opacity:.68;
}

/* =========================================================
   HEADER
========================================================= */

.site-header{
  min-height:78px;
  display:grid;
  grid-template-columns:285px minmax(0,1fr) 250px;
  align-items:center;
  gap:24px;
  padding:0 clamp(18px,4vw,58px);
  border-bottom:1px solid var(--line);
  background:rgba(2,4,10,.86);
  backdrop-filter:blur(24px);
  -webkit-backdrop-filter:blur(24px);
  position:sticky;
  top:0;
  z-index:100;
}
.brand,
.clean-brand,
.brand-with-icon{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}
.brand-mark{
  width:38px;
  height:38px;
  border-radius:13px;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:13px;
  font-weight:950;
  letter-spacing:-.04em;
  background:linear-gradient(135deg,var(--blue),var(--red));
  box-shadow:0 0 26px rgba(40,124,255,.24),0 0 24px rgba(255,36,77,.18);
  overflow:hidden;
}
.brand-mark-img{background:transparent}
.brand-mark-img img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  border-radius:inherit;
}
.brand-word,
.brand-text{
  font-size:23px;
  font-weight:850;
  letter-spacing:-.065em;
  white-space:nowrap;
}
.brand-word span,
.brand-text span{color:var(--red)}

.top-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:28px;
  color:#c8d0e1;
  font-weight:760;
  font-size:14px;
}
.top-nav a{
  position:relative;
  white-space:nowrap;
  opacity:.78;
  transition:opacity .18s ease,color .18s ease;
}
.top-nav a:hover{opacity:1;color:#fff}
.top-nav a:after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-10px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--blue),var(--red));
  transform:scaleX(0);
  opacity:0;
  transition:.22s ease;
}
.top-nav a:hover:after{transform:scaleX(1);opacity:1}

.social-nav{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}
.social-nav a{
  border:1px solid var(--line);
  background:rgba(255,255,255,.045);
  color:#dce4f5;
  border-radius:999px;
  padding:9px 12px;
  font-size:12px;
  font-weight:850;
  opacity:.86;
}
.social-nav a:hover{
  opacity:1;
  border-color:rgba(255,255,255,.28);
  background:rgba(255,255,255,.075);
}

/* =========================================================
   BASE
========================================================= */

.page-shell{
  width:min(1680px,calc(100% - 48px));
  margin:0 auto;
  padding:30px 0 64px;
}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  padding:0 25px;
  border-radius:14px;
  font-weight:950;
  border:1px solid transparent;
  cursor:pointer;
  transition:.18s ease;
  text-transform:uppercase;
  letter-spacing:.035em;
  font-size:13px;
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{
  background:linear-gradient(135deg,var(--red),var(--red2));
  color:#fff;
  box-shadow:0 18px 60px rgba(255,36,77,.32);
}
.btn-ghost{
  border-color:var(--line2);
  background:rgba(255,255,255,.045);
  color:#fff;
  backdrop-filter:blur(14px);
}
.btn-ghost:hover{
  border-color:rgba(255,255,255,.30);
  background:rgba(255,255,255,.075);
}
.eyebrow{
  margin:0 0 16px;
  color:var(--blue2);
  text-transform:uppercase;
  letter-spacing:.25em;
  font-weight:950;
  font-size:12px;
}
h1{
  font-size:clamp(58px,6.3vw,108px);
  line-height:.86;
  letter-spacing:-.092em;
  margin:0 0 24px;
  color:#fff;
}
h1 span{
  background:linear-gradient(90deg,#fff 0%,var(--blue2) 34%,var(--red) 74%,var(--red2) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

/* =========================================================
   HERO
========================================================= */

.arena-canvas-wrap,
.hero-orbit-ring,
.hero-orbit-glow{
  display:none!important;
}
.arena-hero{
  position:relative;
  isolation:isolate;
  display:grid;
  grid-template-columns:minmax(0,1fr) 390px;
  grid-template-areas:"copy ranking" "main ranking" "rising ranking";
  gap:28px;
  align-items:start;
  min-height:auto;
  padding:42px 0 26px;
  overflow:visible;
}
.arena-stage-bg{
  position:absolute;
  left:8%;
  right:8%;
  top:20px;
  height:540px;
  z-index:0;
  pointer-events:none;
  border-radius:44px;
  background:
    radial-gradient(circle at 42% 38%,rgba(40,124,255,.20),transparent 35%),
    radial-gradient(circle at 63% 40%,rgba(255,36,77,.16),transparent 38%),
    radial-gradient(ellipse at center,rgba(255,255,255,.06),transparent 62%);
  filter:blur(18px);
}
.hero-copy{
  grid-area:copy;
  position:relative;
  z-index:10;
  max-width:720px;
  padding-top:34px;
  filter:drop-shadow(0 24px 80px rgba(0,0,0,.35));
}
.live-eyebrow{
  display:flex;
  align-items:center;
  gap:10px;
}
.live-eyebrow:before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--red);
  box-shadow:0 0 24px rgba(255,36,77,.85);
}
.hero-subtitle{
  max-width:560px;
  font-size:18px;
  line-height:1.48;
  color:#c9d2e4;
  margin:0 0 22px;
}
.hero-proof{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  max-width:620px;
  color:rgba(231,237,250,.78);
  margin-bottom:26px;
}
.hero-proof strong{color:#fff}
.proof-dot{
  width:34px;
  height:34px;
  border-radius:999px;
  display:inline-grid;
  place-items:center;
  background:rgba(255,36,77,.10);
  border:1px solid rgba(255,36,77,.34);
  box-shadow:0 0 44px rgba(255,36,77,.18);
}
.proof-dot:before{
  content:"";
  width:10px;
  height:10px;
  background:var(--red);
  border-radius:50%;
  box-shadow:0 0 22px rgba(255,36,77,.88);
}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.privacy-strip{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin-top:22px;
}
.privacy-strip span{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.045);
  color:#d8e0f1;
  border-radius:999px;
  padding:8px 11px;
  font-size:12px;
  font-weight:850;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055);
}

/* Final hero copy */
.hero-copy-clean .live-eyebrow,
.hero-copy-clean .hero-proof,
.hero-copy-clean .hero-actions,
.hero-copy-clean .privacy-strip{
  display:none!important;
}
.hero-copy-clean{
  position:relative!important;
  isolation:isolate!important;
  z-index:30!important;
  max-width:820px!important;
  padding-top:0!important;
}
.hero-copy-clean:before{
  content:""!important;
  position:absolute!important;
  left:42%!important;
  top:42%!important;
  transform:translate(-50%,-50%)!important;
  width:720px!important;
  height:720px!important;
  z-index:-1!important;
  pointer-events:none!important;
  background-image:url('/assets/images/ui/logo.png')!important;
  background-size:contain!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  opacity:.105!important;
  filter:
    drop-shadow(0 0 80px rgba(65,140,255,.42))
    drop-shadow(0 0 72px rgba(95,10,38,.34))
    saturate(1.08)!important;
}
.hero-copy-clean:after{
  content:""!important;
  position:absolute!important;
  left:38%!important;
  top:42%!important;
  transform:translate(-50%,-50%)!important;
  width:820px!important;
  height:520px!important;
  z-index:-2!important;
  pointer-events:none!important;
  background:
    radial-gradient(circle at 28% 40%, rgba(55,130,255,.22), transparent 42%),
    radial-gradient(circle at 68% 48%, rgba(95,10,38,.24), transparent 46%),
    radial-gradient(circle at 48% 54%, rgba(255,255,255,.045), transparent 48%)!important;
  filter:blur(12px)!important;
}
.hero-title,
.hero-subtitle-clean{
  position:relative!important;
  z-index:2!important;
}
.hero-title{
  margin:0 0 24px!important;
  max-width:860px!important;
  font-size:clamp(70px,5.7vw,112px)!important;
  line-height:.86!important;
  letter-spacing:-.095em!important;
  font-weight:1000!important;
  color:#fff!important;
}
.hero-title span{
  background:none!important;
  -webkit-background-clip:border-box!important;
  background-clip:border-box!important;
  color:inherit!important;
}
.hero-title-line{
  display:block!important;
  white-space:nowrap!important;
}
.hero-word-white{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
.hero-title .hero-word-battle{
  background:none!important;
  color:#0b6fff!important;
  -webkit-text-fill-color:#0b6fff!important;
  text-shadow:none!important;
  filter:none!important;
}
.hero-title .hero-word-ranking{
  background:none!important;
  color:#c70b1a!important;
  -webkit-text-fill-color:#c70b1a!important;
  text-shadow:none!important;
  filter:none!important;
}
.hero-subtitle-clean{
  max-width:660px!important;
  margin:0!important;
  color:rgba(231,237,250,.82)!important;
  font-size:clamp(19px,1.45vw,25px)!important;
  line-height:1.38!important;
  letter-spacing:-.035em!important;
  font-weight:560!important;
}

/* =========================================================
   MAIN BATTLE CARDS
========================================================= */

.hero-battle-orbit{
  grid-area:main;
  position:relative;
  width:min(720px,100%);
  height:430px;
  margin:10px auto 0;
  z-index:12;
  perspective:1500px;
  pointer-events:auto;
  padding-top:24px;
}
.orbit-mode-label{
  position:absolute;
  left:50%;
  top:-12px;
  transform:translateX(-50%);
  z-index:80;
  width:max-content;
  padding:10px 18px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(5,12,26,.74);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:0 18px 60px rgba(0,0,0,.34);
  pointer-events:none;
}
.orbit-mode-label strong{
  font-size:11px;
  line-height:1;
  font-weight:950;
  letter-spacing:.20em;
  text-transform:uppercase;
  color:#e7f0ff;
  white-space:nowrap;
}
.orbit-mode-label em,
.orbit-arena-core,
.orbit-climbing-label{
  display:none!important;
}
.orbit-card{
  position:absolute;
  width:180px;
  height:225px;
  padding:0;
  border-radius:26px;
  overflow:hidden;
  color:#fff;
  background:#050812;
  text-align:left;
  cursor:pointer;
  pointer-events:auto;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:
    0 34px 110px rgba(0,0,0,.58),
    0 0 38px rgba(40,124,255,.12),
    0 0 34px rgba(255,36,77,.10);
  transform-style:preserve-3d;
  transition:transform .35s ease,border-color .25s ease,box-shadow .25s ease,filter .25s ease;
}
.orbit-card-bg{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(180deg,rgba(2,4,10,.03) 0%,rgba(2,4,10,.10) 45%,rgba(2,4,10,.42) 100%),
    var(--battle-image);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  opacity:1;
  filter:saturate(1.12) contrast(1.08) brightness(1.06);
  transition:transform .55s ease;
}
.orbit-live,
.orbit-meta,
.orbit-card strong,
.orbit-card em,
.orbit-open{
  display:none!important;
}
.orbit-card:before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  background:linear-gradient(135deg,rgba(40,124,255,.58),transparent 36%,rgba(255,36,77,.54));
  opacity:.24;
  pointer-events:none;
  z-index:1;
}
.orbit-card:after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 20% 10%,rgba(40,124,255,.22),transparent 35%),
    radial-gradient(circle at 80% 20%,rgba(255,36,77,.20),transparent 35%);
  mix-blend-mode:screen;
  opacity:.14;
  pointer-events:none;
}
.orbit-card:hover{
  transform:translateY(-24px) scale(1.12) rotate(0deg)!important;
  z-index:30!important;
  border-color:rgba(255,255,255,.42);
  box-shadow:
    0 44px 140px rgba(0,0,0,.72),
    0 0 70px rgba(40,124,255,.26),
    0 0 62px rgba(255,36,77,.22);
}
.orbit-card:hover .orbit-card-bg{transform:scale(1.08)}
.orbit-card-hidden{
  opacity:0!important;
  pointer-events:none!important;
  transform:translateX(260px) translateY(80px) scale(.72) rotate(12deg)!important;
  z-index:0!important;
}
.orbit-card-1{left:8px;top:132px;transform:rotate(-14deg) translateZ(-90px) scale(.82);opacity:.68;z-index:2;animation:floatCard 5.8s ease-in-out infinite}
.orbit-card-2{left:132px;top:76px;transform:rotate(-7deg) translateZ(10px) scale(.96);opacity:.88;z-index:4;animation:floatCard 6.4s ease-in-out infinite .18s}
.orbit-card-3{left:270px;top:24px;transform:rotate(3deg) translateZ(120px) scale(1.16);opacity:1;z-index:9;animation:floatCard 5.6s ease-in-out infinite .34s}
.orbit-card-4{left:430px;top:76px;transform:rotate(8deg) translateZ(10px) scale(.96);opacity:.88;z-index:4;animation:floatCard 6.6s ease-in-out infinite .52s}
.orbit-card-5{left:558px;top:132px;transform:rotate(14deg) translateZ(-90px) scale(.82);opacity:.68;z-index:2;animation:floatCard 7.2s ease-in-out infinite .7s}

.empty-hero-state{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:min(420px,100%);
  border:1px solid var(--line2);
  border-radius:22px;
  padding:22px;
  background:rgba(8,12,22,.78);
  backdrop-filter:blur(20px);
  text-align:center;
}
.empty-hero-state strong{display:block;margin-bottom:6px;font-size:20px}
.empty-hero-state span{color:var(--muted)}

/* =========================================================
   RISING BATTLES
========================================================= */

.hero-climbing-strip{
  grid-area:rising;
  position:relative;
  width:100vw;
  max-width:none;
  margin:24px calc(50% - 50vw) 38px;
  padding:0 24px;
  overflow:hidden;
  z-index:14;
}
.hero-climbing-head{
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 0 18px;
  padding:0;
}
.hero-climbing-head .live-dot,
.hero-climbing-head em{
  display:none!important;
}
.hero-climbing-head strong{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 18px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:rgba(5,12,26,.74);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:0 18px 60px rgba(0,0,0,.32);
  color:#e7f0ff;
  font-size:11px;
  font-weight:950;
  letter-spacing:.20em;
  text-transform:uppercase;
}
.hero-climbing-scroll{
  display:flex;
  gap:16px;
  overflow-x:auto;
  overflow-y:hidden;
  width:100%;
  max-width:none;
  margin:0 auto;
  padding:4px 24px 16px;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.hero-climbing-scroll::-webkit-scrollbar{display:none}
.climbing-card{
  position:relative;
  flex:0 0 250px;
  height:96px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  overflow:hidden;
  background:rgba(8,12,22,.78);
  color:#fff;
  text-align:left;
  cursor:pointer;
  scroll-snap-align:start;
  box-shadow:0 18px 46px rgba(0,0,0,.28);
}
.climbing-card-bg{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(180deg,rgba(4,8,18,.18),rgba(4,8,18,.86)),
    var(--battle-image);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  opacity:.78;
  transition:transform .35s ease,opacity .35s ease;
}
.climbing-card:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,0));
  opacity:.55;
  pointer-events:none;
}
.climbing-card strong,
.climbing-card small{
  position:relative;
  z-index:2;
  display:block;
}
.climbing-card strong{
  margin:28px 12px 0;
  font-size:14px;
  line-height:1.02;
  font-weight:900;
  color:#fff;
  letter-spacing:-.04em;
}
.climbing-card small{
  margin:6px 12px 0;
  font-size:11px;
  font-weight:800;
  color:#c9d7ef;
}
.climbing-card:hover .climbing-card-bg{
  transform:scale(1.06);
  opacity:.95;
}

/* =========================================================
   GLOBAL TOP
========================================================= */

.ranking-rail{
  border:1px solid var(--line2);
  border-radius:24px;
  background:rgba(8,12,22,.82);
  box-shadow:var(--shadow),inset 0 1px 0 rgba(255,255,255,.055);
  backdrop-filter:blur(28px);
  -webkit-backdrop-filter:blur(28px);
  overflow:hidden;
}
.hero-ranking{
  grid-area:ranking;
  position:relative;
  z-index:16;
  margin-top:0;
  overflow:auto;
  max-height:none;
  background:
    radial-gradient(circle at 0% 0%, rgba(31,124,255,.10), transparent 34%),
    radial-gradient(circle at 100% 0%, rgba(176,0,34,.10), transparent 34%),
    rgba(5,8,16,.94)!important;
  border:1px solid rgba(255,255,255,.10)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    0 28px 90px rgba(0,0,0,.32)!important;
  scrollbar-width:none!important;
}
.hero-ranking::-webkit-scrollbar{display:none!important}
.hero-vote-window{display:none!important}
.ranking-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  padding:22px 22px 12px;
}
.ranking-header h2{
  margin:0;
  font-size:28px;
  line-height:1;
  letter-spacing:-.06em;
}
.ranking-header-with-tabs{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:22px!important;
  margin-bottom:18px!important;
}
.ranking-header-with-tabs h2{margin:0!important}
.live-chip{display:none!important}
.rail-subtitle{
  margin:0 22px 16px;
  color:var(--muted);
  line-height:1.42;
}
.global-list{
  list-style:none;
  padding:0 16px 16px;
  margin:0;
  display:grid;
  gap:8px;
  scrollbar-width:none!important;
}
.global-list::-webkit-scrollbar{display:none!important}
.compact-global-list{
  max-height:520px;
  overflow:auto;
  scrollbar-width:none;
}
.global-row{
  position:relative;
  min-height:58px;
  display:grid;
  grid-template-columns:32px 40px minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  border:1px solid rgba(255,255,255,.075)!important;
  border-radius:13px;
  background:
    linear-gradient(90deg,rgba(255,255,255,.025) 0%,rgba(12,16,28,.82) 100%)!important;
  padding:8px 10px;
  transition:background .25s ease,border-color .25s ease,box-shadow .25s ease;
  overflow:hidden;
}
.global-row:hover{
  background:rgba(255,255,255,.065)!important;
  border-color:rgba(255,255,255,.16)!important;
}
.global-row.top-five{
  background:
    linear-gradient(90deg,rgba(176,0,34,.20) 0%,rgba(23,23,48,.58) 48%,rgba(31,124,255,.16) 100%),
    rgba(8,12,23,.82)!important;
  border-color:rgba(255,255,255,.16)!important;
}
.global-row.bump{
  background:
    linear-gradient(90deg,rgba(255,255,255,.045),rgba(40,124,255,.10))!important;
  border-color:rgba(255,255,255,.20)!important;
  box-shadow:0 0 38px rgba(40,124,255,.10)!important;
}
.rank-num{
  color:#ffd66b!important;
  font-size:15px;
  font-weight:950!important;
}
.fighter-avatar{
  width:40px;
  height:40px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(8,13,25,.72)!important;
  color:#fff;
  border:1px solid rgba(255,255,255,.14)!important;
  font-weight:900;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 26px rgba(0,0,0,.22)!important;
}
.fighter-avatar-image{
  overflow:hidden;
  color:transparent;
  background-image:
    linear-gradient(180deg,rgba(2,4,10,.05),rgba(2,4,10,.38)),
    var(--fighter-image);
  background-size:cover;
  background-position:center 20%;
  background-repeat:no-repeat;
}
.fighter-avatar-image .fighter-avatar-letter{opacity:0}
.fighter-meta{min-width:0}
.fighter-meta strong{
  display:block;
  font-size:14px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.fighter-meta small{display:none!important}
.fighter-votes{
  grid-column:4;
  color:#eaf2ff;
  font-weight:950;
  font-size:13px;
  font-variant-numeric:tabular-nums;
  justify-self:end;
}
.entity-battle-preview{display:none!important}
.ranking-link{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  margin:0 16px 16px;
  border:1px solid var(--line);
  border-radius:13px;
  color:#d5ddef;
  font-weight:850;
}
.ranking-link:hover{background:rgba(255,255,255,.06)}

.ranking-tabs,
.global-period-tabs,
.battle-period-tabs{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:12px!important;
  flex-wrap:wrap!important;
}
.ranking-rail .ranking-tabs{margin:0 16px 16px}
.ranking-tabs button,
.global-period-tabs button,
.battle-period-tabs button{
  appearance:none!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:
    radial-gradient(circle at 30% 0%,rgba(255,255,255,.10),transparent 42%),
    rgba(10,13,25,.82)!important;
  color:rgba(238,243,255,.78)!important;
  min-height:44px!important;
  padding:0 22px!important;
  border-radius:999px!important;
  font-size:13px!important;
  font-weight:900!important;
  letter-spacing:.01em!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 16px 36px rgba(0,0,0,.26)!important;
  cursor:pointer!important;
}
.ranking-tabs button:hover,
.global-period-tabs button:hover,
.battle-period-tabs button:hover{
  border-color:rgba(255,255,255,.24)!important;
  color:#fff!important;
}
.ranking-tabs button.active,
.global-period-tabs button.active,
.battle-period-tabs button.active{
  background:#fff!important;
  color:#05070d!important;
  border-color:#fff!important;
}
.hero-ranking .global-period-tabs button{
  min-height:38px!important;
  padding:0 16px!important;
  font-size:12px!important;
}

/* =========================================================
   SECTION TITLES
========================================================= */

.section-block{position:relative;z-index:8}
.section-heading{margin-bottom:20px}
.section-heading span{
  display:block;
  margin-bottom:8px;
  color:var(--blue2);
  font-size:12px;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.18em;
}
.section-heading h2{
  margin:0;
  color:#fff;
  font-size:clamp(34px,4.6vw,64px);
  line-height:.9;
  letter-spacing:-.075em;
}
.section-heading p{
  max-width:680px;
  margin:18px 0 0;
  color:#c3ccdc;
  font-size:18px;
  line-height:1.45;
}
.section-title-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin-bottom:22px;
}
.section-title-row h2,
.panel-card h2{
  margin:0;
  font-size:30px;
  letter-spacing:-.06em;
  line-height:1;
}
.section-note{
  color:var(--muted);
  max-width:500px;
  line-height:1.45;
  margin:0;
}
#explore .section-note{display:none!important}
#explore .section-title-row{margin-bottom:26px!important}

/* =========================================================
   SPOTLIGHT / MODAL BATTLE
========================================================= */

.featured-live-section{
  position:relative;
  z-index:8;
  margin-top:28px;
}
.featured-battle-card.featured-battle-pro{
  position:relative;
  display:block;
  width:100%;
  padding:clamp(38px,3.6vw,62px) 24px clamp(28px,3vw,46px)!important;
  min-height:clamp(520px,40vw,660px)!important;
  border-radius:34px;
  border:1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 50% 0%,rgba(255,255,255,.10),transparent 34%),
    linear-gradient(135deg,rgba(10,16,30,.98),rgba(3,6,16,.98));
  box-shadow:
    0 40px 120px rgba(0,0,0,.52),
    inset 0 1px 0 rgba(255,255,255,.08);
  overflow:hidden;
  isolation:isolate;
}
.featured-bg{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(90deg,rgba(2,4,10,.74) 0%,rgba(2,4,10,.24) 45%,rgba(2,4,10,.74) 100%),
    var(--featured-hero);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  opacity:.58;
  filter:saturate(1.08) contrast(1.08) brightness(1.04);
  z-index:-4;
}
.featured-battle-card.featured-battle-pro:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 18% 42%,rgba(38,122,255,.24),transparent 33%),
    radial-gradient(circle at 82% 42%,rgba(255,61,113,.20),transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,0));
  pointer-events:none;
  z-index:-3;
}
.featured-battle-card.featured-battle-pro:after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.9),transparent 85%);
  pointer-events:none;
  z-index:-2;
}
.featured-glow{
  position:absolute;
  width:360px;
  height:360px;
  border-radius:999px;
  filter:blur(58px);
  opacity:.26;
  z-index:-1;
  pointer-events:none;
}
.featured-glow-a{left:-110px;top:110px;background:rgba(39,128,255,.65)}
.featured-glow-b{right:-110px;top:110px;background:rgba(255,57,110,.58)}

.featured-battle-top,
.featured-battle-top-single{
  display:flex!important;
  height:58px!important;
  margin:0 0 22px!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
.top-battle-pill,
.top-battle-pill i,
.live-pill.top-battle-pill{
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
.live-pill{
  display:inline-flex;
  align-items:center;
  gap:9px;
  width:max-content;
  padding:9px 13px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(5,12,26,.64);
  color:rgba(235,242,255,.92);
  font-size:11px;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.18em;
}
.live-pill i{
  width:8px;
  height:8px;
  border-radius:50%;
  background:linear-gradient(135deg,#1f7cff,#b00022);
}
.battle-code{
  padding:9px 13px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.055);
  color:rgba(255,255,255,.70);
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.14em;
}

.featured-fight-grid{
  position:relative;
  z-index:4;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  width:100%;
  min-height:430px;
  gap:0;
  overflow:hidden;
  border-radius:30px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.035);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 26px 90px rgba(0,0,0,.32);
  margin-top:0!important;
}
button.featured-side,
.featured-side{
  appearance:none;
  -webkit-appearance:none;
  position:relative;
  width:100%;
  min-height:430px;
  padding:34px;
  border:0;
  border-radius:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  align-items:flex-start;
  text-align:left;
  color:#fff;
  background:rgba(255,255,255,.025);
  box-shadow:none;
  transition:filter .18s ease,opacity .18s ease;
  cursor:pointer!important;
}
.featured-side-a{
  grid-column:1;
  border-right:1px solid rgba(255,255,255,.10);
  padding-right:92px;
}
.featured-side-b{
  grid-column:2;
  padding-left:92px;
}
.featured-portrait-wrap{display:none}
.featured-side:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  opacity:.56;
  background-size:cover;
  background-repeat:no-repeat;
  filter:saturate(1.08) contrast(1.10) brightness(1.10);
  transition:.25s ease;
}
.featured-side-a:before{
  background-image:
    linear-gradient(180deg,rgba(2,4,10,.03) 0%,rgba(2,4,10,.18) 46%,rgba(2,4,10,.82) 100%),
    var(--side-a-image);
  background-position:center 22%;
}
.featured-side-b:before{
  background-image:
    linear-gradient(180deg,rgba(2,4,10,.03) 0%,rgba(2,4,10,.18) 46%,rgba(2,4,10,.82) 100%),
    var(--side-b-image);
  background-position:center 22%;
}
.featured-side:hover{
  filter:brightness(1.06) saturate(1.08)!important;
}
.featured-side:hover:before{
  opacity:.64;
  transform:scale(1.035);
}
.featured-side:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
}
.featured-side-a:after{
  background:
    linear-gradient(90deg,rgba(40,124,255,.34),rgba(2,4,10,.10) 58%),
    linear-gradient(180deg,rgba(2,4,10,.02) 0%,rgba(2,4,10,.76) 82%);
}
.featured-side-b:after{
  background:
    linear-gradient(270deg,rgba(255,36,77,.34),rgba(2,4,10,.10) 58%),
    linear-gradient(180deg,rgba(2,4,10,.02) 0%,rgba(2,4,10,.76) 82%);
}
.featured-side-copy{
  position:relative;
  z-index:3;
  width:100%;
  max-width:88%;
  margin:0;
}
.featured-side-b .featured-side-copy{
  text-align:right;
  margin-left:auto;
}
.featured-side-copy small{display:none!important}
.featured-side-copy strong{
  display:block;
  width:100%;
  color:#fff;
  font-size:clamp(46px,5.6vw,88px);
  line-height:.86;
  letter-spacing:-.085em;
  text-transform:uppercase;
  white-space:normal;
  word-break:normal;
  overflow-wrap:normal;
  text-shadow:0 24px 80px rgba(0,0,0,.92);
}
.featured-side-copy em{
  display:block;
  margin-top:14px;
  color:rgba(255,255,255,.78);
  font-style:normal;
  font-size:16px;
  font-weight:900;
}
.featured-side-cta{display:none!important}

.featured-vs{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  z-index:10;
  width:118px!important;
  min-height:118px!important;
  padding:16px 10px!important;
  border-radius:28px;
  pointer-events:none;
  border:1px solid rgba(255,255,255,.12);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px!important;
  background:radial-gradient(circle at 50% 0%,rgba(255,255,255,.16),transparent 46%),rgba(10,14,26,.86);
  backdrop-filter:blur(18px);
  box-shadow:0 24px 70px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.10);
}
.featured-vs span{
  color:#fff;
  font-size:42px!important;
  line-height:.85!important;
  margin:0!important;
  font-weight:1000;
  letter-spacing:-.08em;
}
.featured-vs small{
  color:rgba(255,255,255,.66);
  font-size:11px;
  line-height:1.25;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
  text-align:center;
}
.featured-pick-label{
  display:block!important;
  margin-top:4px!important;
  color:rgba(255,255,255,.68)!important;
  font-size:11px!important;
  line-height:1!important;
  font-weight:950!important;
  text-transform:uppercase!important;
  letter-spacing:.14em!important;
  text-align:center!important;
  white-space:nowrap!important;
}
.featured-total-hidden{display:none!important}

.featured-result{
  position:relative;
  z-index:5;
  margin-top:22px;
  display:grid;
  grid-template-columns:84px minmax(0,1fr) 84px;
  gap:14px;
  align-items:center;
  width:100%;
}
.featured-result>span{
  color:rgba(255,255,255,.82);
  font-size:22px;
  font-weight:1000;
}
.featured-result>span:last-child{
  color:#ff8ca0;
  text-align:right;
}
.result-track{
  position:relative;
  height:14px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.10);
}
.result-track i{
  position:absolute;
  top:0;
  bottom:0;
}
.result-track .result-a{
  left:0;
  background:linear-gradient(90deg,rgba(64,139,255,.98),rgba(127,188,255,.98));
  border-radius:999px 0 0 999px;
}
.result-track .result-b{
  right:0;
  background:linear-gradient(90deg,rgba(255,151,180,.98),rgba(255,61,113,.98));
  border-radius:0 999px 999px 0;
}

/* =========================================================
   EXPLORE LANES
========================================================= */

.battle-lanes{
  position:relative;
  z-index:8;
  margin-top:30px;
  border:1px solid var(--line2);
  border-radius:26px;
  background:rgba(8,12,22,.68);
  backdrop-filter:blur(22px);
  box-shadow:0 24px 90px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.055);
  padding:24px;
  overflow:hidden;
}
.lane-block{margin-top:18px}
.lane-block+.lane-block{margin-top:24px}
.lane-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:12px;
}
.lane-header strong{
  font-size:20px;
  letter-spacing:-.04em;
}
.lane-header span{
  color:var(--muted);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-weight:900;
}
.battle-lane-scroll{
  display:flex;
  gap:14px;
  overflow-x:auto;
  padding:2px 24px 12px 2px;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.battle-lane-scroll::-webkit-scrollbar{display:none}
.lane-card{
  appearance:none;
  -webkit-appearance:none;
  position:relative;
  flex:0 0 230px;
  height:172px;
  border:1px solid var(--line2);
  border-radius:18px;
  background:#071020;
  overflow:hidden;
  color:#fff;
  text-align:left;
  padding:16px;
  cursor:pointer;
  scroll-snap-align:start;
  box-shadow:0 20px 65px rgba(0,0,0,.26);
  transition:.2s ease;
}
.lane-card:hover{
  transform:translateY(-4px);
  border-color:rgba(255,255,255,.32);
  box-shadow:0 28px 80px rgba(0,0,0,.40);
}
.lane-card-bg{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(180deg,rgba(2,4,10,.05) 0%,rgba(2,4,10,.18) 42%,rgba(2,4,10,.86) 100%),
    var(--battle-image);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  opacity:1;
  filter:saturate(1.08) contrast(1.06) brightness(1.03);
  transition:transform .45s ease;
}
.lane-card:hover .lane-card-bg{transform:scale(1.06)}
.lane-card strong,
.lane-card small{
  position:absolute;
  left:16px;
  right:16px;
  z-index:4;
  text-shadow:0 16px 50px rgba(0,0,0,.9);
}
.lane-card strong{
  bottom:40px;
  font-size:22px;
  line-height:1.02;
  letter-spacing:-.05em;
}
.lane-card small{
  bottom:17px;
  color:#b8c7e4;
  font-weight:850;
}

/* =========================================================
   SUGGEST + HOW
========================================================= */

.dashboard-grid{
  position:relative;
  z-index:8;
  margin-top:24px;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:18px;
  align-items:stretch;
}
.panel-card{
  border:1px solid var(--line2);
  border-radius:22px;
  background:rgba(8,12,22,.78);
  box-shadow:0 24px 80px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.055);
  backdrop-filter:blur(24px);
  padding:22px;
  overflow:hidden;
  min-height:100%;
}
.compact{margin-bottom:16px}
.mini-battle-list{display:grid;gap:9px}
.mini-battle{
  appearance:none;
  -webkit-appearance:none;
  min-height:50px;
  width:100%;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:13px;
  padding:10px 12px;
  color:#e9eefb;
  background:rgba(255,255,255,.035);
  text-align:left;
}
.mini-battle:hover{
  border-color:rgba(255,255,255,.20);
  background:rgba(255,255,255,.065);
}
.mini-battle span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.mini-battle strong{
  font-variant-numeric:tabular-nums;
  color:#b8d5ff;
  white-space:nowrap;
}
.how-list{display:grid;gap:12px}
.how-list div{
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.035);
  border-radius:16px;
  padding:14px;
}
.how-list strong{
  display:block;
  margin-bottom:5px;
  color:#fff;
  font-size:15px;
}
.how-list span{
  color:var(--muted);
  line-height:1.42;
}
.suggestion-card p{
  color:var(--muted);
  line-height:1.45;
}
.suggest-form{display:grid;gap:12px}
.form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
input{
  width:100%;
  min-height:50px;
  border:1px solid var(--line2);
  border-radius:14px;
  background:#050812;
  color:#fff;
  padding:0 14px;
  outline:none;
  -webkit-appearance:none;
  appearance:none;
}
input:focus{
  border-color:rgba(40,124,255,.75);
  box-shadow:0 0 0 4px rgba(40,124,255,.10);
}
.suggest-form .btn{width:100%}
.success-box{
  border:1px solid rgba(69,255,149,.25);
  background:rgba(69,255,149,.08);
  color:#baffd3;
  border-radius:15px;
  padding:12px 14px;
  margin:14px 0;
}

.home-action-stack{
  position:relative;
  z-index:8;
  display:grid;
  gap:18px;
  margin-top:28px;
}
.suggest-wide-card,
.how-compact-card{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
  border-radius:26px;
  background:
    radial-gradient(circle at 12% 0%,rgba(40,124,255,.10),transparent 34%),
    radial-gradient(circle at 88% 10%,rgba(255,36,77,.10),transparent 36%),
    rgba(8,12,22,.76);
  box-shadow:
    0 24px 90px rgba(0,0,0,.32),
    inset 0 1px 0 rgba(255,255,255,.055);
  backdrop-filter:blur(24px);
  -webkit-backdrop-filter:blur(24px);
  padding:24px;
}
.suggest-wide-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:16px;
}
.suggest-wide-head h2,
.how-compact-head h2{
  margin:0;
  color:#fff;
  font-size:clamp(30px,3vw,44px);
  line-height:.95;
  letter-spacing:-.07em;
}
.suggest-wide-form{
  display:grid;
  grid-template-columns:minmax(0,1fr) 260px;
  gap:14px;
  align-items:center;
}
.suggest-wide-form input{
  min-height:58px;
  border-radius:18px;
  font-size:18px;
  background:rgba(3,6,15,.72);
}
.suggest-wide-form .btn{
  min-height:58px;
  border-radius:18px;
  white-space:nowrap;
}
.suggest-success-box{margin:0 0 14px!important}
.suggest-limit-box{
  margin:0 0 14px;
  border:1px solid rgba(228,189,102,.34);
  background:rgba(228,189,102,.10);
  color:#ffe3a2;
  border-radius:16px;
  padding:15px 17px;
  font-size:16px;
  line-height:1.35;
  font-weight:850;
}
.suggest-success-box,
.suggest-limit-box{
  transition:opacity .28s ease,transform .28s ease,max-height .28s ease,margin .28s ease,padding .28s ease;
}
.suggest-message-hide{
  opacity:0!important;
  transform:translateY(-6px)!important;
  max-height:0!important;
  margin:0!important;
  padding-top:0!important;
  padding-bottom:0!important;
  overflow:hidden!important;
}
.how-compact-head{margin-bottom:16px}
.how-compact-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.how-compact-grid div{
  min-height:118px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:18px;
  background:rgba(255,255,255,.035);
  padding:18px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045);
}
.how-compact-grid strong{
  display:block;
  margin-bottom:10px;
  color:#fff;
  font-size:17px;
  line-height:1.1;
  letter-spacing:-.035em;
}
.how-compact-grid span{
  display:block;
  color:rgba(210,219,238,.78);
  font-size:15px;
  line-height:1.38;
}

/* =========================================================
   FULL PANELS + TOP BATTLES
========================================================= */

.full-ranking-panel{
  position:relative;
  z-index:8;
  margin-top:30px;
  overflow:hidden;
  padding:34px;
  border-radius:34px;
  border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(circle at 50% 0%,rgba(255,255,255,.09),transparent 34%),
    linear-gradient(135deg,rgba(12,18,34,.96),rgba(3,6,16,.96));
  box-shadow:0 34px 110px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.07);
}
.full-ranking-panel:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 14% 20%,rgba(55,136,255,.14),transparent 34%),
    radial-gradient(circle at 86% 26%,rgba(255,61,113,.12),transparent 34%);
  pointer-events:none;
}
.full-ranking-panel>*{
  position:relative;
  z-index:1;
}
.full-global-list{
  margin-top:24px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  max-height:none;
  overflow:visible;
}
.full-global-list .global-row{
  min-height:72px;
  padding:12px 14px;
  border-radius:18px;
}
.full-global-list .global-row:hover{transform:translateY(-2px)}
.full-global-list .rank-num{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:rgba(255,255,255,.07);
  font-weight:1000;
}
.full-global-list .fighter-avatar{width:42px;height:42px}
.full-global-list .fighter-meta strong{font-size:15px;line-height:1.05}
.full-global-list .fighter-votes{font-size:14px;font-weight:1000}

.full-ranking-panel.top-battles-panel{
  overflow:visible!important;
  max-height:none!important;
  margin-bottom:0!important;
  padding-bottom:44px!important;
}
.top-battles-panel{
  background:
    linear-gradient(135deg,rgba(10,16,30,.96) 0%,rgba(8,12,22,.96) 52%,rgba(14,10,20,.96) 100%)!important;
  border:1px solid rgba(255,255,255,.08)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 24px 60px rgba(0,0,0,.28)!important;
}
.top-battles-panel .section-title-row{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:22px!important;
  margin-bottom:28px;
}
.top-battles-panel .section-title-row>div{
  display:flex;
  align-items:center;
}
.top-battles-panel .section-title-row h2{
  margin:0!important;
  line-height:1;
}
.top-battles-panel .section-note{display:none!important}
.top-battles-panel .battle-period-tabs{
  margin:0;
  padding:0;
  flex-shrink:0;
}

.battle-top-list{
  list-style:none;
  margin:0;
  padding:0;
}
.top-battles-panel .battle-top-list{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:14px!important;
  padding:0!important;
  scrollbar-width:none!important;
}
.top-battles-panel .battle-top-list::-webkit-scrollbar{display:none!important}
.top-battle-row{
  cursor:pointer;
}
.top-battles-panel .top-battle-row{
  min-height:74px!important;
  border-radius:18px!important;
  border:1px solid rgba(255,255,255,.085)!important;
  background:
    linear-gradient(90deg,rgba(15,22,38,.70) 0%,rgba(11,15,24,.84) 52%,rgba(17,14,24,.72) 100%)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 10px 24px rgba(0,0,0,.16)!important;
  transition:background .2s ease,border-color .2s ease,transform .2s ease;
}
.top-battles-panel .top-battle-row:nth-child(-n+10){
  border-color:rgba(255,255,255,.12)!important;
  background:
    linear-gradient(90deg,rgba(33,92,180,.22) 0%,rgba(22,25,44,.62) 48%,rgba(116,22,44,.18) 100%)!important;
}
.top-battles-panel .top-battle-row:hover{
  border-color:rgba(255,255,255,.16)!important;
  background:
    linear-gradient(90deg,rgba(26,46,78,.82) 0%,rgba(18,22,34,.88) 50%,rgba(40,20,32,.78) 100%)!important;
  transform:translateY(-1px)!important;
}
.top-battles-panel .battle-rank-avatar{
  width:48px!important;
  height:48px!important;
  border-color:rgba(255,255,255,.14)!important;
  background:rgba(8,13,25,.72)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 26px rgba(0,0,0,.22)!important;
}

/* =========================================================
   MODAL
========================================================= */

.battle-modal{
  position:fixed;
  inset:0;
  z-index:200;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.battle-modal.is-open{display:flex}
.battle-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(2,4,10,.72);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.battle-modal-card{
  position:relative;
  z-index:2;
  width:min(980px,100%);
  min-height:450px;
  border:1px solid rgba(255,255,255,.20);
  border-radius:30px;
  overflow:hidden;
  background:rgba(8,12,22,.92);
  box-shadow:0 40px 150px rgba(0,0,0,.72);
  animation:modalIn .22s ease both;
  max-height:calc(100vh - 36px);
  overflow:auto;
}
.modal-close{
  position:absolute;
  right:20px;
  top:20px;
  width:42px;
  height:42px;
  z-index:50;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.075);
  color:#fff;
  cursor:pointer;
  font-size:26px;
  line-height:1;
  backdrop-filter:blur(14px);
}
.modal-close:hover{
  background:rgba(255,255,255,.13);
  border-color:rgba(255,255,255,.30);
}
.modal-featured-clone{
  width:min(1500px,calc(100vw - 56px));
  max-height:calc(100vh - 56px);
  overflow:auto;
  padding:20px 24px 24px;
  border-radius:34px;
}
.battle-modal-card.featured-battle-pro.modal-featured-clone{
  padding-top:clamp(38px,3.6vw,62px)!important;
  padding-bottom:clamp(28px,3vw,46px)!important;
  min-height:clamp(520px,40vw,660px)!important;
}
.battle-modal-card .featured-battle-top.modal-hidden-spacer,
.battle-modal-card .modal-hidden-spacer{
  display:flex!important;
  height:58px!important;
  margin:0 0 22px!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
.modal-featured-clone .featured-fight-grid{
  min-height:430px;
  border-radius:30px;
  margin-top:0;
}
.modal-featured-clone .featured-side{min-height:430px}
.modal-featured-clone .featured-vs{
  width:124px;
  min-height:142px;
}
.modal-featured-clone .featured-vs span{font-size:40px}
.modal-featured-clone .featured-vs small{font-size:11px}
.modal-featured-clone .featured-result{margin-top:22px}
.modal-impact-footer{
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
  padding:12px 24px 20px;
  background:rgba(2,4,10,.58);
}
.modal-impact-footer:empty{display:none}

/* =========================================================
   VOTE UX + TOAST
========================================================= */

.toast{
  position:fixed!important;
  left:50%!important;
  bottom:34px!important;
  transform:translate(-50%,18px) scale(.96)!important;
  z-index:800!important;
  width:max-content!important;
  max-width:calc(100vw - 38px)!important;
  min-width:260px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:13px 22px!important;
  border-radius:999px!important;
  font-size:13px!important;
  line-height:1.2!important;
  font-weight:950!important;
  letter-spacing:-.01em!important;
  text-align:center!important;
  color:#f7f9ff!important;
  background:rgba(7,12,24,.88)!important;
  border:1px solid rgba(255,255,255,.14)!important;
  box-shadow:
    0 24px 80px rgba(0,0,0,.58),
    inset 0 1px 0 rgba(255,255,255,.08)!important;
  backdrop-filter:blur(22px)!important;
  -webkit-backdrop-filter:blur(22px)!important;
  opacity:0!important;
  pointer-events:none!important;
  transition:opacity .22s ease,transform .22s ease!important;
}
.toast.is-visible{
  opacity:1!important;
  transform:translate(-50%,0) scale(1)!important;
}
.toast.ok{
  border-color:rgba(69,255,149,.25)!important;
  color:#eafff3!important;
  background:
    radial-gradient(circle at 16% 50%,rgba(40,124,255,.18),transparent 34%),
    radial-gradient(circle at 84% 50%,rgba(69,255,149,.13),transparent 34%),
    rgba(7,12,24,.90)!important;
  box-shadow:
    0 24px 80px rgba(0,0,0,.58),
    0 0 38px rgba(69,255,149,.10),
    inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.toast.error{
  border-color:rgba(255,36,77,.34)!important;
  color:#ffd6de!important;
  background:
    radial-gradient(circle at 18% 50%,rgba(255,36,77,.16),transparent 34%),
    rgba(7,12,24,.92)!important;
  box-shadow:
    0 24px 80px rgba(0,0,0,.58),
    0 0 42px rgba(255,36,77,.13),
    inset 0 1px 0 rgba(255,255,255,.08)!important;
}
[data-vote-button]{
  transition:transform .18s ease,opacity .18s ease,filter .18s ease,box-shadow .18s ease;
}
[data-vote-button].is-voting{
  opacity:.72;
  cursor:wait;
  filter:saturate(.8);
}
[data-vote-button].vote-confirmed{
  transform:scale(.985);
  filter:saturate(1.18) brightness(1.08);
}
.vote-success{animation:voteSuccessPulse 1.05s ease both}
.vote-side-a{
  box-shadow:0 0 0 1px rgba(115,178,255,.34),0 0 68px rgba(40,124,255,.20)!important;
}
.vote-side-b{
  box-shadow:0 0 0 1px rgba(255,36,77,.34),0 0 68px rgba(255,36,77,.20)!important;
}
.vote-impact-message{
  display:flex;
  align-items:center;
  justify-content:center;
  width:max-content;
  max-width:100%;
  margin:0 auto 10px;
  border:1px solid rgba(69,255,149,.28);
  border-radius:999px;
  padding:8px 12px;
  background:rgba(69,255,149,.09);
  color:#baffd3;
  font-size:12px;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.06em;
  box-shadow:0 0 36px rgba(69,255,149,.10);
  animation:impactMessageIn .26s ease both;
}
.battle-summary-updated{
  border-color:rgba(69,255,149,.26)!important;
  box-shadow:
    0 0 0 1px rgba(69,255,149,.08),
    0 0 36px rgba(69,255,149,.10),
    0 24px 80px rgba(0,0,0,.34)!important;
  filter:brightness(1.08);
}

/* =========================================================
   BATTLE PAGE
========================================================= */

.battle-page-shell{
  width:min(1680px,calc(100% - 48px));
  padding-top:42px;
}
.battle-page-hero{margin-bottom:28px}
.back-link{
  display:inline-flex;
  align-items:center;
  width:max-content;
  min-height:42px;
  margin-bottom:22px;
  padding:0 15px;
  border-radius:999px;
  color:rgba(255,255,255,.76);
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.12);
  font-size:13px;
  font-weight:900;
  transition:.18s ease;
}
.back-link:hover{
  transform:translateY(-2px);
  background:rgba(255,255,255,.075);
  border-color:rgba(255,255,255,.22);
}
.battle-page-heading{max-width:1080px}
.battle-page-heading h1{
  margin:0;
  max-width:1120px;
  color:#fff;
  font-size:clamp(56px,8vw,128px);
  line-height:.84;
  letter-spacing:-.09em;
}
.battle-page-heading p{
  max-width:780px;
  margin:22px 0 0;
  color:#c8d1e3;
  font-size:20px;
  line-height:1.42;
}
.battle-page-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 390px;
  gap:26px;
  align-items:start;
}
.battle-page-pro{
  width:100%;
  max-width:100%;
  border-radius:34px;
}
.battle-page-pro .featured-fight-grid{min-height:500px}
.battle-page-pro .featured-side{
  min-height:500px;
  padding:38px;
}
.battle-page-pro .featured-side-copy strong{font-size:clamp(46px,5vw,84px)}
.battle-page-pro .featured-vs{
  width:136px;
  min-height:160px;
}
.battle-page-pro .featured-result{
  margin-top:24px;
  grid-template-columns:86px minmax(0,1fr) 86px;
}
.battle-page-pro .featured-result>span{font-size:24px}
.battle-page-ranking{
  position:sticky;
  top:104px;
  max-height:calc(100vh - 124px);
  overflow:auto;
  scrollbar-width:none!important;
}
.battle-page-ranking::-webkit-scrollbar{display:none!important}
.battle-page-message:empty{display:none}

/* =========================================================
   FOOTER
========================================================= */

.site-footer{
  display:grid;
  grid-template-columns:minmax(260px,1fr) minmax(420px,auto) minmax(260px,1fr);
  align-items:start;
  gap:28px;
  color:var(--muted);
  border-top:1px solid var(--line);
  padding:30px clamp(18px,4vw,68px);
  font-weight:800;
  background:rgba(2,4,10,.72);
  margin-top:36px;
}
.site-footer strong{
  color:#fff;
  display:block;
  margin-bottom:5px;
}
.site-footer span{display:block}
.site-footer p{
  margin:0;
  max-width:420px;
  text-align:right;
  line-height:1.45;
}
.footer-links{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px 22px;
  flex-wrap:wrap;
  max-width:520px;
  margin:0 auto;
}
.footer-links a{
  color:rgba(255,255,255,.70);
  font-weight:850;
  font-size:13px;
  white-space:nowrap;
}
.footer-links a:hover{color:#fff}

main.page-shell > .ad-slot-bottom,
.ad-slot.ad-slot-bottom,
.ad-slot-bottom{
  display:none!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
}
.site-footer,
.site-footer-v2{
  margin-top:0!important;
}

/* Legal pages already create their own spacing */
main.page-shell.legal-shell + .site-footer,
main.page-shell.legal-shell-clean + .site-footer,
main.page-shell.legal-shell + .site-footer-v2,
main.page-shell.legal-shell-clean + .site-footer-v2{
  margin-top:0!important;
}
.site-footer-v2{
  display:grid!important;
  grid-template-columns:minmax(360px,1fr) minmax(420px,auto) minmax(360px,1fr)!important;
  align-items:start!important;
  column-gap:48px!important;
  row-gap:0!important;
  padding:42px clamp(26px,5vw,82px)!important;
  border-top:1px solid rgba(255,255,255,.08)!important;
  background:
    radial-gradient(circle at 0% 0%,rgba(31,124,255,.08),transparent 28%),
    radial-gradient(circle at 100% 0%,rgba(176,0,34,.08),transparent 30%),
    rgba(3,5,10,.94)!important;
}
.footer-brand-block{
  display:grid!important;
  grid-template-rows:46px 28px!important;
  align-items:center!important;
  min-width:360px!important;
}
.footer-brand-link{
  align-self:center!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:12px!important;
  white-space:nowrap!important;
  text-decoration:none!important;
  flex-wrap:nowrap!important;
}
.footer-brand-mark{
  width:38px!important;
  height:38px!important;
  border-radius:12px!important;
  display:block!important;
  overflow:hidden!important;
  box-shadow:
    0 12px 28px rgba(31,124,255,.16),
    0 12px 28px rgba(176,0,34,.14)!important;
}
.footer-brand-mark img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
}
.footer-brand-name{
  color:#fff!important;
  font-size:22px!important;
  font-weight:950!important;
  letter-spacing:-.045em!important;
  line-height:1!important;
  white-space:nowrap!important;
}
.footer-brand-name span{
  color:#ff2b59!important;
  display:inline!important;
  white-space:nowrap!important;
}
.footer-brand-line{
  align-self:center!important;
  display:block!important;
  margin:0!important;
  color:rgba(224,231,246,.68)!important;
  font-size:16px!important;
  font-weight:800!important;
}
.footer-link-groups{
  display:grid!important;
  grid-template-rows:46px 28px!important;
  align-items:center!important;
  justify-items:center!important;
  gap:0!important;
  min-width:420px!important;
}
.footer-links{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:26px!important;
  flex-wrap:wrap!important;
  margin:0!important;
}
.footer-links a{
  font-size:15px!important;
  font-weight:900!important;
  text-decoration:none!important;
  white-space:nowrap!important;
}
.footer-legal-links a{color:rgba(232,238,250,.76)!important}
.footer-social-links a{color:rgba(255,255,255,.92)!important}
.footer-action-line{
  align-self:center!important;
  justify-self:end!important;
  margin:0!important;
  height:46px!important;
  display:flex!important;
  align-items:center!important;
  color:rgba(224,231,246,.72)!important;
  font-size:18px!important;
  font-weight:950!important;
  letter-spacing:-.025em!important;
  text-align:right!important;
  white-space:nowrap!important;
}

/* =========================================================
   ADS
========================================================= */

.ad-slot{display:none}
.ad-slot.has-ad,
.ad-slot.is-preview{display:block}
.ad-slot{
  position:relative;
  width:100%;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  border-radius:22px;
  background:rgba(255,255,255,.035);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 22px 70px rgba(0,0,0,.22);
}
.ad-slot:before{
  content:"Sponsored";
  position:absolute;
  left:14px;
  top:10px;
  z-index:2;
  color:rgba(255,255,255,.42);
  font-size:10px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.14em;
}
.ad-slot-inner{
  min-height:100%;
  display:grid;
  place-items:center;
  color:rgba(255,255,255,.36);
  font-size:12px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.ad-slot-top{min-height:96px;margin:18px 0 24px}
.ad-slot-mid{min-height:120px;margin:26px 0}
.ad-slot-bottom{min-height:110px;margin:28px 0 8px}
.ad-slot.has-ad .ad-slot-inner{display:none}

/* =========================================================
   LEGAL / PRIVACY / TERMS / COOKIES
========================================================= */

.legal-shell{
  padding-top:96px;
}
.legal-page{
  max-width:980px;
}
.legal-card,
.policy-card{
  border:1px solid rgba(255,255,255,.12);
  border-radius:28px;
  background:
    radial-gradient(circle at 20% 0%,rgba(40,124,255,.14),transparent 34%),
    radial-gradient(circle at 85% 10%,rgba(255,36,77,.12),transparent 36%),
    rgba(8,12,22,.78);
  box-shadow:0 34px 110px rgba(0,0,0,.42);
  padding:32px;
  max-width:1180px;
}
.legal-card h2,
.policy-card h2{
  margin:30px 0 10px;
  font-size:24px;
  line-height:1;
  letter-spacing:-.05em;
}
.legal-card h2:first-child,
.policy-card h2:first-child{margin-top:0}
.legal-card p,
.policy-card p{
  color:#c3ccdc;
  font-size:16px;
  line-height:1.62;
  margin:0 0 16px;
}
.legal-card strong,
.policy-card strong{color:#fff}

.legal-shell-clean{
  max-width:1280px!important;
  margin:0 auto!important;
  padding-top:clamp(82px,8vw,130px)!important;
  padding-bottom:64px!important;
  cursor:pointer!important;
}
.legal-page-clean{
  width:100%!important;
  max-width:1080px!important;
  margin:0 auto!important;
  cursor:auto!important;
}
.legal-page-clean .eyebrow{
  margin-bottom:18px!important;
  color:#6eb7ff!important;
  letter-spacing:.32em!important;
  font-weight:950!important;
}
.legal-page-clean h1{
  margin:0 0 32px!important;
  font-size:clamp(52px,7vw,96px)!important;
  line-height:.9!important;
  letter-spacing:-.075em!important;
}
.legal-card-clean{
  width:100%!important;
  max-width:1080px!important;
  margin-bottom:0!important;
  padding:clamp(28px,4vw,52px)!important;
  border-radius:28px!important;
  background:
    radial-gradient(circle at 0% 0%,rgba(31,124,255,.13),transparent 34%),
    radial-gradient(circle at 100% 0%,rgba(176,0,34,.13),transparent 38%),
    rgba(5,8,16,.94)!important;
  border:1px solid rgba(255,255,255,.10)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 28px 90px rgba(0,0,0,.32)!important;
  cursor:auto!important;
}
.legal-card-clean p{
  color:rgba(225,232,246,.78)!important;
  font-size:17px!important;
  line-height:1.7!important;
  max-width:920px!important;
}
.legal-card-clean h2{
  margin:34px 0 10px!important;
  color:#fff!important;
  font-size:24px!important;
  line-height:1.1!important;
  letter-spacing:-.045em!important;
}
.legal-card-clean strong{color:#fff!important}
.legal-card-clean ul{
  color:rgba(225,232,246,.78)!important;
  font-size:16px!important;
  line-height:1.65!important;
  margin:0 0 20px!important;
  padding-left:22px!important;
}
.legal-card-clean li{margin:6px 0!important}
.legal-close-link{display:none!important}
main.page-shell.legal-shell,
main.page-shell.legal-shell-clean{
  padding-bottom:64px!important;
}
main.page-shell.legal-shell + footer,
main.page-shell.legal-shell-clean + footer,
main.page-shell.legal-shell + .site-footer-v2,
main.page-shell.legal-shell-clean + .site-footer-v2{
  margin-top:0!important;
}

/* =========================================================
   ANIMATIONS
========================================================= */

@keyframes floatCard{0%,100%{translate:0 0}50%{translate:0 -13px}}
@keyframes modalIn{from{opacity:0;transform:translateY(18px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes voteSuccessPulse{0%{transform:scale(1)}42%{transform:scale(1.012)}100%{transform:scale(1)}}
@keyframes impactMessageIn{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (min-width:901px){
  .arena-hero{
    display:grid!important;
    grid-template-columns:minmax(0,.96fr) minmax(460px,1.04fr)!important;
    grid-template-areas:
      "copy main"
      "rising rising"
      "ranking ranking"!important;
    align-items:center!important;
    column-gap:clamp(34px,4.5vw,82px)!important;
    row-gap:24px!important;
    min-height:auto!important;
    padding:clamp(54px,5vw,78px) 0 30px!important;
    overflow:visible!important;
  }
  .hero-copy{
    grid-area:copy!important;
    padding-top:0!important;
    z-index:30!important;
  }
  .hero-battle-orbit{
    grid-area:main!important;
    position:relative!important;
    width:720px!important;
    max-width:100%!important;
    height:430px!important;
    margin:0 auto!important;
    padding-top:42px!important;
    z-index:22!important;
    perspective:1500px!important;
  }
  .hero-battle-orbit .orbit-main-label,
  .orbit-mode-label{
    top:0!important;
    left:50%!important;
    transform:translateX(-50%)!important;
    z-index:90!important;
  }
  .orbit-card-1{
    left:18px!important;
    top:176px!important;
    transform:rotate(-14deg) translateZ(-90px) scale(.82)!important;
    opacity:.68!important;
    z-index:2!important;
  }
  .orbit-card-2{
    left:138px!important;
    top:122px!important;
    transform:rotate(-7deg) translateZ(10px) scale(.96)!important;
    opacity:.88!important;
    z-index:4!important;
  }
  .orbit-card-3{
    left:270px!important;
    top:66px!important;
    transform:rotate(3deg) translateZ(120px) scale(1.16)!important;
    opacity:1!important;
    z-index:9!important;
  }
  .orbit-card-4{
    left:430px!important;
    top:122px!important;
    transform:rotate(8deg) translateZ(10px) scale(.96)!important;
    opacity:.88!important;
    z-index:4!important;
  }
  .orbit-card-5{
    left:552px!important;
    top:176px!important;
    transform:rotate(14deg) translateZ(-90px) scale(.82)!important;
    opacity:.68!important;
    z-index:2!important;
  }
  .hero-climbing-strip{
    grid-area:rising!important;
    margin:14px calc(50% - 50vw) 34px!important;
  }
  .hero-ranking{
    grid-area:ranking!important;
    margin-top:0!important;
  }
}

@media (min-width:901px) and (max-width:1440px){
  .arena-hero{
    grid-template-columns:minmax(0,.95fr) minmax(500px,1.05fr)!important;
    column-gap:34px!important;
    padding:46px 0 28px!important;
  }
  .hero-copy-clean{max-width:760px!important}
  .hero-title{
    max-width:760px!important;
    font-size:clamp(60px,5.55vw,82px)!important;
    line-height:.87!important;
    letter-spacing:-.09em!important;
  }
  .hero-subtitle-clean{
    max-width:620px!important;
    font-size:20px!important;
  }
  .hero-copy-clean:before{
    left:45%!important;
    top:43%!important;
    width:620px!important;
    height:620px!important;
    opacity:.095!important;
  }
  .hero-copy-clean:after{
    left:43%!important;
    top:43%!important;
    width:700px!important;
    height:470px!important;
  }
  .hero-battle-orbit{
    width:620px!important;
    height:400px!important;
    padding-top:38px!important;
  }
  .orbit-card{
    width:160px!important;
    height:200px!important;
    border-radius:23px!important;
  }
  .orbit-card-1{left:8px!important;top:166px!important}
  .orbit-card-2{left:112px!important;top:116px!important}
  .orbit-card-3{left:234px!important;top:64px!important}
  .orbit-card-4{left:366px!important;top:116px!important}
  .orbit-card-5{left:468px!important;top:166px!important}
  .featured-battle-card.featured-battle-pro,
  .battle-modal-card.featured-battle-pro.modal-featured-clone{
    min-height:540px!important;
    padding-top:46px!important;
  }
  .featured-battle-top,
  .featured-battle-top-single,
  .battle-modal-card .featured-battle-top.modal-hidden-spacer,
  .battle-modal-card .modal-hidden-spacer{
    height:54px!important;
    margin-bottom:20px!important;
  }
}

@media (max-width:1500px){
  .battle-page-layout{grid-template-columns:1fr}
  .battle-page-ranking{
    position:relative;
    top:auto;
    max-height:none;
  }
  .battle-page-pro .featured-fight-grid,
  .battle-page-pro .featured-side{min-height:500px}
  .battle-page-pro .featured-side-copy strong{font-size:clamp(46px,6vw,92px)}
}

@media (max-width:1440px){
  .site-header{grid-template-columns:270px minmax(0,1fr)}
  .social-nav{display:none}
}

@media (max-width:1180px){
  .site-header{
    grid-template-columns:250px minmax(0,1fr);
    padding-inline:24px;
  }
  .top-nav{
    justify-content:flex-end;
    gap:18px;
  }
  .battle-page-shell{padding-top:30px}
  .battle-page-heading h1{font-size:clamp(54px,11vw,104px)}
  .battle-page-pro .featured-side{min-height:380px}
  .full-global-list{grid-template-columns:1fr 1fr}
}

@media (max-width:1100px){
  .site-footer-v2{
    grid-template-columns:1fr!important;
    gap:26px!important;
    padding-top:34px!important;
    padding-bottom:34px!important;
  }
  .footer-brand-block,
  .footer-link-groups{
    grid-template-rows:auto auto!important;
    min-width:0!important;
    justify-items:start!important;
  }
  .footer-links{
    justify-content:flex-start!important;
    gap:18px!important;
  }
  .footer-action-line{
    justify-self:start!important;
    height:auto!important;
    white-space:normal!important;
    text-align:left!important;
  }
}

@media (max-width:900px){
  .site-header{
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
    min-height:auto;
    padding:16px 18px 12px;
  }
  .brand{justify-content:flex-start}
  .brand-mark{width:34px;height:34px}
  .brand-word{font-size:21px}
  .top-nav{
    display:flex;
    justify-content:flex-start;
    gap:10px;
    overflow-x:auto;
    padding:2px 0 4px;
    scrollbar-width:none;
  }
  .top-nav::-webkit-scrollbar{display:none}
  .top-nav a{
    flex:0 0 auto;
    border:1px solid rgba(255,255,255,.10);
    border-radius:999px;
    padding:9px 12px;
    background:rgba(255,255,255,.045);
    font-size:12px;
    opacity:1;
  }
  .top-nav a:after{display:none}
  .page-shell{
    width:min(100% - 28px,1680px);
    padding-top:16px;
  }
  .arena-hero{
    display:block!important;
    padding-top:18px!important;
  }
  h1{
    font-size:clamp(48px,13vw,72px);
    line-height:.88;
    letter-spacing:-.085em;
  }
  .hero-copy-clean{
    max-width:100%!important;
    padding-top:24px!important;
  }
  .hero-title{
    max-width:100%!important;
    font-size:clamp(48px,13vw,76px)!important;
    line-height:.88!important;
    letter-spacing:-.085em!important;
    margin-bottom:18px!important;
  }
  .hero-title-line{white-space:normal!important}
  .hero-subtitle-clean{
    max-width:100%!important;
    font-size:18px!important;
    line-height:1.42!important;
  }
  .hero-copy-clean:before{
    left:50%!important;
    top:45%!important;
    width:420px!important;
    height:420px!important;
    opacity:.085!important;
  }
  .hero-copy-clean:after{
    left:50%!important;
    top:45%!important;
    width:520px!important;
    height:380px!important;
  }
  .hero-subtitle{font-size:16px}
  .hero-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
  }
  .hero-actions .btn{
    width:100%;
    min-height:50px;
    padding:0 14px;
    font-size:12px;
  }
  .privacy-strip{display:flex;gap:8px}
  .privacy-strip span{font-size:11px}
  .hero-battle-orbit{
    width:100%;
    height:340px;
    display:block;
    margin:34px auto 0!important;
    perspective:1200px;
  }
  .orbit-mode-label{
    top:-10px;
    padding:8px 15px;
  }
  .orbit-mode-label strong{
    font-size:10px;
    letter-spacing:.18em;
  }
  .orbit-card,
  .orbit-card-1,
  .orbit-card-2,
  .orbit-card-3,
  .orbit-card-4,
  .orbit-card-5{
    display:block;
    position:absolute;
    width:clamp(126px,40vw,168px);
    height:auto;
    aspect-ratio:4/5;
    border-radius:24px;
    opacity:1;
    animation:none;
  }
  .orbit-card-hidden{display:none!important}
  .orbit-card-1{left:2%;top:132px;transform:rotate(-15deg) scale(.78);opacity:.42;z-index:1}
  .orbit-card-2{left:19%;top:84px;transform:rotate(-9deg) scale(.92);opacity:.72;z-index:3}
  .orbit-card-3{left:50%;top:34px;transform:translateX(-50%) rotate(0deg) scale(1.14);opacity:1;z-index:8}
  .orbit-card-4{right:19%;left:auto;top:84px;transform:rotate(9deg) scale(.92);opacity:.72;z-index:3}
  .orbit-card-5{right:2%;left:auto;top:132px;transform:rotate(15deg) scale(.78);opacity:.42;z-index:1}
  .hero-climbing-strip{
    width:100vw;
    margin:16px calc(50% - 50vw) 30px!important;
    padding:0 14px;
  }
  .hero-climbing-scroll{padding:4px 14px 14px}
  .climbing-card{
    flex:0 0 210px;
    height:90px;
  }
  .hero-ranking{margin-top:22px}
  .section-title-row{
    display:grid;
    align-items:start;
    gap:10px;
  }

  .featured-battle-card.featured-battle-pro,
  .battle-modal-card.featured-battle-pro.modal-featured-clone,
  .battle-page-pro{
    min-height:auto!important;
    padding:14px!important;
    border-radius:28px!important;
    overflow:hidden!important;
    background:
      radial-gradient(circle at 18% 10%,rgba(31,124,255,.16),transparent 36%),
      radial-gradient(circle at 88% 12%,rgba(176,0,34,.16),transparent 38%),
      rgba(4,7,14,.96)!important;
  }
  .featured-battle-top,
  .featured-battle-top-single,
  .battle-modal-card .featured-battle-top.modal-hidden-spacer,
  .battle-modal-card .modal-hidden-spacer{
    height:28px!important;
    margin-bottom:14px!important;
  }
  .featured-bg{
    opacity:.76!important;
    filter:saturate(1.12) contrast(1.08) brightness(.92)!important;
    background-position:center!important;
  }
  .featured-fight-grid,
  .modal-featured-clone .featured-fight-grid,
  .battle-page-pro .featured-fight-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    min-height:auto!important;
    border-radius:24px!important;
    overflow:hidden!important;
    background:rgba(3,6,14,.34)!important;
  }
  .featured-side,
  .modal-featured-clone .featured-side,
  .battle-page-pro .featured-side{
    min-height:clamp(330px,76vw,440px)!important;
    padding:26px 22px!important;
    justify-content:flex-end!important;
    border-right:0!important;
  }
  .featured-side-a{
    order:1!important;
    grid-column:1;
    border-bottom:1px solid rgba(255,255,255,.12)!important;
  }
  .featured-vs{order:2!important}
  .featured-side-b{
    order:3!important;
    grid-column:1;
  }
  .featured-side:before{
    opacity:.72!important;
    filter:saturate(1.08) contrast(1.08) brightness(.96)!important;
    transform:none!important;
    background-size:cover!important;
  }
  .featured-side-a:before{background-position:center 20%!important}
  .featured-side-b:before{background-position:center 22%!important}
  .featured-side-a:after{
    background:
      linear-gradient(180deg,rgba(2,4,10,.02) 0%,rgba(2,4,10,.18) 42%,rgba(2,4,10,.76) 100%),
      linear-gradient(90deg,rgba(31,124,255,.34),rgba(2,4,10,.04) 70%)!important;
  }
  .featured-side-b:after{
    background:
      linear-gradient(180deg,rgba(2,4,10,.02) 0%,rgba(2,4,10,.18) 42%,rgba(2,4,10,.76) 100%),
      linear-gradient(90deg,rgba(2,4,10,.04) 20%,rgba(176,0,34,.34) 100%)!important;
  }
  .featured-side-copy{
    max-width:100%!important;
    width:100%!important;
    margin:0!important;
    text-align:left!important;
  }
  .featured-side-b .featured-side-copy{
    text-align:left!important;
    margin-left:0!important;
  }
  .featured-side-copy strong{
    font-size:clamp(42px,12vw,64px)!important;
    line-height:.88!important;
    letter-spacing:-.08em!important;
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  .featured-side-copy em{
    margin-top:12px!important;
    font-size:15px!important;
  }
  .featured-vs{
    position:relative!important;
    left:auto!important;
    top:auto!important;
    transform:none!important;
    width:100%!important;
    min-height:86px!important;
    border-radius:0!important;
    gap:6px!important;
    background:
      radial-gradient(circle at 50% 0%,rgba(255,255,255,.12),transparent 48%),
      rgba(8,12,24,.92)!important;
    border-left:0!important;
    border-right:0!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.08),
      inset 0 -1px 0 rgba(255,255,255,.08)!important;
  }
  .featured-vs span{font-size:36px!important}
  .featured-pick-label{
    font-size:9px!important;
    letter-spacing:.16em!important;
  }
  .featured-result{
    margin-top:16px!important;
    grid-template-columns:64px minmax(0,1fr) 64px!important;
    gap:10px!important;
  }
  .featured-result>span{font-size:17px!important}
  .result-track{height:12px!important}

  .battle-lanes{
    padding:18px;
    border-radius:24px;
  }
  .lane-card{
    flex-basis:230px;
    height:166px;
  }
  .dashboard-grid{grid-template-columns:1fr}
  .suggest-wide-form{grid-template-columns:1fr}
  .suggest-wide-form .btn{width:100%}
  .how-compact-grid{grid-template-columns:1fr}
  .suggest-wide-card,
  .how-compact-card{
    padding:18px;
    border-radius:24px;
  }
  .full-ranking-panel{
    padding:24px;
    border-radius:24px;
  }
  .full-global-list{grid-template-columns:1fr}
  .top-battles-panel .section-title-row,
  .ranking-header-with-tabs{
    align-items:flex-start!important;
    flex-direction:column!important;
  }
  .ranking-tabs,
  .global-period-tabs,
  .battle-period-tabs{
    justify-content:flex-start!important;
    width:100%!important;
  }
  .ranking-tabs button,
  .global-period-tabs button,
  .battle-period-tabs button{
    min-height:40px!important;
    padding:0 15px!important;
    font-size:12px!important;
  }
  .top-battles-panel .battle-top-list{
    grid-template-columns:1fr!important;
  }
  .full-ranking-panel.top-battles-panel,
.top-battles-panel{
  margin-bottom:0!important;
  padding-bottom:34px!important;
}
  .battle-modal{
    padding:10px;
    align-items:flex-start;
    overflow:auto;
  }
  .modal-featured-clone{
    width:calc(100vw - 20px);
    max-height:calc(100vh - 20px);
    padding:14px;
    border-radius:26px;
  }
  .battle-page-shell{
    width:min(100% - 24px,1680px);
    padding-top:22px;
  }
  .battle-page-heading h1{
    font-size:clamp(42px,14vw,68px);
    line-height:.88;
  }
  .battle-page-heading p{
    margin-top:16px;
    font-size:16px;
  }
  .site-footer{
    grid-template-columns:1fr;
    gap:18px;
    text-align:left;
  }
  .footer-links{
    justify-content:flex-start;
    margin:0;
  }
  .site-footer p{
    text-align:left;
    max-width:100%;
  }
  .legal-shell-clean{
    padding-top:54px!important;
    padding-bottom:44px!important;
  }
  main.page-shell.legal-shell,
  main.page-shell.legal-shell-clean{
    padding-bottom:44px!important;
  }
  .legal-card-clean{
    border-radius:22px!important;
  }
  .legal-card-clean p{
    font-size:15px!important;
  }
}

@media (max-width:560px){
  .page-shell{width:min(100% - 24px,1680px)}
  .brand-word{font-size:20px}
  .brand-mark{width:32px;height:32px}
  h1{font-size:clamp(43px,15vw,58px)}
  .eyebrow{font-size:11px;letter-spacing:.20em}
  .hero-copy-clean{padding-top:18px!important}
  .hero-title{
    font-size:clamp(43px,13.5vw,60px)!important;
    line-height:.9!important;
  }
  .hero-subtitle-clean{font-size:16px!important}
  .hero-copy-clean:before{
    width:350px!important;
    height:350px!important;
    opacity:.075!important;
  }
  .hero-copy-clean:after{
    width:440px!important;
    height:330px!important;
  }
  .hero-actions{grid-template-columns:1fr}
  .hero-battle-orbit{height:315px}
  .orbit-card,
  .orbit-card-1,
  .orbit-card-2,
  .orbit-card-3,
  .orbit-card-4,
  .orbit-card-5{
    width:clamp(118px,39vw,154px);
  }
  .orbit-card-1{left:0;top:128px}
  .orbit-card-2{left:15%;top:82px}
  .orbit-card-3{top:34px}
  .orbit-card-4{right:15%;top:82px}
  .orbit-card-5{right:0;top:128px}
  .climbing-card{
    flex-basis:150px;
    height:84px;
  }
  .global-row{
    grid-template-columns:28px 34px minmax(0,1fr) auto;
    gap:8px;
  }
  .fighter-avatar{width:34px;height:34px}
  .fighter-meta strong{font-size:13px}
  .fighter-votes{font-size:12px}
  .lane-card{
    flex-basis:215px;
    height:162px;
  }
  .panel-card{padding:18px}
  .form-row{grid-template-columns:1fr}
  .full-ranking-panel{padding:18px}
  .full-global-list .global-row{
    grid-template-columns:34px 38px minmax(0,1fr) auto;
    gap:9px;
  }
  .top-battles-panel .section-title-row{
    display:grid;
    gap:16px;
  }
  .top-battles-panel .battle-period-tabs{justify-content:flex-start}
  .top-battles-panel .battle-period-tabs button{
    min-height:42px;
    padding:0 16px;
  }
  .toast{
    bottom:20px!important;
    width:calc(100vw - 28px)!important;
    min-width:0!important;
    border-radius:18px!important;
    padding:13px 16px!important;
    font-size:12px!important;
  }
  .vote-impact-message{
    width:100%;
    border-radius:14px;
    text-align:center;
    line-height:1.25;
  }
  .featured-battle-card.featured-battle-pro,
  .battle-modal-card.featured-battle-pro.modal-featured-clone,
  .battle-page-pro{
    padding:12px!important;
    border-radius:24px!important;
  }
  .featured-side,
  .modal-featured-clone .featured-side,
  .battle-page-pro .featured-side{
    min-height:clamp(310px,82vw,390px)!important;
    padding:24px 20px!important;
  }
  .featured-side-copy strong{
    font-size:clamp(38px,13vw,56px)!important;
  }
  .featured-vs{min-height:78px!important}
  .featured-result{
    grid-template-columns:58px minmax(0,1fr) 58px!important;
  }
  .featured-result>span{font-size:16px!important}
}

@media (max-width:390px){
  .page-shell{width:min(100% - 22px,1680px)}
  .brand-word{font-size:18px}
  .section-title-row h2,
  .panel-card h2{font-size:25px}
  .featured-side-copy strong{font-size:40px}
}

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

/* =========================================================
   FINAL OVERRIDE v169 — RISING MINI / EXPLORE HERO 2:1
========================================================= */

/* Rising Battles: mini hero 2:1 piccolo, pulito, non invadente */
.hero-climbing-strip{
  margin-top:16px!important;
  margin-bottom:34px!important;
}

.hero-climbing-scroll{
  gap:14px!important;
  padding:4px 24px 14px!important;
}

.climbing-card{
  flex:0 0 228px!important;
  width:228px!important;
  height:114px!important;
  border-radius:18px!important;
  overflow:hidden!important;
  border-color:rgba(255,255,255,.14)!important;
  box-shadow:0 16px 44px rgba(0,0,0,.28)!important;
}

.climbing-card-bg{
  opacity:.94!important;
  background-image:
    linear-gradient(180deg,rgba(2,4,10,.03) 0%,rgba(2,4,10,.18) 42%,rgba(2,4,10,.84) 100%),
    var(--battle-image)!important;
  background-size:cover!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
  filter:saturate(1.10) contrast(1.06) brightness(1.03)!important;
}

.climbing-card strong{
  position:absolute!important;
  left:14px!important;
  right:14px!important;
  bottom:31px!important;
  margin:0!important;
  font-size:17px!important;
  line-height:.98!important;
  letter-spacing:-.05em!important;
  text-shadow:0 14px 42px rgba(0,0,0,.95)!important;
}

.climbing-card small{
  position:absolute!important;
  left:14px!important;
  right:14px!important;
  bottom:12px!important;
  margin:0!important;
  font-size:11px!important;
  font-weight:900!important;
  color:rgba(232,240,255,.82)!important;
}


/* Explore: hero 2:1 più grande di Rising */
.battle-lane-scroll{
  gap:18px!important;
  padding:4px 28px 16px 2px!important;
}

.lane-card{
  flex:0 0 300px!important;
  width:300px!important;
  height:150px!important;
  border-radius:23px!important;
  padding:18px!important;
  overflow:hidden!important;
}

.lane-card-bg{
  background-image:
    linear-gradient(180deg,rgba(2,4,10,.04) 0%,rgba(2,4,10,.18) 42%,rgba(2,4,10,.86) 100%),
    var(--battle-image)!important;
  background-size:cover!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
  filter:saturate(1.08) contrast(1.06) brightness(1.02)!important;
}

.lane-card strong{
  left:19px!important;
  right:19px!important;
  bottom:39px!important;
  font-size:24px!important;
  line-height:.98!important;
  letter-spacing:-.06em!important;
}

.lane-card small{
  left:19px!important;
  right:19px!important;
  bottom:17px!important;
  font-size:13px!important;
}


/* Mobile: voto più compatto, risultati visibili */
@media (max-width:900px){

  .featured-battle-card.featured-battle-pro,
  .battle-modal-card.featured-battle-pro.modal-featured-clone,
  .battle-page-pro{
    padding:12px!important;
  }

  .featured-battle-top,
  .featured-battle-top-single,
  .battle-modal-card .featured-battle-top.modal-hidden-spacer,
  .battle-modal-card .modal-hidden-spacer{
    height:14px!important;
    margin-bottom:10px!important;
  }

  .featured-side,
  .modal-featured-clone .featured-side,
  .battle-page-pro .featured-side{
    min-height:260px!important;
    padding:22px 20px!important;
  }

  .featured-side-copy strong{
    font-size:clamp(34px,10.5vw,52px)!important;
    line-height:.90!important;
    letter-spacing:-.075em!important;
  }

  .featured-side-copy em{
    font-size:14px!important;
    margin-top:10px!important;
  }

  .featured-vs{
    min-height:72px!important;
  }

  .featured-vs span{
    font-size:34px!important;
  }

  .featured-result{
    margin-top:14px!important;
    grid-template-columns:62px minmax(0,1fr) 62px!important;
  }

  .featured-result>span{
    font-size:16px!important;
  }

  .result-track{
    height:12px!important;
  }


  /* Rising tablet/mobile: sempre mini 2:1 */
  .hero-climbing-scroll{
    gap:13px!important;
    padding:4px 16px 14px!important;
  }

  .climbing-card{
    flex:0 0 220px!important;
    width:220px!important;
    height:110px!important;
    border-radius:17px!important;
  }

  .climbing-card strong{
    left:13px!important;
    right:13px!important;
    bottom:30px!important;
    font-size:16px!important;
  }

  .climbing-card small{
    left:13px!important;
    right:13px!important;
    bottom:11px!important;
    font-size:11px!important;
  }


  /* Explore tablet/mobile: più grande di Rising */
  .lane-card{
    flex:0 0 270px!important;
    width:270px!important;
    height:135px!important;
    border-radius:22px!important;
  }

  .lane-card strong{
    left:17px!important;
    right:17px!important;
    bottom:36px!important;
    font-size:21px!important;
  }

  .lane-card small{
    left:17px!important;
    right:17px!important;
    bottom:15px!important;
    font-size:12px!important;
  }
}


@media (max-width:560px){

  .featured-side,
  .modal-featured-clone .featured-side,
  .battle-page-pro .featured-side{
    min-height:235px!important;
    padding:20px 18px!important;
  }

  .featured-side-copy strong{
    font-size:clamp(32px,10.8vw,48px)!important;
  }

  .featured-vs{
    min-height:66px!important;
  }

  .featured-result{
    grid-template-columns:56px minmax(0,1fr) 56px!important;
  }


  /* Rising mobile piccolo */
  .climbing-card{
    flex:0 0 205px!important;
    width:205px!important;
    height:102px!important;
    border-radius:16px!important;
  }

  .climbing-card strong{
    bottom:28px!important;
    font-size:15px!important;
  }

  .climbing-card small{
    bottom:10px!important;
    font-size:10px!important;
  }


  /* Explore mobile piccolo, sempre più grande di Rising */
  .lane-card{
    flex:0 0 245px!important;
    width:245px!important;
    height:122px!important;
  }

  .lane-card strong{
    bottom:33px!important;
    font-size:18px!important;
  }

  .lane-card small{
    bottom:13px!important;
    font-size:12px!important;
  }
}

/* =========================================================
   OPEN BATTLE CENTER FIX v173
   Centra meglio la battle aperta su cellulare/tablet.
========================================================= */

@media (max-width:900px){

  .battle-modal{
    padding:18px 10px!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:auto!important;
  }

  .battle-modal-card.featured-battle-pro.modal-featured-clone{
    width:calc(100vw - 20px)!important;
    max-height:calc(100dvh - 36px)!important;
    min-height:auto!important;
    margin:auto!important;
    padding:13px!important;
    border-radius:26px!important;
    overflow:auto!important;
  }

  .modal-featured-clone .featured-side{
    min-height:235px!important;
  }

  .modal-featured-clone .featured-vs{
    min-height:66px!important;
  }

  .modal-featured-clone .featured-result{
    margin-top:13px!important;
  }
}

@media (max-width:560px){

  .battle-modal{
    padding:14px 9px!important;
    align-items:center!important;
    justify-content:center!important;
  }

  .battle-modal-card.featured-battle-pro.modal-featured-clone{
    width:calc(100vw - 18px)!important;
    max-height:calc(100dvh - 28px)!important;
    padding:12px!important;
    border-radius:25px!important;
  }

  .modal-featured-clone .featured-side{
    min-height:225px!important;
  }

  .modal-featured-clone .featured-side-copy strong{
    font-size:clamp(32px,10.4vw,49px)!important;
  }

  .modal-featured-clone .featured-result{
    margin-top:12px!important;
  }
}

/* =========================================================
   MODAL AD SLOT v174
   Banner dentro battle aperta. Invisibile finché non ha is-preview / has-ad.
========================================================= */

.ad-slot-modal{
  width:100%!important;
  min-height:90px!important;
  margin:0 0 18px!important;
  border-radius:20px!important;
  background:
    radial-gradient(circle at 20% 0%,rgba(40,124,255,.10),transparent 36%),
    radial-gradient(circle at 80% 0%,rgba(255,36,77,.10),transparent 36%),
    rgba(255,255,255,.035)!important;
}

.ad-slot-modal:before{
  content:"Sponsored";
}

.battle-modal-card .ad-slot-modal{
  position:relative!important;
  z-index:20!important;
}


/* quando vuoi vedere il placeholder, aggiungi is-preview alla section */
.ad-slot-modal.is-preview{
  display:block!important;
}


/* mobile: banner più basso dentro modal */
@media (max-width:900px){
  .ad-slot-modal{
    min-height:64px!important;
    margin:0 0 12px!important;
    border-radius:16px!important;
  }
}

@media (max-width:560px){
  .ad-slot-modal{
    min-height:54px!important;
    margin:0 0 10px!important;
    border-radius:15px!important;
  }
}

/* =========================================================
   MODAL AD SLOT v175
   Banner dentro battle aperta, premium e sottile.
========================================================= */

.ad-slot-modal{
  width:100%!important;
  min-height:64px!important;
  margin:0 0 16px!important;
  border-radius:18px!important;
  background:
    radial-gradient(circle at 20% 0%,rgba(40,124,255,.08),transparent 36%),
    radial-gradient(circle at 80% 0%,rgba(255,36,77,.08),transparent 36%),
    rgba(255,255,255,.028)!important;
  border:1px solid rgba(255,255,255,.10)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 12px 34px rgba(0,0,0,.18)!important;
}

.battle-modal-card .ad-slot-modal{
  position:relative!important;
  z-index:20!important;
}

.ad-slot-modal:before{
  content:"Sponsored";
  left:18px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  font-size:10px!important;
  letter-spacing:.22em!important;
  color:rgba(255,255,255,.38)!important;
}

.ad-slot-modal .ad-slot-inner{
  min-height:64px!important;
  font-size:12px!important;
  letter-spacing:.20em!important;
  color:rgba(255,255,255,.32)!important;
}

.ad-slot-modal.is-preview{
  display:block!important;
}

@media (max-width:900px){
  .ad-slot-modal{
    min-height:48px!important;
    margin:0 0 10px!important;
    border-radius:15px!important;
  }

  .ad-slot-modal .ad-slot-inner{
    min-height:48px!important;
    font-size:10px!important;
  }

  .ad-slot-modal:before{
    left:14px!important;
    font-size:9px!important;
  }
}

@media (max-width:560px){
  .ad-slot-modal{
    min-height:44px!important;
    margin:0 0 9px!important;
    border-radius:14px!important;
  }

  .ad-slot-modal .ad-slot-inner{
    min-height:44px!important;
    font-size:9px!important;
  }
}

/* =========================================================
   MODAL CLOSE BUTTON v178
   X piccola con sfondo trasparente/glass.
========================================================= */

.modal-close{
  width:34px!important;
  height:34px!important;
  right:14px!important;
  top:14px!important;
  font-size:22px!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.06)!important;
  border:1px solid rgba(255,255,255,.26)!important;
  color:#fff!important;
  box-shadow:
    0 10px 26px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.12)!important;
  backdrop-filter:blur(10px)!important;
  -webkit-backdrop-filter:blur(10px)!important;
}

.modal-close:hover{
  background:rgba(255,255,255,.12)!important;
  border-color:rgba(255,255,255,.42)!important;
}

@media (max-width:560px){
  .modal-close{
    width:32px!important;
    height:32px!important;
    right:13px!important;
    top:13px!important;
    font-size:21px!important;
    background:rgba(255,255,255,.055)!important;
  }
}

.view-all-battles-link{
  display:flex;
  justify-content:center;
  margin-top:18px;
}

.view-all-battles-link a{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 18px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.045);
  color:#fff;
  font-size:13px;
  font-weight:900;
}

/* =========================================================
   TABLE AVATAR IMAGE FIX v179
   Global Top + Top Battles avatar images.
========================================================= */

.fighter-avatar.fighter-avatar-image{
  position:relative!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 35% 25%,rgba(255,255,255,.18),transparent 34%),
    rgba(255,255,255,.065)!important;
}

.fighter-avatar.fighter-avatar-image::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:1!important;
  background-image:var(--fighter-image)!important;
  background-size:cover!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
  opacity:1!important;
  filter:saturate(1.08) contrast(1.04)!important;
}

.fighter-avatar.fighter-avatar-image .fighter-avatar-letter{
  position:relative!important;
  z-index:2!important;
  opacity:0!important;
}

/* Se per caso in futuro usiamo <img>, funziona comunque */
.fighter-avatar.fighter-avatar-image img{
  position:absolute!important;
  inset:0!important;
  z-index:1!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
}

/* =========================================================
   MORE BATTLES BUTTON v185
========================================================= */

.more-battles-row{
  display:flex!important;
  justify-content:center!important;
  margin-top:18px!important;
}

.more-battles-btn{
  min-height:44px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 20px!important;
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.15)!important;
  background:rgba(255,255,255,.045)!important;
  color:#fff!important;
  font-size:13px!important;
  font-weight:950!important;
  cursor:pointer!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 14px 34px rgba(0,0,0,.20)!important;
}

.more-battles-btn:hover{
  background:rgba(255,255,255,.085)!important;
  border-color:rgba(255,255,255,.26)!important;
}

.more-battles-btn:disabled{
  opacity:.55!important;
  cursor:wait!important;
}

/* =========================================================
   MORE CARD INSIDE LANE v186
========================================================= */

.lane-more-card{
  min-width:210px!important;
  width:210px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  gap:8px!important;
  border-style:dashed!important;
  border-color:rgba(255,255,255,.18)!important;
  background:
    radial-gradient(circle at 50% 25%,rgba(90,150,255,.18),transparent 38%),
    radial-gradient(circle at 50% 95%,rgba(255,45,82,.10),transparent 42%),
    rgba(255,255,255,.035)!important;
}

.lane-more-card::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  background:
    linear-gradient(135deg,rgba(42,121,255,.12),transparent 45%,rgba(255,45,82,.10))!important;
  opacity:.9!important;
}

.lane-more-card .lane-card-bg{
  display:none!important;
}

.lane-more-orb{
  position:relative!important;
  z-index:2!important;
  width:46px!important;
  height:46px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin-bottom:4px!important;
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.18)!important;
  background:
    radial-gradient(circle at 35% 25%,rgba(255,255,255,.30),transparent 35%),
    rgba(255,255,255,.075)!important;
  color:#fff!important;
  font-size:30px!important;
  font-weight:800!important;
  line-height:1!important;
  box-shadow:
    0 14px 40px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.10)!important;
}

.lane-more-card strong{
  position:relative!important;
  z-index:2!important;
  font-size:24px!important;
  line-height:1!important;
  letter-spacing:-.055em!important;
}

.lane-more-card small{
  position:relative!important;
  z-index:2!important;
  margin-top:0!important;
  font-size:11px!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
  color:rgba(225,235,255,.62)!important;
}

.lane-more-card:hover{
  border-color:rgba(255,255,255,.32)!important;
  background:
    radial-gradient(circle at 50% 25%,rgba(90,150,255,.25),transparent 38%),
    radial-gradient(circle at 50% 95%,rgba(255,45,82,.16),transparent 42%),
    rgba(255,255,255,.055)!important;
}

.lane-more-card.is-loading{
  opacity:.62!important;
  cursor:wait!important;
}

.lane-more-card.is-loading .lane-more-orb{
  animation:moreCardPulse 1s ease-in-out infinite!important;
}

@keyframes moreCardPulse{
  0%,100%{
    transform:scale(1);
    opacity:.72;
  }
  50%{
    transform:scale(1.08);
    opacity:1;
  }
}

/* =========================================================
   LATEST MORE ARROW v187
========================================================= */

.lane-more-card{
  display:none!important;
}

.lane-more-arrow-btn{
  appearance:none!important;
  -webkit-appearance:none!important;
  min-width:86px!important;
  width:86px!important;
  height:150px!important;
  flex:0 0 86px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:0!important;
  background:transparent!important;
  cursor:pointer!important;
  opacity:.9!important;
}

.lane-more-arrow-btn span{
  width:58px!important;
  height:58px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.18)!important;
  background:
    radial-gradient(circle at 35% 25%,rgba(255,255,255,.24),transparent 34%),
    linear-gradient(135deg,rgba(42,121,255,.16),rgba(255,45,82,.13)),
    rgba(255,255,255,.055)!important;
  color:#fff!important;
  font-size:32px!important;
  font-weight:900!important;
  line-height:1!important;
  box-shadow:
    0 18px 48px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.09)!important;
  transition:transform .18s ease,border-color .18s ease,background .18s ease!important;
}

.lane-more-arrow-btn:hover span{
  transform:translateX(3px) scale(1.04)!important;
  border-color:rgba(255,255,255,.32)!important;
  background:
    radial-gradient(circle at 35% 25%,rgba(255,255,255,.30),transparent 34%),
    linear-gradient(135deg,rgba(42,121,255,.24),rgba(255,45,82,.18)),
    rgba(255,255,255,.075)!important;
}

.lane-more-arrow-btn.is-loading span{
  animation:latestMoreArrowPulse .8s ease-in-out infinite!important;
  cursor:wait!important;
}

.lane-more-arrow-btn.is-error span{
  animation:latestMoreArrowError .24s ease-in-out 3!important;
  border-color:rgba(255,80,100,.45)!important;
}

.lane-more-arrow-btn:disabled{
  opacity:.62!important;
  cursor:wait!important;
}

@keyframes latestMoreArrowPulse{
  0%,100%{
    transform:translateX(0) scale(1);
    opacity:.72;
  }

  50%{
    transform:translateX(5px) scale(1.06);
    opacity:1;
  }
}

@keyframes latestMoreArrowError{
  0%,100%{
    transform:translateX(0);
  }

  25%{
    transform:translateX(-4px);
  }

  75%{
    transform:translateX(4px);
  }
}

/* =========================================================
   BATTLE PAGE CLEAN PREMIUM v188
========================================================= */

.battle-page-shell{
    padding-top:34px!important;
}

.battle-page-hero{
    display:none!important;
}

.battle-clean-back{
    position:fixed!important;
    inset:0!important;
    z-index:0!important;
    display:block!important;
    cursor:pointer!important;
}

.battle-page-layout{
    position:relative!important;
    z-index:2!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:28px!important;
    width:min(1480px,96vw)!important;
    margin:0 auto!important;
}

.battle-clean-title{
    position:relative!important;
    z-index:3!important;
    display:grid!important;
    gap:7px!important;
    padding:0 4px!important;
    pointer-events:none!important;
}

.battle-clean-title span{
    color:#7db6ff!important;
    font-size:12px!important;
    font-weight:950!important;
    letter-spacing:.32em!important;
    text-transform:uppercase!important;
}

.battle-clean-title h1{
    margin:0!important;
    color:#fff!important;
    font-size:clamp(40px,7vw,92px)!important;
    line-height:.9!important;
    letter-spacing:-.085em!important;
    font-weight:1000!important;
}

.battle-page-pro{
    position:relative!important;
    z-index:4!important;
    width:100%!important;
    min-height:520px!important;
}

.battle-page-ranking{
    position:relative!important;
    z-index:4!important;
    width:100%!important;
    max-width:none!important;
}

.battle-page-ranking .global-list{
    max-height:none!important;
}

@media(max-width:900px){
    .battle-page-shell{
        padding-top:20px!important;
    }

    .battle-page-layout{
        width:min(100% - 24px,1480px)!important;
        gap:18px!important;
    }

    .battle-clean-title h1{
        font-size:clamp(36px,12vw,64px)!important;
    }

    .battle-page-pro{
        min-height:430px!important;
    }
}

/* =========================================================
   BATTLE PAGE CLEAN PREMIUM v189
========================================================= */

.battle-page-shell{
    padding-top:34px!important;
}

.battle-page-hero,
.battle-clean-title{
    display:none!important;
}

.battle-clean-back{
    position:fixed!important;
    inset:0!important;
    z-index:0!important;
    display:block!important;
    cursor:pointer!important;
}

.battle-page-layout{
    position:relative!important;
    z-index:2!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:28px!important;
    width:min(1480px,96vw)!important;
    margin:0 auto!important;
}

.battle-page-pro{
    position:relative!important;
    z-index:4!important;
    width:100%!important;
    min-height:520px!important;
}

.battle-page-close{
    position:absolute!important;
    top:16px!important;
    right:16px!important;
    z-index:80!important;
    width:34px!important;
    height:34px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:999px!important;
    border:1px solid rgba(255,255,255,.18)!important;
    background:rgba(255,255,255,.08)!important;
    color:#fff!important;
    font-size:22px!important;
    font-weight:400!important;
    line-height:1!important;
    text-decoration:none!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
    box-shadow:none!important;
}

.battle-page-close:hover{
    background:rgba(255,255,255,.13)!important;
    border-color:rgba(255,255,255,.28)!important;
    text-decoration:none!important;
}

.battle-page-ranking{
    position:relative!important;
    z-index:4!important;
    width:100%!important;
    max-width:none!important;
}

.battle-page-ranking .global-list{
    max-height:none!important;
}

@media(max-width:900px){
    .battle-page-shell{
        padding-top:20px!important;
    }

    .battle-page-layout{
        width:min(100% - 24px,1480px)!important;
        gap:18px!important;
    }

    .battle-page-pro{
        min-height:430px!important;
    }

    .battle-page-close{
    top:14px!important;
    right:14px!important;
    width:34px!important;
    height:34px!important;
    font-size:22px!important;
}
}

/* =========================================================
   SPECIAL BATTLES v190
   Timed battles integrated into the normal arena.
========================================================= */

#specials{
  scroll-margin-top:108px;
}

/* ---------------------------------------------------------
   UNIVERSAL SPECIAL TIME
--------------------------------------------------------- */

.special-time{
  position:relative;
  z-index:12;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:max-content;
  max-width:100%;
  min-height:30px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:
    radial-gradient(circle at 30% 0%,rgba(255,255,255,.13),transparent 46%),
    rgba(5,9,18,.78);
  color:#fff;
  font-size:11px;
  line-height:1;
  font-weight:950;
  letter-spacing:.13em;
  text-transform:uppercase;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
  box-shadow:
    0 14px 34px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

[data-special-display="countdown"]{
  border-color:rgba(255,88,67,.34);
  background:
    radial-gradient(circle at 24% 0%,rgba(255,255,255,.14),transparent 45%),
    linear-gradient(135deg,rgba(255,36,77,.20),rgba(255,90,54,.12)),
    rgba(7,10,18,.86);
  color:#fff4f2;
  box-shadow:
    0 14px 38px rgba(0,0,0,.32),
    0 0 28px rgba(255,54,69,.10),
    inset 0 1px 0 rgba(255,255,255,.09);
}

[data-special-display="date"]{
  color:rgba(238,243,255,.84);
}

/* ---------------------------------------------------------
   MAIN BATTLES — SMALL TIMER OVER IMAGE
--------------------------------------------------------- */

.orbit-card .special-time-orbit{
  position:absolute!important;
  top:11px!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  z-index:20!important;
  display:inline-flex!important;
  min-height:26px!important;
  padding:0 9px!important;
  font-size:9px!important;
  letter-spacing:.10em!important;
  pointer-events:none!important;
}

.orbit-card.special-is-open{
  border-color:rgba(255,88,67,.28);
}

.orbit-card.special-is-open:before{
  opacity:.40;
}

/* ---------------------------------------------------------
   RISING — COMPACT TIMER
--------------------------------------------------------- */

.climbing-card .special-time-rising{
  position:absolute!important;
  top:9px!important;
  right:9px!important;
  z-index:12!important;
  min-height:24px!important;
  padding:0 8px!important;
  font-size:8px!important;
  letter-spacing:.09em!important;
  pointer-events:none!important;
}

.climbing-card.special-is-open{
  border-color:rgba(255,88,67,.26)!important;
}

/* ---------------------------------------------------------
   SPOTLIGHT + MODAL
   Old CSS hides the top spacer, so these overrides restore it
   only when it contains a Special countdown/date.
--------------------------------------------------------- */

.featured-battle-card[data-battle-kind="special"]
.featured-battle-top,
.featured-battle-card[data-battle-kind="special"]
.featured-battle-top-single{
  position:relative!important;
  z-index:30!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  height:58px!important;
  min-height:58px!important;
  margin:0 0 22px!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:none!important;
}

.battle-modal-card[data-battle-kind="special"]
.featured-battle-top.modal-hidden-spacer,
.battle-modal-card[data-battle-kind="special"]
.modal-hidden-spacer{
  position:relative!important;
  z-index:30!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  height:58px!important;
  min-height:58px!important;
  margin:0 0 22px!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:none!important;
}

.special-time-featured,
.special-time-modal{
  min-height:38px;
  padding:0 18px;
  font-size:12px;
  letter-spacing:.16em;
}

.featured-battle-card[data-battle-kind="special"].special-is-expired
.featured-side,
.featured-battle-card[data-battle-kind="special"].special-is-upcoming
.featured-side{
  cursor:not-allowed!important;
}

/* ---------------------------------------------------------
   SPECIALS SECTION
--------------------------------------------------------- */

.specials-section{
  position:relative;
  z-index:8;
  margin-top:30px;
  padding:24px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  border-radius:26px;
  background:
    radial-gradient(circle at 10% 0%,rgba(40,124,255,.10),transparent 34%),
    radial-gradient(circle at 90% 0%,rgba(255,36,77,.13),transparent 36%),
    rgba(8,12,22,.72);
  box-shadow:
    0 24px 90px rgba(0,0,0,.32),
    inset 0 1px 0 rgba(255,255,255,.055);
  backdrop-filter:blur(22px);
  -webkit-backdrop-filter:blur(22px);
}

.specials-section .section-title-row{
  margin-bottom:18px;
}

.specials-section .section-title-row h2{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:11px;
}

.specials-lane-scroll{
  display:flex;
  gap:18px;
  width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  padding:4px 28px 16px 2px;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}

.specials-lane-scroll::-webkit-scrollbar{
  display:none;
}

.special-card{
  appearance:none;
  -webkit-appearance:none;
  position:relative;
  flex:0 0 300px;
  width:300px;
  height:150px;
  padding:18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.16);
  border-radius:23px;
  background:#071020;
  color:#fff;
  text-align:left;
  scroll-snap-align:start;
  box-shadow:
    0 20px 65px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.045);
  transition:
    transform .20s ease,
    border-color .20s ease,
    box-shadow .20s ease,
    filter .20s ease;
}

.special-card:hover{
  transform:translateY(-4px);
  border-color:rgba(255,255,255,.32);
  box-shadow:
    0 30px 86px rgba(0,0,0,.42),
    0 0 40px rgba(255,36,77,.08);
}

.special-card-bg{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(
      180deg,
      rgba(2,4,10,.04) 0%,
      rgba(2,4,10,.17) 40%,
      rgba(2,4,10,.88) 100%
    ),
    var(--battle-image);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  opacity:1;
  filter:saturate(1.08) contrast(1.07) brightness(1.02);
  transition:transform .45s ease,filter .25s ease;
}

.special-card:hover .special-card-bg{
  transform:scale(1.055);
}

.special-card:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  border-radius:inherit;
  background:
    radial-gradient(circle at 5% 5%,rgba(40,124,255,.15),transparent 34%),
    radial-gradient(circle at 95% 5%,rgba(255,36,77,.16),transparent 36%);
  opacity:.74;
}

.special-card .special-time-card{
  position:absolute;
  top:13px;
  right:13px;
  z-index:5;
  min-height:28px;
  padding:0 10px;
  font-size:9px;
  letter-spacing:.11em;
}

.special-card-copy{
  position:absolute;
  left:18px;
  right:18px;
  bottom:16px;
  z-index:5;
  display:grid;
  gap:7px;
  text-shadow:0 14px 44px rgba(0,0,0,.94);
}

.special-card-copy strong{
  display:block;
  color:#fff;
  font-size:24px;
  line-height:.98;
  font-weight:950;
  letter-spacing:-.06em;
}

.special-card-copy small{
  color:rgba(225,235,252,.78);
  font-size:12px;
  font-weight:900;
}

/* Open = active timed battle */
.special-card-open,
.special-card.special-is-open{
  border-color:rgba(255,89,67,.28);
}

/* Upcoming remains readable but visually calmer */
.special-card-upcoming,
.special-card.special-is-upcoming{
  border-color:rgba(115,178,255,.18);
}

.special-card-upcoming .special-card-bg,
.special-card.special-is-upcoming .special-card-bg{
  filter:saturate(.92) contrast(1.04) brightness(.91);
}

/* Expired remains in archive without looking broken */
.special-card-expired,
.special-card.special-is-expired{
  border-color:rgba(255,255,255,.09);
  box-shadow:
    0 16px 48px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.035);
}

.special-card-expired .special-card-bg,
.special-card.special-is-expired .special-card-bg{
  filter:saturate(.62) contrast(1.02) brightness(.72);
}

.special-card-expired:after,
.special-card.special-is-expired:after{
  background:linear-gradient(180deg,rgba(2,4,10,.12),rgba(2,4,10,.40));
  opacity:.72;
}

/* ---------------------------------------------------------
   TOP BATTLES
   Existing CSS hides every fighter-meta small.
--------------------------------------------------------- */

.top-battle-row[data-battle-kind="special"]
.fighter-meta small.special-time-ranking{
  display:inline-flex!important;
  min-height:21px!important;
  margin-top:5px!important;
  padding:0 7px!important;
  font-size:8px!important;
  letter-spacing:.08em!important;
  color:rgba(235,241,252,.74)!important;
}

.top-battle-row[data-battle-kind="special"]{
  border-color:rgba(255,88,67,.16)!important;
}

/* ---------------------------------------------------------
   LOCKED SPECIAL VOTE BUTTONS
--------------------------------------------------------- */

[data-vote-button].is-special-locked{
  cursor:not-allowed!important;
  opacity:.66!important;
  filter:saturate(.68) brightness(.82)!important;
}

[data-vote-button].is-locked-by-browser{
  filter:saturate(.78);
}

/* ---------------------------------------------------------
   RESPONSIVE
--------------------------------------------------------- */

@media (max-width:900px){

  .specials-section{
    margin-top:24px;
    padding:18px;
    border-radius:24px;
  }

  .specials-lane-scroll{
    gap:14px;
    padding:4px 18px 14px 2px;
  }

  .special-card{
  flex:0 0 270px;
  width:270px;
  height:135px;
  border-radius:22px;
}

  .special-card-copy strong{
    font-size:21px;
  }

  .special-card .special-time-card{
    top:11px;
    right:11px;
  }

  .featured-battle-card[data-battle-kind="special"]
  .featured-battle-top,
  .featured-battle-card[data-battle-kind="special"]
  .featured-battle-top-single,
  .battle-modal-card[data-battle-kind="special"]
  .featured-battle-top.modal-hidden-spacer,
  .battle-modal-card[data-battle-kind="special"]
  .modal-hidden-spacer{
    height:38px!important;
    min-height:38px!important;
    margin-bottom:10px!important;
  }

  .special-time-featured,
  .special-time-modal{
    min-height:32px;
    padding:0 13px;
    font-size:10px;
  }

  .orbit-card .special-time-orbit{
    top:8px!important;
    min-height:23px!important;
    padding:0 7px!important;
    font-size:8px!important;
  }
}

@media (max-width:560px){

  .specials-section{
    padding:16px;
  }

  .specials-section .section-title-row h2{
    font-size:27px;
  }

  .special-card{
  flex:0 0 245px;
  width:245px;
  height:122px;
  padding:15px;
  border-radius:19px;
}

  .special-card-copy{
    left:15px;
    right:15px;
    bottom:13px;
  }

  .special-card-copy strong{
    font-size:18px;
  }

  .special-card-copy small{
    font-size:11px;
  }

  .special-card .special-time-card{
    min-height:24px;
    padding:0 8px;
    font-size:8px;
  }

  .climbing-card .special-time-rising{
    top:7px!important;
    right:7px!important;
    min-height:21px!important;
    font-size:7px!important;
  }

  .special-time-featured,
  .special-time-modal{
    min-height:29px;
    padding:0 11px;
    font-size:9px;
    letter-spacing:.11em;
  }
}

/* =========================================================
   BATTLE RESULT SPACING FIX v192
   Evita che 100.00% tocchi o invada la barra.
========================================================= */

.featured-result{
  grid-template-columns:
    minmax(102px,auto)
    minmax(0,1fr)
    minmax(102px,auto)!important;
  gap:18px!important;
}

.featured-result > span{
  display:block!important;
  min-width:102px!important;
  line-height:1!important;
  white-space:nowrap!important;
  font-variant-numeric:tabular-nums!important;
}

.featured-result > span:first-child{
  text-align:left!important;
}

.featured-result > span:last-child{
  text-align:right!important;
}

.result-track{
  width:100%!important;
  min-width:0!important;
}

/* Battle aperta: un poco più di respiro */
.battle-page-pro .featured-result{
  grid-template-columns:
    minmax(108px,auto)
    minmax(0,1fr)
    minmax(108px,auto)!important;
  gap:20px!important;
}

/* Tablet */
@media (max-width:900px){
  .featured-result,
  .battle-page-pro .featured-result{
    grid-template-columns:
      minmax(70px,auto)
      minmax(0,1fr)
      minmax(70px,auto)!important;
    gap:12px!important;
  }

  .featured-result > span{
    min-width:70px!important;
  }
}

/* Smartphone */
@media (max-width:560px){
  .featured-result,
  .battle-page-pro .featured-result{
    grid-template-columns:
      minmax(62px,auto)
      minmax(0,1fr)
      minmax(62px,auto)!important;
    gap:9px!important;
  }

  .featured-result > span{
    min-width:62px!important;
    font-size:15px!important;
  }
}

/* =========================================================
   GLOBAL TOP MOVEMENT FIX v193
   Stessa animazione fluida di Top Battles.
========================================================= */

[data-global-top-list] .global-row{
  transition:
    background .20s ease,
    border-color .20s ease,
    box-shadow .20s ease,
    transform .20s ease!important;
  will-change:transform;
}