/* ============================================================================
   Booky — LES SEPT MODÈLES DE LA DOUBLE PAGE
   Créé le 14/08/2026 au soir. Même chantier et même méthode que cartes.css :
   les dessins sont les SIENS, faits dans Canva d'après ses vrais livrets ; ce
   fichier ne fait que les retranscrire, un modèle à la fois, quatre faces
   chacun.

   SEPT MODÈLES : m1 m2 m3 m4 m5 m7 m8. m6 « Le Hublot » est supprimé (dicté),
   sur la double page ET sur la carte d'accueil ; sa clé ne se réutilise
   jamais, et on ne renumérote pas.

   LA RÈGLE QUI COMMANDE TOUT LE FICHIER : aucun hexadécimal en dehors des
   blocs de défauts `.livretm.mN`. Toute forme, tout filet, toute déco tire sa
   couleur d'une variable — sans quoi l'hôte ne pourrait rien personnaliser.
   Deux exceptions assumées : la plaque du QR et ses modules, clairs et
   sombres quoi qu'il choisisse (un QR non scannable est un produit cassé).

   LA CONVERSION DEPUIS CANVA. Ses images font 1748 × 2480 px (14,8 × 21 cm à
   300 dpi) ; la face mesure 215 px de large dans la scène 3D. Le ratio se
   RECALCULE — celui de la carte ne vaut pas ici, le format est différent :

     formes  : pourcentage pur   x ÷ 1748, y ÷ 2480
     textes  : cqw = px Canva ÷ 17,48   (le même pourcentage que les formes)
     filets  : idem
     arrondis: en cqw, PAS en pourcentage. Sa règle disait « en px relatifs
               à l'élément » ; ce qu'elle vise, c'est le piège du
               pourcentage — un arrondi en % sur un rectangle donne un coin
               ELLIPTIQUE. Le cqw est une longueur, il évite ce piège
               exactement comme le px, et il suit la réduction en vignette,
               ce qu'un px figé ne fait pas. Même raison que pour les textes.

   SES DEUX PLANCHERS, écrits en `max()` et non figés :
     un texte : max(0.44rem, X cqw)      un filet : max(0.12rem, X cqw)
   À 215 px c'est le plancher qui gagne — le texte reste lisible en vignette,
   le filet ne devient pas une salissure grise (la leçon du 13/08). À la
   taille d'impression c'est la proportion dessinée qui gagne, et le texte
   reprend exactement la taille qu'il a sur son Canva. Un plancher figé, lui,
   aurait grossi le texte à l'impression aussi.

   LES TROIS PIÈGES QU'IL A RELEVÉS EN DESSINANT, traités ici :
   1. L'ORDRE D'EMPILEMENT ne suit pas l'ordre du document. Chaque couche
      porte un `z-index` EXPLICITE : fond 0 · aplats 1 · photo 2 · plaque QR 3
      · textes 4. Sans ça le QR de L'Écusson passe sous son cartouche.
   2. LE FOND N'EST JAMAIS LA COULEUR DE PAGE : `.livretm` peint son fond en
      couche pleine, il n'hérite jamais du papier de `.ff`.
   3. LES ÉLÉMENTS PIVOTÉS s'ancrent sur leur boîte APRÈS rotation. Pour le
      texte vertical on emploie `writing-mode: vertical-rl` + `rotate(180deg)`
      qui donne une VRAIE boîte verticale : le centrage se fait normalement,
      il n'y a plus rien à corriger à la main. `rotate()` seul n'est gardé que
      pour ce qui n'est pas du texte, et alors on pose le centre avant.
   ========================================================================= */

/* ---------------------------------------------------------------------------
   LES DEUX GARDE-FOUS DE CASCADE — NE PAS TOUCHER, NE PAS DÉPLACER.
   livrets.css est chargée APRÈS style.css : à spécificité égale, c'est elle
   qui gagne. Ces deux sélecteurs à TROIS classes recalent la face quoi
   qu'écrive un modèle. Même leçon que cartes.css, où les retirer faisait
   revenir la carte blanche.
   --------------------------------------------------------------------------- */
.feuillet .ff.livretm { position: absolute; inset: 0; width: auto; height: auto; }
.lm-vignette .ff.livretm { position: absolute; inset: auto; top: 0; left: 0; width: 215px; height: 298.61px; }

/* ===========================================================================
   LE SOCLE
   Il porte les variables générales, les variables par zone qui retombent
   dessus, et un dessin nu mais correct : un modèle pas encore habillé reste
   une page utilisable, jamais une page blanche.
   =========================================================================== */

.livretm {
  --fond: #fbf6ec;
  --encre: #2f3a2c;
  --accent: #7a8a5e;
  --police-titre: 'Fraunces', Georgia, serif;
  --police-texte: 'Baloo 2', system-ui, sans-serif;

  /* LE GARDE-FOU DU QR : ces deux-là ne suivent ni le fond ni l'accent. */
  --qr-plaque: #ffffff;
  --qr-encre: #2f3a2c;

  position: relative;          /* 1 classe : les garde-fous ci-dessus gagnent */
  container-type: inline-size; /* c'est lui qui rend les `cqw` possibles */
  overflow: hidden;            /* un aplat qui saigne s'arrête au pli */
  /* PIÈGE 2 : le fond est une couche pleine, jamais le papier hérité de .ff */
  background: var(--fond);
  color: var(--encre);
  font-family: var(--police-texte);
  line-height: 1.35;
}

/* ------------------------------------------------- les couches, explicites
   PIÈGE 1. On ne compte pas sur l'ordre du DOM : chaque couche dit son rang.
   Un modèle peut remonter une déco au-dessus de la photo, il le fait alors
   en le disant. */
.livretm .lm-deco  { z-index: 1; }
.livretm .lm-photo,
.livretm .lm-photo2,
.livretm .lm-photo3 { z-index: 2; }
.livretm .lm-qr    { z-index: 3; }
/* TOUTES les zones de texte, pas seulement celles du corps : un texte
   posé hors de `.lm-corps` — la signature, le mot du haut, les titres
   dressés — se retrouvait sinon SOUS l'aplat de sa face et disparaissait.
   C'est très exactement le piège qu'il a décrit, vérifié au rendu. */
.livretm .lm-corps,
.livretm .lm-sur,
.livretm .lm-nom,
.livretm .lm-sous,
.livretm .lm-mot,
.livretm .lm-qrtexte,
.livretm .lm-fin,
.livretm .lm-marque,
.livretm .lm-motprop,
.livretm .lm-proprio,
.livretm .lm-signe,
.livretm .lm-ptitre,
.livretm .lm-ptexte { z-index: 4; position: relative; }
/* (les zones que le modèle pose en absolu redéclarent `position` ; celles
   qui restent en flux ont besoin d'un `relative` pour que le z-index
   s'applique.) */

/* les quatre décos sont NEUTRES : invisibles tant qu'un modèle ne les
   habille pas. atelier.js les pose toujours, dans cet ordre. */
.livretm .lm-deco {
  position: absolute;
  display: block;
  pointer-events: none;
}

/* ------------------------------------------------- les zones de texte
   Chacune a sa couleur et sa police, qui RETOMBENT sur la générale.
   Les sept premières sont celles de la carte d'accueil — mêmes clés, mêmes
   réglages ; les cinq dernières n'existent que sur la double page. */

.livretm .lm-sur     { color: var(--c-sur, var(--encre));     font-family: var(--f-sur, var(--police-texte)); }
.livretm .lm-nom     { color: var(--c-nom, var(--encre));     font-family: var(--f-nom, var(--police-titre)); }
.livretm .lm-sous    { color: var(--c-sous, var(--encre));    font-family: var(--f-sous, var(--police-texte)); }
.livretm .lm-mot     { color: var(--c-mot, var(--encre));     font-family: var(--f-mot, var(--police-texte)); }
.livretm .lm-qrtexte { color: var(--c-qrtexte, var(--encre)); font-family: var(--f-qrtexte, var(--police-texte)); }
.livretm .lm-fin     { color: var(--c-fin, var(--encre));     font-family: var(--f-fin, var(--police-texte)); }
.livretm .lm-marque  { color: var(--c-marque, var(--encre));  font-family: var(--f-marque, var(--police-texte)); }
.livretm .lm-motprop { color: var(--c-motprop, var(--encre)); font-family: var(--f-motprop, var(--police-titre)); }
.livretm .lm-proprio { color: var(--c-proprio, var(--encre)); font-family: var(--f-proprio, var(--police-texte)); }
.livretm .lm-signe   { color: var(--c-signe, var(--encre));   font-family: var(--f-signe, var(--police-texte)); }
.livretm .lm-ptitre  { color: var(--c-ptitre, var(--encre));  font-family: var(--f-ptitre, var(--police-titre)); }
.livretm .lm-ptexte  { color: var(--c-ptexte, var(--encre));  font-family: var(--f-ptexte, var(--police-texte)); }

.livretm .lm-corps { position: absolute; inset: 0; padding: 9% 8%; }

