/* ==========================================================================
   Algo Data · charte Éditeur v1.1 · ad-ecrans.css
   Les écrans produit dessinés (interfaces simplifiées, données fictives) : cadres d'appareil,
   kit d'interface, écrans, et le système de RECADRAGE par point de rupture du cadre.
   Se charge après ad-socle.css (jetons) et avant ad-composants.css (compositions de page).

   Principes
   1. Le cadre dit qui regarde : navigateur = l'organisateur au bureau ; téléphone = le
      participant ; tablette = le comptoir. Un back-office n'est jamais posé dans un téléphone.
   2. Les écrans restent des « captures » claires dans les deux thèmes (rôles --ad-ui-*).
   3. Recadrer plutôt que réduire : sur un cadre .ad-cadre--recadre, le corps d'écran reste entre
      12 et 13,5 px ; quand le cadre rétrécit, des éléments le quittent par priorité, entre deux
      colonnes, jamais au milieu d'un mot. Quatre cadrages, réglés par la largeur du CADRE :
        entier ≥ 1 040 px · large 780–1 039 (menu en rail) · moyen 560–779 · détail < 560 (variante
        téléphone : barre de produit, tuiles 2 × 2, lignes à deux niveaux, relevé des montants).
   ========================================================================== */

/* 1. Cadres ------------------------------------------------------------------- */
/* Navigateur (rayon 16 ; la scène fait 28 = 16 + 12). L'écran se met à l'échelle de son cadre :
   largeur de conception --ad-ui-l, en em. */
.ad-cadre { background: var(--ad-cadre-fond); border-radius: var(--ad-r-3); box-shadow: var(--ad-ombre-cadre); overflow: hidden;
            color: var(--ad-ui-encre); container: ad-ecran / inline-size; }
.ad-cadre > .ad-ui { font-size: calc(100cqw / var(--ad-ui-l, 64)); }
.ad-cadre__chrome { display: flex; align-items: center; gap: 12px; height: 38px; padding: 0 14px; background: var(--ad-cadre-chrome);
                    border-bottom: 1px solid var(--ad-ui-perle); }
.ad-cadre__feux { display: flex; gap: 6px; }
.ad-cadre__feux i { width: 10px; height: 10px; border-radius: 50%; background: var(--ad-ui-filet-fort); display: block; }
.ad-cadre__url { flex: 1; max-width: 360px; margin-inline: auto; height: 24px; border-radius: 7px; background: var(--ad-ui-blanc);
                 box-shadow: inset 0 0 0 1px var(--ad-ui-perle); font-size: 11.5px; color: var(--ad-ui-graphite); display: flex;
                 align-items: center; justify-content: center; gap: 6px; white-space: nowrap; overflow: hidden; padding: 0 8px; }
.ad-cadre__url .bi { font-size: 10px; flex: none; }
.ad-cadre__chemin { margin-left: -6px; }
@media (max-width: 640px) { .ad-cadre__chemin { display: none; } }

/* Téléphone : toutes ses mesures en em, mises à l'échelle par --ad-tel-base. Coque 44 / bord 10 / écran 34. */
.ad-tel { font-size: var(--ad-tel-base, 16px); width: 17em; flex: none; border-radius: 2.75em; padding: .625em; background: var(--ad-ui-encre);
          box-shadow: var(--ad-ombre-appareil), var(--ad-appareil-biseau); }
.ad-tel__ecran.ad-ui { font-size: .75em; }
.ad-tel__ecran { border-radius: 2.833em; overflow: hidden; background: var(--ad-ui-blanc); height: 46.667em; position: relative; color: var(--ad-ui-encre); }
/* le bas de l'écran du téléphone se fond dans le blanc : la coupe ne tombe jamais nue au milieu d'une ligne */
.ad-tel__ecran::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2.6em; z-index: 3; pointer-events: none;
                        background: linear-gradient(to bottom, rgba(255, 255, 255, 0), var(--ad-ui-blanc) 85%); }
.ad-tel__statut { height: 3.333em; display: flex; align-items: center; justify-content: space-between; padding: 0 1.833em 0 2.167em;
                  font-weight: 600; font-variant-numeric: tabular-nums; }
.ad-tel__ile { width: 7em; height: 2em; border-radius: 1.167em; background: var(--ad-ui-encre); }
.ad-tel__statut .bi { font-size: 1em; margin-left: .25em; }

/* Tablette : coque 30 = bord 14 + écran 16 */
.ad-tablette { border-radius: 30px; padding: 14px; background: var(--ad-ui-fusain); box-shadow: var(--ad-ombre-appareil);
               container: ad-ecran / inline-size; }
.ad-tablette .ad-tablette__ecran { border-radius: 16px; overflow: hidden; background: var(--ad-ui-blanc); color: var(--ad-ui-encre);
                                   font-size: calc(100cqw / var(--ad-ui-l, 50)); }

/* 2. Kit d'interface (dans les cadres seulement ; tailles en em) ----------------- */
.ad-ui { font-size: 12px; line-height: 1.45; color: var(--ad-ui-encre); text-align: left; font-family: var(--ad-police-ui);
         letter-spacing: 0; font-feature-settings: "kern"; }
/* chiffres tabulaires sur les nombres seulement : dans Inter, tnum élargit aussi le trait d'union */
.ad-ui-kpi b, .ad-ui-table .is-num, .ad-ui time, .ad-ui-id, .ad-insc__ligne > span, .ad-insc__total b, .ad-cpt__compte b,
.ad-msb__cartes b, .ad-mail__recap b, .ad-tel__statut > span:first-child, .ad-dos__ligne em, .ad-facture b { font-variant-numeric: tabular-nums; }
.ad-ui * { letter-spacing: 0; }
.ad-ui-app { display: grid; grid-template-columns: 13.5em minmax(0, 1fr); min-height: 100%; }
.ad-ui-side { background: var(--ad-ui-neige); border-right: 1px solid var(--ad-ui-perle); padding: 1.1em .8em; display: grid; align-content: start; gap: .15em; }
.ad-ui-side__marque { display: flex; align-items: center; gap: .6em; font-weight: 600; font-size: 1.05em; padding: .2em .5em 1em; }
.ad-ui-side__marque i { width: 1.6em; height: 1.6em; border-radius: .45em; display: grid; place-items: center; background: var(--ad-ui-encre); color: var(--ad-ui-blanc); font-style: normal; font-size: .875em; flex: none; }
.ad-ui-side__titre { font-size: .875em; font-weight: 600; color: var(--ad-ui-graphite); padding: 1em .6em .35em; }
.ad-ui-side span.ad-ui-item { display: flex; align-items: center; gap: .65em; padding: .5em .6em; border-radius: .5em; color: var(--ad-ui-ardoise); font-weight: 500; }
.ad-ui-side .bi { font-size: 1.08em; color: var(--ad-ui-graphite); }
.ad-ui-side .is-actif { background: var(--ad-ui-blanc); color: var(--ad-ui-encre); box-shadow: 0 0 0 1px var(--ad-ui-perle), 0 1px 2px rgba(17, 17, 18, .05); font-weight: 600; }
.ad-ui-side .is-actif .bi { color: var(--ad-ui-encre); }
.ad-ui-side .is-off { color: var(--ad-ui-graphite); }
/* rail d'icônes de 56 px (ouverture de l'accueil) : aucun mot coupé sous le téléphone */
.ad-ui-rail .ad-ui-app { grid-template-columns: 4.667em minmax(0, 1fr); }
.ad-ui-rail .ad-ui-side { padding: 1.1em .6em; justify-items: center; }
.ad-ui-rail .ad-ui-side__marque { padding: .2em 0 1em; }
.ad-ui-rail .ad-ui-side__marque span, .ad-ui-rail .ad-ui-item > span, .ad-ui-rail .ad-ui-side__titre { display: none; }
.ad-ui-rail .ad-ui-side span.ad-ui-item { padding: .55em .6em; }
.ad-ui-main { padding: 1.3em 1.5em 1.5em; min-width: 0; display: grid; align-content: start; gap: 1.1em; background: var(--ad-ui-blanc); }
.ad-ui-fil { font-size: .9em; color: var(--ad-ui-graphite); display: flex; gap: .5em; align-items: center; flex-wrap: wrap; }
.ad-ui-fil .bi { font-size: .8em; }
.ad-ui-entete { display: flex; align-items: center; gap: .8em 1em; justify-content: space-between; flex-wrap: wrap; }
.ad-ui-h { font-size: 1.5em; line-height: 1.2; font-weight: 600; letter-spacing: -0.015em; }
.ad-ui-sous { color: var(--ad-ui-graphite); font-size: .95em; margin-top: .2em; }
.ad-ui-boutons { display: flex; gap: .5em; }
.ad-ui-btn { display: inline-flex; align-items: center; gap: .45em; height: 2.4em; padding: 0 .95em; border-radius: .55em; font-weight: 600; font-size: .95em;
             background: var(--ad-ui-blanc); box-shadow: inset 0 0 0 1px var(--ad-ui-filet-fort); white-space: nowrap; color: var(--ad-ui-encre); }
