/* Gestion Qualiopi MeetnSpeak — pensé d'abord pour le téléphone, puis l'écran large. */
:root {
  /* Charte meetnspeak.fr (6 nov 2026) : turquoise de marque, ambre d'action, fond crème, anthracite. */
  --turquoise: #4cbdc2;          /* logo, grands titres, décor (pas pour du texte courant : 2,4:1 sur blanc) */
  --turquoise-sombre: #167c82;   /* liens, boutons, titres d'écran : 4,9:1 sur blanc */
  --turquoise-encre: #11595e;    /* panneau de connexion, survol des boutons */
  --turquoise-fond: #e3f0f1;     /* teinte claire du site */
  --ambre: #ffa300;              /* action principale, texte anthracite dessus (7,8:1) */
  --ambre-sombre: #e08f00;
  --ambre-fond: #f8e9cd;
  --bleu-site: #135c91;          /* second bouton du site : information */
  --bleu-site-fond: #dfe8ef;
  --ink: #212121;
  --ink-doux: #424242;
  --gris: #6b6b6b;
  --trait: #eae3d6;
  --fond: #fdf6eb;
  --carte: #fffefb;
  --ok: #1f7a4d;
  --ok-fond: #d4e8dc;
  --attente: #8a5a00;
  --attente-fond: #f8e9cd;
  --alerte: #b8463a;
  --alerte-fond: #f5ddda;
  --neutre: #5a5a5a;
  --neutre-fond: #f2f5f7;
  --ok-trait: #bcd9c7;           /* bordures des états : une teinte plus marquée que le fond de l'état */
  --attente-trait: #f1d49a;
  --alerte-trait: #ebc5c0;
  --info-trait: #c3d3e2;
  --blanc: #fffdf9;              /* texte sur fond coloré : blanc légèrement crème, jamais #fff pur */
  --sur-fonce: #e4f1f2;          /* texte secondaire sur turquoise encre */
  --trad-sur-fonce: #d9eef0;
  --rayon: 10px;
  --rayon-bouton: 999px;
  --sortie: cubic-bezier(0.23, 1, 0.32, 1);   /* ease-out franc pour les retours d'action */
  --titre: "Oswald", "Arial Narrow", "Segoe UI", sans-serif;
  --texte: "Open Sans", "Segoe UI", sans-serif;
  --mono: ui-monospace, "Cascadia Mono", "Consolas", monospace;
  /* anciens noms, conservés pour les règles existantes */
  --bleu: var(--turquoise-sombre);
  --bleu-sombre: var(--turquoise-encre);
  --bleu-clair: var(--turquoise-fond);
  --orange: var(--ambre);
  --orange-fond: var(--ambre-fond);
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--texte); font-size: 16px; line-height: 1.5; color: var(--ink); background: var(--fond);
  padding-bottom: env(safe-area-inset-bottom); }
h1, h2, h3 { font-family: var(--titre); font-weight: 600; letter-spacing: 0.01em; margin: 0; line-height: 1.2; color: var(--turquoise-sombre); }
h1 { font-size: 1.75rem; } h2 { font-size: 1.35rem; } h3 { font-size: 1.1rem; color: var(--ink); }
a { color: var(--bleu); }
.inline { display: inline; margin: 0; }
small, .meta { font-size: 0.86rem; color: var(--gris); }
a { transition: color 150ms ease; }
:focus-visible { outline: 2px solid var(--orange); outline-offset: 2px; border-radius: 4px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; } }

