hgfd

public/s/css/f0ckm.css

@@ -1754,47 +1754,34 @@ body.layout-modern .global-sidebar-right {
   body.layout-modern .item-layout-container .item-main-content {
     grid-column: 2;
     height: calc(100vh - var(--navbar-h, 50px));
-    display: grid;
-    grid-template-rows: auto auto auto auto;
-    justify-items: center;
-    overflow: hidden;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    overflow-x: hidden;
+    overflow-y: auto;
     padding: 20px;
     min-height: 0;
     min-width: 0;
     gap: 0;
-    overflow-y: scroll;
-    align-content: center;
   }
 
-  /* When image is expanded: flex column so metadata stays below the image */
-  body.layout-modern .item-layout-container .item-main-content:has(.embed-responsive.is-expanded) {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
+  /* Flex spacers: absorb remaining space to vertically center content when it fits,
+     collapse to 0 when content overflows — so scrolling works naturally. */
+  body.layout-modern .item-layout-container .item-main-content::before,
+  body.layout-modern .item-layout-container .item-main-content::after {
+    content: '';
+    flex: 1 0 0px;
   }
 
-  /* flex-shrink: 0 prevents children from compressing to fit the fixed-height container.
-     align-self: center overrides the grid-mode "align-self: start" rules — in flex-column
-     "start" means left, not top, so we explicitly center instead. */
-  body.layout-modern .item-layout-container .item-main-content:has(.embed-responsive.is-expanded) > * {
+  /* All direct children must not shrink so they keep their natural size and
+     the container scrolls instead of compressing children. */
+  body.layout-modern .item-layout-container .item-main-content > * {
     flex-shrink: 0;
-    align-self: center;
-  }
-
-  body.layout-modern .item-layout-container .item-main-content ._204863 {
-    align-self: start;
-  }
-
-  body.layout-modern .item-layout-container .item-main-content .item_title {
-    align-self: start;
-  }
-
-  body.layout-modern .item-layout-container .item-main-content .content {
-    align-self: start;
+    width: 100%;
+    max-width: 1100px;
   }
 
   body.layout-modern .item-layout-container .item-main-content .metadata {
-    align-self: start;
     overflow: visible;
   }