:root {
  --fond: #f6f3ec;
  --surface: #fffdf8;
  --texte: #1f1a17;
  --discret: #6b635b;
  --ligne: #e2dbcd;
  --accent: #02234E; /* bleu marine du logo (08/10/2026 ; bordeaux avant) */
  --accent-clair: #e6ebf3;
  --logo-bleu: #02234E;
  --accent-texte: #fffdf8;
  /* Fond des éléments pleins (bouton principal, onglet actif) portant un texte --accent-texte, et texte des boutons
     secondaires : distincts de --accent là où le contraste l'exige (interface épurée, 4,5:1 au moins). */
  --accent-plein: var(--accent);
  --accent-secondaire: var(--accent);
  --majeur: #b42318;
  --important: #b54708;
  --mineur: #475467;
  --conforme: #067647;
  --ombre: 0 1px 2px rgb(40 30 20 / 6%), 0 4px 16px rgb(40 30 20 / 5%);
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root {
    --fond: #1a1614;
    --surface: #24201d;
    --texte: #eee8df;
    --discret: #a89f94;
    --ligne: #3a332e;
    --accent: #a9bfe3;
    --accent-clair: #1f2a3b;
    --logo-bleu: #E6ECF5;
    --accent-texte: #1a1614;
    --majeur: #f97066;
    --important: #fdb022;
    --mineur: #98a2b3;
    --conforme: #47cd89;
    --ombre: none;
    color-scheme: dark;
  }
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--fond);
  color: var(--texte);
  font: 15px/1.55 var(--sans);
}
h1, h2, h3 { font-family: var(--serif); font-weight: 600; line-height: 1.25; margin: 0 0 .4em; }
h1 { font-size: 1.75rem; }
h2 { font-size: 1.25rem; }
h3 { font-size: 1.05rem; }
a { color: var(--accent); }
[hidden] { display: none !important; }

/* Empilement : en-tête 30, bandeaux (réseau, nouvelle version) 25, barre de sélection des dossiers 20, encart des envois
   50 (en bas de l'écran). */
.barre {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 12px 24px; background: var(--surface); border-bottom: 1px solid var(--ligne);
  position: sticky; top: 0; z-index: 30; flex-wrap: wrap;
}
/* Sous 820 px, l'en-tête défile avec la page : collant, il occupait jusqu'au tiers de l'écran d'un iPhone. */
@media (max-width: 820px) { .barre { position: static; } }
.marque { display: flex; align-items: center; gap: 9px; text-decoration: none; color: var(--texte); font-family: var(--serif); font-size: 1.15rem; font-weight: 600; }
nav { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
nav a { text-decoration: none; color: var(--discret); font-weight: 500; }
nav a.actif, nav a:hover { color: var(--accent); }

main { max-width: 1080px; margin: 0 auto; padding: 28px 24px 64px; }
.etroite, .carte.etroite { max-width: 560px; margin-left: auto; margin-right: auto; }
.carte.etroite { margin-top: 6vh; }
.carte { background: var(--surface); border: 1px solid var(--ligne); border-radius: 12px; padding: 20px 22px; margin: 0 0 18px; box-shadow: var(--ombre); }
.discret { color: var(--discret); }
.petit { font-size: .85rem; }
.entete-page { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; }
.retour { text-decoration: none; font-size: .9rem; }

label { display: block; margin: 0 0 14px; font-weight: 500; font-size: .92rem; }
input[type=text], input:not([type]), input[type=email], input[type=password], textarea {
  display: block; width: 100%; margin-top: 5px; padding: 10px 12px;
  border: 1px solid var(--ligne); border-radius: 8px; background: var(--fond); color: var(--texte);
  font: 16px/1.4 var(--sans);
}
/* Dates et nombres (échéances, signature, frais, pourcentages) : même aspect que les autres champs, 16 px (pas de zoom
   sur iPhone), sans changer leur largeur (audit du 10/10/2026). */
input[type=number], input[type=date] {
  padding: 8px 10px; border: 1px solid var(--ligne); border-radius: 8px; background: var(--fond); color: var(--texte);
  font: 16px/1.4 var(--sans);
}
input:focus, textarea:focus { outline: 2px solid var(--accent); outline-offset: 1px; }
fieldset.choix { border: 0; padding: 0; margin: 0 0 14px; }
fieldset.choix legend { font-weight: 500; font-size: .92rem; margin-bottom: 6px; }
fieldset.choix label, label.case { display: flex; gap: 8px; align-items: center; font-weight: 400; margin: 0 0 6px; }

button { font: inherit; cursor: pointer; border-radius: 8px; padding: 9px 16px; border: 1px solid transparent; }
button:disabled { opacity: .55; cursor: default; }
a.bouton { display: inline-block; border-radius: 8px; padding: 9px 16px; border: 1px solid transparent; text-decoration: none; }
.principal { background: var(--accent-plein); color: var(--accent-texte); font-weight: 600; }
.principal:hover:not(:disabled) { filter: brightness(1.1); }
.secondaire { background: transparent; border-color: var(--ligne); color: var(--texte); }
.secondaire:hover { border-color: var(--discret); }
.danger { color: var(--majeur); }
.lien { background: none; border: 0; padding: 0; color: var(--discret); font-weight: 500; }
.lien:hover { color: var(--accent); }
.lien.danger { color: var(--majeur); }  /* « Retirer », « Écarter » : rouge malgré .lien, déclaré après .danger */
.grand { padding: 13px 26px; font-size: 1.05rem; }
.actions { display: flex; gap: 10px; flex-wrap: wrap; }
.erreur { color: var(--majeur); font-weight: 500; }
.ok { color: var(--conforme); font-weight: 500; }

.liste { list-style: none; margin: 0; padding: 0; }
.liste > li { background: var(--surface); border: 1px solid var(--ligne); border-radius: 10px; margin-bottom: 10px; }
.liste > li > a, .liste > li > .ligne { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; text-decoration: none; color: var(--texte); flex-wrap: wrap; }
.liste > li > a:hover { background: var(--accent-clair); border-radius: 10px; }
.liste .titre { font-weight: 600; }
/* Cases de sélection des dossiers (archiver, supprimer) */
.liste > li.selectionnable { display: flex; align-items: stretch; }
.liste > li.selectionnable > a { flex: 1; min-width: 0; }
.liste > li.selectionnable > .case { display: flex; align-items: center; padding: 0 18px 0 6px; cursor: pointer; }
/* « Tout sélectionner », aligné sur la colonne des cases de la liste. */
.tout-selectionner { display: flex; justify-content: flex-end; align-items: center; gap: 8px; margin: 0 0 6px; padding: 0 19px 0 6px; font-size: .9rem; font-weight: 400; color: var(--discret); cursor: pointer; }
.tout-selectionner[hidden] { display: none; }
.liste > li.selectionnable > .case input { width: 20px; height: 20px; margin: 0; accent-color: var(--accent); cursor: pointer; }
.liste > li.selectionnable > .case input:disabled { cursor: not-allowed; opacity: .35; }
/* Collée sous l'en-tête quand celui-ci est collant (hauteur mesurée par app.js), sans jamais le recouvrir. */
.barre-selection { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; position: sticky; top: calc(var(--haut-collant, 0px) + 8px); z-index: 20; margin: 0 0 12px; padding: 10px 14px; background: var(--surface); border: 1px solid var(--accent); border-radius: 12px; box-shadow: 0 6px 20px rgba(0, 0, 0, .08); }
.barre-selection[hidden] { display: none; }
.barre-selection .compte { font-weight: 600; margin-right: auto; }
.barre-selection button.danger { border-color: var(--majeur); }
.bascule-archives { margin: 12px 0 0; }
.bascule-archives:empty { display: none; }
/* Annexes publiques obtenues par le site (préparation de l'avant-contrat) */
.annexes-publiques .pieces { list-style: none; padding: 0; margin: 8px 0 12px; }
.annexes-publiques .pieces li { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--ligne); font-size: .92rem; flex-wrap: wrap; word-break: break-word; }
.annexes-publiques .pieces li:last-child { border-bottom: 0; }
.annexes-publiques .pieces a { font-weight: 600; }
.vide { padding: 28px; text-align: center; color: var(--discret); border: 1px dashed var(--ligne); border-radius: 10px; }

