*{box-sizing:border-box}
html,body{margin:0;height:100%;background:#1a1a19}
body{font-family:"DM Sans",system-ui,sans-serif;color:#242423;-webkit-font-smoothing:antialiased}
.wl-login{position:relative;min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:calc(24px + env(safe-area-inset-top)) 18px calc(24px + env(safe-area-inset-bottom));overflow:hidden}
.wl-sky{position:absolute;inset:0;opacity:.55}
.wl-sky svg{width:100%;height:100%}
.wl-sky path{fill:none;stroke-width:2;opacity:.45}
.wl-card{position:relative;width:100%;max-width:400px;background:#fffefb;border-radius:24px;padding:28px 24px 22px;box-shadow:0 30px 80px #0007;animation:rise .45s cubic-bezier(.2,.8,.2,1) both}
@keyframes rise{from{opacity:0;transform:translateY(14px) scale(.98)}}
.wl-brand{display:flex;align-items:center;gap:10px;margin-bottom:22px}
.wl-word{font-weight:700;font-size:28px;letter-spacing:-.045em;color:#1a1a19}
.wl-word i{font-style:normal;color:#1f5fa8}
.wl-brand small{font-family:Manrope,sans-serif;font-weight:800;font-size:12px;letter-spacing:.16em;color:#fff;background:#1f5fa8;padding:3px 7px;border-radius:6px}
h1{margin:0;font-size:30px;line-height:1.1;letter-spacing:-.035em}
.wl-sub{margin:8px 0 20px;color:#6d6a63;font-size:15px;line-height:1.4}
form{display:flex;flex-direction:column;gap:14px}
label{display:flex;flex-direction:column;gap:6px;font-size:14px;color:#6d6a63;font-weight:500}
input[type=text],input[type=password]{width:100%;height:52px;border:1px solid #e7e4dd;border-radius:14px;padding:0 16px;font:inherit;font-size:17px;color:#242423;background:#fff;outline:0;transition:border-color .15s,box-shadow .15s;-webkit-appearance:none}
input:focus{border-color:#1f5fa8;box-shadow:0 0 0 4px #1f5fa81f}
.wl-pass{position:relative;display:block}
.wl-pass input{padding-right:52px}
.wl-eye{position:absolute;right:6px;top:6px;width:40px;height:40px;border:0;background:none;border-radius:10px;color:#8a867d;cursor:pointer;display:grid;place-items:center}
.wl-eye.on{color:#1f5fa8}
.wl-remember{flex-direction:row;align-items:center;gap:10px;color:#242423;font-size:15px}
.wl-remember input{width:20px;height:20px;accent-color:#1f5fa8;margin:0}
.wl-btn{display:flex;align-items:center;justify-content:center;width:100%;height:54px;border:0;border-radius:14px;background:#1f5fa8;color:#fff;font:inherit;font-size:17px;font-weight:600;cursor:pointer;text-decoration:none;transition:background .15s,transform .1s;margin-top:4px}
.wl-btn:hover{background:#174a85}.wl-btn:active{transform:scale(.985)}.wl-btn:disabled{opacity:.7}
.wl-lost{display:block;text-align:center;margin:16px 0 4px;color:#1f5fa8;font-weight:600;font-size:15px;text-decoration:none}
.wl-error{background:#9a1c1f12;color:#771416;border-radius:12px;padding:12px 14px;margin-bottom:16px;font-size:15px;line-height:1.4}
.wl-who{color:#6d6a63}
.wl-sites{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;margin-top:20px;padding-top:16px;border-top:1px solid #e7e4dd;font-size:13px;color:#6d6a63}
.wl-sites span{display:inline-flex;align-items:center;gap:6px}
.wl-sites span:before{content:"";width:7px;height:7px;border-radius:2px;background:var(--c);transform:rotate(45deg)}
@media (min-width:700px){.wl-card{padding:36px 34px 26px}h1{font-size:34px}}
.wl-diag{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:18px 0 0;padding:12px;border-radius:12px;background:#f5f4f1;font-size:13px}
.wl-diag dt{color:#6d6a63}.wl-diag dd{margin:0;word-break:break-all;font-weight:600}