:root { --bg: #ffffff; --text: #222222; --accent: #0056b3; }
@media (prefers-color-scheme: dark) { :root { --bg: #121212; --text: #e0e0e0; --accent: #66b2ff; } }
body { font-family: system-ui, sans-serif; line-height: 1.6; color: var(--text); background: var(--bg); margin: 0 auto; max-width: 800px; padding: 20px; }
nav a { margin-right: 15px; color: var(--accent); text-decoration: none; padding: 10px 0; display: inline-block; }
h1, h2 { color: var(--accent); }
form { margin: 20px 0; }
input { padding: 10px; width: 100%; max-width: 300px; display: block; margin-bottom: 10px; }
button { padding: 10px 20px; cursor: pointer; }
footer { margin-top: 40px; border-top: 1px solid #ccc; padding-top: 20px; font-size: 0.9em; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }