/* =========================================================================
   ESDI MANAGER — 14-visionneuse.css (2026-09-12)
   La visionneuse de documents de l'Espace de travail (public/js/esdi-visionneuse.js).

   Une <dialog> quasi plein écran : en-tête (identité du fichier, outils, actions), corps,
   bandeau de notes. Le tableur y vit avec sa barre de formule, sa grille, ses onglets de
   feuilles et son panneau de graphiques.

   RÈGLES
   - Couleurs par tokens seulement (01-tokens.css) : clair ET sombre sans une ligne de plus,
     sauf les cellules d'un classeur, qui gardent LEURS couleurs (celles du document).
   - Mouvement : opacity/transform, ≤ 220 ms, rien sous prefers-reduced-motion.
   - Rayons : 12 (panneau) / 8 (contrôles) / pilule (boutons).
   ========================================================================= */

:root {
    --vz-quadrillage: color-mix(in srgb, var(--line) 80%, transparent);
    --vz-bordure-forte: color-mix(in srgb, var(--ink) 55%, var(--line));
    --vz-entete-bg: var(--bg-section-cool);
    --vz-selection: color-mix(in srgb, var(--accent-500) 14%, transparent);
    --vz-selection-bord: var(--primary-500);
    --vz-trouve: color-mix(in srgb, var(--sig-warn) 30%, transparent);
}
[data-theme="dark"] {
    --vz-quadrillage: color-mix(in srgb, var(--line) 70%, transparent);
    --vz-bordure-forte: color-mix(in srgb, var(--ink) 45%, var(--line));
}

/* ── La boîte ───────────────────────────────────────────────────────────── */
html.vz-ouverte { overflow: hidden; }
.vz {
    width: calc(100vw - 32px); height: calc(100dvh - 32px);
    max-width: none; max-height: none;
    margin: 16px auto; padding: 0;
    border: 0; background: transparent; color: var(--ink);
    overflow: visible;
}
.vz::backdrop { background: rgba(14, 22, 38, 0.55); backdrop-filter: blur(2px); }
.vz[open] .vz__panneau { animation: vz-entree var(--duration-entree, 220ms) var(--ease-out-strong) both; }
@keyframes vz-entree { from { opacity: 0; transform: translateY(8px) scale(0.985); } to { opacity: 1; transform: none; } }
.vz__panneau {
    display: flex; flex-direction: column; height: 100%;
    background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg), 0 30px 80px rgba(8, 20, 40, 0.28);
    overflow: hidden;
}
@media (max-width: 767.98px) {
    .vz { width: 100vw; height: 100dvh; margin: 0; }
    .vz__panneau { border-radius: 0; border: 0; }
}

