From 435396855220d56e88841b0e47c50ac77affa3ce Mon Sep 17 00:00:00 2001
From: Ahmed Hashim <ahashim@users.noreply.github.com>
Date: Mon, 6 Jul 2026 14:53:48 -0700
Subject: [PATCH 1/2] feat(theme): add cyberdream theme (@ahashim)

Port of the cyberdream.nvim colorscheme (scottmckendry/cyberdream.nvim): a high-contrast, futuristic and vibrant dark theme. Includes a theme CSS file for per-nav-item accent colors.
---
 frontend/src/ts/constants/themes.ts   | 13 +++++++
 frontend/static/themes/cyberdream.css | 52 +++++++++++++++++++++++++++
 packages/schemas/src/themes.ts        |  1 +
 3 files changed, 66 insertions(+)
 create mode 100644 frontend/static/themes/cyberdream.css

diff --git a/frontend/src/ts/constants/themes.ts b/frontend/src/ts/constants/themes.ts
index 0bb86f625671..13ca40cc2ef9 100644
--- a/frontend/src/ts/constants/themes.ts
+++ b/frontend/src/ts/constants/themes.ts
@@ -2322,6 +2322,19 @@ export const themes: Record<ThemeName, Theme> = {
     colorfulError: "#b29a91",
     colorfulErrorExtra: "#b29a91",
   },
+  cyberdream: {
+    bg: "#16181a",
+    caret: "#5ef1ff",
+    main: "#5ef1ff",
+    sub: "#7b8496",
+    subAlt: "#1e2124",
+    text: "#ffffff",
+    error: "#ff6e5e",
+    errorExtra: "#b24d42",
+    colorfulError: "#ff5ea0",
+    colorfulErrorExtra: "#ff5ef1",
+    hasCss: true,
+  },
 };
 
 export type ThemeWithName = Theme & { name: ThemeName };
