:root{color-scheme:light;--ink:#172235;--muted:#617087;--line:#dce3ec;--blue:#194d7f;--blue2:#256aa7;--soft:#f3f7fb;--ok:#17643b;--bad:#a12a32}
*{box-sizing:border-box}
html,body{min-height:100%;margin:0}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:radial-gradient(circle at 15% 15%,#eaf3fb 0,transparent 34%),linear-gradient(145deg,#f8fafc,#edf3f8);color:var(--ink);font-size:16px;line-height:1.5}
.shell{min-height:100vh;display:grid;place-items:center;padding:32px 18px}
.card{width:min(100%,480px);background:#fff;border:1px solid rgba(166,181,199,.55);border-radius:18px;box-shadow:0 24px 70px rgba(25,55,86,.13);overflow:hidden}
.brand{display:flex;align-items:center;gap:12px;padding:24px 28px 20px;border-bottom:1px solid var(--line)}
.mark{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:linear-gradient(145deg,var(--blue2),var(--blue));color:#fff;font-weight:800;letter-spacing:-.04em}
.brandText{font-weight:750;letter-spacing:-.02em}.brandSub{display:block;color:var(--muted);font-size:.82rem;font-weight:500;letter-spacing:0}
.content{padding:30px 28px 32px}
h1{margin:0 0 10px;font-size:1.65rem;line-height:1.15;letter-spacing:-.035em}
p{margin:0 0 22px;color:var(--muted)}
label{display:block;margin:16px 0 7px;font-size:.9rem;font-weight:700}
input{width:100%;padding:12px 13px;border:1px solid #bac6d4;border-radius:9px;font:inherit;color:var(--ink);background:#fff;outline:none}
input:focus{border-color:var(--blue2);box-shadow:0 0 0 3px rgba(37,106,167,.14)}
button{width:100%;margin-top:20px;padding:12px 16px;border:0;border-radius:9px;background:var(--blue);color:#fff;font:inherit;font-weight:750;cursor:pointer}
button:hover{background:#123f6c}button:disabled{opacity:.58;cursor:not-allowed}
.message{display:none;margin:0 0 20px;padding:12px 14px;border-radius:9px;background:var(--soft);color:var(--ink)}
.message.show{display:block}.message.ok{background:#eaf7ef;color:var(--ok)}.message.error{background:#fff0f1;color:var(--bad)}
.fine{margin:20px 0 0;font-size:.88rem}.hidden{display:none!important}
@media(max-width:520px){.shell{padding:0}.card{min-height:100vh;border:0;border-radius:0}.brand{padding:22px}.content{padding:28px 22px}}