dates default to the French long form; portrait shows as a squircle, not a circle

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

components/date.js

 import { parseISO, format } from 'date-fns'
+import { fr } from 'date-fns/locale'
 
-export default function Date({ dateString, dateFormat }) {
+/**
+ * Localized date. The site's default language is French, so the default is
+ * the French long form ("1er novembre 2026"); `dateFormat` still wins when a
+ * caller wants a specific shape.
+ */
+export default function Date({ dateString, dateFormat, lang = 'fr' }) {
   const date = parseISO(dateString)
-  const finalFormat = dateFormat || 'LLLL d, yyyy'
+  const finalFormat = dateFormat || 'd LLLL yyyy'
 
-  return <time dateTime={dateString}>{format(date, finalFormat)}</time>
+  return (
+    <time dateTime={dateString}>
+      {format(date, finalFormat, { locale: lang === 'fr' ? fr : undefined })}
+    </time>
+  )
 }

styles/utils.module.css

@@ -25,8 +25,10 @@
   line-height: 1.5;
 }
 
+/* The portrait is square art — a hard circle crops it badly, a squircle
+   keeps the whole frame. */
 .borderCircle {
-  border-radius: 9999px;
+  border-radius: 22%;
 }
 
 .colorInherit {