.ad-ui-btn--encre { background: var(--ad-ui-encre); color: var(--ad-ui-blanc); box-shadow: none; }
.ad-ui-btn--demo { background: var(--ad-marque-demo); color: var(--ad-ui-blanc); box-shadow: none; }
.ad-ui-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .8em; }
.ad-ui-kpi { border: 1px solid var(--ad-ui-perle); border-radius: .8em; padding: .9em 1em; display: grid; gap: .25em; background: var(--ad-ui-blanc); align-content: start; }
.ad-ui-kpi b { font-size: 1.85em; line-height: 1.1; font-weight: 600; letter-spacing: -0.02em; white-space: nowrap; }
.ad-ui-kpi span { color: var(--ad-ui-graphite); font-size: .92em; }
.ad-ui-kpi small { font-size: .875em; color: var(--ad-ui-vert); font-weight: 600; }
.ad-ui-bas { display: grid; grid-template-columns: minmax(0, 1fr) 14em; gap: .9em; }
.ad-ui-carte { border: 1px solid var(--ad-ui-perle); border-radius: .8em; background: var(--ad-ui-blanc); min-width: 0; overflow: hidden; }
.ad-ui-carte__tete { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: .8em 1em; border-bottom: 1px solid var(--ad-ui-perle); font-weight: 600; gap: 1em; }
.ad-ui-carte__tete span { font-weight: 500; color: var(--ad-ui-graphite); font-size: .92em; }
.ad-ui-table { width: 100%; border-collapse: collapse; }
.ad-ui-table th { font-size: .875em; font-weight: 600; color: var(--ad-ui-graphite); text-align: left; padding: .65em 1em; border-bottom: 1px solid var(--ad-ui-perle); white-space: nowrap; background: var(--ad-ui-neige); }
.ad-ui-table td { padding: .62em 1em; border-bottom: 1px solid var(--ad-ui-perle); white-space: nowrap; vertical-align: middle; }
.ad-ui-table tr:last-child td { border-bottom: 0; }
.ad-ui-table .is-num { text-align: right; }
.ad-ui-id { color: var(--ad-ui-graphite); font-size: .92em; }
.ad-ui-nom { font-weight: 600; }
.ad-ui-mail { color: var(--ad-ui-ardoise); font-size: .92em; display: inline-flex; align-items: center; gap: .35em; }
.ad-ui-mail .bi { color: var(--ad-ui-vert); font-size: .95em; }
.ad-ui-pill { display: inline-flex; align-items: center; gap: .35em; padding: .18em .6em; border-radius: 999px; font-size: .875em; font-weight: 600; white-space: nowrap; }
.ad-ui-pill--ok { background: var(--ad-ui-vert-pale); color: var(--ad-ui-vert); }
.ad-ui-pill--att { background: var(--ad-ui-ambre-pale); color: var(--ad-ui-ambre); }
.ad-ui-pill--neutre { background: var(--ad-ui-brume); color: var(--ad-ui-ardoise); }
.ad-ui-pill--scan { background: var(--ad-ui-brume); color: var(--ad-ui-ardoise); }
.ad-ui-pill--humain { background: var(--ad-ui-encre); color: var(--ad-ui-blanc); }
.ad-ui-etat { width: 1.4em; height: 1.4em; border-radius: 50%; display: inline-grid; place-items: center; font-size: .875em; }
.ad-ui-etat--ok { background: var(--ad-ui-vert-pale); color: var(--ad-ui-vert); }
.ad-ui-etat--att { background: var(--ad-ui-ambre-pale); color: var(--ad-ui-ambre); }
.ad-ui-barres { display: flex; align-items: flex-end; gap: .32em; height: 6.5em; padding: .8em 1em 0; }
.ad-ui-barres i { flex: 1; background: var(--ad-ui-perle); border-radius: .25em .25em 0 0; display: block; }
.ad-ui-barres i.is-fort { background: var(--ad-ui-encre); }
.ad-ui-axe { display: flex; justify-content: space-between; padding: .4em 1em .8em; color: var(--ad-ui-graphite); font-size: .875em; }
.ad-ui-repartition { padding: 0 1em 1em; display: grid; gap: .45em; }
.ad-ui-repartition div { display: flex; justify-content: space-between; }
.ad-ui-repartition span { color: var(--ad-ui-graphite); }
.ad-ui-onglets { display: flex; gap: 1.4em; border-bottom: 1px solid var(--ad-ui-perle); font-weight: 500; color: var(--ad-ui-graphite); }
.ad-ui-onglets span { padding: .55em 0; margin-bottom: -1px; white-space: nowrap; }
.ad-ui-onglets .is-actif { color: var(--ad-ui-encre); font-weight: 600; box-shadow: inset 0 -2px 0 var(--ad-ui-encre); }
.ad-ui-onglets .is-off { color: var(--ad-ui-graphite); }
.ad-ui-bascule { display: inline-flex; align-items: center; gap: .55em; color: var(--ad-ui-ardoise); font-weight: 500; white-space: nowrap; }
.ad-ui-bascule i { width: 2.2em; height: 1.25em; border-radius: 999px; background: var(--ad-ui-filet-fort); position: relative; display: inline-block; flex: none; }
.ad-ui-bascule i::after { content: ""; position: absolute; top: .15em; left: .15em; width: .95em; height: .95em; border-radius: 50%; background: var(--ad-ui-blanc); }
.ad-ui-repart { display: flex; height: .7em; border-radius: 999px; overflow: hidden; background: var(--ad-ui-perle); }
.ad-ui-repart i { display: block; height: 100%; }
.ad-ui-repart .is-humain { background: var(--ad-ui-encre); }
.ad-ui-repart .is-scan { background: repeating-linear-gradient(135deg, var(--ad-ui-filet-fort) 0 .35em, var(--ad-ui-perle) .35em .7em); }
.ad-ui-label { font-size: .9em; font-weight: 600; color: var(--ad-ui-ardoise); }
.ad-ui-avatar { width: 2.2em; height: 2.2em; border-radius: 50%; display: inline-grid; place-items: center; font-weight: 600; font-size: .875em; background: var(--ad-ui-brume); color: var(--ad-ui-ardoise); flex: none; }
.ad-ui-vide { display: none; }
/* cadrages propres à une composition de page (ouverture de l'accueil, cartes) ; les cadres
   recadrés n'emploient plus que les classes ad-ui-quitte-* (§5) */
