/* Inicio de sesión: contenido de la pantalla del dispositivo (LOGIN-PREMIUM-04, agente 1, 18 de octubre de 2026).
   El marco, su tamaño y su transformación son de login-showcase.css (agente 2); aquí solo la imagen.

   La captura es auténtica, de la clínica de demostración (agenda «Día por doctor», 1 de septiembre de 2026, mañana),
   tomada en una ventana de 1440 × 900 y recortada a la esquina superior izquierda: 980 × 530 px de interfaz (menú,
   encabezado «Agenda» y tres columnas de doctores). Antes se mostraba la ventana entera (1440 px de interfaz) y la
   letra quedaba en ~5–7 px; con este encuadre queda ~1,5 veces más grande. Dos archivos PNG (sin artefactos de JPEG):
   clior-agenda-2x.png (1960 × 1060, densidad 2) y clior-agenda-1x.png (1225 × 663, densidad 1,25); el navegador elige
   por srcset/sizes, así siempre hay al menos un píxel de imagen por píxel de pantalla.

   Sin filtros, sombras de texto ni image-rendering especial: el valor por omisión es el remuestreo suave que mejor
   reduce una captura. object-fit: cover con el origen arriba a la izquierda: si el marco cambia de proporción, se
   recorta por abajo y por la derecha (nunca se deforma ni pierde el menú). */

.lgn-screen {
  /* Misma proporción que la captura: el alto de la pantalla no depende de que la imagen haya cargado. */
  aspect-ratio: 1960 / 1060;
}

.lgn-device .lgn-shot {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left top;
  image-rendering: auto;
}