/* agenda-barre.css — le planning PLEIN ÉCRAN, quasi-copie de Google Agenda (spec 2026-10-15-planning-agenda-refonte-design § 11.1, piste cc/plein-coque) : la couche plein écran,
   la barre du haut (56 px au téléphone, 64 px à l'ordinateur), le panneau gauche (256 px), le mini-calendrier déroulé sous le titre, le tiroir ≡, le bouton rond + (FAB) et les menus.
   Préfixe ag-b-. Couleurs, rayons, ombres et durées : jetons de css/tokens.css et css/agenda-mouvement.css seulement. Mouvement : transform + opacity, ≤ 320 ms.
   Téléphone (< 900 px) : `.ag-b-tel` seulement ; ordinateur (≥ 900 px) : `.ag-b-pc` seulement (js/planning/barre.js). */

/* ---------- La couche plein écran : posée par js/planning/page.js (html[data-agenda-plein]) sur le planning d'un séjour ----------
   La coque (barre haute, colonne de gauche, barre du bas, tête de page) se tait, le document ne défile plus ; la racine du planning couvre l'écran
   (z-index 100 : la coque est à 55, les aperçus .ag-a à 190, les voiles de feuille à 200, les messages à 2000). */
html[data-agenda-plein], html[data-agenda-plein] body { overflow: hidden; overscroll-behavior: none; }
html[data-agenda-plein] :is(.f-top, .f-sidebar, .f-bottom, [data-fil-bottom], [data-tete-page], .nav-bas) { display: none !important; }
html[data-agenda-plein] .fp[data-fp-page] {
  position: fixed; inset: 0; z-index: 100; display: flex; flex-direction: column; width: auto; max-width: none; margin: 0;
  padding: env(safe-area-inset-top, 0px) env(safe-area-inset-right, 0px) 0 env(safe-area-inset-left, 0px); background: var(--ag-toile); color: var(--texte);
  --ag-toile: var(--toile); --s2: var(--toile-survol);   /* la toile de Google Agenda (blanc presque pur, ardoise en sombre) : les aplats des familles ressortent ; les survols et les fonds neutres prennent le cran au-dessus. Le fond de page --bg-0 n'est pas redéfini (tests/uniformite) : les surfaces du planning lisent --ag-toile */
}
html[data-agenda-plein] :is(.ag-a, .ag-b-tiroir, .ag-b-pop, .ag-b-feuille) { --ag-toile: var(--toile); --s2: var(--toile-survol); }   /* les couches posées hors de la racine (aperçu, tiroir, menus) gardent la même toile */
html[data-agenda-plein] .fp[data-fp-page] > .ag-b { flex: none; }
.ag-b-corps { display: flex; flex: 1 1 0; min-width: 0; min-height: 0; }
.ag-b-principal { position: relative; display: flex; flex: 1 1 0; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; }
.ag-b-principal > .ag-b-vue { flex: 1 1 0; min-height: 0; overflow: auto; overscroll-behavior: contain; }
/* Au téléphone, le message « Annuler » se pose au-dessus du bouton rond + (le snackbar de Google pousse le FAB) */
@media (max-width: 899px) { html[data-agenda-plein] { --ag-toast-bas: 88px; } }
/* Élévations de Material 3 (niveaux 1 et 3) tirées de l'encre du thème, comme la bulle de l'aperçu (css/agenda-apercu.css) : Le Fil remplace les ombres par des filets, le bouton rond + et
   « Créer » gardent leur relief de Google */
:root { --ag-b-ombre-1: 0 1px 2px color-mix(in srgb, var(--f-encre) 18%, transparent), 0 1px 3px 1px color-mix(in srgb, var(--f-encre) 10%, transparent);
  --ag-b-ombre-3: 0 1px 3px color-mix(in srgb, var(--f-encre) 18%, transparent), 0 6px 14px 2px color-mix(in srgb, var(--f-encre) 14%, transparent); }