.ad-heros-bo .ad-ui-cache-heros, .ad-etroit .ad-ui-cache-etroit { display: none !important; }
@media (max-width: 640px) {
  .ad-cadre:not(.ad-cadre--recadre) .ad-ui-app { grid-template-columns: minmax(0, 1fr); }
  .ad-cadre:not(.ad-cadre--recadre) .ad-ui-side,
  .ad-cadre:not(.ad-cadre--recadre) .ad-ui-cache-mobile, .ad-ui-cache-etroit { display: none !important; }
  .ad-tablette .ad-ui-cache-mobile, .ad-tel .ad-ui-cache-mobile { display: none !important; }
  .ad-cadre:not(.ad-cadre--recadre) .ad-ui-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ad-cadre:not(.ad-cadre--recadre) .ad-ui-bas { grid-template-columns: minmax(0, 1fr); }
}

/* 3. Écrans produit ---------------------------------------------------------------- */
.ad-ui-cle { display: inline-block; width: .8em; height: .8em; border-radius: .2em; margin-right: .45em; vertical-align: -.05em; }
.ad-ui-cle.is-humain { background: var(--ad-ui-encre); }
.ad-ui-cle.is-scan { background: repeating-linear-gradient(135deg, var(--ad-ui-filet-fort) 0 .2em, var(--ad-ui-perle) .2em .4em); box-shadow: inset 0 0 0 1px var(--ad-ui-filet-fort); }
.ad-qr { width: 100%; height: auto; color: var(--ad-ui-encre); }
@container ad-ecran (max-width: 339.98px) {
  .ad-vgn__ligne b { white-space: normal; }
  .ad-vgn__tete { flex-wrap: wrap; gap: .2em 1em; }
}
.ad-mail-repart { padding: .8em 1em .3em; }
.ad-mail-cles { display: flex; gap: 1.4em; margin-top: .5em; font-size: .9em; color: var(--ad-ui-graphite); }

/* La marque de l'organisateur fictif : il s'habille, la marque éclaire. Un mini-site a un
   en-tête BLANC ; sa couleur reste sur le logo, la date, le bouton, les heures et l'onglet
   actif. Les aplats pleins vont aux objets imprimés ou envoyés (badge, bandeau du courriel). */
.ad-ms__logo { display: inline-flex; align-items: center; gap: .5em; font-weight: 650; letter-spacing: -0.01em; color: var(--ad-ui-sarcelle); white-space: nowrap; }
.ad-ms__logo i { width: 1.45em; height: 1.45em; border-radius: .4em; background: var(--ad-ui-sarcelle); position: relative; display: inline-block; flex: none; }
.ad-ms__logo i::after { content: ""; position: absolute; width: .62em; height: .62em; border-radius: 50%; background: var(--ad-ui-corail); right: .22em; top: .22em; }
.ad-ms__logo--clair { color: var(--ad-ui-sarcelle); }
.ad-ms__logo--clair i { background: var(--ad-ui-sarcelle); }

/* mini-site sur téléphone */
.ad-ms { display: flex; flex-direction: column; }
.ad-ms .ad-tel__statut { background: var(--ad-ui-blanc); color: var(--ad-ui-encre); }
.ad-ms__nav { display: flex; justify-content: space-between; align-items: center; padding: .7em 1.4em .9em; font-size: 1.05em;
              background: var(--ad-ui-blanc); color: var(--ad-ui-encre); box-shadow: inset 0 -1px 0 var(--ad-ui-perle); }
.ad-ms__nav .bi { font-size: 1.4em; }
.ad-ms__hero { padding: 1.4em 1.4em 1.4em; display: grid; gap: .55em; border-bottom: 1px solid var(--ad-ui-perle); }
.ad-ms__hero b { font-size: 1.7em; line-height: 1.1; letter-spacing: -0.02em; font-weight: 650; }
.ad-ms__chap { color: var(--ad-ui-ardoise); font-size: 1em; line-height: 1.4; }
.ad-ms__date { font-size: .9em; font-weight: 600; color: var(--ad-ui-sarcelle); }
.ad-ms__cta { justify-self: start; margin-top: .4em; display: inline-flex; align-items: center; gap: .45em; background: var(--ad-ui-sarcelle); color: var(--ad-ui-blanc);
              font-weight: 600; padding: .65em 1.1em; border-radius: .7em; white-space: nowrap; }
.ad-ms__prog { padding: 1.1em 1.4em; display: grid; gap: .1em; }
.ad-ms__jour { font-weight: 650; font-size: 1.05em; margin-bottom: .4em; }
.ad-ms__seance { display: grid; grid-template-columns: 3.4em 1fr; gap: .6em; padding: .6em 0; border-top: 1px solid var(--ad-ui-perle); }
.ad-ms__seance time { font-weight: 650; color: var(--ad-ui-sarcelle); }
.ad-ms__seance b { display: block; font-weight: 600; }
.ad-ms__seance span { color: var(--ad-ui-graphite); font-size: .92em; }

/* inscription par profil, récapitulatif et paiement */
.ad-insc { background: var(--ad-ui-blanc); }
.ad-insc__tete { display: flex; justify-content: space-between; align-items: center; gap: 1em; padding: 1em 1.6em; border-bottom: 1px solid var(--ad-ui-perle); font-size: 1.05em; }
.ad-insc__profil { font-size: .875em; font-weight: 600; color: var(--ad-ui-sarcelle); background: var(--ad-ui-sarcelle-pale); padding: .3em .75em; border-radius: 999px; white-space: nowrap; }
.ad-insc__etapes { list-style: none; margin: 0; padding: 1em 1.6em; display: flex; gap: 1em; flex-wrap: nowrap; border-bottom: 1px solid var(--ad-ui-perle);
                   font-size: .88em; font-weight: 600; color: var(--ad-ui-graphite); }
.ad-insc__etapes li { display: inline-flex; align-items: center; gap: .45em; white-space: nowrap; }
.ad-insc__etapes li > i { width: 1.6em; height: 1.6em; border-radius: 50%; display: inline-grid; place-items: center; font-style: normal; font-size: 1em;
                          box-shadow: inset 0 0 0 1px var(--ad-ui-filet-fort); }
.ad-insc__etapes .is-fait { color: var(--ad-ui-ardoise); }
.ad-insc__etapes .is-fait > i { background: var(--ad-ui-sarcelle-pale); color: var(--ad-ui-sarcelle); box-shadow: none; }
.ad-insc__etapes .is-actif { color: var(--ad-ui-encre); }
.ad-insc__etapes .is-actif > i { background: var(--ad-ui-sarcelle); color: var(--ad-ui-blanc); box-shadow: none; }
.ad-insc__corps { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 1.6em; padding: 1.4em 1.6em 1.7em; }
.ad-insc__recap { display: grid; gap: .1em; align-content: start; }
.ad-insc__titre { font-size: 1.3em; margin-bottom: .5em; }
.ad-insc__ligne { display: flex; justify-content: space-between; gap: 1em; padding: .7em 0; border-bottom: 1px solid var(--ad-ui-perle); }
.ad-insc__ligne b { display: block; font-weight: 600; }
.ad-insc__ligne div span { color: var(--ad-ui-graphite); font-size: .92em; }
.ad-insc__ligne > span { font-weight: 600; white-space: nowrap; }
.ad-insc__total { display: flex; justify-content: space-between; align-items: baseline; padding: .9em 0 .6em; font-weight: 600; }
.ad-insc__total b { font-size: 1.5em; letter-spacing: -0.02em; }
.ad-insc__cgv { display: flex; align-items: center; gap: .55em; color: var(--ad-ui-ardoise); font-weight: 500; }
.ad-insc__cgv .bi { color: var(--ad-ui-sarcelle); font-size: 1.2em; }
.ad-insc__paie { background: var(--ad-ui-neige); border: 1px solid var(--ad-ui-perle); border-radius: 1em; padding: 1.1em; display: grid; gap: .6em; align-content: start; }
.ad-insc__choix { display: flex; gap: .7em; align-items: flex-start; padding: .75em .85em; border-radius: .7em; background: var(--ad-ui-blanc); box-shadow: inset 0 0 0 1px var(--ad-ui-perle); }
.ad-insc__choix .bi { color: var(--ad-ui-graphite); font-size: 1.15em; line-height: 1.3; }
.ad-insc__choix b { display: block; font-weight: 600; }
.ad-insc__choix span { color: var(--ad-ui-graphite); font-size: .9em; }
.ad-insc__choix.is-choisi { box-shadow: inset 0 0 0 1.5px var(--ad-ui-sarcelle); }
.ad-insc__choix.is-choisi .bi { color: var(--ad-ui-sarcelle); }
.ad-insc__payer { justify-content: center; height: 2.9em; font-size: 1em; margin-top: .3em; }
.ad-insc__note { justify-self: center; font-size: .875em; font-weight: 600; color: var(--ad-ui-ardoise); padding: .3em .6em; text-align: center; }