.badge { display: inline-block; padding: 3px 10px; border-radius: 99px; font-size: .8rem; font-weight: 600; border: 1px solid currentColor; white-space: nowrap; max-width: 100%; }
/* Pastille longue sur iPhone (« Contrôle conforme — original à voir à la signature »…) : elle passe à la ligne au lieu
   d'élargir la page (nuit du 10/10/2026 : page de 470 px pour un écran de 375 px). */
@media (max-width: 560px) { .badge { white-space: normal; overflow-wrap: anywhere; border-radius: 12px; } }
.b-majeur, .b-non_signable_en_l_etat, .b-erreur, .b-manquant, .b-incoherent { color: var(--majeur); }
.b-important, .b-reserves_importantes, .b-perime, .b-a_verifier { color: var(--important); }
.b-mineur, .b-brouillon, .b-en_cours { color: var(--mineur); }
.b-conforme, .b-signable, .b-signable_apres_corrections, .b-redige { color: var(--conforme); }
.b-questions { color: var(--important); }
.aide-precisions { display: block; margin: 2px 0 6px; font-weight: normal; }
.options-reponse { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0; }
.options-reponse button { font-size: .85rem; padding: 4px 10px; text-align: left; }
.question-prealable textarea { width: 100%; margin-top: 6px; }
.completer-projet textarea { width: 100%; margin-top: 6px; }
.completer-projet h3 { margin: 14px 0 6px; }
.completer-projet .pieces { list-style: none; padding: 0; margin: 0 0 8px; }
.completer-projet .pieces li { display: flex; justify-content: space-between; gap: 8px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--ligne); font-size: .88rem; word-break: break-word; }
.completer-projet .pieces li button.retirer { padding: 0 9px; font-size: 1.1rem; line-height: 1.6; flex-shrink: 0; color: var(--discret); }
/* Envois en arrière-plan : progression dans la zone de dépôt, encart ailleurs */
.etat-envoi { display: block; margin-top: 8px; font-size: .85rem; font-weight: normal; color: var(--discret); }
.encart-envois { position: fixed; right: 16px; bottom: 16px; z-index: 50; width: min(380px, calc(100vw - 32px)); display: flex; flex-direction: column; gap: 8px; }
.encart-envois[hidden] { display: none; }
.liste-envois, .avis-envois { display: flex; flex-direction: column; gap: 8px; }
.ligne-envoi, .avis-envoi { display: block; background: var(--surface); border: 1px solid var(--ligne); border-radius: 12px; padding: 10px 14px; box-shadow: 0 6px 24px rgb(0 0 0 / 12%); color: var(--texte); text-decoration: none; font-size: .88rem; }
.ligne-envoi strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.avis-envoi { position: relative; padding-right: 34px; }
.avis-envoi.erreur { border-color: var(--majeur); }
.avis-envoi button { position: absolute; top: 6px; right: 8px; font-size: 1.1rem; }
.avis-lancement { margin: 10px 0 0; background: var(--accent-clair); border-radius: 10px; padding: 10px 14px; font-size: .9rem; }
.b-signable_apres_corrections { color: var(--important); }

.grille-depots { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 18px; }
.depot { background: var(--surface); border: 1px solid var(--ligne); border-radius: 12px; padding: 18px; display: flex; flex-direction: column; transition: border-color .15s, background .15s; }
.depot.survol { border-color: var(--accent); background: var(--accent-clair); }
.depot .pieces { list-style: none; padding: 0; margin: 4px 0 12px; flex: 1; }
.depot .pieces li { display: flex; justify-content: space-between; gap: 8px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--ligne); font-size: .88rem; word-break: break-word; }
.depot .pieces li button.retirer { padding: 0 9px; font-size: 1.1rem; line-height: 1.6; flex-shrink: 0; color: var(--discret); }
.deposer { margin: 0; border: 1.5px dashed var(--ligne); border-radius: 10px; padding: 14px; text-align: center; color: var(--accent); cursor: pointer; font-weight: 500; font-size: .9rem; }
.deposer:hover, .deposer.survol { border-color: var(--accent); }
.deposer.survol { background: var(--accent-clair); }
.deposer input { position: absolute; width: 1px; height: 1px; opacity: 0; }
/* Focus clavier : le champ de fichier est masqué, c'est la zone qui le montre. */
.deposer:focus-within { outline: 2px solid var(--accent); outline-offset: 2px; }
.deposer.envoi { color: var(--discret); }
/* Fichiers écartés avant l'envoi (format, taille, doublon) : un motif par fichier, sous la zone de dépôt. */
.avis-zone { margin: 8px 0 0; padding: 8px 12px; border: 1px solid var(--majeur); border-radius: 10px; font-size: .86rem; color: var(--texte); background: color-mix(in srgb, var(--majeur) 6%, var(--surface)); }
.avis-zone ul { margin: 0 0 4px; padding-left: 18px; }
.avis-zone li { margin: 2px 0; }
details.carte summary { cursor: pointer; font-weight: 600; font-family: var(--serif); font-size: 1.05rem; }
details.carte[open] summary { margin-bottom: 14px; }
.lancer { text-align: center; margin-top: 24px; }

.jauge { height: 10px; border-radius: 99px; background: var(--ligne); overflow: hidden; margin: 14px 0 10px; }
.jauge-remplie { height: 100%; width: 0; background: var(--accent); transition: width .8s ease; }