/* ---------- La barre du haut ---------- */
.ag-b {
  position: relative; display: flex; flex-wrap: nowrap; align-items: center; gap: 4px; min-width: 0; height: 64px; margin: 0; padding: 0 12px 0 8px;
  background: var(--ag-toile); color: var(--texte); font: 500 14px/1 Inter, system-ui, sans-serif; font-variant-numeric: tabular-nums;
}
.ag-b *, .ag-b *::before, .ag-b *::after, .ag-b-panneau *, .ag-b-deroule *, .ag-b-tiroir *, .ag-b-fab { box-sizing: border-box; }
.ag-b [hidden], .ag-b-pop [hidden], .ag-b-feuille [hidden], .ag-b-panneau[hidden], .ag-b-panneau [hidden], .ag-b-deroule[hidden], .ag-b-tiroir [hidden], .ag-b-fab[hidden] { display: none !important; }
.ag-b-ico { display: inline-flex; flex: none; align-items: center; justify-content: center; line-height: 0; }
.ag-b-ico svg { display: block; }
@media (max-width: 899px) { .ag-b-pc, .ag-b-panneau { display: none !important; } }
@media (min-width: 900px) { .ag-b-tel, .ag-b-deroule { display: none !important; } }

/* Boutons : pastilles à contour (Aujourd'hui, la vue) et boutons ronds (≡, ‹ ›, 🔍, ⋯) à la Material 3 ; survol, focus et pressé visibles */
.ag-b-btn {
  position: relative; display: inline-flex; flex: none; align-items: center; justify-content: center; gap: 6px; height: 40px; min-width: 40px; margin: 0; padding: 0 16px;
  border: 1px solid var(--ligne-2); border-radius: 20px; background: transparent; color: var(--texte); font: inherit; font-weight: 500; line-height: 1;
  white-space: nowrap; cursor: pointer; -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
.ag-b-btn:hover:not(:disabled) { background: var(--s2); }
.ag-b-btn:active:not(:disabled) { background: var(--s3); }
.ag-b-btn:disabled { color: var(--texte-3); cursor: default; }
.ag-b-btn:focus-visible, .ag-b-item:focus-visible, .ag-b-titre:focus-visible, .ag-b-creer:focus-visible, .ag-b-fab:focus-visible, .ag-b-r:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.ag-b-item:focus-visible, .ag-b-r:focus-visible { outline-offset: -2px; }
.ag-b-rond { width: 44px; height: 44px; min-width: 44px; padding: 0; border-color: transparent; border-radius: 50%; color: var(--texte-2); }
.ag-b-rond:hover:not(:disabled) { color: var(--texte); }
.ag-b-nav:disabled { opacity: .45; }
@media (pointer: coarse) { .ag-b-btn { height: 44px; border-radius: 22px; } }

/* ≡ et le point d'attention (filtre actif, ◌ N ou « Publier » repliés) */
.ag-b-menu-nav { color: var(--texte-2); }
.ag-b-point { position: absolute; top: 8px; right: 8px; width: 10px; height: 10px; border: 2px solid var(--ag-toile); border-radius: 5px; background: var(--accent); }

/* « ← <séjour> » : la place du logo de Google ; le nom se tait quand la barre est serrée */
.ag-b-retour { gap: 8px; max-width: 30ch; padding: 0 14px 0 10px; border-color: transparent; color: var(--texte-2); font-size: 16px; }
.ag-b-retour:hover:not(:disabled) { color: var(--texte); }
.ag-b-retour-nom { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--texte); }
.ag-b > .ag-b-auj { margin-left: 8px; }
.ag-b-auj[data-actuel="oui"] { color: var(--texte-2); }

/* Période (ordinateur) : Google Agenda web, 22 px régulier */
.ag-b-periode { flex: 0 1 auto; min-width: 0; margin: 0 0 0 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 400 22px/1.2 Inter, system-ui, sans-serif; color: var(--texte); }
.ag-b-periode-court { display: none; }
.ag-b-espace { flex: 1 1 auto; min-width: 0; }

