/* GALERIA: manos apoyadas sobre el borde rosa.
   Los offsets solo desplazan desde ese apoyo: 0 = referencia de la captura.
   Positivo baja; negativo sube. La altura no altera el punto de apoyo.
   Este archivo sustituye ajustes-galeria-r9.css y galeria-fija-r11.css. */
.living-site {
 --gallery-left-top: 3px;
 --gallery-left-height: 177px;
 --gallery-right-top: -6px;
 --gallery-right-height: 100px;
 --gallery-left-top-mobile: 2px;
 --gallery-left-height-mobile: 99px;
 --gallery-right-top-mobile: -2px;
 --gallery-right-height-mobile: 64px;
}
.living-site .living-gallery { --gallery-frame-border: 7px; }
.living-site .gallery-bloopa.character-loop {
 --gallery-height: var(--gallery-left-height);
 --gallery-offset: var(--gallery-left-top);
 /* Compensa el margen transparente bajo las manos en el archivo original. */
 --gallery-alpha-pad: calc(var(--gallery-height) * 9 / 354);
 width: calc(var(--gallery-height) * 640 / 436);
}
.living-site .gallery-oopa.character-loop {
 --gallery-height: var(--gallery-right-height);
 --gallery-offset: var(--gallery-right-top);
 --gallery-alpha-pad: calc(var(--gallery-height) * 5 / 214);
 width: calc(var(--gallery-height) * 640 / 490);
}
.living-site .gallery-bloopa.character-loop,
.living-site .gallery-oopa.character-loop {
 top: auto !important;
 bottom: calc(100% - var(--gallery-frame-border) - var(--gallery-alpha-pad) - var(--gallery-offset));
 height: var(--gallery-height);
 z-index: 4;
 transform: none !important;
 translate: none !important;
 scale: none !important;
 animation: none !important;
 transition: none !important;
 will-change: auto;
 --dx: 0px !important;
 --dy: 0px !important;
}
/* Una sola capa controla la posicion: los ajustes globales y el spring
   de los otros personajes no desplazan ni escalan estos dos. */
.living-site .living-gallery [data-gallery-anchored="true"],
.living-site .living-gallery [data-gallery-anchored="true"] > .character-visual {
 width: 100%; height: 100%;
 transform: none !important;
 translate: none !important;
 scale: none !important;
 animation: none !important;
 transition: none !important;
}
.living-site .living-gallery .character-visual > img,
.living-site .living-gallery .character-visual > video {
 width: 100%; height: 100%; object-fit: fill;
}
@media (width <= 1100px) and (width > 700px) {
 .living-site .gallery-bloopa.character-loop { --gallery-height: calc(var(--gallery-left-height) * 210 / 260); }
 .living-site .gallery-oopa.character-loop { --gallery-height: calc(var(--gallery-right-height) * 110 / 130); }
}
@media (width <= 700px) {
 .living-site .living-gallery { --gallery-frame-border: 4px; }
 .living-site .gallery-bloopa.character-loop {
  --gallery-height: var(--gallery-left-height-mobile);
  --gallery-offset: var(--gallery-left-top-mobile);
 }
 .living-site .gallery-oopa.character-loop {
  --gallery-height: var(--gallery-right-height-mobile);
  --gallery-offset: var(--gallery-right-top-mobile);
 }
}
