/* visor.css — el visor de fotos (visor.js). Fondo casi negro: la foto manda. Botones de 48 px para el dedo. */
.visor { width: 100vw; height: 100vh; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: #0D0D0D; color: #FFFFFF; }
.visor::backdrop { background: #0D0D0D; }
.visor-marco { margin: 0; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .6rem; padding: 3.5rem 1rem 1rem; box-sizing: border-box; }
.visor-foto { max-width: 100%; max-height: calc(100% - 2.5rem); object-fit: contain; user-select: none; -webkit-user-drag: none; }
.visor-cuenta { font-size: 1rem; font-weight: 700; color: #FFFFFF; }
.visor-boton { position: fixed; width: 48px; height: 48px; border-radius: 50%; border: 2px solid #FFFFFF; background: #2B2B2B; color: #FFFFFF;
  font-size: 2rem; line-height: 1; display: grid; place-items: center; cursor: pointer; }
.visor-boton:focus-visible { outline: 3px solid #F3BF4B; outline-offset: 2px; }
.visor-antes { left: .75rem; top: 50%; transform: translateY(-50%); }
.visor-despues { right: .75rem; top: 50%; transform: translateY(-50%); }
.visor-cerrar { right: .75rem; top: .75rem; }
@media (hover: hover) { .visor-boton:hover { background: #444444; } }
/* Álbumes en /galeria */
.albumes { list-style: none; padding: 0; margin: 0 0 2.5rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 1rem; }
.album a { display: block; text-decoration: none; color: inherit; border-radius: 18px; overflow: hidden; background: #FFFFFF; box-shadow: 0 2px 10px rgba(14, 38, 57, .12); }
.album img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.album-texto { padding: .7rem .9rem .9rem; }
.album-texto strong { display: block; font-size: 1.05rem; }
/* Videos en el mosaico y la galería: la portada con un ▶ encima. */
.pieza-video { position: relative; display: block; }
.pieza-play { position: absolute; inset: 0; margin: auto; width: 56px; height: 56px; border-radius: 50%; background: #0D0D0D; color: #FFFFFF;
  border: 2px solid #FFFFFF; display: grid; place-items: center; font-size: 1.4rem; padding-left: 4px; box-sizing: border-box; opacity: .85; }
video.visor-foto { width: auto; background: #000000; }