redesign site as "case file" theme

- new paper/ink palette with single red accent, replacing catppuccin
- self-hosted IBM Plex Serif (display) + Source Serif 4 (body), drop Outfit
- rebuilt homepage masthead, numbered post index, navbar with active states
- switch syntax highlighting + utterances to gruvbox, synced via postMessage
- remove terminal/404 easter egg chrome, clean up remaining inline styles
- fix stray syntax.css link causing a 404

templates/archive.html

@@ -1,46 +1,20 @@
 {% extends "base.html" %} {% block title %}{{ section.title }} | {{ config.title }}{% endblock title
 %} {% block content %}
 <div class="post-detail">
-  <header class="post-header" style="margin-bottom: 3rem">
-    <h1 class="post-title" style="font-size: clamp(2.5rem, 5vw, 4.5rem)">Archive</h1>
+  <header class="post-header list-page-header">
+    <h1 class="post-title list-page-title">Archive</h1>
   </header>
 
-  <div class="archive-list" style="max-width: 65ch; margin: 0 auto">
+  <div class="archive-list">
     {% set section = get_section(path="posts/_index.md") %} {% for year, posts in section.pages |
     sort(attribute="date") | reverse | group_by(attribute="year") %}
-    <div class="archive" style="margin-bottom: 2rem">
-      <h2
-        style="font-size: 1.5rem; color: var(--text-color); margin-bottom: 1rem; margin-top: 2rem"
-      >
-        {{ year }}
-      </h2>
-      <ul
-        style="
-          list-style-type: none;
-          padding-left: 1rem;
-          margin: 0;
-          display: flex;
-          flex-direction: column;
-          gap: 0.75rem;
-        "
-      >
+    <div class="archive-year">
+      <h2 class="archive-year-title">{{ year }}</h2>
+      <ul class="archive-items">
         {% for post in posts %}
-        <li class="hover-scale" style="display: flex; gap: 1rem; align-items: baseline">
-          <time
-            datetime="{{ post.date }}"
-            style="
-              color: var(--text-muted);
-              font-size: 0.95rem;
-              white-space: nowrap;
-              font-family: var(--font-mono);
-            "
-            >{{ post.date | date(format="%d-%b") }}</time
-          >
-          <a
-            href="{{ post.permalink }}"
-            style="color: var(--accent-color); font-weight: 500; font-size: 1.05rem"
-            >{{ post.title }}</a
-          >
+        <li class="archive-item hover-scale">
+          <time datetime="{{ post.date }}" class="archive-date">{{ post.date | date(format="%d-%b") }}</time>
+          <a href="{{ post.permalink }}" class="archive-link">{{ post.title }}</a>
         </li>
         {% endfor %}
       </ul>