/* ── Testing-environment banner ──
   Same rules as index.css's .testing-banner, duplicated here so every other
   report page can pull in just this one small stylesheet instead of all of
   index.css. Shown/hidden by shared/report-env-banner.js via the same
   `location.hostname.startsWith('testing.')` check used in index.js. */
    .testing-banner {
      background: var(--banner-testing-bg, #B3261E);
      color: var(--text-on-brand, #fff);
      text-align: center;
      font-weight: 700;
      letter-spacing: 0.02em;
      padding: 10px 14px;
      font-size: 0.85em;
      text-transform: uppercase;
    }

/* ── Local-environment banner ──
   Same rules as index.css's .local-banner. Deliberately a different color
   from .testing-banner above (amber vs. red) so the two read as distinct
   situations at a glance: shared testing infra (anyone could be looking at
   it) vs. your own local checkout (only you can see this). Shown/hidden by
   shared/report-env-banner.js via a localhost/127.0.0.1 hostname check. */
    .local-banner {
      background: var(--banner-local-bg, #FCEEDA);
      color: var(--banner-local-text, #A15C00);
      text-align: center;
      font-weight: 700;
      letter-spacing: 0.02em;
      padding: 10px 14px;
      font-size: 0.85em;
      text-transform: uppercase;
    }