/* courriel de confirmation (le bandeau garde l'aplat : c'est un objet envoyé) */
.ad-mail__barre { display: flex; justify-content: space-between; align-items: center; padding: .55em 1.2em .7em; color: var(--ad-ui-ardoise); font-weight: 500; font-size: .95em; gap: .8em; }
.ad-mail__barre span:nth-child(2) { font-weight: 600; color: var(--ad-ui-encre); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad-mail__entete { padding: .2em 1.2em .9em; display: grid; gap: .8em; border-bottom: 1px solid var(--ad-ui-perle); }
.ad-mail__entete > b { font-size: 1.45em; line-height: 1.15; letter-spacing: -0.015em; font-weight: 600; }
.ad-mail__de { display: flex; gap: .65em; align-items: center; }
.ad-mail__de b { display: block; font-weight: 600; }
.ad-mail__de span { color: var(--ad-ui-graphite); font-size: .9em; }
.ad-mail__de .ad-mail__av { background: var(--ad-ui-sarcelle); color: var(--ad-ui-blanc); }   /* spécificité : .ad-mail__de span ne l'écrase plus (a11y m6) */
.ad-mail__corps { margin: .9em .9em; border: 1px solid var(--ad-ui-perle); border-radius: 1em; overflow: hidden; display: grid; gap: .65em; padding-bottom: .9em; }
.ad-mail__corps p { padding: 0 1em; color: var(--ad-ui-ardoise); line-height: 1.45; }
.ad-mail__bandeau { background: var(--ad-ui-sarcelle); padding: .85em 1em; }
.ad-mail__bandeau .ad-ms__logo { color: var(--ad-ui-blanc); }
.ad-mail__bandeau .ad-ms__logo i { background: var(--ad-ui-blanc); }
.ad-mail__recap { margin: 0 1em; display: grid; gap: .35em; background: var(--ad-ui-neige); border-radius: .7em; padding: .7em .85em; }
.ad-mail__recap div { display: flex; justify-content: space-between; gap: .8em; }
.ad-mail__recap span { color: var(--ad-ui-graphite); }
.ad-mail__pj { margin: 0 1em; display: flex; gap: .7em; align-items: center; padding: .6em .75em; border-radius: .7em; box-shadow: inset 0 0 0 1px var(--ad-ui-perle); }
.ad-mail__pj .bi { font-size: 1.4em; color: var(--ad-ui-sarcelle); }
.ad-mail__pj b { display: block; font-weight: 600; }
.ad-mail__pj span { font-size: .88em; color: var(--ad-ui-graphite); }

/* badge (objet imprimé : la tête garde l'aplat de l'organisateur) */
.ad-badge { width: 17em; min-height: 24em; background: var(--ad-ui-blanc); border-radius: .7em; overflow: hidden; display: grid; grid-template-rows: auto 1fr auto;
            position: relative; box-shadow: var(--ad-ombre-objet); }
.ad-badge__trou { position: absolute; top: .8em; left: 50%; width: 3.2em; height: .7em; margin-left: -1.6em; border-radius: 999px; background: var(--ad-ui-sarcelle-fonce); box-shadow: inset 0 1px 2px rgba(0, 0, 0, .4); display: none; }
.ad-badge--imprime .ad-badge__trou { display: block; }
.ad-badge__tete { background: var(--ad-ui-sarcelle); color: var(--ad-ui-sarcelle-clair); padding: 1.1em 1.2em 1em; display: grid; gap: .3em; font-size: .9em; font-weight: 600; }
.ad-badge--imprime .ad-badge__tete { padding-top: 2.3em; }
.ad-badge__tete .ad-ms__logo { font-size: 1.15em; color: var(--ad-ui-blanc); }
.ad-badge__tete .ad-ms__logo i { background: var(--ad-ui-blanc); }
.ad-badge__corps { padding: 1.1em 1.2em .8em; display: grid; align-content: start; gap: .1em; }
.ad-badge__prenom { font-size: 1.45em; font-weight: 600; letter-spacing: -0.015em; }
.ad-badge__nom { font-size: 1.85em; line-height: 1.05; font-weight: 650; letter-spacing: .01em; }
.ad-badge__org { color: var(--ad-ui-graphite); margin-top: .35em; font-weight: 500; }
.ad-badge__qr { margin-top: .9em; width: 6.8em; display: grid; gap: .3em; }
.ad-badge__qr span { font-size: .875em; color: var(--ad-ui-graphite); font-variant-numeric: tabular-nums; }
.ad-badge__role { background: var(--ad-ui-corail); color: var(--ad-ui-encre); font-weight: 650; padding: .65em 1.2em; font-size: .95em; }
.ad-badge--intervenant .ad-badge__role { background: var(--ad-ui-encre); color: var(--ad-ui-blanc); }
.ad-bt__fond { background: var(--ad-ui-brume); height: 100%; display: grid; justify-items: center; align-content: start; padding: 1.4em 0; }
.ad-bt__fond .ad-badge { font-size: 1em; }

/* comptoir web sur tablette */
.ad-cpt__tete { display: flex; align-items: center; gap: 1em; padding: .9em 1.3em; border-bottom: 1px solid var(--ad-ui-perle); }
.ad-cpt__titre { font-weight: 600; white-space: nowrap; }
.ad-cpt__heure { margin-left: auto; display: inline-flex; gap: .45em; align-items: center; color: var(--ad-ui-vert); font-weight: 600; font-size: .9em; white-space: nowrap; }
.ad-cpt__corps { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); gap: 1em; padding: 1.1em 1.3em 1.3em; background: var(--ad-ui-neige); }
.ad-cpt__gauche { display: grid; gap: .8em; align-content: start; }
.ad-cpt__scan { display: flex; align-items: center; gap: .7em; height: 3.2em; padding: 0 1em; border-radius: .7em; background: var(--ad-ui-blanc);
                box-shadow: inset 0 0 0 1.5px var(--ad-ui-sarcelle); color: var(--ad-ui-graphite); }
