feat: space background from Aaron's Space_HD.jpg asset

- public/space-bg.jpg: Aaron's space art (3072x2048, purple cosmic scene)
- globals.css: body background wired to /space-bg.jpg with dark overlay (65% opacity)
  for readability, fixed attachment so it scrolls naturally
- CSS vars updated: dark/dark-mid/dark-card tuned for deep-purple space palette
- border color shifted slightly toward purple to complement the bg

styles/globals.css

@@ -9,10 +9,10 @@
   --bone-dim: #9e9080;
   --red: #c0392b;
   --red-glow: rgba(192, 57, 43, 0.4);
-  --dark: #0a0806;
-  --dark-mid: #120f0a;
-  --dark-card: #1a1510;
-  --border: rgba(232, 220, 200, 0.12);
+  --dark: #06030f;
+  --dark-mid: rgba(8, 4, 20, 0.85);
+  --dark-card: rgba(12, 6, 28, 0.78);
+  --border: rgba(180, 140, 255, 0.18);
   --font-display: 'Georgia', 'Times New Roman', serif;
   --font-body: 'Segoe UI', system-ui, -apple-system, sans-serif;
 }
@@ -22,7 +22,12 @@ html {
 }
 
 body {
-  background: var(--dark);
+  background-color: #06030f;
+  background-image: url('/space-bg.jpg');
+  background-size: cover;
+  background-position: center top;
+  background-attachment: fixed;
+  background-repeat: no-repeat;
   color: var(--bone);
   font-family: var(--font-body);
   line-height: 1.6;
@@ -30,6 +35,21 @@ body {
   overflow-x: hidden;
 }
 
+/* Dark overlay so text stays readable over the space background */
+body::before {
+  content: '';
+  position: fixed;
+  inset: 0;
+  background: rgba(4, 0, 14, 0.65);
+  pointer-events: none;
+  z-index: 0;
+}
+
+#__next {
+  position: relative;
+  z-index: 1;
+}
+
 a {
   color: inherit;
   text-decoration: none;
@@ -46,5 +66,5 @@ img {
 
 /* Scrollbar */
 ::-webkit-scrollbar { width: 6px; }
-::-webkit-scrollbar-track { background: var(--dark); }
+::-webkit-scrollbar-track { background: #06030f; }
 ::-webkit-scrollbar-thumb { background: var(--red); border-radius: 3px; }