/* ─────────────────────────────────────────────────────────────────────
   Lecture PLEINE PAGE ("agrandir") — module partagé.
   Le JS injecte un bouton ⤢ dans le titre marqué [data-fs-title] et un ✕
   dans le conteneur [data-fs-wrap] ; un clic bascule [data-fs-wrap].is-fs.
   Bouton visible sur TACTILE (marche même en "site ordinateur") ; masqué desktop.
   ───────────────────────────────────────────────────────────────────── */

.fs-open-btn, .fs-close-btn { display: none; }

/* Bouton ⤢ inline dans le titre — appareils tactiles (ou petit écran). */
@media (hover: none) and (pointer: coarse), (max-width: 768px) {
  [data-fs-title] .fs-open-btn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px; margin-right: 8px; padding: 0; vertical-align: middle;
    border-radius: 8px; border: 1px solid #C99A4E; background: rgba(248, 240, 222, .9);
    color: #4A3B26; font-size: 17px; line-height: 1; cursor: pointer;
    box-shadow: 0 1px 4px rgba(58, 42, 26, .25);
  }
}

body.fs-locked { overflow: hidden !important; }
/* Le temps de la lecture, on hisse .shell au-dessus de Puzzy (z-30) — sans déplacer le DOM,
   donc les styles du texte sont conservés ; le calque couvre alors tout l'écran. */
body.fs-locked .shell { z-index: 10001 !important; }

/* Le conteneur devient un calque plein écran opaque (parchemin), déroulant.
   Non conditionné à un média : .is-fs n'est ajouté que par le bouton (tactile). */
[data-fs-wrap].is-fs {
  position: fixed; inset: 0; z-index: 10000; background: #F5EDD5;
  overflow-y: auto; -webkit-overflow-scrolling: touch;
  display: block !important; align-items: initial !important; justify-content: initial !important;
  padding: 56px 14px calc(18px + env(safe-area-inset-bottom, 0px));
}
[data-fs-wrap].is-fs .fs-close-btn {
  display: inline-flex; align-items: center; justify-content: center;
  position: fixed; top: 12px; right: 14px; z-index: 10002;
  width: 40px; height: 40px; padding: 0;
  border-radius: 8px; border: 1px solid #C99A4E; background: rgba(248, 240, 222, .94);
  color: #4A3B26; font-size: 18px; line-height: 1; cursor: pointer;
  box-shadow: 0 2px 8px rgba(58, 42, 26, .35);
}
[data-fs-wrap].is-fs [data-fs-title] .fs-open-btn { display: none; }

/* Onglets éventuels (période) : collés en haut du calque, sous le ✕. */
[data-fs-wrap].is-fs .dlg-tabs,
[data-fs-wrap].is-fs .energies-tabs {
  position: sticky; top: 0; z-index: 2; background: #F5EDD5;
  padding: 6px 0; margin: 0 0 8px;
}

/* Le bloc de contenu prend toute la largeur, sans cadre ni hauteur fixe. */
[data-fs-wrap].is-fs .cm-page { display: block !important; min-height: 0 !important; }
[data-fs-wrap].is-fs .panel {
  max-width: none !important; width: 100% !important; height: auto !important; max-height: none !important;
  background: transparent !important; box-shadow: none !important; border: none !important;
  transform: none !important; overflow: visible !important;
}