:root {
            --bg:        #121416;
            --surface-1: #1a1d21;
            --surface-2: #22252a;
            --surface-3: #2a2e34;
            --text:      #e5e7eb;
            --muted:     #9aa0a6;
            --border:    #2a2e34;
            --blue:      #3b82f6;
            --green:     #10b981;
            --purple:    #8b5cf6;
            --amber:     #f59e0b;
            --red:       #ef4444;
            --cyan:      #06b6d4;
        }

        * { box-sizing: border-box; }

        body {
            background: var(--bg);
            color: var(--text);
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            min-height: 100vh;
            padding: 20px;
        }

        /* ── Buttons ── */
        .btn { font-size: .8rem; }
        .btn-primary   { background: #2563eb; border-color: #1d4ed8; color: #fff; }
        .btn-secondary { background: #374151; border-color: #2d3748; color: var(--text); }
        .btn-outline-light { border-color: var(--border); color: var(--text); background: transparent; }
        .btn-outline-light:hover { background: var(--surface-2); color: var(--text); }
        .btn:hover { opacity: .9; }

        /* ── Section wrappers ── */
        .section-wrap {
            background: var(--surface-1);
            border: 1px solid var(--border);
            border-radius: 10px;
            overflow: hidden;
            margin-bottom: 24px;
        }
        .section-header {
            display: flex; align-items: center; gap: 10px;
            padding: 12px 16px;
            font-size: .88rem; font-weight: 700; letter-spacing: .02em;
            background: var(--surface-2);
            border-bottom: 1px solid var(--border);
        }
        .section-body { padding: 0; }

        /* ── Tables ── */
        .data-table { width: 100%; font-size: .78rem; border-collapse: collapse; }
        .data-table th {
            background: var(--surface-3); color: var(--muted);
            padding: 7px 12px; text-align: left;
            font-size: .67rem; text-transform: uppercase; letter-spacing: .05em;
            border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 1;
        }
        .data-table td {
            padding: 6px 12px;
            border-bottom: 1px solid rgba(42,46,52,.7);
            color: var(--text); vertical-align: middle;
        }
        .data-table tbody tr:last-child td { border-bottom: none; }
        .data-table tbody tr:hover { background: rgba(255,255,255,.03); cursor: pointer; }
        .row-failed { background: rgba(239,68,68,.07) !important; }
        .row-notable { background: rgba(245,158,11,.07) !important; }

        /* ── Expandable detail panel ── */
        .detail-row td { padding: 0 !important; background: var(--surface-2); }
        .detail-panel {
            padding: 16px;
            border-top: 1px solid var(--border);
        }

        /* ── KPI stat cards ── */
        .kpi-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
            gap: 10px;
            margin-bottom: 16px;
        }
        .kpi-card {
            background: var(--surface-3);
            border-radius: 8px;
            padding: 14px 12px;
            text-align: center;
        }
        .kpi-value { font-size: 1.6rem; font-weight: 800; line-height: 1; margin-bottom: 4px; }
        .kpi-label { font-size: .67rem; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }

        /* ── Chart cards ── */
        .chart-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
            gap: 12px;
            margin-bottom: 16px;
        }
        .chart-card {
            background: var(--surface-3);
            border: 1px solid var(--border);
            border-radius: 8px;
            padding: 12px;
        }
        .chart-card-title {
            font-size: .68rem; font-weight: 700;
            text-transform: uppercase; letter-spacing: .06em;
            color: var(--muted); margin-bottom: 10px;
        }

        /* ── Delta indicators ── */
        .delta-up   { color: var(--green); }
        .delta-down { color: var(--red); }
        .delta-zero { color: var(--muted); }

        /* ── Notable change badges ── */
        .badge-notable {
            display: inline-block;
            font-size: .62rem; padding: 2px 6px; border-radius: 4px; font-weight: 600;
            background: rgba(245,158,11,.15); color: #fcd34d;
            border: 1px solid rgba(245,158,11,.3);
            margin: 1px 2px;
        }
        .badge-fail {
            background: rgba(239,68,68,.15); color: #fca5a5;
            border: 1px solid rgba(239,68,68,.3);
        }

        /* ── Report cards ── */
        .report-card {
            background: var(--surface-2);
            border: 1px solid var(--border);
            border-radius: 8px;
            padding: 14px 16px;
            margin-bottom: 10px;
            cursor: pointer;
            transition: border-color .15s;
        }
        .report-card:hover { border-color: var(--blue); }
        .report-card-title { font-size: .88rem; font-weight: 700; margin-bottom: 4px; }
        .report-card-meta { font-size: .73rem; color: var(--muted); }
        .report-detail { margin-top: 12px; display: none; }

        /* ── States ── */
        .loading-wrap {
            display: flex; align-items: center; justify-content: center;
            min-height: 160px; gap: 12px;
            color: var(--muted); font-size: .88rem;
        }
        .empty-state {
            text-align: center; padding: 40px 20px;
            color: var(--muted); font-size: .85rem;
        }
        .empty-state .icon { font-size: 2.4rem; margin-bottom: 10px; }

        /* ── Back link ── */
        .back-link { font-size: .8rem; color: var(--muted); text-decoration: none; }
        .back-link:hover { color: var(--text); }

        .hidden { display: none !important; }
        .font-mono { font-family: monospace; font-size: .78rem; }

        /* ── Filter bar ── */
        .filter-bar {
            display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px;
            padding: 12px 16px;
            background: var(--surface-2);
            border-bottom: 1px solid var(--border);
        }
        .filter-group { display: flex; flex-direction: column; gap: 3px; }
        .filter-group label {
            font-size: .62rem; text-transform: uppercase; letter-spacing: .05em;
            color: var(--muted); font-weight: 600;
        }
        .filter-input {
            background: var(--surface-3); border: 1px solid var(--border);
            color: var(--text); border-radius: 5px; padding: 4px 8px;
            font-size: .76rem; outline: none;
        }
        .filter-input:focus { border-color: var(--blue); }
        .filter-input::placeholder { color: rgba(154,160,166,.6); }
        select.filter-input { padding-right: 20px; cursor: pointer; }
        .filter-check {
            display: flex; align-items: center; gap: 5px;
            font-size: .76rem; cursor: pointer; padding: 4px 0;
            color: var(--text); user-select: none;
        }
        .filter-check input[type="checkbox"] {
            accent-color: var(--blue); width: 14px; height: 14px; cursor: pointer;
        }
        .filter-count {
            font-size: .72rem; color: var(--muted); padding: 6px 0;
            align-self: flex-end;
        }
        .filter-reset {
            font-size: .7rem; color: var(--blue); cursor: pointer; border: none;
            background: none; padding: 4px 0; align-self: flex-end; text-decoration: underline;
        }
        .filter-reset:hover { color: var(--text); }

        /* ── Tabs ── */
        .nav-tabs {
            border-bottom: 1px solid var(--border);
        }
        .nav-tabs .nav-link {
            color: var(--muted);
            background: transparent;
            border: 1px solid transparent;
            border-bottom: none;
            border-radius: 6px 6px 0 0;
            padding: 8px 18px;
        }
        .nav-tabs .nav-link:hover {
            color: var(--text);
            border-color: var(--border) var(--border) transparent;
            background: var(--surface-2);
        }
        .nav-tabs .nav-link.active {
            color: var(--text);
            background: var(--surface-1);
            border-color: var(--border) var(--border) var(--surface-1);
        }

