:root {
  --bg: #fafaf8;
  --fg: #1b1b1b;
  --muted: #5f5f5a;
  --line: #ddd;
  --claim: #fff3f0;
  --claim-edge: #d9533b;
  --context: #eef6f0;
  --context-edge: #2f8a55;
  --link: #1f4e9c;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #141414; --fg: #ececec; --muted: #a8a8a3; --line: #333;
    --claim: #2a1a17; --claim-edge: #e06b54;
    --context: #15241a; --context-edge: #4fb374;
    --link: #8ab4ff;
  }
}
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--bg); color: var(--fg);
  font: 17px/1.55 Georgia, "Times New Roman", serif;
}
a { color: var(--link); }
main, .site-header, .site-footer { max-width: 960px; margin: 0 auto; padding: 0 16px; }
.site-header { padding-top: 32px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.brand {
  display: block; text-decoration: none; color: var(--fg);
  font-family: "Arial Black", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 900; font-size: clamp(2.6rem, 8vw, 5rem); line-height: 1;
  text-transform: uppercase; letter-spacing: 0.03em;
}
.tagline { margin: 10px 0 16px; color: var(--muted); }
.claim { margin: 40px 0; }
.claim h2 { margin: 0 0 4px; font-size: 1.35rem; }
.claim h2 a { color: inherit; text-decoration: none; }
.claim h2 a:hover { text-decoration: underline; }
.meta { margin: 0 0 16px; color: var(--muted); font-size: 0.95rem; }
.verdict { font-weight: bold; color: var(--fg); }
.columns { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
@media (max-width: 720px) { .columns { grid-template-columns: 1fr; } }
.side { padding: 16px 18px; border-radius: 6px; border-left: 5px solid; }
.side-claim { background: var(--claim); border-color: var(--claim-edge); }
.side-context { background: var(--context); border-color: var(--context-edge); }
.side h3 { margin: 0 0 10px; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); }
blockquote { margin: 0 0 10px; font-size: 1.08rem; }
.attribution { margin: 0 0 6px; color: var(--muted); font-size: 0.95rem; }
.sources { margin: 0; font-size: 0.9rem; }
.notes { margin: 14px 0 0; }
.back { margin: 32px 0; }
.site-footer { padding: 24px 16px 48px; border-top: 1px solid var(--line); color: var(--muted); font-size: 0.9rem; }
.video { position: relative; aspect-ratio: 16 / 9; margin: 12px 0; border-radius: 4px; overflow: hidden; background: #000; }
.video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.types { display: flex; flex-wrap: wrap; gap: 6px 10px; margin: 8px 0 14px; font-size: 0.9rem; }
.types a { text-decoration: none; padding: 4px 10px; border: 1px solid var(--line); border-radius: 999px; color: var(--fg); }
.types a:hover { border-color: var(--fg); }
.types a.active { background: var(--fg); color: var(--bg); border-color: var(--fg); }
.meta a.type { color: inherit; }
