/* La Aventura del Saber · Cambio 2. Botón X único, imagen aprobada en Configuración.
   Reglas limitadas a cerrar/navegar; nunca modifican los contenidos ni el motor. */

/* Los elementos ya tienen sus manejadores originales. Solo se cambia la forma.
   El enlace a Configuración tiene su X propia y no se altera. */
#pantallaPerfiles #botonCerrarSeleccionV2,
#pantallaBienvenida #botonCerrarBienvenidaV2,
#pantallaMapa #botonVolverMenu,
#pantallaPregunta #botonVolverMapa,
#pantallaNivelCompletado #botonRegresarMapaVictoria,
#pantallaRecompensas #botonVolverTienda,
#pantallaPerfilJugador #botonVolverPerfil,
#pantallaAvatarStudio #botonCerrarAvatarStudio:not(.oculto),
#pantallaTiendaAvatar #botonVolverTiendaAvatar:is(button),
#pantallaViaje .viajeCabecera > button.viajeSecundario {
  position: fixed !important;
  inset: auto max(24px, env(safe-area-inset-right)) auto auto !important;
  top: max(22px, env(safe-area-inset-top)) !important;
  right: max(24px, env(safe-area-inset-right)) !important;
  left: auto !important;
  bottom: auto !important;
  display: block !important;
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  min-height: 58px !important;
  max-width: 58px !important;
  max-height: 58px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent url("imagenes/interfaz/config-v39/cerrar.png") center / contain no-repeat !important;
  box-shadow: none !important;
  text-shadow: none !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  filter: none !important;
  z-index: 980 !important;
  cursor: pointer !important;
  transition: transform 0.15s ease, filter 0.15s ease !important;
}
#pantallaMenu #botonCerrarMenuV2:hover,
#pantallaPerfiles #botonCerrarSeleccionV2:hover,
#pantallaBienvenida #botonCerrarBienvenidaV2:hover,
#pantallaMapa #botonVolverMenu:hover,
#pantallaPregunta #botonVolverMapa:hover,
#pantallaNivelCompletado #botonRegresarMapaVictoria:hover,
#pantallaRecompensas #botonVolverTienda:hover,
#pantallaPerfilJugador #botonVolverPerfil:hover,
#pantallaAvatarStudio #botonCerrarAvatarStudio:hover,
#pantallaTiendaAvatar #botonVolverTiendaAvatar:is(button):hover,
#pantallaViaje .viajeCabecera > button.viajeSecundario:hover {
  transform: scale(1.065) !important;
  filter: brightness(1.08) !important;
  box-shadow: none !important;
}
#pantallaMenu #botonCerrarMenuV2:focus-visible,
#pantallaPerfiles #botonCerrarSeleccionV2:focus-visible,
#pantallaBienvenida #botonCerrarBienvenidaV2:focus-visible,
#pantallaMapa #botonVolverMenu:focus-visible,
#pantallaPregunta #botonVolverMapa:focus-visible,
#pantallaNivelCompletado #botonRegresarMapaVictoria:focus-visible,
#pantallaRecompensas #botonVolverTienda:focus-visible,
#pantallaPerfilJugador #botonVolverPerfil:focus-visible,
#pantallaAvatarStudio #botonCerrarAvatarStudio:focus-visible,
#pantallaTiendaAvatar #botonVolverTiendaAvatar:is(button):focus-visible,
#pantallaViaje .viajeCabecera > button.viajeSecundario:focus-visible {
  outline: 3px solid #6450c8 !important;
  outline-offset: 2px !important;
}
/* Botón anterior al pie del carnet: retirado visualmente sin retirar el nodo que
   utiliza el manejador original para no romper la navegación. */
#pantallaPerfilJugador #botonCerrarPerfil {display:none !important;}

/* La cabecera de pregunta deja libre la celda del retorno, ahora flotante.
   Las monedas permanecen visibles a su derecha, sin ocultarse tras la X. */
#pantallaPregunta .cabeceraPregunta {
  grid-template-columns: minmax(0,1fr) auto !important;
  padding-right: 64px !important;
  box-sizing: border-box !important;
}
#pantallaPregunta .cabeceraPregunta .datosPregunta {grid-column:1 !important;}
#pantallaPregunta .cabeceraPregunta .monedasPregunta {grid-column:2 !important;}

@media (max-width:720px) {
    #pantallaPerfiles #botonCerrarSeleccionV2,
  #pantallaBienvenida #botonCerrarBienvenidaV2,
  #pantallaMapa #botonVolverMenu,
  #pantallaPregunta #botonVolverMapa,
  #pantallaNivelCompletado #botonRegresarMapaVictoria,
  #pantallaRecompensas #botonVolverTienda,
  #pantallaPerfilJugador #botonVolverPerfil,
  #pantallaAvatarStudio #botonCerrarAvatarStudio:not(.oculto),
  #pantallaTiendaAvatar #botonVolverTiendaAvatar:is(button),
  #pantallaViaje .viajeCabecera > button.viajeSecundario {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
    max-width: 46px !important;
    max-height: 46px !important;
    top: max(16px, env(safe-area-inset-top)) !important;
    right: max(16px, env(safe-area-inset-right)) !important;
  }
  #pantallaPregunta .cabeceraPregunta {padding-right:48px !important;}
}

/* Cambio 2 · V2 corregida. Selección y bienvenida conservan toda su
   estructura y lógica, pero estas X no se muestran por ser innecesarias. */
#pantallaPerfiles #botonCerrarSeleccionV2,
#pantallaBienvenida #botonCerrarBienvenidaV2 { display: none !important; }

/* Cambio 2 V5 · Tienda: una sola imagen sin capas residuales.
   Se recupera el crecimiento al pasar el cursor sin desplazar el botón. */
#pantallaTiendaAvatar #botonVolverTiendaAvatar:is(button):is(:hover, :focus, :focus-visible, :active, :not(:hover)) {
  position: fixed !important;
  inset: auto !important;
  top: max(22px, env(safe-area-inset-top)) !important;
  right: max(24px, env(safe-area-inset-right)) !important;
  bottom: auto !important;
  left: auto !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  min-height: 58px !important;
  max-width: 58px !important;
  max-height: 58px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent url("imagenes/interfaz/config-v39/cerrar.png") center / contain no-repeat !important;
  box-shadow: none !important;
  filter: none !important;
  transform: scale(1) !important;
  animation: none !important;
  transition: transform .18s ease, filter .18s ease !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  text-indent: -9999px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  z-index: 980 !important;
}
#pantallaTiendaAvatar #botonVolverTiendaAvatar:is(button):hover:not(:active) {
  transform: scale(1.075) !important;
  filter: brightness(1.07) !important;
}
#pantallaTiendaAvatar #botonVolverTiendaAvatar:is(button):active {
  transform: scale(.97) !important;
}
#pantallaTiendaAvatar #botonVolverTiendaAvatar::before,
#pantallaTiendaAvatar #botonVolverTiendaAvatar::after,
#pantallaTiendaAvatar #botonVolverTiendaAvatar > * {
  content: none !important;
  display: none !important;
}
@media (max-width:720px) {
  #pantallaTiendaAvatar #botonVolverTiendaAvatar:is(button):is(:hover, :focus, :focus-visible, :active, :not(:hover)) {
    top: max(16px, env(safe-area-inset-top)) !important;
    right: max(16px, env(safe-area-inset-right)) !important;
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
    max-width: 46px !important;
    max-height: 46px !important;
  }
}