/* barre */
.barre { background: var(--carte); color: var(--ink); position: sticky; top: 0; z-index: 20; border-bottom: 1px solid var(--trait); }
.logo { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); }
.logo img { height: 30px; width: auto; display: block; }
.logo small { font-family: var(--titre); font-weight: 500; font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--gris); border-left: 1px solid var(--trait); padding-left: 10px; line-height: 1; }
.barre .dedans { max-width: 1100px; margin: 0 auto; padding: 8px 16px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.marque { font-family: var(--titre); font-weight: 600; font-size: 1.3rem; color: var(--turquoise); text-decoration: none; display: flex; flex-direction: column; line-height: 1.05; letter-spacing: 0.01em; }
.marque span { color: var(--ambre); }
.marque small { font-size: 0.7rem; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gris); }
.onglets { display: flex; gap: 2px; margin-left: auto; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.onglets::-webkit-scrollbar { display: none; }
.onglets a { color: var(--ink-doux); text-decoration: none; font-size: 0.95rem; font-weight: 600; padding: 8px 12px; min-height: 40px; display: inline-flex; align-items: center; border-radius: var(--rayon-bouton); white-space: nowrap; transition: background 150ms ease, color 150ms ease; }
.onglets a[aria-current="page"] { background: var(--turquoise-fond); color: var(--turquoise-encre); }
.qui { font-size: 0.84rem; color: var(--gris); display: none; }
.quitter { background: transparent; color: var(--ink-doux); border: 1px solid var(--trait); border-radius: var(--rayon-bouton); padding: 6px 14px; min-height: 36px; font-size: 0.84rem; font-family: var(--texte); cursor: pointer; transition: transform 160ms var(--sortie), background 150ms ease, border-color 150ms ease; }
.quitter:active { transform: scale(0.97); }
.sous-onglets { background: var(--carte); border-bottom: 1px solid var(--trait); }
.sous-onglets .dedans { max-width: 1100px; margin: 0 auto; padding: 0 12px; display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none; }
.sous-onglets a { text-decoration: none; color: var(--ink-doux); font-weight: 600; font-size: 0.9rem; padding: 12px 10px; min-height: 44px; display: inline-flex; align-items: center; border-bottom: 2px solid transparent; white-space: nowrap; transition: color 150ms ease, border-color 150ms ease; }
.sous-onglets a[aria-current="page"] { color: var(--turquoise-encre); border-bottom-color: var(--ambre); }
@media (max-width: 719px) {
  .barre .dedans { gap: 8px; }
  .quitter { margin-left: auto; }
  .onglets { order: 3; width: 100%; margin-left: 0; }
  .onglets a { padding: 7px 10px; font-size: 0.9rem; }
}
@media (min-width: 720px) { .qui { display: inline; } .barre .dedans { padding: 10px 20px; } .logo img { height: 34px; } }
@media (max-width: 719px) { .logo small { display: none; } }

main { max-width: 1100px; margin: 0 auto; padding: 18px 16px 60px; }
.entete { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.entete p { color: var(--ink-doux); margin: 4px 0 0; }
.surtitre { font-family: var(--mono); font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.1em; color: var(--ambre-sombre); margin: 0 0 4px; }
section { margin-bottom: 26px; }
section > h2 { padding-bottom: 6px; border-bottom: 1px solid var(--trait); margin-bottom: 12px; display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; }

.grille { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.grille.serree { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
.carte { background: var(--carte); border: 1px solid var(--trait); border-radius: var(--rayon); padding: 14px 16px; }
.carte h3 { margin-bottom: 4px; }
.carte.appel { border-color: var(--attente-trait); background: var(--ambre-fond); }
.carte.alerte { border-color: var(--alerte-trait); background: var(--alerte-fond); }
.carte.lien { text-decoration: none; color: inherit; display: block; transition: border-color 150ms ease, transform 160ms var(--sortie); }
@media (hover: hover) and (pointer: fine) { .carte.lien:hover { border-color: var(--bleu); } }
.carte.lien:active { transform: scale(0.99); }
.chiffre { font-family: var(--titre); font-size: 1.6rem; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--bleu); }
.legende { font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.07em; color: var(--gris); }
.valeurs { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0 24px; margin: 0; background: var(--carte); border: 1px solid var(--trait); border-radius: var(--rayon); padding: 6px 16px; }
.valeurs > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--trait); }
.valeurs > div:last-child { border-bottom: none; }
@media (min-width: 640px) { .valeurs > div:nth-last-child(-n+2) { border-bottom: none; } }
.valeurs dt { margin: 0; font-size: 0.9rem; color: var(--ink-doux); }
.valeurs dd { margin: 0; font-family: var(--titre); font-weight: 800; font-size: 1.15rem; font-variant-numeric: tabular-nums; color: var(--bleu); white-space: nowrap; }

.tableau { width: 100%; border-collapse: collapse; background: var(--carte); border: 1px solid var(--trait); border-radius: var(--rayon); overflow: hidden; }
.tableau th { text-align: left; font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.07em; color: var(--gris); font-weight: 600; padding: 10px 12px; border-bottom: 1px solid var(--trait); background: var(--neutre-fond); }
.tableau td { padding: 10px 12px; border-bottom: 1px solid var(--trait); vertical-align: top; }
.tableau tr:last-child td { border-bottom: none; }
.tableau .nombre { font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.defilant { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.ref { font-family: var(--mono); font-size: 0.8rem; color: var(--ink-doux); }

.etat { display: inline-block; font-size: 0.76rem; font-weight: 700; letter-spacing: 0.03em; padding: 2px 9px; border-radius: 999px; white-space: nowrap; }
.etat.ok { background: var(--ok-fond); color: var(--ok); }
.etat.info { background: var(--bleu-site-fond); color: var(--bleu-site); }
.etat.attente { background: var(--attente-fond); color: var(--attente); }
.etat.alerte { background: var(--alerte-fond); color: var(--alerte); }
.etat.neutre { background: var(--neutre-fond); color: var(--neutre); }

.bouton, button.bouton { display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-family: var(--texte); font-size: 0.92rem; font-weight: 600;
  min-height: 44px; padding: 8px 18px; border-radius: var(--rayon-bouton); border: 1px solid var(--turquoise-sombre); background: var(--turquoise-sombre); color: var(--blanc); text-decoration: none; cursor: pointer;
  touch-action: manipulation; transition: transform 160ms var(--sortie), background 150ms ease, border-color 150ms ease; }
.bouton:active { transform: scale(0.97); }
.bouton.orange { background: var(--ambre); border-color: var(--ambre); color: var(--ink); font-weight: 700; }
.bouton.discret { background: transparent; color: var(--ink); border-color: var(--trait); }
@media (hover: hover) and (pointer: fine) {
  .bouton:hover { background: var(--bleu-sombre); border-color: var(--bleu-sombre); }
  .bouton.orange:hover { background: var(--ambre-sombre); border-color: var(--ambre-sombre); }
  .bouton.discret:hover { background: var(--carte); border-color: var(--ink); }
}
.bouton.mini { min-height: 36px; padding: 4px 14px; font-size: 0.84rem; }
.bouton.danger { background: transparent; color: var(--alerte); border-color: var(--alerte); }
.bouton[disabled] { opacity: 0.45; cursor: not-allowed; }
.bouton[disabled]:active { transform: none; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

label { display: block; font-size: 0.76rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ink-doux); margin-bottom: 4px; }
input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], input[type=time], input[type=tel], input[type=url], textarea, select {
  width: 100%; padding: 10px 12px; font-family: var(--texte); font-size: 16px; border: 1px solid var(--trait); border-radius: var(--rayon); background: var(--carte); color: var(--ink); }
input, textarea, select { transition: border-color 150ms ease, outline-color 150ms ease; }
input:focus, textarea:focus, select:focus { outline: 2px solid rgba(76, 189, 194, 0.45); outline-offset: 1px; border-color: var(--turquoise-sombre); }
textarea { min-height: 80px; resize: vertical; }
textarea.long { min-height: 160px; }
.champ { margin-bottom: 12px; }
.champ .aide { display: block; font-size: 0.8rem; color: var(--gris); margin-top: 3px; text-transform: none; letter-spacing: 0; font-weight: 400; }
.duo { display: grid; gap: 12px; grid-template-columns: 1fr; }
.trio { display: grid; gap: 12px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .duo { grid-template-columns: 1fr 1fr; } .trio { grid-template-columns: 1fr 1fr 1fr; } }
fieldset { border: 1px solid var(--trait); border-radius: var(--rayon); padding: 14px 16px; margin: 0 0 16px; background: var(--carte); min-width: 0; }
legend { font-family: var(--titre); font-weight: 800; padding: 0 6px; font-size: 0.95rem; }
.coche { display: flex; gap: 10px; align-items: flex-start; font-size: 0.95rem; text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--ink); }
.coche input { width: auto; margin-top: 4px; }
input[type=checkbox], input[type=radio] { accent-color: var(--bleu); width: auto; }

.message { padding: 10px 14px; border-radius: var(--rayon); margin-bottom: 14px; font-size: 0.92rem; }
.message.erreur { background: var(--alerte-fond); color: var(--alerte); border: 1px solid var(--alerte-trait); }
.message.succes { background: var(--ok-fond); color: var(--ok); border: 1px solid var(--ok-trait); }
.message.info { background: var(--bleu-site-fond); color: var(--bleu-site); border: 1px solid var(--info-trait); }
.vide { color: var(--gris); font-style: italic; }
.copier { font-family: var(--mono); font-size: 0.8rem; word-break: break-all; background: var(--carte); border: 1px dashed var(--gris); padding: 8px 10px; border-radius: 6px; }

/* connexion */
.accueil { min-height: 100svh; display: grid; place-items: center; padding: 24px 16px; }
.boite { width: 100%; max-width: 400px; background: var(--carte); border: 1px solid var(--trait); border-radius: 12px; padding: 28px; }
.boite .marque { color: var(--bleu); margin-bottom: 14px; }
.boite .marque small { color: var(--gris); }
.boite h1 { font-size: 1.3rem; margin-bottom: 14px; }
.boite .bouton { width: 100%; }
.sous-boite { margin-top: 16px; font-size: 0.85rem; text-align: center; }

/* parcours (fiche dossier) */
.prochaine { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin: 0 0 12px; font-size: 1.05rem; }
.prochaine .surtitre { margin: 0; }
.prochaine a { font-weight: 700; }
.parcours { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.parcours li { display: grid; grid-template-columns: 30px 1fr auto; gap: 10px; align-items: center; background: var(--carte); border: 1px solid var(--trait); border-radius: var(--rayon); padding: 10px 12px; }
.parcours li.fait { border-color: var(--ok-trait); }
.parcours li.courante { border-color: var(--orange); background: var(--orange-fond); }
.parcours .puce { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 0.8rem; font-weight: 600; font-family: var(--titre); background: var(--neutre-fond); color: var(--neutre); }
.parcours .fait .puce { background: var(--ok); color: var(--blanc); }
.parcours .courante .puce { background: var(--ambre); color: var(--ink); }
.parcours .quoi b { display: block; }
.parcours .quoi small { display: block; }
.parcours .preuves { font-size: 0.86rem; }
.parcours .preuves a { display: block; }
details { background: var(--carte); border: 1px solid var(--trait); border-radius: var(--rayon); padding: 10px 14px; margin-bottom: 10px; }
details summary { cursor: pointer; font-weight: 700; font-family: var(--titre); }
details[open] summary { margin-bottom: 10px; }

.signature-zone { border: 1px dashed var(--gris); border-radius: var(--rayon); background: var(--carte); touch-action: none; display: block; width: 100%; max-width: 480px; height: 160px; }
.signee .signature-zone { border-style: solid; border-color: var(--bleu); }
.preuve { font-family: var(--mono); font-size: 0.8rem; color: var(--ink-doux); line-height: 1.7; }
.preuve img { display: block; max-width: 260px; margin-top: 6px; border: 1px solid var(--trait); background: var(--carte); }

/* questionnaire public */
.public { max-width: 680px; margin: 0 auto; padding: 16px 16px 90px; }
.public .entete-public { padding: 14px 0 12px; border-bottom: 3px solid var(--ambre); margin-bottom: 18px; }
.public .logo img { height: 32px; }
.question { background: var(--carte); border: 1px solid var(--trait); border-radius: var(--rayon); padding: 14px 16px; margin-bottom: 10px; }
.question > label, .question .libelle { font-size: 1rem; text-transform: none; letter-spacing: 0; font-weight: 700; color: var(--ink); margin-bottom: 8px; }
.notes { display: flex; gap: 6px; }
.notes label { flex: 1; text-align: center; border: 1px solid var(--trait); border-radius: var(--rayon); padding: 12px 0; min-height: 44px; cursor: pointer; font-size: 1rem; text-transform: none; letter-spacing: 0; color: var(--ink); background: var(--carte); transition: background 150ms ease, border-color 150ms ease, transform 160ms var(--sortie); }
.notes label:active, .oui-non label:active { transform: scale(0.97); }
.notes label:has(input:focus-visible), .oui-non label:has(input:focus-visible) { outline: 2px solid var(--orange); outline-offset: 2px; }
.notes input { position: absolute; opacity: 0; }
.notes input:checked + span { color: var(--blanc); }
.notes label:has(input:checked) { background: var(--bleu); border-color: var(--bleu); color: var(--blanc); }
.oui-non { display: flex; gap: 8px; }
.oui-non label { flex: 1; text-align: center; border: 1px solid var(--trait); border-radius: var(--rayon); padding: 12px; min-height: 44px; cursor: pointer; text-transform: none; letter-spacing: 0; font-size: 1rem; color: var(--ink); background: var(--carte); transition: background 150ms ease, border-color 150ms ease, transform 160ms var(--sortie); }
.oui-non label:has(input:checked) { background: var(--bleu); border-color: var(--bleu); color: var(--blanc); }
.oui-non input { position: absolute; opacity: 0; }
.dock { position: fixed; left: 0; right: 0; bottom: 0; background: var(--carte); border-top: 1px solid var(--trait); padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); z-index: 10; }
.dock .dedans { max-width: 680px; margin: 0 auto; display: flex; gap: 10px; align-items: center; justify-content: space-between; }
.dock .bouton { flex: 0 0 auto; min-width: 150px; white-space: nowrap; }
.dock .aide { margin: 0; font-size: 0.86rem; color: var(--gris); flex: 1 1 auto; min-width: 0; }
.dock .aide[hidden] { display: none; }

.journal { list-style: none; margin: 0; padding: 0; font-size: 0.86rem; }
.journal li { padding: 6px 0; border-bottom: 1px solid var(--trait); display: flex; gap: 10px; flex-wrap: wrap; }
.journal li:last-child { border-bottom: none; }
.journal .quand { color: var(--gris); font-family: var(--mono); font-size: 0.8rem; min-width: 110px; }

.indicateur { display: grid; grid-template-columns: 44px 1fr; gap: 10px; background: var(--carte); border: 1px solid var(--trait); border-radius: var(--rayon); padding: 10px 12px; margin-bottom: 8px; }
.indicateur .num { font-family: var(--titre); font-weight: 800; font-size: 1.2rem; color: var(--bleu); }
.indicateur.na { opacity: 0.6; }
.indicateur.manque { border-color: var(--alerte-trait); }
.indicateur.manque .num { color: var(--alerte); }
.indicateur.couvert { border-color: var(--ok-trait); }
.indicateur.couvert .num { color: var(--ok); }
.indicateur ul { margin: 4px 0 0; padding-left: 18px; font-size: 0.88rem; }

.pied { max-width: 1100px; margin: 0 auto; padding: 0 16px 30px; font-size: 0.8rem; color: var(--gris); }
.pile { display: grid; gap: 10px; }
.sep { height: 1px; background: var(--trait); margin: 14px 0; }

/* onglets d'un dossier : hub + sous-pages */
.onglets-dossier { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; margin: 0 -16px 14px; padding: 0 16px; border-bottom: 1px solid var(--trait); }
.onglets-dossier::-webkit-scrollbar { display: none; }
.onglets-dossier a { text-decoration: none; color: var(--ink-doux); font-weight: 600; font-size: 0.9rem; padding: 12px 10px; min-height: 44px; display: inline-flex; align-items: center; border-bottom: 2px solid transparent; white-space: nowrap; transition: color 150ms ease, border-color 150ms ease; }
.onglets-dossier a b { font-weight: 700; color: var(--bleu); background: var(--bleu-clair); border-radius: 999px; padding: 0 7px; font-size: 0.78rem; margin-left: 4px; }
.onglets-dossier a[aria-current="page"] { color: var(--bleu); border-bottom-color: var(--orange); }
.parcours li { padding: 8px 10px; }
.parcours .quoi small { font-size: 0.84rem; }

/* --- polices auto-hébergées (celles du site meetnspeak.fr ; aucune requête vers Google Fonts) --- */
@font-face { font-family: "Oswald"; font-style: normal; font-weight: 200 700; font-display: swap;
  src: url(/static/fonts/oswald-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Oswald"; font-style: normal; font-weight: 200 700; font-display: swap;
  src: url(/static/fonts/oswald-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 300 800; font-display: swap;
  src: url(/static/fonts/opensans-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 300 800; font-display: swap;
  src: url(/static/fonts/opensans-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

main.plein { max-width: none; padding: 0; }
main.plein + .pied { display: none; }
/* --- page de connexion : même composition que l'espace YH, aux couleurs MeetnSpeak ----- */
.connexion { min-height: 100svh; display: grid; grid-template-columns: minmax(0, 11fr) minmax(0, 9fr); background: var(--fond); }
.connexion-encre { position: relative; background: var(--turquoise-encre); color: var(--sur-fonce); padding: clamp(28px, 5vw, 64px) clamp(28px, 6vw, 88px) clamp(28px, 5vw, 56px) calc(clamp(28px, 6vw, 88px) + 34px);
  display: flex; flex-direction: column; justify-content: space-between; border-right: 3px solid var(--orange); }
.connexion-encre::before { content: "GESTION QUALIOPI · MEETNSPEAK · ABAJAD SAS · CHÂTILLON"; position: absolute; left: clamp(14px, 2vw, 26px); top: 50%;
  transform: translateY(-50%) rotate(180deg); writing-mode: vertical-rl; font-family: var(--mono); font-size: 0.62rem; letter-spacing: 0.24em; color: rgba(255,255,255,0.5); white-space: nowrap; }
.connexion-encre::after { content: ""; position: absolute; left: calc(clamp(14px, 2vw, 26px) + 18px); top: clamp(28px, 5vw, 64px); bottom: clamp(28px, 5vw, 56px); width: 1px; background: rgba(255,255,255,0.16); }
.connexion-encre .marque { align-self: flex-start; color: var(--blanc); }
.connexion-encre .marque small { color: rgba(255,255,255,0.65); }
.connexion-eyebrow { font-family: var(--mono); font-size: 0.74rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gris); margin: 0; }
.connexion-encre .connexion-eyebrow { color: rgba(255,255,255,0.6); }
.connexion-encre h1 { font-size: clamp(2.8rem, 6vw, 5.8rem); line-height: 0.98; letter-spacing: 0; font-weight: 600; color: var(--blanc); max-width: 13ch; margin: 28px 0 22px; }
.connexion-encre h1 em { font-style: normal; color: var(--orange); }
.connexion-texte { color: rgba(255,255,255,0.8); max-width: 44ch; font-size: 0.98rem; margin: 0; }
.connexion-bas { display: flex; align-items: center; gap: 14px; font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(255,255,255,0.6); }
.connexion-bas b { width: 8px; height: 8px; background: var(--orange); display: inline-block; }
.connexion-papier { display: flex; align-items: center; justify-content: center; padding: clamp(28px, 5vw, 64px) clamp(24px, 5vw, 72px); }
.connexion-carte { width: min(100%, 420px); }
.connexion-tete { display: flex; align-items: baseline; gap: 14px; padding-bottom: 12px; border-bottom: 2px solid var(--turquoise-sombre); margin-bottom: 22px; }
.connexion-tete .num { font-family: var(--mono); font-size: 0.72rem; color: var(--ambre-sombre); letter-spacing: 0.1em; }
.connexion-tete h2 { font-size: clamp(1.8rem, 2.6vw, 2.3rem); line-height: 1; letter-spacing: 0.01em; font-weight: 600; margin: 0; white-space: nowrap; color: var(--turquoise-sombre); }
.connexion-tete .connexion-eyebrow { margin-left: auto; }
.connexion-sous { margin: 0 0 24px; color: var(--ink-doux); font-size: 0.95rem; max-width: 40ch; }
.connexion .message.erreur { margin-bottom: 18px; }
.fournisseurs { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--turquoise-sombre); border-radius: var(--rayon); overflow: hidden; }
.fournisseur { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; min-height: 108px; padding: 18px 12px; background: var(--carte); color: var(--bleu);
  font-size: 0.9rem; font-weight: 700; line-height: 1.2; text-decoration: none; text-align: center; transition: background 150ms ease, color 150ms ease, transform 160ms var(--sortie); }
.fournisseur:active { transform: scale(0.98); }
.fournisseur + .fournisseur { border-left: 1px solid var(--turquoise-sombre); }
.fournisseur:only-child { grid-column: 1 / -1; }
.fournisseur svg { width: 26px; height: 26px; }
.fournisseur span { display: block; }
.fournisseur small { display: block; font-family: var(--mono); font-weight: 400; font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--gris); margin-top: 3px; }
@media (hover: hover) and (pointer: fine) {
  .fournisseur:hover { background: var(--turquoise-sombre); color: var(--blanc); }
  .fournisseur:hover small { color: rgba(255,255,255,0.6); }
}
.connexion-separateur { display: flex; align-items: center; gap: 14px; margin: 26px 0 18px; font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--gris); }
.connexion-separateur::before, .connexion-separateur::after { content: ""; flex: 1; height: 1px; background: var(--trait); }
.connexion-form { display: grid; }
.connexion-form label { margin: 0 0 4px; }
.connexion-form input[type=email], .connexion-form input[type=password] { border: 0; border-bottom: 1px solid var(--trait); border-radius: 0; background: transparent; padding: 10px 0 12px; margin-bottom: 18px; font-size: 1.02rem; box-shadow: none; }
.connexion-form input:focus { outline: none; border-bottom: 2px solid var(--turquoise); padding-bottom: 11px; box-shadow: none; }
.connexion-form input:focus-visible { outline: none; }
.connexion-form .bouton { display: flex; justify-content: space-between; align-items: center; margin-top: 6px; min-height: 52px; padding: 0 20px 0 24px; font-size: 0.95rem; background: var(--ambre); border-color: var(--ambre); color: var(--ink); font-weight: 700; }
.connexion-form .bouton svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.connexion-pied { margin: 30px 0 0; display: flex; justify-content: space-between; gap: 14px; flex-wrap: wrap; font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--gris); }
.connexion-pied a { color: var(--turquoise-sombre); }
@media (max-width: 860px) {
  .connexion { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .connexion-encre { border-right: 0; border-bottom: 3px solid var(--orange); padding: 20px clamp(20px, 6vw, 40px) 18px; }
  .connexion-encre::before, .connexion-encre::after { display: none; }
  .connexion-encre h1 { font-size: 2.1rem; margin: 14px 0 10px; }
  .connexion-texte, .connexion-encre .connexion-eyebrow { display: none; }
  .connexion-bas { margin-top: 10px; }
  .connexion-papier { align-items: flex-start; padding: 22px 20px 28px; }
  .connexion-tete { margin-bottom: 16px; }
  .connexion-sous { margin-bottom: 16px; }
  .fournisseur { min-height: 84px; padding: 12px 10px; gap: 8px; }
  .connexion-separateur { margin: 18px 0 12px; }
  .connexion-pied { margin-top: 20px; }
}

/* --- utilitaires (remplacent les styles en ligne, interdits par la CSP) --------------- */
.mt-4 { margin-top: 4px; } .mt-6 { margin-top: 6px; } .mt-8 { margin-top: 8px; } .mt-10 { margin-top: 10px; }
.mt-12 { margin-top: 12px; } .mt-14 { margin-top: 14px; } .mt-18 { margin-top: 18px; }
.mb-0 { margin-bottom: 0; } .mb-8 { margin-bottom: 8px; } .mb-10 { margin-bottom: 10px; } .mb-12 { margin-bottom: 12px; } .mb-14 { margin-bottom: 14px; }
.m-0 { margin: 0; } .my-12 { margin: 12px 0; } .my-14 { margin: 14px 0; } .retrait-12 { margin: 4px 0 4px 12px; }
.carte-compacte { padding: 10px 14px; }
.ligne-entre { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.ligne-entre.base { align-items: baseline; }
.trio-large { grid-template-columns: 1.2fr 0.8fr 0.8fr; } .trio-fin { grid-template-columns: 0.7fr 0.7fr 1.6fr; }
.l-60 { width: 60px; } .lmax-120 { max-width: 120px; } .lmax-130 { max-width: 130px; } .lmax-140 { max-width: 140px; }
.lmax-160 { max-width: 160px; } .lmax-260 { max-width: 260px; } .lmax-320 { max-width: 320px; } .lmax-360 { max-width: 360px; }
.texte-orange { color: var(--ambre); }

/* --- conformité de l'organisme ----------------------------------------------------- */
.valeurs-courtes { grid-template-columns: repeat(2, minmax(120px, 1fr)); gap: 0 18px; padding: 4px 14px; }
.valeurs-courtes > div { padding: 7px 0; }
.texte-ok { color: var(--ok); } .texte-alerte { color: var(--alerte); }
.obligation { padding: 0; margin-bottom: 8px; }
.obligation summary { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 14px; min-height: 48px; font-family: var(--texte); font-weight: 600; list-style: none; }
.obligation summary::-webkit-details-marker { display: none; }
.obligation summary::after { content: "+"; margin-left: auto; font-family: var(--titre); font-size: 1.2rem; color: var(--gris); }
.obligation[open] summary::after { content: "–"; }
.obligation[open] summary { margin-bottom: 0; border-bottom: 1px solid var(--trait); }
.obligation-titre { flex: 1 1 220px; }
.obligation-titre small { font-weight: 400; color: var(--gris); }
.obligation-date { font-family: var(--mono); font-size: 0.8rem; color: var(--ink-doux); white-space: nowrap; }
.obligation-date small { color: var(--gris); }
.obligation.etat-retard { border-color: var(--alerte-trait); } .obligation.etat-retard summary { background: var(--alerte-fond); }
.obligation.etat-bientot summary, .obligation.etat-a_faire summary { background: var(--ambre-fond); }
.obligation.etat-na { opacity: 0.7; }
.obligation-corps { padding: 12px 14px 14px; font-size: 0.95rem; }
.obligation-form { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--trait); }
.obligation-form .champ { margin: 0; flex: 1 1 160px; }
.obligation-form .champ input[type=file] { font-size: 0.9rem; }

/* --- dossier permanent : les pièces ------------------------------------------------- */
.segments { display: flex; gap: 8px; margin: 0 0 16px; }
.segments a { flex: 1 1 0; min-height: 48px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; padding: 6px 12px; border: 1px solid var(--trait); border-radius: var(--rayon-bouton); background: var(--carte); color: var(--ink); font-weight: 600; font-size: 0.92rem; text-decoration: none; text-align: center; transition: border-color 150ms ease, background-color 150ms ease, transform 160ms var(--sortie); }
.segments a small { font-weight: 500; font-size: 0.78rem; color: var(--ink-doux); }
.segments a[aria-current="page"] { background: var(--turquoise-encre); border-color: var(--turquoise-encre); color: var(--blanc); }
.segments a[aria-current="page"] small { color: rgba(255, 255, 255, 0.78); }
.segments a:active { transform: scale(0.97); }
@media (hover: hover) and (pointer: fine) { .segments a:not([aria-current="page"]):hover { border-color: var(--turquoise-sombre); } }
.obligation.etat-perimee, .obligation.etat-manquante { border-color: var(--alerte-trait); }
.obligation.etat-perimee summary, .obligation.etat-manquante summary { background: var(--alerte-fond); }
.obligation.etat-facultative { opacity: 0.85; }
.liens-piece { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 0.92rem; }

/* --- mobile : sections repliables (details.repliable) et formulaires longs ------------- */
details.repliable { padding: 0; }
details.repliable > summary { list-style: none; cursor: pointer; padding: 12px 14px; min-height: 48px; display: flex; align-items: center; gap: 10px; }
details.repliable > summary::-webkit-details-marker { display: none; }
details.repliable > summary h2 { margin: 0; border: 0; padding: 0; flex: 1; }
details.repliable > summary::after { content: "+"; font-family: var(--titre); font-size: 1.25rem; color: var(--gris); }
details.repliable[open] > summary::after { content: "–"; }
details.repliable[open] > summary { margin-bottom: 0; }
details.repliable > .corps { padding: 0 14px 12px; }
@media (min-width: 720px) {
  details.repliable { background: transparent; border: 0; margin-bottom: 26px; }
  details.repliable > summary { padding: 0; min-height: 0; pointer-events: none; }
  details.repliable > summary::after { display: none; }
  details.repliable > summary h2 { padding-bottom: 6px; border-bottom: 1px solid var(--trait); margin-bottom: 12px; }
  details.repliable > .corps { padding: 0; }
}
@media (max-width: 719px) {
  form fieldset > legend.basculable { cursor: pointer; display: flex; align-items: center; gap: 8px; min-height: 36px; padding-right: 0; }
  form fieldset > legend.basculable::after { content: "–"; margin-left: 10px; color: var(--gris); font-family: var(--titre); font-size: 1.15rem; }
  form fieldset.replie > legend.basculable::after { content: "+"; }
  form fieldset.replie > :not(legend) { display: none; }
  form fieldset.replie { padding-top: 6px; padding-bottom: 6px; }
  form.formulaire-long > .actions { position: sticky; bottom: 0; background: var(--fond); padding: 10px 0 calc(10px + env(safe-area-inset-bottom)); border-top: 1px solid var(--trait); z-index: 5; }
  .carte.lien .detail { display: none; }
  .mobile-cache { display: none; }
}

/* --- garde-fous mobile : aucune image ni bloc ne doit élargir la page ---------------- */
main img, .public img { max-width: 100%; height: auto; }
.cachet-apercu { display: block; max-width: 360px; width: 100%; margin: 0; }
main, .public, .carte, fieldset, .obligation-corps, .question { min-width: 0; overflow-wrap: anywhere; }
.mt-8 { margin-top: 8px; } .mt-12 { margin-top: 12px; }

/* --- espace stagiaire : langues, progression, agenda, ressources, aide, questionnaire pas à pas (7 nov 2026) --- */
.langues { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 4px; }
.langues a { font-size: 0.78rem; padding: 6px 11px; min-height: 32px; display: inline-flex; align-items: center; border: 1px solid var(--trait); border-radius: 999px; text-decoration: none; color: var(--ink-doux); background: var(--carte); transition: background 150ms ease, color 150ms ease; }
.langues a[aria-current] { background: var(--turquoise-sombre); color: var(--blanc); border-color: var(--turquoise-sombre); }
.trad { display: block; color: var(--turquoise-encre); font-size: 0.93em; font-weight: 400; margin-top: 2px; line-height: 1.45; }
.trad[dir="rtl"] { text-align: right; font-size: 1.06em; }
.vo { display: inline; }
.frise { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; margin: 16px 0 6px; padding: 0; }
.frise li { text-align: center; position: relative; padding-top: 4px; }
.frise li::before { content: ""; position: absolute; top: 18px; left: -50%; width: 100%; height: 3px; background: var(--trait); }
.frise li:first-child::before { display: none; }
.frise li.fait::before { background: var(--ok); }
.frise .puce { position: relative; z-index: 1; display: inline-flex; width: 30px; height: 30px; border-radius: 50%; align-items: center; justify-content: center; background: var(--carte); border: 2px solid var(--trait); font-weight: 700; font-size: 0.85rem; color: var(--gris); }
.frise .fait .puce { background: var(--ok); border-color: var(--ok); color: var(--blanc); }
.frise .courante .puce { border-color: var(--ambre); color: var(--ink); background: var(--ambre-fond); }
.frise .nom { display: block; font-size: 0.78rem; font-weight: 700; margin-top: 4px; color: var(--ink-doux); line-height: 1.25; }
.frise .nom small { display: block; font-weight: 400; color: var(--turquoise-encre); font-size: 0.74rem; }
.heures { margin: 0 0 14px; color: var(--ink-doux); }
.heures .trad { display: block; margin: 2px 0 0; }
.boutons-ligne { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.boutons-ligne .bouton { flex: 1 1 auto; text-align: center; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
.carte.seance-prochaine { border-color: var(--ambre); background: var(--ambre-fond); }
.ligne-doc { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ligne-doc > a:first-child { text-decoration: none; color: var(--ink); min-width: 0; }
.ressource { display: block; padding: 8px 0; border-top: 1px dashed var(--trait); font-size: 0.92rem; text-decoration: none; color: var(--turquoise-sombre); }
.mot { background: var(--turquoise-fond); border-radius: var(--rayon); padding: 10px 12px; margin-top: 8px; font-size: 0.95rem; white-space: pre-line; }
.ecouter { border: 1px solid var(--trait); background: var(--carte); border-radius: 999px; padding: 3px 9px; font-size: 0.8rem; cursor: pointer; color: var(--ink-doux); margin-left: 6px; min-height: 30px; vertical-align: middle; text-transform: none; letter-spacing: 0; }
.ecouter[hidden] { display: none; }
.ecouter.en-cours { background: var(--turquoise-fond); border-color: var(--turquoise-sombre); color: var(--turquoise-encre); }
.choix { display: grid; gap: 8px; }
.choix label { position: relative; border: 1px solid var(--trait); border-radius: var(--rayon); padding: 12px 14px; min-height: 44px; cursor: pointer; background: var(--carte); text-transform: none; letter-spacing: 0; font-size: 1rem; font-weight: 500; color: var(--ink); display: block; transition: background 150ms ease, border-color 150ms ease, transform 160ms var(--sortie); }
.choix label:active { transform: scale(0.98); }
.choix label:has(input:checked) { background: var(--bleu); border-color: var(--bleu); color: var(--blanc); }
.choix label:has(input:checked) .trad { color: var(--trad-sur-fonce); }
.choix label:has(input:focus-visible) { outline: 2px solid var(--orange); outline-offset: 2px; }
.choix input { position: absolute; opacity: 0; }
.oui-non label small { display: block; font-size: 0.8rem; color: var(--turquoise-encre); }
.oui-non label:has(input:checked) small { color: var(--trad-sur-fonce); }
.intro p { margin: 0 0 8px; }
.pas-a-pas .progression { position: sticky; top: 0; background: var(--fond); padding: 10px 0 8px; z-index: 5; }
.pas-a-pas .barre { height: 6px; background: var(--trait); border-radius: 999px; overflow: hidden; }
.pas-a-pas .barre span { display: block; height: 100%; width: 0; background: var(--turquoise-sombre); transition: width 300ms var(--sortie); }
.pas-a-pas .compteur { display: block; font-size: 0.8rem; color: var(--gris); margin-top: 5px; font-family: var(--mono); }
.pas-a-pas.actif .question { display: none; }
.pas-a-pas.actif .question.visible { display: block; }
.pas-a-pas.actif .question > label .vo, .pas-a-pas.actif .question .libelle .vo { font-size: 1.15rem; }
.pas-a-pas.actif textarea { min-height: 150px; font-size: 1.05rem; }
.pas-a-pas.actif input[type="text"] { font-size: 1.05rem; }
.dock .bouton[hidden] { display: none; }
.aide-boutons { display: flex; gap: 8px; margin: 8px 0 12px; }
.aide-boutons .bouton { flex: 1; text-align: center; }
input.code { font-size: 1.7rem; letter-spacing: 0.35em; text-align: center; font-family: var(--mono); }
.lien-brut { font-family: var(--mono); font-size: 0.8rem; word-break: break-all; color: var(--gris); }
.qr-page { text-align: center; }
.qr-page svg { width: min(78vw, 420px); height: auto; display: block; margin: 10px auto; }

/* --- pages du stagiaire : de l'air (7 nov 2026). Rythme large : une idée par bloc, des marges généreuses. --- */
.public { padding: 20px 20px 110px; line-height: 1.6; font-size: 1.02rem; }
.public .entete-public { padding: 16px 0 18px; margin-bottom: 28px; }
.public .logo img { height: 34px; }
.public .langues { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; gap: 8px; margin: 16px 0 0; padding-bottom: 2px; }
.public .langues::-webkit-scrollbar { display: none; }
.public .langues a { flex: 0 0 auto; font-size: 0.86rem; padding: 9px 15px; min-height: 40px; }
.public .meta { margin-top: 12px; }
.public .surtitre { margin-bottom: 10px; letter-spacing: 0.08em; }
.public h1 { font-size: 1.75rem; line-height: 1.2; margin: 0 0 14px; }
.public h1 .trad { font-size: 0.72em; margin-top: 8px; font-weight: 400; }
.public h2 { font-size: 1.25rem; margin: 0 0 14px; }
.public p { margin: 0 0 16px; }
.public section { margin: 32px 0; }
.public .pile { gap: 14px; }
.public .carte { padding: 18px 20px; }
.public .carte-compacte { padding: 16px 18px; }
.public .carte + .carte, .public .mb-8 { margin-bottom: 14px; }
.public .trad { margin-top: 6px; line-height: 1.55; }
.public .frise { margin: 28px 0 10px; gap: 6px; }
.public .frise .puce { width: 34px; height: 34px; font-size: 0.9rem; }
.public .frise li::before { top: 20px; }
.public .frise .nom { margin-top: 8px; font-size: 0.82rem; }
.public .heures { margin: 0 0 28px; font-size: 1.02rem; }
.public .message { padding: 16px 18px; margin: 24px 0; line-height: 1.5; }
.public details.repliable { margin: 18px 0; }
.public details.repliable > summary { padding: 16px 18px; font-size: 1.08rem; min-height: 56px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.public details.repliable[open] > summary { margin-bottom: 14px; }
.public details.repliable > summary .trad { display: inline; margin: 0; font-size: 0.9em; }
.public .boutons-ligne { gap: 10px; margin-top: 14px; }
.public .boutons-ligne .bouton, .public .aide-boutons .bouton { min-height: 48px; padding: 12px 16px; }
.public .bouton { min-height: 48px; padding: 12px 20px; font-size: 1rem; }
.public .bouton.mini { min-height: 44px; padding: 10px 16px; font-size: 0.92rem; }
.public .mot { padding: 14px 16px; margin-top: 12px; line-height: 1.55; }
.public .ressource { padding: 12px 0; }
.public .ligne-doc { padding: 16px 18px; }
.public .aide-boutons { margin: 14px 0 20px; gap: 10px; }
.public .meta.mt-8 { margin-top: 24px; line-height: 1.6; }
/* questionnaire : une question, beaucoup d'air */
.public .intro p { font-size: 1.05rem; margin-bottom: 14px; }
.public .aide.compact { margin: 0 0 22px; line-height: 1.5; color: var(--gris); }
.public .aide.compact small { font-size: 0.92rem; }
.public .aide.compact .trad { display: block; margin: 4px 0 8px; }
.public .pas-a-pas .progression { padding: 14px 0 12px; }
.public .pas-a-pas .compteur { margin-top: 8px; font-size: 0.84rem; }
.public .question { padding: 22px 20px; margin-bottom: 16px; }
.public .question > label, .public .question .libelle { margin-bottom: 14px; line-height: 1.4; }
.public .pas-a-pas.actif .question > label .vo, .public .pas-a-pas.actif .question .libelle .vo { font-size: 1.25rem; }
.public .question .trad { font-size: 1rem; margin-top: 8px; }
.public .notes { gap: 8px; margin: 6px 0 10px; }
.public .notes label { padding: 15px 0; min-height: 54px; font-size: 1.1rem; }
.public .question small { display: block; margin-top: 10px; color: var(--gris); }
.public .oui-non { gap: 10px; }
.public .oui-non label { padding: 15px; min-height: 54px; font-size: 1.05rem; }
.public .choix { gap: 10px; }
.public .choix label { padding: 15px 16px; min-height: 54px; }
.public textarea, .public input[type="text"] { padding: 14px; font-size: 1.05rem; line-height: 1.5; }
.public .pas-a-pas.actif textarea { min-height: 170px; }
.public .ecouter { padding: 6px 12px; min-height: 36px; font-size: 0.84rem; margin-left: 8px; }
.public .dock { padding: 14px 20px calc(14px + env(safe-area-inset-bottom)); }
.public .dock .bouton { min-height: 50px; }
.public .signature-zone { height: 190px; margin: 10px 0; }

/* --- administration : la même respiration que l'espace stagiaire (7 nov 2026) --- */
main { padding: 24px 20px 72px; line-height: 1.6; }
.barre .dedans { padding: 10px 16px; }
.sous-onglets a { padding: 14px 12px; }
.entete { margin-bottom: 26px; gap: 14px; }
.entete p { margin-top: 8px; line-height: 1.55; }
.surtitre { margin-bottom: 8px; }
h1 { font-size: 1.85rem; }
h2 { font-size: 1.4rem; }
section { margin-bottom: 36px; }
section > h2 { padding-bottom: 10px; margin-bottom: 16px; }
.grille { gap: 14px; }
.pile { gap: 12px; }
.carte { padding: 18px 20px; line-height: 1.55; }
.carte h3 { margin-bottom: 8px; }
.carte .detail { display: inline-block; margin-top: 6px; line-height: 1.5; }
.chiffre { margin-top: 4px; }
.valeurs { padding: 10px 20px; }
.valeurs > div { padding: 12px 0; }
.tableau th { padding: 12px 14px; }
.tableau td { padding: 14px; line-height: 1.5; }
.etat { padding: 4px 11px; font-size: 0.78rem; }
.bouton, button.bouton { padding: 10px 20px; }
.bouton.mini { min-height: 40px; padding: 6px 16px; }
.actions { gap: 10px; }
.actions.mb-12, .mb-12 { margin-bottom: 16px; }
.mt-8 { margin-top: 12px; }
.mt-12 { margin-top: 18px; }
label { margin-bottom: 6px; }
input[type=text], input[type=email], input[type=password], input[type=number], input[type=date], input[type=time], input[type=tel], input[type=url], textarea, select { padding: 12px 14px; line-height: 1.4; }
textarea { min-height: 96px; }
.champ { margin-bottom: 16px; }
.champ .aide { margin-top: 5px; line-height: 1.45; }
.duo, .trio { gap: 14px; }
fieldset { padding: 18px 20px; margin-bottom: 20px; }
legend { font-size: 1rem; padding: 0 8px; }
.coche { gap: 12px; line-height: 1.5; }
.message { padding: 14px 16px; margin-bottom: 18px; line-height: 1.5; }
.copier { padding: 12px 14px; line-height: 1.5; }
.prochaine { margin-bottom: 18px; }
.parcours { gap: 10px; }
.parcours li { padding: 14px 16px; gap: 12px; }
.parcours .quoi small { margin-top: 3px; }
details { padding: 14px 18px; margin-bottom: 12px; }
details summary { min-height: 32px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; line-height: 1.4; }
details[open] summary { margin-bottom: 14px; }
details.repliable summary small { font-weight: 400; }
.preuve { line-height: 1.85; }
.journal li { padding: 10px 0; gap: 12px; line-height: 1.5; }
.indicateur { padding: 14px 16px; margin-bottom: 10px; gap: 12px; }
.indicateur ul { margin-top: 8px; line-height: 1.5; }
.onglets-dossier { margin-bottom: 20px; }
.onglets-dossier a { padding: 14px 12px; }
.obligation-corps { line-height: 1.55; }
.sep { margin: 20px 0; }

/* --- passe de finition (polish) 7 nov 2026 : icônes, hiérarchie des boutons, texte >= 14 px sur mobile, entrée des questions --- */
.icone { width: 1.15em; height: 1.15em; flex: 0 0 auto; vertical-align: -0.2em; }
.bouton .icone { margin-right: 2px; }
.ecouter { display: inline-flex; align-items: center; gap: 5px; }
.ecouter .icone { width: 18px; height: 18px; }
.public .sous-titre { font-size: 1.08rem; color: var(--ink); margin: 0 0 6px; line-height: 1.45; }
.public .meta { margin-bottom: 4px; }
.carte.action { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.carte.action .action-texte { min-width: 0; flex: 1 1 auto; }
.carte.action .icone-chevron { color: var(--turquoise-sombre); width: 22px; height: 22px; }
.public .lieu { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; color: var(--ink-doux); }
.public .ressource { display: flex; align-items: center; gap: 8px; }
.ligne-doc > a:first-child { display: flex; align-items: center; gap: 10px; }
.ligne-doc > a:first-child .icone { color: var(--turquoise-sombre); }
.frise .puce .icone { width: 16px; height: 16px; }
.langues a { transition: background 150ms ease, color 150ms ease, transform 160ms var(--sortie); }
.langues a:active { transform: scale(0.96); }
.pas-a-pas .barre span { transition-duration: 220ms; }
@keyframes question-entree { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.pas-a-pas.actif .question.visible { animation: question-entree 180ms var(--sortie); }
@media (prefers-reduced-motion: reduce) { .pas-a-pas.actif .question.visible { animation: none; } }
form[data-une-fois].envoye button[type="submit"] { opacity: 0.6; pointer-events: none; }
/* texte jamais sous 14 px sur téléphone (PRODUCT.md) */
@media (max-width: 719px) {
  label, .tableau th, .surtitre, .etat, .legende, .ref, .preuve, .journal .quand, .pied, .champ .aide, .pas-a-pas .compteur, .lien-brut,
  .frise .nom small, .logo small, .connexion-eyebrow, .fournisseur small, .connexion-separateur, .connexion-pied, .ecouter, .langues a,
  small, .meta, .carte .detail { font-size: 0.875rem; }
  .frise .nom { font-size: 0.875rem; }
  .etat { padding: 4px 10px; }
}
@media (max-width: 719px) { .public .langues a, .public .frise .nom, .public .frise .nom small, .public .ecouter, .public .pas-a-pas .compteur { font-size: 0.875rem; } }