/* ---------------------------------------------------------------------------
   Lot AP1 · la base Apple (`lots/LOT-AP1-base-apple.md`), d'après les maquettes validées par Othmane le
   2026-10-29 (`lots/maquettes/apple/`, charte dans `CHARTE.md`). Une couche posée par-dessus `composants.css`,
   sans rien y changer : le gris du Mac, la police du système, le verre seulement sur ce qui flotte (listes de
   choix, fenêtres, tiroirs, menu de gauche, notifications, barre du fil, haut fixe), la lentille qui glisse, les
   boutons qui s'enfoncent, le mot qui confirme. La couleur dit un état ; les initiales sont en gris.
   --------------------------------------------------------------------------- */
:root {
  --ap-verre: rgba(255, 255, 255, .62);              /* une liste, un menu : on devine ce qui est dessous */
  --ap-verre-epais: rgba(255, 255, 255, .78);        /* une fenêtre, un tiroir : du texte à lire dessus */
  --ap-verre-flou: blur(22px) saturate(190%);
  --ap-verre-bord: inset 0 0 0 1px rgba(255, 255, 255, .75), inset 0 1px 0 rgba(255, 255, 255, .95);   /* le liseré et le reflet du haut */
  --ap-verre-ombre: 0 0 0 .5px rgba(28, 26, 22, .10), 0 2px 6px rgba(28, 26, 22, .05), 0 22px 48px -18px rgba(28, 26, 22, .30);
  /* le ressort : il dépasse à peine (3 %) et revient, comme les feuilles d'Apple */
  --lx-ressort: linear(0, .06 2.5%, .22 5.5%, .45 9.5%, .69 14%, .86 19%, .96 24%, 1.02 30%, 1.03 36%, 1.025 42%, 1.01 52%, 1 64%, .998 76%, 1);
  --lx-ressort-duree: 440ms;
  --lx-glisse: cubic-bezier(.32, .72, 0, 1);         /* sans rebond : une largeur, une hauteur */
}

/* Ce qui se replie s'ouvre et se ferme en hauteur, au lieu de sauter */
:root { interpolate-size: allow-keywords; }
details:not(.bulle):not(.menu-cloche):not(.menu-compte):not([name="flottant"])::details-content {
  height: 0; opacity: 0; overflow: clip;
  transition: height 340ms var(--lx-glisse), opacity 240ms ease, content-visibility 340ms allow-discrete;
}
details[open]:not(.bulle):not(.menu-cloche):not(.menu-compte):not([name="flottant"])::details-content { height: auto; opacity: 1; }

/* Les boutons : ils s'enfoncent sous le doigt et reviennent en ressort */
.btn, .lx-choix-bouton, .lx-pastille, .lx-coches label, .lx-segments span {
  transition: transform var(--lx-ressort-duree) var(--lx-ressort), background-color .15s, box-shadow .2s, border-color .15s, color .15s;
}
.btn:active, .lx-choix-bouton:active, .lx-pastille:active { transform: scale(.965); transition-duration: 90ms; }
.lx-coches label:active { transform: scale(.985); transition-duration: 90ms; }
.btn.btn-plein { box-shadow: 0 0 0 1px var(--mz-vert), 0 1px 2px rgba(14, 107, 90, .25), inset 0 1px 0 rgba(255, 255, 255, .28), inset 0 -1px 0 rgba(0, 0, 0, .08); }
.lx-coches label:has(input:checked) { animation: verre-pris var(--lx-ressort-duree) var(--lx-ressort); }
@keyframes verre-pris { 30% { transform: scale(.985); } }

/* Le segment choisi glisse d'une case à l'autre (`apple.js` pose le départ) */
.lx-segments input:checked + span { position: relative; isolation: isolate; background: none; box-shadow: none; }
.lx-segments input:checked + span::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 9px;
  background: var(--mz-surface); box-shadow: var(--lx-ombre-pastille), inset 0 1px 0 rgba(255, 255, 255, .9); transform-origin: 0 50%; }

/* La liste d'un choix : du verre, elle pousse depuis son bouton et rentre en fondu */
.lx-choix-liste { background: var(--ap-verre); backdrop-filter: var(--ap-verre-flou); -webkit-backdrop-filter: var(--ap-verre-flou);
  border-radius: 14px; box-shadow: var(--ap-verre-bord), var(--ap-verre-ombre); transform-origin: top center; animation: verre-pousse 380ms var(--lx-ressort); }
.lx-choix-liste[data-verre-part] { animation: verre-rentre 140ms ease forwards; pointer-events: none; }
.lx-choix-recherche { background: transparent; }
.lx-choix-opt { border-radius: 8px; transition: background-color .12s; }
.lx-choix-opt:hover, .lx-choix-opt.lx-choix-ici { background: rgba(28, 26, 22, .06); }
@keyframes verre-pousse { from { opacity: 0; transform: translateY(-4px) scale(.94); filter: blur(3px); } 40% { opacity: 1; filter: none; } }
@keyframes verre-rentre { to { opacity: 0; transform: translateY(-2px) scale(.97); } }

/* La fenêtre (Nouvelle opération, ⌘K) : la page se floute derrière, la fenêtre monte en ressort */
.lx-voile-fenetre { background: rgba(247, 247, 244, .35); backdrop-filter: blur(6px) saturate(140%); -webkit-backdrop-filter: blur(6px) saturate(140%); animation-duration: 260ms; }
.lx-palette, .lx-fenetre { border: 0; border-radius: 18px; background: var(--ap-verre-epais);
  backdrop-filter: var(--ap-verre-flou); -webkit-backdrop-filter: var(--ap-verre-flou); box-shadow: var(--ap-verre-bord), var(--ap-verre-ombre);
  animation: verre-fenetre var(--lx-ressort-duree) var(--lx-ressort); }
.lx-palette.lx-sort, .lx-fenetre.lx-sort { animation: lx-fenetre-sort 150ms ease forwards; }
.lx-fenetre > header, .lx-palette-saisie { border-bottom-color: rgba(28, 26, 22, .07); }
.lx-palette-ligne { border-radius: 9px; }
.lx-palette-ligne:hover, .lx-palette-ligne.lx-vise { background: rgba(28, 26, 22, .06); }
@keyframes verre-fenetre { from { opacity: 0; transform: translate(-50%, 18px) scale(.94); filter: blur(4px); } 35% { opacity: 1; filter: none; } }

/* Le tiroir de droite et les notifications : une feuille de verre qui glisse */
.lx-tiroir { background: var(--ap-verre-epais); backdrop-filter: var(--ap-verre-flou); -webkit-backdrop-filter: var(--ap-verre-flou);
  box-shadow: var(--ap-verre-bord), var(--ap-verre-ombre); animation: verre-tiroir 480ms var(--lx-ressort); }
.lx-tiroir > header { border-bottom-color: rgba(28, 26, 22, .07); }
.barre .menu-cloche .fenetre { background: var(--ap-verre-epais); backdrop-filter: var(--ap-verre-flou); -webkit-backdrop-filter: var(--ap-verre-flou);
  border: 0; border-radius: 18px; box-shadow: var(--ap-verre-bord), var(--ap-verre-ombre); animation: verre-tiroir 480ms var(--lx-ressort); }
.barre .menu-cloche .fenetre .tete { background: transparent; }
@keyframes verre-tiroir { from { opacity: 0; transform: translateX(48px) scale(.98); } 30% { opacity: 1; } }

/* Le menu de gauche : il s'ouvre en verre par-dessus la page, sans rebond sur la largeur */
.barre .dedans { border-right-color: rgba(28, 26, 22, .07); transition: width 320ms var(--lx-glisse), box-shadow 320ms var(--lx-glisse); }
.barre .ecrans > a, .barre .recents-menu a,
.barre .menu-cloche > summary, .barre .nouvel-acte-menu, .barre .lx-menu-chercher { transition: background-color .15s, transform var(--lx-ressort-duree) var(--lx-ressort); }
.barre .ecrans > a:active, .barre .recents-menu a:active { transform: scale(.97); }

/* Le haut fixe d'une page : ce qui défile passe dessous, flouté */
.lx-haut-fixe { background: color-mix(in srgb, var(--mz-fond) 76%, transparent); backdrop-filter: blur(18px) saturate(170%); -webkit-backdrop-filter: blur(18px) saturate(170%); }

/* La barre où l'on écrit, dans le fil : une pastille de verre ; le pied collant d'une carte aussi */
main.page .socle-fil.conv-v2 form.conv-compo { background: linear-gradient(to bottom, transparent, var(--lx-fond-fil) 70%); }
main.page .socle-fil.conv-v2 .conv-compo-in { background: var(--ap-verre-epais); backdrop-filter: var(--ap-verre-flou); -webkit-backdrop-filter: var(--ap-verre-flou);
  border-radius: 22px; box-shadow: var(--ap-verre-bord), var(--lx-ombre-barre); transition: box-shadow .25s var(--lx-glisse); }
main.page .socle-fil.conv-v2 .conv-compo-in:focus-within { box-shadow: var(--ap-verre-bord), 0 0 0 1px var(--mz-vert), 0 0 0 4px var(--mz-vert-clair), var(--lx-ombre-barre); }
main.page .socle-fil.conv-v2 form.conv-compo .conv-envoyer { transition: transform var(--lx-ressort-duree) var(--lx-ressort), background-color .2s; }
main.page .socle-fil.conv-v2 form.conv-compo .conv-envoyer:active { transform: scale(.9); transition-duration: 90ms; }
.lx-carte-pied { background: color-mix(in srgb, var(--mz-surface) 74%, transparent); backdrop-filter: blur(16px) saturate(170%); -webkit-backdrop-filter: blur(16px) saturate(170%); }

/* L'infobulle : du verre sombre */
.lx-bulle-info { background: rgba(28, 26, 22, .78); backdrop-filter: blur(14px) saturate(160%); -webkit-backdrop-filter: blur(14px) saturate(160%);
  border-radius: 10px; box-shadow: inset 0 0 0 .5px rgba(255, 255, 255, .14), 0 10px 26px -10px rgba(0, 0, 0, .4); animation: verre-pousse 300ms var(--lx-ressort); }

/* Ce qui arrive : un message du fil, une vignette entrent en ressort, nets en fin de course */
.socle-fil .conv-msg { animation: verre-arrive 520ms var(--lx-ressort) both; }
.vg-vignette { animation: verre-pousse 420ms var(--lx-ressort); transform-origin: top left; }
@keyframes verre-arrive { from { opacity: 0; transform: translateY(10px) scale(.985); filter: blur(3px); } 40% { opacity: 1; filter: none; } }

/* D'une page à l'autre : un fondu court au lieu d'un écran blanc. Pas de nom de transition sur le menu de gauche :
   il couperait son verre de la page qu'il recouvre (le flou ne verrait plus rien derrière lui). */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: 120ms ease both verre-page-sort; }
::view-transition-new(root) { animation: 260ms var(--lx-glisse) both verre-page-entre; }
@keyframes verre-page-sort { to { opacity: 0; } }
@keyframes verre-page-entre { from { opacity: 0; transform: translateY(6px); } }

/* Le changement de page (Othmane, 2026-11-01, revu le soir : « tu laisses le fond et tu mets l'animation par-dessus,
   pas une nouvelle carte à chaque changement de page ») : au clic sur un lien qui quitte la page, la page s'efface en
   fondu sur place ; le fond gris et ses halos, le menu de gauche restent ; les points qui tournent en grand paraissent
   au milieu de la place de la page, sur le fond, tant que la page suivante n'est pas là, et elle arrive en fondu
   (`view-transition` ci-dessus). Une fenêtre, un tiroir, un aperçu naissent toujours de ce qu'on a cliqué. */
.lx-nait { position: fixed; z-index: 900; display: grid; place-items: center; pointer-events: none; }
.lx-nait-milieu { opacity: 0; transition: opacity .3s; }
.lx-nait.lx-nait-ouverte .lx-nait-milieu { opacity: 1; }
html.lx-recule main.page { opacity: 0; transition: opacity .2s ease; }



/* ---------------------------------------------------------------------------
   La passe « Apple » (Othmane, 2026-10-29 : « une application style Apple, Liquid Glass, tu t'inspires de ces
   codes-là »). Ce que l'on reprend de macOS : la police du système, le gris neutre derrière les cartes, les angles
   qui s'emboîtent, le menu de côté qui flotte détaché du bord, les onglets en pastille dont la lentille glisse,
   les boutons en verre, les tiroirs posés en feuille au-dessus de la page. L'accent reste le vert de Lexia.
   --------------------------------------------------------------------------- */
:root {
  --sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", system-ui, sans-serif;
  --mz-fond: #F5F5F7;                                /* le gris des réglages du Mac */
  --lx-r-cadre: 20px; --lx-r-fenetre: 14px; --lx-r-case: 10px;
  --lx-remplissage: rgba(118, 118, 128, .12);        /* le fond d'un contrôle, comme sur le Mac */
  --lx-ombre: 0 0 0 .5px rgba(0, 0, 0, .05), 0 1px 3px rgba(0, 0, 0, .04), 0 8px 24px -12px rgba(0, 0, 0, .08);
}
body { font-family: var(--sans); -webkit-font-smoothing: antialiased; }
.lx-titre, main.page .chapeau h1 { font-weight: 700; letter-spacing: -.022em; }
.lx-cadre { border: 0; }

/* Le menu de côté : une colonne de verre détachée des bords, qui s'élargit par-dessus la page */
.barre { width: 76px; flex-basis: 76px; }
.barre .dedans { left: 10px; top: 10px; bottom: 10px; width: 56px; padding: 10px 8px; border: 0; border-radius: 22px;
  background: none; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .7), inset 0 1px 0 #fff, 0 0 0 .5px rgba(0, 0, 0, .08), 0 8px 28px -10px rgba(0, 0, 0, .16); }
.barre:hover .dedans, .barre:has(:focus-visible) .dedans, .barre:has(details[open]) .dedans {
  width: 236px; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .7), inset 0 1px 0 #fff, 0 0 0 .5px rgba(0, 0, 0, .08), 0 24px 60px -16px rgba(0, 0, 0, .26); }
/* le verre est un calque sous le menu, pas le menu lui-même : posé sur le menu, il enfermerait le panneau des
   notifications, qui est dedans, dans ses 56 pixels de large */
.barre .dedans::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
  background: rgba(250, 250, 252, .64); backdrop-filter: blur(24px) saturate(190%); -webkit-backdrop-filter: blur(24px) saturate(190%); transition: background-color 200ms; }
.barre:hover .dedans::before, .barre:has(:focus-visible) .dedans::before, .barre:has(details[open]) .dedans::before {
  background: rgba(250, 250, 252, .84); backdrop-filter: blur(30px) saturate(190%); -webkit-backdrop-filter: blur(30px) saturate(190%); }
.barre .ecrans > a, .barre .recents-menu a, .barre .menu-cloche > summary,
.barre .nouvel-acte-menu, .barre .lx-menu-chercher { border-radius: 12px; }
.barre .ecrans > a.ici, .barre .recents-menu a.ici { background: rgba(255, 255, 255, .9); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .06), 0 1px 3px rgba(0, 0, 0, .08); }

/* avec le menu large, une liste d'informations ne passe sur deux colonnes que si chacune garde 380 px : en dessous, la
   valeur se coupait mot à mot (la fiche à 1280 px) */
.lx-infos:not(.lx-infos-une) { grid-template-columns: repeat(auto-fit, minmax(max(380px, calc((100% - 28px) / 2)), 1fr)); }

/* au menu replié, un récent se reconnaît à sa lettre ; au menu large, à l'icône de la société */
.barre .recents-menu a .lx-ic { display: none; }
/* Dès qu'il y a la place, le menu de la maquette (Othmane, 2026-10-30, « tout comme la maquette ») : une colonne de verre
   large et toujours ouverte, ses noms à côté des icônes vertes, Raccourcis et Récents, le compte en bas. En dessous de
   1200 px, la colonne d'icônes qui s'élargit au survol laisse la place à la page. */
@media (min-width: 1200px) {
  body:has(> .barre) { --menu: 244px; --bord-page: max(var(--v2-marge), calc((100% - 244px - var(--v2-large)) / 2)); }
  /* un écran refait (une liste large, ou `lx-maquette`) commence 24 px après le menu et s'arrête à 28 px du bord, comme sa maquette (268
     et 1144 de large à 1440) ; les autres prendront les marges de leur maquette quand ils seront refaits */
  main.page.lx-large:not(.nue):not(.tenue):not(.etroite), main.page.lx-maquette { padding: 28px 28px 28px 24px; }
  .barre { width: 244px; flex-basis: 244px; }
  .barre .dedans, .barre:hover .dedans, .barre:has(:focus-visible) .dedans, .barre:has(details[open]) .dedans {
    left: 12px; top: 12px; bottom: 12px; width: 232px; padding: 14px 10px; gap: 2px; border-radius: 26px; transition: none;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .7), inset 0 1px 0 #fff, 0 0 0 .5px rgba(0, 0, 0, .08), 0 2px 6px rgba(0, 0, 0, .04), 0 16px 40px -14px rgba(0, 0, 0, .22); }
  .barre .dedans::before, .barre:hover .dedans::before, .barre:has(:focus-visible) .dedans::before, .barre:has(details[open]) .dedans::before {
    background: rgba(255, 255, 255, .6); backdrop-filter: blur(26px) saturate(190%); -webkit-backdrop-filter: blur(26px) saturate(190%); }
  .barre .mot, .barre:hover .mot { opacity: 1; transition: none; }
  /* la marque : le carré vert de 30 px, Lexia, le cabinet */
  .barre .marque { gap: 10px; padding: 2px 8px 14px; }
  .barre .marque .lettre { width: 30px; height: 30px; }
  .barre .marque .nom-marque { font-size: 14px; }
  .barre .marque .cabinet { font-size: 11.5px; color: #6e6e73; }
  /* « Chercher ⌘K » : une case grise */
  .barre .lx-menu-chercher, .barre:hover .lx-menu-chercher, .barre:has(:focus-visible) .lx-menu-chercher {
    width: auto; height: 32px; margin: 0 2px 10px; padding: 0 10px; gap: 8px; border: 0; border-radius: 10px; background: rgba(120, 120, 128, .12); color: #8e8e93; font-size: 13.5px; }
  .barre .lx-menu-chercher .lx-ic { color: #8e8e93; }
  .barre .lx-menu-chercher kbd { border: 0; background: none; padding: 0; font-size: 11px; font-weight: 500; color: #8e8e93; }
  /* chaque ligne : 32 px, l'icône verte, le nom en noir */
  .barre .nouvel-acte-menu, .barre .ecrans > a, .barre .menu-cloche > summary, .barre .recents-menu a {
    height: 32px; margin: 0; padding: 0 10px; gap: 10px; border-radius: 10px; background: none; box-shadow: none; color: #1d1d1f; font-size: 13.5px; font-weight: 400;
    transition: background-color .15s, transform .4s var(--lx-ressort); }
  .barre .nouvel-acte-menu .lx-ic, .barre .ecrans > a .lx-ic, .barre .menu-cloche > summary .lx-ic, .barre .recents-menu a .lx-ic { width: 17px; height: 17px; color: #0f7b65; }
  .barre .nouvel-acte-menu:hover, .barre .ecrans > a:hover, .barre .menu-cloche > summary:hover, .barre .menu-cloche[open] > summary, .barre .recents-menu a:hover {
    background: rgba(0, 0, 0, .045); color: #1d1d1f; }
  .barre .nouvel-acte-menu:active, .barre .ecrans > a:active, .barre .recents-menu a:active { transform: scale(.97); }
  .barre .ecrans > a.ici, .barre .recents-menu a.ici { background: rgba(255, 255, 255, .92); font-weight: 500;
    box-shadow: 0 0 0 .5px rgba(0, 0, 0, .05), 0 1px 3px rgba(0, 0, 0, .08); }
  .barre .assistant-rail[aria-expanded="true"] { background: rgba(255, 255, 255, .92); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .05), 0 1px 3px rgba(0, 0, 0, .08); }
  /* les titres : Raccourcis, Récents */
  .barre .lx-menu-titre { margin: 12px 10px 4px; padding: 0; font-size: 11px; font-weight: 600; color: #8e8e93; }
  /* le nombre des notifications : la pastille rouge au bout de la ligne */
  .barre .cloche-compte { position: static; margin-left: auto; min-width: 20px; height: 18px; padding: 0 6px; border-radius: 9px; background: #e5372c; color: #fff;
    font-size: 11px; font-weight: 600; line-height: 18px; box-shadow: none; }
  /* les récents : l'icône de la société, comme les autres lignes */
  .barre .recents-menu .ini { display: none; }
  .barre .recents-menu a .lx-ic { display: block; }
  /* le compte en bas, sous un trait fin */
  .barre .a-droite { padding-top: 0; border-top: 0; }
  .barre .menu-compte { margin-top: 8px; padding-top: 10px; border-top: .5px solid rgba(60, 60, 67, .12); }
  .barre .menu-compte > summary { height: auto; padding: 0 8px 2px; gap: 10px; }
  .barre .menu-compte .initiales { width: 30px; height: 30px; font-size: 12px; }
  .barre .menu-compte .nom { font-size: 13px; font-weight: 400; line-height: 1.25; color: #1d1d1f; }
  /* les notifications : la bulle de verre des maquettes, posée sous leur ligne du menu (`apple.js`) */
  .barre .menu-cloche .fenetre { right: auto; bottom: auto; width: 340px; max-height: min(520px, calc(100vh - 24px)); padding: 6px;
    background: rgba(255, 255, 255, .6); backdrop-filter: blur(30px) saturate(200%); -webkit-backdrop-filter: blur(30px) saturate(200%);
    transform-origin: top center; animation: verre-pousse 420ms var(--lx-ressort); }
  .barre .menu-cloche .fenetre .tete { position: static; padding: 6px 10px 4px; }
  .barre .menu-cloche .fenetre .tete h2 { font-size: 12px; font-weight: 600; color: #8e8e93; }
  .barre .menu-cloche .fenetre .combien { font-size: 12px; color: #8e8e93; }
  .barre .menu-cloche .notif { padding: 8px 10px; border-top: 0; border-radius: 10px; color: #1d1d1f; transition: background-color .12s; }
  .barre .menu-cloche .notif:hover { background: #0f7b65; color: #fff; }
  .barre .menu-cloche .notif:hover .fait, .barre .menu-cloche .notif:hover .ou { color: #fff; }
  .barre .menu-cloche .notif:hover .pastille-nature { background: #fff; }
  .barre .menu-cloche .notif .ou { opacity: .7; }
  .barre .menu-cloche .pied { position: static; margin-top: 5px; padding: 6px 4px 2px 10px; border-top: .5px solid rgba(60, 60, 67, .12); background: transparent; }
  .barre .menu-cloche .pied .btn { padding: 0 8px; white-space: nowrap; }
}

/* Les onglets d'une page : une pastille de verre, la vue choisie est une lentille blanche qui glisse (`apple.js`) */
.lx-onglets:not(.lx-sous-menu) { display: inline-flex; align-self: flex-start; width: fit-content; max-width: 100%; gap: 2px; padding: 3px;
  border: 0; border-radius: 999px; background: var(--lx-remplissage); }
.lx-onglets:not(.lx-sous-menu) > a, .lx-onglets:not(.lx-sous-menu) > button { position: relative; isolation: isolate; margin: 0; padding: 6px 16px;
  border: 0; border-radius: 999px; color: var(--mz-encre-douce); font-weight: 500; transition: color .2s; }
.lx-onglets:not(.lx-sous-menu) > a:hover, .lx-onglets:not(.lx-sous-menu) > button:hover { color: var(--mz-encre); text-decoration: none; }
.lx-onglets > [aria-current], .lx-onglets > [aria-selected="true"] { color: var(--mz-encre); }
.lx-onglets:not(.lx-sous-menu) > :is([aria-current], [aria-selected="true"])::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit;
  background: #fff; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .04), 0 1px 1px rgba(0, 0, 0, .04), 0 3px 8px rgba(0, 0, 0, .10), inset 0 1px 0 #fff; transform-origin: 0 0; }
/* le sommaire à gauche de la fiche : la même lentille, en colonne */
.lx-onglets.lx-sous-menu > a { position: relative; isolation: isolate; border-radius: 10px; }
.lx-onglets.lx-sous-menu > a:hover { background: rgba(0, 0, 0, .04); }
.lx-onglets.lx-sous-menu > [aria-current] { background: none; box-shadow: none; }
.lx-onglets.lx-sous-menu > [aria-current]::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: #fff;
  box-shadow: 0 0 0 .5px rgba(0, 0, 0, .05), 0 1px 3px rgba(0, 0, 0, .08); transform-origin: 0 0; }
.verre-glisse::before { animation: verre-lentille 480ms var(--lx-ressort); }
@keyframes verre-lentille { from { transform: translate(var(--verre-dx, 0), var(--verre-dy, 0)) scale(var(--verre-sx, 1), var(--verre-sy, 1)); } }
.lx-segments { background: var(--lx-remplissage); border-radius: 999px; }
.lx-segments span, .lx-segments input:checked + span::before { border-radius: 999px; }

/* Les boutons : en verre clair ; le bouton principal en verre teinté de vert, avec son reflet */
.btn:not(.btn-plein):not(.btn-nu):not(.btn-doux):not(.btn-danger) { background: rgba(255, 255, 255, .72); backdrop-filter: blur(12px) saturate(180%); -webkit-backdrop-filter: blur(12px) saturate(180%);
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .10), inset 0 1px 0 #fff, 0 1px 2px rgba(0, 0, 0, .06), 0 4px 12px -6px rgba(0, 0, 0, .12); }
.btn:not(.btn-plein):not(.btn-nu):not(.btn-doux):not(.btn-danger):hover { background: rgba(255, 255, 255, .95); }
.btn.btn-plein { background: linear-gradient(180deg, color-mix(in srgb, var(--mz-vert-vif) 92%, #fff), var(--mz-vert) 55%, var(--mz-vert-fonce));
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .18), inset 0 1px 0 rgba(255, 255, 255, .38), inset 0 -1px 1px rgba(0, 0, 0, .12), 0 1px 2px rgba(14, 107, 90, .25), 0 6px 16px -6px rgba(14, 107, 90, .45); }
.btn.btn-plein:hover { filter: brightness(1.06) saturate(1.05); }
.btn.btn-doux { background: var(--lx-remplissage); }
.lx-pastille { border: 0; background: var(--lx-remplissage); color: var(--mz-encre); transition: background-color .15s, transform var(--lx-ressort-duree) var(--lx-ressort); }
.lx-pastille:hover { background: rgba(118, 118, 128, .2); color: var(--mz-encre); }
.lx-avis { border-radius: 14px; }

/* Les tiroirs : une feuille de verre posée au-dessus de la page, détachée des bords, la page floutée derrière */
/* derrière un tiroir, la page reste lisible : on y lit la valeur pendant qu'on la modifie dans le tiroir */
.lx-voile { background: rgba(28, 26, 22, .06); }
.lx-tiroir, .assistant { top: 10px; right: 10px; bottom: 10px; border-radius: 24px; overflow: hidden; }
.lx-tiroir > header { border-bottom: 0; padding: 18px 22px 8px; }
.lx-tiroir h3 { font-size: 19px; font-weight: 700; letter-spacing: -.015em; }
.lx-tiroir .lx-cadre, .lx-tiroir .lx-carte { background: rgba(255, 255, 255, .7); border: 0; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .05); }
.assistant { background: var(--ap-verre-epais); backdrop-filter: var(--ap-verre-flou); -webkit-backdrop-filter: var(--ap-verre-flou);
  box-shadow: var(--ap-verre-bord), var(--ap-verre-ombre); animation: verre-tiroir 480ms var(--lx-ressort) both; }

.lx-tiroir.verre-sort { animation: verre-tiroir-sort 200ms cubic-bezier(.4, 0, 1, 1) forwards; }
.lx-voile.verre-sort { animation: lx-fondu-sort 200ms ease forwards; }
@keyframes verre-tiroir-sort { to { opacity: 0; transform: translateX(40px) scale(.98); } }
.lx-fenetre-corps .lx-cadre { background: transparent; }
/* les cases à cocher : des lignes de verre clair, celle qui est prise teintée de vert */
.lx-coches label { border: 0; border-radius: 12px; background: rgba(255, 255, 255, .72); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .08), 0 1px 2px rgba(0, 0, 0, .04); }
.lx-coches label:hover { background: #fff; }
.lx-coches label:has(input:checked) { background: color-mix(in srgb, var(--mz-vert) 7%, #fff); box-shadow: 0 0 0 1px color-mix(in srgb, var(--mz-vert) 55%, transparent), 0 2px 8px -4px rgba(14, 107, 90, .3); }
/* le sommaire de la fiche : la section où l'on est porte une lentille blanche, qui glisse de l'une à l'autre */
.fs-sommaire { background: var(--lx-remplissage); box-shadow: none; }
.fs-sommaire a { position: relative; isolation: isolate; border-radius: 12px; transition: color .2s; }
.fs-sommaire a:hover { background: rgba(0, 0, 0, .04); }
.fs-sommaire a.ici { background: none; }
.fs-sommaire a.ici::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: #fff;
  box-shadow: 0 0 0 .5px rgba(0, 0, 0, .04), 0 1px 1px rgba(0, 0, 0, .04), 0 3px 8px rgba(0, 0, 0, .10); transform-origin: 0 0; }

/* ---------------------------------------------------------------------------
   Ce que la charte ajoute (`lots/maquettes/apple/CHARTE.md`, parties 3 et 4)
   --------------------------------------------------------------------------- */
:root {
  --mz-fond: #F2F2F7;                                /* le gris du Mac, celui des maquettes validées */
  --mz-encre: #1d1d1f;                               /* les encres des maquettes : le texte, le texte secondaire */
  --mz-encre-douce: #6e6e73;
  --mz-encre-tenue: #6e6e73;
  --lx-initiales: linear-gradient(160deg, #b4b8c0, #868b95);   /* toutes les initiales : une personne, un compte */
}
/* le fond des maquettes : trois halos de couleur, menthe, bleu, pêche, que le verre laisse deviner ; ils restent
   en place quand la page défile */
body { background: radial-gradient(circle 330px at 100px 60px, rgb(155 227 207 / .5), rgb(155 227 207 / .38) 50%, transparent),
  radial-gradient(circle 300px at calc(100% - 110px) 10px, rgb(188 211 255 / .5), rgb(188 211 255 / .38) 50%, transparent),
  radial-gradient(circle 260px at calc(35% + 190px) calc(100% + 70px), rgb(255 226 184 / .35), rgb(255 226 184 / .26) 50%, transparent),
  var(--papier); background-attachment: fixed; }
/* les têtes qui restent en haut deviennent du verre : les halos passent, ce qui défile dessous se floute */
.lx-haut-fixe, .fige-plein,
main.page:not(.nue):not(.tenue):not(.etroite) > .chapeau:first-child,
main.page:not(.nue):not(.tenue):not(.etroite) > .admin-tete:first-child,
main.page:not(.nue):not(.tenue):not(.etroite) > .tdb-tete:first-child,
main.page.tenue.fiche-v2:not(:has(> .corps-fiche)) > .chapeau:first-of-type,
.admin-v2 .admin-tete, main.page.tdb:not(.tenue) .tdb-tete { background: color-mix(in srgb, var(--mz-fond) 55%, transparent);
  box-shadow: none; clip-path: none; backdrop-filter: blur(18px) saturate(170%); -webkit-backdrop-filter: blur(18px) saturate(170%); }

/* les initiales en gris neutre : la couleur dit un état, rien d'autre */
.lx-avatar { background: var(--lx-initiales); color: #fff; }
.lx-tete-marque.fs-marque { background: var(--lx-initiales); color: #fff; }   /* le carré d'une société, sur sa fiche */
.barre .menu-compte .initiales { background: var(--lx-initiales); }

/* les menus « … » et le menu du compte : une bulle de verre qui sort de son bouton */
details.menu-plus > .menu-plus-liste, .barre .menu-compte .tiroir { border: 0; border-radius: 16px; background: var(--ap-verre);
  backdrop-filter: var(--ap-verre-flou); -webkit-backdrop-filter: var(--ap-verre-flou); box-shadow: var(--ap-verre-bord), var(--ap-verre-ombre); }
details.menu-plus[open] > .menu-plus-liste { transform-origin: top right; animation: verre-pousse 420ms var(--lx-ressort); }
.barre .menu-compte[open] .tiroir { transform-origin: bottom left; animation: verre-pousse 420ms var(--lx-ressort); }
/* chaque choix, comme la bulle des maquettes : une ligne, l'icône en gris, le survol en vert plein */
details.menu-plus > .menu-plus-liste { min-width: 220px; padding: 6px; border-radius: 18px; }
details.menu-plus > .menu-plus-liste > :is(a, button), details.menu-plus > .menu-plus-liste form button, .barre .menu-compte .tiroir > a {
  display: flex; align-items: center; gap: 10px; min-height: 34px; padding: 0 10px; border-radius: 10px; font-size: 13.5px;
  color: #1d1d1f; white-space: nowrap; text-decoration: none; transition: background-color .12s; }
details.menu-plus > .menu-plus-liste > :is(a, button) .lx-ic, .barre .menu-compte .tiroir > a .lx-ic { width: 17px; height: 17px; color: #6e6e73; }
details.menu-plus > .menu-plus-liste > :is(a, button):hover, .barre .menu-compte .tiroir > a:hover { background: var(--mz-vert); color: #fff; text-decoration: none; }
details.menu-plus > .menu-plus-liste > :is(a, button):hover .lx-ic, .barre .menu-compte .tiroir > a:hover .lx-ic { color: #fff; }
/* « Ajouter une société » : ses deux voies, la bulle centrée sous le bouton */
.lx-menu-ajouter > summary { list-style: none; }
.lx-menu-ajouter > summary::-webkit-details-marker { display: none; }
details.lx-menu-ajouter > .menu-plus-liste { left: 50%; right: auto; width: max-content; translate: -50% 0; }
details.lx-menu-ajouter[open] > .menu-plus-liste { transform-origin: top center; }

/* le mot qui confirme, en bas de l'écran (`apple.js`, `confirmer`) */
.ap-mot { position: fixed; z-index: 3200; left: 50%; bottom: 26px; display: flex; align-items: center; gap: 9px; height: 42px; padding: 0 18px 0 12px; border-radius: 999px;
  background: rgba(30, 30, 32, .8); color: #fff; backdrop-filter: blur(20px) saturate(180%); -webkit-backdrop-filter: blur(20px) saturate(180%); font-size: 13.5px; font-weight: 500;
  box-shadow: 0 12px 34px -10px rgba(0, 0, 0, .45), inset 0 0 0 .5px rgba(255, 255, 255, .12); transform: translate(-50%, 90px); transition: transform 560ms var(--lx-ressort); pointer-events: none; }
.ap-mot.vu { transform: translate(-50%, 0); }
.ap-coche { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: #34c759; }
.ap-coche svg { width: 11px; height: 11px; fill: none; stroke: #fff; stroke-width: 2.8; stroke-linecap: round; stroke-linejoin: round; }

/* un tableau trop étroit coupait un nom lettre par lettre (« Ima / ne / Ber… ») : un nom ne se coupe plus
   qu'entre deux mots, et sa colonne garde au moins la largeur du mot le plus long */
@container lx-tableau (min-width: 701px) {
  .lx-tableau .lx-valeur, .lx-tableau .lx-valeur-et-sous { overflow-wrap: break-word; }
}
/* un titre de colonne passe à la ligne plutôt que d'être coupé quand la place manque */
.lx-tableau thead th { white-space: normal; }

/* ---------------------------------------------------------------------------
   Lot AP2 · les pièces de la maquette du portefeuille (`lots/LOT-AP2-portefeuille.md`), communes à toute liste :
   les filtres collés au titre, la liste à la façon du Finder (`data-lx-liste`), la case ronde, le tri, le carré des
   initiales d'une société, l'aperçu qui naît de la ligne, la barre de verre des lignes retenues, l'entrée en cascade.
   --------------------------------------------------------------------------- */
:root {
  --ap-ressort-vif: linear(0, .08 2%, .3 5%, .62 9%, .9 13.5%, 1.06 18%, 1.1 22%, 1.08 27%, 1.03 34%, .99 43%, .985 52%, 1 66%, 1);
  --ap-trait: rgba(60, 60, 67, .12);
  --ap-point-vide: #c7c7cc;   /* le bord d'un point à venir (une étape, une case ronde) */
  --ap-point-fait: #34c759;   /* un point fait, le vert du système */
  --ap-loupe: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238e8e93' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='m16 16 4 4'/%3E%3C/svg%3E");
  --ap-coche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E");
}

/* Le titre d'une page : 34, gras (la charte, partie 3) */
.lx-tete:not(.lx-tete-compacte) .lx-titre { font-size: 34px; line-height: 1.05; letter-spacing: -.028em; }

/* « Chez nous » : c'est à nous d'agir, la couleur de l'action (la charte : la couleur dit un état) */
.lx-etat-encre { background: color-mix(in srgb, var(--mz-vert) 11%, transparent); color: var(--mz-vert); }

/* Les filtres et la recherche, sur une ligne juste sous le titre ; la lentille blanche glisse vers le filtre choisi
   (`apple.js`). Posés juste au-dessus d'une liste, ils restent en haut quand elle défile. */
.lx-filtres:has(.lx-segment) { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.lx-filtres:has(+ .lx-cadre [data-lx-liste]) { position: sticky; top: 12px; z-index: 6; }
.lx-segment { position: relative; gap: 2px; padding: 4px; border-radius: 999px; background: var(--ap-verre);
  backdrop-filter: var(--ap-verre-flou); -webkit-backdrop-filter: var(--ap-verre-flou); box-shadow: var(--ap-verre-bord), var(--ap-verre-ombre); }
.lx-segment .lx-filtre { position: relative; isolation: isolate; display: inline-flex; align-items: center; height: 32px; padding: 0 14px; border-radius: 999px;
  font-size: 13.5px; font-weight: 500; white-space: nowrap; transition: color .25s; text-decoration: none; }
.lx-segment .lx-filtre:hover { background: none; }
.lx-segment .lx-filtre:is([aria-pressed="true"], [aria-current="page"]) { background: none; box-shadow: none; }
.lx-segment .lx-filtre:is([aria-pressed="true"], [aria-current="page"])::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit;
  background: rgba(255, 255, 255, .96); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .04), 0 1px 2px rgba(0, 0, 0, .06), 0 4px 12px rgba(0, 0, 0, .1), inset 0 1px 0 #fff; transform-origin: 0 0; }
.lx-segment .lx-compte { min-width: 0; margin-left: 5px; padding: 0; background: none; color: var(--mz-encre-tenue); font-size: 12.5px; font-weight: 500; }
.lx-filtres .lx-recherche { margin-left: auto; }
.lx-filtres .lx-recherche input { width: 280px; height: 40px; padding: 0 14px 0 38px; border: 0; border-radius: 999px; font-size: 14px;
  background: var(--ap-loupe) no-repeat 14px center / 17px, var(--ap-verre); backdrop-filter: var(--ap-verre-flou); -webkit-backdrop-filter: var(--ap-verre-flou);
  box-shadow: var(--ap-verre-bord), var(--ap-verre-ombre); transition: width 500ms var(--lx-ressort), box-shadow .2s; }
.lx-filtres .lx-recherche input:focus { width: 340px; border: 0; box-shadow: var(--ap-verre-bord), 0 0 0 1px var(--mz-vert), 0 0 0 4px var(--mz-vert-clair), var(--ap-verre-ombre); }

/* La liste à la façon du Finder : une carte blanche, des lignes hautes, le trait qui part après les initiales */
.lx-cadre:has([data-lx-liste]) { border-radius: 22px; }
.lx-cadre:has([data-lx-liste]) > .lx-cadre-corps:first-child { padding: 0; }
.lx-tableau[data-lx-liste] .lx-tableau-defile { box-shadow: none; border-radius: 22px; background: none; }
/* les colonnes se partagent la largeur, la première (ce que la ligne nomme) en prend plus : un texte long s'abrège */
.lx-tableau[data-lx-liste] table { table-layout: fixed; }
.lx-tableau[data-lx-liste] th:first-child { width: 30%; }
.lx-tableau[data-lx-liste] td .lx-cellule:has(> .lx-avatar):not(:has(.lx-sous)) > .lx-valeur-et-sous { display: block; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lx-tableau[data-lx-liste] th { height: 38px; padding: 0 14px; vertical-align: middle; border-bottom: .5px solid var(--ap-trait); font-size: 12px; font-weight: 600; color: var(--mz-encre-tenue); }
.lx-tableau[data-lx-liste] th:first-child, .lx-tableau[data-lx-liste] td:first-child { padding-left: 16px; }
.lx-tableau[data-lx-liste] td { height: 62px; padding: 8px 14px; border-bottom: 0; background: none; font-size: 13.5px; }
.lx-tableau[data-lx-liste] tbody tr { position: relative; transition: background-color .15s; }
/* le trait est porté par les cases : posé sur la ligne, il compterait pour une colonne de plus */
.lx-tableau[data-lx-liste] tbody tr + tr > td { box-shadow: inset 0 .5px 0 var(--ap-trait); }
.lx-tableau[data-lx-liste] tbody tr + tr > td:first-child { position: relative; box-shadow: none; }
.lx-tableau[data-lx-liste] tbody tr + tr > td:first-child::after { content: ""; position: absolute; left: 98px; right: 0; top: 0; border-top: .5px solid var(--ap-trait); pointer-events: none; }
.lx-tableau[data-lx-liste] tbody tr:hover, .lx-tableau[data-lx-liste] tbody tr:hover td { background: rgba(0, 0, 0, .022); }
.lx-tableau[data-lx-liste] tbody tr:active td { background: rgba(0, 0, 0, .045); }
.lx-tableau[data-lx-liste] tbody tr:has([data-lx-coche]:checked) td { background: color-mix(in srgb, var(--mz-vert) 11%, transparent); }
.lx-tableau[data-lx-liste] tbody tr[data-lx-apercu] { cursor: pointer; }
.lx-tableau[data-lx-liste] tr:has(> td:first-child > .lx-cellule > .lx-coche input) td { color: var(--mz-encre); }
.lx-tableau[data-lx-liste] .lx-lien-ligne { color: var(--mz-encre); text-decoration: none; }
/* une case à pastille : le nom au-dessus, la pastille dessous, et ce qui la suit à côté d'elle */
.lx-tableau[data-lx-liste] td:not(.lx-titre-ligne) .lx-cellule:has(> .lx-etat) { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 3px 10px; }
.lx-tableau[data-lx-liste] td:not(.lx-titre-ligne) .lx-cellule:has(> .lx-etat) > :is(.lx-valeur-et-sous, .lx-sous) { flex: 0 0 100%; min-width: 0; margin: 0; }
.lx-tableau[data-lx-liste] td:not(.lx-titre-ligne) .lx-cellule:has(> .lx-etat) > :is(.lx-valeur-et-sous, .lx-sous) { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lx-tableau[data-lx-liste] td:not(.lx-titre-ligne) .lx-sous { font-size: 12.5px; color: var(--mz-encre-tenue); }
/* la société : la case, le carré des initiales, le nom et sa forme en petite étiquette */
.lx-tableau[data-lx-liste] td.lx-titre-ligne .lx-cellule { display: grid; grid-template-columns: auto auto minmax(0, 1fr); align-items: center; column-gap: 12px; row-gap: 2px; }
.lx-tableau[data-lx-liste] td.lx-titre-ligne .lx-cellule > :is(.lx-coche, .lx-avatar) { grid-row: 1 / span 2; margin: 0; }
.lx-tableau[data-lx-liste] td.lx-titre-ligne .lx-cellule > :is(.lx-valeur-et-sous, .lx-sous) { grid-column: 3; min-width: 0; }
.lx-tableau[data-lx-liste] td.lx-titre-ligne .lx-cellule > .lx-valeur-et-sous { align-self: end; overflow: hidden; }
.lx-tableau[data-lx-liste] td.lx-titre-ligne .lx-lien-ligne { display: block; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lx-tableau[data-lx-liste] td.lx-titre-ligne .lx-sous { align-self: start; justify-self: start; height: 18px; margin: 0; padding: 0 6px; border-radius: 5px;
  background: rgba(120, 120, 128, .08); font-size: 10.5px; font-weight: 600; line-height: 18px; color: var(--mz-encre-douce); }
.lx-avatar.lx-logo { flex: none; width: 36px; height: 36px; border-radius: 11px; font-size: 13px; font-weight: 700; background: var(--lx-initiales); color: #fff; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3); }
.lx-tableau[data-lx-liste] td:not(.lx-titre-ligne) .lx-cellule > .lx-avatar { width: 26px; height: 26px; font-size: 10.5px; background: var(--lx-initiales); color: #fff; }
.lx-tableau[data-lx-liste] td .lx-cellule:has(> .lx-avatar):not(:has(.lx-sous)) { flex-wrap: nowrap; gap: 8px; }
/* « Lancer une opération », « À désigner » : un lien dans la colonne, au lieu d'un bouton de plus */
.lx-tableau[data-lx-liste] td .btn.lx-bouton-ligne:not(.btn-plein):not(.btn-nu) { height: auto; margin: 0; padding: 0 4px 0 0; background: none; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; color: var(--mz-vert); font-weight: 500; }
.lx-tableau[data-lx-liste] td .btn.lx-bouton-ligne:not(.btn-plein):not(.btn-nu)::before { content: "+"; margin-right: 2px; font-size: 16px; font-weight: 400; line-height: 1; }
/* à côté d'une opération déjà suivie, le lancement d'une autre ne paraît qu'au survol : posé sur la case, sans la grandir */
.lx-tableau[data-lx-liste] td:has(> .lx-cellule > .lx-bouton-ligne:not(.lx-toujours)) { position: relative; }
.lx-tableau[data-lx-liste] td .btn.lx-bouton-ligne:not(.lx-toujours):not(.btn-plein):not(.btn-nu) { position: absolute; right: 10px; bottom: 10px; padding: 2px 8px; border-radius: 999px; background: var(--mz-surface); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .08), 0 2px 8px rgba(0, 0, 0, .08); }
.lx-tableau[data-lx-liste] .lx-gestes .btn-nu { gap: 8px; padding: 0; height: auto; color: var(--mz-encre-tenue); font-weight: 400; }
.lx-tableau[data-lx-liste] .lx-gestes .btn-nu:hover { color: var(--mz-vert); background: none; }
.lx-tableau[data-lx-liste] .lx-gestes .btn-nu .lx-ic { box-sizing: border-box; width: 26px; height: 26px; padding: 6px; border-radius: 50%; background: rgba(120, 120, 128, .12); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .06); }
/* le chevron : la ligne s'ouvre en aperçu */
.lx-tableau[data-lx-liste] :is(th, td).lx-col-chevron { width: 36px; padding: 0 12px 0 0; color: #c4c4c7; }
.lx-tableau[data-lx-liste] td.lx-col-chevron .lx-ic { width: 14px; height: 14px; }
/* le tri : la flèche paraît sur la colonne triée, et tourne quand l'ordre s'inverse */
.lx-trier { display: inline-flex; align-items: center; gap: 4px; height: auto; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; font: inherit; color: inherit; cursor: pointer; }
.lx-trier:is(:hover, :focus, :active) { background: none; color: var(--mz-encre); transform: none; }
.lx-trier:focus-visible { outline: 2px solid var(--mz-vert); outline-offset: 2px; border-radius: 4px; }
.lx-trier .lx-ic { width: 12px; height: 12px; opacity: 0; transition: transform 400ms var(--lx-ressort), opacity .2s; }
.lx-trier:hover .lx-ic { opacity: .45; }
th[aria-sort] .lx-trier .lx-ic { opacity: 1; }
th[aria-sort="descending"] .lx-trier .lx-ic { transform: rotate(180deg); }
/* la case ronde, comme dans Mail : elle paraît au survol, et sur toutes les lignes dès qu'une est retenue */
.lx-tableau[data-lx-liste] .lx-coche input { appearance: none; -webkit-appearance: none; display: grid; place-items: center; width: 22px; height: 22px; margin: 0; border-radius: 50%;
  box-shadow: inset 0 0 0 1.5px #c7c7cc; opacity: 0; cursor: pointer; transition: opacity .2s, background-color .25s, box-shadow .25s, transform 450ms var(--ap-ressort-vif); }
.lx-tableau[data-lx-liste] .lx-coche input::after { content: ""; width: 12px; height: 12px; background: var(--ap-coche) center / contain no-repeat; transform: scale(0); transition: transform 450ms var(--ap-ressort-vif); }
.lx-tableau[data-lx-liste] tr:hover .lx-coche input, .lx-tableau[data-lx-liste]:has([data-lx-coche]:checked) .lx-coche input, .lx-tableau[data-lx-liste] .lx-coche input:focus-visible { opacity: 1; }
.lx-tableau[data-lx-liste] .lx-coche input:checked { opacity: 1; background: var(--mz-vert); box-shadow: none; }
.lx-tableau[data-lx-liste] .lx-coche input:checked::after { transform: scale(1); }
.lx-tableau[data-lx-liste] .lx-coche input:active { transform: scale(.85); }
@media (hover: none) { .lx-tableau[data-lx-liste] .lx-coche input { opacity: 1; } }
/* filtrer, chercher, trier : les lignes entrent en cascade (`apple.js` pose le rang) */
.lx-tableau[data-lx-liste] tbody tr.ap-entre { animation: ap-entre 500ms var(--lx-ressort) both; animation-delay: var(--ap-rang, 0ms); }
@keyframes ap-entre { from { opacity: 0; transform: translateY(8px); } }
/* trop étroite, la liste se replie en cartes comme tout tableau : la case reste visible, le chevron part */
@container lx-tableau (max-width: 700px) {
  .lx-tableau[data-lx-liste] tbody tr + tr > td, .lx-tableau[data-lx-liste] tbody tr + tr > td:first-child::after { box-shadow: none; border: 0; }
  .lx-tableau[data-lx-liste] td { height: auto; padding: 0; }
  .lx-tableau[data-lx-liste] td.lx-col-chevron { display: none; }
  .lx-tableau[data-lx-liste] .lx-coche input { opacity: 1; }
}

/* La barre des lignes retenues : du verre qui monte en ressort, le nombre qui défile (`apple.js`) */
.lx-barre-cochees { display: flex; flex-wrap: nowrap; bottom: 24px; gap: 10px; min-height: 52px; padding: 6px 8px 6px 18px; border-radius: 999px;
  background: rgba(255, 255, 255, .72); backdrop-filter: var(--ap-verre-flou); -webkit-backdrop-filter: var(--ap-verre-flou);
  box-shadow: var(--ap-verre-bord), 0 0 0 .5px rgba(0, 0, 0, .1), 0 20px 50px -14px rgba(0, 0, 0, .35);
  transform: translateY(100px) scale(.9); opacity: 0; visibility: hidden; pointer-events: none;
  transition: transform 600ms var(--ap-ressort-vif), opacity .3s, visibility 0s linear 600ms; }
form:has(tbody input[data-lx-coche]:checked) .lx-barre-cochees { display: flex; transform: none; opacity: 1; visibility: visible; pointer-events: auto; animation: none;
  transition: transform 600ms var(--ap-ressort-vif), opacity .3s, visibility 0s; }
.lx-barre-cochees .lx-champ-ligne { flex-wrap: nowrap; white-space: nowrap; }
.lx-cochees[data-un]::before { content: none; }
.lx-cochees[data-un] { white-space: nowrap; }
.lx-cochees b { font-variant-numeric: tabular-nums; }

/* L'aperçu : il naît de la ligne, comme le coup d'œil du Mac, et y retourne (`apple.js`) */
.ap-voile { position: fixed; inset: 0; z-index: 3000; background: rgba(242, 242, 247, .3); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  opacity: 0; pointer-events: none; transition: opacity .35s; }
.ap-voile.vu { opacity: 1; pointer-events: auto; }
.ap-apercu { position: fixed; z-index: 3001; top: 12vh; left: 76px; right: 0; width: min(560px, calc(100vw - 108px)); margin: 0 auto; border-radius: 28px;
  background: var(--ap-verre-epais); backdrop-filter: var(--ap-verre-flou); -webkit-backdrop-filter: var(--ap-verre-flou);
  box-shadow: var(--ap-verre-bord), 0 0 0 .5px rgba(0, 0, 0, .08), 0 30px 80px -24px rgba(0, 0, 0, .4); overflow: hidden; transform-origin: 0 0; }
.ap-apercu-haut { display: flex; align-items: center; gap: 14px; padding: 20px 20px 14px 22px; }
.ap-apercu-haut .lx-avatar { width: 52px; height: 52px; border-radius: 15px; font-size: 18px; }
.ap-apercu-haut h3 { margin: 0; font-size: 21px; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; }
.ap-apercu-haut .ap-forme { display: inline-block; height: 18px; margin-top: 2px; padding: 0 6px; border-radius: 5px; background: rgba(120, 120, 128, .08); font-size: 10.5px; font-weight: 600; line-height: 18px; color: var(--mz-encre-douce); }
.ap-apercu-haut .ap-forme:empty { display: none; }
.ap-apercu-fermer { align-self: flex-start; display: grid; place-items: center; width: 32px; height: 32px; margin-left: auto; border: 0; border-radius: 50%; background: none; box-shadow: none; color: #1d1d1f; cursor: pointer;
  transition: background-color .15s, transform 450ms var(--ap-ressort-vif); }
.ap-apercu-fermer:hover { background: rgba(0, 0, 0, .06); }
.ap-apercu-fermer:active { transform: scale(.86); }
.ap-apercu-corps { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; padding: 0 18px 4px; }
.ap-tuile { min-width: 0; padding: 12px 13px; border-radius: 16px; background: rgba(255, 255, 255, .8); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .05); animation: ap-monte 500ms var(--lx-ressort) both; }
.ap-tuile:nth-child(2) { animation-delay: 50ms; } .ap-tuile:nth-child(3) { animation-delay: 100ms; } .ap-tuile:nth-child(n+4) { animation-delay: 150ms; }
.ap-tuile > small { display: block; margin-bottom: 6px; font-size: 11.5px; color: var(--mz-encre-douce); }
.ap-tuile .lx-cellule { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; font-size: 14px; font-weight: 600; }
.ap-tuile .lx-cellule > * { flex: none; max-width: 100%; }
.ap-tuile .lx-cellule:has(> .lx-avatar) { flex-direction: row; align-items: center; gap: 8px; }
.ap-tuile .lx-cellule > .lx-avatar { width: 26px; height: 26px; font-size: 10.5px; background: var(--lx-initiales); color: #fff; }
.ap-tuile .lx-sous, .ap-tuile .lx-etat { font-weight: 500; }
.ap-tuile .lx-sous { font-size: 12.5px; color: var(--mz-encre-douce); }
.ap-tuile .lx-lien-ligne { color: var(--mz-encre); }
.ap-apercu-pied { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; padding: 14px 18px 18px; }
/* « Ouvrir le fil » : le bleu, l'icône et la taille de la maquette */
.ap-apercu-pied .btn { height: 32px; padding: 0 15px; gap: 7px; font-size: 13.5px; font-weight: 500; }
.ap-apercu-pied .ap-second { color: #0000ee; }
.ap-apercu-pied .ap-second .lx-ic { width: 17px; height: 17px; }
@keyframes ap-monte { from { opacity: 0; transform: translateY(12px); } }
@media (prefers-reduced-motion: reduce) {
  .lx-tableau[data-lx-liste] tbody tr.ap-entre, .ap-tuile { animation: none; }
  .lx-barre-cochees, .ap-voile, .lx-filtres .lx-recherche input { transition: none; }
}
/* la barre : « Annuler » en gris ; « Lancer une opération » sort sa bulle de verre vers le haut, chaque choix lance */
.lx-barre-cochees .btn[data-lx-decocher]:not(.btn-plein):not(.btn-nu):not(.btn-doux) { background: rgba(120, 120, 128, .12); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.lx-barre-cochees .btn[data-lx-decocher]:not(.btn-plein):not(.btn-nu):not(.btn-doux):hover { background: rgba(120, 120, 128, .2); }
.lx-barre-cochees .btn-danger { background: none; border: 0; box-shadow: none; }
.lx-barre-cochees details.menu-plus > summary { list-style: none; }
.lx-barre-cochees details.menu-plus > .menu-plus-liste { top: auto; bottom: calc(100% + 12px); right: 0; min-width: 300px; max-height: 60vh; overflow: auto; padding: 6px; transform-origin: bottom right;
  background: rgba(250, 250, 252, .9); }
.lx-barre-cochees details.menu-plus > .menu-plus-liste > button { min-height: 34px; border-radius: 10px; }
.lx-barre-cochees details.menu-plus > .menu-plus-liste > button:hover { background: var(--mz-vert); color: #fff; }
/* une échéance datée : le sablier au lieu du point, comme la maquette */
.lx-tableau[data-lx-liste] td[data-lx-cle] .lx-etat::before { width: 12px; height: 12px; border-radius: 0; opacity: 1; background: currentColor;
  -webkit-mask: var(--ap-sablier) center / contain no-repeat; mask: var(--ap-sablier) center / contain no-repeat; }
:root { --ap-sablier: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round'%3E%3Cpath d='M7 3.5h10M7 20.5h10M8 3.5c0 4 4 5 4 8.5s-4 4.5-4 8.5M16 3.5c0 4-4 5-4 8.5s4 4.5 4 8.5'/%3E%3C/svg%3E"); }
/* l'aperçu : trois tuiles courtes, puis le détail en liste groupée */
.ap-tuile strong { display: flex; align-items: center; gap: 8px; min-width: 0; font-size: 15px; font-weight: 600; }
.ap-tuile strong .lx-avatar { width: 22px; height: 22px; font-size: 9.5px; background: var(--lx-initiales); color: #fff; }
.ap-lignes { grid-column: 1 / -1; border-radius: 16px; background: rgba(255, 255, 255, .8); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .05); animation: ap-monte 500ms var(--lx-ressort) 150ms both; }
.ap-lignes > div { display: flex; gap: 12px; padding: 10px 14px; font-size: 13.5px; }
.ap-lignes > div + div { border-top: .5px solid var(--ap-trait); }
.ap-lignes > div > span { flex: none; color: var(--mz-encre-douce); }
.ap-lignes > div > b { margin-left: auto; min-width: 0; font-weight: 500; text-align: right; }
.ap-lignes .lx-lien-ligne { color: var(--mz-encre); text-decoration: none; }
/* une pastille au nom très long (« Procès-verbal de l'assemblée générale ordinaire, nomination… ») passe à la ligne
   au lieu de sortir de son cadre sur un écran étroit */
.lx-puces { max-width: 100%; }
.lx-puce { max-width: 100%; white-space: normal; }

/* ---------------------------------------------------------------------------
   Lot AP4 · Personnes et mandats, au détail près de sa maquette (`lots/maquettes/apple/personnes-et-mandats.html`,
   `commun.css`), les valeurs lues dans la maquette (`lots/LOT-AP4-personnes-et-mandats.md`). Des pièces communes,
   ajoutées : les chiffres en tuiles dans la tête, la barre d'outils, les filtres en bulle, la pastille qui dit ce qu'elle
   annonce, les groupes d'une liste compacte, ce qui manque en pastille « + », la barre d'enregistrement, la bulle d'un
   geste, la liste groupée des Réglages, le tiroir d'une personne, la fenêtre Nouvelle opération, le mot qui confirme.
   --------------------------------------------------------------------------- */
:root {
  --apm-label: #1d1d1f; --apm-label2: #6e6e73; --apm-label3: #8e8e93; --apm-sep: rgba(60, 60, 67, .12);
  --apm-fill: rgba(120, 120, 128, .12); --apm-fill2: rgba(120, 120, 128, .08);
  --apm-tint: #0f7b65; --apm-tint2: #12957a; --apm-tint-clair: rgba(15, 123, 101, .11);
  --apm-orange: #f28a00; --apm-orange-encre: #a35c00; --apm-orange-clair: rgba(255, 149, 0, .13); --apm-rouge: #e5372c; --apm-bleu: #2f7cf6;
  --apm-verre: rgba(255, 255, 255, .6); --apm-verre-epais: rgba(255, 255, 255, .82); --apm-flou: blur(26px) saturate(190%);
  --apm-liser: inset 0 0 0 1px rgba(255, 255, 255, .7), inset 0 1px 0 #fff;
  --apm-ombre-verre: 0 0 0 .5px rgba(0, 0, 0, .08), 0 2px 6px rgba(0, 0, 0, .04), 0 16px 40px -14px rgba(0, 0, 0, .22);
  --apm-ombre-carte: 0 0 0 .5px rgba(0, 0, 0, .05), 0 1px 3px rgba(0, 0, 0, .04);
  --apm-ressort: linear(0, .05 2.4%, .2 5.2%, .43 9.2%, .68 13.8%, .86 18.8%, .97 24%, 1.03 30%, 1.045 35%, 1.04 41%, 1.02 50%, 1.005 60%, .998 72%, 1);
  --apm-ressort-vif: linear(0, .08 2%, .3 5%, .62 9%, .9 13.5%, 1.06 18%, 1.1 22%, 1.08 27%, 1.03 34%, .99 43%, .985 52%, 1 66%, 1);
  --apm-doux: cubic-bezier(.32, .72, 0, 1);
  --apm-bas: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='m6 9.5 6 6 6-6'/%3E%3C/svg%3E");
  --apm-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9.5 6 6 6-6 6'/%3E%3C/svg%3E");
  --apm-question: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M9.8 9.6a2.3 2.3 0 0 1 4.4.9c0 1.6-2.2 2-2.2 3.4M12 16.8v.2'/%3E%3C/svg%3E");
  --apm-coche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E");
}
/* les gris, le vert et l'espacement des lettres des maquettes, sur les pièces de cet écran */
.lx-tete:has(.lx-chiffres), .lx-outils, .lx-outils + .lx-filtres, .lx-cadre:has([data-lx-liste][data-lx-compact]), .lx-tiroir, .ap-bulle-portee, .lx-brefs,
.lx-nouvelle, .tiroir-refonte.tiroir-fenetre {
  --mz-encre: var(--apm-label); --mz-encre-douce: var(--apm-label2); --mz-encre-tenue: var(--apm-label3); --mz-vert: var(--apm-tint);
  --ap-trait: var(--apm-sep); letter-spacing: -.006em; color: var(--apm-label); }
.lx-tete:has(.lx-chiffres) .lx-titre { color: var(--apm-label); }

/* Une fenêtre ou un tiroir fermé (`hidden`, `mizan/refonte.js`) ne prend plus les clics : sa règle `display: flex`
   l'emportait sur `hidden`, et la fenêtre, transparente, gardait la place où elle était (relevé au lot AP4 : « Alertes »
   ne s'ouvrait plus après avoir refermé « Nouvelle opération »). Sa montée en fondu reste. */
.tiroir-refonte[hidden] { visibility: hidden; pointer-events: none; }

/* Les boutons des maquettes, dans la liste, le tiroir et la fenêtre : « verre », « gris », « plein » */
:is(.lx-tableau[data-lx-compact], .lx-tiroir, .lx-nouvelle, .lx-enregistrer) .btn.btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 32px; padding: 0 15px; border: 0;
  border-radius: 999px; font-size: 13.5px; font-weight: 500; white-space: nowrap; text-decoration: none; transition: transform .45s var(--apm-ressort-vif), filter .2s, background-color .2s, box-shadow .2s, opacity .2s; }
:is(.lx-tableau[data-lx-compact], .lx-tiroir, .lx-nouvelle, .lx-enregistrer) .btn.btn:active { transform: scale(.94); transition-duration: .08s; }
:is(.lx-tableau[data-lx-compact], .lx-tiroir, .lx-nouvelle) .btn.btn:not(.btn-plein) { color: var(--apm-label); background: rgba(255, 255, 255, .78); backdrop-filter: none; -webkit-backdrop-filter: none;
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1), inset 0 1px 0 #fff, 0 1px 3px rgba(0, 0, 0, .08); }
:is(.lx-tableau[data-lx-compact], .lx-tiroir, .lx-nouvelle) .btn.btn:not(.btn-plein):hover { background: #fff; }
:is(.lx-tableau[data-lx-compact], .lx-tiroir, .lx-nouvelle, .lx-enregistrer) .btn.btn-plein { color: #fff; background: linear-gradient(180deg, #1aa688, var(--apm-tint) 60%, #0b6654);
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .15), inset 0 1px 0 rgba(255, 255, 255, .4), inset 0 -1px 1px rgba(0, 0, 0, .12), 0 4px 14px -4px rgba(15, 123, 101, .55); }
:is(.lx-tableau[data-lx-compact], .lx-tiroir, .lx-nouvelle, .lx-enregistrer) .btn.btn-plein:hover { filter: brightness(1.07); }
:is(.lx-tableau[data-lx-compact], .lx-tiroir, .lx-nouvelle, .lx-enregistrer) .btn .lx-ic { width: 17px; height: 17px; }
/* `refonte.css` impose aux boutons, et aux petits, leur hauteur, leur marge et leur angle en `!important` : les boutons de
   ces pièces reprennent ceux de la maquette au même niveau */
:is(.lx-tableau[data-lx-compact], .lx-tiroir, .lx-nouvelle, .lx-enregistrer) .btn.btn { min-height: 0 !important; height: 32px !important; padding: 0 15px !important;
  font-size: 13.5px !important; line-height: 1.45 !important; border-radius: 999px !important; }
.lx-tableau[data-lx-liste][data-lx-compact] :is(.lx-gestes-replies > summary, td:last-child .lx-gestes > .btn).btn.btn { height: 30px !important; padding: 0 13px !important; font-size: 13px !important; }
.lx-gestes.ap-bulle-portee .btn.btn { height: auto !important; min-height: 34px !important; padding: 0 10px !important; font-size: 13.5px !important; border-radius: 10px !important; }
/* « gris » : annuler, revenir, choisir autre chose */
.lx-enregistrer .btn.btn[data-lx-annuler], :is(.lx-nouvelle, [data-lx-feuille]) .lx-pied-fenetre .btn.btn:not(.btn-plein), .lx-fait .btn.btn:not(.btn-plein) { color: var(--apm-label); background: var(--apm-fill); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.lx-enregistrer .btn.btn[data-lx-annuler]:hover, :is(.lx-nouvelle, [data-lx-feuille]) .lx-pied-fenetre .btn.btn:not(.btn-plein):hover, .lx-fait .btn.btn:not(.btn-plein):hover { background: rgba(120, 120, 128, .2); }

/* La tête : le titre et sa phrase à gauche, les chiffres en tuiles blanches à droite ; un clic descend au groupe */
.lx-tete:has(.lx-chiffres) { align-items: flex-end; gap: 16px; }
.lx-tete:has(.lx-chiffres) .lx-sous { max-width: none; margin-top: 6px; font-size: 13px; line-height: 1.45; color: var(--apm-label2); }
.lx-tete .lx-gestes > .lx-chiffres { display: flex; gap: 8px; margin-left: auto; }
.lx-tete .lx-chiffres .lx-chiffre { display: flex; flex-direction: column; align-items: flex-start; gap: 0; min-width: 104px; padding: 9px 14px 8px; border: 0; border-radius: 18px;
  background: #fff; box-shadow: var(--apm-ombre-carte); color: var(--apm-label); font-size: 14px; line-height: 1.45; text-align: left; text-decoration: none;
  transition: transform .5s var(--apm-ressort), box-shadow .3s; }
.lx-tete .lx-chiffres .lx-chiffre-lien:hover { transform: translateY(-2px); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .05), 0 12px 26px -12px rgba(0, 0, 0, .2); }
.lx-tete .lx-chiffres .lx-chiffre-lien:active { transform: scale(.96); transition-duration: .1s; }
.lx-tete .lx-chiffres .lx-chiffre-lib { display: flex; align-items: center; gap: 5px; font-size: 12px; line-height: 1.45; color: var(--apm-label2); }
.lx-tete .lx-chiffres .lx-chiffre-ic { display: inline-flex; width: auto; height: auto; padding: 0; border-radius: 0; background: none; box-shadow: none; color: var(--apm-label3); }
.lx-tete .lx-chiffres .lx-chiffre-ic .lx-ic { width: 13px; height: 13px; stroke-width: 1.7; }
.lx-tete .lx-chiffres .lx-chiffre-v b { font-size: 24px; font-weight: 700; line-height: 1.15; letter-spacing: -.02em; color: var(--apm-label); }
.lx-tete .lx-chiffres .lx-chiffre-rouge :is(.lx-chiffre-ic, .lx-chiffre-v b) { color: var(--apm-rouge); }
.lx-tete .lx-chiffres .lx-chiffre-ambre :is(.lx-chiffre-ic, .lx-chiffre-v b) { color: var(--apm-orange); }
.lx-tete .lx-chiffres :is(.lx-chiffre-rouge, .lx-chiffre-ambre) .lx-chiffre-lib { color: var(--apm-label2); }

/* La barre d'outils sous le titre : ce que la page montre à gauche, les alertes et le rangement à droite ; elle reste
   en haut quand la liste défile ; trop étroite, elle passe à la ligne sans couper un segment */
.lx-outils { position: sticky; top: 12px; z-index: 6; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 10px; }
.lx-outils .lx-filtres { margin: 0; }
/* dans une page en colonne (`lx-page`, 18 entre ses pièces), 10 sous la barre et 12 sous la rangée, comme la maquette */
.lx-page > .lx-outils { margin-bottom: -8px; }
.lx-page > .lx-outils + .lx-filtres { margin-bottom: -6px; }
.lx-outils-droite { margin-left: auto; display: flex; align-items: center; gap: 10px; }
:is(.lx-outils, .lx-outils + .lx-filtres) .lx-segment { flex-wrap: nowrap; white-space: nowrap; height: 40px; padding: 4px; gap: 2px; background: var(--apm-verre);
  backdrop-filter: var(--apm-flou); -webkit-backdrop-filter: var(--apm-flou); box-shadow: var(--apm-liser), var(--apm-ombre-verre); }
:is(.lx-outils, .lx-outils + .lx-filtres) .lx-segment .lx-filtre { gap: 0; height: 32px; padding: 0 14px; font-size: 13.5px; font-weight: 500; color: var(--apm-label2); transition: color .25s; }
:is(.lx-outils, .lx-outils + .lx-filtres) .lx-segment .lx-filtre:is([aria-pressed="true"], [aria-current="page"]) { color: var(--apm-label); }
:is(.lx-outils, .lx-outils + .lx-filtres) .lx-segment .lx-filtre:is([aria-pressed="true"], [aria-current="page"])::before { background: rgba(255, 255, 255, .96);
  box-shadow: 0 0 0 .5px rgba(0, 0, 0, .04), 0 1px 2px rgba(0, 0, 0, .06), 0 4px 12px rgba(0, 0, 0, .1), inset 0 1px 0 #fff; }
:is(.lx-outils, .lx-outils + .lx-filtres) .lx-segment .lx-compte { margin-left: 5px; font-size: .8333em; font-weight: 500; color: var(--apm-label3); font-variant-numeric: tabular-nums; }
/* la rangée du filtre pris naît sous la barre, en hauteur : son mot, puis un petit segment */
.lx-outils + .lx-filtres { display: flex; align-items: center; gap: 10px; margin-top: 0; padding: 2px; transform-origin: 0 0; animation: apm-rangee 450ms var(--apm-doux) both; }
.lx-outils + .lx-filtres .lx-filtres-note { order: -1; margin: 0; font-size: 12.5px; color: var(--apm-label2); }
.lx-outils + .lx-filtres .lx-segment { height: 36px; }
.lx-outils + .lx-filtres .lx-segment .lx-filtre { height: 28px; padding: 0 12px; font-size: 13px; }
@keyframes apm-rangee { from { opacity: 0; clip-path: inset(0 0 100% 0); transform: translateY(-6px); } }

/* Des filtres en bulle (« Alertes ») : une pastille de verre, la cloche ; la bulle sort de son milieu ; pris, l'orange */
.lx-filtres-bulle { position: relative; }
.lx-filtres-bulle > summary { display: inline-flex; align-items: center; gap: 7px; height: 40px; padding: 0 14px 0 12px; border-radius: 999px; list-style: none; cursor: pointer;
  background: var(--apm-verre); backdrop-filter: var(--apm-flou); -webkit-backdrop-filter: var(--apm-flou); box-shadow: var(--apm-liser), var(--apm-ombre-verre);
  font-size: 13.5px; font-weight: 500; color: var(--apm-label); white-space: nowrap; transition: transform .45s var(--apm-ressort-vif); }
.lx-filtres-bulle > summary::-webkit-details-marker { display: none; }
.lx-filtres-bulle > summary:active { transform: scale(.94); }
.lx-filtres-bulle > summary .lx-ic { width: 17px; height: 17px; stroke-width: 1.7; color: var(--apm-label2); }
.lx-filtres-bulle > summary .lx-ic:last-child { width: 13px; height: 13px; color: var(--apm-label3); }
.lx-filtres-bulle > summary.lx-filtres-bulle-on { color: var(--apm-orange-encre); }
.lx-filtres-bulle > summary.lx-filtres-bulle-on .lx-ic:first-child { color: var(--apm-orange); }
details.lx-filtres-bulle > .menu-plus-liste { left: 50%; right: auto; top: calc(100% + 8px); translate: -50% 0; width: max-content; min-width: 220px; padding: 6px; border-radius: 18px; z-index: 30;
  background: var(--apm-verre); backdrop-filter: blur(30px) saturate(200%); -webkit-backdrop-filter: blur(30px) saturate(200%); box-shadow: var(--apm-liser), var(--apm-ombre-verre); }
details.lx-filtres-bulle[open] > .menu-plus-liste { transform-origin: top center; animation: apm-bulle .5s var(--apm-ressort-vif) both; }
.lx-filtres-bulle-titre { margin: 0; padding: 6px 10px 4px; line-height: 1.45; font-size: 12px; font-weight: 600; color: var(--apm-label3); }
details.lx-filtres-bulle .menu-plus-liste > a.lx-filtre { display: flex; align-items: center; gap: 10px; width: 100%; height: auto; min-height: 34px; padding: 0 10px; border: 0; border-radius: 10px;
  background: none; box-shadow: none; color: var(--apm-label); font-size: 13.5px; font-weight: 400; white-space: nowrap; transition: background-color .12s; }
details.lx-filtres-bulle .menu-plus-liste > a.lx-filtre .lx-compte { margin-left: auto; padding: 0 0 0 14px; min-width: 0; background: none; color: var(--apm-label3); font-size: 13.5px; font-weight: 400; font-variant-numeric: tabular-nums; }
details.lx-filtres-bulle .menu-plus-liste > a.lx-filtre[aria-current="page"]::after { content: ""; flex: none; width: 7px; height: 7px; margin-left: 8px; border-radius: 50%; background: var(--apm-tint); }
details.lx-filtres-bulle .menu-plus-liste > a.lx-filtre:hover { background: var(--apm-tint); color: #fff; }
details.lx-filtres-bulle .menu-plus-liste > a.lx-filtre:hover :is(.lx-compte, .lx-ic) { color: rgba(255, 255, 255, .8); }
details.lx-filtres-bulle .menu-plus-liste > a.lx-filtre .lx-ic { width: 17px; height: 17px; color: var(--apm-label2); }
details.lx-filtres-bulle .menu-plus-liste > hr { margin: 5px 10px; border: 0; border-top: .5px solid var(--apm-sep); }
@keyframes apm-bulle { from { opacity: 0; transform: scale(.5); filter: blur(6px); } 35% { opacity: 1; filter: none; } }

/* Les bulles d'une liste, posées dans la page le temps où elles sont ouvertes (`apple.js`, `ap-bulle-portee`) : la
   pastille qui dit ce qu'elle annonce, l'aide « ? » de la tête, le menu d'un geste ; comme la bulle des maquettes */
.lx-etat-aide { display: inline-block; max-width: 100%; }
.lx-etat-aide > summary { list-style: none; cursor: help; transition: transform .45s var(--apm-ressort-vif); }
.lx-etat-aide > summary::-webkit-details-marker { display: none; }
.lx-etat-aide > summary:active { transform: scale(.94); }
details.lx-etat-aide::details-content, [data-lx-liste] details.lx-gestes-replies::details-content, [data-lx-liste] thead details.bulle::details-content { transition: none !important; }
.ap-bulle-portee { position: fixed; z-index: 3100; min-width: 220px; margin: 0; padding: 6px; border: 0; border-radius: 18px; background: var(--apm-verre);
  backdrop-filter: blur(30px) saturate(200%); -webkit-backdrop-filter: blur(30px) saturate(200%); box-shadow: var(--apm-liser), var(--apm-ombre-verre);
  color: var(--apm-label); font-size: 14px; font-weight: 400; line-height: 1.45; text-align: left; white-space: normal;
  transform-origin: var(--ap-origine, 50% 0); animation: apm-bulle .5s var(--apm-ressort-vif) both; }
.ap-bulle-portee:is(.lx-etat-aide-texte, .bulle-texte) { display: block; inset: auto; width: max-content; max-width: 340px; padding: 12px 14px; font-size: 13px; opacity: 1; visibility: visible; transform: none; }
.ap-bulle-portee:is(.lx-etat-aide-texte, .bulle-texte) strong { display: block; margin-bottom: 3px; font-weight: 600; color: var(--apm-label); }
.ap-bulle-portee:is(.lx-etat-aide-texte, .bulle-texte) p, .ap-bulle-portee.bulle-texte { margin: 0; color: var(--apm-label2); }
.ap-bulle-portee.bulle-texte strong { color: var(--apm-label); }
.lx-gestes.ap-bulle-portee { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
.lx-gestes.ap-bulle-portee::before { content: attr(data-titre); padding: 6px 10px 4px; font-size: 12px; font-weight: 600; color: var(--apm-label3); }
.lx-gestes.ap-bulle-portee .btn.btn { justify-content: flex-start; gap: 10px; width: 100%; height: auto; min-height: 34px; padding: 0 10px; border: 0; border-radius: 10px;
  background: none; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; color: var(--apm-label); font-size: 13.5px; font-weight: 400; text-align: left; transition: background-color .12s; }
.lx-gestes.ap-bulle-portee .btn .lx-ic { width: 17px; height: 17px; padding: 0; background: none; box-shadow: none; color: var(--apm-label2); }
.lx-gestes.ap-bulle-portee .btn.btn:hover { background: var(--apm-tint); color: #fff; }
.lx-gestes.ap-bulle-portee .btn.btn:hover .lx-ic { color: #fff; }

/* La liste compacte en groupes (`liste` et `compact`) : la carte blanche, la tête en petit gris, les groupes sur un gris
   à peine marqué, une personne et son rond gris, la société en vert, les pastilles, le geste en bout de ligne */
.lx-cadre:has([data-lx-liste][data-lx-compact]) { border-radius: 22px; background: #fff; box-shadow: var(--apm-ombre-carte); }
.lx-cadre-corps > .lx-tableau[data-lx-liste][data-lx-compact] { margin-top: 0; }
.lx-tableau[data-lx-liste][data-lx-compact] th { height: 38px; padding: 0 7px; background: none; line-height: 1.45; font-size: 12px; font-weight: 600; letter-spacing: -.006em; text-transform: none; color: var(--apm-label3); }
.lx-tableau[data-lx-liste][data-lx-compact] thead tr > :first-child { padding-left: 16px; }
.lx-tableau[data-lx-liste][data-lx-compact] th:last-child { text-align: right; padding-right: 16px; }
.lx-tableau[data-lx-liste][data-lx-compact] th details.bulle { display: inline-block; vertical-align: middle; }
/* l'aide de la tête de liste s'ouvre au clic, en bulle posée dans la page ; le survol ne l'ouvre plus dans la liste */
.lx-tableau[data-lx-liste][data-lx-compact] th details.bulle .bulle-texte { display: none; }
.lx-tableau[data-lx-liste][data-lx-compact] th details.bulle > summary { display: grid; place-items: center; width: 26px; height: 26px; margin: 0; padding: 0; border: 0; border-radius: 50%;
  background: none; color: transparent; font-size: 0; list-style: none; cursor: pointer; transition: background-color .15s, transform .45s var(--apm-ressort-vif); }
.lx-tableau[data-lx-liste][data-lx-compact] th details.bulle > summary::-webkit-details-marker { display: none; }
.lx-tableau[data-lx-liste][data-lx-compact] th details.bulle > summary::before { content: ""; width: 16px; height: 16px; background: var(--apm-label3); -webkit-mask: var(--apm-question) center / contain no-repeat; mask: var(--apm-question) center / contain no-repeat; }
.lx-tableau[data-lx-liste][data-lx-compact] th details.bulle > summary:hover { background: rgba(0, 0, 0, .06); }
.lx-tableau[data-lx-liste][data-lx-compact] th details.bulle > summary:active { transform: scale(.86); }
/* les groupes */
.lx-tableau[data-lx-liste] tr.lx-groupe { scroll-margin-top: 70px; }
.lx-tableau[data-lx-liste] tr.lx-groupe > td { height: 44px; padding: 0 16px; background: #fcfcfd; border: 0; box-shadow: inset 0 .5px 0 var(--apm-sep); font-size: 14px; font-weight: 400; }
.lx-tableau[data-lx-liste] tbody tr.lx-groupe:first-child > td { box-shadow: none; }
.lx-tableau[data-lx-liste] tr.lx-groupe:hover > td { background: #fcfcfd; }
.lx-tableau[data-lx-liste] tr.lx-groupe > td::after, .lx-tableau[data-lx-liste] tr.lx-groupe + tr > td::after { content: none; }
.lx-tableau[data-lx-liste] tr.lx-groupe + tr > td { box-shadow: inset 0 .5px 0 var(--apm-sep); }
.lx-tableau[data-lx-liste] tr.lx-groupe .lx-compte { display: inline-block; min-width: 20px; height: 18px; margin-left: 8px; padding: 0 6px; border-radius: 9px; background: var(--apm-fill2);
  font-size: 11px; font-weight: 600; line-height: 18px; color: var(--apm-label2); text-align: center; vertical-align: 1px; }
.lx-tableau[data-lx-liste] tr.lx-groupe .lx-lien { margin-left: 8px; padding: 0 4px; font-size: 13px; font-weight: 500; color: var(--apm-tint); text-decoration: none; }
.lx-tableau[data-lx-liste] tr.lx-groupe .lx-lien::before, .lx-tableau[data-lx-liste] tr.lx-groupe .lx-lien::after { content: none; }
.lx-tableau[data-lx-liste] tr.lx-groupe .lx-lien:hover { color: var(--apm-tint2); }
/* une pastille, comme `.etat` des maquettes : rouge, orange, gris, et son point */
.lx-tableau[data-lx-liste][data-lx-compact] .lx-etat { display: inline-flex; align-items: center; gap: 6px; min-height: 22px; height: auto; padding: 0 9px; border-radius: 999px;
  font-size: 12px; font-weight: 500; line-height: 1.45; vertical-align: middle; }
.lx-tableau[data-lx-liste][data-lx-compact] .lx-etat::before { content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: 1; -webkit-mask: none; mask: none; }
.lx-tableau[data-lx-liste][data-lx-compact] .lx-etat-rouge { background: rgba(229, 55, 44, .1); color: var(--apm-rouge); }
.lx-tableau[data-lx-liste][data-lx-compact] .lx-etat-ambre { background: var(--apm-orange-clair); color: var(--apm-orange-encre); }
.lx-tableau[data-lx-liste][data-lx-compact] .lx-etat-gris { background: var(--apm-fill2); color: var(--apm-label2); }
/* les lignes */
.lx-tableau[data-lx-liste][data-lx-compact] :is(td, th) { white-space: normal; }
.lx-tableau[data-lx-liste][data-lx-compact] td { height: 62px; padding: 10px 7px; font-size: 13.5px; font-weight: 400; line-height: 1.45; color: var(--apm-label); }
.lx-tableau[data-lx-liste][data-lx-compact] tbody tr:hover td { background: rgba(0, 0, 0, .018); }
.lx-tableau[data-lx-liste][data-lx-compact] tbody tr[data-lx-ligne] > td:first-child { padding-left: 16px; }
.lx-tableau[data-lx-liste][data-lx-compact] tbody tr[data-lx-ligne] > td:last-child { padding-right: 16px; }
/* les colonnes de la maquette (1,45 · 0,95 · 1,15 · 1 et 168 px pour le geste, 14 entre elles, 16 aux bords) */
.lx-tableau[data-lx-liste][data-lx-compact] :is(td, th) { box-sizing: border-box; }
@container lx-tableau (min-width: 701px) {
  /* « Préparer la décision » mesure 173 : dans la maquette il dépasse de 5 sa colonne de 168 ; ici il y tient */
  .lx-tableau[data-lx-liste][data-lx-compact] th[data-lx-col="geste"] { width: 196px; }
}
@container lx-tableau (min-width: 1100px) {
  /* un tableau ne prend pas de calc() mêlant % et px dans ses cases : les parts, lues sur la liste de 1144 de la
     maquette (personne 283, société 185, mandat 224, chacune avec ses marges) ; plus étroite, la liste partage la place
     à parts égales, pour que la pièce d'identité garde la sienne */
  .lx-tableau[data-lx-liste][data-lx-compact] th[data-lx-col="personne"] { width: 26.75%; }
  .lx-tableau[data-lx-liste][data-lx-compact] th[data-lx-col="societe"] { width: 17.43%; }
  .lx-tableau[data-lx-liste][data-lx-compact] th[data-lx-col="mandat"] { width: 20.84%; }
}
.lx-tableau[data-lx-liste][data-lx-compact] tbody tr + tr > td:first-child::after { left: 60px; border-top-color: var(--apm-sep); }
.lx-tableau[data-lx-liste][data-lx-compact] td.lx-titre-ligne .lx-cellule:not(:has(> .lx-coche)) { grid-template-columns: auto minmax(0, 1fr); column-gap: 12px; row-gap: 0; }
.lx-tableau[data-lx-liste][data-lx-compact] td.lx-titre-ligne .lx-cellule:not(:has(> .lx-coche)) > :is(.lx-valeur-et-sous, .lx-sous) { grid-column: 2; }
.lx-tableau[data-lx-liste][data-lx-compact] td.lx-titre-ligne .lx-cellule:not(:has(> .lx-coche)) { grid-template-rows: auto; }
.lx-tableau[data-lx-liste][data-lx-compact] td.lx-titre-ligne .lx-cellule:not(:has(> .lx-coche)) > :is(.lx-avatar, .lx-valeur-et-sous) { grid-row: 1; align-self: center; }
.lx-tableau[data-lx-liste][data-lx-compact] td.lx-titre-ligne .lx-cellule > .lx-avatar { width: 32px; height: 32px; font-size: 11.5px; font-weight: 600; background: var(--lx-initiales); color: #fff; }
.lx-tableau[data-lx-liste][data-lx-compact] td.lx-titre-ligne .lx-cellule > .lx-avatar.lx-logo { border-radius: 10px; font-weight: 700; }
.lx-tableau[data-lx-liste][data-lx-compact] td.lx-titre-ligne .lx-valeur-et-sous { display: flex; flex-direction: column; min-width: 0; }
.lx-tableau[data-lx-liste][data-lx-compact] td.lx-titre-ligne :is(.lx-valeur, .lx-lien-ligne) { display: block; font-size: 14px; font-weight: 600; line-height: 1.45; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--apm-label); }
.lx-tableau[data-lx-liste][data-lx-compact] td.lx-titre-ligne .lx-sous { height: auto; margin: 1px 0 0; padding: 0; border-radius: 0; background: none; font-size: 12px; font-weight: 400; line-height: 1.45; color: var(--apm-label3); }
.lx-tableau[data-lx-liste][data-lx-compact] td.lx-titre-ligne { cursor: pointer; }
.lx-tableau[data-lx-liste][data-lx-compact] td:not(.lx-titre-ligne) .lx-cellule { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 0; }
.lx-tableau[data-lx-liste][data-lx-compact] td:not(.lx-titre-ligne) .lx-cellule > :is(.lx-valeur-et-sous, .lx-sous) { flex: 0 0 100%; min-width: 0; margin: 0; }
.lx-tableau[data-lx-liste][data-lx-compact] td:not(.lx-titre-ligne) .lx-cellule > .lx-valeur-et-sous { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lx-tableau[data-lx-liste][data-lx-compact] td:not(.lx-titre-ligne) .lx-sous { margin-top: 1px; font-size: 12px; line-height: 1.45; color: var(--apm-label3); }
.lx-tableau[data-lx-liste][data-lx-compact] td:not(.lx-titre-ligne) .lx-cellule > .lx-valeur-et-sous > .lx-lien-ligne { font-size: 14px; font-weight: 500; color: var(--apm-tint); text-decoration: none; }
.lx-tableau[data-lx-liste][data-lx-compact] td:not(.lx-titre-ligne) .lx-cellule > .lx-valeur-et-sous > .lx-lien-ligne:hover { color: var(--apm-tint2); text-decoration: underline; text-underline-offset: 2px; }
.lx-tableau[data-lx-liste][data-lx-compact] .lx-cellule > .lx-etat-aide { order: -1; }
.lx-tableau[data-lx-liste][data-lx-compact] .lx-cellule > .lx-manque-bloc { margin-top: 2px; margin-right: 6px; }
.lx-tableau[data-lx-liste][data-lx-compact] .lx-cellule > :is(.lx-valeur-et-sous, .lx-etat-aide) ~ .lx-manque-bloc { margin-top: 6px; }
/* une colonne étroite : la pastille passe à la ligne plutôt que de couvrir sa voisine */
.lx-tableau[data-lx-liste][data-lx-compact] td:not(.lx-titre-ligne) .lx-etat { max-width: 100%; white-space: normal; }
/* le geste en bout de ligne : un bouton de verre, son chevron ; « Décision en préparation » en lien vert et son chevron */
.lx-tableau[data-lx-liste][data-lx-compact] td:last-child .lx-cellule { justify-content: flex-end; }
.lx-tableau[data-lx-liste][data-lx-compact] .lx-gestes-replies > summary.btn.btn.btn, .lx-tableau[data-lx-liste][data-lx-compact] td:last-child .lx-gestes > .btn.btn.btn { height: 30px; padding: 0 13px; font-size: 13px; color: var(--apm-label); }
.lx-tableau[data-lx-liste][data-lx-compact] td:last-child .lx-gestes > .btn.btn .lx-ic { width: 17px; height: 17px; padding: 0; border-radius: 0; background: none; box-shadow: none; color: currentColor; }
.lx-tableau[data-lx-liste][data-lx-compact] .lx-gestes-replies > summary.btn::after { width: 17px; height: 17px; margin: 0; border: 0; transform: none; opacity: 1; background: currentColor;
  -webkit-mask: var(--apm-bas) center / contain no-repeat; mask: var(--apm-bas) center / contain no-repeat; }
.lx-tableau[data-lx-liste][data-lx-compact] td:last-child .lx-cellule > .lx-valeur-et-sous > .lx-lien-ligne { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 500; }
.lx-tableau[data-lx-liste][data-lx-compact] td:last-child .lx-cellule > .lx-valeur-et-sous > .lx-lien-ligne::after { content: ""; width: 13px; height: 13px; background: currentColor;
  -webkit-mask: var(--apm-chevron) center / contain no-repeat; mask: var(--apm-chevron) center / contain no-repeat; }
.lx-tableau[data-lx-liste][data-lx-compact] td:last-child .lx-cellule > .lx-valeur-et-sous > .lx-lien-ligne:hover { text-decoration: none; }
/* la tête gardée quand un filtre ne laisse rien, et ce qui le dit */
.lx-tableau[data-lx-liste][data-lx-compact] .lx-vide { padding: 50px 20px; border: 0; background: none; text-align: center; color: var(--apm-label2); font-size: 14px; }
.lx-tableau[data-lx-liste][data-lx-compact] .lx-vide p { margin: 0 auto; }
.lx-tableau[data-lx-liste][data-lx-compact] .lx-vide p::first-line { font-size: 17px; font-weight: 600; color: var(--apm-label); }
.lx-tableau[data-lx-liste][data-lx-compact] .lx-vide .lx-sous { display: block; margin-top: 4px; font-size: 14px; color: var(--apm-label2); }

/* Ce qui manque : une pastille grise, le « + » vert (le dépôt en gris), qui devient sa ou ses cases sur place */
:is(.lx-tableau[data-lx-liste], .lx-tableau[data-lx-groupee]) .lx-manque { display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 10px 0 7px; border: 0; border-radius: 999px;
  background: var(--apm-fill2); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .06); color: var(--apm-label); font-size: 12.5px; font-weight: 400; white-space: nowrap; text-decoration: none;
  transition: background-color .15s, transform .45s var(--apm-ressort-vif); }
:is(.lx-tableau[data-lx-liste], .lx-tableau[data-lx-groupee]) .lx-manque[hidden] { display: none; }
:is(.lx-tableau[data-lx-liste], .lx-tableau[data-lx-groupee]) .lx-manque .lx-ic { width: 13px; height: 13px; stroke-width: 2.2; color: var(--apm-tint); }
:is(.lx-tableau[data-lx-liste], .lx-tableau[data-lx-groupee]) a.lx-manque .lx-ic { color: var(--apm-label2); }
:is(.lx-tableau[data-lx-liste], .lx-tableau[data-lx-groupee]) .lx-manque:hover { background: var(--apm-tint-clair); color: var(--apm-label); }
:is(.lx-tableau[data-lx-liste], .lx-tableau[data-lx-groupee]) .lx-manque:active { transform: scale(.92); }
:is(.lx-tableau[data-lx-liste], .lx-tableau[data-lx-groupee]) .lx-manque-bloc:has(> .lx-manque-case:not([hidden])) { display: flex; flex: 1 1 100%; width: 100%; }
:is(.lx-tableau[data-lx-liste], .lx-tableau[data-lx-groupee]) .lx-manque-case:not([hidden]) { display: flex; flex-direction: column; align-items: stretch; gap: 6px; width: 100%;
  transform-origin: 0 50%; animation: apm-ouvre .5s var(--apm-ressort) both; }
:is(.lx-tableau[data-lx-liste], .lx-tableau[data-lx-groupee]) .lx-manque-case :is(input.lx-case, select.lx-case, .lx-choix-bouton) { width: 100%; height: 32px; padding: 0 10px; border: 0; border-radius: 9px;
  background: var(--apm-fill2); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08); font-size: 13px; color: var(--apm-label); outline: none; }
:is(.lx-tableau[data-lx-liste], .lx-tableau[data-lx-groupee]) .lx-manque-case :is(input.lx-case, select.lx-case, .lx-choix-bouton):focus { background: #fff; box-shadow: 0 0 0 1px var(--apm-tint), 0 0 0 4px var(--apm-tint-clair); }
@keyframes apm-ouvre { from { opacity: 0; transform: scale(.7, .6); } }

/* La barre d'enregistrement : du verre qui monte en bas de l'écran quand une case a changé ; le nombre en gras */
.lx-tableau[data-lx-liste] .lx-enregistrer { position: sticky; bottom: 24px; z-index: 40; display: flex; flex-wrap: nowrap; align-items: center; gap: 10px; width: max-content; max-width: calc(100% - 32px);
  height: 52px; margin: 12px auto; padding: 0 8px 0 18px; border: 0; border-radius: 999px; background: rgba(255, 255, 255, .74);
  backdrop-filter: var(--apm-flou); -webkit-backdrop-filter: var(--apm-flou); box-shadow: var(--apm-liser), 0 0 0 .5px rgba(0, 0, 0, .1), 0 20px 50px -14px rgba(0, 0, 0, .35);
  color: var(--apm-label); font-size: 14px; white-space: nowrap; animation: apm-barre .6s var(--apm-ressort-vif) both; }
.lx-tableau[data-lx-liste] .lx-enregistrer[hidden] { display: none; }
.lx-enregistrer .lx-enregistrer-mot b { font-weight: 700; font-variant-numeric: tabular-nums; }
.lx-tableau[data-lx-liste] .lx-enregistrer .lx-boutons { display: flex; gap: 10px; margin: 0; }
@keyframes apm-barre { from { opacity: 0; transform: translateY(100px) scale(.9); } }

/* Le mot qui confirme, comme le « toast » des maquettes : du verre sombre, la coche verte, il monte en ressort, reste,
   et redescend (les messages brefs, `base.html`) ; centré sur la page, à droite du menu (`--menu`) */
.lx-brefs { left: calc(50% + var(--menu, 0px) / 2); bottom: 26px; transform: translateX(-50%); gap: 8px; }
.lx-brefs .lx-bref { display: flex; align-items: center; gap: 9px; height: 44px; padding: 0 18px 0 12px; border-radius: 999px; background: rgba(30, 30, 32, .8);
  backdrop-filter: blur(20px) saturate(180%); -webkit-backdrop-filter: blur(20px) saturate(180%); color: #fff; font-size: 13.5px; font-weight: 500;
  box-shadow: 0 12px 34px -10px rgba(0, 0, 0, .45), inset 0 0 0 .5px rgba(255, 255, 255, .12); animation: apm-toast 2.8s linear both; }
.lx-brefs .lx-bref::before { content: ""; flex: none; width: 18px; height: 18px; border-radius: 50%; background: #34c759 var(--apm-coche) center / 11px 11px no-repeat; }
@keyframes apm-toast { 0% { transform: translateY(90px); animation-timing-function: var(--apm-ressort-vif); } 21%, 79% { transform: none; animation-timing-function: var(--apm-ressort-vif); } 100% { transform: translateY(90px); } }

/* La liste groupée des Réglages (`groupee`) : le titre du groupe en petit au-dessus de sa carte blanche, une ligne par
   information, le libellé à gauche, la valeur à droite ; à toute largeur (elle ne se replie pas en cartes) */
.lx-tableau[data-lx-groupee] { container-type: normal; }
.lx-tableau[data-lx-groupee] .lx-tableau-defile { overflow: visible; border-radius: 0; background: none; box-shadow: none; }
.lx-tableau[data-lx-groupee] :is(table, tbody) { display: block; width: 100%; }
.lx-tableau[data-lx-groupee] thead { display: none; }
.lx-tableau[data-lx-groupee] tr { display: flex; align-items: center; gap: 14px; }
.lx-tableau[data-lx-groupee] tr > td { display: block; height: auto; padding: 0; border: 0; background: none; box-shadow: none; }
.lx-tableau[data-lx-groupee] tbody tr:hover > td, .lx-tableau[data-lx-groupee] tbody tr:active > td { background: none; }
.lx-tableau[data-lx-groupee] tr.lx-groupe > td { padding: 16px 6px 6px; font-size: 12px; font-weight: 600; line-height: 1.45; color: var(--apm-label3); }
.lx-tableau[data-lx-groupee] tr.lx-groupe .lx-compte { display: none; }
.lx-tableau[data-lx-groupee] tr:not(.lx-groupe) { min-height: 46px; padding: 10px 16px; background: rgba(255, 255, 255, .8); font-size: 14px; line-height: 1.45; }
.lx-tableau[data-lx-groupee] tr:not(.lx-groupe) + tr:not(.lx-groupe) { box-shadow: inset 0 .5px 0 var(--apm-sep); }
.lx-tableau[data-lx-groupee] :is(tr.lx-groupe, tbody > :first-child) + tr:not(.lx-groupe), .lx-tableau[data-lx-groupee] tbody > tr:not(.lx-groupe):first-child { border-top-left-radius: 18px; border-top-right-radius: 18px; }
.lx-tableau[data-lx-groupee] tr:not(.lx-groupe):is(:last-child, :has(+ tr.lx-groupe)) { border-bottom-left-radius: 18px; border-bottom-right-radius: 18px; }
.lx-tableau[data-lx-groupee] tr:not(.lx-groupe) > td:first-child { flex: none; max-width: 50%; color: var(--apm-label); }
.lx-tableau[data-lx-groupee] tr:not(.lx-groupe) > td:last-child:not(:first-child) { flex: 0 1 auto; min-width: 0; margin-left: auto; text-align: right; color: var(--apm-label2); }
.lx-tableau[data-lx-groupee] tr:not(.lx-groupe) > td:last-child:not(:first-child) .lx-cellule { justify-content: flex-end; flex-wrap: wrap; gap: 6px; }
.lx-tableau[data-lx-groupee] td:first-child .lx-valeur { font-weight: 400; }
.lx-tableau[data-lx-groupee] .lx-sous { display: block; font-size: 12px; line-height: 1.45; color: var(--apm-label3); white-space: normal; }
.lx-tableau[data-lx-groupee] .lx-etat { display: inline-flex; align-items: center; gap: 6px; height: 22px; padding: 0 9px; border-radius: 999px; font-size: 12px; font-weight: 500; }
.lx-tableau[data-lx-groupee] .lx-etat::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.lx-tableau[data-lx-groupee] .lx-etat-rouge { background: rgba(229, 55, 44, .1); color: var(--apm-rouge); }
.lx-tableau[data-lx-groupee] .lx-etat-ambre { background: var(--apm-orange-clair); color: var(--apm-orange-encre); }
.lx-tableau[data-lx-groupee] .lx-manque-case:not([hidden]) { min-width: 220px; }
.lx-tableau[data-lx-groupee] tr.lx-alerte > td { box-shadow: none; }
/* ce que dit une échéance : son icône dans son carré, le libellé en gras, le message dessous */
.lx-tableau[data-lx-groupee] tr:not(.lx-groupe):has(> td:only-child .lx-sous) { align-items: flex-start; gap: 12px; padding: 12px 16px; font-size: 13px; }
.lx-tableau[data-lx-groupee] tr:not(.lx-groupe) > td:only-child { flex: 1 1 auto; max-width: none; }
.lx-tableau[data-lx-groupee] tr:not(.lx-groupe) > td:only-child .lx-valeur { font-weight: 600; }
.lx-tableau[data-lx-groupee] tr:not(.lx-groupe) > td:only-child .lx-sous { margin-top: 2px; font-size: 13px; color: var(--apm-label2); }
.lx-tableau[data-lx-groupee] tr:not(.lx-groupe):has(> td:only-child .lx-sous)::before { content: ""; flex: none; width: 28px; height: 28px; border-radius: 9px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f28a00' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M7 3.5h10M7 20.5h10M8 3.5c0 4 4 5 4 8.5s-4 4.5-4 8.5M16 3.5c0 4-4 5-4 8.5s4 4.5 4 8.5'/%3E%3C/svg%3E") center / 15px 15px no-repeat, var(--apm-orange-clair); }
.lx-tableau[data-lx-groupee] tr.lx-alerte:has(> td:only-child .lx-sous)::before {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e5372c' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4 3 19.5h18z'/%3E%3Cpath d='M12 10v4.5M12 17.3v.2'/%3E%3C/svg%3E") center / 15px 15px no-repeat, rgba(229, 55, 44, .1); }

/* Le tiroir d'une personne, la feuille des maquettes : détachée des bords de 12, 440 de large, ses angles de 28 ; le
   voile laisse la page lisible ; la croix ronde ; les initiales en grand ; les groupes ; le scan ; le pied */
.lx-voile:has(+ .lx-tiroir) { background: rgba(0, 0, 0, .1); backdrop-filter: none; -webkit-backdrop-filter: none; }
.lx-tiroir { top: 12px; right: 12px; bottom: 12px; width: min(440px, calc(100vw - 24px)); border-radius: 28px; background: var(--apm-verre-epais);
  backdrop-filter: var(--apm-flou); -webkit-backdrop-filter: var(--apm-flou); box-shadow: var(--apm-liser), 0 0 0 .5px rgba(0, 0, 0, .08), 0 30px 80px -24px rgba(0, 0, 0, .35); }
.lx-tiroir > header { display: flex; align-items: center; gap: 12px; padding: 18px 18px 10px 22px; border: 0; background: none; }
.lx-tiroir > header .lx-fermer { display: grid; place-items: center; flex: none; width: 32px; height: 32px; margin-left: auto; padding: 0; border: 0; border-radius: 50%; background: none; box-shadow: none;
  color: var(--apm-label); font-size: 0; text-decoration: none; transition: background-color .15s, transform .45s var(--apm-ressort-vif); }
.lx-tiroir > header .lx-fermer .lx-ic { width: 17px; height: 17px; stroke-width: 1.7; }
.lx-tiroir > header .lx-fermer:hover { background: rgba(0, 0, 0, .06); }
.lx-tiroir > header .lx-fermer:active { transform: scale(.86); }
.lx-tiroir:has(.lx-tiroir-carte) > .lx-tiroir-corps { gap: 0; padding: 4px 18px 0; }
/* le corps d'une feuille défile ; ce qu'il contient garde sa hauteur : une liste groupée qui coupe ce qui dépasse
   (ses angles arrondis) se faisait écraser à quelques lignes (la fiche d'une personne, Othmane, 2026-10-30) */
.lx-tiroir-corps > * { flex-shrink: 0; }
.lx-tiroir:has(.lx-tiroir-carte) > .lx-tiroir-corps > * { animation: apm-monte .55s var(--apm-ressort) both; }
.lx-tiroir-carte { display: flex; align-items: center; gap: 14px; padding: 0 4px 6px; }
.lx-tiroir-marque { display: grid; place-items: center; flex: none; width: 58px; height: 58px; border-radius: 50%; background: var(--lx-initiales); color: #fff; font-size: 19px; font-weight: 600; }
.lx-tiroir-marque-carre { border-radius: 17px; font-weight: 700; }
.lx-tiroir-carte h3 { margin: 0; font-size: 18px; font-weight: 700; letter-spacing: -.01em; line-height: 1.25; }
.lx-tiroir-carte .lx-sous { margin: 2px 0 0; font-size: 12.5px; line-height: 1.45; color: var(--apm-label2); }
.lx-tiroir-formulaire { display: flex; flex-direction: column; flex: 1; min-height: 100%; }
.lx-tiroir-formulaire > .lx-tableau[data-lx-groupee] tr.lx-groupe > td { padding-top: 16px; }
/* le scan, une ligne du groupe Pièce d'identité : la vignette, « Ouvrir le scan » et son nom, le chevron */
.lx-scan-ligne { display: flex; align-items: center; gap: 14px; min-height: 46px; padding: 10px 16px; border-radius: 0 0 18px 18px; background: rgba(255, 255, 255, .8);
  box-shadow: inset 0 .5px 0 var(--apm-sep); color: var(--apm-label); font-size: 14px; text-decoration: none; cursor: pointer; transition: background-color .15s; }
.lx-scan-ligne:hover { background: rgba(250, 250, 250, .9); color: var(--apm-label); text-decoration: none; }
.lx-tiroir-formulaire > .lx-tableau:has(+ .lx-scan-ligne) tbody > tr:last-child { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.lx-scan-vignette { display: grid; place-items: center; flex: none; width: 34px; height: 42px; border-radius: 6px; background: linear-gradient(180deg, #fff, #f3f3f5);
  box-shadow: 0 0 0 .5px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .06); font-size: 8.5px; font-weight: 700; color: var(--apm-bleu); }
.lx-scan-mot small { display: block; font-size: 12px; color: var(--apm-label3); }
.lx-scan-ligne .lx-ic { width: 14px; height: 14px; margin-left: auto; color: #c4c4c7; }
/* le pied : ce qui est modifié à gauche, « Ouvrir la fiche », « Déposer sa CIN », puis « Enregistrer » */
.lx-tiroir-formulaire > .lx-tiroir-pied { position: sticky; bottom: 0; z-index: 2; display: flex; align-items: center; gap: 10px; margin: auto -18px 0; padding: 12px 18px 16px;
  border-top: .5px solid var(--apm-sep); background: color-mix(in srgb, var(--apm-verre-epais) 60%, transparent); backdrop-filter: var(--apm-flou); -webkit-backdrop-filter: var(--apm-flou); }
.lx-tiroir-formulaire > .lx-tableau:last-of-type, .lx-tiroir-formulaire > .lx-scan-ligne { margin-bottom: 22px; }
.lx-tiroir-pied::before { content: ""; flex: 1; order: 0; }
.lx-tiroir-pied:has(.lx-enregistrer:not([hidden]))::before { content: none; }
.lx-tiroir-pied .lx-enregistrer { display: contents; }
.lx-tiroir-pied .lx-enregistrer[hidden] { display: none; }
.lx-tiroir-pied .lx-enregistrer-mot { order: 0; flex: 1; min-width: 0; font-size: 13px; color: var(--apm-label2); }
.lx-tiroir-pied .lx-enregistrer-mot b { font-weight: 400; }
/* dans le pied, ce qui est modifié se dit court (« 1 information modifiée ») */
.lx-tiroir-pied .lx-enregistrer-ou { display: none !important; }
/* une modification en cours : ce qui est modifié, « Annuler » et « Enregistrer » sur la première rangée, les gestes de
   la personne dessous, à droite (les quatre boutons ne tiennent pas sur une ligne de 440) */
.lx-tiroir-formulaire > .lx-tiroir-pied { flex-wrap: wrap; row-gap: 10px; }
.lx-tiroir-pied .lx-enregistrer-mot { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lx-tiroir-pied:has(.lx-enregistrer:not([hidden]))::after { content: ""; order: 4; flex: 0 0 100%; height: 0; }
.lx-tiroir-pied:has(.lx-enregistrer:not([hidden])) > a.btn { order: 5; }
.lx-tiroir-pied:has(.lx-enregistrer:not([hidden])) > a.btn:first-of-type { margin-left: auto; }
.lx-tiroir-pied > a.btn { order: 1; }
.lx-tiroir-pied .lx-enregistrer .lx-boutons { display: contents; }
.lx-tiroir-pied .lx-enregistrer [data-lx-annuler] { order: 2; }
.lx-tiroir-pied .lx-enregistrer .btn-plein { order: 3; }
@keyframes apm-monte { from { opacity: 0; transform: translateY(12px); } }

/* La fenêtre « Nouvelle opération », la feuille du milieu des maquettes : 720 de large, la page floutée derrière, la
   croix ronde ; les trois pas ; la décision à préparer ; les opérations en tuiles ; les documents en bascules */
.tiroir-refonte.tiroir-fenetre:is(:has(.lx-nouvelle), :has([data-lx-feuille])) { top: 6vh; left: calc(50% + var(--menu, 0px) / 2); width: min(720px, 94vw); max-height: 88vh; border: 0; border-radius: 28px; background: var(--apm-verre-epais);
  backdrop-filter: var(--apm-flou); -webkit-backdrop-filter: var(--apm-flou); box-shadow: var(--apm-liser), 0 0 0 .5px rgba(0, 0, 0, .08), 0 30px 80px -24px rgba(0, 0, 0, .35); }
.tiroir-voile:has(+ .tiroir-refonte.tiroir-fenetre:not([hidden]) :is(.lx-nouvelle, [data-lx-feuille])) { background: rgba(242, 242, 247, .35); backdrop-filter: blur(8px) saturate(140%); -webkit-backdrop-filter: blur(8px) saturate(140%); }
.tiroir-refonte.tiroir-fenetre:is(:has(.lx-nouvelle), :has([data-lx-feuille])) > header { align-items: center; gap: 12px; padding: 18px 18px 10px 22px; border: 0; background: none; }
.tiroir-refonte.tiroir-fenetre:is(:has(.lx-nouvelle), :has([data-lx-feuille])) > header h2 { margin: 0; font-size: 21px; font-weight: 700; letter-spacing: -.02em; }
.tiroir-refonte.tiroir-fenetre:is(:has(.lx-nouvelle), :has([data-lx-feuille])) > header p { margin: 2px 0 0; font-size: 12.5px; color: var(--apm-label2); }
.tiroir-refonte.tiroir-fenetre:is(:has(.lx-nouvelle), :has([data-lx-feuille])) > header [data-pleine-page] { display: none; }
.tiroir-refonte.tiroir-fenetre:is(:has(.lx-nouvelle), :has([data-lx-feuille])) > header .fermer { width: 32px; height: 32px; margin-left: auto; border: 0; border-radius: 50%; background: none; box-shadow: none; color: transparent; font-size: 0;
  transition: background-color .15s, transform .45s var(--apm-ressort-vif); }
.tiroir-refonte.tiroir-fenetre:is(:has(.lx-nouvelle), :has([data-lx-feuille])) > header .fermer::before { content: ""; display: block; width: 17px; height: 17px; margin: auto; background: var(--apm-label);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M7 7l10 10M17 7 7 17'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M7 7l10 10M17 7 7 17'/%3E%3C/svg%3E") center / contain no-repeat; }
.tiroir-refonte.tiroir-fenetre:is(:has(.lx-nouvelle), :has([data-lx-feuille])) > header .fermer:hover { background: rgba(0, 0, 0, .06); }
.tiroir-refonte.tiroir-fenetre:is(:has(.lx-nouvelle), :has([data-lx-feuille])) > header .fermer:active { transform: scale(.86); }
.tiroir-refonte.tiroir-fenetre:is(:has(.lx-nouvelle), :has([data-lx-feuille])) > .corps { padding: 0; background: none; }
.lx-nouvelle { display: block; max-width: none; padding: 0 18px 22px; font-size: 14px; line-height: 1.45; }
.tiroir-fenetre :is(.lx-nouvelle, [data-lx-feuille]) > .lx-tete { display: none; }
.lx-nouvelle > * { animation: apm-monte .55s var(--apm-ressort) both; }
.lx-nouvelle > :nth-child(3) { animation-delay: .04s; } .lx-nouvelle > :nth-child(4) { animation-delay: .08s; } .lx-nouvelle > :nth-child(5) { animation-delay: .12s; } .lx-nouvelle > :nth-child(n+6) { animation-delay: .16s; }
.lx-etapes { display: flex; align-items: center; gap: 6px; margin: 0 -18px; padding: 0 22px 8px; font-size: 12.5px; color: var(--apm-label3); }
.lx-etapes b { font-weight: 600; color: var(--apm-label); }
.lx-etapes .lx-etape-faite { color: var(--apm-tint); }
.lx-etapes .lx-ic { width: 13px; height: 13px; }
.lx-pour { display: flex; align-items: flex-start; gap: 12px; margin-top: 4px; padding: 14px 16px; border-radius: 18px; background: rgba(255, 255, 255, .8); box-shadow: var(--apm-ombre-carte); }
.lx-pour-ic { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 10px; background: var(--apm-orange-clair); color: var(--apm-orange); }
.lx-pour-echue .lx-pour-ic { background: rgba(229, 55, 44, .1); color: var(--apm-rouge); }
.lx-pour-ic .lx-ic { width: 17px; height: 17px; }
.lx-pour strong { display: block; font-weight: 600; }
.lx-pour p { margin: 3px 0 0; font-size: 12.5px; color: var(--apm-label2); }
.lx-pour .lx-etat { display: inline-flex; align-items: center; gap: 6px; height: 22px; margin-top: 6px; padding: 0 9px; border-radius: 999px; font-size: 12px; font-weight: 500; }
.lx-pour .lx-etat::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.lx-pour .lx-etat-rouge { background: rgba(229, 55, 44, .1); color: var(--apm-rouge); }
.lx-pour .lx-etat-ambre { background: var(--apm-orange-clair); color: var(--apm-orange-encre); }
.lx-nouvelle .lx-titre-groupe, [data-lx-feuille] .lx-titre-groupe { margin: 16px 6px 6px; font-size: 12px; font-weight: 600; color: var(--apm-label3); }
.lx-grille-op { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.lx-op { display: flex; align-items: center; gap: 10px; padding: 12px; border-radius: 16px; background: rgba(255, 255, 255, .8); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .06);
  color: var(--apm-label); font-size: 13px; font-weight: 500; line-height: 1.35; text-align: left; text-decoration: none;
  transition: transform .5s var(--apm-ressort-vif), box-shadow .2s, background-color .2s; }
.lx-op:hover { background: #fff; color: var(--apm-label); text-decoration: none; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .06), 0 8px 20px -10px rgba(0, 0, 0, .2); transform: translateY(-1px); }
.lx-op:active { transform: scale(.95); background: var(--apm-tint); color: #fff; }
.lx-op-ic { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 10px; background: var(--apm-tint-clair); color: var(--apm-tint); }
.lx-op:active .lx-op-ic { background: rgba(255, 255, 255, .2); color: #fff; }
.lx-op-ic .lx-ic { width: 17px; height: 17px; }
.lx-autres-op { margin-top: 12px; }
.lx-autres-op > summary { margin: 0 6px; font-size: 13px; color: var(--apm-tint); }
.lx-autres-op > .lx-note { margin: 6px 6px 8px; font-size: 12.5px; color: var(--apm-label3); }
/* les documents en bascules, comme les Réglages ; la note ; le pied */
.lx-documents .lx-coches { display: block; margin: 0; padding: 0; border: 0; border-radius: 18px; overflow: hidden; background: rgba(255, 255, 255, .8); box-shadow: var(--apm-ombre-carte); }
.lx-documents .lx-coches label { position: relative; display: flex; align-items: center; gap: 14px; min-height: 46px; margin: 0; padding: 10px 16px; border: 0; border-radius: 0; background: none; box-shadow: none;
  font-size: 14px; cursor: pointer; animation: none; transition: background-color .15s; }
.lx-documents .lx-coches label + label { box-shadow: inset 0 .5px 0 var(--apm-sep); }
.lx-documents .lx-coches label:hover, .lx-documents .lx-coches label:has(input:checked) { background: rgba(0, 0, 0, .025); box-shadow: none; }
.lx-documents .lx-coches label + label:hover, .lx-documents .lx-coches label + label:has(input:checked) { box-shadow: inset 0 .5px 0 var(--apm-sep); }
.lx-documents .lx-coches label:has(input:checked):not(:hover) { background: none; }
.lx-documents .lx-coches label > span { order: 0; flex: 1; }
.lx-documents .lx-coches input { order: 1; appearance: none; -webkit-appearance: none; position: relative; flex: none; width: 46px; height: 28px; margin: 0 0 0 auto; border: 0; border-radius: 14px;
  background: rgba(120, 120, 128, .18); cursor: pointer; transition: background-color .3s; }
.lx-documents .lx-coches input::after { content: ""; position: absolute; top: 2px; left: 2px; width: 24px; height: 24px; border-radius: 12px; background: #fff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .18), 0 0 0 .5px rgba(0, 0, 0, .04); transition: transform .45s var(--apm-ressort-vif), width .2s; }
.lx-documents .lx-coches label:active input::after { width: 30px; }
.lx-documents .lx-coches input:checked { background: #34c759; }
.lx-documents .lx-coches input:checked::after { transform: translateX(18px); }
.lx-documents .lx-coches label:active input:checked::after { transform: translateX(12px); }
.lx-documents .lx-note { padding: 8px 6px 0; font-size: 12.5px; color: var(--apm-label3); }
.lx-documents .lx-pied-fenetre, [data-lx-feuille] .lx-pied-fenetre { position: sticky; bottom: -22px; display: flex; align-items: center; gap: 10px; margin: 14px -18px -22px; padding: 12px 18px 16px;
  border-top: .5px solid var(--apm-sep); background: color-mix(in srgb, var(--apm-verre-epais) 60%, transparent); backdrop-filter: var(--apm-flou); -webkit-backdrop-filter: var(--apm-flou); }
.lx-cochees-compte { flex: 1; font-size: 13px; color: var(--apm-label2); }
.lx-cochees-compte b { font-weight: 400; }
/* le refus, en rouge dans la fenêtre */
:is(.lx-nouvelle, [data-lx-feuille]) .lx-avis-erreur { display: flex; gap: 10px; align-items: flex-start; margin: 4px 0 10px; padding: 12px 14px; border: 0; border-radius: 16px; background: rgba(229, 55, 44, .08); color: #9b1c1c; font-size: 13px; box-shadow: none; }
:is(.lx-nouvelle, [data-lx-feuille]) .lx-avis-erreur::before { content: ""; flex: none; width: 17px; height: 17px; margin-top: 1px; background: var(--apm-rouge);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4 3 19.5h18z'/%3E%3Cpath d='M12 10v4.5M12 17.3v.2'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4 3 19.5h18z'/%3E%3Cpath d='M12 10v4.5M12 17.3v.2'/%3E%3C/svg%3E") center / contain no-repeat; }
:is(.lx-nouvelle, [data-lx-feuille]) .lx-avis-erreur p { margin: 0; padding: 0; text-align: left; }
.lx-avis-titre-dessus { display: block; }
:is(.lx-nouvelle, [data-lx-feuille]) .lx-avis-erreur > :not(p) { display: none; } :is(.lx-nouvelle, [data-lx-feuille]) .lx-avis-erreur strong { display: block; }
/* lancée : la coche qui se trace dans le grand rond vert, « Opération lancée », « Ouvrir le fil » */
.lx-fait { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 46px 20px 36px; text-align: center; }
.lx-fait-rond { display: grid; place-items: center; width: 74px; height: 74px; border-radius: 50%; background: var(--apm-tint); color: #fff; box-shadow: 0 12px 30px -10px rgba(15, 123, 101, .6);
  animation: apm-coche-grand .8s var(--apm-ressort-vif) both; }
.lx-fait-rond .lx-ic { width: 36px; height: 36px; stroke-width: 2.6; stroke-dasharray: 30; stroke-dashoffset: 30; animation: apm-trace .5s .25s var(--apm-doux) forwards; }
.lx-fait > strong { font-size: 20px; font-weight: 700; }
.lx-fait > p { max-width: 46ch; margin: 0; color: var(--apm-label2); }
.lx-fait .lx-boutons { display: flex; gap: 8px; margin-top: 6px; }
@keyframes apm-coche-grand { from { transform: scale(0); } }
@keyframes apm-trace { to { stroke-dashoffset: 0; } }

@media (prefers-reduced-motion: reduce) {
  .lx-outils + .lx-filtres, .ap-bulle-portee, details.lx-filtres-bulle[open] > .menu-plus-liste, :is(.lx-tableau[data-lx-liste], .lx-tableau[data-lx-groupee]) .lx-manque-case:not([hidden]),
  .lx-tableau[data-lx-liste] .lx-enregistrer, .lx-brefs .lx-bref, .lx-tiroir:has(.lx-tiroir-carte) > .lx-tiroir-corps > *, .lx-nouvelle > *, .lx-fait-rond, .lx-fait-rond .lx-ic { animation: none; }
  .lx-fait-rond .lx-ic { stroke-dashoffset: 0; }
}

/* ---------------------------------------------------------------------------
   Lot AP3 · les pièces de la maquette des opérations (`lots/LOT-AP3-operations.md`), communes à toute liste : la
   barre des filtres collée au titre, le filtre en menu, la ligne qui ouvre son panneau, la frise en points, la pointe
   au survol, le panneau qui naît de la ligne au milieu de l'écran. Les valeurs sont celles de la maquette
   (`commun.css`, `operations.html`), relevées au navigateur.
   --------------------------------------------------------------------------- */
:root {
  --ap-label: #1d1d1f; --ap-label2: #6e6e73; --ap-label3: #8e8e93;
  --ap-fill: rgba(120, 120, 128, .12); --ap-fill2: rgba(120, 120, 128, .08);
  --ap-tint: #0f7b65; --ap-tint-clair: rgba(15, 123, 101, .11);
  --ap-orange: #f28a00; --ap-orange-clair: rgba(255, 149, 0, .13); --ap-orange-texte: #a35c00; --ap-rouge: #e5372c;
  --ap-verre-maquette: rgba(255, 255, 255, .6); --ap-flou-maquette: blur(26px) saturate(190%);
  --ap-liser: inset 0 0 0 1px rgba(255, 255, 255, .7), inset 0 1px 0 #fff;
  --ap-ombre-verre: 0 0 0 .5px rgba(0, 0, 0, .08), 0 2px 6px rgba(0, 0, 0, .04), 0 16px 40px -14px rgba(0, 0, 0, .22);
  --ap-ombre-carte: 0 0 0 .5px rgba(0, 0, 0, .05), 0 1px 3px rgba(0, 0, 0, .04);
}

/* Les gestes d'une tête de page : les boutons de la maquette, leur icône à 17 */
main.page .lx-tete .lx-gestes .btn:not(.petit):not(.icone):not(.pilule):not(.mini) { gap: 7px; height: 32px; min-height: 32px; padding: 0 15px; font-size: 13.5px; font-weight: 500; }
main.page .lx-tete .lx-gestes .btn:not(.petit):not(.icone):not(.pilule):not(.mini):not(.btn-plein) { color: var(--ap-label); }
.lx-tete .lx-gestes .btn:not(.petit):not(.btn-plein):not(.btn-nu) { background: rgba(255, 255, 255, .78); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1), inset 0 1px 0 #fff, 0 1px 3px rgba(0, 0, 0, .08); }
.lx-tete .lx-gestes .btn:not(.petit):not(.btn-plein):not(.btn-nu):hover { background: #fff; }
.lx-tete .lx-gestes .btn.btn-plein:not(.petit) { color: #fff; background: linear-gradient(180deg, #1aa688, var(--ap-tint) 60%, #0b6654);
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .15), inset 0 1px 0 rgba(255, 255, 255, .4), inset 0 -1px 1px rgba(0, 0, 0, .12), 0 4px 14px -4px rgba(15, 123, 101, .55); }
.lx-tete .lx-gestes .btn:not(.petit) .lx-ic { width: 17px; height: 17px; margin: 0; }
.lx-tete .lx-gestes .btn:not(.btn-plein) .lx-ic { color: var(--ap-label); }
.lx-tete .lx-sous { color: var(--ap-label2); }

/* La barre des filtres d'une liste : sous le titre, elle reste en haut quand la liste défile */
/* (la page espace ses blocs de 18 ; la maquette met la liste à 12 de ses filtres) */
.lx-outils { position: sticky; top: 12px; z-index: 6; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 -6px; }
.lx-outils > .lx-filtres, .lx-outils > .lx-a-droite > .lx-filtres { margin: 0; }
.lx-outils > .lx-a-droite { margin-left: auto; }
/* Othmane, 2026-11-01 · toute barre qui reste en haut d'une liste (ses filtres, sa recherche) : dès que la liste passe
   dessous, une bande de verre flouté la porte, d'un bord à l'autre de la page, avec son trait fin, comme les barres
   d'Apple, jusqu'au bord de l'écran (la marge du haut de la page comprise) ; au repos, rien. Elle colle un peu plus
   haut (`apple.js` pose `data-lx-colle`). */
:is(.lx-outils, .lx-filtres:has(+ .lx-cadre [data-lx-liste])) { top: 8px; }
:is(.lx-outils, .lx-filtres:has(+ .lx-cadre [data-lx-liste]))::before { content: ""; position: absolute; z-index: -1;
  top: -48px; bottom: -10px; left: -16px; right: -16px; border-bottom: .5px solid var(--ap-trait); border-radius: 0 0 18px 18px;
  background: color-mix(in srgb, var(--mz-fond) 72%, transparent); backdrop-filter: blur(20px) saturate(180%); -webkit-backdrop-filter: blur(20px) saturate(180%);
  opacity: 0; pointer-events: none; transition: opacity .25s ease; }
:is(.lx-outils, .lx-filtres:has(+ .lx-cadre [data-lx-liste]))[data-lx-colle]::before { opacity: 1; }
.lx-outils .lx-segment { background: var(--ap-verre-maquette); backdrop-filter: var(--ap-flou-maquette); -webkit-backdrop-filter: var(--ap-flou-maquette); box-shadow: var(--ap-liser), var(--ap-ombre-verre); }
.lx-outils .lx-segment .lx-filtre { padding: 0 13px; color: var(--ap-label2); }
.lx-outils .lx-segment .lx-filtre:is([aria-pressed="true"], [aria-current="page"]) { color: var(--ap-label); }
.lx-outils .lx-segment .lx-compte { font-size: .8333em; color: var(--ap-label3); font-variant-numeric: tabular-nums; }
.lx-retirer-filtres { display: inline-flex; align-items: center; height: 40px; padding: 0 8px; font-size: 13.5px; font-weight: 500; color: var(--ap-tint); text-decoration: none;
  animation: ap-monte 350ms var(--lx-ressort) both; }

/* Un filtre en menu : son nom, sa valeur, son nombre ; une bulle de verre sort du bouton ; la valeur choisie prend
   la couleur de l'état qu'elle désigne */
.lx-filtre-menu { position: relative; }
.lx-filtre-menu > summary.lx-filtre-pop { display: inline-flex; align-items: center; gap: 5px; height: 40px; padding: 0 12px 0 15px; border-radius: 999px;
  background: var(--ap-verre-maquette); backdrop-filter: var(--ap-flou-maquette); -webkit-backdrop-filter: var(--ap-flou-maquette); box-shadow: var(--ap-liser), var(--ap-ombre-verre);
  font-size: 13.5px; color: var(--ap-label2); white-space: nowrap; transition: transform 450ms var(--ap-ressort-vif), background-color .2s; }
.lx-filtre-menu > summary.lx-filtre-pop:active { transform: scale(.95); }
.lx-filtre-menu > summary.lx-filtre-pop:has(.lx-pose) { background: rgba(255, 255, 255, .95); }
.lx-filtre-menu > summary.lx-filtre-pop:focus-visible { outline: 2px solid var(--ap-tint); outline-offset: 2px; }
.lx-filtre-valeur { font-weight: 600; color: var(--ap-label); }
.lx-filtre-valeur.lx-sorte-rouge { color: var(--ap-rouge); }
.lx-filtre-valeur.lx-sorte-ambre { color: var(--ap-orange-texte); }
.lx-filtre-valeur.lx-sorte-vert { color: var(--ap-tint); }
.lx-filtre-pop small { margin-left: 5px; font-size: .8333em; color: var(--ap-label3); font-variant-numeric: tabular-nums; }
.lx-filtre-pop .lx-ic { width: 13px; height: 13px; color: var(--ap-label3); }
/* la bulle : centrée sous son bouton, elle en sort en ressort et rentre en fondu */
details.lx-filtre-menu > .menu-plus-liste { top: calc(100% + 8px); left: 50%; right: auto; translate: -50% 0; min-width: 220px; max-height: 62vh; overflow-y: auto; gap: 0; padding: 6px; border: 0; border-radius: 18px;
  background: var(--ap-verre-maquette); backdrop-filter: blur(30px) saturate(200%); -webkit-backdrop-filter: blur(30px) saturate(200%); box-shadow: var(--ap-liser), var(--ap-ombre-verre); }
details.lx-filtre-menu[open] > .menu-plus-liste { transform-origin: 50% 0; animation: ap-bulle 500ms var(--ap-ressort-vif) both; }
@keyframes ap-bulle { from { opacity: 0; transform: scale(.5); filter: blur(6px); } 35% { opacity: 1; filter: none; } }
details.lx-filtre-menu > .menu-plus-liste > a.lx-filtre-choix { justify-content: flex-start; gap: 10px; min-height: 34px; padding: 0 10px; border-radius: 10px; font-size: 13.5px; color: var(--ap-label);
  white-space: nowrap; transition: background-color .12s; }
details.lx-filtre-menu > .menu-plus-liste > a.lx-filtre-choix:hover { background: var(--ap-tint); color: #fff; }
details.lx-filtre-menu > .menu-plus-liste > a.lx-filtre-choix.lx-nul:not(:hover) { color: var(--ap-label3); }
.lx-filtre-coche { display: grid; place-items: center; flex: none; width: 15px; }
.lx-filtre-coche .lx-ic { width: 17px; height: 17px; }
details.lx-filtre-menu > .menu-plus-liste > a.lx-filtre-choix small { margin-left: auto; padding-left: 16px; font-size: .8333em; color: inherit; opacity: .6; font-variant-numeric: tabular-nums; }
/* Les onglets en menu (`onglets.html`, `menu`), les documents de l'aperçu : leurs noms ne tiennent pas dans un segment.
   Le bouton prend la largeur du volet, un nom trop long s'y coupe ; la bulle a sa largeur, ses noms passent à la ligne. */
.lx-onglets-menu { display: block; z-index: 5; }   /* la bulle passe devant le papier qui suit */
.lx-onglets-menu > summary.lx-filtre-pop { display: flex; width: 100%; height: 36px; padding: 0 12px 0 14px; }
.lx-onglets-menu .lx-filtre-valeur { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
details.lx-onglets-menu > .menu-plus-liste { left: 0; right: 0; translate: none; min-width: 0; z-index: 30; }
details.lx-onglets-menu > .menu-plus-liste > button.lx-filtre-choix { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 34px; padding: 7px 10px;
  border: 0; border-radius: 10px; background: none; font-size: 13.5px; line-height: 1.3; text-align: left; white-space: normal; color: var(--ap-label); transition: background-color .12s; }
details.lx-onglets-menu > .menu-plus-liste > button.lx-filtre-choix:hover { background: var(--ap-tint); color: #fff; }
details.lx-onglets-menu .lx-filtre-choix[aria-selected="false"] .lx-filtre-coche .lx-ic { visibility: hidden; }

/* La liste dont la ligne ouvre son panneau (`data-lx-ouvre`), comme la maquette des opérations : 64 de haut, les
   colonnes à 14 l'une de l'autre, le carré des initiales à 20 du bord, le trait qui part après lui */
.lx-cadre:has([data-lx-liste]) { box-shadow: var(--ap-ombre-carte); }
.lx-tableau[data-lx-liste]:has(tr[data-lx-ouvre]) th, .lx-tableau[data-lx-liste]:has(tr[data-lx-ouvre]) td { padding: 0 7px; }
.lx-tableau[data-lx-liste]:has(tr[data-lx-ouvre]) :is(th, td):first-child { padding-left: 20px; }
.lx-tableau[data-lx-liste]:has(tr[data-lx-ouvre]) :is(th, td).lx-col-chevron { width: 37px; padding: 0 16px 0 7px; }
.lx-tableau[data-lx-liste]:has(tr[data-lx-ouvre]) th:first-child { width: calc((100% - 593px) * 1.4 / 2.4 + 27px); }
.lx-tableau[data-lx-liste]:has(tr[data-lx-ouvre]) th { color: var(--ap-label3); border-bottom-color: rgba(60, 60, 67, .12); letter-spacing: -.006em; text-transform: none; }
/* l'espacement des lettres de la maquette, sur ce qu'elle dessine */
:is(.lx-outils, .lx-tableau[data-lx-liste], .lx-tiroir-apercu) { letter-spacing: -.006em; }
.lx-tableau[data-lx-liste] tr[data-lx-ouvre] > td { height: 64px; }
.lx-tableau[data-lx-liste] tbody tr[data-lx-ouvre] + tr > td:first-child::after { left: 68px; }
.lx-tableau[data-lx-liste] tr[data-lx-ouvre] .lx-lien-ligne { font-size: 14px; color: var(--ap-label); }
.lx-tableau[data-lx-liste] tr[data-lx-ouvre] td.lx-col-chevron .lx-ic { width: 17px; height: 17px; }
/* sous le nom, une ligne de texte (l'opération, la juriste) au lieu de l'étiquette de la forme */
.lx-tableau[data-lx-liste] td.lx-titre-ligne .lx-sous.lx-sous-ligne { justify-self: stretch; height: auto; padding: 0; border-radius: 0; background: none; font-size: 12.5px; font-weight: 400;
  line-height: 1.45; color: var(--ap-label2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lx-tableau[data-lx-liste] tr[data-lx-ouvre] td.lx-titre-ligne .lx-cellule { grid-template-columns: auto minmax(0, 1fr); row-gap: 0; }
.lx-tableau[data-lx-liste] tr[data-lx-ouvre] td.lx-titre-ligne .lx-cellule > :is(.lx-valeur-et-sous, .lx-sous) { grid-column: 2; }
/* l'aide de la frise dépasse sur l'écart qui suit, comme la maquette : sa case passe devant la suivante */
.lx-tableau[data-lx-liste] th:has(> .lx-frise-entete) { z-index: 3; overflow: visible; }
/* les retards : un trait rouge arrondi, en retrait du bord */
.lx-tableau[data-lx-liste] tbody tr.lx-alerte > td:first-child { position: relative; box-shadow: none; }
.lx-tableau[data-lx-liste] tbody tr.lx-alerte > td:first-child::before { content: ""; position: absolute; left: 0; top: 10px; bottom: 10px; width: 3px; border-radius: 0 3px 3px 0; background: var(--ap-rouge); }
/* une pastille d'état, comme la maquette : 22 de haut, son point, ses couleurs */
:is(.lx-tableau[data-lx-liste], .lx-tiroir-apercu) .lx-etat { height: 22px; padding: 0 9px; gap: 6px; font-size: 12px; font-weight: 500; line-height: 22px; }
:is(.lx-tableau[data-lx-liste], .lx-tiroir-apercu) .lx-etat::before { opacity: 1; background: currentColor; }
:is(.lx-tableau[data-lx-liste], .lx-tiroir-apercu) .lx-etat-rouge { background: rgba(229, 55, 44, .11); color: var(--ap-rouge); }
:is(.lx-tableau[data-lx-liste], .lx-tiroir-apercu) .lx-etat-ambre { background: var(--ap-orange-clair); color: var(--ap-orange-texte); }
/* Othmane, 2026-11-01 · l'échéance dite dans sa colonne, sous qui on attend : proche, en ambre */
.lx-tableau[data-lx-liste] tr td:not(.lx-titre-ligne) .lx-cellule > .lx-sous.lx-sous-ambre { color: var(--ap-orange-texte); }
/* l'échéance s'écarte de la frise, vers la droite */
.lx-tableau[data-lx-liste] :is(th, td)[data-lx-col="echeance"] { padding-left: 34px; }
/* ce qu'elle attend et la date passent sur deux lignes plutôt que de couper la date */
.lx-tableau[data-lx-liste] tr td[data-lx-col="echeance"] .lx-cellule:has(> .lx-etat) > .lx-sous { display: -webkit-box; -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; white-space: normal; overflow: hidden; }
:is(.lx-tableau[data-lx-liste], .lx-tiroir-apercu) .lx-etat-vert { background: rgba(52, 199, 89, .14); color: #1d8a3a; }
:is(.lx-tableau[data-lx-liste], .lx-tiroir-apercu) .lx-etat-encre { background: var(--ap-tint-clair); color: var(--ap-tint); }
:is(.lx-tableau[data-lx-liste], .lx-tiroir-apercu) .lx-etat-gris { background: var(--ap-fill2); color: var(--ap-label2); }
.lx-tableau[data-lx-liste] tr[data-lx-ouvre] td:not(.lx-titre-ligne) .lx-cellule:has(> .lx-etat) { row-gap: 3px; }
.lx-tableau[data-lx-liste] tr[data-lx-ouvre] td:not(.lx-titre-ligne) .lx-sous { font-size: 12px; line-height: 1.45; color: var(--ap-label2); }
/* l'échéance : la pastille au sablier ; une date lointaine, seule, sur le gris */
.lx-tableau[data-lx-liste] td[data-lx-cle] .lx-etat { padding: 0 8px; gap: 5px; }
.lx-tableau[data-lx-liste] td[data-lx-cle] .lx-etat::before { width: 13px; height: 13px; }
.lx-tableau[data-lx-liste] td[data-lx-cle] .lx-etat-date { background: var(--ap-fill2); color: var(--ap-label); }
.lx-tableau[data-lx-liste] td[data-lx-cle] .lx-etat-date::before { display: none; }
/* le geste d'une ligne : un bouton de 28, vert pour le principal, en verre sinon */
main.page .lx-tableau[data-lx-liste] .lx-gestes .btn.petit:not(.btn-nu) { height: 28px; min-height: 28px !important; padding: 0 12px !important; font-size: 12.5px !important; color: var(--ap-label); }
main.page .lx-tableau[data-lx-liste] .lx-gestes .btn.petit:not(.btn-nu):not(.btn-plein) { background: rgba(255, 255, 255, .78); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1), inset 0 1px 0 #fff, 0 1px 3px rgba(0, 0, 0, .08); }
main.page .lx-tableau[data-lx-liste] .lx-gestes .btn.petit.btn-plein { color: #fff; background: linear-gradient(180deg, #1aa688, var(--ap-tint) 60%, #0b6654);
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .15), inset 0 1px 0 rgba(255, 255, 255, .4), inset 0 -1px 1px rgba(0, 0, 0, .12), 0 4px 14px -4px rgba(15, 123, 101, .55); }
/* sans ligne : la tête reste, puis la phrase en titre et le bouton qui retire les filtres */
.lx-tableau[data-lx-liste] > .lx-vide { gap: 8px; padding: 50px 20px; border: 0; color: var(--ap-label2); }
.lx-tableau[data-lx-liste] > .lx-vide p { font-size: 17px; font-weight: 600; color: var(--ap-label); }
main.page .lx-tableau[data-lx-liste] > .lx-vide .btn.petit { height: 32px; min-height: 32px !important; padding: 0 15px !important; font-size: 13.5px !important;
  background: rgba(255, 255, 255, .78); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1), inset 0 1px 0 #fff, 0 1px 3px rgba(0, 0, 0, .08); }

/* La frise d'une liste : trois temps de 70, alignés d'une ligne à l'autre, un point par étape, reliés ; le nom et
   l'état paraissent au survol (`apple.js`, la pointe). Dans la tête, chaque titre prend la place de son temps et de
   l'écart qui le suit, pour ne jamais sortir de sa case. */
.lx-tableau[data-lx-liste] .lx-frise { grid-template-columns: repeat(3, 70px); gap: 14px; min-width: 0; width: auto; }
.lx-tableau[data-lx-liste] .lx-frise-entete { grid-template-columns: 84px 84px max-content; gap: 0; min-width: 0; width: max-content; }
/* Othmane, 2026-11-01 · une seule colonne « Échéance », la frise prend la place gagnée : chaque temps un
   tiers de sa colonne, ses étapes réparties sur toute sa largeur, les titres au-dessus de leur temps */
@container lx-tableau (min-width: 1001px) {
  .lx-tableau[data-lx-liste] .lx-frise, .lx-tableau[data-lx-liste] .lx-frise-entete { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; width: 100%; }
  .lx-tableau[data-lx-liste] .lx-frise-etapes { justify-content: space-between; width: 100%; }
}
.lx-tableau[data-lx-liste] .lx-frise-entete > span:last-child { display: inline-flex; align-items: center; gap: 0; }
.lx-tableau[data-lx-liste] .lx-frise-entete .bulle { margin-left: 4px; }
.lx-tableau[data-lx-liste] th .bulle > summary { display: inline-grid; place-items: center; width: 16px; height: 16px; padding: 0; border: 0; border-radius: 50%; background: var(--ap-fill);
  font-size: 10.5px; font-weight: 600; line-height: 1; color: var(--ap-label2); }
.lx-tableau[data-lx-liste] .lx-frise-etapes { position: relative; align-items: center; gap: 11px; min-height: 24px; }
.lx-tableau[data-lx-liste] .lx-frise-etapes:has(> .lx-etape + .lx-etape)::before { content: ""; position: absolute; left: 7px; right: 7px; top: 11px; height: 2px; border-radius: 1px; background: var(--ap-fill); }
.lx-tableau[data-lx-liste] .lx-etape { flex: none; }
.lx-tableau[data-lx-liste] .lx-etape::before, .lx-tableau[data-lx-liste] .lx-etape small { display: none; }
.lx-tableau[data-lx-liste] .lx-etape > :is(a, span) { display: block; }
/* le point : blanc à venir, vert fait, rouge en retard, cerclé d'orange où l'opération en est, gris sans objet */
:is(.lx-tableau[data-lx-liste], .lx-tiroir-apercu) .lx-point { display: block; flex: none; width: 15px; height: 15px; border: 0; border-radius: 50%; background: var(--mz-surface); box-shadow: inset 0 0 0 1.5px var(--ap-point-vide), 0 1px 2px rgba(0, 0, 0, .06);
  transition: transform 400ms var(--ap-ressort-vif); }
.lx-tableau[data-lx-liste] .lx-etape a:hover .lx-point { transform: scale(1.4); }
:is(.lx-tableau[data-lx-liste], .lx-tiroir-apercu) .lx-etape[data-etat="faite"] .lx-point { background: var(--ap-point-fait); box-shadow: none; }
:is(.lx-tableau[data-lx-liste], .lx-tiroir-apercu) .lx-etape[data-etat="en_retard"] .lx-point { background: var(--ap-rouge); box-shadow: 0 0 0 3px rgba(229, 55, 44, .18); }
:is(.lx-tableau[data-lx-liste], .lx-tiroir-apercu) .lx-etape[data-courante]:not([data-etat="en_retard"]) .lx-point { background: #fff; box-shadow: inset 0 0 0 2.5px var(--ap-orange), 0 0 0 3px var(--ap-orange-clair); }
:is(.lx-tableau[data-lx-liste], .lx-tiroir-apercu) .lx-etape[data-etat="sans_objet"] .lx-point { background: var(--ap-fill); box-shadow: none; }
:is(.lx-tableau[data-lx-liste], .lx-tiroir-apercu) .lx-etape a[aria-current="step"] .lx-point { outline: 0; }
/* l'aide « ? » d'une liste et d'un panneau : au clic, une bulle de verre centrée sous son bouton (`apple.js`) */
:is(.lx-tableau[data-lx-liste] th, .lx-tiroir-apercu) .bulle:not([open]):hover .bulle-texte { display: none; }
:is(.lx-tableau[data-lx-liste] th, .lx-tiroir-apercu) .bulle > .bulle-texte { width: max-content; max-width: 272px; padding: 14px 16px; border-radius: 18px; background: var(--ap-verre-maquette);
  backdrop-filter: blur(30px) saturate(200%); -webkit-backdrop-filter: blur(30px) saturate(200%); box-shadow: var(--ap-liser), var(--ap-ombre-verre);
  font-size: 13px; font-weight: 400; line-height: 1.45; letter-spacing: -.006em; white-space: normal; text-transform: none; color: var(--ap-label); }
:is(.lx-tableau[data-lx-liste] th, .lx-tiroir-apercu) .bulle[open] > .bulle-texte { transform-origin: 50% 0; animation: ap-bulle 500ms var(--ap-ressort-vif) both; }
/* la pointe : une bulle sombre au-dessus du point survolé */
.ap-pointe { position: fixed; z-index: 3100; padding: 6px 10px; border-radius: 10px; background: rgba(30, 30, 32, .86); color: #fff; font-size: 12px; pointer-events: none; white-space: nowrap;
  opacity: 0; transform: translateY(4px); transition: opacity .15s, transform 250ms var(--ap-ressort-vif); }
.ap-pointe.vu { opacity: 1; transform: none; }

/* Le panneau d'une ligne (`tiroir` avec `apercu`) : au milieu de ce que le menu laisse, il naît de sa ligne et y
   retourne (`apple.js`) ; la page se floute derrière */
.lx-voile:has(+ .lx-tiroir-apercu) { background: rgba(242, 242, 247, .3); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); animation: lx-fondu 350ms ease; }
.lx-tiroir.lx-tiroir-apercu { top: 7vh; bottom: auto; left: var(--menu, 0px); right: 0; width: min(800px, calc(100vw - var(--menu, 0px) - 32px)); max-height: 86vh; margin: 0 auto; border-radius: 28px;
  background: rgba(255, 255, 255, .82); backdrop-filter: var(--ap-flou-maquette); -webkit-backdrop-filter: var(--ap-flou-maquette);
  box-shadow: var(--ap-liser), 0 0 0 .5px rgba(0, 0, 0, .08), 0 30px 80px -24px rgba(0, 0, 0, .4); color: var(--ap-label); animation: ap-apercu-entre 520ms var(--lx-ressort); }
.lx-tiroir.lx-tiroir-apercu.verre-sort { animation: ap-apercu-sort 220ms cubic-bezier(.4, 0, 1, 1) forwards; }
.lx-tiroir-apercu.ap-reste, .lx-voile.ap-reste { animation: none; }
@keyframes ap-apercu-entre { from { opacity: 0; transform: translateY(14px) scale(.96); } 35% { opacity: 1; } }
@keyframes ap-apercu-sort { to { opacity: 0; transform: scale(.94); } }
.lx-tiroir-apercu > header { justify-content: flex-start; gap: 14px; padding: 20px 18px 6px 22px; }
.lx-tiroir-apercu > header > div { min-width: 0; }
.lx-tiroir-apercu > header .lx-logo { width: 48px; height: 48px; border-radius: 14px; font-size: 17px; }
.lx-tiroir-apercu > header h3 { font-size: 21px; font-weight: 700; line-height: 25px; letter-spacing: -.02em; color: var(--ap-label); }
.lx-tiroir-apercu > header .lx-sous { margin-top: 1px; font-size: 13px; line-height: 1.45; color: var(--ap-label2); }
.lx-tiroir-apercu > header .lx-fermer { align-self: flex-start; display: grid; place-items: center; width: 32px; height: 32px; margin-left: auto; padding: 0; border-radius: 50%; color: var(--ap-label);
  transition: background-color .15s, transform 450ms var(--ap-ressort-vif); }
.lx-tiroir-apercu > header .lx-fermer .lx-ic { width: 17px; height: 17px; }
.lx-tiroir-apercu > header .lx-fermer:hover { background: rgba(0, 0, 0, .06); }
.lx-tiroir-apercu > header .lx-fermer:active { transform: scale(.86); }
.lx-tiroir-apercu .lx-tiroir-corps { gap: 0; padding: 8px 18px 6px; }
.lx-tiroir-apercu .lx-tiroir-corps > * { animation: ap-monte 500ms var(--lx-ressort) both; }
.lx-tiroir-apercu .lx-tiroir-corps > :nth-child(2) { animation-delay: 50ms; }
.lx-tiroir-apercu .lx-tiroir-corps > :nth-child(3) { animation-delay: 100ms; }
.lx-tiroir-apercu.ap-reste .lx-tiroir-corps > * { animation: none; }
.lx-tiroir-apercu .lx-tiroir-corps > .lx-note { margin: 0 4px 10px; font-size: 12.5px; color: var(--ap-label2); }
.lx-tiroir-apercu .lx-tiroir-pied { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 18px 18px; }
/* la grande frise : trois tuiles, chaque étape en ligne, son point, son nom, ce qu'on en dit ; la choisie en blanc */
.lx-tiroir-apercu .lx-frise-grande { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; min-width: 0; padding: 0; border-radius: 0; background: none; box-shadow: none; }
.lx-tiroir-apercu .lx-frise-grande > .lx-frise-temps { padding: 10px; border-radius: 16px; background: rgba(255, 255, 255, .8); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .05); }
.lx-tiroir-apercu .lx-frise-grande .lx-etiquette { margin: 0 4px 6px; font-size: 11.5px; font-weight: 600; line-height: 1.45; letter-spacing: 0; text-transform: none; color: var(--ap-label3); }
.lx-tiroir-apercu .lx-frise-grande .lx-frise-etapes { flex-direction: column; align-items: stretch; gap: 0; min-height: 0; }
.lx-tiroir-apercu .lx-frise-grande .lx-etape { flex: none; }
.lx-tiroir-apercu .lx-frise-grande .lx-etape::before { display: none; }
.lx-tiroir-apercu .lx-frise-grande .lx-etape > :is(a, span) { display: flex; align-items: center; gap: 9px; padding: 6px 8px; border-radius: 10px; text-align: left;
  transition: background-color .15s, transform 400ms var(--ap-ressort-vif); }
.lx-tiroir-apercu .lx-frise-grande .lx-etape > a:hover { background: rgba(0, 0, 0, .04); }
.lx-tiroir-apercu .lx-frise-grande .lx-etape > a:active { transform: scale(.97); }
.lx-tiroir-apercu .lx-frise-grande .lx-etape > a[aria-current="step"] { background: #fff; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .06), 0 2px 8px rgba(0, 0, 0, .08); }
.lx-etape-texte { min-width: 0; text-align: left; }
.lx-etape-texte > strong { display: block; font-size: 13px; font-weight: 500; line-height: 1.25; color: var(--ap-label); }
.lx-tiroir-apercu .lx-frise-grande .lx-etape-texte > small { display: block; max-width: none; padding: 0; overflow: visible; white-space: normal; text-align: left; font-size: 11.5px; font-weight: 400;
  line-height: 1.45; margin: 0; color: var(--ap-label2); }
.lx-tiroir-apercu .lx-frise-grande > .lx-frise-temps > .lx-note { margin: 4px; font-size: 12px; color: var(--ap-label3); }
/* les documents et l'étape choisie : deux cartes blanches */
.lx-tiroir-apercu .lx-deux { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 10px; margin-top: 10px; }
.lx-tiroir-apercu .lx-cadre { padding: 14px; border: 0; border-radius: 16px; background: rgba(255, 255, 255, .85); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .05); }
.lx-tiroir-apercu .lx-cadre-tete { padding: 0 0 8px; }
.lx-tiroir-apercu .lx-cadre-tete h2 { display: flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--ap-label); }
.lx-tiroir-apercu .lx-cadre-tete h2 .bulle > summary { display: inline-grid; place-items: center; width: 17px; height: 17px; padding: 0; border: 0; border-radius: 50%; background: var(--ap-fill);
  font-size: 11px; font-weight: 600; line-height: 1; color: var(--ap-label2); }
.lx-tiroir-apercu .lx-cadre-corps, .lx-tiroir-apercu .lx-cadre-corps:first-child { gap: 0; padding: 0; }
.lx-tiroir-apercu .lx-lignes > .lx-ligne { padding: 7px 0; border-bottom: 0; font-size: 13px; }
.lx-tiroir-apercu .lx-lignes > .lx-ligne + .lx-ligne { border-top: .5px solid rgba(60, 60, 67, .12); }
.lx-tiroir-apercu .lx-lignes > .lx-ligne .lx-ligne-titre { font-weight: 400; color: var(--ap-label); }
.lx-tiroir-apercu .lx-lignes > .lx-ligne .lx-sous { font-size: 12px; color: var(--ap-label2); }
.lx-tiroir-apercu .lx-element { gap: 0; padding: 0; border: 0; }
.lx-tiroir-apercu .lx-element-tete { flex-wrap: nowrap; gap: 6px; margin-bottom: 8px; }
.lx-tiroir-apercu .lx-element-tete > .lx-ligne-titre { flex: 1 1 auto; font-size: 14px; font-weight: 600; color: var(--ap-label); }
.lx-tiroir-apercu .lx-element > .lx-note, .lx-tiroir-apercu .lx-element-corps > .lx-note { margin: 0; font-size: 12.5px; color: var(--ap-label2); }
.lx-tiroir-apercu .lx-element-corps { gap: 0; }
.lx-tiroir-apercu .lx-element-corps > .lx-note { margin-top: 8px; }
.lx-tiroir-apercu .lx-vide { padding: 0; border: 0; align-items: flex-start; text-align: left; font-size: 12.5px; color: var(--ap-label2); }
/* les gestes d'une formalité : la date et ce qui l'accompagne sur une ligne, puis le motif, puis la preuve */
main.page .lx-tiroir-apercu .lx-element-corps form { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px; margin: 10px 0 0; }
.lx-tiroir-apercu .lx-element-corps .lx-champ-ligne { display: contents; }
.lx-tiroir-apercu .lx-element-corps .lx-champ-ligne > span:first-child { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
main.page .lx-tiroir-apercu .lx-element-corps form :is(input, textarea).lx-case { flex: 1 1 110px; min-width: 110px; height: 32px; min-height: 32px; padding: 0 12px; border: 0; border-radius: 11px;
  background: var(--ap-fill2); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08); font-size: 13px; color: var(--ap-label); resize: none; overflow: hidden; line-height: 32px; transition: box-shadow .2s, background-color .2s; }
main.page .lx-tiroir-apercu .lx-element-corps form :is(input, textarea).lx-case:focus { background: #fff; box-shadow: 0 0 0 1px var(--ap-tint), 0 0 0 4px var(--ap-tint-clair); }
.lx-tiroir-apercu .lx-element-corps .lx-case::placeholder { color: var(--ap-label3); }
main.page .lx-tiroir-apercu .lx-element-corps details.lx-replie[open] > summary { display: none; }
.lx-tiroir-apercu .lx-element-corps details.lx-replie::details-content { height: auto; opacity: 1; }
.lx-tiroir-apercu .lx-element-corps .btn { height: 32px; min-height: 32px; gap: 7px; padding: 0 15px; font-size: 13.5px; font-weight: 500; color: var(--ap-label); }
main.page .lx-tiroir-apercu .lx-element-corps .btn:not(.btn-plein):not(.btn-nu):not(.btn-doux):not(.btn-danger) { background: var(--ap-fill); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
main.page .lx-tiroir-apercu .lx-element-corps .btn:not(.btn-plein):not(.btn-nu):not(.btn-doux):not(.btn-danger):hover { background: rgba(120, 120, 128, .2); }
.lx-tiroir-apercu .lx-element-corps .btn.btn-plein, .lx-tiroir-apercu .lx-tiroir-pied .btn.btn-plein { height: 32px; min-height: 32px; padding: 0 15px; font-size: 13.5px; color: #fff;
  background: linear-gradient(180deg, #1aa688, var(--ap-tint) 60%, #0b6654); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .15), inset 0 1px 0 rgba(255, 255, 255, .4), inset 0 -1px 1px rgba(0, 0, 0, .12), 0 4px 14px -4px rgba(15, 123, 101, .55); }
.lx-tiroir-apercu .lx-element-corps .lx-gestes { display: flex; margin-top: 10px; }
.lx-tiroir-apercu .lx-element-corps .lx-gestes form { margin: 0; }
.lx-tiroir-apercu .lx-depot { display: inline-flex; align-items: center; gap: 7px; height: 32px; min-height: 32px; padding: 0 15px; border: 0; border-radius: 999px; background: rgba(255, 255, 255, .78);
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1), inset 0 1px 0 #fff, 0 1px 3px rgba(0, 0, 0, .08); font-size: 13.5px; font-weight: 500; color: var(--ap-label); cursor: pointer; }
.lx-tiroir-apercu .lx-depot:hover { background: #fff; color: var(--ap-label); }
.lx-tiroir-apercu .lx-depot .lx-ic { width: 17px; height: 17px; color: var(--ap-label); }
/* un refus : sa cause, en rouge, sous les gestes */
.lx-tiroir-apercu .lx-element .lx-avis { margin: 6px 0 0; padding: 0; border: 0; background: none; box-shadow: none; font-size: 12.5px; color: var(--ap-rouge); animation: ap-monte 300ms var(--lx-ressort) both; }
.lx-tiroir-apercu .lx-element .lx-avis :is(.lx-avis-titre, .lx-ic, strong) { display: none; }
.lx-tiroir-apercu .lx-element .lx-avis :is(p, span) { margin: 0; font-size: 12.5px; color: var(--ap-rouge); }
/* « Terminer l'opération ici » : sous un trait, sa note à côté */
main.page .lx-tiroir-apercu .lx-element-corps form.lx-terminer { flex-wrap: nowrap; gap: 10px; margin-top: 12px; padding-top: 12px; border-top: .5px solid rgba(60, 60, 67, .12); }
.lx-tiroir-apercu .lx-terminer .btn { flex: none; }
.lx-tiroir-apercu .lx-terminer .lx-note { font-size: 12.5px; color: var(--ap-label2); }
/* trop étroite pour toutes ses colonnes (de 701 à 1000), la liste retire le bouton de la ligne, qui reste dans le
   panneau qu'elle ouvre, et resserre sa frise ; plus étroite encore, elle se replie en cartes */
@container lx-tableau (min-width: 701px) and (max-width: 1000px) {
  .lx-tableau[data-lx-liste] [data-lx-large] { display: none; }
  .lx-tableau[data-lx-liste] :is(.lx-frise, .lx-frise-entete) { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; width: 100%; }
  .lx-tableau[data-lx-liste] .lx-frise-etapes { justify-content: space-between; gap: 6px; width: 100%; }
  .lx-tableau[data-lx-liste] th:has(> .lx-frise-entete) { width: 300px !important; }
  .lx-tableau[data-lx-liste]:has(tr[data-lx-ouvre]) th:first-child { width: calc((100% - 510px) * 1.4 / 2.4 + 27px); }
}
@media (max-width: 760px) { .lx-tiroir-apercu .lx-deux, .lx-tiroir-apercu .lx-frise-grande { grid-template-columns: minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) {
  .lx-tiroir.lx-tiroir-apercu, .lx-tiroir-apercu .lx-tiroir-corps > *, .lx-retirer-filtres, details.lx-filtre-menu[open] > .menu-plus-liste { animation: none; }
  .ap-pointe { transition: none; }
}
[data-lx-defile] { font-variant-numeric: tabular-nums; }

/* ---------------------------------------------------------------------------
   Lot AP6 · les fenêtres de création (`lots/LOT-AP6-fenetres.md`, la maquette `fenetres.html`) : « Ajouter une
   société » en feuille étroite, « Importer des dossiers » en feuille large, sur le dessin de « Nouvelle opération »
   (lot AP4). Une page posée en fenêtre dit sa taille : `data-lx-feuille="etroite|large"`.
   --------------------------------------------------------------------------- */
.tiroir-refonte.tiroir-fenetre:has([data-lx-feuille="etroite"]) { width: min(560px, 94vw); }
.tiroir-refonte.tiroir-fenetre:has([data-lx-feuille="large"]) { width: min(800px, 94vw); }
[data-lx-feuille] { display: block; max-width: none; padding: 4px 18px 22px; font-size: 14px; line-height: 1.45; letter-spacing: -.006em; color: var(--apm-label); }
.tiroir-fenetre [data-lx-feuille] > * { animation: apm-monte .5s var(--apm-ressort) both; }
.tiroir-fenetre [data-lx-feuille] > :nth-child(3) { animation-delay: .04s; } .tiroir-fenetre [data-lx-feuille] > :nth-child(4) { animation-delay: .08s; }
.tiroir-fenetre [data-lx-feuille] > :nth-child(n+5) { animation-delay: .12s; }
/* la feuille tressaille quand un champ est en cause */
.tiroir-refonte.tiroir-fenetre:has([data-lx-feuille] .lx-champ-erreur) { animation: ap6-secoue .45s var(--apm-doux); }
@keyframes ap6-secoue { 20% { translate: -6px 0; } 40% { translate: 5px 0; } 60% { translate: -3px 0; } 80% { translate: 2px 0; } }
/* le « ? » d'une feuille : la pastille grise de 17 */
[data-lx-feuille] .bulle > summary { display: inline-grid; place-items: center; width: 17px; height: 17px; padding: 0; border: 0; border-radius: 50%; background: var(--apm-fill);
  font-size: 11px; font-weight: 600; line-height: 1; color: var(--apm-label2); transition: transform .4s var(--apm-ressort-vif); }
[data-lx-feuille] .bulle > summary:hover { background: var(--apm-tint-clair); color: var(--apm-tint); }
[data-lx-feuille] .bulle > .bulle-texte { width: max-content; max-width: 340px; padding: 12px 14px; border-radius: 18px; background: var(--apm-verre); backdrop-filter: blur(30px) saturate(200%);
  -webkit-backdrop-filter: blur(30px) saturate(200%); box-shadow: var(--apm-liser), var(--apm-ombre-verre); font-size: 13px; font-weight: 400; line-height: 1.45; color: var(--apm-label); }
[data-lx-feuille] .lx-titre-groupe { display: flex; align-items: center; gap: 6px; }

/* Ajouter une société : les champs en lignes groupées, à la façon des Réglages */
.lx-feuille-creation .lx-champs { display: block; margin: 0; border-radius: 18px; overflow: hidden; background: rgba(255, 255, 255, .82); box-shadow: var(--apm-ombre-carte); }
.lx-feuille-creation .lx-champ { position: relative; display: flex; flex-direction: row; align-items: center; gap: 12px; min-height: 46px; margin: 0; padding: 6px 14px; }
.lx-feuille-creation .lx-champ + .lx-champ::before { content: ""; position: absolute; left: 14px; right: 0; top: 0; border-top: .5px solid var(--apm-sep); }
.lx-feuille-creation .lx-champ-lib { display: flex; align-items: center; gap: 6px; flex: none; width: 210px; margin: 0; font-size: 14px; font-weight: 400; color: var(--apm-label); }
.lx-feuille-creation .lx-champ input.lx-case { flex: 1; min-width: 0; height: 32px; padding: 0; border: 0; border-radius: 0; outline: none; background: transparent; box-shadow: none; text-align: right; font-size: 14px; color: var(--apm-label); }
.lx-feuille-creation .lx-champ input.lx-case::placeholder { color: var(--apm-label3); }
.lx-feuille-creation .lx-champ input.lx-case:focus { box-shadow: none; border: 0; }
/* la forme en segment : la lentille blanche glisse vers le choix (`apple.js`) */
.lx-feuille-creation .lx-champ .lx-segments { display: flex; gap: 2px; height: 34px; margin-left: auto; padding: 3px; border: 0; border-radius: 999px; background: var(--apm-fill); }
.lx-feuille-creation .lx-champ .lx-segments label { display: block; margin: 0; }
.lx-feuille-creation .lx-champ .lx-segments span { display: grid; place-items: center; height: 28px; padding: 0 11px; border: 0; border-radius: 999px; background: none; box-shadow: none;
  font-size: 13px; font-weight: 500; color: var(--apm-label2); white-space: nowrap; transition: color .25s; }
.lx-feuille-creation .lx-champ .lx-segments input:checked + span { color: var(--apm-label); }
.lx-feuille-creation .lx-champ .lx-segments input:checked + span::before { background: #fff; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .04), 0 1px 2px rgba(0, 0, 0, .08), 0 3px 8px rgba(0, 0, 0, .08); }
/* l'équipe : la ligne dit la personne choisie, et ouvre la bulle des personnes */
.lx-feuille-creation .lx-champ .lx-choix { flex: 1; min-width: 0; }
.lx-feuille-creation .lx-champ .lx-choix-bouton { display: flex; justify-content: flex-end; align-items: center; gap: 8px; width: 100%; height: 32px; padding: 0; border: 0; border-radius: 0;
  background: none; box-shadow: none; font-size: 14px; color: var(--apm-label); }
.lx-feuille-creation .lx-champ .lx-choix-bouton.lx-choix-vide { color: var(--apm-label2); }
.lx-feuille-creation .lx-champ .lx-choix-bouton svg { display: none; }
.lx-feuille-creation .lx-champ .lx-choix-bouton::after { content: ""; flex: none; width: 14px; height: 14px; background: #c4c4c7;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9.5 6 6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9.5 6 6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; }
.lx-feuille-creation .lx-champ:has(.lx-choix) { transition: background-color .15s; }
.lx-feuille-creation .lx-champ:has(.lx-choix):hover { background: rgba(0, 0, 0, .025); }
/* le champ en cause : la ligne rosit, la cause sous la valeur */
.lx-feuille-creation .lx-champ:has(.lx-champ-erreur) { padding-bottom: 16px; background: rgba(229, 55, 44, .05); }
.lx-feuille-creation .lx-champ-erreur { position: absolute; right: 14px; bottom: 2px; margin: 0; font-size: 11.5px; color: var(--apm-rouge); }
.lx-feuille-creation .lx-champ .lx-case[aria-invalid="true"] { background: transparent; border: 0; }
.lx-feuille-creation > .lx-avis-erreur { margin: 0 0 10px; }
.lx-feuille-creation .lx-pied-fenetre .lx-cochees-compte { flex: 1; }

/* Importer des dossiers : la zone, l'envoi, l'aperçu qui se corrige */
.imp[data-lx-feuille] { display: block; }
.imp .imp-depot { max-width: none; }
.imp-zone { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 34px 20px; border: 1.5px dashed rgba(60, 60, 67, .25); border-radius: 20px; background: rgba(255, 255, 255, .6);
  text-align: center; cursor: pointer; transition: border-color .2s, background-color .2s, transform .5s var(--apm-ressort-vif); }
.imp-zone:hover, .imp-zone:has(input:focus-visible) { border-color: var(--apm-tint); }
/* Othmane, 2026-10-30 : sur Safari, cliquer la zone n'ouvrait pas le choix du dossier (le champ caché, ouvert par son
   étiquette) ; le champ, transparent, couvre toute la zone : le clic tombe sur lui, dans tous les navigateurs */
.imp-zone { position: relative; cursor: pointer; }
.imp-zone > .imp-champ { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; opacity: 0; cursor: pointer; }
.imp-zone.survol { border-color: var(--apm-tint); background: var(--apm-tint-clair); transform: scale(1.015); }
.imp-zone .imp-icone { display: grid; place-items: center; width: 52px; height: 52px; margin-bottom: 4px; border-radius: 16px; background: var(--apm-tint-clair); color: var(--apm-tint); }
.imp-zone .imp-icone .lx-ic { width: 26px; height: 26px; }
.imp-zone b { font-size: 14.5px; font-weight: 600; } .imp-zone small { max-width: none; font-size: 12.5px; color: var(--apm-label2); }
.imp .aide { margin: 8px 6px 0; font-size: 12.5px; color: var(--apm-label2); }
.imp .imp-envoi { display: block; padding: 16px 18px; border-radius: 18px; background: rgba(255, 255, 255, .82); box-shadow: var(--apm-ombre-carte); }
.imp .imp-envoi[hidden], .imp [hidden] { display: none !important; }
.imp-jauge { height: 6px; margin-top: 8px; border-radius: 3px; background: var(--apm-fill); overflow: hidden; }
.imp-jauge i { display: block; width: 0; height: 100%; border-radius: 3px; background: var(--apm-tint); transition: width .25s linear; }
.imp .lx-avis-erreur[data-imp-refus] { margin: 10px 0 0; }
.imp-resume { display: flex; flex-wrap: wrap; gap: 6px; }
.imp .lx-etat { display: inline-flex; align-items: center; gap: 6px; height: 22px; padding: 0 9px; border-radius: 999px; font-size: 12px; font-weight: 500; line-height: 22px; }
.imp .lx-etat::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: 1; }
.imp .lx-etat-encre { background: var(--apm-tint-clair); color: var(--apm-tint); }
.imp .lx-etat-gris { background: var(--apm-fill2); color: var(--apm-label2); }
.imp .lx-etat-ambre { background: var(--apm-orange-clair); color: var(--apm-orange-encre); }
.imp .imp-manques { margin: 10px 0 0; }
.imp .imp-manques p { display: flex; flex-direction: column; }
.imp form.imp { display: block; max-width: none; margin: 0 -18px -22px; padding: 0 18px 22px; }
.imp-carte { margin-top: 12px; padding: 14px 14px 8px; border: 0; border-radius: 18px; background: rgba(255, 255, 255, .82); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .06); display: block; }
.imp-carte.imp-en-cause { box-shadow: 0 0 0 1.5px var(--apm-rouge); }
.imp-client-tete { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.imp-client-tete label { display: flex; flex-direction: column; gap: 4px; min-width: 0; font-size: 11.5px; font-weight: 500; color: var(--apm-label3); }
.imp :is(.imp-client-tete, .imp-fichiers) :is(input, .lx-choix-bouton) { height: 34px; padding: 0 12px; border: 0; border-radius: 11px; background: var(--apm-fill2); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08);
  font-size: 13.5px; color: var(--apm-label); outline: none; transition: box-shadow .2s, background-color .2s; }
.imp :is(.imp-client-tete, .imp-fichiers) input:focus { background: #fff; box-shadow: 0 0 0 1px var(--apm-tint), 0 0 0 4px var(--apm-tint-clair); }
.imp .imp-client-tete .nom input { font-weight: 600; }
.imp .lx-choix-bouton.lx-choix-vide { background: var(--apm-orange-clair); color: var(--apm-orange-encre); }
.imp-origine { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin-top: 10px; font-size: 12.5px; color: var(--apm-label2); }
.imp-origine .lx-choix-bouton { height: 28px; padding: 0 10px 0 12px; border: 0; border-radius: 11px; background: var(--apm-tint-clair); box-shadow: none; font-size: 12.5px; color: var(--apm-tint); }
.imp .imp-hors { margin: 6px 0 0; font-size: 12.5px; color: #7a4500; }
.imp-carte details { margin-top: 8px; }
.imp-carte details > summary { display: inline-flex; align-items: center; gap: 4px; padding: 4px 0; font-size: 12.5px; font-weight: 500; color: var(--apm-label2); cursor: pointer; list-style: none; }
.imp-carte details > summary::-webkit-details-marker { display: none; }
.imp-carte details > summary::before { content: ""; width: 12px; height: 12px; background: currentColor; transition: transform .4s var(--apm-ressort);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9.5 6 6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9.5 6 6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat; }
.imp-carte details[open] > summary::before { transform: rotate(90deg); }
.imp-fichiers { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.imp-fichiers td { padding: 5px 8px 5px 0; border-top: .5px solid var(--apm-sep); vertical-align: middle; color: var(--apm-label2); }
.imp-fichiers td:first-child { overflow-wrap: anywhere; color: var(--apm-label); font-weight: 500; }
.imp-fichiers td.t { width: 230px; } .imp-fichiers td.a { width: 78px; padding-right: 0; }
.imp .imp-fichiers :is(input, .lx-choix-bouton) { height: 28px; padding: 0 8px; font-size: 12.5px; }
.imp-carte:has(.imp-refus) { padding: 12px 14px; font-size: 12.5px; }
.imp-carte:has(.imp-refus) b { font-size: 13px; }
.imp-refus { margin: 0; padding: 0; list-style: none; }
.imp-refus li { padding: 6px 0; border-top: .5px solid var(--apm-sep); font-size: 12.5px; color: var(--apm-label2); }
.imp-gestes { position: sticky; bottom: -22px; display: flex; align-items: center; gap: 10px; margin: 14px -18px -22px; padding: 12px 18px 16px; border-top: .5px solid var(--apm-sep);
  background: color-mix(in srgb, var(--apm-verre-epais) 60%, transparent); backdrop-filter: var(--apm-flou); -webkit-backdrop-filter: var(--apm-flou); }
.imp-gestes .aide { flex: 1; margin: 0; font-size: 13px; color: var(--apm-label2); }
.imp-gestes .btn:not(.btn-plein) { color: var(--apm-label); background: var(--apm-fill); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
@media (max-width: 700px) { .imp-client-tete { grid-template-columns: 1fr; } .imp-fichiers td.t { width: auto; } }
@media (prefers-reduced-motion: reduce) {
  .tiroir-fenetre [data-lx-feuille] > *, .tiroir-refonte.tiroir-fenetre:has([data-lx-feuille] .lx-champ-erreur) { animation: none; }
}
/* la feuille : la phrase sous le titre, le formulaire sans écart à lui, les boutons du pied à 32 */
.tiroir-refonte.tiroir-fenetre:has([data-lx-feuille]) > header p { line-height: 1.45; }
/* le formulaire tient le pied dans ses marges : le pied s'étend jusqu'aux bords de la feuille sans sortir de lui */
.lx-feuille-creation form { display: block; margin: 0 -18px -22px; padding: 0 18px 22px; }
.lx-feuille-creation .lx-pied-fenetre { margin-top: 18px; }
.tiroir-refonte [data-lx-feuille] :is(.lx-pied-fenetre, .imp-gestes, .lx-fait) .btn { height: 32px; min-height: 32px; padding: 0 15px; font-size: 13.5px; font-weight: 500; }
/* la bulle des personnes : son titre, les initiales, la coche sur la personne choisie */
.lx-choix-liste.ap-bulle-personnes { min-width: 220px !important; padding: 6px; border-radius: 18px; background: var(--apm-verre); backdrop-filter: blur(30px) saturate(200%); -webkit-backdrop-filter: blur(30px) saturate(200%);
  box-shadow: var(--apm-liser), var(--apm-ombre-verre); transform-origin: 50% 0; animation: ap-bulle 500ms var(--apm-ressort-vif) both; }
.ap-bulle-personnes .ap-titre-bulle { padding: 6px 10px 4px; font-size: 12px; font-weight: 600; color: var(--apm-label3); }
.ap-bulle-personnes .lx-choix-opt { display: flex; align-items: center; justify-content: flex-start; gap: 10px; width: 100%; text-align: left; min-height: 34px; padding: 0 10px; border-radius: 10px; font-size: 13.5px; color: var(--apm-label); transition: background-color .12s; }
.ap-bulle-personnes .lx-choix-opt.lx-choix-ici { background: none; }
.ap-bulle-personnes .lx-choix-opt:hover, .ap-bulle-personnes .lx-choix-opt:focus-visible { background: var(--apm-tint); color: #fff; }
.ap-bulle-personnes .lx-choix-texte { flex: none; text-align: left; }
.ap-bulle-personnes .ap-perso { display: grid; place-items: center; flex: none; width: 24px; height: 24px; border-radius: 50%; background: linear-gradient(160deg, #b4b8c0, #868b95); color: #fff; font-size: 10px; font-weight: 600; }
.ap-bulle-personnes .ap-coche-ici::after { content: "✓"; margin-left: auto; color: var(--apm-tint); font-weight: 600; }
.ap-bulle-personnes .ap-coche-ici:is(:hover, :focus-visible)::after { color: #fff; }
.lx-feuille-creation .lx-segments.lx-refusee { border: 0; outline: 0; box-shadow: none; }
.tiroir-refonte [data-lx-feuille] :is(.lx-fait, .lx-pied-fenetre, .imp-gestes) .btn:not(.btn-plein):not(.btn-nu):not(.btn-doux):not(.btn-danger) { color: var(--apm-label); background: var(--apm-fill); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.tiroir-refonte [data-lx-feuille] :is(.lx-fait, .lx-pied-fenetre, .imp-gestes) .btn:not(.btn-plein):not(.btn-nu):not(.btn-doux):not(.btn-danger):hover { background: rgba(120, 120, 128, .2); }

/* « Nouvelle opération » ouverte du menu, d'un écran ou de « Lancer une opération » (`base.html`, `ossature.js`) : la
   feuille du milieu de la maquette des fenêtres, comme sa version ouverte en tiroir (lot AP4) */
#nouvelle-operation.lx-fenetre { top: 6vh; left: calc(50% + var(--menu, 0px) / 2); width: min(720px, 94vw); max-height: 88vh; border: 0; border-radius: 28px;
  background: var(--apm-verre-epais); backdrop-filter: var(--apm-flou); -webkit-backdrop-filter: var(--apm-flou);
  box-shadow: var(--apm-liser), 0 0 0 .5px rgba(0, 0, 0, .08), 0 30px 80px -24px rgba(0, 0, 0, .35); letter-spacing: -.006em; color: var(--apm-label); }
.lx-voile-fenetre:has(~ #nouvelle-operation:not([hidden])) { background: rgba(242, 242, 247, .35); backdrop-filter: blur(8px) saturate(140%); -webkit-backdrop-filter: blur(8px) saturate(140%); }
#nouvelle-operation > header { align-items: center; gap: 12px; padding: 18px 16px 10px 22px; border: 0; }
#nouvelle-operation > header > div { flex: 1; min-width: 0; }
#nouvelle-operation > header h2 { margin: 0; font-size: 21px; font-weight: 700; line-height: 1.2; letter-spacing: -.02em; color: var(--apm-label); }
#nouvelle-operation > header p { margin: 2px 0 0; font-size: 12.5px; line-height: 1.45; color: var(--apm-label2); }
#nouvelle-operation > header [data-lx-fermer] { display: grid; place-items: center; width: 32px; height: 32px; min-height: 32px; padding: 0; border: 0; border-radius: 50%; background: none; box-shadow: none; color: var(--apm-label);
  transition: background-color .15s, transform .45s var(--apm-ressort-vif); }
#nouvelle-operation > header [data-lx-fermer]:hover { background: rgba(0, 0, 0, .06); }
#nouvelle-operation > header [data-lx-fermer]:active { transform: scale(.86); }
#nouvelle-operation > header [data-lx-fermer] .lx-ic { width: 17px; height: 17px; }
/* les pas : des pastilles ; le pas en cours en blanc, les pas passés en vert */
#nouvelle-operation .lx-pas { gap: 4px; padding: 0 22px 10px; font-size: 12.5px; }
#nouvelle-operation .lx-pas :is(button, span[data-lx-pas]) { display: inline-flex; align-items: center; height: 24px; padding: 0 9px; border-radius: 999px; font-size: 12.5px; font-weight: 500; color: var(--apm-label3);
  transition: background-color .2s, color .2s; }
#nouvelle-operation .lx-pas button:not(:disabled) { color: var(--apm-tint); }
#nouvelle-operation .lx-pas button:not(:disabled):hover { background: var(--apm-tint-clair); }
#nouvelle-operation .lx-pas [aria-current="step"], #nouvelle-operation .lx-pas button[aria-current="step"]:disabled { color: var(--apm-label); font-weight: 500; background: rgba(255, 255, 255, .9);
  box-shadow: 0 0 0 .5px rgba(0, 0, 0, .05), 0 1px 3px rgba(0, 0, 0, .08); }
#nouvelle-operation .lx-pas .lx-ic { width: 12px; height: 12px; color: var(--apm-label3); }
#nouvelle-operation .lx-fenetre-corps { display: block; padding: 4px 18px 22px; }
#nouvelle-operation .lx-fenetre-corps > * > * { animation: apm-monte .5s var(--apm-ressort) both; }
/* le premier pas : la recherche en pastille, les sociétés en liste groupée */
.lx-cherche-societe { display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px; border-radius: 999px; background: rgba(255, 255, 255, .82); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .08);
  color: var(--apm-label3); transition: box-shadow .2s; }
.lx-cherche-societe:focus-within { box-shadow: 0 0 0 1px var(--apm-tint), 0 0 0 4px var(--apm-tint-clair); }
.lx-cherche-societe .lx-ic { width: 17px; height: 17px; }
.lx-cherche-societe input { flex: 1; min-width: 0; height: 100%; padding: 0; border: 0; outline: none; background: transparent; box-shadow: none; font-size: 14px; color: var(--apm-label); }
.lx-cherche-societe input::placeholder { color: var(--apm-label3); }
#nouvelle-operation .lx-palette-titre { margin: 16px 6px 6px; padding: 0; font-size: 12px; font-weight: 600; color: var(--apm-label3); }
.lx-palette-groupe { border-radius: 18px; overflow: hidden; background: rgba(255, 255, 255, .82); box-shadow: var(--apm-ombre-carte); }
.lx-palette-ligne.lx-ligne-societe { position: relative; gap: 12px; min-height: 50px; padding: 6px 14px; border-radius: 0; font-size: 14px; color: var(--apm-label); transition: background-color .15s; }
.lx-palette-ligne.lx-ligne-societe + .lx-ligne-societe::before { content: ""; position: absolute; left: 62px; right: 0; top: 0; border-top: .5px solid var(--apm-sep); }
.lx-palette-ligne.lx-ligne-societe:is(:hover, .lx-vise) { background: rgba(0, 0, 0, .03); color: var(--apm-label); }
.lx-palette-ligne.lx-ligne-societe:active { background: rgba(0, 0, 0, .06); }
.lx-ligne-societe .lx-logo { width: 34px; height: 34px; border-radius: 10px; font-size: 12px; }
.lx-ligne-societe .lx-palette-nom { flex: 1; min-width: 0; font-weight: 500; }
.lx-ligne-societe .lx-palette-precision { height: 18px; margin: 0; padding: 0 6px; border-radius: 5px; background: var(--apm-fill2); font-size: 10.5px; font-weight: 600; line-height: 18px; color: var(--apm-label2); }
.lx-ligne-societe > .lx-ic { width: 14px; height: 14px; color: #c4c4c7; }
#nouvelle-operation .lx-palette-rien { padding: 26px 10px; text-align: center; font-size: 13.5px; color: var(--apm-label2); }
/* les pas suivants : l'écran de lancement, sans sa tête ni ses étapes, que la fenêtre porte déjà */
#nouvelle-operation .lx-nouvelle { padding: 0; }
#nouvelle-operation .lx-nouvelle > :is(.lx-tete, .lx-etapes) { display: none; }
@media (prefers-reduced-motion: reduce) { #nouvelle-operation .lx-fenetre-corps > * > * { animation: none; } }
/* le refus « Non lancée » : la liste des documents tressaille, comme la maquette */
.lx-nouvelle:has(> .lx-avis-erreur) .lx-documents .lx-coches { animation: ap6-secoue .45s var(--apm-doux); }
.imp-fichiers { table-layout: fixed; }
.imp :is(.imp-client-tete, .imp-fichiers) :is(input, .lx-choix, .lx-choix-bouton) { box-sizing: border-box; width: 100%; max-width: 100%; min-width: 0; }
.imp-origine .lx-choix { width: auto; }

/* ---------------------------------------------------------------------------
   Lot AP5 · les pièces de la maquette de la fiche (`lots/maquettes/apple/index.html`, `lots/LOT-AP5-fiche-societe.md`),
   communes à toute page qui en a besoin : la barre d'outils de verre qui flotte, le grand titre et ses étiquettes,
   l'équipe en bulle, les vues en pastille de verre, le résumé en tuiles, le sommaire et sa lentille, les sections en
   listes groupées (le libellé à gauche, la valeur à droite, le chevron), les pastilles « + », les personnes, le mandat.
   --------------------------------------------------------------------------- */
:root { --ap-label: #1d1d1f; --ap-label2: #6e6e73; --ap-label3: #8e8e93; --ap-fill: rgba(120, 120, 128, .12); --ap-fill2: rgba(120, 120, 128, .08);
  --ap-tint: #0f7b65; --ap-tint-clair: rgba(15, 123, 101, .12); --ap-orange: #f28a00; --ap-orange-clair: rgba(255, 149, 0, .13); --ap-rouge: #e5372c;
  --ap-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9.5 6 6 6-6 6'/%3E%3C/svg%3E");
  --ap-ombre-groupe: 0 0 0 .5px rgba(0, 0, 0, .04), 0 1px 3px rgba(0, 0, 0, .04);
  --ap-ombre-poignee: 0 0 0 .5px rgba(0, 0, 0, .14), 0 1px 4px rgba(0, 0, 0, .14);  /* la poignée d'une ligne ou d'une colonne de tableau, blanche sur le papier blanc */ }
.lx-ic { flex: none; }

/* la page refaite : le contenu sous la barre d'outils qui flotte (84 = 12 + 52 + 20) */
main.page.lx-maquette.fiche-socle { padding: 84px 28px 120px 28px; }
@media (min-width: 1200px) { main.page.lx-maquette.fiche-socle { padding: 84px 28px 120px 28px; } }

/* La barre d'outils : des pastilles de verre qui flottent au-dessus de la page */
.lx-barre-outils { position: fixed; z-index: 25; top: 12px; left: calc(var(--menu, 76px) + 12px); right: 12px; height: 52px; display: flex; align-items: center; gap: 10px; pointer-events: none; }
.lx-barre-outils > * { pointer-events: auto; }
.lx-pastille-verre { display: flex; align-items: center; gap: 2px; height: 40px; padding: 4px; border-radius: 999px; background: var(--ap-verre);
  backdrop-filter: var(--ap-verre-flou); -webkit-backdrop-filter: var(--ap-verre-flou); box-shadow: var(--ap-verre-bord), var(--ap-verre-ombre); }
.lx-barre-droite { margin-left: auto; }
.lx-rond, details.lx-menu-rond > summary.lx-rond { position: relative; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%;
  background: none; color: var(--ap-label); cursor: pointer; list-style: none; transition: background-color .15s, transform 450ms var(--ap-ressort-vif); }
.lx-rond::-webkit-details-marker { display: none; }
.lx-rond:hover { background: rgba(0, 0, 0, .06); color: var(--ap-label); }
.lx-rond:active { transform: scale(.86); }
.lx-rond .lx-ic { width: 17px; height: 17px; stroke-width: 1.7; }
.lx-rond.lx-a-des::after { content: ""; position: absolute; top: 4px; right: 4px; width: 8px; height: 8px; border-radius: 50%; background: var(--ap-rouge); box-shadow: 0 0 0 2px #fff; }
.lx-barre-ariane { display: flex; align-items: center; gap: 2px; padding-right: 8px; font-size: 13px; color: var(--ap-label2); }
.lx-petit-titre { padding: 0 12px 0 4px; font-size: 14px; font-weight: 600; opacity: 0; transform: translateY(6px); transition: opacity .25s, transform 400ms var(--lx-ressort); white-space: nowrap; }
body.ap-replie .lx-petit-titre { opacity: 1; transform: none; }
body.ap-replie .lx-grand-titre { opacity: 0; }
.lx-barre-outils .btn.btn-plein { height: 32px; padding: 0 15px; border-radius: 999px; font-size: 13.5px; font-weight: 500; gap: 7px; }
/* le menu « … » : la bulle de verre qui sort du bouton, sous lui, à droite */
details.lx-menu-rond { position: relative; }
details.lx-menu-rond > .menu-plus-liste, details.lx-equipe > .menu-plus-liste { min-width: 220px; padding: 6px; border-radius: 18px; transform-origin: top center; }
details.lx-menu-rond > .menu-plus-liste { right: -60px; top: calc(100% + 12px); }
:is(details.lx-menu-rond, details.lx-equipe) > .menu-plus-liste > :is(a, button, span), :is(details.lx-menu-rond, details.lx-equipe) > .menu-plus-liste form button {
  display: flex; align-items: center; gap: 10px; width: 100%; height: 34px; padding: 0 10px; border-radius: 10px; font-size: 13.5px; color: var(--ap-label); text-decoration: none; }
:is(details.lx-menu-rond, details.lx-equipe) > .menu-plus-liste > :is(a, button):hover, :is(details.lx-menu-rond, details.lx-equipe) > .menu-plus-liste form button:hover { background: var(--ap-tint); color: #fff; }
:is(details.lx-menu-rond, details.lx-equipe) > .menu-plus-liste :is(a, button, span) .lx-ic { color: var(--ap-label2); width: 17px; height: 17px; }
:is(details.lx-menu-rond, details.lx-equipe) > .menu-plus-liste :is(a, button):hover .lx-ic { color: #fff; }
:is(details.lx-menu-rond, details.lx-equipe) > .menu-plus-liste hr { margin: 5px 10px; border: 0; border-top: .5px solid var(--ap-trait); }
details.lx-menu-rond > .menu-plus-liste form button { color: var(--ap-label); }

/* Le grand titre : les initiales, le nom en 34, les étiquettes ; l'équipe à droite, en initiales qui se chevauchent */
.lx-grand-titre { display: flex; align-items: flex-end; gap: 18px; padding: 10px 4px 22px; transition: opacity .3s; }
.lx-grand-titre .lx-avatar.lx-logo { width: 64px; height: 64px; border-radius: 18px; font-size: 22px; font-weight: 700; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 8px 22px -8px rgba(0, 0, 0, .35); }
.lx-grand-titre .lx-titre { margin: 0; font-size: 34px; line-height: 1.05; font-weight: 700; letter-spacing: -.028em; color: var(--ap-label); }
.lx-reperes { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 8px 0 0; }
.lx-repere { display: inline-flex; align-items: center; gap: 5px; height: 24px; padding: 0 10px; border-radius: 999px; background: rgba(255, 255, 255, .75);
  box-shadow: 0 0 0 .5px rgba(0, 0, 0, .07); font-size: 12px; color: var(--ap-label2); }
.lx-repere b { color: var(--ap-label); font-weight: 600; }
.lx-repere.lx-repere-forme { background: var(--ap-tint-clair); color: var(--ap-tint); font-weight: 600; box-shadow: none; }
details.lx-equipe { position: relative; margin-left: auto; align-self: flex-end; }
details.lx-equipe > summary { display: flex; align-items: center; gap: 4px; list-style: none; cursor: pointer; }
details.lx-equipe > summary::-webkit-details-marker { display: none; }
details.lx-equipe > summary .lx-avatar { width: 32px; height: 32px; font-size: 12px; font-weight: 600; background: var(--lx-initiales); color: #fff; box-shadow: 0 0 0 2px var(--mz-fond); }
details.lx-equipe > summary .lx-avatar + .lx-avatar { margin-left: -10px; }
details.lx-equipe > summary .lx-avatar-ajout .lx-ic { width: 14px; height: 14px; }
details.lx-equipe > .menu-plus-liste { right: 0; top: calc(100% + 8px); }
details.lx-equipe > .menu-plus-liste > span.lx-equipe-membre { cursor: default; }

/* Les vues de la page : une pastille de verre, la lentille blanche glisse (`apple.js`) */
.lx-maquette .lx-onglets:not(.lx-sous-menu) { height: 40px; margin: 0 0 16px; padding: 4px; gap: 2px; border-radius: 999px; background: var(--ap-verre);
  backdrop-filter: var(--ap-verre-flou); -webkit-backdrop-filter: var(--ap-verre-flou); box-shadow: var(--ap-verre-bord), var(--ap-verre-ombre); }
.lx-maquette .lx-onglets:not(.lx-sous-menu) > :is(a, button) { display: inline-flex; align-items: center; height: 32px; padding: 0 15px; font-size: 13.5px; font-weight: 500; color: var(--ap-label2); }
.lx-maquette .lx-onglets:not(.lx-sous-menu) > :is([aria-current], [aria-selected="true"]) { color: var(--ap-label); }
.lx-maquette .lx-onglets:not(.lx-sous-menu) > :is([aria-current], [aria-selected="true"])::before { background: rgba(255, 255, 255, .95);
  box-shadow: 0 0 0 .5px rgba(0, 0, 0, .04), 0 1px 2px rgba(0, 0, 0, .06), 0 4px 12px rgba(0, 0, 0, .10), inset 0 1px 0 #fff; }
.lx-maquette .lx-onglets .lx-compte { min-width: 0; margin-left: 4px; padding: 0; background: none; color: var(--ap-label3); font-size: 13.5px; font-weight: 500; }

/* Le résumé en tuiles : six cartes blanches, chacune mène à sa section ; l'anneau de ce qui reste à compléter */
.lx-resume-tuiles { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; }
.lx-resume-tuile { position: relative; display: block; padding: 14px 15px 13px; border-radius: 20px; background: #fff; box-shadow: var(--ap-ombre-groupe); color: var(--ap-label);
  text-align: left; text-decoration: none; transition: transform 500ms var(--lx-ressort), box-shadow .3s; }
a.lx-resume-tuile:hover { transform: translateY(-2px); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .04), 0 12px 26px -12px rgba(0, 0, 0, .2); color: var(--ap-label); text-decoration: none; }
a.lx-resume-tuile:active { transform: scale(.97); transition-duration: .1s; }
.lx-resume-tuile small { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ap-label2); }
.lx-resume-tuile small .lx-ic { width: 14px; height: 14px; color: var(--ap-tint); }
.lx-resume-tuile strong { display: block; margin-top: 8px; font-size: 17px; line-height: 1.2; font-weight: 600; letter-spacing: -.015em; }
.lx-resume-tuile span { display: block; margin-top: 2px; font-size: 12px; color: var(--ap-label3); }
.lx-resume-tuile.lx-resume-alerte small .lx-ic, .lx-resume-tuile.lx-resume-alerte strong { color: var(--ap-orange); }
.lx-resume-tuile.lx-resume-alerte[class*="rouge"] strong { color: var(--ap-rouge); }
.lx-resume-anneau { position: absolute; right: 12px; top: 50%; width: 46px; height: 46px; transform: translateY(-50%) rotate(-90deg); }
.lx-resume-anneau circle { fill: none; stroke-width: 5; stroke: var(--ap-fill); }
.lx-resume-anneau circle + circle { stroke: var(--ap-orange); stroke-linecap: round; transition: stroke-dashoffset .8s var(--lx-ressort); }
@media (max-width: 1100px) { .lx-resume-tuiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* L'avis d'une page refaite : orange clair, l'icône, une ligne, « Voir » en verre */
.lx-maquette .lx-avis:is(.lx-avis-attention, .lx-avis-ambre, .lx-avis-attente) { margin-bottom: 18px; padding: 12px 14px 12px 16px; border: 0; border-radius: 18px; background: var(--ap-orange-clair); color: #7a4300; font-size: 13.5px; box-shadow: none; }

/* Deux colonnes : le sommaire, les sections */
.lx-fiche-colonnes { display: grid; grid-template-columns: 212px minmax(0, 1fr); gap: 20px; align-items: start; }
.lx-sommaire { position: sticky; top: 84px; display: flex; flex-direction: column; gap: 1px; padding: 6px; border-radius: 20px; background: rgba(255, 255, 255, .55); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .05); }
.lx-sommaire a { position: relative; isolation: isolate; display: flex; align-items: center; gap: 8px; height: 34px; padding: 0 10px; border-radius: 12px; font-size: 13.5px; color: var(--ap-label2); text-decoration: none; transition: color .2s; }
.lx-sommaire a:hover { color: var(--ap-label); text-decoration: none; }
.lx-sommaire a.ici { color: var(--ap-label); font-weight: 600; }
.lx-sommaire a.ici::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: rgba(255, 255, 255, .95);
  box-shadow: 0 0 0 .5px rgba(0, 0, 0, .04), 0 1px 2px rgba(0, 0, 0, .06), 0 4px 12px rgba(0, 0, 0, .10), inset 0 1px 0 #fff; transform-origin: 0 0; }
.lx-sommaire a i { margin-left: auto; font-style: normal; font-size: 11.5px; font-weight: 500; color: var(--ap-label3); }
.lx-sommaire a i.lx-sommaire-alerte { color: var(--ap-orange); }

/* Une section : son titre en 20, son geste à droite ; ses listes groupées */
.lx-section { scroll-margin-top: 84px; margin-bottom: 26px; }
.lx-section > header { display: flex; align-items: baseline; gap: 10px; padding: 0 16px 7px; }
.lx-section > header h2 { margin: 0; font-size: 20px; font-weight: 700; letter-spacing: -.02em; color: var(--ap-label); }
.lx-section > header > :is(.btn, form) { margin-left: auto; }
.lx-section .btn.lx-lien-plus { height: auto; padding: 0 6px; gap: 7px; color: var(--ap-tint); font-size: 13.5px; font-weight: 500; }
.lx-section .btn.lx-lien-plus .lx-ic { width: 17px; height: 17px; }
.lx-liste-groupee { position: relative; border-radius: 20px; background: #fff; box-shadow: var(--ap-ombre-groupe); overflow: hidden; }
.lx-liste-groupee + .lx-liste-groupee, .lx-liste-groupee + .lx-note-groupe { margin-top: 10px; }
.lx-note-groupe { margin: 0; padding: 6px 16px 0; font-size: 12.5px; color: var(--ap-label3); }
/* une ligne : le libellé à gauche, la valeur à droite, le chevron ; le trait part à 16 px */
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > :is(.lx-info, .lx-rangee, .lx-personne, .lx-mandat, .lx-a-ajouter, .lx-ecart, .lx-rangee-note) { position: relative; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > :is(.lx-info, .lx-rangee, .lx-personne, .lx-mandat) + :is(.lx-info, .lx-rangee, .lx-personne, .lx-mandat)::before {
  content: ""; position: absolute; left: 16px; right: 0; top: 0; border-top: .5px solid var(--ap-trait); pointer-events: none; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > :is(.lx-info, .lx-rangee) { display: flex; align-items: center; gap: 14px; min-height: 46px; margin: 0; padding: 11px 16px; border: 0; border-radius: 0;
  background: none; font-size: 14px; transition: background-color .15s; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info:not(.lx-info-edition) { padding-right: 38px; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info:not(.lx-info-edition):hover { background: rgba(0, 0, 0, .025); }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info:not(.lx-info-edition):active { background: rgba(0, 0, 0, .05); }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info:not(.lx-info-edition)::after, .lx-liste-groupee > :is(.lx-rangee-personne, .lx-personne)::after {
  content: ""; position: absolute; right: 16px; top: 50%; width: 14px; height: 14px; margin-top: -7px; background: #c4c4c7; -webkit-mask: var(--ap-chevron) center / contain no-repeat; mask: var(--ap-chevron) center / contain no-repeat; pointer-events: none; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info > .lx-info-lib { flex: 0 1 auto; min-width: 0; margin: 0; font-size: 14px; font-weight: 400; color: var(--ap-label); }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info > .lx-info-v { display: flex; align-items: center; justify-content: flex-end; gap: 6px; margin-left: auto; min-width: 0; font-size: 14px; font-weight: 400; color: var(--ap-label2); text-align: right; overflow-wrap: anywhere; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info > .lx-info-v .lx-info-ouvre { color: inherit; text-decoration: none; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info > .lx-info-v .lx-info-ouvre::after { content: ""; position: absolute; inset: 0; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info > .lx-info-v .lx-origine { position: relative; z-index: 1; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info > .lx-info-outils { display: flex; gap: 10px; font-size: 12.5px; opacity: 0; transition: opacity .15s; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info:is(:hover, :focus-within) > .lx-info-outils { opacity: 1; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info.lx-info-edition { display: block; padding: 11px 16px 14px; background: none; animation: ap-ouvre 450ms var(--lx-glisse) both; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info.lx-info-edition > .lx-info-lib { display: block; margin-bottom: 8px; color: var(--ap-label); }
@keyframes ap-ouvre { from { opacity: 0; transform: translateY(-6px) scale(.98); } }
/* la valeur qui vient d'être enregistrée s'éclaire (le mot « Enregistré » monte, `apple.js`) */
/* à compléter : « À compléter » en petit, puis des pastilles « + » ; celle qu'on ouvre devient une ligne */
.lx-a-ajouter { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px 16px 14px; }
.lx-liste-groupee > * + .lx-a-ajouter { border-top: .5px solid var(--ap-trait); }
.lx-a-ajouter > small { width: 100%; margin-bottom: 2px; font-size: 12px; color: var(--ap-label3); }
.lx-ajout-pastille { display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0 11px 0 8px; border-radius: 999px; background: var(--ap-fill2); font-size: 12.5px; color: var(--ap-label);
  text-decoration: none; transition: background-color .15s, transform 450ms var(--ap-ressort-vif), opacity .25s; }
.lx-ajout-pastille .lx-ic { width: 13px; height: 13px; color: var(--ap-tint); stroke-width: 2.2; }
a.lx-ajout-pastille:hover { background: var(--ap-tint-clair); color: var(--ap-label); text-decoration: none; }
a.lx-ajout-pastille:active { transform: scale(.92); }
/* une personne : ses initiales, son nom et sa pièce, ses rôles en pastille, le chevron ; toute la ligne ouvre sa fiche */
.lx-liste-groupee > .lx-personne { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; grid-template-rows: auto auto; align-items: center; column-gap: 12px;
  min-height: 46px; margin: 0; padding: 11px 38px 11px 16px; border: 0; background: none; transition: background-color .15s; }
.lx-liste-groupee > .lx-personne:hover, .lx-liste-groupee > .lx-rangee-personne:hover { background: rgba(0, 0, 0, .025); }
.lx-liste-groupee > .lx-personne > .lx-avatar { grid-row: 1 / span 2; }
.lx-liste-groupee > .lx-personne > .lx-personne-corps { display: contents; }
.lx-liste-groupee > .lx-personne .lx-ligne-titre { grid-column: 2; grid-row: 1; font-size: 14px; font-weight: 400; color: var(--ap-label); text-decoration: none; }
.lx-liste-groupee > .lx-personne .lx-ligne-titre::after, .lx-rangee-lien::after { content: ""; position: absolute; inset: 0; }
.lx-liste-groupee > .lx-personne .lx-sous { grid-column: 2; grid-row: 2; margin: 0; font-size: 12.5px; color: var(--ap-label3); }
.lx-liste-groupee > .lx-personne .lx-puces { grid-column: 3; grid-row: 1 / span 2; display: flex; gap: 4px; }
.lx-liste-groupee > .lx-personne .lx-puce { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border: 0; border-radius: 999px; background: var(--ap-fill2); font-size: 11.5px; color: var(--ap-label2); }
.lx-liste-groupee > .lx-personne .lx-ligne-gestes { grid-column: 4; grid-row: 1 / span 2; position: relative; z-index: 1; }
.lx-liste-groupee :is(.lx-personne, .lx-rangee-personne, .lx-mandat-tete) > .lx-avatar { width: 36px; height: 36px; font-size: 12.5px; font-weight: 600; background: var(--lx-initiales); color: #fff; }
.lx-rangee-qui { display: flex; flex-direction: column; min-width: 0; }
.lx-rangee-qui small { font-size: 12.5px; color: var(--ap-label3); }
.lx-rangee-lien { color: var(--ap-label); text-decoration: none; }
.lx-rangee-lien:hover { color: var(--ap-label); text-decoration: none; }
.lx-liste-groupee > .lx-rangee-personne { gap: 12px; padding-right: 38px; }
.lx-titres { position: relative; margin-left: auto; display: flex; align-items: center; gap: 12px; color: var(--ap-label2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.lx-titres-barre { display: block; width: 90px; height: 6px; border-radius: 3px; background: var(--ap-fill); overflow: hidden; }
.lx-titres-barre i { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg, #22b393, var(--ap-tint)); transform-origin: 0 50%; animation: ap-pousse 1s var(--lx-ressort) both; }
@keyframes ap-pousse { from { transform: scaleX(0); } }
.lx-rangee-val { margin-left: auto; color: var(--ap-label2); text-align: right; }
.lx-rangee-val small { display: block; font-size: 12px; color: var(--ap-label3); }
.lx-rangee-note { padding: 11px 16px; border-top: .5px solid var(--ap-trait); font-size: 13px; color: var(--ap-label2); }
.lx-ecart { display: flex; align-items: center; gap: 10px; padding: 11px 16px; border-top: .5px solid var(--ap-trait); background: rgba(255, 149, 0, .07); font-size: 13px; color: #7a4300; }
.lx-ecart .lx-ic { width: 17px; height: 17px; color: var(--ap-orange); }
.lx-pied-groupe { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 12px; }
.lx-liste-groupee > * + .lx-pied-groupe, .lx-liste-groupee > * + form > .lx-pied-groupe { border-top: .5px solid var(--ap-trait); }
.lx-pied-groupe .btn:not(.btn-plein):not(.btn-nu):not(.btn-doux):not(.btn-danger), .lx-mandat .btn:not(.btn-plein):not(.btn-nu):not(.btn-doux):not(.btn-danger) {
  height: 32px; padding: 0 15px; gap: 7px; border-radius: 999px; font-size: 13.5px; font-weight: 500; }
.lx-pied-groupe .btn:not(.btn-plein):not(.btn-nu):not(.btn-doux):not(.btn-danger) { background: var(--ap-fill); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.lx-pied-groupe .btn:not(.btn-plein):not(.btn-nu):not(.btn-doux):not(.btn-danger):hover { background: rgba(120, 120, 128, .2); }
.lx-pied-groupe .btn .lx-ic { width: 17px; height: 17px; }
.lx-pied-droite { margin-left: auto; }
.lx-pied-groupe .btn.btn-danger.btn-nu { height: auto; padding: 0 6px; border: 0; background: none; box-shadow: none; color: var(--ap-rouge); font-size: 13.5px; font-weight: 500; }
/* le mandat : la carte de la personne, sa frise, le début, aujourd'hui, la fin */
.lx-mandat { padding: 14px 16px 16px; }
.lx-mandat-tete { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.lx-mandat-tete > .lx-avatar { width: 44px !important; height: 44px !important; font-size: 14px !important; }
.lx-mandat-tete .lx-rangee-lien { font-size: 15px; font-weight: 600; }
.lx-mandat-tete .lx-rangee-qui { position: relative; }
.lx-mandat-tete .lx-rangee-lien::after { inset: -4px; }
.lx-mandat-modifier { margin-left: auto; }
.lx-mandat-modifier > summary { list-style: none; }
.lx-mandat-modifier > summary::-webkit-details-marker { display: none; }
.lx-mandat-modifier[open] { flex-basis: 100%; order: 3; margin-left: 0; }
.lx-mandat-modifier[open] > summary { display: none; }
.lx-mandat-modifier .lx-mandat-infos { margin-top: 12px; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .08); }
.lx-mandat-tete .btn.btn-danger { height: 32px; padding: 0 15px; border: 0; border-radius: 999px; background: rgba(229, 55, 44, .1); box-shadow: none; color: var(--ap-rouge); font-size: 13.5px; font-weight: 500; }
.lx-mandat-tete form { margin: 0; }
.lx-mandat-tete:not(:has(.lx-mandat-modifier)) form { margin-left: auto; }
.lx-frise-mandat { position: relative; height: 8px; margin: 16px 0 6px; border-radius: 4px; background: var(--ap-fill); }
.lx-frise-mandat i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 4px; background: linear-gradient(90deg, #22b393, var(--ap-tint), var(--ap-orange)); transform-origin: 0 50%; animation: ap-pousse 1.2s var(--lx-ressort) both; }
.lx-frise-mandat b { position: absolute; top: 50%; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .1), 0 2px 6px rgba(0, 0, 0, .25); }
.lx-mandat-dates { display: flex; justify-content: space-between; margin-top: 6px; font-size: 12px; color: var(--ap-label3); }
.lx-mandat-dates b { color: var(--ap-orange); font-weight: 600; }
/* une pièce de la fiche (les statuts) en ligne : son nom, d'où elle vient, le dépôt à droite */
.lx-liste-groupee > .lx-rangee-depot { flex-wrap: wrap; }
.lx-rangee-depot .lx-gestes { margin-left: auto; }
.lx-rangee-depot .lx-depot { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 15px; border-radius: 999px; color: #fff; font-size: 13.5px; font-weight: 500; cursor: pointer;
  background: linear-gradient(180deg, color-mix(in srgb, var(--mz-vert-vif) 92%, #fff), var(--mz-vert) 55%, var(--mz-vert-fonce)); border: 0;
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .18), inset 0 1px 0 rgba(255, 255, 255, .38), 0 6px 16px -6px rgba(14, 107, 90, .45); }
.lx-rangee-depot > .lx-note { flex-basis: 100%; margin: 0; }
/* la feuille d'une personne : détachée du bord, 440 de large */
.lx-tiroir { top: 12px; right: 12px; bottom: 12px; width: min(440px, calc(100vw - 24px)); border-radius: 28px; }
@media (max-width: 1100px) { .lx-fiche-colonnes { grid-template-columns: 180px minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) { .lx-titres-barre i, .lx-frise-mandat i, :is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info.lx-info-edition { animation: none; } }
/* l'aide « ? » reste sur la ligne des étiquettes */
.lx-reperes > details.bulle { display: inline-flex; margin: 0; }
/* une tuile : la valeur sur une ligne, sa précision sur deux au plus */
.lx-resume-tuile strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lx-resume-tuile span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.lx-resume-tuile:has(.lx-resume-anneau) :is(strong, span) { margin-right: 52px; }
/* le nombre d'une vue, en petit gris */
.lx-maquette .lx-onglets .lx-compte { font-size: 11.25px; }
/* l'avis des points à vérifier : l'icône, la phrase en gras, « Voir » en verre */
.lx-maquette details.lx-avis-points > summary { display: flex; align-items: center; gap: 12px; padding: 0; list-style: none; }
.lx-maquette details.lx-avis-points > summary::before { content: ""; flex: none; width: 20px; height: 20px; background: var(--ap-orange);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4 3 19.5h18z'/%3E%3Cpath d='M12 10v4.5M12 17.3v.2'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4 3 19.5h18z'/%3E%3Cpath d='M12 10v4.5M12 17.3v.2'/%3E%3C/svg%3E") center / contain no-repeat; }
.lx-maquette details.lx-avis-points > summary > p { flex: 1; margin: 0; }
.lx-maquette details.lx-avis-points > summary > p strong { font-weight: 600; }
.lx-maquette details.lx-avis-points > summary > .btn { height: 32px; padding: 0 15px; border-radius: 999px; background: rgba(255, 255, 255, .75); color: var(--ap-label); font-size: 13.5px; font-weight: 500;
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1), inset 0 1px 0 #fff, 0 1px 3px rgba(0, 0, 0, .08); }
/* la page de la maquette : le texte en 14 sur 1,42, les blocs espacés par leurs propres marges */
.lx-maquette .fs { gap: 0; line-height: 1.42; letter-spacing: -.006em; }
.lx-maquette details.lx-avis-points > summary > p { text-align: left; }
.lx-a-ajouter > small { flex: 0 0 100%; }
.lx-resume-tuile, .lx-resume-tuile small { line-height: 1.42; }
.lx-maquette details.lx-avis-points > summary > .btn { min-height: 32px; display: inline-flex; align-items: center; }
.lx-a-ajouter > small { max-width: none; }
.lx-liste-groupee > .lx-personne { row-gap: 0; }
.lx-liste-groupee > .lx-personne :is(.lx-ligne-titre, .lx-sous) { line-height: 1.42; margin: 0; }
.lx-maquette details.lx-avis-points > summary { width: 100%; }
.lx-maquette details.lx-avis-points > summary > p, .lx-maquette details.lx-avis-points > summary > p strong { text-align: left; }
.lx-maquette details.lx-avis-points > summary > p strong { display: inline; }
/* une information ouverte sur place, comme la maquette : la case, « Annuler », le geste qui enregistre, sur une ligne */
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info-edition .lx-info-question { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info-edition :is(.lx-question, .lx-question > form, .lx-question > form > .lx-boutons, .lx-info-question > .lx-boutons) { display: contents; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info-edition .lx-question > :is(.lx-etiquette, .lx-question-texte) { display: none; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info-edition .lx-case:not([type="hidden"]) { order: 1; flex: 1 1 260px; height: 38px; padding: 0 12px; border: 0; border-radius: 11px; background: var(--ap-fill2);
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08); outline: none; font-size: 14px; transition: box-shadow .2s, background-color .2s; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info-edition .lx-case:not([type="hidden"]):focus { background: #fff; box-shadow: 0 0 0 1px var(--ap-tint), 0 0 0 4px var(--ap-tint-clair); }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info-edition [data-lx-renoncer] { order: 2; height: 32px; padding: 0 15px; border-radius: 999px; background: var(--ap-fill); color: var(--ap-label); font-size: 13.5px; font-weight: 500; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info-edition .btn-plein { order: 3; height: 32px; padding: 0 15px; border-radius: 999px; font-size: 13.5px; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info-edition details.bulle { order: 4; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info-edition > .lx-note { margin: 0 0 6px; font-size: 12.5px; color: var(--ap-label3); }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info-edition .lx-info-question { flex-direction: row; }
.lx-maquette details.lx-avis-points > summary::after { content: none; display: none; }
.lx-maquette details.lx-avis-points > summary > .btn { margin-left: auto; }
:is(details.lx-menu-rond, details.lx-equipe) > .menu-plus-liste { background: rgba(255, 255, 255, .58); backdrop-filter: blur(30px) saturate(200%); -webkit-backdrop-filter: blur(30px) saturate(200%); box-shadow: var(--ap-verre-bord), 0 0 0 .5px rgba(0, 0, 0, .08), 0 2px 6px rgba(0, 0, 0, .04), 0 16px 40px -14px rgba(0, 0, 0, .22); }
/* dans la feuille d'une personne, ses informations en liste groupée, une colonne */
.lx-tiroir .lx-infos, .lx-tiroir .lx-infos:not(.lx-infos-une) { display: block; border-radius: 20px; background: rgba(255, 255, 255, .78); box-shadow: var(--ap-ombre-groupe); overflow: hidden; }
.lx-tiroir .lx-infos > .lx-info > .lx-info-v { flex: 1 1 auto; }
/* « Modifier », « Historique » : au survol, posés sur la ligne, sans lui prendre de place */
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info > .lx-info-outils { position: absolute; z-index: 2; right: 34px; top: 50%; transform: translateY(-50%); padding: 3px 10px; border-radius: 999px;
  background: rgba(255, 255, 255, .92); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .08), 0 2px 8px rgba(0, 0, 0, .08); pointer-events: none; }
:is(.lx-liste-groupee, .lx-tiroir .lx-infos) > .lx-info:is(:hover, :focus-within) > .lx-info-outils { pointer-events: auto; }
/* le petit titre ne prend sa place qu'une fois le grand titre replié ; un nom long s'abrège */
.lx-barre-outils > .lx-pastille-verre:first-child { min-width: 0; overflow: hidden; }
.lx-petit-titre { max-width: 0; padding: 0; overflow: hidden; text-overflow: ellipsis; transition: opacity .25s, transform 400ms var(--lx-ressort), max-width 400ms var(--lx-glisse); }
body.ap-replie .lx-petit-titre { max-width: 40vw; padding: 0 12px 0 4px; }
.lx-barre-outils > .btn { flex: none; }
/* une opération de la société, en carte : l'icône, son nom et ses documents, l'anneau, l'étape, qui on attend, les gestes */
.lx-liste-groupee > .lx-operation { position: relative; display: flex; align-items: center; gap: 16px; padding: 16px; }
.lx-liste-groupee > .lx-operation + .lx-operation { border-top: .5px solid var(--ap-trait); }
.lx-operation-ic { display: grid; place-items: center; flex: none; width: 44px; height: 44px; border-radius: 13px; background: var(--ap-tint-clair); color: var(--ap-tint); }
.lx-operation-ic .lx-ic { width: 22px; height: 22px; }
.lx-operation .lx-rangee-lien { font-size: 15px; font-weight: 600; }
.lx-operation-fin { position: relative; z-index: 1; margin-left: auto; display: flex; align-items: center; gap: 14px; }
.lx-operation-anneau { width: 44px; height: 44px; transform: rotate(-90deg); }
.lx-operation-anneau circle { fill: none; stroke-width: 4.5; stroke: var(--ap-fill); }
.lx-operation-anneau circle + circle { stroke: var(--ap-tint); stroke-linecap: round; }
.lx-operation-dit { font-size: 12.5px; color: var(--ap-label2); }
.lx-operation-fin .btn { height: 32px; padding: 0 15px; border-radius: 999px; font-size: 13.5px; font-weight: 500; }
.lx-section .lx-pied-seul { margin-top: 0; }
/* un fichier : sa vignette, son nom et d'où il vient, « Ouvrir » */
.lx-section > header > .lx-section-compte { color: var(--ap-label3); }
.lx-liste-groupee > .lx-fichier { display: flex; align-items: center; gap: 12px; padding: 10px 16px; }
.lx-liste-groupee > .lx-fichier + .lx-fichier { border-top: .5px solid var(--ap-trait); }
.lx-fichier-vignette { display: grid; place-items: center; flex: none; width: 34px; height: 42px; border-radius: 6px; background: linear-gradient(180deg, #fff, #f3f3f5);
  box-shadow: 0 0 0 .5px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .06); font-size: 8.5px; font-weight: 700; color: var(--ap-rouge); }
.lx-fichier-vignette.lx-fichier-image { color: #2f7cf6; }
.lx-fichier .lx-rangee-qui small { font-size: 12px; }
.lx-fichier-gestes { margin-left: auto; display: flex; gap: 8px; }
.lx-fichier-gestes .btn { height: 32px; padding: 0 15px; border-radius: 999px; font-size: 13.5px; font-weight: 500; }
.lx-liste-groupee > .lx-personne .lx-puce.lx-puce-dirige { background: var(--ap-tint-clair); color: var(--ap-tint); font-weight: 600; }
/* la feuille d'une personne : la carte des grandes initiales en tête, le nom n'est plus répété au-dessus */
.lx-carte-personne { display: flex; align-items: center; gap: 14px; padding: 4px 4px 14px; animation: ap-monte 550ms var(--lx-ressort) both; }
.lx-carte-personne > .lx-avatar { width: 58px; height: 58px; font-size: 19px; font-weight: 600; background: var(--lx-initiales); color: #fff; }
.lx-carte-personne strong { display: block; font-size: 18px; font-weight: 700; letter-spacing: -.015em; }
.lx-carte-personne small { display: block; font-size: 12.5px; color: var(--ap-label2); }
.lx-tiroir:has(.lx-carte-personne) > header h3 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.lx-titre-groupe-feuille { margin: 16px 6px 6px; font-size: 12px; font-weight: 600; color: var(--ap-label3); }
.lx-tiroir .lx-liste-groupee { background: rgba(255, 255, 255, .78); }
.lx-tiroir .lx-a-ajouter { margin-top: 10px; border-radius: 20px; background: rgba(255, 255, 255, .78); box-shadow: var(--ap-ombre-groupe); }
.lx-tiroir .lx-infos + .lx-a-ajouter { margin-top: 0; border-top: .5px solid var(--ap-trait); border-radius: 0 0 20px 20px; }
.lx-tiroir .lx-infos:has(+ .lx-a-ajouter) { border-radius: 20px 20px 0 0; }
/* la croix d'une feuille : le rond de la maquette, la croix fine dedans (l'icône « fermer », une seule), sans cercle au repos */
.lx-tiroir > header .lx-fermer { display: grid; place-items: center; width: 32px; height: 32px; border: 0; border-radius: 50%; background: none; box-shadow: none; font-size: 0; color: var(--ap-label);
  transition: background-color .15s, transform 450ms var(--ap-ressort-vif); }
.lx-tiroir > header .lx-fermer .lx-ic { width: 17px; height: 17px; stroke-width: 1.7; }
.lx-tiroir > header .lx-fermer:hover { background: rgba(0, 0, 0, .06); }
.lx-tiroir > header .lx-fermer:active { transform: scale(.86); }
/* le survol des boutons, aux valeurs des maquettes : le vert s'éclaire de 7 %, le verre devient blanc */
.btn.btn-plein:hover { filter: brightness(1.07); }
.btn:not(.btn-plein):not(.btn-nu):not(.btn-doux):not(.btn-danger):hover { background: #fff; }

/* ---------------------------------------------------------------------------
   Lot AP7 · le fil d'une opération au détail près de sa maquette (`lots/maquettes/apple/fil-complet.html`,
   `lots/LOT-AP7-fil.md`). Partie 1 : l'écran en deux colonnes de verre (le fil, la poignée, le volet), la tête du fil,
   les messages, les jours, « Corriger », la barre où l'on écrit. Les valeurs sont celles de la maquette (`--apm-…`).
   --------------------------------------------------------------------------- */
main.page.nue:has(> .socle-fil.conv-v2) { padding: 0; }
main.page .socle-fil.conv-v2 { --mz-encre: var(--apm-label); --mz-encre-douce: var(--apm-label2); --mz-encre-tenue: var(--apm-label3); --mz-vert: var(--apm-tint);
  position: fixed; z-index: 1; inset: 12px 12px 12px calc(var(--menu, 64px) + 24px); display: block; width: auto; height: auto; min-height: 0; max-height: none; margin: 0; padding: 0;
  max-width: none; color: var(--apm-label); letter-spacing: -.006em; }
main.page .socle-fil.conv-v2 > .conv-corps { height: 100%; display: grid; grid-template-columns: minmax(0, 1fr) 12px var(--conv-volet, 360px); grid-template-rows: minmax(0, 1fr); gap: 0;
  align-items: stretch; transition: grid-template-columns .5s var(--apm-doux); }
main.page .socle-fil.conv-v2.conv-glisse > .conv-corps { transition: none; }
main.page .socle-fil.conv-v2.conv-volet-reduit > .conv-corps { grid-template-columns: minmax(0, 1fr) 0 0; }

/* la colonne du fil : une carte blanche aux angles de 26 */
main.page .socle-fil.conv-v2 .conv-fil { position: relative; display: block; min-width: 0; height: 100%; min-height: 0; border: 0; border-radius: 26px;
  background: rgba(255, 255, 255, .72); box-shadow: var(--apm-ombre-carte); overflow: hidden; }
main.page .socle-fil.conv-v2 .conv-fil::after { content: ""; position: absolute; z-index: 4; left: 0; right: 0; bottom: 0; height: 120px;
  background: linear-gradient(transparent, rgba(255, 255, 255, .9)); pointer-events: none; }

/* la tête : du verre en haut de la colonne, 64 de haut ; l'Ariane s'arrête à la société, le titre la complète */
main.page .socle-fil.conv-v2 .conv-haut { position: absolute; z-index: 5; top: 0; left: 0; right: 0; display: block; height: 64px; padding: 0 12px 0 22px;
  background: rgba(255, 255, 255, .66); backdrop-filter: var(--apm-flou); -webkit-backdrop-filter: var(--apm-flou); box-shadow: inset 0 -.5px 0 var(--apm-sep); }
main.page .socle-fil.conv-v2 .conv-fil-haut { height: 100%; }
main.page .socle-fil.conv-v2 .conv-haut > .lx-avis { position: absolute; top: 72px; left: 50%; width: min(720px, calc(100% - 56px)); transform: translateX(-50%); }
main.page .socle-fil.conv-v2 .conv-haut .lx-tete { display: flex; align-items: center; gap: 12px; height: 100%; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }
main.page .socle-fil.conv-v2 .conv-haut .lx-tete-texte { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
main.page .socle-fil.conv-v2 .conv-haut .lx-ariane { display: flex; flex-wrap: nowrap; align-items: center; gap: 4px; margin: 0; font-size: 12px; line-height: 1.25; color: var(--apm-label3); white-space: nowrap; }
main.page .socle-fil.conv-v2 .conv-haut .lx-ariane a { color: inherit; text-decoration: none; }
main.page .socle-fil.conv-v2 .conv-haut .lx-ariane a:hover { color: var(--apm-tint); text-decoration: none; }
main.page .socle-fil.conv-v2 .conv-haut .lx-ariane > [aria-current], main.page .socle-fil.conv-v2 .conv-haut .lx-ariane > .lx-sep:has(+ [aria-current]) { display: none; }
main.page .socle-fil.conv-v2 .conv-haut .lx-ariane > .lx-sep { width: 11px; height: 11px; font-size: 0; color: transparent; background: var(--apm-label3);
  -webkit-mask: var(--apm-chevron) center / contain no-repeat; mask: var(--apm-chevron) center / contain no-repeat; }
main.page .socle-fil.conv-v2 .conv-haut .lx-titre { display: flex; align-items: center; gap: 8px; margin: 0; min-width: 0; font-size: 15.5px; font-weight: 650; line-height: 1.25;
  letter-spacing: -.015em; white-space: nowrap; color: var(--apm-label); }
main.page .socle-fil.conv-v2 .conv-haut .lx-titre-mot { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.lx-tete-forme { flex: none; height: 20px; padding: 0 7px; border-radius: 6px; background: var(--apm-fill2); color: var(--apm-label2); font-size: 11px; font-weight: 600; line-height: 20px; letter-spacing: 0; }
main.page .socle-fil.conv-v2 .conv-haut .lx-tete > .lx-gestes { display: flex; align-items: center; gap: 6px; flex: none; margin: 0 0 0 auto; }
main.page .socle-fil.conv-v2 .conv-haut .lx-tete > .lx-gestes > .lx-note { font-size: 12.5px; color: var(--apm-label3); }
main.page .socle-fil.conv-v2 .conv-haut .lx-progression-bandeau { display: flex; align-items: center; gap: 6px; margin: 0; padding: 0; border: 0; background: none; }
main.page .socle-fil.conv-v2 .conv-haut .lx-progression { display: flex; align-items: center; gap: 0; margin: 0; }
/* « Reste N » : la pastille orange et son anneau */
.lx-reste { display: flex; align-items: center; gap: 8px; height: 32px; padding: 0 12px 0 6px; border-radius: 999px; background: var(--apm-orange-clair); font-size: 13px; color: var(--apm-orange-encre); white-space: nowrap; }
.lx-reste .lx-reste-mot { display: inline; height: auto; min-height: 0; padding: 0; border-radius: 0; background: none; font-size: 13px; font-weight: 400; color: inherit; }
.lx-reste .lx-reste-mot::before { content: none; }
.lx-reste .lx-reste-mot b { font-weight: 700; font-variant-numeric: tabular-nums; }
.lx-reste-anneau { width: 22px; height: 22px; transform: rotate(-90deg); }
.lx-reste-anneau circle { fill: none; stroke-width: 3.2; }
.lx-reste-anneau-fond { stroke: rgba(242, 138, 0, .2); }
.lx-reste-anneau-part { stroke: var(--apm-orange); stroke-linecap: round; transition: stroke-dasharray .8s var(--apm-ressort); }
/* les documents cochés, « Demander à Lexia » : des pilules grises */
main.page .socle-fil.conv-v2 .conv-haut .lx-progression-docs-replies > summary, main.page .socle-fil.conv-v2 .conv-haut .btn.btn-assistant.btn {
  display: flex; align-items: center; gap: 6px; height: 32px !important; min-height: 0 !important; padding: 0 12px !important; border: 0; border-radius: 999px !important; background: var(--apm-fill2);
  box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; color: var(--apm-label); font-size: 13px !important; font-weight: 400; white-space: nowrap; list-style: none; cursor: pointer;
  transition: background-color .15s, transform .45s var(--apm-ressort-vif); }
main.page .socle-fil.conv-v2 .conv-haut .lx-progression-docs-replies > summary::-webkit-details-marker { display: none; }
main.page .socle-fil.conv-v2 .conv-haut .lx-progression-docs-replies > summary::before { content: none; }
main.page .socle-fil.conv-v2 .conv-haut .lx-progression-docs-replies > summary::after { content: ""; width: 14px; height: 14px; background: var(--apm-label3);
  -webkit-mask: var(--apm-bas) center / contain no-repeat; mask: var(--apm-bas) center / contain no-repeat; }
main.page .socle-fil.conv-v2 .conv-haut :is(.lx-progression-docs-replies > summary, .btn-assistant):hover { background: var(--apm-fill); }
main.page .socle-fil.conv-v2 .conv-haut :is(.lx-progression-docs-replies > summary, .btn-assistant):active { transform: scale(.95); }
main.page .socle-fil.conv-v2 .conv-haut .btn-assistant .lx-ic { width: 14px; height: 14px; color: var(--apm-tint); }
/* l'icône est dans le bouton (la maquette) : l'ancienne, dessinée en masque, se retire */
main.page .socle-fil.conv-v2 .conv-haut :is(.btn-assistant, .conv-volet-icone, .conv-plus > summary)::before, main.page .socle-fil.conv-v2 .conv-haut :is(.btn-assistant, .conv-volet-icone)::after { content: none; }
/* le volet et « … » : des ronds de 32 ; le volet ouvert est marqué */
main.page .socle-fil.conv-v2 .conv-haut :is(.conv-volet-icone, .conv-plus > summary).btn { display: grid; place-items: center; width: 32px; height: 32px !important; min-height: 0 !important;
  padding: 0 !important; border: 0; border-radius: 50% !important; background: none; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; color: var(--apm-label); list-style: none;
  transition: background-color .15s, transform .45s var(--apm-ressort-vif); }
main.page .socle-fil.conv-v2 .conv-haut :is(.conv-volet-icone, .conv-plus > summary).btn:hover { background: rgba(0, 0, 0, .06); }
main.page .socle-fil.conv-v2 .conv-haut :is(.conv-volet-icone, .conv-plus > summary).btn:active { transform: scale(.86); }
main.page .socle-fil.conv-v2 .conv-haut .conv-volet-icone[aria-pressed="false"].btn { background: rgba(0, 0, 0, .08); }
main.page .socle-fil.conv-v2 .conv-haut :is(.conv-volet-icone, .conv-plus > summary) .lx-ic { width: 17px; height: 17px; stroke-width: 1.7; }

/* la conversation : elle défile sous la tête et la barre, en colonne de 720 */
main.page .socle-fil.conv-v2 .conv-defile { position: absolute; inset: 0; overflow-y: auto; padding: 84px 0 150px; background: none; scroll-behavior: smooth; }
main.page .socle-fil.conv-v2 .conv-defile > :is(.conv-messages, [data-maj="question"], .conv-suite) { width: min(720px, calc(100% - 56px)); max-width: none; margin: 0 auto; }
main.page .socle-fil.conv-v2 .conv-defile > .conv-messages { display: flex; flex-direction: column; gap: 14px; padding: 0; overflow: visible; }
main.page .socle-fil.conv-v2 .conv-defile > [data-maj="question"]:not(:empty) { margin-top: 14px; }
main.page .socle-fil.conv-v2 .conv-defile > .conv-suite:not(:empty) { display: flex; flex-direction: column; gap: 14px; margin-top: 14px; padding: 0; }
main.page .socle-fil.conv-v2 .conv-droits { position: absolute; z-index: 4; top: 72px; left: 50%; width: min(720px, calc(100% - 56px)); padding: 0; transform: translateX(-50%); }
/* un message de Lexia : son « L » vert, le texte sans bulle */
main.page .socle-fil.conv-v2 .conv-msg { display: flex; gap: 12px; align-items: flex-start; margin: 0; animation: apm-monte .55s var(--apm-ressort) both; }
main.page .socle-fil.conv-v2 .conv-av { display: grid; place-items: center; flex: none; width: 28px; height: 28px; border-radius: 9px; color: #fff; font-size: 13px; font-weight: 700;
  background: linear-gradient(160deg, #19a487, #0b5e4d); box-shadow: 0 2px 6px -2px rgba(15, 123, 101, .5); visibility: visible; }
main.page .socle-fil.conv-v2 .conv-lexia > .conv-bulle { min-width: 0; flex: 1; max-width: none; margin: 0; padding: 3px 0 0; border: 0; border-radius: 0; background: none; box-shadow: none; font-size: 14px; line-height: 1.45; color: var(--apm-label); }
main.page .socle-fil.conv-v2 .conv-lexia > .conv-bulle > p { margin: 0 0 6px; }
main.page .socle-fil.conv-v2 .conv-lexia > .conv-bulle > p:last-child { margin-bottom: 0; }
main.page .socle-fil.conv-v2 .conv-lexia .conv-qui { display: block; margin-bottom: 3px; font-size: 11.5px; color: var(--apm-label3); }
main.page .socle-fil.conv-v2 .conv-question-posee { animation: none; }
main.page .socle-fil.conv-v2 .conv-question-posee > .conv-bulle > p { font-size: 13.5px; color: var(--apm-label2); }
main.page .socle-fil.conv-v2 .conv-court > .conv-bulle > p { font-size: 13px; color: var(--apm-label2); }
main.page .socle-fil.conv-v2 .conv-lexia .lx-etiquette { display: block; margin: 10px 0 4px; font-size: 11.5px; font-weight: 600; color: var(--apm-label3); text-transform: none; letter-spacing: 0; }
main.page .socle-fil.conv-v2 .conv-connu { display: flex; flex-direction: column; gap: 3px; font-size: 13px; color: var(--apm-label2); }
main.page .socle-fil.conv-v2 .conv-connu b { color: var(--apm-label); font-weight: 500; }
main.page .socle-fil.conv-v2 .conv-afournir { margin: 0; padding: 0; border: 0; background: none; }
main.page .socle-fil.conv-v2 .conv-afournir ul { margin: 2px 0 0; padding-left: 18px; font-size: 13px; color: var(--apm-label2); }
main.page .socle-fil.conv-v2 .conv-afournir li { margin: 1px 0; }
main.page .socle-fil.conv-v2 .conv-lexia .lx-note { font-size: 12.5px; color: var(--apm-label3); }
main.page .socle-fil.conv-v2 .conv-lexia details.lx-replie > summary { font-size: 12.5px; color: var(--apm-tint); }
main.page .socle-fil.conv-v2 .conv-rep-liste { margin: 6px 0 0; padding-left: 18px; font-size: 12.5px; color: var(--apm-label2); }
/* une réponse : la bulle verte à droite, « Corriger » devant elle au survol */
main.page .socle-fil.conv-v2 .conv-moi { display: flex; flex-direction: row; max-width: none; justify-content: flex-end; align-items: center; gap: 8px; transform-origin: 100% 100%; animation: apm-pop .5s var(--apm-ressort-vif) both; }
main.page .socle-fil.conv-v2 .conv-moi > .conv-bulle, main.page .socle-fil.conv-v2 .conv-qui-moi > .conv-bulle { max-width: 70%; margin: 0; padding: 9px 14px; border: 0; border-radius: 20px 20px 6px 20px;
  background: linear-gradient(180deg, #1aa688, var(--apm-tint)); color: #fff; font-size: 14px; line-height: 1.45; box-shadow: 0 6px 16px -8px rgba(15, 123, 101, .6), inset 0 1px 0 rgba(255, 255, 255, .25);
  overflow-wrap: anywhere; }
main.page .socle-fil.conv-v2 :is(.conv-moi, .conv-qui-moi) > .conv-bulle p { margin: 0; color: inherit; }
main.page .socle-fil.conv-v2 .conv-moi > .conv-bulle .lx-note { opacity: .8; font-size: 12.5px; color: inherit; }
main.page .socle-fil.conv-v2 .conv-moi > .conv-bulle ul { margin: 2px 0 0; padding-left: 16px; color: inherit; } main.page .socle-fil.conv-v2 .conv-moi > .conv-bulle li { color: inherit; }
main.page .socle-fil.conv-v2 .conv-moi > .conv-bulle s { display: block; opacity: .65; font-size: 12.5px; }
main.page .socle-fil.conv-v2 .conv-corriger { opacity: 0; font-size: 12.5px; color: var(--apm-tint); text-decoration: none; transition: opacity .2s; }
main.page .socle-fil.conv-v2 .conv-moi:hover .conv-corriger, main.page .socle-fil.conv-v2 .conv-corriger:focus { opacity: 1; }
/* un message libre : qui et quand au-dessus, la bulle grise, les initiales à droite */
main.page .socle-fil.conv-v2 .conv-qui-moi { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; max-width: 76%; }
main.page .socle-fil.conv-v2 .conv-qui-moi > .conv-bulle { max-width: 100%; white-space: pre-line; }
main.page .socle-fil.conv-v2 .conv-qui-moi > .conv-bulle.conv-libre { background: #e9e9ee; color: var(--apm-label); box-shadow: none; }
main.page .socle-fil.conv-v2 .conv-qui-moi > small { margin: 0; font-size: 11.5px; color: var(--apm-label3); }
main.page .socle-fil.conv-v2 .conv-av.conv-av-moi { width: 28px; height: 28px; border-radius: 50%; background: var(--lx-initiales); box-shadow: none; font-size: 11px; font-weight: 600; }
/* le jour : un trait de chaque côté */
main.page .socle-fil.conv-v2 .lx-jour { display: flex; align-items: center; gap: 12px; margin: 6px 0 -2px; padding: 0; font-size: 11.5px; font-weight: 600; color: var(--apm-label3); background: none; }
main.page .socle-fil.conv-v2 .lx-jour::before, main.page .socle-fil.conv-v2 .lx-jour::after { content: ""; flex: 1; height: .5px; background: var(--apm-sep); }
main.page .socle-fil.conv-v2 .lx-jour > span { padding: 0; background: none; }
@keyframes apm-pop { from { opacity: 0; transform: translateY(18px) scale(.7); } 40% { opacity: 1; } }

/* la barre où l'on écrit : du verre à 18 du bas, 720 de large ; le trombone, la saisie, « ? », le micro, l'envoi */
main.page .socle-fil.conv-v2 [data-maj="message"] > form.conv-compo { position: absolute; z-index: 6; left: 50%; bottom: 18px; width: min(720px, calc(100% - 56px)); max-width: none; margin: 0; padding: 0;
  transform: translateX(-50%); background: none; border: 0; box-shadow: none; }
main.page .socle-fil.conv-v2 .conv-compo .conv-compo-in { display: flex; align-items: flex-end; gap: 4px; min-height: 0; padding: 6px; border: 0; border-radius: 26px; background: rgba(255, 255, 255, .75);
  backdrop-filter: var(--apm-flou); -webkit-backdrop-filter: var(--apm-flou); box-shadow: var(--apm-liser), var(--apm-ombre-verre); transition: box-shadow .25s, opacity .3s, filter .3s; }
main.page .socle-fil.conv-v2 .conv-compo .conv-compo-in:focus-within { box-shadow: var(--apm-liser), 0 0 0 1px var(--apm-tint), 0 0 0 4px var(--apm-tint-clair), var(--apm-ombre-verre); }
main.page .socle-fil.conv-v2 .conv-compo textarea { flex: 1; min-height: 40px; max-height: 140px; margin: 0; padding: 10px 8px; border: 0; outline: none; resize: none; background: transparent; box-shadow: none;
  font-size: 14.5px; line-height: 1.35; color: var(--apm-label); }
main.page .socle-fil.conv-v2 .conv-compo :is(.conv-joindre, .conv-trombone > summary, .conv-compo-in > details.bulle > summary) { display: grid; place-items: center; flex: none; width: 40px; height: 40px !important;
  min-height: 0 !important; margin: 0; padding: 0 !important; border: 0; border-radius: 50% !important; background: none; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none;
  color: var(--apm-label2); font-size: 0; list-style: none; cursor: pointer; transition: background-color .15s, transform .45s var(--apm-ressort-vif); }
main.page .socle-fil.conv-v2 .conv-compo :is(.conv-joindre, .conv-trombone > summary, .conv-compo-in > details.bulle > summary):hover { background: rgba(0, 0, 0, .06); }
main.page .socle-fil.conv-v2 .conv-compo :is(.conv-joindre, .conv-trombone > summary, .conv-compo-in > details.bulle > summary):active { transform: scale(.86); }
main.page .socle-fil.conv-v2 .conv-compo :is(.conv-joindre, .conv-trombone > summary) svg { width: 17px; height: 17px; stroke-width: 1.7; }
main.page .socle-fil.conv-v2 .conv-compo .conv-compo-in > details.bulle > summary::before { content: ""; width: 17px; height: 17px; background: currentColor;
  -webkit-mask: var(--apm-question) center / contain no-repeat; mask: var(--apm-question) center / contain no-repeat; }
main.page .socle-fil.conv-v2 .conv-compo .conv-compo-in > details.bulle { align-self: flex-end; }
main.page .socle-fil.conv-v2 .conv-compo .conv-envoyer { display: grid; place-items: center; flex: none; width: 40px; height: 40px; margin: 0; padding: 0; border: 0; border-radius: 50%; background: var(--apm-fill);
  color: var(--apm-label3); box-shadow: none; cursor: pointer; transition: background-color .25s, color .25s, transform .45s var(--apm-ressort-vif); }
main.page .socle-fil.conv-v2 .conv-compo .conv-envoyer .lx-ic { width: 17px; height: 17px; stroke-width: 2.2; }
main.page .socle-fil.conv-v2 .conv-compo:has(textarea:not(:placeholder-shown)) .conv-envoyer { background: linear-gradient(180deg, #1aa688, var(--apm-tint)); color: #fff; box-shadow: 0 4px 12px -4px rgba(15, 123, 101, .6); }
main.page .socle-fil.conv-v2 .conv-compo .conv-envoyer:active { transform: scale(.85); }
/* la barre fermée, le temps d'une proposition ou d'une lecture */
main.page .socle-fil.conv-v2 .conv-compo.conv-compo-pause .conv-compo-in { opacity: .78; filter: saturate(.3); }
main.page .socle-fil.conv-v2 .conv-compo.conv-compo-pause :is(textarea, .conv-envoyer) { pointer-events: none; }
main.page .socle-fil.conv-v2 .conv-compo.conv-compo-pause textarea::placeholder { color: var(--apm-orange-encre); }

/* la poignée entre le fil et le volet ; le volet, une colonne de verre */
main.page .socle-fil.conv-v2 .conv-separateur { display: grid; place-items: center; cursor: col-resize; }
main.page .socle-fil.conv-v2 .conv-separateur::before { content: none; }
main.page .socle-fil.conv-v2 .conv-separateur::after { content: ""; width: 4px; height: 36px; border-radius: 2px; background: rgba(0, 0, 0, .1); opacity: 0; transition: opacity .2s; }
main.page .socle-fil.conv-v2 .conv-separateur:is(:hover, :focus-visible)::after, main.page .socle-fil.conv-v2.conv-glisse .conv-separateur::after { opacity: 1; }
main.page .socle-fil.conv-v2 .conv-volet { position: static; display: flex; flex-direction: column; min-width: 0; height: 100%; min-height: 0; padding: 0; overflow: hidden; border-radius: 26px;
  background: var(--apm-verre); backdrop-filter: var(--apm-flou); -webkit-backdrop-filter: var(--apm-flou); box-shadow: var(--apm-liser), var(--apm-ombre-verre); transition: opacity .3s; }
main.page .socle-fil.conv-v2.conv-volet-reduit .conv-volet { display: flex; opacity: 0; }
main.page .socle-fil.conv-v2 .conv-volet > .lx-onglets { flex: none; margin: 14px 12px 6px; }
main.page .socle-fil.conv-v2 .conv-volet-corps { flex: 1; min-height: 0; overflow-y: auto; padding: 8px 12px 18px; }
/* les écarts relevés à la comparaison (partie 1) : le bloc du titre centré sans interligne, « Réponses complètes » en vert,
   les pilules en 13 maigre, la barre et l'envoi de 40, les messages sans fond, les onglets du volet en segment de 30 */
main.page .socle-fil.conv-v2 .conv-haut .lx-tete-texte { gap: 0; align-self: center; }
main.page .socle-fil.conv-v2 .conv-fil-haut, main.page .socle-fil.conv-v2 .conv-haut .lx-tete { height: 64px; margin: 0; padding-top: 0; padding-bottom: 0; }
main.page .socle-fil.conv-v2 .conv-haut .lx-tete-texte > * { margin: 0; }
.lx-reste.lx-reste-fini { background: var(--apm-tint-clair); color: var(--apm-tint); }
.lx-reste.lx-reste-fini .lx-reste-anneau-part { stroke: var(--apm-tint); }
.lx-reste.lx-reste-fini .lx-reste-anneau-fond { stroke: rgba(15, 123, 101, .2); }
/* `refonte.css` impose 13,5 en `!important` aux boutons ; la pilule de la maquette est en 13 */
main.page .socle-fil.conv-v2 .conv-haut .conv-fil-haut .btn.btn-assistant.btn.btn.btn { font-size: 13px !important; font-weight: 400 !important; }
main.page .socle-fil.conv-v2 .conv-defile > .conv-messages { background: none; }
main.page .socle-fil.conv-v2 .conv-lexia > .conv-bulle > p.conv-intro { margin: 0 0 6px; font-size: 14px; font-weight: 400; line-height: 1.45; color: var(--apm-label); letter-spacing: -.006em; }
main.page .socle-fil.conv-v2 .conv-lexia > .conv-bulle > p.conv-intro b { font-weight: 700; }
main.page .socle-fil.conv-v2 .conv-compo textarea { height: 40px; min-height: 40px !important; border-radius: 0 !important; }
main.page .socle-fil.conv-v2 form.conv-compo .conv-envoyer.conv-envoyer { width: 40px !important; height: 40px !important; min-height: 0 !important; border-radius: 50% !important; }
main.page .socle-fil.conv-v2 .conv-volet > .lx-onglets:not(.lx-sous-menu) { display: flex; align-self: stretch; width: auto; height: 30px; margin: 14px 12px 6px; padding: 2px; gap: 0; border-radius: 999px;
  background: var(--apm-fill); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
main.page .socle-fil.conv-v2 .conv-volet > .lx-onglets:not(.lx-sous-menu) > :is(a, button) { flex: 1; height: 26px; min-height: 0; padding: 0 6px; border: 0; border-radius: 999px; background: none;
  font-size: 12.5px; font-weight: 400; line-height: 26px; color: var(--apm-label2); white-space: nowrap; transition: color .2s; }
main.page .socle-fil.conv-v2 .conv-volet > .lx-onglets:not(.lx-sous-menu) > :is([aria-current], [aria-selected="true"]) { color: var(--apm-label); font-weight: 500; }
main.page .socle-fil.conv-v2 .conv-volet > .lx-onglets:not(.lx-sous-menu) > :is([aria-current], [aria-selected="true"])::before { background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 0 0 .5px rgba(0, 0, 0, .04); }
/* Othmane, 2026-10-30 · chaque mot centré dans sa part du segment, quelle que soit la largeur du volet ; le compte des
   contrôles qui attendent, une pastille rouge comme les notifications du menu, qui bat quand un contrôle vient s'y
   ranger (`fil.js`) */
main.page .socle-fil.conv-v2 .conv-volet > .lx-onglets:not(.lx-sous-menu) { flex-wrap: nowrap; }
main.page .socle-fil.conv-v2 .conv-volet > .lx-onglets:not(.lx-sous-menu) > :is(a, button) { justify-content: center; gap: 3px; padding: 0 4px; }
main.page .socle-fil.conv-v2 .conv-volet > .lx-onglets .lx-compte { min-width: 15px; height: 15px; margin: 0; padding: 0 4px; border-radius: 8px;
  background: #e5372c; color: #fff; font-size: 10px; font-weight: 600; line-height: 15px; text-align: center; font-variant-numeric: tabular-nums; }
.lx-compte.lx-bat { animation: lx-bat 560ms var(--ap-ressort-vif); }
@keyframes lx-bat { 0% { transform: scale(1); } 30% { transform: scale(1.5); } 100% { transform: scale(1); } }
/* Le contrôle qui arrive : une notification de verre en haut du volet, qui se range ensuite dans l'onglet Contrôles */
.lx-annonce { position: fixed; z-index: 60; display: flex; align-items: flex-start; gap: 10px; width: 320px; padding: 12px 14px; border-radius: 18px;
  background: rgba(255, 255, 255, .72); backdrop-filter: blur(30px) saturate(200%); -webkit-backdrop-filter: blur(30px) saturate(200%);
  box-shadow: var(--ap-liser), 0 0 0 .5px rgba(0, 0, 0, .08), 0 18px 44px -14px rgba(0, 0, 0, .28); cursor: pointer;
  transform-origin: top center; animation: lx-annonce-vient 560ms var(--ap-ressort-vif) both; }
.lx-annonce-ic { display: grid; place-items: center; flex: none; width: 28px; height: 28px; border-radius: 8px; background: #ff9f0a; color: #fff; }
.lx-annonce-ic .lx-ic { width: 16px; height: 16px; }
.lx-annonce-texte { min-width: 0; font-size: 13px; line-height: 1.35; color: var(--ap-label); }
.lx-annonce-texte b { display: block; font-size: 12px; font-weight: 600; color: var(--ap-label2); }
.lx-annonce-texte span { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
@keyframes lx-annonce-vient { from { opacity: 0; transform: translateY(-14px) scale(.92); filter: blur(4px); } 45% { opacity: 1; filter: none; } }
@media (prefers-reduced-motion: reduce) { .lx-annonce, .lx-compte.lx-bat { animation: none; } }
/* Lot AP7 · le corps du fil au texte de la maquette (`body` de commun.css : 14px/1.45) ; « Corriger » est un lien nu. */
main.page .socle-fil.conv-v2 { font-size: 14px; line-height: 1.45; letter-spacing: -.006em; }
main.page .socle-fil.conv-v2 .conv-messages > .conv-msg { width: 100%; max-width: none; }
main.page .socle-fil.conv-v2 .conv-moi .conv-corriger { padding: 0; border-radius: 0; background: none; }
/* La tête : « Reste N » prend la largeur de sa pastille, le titre se coupe en « … » avant les gestes. */
main.page .socle-fil.conv-v2 .conv-haut .lx-progression { width: auto; min-width: 0; max-width: none; flex: none; }
main.page .socle-fil.conv-v2 .conv-haut .lx-titre { max-width: 100%; }
main.page .socle-fil.conv-v2 .conv-haut .btn-assistant > svg { margin: 0; }
/* Le premier message : un texte suivi (bloc), « Déjà connu » et ses lignes espacées de 3, la liste à puces serrée. */
main.page .socle-fil.conv-v2 .conv-lexia > .conv-bulle { display: block; }
main.page .socle-fil.conv-v2 .conv-connu { display: block; }
main.page .socle-fil.conv-v2 .conv-connu > span:not(.lx-etiquette) { display: block; }
main.page .socle-fil.conv-v2 .conv-connu > span:not(.lx-etiquette) + span { margin-top: 3px; }
main.page .socle-fil.conv-v2 .conv-afournir, main.page .socle-fil.conv-v2 .conv-afournir ul { display: block; }
main.page .socle-fil.conv-v2 .conv-afournir > .lx-note { display: block; margin-top: 6px; }

/* ==========================================================================================================
   Lot AP7 · partie 2 : la question en cours (`fil-complet.html`, `.question`). La carte verte claire porte le thème et
   son dessin, la question en titre, ses boutons « verre » (« plein » pour le geste attendu : Aujourd'hui, À l'unanimité,
   Valider), la ligne « La réponse se tape dans la barre du bas » et, sous un trait, « Répondre plus tard ».
   ========================================================================================================== */
main.page .socle-fil.conv-v2 .conv-question-lexia { margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }
main.page .socle-fil.conv-v2 .conv-question-lexia > .conv-msg > .conv-bulle-question { padding: 16px 18px; border-radius: 20px;
  background: linear-gradient(180deg, rgba(15, 123, 101, .07), rgba(15, 123, 101, .035)); box-shadow: inset 0 0 0 .5px rgba(15, 123, 101, .18);
  animation: apm-question .6s var(--apm-ressort) both; }
main.page .socle-fil.conv-v2 .conv-question-lexia > .conv-msg { margin-top: 0; }
@keyframes apm-question { from { opacity: 0; transform: translateY(16px) scale(.97); filter: blur(4px); } 40% { filter: none; } }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-question { margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-question > .lx-etiquette { display: inline-flex; align-items: center; gap: 6px; margin: 0 0 6px; font-size: 11.5px; font-weight: 600;
  line-height: 1.45; letter-spacing: 0; text-transform: none; color: var(--apm-tint); }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-question > .lx-etiquette .lx-ic { width: 14px; height: 14px; }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-question-texte { margin: 0; font-size: 16px; font-weight: 600; line-height: 1.35; letter-spacing: -.012em; color: var(--apm-label); }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-boutons { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 12px 0 0; }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-boutons:empty, main.page .socle-fil.conv-v2 .conv-bulle-question .lx-boutons:not(:has(> :not(.visuellement-cache))) { display: none; }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-ou { display: flex; align-items: center; gap: 6px; margin: 10px 0 0; font-size: 12.5px; color: var(--apm-label3); }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-ou .lx-ic { width: 14px; height: 14px; }
/* les boutons de la question : « verre », et « plein » pour le geste attendu ; 34 de haut (`.choix .bouton`) */
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-boutons .btn.btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 0 !important; height: 34px !important;
  padding: 0 16px !important; border: 0; border-radius: 999px !important; font-size: 13.5px !important; font-weight: 500; line-height: 1.45 !important; white-space: nowrap; text-decoration: none;
  color: var(--apm-label); background: rgba(255, 255, 255, .78); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1), inset 0 1px 0 #fff, 0 1px 3px rgba(0, 0, 0, .08);
  transition: transform .45s var(--apm-ressort-vif), filter .2s, background-color .2s, box-shadow .2s, color .2s; }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-boutons .btn.btn:not(.btn-plein):hover { background: #fff; box-shadow: inset 0 0 0 1px var(--apm-tint), 0 4px 12px -6px rgba(15, 123, 101, .5); color: var(--apm-tint); }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-boutons .btn.btn:active { transform: scale(.94); transition-duration: .08s; }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-boutons .btn.btn-plein { color: #fff; background: linear-gradient(180deg, #1aa688, var(--apm-tint) 60%, #0b6654);
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .15), inset 0 1px 0 rgba(255, 255, 255, .4), inset 0 -1px 1px rgba(0, 0, 0, .12), 0 4px 14px -4px rgba(15, 123, 101, .55); }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-boutons .btn.btn-plein:hover { filter: brightness(1.07); }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-boutons .btn .lx-ic { width: 17px; height: 17px; }
/* le « ? » d'une question : un rond de 20, gris, dans la ligne */
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-boutons details.bulle > summary { display: inline-grid; place-items: center; width: 20px; height: 20px; margin-left: 4px; border-radius: 50%; color: var(--apm-label3); }
/* « Répondre plus tard », sous un trait vert dans la carte */
main.page .socle-fil.conv-v2 .conv-bulle-question > .conv-passer { margin: 12px 0 0; padding: 10px 0 0; border-top: .5px solid rgba(15, 123, 101, .15); }
main.page .socle-fil.conv-v2 .conv-bulle-question > .conv-passer > summary { list-style: none; cursor: pointer; font-size: 12.5px; color: var(--apm-tint); }
main.page .socle-fil.conv-v2 .conv-bulle-question > .conv-passer > summary::-webkit-details-marker { display: none; }
main.page .socle-fil.conv-v2 .conv-bulle-question > .conv-passer > .lx-boutons { margin-top: 8px; }
/* La carte d'un rôle (`.role`) : une ligne par personne, ses initiales, son nom et ce qu'elle apporte, son état en pastille,
   Modifier et Retirer en liens ; « Ajouter un … » en bouton de verre ; la vignette sur fond gris ; le pied, la note à gauche. */
main.page .socle-fil.conv-v2 .lx-role .vg-question { margin: 12px 0 0; border-radius: 16px; background: rgba(255, 255, 255, .9); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .06); overflow: hidden; }
main.page .socle-fil.conv-v2 .lx-role .vg-liste { display: block; margin: 0; padding: 0; }
main.page .socle-fil.conv-v2 .lx-role .vg-ligne { display: flex; align-items: center; gap: 12px; max-width: none; padding: 10px 12px; border: 0; border-radius: 0; background: none; animation: apm-monte .4s var(--apm-ressort) both; }
main.page .socle-fil.conv-v2 .lx-role :is(.vg-ligne, .vg-vignette, .vg-outils) + :is(.vg-ligne, .vg-vignette, .vg-outils),
main.page .socle-fil.conv-v2 .lx-role .vg-liste:not(:empty) + [data-vg-zone] > .vg-vignette,
main.page .socle-fil.conv-v2 .lx-role .vg-liste:not(:empty) ~ .vg-outils:not([hidden]) { border-top: .5px solid var(--apm-sep); }
main.page .socle-fil.conv-v2 .lx-role .vg-init { width: 32px; height: 32px; font-size: 11.5px; font-weight: 600; color: #fff; background: linear-gradient(160deg, #b4b8c0, #868b95); box-shadow: none; }
main.page .socle-fil.conv-v2 .lx-role .vg-qui { display: flex; flex-direction: column; line-height: 1.3; }
main.page .socle-fil.conv-v2 .lx-role .vg-qui strong { font-size: 14px; font-weight: 500; color: var(--apm-label); }
main.page .socle-fil.conv-v2 .lx-role .vg-qui span { font-size: 12px; color: var(--apm-label3); }
main.page .socle-fil.conv-v2 .lx-role .vg-etat { display: inline-flex; align-items: center; gap: 6px; height: 22px; padding: 0 9px; border-radius: 999px; box-shadow: none; font-size: 12px; font-weight: 500;
  letter-spacing: 0; background: var(--apm-tint-clair); color: var(--apm-tint); }
main.page .socle-fil.conv-v2 .lx-role .vg-etat::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
main.page .socle-fil.conv-v2 .lx-role .vg-etat.vg-manque { background: var(--apm-orange-clair); color: var(--apm-orange-encre); }
main.page .socle-fil.conv-v2 .lx-role .vg-ligne .lien { padding: 0 4px; font-size: 12.5px; font-weight: 500; color: var(--apm-tint); text-decoration: none; }
main.page .socle-fil.conv-v2 .lx-role .vg-ligne .lien:hover { color: #12957a; text-decoration: none; }
main.page .socle-fil.conv-v2 .lx-role .vg-ligne .lien[data-vg-retirer] { color: #e5372c; }
main.page .socle-fil.conv-v2 .lx-role .vg-outils { display: flex; align-items: center; gap: 12px; padding: 10px 12px; }
main.page .socle-fil.conv-v2 .lx-role .vg-outils .btn.btn { height: 30px !important; min-height: 0 !important; padding: 0 15px !important; border: 0; border-radius: 999px !important; font-size: 13.5px !important; font-weight: 500;
  color: var(--apm-label); background: rgba(255, 255, 255, .78); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1), inset 0 1px 0 #fff, 0 1px 3px rgba(0, 0, 0, .08); }
main.page .socle-fil.conv-v2 .lx-role .vg-outils .lx-note, main.page .socle-fil.conv-v2 .lx-role .vg-pied .lx-note { font-size: 12.5px; color: var(--apm-label3); }
main.page .socle-fil.conv-v2 .lx-role .vg-pied { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0; padding: 10px 12px; border-top: .5px solid var(--apm-sep); }
main.page .socle-fil.conv-v2 .lx-role .vg-pied .lx-note { margin-right: auto; }
main.page .socle-fil.conv-v2 .lx-role .vg-vignette { margin: 0; padding: 14px; border: 0; border-radius: 0; background: #f2f2f7; box-shadow: none; animation: apm-ouvre .45s var(--apm-ressort) both; transform-origin: top; }
@keyframes apm-ouvre { from { opacity: 0; transform: scaleY(.85); } }
main.page .socle-fil.conv-v2 .lx-role .vg-tete h4 { margin: 0 0 10px; font-size: 14px; font-weight: 600; }
main.page .socle-fil.conv-v2 .lx-role .vg-cases { grid-template-columns: 1fr 1fr; gap: 8px 10px; }
main.page .socle-fil.conv-v2 .lx-role .vg-case label, main.page .socle-fil.conv-v2 .lx-role .vg-case .vg-lib { font-size: 12px; color: var(--apm-label2); }
main.page .socle-fil.conv-v2 .lx-role .vg-case :is(input, select) { height: 34px; padding: 0 12px; border: 0; border-radius: 11px; background: #fff; box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08); }
main.page .socle-fil.conv-v2 .lx-role .vg-case :is(input, select):focus { box-shadow: 0 0 0 1px var(--apm-tint), 0 0 0 4px var(--apm-tint-clair); }
main.page .socle-fil.conv-v2 .lx-role .vg-case.vg-vide :is(input, select) { box-shadow: 0 0 0 1.5px var(--apm-orange); background: #fffaf2; }
main.page .socle-fil.conv-v2 .lx-role .vg-depot { height: 36px; padding: 0 15px; border: 0; border-radius: 999px; background: #fff; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .1); color: var(--apm-label); font-size: 13.5px; font-weight: 500; }
main.page .socle-fil.conv-v2 .lx-role .vg-chercher input { height: 38px; border: 0; border-radius: 11px; background: #fff; box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08); }
main.page .socle-fil.conv-v2 .lx-role .vg-ou { font-size: 12.5px; color: var(--apm-label3); }
main.page .socle-fil.conv-v2 .lx-role .vg-bas { margin-top: 12px; padding-top: 0; border-top: 0; }
/* le thème est sa propre ligne (6 au-dessus de la question) ; « Répondre plus tard » en lien simple */
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-question > .lx-etiquette { display: flex; width: fit-content; }
main.page .socle-fil.conv-v2 .conv-bulle-question > .conv-passer > summary { margin: 0; font-weight: 400; }
/* Les avis du fil (`.avis` de la maquette) : un fond de leur couleur, leur dessin devant, 13 sur 1,4 ; l'attente en orange,
   le refus en rouge, le succès en vert (coche), l'information en gris (« ? »). */
main.page .socle-fil.conv-v2 .lx-avis { display: flex; gap: 10px; justify-content: flex-start; align-items: flex-start; margin: 8px 0; padding: 10px 12px; border: 0; border-radius: 14px; box-shadow: none;
  font-size: 13px; line-height: 1.4; background: var(--apm-fill2); color: var(--apm-label2); }
main.page .socle-fil.conv-v2 .lx-avis::before { content: ""; flex: none; width: 17px; height: 17px; margin-top: 1px; background: currentColor;
  -webkit-mask: var(--apm-question) center / contain no-repeat; mask: var(--apm-question) center / contain no-repeat; }
main.page .socle-fil.conv-v2 .lx-avis > p { flex: 1; min-width: 0; margin: 0; padding: 0; text-align: left; }
main.page .socle-fil.conv-v2 .lx-avis-attente { background: var(--apm-orange-clair); color: #7a4500; }
main.page .socle-fil.conv-v2 .lx-avis-attente::before { background: var(--apm-orange); }
main.page .socle-fil.conv-v2 .lx-avis-erreur { background: rgba(229, 55, 44, .09); color: #9b1c14; }
main.page .socle-fil.conv-v2 .lx-avis-erreur::before { background: #e5372c; }
main.page .socle-fil.conv-v2 :is(.lx-avis-attente, .lx-avis-erreur)::before {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4 3 19.5h18z'/%3E%3Cpath d='M12 10v4.5M12 17.3v.2'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4 3 19.5h18z'/%3E%3Cpath d='M12 10v4.5M12 17.3v.2'/%3E%3C/svg%3E") center / contain no-repeat; }
main.page .socle-fil.conv-v2 .lx-avis-succes { background: var(--apm-tint-clair); color: #0b5e4d; }
main.page .socle-fil.conv-v2 .lx-avis-succes::before { background: var(--apm-tint); -webkit-mask: var(--apm-coche) center / contain no-repeat; mask: var(--apm-coche) center / contain no-repeat; }
main.page .socle-fil.conv-v2 .lx-avis .btn.btn { height: 28px !important; min-height: 0 !important; padding: 0 12px !important; font-size: 12.5px !important; border-radius: 999px !important; }
main.page .socle-fil.conv-v2 .lx-role .vg-suggestions { top: 44px; padding: 0; border-radius: 12px; background: #fff; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .08), 0 12px 30px -12px rgba(0, 0, 0, .2); overflow: hidden; }
main.page .socle-fil.conv-v2 .lx-role .vg-suggestions li button { padding: 8px 12px; border-radius: 0; font-size: 13px; }
main.page .socle-fil.conv-v2 .lx-role .vg-suggestions li button:is(:hover, :focus-visible) { background: var(--apm-tint); color: #fff; }
main.page .socle-fil.conv-v2 .lx-role .vg-suggestions li button:is(:hover, :focus-visible) small { color: rgba(255, 255, 255, .8); }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-boutons details.bulle > summary { min-width: 0; padding: 0; border: 0; background: none; box-shadow: none; font-size: 0; cursor: pointer; }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-boutons details.bulle > summary::before { content: ""; width: 17px; height: 17px; background: currentColor;
  -webkit-mask: var(--apm-question) center / contain no-repeat; mask: var(--apm-question) center / contain no-repeat; }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-boutons details.bulle > summary:hover { color: var(--apm-tint); background: rgba(255, 255, 255, .7); }

/* ==========================================================================================================
   Lot AP7 · partie 3 : le volet (`fil-complet.html`, `.volet`, `.cadre`, `.groupe`, `.lv`). Chaque cadre : son titre en
   13 / 600, ses lignes dans un groupe blanc arrondi ; une ligne à faire porte le point orange ; une valeur se lit à
   droite, son libellé et son origine à gauche. « Reste N » en pastille orange au-dessus.
   ========================================================================================================== */
main.page .socle-fil.conv-v2 .conv-volet-corps { padding: 0 12px 18px; }
main.page .socle-fil.conv-v2 .conv-volet [role="tabpanel"] > * { animation: apm-monte .35s var(--apm-ressort) both; }
main.page .socle-fil.conv-v2 .conv-volet .conv-reste { display: block; margin: 8px 6px 12px; }
main.page .socle-fil.conv-v2 .conv-volet .conv-reste .lx-etat { display: inline-flex; align-items: center; gap: 6px; height: 22px; padding: 0 9px; border: 0; border-radius: 999px; box-shadow: none;
  font-size: 12px; font-weight: 500; background: var(--apm-orange-clair); color: var(--apm-orange-encre); }
main.page .socle-fil.conv-v2 .conv-volet .conv-reste .lx-etat::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
main.page .socle-fil.conv-v2 .conv-volet .lx-cadre { margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }
main.page .socle-fil.conv-v2 .conv-volet [role="tabpanel"] > .lx-cadre:first-child,
main.page .socle-fil.conv-v2 .conv-volet [role="tabpanel"] > .conv-reste + .lx-cadre { margin-top: 8px; }
main.page .socle-fil.conv-v2 .conv-volet .lx-cadre + .lx-cadre { margin-top: 18px; }
main.page .socle-fil.conv-v2 .conv-volet .lx-cadre-tete { display: flex; align-items: center; gap: 6px; margin: 0 6px 8px; padding: 0; border: 0; }
main.page .socle-fil.conv-v2 .conv-volet .lx-cadre-tete :is(h2, h3) { margin: 0; font-size: 13px; font-weight: 600; line-height: 1.15; letter-spacing: 0; text-transform: none; color: var(--apm-label); }
main.page .socle-fil.conv-v2 .conv-volet .lx-cadre-tete small { font-weight: 500; color: var(--apm-label3); }
main.page .socle-fil.conv-v2 .conv-volet .lx-cadre-corps { padding: 0; border: 0; border-radius: 18px; background: #fff; box-shadow: var(--apm-ombre-carte); overflow: hidden; }
/* une ligne du volet (`.lv`) */
main.page .socle-fil.conv-v2 .conv-volet :is(.lx-lignes, .lx-infos) { display: block; margin: 0; padding: 0; gap: 0; }
main.page .socle-fil.conv-v2 .conv-volet :is(.lx-ligne, .lx-info) { position: relative; display: flex; align-items: flex-start; gap: 10px; margin: 0; padding: 9px 12px; border: 0; border-radius: 0;
  background: none; font-size: 13px; line-height: 1.35; color: var(--apm-label); }
main.page .socle-fil.conv-v2 .conv-volet :is(.lx-ligne, .lx-info) + :is(.lx-ligne, .lx-info) { border-top: .5px solid var(--apm-sep); }
main.page .socle-fil.conv-v2 .conv-volet .lx-ligne-a-faire::before { content: ""; position: static; flex: none; width: 7px; height: 7px; margin-top: 6px; border-radius: 50%; background: var(--apm-orange); }
main.page .socle-fil.conv-v2 .conv-volet .lx-ligne-corps { min-width: 0; flex: 1; padding: 0; }
main.page .socle-fil.conv-v2 .conv-volet .lx-ligne-titre { font-size: 13px; font-weight: 400; color: var(--apm-label); text-decoration: none; }
main.page .socle-fil.conv-v2 .conv-volet .lx-ligne-sous, main.page .socle-fil.conv-v2 .conv-volet .lx-ligne-corps small { display: block; font-size: 11.5px; color: var(--apm-label3); }
main.page .socle-fil.conv-v2 .conv-volet :is(.lx-ligne-gestes, .lx-info-outils) { flex: none; margin: 0; padding: 0; }
main.page .socle-fil.conv-v2 .conv-volet .lx-lien { font-size: 12.5px; font-weight: 400; color: var(--apm-tint); text-decoration: none; }
main.page .socle-fil.conv-v2 .conv-volet .lx-lien:hover { color: #12957a; }
/* une valeur : le libellé et son origine à gauche, la valeur à droite (`.lv-t`, `.lv-v`) */
main.page .socle-fil.conv-v2 .conv-volet .lx-info { flex-wrap: wrap; }
main.page .socle-fil.conv-v2 .conv-volet .lx-info-lib { min-width: 0; flex: 1; margin: 0; font-size: 13px; color: var(--apm-label); text-transform: none; letter-spacing: 0; }
main.page .socle-fil.conv-v2 .conv-volet .lx-info-v { max-width: 48%; margin: 0; font-size: 13px; font-weight: 500; text-align: right; overflow-wrap: anywhere; color: var(--apm-label); }
/* les boutons d'une ligne (Ouvrir, Reprendre, Message au dirigeant) : verre, 28 de haut ; les gestes d'un cadre : verre et plein */
main.page .socle-fil.conv-v2 .conv-volet :is(.lx-ligne, .lx-info, .lx-boutons) .btn.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 0 !important; height: 28px !important;
  padding: 0 12px !important; border: 0; border-radius: 999px !important; font-size: 12.5px !important; font-weight: 500; line-height: 1.45 !important; white-space: nowrap; text-decoration: none;
  color: var(--apm-label); background: rgba(255, 255, 255, .78); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1), inset 0 1px 0 #fff, 0 1px 3px rgba(0, 0, 0, .08); }
main.page .socle-fil.conv-v2 .conv-volet .lx-boutons .btn.btn { height: 32px !important; padding: 0 15px !important; font-size: 13.5px !important; }
main.page .socle-fil.conv-v2 .conv-volet .lx-boutons .btn.btn-plein { color: #fff; background: linear-gradient(180deg, #1aa688, var(--apm-tint) 60%, #0b6654);
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .15), inset 0 1px 0 rgba(255, 255, 255, .4), inset 0 -1px 1px rgba(0, 0, 0, .12), 0 4px 14px -4px rgba(15, 123, 101, .55); }
main.page .socle-fil.conv-v2 .conv-volet .lx-boutons { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin: 12px 0 0; }
/* un document ou une formalité suivis (`.el`) : sa ligne, son état à droite, ses phrases en gris, ses gestes dessous */
main.page .socle-fil.conv-v2 .conv-volet .lx-element { margin: 0; padding: 12px 14px; border: 0; background: none; }
main.page .socle-fil.conv-v2 .conv-volet .lx-element + .lx-element { border-top: .5px solid var(--apm-sep); }
main.page .socle-fil.conv-v2 .conv-volet .lx-element-tete { display: flex; align-items: center; gap: 12px; }
main.page .socle-fil.conv-v2 .conv-volet .lx-element-tete .lx-ligne-titre { min-width: 0; flex: 1; font-size: 13.5px; font-weight: 500; line-height: 1.3; }
main.page .socle-fil.conv-v2 .conv-volet .lx-element :is(.lx-note, p.lx-note) { margin: 4px 0 0; font-size: 12.5px; color: var(--apm-label2); }
main.page .socle-fil.conv-v2 .conv-volet .lx-element .lx-boutons { justify-content: flex-start; gap: 6px; margin: 8px 0 0; }
main.page .socle-fil.conv-v2 .conv-volet .lx-element .lx-boutons .btn.btn { height: 28px !important; padding: 0 12px !important; font-size: 12.5px !important; }
/* La bulle des documents cochés (`.pastilles-docs`) : son titre, chaque document et son dessin, « Ajouter un document » */
main.page .socle-fil.conv-v2 .conv-haut .lx-progression-docs { position: absolute; top: calc(100% + 8px); left: 0; z-index: 30; width: 353px; display: block; padding: 6px; }
main.page .socle-fil.conv-v2 .lx-bulle-titre { margin: 0; padding: 6px 10px 4px; font-size: 12px; font-weight: 600; color: var(--apm-label3); }
main.page .socle-fil.conv-v2 .lx-docs { display: flex; flex-direction: column; gap: 4px; padding: 4px; }
main.page .socle-fil.conv-v2 .lx-docs > span { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border-radius: 10px; font-size: 13px; white-space: normal; color: var(--apm-label); }
main.page .socle-fil.conv-v2 .lx-docs .lx-ic { flex: none; width: 17px; height: 17px; }
main.page .socle-fil.conv-v2 .lx-docs .lx-doc-pret .lx-ic { color: #34c759; }
main.page .socle-fil.conv-v2 .lx-docs .lx-doc-attend { color: var(--apm-label2); } main.page .socle-fil.conv-v2 .lx-docs .lx-doc-attend .lx-ic { color: var(--apm-label3); }
main.page .socle-fil.conv-v2 .lx-progression-docs > hr, main.page .socle-fil.conv-v2 .conv-plus .menu-plus-liste hr { margin: 4px 8px; border: 0; border-top: .5px solid var(--apm-sep); }
main.page .socle-fil.conv-v2 .lx-progression-docs > button { display: flex; align-items: center; gap: 10px; width: 100%; height: 34px; padding: 0 10px; border: 0; border-radius: 10px; background: none;
  font-size: 13.5px; color: var(--apm-label); text-align: left; cursor: pointer; }
main.page .socle-fil.conv-v2 .lx-progression-docs > button:hover { background: var(--apm-tint); color: #fff; }
main.page .socle-fil.conv-v2 .lx-progression-docs > button .lx-ic { width: 17px; height: 17px; }
/* Le menu « … » : Fiche navette, puis Retirer… en rouge, qui s'ouvre sur son titre, sa phrase, le motif et le bouton rouge */
main.page .socle-fil.conv-v2 .conv-retrait > summary.lx-danger { display: flex; align-items: center; gap: 10px; height: 34px; padding: 0 10px; border-radius: 10px; list-style: none; cursor: pointer;
  font-size: 13.5px; color: #e5372c; }
main.page .socle-fil.conv-v2 .conv-retrait > summary.lx-danger::-webkit-details-marker { display: none; }
main.page .socle-fil.conv-v2 .conv-retrait > summary.lx-danger:hover { background: rgba(229, 55, 44, .1); }
main.page .socle-fil.conv-v2 .conv-retrait > summary.lx-danger .lx-ic { width: 17px; height: 17px; color: currentColor; }
main.page .socle-fil.conv-v2 .conv-retrait > form { width: 300px; padding: 8px; }
main.page .socle-fil.conv-v2 .conv-retrait > form .lx-bulle-titre { padding: 0 0 6px; color: var(--apm-label); font-size: 13px; }
main.page .socle-fil.conv-v2 .conv-retrait > form > .lx-note { margin: 0 0 6px; font-size: 12.5px; color: var(--apm-label3); }
main.page .socle-fil.conv-v2 .conv-retrait > form .lx-case { width: 100%; height: 38px; padding: 0 12px; border: 0; border-radius: 11px; background: var(--apm-fill2); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08); }
main.page .socle-fil.conv-v2 .conv-retrait > form .btn.btn-danger { display: flex; margin: 10px 0 0 auto; height: 32px !important; min-height: 0 !important; padding: 0 15px !important; border: 0; border-radius: 999px !important;
  font-size: 13.5px !important; font-weight: 500; color: #fff; background: #e5372c; box-shadow: none; }
main.page .socle-fil.conv-v2 .conv-volet .lx-ligne-titre::before { content: none; }
main.page .socle-fil.conv-v2 .conv-haut .lx-progression-docs { left: calc(50% - 176px); }
/* ce qu'un cadre porte hors de ses lignes (une phrase, un formulaire, des gestes) garde la marge du groupe */
main.page .socle-fil.conv-v2 .conv-volet .lx-cadre-corps > :not(.lx-lignes):not(.lx-infos):not(.lx-element):not([data-maj]) { margin-left: 14px; margin-right: 14px; }
main.page .socle-fil.conv-v2 .conv-volet .lx-cadre-corps > :not(.lx-lignes):not(.lx-infos):not(.lx-element):not([data-maj]):first-child { margin-top: 12px; }
main.page .socle-fil.conv-v2 .conv-volet .lx-cadre-corps > :not(.lx-lignes):not(.lx-infos):not(.lx-element):not([data-maj]):last-child { margin-bottom: 12px; }
main.page .socle-fil.conv-v2 .conv-volet .lx-cadre-corps > p.lx-note { font-size: 12.5px; color: var(--apm-label2); }
main.page .socle-fil.conv-v2 .conv-volet .lx-boutons > .lx-champ-ligne { flex: 1 1 100%; min-width: 0; max-width: 100%; }
main.page .socle-fil.conv-v2 .conv-volet .lx-boutons > .lx-champ-ligne .lx-choix { min-width: 0; flex: 1; }
/* « Ajouter un document » : la liste à cocher en groupe blanc, une ligne par document (`.coches-l`) */
main.page .socle-fil.conv-v2 .conv-volet .lx-coches { display: flex; flex-direction: column; gap: 0; margin: 0; padding: 0; border: 0; border-radius: 14px; background: #fff; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .08); overflow: hidden; }
main.page .socle-fil.conv-v2 .conv-volet .lx-coches > legend { float: left; width: 100%; margin: 0 0 6px; padding: 0; font-size: 11.5px; font-weight: 600; color: var(--apm-label3); }
main.page .socle-fil.conv-v2 .conv-volet .lx-coches > label { display: flex; align-items: center; gap: 10px; margin: 0; padding: 8px 12px; border: 0; border-radius: 0; background: none; box-shadow: none; font-size: 13px; font-weight: 400; line-height: 1.35; }
main.page .socle-fil.conv-v2 .conv-volet .lx-coches > label + label { border-top: .5px solid var(--apm-sep); }
main.page .socle-fil.conv-v2 .conv-volet .lx-coches input { width: 16px; height: 16px; accent-color: var(--apm-tint); }
/* Une bulle ouverte depuis la tête (documents, menu « … ») : la tête floute déjà ce qui passe dessous, et un flou dans
   un flou ne voit plus le fil ; la bulle prend un verre presque plein pour rester lisible par-dessus les messages. */
main.page .socle-fil.conv-v2 .conv-haut details.menu-plus > .menu-plus-liste { background: rgba(255, 255, 255, .96); }
/* le volet : les onglets, puis le contenu 6 plus bas (`.onglets` 14 / 6, `.dedans` 8 / 12 / 18) ; un panneau est un texte
   suivi, ses cadres espacés de 18 ; « Reste N » au-dessus, à 12 */
main.page .socle-fil.conv-v2 .conv-volet { gap: 0; }
main.page .socle-fil.conv-v2 .conv-volet-corps { padding-top: 8px; }
main.page .socle-fil.conv-v2 .conv-volet [role="tabpanel"]:not([hidden]) { display: block; }
main.page .socle-fil.conv-v2 .conv-volet .conv-reste { margin: 0 6px 12px; }
main.page .socle-fil.conv-v2 .conv-volet [role="tabpanel"] > .lx-cadre:first-child,
main.page .socle-fil.conv-v2 .conv-volet [role="tabpanel"] > .conv-reste + .lx-cadre { margin-top: 0; }
main.page .socle-fil.conv-v2 .conv-volet [role="tabpanel"] > [data-maj] + [data-maj] > .lx-cadre,
main.page .socle-fil.conv-v2 .conv-volet [role="tabpanel"] > [data-maj]:not(:empty) ~ .lx-cadre { margin-top: 18px; }
main.page .socle-fil.conv-v2 .conv-volet .lx-cadre-corps { border-radius: 16px; }
main.page .socle-fil.conv-v2 .conv-volet .lx-info-outils { opacity: 1; }

/* ==========================================================================================================
   Lot AP7 · partie 4 : la fiche navette (`lots/maquettes/apple/navette.html`). La tête de page, la ligne d'état, puis
   chaque groupe : son titre en 20 et son nombre en petit, ses lignes dans un groupe blanc (la question et son origine à
   gauche, la réponse à droite), « Corriger » au survol, à la place de la réponse. Les tableaux de la boîte restent
   dessous : seules leurs lignes changent de forme ; l'impression garde les groupes.
   ========================================================================================================== */
.lx-navette { max-width: 1040px; letter-spacing: -.006em; color: var(--apm-label); }
.lx-navette > .lx-tete { align-items: flex-end; gap: 12px; margin-bottom: 10px; }
.lx-navette > .lx-tete .lx-titre { font-size: 34px; font-weight: 700; line-height: 1.05; letter-spacing: -.028em; }
.lx-navette > .lx-tete .lx-sous { margin-top: 4px; font-size: 13px; color: var(--apm-label2); }
.lx-navette > .lx-tete .lx-gestes { gap: 8px; }
.lx-navette > .lx-tete .lx-gestes .btn.btn { display: inline-flex; align-items: center; gap: 7px; height: 32px !important; min-height: 0 !important; padding: 0 15px !important; border: 0;
  border-radius: 999px !important; font-size: 13.5px !important; font-weight: 500; line-height: 1.45 !important; color: var(--apm-label); text-decoration: none;
  background: rgba(255, 255, 255, .78); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1), inset 0 1px 0 #fff, 0 1px 3px rgba(0, 0, 0, .08); }
.lx-navette > .lx-tete .lx-gestes .btn.btn:hover { background: #fff; }
.lx-navette > .lx-tete .lx-gestes .btn .lx-ic { width: 17px; height: 17px; }
.lx-navette > .lx-note { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0 0 18px; font-size: 13px; color: var(--apm-label2); }
.lx-navette > .lx-avis { display: flex; gap: 10px; margin: 0 0 16px; padding: 12px 14px; border: 0; border-radius: 16px; box-shadow: none; font-size: 13.5px; background: var(--apm-fill2); color: var(--apm-label2); }
.lx-navette .lx-cadre { margin: 0 0 22px; padding: 0; border: 0; background: none; box-shadow: none; }
.lx-navette .lx-cadre-tete { margin: 0 6px 8px; padding: 0; border: 0; }
.lx-navette .lx-cadre-tete h2 { display: flex; align-items: baseline; gap: 8px; margin: 0; font-size: 20px; font-weight: 700; line-height: 1.2; letter-spacing: -.02em; text-transform: none; color: var(--apm-label); }
.lx-navette .lx-cadre-tete h2 .lx-compte { padding: 0; border: 0; background: none; font-size: 13px; font-weight: 500; letter-spacing: 0; color: var(--apm-label3); }
.lx-navette .lx-cadre-corps { padding: 0; border: 0; border-radius: 18px; background: #fff; box-shadow: var(--apm-ombre-carte); overflow: hidden; }
/* une ligne : la question et son origine à gauche, la réponse à droite */
.lx-navette .lx-tableau, .lx-navette .lx-tableau-defile { margin: 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; overflow: visible; max-height: none; }
.lx-navette .lx-tableau table { display: block; width: 100%; border: 0; }
.lx-navette .lx-tableau thead { display: none; }
.lx-navette .lx-tableau tbody { display: block; }
.lx-navette .lx-tableau tbody tr { position: relative; display: grid; grid-template-columns: auto auto minmax(0, 1fr) minmax(140px, 260px); column-gap: 0; align-items: center; padding: 11px 16px;
  border: 0; background: none; transition: background-color .15s; }
.lx-navette .lx-tableau tbody tr + tr::before { content: ""; position: absolute; left: 16px; right: 0; top: 0; border-top: .5px solid var(--apm-sep); }
.lx-navette .lx-tableau tbody td { display: block; padding: 0; border: 0; background: none; font-size: 12px; line-height: 1.4; color: var(--apm-label3); }
.lx-navette .lx-tableau tbody td .lx-cellule { display: block; padding: 0; }
.lx-navette .lx-tableau tbody td:nth-child(1) { grid-column: 1 / 4; grid-row: 1; padding-right: 18px; }
.lx-navette .lx-tableau tbody td:nth-child(2) { grid-column: 4; grid-row: 1 / 3; text-align: right; }
.lx-navette .lx-tableau tbody td:nth-child(n+3) { grid-row: 2; margin-top: 2px; }
.lx-navette .lx-tableau tbody td:nth-child(1) .lx-valeur { font-size: 14px; font-weight: 400; color: var(--apm-label); }
.lx-navette .lx-tableau tbody td:nth-child(1) .lx-sous { display: inline; margin: 0; font-size: 12px; color: var(--apm-label3); }
.lx-navette .lx-tableau tbody td:nth-child(1) .lx-cellule { display: flex; flex-direction: column; gap: 2px; }
.lx-navette .lx-tableau tbody td:nth-child(2) :is(.lx-valeur, s, del) { font-size: 14px; font-weight: 500; color: var(--apm-label); overflow-wrap: anywhere; }
.lx-navette .lx-tableau tbody td:nth-child(2) .lx-sous { display: block; font-size: 12px; font-weight: 400; color: var(--apm-label3); }
.lx-navette .lx-tableau tbody td:nth-child(n+3) .lx-valeur, .lx-navette .lx-tableau tbody td:nth-child(n+3) .lx-sous { display: inline; margin: 0; font-size: 12px; font-weight: 400; color: var(--apm-label3); }
/* l'origine, puis qui et quand, sur la ligne de la question : « Répondu · Salma Bennani, 24/10/2026 à 17:45 » */
.lx-navette .lx-tableau tbody td:nth-child(3):not(:empty) .lx-cellule::after { content: " · "; white-space: pre; }
.lx-navette .lx-tableau tbody td:nth-child(4) .lx-sous::before { content: ", "; }
/* « Corriger » : un bouton gris au survol de la ligne, à la place de la réponse */
.lx-navette .lx-tableau tbody td:nth-child(5) { position: absolute; right: 10px; top: 50%; margin: 0; transform: translateY(-50%); opacity: 0; transition: opacity .2s; }
.lx-navette .lx-tableau tbody td:nth-child(5) .lx-lien-ligne { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 15px; border-radius: 999px; font-size: 13.5px; font-weight: 500;
  color: var(--apm-label); text-decoration: none; background: #fff; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .1); }
.lx-navette .lx-tableau tbody td:nth-child(5) .lx-lien-ligne::before { content: ""; width: 17px; height: 17px; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15.5 5.5 18.5 8.5 9 18H6v-3z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15.5 5.5 18.5 8.5 9 18H6v-3z'/%3E%3C/svg%3E") center / contain no-repeat; }
.lx-navette .lx-tableau tbody tr:has(td:nth-child(5) a):hover { background: rgba(0, 0, 0, .02); }
.lx-navette .lx-tableau tbody tr:has(td:nth-child(5) a):hover td:nth-child(5), .lx-navette .lx-tableau tbody td:nth-child(5):focus-within { opacity: 1; }
.lx-navette .lx-tableau tbody tr:has(td:nth-child(5) a):hover td:nth-child(2) { opacity: .15; }
/* une réponse corrigée : la question en gris, la réponse barrée et « Corrigée ensuite » */
.lx-navette .lx-tableau tbody tr.lx-attenuee td:nth-child(1) .lx-valeur { color: var(--apm-label2); }
.lx-navette .lx-tableau tbody tr.lx-attenuee td:nth-child(2) :is(s, del, .lx-barree) { font-weight: 400; color: var(--apm-label3); }
/* ce qui manque : la question, et le document qui la pose en gris à droite */
.lx-navette .lx-tableau:has(th[data-lx-col="document"]) tbody td:nth-child(2) .lx-valeur { font-size: 13px; font-weight: 400; color: var(--apm-label2); }
@media print { .lx-navette .lx-cadre-corps { box-shadow: none; border: .5px solid #ccc; } .lx-navette .lx-tableau tbody tr { break-inside: avoid; } }
.lx-navette .lx-tableau tbody td .lx-cellule.lx-cellule, .lx-navette .lx-tableau tbody td .lx-valeur-et-sous { display: block; width: auto; min-height: 0; height: auto; text-align: inherit; }
.lx-navette .lx-tableau tbody td:nth-child(1) .lx-cellule.lx-cellule > .lx-sous { display: block; margin-top: 2px; }
.lx-navette .lx-tableau tbody td:nth-child(n+3) .lx-cellule.lx-cellule { display: inline; }
.lx-navette .lx-tableau tbody td:nth-child(n+3) .lx-valeur-et-sous { display: inline; }
.lx-navette > .lx-note { display: block; line-height: 1.6; }
.lx-navette .lx-tableau tbody td:nth-child(n+3) .lx-cellule.lx-cellule { display: inline; font-size: 0; }
.lx-navette .lx-tableau tbody td:nth-child(n+3) .lx-cellule.lx-cellule > * { font-size: 12px; }
.lx-navette .lx-tableau tbody tr:hover td, .lx-navette .lx-tableau tbody tr td:hover { background: none; box-shadow: none; }
.lx-navette .lx-tableau tbody td:is(:nth-child(3), :nth-child(4)) { white-space: nowrap; }
.lx-navette .lx-tableau tbody td:nth-child(5) { top: 0; bottom: 0; display: flex; align-items: center; transform: none; }
.lx-navette .lx-tableau tbody td:nth-child(n+3) :is(.lx-valeur-et-sous, .lx-valeur, .lx-sous).lx-valeur-et-sous,
.lx-navette .lx-tableau tbody td:nth-child(n+3) .lx-cellule > :is(.lx-valeur-et-sous, .lx-sous) { display: inline; }
.lx-navette .lx-tableau tbody tr > td:nth-child(5):nth-child(5) { inset: 0 10px 0 auto; height: auto; }
.lx-navette .lx-tableau tbody td:nth-child(3):not(:empty) .lx-cellule.lx-cellule::after { content: none; }
.lx-navette .lx-tableau tbody td:nth-child(3) .lx-valeur-et-sous::after { content: " · "; white-space: pre; }
/* dans une grille, un absolu se place dans sa zone : « Corriger » prend toute la ligne pour se centrer */
.lx-navette .lx-tableau tbody tr > td:nth-child(5):nth-child(5) { grid-row: 1 / -1; grid-column: 1 / -1; }
/* « Corriger une réponse » : la question et ses boutons (`.correction`), dans son groupe, Annuler en lien */
.lx-navette #correction .lx-cadre-corps { padding: 12px 16px; }
.lx-navette #correction .lx-cadre-tete .lx-note { margin-left: auto; font-size: 12.5px; color: var(--apm-label3); }
.lx-navette #correction .lx-question > .lx-etiquette { font-size: 12px; font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--apm-label3); }
.lx-navette #correction .lx-question-texte { margin: 2px 0 0; font-size: 14px; color: var(--apm-label); }
.lx-navette #correction .lx-boutons { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; }
.lx-navette #correction .lx-boutons .btn.btn:not(.btn-nu) { height: 32px !important; min-height: 0 !important; padding: 0 15px !important; border: 0; border-radius: 999px !important; font-size: 13.5px !important; font-weight: 500;
  color: var(--apm-label); background: rgba(255, 255, 255, .78); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1), inset 0 1px 0 #fff, 0 1px 3px rgba(0, 0, 0, .08); }
.lx-navette #correction .lx-boutons .btn.btn-plein { color: #fff; background: linear-gradient(180deg, #1aa688, var(--apm-tint) 60%, #0b6654); }
.lx-navette #correction .lx-boutons .btn.btn-nu { height: auto !important; padding: 0 4px !important; border: 0; background: none; box-shadow: none; font-size: 13.5px !important; color: var(--apm-tint); }

/* ==========================================================================================================
   Lot AP7 · partie 5 : l'assistant « Demander à Lexia » (`lots/maquettes/apple/fenetres.html`, `.as-tete`, `.accueil`,
   `.idees`, `.saisie`). Le panneau de verre à droite ; la tête : l'étincelle verte et « Lexia », « Sur … » en pastille,
   écrire et fermer en ronds ; l'accueil en 26 ; les suggestions en un groupe blanc ; la zone d'écriture en carte blanche.
   ========================================================================================================== */
.assistant { top: 12px; right: 12px; bottom: 12px; width: 452px; max-width: calc(100vw - 24px); border-radius: 26px; background: rgba(255, 255, 255, .82); }
.assistant .as-tete { display: flex; align-items: center; gap: 8px; padding: 14px 12px 8px 18px; border: 0; background: none; }
.assistant .as-logo { display: inline-flex; width: auto; height: auto; padding: 0; border-radius: 0; background: none; box-shadow: none; color: var(--apm-tint); }
.assistant .as-logo .lx-ic { width: 19px; height: 19px; color: var(--apm-tint); }
.assistant .as-nom { margin: 0 0 0 -1px; font-size: 19px; font-weight: 700; letter-spacing: -.02em; color: var(--apm-label); }
.assistant .as-hauteur > summary { display: inline-flex; align-items: center; gap: 5px; height: 28px; max-width: 220px; padding: 0 10px 0 11px; border: 0; border-radius: 999px;
  background: rgba(255, 255, 255, .8); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .08); font-size: 12.5px; font-weight: 500; color: var(--apm-label2); white-space: nowrap; transition: transform .45s var(--apm-ressort-vif); }
.assistant .as-hauteur > summary:active { transform: scale(.94); }
.assistant .as-hauteur > summary > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.assistant .as-hauteur > summary b { font-weight: 600; color: var(--apm-label); }
.assistant .as-hauteur > summary .lx-ic { flex: none; width: 12px; height: 12px; }
.assistant .as-tete .as-ico { display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: none; box-shadow: none; color: var(--apm-label); }
.assistant .as-tete .as-ico:hover { background: var(--apm-fill2); }
.assistant .as-tete .as-ico .lx-ic { width: 17px; height: 17px; }
.assistant .as-tete .as-hauteur + .as-ico { margin-left: auto; }
.assistant .as-tete .as-ico + .as-ico { margin-left: -6px; }
/* l'accueil et ses suggestions */
.assistant .as-fil { padding: 4px 18px 16px; }
.assistant .as-accueil { padding: 14px 2px 4px; }
.assistant .as-accueil h3 { margin: 0 0 6px; font-size: 26px; font-weight: 700; line-height: 1.2; letter-spacing: -.025em; color: var(--apm-label); }
.assistant .as-accueil > p { margin: 0 0 16px; font-size: 14px; line-height: 1.45; color: var(--apm-label2); }
.assistant .as-idees { display: block; border-radius: 16px; background: rgba(255, 255, 255, .8); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .05); overflow: hidden; }
.assistant .as-idees > button { position: relative; display: flex; align-items: center; gap: 10px; width: 100%; min-height: 44px; margin: 0; padding: 8px 14px; border: 0; border-radius: 0;
  background: none; box-shadow: none; font-size: 13.5px; text-align: left; color: var(--apm-label); transition: background-color .15s; }
.assistant .as-idees > button + button::before { content: ""; position: absolute; left: 14px; right: 0; top: 0; border-top: .5px solid var(--apm-sep); }
.assistant .as-idees > button:hover { background: rgba(0, 0, 0, .03); }
.assistant .as-idees > button .lx-ic { margin-left: auto; width: 14px; height: 14px; color: #c4c4c7; }
/* la zone d'écriture */
.assistant .as-compo { padding: 8px 14px 12px; border: 0; background: none; }
.assistant .as-ligne { display: flex; flex-direction: column; padding: 0; border: 0; border-radius: 22px; background: #fff; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .1), 0 6px 20px -8px rgba(0, 0, 0, .18); }
.assistant .as-ligne:focus-within { box-shadow: 0 0 0 1px var(--apm-tint), 0 0 0 4px var(--apm-tint-clair), 0 6px 20px -8px rgba(0, 0, 0, .18); }
.assistant .as-ligne textarea { min-height: 44px; max-height: 190px; padding: 12px 16px 4px; border: 0; border-radius: 0; background: transparent; font-size: 14px; line-height: 1.45; }
.assistant .as-outils { display: flex; align-items: center; gap: 2px; padding: 2px 6px 6px; }
.assistant .as-outils .as-ico { display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: none; color: var(--apm-label2); }
.assistant .as-outils .as-ico .lx-ic { width: 17px; height: 17px; }
.assistant .as-envoyer { display: grid; place-items: center; width: 32px; height: 32px; margin-left: auto; padding: 0; border: 0; border-radius: 50%; background: var(--apm-tint); color: #fff;
  transition: transform .45s var(--apm-ressort-vif), opacity .2s, background-color .2s; }
.assistant .as-envoyer[disabled] { opacity: .3; pointer-events: none; }
.assistant .as-envoyer:active { transform: scale(.86); }
.assistant .as-envoyer .lx-ic { width: 17px; height: 17px; stroke-width: 2.2; }
.assistant .as-pied { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 8px 0 0; font-size: 12px; color: var(--apm-label2); }
.assistant .as-accueil { display: block; }
.assistant .as-ligne { gap: 0; }

/* ==========================================================================================================
   Lot AP7 · les sept points tranchés le 30/10, comme la maquette
   ========================================================================================================== */
/* 1, 2 · la tête de la carte d'un rôle (`.role-tete`) : « N personnes » et le segment Cartes · Grille */
main.page .socle-fil.conv-v2 .lx-role-tete { display: flex; align-items: center; gap: 10px; margin: 12px 0 0; padding: 0 2px 0 4px; font-size: 12.5px; color: var(--apm-label2); }
main.page .socle-fil.conv-v2 .lx-role-tete .lx-segment { display: flex; margin-left: auto; padding: 2px; border-radius: 999px; background: var(--apm-fill); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
main.page .socle-fil.conv-v2 .lx-role-tete .lx-segment .lx-filtre { display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 11px; border-radius: 999px; font-size: 12.5px; font-weight: 400;
  color: var(--apm-label2); text-decoration: none; background: none; box-shadow: none; }
main.page .socle-fil.conv-v2 .lx-role-tete .lx-segment .lx-filtre[aria-current] { color: var(--apm-label); font-weight: 500; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 0 0 .5px rgba(0, 0, 0, .04); }
main.page .socle-fil.conv-v2 .lx-role-tete .lx-segment .lx-ic { width: 14px; height: 14px; }
main.page .socle-fil.conv-v2 .lx-role-tete + .lx-role > .lx-avis:first-child, main.page .socle-fil.conv-v2 .lx-role-tete + .lx-avis { margin-top: 8px; }
/* la grille (`table.grille`) : un groupe blanc, l'en-tête en petit, des cases sans bord */
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-reponse-tableau { margin-top: 12px; border-radius: 16px; background: rgba(255, 255, 255, .9); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .06); overflow: hidden; }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-reponse-tableau .lx-tableau { margin: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-reponse-tableau th { padding: 8px 10px; font-size: 11.5px; font-weight: 600; text-transform: none; letter-spacing: 0; color: var(--apm-label3); background: none; border-bottom: .5px solid var(--apm-sep); }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-reponse-tableau td { padding: 4px 6px; border-bottom: .5px solid var(--apm-sep); background: none; }
main.page .socle-fil.conv-v2 .conv-bulle-question .lx-reponse-tableau .lx-pied-du-role { margin: 0; padding: 10px 12px; }
/* 3 · Retirer : Annuler en gris à côté du bouton rouge */
main.page .socle-fil.conv-v2 .conv-retrait > form > .lx-boutons { display: flex; justify-content: flex-end; gap: 8px; margin: 10px 0 0; }
main.page .socle-fil.conv-v2 .conv-retrait > form .lx-boutons .btn.btn { margin: 0; height: 32px !important; min-height: 0 !important; padding: 0 15px !important; border: 0; border-radius: 999px !important;
  font-size: 13.5px !important; font-weight: 500; box-shadow: none; }
main.page .socle-fil.conv-v2 .conv-retrait > form .lx-boutons .btn.btn[data-fermer-menu] { color: var(--apm-label); background: var(--apm-fill); }
main.page .socle-fil.conv-v2 .conv-retrait > form .lx-boutons .btn.btn-danger { color: #fff; background: #e5372c; }
/* 6 · un long message replié (`.repliable`), et « Voir tout le message » */
main.page .socle-fil.conv-v2 .conv-qui-moi > .conv-bulle.conv-repliable { max-height: 92px; overflow: hidden; -webkit-mask-image: linear-gradient(#000 55%, transparent); mask-image: linear-gradient(#000 55%, transparent); }
main.page .socle-fil.conv-v2 .conv-qui-moi > [data-deplier] { padding: 0; border: 0; background: none; font-size: 12.5px; color: var(--apm-tint); cursor: pointer; }
/* 7 · Garder / Écarter (`.mini`) : deux boutons commandent la case de la ligne ; une ligne écartée pâlit, sa valeur barrée */
.lx-coche-cachee { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.lx-garder { order: 2; flex: none; display: inline-flex; margin-left: auto; padding: 2px; border-radius: 999px; background: var(--apm-fill, rgba(120, 120, 128, .12)); }
.lx-garder > button { height: 24px; padding: 0 9px; border: 0; border-radius: 999px; background: none; font: inherit; font-size: 12px; color: var(--apm-label2, #6e6e73); cursor: pointer;
  transition: background-color .2s, color .2s, box-shadow .2s; }
.lx-garder > button[aria-pressed="true"] { background: #fff; color: var(--apm-label, #1d1d1f); font-weight: 500; box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }
tr:has(> td .lx-garder):has(input[data-lx-coche]:not(:checked)) > td:not(:first-child),
tr:has(> td .lx-garder):has(input[data-lx-coche]:not(:checked)) .lx-valeur-et-sous { opacity: .45; }
tr:has(> td .lx-garder):has(input[data-lx-coche]:not(:checked)) .lx-case { text-decoration: line-through; }
td:has(> .lx-cellule > .lx-garder) > .lx-cellule { display: flex; align-items: center; gap: 10px; }
/* 4 · la navette : la correction s'ouvre sous sa ligne (`.ouvre` / `.correction`), la question n'est pas redite */
.lx-navette .lx-tableau tbody tr.lx-deplie { display: block; padding: 0 16px 12px; }
.lx-navette .lx-tableau tbody tr.lx-deplie::before { content: none; }
.lx-navette .lx-tableau tbody tr.lx-deplie > td { display: block; position: static; opacity: 1; transform: none; font-size: 14px; color: var(--apm-label); }
.lx-navette .lx-correction { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; animation: apm-ouvre .45s var(--apm-ressort) both; transform-origin: top; }
.lx-navette .lx-correction .lx-question { display: contents; }
.lx-navette .lx-correction .lx-question > :is(.lx-etiquette, .lx-question-texte) { display: none; }
.lx-navette .lx-correction :is(form, .lx-boutons) { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; }
.lx-navette .lx-correction .lx-case { height: 38px; min-width: 220px; padding: 0 12px; border: 0; border-radius: 11px; background: var(--apm-fill2); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08); }
.lx-navette .lx-correction .btn.btn:not(.btn-nu) { height: 32px !important; min-height: 0 !important; padding: 0 15px !important; border: 0; border-radius: 999px !important; font-size: 13.5px !important; font-weight: 500;
  color: var(--apm-label); background: rgba(255, 255, 255, .78); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1), inset 0 1px 0 #fff, 0 1px 3px rgba(0, 0, 0, .08); }
.lx-navette .lx-correction .btn.btn-plein { color: #fff; background: linear-gradient(180deg, #1aa688, var(--apm-tint) 60%, #0b6654); }
.lx-navette .lx-correction .btn.btn-nu { height: auto !important; padding: 0 4px !important; border: 0; background: none; box-shadow: none; font-size: 13.5px !important; color: var(--apm-tint); }
.lx-navette .lx-tableau tbody tr:has(+ tr.lx-deplie) td:nth-child(5) { display: none; }
main.page .socle-fil.conv-v2 .conv-retrait > form .lx-boutons .btn.btn { width: auto; flex: none; justify-content: center; }
.lx-navette .lx-tableau tbody tr.lx-deplie { scroll-margin-top: 140px; }

/* Lot AP7 · la pièce déposée (`.piece-jointe`, `.vg-fmt`) : une carte blanche à droite, le format en vignette (rouge
   pour un PDF, bleu sinon), le nom, et dessous le format et le poids */
main.page .socle-fil.conv-v2 .conv-piece { display: flex; align-items: center; gap: 10px; max-width: 70%; padding: 8px 14px 8px 8px; border-radius: 16px 16px 6px 16px; background: #fff;
  box-shadow: var(--apm-ombre-carte); font-size: 13px; line-height: 1.4; color: var(--apm-label); }
main.page .socle-fil.conv-v2 .conv-fmt { display: grid; place-items: center; flex: none; width: 30px; height: 36px; border-radius: 5px; background: #eaf1fe; color: #2f7cf6; font-size: 8px; font-weight: 700; letter-spacing: 0; }
main.page .socle-fil.conv-v2 .conv-fmt.conv-fmt-pdf { background: #fdeceb; color: #e5372c; }
main.page .socle-fil.conv-v2 .conv-piece-nom { min-width: 0; overflow-wrap: anywhere; }
main.page .socle-fil.conv-v2 .conv-piece-nom small { display: block; font-size: 11.5px; color: var(--apm-label3); }
/* une pièce lue pour la carte d'un rôle ne dit rien sous elle une fois traitée : pas d'avatar seul */
main.page .socle-fil.conv-v2 .conv-msg.conv-lexia:has(> .conv-large:empty) { display: none; }
/* Les messages d'une lecture (`lexia(...)` de la maquette) : du texte, sans boîte ; leurs gestes en boutons de verre.
   Pendant la lecture, une carte blanche (`.carte`, `.lecture-cours`). */
main.page .socle-fil.conv-v2 .conv-lecture > .conv-bulle { max-width: none; margin: 0; padding: 3px 0 0; border: 0; border-radius: 0; background: none; box-shadow: none; font-size: 14px; line-height: 1.45; color: var(--apm-label); }
main.page .socle-fil.conv-v2 .conv-lecture > .conv-bulle > p { margin: 0 0 6px; }
main.page .socle-fil.conv-v2 .conv-lecture > .conv-bulle:has(.ia-prog, .lx-chargement, [data-lx-chargement]) { padding: 14px 16px; border-radius: 20px; background: #fff; box-shadow: var(--apm-ombre-carte), 0 10px 30px -18px rgba(0, 0, 0, .2); }
main.page .socle-fil.conv-v2 .conv-lecture .lx-boutons { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 6px 0 0; }
main.page .socle-fil.conv-v2 .conv-lecture > .conv-bulle .lx-boutons .btn.btn, main.page .socle-fil.conv-v2 .conv-lecture > .lx-boutons .btn.btn { display: inline-flex; align-items: center; height: 34px !important; min-height: 0 !important;
  padding: 0 16px !important; border: 0; border-radius: 999px !important; font-size: 13.5px !important; font-weight: 500; line-height: 1.45 !important; color: var(--apm-label); text-decoration: none;
  background: rgba(255, 255, 255, .78); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1), inset 0 1px 0 #fff, 0 1px 3px rgba(0, 0, 0, .08); }
main.page .socle-fil.conv-v2 .conv-lecture .lx-note { font-size: 12.5px; color: var(--apm-label3); }
main.page .socle-fil.conv-v2 :is(.conv-lecture, .conv-bulle) details.lx-replie > summary { list-style: none; cursor: pointer; font-size: 12.5px; color: var(--apm-tint); }
main.page .socle-fil.conv-v2 :is(.conv-lecture, .conv-bulle) details.lx-replie > summary::-webkit-details-marker { display: none; }
main.page .socle-fil.conv-v2 :is(.conv-lecture, .conv-bulle) details.lx-replie > ul { margin: 6px 0 0; padding-left: 18px; font-size: 12.5px; color: var(--apm-label2); }
/* l'avatar d'un contrôle (`.av.signal`) : orange clair, son point d'exclamation */
main.page .socle-fil.conv-v2 .conv-av.conv-av-signal { background: var(--apm-orange-clair); color: var(--apm-orange-encre); box-shadow: none; }
main.page .socle-fil.conv-v2 .conv-av.conv-av-signal svg { width: 16px; height: 16px; stroke-width: 2.2; }
/* une valeur dans une ligne du volet (`.lv-v`) ; une valeur remplacée, barrée en gris (`.lv.remplacee`) */
main.page .socle-fil.conv-v2 .conv-volet .lx-ligne-valeur { flex: none; max-width: 48%; margin: 0; font-size: 13px; font-weight: 500; text-align: right; overflow-wrap: anywhere; color: var(--apm-label); }
main.page .socle-fil.conv-v2 .conv-volet .lx-ligne-remplacee .lx-ligne-valeur, main.page .socle-fil.conv-v2 .conv-volet .lx-ligne-remplacee .lx-ligne-valeur s { font-weight: 400; color: var(--apm-label3); }

/* ---------------------------------------------------------------------------
   Lot AP8 · le tableau de bord de la maquette Apple (`lots/maquettes/apple/tableau-de-bord.html`,
   `lots/LOT-AP8-tableau-de-bord.md`) : des cartes sur le gris du Mac, chacune à sa place (deux colonnes, deux rangées,
   toute la largeur), l'anneau, sa légende et les colonnes côte à côte ; les chiffres défilent, l'anneau se dessine,
   les colonnes poussent ; tout tient à l'écran sans défiler.
   --------------------------------------------------------------------------- */
.lx-tableau-de-bord > .lx-tete { display: flex; align-items: flex-end; gap: 12px; margin-bottom: 20px; }
.lx-tableau-de-bord > .lx-tete .lx-surtitre { margin: 0; font-size: 13px; font-weight: 600; color: var(--ap-label2); }
.lx-tableau-de-bord > .lx-tete .lx-titre { margin: 2px 0 0; font-size: 34px; line-height: 1.05; font-weight: 700; letter-spacing: -.028em; }
.lx-tableau-de-bord .lx-recherche input { width: 280px; height: 40px; padding: 0 14px 0 38px; border: 0; border-radius: 999px; font-size: 14px;
  background: var(--ap-loupe) no-repeat 14px center / 17px, var(--ap-verre); backdrop-filter: var(--ap-verre-flou); -webkit-backdrop-filter: var(--ap-verre-flou);
  box-shadow: var(--ap-verre-bord), var(--ap-verre-ombre); transition: width 500ms var(--lx-ressort), box-shadow .2s; }
.lx-tableau-de-bord .lx-recherche input:focus { width: 340px; border: 0; box-shadow: var(--ap-verre-bord), 0 0 0 1px var(--mz-vert), 0 0 0 4px var(--mz-vert-clair), var(--ap-verre-ombre); }

/* la grille : trois colonnes ; une carte sur deux colonnes, sur deux rangées, ou sur toute la largeur */
.lx-indicateurs { gap: 16px; }
.lx-indicateur-haute { grid-column: 3; grid-row: 1 / span 2; }
.lx-indicateur-pleine { grid-column: 1 / -1; }
.lx-indicateur { gap: 0; padding: 16px 18px 18px; border-radius: 22px; background: #fff; box-shadow: var(--ap-ombre-groupe);
  animation: ap-monte 600ms var(--lx-ressort) both; animation-delay: calc(var(--lx-rang, 0) * 60ms); }
.lx-indicateur:hover { box-shadow: var(--ap-ombre-groupe); }
.lx-indicateur-titre { gap: 10px; margin-bottom: 12px; font-size: 15px; font-weight: 600; letter-spacing: -.01em; color: var(--ap-label); }
.lx-indicateur-ic { display: grid; place-items: center; flex: none; width: 28px; height: 28px; border-radius: 8px; background: var(--ap-fill); color: var(--ap-label2); }
.lx-indicateur-ic .lx-ic { width: 16px; height: 16px; }
.lx-indicateur-ic.lx-encre-ambre { background: var(--ap-orange-clair); color: #a35c00; }
.lx-indicateur-titre > .lx-voir { margin-left: auto; height: 26px; padding: 0 6px 0 10px; border-radius: 999px; font-size: 13px; font-weight: 500; color: var(--ap-tint);
  transition: background-color .15s, transform 400ms var(--ap-ressort-vif); }
.lx-indicateur-titre > .lx-voir:hover { background: var(--ap-tint-clair); color: var(--ap-tint); text-decoration: none; }
.lx-indicateur-titre > .lx-voir:active { transform: scale(.94); }
.lx-indicateur-titre > .lx-voir .lx-ic { width: 13px; height: 13px; }
.lx-indicateur .lx-note { margin: 0; font-size: 12.5px; color: var(--ap-label2); }
/* les approbations : l'anneau, sa légende, puis les colonnes par étape, côte à côte */
.lx-appro-corps { display: grid; grid-template-columns: 132px minmax(0, .9fr) minmax(0, 1.3fr); gap: 20px; align-items: center; }
.lx-appro-corps > .lx-anneau-et-legende { display: contents; }
.lx-anneau { width: 132px; height: 132px; }
.lx-anneau circle { stroke-width: 11.8; }
.lx-anneau-fond { stroke: var(--ap-fill); }
.lx-anneau-vert { stroke: #34c759; stroke-linecap: round; } .lx-anneau-rouge { stroke: var(--ap-rouge); stroke-linecap: round; }
.lx-anneau-vert, .lx-anneau-rouge { animation: lx-trace 1.1s var(--lx-glisse) .2s both; }
.lx-anneau-nombre { font-size: 23.6px; font-weight: 700; letter-spacing: -.02em; fill: var(--ap-label); }
.lx-anneau-mot { font-size: 10.9px; fill: var(--ap-label2); }
/* une ligne qui compte : son fond de survol déborde de 8 px de chaque côté, comme la maquette, sans pousser la ligne */
.lx-indicateur .lx-ligne-chiffre { gap: 10px; min-height: 34px; margin: 0; padding: 0; border-radius: 10px; font-size: 13.5px; color: var(--ap-label);
  transition: transform 400ms var(--ap-ressort-vif); }
.lx-indicateur .lx-ligne-chiffre::before { content: ""; inset: 0 -8px; border-radius: 10px; transition: background-color .15s; }
.lx-indicateur .lx-ligne-chiffre:hover::before { background: rgba(0, 0, 0, .035); }
.lx-indicateur .lx-ligne-chiffre:active { transform: scale(.98); }
.lx-indicateur .lx-ligne-chiffre:active::before { background: rgba(0, 0, 0, .06); }
.lx-points .lx-ligne-chiffre.lx-point-attention::before { content: none; }
.lx-indicateur .lx-ligne-chiffre > b { width: auto; font-size: 15px; font-weight: 600; }
.lx-indicateur b[data-lx-compte="0"] { color: var(--ap-label3); }
.lx-pt { width: 8px; height: 8px; border-radius: 50%; background: #c7c7cc; }
.lx-pt-vert { background: #34c759; } .lx-pt-rouge { background: var(--ap-rouge); } .lx-pt-ambre { background: var(--ap-orange); }
.lx-legende-pied { margin-top: 6px; padding: 0; font-size: 12.5px; color: var(--ap-label2); }
.lx-legende-pied .lx-voir { font-size: 12.5px; font-weight: 500; color: var(--ap-tint); }
.lx-appro-corps > .lx-colonnes-bloc { align-self: stretch; display: flex; flex-direction: column; gap: 0; padding-left: 22px; border-left: .5px solid var(--ap-trait); }
.lx-colonnes { flex: 1; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2px; align-items: end; margin-top: 10px; min-height: 108px; }
.lx-colonne { justify-content: flex-end; gap: 5px; height: 100%; padding: 4px 0; border-radius: 12px; transition: background-color .15s, transform 400ms var(--ap-ressort-vif); }
.lx-colonne:hover { background: rgba(0, 0, 0, .035); }
.lx-colonne:active { transform: scale(.95); }
.lx-colonne > b { font-size: 15px; font-weight: 600; }
.lx-colonne-fut { height: auto; }
.lx-colonne-fut > span { width: 26px; border-radius: 7px 7px 4px 4px; background: linear-gradient(180deg, #a9adb6, #8e939c); animation: lx-pousse 800ms var(--lx-ressort) .3s both; }
.lx-colonne:has(> b[data-lx-compte="0"]) .lx-colonne-fut > span { background: var(--ap-fill); }
.lx-colonne-nom { font-size: 10.5px; color: var(--ap-label2); }
/* le grand chiffre, la barre en parts, les trois cases */
.lx-grand-chiffre { margin: 2px 0 12px; gap: 8px; font-size: 13.5px; color: var(--ap-label2); }
.lx-grand-chiffre > b { font-size: 40px; font-weight: 700; letter-spacing: -.03em; }
.lx-grand-chiffre > .lx-ligne-chiffre.lx-encre-rouge { min-height: 0; margin: 0; padding: 0 4px; border-radius: 6px; font-weight: 500; color: var(--ap-rouge); }
.lx-grand-chiffre > .lx-ligne-chiffre.lx-encre-rouge:hover { background: rgba(229, 55, 44, .08); }
.lx-parts { gap: 3px; height: 10px; margin-bottom: 12px; overflow: visible; border-radius: 0; background: none; }
.lx-parts > span { border-radius: 5px; animation: lx-etend 900ms var(--lx-ressort) .3s both; }
.lx-part-rouge { background: var(--ap-rouge); } .lx-part-ambre { background: var(--ap-orange); } .lx-part-vert { background: #34c759; }
.lx-mini-cases { gap: 8px; margin-bottom: 14px; }
.lx-mini-case { gap: 4px; padding: 10px 11px; border-radius: 14px; background: var(--ap-fill2); font-size: 12px; color: var(--ap-label2); transition: background-color .15s, transform 400ms var(--ap-ressort-vif); }
.lx-mini-case:hover { background: rgba(120, 120, 128, .14); color: var(--ap-label2); }
.lx-mini-case:active { transform: scale(.96); }
.lx-mini-case > b { font-size: 21px; font-weight: 700; line-height: 1; color: var(--ap-label); }
.lx-mini-case > b.lx-encre-rouge { color: var(--ap-rouge); }
.lx-mini-case > span { align-items: center; gap: 6px; }
.lx-sous-titre-carte { margin: 2px 0 4px; font-size: 12px; font-weight: 600; color: var(--ap-label3); }
.lx-indicateur .lx-voir-petit { margin-top: 4px; padding: 0; font-size: 13px; font-weight: 500; color: var(--ap-tint); }
.lx-etat-court { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: 999px; font-size: 11.5px; font-weight: 600; }
.lx-ligne-chiffre:not(.lx-ligne-chiffre-serree) .lx-etat-court { padding: 0 8px; font-size: 11.5px; }
.lx-etat-court-rouge { background: rgba(229, 55, 44, .11); color: var(--ap-rouge); }
.lx-etat-court-ambre { background: var(--ap-orange-clair); color: #a35c00; }
.lx-etat-court-gris { background: var(--ap-fill2); color: var(--ap-label2); }
.lx-roles { gap: 6px 14px; margin-top: auto; padding-top: 10px; border-top: .5px solid var(--ap-trait); font-size: 12.5px; color: var(--ap-label2); }
.lx-roles > span { padding: 0; border-radius: 0; background: none; }
.lx-roles b { color: var(--ap-label); font-weight: 600; }
/* les points d'attention : quatre tuiles */
.lx-points { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.lx-points .lx-ligne-chiffre.lx-point-attention { gap: 12px; margin: 0; padding: 12px 12px 12px 14px; border-radius: 16px; background: var(--ap-fill2); transition: background-color .15s, transform 450ms var(--ap-ressort-vif); }
.lx-points .lx-ligne-chiffre.lx-point-attention:hover { background: rgba(120, 120, 128, .14); }
.lx-points .lx-ligne-chiffre.lx-point-attention:active { transform: scale(.97); }
.lx-pastille-ic { display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 10px; }
.lx-pastille-ic .lx-ic { width: 17px; height: 17px; }
.lx-pastille-ic-ambre { background: var(--ap-orange-clair); color: #a35c00; } .lx-pastille-ic-rouge { background: rgba(229, 55, 44, .11); color: var(--ap-rouge); } .lx-pastille-ic-gris { background: var(--ap-fill); color: var(--ap-label2); }
.lx-points .lx-ligne-chiffre-nom > span { font-size: 13.5px; font-weight: 600; }
.lx-points .lx-ligne-chiffre-nom > small { font-size: 12px; color: var(--ap-label2); line-height: 1.3; }
.lx-points .lx-point-attention > b { font-size: 22px; font-weight: 700; }
.lx-points .lx-point-attention > .lx-ic { width: 13px; height: 13px; color: #c4c4c7; }
@media (max-width: 1000px) { .lx-indicateur-haute { grid-column: auto; grid-row: auto; } .lx-points { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* la bulle des sociétés trouvées : du verre qui sort du champ */
.lx-bulle-societes { position: fixed; z-index: 3100; min-width: 220px; max-width: 320px; max-height: 60vh; overflow: auto; padding: 6px; border-radius: 18px;
  background: rgba(255, 255, 255, .58); backdrop-filter: blur(30px) saturate(200%); -webkit-backdrop-filter: blur(30px) saturate(200%);
  box-shadow: var(--ap-verre-bord), 0 0 0 .5px rgba(0, 0, 0, .08), 0 2px 6px rgba(0, 0, 0, .04), 0 16px 40px -14px rgba(0, 0, 0, .22); animation: ap-bulle 500ms var(--ap-ressort-vif) both; }
.lx-bulle-societes.lx-part { animation: ap-bulle-part 160ms ease forwards; }
@keyframes ap-bulle { from { opacity: 0; transform: scale(.5); filter: blur(6px); } 35% { opacity: 1; filter: none; } }
@keyframes ap-bulle-part { to { opacity: 0; transform: scale(.85); } }
.lx-bulle-titre { padding: 6px 10px 4px; font-size: 12px; font-weight: 600; color: var(--ap-label3); }
.lx-bulle-note { margin: 0; padding: 0 10px 8px; font-size: 12.5px; color: var(--ap-label2); }
.lx-bulle-societes > .lx-palette-ligne { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 34px; padding: 0 10px; border-radius: 10px; font-size: 13.5px; color: var(--ap-label); text-decoration: none; transition: background-color .12s; }
.lx-bulle-societes > .lx-palette-ligne:hover { background: var(--ap-tint); color: #fff; }
.lx-bulle-societes > .lx-palette-ligne .lx-avatar { width: 22px; height: 22px; border-radius: 6px; font-size: 9px; }
.lx-bulle-societes > .lx-palette-ligne .lx-palette-precision { margin-left: auto; font-size: 11.5px; opacity: .6; }
.lx-bulle-societes > .lx-palette-ligne > .lx-ic { display: none; }
@media (prefers-reduced-motion: reduce) { .lx-bulle-societes, .lx-indicateur { animation: none; } }
/* la page de la maquette : le texte en 14 sur 1,45 ; la tête à 20 des cartes, l'avis à 18 */
.lx-page.lx-tableau-de-bord { gap: 0; font-size: 14px; line-height: 1.45; letter-spacing: -.006em; }
.lx-tableau-de-bord > .lx-avis { margin-bottom: 18px; }
/* un arc de longueur nulle ne laisse pas de point */
.lx-anneau circle:is([style^="stroke-dasharray: 0 "], [style^="stroke-dasharray: 0.0 "]) { stroke-linecap: butt; }
/* les chiffres et les titres des cartes : la hauteur de ligne de leur police, comme la maquette */
.lx-colonne > b, .lx-indicateur-titre, .lx-points .lx-point-attention > b, .lx-indicateur .lx-ligne-chiffre > b { line-height: normal; }
/* la feuille « Documents à refaire » : une ligne par document, la société, le document et ce qui a changé, le geste */
.lx-feuille-refaire { display: block; padding: 0 18px 20px; font-size: 14px; line-height: 1.45; }
.tiroir-fenetre .lx-feuille-refaire > * { animation: ap-monte 500ms var(--lx-ressort) both; }
.lx-feuille-refaire .lx-liste-groupee { background: rgba(255, 255, 255, .78); }
.lx-refaire { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr) auto; align-items: center; gap: 14px; padding: 12px 14px; }
.lx-refaire + .lx-refaire { border-top: .5px solid var(--ap-trait); }
.lx-refaire strong { display: block; font-weight: 600; } .lx-refaire small { display: block; font-size: 12.5px; color: var(--ap-label2); }
.lx-refaire .lx-refaire-document { font-weight: 500; }
.lx-refaire-societe { color: var(--ap-label); text-decoration: none; } .lx-refaire-societe:hover strong { color: var(--ap-tint); }
.lx-refaire-droite { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; font-size: 12px; color: var(--ap-label2); }
.lx-refaire-droite .btn { height: 32px; padding: 0 15px; border-radius: 999px; font-size: 13.5px; font-weight: 500; }
.tiroir-refonte.tiroir-fenetre:has(.lx-feuille-refaire) { top: 14vh; max-height: 80vh; }
.lx-bulle-societes > .lx-palette-ligne .lx-avatar { display: none; }
.lx-bulle-societes > .lx-palette-ligne::before { content: ""; flex: none; width: 17px; height: 17px; background: var(--ap-label2);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3.5' width='14' height='17' rx='2'/%3E%3Cpath d='M9 8h2M13 8h2M9 12h2M13 12h2M10 20.5v-4h4v4'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3.5' width='14' height='17' rx='2'/%3E%3Cpath d='M9 8h2M13 8h2M9 12h2M13 12h2M10 20.5v-4h4v4'/%3E%3C/svg%3E") center / contain no-repeat; }
.lx-bulle-societes > .lx-palette-ligne:hover::before { background: #fff; }
/* un écran bas (le portable de 800) : le tableau de bord tient sans défiler (Othmane, lot T2) ; les cartes se resserrent,
   rien ne disparaît. À 900 de haut et plus, les mesures de la maquette. */
@media (max-height: 860px) {
  .lx-tableau-de-bord > .lx-tete { margin-bottom: 12px; }
  .lx-indicateurs { gap: 12px; }
  .lx-indicateur { padding: 12px 16px 12px; }
  .lx-indicateur-titre { margin-bottom: 8px; }
  .lx-colonnes { min-height: 92px; margin-top: 6px; }
  .lx-grand-chiffre { margin: 0 0 8px; }
  .lx-grand-chiffre > b { font-size: 34px; }
  .lx-indicateur .lx-ligne-chiffre { min-height: 30px; }
  .lx-mini-cases { margin-bottom: 8px; } .lx-mini-case { padding: 8px 10px; }
  .lx-roles { padding-top: 6px; }
  .lx-points .lx-ligne-chiffre.lx-point-attention { padding: 9px 10px 9px 12px; }
  .lx-points .lx-ligne-chiffre-nom > small { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
}
.lx-colonne { min-width: 0; }

/* ---------------------------------------------------------------------------------------------------------------------
   Lot AP9 · les modèles d'actes au détail près de leur maquette (`lots/maquettes/apple/modeles.html`,
   `lots/LOT-AP9-modeles.md`) : les formes en segment collé au titre et la recherche en verre, les opérations en
   sommaire à gauche, une carte par opération, chaque modèle une ligne qui s'ouvre sur place sur ce qui le remplit.
   --------------------------------------------------------------------------------------------------------------------- */
.lx-page-modeles { max-width: 1240px; gap: 0; font-size: 14px; line-height: 1.45; letter-spacing: -.006em; }
.lx-page-modeles > .lx-tete { align-items: flex-end; gap: 16px; margin-bottom: 18px; }
.lx-page-modeles > .lx-tete .lx-sous { max-width: 72ch; margin-top: 6px; font-size: 13px; line-height: 1.45; color: var(--ap-label2); }
.lx-page-modeles > .lx-tete .lx-gestes { gap: 10px; }
.lx-page-modeles > .lx-avis { margin-bottom: 16px; }
.lx-page-modeles .lx-total-modeles { display: inline-flex; }
.lx-page-modeles .lx-total-modeles .lx-etat { height: 22px; padding: 0 9px; gap: 6px; border-radius: 999px; font-size: 12px; font-weight: 500; background: var(--ap-fill2); color: var(--ap-label2); font-variant-numeric: tabular-nums; }
.lx-page-modeles .lx-total-modeles .lx-etat::before { width: 6px; height: 6px; background: currentColor; }
.lx-page-modeles > .lx-outils { margin: 0 0 16px; gap: 10px; }
.lx-page-modeles > .lx-outils > .lx-filtres { flex: 1; display: flex; flex-wrap: nowrap; align-items: center; gap: 10px; }
.lx-page-modeles > .lx-outils .lx-segment .lx-filtre { padding: 0 14px; }
.lx-page-modeles > .lx-outils .lx-recherche { display: flex; align-items: center; height: 40px; margin-left: auto; }
.lx-page-modeles > .lx-outils .lx-recherche input { width: 260px; margin: 0; transition: width .5s var(--apm-ressort), box-shadow .2s; }
.lx-page-modeles > .lx-outils .lx-segment .lx-filtre { letter-spacing: normal; }
.lx-page-modeles > .lx-outils .lx-recherche input:focus { width: 320px; }

/* deux colonnes : les opérations, les modèles */
.lx-colonnes-modeles.lx-avec-sous-menu { grid-template-columns: 236px minmax(0, 1fr); gap: 20px; }
.lx-colonnes-modeles > .lx-onglets.lx-sous-menu { top: 68px; gap: 1px; max-height: calc(100vh - 92px); overflow-y: auto; padding: 6px; border-radius: 20px;
  background: rgba(255, 255, 255, .55); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .05); }
.lx-colonnes-modeles > .lx-onglets.lx-sous-menu > a { align-items: center; gap: 8px; min-height: 34px; padding: 7px 10px; border-radius: 12px; font-size: 13.5px; line-height: 1.25;
  color: var(--ap-label2); transition: color .2s; }
.lx-colonnes-modeles > .lx-onglets.lx-sous-menu > a:hover { background: none; color: var(--ap-label); }
.lx-colonnes-modeles > .lx-onglets.lx-sous-menu > [aria-current] { color: var(--ap-label); font-weight: 600; }
.lx-colonnes-modeles > .lx-onglets.lx-sous-menu > [aria-current]::before { border-radius: 12px; background: rgba(255, 255, 255, .96);
  box-shadow: 0 0 0 .5px rgba(0, 0, 0, .04), 0 1px 2px rgba(0, 0, 0, .06), 0 4px 12px rgba(0, 0, 0, .1), inset 0 1px 0 #fff; }
.lx-colonnes-modeles > .lx-onglets.lx-sous-menu .lx-compte { margin: 0 0 0 auto; padding: 0 0 0 8px; min-width: 0; background: none; font-size: 11.5px; font-weight: 500; color: var(--ap-label3); font-variant-numeric: tabular-nums; }
.lx-colonnes-modeles > #modeles-liste { display: block; }

/* une carte par opération */
.lx-carte-modeles { margin-bottom: 26px; animation: apm-monte .45s var(--apm-ressort) both; }
.lx-carte-modeles > header { display: flex; align-items: baseline; gap: 8px; padding: 0 16px 8px; }
.lx-carte-modeles > header h2 { margin: 0; font-size: 20px; font-weight: 700; letter-spacing: -.02em; color: var(--ap-label); }
.lx-carte-modeles > header span { font-size: 13px; color: var(--ap-label3); font-variant-numeric: tabular-nums; }
.lx-groupe-modeles { border-radius: 20px; background: #fff; box-shadow: var(--ap-ombre-carte); }
:is(.lx-modele-entete, .lx-modele-tete) { display: grid; grid-template-columns: 36px minmax(0, 1fr) 270px 40px 16px; align-items: center; column-gap: 14px; padding: 0 16px; }
.lx-modele-entete { height: 34px; font-size: 12px; font-weight: 600; color: var(--ap-label3); border-bottom: .5px solid var(--ap-trait); }
.lx-modele-entete span:nth-child(4) { justify-self: center; white-space: nowrap; }   /* « Modèle de Lexia », sur son bouton rond */

/* une ligne de modèle, qui s'ouvre sur place sur ce qui le remplit */
.lx-modele-ligne { position: relative; animation: apm-entre .5s var(--apm-ressort) both; }
.lx-modele-ligne + .lx-modele-ligne::before { content: ""; position: absolute; left: 66px; right: 0; top: 0; border-top: .5px solid var(--ap-trait); }
.lx-modele-ligne[data-lx-recherche-cache] { display: none; }
.lx-modele-ligne.ap-entre { animation: apm-entre-encore .5s var(--apm-ressort) var(--ap-rang, 0ms) both; }
@keyframes apm-entre-encore { from { opacity: 0; transform: translateY(8px); } }
[data-lx-recherche-en-cours] .lx-modele-prepa { display: none; }
@keyframes apm-entre { from { opacity: 0; transform: translateY(8px); } }
.lx-modele-tete { min-height: 62px; padding-top: 10px; padding-bottom: 10px; transition: background-color .15s; }
.lx-modele-tete:hover { background: rgba(0, 0, 0, .018); }
.lx-groupe-modeles > .lx-modele-ligne:last-child .lx-modele-tete { border-radius: 0 0 20px 20px; }
.lx-vignette-doc { display: grid; place-items: center; width: 32px; height: 40px; border-radius: 6px; background: linear-gradient(180deg, #fff, #f3f3f5);
  box-shadow: 0 0 0 .5px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .06); font-size: 8.5px; font-weight: 700; color: #2f5fb3; }
.lx-vignette-doc.lx-vignette-officielle { color: var(--ap-label2); }
.lx-vignette-doc.lx-vignette-cabinet { color: var(--ap-tint); }
.lx-modele-nom { min-width: 0; font-size: 14px; }
.lx-modele-nom > .lx-lien-ligne { color: var(--ap-label); font-weight: 600; text-decoration: none; }
.lx-modele-nom > .lx-lien-ligne:hover { color: var(--ap-tint); text-decoration: none; }
.lx-modele-nom > .lx-etat { height: 22px; margin-left: 2px; padding: 0 9px; gap: 6px; border-radius: 999px; font-size: 12px; font-weight: 500; vertical-align: 1px; }
.lx-modele-nom > .lx-etat-gris { background: var(--ap-fill2); color: var(--ap-label2); }
.lx-modele-nom > .lx-etat-encre { background: var(--ap-tint-clair); color: var(--ap-tint); }
/* Othmane, 2026-10-31 · « Renommer », le crayon après le nom, qui paraît au survol de la ligne ou au clavier */
.lx-modele-nom > .lx-renommer { display: inline-grid; place-items: center; width: 24px; height: 24px; margin-left: 4px; border-radius: 50%; color: var(--ap-label2); vertical-align: -6px; opacity: 0; transition: opacity .15s, background-color .15s; }
.lx-modele-tete:hover .lx-renommer, .lx-modele-nom > .lx-renommer:focus-visible { opacity: 1; }
.lx-modele-nom > .lx-renommer:hover { background: var(--ap-fill2); color: var(--ap-label); }
.lx-modele-nom > .lx-renommer .lx-ic { width: 14px; height: 14px; }
.lx-modele-nom > .lx-resume { display: flex; width: fit-content; align-items: center; gap: 4px; margin-top: 2px; padding: 0; border: 0; border-radius: 6px; background: none;
  font: inherit; font-size: 12.5px; color: var(--ap-label2); cursor: pointer; transition: color .15s; }
.lx-modele-nom > .lx-resume:hover { color: var(--ap-tint); }
.lx-modele-nom > .lx-resume .lx-ic { width: 12px; height: 12px; transition: transform .45s var(--apm-ressort); }
.lx-modele-ligne.lx-ouverte .lx-resume .lx-ic { transform: rotate(180deg); }

/* le Word du cabinet : déposer, en bouton de verre ; déposé, la pastille, le « … » qui ouvre sa bulle, la ligne grise */
.lx-modele-cabinet { min-width: 0; font-size: 12.5px; color: var(--ap-label2); }
.lx-modele-cabinet small { display: block; margin-top: 3px; font-size: 12px; line-height: 1.3; color: var(--ap-label3); }
#modeles-liste .lx-modele-cabinet > .lx-gestes > a.btn.btn.btn { min-height: 0 !important; height: 28px !important; padding: 0 12px !important; gap: 7px; line-height: 1.45 !important; border: 0; border-radius: 999px !important; font-size: 12.5px !important; font-weight: 500; color: var(--ap-label);
  background: rgba(255, 255, 255, .78); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1), inset 0 1px 0 #fff, 0 1px 3px rgba(0, 0, 0, .08); }
.lx-modele-cabinet > .lx-gestes > a.btn.btn.btn:hover { background: #fff; }
#modeles-liste .lx-modele-cabinet > .lx-gestes > a.btn .lx-ic { width: 17px; height: 17px; margin: 0; }
.lx-modele-cabinet-etat { position: relative; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.lx-modele-cabinet-etat > .lx-etat { height: 22px; padding: 0 9px; gap: 6px; border-radius: 999px; font-size: 12px; font-weight: 500; background: var(--ap-tint-clair); color: var(--ap-tint); }
.lx-modele-cabinet-etat > .lx-gestes-replies { position: static; }
#modeles-liste .lx-modele-cabinet-etat > .lx-gestes-replies > summary.btn.btn.btn { display: grid; place-items: center; width: 26px; height: 26px !important; min-height: 0 !important; padding: 0 !important; border: 0; border-radius: 50% !important;
  background: none; box-shadow: none; font-size: 0 !important; line-height: 0 !important; color: var(--ap-label); transition: background-color .15s, transform .45s var(--apm-ressort-vif); }
.lx-modele-cabinet-etat > .lx-gestes-replies > summary.btn:hover, .lx-modele-cabinet-etat > .lx-gestes-replies[open] > summary.btn { background: rgba(0, 0, 0, .06); }
.lx-modele-cabinet-etat > .lx-gestes-replies > summary.btn:active { transform: scale(.86); }
.lx-modele-cabinet-etat > .lx-gestes-replies > summary.btn::after { width: 17px; height: 17px; margin: 0; border: 0; transform: none; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='6' cy='12' r='1.6'/%3E%3Ccircle cx='12' cy='12' r='1.6'/%3E%3Ccircle cx='18' cy='12' r='1.6'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='6' cy='12' r='1.6'/%3E%3Ccircle cx='12' cy='12' r='1.6'/%3E%3Ccircle cx='18' cy='12' r='1.6'/%3E%3C/svg%3E") center / contain no-repeat; }
.lx-gestes.ap-bulle-portee[data-lx-bulles]::before { display: none; }
.lx-gestes.ap-bulle-portee[data-lx-bulles] { --ap-ic-telecharger: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4.5V15M8 11l4 4 4-4M5 17v1.5A1.5 1.5 0 0 0 6.5 20h11a1.5 1.5 0 0 0 1.5-1.5V17'/%3E%3C/svg%3E"); --ap-ic-depot: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 15V4.5M8 8.5l4-4 4 4M5 14v4.5A1.5 1.5 0 0 0 6.5 20h11a1.5 1.5 0 0 0 1.5-1.5V14'/%3E%3C/svg%3E"); --ap-ic-croix: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 7l10 10M17 7 7 17'/%3E%3C/svg%3E"); }
.lx-gestes.ap-bulle-portee[data-lx-bulles] > a, .lx-gestes.ap-bulle-portee[data-lx-bulles] > form > .btn.btn:last-child { display: flex; align-items: center; justify-content: flex-start; gap: 10px; width: 100%;
  height: auto !important; min-height: 34px !important; padding: 0 10px !important; border: 0; border-radius: 10px !important; background: none !important; box-shadow: none !important;
  font-size: 13.5px !important; font-weight: 400; color: var(--ap-label) !important; text-decoration: none; transition: background-color .12s; }
.lx-gestes.ap-bulle-portee[data-lx-bulles] > a::before, .lx-gestes.ap-bulle-portee[data-lx-bulles] > form > .btn:last-child::before { content: ""; flex: none; width: 17px; height: 17px; background: var(--ap-label2);
  -webkit-mask: var(--ap-ic) center / contain no-repeat; mask: var(--ap-ic) center / contain no-repeat; }
.lx-gestes.ap-bulle-portee[data-lx-bulles] > a[download] { --ap-ic: var(--ap-ic-telecharger); }
.lx-gestes.ap-bulle-portee[data-lx-bulles] > a[data-fenetre] { --ap-ic: var(--ap-ic-depot); }
.lx-gestes.ap-bulle-portee[data-lx-bulles] > form > .btn.btn:last-child { --ap-ic: var(--ap-ic-croix); color: var(--ap-rouge) !important; }
.lx-gestes.ap-bulle-portee[data-lx-bulles] > form > .btn:last-child::before { background: currentColor; }
.lx-gestes.ap-bulle-portee[data-lx-bulles] > a:hover { background: var(--ap-tint) !important; color: #fff !important; }
.lx-gestes.ap-bulle-portee[data-lx-bulles] > a:hover::before { background: #fff; }
.lx-gestes.ap-bulle-portee[data-lx-bulles] > form > .btn.btn:last-child:hover { background: var(--ap-rouge) !important; color: #fff !important; }
.lx-gestes.ap-bulle-portee[data-lx-bulles] > form { margin: 0; }
.lx-gestes.ap-bulle-portee[data-lx-bulles] > form::before { content: ""; display: block; margin: 5px 10px; border-top: .5px solid var(--ap-trait); }
.lx-gestes.ap-bulle-portee[data-lx-bulles]:not(.ap-confirmer) .lx-coches { display: none; }
/* « Retirer » : la bulle devient la confirmation de la maquette (`apple.js`), sa précision, les formes, Annuler et Retirer */
.lx-gestes.ap-bulle-portee.ap-confirmer { max-width: 300px; padding: 8px 10px 10px; font-size: 13px; }
.lx-gestes.ap-bulle-portee.ap-confirmer > :not(form) { display: none; }
.lx-gestes.ap-bulle-portee.ap-confirmer > form { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.lx-gestes.ap-bulle-portee.ap-confirmer > form::before { display: none; }
.lx-gestes.ap-bulle-portee.ap-confirmer > form > p { width: 100%; margin: 0 0 4px; color: var(--ap-label2); }
.lx-gestes.ap-bulle-portee.ap-confirmer .lx-coches { display: flex; flex-wrap: wrap; gap: 6px; width: 100%; margin: 0 0 4px; padding: 0; border: 0; }
.lx-gestes.ap-bulle-portee.ap-confirmer .lx-coches > legend { width: 100%; margin: 0 0 6px; padding: 0; font-size: 12px; font-weight: 600; color: var(--ap-label3); }
.lx-gestes.ap-bulle-portee.ap-confirmer[data-lx-bulles] > form > .btn.btn.btn { width: auto !important; height: 32px !important; min-height: 0 !important; padding: 0 15px !important; border-radius: 999px !important; font-size: 13.5px !important; font-weight: 500; }
.lx-gestes.ap-bulle-portee.ap-confirmer[data-lx-bulles] > form > .btn.btn.btn:last-child { justify-content: center; background: var(--ap-rouge) !important; color: #fff !important; }
.lx-gestes.ap-bulle-portee.ap-confirmer > form > .btn.btn:last-child::before { display: none; }
.lx-gestes.ap-bulle-portee.ap-confirmer > form > .btn.btn:not(:last-child) { justify-content: center; border: 0; background: var(--ap-fill) !important; box-shadow: none !important; color: var(--ap-label) !important; }
.lx-gestes.ap-bulle-portee.ap-confirmer > form > .btn.btn:not(:last-child):hover { background: rgba(120, 120, 128, .2) !important; }
.bulle-texte.ap-bulle-portee[data-lx-bulles] { max-width: 300px; padding: 2px 10px 8px; }
.bulle-texte.ap-bulle-portee[data-lx-bulles] strong { margin: 0 -10px 0; padding: 6px 10px 4px; font-size: 12px; font-weight: 600; color: var(--ap-label3); }

/* le Word de Lexia d'un bouton rond, le chevron vers la page du modèle */
.lx-rond-modele { position: relative; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; color: var(--ap-label); text-decoration: none;
  transition: background-color .15s, transform .45s var(--apm-ressort-vif); }
.lx-rond-modele:hover { background: rgba(0, 0, 0, .06); color: var(--ap-label); }
.lx-rond-modele:active { transform: scale(.86); }
.lx-rond-modele .lx-ic { width: 17px; height: 17px; }
.lx-modele-chevron { display: grid; place-items: center; color: #c4c4c7; }
.lx-modele-chevron .lx-ic { width: 14px; height: 14px; }
.lx-modele-sans-lexia { grid-column: 4 / 6; font-size: 12px; color: var(--ap-label3); }

/* ce qui le remplit : la ligne s'ouvre en hauteur, les puces et les situations glissent */
.lx-modele-dessous { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .45s var(--apm-doux); }
.lx-modele-dessous > div { min-height: 0; overflow: hidden; }
.lx-modele-ligne.lx-ouverte .lx-modele-dessous { grid-template-rows: 1fr; }
.lx-modele-detail { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 18px; padding: 2px 16px 16px 66px; opacity: 0; transform: translateY(-6px);
  transition: opacity .25s, transform .5s var(--apm-ressort); }
.lx-modele-ligne.lx-ouverte .lx-modele-detail { opacity: 1; transform: none; transition-delay: .05s; }
.lx-modele-detail h4 { margin: 4px 0 8px; font-size: 12px; font-weight: 600; color: var(--ap-label3); }
.lx-modele-detail .lx-note { margin: 0; font-size: 12.5px; color: var(--ap-label3); }
.lx-puces-remplit { display: flex; flex-wrap: wrap; gap: 6px; }
.lx-puce-remplit { display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 4px 0 10px; border-radius: 999px; background: var(--ap-fill2); font-size: 12.5px; color: var(--ap-label); }
.lx-puce-remplit.lx-puce-calculee { padding-right: 10px; }
.lx-puce-remplit em { padding-right: 6px; font-style: normal; font-size: 11px; color: var(--ap-label3); }
.lx-puce-remplit.lx-puce-calculee em { padding-right: 0; }
.lx-puce-remplit details.bulle { display: inline-grid; margin: 0; padding: 0; }
.lx-puce-remplit details.bulle > summary::-webkit-details-marker { display: none; }
.lx-puce-remplit details.bulle > summary { margin: 0; padding: 0; border: 0; list-style: none; cursor: pointer; display: inline-grid; place-items: center; flex: none; width: 18px; height: 18px; border-radius: 50%; background: rgba(120, 120, 128, .16);
  color: var(--ap-label2); font-size: 11px; font-weight: 600; line-height: 1; transition: background-color .15s, transform .4s var(--apm-ressort-vif); }
.lx-puce-remplit details.bulle > summary:hover { background: var(--ap-tint); color: #fff; }
.lx-situations { margin: 0; padding: 0; list-style: none; font-size: 13px; color: var(--ap-label); }
.lx-situations li { display: flex; gap: 8px; padding: 3px 0; }
.lx-situations li::before { content: ""; flex: none; width: 6px; height: 6px; margin-top: 7px; border-radius: 50%; background: #d1d1d6; }
.lx-modele-prepa { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 12px 16px 14px 66px; border-top: .5px solid var(--ap-trait); }
.lx-modele-prepa small { width: 100%; font-size: 12px; color: var(--ap-label3); }
.lx-modele-prepa .lx-puce-prepa { padding-right: 10px; background: var(--ap-orange-clair); color: #7a4300; }
.lx-modele-vide { margin: 0; padding: 18px 16px 18px 66px; font-size: 13.5px; color: var(--ap-label2); }
.lx-modele-rien { margin: 0; padding: 34px 20px; border-radius: 20px; background: #fff; box-shadow: var(--ap-ombre-carte); text-align: center; color: var(--ap-label2); font-size: 14px; }
.lx-modele-rien[hidden] { display: none; }
.lx-modele-rien strong { display: block; margin-bottom: 4px; font-size: 17px; font-weight: 600; color: var(--ap-label); }
@media (prefers-reduced-motion: reduce) {
  .lx-carte-modeles, .lx-modele-ligne, .lx-modele-dessous, .lx-modele-detail, .lx-modele-nom > .lx-resume .lx-ic { animation: none; transition: none; }
}
/* les formes à cocher, en pastilles (`.forme-c` de la maquette) : dans la confirmation du retrait et dans les feuilles des
   modèles (`.lx-feuille-modeles`) */
:is(.ap-bulle-portee[data-lx-bulles], .lx-feuille-modeles) .lx-coches { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; border: 0; }
:is(.ap-bulle-portee[data-lx-bulles], .lx-feuille-modeles) .lx-coches > label { position: relative; display: inline-flex; align-items: center; gap: 6px; width: auto; height: 30px; min-height: 0; margin: 0;
  padding: 0 12px 0 8px; border: 0; border-radius: 999px; background: rgba(255, 255, 255, .85); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1); font-size: 13px; font-weight: 400; color: var(--ap-label);
  cursor: pointer; animation: none; transition: background-color .2s, color .2s, transform .45s var(--apm-ressort-vif); }
:is(.ap-bulle-portee[data-lx-bulles], .lx-feuille-modeles) .lx-coches > label:active { transform: scale(.93); }
:is(.ap-bulle-portee[data-lx-bulles], .lx-feuille-modeles) .lx-coches > label > input { appearance: none; -webkit-appearance: none; display: grid; place-items: center; flex: none; width: 16px; height: 16px;
  margin: 0; border: 0; border-radius: 50%; background: none; box-shadow: inset 0 0 0 1.5px #c7c7cc; transition: background-color .2s, box-shadow .2s; }
:is(.ap-bulle-portee[data-lx-bulles], .lx-feuille-modeles) .lx-coches > label > input::after { content: ""; width: 10px; height: 10px; background: #fff; transform: scale(0); transition: transform .4s var(--apm-ressort-vif);
  -webkit-mask: var(--ap-coche) center / contain no-repeat; mask: var(--ap-coche) center / contain no-repeat; }
:is(.ap-bulle-portee[data-lx-bulles], .lx-feuille-modeles) .lx-coches > label:has(input:checked) { background: var(--ap-tint-clair); color: var(--ap-tint); font-weight: 500; box-shadow: none; }
:is(.ap-bulle-portee[data-lx-bulles], .lx-feuille-modeles) .lx-coches > label > input:checked { background: var(--ap-tint); box-shadow: none; }
:is(.ap-bulle-portee[data-lx-bulles], .lx-feuille-modeles) .lx-coches > label > input:checked::after { transform: scale(1); }
:is(.ap-bulle-portee[data-lx-bulles], .lx-feuille-modeles) .lx-coches > label > input:focus-visible { outline: 2px solid var(--ap-tint); outline-offset: 2px; }
/* « Dans les autres formes » : la carte de la maquette (`.ailleurs`), sous les résultats */
.lx-page-modeles .lx-recherche-ailleurs { margin-top: 18px; overflow: visible; background: none; box-shadow: none; }
.lx-page-modeles .lx-recherche-ailleurs > .lx-palette-titre { margin: 0 16px 8px; padding: 0; font-size: 15px; font-weight: 600; letter-spacing: normal; text-transform: none; color: var(--ap-label); }
.lx-page-modeles .lx-recherche-ailleurs > .lx-palette-groupe { border-radius: 20px; background: #fff; box-shadow: var(--ap-ombre-carte); }
.lx-palette-ligne.lx-ligne-modele { position: relative; display: flex; align-items: center; gap: 12px; min-height: 0; padding: 10px 16px; border-radius: 0; font-size: 14px; color: var(--ap-label);
  text-decoration: none; animation: apm-entre .45s var(--apm-ressort) both; }
.lx-palette-ligne.lx-ligne-modele + .lx-ligne-modele { border-top: .5px solid var(--ap-trait); }
.lx-palette-ligne.lx-ligne-modele:hover { background: rgba(0, 0, 0, .02); color: var(--ap-label); }
.lx-ligne-modele:nth-child(2) { animation-delay: 25ms; } .lx-ligne-modele:nth-child(3) { animation-delay: 50ms; } .lx-ligne-modele:nth-child(4) { animation-delay: 75ms; }
.lx-ligne-modele:nth-child(5) { animation-delay: 100ms; } .lx-ligne-modele:nth-child(6) { animation-delay: 125ms; } .lx-ligne-modele:nth-child(n+7) { animation-delay: 150ms; }
.lx-ligne-modele .lx-palette-nom { display: block; flex: 1; min-width: 0; font-weight: 400; }
.lx-ligne-modele .lx-palette-nom small { display: block; margin: 0; font-size: 12px; color: var(--ap-label3); }
.lx-ligne-modele .lx-palette-precision { flex: none; height: 20px; margin: 0 0 0 auto; padding: 0 7px; border-radius: 6px; background: var(--ap-fill2); font-size: 11px; font-weight: 600; line-height: 20px; color: var(--ap-label2); }

/* ---------------------------------------------------------------------------------------------------------------------
   Lot AP9 · la page d'un modèle (`editeur-de-modele.html`) : la tête et ses étiquettes, le segment, le texte sur une
   feuille blanche, à côté les cartes groupées ; l'éditeur sur place (`editeur.js`).
   --------------------------------------------------------------------------------------------------------------------- */
main.page.lx-maquette:has(> .lx-page-modele) { padding-top: 22px; }
.lx-page-modele { max-width: 1280px; gap: 0; font-size: 14px; line-height: 1.45; letter-spacing: -.006em; }
.lx-page-modele > .lx-tete { align-items: flex-end; gap: 16px; margin-bottom: 16px; }
.lx-page-modele > .lx-tete .lx-ariane { display: flex; align-items: center; gap: 4px; margin: 0 0 6px; font-size: 12.5px; color: var(--ap-label3); }
.lx-page-modele > .lx-tete .lx-ariane a { color: inherit; text-decoration: none; }
.lx-page-modele > .lx-tete .lx-ariane a:hover { color: var(--ap-tint); }
.lx-page-modele > .lx-tete .lx-titre { font-size: 34px; font-weight: 700; line-height: 1.08; letter-spacing: -.028em; }
.lx-page-modele > .lx-tete .lx-sous { max-width: 70ch; margin-top: 6px; font-size: 13px; line-height: 1.45; color: var(--ap-label2); }
.lx-tete-etiquettes { display: flex; gap: 6px; margin-top: 8px; }
.lx-tete-etiquettes .lx-etat, .lx-modele-etats .lx-etat { height: 22px; padding: 0 9px; gap: 6px; border-radius: 999px; font-size: 12px; font-weight: 500; line-height: 22px; }
:is(.lx-tete-etiquettes, .lx-modele-etats) .lx-etat::before { width: 6px; height: 6px; background: currentColor; }
:is(.lx-tete-etiquettes, .lx-modele-etats, .modele-cote) .lx-etat-gris { background: var(--ap-fill2); color: var(--ap-label2); }
:is(.lx-tete-etiquettes, .lx-modele-etats, .modele-cote) .lx-etat-encre { background: var(--ap-tint-clair); color: var(--ap-tint); }
.lx-page-modele > .lx-tete .lx-gestes { gap: 8px; }
.lx-page-modele > .lx-tete .lx-gestes .btn .lx-ic { width: 17px; height: 17px; margin: 0; }
main.page .lx-page-modele > .lx-tete .lx-gestes #ed-modifier.btn { height: 32px !important; min-height: 32px !important; padding: 0 15px !important; font-size: 13.5px !important; border-radius: 999px !important; }
.lx-page-modele > .lx-avis { margin-bottom: 14px; }

/* le texte et ses cartes : la feuille à gauche, les cartes à droite, alignées sous le segment */
.lx-page-modele .modele-ouvert { grid-template-columns: minmax(0, 1fr) 360px; gap: 20px; }
.lx-page-modele .modele-texte { gap: 0; }
.lx-page-modele .modele-texte > .lx-onglets { margin: 0 0 14px; }
.lx-page-modele .modele-cote { gap: 14px; margin-top: 54px; }
.lx-page-modele .lx-papier { padding: 48px 56px 56px; border: 0; border-radius: 22px; background: #fff; box-shadow: var(--ap-ombre-carte), 0 18px 40px -28px rgba(0, 0, 0, .25);
  font-size: 14.5px; line-height: 1.7; color: var(--ap-label); }
.lx-page-modele .lx-papier p { margin: 0 0 12px; }
.lx-page-modele .lx-papier :is(.lx-papier-n1, .lx-papier-n2, .lx-papier-n3, .lx-papier-n4, .lx-papier-n5, .lx-papier-n6):not(.lx-papier-cas) { margin-top: 0; margin-bottom: 12px; padding: 0; border: 0;
  border-radius: 0; background: none; box-shadow: none; }
/* ce qu'un cas gouverne se lit sous sa pastille, à la marge du texte (la maquette) ; un cas dans un cas, un cran plus loin */
.lx-page-modele .lx-papier .lx-papier-n1 { margin-left: 0; } .lx-page-modele .lx-papier .lx-papier-n2 { margin-left: 22px; }
.lx-page-modele .lx-papier .lx-papier-n3 { margin-left: 44px; } .lx-page-modele .lx-papier :is(.lx-papier-n4, .lx-papier-n5, .lx-papier-n6) { margin-left: 66px; }
.lx-page-modele .lx-papier .lx-papier-gras { font-weight: 700; letter-spacing: .02em; }
.lx-page-modele .lx-papier .lx-papier-cas { margin: 4px 0 6px !important; font-size: 12px; font-weight: 600; line-height: 1.7; color: #7a4300; }
.lx-page-modele .lx-papier .lx-papier-cas > span { display: inline-flex; align-items: center; gap: 6px; height: 22px; padding: 0 9px; border: 0; border-radius: 999px; background: var(--ap-orange-clair); color: #7a4300; box-shadow: none; }
.lx-page-modele .lx-papier .lx-papier-cas-en-ligne { display: inline; height: auto; margin: 0 2px; padding: 1px 6px; border: 0; border-radius: 6px; background: var(--ap-orange-clair); box-shadow: none;
  font-size: 12.5px; font-weight: 500; color: #7a4300; }
.lx-page-modele .lx-papier .lx-trou { display: inline; padding: 1px 6px; border: 0; border-radius: 6px; background: var(--ap-tint-clair); box-shadow: none; color: var(--ap-tint); font-weight: 500;
  white-space: normal; cursor: help; }
.lx-page-modele .lx-papier .lx-trou-manque { background: var(--ap-orange-clair); color: #a35c00; cursor: default; }

/* les cartes groupées du côté */
.lx-page-modele .modele-cote > .lx-cadre { margin: 0; padding: 0; border: 0; border-radius: 20px; overflow: hidden; background: #fff; box-shadow: var(--ap-ombre-carte);
  animation: apm-monte .45s var(--apm-ressort) both; }
.lx-page-modele .modele-cote > .lx-cadre > .lx-cadre-tete { display: flex; align-items: baseline; gap: 8px; margin: 0; padding: 14px 16px 6px; border: 0; }
.lx-page-modele .modele-cote > .lx-cadre > .lx-cadre-tete h2 { display: flex; align-items: baseline; gap: 8px; margin: 0; font-size: 16px; font-weight: 700; letter-spacing: -.01em; color: var(--ap-label); }
.lx-page-modele .modele-cote > .lx-cadre > .lx-cadre-tete .lx-compte { min-width: 0; padding: 0; background: none; font-size: 12.5px; font-weight: 400; letter-spacing: normal; color: var(--ap-label3); }
.lx-page-modele .modele-cote > .lx-cadre > .lx-cadre-corps { display: block; padding: 0; }
.lx-page-modele .modele-cote > .lx-cadre > .lx-cadre-corps:has(> .lx-etiquette, > .lx-situations) { padding-bottom: 8px; }
.lx-page-modele .modele-cote .lx-cadre-corps > p:not(.lx-etiquette), .lx-modele-txt { margin: 0; padding: 4px 16px 12px; font-size: 13px; line-height: 1.45; color: var(--ap-label2); }
.lx-page-modele .modele-cote :is(.lx-modele-etats, .ed-version) { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0; padding: 4px 16px 8px; }
.lx-page-modele .modele-cote .lx-modele-liens { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; padding: 0 16px 6px; }
.lx-page-modele .modele-cote .lx-modele-liens > .lx-gestes { display: contents; }
.lx-page-modele .modele-cote .lx-modele-liens :is(a, summary) { font-size: 13px; }
.lx-page-modele .modele-cote .lx-modele-liens :is(a.lx-lien, a.btn.btn.btn, .lx-gestes-replies > summary.btn.btn.btn) { height: auto !important; min-height: 0 !important; padding: 0 4px !important; border: 0;
  background: none !important; box-shadow: none !important; font-size: 13px !important; font-weight: 500; color: var(--ap-tint) !important; text-decoration: none; }
.lx-page-modele .modele-cote .lx-modele-liens .lx-gestes-replies > summary.btn.btn.btn { color: var(--ap-rouge) !important; }
.lx-page-modele .modele-cote .lx-modele-liens .lx-gestes-replies > summary.btn::after { display: none; }
.lx-page-modele .modele-cote .lx-modele-liens a.btn.btn.btn:has(.lx-ic) { height: 32px !important; padding: 0 15px !important; gap: 7px; border-radius: 999px !important; font-size: 13.5px !important;
  color: var(--ap-label) !important; background: rgba(255, 255, 255, .78) !important; box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1), inset 0 1px 0 #fff, 0 1px 3px rgba(0, 0, 0, .08) !important; }
.lx-page-modele .modele-cote .lx-modele-liens a.btn .lx-ic { width: 17px; height: 17px; margin: 0; }
.lx-page-modele .modele-cote > .lx-cadre:has(.lx-modele-liens a.btn .lx-ic) .lx-modele-liens { padding: 6px 16px 6px; }
/* les lignes : « Dans l'opération » (le libellé, sa précision, la valeur à droite), ce qui le remplit, les situations */
.lx-page-modele .modele-cote .lx-ligne { display: flex; align-items: center; gap: 10px; min-height: 40px; margin: 0; padding: 8px 16px; border: 0; border-radius: 0; background: none; font-size: 13.5px; }
.lx-page-modele .modele-cote .lx-ligne + .lx-ligne { border-top: .5px solid var(--ap-trait); }
.lx-page-modele .modele-cote .lx-ligne .lx-ligne-corps { flex: none; min-width: 0; }
.lx-page-modele .modele-cote .lx-ligne .lx-ligne-titre { font-size: inherit; font-weight: 400; color: var(--ap-label); }
.lx-page-modele .modele-cote .lx-ligne .lx-ligne-gestes { order: 1; margin: 0; }
.lx-page-modele .modele-cote .lx-ligne .lx-ligne-valeur { order: 2; margin-left: auto; font-size: inherit; color: var(--ap-label2); text-align: right; }
.lx-page-modele .modele-cote details.bulle > summary { display: inline-grid; place-items: center; width: 18px; height: 18px; margin: 0; padding: 0; border: 0; border-radius: 50%; list-style: none;
  background: rgba(120, 120, 128, .16); color: var(--ap-label2); font-size: 11px; font-weight: 600; line-height: 1; cursor: pointer; transition: background-color .15s; }
.lx-page-modele .modele-cote details.bulle > summary::-webkit-details-marker { display: none; }
.lx-page-modele .modele-cote details.bulle > summary:hover { background: var(--ap-tint); color: #fff; }
.lx-page-modele .modele-cote .lx-cadre-corps > .lx-etiquette { margin: 0; padding: 10px 16px 2px; font-size: 11.5px; font-weight: 600; letter-spacing: normal; text-transform: none; color: var(--ap-label3); }
.lx-page-modele .modele-cote .lx-cadre-corps > .lx-etiquette ~ .lx-ligne { min-height: 0; padding: 6px 16px; font-size: 13px; border: 0; }
.lx-page-modele .modele-cote .lx-cadre-corps > .lx-etiquette ~ .lx-ligne .lx-ligne-corps { flex: 1; }
.lx-page-modele .modele-cote .lx-cadre-corps > .lx-etiquette ~ .lx-ligne .lx-ligne-gestes { margin-left: auto; }
.lx-page-modele .modele-cote .lx-cadre-corps > .lx-etiquette ~ .lx-ligne .lx-etat-gris { height: auto; padding: 0; background: none; font-size: 11.5px; font-weight: 400; color: var(--ap-label3); }
.lx-page-modele .modele-cote .lx-cadre-corps > .lx-etiquette ~ .lx-ligne .lx-etat-gris::before { display: none; }
.lx-page-modele .modele-cote .lx-situations { margin: 0; }
.lx-page-modele .modele-cote .lx-situations li { margin: 0; padding: 5px 16px; }
.lx-page-modele .modele-texte > .lx-onglets > a { padding: 0 16px; }
.lx-page-modele > .lx-tete .lx-ariane .lx-sep { display: inline-block; width: 11px; height: 11px; font-size: 0; background: currentColor;
  -webkit-mask: var(--ap-chevron) center / contain no-repeat; mask: var(--ap-chevron) center / contain no-repeat; }
:is(.lx-tete-etiquettes, .lx-modele-etats, .modele-cote) .lx-etat-ambre { background: var(--ap-orange-clair); color: var(--ap-orange-texte); }

/* l'édition sur place : le bandeau orange, le segment figé, la feuille sans cadre, les champs retirables d'un « × » */
.lx-page-modele { --ap-ic-crayon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15.5 5.5 18.5 8.5 9 18H6v-3z'/%3E%3C/svg%3E"); --ap-ic-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E"); }
.lx-page-modele .modele-texte:has(.lx-papier.ed-actif) > .lx-onglets { opacity: .45; pointer-events: none; transition: opacity .25s; }
.lx-page-modele .ed-bandeau-papier { flex-wrap: nowrap; justify-content: flex-start; gap: 12px; margin: 0 0 12px; padding: 10px 10px 10px 16px; border: 0; border-radius: 16px; background: var(--ap-orange-clair);
  color: #7a4300; font-size: 13px; line-height: 1.45; animation: apm-monte .45s var(--apm-ressort) both; }
.lx-page-modele .ed-bandeau-papier::before { content: ""; flex: none; width: 17px; height: 17px; background: currentColor; -webkit-mask: var(--ap-ic-crayon) center / contain no-repeat; mask: var(--ap-ic-crayon) center / contain no-repeat; }
.lx-page-modele .ed-bandeau-papier > span:first-of-type { flex: 1; }
.lx-page-modele .ed-bandeau-papier.ed-pour-tous { background: var(--ap-tint-clair); color: var(--ap-tint); }
/* Othmane, 2026-11-01 · le menu « Pour » de la carte du texte : toutes les sociétés, ou une seule */
.lx-page-modele .ed-pour { margin: 0 0 12px; }
.lx-page-modele .ed-pour .lx-case { width: 100%; }
main.page .lx-page-modele .ed-bandeau-papier .ed-boutons .btn.btn { height: 32px !important; min-height: 0 !important; padding: 0 15px !important; border: 0; border-radius: 999px !important; font-size: 13.5px !important;
  font-weight: 500; color: var(--ap-label); background: rgba(255, 255, 255, .78); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1), inset 0 1px 0 #fff, 0 1px 3px rgba(0, 0, 0, .08); }
.lx-page-modele .lx-papier.ed-actif { outline: 0; }
.lx-page-modele .lx-papier.ed-actif p[contenteditable="true"] { position: relative; margin-left: -8px; padding: 2px 8px; border-radius: 8px; outline: none; transition: background-color .15s, box-shadow .15s; }
.lx-page-modele .lx-papier.ed-actif p[contenteditable="true"].lx-papier-n2 { margin-left: 14px; }
.lx-page-modele .lx-papier.ed-actif p[contenteditable="true"].lx-papier-n3 { margin-left: 36px; }
.lx-page-modele .lx-papier.ed-actif p[contenteditable="true"]:hover { background: rgba(0, 0, 0, .02); }
.lx-page-modele .lx-papier.ed-actif p[contenteditable="true"]:focus { background: rgba(15, 123, 101, .04); box-shadow: inset 0 0 0 1px rgba(15, 123, 101, .25); }
.lx-page-modele .lx-papier p.ed-modifie { box-shadow: inset 3px 0 0 var(--ap-orange); }
.lx-page-modele .ed-plus-cas { display: block; position: absolute; left: -46px; top: 3px; width: auto; height: 22px; padding: 0 8px; border: 0; border-radius: 999px; background: var(--ap-fill);
  font-size: 11.5px; font-weight: 600; line-height: 22px; color: var(--ap-label2); opacity: 0; transition: opacity .15s, background-color .15s; }
.lx-page-modele .lx-papier.ed-actif p[contenteditable="true"]:is(:hover, :focus-within) .ed-plus-cas { opacity: 1; }
.lx-page-modele .ed-plus-cas:hover { background: var(--ap-orange); color: #fff; }
.lx-page-modele .lx-papier.ed-actif .lx-trou { padding-right: 2px; cursor: grab; }
.lx-page-modele .lx-papier.ed-actif .lx-trou .ed-x { position: static; display: inline-grid; place-items: center; width: 15px; height: 15px; margin-left: 4px; border-radius: 50%;
  background: rgba(15, 123, 101, .18); color: inherit; font-size: 11px; line-height: 1; vertical-align: 1px; cursor: pointer; }
.lx-page-modele .lx-papier.ed-actif .lx-trou .ed-x:hover { background: var(--ap-rouge); color: #fff; }
.lx-page-modele .lx-papier .lx-trou.ed-ajoute { box-shadow: none; animation: ap9-pose .6s var(--apm-ressort-vif); }
@keyframes ap9-pose { from { transform: scale(.4); opacity: 0; } }
.lx-page-modele .ed-form :is(select, input) { height: 34px; padding: 0 10px; border: 0; border-radius: 10px; background: #fff; box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .12); font-size: 13px; outline: none; }

/* la colonne des champs, collée pendant l'édition */
.lx-page-modele .lx-cadre.ed-collante { position: sticky; top: 16px; max-height: calc(100vh - 32px); display: flex; flex-direction: column; overflow: hidden; }
/* Othmane, 2026-11-01 · le panneau d'une zone de l'imprimé se tient comme celui du texte : collé à 16 du haut, de la
   hauteur de l'écran, et il défile en lui-même (la carte du côté le coupait : `overflow: hidden`) */
.lx-page-modele .modele-cote > .lx-cadre.im-panneau { position: sticky; top: 16px; max-height: calc(100vh - 32px); overflow-y: auto; overscroll-behavior: contain; }
.lx-page-modele .lx-cadre.ed-collante > .lx-cadre-corps { display: flex; flex-direction: column; min-height: 0; padding: 0; }
.lx-page-modele .ed-collante .ed-chercher { width: calc(100% - 32px); height: 36px; margin: 0 16px; padding: 0 12px; border: 0; border-radius: 11px; background: var(--ap-fill2); outline: none; font-size: 13.5px; }
.lx-page-modele .ed-collante .ed-chercher:focus { background: #fff; box-shadow: 0 0 0 1px var(--ap-tint), 0 0 0 4px var(--ap-tint-clair); }
.lx-page-modele .ed-collante .lx-segments { display: inline-flex; align-self: flex-start; gap: 2px; height: 34px; margin: 10px 16px 6px; padding: 3px; border: 0; border-radius: 999px; background: var(--ap-fill); box-shadow: none; }
.lx-page-modele .ed-collante .lx-segments label { position: relative; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; cursor: pointer; }
.lx-page-modele .ed-collante .lx-segments input { position: absolute; opacity: 0; pointer-events: none; }
.lx-page-modele .ed-collante .lx-segments span { display: inline-flex; align-items: center; height: 28px; padding: 0 12px; border: 0; border-radius: 999px; background: none; box-shadow: none; font-size: 12.5px; font-weight: 500;
  color: var(--ap-label2); transition: color .2s, background-color .2s; }
.lx-page-modele .ed-collante .lx-segments input:checked + span { background: rgba(255, 255, 255, .96); color: var(--ap-label); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .04), 0 1px 2px rgba(0, 0, 0, .06), 0 4px 12px rgba(0, 0, 0, .1); }
.lx-page-modele .ed-collante .ed-astuce { margin: 2px 16px 8px !important; padding: 0 !important; font-size: 12px !important; line-height: 1.45; color: var(--ap-label3) !important; }
.lx-page-modele .ed-collante .ed-liste { flex: 1; display: block; min-height: 0; max-height: none; margin: 0; padding: 0 16px 8px; overflow-y: auto; }
.lx-page-modele .ed-collante .ed-groupe > p { margin: 10px 0 6px !important; padding: 0 !important; font-size: 11.5px !important; font-weight: 600; color: var(--ap-label3) !important; }
.lx-page-modele .ed-collante .ed-puces { gap: 5px; }
.lx-page-modele .ed-champ { display: inline-flex; align-items: center; gap: 4px; height: 26px; padding: 0 10px; border: 0; border-radius: 999px; background: var(--ap-fill2); box-shadow: none; font-size: 12.5px;
  color: var(--ap-label); transition: background-color .15s, transform .4s var(--apm-ressort-vif); }
.lx-page-modele .ed-champ:hover { background: var(--ap-tint-clair); color: var(--ap-tint); box-shadow: none; }
.lx-page-modele .ed-champ:active { transform: scale(.94); }
.lx-page-modele .ed-champ em { font-size: 11px; color: var(--ap-label3); }
.lx-page-modele .ed-champ.ed-du-cab { background: var(--ap-fill2); box-shadow: inset 0 0 0 1px var(--ap-tint); }
.lx-page-modele .ed-champ.ed-du-cab em { color: var(--ap-label3); font-weight: 400; }
.lx-page-modele .ed-champ.ed-flash { animation: ap9-flash 1.1s var(--apm-doux); }
@keyframes ap9-flash { 0%, 40% { background: var(--ap-orange); color: #fff; } }
.lx-page-modele .ed-collante #ed-creation { padding: 10px 16px 14px; border-top: .5px solid var(--ap-trait); }
main.page .lx-page-modele .ed-collante #ed-creer.btn { gap: 7px; height: 32px !important; min-height: 0 !important; padding: 0 15px !important; border: 0; border-radius: 999px !important; font-size: 13.5px !important;
  font-weight: 500; color: var(--ap-label); background: var(--ap-fill); box-shadow: none; }
.lx-page-modele .ed-collante #ed-creer::before { content: ""; width: 17px; height: 17px; background: currentColor; -webkit-mask: var(--ap-ic-plus) center / contain no-repeat; mask: var(--ap-ic-plus) center / contain no-repeat; }
.lx-page-modele .ed-form { gap: 8px; padding: 0; border: 0; background: none; }
.lx-page-modele .ed-form label { display: block; font-size: 12px; font-weight: 600; color: var(--ap-label2); }
.lx-page-modele .ed-form label :is(input, select) { display: block; width: 100%; margin-top: 4px; font-weight: 400; color: var(--ap-label); }
.lx-page-modele .ed-form .ed-ligne { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }

/* Othmane, 2026-10-30 · écrire une personne : la puce d'une personne (« Gérant ») et, dessous, ce que porte son rôle ;
   l'étiquette qu'elle pose dans le texte ; le champ d'une personne hors d'une répétition et son « Corriger » ; la
   fenêtre « Écrire le gérant », ses cases, ses mots de liaison, son aperçu */
.lx-page-modele .ed-champ.ed-personne { font-weight: 600; background: var(--ap-tint-clair); color: var(--ap-tint); }
.lx-page-modele .ed-champ.ed-personne::before { content: ""; width: 13px; height: 13px; background: currentColor;
  -webkit-mask: var(--ap-ic-personne) center / contain no-repeat; mask: var(--ap-ic-personne) center / contain no-repeat; }
.lx-page-modele .ed-champ.ed-personne:hover { background: var(--ap-tint); color: #fff; }
.lx-page-modele .ed-puces.ed-sous-personne { margin: 5px 0 0 12px; padding-left: 10px; border-left: 1.5px solid var(--ap-trait); }
.lx-page-modele .ed-puces .ed-champ { height: auto; min-height: 26px; padding-top: 4px; padding-bottom: 4px; line-height: 1.3; }
.lx-page-modele .ed-groupe-personne + .ed-groupe-personne > p { display: none; }
.lx-page-modele .ed-groupe-personne + .ed-groupe-personne { margin-top: 10px; }
.lx-page-modele { --ap-ic-personne: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4.5 20c1.2-3.8 4-5.5 7.5-5.5s6.3 1.7 7.5 5.5'/%3E%3C/svg%3E"); }
.lx-page-modele .lx-papier .lx-trou.ed-etiquette { font-weight: 600; cursor: pointer; box-shadow: inset 0 0 0 1px rgba(15, 123, 101, .28); }
.lx-page-modele .lx-papier .lx-trou.ed-etiquette:hover { background: rgba(15, 123, 101, .2); }
.lx-page-modele .lx-papier .lx-trou.ed-hors { background: var(--ap-orange-clair); color: var(--ap-orange-texte); box-shadow: inset 0 0 0 1px rgba(242, 138, 0, .45); }
.lx-page-modele .lx-papier .ed-corriger { display: inline-flex; align-items: center; height: 20px; margin: 0 4px; padding: 0 8px; border: 0; border-radius: 999px; vertical-align: 1px;
  background: var(--ap-orange); color: #fff; font: inherit; font-size: 11.5px; font-weight: 600; line-height: 20px; cursor: pointer; }
.lx-page-modele .lx-papier .ed-corriger:hover { background: #d97a00; }
.lx-page-modele .lx-papier .ed-ecriture { display: none; }
.lx-page-modele .lx-papier.ed-actif .lx-papier-cellule p[contenteditable="true"] { margin-left: 0; padding: 2px 4px; }
.lx-page-modele .lx-papier.ed-actif .lx-papier-cellule p[contenteditable="true"]:empty::before { content: "\00a0"; }
/* Othmane, 2026-11-01 · les tableaux dans l'éditeur (maquette `lots/maquettes/tableaux-de-l-editeur/`) : la case où
   l'on écrit cerclée de vert ; la poignée d'une ligne, à gauche, et celle d'une colonne, au-dessus, au survol d'une
   case ; leur menu est la bulle des listes ; ce qui naît s'éclaire */
.lx-page-modele .lx-papier.ed-actif .lx-papier-cellule:focus-within { box-shadow: inset 0 0 0 2px var(--ap-tint); }
.lx-page-modele .lx-papier.ed-actif .lx-papier-cellule p[contenteditable="true"]:focus { background: none; box-shadow: none; }
.lx-page-modele .lx-papier.ed-actif .lx-papier-cellule:hover { background-color: var(--ap-fill2); }
.ed-tableau-poignee { position: fixed; z-index: 40; display: block; height: auto; margin: 0; opacity: 0; pointer-events: none; transition: opacity .15s; }
.ed-tableau-poignee::details-content { display: none; }
.ed-tableau-poignee.ed-vue, .ed-tableau-poignee[open] { opacity: 1; pointer-events: auto; }
.ed-tableau-poignee > summary { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 999px; background: var(--mz-surface); color: var(--ap-label2); list-style: none; cursor: pointer;
  box-shadow: var(--ap-ombre-poignee); transition: transform .4s var(--ap-ressort-vif), background-color .15s, color .15s; }
.ed-tableau-poignee > summary::-webkit-details-marker { display: none; }
.ed-tableau-poignee-colonne > summary { width: 28px; height: 16px; }
.ed-tableau-poignee > summary:hover, .ed-tableau-poignee[open] > summary { background: var(--ap-tint); color: var(--mz-surface); }
.ed-tableau-poignee > summary:active { transform: scale(.88); }
.ed-tableau-poignee > summary .lx-ic { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; }
.lx-gestes.ap-bulle-portee .btn.ed-retirer { color: var(--ap-rouge); }
.lx-gestes.ap-bulle-portee .btn.ed-retirer .lx-ic { color: var(--ap-rouge); }
.lx-gestes.ap-bulle-portee .btn.btn.ed-retirer:hover { background: var(--ap-rouge); color: var(--mz-surface); }
.lx-gestes.ap-bulle-portee .ed-titre-bulle { padding: 6px 10px 4px; font-size: 12px; font-weight: 600; color: var(--ap-label3); }
/* la condition écrite en mots, la répétition d'une ligne : une bulle, un champ où l'on écrit, ce que Lexia reconnaît */
.ed-panneau { width: 400px; max-width: calc(100vw - 24px); padding: 10px; }
.ed-panneau .ed-chercher { width: 100%; margin: 2px 0 4px; }
.ed-panneau .ed-reconnu { max-height: 300px; overflow-y: auto; }
.ed-panneau .ed-choix-c small { display: block; font-size: 11.5px; color: var(--ap-label3); }
.ed-panneau .ed-choix-c:hover small { color: var(--mz-surface); }
.ed-panneau .ed-choix-c.btn.btn { flex-direction: column; align-items: flex-start; justify-content: center; padding: 6px 10px; white-space: normal; }
.ed-panneau .ed-reconnu .ed-choix-c:first-of-type:not(:hover) { background: var(--ap-tint-clair); }
.ed-panneau .ed-etats-c { display: flex; flex-wrap: wrap; gap: 5px; margin: 4px 10px 8px; }
.ed-panneau .ed-etat-c { height: 26px; padding: 0 10px; border: 0; border-radius: 999px; background: var(--ap-fill2); font: inherit; font-size: 12.5px; cursor: pointer; }
.ed-panneau .ed-etat-c:hover { background: var(--ap-tint); color: var(--mz-surface); }
.ed-panneau .ed-sinon { display: block; margin: 8px 4px 2px; font-size: 12px; font-weight: 600; color: var(--ap-label2); }
.ed-panneau .ed-astuce { margin: 6px 6px 2px; font-size: 12px; color: var(--ap-label3); }
.lx-page-modele .ed-astuce.ed-guide { padding: 8px 12px; border-radius: 12px; background: var(--ap-orange-clair); color: var(--ap-orange-texte); }
.lx-gestes.ap-bulle-portee .lx-ic { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; }
.lx-papier .ed-nee, .lx-papier .ed-nee > td { animation: ed-nee .45s var(--ap-ressort-vif) both; }
@keyframes ed-nee { from { opacity: 0; background-color: var(--ap-tint-clair); } }
#ed-hors-avis { margin: 0 0 12px; }
.lx-page-modele .ed-collante .ed-liste > .ed-astuce { margin: 6px 0 4px !important; }
.lx-fenetre.ed-fenetre-personne { top: 5vh; width: min(680px, 94vw); max-height: 90vh; border-radius: 22px; }
.ed-fenetre-personne > header { padding: 16px 16px 10px 22px; border-bottom: 0; }
.ed-fenetre-personne > header h2 { font-size: 17px; font-weight: 700; letter-spacing: -.01em; }
.ed-fenetre-personne .lx-fenetre-corps { gap: 14px; padding: 4px 22px 16px; }
.ed-p-raccourcis { display: flex; flex-wrap: wrap; gap: 6px; }
.ed-p-court { height: 30px; padding: 0 13px; border: 0; border-radius: 999px; background: var(--ap-fill); color: var(--ap-label); font: inherit; font-size: 13px; font-weight: 500; cursor: pointer; }
.ed-p-court:hover { background: var(--ap-tint-clair); color: var(--ap-tint); }
.ed-p-groupe { margin: 0; padding: 0; border: 0; min-width: 0; display: flex; flex-wrap: wrap; column-gap: 0; row-gap: 2px; }
.ed-p-groupe > legend { float: left; width: 100%; margin: 0 0 6px; padding: 0; font-size: 12px; font-weight: 600; color: var(--ap-label2); }
.ed-p-aide { font-weight: 400; color: var(--ap-label3); }
/* une case non cochée tient une demi-ligne ; cochée, toute la ligne, avec ses mots de liaison */
.ed-p-case { flex: 0 0 50%; display: grid; grid-template-columns: minmax(150px, 190px) 1fr; align-items: center; gap: 10px; min-height: 30px; min-width: 0; }
.ed-p-case:has(.ed-p-lia:not([hidden])) { flex-basis: 100%; }
.ed-p-role > summary { margin: 0 0 6px; font-size: 12px; font-weight: 600; color: var(--ap-label2); cursor: pointer; }
.ed-p-role .ed-p-case label span { line-height: 1.25; }
.ed-p-fermer { width: 28px; height: 28px; border: 0; border-radius: 50%; background: var(--ap-fill); color: var(--ap-label2); font-size: 17px; line-height: 1; cursor: pointer; }
.ed-p-fermer:hover { background: rgba(120, 120, 128, .2); color: var(--ap-label); }
.ed-p-case label { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--ap-label); cursor: pointer; }
.ed-p-case input[type=checkbox] { width: 16px; height: 16px; margin: 0; accent-color: var(--ap-tint); }
.ed-p-lia, .ed-fenetre-personne select, .ed-p-f-valeur { height: 30px; min-width: 0; padding: 0 10px; border: 0; border-radius: 9px; background: var(--ap-fill2); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08);
  font: inherit; font-size: 13px; color: var(--ap-label); outline: none; }
.ed-p-lia:focus, .ed-fenetre-personne select:focus, .ed-p-f-valeur:focus { background: #fff; box-shadow: 0 0 0 1px var(--ap-tint), 0 0 0 4px var(--ap-tint-clair); }
.ed-p-lia[hidden], .ed-p-f-valeur[hidden], .ed-fenetre-personne select[hidden] { display: none; }
.ed-fenetre-personne .lx-choix:has(> select[hidden]) { display: none; }
.ed-fenetre-personne .ed-ligne { display: flex; flex-wrap: wrap; gap: 8px; }
.ed-p-modes { display: flex; flex-wrap: wrap; gap: 2px; align-self: flex-start; padding: 3px; border-radius: 999px; background: var(--ap-fill); }
.ed-p-modes label { position: relative; cursor: pointer; }
.ed-p-modes input { position: absolute; opacity: 0; pointer-events: none; }
.ed-p-modes span { display: inline-flex; align-items: center; height: 28px; padding: 0 12px; border-radius: 999px; font-size: 12.5px; font-weight: 500; color: var(--ap-label2); }
.ed-p-modes input:checked + span { background: #fff; color: var(--ap-label); box-shadow: 0 1px 2px rgba(0, 0, 0, .06), 0 4px 12px rgba(0, 0, 0, .1); }
.ed-p-modes .ed-p-interdit { cursor: not-allowed; opacity: .45; }
.ed-p-condition { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; margin: 0; font-size: 13px; color: var(--ap-label); }
.ed-p-apercu { flex: none; max-height: 190px; overflow-y: auto; margin: 0; padding: 12px 22px; border-top: .5px solid var(--ap-trait); background: rgba(120, 120, 128, .05); display: grid; gap: 8px; }
.ed-p-apercu .ed-p-legende { margin: 0; font-size: 11.5px; font-weight: 600; color: var(--ap-label3); text-transform: none; }
.ed-p-titre-ex { margin: 0 0 2px; font-size: 12px; font-weight: 600; color: var(--ap-label2); }
.ed-p-ex { margin: 0 0 4px; font-size: 13.5px; line-height: 1.55; color: var(--ap-label); }
.ed-p-ex.ed-p-rangee { padding: 4px 8px; border-radius: 6px; background: #fff; box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08); }
.ed-p-note { margin: 0; font-size: 12px; color: var(--ap-label3); }
.ed-p-pied { flex: none; display: flex; justify-content: flex-end; gap: 8px; padding: 12px 22px 16px; border-top: .5px solid var(--ap-trait); }
main.page .ed-p-pied .btn.btn, .ed-p-pied .btn.btn { height: 32px; min-height: 0; padding: 0 16px; border: 0; border-radius: 999px; font-size: 13.5px; font-weight: 500; }
.ed-p-pied .btn.btn-nu { color: var(--ap-label); background: var(--ap-fill); box-shadow: none; }
@media (max-width: 640px) { .ed-p-case { flex-basis: 100%; grid-template-columns: 1fr; gap: 4px; } }

/* « Rempli pour une société » : la société en pastille, ce qui le dit et « Ouvrir la fiche » sur la même ligne, la feuille */
.lx-page-modele .modele-societe { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 14px; font-size: 13px; color: var(--ap-label2); }
.lx-page-modele .modele-societe .lx-champ { display: inline-flex; flex: none; flex-direction: row; align-items: center; gap: 10px; max-width: none; margin: 0; }
.lx-page-modele .modele-societe .lx-champ-lib { margin: 0; font-size: 13px; font-weight: 400; color: var(--ap-label2); }
.lx-page-modele .modele-societe .lx-choix { width: auto; }
.lx-page-modele .modele-societe .lx-choix-bouton { display: inline-flex; align-items: center; gap: 8px; width: auto; height: 34px; padding: 0 12px; border: 0; border-radius: 999px; background: #fff;
  box-shadow: var(--ap-ombre-carte); font-size: 13.5px; font-weight: 500; color: var(--ap-label); }
.lx-page-modele .modele-societe .lx-choix-bouton svg { width: 13px; height: 13px; color: var(--ap-label3); }
.lx-page-modele .modele-societe > .lx-note { flex: 1; min-width: 240px; margin: 0; font-size: 13px; color: var(--ap-label2); }
.lx-page-modele .modele-texte > .lx-vide { margin: 0; padding: 88px 66px 96px; border: 0; border-radius: 22px; background: #fff; box-shadow: var(--ap-ombre-carte), 0 18px 40px -28px rgba(0, 0, 0, .25);
  text-align: center; font-size: 14.5px; line-height: 1.7; color: var(--ap-label2); }
.lx-page-modele .modele-texte > .lx-vide p { margin: 0 auto; max-width: none; font-size: 17px; font-weight: 600; line-height: 1.45; color: var(--ap-label); }
.lx-page-modele .modele-texte > .lx-vide p .lx-sous { display: block; margin-top: 4px; font-size: 14.5px; font-weight: 400; line-height: 1.7; color: var(--ap-label2); }
.lx-page-modele .lx-papier .lx-papier-nom { font-weight: 700; letter-spacing: .02em; }
.lx-page-modele .modele-texte > .lx-papier:not(.ed-actif) > p { animation: apm-monte .4s var(--apm-ressort) both; }

/* Lot AP9 · les feuilles des modèles (« Déposer le Word du cabinet », « Ajouter un document ») : la feuille de la
   maquette (560, 8vh), chaque rubrique son libellé dessus, la zone de dépôt, les formes en pastilles, Oui / Non en
   petit segment, le pied à droite */
.tiroir-refonte.tiroir-fenetre:has(.lx-feuille-modeles) { top: 8vh; max-height: 84vh; border-radius: 28px; }
.tiroir-refonte.tiroir-fenetre:has(.lx-feuille-modeles) > header { padding: 20px 18px 8px 24px; }
.tiroir-refonte.tiroir-fenetre:has(.lx-feuille-modeles) > header p { margin-top: 3px; font-size: 13px; }
.lx-feuille-modeles[data-lx-feuille] { padding: 8px 20px 20px; }
.lx-feuille-modeles .lx-champs-une { display: block; }
.lx-feuille-modeles :is(.lx-champ, .lx-coches) { display: block; margin: 14px 0 0; padding: 0; border: 0; }
.lx-feuille-modeles form > :first-of-type:is(.lx-champ, .lx-coches), .lx-feuille-modeles .lx-champs-une > :first-child { margin-top: 4px; }
.lx-feuille-modeles :is(.lx-champ-lib, .lx-coches > legend) { display: flex; align-items: center; gap: 6px; width: auto; margin: 0 4px 6px; padding: 0; font-size: 12.5px; font-weight: 600; line-height: 1.45;
  color: var(--ap-label2); }
.lx-feuille-modeles .lx-coches > legend { float: left; width: calc(100% - 8px); }
.lx-feuille-modeles .lx-coches > legend + * { clear: left; }
.lx-feuille-modeles input.lx-case { width: 100%; height: 38px; padding: 0 12px; border: 0; border-radius: 11px; background: rgba(255, 255, 255, .85); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08); font-size: 14px; }
.lx-feuille-modeles input.lx-case:focus { background: #fff; box-shadow: 0 0 0 1px var(--ap-tint), 0 0 0 4px var(--ap-tint-clair); }
.lx-feuille-modeles .lx-choix-bouton { height: 38px; padding: 0 12px; border: 0; border-radius: 11px; background: rgba(255, 255, 255, .85); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08); font-size: 14px; }
.lx-feuille-modeles .lx-choix-bouton svg { width: 14px; height: 14px; color: var(--ap-label3); }
.lx-feuille-modeles .lx-depot { display: flex; flex-direction: column; align-items: center; gap: 6px; width: 100%; box-sizing: border-box; padding: 22px 16px; border: 0; border-radius: 16px;
  background: rgba(255, 255, 255, .6); box-shadow: inset 0 0 0 1.5px rgba(60, 60, 67, .18); color: var(--ap-label2); font-size: 13.5px; font-weight: 400; text-align: center; cursor: pointer;
  transition: background-color .2s, box-shadow .2s, transform .45s var(--apm-ressort-vif); }
.lx-feuille-modeles .lx-depot > .lx-ic { width: 26px; height: 26px; color: var(--ap-tint); stroke-width: 1.5; }
.lx-feuille-modeles .lx-depot:is(:hover, .lx-depot-survole, :focus-within) { background: var(--ap-tint-clair); box-shadow: inset 0 0 0 1.5px var(--ap-tint); }
.lx-feuille-modeles .lx-depot small { font-size: 12px; color: var(--ap-label3); }
/* le fichier choisi : une carte, sa vignette, son nom, « Choisi à l'instant », le « × » */
.lx-feuille-modeles .lx-depot[data-lx-pris] { flex-direction: row; flex-wrap: wrap; align-content: center; justify-content: flex-start; column-gap: 12px; row-gap: 0; padding: 10px 10px 10px 56px; position: relative;
  min-height: 60px; background: rgba(255, 255, 255, .85); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .06); color: var(--ap-label); text-align: left; animation: apm-monte .45s var(--apm-ressort) both; }
.lx-feuille-modeles .lx-depot[data-lx-pris]::before { content: "DOCX"; position: absolute; left: 12px; top: 50%; display: grid; place-items: center; width: 32px; height: 40px; margin-top: -20px; border-radius: 6px;
  background: linear-gradient(180deg, #fff, #f3f3f5); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .06); font-size: 8.5px; font-weight: 700; color: #2f5fb3; }
.lx-feuille-modeles .lx-depot[data-lx-pris] > .lx-ic { display: none; }
.lx-feuille-modeles .lx-depot[data-lx-pris] [data-lx-fichier-choisi] { flex: 1 1 calc(100% - 50px); min-width: 0; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lx-feuille-modeles .lx-depot[data-lx-pris] [data-lx-choisi] { order: 3; width: 100%; }
.lx-feuille-modeles .lx-depot[data-lx-pris] .lx-depot-oter { position: absolute; right: 10px; top: 50%; display: grid; place-items: center; width: 32px; height: 32px; margin-top: -16px; padding: 0; border: 0;
  border-radius: 50%; background: none; color: var(--ap-label); cursor: pointer; transition: background-color .15s, transform .45s var(--apm-ressort-vif); }
.lx-feuille-modeles .lx-depot[data-lx-pris] .lx-depot-oter:hover { background: rgba(0, 0, 0, .06); }
.lx-feuille-modeles .lx-depot[data-lx-pris] .lx-depot-oter .lx-ic { width: 17px; height: 17px; }
.lx-feuille-modeles .lx-depot[data-lx-pris] [data-lx-fichier-choisi], .lx-feuille-modeles .lx-depot[data-lx-pris] [data-lx-choisi] { padding-right: 40px; }
/* Oui / Non : le petit segment de la maquette, sous son libellé */
.lx-feuille-modeles .lx-segments { display: inline-flex; gap: 2px; height: 34px; padding: 3px; border: 0; border-radius: 999px; background: var(--ap-fill); box-shadow: none; }
.lx-feuille-modeles .lx-segments label { position: relative; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; cursor: pointer; }
.lx-feuille-modeles .lx-segments input { position: absolute; opacity: 0; pointer-events: none; }
.lx-feuille-modeles .lx-segments span { display: inline-flex; align-items: center; height: 28px; padding: 0 16px; border: 0; border-radius: 999px; background: none; box-shadow: none; font-size: 13px; font-weight: 500;
  color: var(--ap-label2); transition: color .2s, background-color .2s; }
.lx-feuille-modeles .lx-segments input:checked + span { background: rgba(255, 255, 255, .96); color: var(--ap-label); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .04), 0 1px 2px rgba(0, 0, 0, .06), 0 4px 12px rgba(0, 0, 0, .1); }
/* le pied : la précision à gauche, Annuler et le bouton à droite ; « Envoyer » attend le Word */
.lx-feuille-modeles .lx-pied-fenetre { justify-content: flex-end; gap: 8px; margin: 20px 0 0; padding: 12px 0 0; }
.tiroir-fenetre .lx-feuille-modeles .lx-pied-fenetre { margin: 20px -20px -20px; padding: 12px 18px 16px; }
.lx-feuille-modeles .lx-pied-fenetre .lx-note { flex: 1; margin: 0; font-size: 12.5px; color: var(--ap-label3); }
.lx-feuille-modeles form:has(input[type=file][required]:invalid) .lx-pied-fenetre .btn-plein { opacity: .4; pointer-events: none; }
.lx-feuille-modeles .lx-coches, .lx-feuille-modeles form > .lx-champ:first-of-type, .lx-feuille-modeles .lx-champs-une > :first-child { margin-top: 14px; }
.lx-feuille-modeles .lx-depot > .lx-ic { display: block; flex: none; }
.lx-feuille-modeles .lx-depot > :is(span, small) { line-height: 1.45; }

/* l'avis d'un geste réussi, en tête des pages des modèles : vert clair, la coche, le rond « × » qui le ferme */
.lx-maquette > :is(.lx-page-modeles, .lx-page-modele) > .lx-avis-succes { display: flex; align-items: flex-start; gap: 12px; padding: 12px 12px 12px 16px; border: 0; border-radius: 18px;
  background: var(--ap-tint-clair); box-shadow: none; color: #0b5e4d; font-size: 13.5px; line-height: 1.45; animation: apm-monte .5s var(--apm-ressort) both; }
.lx-maquette > :is(.lx-page-modeles, .lx-page-modele) > .lx-avis-succes::before { content: ""; flex: none; width: 17px; height: 17px; margin-top: 1px; background: var(--ap-tint);
  -webkit-mask: var(--apm-coche) center / contain no-repeat; mask: var(--apm-coche) center / contain no-repeat; }
.lx-maquette > :is(.lx-page-modeles, .lx-page-modele) > .lx-avis-succes > p { flex: 1; max-width: none; margin: 0; padding: 0; text-align: left; }
.lx-avis-fermer { position: relative; display: grid; place-items: center; flex: none; width: 24px; height: 24px; margin: -2px -2px 0 0; padding: 0; border: 0; border-radius: 50%; background: none; color: inherit;
  cursor: pointer; transition: background-color .15s, transform .45s var(--apm-ressort-vif); }
.lx-avis-fermer::before { content: ""; width: 13px; height: 13px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 7l10 10M17 7 7 17'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 7l10 10M17 7 7 17'/%3E%3C/svg%3E") center / contain no-repeat; }
.lx-avis-fermer:hover { background: rgba(0, 0, 0, .06); } .lx-avis-fermer:active { transform: scale(.86); }
/* la carte de la version : ses liens l'un sous l'autre, les changements dits dans un encart gris, l'avis orange */
.lx-page-modele .modele-cote .ed-liens { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 0 16px 14px; }
.lx-page-modele .modele-cote .ed-liens .lx-lien { padding: 0 4px; border: 0; background: none; font-size: 13px; font-weight: 500; color: var(--ap-tint); text-decoration: none; cursor: pointer; }
.lx-page-modele .modele-cote .ed-liens .lx-lien:hover { color: var(--apm-tint2); }
.lx-page-modele .modele-cote .lx-cadre-corps > [id^="ed-"] > .ed-liste-dite, .lx-page-modele .modele-cote .lx-avis .ed-liste-dite { margin: 0 16px 12px; padding: 10px 12px; border-radius: 12px; background: #f2f2f7;
  font-size: 12.5px; color: var(--ap-label); list-style: none; display: block; }
.lx-page-modele .modele-cote .ed-liste-dite li + li { margin-top: 6px; }
.lx-page-modele .modele-cote .ed-liste-dite del { color: var(--ap-rouge); }
.lx-page-modele .modele-cote .ed-liste-dite ins { color: var(--ap-tint); text-decoration: none; }
.lx-page-modele .modele-cote .lx-cadre-corps > .lx-avis { display: flex; flex-wrap: wrap; gap: 12px; margin: 0 12px 12px; padding: 12px 16px; border: 0; border-radius: 18px; background: var(--ap-orange-clair);
  box-shadow: none; color: #7a4300; font-size: 13.5px; }
.lx-page-modele .modele-cote .lx-cadre-corps > .lx-avis .ed-liens { padding: 0; }
/* un document du cabinet, dans la liste : Modifier, Télécharger le Word, Retirer en liens sur une ligne (la maquette) */
.lx-modele-cabinet > .lx-modele-liens { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.lx-modele-cabinet > .lx-modele-liens > .lx-gestes { display: contents; }
#modeles-liste .lx-modele-cabinet > .lx-modele-liens :is(a.lx-lien, a.btn.btn.btn, .lx-gestes-replies > summary.btn.btn.btn) { height: auto !important; min-height: 0 !important; padding: 0 4px !important;
  border: 0; background: none !important; box-shadow: none !important; font-size: 12.5px !important; font-weight: 500; color: var(--ap-tint) !important; text-decoration: none; }
#modeles-liste .lx-modele-cabinet > .lx-modele-liens .lx-gestes-replies > summary.btn.btn.btn { color: var(--ap-rouge) !important; }
#modeles-liste .lx-modele-cabinet > .lx-modele-liens .lx-gestes-replies > summary.btn::after { display: none; }

/* Lot AP9 · les modèles sur un écran étroit (la maquette n'en dit rien) : la recherche passe sous les formes, les
   opérations au-dessus des cartes, la colonne du Word du cabinet se resserre ; la page d'un modèle sur une colonne */
@media (max-width: 1100px) {
  .lx-page-modeles > .lx-outils > .lx-filtres { flex-wrap: wrap; }
  .lx-page-modeles > .lx-outils .lx-segment { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
  .lx-colonnes-modeles.lx-avec-sous-menu { grid-template-columns: minmax(0, 1fr); }
  .lx-colonnes-modeles > .lx-onglets.lx-sous-menu { position: static; flex-direction: row; flex-wrap: wrap; max-height: none; }
  .lx-colonnes-modeles > .lx-onglets.lx-sous-menu > a { flex: none; }
  :is(.lx-modele-entete, .lx-modele-tete) { grid-template-columns: 36px minmax(0, 1fr) minmax(0, 200px) 40px 16px; }
  #modeles-liste .lx-modele-cabinet > .lx-gestes { display: block; max-width: 100%; }
  #modeles-liste .lx-modele-cabinet > .lx-gestes > a.btn.btn.btn { max-width: 100%; height: auto !important; min-height: 28px !important; padding: 4px 12px !important; white-space: normal; text-align: left; }
  .lx-page-modele .modele-ouvert { grid-template-columns: minmax(0, 1fr); }
  .lx-page-modele .modele-cote { margin-top: 0; }
  .lx-page-modele .lx-papier { padding: 32px 28px 36px; }
}
@media (max-width: 760px) {
  .lx-modele-entete { display: none; }
  .lx-modele-tete { grid-template-columns: 36px minmax(0, 1fr) 40px; row-gap: 8px; }
  .lx-modele-tete > .lx-modele-cabinet { grid-column: 2 / 4; grid-row: 2; }
  .lx-modele-tete > .lx-modele-chevron { display: none; }
  .lx-modele-tete > .lx-modele-sans-lexia { grid-column: 2 / 4; grid-row: 3; }
  .lx-modele-detail { grid-template-columns: minmax(0, 1fr); padding-left: 16px; }
}
.lx-page-modele .lx-papier .lx-trou, .lx-page-modele .lx-papier-cellule { overflow-wrap: anywhere; }

/* ==========================================================================================================
   Lot AP11 · la porte (`lots/maquettes/apple/connexion.html`) : connexion, mot de passe oublié, nouveau mot de passe,
   invitation, liens expirés, session expirée. Une carte de verre au milieu des halos, sans menu.
   ========================================================================================================== */
main.page.etroite:has(> .porte), main.page.etroite:has(> * > .porte) { display: grid; place-items: center; min-height: 100vh; max-width: none; margin: 0; padding: 24px 16px; }
main.page.etroite .porte.porte { position: relative; z-index: 1; display: block; width: 400px; max-width: 100%; font-size: 14px; line-height: 1.45; margin: 0; padding: 30px 30px 26px; border: 0; border-radius: 28px; text-align: left;
  background: var(--apm-verre-epais); backdrop-filter: var(--apm-flou); -webkit-backdrop-filter: var(--apm-flou); letter-spacing: -.006em; color: var(--apm-label);
  box-shadow: var(--apm-liser), 0 0 0 .5px rgba(0, 0, 0, .08), 0 30px 80px -24px rgba(0, 0, 0, .3); }
main.page.etroite .porte.porte > * { animation: apm-monte .5s var(--apm-ressort) both; }
main.page.etroite .porte.porte > :nth-child(2) { animation-delay: .04s; } .porte > :nth-child(3) { animation-delay: .08s; } .porte > :nth-child(n+4) { animation-delay: .12s; }
main.page.etroite .porte.porte.porte-secoue { animation: apm-secoue .45s var(--apm-doux); }
@keyframes apm-secoue { 20% { transform: translateX(-8px); } 40% { transform: translateX(6px); } 60% { transform: translateX(-4px); } 80% { transform: translateX(2px); } }
main.page.etroite .porte.porte .porte-marque { display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 0 0 22px; padding: 0; font-size: inherit; }
main.page.etroite .porte.porte .porte-marque b { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 16px; color: #fff; font-size: 26px; font-weight: 700;
  background: linear-gradient(160deg, #19a487, #0b5e4d); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 10px 26px -8px rgba(15, 123, 101, .6); }
main.page.etroite .porte.porte .porte-marque strong { font-size: 22px; font-weight: 700; letter-spacing: -.02em; }
main.page.etroite .porte.porte h1:not(.visuellement-cache) { margin: 0 0 6px; font-size: 22px; font-weight: 700; line-height: 1.2; letter-spacing: -.02em; text-align: center; }
main.page.etroite .porte.porte .porte-chapo { margin: 0 0 18px; font-size: 13.5px; line-height: 1.45; text-align: center; color: var(--apm-label2); }
main.page.etroite .porte.porte .porte-chapo.porte-qui { margin-bottom: 22px; }
main.page.etroite .porte.porte form { display: grid; gap: 12px; margin: 0; }
main.page.etroite .porte.porte label { display: grid; gap: 6px; width: auto; font-size: 13px; font-weight: 500; color: var(--apm-label); }
main.page.etroite .porte.porte label small { font-size: 12px; font-weight: 400; line-height: 1.4; color: var(--apm-label3); }
main.page.etroite .porte.porte label input:is([type="email"], [type="password"], [type="text"]) { width: 100%; height: 42px; padding: 0 12px; border: 0; border-radius: 11px; font: inherit; font-size: 15px;
  background: var(--apm-fill2); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08); outline: none; transition: box-shadow .2s, background-color .2s; }
main.page.etroite .porte.porte input:focus { background: #fff; box-shadow: 0 0 0 1px var(--apm-tint), 0 0 0 4px var(--apm-tint-clair); }
main.page.etroite .porte.porte .btn.btn-plein.btn.btn, main.page.etroite .porte.porte button[type="submit"].btn.btn { display: flex; align-items: center; justify-content: center; width: 100%; height: 42px !important; min-height: 0 !important; margin: 4px 0 0;
  padding: 0 15px !important; border: 0; border-radius: 999px !important; font-size: 15px !important; font-weight: 500; color: #fff; cursor: pointer;
  background: linear-gradient(180deg, #1aa688, var(--apm-tint) 60%, #0b6654);
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .15), inset 0 1px 0 rgba(255, 255, 255, .4), inset 0 -1px 1px rgba(0, 0, 0, .12), 0 4px 14px -4px rgba(15, 123, 101, .55);
  transition: transform .45s var(--apm-ressort-vif), filter .2s; }
main.page.etroite .porte.porte .btn.btn-plein:hover { filter: brightness(1.07); } .porte .btn.btn-plein:active { transform: scale(.97); }
main.page.etroite .porte.porte .porte-lien { display: block; margin: 14px 0 0; font-size: 13.5px; text-align: center; color: var(--apm-tint); text-decoration: none; }
main.page.etroite .porte.porte .porte-lien:hover { color: #12957a; }
main.page.etroite .porte.porte .porte-note { margin: 16px 0 0; padding: 14px 0 0; border-top: .5px solid var(--apm-sep); font-size: 12.5px; line-height: 1.45; text-align: center; color: var(--apm-label3); }
/* l'avis de la porte (`.avis`) : orange, refus en rouge, envoi en vert, chacun son dessin */
main.page.etroite .porte.porte .lx-avis { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 14px; padding: 11px 13px; border: 0; border-radius: 14px; box-shadow: none;
  font-size: 13px; line-height: 1.4; background: var(--apm-orange-clair); color: #7a4300; animation: apm-monte .45s var(--apm-ressort) both; }
main.page.etroite .porte.porte .lx-avis > p { flex: 1; margin: 0; padding: 0; text-align: left; } .porte .lx-avis b, .porte .lx-avis strong { font-weight: 600; }
main.page.etroite .porte.porte .lx-avis::before { content: ""; flex: none; width: 17px; height: 17px; margin-top: 1px; background: var(--apm-orange);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4 3 19.5h18z'/%3E%3Cpath d='M12 10v4.5M12 17.3v.2'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4 3 19.5h18z'/%3E%3Cpath d='M12 10v4.5M12 17.3v.2'/%3E%3C/svg%3E") center / contain no-repeat; }
main.page.etroite .porte.porte .lx-avis.lx-avis-horloge::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E"); }
main.page.etroite .porte.porte .lx-avis-erreur { background: rgba(229, 55, 44, .09); color: #9b1c14; } .porte .lx-avis-erreur::before { background: #e5372c; }
main.page.etroite .porte.porte .lx-avis-succes { background: var(--apm-tint-clair); color: #0b5e4d; font-weight: 600; }
main.page.etroite .porte.porte .lx-avis-succes::before { background: var(--apm-tint); -webkit-mask-image: var(--apm-coche); mask-image: var(--apm-coche); }
main.page.etroite .porte.porte label { line-height: 1.45; }
main.page.etroite .porte.porte .porte-marque strong, main.page.etroite .porte.porte h1:not(.visuellement-cache) { line-height: normal; }
main.page.etroite .porte.porte label input { margin: 0; }
/* le refus de la connexion se dit en gras (`<b>` de la maquette) ; ceux du mot de passe restent en texte */
main.page.etroite .porte.porte:has(.porte-marque) .lx-avis-erreur { font-weight: 600; }
main.page.etroite .porte.porte .lx-avis { line-height: 1.45; }
/* la porte n'a pas de barre : la cale de la barre (`main.page::before`) ne la pousse pas vers le bas */
main.page.etroite:has(> .porte)::before { content: none; }

/* ==========================================================================================================
   Lot AP11 · les Réglages (`administration.css` des maquettes : `.reglages`, `.rubriques`, `.panneau`), d'abord pour
   Mon compte : la colonne des rubriques (qui l'on est, les rubriques, Se déconnecter) et le panneau de la rubrique.
   La rubrique choisie porte la lentille blanche, qui glisse d'une page à l'autre (`apple.js`).
   ========================================================================================================== */
.lx-tete:has(+ .lx-reglages) { margin-bottom: 20px; }
.lx-tete:has(+ .lx-reglages) .lx-titre { font-size: 34px; font-weight: 700; line-height: 1.05; letter-spacing: -.028em; }
.lx-tete:has(+ .lx-reglages) .lx-sous { margin-top: 4px; font-size: 13px; color: var(--apm-label2); }
.lx-reglages { display: grid; grid-template-columns: 256px minmax(0, 1fr); gap: 24px; align-items: start; letter-spacing: -.006em; color: var(--apm-label); }
.lx-rubriques { position: sticky; top: 28px; display: flex; flex-direction: column; gap: 1px; padding: 6px; border-radius: 20px; background: rgba(255, 255, 255, .55); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .05); }
.lx-carte-moi { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; padding: 14px 12px; border-radius: 16px; background: rgba(255, 255, 255, .9); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .05); }
.lx-carte-moi .lx-avatar { display: grid; place-items: center; flex: none; width: 42px; height: 42px; border-radius: 50%; font-size: 14px; font-weight: 600; color: #fff; background: linear-gradient(160deg, #b4b8c0, #868b95); }
.lx-carte-moi strong { display: block; font-size: 14px; font-weight: 600; }
.lx-carte-moi small { display: block; font-size: 12px; line-height: 1.35; color: var(--apm-label3); }
.lx-rubrique { position: relative; z-index: 1; display: flex; align-items: center; gap: 10px; height: 36px; padding: 0 8px; border: 0; border-radius: 12px; background: none;
  font: inherit; font-size: 13.5px; color: var(--apm-label); text-align: left; text-decoration: none; white-space: nowrap; cursor: pointer; transition: transform .45s var(--apm-ressort-vif); }
.lx-rubrique:active { transform: scale(.97); }
/* une seule colonne de rubriques pour Mon compte et l'administration (Othmane, 2026-10-30) : ses groupes, le survol,
   la lentille blanche qui glisse vers la rubrique ouverte (`apple.js`) */
.lx-rubriques h6 { margin: 10px 10px 4px; font-size: 11px; font-weight: 600; color: var(--ap-label3); }
.lx-rubriques h6:first-child { margin-top: 4px; }
.lx-rubrique { isolation: isolate; }
.lx-rubrique:hover { color: var(--apm-label); text-decoration: none; background: rgba(0, 0, 0, .03); }
.lx-rubrique[aria-current] { font-weight: 600; background: none; }
.lx-rubrique[aria-current]::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: rgba(255, 255, 255, .96);
  box-shadow: 0 0 0 .5px rgba(0, 0, 0, .04), 0 1px 2px rgba(0, 0, 0, .06), 0 4px 12px rgba(0, 0, 0, .08); transform-origin: 0 0; }
.lx-rubrique-ico { display: grid; place-items: center; flex: none; width: 26px; height: 26px; border-radius: 8px; background: var(--apm-tint-clair); color: var(--apm-tint); }
.lx-rubrique-ico .lx-ic { width: 15px; height: 15px; }
.lx-rubrique > i { margin-left: auto; min-width: 20px; height: 18px; padding: 0 6px; border-radius: 9px; background: var(--apm-orange-clair); color: var(--apm-orange-encre); font-size: 11px; font-weight: 600; font-style: normal; line-height: 18px; text-align: center; }
.lx-rubrique.lx-sortir { height: 34px; margin-top: 6px; padding: 0 10px; gap: 8px; color: #e5372c; }
.lx-rubrique.lx-sortir:hover { background: rgba(229, 55, 44, .08); }
.lx-rubrique.lx-sortir .lx-ic { width: 17px; height: 17px; }
.lx-panneau { min-width: 0; animation: apm-vue .5s var(--apm-ressort) both; }
@keyframes apm-vue { from { opacity: 0; transform: translateY(10px) scale(.995); } }
/* la tête de la rubrique (`.tete-rub`) */
.lx-tete-rub { display: flex; align-items: flex-end; gap: 12px; margin: 0 0 14px; padding: 0 4px; }
.lx-tete-rub h2 { display: flex; align-items: center; margin: 0; font-size: 20px; font-weight: 700; line-height: 1.2; letter-spacing: -.02em; }
.lx-tete-rub p { margin: 4px 0 0; max-width: 70ch; font-size: 13px; line-height: 1.45; color: var(--apm-label2); }
.lx-tete-rub .lx-gestes { display: flex; gap: 8px; flex: none; margin-left: auto; }
.lx-compte-rub { margin-left: 6px; font-size: 13px; font-weight: 400; color: var(--apm-label3); }
.lx-tete-rub details.bulle > summary, .lx-titre-groupe details.bulle > summary { display: inline-grid; place-items: center; width: 18px; height: 18px; min-width: 0; margin-left: 4px; padding: 0; border: 0; border-radius: 50%;
  background: var(--apm-fill); color: var(--apm-label2); font-size: 11px; font-weight: 600; box-shadow: none; }
.lx-panneau .btn.btn { display: inline-flex; align-items: center; gap: 7px; height: 32px !important; min-height: 0 !important; padding: 0 15px !important; border: 0; border-radius: 999px !important;
  font-size: 13.5px !important; font-weight: 500; line-height: 1.45 !important; text-decoration: none; color: var(--apm-label);
  background: rgba(255, 255, 255, .78); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .1), inset 0 1px 0 #fff, 0 1px 3px rgba(0, 0, 0, .08); }
.lx-panneau .btn.btn-plein { color: #fff; background: linear-gradient(180deg, #1aa688, var(--apm-tint) 60%, #0b6654);
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .15), inset 0 1px 0 rgba(255, 255, 255, .4), inset 0 -1px 1px rgba(0, 0, 0, .12), 0 4px 14px -4px rgba(15, 123, 101, .55); }
.lx-panneau .btn .lx-ic { width: 17px; height: 17px; }
/* les avis du panneau (`.avis`, `.avis.neutre`, `.refus`, `.fait`) */
.lx-panneau .lx-avis { display: flex; align-items: flex-start; gap: 12px; margin: 0; padding: 12px 14px 12px 16px; border: 0; border-radius: 16px; box-shadow: none; font-size: 13.5px; line-height: 1.45;
  background: var(--apm-orange-clair); color: #7a4300; }
.lx-panneau .lx-avis > p { flex: 1; margin: 0; padding: 0; text-align: left; }
.lx-panneau .lx-avis::before { content: ""; flex: none; width: 20px; height: 20px; margin-top: 1px; background: var(--apm-orange);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4 3 19.5h18z'/%3E%3Cpath d='M12 10v4.5M12 17.3v.2'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4 3 19.5h18z'/%3E%3Cpath d='M12 10v4.5M12 17.3v.2'/%3E%3C/svg%3E") center / contain no-repeat; }
.lx-panneau .lx-avis-info { background: var(--apm-fill2); color: var(--apm-label2); } .lx-panneau .lx-avis-info::before { background: var(--apm-label3); }
.lx-panneau .lx-avis-erreur { background: rgba(229, 55, 44, .09); color: #9b1c14; } .lx-panneau .lx-avis-erreur::before { background: #e5372c; }
.lx-panneau .lx-avis-succes { background: var(--apm-tint-clair); color: #0b5e4d; } .lx-panneau .lx-avis-succes::before { background: var(--apm-tint); -webkit-mask-image: var(--apm-coche); mask-image: var(--apm-coche); }
.lx-panneau .lx-avis.lx-avis-horloge::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E"); }
.lx-panneau .lx-avis + :is(.lx-cadre, .lx-vide, .lx-titre-groupe) { margin-top: 12px; }
/* les groupes du panneau (`.groupe`, `.titre-groupe`, `.groupe-tete`), l'état vide (`.vide-l`) */
.lx-panneau .lx-cadre { margin: 0 0 12px; padding: 0; border: 0; border-radius: 18px; background: #fff; box-shadow: var(--apm-ombre-carte); overflow: hidden; }
.lx-panneau .lx-cadre-corps { padding: 0; border: 0; background: none; }
.lx-panneau details.lx-cadre > summary.lx-cadre-tete, .lx-panneau .lx-cadre > .lx-cadre-tete { display: flex; align-items: baseline; gap: 8px; margin: 0; padding: 12px 14px 4px; border: 0; list-style: none; cursor: pointer; }
.lx-panneau .lx-cadre-tete h2 { display: flex; align-items: baseline; gap: 8px; margin: 0; font-size: 14px; font-weight: 600; text-transform: none; letter-spacing: 0; color: var(--apm-label); }
.lx-panneau .lx-cadre-tete .lx-compte { padding: 0; border: 0; background: none; font-size: 14px; font-weight: 500; color: var(--apm-label3); }
.lx-titre-groupe { display: flex; align-items: center; margin: 22px 16px 6px; font-size: 12px; font-weight: 600; color: var(--apm-label3); }
.lx-panneau .lx-note-groupe { margin: 0; padding: 0 16px 8px; max-width: 90ch; font-size: 12.5px; color: var(--apm-label3); }
.lx-panneau > .lx-vide, .lx-panneau .lx-vide:only-child { display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 0; padding: 46px 30px; border: 0; border-radius: 18px;
  background: #fff; box-shadow: var(--apm-ombre-carte); text-align: center; color: var(--apm-label2); }
.lx-vide-ic { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 20px; background: var(--apm-fill2); color: var(--apm-label3); }
.lx-vide-ic .lx-ic { width: 30px; height: 30px; stroke-width: 1.4; }
.lx-panneau .lx-vide > p { display: flex; flex-direction: column; gap: 10px; align-items: center; margin: 0; font-size: 17px; font-weight: 600; color: var(--apm-label); }
.lx-panneau .lx-vide > p .lx-sous { display: block; max-width: 52ch; font-size: 13.5px; font-weight: 400; color: var(--apm-label2); }
/* les journaux (`.journal`) et le tableau d'une absence (`.table`) */
.lx-panneau .cadre-table { margin: 0; padding: 0; border: 0; overflow-x: auto; }
.lx-panneau .cadre-table table { width: 100%; border-collapse: collapse; border: 0; font-size: 13px; }
.lx-panneau .cadre-table th { height: 34px; padding: 0 14px; border: 0; border-bottom: .5px solid var(--apm-sep); background: none; text-align: left; font-size: 12px; font-weight: 600; text-transform: none; letter-spacing: 0; color: var(--apm-label3); }
.lx-panneau .cadre-table td { padding: 9px 14px; border: 0; border-top: .5px solid var(--apm-sep); background: none; vertical-align: top; }
.lx-panneau .cadre-table tr:first-child td { border-top: 0; }
.lx-panneau .cadre-table td:first-child { width: 128px; white-space: nowrap; color: var(--apm-label2); font-variant-numeric: tabular-nums; }
.lx-panneau .cadre-table .lx-avatar { display: inline-grid; place-items: center; width: 22px; height: 22px; margin-right: 6px; border-radius: 50%; vertical-align: -6px; font-size: 9.5px; font-weight: 600; color: #fff; background: linear-gradient(160deg, #b4b8c0, #868b95); }
/* le filtre par personne (`.titre-groupe` et son `.choix`) */
.lx-filtre-personne { display: flex; align-items: center; gap: 10px; margin: 0 16px 6px; }
.lx-filtre-personne label { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 600; color: var(--apm-label3); }
.lx-filtre-personne select { height: 30px; padding: 0 10px 0 12px; border: 0; border-radius: 9px; background: var(--apm-fill2); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08); font: inherit; font-size: 13px; font-weight: 400; color: var(--apm-label3); }
.lx-filtre-personne .btn.btn { height: 30px !important; font-size: 13px !important; }
.lx-reglages { font-size: 14px; line-height: 1.45; }
.lx-rubrique.lx-sortir { height: 36px; }
.lx-panneau .lx-avis { justify-content: flex-start; } .lx-panneau .lx-avis > p { max-width: none; }
/* `lx-maquette` passe au niveau de `cadre.css` (`main.page:not(.nue)…`), qui lui imposait ses marges de 40 */
@media (min-width: 1200px) { main.page.lx-maquette:not(.nue):not(.tenue):not(.etroite) { padding: 28px 28px 28px 24px; } }
.lx-tete:has(+ .lx-reglages) { min-height: 0; padding-top: 0; }
.lx-tete:has(+ .lx-reglages) .lx-sous { line-height: 1.45; }
.lx-carte-moi strong { line-height: 1.45; }
main.page .lx-tete:has(+ .lx-reglages) { min-height: 0; margin: 0 0 20px; padding: 0; }
.lx-panneau .btn.btn { gap: 7px; letter-spacing: -.006em; } .lx-panneau .btn > svg { margin: 0; }
.lx-reglages .lx-carte-moi small { font-size: 12px; line-height: 1.35; }
main.page:not(.tenue) > .lx-tete:first-child:has(+ .lx-reglages) { padding-top: 0; }
main.page:not(.tenue) > .lx-tete:first-child:has(+ .lx-reglages) { margin-bottom: -2px; }   /* + l'écart de 22 de la page : 20 sous la tête */
.lx-reglages .lx-carte-moi small { margin: 0; }
.lx-panneau .lx-vide > p { line-height: normal; } .lx-panneau .lx-vide > p .lx-sous { line-height: 1.45; }
.lx-panneau .lx-vide > p { line-height: 20px; }
/* Journaux : le filtre à gauche, en petit choix (`.choix`) ; les groupes ne se replient pas à l'œil (pas de chevron) ;
   qui a agi tient sur une ligne ; « lecture seule » porte son cadenas */
.lx-filtre-personne { justify-content: flex-start; }
.lx-filtre-personne .lx-choix { min-width: 0 !important; width: auto; }
.lx-filtre-personne .lx-choix-bouton { height: 30px; min-height: 0; padding: 0 10px 0 12px; border: 0; border-radius: 9px; background: var(--apm-fill2); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08);
  font-size: 13px; font-weight: 400; color: var(--apm-label3); }
.lx-filtre-personne .lx-choix-bouton:not(.lx-choix-vide) { background: var(--apm-tint-clair); color: var(--apm-tint); font-weight: 500; }
.lx-panneau summary.lx-cadre-tete h2::before, .lx-panneau summary.lx-cadre-tete::before { content: none; }
.lx-panneau .cadre-table td:nth-child(2) { white-space: nowrap; }
.lx-tete-rub .lx-etat-gris { display: inline-flex; align-items: center; gap: 5px; }
.lx-tete-rub .lx-etat-gris::before { content: ""; width: 13px; height: 13px; border-radius: 0; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5.5' y='10.5' width='13' height='9.5' rx='2'/%3E%3Cpath d='M8.5 10.5V8a3.5 3.5 0 0 1 7 0v2.5'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5.5' y='10.5' width='13' height='9.5' rx='2'/%3E%3Cpath d='M8.5 10.5V8a3.5 3.5 0 0 1 7 0v2.5'/%3E%3C/svg%3E") center / contain no-repeat; }
.lx-filtre-personne label { margin: 0; }
.lx-panneau .cadre-table .lx-qui { font-weight: 400; }
.lx-panneau .lx-filtre-personne { flex-direction: row; align-items: center; }
.lx-filtre-personne .lx-choix-bouton { font-weight: 600; }
.lx-tete-rub .lx-etat-gris { font-size: 12px; }
.lx-panneau .lx-cadre-tete h2 { line-height: 20px; }
.lx-panneau .cadre-table th { height: 34px; padding: 0 14px; font-weight: 600; }
.lx-panneau .cadre-table td { font-size: 13px; }
.lx-panneau .lx-cadre-corps, .lx-panneau .cadre-table, .lx-panneau .cadre-table table { border: 0; margin: 0; }
/* `refonte.css` habille les tableaux des écrans (`:is(main.page:not(.nue)…) .cadre-table th`) : le panneau passe devant */
main.page:not(.nue) .lx-reglages .lx-panneau .cadre-table th { height: 34px; padding: 0 14px; border: 0; border-bottom: .5px solid var(--apm-sep); background: none; font-size: 12px; font-weight: 600; color: var(--apm-label3); }
main.page:not(.nue) .lx-reglages .lx-panneau .cadre-table td { padding: 9px 14px; font-size: 13px; background: none; }
/* « Déclarer une absence » (`.feuille.milieu` de la maquette) : la phrase sous le titre, les cases dans un groupe blanc,
   les choix en pastille grise (le choisi en vert clair), les deux dates courtes, Annuler en gris */
.lx-feuille-absence > .chapeau .lx-sous { margin: -4px 4px 10px; font-size: 12.5px; color: var(--apm-label2); }
.lx-feuille-absence form > .lx-groupe-forme { display: grid; gap: 12px; padding: 16px; border-radius: 18px; background: rgba(255, 255, 255, .8); box-shadow: var(--apm-ombre-carte); }
.lx-feuille-absence .lx-groupe-forme p { margin: 0; }
.lx-feuille-absence .lx-groupe-forme label { display: grid; gap: 6px; font-size: 13px; font-weight: 500; color: var(--apm-label); }
.lx-feuille-absence .lx-groupe-forme small { display: block; margin: -6px 0 0; font-size: 12px; font-weight: 400; line-height: 1.4; color: var(--apm-label3); }
.lx-feuille-absence .lx-groupe-forme .deux-champs { display: flex; gap: 12px; }
.lx-feuille-absence .lx-groupe-forme .deux-champs input { width: 130px; height: 38px; padding: 0 12px; border: 0; border-radius: 11px; background: var(--apm-fill2); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08); font: inherit; font-size: 14px; }
.lx-feuille-absence .lx-groupe-forme .deux-champs input:focus { outline: none; background: #fff; box-shadow: 0 0 0 1px var(--apm-tint), 0 0 0 4px var(--apm-tint-clair); }
.lx-feuille-absence .lx-choix-bouton { display: flex; align-items: center; justify-content: space-between; width: 100%; height: 38px; min-height: 0; padding: 0 10px 0 12px; border: 0; border-radius: 9px;
  background: var(--apm-tint-clair); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08); font-size: 13px; font-weight: 500; color: var(--apm-tint); }
.lx-feuille-absence .lx-choix-bouton.lx-choix-vide { background: var(--apm-fill2); font-weight: 400; color: var(--apm-label3); }
.lx-feuille-absence .lx-boutons-pied { display: flex; justify-content: flex-end; gap: 8px; margin: 16px -18px 0; padding: 12px 18px 0; border-top: .5px solid var(--apm-sep); }
.lx-feuille-absence .lx-boutons-pied .btn.btn { height: 32px !important; min-height: 0 !important; padding: 0 15px !important; border: 0; border-radius: 999px !important; font-size: 13.5px !important; font-weight: 500; text-decoration: none; }
.lx-feuille-absence .lx-boutons-pied .btn.btn-nu { color: var(--apm-label); background: var(--apm-fill); }
.lx-feuille-absence .lx-boutons-pied .btn.btn-plein { color: #fff; background: linear-gradient(180deg, #1aa688, var(--apm-tint) 60%, #0b6654);
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .15), inset 0 1px 0 rgba(255, 255, 255, .4), inset 0 -1px 1px rgba(0, 0, 0, .12), 0 4px 14px -4px rgba(15, 123, 101, .55); }
.lx-feuille-absence > .lx-avis { margin: 0 0 12px; }
.tiroir-fenetre .lx-feuille-absence .lx-groupe-forme p.deux-champs { display: flex; gap: 12px; }
.tiroir-fenetre .lx-feuille-absence .lx-groupe-forme p.deux-champs label input[name] { width: 130px; max-width: none; }
.lx-feuille-absence .lx-groupe-forme p.deux-champs label { flex: none; }
.lx-feuille-absence > .chapeau { margin: 0; padding: 0; border: 0; }
.tiroir-fenetre .lx-feuille-absence .lx-groupe-forme p.deux-champs { flex-wrap: nowrap; }
.tiroir-fenetre .lx-feuille-absence .lx-groupe-forme p.deux-champs label { width: auto; min-width: 0; }
/* en pleine page, le pied de la feuille reste dans sa colonne ; dans la fenêtre, il touche ses bords */
.lx-feuille-absence .lx-boutons-pied { margin: 16px 0 0; padding: 12px 0 0; }
.tiroir-fenetre .lx-feuille-absence .lx-boutons-pied { margin: 16px -18px 0; padding: 12px 18px 0; }

/* ---------------------------------------------------------------------------
   Lot AP10 · l'administration de la maquette Apple (`lots/maquettes/apple/administration.html`,
   `lots/LOT-AP10-administration.md`) : rangée comme les Réglages du Mac, la liste des rubriques à gauche en trois
   groupes, la rubrique à droite ; ses cartes et ses listes groupées, communes à toutes les pages de l'administration.
   --------------------------------------------------------------------------- */
main.page.admin-v2.lx-maquette:has(> .admin-tete) { grid-template-columns: 256px minmax(0, 1fr); column-gap: 24px; row-gap: 0; font-size: 14px; line-height: 1.45; letter-spacing: -.006em; }
main.page.admin-v2.lx-maquette > .admin-tete .lx-tete { padding-top: 0; margin-bottom: 20px; }
main.page.admin-v2.lx-maquette > .admin-tete .lx-titre { font-size: 34px; line-height: 1.05; font-weight: 700; letter-spacing: -.028em; }
main.page.admin-v2.lx-maquette > .admin-tete .lx-rubriques { grid-column: 1; grid-row: 2 / span 40; align-self: start; }
/* la liste des rubriques : la pièce commune `.lx-rubrique` (plus haut, avec Mon compte) */

/* la rubrique : son titre en 20, son compte, son geste à droite ; ses cartes blanches en listes groupées */
main.page.admin-v2.lx-maquette .corps-admin { display: flex; flex-direction: column; gap: 0; min-width: 0; padding: 0; animation: ap-monte 500ms var(--lx-ressort) both; }
main.page.admin-v2.lx-maquette .carte-admin { margin: 0 0 22px; padding: 0 !important; border: 0; border-radius: 0 !important; background: none; box-shadow: none; }
main.page.admin-v2.lx-maquette .tete-carte-admin { display: flex; align-items: flex-end; gap: 12px; margin: 0 0 14px; padding: 0 4px; border: 0; background: none; }
main.page.admin-v2.lx-maquette .tete-carte-admin > .titre, main.page.admin-v2.lx-maquette .carte-admin > h2 { margin: 0; font-size: 20px; line-height: 1.2; font-weight: 700; letter-spacing: -.02em; color: var(--ap-label); }
main.page.admin-v2.lx-maquette .tete-carte-admin .compte-carte { margin-left: -6px; font-family: inherit; font-size: 13px; font-weight: 400; color: var(--ap-label3); }
main.page.admin-v2.lx-maquette .tete-carte-admin > .btn, main.page.admin-v2.lx-maquette .tete-carte-admin > form { margin-left: auto; }
main.page.admin-v2.lx-maquette .tete-carte-admin .btn { height: 32px; padding: 0 15px; border-radius: 999px; font-size: 13.5px; font-weight: 500; }
main.page.admin-v2.lx-maquette :is(.cadre-table, .lx-cadre) { overflow: hidden; border: 0; border-radius: 20px; background: #fff; box-shadow: var(--ap-ombre-groupe); }
/* les collaborateurs, et tout tableau de l'administration : une liste groupée */
main.page.admin-v2.lx-maquette .table-admin { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 14px; }
main.page.admin-v2.lx-maquette .table-admin th { height: 36px; padding: 0 14px; border-bottom: .5px solid var(--ap-trait); background: none; font-size: 12px; font-weight: 600; color: var(--ap-label3); text-align: left; vertical-align: middle; text-transform: none; letter-spacing: 0; }
main.page.admin-v2.lx-maquette .table-admin th:first-child, main.page.admin-v2.lx-maquette .table-admin td:first-child { padding-left: 16px; }
main.page.admin-v2.lx-maquette .table-admin td { height: 60px; padding: 10px 14px; border: 0; vertical-align: middle; background: none; transition: background-color .15s; }
main.page.admin-v2.lx-maquette .table-admin tbody tr + tr td { box-shadow: inset 0 .5px 0 var(--ap-trait); }
main.page.admin-v2.lx-maquette .table-admin tbody tr + tr td:first-child { box-shadow: none; background: linear-gradient(var(--ap-trait), var(--ap-trait)) no-repeat 46px 0 / calc(100% - 46px) .5px; }
main.page.admin-v2.lx-maquette .table-admin tbody tr:hover td { background-color: rgba(0, 0, 0, .022); }
main.page.admin-v2.lx-maquette .table-admin .lx-qui { display: flex; align-items: center; gap: 12px; }
main.page.admin-v2.lx-maquette .table-admin .lx-avatar { width: 34px; height: 34px; font-size: 12px; font-weight: 600; background: var(--lx-initiales); color: #fff; }
main.page.admin-v2.lx-maquette .table-admin a.nom { font-weight: 600; color: var(--ap-label); text-decoration: none; }
main.page.admin-v2.lx-maquette .table-admin a.nom:hover { color: var(--ap-tint); }
main.page.admin-v2.lx-maquette .table-admin td.chiffre { font-size: 12.5px; color: var(--ap-label3); font-family: inherit; }
main.page.admin-v2.lx-maquette .table-admin td.droits { line-height: 1.9; }
main.page.admin-v2.lx-maquette .table-admin .droit { display: inline-flex; align-items: center; height: 22px; margin: 2px 4px 2px 0; padding: 0 8px; border-radius: 999px; background: var(--ap-fill2); font-size: 11.5px; color: var(--ap-label2); line-height: 22px; }
main.page.admin-v2.lx-maquette .table-admin .droit.vide { padding: 0; background: none; color: var(--ap-label3); }
main.page.admin-v2.lx-maquette .table-admin tr.eteinte td > * { opacity: .45; }
main.page.admin-v2.lx-maquette .table-admin td.etats form { display: inline; }
main.page.admin-v2.lx-maquette .table-admin td.etats .btn { height: 26px; padding: 0 10px; border-radius: 999px; font-size: 12px; }
main.page.admin-v2.lx-maquette :is(.note-admin, .carte-admin > .lx-note, .carte-admin > p.note) { margin: 0; padding: 7px 16px 0; font-size: 12.5px; color: var(--ap-label3); max-width: 90ch; }
main.page.admin-v2.lx-maquette:not(.nue):not(.tenue):not(.etroite) { padding: 28px 28px 120px 24px; }
main.page.admin-v2.lx-maquette:not(.nue):not(.tenue):not(.etroite) > .admin-tete:first-child { padding-top: 0; animation: none; }
main.page.admin-v2.lx-maquette > .admin-tete .lx-sous { margin: 4px 0 0; font-size: 13px; color: var(--ap-label2); }
main.page.admin-v2.lx-maquette .corps-admin { padding: 0; margin: 0; }
main.page.admin-v2.lx-maquette .corps-admin > :first-child { margin-top: 0; }
/* un collaborateur : ses initiales, son nom et son courriel dessous ; toute la ligne ouvre sa fiche, le chevron le dit */
main.page.admin-v2.lx-maquette .table-admin .lx-qui-nom { display: flex; flex-direction: column; min-width: 0; }
main.page.admin-v2.lx-maquette .table-admin .lx-qui-nom small { font-size: 12.5px; color: var(--ap-label3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
main.page.admin-v2.lx-maquette .table-admin tbody tr { position: relative; cursor: pointer; }
main.page.admin-v2.lx-maquette .table-admin a.nom::after { content: ""; position: absolute; inset: 0; }
main.page.admin-v2.lx-maquette .table-admin td.etats :is(form, .btn, a) { position: relative; z-index: 1; }
main.page.admin-v2.lx-maquette .table-admin tbody td:last-child { position: relative; padding-right: 40px; }
main.page.admin-v2.lx-maquette .table-admin tbody td:last-child::after { content: ""; position: absolute; right: 16px; top: 50%; width: 14px; height: 14px; margin-top: -7px; background: #c4c4c7;
  -webkit-mask: var(--ap-chevron) center / contain no-repeat; mask: var(--ap-chevron) center / contain no-repeat; pointer-events: none; }
/* une ligne qui s'ouvre sur place dans un formulaire : le libellé, la valeur, le chevron ; ouverte, la case, « Annuler »,
   « Enregistrer » ; elle s'ouvre en hauteur, en ressort */
.lx-form-groupe { margin: 0; padding: 0; }
.lx-ligne-ouvrable { position: relative; }
.lx-ligne-ouvrable + .lx-ligne-ouvrable::before, .lx-ligne-ouvrable + .lx-a-ajouter::before { content: ""; position: absolute; left: 16px; right: 0; top: 0; border-top: .5px solid var(--ap-trait); }
.lx-form-groupe > .lx-a-ajouter { position: relative; border-top: 0; }
.lx-ligne-tete { display: flex; align-items: center; gap: 14px; width: 100%; min-height: 46px; padding: 11px 38px 11px 16px; border: 0; background: none; font: inherit; color: var(--ap-label); text-align: left; cursor: pointer; transition: background-color .15s; }
.lx-ligne-tete:hover { background: rgba(0, 0, 0, .022); }
.lx-ligne-tete:active { background: rgba(0, 0, 0, .045); }
.lx-ligne-tete::after { content: ""; position: absolute; right: 16px; top: 23px; width: 14px; height: 14px; margin-top: -7px; background: #c4c4c7;
  -webkit-mask: var(--ap-chevron) center / contain no-repeat; mask: var(--ap-chevron) center / contain no-repeat; transition: transform 450ms var(--lx-ressort); }
.lx-ligne-ouvrable.lx-ouverte .lx-ligne-tete::after { transform: rotate(90deg); }
.lx-ligne-tete .lx-rangee-val { margin-left: auto; color: var(--ap-label2); text-align: right; }
.lx-ligne-edition { display: grid; grid-template-rows: 0fr; padding: 0 16px; opacity: 0; transition: grid-template-rows 450ms var(--lx-glisse), opacity .25s, padding .3s; }
.lx-ligne-edition > * { min-height: 0; }
.lx-ligne-ouvrable .lx-ligne-edition { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; max-height: 0; overflow: hidden; transition: max-height 450ms var(--lx-glisse), opacity .25s, padding .3s; }
.lx-ligne-ouvrable.lx-ouverte .lx-ligne-edition { max-height: 80px; padding: 0 16px 14px; opacity: 1; }
.lx-ligne-edition .lx-case { flex: 1 1 260px; height: 38px; padding: 0 12px; border: 0; border-radius: 11px; background: var(--ap-fill2); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08); outline: none; font-size: 14px; }
.lx-ligne-edition .lx-case:focus { background: #fff; box-shadow: 0 0 0 1px var(--ap-tint), 0 0 0 4px var(--ap-tint-clair); }
.lx-ligne-edition .btn { height: 32px; padding: 0 15px; border-radius: 999px; font-size: 13.5px; font-weight: 500; }
.lx-ligne-edition .btn:not(.btn-plein):not(.btn-nu):not(.btn-doux):not(.btn-danger) { background: var(--ap-fill); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.lx-ligne-ouvrable.lx-nee { animation: ap-nait 550ms var(--lx-ressort) both; }
@keyframes ap-nait { from { opacity: 0; transform: translateY(-8px); } }
.lx-ajout-pastille.lx-part { opacity: 0; transform: scale(.6); }
button.lx-ajout-pastille { border: 0; font: inherit; font-size: 12.5px; cursor: pointer; }
button.lx-ajout-pastille:hover { background: var(--ap-tint-clair); }
main.page.admin-v2.lx-maquette .tete-carte-admin { flex-wrap: wrap; row-gap: 0; }
main.page.admin-v2.lx-maquette .tete-carte-admin .lx-tete-rub-texte, main.page.admin-v2.lx-maquette .tete-carte-admin > p.sous { flex: 0 0 100%; margin: 4px 0 0; max-width: none;
  padding-right: max(0px, calc(100% - 70ch)); font-size: 13px; color: var(--ap-label2); }
main.page.admin-v2.lx-maquette .message-carte { margin: 0 0 14px; padding: 12px 14px 12px 16px; border-radius: 18px; background: var(--ap-tint-clair); color: var(--ap-tint); font-size: 13.5px; }
main.page.admin-v2.lx-maquette .carte-admin > .titre-3 { margin: 22px 16px 6px; font-size: 12px; font-weight: 600; color: var(--ap-label3); }
main.page.admin-v2.lx-maquette .deux-cases { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
main.page.admin-v2.lx-maquette .case-grise { padding: 14px 16px; border: 0; border-radius: 18px; background: #fff; box-shadow: var(--ap-ombre-groupe); }
main.page.admin-v2.lx-maquette .case-grise .l { display: block; margin-bottom: 6px; font-size: 12px; font-weight: 600; color: var(--ap-label3); }
main.page.admin-v2.lx-maquette :is(.note-carte, .note-admin) { margin: 0; padding: 7px 16px 0; border: 0; font-size: 12.5px; color: var(--ap-label3); max-width: 90ch; }
main.page.admin-v2.lx-maquette .lx-form-groupe { display: block; gap: 0; }
/* un écran étroit : les rubriques passent au-dessus, en une rangée qui revient à la ligne ; la rubrique prend la largeur */
@media (max-width: 1000px) {
  main.page.admin-v2.lx-maquette:has(> .admin-tete) { grid-template-columns: minmax(0, 1fr); }
  main.page.admin-v2.lx-maquette > .admin-tete .lx-rubriques { position: static; grid-column: 1; grid-row: auto; flex-direction: row; flex-wrap: wrap; margin-bottom: 18px; }
  main.page.admin-v2.lx-maquette > .admin-tete .lx-rubriques h6 { display: none; }
  main.page.admin-v2.lx-maquette:has(> .admin-tete) > * { grid-column: 1; }
  main.page.admin-v2.lx-maquette .table-admin td.chiffre { display: none; }
}

/* Lot AP10 · la fiche d'un collaborateur et « Inviter » : la feuille de droite de la maquette, la carte du compte, les
   droits en bascules, le pied qui paraît au changement, les avis (refus rouge qui secoue, attente orange, neutre gris) */
.tiroir-refonte:not(.tiroir-fenetre):has([data-lx-feuille="cote"]) { top: 12px; right: 12px; bottom: 12px; width: min(480px, calc(100vw - 24px)); border: 0; border-radius: 28px;
  background: rgba(255, 255, 255, .82); backdrop-filter: var(--ap-verre-flou); -webkit-backdrop-filter: var(--ap-verre-flou); box-shadow: var(--ap-verre-bord), 0 0 0 .5px rgba(0, 0, 0, .08), 0 30px 80px -24px rgba(0, 0, 0, .35); overflow: hidden; }
.tiroir-refonte:has([data-lx-feuille="cote"]) > header { position: absolute; top: 18px; right: 18px; z-index: 2; padding: 0; border: 0; background: none; }
.tiroir-refonte:has([data-lx-feuille="cote"]) > header > div, .tiroir-refonte:has([data-lx-feuille="cote"]) > header [data-pleine-page] { display: none; }
.tiroir-refonte:has([data-lx-feuille="cote"]) > header .fermer { width: 32px; height: 32px; border: 0; border-radius: 50%; background: none; box-shadow: none; color: transparent; }
.tiroir-refonte:has([data-lx-feuille="cote"]) > header .fermer::before { content: ""; display: block; width: 17px; height: 17px; margin: auto; background: var(--ap-label);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M7 7l10 10M17 7 7 17'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M7 7l10 10M17 7 7 17'/%3E%3C/svg%3E") center / contain no-repeat; }
.tiroir-refonte:has([data-lx-feuille="cote"]) > header .fermer:hover { background: rgba(0, 0, 0, .06); }
.tiroir-refonte:has([data-lx-feuille="cote"]) > .corps { display: flex; flex-direction: column; padding: 0; background: none; overflow: hidden; }
.tiroir-refonte [data-lx-feuille] > .lx-tete { display: none; }
.lx-fiche-compte { display: block; padding: 18px 18px 22px; font-size: 14px; line-height: 1.45; }
.lx-fiche-compte > * { animation: ap-monte 550ms var(--lx-ressort) both; }
.lx-carte-compte { display: none; align-items: center; gap: 14px; }
/* dans la feuille, la tête reste et le reste défile sous elle, comme la maquette */
.tiroir-refonte .lx-fiche-compte { display: flex; flex-direction: column; flex: 1; min-height: 0; padding: 0; }
.tiroir-refonte .lx-carte-compte { display: flex; flex: none; padding: 18px 58px 12px 22px; }
.tiroir-refonte .lx-fiche-defile { flex: 1; min-height: 0; overflow: auto; padding: 0 18px; }
.tiroir-refonte .lx-fiche-defile:not(:has(> .lx-pied-feuille:last-child))::after { content: ""; display: block; height: 22px; }
.lx-carte-compte .lx-avatar { flex: none; width: 52px; height: 52px; font-size: 17px; font-weight: 600; background: var(--lx-initiales); color: #fff; }
.lx-carte-compte strong { display: block; font-size: 21px; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; }
.lx-carte-compte small { display: block; margin-top: 2px; font-size: 12.5px; color: var(--ap-label2); }
.lx-fiche-compte .lx-liste-groupee, .lx-feuille-inviter .lx-liste-groupee { background: rgba(255, 255, 255, .78); }
/* la bascule des Réglages */
.lx-bascule-ligne { position: relative; display: flex; align-items: center; gap: 14px; min-height: 46px; padding: 11px 16px; cursor: pointer; transition: background-color .15s; }
.lx-bascule-ligne + .lx-bascule-ligne::before { content: ""; position: absolute; left: 16px; right: 0; top: 0; border-top: .5px solid var(--ap-trait); }
.lx-bascule-ligne:active { background: rgba(0, 0, 0, .045); }
.lx-rangee-lib small { display: block; margin-top: 2px; font-size: 12.5px; color: var(--ap-label3); line-height: 1.4; }
input.lx-bascule { appearance: none; -webkit-appearance: none; position: relative; flex: none; width: 46px; height: 28px; margin: 0 0 0 auto; border-radius: 14px; background: rgba(120, 120, 128, .18); cursor: pointer; transition: background-color .3s; }
input.lx-bascule::after { content: ""; position: absolute; top: 2px; left: 2px; width: 24px; height: 24px; border-radius: 12px; background: #fff; box-shadow: 0 2px 6px rgba(0, 0, 0, .18), 0 0 0 .5px rgba(0, 0, 0, .04); transition: transform 450ms var(--ap-ressort-vif), width .2s; }
input.lx-bascule:checked { background: #34c759; }
input.lx-bascule:checked::after { transform: translateX(18px); }
.lx-bascule-ligne:active input.lx-bascule::after { width: 30px; }
.lx-bascule-ligne:active input.lx-bascule:checked::after { transform: translateX(12px); }
input.lx-bascule:focus-visible { outline: 2px solid var(--ap-tint); outline-offset: 2px; }
/* le pied d'une feuille : il paraît au changement, et colle au bas */
.lx-pied-feuille { position: sticky; bottom: 0; z-index: 2; display: flex; align-items: center; gap: 10px; margin: 12px 0 0; padding: 12px 18px 16px; border-top: .5px solid var(--ap-trait);
  background: rgba(250, 250, 252, .85); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.lx-pied-feuille > span:first-child { flex: 1; font-size: 13px; color: var(--ap-label2); }
.lx-pied-feuille .btn { height: 32px; padding: 0 15px; border-radius: 999px; font-size: 13.5px; font-weight: 500; }
.lx-pied-feuille .btn:not(.btn-plein):not(.btn-nu):not(.btn-doux):not(.btn-danger) { background: var(--ap-fill); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.lx-pied-feuille[data-lx-pied]:not(.lx-vu) { display: none; }
.lx-pied-feuille[data-lx-pied].lx-vu { animation: ap-monte 400ms var(--lx-ressort) both; }
/* les avis de la maquette : une ligne, l'icône ; le refus rouge secoue */
.lx-avis-apple { display: flex; align-items: flex-start; gap: 12px; margin: 0 0 10px; padding: 12px 14px 12px 16px; border-radius: 16px; font-size: 13.5px; line-height: 1.45; }
.lx-avis-apple > .lx-ic { flex: none; width: 20px; height: 20px; margin-top: 1px; }
.lx-avis-apple p { flex: 1; max-width: none; margin: 0; }
.lx-avis-refus { background: rgba(229, 55, 44, .1); color: #b3261e; } .lx-avis-refus > .lx-ic { color: var(--ap-rouge); }
.lx-avis-attente { background: var(--ap-orange-clair); color: #7a4300; } .lx-avis-attente > .lx-ic { color: var(--ap-orange); }
.lx-avis-neutre { background: var(--ap-fill2); color: var(--ap-label2); }
.lx-avis-fait { background: var(--ap-tint-clair); color: var(--ap-tint); }
.lx-secoue { animation: ap-secoue 500ms cubic-bezier(.36, .07, .19, .97) both; }
@keyframes ap-secoue { 10%, 90% { transform: translateX(-1px); } 20%, 80% { transform: translateX(3px); } 30%, 50%, 70% { transform: translateX(-6px); } 40%, 60% { transform: translateX(6px); } }
.lx-pastilles-noms { display: flex; flex-wrap: wrap; gap: 6px; padding: 12px 16px; }
.lx-pastilles-noms span { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 999px; background: var(--ap-fill2); font-size: 12.5px; }
.lx-tenue { color: var(--ap-label2); }
.lx-geste-sous-avis { margin: 0 0 4px; }
.lx-geste-sous-avis .btn, .lx-btn-danger-pale { height: 32px; padding: 0 15px; gap: 7px; border-radius: 999px; font-size: 13.5px; font-weight: 500; }
.btn.lx-btn-danger-pale { margin-left: auto; border: 0; background: rgba(229, 55, 44, .1); box-shadow: none; color: var(--ap-rouge); }
/* « Inviter quelqu'un » : un groupe de cases, le libellé au-dessus, le métier en segment */
.lx-feuille-inviter { display: block; padding: 0 18px 0; font-size: 14px; line-height: 1.45; }
.lx-feuille-inviter form { display: block; }
.tiroir-refonte.tiroir-fenetre:has(.lx-feuille-inviter) { top: 9vh; }
.tiroir-refonte.tiroir-fenetre:has(.lx-feuille-inviter) > header { padding-bottom: 12px; }
.lx-forme-l { display: grid; gap: 12px; padding: 16px; }
.lx-forme-l > label, .lx-forme-l-ligne { display: grid; gap: 6px; font-size: 13px; font-weight: 500; color: var(--ap-label); }
.lx-forme-l small { margin: 0; font-size: 12px; font-weight: 400; color: var(--ap-label3); }
.lx-forme-l .lx-case { height: 38px; padding: 0 12px; border: 0; border-radius: 11px; background: var(--ap-fill2); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08); outline: none; font-size: 14px; font-weight: 400; }
.lx-forme-l .lx-case:focus { background: #fff; box-shadow: 0 0 0 1px var(--ap-tint), 0 0 0 4px var(--ap-tint-clair); }
.lx-forme-l .lx-segments { justify-self: start; display: inline-flex; height: 36px; box-sizing: border-box; gap: 2px; padding: 3px; border-radius: 999px; background: var(--ap-fill); font-weight: 500; }
.lx-forme-l .lx-segments label { position: relative; cursor: pointer; }
.lx-forme-l .lx-segments input { position: absolute; opacity: 0; pointer-events: none; }
.lx-forme-l .lx-segments span { display: inline-flex; align-items: center; height: 30px; padding: 0 14px; border-radius: 999px; font-size: 13px; color: var(--ap-label2); transition: color .2s; }
.lx-forme-l .lx-segments input:checked + span { color: var(--ap-label); background: #fff; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .04), 0 1px 2px rgba(0, 0, 0, .06), 0 3px 8px rgba(0, 0, 0, .1); }
.lx-feuille-inviter .lx-pied-feuille { position: static; margin-top: 22px; }
/* dans la feuille, le pied va d'un bord à l'autre */
.tiroir-refonte .lx-pied-feuille { margin-left: -18px; margin-right: -18px; }
.lx-feuille-inviter .lx-note-groupe { margin-top: 0; padding: 7px 6px 0; }
.lx-bascule-ligne, .lx-bascule-ligne .lx-rangee-lib { font-weight: 400; font-size: 14px; color: var(--ap-label); }
.lx-form-bascules { display: block; width: 100%; margin: 0; }
.lx-titre-groupe-feuille details.bulle { display: inline-flex; margin-left: 4px; vertical-align: -3px; }
.lx-titre-groupe-feuille details.bulle > summary { display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: var(--ap-fill); color: var(--ap-label2); font-size: 11px; font-weight: 600; }
/* Lot AP10 · la feuille glisse vers le métier ou le départ : le lien de retour, le titre, la reprise en tableau groupé,
   le choix en pastille (« choisissez » gris, la personne choisie en vert), le geste rouge du pied */
.lx-vue-glisse { animation: ap-glisse 450ms var(--lx-ressort) both; }
@keyframes ap-glisse { from { opacity: 0; transform: translateX(24px); } }
.lx-lien-retour { display: inline-flex; align-items: center; gap: 4px; margin: 2px 0 10px; padding: 0 4px; font-size: 13.5px; color: var(--ap-tint); text-decoration: none; }
.lx-lien-retour .lx-ic { width: 15px; height: 15px; }
.lx-titre-vue { margin: 0 0 6px; font-size: 17px; font-weight: 700; letter-spacing: -.01em; color: var(--ap-label); }
.lx-note-vue { margin: 0 0 10px; font-size: 12.5px; line-height: 1.45; color: var(--ap-label3); }
.lx-rangee-val { margin-left: auto; color: var(--ap-label2); }
.lx-table-groupee { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.lx-table-groupee th { height: 36px; padding: 0 16px; text-align: left; font-size: 12px; font-weight: 600; color: var(--ap-label3); border-bottom: .5px solid var(--ap-trait); }
.lx-table-groupee td { padding: 11px 16px; vertical-align: middle; border-top: .5px solid var(--ap-trait); }
.lx-table-groupee tr:first-child td { border-top: 0; }
.lx-table-groupee td:nth-child(2) { color: var(--ap-label2); }
.lx-table-groupee tbody tr { animation: ap-monte 500ms var(--lx-ressort) both; }
/* le choix commun (`composants.js`) en pastille de la maquette : « choisissez » en gris, la personne choisie en vert */
:is(.lx-fiche-compte, .lx-table-groupee) .lx-choix { min-width: 0 !important; }
.lx-fiche-compte .lx-rangee .lx-choix { margin-left: auto; }
:is(.lx-fiche-compte, .lx-table-groupee) .lx-choix-bouton { width: auto; height: 30px; gap: 6px; padding: 0 10px 0 12px; border: 0; border-radius: 9px; background: var(--ap-fill2); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .08);
  font-size: 13px; color: var(--ap-tint); font-weight: 500; transition: background-color .15s, transform .4s var(--lx-ressort); }
:is(.lx-fiche-compte, .lx-table-groupee) .lx-choix-bouton:not(.lx-choix-vide) { background: var(--ap-tint-clair); }
:is(.lx-fiche-compte, .lx-table-groupee) .lx-choix-bouton.lx-choix-vide { color: var(--ap-label3); font-weight: 400; }
:is(.lx-fiche-compte, .lx-table-groupee) .lx-choix-bouton:hover { border: 0; background: rgba(120, 120, 128, .14); color: inherit; }
:is(.lx-fiche-compte, .lx-table-groupee) .lx-choix-bouton svg { width: 13px; height: 13px; color: currentColor; opacity: .8; }
.lx-pied-feuille > span:first-child { font-size: 12.5px; }
.lx-pied-feuille .btn.btn-danger { border: 0; color: #fff; background: linear-gradient(180deg, #f0574d, var(--ap-rouge) 60%, #c42a20);
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .15), inset 0 1px 0 rgba(255, 255, 255, .35), 0 4px 14px -4px rgba(229, 55, 44, .5); }
.lx-pied-feuille .btn.btn-danger:hover { filter: brightness(1.06); }
.lx-pied-feuille .btn:disabled { opacity: .45; cursor: default; filter: none; }
/* le geste du départ porte le nom entier : le compte des choix passe au-dessus des boutons, sans se couper */
.lx-pied-feuille:has(.btn-danger) { flex-wrap: wrap; row-gap: 8px; }
.lx-pied-feuille:has(.btn-danger) .btn-danger { margin-left: auto; }
/* Lot AP10 · les rubriques en groupes : le titre d'un groupe, la note sous lui ; les seuils en pas à pas « − / + », la
   frise de l'échéance qui suit les deux seuils, la barre « Des réglages ont changé » en verre en bas de l'écran */
main.page.admin-v2.lx-maquette .lx-form-seuils > p.lx-titre-groupe-feuille:first-of-type { margin-top: 8px; }
main.page.admin-v2.lx-maquette .corps-admin > .tete-carte-admin { margin-bottom: 14px; }
main.page.admin-v2.lx-maquette .lx-titre-groupe-feuille { max-width: none; margin: 22px 16px 6px; }
main.page.admin-v2.lx-maquette form > .lx-titre-groupe-feuille:first-child,
main.page.admin-v2.lx-maquette .lx-avis-apple + .lx-titre-groupe-feuille { margin-top: 0; }
main.page.admin-v2.lx-maquette .lx-note-groupe { max-width: 90ch; padding: 7px 16px 0; }
main.page.admin-v2.lx-maquette .lx-liste-groupee + .lx-note-groupe { margin-top: 0; }
main.page.admin-v2.lx-maquette .lx-note-avant { padding: 0 16px 8px; }
.lx-a-relancer { font-weight: 600; color: #a35c00; }
.lx-form-seuils { display: block; }
.lx-ligne-pas { position: relative; display: flex; align-items: center; gap: 14px; min-height: 46px; padding: 11px 16px; }
.lx-ligne-pas + .lx-ligne-pas::before { content: ""; position: absolute; left: 16px; right: 0; top: 0; border-top: .5px solid var(--ap-trait); }
.lx-ligne-pas .lx-rangee-lib { flex: 0 1 auto; font-size: 14px; color: var(--ap-label); }
.lx-ligne-pas .lx-rangee-lib small { max-width: none; }
/* le compteur « − / + » d'un seuil (son nom à lui : `.lx-pas` sont les étapes de « Nouvelle opération ») */
.lx-compteur { display: inline-flex; flex: none; gap: 0; align-items: center; height: 32px; margin-left: auto; padding: 2px; border-radius: 999px; background: var(--ap-fill2); box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .06);
  transition: background-color .2s; }
.lx-compteur button { display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 50%; background: none; color: var(--ap-label2); cursor: pointer;
  transition: background-color .15s, transform .4s var(--lx-ressort); }
.lx-compteur button:hover { background: rgba(0, 0, 0, .06); color: var(--ap-label); }
.lx-compteur button:active { transform: scale(.85); }
.lx-compteur .lx-ic { width: 14px; height: 14px; stroke-width: 2.2; }
.lx-compteur input { width: 52px; min-width: 0 !important; max-width: none; height: 28px; padding: 0; border: 0; border-radius: 8px; background: transparent; box-shadow: none; text-align: center; font: inherit; font-weight: 600;
  font-variant-numeric: tabular-nums; color: var(--ap-label); outline: none; }
.lx-compteur input:focus { background: #fff; box-shadow: 0 0 0 1px var(--ap-tint), 0 0 0 4px var(--ap-tint-clair); }
.lx-compteur small { padding-right: 10px; font-size: 12px; color: var(--ap-label3); }
.lx-ligne-pas.lx-change .lx-compteur { background: var(--ap-orange-clair); }
.lx-ligne-pas.lx-change .lx-compteur input { color: #a35c00; }
.lx-frise-seuils { position: relative; padding: 16px 16px 14px; }
.lx-frise-seuils::before { content: ""; position: absolute; left: 16px; right: 0; top: 0; border-top: .5px solid var(--ap-trait); }
.lx-frise-barre { display: flex; height: 10px; border-radius: 5px; overflow: hidden; background: var(--ap-fill); }
.lx-frise-barre i { display: block; flex-grow: 1; height: 100%; transition: flex-grow .6s var(--lx-ressort); }
.lx-frise-barre .lx-g { background: #d6d6db; } .lx-frise-barre .lx-o { background: var(--ap-orange); } .lx-frise-barre .lx-r { background: var(--ap-rouge); }
.lx-frise-reperes { position: relative; height: 18px; margin-top: 6px; font-size: 12px; color: var(--ap-label3); font-variant-numeric: tabular-nums; }
.lx-frise-reperes span { position: absolute; top: 0; transform: translateX(-50%); white-space: nowrap; transition: left .6s var(--lx-ressort); }
.lx-frise-reperes span:last-child { left: 100%; transform: translateX(-100%); color: var(--ap-label); font-weight: 500; }
.lx-form-seuils .lx-enregistrer { position: fixed; z-index: 40; left: calc(50% + 122px); bottom: 24px; display: flex; flex-wrap: nowrap; align-items: center; gap: 10px; height: 52px; margin: 0;
  padding: 0 8px 0 18px; border: 0; border-radius: 999px; background: rgba(255, 255, 255, .72); backdrop-filter: var(--ap-verre-flou); -webkit-backdrop-filter: var(--ap-verre-flou);
  box-shadow: var(--ap-verre-bord), 0 0 0 .5px rgba(0, 0, 0, .1), 0 20px 50px -14px rgba(0, 0, 0, .35); transform: translateX(-50%); white-space: nowrap;
  animation: ap-barre-monte .6s var(--lx-ressort) both; }
.lx-form-seuils .lx-enregistrer[hidden] { display: none; }
.lx-form-seuils .lx-enregistrer-mot { font-size: 13.5px; color: var(--ap-label2); }
.lx-form-seuils .lx-enregistrer .lx-boutons { display: flex; gap: 10px; margin: 0; }
@keyframes ap-barre-monte { from { opacity: 0; transform: translate(-50%, 100px) scale(.9); } }
/* Lot AP10 · À désigner, Analyses, Connaissances : les pièces des listes groupées de la maquette des Réglages */
main.page.admin-v2.lx-maquette .lx-liste-groupee, .lx-fiche-compte .lx-liste-groupee, .lx-feuille-inviter .lx-liste-groupee { border-radius: 18px; }
main.page.admin-v2.lx-maquette .corps-admin > .tete-carte-admin + .lx-titre-groupe-feuille { margin-top: 8px; }
main.page.admin-v2.lx-maquette .corps-admin > .lx-avis-apple + .lx-titre-groupe-feuille { margin-top: 12px; }
main.page.admin-v2.lx-maquette .corps-admin > .lx-avis-apple { margin: 0 0 10px; }
.lx-table-groupee .lx-a-droite, .lx-table-groupee th.lx-a-droite { text-align: right; }
.lx-table-groupee .lx-chiffres { font-variant-numeric: tabular-nums; }
.lx-table-groupee .lx-coupe { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
main.page .lx-table-groupee .btn { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 15px; border: 0; border-radius: 999px; font-size: 13.5px; font-weight: 500; white-space: nowrap; }
main.page .lx-table-groupee .btn .lx-ic { width: 17px; height: 17px; }
.lx-nom-ligne { font-weight: 600; color: var(--ap-label); text-decoration: none; }
.lx-nom-ligne:hover { color: var(--ap-tint); }
.lx-manquant { display: inline-flex; align-items: center; height: 22px; margin: 2px 4px 2px 0; padding: 0 8px; border-radius: 999px; background: var(--ap-orange-clair); color: #a35c00; font-size: 12px; font-weight: 500; }
.lx-lien-avis { color: inherit; font-weight: 600; }
.lx-avis-apple b { font-weight: 600; }
.lx-vide-groupe { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 46px 30px; text-align: center; color: var(--ap-label2); }
.lx-vide-groupe .lx-vide-ic { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 20px; background: var(--ap-fill2); color: var(--ap-label3); }
.lx-vide-groupe .lx-vide-ic .lx-ic { width: 30px; height: 30px; stroke-width: 1.4; }
.lx-vide-groupe strong { font-size: 17px; line-height: normal; font-weight: 600; color: var(--ap-label); }
.lx-vide-groupe p { margin: 0; max-width: 52ch; font-size: 13.5px; }
.lx-form-connaissance { display: block; }
.lx-deux { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 12px; align-items: end; }
.lx-deux > label { display: grid; gap: 6px; min-width: 0; font-size: 13px; font-weight: 500; color: var(--ap-label); }
.lx-forme-l .lx-choix-bouton { justify-content: space-between; height: 38px; border: 0; border-radius: 11px; background: var(--ap-tint-clair); box-shadow: none; color: var(--ap-tint); font-size: 14px; font-weight: 500; }
.lx-forme-l .lx-choix-bouton svg { color: currentColor; }
@media (max-width: 760px) { .lx-deux { grid-template-columns: minmax(0, 1fr); } }
.lx-pied-groupe-droite { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 16px; border-top: .5px solid var(--ap-trait); }
.lx-pied-groupe-droite .btn, .lx-doc-ligne .btn { height: 32px; padding: 0 15px; border-radius: 999px; font-size: 13.5px; font-weight: 500; }
.lx-doc-ligne .btn:not(.btn-plein) { background: var(--ap-fill); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
main.page.admin-v2.lx-maquette .lx-forme-l .depot-zone { gap: 8px; padding: 28px 20px !important; border: 1.5px dashed rgba(60, 60, 67, .22) !important; border-radius: 18px !important; background: rgba(255, 255, 255, .5) !important; }
main.page.admin-v2.lx-maquette .lx-forme-l .depot-zone:is(:hover, .survol) { border-color: var(--ap-tint) !important; background: var(--ap-tint-clair) !important; }
main.page.admin-v2.lx-maquette .lx-forme-l .depot-rond { width: 44px; height: 44px; border-radius: 13px; background: var(--ap-tint-clair); color: var(--ap-tint); }
main.page.admin-v2.lx-maquette .lx-forme-l .depot-invite b { font-size: 14px; font-weight: 600; color: var(--ap-label); }
main.page.admin-v2.lx-maquette .lx-forme-l .depot-zone .consigne { font-size: 12px !important; color: var(--ap-label3); }
.lx-doc-ligne { position: relative; display: flex; align-items: center; gap: 12px; padding: 11px 16px; }
.lx-doc-ligne + .lx-doc-ligne { border-top: .5px solid var(--ap-trait); }
.lx-doc-ligne .lx-rangee-lib { min-width: 0; font-size: 14px; }
.lx-doc-ligne .lx-rangee-lib b { font-weight: 600; }
.lx-doc-ligne form { margin: 0 0 0 auto; }
details.lx-retires summary { display: inline-flex; align-items: center; gap: 6px; margin: 12px 16px 0; list-style: none; cursor: pointer; font-size: 12.5px; color: var(--ap-label2); }
details.lx-retires summary::-webkit-details-marker { display: none; }
details.lx-retires summary .lx-ic { width: 12px; height: 12px; transition: transform .4s var(--lx-ressort); }
details.lx-retires[open] summary .lx-ic { transform: rotate(90deg); }
details.lx-retires .lx-liste-groupee { margin-top: 8px; }
/* les boutons des listes groupées, au pas de la maquette (15 de marge, 7 entre l'icône et le mot), au-dessus de la
   règle commune des boutons d'une page (`composants.css`) */
main.page :is(.lx-table-groupee, .lx-pied-feuille, .lx-pied-groupe-droite, .lx-doc-ligne, .lx-geste-sous-avis) .btn:not(.icone):not(.pilule):not(.mini):not(.petit) { padding: 0 15px; gap: 7px; }
main.page.admin-v2.lx-maquette .lx-forme-l .depot-zone .depot-barre { gap: 0 !important; }
main.page.admin-v2.lx-maquette .lx-forme-l .depot-zone .choisi.plein { margin-bottom: 6px; }
/* Othmane, 2026-10-30 : cliquer la zone de dépôt n'ouvrait pas le choix du fichier. Le champ invisible couvre la zone
   (`refonte.css`), mais le verre des boutons donne au bouton caché qui le porte un flou d'arrière-plan, et un élément
   flouté devient le cadre de ce qu'il contient : le champ se calait sur ce bouton de hauteur nulle. Sans flou, il
   recouvre de nouveau toute la zone. */
.depot-zone.js .choisir { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; filter: none !important; }
main.page.admin-v2.lx-maquette .lx-titre-groupe-feuille details.bulle { vertical-align: 1px; }
/* Lot AP10 · Importer, Copie, Démonstration : la ligne d'état et son carré, la fréquence en segment, les tuiles du
   résultat, le dépôt seul, la ligne de la démonstration qui s'ouvre sur l'avis et le bouton rouge */
.lx-ligne-etat { position: relative; display: flex; align-items: center; gap: 14px; min-height: 46px; margin: 0; padding: 11px 16px; }
.lx-ligne-etat + .lx-ligne-etat::before { content: ""; position: absolute; left: 16px; right: 0; top: 0; border-top: .5px solid var(--ap-trait); }
.lx-ligne-etat .lx-rangee-lib { flex: 1; min-width: 0; font-size: 14px; color: var(--ap-label); }
.lx-ligne-etat .lx-rangee-lib b { font-weight: 600; }
.lx-ligne-etat .lx-rangee-lib small b { font-weight: 600; color: var(--ap-label2); }
.lx-etat-ic { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: 11px; background: var(--ap-fill2); color: var(--ap-label3); }
.lx-relie .lx-etat-ic { background: var(--ap-tint-clair); color: var(--ap-tint); }
.lx-etat-ic .lx-ic { width: 20px; height: 20px; }
.lx-etat-echec { color: #9b1c14 !important; }
.lx-etat-gestes { display: flex; flex: none; gap: 8px; }
.lx-etat-gestes form { margin: 0; }
.lx-etat-gestes .btn, .lx-gestes-bas .btn { height: 32px; padding: 0 15px; border-radius: 999px; font-size: 13.5px; font-weight: 500; }
.lx-ligne-etat details.lx-retires summary { margin: 6px 0 0; }
.lx-fichiers-copies { margin: 6px 0 0; padding-left: 18px; font-size: 12.5px; color: var(--ap-label2); }
.lx-ligne-frequence .lx-rangee-lib { flex: 0 1 auto; }
.lx-ligne-frequence .lx-segments { display: inline-flex; gap: 2px; height: 36px; margin-left: auto; padding: 3px; box-sizing: border-box; border-radius: 999px; background: var(--ap-fill); }
.lx-ligne-frequence .lx-segments label { position: relative; cursor: pointer; }
.lx-ligne-frequence .lx-segments input { position: absolute; opacity: 0; pointer-events: none; }
.lx-ligne-frequence .lx-segments span { display: inline-flex; align-items: center; height: 30px; padding: 0 14px; border-radius: 999px; font-size: 13px; font-weight: 500; color: var(--ap-label2); white-space: nowrap; transition: color .25s; }
.lx-ligne-frequence .lx-segments input:checked + span { color: var(--ap-label); background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .1), 0 3px 8px rgba(0, 0, 0, .08); }
.lx-depot-seul { display: block; margin: 2px 0 0; padding: 0; }
.lx-form-import { display: block; }
.lx-defile-large { overflow-x: auto; }
.lx-tuiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.lx-tuile { padding: 14px 15px; border-radius: 18px; background: #fff; box-shadow: var(--ap-ombre-groupe); }
.lx-tuile strong { display: block; font-size: 26px; line-height: 1.1; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--ap-label); }
.lx-tuile small { font-size: 12.5px; color: var(--ap-label2); }
.lx-tuile-orange strong { color: var(--ap-orange); }
@media (max-width: 760px) { .lx-tuiles { grid-template-columns: repeat(2, 1fr); } }
.lx-gestes-bas { display: flex; gap: 8px; margin-top: 14px; }
.lx-gestes-bas .btn:not(.btn-plein):not(.btn-danger) { background: var(--ap-fill); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.lx-gestes-bas .btn.btn-danger { border: 0; color: #fff; background: linear-gradient(180deg, #f0574d, var(--ap-rouge) 60%, #c42a20);
  box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .15), inset 0 1px 0 rgba(255, 255, 255, .35), 0 4px 14px -4px rgba(229, 55, 44, .5); }
.lx-titre-rubrique { margin: 0 0 14px; padding: 0 4px; }
main.page .lx-titre-rubrique h2 { margin: 0; font-size: 20px; line-height: 1.2; font-weight: 700; letter-spacing: -.02em; color: var(--ap-label); }
.lx-titre-rubrique details.bulle { display: inline-flex; margin-left: 4px; vertical-align: 1px; }
.lx-titre-rubrique details.bulle > summary { display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: var(--ap-fill); color: var(--ap-label2); font-size: 11px; font-weight: 600; }
.lx-ligne-demo-tete { display: flex; align-items: flex-start; gap: 16px; padding: 11px 16px; }
.lx-ligne-demo-tete p { flex: 1; max-width: none; margin: 0; font-size: 14px; line-height: 1.5; color: var(--ap-label); }
.lx-ligne-demo-tete .btn { flex: none; gap: 7px; }
.lx-ligne-demo .lx-ligne-edition { display: block; }
.lx-ligne-demo.lx-ouverte .lx-ligne-edition { max-height: 600px; }
.lx-ligne-demo .lx-gestes-bas { margin-top: 10px; }
main.page.admin-v2.lx-maquette .corps-admin .lx-avis { display: flex; gap: 12px; margin: 0 0 10px; padding: 12px 14px 12px 16px; border: 0; border-radius: 16px; box-shadow: none; font-size: 13.5px; line-height: 1.45; }
main.page.admin-v2.lx-maquette .corps-admin .lx-avis p { margin: 0; }
main.page.admin-v2.lx-maquette .corps-admin .lx-avis-attente { background: var(--ap-orange-clair); color: #7a4300; }
main.page.admin-v2.lx-maquette .corps-admin .lx-avis-succes { background: var(--ap-tint-clair); color: #0b5e4d; }
main.page.admin-v2.lx-maquette .corps-admin .lx-avis-erreur { background: rgba(229, 55, 44, .09); color: #9b1c14; }
main.page.admin-v2.lx-maquette .corps-admin .lx-avis strong { font-weight: 600; }
main.page.admin-v2.lx-maquette form.lx-ligne-etat { flex-direction: row; justify-content: flex-start; }
main.page.admin-v2.lx-maquette :is(.lx-ligne-etat, .lx-doc-ligne, .lx-ligne-pas) .lx-rangee-lib small { max-width: none; }
main.page :is(.lx-gestes-bas, .lx-doc-ligne, .lx-etat-gestes, .lx-pied-groupe-droite) .btn:not(.btn-plein):not(.btn-nu):not(.btn-doux):not(.btn-danger):not(.lx-btn-danger-pale):not(:only-child) { border: 0; background: var(--ap-fill); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
main.page :is(.lx-gestes-bas, .lx-doc-ligne, .lx-etat-gestes, .lx-pied-groupe-droite) .btn:not(.btn-plein):not(.btn-nu):not(.btn-doux):not(.btn-danger):not(.lx-btn-danger-pale):not(:only-child):hover { background: rgba(120, 120, 128, .2); }
main.page.admin-v2.lx-maquette .corps-admin .lx-avis p { flex: 1; max-width: none; }
main.page.admin-v2.lx-maquette .corps-admin .lx-avis :is(strong, span) { color: inherit; }
main.page.admin-v2.lx-maquette .corps-admin .lx-avis::before { content: ""; flex: none; width: 20px; height: 20px; margin-top: 1px; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4 3 19.5h18L12 4z'/%3E%3Cpath d='M12 10v4.5M12 17.2v.1'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4 3 19.5h18L12 4z'/%3E%3Cpath d='M12 10v4.5M12 17.2v.1'/%3E%3C/svg%3E") center / contain no-repeat; }
main.page.admin-v2.lx-maquette .corps-admin .lx-avis-attente::before { background: var(--ap-orange); }
main.page.admin-v2.lx-maquette .corps-admin .lx-avis-erreur::before { background: var(--ap-rouge); }
main.page.admin-v2.lx-maquette .corps-admin .lx-avis-succes::before { background: var(--ap-tint);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E"); }
/* Lot AP10 · « Où l'identité du cabinet apparaît » : deux feuilles de papier ; le pied du document de travail suit la
   saisie de l'identité et s'allume quand il change */
.lx-papiers { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.lx-papier { padding: 14px; border-radius: 18px; background: #fff; box-shadow: var(--ap-ombre-groupe); }
.lx-papier > small { display: block; margin-bottom: 10px; font-size: 12px; font-weight: 600; color: var(--ap-label3); }
.lx-page-a4 { position: relative; height: 170px; padding: 16px 18px; border-radius: 8px; background: linear-gradient(180deg, #fff, #fafafa); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .12), 0 6px 16px -8px rgba(0, 0, 0, .25); overflow: hidden; }
.lx-page-a4 i { display: block; height: 5px; margin-bottom: 7px; border-radius: 3px; background: #ececf0; }
.lx-page-travail i:nth-of-type(1) { width: 60%; } .lx-page-travail i:nth-of-type(3) { width: 85%; } .lx-page-travail i:nth-of-type(5) { width: 70%; }
.lx-page-acte i:nth-of-type(1) { width: 55%; } .lx-page-acte i:nth-of-type(3) { width: 80%; }
.lx-en-tete-acte { margin-bottom: 12px; padding: 6px 8px; border-radius: 6px; background: var(--ap-fill2); font-size: 11.5px; line-height: 1.45; color: var(--ap-label); }
.lx-en-tete-acte b { display: block; font-size: 11px; font-weight: 500; color: var(--ap-rouge); }
.lx-pied-page { position: absolute; left: 18px; right: 18px; bottom: 10px; padding-top: 6px; border-top: .5px solid var(--ap-trait); font-size: 10.5px; line-height: 1.45; color: var(--ap-label2); text-align: center; transition: color .3s; }
.lx-pied-page.lx-flash { animation: ap-flash 1.1s var(--lx-glisse); }
@keyframes ap-flash { 0% { color: var(--ap-tint); transform: scale(1.06); } 100% { color: var(--ap-label2); transform: none; } }
@media (max-width: 760px) { .lx-papiers { grid-template-columns: minmax(0, 1fr); } }
main.page.admin-v2.lx-maquette .carte-admin > .lx-form-groupe { margin: 0; }
main.page.admin-v2.lx-maquette .carte-admin:has(+ .lx-titre-groupe-feuille) { margin-bottom: 0; }
main.page.admin-v2.lx-maquette .tete-carte-admin > .titre { line-height: 1.2; }
main.page.admin-v2.lx-maquette .tete-carte-admin .lx-tete-rub-texte, main.page.admin-v2.lx-maquette .tete-carte-admin > p.sous { line-height: 1.45; }
main.page.admin-v2.lx-maquette .corps-admin > .carte-admin { gap: 0; }
main.page.admin-v2.lx-maquette .corps-admin .carte-admin > .tete-carte-admin > .titre { font-size: 20px !important; letter-spacing: -.02em; }
.lx-papier > small { margin: 0 0 10px; }

/* Othmane, 2026-10-30 · la carte à confirmer en liste (`composants/carte_liste.html`), comme la maquette du fil
   (`.carte`, `.valeurs`) et les Réglages d'Apple : la carte blanche, chaque partie un bloc gris clair arrondi, une
   ligne par information (libellé à gauche, valeur à droite, corrigée sur place, l'ancienne barrée dessous), la page lue
   en pastille, un interrupteur au bout. Éteint, la ligne pâlit et ne s'écrit pas. Le pied, blanc, reste au bas de la
   carte quand elle défile. */
.lx-carte[data-lx-carte]:has(.lx-liste) { gap: 0; padding: 16px 16px 0; border: 0; border-radius: 20px; background: #fff;
  box-shadow: 0 0 0 .5px rgba(0, 0, 0, .06), 0 1px 2px rgba(0, 0, 0, .04), 0 10px 30px -18px rgba(0, 0, 0, .2); }
.lx-carte[data-lx-carte]:has(.lx-liste) > .lx-carte-tete { margin: 0 0 4px; }
.lx-carte[data-lx-carte]:has(.lx-liste) > .lx-carte-tete h3 { font-size: 15px; font-weight: 600; letter-spacing: -.01em; }
.lx-carte[data-lx-carte]:has(.lx-liste) > .lx-carte-tete .lx-note { font-size: 13px; color: var(--apm-label2); }
.lx-carte[data-lx-carte]:has(.lx-liste) > .lx-carte-tete .lx-etiquette { font-size: 11.5px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--apm-label3); }
.lx-carte[data-lx-carte]:has(.lx-liste) > .lx-carte-section { gap: 0; }
.lx-carte[data-lx-carte]:has(.lx-liste) > .lx-carte-section > .lx-etiquette { display: flex; align-items: center; gap: 4px; margin: 12px 2px 6px; font-size: 11.5px; font-weight: 600;
  letter-spacing: 0; text-transform: none; color: var(--apm-label3); }
.lx-liste { border-radius: 14px; background: #f5f5f7; }
.lx-liste-ligne { position: relative; display: grid; grid-template-columns: minmax(0, 36%) minmax(0, 1fr) auto auto; align-items: center; column-gap: 10px;
  min-height: 44px; padding: 6px 10px 6px 12px; font-size: 13.5px; line-height: 1.3; transition: opacity .25s; }
.lx-liste-ligne + .lx-liste-ligne { border-top: .5px solid var(--apm-sep); }
.lx-liste-libelle { min-width: 0; color: var(--apm-label2); overflow-wrap: anywhere; }
.lx-liste-libelle > .lx-sous { display: block; font-size: 11.5px; color: var(--apm-label3); }
.lx-liste-valeur { display: flex; flex-direction: column; align-items: flex-end; min-width: 0; text-align: right; }
.lx-liste-valeur .lx-valeur { font-weight: 500; color: var(--apm-label); overflow-wrap: anywhere; }
.lx-liste-valeur .lx-barree { font-size: 12px; color: var(--apm-label3); }
.lx-liste-valeur > .lx-sous { font-size: 11.5px; color: var(--apm-label3); }
/* la valeur se corrige sur place, sans cadre : au survol un fond, à la saisie le contour vert de la maquette */
.lx-liste .lx-case { box-sizing: border-box; width: 100%; min-width: 0; height: 28px; margin: 0; padding: 0 8px; border: 0; border-radius: 8px; background: transparent;
  box-shadow: none; font: inherit; font-size: 13.5px; font-weight: 500; text-align: right; text-overflow: ellipsis; color: var(--apm-label); outline: none;
  transition: background-color .2s, box-shadow .2s; }
.lx-liste .lx-case:hover { background: rgba(255, 255, 255, .85); }
.lx-liste .lx-case:focus { background: #fff; box-shadow: 0 0 0 1px var(--apm-tint), 0 0 0 3px var(--apm-tint-clair); text-overflow: clip; }
.lx-liste select.lx-case { appearance: none; -webkit-appearance: none; cursor: pointer; text-align-last: right; }
.lx-liste textarea.lx-case { height: auto; min-height: 28px; padding-top: 5px; padding-bottom: 5px; text-align: right; resize: none; field-sizing: content; }
/* un choix (la civilité, la personne de la fiche) : le mot à droite comme les autres valeurs, sa petite flèche grise */
.lx-liste .lx-choix { display: flex; justify-content: flex-end; width: 100%; min-width: 0; }
.lx-liste .lx-choix-bouton { justify-content: flex-end; gap: 4px; width: auto; max-width: 100%; }
.lx-liste .lx-choix-bouton svg { flex: none; width: 13px; height: 13px; color: var(--apm-label3); }
/* la page lue : une pastille blanche, la phrase au survol, la page d'un clic */
.lx-liste-page { display: flex; justify-content: flex-end; min-width: 0; }
.lx-liste-source { position: relative; display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 999px; background: #fff; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .1);
  font-size: 11.5px; font-weight: 400; white-space: nowrap; color: var(--apm-label2); text-decoration: none; cursor: pointer; }
.lx-liste-source .lx-ic { width: 13px; height: 13px; }
.lx-liste-source:hover, .lx-liste-source:focus-visible { color: var(--apm-tint); text-decoration: none; outline: none; }
.lx-liste-source-bulle { position: absolute; z-index: 30; right: -8px; bottom: calc(100% + 8px); width: max-content; max-width: min(320px, 70vw); padding: 9px 11px; border-radius: 12px;
  background: rgba(255, 255, 255, .97); box-shadow: 0 0 0 .5px rgba(0, 0, 0, .08), 0 8px 24px rgba(0, 0, 0, .14); font-size: 12.5px; line-height: 1.4; text-align: left;
  white-space: normal; color: var(--apm-label); opacity: 0; visibility: hidden; transform: translateY(3px); transition: opacity .15s, transform .15s, visibility .15s; pointer-events: none; }
.lx-liste-source:is(:hover, :focus-visible) > .lx-liste-source-bulle { opacity: 1; visibility: visible; transform: none; }
.lx-liste-source-bulle q { quotes: "« " " »"; }
.lx-liste-source-bulle > span, .lx-liste-source-bulle > small { display: block; margin-top: 4px; font-size: 11.5px; color: var(--apm-label3); }
/* l'interrupteur d'Apple, en vert : allumé, la valeur est gardée */
.lx-liste-coche { display: flex; justify-content: flex-end; }
.lx-interrupteur { display: inline-flex; flex: none; cursor: pointer; }
.lx-interrupteur > input { appearance: none; -webkit-appearance: none; position: relative; flex: none; width: 38px; height: 23px; margin: 0; border-radius: 999px;
  background: rgba(120, 120, 128, .2); cursor: pointer; transition: background-color .25s; }
.lx-interrupteur > input::after { content: ""; position: absolute; top: 2px; left: 2px; width: 19px; height: 19px; border-radius: 50%; background: #fff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, .16), 0 0 0 .5px rgba(0, 0, 0, .04); transition: transform .3s var(--ap-ressort-vif); }
.lx-interrupteur > input:checked { background: #34c759; }
.lx-interrupteur > input:checked::after { transform: translateX(15px); }
.lx-interrupteur > input:focus-visible { outline: 2px solid var(--apm-tint); outline-offset: 2px; }
/* seule une ligne qu'on éteint pâlit ; celle qui arrive éteinte (une valeur qui en remplace une autre) reste lisible */
.lx-liste-ligne:has(.lx-liste-coche input[checked]:not(:checked)) > :not(.lx-liste-coche) { opacity: .4; }
/* une personne : son nom et ses rôles sur une ligne, le chevron ; son détail déplié en lignes plus petites */
.lx-liste-personne { grid-template-columns: minmax(0, 1fr) auto auto; align-items: start; }
.lx-liste-personne > .lx-liste-page, .lx-liste-personne > .lx-liste-coche { padding-top: 5px; }
.lx-liste-detail { min-width: 0; }
.lx-liste-detail > summary { display: flex; align-items: center; gap: 8px; min-height: 32px; list-style: none; cursor: pointer; }
.lx-liste-detail > summary::-webkit-details-marker { display: none; }
.lx-liste-detail > summary::before { content: ""; flex: none; width: 6px; height: 6px; margin: 0 4px 0 2px; border: solid var(--apm-label3); border-width: 0 1.6px 1.6px 0;
  transform: rotate(-45deg); transition: transform .25s var(--ap-ressort-vif); }
.lx-liste-detail[open] > summary::before { transform: rotate(45deg); }
.lx-liste-nom { flex: none; font-weight: 600; white-space: nowrap; color: var(--apm-label); }
.lx-liste-sous { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; color: var(--apm-label3); }
.lx-liste-corps { margin: 2px 0 4px 16px; }
.lx-liste-sousligne { display: grid; grid-template-columns: minmax(0, 40%) minmax(0, 1fr); align-items: center; column-gap: 10px; min-height: 34px; border-top: .5px solid var(--apm-sep); font-size: 13px; }
.lx-liste-sousligne .lx-case, .lx-liste-sousligne .lx-valeur { font-size: 13px; }
/* le pied : une bande blanche au bas de la carte, qui reste visible quand la carte défile ; le compte à gauche */
.lx-carte[data-lx-carte]:has(.lx-liste) > .lx-carte-pied { position: sticky; bottom: 0; margin: 12px -16px 0; padding: 12px 16px 14px; border: 0; border-top: .5px solid var(--apm-sep);
  border-radius: 0 0 20px 20px; background: #fff; box-shadow: 0 -12px 24px -18px rgba(0, 0, 0, .22); backdrop-filter: none; -webkit-backdrop-filter: none; }
/* dans le fil, le bas du défilement est réservé à la barre de saisie (150 px) : le pied descend se poser juste au-dessus
   d'elle, sans laisser de lignes passer entre les deux */
.socle-fil [data-defile] .lx-carte[data-lx-carte]:has(.lx-liste) > .lx-carte-pied { bottom: -78px; }
.lx-carte[data-lx-carte]:has(.lx-liste) > .lx-carte-pied > .lx-note { font-size: 12.5px; color: var(--apm-label3); font-variant-numeric: tabular-nums; }
@media (prefers-reduced-motion: reduce) { .lx-interrupteur > input::after, .lx-liste-detail > summary::before { transition: none; } }
@media (max-width: 560px) {
  .lx-liste-ligne:not(.lx-liste-personne) { grid-template-columns: minmax(0, 1fr) auto auto; }
  .lx-liste-ligne:not(.lx-liste-personne) > .lx-liste-valeur { grid-column: 1 / -1; grid-row: 2; align-items: stretch; }
}

/* ---------------------------------------------------------------------------
   Othmane, 2026-11-01 · la loupe (`composants/loupe.html`), le classeur des documents (`ecrans/classeur.py`) et le
   Suivi du fil épuré : la maquette `lots/maquettes/documents/`.
   --------------------------------------------------------------------------- */
:root {
  --ap-trouve: rgba(255, 204, 0, .42);               /* le mot trouvé par la loupe, surligné comme dans les Réglages */
}

/* la loupe : un rond de la barre, qui s'ouvre en pastille de recherche à sa place, de la même hauteur, la même forme */
.lx-loupe { position: relative; display: inline-flex; align-items: center; flex: none; }
.lx-loupe > .lx-loupe-ouvrir { flex: none; }
main.page .lx-loupe input.lx-loupe-champ[type="search"]:not([hidden]), .lx-loupe input.lx-loupe-champ[type="search"] {
  -webkit-appearance: none; appearance: none; box-sizing: border-box; width: 0; min-width: 0; min-height: 0; height: 32px; margin: 0;
  padding: 0; border: 0; border-radius: 999px; background: transparent; box-shadow: none; opacity: 0; color: var(--ap-label);
  font: inherit; font-size: 13.5px; line-height: 32px; pointer-events: none;
  transition: width 320ms var(--lx-glisse), padding 320ms var(--lx-glisse), opacity 160ms, background-color 160ms; }
.lx-loupe input.lx-loupe-champ::-webkit-search-decoration, .lx-loupe input.lx-loupe-champ::-webkit-search-cancel-button { -webkit-appearance: none; display: none; }
.lx-loupe input.lx-loupe-champ::placeholder { color: var(--ap-label3); }
.lx-loupe[data-ouverte] > .lx-loupe-ouvrir { position: absolute; left: 0; top: 0; z-index: 1; background: none; color: var(--ap-label3); pointer-events: none; }
main.page .lx-loupe[data-ouverte] input.lx-loupe-champ[type="search"]:not([hidden]), .lx-loupe[data-ouverte] input.lx-loupe-champ[type="search"] {
  width: 240px; padding: 0 30px 0 32px; opacity: 1; background: var(--ap-fill); pointer-events: auto; }
main.page .lx-loupe input.lx-loupe-champ[type="search"]:focus-visible, .lx-loupe input.lx-loupe-champ:focus { outline: none; box-shadow: var(--lx-anneau); }
.lx-loupe > .lx-loupe-vider { position: absolute; right: 7px; top: 50%; display: grid; place-items: center; width: 18px; height: 18px; margin-top: -9px; padding: 0;
  border: 0; border-radius: 50%; background: var(--ap-label3); color: var(--mz-surface); cursor: pointer; }
.lx-loupe > .lx-loupe-vider .lx-ic { width: 10px; height: 10px; stroke-width: 2.6; }
.lx-loupe > .lx-loupe-vider[hidden] { display: none; }
::highlight(lx-trouve) { background-color: var(--ap-trouve); color: inherit; }
@media (prefers-reduced-motion: reduce) { .lx-loupe input.lx-loupe-champ[type="search"] { transition: none; } }

/* ce que la loupe laisse : les lignes trouvées ; ce qui n'en est pas s'efface le temps de la recherche */
:is(.lx-info, .lx-mandat, .lx-fichier, .lx-operation, .lx-personne, .lx-ligne, .lx-rangee)[data-lx-recherche-cache], .lx-sommaire a[data-lx-recherche-cache],
.lx-section[data-lx-recherche-cache], .lx-classeur-groupe[data-lx-recherche-cache], .lx-suivi-section[data-lx-recherche-cache] { display: none !important; }
[data-lx-recherche-en-cours] :is(.lx-infos > :not([data-lx-ligne]), .lx-liste-groupee > :not([data-lx-ligne]), .lx-a-ajouter,
  .lx-note-groupe, .lx-pied-groupe, .lx-section > header > .btn, .lx-section > header .lx-lien-plus, .conv-reste) { display: none !important; }
.lx-recherche-rien { margin: 0; padding: 40px 16px; text-align: center; font-size: 13.5px; color: var(--ap-label3); }
.lx-recherche-rien[hidden] { display: none; }

/* le classeur : un dossier par section, sa légende au-dessus de chaque liste, comme une section des Réglages */
.lx-dossier > header { align-items: center; }
.lx-dossier > header > .lx-ic { width: 21px; height: 21px; color: var(--ap-label3); stroke-width: 1.6; }
.lx-dossier > header > small { font-size: 12.5px; color: var(--ap-label3); }
.lx-dossier > header > .btn { height: 30px; padding: 0 13px; gap: 6px; font-size: 13px; }
.lx-dossier > header > .btn .lx-ic { width: 15px; height: 15px; }
.lx-classeur-groupe + .lx-classeur-groupe { margin-top: 18px; }
.lx-groupe-legende { display: flex; align-items: baseline; gap: 8px; max-width: none; margin: 0 16px 7px; font-size: 12px; line-height: 16px; color: var(--ap-label3); }
.lx-groupe-legende > .lx-groupe-nom { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; }
.lx-groupe-legende > .lx-groupe-sous { flex: none; white-space: nowrap; }
.lx-groupe-legende > a { flex: none; margin-left: auto; font-weight: 500; color: var(--ap-tint); text-decoration: none; white-space: nowrap; }
.lx-groupe-legende > a:hover { text-decoration: underline; }

/* la ligne d'un fichier (`composants/fichier.html`) : la même dans le classeur et le Suivi */
.lx-fichier .lx-rangee-qui { min-width: 0; }
.lx-fichier .lx-rangee-qui > span { overflow-wrap: anywhere; }
.lx-fichier .lx-rangee-qui > small { display: block; margin-top: 2px; line-height: 1.5; }
.lx-fichier .lx-rangee-qui > small > .lx-etat { display: inline-flex; margin-right: 6px; vertical-align: 1px; }
.lx-fichier .lx-fichier-gestes { display: flex; align-items: center; gap: 6px; flex: none; margin-left: auto; }
.lx-fichier .lx-fichier-gestes .btn.petit { height: 28px; padding: 0 12px; font-size: 12.5px; }
details.menu-plus.lx-plus { position: relative; }
details.menu-plus.lx-plus > summary { display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border-radius: 50%; list-style: none; }
details.menu-plus.lx-plus > summary::-webkit-details-marker { display: none; }
details.menu-plus.lx-plus > .menu-plus-liste { right: 0; left: auto; min-width: 250px; }
details.menu-plus.lx-plus > .menu-plus-liste form { margin: 0; }
details.menu-plus.lx-plus > .menu-plus-liste form button { width: 100%; border: 0; background: none; font: inherit; cursor: pointer; text-align: left; }
details.menu-plus.lx-plus > .menu-plus-liste form button:hover { background: var(--mz-vert); color: var(--mz-surface); }
details.menu-plus.lx-plus > .menu-plus-liste > p { margin: 4px 10px 6px; font-size: 12px; line-height: 1.45; color: var(--ap-label3); white-space: normal; max-width: 300px; }

/* la ligne d'un fichier : la pastille d'un état quand ce n'est pas un fichier (une formalité, la validation), celle
   des points d'attention (`.lx-pastille-ic`) ; ses pièces */
.lx-pastille-ic-vert { background: var(--mz-vert-clair); color: var(--mz-vert-fonce); }
.lx-fichier > .lx-pastille-ic { width: 30px; height: 30px; border-radius: 9px; }
.lx-fichier > .lx-pastille-ic .lx-ic { width: 15px; height: 15px; stroke-width: 2; }
.lx-fichier-liens a small { margin-left: 5px; font-size: 11.5px; color: var(--ap-label3); }
.lx-fichier-liens { display: flex; flex-wrap: wrap; gap: 2px 10px; margin-top: 3px; }
.lx-fichier-liens a { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--ap-tint); text-decoration: none; }
.lx-fichier-liens a:hover { text-decoration: underline; }
.lx-fichier-liens .lx-ic { width: 13px; height: 13px; }
/* ce qui s'ouvre sous une ligne (`data-lx-ouvre-dessous`, apple.js) : déposer la version signée, « Faite », rouvrir */
.lx-liste-groupee > .lx-dessous { display: none; padding: 2px 16px 14px 58px; }
.lx-liste-groupee > .lx-fichier.lx-ouverte + .lx-dessous { display: block; animation: lx-dessous-vient 260ms var(--lx-glisse); }
.lx-liste-groupee > .lx-fichier.lx-ouverte { border-bottom: 0; }
.lx-dessous > .lx-note, .lx-dessous p.lx-note { margin: 6px 0 0; font-size: 12px; color: var(--ap-label3); }
.lx-dessous .lx-boutons { flex-wrap: wrap; align-items: center; gap: 8px; }
.lx-dessous .lx-champ-ligne { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--ap-label2); }
.lx-dessous .lx-depot { display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 14px; border-radius: 999px; background: var(--ap-tint); color: var(--mz-surface);
  font-size: 13px; font-weight: 500; cursor: pointer; }
.lx-dessous .lx-depot .lx-ic { width: 15px; height: 15px; }
.lx-dessous .lx-replie { margin-top: 8px; }
@keyframes lx-dessous-vient { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .lx-liste-groupee > .lx-fichier.lx-ouverte + .lx-dessous { animation: none; } }
/* les gestes de « … » : un dépôt (un fichier choisi) se lit comme un choix du menu ; les phrases de la production dessous */
details.menu-plus.lx-plus > .menu-plus-liste form label { display: flex; align-items: center; gap: 10px; min-height: 34px; padding: 0 10px; border-radius: 10px;
  font-size: 13.5px; font-weight: 400; color: var(--ap-label); white-space: nowrap; cursor: pointer; }
details.menu-plus.lx-plus > .menu-plus-liste form label .lx-ic, details.menu-plus.lx-plus > .menu-plus-liste form button .lx-ic { width: 17px; height: 17px; color: var(--ap-label2); }
details.menu-plus.lx-plus > .menu-plus-liste form label:hover { background: var(--mz-vert); color: var(--mz-surface); }
details.menu-plus.lx-plus > .menu-plus-liste :is(form label, form button):hover .lx-ic { color: var(--mz-surface); }
details.menu-plus.lx-plus > .menu-plus-liste .lx-danger { color: var(--ap-rouge); }
details.menu-plus.lx-plus > .menu-plus-liste hr { margin: 5px 6px; border: 0; border-top: .5px solid var(--ap-trait); }
details.menu-plus.lx-plus > .menu-plus-liste .lx-gestes { display: block; }
details.menu-plus.lx-plus > .menu-plus-liste .lx-gestes .lx-depot { display: flex; align-items: center; gap: 10px; min-height: 34px; padding: 0 10px; border-radius: 10px;
  background: none; color: var(--ap-label); font-size: 13.5px; font-weight: 400; cursor: pointer; }
details.menu-plus.lx-plus > .menu-plus-liste .lx-gestes .lx-depot:hover { background: var(--mz-vert); color: var(--mz-surface); }

/* le Suivi du fil, épuré : des sections comme la fiche, plus petites, dans le volet */
.lx-suivi { display: flex; flex-direction: column; gap: 20px; }
.lx-suivi > [data-maj]:empty { display: none; }
.lx-suivi-section > header { display: flex; align-items: baseline; gap: 8px; padding: 0 6px 7px; }
.lx-suivi-section > header > h3 { margin: 0; font-size: 15px; font-weight: 700; letter-spacing: -.01em; color: var(--ap-label); }
.lx-suivi-section > header > .lx-section-compte { font-size: 13px; color: var(--ap-label3); }
.lx-suivi .lx-liste-groupee { border-radius: 16px; overflow: visible; }
.lx-suivi .lx-liste-groupee > .lx-fichier { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 10px 12px; }
.lx-suivi .lx-liste-groupee > .lx-fichier + .lx-fichier, .lx-suivi .lx-liste-groupee > .lx-dessous + .lx-fichier { border-top: .5px solid var(--ap-trait); }
.lx-suivi .lx-fichier .lx-fichier-vignette { width: 28px; height: 34px; border-radius: 5px; font-size: 8px; }
.lx-suivi .lx-fichier > .lx-pastille-ic { width: 28px; height: 28px; border-radius: 8px; }
.lx-suivi .lx-fichier .lx-rangee-qui { flex: 1 1 140px; }
.lx-suivi .lx-fichier .lx-rangee-qui > span { font-size: 13.5px; line-height: 1.3; }
.lx-suivi .lx-fichier .lx-rangee-qui > small { font-size: 12px; line-height: 1.4; color: var(--ap-label3); }
.lx-suivi .lx-fichier .lx-fichier-gestes { gap: 4px; }
.lx-suivi .lx-liste-groupee > .lx-dessous { padding: 0 12px 12px 50px; }
.lx-suivi .lx-note-groupe { margin: 8px 6px 0; font-size: 12px; color: var(--ap-label3); }
.lx-suivi-pied { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 8px; padding: 8px 2px 0; }
.lx-suivi-pied > .lx-suivi-pied-droite { margin-left: auto; }
.lx-suivi-pied > .lx-suivi-pied-droite + .lx-suivi-pied-droite { margin-left: 0; }
.lx-suivi-pied .btn .lx-ic, .lx-suivi-ajout > summary .lx-ic { width: 15px; height: 15px; }
.lx-suivi-ajout { flex: 1 1 100%; }
.lx-suivi-ajout > summary { display: inline-flex; align-items: center; gap: 6px; color: var(--ap-tint); list-style: none; cursor: pointer; }
.lx-suivi-ajout > summary::-webkit-details-marker { display: none; }
.lx-suivi-ajout[open] > summary { margin-bottom: 8px; }
.lx-suivi-ajout > form { padding: 12px; border-radius: 16px; background: var(--mz-surface); box-shadow: var(--ap-ombre-groupe); }
.lx-suivi-ajout + .lx-suivi-pied-droite { margin-left: auto; }
.lx-suivi-section > .lx-suivi-ajout { display: block; margin-top: 8px; padding: 0 2px; }
/* « Reste à faire » : une carte en tête, une ligne par chose qui reste, son point d'état ; chacune mène à sa place */
.lx-suivi-reste { padding: 12px 14px 8px; border-radius: 16px; background: var(--mz-surface); box-shadow: var(--ap-ombre-groupe); }
.lx-suivi-reste > h3 { margin: 0 0 4px; font-size: 13px; font-weight: 600; color: var(--ap-label); }
.lx-suivi-reste-ligne { display: flex; align-items: baseline; gap: 9px; padding: 5px 0; font-size: 13px; line-height: 1.35; color: var(--ap-label); text-decoration: none; }
.lx-suivi-reste-ligne + .lx-suivi-reste-ligne { border-top: .5px solid var(--ap-trait); }
.lx-suivi-reste-ligne:hover { color: var(--ap-tint); text-decoration: none; }
.lx-suivi-reste-ligne > span { min-width: 0; }
.lx-suivi-reste-ligne small { display: block; font-size: 12px; color: var(--ap-label3); }
.lx-suivi-point { flex: none; width: 7px; height: 7px; border-radius: 50%; transform: translateY(-1px); }
.lx-suivi-point-ambre { background: var(--ap-orange); } .lx-suivi-point-rouge { background: var(--ap-rouge); }
/* la place de « … » quand une ligne n'en a pas : les boutons des lignes d'une liste restent alignés */
.lx-plus-place { flex: none; width: 28px; }
/* ce qui s'ouvre sous une ligne : le geste et ses cases sur une ligne, à gauche ; « Sans objet » et le dépôt de la
   preuve ensemble dessous, en boutons gris ; la source en note */
.lx-liste-groupee > .lx-fichier.lx-ouverte + .lx-dessous { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.lx-dessous > form, .lx-dessous > .lx-note, .lx-dessous > p { flex: 1 1 100%; }
.lx-dessous .lx-boutons { justify-content: flex-start; margin: 0; }
.lx-dessous > .lx-replie { flex: none; margin: 0; }
.lx-dessous > .lx-replie[open] { flex: 1 1 100%; }
.lx-dessous > .lx-replie > summary.btn { list-style: none; }
.lx-dessous > .lx-replie > summary::-webkit-details-marker { display: none; }
.lx-dessous > .lx-replie > form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 8px; }
.lx-dessous > .lx-gestes { display: inline-flex; flex: none; }
.lx-dessous .lx-gestes .lx-depot { height: 28px; padding: 0 12px; background: var(--mz-surface); color: var(--ap-label); font-size: 12.5px; box-shadow: var(--ap-ombre-poignee); }
.lx-dessous .lx-gestes .lx-depot .lx-ic { color: var(--ap-label2); }
.lx-dessous .lx-champ-ligne .case, .lx-dessous .lx-champ-ligne input { width: 118px; }
/* dans le volet du fil, ce qui s'ouvre sous une ligne garde ses gestes à gauche, petits, sur une ligne (comme
   `.lx-element`, que le volet règle ainsi) */
main.page .socle-fil.conv-v2 .conv-volet .lx-dessous .lx-boutons { justify-content: flex-start; gap: 6px; margin: 0; }
main.page .socle-fil.conv-v2 .conv-volet .lx-dessous .lx-boutons > .lx-champ-ligne { flex: 0 1 auto; }
main.page .socle-fil.conv-v2 .conv-volet .lx-dessous .lx-boutons .btn.btn { height: 28px !important; padding: 0 12px !important; font-size: 12.5px !important; }
/* le geste d'une ligne est gris ; celui qui a ouvert ce qui est dessous se fonce tant que c'est ouvert : le geste à
   faire, en vert, est dessous */
.lx-fichier.lx-ouverte > .lx-fichier-gestes > [data-lx-ouvre-dessous].btn { background: var(--ap-fill); color: var(--ap-label); box-shadow: none; }
/* la loupe des réponses, en tête du volet Informations : l'icône à droite, le champ prend la largeur du volet ; elle
   n'est là que sur Informations */
/* fermée, l'icône se pose à droite de la première ligne de l'onglet, centrée sur elle : le titre d'un cadre
   (« À fournir », « Réponses »), ou « Reste », plus bas ; ouverte, le champ prend sa ligne, au-dessus de tout */
.lx-volet-loupe { position: absolute; z-index: 2; top: 12px; right: 12px; display: flex; justify-content: flex-end; }
.conv-volet-corps:has(> #panneau-infos > .conv-reste) > .lx-volet-loupe { top: 15px; }
main.page .socle-fil.conv-v2 .conv-volet-corps:has(> .lx-volet-loupe) { position: relative; }
/* le volet range ses enfants avec 28 px d'écart : le champ ouvert se tient à 12 px de ce qu'il cherche */
.conv-volet-corps > .lx-volet-loupe:has(> .lx-loupe[data-ouverte]) { position: static; margin: 0 0 -16px; }
.conv-volet-corps:has(> #panneau-infos[hidden]) > .lx-volet-loupe { display: none; }
.lx-volet-loupe > .lx-loupe[data-ouverte] { flex: 1 1 auto; }
main.page .lx-volet-loupe .lx-loupe[data-ouverte] input.lx-loupe-champ[type="search"]:not([hidden]),
.lx-volet-loupe .lx-loupe[data-ouverte] input.lx-loupe-champ[type="search"] { width: 100%; }
main.page .socle-fil.conv-v2 .lx-volet-loupe .lx-loupe .lx-loupe-ouvrir.btn { display: grid; place-items: center; width: 30px; height: 30px !important; min-height: 0 !important; padding: 0; border-radius: 50%; }

/* Othmane, 2026-11-01 · les titres des colonnes d'une liste restent en haut avec sa barre de recherche et de filtres
   quand la page défile, sous une bande de verre, comme les en-têtes d'une liste du Finder. Le cadre ne défile plus
   lui-même (`overflow: clip` coupe sans faire défiler) : les titres collent à la page, sous la barre collée, dont
   `apple.js` mesure la hauteur (`--lx-sous-la-barre`). */
.lx-tableau[data-lx-liste]:not([data-lx-groupee]) .lx-tableau-defile { overflow: clip; }
.lx-tableau[data-lx-liste] thead th, .lx-tableau[data-lx-liste][data-lx-compact] thead th { position: sticky; top: var(--lx-sous-la-barre, 0px); z-index: 5;
  background: color-mix(in srgb, var(--mz-surface) 82%, transparent); -webkit-backdrop-filter: blur(20px) saturate(180%); backdrop-filter: blur(20px) saturate(180%); }