/* V125.46 · Ranking visual premium estático.
   Solo apariencia. No agrega datos, botones, funciones, animaciones ni contenido. */
#rankingHub{
  --ranking-gold:#e8b64a;
  --ranking-silver:#aeb8c8;
  --ranking-bronze:#bd7d5c;
  --ranking-surface:color-mix(in srgb,var(--card) 97%,var(--primario) 3%);
  --ranking-stroke:color-mix(in srgb,var(--primario) 14%,var(--borde));
}

#rankingHub .ranking-perfil-compacto{
  width:min(100%,720px)!important;
  padding:10px 0 28px!important;
}

/* TU POSICIÓN: mismo contenido, más sobrio y premium. */
#rankingHub .ranking-resumen.ranking-resumen-referencia{
  isolation:isolate!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.20)!important;
  border-radius:28px!important;
  background:
    radial-gradient(circle at 79% 16%,rgba(255,255,255,.24),transparent 27%),
    radial-gradient(circle at 12% 100%,rgba(0,0,0,.13),transparent 42%),
    linear-gradient(135deg,color-mix(in srgb,var(--primario) 91%,#0b3038),color-mix(in srgb,var(--primario2,var(--primario)) 84%,#041c21))!important;
  box-shadow:
    0 22px 44px color-mix(in srgb,var(--primario) 20%,transparent),
    0 4px 12px rgba(8,24,31,.09),
    inset 0 1px 0 rgba(255,255,255,.22)!important;
}
#rankingHub .ranking-resumen.ranking-resumen-referencia::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:1px!important;
  z-index:1!important;
  pointer-events:none!important;
  border-radius:27px!important;
  background:
    linear-gradient(115deg,rgba(255,255,255,.105),transparent 26%,transparent 73%,rgba(255,255,255,.03)),
    radial-gradient(circle at 50% -20%,rgba(255,255,255,.08),transparent 42%)!important;
}
#rankingHub .ranking-ref-wave{opacity:.58!important}
#rankingHub .ranking-ref-wave-a{
  left:-11%!important;bottom:-30%!important;width:64%!important;height:78%!important;
  background:radial-gradient(ellipse at center,rgba(0,0,0,.17),transparent 68%)!important;
  transform:rotate(-8deg)!important;
}
#rankingHub .ranking-ref-wave-b{
  right:-18%!important;bottom:-29%!important;width:69%!important;height:72%!important;
  background:radial-gradient(ellipse at center,rgba(255,255,255,.13),transparent 69%)!important;
  transform:rotate(-13deg)!important;
}
#rankingHub .ranking-ref-wave-c{
  left:auto!important;right:-18%!important;top:-64%!important;width:72%!important;height:150%!important;
  border:1px solid rgba(255,255,255,.07)!important;border-radius:50%!important;background:transparent!important;
}
#rankingHub .ranking-resumen.ranking-resumen-referencia > small.ranking-ref-label:first-of-type{
  z-index:3!important;
  min-height:26px!important;
  padding:5px 14px!important;
  border:1px solid rgba(255,255,255,.24)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.95)!important;
  color:color-mix(in srgb,var(--primario2,var(--primario)) 86%,#092f33)!important;
  box-shadow:0 7px 18px rgba(0,0,0,.11)!important;
  font-size:clamp(.66rem,2.35vw,.88rem)!important;
  font-weight:950!important;
  letter-spacing:.075em!important;
}
#rankingHub .ranking-resumen.ranking-resumen-referencia #rankingMiPosicion{
  z-index:3!important;
  filter:drop-shadow(0 8px 17px rgba(0,0,0,.14))!important;
}
#rankingHub .ranking-resumen.ranking-resumen-referencia .ranking-total{
  z-index:3!important;color:rgba(255,255,255,.91)!important;font-weight:700!important;text-shadow:none!important;
}
#rankingHub .ranking-ref-trophy{
  z-index:3!important;color:rgba(255,246,208,.82)!important;opacity:.92!important;
}
#rankingHub .ranking-ref-trophy svg{filter:drop-shadow(0 4px 8px rgba(0,0,0,.18))!important}

/* Marco general del Top 10. */
#rankingHub #listaRankingNacional{
  overflow:hidden!important;
  border:1px solid var(--ranking-stroke)!important;
  border-radius:28px!important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--card) 99%,var(--primario) 1%),var(--card))!important;
  box-shadow:
    0 20px 44px rgba(15,23,42,.085),
    0 3px 10px rgba(15,23,42,.035),
    inset 0 1px 0 color-mix(in srgb,#fff 56%,transparent)!important;
}

