feat: design system overhaul — sidebar, AI chats, settings, brainstorm, color cleanup

- Sidebar: dynamic brand-accent colors, brainstorm section restyled
- AI chat general: popup panel with expand/collapse, hides when contextual AI open
- AI chat contextual: tabs reordered (Actions first), X close button, height fix
- Settings: all tabs restyled, 6 new color presets (sage, terracotta, iron, etc.)
- Global color cleanup: emerald/orange hardcoded → brand-accent dynamic
- Brainstorm page: orange → brand-accent throughout
- PageEntry animation component added to key pages
- Floating AI button: bg-brand-accent instead of hardcoded black
- i18n: all 15 locales updated with new AI/billing keys
- Billing: freemium quota tracking, BYOK, stripe subscription scaffolding
- Admin: integrated into new design
- AGENTS.md + CLAUDE.md project rules added

memento-note/app/(main)/settings/layout.tsx

@@ -8,24 +8,20 @@ export default function SettingsLayout({
     children: React.ReactNode
 }) {
     return (
-        <div className="flex flex-col h-full bg-[#F2F0E9]">
-            {/* Architectural header — matches Agents page */}
-            <header className="flex flex-col px-12 pt-10 pb-0 border-b border-border/40 shrink-0">
-                <div className="flex items-end justify-between mb-6">
-                    <div>
-                        <h1 className="font-memento-serif text-4xl font-medium tracking-tight text-foreground leading-tight">
-                            Paramètres
-                        </h1>
-                        <p className="text-[11px] text-muted-foreground uppercase tracking-[0.2em] font-bold mt-2">
-                            Configuration &amp; Préférences
-                        </p>
-                    </div>
+        <div className="flex flex-col h-full bg-[#F2F0E9] dark:bg-dark-paper">
+            <header className="px-12 pt-20 pb-16 space-y-12 shrink-0">
+                <div className="space-y-4">
+                    <h1 className="text-[64px] font-serif text-ink tracking-tight leading-none italic font-medium">
+                        Paramètres
+                    </h1>
+                    <p className="text-[10px] font-bold uppercase tracking-[0.4em] text-concrete opacity-60">
+                        Configuration & Préférences
+                    </p>
                 </div>
-                {/* Tab nav flush to the border-bottom of header */}
-                <SettingsNav className="-mb-px" />
+
+                <SettingsNav />
             </header>
 
-            {/* Page Content */}
             <div className="flex-1 overflow-y-auto">
                 <div className="max-w-5xl mx-auto px-12 py-10 space-y-8">
                     {children}