/* Fransou · Mails v2 (18/10/2026) · d'après la maquette validée (_refonte-applis-17oct/mails/v2.css), dosage de la Banque :
   fond Encre, nuances d'Encre pour les cartes, une seule carte mise en avant, la casquette SOIE à la même place sur chaque page.
   Tout est sous .ml2 : rien ne touche aux autres pages. Rien sous 12 px, cibles de 44 px, un seul bouton plein par écran.
   Jetons à deux valeurs : sombre par défaut, clair au choix (data-ml-mode="clair"), contrastes mesurés dans chacun.
   Palette de données, pour les graphiques seulement : Brume, Sauge, Sable, Terre, Gris (contraste mesuré sur Encre et sur Blanc).
   Les polices sont celles que Devis et factures v2 sert déjà (/factures-v2/fonts/). */
@font-face{font-family:'Fransou Texte';src:url('/factures-v2/fonts/FransouTexte-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Fransou Texte';src:url('/factures-v2/fonts/FransouTexte-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Fransou Texte';src:url('/factures-v2/fonts/FransouTexte-Semibold.woff2') format('woff2');font-weight:600;font-display:swap}
.ml2{
  --coque:#0C181C; --page:#162125; --carte:#1D282C; --carte-n:#1A2428; --actif:#273135; --filet:#2E383C; --contour:#536066;
  --texte:#FFFFFF; --sec:#B9BFC1; --plein-fond:#FFFFFF; --plein-texte:#0C181C;
  --avant:#F3F4F3; --avant-texte:#0C181C; --avant-sec:#536066; --avant-filet:#D7DDDE; --avant-contour:#AAB5B8;
  --nuit:#0B121B; --nuit-sec:#A9B6C8;
  --d1:#7FB3C8; --d2:#9CC59A; --d3:#D8B47A; --d4:#C99AB8; --d5:#8E9BA0;
  --alerte:#F2A7A0; --soie-op:.045;
  --police:'Fransou Texte',system-ui,sans-serif; --r-pastille:4px; --r-champ:6px; --r-bouton:8px; --r-carte:12px;
  --courbe:cubic-bezier(.23,1,.32,1);
  position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;z-index:1;
  background:var(--page);color:var(--texte);font:400 15px/1.55 var(--police);font-synthesis:none;font-variant-numeric:tabular-nums;-webkit-text-size-adjust:100%;text-align:left;letter-spacing:normal
}
/* Le clair : les mêmes nuances, de l'autre côté (jetons des maquettes v4 du 18/10, commun-v4/v4.css). */
.ml2[data-ml-mode="clair"]{
  --coque:#F3F4F3; --page:#FFFFFF; --carte:#F6F7F6; --carte-n:#FAFBFA; --actif:#E5E8E8; --filet:#D7DDDE; --contour:#AAB5B8;
  --texte:#0C181C; --sec:#536066; --plein-fond:#0C181C; --plein-texte:#FFFFFF;
  --avant:#0C181C; --avant-texte:#FFFFFF; --avant-sec:#B9BFC1; --avant-filet:#2E383C; --avant-contour:#536066;
  --nuit:#EBF0F6; --nuit-sec:#4A5868;
  --d1:#3F6E8C; --d2:#4E7A5A; --d3:#8A6420; --d4:#875070; --d5:#5E6B70; --alerte:#A4362D; --soie-op:.04
}
.ml2 *,.ml2 *::before,.ml2 *::after{box-sizing:border-box}
.ml2 a{color:inherit;text-decoration:none}
.ml2 button,.ml2 input,.ml2 textarea,.ml2 select{font:inherit;color:inherit;letter-spacing:normal;margin:0}
.ml2 button{cursor:pointer;background:transparent;border:0;padding:0;text-align:inherit}
.ml2 button:disabled{cursor:default;opacity:.5}
.ml2 svg{width:20px;height:20px;flex:none}
.ml2 h1,.ml2 h2,.ml2 h3,.ml2 p,.ml2 ul,.ml2 ol{margin:0}
.ml2 ul,.ml2 ol{list-style:none;padding:0}
.ml2 :focus-visible{outline:2px solid var(--texte);outline-offset:3px;border-radius:6px}
.ml2 .ml2-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ml2 .ml2-chargement{padding:28px 40px;color:var(--sec)}
body:has(.ml2) #fi-conversations{display:none}

/* La casquette : même place sur chaque page, très effacée, elle recule au défilement */
.ml2 .ml2-casquette{position:absolute;left:38%;top:-150px;width:540px;pointer-events:none;z-index:0;opacity:var(--soie-op)}
.ml2 .ml2-casquette img{display:block;width:100%;height:auto}
.ml2 .ml2-entete{position:relative;overflow:hidden}
.ml2 .ml2-entete > *:not(.ml2-casquette){position:relative;z-index:1}
.ml2[data-ml-mode="clair"] .ml2-casquette img,.ml2[data-ml-mode="clair"] .ml2-sig img,.ml2[data-ml-mode="clair"] img.ml2-soie{filter:invert(1)}
.ml2 > header,.ml2 > .ml2-espaces,.ml2 > main{position:relative;z-index:1}

/* En-tête */
.ml2 .ml2-entete{display:flex;align-items:center;justify-content:space-between;gap:24px;height:72px;padding:0 40px;background:var(--coque);border-bottom:1px solid var(--coque)}
.ml2 .ml2-gauche{display:flex;align-items:center;gap:32px;min-width:0}
.ml2 .ml2-sig{display:inline-flex;align-items:center;min-height:44px}
.ml2 .ml2-sig img{height:20px;width:auto;display:block}
.ml2 .ml2-ariane{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--sec);white-space:nowrap;min-width:0;overflow:hidden}
.ml2 .ml2-ariane a:hover{color:var(--texte)}
.ml2 .ml2-ariane b{font-weight:500;color:var(--texte);overflow:hidden;text-overflow:ellipsis}
.ml2 .ml2-ariane i{font-style:normal}
.ml2 .ml2-droite{display:flex;align-items:center;gap:10px}
.ml2 .ml2-loupe-tel{display:none}

/* Les espaces */
.ml2 .ml2-espaces{display:flex;align-items:center;gap:6px;min-height:60px;padding:0 40px;background:var(--coque);border-bottom:1px solid var(--coque)}
.ml2 .ml2-nom-app{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--sec);margin-right:10px}
.ml2 .ml2-espaces nav{display:flex;align-items:stretch;gap:2px;align-self:stretch}
.ml2 .ml2-espaces nav a{display:inline-flex;align-items:center;gap:9px;padding:0 12px;color:var(--sec);font-weight:500;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;transition:color 160ms var(--courbe)}
.ml2 .ml2-espaces nav a svg{width:18px;height:18px}
.ml2 .ml2-espaces nav a:hover{color:var(--texte)}
.ml2 .ml2-espaces nav a.ml2-actif{color:var(--texte);border-bottom-color:var(--texte)}
.ml2 .ml2-n{min-width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;padding:0 6px;border:1px solid var(--contour);border-radius:11px;font-size:12px;font-weight:600;color:var(--texte)}
.ml2 .ml2-outils-h{margin-left:auto;display:flex;align-items:center;gap:10px}
.ml2 .ml2-cherche-h{display:flex;align-items:center;gap:10px;width:260px;min-height:40px;padding:0 12px;border:1px solid var(--contour);border-radius:var(--r-champ);color:var(--sec);font-size:14px}
.ml2 .ml2-cherche-h input{flex:1;min-width:0;border:0;background:none;outline:none;font-size:14px;color:var(--texte)}
.ml2 .ml2-cherche-h svg{width:16px;height:16px}
.ml2 .ml2-cherche-h:focus-within{border-color:var(--texte)}
.ml2 .ml2-barre-tel{display:none}

