*{box-sizing:border-box;margin:0;padding:0}
:root{--bg:#050918;--card:#0a1230;--side:#070d22;--line:#1c2750;--text:#eef2ff;--muted:#8d9bc0;--g1:#a23bf0;--g2:#4f7fff}
html{-webkit-text-size-adjust:100%}
body{font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--text);min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;line-height:1.45;background:radial-gradient(900px 520px at 8% 0,#1b1552 0,transparent 60%),radial-gradient(800px 520px at 100% 100%,#101b58 0,transparent 55%),var(--bg)}
button,input{font:inherit;color:inherit}button{cursor:pointer;border:0;background:none}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--g2);outline-offset:2px}
.shell{width:100%;max-width:1180px;display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:28px;overflow:hidden;background:var(--card);box-shadow:0 30px 80px rgba(0,0,0,.5)}
.rev .brand{order:2}
.brand{position:relative;padding:48px 56px;display:flex;flex-direction:column;overflow:hidden;background:linear-gradient(135deg,#1b1d55,#0f1838 62%)}
.brand::before{content:"";position:absolute;width:540px;height:540px;border-radius:50%;right:-190px;top:-100px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.05)}
.brand>*{position:relative}
.logo{display:flex;align-items:center;gap:12px}
.logo .lg{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#1e1b6b,#6a3df0);box-shadow:0 0 22px rgba(120,80,255,.45)}
.logo b{display:block;font-size:20px;font-weight:700;letter-spacing:-.3px}
.logo small{display:block;font-size:12px;color:var(--muted)}
.mid{margin:auto 0;padding:36px 0}
.tag{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border:1px solid #2b3c7a;border-radius:8px;background:rgba(79,127,255,.1);color:#9db4ff;font-size:12px;font-weight:700;margin-bottom:26px}
.brand h2{font-size:clamp(38px,4.4vw,56px);line-height:1.08;font-weight:800;letter-spacing:-1.5px}
.grad{background:linear-gradient(90deg,#6f8bff,#b45cf5);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand p{margin-top:22px;color:#b4bfdc;font-size:16px;max-width:460px}
.list{margin-top:34px;display:grid;gap:14px}
.list div{display:flex;align-items:center;gap:14px;font-size:14px;color:#dbe3ff}
.list span{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:#1c2160;border:1px solid #2c3580;color:#b9c4ff;font-size:13px;font-weight:700}
.copy{font-size:12px;color:var(--muted)}
.formside{background:var(--side);padding:48px 56px;display:flex;flex-direction:column;justify-content:center}
.mlogo{display:none;margin-bottom:28px}
.back{font-size:13px;color:var(--muted);margin-bottom:34px;align-self:flex-start}
.back:hover{color:var(--text)}
h1{font-size:36px;font-weight:800;letter-spacing:-1px}
.sub{color:var(--muted);font-size:14px;margin:10px 0 30px}
label.l{display:block;font-size:13px;font-weight:600;margin:0 0 8px}
.fld{position:relative;margin-bottom:20px}
.fld>i{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:#5d6d93;font-size:15px;pointer-events:none}
.fld input{width:100%;height:54px;border-radius:12px;border:1px solid #2a3a6e;background:#e8eefc;color:#0b1530;padding:0 48px 0 46px;font-size:16px}
.fld input::placeholder{color:#7c8bb0}
.eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:44px;height:44px;color:#5d6d93}
.row{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:13px;color:#b4bfdc;margin:-4px 0 20px}
.row a,.chk a{color:#a98bff;font-weight:600}
.chk{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:#b4bfdc;margin:6px 0 20px}
.chk input{width:18px;height:18px;margin-top:1px;accent-color:#7b5cff;flex:none}
.btn{width:100%;height:56px;border-radius:12px;font-weight:700;font-size:15px;color:#fff;background:linear-gradient(90deg,var(--g1),var(--g2));box-shadow:0 10px 30px rgba(110,90,255,.35)}
.btn:disabled{opacity:.6;cursor:wait}
.btn2{width:100%;height:52px;margin-top:14px;border-radius:12px;border:1px solid #5b49c8;font-weight:600;font-size:14px;color:#e6e9ff}
.hint{text-align:center;font-size:12px;color:var(--muted);margin-top:10px}
.or{display:flex;align-items:center;gap:14px;color:var(--muted);font-size:12px;margin:26px 0 18px}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line)}
.soc{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.soc button{height:48px;border-radius:12px;border:1px solid var(--line);background:#0a1330;font-weight:600;font-size:14px}
.alt{text-align:center;font-size:13px;color:var(--muted);margin-top:26px}
.alt a{color:#a98bff;font-weight:700}
.msg{display:none;margin:0 0 16px;padding:11px 14px;border-radius:10px;font-size:13px;background:rgba(79,127,255,.12);border:1px solid #2b3c7a;color:#b9c8ff}
.msg.show{display:block}.msg.bad{background:rgba(255,77,106,.12);border-color:#7a2b3c;color:#ffb3c0}
@media(max-width:860px){body{padding:0;align-items:stretch}.shell{grid-template-columns:1fr;border-radius:0;border:0}.brand{display:none}.formside{padding:36px 24px;min-height:100vh}.mlogo{display:flex}h1{font-size:30px}}
