/*
 * Tela de entrada (login e 2º fator). Não carrega o tema inteiro nem o
 * Bootstrap: é a primeira coisa que abre no celular, então vai leve.
 * Campo é qualquer tipo de texto — o login aceita e-mail OU telefone, e
 * o olhinho vira a senha em type=text: estilizar só email/password
 * deixava a tela crua (14/09).
 */

*{box-sizing:border-box}
body{
  font-family:var(--fonte);font-size:15px;color:var(--tinta);margin:0;
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:
    radial-gradient(1200px 500px at 50% -10%, var(--ag-evento-fundo), transparent 70%),
    var(--papel);
  padding:calc(20px + env(safe-area-inset-top,0px)) 16px 40px;
}
.caixa{
  width:100%;max-width:400px;background:var(--n-0);
  border:1px solid var(--linha);border-radius:var(--raio-g);
  box-shadow:0 18px 40px rgba(39,51,143,.10), var(--sombra-1);
  padding:28px 26px 22px;
}
.marca{display:flex;align-items:center;gap:12px;margin-bottom:22px}
.marca .logo-app{width:46px;height:46px;flex:0 0 46px;border-radius:12px;
  display:block}
.marca b{font-size:1.1rem;display:block;line-height:1.2}
.marca small{color:var(--tinta-2);font-size:.78rem}
h1{font-size:1.3rem;margin:0 0 4px;letter-spacing:-.01em}
.sub{color:var(--tinta-2);font-size:.88rem;margin:0 0 20px;line-height:1.45}

label{display:block;margin-bottom:14px}
label span{display:block;font-size:.8rem;font-weight:600;
  color:var(--tinta-2);margin-bottom:6px}
input:not([type=checkbox]):not([type=radio]):not([type=hidden]){
  width:100%;height:46px;padding:0 13px;border:1px solid var(--linha);
  border-radius:10px;font-size:1rem;color:var(--tinta);font-family:inherit;
  background:var(--n-0);transition:border-color .15s, box-shadow .15s;
}
input:focus{outline:0;border-color:var(--cor-primaria);
  box-shadow:0 0 0 4px var(--ag-evento-fundo)}
button[type=submit]{
  width:100%;height:48px;margin-top:4px;background:var(--cor-primaria);
  color:var(--n-0);border:0;border-radius:10px;font-size:1rem;
  font-weight:700;cursor:pointer;font-family:inherit;
  transition:background .15s;
}
button[type=submit]:hover{background:var(--cor-primaria-escura)}

.flash{
  background:var(--info-fundo);border:1px solid var(--info-borda);
  color:var(--info-texto);border-radius:10px;padding:11px 13px;
  font-size:.86rem;margin-bottom:16px;line-height:1.45;
}
.flash.erro{background:var(--erro-fundo);border-color:var(--erro-borda);
  color:var(--erro-texto)}
.flash.ok{background:var(--ok-fundo);border-color:var(--ok-borda);
  color:var(--ok-texto)}
.rodape{
  margin-top:20px;padding-top:14px;border-top:1px solid var(--linha);
  font-size:.82rem;color:var(--tinta-2);line-height:1.5;
}
.rodape a{color:var(--cor-primaria);font-weight:600;text-decoration:none}