From 1bfb9a647ddb19cc56a7d89affe35fbea71ae890 Mon Sep 17 00:00:00 2001
From: shuaiplus <2327005759@qq.com>
Date: Fri, 26 Jun 2026 19:12:20 +0800
Subject: [PATCH] feat: refine app-shell styles for improved layout and dark
 mode consistency

---
 webapp/src/styles.css       | 20 --------------------
 webapp/src/styles/dark.css  |  4 ----
 webapp/src/styles/shell.css | 14 ++++----------
 3 files changed, 4 insertions(+), 34 deletions(-)

diff --git a/webapp/src/styles.css b/webapp/src/styles.css
index 54b6f55..46ac947 100644
--- a/webapp/src/styles.css
+++ b/webapp/src/styles.css
@@ -14,7 +14,6 @@
 /* Unified product polish: refined, smooth, comfortable surfaces across desktop, mobile, and dark mode. */
 
 /* ── surface consistency ── */
-.app-shell,
 .auth-card,
 .dialog-card,
 .card,
@@ -36,12 +35,6 @@
   box-shadow: var(--shadow-sm);
 }
 
-.app-shell {
-  background: var(--panel-soft);
-  border-radius: var(--radius-xl);
-  box-shadow: var(--shadow-lg);
-}
-
 .topbar,
 .mobile-tabbar,
 .app-side {
@@ -104,7 +97,6 @@
 }
 
 /* ── dark mode surface resets ── */
-:root[data-theme='dark'] .app-shell,
 :root[data-theme='dark'] .auth-card,
 :root[data-theme='dark'] .dialog-card,
 :root[data-theme='dark'] .card,
@@ -259,17 +251,6 @@ h4 {
   letter-spacing: 0;
 }
 
-.app-page {
-  padding: 18px;
-}
-
-.app-shell {
-  border-radius: var(--radius-xl);
-  border: 1px solid var(--line);
-  background: var(--panel);
-  box-shadow: var(--shadow-lg);
-}
-
 .topbar {
   height: 56px;
   padding-inline: 16px;
@@ -916,7 +897,6 @@ textarea {
   background: var(--bg-accent);
 }
 
-:root[data-theme='dark'] .app-shell,
 :root[data-theme='dark'] .topbar,
 :root[data-theme='dark'] .app-side,
 :root[data-theme='dark'] .mobile-tabbar,
diff --git a/webapp/src/styles/dark.css b/webapp/src/styles/dark.css
index 460ff73..3386482 100644
--- a/webapp/src/styles/dark.css
+++ b/webapp/src/styles/dark.css
@@ -200,10 +200,6 @@
   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.20), 0 8px 24px rgba(0, 0, 0, 0.16);
 }
 
-:root[data-theme='dark'] .app-shell {
-  box-shadow: 0 4px 40px rgba(0, 0, 0, 0.30);
-}
-
 :root[data-theme='dark'] .list-item:hover {
   box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24), 0 0 0 1px rgba(139, 184, 255, 0.12);
 }
diff --git a/webapp/src/styles/shell.css b/webapp/src/styles/shell.css
index f032fa7..16d1fe4 100644
--- a/webapp/src/styles/shell.css
+++ b/webapp/src/styles/shell.css
@@ -1,17 +1,11 @@
 .app-page {
-  @apply relative min-h-full bg-transparent p-5;
+  @apply relative min-h-full bg-transparent;
 }
 
 .app-shell {
-  @apply relative mx-auto flex max-w-[1600px] flex-col overflow-hidden border bg-panel-soft;
-  height: calc(100vh - 40px);
-  border-color: var(--line);
-  @apply rounded-3xl;
-  box-shadow:
-    0 20px 60px rgba(15, 23, 42, 0.12),
-    0 8px 24px rgba(15, 23, 42, 0.08),
-    0 0 0 1px rgba(15, 23, 42, 0.04);
-  transition: box-shadow var(--dur-medium) var(--ease-smooth);
+  @apply relative flex flex-col;
+  height: 100vh;
+  background: var(--bg-accent);
 }
 
 .topbar {