/* Plain CSS, no build step, no framework. Issue #22.
 *
 * `.nodata` IS STYLED AS TEXT AND NOT AS A NUMBER, deliberately. A greyed-out
 * dash in a numeric column reads as zero at a glance, and gate G2 is the rule
 * that silence must never render as safety. */

:root {
  --ink: #1a1a1a;
  --paper: #fdfdfc;
  --rule: #d8d5cf;
  --quiet: #6b6660;
  --warn: #8a4b00;
  --warn-bg: #fdf3e6;
  --err: #8a1c1c;
  --err-bg: #fbeaea;
  color-scheme: light dark;
}

body {
  margin: 0;
  font: 15px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--paper);
}

#bar {
  display: flex;
  gap: 1rem;
  align-items: center;
  padding: 0.75rem 1.25rem;
  border-bottom: 1px solid var(--rule);
}

#brand { font-weight: 600; letter-spacing: 0.02em; }
#who { color: var(--quiet); margin-left: auto; }

main { padding: 1.25rem; max-width: 62rem; }
h1 { font-size: 1.3rem; }
h2 { font-size: 1.1rem; margin-top: 2rem; }

#banner {
  padding: 0.75rem 1rem;
  border-left: 3px solid var(--warn);
  background: var(--warn-bg);
  margin-bottom: 1.25rem;
}
#banner.error { border-color: var(--err); background: var(--err-bg); }

table { border-collapse: collapse; width: 100%; }
th, td {
  text-align: left;
  padding: 0.4rem 0.6rem;
  border-bottom: 1px solid var(--rule);
  vertical-align: top;
}
th { font-weight: 600; color: var(--quiet); font-size: 0.85rem; }

/* Not a dash, not a grey zero. Words, in the same weight as the rest, so a
 * reader scanning the column sees an absence of data rather than a low
 * number. */
td.nodata {
  font-style: italic;
  color: var(--warn);
  font-variant-numeric: normal;
}

tr[data-state="never"] td.nodata { font-weight: 600; }

footer {
  padding: 1rem 1.25rem;
  color: var(--quiet);
  font-size: 0.8rem;
  border-top: 1px solid var(--rule);
}