/* ============================================================ * POLICES AUTO-HÉBERGÉES — perf vague 2 (2026-07-14) * * POURQUOI — les polices se chargeaient, mais par le pire chemin possible. * * Inter et Fraunces arrivaient via un `@import url(https://fonts.googleapis…)` * placé DANS tokens/design_tokens.css. Un @import à l'intérieur d'un CSS impose * une cascade strictement sérielle sur le chemin de rendu critique : * HTML → design_tokens.css (télécharger + parser) → découverte de l'@import * → DNS+TLS fonts.googleapis.com → CSS Google → découverte des @font-face * → DNS+TLS fonts.gstatic.com → woff2 * soit 3 aller-retours chaînés et 2 origines externes avant le premier texte. * Sen et Ubuntu arrivaient en plus par un séparé (+ un script de swap). * Et le layout préchargeait un woff2 Fraunces dont l'URL gstatic est PÉRIMÉE : * elle renvoie un HTTP 404 — une requête échouée sur chaque page (vérifié). * * Ici : tout est servi par notre origine, avec un cache d'un an immutable, et * préchargeable directement depuis le . Zéro DNS externe, zéro cascade. * * Inter et Fraunces sont des polices VARIABLES : un seul fichier couvre toutes * les graisses de la plage déclarée. Subset latin uniquement. * Sen est conservée : l'utilitaire Tailwind `font-heading` l'emploie dans * 82 vues. Ubuntu est supprimée (2 fichiers CSS, repointés sur --font-primary). * Licences OFL — auto-hébergement autorisé. * * Refonte « Bento » (2026-07-23) — ajout de SN Pro (titres + gros chiffres) et * Cantarell (corps / UI / data). Mêmes règles : subset latin auto-hébergé, zéro * origine externe, `url("../x.woff2")` résolu par Propshaft depuis app/assets/fonts. * SN Pro est VARIABLE (200–900, un seul fichier) ; Cantarell est statique (4 faces * : regular/bold + italiques). Licences OFL. Le mapping des familles se fait dans * tokens/design_tokens.css (--font-heading → SN Pro, --font-primary → Cantarell). * * Doit être chargé AVANT tokens/design_tokens.css (qui référence les familles). * ============================================================ */ @font-face { font-family: 'Fraunces'; font-style: normal; font-weight: 100 900; font-display: swap; src: url("/assets/fraunces-latin-71886d81.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 100 900; font-display: swap; src: url("/assets/inter-latin-2240f1ea.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Sen'; font-style: normal; font-weight: 700; font-display: swap; src: url("/assets/sen-latin-b2097e3f.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* ---- Refonte Bento : SN Pro (titres/chiffres) + Cantarell (corps/UI) -------- */ @font-face { font-family: 'SN Pro'; font-style: normal; font-weight: 200 900; font-display: swap; src: url("/assets/sn-pro-latin-8c476d44.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Cantarell'; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/cantarell-regular-latin-ab03b629.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Cantarell'; font-style: normal; font-weight: 700; font-display: swap; src: url("/assets/cantarell-bold-latin-15e0f6d8.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Cantarell'; font-style: italic; font-weight: 400; font-display: swap; src: url("/assets/cantarell-italic-latin-aa73696b.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* ---- Latin étendu : polonais, lituanien, tchèque, hongrois, turc… ----------- * * 🔴 SANS CE BLOC, L'APPLICATION CHANGE DE POLICE EN PLEIN MOT dans ces langues. * Tous les `-latin.woff2` ci-dessus sont des sous-ensembles à ~215-230 glyphes * qui s'arrêtent à U+00FF. Or `ą` vit en U+0105, `ė` en U+0117, `ł` en U+0142, * `ū` en U+016B — dans Latin Extended-A. Le navigateur ne trouve pas le glyphe * et retombe sur une police système, au milieu du mot. * * ⚠️ Élargir l'`unicode-range` des blocs ci-dessus ne changerait RIEN : les * glyphes ne sont pas dans les fichiers. Vérifié à la table `cmap` des onze * woff2 du projet — Inter, Sen et Fraunces ont le même trou. Ce n'était donc * jamais un problème de CHOIX de police. * * ⚠️ Le défaut existait avant l'ouverture du sélecteur aux six langues * (2026-08-11), mais il était invisible : personne ne pouvait afficher l'app en * polonais. Il est devenu visible le jour où on a rendu ces langues joignables. * * COÛT NUL POUR QUI N'EN A PAS BESOIN : l'`unicode-range` est ce qui décide du * téléchargement. Un utilisateur français, anglais, allemand ou espagnol ne * charge JAMAIS ces fichiers — aucun caractère de son écran n'y tombe. C'est * aussi pourquoi ils ne sont PAS préchargés dans le layout : un `preload` les * ferait télécharger par tout le monde, ce qui retournerait l'économie. * * L'italique de Cantarell n'a pas sa variante étendue : il ne sert que dans de * rares mises en valeur, et le repli système y est acceptable. À ajouter le jour * où une capture le démentira. * ---------------------------------------------------------------------------- */ @font-face { font-family: 'SN Pro'; font-style: normal; font-weight: 200 900; font-display: swap; src: url("/assets/sn-pro-latinext-280c94fd.woff2") format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Cantarell'; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/cantarell-regular-latinext-e995d245.woff2") format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Cantarell'; font-style: normal; font-weight: 700; font-display: swap; src: url("/assets/cantarell-bold-latinext-9cb3a01d.woff2") format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Cantarell'; font-style: italic; font-weight: 700; font-display: swap; src: url("/assets/cantarell-bolditalic-latin-1f44cb33.woff2") format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }