优化布局

frontend-vue/src/styles/main.css

@@ -2,7 +2,7 @@
 @import './reset.css';
 
 body {
-  background: var(--color-bg-light);
+  background: #1a1a1a;
   font-family: var(--font-family-base);
 }
 
@@ -39,35 +39,29 @@ html {
 
 .page-shell {
   min-height: 100vh;
-  min-height: 100dvh;
 }
 
-/*
- * The desktop client uses a resizable WebView. Brand modules have a dynamic
- * navigation header, so their content must consume the remaining space
- * instead of subtracting the old fixed 56px header height.
- */
+/* Match the desktop client shell in web_source/brand.html. */
 @media (min-width: 1101px) {
-  html:has(.module-page),
-  body:has(.module-page) {
-    height: 100%;
+  body {
+    display: flex;
+    flex-direction: column;
     overflow: hidden;
-    background: #1a1a1a;
   }
 
-  #app:has(> .module-page) {
-    height: 100vh;
-    height: 100dvh;
+  #app {
+    flex: 1 1 auto;
+    min-height: 0;
+  }
+
+  #app > .page-shell {
+    height: 100%;
     min-height: 0;
-    overflow: hidden;
-    background: #1a1a1a;
   }
 
   .module-page {
     display: flex;
     flex-direction: column;
-    height: 100vh;
-    height: 100dvh;
     min-height: 0 !important;
     overflow: hidden;
   }
@@ -78,8 +72,8 @@ html {
 
   .module-page > .main-content {
     flex: 1 1 auto;
-    height: auto !important;
     min-height: 0 !important;
+    height: auto !important;
     overflow: hidden;
   }
 
@@ -96,15 +90,6 @@ html {
   }
 }
 
-@media (max-width: 1100px) {
-  body:has(.module-page),
-  #app:has(> .module-page) {
-    min-height: 100vh;
-    min-height: 100dvh;
-    background: #1a1a1a;
-  }
-}
-
 .theme-light {
   background: var(--color-bg-light);
   color: var(--color-text-primary);