From 89d6219e95e09df9514049a383e0259111145b4e Mon Sep 17 00:00:00 2001
From: Gmer4Lfe <gmer4lfe@gmail.com>
Date: Tue, 4 Aug 2026 17:44:30 -0400
Subject: [PATCH] Align the System checks card with the third banner stat

---
 Plugin/unraid/pages/ai.php | 19 ++++++++++++++++++-
 1 file changed, 18 insertions(+), 1 deletion(-)

diff --git a/Plugin/unraid/pages/ai.php b/Plugin/unraid/pages/ai.php
index 264e4a1..48a17ec 100644
--- a/Plugin/unraid/pages/ai.php
+++ b/Plugin/unraid/pages/ai.php
@@ -133,7 +133,11 @@ if (is_dir('/var/log/varaverk')) {
 .vv-ai-meta  { font-size:10px; color:#333; margin-top:6px; font-family:monospace; }
 
 /* ── Health + loaded models ─────────────────────────────────────────────── */
-.vv-ai-diag { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:#1a1a1a;
+/* The split lines the System checks card up with the right edge of the third banner stat.
+   Both rows carry a 1px border and a 1px gap, so their track origins coincide and the
+   fractions match exactly. The default suits the usual five stats; renderBanner() overrides
+   --vv-diag-split when the banner renders a different number. */
+.vv-ai-diag { display:grid; grid-template-columns:var(--vv-diag-split,3fr 2fr); gap:1px; background:#1a1a1a;
               border:1px solid #262626; border-radius:6px; overflow:hidden; }
 @media (max-width:900px) { .vv-ai-diag { grid-template-columns:1fr; } }
 .vv-ai-diag-col { background:#0e0e0e; padding:9px 12px; }
@@ -338,6 +342,19 @@ if (is_dir('/var/log/varaverk')) {
                    rt.gpu.name + ' · ' + rt.gpu.util + '% util');
     }
     $('vv-ai-banner').innerHTML = html;
+
+    // Keep the diag row's split on the third stat's edge. The stat count is not fixed — VRAM
+    // needs a readable GPU, Built needs an index, and an unreachable Ollama collapses the first
+    // two into one — so it is read off what actually rendered rather than assumed.
+    //
+    // Written as a custom property, never as grid-template-columns: an inline value would
+    // outrank the 900px media query that collapses this row to a single column. Below four
+    // stats there is no third edge to meet, so it falls back to the default.
+    const diag = document.querySelector('.vv-ai-diag');
+    const nStat = $('vv-ai-banner').children.length;
+    if (diag) diag.style.setProperty('--vv-diag-split',
+                                     nStat > 3 ? `3fr ${nStat - 3}fr` : '3fr 2fr');
+
     renderHealth(s.health || []);
     renderModels(s.loaded, s.model);
   }