M2: content collections — case studies, blog, RSS, tags, sitemap

Projects + blog as schema-validated content collections; structured case
studies (problem/design/outcome), blog with tag pages, reading time, RSS
feed (drafts excluded), sitemap, and Shiki dual-theme code highlighting.

src/styles/global.css

@@ -167,6 +167,89 @@ svg {
   left: 0;
 }
 
+/* ---- Prose (rendered markdown) ------------------------------------------ */
+.prose {
+  color: var(--text-dim);
+  font-size: var(--step-0);
+  line-height: 1.75;
+  max-width: 70ch;
+}
+.prose > * + * {
+  margin-top: var(--space-4);
+}
+.prose h2 {
+  color: var(--text);
+  font-size: var(--step-2);
+  margin-top: var(--space-7);
+  padding-top: var(--space-4);
+  border-top: 1px solid var(--border);
+}
+.prose h2::before {
+  content: "# ";
+  color: var(--accent);
+  font-family: var(--font-mono);
+  font-weight: 400;
+}
+.prose h3 {
+  color: var(--text);
+  font-size: var(--step-1);
+  margin-top: var(--space-6);
+}
+.prose strong {
+  color: var(--text);
+  font-weight: 600;
+}
+.prose a {
+  text-decoration: underline;
+  text-underline-offset: 3px;
+}
+.prose ul,
+.prose ol {
+  padding-left: 1.3rem;
+  display: grid;
+  gap: 0.4rem;
+}
+.prose li::marker {
+  color: var(--accent);
+}
+.prose blockquote {
+  border-left: 2px solid var(--accent);
+  padding-left: var(--space-4);
+  color: var(--text);
+  font-style: italic;
+}
+.prose code:not(pre code) {
+  font-family: var(--font-mono);
+  font-size: 0.85em;
+  background: var(--surface-2);
+  border: 1px solid var(--border);
+  border-radius: 5px;
+  padding: 0.1rem 0.4rem;
+}
+.prose pre {
+  background: var(--surface) !important;
+  border: 1px solid var(--border);
+  border-radius: var(--radius-sm);
+  padding: var(--space-4);
+  overflow-x: auto;
+  font-size: 0.85rem;
+  line-height: 1.6;
+}
+.prose pre code {
+  font-family: var(--font-mono);
+}
+
+/* Shiki dual-theme: dark is the default (dark-first / JS-off safe);
+   light overrides when the theme is light. We keep our own <pre> background. */
+.astro-code,
+.astro-code span {
+  color: var(--shiki-dark);
+}
+[data-theme="light"] .astro-code,
+[data-theme="light"] .astro-code span {
+  color: var(--shiki-light);
+}
+
 /* ---- Reveal-on-scroll (progressive enhancement) -------------------------- */
 /* Default = visible (JS-off safe). The .reveal class is only added by JS when
    IntersectionObserver is supported AND motion is allowed. */