:root{color-scheme:light;font:16px/1.45 "Segoe UI",Arial,sans-serif;color:#172d39;background:#f1f5f3}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;min-height:100svh;display:flex;flex-direction:column}
svg{display:block;width:100%;height:100%}
.mast{background:#102632;color:#fff}
.mast-inner{max-width:1360px;padding:0 clamp(20px,5vw,72px);margin:auto;display:flex;gap:22px;align-items:center;min-height:68px}
.brand{display:inline-flex;align-items:center;gap:6px;font-size:20px;font-weight:600;letter-spacing:-.6px;white-space:nowrap}
.brand b{font-weight:400;color:#b1c2c9}
.brand svg{width:27px;height:29px;margin-right:5px;color:#c3ee8c}
.mast-section{padding-left:21px;border-left:1px solid #49616b;font-size:14px;color:#cad7db}
main{display:grid;flex:1;place-items:center;padding:40px 18px clamp(45px,10vh,100px)}
.card{width:min(100%,434px);border:1px solid #dce5e2;border-radius:15px;background:white;box-shadow:0 12px 40px rgba(27,55,49,.065);padding:clamp(24px,5vw,38px)}
.lock{width:42px;height:42px;padding:10px;border-radius:10px;background:#e1f1e9;color:#087264;margin-bottom:20px}
.lock svg,.eye svg{stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
h1{font-weight:625;font-size:clamp(29px,5vw,35px);line-height:1.19;letter-spacing:-1.1px;margin:0}
.intro{font-size:15px;color:#536975;margin:8px 0 25px}
label{display:block;font-size:14px;font-weight:600;margin:16px 0 6px}
input,button{font:inherit}input{width:100%;min-width:0;height:46px;color:#172d39;background:#fff;border-radius:6px;padding:10px 12px}
.field,.password-field{border:1px solid #afc0c1;border-radius:6px}
.password-field{display:flex;align-items:center;overflow:visible}
.password-field input{border:0;flex:1;height:44px}
.field:focus,.password-field:focus-within{border-color:#00786e;outline:2px solid #a1cfc1;outline-offset:1px}
.password-field input:focus{outline:0}
.eye{flex:none;display:grid;place-items:center;background:none;color:#49636d;width:43px;height:42px;margin-right:1px;border:0;border-radius:5px;cursor:pointer;padding:11px}
.eye:hover{background:#eef4f1}.eye[aria-pressed=false] #eye-slash{display:none}
.submit{margin-top:25px;width:100%;min-height:45px;background:#006f64;border:1px solid #006f64;border-radius:6px;color:#fff;font-size:15px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:11px}
.submit:hover{background:#005f55}.submit:disabled{cursor:wait;opacity:.62}
button:focus-visible,.error:focus-visible{outline:3px solid #b87918;outline-offset:3px}
.error{background:#fff2ed;border:1px solid #ecc4b8;color:#83371f;border-radius:6px;font-size:14px;padding:10px 12px;white-space:pre-line;overflow-wrap:anywhere;margin-bottom:18px}
#retry{margin-top:9px;border:0;background:transparent;color:#006f64;text-decoration:underline;text-underline-offset:3px;min-height:34px;cursor:pointer;font-size:14px}
.modes{display:flex;background:#eef3f0;border:1px solid #dce6e0;padding:3px;border-radius:7px;margin:0 0 17px}
.modes button{flex:1;padding:7px 9px;border:0;border-radius:5px;background:transparent;color:#4c645e;font-size:14px;cursor:pointer}
.modes button[aria-pressed=true]{background:white;color:#164f43;font-weight:600;box-shadow:0 1px 3px #163d321a}
.help{margin:5px 0 10px;color:#586a72;font-size:13px}
.success{border-left:3px solid #419481;color:#205c4f;background:#e9f5ee;padding:10px 12px;font-size:14px;border-radius:4px;margin:0 0 16px}
[hidden]{display:none!important}
@media(max-width:480px){.mast-inner{min-height:58px;gap:14px}.mast-section{font-size:12px;padding-left:13px}main{align-items:start;padding-top:52px}.card{padding:25px 22px}.intro{margin-bottom:20px}}
@media(max-height:580px){main{padding-top:18px;padding-bottom:18px}}