:root{color-scheme:dark;font-family:system-ui,-apple-system,"Segoe UI",sans-serif;font-size:16px;line-height:1.5;color:#f7fafb;background:#101215;letter-spacing:0}
*{box-sizing:border-box;letter-spacing:0}
body{margin:0;min-block-size:100dvh;display:grid;place-items:center;padding:32px 20px;border-block-start:8px solid #57dfed}
main{inline-size:min(100%,420px)}
.brand{display:flex;align-items:center;gap:16px;margin-block-end:40px;font-size:26px;font-weight:750;flex-wrap:wrap}
.brand span:first-child{padding:10px;border:2px solid #ff8fbd;border-radius:6px;color:#f4cd70}
h1{font-size:24px;line-height:1.3;margin:0 0 28px;overflow-wrap:anywhere}
form{display:grid;gap:10px}
label{font-weight:600}
input,button{font:inherit;min-inline-size:0;inline-size:100%;min-block-size:52px;padding:12px 14px;border:1px solid #839298;border-radius:6px}
input{background:#1d2227;color:#fff;margin-block-end:14px}
button{display:flex;justify-content:space-between;gap:12px;align-items:center;background:#85e4af;color:#10241b;font-weight:750;cursor:pointer}
button:disabled{opacity:.65;cursor:progress}
:focus-visible{outline:3px solid #f4cd70;outline-offset:3px}
#login-error{min-block-size:3em;color:#ffa9ba;margin:8px 0;overflow-wrap:anywhere}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}