From 7c11235612334aed492d769492822b0ee719b238 Mon Sep 17 00:00:00 2001
From: kdletters <kdletters@qq.com>
Date: Wed, 26 Aug 2026 23:59:06 +0800
Subject: [PATCH] =?UTF-8?q?=E7=BD=91=E9=A1=B5=E5=86=85=E6=A0=87=E9=A2=98?=
 =?UTF-8?q?=E6=A0=8F=E4=B8=8B=E7=BB=9F=E4=B8=80=E9=A2=84=E7=95=99=E5=86=85?=
 =?UTF-8?q?=E5=AE=B9=E4=B8=8E=E5=BC=B9=E5=B1=82=E7=A9=BA=E9=97=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

自绘标题栏改为悬浮覆盖，内容容器用 padding-top 预留标题栏高度，页面内容始终从标题栏下方开始。

全屏固定弹层（设置、通知、审批、GDD 审批及 portal 到 body 的通用弹层）统一从标题栏下方开始，避免与自绘标题栏重叠。

标题栏高度提升到 :root CSS 变量，portal 弹层与页面共用同一偏移，移动端同步缩为 46px。

恢复设置保存提示的右上角定位，由遮罩整体下移承载，并新增固定弹层样式静态守门测试。
---
 apps/ai-game-creator-shell/src/styles.css     | 54 ++++++++++++++++---
 .../appSurface/runtime-settings.suite.ts      | 17 ++++++
 2 files changed, 64 insertions(+), 7 deletions(-)

diff --git a/apps/ai-game-creator-shell/src/styles.css b/apps/ai-game-creator-shell/src/styles.css
index 8aab217b7..5ae7406de 100644
--- a/apps/ai-game-creator-shell/src/styles.css
+++ b/apps/ai-game-creator-shell/src/styles.css
@@ -21,12 +21,22 @@ body {
   min-height: 0;
 }
 
+:root {
+  /* 网页内自绘标题栏占用的顶部高度；portal 到 body 的固定弹层也要从它下方开始。 */
+  --window-chrome-height: 50px;
+}
+
+/* portal 到 body 的全屏固定弹层从标题栏下方开始，避免与自绘标题栏重叠。 */
+.fixed.inset-0 {
+  top: var(--window-chrome-height);
+}
+
 /* 桌面壳统一承载标题栏，让 Tauri 与浏览器预览共用同一表面。 */
 .window-chrome {
   --window-chrome-height: 50px;
   --window-chrome-title-side-space: 300px;
-  display: grid;
-  grid-template-rows: var(--window-chrome-height) minmax(0, 1fr);
+  position: relative;
+  display: block;
   width: 100%;
   height: 100dvh;
   min-height: 0;
@@ -36,7 +46,10 @@ body {
 }
 
 .window-chrome__bar {
-  position: relative;
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
   z-index: 30;
   display: grid;
   grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
@@ -254,7 +267,9 @@ body {
 .window-chrome__content {
   position: relative;
   z-index: 0;
+  box-sizing: border-box;
   height: 100%;
+  padding-top: var(--window-chrome-height);
   min-width: 0;
   min-height: 0;
   overflow: hidden;
@@ -300,6 +315,15 @@ body {
   overflow: auto;
 }
 
+.window-chrome__content
+  > .launcher-shell
+  .launcher-main
+  > .platform-theme.h-screen {
+  height: 100%;
+  min-height: 0;
+  overflow: auto;
+}
+
 .window-chrome__content .launcher-main:has(.game-project-workbench) {
   display: flex;
   flex-direction: column;
@@ -320,6 +344,10 @@ body {
 }
 
 @media (max-width: 760px) {
+  :root {
+    --window-chrome-height: 46px;
+  }
+
   .window-chrome {
     --window-chrome-height: 46px;
   }
@@ -2978,7 +3006,10 @@ textarea {
 
 .launcher-dialog-backdrop {
   position: fixed;
-  inset: 0;
+  top: var(--window-chrome-height);
+  right: 0;
+  bottom: 0;
+  left: 0;
   z-index: 200;
   display: grid;
   padding: 24px;
@@ -3272,7 +3303,10 @@ h2 {
 
 .settings-overlay {
   position: fixed;
-  inset: 0;
+  top: var(--window-chrome-height);
+  right: 0;
+  bottom: 0;
+  left: 0;
   z-index: 220;
   display: grid;
   place-items: center;
@@ -7081,7 +7115,10 @@ iframe.preview-frame {
 
 .game-approval-backdrop {
   position: fixed;
-  inset: 0;
+  top: var(--window-chrome-height);
+  right: 0;
+  bottom: 0;
+  left: 0;
   z-index: 260;
   display: grid;
   padding: 20px;
@@ -7659,7 +7696,10 @@ iframe.preview-frame {
 
 .gdd-approval-card__dialog-backdrop {
   position: fixed;
-  inset: 0;
+  top: var(--window-chrome-height);
+  right: 0;
+  bottom: 0;
+  left: 0;
   z-index: 220;
   display: grid;
   padding: 24px;
diff --git a/apps/ai-game-creator-shell/tests/appSurface/runtime-settings.suite.ts b/apps/ai-game-creator-shell/tests/appSurface/runtime-settings.suite.ts
index 9916904e2..9ce90eb9b 100644
--- a/apps/ai-game-creator-shell/tests/appSurface/runtime-settings.suite.ts
+++ b/apps/ai-game-creator-shell/tests/appSurface/runtime-settings.suite.ts
@@ -1,3 +1,6 @@
+import fs from 'node:fs';
+import path from 'node:path';
+
 import { APP_VERSION } from '../../src/app/appMetadata';
 import {
   act,
@@ -18,6 +21,20 @@ import {
 } from './harness';
 
 export function registerAgentStatusDerivationTests() {
+  it('keeps fixed overlays below the in-page window title bar', () => {
+    const styles = fs.readFileSync(
+      path.join(process.cwd(), 'apps/ai-game-creator-shell/src/styles.css'),
+      'utf8',
+    );
+    expect(styles).toContain('--window-chrome-height: 50px;');
+    expect(styles).toContain('.fixed.inset-0 {');
+    expect(styles).toContain('top: var(--window-chrome-height);');
+    expect(styles).toContain('.settings-overlay {');
+    expect(styles).toContain('.launcher-dialog-backdrop {');
+    expect(styles).toContain('.game-approval-backdrop {');
+    expect(styles).toContain('.gdd-approval-card__dialog-backdrop {');
+  });
+
   it('derives agent card status from the latest run trace step', () => {
     const manifest = createGameCreationAppManifest(
       'local-project-draft',