/* "Esqueci minha senha" e "Confirme seu e-mail" na tela de entrar (conta_email.js); o mesmo cartao da tela de entrar */
.ce { text-align: center; }
.ce h2 { margin: 2px 0 10px; font-size: 18px; }
.ce p { margin: 0 0 10px; }
.ce .field, .ce input { text-align: left; }
.ce-ico { display: grid; place-items: center; width: 52px; height: 52px; margin: 2px auto 10px; border-radius: 50%;
  background: rgba(216, 166, 74, .12); border: 1px solid rgba(216, 166, 74, .4); color: var(--gold-2); }
.ce-ico svg { width: 26px; height: 26px; }
.ce-email { padding: 9px 12px; border: 1px solid var(--line); border-radius: 8px; background: #0c0e14; color: var(--txt);
  font-weight: 700; overflow-wrap: anywhere; }
.ce-dica { font-size: 13.5px; line-height: 1.45; }
.ce-aviso { padding: 9px 12px; border: 1px solid #a3332b; border-radius: 8px; background: #3a1210; color: #ffb4a8;
  font-size: 13.5px; line-height: 1.45; text-align: left; }
/* botoes de 44 px (dedo no celular) */
.ce-b { min-height: 44px; }
.ce .ce-b + .ce-b { margin-top: 10px; }
.ce-voltar { display: block; min-height: 44px; margin: 8px auto 0; padding: 0 16px; border: 0; background: none; color: var(--dim);
  font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.ce-voltar:hover { color: var(--txt); }
/* o link "Esqueci minha senha" embaixo do Entrar */
.ce-esqueci { display: block; min-height: 44px; margin: 6px auto -6px; padding: 0 14px; border: 0; background: none; color: var(--gold-2);
  font-size: 14px; font-weight: 600; }
.ce-esqueci:hover { text-decoration: underline; text-underline-offset: 3px; }
.ce-esqueci[hidden] { display: none; }