diff --git a/www/src/pages/dnd/[slug].astro b/www/src/pages/dnd/[slug].astro
new file mode 100644
index 0000000..78b505f
--- /dev/null
+++ b/www/src/pages/dnd/[slug].astro
@@ -0,0 +1,38 @@
+---
+export const prerender = false;
+
+import { getCollection, render } from 'astro:content';
+import { requireAdminSession } from '../../lib/auth';
+import Layout from '../../layouts/Layout.astro';
+import { getSlug, resolveRelatedPosts } from '../../lib/dnd';
+
+const { session, error } = await requireAdminSession(Astro.request);
+if (error) return error;
+if (!session) return Astro.redirect('/api/auth/signin');
+
+const slug = Astro.params.slug;
+const allPosts = await getCollection('dnd');
+const post = allPosts.find(p => getSlug(p.id) === slug);
+
+if (!post) {
+  return new Response('Not found', { status: 404 });
+}
+
+const { Content } = await render(post);
+const related = post.data.related ? resolveRelatedPosts(post.data.related, allPosts) : [];
+---
+<Layout title={`${post.data.title} - lewis m.w.`}>
+
+<article>
+<h1>{post.data.title}</h1>
+<Content />
+</article>
+{related.length > 0 && (
+  <details open>
+    <summary>related</summary>
+    <pre set:html={related.map(p =>
+      `<a href="/dnd/${getSlug(p.id)}">${p.data.title}</a>`
+    ).join('\n')} />
+  </details>
+)}
+</Layout>
diff --git a/www/src/pages/dnd/index.astro b/www/src/pages/dnd/index.astro
new file mode 100644
index 0000000..2a14df3
--- /dev/null
+++ b/www/src/pages/dnd/index.astro
@@ -0,0 +1,35 @@
+---
+export const prerender = false;
+
+import { getCollection } from 'astro:content';
+import { requireAdminSession } from '../../lib/auth';
+import Layout from '../../layouts/Layout.astro';
+import { organizePostsByCategory, getSlug } from '../../lib/dnd';
+import map from '../../content/dnd/drakkenheim/map.jpg';
+
+const { session, error } = await requireAdminSession(Astro.request);
+if (error) return error;
+if (!session) return Astro.redirect('/api/auth/signin');
+
+const posts = await getCollection('dnd');
+const { grouped, categories: sortedCategories } = organizePostsByCategory(posts);
+---
+<Layout title="dnd - lewis m.w.">
+
+<p class="muted">logged in as {session.user?.name} <a href="/api/auth/signout">sign out</a></p>
+
+<img src={map.src} alt="Drakkenheim map" style="max-width: 100%; height: auto;" />
+
+{sortedCategories.length === 0 ? (
+  <p class="muted">nothing here</p>
+) : (
+  sortedCategories.map(category => (
+    <details open>
+      <summary>{category}</summary>
+      <pre set:html={grouped[category].map(post =>
+        `<a href="/dnd/${getSlug(post.id)}">${post.data.title}</a>${post.data.pinned ? ' [pinned]' : ''}`
+      ).join('\n')} />
+    </details>
+  ))
+)}
+</Layout>