/* Podio: iluminación estática, sin movimientos ni elementos nuevos. */
#rankingHub .ranking-podio.ranking-podio-con-assets{
  min-height:320px!important;
  border-bottom:1px solid color-mix(in srgb,var(--primario) 10%,var(--borde))!important;
  background:
    radial-gradient(ellipse at 50% 3%,color-mix(in srgb,var(--primario) 20%,transparent),transparent 36%),
    radial-gradient(circle at 50% 36%,rgba(232,182,74,.10),transparent 23%),
    radial-gradient(circle at 13% 40%,rgba(174,184,200,.085),transparent 24%),
    radial-gradient(circle at 87% 42%,rgba(189,125,92,.075),transparent 24%),
    linear-gradient(180deg,color-mix(in srgb,var(--primario) 5%,var(--card)),var(--card) 89%)!important;
}
#rankingHub .ranking-premium-confetti{
  inset:6px 0 auto!important;height:70%!important;opacity:.32!important;filter:saturate(.88) contrast(.95)!important;
}
#rankingHub .ranking-podio-con-assets .ranking-premium-podium-art{
  bottom:-59px!important;width:min(99%,730px)!important;
  filter:drop-shadow(0 18px 24px rgba(15,23,42,.12))!important;
}
#rankingHub .ranking-podio-con-assets .ranking-podio-puesto-1 .ranking-podio-persona{top:14px!important}
#rankingHub .ranking-podio-con-assets .ranking-podio-puesto-2 .ranking-podio-persona{top:80px!important}
#rankingHub .ranking-podio-con-assets .ranking-podio-puesto-3 .ranking-podio-persona{top:89px!important}
#rankingHub .ranking-premium-crown{
  top:-33px!important;width:50px!important;height:50px!important;
  filter:drop-shadow(0 8px 12px rgba(151,103,20,.25))!important;
}
#rankingHub .ranking-podio-con-assets .ranking-podio-puesto-1 .ranking-avatar{
  width:84px!important;height:84px!important;
  border:3px solid var(--card)!important;
  outline:2px solid color-mix(in srgb,var(--ranking-gold) 88%,#fff 12%)!important;
  box-shadow:
    0 13px 28px rgba(132,92,18,.16),
    0 0 0 7px rgba(232,182,74,.075)!important;
}
#rankingHub .ranking-premium-frame{width:112px!important;height:112px!important}
#rankingHub .ranking-podio-con-assets .ranking-podio-puesto-2 .ranking-avatar{
  width:61px!important;height:61px!important;border:3px solid var(--card)!important;
  outline:2px solid var(--ranking-silver)!important;
  box-shadow:0 10px 22px rgba(88,103,124,.15),0 0 0 5px rgba(174,184,200,.05)!important;
}
#rankingHub .ranking-podio-con-assets .ranking-podio-puesto-3 .ranking-avatar{
  width:61px!important;height:61px!important;border:3px solid var(--card)!important;
  outline:2px solid var(--ranking-bronze)!important;
  box-shadow:0 10px 22px rgba(132,82,57,.14),0 0 0 5px rgba(189,125,92,.045)!important;
}
#rankingHub .ranking-podio-con-assets .ranking-podio-nombre{
  margin-top:9px!important;color:var(--text)!important;font-size:.79rem!important;font-weight:900!important;
  letter-spacing:-.012em!important;text-shadow:none!important;
}
#rankingHub .ranking-podio-con-assets .ranking-podio-puesto-1 .ranking-podio-nombre{
  margin-top:11px!important;font-size:.92rem!important;
}
#rankingHub .ranking-podio-con-assets .ranking-podio-puntos{
  margin-top:6px!important;padding:5px 11px!important;
  border:1px solid color-mix(in srgb,var(--primario) 13%,var(--borde))!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--card) 96%,#fff 4%),color-mix(in srgb,var(--card) 94%,var(--primario) 6%))!important;
  box-shadow:0 6px 14px rgba(15,23,42,.06)!important;
  color:var(--textoAcento)!important;font-size:.74rem!important;font-weight:950!important;
}
#rankingHub .ranking-podio-puesto-1 .ranking-podio-puntos{
  border-color:color-mix(in srgb,var(--ranking-gold) 38%,var(--borde))!important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--card) 95%,#fff 5%),color-mix(in srgb,var(--ranking-gold) 10%,var(--card)))!important;
}
#rankingHub .ranking-marca-yo{
  border:1px solid color-mix(in srgb,var(--primario) 20%,var(--borde))!important;
  background:color-mix(in srgb,var(--primario) 10%,var(--card))!important;
  box-shadow:none!important;
}

