/* M6 frozen design. Deviations are bugs.
   #0A0A0A bg · #E8E8E6 primary · #8A8A86 secondary · #1F1F1F hairlines
   status only: #4ADE80 / #F87171 · type scale 13/15/18/28 · tabular nums */

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  background: #0A0A0A;
  color: #E8E8E6;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 15px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

main { max-width: 640px; margin: 0 auto; padding: 56px 24px 40px; }

header { display: flex; align-items: center; gap: 10px; }
.wordmark { font-size: 15px; font-weight: 600; letter-spacing: 0.35em; }

.dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #8A8A86;
}
.dot.ok { background: #4ADE80; animation: breathe 3s ease-in-out infinite; }
.dot.bad { background: #F87171; animation: breathe 1.5s ease-in-out infinite; }
@keyframes breathe { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }

.silence { margin: 96px 0; }
.silence h1 { font-size: 28px; font-weight: 600; letter-spacing: -0.01em; }
.silence .sub { font-size: 13px; color: #8A8A86; margin-top: 12px; }

.noaccess { font-size: 13px; color: #8A8A86; margin: 96px 0; }

section { margin: 56px 0; }
.label {
  font-size: 13px; font-weight: 600; color: #8A8A86;
  text-transform: uppercase; letter-spacing: 0.18em;
  margin-bottom: 8px;
}
hr { border: 0; border-top: 1px solid #1F1F1F; margin-bottom: 16px; }

table.ledger { width: 100%; border-collapse: collapse; font-size: 13px; }
table.ledger td { padding: 6px 0; vertical-align: baseline; }
table.ledger .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; padding-left: 16px; }
table.ledger .verdict { color: #F87171; text-align: right; padding-left: 16px; letter-spacing: 0.08em; font-size: 13px; }
table.ledger .cause { color: #8A8A86; }
table.ledger .strategy { font-size: 15px; }
table.ledger tr + tr td { border-top: 1px solid #1F1F1F; }

.finding { font-size: 15px; color: #E8E8E6; max-width: 56ch; }

dl.instrument { font-size: 13px; }
dl.instrument div { display: flex; justify-content: space-between; padding: 6px 0; }
dl.instrument div + div { border-top: 1px solid #1F1F1F; }
dl.instrument dt { color: #8A8A86; }
dl.instrument dd { font-variant-numeric: tabular-nums; text-align: right; }

footer { margin-top: 96px; }
footer p { font-size: 13px; color: #8A8A86; margin-top: 12px; }

.hidden { display: none; }

@media (max-width: 400px) {
  main { padding: 40px 16px 32px; }
  .silence { margin: 72px 0; }
  .silence h1 { font-size: 28px; }
}