/* Alineación por las cuatro comisuras de los ojos. Solo escala uniforme, giro y posición.
   Las dos capas comparten coordenadas y recorte; el deslizador no cambia el encuadre.
   Los archivos originales no se modifican. */

.escena__panel .comparador .capa > img {
  inset: auto;
  left: calc(50cqw + var(--alinear-x) * var(--alinear-u));
  top: calc(50cqh + var(--alinear-y) * var(--alinear-u));
  width: calc(var(--alinear-w) * var(--alinear-u));
  height: calc(var(--alinear-h) * var(--alinear-u));
  max-width: none;
  object-fit: fill;
  transform-origin: 0 0;
  transform: rotate(var(--alinear-giro));
  transition: none;
}

.escena__panel[data-panel="total-look"] .comparador { --alinear-u: max(0.133333333333cqw, 0.133333333333cqh); }

.escena__panel[data-panel="total-look"] .comparador__antes {
  --alinear-w: 1038.38865342; --alinear-h: 1384.51820456;
  --alinear-x: -718.38064573; --alinear-y: -579.53849745; --alinear-giro: -11.23100653deg;
}

.escena__panel[data-panel="total-look"] .comparador__despues {
  --alinear-w: 1107.00000000; --alinear-h: 1421.00000000;
  --alinear-x: -630.00000000; --alinear-y: -760.00000000; --alinear-giro: 0.00000000deg;
}

.escena__panel[data-panel="lifting"] .comparador { --alinear-u: max(0.113573079924cqw, 0.113573079924cqh); }

/* Máxima apertura común sin franjas: 1.34% menor que v42. Se lleva el par al
   extremo derecho disponible, conservando la alineación y margen de cobertura. */
.escena__panel[data-panel="lifting"] .comparador .capa > img {
  left: calc(49.872155166492cqw + var(--alinear-x) * var(--alinear-u));
  top: calc(42.910226737141cqh + var(--alinear-y) * var(--alinear-u));
}

.escena__panel[data-panel="lifting"] .comparador__antes {
  --alinear-w: 984.97394247; --alinear-h: 1311.59078945;
  --alinear-x: -562.43936484; --alinear-y: -475.09595549; --alinear-giro: -7.12555317deg;
}

.escena__panel[data-panel="lifting"] .comparador__despues {
  --alinear-w: 932.00000000; --alinear-h: 1600.00000000;
  --alinear-x: -440.00000000; --alinear-y: -660.00000000; --alinear-giro: 0.00000000deg;
}

/* Organic Brows: máxima apertura común sin franjas; 1.04% menor que v42. */
.escena__panel[data-panel="organic"] .comparador { --alinear-u: max(0.057871297291cqw, 0.057871297291cqh); }

.escena__panel[data-panel="organic"] .comparador .capa > img {
  left: calc(50.016875523923cqw + var(--alinear-x) * var(--alinear-u));
  top: calc(49.999150397572cqh + var(--alinear-y) * var(--alinear-u));
}

.escena__panel[data-panel="organic"] .comparador__antes {
  --alinear-w: 1816.47870526; --alinear-h: 2606.02011019;
  --alinear-x: -959.51538431; --alinear-y: -988.02682564; --alinear-giro: -2.88213678deg;
}

.escena__panel[data-panel="organic"] .comparador__despues {
  --alinear-w: 2453.00000000; --alinear-h: 3271.00000000;
  --alinear-x: -1200.00000000; --alinear-y: -1360.00000000; --alinear-giro: 0.00000000deg;
}

/* Un marco cuadrado conserva las dos cejas incluso en tableta o escritorio angosto. */
.escena__panel .escena__foto .comparador {
  aspect-ratio: 1;
  min-height: 0;
  max-height: none;
}
/* El precio queda sobre la zona inferior del rostro, libre de cejas y pestañas. */
.escena__panel .flota { top: auto; bottom: .75rem; right: .75rem; }
@media (width >= 64em) {
  .escena__panel .escena__foto { align-self: center; }
}

/* Etiquetas compactas en móvil: se mantienen fuera del extremo superior de la ceja. */
@media (width < 40em) {
  .escena .comparador__chip { top: .4rem; padding: .2rem .5rem; font-size: .625rem; line-height: 1.2; }
}