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/AppLayout.tsx

@@ -38,10 +38,16 @@ export function AppLayout({ children }: AppLayoutProps) {
     setIsMobileMenuOpen(false)
   }, [location.pathname])
 
+  const mainBackground = `
+    radial-gradient(ellipse at 35% 0%, var(--color-gradient-a), transparent 55%),
+    radial-gradient(ellipse at 80% 100%, var(--color-gradient-b), transparent 50%),
+    var(--color-canvas)
+  `
+
   return (
-    <div className="min-h-screen bg-canvas">
-      {/* ── DESKTOP — Sidebar fixe 240px ───────────────────────────── */}
-      <aside className="hidden lg:fixed lg:inset-y-0 lg:left-0 lg:flex lg:w-60 lg:flex-col">
+    <div className="min-h-screen">
+      {/* ── DESKTOP — Sidebar fixe 230px ───────────────────────────── */}
+      <aside className="hidden lg:fixed lg:inset-y-0 lg:left-0 lg:flex lg:w-[230px] lg:flex-col">
         <Sidebar plan={plan} />
       </aside>
 
@@ -53,7 +59,7 @@ export function AppLayout({ children }: AppLayoutProps) {
         aria-hidden="true"
         onClick={() => setIsMobileMenuOpen(false)}
         className={cn(
-          'fixed inset-0 z-40 bg-ink-1/30 transition-opacity duration-200 ease-out lg:hidden',
+          'fixed inset-0 z-40 bg-black/40 transition-opacity duration-200 ease-out lg:hidden',
           isMobileMenuOpen ? 'opacity-100' : 'pointer-events-none opacity-0',
         )}
       />
@@ -61,7 +67,7 @@ export function AppLayout({ children }: AppLayoutProps) {
       {/* ── MOBILE — Drawer panel ──────────────────────────────────── */}
       <div
         className={cn(
-          'fixed inset-y-0 left-0 z-50 flex w-60 flex-col transition-transform duration-200 ease-out lg:hidden',
+          'fixed inset-y-0 left-0 z-50 flex w-[230px] flex-col transition-transform duration-200 ease-out lg:hidden',
           isMobileMenuOpen ? 'translate-x-0' : '-translate-x-full',
         )}
         aria-hidden={!isMobileMenuOpen}
@@ -69,9 +75,14 @@ export function AppLayout({ children }: AppLayoutProps) {
         <Sidebar plan={plan} />
       </div>
 
-      {/* ── Zone de contenu ────────────────────────────────────────── */}
+      {/* ── Zone de contenu principale ─────────────────────────────── */}
       {/* pb-16 sur mobile pour ne pas être masqué par le BottomNav fixe */}
-      <div className="pb-16 lg:pl-60 lg:pb-0">{children}</div>
+      <main
+        className="min-h-screen pb-16 lg:pb-0 lg:pl-[230px]"
+        style={{ background: mainBackground }}
+      >
+        <div className="mx-auto max-w-[1100px] px-5 py-6 lg:px-9 lg:py-9">{children}</div>
+      </main>
 
       {/* ── MOBILE — BottomNav fixe ────────────────────────────────── */}
       <BottomNav />