body{background:#0f172a}
.lwrap{min-height:100vh;display:grid;grid-template-columns:1.05fr 1fr}
.lside{background:radial-gradient(circle at 20% 20%,#d4a01755,transparent 50%),linear-gradient(160deg,#0f172a,#1e293b);color:#e2e8f0;padding:56px;display:flex;flex-direction:column;justify-content:space-between}
.lside h1{font-size:34px;line-height:1.2;margin:28px 0 14px;color:#fff}
.lside p{color:#94a3b8;max-width:420px;line-height:1.6}
.feat{display:flex;flex-direction:column;gap:14px;margin-top:26px}
.feat div{display:flex;gap:12px;align-items:flex-start;font-size:14px}
.feat i{width:30px;height:30px;border-radius:9px;background:#d4a01722;color:#f5c542;display:grid;place-items:center;font-style:normal;flex-shrink:0}
.lmain{background:var(--bg);display:grid;place-items:center;padding:28px}
.lcard{width:min(420px,100%);background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 20px 50px rgba(15,23,42,.08);padding:32px}
.lcard h2{margin:0 0 4px;font-size:22px}
.lcard .field input{padding:11px 12px}
.lstep[hidden]{display:none}
.row{display:flex;justify-content:space-between;align-items:center;font-size:13px;margin:4px 0 18px}
.row a{color:var(--pri);font-weight:600;text-decoration:none}
.btn.block{width:100%;padding:12px}
.otp{display:flex;gap:8px;justify-content:space-between;margin:18px 0}
.otp input{width:48px;height:56px;text-align:center;font-size:22px;font-weight:800}
.reqs{list-style:none;padding:0;margin:6px 0 16px;font-size:13px;display:grid;grid-template-columns:1fr 1fr;gap:6px}
.reqs li{color:var(--muted)}.reqs li.ok{color:var(--ok);font-weight:600}
.reqs li::before{content:"○ "}.reqs li.ok::before{content:"✓ "}
.meter{height:6px;border-radius:99px;background:#f1f5f9;overflow:hidden;margin-top:6px}.meter div{height:100%;width:0;transition:.2s}
.secnote{display:flex;gap:8px;font-size:12px;color:var(--muted);background:#f8fafc;border-radius:10px;padding:10px 12px;margin-top:16px;line-height:1.45}
.stepnav{display:flex;gap:6px;justify-content:center;margin-top:18px}
.stepnav a{font-size:12px;color:var(--muted);text-decoration:none;padding:4px 10px;border-radius:999px;background:#fff;border:1px solid var(--line)}
.stepnav a.on{background:var(--ink);color:#fff;border-color:var(--ink)}
@media (max-width:820px){.lwrap{grid-template-columns:1fr}.lside{display:none}.otp input{width:42px;height:50px}}
.alert{border-radius:10px;padding:10px 12px;font-size:13px;margin:0 0 14px;line-height:1.45}
.alert.err{background:#fee2e2;color:#991b1b}.alert.ok{background:#dcfce7;color:#166534}.alert.info{background:#eff6ff;color:#1e40af}
.otp1{width:100%;text-align:center;font-size:26px;letter-spacing:10px;font-weight:800;padding:12px!important;margin:16px 0}
.qrbox{display:flex;justify-content:center;margin:14px 0}.qrbox img,.qrbox svg{width:190px;height:190px;image-rendering:pixelated;border:8px solid #fff;border-radius:8px;box-shadow:0 0 0 1px var(--line)}
.secret{font-family:monospace;font-size:13px;background:#f8fafc;border:1px dashed var(--line);border-radius:8px;padding:8px;word-break:break-all;text-align:center}
.lcard.wide{width:min(520px,100%)}.links{display:flex;justify-content:space-between;margin-top:16px;font-size:13px}.links a{color:var(--pri);font-weight:600;text-decoration:none}
.lcard form+form{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
