body.auth { overflow: auto; min-height: 100vh; user-select: auto; }
.auth-wrap { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 24px 16px calc(24px + env(safe-area-inset-bottom)); position: relative; z-index: 1; }
.auth-card { width: min(420px, 100%); padding: 26px 24px; }
.auth-brand { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; }
.auth-brand img { border-radius: 12px; box-shadow: 0 0 24px rgba(79, 210, 255, 0.25); }
.auth-brand b { display: block; font: 600 15px/1 var(--mono); letter-spacing: 0.32em; }
.auth-brand span { display: block; margin-top: 6px; font: 400 10.5px/1 var(--mono); letter-spacing: 0.14em; color: var(--muted); text-transform: uppercase; }
.auth h2 { margin: 0 0 6px; font-size: 21px; font-weight: 600; letter-spacing: -0.01em; }
.auth .lead { margin: 0 0 18px; color: var(--text-2); font-size: 14px; line-height: 1.5; }
.auth form { display: flex; flex-direction: column; gap: 12px; }
.auth .input { height: 44px; font-size: 16px; }
.auth .btn.primary { height: 44px; font-size: 15px; margin-top: 4px; }
.auth .err { color: var(--crit-ink); font-size: 13px; min-height: 18px; }
.auth .qr { background: #fff; border-radius: 14px; padding: 10px; width: 210px; margin: 4px auto 10px; }
.auth .qr svg { display: block; width: 100%; height: auto; }
.auth .secret { font: 500 12.5px/1.4 var(--mono); color: var(--text-2); word-break: break-all; text-align: center; padding: 8px 10px; border-radius: 10px; background: rgba(5, 8, 13, 0.6); border: 1px solid var(--line); user-select: all; }
.auth ol { margin: 0 0 14px; padding-left: 20px; color: var(--text-2); font-size: 13.5px; line-height: 1.6; }
.auth .code { letter-spacing: 0.35em; text-align: center; font-family: var(--mono); }
.auth-foot { margin-top: 18px; color: var(--muted); font: 400 11px/1 var(--mono); letter-spacing: 0.12em; text-transform: uppercase; }