/* ── En-tête ────────────────────────────────────────────────────────────── */
.vz__tete {
    display: flex; align-items: center; gap: var(--space-4);
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--line); background: var(--bg-card);
    flex: 0 0 auto; min-height: 60px;
}
.vz__id { display: flex; align-items: center; gap: var(--space-3); min-width: 0; flex: 1 1 260px; }
.vz__ico { width: 36px; height: 36px; border-radius: var(--radius-sm); display: grid; place-items: center; flex: 0 0 auto; color: var(--ink-soft); background: var(--bg-section-cool); }
.vz__ico svg { width: 20px; height: 20px; }
.vz__ico--tableur { color: #1f8a56; background: color-mix(in srgb, #30a46c 16%, transparent); }
.vz__ico--document, .vz__ico--markdown { color: var(--primary-500); background: var(--primary-50); }
.vz__ico--pdf { color: var(--sig-alert); background: var(--sig-alert-bg); }
.vz__ico--image { color: #8a4dd6; background: color-mix(in srgb, #8a4dd6 14%, transparent); }
.vz__ico--video, .vz__ico--audio { color: var(--sig-warn-text); background: var(--sig-warn-bg); }
.vz__titres { min-width: 0; }
.vz__nom { font-weight: 600; font-size: var(--text-body); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vz__meta { font-size: var(--text-caption); color: var(--ink-faded); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vz__outils { display: flex; align-items: center; gap: var(--space-2); flex: 0 1 auto; min-width: 0; }
.vz__actions { display: flex; align-items: center; gap: var(--space-1); margin-left: auto; flex: 0 0 auto; }
.vz__compteur { font-size: var(--text-caption); color: var(--ink-faded); font-variant-numeric: tabular-nums; padding: 0 2px; }
.vz__btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    height: 36px; min-width: 36px; padding: 0 10px;
    border: 1px solid transparent; border-radius: var(--radius-pill);
    background: transparent; color: var(--ink-soft); font: inherit; font-size: 13px; font-weight: 500;
    text-decoration: none; cursor: pointer;
    transition: background-color var(--duration-micro) ease, color var(--duration-micro) ease, transform 120ms var(--ease-out-strong);
}
.vz__btn svg { width: 18px; height: 18px; }
.vz__btn:hover { background: var(--bg-section-cool); color: var(--ink); }
.vz__btn:active { transform: scale(0.96); }
.vz__btn:focus-visible { outline: none; box-shadow: var(--shadow-focus); }
.vz__btn:disabled { opacity: 0.35; cursor: default; transform: none; }
.vz__btn--texte { padding: 0 12px; }
.vz__btn--actif { background: var(--primary-50); color: var(--primary-600); border-color: color-mix(in srgb, var(--primary-500) 30%, transparent); }
[data-theme="dark"] .vz__btn--actif { background: color-mix(in srgb, var(--accent-500) 16%, transparent); color: var(--accent-300); }
.vz__btn--fermer { margin-left: var(--space-1); }
.vz__btn--fermer:hover { background: var(--sig-alert-bg); color: var(--sig-alert-text); }
.vz__btn--graphs b { font-weight: 600; }
@media (max-width: 767.98px) {
    .vz__tete { flex-wrap: wrap; gap: var(--space-2); padding: var(--space-2) var(--space-3); }
    .vz__id { flex-basis: calc(100% - 96px); order: 1; }
    .vz__actions { order: 2; }
    .vz__outils { order: 3; flex-basis: 100%; }
    .vz__btn--texte span { display: none; }
    .vz__btn--texte { padding: 0 8px; }
}

/* ── Corps ──────────────────────────────────────────────────────────────── */
.vz__corps { flex: 1 1 auto; min-height: 0; position: relative; display: flex; flex-direction: column; }
.vz__notes {
    flex: 0 0 auto; display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4);
    padding: var(--space-2) var(--space-4); border-top: 1px solid var(--line);
    background: var(--bg-card); font-size: var(--text-caption); color: var(--ink-soft);
}
.vz__notes--avert { background: var(--sig-warn-bg); color: var(--sig-warn-text); }
.vz__note { display: inline-flex; align-items: center; gap: 4px; }
.vz__note svg { width: 14px; height: 14px; flex: 0 0 auto; }

/* Attente : squelettes qui respirent, jamais un rond qui tourne. */
.vz-attente { padding: var(--space-8) var(--space-6); display: grid; gap: var(--space-3); align-content: start; max-width: 720px; }
.vz-attente__squelette { height: 14px; border-radius: 7px; background: linear-gradient(90deg, var(--line) 0%, var(--bg-section-cool) 50%, var(--line) 100%); background-size: 200% 100%; animation: vz-respire 1.4s ease-in-out infinite; }
.vz-attente__squelette:nth-child(2) { width: 82%; } .vz-attente__squelette:nth-child(3) { width: 64%; }
@keyframes vz-respire { 0% { background-position: 100% 0; } 100% { background-position: -100% 0; } }
.vz-attente__texte { margin: var(--space-2) 0 0; color: var(--ink-faded); font-size: var(--text-caption); }

/* Carte de message (type non pris en charge, erreur, PDF sur iOS) */
.vz-carte { margin: auto; text-align: center; padding: var(--space-8); max-width: 460px; }
.vz-carte__rond { width: 64px; height: 64px; border-radius: 50%; margin: 0 auto var(--space-4); display: grid; place-items: center; background: var(--bg-section-cool); color: var(--ink-soft); }
.vz-carte__rond svg { width: 28px; height: 28px; }
.vz-carte__rond--alerte { background: var(--sig-alert-bg); color: var(--sig-alert-text); }
.vz-carte__titre { font-size: var(--text-lead); font-weight: 600; margin: 0 0 var(--space-2); }
.vz-carte__texte { color: var(--ink-soft); margin: 0 0 var(--space-5); font-size: var(--text-body); line-height: 1.5; }
.vz-carte__actions { display: flex; gap: var(--space-2); justify-content: center; flex-wrap: wrap; }
.vz-carte__btn { border-radius: var(--radius-pill); padding: 10px 20px; }

/* Image, PDF, média */
.vz-image { flex: 1 1 auto; min-height: 0; overflow: auto; display: grid; place-items: center; padding: var(--space-4); cursor: zoom-in;
    background: repeating-conic-gradient(color-mix(in srgb, var(--ink) 4%, transparent) 0% 25%, transparent 0% 50%) 50% / 24px 24px; }
.vz-image img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 4px; box-shadow: var(--shadow-md); background: var(--bg-card); }
.vz-image--reelle { cursor: zoom-out; place-items: start; }
.vz-image--reelle img { max-width: none; max-height: none; }
.vz-pdf { flex: 1 1 auto; width: 100%; border: 0; background: var(--bg-section-cool); }
.vz-media { flex: 1 1 auto; display: grid; place-items: center; padding: var(--space-4); background: #0e1626; }
.vz-media video { max-width: 100%; max-height: 100%; border-radius: var(--radius-sm); }
.vz-media--audio { background: var(--bg); gap: var(--space-4); align-content: center; }
.vz-media__rond { width: 96px; height: 96px; border-radius: 50%; display: grid; place-items: center; background: var(--gradient-brand); color: #fff; margin: 0 auto; }
.vz-media__rond svg { width: 40px; height: 40px; }
.vz-media audio { width: min(560px, 90%); }

/* Document (docx, markdown) : une page posée sur le fond */
.vz-doc { flex: 1 1 auto; min-height: 0; overflow: auto; padding: var(--space-6) var(--space-4); background: var(--bg-section-cool); }
.vz-doc__page { max-width: 820px; margin: 0 auto; background: var(--bg-card); color: var(--ink); border: 1px solid var(--line); border-radius: var(--radius-md); padding: 48px 56px; box-shadow: var(--shadow-md); }
.vz-word { font-size: 15px; line-height: 1.6; }
.vz-word > * { margin: 0 0 8px; }
.vz-word h1 { font-size: 26px; font-weight: 700; margin: 18px 0 10px; }
.vz-word h2 { font-size: 21px; font-weight: 600; margin: 16px 0 8px; }
.vz-word h3 { font-size: 17px; font-weight: 600; margin: 14px 0 6px; }
.vz-word h4, .vz-word h5, .vz-word h6 { font-size: 15px; font-weight: 600; margin: 12px 0 4px; }
.vz-word p:empty { min-height: 1em; }
.vz-word table { border-collapse: collapse; width: 100%; margin: 8px 0 12px; font-size: 14px; }
.vz-word td, .vz-word th { border: 1px solid var(--line); padding: 6px 10px; vertical-align: top; }
.vz-word th { background: var(--bg-section-cool); font-weight: 600; }
.vz-word img { max-width: 100%; height: auto; display: block; margin: 8px 0; }
.vz-word a { color: var(--primary-500); }
.vz-word ul, .vz-word ol { padding-left: 28px; }
.vz-word blockquote { border-left: 3px solid var(--line); padding-left: 14px; color: var(--ink-soft); }
.vz-word pre { background: var(--bg-section-cool); padding: 10px 12px; border-radius: var(--radius-sm); font: 13px/1.5 var(--font-mono); overflow: auto; }
@media (max-width: 767.98px) {
    .vz-doc { padding: var(--space-3); }
    .vz-doc__page { padding: 24px 20px; }
}

/* Code / texte : numéros de lignes par compteur CSS */
.vz-code { flex: 1 1 auto; min-height: 0; overflow: auto; background: var(--bg-card); }
.vz-code__pre { margin: 0; padding: var(--space-4) var(--space-4) var(--space-8) 0; font: 13px/1.55 var(--font-mono); color: var(--ink); counter-reset: vz-ligne; min-width: max-content; tab-size: 4; }
.vz-code__l { display: block; padding-left: 64px; position: relative; white-space: pre; }
.vz-code__l::before { counter-increment: vz-ligne; content: counter(vz-ligne); position: absolute; left: 0; width: 48px; text-align: right; color: var(--ink-faded); user-select: none; font-size: 12px; }
.vz-code__l:hover { background: color-mix(in srgb, var(--accent-500) 6%, transparent); }
.vz-code--prose .vz-code__pre { font-family: var(--font-sans); font-size: 15px; line-height: 1.6; min-width: 0; max-width: 900px; }
.vz-code--prose .vz-code__l { white-space: pre-wrap; overflow-wrap: anywhere; }

/* ── Tableur ─────────────────────────────────────────────────────────────── */
.vz-tab { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.vz-tab__formule { flex: 0 0 auto; display: flex; align-items: stretch; border-bottom: 1px solid var(--line); background: var(--bg-card); height: 34px; }
.vz-tab__adresse { width: 92px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; font: 600 13px var(--font-mono); color: var(--ink); border-right: 1px solid var(--line); }
.vz-tab__fx { flex: 0 0 auto; display: flex; align-items: center; padding: 0 10px; font: italic 500 13px var(--font-mono); color: var(--ink-faded); border-right: 1px solid var(--line); }
.vz-tab__contenu { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; padding: 0 12px; font: 13px var(--font-mono); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--ink); }
.vz-tab__zone { flex: 1 1 auto; min-height: 0; display: flex; }
.vz-tab__grille { flex: 1 1 auto; min-width: 0; overflow: auto; background: var(--bg-card); outline: none; overscroll-behavior: contain; }
.vz-tab__grille:focus-visible { box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--accent-500) 45%, transparent); }
.vz-tab__toile { position: relative; }

.vz-grille { border-collapse: separate; border-spacing: 0; table-layout: fixed; font: 13px/1.3 var(--font-sans); color: var(--ink); }
.vz-grille th, .vz-grille td { box-sizing: border-box; padding: 0 4px; border-right: 1px solid var(--vz-quadrillage); border-bottom: 1px solid var(--vz-quadrillage); vertical-align: bottom; white-space: nowrap; overflow: hidden; font-weight: 400; }
.vz-grille--sans-quadrillage td { border-right-color: transparent; border-bottom-color: transparent; }
.vz-grille thead th, .vz-grille thead td { position: sticky; top: 0; z-index: 3; }
.vz-grille thead tr:not(:first-child) td, .vz-grille thead tr:not(:first-child) th { top: var(--vz-top-figee, 22px); }
.vz-grille th.vz-col, .vz-grille th.vz-coin { background: var(--vz-entete-bg); color: var(--ink-soft); text-align: center; font-size: 12px; font-weight: 500; border-bottom: 1px solid var(--vz-bordure-forte); user-select: none; vertical-align: middle; }
.vz-grille th.vz-coin { position: sticky; left: 0; z-index: 5; border-right: 1px solid var(--vz-bordure-forte); }
.vz-grille th.vz-num { position: sticky; left: 0; z-index: 2; background: var(--vz-entete-bg); color: var(--ink-soft); text-align: center; font-size: 12px; font-variant-numeric: tabular-nums; border-right: 1px solid var(--vz-bordure-forte); user-select: none; vertical-align: middle; }
.vz-grille thead th.vz-num { z-index: 4; }
.vz-grille th.vz-col--sel, .vz-grille th.vz-num--sel { background: var(--vz-selection); color: var(--primary-600); font-weight: 600; }
[data-theme="dark"] .vz-grille th.vz-col--sel, [data-theme="dark"] .vz-grille th.vz-num--sel { color: var(--accent-300); }
.vz-grille td { background: var(--bg-card); }
.vz-grille thead td { background: var(--bg-card); }
.vz-grille tr.vz-espace td { border: 0; padding: 0; background: transparent; }
.vz-grille td.vz-al-right { text-align: right; font-variant-numeric: tabular-nums; }
.vz-grille td.vz-al-center { text-align: center; }
.vz-grille td.vz-al-left { text-align: left; }
.vz-grille td.vz-k-e { color: var(--sig-alert-text); font-weight: 500; }
/* ⚠️ Jamais `position` sur une classe de cellule : une cellule FIGÉE est `position: sticky`, et une
   règle plus spécifique qui pose `relative` la décrocherait (mesuré : « Total » en F1 descendait
   d'une ligne et interceptait les clics sur F2). */
.vz-grille td.vz-deb { overflow: visible; }
.vz-grille td.vz-deb .vz-deb__t { display: block; width: max-content; overflow: hidden; text-overflow: clip; white-space: nowrap; position: relative; z-index: 1; pointer-events: none; }
.vz-grille td.vz-fusion { vertical-align: middle; }
.vz-grille td a { color: var(--primary-500); text-decoration: underline; }
.vz-grille td.vz-sel { outline: 2px solid var(--vz-selection-bord); outline-offset: -2px; }
.vz-grille tbody td.vz-sel { position: relative; z-index: 1; }
.vz-grille thead td.vz-sel { z-index: 4; }
.vz-grille td.vz-trouve { box-shadow: inset 0 0 0 100px var(--vz-trouve); }

/* Onglets de feuilles + état, comme la barre du bas d'Excel */
.vz-tab__pied { flex: 0 0 auto; display: flex; align-items: center; gap: var(--space-3); border-top: 1px solid var(--line); background: var(--bg-card); padding: 0 var(--space-3) 0 var(--space-2); min-height: 38px; }
.vz-tab__feuilles { display: flex; align-items: stretch; gap: 2px; overflow-x: auto; flex: 1 1 auto; min-width: 0; scrollbar-width: thin; padding: 4px 0; }
.vz-tab__feuilles--seule { }
.vz-feuille {
    display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 14px;
    border: 1px solid transparent; border-radius: var(--radius-sm); background: transparent;
    font: 500 13px var(--font-sans); color: var(--ink-soft); white-space: nowrap; cursor: pointer;
    transition: background-color var(--duration-micro) ease, color var(--duration-micro) ease;
}
.vz-feuille:hover { background: var(--bg-section-cool); color: var(--ink); }
.vz-feuille--active { background: var(--bg); color: var(--primary-600); border-color: var(--line); font-weight: 600; box-shadow: inset 0 2px 0 var(--accent-500); }
[data-theme="dark"] .vz-feuille--active { color: var(--accent-300); }
.vz-feuille--masquee { opacity: 0.55; font-style: italic; }
.vz-feuille__badge { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--primary-50); color: var(--primary-600); font-size: 11px; font-weight: 600; }
[data-theme="dark"] .vz-feuille__badge { background: color-mix(in srgb, var(--accent-500) 18%, transparent); color: var(--accent-300); }
.vz-tab__etat { flex: 0 0 auto; font-size: var(--text-caption); color: var(--ink-faded); white-space: nowrap; font-variant-numeric: tabular-nums; }