diff --git a/frontend/static/themes/cyberdream.css b/frontend/static/themes/cyberdream.css
new file mode 100644
index 000000000000..114139bc569a
--- /dev/null
+++ b/frontend/static/themes/cyberdream.css
@@ -0,0 +1,52 @@
+[data-nav-item="test"] {
+  color: #5ef1ff;
+  &:hover {
+    color: color-mix(in srgb, #5ef1ff 75%, white 25%);
+  }
+}
+
+[data-nav-item="leaderboards"] {
+  color: #f1ff5e;
+  &:hover {
+    color: color-mix(in srgb, #f1ff5e 75%, white 25%);
+  }
+}
+
+[data-nav-item="about"] {
+  color: #5eff6c;
+  &:hover {
+    color: color-mix(in srgb, #5eff6c 75%, white 25%);
+  }
+}
+
+[data-nav-item="settings"] {
+  color: #bd5eff;
+  &:hover {
+    color: color-mix(in srgb, #bd5eff 75%, white 25%);
+  }
+}
+
+[data-nav-item="account"] {
+  --themable-button-text: #5ea1ff;
+  &:hover {
+    --themable-button-text: color-mix(
+      in srgb,
+      var(--themable-button-text),
+      white 25%
+    );
+  }
+}
+
+[data-nav-item="alerts"] {
+  color: #ffbd5e;
+  &:hover {
+    color: color-mix(in srgb, #ffbd5e 75%, white 25%);
+  }
+}
+
+[data-nav-item="login"] {
+  color: #ff5ea0;
+  &:hover {
+    color: color-mix(in srgb, #ff5ea0 75%, white 25%);
+  }
+}
diff --git a/packages/schemas/src/themes.ts b/packages/schemas/src/themes.ts
index ace96ba0a33c..f3d07bb823a9 100644
--- a/packages/schemas/src/themes.ts
+++ b/packages/schemas/src/themes.ts
@@ -190,6 +190,7 @@ export const ThemeNameSchema = z.enum(
     "witch_girl",
     "pale_nimbus",
     "spiderman",
+    "cyberdream",
   ],
   {
     errorMap: customEnumErrorHandler("Must be a known theme"),

From ec48ddbb414e980eb2bee5ae171f627955c4f4b2 Mon Sep 17 00:00:00 2001
From: Ahmed Hashim <ahashim@users.noreply.github.com>
Date: Mon, 6 Jul 2026 15:16:01 -0700
Subject: [PATCH 2/2] feat(theme): add cyberdream_light variant (@ahashim)

Light variant of the cyberdream port, using cyberdream.nvim's light palette.
---
 frontend/src/ts/constants/themes.ts         | 13 ++++++
 frontend/static/themes/cyberdream_light.css | 52 +++++++++++++++++++++
 packages/schemas/src/themes.ts              |  1 +
 3 files changed, 66 insertions(+)
 create mode 100644 frontend/static/themes/cyberdream_light.css

diff --git a/frontend/src/ts/constants/themes.ts b/frontend/src/ts/constants/themes.ts
index 13ca40cc2ef9..ba9fae1ab1be 100644
--- a/frontend/src/ts/constants/themes.ts
+++ b/frontend/src/ts/constants/themes.ts
@@ -2335,6 +2335,19 @@ export const themes: Record<ThemeName, Theme> = {
     colorfulErrorExtra: "#ff5ef1",
     hasCss: true,
   },
+  cyberdream_light: {
+    bg: "#ffffff",
+    caret: "#008c99",
+    main: "#008c99",
+    sub: "#7b8496",
+    subAlt: "#eaeaea",
+    text: "#16181a",
+    error: "#d11500",
+    errorExtra: "#920f00",
+    colorfulError: "#f40064",
+    colorfulErrorExtra: "#d100bf",
+    hasCss: true,
+  },
 };
 
 export type ThemeWithName = Theme & { name: ThemeName };
diff --git a/frontend/static/themes/cyberdream_light.css b/frontend/static/themes/cyberdream_light.css
new file mode 100644
index 000000000000..344eb80e5f72
--- /dev/null
+++ b/frontend/static/themes/cyberdream_light.css
@@ -0,0 +1,52 @@
+[data-nav-item="test"] {
+  color: #008c99;
+  &:hover {
+    color: color-mix(in srgb, #008c99 75%, black 25%);
+  }
+}
+
+[data-nav-item="leaderboards"] {
+  color: #997b00;
+  &:hover {
+    color: color-mix(in srgb, #997b00 75%, black 25%);
+  }
+}
+
+[data-nav-item="about"] {
+  color: #008b0c;
+  &:hover {
+    color: color-mix(in srgb, #008b0c 75%, black 25%);
+  }
+}
+
+[data-nav-item="settings"] {
+  color: #a018ff;
+  &:hover {
+    color: color-mix(in srgb, #a018ff 75%, black 25%);
+  }
+}
+
+[data-nav-item="account"] {
+  --themable-button-text: #0057d1;
+  &:hover {
+    --themable-button-text: color-mix(
+      in srgb,
+      var(--themable-button-text),
+      black 25%
+    );
+  }
+}
+
+[data-nav-item="alerts"] {
+  color: #d17c00;
+  &:hover {
+    color: color-mix(in srgb, #d17c00 75%, black 25%);
+  }
+}
+
+[data-nav-item="login"] {
+  color: #f40064;
+  &:hover {
+    color: color-mix(in srgb, #f40064 75%, black 25%);
+  }
+}
diff --git a/packages/schemas/src/themes.ts b/packages/schemas/src/themes.ts
index f3d07bb823a9..600ba29f2f99 100644
--- a/packages/schemas/src/themes.ts
+++ b/packages/schemas/src/themes.ts
@@ -191,6 +191,7 @@ export const ThemeNameSchema = z.enum(
     "pale_nimbus",
     "spiderman",
     "cyberdream",
+    "cyberdream_light",
   ],
   {
     errorMap: customEnumErrorHandler("Must be a known theme"),