Index: src/views/pages/archive.ejs
===================================================================
--- src/views/pages/archive.ejs	(revision 2165b6d3d57ceaa8b5d1f70491868482149470cf)
+++ src/views/pages/archive.ejs	(revision 7bc636b391c66ac399c33e54f7173a022c6a3cbd)
@@ -1,19 +1,32 @@
-<%# Archief — altijd de chronologische jaar/maand-lijst. Het archief negeert
-    bewust de timeline/grid-keuze (geen grid-weergave): de view-switcher is hier
-    grijs en springt bij klik terug naar de feed. Zie de CSS in style.css. %>
+<%
+// Archive — chronological feed of all posts.
+//
+// Renders both a timeline view (year/month grouped link list) AND a grid
+// view (flat tiles) — same toggle pattern as home.ejs. The view-switcher
+// at the top lets the user pick. Body class is `on-archive`; the inline
+// <style> below adds an `.on-archive` clause to the existing home-only
+// feed toggle in style.css (cleaner than editing the global CSS).
+//
+// Flatten posts for grid mode: skip the year/month grouping (it doesn't
+// translate well to a tile grid). Newest-first order is preserved by the
+// route's SQL ORDER BY.
+const _flatPosts = [];
+Object.keys(grouped).sort((a, b) => b - a).forEach(function(y) {
+  Object.keys(grouped[y]).forEach(function(m) {
+    grouped[y][m].forEach(function(p) { _flatPosts.push(p); });
+  });
+});
+%>
 
-<!-- ========== TIJDLIJN (jaar/maand gegroepeerd) ========== -->
+<%# View switcher used to be rendered here; now lives in shell.ejs above
+    #pcms-main, visible on every non-admin page. %>
+
+<!-- ========== TIMELINE (year/month grouped) ========== -->
 <div class="container archive-page feed-timeline">
-  <% var _archBase = (typeof siteUrlBase !== 'undefined' && siteUrlBase) ? siteUrlBase : ''; %>
-  <p class="archive-back-row">
-    <a href="<%= _archBase %>/" class="btn archive-back"
-       hx-get="<%= _archBase %>/?partial=1" hx-target="#pcms-main"
-       hx-push-url="<%= _archBase %>/" hx-indicator="#pcms-loading">&larr; <%= t('parch.back') %></a>
-  </p>
-  <h1><%= t('parch.title') %></h1>
-  <p class="archive-meta"><%= totalPosts === 1 ? t('parch.count_one', { n: totalPosts }) : t('parch.count_many', { n: totalPosts }) %></p>
+  <h1>Archive</h1>
+  <p class="archive-meta"><%= totalPosts %> post<%= totalPosts !== 1 ? 's' : '' %></p>
 
   <% if (totalPosts === 0) { %>
-    <p class="empty-state"><%= t('parch.empty') %></p>
+    <p class="empty-state">No posts yet.</p>
   <% } %>
 
@@ -42,7 +55,17 @@
 </div>
 
+<!-- ========== GRID (only visible when body[data-feed-view="grid"]) ========== -->
+<% if (_flatPosts.length > 0) { %>
+<section class="feed-grid container" aria-label="Grid-weergave">
+  <div class="grid-tiles">
+    <% _flatPosts.forEach(function(post) { %>
+      <%- include('../partials/post-tile', { post: post }) %>
+    <% }); %>
+  </div>
+</section>
+<% } %>
+
 <style>
 .archive-page { max-width: 700px; margin: 2rem auto; padding: 0 1rem; }
-.archive-back-row { margin: 0 0 1rem; }
 .archive-page h1 { font-family: var(--font-display, serif); margin: 0 0 0.25rem; }
 .archive-meta { color: var(--ink-muted); margin-bottom: 2rem; }
