:root {
  --bg: #0b1510;
  --felt: #1d5c3c;
  --text: #f4f1ea;
  --muted: #c9d3cc;
  --gold: #e8c170;
  --card: rgba(0, 0, 0, 0.32);
}
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --bg: #f6f3ea;
    --felt: #d7e8dc;
    --text: #13231a;
    --muted: #3f5247;
    --gold: #8a5d10;
    --card: rgba(255, 255, 255, 0.75);
  }
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: radial-gradient(ellipse at 50% -10%, var(--felt), var(--bg) 70%) fixed, var(--bg);
  color: var(--text);
  font: 19px/1.6 "Atkinson Hyperlegible", system-ui, -apple-system, "Segoe UI", sans-serif;
}
main { max-width: 760px; margin: 0 auto; padding: 32px 16px 64px; }
header { display: flex; gap: 18px; align-items: center; margin-bottom: 20px; }
header img { width: 84px; height: 84px; border-radius: 20px; box-shadow: 0 6px 18px rgba(0,0,0,.35); }
h1 { font-family: "Playfair Display SC", Georgia, serif; font-weight: 900; color: var(--gold); margin: 0; font-size: 2.2em; line-height: 1.1; }
h2 { color: var(--gold); margin-top: 1.8em; font-size: 1.3em; }
.tag { color: var(--muted); margin: 4px 0 0; }
section { background: var(--card); border-radius: 18px; padding: 8px 22px 16px; margin: 18px 0; }
a { color: var(--gold); }
nav { display: flex; gap: 18px; flex-wrap: wrap; margin: 8px 0 18px; }
nav a { font-weight: 700; }
small { color: var(--muted); }