From b48d67a82335b032b4d357a19eb6108f0c1be882 Mon Sep 17 00:00:00 2001
From: Jack <jack0210_@hotmail.com>
Date: Mon, 19 Oct 2026 14:34:08 +0800
Subject: [PATCH] pin the boot fallback to the dark palette

The inline boot styles and FOUC script still branched on the removed
light/dark and ink/comic settings, so the first paint flashed the old
light surface before Vue mounted. Match the single dark theme and give
the logo sweep the neon tint.
---
 packages/client/index.html | 44 ++++++--------------------------------
 1 file changed, 6 insertions(+), 38 deletions(-)

diff --git a/packages/client/index.html b/packages/client/index.html
index 46bfb0a..b979379 100644
--- a/packages/client/index.html
+++ b/packages/client/index.html
@@ -6,7 +6,7 @@
   <link rel="icon" type="image/svg+xml" href="/favicon.ico" />
   <link rel="apple-touch-icon" href="/logo.png" />
   <link rel="manifest" href="/manifest.webmanifest" />
-  <meta name="theme-color" content="#f7f7f4" />
+  <meta name="theme-color" content="#1a1d23" />
   <meta name="apple-mobile-web-app-capable" content="yes" />
   <meta name="apple-mobile-web-app-title" content="hermes-ui" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
@@ -20,25 +20,17 @@
 
     body {
       margin: 0;
-      background: #f7f7f4;
-    }
-
-    html.dark body {
-      background: #1a1a1a;
+      background: oklch(0.155 0.012 250);
     }
 
     .boot-fallback {
       min-height: 100vh;
       display: grid;
       place-items: center;
-      color: #222222;
+      color: oklch(0.945 0.006 200);
       font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
     }
 
-    html.dark .boot-fallback {
-      color: #f0f0f0;
-    }
-
     .boot-fallback__logo-wrap {
       position: relative;
       display: block;
@@ -52,7 +44,7 @@
       content: "";
       position: absolute;
       inset: 0;
-      background: linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, 0.85) 48%, transparent 66%);
+      background: linear-gradient(105deg, transparent 30%, rgba(45, 212, 191, 0.55) 48%, transparent 66%);
       transform: translateX(-140%);
       mix-blend-mode: screen;
       pointer-events: none;
@@ -80,33 +72,9 @@
     }
   </style>
 
-  <!-- Prevent FOUC by applying theme classes immediately -->
+  <!-- CYBER is a single dark theme: pin Arco's dark tokens before first paint -->
   <script>
-    (function() {
-      try {
-        const brightness = localStorage.getItem('hermes_brightness') || 'system';
-        const style = localStorage.getItem('hermes_style') || 'ink';
-
-        // Resolve dark mode
-        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
-        const isDark = brightness === 'dark' || (brightness === 'system' && prefersDark);
-
-        // Resolve comic style
-        const isComic = style === 'comic';
-
-        // Apply classes immediately
-        if (isDark) {
-          document.documentElement.classList.add('dark');
-        }
-        if (isComic) {
-          document.documentElement.classList.add('comic');
-        }
-        // Arco Design dark theme mechanism (Phase 005)
-        document.documentElement.setAttribute('arco-theme', isDark ? 'dark' : 'light');
-      } catch (e) {
-        console.warn('Failed to apply theme:', e);
-      }
-    })();
+    document.documentElement.setAttribute('arco-theme', 'dark');
   </script>
 </head>