diff --git a/webui/index.html b/webui/index.html
index 3327f422..a683ebf0 100644
--- a/webui/index.html
+++ b/webui/index.html
@@ -963,11 +963,11 @@
                                         <button class="vcal-nav-btn" type="button" data-video-cal-next aria-label="Next week">&#8250;</button>
                                     </div>
                                     <div class="vcal-views" role="group" aria-label="View">
-                                        <button class="vcal-view-btn vcal-view-btn--on" type="button" data-video-cal-view="cards" title="Card view with episode art">
+                                        <button class="vcal-view-btn" type="button" data-video-cal-view="cards" title="Card view with episode art">
                                             <svg width="13" height="13" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><rect x="1" y="1" width="6" height="6" rx="1.6"/><rect x="9" y="1" width="6" height="6" rx="1.6"/><rect x="1" y="9" width="6" height="6" rx="1.6"/><rect x="9" y="9" width="6" height="6" rx="1.6"/></svg>
                                             <span>Cards</span>
                                         </button>
-                                        <button class="vcal-view-btn" type="button" data-video-cal-view="compact" title="Compact view — hide art to fit more episodes">
+                                        <button class="vcal-view-btn vcal-view-btn--on" type="button" data-video-cal-view="compact" title="Compact view — hide art to fit more episodes">
                                             <svg width="13" height="13" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><rect x="1" y="2.4" width="14" height="2.3" rx="1.1"/><rect x="1" y="6.85" width="14" height="2.3" rx="1.1"/><rect x="1" y="11.3" width="14" height="2.3" rx="1.1"/></svg>
                                             <span>Compact</span>
                                         </button>
diff --git a/webui/static/video/video-calendar.js b/webui/static/video/video-calendar.js
index a4a03d59..7761f083 100644
--- a/webui/static/video/video-calendar.js
+++ b/webui/static/video/video-calendar.js
@@ -18,7 +18,7 @@
     var MO = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
     var MO_FULL = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August',
         'September', 'October', 'November', 'December'];
-    var state = { loaded: false, eps: {}, data: null, offset: 0, filter: 'all', view: 'cards' };
+    var state = { loaded: false, eps: {}, data: null, offset: 0, filter: 'all', view: 'compact' };
 
     function $(s) { return document.querySelector(s); }
     function esc(s) {
diff --git a/webui/static/video/video-side.css b/webui/static/video/video-side.css
index f829da88..c19a937d 100644
--- a/webui/static/video/video-side.css
+++ b/webui/static/video/video-side.css
@@ -1754,7 +1754,7 @@ body[data-side="video"] #soulsync-toggle { display: none; }
 /* "Next up" with 2-3 episodes → diagonal split panels; hover one to expand it */
 .vcal-bb-multi { position: relative; display: flex; min-height: 306px; border-radius: 22px; overflow: hidden;
     border: 1px solid rgba(255, 255, 255, 0.08); box-shadow: 0 34px 90px rgba(0, 0, 0, 0.55); background: #08080c; }
-.vcal-bb-panel { --vcal-h: 230; position: relative; flex: 1 1 0; flex-grow: 1; min-width: 0; overflow: hidden;
+.vcal-bb-panel { --vcal-h: 230; position: relative; flex: 1 1 0; flex-grow: 1; min-width: 10%; overflow: hidden;
     display: flex; align-items: flex-end; cursor: pointer;
     clip-path: polygon(34px 0, 100% 0, calc(100% - 34px) 100%, 0 100%); margin-left: -34px;
     transition: flex-grow 0.55s cubic-bezier(0.22, 1, 0.36, 1); }
@@ -1785,7 +1785,7 @@ body[data-side="video"] #soulsync-toggle { display: none; }
     .vcal-bb-title { font-size: 30px; } .vcal-bb { min-height: 240px; }
     /* stack the diagonal panels vertically on narrow screens */
     .vcal-bb-multi { flex-direction: column; min-height: 0; }
-    .vcal-bb-panel, .vcal-bb-panel:first-child, .vcal-bb-panel:last-child { clip-path: none; margin-left: 0; min-height: 150px; }
+    .vcal-bb-panel, .vcal-bb-panel:first-child, .vcal-bb-panel:last-child { clip-path: none; margin-left: 0; min-width: 0; min-height: 150px; }
     .vcal-bb-panel--lead, .vcal-bb-multi:hover .vcal-bb-panel, .vcal-bb-multi .vcal-bb-panel:hover { flex-grow: 1; }
     .vcal-bb-panel .vcal-bb-sub, .vcal-bb-panel .vcal-bb-actions { opacity: 1; }
     .vcal-bb-multi:hover .vcal-bb-panel:not(:hover)::after { opacity: 0; }