/* Boutons, liens, champs */
.ml2 .ml2-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 18px;border-radius:var(--r-bouton);border:1px solid var(--contour);color:var(--texte);font:500 15px/1.2 var(--police);white-space:nowrap;transition:background-color 160ms var(--courbe),border-color 160ms var(--courbe),transform 120ms var(--courbe)}
.ml2 .ml2-btn:hover:not(:disabled){border-color:var(--texte);background:var(--carte-n)}
.ml2 .ml2-btn:active:not(:disabled){transform:scale(.97)}
.ml2 .ml2-btn.ml2-plein{background:var(--plein-fond);border-color:var(--plein-fond);color:var(--plein-texte);font-weight:600;min-height:48px;padding:12px 22px}
.ml2 .ml2-btn.ml2-plein:hover:not(:disabled){background:var(--plein-fond);opacity:.92}
.ml2 .ml2-btn.ml2-petit{font-size:14px;padding:8px 14px;min-height:40px}
.ml2 .ml2-btn.ml2-nu{border-color:transparent}
.ml2 .ml2-btn.ml2-nu:hover:not(:disabled){border-color:var(--contour)}
.ml2 .ml2-btn[aria-pressed="true"]{border-color:var(--texte);background:var(--actif)}
.ml2 .ml2-btn.ml2-off{opacity:.5;pointer-events:none}
.ml2 .ml2-btn svg{width:18px;height:18px}
.ml2 .ml2-lien{display:inline-flex;align-items:center;gap:6px;min-height:36px;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px;font-weight:500}
.ml2 .ml2-lien svg{width:16px;height:16px}
.ml2 .ml2-icone{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--contour);border-radius:var(--r-bouton);flex:none;transition:background-color 160ms var(--courbe),border-color 160ms var(--courbe),transform 120ms var(--courbe)}
.ml2 .ml2-icone:hover:not(:disabled){border-color:var(--texte);background:var(--carte-n)}
.ml2 .ml2-icone:active:not(:disabled){transform:scale(.94)}
.ml2 .ml2-icone[aria-expanded="true"]{border-color:var(--texte);background:var(--actif)}
.ml2 .ml2-icone svg{width:18px;height:18px}
.ml2 kbd{font:500 12px/1 var(--police);border:1px solid var(--contour);border-radius:var(--r-pastille);padding:3px 6px;color:var(--sec)}
.ml2 .ml2-choix{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 6px 0 12px;border:1px solid var(--contour);border-radius:var(--r-bouton);font-size:14px;white-space:nowrap}
.ml2 .ml2-choix span{color:var(--sec)}
.ml2 .ml2-choix select{border:0;background:transparent;font-weight:500;min-height:36px;max-width:240px}
.ml2 select option{background:var(--page);color:var(--texte)}
.ml2 .ml2-champ{display:flex;flex-direction:column;gap:6px;min-width:0}
.ml2 .ml2-champ > span{font-size:13px;color:var(--sec)}
.ml2 .ml2-champ input,.ml2 .ml2-champ select,.ml2 .ml2-champ textarea,.ml2 .ml2-ecrire textarea,.ml2 .ml2-quoi input{width:100%;min-height:44px;padding:10px 12px;border:1px solid var(--contour);border-radius:var(--r-champ);background:var(--carte-n);color:var(--texte);font-size:15px;outline:none}
.ml2 .ml2-champ input:focus,.ml2 .ml2-champ select:focus,.ml2 textarea:focus,.ml2 .ml2-quoi input:focus{border-color:var(--texte)}
.ml2 textarea{resize:vertical;line-height:1.55}
.ml2 input[type=datetime-local]{color-scheme:dark}
.ml2[data-ml-mode="clair"] input[type=datetime-local]{color-scheme:light}
.ml2 .ml2-bascule{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px solid var(--filet);cursor:pointer}
.ml2 .ml2-bascule input{width:20px;height:20px;margin-top:3px;accent-color:var(--texte);flex:none}
.ml2 .ml2-bascule b{display:block;font-weight:600}

