From f7814ad364c6d5f7884c9a80fe05a8a81271778b Mon Sep 17 00:00:00 2001
From: Codeman maintainer <noreply@anthropic.com>
Date: Tue, 16 Jun 2026 18:22:33 +0200
Subject: [PATCH] feat(ui): distinct colors for welcome action buttons on
 Daylight Blue (v1.1.8)

On the default daylight-blue skin the three welcome buttons all read blue.
Give each its own identity: Run Claude Code keeps the blue accent, Cloudflare
Tunnel takes Cloudflare brand orange, Run OpenCode takes emerald green (with
matching hover/active states + dark ink for contrast). Scoped to daylight-blue
only; daylight-green and OG unchanged. Verified in-browser (blue/orange/green).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 CHANGELOG.md              |  6 ++++++
 CLAUDE.md                 |  2 +-
 package-lock.json         |  4 ++--
 package.json              |  2 +-
 src/web/public/styles.css | 35 +++++++++++++++++++++++++++++++++++
 5 files changed, 45 insertions(+), 4 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index e58aec94..39b08d7d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,11 @@
 # aicodeman
 
+## 1.1.8
+
+### Patch Changes
+
+- UI (Daylight Blue skin): give the welcome-screen action buttons distinct colors instead of all reading blue. **Run Claude Code** keeps the blue accent, **Cloudflare Tunnel** now uses Cloudflare's brand orange, and **Run OpenCode** uses an emerald green — so the three are visually distinguishable at a glance. Scoped to the default `daylight-blue` skin only (daylight-green and OG are unchanged), with matching hover/active states and dark ink for contrast. Verified in a real browser: the three buttons compute to blue / orange / green gradients on the welcome overlay.
+
 ## 1.1.7
 
 ### Patch Changes
diff --git a/CLAUDE.md b/CLAUDE.md
index 362a2fa8..a79e887c 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -56,7 +56,7 @@ When user says "COM":
 
 CI runs `npm run check:lockfile` on every push/PR, so lockfile drift fails the build even if the `version-packages` script is bypassed.
 
-**Version**: 1.1.7 (must match `package.json`)
+**Version**: 1.1.8 (must match `package.json`)
 
 ## Project Overview
 
diff --git a/package-lock.json b/package-lock.json
index 14cd0b3e..eaa64265 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "aicodeman",
-  "version": "1.1.7",
+  "version": "1.1.8",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "aicodeman",
-      "version": "1.1.7",
+      "version": "1.1.8",
       "hasInstallScript": true,
       "license": "MIT",
       "workspaces": [
diff --git a/package.json b/package.json
index c2cae108..c4cd422e 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "aicodeman",
-  "version": "1.1.7",
+  "version": "1.1.8",
   "description": "Mission control for AI coding agents - run 20 autonomous agents with real-time monitoring and session persistence",
   "type": "module",
   "main": "dist/index.js",
diff --git a/src/web/public/styles.css b/src/web/public/styles.css
index 8bfc9286..c1d79fb7 100644
--- a/src/web/public/styles.css
+++ b/src/web/public/styles.css
@@ -10199,3 +10199,38 @@ html:not([data-skin="og"]) {
 /* ---- Focus rings (driven by --accent, now emerald) stay accessible ---- */
 :focus-visible { outline-color: var(--accent); }
 }
+
+/* ---- Daylight Blue: distinct identity per welcome action button ----
+   Run Claude Code keeps the blue accent; Cloudflare Tunnel takes Cloudflare's
+   brand orange; Run OpenCode takes an emerald green — so the three are clearly
+   different colors instead of all reading blue. Scoped to daylight-blue only;
+   placed after the shared daylight block to win on equal specificity. ---- */
+html[data-skin="daylight-blue"] .welcome-btn-opencode {
+  background: linear-gradient(135deg, #0d9f6e, #2fbf85);
+  border-color: rgba(16, 185, 129, 0.5);
+  color: #04291b;
+}
+html[data-skin="daylight-blue"] .welcome-btn-opencode:hover {
+  background: linear-gradient(135deg, #10b981, #34d399);
+  border-color: rgba(52, 211, 153, 0.6);
+  box-shadow: 0 0 28px -4px rgba(16, 185, 129, 0.4);
+}
+html[data-skin="daylight-blue"] .welcome-btn-tunnel {
+  background: linear-gradient(135deg, #ef7611, #fbad41);
+  border-color: rgba(246, 130, 31, 0.5);
+  color: #2e1503;
+}
+html[data-skin="daylight-blue"] .welcome-btn-tunnel:hover {
+  background: linear-gradient(135deg, #fb8b2a, #ffc05a);
+  border-color: rgba(251, 173, 65, 0.6);
+  box-shadow: 0 0 28px -4px rgba(246, 130, 31, 0.45);
+}
+html[data-skin="daylight-blue"] .welcome-btn-tunnel.active {
+  background: linear-gradient(135deg, #d9650b, #f6821f);
+  border-color: rgba(246, 130, 31, 0.6);
+  color: #fff7ed;
+}
+html[data-skin="daylight-blue"] .welcome-btn-tunnel.active:hover {
+  background: linear-gradient(135deg, #ef7611, #fb8b2a);
+  box-shadow: 0 0 28px -4px rgba(246, 130, 31, 0.5);
+}