:root {
  --bg-color: #fdfdfd;
  --text-color: #222;
  --link-color: #005a8d;
  --font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg-color: #1a1a1a;
    --text-color: #eee;
    --link-color: #80bfff;
  }
}
body {
  background: var(--bg-color);
  color: var(--text-color);
  font-family: var(--font-family);
  line-height: 1.6;
  margin: 0;
  padding: 20px;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}
header, footer { padding: 20px 0; border-top: 1px solid #ccc; }
nav a { margin-right: 15px; color: var(--link-color); }
main { min-height: 70vh; }
input, button { padding: 12px; font-size: 16px; margin: 5px 0; }
a { color: var(--link-color); }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; } }