:root {
  color-scheme: dark;
  font: 16px/1.5 "Segoe UI", system-ui, sans-serif;
  background: #06151E;
  color: #E8EDF2;
}

body {
  width: min(100% - 2rem, 48rem);
  margin: 0 auto;
  padding: max(1rem, env(safe-area-inset-top)) 0 max(2rem, env(safe-area-inset-bottom));
  background: #06151E;
}

h1 { margin: .4rem 0; font-size: 1.6rem; letter-spacing: -.02em; }
p { margin: .4rem 0 1rem; color: #AAB4C0; }
#summary { padding: .85rem 1rem; border: 1px solid #2A3442; background: #1A212B; font-weight: 650; }
#results { margin: 1rem 0; padding: 0; list-style: none; }
#results li { padding: .75rem 0; border-top: 1px solid #2A3442; overflow-wrap: anywhere; }
.label { display: block; font-weight: 650; }
.detail { color: #AAB4C0; font-size: .92rem; }
.pending { color: #F0BD73; }
.pass { color: #83C8A1; }
.fail { color: #F0988D; }
button { min-height: 44px; padding: .5rem 1rem; border: 1px solid #0E6687; background: #0A4A63; color: #fff; font: inherit; font-weight: 650; }
button:focus-visible, a:focus-visible { outline: 3px solid #83BDD2; outline-offset: 3px; }
a { color: #8ABBD2; }
.static-fallback { padding: .85rem 1rem; border: 1px solid #2A3442; background: #1A212B; }