geminicommit

app.py

@@ -750,7 +750,8 @@ html, body {
     margin: 0;
     padding: 0;
     height: 100%;
-    overflow: hidden; /* prevent global scroll */
+    overflow-y: auto; /* Allow vertical scrolling for the entire page */
+    /* Remove any `overflow: hidden;` from here if it's uncommented */
 }
 
 # #app-bg {
@@ -764,26 +765,22 @@ html, body {
 #     overflow-y: auto;
 #     padding: 24px;
 # }
-
-# #app-bg {
-#     display: block;
-#     min-height: 100vh;
-#     background: radial-gradient(circle at center, #C2C5EF 0%, #E0E2F5 100%) !important;
-#     background-attachment: fixed;
-#     position: relative;
-#     overflow-y: auto;
-#     padding: 24px;
-# }no difference
-
 #app-bg {
-    height: 100vh;
-    width: 100vw;
+    min-height: 100vh;
+    display: flex;
+    justify-content: center;
+    align-items: flex-start;
     background: radial-gradient(circle at center, #C2C5EF 0%, #E0E2F5 100%) !important;
-    display: block;
-    overflow: hidden;
-    padding: 0;
+    background-attachment: fixed;
+    position: relative;
+    /* Keep overflow-y: auto here if you want a scrollbar specifically for the background if its content *itself* overflows,
+       but it might be redundant if main-container handles its own scrolling.
+       For this specific problem, it's less critical than main-container. */
+    overflow-y: auto; /* Or remove if main-container handles it completely */
+    padding: 24px;
 }
 
+
 /* === Main Content Container === */
 # #main-container {
 #     width: 95%;
@@ -799,19 +796,21 @@ html, body {
 #     z-index: 1;
 #     overflow: visible;
 # }
+
 #main-container {
-    height: 100%;
-    overflow-y: auto;
-    padding: 24px;
     width: 95%;
     max-width: 1100px;
-    margin: 0 auto;
+    margin: 20px auto;
+    padding: 24px;
     background: #ffffff;
     border-radius: 18px;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
     border: 2px solid black;
-    box-sizing: border-box;
     position: relative;
+    z-index: 1;
+    overflow-y: auto; /* THIS IS THE MOST IMPORTANT CHANGE for this element */
+    /* You might also want to set a max-height on main-container if you want its scrollbar to appear
+       before the entire page scrolls. Example: max-height: 80vh; */
 }
 
 /* === Card Containers === */