:root { color-scheme: dark; font-family: system-ui, sans-serif; }
  body { margin: 0; background: #07101a; color: #eef6fa; }
  header { padding: 24px clamp(16px,4vw,56px); border-bottom: 1px solid #203647; }
  h1 { margin: 0 0 6px; font-size: clamp(24px,4vw,42px); }
  .accent { color: #53c3f3; } .muted { color: #91a7b5; }
  main { padding: 24px clamp(16px,4vw,56px); }
  h2 { margin: 28px 0 12px; font-size: 20px; }
  .status { display: flex; gap: 18px; flex-wrap: wrap; margin-bottom: 20px; }
  .filter { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 20px; }
  select { max-width: 100%; min-width: min(520px,100%); padding: 10px 12px; color: #eef6fa; background: #0d1b27; border: 1px solid #31536a; border-radius: 8px; }
  .card { background: #0d1b27; border: 1px solid #203647; border-radius: 10px; padding: 14px 18px; }
  .value { font-size: 26px; font-weight: 700; color: #53c3f3; }
  table { width: 100%; border-collapse: collapse; background: #0d1b27; font-size: 14px; }
  th, td { text-align: left; padding: 10px; border-bottom: 1px solid #203647; vertical-align: top; }
  th { position: sticky; top: 0; background: #122534; color: #88d7f8; }
  code { white-space: pre-wrap; overflow-wrap: anywhere; color: #cbd8df; }
  .headshot { color: #ffb454; font-weight: 700; }
  .error { color: #ff8b7c; } .wrap { overflow-x: auto; border-radius: 10px; }

.site-nav { display: flex; gap: 8px; margin-top: 20px; }
.site-nav a { color: #b8ccd8; text-decoration: none; padding: 9px 16px; border-radius: 7px; }
.site-nav a:hover { background: #142b3d; color: #fff; }
.site-nav a[aria-current="page"] { color: #68cfff; background: #143044; }
.site-nav a:focus-visible { outline: 2px solid #68cfff; outline-offset: 2px; }