feat(design-system): reskin Charcoal — tokens dark-default + sidebar navy permanent

- Remplacement intégral index.css par palette Charcoal (DESIGN_SYSTEM.md v2.0)
- Dark = thème par défaut, .light = override via @custom-variant light
- Sidebar navy #0C1528 permanent (identique dark+light)
- Script anti-FOUC inline dans index.html
- Layout : radial-gradient sur <main>, sidebar 230px, max-w-[1100px]
- Renommage tokens Boréal→Charcoal sur ~45 composants
- Inversion dark: → baseline + light: sur primitives shadcn
- Fix logo blanc forcé dans sidebar
- ADR 006 mis à jour

Typecheck: OK · Tests: 122/122 ✅

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/app/BottomNav.tsx

@@ -5,7 +5,7 @@
  * "Simuler" ouvre une bottom sheet (EE / EO / Examen blanc).
  * Tap target 44×44px minimum (DESIGN_SYSTEM.md §7).
  *
- * Règle L : tokens Direction H exclusivement.
+ * Règle L : tokens du design system exclusivement.
  * Règle H : aucune logique métier — navigation uniquement.
  */
 
@@ -32,6 +32,12 @@ export function BottomNav() {
     navigate(to)
   }
 
+  const navItemClasses = (active: boolean) =>
+    cn(
+      'flex min-h-[44px] flex-1 flex-col items-center justify-center gap-0.5 text-[10px] font-medium transition-colors duration-150',
+      active ? 'text-brand-text' : 'text-ink-tertiary hover:text-ink-primary',
+    )
+
   return (
     <>
       {/* Bottom sheet overlay */}
@@ -48,9 +54,9 @@ export function BottomNav() {
         <div
           role="dialog"
           aria-label="Choisir une simulation"
-          className="fixed bottom-16 left-0 right-0 z-50 rounded-t-xl border-t border-line bg-surface px-2 py-2 shadow-md lg:hidden"
+          className="fixed bottom-16 left-0 right-0 z-50 rounded-t-xl border-t border-border bg-surface px-2 py-2 shadow-raised lg:hidden"
         >
-          <p className="px-3 pb-2 pt-1 text-[11px] font-semibold uppercase tracking-widest text-ink-5">
+          <p className="px-3 pb-2 pt-1 text-[11px] font-semibold uppercase tracking-widest text-ink-tertiary">
             Simuler
           </p>
           <ul role="list">
@@ -59,7 +65,7 @@ export function BottomNav() {
                 <button
                   type="button"
                   onClick={() => handleSheetNavigate(item.to)}
-                  className="flex min-h-[44px] w-full items-center rounded-md px-3 text-sm text-ink-2 transition-colors duration-150 hover:bg-canvas hover:text-ink-1"
+                  className="flex min-h-[44px] w-full items-center rounded-md px-3 text-sm text-ink-primary transition-colors duration-150 hover:bg-surface-hover"
                 >
                   {item.label}
                 </button>
@@ -72,19 +78,16 @@ export function BottomNav() {
       {/* Bottom nav bar */}
       <nav
         aria-label="Navigation mobile"
-        className="fixed bottom-0 left-0 right-0 z-30 flex h-16 items-center border-t border-line bg-surface lg:hidden"
+        className="fixed bottom-0 left-0 right-0 z-30 flex h-16 items-center border-t border-border bg-surface lg:hidden"
       >
         {/* Accueil */}
         <Link
           to="/dashboard"
           aria-label="Accueil"
-          className={cn(
-            'flex min-h-[44px] flex-1 flex-col items-center justify-center gap-0.5 text-[10px] font-medium transition-colors duration-150',
-            isActive('/dashboard') ? 'text-expria' : 'text-ink-4 hover:text-ink-2',
-          )}
+          className={navItemClasses(isActive('/dashboard'))}
         >
           <Home
-            className={cn('size-5', isActive('/dashboard') && 'text-expria')}
+            className={cn('size-5', isActive('/dashboard') && 'text-brand-text')}
             aria-hidden="true"
           />
           Accueil
@@ -96,13 +99,10 @@ export function BottomNav() {
           aria-label="Simuler"
           aria-expanded={isSheetOpen}
           onClick={() => setIsSheetOpen((v) => !v)}
-          className={cn(
-            'flex min-h-[44px] flex-1 flex-col items-center justify-center gap-0.5 text-[10px] font-medium transition-colors duration-150',
-            isActive('/simulation') || isSheetOpen ? 'text-expria' : 'text-ink-4 hover:text-ink-2',
-          )}
+          className={navItemClasses(isActive('/simulation') || isSheetOpen)}
         >
           <BookOpen
-            className={cn('size-5', (isActive('/simulation') || isSheetOpen) && 'text-expria')}
+            className={cn('size-5', (isActive('/simulation') || isSheetOpen) && 'text-brand-text')}
             aria-hidden="true"
           />
           Simuler
@@ -112,13 +112,10 @@ export function BottomNav() {
         <Link
           to="/progression"
           aria-label="Progression"
-          className={cn(
-            'flex min-h-[44px] flex-1 flex-col items-center justify-center gap-0.5 text-[10px] font-medium transition-colors duration-150',
-            isActive('/progression') ? 'text-expria' : 'text-ink-4 hover:text-ink-2',
-          )}
+          className={navItemClasses(isActive('/progression'))}
         >
           <TrendingUp
-            className={cn('size-5', isActive('/progression') && 'text-expria')}
+            className={cn('size-5', isActive('/progression') && 'text-brand-text')}
             aria-hidden="true"
           />
           Progression
@@ -128,13 +125,10 @@ export function BottomNav() {
         <Link
           to="/parametres"
           aria-label="Compte"
-          className={cn(
-            'flex min-h-[44px] flex-1 flex-col items-center justify-center gap-0.5 text-[10px] font-medium transition-colors duration-150',
-            isActive('/parametres') ? 'text-expria' : 'text-ink-4 hover:text-ink-2',
-          )}
+          className={navItemClasses(isActive('/parametres'))}
         >
           <User
-            className={cn('size-5', isActive('/parametres') && 'text-expria')}
+            className={cn('size-5', isActive('/parametres') && 'text-brand-text')}
             aria-hidden="true"
           />
           Compte