body{background:#fff}
.auth{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);min-height:100vh;min-height:100dvh}
.side{display:flex;flex-direction:column;padding:24px 56px 28px}
.top{display:flex;align-items:center;justify-content:space-between;gap:16px}
.top .brand img{height:42px}
.back{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--mute);padding:8px 12px;margin-right:-12px;border-radius:99px;transition:color .15s,background .15s}
.back:hover{color:var(--blue);background:var(--blue2)}
.back svg.i{width:16px;height:16px}
.box{width:100%;max-width:420px;margin:auto;padding:40px 0}
.box h1:focus{outline:0}
.box h1{margin:0;font-size:32px;line-height:1.15;letter-spacing:-.8px;font-weight:800}
.box .lead{margin:8px 0 28px;color:var(--mute)}
.box .lead a,.alt a,.link{color:var(--blue);font-weight:700}
.box .lead a:hover,.alt a:hover,.link:hover{text-decoration:underline;text-underline-offset:3px}
.view[hidden]{display:none}
.view{animation:vin .35s cubic-bezier(.16,1,.3,1)}
@keyframes vin{from{opacity:0;transform:translateY(8px)}}

.soc{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.soc .btn{padding:12px 14px;font-size:14px}
.soc svg{width:18px;height:18px;flex:none}
.or{display:flex;align-items:center;gap:14px;margin:22px 0;color:var(--mute);font-size:13px}
.or:before,.or:after{content:"";flex:1;height:1px;background:var(--line)}

.fl{display:grid;gap:16px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fd>label:not(.ck),.fd .lbl{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:6px;font-size:14px;font-weight:700}
.fd .lbl label{margin:0}
.link{padding:0;border:0;background:none;font:inherit;font-weight:700;color:var(--blue);cursor:pointer}
.fd .lbl .link{font-size:13px}
.mlabel{font-size:12.5px;font-weight:700;color:var(--mute)}
.in{position:relative;display:flex;align-items:center;background:#fff;border:1.5px solid var(--line);border-radius:12px;transition:border-color .15s,box-shadow .15s}
.in:hover{border-color:#c8cfdb}
.in:focus-within{border-color:var(--blue);box-shadow:0 0 0 4px var(--blue2)}
.in>svg.i{margin-left:14px;color:#8a93a6;transition:color .15s}
.in:focus-within>svg.i{color:var(--blue)}
.in input{flex:1;min-width:0;height:48px;padding:0 14px 0 10px;border:0;outline:0;background:transparent;font:inherit;font-size:15px;font-weight:500;color:var(--ink)}
.in input:first-child{padding-left:14px}
.in input::placeholder{color:#8a93a6}
.in .pre{padding:0 10px 0 14px;margin-right:-4px;font-weight:600;color:var(--ink);border-right:1px solid var(--line);line-height:24px}
.eye{width:40px;height:40px;margin-right:4px;border:0;border-radius:9px;background:transparent;color:#8a93a6;display:grid;place-items:center;cursor:pointer;transition:color .15s,background .15s}
.eye:hover{color:var(--blue);background:var(--blue2)}
.eye .off,.eye[aria-pressed=true] .on{display:none}
.eye[aria-pressed=true] .off{display:block}
.fd.bad .in{border-color:#d33b3b}
.fd.bad .in:focus-within{box-shadow:0 0 0 4px #fde8e8}
.fd.bad .in>svg.i{color:#d33b3b}
.msg{display:none;align-items:center;gap:6px;margin-top:6px;font-size:13px;font-weight:600;color:#c02f2f}
.msg svg.i{width:15px;height:15px}
.fd.bad .msg{display:flex}
.hint{margin:6px 0 0;font-size:13px;color:var(--mute)}

.meter{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-top:8px}
.meter i{height:4px;border-radius:99px;background:var(--line);transition:background .25s}
.meter[data-s="1"] i:nth-child(-n+1){background:#d33b3b}
.meter[data-s="2"] i:nth-child(-n+2){background:#f08c1a}
.meter[data-s="3"] i:nth-child(-n+3){background:#3a8dde}
.meter[data-s="4"] i{background:#1f9d55}
.rules{display:flex;flex-wrap:wrap;gap:4px 14px;margin:8px 0 0;padding:0;list-style:none;font-size:12.5px;color:var(--mute)}
.rules li{display:flex;align-items:center;gap:5px;transition:color .2s}
.rules li:before{content:"";width:6px;height:6px;border-radius:50%;background:#c8cfdb;transition:background .2s}
.rules li.ok{color:#1f7a45}
.rules li.ok:before{background:#1f9d55}

.ck{display:flex;align-items:flex-start;gap:10px;font-size:14px;color:var(--mute);cursor:pointer;line-height:1.45}
.ck input{appearance:none;-webkit-appearance:none;flex:none;width:20px;height:20px;margin:0;border:1.5px solid #c8cfdb;border-radius:6px;background:#fff center/14px no-repeat;cursor:pointer;transition:background-color .15s,border-color .15s}
.ck input:checked{background-color:var(--blue);border-color:var(--blue);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
.ck input:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.ck a{color:var(--ink);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.fd.bad .ck input{border-color:#d33b3b}
.split{display:flex;align-items:center;justify-content:space-between;gap:12px}

.go{width:100%;padding:14px 18px;font-size:15px;margin-top:4px}
.go[disabled]{opacity:.85;cursor:progress}
.spin{display:none;width:18px;height:18px;border-radius:50%;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;animation:spin .7s linear infinite}
.go.busy .spin{display:block}
@keyframes spin{to{transform:rotate(360deg)}}
.alt{margin:22px 0 0;text-align:center;color:var(--mute);font-size:14px}

.done{text-align:center}
.done .ok{width:64px;height:64px;margin:0 auto 20px;border-radius:50%;background:#e6f5ec;color:#1f9d55;display:grid;place-items:center}
.done .ok svg.i{width:30px;height:30px;stroke-width:2.5}
.done .ok path{stroke-dasharray:30;stroke-dashoffset:30;animation:draw .5s .15s cubic-bezier(.65,0,.35,1) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.done .lead{margin-bottom:24px}
.done .btn+.btn{margin-top:10px}

.legal{margin:0;font-size:12.5px;color:var(--mute);text-align:center}
.legal a{text-decoration:underline;text-underline-offset:3px}

.visual{position:sticky;top:12px;align-self:start;height:calc(100vh - 24px);height:calc(100dvh - 24px);margin:12px 12px 12px 0;border-radius:24px;overflow:hidden;background:var(--blue);color:#fff}
.visual>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:zoom 14s ease-out both}
@keyframes zoom{from{transform:scale(1.08)}}
.visual:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,26,62,.1) 30%,rgba(8,26,62,.82) 100%)}
.vtext{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:44px}
.vtext h2{font-size:34px;line-height:1.15;letter-spacing:-.8px;max-width:17ch;margin:0 0 12px}
.vtext h2 span{color:var(--sun)}
.vtext p{margin:0;max-width:44ch;color:rgba(255,255,255,.88)}
.perks{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:12px}
.perks li{display:flex;align-items:center;gap:12px;font-weight:600}
.perks li svg.i{box-sizing:content-box;padding:8px;border-radius:10px;background:rgba(255,255,255,.14);color:var(--sun)}
.quote{margin:24px 0 0;padding:18px 20px;border-radius:16px;background:rgba(255,255,255,.12);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.18)}
.quote p{color:#fff;font-size:15px}
.who{display:flex;align-items:center;gap:10px;margin-top:12px;font-size:13px}
.who b{display:block;font-size:14px}
.who div span{color:rgba(255,255,255,.78)}
.av{width:38px;height:38px;border-radius:50%;background:var(--sun);color:var(--ink);font-weight:800;display:grid;place-items:center;flex:none}
.stars{margin-left:auto;display:flex;gap:2px;color:var(--sun)}
.stars svg{width:15px;height:15px;fill:currentColor}

@media(max-width:1100px){.side{padding:24px 36px 28px}.vtext{padding:32px}.vtext h2{font-size:28px}}
@media(max-width:900px){
 .auth{grid-template-columns:minmax(0,1fr)}
 .visual{display:none}
 .side{padding:18px 20px 24px}
 .box{padding:32px 0}
}
@media(max-width:480px){
 .box h1{font-size:27px}
 .row{grid-template-columns:minmax(0,1fr)}
 .back span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}
@media(prefers-reduced-motion:reduce){.view,.visual>img,.done .ok path{animation:none;stroke-dashoffset:0}}