Fit the rendition to the panel it plays in

Four panels stutter, and the reason isn't scheduling: a quarter-screen
panel was still being handed a full-screen stream. Decoding 1080p into a
quarter of the screen costs exactly what decoding it full size costs, and
four of those at once is past what most GPUs will decode in hardware --
after which it falls back to software and the wheels come off.

So a split panel now caps by its own height in device pixels, rounded up
to the next standard rendition, and hls.js is told the same thing through
capLevelToPlayerSize since an adaptive stream picks its own. Four panels
on a 1080p screen land near 480p each: roughly a quarter of the pixels to
decode. Its buffers shrink too -- several instances each holding a minute
of video is memory and demuxing for footage nobody has reached.

The preloaded step keeps its guarantee but gets cheaper with it: those
panes use preload=metadata rather than auto, so every panel still has its
next video ready to start instantly without four more streams competing
for bandwidth with the four being watched.

The floors that make that preload guarantee hold -- one step, in both
windowBounds and preloadAhead -- now say so. Both are divided by the pane
count, and dropping either below one would leave a panel with nothing
buffered to swipe to.

Two tests. tests/unit_formats.js runs the rendition maths in node with no
browser, server or network, in under a second: picking a format is a list
in and a URL out, and it is the cheapest thing in the repo to assert.
tests/smoke_reels.py covers the panels themselves -- splitting, nesting,
controls staying inside short panes, one swipe advancing every panel,
per-panel audio surviving re-activation, and the preload guarantee.

What none of this establishes is whether four streams now play smoothly
on real hardware. Headless Chromium has no GPU decode, so it cannot say.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01QBDkEXP4htyXTCZUwMLphd

frontend/js/videos.js

@@ -2003,6 +2003,14 @@ App.videos = App.videos || {};
         if (applyPreferredQuality) {
             const preferredQuality = App.storage.getPreferredQuality();
             preferredHeight = preferredQuality === 'auto' ? null : App.videos.coerceNumber(preferredQuality);
+            // A caller showing this in a fraction of the screen -- a split reels
+            // panel -- caps it further. Decoding a 1080p stream into a quarter
+            // of a phone screen costs the same as decoding it full size, and
+            // four of those at once is what makes a split view stutter.
+            const maxHeight = App.videos.coerceNumber(options && options.maxHeight);
+            if (maxHeight > 0) {
+                preferredHeight = preferredHeight ? Math.min(preferredHeight, maxHeight) : maxHeight;
+            }
         }
 
         const sources = App.videos.rankFormats(meta.formats, preferredHeight).map((fmt) => {