diff --git a/bookmarks.njk b/bookmarks.njk
index 41cdae3..41c888e 100644
--- a/bookmarks.njk
+++ b/bookmarks.njk
@@ -1,34 +1,105 @@
 ---
 layout: layouts/base.njk
 title: Bookmarks
-permalink: /bookmarks/
+withSidebar: true
+pagination:
+  data: collections.bookmarks
+  size: 20
+  alias: paginatedBookmarks
+permalink: "bookmarks/{% if pagination.pageNumber > 0 %}page/{{ pagination.pageNumber + 1 }}/{% endif %}"
 ---
-<div class="page-header mb-6 sm:mb-8">
+<div class="h-feed">
   <h1 class="text-2xl sm:text-3xl font-bold text-surface-900 dark:text-surface-100 mb-2">Bookmarks</h1>
-  <p class="text-surface-600 dark:text-surface-400">Links I've saved for later.</p>
-</div>
+  <p class="text-surface-600 dark:text-surface-400 mb-6 sm:mb-8">
+    Links I've saved for later.
+    <span class="text-sm">({{ collections.bookmarks.length }} total)</span>
+  </p>
 
-{% if collections.bookmarks.length > 0 %}
-<ul class="post-list">
-  {% for post in collections.bookmarks %}
-  <li class="h-entry">
-    {% if post.data.title %}
-    <h2><a class="p-name u-url" href="{{ post.url }}">{{ post.data.title }}</a></h2>
-    {% endif %}
-    <div class="post-meta">
-      <time class="dt-published" datetime="{{ post.date.toISOString() }}">
-        {{ post.date | dateDisplay }}
-      </time>
+  {% if paginatedBookmarks.length > 0 %}
+  <ul class="post-list">
+    {% for post in paginatedBookmarks %}
+    <li class="h-entry post-card">
+      <div class="post-header">
+        {% if post.data.title %}
+        <h2 class="text-xl font-semibold mb-1 flex-1">
+          <a class="p-name u-url text-surface-900 dark:text-surface-100 hover:text-primary-600 dark:hover:text-primary-400" href="{{ post.url }}">
+            {{ post.data.title }}
+          </a>
+        </h2>
+        {% endif %}
+      </div>
+      <div class="post-meta mt-2">
+        <time class="dt-published" datetime="{{ post.date | isoDate }}">
+          {{ post.date | dateDisplay }}
+        </time>
+        {% if post.data.category %}
+        <span class="post-categories">
+          {% if post.data.category is string %}
+          <span class="p-category">{{ post.data.category }}</span>
+          {% else %}
+          {% for cat in post.data.category %}
+          <span class="p-category">{{ cat }}</span>
+          {% endfor %}
+          {% endif %}
+        </span>
+        {% endif %}
+      </div>
+      {# Support both camelCase (Indiekit Eleventy preset) and underscore (legacy) property names #}
+      {% set bookmarkedUrl = post.data.bookmarkOf or post.data.bookmark_of %}
+      {% if bookmarkedUrl %}
+      <p class="mt-3 flex items-center gap-2 text-sm">
+        <svg class="w-4 h-4 text-primary-500 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 5a2 2 0 012-2h10a2 2 0 012 2v16l-7-3.5L5 21V5z"/>
+        </svg>
+        <a class="u-bookmark-of text-primary-600 dark:text-primary-400 hover:underline break-all" href="{{ bookmarkedUrl }}">
+          {{ bookmarkedUrl }}
+        </a>
+      </p>
+      {% endif %}
+      {% if post.templateContent %}
+      <div class="e-content prose dark:prose-invert prose-sm mt-3 max-w-none">
+        {{ post.templateContent | safe }}
+      </div>
+      {% endif %}
+    </li>
+    {% endfor %}
+  </ul>
+
+  {# Pagination controls #}
+  {% if pagination.pages.length > 1 %}
+  <nav class="pagination" aria-label="Bookmarks pagination">
+    <div class="pagination-info">
+      Page {{ pagination.pageNumber + 1 }} of {{ pagination.pages.length }}
     </div>
-    {# Support both camelCase (Indiekit Eleventy preset) and underscore (legacy) property names #}
-    {% set bookmarkedUrl = post.data.bookmarkOf or post.data.bookmark_of %}
-    {% if bookmarkedUrl %}
-    <p><a class="u-bookmark-of" href="{{ bookmarkedUrl }}">{{ bookmarkedUrl }}</a></p>
-    {% endif %}
-    <div class="e-content">{{ post.templateContent | safe }}</div>
-  </li>
-  {% endfor %}
-</ul>
-{% else %}
-<p>No bookmarks yet.</p>
-{% endif %}
+    <div class="pagination-links">
+      {% if pagination.href.previous %}
+      <a href="{{ pagination.href.previous }}" class="pagination-link" aria-label="Previous page">
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path></svg>
+        Previous
+      </a>
+      {% else %}
+      <span class="pagination-link disabled">
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path></svg>
+        Previous
+      </span>
+      {% endif %}
+
+      {% if pagination.href.next %}
+      <a href="{{ pagination.href.next }}" class="pagination-link" aria-label="Next page">
+        Next
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg>
+      </a>
+      {% else %}
+      <span class="pagination-link disabled">
+        Next
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg>
+      </span>
+      {% endif %}
+    </div>
+  </nav>
+  {% endif %}
+
+  {% else %}
+  <p class="text-surface-600 dark:text-surface-400">No bookmarks yet.</p>
+  {% endif %}
+</div>
diff --git a/likes.njk b/likes.njk
index c13b2ac..1c7f299 100644
--- a/likes.njk
+++ b/likes.njk
@@ -1,49 +1,103 @@
 ---
 layout: layouts/base.njk
 title: Likes
-permalink: /likes/
+withSidebar: true
+pagination:
+  data: collections.likes
+  size: 20
+  alias: paginatedLikes
+permalink: "likes/{% if pagination.pageNumber > 0 %}page/{{ pagination.pageNumber + 1 }}/{% endif %}"
 ---
-<div class="page-header mb-6 sm:mb-8">
+<div class="h-feed">
   <h1 class="text-2xl sm:text-3xl font-bold text-surface-900 dark:text-surface-100 mb-2">Likes</h1>
-  <p class="text-surface-600 dark:text-surface-400">Content I've liked across the web.</p>
-</div>
+  <p class="text-surface-600 dark:text-surface-400 mb-6 sm:mb-8">
+    Content I've liked across the web.
+    <span class="text-sm">({{ collections.likes.length }} total)</span>
+  </p>
 
-{% if collections.likes.length > 0 %}
-<ul class="space-y-6">
-  {% for post in collections.likes %}
-  <li class="h-entry p-4 bg-surface-100 dark:bg-surface-800 rounded-lg">
-    <div class="flex items-start gap-4">
-      <div class="flex-shrink-0">
-        <svg class="w-8 h-8 text-red-500" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-          <path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"/>
-        </svg>
-      </div>
-      <div class="flex-1 min-w-0">
-        <div class="post-meta text-sm text-surface-500 dark:text-surface-400 mb-2">
-          <time class="dt-published" datetime="{{ post.date.toISOString() }}">
-            {{ post.date | dateDisplay }}
-          </time>
+  {% if paginatedLikes.length > 0 %}
+  <ul class="post-list">
+    {% for post in paginatedLikes %}
+    <li class="h-entry post-card">
+      <div class="post-header flex items-start gap-3">
+        <div class="flex-shrink-0 mt-1">
+          <svg class="w-5 h-5 text-red-500" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+            <path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"/>
+          </svg>
         </div>
-        {# Support both camelCase (Indiekit Eleventy preset) and underscore (legacy) property names #}
-        {% set likedUrl = post.data.likeOf or post.data.like_of %}
-        {% if likedUrl %}
-        <p class="mb-2">
-          <a class="u-like-of text-primary-600 dark:text-primary-400 hover:underline break-all" href="{{ likedUrl }}">
-            {{ likedUrl }}
-          </a>
-        </p>
-        {% endif %}
-        {% if post.templateContent %}
-        <div class="e-content prose dark:prose-invert prose-sm max-w-none">
-          {{ post.templateContent | safe }}
+        <div class="flex-1 min-w-0">
+          <div class="post-meta">
+            <time class="dt-published" datetime="{{ post.date | isoDate }}">
+              {{ post.date | dateDisplay }}
+            </time>
+            {% if post.data.category %}
+            <span class="post-categories">
+              {% if post.data.category is string %}
+              <span class="p-category">{{ post.data.category }}</span>
+              {% else %}
+              {% for cat in post.data.category %}
+              <span class="p-category">{{ cat }}</span>
+              {% endfor %}
+              {% endif %}
+            </span>
+            {% endif %}
+          </div>
+          {# Support both camelCase (Indiekit Eleventy preset) and underscore (legacy) property names #}
+          {% set likedUrl = post.data.likeOf or post.data.like_of %}
+          {% if likedUrl %}
+          <p class="mt-2">
+            <a class="u-like-of text-primary-600 dark:text-primary-400 hover:underline break-all" href="{{ likedUrl }}">
+              {{ likedUrl }}
+            </a>
+          </p>
+          {% endif %}
+          {% if post.templateContent %}
+          <div class="e-content prose dark:prose-invert prose-sm mt-3 max-w-none">
+            {{ post.templateContent | safe }}
+          </div>
+          {% endif %}
+          <a class="u-url text-sm text-primary-600 dark:text-primary-400 hover:underline mt-3 inline-block" href="{{ post.url }}">Permalink</a>
         </div>
-        {% endif %}
-        <a class="u-url text-xs text-surface-400 hover:underline mt-2 inline-block" href="{{ post.url }}">Permalink</a>
       </div>
+    </li>
+    {% endfor %}
+  </ul>
+
+  {# Pagination controls #}
+  {% if pagination.pages.length > 1 %}
+  <nav class="pagination" aria-label="Likes pagination">
+    <div class="pagination-info">
+      Page {{ pagination.pageNumber + 1 }} of {{ pagination.pages.length }}
     </div>
-  </li>
-  {% endfor %}
-</ul>
-{% else %}
-<p class="text-surface-600 dark:text-surface-400">No likes yet.</p>
-{% endif %}
+    <div class="pagination-links">
+      {% if pagination.href.previous %}
+      <a href="{{ pagination.href.previous }}" class="pagination-link" aria-label="Previous page">
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path></svg>
+        Previous
+      </a>
+      {% else %}
+      <span class="pagination-link disabled">
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path></svg>
+        Previous
+      </span>
+      {% endif %}
+
+      {% if pagination.href.next %}
+      <a href="{{ pagination.href.next }}" class="pagination-link" aria-label="Next page">
+        Next
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg>
+      </a>
+      {% else %}
+      <span class="pagination-link disabled">
+        Next
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg>
+      </span>
+      {% endif %}
+    </div>
+  </nav>
+  {% endif %}
+
+  {% else %}
+  <p class="text-surface-600 dark:text-surface-400">No likes yet.</p>
+  {% endif %}
+</div>
diff --git a/photos.njk b/photos.njk
index 7299d25..0f99923 100644
--- a/photos.njk
+++ b/photos.njk
@@ -1,42 +1,97 @@
 ---
 layout: layouts/base.njk
 title: Photos
-permalink: /photos/
+withSidebar: true
+pagination:
+  data: collections.photos
+  size: 20
+  alias: paginatedPhotos
+permalink: "photos/{% if pagination.pageNumber > 0 %}page/{{ pagination.pageNumber + 1 }}/{% endif %}"
 ---
-<div class="page-header mb-6 sm:mb-8">
+<div class="h-feed">
   <h1 class="text-2xl sm:text-3xl font-bold text-surface-900 dark:text-surface-100 mb-2">Photos</h1>
-  <p class="text-surface-600 dark:text-surface-400">Photo posts and images.</p>
-</div>
+  <p class="text-surface-600 dark:text-surface-400 mb-6 sm:mb-8">
+    Photo posts and images.
+    <span class="text-sm">({{ collections.photos.length }} total)</span>
+  </p>
 
-{% if collections.photos.length > 0 %}
-<ul class="post-list photo-list">
-  {% for post in collections.photos %}
-  <li class="h-entry">
-    <div class="post-meta">
-      <time class="dt-published" datetime="{{ post.date.toISOString() }}">
-        {{ post.date | dateDisplay }}
-      </time>
-    </div>
-    {# Render photo(s) from frontmatter - use eleventy:ignore to skip image transform #}
-    {% if post.data.photo %}
-      <div class="photo-gallery">
-        {% for img in post.data.photo %}
-          {% set photoUrl = img.url %}
-          {% if photoUrl and photoUrl[0] != '/' and 'http' not in photoUrl %}
-            {% set photoUrl = '/' + photoUrl %}
+  {% if paginatedPhotos.length > 0 %}
+  <ul class="post-list photo-list">
+    {% for post in paginatedPhotos %}
+    <li class="h-entry post-card">
+      <div class="post-meta">
+        <time class="dt-published" datetime="{{ post.date | isoDate }}">
+          {{ post.date | dateDisplay }}
+        </time>
+        {% if post.data.category %}
+        <span class="post-categories">
+          {% if post.data.category is string %}
+          <span class="p-category">{{ post.data.category }}</span>
+          {% else %}
+          {% for cat in post.data.category %}
+          <span class="p-category">{{ cat }}</span>
+          {% endfor %}
           {% endif %}
-          <a href="{{ post.url }}" class="photo-link">
-            <img src="{{ photoUrl }}" alt="{{ img.alt | default('Photo') }}" class="u-photo" loading="lazy" eleventy:ignore>
-          </a>
-        {% endfor %}
+        </span>
+        {% endif %}
       </div>
-    {% endif %}
-    {% if post.templateContent %}
-    <div class="e-content photo-caption">{{ post.templateContent | safe }}</div>
-    {% endif %}
-  </li>
-  {% endfor %}
-</ul>
-{% else %}
-<p>No photos yet.</p>
-{% endif %}
+      {# Render photo(s) from frontmatter - use eleventy:ignore to skip image transform #}
+      {% if post.data.photo %}
+        <div class="photo-gallery mt-3">
+          {% for img in post.data.photo %}
+            {% set photoUrl = img.url %}
+            {% if photoUrl and photoUrl[0] != '/' and 'http' not in photoUrl %}
+              {% set photoUrl = '/' + photoUrl %}
+            {% endif %}
+            <a href="{{ post.url }}" class="photo-link">
+              <img src="{{ photoUrl }}" alt="{{ img.alt | default('Photo') }}" class="u-photo" loading="lazy" eleventy:ignore>
+            </a>
+          {% endfor %}
+        </div>
+      {% endif %}
+      {% if post.templateContent %}
+      <div class="e-content photo-caption prose dark:prose-invert prose-sm mt-3 max-w-none">{{ post.templateContent | safe }}</div>
+      {% endif %}
+      <a class="u-url text-sm text-primary-600 dark:text-primary-400 hover:underline mt-3 inline-block" href="{{ post.url }}">Permalink</a>
+    </li>
+    {% endfor %}
+  </ul>
+
+  {# Pagination controls #}
+  {% if pagination.pages.length > 1 %}
+  <nav class="pagination" aria-label="Photos pagination">
+    <div class="pagination-info">
+      Page {{ pagination.pageNumber + 1 }} of {{ pagination.pages.length }}
+    </div>
+    <div class="pagination-links">
+      {% if pagination.href.previous %}
+      <a href="{{ pagination.href.previous }}" class="pagination-link" aria-label="Previous page">
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path></svg>
+        Previous
+      </a>
+      {% else %}
+      <span class="pagination-link disabled">
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path></svg>
+        Previous
+      </span>
+      {% endif %}
+
+      {% if pagination.href.next %}
+      <a href="{{ pagination.href.next }}" class="pagination-link" aria-label="Next page">
+        Next
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg>
+      </a>
+      {% else %}
+      <span class="pagination-link disabled">
+        Next
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg>
+      </span>
+      {% endif %}
+    </div>
+  </nav>
+  {% endif %}
+
+  {% else %}
+  <p class="text-surface-600 dark:text-surface-400">No photos yet.</p>
+  {% endif %}
+</div>
diff --git a/replies.njk b/replies.njk
index fdb1c44..e1950ea 100644
--- a/replies.njk
+++ b/replies.njk
@@ -1,53 +1,107 @@
 ---
 layout: layouts/base.njk
 title: Replies
-permalink: /replies/
+withSidebar: true
+pagination:
+  data: collections.replies
+  size: 20
+  alias: paginatedReplies
+permalink: "replies/{% if pagination.pageNumber > 0 %}page/{{ pagination.pageNumber + 1 }}/{% endif %}"
 ---
-<div class="page-header mb-6 sm:mb-8">
+<div class="h-feed">
   <h1 class="text-2xl sm:text-3xl font-bold text-surface-900 dark:text-surface-100 mb-2">Replies</h1>
-  <p class="text-surface-600 dark:text-surface-400">My responses to posts across the web.</p>
-</div>
+  <p class="text-surface-600 dark:text-surface-400 mb-6 sm:mb-8">
+    My responses to posts across the web.
+    <span class="text-sm">({{ collections.replies.length }} total)</span>
+  </p>
 
-{% if collections.replies.length > 0 %}
-<ul class="space-y-6">
-  {% for post in collections.replies %}
-  <li class="h-entry p-4 bg-surface-100 dark:bg-surface-800 rounded-lg border-l-4 border-primary-500">
-    <div class="flex items-start gap-4">
-      <div class="flex-shrink-0">
-        <svg class="w-8 h-8 text-primary-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 10h10a8 8 0 018 8v2M3 10l6 6m-6-6l6-6"/>
-        </svg>
-      </div>
-      <div class="flex-1 min-w-0">
-        {% if post.data.title %}
-        <h2 class="p-name text-lg font-semibold text-surface-900 dark:text-surface-100 mb-2">
-          <a class="hover:underline" href="{{ post.url }}">{{ post.data.title }}</a>
-        </h2>
-        {% endif %}
-        <div class="post-meta text-sm text-surface-500 dark:text-surface-400 mb-2">
-          <time class="dt-published" datetime="{{ post.date.toISOString() }}">
-            {{ post.date | dateDisplay }}
-          </time>
+  {% if paginatedReplies.length > 0 %}
+  <ul class="post-list">
+    {% for post in paginatedReplies %}
+    <li class="h-entry post-card">
+      <div class="post-header flex items-start gap-3">
+        <div class="flex-shrink-0 mt-1">
+          <svg class="w-5 h-5 text-primary-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 10h10a8 8 0 018 8v2M3 10l6 6m-6-6l6-6"/>
+          </svg>
         </div>
-        {# Support both camelCase (Indiekit Eleventy preset) and underscore (legacy) property names #}
-        {% set replyTo = post.data.inReplyTo or post.data.in_reply_to %}
-        {% if replyTo %}
-        <p class="mb-3 text-sm">
-          <span class="text-surface-500">In reply to:</span>
-          <a class="u-in-reply-to text-primary-600 dark:text-primary-400 hover:underline break-all" href="{{ replyTo }}">
-            {{ replyTo }}
-          </a>
-        </p>
-        {% endif %}
-        <div class="e-content prose dark:prose-invert prose-sm max-w-none">
-          {{ post.templateContent | safe }}
+        <div class="flex-1 min-w-0">
+          {% if post.data.title %}
+          <h2 class="p-name text-lg font-semibold text-surface-900 dark:text-surface-100 mb-2">
+            <a class="hover:text-primary-600 dark:hover:text-primary-400" href="{{ post.url }}">{{ post.data.title }}</a>
+          </h2>
+          {% endif %}
+          <div class="post-meta">
+            <time class="dt-published" datetime="{{ post.date | isoDate }}">
+              {{ post.date | dateDisplay }}
+            </time>
+            {% if post.data.category %}
+            <span class="post-categories">
+              {% if post.data.category is string %}
+              <span class="p-category">{{ post.data.category }}</span>
+              {% else %}
+              {% for cat in post.data.category %}
+              <span class="p-category">{{ cat }}</span>
+              {% endfor %}
+              {% endif %}
+            </span>
+            {% endif %}
+          </div>
+          {# Support both camelCase (Indiekit Eleventy preset) and underscore (legacy) property names #}
+          {% set replyTo = post.data.inReplyTo or post.data.in_reply_to %}
+          {% if replyTo %}
+          <p class="mt-2 text-sm">
+            <span class="text-surface-500">In reply to:</span>
+            <a class="u-in-reply-to text-primary-600 dark:text-primary-400 hover:underline break-all" href="{{ replyTo }}">
+              {{ replyTo }}
+            </a>
+          </p>
+          {% endif %}
+          <div class="e-content prose dark:prose-invert prose-sm mt-3 max-w-none">
+            {{ post.templateContent | safe }}
+          </div>
+          <a class="u-url text-sm text-primary-600 dark:text-primary-400 hover:underline mt-3 inline-block" href="{{ post.url }}">Permalink</a>
         </div>
-        <a class="u-url text-xs text-surface-400 hover:underline mt-2 inline-block" href="{{ post.url }}">Permalink</a>
       </div>
+    </li>
+    {% endfor %}
+  </ul>
+
+  {# Pagination controls #}
+  {% if pagination.pages.length > 1 %}
+  <nav class="pagination" aria-label="Replies pagination">
+    <div class="pagination-info">
+      Page {{ pagination.pageNumber + 1 }} of {{ pagination.pages.length }}
     </div>
-  </li>
-  {% endfor %}
-</ul>
-{% else %}
-<p class="text-surface-600 dark:text-surface-400">No replies yet.</p>
-{% endif %}
+    <div class="pagination-links">
+      {% if pagination.href.previous %}
+      <a href="{{ pagination.href.previous }}" class="pagination-link" aria-label="Previous page">
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path></svg>
+        Previous
+      </a>
+      {% else %}
+      <span class="pagination-link disabled">
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path></svg>
+        Previous
+      </span>
+      {% endif %}
+
+      {% if pagination.href.next %}
+      <a href="{{ pagination.href.next }}" class="pagination-link" aria-label="Next page">
+        Next
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg>
+      </a>
+      {% else %}
+      <span class="pagination-link disabled">
+        Next
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg>
+      </span>
+      {% endif %}
+    </div>
+  </nav>
+  {% endif %}
+
+  {% else %}
+  <p class="text-surface-600 dark:text-surface-400">No replies yet.</p>
+  {% endif %}
+</div>
diff --git a/reposts.njk b/reposts.njk
index 1db416f..a16a4d2 100644
--- a/reposts.njk
+++ b/reposts.njk
@@ -1,55 +1,109 @@
 ---
 layout: layouts/base.njk
 title: Reposts
-permalink: /reposts/
+withSidebar: true
+pagination:
+  data: collections.reposts
+  size: 20
+  alias: paginatedReposts
+permalink: "reposts/{% if pagination.pageNumber > 0 %}page/{{ pagination.pageNumber + 1 }}/{% endif %}"
 ---
-<div class="page-header mb-6 sm:mb-8">
+<div class="h-feed">
   <h1 class="text-2xl sm:text-3xl font-bold text-surface-900 dark:text-surface-100 mb-2">Reposts</h1>
-  <p class="text-surface-600 dark:text-surface-400">Content I've shared from others.</p>
-</div>
+  <p class="text-surface-600 dark:text-surface-400 mb-6 sm:mb-8">
+    Content I've shared from others.
+    <span class="text-sm">({{ collections.reposts.length }} total)</span>
+  </p>
 
-{% if collections.reposts.length > 0 %}
-<ul class="space-y-6">
-  {% for post in collections.reposts %}
-  <li class="h-entry p-4 bg-surface-100 dark:bg-surface-800 rounded-lg">
-    <div class="flex items-start gap-4">
-      <div class="flex-shrink-0">
-        <svg class="w-8 h-8 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"/>
-        </svg>
-      </div>
-      <div class="flex-1 min-w-0">
-        {% if post.data.title %}
-        <h2 class="p-name text-lg font-semibold text-surface-900 dark:text-surface-100 mb-2">
-          <a class="hover:underline" href="{{ post.url }}">{{ post.data.title }}</a>
-        </h2>
-        {% endif %}
-        <div class="post-meta text-sm text-surface-500 dark:text-surface-400 mb-2">
-          <time class="dt-published" datetime="{{ post.date.toISOString() }}">
-            {{ post.date | dateDisplay }}
-          </time>
+  {% if paginatedReposts.length > 0 %}
+  <ul class="post-list">
+    {% for post in paginatedReposts %}
+    <li class="h-entry post-card">
+      <div class="post-header flex items-start gap-3">
+        <div class="flex-shrink-0 mt-1">
+          <svg class="w-5 h-5 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"/>
+          </svg>
         </div>
-        {# Support both camelCase (Indiekit Eleventy preset) and underscore (legacy) property names #}
-        {% set repostedUrl = post.data.repostOf or post.data.repost_of %}
-        {% if repostedUrl %}
-        <p class="mb-3 text-sm">
-          <span class="text-surface-500">Reposted:</span>
-          <a class="u-repost-of text-primary-600 dark:text-primary-400 hover:underline break-all" href="{{ repostedUrl }}">
-            {{ repostedUrl }}
-          </a>
-        </p>
-        {% endif %}
-        {% if post.templateContent %}
-        <div class="e-content prose dark:prose-invert prose-sm max-w-none">
-          {{ post.templateContent | safe }}
+        <div class="flex-1 min-w-0">
+          {% if post.data.title %}
+          <h2 class="p-name text-lg font-semibold text-surface-900 dark:text-surface-100 mb-2">
+            <a class="hover:text-primary-600 dark:hover:text-primary-400" href="{{ post.url }}">{{ post.data.title }}</a>
+          </h2>
+          {% endif %}
+          <div class="post-meta">
+            <time class="dt-published" datetime="{{ post.date | isoDate }}">
+              {{ post.date | dateDisplay }}
+            </time>
+            {% if post.data.category %}
+            <span class="post-categories">
+              {% if post.data.category is string %}
+              <span class="p-category">{{ post.data.category }}</span>
+              {% else %}
+              {% for cat in post.data.category %}
+              <span class="p-category">{{ cat }}</span>
+              {% endfor %}
+              {% endif %}
+            </span>
+            {% endif %}
+          </div>
+          {# Support both camelCase (Indiekit Eleventy preset) and underscore (legacy) property names #}
+          {% set repostedUrl = post.data.repostOf or post.data.repost_of %}
+          {% if repostedUrl %}
+          <p class="mt-2 text-sm">
+            <span class="text-surface-500">Reposted:</span>
+            <a class="u-repost-of text-primary-600 dark:text-primary-400 hover:underline break-all" href="{{ repostedUrl }}">
+              {{ repostedUrl }}
+            </a>
+          </p>
+          {% endif %}
+          {% if post.templateContent %}
+          <div class="e-content prose dark:prose-invert prose-sm mt-3 max-w-none">
+            {{ post.templateContent | safe }}
+          </div>
+          {% endif %}
+          <a class="u-url text-sm text-primary-600 dark:text-primary-400 hover:underline mt-3 inline-block" href="{{ post.url }}">Permalink</a>
         </div>
-        {% endif %}
-        <a class="u-url text-xs text-surface-400 hover:underline mt-2 inline-block" href="{{ post.url }}">Permalink</a>
       </div>
+    </li>
+    {% endfor %}
+  </ul>
+
+  {# Pagination controls #}
+  {% if pagination.pages.length > 1 %}
+  <nav class="pagination" aria-label="Reposts pagination">
+    <div class="pagination-info">
+      Page {{ pagination.pageNumber + 1 }} of {{ pagination.pages.length }}
     </div>
-  </li>
-  {% endfor %}
-</ul>
-{% else %}
-<p class="text-surface-600 dark:text-surface-400">No reposts yet.</p>
-{% endif %}
+    <div class="pagination-links">
+      {% if pagination.href.previous %}
+      <a href="{{ pagination.href.previous }}" class="pagination-link" aria-label="Previous page">
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path></svg>
+        Previous
+      </a>
+      {% else %}
+      <span class="pagination-link disabled">
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path></svg>
+        Previous
+      </span>
+      {% endif %}
+
+      {% if pagination.href.next %}
+      <a href="{{ pagination.href.next }}" class="pagination-link" aria-label="Next page">
+        Next
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg>
+      </a>
+      {% else %}
+      <span class="pagination-link disabled">
+        Next
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path></svg>
+      </span>
+      {% endif %}
+    </div>
+  </nav>
+  {% endif %}
+
+  {% else %}
+  <p class="text-surface-600 dark:text-surface-400">No reposts yet.</p>
+  {% endif %}
+</div>