/* #71 - a folha da tela de entrar (web/login.html), que saiu do <style> da pagina: CSS inline e proibido (#5542) */
html, body { margin:0; min-height:100vh; background:var(--bg); font-family:var(--font); color:var(--ink); }
.palco { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px; }
.cartao { width:100%; max-width:380px; background:var(--surface); border-radius:var(--r-card-l);
  box-shadow:var(--sh-2); padding:34px 30px; animation:hs-fade-up .25s ease-out; }
.logo { width:54px; height:54px; border-radius:15px; margin:0 auto 14px;
  background:linear-gradient(135deg, color-mix(in srgb, var(--brand) 72%, var(--surface)), var(--brand));
  display:flex; align-items:center; justify-content:center; color:var(--accent-fg);
  font-weight:800; font-family:var(--font-display); font-size:var(--fs-titulo); }
.logo-marca { padding:9px; overflow:hidden; }
.logo-marca img { width:100%; height:100%; object-fit:contain; display:block; }
h1 { font-family:var(--font-display); font-size:var(--fs-titulo); font-weight:800; text-align:center; margin:0 0 2px; }
.sub { text-align:center; font-size:var(--fs-corpo); color:var(--ink-3); margin:0 0 24px; }
/* #71 - o aviso aparece e some pelo atributo hidden: sem display aqui, o hidden vence */
.erro { background:var(--rose-bg); color:var(--rose); font-size:var(--fs-corpo); font-weight:600;
  border-radius:11px; padding:10px 13px; margin-bottom:14px; }
.ok { background:var(--green-bg); color:var(--green); font-size:var(--fs-corpo); font-weight:600;
  border-radius:11px; padding:10px 13px; margin-bottom:14px; }
.senha-wrap { position:relative; }
.senha-wrap .hs-input { padding-right:42px; }
.ver-senha { position:absolute; right:6px; top:50%; transform:translateY(-50%);
  width:32px; height:32px; border:none; background:none; cursor:pointer; color:var(--ink-3);
  display:flex; align-items:center; justify-content:center; border-radius:8px; }
.ver-senha:hover { background:var(--surface-2); color:var(--ink-2); }
.link-leve { background:none; border:none; cursor:pointer; color:var(--accent-ink,var(--brand)); font-size:var(--fs-corpo);
  font-weight:600; font-family:inherit; padding:0; }
.link-leve:hover { text-decoration:underline; }
/* #318 - o botao leve tem alvo de 24 px de altura (WCAG 2.5.8); o link dentro de uma frase fica de fora, pela excecao da norma */
button.link-leve { min-height:24px; padding:4px 8px; border-radius:6px; }