/* Puestos 4–10: una lectura más elegante sin parecer tabla. */
#rankingHub .ranking-rack{
  display:grid!important;gap:7px!important;padding:12px 12px 14px!important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--card) 98%,var(--primario) 2%),var(--card))!important;
}
#rankingHub .ranking-rack-fila{
  grid-template-columns:32px 42px minmax(0,1fr) auto!important;
  gap:10px!important;min-height:59px!important;padding:8px 10px!important;
  border:1px solid color-mix(in srgb,var(--text) 4%,transparent)!important;
  border-radius:16px!important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--card) 99%,#fff 1%),color-mix(in srgb,var(--text) 1.6%,var(--card)))!important;
  box-shadow:0 3px 9px rgba(15,23,42,.025)!important;
  transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease!important;
}
#rankingHub .ranking-rack-fila:nth-child(even){
  background:linear-gradient(180deg,color-mix(in srgb,var(--primario) 2.6%,var(--card)),color-mix(in srgb,var(--primario) 1.2%,var(--card)))!important;
}
#rankingHub .ranking-rack-fila-yo{
  margin:0!important;padding:8px 10px!important;
  border-color:color-mix(in srgb,var(--primario) 29%,var(--borde))!important;
  background:linear-gradient(100deg,color-mix(in srgb,var(--primario) 11%,var(--card)),color-mix(in srgb,var(--primario) 5%,var(--card)))!important;
  box-shadow:inset 3px 0 0 var(--primario),0 6px 15px color-mix(in srgb,var(--primario) 7%,transparent)!important;
}
#rankingHub .ranking-rack-fila-yo::before{content:none!important;display:none!important}
#rankingHub .ranking-rack-posicion{
  display:grid!important;place-items:center!important;width:29px!important;height:29px!important;
  border:1px solid color-mix(in srgb,var(--text) 5%,var(--borde))!important;
  border-radius:10px!important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--card) 96%,#fff 4%),color-mix(in srgb,var(--text) 4%,var(--card)))!important;
  color:var(--muted)!important;font-size:.78rem!important;font-weight:950!important;
}
#rankingHub .ranking-rack-fila-yo .ranking-rack-posicion{
  border-color:color-mix(in srgb,var(--primario) 18%,var(--borde))!important;
  background:color-mix(in srgb,var(--primario) 14%,var(--card))!important;
  color:var(--textoAcento)!important;
}
#rankingHub .ranking-rack .ranking-avatar{
  width:41px!important;height:41px!important;border:2px solid var(--card)!important;
  outline:1px solid color-mix(in srgb,var(--primario) 19%,var(--borde))!important;
  box-shadow:0 6px 13px rgba(15,23,42,.08)!important;
}
#rankingHub .ranking-rack-nombre{
  font-size:.86rem!important;font-weight:850!important;letter-spacing:-.012em!important;
}
#rankingHub .ranking-rack-puntos{
  min-width:51px!important;padding:5px 9px!important;border:1px solid color-mix(in srgb,var(--primario) 11%,var(--borde))!important;
  border-radius:999px!important;
  background:color-mix(in srgb,var(--primario) 7%,var(--card))!important;
  color:var(--textoAcento)!important;font-size:.74rem!important;box-shadow:none!important;
}
#rankingHub #rankingEstado{
  min-height:18px!important;margin-top:9px!important;color:var(--muted)!important;font-size:.72rem!important;text-align:center!important;
}

html[data-theme="dark"] #rankingHub #listaRankingNacional,
body.dark #rankingHub #listaRankingNacional{
  border-color:color-mix(in srgb,var(--primario) 17%,var(--borde))!important;
  background:color-mix(in srgb,var(--card) 98%,#000 2%)!important;
  box-shadow:0 21px 46px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.04)!important;
}
html[data-theme="dark"] #rankingHub .ranking-podio.ranking-podio-con-assets,
body.dark #rankingHub .ranking-podio.ranking-podio-con-assets{
  background:
    radial-gradient(ellipse at 50% 3%,color-mix(in srgb,var(--primario) 20%,transparent),transparent 36%),
    radial-gradient(circle at 50% 36%,rgba(232,182,74,.075),transparent 23%),
    linear-gradient(180deg,color-mix(in srgb,var(--primario) 5.5%,var(--card)),var(--card) 89%)!important;
}
html[data-theme="dark"] #rankingHub .ranking-rack-fila,
body.dark #rankingHub .ranking-rack-fila{
  border-color:rgba(255,255,255,.035)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.032),rgba(255,255,255,.018))!important;
  box-shadow:none!important;
}
html[data-theme="dark"] #rankingHub .ranking-rack-fila:nth-child(even),
body.dark #rankingHub .ranking-rack-fila:nth-child(even){
  background:color-mix(in srgb,var(--primario) 3.8%,var(--card))!important;
}
html[data-theme="dark"] #rankingHub .ranking-rack-fila-yo,
body.dark #rankingHub .ranking-rack-fila-yo{
  background:linear-gradient(100deg,color-mix(in srgb,var(--primario) 12%,var(--card)),color-mix(in srgb,var(--primario) 6%,var(--card)))!important;
}

