Monitor: hold the System card to the Network card's height below eight columns, where the two stop sharing a row

Plugin/unraid/css/varaverk.css

@@ -235,28 +235,26 @@ body.vv-fullscreen #displaybox { padding-left: 1rem !important; padding-top: .5r
 /* Hide scrollbars on any nested scrollable div inside monitor cards */
 #vv-monitor .vv-card div::-webkit-scrollbar { display: none; }
 
-/* System card: the Varaverk half is bounded, the host half is not.
-   This card is the one with no <h3>, so the header/body split that gives every other card a
-   fixed part and a scrolling part had to be made inside its body. The cut is after Version:
-   hostname, clock, model, array state, uptime, load and version are what the card is for and
-   are left to size themselves, and only the block below them is capped.
+/* System card, held to the Network card's height.
+   At eight columns these two share a row (system 1 + ups 1 + cpu 2 + memory 2 + network 2), so
+   the grid already stretches them to the same height and nothing here is needed. Below eight the
+   board re-cuts into rows of four: System lands in row 1 with UPS and CPU, Network in row 2 with
+   Memory, and once rows are sized to content (vv_mon_rung_overflows) the two are free to differ.
+   System is the taller — it carries a host block and a Varaverk block — so it is the one capped.
 
-   A plain max-height, not flex:1 on the capped half. Under flex the strip is sized by what the
-   block above leaves over, and on a 1080p row (177px against a ~190px host half) that remainder
-   is negative: the strip collapses to nothing and the Varaverk figures vanish with no scrollbar
-   to say so. A fixed cap cannot do that — the block is 64px wherever it lands, and where the card
-   is shorter than the two halves together the body's own scroll (inherited above) reaches the rest.
+   222px is Network measured rather than guessed: 2 border + 24 padding + 25 h3 + 61 header block
+   + 110 canvas. The canvas is a fixed 110px, which is what makes the number worth writing down —
+   most of Network's height cannot drift. What can is the IP list (LAN/EXT/TS), roughly 18px a row,
+   so a host resolving fewer of the three leaves System slightly tall against it.
 
-   64px is the label and about three rows of the Varaverk grid, so Cache, Data and Jobs read
-   without scrolling. It also holds the card to ~254px, which is what stops it dragging its row
-   down below eight columns, where rows are sized to content (see vv_mon_rung_overflows). */
-#vv-system-body .vv-sys-scroll {
-  max-height: 64px;
-  overflow-y: auto;
-  -ms-overflow-style: none;
-  scrollbar-width: none;
+   Two ids on the selectors, to outrank #vv-monitor .vv-card from the auto-rows hatch above. That
+   hatch lifts overflow off every card so content-sized rows can work; this card is the one place
+   the clamps have to go back on, or a max-height with overflow:visible would draw straight
+   through the card's own border. */
+@media (max-width: 1383px), (max-height: 700px) {
+  #vv-monitor #vv-system { max-height: 222px; overflow: hidden; }
+  #vv-monitor #vv-system > div { overflow-y: auto; min-height: 0; }
 }
-#vv-system-body .vv-sys-scroll::-webkit-scrollbar { display: none; }
 
 /* Dynamic row heights capped per screen tier — rows size to content, never exceed the cap.
    minmax(0, Xpx): track is content-driven but capped; align-items:stretch makes all cards

Plugin/unraid/pages/monitor.php

@@ -1082,7 +1082,7 @@ function vvPollMonitor(live) {
 
          <!-- Varaverk's own figures, ruled off from the host's. Same grid so the labels line up,
               separate block so it reads as a different subject rather than more of the same. -->
-         <div class="vv-sys-scroll" style="border-top:1px solid #1e1e1e;margin-top:8px;padding-top:7px;">
+         <div style="border-top:1px solid #1e1e1e;margin-top:8px;padding-top:7px;">
            <div style="font-size:9px;color:#333;text-transform:uppercase;letter-spacing:.07em;margin-bottom:5px;">Varaverk</div>
            <div style="display:grid;grid-template-columns:auto 1fr;gap:3px 8px;font-size:11px;">
              <span style="color:#444;">Cache</span>   <span style="color:${_cacheColor};">${_cacheStr}</span>