:root { color-scheme: light; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif; color: #182a24; background: #eef3f0; }
* { box-sizing: border-box; }
body { min-height: 100dvh; margin: 0; padding: 32px 20px; display: grid; place-items: center; background: radial-gradient(ellipse at 10% 10%,#dcece3,transparent 55%); }
.login-card { width: min(100%,420px); padding: 36px; border: 1px solid #d7e2db; border-radius: 20px; background: white; box-shadow: 0 16px 48px #153a2110; }
.brand-mark { width: 40px; height: 40px; background: #246043; color: white; border-radius: 11px; display: grid; place-items: center; font-size: 22px; font-weight: 700; }
.eyebrow { margin-top: 28px; color: #597564; font-size: 11px; letter-spacing: .15em; }
h1 { font-size: 28px; margin: 10px 0; letter-spacing: -.03em; }
.copy { color: #68796f; font-size: 14px; line-height: 1.8; margin-bottom: 28px; }
label { display: block; font-size: 14px; font-weight: 600; margin: 18px 0; }
input { width: 100%; height: 44px; margin-top: 8px; border: 1px solid #bdcdc3; border-radius: 8px; background: #fcfdfc; padding: 10px 12px; font: inherit; font-weight: 400; }
input:focus { outline: 2px solid #397956; outline-offset: 2px; }
button { width: 100%; min-height: 44px; padding: 11px; border: 0; border-radius: 8px; color: white; background: #246043; font-size: 15px; font-weight: 650; cursor: pointer; }
button:hover { background: #194e35; } button:disabled { opacity: .65; cursor: wait; }
.secondary { background: #edf3ef; color: #246043; margin-top: 10px; }.secondary:hover { background: #dce8df; }
#loginMessage { min-height: 20px; color: #9c422e; font-size: 13px; line-height: 1.65; }
.security-note { border-top: 1px solid #e4eae6; padding-top: 20px; margin-bottom: 0; font-size: 12px; color: #78877e; line-height: 1.8; }
[hidden] { display: none !important; }
@media(max-width:480px) { .login-card { padding: 26px; } }