From 59c8512f80a448463313023ced71088d78820759 Mon Sep 17 00:00:00 2001
From: Dinesh <13635627+HumbleBee14@users.noreply.github.com>
Date: Sun, 12 Jul 2026 21:53:01 -0700
Subject: [PATCH 1/4] Self-host fonts; swap display serif Fraunces ->
 Newsreader

- Display font is now Newsreader (calmer, screen-optimised editorial
  serif) instead of Fraunces, whose hooked f read as too quirky.
- All four families (Newsreader, Hanken Grotesk, Source Serif 4,
  JetBrains Mono) are now self-hosted via @fontsource (latin subset,
  font-display: swap) instead of loaded from Google Fonts. Removes the
  third-party request/connection for faster first paint and better
  privacy; no visual FOUC change.
- Dropped the Google Fonts <link>/preconnect from BaseLayout.
- OG images render titles/taglines in Newsreader (normal + italic).
- Removed now-unused @fontsource/fraunces and instrument-serif.

Build, astro check, and tests all pass locally.
---
 package-lock.json            | 36 ++++++++++++++++++++++------------
 package.json                 |  5 +++--
 src/layouts/BaseLayout.astro | 38 +++++++++++++++++-------------------
 src/lib/og.tsx               | 24 ++++++++++++-----------
 src/styles/global.css        |  4 ++--
 5 files changed, 59 insertions(+), 48 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index be014f8..abce24f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -17,9 +17,10 @@
         "@blocknote/core": "^0.51.4",
         "@blocknote/mantine": "^0.51.4",
         "@blocknote/react": "^0.51.4",
-        "@fontsource/fraunces": "^5.2.9",
-        "@fontsource/instrument-serif": "^5.2.8",
+        "@fontsource/hanken-grotesk": "^5.2.8",
         "@fontsource/jetbrains-mono": "^5.2.8",
+        "@fontsource/newsreader": "^5.2.10",
+        "@fontsource/source-serif-4": "^5.2.9",
         "@resvg/resvg-js": "^2.6.2",
         "astro": "^5.1.0",
         "jszip": "^3.10.1",
@@ -1618,28 +1619,37 @@
       "integrity": "sha512-HpCo8tmWzLVad5s2d19EhAz5zqrrQ6s69qd6moPMQvkOuSwDT1YgRfWSVuc4ennqrgv3OHppiOGMQ7oC13yIww==",
       "license": "MIT"
     },