/* Titre « Octobre ▾ » (téléphone) : il déroule le mini-calendrier sous la barre */
.ag-b-titre {
  display: inline-flex; flex: 0 1 auto; align-items: center; gap: 2px; min-width: 0; height: 44px; margin: 0 0 0 2px; padding: 0 6px 0 10px; border: 0; border-radius: 22px;
  background: transparent; color: var(--texte); font: 400 22px/1 Inter, system-ui, sans-serif; cursor: pointer; -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
.ag-b-titre:hover { background: var(--s2); }
.ag-b-titre:active { background: var(--s3); }
.ag-b-titre-texte { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ag-b-titre-chevron { color: var(--texte-2); transition: transform var(--m-d-base, 180ms) var(--m-out, ease-out); }
.ag-b--deroule .ag-b-titre-chevron { transform: rotate(180deg); }

/* Pastille du jour (téléphone) : le numéro d'aujourd'hui écrit dans le calendrier */
.ag-b-jour { color: var(--texte-2); }
.ag-b-jour-n { position: absolute; top: 20px; left: 0; right: 0; color: var(--texte); font: 700 10px/10px Inter, system-ui, sans-serif; text-align: center; pointer-events: none; }

/* Pastille « Brouillon · Publier » : l'ambre SIGNALE (le planning n'est pas encore publié), il ne décore pas ; « Publier » est l'action */
.ag-b-publier { padding: 0 14px 0 10px; border-color: var(--alerte-filet); background: var(--alerte-fond); }
.ag-b-publier:hover:not(:disabled) { background: var(--alerte-fond); border-color: var(--alerte); }
.ag-b-publier-brouillon { color: var(--texte-2); }
.ag-b-publier-sep { color: var(--texte-3); }
.ag-b-publier-mot { font-weight: 700; }
.ag-b-etat, .ag-b-hors { display: inline-flex; flex: none; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border-radius: 16px; color: var(--texte-2); font-weight: 500; }
.ag-b-etat { border: 1px dashed var(--ligne-2); }
.ag-b-hors { border: 1px solid var(--alerte-filet); background: var(--alerte-fond); color: var(--texte); }

/* ◌ N : le cercle en pointillés est la forme d'une proposition dans la grille ; le nombre dit combien attendent */
.ag-b-prop { gap: 4px; padding: 0 12px 0 10px; }
.ag-b-prop-n { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; padding: 0 6px; border: 1px solid var(--alerte-filet); border-radius: 11px; background: var(--alerte-fond); font-weight: 700; font-size: 13px; }

/* [Semaine ▾] */
.ag-b-quand { padding: 0 10px 0 16px; }
.ag-b-quand .ag-b-ico { color: var(--texte-2); }
.ag-b-quand[aria-expanded="true"], .ag-b-plus[aria-expanded="true"] { background: var(--s2); }

/* ---------- Paliers : UNE ligne à toute largeur (barre.js, ajuster) ----------
   1 « Publier » sans « Brouillon » · 2 « ← » sans le nom du séjour · 3 la période sans l'année · 4 ◌ N dans ⋯ / ≡ · 5 « Publier » dans ⋯ / ≡ · 6 « Aujourd'hui » se tait. */
.ag-b--s1 .ag-b-publier-brouillon, .ag-b--s1 .ag-b-publier-sep { display: none; }
.ag-b--s2 .ag-b-retour-nom { display: none; }
.ag-b--s2 .ag-b-retour { padding: 0; width: 44px; justify-content: center; border-radius: 50%; }
.ag-b--s3 .ag-b-periode-long { display: none; }
.ag-b--s3 .ag-b-periode-court { display: inline; }
.ag-b--s4 .ag-b-prop { display: none; }
.ag-b--s5 .ag-b-publier { display: none; }
.ag-b--s6 .ag-b-auj { display: none; }

/* ---------- Téléphone : 56 px ---------- */
@media (max-width: 899px) {
  .ag-b { gap: 0; height: 56px; padding: 0 4px; }
  .ag-b-menu-nav { width: 48px; height: 48px; min-width: 48px; }
  .ag-b-publier { gap: 6px; padding: 0 12px 0 10px; }
  .ag-b-publier-brouillon, .ag-b-publier-sep { display: none; }
  .ag-b-prop { padding: 0 8px 0 6px; }
  .ag-b-hors { width: 40px; padding: 0; justify-content: center; }
  .ag-b-hors-mot { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}
@media (max-width: 399px) { .ag-b-publier .ag-b-ico { display: none; } }

/* ---------- Panneau gauche (ordinateur, 256 px) : [+ Créer] · mini-calendrier · Qui ---------- */
.ag-b-panneau { display: flex; flex: none; flex-direction: column; gap: 16px; width: 256px; min-height: 0; padding: 8px 16px 24px; overflow-y: auto; overscroll-behavior: contain; background: var(--ag-toile); color: var(--texte); }
.ag-b-creer {
  display: inline-flex; align-self: flex-start; align-items: center; gap: 12px; height: 56px; margin: 0; padding: 0 24px 0 16px; border: 0; border-radius: 28px;
  background: var(--s1); color: var(--texte); box-shadow: var(--ag-b-ombre-1); font: 500 15px/1 Inter, system-ui, sans-serif; cursor: pointer;
  -webkit-tap-highlight-color: transparent; transition: transform var(--m-d-press, 60ms) var(--m-out, ease-out);
}
.ag-b-creer .ag-b-ico { color: var(--accent); }
.ag-b-creer:hover:not(:disabled) { background: var(--s2); box-shadow: var(--ag-b-ombre-3); }
.ag-b-creer:active:not(:disabled) { transform: scale(.98); }
.ag-b-creer:disabled { color: var(--texte-3); box-shadow: none; cursor: default; }
.ag-b-creer:disabled .ag-b-ico { color: var(--texte-3); }

/* ---------- Rangées de choix (panneau et tiroir) : la liste des agendas et le tiroir de Google ---------- */
.ag-b-g { display: flex; flex-direction: column; min-width: 0; }
.ag-b-g-lib { padding: 8px 16px 4px; color: var(--texte-2); font: 600 14px/1.3 Inter, system-ui, sans-serif; }
.ag-b-r {
  display: flex; align-items: center; gap: 14px; width: 100%; min-height: 44px; margin: 0; padding: 0 16px; border: 0; border-radius: 22px; background: transparent;
  color: var(--texte); font: 500 14px/1.3 Inter, system-ui, sans-serif; text-align: left; cursor: pointer; -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
.ag-b-r:hover:not(:disabled) { background: var(--s2); }
.ag-b-r:active:not(:disabled) { background: var(--s3); }
.ag-b-r[aria-checked="true"] { background: var(--accent-fond); }
.ag-b-r:disabled { color: var(--texte-3); cursor: default; }
.ag-b-r-ico { display: inline-flex; flex: none; color: var(--texte-2); }
.ag-b-r-ico svg { display: block; }
.ag-b-r[aria-checked="true"] .ag-b-r-ico { color: var(--accent); }
.ag-b-r-pastille { flex: none; width: 18px; height: 18px; border: 2px solid var(--ag-b-r-c); border-radius: 50%; }
.ag-b-r[aria-checked="true"] .ag-b-r-pastille { background: var(--ag-b-r-c); box-shadow: inset 0 0 0 3px var(--accent-fond); }
.ag-b-r-lib { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ag-b-r-aide { flex: none; min-width: 22px; padding: 2px 6px; border: 1px solid var(--ligne-2); border-radius: 6px; color: var(--texte-2); font: 500 12px/1.2 Inter, system-ui, sans-serif; text-align: center; }
.ag-b-r-n { flex: none; min-width: 22px; padding: 1px 7px; border-radius: 11px; background: var(--accent); color: var(--sur-accent); font: 700 12px/1.5 Inter, system-ui, sans-serif; text-align: center; }
@media (pointer: coarse) { .ag-b-r-aide { display: none; } }

/* ---------- Mini-calendrier déroulé sous le titre (téléphone) : il pousse la grille ---------- */
.ag-b-deroule { position: relative; z-index: 2; flex: none; background: var(--ag-toile); }   /* le mini-calendrier (forme 'tiroir') porte sa pleine largeur, son fond et son filet bas */
.ag-b-panneau .ag-b-g { margin: 0 -8px; }   /* le mini-calendrier (forme 'panneau', 224 px) tient avec 16 px de marge ; la liste « Qui » reprend 8 px de chaque côté */

/* ---------- Tiroir ≡ (téléphone) : navigation drawer modale de Material 3 ---------- */
.ag-b-t-voile { position: fixed; inset: 0; z-index: 150; background: var(--voile-modal); opacity: 0; transition: opacity var(--m-d-slow, 280ms) var(--m-out, ease-out); }
.ag-b-tiroir {
  position: fixed; top: 0; bottom: 0; left: 0; z-index: 151; display: flex; flex-direction: column; width: min(320px, 86vw); max-width: 320px;
  padding: env(safe-area-inset-top, 0px) 0 env(safe-area-inset-bottom, 0px) env(safe-area-inset-left, 0px); border-radius: 0 16px 16px 0;
  background: var(--s1); color: var(--texte); box-shadow: var(--ag-b-ombre-1); outline: none; transform: translateX(-100%);
  transition: transform var(--m-d-slow, 280ms) var(--m-out, ease-out); font: 400 16px/1.4 Inter, system-ui, sans-serif;
}
.ag-b-tiroir.ag-b-t--ouvert { transform: none; }
.ag-b-t-voile.ag-b-t--ouvert { opacity: 1; }
.ag-b-tiroir.ag-b-t--sortie, .ag-b-t-voile.ag-b-t--sortie { transition-duration: var(--m-d-base, 180ms); transition-timing-function: var(--m-in, ease-in); }
.ag-b-t-tete { flex: none; padding: 20px 28px 12px; }
.ag-b-t-titre { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--texte); font: 500 20px/1.3 Inter, system-ui, sans-serif; }
.ag-b-t-corps { flex: 1 1 auto; min-height: 0; padding: 0 12px 8px; overflow-y: auto; overscroll-behavior: contain; }
.ag-b-t-sep { height: 1px; margin: 8px 16px; background: var(--ligne); }
.ag-b-t-pied { flex: none; padding: 8px 12px 12px; border-top: 1px solid var(--ligne); }
.ag-b-tiroir .ag-b-r { min-height: 48px; border-radius: 24px; }
.ag-b-tiroir .ag-b-g-lib { padding: 12px 16px 4px; }
.ag-b-t-retour { color: var(--texte); font-weight: 600; }

/* ---------- Bouton rond + (FAB, téléphone) : en bas à droite, ombre de niveau 3 ---------- */
.ag-b-fab {
  position: fixed; right: calc(16px + env(safe-area-inset-right, 0px)); bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 5;
  display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; margin: 0; padding: 0; border: 0; border-radius: 16px;
  background: var(--s1); color: var(--accent); box-shadow: var(--ag-b-ombre-3); cursor: pointer;
  -webkit-tap-highlight-color: transparent; touch-action: manipulation; transition: transform var(--m-d-press, 60ms) var(--m-out, ease-out);
}
.ag-b-fab:hover { background: var(--s2); }
.ag-b-fab:active { transform: scale(.95); }

/* ---------- Menus : popover à l'ordinateur, feuille si l'écran rétrécit ---------- */
.ag-b-pop {
  position: absolute; z-index: 60; min-width: 230px; max-width: min(340px, 92vw); max-height: min(70vh, 560px); overflow: auto; padding: 6px;
  border: 1px solid var(--ligne-2); border-radius: 12px; background: var(--s1); color: var(--texte); box-shadow: var(--shadow-elevated);
  animation: ag-b-pop var(--m-d-fast, 120ms) var(--m-out, ease-out) backwards;
}
.ag-b-liste { display: flex; flex-direction: column; min-width: 0; }
.ag-b-groupe { display: flex; flex-direction: column; }
.ag-b-groupe-lib { padding: 8px 12px 2px; color: var(--texte-3); font: 600 12px/1.2 Inter, system-ui, sans-serif; letter-spacing: .02em; text-transform: uppercase; }
.ag-b-sep-menu { height: 1px; margin: 6px 4px; background: var(--ligne); }
.ag-b-item {
  display: flex; align-items: center; gap: 8px; width: 100%; min-height: 40px; margin: 0; padding: 0 12px 0 8px; border: 0; border-radius: 8px; background: transparent;
  color: var(--texte); font: 500 14px/1.25 Inter, system-ui, sans-serif; text-align: left; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.ag-b-item:hover:not(:disabled), .ag-b-item:focus-visible { background: var(--s2); }
.ag-b-item:disabled { color: var(--texte-3); cursor: default; }
.ag-b-item-coche { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 18px; height: 18px; color: var(--accent); }
.ag-b-item-coche svg { display: block; }
.ag-b-item-lib { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; hyphens: none; }
.ag-b-item-aide { flex: none; min-width: 22px; padding: 2px 6px; border: 1px solid var(--ligne-2); border-radius: 6px; color: var(--texte-2); font: 500 12px/1.2 Inter, system-ui, sans-serif; text-align: center; }
.ag-b-item-n { flex: none; min-width: 20px; padding: 1px 6px; border-radius: 10px; background: var(--accent); color: var(--sur-accent); font: 700 12px/1.4 Inter, system-ui, sans-serif; text-align: center; }
.ag-b-liste--feuille .ag-b-item { min-height: 48px; padding: 0 12px; font-size: 16px; }
.ag-b-liste--feuille .ag-b-item-coche { width: 22px; height: 22px; }
.ag-b-liste--feuille .ag-b-item-aide { display: none; }
@keyframes ag-b-pop { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

/* Aide clavier (feuille) : un raccourci par ligne */
.ag-b-aide { display: grid; grid-template-columns: max-content 1fr; gap: 8px 14px; margin: 0; align-items: center; }
.ag-b-aide dt { display: flex; gap: 4px; margin: 0; }
.ag-b-aide dd { margin: 0; color: var(--texte); overflow-wrap: anywhere; hyphens: none; }
.ag-b-aide kbd { min-width: 28px; padding: 3px 8px; border: 1px solid var(--ligne-2); border-radius: 6px; background: var(--s2); color: var(--texte); font: 600 13px/1.2 Inter, system-ui, sans-serif; text-align: center; }

/* ---------- Changement de période : la vue glisse de côté (View Transitions, transform + opacity, 280 ms en sobre) ----------
   `view-transition-name: ag-vue` est posé sur `.fp-vue` par css/fil-planning.css, le temps de la transition seulement (html[data-ag-sens]). */
html[data-ag-sens]::view-transition-group(ag-vue) { animation: none; }
html[data-ag-sens]::view-transition-old(ag-vue), html[data-ag-sens]::view-transition-new(ag-vue) { mix-blend-mode: normal; animation-duration: var(--m-d-vue, 280ms); animation-timing-function: var(--m-out, cubic-bezier(.2, 0, 0, 1)); animation-fill-mode: both; }
html[data-ag-sens="suivant"]::view-transition-old(ag-vue) { animation-name: ag-b-sort-gauche; }
html[data-ag-sens="suivant"]::view-transition-new(ag-vue) { animation-name: ag-b-entre-droite; }
html[data-ag-sens="precedent"]::view-transition-old(ag-vue) { animation-name: ag-b-sort-droite; }
html[data-ag-sens="precedent"]::view-transition-new(ag-vue) { animation-name: ag-b-entre-gauche; }
@keyframes ag-b-sort-gauche { to { opacity: 0; transform: translateX(-28px); } }
@keyframes ag-b-sort-droite { to { opacity: 0; transform: translateX(28px); } }
@keyframes ag-b-entre-droite { from { opacity: 0; transform: translateX(28px); } }
@keyframes ag-b-entre-gauche { from { opacity: 0; transform: translateX(-28px); } }
/* Mouvement réduit : des fondus seulement */
@media (prefers-reduced-motion: reduce) {
  html[data-ag-sens]::view-transition-old(ag-vue) { animation-name: ag-b-fondu-sortie; }
  html[data-ag-sens]::view-transition-new(ag-vue) { animation-name: ag-b-fondu-entree; }
  .ag-b-pop { animation: none; }
  .ag-b-tiroir { opacity: 0; transform: none; transition: opacity var(--m-d-fast, 120ms) linear; }
  .ag-b-tiroir.ag-b-t--ouvert { opacity: 1; }
  .ag-b-titre-chevron, .ag-b-fab, .ag-b-creer { transition: none; }
}
html[data-mouvement-reduit][data-ag-sens]::view-transition-old(ag-vue) { animation-name: ag-b-fondu-sortie; }
html[data-mouvement-reduit][data-ag-sens]::view-transition-new(ag-vue) { animation-name: ag-b-fondu-entree; }
html[data-mouvement-reduit] .ag-b-tiroir { opacity: 0; transform: none; transition: opacity var(--m-d-fast, 120ms) linear; }
html[data-mouvement-reduit] .ag-b-tiroir.ag-b-t--ouvert { opacity: 1; }
@keyframes ag-b-fondu-sortie { to { opacity: 0; } }
@keyframes ag-b-fondu-entree { from { opacity: 0; } }

@media print { .ag-b, .ag-b-panneau, .ag-b-fab, .ag-b-deroule { display: none !important; } }

/* ---------- Mentions : la source de la météo (attribution due) en pied du panneau gauche et du tiroir, comme les mentions de Google Agenda ; plus rien ne flotte sur la grille ---------- */
html[data-agenda-plein] .fme-source--pied { display: none; }
.ag-b-panneau-pied { margin-top: auto; padding-top: 8px; }
.ag-b-panneau-pied:empty { display: none; }
.ag-b-source { margin: 0; color: var(--texte-2); font: 400 12px/1.4 Inter, system-ui, sans-serif; }
.ag-b-source a { color: inherit; text-underline-offset: 2px; }
.ag-b-t-pied .ag-b-source { padding: 8px 16px 12px 56px; }