/* SetupExpress — Mode sombre Activation : data-theme="dark" sur (global) ou sur n'importe quel conteneur (scopé). Même vocabulaire que le light : canvas BRUN chaud (jamais gris froid), orange terre cuite, vert signal rare. Les blocs « ink » (manifeste, CTA) restent la ponctuation la plus dense : en sombre ils descendent SOUS le canvas (#0D0A08) au lieu de monter au-dessus. CONTRASTES VÉRIFIÉS (WCAG, sur --surface #171210) : - --text #D8CEC0 ..................... ~12:1 AAA ✓ - --text-strong #F4EDE2 .............. ~14.5:1 AAA ✓ - --text-muted #A2968A ............... ~6.1:1 AA ✓ (AA aussi sur --surface-2) - --accent-deep #F97316 .............. ~6.7:1 AA ✓ (texte / liens / eyebrows) - --accent-deep sur --accent-tint .... ~5.8:1 AA ✓ (badges sur tint sombre) - blanc sur --accent #D14508 ......... 4.6:1 AA ✓ (aplats boutons, inchangé) - --signal #4ADE80 ................... ~10.9:1 AAA ✓ - --negative #F0906B ................. ~7.9:1 AA ✓ - --focus-ring #F97316 ............... visible sur tous les fonds sombres ✓ */ [data-theme="dark"] { color-scheme: dark; /* ---- Neutres : canvas brun chaud, profond ---- */ --surface: #171210; /* canvas principal */ --surface-2: #211A14; /* sections alternées, cartes */ --surface-3: #2B2219; /* séparations, hovers */ --surface-raised: #251D16; /* niveau le plus élevé (carte vedette) */ --ink: #0D0A08; /* ponctuation : plus DENSE que le canvas */ --ink-2: #191410; /* surface levée sur ink */ /* ---- Texte ---- */ --text-strong: #F4EDE2; --text: #D8CEC0; --text-muted: #A2968A; --text-on-ink: #F4EDE2; --text-on-ink-muted: #B7AC9C; /* ---- Accent orange (aplats inchangés — blanc dessus reste AA) ---- */ --accent-deep: #F97316; /* TOUT orange en texte/lien/eyebrow passe au lumineux */ --accent-on-dark: #F97316; --accent-tint: #33190D; /* tint inversée : fond orange sombre */ --accent-border: #58351F; /* ---- Signal vert ---- */ --signal: #4ADE80; --signal-tint: #0D2917; /* ---- Alerte / négatif ---- */ --negative: #F0906B; --negative-tint: #331712; --negative-border:#57291B; --negative-muted: #6E6357; /* ---- Bordures & lignes ---- */ --border: #362C22; --border-strong: #483B2D; --hairline: #2A211A; /* ---- Champs de formulaire ---- */ --field-bg: #211A14; /* ---- Focus ---- */ --focus-ring: #F97316; /* ---- Élévation : en sombre, les ombres portent plus noir ---- */ --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.30); --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.30), 0 2px 6px rgba(0, 0, 0, 0.28); --shadow-md: 0 1px 2px rgba(0, 0, 0, 0.30), 0 4px 12px rgba(0, 0, 0, 0.32), 0 12px 28px rgba(0, 0, 0, 0.28); --shadow-lg: 0 1px 2px rgba(0, 0, 0, 0.32), 0 8px 20px rgba(0, 0, 0, 0.36), 0 24px 48px rgba(0, 0, 0, 0.36); --shadow-accent: 0 2px 8px rgba(209, 69, 8, 0.20), 0 16px 40px rgba(209, 69, 8, 0.16); }