feat(theme): switch to Mars-inspired palette and atmospheric haze (no planet disk)

app/globals.css

@@ -2,46 +2,51 @@
 
 @variant dark (.dark &);
 
+/* Mars palette — warm rust, terracotta, dusty sand, deep crater shadows */
 :root {
-  --background: #fbf7ff;
-  --foreground: #2c2740;
-  --ink: #2c2740;
-  --ink-soft: #5a527a;
-  --muted: #8a83a8;
+  --background: #fff5ee;             /* warm sand mist */
+  --foreground: #3a1f15;
+  --ink: #3a1f15;                    /* deep crater */
+  --ink-soft: #6b3a26;               /* baked clay */
+  --muted: #a07560;
   --card: #ffffff;
-  --card-soft: #f6f1ff;
-  --border: #ece5fa;
-  --accent: #8a7be3;
-  --accent-soft: #efeafd;
-  --success: #7fb89c;
-  --success-soft: #eaf6ef;
-  --success-border: #c9e3d4;
-  --success-ink: #305a45;
-  --halo-1: rgba(255, 213, 232, 0.55); /* soft pink */
-  --halo-2: rgba(204, 224, 255, 0.55); /* baby blue */
-  --halo-3: rgba(232, 218, 255, 0.55); /* lavender */
+  --card-soft: #fdebdc;              /* dust film */
+  --border: #f3d8c3;
+  --accent: #c1502c;                 /* mars-rust */
+  --accent-soft: #fde0d0;
+  --success: #7a8c4d;                /* olive — softer than green on warm bg */
+  --success-soft: #f0eedb;
+  --success-border: #d6d4a4;
+  --success-ink: #4f5a30;
+  --halo-1: rgba(231, 111, 65, 0.45);  /* burnt orange */
+  --halo-2: rgba(255, 188, 138, 0.50); /* peach dust */
+  --halo-3: rgba(196, 76, 39, 0.32);   /* deep rust */
+  --planet-core: #c1502c;
+  --planet-rim:  #8a2f15;
   color-scheme: light;
 }
 
 :root[data-theme="dark"],
 .dark {
-  --background: #0f0c1f;
-  --foreground: #e9e4f6;
-  --ink: #ece8fa;
-  --ink-soft: #b9b1d6;
-  --muted: #8a83a8;
-  --card: #1a1530;
-  --card-soft: #221c3d;
-  --border: #2c2548;
-  --accent: #b1a3ff;
-  --accent-soft: #2a2350;
-  --success: #7fb89c;
-  --success-soft: #1d2e26;
-  --success-border: #2f4d3d;
-  --success-ink: #b9e0c9;
-  --halo-1: rgba(120, 70, 130, 0.35);
-  --halo-2: rgba(60, 90, 160, 0.35);
-  --halo-3: rgba(80, 60, 150, 0.35);
+  --background: #1a0c08;             /* night side of Mars */
+  --foreground: #f4e2d4;
+  --ink: #f4e2d4;
+  --ink-soft: #d6b39d;
+  --muted: #a48068;
+  --card: #2a140d;
+  --card-soft: #341a12;
+  --border: #4a261a;
+  --accent: #e26d3d;                 /* glowing rust */
+  --accent-soft: #3d1a10;
+  --success: #b3c275;
+  --success-soft: #2a2615;
+  --success-border: #4a4528;
+  --success-ink: #d8de9c;
+  --halo-1: rgba(231, 111, 65, 0.30);
+  --halo-2: rgba(196, 76, 39, 0.30);
+  --halo-3: rgba(120, 40, 25, 0.40);
+  --planet-core: #d65a30;
+  --planet-rim:  #6e2412;
   color-scheme: dark;
 }
 
@@ -59,31 +64,54 @@ body {
   transition: background-color 0.3s ease, color 0.3s ease;
 }
 
