/* Polices hébergées sur le site (aucun appel à Google, aucune donnée de visiteur transmise). Inter (police variable, graisses 100 à 900) et Michroma : SIL Open Font License 1.1 — voir OFL-Inter.txt et OFL-Michroma.txt */ @font-face { font-family: 'Inter'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('inter.woff2') format('woff2'); } @font-face { font-family: 'Michroma'; font-style: normal; font-weight: 400; font-display: swap; src: url('michroma.woff2') format('woff2'); } /* ===== VOLETS COMMUNS À TOUT LE SITE (20/10/2026, demande du propriétaire, charte 0.V) ===== Ce fichier (fonts/polices.css) est chargé par TOUTES les pages publiques, y compris les 1 800 pages générées : la règle des volets repliables vit donc ICI, une seule fois, et s'applique automatiquement à tout
présent ou futur. - flèche (22/10/2026, choix n° 4 « Triple dégradé » du propriétaire, étendu à TOUS les volets) : trois chevrons de plus en plus pâles, 28 x 10 px, gris clair ; ils rebondissent doucement tant que le volet est fermé, pivotent vers le bas à l'ouverture, et deviennent jaune orangé avec aura au survol ; - alignement : dans une barre en ligne (flex), le titre et la note partagent la même ligne de base ; flèche et numéro sont centrés. Contrôlé par OUTILS_DE_DEV/verifier_charte.py (bloquant) : les 17 copies de ce fichier doivent être identiques et contenir ce bloc. */ details > summary { list-style: none; cursor: pointer; } details > summary::-webkit-details-marker { display: none; } details > summary::marker { content: ""; } details > summary::before { content: "" !important; display: inline-block !important; flex: none !important; box-sizing: border-box !important; width: 28px !important; height: 10px !important; margin: 0 14px 0 6px !important; padding: 0 !important; vertical-align: middle !important; align-self: center !important; border: 0 !important; border-radius: 0 !important; font-size: 0 !important; text-shadow: none !important; filter: none !important; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 10' fill='none' stroke='%23e6e9ef' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='1,1 5,5 1,9' opacity='.3'/%3E%3Cpolyline points='10,1 14,5 10,9' opacity='.62'/%3E%3Cpolyline points='19,1 23,5 19,9'/%3E%3C/svg%3E") center / contain no-repeat !important; transform: none !important; animation: volet-chevron-triple 1.4s ease-in-out infinite !important; } /* 24/10/2026 (« quand ils sont à la verticale ils doivent faire la même hauteur que le texte à côté ») : ouvert, les trois chevrons sont à la verticale ; ils sont réduits (0,62) pour que leur hauteur égale celle du texte du titre (28 px de long devenaient 17 px) */ details[open] > summary::before { animation: none !important; transform: rotate(90deg) scale(.62) !important; } details > summary:hover::before, details > summary:focus-visible::before { filter: drop-shadow(0 0 5px rgba(255, 170, 60, .85)) drop-shadow(0 0 12px rgba(255, 170, 60, .5)) !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 10' fill='none' stroke='%23f3c776' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='1,1 5,5 1,9' opacity='.3'/%3E%3Cpolyline points='10,1 14,5 10,9' opacity='.62'/%3E%3Cpolyline points='19,1 23,5 19,9'/%3E%3C/svg%3E") !important; } details > summary:hover, details > summary:focus-visible { color: #f3c776; } @keyframes volet-chevron-triple { 0%, 100% { transform: translateX(-2px); } 50% { transform: translateX(3px); } } @media (prefers-reduced-motion: reduce) { details > summary::before { animation: none !important; } } /* alignement dans les barres en ligne : même ligne de base pour le titre et la note ; flèche et numéro centrés */ details > summary { align-items: baseline !important; } details > summary > .no { align-self: center !important; } details > summary > .note { flex: 1 1 0 !important; min-width: 0 !important; } /* ORDRE, ESPACEMENT ET ALIGNEMENT DES VOLETS (23/10/2026, « inadmissible ») : sur TOUS les volets qui portent une pastille de numéro, l'ordre est TOUJOURS 1) le NUMÉRO, 2) le CHEVRON, 3) le TITRE ; les trois sont centrés verticalement sur la même ligne et séparés de 14 px. Une seule règle, ici ; contrôlée par OUTILS_DE_DEV/verifier_charte.py (bloquant : dans ce fichier et par mesure réelle dans le navigateur). */ details > summary:is(:has(> .no), :has(> :is(h2, h3, h4) > .no)) { display: flex; gap: 14px; } details > summary:is(:has(> .no), :has(> :is(h2, h3, h4) > .no)):not(:has(> .note)) { align-items: center !important; } details > summary:has(> :is(h2, h3, h4) > .no) > :is(h2, h3, h4) { display: contents; } details > summary > .no, details > summary > :is(h2, h3, h4) > .no { order: -2; margin: 0 !important; align-self: center !important; } details > summary:is(:has(> .no), :has(> :is(h2, h3, h4) > .no))::before { order: -1; margin: 0 !important; }/* ===== fin des volets communs ===== */ /* ===== MISE EN PAGE SÛRE À TOUTE TAILLE ET DANS TOUTE LANGUE (28/10/2026, « faut que tout soit correct pour tout le site quelle que soit la taille de la fenêtre », « la taille du texte change avec les traductions ») ===== 1. Jamais de mot coupé : un mot qui ne tient pas fait réduire la police de son élément (langue.js, « AJUSTEMENT DES TEXTES »), en dernier recours seulement il se coupe. 2. Tableau trop serré pour sa place, même en petite police : il passe en FICHES (une fiche par ligne, « libellé : valeur »), comme sur téléphone. 3. Boutons « question + Click to start » : le bouton passe sous la question quand la place manque, il ne l'écrase jamais. Contrôle bloquant : OUTILS_DE_DEV/verifier_mise_en_page.py (320 à 1440 px, fenêtres basses et hautes, texte d'origine et traduit gonflé de 40 %). */ :is(h1, h2, h3, h4, h5, h6, p, li, summary, button, label, figcaption, th, td) { overflow-wrap: normal !important; word-break: normal !important; hyphens: manual !important; } table.dm-fiches, table.dm-fiches > tbody, table.dm-fiches > tbody > tr, table.dm-fiches > tbody > tr > :is(td, th) { display: block !important; width: auto !important; min-width: 0 !important; max-width: none !important; } table.dm-fiches > thead, table.dm-fiches tr[data-dm-tete] { display: none !important; } table.dm-fiches > tbody > tr { border: 1px solid rgba(157, 184, 217, .25) !important; border-radius: 6px; margin: 0 0 10px; padding: 6px 10px !important; background: rgba(10, 14, 22, .6); } table.dm-fiches > tbody > tr > :is(td, th) { text-align: left !important; border: 0 !important; padding: 4px 0 !important; } table.dm-fiches > tbody > tr > :is(td, th)[data-th]:not([data-th=""])::before { content: attr(data-th); display: block; color: #9db8d9; font-weight: 600; font-size: .85em; } /* libellé AU-DESSUS de la valeur : jamais l'un écrasé contre l'autre */ .curseur { flex-wrap: wrap !important; min-width: 0 !important; height: auto !important; min-height: 44px; row-gap: 6px; } /* curseur + case chiffrée : la case passe dessous quand la place manque */ .curseur input[type=range] { min-width: min(180px, 100%) !important; flex: 1 1 140px !important; } details > summary:has(> .note) { flex-wrap: wrap !important; } /* volet avec une note : la note passe à la ligne au lieu de s'écraser */ details > summary > .note { flex: 1 1 14em !important; } .modes-btns button { flex-wrap: wrap !important; row-gap: 14px; } .modes-btns .corps-q { flex: 1 1 15em !important; min-width: 0 !important; } .modes-btns .go-w { max-width: 100% !important; flex: 0 1 auto !important; } .modes-btns .go { white-space: normal !important; flex: 0 1 auto !important; min-width: 0; } /* 02/11/2026 : tableau en fiches : sa légende devient un bloc (jamais écrasée dans une colonne étroite) */ table.dm-fiches > caption { display: block !important; width: auto !important; } /* 02/11/2026 : une image ne dépasse jamais son conteneur (filet de sécurité commun ; le contrôle de mise en page voyait parfois une image à sa taille d'origine pendant un redimensionnement) */ img { max-width: 100%; } /* ---- 10/11/2026 (« l'ascenseur est en blanc sur blanc, illisible ») : MENUS DÉROULANTS lisibles sur tout le site ---- La liste ouverte d'un