@media (hover:hover) and (pointer:fine){
  #rankingHub .ranking-rack-fila:hover{
    border-color:color-mix(in srgb,var(--primario) 14%,var(--borde))!important;
    background:color-mix(in srgb,var(--primario) 5%,var(--card))!important;
    box-shadow:0 7px 16px color-mix(in srgb,var(--primario) 5%,transparent)!important;
    transform:translateY(-1px)!important;
  }
}

@media(max-width:520px){
  #rankingHub .ranking-perfil-compacto{padding-top:6px!important}
  #rankingHub .ranking-resumen.ranking-resumen-referencia{border-radius:23px!important}
  #rankingHub .ranking-resumen.ranking-resumen-referencia::after{border-radius:22px!important}
  #rankingHub #listaRankingNacional{border-radius:23px!important}
  #rankingHub .ranking-podio.ranking-podio-con-assets{min-height:294px!important}
  #rankingHub .ranking-podio-con-assets .ranking-premium-podium-art{bottom:-54px!important;width:103%!important}
  #rankingHub .ranking-podio-con-assets .ranking-podio-puesto-1 .ranking-podio-persona{top:14px!important}
  #rankingHub .ranking-podio-con-assets .ranking-podio-puesto-2 .ranking-podio-persona{top:73px!important}
  #rankingHub .ranking-podio-con-assets .ranking-podio-puesto-3 .ranking-podio-persona{top:81px!important}
  #rankingHub .ranking-podio-con-assets .ranking-podio-puesto-1 .ranking-avatar{width:76px!important;height:76px!important}
  #rankingHub .ranking-premium-frame{width:102px!important;height:102px!important}
  #rankingHub .ranking-premium-crown{top:-29px!important;width:45px!important;height:45px!important}
  #rankingHub .ranking-podio-con-assets .ranking-podio-puesto-2 .ranking-avatar,
  #rankingHub .ranking-podio-con-assets .ranking-podio-puesto-3 .ranking-avatar{width:56px!important;height:56px!important}
  #rankingHub .ranking-podio-con-assets .ranking-podio-nombre{font-size:.72rem!important}
  #rankingHub .ranking-podio-con-assets .ranking-podio-puesto-1 .ranking-podio-nombre{font-size:.82rem!important}
  #rankingHub .ranking-podio-con-assets .ranking-podio-puntos{padding:4px 8px!important;font-size:.68rem!important}
  #rankingHub .ranking-rack{gap:6px!important;padding:10px 8px 12px!important}
  #rankingHub .ranking-rack-fila{grid-template-columns:30px 39px minmax(0,1fr) auto!important;gap:8px!important;min-height:56px!important;padding:7px 8px!important;border-radius:14px!important}
  #rankingHub .ranking-rack .ranking-avatar{width:38px!important;height:38px!important}
  #rankingHub .ranking-rack-nombre{font-size:.82rem!important}
  #rankingHub .ranking-rack-puntos{min-width:47px!important;padding:5px 7px!important;font-size:.7rem!important}
}

@media(max-width:360px){
  #rankingHub .ranking-podio.ranking-podio-con-assets{min-height:280px!important}
  #rankingHub .ranking-podio-con-assets .ranking-premium-podium-art{bottom:-49px!important;width:106%!important}
  #rankingHub .ranking-podio-con-assets .ranking-podio-puesto-2 .ranking-podio-persona{top:69px!important}
  #rankingHub .ranking-podio-con-assets .ranking-podio-puesto-3 .ranking-podio-persona{top:76px!important}
  #rankingHub .ranking-rack-fila{grid-template-columns:28px 36px minmax(0,1fr) auto!important;gap:7px!important;padding-inline:6px!important}
  #rankingHub .ranking-rack .ranking-avatar{width:35px!important;height:35px!important}
  #rankingHub .ranking-rack-nombre{font-size:.78rem!important}
  #rankingHub .ranking-rack-puntos{min-width:43px!important;font-size:.67rem!important}
}

@media(prefers-reduced-motion:reduce){
  #rankingHub .ranking-rack-fila{transition:none!important}
}
