:root {
  --bg: #fefefe;
  --text: #222;
  --link: #005a9c;
  --spacing: 1.5rem;
}
@media (prefers-color-scheme: dark) {
  :root { --bg: #121212; --text: #f0f0f0; --link: #80c0ff; }
}
body { font-family: system-ui, sans-serif; line-height: 1.6; max-width: 800px; margin: 0 auto; padding: var(--spacing); background: var(--bg); color: var(--text); }
h1, h2 { margin-top: 2rem; }
a { color: var(--link); }
footer { margin-top: 3rem; font-size: 0.9rem; border-top: 1px solid #ccc; padding-top: var(--spacing); }
nav a { margin-right: 1rem; }
form { margin: 1rem 0; padding: 1rem; background: #eee; }
@media (prefers-color-scheme: dark) { form { background: #333; } }
input { padding: 0.5rem; min-height: 44px; }
button { padding: 0.5rem 1rem; min-height: 44px; cursor: pointer; }
textarea { width: 100%; height: 100px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }