/*
 * public/m33-static/auth-pages.css — the forgot-password and reset-password
 * pages (lib/views/htmls/login/account.ejs; ADR 0082 D5, rule 10a): the
 * login card's essential look over shell.css's tokens, so the three pages
 * read as one surface. Was the <style> block authPageShell() wrote in
 * lib/vega-auth-routes.js (ADR 0082 P3, sr-2); rules unchanged.
 *
 * Served from /m33/ and linked from login/account.ejs.
 */

.m33-login-page { background: #0a0c16; }
.m33-login-card { max-width: 380px; padding: 44px 36px 32px; border-radius: 14px; }
.m33-login-logo { width: 56px; height: 56px; }
.m33-login-logo-wrap { margin-bottom: 16px; }
.m33-login-title { font-size: 17px; margin: 0 0 4px; }
.m33-login-subtitle { font-size: 12px; margin-bottom: 24px; line-height: 1.5; }
.m33-login-form { gap: 16px; }
.m33-login-field { gap: 6px; }
.m33-login-field > span { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: var(--m33-text-muted); }
.m33-login-field input[type="email"],
.m33-login-field input[type="password"] {
  background: var(--m33-card); border: 1px solid var(--m33-border); border-radius: 8px;
  color: var(--m33-text); padding: 11px 13px; font-size: 14px;
  width: 100%; box-sizing: border-box; outline: none;
  transition: border-color 120ms, box-shadow 120ms; font-family: inherit;
}
.m33-login-field input:focus {
  border-color: var(--m33-accent); box-shadow: 0 0 0 3px color-mix(in oklab, var(--m33-accent) 20%, transparent 80%);
}
.m33-login-submit { margin-top: 6px; padding: 11px 16px; font-size: 13px; width: 100%; border-radius: 8px; font-weight: 500;
  background: transparent; border: 1px solid var(--m33-border, rgba(255,255,255,0.18)); color: var(--m33-text, #e0e0e0);
  cursor: pointer; transition: background 150ms, border-color 150ms; }
.m33-login-submit:hover { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.30); }
.m33-login-foot { margin-top: 18px; padding-top: 14px; text-align: center; }
.m33-login-foot a { color: var(--m33-text-muted); font-size: 12px; text-decoration: none; }
.m33-login-foot a:hover { color: var(--m33-text); }
.m33-flash-error { background: rgba(240,107,107,0.12); border: 1px solid rgba(240,107,107,0.4); color: #f0a0a0; border-radius: 8px; padding: 10px 12px; font-size: 12px; margin-bottom: 16px; line-height: 1.4; }
.m33-flash-ok { background: rgba(91,180,120,0.12); border: 1px solid rgba(91,180,120,0.4); color: #a0e0b8; border-radius: 8px; padding: 12px 14px; font-size: 13px; margin-bottom: 16px; line-height: 1.5; }
.m33-dev-link { font-family: ui-monospace, Menlo, monospace; font-size: 11px; word-break: break-all; background: rgba(0,0,0,0.35); border-radius: 6px; padding: 8px 10px; margin-top: 10px; }