/* ── Mentat — the auth box, shared ───────────────────────────────────────────
   These rules were inline in landing.php until card 598 needed the same box on
   reset.php, which is opened cold from an email. One copy, two pages: landing
   links this file and so does reset.php. Every colour reads a landing token
   with the token's own value as the fallback, so the file also works on a page
   that does not define them. */

.auth { position: fixed; inset: 0; z-index: 200; display: none; }
.auth.open { display: block; }
.auth-bd { position: absolute; inset: 0; background: rgba(6,7,9,.74); backdrop-filter: blur(5px); }
.auth-box { position: relative; z-index: 1; width: min(400px, calc(100vw - 36px)); margin: 9vh auto 0; background: var(--panel, #15171D); border: 1px solid var(--line, #23262F); border-radius: 12px; padding: 28px; }
.auth-x { position: absolute; top: 13px; right: 16px; color: var(--dim, #6B7280); font-size: 1.3rem; line-height: 1; }
.auth-x:hover { color: var(--text, #F2F3F5); }
.auth-tabs { display: flex; gap: 4px; background: var(--bg, #0B0C0E); border: 1px solid var(--line-2, #1A1D24); border-radius: 8px; padding: 4px; margin-bottom: 20px; }
.auth-tab { flex: 1; padding: 8px 0; border-radius: 6px; font-size: .9rem; color: var(--muted, #9AA1AC); }
.auth-tab.active { background: var(--panel, #15171D); color: var(--text, #F2F3F5); font-weight: 500; }
.auth-f { display: none; flex-direction: column; gap: 11px; }
.auth-f.active { display: flex; }
.auth-f input[type=text], .auth-f input[type=email], .auth-f input[type=password] {
  background: var(--bg, #0B0C0E); border: 1px solid var(--line, #23262F); border-radius: 8px; padding: 11px 14px;
  color: var(--text, #F2F3F5); font: inherit; font-size: .94rem; width: 100%;
}
.auth-f input:focus { outline: none; border-color: var(--amber, #EAA23D); }
.auth-f input::placeholder { color: var(--dim, #6B7280); }
.auth-chk { display: flex; align-items: center; gap: 8px; font-size: .87rem; color: var(--muted, #9AA1AC); }
.auth-err { background: rgba(214,92,86,.13); border: 1px solid rgba(214,92,86,.4); color: #E79A96; border-radius: 8px; padding: 10px 14px; font-size: .88rem; margin-bottom: 14px; }
.auth-f .btn-primary { margin-top: 5px; width: 100%; }

/* ── A way back in (card 598) ────────────────────────────────────────────── */
.auth-h { font-size: 1.15rem; font-weight: 650; color: var(--text, #F2F3F5); margin: 0 0 6px; }
.auth-p { color: var(--muted, #9AA1AC); font-size: .92rem; line-height: 1.6; margin: 0 0 16px; }
.auth-p b, .auth-strong { color: var(--text, #F2F3F5); font-weight: 600; }
.auth-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: .87rem; color: var(--muted, #9AA1AC); }
.auth-link { color: var(--amber, #EAA23D); font-size: .87rem; background: none; border: 0; padding: 0; cursor: pointer; text-decoration: none; }
.auth-link:hover { text-decoration: underline; }
.auth-steps { margin: 0 0 16px; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.auth-steps li { position: relative; padding-left: 22px; color: var(--muted, #9AA1AC); font-size: .89rem; line-height: 1.55; }
.auth-steps li::before { content: ""; position: absolute; left: 6px; top: .55em; width: 5px; height: 5px; border-radius: 50%; background: var(--amber, #EAA23D); }
.auth-wait { color: var(--dim, #6B7280); font-size: .84rem; }

/* The password field, revealable, with the rules ticking as they are met. */
.auth-pw { position: relative; }
.auth-pw input { padding-right: 62px !important; }
.auth-reveal { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); background: none; border: 0; color: var(--muted, #9AA1AC); font-size: .8rem; cursor: pointer; padding: 4px 6px; }
.auth-reveal:hover { color: var(--text, #F2F3F5); }
.auth-strength { font-size: .84rem; color: var(--dim, #6B7280); }
.auth-strength.is-ok { color: #6FCF97; }
.auth-rules { margin: 4px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 5px; }
.auth-rules li { display: flex; align-items: flex-start; gap: 8px; font-size: .85rem; color: var(--dim, #6B7280); line-height: 1.5; }
.auth-rules li::before { content: "\2022"; color: var(--dim, #6B7280); width: 12px; flex: none; text-align: center; }
.auth-rules li.ok { color: var(--muted, #9AA1AC); }
.auth-rules li.ok::before { content: "\2713"; color: #6FCF97; }
.auth-box .btn[disabled] { opacity: .45; cursor: not-allowed; }

/* The owner's side of the no-mail path: pick an account, make the link. */
.auth-mint { display: flex; flex-direction: column; gap: 10px; }
.auth-mint select { background: var(--bg, #0B0C0E); border: 1px solid var(--line, #23262F); border-radius: 8px; padding: 11px 14px; color: var(--text, #F2F3F5); font: inherit; font-size: .94rem; width: 100%; }
.auth-out { background: var(--bg, #0B0C0E); border: 1px solid var(--line, #23262F); border-radius: 8px; padding: 12px 14px; color: var(--text, #F2F3F5); font-family: var(--mono, ui-monospace, monospace); font-size: .8rem; word-break: break-all; line-height: 1.5; }
.auth-warn { color: #E79A96; font-size: .84rem; line-height: 1.5; }
