Merge claude/1

.sys-detail-loading and .sys-detail-empty are absolutely-positioned overlays
that JS shows/hides via the `hidden` attribute. Their .sys-detail-* rule sets
`display: flex`, an author declaration that overrides the UA
`[hidden] { display: none }` — so `el.hidden = true` never actually hid them.
Both the 'Loading history…' and 'No samples in this range yet' overlays stayed
painted on top of a fully-populated chart (overlapping into garbled text).

Add `.sys-detail-loading[hidden], .sys-detail-empty[hidden] { display: none }`
(higher specificity than the bare class) so the hidden attribute wins.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Signed-off-by: librelad <librelad@digitalangels.vip>

containers/libreportal/frontend/components/admin/core/css/admin.css

@@ -659,6 +659,11 @@ table.sys-apps tr:hover td { background: rgba(var(--text-rgb), 0.03); }
     pointer-events: none;
 }
 .sys-detail-empty { color: rgba(var(--text-rgb), 0.55); }
+/* The `display: flex` above is an author rule, so it beats the UA
+   `[hidden] { display: none }` — without this the JS `el.hidden = true` can't
+   hide these overlays and they stack on top of a populated graph. */
+.sys-detail-loading[hidden],
+.sys-detail-empty[hidden] { display: none; }
 
 .sys-detail-grid {
     stroke: rgba(var(--text-rgb), 0.07);