/* le dessin nu : une face pas encore retranscrite reste lisible */
.livretm .lm-sur     { font-size: 4.4cqw; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; }
.livretm .lm-nom     { font-size: 6.1cqw; font-weight: 600; line-height: 1.15; margin-top: 2.5cqw; }
.livretm .lm-sous    { font-size: max(0.44rem, 3.3cqw); margin-top: 1.4cqw; }
.livretm .lm-mot     { font-size: max(0.44rem, 3.3cqw); margin-top: 3.5cqw; }
.livretm .lm-motprop { font-size: 4.4cqw; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.livretm .lm-proprio { font-size: max(0.44rem, 3.3cqw); }
/* LA SIGNATURE SUIT LE TEXTE (16/08 au soir, dicté) : dans la colonne,
   sous la dernière ligne du mot, collée à GAUCHE — plus d'épinglage par
   modèle. Sa police se choisit (--f-signe, les douze de la carte). */
.livretm .lm-signe   { font-size: max(0.44rem, 3.1cqw); font-style: italic; margin-top: 3cqw; text-align: left; }
.livretm .lm-ptitre  { font-size: 5.4cqw; font-weight: 700; }
.livretm .lm-ptexte  { font-size: max(0.44rem, 3.3cqw); }
.livretm .lm-qrtexte { font-size: max(0.44rem, 3.4cqw); font-weight: 600; }
.livretm .lm-fin     { font-size: max(0.44rem, 3.13cqw); font-style: italic; }
.livretm .lm-marque  { position: absolute; left: 0; right: 0; bottom: 3.2%; text-align: center; font-size: 2.08cqw; margin: 0; }

/* LA REMISE À ZÉRO DES MARGES VIENT APRÈS LE DESSIN NU — ET C'EST TOUT LE
   POINT. Elle était écrite AVANT, et le `margin-top: 2.5cqw` du nom, de
   même poids (0,2,0) mais écrit plus loin, la battait : les trois lignes
   du pied de couverture descendaient de 43,7 px sur TOUS les modèles.
   `.lm-corps` étant en position absolue, il ouvre un contexte de
   formatage — la marge du premier enfant ne se replie pas hors de la
   boîte, elle pousse le contenu. Le défaut ne se voyait pas sur m1 et m2,
   dont j'avais calé le `top` du corps en le compensant sans le savoir ;
   il aurait mordu sur les cinq suivants. Un modèle qui veut une marge la
   déclare, il pèse (0,4,0) et gagne. Contrepartie assumée : le dessin nu
   perd son interligne — il ne sert plus qu'à une face jamais retranscrite,
   et les sept le sont. */
.livretm .lm-corps > * { margin: 0; }

/* ---------------------------------------------------------- les photos
   DEUX emplacements, et deux statuts. Celle de la couverture est
   OBLIGATOIRE dans chaque modèle ; celle de la page libre est FACULTATIVE
   (sa dictée : « emplacement photo au choix ») et vit toujours en fin de
   colonne — absente, elle ne laisse qu'un blanc en pied. */
.livretm .lm-photo,
.livretm .lm-photo2,
.livretm .lm-photo3 {
  position: absolute;
  margin: 0;
  overflow: hidden;
  background: var(--photo-vide, var(--accent));
}
/* celle de la page libre est en FLUX, à la fin de la colonne */
.livretm .lm-photo2 { position: relative; }
/* LA TROISIÈME (15/08) n'existe que sur le QUATRE PAGES : ses faces 4 et 7
   sont des faces-photo TENUES PAR LE DÉCOR — jamais une photo nue en pleine
   page. Vide, le décor tient la face tout seul ; c'est la condition pour
   qu'elle reste facultative. */
.livretm .lm-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.livretm .lm-photo-vide {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: max(0.44rem, 3.13cqw); font-weight: 600;
  color: var(--photo-vide-encre, var(--encre));
  background: transparent;
  border: max(0.12rem, 0.89cqw) dashed currentColor;
  border-radius: inherit;   /* le pointillé épouse la forme de l'emplacement */
  opacity: 0.72;
  text-align: center;
  padding: 0 6%;
}

/* ------------------------------------------------------- la plaque du QR
   Elle reçoit le VRAI SVG (qrObjetHTML) : on ne redessine jamais les
   repères. Sa clarté est un garde-fou, pas un choix de design. */
.livretm .lm-qr {
  position: absolute;
  background: var(--qr-plaque);
  padding: 4%;                 /* la zone de silence, sans quoi rien ne scanne */
  box-sizing: border-box;
}
.livretm .lm-qr svg { width: 100%; height: 100%; display: block; }
/* (16/08 au soir, SON bug « le QR ne s'affiche pas » : le rect de fond
   et le path des modules recevaient LA MÊME encre — le QR se peignait
   lui-même en aplat plein. Le fond reprend la plaque, seuls les modules
   portent l'encre.) */
.livretm .lm-qr svg rect { fill: var(--qr-plaque); }
.livretm .lm-qr svg path { fill: var(--qr-encre); }

/* le dessin nu place le QR au centre */
.livretm .lm-corps .lm-qr { left: 22%; right: 22%; top: 32%; aspect-ratio: 1; }

/* ------------------------------------------------------------ la vignette
   Le choix de modèle montre la VRAIE couverture réduite, jamais un schéma :
   150 × 208, soit 215 × 298,61 à 69,77 %. Même leçon que la carte — on
   montre le produit, pas un dessin approché. */
.lm-vignette {
  position: relative;
  display: block;
  width: 150px;
  height: 208px;
  overflow: hidden;
  border-radius: 3px;
}
.lm-vignette .livretm {
  transform: scale(0.6977);
  transform-origin: top left;
}

/* ===========================================================================
   m1 — LE BANDEAU
   Le même geste que sa carte du même nom, tenu sur quatre faces : une bande
   verte pleine hauteur sur une tranche, et tout le reste posé contre elle.

   F1 la couverture : trois rectangles empilés en escalier, à franc bord en
      haut. L'olive n'est pas une bande décorative — c'est la photo décalée de
      −45 / +45 px, une ombre portée DURE, sans le moindre flou. Le crème est
      la couche la plus large, ouverte jusqu'au bord droit. Le mot du haut se
      dresse dans la colonne verte, tourné, et occupe la moitié de la page.
   F2 le mot du propriétaire : la bande passe à GAUCHE et porte le titre fixe
      en capitales espacées, dressé ; le mot tombe en haut du champ crème, la
      signature en bas à droite, précédée d'un court filet olive à gauche.
   F3 la page libre : tout est MIROIR de F2 — la bande passe à droite, le
      filet monte en tête de colonne, et le tirage se pose en pied avec la
      même ombre dure que la couverture.
   F4 le dos : deux bandes claires en tête et en pied, la plaque du QR au
      centre du champ vert, le mot de fin dessous.
   =========================================================================== */

.livretm.m1 {
  --fond: #2f3a2c;
  --encre: #f5ead8;
  --accent: #7a8a5e;
  /* les faces 2 et 3 sont de grands champs crème : ce qui s'y écrit passe
     en sombre, seuls les deux titres dressés restent clairs sur le vert */
  --c-qrtexte: #2f3a2c;
  --c-marque: #2f3a2c;
  --c-proprio: #2f3a2c;
  --c-signe: #2f3a2c;
  --c-ptexte: #2f3a2c;
  --m1-clair: #f5ead8;
  /* le cadre photo vide, relevé sur son dessin */
  --photo-vide: #d9d2be;
  --photo-vide-encre: #2f3a2c;
}

/* ------------------------------------------------------- m1 · F1 couverture */

/* le crème, la couche la plus large — 24,20 % → bord, 0 → 75,60 % */
.livretm.m1.lm-couv .lm-deco.a {
  left: 24.20%; right: 0; top: 0; bottom: 24.40%;
  background: var(--m1-clair);
}

/* l'olive : la photo décalée de −2,58 % / +1,81 %, une ombre portée dure */
.livretm.m1.lm-couv .lm-deco.b {
  left: 27.12%; right: 2.52%; top: 1.81%; bottom: 25.52%;
  background: var(--accent);
}

/* la photo, à franc bord en haut et à droite */
.livretm.m1.lm-couv .lm-photo {
  left: 29.69%; right: 0; top: 0; bottom: 27.34%;
}

/* le mot du haut, dressé dans la colonne verte et centré sur la hauteur du
   crème. PIÈGE 3 : `writing-mode` donne une vraie boîte verticale, donc le
   centrage se fait tout seul — rien à rattraper après rotation. */
.livretm.m1.lm-couv .lm-sur {
  position: absolute;
  left: 0; width: 25.98%;
  top: 0; height: 75.60%;
  margin: 0; padding: 4% 0;
  display: flex; align-items: center; justify-content: center;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-size: 12.88cqw;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  line-height: 1;
  white-space: nowrap;
}

/* les trois lignes du pied, centrées sur l'axe du bloc photo */
.livretm.m1.lm-couv .lm-corps {
  left: 29.69%; right: 0; top: 81.00%; bottom: 0;
  padding: 0 4%;
  display: flex; flex-direction: column; align-items: center;
}
.livretm.m1.lm-couv .lm-nom  { font-size: 4.86cqw; font-weight: 700; line-height: 1.12; text-align: center; }
.livretm.m1.lm-couv .lm-sous { font-size: max(0.44rem, 2.77cqw); margin-top: 2.25cqw; text-align: center; }
.livretm.m1.lm-couv .lm-mot  { font-size: max(0.44rem, 2.67cqw); font-style: italic; margin-top: 1.1cqw; text-align: center; }

/* ------------------------------------------- m1 · F2 le mot du propriétaire */

/* le champ crème, ouvert du bandeau au bord droit */
.livretm.m1.lm-mot .lm-deco.a {
  left: 24.20%; right: 0; top: 0; bottom: 0;
  background: var(--m1-clair);
}

/* le court filet olive qui annonce la signature */
.livretm.m1.lm-mot .lm-deco.b {
  left: 31.46%; top: 85.08%; width: 12.53%;
  height: max(0.12rem, 0.34cqw);
  background: var(--accent);
}

/* le titre FIXE, dressé dans la bande, centré sur toute la hauteur */
.livretm.m1.lm-mot .lm-motprop {
  position: absolute;
  left: 0; width: 22.76%;
  top: 0; bottom: 0;
  margin: 0; padding: 6% 0;
  display: flex; align-items: center; justify-content: center;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-size: 5.43cqw;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1;
  white-space: nowrap;
}

.livretm.m1.lm-mot .lm-corps {
  left: 31.64%; right: 7.44%; top: 24.5%; bottom: 18%;
  padding: 0;
}
.livretm.m1.lm-mot .lm-proprio { font-size: max(0.44rem, 2.98cqw); line-height: 1.5; }

.livretm.m1.lm-mot .lm-signe {
  font-size: max(0.44rem, 2.79cqw);
  font-style: italic;
}

/* ----------------------------------------------------- m1 · F3 la page libre
   Le miroir de F2 : la bande passe à droite, le filet monte en tête. */

/* le champ crème, du bord gauche au bandeau — le vert du fond reste seul
   visible sur la tranche droite, il n'a pas besoin d'une couche à lui */
.livretm.m1.lm-libre .lm-deco.a {
  left: 0; right: 24.20%; top: 0; bottom: 0;
  background: var(--m1-clair);
}
.livretm.m1.lm-libre .lm-deco.b {
  left: 7.44%; top: 21.77%; width: 12.53%;
  height: max(0.12rem, 0.34cqw);
  background: var(--accent);
}

.livretm.m1.lm-libre .lm-ptitre {
  position: absolute;
  right: 0; width: 24.48%;
  top: 0; bottom: 0;
  margin: 0; padding: 6% 0;
  display: flex; align-items: center; justify-content: center;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-size: 6.75cqw;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

/* la colonne : le texte en tête, le tirage EN FIN DE COLONNE. Sans photo,
   la page ne montre qu'un blanc en pied — jamais un trou au milieu. */
.livretm.m1.lm-libre .lm-corps {
  left: 7.44%; right: 31.64%; top: 24.6%; bottom: 15.32%;
  padding: 0;
  display: flex; flex-direction: column;
}
.livretm.m1.lm-libre .lm-ptexte { font-size: max(0.44rem, 3.13cqw); line-height: 1.5; min-height: 0; }

.livretm.m1.lm-libre .lm-photo2 {
  width: 65.7%;
  aspect-ratio: 1.4;
  margin-top: auto;
  flex: none;
  /* l'ombre portée DURE, sans flou — le geste de la couverture, repris */
  box-shadow: 1.72cqw 1.72cqw 0 var(--accent);
}

/* ------------------------------------------------------------- m1 · F4 le dos */

.livretm.m1.lm-dos .lm-deco.a {
  left: 0; right: 0; top: 0; height: 13.06%;
  background: var(--m1-clair);
}
.livretm.m1.lm-dos .lm-deco.b {
  left: 0; right: 0; bottom: 0; height: 7.34%;
  background: var(--m1-clair);
}

.livretm.m1.lm-dos .lm-corps { inset: 0; padding: 0; }

.livretm.m1.lm-dos .lm-qrtexte {
  position: absolute;
  left: 6%; right: 6%; top: 0; height: 13.06%;
  display: flex; align-items: center; justify-content: center;
  text-align: center;
  font-size: max(0.44rem, 3.71cqw);
  font-weight: 700;
}

.livretm.m1.lm-dos .lm-qr {
  left: 21.80%; right: 21.74%; top: 34.11%;
  aspect-ratio: 1;
}

.livretm.m1.lm-dos .lm-fin {
  position: absolute;
  left: 10%; right: 10%; top: 79.4%;
  text-align: center;
  font-size: max(0.44rem, 3.53cqw);
  font-style: italic;
}

.livretm.m1.lm-dos .lm-marque {
  bottom: 0; height: 7.34%;
  display: flex; align-items: center; justify-content: center;
}

/* ===========================================================================
   m2 — LE CHAMP
   Un seul objet tenu sur les quatre faces : UN GRAND PANNEAU TRÈS ARRONDI,
   cerné d'un filet intérieur, posé sur un champ plein. Ce qui change d'une
   face à l'autre, c'est ce que le champ contient — une photo, une couleur —
   et la hauteur du panneau.

   F1 la couverture : la photo occupe TOUTE la page, à franc bord des quatre
      côtés ; le mot du haut s'écrit dessus, en haut à gauche ; le panneau
      crème se pose en pied et porte le nom, le lieu en olive, un court filet
      et le mot d'accueil, tous centrés.
   F2 le mot du propriétaire : le champ passe au vert plein, le panneau monte
      presque pleine page. Titre fixe centré, filet, le mot en drapeau à
      gauche, la signature en bas à droite.
   F3 la page libre : la même page que F2, et le tirage se pose en pied du
      panneau — coins arrondis, la grammaire du modèle.
   F4 le dos : L'INVERSE. Le champ redevient crème et c'est le PANNEAU qui
      passe au vert ; il n'a plus de filet intérieur, sa courbe est plus
      généreuse, et le © Booky sort du panneau pour se poser sur le crème.

   Les arrondis sont en cqw et non en px : un px figé ne suivrait pas la
   réduction en vignette, et c'est la même raison qui a fait passer les
   textes en cqw. Le piège des pourcentages — un arrondi en % sur un
   rectangle donne un coin ELLIPTIQUE — est évité de la même façon.
   =========================================================================== */

.livretm.m2 {
  --fond: #f5ead8;
  --encre: #2f3a2c;
  --accent: #7a8a5e;
  /* le lieu est la seule ligne à l'accent ; le dos écrit en clair sur son
     panneau profond */
  --c-sous: #7a8a5e;
  --c-qrtexte: #f5ead8;
  --c-fin: #f5ead8;
  --photo-vide: #d9d2be;
  --photo-vide-encre: #2f3a2c;
  /* le panneau et son filet, mesurés sur ses quatre dessins */
  --m2-courbe: 10.47cqw;
  --m2-liseret: 1.95cqw;
}

/* LE CHAMP DES DEUX FACES INTÉRIEURES passe au ton profond : sans lui, le
   panneau crème se posait sur du crème et disparaissait — seul son filet
   restait visible. C'est la même dualité que sur son dessin : le champ est
   de la couleur de l'encre, le panneau de celle du papier. Le dos, lui,
   inverse les deux ; la couverture met la photo à la place du champ. */
.livretm.m2.lm-mot,
.livretm.m2.lm-libre { background: var(--encre); }

/* le panneau, commun aux trois premières faces — la déco `a` partout */
.livretm.m2 .lm-deco.a {
  left: 6.46%; right: 6.41%;
  border-radius: var(--m2-courbe);
  background: var(--fond);
}
/* son filet intérieur, à 34 px du bord sur son dessin */
.livretm.m2 .lm-deco.a::after {
  content: '';
  position: absolute;
  inset: var(--m2-liseret);
  border: max(0.12rem, 0.23cqw) solid var(--accent);
  border-radius: 8.52cqw;
}

/* le court filet centré, sur trois faces au même endroit relatif */
.livretm.m2 .lm-deco.b {
  left: 43.94%; width: 12.13%;
  height: max(0.12rem, 0.34cqw);
  background: var(--accent);
}

/* --------------------------------------------------------- m2 · F1 couverture */

/* la photo tient toute la page : c'est elle, le champ */
.livretm.m2.lm-couv .lm-photo { inset: 0; }

.livretm.m2.lm-couv .lm-deco.a {
  top: 55.73%; bottom: 14.72%;
  z-index: 3;             /* le panneau se pose SUR la photo */
}
.livretm.m2.lm-couv .lm-deco.b { top: 71.53%; }

/* LE VOILE DU MOT DU HAUT. Il n'est pas sur son dessin — je l'ajoute, et je
   le dis : c'est sa correction du 14/08 sur la carte du même nom (« le mot
   *bienvenue*, on dirait un bouton : ça doit être un beau texte juste
   au-dessus de la photo »), où un mot posé nu sur une photo devenait
   illisible dès que la photo était claire. Une montée très douce dans la
   teinte du modèle, jamais du noir. */
.livretm.m2.lm-couv .lm-deco.c {
  left: 0; right: 0; top: 0; height: 22%;
  z-index: 3;
  background: linear-gradient(to bottom, var(--fond), transparent);
  opacity: 0.55;
}

.livretm.m2.lm-couv .lm-sur {
  position: absolute;
  left: 13.33%; right: 10%; top: 9.35%;
  margin: 0;
  font-size: max(0.44rem, 3.40cqw);
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}

.livretm.m2.lm-couv .lm-corps {
  left: 12.30%; right: 12.30%; top: 61.15%; bottom: 14.72%;
  padding: 0;
  text-align: center;
}
.livretm.m2.lm-couv .lm-nom  { font-size: 5.84cqw; font-weight: 700; line-height: 1.12; }
.livretm.m2.lm-couv .lm-sous { font-size: max(0.44rem, 2.98cqw); margin-top: 1.5cqw; }
/* le mot d'accueil vit SOUS le filet : la marge du haut lui fait sa place */
.livretm.m2.lm-couv .lm-mot  { font-size: max(0.44rem, 3.12cqw); font-style: italic; margin-top: 6.85cqw; }

/* ------------------------------------------- m2 · F2 le mot du propriétaire */

.livretm.m2.lm-mot .lm-deco.a { top: 13.71%; bottom: 5.65%; }
.livretm.m2.lm-mot .lm-deco.b { top: 25.81%; }

.livretm.m2.lm-mot .lm-motprop {
  position: absolute;
  left: 12.30%; right: 12.30%; top: 19.08%;
  margin: 0;
  text-align: center;
  font-size: 4.12cqw;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.livretm.m2.lm-mot .lm-corps {
  left: 12.30%; right: 12.30%; top: 30.22%; bottom: 14%;
  padding: 0;
}
.livretm.m2.lm-mot .lm-proprio { font-size: max(0.44rem, 2.98cqw); line-height: 1.5; }

.livretm.m2.lm-mot .lm-signe {
  font-size: max(0.44rem, 2.79cqw);
  font-style: italic;
}

/* ----------------------------------------------------- m2 · F3 la page libre */

.livretm.m2.lm-libre .lm-deco.a { top: 13.71%; bottom: 5.65%; }
.livretm.m2.lm-libre .lm-deco.b { top: 25.81%; }

.livretm.m2.lm-libre .lm-ptitre {
  position: absolute;
  left: 12.30%; right: 12.30%; top: 19.19%;
  margin: 0;
  text-align: center;
  font-size: 3.83cqw;
  font-weight: 700;
}

.livretm.m2.lm-libre .lm-corps {
  left: 12.30%; right: 12.30%; top: 30.24%; bottom: 12.94%;
  padding: 0;
  display: flex; flex-direction: column;
}
.livretm.m2.lm-libre .lm-ptexte { font-size: max(0.44rem, 3.23cqw); line-height: 1.5; min-height: 0; }

/* le tirage, en fin de colonne : ici il prend les coins arrondis du modèle */
.livretm.m2.lm-libre .lm-photo2 {
  width: 68.2%;
  aspect-ratio: 1.5;
  margin-top: auto;
  flex: none;
  border-radius: 3.32cqw;
}

/* ------------------------------------------------------------- m2 · F4 le dos
   L'inverse des trois autres : le panneau prend la couleur profonde, le
   champ garde le crème, et le filet intérieur disparaît. */

.livretm.m2.lm-dos .lm-deco.a {
  top: 11.37%; bottom: 12.46%;
  background: var(--encre);
  border-radius: 12.93cqw;
}
.livretm.m2.lm-dos .lm-deco.a::after { content: none; }

/* le filet passe au clair : il est posé sur le panneau, pas sur le champ */
.livretm.m2.lm-dos .lm-deco.b { top: 23.87%; background: var(--fond); }

.livretm.m2.lm-dos .lm-corps { inset: 0; padding: 0; }

.livretm.m2.lm-dos .lm-qrtexte {
  position: absolute;
  left: 12.30%; right: 12.30%; top: 16.92%;
  margin: 0;
  text-align: center;
  font-size: max(0.44rem, 3.71cqw);
  font-weight: 700;
}

.livretm.m2.lm-dos .lm-qr {
  left: 24.20%; right: 24.20%; top: 31.85%;
  aspect-ratio: 1;
  border-radius: 4.58cqw;
}

.livretm.m2.lm-dos .lm-fin {
  position: absolute;
  left: 12.30%; right: 12.30%; top: 74.38%;
  margin: 0;
  text-align: center;
  font-size: max(0.44rem, 3.54cqw);
  font-style: italic;
}

/* le © Booky SORT du panneau et se pose sur le champ crème */
.livretm.m2.lm-dos .lm-marque { bottom: 6.1%; }

/* ===========================================================================
   m3 — L'ÉCUSSON
   Un seul geste, tenu sur les quatre faces : un CARTOUCHE crème aux coins
   doux, posé sur un champ vert profond qui le CERNE de tous côtés. Ce qui
   change d'une face à l'autre, ce sont ses marges — et sur la couverture,
   ce qu'il enferme.

   F1 la couverture : le mot du haut s'écrit en clair sur le champ nu, un
      court filet olive dessous ; le cartouche descend ensuite en écusson et
      ne contient rien d'autre que la photo, cernée d'un liseré crème de
      34 px sur ses quatre côtés. Le pied de page est une COLLINE : un aplat
      crème beaucoup plus large que la page, dont seul le sommet arrondi se
      voit, et qui porte le nom, le lieu en olive et le mot d'accueil.
   F2 le mot du propriétaire : le cartouche monte presque pleine page. Titre
      fixe centré en capitales, le filet dessous, le mot en drapeau à gauche,
      la signature en bas à droite.
   F3 la page libre : la même page que F2 — même cartouche, même filet — et
      le tirage se pose en pied de colonne, centré, aux coins doux.
   F4 le dos : le cartouche se resserre des quatre côtés, porte la ligne du
      QR, le filet, la plaque du QR et le mot de fin ; le © Booky SORT du
      cartouche et se pose en clair sur le champ.

   Le cartouche garde partout la même courbe (35 px) et les emplacements
   photo la leur (16 px) ; seule la colline de la couverture a sa courbe à
   elle, très large (320 px). Toutes en cqw : un arrondi en pourcentage sur
   un rectangle donnerait un coin elliptique.
   =========================================================================== */

.livretm.m3 {
  --fond: #2f3a2c;
  --encre: #f5ead8;
  --accent: #7a8a5e;
  /* TOUT ce qui s'écrit DANS le cartouche passe en sombre ; seuls le mot du
     haut et le © Booky restent à l'encre claire, posés sur le champ. Le lieu
     est la seule ligne à l'accent. */
  --c-nom: #2f3a2c;
  --c-sous: #7a8a5e;
  --c-mot: #2f3a2c;
  --c-motprop: #2f3a2c;
  --c-proprio: #2f3a2c;
  --c-signe: #2f3a2c;
  --c-ptitre: #2f3a2c;
  --c-ptexte: #2f3a2c;
  --c-qrtexte: #2f3a2c;
  --c-fin: #2f3a2c;
  /* le crème des aplats — la même valeur que l'encre, mais c'est une FORME
     qu'il peint, pas un texte : elle a droit à son nom */
  --m3-clair: #f5ead8;
  --photo-vide: #d9d2be;
  --photo-vide-encre: #2f3a2c;
  /* les trois courbes du modèle, ajustées sur l'arc de ses quatre dessins */
  --m3-courbe: 2.03cqw;    /* le cartouche          — 35 px */
  --m3-tirage: 0.90cqw;    /* les deux emplacements photo — 16 px */
  --m3-colline: 18.31cqw;  /* la colline du pied de couverture — 320 px */
}

/* LE CARTOUCHE, le même objet sur les quatre faces : la déco `a` partout.
   Il ne porte ni filet ni bordure — c'est le champ profond tout autour qui
   le cerne. Seules ses quatre marges changent de face en face. */
.livretm.m3 .lm-deco.a {
  background: var(--m3-clair);
  border-radius: var(--m3-courbe);
}

/* LE COURT FILET OLIVE, à la même abscisse sur les quatre faces (768 → 979
   px sur ses dessins) ; seule sa hauteur dans la page bouge. */
.livretm.m3 .lm-deco.b {
  left: 43.94%; width: 12.13%;
  height: max(0.12rem, 0.26cqw);
  background: var(--accent);
}

/* --------------------------------------------------------- m3 · F1 couverture */

/* l'écusson : le cartouche ne sert ici qu'à cerner la photo */
.livretm.m3.lm-couv .lm-deco.a {
  left: 15.33%; right: 15.27%; top: 13.63%; bottom: 29.52%;
}
.livretm.m3.lm-couv .lm-deco.b { top: 10.12%; }

/* LA COLLINE. Son arc ne tient pas dans la page : le rectangle déborde de
   147 px à gauche comme à droite, et sa courbe de 320 px ne montre que son
   sommet. Le bas file sous le pli, ses coins bas ne se voient jamais —
   d'où l'arrondi sur les deux coins HAUTS seulement. */
.livretm.m3.lm-couv .lm-deco.c {
  left: -8.41%; right: -8.41%; top: 75.60%; bottom: 0;
  background: var(--m3-clair);
  border-radius: var(--m3-colline) var(--m3-colline) 0 0;
}

/* la photo, en retrait de 34 px dans le cartouche sur ses quatre côtés */
.livretm.m3.lm-couv .lm-photo {
  left: 17.28%; right: 17.22%; top: 15.00%; bottom: 30.89%;
  border-radius: var(--m3-tirage);
}

/* le mot du haut, seul sur le champ nu — ni capitales ni interlettrage sur
   son dessin, il faut donc défaire les deux du socle */
.livretm.m3.lm-couv .lm-sur {
  position: absolute;
  left: 12.30%; right: 12.30%; top: 5.19%;
  margin: 0;
  text-align: center;
  font-size: max(0.44rem, 3.76cqw);
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}

/* les trois lignes du pied, centrées sur la colline */
.livretm.m3.lm-couv .lm-corps {
  left: 12.30%; right: 12.30%; top: 80.40%; bottom: 0;
  padding: 0;
  text-align: center;
}
.livretm.m3.lm-couv .lm-nom  { font-size: 4.96cqw; font-weight: 700; line-height: 1.12; }
.livretm.m3.lm-couv .lm-sous { font-size: max(0.44rem, 2.7cqw); margin-top: 2.22cqw; }
.livretm.m3.lm-couv .lm-mot  { font-size: max(0.44rem, 2.96cqw); font-style: italic; margin-top: 3.24cqw; }

/* ------------------------------------------- m3 · F2 le mot du propriétaire */

.livretm.m3.lm-mot .lm-deco.a {
  left: 6.46%; right: 6.41%; top: 13.71%; bottom: 7.26%;
}
.livretm.m3.lm-mot .lm-deco.b { top: 24.60%; }

/* le titre FIXE : capitales serrées, sans interlettrage — la largeur d'encre
   mesurée (869 px pour 13,33 cadratins) ne laisse aucune place à un écart */
.livretm.m3.lm-mot .lm-motprop {
  position: absolute;
  left: 12.30%; right: 12.30%; top: 18.76%;
  margin: 0;
  text-align: center;
  font-size: 3.71cqw;
  font-weight: 700;
  letter-spacing: 0;
}

.livretm.m3.lm-mot .lm-corps {
  left: 12.30%; right: 12.30%; top: 29.02%; bottom: 15.73%;
  padding: 0;
}
.livretm.m3.lm-mot .lm-proprio { font-size: max(0.44rem, 2.98cqw); line-height: 1.5; }

.livretm.m3.lm-mot .lm-signe {
  font-size: max(0.44rem, 2.78cqw);
  font-style: italic;
}

/* ----------------------------------------------------- m3 · F3 la page libre
   Le même cartouche que F2, au pixel près : seuls les textes changent. */

.livretm.m3.lm-libre .lm-deco.a {
  left: 6.46%; right: 6.41%; top: 13.71%; bottom: 7.26%;
}
.livretm.m3.lm-libre .lm-deco.b { top: 24.60%; }

.livretm.m3.lm-libre .lm-ptitre {
  position: absolute;
  left: 12.30%; right: 12.30%; top: 18.93%;
  margin: 0;
  text-align: center;
  font-size: 3.56cqw;
  font-weight: 700;
}

/* la colonne : le texte en tête, le tirage EN FIN DE COLONNE. Sans photo,
   la page ne montre qu'un blanc en pied — jamais un trou au milieu. */
.livretm.m3.lm-libre .lm-corps {
  left: 12.30%; right: 12.30%; top: 29.08%; bottom: 12.90%;
  padding: 0;
  display: flex; flex-direction: column;
}
.livretm.m3.lm-libre .lm-ptexte { font-size: max(0.44rem, 3.21cqw); line-height: 1.5; min-height: 0; }

/* le tirage est CENTRÉ dans la colonne sur son dessin (son axe tombe sur
   celui du cartouche) : sans `align-self`, la colonne le collerait à gauche */
.livretm.m3.lm-libre .lm-photo2 {
  width: 68.2%;
  aspect-ratio: 1.5;
  margin-top: auto;
  align-self: center;
  flex: none;
  border-radius: var(--m3-tirage);
}

/* ------------------------------------------------------------- m3 · F4 le dos
   Le cartouche se resserre des quatre côtés et le © Booky en sort. */

.livretm.m3.lm-dos .lm-deco.a {
  left: 12.13%; right: 12.07%; top: 17.06%; bottom: 20.40%;
}
.livretm.m3.lm-dos .lm-deco.b { top: 26.73%; }

.livretm.m3.lm-dos .lm-corps { inset: 0; padding: 0; }

/* la gouttière du dos vaut celle des faces intérieures reportée sur un
   cartouche plus étroit : 102 px de blanc de part et d'autre */
.livretm.m3.lm-dos .lm-qrtexte {
  position: absolute;
  left: 17.96%; right: 17.96%; top: 21.56%;
  margin: 0;
  text-align: center;
  font-size: max(0.44rem, 3.36cqw);
  font-weight: 700;
}

/* la plaque est un carré franc sur son dessin : aucun arrondi ici */
.livretm.m3.lm-dos .lm-qr {
  left: 25.80%; right: 25.80%; top: 31.85%;
  aspect-ratio: 1;
}

.livretm.m3.lm-dos .lm-fin {
  position: absolute;
  left: 17.96%; right: 17.96%; top: 70.42%;
  margin: 0;
  text-align: center;
  font-size: max(0.44rem, 3.06cqw);
  font-style: italic;
}

/* le © Booky sort du cartouche et s'écrit en clair sur le champ profond —
   il garde donc l'encre générale du modèle, sans variable de zone */
.livretm.m3.lm-dos .lm-marque {
  bottom: 12.03%;
  font-size: max(0.44rem, 2.08cqw);
}

/* ===========================================================================
   m4 — LA RÉGLURE
   Un cahier réglé, et rien d'autre : AUCUN aplat de couleur sur les quatre
   faces, rien que des filets olive et du blanc. Le geste tient en une paire :
   un filet GRAS (7 px sur son dessin) et un filet MINCE (3 px) séparés par un
   entre-deux vide. Cette paire ouvre les quatre faces, et une seconde paire —
   son MIROIR, mince dessus, gras dessous — referme le bloc de titre. Les
   filets courent toujours de la même laisse à la même laisse, 8,87 % de part
   et d'autre : c'est cette marge, et pas une autre, qui aligne tous les
   textes du modèle.

   F1 la couverture : entre les deux paires, trois lignes centrées — le mot du
      haut en olive et gras, le NOM en très grand (le plus gros texte des sept
      modèles), le lieu en olive et maigre. Sous la seconde paire, la photo,
      rectangle à ANGLES VIFS centré sur la page, doublée d'une ombre portée
      DURE en olive, décalée en bas à droite, sans le moindre flou. Le mot
      d'accueil tombe en pied de la même colonne, et le court filet centré
      ferme la page.
   F2 le mot du propriétaire : le titre fixe en capitales tient seul entre les
      deux paires, qui se resserrent — le bloc n'a plus qu'une ligne. Le mot
      part en drapeau contre la marge de gauche, la signature se cale en bas à
      droite sur la même marge.
   F3 la page libre : la même page que F2, et le tirage EN FIN de colonne,
      centré, à angles vifs, avec la même ombre dure qu'en couverture.
   F4 le dos : le QR n'est pas posé sur une plaque, il est CERNÉ d'un filet
      d'encre — un carré parfait au centre. La seconde paire de filets descend
      sous lui et lui sert de socle. C'est la seule face sans court filet
      centré : sa paire basse en tient lieu.

   Les épaisseurs passent en cqw et non en px : un px figé ne suivrait pas la
   réduction en vignette. Sous le plancher elles s'écrivent en max(), ce qui
   fait qu'à 215 px les deux filets d'une paire se rejoignent visuellement —
   c'est le prix à payer pour qu'aucun ne devienne une salissure grise.
   =========================================================================== */

.livretm.m4 {
  --fond: #fbf6ec;
  --encre: #2f3a2c;
  --accent: #7a8a5e;
  /* TROIS lignes seulement quittent l'encre pour l'olive : le mot du haut, le
     lieu et le © Booky. Elles suivent l'accent de l'hôte, pas une couleur
     figée — c'est un modèle où l'accent est presque tout le dessin. */
  --c-sur: var(--accent);
  --c-sous: var(--accent);
  --c-marque: var(--accent);
  /* les deux épaisseurs de la réglure, relevées sur les huit filets de ses
     quatre dessins : 7 px pour celui du dehors, 3 px pour celui du dedans */
  --m4-gras: max(0.12rem, 0.40cqw);
  --m4-mince: max(0.12rem, 0.17cqw);
  /* LE GARDE-FOU DU QR, version m4 : son dessin ne met pas de plaque blanche
     sous le code, il laisse le crème. On garde donc une plaque CLAIRE FIGÉE —
     un QR non scannable est un produit cassé — mais au ton de son papier
     plutôt qu'au blanc du socle. Elle ne suit pas --fond : si l'hôte passe au
     sombre, le code reste lisible. */
  --qr-plaque: #fbf6ec;
  /* le cadre photo vide, relevé sur son dessin */
  --photo-vide: #d9d2be;
  --photo-vide-encre: #2f3a2c;
}

/* ------------------------------------------------------- les doubles filets
   Un seul objet, tenu sur les quatre faces. On l'écrit en BORDURES d'une même
   boîte plutôt qu'en deux décos : la hauteur de la boîte EST l'entre-deux, et
   les deux filets ne peuvent plus se désolidariser. Ça libère aussi la déco c
   pour le court filet du pied — quatre décos suffisent, aucun ::before n'a
   été nécessaire. */
.livretm.m4 .lm-deco.a,
.livretm.m4 .lm-deco.b {
  /* CONTENT-BOX, comme sur la carte du même nom. espace.html charge le CDN
     Tailwind, dont le preflight met TOUT en border-box : la hauteur
     déclarée avalerait alors les deux bordures, l'entre-deux s'effondrerait
     et le DOUBLE filet deviendrait un trait simple sur la moitié des faces.
     La hauteur de la boîte EST l'espace entre les deux filets. */
  box-sizing: content-box; left: 8.87%; right: 8.87%; }

/* la paire du haut : gras dessus, mince dessous. Au pixel près la même sur
   les quatre faces — c'est la signature du modèle. */
.livretm.m4 .lm-deco.a {
  top: 8.55%; height: 0.73%;
  border-top: var(--m4-gras) solid var(--accent);
  border-bottom: var(--m4-mince) solid var(--accent);
}

/* la paire du bas : le MIROIR de la première, mince dessus, gras dessous, de
   sorte que les deux filets gras soient toujours ceux du dehors. Elle change
   de hauteur d'une face à l'autre parce que le bloc de titre change : trois
   lignes en couverture, une seule sur les faces intérieures. */
.livretm.m4 .lm-deco.b {
  border-top: var(--m4-mince) solid var(--accent);
  border-bottom: var(--m4-gras) solid var(--accent);
}
.livretm.m4.lm-couv  .lm-deco.b { top: 32.18%; height: 0.56%; }
.livretm.m4.lm-mot   .lm-deco.b { top: 18.95%; height: 0.40%; }
.livretm.m4.lm-libre .lm-deco.b { top: 18.95%; height: 0.40%; }
.livretm.m4.lm-dos   .lm-deco.b { top: 67.10%; height: 0.56%; }

/* le court filet centré du pied. Il n'est PAS sur le dos : on ne le nomme
   donc que sur les trois faces qui le portent, sans quoi une déco sans `top`
   irait se poser toute seule en haut de la face. */
.livretm.m4.lm-couv .lm-deco.c,
.livretm.m4.lm-mot .lm-deco.c,
.livretm.m4.lm-libre .lm-deco.c {
  left: 43.94%; width: 12.13%;
  height: max(0.12rem, 0.29cqw);
  background: var(--accent);
}
.livretm.m4.lm-couv .lm-deco.c  { top: 93.23%; }
.livretm.m4.lm-mot .lm-deco.c   { top: 91.94%; }
.livretm.m4.lm-libre .lm-deco.c { top: 93.23%; }

/* --------------------------------------------------------- m4 · F1 couverture */

/* le mot du haut : seul entre la paire du haut et le grand titre, gras et
   olive, sans capitales ni interlettrage — sa chasse mesurée le dit. */
.livretm.m4.lm-couv .lm-sur {
  position: absolute;
  left: 8.87%; right: 8.87%; top: 11.86%;
  margin: 0;
  text-align: center;
  font-size: max(0.44rem, 2.87cqw);
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}

/* le bloc de titre et le mot d'accueil vivent dans la MÊME colonne : le mot
   est chassé en pied par `margin-top: auto`, ce qui laisse le grand titre
   calé sous la paire du haut quoi qu'il écrive. */
.livretm.m4.lm-couv .lm-corps {
  left: 8.87%; right: 8.87%; top: 17.32%; bottom: 12.06%;
  padding: 0;
  display: flex; flex-direction: column;
  text-align: center;
}
.livretm.m4.lm-couv .lm-nom  { font-size: 7.03cqw; font-weight: 700; line-height: 1.12; }
.livretm.m4.lm-couv .lm-sous { font-size: max(0.44rem, 2.96cqw); margin-top: 4.36cqw; }
.livretm.m4.lm-couv .lm-mot  { font-size: max(0.44rem, 3.12cqw); font-style: italic; margin-top: auto; }

/* la photo, centrée, à ANGLES VIFS (rayon 0 mesuré sur son dessin), et son
   ombre portée DURE en olive : la photo redoublée de +29 px / +28 px, sans le
   moindre flou. C'est le seul endroit du modèle où l'accent devient une
   surface — et encore, c'est une ombre, pas un aplat. */
.livretm.m4.lm-couv .lm-photo {
  left: 19.34%; right: 19.34%; top: 38.67%; bottom: 21.53%;
  box-shadow: 1.66cqw 1.60cqw 0 var(--accent);
}

/* ------------------------------------------- m4 · F2 le mot du propriétaire */

.livretm.m4.lm-mot .lm-motprop {
  position: absolute;
  left: 8.87%; right: 8.87%; top: 13.64%;
  margin: 0;
  text-align: center;
  font-size: 3.71cqw;
  font-weight: 700;
  letter-spacing: 0;
}

/* le mot part en drapeau contre la marge de gauche — la MÊME que celle des
   filets, à trois pixels d'approche près sur son dessin */
.livretm.m4.lm-mot .lm-corps {
  left: 8.87%; right: 8.87%; top: 23.84%; bottom: 16.50%;
  padding: 0;
}
.livretm.m4.lm-mot .lm-proprio { font-size: max(0.44rem, 2.91cqw); line-height: 1.5; }

.livretm.m4.lm-mot .lm-signe {
  font-size: max(0.44rem, 2.78cqw);
  font-style: italic;
}

/* ----------------------------------------------------- m4 · F3 la page libre */

.livretm.m4.lm-libre .lm-ptitre {
  position: absolute;
  left: 8.87%; right: 8.87%; top: 13.75%;
  margin: 0;
  text-align: center;
  font-size: 3.56cqw;
  font-weight: 700;
}

.livretm.m4.lm-libre .lm-corps {
  left: 8.87%; right: 8.87%; top: 23.8%; bottom: 12.90%;
  padding: 0;
  display: flex; flex-direction: column;
}
.livretm.m4.lm-libre .lm-ptexte { font-size: max(0.44rem, 3.22cqw); line-height: 1.5; min-height: 0; }

/* le tirage, en fin de colonne. Contrairement à m1 il est CENTRÉ dans la
   colonne — 269 px de chaque côté sur son dessin — et il reprend l'ombre dure
   de la couverture. Absent, la page ne montre qu'un blanc en pied. */
.livretm.m4.lm-libre .lm-photo2 {
  width: 62.59%;
  aspect-ratio: 1.5;
  align-self: center;
  margin-top: auto;
  flex: none;
  box-shadow: 1.72cqw 1.72cqw 0 var(--accent);
}

/* ------------------------------------------------------------- m4 · F4 le dos
   Le corps s'ouvre en grand : le titre, le QR et le mot de fin s'y posent en
   absolu sur la face entière, comme sur m1 et m2. */

.livretm.m4.lm-dos .lm-corps { inset: 0; padding: 0; }

.livretm.m4.lm-dos .lm-qrtexte {
  position: absolute;
  left: 8.87%; right: 8.87%; top: 14.23%;
  margin: 0;
  text-align: center;
  font-size: max(0.44rem, 3.36cqw);
  font-weight: 700;
}

/* le QR CERNÉ, pas posé : sur son dessin le carré n'est qu'un filet d'encre
   de 6 px autour du code, la plaque restant au ton du papier. Le carré est
   vrai — 846 × 846 px mesurés — d'où `aspect-ratio: 1` et une seule laisse
   donnée deux fois. Le socle pose déjà `box-sizing: border-box`, le filet
   mange donc dans la boîte et la zone de silence est préservée. */
.livretm.m4.lm-dos .lm-qr {
  left: 25.80%; right: 25.80%; top: 27.30%;
  aspect-ratio: 1;
  border: max(0.12rem, 0.34cqw) solid var(--encre);
}

.livretm.m4.lm-dos .lm-fin {
  position: absolute;
  left: 8.87%; right: 8.87%; top: 73.34%;
  margin: 0;
  text-align: center;
  font-size: max(0.44rem, 3.23cqw);
  font-style: italic;
}

/* le © Booky passe à l'olive et devient menu : c'est la seule marque des sept
   modèles qui ne soit pas de la couleur de l'encre */
.livretm.m4.lm-dos .lm-marque {
  bottom: 6.32%;
  font-size: max(0.44rem, 2.07cqw);
}

/* ===========================================================================
   m5 — LE DIPTYQUE
   Un seul geste, tenu sur les quatre faces : UNE COUPE HORIZONTALE NETTE en
   travers de la page, et une BARRE OLIVE posée sur la ligne. Au-dessus et
   au-dessous, deux champs pleins qui ne se mélangent jamais. Ce qui change
   d'une face à l'autre, c'est la HAUTEUR de la coupe et ce que chaque moitié
   reçoit. La barre fait 20 px sur ses dessins — la même sur les quatre.

   F1 la couverture : la coupe tombe au milieu (52,62 %). Au-dessus, la photo
      à franc bord des trois côtés ; au-dessous, le vert du fond, et toute la
      titraille centrée dessus — le mot du haut à l'accent, le nom, le lieu,
      un court filet crème, le mot d'accueil.
   F2 le mot du propriétaire : la coupe remonte au quart (27,42 %). Le titre
      FIXE se pose en capitales sur le bandeau vert, le mot tombe en haut du
      champ crème, en drapeau à gauche, la signature en bas à droite.
   F3 la page libre : la MÊME coupe que F2, au même pixel — c'est la page
      jumelle. Le titre sur le vert, le texte en tête du crème, le tirage en
      fin de colonne, centré dans la colonne.
   F4 le dos : la coupe redescend au milieu, au pixel de la couverture. Le
      haut vert porte la ligne du QR, son court filet et le mot de fin ; le
      bas crème ne porte que la plaque du QR et le © Booky.

   Le champ clair des trois dernières faces est un APLAT, pas un fond de
   face : la face reste verte (`--fond`) et la déco `a` vient poser le crème
   sous la ligne. Les textes qui tombent dessus repassent donc en sombre —
   sans quoi ils s'écriraient crème sur crème, la disparition de m2.

   Trois décos suffisent, et elles se partagent d'une face à l'autre :
   `a` le champ crème · `b` la barre olive · `c` le court filet.
   =========================================================================== */

.livretm.m5 {
  --fond: #2f3a2c;
  --encre: #f5ead8;
  /* L'ACCENT RESTE L'OLIVE, comme sur la carte du même nom : c'est lui qui
     peint la barre de la coupe sur les quatre faces, et le © Booky. La
     PÊCHE ne touche qu'une ligne — le mot du haut — et elle a son propre
     canal pour ça. Donner l'accent à la pêche inverserait les deux rôles
     et repeindrait en pêche tout ce que le socle tire de var(--accent). */
  --accent: #7a8a5e;
  --c-sur: #ffb59e;
  /* tout ce qui tombe dans le champ crème repasse en sombre ; le © Booky,
     lui, s'y écrit en olive comme sur son dessin */
  --c-proprio: #2f3a2c;
  --c-signe: #2f3a2c;
  --c-ptexte: #2f3a2c;
  --c-marque: #7a8a5e;
  /* le cadre photo vide, relevé sur ses dessins */
  --photo-vide: #d9d2be;
  --photo-vide-encre: #2f3a2c;
}

/* ------------------------------------------------- les trois décos communes
   Elles ne changent que de HAUTEUR d'une face à l'autre : leur dessin est
   écrit une seule fois ici, chaque face ne dit que son `top`. */

/* le champ crème, de la ligne au bord bas (F2, F3, F4) */
.livretm.m5 .lm-deco.a {
  left: 0; right: 0; bottom: 0;
  background: var(--encre);
}

/* LA BARRE : 20 px pleine largeur, posée sur la coupe (les quatre faces) */
.livretm.m5 .lm-deco.b {
  left: 0; right: 0;
  height: 1.14cqw;
  background: var(--accent);
}

/* le court filet crème, 212 px centrés (F1 sous le lieu, F4 sous la ligne) */
.livretm.m5 .lm-deco.c {
  left: 43.94%; width: 12.13%;
  height: max(0.12rem, 0.23cqw);
  background: var(--encre);
}

/* --------------------------------------------------------- m5 · F1 couverture */

/* la photo tient toute la moitié haute, à franc bord des trois côtés */
.livretm.m5.lm-couv .lm-photo { left: 0; right: 0; top: 0; bottom: 47.38%; }

.livretm.m5.lm-couv .lm-deco.b { top: 52.62%; }
.livretm.m5.lm-couv .lm-deco.c { top: 82.46%; }

/* la titraille, centrée sur le champ vert. Le mot du haut n'est ni espacé
   ni capitalisé sur son dessin : les deux réglages du socle sautent. */
.livretm.m5.lm-couv .lm-corps {
  left: 8.24%; right: 8.24%; top: 69.51%; bottom: 0;
  padding: 0;
  text-align: center;
}
.livretm.m5.lm-couv .lm-sur {
  /* IL EST FRÈRE DE `.lm-corps`, PAS SON PREMIER ENFANT (squelette de
     l'atelier) : sans position il restait en flux, fer à gauche, tout en
     haut de la page par-dessus la photo. Il se pose donc lui-même. */
  position: absolute;
  left: 8.24%; right: 8.24%; top: 64.62%;
  margin: 0;
  text-align: center;
  font-size: max(0.44rem, 3.14cqw);
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}
.livretm.m5.lm-couv .lm-nom  { font-size: 6.48cqw; font-weight: 700; line-height: 1.12;
  /* pas de marge : le mot du haut ayant été sorti en absolu, le nom est le
     PREMIER enfant du corps — la marge qui le séparait du mot poussait
     toute la titraille de 61 px vers le pli. */ }
.livretm.m5.lm-couv .lm-sous { font-size: max(0.44rem, 2.96cqw); margin-top: 2.87cqw; }
/* le mot d'accueil vit SOUS le court filet : sa marge du haut lui fait sa
   place, exactement comme sur m2 */
.livretm.m5.lm-couv .lm-mot  { font-size: max(0.44rem, 3.12cqw); font-style: italic; margin-top: 9.46cqw; }

/* ------------------------------------------- m5 · F2 le mot du propriétaire */

.livretm.m5.lm-mot .lm-deco.a { top: 28.23%; }
.livretm.m5.lm-mot .lm-deco.b { top: 27.42%; }

/* le titre FIXE, en capitales sur le bandeau vert. Mesuré sans chasse
   ajoutée : l'espacement du socle tombe à zéro. */
.livretm.m5.lm-mot .lm-motprop {
  position: absolute;
  left: 8.24%; right: 8.24%; top: 11.90%;
  margin: 0;
  text-align: center;
  font-size: 3.71cqw;
  font-weight: 700;
  letter-spacing: 0;
}

.livretm.m5.lm-mot .lm-corps {
  left: 8.24%; right: 8.24%; top: 33.11%; bottom: 11.60%;
  padding: 0;
}
.livretm.m5.lm-mot .lm-proprio { font-size: max(0.44rem, 2.98cqw); line-height: 1.5; }

.livretm.m5.lm-mot .lm-signe {
  font-size: max(0.44rem, 2.86cqw);
  font-style: italic;
}

/* ----------------------------------------------------- m5 · F3 la page libre
   La page jumelle de F2 : même coupe, même marge, même colonne. */

.livretm.m5.lm-libre .lm-deco.a { top: 28.23%; }
.livretm.m5.lm-libre .lm-deco.b { top: 27.42%; }

.livretm.m5.lm-libre .lm-ptitre {
  position: absolute;
  left: 8.24%; right: 8.24%; top: 11.95%;
  margin: 0;
  text-align: center;
  font-size: 3.56cqw;
  font-weight: 700;
}

/* le texte en tête, le tirage EN FIN DE COLONNE. Sans photo, la page ne
   montre qu'un blanc en pied — jamais un trou au milieu. */
.livretm.m5.lm-libre .lm-corps {
  left: 8.24%; right: 8.24%; top: 33.26%; bottom: 12.90%;
  padding: 0;
  display: flex; flex-direction: column;
}
.livretm.m5.lm-libre .lm-ptexte { font-size: max(0.44rem, 3.12cqw); line-height: 1.5; min-height: 0; }

/* 900 × 600 px sur son dessin, centré dans la colonne — d'où `align-self` */
.livretm.m5.lm-libre .lm-photo2 {
  width: 61.64%;
  aspect-ratio: 1.5;
  margin-top: auto;
  align-self: center;
  flex: none;
}

/* ------------------------------------------------------------- m5 · F4 le dos
   La coupe de la couverture, au pixel près, mais retournée : c'est le HAUT
   qui parle et le BAS qui porte le QR. */

.livretm.m5.lm-dos .lm-deco.a { top: 53.43%; }
.livretm.m5.lm-dos .lm-deco.b { top: 52.62%; }
.livretm.m5.lm-dos .lm-deco.c { top: 22.74%; }
/* les deux faces intérieures ne portent pas ce filet : sans `top`, un absolu
   retombe sur sa position statique et venait se coller au bord haut. */
.livretm.m5.lm-mot .lm-deco.c,
.livretm.m5.lm-libre .lm-deco.c { display: none; }

.livretm.m5.lm-dos .lm-corps { inset: 0; padding: 0; }

.livretm.m5.lm-dos .lm-qrtexte {
  position: absolute;
  left: 8.24%; right: 8.24%; top: 17.42%;
  margin: 0;
  text-align: center;
  font-size: max(0.44rem, 3.53cqw);
  font-weight: 700;
}

.livretm.m5.lm-dos .lm-fin {
  position: absolute;
  left: 8.24%; right: 8.24%; top: 33.97%;
  margin: 0;
  text-align: center;
  font-size: max(0.44rem, 2.57cqw);
  font-style: italic;
}

/* la plaque, posée bien au centre du champ crème */
.livretm.m5.lm-dos .lm-qr {
  left: 25.80%; right: 25.80%; top: 57.98%;
  aspect-ratio: 1;
}

.livretm.m5.lm-dos .lm-marque {
  bottom: 2.52%;
  font-size: max(0.44rem, 1.69cqw);
}

/* ===========================================================================
   m7 — LA FENÊTRE
   Un seul geste tenu sur quatre faces : UN CADRE ÉPAIS QUI S'OUVRE ET SE
   REFERME. Le cadre n'est pas un aplat posé sur la page — c'est LE FOND DE
   PAGE lui-même, et ce qu'on appelle la fenêtre est le champ clair qu'il
   découpe dedans. D'une face à l'autre, seuls les côtés du cadre qui restent
   changent ; le champ, lui, ne change que de forme.

   F1 la couverture : LA FENÊTRE FERMÉE. Le cadre ceint les quatre côtés
      (155 px de montant et de traverse haute, 136 px en pied) ; le panneau
      clair qu'il enferme est doublé, 56 px plus dedans, d'un filet olive de
      4 px qui court sur tout son pourtour. La photo se pose à 52 px de ce
      filet, sur ses trois côtés. Le pied du panneau porte le mot du haut en
      olive, le nom, le lieu en olive, un court filet et le mot d'accueil,
      tous centrés sur l'axe de la photo.
   F2 le mot du propriétaire : LA FENÊTRE S'OUVRE EN LARGEUR. Les montants
      s'en vont, il ne reste que les deux traverses, 300 px chacune ; le
      champ clair passe de bord à bord. Le titre fixe s'écrit EN CLAIR dans
      la traverse haute, le court filet annonce le champ, le mot tombe en
      drapeau à gauche et la signature se pose en bas à droite. Le filet
      intérieur a disparu : une fenêtre ouverte n'a plus de dormant.
   F3 la page libre : LA FENÊTRE PIVOTE D'UN QUART DE TOUR. Les traverses
      s'en vont à leur tour, les deux montants reviennent, 240 px chacun ; le
      champ clair passe de haut en bas. Le court filet est au MÊME y que sur
      F2 — les deux faces intérieures se lisent d'un seul tenant — et le
      tirage se pose en fin de colonne, centré dans le champ.
   F4 le dos : LA FENÊTRE SE REFERME. Le cadre envahit toute la page ; il ne
      reste qu'une lucarne claire de 1000 × 1200 px en son centre, où se pose
      la plaque du QR. Les trois lignes du dos s'écrivent EN CLAIR sur le
      vert, autour de la lucarne : c'est la seule face où le champ ne porte
      aucun texte, et la seule où le court filet ne paraît pas.

   AUCUN COIN ARRONDI sur ce modèle : les quatre rectangles — panneau, champ,
   lucarne, tirages — ont été passés au rayon.ps1, tous répondent « aucune
   mesure », c'est-à-dire un angle vif. Il n'y a donc rien à écrire, mais il
   fallait le vérifier avant de ne rien écrire.

   LE FOND N'EST REDÉCLARÉ NULLE PART, et c'est voulu : le vert du socle EST
   le cadre, sur les quatre faces. Le champ clair, lui, ne vaut ni --fond ni
   --encre (les deux sont le même vert sur ce modèle) — il lui faut sa
   variable privée, --m7-clair, sans quoi l'aplat serait de la couleur exacte
   de son fond et disparaîtrait. C'est le piège relevé sur m2, ici retourné :
   là-bas le crème sur du crème, ici le vert sur du vert.
   =========================================================================== */

.livretm.m7 {
  --fond: #2f3a2c;
  --encre: #2f3a2c;
  --accent: #7a8a5e;
  /* LE CHAMP CLAIR — la fenêtre. Ni le fond ni l'encre ne peuvent la
     peindre : sur ce modèle les deux valent le même vert. */
  --m7-clair: #f5ead8;
  /* Les textes du champ gardent l'encre générale ; ceux qui tombent SUR LE
     CADRE passent au clair, et les deux lignes de la couverture qui sont
     dessinées en olive prennent l'accent. Ces six-là sont écrites en
     VARIABLES et non en hexadécimal : ainsi l'hôte qui change son accent ou
     son papier voit ses zones suivre, au lieu de rester accrochées. */
  --c-sur: var(--accent);
  --c-sous: var(--accent);
  --c-motprop: var(--m7-clair);
  --c-qrtexte: var(--m7-clair);
  --c-fin: var(--m7-clair);
  --c-marque: var(--m7-clair);
  /* le cadre photo vide, relevé sur ses dessins */
  --photo-vide: #d9d2be;
  --photo-vide-encre: #2f3a2c;
  /* les deux traits du modèle, mesurés : 4 px pour le filet du cadre
     intérieur, 4,5 px pour le court filet des trois premières faces */
  --m7-cadre: max(0.12rem, 0.23cqw);
  --m7-filet: max(0.12rem, 0.26cqw);
}

/* LE CHAMP CLAIR est la déco `a` sur les quatre faces : seules ses quatre
   bornes changent. Le cadre autour n'a pas de couche à lui — c'est le fond
   de page que le socle peint déjà. */
.livretm.m7 .lm-deco.a { background: var(--m7-clair); }

/* LE COURT FILET est la déco `c`, au même endroit relatif sur les trois
   faces qui le portent — 768 → 979 px sur ses dessins, centré à la vue. */
/* Bornée aux TROIS faces qui la portent : le dos n'a pas de court filet, et
   une déco sans `top` retombe sur sa position statique, c'est-à-dire collée
   au bord haut de la face. */
.livretm.m7.lm-couv .lm-deco.c,
.livretm.m7.lm-mot .lm-deco.c,
.livretm.m7.lm-libre .lm-deco.c {
  left: 43.94%; width: 12.13%;
  height: var(--m7-filet);
  background: var(--accent);
}

/* ------------------------------------------------------- m7 · F1 couverture
   La fenêtre fermée : le cadre sur les quatre côtés. */

/* le panneau clair — 155 px de cadre partout, 136 px en pied */
.livretm.m7.lm-couv .lm-deco.a {
  left: 8.87%; right: 8.87%; top: 6.25%; bottom: 5.48%;
}

/* le filet olive qui double le panneau, 56 px plus dedans */
.livretm.m7.lm-couv .lm-deco.b {
  left: 12.13%; right: 12.07%; top: 8.55%; bottom: 7.74%;
  border: var(--m7-cadre) solid var(--accent);
}

/* la photo, à 52 px du filet sur ses trois côtés */
.livretm.m7.lm-couv .lm-photo {
  left: 15.33%; right: 15.27%; top: 10.81%; bottom: 38.02%;
}

/* le court filet, entre le lieu et le mot d'accueil */
.livretm.m7.lm-couv .lm-deco.c { top: 81.85%; }

/* le mot du haut : première ligne du pied, en olive, sur l'axe de la photo.
   Le socle le voulait en capitales très espacées ; son dessin ne l'est pas,
   on remet donc l'interlettrage à zéro et la casse à celle de l'hôte. */
.livretm.m7.lm-couv .lm-sur {
  position: absolute;
  left: 15.33%; right: 15.27%; top: 64.57%;
  margin: 0;
  text-align: center;
  font-size: max(0.44rem, 3.12cqw);
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}

/* les trois lignes suivantes, dans la même colonne */
.livretm.m7.lm-couv .lm-corps {
  left: 15.33%; right: 15.27%; top: 69.97%; bottom: 5.48%;
  padding: 0;
  text-align: center;
}
.livretm.m7.lm-couv .lm-nom  { font-size: 5.20cqw; font-weight: 700; line-height: 1.15; }
.livretm.m7.lm-couv .lm-sous { font-size: max(0.44rem, 2.72cqw); margin-top: 3.07cqw; }
/* le mot d'accueil vit SOUS le court filet : la marge lui fait sa place */
.livretm.m7.lm-couv .lm-mot  { font-size: max(0.44rem, 2.64cqw); font-style: italic; margin-top: 9.44cqw; }

/* ------------------------------------------- m7 · F2 le mot du propriétaire
   La fenêtre s'ouvre en largeur : il ne reste que les deux traverses. */

.livretm.m7.lm-mot .lm-deco.a {
  left: 0; right: 0; top: 12.10%; bottom: 12.10%;
}
.livretm.m7.lm-mot .lm-deco.c { top: 17.34%; }

/* le titre FIXE s'écrit dans la traverse haute, donc en clair sur le vert.
   Il est centré DANS la traverse — un centrage de boîte, pas un `top` relevé
   au pixel : la traverse est un bandeau, le titre vit dedans. Interlettrage
   nul, comme sur son dessin. */
.livretm.m7.lm-mot .lm-motprop {
  position: absolute;
  left: 0; right: 0; top: 0; height: 12.10%;
  margin: 0; padding: 0 6%;
  display: flex; align-items: center; justify-content: center;
  text-align: center;
  font-size: max(0.44rem, 3.22cqw);
  font-weight: 700;
  letter-spacing: 0;
}

.livretm.m7.lm-mot .lm-corps {
  left: 9.04%; right: 9.04%; top: 21.43%; bottom: 19.35%;
  padding: 0;
}
.livretm.m7.lm-mot .lm-proprio { font-size: max(0.44rem, 2.98cqw); line-height: 1.5; }

.livretm.m7.lm-mot .lm-signe {
  font-size: max(0.44rem, 2.78cqw);
  font-style: italic;
}

/* ----------------------------------------------------- m7 · F3 la page libre
   La fenêtre pivote d'un quart de tour : les deux montants, rien d'autre. */

.livretm.m7.lm-libre .lm-deco.a {
  left: 13.73%; right: 13.73%; top: 0; bottom: 0;
}
/* au même y que sur F2 : les deux faces intérieures se lisent ensemble */
.livretm.m7.lm-libre .lm-deco.c { top: 17.34%; }

.livretm.m7.lm-libre .lm-ptitre {
  position: absolute;
  left: 19.05%; right: 19.05%; top: 11.95%;
  margin: 0;
  text-align: center;
  font-size: max(0.44rem, 3.04cqw);
  font-weight: 700;
}

/* la colonne : le texte en tête, le tirage EN FIN DE COLONNE. Sans photo,
   la page ne montre qu'un blanc en pied — jamais un trou au milieu. */
.livretm.m7.lm-libre .lm-corps {
  left: 19.05%; right: 19.05%; top: 22.39%; bottom: 12.90%;
  padding: 0;
  display: flex; flex-direction: column;
}
.livretm.m7.lm-libre .lm-ptexte { font-size: max(0.44rem, 3.22cqw); line-height: 1.5; min-height: 0; }

/* le tirage est CENTRÉ dans le champ, à la différence de m1 et m2 qui le
   posaient au fil de la colonne : sur son dessin il laisse 184 px de champ
   à gauche et exactement autant à droite. */
.livretm.m7.lm-libre .lm-photo2 {
  width: 83.2%;
  aspect-ratio: 1.5;
  margin-top: auto;
  align-self: center;
  flex: none;
}

/* ------------------------------------------------------------- m7 · F4 le dos
   La fenêtre se referme : le cadre prend toute la page, il ne reste qu'une
   lucarne au centre. Les trois lignes s'écrivent SUR le cadre, pas dedans. */

.livretm.m7.lm-dos .lm-deco.a {
  left: 21.40%; right: 21.40%; top: 25.81%; bottom: 25.81%;
}

.livretm.m7.lm-dos .lm-corps { inset: 0; padding: 0; }

.livretm.m7.lm-dos .lm-qrtexte {
  position: absolute;
  left: 10%; right: 10%; top: 15.20%;
  margin: 0;
  text-align: center;
  font-size: max(0.44rem, 3.07cqw);
  font-weight: 700;
}

/* la plaque du QR, posée dans la lucarne */
.livretm.m7.lm-dos .lm-qr {
  left: 28.26%; right: 28.26%; top: 30.65%;
  aspect-ratio: 1;
}

.livretm.m7.lm-dos .lm-fin {
  position: absolute;
  left: 10%; right: 10%; top: 78.92%;
  margin: 0;
  text-align: center;
  font-size: max(0.44rem, 2.89cqw);
  font-style: italic;
}

.livretm.m7.lm-dos .lm-marque {
  bottom: 4.95%;
  font-size: max(0.44rem, 2.07cqw);
}

/* ===========================================================================
   m8 — LA TRAME
   Le plus nu des sept modèles : pas un aplat, pas un panneau, rien qu'un
   grand blanc de papier, un filet d'accent en pied de CHAQUE face, et — sur
   les deux faces qui portent une image — un petit tirage incliné de −6°
   posé sur son ombre dure. Tout se centre sur l'axe de la page, tout est
   petit : c'est le vide qui fait le dessin.

   F1 la couverture : le tirage seul, en haut, 562 × 704 px (portrait 0,8),
      incliné de −6°, doublé d'un rectangle d'accent décalé de 23 px en
      DIAGONALE — une ombre portée dure, sans le moindre flou. Sous lui, à
      mi-page, quatre lignes centrées : le mot du haut en accent, le nom en
      grand, le lieu en accent, le mot d'accueil en italique.
   F2 le mot du propriétaire : le titre fixe en capitales, centré ; un filet
      PLEIN de 5 px juste dessous, tenu d'une marge à l'autre ; le mot en
      drapeau à gauche, tout en haut de la colonne ; la signature en bas à
      droite. Entre les deux, du vide — c'est voulu, c'est le modèle.
   F3 la page libre : la même grammaire que F2 — titre centré, filet, texte
      en drapeau — et le tirage revient en pied de colonne, cette fois en
      paysage (699 × 470 px), incliné du même −6°, sur la même ombre dure.
   F4 le dos : la ligne du QR centrée, un filet COURT de 212 px dessous au
      lieu du long, la plaque du QR cernée d'un filet d'encre de 4 px, le mot
      de fin en italique, et le © Booky en accent sous le filet de pied.

   LE FILET DE PIED EST LE MÊME SUR LES QUATRE FACES : x 155 → 1592,
   y 2284, 3 px. C'est lui qui fait la série ; il occupe la déco `b`
   partout, et la déco `a` ne sert qu'aux trois faces qui ont un filet de
   tête. La couverture n'en emploie qu'une seule.

   Les deux tirages sont retranscrits en `box-shadow` sans flou plutôt qu'en
   déco : l'ombre est EXACTEMENT le tirage décalé, et celui de la page libre
   vit dans le flux — une déco absolue ne l'y suivrait pas. Le décalage est
   de 23 px en diagonale SUR LA PAGE ; comme la boîte a tourné de −6°, on le
   ramène dans son repère (20,4 px / 25,4 px), sans quoi l'ombre pencherait
   d'un côté.
   =========================================================================== */

.livretm.m8 {
  --fond: #fbf6ec;
  --encre: #2f3a2c;
  --accent: #7a8a5e;
  /* les trois lignes qui quittent l'encre pour l'accent, relevées sur ses
     dessins : le mot du haut, le lieu, et le © Booky du dos */
  --c-sur: var(--accent);
  --c-sous: var(--accent);
  --c-marque: var(--accent);
  --photo-vide: #d9d2be;
  --photo-vide-encre: #2f3a2c;
  /* LA PLAQUE DU QR. Sur son dessin elle est du crème de la page, cernée
     d'un filet : pas de carré blanc. On garde le garde-fou — c'est une
     valeur FIXE et claire, jamais var(--fond) — mais on la met à son crème
     pour que la plaque ne se voie pas sur le papier. */
  --qr-plaque: #fbf6ec;
  /* le geste du modèle : l'inclinaison et l'ombre des deux tirages */
  --m8-incline: -6deg;
  --m8-ombre-x: 1.18cqw;      /* 20,4 px : les 23 px de la page, redressés */
  --m8-ombre-y: 1.45cqw;      /* 25,4 px : idem sur l'autre axe */
  /* les deux filets : 3 px pour le pied et le court, 5 px sous les titres */
  --m8-filet: max(0.12rem, 0.17cqw);
  --m8-filet-fort: max(0.12rem, 0.29cqw);
}

/* ------------------------------------------------------- m8 · les communs
   Le filet de pied, identique sur les quatre faces : c'est la trame. */
.livretm.m8 .lm-deco.b {
  left: 8.87%; right: 8.87%;
  top: 92.10%;
  height: var(--m8-filet);
  background: var(--accent);
}

/* les trois titres de tête — mot du propriétaire, titre de page, ligne du
   QR — partagent la même boîte centrée ; seules leur hauteur et leur taille
   changent, chacune mesurée sur sa face */
.livretm.m8.lm-mot .lm-motprop,
.livretm.m8.lm-libre .lm-ptitre,
.livretm.m8.lm-dos .lm-qrtexte {
  position: absolute;
  left: 8.01%; right: 8.01%;
  margin: 0;
  text-align: center;
  font-weight: 700;
}

/* le filet de tête des faces 2 et 3, plein et plus épais que celui du pied */
.livretm.m8.lm-mot .lm-deco.a,
.livretm.m8.lm-libre .lm-deco.a {
  left: 8.87%; right: 8.87%;
  top: 18.95%;
  height: var(--m8-filet-fort);
  background: var(--accent);
}

/* --------------------------------------------------------- m8 · F1 couverture */

/* le tirage, seul objet de la page : 32,18 % × 28,39 %, centré sur l'axe,
   incliné, et posé sur son ombre dure */
.livretm.m8.lm-couv .lm-photo {
  left: 33.91%; right: 33.91%;
  top: 13.61%; bottom: 58.00%;
  transform: rotate(var(--m8-incline));
  box-shadow: var(--m8-ombre-x) var(--m8-ombre-y) 0 var(--accent);
}

/* le mot du haut vit HORS du corps (atelier.js le pose avant lui) : il se
   place donc seul, sur l'axe, 120 px au-dessus du nom */
.livretm.m8.lm-couv .lm-sur {
  position: absolute;
  left: 8.01%; right: 8.01%; top: 51.02%;
  margin: 0;
  text-align: center;
  font-size: max(0.44rem, 2.53cqw);
  font-weight: 700;
  letter-spacing: 0;          /* son dessin n'espace pas, et n'écrit pas en */
  text-transform: none;       /* capitales : les deux défauts du socle sautent */
}

/* les trois lignes du corps, centrées, à mi-page — le blanc du bas fait
   partie du dessin, on ne le remplit pas */
.livretm.m8.lm-couv .lm-corps {
  left: 8.01%; right: 8.01%; top: 55.88%; bottom: 7.90%;
  padding: 0;
  text-align: center;
}
.livretm.m8.lm-couv .lm-nom  { font-size: 5.43cqw; font-weight: 700; line-height: 1.15; }
.livretm.m8.lm-couv .lm-sous { font-size: max(0.44rem, 2.64cqw); margin-top: 2.83cqw; }
.livretm.m8.lm-couv .lm-mot  { font-size: max(0.44rem, 2.62cqw); font-style: italic; margin-top: 6.21cqw; }

/* ------------------------------------------- m8 · F2 le mot du propriétaire */

.livretm.m8.lm-mot .lm-motprop {
  top: 13.54%;
  font-size: max(0.44rem, 3.22cqw);
  letter-spacing: 0;          /* capitales serrées : rien d'ajouté au dessin */
}

/* le mot tombe en haut de la colonne et n'est pas centré : c'est une lettre */
.livretm.m8.lm-mot .lm-corps {
  left: 8.01%; right: 8.01%; top: 24.66%; bottom: 15.63%;
  padding: 0;
}
.livretm.m8.lm-mot .lm-proprio { font-size: max(0.44rem, 2.98cqw); line-height: 1.5; }

.livretm.m8.lm-mot .lm-signe {
  font-size: max(0.44rem, 2.7cqw);
}

/* ----------------------------------------------------- m8 · F3 la page libre */

.livretm.m8.lm-libre .lm-ptitre {
  top: 13.58%;
  font-size: max(0.44rem, 3.04cqw);
}

/* la colonne : le texte en tête, le tirage EN FIN DE COLONNE. Sans photo la
   page ne montre qu'un blanc en pied — jamais un trou au milieu. */
.livretm.m8.lm-libre .lm-corps {
  left: 8.01%; right: 8.01%; top: 24.78%; bottom: 16.76%;
  padding: 0;
  display: flex; flex-direction: column;
}
.livretm.m8.lm-libre .lm-ptexte { font-size: max(0.44rem, 3.17cqw); line-height: 1.5; min-height: 0; }

/* le tirage en paysage, centré dans la colonne, incliné et ombré comme celui
   de la couverture — la boîte de flux reste droite, seul le dessin penche */
.livretm.m8.lm-libre .lm-photo2 {
  width: 47.62%;
  aspect-ratio: 1.49;
  margin-top: auto;
  align-self: center;
  flex: none;
  transform: rotate(var(--m8-incline));
  box-shadow: var(--m8-ombre-x) var(--m8-ombre-y) 0 var(--accent);
}

/* ------------------------------------------------------------- m8 · F4 le dos */

.livretm.m8.lm-dos .lm-qrtexte {
  top: 13.46%;
  font-size: max(0.44rem, 2.82cqw);
}

/* ici le filet de tête est COURT et centré : 212 px au lieu de 1438 */
.livretm.m8.lm-dos .lm-deco.a {
  left: 43.94%; width: 12.13%;
  top: 18.75%;
  height: var(--m8-filet);
  background: var(--accent);
}

/* la plaque, cernée d'un filet d'encre de 4 px : le seul contour du modèle */
.livretm.m8.lm-dos .lm-qr {
  left: 33.87%; right: 33.87%; top: 31.85%;
  aspect-ratio: 1;
  border: max(0.12rem, 0.23cqw) solid var(--encre);
}

.livretm.m8.lm-dos .lm-corps { inset: 0; padding: 0; }

.livretm.m8.lm-dos .lm-fin {
  position: absolute;
  left: 8.01%; right: 8.01%; top: 63.61%;
  margin: 0;
  text-align: center;
  font-size: max(0.44rem, 2.89cqw);
}

/* le © Booky passe SOUS le filet de pied, et en accent */
.livretm.m8.lm-dos .lm-marque {
  bottom: 3.16%;
  font-size: max(0.44rem, 1.69cqw);
}

/* ============================================================================
   LE QUATRE PAGES — 14,8 × 21 cm, deux feuilles pliées, HUIT faces.
   Créé le 15/08/2026. Ses images font 1748 × 2480 px, EXACTEMENT celles de la
   double page : la règle de conversion ne se recalcule pas, 1 cqw = px ÷ 17,48
   comme le 14/08, et les corps de texte déjà calibrés restent valables.

   CE QUI COMMANDE TOUT LE CHANTIER, trouvé en comparant ses 56 images aux 28
   de la double page, empreinte par empreinte : LE QUATRE PAGES EST LA DOUBLE
   PAGE ALLONGÉE. Les faces 1, 2 et 3 sont IDENTIQUES AU PIXEL sur six modèles
   sur sept ; le dos l'est sur deux. Dix-neuf faces sur cinquante-six sont donc
   déjà retranscrites et déjà vérifiées.

   ON NE RETRANSCRIT PAS CE QUI EST DÉJÀ JUSTE — on le RÉUTILISE. Les faces 1
   à 3 portent les MÊMES classes que la double page (`lm-couv`, `lm-mot`,
   `lm-libre`) et donc les mêmes règles, à la lettre. Bénéfice au-delà de
   l'économie : les deux formats ne pourront plus diverger par accident.

   QUATRE FACES SONT NEUVES, et elles seules ont leur classe :
     `lm-tenue`   face 4 — une photo TENUE PAR LE DÉCOR
     `lm-libre2`  face 5 — la deuxième page libre
     `lm-libre3`  face 6 — la troisième
     `lm-tenue2`  face 7 — la seconde face photo
   Le plan est celui du carnet paysage, à ceci près qu'ici tout est debout.

   ET `lm-4p` MARQUE LE FORMAT sur les huit faces. Elle ne sert qu'aux DEUX
   endroits où ses dessins s'écartent de la double page, mesurés et pas
   devinés : la couverture de m2 (le mot du haut rapetissé, monté, décalé) et
   le dos de m1, m4, m5, m7 et m8 (redessiné). Partout ailleurs elle ne fait
   rien — et c'est exactement ce qu'on veut d'un marqueur de format.
   ========================================================================= */

/* ===========================================================================
   m1 — LE BANDEAU, ses quatre faces neuves et son dos
   Le L tourne, comme sur le carnet mais debout : montant gauche + seuil en
   couverture, montant DROIT + seuil en face 4, montant gauche seul en 5,
   montant droit seul en 6, et BANDEAU EN TÊTE + montant gauche en 7. Le
   tirage suit le mouvement : son ombre dure tombe en bas-droite tant que
   l'image saigne par le haut, et repasse en haut-gauche quand elle saigne
   par le bas.
   =========================================================================== */

/* ------------------------------------------------------- m1 · F4 la photo tenue
   Le L retourné : montant à DROITE, seuil en pied. Le tirage saigne par le
   haut et par la gauche, son ombre ne se voit donc qu'à droite et en bas, et
   un court filet olive se pose sous lui dans le blanc du seuil. Vide, le
   décor tient la face tout seul. */

.livretm.m1.lm-tenue .lm-deco.a {
  left: 0; top: 0; right: 24.03%; bottom: 16.94%;
  background: var(--m1-clair);
}
.livretm.m1.lm-tenue .lm-deco.b {
  left: 43.71%; width: 12.59%; top: 79.03%;
  height: max(0.12rem, 0.34cqw);
  background: var(--accent);
}
.livretm.m1.lm-tenue .lm-photo3 {
  left: 0; top: 0; right: 28.49%; bottom: 27.42%;
  box-shadow: 1.72cqw 1.72cqw 0 var(--accent);
}

/* --------------------------------------------- m1 · F5 et F6 les pages libres
   La bande ALTERNE de côté d'une page à l'autre — gauche en 5, droite en 6 —
   et toute la colonne suit. C'est le rythme que sa dictée exige : trois pages
   libres, jamais deux fois la même image. */

.livretm.m1.lm-libre2 .lm-deco.a {
  left: 24.03%; right: 0; top: 0; bottom: 0;
  background: var(--m1-clair);
}
.livretm.m1.lm-libre3 .lm-deco.a {
  left: 0; right: 24.03%; top: 0; bottom: 0;
  background: var(--m1-clair);
}

.livretm.m1.lm-libre2 .lm-deco.b,
.livretm.m1.lm-libre3 .lm-deco.b {
  width: 12.59%; top: 25.00%;
  height: max(0.12rem, 0.34cqw);
  background: var(--accent);
}
.livretm.m1.lm-libre2 .lm-deco.b { left: 35.47%; }
.livretm.m1.lm-libre3 .lm-deco.b { left: 9.15%; }

/* le titre dressé dans le montant, centré sur toute la hauteur — même corps
   que celui de la page libre de la double page, mesuré identique */
.livretm.m1.lm-libre2 .lm-ptitre,
.livretm.m1.lm-libre3 .lm-ptitre {
  position: absolute;
  width: 24.03%;
  top: 0; bottom: 0;
  margin: 0; padding: 6% 0;
  display: flex; align-items: center; justify-content: center;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-size: 6.75cqw;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}
.livretm.m1.lm-libre2 .lm-ptitre { left: 0; }
.livretm.m1.lm-libre3 .lm-ptitre { right: 0; }

/* la colonne : le texte en tête, le tirage EN FIN DE COLONNE. Sans photo, la
   page ne montre qu'un blanc en pied — jamais un trou au milieu. */
.livretm.m1.lm-libre2 .lm-corps,
.livretm.m1.lm-libre3 .lm-corps {
  top: 29.40%; bottom: 12.50%;
  padding: 0;
  display: flex; flex-direction: column;
}
.livretm.m1.lm-libre2 .lm-corps { left: 35.47%; right: 7.44%; }
.livretm.m1.lm-libre3 .lm-corps { left: 9.15%; right: 33.75%; }

.livretm.m1.lm-libre2 .lm-ptexte,
.livretm.m1.lm-libre3 .lm-ptexte { font-size: max(0.44rem, 3.13cqw); line-height: 1.5; min-height: 0; }

.livretm.m1.lm-libre2 .lm-photo2,
.livretm.m1.lm-libre3 .lm-photo2 {
  width: 70.14%;
  aspect-ratio: 1.4894;
  margin-top: auto;
  flex: none;
  /* l'ombre portée DURE, sans flou — le geste de la couverture, repris */
  box-shadow: 1.72cqw 1.72cqw 0 var(--accent);
}

/* ------------------------------------------------- m1 · F7 la seconde photo
   Le L tourne d'un quart de plus : BANDEAU EN TÊTE + montant gauche. Le
   tirage saigne cette fois par le bas et par la droite, donc son ombre a
   changé de sens avec lui — elle ne se voit qu'en haut et à gauche. */

.livretm.m1.lm-tenue2 .lm-deco.a {
  left: 24.03%; top: 16.94%; right: 0; bottom: 0;
  background: var(--m1-clair);
}
.livretm.m1.lm-tenue2 .lm-deco.b {
  left: 43.71%; width: 12.59%; top: 21.37%;
  height: max(0.12rem, 0.34cqw);
  background: var(--accent);
}
.livretm.m1.lm-tenue2 .lm-photo3 {
  left: 28.49%; top: 27.42%; right: 0; bottom: 0;
  box-shadow: -1.72cqw -1.72cqw 0 var(--accent);
}

/* --------------------------------------------------------- m1 · F8 le dos
   REDESSINÉ pour ce format — c'est l'un des deux seuls endroits où le quatre
   pages s'écarte de la double page, et `lm-4p` est là pour ça. La bande crème
   du PIED a disparu : le vert descend jusqu'au bord, et le © Booky s'écrit
   dessus, en clair. La plaque du QR et la bande de tête, elles, ne bougent
   pas d'un pixel — mesurées identiques. Les trois textes remontent. */

.livretm.m1.lm-dos.lm-4p .lm-deco.b { display: none; }

.livretm.m1.lm-dos.lm-4p .lm-qrtexte {
  top: 4.23%; height: auto;
  display: block;
  font-size: max(0.44rem, 3.39cqw);
}
.livretm.m1.lm-dos.lm-4p .lm-fin {
  top: 78.88%;
  font-size: max(0.44rem, 3.02cqw);
}
.livretm.m1.lm-dos.lm-4p .lm-marque {
  top: 91.81%; bottom: auto; height: auto;
  display: block;
  /* il sort sur le vert : il prend l'encre du modèle, pas le sombre du pied */
  color: var(--encre);
}

/* ===========================================================================
   m2 — LE CHAMP, ses quatre faces neuves et sa couverture retouchée
   Le grand panneau très arrondi ne change pas : ses faces 2, 3 et 8 sont au
   pixel celles de la double page. Ce que le format ajoute, c'est le
   DÉPLACEMENT DU TIRAGE d'une page libre à l'autre — en pied sur la 5, en
   tête sur la 6 — et deux faces photo tenues par une PASTILLE en stade, qui
   descend en pied sur la 4 et remonte en tête sur la 7.
   =========================================================================== */

/* ------------------------------------------------- m2 · F1 la couverture
   LE SEUL ENDROIT où la couverture du quatre pages s'écarte de celle de la
   double page, et il ne touche qu'un mot : le mot du haut est plus petit
   (29 px d'encre au lieu de 47), monté de 28 px et décalé de 49 px vers la
   droite. Tout le reste de la face — la photo à franc bord, le panneau, le
   filet, les trois lignes — est identique au pixel. Mesuré, pas déduit. */

.livretm.m2.lm-couv.lm-4p .lm-sur {
  left: 16.13%; top: 8.30%;
  font-size: max(0.44rem, 2.10cqw);
}

/* --------------------------------------------- m2 · F5 et F6 les pages libres
   Le même panneau que la page libre de la double page, et LE TIRAGE SE
   DÉPLACE : en pied sur la 5, en tête sur la 6. C'est ce déplacement qui
   fait qu'on ne lit pas trois fois la même page. Le titre et son filet
   remontent de dix à vingt pixels — relevé, pas supposé. */

.livretm.m2.lm-libre2,
.livretm.m2.lm-libre3 { background: var(--encre); }

.livretm.m2.lm-libre2 .lm-deco.a,
.livretm.m2.lm-libre3 .lm-deco.a { top: 13.71%; bottom: 5.65%; }
.livretm.m2.lm-libre2 .lm-deco.b,
.livretm.m2.lm-libre3 .lm-deco.b { top: 25.00%; }

.livretm.m2.lm-libre2 .lm-ptitre,
.livretm.m2.lm-libre3 .lm-ptitre {
  position: absolute;
  left: 12.30%; right: 12.30%; top: 18.79%;
  margin: 0;
  text-align: center;
  font-size: 3.83cqw;
  font-weight: 700;
}

.livretm.m2.lm-libre2 .lm-corps,
.livretm.m2.lm-libre3 .lm-corps {
  left: 12.30%; right: 12.30%; top: 30.24%;
  padding: 0;
  display: flex; flex-direction: column;
}
/* c'est la BASE de la colonne qui place le tirage : il est poussé en fin de
   colonne par `margin-top: auto`, donc déplacer le pied le déplace lui. */
.livretm.m2.lm-libre2 .lm-corps,
.livretm.m2.lm-libre3 .lm-corps { bottom: 12.94%; }

.livretm.m2.lm-libre2 .lm-ptexte,
.livretm.m2.lm-libre3 .lm-ptexte { font-size: max(0.44rem, 3.23cqw); line-height: 1.5; min-height: 0; }

.livretm.m2.lm-libre2 .lm-photo2,
.livretm.m2.lm-libre3 .lm-photo2 {
  width: 68.2%;
  margin-top: auto;
  flex: none;
  border-radius: 3.32cqw;
  /* CENTRÉ dans la colonne, alors que celui de la double page est fer à
     gauche : sur ses deux dessins le tirage est bien à 428 px, soit
     exactement le milieu des 1 318 px de justification. */
  align-self: center;
}
.livretm.m2.lm-libre2 .lm-photo2 { aspect-ratio: 1.5; }

/* LA FACE 6 INVERSE L'ORDRE, et c'est SON dessin qui le dit : le tirage y
   vient AVANT le texte — mesuré, la photo à 760 et le texte à 1451. Cela
   entre en tension avec sa règle « la photo toujours en fin de colonne,
   vide elle ne laisse qu'un blanc en pied » : ici, vide, elle laisserait un
   blanc EN TÊTE. Je retranscris son dessin, comme c'est la règle du
   chantier, et je le lui signale — à lui de trancher. `order` déplace la
   photo sans toucher au HTML : elle reste écrite après le texte, donc lue
   après lui par un lecteur d'écran. */
.livretm.m2.lm-libre3 .lm-photo2 {
  aspect-ratio: 1.607;
  order: -1;
  margin-top: 0.57cqw;
  margin-bottom: 0;
}
.livretm.m2.lm-libre3 .lm-ptexte { margin-top: 6.35cqw; }

/* ------------------------------------------- m2 · F4 et F7 les faces photo
   La photo tient toute la page, et le décor la TIENT par une PASTILLE en
   stade cernée de crème — en pied sur la 4, en tête sur la 7. Le même objet,
   jamais au même endroit. Les deux sont en vert profond sur son dessin :
   l'olive reste réservé aux filets dans ce modèle. */

.livretm.m2.lm-tenue .lm-photo3,
.livretm.m2.lm-tenue2 .lm-photo3 { inset: 0; }

.livretm.m2.lm-tenue .lm-deco.a,
.livretm.m2.lm-tenue2 .lm-deco.a {
  z-index: 3;                      /* la pastille se pose SUR la photo */
  background: var(--encre);
  border-radius: 999px;            /* un stade : le rayon vaut la demi-hauteur */
}
/* le filet intérieur du panneau n'a rien à faire dans une pastille */
.livretm.m2.lm-tenue .lm-deco.a::after,
.livretm.m2.lm-tenue2 .lm-deco.a::after { content: none; }

/* LES LARGEURS SONT RELEVÉES À MI-HAUTEUR, et c'est tout le point : ma
   première mesure les avait prises sur une coupe proche du bout arrondi,
   où la forme est déjà rentrée de trente pixels — la pastille sortait donc
   trop étroite des deux côtés. Sur une forme ronde, on mesure là où elle
   est la plus large, jamais ailleurs. */
.livretm.m2.lm-tenue .lm-deco.a {
  left: 22.60%; right: 22.60%; top: 83.87%; bottom: 8.87%;
  box-shadow: 0 0 0 1.2cqw var(--fond);
}
.livretm.m2.lm-tenue2 .lm-deco.a {
  left: 21.74%; right: 21.74%; top: 6.65%; bottom: 85.69%;
  box-shadow: 0 0 0 1.49cqw var(--fond);
}

/* ===========================================================================
   m3 — L'ÉCUSSON, ses quatre faces neuves
   Le modèle le plus économe du lot : ses faces 1, 2, 3 ET son dos sont au
   pixel ceux de la double page. Il ne reste que les quatre du milieu — et
   c'est là que son geste se voit, puisque LE CARTOUCHE CHANGE D'ÉCHELLE :
   plein format pour les faces photo 4, grand pour les pages libres 5 et 6,
   et RÉDUIT sur la face 7, qui pose en plus une COLLINE en pied — l'aplat
   plus large que la page dont seul le sommet arrondi se voit, emprunté à sa
   couverture de la double page.
   =========================================================================== */

/* le court filet n'existe que sur les pages libres : sur les deux faces
   photo il n'a pas de `top`, et une déco sans `top` retombe collée au bord
   haut. On l'éteint plutôt que de compter sur sa hauteur nulle. */
.livretm.m3.lm-tenue .lm-deco.b,
.livretm.m3.lm-tenue2 .lm-deco.b { display: none; }

/* ------------------------------------------------- m3 · F4 le plein format
   Le cartouche n'est plus qu'une marge de 30 px autour de la photo : c'est
   l'échelle maximale du modèle, et elle ne se retrouve nulle part ailleurs. */

.livretm.m3.lm-tenue .lm-deco.a {
  left: 6.46%; right: 6.41%; top: 6.45%; bottom: 6.45%;
}
.livretm.m3.lm-tenue .lm-photo3 {
  left: 8.18%; right: 8.12%; top: 7.66%; bottom: 7.66%;
  border-radius: var(--m3-tirage);
}

/* --------------------------------------------- m3 · F5 et F6 les pages libres
   Le grand cartouche, et le TIRAGE SE DÉPLACE : en pied sur la 5, en tête
   sur la 6 — où le texte passe DERRIÈRE lui, comme sur son dessin. Le
   tirage est CERNÉ d'un filet olive à 26 px : c'est la grammaire photo du
   modèle, celle qui le distingue de l'ombre dure de m1. */

.livretm.m3.lm-libre2 .lm-deco.a,
.livretm.m3.lm-libre3 .lm-deco.a {
  left: 6.46%; right: 6.41%; top: 6.45%; bottom: 6.45%;
}
.livretm.m3.lm-libre2 .lm-deco.b,
.livretm.m3.lm-libre3 .lm-deco.b {
  top: 24.19%;
  height: max(0.12rem, 0.23cqw);
}

.livretm.m3.lm-libre2 .lm-ptitre,
.livretm.m3.lm-libre3 .lm-ptitre {
  position: absolute;
  left: 12.30%; right: 12.30%; top: 16.83%;
  margin: 0;
  text-align: center;
  font-size: 3.56cqw;
  font-weight: 700;
}

.livretm.m3.lm-libre2 .lm-corps,
.livretm.m3.lm-libre3 .lm-corps {
  left: 12.30%; right: 12.30%; top: 29.48%; bottom: 14.92%;
  padding: 0;
  display: flex; flex-direction: column;
}
.livretm.m3.lm-libre2 .lm-ptexte,
.livretm.m3.lm-libre3 .lm-ptexte { font-size: max(0.44rem, 3.21cqw); line-height: 1.5; min-height: 0; }

.livretm.m3.lm-libre2 .lm-photo2,
.livretm.m3.lm-libre3 .lm-photo2 {
  width: 70.56%;
  align-self: center;
  flex: none;
  border-radius: var(--m3-tirage);
  outline: max(0.12rem, 0.23cqw) solid var(--accent);
  outline-offset: 1.49cqw;
}
.livretm.m3.lm-libre2 .lm-photo2 {
  aspect-ratio: 1.55;
  margin-top: auto;
}
/* LA FACE 6 INVERSE L'ORDRE, comme celle de m2 — et c'est SON dessin qui le
   dit sur les deux : le tirage à 730, le texte à 1451. Deux modèles sur deux,
   ce n'est plus un accident de dessin, c'est le parti de la face 6. */
.livretm.m3.lm-libre3 .lm-photo2 {
  aspect-ratio: 1.6607;
  order: -1;
  margin-top: 0;
}
.livretm.m3.lm-libre3 .lm-ptexte { margin-top: 8.01cqw; }

/* ------------------------------------------------------ m3 · F7 le réduit
   Le cartouche se RESSERRE et remonte, et la COLLINE prend le pied : un
   aplat plus large que la page, dont seul le sommet arrondi se voit. C'est
   la même figure que le pied de sa couverture sur la double page, avec un
   arc plus plat — 244 px de rayon contre 320, relevé sur l'écart entre son
   sommet au centre (1740) et au bord (1756). */

.livretm.m3.lm-tenue2 .lm-deco.a {
  left: 15.33%; right: 15.27%; top: 8.87%; bottom: 34.27%;
}
.livretm.m3.lm-tenue2 .lm-photo3 {
  left: 17.28%; right: 17.22%; top: 10.24%; bottom: 35.65%;
  border-radius: var(--m3-tirage);
}
.livretm.m3.lm-tenue2 .lm-deco.c {
  left: -8.41%; right: -8.41%; top: 70.16%; bottom: 0;
  background: var(--m3-clair);
  border-radius: 13.96cqw 13.96cqw 0 0;
}

/* ===========================================================================
   m4 — LA RÉGLURE, ses quatre faces neuves et son dos
   Le cahier réglé, tenu sur huit faces. Ses paires de filets ne changent pas
   de nature — un gras de 7 px, un mince de 3, l'entre-deux vide — mais elles
   se déplacent, et surtout LA LAISSE CHANGE : sur les faces 1 à 3 et sur la
   tête de la 4, les filets courent de 155 à 1592, symétriques ; à partir du
   pied de la 4 ils passent de 212 à 1649, décalés de 57 px vers le bord
   extérieur. C'est la marge de reliure d'un cahier broché, et elle est
   dessinée : ce n'est pas une valeur que j'ai choisie, c'est une valeur que
   j'ai relevée.
   =========================================================================== */

/* LES DÉCOS QUI NE SERVENT PAS SUR CES FACES SONT ÉTEINTES. Sans ça, une
   déco sans `top` retombe à sa position statique, c'est-à-dire collée au
   bord HAUT — le court filet centré du modèle apparaissait ainsi en travers
   de la face 7, sur huit pixels de haut. Même famille de défaut que les
   décos fantômes du 14/08, et même remède : on borne. */
.livretm.m4.lm-tenue .lm-deco.c,
.livretm.m4.lm-tenue .lm-deco.d,
.livretm.m4.lm-libre2 .lm-deco.c,
.livretm.m4.lm-libre2 .lm-deco.d,
.livretm.m4.lm-libre3 .lm-deco.c,
.livretm.m4.lm-libre3 .lm-deco.d,
.livretm.m4.lm-tenue2 .lm-deco.b,
.livretm.m4.lm-tenue2 .lm-deco.c,
.livretm.m4.lm-tenue2 .lm-deco.d { display: none; }

/* la laisse DÉCALÉE des faces intérieures — 212 à 1649 sur son dessin */
.livretm.m4.lm-tenue .lm-deco.b,
.livretm.m4.lm-libre2 .lm-deco.a,
.livretm.m4.lm-libre2 .lm-deco.b,
.livretm.m4.lm-libre3 .lm-deco.a,
.livretm.m4.lm-libre3 .lm-deco.b,
.livretm.m4.lm-tenue2 .lm-deco.a,
.livretm.m4.lm-dos.lm-4p .lm-deco.a,
.livretm.m4.lm-dos.lm-4p .lm-deco.b { left: 12.13%; right: 5.61%; }

/* ------------------------------------------------------ m4 · F4 la photo
   Une paire en tête, une paire en pied, et entre elles un tirage à ombre
   dure. Sa tête garde la laisse des trois premières faces, son pied prend
   déjà la nouvelle : le décalage commence là. */

.livretm.m4.lm-tenue .lm-deco.a {
  top: 8.55%; height: 1.03cqw;
  border-top: var(--m4-gras) solid var(--accent);
  border-bottom: var(--m4-mince) solid var(--accent);
}
.livretm.m4.lm-tenue .lm-deco.b {
  top: 91.94%; height: 0.80cqw;
  border-top: var(--m4-mince) solid var(--accent);
  border-bottom: var(--m4-gras) solid var(--accent);
}
.livretm.m4.lm-tenue .lm-photo3 {
  left: 12.13%; right: 13.50%; top: 14.19%; bottom: 25.32%;
  box-shadow: 1.60cqw 1.60cqw 0 var(--accent);
}

/* --------------------------------------------- m4 · F5 et F6 les pages libres
   Deux paires — celle de tête et celle qui ferme le titre — puis le tirage,
   qui CHANGE DE CÔTÉ : contre la marge de gauche sur la 5, contre celle de
   droite sur la 6, où il passe en plus AVANT le texte. */

.livretm.m4.lm-libre2 .lm-deco.a,
.livretm.m4.lm-libre3 .lm-deco.a,
.livretm.m4.lm-tenue2 .lm-deco.a,
.livretm.m4.lm-dos.lm-4p .lm-deco.a {
  top: 6.25%; height: 1.03cqw;
  border-top: var(--m4-gras) solid var(--accent);
  border-bottom: var(--m4-mince) solid var(--accent);
}
.livretm.m4.lm-libre2 .lm-deco.b,
.livretm.m4.lm-libre3 .lm-deco.b {
  top: 16.94%; height: 0.80cqw;
  border-top: var(--m4-mince) solid var(--accent);
  border-bottom: var(--m4-gras) solid var(--accent);
}

.livretm.m4.lm-libre2 .lm-ptitre,
.livretm.m4.lm-libre3 .lm-ptitre {
  position: absolute;
  left: 12.13%; right: 5.61%; top: 9.96%;
  margin: 0;
  text-align: center;
  font-size: 3.56cqw;
  font-weight: 700;
}

.livretm.m4.lm-libre2 .lm-corps {
  left: 12.13%; right: 5.61%; top: 22.22%; bottom: 13.23%;
  padding: 0;
  display: flex; flex-direction: column;
}
.livretm.m4.lm-libre3 .lm-corps {
  left: 12.13%; right: 5.61%; top: 22.58%; bottom: 13.23%;
  padding: 0;
  display: flex; flex-direction: column;
}
.livretm.m4.lm-libre2 .lm-ptexte,
.livretm.m4.lm-libre3 .lm-ptexte { font-size: max(0.44rem, 3.21cqw); line-height: 1.5; min-height: 0; }

/* le tirage : angles vifs et ombre dure, la grammaire du modèle. Il ne suit
   pas la colonne — il se cale contre une marge, et il change de marge. */
.livretm.m4.lm-libre2 .lm-photo2,
.livretm.m4.lm-libre3 .lm-photo2 {
  width: 64.71%;
  flex: none;
  box-shadow: 1.60cqw 1.60cqw 0 var(--accent);
}
.livretm.m4.lm-libre2 .lm-photo2 {
  aspect-ratio: 1.5;
  align-self: flex-start;
  margin: auto 0 0 -1.6cqw;
}
/* la face 6 inverse l'ordre, comme chez m2 et m3 : le tirage d'abord */
.livretm.m4.lm-libre3 .lm-photo2 {
  aspect-ratio: 1.6034;
  align-self: flex-end;
  order: -1;
  margin: 0 -1.83cqw 0 0;
}
.livretm.m4.lm-libre3 .lm-ptexte { margin-top: 9.38cqw; }

/* ------------------------------------------------ m4 · F7 la seconde photo
   UNE seule paire, celle de tête : le cahier s'ouvre et le tirage sort à
   franc bord par la droite et par le bas. Son ombre a changé de sens avec
   lui — elle ne se voit plus qu'en haut et à gauche. */

.livretm.m4.lm-tenue2 .lm-photo3 {
  left: 25.51%; right: 0; top: 19.19%; bottom: 17.90%;
  box-shadow: -1.60cqw -1.60cqw 0 var(--accent);
}

/* --------------------------------------------------------- m4 · F8 le dos
   REDESSINÉ pour ce format. Le QR reste CERNÉ d'un filet d'encre, sans
   plaque : c'est le papier qui se voit dedans. Une paire lui sert de socle,
   plus bas que sur la double page, et le mot de fin comme le © Booky
   descendent avec elle. */

.livretm.m4.lm-dos.lm-4p .lm-deco.b {
  top: 66.94%; height: 0.80cqw;
  border-top: var(--m4-mince) solid var(--accent);
  border-bottom: var(--m4-gras) solid var(--accent);
}
.livretm.m4.lm-dos.lm-4p .lm-qr {
  left: 25.80%; right: 25.80%; top: 25.00%; bottom: auto;
  aspect-ratio: 1;
  padding: 2%;
  border: max(0.12rem, 0.34cqw) solid var(--encre);
  background: var(--qr-plaque);
}
.livretm.m4.lm-dos.lm-4p .lm-qrtexte {
  top: 10.65%;
  left: 12.13%; right: 5.61%;
}
.livretm.m4.lm-dos.lm-4p .lm-fin { top: 72.34%; }
.livretm.m4.lm-dos.lm-4p .lm-marque { top: 91.94%; bottom: auto; }

/* ===========================================================================
   m5 — LE DIPTYQUE, ses quatre faces neuves et son dos
   La page coupée net, une barre olive de 20 px posée sur la coupe. Ce qui
   fait le format, c'est que LA COUPE SE DÉPLACE d'une face à l'autre — et
   qu'elle S'INVERSE : photo en haut sur la 4, photo en BAS sur la 7.
     F4  coupe à 59 % · photo dessus, plein bord
     F5  coupe à 16 % · le sombre en tête, la page libre dessous
     F6  la même coupe, mais le tirage remonte et passe avant le texte
     F7  coupe à 40 % · L'INVERSE de la 4 : le sombre en tête, photo dessous
     F8  coupe à 53 % · le dos, avec le QR sous la barre
   =========================================================================== */

/* ------------------------------------------------------- m5 · F4 et F7
   Les deux faces photo : l'image tient toute sa moitié, à franc bord des
   trois côtés, et la barre olive marque la coupe. La 7 retourne la 4 —
   c'est le geste que sa dictée nomme. */

.livretm.m5.lm-tenue .lm-photo3 {
  left: 0; right: 0; top: 0; bottom: 40.93%;
}
.livretm.m5.lm-tenue .lm-deco.b {
  left: 0; right: 0; top: 59.07%;
  height: 1.14cqw;
  background: var(--accent);
}
.livretm.m5.lm-tenue2 .lm-photo3 {
  left: 0; right: 0; top: 40.93%; bottom: 0;
}
.livretm.m5.lm-tenue2 .lm-deco.b {
  left: 0; right: 0; top: 40.12%;
  height: 1.14cqw;
  background: var(--accent);
}
/* les décos qui ne servent pas ici : bornées, sinon elles retombent
   collées au bord haut */
.livretm.m5.lm-tenue .lm-deco.a,
.livretm.m5.lm-tenue .lm-deco.c,
.livretm.m5.lm-tenue .lm-deco.d,
.livretm.m5.lm-tenue2 .lm-deco.a,
.livretm.m5.lm-tenue2 .lm-deco.c,
.livretm.m5.lm-tenue2 .lm-deco.d { display: none; }

/* --------------------------------------------- m5 · F5 et F6 les pages libres
   La coupe remonte tout en haut : une bande sombre de tête qui porte le
   titre, la barre, puis la page claire. Le tirage se déplace — en pied sur
   la 5, en tête sur la 6, où il passe AVANT le texte comme chez m2, m3 et
   m4. Quatre modèles sur quatre : c'est le parti de la face 6. */

.livretm.m5.lm-libre2 .lm-deco.a,
.livretm.m5.lm-libre3 .lm-deco.a { top: 16.94%; }
.livretm.m5.lm-libre2 .lm-deco.b,
.livretm.m5.lm-libre3 .lm-deco.b { top: 16.13%; }
.livretm.m5.lm-libre2 .lm-deco.c,
.livretm.m5.lm-libre3 .lm-deco.c { display: none; }

.livretm.m5.lm-libre2 .lm-ptitre,
.livretm.m5.lm-libre3 .lm-ptitre {
  position: absolute;
  left: 8.24%; right: 8.24%; top: 5.90%;
  margin: 0;
  text-align: center;
  font-size: 3.56cqw;
  font-weight: 700;
}

.livretm.m5.lm-libre2 .lm-corps {
  left: 8.24%; right: 8.24%; top: 24.64%; bottom: 9.68%;
  padding: 0;
  display: flex; flex-direction: column;
}
.livretm.m5.lm-libre3 .lm-corps {
  left: 8.24%; right: 8.24%; top: 25.00%; bottom: 9.68%;
  padding: 0;
  display: flex; flex-direction: column;
}
.livretm.m5.lm-libre2 .lm-ptexte,
.livretm.m5.lm-libre3 .lm-ptexte { font-size: max(0.44rem, 3.12cqw); line-height: 1.5; min-height: 0; }

/* le tirage est POSÉ À PLAT — ni ombre, ni cadre, ni arrondi : c'est la
   grammaire photo de ce modèle, et elle tient en une absence. */
.livretm.m5.lm-libre2 .lm-photo2,
.livretm.m5.lm-libre3 .lm-photo2 {
  width: 90.68%;
  align-self: center;
  flex: none;
}
.livretm.m5.lm-libre2 .lm-photo2 {
  aspect-ratio: 2.135;
  margin-top: auto;
}
.livretm.m5.lm-libre3 .lm-photo2 {
  aspect-ratio: 2.283;
  order: -1;
  margin-top: 0;
}
.livretm.m5.lm-libre3 .lm-ptexte { margin-top: 8.64cqw; }

/* --------------------------------------------------------- m5 · F8 le dos
   La coupe et la barre reprennent EXACTEMENT la place qu'elles ont sur le
   dos de la double page — 52,62 % et 53,43 %, mesurés identiques — et le QR
   garde la sienne. Ce qui bouge, c'est la titraille : la ligne du QR remonte
   de 55 px dans la bande sombre. */

.livretm.m5.lm-dos.lm-4p .lm-qrtexte { top: 15.20%; }
/* et le mot de fin monte de 44 px en grossissant d'un quart : sur ce dos-là
   il tient une vraie ligne, pas une mention */
.livretm.m5.lm-dos.lm-4p .lm-fin {
  top: 32.10%;
  font-size: max(0.44rem, 3.23cqw);
}

/* ===========================================================================
   m7 — LA FENÊTRE, ses quatre faces neuves et son dos
   Le cadre crème s'ouvre et se referme, et sur ce format il prend CINQ états
   — c'est le modèle où le déplacement est le plus explicite :
     F4  FERMÉ, épais de 57 px, autour d'un tirage plein
     F5  ouvert en BANDEAUX : deux traverses seulement, en tête et en pied
     F6  ouvert en MONTANTS : deux jambages, et plus rien en haut ni en bas
     F7  RESSERRÉ : le cadre se referme, deux fois plus mince
     F8  réduit à une LUCARNE de 120 px autour du QR
   Le fond vert est la page ; le cadre est un aplat crème posé dessus, et
   c'est sa BOÎTE qui change, jamais sa nature.
   =========================================================================== */

.livretm.m7.lm-tenue .lm-deco.a,
.livretm.m7.lm-libre2 .lm-deco.a,
.livretm.m7.lm-libre3 .lm-deco.a,
.livretm.m7.lm-tenue2 .lm-deco.a,
.livretm.m7.lm-dos.lm-4p .lm-deco.a { background: var(--m7-clair); }

/* les décos qui ne servent pas sur ces faces — bornées, sinon elles
   retombent collées au bord haut */
.livretm.m7.lm-tenue .lm-deco.b,
.livretm.m7.lm-tenue .lm-deco.c,
.livretm.m7.lm-tenue .lm-deco.d,
.livretm.m7.lm-libre2 .lm-deco.b,
.livretm.m7.lm-libre2 .lm-deco.c,
.livretm.m7.lm-libre2 .lm-deco.d,
.livretm.m7.lm-libre3 .lm-deco.b,
.livretm.m7.lm-libre3 .lm-deco.c,
.livretm.m7.lm-libre3 .lm-deco.d,
.livretm.m7.lm-tenue2 .lm-deco.b,
.livretm.m7.lm-tenue2 .lm-deco.c,
.livretm.m7.lm-tenue2 .lm-deco.d { display: none; }

/* --------------------------------------------------- m7 · F4 le cadre fermé */
.livretm.m7.lm-tenue .lm-deco.a { left: 8.87%; right: 8.87%; top: 6.25%; bottom: 5.48%; }
.livretm.m7.lm-tenue .lm-photo3 { left: 12.13%; right: 12.07%; top: 8.55%; bottom: 7.74%; }

/* ------------------------------------------ m7 · F5 le cadre ouvert en bandeaux
   Deux traverses, et la page s'ouvre en grand entre elles. */
.livretm.m7.lm-libre2 .lm-deco.a { left: 0; right: 0; top: 10.48%; bottom: 10.48%; }

.livretm.m7.lm-libre2 .lm-ptitre,
.livretm.m7.lm-libre3 .lm-ptitre {
  position: absolute;
  margin: 0;
  text-align: center;
  font-size: 3.56cqw;
  font-weight: 700;
}
.livretm.m7.lm-libre2 .lm-ptitre { left: 12.13%; right: 12.07%; top: 18.75%; }

.livretm.m7.lm-libre2 .lm-corps {
  left: 12.13%; right: 12.07%; top: 32.70%; bottom: 12.10%;
  padding: 0;
  display: flex; flex-direction: column;
}
.livretm.m7.lm-libre2 .lm-ptexte,
.livretm.m7.lm-libre3 .lm-ptexte { font-size: max(0.44rem, 3.12cqw); line-height: 1.5; min-height: 0; }
.livretm.m7.lm-libre2 .lm-photo2 {
  width: 100%;
  aspect-ratio: 2.137;
  margin-top: auto;
  flex: none;
}

/* ----------------------------------------- m7 · F6 le cadre ouvert en montants
   Deux jambages, et plus rien en haut ni en bas : la page respire par le
   haut. Le tirage y passe AVANT le texte, comme sur les quatre autres. */
.livretm.m7.lm-libre3 .lm-deco.a { left: 13.73%; right: 13.73%; top: 0; bottom: 0; }
.livretm.m7.lm-libre3 .lm-ptitre { left: 19.45%; right: 19.45%; top: 8.06%; }

.livretm.m7.lm-libre3 .lm-corps {
  left: 19.45%; right: 19.45%; top: 30.65%; bottom: 12.10%;
  padding: 0;
  display: flex; flex-direction: column;
}
.livretm.m7.lm-libre3 .lm-photo2 {
  width: 100%;
  aspect-ratio: 1.841;
  order: -1;
  margin-top: 0;
  flex: none;
}
.livretm.m7.lm-libre3 .lm-ptexte { margin-top: 8.64cqw; }

/* ------------------------------------------------- m7 · F7 le cadre resserré */
.livretm.m7.lm-tenue2 .lm-deco.a { left: 18.31%; right: 18.31%; top: 19.76%; bottom: 19.76%; }
.livretm.m7.lm-tenue2 .lm-photo3 { left: 20.02%; right: 20.02%; top: 20.97%; bottom: 20.97%; }

/* ----------------------------------------------------- m7 · F8 la lucarne
   Le cadre se réduit à une lucarne de 120 px autour du QR, et tout le texte
   sort sur le vert — il passe donc en CRÈME, alors qu'il est sombre partout
   ailleurs sur ce modèle. */
.livretm.m7.lm-dos.lm-4p {
  --c-qrtexte: var(--m7-clair);
  --c-fin: var(--m7-clair);
  --c-marque: var(--m7-clair);
}
.livretm.m7.lm-dos.lm-4p .lm-deco.a {
  left: 21.40%; right: 21.40%; top: 25.81%; bottom: 25.81%;
}
.livretm.m7.lm-dos.lm-4p .lm-deco.b,
.livretm.m7.lm-dos.lm-4p .lm-deco.c,
.livretm.m7.lm-dos.lm-4p .lm-deco.d { display: none; }
.livretm.m7.lm-dos.lm-4p .lm-qr {
  left: 28.26%; right: 28.26%; top: 30.65%; bottom: auto;
  aspect-ratio: 1;
}
.livretm.m7.lm-dos.lm-4p .lm-qrtexte {
  left: 10%; right: 10%; top: 6.17%;
  font-size: max(0.44rem, 3.02cqw);
}
.livretm.m7.lm-dos.lm-4p .lm-fin {
  left: 10%; right: 10%; top: 78.91%;
  font-size: max(0.44rem, 2.79cqw);
}
.livretm.m7.lm-dos.lm-4p .lm-marque { top: 93.43%; bottom: auto; }

/* ===========================================================================
   m8 — LA TRAME, ses quatre faces neuves et son dos
   Fond pâle, beaucoup de vide, et le tirage INCLINÉ à −6° avec son ombre
   dure. Sur ce format il respire encore davantage : il occupe presque toute
   la largeur sur les faces 4 et 7, et se réduit à une vignette sur les pages
   libres, où il change de côté — à gauche sur la 5, à droite sur la 6.

   LES BOÎTES DES TIRAGES SONT CALCULÉES, PAS RELEVÉES, et c'est le piège 3
   qui l'impose : sur son image je ne peux mesurer que la boîte APRÈS
   rotation. Pour un rectangle w × h tourné de 6°, l'encombrement vaut
     W = w·cos6 + h·sin6      H = w·sin6 + h·cos6
   et le système se renverse pour retrouver w et h à partir de ce que je
   mesure. Le centre, lui, ne bouge pas — et c'est la seule part du calcul
   qui s'est vérifiée du premier coup. LES DIMENSIONS, ELLES, ONT DÛ ÊTRE
   REPRISES AU RENDU : ma première inversion sortait les tirages 14 % trop
   étroits et 6 % trop courts. La formule donnait le bon axe et la mauvaise
   échelle ; c'est le rapport des encombrements mesurés, dessin contre
   rendu, qui a tranché. Une rotation se corrige comme une taille de texte —
   au rendu, pas au calcul.
   =========================================================================== */

/* le long filet de pied court sur les faces 4, 5, 6 et 7 comme sur les trois
   premières — mais PAS sur le dos, qui n'en porte aucun. */
.livretm.m8.lm-dos.lm-4p .lm-deco.b { display: none; }

/* --------------------------------------------------- m8 · F4 et F7 les photos
   Le tirage prend presque toute la page. La 4 n'a que le filet de pied, la 7
   n'a que celui de tête : le vide change de côté avec l'image. */

.livretm.m8.lm-tenue .lm-deco.a,
.livretm.m8.lm-tenue .lm-deco.c,
.livretm.m8.lm-tenue .lm-deco.d,
.livretm.m8.lm-tenue2 .lm-deco.c,
.livretm.m8.lm-tenue2 .lm-deco.d,
.livretm.m8.lm-libre2 .lm-deco.d,
.livretm.m8.lm-libre3 .lm-deco.d { display: none; }

.livretm.m8.lm-tenue .lm-photo3 {
  left: 13.79%; right: 20.48%; top: 18.31%; bottom: 18.83%;
  transform: rotate(var(--m8-incline));
  box-shadow: var(--m8-ombre-x) var(--m8-ombre-y) 0 var(--accent);
}

.livretm.m8.lm-tenue2 .lm-deco.a {
  left: 8.87%; right: 8.87%; top: 6.25%;
  height: var(--m8-filet);
  background: var(--accent);
}
.livretm.m8.lm-tenue2 .lm-photo3 {
  left: 24.11%; right: 18.68%; top: 21.54%; bottom: 21.94%;
  transform: rotate(var(--m8-incline));
  box-shadow: var(--m8-ombre-x) var(--m8-ombre-y) 0 var(--accent);
}

/* --------------------------------------------- m8 · F5 et F6 les pages libres
   Un filet fort sous le titre, et la vignette inclinée qui change de côté :
   à GAUCHE sur la 5, à DROITE sur la 6 — où elle passe aussi avant le texte,
   comme sur les cinq autres modèles. */

.livretm.m8.lm-libre2 .lm-deco.a,
.livretm.m8.lm-libre3 .lm-deco.a {
  left: 8.87%; right: 8.87%; top: 16.13%;
  height: var(--m8-filet-fort);
  background: var(--accent);
}

.livretm.m8.lm-libre2 .lm-ptitre,
.livretm.m8.lm-libre3 .lm-ptitre {
  position: absolute;
  left: 8.87%; right: 8.87%; top: 9.96%;
  margin: 0;
  text-align: center;
  font-size: 3.56cqw;
  font-weight: 700;
}

/* le corps prend toute la face : le tirage est TOURNÉ, et un élément tourné
   se pose par son centre — il ne peut pas vivre dans le flux d'une colonne
   sans emporter le texte avec lui. */
.livretm.m8.lm-libre2 .lm-corps,
.livretm.m8.lm-libre3 .lm-corps { inset: 0; padding: 0; }

.livretm.m8.lm-libre2 .lm-ptexte,
.livretm.m8.lm-libre3 .lm-ptexte {
  position: absolute; margin: 0;
  left: 8.87%; right: 8.87%;
  font-size: max(0.44rem, 3.12cqw); line-height: 1.5; min-height: 0;
}
.livretm.m8.lm-libre2 .lm-ptexte { top: 21.41%; }
.livretm.m8.lm-libre3 .lm-ptexte { top: 51.98%; }

.livretm.m8.lm-libre2 .lm-photo2,
.livretm.m8.lm-libre3 .lm-photo2 {
  position: absolute;
  transform: rotate(var(--m8-incline));
  box-shadow: var(--m8-ombre-x) var(--m8-ombre-y) 0 var(--accent);
}
.livretm.m8.lm-libre2 .lm-photo2 { left: 23.51%; right: 36.50%; top: 67.26%; bottom: 15.45%; }
.livretm.m8.lm-libre3 .lm-photo2 { left: 37.41%; right: 22.60%; top: 23.95%; bottom: 58.79%; }

/* --------------------------------------------------------- m8 · F8 le dos
   REDESSINÉ : deux filets seulement — un sous la ligne du QR, un sous la
   plaque — et aucun en pied, contrairement aux sept autres faces. Le QR
   garde le papier du modèle, sans plaque blanche. */

.livretm.m8.lm-dos.lm-4p .lm-deco.a {
  left: 8.87%; right: 8.87%; top: 16.13%;
  height: var(--m8-filet);
  background: var(--accent);
}
.livretm.m8.lm-dos.lm-4p .lm-deco.c {
  left: 8.87%; right: 8.87%; top: 62.90%;
  height: var(--m8-filet);
  background: var(--accent);
}
.livretm.m8.lm-dos.lm-4p .lm-qrtexte {
  left: 8.87%; right: 8.87%; top: 9.88%;
  font-size: max(0.44rem, 2.83cqw);
}
.livretm.m8.lm-dos.lm-4p .lm-qr {
  left: 34.10%; right: 34.10%; top: 32.02%; bottom: auto;
  aspect-ratio: 1;
}
.livretm.m8.lm-dos.lm-4p .lm-fin {
  left: 8.87%; right: 8.87%; top: 67.62%;
  font-size: max(0.44rem, 2.79cqw);
}
.livretm.m8.lm-dos.lm-4p .lm-marque { top: 95.56%; bottom: auto; }
