:root { color-scheme: light; font-family: system-ui, sans-serif; color: #203229; background: #f3f5f1; }
* { box-sizing: border-box; }
body { margin: 0; padding: 6vh 20px; }
main { max-width: 440px; margin: auto; padding: 32px; background: white; border: 1px solid #d7dfd7; border-radius: 20px; }
h1 { margin: 0 0 12px; font-size: 2rem; }
.eyebrow { color: #4c6555; font-size: .85rem; }
label { display: block; margin: 22px 0 8px; font-weight: 600; }
input { width: 100%; font: inherit; padding: 13px; border: 1px solid #6b7b70; border-radius: 8px; }
button, .primary { display: block; width: 100%; margin-top: 18px; padding: 14px; border-radius: 8px; border: 0; background: #245a3d; color: white; font: inherit; text-align: center; text-decoration: none; cursor: pointer; }
.secondary { background: #edf2ed; color: #244b34; }
:focus-visible { outline: 3px solid #b87500; outline-offset: 3px; }
button:disabled { opacity: .6; cursor: wait; }
#auth-status, #code-help { font-size: .9rem; line-height: 1.5; }
[hidden] { display: none !important; }
@media (max-width: 480px) { body { padding: 20px 12px; } main { padding: 24px; } }