.avis { border-left: 5px solid var(--accent); }
.avis .niveau { font-family: var(--serif); font-size: 1.35rem; font-weight: 600; margin: 0 0 8px; }
.telechargements { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 0 0 18px; }
.telechargements a { display: block; padding: 16px; border-radius: 12px; background: var(--surface); border: 1px solid var(--ligne); text-decoration: none; color: var(--texte); }
.telechargements a:hover { border-color: var(--accent); }
.telechargements strong { display: block; color: var(--accent); font-family: var(--serif); font-size: 1.05rem; margin-bottom: 2px; }
.section-resultat h2 { display: flex; align-items: baseline; gap: 10px; }
.section-resultat h2 .compte { font-family: var(--sans); font-size: .85rem; color: var(--discret); font-weight: 500; }
.element { border-top: 1px solid var(--ligne); padding: 14px 0; }
.element:first-of-type { border-top: 0; }
.element .tete { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; margin-bottom: 6px; }
.element .tete strong { font-weight: 600; }
.comparaison { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 8px 0; }
.comparaison div { background: var(--fond); border-radius: 8px; padding: 10px 12px; font-size: .9rem; }
.comparaison span { display: block; font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; color: var(--discret); margin-bottom: 3px; }
.proposition { margin: 8px 0 0; padding: 10px 14px; border-left: 3px solid var(--accent); background: var(--accent-clair); font-family: var(--serif); font-style: italic; border-radius: 0 8px 8px 0; }
.correction { margin: 6px 0 0; font-size: .92rem; }
.courrier { white-space: pre-wrap; font-family: var(--serif); background: var(--fond); padding: 16px; border-radius: 8px; }
.code { font-family: ui-monospace, Menlo, monospace; font-size: 1.2rem; background: var(--fond); padding: 10px 14px; border-radius: 8px; user-select: all; }
ul.puces { margin: 0; padding-left: 20px; }
ul.puces li { margin-bottom: 6px; }

@media (max-width: 820px) {
  .grille-depots, .telechargements { grid-template-columns: minmax(0, 1fr); }
  .comparaison { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  main { padding: 20px 16px 48px; }
  .barre { padding: 10px 16px; }
  h1 { font-size: 1.45rem; }
  .carte { padding: 16px; }
}

.centre { text-align: center; }
#bloc-modifier { margin: 8px 0 24px; }

.grille-depots.deux { grid-template-columns: 1fr 2fr; }
.grille-depots.moitie { grid-template-columns: 1fr 1fr; } /* onglet Plus-value immobilière : pièces, instructions */
.defile { overflow-x: auto; }
table.grille { width: 100%; min-width: 1040px; border-collapse: collapse; font-size: .88rem; }
/* Sur ordinateur, le tableau tient dans sa carte (texte replié dans les cellules) : à 1 040 px minimum, il dépassait la carte
   de l'interface épurée, et ses dernières colonnes n'apparaissaient qu'en faisant défiler (bilan du 08/10/2026). */
@media (min-width: 1100px) { table.grille { min-width: 0; } }
table.grille th { text-align: left; font-weight: 600; font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; color: var(--discret); border-bottom: 2px solid var(--ligne); padding: 8px 10px; }
table.grille td { border-bottom: 1px solid var(--ligne); padding: 8px 10px; vertical-align: top; min-width: 80px; }
table.grille td:first-child { font-weight: 600; min-width: 130px; }
td.non, dd.non { color: var(--majeur); font-weight: 700; }
td.oui { color: var(--conforme); font-weight: 600; }
dl.fiche { display: grid; grid-template-columns: minmax(140px, 30%) 1fr; gap: 6px 16px; margin: 0; }
dl.fiche dt { color: var(--discret); font-size: .88rem; }
dl.fiche dd { margin: 0; }
.photos { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; margin: 8px 0 12px; }
.photos a { text-decoration: none; color: var(--texte); font-size: .85rem; text-align: center; }
.photos img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 8px; display: block; margin-bottom: 4px; }
.kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; margin-bottom: 18px; }
.kpi { background: var(--surface); border: 1px solid var(--ligne); border-radius: 12px; padding: 14px 16px; }
.kpi strong { display: block; font-family: var(--serif); font-size: 1.45rem; color: var(--accent); }
.kpi span { color: var(--discret); font-size: .85rem; }
.b-complet_et_coherent { color: var(--conforme); }
.b-a_completer { color: var(--important); }
.b-anomalies_importantes { color: var(--majeur); }
@media (max-width: 820px) { .grille-depots.deux, .grille-depots.moitie { grid-template-columns: 1fr; } dl.fiche { grid-template-columns: 1fr; } dl.fiche dd { margin-bottom: 8px; } }

