* { box-sizing: border-box; }
body { margin: 0; background: #f6f7f5; color: #202b29; font: 15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; min-height: 100dvh; display: grid; place-items: center; padding: 24px; }
main { width: min(100%, 360px); }
.brand { font-size: 24px; font-weight: 750; letter-spacing: -.06em; margin-bottom: 42px; }
.brand span { color: #246953; }
h1 { font-size: 30px; letter-spacing: -.025em; margin: 0 0 24px; }
label { display: block; margin: 20px 0 7px; color: #626f6b; font-size: 13px; }
input { width: 100%; border: 1px solid #c6cfca; background: white; border-radius: 7px; padding: 12px; font: inherit; }
input:focus,button:focus-visible { outline: 2px solid #246953; outline-offset: 3px; }
button { width: 100%; border: 0; background: #246953; color: #fff; border-radius: 8px; padding: 13px; font: inherit; font-weight: 600; cursor: pointer; margin-top: 12px; transition: background 160ms ease; }
button:hover { background: #18533f; }
button:disabled { opacity: .6; cursor: default; }
#login-error { font-size: 13px; color: #a53130; min-height: 20px; margin: 16px 0 0; }
@media(prefers-reduced-motion:reduce) { button { transition: none; } }