/* ================================================================
   Math Universe — JETONS DE DESIGN (feuille partagée, handle « mu-jetons »)

   Seule source des couleurs, polices, tailles, espacements, rayons et
   ombres du nouvel habillage. Cette feuille ne contient QUE des
   propriétés personnalisées sur :root : elle ne dessine rien à elle
   seule, on peut donc la déclarer en dépendance sans effet de bord
   (mu-fiche du lot 5, futur thème math-universe du lot 6).

   Valeurs : rapport styles §7.1 (docs/rapports/styles.md), relevées à
   l'écran sur le site ; aucune couleur nouvelle. Les fonds teintés des
   états (erreur, succès, survol) sont DÉRIVÉS des jetons : mélange du
   jeton avec du blanc au pourcentage indiqué, calculé une fois et écrit
   en hexadécimal (pas de color-mix() : iOS 15, encore répandu chez les
   élèves, ne le lit pas). Pas de valeur codée en dur hors d'ici.

   Contrastes (WCAG 2.1, calculés le 09/11/2026, outil du lot H) :
   violet-700 sur blanc 10,4:1 ; violet-900 12,4:1 ; texte-doux 4,8:1 ;
   erreur 5,6:1 ; succès 5,0:1 ; trait des champs (violet-700 à 60 %)
   3,7:1 (WCAG 1.4.11, bord d'un composant : 3:1).

   Mise en file par modules/habillage/habillage.php (noyau Math Universe
   Core), avant les feuilles des familles. Créée le 09/11/2026 (lot H).
   ================================================================ */

:root {
	/* --- Marque --- */
	--mu-violet-900: #41246D;
	--mu-violet-700: #501AA2;
	--mu-violet-500: #8943F3;
	--mu-violet-300: #B966E7;  /* décor seulement (blanc dessus 3,4:1) */
	--mu-violet-50: #F5F1FC;
	--mu-orange-500: #FF9616;
	--mu-orange-700: #CC7000;
	--mu-rose-500: #F24080;    /* décor seulement (3,6:1 sur blanc) */
	--mu-rose-700: #961040;

	/* --- Neutres --- */
	--mu-encre: #111111;
	--mu-texte: #414141;
	--mu-texte-doux: #6B7385;
	--mu-trait: #E9E2F8;
	--mu-fond-champ: #F8F8F8;
	--mu-fond-page: #FFFFFF;
	--mu-succes: #15803D;
	--mu-erreur: #C62828;

	/* --- Rôles --- */
	--mu-primaire: var(--mu-violet-700);
	--mu-primaire-survol: var(--mu-violet-900);
	--mu-lien: var(--mu-violet-700);
	--mu-lien-survol: var(--mu-violet-900);
	--mu-accent: var(--mu-orange-500);
	--mu-texte-sur-accent: var(--mu-violet-900);
	--mu-degrade-cta: linear-gradient(90deg, var(--mu-violet-700), var(--mu-violet-500));
	--mu-fond-entete: var(--mu-violet-700);
	--mu-fond-pied: var(--mu-violet-900);
	--mu-texte-sur-fonce: #D9D9D9;        /* texte clair du pied (PLAN §4.4) : 8,8:1 sur violet-900 */

	/* --- Dérivés (états) : jeton mélangé à du blanc (pourcentage du jeton) --- */
	--mu-trait-champ: #9676C7;            /* violet-700 60 % : bord de champ, 3,7:1 sur blanc */
	--mu-teinte-primaire: #F1EDF8;        /* violet-700 8 % : survol, fond de pastille */
	--mu-teinte-primaire-forte: #E6DFF2;  /* violet-700 14 % : violet-700 dessus 8,1:1 */
	--mu-erreur-fond: #FBF0F0;            /* erreur 7 % : texte erreur dessus 5,0:1 */
	--mu-erreur-trait: #EEBEBE;           /* erreur 30 % */
	--mu-succes-fond: #ECF5EF;            /* succès 8 % : texte succès dessus 4,5:1 */
	--mu-accent-fond: #FFF0DE;            /* orange-500 14 % */
	--mu-voile: rgba(65, 36, 109, .62);   /* violet-900 à 62 % : fond des fenêtres */
	--mu-quadrillage: rgba(255, 255, 255, .06); /* lignes du « cahier » sur fond violet */

	/* --- Typographie : 2 familles, 1 pile --- */
	/* « Mulish repli » : repli local ajusté en taille, défini par le futur thème (@font-face) ;
	   inconnu sous Histudy, il est sauté et le rendu ne change pas. */
	--mu-police: "Mulish", "Mulish repli", "Tajawal", system-ui, -apple-system, "Segoe UI", sans-serif;
	--mu-police-ar: "Tajawal", "Mulish", system-ui, sans-serif;
	--mu-t-xs: 13px;
	--mu-t-sm: 14px;
	--mu-t-base: 16px;
	--mu-t-md: 18px;
	--mu-h6: 16px;
	--mu-h5: 18px;
	--mu-h4: 20px;
	--mu-h3: 24px;
	--mu-h2: clamp(24px, 3vw, 30px);
	--mu-h1: clamp(30px, 4vw, 38px);
	--mu-display: clamp(34px, 5vw, 48px);
	--mu-g-texte: 400;
	--mu-g-ui: 700;
	--mu-g-titre: 800;
	--mu-il-texte: 1.6;
	--mu-il-titre: 1.2;

	/* --- Espacements (base 4) --- */
	--mu-e-1: 4px;
	--mu-e-2: 8px;
	--mu-e-3: 12px;
	--mu-e-4: 16px;
	--mu-e-5: 24px;
	--mu-e-6: 32px;
	--mu-e-7: 48px;
	--mu-e-8: 64px;
	--mu-e-9: 96px;
	--mu-section: clamp(48px, 8vw, 96px);
	--mu-largeur: 1140px;
	--mu-gouttiere: 16px;

	/* --- Formes --- */
	--mu-r-sm: 8px;
	--mu-r-md: 14px;
	--mu-r-pill: 999px;
	--mu-champ-h: 48px;
	--mu-btn-h-sm: 40px;
	--mu-btn-h: 48px;
	--mu-btn-h-lg: 56px;
	--mu-ombre-carte: 0 6px 34px rgba(215, 216, 222, .41);
	--mu-ombre-haute: 0 15px 34px rgba(175, 181, 204, .32);
	--mu-ombre-modale: 0 24px 64px rgba(33, 18, 58, .34);
	--mu-focus: 0 0 0 3px rgba(137, 67, 243, .35);
	--mu-focus-anneau: 0 0 0 2px #fff, 0 0 0 5px var(--mu-violet-700);
	--mu-transition: .25s cubic-bezier(.645, .045, .355, 1);
}