/* Zoom sur image (lightbox) : le <dialog> ouvert par app.js sur tout img[data-zoom].
   Sorti de theme.css le 06/11/2026 pour que la page d'accueil (qui ne charge pas
   theme.css) agrandisse ses captures avec le MÊME zoom que l'application.
   Chargé par base.html (application) et par landing.html. Ses images-clés portent leur
   propre nom (mêmes valeurs que backdrop-in / dialog-panel-in de theme.css) : la feuille
   se suffit à elle-même. */
/* Le <dialog> occupe tout l'écran et centre son contenu : pas de calcul de position,
   et l'image se contraint d'elle-même à la fenêtre quel que soit son rapport. */
dialog.zoom-dlg { border: none; padding: 0; background: transparent; max-width: 100vw; max-height: 100dvh; width: 100%; height: 100%; overflow: visible; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .75rem; }
dialog.zoom-dlg::backdrop { background: rgba(0,0,0,.88); backdrop-filter: blur(6px); animation: zoom-backdrop-in .2s ease; }
dialog.zoom-dlg:not([open]) { display: none; }
.zoom-img { max-width: calc(100vw - 2.5rem); max-height: calc(100dvh - 6rem); width: auto; height: auto; object-fit: contain; border-radius: 10px; box-shadow: 0 25px 70px rgba(0,0,0,.8); animation: zoom-panel-in .2s var(--ease-out-strong); }
.zoom-cap { max-width: min(46rem, calc(100vw - 2.5rem)); margin: 0; text-align: center; font-size: .875rem; color: var(--muted); }
.zoom-close { position: absolute; top: .75rem; right: .75rem; width: 2.25rem; height: 2.25rem; border-radius: 99px; border: 1px solid var(--b2); background: var(--s2); color: var(--txt); font-size: 1.4rem; line-height: 1; cursor: pointer; }
.zoom-close:hover { background: var(--s3); }
/* Signale l'agrandissement possible, sans ajouter d'icône par-dessus l'image. */
img[data-zoom] { cursor: zoom-in; }
img[data-zoom]:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
@keyframes zoom-backdrop-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes zoom-panel-in { from { opacity: 0; transform: scale(.95) translateY(8px); } to { opacity: 1; transform: none; } }