#viewRoot:has(.system-health-dashboard) .system-health-banner,
#viewRoot:has(.system-health-dashboard) .system-usage-card,
#viewRoot:has(.system-health-dashboard) .system-panel,
#viewRoot:has(.system-health-dashboard) .system-accounts {
  color: #edf3fc;
  background: linear-gradient(145deg, #111d30, #17263b 58%, #1b3047);
  border: 1px solid #ffffff17;
  box-shadow: 0 8px 25px #08132328;
}
.system-health-banner { display:flex;align-items:center;gap:16px;padding:18px 22px;margin:18px 0; }
.system-health-mark { display:grid;place-items:center;width:48px;height:48px;flex:0 0 auto;border-radius:15px;background:#123b32;color:#52e0a0; }
.system-health-mark .icon { width:25px;height:25px; }
.system-health-mark.attention { background:#44351a;color:#ffd166; }
.system-health-mark.offline { background:#47242a;color:#ff858d; }
.system-health-copy { display:grid;gap:3px;min-width:0; }
.system-health-copy>span,.system-health-copy small { color:#a8bad1;font-size:12px; }
.system-health-copy strong { color:#f5f8ff;font-size:20px; }
.system-health-pulse { width:10px;height:10px;margin-inline-start:auto;border-radius:50%;background:#45d99a;box-shadow:0 0 0 5px #45d99a20; }
.system-health-pulse.attention { background:#ffc857;box-shadow:0 0 0 5px #ffc85720; }
.system-health-pulse.offline { background:#ff737d;box-shadow:0 0 0 5px #ff737d20; }
.system-usage-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px; }
.system-usage-card { min-width:0;padding:19px; }
.system-card-top { display:flex;align-items:center;justify-content:space-between;gap:8px; }
.system-card-icon { display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#29405c;color:#82c9ff; }
.system-card-icon .icon { width:20px;height:20px; }
.system-card-icon.red { color:#ff858d;background:#472931; }
.system-card-icon.blue { color:#81caff;background:#203d5d; }
.system-card-icon.green { color:#58dda6;background:#173c37; }
.system-card-icon.amber { color:#ffd166;background:#44391f; }
.system-usage-tag,.system-sample-count { color:#9db1ca;font-size:11px;font-weight:700; }
.system-usage-card h4 { margin:16px 0 2px;color:#b6c6db;font-size:13px; }
.system-usage-card>strong { display:block;color:#f4f7fc;font-size:30px;letter-spacing:-.04em; }
.system-usage-card>p { min-height:18px;margin:5px 0 13px;color:#9fb2ca;font-size:11px;line-height:1.5; }
.system-progress { height:6px;overflow:hidden;border-radius:99px;background:#ffffff17; }
.system-progress span { display:block;height:100%;border-radius:inherit;background:#71bfff;transition:width .4s ease; }
.system-progress.red span { background:#ff6674; }
.system-progress.green span { background:#4bd59c; }
.system-progress.amber span { background:#ffc857; }
.system-lower-grid { display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:14px;margin-top:14px; }
.system-panel { min-width:0;padding:18px 20px; }
.system-panel .card-header { padding:0 0 12px;border-bottom:1px solid #ffffff16; }
.system-panel .card-header h4 { color:#f1f5fc; }
.system-panel .card-header p { color:#a8bad1; }
.system-chart-legend { display:flex;gap:16px;margin:14px 0 7px;color:#c0cfe1;font-size:11px; }
.system-chart-legend span { display:flex;align-items:center;gap:6px; }
.system-chart-legend i { width:8px;height:8px;border-radius:50%;background:#ff6877; }
.system-chart-legend .memory-key { background:#62c6ff; }
.system-sparkline { display:block;width:100%;height:176px;overflow:visible; }
.system-chart-grid { fill:none;stroke:#ffffff19;stroke-width:.7; }
.system-sparkline polyline { fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke; }
.system-sparkline .cpu-line { stroke:#ff6877; }
.system-sparkline .memory-line { stroke:#62c6ff; }
.system-chart-empty { display:grid;place-items:center;height:176px;color:#9db1ca;font-size:12px; }
.system-service-list { display:grid; }
.system-service-list>div { display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid #ffffff12; }
.system-service-list>div:last-child { border-bottom:0; }
.system-service-list span { color:#a8bad1;font-size:12px; }
.system-service-list strong { color:#f1f5fc;font-size:12px;text-align:end; }
.system-accounts { margin-top:14px;padding:18px 20px; }
.system-account-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:14px; }
.system-account-grid>div { display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 14px;border:1px solid #ffffff14;border-radius:11px;background:#ffffff08; }
.system-account-grid span { color:#b5c7dd;font-size:12px; }
.system-account-grid strong { color:#f5f8ff;font-size:20px; }
.system-warning,.system-error { display:flex;align-items:center;gap:10px;margin:12px 0;padding:12px 15px;color:#ffe3a1;background:#362d1b;border:1px solid #9b762f; }
.system-warning .icon { width:18px;height:18px;flex:0 0 auto; }
.system-error { flex-wrap:wrap;color:#ffd4d7;background:#39232a;border-color:#81424c; }
.system-error>span { flex:1 1 100%;font-size:12px; }
.system-error .btn { margin-inline-start:auto; }
.system-health-dashboard .system-sample-count { white-space:nowrap; }
html[data-theme="light"] #viewRoot:has(.system-health-dashboard) :is(.system-health-banner,.system-usage-card,.system-panel,.system-accounts) { color:#172235!important;background:linear-gradient(145deg,#fff,#f3f7fb)!important;border-color:#dce5ed!important; }
html[data-theme="light"] #viewRoot:has(.system-health-dashboard) :is(.system-health-copy>strong,.system-usage-card>strong,.system-usage-card h4,.system-panel .card-header h4,.system-service-list strong,.system-account-grid strong) { color:#172235!important; }
html[data-theme="light"] #viewRoot:has(.system-health-dashboard) :is(.system-health-copy>span,.system-health-copy small,.system-usage-card>p,.system-panel .card-header p,.system-service-list span,.system-account-grid span,.system-chart-legend,.system-sample-count) { color:#607188!important; }
html[data-theme="light"] #viewRoot:has(.system-health-dashboard) .system-account-grid>div { background:#edf3f8!important;border-color:#dce5ed!important; }
@media(max-width:1000px) { .system-usage-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .system-lower-grid { grid-template-columns:1fr; } }
@media(max-width:600px) { .system-health-banner { padding:15px; } .system-usage-grid { gap:9px; } .system-usage-card { padding:14px; } .system-usage-card>strong { font-size:25px; } .system-usage-card>p { font-size:10px; } .system-account-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .system-panel { padding:15px; } .system-sparkline,.system-chart-empty { height:145px; } }
@media(prefers-reduced-motion:reduce) { .system-progress span { transition:none; } }
