confusion

public/s/css/f0ckm.css

@@ -1727,7 +1727,7 @@ body.layout-modern .global-sidebar-right {
      ---------------------------------------------------------- */
   body.layout-modern .item-layout-container {
     display: grid;
-    grid-template-columns: min(400px, 30vw) minmax(0, 1fr) 400px;
+    grid-template-columns: min(300px, 30vw) minmax(0, 1fr) 300px;
     grid-template-rows: auto;
     flex: 1;
     height: calc(100vh - var(--navbar-h, 50px));
@@ -1738,7 +1738,7 @@ body.layout-modern .global-sidebar-right {
 
   /* Collapsed right sidebar — grid track shrinks to 0 */
   body.layout-modern.sidebar-right-hidden .item-layout-container {
-    grid-template-columns: min(400px, 30vw) minmax(0, 1fr) 0px;
+    grid-template-columns: min(300px, 30vw) minmax(0, 1fr) 0px;
   }
 
   body.layout-modern .item-sidebar-left {
@@ -1782,7 +1782,7 @@ body.layout-modern .global-sidebar-right {
   body.layout-modern .item-layout-container .item-main-content > * {
     flex-shrink: 0;
     width: 100%;
-    max-width: 1100px;
+    max-width: 800px;
   }
 
   body.layout-modern .item-layout-container .item-main-content .metadata {
@@ -1803,11 +1803,11 @@ body.layout-modern .global-sidebar-right {
 
   /* Sidebar toggle: hide left sidebar (e.g. keybind toggle) */
   body.layout-modern .item-layout-container.sidebar-hidden {
-    grid-template-columns: minmax(0, 1fr) 400px;
+    grid-template-columns: 0px minmax(0, 1fr) 400px;
   }
 
   body.layout-modern.sidebar-right-hidden .item-layout-container.sidebar-hidden {
-    grid-template-columns: 1fr;
+    grid-template-columns: 0px minmax(0, 1fr) 0px;
   }
 
   /* By the time sidebar-hidden is added (post-slide), content is already off-screen */
@@ -1816,18 +1816,18 @@ body.layout-modern .global-sidebar-right {
   }
 
   body.layout-modern .item-layout-container.sidebar-hidden .item-main-content {
-    grid-column: 1;
+    grid-column: 2;
   }
 
   /* Body-level left-sidebar hide — set by blocking inline script before first paint
      to prevent the sidebar from flashing visible. Mirrors the .sidebar-hidden rules above
      but activates from the body class so it works before the container element exists. */
   body.layout-modern.sidebar-left-hidden .item-layout-container {
-    grid-template-columns: minmax(0, 1fr) 400px;
+    grid-template-columns: 0px minmax(0, 1fr) 400px;
   }
 
   body.layout-modern.sidebar-left-hidden.sidebar-right-hidden .item-layout-container {
-    grid-template-columns: 1fr;
+    grid-template-columns: 0px minmax(0, 1fr) 0px;
   }
 
   body.layout-modern.sidebar-left-hidden .item-layout-container .item-sidebar-left {
@@ -1835,7 +1835,7 @@ body.layout-modern .global-sidebar-right {
   }
 
   body.layout-modern.sidebar-left-hidden .item-layout-container .item-main-content {
-    grid-column: 1;
+    grid-column: 2;
   }
 
   body.layout-modern .item-sidebar-right,
@@ -4838,13 +4838,13 @@ body.layout-legacy.sidebar-right-hidden .embed-responsive-16by9::before {
   (-webkit-min-device-pixel-ratio: 1.2), 
   (min-resolution: 1.2dppx) and (max-resolution: 1.25dppx) {
   body.layout-modern .embed-responsive-16by9::before {
-    padding-top: 41.25%;
+    padding-top: 52.25%;
   }
   body.layout-legacy .embed-responsive-16by9::before {
-    padding-top: 41.25%;
+    padding-top: 52.25%;
   }
   body.layout-legacy.sidebar-right-hidden .embed-responsive-16by9::before {
-    padding-top: 41.25%;
+    padding-top: 52.25%;
   }
 }
 
@@ -4910,7 +4910,7 @@ body.layout-legacy.sidebar-right-hidden .embed-responsive-16by9::before {
 
 /* ~105–115% zoom */
 html[data-dpr="dpr-110"] body.layout-modern .embed-responsive-16by9::before {
-  padding-top: 46.25%;
+  padding-top: 52.25%;
 }
 html[data-dpr="dpr-110"] body.layout-legacy .embed-responsive-16by9::before {
   padding-top: 52.25%;
@@ -4921,7 +4921,7 @@ html[data-dpr="dpr-110"] body.layout-legacy.sidebar-right-hidden .embed-responsi
 
 /* ~120–125% zoom */
 html[data-dpr="dpr-120"] body.layout-modern .embed-responsive-16by9::before {
-  padding-top: 41.25%;
+  padding-top: 52.25%;
 }
 html[data-dpr="dpr-120"] body.layout-legacy .embed-responsive-16by9::before {
   padding-top: 52.25%;
@@ -4935,10 +4935,10 @@ html[data-dpr="dpr-130"] body.layout-legacy .embed-responsive-16by9::before {
   padding-top: 52.25%;
 }
 html[data-dpr="dpr-130"] body.layout-modern .embed-responsive-16by9::before {
-  padding-top: 41.25%;
+  padding-top: 52.25%;
 }
 html[data-dpr="dpr-130"] body.layout-modern.sidebar-right-hidden .embed-responsive-16by9::before {
-  padding-top: 41.25%;
+  padding-top: 52.25%;
 }
 html[data-dpr="dpr-130"] body.layout-legacy.sidebar-right-hidden .embed-responsive-16by9::before {
   padding-top: 52.25%;
@@ -5474,6 +5474,10 @@ span#tags {
   padding-bottom: 2.5px;
 }
 
+body.layout-modern span#tags {
+  border-bottom: none;
+}
+
 span#tags:empty {
   display: none;
 }
@@ -5537,6 +5541,15 @@ span#tags:not(.tags-expanded) .tags-inner>span:nth-child(n+11) {
   padding-bottom: 1.5px;
 }
 
+a.removetag {
+  vertical-align: middle;
+  display: inline-flex;
+}
+
+a.removetag i {
+  vertical-align: middle;
+}
+
 .badge-greentext {
   color: #789922;
   text-shadow: inherit !important;

public/s/js/comments.js

@@ -3808,6 +3808,11 @@ class CommentSystem {
     toggleComments() {
         if (!this.container) return;
 
+        if (document.body.classList.contains('layout-modern') && typeof window.toggleSidebarLeft === 'function') {
+            window.toggleSidebarLeft();
+            return;
+        }
+
         const layout = this.container.closest('.item-layout-container');
         const sidebar = this.container.closest('.item-sidebar-left');
         const siblings = sidebar ? [

views/item-partial-modern.html

@@ -39,7 +39,6 @@
         @endif
 
         <div class="sidebar-tags-container">
-            <div style="margin-bottom: 8px; font-weight: bold; color: var(--white); font-size: 0.9em; text-transform: uppercase;"></div>
             <span class="badge badge-dark" id="tags" style="display: flex; flex-wrap: wrap; gap: 5px; background: transparent; padding: 0; text-align: left; white-space: normal;">
                 @if(typeof item.tags !== "undefined")
                 @each(item.tags as tag)