/* L'attribut hidden doit l'emporter sur toute règle display (nav en flex, jauges, messages) :
   sans cela la navigation restait visible sur l'écran de connexion (vu en prod le 11/09/2026). */
[hidden] { display: none !important; }

/* styles.css : Jadis Dictée. Sobre, professionnel, PC de bureau d'abord, lisible sur téléphone.
   Palette : anthracite Polyexpert, accent orange Polyexpert, fond gris très clair. Contrastes AA. */
:root {
  --primaire: #2B2F33;        /* anthracite (logo) */
  --sur-primaire: #FFFFFF;
  --accent: #C8681A;          /* orange Polyexpert assombri pour tenir le contraste sur blanc (4.6:1) */
  --accent-clair: #FFF1E4;
  --fond: #F6F7F9;
  --surface: #FFFFFF;
  --texte: #1B1F23;
  --texte-2: #5A6169;
  --bord: #DDE1E6;
  --danger: #B42318;
  --danger-clair: #FDECEA;
  --ok: #1E7B3A;
  --ok-clair: #E7F5EB;
  --attention: #8A5A00;
  --attention-clair: #FFF6D6;
  --ombre: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .1);
  --rayon: 10px;
  --duree: 180ms;
}
* { box-sizing: border-box; }
html { font-size: 16px; }
body { margin: 0; background: var(--fond); color: var(--texte); font-family: -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; line-height: 1.5; min-height: 100dvh; display: flex; flex-direction: column; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

.entete { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 24px; background: var(--surface); border-bottom: 1px solid var(--bord); position: sticky; top: 0; z-index: 20; }
.entete__marque { display: flex; align-items: center; gap: 14px; }
.entete__logo { height: 30px; width: auto; }
.entete__produit { font-weight: 600; letter-spacing: .01em; color: var(--primaire); }
.nav { display: flex; gap: 6px; flex-wrap: wrap; }
.nav__btn { background: transparent; border: 1px solid transparent; color: var(--texte-2); padding: 8px 12px; border-radius: 8px; cursor: pointer; font: inherit; min-height: 40px; transition: background var(--duree), color var(--duree); }
.nav__btn:hover { background: var(--fond); color: var(--texte); }
.nav__btn.est-actif { background: var(--accent-clair); color: var(--accent); font-weight: 600; }
.nav__btn--sortie { margin-left: 8px; }
.nav__btn:focus-visible, .btn:focus-visible, .saisie:focus-visible, .zone:focus-visible { outline: 3px solid #F4A15D; outline-offset: 2px; }

.principal { flex: 1; width: 100%; max-width: 1040px; margin: 0 auto; padding: 24px 16px 48px; }
.pied { text-align: center; color: var(--texte-2); font-size: 13px; padding: 16px; }

.carte { background: var(--surface); border: 1px solid var(--bord); border-radius: var(--rayon); box-shadow: var(--ombre); padding: 24px; margin-bottom: 20px; }
.carte--etroite { max-width: 420px; margin: 48px auto; }
.titre { font-size: 22px; font-weight: 600; margin: 0 0 8px; color: var(--primaire); }
.titre--nu { margin-bottom: 16px; }
.soustitre { font-size: 17px; font-weight: 600; margin: 0 0 8px; color: var(--primaire); }
.aide { color: var(--texte-2); margin: 0 0 16px; font-size: 15px; }
.tete-liste { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }

.champ { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.champ__label { font-weight: 600; font-size: 14px; }
.champ__note { font-size: 13px; color: var(--texte-2); font-weight: 400; }
.obligatoire { color: var(--danger); }
.saisie { font: inherit; padding: 10px 12px; border: 1px solid var(--bord); border-radius: 8px; background: var(--surface); color: var(--texte); min-height: 44px; transition: border-color var(--duree), box-shadow var(--duree); }
.saisie:hover { border-color: #C3C9D1; }
.saisie:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-clair); outline: none; }
.saisie--zone { min-height: 80px; resize: vertical; }
.saisie--fichier { padding: 8px; }
.grille { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 0 20px; }
.champ--large { grid-column: 1 / -1; }
.actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.ligne-form { display: grid; grid-template-columns: 1fr 1fr auto; gap: 12px; align-items: end; }
@media (max-width: 640px) { .ligne-form { grid-template-columns: 1fr; } }

.btn { font: inherit; font-weight: 600; padding: 10px 16px; min-height: 44px; border-radius: 8px; border: 1px solid transparent; cursor: pointer; transition: background var(--duree), transform var(--duree), box-shadow var(--duree); }
.btn:active { transform: scale(.98); }
.btn[disabled] { opacity: .5; cursor: not-allowed; }
.btn--principal { background: var(--accent); color: #fff; }
.btn--principal:hover:not([disabled]) { background: #B05A14; }
.btn--secondaire { background: var(--surface); color: var(--primaire); border-color: var(--bord); }
.btn--secondaire:hover:not([disabled]) { background: var(--fond); }
.btn--danger { background: var(--danger-clair); color: var(--danger); border-color: #F5C2BC; }
.btn--danger:hover:not([disabled]) { background: #FBDAD5; }
.btn--bloc { display: block; width: 100%; }
.btn--petit { min-height: 36px; padding: 6px 12px; font-size: 14px; }

.message { margin: 8px 0; padding: 10px 12px; border-radius: 8px; font-size: 14px; }
.message--erreur { background: var(--danger-clair); color: var(--danger); }
.message--ok { background: var(--ok-clair); color: var(--ok); }
.flash { position: fixed; top: 12px; left: 50%; transform: translateX(-50%); z-index: 50; padding: 12px 18px; border-radius: 8px; box-shadow: var(--ombre); font-weight: 600; max-width: 90vw; }
.flash--ok { background: var(--ok-clair); color: var(--ok); }
.flash--err { background: var(--danger-clair); color: var(--danger); }

.zone { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 28px 16px; border: 2px dashed #C3C9D1; border-radius: var(--rayon); background: var(--fond); cursor: pointer; text-align: center; transition: border-color var(--duree), background var(--duree); margin-bottom: 12px; }
.zone:hover, .zone.est-survolee { border-color: var(--accent); background: var(--accent-clair); }
.zone__input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.zone__consigne { font-weight: 600; }
.zone__format { font-size: 13px; color: var(--texte-2); }
.fichiers { list-style: none; padding: 0; margin: 0 0 12px; display: flex; flex-direction: column; gap: 6px; }
.fichiers li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 12px; border: 1px solid var(--bord); border-radius: 8px; background: var(--surface); flex-wrap: wrap; }
.fichiers--liens a { color: var(--accent); font-weight: 600; text-decoration: none; }
.fichiers--liens a:hover { text-decoration: underline; }
.fichiers .discret { color: var(--texte-2); font-size: 13px; }

.progres { margin: 12px 0; }
.progres__barre { height: 8px; background: var(--bord); border-radius: 4px; overflow: hidden; }
.progres__jauge { height: 100%; width: 0; background: var(--accent); transition: width var(--duree); }
.progres__txt { margin: 6px 0; font-size: 14px; color: var(--texte-2); }

.taches { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.tache { background: var(--surface); border: 1px solid var(--bord); border-radius: var(--rayon); box-shadow: var(--ombre); padding: 14px 18px; display: grid; grid-template-columns: 1fr auto; gap: 8px 16px; align-items: center; }
.tache__dossier { font-weight: 600; font-size: 17px; color: var(--primaire); }
.tache__meta { color: var(--texte-2); font-size: 14px; }
.tache__statut { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 13px; font-weight: 600; background: var(--fond); color: var(--texte-2); }
.tache__statut--a_verifier { background: var(--attention-clair); color: var(--attention); }
.tache__statut--termine { background: var(--ok-clair); color: var(--ok); }
.tache__statut--erreur { background: var(--danger-clair); color: var(--danger); }
.tache__statut--en_cours { background: #E8F0FE; color: #1D4ED8; }
.tache__actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.tache__erreur { grid-column: 1 / -1; color: var(--danger); font-size: 14px; }
.tache__alerte { grid-column: 1 / -1; color: var(--attention); font-size: 14px; }
.tache__progres { grid-column: 1 / -1; font-size: 13px; color: var(--texte-2); }
@media (max-width: 640px) { .tache { grid-template-columns: 1fr; } .tache__actions { justify-content: flex-start; } }
.vide { color: var(--texte-2); padding: 24px; text-align: center; border: 1px dashed var(--bord); border-radius: var(--rayon); }

.alertes { background: var(--attention-clair); color: var(--attention); border-radius: 8px; padding: 10px 12px; margin-bottom: 12px; font-size: 14px; }
.alertes p { margin: 4px 0; }
.verif-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.verif-compte { color: var(--texte-2); font-size: 14px; }
.tableau-cadre { overflow-x: auto; margin-bottom: 16px; border: 1px solid var(--bord); border-radius: 8px; }
.tableau { width: 100%; border-collapse: collapse; font-size: 14px; }
.tableau th { text-align: left; background: var(--fond); padding: 10px 12px; border-bottom: 1px solid var(--bord); font-weight: 600; }
.tableau td { padding: 8px 12px; border-bottom: 1px solid var(--bord); vertical-align: middle; }
.tableau tr:last-child td { border-bottom: 0; }
.verif__gauche { min-width: 260px; }
.verif__ecoute { white-space: nowrap; }
.verif__ecoute .verif__horodatage { margin-left: 8px; }
.verif__ecouter.est-en-lecture { border-color: var(--accent); color: var(--accent); }
.btn--lien { background: none; border: 0; color: var(--accent); padding: 2px 0; font-size: 13px; text-decoration: underline; cursor: pointer; }
.verif__proposition { display: block; margin-top: 4px; text-align: left; }
.actions--word { margin: 12px 0 8px; }
.verif__entendu { display: block; font-size: 13px; color: var(--texte-2); margin-top: 4px; }
.verif__entendu em { font-style: normal; text-decoration: line-through; }
tr.est-corrige .verif__saisie { border-color: var(--accent); }
.verif-reste { margin: 16px 0; }
.verif-reste summary { cursor: pointer; color: var(--texte-2); font-size: 14px; padding: 8px 0; }
.verif__ecouter { min-width: 40px; }
tr.est-doute .verif__saisie { border-color: var(--attention); }
tr.est-valide td { background: #F1F8F1; }
tr.est-valide .verif__valider { border-color: #2E7D32; color: #2E7D32; }
.verif__type { display: block; font-size: 12px; color: var(--texte-2); font-weight: 400; }
.verif__saisie { width: 100%; min-width: 180px; }
.verif__saisie.est-modifie { border-color: var(--accent); background: var(--accent-clair); }
.verif__contexte { color: var(--texte-2); max-width: 420px; }
.verif__horodatage { white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--texte-2); }

.fiche h3 { font-size: 15px; margin: 16px 0 6px; color: var(--primaire); }
.fiche ul { margin: 0; padding-left: 20px; }
.fiche li { margin: 4px 0; }
.fiche .instruction { color: var(--danger); background: #FFF6BF; padding: 1px 4px; border-radius: 4px; }
.fiche .discret { color: var(--texte-2); font-size: 13px; }

.secret { background: var(--attention-clair); border-radius: 8px; padding: 12px; margin: 12px 0; }
.secret__titre { margin: 0 0 6px; font-weight: 600; color: var(--attention); }
.secret__valeur { margin: 0; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.secret__valeur code { font-size: 18px; letter-spacing: .04em; background: var(--surface); padding: 6px 10px; border-radius: 6px; border: 1px solid var(--bord); }
.etat-cle { margin: 0 0 12px; }

/* ── Parcours expert (instance pilote), conception V0 du 08/10/2026 ─────────────────────────── */
.entete__sous { font-weight: 400; color: var(--texte-2); font-size: 13px; margin-left: 8px; }
.champ--numero { max-width: 340px; }
.saisie--numero { font-size: 20px; letter-spacing: .04em; }
.depot-grille { display: grid; grid-template-columns: 1.15fr 1fr; gap: 24px; align-items: start; }
@media (max-width: 860px) { .depot-grille { grid-template-columns: 1fr; } }
.zone--grande { min-height: 220px; }
.conseil { background: var(--accent-clair); border-radius: 8px; padding: 12px 14px; margin: 14px 0; font-size: 14px; }
.conseil p { margin: 0; }
/* Le micro dans la page (étape 4) : un bouton, puis pendant l'enregistrement le point rouge, le compteur et trois gestes */
.micro { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 14px; }
.micro__etat { display: inline-flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.micro__point { width: 12px; height: 12px; border-radius: 50%; background: var(--danger); animation: micro-clignote 1s steps(1) infinite; }
@keyframes micro-clignote { 50% { opacity: .2; } }
.micro__duree { font-variant-numeric: tabular-nums; font-weight: 600; min-width: 64px; }
.micro__aide { font-size: 13px; color: var(--texte-2); }
.micro__attente { display: inline-flex; align-items: center; gap: 10px; flex-wrap: wrap; width: 100%; padding: 8px 12px; border-radius: 8px; background: var(--attention-clair); color: var(--attention); font-size: 14px; }
.tete-liste--serree { margin-bottom: 6px; }
.panneau { list-style: none; margin: 0; padding: 0; }
.panneau__ligne { border: 1px solid var(--bord); border-radius: 8px; padding: 8px 10px; margin-bottom: 8px; background: var(--surface); transition: background var(--duree), border-color var(--duree); }
.panneau__ligne.est-survolee { border-color: var(--accent); background: var(--accent-clair); }
.panneau__tete { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.panneau__titre { font-weight: 600; font-size: 14px; }
.panneau__usage { margin: 2px 0 0; font-size: 12px; line-height: 1.4; color: var(--texte-2); }     /* lot D3 : ce que l'outil fait du bloc */
.panneau__pieces { list-style: none; margin: 6px 0 0; padding: 0; }
.piece { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 13px; padding: 4px 0; cursor: grab; }
.piece__marque { width: 16px; text-align: center; color: var(--ok); font-weight: 700; }
.piece--supposee .piece__marque { color: var(--attention); }
.piece__nom { font-weight: 500; overflow-wrap: anywhere; }
.piece__detail, .piece__sur { color: var(--texte-2); font-size: 12px; }
.piece--supposee .piece__sur { color: var(--attention); font-weight: 600; }
.piece--inconnue .piece__sur { color: var(--danger); font-weight: 600; }
.saisie--petite { min-height: 28px; padding: 2px 6px; font-size: 12px; }
.panneau__nature { max-width: 160px; }
.piece__retirer { color: var(--texte-2); }
.panneau__manque { margin-top: 6px; font-size: 13px; color: var(--danger); }
.panneau__consequence { display: block; color: var(--attention); background: var(--attention-clair); padding: 4px 8px; border-radius: 6px; margin-top: 2px; font-weight: 400; }
.actions--fin { display: flex; align-items: center; gap: 16px; margin-top: 18px; flex-wrap: wrap; }
.btn--grand { font-size: 17px; padding: 12px 28px; }
.aide--petite { font-size: 13px; margin-top: 8px; }
.etat { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 13px; font-weight: 600; }
.etat--rempli { background: var(--ok-clair); color: var(--ok); }
.etat--partiel { background: var(--attention-clair); color: var(--attention); }
.etat--vide { background: var(--fond); color: var(--texte-2); }
.etat--retire { background: var(--fond); color: var(--texte-2); text-decoration: line-through; }
.bilan__origine { color: var(--texte-2); font-size: 14px; }
.bandeau { background: var(--attention-clair); border: 1px solid #F0D28A; border-radius: var(--rayon); padding: 16px 20px; margin-top: 20px; }
.bandeau .soustitre { color: var(--attention); }
.bandeau__groupe { margin-top: 8px; }
.bandeau__titre { font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--attention); margin: 0 0 4px; }
.bandeau__liste { margin: 0; padding-left: 18px; }
.bloc-liste { margin-top: 16px; }
.soustitre--petit { font-size: 15px; }

/* ── Étape 2 : le contrôle en quatre onglets, « Faire un retour », retours de l'admin (plan du 09/10/2026) ──────── */
.tete-liste__droite { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.onglets { display: flex; gap: 4px; border-bottom: 1px solid var(--bord); margin: 4px 0 18px; overflow-x: auto; }
.onglet { font: inherit; font-weight: 600; background: transparent; border: 0; border-bottom: 3px solid transparent; color: var(--texte-2); padding: 10px 14px; cursor: pointer; display: flex; align-items: center; gap: 8px; white-space: nowrap; margin-bottom: -1px; min-height: 44px; transition: color var(--duree), background var(--duree); }
.onglet:hover { color: var(--texte); background: var(--fond); }
.onglet[aria-selected="true"] { color: var(--accent); border-bottom-color: var(--accent); }
.onglet:focus-visible { outline: 3px solid #F4A15D; outline-offset: -3px; }
.badge { display: inline-block; min-width: 22px; padding: 0 8px; border-radius: 999px; font-size: 12px; font-weight: 700; line-height: 20px; text-align: center; background: var(--attention-clair); color: var(--attention); }
.badge--ok { background: var(--ok-clair); color: var(--ok); }
.badge--neutre { background: var(--fond); color: var(--texte-2); font-weight: 600; }
.badge:empty { display: none; }
.panneau-onglet { min-height: 200px; }
.bloc { border: 1px solid var(--bord); border-radius: 8px; margin-bottom: 14px; overflow: hidden; }
.bloc__tete { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 8px 14px; background: var(--fond); border-bottom: 1px solid var(--bord); }
.bloc__tete .soustitre { margin: 0; }
.bloc__vide { padding: 10px 14px; margin: 0; }
.lignes-verif { list-style: none; margin: 0; padding: 0; }
.ligne-verif { display: grid; grid-template-columns: 56px 1fr auto; gap: 8px 14px; align-items: start; padding: 10px 14px; border-bottom: 1px dotted var(--bord); }
.ligne-verif:last-child { border-bottom: 0; }
.ligne-verif.est-valide { background: #F1F8F1; }
.ligne-verif.est-valide .verif-ok { border-color: #2E7D32; color: #2E7D32; background: var(--ok-clair); }
.ligne-verif.est-ecarte { color: var(--texte-2); }
.verif__heure { white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--texte-2); padding-top: 6px; font-size: 14px; }
.verif__corps { min-width: 0; }
.verif__valeurs { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.verif__entendu { color: var(--texte-2); font-size: 14px; }
.verif__entendu s { opacity: .85; }
.verif-ecrit { min-width: 200px; font-weight: 600; }
.verif-ecrit.est-modifie { border-color: var(--accent); background: var(--accent-clair); }
.verif__contexte { color: var(--texte-2); font-size: 14px; margin-top: 4px; }
.verif__pourquoi { color: var(--accent); font-size: 13px; margin-top: 2px; }
.verif__gestes { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.verif-ecouter.est-en-lecture, #ecouter-tout.est-en-lecture { border-color: var(--accent); color: var(--accent); }
.passage__texte { font-style: italic; }
.passage__voix { display: inline-block; font-size: 12px; color: var(--texte-2); border: 1px solid var(--bord, #ccc); border-radius: 4px; padding: 0 5px; margin-right: 6px; white-space: nowrap; vertical-align: middle; }
.est-assure .passage__voix { font-weight: 600; }
.passage__note { color: var(--texte-2); font-size: 13px; margin-top: 2px; }
.passages { margin: 0; padding: 0 0 8px; list-style: none; }
.passages li { padding: 4px 0; border-bottom: 1px dotted var(--bord); font-size: 14px; }
.passages li:last-child { border-bottom: 0; }
@media (max-width: 640px) { .ligne-verif { grid-template-columns: 1fr; } .verif__heure { padding-top: 0; } .verif__gestes { justify-content: flex-start; } }

/* Onglet Dossier : les écarts entre pièces en jaune, puis un seul tableau groupé ; la valeur retenue se corrige sur place */
.ecarts { list-style: none; margin: 0 0 12px; padding: 10px 12px; background: var(--attention-clair); color: var(--attention); border: 1px solid #F0D28A; border-radius: 8px; font-size: 14px; }
.ecarts li { padding: 2px 0; }
.ecarts li::before { content: "Écart · "; font-weight: 700; }
.dossier__saisie { width: 100%; box-sizing: border-box; font: inherit; padding: 4px 8px; border: 1px solid var(--bord); border-radius: 6px; background: #fff; color: var(--texte); }
.dossier__saisie::placeholder { color: var(--texte-2); font-style: italic; }
tr.donnee.est-doute .dossier__saisie { border-color: var(--attention); background: var(--attention-clair); }
.dossier__autres { color: var(--texte-2); font-size: 12px; margin-top: 3px; }
tr.groupe th { background: var(--fond); color: var(--texte-2); font-size: 12px; text-transform: uppercase; letter-spacing: .05em; padding: 6px 12px; text-align: left; border-bottom: 1px solid var(--bord); }
tr.donnee.est-doute .dossier__valeur { background: var(--attention-clair); color: var(--attention); }
tr.donnee.est-vide .dossier__valeur { color: var(--texte-2); font-style: italic; }
.dossier__donnee { color: var(--texte-2); white-space: nowrap; }
.dossier__origine { color: var(--texte-2); font-size: 13px; }
#dossier-confirmer[aria-pressed="true"] { border-color: #2E7D32; color: #2E7D32; background: var(--ok-clair); }

/* Onglet Photos : grille de cartes, trois colonnes puis deux sur petit écran, le compte à droite */
.photos-outils { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; font-size: 14px; color: var(--texte-2); }
.photos-outils__groupe { display: inline-flex; align-items: center; gap: 6px; }
.photos-outils__filtre .btn--lien[aria-pressed="true"] { color: var(--texte); text-decoration: none; font-weight: 700; }
.photos-corps { display: grid; grid-template-columns: 1fr 320px; gap: 18px; align-items: start; }   /* R22 : le bandeau de droite, plus large */
@media (max-width: 860px) { .photos-corps { grid-template-columns: 1fr; } }
.photos-grille { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
@media (max-width: 640px) { .photos-grille { grid-template-columns: repeat(2, 1fr); } }
.photo { border: 2px solid var(--bord); border-radius: 8px; overflow: hidden; background: var(--surface); display: flex; flex-direction: column; transition: border-color var(--duree); }
.photo.est-choisie { border-color: var(--accent); }
.photo--illisible { opacity: .55; }
.photo__cadre { position: relative; background: var(--fond); aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; }
.photo__apercu { width: 100%; height: 100%; object-fit: cover; display: block; cursor: zoom-in; }
.photo__vide, .photo__illisible { color: var(--texte-2); font-size: 14px; font-style: italic; }
.photo__rang { position: absolute; top: 6px; left: 6px; background: var(--accent); color: #fff; border-radius: 6px; padding: 0 8px; font-weight: 700; font-size: 13px; line-height: 22px; }
.photo__case { position: absolute; top: 6px; right: 6px; background: rgba(255, 255, 255, .92); border-radius: 6px; padding: 2px 8px; font-size: 13px; display: flex; align-items: center; gap: 4px; cursor: pointer; }
.photo__choix { width: 18px; height: 18px; margin: 0; accent-color: var(--accent); }
.photo__pied { display: flex; flex-direction: column; gap: 6px; padding: 8px; font-size: 13px; }
.photo__nom { color: var(--texte-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.photo__legende { font-style: italic; }
.photo__ordre { display: flex; gap: 10px; }
.photos-cote { border: 1px solid var(--bord); border-radius: 8px; padding: 12px 14px; background: var(--fond); }
.photos-cote .soustitre { margin-bottom: 6px; }
.photos-par-chapitre { list-style: none; margin: 0 0 8px; padding: 0; }
.photos-par-chapitre li { display: block; padding: 4px 0; border-bottom: 1px dotted var(--bord); font-size: 14px; }
.photos-par-chapitre__nb { font-weight: 700; }

/* La barre du bas, toujours visible : le compte des points à voir et « Produire le rapport » */
.barre-fin { position: sticky; bottom: 0; display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 24px; margin: 18px -24px -24px; background: var(--surface); border-top: 1px solid var(--bord); border-radius: 0 0 var(--rayon) var(--rayon); z-index: 10; }

/* Les dialogues : « Faire un retour » et la photo en grand ; l'attribut open suffit quand showModal manque */
.dialogue { border: 1px solid var(--bord); border-radius: var(--rayon); box-shadow: 0 8px 30px rgba(16, 24, 40, .2); padding: 24px; max-width: 560px; width: calc(100% - 32px); max-height: 90vh; overflow: auto; color: var(--texte); background: var(--surface); }
.dialogue::backdrop { background: rgba(16, 24, 40, .45); }
.dialogue[open] { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); margin: 0; z-index: 40; }
.dialogue--image { max-width: min(96vw, 1200px); width: auto; text-align: center; }
.dialogue--image img { max-width: 92vw; max-height: 78vh; display: block; margin: 0 auto 8px; }
.admin-retours__texte { max-width: 480px; overflow-wrap: anywhere; }

/* Onglet Cartes (étape 4) : l'adresse du risque, le recalcul, trois vues IGN à garder ou écarter (vue-carte : .carte est la
   grande carte blanche de la page) */
.cartes__adresse { margin: 0 0 8px; font-size: 15px; }
.cartes__alerte { background: var(--attention-clair); color: var(--attention); border: 1px solid #F0D28A; border-radius: 8px; padding: 8px 12px; margin: 0 0 10px; font-size: 14px; }
.cartes-form { display: grid; grid-template-columns: 1.4fr 1fr auto; gap: 12px; align-items: end; margin-bottom: 8px; }
@media (max-width: 860px) { .cartes-form { grid-template-columns: 1fr; } }
.cartes-form .champ { margin-bottom: 0; }
.cartes-grille { list-style: none; margin: 0 0 10px; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
@media (max-width: 860px) { .cartes-grille { grid-template-columns: 1fr; } }
.vue-carte { border: 2px solid var(--bord); border-radius: 8px; overflow: hidden; background: var(--surface); display: flex; flex-direction: column; transition: border-color var(--duree), opacity var(--duree); }
.vue-carte.est-gardee { border-color: var(--accent); }
.vue-carte.est-ecartee { opacity: .6; }
.vue-carte__cadre { background: var(--fond); aspect-ratio: 3 / 2; display: flex; align-items: center; justify-content: center; }
.vue-carte__image { width: 100%; height: 100%; object-fit: cover; display: block; cursor: zoom-in; }
.vue-carte__panne { color: var(--attention); font-size: 14px; padding: 12px; text-align: center; }
.vue-carte__pied { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 8px; font-size: 14px; }
.vue-carte__titre { font-weight: 600; }
.vue-carte__bascule[aria-pressed="true"] { border-color: var(--accent); color: var(--accent); }

/* ── Retours V0.1, lot B (14/10/2026) ─────────────────────────────────────────────────────────────────── */
/* R1 : le nombre de fichiers d'un bloc, et le bouton qui l'ouvre en entier */
.panneau__nb { font-size: 12px; color: var(--texte-2); background: var(--fond); border-radius: 999px; padding: 0 8px; margin-left: auto; margin-right: 8px; }
.panneau__plier { display: block; margin-top: 4px; font-size: 13px; }
/* R7 : la légende de l'onglet Dossier */
.legende { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0 0 10px; font-size: 13px; color: var(--texte-2); }
.legende__item { display: inline-flex; align-items: center; gap: 6px; }
.legende__pastille { display: inline-block; width: 14px; height: 14px; border-radius: 3px; border: 1px solid var(--bord); }
.legende__pastille--jaune { background: var(--attention-clair); border-color: #F0D28A; }
.legende__pastille--blanc { background: var(--surface); }
.legende__pastille--vide { width: auto; height: auto; padding: 0 6px; font-style: italic; color: var(--texte-2); background: var(--surface); }
/* R8 : la liste des onglets non ouverts dans la boîte d'avertissement */
.produire__liste { margin: 0 0 12px; padding-left: 20px; font-weight: 600; }
/* R11 : l'ordre des photos dit en clair */
.photo__ordre { align-items: center; flex-wrap: wrap; }
.photo__ordre-texte { color: var(--texte-2); font-size: 12px; }
/* R12 : le chapitre des cartes, en tête et sous chaque vue */
.cartes__chapitre { margin: 0 0 8px; font-size: 14px; font-weight: 600; color: var(--primaire); }
.vue-carte__sort { padding: 0 8px 8px; font-size: 13px; color: var(--texte-2); }
.vue-carte.est-gardee .vue-carte__sort { color: var(--accent); font-weight: 600; }
/* R4 : l'écran d'attente après « Lancer » : quatre étapes, la courante en orange, les faites en vert */
.attente__etat { margin: 0; color: var(--texte-2); font-size: 15px; }
.etapes { list-style: none; margin: 8px 0 16px; padding: 0; display: grid; gap: 8px; }
.etape { display: grid; grid-template-columns: 28px 1fr; gap: 2px 12px; align-items: center; padding: 10px 14px; border: 1px solid var(--bord); border-radius: 8px; background: var(--surface); color: var(--texte-2); }
.etape__marque { width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--bord); grid-row: 1 / span 2; }
.etape__titre { font-weight: 600; }
.etape__note { font-size: 13px; }
.etape.est-faite { color: var(--texte); }
.etape.est-faite .etape__marque { background: var(--ok); border-color: var(--ok); }
.etape.est-en-cours { color: var(--texte); border-color: var(--accent); background: var(--accent-clair); }
.etape.est-en-cours .etape__marque { border-color: var(--accent); background: var(--accent); animation: micro-clignote 1.2s steps(1) infinite; }
.etape.est-arretee { border-color: var(--danger); color: var(--danger); }
.etape.est-arretee .etape__marque { border-color: var(--danger); background: var(--danger-clair); }
.attente__libelle { margin: 0 0 4px; font-size: 15px; font-weight: 600; color: var(--primaire); min-height: 1.5em; }

/* ── Retours V0.1, lot D (14/10/2026) ─────────────────────────────────────────────────────────────────── */
/* R19 : la ligne de résumé en tête de l'écran de contrôle ; la dictée sous les tableaux du Dossier */
.controle__resume { margin: -8px 0 10px; font-size: 14px; }
.bloc__aide { margin: 8px 14px 0; }
.verif-reste--dans-bloc { margin: 0; padding: 0 14px 8px; }
.dictee__outils { padding: 6px 0 8px; font-size: 13px; }
.passage__sort { white-space: nowrap; }
/* R6 : un tableau par partie, dans l'ordre des premières pages de la trame ; une sous-ligne en retrait sous sa case */
.dossier-tables { margin-bottom: 8px; }
.dossier-partie { margin-bottom: 18px; }
.dossier-partie__titre { font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--primaire); margin: 0 0 6px; }
.dossier-partie .tableau-cadre { margin-bottom: 0; }
.dossier-table .dossier__donnee { width: 34%; white-space: normal; }
tr.est-sous-ligne .dossier__donnee { padding-left: 32px; font-size: 13px; }
tr.est-sous-ligne .dossier__donnee::before { content: "· "; }
/* R35 : le bilan de l'écran 3 par partie (en gras, un trait au-dessus) et sous-partie (en retrait) */
.bilan__ligne--niveau-1 td { border-top: 2px solid var(--bord); }
.bilan__titre--niveau-1 { font-weight: 700; color: var(--primaire); }
.bilan__titre--niveau-2 { padding-left: 32px; }
.bilan__titre--niveau-2::before { content: "· "; color: var(--texte-2); }
.bilan__titre--niveau-3 { padding-left: 52px; }
/* R36 : les consignes non écrites, au-dessus du tableau, en couleur d'attention */
.bloc-liste--consignes { margin: 0 0 16px; padding: 12px 16px; background: var(--attention-clair); border: 1px solid #F0D28A; border-radius: 8px; }
.bloc-liste--consignes .soustitre { color: var(--attention); }
.bloc-liste--consignes .fichiers { margin-bottom: 0; }
.bloc-liste--consignes .fichiers li { justify-content: flex-start; }

/* Lots D2 et E2 (14/10/2026 au soir) */
.verif__attendu { color: var(--texte); font-size: 13px; margin-top: 4px; padding: 6px 10px; background: var(--fond); border-left: 3px solid var(--bord); border-radius: 0 6px 6px 0; }   /* R46 : ce qu'on attend de la ligne */
.dossier__relevees { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 4px; font-size: 12px; }   /* R45 : la liste des valeurs relevées */
.dossier__choix { max-width: 100%; }
.profil-grille { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 20px; }   /* R44 : le profil de l'expert */
@media (max-width: 760px) { .profil-grille { grid-template-columns: 1fr; } }
.rapport__relance { background: var(--attention-clair); color: var(--attention); border-radius: 8px; padding: 8px 12px; margin: 0 0 10px; }   /* R9 : pourquoi une relance est utile */
.rapport-detail { margin: 0 0 14px; }   /* R42 : le détail de l'écran 3, replié */
.rapport-detail > summary { cursor: pointer; color: var(--texte-2); font-size: 14px; }
.rapport-detail p { margin: 6px 0 0 16px; }
.cartes__choix { max-width: 520px; }   /* R12 : le chapitre des cartes */
.cartes__choix .saisie { min-height: 36px; }
#attente-arreter-note { font-size: 13px; max-width: 520px; }   /* R20 : ce que fait « Arrêter » */
.trame-bloc { background: var(--surface); border: 1px solid var(--bord); border-left: 4px solid var(--accent); border-radius: 8px; padding: 12px 14px 10px; margin-bottom: 14px; }   /* R16 : la trame, visible */
.trame-bloc .champ { margin-bottom: 6px; }
.trame-bloc__note { margin: 0; font-size: 13px; color: var(--texte-2); }
.construction__tete { display: flex; align-items: baseline; gap: 2px; flex-wrap: wrap; }   /* R22 : la construction du rapport */
.construction__chapitre--niveau-2 .construction__titre, .construction__chapitre--niveau-3 .construction__titre { padding-left: 14px; font-size: 13px; }
.construction__chapitre--niveau-3 .construction__titre { padding-left: 28px; }
.construction__chapitre.est-vide .construction__titre { color: var(--texte-2); }
.construction__cartes { color: var(--texte-2); font-size: 13px; }
.vignettes { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 2px; }
.vignette__cadre { position: relative; display: inline-block; }
.vignette { display: block; width: 56px; height: 42px; object-fit: cover; border-radius: 4px; border: 1px solid var(--bord); cursor: pointer; background: var(--surface); }
.vignette--texte { cursor: default; }
.vignette__rang::after { content: attr(data-rang); position: absolute; left: 2px; top: 2px; background: var(--primaire); color: var(--sur-primaire); font-size: 10px; line-height: 14px; padding: 0 4px; border-radius: 999px; }
/* R33 : « Revenir au contrôle » sur l'écran d'attente après un échec de production */
#attente-controle { margin-right: 8px; }

/* ── Retours V0.1, lot D4 (15/10/2026) ─────────────────────────────────────────────────────────────────── */
/* R60 : le contrôle prend toute la largeur de la fenêtre (les photos d'abord) */
.principal--large { max-width: 1760px; }
/* R56 : jamais d'ascenseur horizontal dans le Dossier : colonnes fixes, la valeur et ses valeurs relevées passent à la ligne */
.dossier-table { table-layout: fixed; }
.dossier-table thead th:nth-child(1) { width: 24%; }
.dossier-table thead th:nth-child(2) { width: 52%; }
.dossier-table thead th:nth-child(3) { width: 24%; }
.dossier-table td { overflow-wrap: anywhere; }
textarea.dossier__saisie { display: block; resize: none; overflow: hidden; min-height: 32px; line-height: 1.4; padding: 5px 8px; white-space: pre-wrap; overflow-wrap: anywhere; field-sizing: content; }
.dossier__relevees { display: block; margin-top: 4px; font-size: 12px; }
.dossier__relevees > summary { cursor: pointer; color: var(--texte-2); }
.dossier__choix { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 4px; }
.dossier__relevee { display: block; width: 100%; text-align: left; font: inherit; font-size: 13px; padding: 4px 8px; border: 1px solid var(--bord); border-radius: 6px; background: var(--surface); color: var(--texte); white-space: normal; overflow-wrap: anywhere; cursor: pointer; }
.dossier__relevee:hover { border-color: var(--accent); }
.dossier__relevee:focus-visible { outline: 3px solid #F4A15D; outline-offset: 1px; }
.dossier__relevee.est-choisie { border-color: var(--accent); background: var(--accent-clair); }
.dossier__relevee-origine { color: var(--texte-2); }
/* R60 : les photos sur toute la largeur à gauche du bandeau ; le bandeau suit le défilement (top réglé par le script) */
.photos-corps { grid-template-columns: minmax(0, 1fr) 340px; }
.photos-grille { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
.photos-cote { position: sticky; top: 72px; align-self: start; }
@media (max-width: 860px) { .photos-corps { grid-template-columns: 1fr; } .photos-cote { position: static; } }
@media (max-width: 640px) { .photos-grille { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); } }
.photos-outils__confirmer { margin-left: auto; }
#photos-confirmer[aria-pressed="true"], #cartes-confirmer[aria-pressed="true"] { border-color: #2E7D32; color: #2E7D32; background: var(--ok-clair); }
/* R61 : glisser une photo de la grille ou une vignette du bandeau sur un chapitre */
.photo__cadre[draggable="true"], .vignette__cadre[draggable="true"] { cursor: grab; }
.est-en-glisse .construction__chapitre { transition: background var(--duree); }
.construction__chapitre.est-survolee { background: var(--accent-clair); outline: 2px dashed var(--accent); outline-offset: -2px; border-radius: 4px; }
.vignette-carte { display: block; width: 56px; height: 42px; object-fit: cover; border-radius: 4px; border: 2px solid var(--primaire); cursor: pointer; }
/* R62 : la place de chaque carte, « dupliquer », les copies ; R58 : la liste des adresses */
.vue-carte__placer { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 0 8px 8px; }
.vue-carte__placer .saisie { flex: 1 1 160px; min-width: 0; max-width: 100%; }
.vue-carte--copie { border-style: dashed; }
.cartes__adresses { max-width: 760px; }
.cartes__adresses .saisie { max-width: 100%; }
/* ── Lot D5 (15/10/2026) ───────────────────────────────────────────────────────────────────────── */
/* R68 : le bloc rouge des divergences entre le dicté et les pièces, sous la légende ; la ligne marquée ; trancher un mot du texte */
.badge--rouge { background: var(--danger-clair); color: var(--danger); }
.legende__pastille--rouge { background: var(--danger-clair); border-color: #F5C2BC; box-shadow: inset 3px 0 0 var(--danger); }
.divergences { margin: 0 0 14px; padding: 12px 16px; background: var(--danger-clair); border: 1px solid #F5C2BC; border-left: 5px solid var(--danger); border-radius: 8px; color: var(--texte); }
.divergences__tete { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; }
.divergences__tete .soustitre { color: var(--danger); margin: 0; }
.divergences__aide { margin: 0 0 8px; font-size: 14px; }
.divergences__liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.divergence { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; padding: 6px 10px; background: var(--surface); border: 1px solid #F5C2BC; border-radius: 6px; font-size: 14px; }
.divergence__texte { flex: 1 1 320px; min-width: 0; overflow-wrap: anywhere; }
.divergence__etat { font-weight: 700; color: var(--danger); }
.divergence.est-tranchee { border-color: var(--bord); }
.divergence.est-tranchee .divergence__etat { color: var(--ok); }
.divergence__gestes { display: flex; flex-wrap: wrap; gap: 6px; }
.divergence__gestes--choix { flex-basis: 100%; }
.divergence__choix { display: inline-block; width: auto; font-size: 13px; }
tr.donnee.est-divergence > td:first-child { box-shadow: inset 4px 0 0 var(--danger); }
tr.donnee.est-divergence .dossier__valeur { background: var(--danger-clair); }
tr.donnee.est-divergence .dossier__saisie { border-color: var(--danger); background: var(--surface); }   /* la ligne porte aussi doute: true (F5) : le rouge l'emporte */
.dossier__divergence { display: inline-block; margin-left: 6px; padding: 0 6px; border-radius: 4px; background: var(--danger); color: #fff; font-size: 11px; font-weight: 700; line-height: 18px; white-space: nowrap; }
tr.donnee.est-montree > td { outline: 2px solid var(--danger); outline-offset: -2px; }
/* R66 : la zone de dépôt de l'onglet Photos, plus basse que celle de l'écran 1 */
.zone--photos { padding: 14px 16px; margin-bottom: 12px; }
.zone--photos.est-en-envoi { border-color: var(--accent); background: var(--accent-clair); cursor: progress; }
.zone__etat { font-size: 13px; color: var(--texte); }
.zone__etat:empty { display: none; }
.photo.est-nouvelle { border-color: var(--ok); }
.photo__nouvelle { position: absolute; bottom: 6px; left: 6px; background: var(--ok); color: #fff; border-radius: 6px; padding: 0 8px; font-weight: 700; font-size: 12px; line-height: 22px; }
/* L'onglet Plan : les pages en vignettes, une carte par plan (images, tableau, doutes, « Redessiner ») */
.plan-pages { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.plan-page { display: flex; flex-direction: column; gap: 2px; width: 150px; padding: 6px; border: 1px solid var(--bord); border-radius: 8px; background: var(--surface); font-size: 13px; }
.plan-page.est-lue { cursor: pointer; border-color: var(--accent); }
.plan-page__img { width: 100%; height: 96px; object-fit: contain; background: var(--fond); border-radius: 4px; }
.plan-page__vide { display: block; width: 100%; height: 96px; background: repeating-linear-gradient(45deg, var(--fond), var(--fond) 8px, #EDEFF2 8px, #EDEFF2 16px); border-radius: 4px; }
.plan-page__titre { font-weight: 600; overflow-wrap: anywhere; }
.plan-page__sort { color: var(--texte-2); }
.plan-carte { border: 1px solid var(--bord); border-radius: var(--rayon); padding: 14px 16px; margin-bottom: 16px; background: var(--surface); }
.plan-carte__tete { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; margin-bottom: 10px; }
.plan-carte__titre { margin: 0; overflow-wrap: anywhere; }
.plan-carte__meta { margin: 0; }
.plan-images { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 10px; }
@media (max-width: 760px) { .plan-images { grid-template-columns: 1fr; } }
.plan-image { margin: 0; border: 2px solid var(--accent); border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; background: var(--surface); }
.plan-image.est-ecartee { border-color: var(--bord); opacity: .6; }
.plan-image__img { display: block; width: 100%; height: 300px; object-fit: contain; background: var(--fond); cursor: zoom-in; }
.plan-image__vide { display: flex; align-items: center; justify-content: center; height: 120px; color: var(--texte-2); background: var(--fond); }
.plan-image__legende { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding: 8px 10px; font-size: 14px; }
.plan-image__titre { font-weight: 700; }
.plan-image__sort { flex: 1 1 auto; color: var(--accent); font-weight: 600; }
.plan-image.est-ecartee .plan-image__sort { color: var(--texte-2); }
.plan-carte__cotes { font-size: 13px; color: var(--texte-2); margin: 0 0 8px; overflow-wrap: anywhere; }
.plan-table { table-layout: fixed; width: 100%; }
.plan-table th:nth-child(1) { width: 26%; } .plan-table th:nth-child(6) { width: 16%; } .plan-table th:nth-child(7) { width: 12%; } .plan-table th:nth-child(8) { width: 8%; }
.plan-table td { vertical-align: top; }
.plan-ligne__champ { width: 100%; min-width: 0; }
.plan-ligne__lue { display: block; font-size: 11px; color: var(--texte-2); margin-top: 2px; overflow-wrap: anywhere; }
.plan-ligne__surface { white-space: nowrap; font-variant-numeric: tabular-nums; padding-top: 14px; }
.plan-table .plan-ligne__retirer { padding-top: 6px; }
tr.plan-ligne.est-doute > td { background: var(--attention-clair); }
.plan-ligne__champ.est-doute { border-color: var(--attention); background: #FFFBEA; }
.plan-carte__outils { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; margin: 8px 0; font-size: 14px; }
.plan-carte__nord-champ { display: inline-flex; align-items: center; gap: 6px; }
.plan-doutes-bloc { margin: 6px 0 10px; padding: 8px 12px; background: var(--attention-clair); border: 1px solid #F0D28A; border-radius: 8px; color: var(--attention); }
.plan-doutes__titre { margin: 0 0 4px; font-size: 14px; }
.plan-doutes { margin: 0; padding-left: 18px; font-size: 14px; }
.plan-doutes li { overflow-wrap: anywhere; }
.plan-carte__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.plan-carte__etat { margin: 0; color: var(--attention); }
.plan-carte__message { margin: 0; }
#plan-confirmer[aria-pressed="true"] { border-color: #2E7D32; color: #2E7D32; background: var(--ok-clair); }
.divergences .badge--rouge { background: var(--danger); color: #fff; }

/* ── Lot D3 (R27) et R17 (15/10/2026) ─────────────────────────────────────────────────────────────────── */
/* D3 : une pièce glissée sur un bloc de plusieurs natures y attend que l'expert dise ce qu'elle est */
.piece--a-dire { background: var(--attention-clair); border-radius: 6px; padding: 4px 6px; }
.piece--a-dire .piece__sur { color: var(--attention); font-weight: 600; }
/* R17 : « Faire un retour » avec le micro et des captures d'écran ; l'écoute et les captures dans l'admin */
.retour__joindre { display: flex; flex-direction: column; gap: 10px; margin: 4px 0 12px; }
.retour__ligne { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.retour__voix audio { height: 32px; max-width: 100%; }
.retour__captures { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.retour__captures li { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 104px; font-size: 12px; }
.retour__vignette { display: block; width: 96px; height: 64px; object-fit: cover; border: 1px solid var(--bord); border-radius: 6px; background: var(--fond); }
.retour__capture-nom { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--texte-2); }
.dialogue.est-survolee { outline: 3px dashed var(--accent); outline-offset: -6px; }
.admin-retours__jointes { min-width: 180px; }
.admin-retours__jointes audio { display: block; height: 32px; width: 220px; max-width: 100%; margin-bottom: 4px; }
.admin-retours__jointes a { display: inline-block; margin: 0 4px 4px 0; }
.admin-retours__jointes .retour__vignette { width: 72px; height: 48px; }