/* ============================================================ BeezWorld — Tokens de design Référence unique · v3.4 « Tech & Data » · 26 juillet 2026 Importer avant toute autre feuille de style. ------------------------------------------------------------ v3.4 : révision ADDITIVE. La famille « fond foncé » passe de un à trois rôles — le cyan clair avait été ajouté seul en v3.3, alors que la production tenait déjà un accent de marque et un texte courant sur graphite, avec huit valeurs différentes selon le fichier. Deux tokens les fixent : --bw-or-clair et --bw-blanc-teinte. Voir charte §1bis. ATTENTION — collision connue : assets/css/beezworld-rythme.css redéfinit --bw-cyan-clair à #8ABFD1 et, importé après ce fichier, l'écrase sur les 12 pages du site. Tant que cette ligne existe, le token ci-dessous n'a aucun effet en production. Charte §11. ------------------------------------------------------------ v3.3 : révision ADDITIVE. Aucune valeur v3.2 ne change. Le cyan reçoit une TROISIÈME valeur, --bw-cyan-clair, pour le texte posé sur fond foncé, où le cyan AA s'éteint (2,15:1 sur graphite). Ajout de --bw-cyan-halo pour l'anneau du CTA principal. ------------------------------------------------------------ v3.2 : la dominante marine vert-bleu devient un graphite bleuté, le cyan est assombri pour redevenir un signal, les neutres passent au gris froid. Objectif : lire « instrument de mesure » plutôt que « association nature ». Les noms de variables sont inchangés — seules les valeurs bougent. ============================================================ */ :root { /* --- MARQUE : la structure mesurée + le sceau ------------ */ --bw-marine: #1B2A3A; /* Graphite bleuté — dominante (ex vert-bleu #1A4A4E) */ --bw-marine-moyen: #2C4256; /* Dégradés, variantes */ --bw-marine-pale: #E8EBEF; /* Gris tech froid */ --bw-or: #AD8501; /* Miel + sceau de cire — aplats, filets */ --bw-or-texte: #8A6A01; /* Version AA — texte uniquement (5,07:1) */ --bw-ardoise: #6B7681; /* Gris tech, structure — aplats, filets */ --bw-ardoise-texte: #5A646F; /* Version AA — texte (6,02:1) */ --bw-ardoise-pale: #EDEFF2; --bw-cyan: #0C7288; /* Eau + flux de données — LE signal */ --bw-cyan-texte: #0A6474; /* Version AA — texte (6,80:1) */ --bw-cyan-clair: #4FA6BE; /* v3.3 — texte SUR FOND FONCÉ uniquement : graphite, graphite sombre, photo voilée. 5,23:1 sur graphite. INTERDIT sur blanc (2,79:1) et sur fond teinté (2,33:1). */ --bw-cyan-halo: rgba(79,166,190,.30); /* v3.3 — = --bw-cyan-clair en transparence. Anneau du CTA principal sur photo ou aplat foncé. Décoratif : ne porte jamais seul une information. Si --bw-cyan-clair change, recalculer ce rgba. */ --bw-cyan-pale: #E9EEF1; --bw-blanc: #FFFFFF; /* Air, transparence */ /* --- FAMILLE FOND FONCÉ (v3.4) --------------------------- Un rôle, une valeur. Sur graphite #1B2A3A, graphite sombre #111B26 ou photo voilée UNIQUEMENT. Le fond décide, jamais le goût. Charte §1bis et §3. accent de titre -> --bw-cyan-clair #4FA6BE (ci-dessus) accent de marque -> --bw-or-clair #D9AE38 texte courant -> --bw-blanc-teinte #D9E6E9 */ --bw-or-clair: #D9AE38; /* Numéro de section, eyebrow, libellé de sceau sur fond foncé. 7,00:1 sur graphite, 8,32:1 sur graphite sombre. L'or AA #8A6A01 y tombe à 2,86:1. INTERDIT sur fond clair (2,09:1 sur blanc). Ex --bw-or-sur-marine de mesures-analyses/shared.css. */ --bw-blanc-teinte: #D9E6E9; /* Paragraphe et légende sur fond foncé. 11,31:1 sur graphite. Remplace les blancs en rgba() empilés : à 45 % d'opacité le blanc plafonne à 4,20:1 sur graphite, sous le seuil. Un texte se compose en valeur, pas en alpha. */ /* --- TROISIÈME VALEUR : texte sur fond teinté ------------ En v3.1 toutes les valeurs AA tombaient sous 4,5:1 sur fond teinté. En v3.2 les fonds teintés sont plus clairs : seul l'OR reste non conforme (4,24 à 4,40) et impose sa variante --bw-or-texte-teinte. Les autres variantes sont conservées pour compatibilité et valent les valeurs de base. */ --bw-texte-clair-teinte: #5A646F; /* 5,04:1 sur gris pâle */ --bw-cyan-texte-teinte: #0A6474; /* 5,69:1 sur gris pâle */ --bw-or-texte-teinte: #7E6101; /* 4,88:1 sur gris pâle */ --bw-ardoise-texte-teinte:#4C555F; /* 6,9:1 sur gris pâle */ /* --- ÉTATS FONCTIONNELS --------------------------------- */ --bw-conforme: #0C7288; --bw-conforme-texte: #0A6474; --bw-conforme-pale: #E9EEF1; --bw-vigilance: #AD8501; --bw-vigilance-texte:#8A6A01; --bw-vigilance-pale: #FAF3E0; --bw-alerte: #B54A35; /* Anomalie, dépassement de seuil */ --bw-alerte-texte: #9E3F2C; /* Version AA (6,56:1) */ --bw-alerte-pale: #FBEDE9; --bw-nodata: #6B7681; /* Absence de mesure */ --bw-nodata-pale: #EDEFF2; /* --- SÉRIES DATAVIZ (ordre imposé) ---------------------- */ --bw-serie-1: #1B2A3A; --bw-serie-2: #0C7288; --bw-serie-3: #AD8501; --bw-serie-4: #6B7681; --bw-serie-5: #B54A35; --bw-serie-6: #2C4256; /* --- ÉCHELLES CARTOGRAPHIQUES --------------------------- */ /* Séquentielle eau / donnée (5 paliers) — famille du cyan v3.2 */ --bw-eau-1: #E9EEF1; --bw-eau-2: #AFC6D2; --bw-eau-3: #4E93AD; --bw-eau-4: #0C7288; --bw-eau-5: #0A4E60; /* Séquentielle végétation (5 paliers) — INCHANGÉE. Une carte de végétation se lit en vert : c'est une convention cartographique, pas une couleur de marque. */ --bw-veg-1: #E7EEED; --bw-veg-2: #B4C8C6; --bw-veg-3: #7A9C99; --bw-veg-4: #3F7377; --bw-veg-5: #1A4A4E; /* Divergente écart au seuil : alerte ← neutre → conforme */ --bw-div-1: #9E3F2C; --bw-div-2: #D68C7A; --bw-div-3: #EDEFF2; --bw-div-4: #4E93AD; --bw-div-5: #0A4E60; /* --- NEUTRES -------------------------------------------- */ /* Les PALIERS DE RYTHME d'une page longue (--bw-ardoise-p1 #F4F6F5, -p2 #EFF2F1, -p3 #E9EDEC, --bw-ardoise-filet #D8DEDC, --bw-cyan-pale-3 #CAE8EF) sont déclarés dans assets/css/beezworld-rythme.css et font partie de la surface des tokens au même titre que ce fichier. Ils n'y sont pas recopiés : une valeur, un endroit. Charte §2bis. */ --bw-fond: #F5F6F8; --bw-fond-2: #EDEFF2; --bw-bordure: #D3D8DE; --bw-texte: #39424D; --bw-texte-clair: #5A646F; /* AA 6,02:1 sur blanc, 5,04:1 sur fond teinté */ /* --- TYPOGRAPHIE ---------------------------------------- */ --bw-font: "Inter", "Helvetica Neue", Arial, sans-serif; --bw-mono: ui-monospace, "SFMono-Regular", "JetBrains Mono", Menlo, Consolas, monospace; --bw-lh-corps: 1.55; --bw-lh-titre: 1.15; /* --- ESPACEMENT (base 4) -------------------------------- */ --bw-esp-1: 4px; --bw-esp-2: 8px; --bw-esp-3: 12px; --bw-esp-4: 16px; --bw-esp-6: 24px; --bw-esp-8: 32px; /* --- RAYONS ET FILETS ----------------------------------- */ --bw-rayon: 4px; --bw-rayon-card: 8px; --bw-filet: 1px; } /* ============================================================ RÈGLES DE CONTRASTE — WCAG AA strict · palette v3.4 Seuils : 4,5:1 texte courant · 3:1 texte ≥ 18 pt et éléments graphiques. Ratios mesurés le 25 juillet 2026, complétés le 26 juillet 2026 pour --bw-cyan-clair, puis pour la famille fond foncé (--bw-or-clair, --bw-blanc-teinte). ------------------------------------------------------------ TEXTE SUR BLANC — autorisé graphite #1B2A3A 14,59 · texte #39424D 10,19 texte-clair #5A646F 6,02 · ardoise-texte #5A646F 6,02 cyan-texte #0A6474 6,80 · or-texte #8A6A01 5,07 alerte-texte #9E3F2C 6,56 TEXTE SUR FOND TEINTÉ (gris pâle / cyan pâle / ardoise pâle) texte #39424D 8,52 · graphite #1B2A3A 12,20 texte-clair #5A646F 5,04 · cyan-texte #0A6474 5,69 or-texte-teinte #7E6101 4,88 SEULE EXCEPTION : l'or AA #8A6A01 tombe à 4,24 (gris pâle), 4,34 (cyan pâle), 4,40 (ardoise pâle) — NON CONFORME. Sur fond teinté, l'or de texte s'écrit #7E6101, sans exception. Les autres variantes « -teinte » ne sont plus obligatoires ; elles restent définies pour ne pas casser l'existant. TEXTE SUR BLANC — interdit (aplats et filets uniquement) or #AD8501 3,42 TEXTE BLANC SUR FOND COLORÉ — tous autorisés sur graphite 14,59 · sur cyan 5,56 · sur alerte 5,26 sur ardoise 4,63 NOUVEAU en v3.2 : le blanc sur cyan est désormais CONFORME (l'ancien cyan #0E96B5 plafonnait à 3,47 et était interdit). FAMILLE FOND FONCÉ — compléments v3.4 or-clair #D9AE38 : sur graphite 7,00 · sur graphite sombre 8,32. INTERDIT sur fond clair (blanc 2,09). blanc-teinte #D9E6E9 : sur graphite 11,31 · sur graphite sombre 13,45. or vif #AD8501 sur graphite : 4,27 — GRAND TEXTE (≥ 24 px) et éléments graphiques seulement, jamais du corps. C'est un gain v3.2 : sur le marine v3.1 il plafonnait à 2,88. or AA #8A6A01 sur graphite : 2,86 — INTERDIT. Valeurs retirées, toutes conformes mais DÉLAVÉES : cyan #5BC4DE 7,24 et #9FD4E4 9,07 · or #E0BE5C 8,17 · blanc #D3E3E7 et #EAF2F3. Au-delà de 7:1 sur graphite un accent rejoint le blanc du titre : le plancher protège la lisibilité, le plafond protège le signal. TEXTE D'ACCENT SUR FOND FONCÉ — cyan-clair #4FA6BE (v3.3) sur graphite #1B2A3A 5,23 · sur graphite sombre #111B26 6,23 · sur graphite moyen #2C4256 3,73 (GRAND TEXTE SEULEMENT : titres ≥ 24 px, jamais du corps). INTERDIT ailleurs : sur blanc 2,79 · sur fond teinté 2,33 · sur aplat cyan 1,99 · sur gris tech 1,66. Motif du token : le cyan AA #0A6474 tombe à 2,15 sur graphite. Sur fond foncé, l'accent s'écrit cyan-clair ; sur fond clair, il s'écrit cyan-texte. Jamais l'inverse. ÉLÉMENTS GRAPHIQUES SUR BLANC (seuil 3:1) cyan 5,56 · ardoise 4,63 · or 3,42 La bordure #D3D8DE (1,43) reste décorative : jamais seule porteuse d'une information. ============================================================ */