/* ========================================================================== */
/* DARK MODE → SYSTEM — SHELL & OVERVIEW CARDS                                */
/* ========================================================================== */

body.dark-mode .system-status-hint         { color: rgba(255, 255, 255, 0.60); }
body.dark-mode .system-card h3             { color: rgba(255, 255, 255, 0.68); }

/* ── stat card labels ── */
body.dark-mode .stat-label { color: rgba(255, 255, 255, 0.50); }

/* ── stat card progress bar track ── */
body.dark-mode .stat-bar { background: rgba(255, 255, 255, 0.08); }

/* ── dynamic metric coloring — neutral default, gradient on hover ── */
body.dark-mode .stat-card:not(.stat-idle) {
    border-top-color: rgba(255, 255, 255, 0.12);
}

body.dark-mode .stat-card:not(.stat-idle):hover {
    border-top-color: hsl(calc(120 - var(--metric-pct, 0) * 1.2), 72%, 52%);
}

body.dark-mode .stat-idle {
    border-top-color: rgba(255, 255, 255, 0.12);
}

body.dark-mode .stat-card .stat-fill {
    background: hsl(calc(120 - var(--metric-pct, 0) * 1.2), 72%, 52%);
}

body.dark-mode .stat-card .stat-value {
    color: hsl(calc(120 - var(--metric-pct, 0) * 1.2), 78%, 68%);
}

/* ── section heading icon tint ── */
body.dark-mode .stat-icon           { color: rgba(255, 255, 255, 0.30); }
body.dark-mode .section-header-icon { color: #7ba8f5; }