-/* Cosmic-newborn background: soft radial halos + pinpoint stars */
+/*
+ * Mars-scape background:
+ * - warm dusty gradient base
+ * - distant orange/peach halos (atmospheric haze)
+ * - sparse pinpoint stars (deep space)
+ */
 .bg-cosmic {
   background-color: var(--background);
   background-image:
     radial-gradient(circle at 12% 18%, var(--halo-1) 0%, transparent 38%),
-    radial-gradient(circle at 88% 12%, var(--halo-2) 0%, transparent 42%),
-    radial-gradient(circle at 50% 90%, var(--halo-3) 0%, transparent 48%),
-    radial-gradient(1px 1px at 22% 30%, rgba(255,255,255,0.7) 50%, transparent 51%),
-    radial-gradient(1px 1px at 70% 22%, rgba(255,255,255,0.6) 50%, transparent 51%),
-    radial-gradient(1px 1px at 40% 70%, rgba(255,255,255,0.6) 50%, transparent 51%),
-    radial-gradient(1px 1px at 82% 60%, rgba(255,255,255,0.7) 50%, transparent 51%),
-    radial-gradient(1px 1px at 18% 82%, rgba(255,255,255,0.6) 50%, transparent 51%);
+    radial-gradient(circle at 88% 14%, var(--halo-2) 0%, transparent 44%),
+    radial-gradient(circle at 50% 92%, var(--halo-3) 0%, transparent 50%),
+    radial-gradient(1px 1px at 22% 30%, rgba(255, 235, 215, 0.8) 50%, transparent 51%),
+    radial-gradient(1px 1px at 70% 22%, rgba(255, 235, 215, 0.7) 50%, transparent 51%),
+    radial-gradient(1px 1px at 40% 70%, rgba(255, 235, 215, 0.7) 50%, transparent 51%),
+    radial-gradient(1px 1px at 82% 60%, rgba(255, 235, 215, 0.8) 50%, transparent 51%),
+    radial-gradient(1px 1px at 18% 82%, rgba(255, 235, 215, 0.7) 50%, transparent 51%),
+    linear-gradient(180deg, var(--background) 0%, color-mix(in oklab, var(--background), var(--halo-2) 18%) 100%);
   background-attachment: fixed;
 }
 
 .dark .bg-cosmic {
   background-image:
     radial-gradient(circle at 12% 18%, var(--halo-1) 0%, transparent 38%),
-    radial-gradient(circle at 88% 12%, var(--halo-2) 0%, transparent 42%),
-    radial-gradient(circle at 50% 90%, var(--halo-3) 0%, transparent 48%),
-    radial-gradient(1px 1px at 22% 30%, rgba(255,255,255,0.85) 50%, transparent 51%),
-    radial-gradient(1px 1px at 70% 22%, rgba(255,255,255,0.75) 50%, transparent 51%),
-    radial-gradient(1px 1px at 40% 70%, rgba(255,255,255,0.7) 50%, transparent 51%),
-    radial-gradient(1px 1px at 82% 60%, rgba(255,255,255,0.8) 50%, transparent 51%),
-    radial-gradient(1px 1px at 18% 82%, rgba(255,255,255,0.7) 50%, transparent 51%);
+    radial-gradient(circle at 88% 14%, var(--halo-2) 0%, transparent 44%),
+    radial-gradient(circle at 50% 92%, var(--halo-3) 0%, transparent 50%),
+    radial-gradient(1px 1px at 22% 30%, rgba(255, 220, 200, 0.85) 50%, transparent 51%),
+    radial-gradient(1px 1px at 70% 22%, rgba(255, 220, 200, 0.75) 50%, transparent 51%),
+    radial-gradient(1px 1px at 40% 70%, rgba(255, 220, 200, 0.75) 50%, transparent 51%),
+    radial-gradient(1px 1px at 82% 60%, rgba(255, 220, 200, 0.85) 50%, transparent 51%),
+    radial-gradient(1px 1px at 18% 82%, rgba(255, 220, 200, 0.75) 50%, transparent 51%),
+    linear-gradient(180deg, var(--background) 0%, #0a0604 100%);
+}
+
+/*
+ * Mars-disk glyph: a soft layered radial gradient that reads as a planet.
+ * Used as a decorative ::before in the header.
+ */
+.mars-disk {
+  position: absolute;
+  border-radius: 9999px;
+  background:
+    radial-gradient(circle at 35% 32%, color-mix(in oklab, var(--planet-core), white 25%) 0%, var(--planet-core) 38%, var(--planet-rim) 78%, transparent 100%),
+    radial-gradient(circle at 70% 70%, rgba(0,0,0,0.18), transparent 60%);
+  box-shadow:
+    0 0 60px 10px color-mix(in oklab, var(--planet-core), transparent 70%),
+    inset -8px -8px 30px color-mix(in oklab, var(--planet-rim), transparent 50%);
+  opacity: 0.85;
 }
 
 .bg-card {
@@ -95,11 +123,15 @@ body {
 }
 
 .shadow-soft {
-  box-shadow: 0 6px 20px -10px rgba(138, 123, 227, 0.25), 0 2px 6px -2px rgba(44, 39, 64, 0.06);
+  box-shadow:
+    0 6px 22px -10px color-mix(in oklab, var(--accent), transparent 70%),
+    0 2px 6px -2px rgba(58, 31, 21, 0.10);
 }
 
 .shadow-lifted {
-  box-shadow: 0 18px 40px -18px rgba(138, 123, 227, 0.35), 0 6px 14px -6px rgba(44, 39, 64, 0.08);
+  box-shadow:
+    0 22px 44px -22px color-mix(in oklab, var(--accent), transparent 55%),
+    0 8px 16px -8px rgba(58, 31, 21, 0.12);
 }
 
 /* Form elements */