.ad-cpt__scan .bi { color: var(--ad-ui-sarcelle); font-size: 1.35em; }
.ad-cpt__fiche { background: var(--ad-ui-blanc); border: 1px solid var(--ad-ui-perle); border-radius: .9em; padding: 1em 1.1em; display: grid; gap: .9em; }
.ad-cpt__qui { display: flex; align-items: center; gap: .8em; }
.ad-cpt__qui b { display: block; font-size: 1.2em; font-weight: 600; letter-spacing: -0.01em; }
.ad-cpt__qui span { color: var(--ad-ui-graphite); font-size: .92em; }
.ad-cpt__qui .ad-ui-pill { margin-left: auto; }
.ad-cpt__av { width: 2.8em; height: 2.8em; background: var(--ad-ui-sarcelle-pale); color: var(--ad-ui-sarcelle); font-size: 1em; }
.ad-cpt__prest { display: grid; gap: .35em; color: var(--ad-ui-ardoise); }
.ad-cpt__prest .bi { color: var(--ad-ui-vert); margin-right: .45em; }
.ad-cpt__actions { display: flex; gap: .55em; flex-wrap: wrap; }
.ad-cpt__droite { display: grid; gap: .8em; align-content: start; }
.ad-cpt__compte { background: var(--ad-ui-blanc); border: 1px solid var(--ad-ui-perle); border-radius: .9em; padding: .9em 1em; display: grid; gap: .45em; }
.ad-cpt__compte span { color: var(--ad-ui-graphite); font-size: .92em; }
.ad-cpt__compte b { font-size: 2em; line-height: 1; letter-spacing: -0.025em; font-weight: 600; }
.ad-cpt__compte small { font-size: .5em; color: var(--ad-ui-graphite); font-weight: 500; letter-spacing: 0; }
.ad-cpt__liste { background: var(--ad-ui-blanc); border: 1px solid var(--ad-ui-perle); border-radius: .9em; padding: .8em 1em; display: grid; gap: .45em; }
.ad-cpt__liste div { display: flex; justify-content: space-between; gap: .6em; font-size: .95em; }
.ad-cpt__liste b { font-weight: 550; white-space: nowrap; }
.ad-cpt__liste time { color: var(--ad-ui-graphite); }

/* mini-site sur ordinateur : en-tête blanc, la couleur sur le logo, le bouton, les heures, l'onglet actif */
.ad-msb__nav { display: flex; align-items: center; gap: 1.6em; padding: .9em 1.8em; font-size: 1.02em; background: var(--ad-ui-blanc); color: var(--ad-ui-encre);
               box-shadow: inset 0 -1px 0 var(--ad-ui-perle); }
.ad-msb__liens { display: flex; gap: 1.4em; color: var(--ad-ui-ardoise); font-weight: 500; margin-left: auto; white-space: nowrap; }
.ad-msb__btn { background: var(--ad-ui-sarcelle); color: var(--ad-ui-blanc); font-weight: 600; padding: .5em 1em; border-radius: .6em; white-space: nowrap; }
.ad-msb__nav .ad-msb__btn:only-of-type, .ad-cadre--recadre .ad-msb__btn { margin-left: auto; }
.ad-msb__hero { padding: 2em 1.8em 1.7em; display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 2em; align-items: end; border-bottom: 1px solid var(--ad-ui-perle); }
.ad-msb__hero > div:first-child { display: grid; gap: .7em; }
.ad-msb__hero b { font-size: 2.2em; line-height: 1.06; letter-spacing: -0.025em; font-weight: 650; }
.ad-msb__chap { color: var(--ad-ui-ardoise); font-size: 1.05em; max-width: 34em; }
.ad-msb__ctas { display: flex; align-items: center; gap: 1.2em; margin-top: .4em; }
.ad-msb__ctas .ad-ms__cta { margin: 0; }
.ad-msb__sec { color: var(--ad-ui-sarcelle); font-weight: 600; text-decoration: underline; text-underline-offset: .25em; white-space: nowrap; }
.ad-msb__cartes { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6em; }
.ad-msb__cartes div { background: var(--ad-ui-neige); border: 1px solid var(--ad-ui-perle); border-radius: .8em; padding: .9em; display: grid; }
.ad-msb__cartes b { font-size: 1.9em; line-height: 1.1; font-weight: 600; }
.ad-msb__cartes span { color: var(--ad-ui-graphite); font-size: .9em; }
.ad-msb__prog { padding: 1.3em 1.8em 1.6em; display: grid; gap: .8em; }
.ad-msb__jours { display: flex; gap: .5em; }
.ad-msb__jours span { padding: .4em .9em; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--ad-ui-perle); font-weight: 600; color: var(--ad-ui-ardoise); white-space: nowrap; }
.ad-msb__jours .is-actif { background: var(--ad-ui-sarcelle-pale); color: var(--ad-ui-sarcelle); box-shadow: none; }
.ad-msb__lignes { display: grid; }
.ad-msb__lignes div { display: grid; grid-template-columns: 4em minmax(0, 1fr) auto; gap: 1em; padding: .65em 0; border-top: 1px solid var(--ad-ui-perle); }
.ad-msb__lignes time { font-weight: 650; color: var(--ad-ui-sarcelle); }
.ad-msb__lignes b { font-weight: 600; }
.ad-msb__lignes span { color: var(--ad-ui-graphite); white-space: nowrap; }

/* Univers (son bleu reste dans ses écrans) */
.ad-un__haut { display: flex; align-items: center; gap: 1em; padding: .7em 1.2em; border-bottom: 1px solid var(--ad-ui-perle); }
.ad-un__marque { font-weight: 650; font-size: 1.25em; letter-spacing: -0.03em; color: var(--ad-ui-univers); white-space: nowrap; }
.ad-un__marque small { font-size: .7em; font-weight: 600; letter-spacing: .06em; color: var(--ad-ui-graphite); margin-left: .2em; }
.ad-un__espace { color: var(--ad-ui-graphite); font-weight: 500; white-space: nowrap; }
.ad-un__agent { margin-left: auto; display: inline-flex; gap: .4em; align-items: center; font-weight: 600; padding: .4em .8em; border-radius: .6em; box-shadow: inset 0 0 0 1px var(--ad-ui-filet-fort); }
.ad-un__app { display: grid; grid-template-columns: 12em 17.5em minmax(0, 1fr); }
.ad-un__app .ad-ui-side { padding-top: .9em; }
.ad-un__avenir em { font-style: normal; margin-left: auto; font-size: .875em; font-weight: 600; padding: .1em .5em; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--ad-ui-filet-fort); color: var(--ad-ui-graphite); }
.ad-un__liste { border-right: 1px solid var(--ad-ui-perle); padding: .9em .7em; display: grid; align-content: start; gap: .25em; background: var(--ad-ui-blanc); }
.ad-un__recherche { display: flex; gap: .5em; align-items: center; height: 2.6em; padding: 0 .8em; border-radius: .6em; box-shadow: inset 0 0 0 1px var(--ad-ui-filet-fort); color: var(--ad-ui-ardoise); margin-bottom: .5em; font-size: .95em; white-space: nowrap; }
.ad-un__org { padding: .6em .7em; border-radius: .6em; }
.ad-un__org b { display: block; font-weight: 600; line-height: 1.3; }
.ad-un__org span { color: var(--ad-ui-graphite); font-size: .9em; }
.ad-un__org.is-actif { background: var(--ad-ui-brume); }
.ad-un__fiche { padding: 1.1em 1.4em 1.3em; display: grid; gap: .95em; align-content: start; min-width: 0; }
.ad-un__qui { display: flex; gap: .8em; align-items: center; }
.ad-un__qui b { display: block; font-size: 1.35em; font-weight: 600; letter-spacing: -0.015em; }
.ad-un__qui span { color: var(--ad-ui-graphite); }
.ad-un__qui .ad-un__av { width: 3em; height: 3em; font-size: 1em; background: var(--ad-ui-univers-pale); color: var(--ad-ui-univers); }   /* a11y m6 */
.ad-un__infos { display: flex; flex-wrap: wrap; gap: .5em 1.6em; }
.ad-un__infos span { display: block; color: var(--ad-ui-graphite); font-size: .88em; }
.ad-un__infos b { font-weight: 550; }
.ad-un__echeance { display: flex; gap: .7em; align-items: center; padding: .7em .9em; border-radius: .7em; background: var(--ad-ui-ambre-pale); }
.ad-un__echeance .bi { color: var(--ad-ui-ambre); font-size: 1.2em; }
.ad-un__echeance b { display: block; font-weight: 600; }
.ad-un__echeance span { color: var(--ad-ui-ardoise); font-size: .9em; }
.ad-un__fil { display: grid; }
.ad-un__fil > div { display: grid; grid-template-columns: 2em minmax(0, 1fr) auto; gap: .6em; padding: .65em 0; border-bottom: 1px solid var(--ad-ui-perle); align-items: start; }
.ad-un__fil .bi { width: 2em; height: 2em; border-radius: 50%; display: grid; place-items: center; background: var(--ad-ui-brume); color: var(--ad-ui-ardoise); }
.ad-un__fil b { display: block; font-weight: 600; }
.ad-un__fil span { color: var(--ad-ui-graphite); font-size: .92em; }
.ad-un__fil time { color: var(--ad-ui-graphite); font-size: .9em; }
.ad-sans-side .ad-ui-app { grid-template-columns: minmax(0, 1fr); }
.ad-sans-side .ad-ui-side { display: none; }
.ad-sans-liste .ad-un__app { grid-template-columns: 12em minmax(0, 1fr); }
.ad-sans-liste .ad-un__liste { display: none; }

