@layer components{html:has(.visionneuse[open]){overflow:hidden}.visionneuse{--bord:calc(44px + 2 * var(--space-s));width:100%;max-width:none;height:100%;max-height:none;padding:var(--bord) var(--space-s) var(--space-s);background-color:var(--color-terrain);color:var(--role-texte);touch-action:pan-y pinch-zoom;border:0;margin:0;position:fixed;inset:0}.visionneuse[open]{gap:var(--space-s);grid-template-rows:minmax(0,1fr) auto;display:grid}.visionneuse::backdrop{background-color:var(--color-terrain)}.visionneuse-scene{justify-content:center;align-items:center;min-height:0;display:flex}.visionneuse-image{object-fit:contain;background-color:var(--color-pierre);width:auto;max-width:100%;height:auto;max-height:100%;display:block}.visionneuse-pied{justify-content:center;column-gap:var(--space-s);min-height:44px;max-width:var(--mesure);padding-inline:calc(44px + var(--space-s));text-align:center;flex-wrap:wrap;align-items:center;margin:0 auto;display:flex}.visionneuse-rang{font-variant-numeric:tabular-nums;color:var(--role-texte)}.visionneuse-bouton{border:1px solid var(--color-trait);background-color:var(--color-terrain);width:44px;height:44px;color:var(--role-texte);cursor:pointer;place-items:center;padding:0;display:grid;position:absolute}.visionneuse-bouton svg{fill:none;stroke:currentColor;stroke-width:1.5px;stroke-linecap:square;width:24px;height:24px}@media (hover:hover) and (pointer:fine){.visionneuse-bouton:hover{background-color:var(--role-survol);border-color:var(--color-texte-2)}}.visionneuse-fermer{top:var(--space-s);right:var(--space-s)}.visionneuse-precedente,.visionneuse-suivante{bottom:var(--space-s)}.visionneuse-precedente{left:var(--space-s)}.visionneuse-suivante{right:var(--space-s)}@media (min-width:48rem){.visionneuse{padding-inline:var(--bord)}.visionneuse-pied{padding-inline:0}.visionneuse-precedente,.visionneuse-suivante{top:50%;bottom:auto;transform:translateY(-50%)}}}