/* Extracted inline styles */
.pulse-stats-dashboard-inline-1 { font-size:1.5rem;font-weight:700; }
.pulse-stats-dashboard-inline-2 { color:var(--muted);font-size:.8rem;margin-bottom:1.5rem; }
.pulse-stats-dashboard-inline-3 { color:#93c5fd;background:rgba(59,130,246,.1);padding:1px 5px;border-radius:3px; }
.pulse-stats-dashboard-inline-4 { border-bottom-color:var(--border); }
.pulse-stats-dashboard-inline-5 { font-size:.82rem;font-weight:600; }
.pulse-stats-dashboard-inline-6 { color:var(--muted);font-weight:400;font-size:.75rem;margin-left:4px; }
.pulse-stats-dashboard-inline-7 { border-top-left-radius:0;border-top-right-radius:0;margin-top:0;border-top:none; }
.pulse-stats-dashboard-inline-8 { justify-content:flex-end; }
.pulse-stats-dashboard-inline-9 { width:160px; }
.pulse-stats-dashboard-inline-10 { min-width:90px; }
.pulse-stats-dashboard-inline-11 { display:flex;gap:4px; }
.pulse-stats-dashboard-inline-12 { width:50px; }
.pulse-stats-dashboard-inline-13 { width:80px; }
.pulse-stats-dashboard-inline-14 { display:none; }
.pulse-stats-dashboard-inline-15 { overflow-x:auto; }
.pulse-stats-dashboard-inline-16 { width:24px; }
.pulse-stats-dashboard-inline-17 { padding:16px; }