From 6203337188f06dc8b03b7792ac67bfc8e0ee8a66 Mon Sep 17 00:00:00 2001
From: irl-dan <97565471+irl-dan@users.noreply.github.com>
Date: Tue, 2 Jun 2026 23:20:21 -0700
Subject: [PATCH] revert: restore warm manuscript theme + redirect
 /start/what-is-openprose

Revert the "living ledger" design system (da72c9e) back to the warm
manuscript aesthetic that preceded it. Restores app/brand.css,
app/global.css, and the small radius/shadow/shell-class tweaks in
layout, error, copy-button, and prose-program to their pre-da72c9e state.
No commits after da72c9e touched these files, so the revert is clean.

Also add a 308 redirect for /start/what-is-openprose -> /openprose. The
early docs lived under /start/*; PR #2 restructured them into
/openprose/*, dropping the old page that external links still point at.
The OpenProse overview page is its successor.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 app/brand.css                | 275 ++++++++++++++---------------------
 app/error.tsx                |   2 +-
 app/global.css               | 146 +++++++++----------
 app/layout.tsx               |   2 +-
 components/copy-button.tsx   |   2 +-
 components/prose-program.tsx |   2 +-
 next.config.mjs              |  12 ++
 7 files changed, 197 insertions(+), 244 deletions(-)

diff --git a/app/brand.css b/app/brand.css
index f500ed0..1852882 100644
--- a/app/brand.css
+++ b/app/brand.css
@@ -1,3 +1,21 @@
+@font-face {
+  font-family: "Literata";
+  font-style: normal;
+  font-weight: 300 900;
+  font-display: swap;
+  src: url("https://fonts.gstatic.com/s/literata/v35/or3PQ6P12-iJxAIgLa78DkrbXsDgk0oVo.woff2")
+    format("woff2");
+}
+
+@font-face {
+  font-family: "Literata";
+  font-style: italic;
+  font-weight: 300 900;
+  font-display: swap;
+  src: url("https://fonts.gstatic.com/s/literata/v35/or3RQ6P12-iJxAIgLa78DkrbXsDgk0oVo6EGM3iE.woff2")
+    format("woff2");
+}
+
 @font-face {
   font-family: "JetBrains Mono";
   font-style: normal;
@@ -7,40 +25,54 @@
     format("woff2");
 }
 
-html,
-body,
-#nd-docs-layout {
-  background: var(--docs-bg);
+:root {
+  --paper-cream: #faf7f2;
+  --paper-warm: #f5f0e6;
+  --paper-aged: #ede6d6;
+  --paper-shadow: #e8dfd0;
+  --ink-dark: #1c1917;
+  --ink-medium: #44403c;
+  --ink-light: #78716c;
+  --ink-faded: #a8a29e;
+  --accent-primary: #8a6b2e;
+  --accent-soft: #a88848;
+  --accent-bg: rgba(138, 107, 46, 0.1);
+  --secondary-primary: #15696c;
+  --secondary-soft: #2d8589;
+  --secondary-bg: rgba(21, 105, 108, 0.1);
+  --code-panel: #002b36;
+  --code-panel-soft: #073642;
+  --code-panel-border: #0b3e4a;
+  --code-text-strong: #eee8d5;
+  --code-text-muted: #93a1a1;
+  --code-punct: #586e75;
+  --code-key: #268bd2;
+  --code-type: #b58900;
+  --code-section: #859900;
+  --font-prose: "Literata", "Georgia", serif;
+  --font-code: "JetBrains Mono", "SF Mono", "Consolas", monospace;
+  --color-fd-accent: var(--secondary-bg);
+  --color-fd-accent-foreground: var(--secondary-primary);
+  --color-fd-ring: var(--secondary-primary);
 }
 
+html,
+body,
 #nd-docs-layout {
-  color: var(--docs-ink);
+  background: var(--paper-cream);
 }
 
 #nd-sidebar {
-  background: color-mix(in oklch, var(--docs-bg) 86%, var(--docs-surface));
-  border-color: var(--docs-rule);
+  background: var(--paper-cream);
 }
 
 body {
-  color: var(--docs-ink);
-  font-family: var(--font-body);
-}
-
-.op-docs-shell {
-  background:
-    linear-gradient(
-      90deg,
-      color-mix(in oklch, var(--docs-rule) 30%, transparent) 1px,
-      transparent 1px
-    )
-    0 0 / clamp(4.5rem, 9vw, 7.5rem) 100%,
-    var(--docs-bg);
+  color: var(--ink-dark);
+  font-family: var(--font-prose);
 }
 
 .prose {
-  color: var(--docs-ink);
-  font-family: var(--font-body);
+  font-family: var(--font-prose);
 }
 
 code,
@@ -51,58 +83,38 @@ pre,
   font-family: var(--font-code);
 }
 
+.paper-texture {
+  position: relative;
+}
+
+.paper-texture::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
+  opacity: 0.03;
+  pointer-events: none;
+  mix-blend-mode: multiply;
+}
+
 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
-  color: var(--docs-ink);
+  letter-spacing: 0;
 }
 
 article#nd-page > h1 {
-  color: var(--docs-ink);
-  font-family: var(--font-display);
-  font-size: clamp(2.35rem, 5vw, 4.7rem);
-  font-weight: 600;
-  line-height: 0.98;
+  color: var(--ink-dark);
+  font-family: var(--font-prose);
+  font-weight: 500;
   letter-spacing: 0;
 }
 
-#nd-page .prose h2 {
-  margin-top: 2.7rem;
-  color: var(--docs-ink);
-  font-family: var(--font-display);
-  font-size: clamp(1.55rem, 2.7vw, 2.1rem);
-  font-weight: 600;
-  line-height: 1.12;
-}
-
-#nd-page .prose h1 {
-  color: var(--docs-ink);
-  font-size: clamp(1.8rem, 3.2vw, 2.7rem);
-  font-weight: 700;
-  line-height: 1.08;
-}
-
-#nd-page .prose h3 {
-  color: var(--docs-ink);
-  font-size: 1.05rem;
-  font-weight: 650;
-}
-
-#nd-page .prose p,
-#nd-page .prose li {
-  color: var(--docs-ink-soft);
-  line-height: 1.72;
-}
-
-#nd-page .prose strong {
-  color: var(--docs-ink);
-}
-
 .op-doc-title {
-  color: var(--docs-ink);
+  color: var(--ink-dark);
 }
 
 .op-doc-title-brand {
@@ -110,121 +122,73 @@ article#nd-page > h1 {
   align-items: baseline;
 }
 
-.op-doc-title-brand span:first-child,
-.op-wordmark span:first-child {
-  color: var(--docs-signal);
-}
-
-.op-doc-title-brand span:last-child,
-.op-wordmark span:last-child,
-a:hover .op-wordmark span:last-child {
-  color: var(--docs-ink);
+.op-doc-title-brand span:first-child {
+  color: var(--accent-primary);
 }
 
 .op-wordmark {
   display: inline-flex;
   align-items: baseline;
-  color: var(--docs-ink);
-  font-family: var(--font-display);
+  color: var(--ink-dark);
+  font-family: var(--font-prose);
   font-size: 1.25rem;
   font-weight: 600;
   letter-spacing: 0;
   line-height: 1;
 }
 
-a:hover .op-wordmark span:first-child {
-  color: var(--docs-signal);
+.op-wordmark span:first-child {
+  color: var(--accent-primary);
 }
 
-#nd-sidebar a {
-  border-radius: 5px;
-  color: var(--docs-ink-soft);
+.op-wordmark span:last-child,
+a:hover .op-wordmark span:last-child {
+  color: var(--ink-dark);
 }
 
-#nd-sidebar a:hover {
-  background: color-mix(in oklch, var(--docs-surface-hot) 30%, transparent);
-  color: var(--docs-ink);
+a:hover .op-wordmark span:first-child {
+  color: var(--accent-primary);
 }
 
 #nd-sidebar a[data-active="true"] {
-  background: color-mix(in oklch, var(--docs-signal) 22%, var(--docs-surface));
-  color: var(--docs-brand-navy);
+  background: var(--secondary-bg);
+  color: var(--secondary-primary);
 }
 
 #nd-sidebar a[data-active="true"]:hover {
-  color: var(--docs-brand-navy);
+  color: var(--secondary-primary);
 }
 
 #nd-page .prose a:not([data-card]) {
-  color: var(--docs-blue);
-  text-decoration-color: color-mix(in oklch, var(--docs-blue) 42%, transparent);
+  color: var(--secondary-primary);
+  text-decoration-color: color-mix(in srgb, var(--secondary-primary) 40%, transparent);
   text-underline-offset: 4px;
 }
 
 #nd-page .prose a:not([data-card]):hover {
-  color: var(--docs-brand-navy);
-  text-decoration-color: var(--docs-signal);
+  color: var(--accent-primary);
+  text-decoration-color: var(--accent-primary);
 }
 
 #nd-page .prose :not(pre) > code {
-  background: color-mix(in oklch, var(--docs-terminal) 8%, var(--docs-surface));
-  color: var(--docs-brand-navy);
-  border: 1px solid color-mix(in oklch, var(--docs-terminal) 14%, var(--docs-rule));
+  background: color-mix(in srgb, var(--paper-aged) 78%, var(--secondary-primary) 8%);
+  color: var(--ink-dark);
+  border: 1px solid color-mix(in srgb, var(--paper-aged) 80%, var(--secondary-primary) 20%);
   border-radius: 4px;
   font-family: var(--font-code);
   font-size: 0.9em;
   padding: 0.08em 0.35em;
 }
 
-#nd-page .prose blockquote {
-  border: 1px solid var(--docs-rule);
-  border-radius: 6px;
-  background: color-mix(in oklch, var(--docs-surface) 72%, var(--docs-bg));
-  color: var(--docs-ink);
-  padding: 1rem 1.15rem;
-}
-
-#nd-page .prose blockquote p {
-  color: var(--docs-ink);
-}
-
-#nd-page .prose [data-card]:not(.peer) {
-  border-color: var(--docs-rule);
-  border-radius: 6px;
-  background: color-mix(in oklch, var(--docs-surface) 88%, var(--docs-bg));
-  box-shadow: none;
-  color: var(--docs-ink);
-  transition:
-    background 0.18s ease-out,
-    border-color 0.18s ease-out,
-    color 0.18s ease-out;
-}
-
-#nd-page .prose [data-card]:not(.peer):hover {
-  border-color: var(--docs-rule-strong);
-  background: color-mix(in oklch, var(--docs-signal) 16%, var(--docs-surface));
-}
-
-#nd-page .prose [data-card]:not(.peer) h3 {
-  color: var(--docs-ink);
-  font-family: var(--font-code);
-  font-size: 0.77rem;
-  font-weight: 650;
-  letter-spacing: 0.04em;
-  text-transform: uppercase;
-}
-
-#nd-page .prose [data-card]:not(.peer) p {
-  color: var(--docs-muted);
-}
-
 #nd-page figure.shiki,
 #nd-page pre.shiki,
 .prose-program {
-  background: var(--docs-terminal) !important;
-  border: 1px solid var(--docs-terminal-rule) !important;
-  border-radius: 6px;
-  box-shadow: none;
+  background: var(--code-panel) !important;
+  border: 1px solid var(--code-panel-border) !important;
+  border-radius: 10px;
+  box-shadow:
+    0 18px 42px rgba(0, 43, 54, 0.12),
+    0 1px 0 rgba(255, 255, 255, 0.2);
 }
 
 #nd-page figure.shiki {
@@ -236,7 +200,7 @@ a:hover .op-wordmark span:first-child {
 #nd-page pre.shiki,
 .prose-program .shiki,
 .prose-program-code {
-  background: var(--docs-terminal) !important;
+  background: var(--code-panel) !important;
 }
 
 #nd-page figure.shiki [role="region"],
@@ -250,55 +214,38 @@ a:hover .op-wordmark span:first-child {
 #nd-page figure.shiki pre,
 #nd-page pre.shiki,
 .prose-program .shiki {
-  color: var(--docs-terminal-text);
+  color: var(--code-text-strong);
   font-family: var(--font-code);
   font-size: 0.84rem;
   line-height: 1.65;
 }
 
-#nd-page figure.shiki code,
-#nd-page pre.shiki code,
-.prose-program .shiki code {
-  background: transparent !important;
-  border: 0 !important;
-  color: var(--docs-terminal-text);
-  padding: 0 !important;
-}
-
-#nd-page figure.shiki .line,
-#nd-page pre.shiki .line,
-.prose-program .line {
-  background: transparent !important;
-}
-
 #nd-page .shiki code span {
-  background: transparent !important;
-  color: var(--shiki-dark, var(--shiki-light, var(--docs-terminal-text))) !important;
+  color: var(--shiki-light) !important;
 }
 
 #nd-page figure.shiki .line.highlighted,
 .prose-program .line.highlighted {
-  background: color-mix(in oklch, var(--docs-signal) 22%, transparent);
+  background: rgba(21, 105, 108, 0.22);
 }
 
 #nd-page figure.shiki button,
 .prose-program button {
-  border-color: var(--docs-terminal-rule);
-  color: var(--docs-terminal-muted);
+  color: var(--code-text-muted);
 }
 
 #nd-page figure.shiki button:hover,
 .prose-program button:hover {
-  background: color-mix(in oklch, var(--docs-signal) 16%, transparent);
-  color: var(--docs-terminal-text);
+  background: rgba(147, 161, 161, 0.12);
+  color: var(--code-text-strong);
 }
 
 .prose-program figcaption {
-  background: var(--docs-terminal-raised);
-  border-bottom: 1px solid var(--docs-terminal-rule);
-  color: var(--docs-terminal-muted);
+  background: var(--code-panel-soft);
+  border-bottom: 1px solid var(--code-panel-border);
+  color: var(--code-text-muted);
 }
 
 .prose-program figcaption span {
-  color: var(--docs-terminal-muted);
+  color: var(--code-text-muted);
 }
diff --git a/app/error.tsx b/app/error.tsx
index 751d912..9399392 100644
--- a/app/error.tsx
+++ b/app/error.tsx
@@ -26,7 +26,7 @@ export default function GlobalError({
       <button
         type="button"
         onClick={reset}
-        className="font-mono text-xs uppercase tracking-[0.08em] px-4 py-2.5 rounded-[5px] border border-fd-border text-fd-foreground hover:border-fd-accent-foreground hover:text-fd-accent-foreground transition-colors"
+        className="font-mono text-xs uppercase tracking-[0.08em] px-4 py-2.5 rounded border border-fd-border text-fd-foreground hover:border-fd-accent-foreground hover:text-fd-accent-foreground transition-colors"
       >
         Try again
       </button>
diff --git a/app/global.css b/app/global.css
index ca019f8..26c8432 100644
--- a/app/global.css
+++ b/app/global.css
@@ -1,84 +1,69 @@
 @import "tailwindcss";
-@import "fumadocs-ui/style.css";
+@import "fumadocs-ui/css/neutral.css";
+@import "fumadocs-ui/css/preset.css";
 
 /* ============================================
    OPENPROSE DOCS - DESIGN SYSTEM
-   Living Ledger scheme from platform/apps/run.
-   Light-only: dark mode is disabled in app/layout.tsx via RootProvider.
+   Mirrors platform/apps/run "warm manuscript" aesthetic.
+   Light-only: dark mode disabled in app/layout.tsx via RootProvider.
    ============================================ */
 
 :root {
-  color-scheme: light;
-
-  --docs-brand-navy: oklch(15.5% 0.044 224);
-  --docs-brand-mint: oklch(65% 0.145 156);
-  --docs-bg: oklch(92% 0.03 184);
-  --docs-bg-deep: oklch(86.5% 0.033 188);
-  --docs-surface: oklch(95% 0.016 180);
-  --docs-surface-strong: oklch(84.5% 0.032 188);
-  --docs-surface-hot: oklch(81.5% 0.064 158);
-  --docs-rule: oklch(69% 0.04 190);
-  --docs-rule-strong: oklch(45% 0.056 190);
-  --docs-ink: oklch(20% 0.055 220);
-  --docs-ink-soft: oklch(35% 0.044 212);
-  --docs-muted: oklch(45% 0.04 202);
-  --docs-faint: oklch(61% 0.032 196);
-  --docs-signal: var(--docs-brand-mint);
-  --docs-signal-soft: oklch(82% 0.074 156);
-  --docs-blue: oklch(43% 0.12 232);
-  --docs-blue-soft: oklch(88% 0.054 232);
-  --docs-clay: oklch(50% 0.14 43);
-  --docs-terminal: oklch(14% 0.042 220);
-  --docs-terminal-raised: oklch(18% 0.045 216);
-  --docs-terminal-rule: oklch(34% 0.054 205);
-  --docs-terminal-text: oklch(87% 0.028 178);
-  --docs-terminal-muted: oklch(62% 0.035 185);
-  --docs-selection: var(--docs-brand-mint);
-  --docs-selection-text: var(--docs-brand-navy);
-
-  --font-display:
-    "Athelas", "Iowan Old Style", "Charter", "Palatino Linotype", Georgia,
-    ui-serif, serif;
-  --font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui,
-    sans-serif;
-  --font-code: "JetBrains Mono", "SF Mono", "Consolas", monospace;
-  --docs-accent-bg: color-mix(
-    in oklch,
-    var(--docs-signal) 18%,
-    var(--docs-surface)
-  );
-
-  --code-bg: var(--docs-terminal);
-  --code-text: var(--docs-terminal-text);
-
-  /* Fumadocs UI variables keep the generated chrome on the same ledger. */
-  --color-fd-background: var(--docs-bg);
-  --color-fd-foreground: var(--docs-ink);
-  --color-fd-card: var(--docs-surface);
-  --color-fd-card-foreground: var(--docs-ink);
-  --color-fd-popover: var(--docs-surface);
-  --color-fd-popover-foreground: var(--docs-ink);
-  --color-fd-primary: var(--docs-signal);
-  --color-fd-primary-foreground: var(--docs-brand-navy);
-  --color-fd-secondary: var(--docs-surface-strong);
-  --color-fd-secondary-foreground: var(--docs-ink);
-  --color-fd-muted: var(--docs-surface);
-  --color-fd-muted-foreground: var(--docs-muted);
-  --color-fd-accent: var(--docs-accent-bg);
-  --color-fd-accent-foreground: var(--docs-brand-navy);
-  --color-fd-border: var(--docs-rule);
-  --color-fd-input: var(--docs-rule);
-  --color-fd-ring: var(--docs-blue);
+  /* Paper palette -- warm, tactile background tones */
+  --paper-cream: #faf7f2;
+  --paper-warm: #f5f0e6;
+  --paper-aged: #ede6d6;
+  --paper-shadow: #e8dfd0;
+
+  /* Ink palette -- text + iconography */
+  --ink-dark: #1c1917;
+  --ink-medium: #44403c;
+  --ink-light: #78716c;
+  --ink-faded: #a8a29e;
+
+  /* Accent -- Gilt Bronze (austere-institutional, Gilded Age register).
+     Reserved for focus rings, link hovers, and one-word emphasis.
+     Primary CTAs stay ink-dark; accent is never used to fill buttons. */
+  --accent-primary: #8a6b2e;
+  --accent-soft: #a88848;
+  --accent-bg: rgba(138, 107, 46, 0.1);
+
+  /* Code editor -- Solarized Light, matches Shiki's solarized-light theme */
+  --code-bg: #fdf6e3;
+  --code-text: #657b83;
+
+  /* Override Fumadocs UI variables (--color-fd-*) so all docs chrome --
+     header, sidebar, callouts, search, copy buttons, "View as md" --
+     inherits the OpenProse palette without per-component restyling. */
+  --color-fd-background: var(--paper-cream);
+  --color-fd-foreground: var(--ink-dark);
+  --color-fd-card: var(--paper-warm);
+  --color-fd-card-foreground: var(--ink-dark);
+  --color-fd-popover: var(--paper-cream);
+  --color-fd-popover-foreground: var(--ink-dark);
+  --color-fd-primary: var(--ink-dark);
+  --color-fd-primary-foreground: var(--paper-cream);
+  --color-fd-secondary: var(--paper-aged);
+  --color-fd-secondary-foreground: var(--ink-dark);
+  --color-fd-muted: var(--paper-warm);
+  --color-fd-muted-foreground: var(--ink-light);
+  --color-fd-accent: var(--accent-bg);
+  --color-fd-accent-foreground: var(--accent-primary);
+  --color-fd-border: var(--paper-aged);
+  --color-fd-input: var(--paper-aged);
+  --color-fd-ring: var(--accent-primary);
 }
 
 @theme inline {
-  --font-sans: var(--font-body);
-  --font-mono: var(--font-code);
+  /* Make Tailwind's font-sans and font-mono utilities resolve to OpenProse
+     fonts, matching platform/apps/run. */
+  --font-sans: var(--font-prose), Georgia, serif;
+  --font-mono: var(--font-code), "SF Mono", Consolas, monospace;
 }
 
 html {
   scrollbar-gutter: stable;
-  background: var(--docs-bg-deep);
+  background: var(--paper-cream);
 }
 
 html > body[data-scroll-locked] {
@@ -87,12 +72,15 @@ html > body[data-scroll-locked] {
 }
 
 body {
-  background: var(--docs-bg);
-  color: var(--docs-ink);
+  background: var(--paper-cream);
+  color: var(--ink-dark);
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
 
+/* Headlines: balanced wrap, restrained weight (500 max, never bold).
+   Matches platform's "calm typography" rule -- bold weights would feel
+   alien against Literata's editorial register. */
 h1,
 h2,
 h3,
@@ -100,34 +88,40 @@ h4,
 h5,
 h6 {
   text-wrap: balance;
+  font-weight: 500;
   letter-spacing: 0;
 }
 
+/* Selection: gilt-bronze tint, dark text */
 ::selection {
-  background: var(--docs-selection);
-  color: var(--docs-selection-text);
+  background: var(--accent-soft);
+  color: var(--ink-dark);
 }
 
+/* Scrollbar: subtle, paper-warm track */
 ::-webkit-scrollbar {
   width: 8px;
   height: 8px;
 }
 
 ::-webkit-scrollbar-track {
-  background: var(--docs-bg-deep);
+  background: var(--paper-warm);
 }
 
 ::-webkit-scrollbar-thumb {
-  background: var(--docs-faint);
+  background: var(--ink-faded);
   border-radius: 4px;
 }
 
 ::-webkit-scrollbar-thumb:hover {
-  background: var(--docs-muted);
+  background: var(--ink-light);
 }
 
+/* Code blocks rendered by Shiki (solarized-light theme) inherit a paper
+   background. Soften the default border treatment so they sit naturally
+   against paper-cream rather than appearing as inset chrome. */
 pre {
   background: var(--code-bg) !important;
-  border: 1px solid var(--docs-terminal-rule);
-  border-radius: 6px;
+  border: 1px solid var(--paper-aged);
+  border-radius: 8px;
 }
diff --git a/app/layout.tsx b/app/layout.tsx
index 40eb6eb..1b530e6 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -14,7 +14,7 @@ export const metadata: Metadata = {
 export default function Layout({ children }: LayoutProps<"/">) {
   return (
     <html lang="en" suppressHydrationWarning>
-      <body className="op-docs-shell flex flex-col min-h-screen">
+      <body className="paper-texture flex flex-col min-h-screen">
         <RootProvider theme={{ enabled: false, defaultTheme: "light" }}>
           <DocsLayout tree={source.getPageTree()} {...baseOptions()}>
             {children}
diff --git a/components/copy-button.tsx b/components/copy-button.tsx
index 774c8f4..ad02432 100644
--- a/components/copy-button.tsx
+++ b/components/copy-button.tsx
@@ -19,7 +19,7 @@ export function CopyButton({ text }: { text: string }) {
     <button
       type="button"
       onClick={handleClick}
-      className="font-mono text-[11px] uppercase tracking-[0.08em] px-2.5 py-1 rounded-[5px] border border-fd-border text-fd-muted-foreground hover:text-fd-accent-foreground hover:border-fd-accent-foreground transition-colors"
+      className="font-mono text-[11px] uppercase tracking-[0.08em] px-2.5 py-1 rounded border border-fd-border text-fd-muted-foreground hover:text-fd-accent-foreground hover:border-fd-accent-foreground transition-colors"
       aria-label="Copy program source"
     >
       {copied ? "Copied" : "Copy"}
diff --git a/components/prose-program.tsx b/components/prose-program.tsx
index db5351d..2e1583f 100644
--- a/components/prose-program.tsx
+++ b/components/prose-program.tsx
@@ -20,7 +20,7 @@ export async function ProseProgram({
   const html = await highlightProse(code, { highlightLines });
 
   return (
-    <figure className="prose-program my-6 rounded-[6px] border border-fd-border overflow-hidden">
+    <figure className="prose-program my-6 rounded-xl border border-fd-border overflow-hidden shadow-[0_1px_3px_rgba(0,0,0,0.04),0_4px_6px_rgba(0,0,0,0.02)]">
       {(title || copy) && (
         <figcaption className="flex items-center justify-between px-4 py-2.5 bg-fd-muted border-b border-fd-border">
           <span className="font-mono text-xs uppercase tracking-[0.08em] text-fd-muted-foreground">
diff --git a/next.config.mjs b/next.config.mjs
index d4ee491..03012b8 100644
--- a/next.config.mjs
+++ b/next.config.mjs
@@ -6,6 +6,18 @@ const withMDX = createMDX();
 const config = {
   output: "standalone",
   reactStrictMode: true,
+  async redirects() {
+    return [
+      // The early docs lived under /start/*. PR #2 restructured them into
+      // /openprose/*. Keep the old "What is OpenProse?" link alive: it now
+      // maps to the OpenProse overview page (content/docs/openprose/index.mdx).
+      {
+        source: "/start/what-is-openprose",
+        destination: "/openprose",
+        permanent: true,
+      },
+    ];
+  },
 };
 
 export default withMDX(config);