/* Page */
.ml2 .ml2-page{max-width:1280px;margin:0 auto;padding:32px 40px 96px;animation:ml2-arrive .18s var(--courbe)}
@keyframes ml2-arrive{from{opacity:.5;transform:translateY(4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.ml2 .ml2-page{animation:none}.ml2 *{transition:none!important}}
.ml2 .ml2-surtitre{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--sec);margin-bottom:10px;overflow-wrap:anywhere}
.ml2 .ml2-tete{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:28px}
.ml2 .ml2-texte{min-width:0}
.ml2 .ml2-tete-act{display:flex;flex-direction:column;align-items:flex-end;gap:8px;flex:none}
.ml2 h1{font-size:34px;line-height:1.15;font-weight:600;letter-spacing:-.015em;overflow-wrap:anywhere}
.ml2 .ml2-sous{font-size:17px;color:var(--sec);margin-top:10px;max-width:760px}
.ml2 .ml2-note{font-size:13px;line-height:1.5;color:var(--sec)}
.ml2 .ml2-pied{margin-top:28px}
.ml2 .ml2-attention{color:var(--texte)}
.ml2 h2{font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--sec)}
.ml2 h2 b{color:var(--texte);margin-left:6px}
.ml2 h3{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:600;line-height:1.35;margin-bottom:12px}
.ml2 h3 svg{width:18px;height:18px}
.ml2 .ml2-gros{font-size:30px;line-height:1.1;font-weight:500;letter-spacing:-.015em;white-space:nowrap}
.ml2 .ml2-sous-onglets{display:flex;gap:26px;border-bottom:1px solid var(--filet);margin:-6px 0 26px;overflow-x:auto;scrollbar-width:none}
.ml2 .ml2-sous-onglets a{display:inline-flex;align-items:center;gap:8px;min-height:46px;color:var(--sec);font-weight:500;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.ml2 .ml2-sous-onglets a b{font-weight:600;font-size:13px}
.ml2 .ml2-sous-onglets a.ml2-actif{color:var(--texte);border-bottom-color:var(--texte)}
.ml2 .ml2-carte{background:var(--carte);border:1px solid var(--carte);border-radius:var(--r-carte);padding:24px;min-width:0;display:flex;flex-direction:column;gap:10px}
.ml2 .ml2-avant{background:var(--avant);color:var(--avant-texte);border-color:var(--avant);--texte:var(--avant-texte);--sec:var(--avant-sec);--filet:var(--avant-filet);--contour:var(--avant-contour);--plein-fond:var(--avant-texte);--plein-texte:var(--avant);--carte-n:transparent;--actif:transparent}
.ml2 .ml2-avant select option{background:var(--avant);color:var(--avant-texte)}
.ml2 .ml2-deux{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:start;margin-bottom:28px}
.ml2 .ml2-colonne{display:flex;flex-direction:column;gap:16px;min-width:0}
.ml2 .ml2-grille2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-bottom:28px}
.ml2 .ml2-grille3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:12px}
.ml2 .ml2-carte > .ml2-btn,.ml2 .ml2-carte > .ml2-lien,.ml2 .ml2-carte > a.ml2-btn{align-self:flex-start}
.ml2 .ml2-kv{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:9px 0;border-bottom:1px solid var(--filet);font-size:15px}
.ml2 .ml2-kv:last-child{border-bottom:0}
.ml2 .ml2-kv > span:first-child{color:var(--sec)}
.ml2 .ml2-kv > *:last-child{text-align:right}
.ml2 .ml2-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ml2 .ml2-pas{display:inline-flex;align-items:center;gap:6px;min-height:22px;padding:0 7px;border:1px solid var(--contour);border-radius:var(--r-pastille);font-size:12px;font-weight:500;white-space:nowrap;color:var(--texte)}
.ml2 .ml2-pas.ml2-fort{border-color:var(--texte);font-weight:600}
.ml2 .ml2-etat{display:inline-flex;align-items:center;gap:6px;min-height:26px;padding:0 9px 0 7px;border:1px solid var(--contour);border-radius:var(--r-pastille);font-size:13px;font-weight:500;white-space:nowrap}
.ml2 .ml2-etat svg{width:14px;height:14px}
.ml2 .ml2-etat.ml2-fort{border-color:var(--texte);font-weight:600}
.ml2 .ml2-etat.ml2-calme{color:var(--sec)}
.ml2 .ml2-av{width:36px;height:36px;border-radius:50%;border:1px solid var(--contour);display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;flex:none}
.ml2 .ml2-av svg{width:16px;height:16px}
.ml2 .ml2-texte{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.6}
.ml2 .ml2-extrait{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;white-space:pre-line;color:var(--sec)}
.ml2 .ml2-vide{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:40px 24px;border:1px dashed var(--contour);border-radius:var(--r-carte);margin:16px 0}
.ml2 .ml2-vide b{font-size:20px;font-weight:600}
.ml2 .ml2-squelette{display:flex;flex-direction:column;gap:12px;margin:12px 0}
.ml2 .ml2-squelette i{display:block;height:64px;border-radius:var(--r-carte);background:var(--carte);animation:ml2-pulse 1.2s ease-in-out infinite alternate}
@keyframes ml2-pulse{from{opacity:.55}to{opacity:1}}
.ml2 .ml2-erreur{display:flex;align-items:center;gap:16px;padding:16px 18px;border:1px solid var(--alerte);border-radius:var(--r-carte);margin:0 0 20px}
.ml2 .ml2-erreur > div{flex:1;min-width:0}
.ml2 .ml2-erreur b{display:block}
.ml2 .ml2-bandeau{display:flex;align-items:center;gap:12px;padding:12px 16px;border:1px solid var(--contour);border-radius:var(--r-carte);margin:0 0 20px;font-size:14px}
.ml2 .ml2-bandeau > span{flex:1;min-width:0}
.ml2 .ml2-annonce{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:52px;padding:6px 10px 6px 14px;border:1px dashed var(--sec);border-radius:var(--r-champ);margin:8px 0 16px;font-size:14px;animation:ml2-arrive .2s var(--courbe)}
.ml2 .ml2-annonce > span{display:flex;align-items:center;gap:10px;min-width:0}
.ml2 .ml2-annonce svg{width:16px;height:16px}
.ml2 .ml2-annonce-erreur{border-color:var(--alerte)}
.ml2 .ml2-confirmer{display:flex;flex-direction:column;gap:10px;padding:18px;border:1px solid var(--alerte);border-radius:var(--r-carte);margin:0 0 18px}

