:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;background:#101010;color:#e8e8e8;font-synthesis:none}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:24px}
[hidden]{display:none!important}
.login-card{width:100%;max-width:480px;padding:30px;border:1px solid #202020;border-radius:20px;background:#181818}
h1{font-size:24px;font-weight:600;line-height:1.3;margin:0 0 24px;letter-spacing:-.4px}
label{display:block;color:#b0b0b0;font-size:14px;line-height:20px;margin:0 0 8px}
input{display:block;width:100%;height:48px;padding:12px;border:1px solid #303030;border-radius:10px;background:#181818;color:#eee;font:inherit;font-size:16px;margin:0 0 18px;outline:none}
input:focus-visible{outline:2px solid #3b82f6;outline-offset:3px}
button{display:block;width:100%;font:inherit;font-size:16px;cursor:pointer;border-radius:10px;color:#eee}
.primary{height:48px;background:#1c54df;border:1px solid #1c54df;margin:0 0 16px}
.primary:hover:not(:disabled){background:#2863ed}
.primary:disabled{background:#1b3979;border-color:#1b3979;color:#929aaa;cursor:default}
.secondary{height:38px;background:transparent;border:1px solid #303030}
.secondary:hover{background:#222}
button:focus-visible{outline:2px solid #3b82f6;outline-offset:3px}
#message{margin:20px 0 0;color:#e5b1b1;font-size:14px;line-height:1.6}
#message.help{color:#b0b0b0}
#enrollment p{color:#b0b0b0;font-size:14px;line-height:1.6}
#qr{width:220px;max-width:100%;background:white}
code{overflow-wrap:anywhere}
@media(max-width:520px){body{padding:20px}.login-card{padding:26px}}