keycloakify-starter 亮色改为雾白、冰蓝工作区，不再大面积深色。

暗色使用深海蓝灰，并保持足够的层级和对比度。
class 主题同样支持亮暗模式。
Account/Admin 页头增加模式切换按钮，选择会持久保存。
仍遵守 Keycloak 的 darkMode=false 配置，关闭时只允许亮色。
Account 统一为“页面上下文 → 身份业务区 → 操作区”结构。
Admin 统一为“领域上下文 → 业务内容 → 固定操作区”结构。
表格、表单、详情、向导、弹窗、空状态、安全设备及应用授权组件全部纳入统一设计系统。
移动端自动收起侧栏、双栏变单栏，并调整固定操作区。

src/.gitignore

@@ -1,17 +1,22 @@
 # This file is managed by Keycloakify, do not edit it manually.
 
 # === Owned files start ===
+# account/colorScheme.ts
 # account/KcAccountUi.tsx
 # account/KcContext.ts
 # account/KcPage.tsx
 # admin/App.tsx
+# admin/colorScheme.ts
 # admin/index.css
 # admin/KcAdminUi.tsx
 # admin/page-nav.css
+# admin/PageHeader.tsx
 # admin/PageNav.tsx
 # account/assets/logo.svg
 # account/personal-info/PersonalInfo.tsx
+# account/root/Header.tsx
 # account/root/PageNav.tsx
+# account/root/Root.tsx
 # admin/assets/logo.svg
 # admin/dashboard/dashboard.css
 # admin/dashboard/Dashboard.tsx
@@ -91,7 +96,6 @@
 /admin/admin-client.tsx
 /admin/banners.module.css
 /admin/Banners.tsx
-/admin/colorScheme.ts
 /admin/environment-types.ts
 /admin/environment.ts
 /admin/ForbiddenSection.tsx
@@ -99,7 +103,6 @@
 /admin/i18next.d.ts
 /admin/KcContext.ts
 /admin/KcPage.tsx
-/admin/PageHeader.tsx
 /admin/PageHeaderClearCachesModal.tsx
 /admin/PageNotFoundSection.tsx
 /admin/Root.tsx
@@ -841,7 +844,6 @@
 
 # === @keycloakify/keycloak-account-ui v260700.0.3 ===
 /account/api.ts
-/account/colorScheme.ts
 /account/environment.ts
 /account/i18n-type.ts
 /account/i18next.d.ts
@@ -915,8 +917,6 @@
 /account/resources/SharedWith.tsx
 /account/resources/ShareTheResource.tsx
 /account/root/header.module.css
-/account/root/Header.tsx
-/account/root/Root.tsx
 /account/utils/formatDate.ts
 /account/utils/joinPath.ts
 /account/utils/useAccountAlerts.ts

src/account/colorScheme.ts

@@ -0,0 +1,21 @@
+/**
+ * This file has been claimed for ownership from @keycloakify/keycloak-account-ui version 260700.0.3.
+ * To relinquish ownership and restore this file to its original content, run the following command:
+ *
+ * $ npx keycloakify own --path "account/colorScheme.ts" --revert
+ */
+
+/* IMPORTANT NOTE:
+ * If you modify how the light/dark mode is implemented
+ * you must also update public/admin/early-color-scheme.js
+ * This scrip is ran before this to avoid white flashes
+ */
+
+import { getKcContext } from "./KcContext";
+import { startConsoleColorScheme } from "../shared/consoleColorScheme";
+
+export function startColorSchemeManagement() {
+    const { kcContext } = getKcContext();
+
+    startConsoleColorScheme(kcContext.darkMode !== false);
+}

src/account/components/page/Page.tsx

@@ -24,12 +24,12 @@ type PageProps = {
 
 export const Page = ({ title, description, children }: PropsWithChildren<PageProps>) => {
     return (
-        <>
+        <article className="account-business-page">
-            <PageSection variant="light">
+            <PageSection variant="light" className="account-view-header">
-                <div className="nexus-page-intro">
+                <div className="account-view-header__layout">
-                    <div className="nexus-page-intro__copy">
+                    <div className="account-view-header__copy">
-                        <span className="nexus-page-intro__kicker">
+                        <span className="account-view-header__eyebrow">
-                            NEXUS / Identity control
+                            Identity workspace / Account
                         </span>
                         <TextContent>
                             <Title headingLevel="h1" data-testid="page-heading">
@@ -38,14 +38,16 @@ export const Page = ({ title, description, children }: PropsWithChildren<PagePro
                             <Text component="p">{description}</Text>
                         </TextContent>
                     </div>
-                    <div className="nexus-page-intro__mark" aria-hidden="true">
+                    <div className="account-view-header__context" aria-hidden="true">
-                        <span>ID</span>
+                        <span>SELF SERVICE</span>
+                        <strong>ID</strong>
                         <i />
-                        <span>ACCOUNT</span>
                     </div>
                 </div>
             </PageSection>
-            <PageSection variant="light">{children}</PageSection>
+            <PageSection variant="light" className="account-view-body">
-        </>
+                <div className="account-view-body__surface">{children}</div>
+            </PageSection>
+        </article>
     );
 };