/* Estabilidad del primer pintado de Inicio.
   Mantiene la geometría visible desde el primer instante y evita que las
   imágenes críticas aparezcan por separado durante una recarga completa. */

/* Estas zonas existen vacías en el HTML hasta que sus módulos cargan datos.
   Reservar su altura natural impide que el carrusel cambie de posición al
   montarlas sin alterar la geometría final ya aprobada. */
#socialLinks{min-height:34px}
#quickLinks{min-height:130px}

/* El marco permanece visible; solo la imagen espera a estar decodificada. */
html.home-media-booting #profileAvatar,
html.home-media-booting #quickLinks .orb-image img,
html.home-media-booting #slideImage{
  opacity:0!important;
}

/* card-art puede preparar el fondo derivado antes de que cargue la imagen.
   Durante el arranque lo mantenemos oculto para que fondo e imagen aparezcan
   juntos y no existan dos pintados distintos del mismo slide. */
html.home-media-booting #slideVisual.art-frame::before,
html.home-media-booting #slideVisual.art-frame::after{
  opacity:0!important;
}

/* Si una imagen concreta todavía no terminó al salir del lote de seguridad,
   conserva su marco sin enseñar un bitmap incompleto. */
.home-critical-image:not(.is-media-ready){opacity:0!important}
.home-critical-image.is-media-ready{opacity:1}

@media(max-width:650px){
  #socialLinks{min-height:32px}
  #quickLinks{min-height:130px}
}

@media(max-width:390px){
  #quickLinks{min-height:126px}
}