/* gestion financière : compte payeur, règlements, aperçu de facture (objet posé) */
.ad-gst { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 1.1em; align-items: start; }
.ad-gst__gauche { display: grid; gap: 1em; align-content: start; }
.ad-gst__kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ad-gst__kpis b { font-size: 1.4em; }
.ad-gst__pdf { background: var(--ad-ui-brume); border-radius: .8em; padding: .7em .9em 1.1em; display: grid; gap: .7em; }
.ad-gst__pdf-tete { display: flex; align-items: center; gap: .5em; font-weight: 600; color: var(--ad-ui-ardoise); font-size: .92em; }
.ad-gst__pdf-tete .bi { color: var(--ad-ui-ardoise); }
.ad-facture { background: var(--ad-ui-blanc); border-radius: .2em; padding: 1.3em 1.3em 1.4em; display: grid; gap: 1em; font-size: .875em;
              box-shadow: var(--ad-ombre-objet); }
.ad-facture__haut { display: flex; justify-content: space-between; align-items: start; gap: 1em; }
.ad-facture__haut > span:last-child { text-align: right; color: var(--ad-ui-graphite); line-height: 1.3; }
.ad-facture__haut > span:last-child b { color: var(--ad-ui-encre); font-weight: 600; }
.ad-facture__qui { display: grid; gap: .15em; }
.ad-facture__qui span:first-child { font-weight: 600; }
.ad-facture__qui span:last-child { color: var(--ad-ui-graphite); }
.ad-facture__lignes, .ad-facture__totaux { display: grid; gap: .45em; }
.ad-facture__lignes div, .ad-facture__totaux div { display: flex; justify-content: space-between; gap: 1em; }
.ad-facture__lignes { border-block: 1px solid var(--ad-ui-perle); padding-block: .7em; }
.ad-facture__lignes b, .ad-facture__totaux b { font-weight: 500; white-space: nowrap; }
.ad-facture__totaux span { color: var(--ad-ui-graphite); }
.ad-facture__totaux .is-total { padding-top: .45em; border-top: 1px solid var(--ad-ui-perle); }
.ad-facture__totaux .is-total span, .ad-facture__totaux .is-total b { color: var(--ad-ui-encre); font-weight: 600; }

/* inter-événements : les éditions successives d'un même événement */
.ad-dos { padding: 1.3em 1.5em 1.5em; }
.ad-dos__creer { height: 2.1em; font-size: .875em; color: var(--ad-ui-encre) !important; }
.ad-dos__liste { display: grid; }
.ad-dos__ligne { display: grid; grid-template-columns: 2.6em minmax(0, 1fr) auto auto; gap: .9em; align-items: center; padding: .8em 1em; border-bottom: 1px solid var(--ad-ui-perle); }
.ad-dos__ligne:last-child { border-bottom: 0; }
.ad-dos__ligne b { display: block; font-weight: 600; }
.ad-dos__ligne > div span { color: var(--ad-ui-graphite); font-size: .92em; }
.ad-dos__ligne em { font-style: normal; color: var(--ad-ui-encre); font-weight: 600; }
.ad-dos__vign { width: 2.6em; height: 2.6em; border-radius: .5em; background: var(--ad-ui-sarcelle); position: relative; }
.ad-dos__vign i { position: absolute; right: .45em; top: .45em; width: .8em; height: .8em; border-radius: 50%; background: var(--ad-ui-corail); }
.ad-dos__site { color: var(--ad-ui-ardoise); font-weight: 500; text-decoration: underline; text-decoration-color: var(--ad-ui-filet-fort); text-underline-offset: .2em; white-space: nowrap; }

@media (max-width: 640px) {
  .ad-cadre:not(.ad-cadre--recadre) :is(.ad-insc__corps, .ad-msb__hero, .ad-gst), .ad-cpt__corps { grid-template-columns: minmax(0, 1fr); }
  .ad-cadre:not(.ad-cadre--recadre) .ad-un__app { grid-template-columns: minmax(0, 1fr); }
  .ad-cadre:not(.ad-cadre--recadre) .ad-dos__ligne { grid-template-columns: 2.6em minmax(0, 1fr) auto; }
}

/* 4. Échelle bornée des cadres recadrés ---------------------------------------------
   Le corps suit la largeur du cadre entre deux bornes ; au-delà, c'est le cadrage qui change. */
:root {
  --ad-ui-corps-min: 12px;
  --ad-ui-corps-max: 13.5px;         /* la voix du produit réel (front211) est à 14 px */
  --ad-ui-corps-max-detail: 13px;
  --ad-ui-l-entier: 84;              /* largeurs de conception (em) : seuil bas ÷ 12 px */
  --ad-ui-l-large: 64;
  --ad-ui-l-moyen: 46;
  --ad-ui-l-detail: 25;
}
.ad-cadre.ad-cadre--recadre > .ad-ui {
  --ad-ui-l: var(--ad-ui-l-entier);
  font-size: clamp(var(--ad-ui-corps-min), 100cqw / var(--ad-ui-l), var(--ad-ui-corps-max));
}
@container ad-ecran (max-width: 1039.98px) { .ad-cadre.ad-cadre--recadre > .ad-ui { --ad-ui-l: var(--ad-ui-l-large); } }
@container ad-ecran (max-width: 779.98px)  { .ad-cadre.ad-cadre--recadre > .ad-ui { --ad-ui-l: var(--ad-ui-l-moyen); } }
@container ad-ecran (max-width: 559.98px)  { .ad-cadre.ad-cadre--recadre > .ad-ui { --ad-ui-l: var(--ad-ui-l-detail); --ad-ui-corps-max: var(--ad-ui-corps-max-detail); } }

/* 5. Cadrages : ce qui quitte le cadre, par priorité ---------------------------------
   Le menu et les colonnes passent en flex : un élément retiré libère sa place. */
.ad-cadre--recadre .ad-ui-app { display: flex; align-items: stretch; }
.ad-cadre.ad-cadre--recadre .ad-ui-side { display: grid; flex: none; width: 13.5em; }
.ad-cadre--recadre .ad-ui-main { flex: 1 1 0; }
.ad-cadre--recadre .ad-ui-bas { display: flex; align-items: flex-start; gap: .9em; }
.ad-cadre--recadre .ad-ui-bas > .ad-ui-carte { flex: 1 1 0; }
.ad-cadre--recadre .ad-ui-bas > .ad-ui-carte + .ad-ui-carte { flex: 0 0 14em; }
.ad-cadre--recadre .ad-un__app { display: flex; }
.ad-cadre--recadre .ad-un__app > .ad-ui-side { width: 12em; }
.ad-cadre--recadre .ad-un__liste { flex: 0 0 17.5em; }
.ad-cadre--recadre .ad-un__fiche { flex: 1 1 0; }