.entete-suivi { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
/* Partage du dossier et envoi du projet annoté par courriel à la fin de l'analyse (10/10/2026) : cases qui passent à la
   ligne (jamais de barre défilante sur mobile), repère discret dans la liste. */
.choix-collegues { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin: 8px 0; }
.case-collegue { display: inline-flex; align-items: center; gap: 8px; font-weight: 400; cursor: pointer; min-height: 32px; }
.case-collegue input { width: 18px; height: 18px; margin: 0; flex: none; }
.envoi-fin { margin: 12px 0 4px; padding-top: 10px; border-top: 1px solid var(--ligne); }
.envoi-fin .ligne-boutons { margin: 6px 0; }
.envoi-programme { margin: 0; }
.repere-partage { color: var(--accent); }
#bloc-partage .ligne-boutons { justify-content: flex-end; }
@media (max-width: 560px) { .choix-collegues { flex-direction: column; align-items: flex-start; } }
.pourcent { font-family: var(--serif); font-size: 1.6rem; color: var(--accent); font-variant-numeric: tabular-nums; }
.jauge-remplie { transition: width .3s linear; }
/* Jauge de l'analyse redessinée une fois par seconde : elle glisse en continu d'une valeur à l'autre. */
#zone-suivi .jauge-remplie { transition: width 1s linear; }
.jauge.petite { display: block; height: 6px; margin: 8px 0 2px; }
.telechargements a .jauge.petite { margin-top: 10px; }
ol.etapes { list-style: none; padding: 0; margin: 14px 0; }
ol.etapes li { display: flex; align-items: center; gap: 10px; padding: 7px 0; color: var(--discret); border-top: 1px solid var(--ligne); }
ol.etapes li:first-child { border-top: 0; }
ol.etapes .titre-etape { flex: 1; }
ol.etapes .detail-etape { font-variant-numeric: tabular-nums; font-size: .85rem; }
ol.etapes .puce-etape { width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--ligne); flex-shrink: 0; display: grid; place-items: center; font-size: 11px; }
ol.etapes li.fait { color: var(--texte); }
ol.etapes li.fait .puce-etape { background: var(--conforme); border-color: var(--conforme); }
ol.etapes li.fait .puce-etape::after { content: "✓"; color: #fff; font-weight: 700; }
ol.etapes li.actif { color: var(--texte); font-weight: 600; }
ol.etapes li.actif .puce-etape { border-color: var(--accent); border-top-color: transparent; animation: tourne .9s linear infinite; }
@keyframes tourne { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { ol.etapes li.actif .puce-etape { animation: none; border-top-color: var(--accent); } .jauge-remplie { transition: none; } }

.depot .pieces li { flex-wrap: wrap; }
.depot .pieces li .nom-piece { flex: 1 1 100%; min-width: 0; }
.depot .pieces li .actions-piece { display: flex; gap: 10px; align-items: center; margin-left: auto; }
select.nature-piece { font: inherit; font-size: .78rem; padding: 3px 4px; border: 1px solid var(--ligne); border-radius: 6px; background: var(--fond); color: var(--texte); max-width: 118px; }
.avis-depot { background: var(--accent-clair); border-radius: 10px; padding: 12px 16px; font-size: .9rem; }
/* Sélection multiple des pièces (11/10/2026) : case à gauche du nom, barre « Tout sélectionner » / « Supprimer la sélection ». */
.depot .pieces li.cochable .nom-piece { flex: 1 1 calc(100% - 34px); }
.depot .pieces li .case-piece, .selection-pieces .case-tout input { width: 20px; height: 20px; margin: 2px 0 0; flex: 0 0 auto; accent-color: var(--accent); cursor: pointer; align-self: flex-start; }
.selection-pieces { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; justify-content: space-between; margin: 6px 0 2px; font-size: .86rem; }
.selection-pieces .case-tout { display: flex; gap: 8px; align-items: center; font-weight: 400; margin: 0; cursor: pointer; }
.selection-pieces .supprimer-selection { font-size: .82rem; padding: 4px 10px; }
.selection-pieces .supprimer-selection:not(:disabled) { color: var(--majeur); border-color: var(--majeur); }
/* Message informatif d'une zone de dépôt (archive .zip dirigée vers les pièces) : bleu, et non l'orange d'un refus. */
.avis-zone.info { border-color: var(--accent); background: var(--accent-clair); }
.avis-zone .info-zone { margin: 0 0 4px; }
@media (max-width: 560px) { select.nature-piece { font-size: 16px; max-width: 140px; } }
/* Écran tactile (iPhone, iPad) : un champ en dessous de 16 px fait zoomer Safari à la saisie (menus de classement au-delà
   de 560 px, menus d'administration, dates) ; cibles du doigt de 44 px pour le retrait d'une pièce. */
@media (pointer: coarse) {
  input, select, textarea, select.nature-piece { font-size: 16px; }
  select.nature-piece { max-width: 160px; }
  .depot .pieces li button.retirer { min-width: 44px; min-height: 44px; }
  .depot .pieces li .case-piece, .selection-pieces .case-tout input { width: 24px; height: 24px; }
  .selection-pieces .case-tout { min-height: 44px; }
  .selection-pieces .supprimer-selection { min-height: 44px; font-size: 16px; }
}

.outil h2 { margin-bottom: 4px; }
.outil .deposer { display: block; margin-top: 12px; }
.outil .telechargements { margin-top: 12px; }

/* ================================================================== choix de l'interface (profil) */
.segments, .liens { display: contents; }
#liens-documents { display: contents; }
#liens-documents[hidden] { display: none; }
.apercus { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; }
.apercu { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; text-align: left; padding: 12px; border: 2px solid var(--ligne); background: var(--surface); color: var(--texte); border-radius: 12px; }
.apercu.actif { border-color: var(--accent); }
.vignette { display: block; width: 100%; height: 64px; border-radius: 8px; margin-bottom: 8px; padding: 10px; }
.vignette i { display: block; height: 8px; border-radius: 4px; margin-bottom: 7px; }
.vignette-classique { background: #f6f3ec; border: 1px solid #e2dbcd; }
.vignette-classique i { background: #e2dbcd; } .vignette-classique i:first-child { background: #02234E; width: 45%; }
.vignette-epuree { background: #f5f5f7; }
.vignette-epuree i { background: #fff; box-shadow: 0 1px 3px rgb(0 0 0 / 8%); } .vignette-epuree i:first-child { background: #0071e3; width: 30%; border-radius: 99px; }

/* ================================================================== interface épurée
   Principes : police système, grands titres, fond gris très clair et surfaces blanches sans
   bordure, une seule couleur d'action (bleu système), navigation translucide, relectures en
   commande segmentée, boutons en pastille, listes groupées, animations discrètes. */
html[data-interface="epuree"] {
  --fond: #f5f5f7;
  --surface: #ffffff;
  --texte: #1d1d1f;
  --discret: #6e6e73;
  --ligne: rgb(0 0 0 / 8%);
  --accent: #0071e3;
  --accent-clair: #e8f1fd;
  --accent-texte: #ffffff;
  /* Teintes assombries pour un contraste d'au moins 4,5:1 sur les fonds teintés (pastilles, boutons secondaires) :
     #248a3d, #c93400, #d70015, #6e6e73 et le bleu #0071e3 n'atteignaient que 3,5 à 4,4:1. */
  --accent-secondaire: #0062c4;
  --majeur: #c00013;
  --important: #b02e00;
  --mineur: #636366;
  --conforme: #1a7431;
  --ombre: 0 1px 1px rgb(0 0 0 / 3%), 0 6px 24px rgb(0 0 0 / 5%);
  --serif: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", "Segoe UI", sans-serif;
  --sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", "Segoe UI", sans-serif;
  --rayon: 18px;
  --remplissage: rgb(118 118 128 / 12%);
}
@media (prefers-color-scheme: dark) {
  html[data-interface="epuree"] {
    --fond: #000000; --surface: #1c1c1e; --texte: #f5f5f7; --discret: #98989d; --ligne: rgb(255 255 255 / 10%);
    --accent: #0a84ff; --accent-clair: rgb(10 132 255 / 16%); --accent-texte: #ffffff;
    --logo-bleu: #E6ECF5;
    /* Blanc sur #0a84ff : 3,65:1 ; sur #0071e3 : 4,7:1. Texte des boutons secondaires éclairci (3,5 → 4,9:1). */
    --accent-plein: #0071e3; --accent-secondaire: #4aa3ff;
    --majeur: #ff6961; --important: #ff9f0a; --mineur: #98989d; --conforme: #30d158;
    --ombre: none; --remplissage: rgb(118 118 128 / 24%);
  }
}
html[data-interface="epuree"] body { font: 16px/1.47 var(--sans); letter-spacing: -0.01em; -webkit-font-smoothing: antialiased; }
html[data-interface="epuree"] h1 { font-size: 2.1rem; font-weight: 700; letter-spacing: -0.03em; }
html[data-interface="epuree"] h2 { font-size: 1.3rem; font-weight: 650; letter-spacing: -0.02em; }
html[data-interface="epuree"] h3 { font-size: 1.05rem; font-weight: 600; letter-spacing: -0.01em; }
/* Liens : #0071e3 sur le fond gris n'atteignait que 4,31:1 ; #0062c4 donne 5,4:1 (clair), #4aa3ff 7,9:1 (sombre). */
html[data-interface="epuree"] a { color: var(--accent-secondaire); }

/* Barre translucide */
html[data-interface="epuree"] .barre {
  background: color-mix(in srgb, var(--fond) 72%, transparent);
  -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid var(--ligne); padding: 10px 28px; gap: 20px;
}
html[data-interface="epuree"] .marque { color: var(--texte); font-family: var(--sans); font-weight: 600; font-size: 1.05rem; letter-spacing: -0.02em; }
html[data-interface="epuree"] nav { gap: 22px; font-size: .9rem; }
html[data-interface="epuree"] nav a, html[data-interface="epuree"] .lien { color: var(--discret); font-weight: 500; }
html[data-interface="epuree"] nav a:hover, html[data-interface="epuree"] nav a.actif, html[data-interface="epuree"] .lien:hover { color: var(--texte); }

/* Commande segmentée des trois relectures */
html[data-interface="epuree"] .segments {
  display: inline-flex; background: var(--remplissage); border-radius: 10px; padding: 2px; gap: 0; margin-right: 6px;
}
html[data-interface="epuree"] .segments a {
  padding: 5px 14px; border-radius: 8px; color: var(--texte); font-weight: 500; white-space: nowrap; transition: background .2s, box-shadow .2s;
}
html[data-interface="epuree"] .segments a.actif { background: var(--surface); box-shadow: 0 1px 3px rgb(0 0 0 / 12%), 0 1px 1px rgb(0 0 0 / 4%); }

html[data-interface="epuree"] main { max-width: 1040px; padding: 40px 28px 80px; }
/* Écran d'ordinateur moyen (1 280 à 1 600 px) : la barre d'un administrateur (six espaces, Mémoire, Échéances,
   Utilisateurs, Abonnement, profil, déconnexion) tient sur une ligne ; à 22 px d'écart et 14 px de marge intérieure, la
   Déconnexion passait seule à la ligne (bilan du 08/10/2026). */
@media (min-width: 821px) and (max-width: 1600px) {
  html[data-interface="epuree"] nav { flex: 1 1 100%; justify-content: space-between; gap: 12px; font-size: .84rem; }
  html[data-interface="epuree"] .segments { margin-right: 0; }
  html[data-interface="epuree"] .segments a { padding: 5px 9px; }
  html[data-interface="epuree"] .liens { display: inline-flex; align-items: center; gap: 14px; flex-wrap: wrap; }
  /* « Installer l'application » reste dans Mon profil (bloc « Nexactis sur votre ordinateur »). */
  html[data-interface="epuree"] #btn-installer { display: none; }
}
/* En dessous de 1 440 px : deux rangées nettes — les espaces, puis les liens — plutôt qu'un lien isolé à la ligne. */
@media (min-width: 821px) and (max-width: 1439px) {
  html[data-interface="epuree"] nav { justify-content: flex-start; row-gap: 10px; }
  html[data-interface="epuree"] .liens { flex-basis: 100%; }
}

/* Surfaces */
html[data-interface="epuree"] .carte, html[data-interface="epuree"] .depot, html[data-interface="epuree"] .kpi,
html[data-interface="epuree"] .telechargements a, html[data-interface="epuree"] .apercu {
  border: 0; border-radius: var(--rayon); box-shadow: var(--ombre); background: var(--surface);
}
html[data-interface="epuree"] .carte { padding: 24px 26px; margin-bottom: 20px; }
html[data-interface="epuree"] .avis { border-left: 0; }
html[data-interface="epuree"] .entete-page { margin-bottom: 28px; align-items: flex-end; }
html[data-interface="epuree"] .discret { color: var(--discret); }

/* Boutons en pastille */
html[data-interface="epuree"] button { border-radius: 980px; padding: 9px 20px; font-weight: 500; transition: filter .15s, background .15s, transform .1s; }
html[data-interface="epuree"] button:active:not(:disabled) { transform: scale(.98); }
html[data-interface="epuree"] .principal { background: var(--accent-plein); color: var(--accent-texte); font-weight: 600; }
html[data-interface="epuree"] .secondaire { background: var(--remplissage); border-color: transparent; color: var(--accent-secondaire); }
html[data-interface="epuree"] .secondaire:hover { border-color: transparent; filter: brightness(.97); }
html[data-interface="epuree"] .danger { color: var(--majeur); }
html[data-interface="epuree"] .grand { padding: 14px 34px; font-size: 1.05rem; }
html[data-interface="epuree"] .lien { border-radius: 0; padding: 0; }

/* Champs */
html[data-interface="epuree"] label { font-weight: 500; color: var(--texte); }
html[data-interface="epuree"] input:not([type=radio]):not([type=checkbox]):not([type=file]), html[data-interface="epuree"] textarea, html[data-interface="epuree"] select.nature-piece {
  background: var(--remplissage); border: 0; border-radius: 12px; padding: 12px 14px;
}
html[data-interface="epuree"] input:focus, html[data-interface="epuree"] textarea:focus { outline: 3px solid color-mix(in srgb, var(--accent) 45%, transparent); outline-offset: 0; }
html[data-interface="epuree"] input[type=radio], html[data-interface="epuree"] input[type=checkbox] { accent-color: var(--accent); }

/* Liste groupée des dossiers (style Réglages) */
html[data-interface="epuree"] .liste { background: var(--surface); border-radius: var(--rayon); box-shadow: var(--ombre); overflow: hidden; }
html[data-interface="epuree"] .liste > li { border: 0; border-radius: 0; margin: 0; background: transparent; position: relative; }
html[data-interface="epuree"] .liste > li + li::before { content: ""; position: absolute; left: 20px; right: 0; top: 0; height: 1px; background: var(--ligne); }
html[data-interface="epuree"] .liste > li > a, html[data-interface="epuree"] .liste > li > .ligne { padding: 16px 20px; }
html[data-interface="epuree"] .liste > li > a:hover { background: var(--remplissage); border-radius: 0; }
html[data-interface="epuree"] .liste > li > a::after { content: "›"; color: var(--discret); font-size: 1.4rem; line-height: 1; margin-left: 4px; opacity: .6; }
html[data-interface="epuree"] .liste .titre { font-weight: 600; }
html[data-interface="epuree"] .vide { border: 0; background: transparent; box-shadow: none; padding: 48px 20px; }

/* Pastilles d'état : teinte douce */
html[data-interface="epuree"] .badge { border: 0; padding: 4px 11px; font-weight: 600; font-size: .78rem; background: color-mix(in srgb, currentColor 12%, transparent); }

/* Dépôt des pièces */
html[data-interface="epuree"] .grille-depots { gap: 20px; }
html[data-interface="epuree"] .depot { padding: 22px; }
html[data-interface="epuree"] .depot.survol { background: var(--accent-clair); box-shadow: inset 0 0 0 2px var(--accent); }
html[data-interface="epuree"] .deposer {
  border: 1.5px dashed color-mix(in srgb, var(--discret) 45%, transparent); border-radius: 14px; padding: 22px 14px; color: var(--accent-secondaire);
  background: color-mix(in srgb, var(--remplissage) 50%, transparent); transition: background .2s, border-color .2s;
}
html[data-interface="epuree"] .deposer::before {
  content: ""; display: block; width: 30px; height: 30px; margin: 0 auto 8px; border-radius: 50%; background: var(--accent);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4l-5 5h3v6h4V9h3z M5 18h14v2H5z'/%3E%3C/svg%3E") center / 20px no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4l-5 5h3v6h4V9h3z M5 18h14v2H5z'/%3E%3C/svg%3E") center / 20px no-repeat;
}
html[data-interface="epuree"] .deposer:hover { border-color: var(--accent); }
html[data-interface="epuree"] .depot .pieces li { border-bottom-color: var(--ligne); }
html[data-interface="epuree"] .avis-depot { background: var(--accent-clair); border-radius: 14px; }
html[data-interface="epuree"] details.carte summary { font-family: var(--sans); font-weight: 600; list-style: none; }
html[data-interface="epuree"] details.carte summary::-webkit-details-marker { display: none; }
html[data-interface="epuree"] details.carte summary::after { content: "›"; float: right; transform: rotate(90deg); color: var(--discret); transition: transform .2s; }
html[data-interface="epuree"] details.carte[open] summary::after { transform: rotate(-90deg); }

/* Progression */
html[data-interface="epuree"] .jauge { height: 6px; background: var(--remplissage); }
html[data-interface="epuree"] .jauge-remplie { background: var(--accent); border-radius: 99px; }
html[data-interface="epuree"] .pourcent { font-family: var(--sans); font-weight: 700; letter-spacing: -0.03em; font-size: 2rem; color: var(--texte); }
html[data-interface="epuree"] ol.etapes li { border-top-color: var(--ligne); }
html[data-interface="epuree"] ol.etapes li.fait .puce-etape { background: var(--accent); border-color: var(--accent); }

/* Résultats */
html[data-interface="epuree"] .telechargements { gap: 16px; }
html[data-interface="epuree"] .telechargements a { padding: 18px 20px; transition: transform .15s, box-shadow .15s; }
html[data-interface="epuree"] .telechargements a:hover { transform: translateY(-1px); box-shadow: 0 2px 4px rgb(0 0 0 / 4%), 0 12px 32px rgb(0 0 0 / 8%); }
html[data-interface="epuree"] .telechargements strong { font-family: var(--sans); font-weight: 600; color: var(--accent); }
html[data-interface="epuree"] .comparaison div { background: var(--fond); border-radius: 12px; }
html[data-interface="epuree"] .proposition { font-family: var(--sans); font-style: normal; border-left: 3px solid var(--accent); background: var(--accent-clair); border-radius: 0 12px 12px 0; }
html[data-interface="epuree"] .courrier { font-family: var(--sans); background: var(--fond); border-radius: 12px; }
html[data-interface="epuree"] .element { border-top-color: var(--ligne); }
html[data-interface="epuree"] table.grille th { color: var(--discret); border-bottom: 1px solid var(--ligne); font-weight: 600; letter-spacing: .02em; }
html[data-interface="epuree"] table.grille td { border-bottom-color: var(--ligne); }
html[data-interface="epuree"] .kpi strong { font-family: var(--sans); font-weight: 700; letter-spacing: -0.03em; color: var(--texte); }
html[data-interface="epuree"] .photos img { border-radius: 12px; }

/* Choix d'apparence */
html[data-interface="epuree"] .apercu { border: 2px solid transparent; }
html[data-interface="epuree"] .apercu.actif { box-shadow: 0 0 0 2px var(--accent), var(--ombre); }

@media (max-width: 820px) {
  html[data-interface="epuree"] .barre { padding: 10px 16px; }
  html[data-interface="epuree"] .segments { order: -1; width: 100%; margin: 0 0 2px; }
  html[data-interface="epuree"] .segments a { flex: 1; text-align: center; padding: 6px 4px; font-size: .85rem; white-space: normal; line-height: 1.2; }
  html[data-interface="epuree"] nav { width: 100%; justify-content: space-between; gap: 12px; row-gap: 10px; }
}
@media (max-width: 560px) {
  html[data-interface="epuree"] main { padding: 24px 16px 60px; }
  html[data-interface="epuree"] h1 { font-size: 1.75rem; }
  html[data-interface="epuree"] .carte { padding: 18px; }
  html[data-interface="epuree"] .apercus { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-interface="epuree"] * { transition: none !important; }
}
html[data-interface="epuree"] .liste > li > a { color: var(--texte); }
html[data-interface="epuree"] .retour { font-weight: 500; }

.ajout { display: flex; gap: 8px; align-items: center; margin: 8px 0 14px; flex-wrap: wrap; }
.ajout input { flex: 1 1 260px; margin: 0; }
.ajout-clause input, .ajout-clause textarea, .clause input, .clause textarea, .regle textarea { margin: 6px 0; }
.actions-regle { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 6px; }
.actions-regle label.case { margin: 0; }
.regle.inactive textarea { opacity: .55; }
.clause summary { cursor: pointer; font-weight: 600; }
input[type=search] { display: block; width: 100%; margin: 6px 0 10px; padding: 10px 12px; border: 1px solid var(--ligne); border-radius: 8px; background: var(--fond); color: var(--texte); font: 16px/1.4 var(--sans); }
html[data-interface="epuree"] input[type=search] { background: var(--remplissage); border: 0; border-radius: 12px; }

.regle.a-valider, .clause.a-valider { background: var(--accent-clair); border-radius: 12px; padding-left: 12px; padding-right: 12px; }
.clause summary .badge { margin-left: 8px; }

.partie { padding: 14px 16px; margin: 10px 0; }
.partie .tete { display: flex; justify-content: space-between; gap: 10px; align-items: center; flex-wrap: wrap; }
.partie input[type=email] { flex: 1 1 240px; margin: 0; }
.partie .puces li { margin: 4px 0; }

.b-rouge { color: var(--majeur); } .b-orange { color: var(--important); } .b-vert { color: var(--conforme); }
.tableau-bord { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 12px 0 0; }
.tableau-bord div { border: 1px solid var(--ligne); border-radius: 10px; padding: 10px 12px; }
.tableau-bord strong { display: block; font-size: 1.5rem; line-height: 1.1; }
.tableau-bord span { font-size: .78rem; color: var(--discret); }
.statut-dossier { font-weight: 700; font-size: 1.05rem; margin: 0 0 4px; }
.onglets-internes { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 16px; }
.onglets-internes button { border: 1px solid var(--ligne); background: var(--surface); color: var(--texte); border-radius: 99px; padding: 7px 14px; font: inherit; font-size: .88rem; font-weight: 500; cursor: pointer; }
/* Texte de l'onglet actif : --accent-texte (le blanc sur l'accent clair du mode sombre ne faisait que 2,3:1). */
.onglets-internes button.actif { background: var(--accent-plein); border-color: var(--accent-plein); color: var(--accent-texte); }
.onglets-internes button .compte { margin-left: 6px; opacity: .8; }
@media (max-width: 700px) { .tableau-bord { grid-template-columns: repeat(2, 1fr); } }

.choix-trames { display: flex; flex-direction: column; gap: 6px; margin: 0 0 12px; }
.choix-trames button { display: flex; gap: 10px; align-items: flex-start; text-align: left; width: 100%; border: 1px solid var(--ligne); border-radius: 10px; padding: 9px 12px; background: var(--surface); color: var(--texte); font: inherit; font-size: .9rem; font-weight: 400; cursor: pointer; box-shadow: none; }
.choix-trames button:hover { border-color: var(--accent); }
.choix-trames button.actif { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.choix-trames .puce-choix { flex: none; width: 16px; height: 16px; margin-top: 2px; border-radius: 50%; border: 1.5px solid var(--ligne); }
.choix-trames button.actif .puce-choix { border: 5px solid var(--accent); }
.choix-trames strong { display: block; font-weight: 600; }
.choix-trames small { color: var(--discret); }
html[data-interface="epuree"] .choix-trames button, .choix-trames button { border-radius: 12px; padding: 10px 12px; background: var(--surface); color: var(--texte); min-height: 0; line-height: 1.35; }
html[data-interface="epuree"] .choix-trames button.actif, .choix-trames button.actif { background: var(--surface); color: var(--texte); border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.choix-trames small { display: block; font-size: .8rem; }
.partie select.nature-piece, html[data-interface="epuree"] .partie select.nature-piece { max-width: 300px; }
.partie .ajout input[type=text] { flex: 1 1 240px; margin: 0; }

button.large { width: 100%; }
.separateur { text-align: center; margin: 14px 0 6px; }

#choix-modele { padding: 14px 18px; }
#choix-modele .onglets-internes { margin: 0 0 6px; }
#choix-modele p { margin: 0; }

/* Bandeaux sous l'en-tête : serveur injoignable (nouvel essai automatique), nouvelle version du site. */
.bandeaux { position: sticky; top: var(--haut-collant, 0px); z-index: 25; }
.bandeau { display: flex; align-items: center; justify-content: center; gap: 8px 14px; flex-wrap: wrap; padding: 10px 16px; background: var(--accent-clair); color: var(--texte); border-bottom: 1px solid var(--ligne); font-size: .92rem; text-align: center; }
.bandeau-reseau { background: color-mix(in srgb, var(--majeur) 12%, var(--surface)); }
.bandeau-essai { background: color-mix(in srgb, var(--majeur) 18%, var(--surface)); font-weight: 600; }
.bandeau button { padding: 6px 14px; }

/* Alertes en tête d'un résultat : rouge (rubriques absentes, pièces lues en partie, annotations non posées, contrôle
   technique, LCB-FT), orange (pièces lues par pré-lecture automatique) ; information, sans alarme (pages numérisées lues
   par reconnaissance locale du texte : rien ne manque). */
.bandeau-alerte, .bandeau-attention, .bandeau-info { border: 1px solid; border-left-width: 5px; border-radius: 10px; padding: 12px 16px; margin: 0 0 18px; font-weight: 500; }
.bandeau-alerte { border-color: var(--majeur); color: var(--majeur); background: color-mix(in srgb, var(--majeur) 6%, var(--surface)); }
.bandeau-attention { border-color: var(--important); color: var(--important); background: color-mix(in srgb, var(--important) 6%, var(--surface)); }
.bandeau-info { border-color: var(--ligne); border-left-color: var(--mineur); color: var(--texte); background: color-mix(in srgb, var(--mineur) 5%, var(--surface)); font-weight: 400; }
.bandeau-alerte p, .bandeau-attention p, .bandeau-info p { margin: 0 0 6px; }
.bandeau-alerte ul, .bandeau-attention ul, .bandeau-info ul { margin: 0; color: var(--texte); font-weight: 400; }
/* Motifs d'une pièce lue en partie : sous sa ligne, en plus petit. */
.bandeau-alerte ul.motifs { margin-top: 4px; color: var(--discret); font-size: .9em; }
.bandeau-alerte ul.motifs li { margin-bottom: 2px; }

/* État d'enregistrement des précisions et de la dictée (« Enregistré », « Non enregistré — … »). */
.etat-saisie { margin: -6px 0 12px; min-height: 1.3em; }
.etat-saisie.erreur { font-size: .9rem; }
.mention-micro { margin: -6px 0 0; }

/* Bouton de lancement désactivé pendant un envoi de pièce : la raison, sous le bouton. */
.raison-envoi { display: block; flex-basis: 100%; margin-top: 6px; }

/* Titre de page qui reçoit le focus à chaque changement de page (lecteurs d'écran) : pas de cadre de focus visible. */
h1[tabindex="-1"]:focus { outline: none; }

/* Texte réservé aux lecteurs d'écran (annonce des changements d'étape d'une analyse). */
.visuellement-masque { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* LCB-FT : statut calculé par le code pour chaque contrôle (pastille), son motif dessous ; limites du contrôle. */
.motif-controle { display: block; margin-top: 3px; }
.partie-lcbft dl.fiche dd .puces { margin-top: 4px; }
.partie-lcbft dl.fiche dd .puces .badge { margin-left: 4px; }
.encadre-limites { border: 1px solid var(--ligne); border-left: 5px solid var(--discret); border-radius: 10px; padding: 12px 16px; margin: 18px 0; }
.encadre-limites p { margin: 0 0 6px; }

/* Constitution du dossier : pastilles d'une partie, pièce « à contrôler » (Contrôlée / Redemander), suivi d'une pièce,
   parties qui ne figurent plus dans la liste. */
.badges { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.controle-piece { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 6px 0 2px; }
.controle-piece button { padding: 5px 12px; font-size: .88rem; }
.suivi-piece { display: block; margin-top: 2px; }
.hors-liste { margin-top: 22px; }
.hors-liste h3 { margin-bottom: 4px; }

/* Mémoire de l'étude : historique d'une règle ou d'une clause. */
.historique-regle { margin-top: 4px; }
.historique-regle summary { cursor: pointer; font-weight: 400; } /* pas le gras du titre d'une clause (.clause summary) */
.historique-regle ul { margin-top: 4px; }

@media (pointer: coarse) {
  .controle-piece button { min-height: 44px; }
}

/* Retour du confrère : la version et ses pièces jointes côte à côte (empilées sur téléphone). */
.depot-retour .grille-retour { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 700px) { .depot-retour .grille-retour { grid-template-columns: 1fr; } }
.depot-retour .fichiers-choisis { list-style: none; padding: 0; margin: 10px 0 0; }
.depot-retour .fichiers-choisis li { display: flex; justify-content: space-between; gap: 10px; padding: 4px 0; border-bottom: 1px solid var(--ligne); }
.depot-retour .fichiers-choisis li > span { flex: 1; min-width: 0; overflow-wrap: anywhere; }

/* Bandeaux des pièces partielles repliés au-delà de quelques pièces (06/10/2026). */
.suite-puces > summary { cursor: pointer; margin: 0.25rem 0 0.5rem; color: var(--accent-secondaire); }

/* Organigramme des détentions : le dessin tient dans la largeur de la carte, un clic l'ouvre en grand. */
img.organigramme { display: block; max-width: 100%; height: auto; margin: 0.75rem auto; border: 1px solid var(--ligne); border-radius: 8px; background: #fff; }
textarea.question-dossier { width: 100%; font-size: 16px; }
.reponse-dossier { border-top: 1px solid var(--ligne); padding-top: 0.6rem; margin-top: 0.6rem; }
.a-confirmer { color: var(--majeur); font-style: italic; }  /* lisible en mode sombre (bilan du 08/10/2026) */
.organigramme-edition { margin: 0.75rem 0; border: 1px dashed var(--ligne); border-radius: 8px; background: #fff; overflow: hidden; }
.organigramme-edition svg { display: block; width: 100%; height: auto; touch-action: none; user-select: none; -webkit-user-select: none; }
.organigramme-edition g[data-entite] { cursor: grab; }
.organigramme-edition g[data-entite].en-main { cursor: grabbing; opacity: 0.85; }
.pct-detention { width: 6.5em; }

/* Fenêtre « document reçu » (Nexactis pour Windows : clic droit « Relire avec Nexactis ») */
.voile-modale { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; padding: 16px; background: rgb(0 0 0 / 35%); }
.fenetre-modale { width: min(560px, 100%); max-height: calc(100vh - 32px); overflow: auto; margin: 0; }
.choix-fichier { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 14px 0; }
html[data-interface] .fenetre-modale .choix-fichier button, .choix-fichier button { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; text-align: left; padding: 12px 14px; white-space: normal; border-radius: 12px; }
@media (max-width: 520px) { .choix-fichier { grid-template-columns: 1fr; } }
.droite { text-align: right; }

/* Logo (08/10/2026) : symbole vectoriel (bleu marine du thème, or en dégradé) et mot « Nexactis » posé en masque sur la
   couleur du thème — lisibles en clair comme en sombre. */
.logo-symbole { display: block; height: 30px; width: auto; flex: none; }
.logo-symbole .logo-bleu { fill: var(--logo-bleu, #02234E); }
.logo-texte { display: block; height: 17px; aspect-ratio: 560 / 118; background: var(--logo-bleu, #02234E);
  -webkit-mask: url("logo-texte.png") center / contain no-repeat; mask: url("logo-texte.png") center / contain no-repeat; }

.ligne-boutons { display: flex; flex-wrap: wrap; gap: 8px; }

/* Boîtes de dialogue dans la page (remplacent alert/confirm/prompt, muets ou faussés dans le logiciel) */
.boite-dialogue { width: min(480px, 100%); }
.boite-dialogue p { margin: 0 0 14px; white-space: pre-line; line-height: 1.45; }
.boite-dialogue .champ-boite { width: 100%; margin: 0 0 14px; font-size: 16px; }
.boite-dialogue .ligne-boutons { justify-content: flex-end; }
.boite-dialogue button.principal.danger { background: var(--majeur); color: #fff; }

/* Nexactis pour Mac (bilan du 08/10/2026) : la barre de titre est fondue dans l'en-tête, comme dans les applications
   d'Apple ; les trois boutons de fenêtre s'y posent à gauche, l'en-tête sert de poignée pour déplacer la fenêtre. */
html[data-app="mac"] .barre { padding-left: 86px; min-height: 52px; -webkit-user-select: none; user-select: none; }
html[data-app="mac"] .barre .marque { cursor: default; }

/* Organigramme : points à confirmer d'un clic (08/10/2026) */
.points-a-confirmer { list-style: none; padding: 0; margin: 8px 0 0; display: grid; gap: 10px; }
.points-a-confirmer li { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 10px 12px; border-radius: 10px; background: var(--surface); }
.points-a-confirmer li .ligne-boutons { flex: none; display: flex; gap: 8px; align-items: center; }
@media (max-width: 560px) { .points-a-confirmer li { flex-direction: column; align-items: stretch; } }

/* Téléphone (bilan du 08/10/2026) : un long nom de fichier, un chemin ou une adresse ne font plus déborder la page. */
.carte p, .carte li, .avis-zone, .avis-envoi, .depot, .boite-dialogue p { overflow-wrap: anywhere; }
@media (max-width: 400px) {
  html[data-interface="epuree"] .segments a { padding: 6px 2px; font-size: .78rem; }
}
/* Téléphone : six espaces sur une grille de trois colonnes, sans coupure de mot (« rédac-tion », audit du 10/10/2026). */
@media (max-width: 560px) {
  html[data-interface="epuree"] .segments { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
  html[data-interface="epuree"] .segments a { hyphens: manual; overflow-wrap: normal; word-break: normal; display: flex; align-items: center; justify-content: center; min-height: 44px; }
}
/* Logiciel : image du dossier (organigramme, photo aérienne) ouverte en grand dans la page ; clic ou Échap pour fermer. */
.apercu-grand { cursor: zoom-out; padding: 24px; }
.apercu-grand img { max-width: 100%; max-height: calc(100vh - 48px); background: #fff; border-radius: 8px; box-shadow: 0 10px 40px rgb(0 0 0 / 35%); }
/* Bouton de suppression d'une boîte de dialogue : contraste suffisant en mode sombre. */
@media (prefers-color-scheme: dark) { .boite-dialogue button.principal.danger { background: #d92d20; } }

/* Pied de page : aide et conditions, sur toutes les pages (audit d'ergonomie du 10/10/2026 : aucun contact visible). */
.pied { text-align: center; padding: 24px 16px 32px; }
.pied a { color: inherit; }
/* Lien d'évitement : invisible, sauf au clavier (Tab), pour aller droit au contenu (accessibilité, audit du 10/10/2026). */
.evitement { position: absolute; left: -9999px; top: 8px; z-index: 1000; padding: 8px 14px; border-radius: 8px; background: var(--accent-plein); color: var(--accent-texte); }
.evitement:focus { left: 8px; }

/* Feu vert de signature (11/10/2026) */
.feu-vert h2 { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.feu-vert .ligne-date { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.liste-feu { list-style: none; padding: 0; margin: 12px 0 0; display: grid; gap: 12px; }
.liste-feu .point-feu p { margin: 4px 0 0; }
.feu-vert details { margin-top: 12px; }

/* Équipe : fonctions ouvertes et suivi par collaborateur (12/10/2026) */
fieldset.fonctions { border: 1px solid var(--ligne); border-radius: 12px; padding: 10px 14px; margin: 0 0 12px; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 4px 16px; }
fieldset.fonctions legend { font-weight: 600; padding: 0 6px; }
.liste-suivi { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.liste-suivi summary { cursor: pointer; }
.liste-suivi .grille { margin-top: 8px; }