/* ====== Shell e Card das telas de autenticação ====== */
.auth-shell{
  min-height:100vh;
  display:grid; place-items:center;
  padding:24px;
  background:var(--bg);
}
.auth-card{
  width:100%;
  max-width:720px;  /* => duas colunas confortáveis em notebook/desktop */
  padding:28px 24px;
}
.auth-header{ margin-bottom:8px }
.subtitle{ margin:4px 0 0; }

/* ====== Linhas de formulário e senha com "olho" ====== */
.password-row{ display:flex; gap:8px; align-items:center }
.password-row .input{ flex:1 }

/* Botão-ícone genérico (usa .btn e .btn-ghost do global) */
.btn-icon{ padding:10px 12px; line-height:1; }

/* Footer da auth (links) */
.auth-footer{
  margin-top:16px; text-align:center;
}

/* ====== Password meter ====== */
.pw-meter{
  height:6px; border-radius:6px; background:#f3f4f6;
  margin:8px 0 0; overflow:hidden;
}
.pw-meter::before{
  content:""; display:block; height:100%; width:0%;
  background:linear-gradient(90deg,#f59e0b,#16a34a);
  transition:width .25s ease;
}
.pw-meter[data-score="1"]::before{width:25%}
.pw-meter[data-score="2"]::before{width:50%}
.pw-meter[data-score="3"]::before{width:75%}
.pw-meter[data-score="4"]::before{width:100%}

/* Alias para compatibilidade com o JS existente (alert.error/success) */
.alert.error{background:#fff1f2; border-color:#fecdd3; color:#991b1b}
.alert.success{background:#ecfdf5; border-color:#a7f3d0; color:#065f46}

@media (prefers-reduced-motion: reduce){
  *{animation:none!important; transition:none!important}
}