@container ad-ecran (max-width: 1039.98px) {
  .ad-cadre.ad-cadre--recadre .ad-ui .ad-ui-quitte-large { display: none !important; }
  /* menu en rail d'icônes (le geste de l'ouverture de l'accueil) */
  .ad-cadre.ad-cadre--recadre .ad-ui-side { width: 4.667em; padding: 1.1em .6em; justify-items: center; }
  .ad-cadre--recadre .ad-ui-side__marque { padding: .2em 0 1em; }
  .ad-cadre--recadre .ad-ui-side__marque span,
  .ad-cadre--recadre .ad-ui-side .ad-ui-item > span,
  .ad-cadre--recadre .ad-ui-side .ad-ui-item > em,
  .ad-cadre--recadre .ad-ui-side__titre { display: none; }
  .ad-cadre--recadre .ad-ui-side span.ad-ui-item { padding: .55em .6em; }
}
@container ad-ecran (max-width: 779.98px) {
  .ad-cadre.ad-cadre--recadre .ad-ui .ad-ui-quitte-moyen { display: none !important; }
  .ad-cadre--recadre .ad-ui-main { padding: 1.2em 1.25em 1.4em; }
  .ad-cadre--recadre .ad-gst { grid-template-columns: minmax(0, 1fr); }
  .ad-cadre--recadre .ad-msb__hero { grid-template-columns: minmax(0, 1fr); gap: 1.2em; }
  .ad-cadre--recadre .ad-insc__corps { gap: 1.2em; padding-inline: 1.25em; }
}

/* 6. Détail : la variante téléphone (même écran, même texte, autre mise en page) ----- */
@container ad-ecran (max-width: 559.98px) {
  .ad-cadre.ad-cadre--recadre .ad-ui .ad-ui-quitte-detail { display: none !important; }
  .ad-cadre--recadre .ad-cadre__chemin { display: none; }

  /* le menu devient une barre de produit : la marque et la rubrique active (m1) */
  .ad-cadre--recadre .ad-ui-app, .ad-cadre--recadre .ad-un__app { flex-direction: column; }
  .ad-cadre.ad-cadre--recadre .ad-ui-side { display: flex !important; flex-direction: row; align-items: center; gap: .6em;
                                             width: auto; padding: .55em .9em .55em 1em; border-right: 0;
                                             border-bottom: 1px solid var(--ad-ui-perle); justify-items: normal; }
  .ad-cadre.ad-cadre--recadre .ad-ui .ad-ui-side.ad-ui-quitte-moyen { display: flex !important; }
  .ad-cadre--recadre .ad-ui-side > :not(.ad-ui-side__marque):not(.is-actif) { display: none; }
  .ad-cadre--recadre .ad-ui-side__marque { padding: 0; font-size: 1em; }
  .ad-cadre--recadre .ad-ui-side__marque span { display: inline; }
  .ad-cadre--recadre .ad-ui-side span.ad-ui-item.is-actif { margin-left: auto; padding: .3em .7em; gap: .45em; }
  .ad-cadre--recadre .ad-ui-side .is-actif > span { display: inline; }
  .ad-cadre--recadre .ad-un__app > .ad-ui-side { width: auto; }
  /* Univers : la barre garde la rubrique active ET l'entrée « Affaires, à venir » (l'état réel) */
  .ad-cadre--recadre .ad-un__app > .ad-ui-side > .ad-un__avenir { display: flex; }
  .ad-cadre--recadre .ad-un__app > .ad-ui-side > .ad-un__avenir > span, .ad-cadre--recadre .ad-un__app > .ad-ui-side > .ad-un__avenir > em { display: inline; }
  .ad-cadre--recadre .ad-un__app > .ad-ui-side > .is-actif { margin-left: 0; }
  .ad-cadre--recadre .ad-un__app > .ad-ui-side > .ad-un__avenir { margin-left: auto; padding: .3em .2em; gap: .45em; }

  .ad-cadre--recadre .ad-ui-main { padding: 1em 1em 1.15em; gap: .9em; }
  .ad-cadre--recadre .ad-ui-h { font-size: 1.35em; }
  .ad-cadre--recadre .ad-ui-entete { gap: .7em; }
  .ad-cadre--recadre .ad-ui-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6em; }
  .ad-cadre--recadre .ad-ui-kpi { padding: .7em .8em; }
  .ad-cadre--recadre .ad-ui-kpi b { font-size: 1.55em; }
  .ad-cadre--recadre .ad-ui-bas { flex-direction: column; }
  .ad-cadre--recadre .ad-ui-bas > .ad-ui-carte { flex: none; width: 100%; }
  .ad-cadre--recadre .ad-ui-carte__tete { padding: .7em .9em; gap: .4em .8em; }
  .ad-cadre--recadre .ad-ui-table th, .ad-cadre--recadre .ad-ui-table td { padding-inline: .6em; }
  .ad-cadre--recadre .ad-ui-table th:first-child, .ad-cadre--recadre .ad-ui-table td:first-child { padding-left: .9em; }
  .ad-cadre--recadre .ad-ui-table th:last-child, .ad-cadre--recadre .ad-ui-table td:last-child { padding-right: .9em; }

  /* tableau empilé : chaque ligne devient une carte à deux niveaux */
  .ad-cadre--recadre .ad-ui-table--pile, .ad-cadre--recadre .ad-ui-table--pile tbody { display: block; }
  .ad-cadre--recadre .ad-ui-table--pile thead { display: none; }
  .ad-cadre--recadre .ad-ui-table--pile tr { display: grid; column-gap: .7em; row-gap: .2em; align-items: center;
                                             padding: .7em .9em; border-bottom: 1px solid var(--ad-ui-perle); }
  .ad-cadre--recadre .ad-ui-table--pile tr:last-child { border-bottom: 0; }
  .ad-cadre--recadre .ad-ui-table--pile td,
  .ad-cadre--recadre .ad-ui-table--pile td:first-child,
  .ad-cadre--recadre .ad-ui-table--pile td:last-child { padding: 0; border: 0; min-width: 0; }
  .ad-cadre--recadre .ad-ui-c-ident { display: contents; }
  .ad-cadre--recadre .ad-ui-c-ident br { display: none; }
  .ad-cadre--recadre .ad-ui-table--inscrits tr { grid-template-columns: 1.4em minmax(0, 1fr) auto;
                                             grid-template-areas: "etat nom regl" ". mail mail"; }
  .ad-cadre--recadre .ad-ui-c-etat { grid-area: etat; }
  .ad-cadre--recadre .ad-ui-c-ident .ad-ui-nom { grid-area: nom; min-width: 0; }
  .ad-cadre--recadre .ad-ui-c-ident .ad-ui-mail { grid-area: mail; min-width: 0; white-space: normal; }
  .ad-cadre--recadre .ad-ui-c-regl { grid-area: regl; justify-self: end; }
  .ad-cadre--recadre .ad-ui-table--cliqueurs tr { grid-template-columns: auto minmax(0, 1fr);
                                              grid-template-areas: "contact contact" "qualite signal"; }
  .ad-cadre--recadre .ad-ui-c-contact { grid-area: contact; font-weight: 600; white-space: normal; }
  .ad-cadre--recadre .ad-ui-c-qualite { grid-area: qualite; }
  .ad-cadre--recadre .ad-ui-c-signal { grid-area: signal; color: var(--ad-ui-graphite); white-space: normal; }

  /* gestion : les trois montants deviennent un relevé */
  .ad-cadre--recadre .ad-gst { gap: .9em; }
  .ad-cadre--recadre .ad-gst__kpis { grid-template-columns: minmax(0, 1fr); gap: 0; border: 1px solid var(--ad-ui-perle);
                                     border-radius: .8em; overflow: hidden; }
  .ad-cadre--recadre .ad-gst__kpis .ad-ui-kpi { display: flex; justify-content: space-between; align-items: baseline; gap: 1em;
                                               border: 0; border-radius: 0; padding: .7em .9em; }
  .ad-cadre--recadre .ad-gst__kpis .ad-ui-kpi + .ad-ui-kpi { border-top: 1px solid var(--ad-ui-perle); }
  .ad-cadre--recadre .ad-gst__kpis .ad-ui-kpi b { font-size: 1.15em; }
  .ad-cadre--recadre .ad-gst__reste { background: var(--ad-ui-neige); }
  .ad-cadre--recadre .ad-gst__table td { white-space: normal; }
  .ad-cadre--recadre .ad-gst__table td.is-num, .ad-cadre--recadre .ad-gst__table time { white-space: nowrap; }
  .ad-cadre--recadre .ad-gst__pdf { padding: .6em .7em .9em; }
  .ad-cadre--recadre .ad-facture { padding: 1.05em 1em 1.15em; gap: .85em; }

  /* Mail-ADNS : onglets serrés, répartition pleine largeur */
  .ad-cadre--recadre .ad-ui-onglets { gap: 1.2em; }
  .ad-cadre--recadre .ad-mail-repart { padding: .7em .9em .25em; }
  .ad-cadre--recadre .ad-mail-cles { flex-wrap: wrap; gap: .3em 1.2em; }

  /* inscription : les étapes passent sur deux lignes, le récapitulatif puis le règlement */
  .ad-cadre--recadre .ad-insc__tete { padding: .8em 1em; gap: .6em; flex-wrap: wrap; }
  .ad-cadre--recadre .ad-insc__etapes { padding: .75em 1em; gap: .5em .9em; flex-wrap: wrap; }
  .ad-cadre--recadre .ad-insc__corps { grid-template-columns: minmax(0, 1fr); padding: 1em 1em 1.2em; gap: 1em; }
  .ad-cadre--recadre .ad-insc__ligne { gap: .8em; }
  .ad-cadre--recadre .ad-insc__ligne div span { display: block; }

  /* mini-site sur ordinateur : l'en-tête garde le logo et le bouton, le programme s'empile */
  .ad-cadre--recadre .ad-msb__nav { padding: .8em 1em; gap: .8em; }
  .ad-cadre--recadre .ad-msb__hero { padding: 1.3em 1em 1.2em; }
  .ad-cadre--recadre .ad-msb__hero b { font-size: 1.75em; }
  .ad-cadre--recadre .ad-msb__ctas { flex-wrap: wrap; gap: .6em 1em; }
  .ad-cadre--recadre .ad-msb__prog { padding: 1em 1em 1.2em; }
  .ad-cadre--recadre .ad-msb__lignes div { grid-template-columns: 3.4em minmax(0, 1fr); row-gap: .1em; }
  .ad-cadre--recadre .ad-msb__lignes span { grid-column: 2; white-space: normal; }

  /* Univers : la fiche seule, sous la barre de produit */
  .ad-cadre--recadre .ad-un__haut { padding: .65em 1em; gap: .15em .6em; flex-wrap: wrap; }   /* l'espace passe à la ligne, jamais rogné */
  .ad-cadre--recadre .ad-un__fiche { padding: 1em 1em 1.15em; gap: .85em; }
  .ad-cadre--recadre .ad-un__infos { display: grid; gap: .5em; }
  .ad-cadre--recadre .ad-un__infos b { overflow-wrap: anywhere; }

  /* inter-événements : une édition par ligne, l'état à droite */
  .ad-cadre--recadre .ad-dos { padding: 1em 1em 1.15em; }
  .ad-cadre--recadre .ad-dos__ligne { grid-template-columns: 2.6em minmax(0, 1fr) auto; gap: .7em; padding: .75em .9em; }
}
@container ad-ecran (max-width: 299.98px) {
  .ad-cadre--recadre .ad-ui-main { padding: .85em .8em 1em; }
  .ad-cadre--recadre .ad-ui-table--pile tr { padding: .65em .75em; }
  .ad-cadre--recadre .ad-ui-kpi { padding: .6em .7em; }
  .ad-cadre--recadre .ad-ui-carte__tete { padding: .65em .75em; }
}
@container ad-ecran (max-width: 559.98px) {
  .ad-cadre--recadre .ad-cadre__chrome { height: 32px; padding: 0 10px; gap: 10px; }
  .ad-cadre--recadre .ad-cadre__feux { gap: 5px; }
  .ad-cadre--recadre .ad-cadre__feux i { width: 8px; height: 8px; }
  .ad-cadre--recadre .ad-cadre__url { height: 22px; font-size: 11px; }
}

