/* The shared PWA stylesheet owns SpoorID colour tokens. */
html{background:#f4f6f5;color-scheme:light}
body.sp-login{margin:0;min-height:100vh;min-height:100dvh;box-sizing:border-box;display:flex;align-items:center;justify-content:center;background:#f4f6f5;color:var(--spoorid-dark);font-family:system-ui,-apple-system,Segoe UI,sans-serif;padding:max(24px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
.login-card{width:100%;max-width:420px;background:white;border:1px solid #e1e5e3;border-radius:16px;overflow:hidden;box-shadow:0 6px 24px #102b220d}
.login-brand{background:var(--spoorid-dark);padding:18px 24px}
.login-brand img{display:block;width:100%;height:auto;object-fit:contain}
.login-content{padding:24px 28px 28px}.login-content label{display:block;font-size:15px;font-weight:650;margin:0 0 7px}.login-content input{width:100%;box-sizing:border-box;min-height:48px;padding:12px;font-family:inherit;font-size:16px;border:1px solid #9aa6a0;border-radius:8px;background:white;color:var(--spoorid-dark);margin:0 0 20px}
.login-content button{width:100%;min-height:48px;padding:12px;border:0;border-radius:8px;background:var(--spoorid-green);color:var(--spoorid-dark);font-size:16px;font-weight:700;cursor:pointer}
.login-content :focus-visible{outline:3px solid var(--spoorid-dark-soft);outline-offset:3px}.login-message{background:#fff1f0;color:#b42318;border:1px solid #b42318;padding:12px;border-radius:8px;margin:0 0 18px;overflow-wrap:anywhere}
@media(max-height:500px){body.sp-login{align-items:flex-start}}