/* LA AVENTURA DEL SABER — PORTADA BOSQUE INTERACTIVA
   Sólo afecta a #pantallaInicio. El resto de las pantallas permanece intacto.
   Los controles conservan sus IDs y sus eventos del juego original. */
#pantallaInicio.inicioEstable1.inicioBosqueFinal {
  position: relative !important;
  isolation: isolate;
  width: 100% !important;
  height: 100vh !important;
  height: 100dvh !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  display: block !important;
  background: #418eaa !important;
  background-image: none !important;
  animation: none !important;
}
#pantallaInicio.inicioBosqueFinal::before,
#pantallaInicio.inicioBosqueFinal::after {
  display: none !important;
  content: none !important;
  animation: none !important;
}
#pantallaInicio.inicioBosqueFinal .inicioBosque__paisaje {
  position: absolute;
  z-index: 0;
  inset: 0;
  pointer-events: none;
  background-image: url('imagenes/inicio-bosque/bosque.webp');
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  transform: scale(1.018);
  transform-origin: center;
  animation: ibPaisaje 22s ease-in-out infinite alternate;
}
#pantallaInicio.inicioBosqueFinal .inicioBosque__brillos {
  position: absolute; z-index: 1; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse at 74% 17%,rgba(255,243,153,.15),transparent 37%),
              radial-gradient(ellipse at 28% 47%,rgba(255,218,75,.065),transparent 32%);
  animation: ibBrillo 8s ease-in-out infinite alternate;
}
#pantallaInicio.inicioBosqueFinal > img {
  position: absolute;
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
  max-width: none;
  height: auto;
  margin: 0;
  border: 0;
}
#pantallaInicio.inicioBosqueFinal .inicioBosque__logo {
  z-index: 5;
  width: min(72vw, 1110px);
  height: min(52vh,480px);
  max-height: 52vh;
  object-fit: fill;
  left: 50%; top: 14.0%;
  transform: translateX(-50%);
  filter: drop-shadow(0 7px 11px rgba(51,23,7,.4));
  animation: ibLogo 6.5s ease-in-out infinite;
}
#pantallaInicio.inicioBosqueFinal .inicioBosque__creditos {
  z-index: 8;
  left: .4%; top: 1.2%;
  width: min(37vw, 610px);
  height: auto;
  max-height: 12.8vh;
  object-fit: contain;
  filter: drop-shadow(0 3px 6px rgba(42,21,5,.34));
}
#pantallaInicio.inicioBosqueFinal .inicioBosque__floresInicio {
  z-index: 3;
  width: min(27vw,440px);
  left: -5.7%; bottom: -12%;
  transform-origin: left bottom;
  will-change: transform;
  animation: ibPlantasIzq 7.8s ease-in-out infinite alternate;
}
#pantallaInicio.inicioBosqueFinal .inicioBosque__floresFin {
  z-index: 3;
  width: min(28vw,460px);
  right: -8%; bottom: -13%;
  transform-origin: right bottom;
  will-change: transform;
  animation: ibPlantasDer 8.9s -3.3s ease-in-out infinite alternate-reverse;
}
#pantallaInicio.inicioBosqueFinal .inicioBosque__hojasAltas {
  z-index: 2; width: min(22vw,330px);
  top: -14%; right: -6%; opacity: .78;
  transform-origin: top center;
  animation: ibRamas 11s ease-in-out infinite alternate;
}
#pantallaInicio.inicioBosqueFinal .inicioBosque__ramita {
  z-index: 2; width: min(16vw,250px);
  left: -7%; top: 18%; opacity: .46;
  transform-origin: left center;
  animation: ibRamas 13s -4s ease-in-out infinite alternate-reverse;
}
#pantallaInicio.inicioBosqueFinal .inicioAccionesEstable1,
#pantallaInicio.inicioBosqueFinal .inicioAccionesV1 {
  position: absolute !important;
  z-index: 15 !important;
  bottom: 5.0% !important;
  left: 33.5% !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: clamp(6px,1.1vw,20px) !important;
  transform: none !important;
  pointer-events: auto !important;
}
#pantallaInicio.inicioBosqueFinal #botonComenzar,
#pantallaInicio.inicioBosqueFinal #botonConfiguracionInicioV1 {
  appearance: none !important;
  -webkit-appearance: none !important;
  position: relative !important;
  flex: 0 0 auto !important;
  display: block !important;
  box-sizing: border-box !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  min-height: 0 !important;
  min-width: 0 !important;
  max-width: none !important;
  max-height: none !important;
  background-color: transparent !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
  background-position: center !important;
  box-shadow: none !important;
  outline-offset: -6px !important;
  color: transparent !important;
  font-size: 0 !important;
  text-shadow: none !important;
  line-height: 0 !important;
  letter-spacing: 0 !important;
  cursor: pointer !important;
  filter: drop-shadow(0 7px 8px rgba(32,13,6,.45)) !important;
  transform: translateY(0) scale(1) !important;
  animation: none !important;
  transition: transform .22s ease,filter .22s ease !important;
}
#pantallaInicio.inicioBosqueFinal #botonComenzar {
  width: min(34.5vw,565px) !important;
  height: min(13.1vw,200px) !important;
  background-image: url('imagenes/inicio-bosque/comenzar.webp') !important;
}
#pantallaInicio.inicioBosqueFinal #botonConfiguracionInicioV1 {
  width: min(10.1vw,155px) !important;
  height: min(10.1vw,155px) !important;
  background-image: url('imagenes/inicio-bosque/configurar.webp') !important;
}
#pantallaInicio.inicioBosqueFinal #botonComenzar:hover,
#pantallaInicio.inicioBosqueFinal #botonConfiguracionInicioV1:hover {
  transform: translateY(-5px) scale(1.065) !important;
  filter: drop-shadow(0 10px 14px rgba(31,8,47,.62)) brightness(1.08) !important;
}
#pantallaInicio.inicioBosqueFinal #botonComenzar:active,
#pantallaInicio.inicioBosqueFinal #botonConfiguracionInicioV1:active {
  transform: translateY(2px) scale(.98) !important;
  filter: drop-shadow(0 3px 4px rgba(42,18,4,.55)) !important;
}
#pantallaInicio.inicioBosqueFinal #botonComenzar:focus-visible,
#pantallaInicio.inicioBosqueFinal #botonConfiguracionInicioV1:focus-visible {
  outline: 3px solid #fff5bc !important;
  outline-offset: 2px !important;
  border-radius: 30px !important;
}
#pantallaInicio.inicioBosqueFinal .inicioBosque__hojitas {
  position: absolute; inset: 0; pointer-events: none; z-index: 4; overflow: hidden;
}
#pantallaInicio.inicioBosqueFinal .inicioBosque__hojita {
  position: absolute;
  display: block;
  width: 18px;
  height: 30px;
  background: linear-gradient(125deg,#fffab2 6%,#ffca2c 52%,#e98a0a 100%);
  border: 1px solid rgba(255,247,163,.8);
  border-radius: 80% 5% 80% 5%;
  box-shadow: 0 0 13px rgba(255,206,52,.68);
  opacity: .0;
  will-change: transform, opacity;
}
#pantallaInicio.inicioBosqueFinal .inicioBosque__hojita--uno   {left: 18%; top: 23%; animation: ibHoja 11.5s -1.8s linear infinite;}
#pantallaInicio.inicioBosqueFinal .inicioBosque__hojita--dos   {left: 79%; top: 30%; animation: ibHoja 13.8s -6.4s linear infinite;}
#pantallaInicio.inicioBosqueFinal .inicioBosque__hojita--tres  {left: 56%; top: 10%; animation: ibHoja 16.6s -10.5s linear infinite;}
#pantallaInicio.inicioBosqueFinal .inicioBosque__hojita--cuatro{left: 8%;  top: 14%; animation: ibHoja 14.2s -4.2s linear infinite; transform: scale(1.18);}
#pantallaInicio.inicioBosqueFinal .inicioBosque__hojita--cinco {left: 67%; top: 18%; animation: ibHoja 12.9s -8.1s linear infinite; transform: scale(1.08);}
#pantallaInicio.inicioBosqueFinal .inicioBosque__hojita--seis  {left: 87%; top: 12%; animation: ibHoja 17.4s -11.6s linear infinite; transform: scale(1.28);}
#pantallaInicio.inicioBosqueFinal .inicioBosque__hojita--siete {left: 37%; top: 19%; animation: ibHoja 15.1s -2.6s linear infinite; transform: scale(.95);}
@keyframes ibPaisaje { from { transform:scale(1.018) translate3d(0,0,0) } to { transform:scale(1.038) translate3d(-.14%,-.16%,0) } }
@keyframes ibBrillo {from{opacity:.58}to{opacity:1}}
@keyframes ibLogo {0%,100%{transform:translate3d(-50%,0,0)}50%{transform:translate3d(-50%,-5px,0)}}
@keyframes ibRamas {from{transform:rotate(-1.6deg)}to{transform:rotate(2deg)}}
@keyframes ibPlantasIzq {
  0% {transform: translate3d(0,0,0) rotate(-1.4deg) scale(1);}
  50% {transform: translate3d(-3px,-6px,0) rotate(.9deg) scale(1.01);}
  100% {transform: translate3d(2px,-2px,0) rotate(2.3deg) scale(1.015);}
}
@keyframes ibPlantasDer {
  0% {transform: translate3d(0,0,0) rotate(1.2deg) scale(1);}
  50% {transform: translate3d(4px,-5px,0) rotate(-1deg) scale(1.012);}
  100% {transform: translate3d(-2px,-1px,0) rotate(-2.4deg) scale(1.018);}
}
@keyframes ibHoja {
  0% {opacity:0; transform: translate3d(0,-14px,0) rotate(-24deg);}
  10% {opacity:.96;}
  40% {opacity:.95;}
  78% {opacity:.72;}
  100% {opacity:0; transform: translate3d(150px,320px,0) rotate(235deg);}
}
html[data-aventura-animaciones="reducidas"] #pantallaInicio.inicioBosqueFinal .inicioBosque__paisaje,
html[data-aventura-animaciones="reducidas"] #pantallaInicio.inicioBosqueFinal .inicioBosque__brillos,
html[data-aventura-animaciones="reducidas"] #pantallaInicio.inicioBosqueFinal .inicioBosque__logo,
html[data-aventura-animaciones="reducidas"] #pantallaInicio.inicioBosqueFinal .inicioBosque__floresInicio,
html[data-aventura-animaciones="reducidas"] #pantallaInicio.inicioBosqueFinal .inicioBosque__floresFin,
html[data-aventura-animaciones="reducidas"] #pantallaInicio.inicioBosqueFinal .inicioBosque__hojasAltas,
html[data-aventura-animaciones="reducidas"] #pantallaInicio.inicioBosqueFinal .inicioBosque__ramita,
html[data-aventura-animaciones="reducidas"] #pantallaInicio.inicioBosqueFinal .inicioBosque__hojita,
body.configuracionJuegoAbiertaV7 #pantallaInicio.inicioBosqueFinal .inicioBosque__paisaje,
body.configuracionJuegoAbiertaV7 #pantallaInicio.inicioBosqueFinal .inicioBosque__hojita,
body.configuracionJuegoAbiertaV7 #pantallaInicio.inicioBosqueFinal .inicioBosque__logo {
  animation-play-state: paused !important;
}
@media (orientation: portrait) {
  #pantallaInicio.inicioBosqueFinal .inicioBosque__paisaje {background-position:50% 50%}
  #pantallaInicio.inicioBosqueFinal .inicioBosque__creditos{width: 64vw; height: auto; top: 2.2%; left: 1%; max-height:none;}
  #pantallaInicio.inicioBosqueFinal .inicioBosque__logo{width: 94vw; height:auto; top: 28%;max-height:none;object-fit:contain}
  #pantallaInicio.inicioBosqueFinal .inicioBosque__floresInicio{width:49vw;bottom:-6%}
  #pantallaInicio.inicioBosqueFinal .inicioBosque__floresFin{width:46vw;bottom:-4%}
  #pantallaInicio.inicioBosqueFinal .inicioAccionesEstable1{left: 8% !important;bottom:17% !important; gap:2vw!important}
  #pantallaInicio.inicioBosqueFinal #botonComenzar{width:68vw!important;height:23vw!important}
  #pantallaInicio.inicioBosqueFinal #botonConfiguracionInicioV1{width:17vw!important;height:17vw!important}
}
@media (max-height:480px) and (orientation:landscape) {
  #pantallaInicio.inicioBosqueFinal .inicioBosque__logo{top:9%;width:min(65vw,870px)}
  #pantallaInicio.inicioBosqueFinal .inicioAccionesEstable1{bottom:2%!important}
}

/* No ejecutar el fondo global antiguo por detrás de la nueva portada. */
body:has(#pantallaInicio.inicioBosqueFinal:not(.oculto)) #fondoGlobalJuego {
  visibility: hidden !important;
  opacity: 0 !important;
}
body:has(#pantallaInicio.inicioBosqueFinal:not(.oculto)) #fondoGlobalJuego .fgCapa {
  animation-play-state: paused !important;
}

/* REPARACIÓN DE TRANSICIÓN: la regla display:block de la portada nunca
   debe imponerse al estado oculto asignado por mostrarPantalla(). */
#pantallaInicio.inicioBosqueFinal.oculto {
  display: none !important;
  content-visibility: hidden !important;
}
/* La portada ocupa una única pantalla y no produce desplazamiento. */
body:has(> #pantallaInicio.inicioBosqueFinal:not(.oculto)) {
  height: 100vh;
  height: 100dvh;
  min-height: 0;
  overflow: hidden;
}
/* Conservar los botones nuevos, sin iconos antiguos superpuestos. */
#pantallaInicio.inicioBosqueFinal :is(#botonComenzar,#botonConfiguracionInicioV1) > :is(img,span) {
  display: none !important;
}
