:root{font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif;color:#202938;background:#edf1f5;font-synthesis:none;text-rendering:optimizeLegibility;font-optical-sizing:auto}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;min-height:100svh;display:grid;place-items:center;padding:30px 18px;background:radial-gradient(ellipse at 17% 17%,rgba(189,205,234,.43),transparent 34%),radial-gradient(ellipse at 83% 82%,rgba(221,228,233,.72),transparent 37%),#edf1f5}
button,input{font:inherit}
.login-wrap{width:min(100%,446px)}
.login-header{display:flex;align-items:center;justify-content:space-between;margin:0 3px 26px}
.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}
.brand-mark{position:relative;width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:#465f99;box-shadow:0 7px 18px rgba(48,70,119,.2)}
.brand-mark:before,.brand-mark:after,.brand-mark i{position:absolute;width:7px;height:7px;border:2px solid #fff;border-radius:2px;content:"";transform:rotate(45deg)}
.brand-mark:before{left:11px;top:11px}.brand-mark:after{right:11px;top:11px}.brand-mark i{left:17px;bottom:8px}
.brand-copy{display:flex;flex-direction:column;gap:3px}.brand-copy strong{font-size:17px;font-weight:700;letter-spacing:.01em}.brand-copy em{color:#71809a;font-size:12px;font-style:normal;font-weight:600}.brand-copy small{color:#8791a0;font-size:11px;letter-spacing:.02em}
.language-toggle{display:flex;align-items:center;gap:5px;min-height:34px;padding:0 10px;border:1px solid rgba(78,94,119,.16);border-radius:9px;background:rgba(255,255,255,.54);color:#53627a;font-size:12px;font-weight:650;cursor:pointer}.language-toggle span{color:#a2abb8;font-weight:400}
.login-card{padding:35px 38px 29px;border:1px solid rgba(255,255,255,.86);border-radius:19px;background:rgba(255,255,255,.77);box-shadow:0 22px 65px rgba(38,54,79,.11),0 2px 8px rgba(38,54,79,.035);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.card-topline{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.eyebrow{color:#667896;font-size:11px;font-weight:700;letter-spacing:.11em}.secure-mark{color:#6a9b84;font-size:9px}
h1{margin:0;color:#1e2938;font-size:28px;font-weight:680;letter-spacing:-.035em;line-height:1.2}.intro{margin:10px 0 27px;color:#788495;font-size:13px;line-height:1.6}
form{display:flex;flex-direction:column}label{margin:0 0 8px;color:#475467;font-size:12px;font-weight:650}input{width:100%;height:46px;padding:0 13px;border:1px solid #dce2ea;border-radius:9px;outline:none;background:rgba(255,255,255,.83);color:#253044;font-size:14px;transition:border-color .18s,box-shadow .18s}input:focus{border-color:#758ab5;box-shadow:0 0 0 3px rgba(93,119,171,.13)}input::placeholder{color:#a6afbc}#username{margin-bottom:19px}.password-field{position:relative;margin-bottom:18px}.password-field input{padding-right:66px}.show-password{position:absolute;top:0;right:0;height:46px;padding:0 12px;border:0;background:transparent;color:#687998;font-size:11px;font-weight:650;cursor:pointer}.show-password:hover{color:#354b78}
.submit-button{width:100%;height:47px;display:flex;align-items:center;justify-content:center;gap:12px;border:0;border-radius:9px;background:#435e99;color:#fff;font-size:13px;font-weight:700;box-shadow:0 6px 14px rgba(55,79,132,.18);cursor:pointer;transition:background .18s,transform .18s,box-shadow .18s}.submit-button:hover{background:#364f87;box-shadow:0 8px 18px rgba(55,79,132,.24);transform:translateY(-1px)}.submit-button:disabled{opacity:.62;cursor:wait;transform:none}.arrow{font-size:17px;font-weight:400;line-height:1}
.login-error{margin:0 0 13px;padding:10px 12px;border:1px solid #f0d5d1;border-radius:8px;background:#fff5f3;color:#a3473c;font-size:12px;line-height:1.5}.login-error[hidden]{display:none}
.login-note{display:flex;align-items:center;gap:10px;margin-top:23px;color:#8993a1;font-size:11px}.note-rule{width:18px;height:1px;background:#c9d1dc}
.login-footer{display:flex;justify-content:center;gap:8px;margin-top:22px;color:#96a0ad;font-size:10px;letter-spacing:.02em}.footer-dot{color:#c2c9d2}
@media(max-width:520px){body{padding:22px 17px}.login-header{margin-bottom:21px}.login-card{padding:29px 23px 25px;border-radius:16px}.brand-mark{width:39px;height:39px}.brand-copy strong{font-size:16px}.login-footer{flex-wrap:wrap;font-size:9px}}
@media(prefers-color-scheme:dark){:root{color:#e7ebf1;background:#161b23}body{background:radial-gradient(ellipse at 17% 17%,rgba(47,65,100,.35),transparent 34%),radial-gradient(ellipse at 83% 82%,rgba(46,53,64,.35),transparent 37%),#161b23}.brand-mark{background:#667db3}.brand-copy em{color:#9ba9c0}.brand-copy small,.intro,.login-note,.login-footer{color:#929dac}.language-toggle{border-color:rgba(197,208,225,.16);background:rgba(40,47,60,.62);color:#d5dceb}.login-card{border-color:rgba(225,233,245,.09);background:rgba(35,42,53,.8);box-shadow:0 22px 65px rgba(0,0,0,.25)}h1{color:#edf1f7}.eyebrow,label{color:#bec8d7}input{border-color:#424b59;background:rgba(25,30,38,.72);color:#e8edf5}input:focus{border-color:#90a4d0;box-shadow:0 0 0 3px rgba(119,145,198,.17)}.show-password{color:#aab8d0}.show-password:hover{color:#dbe5fa}.submit-button{background:#7187bb}.submit-button:hover{background:#8297c8}.login-error{border-color:#68413e;background:#392b2d;color:#f0aaa0}.note-rule{background:#4c5665}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important}}
