feat: fix logo disply

frontend/src/assets/main.css

@@ -35,12 +35,18 @@ body {
   display: flex;
   flex-direction: column;
   align-items: center;
-  padding: 0 2rem;
   min-height: 100vh;
   width: 100%;
   box-sizing: border-box;
 }
 
+#app-main {
+  width: 100%;
+  max-width: 1400px;
+  padding: 0 2rem;
+  margin-bottom: 2rem;
+}
+
 /* Header */
 .app-header {
   width: 100%;
@@ -48,7 +54,8 @@ body {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  padding: 1.5rem 0;
+  padding: 1.5rem 2rem;
+  box-sizing: border-box;
 }
 
 .logo {
@@ -72,13 +79,14 @@ body {
 /* Hero Section */
 .hero-section {
   width: 100%;
-  max-width: 1400px;
+  /* max-width is handled by app-main */
   background-color: var(--primary-purple);
   color: var(--text-light);
   padding: 4rem 2rem;
   border-radius: var(--border-radius);
   text-align: center;
   margin-bottom: 2rem;
+  box-sizing: border-box;
 }
 
 .hero-section h1 {
@@ -177,12 +185,12 @@ body {
 /* Inbox Section */
 .inbox-section {
   width: 100%;
-  max-width: 1400px;
-  min-width: 1200px;
+  /* max-width is handled by app-main */
   background-color: var(--light-grey);
   border-radius: var(--border-radius);
   padding: 1.5rem;
   box-shadow: var(--card-shadow);
+  box-sizing: border-box;
 }
 
 .inbox-container {
@@ -345,12 +353,12 @@ body {
     -webkit-text-size-adjust: 100%; /* Prevent iOS font scaling */
   }
 
-  #app {
+  #app-main {
     padding: 0 1rem;
   }
 
   .app-header {
-    padding: 1rem 0; /* Adjust padding for mobile */
+    padding: 1rem; /* Adjust padding for mobile */
     /* Keep flex row layout for alignment */
     display: flex;
     justify-content: space-between;