/* /frontend/css/auth.css — estilos compactos para login/register/MFA */
:root{
  --bg:#0f1116;--card:#1a1c24;--primary:#3886f5;--danger:#ff5353;
  --text:#f7f7f7;--muted:#ffffff80;--radius:14px;--gap:1.4rem;
  --font:'Segoe UI',system-ui,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
body{
  min-height:100vh;background:var(--bg);color:var(--text);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font);padding:1rem;
}
.auth-card{
  width:100%;max-width:420px;background:var(--card);
  border-radius:var(--radius);box-shadow:0 10px 30px rgba(0,0,0,.55);
  display:flex;flex-direction:column;gap:var(--gap);padding:var(--gap);
  text-align:center;
}
.auth-logo{width:160px;margin:0 auto 4px}
.auth-title{font-size:2rem;font-weight:700}
.auth-sub{font-size:.9rem;color:var(--muted)}
.auth-field{display:flex;flex-direction:column;text-align:left;gap:.3rem}
label{font-size:.85rem}
input{
  width:100%;padding:.75rem 1rem;background:#2b2d36;border:2px solid transparent;
  border-radius:var(--radius);color:var(--text);font-size:1rem;
}
input:focus{outline:none;border-color:var(--primary)}
.auth-btn{
  background:var(--primary);border:none;border-radius:var(--radius);
  padding:.85rem;font-weight:600;font-size:1rem;color:#fff;cursor:pointer;
  transition:filter .15s;
}
.auth-btn:hover{filter:brightness(1.1)}
.auth-error{
  display:none;background:var(--danger);border-radius:var(--radius);
  padding:.65rem .9rem;font-size:.9rem;text-align:left;
}
a.link{color:var(--primary);text-decoration:none;font-size:.9rem}
a.link:hover{text-decoration:underline}
.text-small{font-size:.85rem}
@media(max-width:480px){.auth-card{padding:1.2rem}}
/* Toast (re-usable) */
#toast{
  position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%);
  padding:.8rem 1.2rem;border-radius:var(--radius);color:#fff;font-weight:600;
  opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;
}
#toast.show{opacity:1;transform:translate(-50%,-10px)}