:root { color-scheme: light dark; }
body { margin: 0; background: #fff9ef; color: #402318; font: 1rem/1.65 system-ui, sans-serif; }
main { max-width: 48rem; margin: auto; padding: 24px; }
h1, h2 { font-family: Georgia, serif; line-height: 1.25; }
h2 { margin-top: 2rem; }
a { color: #8a3f0a; }
label { display: block; margin-top: 16px; }
input { box-sizing: border-box; display: block; width: 100%; min-height: 48px; padding: 12px; font: inherit; border: 1px solid #866751; border-radius: 8px; background: white; color: #402318; }
button { min-height: 48px; padding: 12px 20px; margin-top: 20px; background: #7a211e; color: white; border: 0; border-radius: 8px; font: inherit; cursor: pointer; }
:focus-visible { outline: 3px solid #bd6b12; outline-offset: 3px; }
.error { color: #9c1717; font-weight: 600; }
@media (prefers-color-scheme: dark) { body { background: #231b19; color: #fff3e4; } a { color: #ffcb89; } .error { color: #ffb3b3; } }