/* Recherche + zoom dans l'en-tête */
.vz-recherche { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 10px 0 12px; border: 1px solid var(--line); border-radius: var(--radius-pill); background: var(--bg); color: var(--ink-faded); min-width: 0; width: 260px; max-width: 100%; transition: box-shadow var(--duration-micro) ease, border-color var(--duration-micro) ease; }
.vz-recherche:focus-within { border-color: var(--accent-500); box-shadow: var(--shadow-focus); color: var(--ink-soft); }
.vz-recherche svg { width: 16px; height: 16px; flex: 0 0 auto; }
.vz-recherche input { border: 0; background: transparent; outline: none; font: 13px var(--font-sans); color: var(--ink); min-width: 0; flex: 1 1 auto; }
.vz-recherche input::-webkit-search-cancel-button { -webkit-appearance: none; }
.vz-recherche__compte { font-size: 12px; color: var(--ink-faded); font-variant-numeric: tabular-nums; white-space: nowrap; }
.vz-zoom { display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: var(--radius-pill); background: var(--bg); height: 36px; padding: 0 2px; }
.vz-zoom .vz__btn { height: 30px; min-width: 30px; }
.vz-zoom__val { border: 0; background: transparent; font: 500 12px var(--font-sans); color: var(--ink-soft); min-width: 48px; text-align: center; cursor: pointer; font-variant-numeric: tabular-nums; }
@media (max-width: 767.98px) { .vz-recherche { width: auto; flex: 1 1 140px; } .vz-zoom { display: none; } }

/* Panneau des graphiques */
.vz-tab__graphs { flex: 0 0 min(420px, 42%); border-left: 1px solid var(--line); background: var(--bg); display: flex; flex-direction: column; min-height: 0; }
.vz-tab__graphs-tete { display: flex; align-items: center; justify-content: space-between; padding: var(--space-2) var(--space-2) var(--space-2) var(--space-4); border-bottom: 1px solid var(--line); font-size: 13px; font-weight: 600; color: var(--ink-soft); }
.vz-tab__graphs-liste { overflow: auto; padding: var(--space-3); display: grid; gap: var(--space-3); align-content: start; }
.vz-graph { margin: 0; background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--radius-md); padding: var(--space-3); }
.vz-graph__zone { position: relative; height: 260px; }
.vz-graph__titre { font-weight: 600; font-size: 14px; margin-bottom: var(--space-2); }
.vz-graph__legende { font-size: var(--text-caption); color: var(--ink-faded); margin-top: var(--space-2); }
.vz-graph__vide { color: var(--ink-faded); font-size: 13px; margin: var(--space-3) 0; }
@media (max-width: 991.98px) {
    .vz-tab__zone { flex-direction: column; }
    .vz-tab__graphs { flex: 0 0 46%; border-left: 0; border-top: 1px solid var(--line); order: 2; }
}

/* ── Modifier à la main ─────────────────────────────────────────────────── */
.vz__notes--ok { background: var(--sig-ok-bg); color: var(--sig-ok-text); }
.vz__btn--enregistrer { background: var(--gradient-brand); color: #fff; padding: 0 14px; }
.vz__btn--enregistrer:hover { background: var(--gradient-brand); color: #fff; filter: brightness(1.06); }
.vz__btn--enregistrer:disabled { opacity: 0.6; }
.vz-editeur {
    position: absolute; z-index: 6; box-sizing: border-box;
    padding: 0 4px; margin: 0; border: 2px solid var(--vz-selection-bord); border-radius: 0; outline: none;
    background: var(--bg-card); color: var(--ink); font: inherit; font-family: var(--font-sans);
    box-shadow: var(--shadow-md);
}
.vz-grille td.vz-modif { background: color-mix(in srgb, var(--sig-warn) 12%, var(--bg-card)); }
.vz-grille tbody td.vz-modif { position: relative; }
.vz-grille td.vz-modif::after { content: ""; position: absolute; top: 0; right: 0; border-style: solid; border-width: 0 7px 7px 0; border-color: transparent var(--sig-warn) transparent transparent; }
.vz-tab__contenu--modif { color: var(--sig-warn-text); }
.vz-editeur-texte {
    flex: 1 1 auto; min-height: 0; width: 100%; box-sizing: border-box; resize: none;
    padding: var(--space-4) var(--space-5); border: 0; outline: none;
    background: var(--bg-card); color: var(--ink); font: 14px/1.6 var(--font-mono); tab-size: 4;
}
.vz--markdown .vz-editeur-texte, .vz-editeur-texte[spellcheck="true"] { font-family: var(--font-sans); font-size: 15px; max-width: 100%; }
.vz-editeur-texte:focus { box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--accent-500) 40%, transparent); }

/* Mouvement coupé */
@media (prefers-reduced-motion: reduce) {
    .vz[open] .vz__panneau { animation: none; }
    .vz-attente__squelette { animation: none; }
    .vz__btn, .vz-feuille, .vz-recherche, .vz-zoom { transition: none; }
}
