@media screen {


  .print {
    display: none;
  }




  /* Tags cliquables dans l'en-tête de chapitre */
  .chap-tags a {
    color: currentColor;
  }


  /* -----------------------------------------------------------------------
     FENÊTRES FLOTTANTES — figures des blocs image / imagefloat
     Largeur + décalages aléatoires posés par chapter.js via les variables
     --fig-* ; valeurs de repli par orientation si le JS ne tourne pas.
     Les images peuvent déborder à gauche / à droite de la colonne de texte.
     ----------------------------------------------------------------------- */

  /* les figures débordent dans les gouttières, et les panneaux fixes
     (sidebar fermée, etc.) peuvent peindre hors viewport : on évite
     l'apparition d'une barre de défilement horizontale. Sur `body` seul,
     un descendant `position:fixed` peut quand même élargir le scroll du
     document — il faut aussi le poser sur `html`. */
  html, body {
    overflow-x: hidden;
  }

  .chapter-content figure img,
  .chapter-content figure picture {
    display: block;
    width: 100%;
    height: auto;
  }

  .chapter-content .block-type-image > figure:not(.image-spread),
  .chapter-content .block-type-imagefloat > figure,
  .chapter-content .block-type-gallery .gallery > figure {
    width: var(--fig-w, 84%);
    max-width: min(114%, calc(100vw - var(--baseline) * 2));
    margin-left: var(--fig-shift-x, 0px);
    margin-top: var(--fig-shift-y, 0px);
    z-index: var(--fig-z, 1);
  }

  .chapter-content .block-type-image > figure[data-orientation="portrait"],
  .chapter-content .block-type-imagefloat > figure[data-orientation="portrait"],
  .chapter-content .block-type-gallery .gallery > figure.portrait {
    --fig-w: 44%;
  }

  .chapter-content .block-type-image > figure[data-orientation="square"],
  .chapter-content .block-type-imagefloat > figure[data-orientation="square"],
  .chapter-content .block-type-gallery .gallery > figure.square {
    --fig-w: 58%;
  }

  /* -----------------------------------------------------------------------
     LIGHTBOX — l'<a> injecté autour de l'image (voir lightbox.js)
     ----------------------------------------------------------------------- */
  .chapter-content figure a.glightbox {
    display: block;
    line-height: 0;
    border: none;
    cursor: zoom-in;
  }

}

/* ---- Responsive ---- */

@media only screen and (max-width: 47.9em) {

  /* L'effet « fenêtres éparpillées » (largeur et décalage aléatoires posés
     par chapter.js) suppose une gouttière disponible de part et d'autre de la
     colonne de texte. Sur mobile il n'y en a pas : on repasse en pleine
     largeur, sagement empilé. */
  .chapter-content .block-type-image > figure:not(.image-spread),
  .chapter-content .block-type-imagefloat > figure,
  .chapter-content .block-type-gallery .gallery > figure {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-top: 0;
  }

  /* Carte de l'index : pas assez de place pour disperser les nœuds en 2D,
     index-map.js ne tourne pas sous ce seuil (voir sa media query) —
     on repasse en liste empilée : chaque terme suivi de ses hash, dans
     l'ordre où le PHP les a rendus. */
  #index-map {
    height: auto !important;
  }

  .map-lines {
    display: none;
  }

  .map-node {
    position: static;
    transform: none;
    cursor: auto;
  }

  .map-node--term {
    margin-top: calc(var(--baseline) * 1.2);
    margin-bottom: calc(var(--baseline) * 0.3);
    cursor: pointer;
  }

  .map-node--term:first-child {
    margin-top: 0;
  }

  .map-node--ref {
    display: inline-block;
    margin: 0 calc(var(--baseline) * 0.25) calc(var(--baseline) * 0.25) 0;
  }

  /* Carte de l'index : l'aside prend toute la largeur sur mobile. */
  .map-aside {
    width: 100%;
    padding: 100px var(--padding-inline-page) 60px;
  }

}