/* Barre d'actions */
.ml2 .ml2-barre{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 18px}
.ml2 .ml2-barre-espace{flex:1}
.ml2 .ml2-filtre-t{display:flex;align-items:center;gap:8px;min-height:40px;padding:0 10px;border:1px solid var(--contour);border-radius:var(--r-champ);color:var(--sec);min-width:240px}
.ml2 .ml2-filtre-t input{flex:1;min-width:0;border:0;background:none;outline:none;font-size:14px;color:var(--texte)}
.ml2 .ml2-filtre-t svg{width:16px;height:16px}
.ml2 .ml2-selection{display:inline-flex;align-items:center;gap:8px;padding:4px 6px 4px 12px;border:1px solid var(--texte);border-radius:var(--r-bouton);font-size:14px}

/* Répartition et catégories */
.ml2 .ml2-repartition{margin:4px 0 22px}
.ml2 .ml2-rep-tete{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:10px;font-size:13px;color:var(--sec);flex-wrap:wrap}
.ml2 .ml2-rep-tete b{color:var(--texte);font-weight:600}
.ml2 .ml2-legende{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;color:var(--sec)}
.ml2 .ml2-legende span{display:inline-flex;align-items:center;gap:7px}
.ml2 .ml2-legende i{display:inline-block;width:12px;height:12px;border-radius:3px}
.ml2 .ml2-rep-barre{display:flex;gap:3px;height:12px}
.ml2 .ml2-rep-barre a{border-radius:3px;min-width:6px;transition:opacity 160ms}
.ml2 .ml2-rep-barre a:hover{opacity:.8}
.ml2 .ml2-cats{display:flex;gap:4px;border-bottom:1px solid var(--filet);margin:0 0 18px;overflow-x:auto;scrollbar-width:none}
.ml2 .ml2-cats a{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 12px;color:var(--sec);font-weight:500;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.ml2 .ml2-cats a b{font-size:13px;font-weight:600;color:var(--texte)}
.ml2 .ml2-cats a.ml2-actif{color:var(--texte);border-bottom-color:var(--texte)}
.ml2 .ml2-cats a.ml2-survol{outline:1px dashed var(--texte);outline-offset:-4px;border-radius:6px}

/* Listes et lignes */
.ml2 .ml2-section{margin:0 0 28px}
.ml2 .ml2-section > header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:0 4px 10px;border-bottom:1px solid var(--filet)}
.ml2 .ml2-liste{display:flex;flex-direction:column}
.ml2 .ml2-ligne{position:relative;display:grid;grid-template-columns:28px 36px minmax(150px,200px) minmax(0,1fr) minmax(0,230px) auto 64px auto;align-items:center;gap:14px;min-height:72px;padding:10px 8px;border-bottom:1px solid var(--filet);transition:background-color 160ms var(--courbe)}
.ml2 .ml2-ligne:hover{background:var(--carte-n)}
.ml2 .ml2-ligne.ml2-forte{border:1px solid var(--texte);border-radius:var(--r-carte);margin:6px 0}
/* La voix de Fransou : bleu nuit, partout où il parle (conseils, constats, résumé). */
.ml2 .ml2-voix{background:var(--nuit);border-color:var(--nuit);--sec:var(--nuit-sec)}
.ml2 .ml2-ligne.ml2-nonlu .ml2-qui b,.ml2 .ml2-ligne.ml2-nonlu .ml2-quoi b{font-weight:600}
.ml2 .ml2-ligne.ml2-eteinte{opacity:.65}
.ml2 .ml2-coche{display:inline-flex;align-items:center;justify-content:center;width:28px;height:44px;cursor:pointer}
.ml2 .ml2-coche input{width:16px;height:16px;accent-color:var(--texte)}
.ml2 .ml2-qui{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0}
.ml2 .ml2-qui b{font-weight:500;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ml2 .ml2-quoi{display:flex;flex-direction:column;gap:2px;min-width:0}
.ml2 .ml2-quoi b{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ml2 .ml2-quoi span{font-size:13px;color:var(--sec);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ml2 .ml2-info{font-size:14px;color:var(--sec);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.ml2 .ml2-marques{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.ml2 .ml2-heure{font-size:14px;font-weight:600;text-align:right;white-space:nowrap}
.ml2 .ml2-gestes{display:flex;gap:6px;align-items:center;justify-content:flex-end}
.ml2 .ml2-gestes .ml2-icone{width:40px;height:40px}
.ml2 .ml2-ligne-b,.ml2 .ml2-ligne-p{grid-template-columns:28px 36px minmax(150px,220px) minmax(0,1fr) minmax(0,260px) auto 64px auto}
.ml2 .ml2-ligne-p{grid-template-columns:36px minmax(150px,220px) minmax(0,1fr) auto auto auto}
.ml2 .ml2-ligne-p .ml2-heure{min-width:60px}
.ml2 .ml2-ligne-s{grid-template-columns:36px minmax(150px,220px) minmax(0,1fr) minmax(0,240px) auto}
.ml2 .ml2-ligne-r{grid-template-columns:28px minmax(0,1fr) minmax(0,200px) auto}
.ml2 .ml2-ligne-l{grid-template-columns:28px minmax(0,1fr) auto}
.ml2 .ml2-ligne-j{grid-template-columns:120px minmax(0,1fr) 72px auto}
.ml2 .ml2-ligne-c{grid-template-columns:36px minmax(160px,240px) minmax(0,1fr) auto auto}
.ml2 .ml2-ligne-l .ml2-quoi{flex-direction:row;align-items:center;gap:10px}
.ml2 .ml2-poignee{display:inline-flex;align-items:center;justify-content:center;width:28px;height:40px;color:var(--sec);cursor:grab}
.ml2 .ml2-docs{display:flex;gap:6px;flex-wrap:wrap}
.ml2 .ml2-menu{position:absolute;right:8px;top:calc(100% - 6px);z-index:5;display:flex;flex-direction:column;min-width:240px;padding:6px;background:var(--page);border:1px solid var(--contour);border-radius:var(--r-carte);box-shadow:0 12px 32px rgba(0,0,0,.28);animation:ml2-ouvre .14s var(--courbe)}
@keyframes ml2-ouvre{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.ml2 .ml2-menu .ml2-btn{justify-content:flex-start;min-height:40px;font-size:14px}
.ml2 .ml2-menu .ml2-lien{padding:0 14px}

/* Un fil */
.ml2 .ml2-outils-fil{position:relative;display:flex;align-items:center;gap:8px;margin:-6px 0 18px;flex-wrap:wrap}
.ml2 .ml2-outils-fil .ml2-menu{left:0;right:auto;top:52px}
.ml2 .ml2-retour{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-size:14px;font-weight:500;color:var(--sec);margin-right:6px}
.ml2 .ml2-pager{margin-left:auto;display:flex;align-items:center;gap:8px}
.ml2 .ml2-titre-fil{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:24px}
.ml2 .ml2-titre-fil h1{font-size:30px}
.ml2 .ml2-fil{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:start}
.ml2 .ml2-fil-corps{display:flex;flex-direction:column;gap:22px;min-width:0}
.ml2 .ml2-demandes{display:flex;flex-direction:column;gap:10px;counter-reset:d;font-size:16px}
.ml2 .ml2-demandes li{display:flex;gap:12px;align-items:flex-start;counter-increment:d}
.ml2 .ml2-demandes li::before{content:counter(d);flex:none;width:24px;height:24px;border:1px solid var(--contour);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;margin-top:1px}
.ml2 .ml2-resume-mail{display:flex;flex-direction:column;gap:6px;padding-top:12px;border-top:1px solid var(--filet)}
.ml2 .ml2-resume-mail ul{display:flex;flex-direction:column;gap:4px;list-style:disc;padding-left:20px}
.ml2 .ml2-raison{font-size:14px;color:var(--sec);border-top:1px solid var(--filet);padding-top:12px}
.ml2 .ml2-anciens{border-top:1px solid var(--filet);border-bottom:1px solid var(--filet)}
.ml2 .ml2-ancien{border-top:1px solid var(--filet)}
.ml2 .ml2-ancien:first-child{border-top:0}
.ml2 .ml2-ancien summary{cursor:pointer;list-style:none;display:grid;grid-template-columns:36px 150px minmax(0,1fr) auto;align-items:center;gap:14px;min-height:58px}
.ml2 .ml2-ancien summary::-webkit-details-marker{display:none}
.ml2 .ml2-ancien summary b{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ml2 .ml2-ancien-x{color:var(--sec);font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ml2 .ml2-ancien[open] summary .ml2-ancien-x{visibility:hidden}
.ml2 .ml2-ancien > .ml2-texte{padding:0 0 16px 50px;font-size:15px}
.ml2 .ml2-message{display:flex;gap:14px;padding:14px 0;border-top:1px solid var(--filet);min-width:0}
.ml2 .ml2-message > div{flex:1;min-width:0}
.ml2 .ml2-message .ml2-texte{margin-top:8px}
.ml2 .ml2-dernier{border-top:0;padding-top:0}
.ml2 .ml2-dernier #ml2-corps{font-size:16px;margin-top:14px}
.ml2 .ml2-piece-l{display:flex;align-items:center;gap:10px;margin-top:14px;padding:10px 12px;border:1px solid var(--contour);border-radius:var(--r-champ);font-size:14px}
.ml2 .ml2-reponse{display:flex;flex-direction:column;gap:10px}
.ml2 .ml2-consigne{display:flex;align-items:flex-end;gap:10px}
.ml2 .ml2-consigne .ml2-champ{flex:1}
.ml2 .ml2-contexte{display:flex;flex-direction:column;gap:16px;min-width:0;position:sticky;top:16px}
.ml2 .ml2-contexte h3 a{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.ml2 .ml2-libelles{display:flex;flex-wrap:wrap;gap:6px}

/* Écrire */
.ml2 .ml2-ecrire{display:flex;flex-direction:column;gap:12px;padding:20px;border:1px solid var(--contour);border-radius:var(--r-carte);background:var(--carte)}
.ml2 .ml2-champs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.ml2 .ml2-champs .ml2-large,.ml2 .ml2-large{grid-column:1/-1}
.ml2 .ml2-etats{display:flex;gap:8px;flex-wrap:wrap;font-size:13px}
.ml2 .ml2-etats li{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 10px;border:1px dashed var(--contour);border-radius:15px;color:var(--sec)}
.ml2 .ml2-etats li i{width:10px;height:10px;border:1px solid var(--contour);border-radius:50%}
.ml2 .ml2-etats li svg{width:14px;height:14px}
.ml2 .ml2-etats li b{font-weight:600;color:var(--texte)}
.ml2 .ml2-etats li.ml2-ok{border-style:solid;border-color:var(--texte)}
.ml2 .ml2-pied-ecrire{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ml2 .ml2-pied-ecrire > .ml2-note{flex:1;min-width:200px}
.ml2 .ml2-tons{display:inline-flex;gap:4px;flex-wrap:wrap}
.ml2 .ml2-lecture-seule{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border:1px solid var(--contour);border-radius:var(--r-champ);font-size:14px}
.ml2 .ml2-erreurs{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 12px;border:1px solid var(--alerte);border-radius:var(--r-champ);font-size:14px}
.ml2 .ml2-rebours{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--texte);border-radius:var(--r-champ);font-size:15px}
.ml2 .ml2-rebours > span{flex:1}
.ml2 .ml2-programmer{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;padding:12px;border:1px dashed var(--contour);border-radius:var(--r-champ)}
.ml2 .ml2-programmer .ml2-note{flex:1;min-width:200px}
.ml2 .ml2-envoye{flex-direction:row;align-items:flex-start;gap:14px}
.ml2 .ml2-envoye > div{flex:1}
.ml2 .ml2-variables{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.ml2 .ml2-apercu{display:flex;flex-direction:column;gap:6px;padding:12px;border:1px dashed var(--contour);border-radius:var(--r-champ)}
.ml2 .ml2-file{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}

/* Rangé seul, règles, conseils */
.ml2 .ml2-compte-l{display:grid;grid-template-columns:70px minmax(0,1fr) auto;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--filet)}
.ml2 .ml2-compte-l:last-child{border-bottom:0}
.ml2 .ml2-compte-l .ml2-gros{text-align:right}
.ml2 .ml2-regle-l{display:flex;flex-direction:column;gap:4px;padding:12px 0;border-bottom:1px solid var(--filet)}
.ml2 .ml2-regle-l b{display:flex;align-items:center;gap:8px}
.ml2 .ml2-regle-l svg{width:16px;height:16px}
.ml2 .ml2-conseils{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-bottom:28px}
.ml2 .ml2-parle{display:flex;gap:12px;align-items:flex-start;font-size:16px}
.ml2 img.ml2-soie{width:24px;height:auto;margin-top:6px;flex:none}
.ml2 .ml2-avant img.ml2-soie{filter:invert(1)}
.ml2 .ml2-ligne-saisie{flex-direction:row;align-items:flex-end;gap:12px;margin-bottom:20px}
.ml2 .ml2-ligne-saisie .ml2-champ{flex:1}
.ml2 .ml2-modele-tete{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ml2 .ml2-modele-tete h3{margin:0;flex:1;min-width:0}
.ml2 .ml2-modele .ml2-actions{margin-top:auto}
.ml2 .ml2-form-modele{margin-bottom:24px}
.ml2 .ml2-raccourcis{display:flex;flex-direction:column;gap:8px;font-size:14px}
.ml2 .ml2-raccourcis kbd{display:inline-block;min-width:54px;margin-right:10px;text-align:center}

/* Boîtes */
.ml2 .ml2-logo{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--contour);border-radius:var(--r-bouton);flex:none}
.ml2 .ml2-logo svg{width:18px;height:18px}
.ml2 .ml2-btn .ml2-logo{width:auto;height:auto;border:0}

/* Graphiques */
.ml2 .ml2-graph{gap:12px}
.ml2 svg.ml2-g{display:block;width:100%;height:auto}
.ml2 svg.ml2-anneau{max-width:240px;margin:0 auto}
.ml2 .ml2-g text{font-family:var(--police);font-size:13px;fill:var(--sec)}
.ml2 .ml2-g text.ml2-f{fill:var(--texte);font-weight:600}
.ml2 .ml2-g a{cursor:pointer}
.ml2 .ml2-g a:hover rect,.ml2 .ml2-g a:hover path{opacity:.82}

/* Recherche */
.ml2 .ml2-cherche-grand{display:flex;align-items:center;gap:12px;min-height:56px;padding:0 8px 0 16px;border:1px solid var(--texte);border-radius:var(--r-carte);margin-bottom:12px}
.ml2 .ml2-cherche-grand input{flex:1;min-width:0;border:0;background:none;outline:none;font-size:17px;color:var(--texte)}
.ml2 .ml2-cherche-grand > .ml2-btn{flex:none}

/* Téléphone */
@media (max-width:1100px){
  .ml2 .ml2-ligne{grid-template-columns:28px 36px minmax(0,170px) minmax(0,1fr) auto 56px auto}
  .ml2 .ml2-ligne .ml2-info{display:none}
  .ml2 .ml2-cherche-h{width:200px}
  .ml2 .ml2-fil,.ml2 .ml2-deux{grid-template-columns:minmax(0,1fr) 300px}
}
@media (max-width:760px){
  .ml2{font-size:15px}
  .ml2 .ml2-ancien summary{grid-template-columns:36px minmax(0,1fr) auto}
  .ml2 .ml2-ancien-x{display:none}
  .ml2 .ml2-entete{height:64px;padding:0 16px}
  .ml2 .ml2-ariane{display:none}
  .ml2 .ml2-loupe-tel{display:inline-flex}
  .ml2 .ml2-espaces{display:none}
  .ml2 .ml2-barre-tel{display:flex;position:sticky;bottom:0;z-index:4;justify-content:space-around;background:var(--coque);border-top:1px solid var(--filet);padding:4px 2px calc(4px + env(safe-area-inset-bottom))}
  .ml2 .ml2-barre-tel a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:52px;min-height:52px;font-size:12px;color:var(--sec)}
  .ml2 .ml2-barre-tel a.ml2-actif{color:var(--texte)}
  .ml2 .ml2-barre-tel svg{width:20px;height:20px}
  .ml2 .ml2-page{padding:20px 16px 40px}
  .ml2 .ml2-casquette{width:300px;left:30%;top:-90px}
  .ml2 .ml2-tete{flex-direction:column;align-items:stretch;gap:16px}
  .ml2 .ml2-tete-act{align-items:stretch}
  .ml2 .ml2-tete-act .ml2-btn{width:100%}
  .ml2 h1{font-size:26px}
  .ml2 .ml2-titre-fil h1{font-size:24px}
  .ml2 .ml2-sous{font-size:15px}
  .ml2 .ml2-fil,.ml2 .ml2-deux,.ml2 .ml2-grille2,.ml2 .ml2-grille3,.ml2 .ml2-conseils,.ml2 .ml2-file,.ml2 .ml2-champs{grid-template-columns:minmax(0,1fr)}
  .ml2 .ml2-contexte{position:static}
  .ml2 .ml2-ligne,.ml2 .ml2-ligne-b,.ml2 .ml2-ligne-p,.ml2 .ml2-ligne-s,.ml2 .ml2-ligne-c{grid-template-columns:36px minmax(0,1fr) auto;grid-auto-rows:auto;gap:6px 12px;padding:12px 4px}
  .ml2 .ml2-ligne .ml2-coche{display:none}
  .ml2 .ml2-ligne .ml2-av{grid-row:1/span 2}
  .ml2 .ml2-ligne .ml2-qui{grid-column:2;flex-direction:row;align-items:center;gap:8px}
  .ml2 .ml2-ligne .ml2-heure{grid-column:3;grid-row:1}
  .ml2 .ml2-ligne .ml2-quoi{grid-column:2/4}
  .ml2 .ml2-ligne .ml2-info{display:none}
  .ml2 .ml2-ligne .ml2-marques{grid-column:2/4;justify-content:flex-start}
  .ml2 .ml2-ligne .ml2-marques:empty{display:none}
  .ml2 .ml2-ligne .ml2-gestes{grid-column:2/4;justify-content:flex-start;flex-wrap:wrap}
  .ml2 .ml2-ligne .ml2-docs{grid-column:2/4}
  .ml2 .ml2-ligne-p > .ml2-choix,.ml2 .ml2-ligne-p > label.ml2-choix{grid-column:2/4}
  .ml2 .ml2-ligne-r,.ml2 .ml2-ligne-l,.ml2 .ml2-ligne-j{grid-template-columns:minmax(0,1fr) auto;gap:8px}
  .ml2 .ml2-ligne-r .ml2-coche,.ml2 .ml2-ligne-l .ml2-poignee{display:none}
  .ml2 .ml2-ligne-r .ml2-quoi,.ml2 .ml2-ligne-j .ml2-quoi{grid-column:1/-1}
  .ml2 .ml2-ligne-r .ml2-info{display:none}
  .ml2 .ml2-ligne-r .ml2-gestes,.ml2 .ml2-ligne-j .ml2-gestes{grid-column:1/-1;justify-content:flex-start}
  .ml2 .ml2-ligne-j .ml2-pas{justify-self:start}
  .ml2 .ml2-menu{left:4px;right:4px;min-width:0}
  .ml2 .ml2-filtre-t{min-width:0;flex:1 1 100%}
  .ml2 .ml2-barre-espace{display:none}
  .ml2 .ml2-choix select{max-width:170px}
  .ml2 .ml2-consigne,.ml2 .ml2-ligne-saisie{flex-direction:column;align-items:stretch}
  .ml2 .ml2-pager{margin-left:0;width:100%}
  .ml2 .ml2-compte-l{grid-template-columns:52px minmax(0,1fr);gap:10px}
  .ml2 .ml2-compte-l > .ml2-lien{grid-column:2}
  .ml2 .ml2-cherche-grand input{font-size:15px}
  .ml2 .ml2-rep-tete{flex-direction:column;align-items:flex-start}
  .ml2 .ml2-sous-onglets{gap:18px}
}

/* 18/10 · tout est modifiable : édition sur place (règle, pièce, heure prévue, rappel) */
.ml2 .ml2-cache { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ml2 .ml2-editable { cursor: text; border-bottom: 1px dashed transparent; }
.ml2 .ml2-editable:hover, .ml2 .ml2-editable:focus-visible { border-bottom-color: var(--contour); outline: none; }
.ml2 .ml2-renom { display: inline-flex; gap: 6px; align-items: center; max-width: 100%; }
.ml2 .ml2-renom input { min-width: 0; width: 100%; max-width: 260px; }
.ml2 .ml2-quand input[type="datetime-local"] { max-width: 210px; min-width: 0; font: inherit; }

/* 18/10 · hors de /mails, le délai d'annulation d'un envoi reste visible et annulable (bannière posée sur le corps de la page) */
.ml2-envoi-global { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 2147483000; display: flex; align-items: center; gap: 14px; max-width: calc(100vw - 32px); padding: 12px 14px 12px 18px; border-radius: 14px; background: #0B121B; color: #F3F4F3; border: 1px solid #536066; box-shadow: 0 12px 32px rgba(0,0,0,.35); font: 500 15px/1.35 "Fransou Texte", system-ui, sans-serif; }
.ml2-envoi-global button { min-height: 40px; padding: 8px 16px; border-radius: 10px; border: 0; background: #F3F4F3; color: #0B121B; font: 600 14px/1 "Fransou Texte", system-ui, sans-serif; cursor: pointer; white-space: nowrap; }
.ml2-envoi-global button:focus-visible { outline: 2px solid #7FB3C8; outline-offset: 2px; }
