Vaporwave theme: sunset gradient, hot pink, vapor cyan, mint money

Fifth theme in the cycle — panels glow pink, stat values get a cyan
halo, the canvas runs saturated with a slight hue shift, and the page
behind it all is a proper purple-to-sunset gradient.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

src/ui/hud.css

@@ -80,9 +80,33 @@
   --canvas-bright: 1.05;
 }
 
+:root[data-theme="vapor"] {
+  --bg: linear-gradient(180deg, #16063a 0%, #45156b 38%, #c33168 70%, #ff9a76 100%);
+  --panel: rgba(28, 9, 52, 0.88);
+  --edge: #83308f;
+  --text: #ffe9f7;
+  --dim: #c79bd8;
+  --soft: #ffd6ef;
+  --purple: #b967ff;
+  --cyan: #01cdfe;
+  --amber: #ffb96b;
+  --red: #ff5e78;
+  --green: #05ffa1;
+  --chip: #2d1250;
+  --chip-on: #55207d;
+  --card: #271046;
+  --card-good: #0d3d3a;
+  --bar-bg: #3b1b63;
+  --input: #1c0a35;
+  --canvas-bright: 1.08;
+}
+
 body { background: var(--bg); }
 #app canvas { filter: brightness(var(--canvas-bright)); }
 :root[data-theme="crt"] #hud { text-shadow: 0 0 6px rgba(74, 222, 128, 0.3); }
+:root[data-theme="vapor"] #app canvas { filter: brightness(1.08) saturate(1.3) hue-rotate(-6deg); }
+:root[data-theme="vapor"] #hud .panel { box-shadow: 0 0 20px rgba(255, 110, 199, 0.14); }
+:root[data-theme="vapor"] #topbar .stat .val { text-shadow: 0 0 8px rgba(1, 205, 254, 0.35); }
 
 /* high-contrast bumps the most-read text sizes */
 :root[data-theme="contrast"] #topbar .stat .val { font-size: 15px; }

src/ui/hud.ts

@@ -42,6 +42,7 @@ export const THEMES = [
   { id: "contrast", name: "Hi-Contrast" },
   { id: "paper", name: "Paper" },
   { id: "crt", name: "CRT" },
+  { id: "vapor", name: "Vaporwave" },
 ];
 
 export function applyTheme(id: string) {