:root { color-scheme: light dark; }
body { font: 16px/1.6 system-ui, -apple-system, sans-serif; margin: 0; }
main { max-width: 44rem; margin: 2rem auto; padding: 0 1rem 4rem; }
h1 { font-size: 1.4rem; }
h2 { font-size: 1.05rem; margin-top: 2rem; }
.lede { color: #555; }
table { border-collapse: collapse; width: 100%; margin: 1.2rem 0; }
td, th { text-align: left; padding: .45rem .6rem; border-bottom: 1px solid #ddd; vertical-align: top; }
th { width: 42%; font-weight: 600; }
code { background: #f4f4f4; padding: .1rem .3rem; border-radius: 3px; word-break: break-all; }
.verdict { padding: .9rem 1rem; border-radius: 6px; font-weight: 600; margin: 1.2rem 0; }
.pass { background: #e6f5ec; color: #0a5c30; }
.fail { background: #fdeaec; color: #8c0018; }
.wait { background: #fff6e5; color: #7a4b00; }
.info { background: #eef2f8; color: #24405e; }
.ok { color: #0a5c30; font-weight: 600; }
.no { color: #8c0018; font-weight: 600; }
button { font: inherit; padding: .55rem 1rem; border-radius: 6px; border: 1px solid #24405e;
         background: #24405e; color: #fff; cursor: pointer; }
button.secondary { background: transparent; color: #24405e; }
.ua { color: #666; font-size: .9rem; margin-top: 2rem; }
@media (prefers-color-scheme: dark) {
  body { background: #14171a; color: #e6e6e6; }
  .lede, .ua { color: #a8a8a8; }
  td, th { border-bottom-color: #333; }
  code { background: #22262b; }
  .pass { background: #12301f; color: #7fd6a2; }
  .fail { background: #3a1418; color: #ff9aa6; }
  .wait { background: #3a2c10; color: #f0c674; }
  .info { background: #1c2531; color: #9db9dd; }
  .ok { color: #7fd6a2; } .no { color: #ff9aa6; }
  button { border-color: #9db9dd; background: #9db9dd; color: #14171a; }
  button.secondary { background: transparent; color: #9db9dd; }
}