/* 6 bis. La tablette du comptoir, recadrée : corps borné, colonnes empilées sous 560 px */
.ad-tablette--recadre .ad-tablette__ecran { --ad-ui-l: 64; font-size: clamp(12px, 100cqw / var(--ad-ui-l), 13.5px); }
@container ad-ecran (max-width: 779.98px) {
  .ad-tablette--recadre .ad-tablette__ecran { --ad-ui-l: 46; }
  .ad-tablette--recadre .ad-ui-quitte-moyen { display: none !important; }
}
@container ad-ecran (max-width: 559.98px) {
  .ad-tablette--recadre .ad-tablette__ecran { --ad-ui-l: 25; font-size: clamp(12px, 100cqw / 25, 13px); }
  .ad-tablette--recadre .ad-ui-quitte-detail { display: none !important; }
  .ad-tablette--recadre .ad-cpt__tete { flex-wrap: wrap; gap: .3em .8em; padding: .8em 1em; }
  .ad-tablette--recadre .ad-cpt__corps { grid-template-columns: minmax(0, 1fr); padding: .9em 1em 1em; }
  .ad-tablette--recadre .ad-cpt__qui { flex-wrap: wrap; }
  .ad-tablette--recadre .ad-cpt__qui .ad-ui-pill { margin-left: 3.6em; }
  .ad-tablette--recadre .ad-cpt__droite { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}
@container ad-ecran (max-width: 399.98px) {
  .ad-tablette--recadre .ad-cpt__droite { grid-template-columns: minmax(0, 1fr); }
}

/* 7. Sans requêtes de conteneur (iOS et iPadOS 15 et antérieurs) ---------------------
   Ni mise à l'échelle ni cadrage fin : corps fixe de 12 px, et sous 1 100 px de fenêtre tout
   ce qui est marqué « quitte » sort du cadre, menu compris. */
@supports not (container-type: inline-size) {
  .ad-cadre > .ad-ui, .ad-tablette .ad-tablette__ecran { font-size: 12px; }
  @media (max-width: 1100px) {
    .ad-cadre.ad-cadre--recadre .ad-ui .ad-ui-quitte-large,
    .ad-cadre.ad-cadre--recadre .ad-ui .ad-ui-quitte-moyen,
    .ad-cadre.ad-cadre--recadre .ad-ui .ad-ui-quitte-detail,
    .ad-cadre.ad-cadre--recadre .ad-ui-side { display: none !important; }
    .ad-cadre--recadre .ad-ui-bas, .ad-cadre--recadre .ad-gst, .ad-cadre--recadre .ad-insc__corps { display: grid; grid-template-columns: minmax(0, 1fr); }
    .ad-cadre--recadre .ad-ui-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
}