-    "node_modules/@fontsource/fraunces": {
-      "version": "5.2.9",
-      "resolved": "https://registry.npmjs.org/@fontsource/fraunces/-/fraunces-5.2.9.tgz",
-      "integrity": "sha512-XDzuddBtoC7BZgZdBn6b7hsFZY2+V1hgN7yca5fBTKuHjb/lOd45a0Ji8dTUgFhPoL7RdGupo+bC2BFSt6UH8Q==",
+    "node_modules/@fontsource/hanken-grotesk": {
+      "version": "5.2.8",
+      "resolved": "https://registry.npmjs.org/@fontsource/hanken-grotesk/-/hanken-grotesk-5.2.8.tgz",
+      "integrity": "sha512-J/e6hdfNCbyc4WK5hmZtk0zjaIsFx3pvCdPVxY25iYw2C9v1ZggGz4nfHnRjMhcz4WfaadUuwLNtvj8sQ70tkg==",
       "license": "OFL-1.1",
       "funding": {
         "url": "https://github.com/sponsors/ayuhito"
       }
     },
-    "node_modules/@fontsource/instrument-serif": {
+    "node_modules/@fontsource/jetbrains-mono": {
       "version": "5.2.8",
-      "resolved": "https://registry.npmjs.org/@fontsource/instrument-serif/-/instrument-serif-5.2.8.tgz",
-      "integrity": "sha512-s+bkz+syj2rO00Rmq9g0P+PwuLig33DR1xDR8pTWmovH1pUjwnncrFk++q9mmOex8fUQ7oW80gPpPDaw7V1MMw==",
+      "resolved": "https://registry.npmjs.org/@fontsource/jetbrains-mono/-/jetbrains-mono-5.2.8.tgz",
+      "integrity": "sha512-6w8/SG4kqvIMu7xd7wt6x3idn1Qux3p9N62s6G3rfldOUYHpWcc2FKrqf+Vo44jRvqWj2oAtTHrZXEP23oSKwQ==",
       "license": "OFL-1.1",
       "funding": {
         "url": "https://github.com/sponsors/ayuhito"
       }
     },
-    "node_modules/@fontsource/jetbrains-mono": {
-      "version": "5.2.8",
-      "resolved": "https://registry.npmjs.org/@fontsource/jetbrains-mono/-/jetbrains-mono-5.2.8.tgz",
-      "integrity": "sha512-6w8/SG4kqvIMu7xd7wt6x3idn1Qux3p9N62s6G3rfldOUYHpWcc2FKrqf+Vo44jRvqWj2oAtTHrZXEP23oSKwQ==",
+    "node_modules/@fontsource/newsreader": {
+      "version": "5.2.10",
+      "resolved": "https://registry.npmjs.org/@fontsource/newsreader/-/newsreader-5.2.10.tgz",
+      "integrity": "sha512-TFaYzoFhDqarUyV2yYjgZZEwT4bpaj6sGBnXSnFknQ/QB8/9LzfY6IO9+inHOX4zzPp87Z7/KuG1OI5gr91Q3A==",
+      "license": "OFL-1.1",
+      "funding": {
+        "url": "https://github.com/sponsors/ayuhito"
+      }
+    },
+    "node_modules/@fontsource/source-serif-4": {
+      "version": "5.2.9",
+      "resolved": "https://registry.npmjs.org/@fontsource/source-serif-4/-/source-serif-4-5.2.9.tgz",
+      "integrity": "sha512-er/Pym9emsEVJNf947umJ4kXarXfsiN6CN7kTYinefKRaHLwiquiiHOZvKvxWgkV8JMCf3pV3g0NcsPFpVCH9w==",
       "license": "OFL-1.1",
       "funding": {
         "url": "https://github.com/sponsors/ayuhito"
diff --git a/package.json b/package.json
index 8a79b73..83f9709 100644
--- a/package.json
+++ b/package.json
@@ -39,9 +39,10 @@
     "@blocknote/core": "^0.51.4",
     "@blocknote/mantine": "^0.51.4",
     "@blocknote/react": "^0.51.4",
-    "@fontsource/fraunces": "^5.2.9",
-    "@fontsource/instrument-serif": "^5.2.8",
+    "@fontsource/hanken-grotesk": "^5.2.8",
     "@fontsource/jetbrains-mono": "^5.2.8",
+    "@fontsource/newsreader": "^5.2.10",
+    "@fontsource/source-serif-4": "^5.2.9",
     "@resvg/resvg-js": "^2.6.2",
     "astro": "^5.1.0",
     "jszip": "^3.10.1",
diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
index 0fc92bc..0a71569 100644
--- a/src/layouts/BaseLayout.astro
+++ b/src/layouts/BaseLayout.astro
@@ -9,6 +9,23 @@ import AnalyticsConsent from '@/components/AnalyticsConsent.tsx';
 import SearchModal from '@/components/SearchModal.tsx';
 import '@/styles/global.css';
 
+// Self-hosted fonts (latin subset). No third-party request; @fontsource sets font-display: swap.
+import '@fontsource/newsreader/latin-400.css';
+import '@fontsource/newsreader/latin-500.css';
+import '@fontsource/newsreader/latin-600.css';
+import '@fontsource/newsreader/latin-400-italic.css';
+import '@fontsource/newsreader/latin-600-italic.css';
+import '@fontsource/hanken-grotesk/latin-400.css';
+import '@fontsource/hanken-grotesk/latin-500.css';
+import '@fontsource/hanken-grotesk/latin-600.css';
+import '@fontsource/hanken-grotesk/latin-700.css';
+import '@fontsource/source-serif-4/latin-400.css';
+import '@fontsource/source-serif-4/latin-600.css';
+import '@fontsource/source-serif-4/latin-400-italic.css';
+import '@fontsource/jetbrains-mono/latin-400.css';
+import '@fontsource/jetbrains-mono/latin-500.css';
+import '@fontsource/jetbrains-mono/latin-600.css';
+
 interface Props {
   title?: string;
   description?: string;
@@ -160,26 +177,7 @@ const siteJsonLd = [
   <meta name="twitter:site" content={SITE.twitter} />
   <meta name="twitter:creator" content={SITE.twitter} />
 
-  <!-- Fonts — preloaded non-blocking. Stylesheet swaps in after first paint. -->
-  <link rel="preconnect" href="https://fonts.googleapis.com" />
-  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
-  <link
-    rel="preload"
-    as="style"
-    href="https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400&family=Hanken+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,600;1,8..60,400&display=swap"
-  />
-  <link
-    rel="stylesheet"
-    href="https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400&family=Hanken+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,600;1,8..60,400&display=swap"
-    media="print"
-    onload="this.media='all'"
-  />
-  <noscript>
-    <link
-      rel="stylesheet"
-      href="https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400&family=Hanken+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,600;1,8..60,400&display=swap"
-    />
-  </noscript>
+  <!-- Fonts are self-hosted via @fontsource (imported in this layout's frontmatter). -->
 
   <!-- Favicons -->
   <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
diff --git a/src/lib/og.tsx b/src/lib/og.tsx
index a99e540..35432c6 100644
--- a/src/lib/og.tsx
+++ b/src/lib/og.tsx
@@ -62,7 +62,7 @@ const SHELL_STYLE: React.CSSProperties = {
   background: C.paper,
   padding: '64px 72px',
   position: 'relative',
-  fontFamily: 'Fraunces',
+  fontFamily: 'Newsreader',
 };
 
 const BORDER_STYLE: React.CSSProperties = {
@@ -111,7 +111,7 @@ function brandBar(): React.ReactElement {
         </span>
         <span
           style={{
-            fontFamily: 'Fraunces',
+            fontFamily: 'Newsreader',
             fontStyle: 'italic',
             fontSize: 28,
             color: C.ink2,
@@ -141,7 +141,7 @@ function template(d: OgArticle): React.ReactElement {
       <div style={{ flex: 1, display: 'flex', alignItems: 'center', marginTop: 24 }}>
         <div
           style={{
-            fontFamily: 'Fraunces',
+            fontFamily: 'Newsreader',
             fontSize: 76,
             lineHeight: 1.04,
             color: C.ink,
@@ -168,7 +168,7 @@ function pageTemplate(title: string): React.ReactElement {
       <div style={{ flex: 1, display: 'flex', alignItems: 'center', marginTop: 28 }}>
         <div
           style={{
-            fontFamily: 'Fraunces',
+            fontFamily: 'Newsreader',
             fontSize: 132,
             lineHeight: 1.0,
             color: C.ink,
@@ -215,7 +215,7 @@ function authorTemplate(name: string, bio?: string, handle?: string): React.Reac
         </div>
         <div
           style={{
-            fontFamily: 'Fraunces',
+            fontFamily: 'Newsreader',
             fontSize: 108,
             lineHeight: 1.0,
             color: C.ink,
@@ -229,7 +229,7 @@ function authorTemplate(name: string, bio?: string, handle?: string): React.Reac
         {bio && (
           <div
             style={{
-              fontFamily: 'Fraunces',
+              fontFamily: 'Newsreader',
               fontStyle: 'italic',
               fontSize: 32,
               lineHeight: 1.3,
@@ -280,7 +280,7 @@ function toolTemplate(name: string, summary: string, tag: string): React.ReactEl
         </div>
         <div
           style={{
-            fontFamily: 'Fraunces',
+            fontFamily: 'Newsreader',
             fontSize: 92,
             lineHeight: 1.0,
             color: C.ink,
@@ -294,7 +294,7 @@ function toolTemplate(name: string, summary: string, tag: string): React.ReactEl
         </div>
         <div
           style={{
-            fontFamily: 'Fraunces',
+            fontFamily: 'Newsreader',
             fontStyle: 'italic',
             fontSize: 28,
             lineHeight: 1.35,
@@ -321,7 +321,7 @@ function defaultTemplate(): React.ReactElement {
       <div style={{ flex: 1, display: 'flex', alignItems: 'center', marginTop: 28 }}>
         <div
           style={{
-            fontFamily: 'Fraunces',
+            fontFamily: 'Newsreader',
             fontSize: 124,
             lineHeight: 1.0,
             color: C.ink,
@@ -341,14 +341,16 @@ function defaultTemplate(): React.ReactElement {
 
 async function renderToPng(node: React.ReactElement, context: string): Promise<Buffer> {
   try {
-    const serif = loadFont('@fontsource/fraunces/files/fraunces-latin-400-normal.woff');
+    const serif = loadFont('@fontsource/newsreader/files/newsreader-latin-400-normal.woff');
+    const serifItalic = loadFont('@fontsource/newsreader/files/newsreader-latin-400-italic.woff');
     const mono = loadFont('@fontsource/jetbrains-mono/files/jetbrains-mono-latin-400-normal.woff');
 
     const svg = await satori(node, {
       width: 1200,
       height: 630,
       fonts: [
-        { name: 'Fraunces', data: serif, weight: 400, style: 'normal' },
+        { name: 'Newsreader', data: serif, weight: 400, style: 'normal' },
+        { name: 'Newsreader', data: serifItalic, weight: 400, style: 'italic' },
         { name: 'JetBrains Mono', data: mono, weight: 400, style: 'normal' },
       ],
     });
diff --git a/src/styles/global.css b/src/styles/global.css
index 7cd9a34..273c68c 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -27,7 +27,7 @@ html {
 
 :root {
   /* Type */
-  --font-display: 'Fraunces', 'Iowan Old Style', Georgia, serif;
+  --font-display: 'Newsreader', 'Iowan Old Style', Georgia, serif;
   --font-sans: 'Hanken Grotesk', 'Inter', system-ui, -apple-system, sans-serif;
   --font-mono: 'JetBrains Mono', ui-monospace, Menlo, monospace;
   --font-read: 'Source Serif 4', 'Source Serif Pro', Georgia, Cambria, 'Times New Roman', serif;
@@ -277,7 +277,7 @@ body {
 
 /* Type pairing modes */
 [data-typeset='editorial'] {
-  --font-display: 'Fraunces', Georgia, serif;
+  --font-display: 'Newsreader', Georgia, serif;
   --font-sans: 'Hanken Grotesk', system-ui, sans-serif;
 }
 [data-typeset='modern'] {

From 2a64d00c4f84241be96d1765768e4474cec67102 Mon Sep 17 00:00:00 2001
From: Dinesh <13635627+HumbleBee14@users.noreply.github.com>
Date: Sun, 12 Jul 2026 22:57:38 -0700
Subject: [PATCH 2/4] Playfair display font, CTA + author pages, socials,
 privacy, submit email

Font:
- Switch display serif to Playfair Display site-wide (Newsreader trial
  reverted); still self-hosted via @fontsource, OG images updated.

Contribute CTA (home + /contribute):
- Write is now the accent primary (matches header Write -> 'Write = accent'
  everywhere); Pitch is the outlined secondary; GitHub demoted to a quiet
  link. Added reusable .btn-accent.

Author pages:
- Profile shows the 5 most recent articles + a 'See all N articles' button.
- New /authors/<handle>/articles lists every article, newest first
  (shareable per-author archive). Co-authored posts appear on each author.
- Profile route moved to [handle]/index.astro; article rows now use the
  standard blog-row design with the .chip--sm topic (no redundant name).

Socials:
- Author profile socials are icon buttons (shared src/lib/socialIcons.ts,
  reused by the footer); shown only when set, profile-only. Globe for
  website, envelope for email. Added Dinesh's X / LinkedIn / website.

Footer / policy:
- Replace redundant 'Editorial policy' (opened /contribute) with 'Privacy';
  add a plain-language /privacy page (analytics, cookies, no accounts).

Editor / misc:
- Center the /write divider (width:100% on .write-separator).
- HOW-TO-SUBMIT.md gains Option 3 (email it in) + author-details prompt.
- Contact email is responsive (clamp) so it no longer wraps.
---
 package-lock.json                             |  10 +-
 package.json                                  |   2 +-
 src/components/Footer.astro                   |  38 ++----
 src/components/IconLinkCard.astro             |   4 +-
 src/content/authors/dinesh.json               |   5 +-
 src/layouts/BaseLayout.astro                  |  10 +-
 src/lib/og.tsx                                |  30 +++--
 src/lib/socialIcons.ts                        |  42 +++++++
 src/pages/authors/[handle]/articles.astro     | 116 ++++++++++++++++++
 .../{[handle].astro => [handle]/index.astro}  |  93 ++++++++++----
 src/pages/contribute/index.astro              |   2 +-
 src/pages/index.astro                         |  10 +-
 src/pages/privacy.astro                       | 108 ++++++++++++++++
 src/styles/global.css                         |  26 +++-
 src/write/WritePortal.tsx                     |   3 +-
 src/write/editor/editor-theme.css             |   1 +
 src/write/serialize/toZip.ts                  |  29 ++++-
 17 files changed, 437 insertions(+), 92 deletions(-)
 create mode 100644 src/lib/socialIcons.ts
 create mode 100644 src/pages/authors/[handle]/articles.astro
 rename src/pages/authors/{[handle].astro => [handle]/index.astro} (77%)
 create mode 100644 src/pages/privacy.astro

diff --git a/package-lock.json b/package-lock.json
index abce24f..7c98959 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -19,7 +19,7 @@
         "@blocknote/react": "^0.51.4",
         "@fontsource/hanken-grotesk": "^5.2.8",
         "@fontsource/jetbrains-mono": "^5.2.8",
-        "@fontsource/newsreader": "^5.2.10",
+        "@fontsource/playfair-display": "^5.2.8",
         "@fontsource/source-serif-4": "^5.2.9",
         "@resvg/resvg-js": "^2.6.2",
         "astro": "^5.1.0",
@@ -1637,10 +1637,10 @@
         "url": "https://github.com/sponsors/ayuhito"
       }
     },
-    "node_modules/@fontsource/newsreader": {
-      "version": "5.2.10",
-      "resolved": "https://registry.npmjs.org/@fontsource/newsreader/-/newsreader-5.2.10.tgz",
-      "integrity": "sha512-TFaYzoFhDqarUyV2yYjgZZEwT4bpaj6sGBnXSnFknQ/QB8/9LzfY6IO9+inHOX4zzPp87Z7/KuG1OI5gr91Q3A==",
+    "node_modules/@fontsource/playfair-display": {
+      "version": "5.2.8",
+      "resolved": "https://registry.npmjs.org/@fontsource/playfair-display/-/playfair-display-5.2.8.tgz",
+      "integrity": "sha512-fUEhib70SszNhQVsGbUMSsWJhr7Je0rdeuZdtGpDNu0GKF1xJM8QhpI/y0pckU25GcChXm9TLOmeZupkvvZo2g==",
       "license": "OFL-1.1",
       "funding": {
         "url": "https://github.com/sponsors/ayuhito"
diff --git a/package.json b/package.json
index 83f9709..7e97a8c 100644
--- a/package.json
+++ b/package.json
@@ -41,7 +41,7 @@
     "@blocknote/react": "^0.51.4",
     "@fontsource/hanken-grotesk": "^5.2.8",
     "@fontsource/jetbrains-mono": "^5.2.8",
-    "@fontsource/newsreader": "^5.2.10",
+    "@fontsource/playfair-display": "^5.2.8",
     "@fontsource/source-serif-4": "^5.2.9",
     "@resvg/resvg-js": "^2.6.2",
     "astro": "^5.1.0",
diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index cf570c3..4d5f740 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -1,34 +1,14 @@
 ---
 import { SITE, SOCIALS } from '@/lib/site';
+import { SOCIAL_ICONS } from '@/lib/socialIcons';
 const currentYear = new Date().getFullYear();
 
-const socialIcons = [
-  {
-    key: 'discord',
-    label: 'Discord',
-    href: SOCIALS.discord,
-    // Simple Icons — Discord
-    path: 'M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0 12.64 12.64 0 0 0-.617-1.25.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057 19.9 19.9 0 0 0 5.993 3.03.078.078 0 0 0 .084-.028 14.09 14.09 0 0 0 1.226-1.994.076.076 0 0 0-.041-.106 13.107 13.107 0 0 1-1.872-.892.077.077 0 0 1-.008-.128 10.2 10.2 0 0 0 .372-.292.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127 12.299 12.299 0 0 1-1.873.892.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028 19.839 19.839 0 0 0 6.002-3.03.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.956-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.955-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.946 2.418-2.157 2.418Z',
-  },
-  {
-    key: 'github',
-    label: 'GitHub',
-    href: SOCIALS.github,
-    path: 'M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12',
-  },
-  {
-    key: 'twitter',
-    label: 'X (Twitter)',
-    href: SOCIALS.twitter,
-    path: 'M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z',
-  },
-  {
-    key: 'linkedin',
-    label: 'LinkedIn',
-    href: SOCIALS.linkedin,
-    path: 'M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 0 1-2.063-2.065 2.063 2.063 0 1 1 2.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z',
-  },
-];
+const socialIcons = (['discord', 'github', 'twitter', 'linkedin'] as const).map((key) => ({
+  key,
+  label: SOCIAL_ICONS[key].label,
+  path: SOCIAL_ICONS[key].path,
+  href: SOCIALS[key],
+}));
 ---
 
 <footer class="footer">
@@ -82,9 +62,9 @@ const socialIcons = [
           <h2>Read</h2>
           <ul>
             <li><a href="/blog">All articles</a></li>
+            <li><a href="/authors">Authors</a></li>
             <li><a href="/topics">Topics</a></li>
             <li><a href="/tags">Tags</a></li>
-            <li><a href="/authors">Authors</a></li>
           </ul>
         </div>
 
@@ -102,7 +82,7 @@ const socialIcons = [
           <h2>Connect</h2>
           <ul>
             <li><a href="/about">About us</a></li>
-            <li><a href="/contribute">Editorial policy</a></li>
+            <li><a href="/privacy">Privacy</a></li>
             <li>
               <a
                 href={`${SITE.repoUrl}/blob/main/CODE_OF_CONDUCT.md`}
diff --git a/src/components/IconLinkCard.astro b/src/components/IconLinkCard.astro
index 10c23e1..02cf3f8 100644
--- a/src/components/IconLinkCard.astro
+++ b/src/components/IconLinkCard.astro
@@ -97,10 +97,10 @@ const external = !!href && href.startsWith('http');
   .ilc-action {
     grid-area: action;
     font-family: var(--font-display);
-    font-size: 20px;
+    font-size: clamp(15px, 4vw, 19px);
     color: var(--ink);
     line-height: 1.15;
-    word-break: break-word;
+    overflow-wrap: break-word;
     align-self: start;
     transition: color 0.15s ease;
   }
diff --git a/src/content/authors/dinesh.json b/src/content/authors/dinesh.json
index b4f126b..d16a790 100644
--- a/src/content/authors/dinesh.json
+++ b/src/content/authors/dinesh.json
@@ -1,5 +1,8 @@
 {
   "name": "Dinesh",
   "bio": "Systems engineer learning ML systems from the ground up and writing it down along the way. Interested in how the fundamentals assemble into the models and infrastructure we actually run.",
-  "role": "author"
+  "role": "author",
+  "twitter": "https://x.com/The_Dinessh",
+  "linkedin": "https://www.linkedin.com/in/dineshyd/",
+  "website": "https://dineshy.com/"
 }
diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
index 0a71569..03dfaa6 100644
--- a/src/layouts/BaseLayout.astro
+++ b/src/layouts/BaseLayout.astro
@@ -10,11 +10,11 @@ import SearchModal from '@/components/SearchModal.tsx';
 import '@/styles/global.css';
 
 // Self-hosted fonts (latin subset). No third-party request; @fontsource sets font-display: swap.
-import '@fontsource/newsreader/latin-400.css';
-import '@fontsource/newsreader/latin-500.css';
-import '@fontsource/newsreader/latin-600.css';
-import '@fontsource/newsreader/latin-400-italic.css';
-import '@fontsource/newsreader/latin-600-italic.css';
+import '@fontsource/playfair-display/latin-400.css';
+import '@fontsource/playfair-display/latin-500.css';
+import '@fontsource/playfair-display/latin-600.css';
+import '@fontsource/playfair-display/latin-400-italic.css';
+import '@fontsource/playfair-display/latin-600-italic.css';
 import '@fontsource/hanken-grotesk/latin-400.css';
 import '@fontsource/hanken-grotesk/latin-500.css';
 import '@fontsource/hanken-grotesk/latin-600.css';
diff --git a/src/lib/og.tsx b/src/lib/og.tsx
index 35432c6..b741a3d 100644
--- a/src/lib/og.tsx
+++ b/src/lib/og.tsx
@@ -62,7 +62,7 @@ const SHELL_STYLE: React.CSSProperties = {
   background: C.paper,
   padding: '64px 72px',
   position: 'relative',
-  fontFamily: 'Newsreader',
+  fontFamily: 'Playfair Display',
 };
 
 const BORDER_STYLE: React.CSSProperties = {
@@ -111,7 +111,7 @@ function brandBar(): React.ReactElement {
         </span>
         <span
           style={{
-            fontFamily: 'Newsreader',
+            fontFamily: 'Playfair Display',
             fontStyle: 'italic',
             fontSize: 28,
             color: C.ink2,
@@ -141,7 +141,7 @@ function template(d: OgArticle): React.ReactElement {
       <div style={{ flex: 1, display: 'flex', alignItems: 'center', marginTop: 24 }}>
         <div
           style={{
-            fontFamily: 'Newsreader',
+            fontFamily: 'Playfair Display',
             fontSize: 76,
             lineHeight: 1.04,
             color: C.ink,
@@ -168,7 +168,7 @@ function pageTemplate(title: string): React.ReactElement {
       <div style={{ flex: 1, display: 'flex', alignItems: 'center', marginTop: 28 }}>
         <div
           style={{
-            fontFamily: 'Newsreader',
+            fontFamily: 'Playfair Display',
             fontSize: 132,
             lineHeight: 1.0,
             color: C.ink,
@@ -215,7 +215,7 @@ function authorTemplate(name: string, bio?: string, handle?: string): React.Reac
         </div>
         <div
           style={{
-            fontFamily: 'Newsreader',
+            fontFamily: 'Playfair Display',
             fontSize: 108,
             lineHeight: 1.0,
             color: C.ink,
@@ -229,7 +229,7 @@ function authorTemplate(name: string, bio?: string, handle?: string): React.Reac
         {bio && (
           <div
             style={{
-              fontFamily: 'Newsreader',
+              fontFamily: 'Playfair Display',
               fontStyle: 'italic',
               fontSize: 32,
               lineHeight: 1.3,
@@ -280,7 +280,7 @@ function toolTemplate(name: string, summary: string, tag: string): React.ReactEl
         </div>
         <div
           style={{
-            fontFamily: 'Newsreader',
+            fontFamily: 'Playfair Display',
             fontSize: 92,
             lineHeight: 1.0,
             color: C.ink,
@@ -294,7 +294,7 @@ function toolTemplate(name: string, summary: string, tag: string): React.ReactEl
         </div>
         <div
           style={{
-            fontFamily: 'Newsreader',
+            fontFamily: 'Playfair Display',
             fontStyle: 'italic',
             fontSize: 28,
             lineHeight: 1.35,
@@ -321,7 +321,7 @@ function defaultTemplate(): React.ReactElement {
       <div style={{ flex: 1, display: 'flex', alignItems: 'center', marginTop: 28 }}>
         <div
           style={{
-            fontFamily: 'Newsreader',
+            fontFamily: 'Playfair Display',
             fontSize: 124,
             lineHeight: 1.0,
             color: C.ink,
@@ -341,16 +341,20 @@ function defaultTemplate(): React.ReactElement {
 
 async function renderToPng(node: React.ReactElement, context: string): Promise<Buffer> {
   try {
-    const serif = loadFont('@fontsource/newsreader/files/newsreader-latin-400-normal.woff');
-    const serifItalic = loadFont('@fontsource/newsreader/files/newsreader-latin-400-italic.woff');
+    const serif = loadFont(
+      '@fontsource/playfair-display/files/playfair-display-latin-400-normal.woff',
+    );
+    const serifItalic = loadFont(
+      '@fontsource/playfair-display/files/playfair-display-latin-400-italic.woff',
+    );
     const mono = loadFont('@fontsource/jetbrains-mono/files/jetbrains-mono-latin-400-normal.woff');
 
     const svg = await satori(node, {
       width: 1200,
       height: 630,
       fonts: [
-        { name: 'Newsreader', data: serif, weight: 400, style: 'normal' },
-        { name: 'Newsreader', data: serifItalic, weight: 400, style: 'italic' },
+        { name: 'Playfair Display', data: serif, weight: 400, style: 'normal' },
+        { name: 'Playfair Display', data: serifItalic, weight: 400, style: 'italic' },
         { name: 'JetBrains Mono', data: mono, weight: 400, style: 'normal' },
       ],
     });
diff --git a/src/lib/socialIcons.ts b/src/lib/socialIcons.ts
new file mode 100644
index 0000000..01ef050
--- /dev/null
+++ b/src/lib/socialIcons.ts
@@ -0,0 +1,42 @@
+export interface SocialIcon {
+  label: string;
+  /** Simple Icons / Material path data, viewBox 0 0 24 24. */
+  path: string;
+}
+
+export const SOCIAL_ICONS: Record<string, SocialIcon> = {
+  discord: {
+    label: 'Discord',
+    path: 'M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0 12.64 12.64 0 0 0-.617-1.25.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057 19.9 19.9 0 0 0 5.993 3.03.078.078 0 0 0 .084-.028 14.09 14.09 0 0 0 1.226-1.994.076.076 0 0 0-.041-.106 13.107 13.107 0 0 1-1.872-.892.077.077 0 0 1-.008-.128 10.2 10.2 0 0 0 .372-.292.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127 12.299 12.299 0 0 1-1.873.892.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028 19.839 19.839 0 0 0 6.002-3.03.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.956-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419 0-1.333.955-2.419 2.157-2.419 1.21 0 2.176 1.096 2.157 2.42 0 1.333-.946 2.418-2.157 2.418Z',
+  },
+  github: {
+    label: 'GitHub',
+    path: 'M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12',
+  },
+  twitter: {
+    label: 'X',
+    path: 'M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z',
+  },
+  linkedin: {
+    label: 'LinkedIn',
+    path: 'M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 0 1-2.063-2.065 2.063 2.063 0 1 1 2.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z',
+  },
+  mastodon: {
+    label: 'Mastodon',
+    path: 'M23.268 5.313c-.35-2.578-2.617-4.61-5.304-5.004C17.51.242 15.792 0 11.813 0h-.03c-3.98 0-4.835.242-5.288.309C3.882.692 1.496 2.518.917 5.127.64 6.412.61 7.837.661 9.143c.074 1.874.088 3.745.26 5.611.118 1.24.325 2.47.62 3.68.55 2.237 2.777 4.098 4.96 4.857 2.336.792 4.849.923 7.256.38.265-.061.527-.132.786-.213.585-.184 1.27-.39 1.774-.753a.057.057 0 0 0 .023-.043v-1.809a.052.052 0 0 0-.02-.041.053.053 0 0 0-.046-.01 20.282 20.282 0 0 1-4.709.545c-2.73 0-3.463-1.284-3.674-1.818a5.593 5.593 0 0 1-.319-1.433.053.053 0 0 1 .066-.054c1.517.363 3.072.546 4.632.546.376 0 .75 0 1.125-.01 1.57-.044 3.224-.124 4.768-.422.038-.008.077-.015.11-.024 2.435-.464 4.753-1.92 4.989-5.604.008-.145.03-1.52.03-1.67.002-.512.167-3.63-.024-5.545zm-3.748 9.195h-2.561V8.29c0-1.309-.55-1.976-1.67-1.976-1.23 0-1.846.79-1.846 2.35v3.403h-2.546V8.663c0-1.56-.617-2.35-1.848-2.35-1.112 0-1.668.668-1.67 1.977v6.218H4.822V8.102c0-1.31.337-2.35 1.011-3.12.696-.77 1.608-1.164 2.74-1.164 1.311 0 2.302.5 2.962 1.498l.638 1.06.638-1.06c.66-.999 1.65-1.498 2.96-1.498 1.13 0 2.043.395 2.74 1.164.675.77 1.012 1.81 1.012 3.12z',
+  },
+  bluesky: {
+    label: 'Bluesky',
+    path: 'M5.769 2.678c2.284 1.71 4.742 5.176 5.646 7.036.904-1.86 3.362-5.326 5.646-7.036 1.648-1.234 4.317-2.189 4.317.856 0 .607-.348 5.104-.552 5.834-.71 2.538-3.299 3.185-5.6 2.793 4.024.685 5.05 2.955 2.837 5.225-4.203 4.31-6.04-1.083-6.512-2.464-.087-.253-.127-.372-.128-.271-.001-.1-.041.018-.128.271-.472 1.38-2.309 6.774-6.512 2.464-2.213-2.27-1.187-4.54 2.836-5.225-2.3.392-4.889-.255-5.599-2.793C.348 8.638 0 4.141 0 3.534c0-3.045 2.67-2.09 4.317-.856z',
+  },
+  website: {
+    label: 'Website',
+    // Material "language" (globe)
+    path: 'M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zm6.93 6h-2.95a15.65 15.65 0 0 0-1.38-3.56A8.03 8.03 0 0 1 18.92 8zM12 4.04c.83 1.2 1.48 2.53 1.91 3.96h-3.82c.43-1.43 1.08-2.76 1.91-3.96zM4.26 14C4.1 13.36 4 12.69 4 12s.1-1.36.26-2h3.38c-.08.66-.14 1.32-.14 2 0 .68.06 1.34.14 2H4.26zm.82 2h2.95c.32 1.25.78 2.45 1.38 3.56A7.987 7.987 0 0 1 5.08 16zm2.95-8H5.08a7.987 7.987 0 0 1 4.33-3.56A15.65 15.65 0 0 0 8.03 8zM12 19.96c-.83-1.2-1.48-2.53-1.91-3.96h3.82c-.43 1.43-1.08 2.76-1.91 3.96zM14.34 14H9.66c-.09-.66-.16-1.32-.16-2 0-.68.07-1.35.16-2h4.68c.09.65.16 1.32.16 2 0 .68-.07 1.34-.16 2zm.25 5.56c.6-1.11 1.06-2.31 1.38-3.56h2.95a8.03 8.03 0 0 1-4.33 3.56zM16.36 14c.08-.66.14-1.32.14-2 0-.68-.06-1.34-.14-2h3.38c.16.64.26 1.31.26 2s-.1 1.36-.26 2h-3.38z',
+  },
+  email: {
+    label: 'Email',
+    // Material "mail" (envelope)
+    path: 'M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z',
+  },
+};
diff --git a/src/pages/authors/[handle]/articles.astro b/src/pages/authors/[handle]/articles.astro
new file mode 100644
index 0000000..d48288c
--- /dev/null
+++ b/src/pages/authors/[handle]/articles.astro
@@ -0,0 +1,116 @@
+---
+import { getCollection, getEntries } from 'astro:content';
+import type { CollectionEntry } from 'astro:content';
+import BaseLayout from '@/layouts/BaseLayout.astro';
+import { formatDate, sortPostsByDate, topicName } from '@/lib/data';
+import { SITE } from '@/lib/site';
+
+export async function getStaticPaths() {
+  const authors = await getCollection('authors');
+  return authors.map((author) => ({
+    params: { handle: author.id },
+    props: { author },
+  }));
+}
+
+interface Props {
+  author: CollectionEntry<'authors'>;
+}
+const { author } = Astro.props;
+
+const allRaw = await getCollection('posts', ({ data }) => !data.draft);
+const matching = allRaw.filter((p) => p.data.authors.some((ref) => ref.id === author.id));
+const posts = (
+  await Promise.all(
+    matching.map(async (p) => ({ ...p, authors: await getEntries(p.data.authors) })),
+  )
+).sort(sortPostsByDate);
+
+const canonical = `${SITE.url}/authors/${author.id}/articles`;
+const description = `Every article by ${author.data.name} on mlsystems.dev — machine learning systems, newest first.`;
+
+const breadcrumbJsonLd = {
+  '@context': 'https://schema.org',
+  '@type': 'BreadcrumbList',
+  itemListElement: [
+    { '@type': 'ListItem', position: 1, name: 'Home', item: SITE.url },
+    { '@type': 'ListItem', position: 2, name: 'Contributors', item: `${SITE.url}/authors` },
+    {
+      '@type': 'ListItem',
+      position: 3,
+      name: author.data.name,
+      item: `${SITE.url}/authors/${author.id}`,
+    },
+    { '@type': 'ListItem', position: 4, name: 'Articles', item: canonical },
+  ],
+};
+---
+
+<BaseLayout
+  title={`All articles by ${author.data.name}`}
+  description={description}
+  canonical={canonical}
+  image={`/og/author/${author.id}.png`}
+  jsonLd={[breadcrumbJsonLd]}
+>
+  <div class="container author-archive" data-pagefind-body>
+    <a href={`/authors/${author.id}`} class="article-back">← {author.data.name}</a>
+
+    <header class="page-head">
+      <div class="eyebrow">{author.data.name}</div>
+      <h1 class="page-h1">All articles.</h1>
+      <p class="page-lede">
+        {posts.length}
+        {posts.length === 1 ? 'article' : 'articles'}, newest first.
+      </p>
+    </header>
+
+    {
+      posts.length === 0 ? (
+        <p style="color: var(--ink-3); padding: 40px 0;">No published articles yet.</p>
+      ) : (
+        <div class="blog-list">
+          {posts.map((p) => (
+            <a href={`/blog/${p.id}`} class="blog-row" data-topic={p.data.topicId}>
+              <div class="blog-row-body">
+                <div class="blog-row-title-line">
+                  <h2 class="blog-row-title">{p.data.title}</h2>
+                  <span class="chip chip--sm">{topicName(p.data.topicId)}</span>
+                </div>
+                <p class="blog-row-summary">{p.data.summary}</p>
+              </div>
+              <div class="blog-row-meta">
+                <strong>{formatDate(p.data.date.toISOString())}</strong>
+                <span>{p.data.readMin} min</span>
+              </div>
+            </a>
+          ))}
+        </div>
+      )
+    }
+  </div>
+</BaseLayout>
+
+<style>
+  .author-archive {
+    padding-top: 24px;
+    padding-bottom: 80px;
+  }
+  .page-head {
+    padding: 20px 0 32px;
+  }
+  .page-h1 {
+    font-family: var(--font-display);
+    font-size: clamp(40px, 7vw, 72px);
+    font-weight: 400;
+    letter-spacing: -0.015em;
+    line-height: 1.02;
+    margin: 6px 0 0;
+  }
+  .page-lede {
+    font-family: var(--font-mono);
+    font-size: 12px;
+    color: var(--ink-3);
+    margin-top: 14px;
+  }
+</style>
diff --git a/src/pages/authors/[handle].astro b/src/pages/authors/[handle]/index.astro
similarity index 77%
rename from src/pages/authors/[handle].astro
rename to src/pages/authors/[handle]/index.astro
index af1cf01..1fe60a1 100644
--- a/src/pages/authors/[handle].astro
+++ b/src/pages/authors/[handle]/index.astro
@@ -4,6 +4,7 @@ import type { CollectionEntry } from 'astro:content';
 import BaseLayout from '@/layouts/BaseLayout.astro';
 import { formatDate, sortPostsByDate, topicName } from '@/lib/data';
 import { SITE } from '@/lib/site';
+import { SOCIAL_ICONS } from '@/lib/socialIcons';
 
 export async function getStaticPaths() {
   const authors = await getCollection('authors');
@@ -18,6 +19,8 @@ interface Props {
 }
 const { author } = Astro.props;
 
+const RECENT_LIMIT = 5;
+
 const allRaw = await getCollection('posts', ({ data }) => !data.draft);
 const matching = allRaw.filter((p) => p.data.authors.some((ref) => ref.id === author.id));
 const posts = (
@@ -25,6 +28,7 @@ const posts = (
     matching.map(async (p) => ({ ...p, authors: await getEntries(p.data.authors) })),
   )
 ).sort(sortPostsByDate);
+const recent = posts.slice(0, RECENT_LIMIT);
 
 const topicCounts = posts.reduce<Record<string, number>>((acc, p) => {
   const name = topicName(p.data.topicId);
@@ -42,19 +46,26 @@ const initials = author.data.name
   .join('');
 const canonical = `${SITE.url}/authors/${author.id}`;
 
-const SOCIAL_FIELDS: { key: keyof typeof author.data; label: string; prefix?: string }[] = [
-  { key: 'github', label: 'GitHub' },
-  { key: 'twitter', label: 'Twitter' },
-  { key: 'linkedin', label: 'LinkedIn' },
-  { key: 'mastodon', label: 'Mastodon' },
-  { key: 'bluesky', label: 'Bluesky' },
-  { key: 'website', label: 'Website' },
-  { key: 'email', label: 'Email', prefix: 'mailto:' },
+const SOCIAL_FIELDS: { key: keyof typeof author.data; prefix?: string }[] = [
+  { key: 'github' },
+  { key: 'twitter' },
+  { key: 'linkedin' },
+  { key: 'mastodon' },
+  { key: 'bluesky' },
+  { key: 'website' },
+  { key: 'email', prefix: 'mailto:' },
 ];
 const socials = SOCIAL_FIELDS.flatMap((f) => {
   const value = author.data[f.key];
   if (!value || typeof value !== 'string') return [];
-  return [{ label: f.label, href: f.prefix ? `${f.prefix}${value}` : value }];
+  const icon = SOCIAL_ICONS[f.key as string];
+  return [
+    {
+      label: icon?.label ?? (f.key as string),
+      path: icon?.path ?? '',
+      href: f.prefix ? `${f.prefix}${value}` : value,
+    },
+  ];
 });
 const sameAs = socials.map((s) => s.href).filter((h) => h.startsWith('http'));
 
@@ -142,10 +153,14 @@ const breadcrumbJsonLd = {
               {socials.map((s) => (
                 <a
                   href={s.href}
+                  aria-label={s.label}
+                  title={s.label}
                   target={s.href.startsWith('mailto:') ? undefined : '_blank'}
                   rel={s.href.startsWith('mailto:') ? undefined : 'noreferrer'}
                 >
-                  {s.label} →
+                  <svg viewBox="0 0 24 24" aria-hidden="true">
+                    <path d={s.path} />
+                  </svg>
                 </a>
               ))}
             </div>
@@ -156,7 +171,7 @@ const breadcrumbJsonLd = {
 
     <section class="author-articles">
       <div class="eyebrow">
-        {posts.length === 1 ? '1 article' : `${posts.length} articles`}
+        {posts.length > RECENT_LIMIT ? `Recent articles` : `${posts.length} articles`}
       </div>
 
       {
@@ -164,26 +179,32 @@ const breadcrumbJsonLd = {
           <p style="color: var(--ink-3); padding: 40px 0;">No published articles yet.</p>
         ) : (
           <div class="blog-list">
-            {posts.map((p) => (
+            {recent.map((p) => (
               <a href={`/blog/${p.id}`} class="blog-row" data-topic={p.data.topicId}>
-                <div>
-                  <h3 class="blog-row-title">{p.data.title}</h3>
+                <div class="blog-row-body">
+                  <div class="blog-row-title-line">
+                    <h3 class="blog-row-title">{p.data.title}</h3>
+                    <span class="chip chip--sm">{topicName(p.data.topicId)}</span>
+                  </div>
                   <p class="blog-row-summary">{p.data.summary}</p>
                 </div>
-                <div class="blog-row-author">
-                  <strong>{p.authors.map((au) => au.data.name).join(' · ')}</strong>
-                  {topicName(p.data.topicId)}
-                </div>
-                <div class="blog-row-time">
-                  {formatDate(p.data.date.toISOString())}
-                  <br />
-                  {p.data.readMin} min
+                <div class="blog-row-meta">
+                  <strong>{formatDate(p.data.date.toISOString())}</strong>
+                  <span>{p.data.readMin} min</span>
                 </div>
               </a>
             ))}
           </div>
         )
       }
+
+      {
+        posts.length > RECENT_LIMIT && (
+          <a href={`/authors/${author.id}/articles`} class="btn author-see-all">
+            See all {posts.length} articles →
+          </a>
+        )
+      }
     </section>
   </div>
 </BaseLayout>
@@ -269,14 +290,31 @@ const breadcrumbJsonLd = {
   }
   .author-links {
     display: flex;
-    gap: 18px;
+    gap: 10px;
     flex-wrap: wrap;
-    margin-top: 18px;
-    font-family: var(--font-mono);
-    font-size: 13px;
+    margin-top: 20px;
   }
   .author-links a {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 36px;
+    height: 36px;
+    border: 1px solid var(--line-2);
+    border-radius: var(--radius-circle);
+    color: var(--ink-2);
+    transition:
+      color 0.15s ease,
+      border-color 0.15s ease;
+  }
+  .author-links a:hover {
     color: var(--accent);
+    border-color: var(--accent);
+  }
+  .author-links svg {
+    width: 17px;
+    height: 17px;
+    fill: currentColor;
   }
   .author-articles {
     margin-top: 8px;
@@ -284,6 +322,9 @@ const breadcrumbJsonLd = {
   .author-articles .eyebrow {
     margin-bottom: 16px;
   }
+  .author-see-all {
+    margin-top: 28px;
+  }
 
   @media (max-width: 720px) {
     .author-head {
diff --git a/src/pages/contribute/index.astro b/src/pages/contribute/index.astro
index cbbaa7f..53f88e0 100644
--- a/src/pages/contribute/index.astro
+++ b/src/pages/contribute/index.astro
@@ -58,7 +58,7 @@ const STEPS = [
         <div class="process-cta">
           <div></div>
           <div class="process-cta-actions">
-            <a href="/write" class="btn btn-primary">
+            <a href="/write" class="btn btn-accent">
               Draft in your browser <span class="btn-arrow">→</span>
             </a>
             <a
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 435eb50..a41c889 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -286,9 +286,13 @@ const featuredTools = allTools
           </p>
         </div>
         <div class="cta-actions">
-          <a href="/contribute" class="btn btn-primary">Pitch an article →</a>
-          <a href="/write" class="btn">Write an article</a>
-          <a href={SITE.github} target="_blank" rel="noreferrer" class="btn">Browse on GitHub</a>
+          <a href="/write" class="btn btn-accent"
+            >Write an article <span class="btn-arrow">→</span></a
+          >
+          <a href="/contribute" class="btn">Pitch an article</a>
+          <a href={SITE.github} target="_blank" rel="noreferrer" class="cta-github-link">
+            Browse the repo on GitHub →
+          </a>
         </div>
       </div>
     </div>
diff --git a/src/pages/privacy.astro b/src/pages/privacy.astro
new file mode 100644
index 0000000..5456431
--- /dev/null
+++ b/src/pages/privacy.astro
@@ -0,0 +1,108 @@
+---
+import BaseLayout from '@/layouts/BaseLayout.astro';
+import { SITE } from '@/lib/site';
+
+const canonical = `${SITE.url}/privacy`;
+---
+
+<BaseLayout
+  title="Privacy"
+  description="How mlsystems.dev handles data — analytics, cookies, and the in-browser writing tool. Plain language."
+  canonical={canonical}
+>
+  <div class="container privacy-page">
+    <header class="page-head">
+      <div class="eyebrow">Policy</div>
+      <h1 class="page-h1">Privacy.</h1>
+      <p class="page-lede">Last updated July 2026</p>
+    </header>
+
+    <div class="article-body">
+      <p>
+        This is a plain-language summary of how {SITE.name} handles your data. The short version: we collect
+        as little as possible, we don't sell anything, and there are no user accounts.
+      </p>
+
+      <h2>No accounts, no logins</h2>
+      <p>
+        You can read everything without signing in. The in-browser writing tool at <code
+          >/write</code
+        > runs entirely in your browser — what you type stays on your device, and nothing is sent to us
+        until you choose to download it and submit it by pull request, issue, or email.
+      </p>
+
+      <h2>Analytics</h2>
+      <p>
+        We use Google Analytics to understand aggregate traffic — which pages are read, roughly
+        where visitors come from, and what devices they use. It's loaded through Google's Consent
+        Mode, so analytics cookies are only set after you accept them. We use this to improve the
+        site, not to identify you personally, and we never sell or share this data.
+      </p>
+
+      <h2>Cookies</h2>
+      <p>
+        We store your consent choice so we don't ask on every visit. Analytics cookies are only set
+        if you accept. You can clear these at any time through your browser settings.
+      </p>
+
+      <h2>Third parties</h2>
+      <p>
+        The site is served as static files by our host, and fonts are self-hosted (no third-party
+        font requests). If comments or discussions are enabled, they are powered by GitHub and
+        subject to <a href="https://github.com/site/privacy" target="_blank" rel="noreferrer"
+          >GitHub's privacy policy</a
+        >. Google Analytics is subject to <a
+          href="https://policies.google.com/privacy"
+          target="_blank"
+          rel="noreferrer">Google's privacy policy</a
+        >.
+      </p>
+
+      <h2>Your author profile</h2>
+      <p>
+        If you contribute an article, the author details you choose to share — name, bio, and any
+        links — are published on your profile page. Share only what you want public; anything you
+        leave out simply won't appear.
+      </p>
+
+      <h2>Contact</h2>
+      <p>
+        Questions, or want your data or a contribution removed? Email <a
+          href={`mailto:${SITE.pitchEmail}`}>{SITE.pitchEmail}</a
+        >.
+      </p>
+
+      <p>
+        We may update this page as the site changes. Material changes will be reflected in the date
+        above.
+      </p>
+    </div>
+  </div>
+</BaseLayout>
+
+<style>
+  .privacy-page {
+    padding-top: 24px;
+    padding-bottom: 80px;
+  }
+  .page-head {
+    padding: 20px 0 12px;
+  }
+  .page-h1 {
+    font-family: var(--font-display);
+    font-size: clamp(40px, 7vw, 72px);
+    font-weight: 400;
+    letter-spacing: -0.015em;
+    line-height: 1.02;
+    margin: 6px 0 0;
+  }
+  .page-lede {
+    font-family: var(--font-mono);
+    font-size: 12px;
+    color: var(--ink-3);
+    margin-top: 14px;
+  }
+  .privacy-page .article-body {
+    max-width: 680px;
+  }
+</style>
diff --git a/src/styles/global.css b/src/styles/global.css
index 273c68c..610f920 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -27,7 +27,7 @@ html {
 
 :root {
   /* Type */
-  --font-display: 'Newsreader', 'Iowan Old Style', Georgia, serif;
+  --font-display: 'Playfair Display', 'Iowan Old Style', Georgia, serif;
   --font-sans: 'Hanken Grotesk', 'Inter', system-ui, -apple-system, sans-serif;
   --font-mono: 'JetBrains Mono', ui-monospace, Menlo, monospace;
   --font-read: 'Source Serif 4', 'Source Serif Pro', Georgia, Cambria, 'Times New Roman', serif;
@@ -277,7 +277,7 @@ body {
 
 /* Type pairing modes */
 [data-typeset='editorial'] {
-  --font-display: 'Newsreader', Georgia, serif;
+  --font-display: 'Playfair Display', Georgia, serif;
   --font-sans: 'Hanken Grotesk', system-ui, sans-serif;
 }
 [data-typeset='modern'] {
@@ -579,6 +579,16 @@ main {
   border-color: var(--accent);
   color: var(--paper);
 }
+.btn-accent {
+  background: var(--accent);
+  border-color: var(--accent);
+  color: var(--paper);
+}
+.btn-accent:hover {
+  background: var(--accent-2);
+  border-color: var(--accent-2);
+  color: var(--paper);
+}
 .btn-arrow {
   transition: transform 0.15s ease;
 }
@@ -1149,6 +1159,18 @@ a.hashtag:hover {
   gap: 12px;
   align-items: stretch;
 }
+.cta-github-link {
+  margin-top: 2px;
+  text-align: center;
+  font-family: var(--font-mono);
+  font-size: 12px;
+  color: var(--ink-3);
+  text-decoration: none;
+  transition: color 0.15s ease;
+}
+.cta-github-link:hover {
+  color: var(--accent);
+}
 
 /* Footer */
 .footer {
diff --git a/src/write/WritePortal.tsx b/src/write/WritePortal.tsx
index 0f2fd75..6f8add7 100644
--- a/src/write/WritePortal.tsx
+++ b/src/write/WritePortal.tsx
@@ -203,6 +203,7 @@ export default function WritePortal({ authors, topics, repoUrl, contactEmail }:
         slug: meta.slug,
         writerName: meta.writerName,
         repoUrl,
+        contactEmail,
         assets: allAssets(),
       });
       const url = URL.createObjectURL(blob);
@@ -391,7 +392,7 @@ export default function WritePortal({ authors, topics, repoUrl, contactEmail }:
           <span className="write-note-inline">Autosave is off — your browser blocked storage.</span>
         )}
         <button type="button" className="write-download" disabled={busy} onClick={download}>
-          {busy ? 'Packaging…' : 'Download post folder'}
+          {busy ? 'Packaging…' : 'Download post'}
         </button>
       </div>
     </div>
diff --git a/src/write/editor/editor-theme.css b/src/write/editor/editor-theme.css
index 72b1428..35af762 100644
--- a/src/write/editor/editor-theme.css
+++ b/src/write/editor/editor-theme.css
@@ -503,6 +503,7 @@
 }
 
 .write-separator {
+  width: 100%;
   text-align: center;
   letter-spacing: 0.5em;
   color: var(--ink-3);
diff --git a/src/write/serialize/toZip.ts b/src/write/serialize/toZip.ts
index 71db643..784dfd9 100644
--- a/src/write/serialize/toZip.ts
+++ b/src/write/serialize/toZip.ts
@@ -6,15 +6,22 @@ export type ZipInput = {
   slug: string;
   writerName: string;
   repoUrl: string;
+  contactEmail: string;
   assets: { name: string; file: File }[];
 };
 
-function submitNote(slug: string, writerName: string, repoUrl: string): string {
+function submitNote(
+  slug: string,
+  writerName: string,
+  repoUrl: string,
+  contactEmail: string,
+): string {
   return `# How to submit your article
 
 Written by: ${writerName || '(name not given)'}
 
 This ZIP contains a ready-to-publish post folder for mlsystems.dev.
+Pick whichever option is easiest for you.
 
 ## Option 1 — open a pull request
 
@@ -22,11 +29,24 @@ This ZIP contains a ready-to-publish post folder for mlsystems.dev.
 2. Copy the \`${slug}/\` folder into \`src/content/posts/\`
 3. Open a pull request — see CONTRIBUTING.md in the repo
 
-## Option 2 — let us do it
+## Option 2 — open an issue
 
 Open an issue at ${repoUrl}/issues, mention you have an article ready,
 and attach this ZIP. A maintainer will take it from there.
 
+## Option 3 — email it to us
+
+Email this ZIP to ${contactEmail} and we'll publish it for you.
+
+If this is your first article, include your author details so we can set up
+your profile page:
+
+- Display name
+- Short bio (1–2 sentences)
+- Any links you'd like shown: website, GitHub, X/Twitter, LinkedIn, Mastodon, Bluesky, email
+
+Share only what you want public — anything you leave out simply won't appear.
+
 Thanks for writing!
 `;
 }
@@ -43,6 +63,9 @@ export async function buildZip(input: ZipInput): Promise<Blob> {
   for (const { fileName, source } of input.serialized.componentFiles) {
     folder.file(fileName, `${source.trimEnd()}\n`);
   }
-  zip.file('HOW-TO-SUBMIT.md', submitNote(input.slug, input.writerName, input.repoUrl));
+  zip.file(
+    'HOW-TO-SUBMIT.md',
+    submitNote(input.slug, input.writerName, input.repoUrl, input.contactEmail),
+  );
   return zip.generateAsync({ type: 'blob' });
 }

From adda257619b30219be036029091fda129927f6f5 Mon Sep 17 00:00:00 2001
From: Dinesh <13635627+HumbleBee14@users.noreply.github.com>
Date: Sun, 12 Jul 2026 23:08:37 -0700
Subject: [PATCH 3/4] Author archive header: single line 'Articles by <name>',
 smaller size

---
 src/components/Footer.astro               |  2 +-
 src/pages/authors/[handle]/articles.astro | 15 +++++++--------
 2 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index 4d5f740..fc832c9 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -92,7 +92,7 @@ const socialIcons = (['discord', 'github', 'twitter', 'linkedin'] as const).map(
                 Code of conduct
               </a>
             </li>
-            <li><a href="/contact">Contact</a></li>
+            <li><a href="/contact">Contact Us</a></li>
           </ul>
         </div>
       </div>
diff --git a/src/pages/authors/[handle]/articles.astro b/src/pages/authors/[handle]/articles.astro
index d48288c..4165327 100644
--- a/src/pages/authors/[handle]/articles.astro
+++ b/src/pages/authors/[handle]/articles.astro
@@ -27,7 +27,7 @@ const posts = (
 ).sort(sortPostsByDate);
 
 const canonical = `${SITE.url}/authors/${author.id}/articles`;
-const description = `Every article by ${author.data.name} on mlsystems.dev — machine learning systems, newest first.`;
+const description = `Every article by ${author.data.name} on mlsystems.dev — machine learning systems.`;
 
 const breadcrumbJsonLd = {
   '@context': 'https://schema.org',
@@ -57,11 +57,10 @@ const breadcrumbJsonLd = {
     <a href={`/authors/${author.id}`} class="article-back">← {author.data.name}</a>
 
     <header class="page-head">
-      <div class="eyebrow">{author.data.name}</div>
-      <h1 class="page-h1">All articles.</h1>
+      <h1 class="page-h1">Articles by {author.data.name}</h1>
       <p class="page-lede">
         {posts.length}
-        {posts.length === 1 ? 'article' : 'articles'}, newest first.
+        {posts.length === 1 ? 'article' : 'articles'}.
       </p>
     </header>
 
@@ -101,11 +100,11 @@ const breadcrumbJsonLd = {
   }
   .page-h1 {
     font-family: var(--font-display);
-    font-size: clamp(40px, 7vw, 72px);
+    font-size: clamp(26px, 4vw, 38px);
     font-weight: 400;
-    letter-spacing: -0.015em;
-    line-height: 1.02;
-    margin: 6px 0 0;
+    letter-spacing: -0.01em;
+    line-height: 1.1;
+    margin: 0;
   }
   .page-lede {
     font-family: var(--font-mono);

From 38f05cc79cf1f941ea2263a2960b0226c2edc2c3 Mon Sep 17 00:00:00 2001
From: Dinesh <13635627+HumbleBee14@users.noreply.github.com>
Date: Sun, 12 Jul 2026 23:28:52 -0700
Subject: [PATCH 4/4] Author archive header + See-all button; contributors copy
 + name filter
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Archive header: 'Articles by <name>' — muted italic 'Articles by', author
  name in ink and linked to their profile (accent on hover), smaller size.
- Author profile: cap at 5 recent, always show a centered 'See all
  articles' button below.
- Contributors page: inclusive lede (engineers, researchers, students),
  dropped the count and attribution line; add a name-filter that appears
  only when the list exceeds 12 (scales without a long scroll).
- Sort already by article count desc, name tiebreak (unchanged).
---
 src/pages/authors/[handle]/articles.astro | 17 ++++++-
 src/pages/authors/[handle]/index.astro    | 17 ++++---
 src/pages/authors/index.astro             | 59 +++++++++++++++++++++--
 3 files changed, 81 insertions(+), 12 deletions(-)

diff --git a/src/pages/authors/[handle]/articles.astro b/src/pages/authors/[handle]/articles.astro
index 4165327..117270c 100644
--- a/src/pages/authors/[handle]/articles.astro
+++ b/src/pages/authors/[handle]/articles.astro
@@ -57,7 +57,10 @@ const breadcrumbJsonLd = {
     <a href={`/authors/${author.id}`} class="article-back">← {author.data.name}</a>
 
     <header class="page-head">
-      <h1 class="page-h1">Articles by {author.data.name}</h1>
+      <h1 class="page-h1">
+        <span class="page-h1-by">Articles by</span>
+        <a href={`/authors/${author.id}`} class="page-h1-name">{author.data.name}</a>
+      </h1>
       <p class="page-lede">
         {posts.length}
         {posts.length === 1 ? 'article' : 'articles'}.
@@ -106,6 +109,18 @@ const breadcrumbJsonLd = {
     line-height: 1.1;
     margin: 0;
   }
+  .page-h1-by {
+    font-style: italic;
+    color: var(--ink-3);
+  }
+  .page-h1-name {
+    color: var(--ink);
+    text-decoration: none;
+    transition: color 0.15s ease;
+  }
+  .page-h1-name:hover {
+    color: var(--accent);
+  }
   .page-lede {
     font-family: var(--font-mono);
     font-size: 12px;
diff --git a/src/pages/authors/[handle]/index.astro b/src/pages/authors/[handle]/index.astro
index 1fe60a1..135a564 100644
--- a/src/pages/authors/[handle]/index.astro
+++ b/src/pages/authors/[handle]/index.astro
@@ -199,10 +199,13 @@ const breadcrumbJsonLd = {
       }
 
       {
-        posts.length > RECENT_LIMIT && (
-          <a href={`/authors/${author.id}/articles`} class="btn author-see-all">
-            See all {posts.length} articles →
-          </a>
+        posts.length > 0 && (
+          <div class="author-see-all-wrap">
+            <a href={`/authors/${author.id}/articles`} class="btn">
+              {' '}
+              See all articles →{' '}
+            </a>
+          </div>
         )
       }
     </section>
@@ -322,8 +325,10 @@ const breadcrumbJsonLd = {
   .author-articles .eyebrow {
     margin-bottom: 16px;
   }
-  .author-see-all {
-    margin-top: 28px;
+  .author-see-all-wrap {
+    display: flex;
+    justify-content: center;
+    margin-top: 32px;
   }
 
   @media (max-width: 720px) {
diff --git a/src/pages/authors/index.astro b/src/pages/authors/index.astro
index e4c5027..db8f9af 100644
--- a/src/pages/authors/index.astro
+++ b/src/pages/authors/index.astro
@@ -1,7 +1,8 @@
 ---
 import { getCollection } from 'astro:content';
 import BaseLayout from '@/layouts/BaseLayout.astro';
-import { SITE } from '@/lib/site';
+
+const FILTER_THRESHOLD = 12;
 
 const authors = await getCollection('authors');
 const posts = await getCollection('posts', ({ data }) => !data.draft);
@@ -41,16 +42,32 @@ const contributors = authors
       <div class="eyebrow page-eyebrow">The People</div>
       <h1 class="page-h1">Contributors.</h1>
       <p class="page-lede">
-        {contributors.length} writers from labs, startups, and research groups working on the hard parts
-        of ML systems. Every article is attributed — and most of them are open to questions on{' '}
-        <a href={SITE.orgDiscussionsUrl} target="_blank" rel="noreferrer">Discussions</a>.
+        Engineers, researchers, and students writing about ML systems in the open — anyone learning
+        is welcome to join them.
       </p>
     </div>
 
+    {
+      contributors.length > FILTER_THRESHOLD && (
+        <div class="contributor-filter" data-contributor-filter>
+          <input
+            type="search"
+            placeholder="Filter by name…"
+            aria-label="Filter contributors by name"
+            data-contributor-input
+          />
+        </div>
+      )
+    }
+
     <div class="contributors-grid">
       {
         contributors.map((c) => (
-          <a href={`/authors/${c.id}`} class="card card--interactive contributor-card">
+          <a
+            href={`/authors/${c.id}`}
+            class="card card--interactive contributor-card"
+            data-name={c.data.name.toLowerCase()}
+          >
             <div class="contributor-avatar" aria-hidden="true">
               {c.data.avatar ? (
                 <img src={c.data.avatar} alt="" loading="lazy" decoding="async" />
@@ -77,7 +94,39 @@ const contributors = authors
   </div>
 </BaseLayout>
 
+<script>
+  const root = document.querySelector('[data-contributor-filter]');
+  const input = root?.querySelector<HTMLInputElement>('[data-contributor-input]');
+  const cards = Array.from(document.querySelectorAll<HTMLElement>('.contributor-card'));
+  input?.addEventListener('input', () => {
+    const q = input.value.trim().toLowerCase();
+    cards.forEach((c) => {
+      c.style.display = !q || (c.dataset.name ?? '').includes(q) ? '' : 'none';
+    });
+  });
+</script>
+
 <style>
+  .contributor-filter {
+    margin-top: 24px;
+  }
+  .contributor-filter input {
+    width: 100%;
+    font-family: var(--font-mono);
+    font-size: 13px;
+    color: var(--ink);
+    background: var(--paper-2);
+    border: 1px solid var(--line);
+    border-radius: var(--radius-md);
+    padding: 12px 16px;
+  }
+  .contributor-filter input::placeholder {
+    color: var(--ink-3);
+  }
+  .contributor-filter input:focus-visible {
+    outline: none;
+    border-color: var(--accent);
+  }
   .contributors-grid {
     display: grid;
     grid-template-columns: repeat(2, 1fr);