:root {
  --paper: #f5f1e8; --card: #fff; --ink: #11141b; --ink-dim: #5d6472; --line: #e2d9c6;
  --gold: #b38a3e; --rift: #17312c; color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
  :root { --paper: #0c0e13; --card: #161a22; --ink: #ede6d6; --ink-dim: #8a90a0; --line: #262b36; --gold: #c8aa6e; --rift: #102521; }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 16px/1.6 Inter, system-ui, -apple-system, sans-serif; }
main { max-width: 680px; margin: 0 auto; padding: 48px 20px 64px; }
.display { font-family: "Big Shoulders Display", Impact, sans-serif; font-weight: 900; text-transform: uppercase; line-height: 0.92; margin: 0; }
.gold { color: var(--gold); }
.eyebrow { font-size: 11px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ink-dim); }
.wordmark { font-size: 28px; text-decoration: none; color: var(--ink); }
h1.display { font-size: clamp(48px, 12vw, 80px); margin-top: 12px; }
h2.display { font-size: 26px; margin-top: 40px; }
p { color: var(--ink-dim); margin: 12px 0 0; }
a { color: var(--gold); }
.card { margin-top: 32px; background: var(--rift); color: #f5f1e8; border: 1px solid var(--gold); border-radius: 10px; padding: 22px; }
.card p { color: #e9dcc0; }
footer { margin-top: 56px; padding-top: 16px; border-top: 1px solid var(--line); font-size: 13px; color: var(--ink-dim); }