.auth{display:grid;grid-template-columns:1fr 1fr;min-height:100vh}
.left{background:var(--side);color:var(--side-fg);padding:48px;display:flex;flex-direction:column;gap:28px}
.brand{font-size:20px;letter-spacing:.06em;color:#fff;font-weight:400}
.left h1{color:#fff;font-size:30px;font-weight:600;line-height:1.2;margin:0 0 8px;letter-spacing:-.01em}
.left .lead{color:var(--side-lead);margin:0}
.left ul{padding-left:18px;margin:0}
.left li{margin-bottom:10px}
.left .note{margin-top:auto;font-size:12.5px;color:var(--side-muted)}
.right{padding:48px;display:flex;align-items:center;justify-content:center}
.box{width:100%;max-width:420px}
.box.wide{max-width:480px}

.eyebrow{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:500}
.right h2{font-size:28px;font-weight:650;line-height:1.2;margin:4px 0 20px;letter-spacing:-.01em}
.right h2 + .intro{margin-top:-8px}
.intro{color:var(--muted);margin:0 0 20px}
.sub{color:var(--muted);font-size:12.5px;text-align:center;margin-top:14px}
.gap{margin-top:22px}

.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.field label{font-weight:500;font-size:13px}
.field input{border:1px solid var(--input);border-radius:7px;padding:10px 12px;font:inherit;background:#fff;color:var(--fg)}
.field.bad input{border-color:var(--red)}
.opt{color:var(--muted);font-weight:400}
.hint{color:var(--muted);font-size:12px}
.ferr{color:var(--red);font-size:12px}
.labelrow{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.reveal{border:0;background:none;padding:0;font:inherit;font-size:12.5px;font-weight:500;color:var(--accent-fg);cursor:pointer;border-radius:3px}
.check{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px;font-size:13px;cursor:pointer}
.check input{margin-top:3px}
.check.bad span{color:var(--red)}

.btn{width:100%;display:inline-flex;justify-content:center;border-radius:7px;padding:10px 14px;
     font:inherit;font-weight:500;border:1px solid var(--primary);background:var(--primary);color:#fff;cursor:pointer}
.check + .btn{margin-top:8px}
.btn.ghost{background:#fff;color:var(--accent-fg);border-color:var(--border)}
.btn[disabled]{opacity:.6;cursor:progress}
.msg{border-radius:7px;padding:10px 12px;margin-bottom:14px;font-size:13px}
.msg.err{background:var(--red-bg);color:var(--red)}
.msg.ok{background:var(--accent);color:var(--accent-fg)}

.done{text-align:center}
.done .ic{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:14px;
          background:var(--accent);color:var(--accent-fg);margin-bottom:14px}
.right .done h2{font-size:24px}

@media (max-width:760px){
  .auth{grid-template-columns:1fr;grid-template-rows:auto 1fr}
  .left{padding:28px 20px;gap:16px}
  .left h1{font-size:24px}
  .left ul,.left .note{display:none}
  .right{padding:28px 20px;align-items:flex-start}
  .grid2{grid-template-columns:1fr}
}
