/* Ponte para as páginas do servidor que ainda pedem /estilo.css (confirmar, sair, painel e inbox da equipe).
 * Os nomes antigos passam a apontar para os tokens da marca; nenhum valor de cor ou fonte é repetido aqui. */
@import url("/marca/tokens.css");
@import url("/marca/componentes.css");
@import url("/landing.css");

:root {
  --cor-acao: var(--principal);
  --cor-acao-escura: color-mix(in srgb, var(--principal) 86%, #000);
  --cor-sobre-acao: var(--giz);
  --cor-fundo: var(--giz);
  --cor-papel: var(--branco);
  --cor-texto: var(--grafite);
  --cor-texto-suave: var(--grafite-suave);
  --cor-linha: var(--pedra);
  --cor-erro: #8A1F12;
  --cor-piso: var(--principal);
  --fonte-marca: var(--f-display);
  --fonte-titulo: var(--f-display);
  --fonte-texto: var(--f-texto);
  --marca-peso: 800;
  --marca-espaco: -.02em;
  --piso-altura: 0px;
  --raio: var(--r-cartao);
  --u: var(--e2);
}

body { background: var(--giz); color: var(--grafite); font: 400 var(--t-texto)/1.5 var(--f-texto); }
.marca { font: 800 18px/1 var(--f-display); letter-spacing: -.02em; text-transform: lowercase; color: inherit; text-decoration: none; }
.campo { display: block; margin: 0 0 var(--e5); padding: 0; border: 0; }
.campo input[type=password], .campo input[type=text] { box-sizing: border-box; min-height: var(--alvo-toque); border: 1.5px solid var(--grafite); border-radius: var(--r-cartao); font: inherit; }