enhance styling for code blocks in article page

.claude/settings.local.json

@@ -12,7 +12,9 @@
       "Bash(Get-ChildItem -Path \"d:\\\\2 - Projets\\\\matheoguilbert.fr\" -Recurse -Depth 2)",
       "Bash(Select-Object -First 50)",
       "Bash(Format-Table FullName)",
-      "PowerShell(Get-ChildItem -Path \"d:\\\\2 - Projets\\\\matheoguilbert.fr\" -Recurse -Depth 2 | Select-Object -ExpandProperty FullName | Where-Object { $_ -notmatch 'node_modules|\\\\.next' } | Select-Object -First 80)"
+      "PowerShell(Get-ChildItem -Path \"d:\\\\2 - Projets\\\\matheoguilbert.fr\" -Recurse -Depth 2 | Select-Object -ExpandProperty FullName | Where-Object { $_ -notmatch 'node_modules|\\\\.next' } | Select-Object -First 80)",
+      "Bash(grep -o '<pre[^>]*>.\\\\{0,200\\\\}' /tmp/page.html | head -20; echo \"---mermaid---\"; grep -o 'mermaid' /tmp/page.html | head -5; echo \"---count pre---\"; grep -o '<pre' /tmp/page.html | wc -l)",
+      "Read(//tmp/**)"
     ]
   }
 }

app/[locale]/blog/[slug]/page.tsx

@@ -218,6 +218,9 @@ export default async function ArticlePage({ params }: props) {
                         [&_a]:text-brand-brown [&_a]:underline 
                         [&_ul]:font-sans [&_ul]:text-sm [&_ul]:text-brand-brown/70 [&_ul]:leading-[1.9] [&_ul]:list-disc [&_ul]:pl-5 [&_ul]:space-y-1
                         [&_li]:font-sans [&_li]:text-sm [&_li]:text-brand-brown/70 [&_li]:leading-[1.9]
+                        [&_pre]:bg-brand-brown [&_pre]:text-brand-beige [&_pre]:rounded-lg [&_pre]:p-4 [&_pre]:overflow-x-auto [&_pre]:text-xs [&_pre]:leading-relaxed
+                        [&_pre_code]:font-mono [&_pre_code]:bg-transparent [&_pre_code]:p-0
+                        [&_code]:font-mono [&_code]:text-xs [&_code]:bg-brand-brown/10 [&_code]:text-brand-brown [&_code]:rounded [&_code]:px-1.5 [&_code]:py-0.5
                     "
                 >
                     <MDXRemote