diff --git a/frontend/src/app.ts b/frontend/src/app.ts
index f4eafc06d4e7e43515951c90ccac6709a96e7f25..2ce37b836454d204fe05d1dc9591d94c2b17f68f 100644
--- a/frontend/src/app.ts
+++ b/frontend/src/app.ts
@@ -42,7 +42,7 @@
 // ---- Constants ------------------------------------------------------------
 
 const LAYOUT_KEY = "compare.layout";
-const DEFAULT_LAYOUT: Layout = "stacked";
+const DEFAULT_LAYOUT: Layout = "split";
 
 // Auto light/dark: FileDiff selects the entry matching `themeType`. With
 // themeType "system" it follows prefers-color-scheme at runtime.
@@ -228,7 +228,22 @@       section?.scrollIntoView({ behavior: "smooth", block: "start" });
     },
   });
   tree.render({ containerWrapper: root });
+  sizeTreeRoot(root);
   return tree;
+}
+
+// The @pierre/trees FileTree virtualizes its rows into a scroll viewport, so the
+// mount needs a *definite* height or it collapses to zero and renders nothing
+// (its README sets `mount.style.height` for exactly this reason — the inner
+// container flexes to fill the mount, so a mount of height 0 shows nothing). We
+// give it a full-height panel (capped to the viewport); a long tree scrolls
+// within it, matching a classic file-tree sidebar. Re-runs on window resize.
+function sizeTreeRoot(root: HTMLElement): void {
+  const apply = () => {
+    root.style.height = `${Math.max(160, window.innerHeight - 24)}px`;
+  };
+  apply();
+  window.addEventListener("resize", apply);
 }
 
 function wireLayoutToggle(
diff --git a/web/chrome.go b/web/chrome.go
index f1d14abc320969712e57805fc77f066b4ae6134c..22e70dc8f24b0ef3d9fd3e4eaaf3dfcc9a0c6995 100644
--- a/web/chrome.go
+++ b/web/chrome.go
@@ -6,8 +6,8 @@ 	"net/url"
 	"sort"
 	"strings"
 
-	"sourcecraft.dev/bigbes/sr-ht-core/config"
 	"github.com/vaughan0/go-ini"
+	"sourcecraft.dev/bigbes/sr-ht-core/config"
 
 	"sourcecraft.dev/bigbes/sr-ht-compare/authz"
 )
@@ -87,6 +87,11 @@ 	CSSHref     string
 	Environment string
 	ShowBanner  bool
 
+	// ContainerClass selects the width of the page's content wrapper: the
+	// centered Bootstrap "container" by default, or "container-fluid" for the
+	// full-bleed diff views (commit / compare).
+	ContainerClass string
+
 	Data any
 }
 
@@ -106,16 +111,17 @@ 		profileURL = s.hubOrigin + "/~" + username
 	}
 
 	return viewData{
-		SiteName:    s.siteName,
-		HubOrigin:   s.hubOrigin,
-		Nav:         s.nav,
-		Username:    username,
-		LoginURL:    loginURL,
-		LogoutURL:   logoutURL,
-		RegisterURL: s.metaOrigin,
-		ProfileURL:  profileURL,
-		CSSHref:     s.cssHref,
-		Environment: strings.ToUpper(s.environment),
-		ShowBanner:  s.environment != "" && s.environment != "production",
+		ContainerClass: "container",
+		SiteName:       s.siteName,
+		HubOrigin:      s.hubOrigin,
+		Nav:            s.nav,
+		Username:       username,
+		LoginURL:       loginURL,
+		LogoutURL:      logoutURL,
+		RegisterURL:    s.metaOrigin,
+		ProfileURL:     profileURL,
+		CSSHref:        s.cssHref,
+		Environment:    strings.ToUpper(s.environment),
+		ShowBanner:     s.environment != "" && s.environment != "production",
 	}
 }
diff --git a/web/handlers.go b/web/handlers.go
index 1afe769a7601a9a8edf553071f17668291e24753..19708bbe6e03b4a490542faf82d70d493c377d20 100644
--- a/web/handlers.go
+++ b/web/handlers.go
@@ -312,6 +312,7 @@ 		return
 	}
 
 	vd := s.chrome(r)
+	vd.ContainerClass = "container-fluid"
 	vd.Title = fmt.Sprintf("~%s/%s: %s...%s", owner, repo, spec.Base, spec.Head)
 	vd.Data = compareView{
 		Owner:      owner,
@@ -404,6 +405,7 @@ 		return
 	}
 
 	vd := s.chrome(r)
+	vd.ContainerClass = "container-fluid"
 	vd.Title = fmt.Sprintf("~%s/%s: %s", owner, repo, ci.ShortSHA)
 	vd.Data = commitView{
 		Owner:     owner,