diff --git a/services/web-ui/public/app.jsx b/services/web-ui/public/app.jsx
index 5a88667..8078127 100644
--- a/services/web-ui/public/app.jsx
+++ b/services/web-ui/public/app.jsx
@@ -1,6 +1,6 @@
 // app.jsx - main shell
 
-const ACCENT = '#5B7CFA';
+const ACCENT = '#1025A1';
 
 function App() {
   const [route, setRoute] = React.useState('home');
@@ -41,8 +41,8 @@ function App() {
     document.documentElement.style.setProperty('--accent', ACCENT);
     document.documentElement.style.setProperty('--accent-soft', hexToRgba(ACCENT, 0.14));
     document.documentElement.style.setProperty('--accent-soft-2', hexToRgba(ACCENT, 0.22));
-    document.documentElement.style.setProperty('--accent-text', lighten(ACCENT, 0.25));
-    document.documentElement.style.setProperty('--accent-hover', lighten(ACCENT, 0.08));
+    document.documentElement.style.setProperty('--accent-text', '#C7CFEA'); // Halo — readable on dark
+    document.documentElement.style.setProperty('--accent-hover', '#1830B8');
   }, []);
 
   React.useEffect(() => {
diff --git a/services/web-ui/public/screens-auth.jsx b/services/web-ui/public/screens-auth.jsx
index f1e3a0e..f912077 100644
--- a/services/web-ui/public/screens-auth.jsx
+++ b/services/web-ui/public/screens-auth.jsx
@@ -76,7 +76,7 @@
         style={{
           width: '100%',
           background: disabled ? 'var(--bg-3)' : 'var(--accent)',
-          color: disabled ? 'var(--text-3)' : '#0a0c10',
+          color: '#fff',
           border: 'none',
           borderRadius: 4,
           padding: '9px',
diff --git a/services/web-ui/public/styles-fixes.css b/services/web-ui/public/styles-fixes.css
index 41ae605..a9e5296 100644
--- a/services/web-ui/public/styles-fixes.css
+++ b/services/web-ui/public/styles-fixes.css
@@ -253,10 +253,10 @@
   /* Convert the dark logo to white so it pops on the dark sidebar.
      brightness(0) collapses everything to black, invert(1) flips to white.
      Works on both the original dark PNG and any transparent white PNG. */
-  filter: brightness(0) invert(1) drop-shadow(0 0 6px rgba(232, 130, 28, 0.30));
+  filter: brightness(0) invert(1) drop-shadow(0 0 6px rgba(16, 37, 161, 0.35));
 }
 .sidebar-header:hover .brand-logo {
-  filter: brightness(0) invert(1) drop-shadow(0 0 10px rgba(232, 130, 28, 0.55));
+  filter: brightness(0) invert(1) drop-shadow(0 0 10px rgba(16, 37, 161, 0.55));
 }
 
 /* ============================================================
@@ -268,7 +268,7 @@
   overflow-y: auto;
   overflow-x: hidden;
   background:
-    radial-gradient(1100px 500px at 50% -10%, rgba(232, 130, 28, 0.07), transparent 60%),
+    radial-gradient(1100px 500px at 50% -10%, rgba(16, 37, 161, 0.08), transparent 60%),
     var(--bg-0);
   display: flex;
   align-items: flex-start;
@@ -311,7 +311,7 @@
   object-fit: contain;
   filter:
     brightness(0) invert(1)
-    drop-shadow(0 0 8px rgba(232, 130, 28, 0.35));
+    drop-shadow(0 0 8px rgba(16, 37, 161, 0.35));
   animation: launcherLogoIn 400ms cubic-bezier(0.2, 0.7, 0.2, 1) both;
 }
 @keyframes launcherLogoIn {
@@ -500,10 +500,10 @@
 /* Tone variants - colour the icon tile + halo, leave the body text
    neutral so the tile reads as a button, not a banner. */
 .launcher-tile.tone-accent {
-  --tile-tint: rgba(232, 130, 28, 0.15);
+  --tile-tint: rgba(16, 37, 161, 0.18);
   --tile-icon-bg: var(--accent-soft);
   --tile-icon-fg: var(--accent-text);
-  --tile-icon-border: rgba(232, 130, 28, 0.28);
+  --tile-icon-border: rgba(16, 37, 161, 0.30);
 }
 .launcher-tile.tone-live {
   --tile-tint: rgba(255, 59, 48, 0.18);
@@ -667,7 +667,7 @@ button.btn.primary:active {
   stroke-width: 1.5;
 }
 .bmd-card-trace {
-  stroke: rgba(232, 130, 28, 0.10);
+  stroke: rgba(16, 37, 161, 0.12);
   stroke-width: 0.5;
   fill: none;
 }
diff --git a/services/web-ui/public/styles-rest.css b/services/web-ui/public/styles-rest.css
index 9b4961a..8f37a80 100644
--- a/services/web-ui/public/styles-rest.css
+++ b/services/web-ui/public/styles-rest.css
@@ -171,7 +171,7 @@
   gap: 20px;
   align-items: stretch;
   background:
-    radial-gradient(ellipse at top, rgba(232,130,28,0.05), transparent 60%),
+    radial-gradient(ellipse at top, rgba(16,37,161,0.05), transparent 60%),
     var(--bg-0);
 }
 .decklink-card-face {
@@ -971,7 +971,7 @@
   border-bottom: 1px solid var(--border);
 }
 .epg-week-day:last-child { border-bottom: 0; }
-.epg-week-day.today { background: linear-gradient(180deg, rgba(232,130,28,0.04) 0%, transparent 80%); }
+.epg-week-day.today { background: linear-gradient(180deg, rgba(16,37,161,0.04) 0%, transparent 80%); }
 .epg-week-dayhead {
   display: flex; align-items: baseline; gap: 10px;
   padding: 10px 20px 6px;
@@ -1065,7 +1065,7 @@
   border-color: var(--accent-soft-2);
   background: linear-gradient(180deg, var(--accent-soft) 0%, var(--bg-1) 60%);
 }
-.stat-card--active .value { color: var(--accent); }
+.stat-card--active .value { color: var(--accent-text); }
 .stat-card--failed {
   border-color: rgba(255,91,91,0.25);
   background: linear-gradient(180deg, var(--danger-soft) 0%, var(--bg-1) 60%);
@@ -1236,7 +1236,7 @@
 .token-tier.popular {
   border-color: var(--accent);
   background: linear-gradient(180deg, var(--accent-soft) 0%, var(--bg-1) 40%);
-  box-shadow: 0 0 24px rgba(232,130,28,0.12);
+  box-shadow: 0 0 24px rgba(16,37,161,0.12);
 }
 .token-tier-badge {
   position: absolute;
@@ -1359,7 +1359,7 @@
   border-radius: 99px;
   flex-shrink: 0;
 }
-.search-result-kind.kind-asset { color: #FECF8A; border-color: rgba(232,130,28,0.25); }
+.search-result-kind.kind-asset { color: #C7CFEA; border-color: rgba(16,37,161,0.30); }
 .search-result-kind.kind-project { color: #FFD89B; border-color: rgba(245,166,35,0.25); }
 .search-result-kind.kind-recorder { color: #FFAFAF; border-color: rgba(255,91,91,0.25); }
 .search-result-kind.kind-job { color: #9EE7D2; border-color: rgba(45,212,168,0.25); }
diff --git a/services/web-ui/public/styles.css b/services/web-ui/public/styles.css
index 31fe18d..488061f 100644
--- a/services/web-ui/public/styles.css
+++ b/services/web-ui/public/styles.css
@@ -18,12 +18,12 @@
   --text-3: #8B92A0;  /* WCAG AA (#133) - was #6B7280, 4.06:1 vs --bg-0; now ~7.5:1 */
   --text-4: #6B7280;
 
-  /* accent — electric amber (broadcast tally) */
-  --accent: #E8821C;
-  --accent-hover: #F09030;
-  --accent-soft: rgba(232, 130, 28, 0.14);
-  --accent-soft-2: rgba(232, 130, 28, 0.22);
-  --accent-text: #FECF8A;
+  /* accent — Flame Blue (Wild Dragon brand, Pantone 286 C) */
+  --accent: #1025A1;
+  --accent-hover: #1830B8;
+  --accent-soft: rgba(16, 37, 161, 0.14);
+  --accent-soft-2: rgba(16, 37, 161, 0.22);
+  --accent-text: #C7CFEA;
 
   /* status */
   --success: #2DD4A8;
@@ -244,11 +244,10 @@ a { color: inherit; text-decoration: none; }
 .avatar {
   width: 28px; height: 28px;
   border-radius: 50%;
-  background: var(--bg-3);
-  border: 1px solid var(--border-strong);
+  background: var(--accent);
   display: grid; place-items: center;
   font-weight: 700; font-size: 11px;
-  color: var(--accent);
+  color: #fff;
   flex-shrink: 0;
 }
 .user-meta { display: flex; flex-direction: column; min-width: 0; flex: 1; }
@@ -351,7 +350,7 @@ a { color: inherit; text-decoration: none; }
   transition: background 80ms, border 80ms, color 80ms;
   white-space: nowrap;
 }
-.btn.primary { background: var(--accent); color: #0a0c10; }
+.btn.primary { background: var(--accent); color: #fff; }
 .btn.primary:hover { background: var(--accent-hover); }
 .btn.ghost { background: transparent; color: var(--text-2); }
 .btn.ghost:hover { background: var(--hover); color: var(--text-1); }