:root {
  color-scheme: dark;
  --color-background: #0d0e0f;
  --color-surface: #131415;
  --color-foreground: #d4be98;
  --color-muted-foreground: #a89b8c;
  --color-primary: #b8c572;
  --color-border: #252729;
  font-family: system-ui, sans-serif;
  color: var(--color-foreground);
  background: var(--color-background);
  line-height: 1.6;
}

* { box-sizing: border-box; }
::selection { background: var(--color-primary); color: var(--color-background); }
body { margin: 0; }
main { max-width: 860px; margin: 0 auto; padding: clamp(48px, 12vw, 120px) 24px; }
.eyebrow { color: var(--color-primary); font-size: 0.8rem; font-weight: 650; letter-spacing: 0.12em; text-transform: uppercase; }
h1 { font-size: clamp(2.1rem, 6vw, 4rem); line-height: 1.12; letter-spacing: -0.045em; }
.intro { max-width: 560px; color: var(--color-muted-foreground); font-size: 1.15rem; }
section { margin-top: 64px; }
h2 { font-size: 1.2rem; }
.empty { padding: 24px; border: 1px dashed var(--color-border); border-radius: 12px; color: var(--color-muted-foreground); background: var(--color-surface); }
a { color: var(--color-primary); text-underline-offset: 4px; }
a:hover { color: var(--color-foreground); }
a:focus-visible { outline: 2px solid currentColor; outline-offset: 6px; }
footer { margin-top: 64px; color: var(--color-muted-foreground); font-size: 0.85rem; }