/* © 2026 DRAK Infinity (NEQ 2281240509), Montréal (Québec), Canada. Tous droits réservés.
   Feuille PROPRE à la page Facturier Québec en ligne (mission 31, lot C, vague 1, agent 1d, fait 186 d). Chargée EN PLUS de
   site/commun/v4.css (lot C, agent 0b) : ce fichier n'y redéfinit rien, il ajoute seulement les quelques ajustements que les
   classes partagées v4-* ne couvrent pas pour CETTE page précise. Posée dans le corps de la page (voir outils/facturier-en-ligne-
   donnees.mjs, commentaire « CHOIX D'INTÉGRATION ») plutôt que dans <head> par outils/construire-site.mjs : ce fichier n'appartient
   pas à cet agent (dispatch de la vague 1, fichiers disjoints), et un <link rel="stylesheet"> est explicitement permis dans le
   corps d'un document HTML (liste « body-ok » de la spécification) — les navigateurs l'appliquent normalement.

   AJOUTS :
   1. Garantie du prix de lancement (outils/garantie-bloc.mjs, lecture seule) : la phrase porte les classes fixes « mention
      garantie-lancement », habillées ailleurs par site/commun/v3.css (texte à 16 px). Sur cette page V4, scopée sous .v4-tete
      pour ne RIEN changer pour les pages V3 qui utilisent encore le même bloc (ex. /outils), le même petit texte que .v4-note
      (11 px italique, fait 179 c) s'applique, pour rester visuellement cohérent avec le reste de l'en-tête.
   2. Captures de l'application (#captures, trois images aux proportions très différentes : une facture 1200×833, un écran de
      paramètres 800×920, une facture sur téléphone 780×1356) : .v4-photo (site/commun/v4.css) force un cadre 4:3 avec
      object-fit:cover, pensé pour des photos d'exemple — cela rognerait la capture verticale du téléphone et une partie du
      formulaire de paramètres. Hauteur commune fixe (symétrie de rangée, fait 179 b) avec object-fit:contain (aucun rognage,
      aucun étirement) : chaque capture garde ses proportions réelles, centrée dans un cadre de même hauteur que ses voisines. */

html[data-theme] .v4-tete .garantie-lancement{font-size:11px;line-height:1.4;font-style:italic;color:var(--texte2);max-width:70ch;margin:6px 0 0}

/* 3. Tableau comparatif (#comparer/#compare, v4-tabl) : .v4-wrap est l'élément de grille direct de .v4-sec{display:grid} (squelette
   imposé, site/commun/v4.css) ; par défaut, la taille minimale automatique d'un élément de grille est celle du contenu le plus large
   qu'il contient, MÊME quand ce contenu a son propre overflow-x:auto (.v4-tabl, site/commun/v4.css) — la table.pref-table garde son
   min-width:640px (v3.css, feuille partagée avec /outils) et ce min-width remontait jusqu'à .v4-wrap, qui s'étirait au-delà de
   l'écran (confirmé à 390 px : .v4-wrap mesuré à 674 px, débordement horizontal réel). Seul .v4-wrap qui contient un .v4-tabl reçoit
   min-width:0, ce qui laisse .v4-tabl faire ce pour quoi il est prévu : défiler DANS SON PROPRE CADRE plutôt que d'agrandir la page. */
html[data-theme] .v4-wrap:has(.v4-tabl){min-width:0}

/* Mission 32, lot A (fait A8, ordre du 6 novembre 2026) : le tableau lui-même (table.pref-table, v3.css) porte son propre
   max-width:960px — pensé pour son usage d'origine (page V3 plus étroite), mais laissant un vide visible à droite à
   l'intérieur du cadre .v4-tabl (déjà width:100%, lui) dès que la section dépasse 960 px. Retiré seulement dans ce
   contexte précis (.v4-tabl .pref-table), jamais sur .pref-table en général : le tableau prend alors toute la largeur de
   .v4-tabl, comme .v4-tabl prend déjà toute celle de la section. Mesuré avant/après (Playwright, navigateur réel) :
   960 px sur 1303 px de cadre disponible (343 px de vide) avant ce correctif, 1301 px sur 1303 px après.
   CORRECTION (contrôleur, 1er passage) : max-width seul ne suffisait pas : .pref-table porte aussi SA PROPRE bordure et
   son propre arrondi (v3.css:165), en plus de ceux de .v4-tabl (v4.css), donnant un cadre dans un cadre; et sa marge
   verticale de 22px (v3.css:165, pensée pour un tableau isolé dans une page, pas pour un tableau déjà entouré par
   .v4-tabl) laissait une bande vide en haut et en bas. « Sans cadre extérieur ni double bordure » (A8) : un seul cadre
   doit rester visible, celui de .v4-tabl — retirés ici, dans ce même contexte scopé, jamais sur .pref-table en général. */
html[data-theme] .v4-tabl .pref-table{max-width:none;margin:0;border:0;border-radius:0}

/* Mission 32, lot A (fait A8, contrôleur, 2e passage) : « Téléchargement » (12 px majuscules, espacement .06em, un seul
   mot, aucun espace où se couper) ne tenait pas dans la colonne d'étiquette par défaut (minmax(96px,34%), site/commun/
   v4.css) à 390 px — mesuré : 116,3 px nécessaires contre 105,7 px disponibles. overflow-wrap:anywhere (ajouté au même
   passage, v4.css) empêchait le débordement visuel mais coupait le mot au milieu d'une lettre (« TÉLÉCHARGEME » / « NT »)
   plutôt qu'à une syllabe — hyphens:auto essayé, sans effet mesurable sur ce mot en majuscules à cette largeur. Colonne
   élargie, seulement pour CE tableau (#comparer, jamais .v4-tabl en général, pour ne pas resserrer la grille des
   forfaits du Serveur maison, qui n'a aucune étiquette aussi longue) : assez pour que « Téléchargement » tienne sur une
   seule ligne, mesuré après coup. */
@media (max-width:860px){
  html[data-theme] #comparer .v4-tabl td{grid-template-columns:132px minmax(0,1fr)}
}

html[data-theme] .v4-trois.fel-captures .v4-photo{background:var(--surface);border:1px solid var(--trait);border-radius:12px;padding:10px;display:grid;gap:6px;align-content:start}
html[data-theme] .v4-trois.fel-captures .v4-photo img{aspect-ratio:auto;width:100%;height:280px;object-fit:contain;border:0;border-radius:0;background:transparent}
@media (max-width:640px){
  html[data-theme] .v4-trois.fel-captures .v4-photo img{height:240px}
}