:root {
  --paper:#FFFFFF; --ground:#F4F3F0; --ink:#15181C; --ink-soft:#4C525A;
  --ink-faint:#858B93; --rule:#C8C6C0; --rule-firm:#15181C;
  --blue:#1D4E70; --blue-tint:#E7EEF4;
  --amber:#8A6D1F; --amber-tint:#F7EFDA;
  --red:#8C2F22; --red-tint:#F7E4E0;
  --fill:#FBFAF8;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper:#16191D; --ground:#101216; --ink:#E9E7E2; --ink-soft:#A8AEB6;
    --ink-faint:#6C727A; --rule:#343941; --rule-firm:#E9E7E2;
    --blue:#8FB9D6; --blue-tint:#1B2C39;
    --amber:#E0BE72; --amber-tint:#312817;
    --red:#E39182; --red-tint:#38201C;
    --fill:#1C2025;
  }
}
:root[data-theme="dark"] {
  --paper:#16191D; --ground:#101216; --ink:#E9E7E2; --ink-soft:#A8AEB6;
  --ink-faint:#6C727A; --rule:#343941; --rule-firm:#E9E7E2;
  --blue:#8FB9D6; --blue-tint:#1B2C39;
  --amber:#E0BE72; --amber-tint:#312817;
  --red:#E39182; --red-tint:#38201C;
  --fill:#1C2025;
}
* { box-sizing:border-box; }
body {
  margin:0; padding:clamp(1rem,3vw,2.5rem);
  background:var(--ground); color:var(--ink);
  font-family:"IBM Plex Sans",-apple-system,system-ui,sans-serif;
  font-size:15px; line-height:1.55; -webkit-font-smoothing:antialiased;
}
.sheet {
  max-width:56rem; margin:0 auto; background:var(--paper);
  border:1px solid var(--rule); padding:clamp(1.25rem,3vw,2.5rem);
  display:flex; flex-direction:column; gap:1.6rem;
}
.masthead { border-bottom:2.5px solid var(--rule-firm); padding-bottom:0.85rem; }
.eyebrow {
  font-family:"IBM Plex Mono",monospace; font-size:0.7rem; font-weight:600;
  letter-spacing:0.16em; text-transform:uppercase; color:var(--ink-faint);
}
h1 { margin:0.25rem 0 0.35rem; font-size:clamp(1.5rem,4vw,2.05rem); letter-spacing:-0.015em; text-wrap:balance; }
.sub { font-family:"IBM Plex Mono",monospace; font-size:0.78rem; letter-spacing:0.08em;
  text-transform:uppercase; color:var(--ink-soft); }
h2 {
  display:flex; align-items:baseline; gap:0.5rem; margin:0 0 0.6rem;
  font-size:1.05rem; letter-spacing:0.01em; color:var(--blue);
  padding-bottom:0.3rem; border-bottom:1px solid var(--rule);
}
a { color:var(--blue); text-underline-offset:2px; }
a:focus-visible { outline:2px solid var(--blue); outline-offset:2px; }
.standfirst { margin:0; color:var(--ink-soft); max-width:64ch; }

nav.crumbs { font-family:"IBM Plex Mono",monospace; font-size:0.72rem; letter-spacing:0.06em; }
nav.crumbs a { color:var(--ink-faint); text-decoration:none; }
nav.crumbs a:hover { color:var(--blue); text-decoration:underline; }

.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(15rem,1fr)); gap:0.8rem; }
.card {
  border:1px solid var(--rule); background:var(--fill); padding:0.9rem 1rem;
  display:flex; flex-direction:column; gap:0.35rem; text-decoration:none; color:inherit;
}
.card:hover { border-color:var(--blue); background:var(--blue-tint); }
.card .t { font-weight:600; font-size:1rem; color:var(--blue); }
.card .d { font-size:0.85rem; color:var(--ink-soft); }
.card .m { font-family:"IBM Plex Mono",monospace; font-size:0.68rem;
  letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-faint); }

table { width:100%; border-collapse:collapse; font-size:0.88rem; }
th { text-align:left; font-family:"IBM Plex Mono",monospace; font-size:0.66rem;
  font-weight:600; letter-spacing:0.11em; text-transform:uppercase; color:var(--ink-faint);
  border-bottom:1.5px solid var(--rule-firm); padding:0.4rem 0.6rem 0.35rem; }
td { padding:0.45rem 0.6rem; border-bottom:1px solid var(--rule); vertical-align:top; }
tr:last-child td { border-bottom:none; }
.mono { font-family:"IBM Plex Mono",monospace; font-size:0.82rem; font-variant-numeric:tabular-nums; }
.tw { overflow-x:auto; }

.callout { border-left:3px solid var(--amber); background:var(--amber-tint);
  padding:0.7rem 0.9rem; font-size:0.88rem; }
.callout .hd { font-family:"IBM Plex Mono",monospace; font-size:0.68rem; font-weight:700;
  letter-spacing:0.14em; text-transform:uppercase; margin-bottom:0.25rem; }

ul.plain { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:0.5rem; }
ul.plain li { display:flex; gap:0.6rem; align-items:baseline; font-size:0.9rem; }
.tag { font-family:"IBM Plex Mono",monospace; font-size:0.62rem; font-weight:600;
  letter-spacing:0.1em; text-transform:uppercase; padding:0.12rem 0.4rem;
  border:1px solid var(--rule); color:var(--ink-faint); white-space:nowrap; }
.tag.live { color:var(--blue); border-color:var(--blue); background:var(--blue-tint); }

footer { border-top:1px solid var(--rule); padding-top:0.8rem;
  font-size:0.78rem; color:var(--ink-faint); display:flex; flex-wrap:wrap; gap:0.3rem 1.2rem; }