/* Telas de conta (entrar, trocar senha, painel do administrador). Ficam abertas, sem login: não usar arquivos de fiscal/. */
:root {
  --fundo: #04070a; --fundo2: #081116; --cartao: #0c171c;
  --new-escuro: #003d49; --new: #037780; --new-claro: #0a96a1; --new-gelo: #8cbbbb;
  --destaque: #2ed3e0; --ok: #43e08f; --aviso: #ffb347; --erro: #ff6b6b;
  --texto: #eef5f6; --apagado: #7b8f94; --linha: rgba(140, 220, 225, .14);
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(ellipse at 70% 0%, #0a2a31 0%, var(--fundo) 60%); color: var(--texto);
  font-family: "Outfit", "Segoe UI", system-ui, sans-serif; }
a { color: var(--destaque); }
button, input, select { font: inherit; }
.marca { display: flex; align-items: center; gap: 12px; font-weight: 800; letter-spacing: .02em; color: var(--texto); text-decoration: none; }
.marca svg { width: 42px; }
.marca small { display: block; font-size: 11px; letter-spacing: .3em; color: var(--new-gelo); font-weight: 500; }

/* cartão central (entrar / trocar senha) */
.centro { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; }
.cartao { width: 100%; max-width: 400px; background: rgba(12, 23, 28, .92); border: 1px solid var(--linha); border-radius: 16px; padding: 32px 28px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .55); }
.cartao h1 { font-size: 22px; margin: 26px 0 6px; }
.cartao p.sub { margin: 0 0 22px; color: var(--apagado); font-size: 14px; line-height: 1.5; }
label { display: block; font-size: 13px; color: var(--new-gelo); margin: 14px 0 6px; }
input[type=text], input[type=password] { width: 100%; padding: 12px 14px; border-radius: 9px; border: 1px solid #23414a; background: #071014; color: var(--texto); outline: none; }
input:focus { border-color: var(--destaque); box-shadow: 0 0 0 3px rgba(46, 211, 224, .18); }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 20px; border: 0; border-radius: 9px; cursor: pointer; font-weight: 600;
  background: var(--destaque); color: #001214; }
.btn.largo { width: 100%; margin-top: 22px; }
.btn.sec { background: rgba(140, 187, 187, .16); color: var(--texto); }
.btn.peq { padding: 7px 12px; font-size: 13px; }
.btn:disabled { opacity: .55; cursor: default; }
.erro { color: var(--erro); font-size: 14px; min-height: 20px; margin-top: 12px; }
.rodape { margin-top: 22px; font-size: 12px; color: var(--apagado); text-align: center; }