/* --- AMBIENTE CYBER-GYM --- */

/* Contenedor principal del fondo */
.gym-container {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, #111827 0%, #1f2937 100%);
    overflow: hidden;
}

/* Suelo de Gimnasio (Goma con textura antideslizante) */
.gym-floor {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 45%;
    background-color: #111;
    background-image: 
        radial-gradient(#333 1px, transparent 1px), 
        linear-gradient(rgba(0,0,0,0.5) 0%, rgba(31,41,55,1) 100%);
    background-size: 20px 20px, 100% 100%;
    border-top: 4px solid #374151;
    box-shadow: inset 0 20px 40px rgba(0,0,0,0.8);
}

/* Columnas de Neón (Luces de entrenamiento) */
.neon-pillar {
    position: absolute;
    width: 8px;
    height: 100%;
    background: rgba(56, 189, 248, 0.3);
    box-shadow: 0 0 20px rgba(56, 189, 248, 0.5);
    animation: flicker 4s infinite alternate;
}

/* Animación de parpadeo sutil para las luces */
@keyframes flicker {
    0%, 90% { opacity: 1; }
    92% { opacity: 0.4; }
    94% { opacity: 0.8; }
    96% { opacity: 0.2; }
    100% { opacity: 1; }
}

/* Bruma de vapor/esfuerzo en el ambiente */
.gym-mist {
    position: absolute;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at 50% 100%, rgba(56,189,248,0.1), transparent 70%);
    pointer-events: none;
}

/* Estilo para que el hámster se vea nítido (Pixel Art) */
.pixel-hamster {
    image-rendering: pixelated;
    filter: drop-shadow(0 0 10px rgba(245,158,11,0.4)); /* Brillo de fuerza (STR) */
    transition: transform 0.2s ease;
}
/* --- BANNER DE REFERIDOS (ROLLERCOIN) --- */

.rollercoin-banner-container {
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 25px 0; /* Espaciado generoso para que no agobie */
    padding: 0 15px;
    z-index: 10; /* Asegura que esté por encima del fondo */
    position: relative;
}

.rc-banner {
    max-width: 100%;
    height: auto;
    border-radius: 12px; /* Bordes redondeados estilo moderno */
    border: 1px solid rgba(56, 189, 248, 0.3); /* Borde neón sutil a juego con el gimnasio */
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.5), 0 0 10px rgba(56, 189, 248, 0.2);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Efecto al pasar el ratón para invitar al clic */
.rc-banner:hover {
    transform: scale(1.01);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.6), 0 0 15px rgba(56, 189, 248, 0.4);
}