/*
 * L2 Nostalgic · Classic refinement
 * Recupera la composición abierta del tema original y conserva las mejoras
 * de legibilidad, accesibilidad y adaptación móvil.
 */

:root {
  --classic-line: rgba(201, 170, 114, .16);
  --classic-line-soft: rgba(255, 255, 255, .055);
  --classic-gold: #c8aa74;
  --classic-gold-soft: #ddc79e;
  --classic-text: #e8e0d5;
  --classic-muted: #a99f91;
}

body {
  background: #06070a !important;
}

body::after {
  opacity: .1;
}

.all {
  padding-bottom: 22px !important;
}

/* El arte original vuelve a ser la cabecera. */
.site-hero {
  min-height: 450px;
  padding: 0;
  align-items: initial;
  background:
    linear-gradient(180deg, transparent 66%, rgba(6, 7, 10, .7) 86%, #06070a 100%),
    url("../../imgs/bg-top.jpg") center top / 1920px auto no-repeat;
}

.site-hero::before {
  background: linear-gradient(90deg, rgba(3, 4, 7, .24), transparent 28%, transparent 72%, rgba(3, 4, 7, .24));
}

.hero-copy {
  display: none;
}

/* Estructura principal sin marco exterior. */
section {
  grid-template-columns: 205px minmax(0, 1fr) 205px;
  gap: 34px;
  width: min(1280px, calc(100% - 36px)) !important;
  margin: -38px auto 0 !important;
  padding: 76px 0 24px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

section::before {
  display: none;
}

/* Navegación sobria, cercana a la barra original. */
nav {
  top: 0 !important;
  right: 0 !important;
  left: 0 !important;
  height: 50px !important;
  padding: 0 4px !important;
  border: 0 !important;
  border-top: 1px solid var(--classic-line) !important;
  border-bottom: 1px solid var(--classic-line) !important;
  border-radius: 0 !important;
  background: linear-gradient(90deg, transparent, rgba(7, 7, 10, .84) 12%, rgba(7, 7, 10, .84) 88%, transparent) !important;
  box-shadow: none !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

nav a,
nav div a {
  height: 49px;
  padding: 0 10px !important;
  border-radius: 0;
  color: #cfc2ad !important;
}

nav a::after {
  position: absolute;
  right: 10px;
  bottom: 0;
  left: 10px;
  height: 1px;
  content: "";
  background: transparent;
}

nav a:hover {
  color: #f3dfb8 !important;
  background: transparent !important;
}

nav a:hover::after {
  background: var(--classic-gold);
}

/* Las columnas laterales vuelven a sentirse como grupos, no tarjetas. */
aside .box {
  margin: 0 0 27px !important;
  padding: 0 0 20px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--classic-line-soft) !important;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

aside .box:last-child {
  border-bottom: 0 !important;
}

aside .box .title {
  justify-content: flex-start;
  min-height: 26px;
  margin-bottom: 9px !important;
  padding: 0 0 8px;
  color: var(--classic-gold-soft);
  border-bottom: 1px solid var(--classic-line) !important;
  text-align: left;
}

.lateral-button {
  min-height: 32px;
  margin: 0 !important;
  padding: 0 3px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, .035) !important;
  border-radius: 0;
  background: transparent;
  color: #bdb4a8 !important;
}

.lateral-button:last-of-type {
  border-bottom: 0 !important;
}

.lateral-button::after {
  content: "·";
  color: rgba(201, 170, 114, .5);
}

.lateral-button:hover {
  color: #f1dfbd !important;
  border-color: rgba(201, 170, 114, .14) !important;
  background: transparent !important;
  transform: none;
}

.fieldsBox {
  padding: 0 !important;
  border: 0;
  border-radius: 0 !important;
  background: transparent !important;
}

.fieldsBox .inpt,
.fieldsBox .inpt.pass {
  border: 0 !important;
  border-bottom: 1px solid rgba(201, 170, 114, .16) !important;
  border-radius: 0 !important;
  background: rgba(255, 255, 255, .018) !important;
}

.fieldsBox .gologin {
  margin-top: 8px !important;
  border-radius: 2px !important;
  background: linear-gradient(135deg, #d5b675, #92703e) !important;
}

.sstatus {
  padding: 0 !important;
  border: 0;
  border-radius: 0 !important;
  background: transparent !important;
}

.sstatus > div {
  padding: 0 3px !important;
  border-bottom: 1px solid rgba(255, 255, 255, .045) !important;
}

.sstatus.players-online {
  margin-top: 0 !important;
}

.sstatus.players-online > div {
  justify-content: flex-start;
  padding-top: 8px !important;
}

.galleryBox a,
.galleryBox a img,
.galleryBox a div {
  border-radius: 1px !important;
}

a.donateBanner,
a.supportBanner,
.nostalgic-main-banner,
.banner.nostalgic-main-banner,
.banner.nostalgic-main-banner > a,
.banner.nostalgic-main-banner > a > img,
.nostalgic-main-banner > a,
.nostalgic-main-banner > a > img {
  border-radius: 2px !important;
}

.nostalgic-main-banner,
.banner.nostalgic-main-banner {
  border: 0 !important;
  box-shadow: none !important;
}

/* Contenido editorial abierto. */
.section-text,
.section-panel,
.reglas-box,
.page-card {
  margin-bottom: 25px !important;
  padding: 6px 0 22px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--classic-line-soft) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.section-text li {
  padding: 9px 8px 9px 24px;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, .04);
  border-radius: 0;
  background: transparent;
}

.section-text li::before {
  top: 13px;
  left: 4px;
  width: 6px;
  height: 6px;
  border-radius: 0;
  transform: rotate(45deg);
}

.home-feature-grid {
  gap: 0;
  margin: 2px 0 26px;
  padding: 15px 0;
  border-top: 1px solid var(--classic-line-soft);
  border-bottom: 1px solid var(--classic-line-soft);
}

.home-feature {
  padding: 5px 12px;
  border: 0;
  border-left: 1px solid var(--classic-line-soft);
  border-radius: 0;
  background: transparent;
}

.home-feature:first-child {
  border-left: 0;
}

.formpadrao > div {
  border: 0;
  border-bottom: 1px solid var(--classic-line-soft);
  border-radius: 0;
  background: transparent;
}

table.default {
  border-radius: 2px;
}

article a.default,
a.default,
span.default,
input.default,
.rankings_options > div a,
.page-cta-button,
.paypal-donar button,
.page-cta-paypal {
  border-radius: 2px !important;
  box-shadow: none !important;
}

.redes-flotantes {
  padding: 3px !important;
  border: 0;
  border-radius: 2px !important;
  background: rgba(5, 6, 9, .68) !important;
  box-shadow: none !important;
}

.redes-flotantes a {
  border-radius: 0;
}

#musicBtn {
  width: 42px;
  height: 42px;
  border-radius: 50% !important;
  background: rgba(5, 6, 9, .68) !important;
  box-shadow: none;
}

@media (max-width: 1120px) {
  section {
    grid-template-columns: 185px minmax(0, 1fr) 185px;
    gap: 23px;
  }
}

@media (max-width: 880px) {
  .site-hero {
    min-height: 390px;
    padding: 0;
    background-size: 1580px auto;
  }

  section {
    width: min(720px, calc(100% - 24px)) !important;
    margin-top: -30px !important;
    padding: 72px 0 22px !important;
  }

  nav {
    right: 0 !important;
    left: 0 !important;
  }

  aside {
    gap: 22px 28px;
  }
}

@media (max-width: 580px) {
  .site-hero {
    min-height: 325px;
    background-size: 1270px auto;
  }

  section {
    width: calc(100% - 28px) !important;
    margin-top: -18px !important;
    padding-top: 68px !important;
    border-radius: 0 !important;
  }

  .home-feature {
    border-bottom: 1px solid var(--classic-line-soft);
  }

  .home-feature:nth-child(odd) {
    border-left: 0;
  }

  .home-feature:nth-last-child(-n+2) {
    border-bottom: 0;
  }
}

/* ==========================================================================
   Fondo continuo, marca de galería y atmósfera
   ========================================================================== */

body {
  background:
    radial-gradient(ellipse at 50% 26%, rgba(13, 14, 18, .28), rgba(2, 3, 5, .84) 78%) center / cover fixed no-repeat,
    linear-gradient(180deg, rgba(3, 4, 7, .70), rgba(3, 4, 7, .88) 72%, rgba(2, 3, 5, .94)) center / cover fixed no-repeat,
    url("../../imgs/bg-top.jpg") center top / cover fixed no-repeat !important;
}

body::after {
  opacity: .07;
}

.site-hero {
  background:
    linear-gradient(180deg, rgba(3, 4, 7, .04), rgba(3, 4, 7, .08) 56%, rgba(3, 4, 7, .34) 84%, rgba(3, 4, 7, .48) 100%) !important;
}

.site-hero::before {
  background:
    linear-gradient(90deg, rgba(3, 4, 7, .16), transparent 26%, transparent 74%, rgba(3, 4, 7, .16)),
    radial-gradient(ellipse at 50% 84%, transparent 0%, rgba(3, 4, 7, .32) 78%);
}

.site-hero::after {
  position: absolute;
  z-index: 0;
  inset: 12% -8% -10%;
  content: "";
  pointer-events: none;
  opacity: .19;
  background:
    radial-gradient(ellipse at 28% 72%, rgba(205, 199, 186, .15), transparent 31%),
    radial-gradient(ellipse at 67% 76%, rgba(171, 166, 155, .12), transparent 34%),
    radial-gradient(ellipse at 50% 88%, rgba(217, 207, 189, .09), transparent 38%);
  filter: blur(30px);
  transform: translate3d(-2%, 0, 0) scale(1.08);
  animation: nostalgic-smoke 15s ease-in-out infinite alternate;
}

.hero-copy {
  z-index: 2;
}

.hero-title {
  animation: nostalgic-title-glow 5.5s ease-in-out infinite alternate;
}

@keyframes nostalgic-smoke {
  0% {
    opacity: .12;
    transform: translate3d(-3%, 1%, 0) scale(1.06);
  }

  55% {
    opacity: .20;
  }

  100% {
    opacity: .15;
    transform: translate3d(3%, -1%, 0) scale(1.13);
  }
}

@keyframes nostalgic-title-glow {
  0% {
    text-shadow: 0 4px 22px #000, 0 0 26px rgba(197, 157, 88, .10);
  }

  100% {
    text-shadow: 0 4px 22px #000, 0 0 38px rgba(222, 185, 116, .27), 0 0 70px rgba(164, 133, 77, .10);
  }
}

/* El acceso vuelve al negro común del resto de la interfaz. */
aside.esq .box:first-child {
  background: linear-gradient(145deg, rgba(5, 6, 9, .82), rgba(3, 4, 6, .62)) !important;
}

/* Reproduce la marca dorada del panel para las capturas aún vacías. */
.galleryBox a:has(img[src$="noimage.jpg"]) {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(221, 186, 116, .38) !important;
  background: linear-gradient(135deg, #ecd29e, #a98246) !important;
  box-shadow: inset 0 1px 0 rgba(255, 245, 218, .44), 0 5px 14px rgba(0, 0, 0, .24) !important;
  cursor: default;
}

.galleryBox a:has(img[src$="noimage.jpg"])::before {
  position: absolute;
  z-index: 2;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  content: "N";
  color: #1c1309;
  font-family: "Cinzel", Georgia, serif !important;
  font-size: clamp(26px, 3vw, 42px);
  line-height: 1;
  text-shadow: 0 1px 0 rgba(255, 242, 208, .34);
}

.galleryBox a:has(img[src$="noimage.jpg"])::after {
  position: absolute;
  z-index: 1;
  top: -45%;
  right: -25%;
  width: 75%;
  height: 150%;
  content: "";
  background: linear-gradient(90deg, transparent, rgba(255, 244, 215, .18), transparent);
  transform: rotate(28deg);
}

.galleryBox a:has(img[src$="noimage.jpg"]) > img {
  opacity: 0 !important;
}

.galleryBox a:has(img[src$="noimage.jpg"]) > div {
  display: none !important;
}

@media (prefers-reduced-motion: reduce) {
  .site-hero::after,
  .hero-title {
    animation: none;
  }
}

@media (max-width: 580px) {
  body {
    background:
      radial-gradient(ellipse at 50% 18%, rgba(13, 14, 18, .2), rgba(2, 3, 5, .88) 72%) center / cover fixed no-repeat,
      linear-gradient(180deg, rgba(3, 4, 7, .72), rgba(2, 3, 5, .94)) center / cover fixed no-repeat,
      url("../../imgs/bg-top.jpg") center top / auto 100vh fixed no-repeat !important;
  }

  .site-hero::after {
    opacity: .12;
    filter: blur(24px);
  }
}

/* ==========================================================================
   Ajuste de escala, tipografía y componentes laterales
   ========================================================================== */

body {
  background:
    radial-gradient(ellipse at 50% 26%, rgba(13, 14, 18, .28), rgba(2, 3, 5, .84) 78%) center / cover fixed no-repeat,
    linear-gradient(180deg, rgba(3, 4, 7, .70), rgba(3, 4, 7, .88) 72%, rgba(2, 3, 5, .94)) center / cover fixed no-repeat,
    url("../../imgs/bg-top.jpg") center top / 128% auto fixed no-repeat !important;
}

.site-hero {
  min-height: clamp(700px, 88vh, 920px);
}

/* Se elimina por completo la capa de neblina. */
.site-hero::after {
  display: none !important;
  content: none !important;
  animation: none !important;
}

.hero-title,
.bayonetta-title,
.titulo-iluminado,
.page h1,
.page h2.bayonetta-title.small,
.home-feature strong,
.galleryBox a:has(img[src$="noimage.jpg"])::before {
  font-family: "Cinzel", Georgia, serif !important;
}

.hero-title {
  font-weight: 600;
  letter-spacing: -.035em;
}

.bayonetta-title,
.titulo-iluminado,
.page h1,
.page h2.bayonetta-title.small {
  font-weight: 600 !important;
  letter-spacing: -.025em;
}

/* El bloque de usuario vuelve a ser un grupo lateral como los demás. */
aside.esq .box:first-child {
  padding: 0 0 20px !important;
  overflow: visible;
  border: 0 !important;
  border-bottom: 1px solid var(--classic-line-soft) !important;
  background: transparent !important;
  box-shadow: none !important;
}

aside.esq .box:first-child::after {
  display: none !important;
  content: none !important;
}

body .all .loginarea {
  width: 100% !important;
  margin: 0 !important;
}

body .all .fieldsBox {
  display: grid;
  width: 100% !important;
  gap: 7px;
}

body .all .fieldsBox label {
  margin: 0;
}

body .all .fieldsBox .inpt,
body .all .fieldsBox .inpt.pass {
  width: 100% !important;
  height: 36px !important;
  padding: 0 10px 0 33px !important;
  border: 1px solid rgba(207, 171, 103, .10) !important;
  border-left-color: rgba(207, 171, 103, .25) !important;
  border-radius: 2px !important;
  background: rgba(4, 5, 8, .66) !important;
  line-height: 36px !important;
}

body .all .fieldsBox .acc_icon.user {
  top: 13px !important;
  left: 12px !important;
}

body .all .fieldsBox .acc_icon.pass {
  top: 56px !important;
  left: 12px !important;
}

body .all .fieldsBox .gologin {
  position: static !important;
  width: 100% !important;
  height: 34px !important;
  min-height: 34px !important;
  margin: 1px 0 0 !important;
  color: #d9cdbb !important;
  border: 1px solid rgba(207, 171, 103, .18) !important;
  border-radius: 2px !important;
  clip-path: none !important;
  background: rgba(12, 11, 14, .72) !important;
  box-shadow: none !important;
  font-family: "Poppins", Arial, sans-serif !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: .85px;
  text-transform: uppercase !important;
}

body .all .fieldsBox .gologin:hover {
  color: #f0ddb9 !important;
  border-color: rgba(211, 176, 108, .34) !important;
  background: rgba(30, 25, 23, .78) !important;
  box-shadow: none !important;
  transform: none !important;
}

/* El marcador vacío es ahora un medallón, no una baldosa dorada. */
.galleryBox a:has(img[src$="noimage.jpg"]) {
  border: 1px solid rgba(216, 181, 112, .13) !important;
  background: rgba(5, 6, 9, .56) !important;
  box-shadow: none !important;
}

.galleryBox a:has(img[src$="noimage.jpg"])::before {
  top: 50%;
  right: auto;
  bottom: auto;
  left: 50%;
  width: 68%;
  height: 68%;
  border: 1px solid rgba(231, 199, 134, .55);
  border-radius: 50%;
  background: linear-gradient(135deg, #ecd29e, #a98246);
  box-shadow: inset 0 1px 0 rgba(255, 247, 222, .48), 0 4px 12px rgba(0, 0, 0, .24);
  font-size: clamp(17px, 2vw, 25px);
  font-weight: 600;
  transform: translate(-50%, -50%);
}

.galleryBox a:has(img[src$="noimage.jpg"])::after {
  z-index: 3;
  top: 24%;
  right: 22%;
  width: 24%;
  height: 44%;
  border-radius: 50%;
  opacity: .28;
}

@media (max-width: 880px) {
  body {
    background-size: auto 118vh !important;
  }

  .site-hero {
    min-height: 610px;
  }
}

@media (max-width: 580px) {
  body {
    background:
      radial-gradient(ellipse at 50% 18%, rgba(13, 14, 18, .2), rgba(2, 3, 5, .88) 72%) center / cover fixed no-repeat,
      linear-gradient(180deg, rgba(3, 4, 7, .72), rgba(2, 3, 5, .94)) center / cover fixed no-repeat,
      url("../../imgs/bg-top.jpg") center top / auto 118vh fixed no-repeat !important;
  }

  .site-hero {
    min-height: 540px;
  }
}

/* ==========================================================================
   Escena de portada y lenguaje de acciones
   ========================================================================== */

.site-hero {
  min-height: clamp(650px, 82vh, 860px);
  padding: 0 24px 86px;
  align-items: flex-end;
  justify-content: center;
  background:
    linear-gradient(180deg, rgba(3, 4, 7, .03) 0%, rgba(3, 4, 7, .05) 48%, rgba(4, 5, 8, .54) 76%, #06070a 100%),
    url("../../imgs/bg-top.jpg") center top / cover no-repeat;
}

.site-hero::before {
  background:
    linear-gradient(90deg, rgba(3, 4, 7, .28), transparent 24%, transparent 76%, rgba(3, 4, 7, .28)),
    radial-gradient(ellipse at 50% 82%, rgba(5, 6, 9, .08), rgba(5, 6, 9, .62) 72%);
}

.hero-copy {
  display: flex;
  max-width: 690px;
}

.hero-kicker {
  min-height: 0;
  padding: 0;
  color: #cbb07e;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  font-size: 9px;
  letter-spacing: 2.4px;
  backdrop-filter: none;
}

.hero-title {
  margin-top: 12px;
  color: #f0dfbd;
  font-size: clamp(40px, 4.3vw, 60px);
  text-shadow: 0 4px 22px #000, 0 0 38px rgba(197, 157, 88, .15);
}

.hero-copy p {
  max-width: 560px;
  margin-top: 10px;
  color: rgba(238, 231, 220, .72);
  font-size: 12px;
}

.hero-actions {
  gap: 12px;
  margin-top: 21px;
}

.hero-button {
  position: relative;
  min-width: 188px;
  min-height: 45px;
  padding: 0 24px !important;
  overflow: hidden;
  border: 0 !important;
  border-radius: 0 !important;
  clip-path: polygon(11px 0, 100% 0, calc(100% - 11px) 100%, 0 100%);
  box-shadow: inset 0 0 0 1px rgba(213, 179, 112, .28) !important;
  letter-spacing: 1px;
}

.hero-button.primary {
  color: #17120c !important;
  background: linear-gradient(110deg, #e2c78f 0%, #bd9658 48%, #8e6938 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 246, 220, .46), inset 0 -1px 0 rgba(62, 39, 16, .34) !important;
}

.hero-button.secondary {
  color: #eadcc5 !important;
  background: linear-gradient(110deg, rgba(15, 14, 17, .76), rgba(4, 5, 8, .82)) !important;
  box-shadow: inset 0 0 0 1px rgba(213, 179, 112, .34) !important;
  backdrop-filter: blur(8px);
}

.hero-button:hover {
  color: #fff5df !important;
  background: linear-gradient(110deg, #d8ba80, #9d753f) !important;
  box-shadow: inset 0 0 0 1px rgba(248, 218, 157, .7), 0 9px 24px rgba(0, 0, 0, .28) !important;
  transform: translateY(-1px);
}

section {
  margin-top: -46px !important;
}

/* El acceso utiliza la misma ilustración, sin el antiguo bloque granate. */
aside.esq .box:first-child {
  position: relative;
  padding: 18px 16px 20px !important;
  overflow: hidden;
  border-top: 1px solid rgba(216, 181, 112, .3) !important;
  border-bottom: 1px solid rgba(216, 181, 112, .14) !important;
  background:
    linear-gradient(135deg, rgba(7, 8, 11, .86), rgba(7, 8, 11, .62)),
    url("../../imgs/bg-top.jpg") 15% 42% / 920px auto no-repeat !important;
  box-shadow: inset 0 0 34px rgba(0, 0, 0, .35);
}

aside.esq .box:first-child::after {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 38px;
  height: 1px;
  content: "";
  background: #b99054;
}

body .all .loginarea {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body .all .fieldsBox {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body .all .fieldsBox label {
  margin-bottom: 8px;
}

body .all .fieldsBox .inpt,
body .all .fieldsBox .inpt.pass {
  height: 40px !important;
  padding-left: 35px !important;
  border: 0 !important;
  border-left: 1px solid rgba(208, 171, 103, .34) !important;
  border-bottom: 1px solid rgba(208, 171, 103, .13) !important;
  border-radius: 0 !important;
  background: rgba(3, 4, 7, .54) !important;
  box-shadow: inset 0 1px 8px rgba(0, 0, 0, .2) !important;
}

body .all .fieldsBox .inpt:focus {
  border-left-color: #d4b576 !important;
  border-bottom-color: rgba(212, 181, 118, .44) !important;
  background: rgba(3, 4, 7, .72) !important;
}

body .all .fieldsBox .gologin {
  width: 100% !important;
  height: 40px !important;
  margin-top: 2px !important;
  color: #1a130b !important;
  border: 0 !important;
  border-radius: 0 !important;
  clip-path: polygon(9px 0, 100% 0, calc(100% - 9px) 100%, 0 100%);
  background: linear-gradient(110deg, #dfc389, #b0874e 58%, #805d32) !important;
  box-shadow: inset 0 1px 0 rgba(255, 245, 219, .4) !important;
  letter-spacing: 1.1px;
}

body .all .fieldsBox .gologin:hover {
  color: #0d0905 !important;
  background: linear-gradient(110deg, #edd39d, #bd9458 58%, #906b3c) !important;
}

/* Los enlaces laterales dejan de fingir ser cajas. */
body .all aside .box a.lateral-button {
  position: relative;
  min-height: 34px;
  padding: 0 4px 0 17px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, .04) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  clip-path: none;
  color: #bdb3a5 !important;
  transition: color .18s ease, padding-left .18s ease, border-color .18s ease;
}

body .all aside .box a.lateral-button::before {
  position: absolute;
  top: 50%;
  left: 3px;
  width: 5px;
  height: 5px;
  content: "";
  border-top: 1px solid #b99659;
  border-right: 1px solid #b99659;
  transform: translateY(-50%) rotate(45deg);
}

body .all aside .box a.lateral-button::after {
  display: none;
}

body .all aside .box a.lateral-button:hover {
  padding-left: 21px !important;
  color: #f0ddba !important;
  border-bottom-color: rgba(207, 170, 101, .18) !important;
  background: linear-gradient(90deg, rgba(192, 151, 83, .06), transparent 76%) !important;
}

/* Acciones interiores con la misma geometría metálica. */
body .page a.default,
body .page span.default,
body .page input.default,
body .page .rankings_options > div a,
body .page .page-cta-button,
body .page .paypal-donar button,
body .page .page-cta-paypal {
  border: 0 !important;
  border-radius: 0 !important;
  clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%);
  background: linear-gradient(110deg, rgba(30, 26, 24, .96), rgba(8, 8, 11, .98)) !important;
  box-shadow: inset 0 0 0 1px rgba(205, 167, 98, .26) !important;
  letter-spacing: .45px;
}

body .page a.default:hover,
body .page input.default:hover,
body .page span.default:hover,
body .page .rankings_options > div a:hover,
body .page .page-cta-button:hover,
body .page .paypal-donar button:hover,
body .page .page-cta-paypal:hover {
  color: #fff0d0 !important;
  background: linear-gradient(110deg, rgba(72, 54, 36, .98), rgba(15, 13, 15, .99)) !important;
  box-shadow: inset 0 0 0 1px rgba(226, 188, 117, .5) !important;
}

@media (max-width: 880px) {
  .site-hero {
    min-height: 570px;
    padding-bottom: 70px;
    background-size: cover;
  }

  .hero-title {
    font-size: 44px;
  }

  section {
    margin-top: -38px !important;
  }
}

@media (max-width: 580px) {
  .site-hero {
    min-height: 500px;
    padding: 0 17px 58px;
    background-position: center top;
    background-size: auto 500px;
  }

  .hero-kicker {
    font-size: 7px;
    letter-spacing: 1.5px;
  }

  .hero-title {
    font-size: 34px;
  }

  .hero-copy p {
    max-width: 340px;
    font-size: 10px;
    line-height: 1.6;
  }

  .hero-actions {
    gap: 8px;
  }

  .hero-button {
    min-width: 0;
    flex-basis: 145px;
    min-height: 42px;
    padding: 0 14px !important;
    font-size: 8px !important;
  }

  section {
    margin-top: -28px !important;
  }
}

/* Cascada final: la ilustración pertenece a la página completa, no a un bloque. */
body {
  background:
    radial-gradient(ellipse at 50% 26%, rgba(13, 14, 18, .28), rgba(2, 3, 5, .84) 78%) center / cover fixed no-repeat,
    linear-gradient(180deg, rgba(3, 4, 7, .70), rgba(3, 4, 7, .88) 72%, rgba(2, 3, 5, .94)) center / cover fixed no-repeat,
    url("../../imgs/bg-top.jpg") center top / 128% auto fixed no-repeat !important;
}

.site-hero {
  min-height: clamp(700px, 88vh, 920px);
  background: linear-gradient(180deg, rgba(3, 4, 7, .04), rgba(3, 4, 7, .08) 56%, rgba(3, 4, 7, .34) 84%, rgba(3, 4, 7, .48) 100%) !important;
}

.site-hero::before {
  background:
    linear-gradient(90deg, rgba(3, 4, 7, .16), transparent 26%, transparent 74%, rgba(3, 4, 7, .16)),
    radial-gradient(ellipse at 50% 84%, transparent 0%, rgba(3, 4, 7, .32) 78%);
}

aside.esq .box:first-child {
  padding: 0 0 20px !important;
  overflow: visible;
  border: 0 !important;
  border-bottom: 1px solid var(--classic-line-soft) !important;
  background: transparent !important;
  box-shadow: none !important;
}

aside.esq .box:first-child::after {
  display: none !important;
  content: none !important;
}

.hero-copy {
  max-width: 900px;
}

.hero-title {
  font-size: clamp(38px, 4vw, 54px);
  white-space: nowrap;
}

body .all .loginarea {
  width: 100% !important;
  margin: 0 !important;
}

body .all .fieldsBox {
  display: grid;
  width: 100% !important;
  gap: 7px;
}

body .all .fieldsBox label {
  margin: 0;
}

body .all .fieldsBox .inpt,
body .all .fieldsBox .inpt.pass {
  width: 100% !important;
  height: 36px !important;
  padding: 0 10px 0 33px !important;
  border: 1px solid rgba(207, 171, 103, .10) !important;
  border-left-color: rgba(207, 171, 103, .25) !important;
  border-radius: 2px !important;
  background: rgba(4, 5, 8, .66) !important;
  line-height: 36px !important;
}

body .all .fieldsBox .acc_icon.user {
  top: 13px !important;
  left: 12px !important;
}

body .all .fieldsBox .acc_icon.pass {
  top: 56px !important;
  left: 12px !important;
}

body .all .fieldsBox .gologin {
  position: static !important;
  width: 100% !important;
  height: 34px !important;
  min-height: 34px !important;
  margin: 1px 0 0 !important;
  color: #d9cdbb !important;
  border: 1px solid rgba(207, 171, 103, .18) !important;
  border-radius: 2px !important;
  clip-path: none !important;
  background: rgba(12, 11, 14, .72) !important;
  box-shadow: none !important;
  font-family: "Poppins", Arial, sans-serif !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: .85px;
  text-transform: uppercase !important;
}

body .all .fieldsBox .gologin:hover {
  color: #f0ddb9 !important;
  border-color: rgba(211, 176, 108, .34) !important;
  background: rgba(30, 25, 23, .78) !important;
  box-shadow: none !important;
  transform: none !important;
}

@media (max-width: 880px) {
  body {
    background-size: cover, cover, auto 118vh !important;
  }

  .site-hero {
    min-height: 610px;
  }

  .hero-title {
    font-size: 40px;
    white-space: normal;
  }
}

@media (max-width: 580px) {
  body {
    background:
      radial-gradient(ellipse at 50% 18%, rgba(13, 14, 18, .2), rgba(2, 3, 5, .88) 72%) center / cover fixed no-repeat,
      linear-gradient(180deg, rgba(3, 4, 7, .72), rgba(2, 3, 5, .94)) center / cover fixed no-repeat,
      url("../../imgs/bg-top.jpg") center top / auto 118vh fixed no-repeat !important;
  }

  .site-hero {
    min-height: 540px;
    background: linear-gradient(180deg, rgba(3, 4, 7, .04), rgba(3, 4, 7, .12) 55%, rgba(3, 4, 7, .52) 100%) !important;
  }
}

/* ==========================================================================
   Composición final del fondo: una sola escena continua
   ========================================================================== */

body {
  background:
    radial-gradient(ellipse at 50% 34%, rgba(3, 4, 7, .32) 0%, rgba(2, 3, 5, .55) 62%, rgba(2, 3, 5, .76) 100%) center / cover fixed no-repeat,
    linear-gradient(180deg, rgba(3, 4, 7, .30), rgba(3, 4, 7, .52) 62%, rgba(2, 3, 5, .70) 100%) center / cover fixed no-repeat,
    url("../../imgs/bg-top.jpg") calc(50% - clamp(0px, calc(11vw - 140.8px), 84px)) 150px / 160% auto fixed no-repeat !important;
  background-color: #050609 !important;
}

.site-hero {
  background: transparent !important;
}

/* Recordatorio del panel: noticias privadas y gestión de la cuenta. */
.nostalgic-panel-reminder {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  margin: 18px 0 34px;
  padding: 19px 21px;
  overflow: hidden;
  align-items: center;
  gap: 17px;
  border-top: 1px solid rgba(214, 177, 105, .25);
  border-right: 1px solid rgba(255, 255, 255, .045);
  border-bottom: 1px solid rgba(214, 177, 105, .13);
  border-left: 2px solid rgba(222, 177, 93, .68);
  background:
    radial-gradient(circle at 8% 10%, rgba(128, 70, 90, .14), transparent 34%),
    linear-gradient(105deg, rgba(25, 19, 23, .88), rgba(7, 9, 13, .82));
  box-shadow: 0 17px 42px rgba(0, 0, 0, .20), inset 0 1px 0 rgba(255, 255, 255, .025);
}

.nostalgic-panel-reminder::after {
  position: absolute;
  top: 0;
  right: 0;
  width: 28%;
  height: 1px;
  content: "";
  background: linear-gradient(90deg, transparent, rgba(231, 190, 111, .54));
}

.panel-reminder-copy small {
  display: block;
  margin-bottom: 4px;
  color: #b9965e;
  font-size: 7px;
  font-weight: 700;
  letter-spacing: 1.3px;
  text-transform: uppercase;
}

.panel-reminder-copy h3 {
  margin: 0 0 6px;
  color: #ead9ba;
  font-family: "Cinzel", Georgia, serif;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: .2px;
}

.panel-reminder-copy p {
  max-width: 760px;
  margin: 0;
  color: #bdb4a8;
  font-size: 9px;
  line-height: 1.65;
}

.panel-reminder-actions {
  display: flex;
  margin-top: 12px;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.panel-reminder-actions a {
  display: inline-flex;
  min-height: 38px;
  padding: 0 16px;
  align-items: center;
  justify-content: center;
  color: #d8c5a5;
  border: 1px solid rgba(211, 174, 105, .24);
  background: rgba(5, 7, 10, .44);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .7px;
  text-decoration: none;
  text-transform: uppercase;
  transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease;
}

.panel-reminder-actions a.primary {
  color: #17120c;
  border-color: #d4aa61;
  background: linear-gradient(135deg, #e5c27d, #b88742);
}

.panel-reminder-actions a:hover {
  color: #f4dfb5;
  border-color: rgba(229, 191, 116, .55);
  background: rgba(85, 58, 34, .35);
  transform: translateY(-1px);
}

.panel-reminder-actions a.primary:hover {
  color: #17120c;
  background: linear-gradient(135deg, #efd08c, #c5954c);
}

@media (max-width: 760px) {
  .nostalgic-panel-reminder {
    grid-template-columns: 1fr;
    padding: 17px;
  }

  .panel-reminder-actions {
    grid-column: 1 / -1;
    justify-content: flex-start;
    padding-left: 0;
  }
}

@media (max-width: 480px) {
  .nostalgic-panel-reminder {
    grid-template-columns: 1fr;
  }

  .panel-reminder-actions {
    grid-column: auto;
    padding-left: 0;
  }

  .panel-reminder-actions a {
    flex: 1 1 130px;
  }
}

/* Soporte: una única guía visual para rombos, titulares y cierre. */
.page .support-panel.section-text.editorial-copy {
  width: min(760px, 100%) !important;
  margin: 0 auto 42px !important;
  padding: 0 0 24px !important;
  border-bottom: 1px solid rgba(208, 171, 102, .14) !important;
}

.page .support-panel .editorial-lead {
  position: relative;
  width: 100%;
  margin: 0 0 10px !important;
  padding: 18px 22px 18px 46px !important;
  color: #e2c98f !important;
  border-top: 1px solid rgba(211, 174, 105, .13) !important;
  border-bottom: 1px solid rgba(211, 174, 105, .15) !important;
  background: linear-gradient(90deg, rgba(174, 129, 61, .075), transparent 78%) !important;
  font-size: 13px !important;
  line-height: 1.65 !important;
}

.page .support-panel .editorial-lead::before {
  top: 50%;
  left: 20px;
  transform: translateY(-50%) rotate(45deg);
}

.page .support-panel > p {
  position: relative;
  margin: 0 !important;
  padding: 17px 18px 17px 39px !important;
  border-top: 1px solid rgba(255, 255, 255, .045);
  color: #d2cbc0;
  line-height: 1.8 !important;
}

.page .support-panel > p::before {
  top: 25px;
  left: 16px;
}

.page .support-panel > p.support-closing {
  margin-top: 10px !important;
  padding: 19px 22px 19px 45px !important;
  border: 1px solid rgba(211, 174, 105, .15) !important;
  border-left: 2px solid rgba(203, 153, 78, .58) !important;
  background: linear-gradient(105deg, rgba(113, 67, 32, .10), rgba(7, 9, 12, .24));
}

.page .support-panel > p.support-closing::before {
  top: 50%;
  left: 19px;
  transform: translateY(-50%) rotate(45deg);
}

@media (max-width: 580px) {
  .page .support-panel .editorial-lead {
    padding: 15px 13px 15px 38px !important;
    font-size: 11px !important;
  }

  .page .support-panel .editorial-lead::before {
    left: 15px;
  }

  .page .support-panel > p {
    padding-right: 10px !important;
    padding-left: 33px !important;
  }
}

.page .information-page .information-intro {
  position: relative;
  width: 88%;
  margin: 0 auto 28px;
  padding: 17px 20px 17px 44px;
  color: #d7cfc2;
  border: 1px solid rgba(211, 172, 99, .19);
  border-left: 2px solid rgba(209, 160, 82, .62);
  background: linear-gradient(110deg, rgba(116, 70, 34, .12), rgba(8, 10, 13, .28));
  font-size: 12px;
  line-height: 1.75;
  text-align: left;
}

.page .information-page .information-intro::before {
  position: absolute;
  top: 21px;
  left: 20px;
  width: 8px;
  height: 8px;
  border: 1px solid #bf914d;
  content: "";
  transform: rotate(45deg);
  box-shadow: 0 0 12px rgba(192, 143, 70, .24);
}

/* ==========================================================================
   Lenguaje visual unificado: banners, páginas editoriales y gestión de cuenta
   ========================================================================== */

/* Carrusel exclusivo de Inicio. */
.page .nostalgic-main-banner,
.page .banner.nostalgic-main-banner {
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  aspect-ratio: 1488 / 600 !important;
  margin: 0 auto 22px !important;
  overflow: hidden !important;
  border: 1px solid rgba(214, 173, 96, .62) !important;
  border-radius: 4px !important;
  background: #050608 !important;
  box-shadow:
    0 22px 48px rgba(0, 0, 0, .46),
    0 0 0 1px rgba(214, 173, 96, .22),
    0 0 36px rgba(184, 137, 69, .18) !important;
}

.page .nostalgic-main-banner > a,
.page .banner.nostalgic-main-banner > a {
  width: 100% !important;
  height: 100% !important;
  overflow: hidden;
  border-radius: 2px !important;
  opacity: 0;
  pointer-events: none;
  transition: opacity .55s ease;
}

.page .nostalgic-main-banner > a.bvis,
.page .banner.nostalgic-main-banner > a.bvis {
  z-index: 2;
  opacity: 1;
  pointer-events: auto;
}

.page .nostalgic-main-banner > a > img,
.page .banner.nostalgic-main-banner > a > img {
  position: relative;
  z-index: 0;
  display: block;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  object-fit: cover;
  object-position: center center;
  border-radius: 2px !important;
  filter: saturate(1.05) contrast(1.06) brightness(.96);
  transition: filter .35s ease, transform 6s ease;
}

.page .nostalgic-main-banner > a.bvis:hover > img {
  filter: saturate(1) contrast(1.05) brightness(.94);
  transform: scale(1.018);
}

.page .nostalgic-main-banner .bmask {
  z-index: 1;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(180deg, rgba(3, 4, 7, .05) 0%, rgba(3, 4, 7, .02) 52%, rgba(2, 3, 5, .78) 100%);
}

.page .nostalgic-main-banner .banner-copy {
  position: absolute;
  z-index: 2;
  top: auto;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  flex-direction: row;
  align-items: baseline;
  gap: 14px;
  max-width: none;
  padding: 54px 22px 16px;
  color: #f1dfbb;
  text-align: left;
  transform: none;
  text-shadow: 0 3px 17px rgba(0, 0, 0, .96);
}

.page .nostalgic-main-banner .banner-copy::before {
  display: none;
}

.page .nostalgic-main-banner .banner-copy small {
  color: #d6b77d;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.6px;
  line-height: 1.2;
  text-transform: uppercase;
}

.page .nostalgic-main-banner .banner-copy strong {
  margin-top: 0;
  font-family: "Cinzel", Georgia, serif;
  font-size: clamp(20px, 2vw, 28px);
  font-weight: 600;
  letter-spacing: .02em;
  line-height: 1.15;
}

.page .nostalgic-main-banner .circles {
  z-index: 4;
  top: 14px !important;
  right: 14px !important;
  bottom: auto !important;
}

/* Títulos iguales al lenguaje del hero principal. */
.page h2.page-title,
.page .page-title {
  width: 100%;
  max-width: 920px;
  margin: 8px auto 24px !important;
  padding: 0 10px !important;
  color: #f0dfbd !important;
  border: 0 !important;
  background: transparent !important;
  font-family: "Cinzel", Georgia, serif !important;
  font-size: clamp(32px, 3.2vw, 44px) !important;
  font-weight: 600 !important;
  letter-spacing: .01em;
  line-height: 1.2 !important;
  text-align: center !important;
  text-shadow:
    0 4px 22px rgba(0, 0, 0, .96),
    0 0 34px rgba(184, 137, 69, .13) !important;
  transform: none !important;
}

/* Navegación Registro / Gestión perfectamente centrada. */
.page .account-actions {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(160px, 220px));
  justify-content: center;
  gap: 10px;
  width: min(720px, 100%);
  margin: 0 auto 28px !important;
}

.page .account-actions .page-cta-button {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 43px !important;
  margin: 0 !important;
  padding: 0 16px !important;
  clip-path: none !important;
  border: 1px solid rgba(203, 166, 99, .18) !important;
  border-radius: 2px !important;
  background: rgba(8, 9, 12, .64) !important;
  color: #bfb5a7 !important;
  font-size: 9px !important;
  letter-spacing: .85px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .02) !important;
}

.page .account-actions .page-cta-button:hover {
  color: #f0ddb9 !important;
  border-color: rgba(215, 177, 106, .42) !important;
  background: rgba(30, 25, 22, .82) !important;
}

.page .account-actions .page-cta-button.is-active {
  color: #f2dfbb !important;
  border-color: rgba(215, 177, 106, .48) !important;
  border-left: 2px solid #c69a55 !important;
  background: linear-gradient(90deg, rgba(78, 57, 34, .68), rgba(9, 10, 13, .84)) !important;
}

/* Formularios de cuenta abiertos y ligeros, sin el antiguo bloque granate. */
.page .account-form-shell {
  width: min(760px, 100%) !important;
  max-width: 760px !important;
  margin: 0 auto 44px !important;
  padding: 0 0 28px !important;
  color: #d8d0c5 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(208, 171, 102, .14) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-family: "Poppins", Arial, sans-serif !important;
  font-size: 10px !important;
  line-height: 1.7 !important;
}

.page .account-intro,
.page .editorial-lead {
  position: relative;
  display: block;
  width: min(700px, 100%);
  margin: 0 auto 28px !important;
  padding: 15px 20px 15px 38px !important;
  color: #d9cfbf !important;
  border-top: 1px solid rgba(211, 174, 105, .12);
  border-bottom: 1px solid rgba(255, 255, 255, .04);
  background: linear-gradient(90deg, rgba(174, 129, 61, .045), transparent 75%);
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.75 !important;
  text-align: left !important;
}

.page .account-intro::before,
.page .editorial-lead::before {
  position: absolute;
  top: 50%;
  left: 15px;
  width: 7px;
  height: 7px;
  border: 1px solid #b88a47;
  content: "";
  transform: translateY(-50%) rotate(45deg);
  box-shadow: 0 0 10px rgba(184, 138, 71, .16);
}

.page .account-form-shell form,
.page .account-form-shell #reggo.registration-form {
  width: min(640px, 100%);
  margin: 0 auto;
}

.page .account-form-shell .form-group {
  margin-bottom: 18px !important;
}

.page .account-form-shell .form-group > label {
  display: block;
  margin-bottom: 8px !important;
  color: #d8cbb7 !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: .55px;
  text-transform: uppercase;
}

.page .account-form-shell .form-group input[type="text"],
.page .account-form-shell .form-group input[type="password"],
.page .account-form-shell .form-group input[type="email"] {
  width: 100% !important;
  height: 46px !important;
  padding: 0 14px !important;
  color: #eee6da !important;
  border: 1px solid rgba(208, 171, 102, .16) !important;
  border-left: 2px solid rgba(190, 148, 78, .44) !important;
  border-radius: 2px !important;
  background: linear-gradient(90deg, rgba(18, 16, 18, .44), rgba(7, 8, 11, .24)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .018) !important;
  font-family: "Poppins", Arial, sans-serif !important;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.page .account-form-shell .form-group input:focus {
  outline: none !important;
  border-color: rgba(221, 184, 112, .42) !important;
  border-left-color: #c49a56 !important;
  background: linear-gradient(90deg, rgba(39, 30, 25, .48), rgba(8, 9, 12, .30)) !important;
  box-shadow: 0 0 0 3px rgba(190, 148, 78, .065) !important;
}

.page .account-form-shell .captcha-field {
  margin-top: 28px !important;
  padding: 22px 0 25px !important;
  border-top: 1px solid rgba(210, 174, 106, .13);
  border-bottom: 1px solid rgba(255, 255, 255, .045);
  text-align: center !important;
}

.page .account-form-shell .captcha-field > label {
  text-align: center !important;
}

.page .account-form-shell .captcha-visual,
.page .account-form-shell .dcaptcha {
  justify-content: center !important;
}

.page .account-form-shell [id="12035"],
.page .account-form-shell [id="12036"],
.page .account-form-shell [id="12043"] {
  display: none !important;
}

.page .account-form-shell .captchaImage,
.page #reggo .captchaImage {
  display: block;
  width: min(420px, 100%) !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 auto;
  padding: 0;
  border: 1px solid rgba(214, 173, 96, .55);
  border-radius: 3px;
  background: #0e0c0a;
  box-shadow: 0 14px 28px rgba(0, 0, 0, .35);
  image-rendering: auto;
}

.page .captcha-hint {
  margin: 0 auto 12px !important;
  color: #b7ad9f;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 13px !important;
  line-height: 1.4;
  text-align: center;
}

.page .captcha-visual {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

.page .captcha-refresh {
  min-height: 36px;
  padding: 0 16px;
  border: 1px solid rgba(214, 173, 96, .4);
  border-radius: 3px;
  background: transparent;
  color: #e6d3ae;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  cursor: pointer;
}

.page .captcha-refresh:hover {
  border-color: rgba(236, 214, 168, .8);
  color: #fff6e4;
}

.page #reggo .form-group.captcha-field input[type="text"].captcha-input,
.page .account-form-shell .captcha-field input.captcha-input {
  display: block;
  width: min(420px, 100%) !important;
  height: 56px !important;
  margin: 14px auto 0 !important;
  border: 1px solid rgba(214, 173, 96, .55) !important;
  border-radius: 3px !important;
  background: rgba(8, 9, 12, .92) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
  color: #f4ecdf !important;
  font-family: "Cinzel", Georgia, serif !important;
  font-size: 26px !important;
  font-weight: 600;
  letter-spacing: .28em;
  text-align: center;
}

.page #reggo input::placeholder,
.page .account-form input::placeholder {
  color: rgba(214, 196, 168, .38);
  letter-spacing: 0;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
}

.page .account-form-shell .captcha-field input.captcha-input {
  display: block;
  width: 220px !important;
  max-width: 100%;
  margin: 16px auto 0 !important;
  border-left-width: 1px !important;
  background: rgba(8, 9, 12, .26) !important;
  font-size: 15px !important;
  letter-spacing: 5px;
  text-align: center;
}

.page .account-form-shell .form-submit-row,
.page .account-form-shell .registration-submit {
  display: flex !important;
  justify-content: center;
  margin-top: 34px !important;
  text-align: center !important;
}

.page .account-form-shell .form-submit-row .page-cta-button,
.page .account-form-shell .registration-submit .page-cta-button {
  width: 260px !important;
  max-width: 100% !important;
  min-height: 48px !important;
  margin: 0 auto !important;
  clip-path: none !important;
  border-radius: 3px !important;
  color: #1a140c !important;
  background: linear-gradient(110deg, #e8d0a0 0%, #c4a15f 52%, #9a7340 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 246, 220, .5) !important;
  font-family: "Cinzel", Georgia, serif !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: .06em !important;
}

.page .account-form-shell .form-submit-row .page-cta-button:hover,
.page .account-form-shell .registration-submit .page-cta-button:hover {
  color: #120e09 !important;
  background: linear-gradient(110deg, #f3e0b6, #d0ae6c) !important;
}

/* Texto editorial con el rombo común de Inicio. */
.page .editorial-copy {
  width: min(760px, 100%);
  margin-right: auto !important;
  margin-left: auto !important;
}

.page .editorial-copy > p,
.page .support-panel > p {
  position: relative;
  padding-left: 27px !important;
  text-align: left !important;
}

.page .editorial-copy > p::before,
.page .support-panel > p::before {
  position: absolute;
  top: .72em;
  left: 5px;
  width: 6px;
  height: 6px;
  border: 1px solid #b88a47;
  content: "";
  transform: rotate(45deg);
}

.page .support-panel.section-text {
  width: min(760px, 100%) !important;
  max-width: 760px !important;
  margin: 0 auto 38px !important;
  padding: 0 0 24px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(208, 171, 102, .14) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 10px !important;
  line-height: 1.75 !important;
}

.page .support-panel .editorial-lead {
  text-transform: none !important;
}

/* Información: título principal grande y secciones abiertas con guía dorada. */
.page .information-page {
  max-width: 780px !important;
  padding-top: 0 !important;
}

.page .information-page > h2.titulo-iluminado.page-title {
  margin: 4px auto 30px !important;
  padding: 0 10px !important;
  color: #f0dfbd !important;
  border: 0 !important;
  font-family: "Cinzel", Georgia, serif !important;
  font-size: clamp(34px, 3.5vw, 49px) !important;
  font-weight: 400 !important;
  letter-spacing: -.025em;
  line-height: 1.04 !important;
  text-align: center !important;
  text-shadow:
    0 4px 22px rgba(0, 0, 0, .96),
    0 0 34px rgba(184, 137, 69, .13) !important;
}

.page .information-page > h2.titulo-iluminado:not(.page-title) {
  position: relative;
  margin: 30px 0 11px !important;
  padding: 0 0 10px 25px !important;
  color: #ddc38e !important;
  border-bottom: 1px solid rgba(205, 170, 105, .16) !important;
  font-family: "Cinzel", Georgia, serif !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  letter-spacing: .035em;
  text-align: left !important;
}

.page .information-page > h2.titulo-iluminado:not(.page-title)::before {
  position: absolute;
  top: 7px;
  left: 4px;
  width: 6px;
  height: 6px;
  border: 1px solid #b88a47;
  content: "";
  transform: rotate(45deg);
}

.page .information-page > .section {
  padding-left: 25px !important;
  border-left: 1px solid rgba(203, 164, 93, .10) !important;
}

.page .information-page table.default tr:nth-child(even) td,
.page .information-page table tr:nth-child(even) td {
  background: rgba(17, 16, 18, .56) !important;
}

@media (max-width: 580px) {
  .page .nostalgic-main-banner,
  .page .banner.nostalgic-main-banner {
    height: auto !important;
    aspect-ratio: 1488 / 600 !important;
    margin-bottom: 18px !important;
  }

  .page .nostalgic-main-banner .banner-copy {
    gap: 8px;
    padding: 42px 14px 12px;
  }

  .page .nostalgic-main-banner .banner-copy strong {
    font-size: clamp(22px, 7vw, 30px);
  }

  .page h2.page-title,
  .page .page-title,
  .page .information-page > h2.titulo-iluminado.page-title {
    margin-bottom: 19px !important;
    font-size: 32px !important;
  }

  .page .account-actions {
    grid-template-columns: minmax(0, 1fr);
    width: min(320px, 100%);
  }

  .page .account-form-shell {
    padding-right: 2px !important;
    padding-left: 2px !important;
  }

  .page .account-intro,
  .page .editorial-lead {
    padding-right: 12px !important;
    padding-left: 34px !important;
    font-size: 10px !important;
  }

  .page .information-page > .section {
    padding-left: 14px !important;
  }
}

/* ==========================================================================
   Ajuste fino de columnas, soporte e información
   ========================================================================== */

body .all aside.esq .box:has(+ .sidebar-promo-left) {
  border-bottom: 0 !important;
}

body .all .sidebar-avatar-mark {
  opacity: 1 !important;
  image-rendering: auto;
  filter: drop-shadow(0 9px 15px rgba(0, 0, 0, .34)) !important;
}

body .all .sidebar-chronicle-mark {
  transform: translateX(-7px);
}

body .all .sidebar-vote-emblem {
  transform: translateX(-9px);
}

.page .support-page-banner {
  display: block !important;
  width: 100% !important;
  height: 201px !important;
  margin: 0 auto 14px !important;
  overflow: hidden;
  border: 0 !important;
  border-radius: 0 !important;
  border-bottom: 1px solid rgba(205, 170, 105, .18) !important;
  background: transparent !important;
  box-shadow: none !important;
}

.page .support-page-banner img,
.page img.support-page-banner {
  display: block;
  width: 100% !important;
  height: 201px !important;
  margin: 0 !important;
  object-fit: cover;
  object-position: center;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.page img.support-page-banner + h2.titulo-iluminado {
  max-width: none;
  margin: 18px -18px 20px !important;
  padding: 0 !important;
  color: #d7b97e !important;
  border: 0 !important;
  background: none !important;
  font-family: "Cinzel", Georgia, serif !important;
  font-size: clamp(29px, 2.35vw, 38px) !important;
  font-weight: 400 !important;
  line-height: 1.08 !important;
  letter-spacing: -.025em;
  text-align: center !important;
  text-shadow: 0 2px 16px rgba(0, 0, 0, .70) !important;
  transform: none !important;
}

.page .support-panel {
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #d7d0c5 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-family: "Poppins", Arial, sans-serif !important;
  font-size: 11px !important;
  line-height: 1.75 !important;
}

.page .support-panel h3 {
  margin: 0 0 20px !important;
  padding: 0 0 18px !important;
  color: #ddc596 !important;
  border-bottom: 1px solid rgba(205, 170, 105, .14);
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.65 !important;
  text-align: left !important;
}

.page .support-panel p {
  margin: 0 0 16px !important;
}

.page .support-panel p + p {
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, .045);
}

.page .support-panel a {
  color: #d8b87b !important;
  border-bottom: 1px solid rgba(216, 184, 123, .34);
  font-weight: 600;
}

.page .support-panel a:hover {
  color: #f1d59e !important;
  border-bottom-color: rgba(241, 213, 158, .62);
}

.page .information-page {
  width: 100% !important;
  max-width: 760px !important;
  height: auto !important;
  max-height: none !important;
  padding: 6px 4px 18px !important;
  overflow: visible !important;
  color: #d8d0c4 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.page .information-page > h2.titulo-iluminado {
  margin: 24px 0 12px !important;
  padding: 0 0 10px !important;
  color: #d6bd8b !important;
  border-bottom: 1px solid rgba(205, 170, 105, .16) !important;
  font-family: "Cinzel", Georgia, serif !important;
  font-size: 19px !important;
  font-weight: 600 !important;
  letter-spacing: .02em;
  line-height: 1.35 !important;
  text-align: left !important;
  text-shadow: none !important;
  transform: none !important;
}

.page .information-page > h2.titulo-iluminado:first-child {
  margin-top: 0 !important;
}

.page .information-page > .section {
  margin: 0 0 28px !important;
  padding: 0 0 8px !important;
  border-top: 0 !important;
  border-bottom-color: rgba(255, 255, 255, .045) !important;
  background: transparent !important;
  box-shadow: none !important;
}

@media (max-width: 580px) {
  body .all .sidebar-chronicle-mark,
  body .all .sidebar-vote-emblem {
    transform: none;
  }

  .page img.support-page-banner + h2.titulo-iluminado {
    margin-right: 0 !important;
    margin-left: 0 !important;
    font-size: 28px !important;
  }

  .page .support-panel {
    font-size: 10px !important;
  }
}

/* ==========================================================================
   Pulido final de portada, formularios y páginas informativas
   ========================================================================== */

.page .nostalgic-home-wrap > h2.bayonetta-title.small {
  max-width: none;
  margin: 18px 0 20px !important;
  font-family: "Cinzel", Georgia, serif !important;
  font-size: clamp(26px, 2.1vw, 34px) !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: .01em;
  white-space: normal;
}

body .all a.donateBanner,
body .all a.supportBanner {
  position: relative;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 188px !important;
  max-width: 100%;
  height: 50px !important;
  margin: 4px auto 16px !important;
  overflow: hidden;
  color: #eadcc4 !important;
  border: 1px solid rgba(211, 176, 109, .28) !important;
  border-radius: 5px !important;
  clip-path: none;
  background:
    linear-gradient(90deg, rgba(201, 163, 96, .07), transparent 36%),
    rgba(7, 8, 11, .70) !important;
  box-shadow:
    inset 3px 0 0 rgba(202, 164, 97, .62),
    inset 0 1px 0 rgba(255, 255, 255, .025),
    0 9px 22px rgba(0, 0, 0, .18) !important;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.05px;
  text-transform: uppercase;
  transition: color .18s ease, border-color .18s ease, background .18s ease, transform .18s ease;
}

body .all a.donateBanner::before,
body .all a.supportBanner::before {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: #d7b777;
  border: 1px solid rgba(215, 183, 119, .18);
  border-radius: 50%;
  background: rgba(215, 183, 119, .055);
  font-family: FontAwesome;
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
}

body .all a.donateBanner::before {
  content: "\f05a";
}

body .all a.supportBanner::before {
  content: "\f075";
}

body .all a.donateBanner::after {
  content: "Info aquí";
}

body .all a.supportBanner::after {
  content: "Discord";
}

body .all a.donateBanner > span,
body .all a.supportBanner > span {
  display: none;
}

body .all a.donateBanner:hover,
body .all a.supportBanner:hover {
  color: #fff1d3 !important;
  border-color: rgba(233, 195, 123, .46) !important;
  background:
    linear-gradient(90deg, rgba(201, 163, 96, .13), transparent 46%),
    rgba(12, 12, 15, .88) !important;
  box-shadow:
    inset 3px 0 0 #d4ae6e,
    inset 0 1px 0 rgba(255, 255, 255, .035),
    0 12px 26px rgba(0, 0, 0, .24) !important;
  transform: translateY(-1px) !important;
}

body .all .sidebar-promo img {
  display: block;
  height: auto;
  object-fit: contain;
  opacity: .94;
  filter: drop-shadow(0 8px 13px rgba(0, 0, 0, .45));
}

body .all .sidebar-promo {
  width: 100%;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

body .all .sidebar-promo .title {
  min-height: 34px;
  margin-bottom: 9px !important;
}

body .all .sidebar-promo-assets {
  display: grid;
  grid-template-rows: 164px 98px;
  gap: 12px;
  width: 100%;
  margin-top: 2px;
}

body .all .sidebar-promo-primary,
body .all .sidebar-promo-secondary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
}

body .all .sidebar-promo-primary {
  border-bottom: 1px solid rgba(255, 255, 255, .04);
}

body .all .sidebar-avatar-mark {
  width: 196px;
  max-width: 196px !important;
  margin: 0 auto;
}

body .all .sidebar-vote-emblem {
  width: 148px;
  max-width: 148px !important;
  max-height: 152px;
  margin: 0 auto;
}

body .all .sidebar-chronicle-mark,
body .all .sidebar-game-mark {
  width: 188px;
  max-width: 188px !important;
  max-height: 96px;
  margin: 0 auto;
}

@media (min-width: 881px) {
  body:has(.nostalgic-home-wrap) section > aside {
    display: flex !important;
    flex-direction: column;
    height: 100%;
  }

  body:has(.nostalgic-home-wrap) section > aside .sidebar-promo {
    margin-top: auto !important;
  }
}

.page #reggo.registration-form {
  width: min(640px, 100%);
  margin: 0 auto;
}

.page #reggo .form-group {
  margin-bottom: 18px !important;
}

.page #reggo .form-group > label,
.page .account-form .form-group > label {
  display: block;
  margin-bottom: 8px !important;
  color: #d6b77d;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 12px !important;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.page #reggo .form-group input[type="text"],
.page #reggo .form-group input[type="password"],
.page .account-form .form-group input[type="text"],
.page .account-form .form-group input[type="password"] {
  width: 100%;
  height: 48px !important;
  padding: 0 16px !important;
  color: #f4ecdf !important;
  border: 1px solid rgba(214, 173, 96, .38) !important;
  border-radius: 3px !important;
  background: rgba(8, 9, 12, .88) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
  font-family: "Poppins", Arial, sans-serif !important;
  font-size: 15px !important;
  box-sizing: border-box;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.page #reggo .form-group input:focus {
  border-color: rgba(221, 184, 112, .38) !important;
  border-left-color: #c49a56 !important;
  background: linear-gradient(90deg, rgba(31, 25, 23, .94), rgba(8, 9, 12, .90)) !important;
  box-shadow: 0 0 0 3px rgba(190, 148, 78, .07) !important;
}

.page #reggo .captcha-field {
  margin-top: 28px !important;
  padding: 22px 0 25px;
  border-top: 1px solid rgba(210, 174, 106, .13);
  border-bottom: 1px solid rgba(255, 255, 255, .045);
  text-align: center;
}

.page #reggo .captcha-field > label {
  text-align: center;
}

.page #reggo .captcha-visual {
  justify-content: center !important;
}

.page #reggo .captchaImage {
  display: block;
}

.page #reggo .form-group.captcha-field input[type="text"].captcha-input:focus {
  border-color: rgba(235, 196, 120, .68) !important;
  background:
    linear-gradient(135deg, rgba(43, 33, 29, .38), rgba(8, 10, 14, .20)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .06),
    0 0 0 3px rgba(197, 145, 72, .09),
    0 0 28px rgba(218, 163, 82, .16) !important;
}

.page #reggo .rules-consent label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  color: #e6dccb;
  font-size: 14px;
}

.page #reggo .rules-consent input[type="checkbox"] {
  width: 16px;
  height: 16px;
  margin: 0 !important;
  accent-color: #bd9557;
}

.page .reglas-box ol {
  display: grid;
  gap: 0;
}

.page .reglas-box ol > .page-separator {
  display: none;
}

.page .reglas-box ol > li {
  position: relative;
  margin: 0 !important;
  padding: 15px 10px 15px 29px !important;
  color: #cfc7bb;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, .05);
  line-height: 1.75;
}

.page .reglas-box ol > li::before {
  top: calc(15px + .875em);
  left: 7px;
  width: 7px;
  height: 7px;
  border: 1px solid #c5a66d;
  border-radius: 0;
  background: rgba(197, 166, 109, .06);
  box-shadow: 0 0 10px rgba(197, 166, 109, .12);
  transform: translateY(-50%) rotate(45deg);
}

.page .reglas-box ol > li strong {
  color: #eadcc3;
}

.page .reglas-box > .section {
  margin: 10px 0 34px !important;
  padding: 8px 0 12px !important;
  border: 0 !important;
  border-top: 1px solid rgba(211, 176, 108, .16) !important;
  border-bottom: 1px solid rgba(255, 255, 255, .05) !important;
  background: linear-gradient(180deg, rgba(10, 10, 13, .22), transparent) !important;
}

body .page .reglas-box > .section table {
  width: 100% !important;
  margin: 0 !important;
  border-spacing: 0 6px !important;
}

body .page .reglas-box > .section table tr:first-child th {
  padding: 12px 14px !important;
  background: linear-gradient(90deg, rgba(25, 21, 20, .90), rgba(8, 9, 12, .90)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .02);
}

body .page .reglas-box > .section table tr:not(:first-child) td {
  padding: 11px 14px !important;
  background: linear-gradient(90deg, rgba(17, 15, 17, .82), rgba(7, 8, 11, .74)) !important;
}

body .page .reglas-box > .section table tr:not(:first-child) td:first-child {
  width: 46%;
  color: #d4c09a !important;
  border-left-color: rgba(202, 163, 92, .36) !important;
  font-weight: 600;
}

body .page .reglas-box > .section table tr:not(:first-child) td:last-child {
  color: #d8d0c4 !important;
}

body .page .reglas-box > .section table tr:not(:first-child):hover td {
  background: linear-gradient(90deg, rgba(54, 41, 30, .88), rgba(15, 14, 17, .82)) !important;
}

@media (max-width: 580px) {
  .page .nostalgic-home-wrap > h2.bayonetta-title.small {
    margin-right: 0 !important;
    margin-left: 0 !important;
    font-size: 25px !important;
    white-space: normal;
  }

  body .all .sidebar-chronicle-mark,
  body .all .sidebar-game-mark {
    width: 180px;
    max-width: 180px !important;
  }

  body .all .sidebar-vote-emblem {
    width: 132px;
    max-width: 132px !important;
  }

  body .all .sidebar-avatar-mark {
    width: 188px;
    max-width: 188px !important;
  }
}

/*
 * Acerca el mensaje principal al logotipo en escritorio.
 * La escena de fondo conserva su encuadre y el contenido inferior no se mueve.
 */
@media (min-width: 881px) {
  .site-hero {
    min-height: 620px;
  }

  .hero-copy {
    position: absolute;
    top: 370px;
    left: 50%;
    width: min(900px, calc(100% - 48px));
    transform: translateX(-50%);
  }
}

.site-hero::before {
  display: none !important;
  content: none !important;
}

@media (max-width: 880px) {
  body {
    background:
      radial-gradient(ellipse at 50% 28%, rgba(3, 4, 7, .28), rgba(2, 3, 5, .68) 76%) center / cover fixed no-repeat,
      linear-gradient(180deg, rgba(3, 4, 7, .38), rgba(2, 3, 5, .74)) center / cover fixed no-repeat,
      url("../../imgs/bg-top.jpg") center top / auto 118vh fixed no-repeat !important;
  }
}

@media (max-width: 580px) {
  .site-hero {
    background: transparent !important;
  }
}

/* ==========================================================================
   Tablas editoriales: rankings, héroes, jefes e información
   ========================================================================== */

body .page table.default,
body .page .reglas-box table {
  width: 100% !important;
  margin: 16px 0 28px !important;
  overflow: visible !important;
  border: 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 7px !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  table-layout: auto;
}

body .page table.default tr:first-child th,
body .page .reglas-box table tr:first-child th {
  height: auto !important;
  padding: 12px 13px !important;
  color: #d9c39a !important;
  border: 0 !important;
  border-top: 1px solid rgba(210, 174, 106, .20) !important;
  border-bottom: 1px solid rgba(210, 174, 106, .16) !important;
  background: rgba(10, 10, 13, .84) !important;
  font-family: "Poppins", Arial, sans-serif !important;
  font-size: 8px !important;
  font-weight: 700 !important;
  letter-spacing: 1px;
  line-height: 1.35;
  text-align: left;
  text-transform: uppercase;
}

body .page table.default tr:first-child th:first-child,
body .page .reglas-box table tr:first-child th:first-child {
  border-left: 2px solid rgba(190, 150, 83, .52) !important;
}

body .page table.default tr:first-child th:last-child,
body .page .reglas-box table tr:first-child th:last-child {
  border-right: 1px solid rgba(210, 174, 106, .12) !important;
}

body .page table.default tr:not(:first-child) td,
body .page table.default tr.two:not(:first-child) td,
body .page .reglas-box table tr:not(:first-child) td {
  height: auto !important;
  padding: 11px 13px !important;
  color: #cfc6ba !important;
  border: 0 !important;
  border-top: 1px solid rgba(255, 255, 255, .045) !important;
  border-bottom: 1px solid rgba(255, 255, 255, .045) !important;
  background: rgba(7, 8, 11, .80) !important;
  font-size: 10px !important;
  line-height: 1.45;
  text-align: left;
  transition: color .18s ease, background .18s ease, border-color .18s ease;
}

body .page table.default tr:not(:first-child) td:first-child,
body .page .reglas-box table tr:not(:first-child) td:first-child {
  border-left: 2px solid rgba(190, 150, 83, .14) !important;
}

body .page table.default tr:not(:first-child) td:last-child,
body .page .reglas-box table tr:not(:first-child) td:last-child {
  border-right: 1px solid rgba(255, 255, 255, .04) !important;
}

body .page table.default tr:nth-child(2) td,
body .page .reglas-box table tr:nth-child(2) td {
  background: linear-gradient(90deg, rgba(184, 142, 74, .075), rgba(7, 8, 11, .80) 42%) !important;
}

body .page table.default tr:nth-child(2) td:first-child,
body .page .reglas-box table tr:nth-child(2) td:first-child {
  border-left-color: rgba(211, 174, 105, .58) !important;
}

body .page table.default tr:not(:first-child):hover td,
body .page .reglas-box table tr:not(:first-child):hover td {
  color: #eee0c9 !important;
  border-top-color: rgba(210, 174, 106, .15) !important;
  border-bottom-color: rgba(210, 174, 106, .15) !important;
  background: rgba(49, 39, 29, .86) !important;
}

body .page table.default td.foco {
  color: #d9bd88 !important;
  font-weight: 600;
}

body .page table.default td img {
  margin-right: 6px;
  vertical-align: middle;
}

body .page .reglas-box .section {
  padding: 2px 0 8px !important;
  border: 0 !important;
  background: transparent !important;
}

@media (max-width: 580px) {
  body .page table.default tr:first-child th,
  body .page .reglas-box table tr:first-child th {
    padding: 10px 7px !important;
    font-size: 7px !important;
    letter-spacing: .55px;
  }

  body .page table.default tr:not(:first-child) td,
  body .page table.default tr.two:not(:first-child) td,
  body .page .reglas-box table tr:not(:first-child) td {
    padding: 9px 7px !important;
    font-size: 8px !important;
  }
}

/* ==========================================================================
   Fondo original de L2 Nostalgic
   Conserva la escala, el encuadre y el desplazamiento de la web de origen.
   ========================================================================== */

body {
  background-color: #000 !important;
  background-image: url("../../imgs/bg-top.jpg") !important;
  background-repeat: no-repeat !important;
  background-position: left 55% top -70px !important;
  background-size: auto !important;
  background-attachment: scroll !important;
}

.site-hero {
  background: transparent !important;
}

/* Carrusel de destacados: ocupa la columna central y deja ver la foto. */
body .all article:has(.nostalgic-home-wrap) {
  width: 100% !important;
  max-width: none !important;
  float: none;
  padding-right: 0 !important;
  padding-left: 0 !important;
}

.hero-copy p {
  max-width: 680px;
  font-size: 14px !important;
  line-height: 1.55;
}

.home-spotlight-label {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin: 0 0 10px;
}

.home-spotlight-label span {
  color: #d6b77d;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.home-spotlight-label strong {
  color: #f0dfbd;
  font-family: "Cinzel", Georgia, serif;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: .02em;
}

.home-pillars {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 26px;
}

.home-pillars article {
  width: auto !important;
  float: none;
  padding: 16px 14px 15px;
  border: 1px solid rgba(214, 173, 96, .16);
  border-top: 2px solid rgba(214, 173, 96, .55);
  border-radius: 2px;
  background: linear-gradient(180deg, rgba(22, 18, 14, .72), rgba(8, 9, 12, .42));
}

.home-pillars small {
  display: block;
  color: #c9a56a;
  font-family: "Poppins", Arial, sans-serif;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.home-pillars strong {
  display: block;
  margin: 8px 0 8px;
  color: #f4e6c8;
  font-family: "Cinzel", Georgia, serif;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: .01em;
  line-height: 1.25;
}

.home-pillars p {
  margin: 0;
  color: rgba(238, 231, 220, .8);
  font-family: "Poppins", Arial, sans-serif;
  font-size: 12px;
  line-height: 1.45;
}

.panel-reminder-copy p {
  font-size: 13px;
  line-height: 1.6;
}

@media (max-width: 880px) {
  .home-pillars {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 580px) {
  .home-spotlight-label {
    flex-direction: column;
    gap: 2px;
  }

  .home-pillars {
    grid-template-columns: 1fr;
  }
}

/* Información: tablas abiertas, sin el recuadro con scroll. */
body .page .information-page table,
body .page .information-page table.default {
  margin: 4px 0 10px !important;
  border-spacing: 0 !important;
}

body .page .information-page table tr:first-child th {
  padding: 0 14px 10px !important;
  color: #c9a56a !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(214, 173, 96, .4) !important;
  background: transparent !important;
  font-family: "Cinzel", Georgia, serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .04em;
  text-transform: none;
}

body .page .information-page table tr:not(:first-child) td {
  padding: 12px 14px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, .06) !important;
  background: transparent !important;
  font-size: 14px !important;
  line-height: 1.5;
}

body .page .information-page table tr:not(:first-child) td:first-child {
  width: 34%;
  color: #f0dfbd !important;
  border-left: 0 !important;
  font-weight: 600;
}

body .page .information-page table tr:nth-child(2) td,
body .page .information-page table tr:nth-child(even) td {
  background: rgba(255, 255, 255, .025) !important;
}

body .page .information-page table tr:not(:first-child):hover td {
  background: rgba(214, 173, 96, .08) !important;
}