/* m2i design system - tipografia
   Gerado por build_type.py. NAO editar a mao: rode o script.
   Work Sans + Roboto Mono, ambas no Google Fonts. */

@import url('https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Roboto+Mono:wght@400;500&display=swap');

:root {
  --m2i-sans: 'Work Sans', 'Helvetica Neue', Arial, sans-serif;
  --m2i-mono: 'Roboto Mono', ui-monospace, 'SF Mono', Consolas, monospace;

  /* A mono tem altura-x +5.7% em relacao a sans. Sem este fator,
     mono e sans no mesmo px NAO parecem do mesmo tamanho. */
  --m2i-mono-escala: 0.946;

  /* --- produto: interface densa ----------------------------------- */
  /* cabeçalho de coluna, rótulo de KPI (CAIXA ALTA) */
  --m2i-produto-rotulo: 600 11px/1.3 var(--m2i-sans);
  --m2i-produto-rotulo-ls: +0.080em;
  /* texto auxiliar, carimbo de tempo */
  --m2i-produto-legenda: 400 12px/1.45 var(--m2i-sans);
  --m2i-produto-legenda-ls: +0.005em;
  /* só densidade extrema — NÃO para leitura */
  --m2i-produto-densa: 400 13px/1.45 var(--m2i-sans);
  --m2i-produto-densa-ls: +0.003em;
  /* célula de tabela — o padrão */
  --m2i-produto-tabela: 400 14px/1.5 var(--m2i-sans);
  --m2i-produto-tabela-ls: +0.000em;
  /* texto de interface, formulário */
  --m2i-produto-corpo: 400 15px/1.6 var(--m2i-sans);
  --m2i-produto-corpo-ls: +0.000em;
  /* ênfase dentro do corpo */
  --m2i-produto-corpo-forte: 600 15px/1.6 var(--m2i-sans);
  --m2i-produto-corpo-forte-ls: +0.000em;
  /* título de cartão */
  --m2i-produto-titulo-cartao: 600 16px/1.4 var(--m2i-sans);
  --m2i-produto-titulo-cartao-ls: -0.003em;
  /* título de painel */
  --m2i-produto-titulo-painel: 600 18px/1.35 var(--m2i-sans);
  --m2i-produto-titulo-painel-ls: -0.005em;
  /* título de tela */
  --m2i-produto-titulo-pagina: 600 24px/1.25 var(--m2i-sans);
  --m2i-produto-titulo-pagina-ls: -0.010em;
  /* valor de KPI */
  --m2i-produto-metrica: 500 calc(28px * var(--m2i-mono-escala))/1.1 var(--m2i-mono);
  --m2i-produto-metrica-ls: -0.020em;
  /* valor de KPI em destaque */
  --m2i-produto-metrica-grande: 500 calc(34px * var(--m2i-mono-escala))/1.05 var(--m2i-mono);
  --m2i-produto-metrica-grande-ls: -0.025em;
  /* valor, ID, data, referência normativa */
  --m2i-produto-dado: 400 calc(14px * var(--m2i-mono-escala))/1.5 var(--m2i-mono);
  --m2i-produto-dado-ls: +0.000em;
  /* ID em tabela densa */
  --m2i-produto-dado-pequeno: 400 calc(12px * var(--m2i-mono-escala))/1.45 var(--m2i-mono);
  --m2i-produto-dado-pequeno-ls: +0.000em;

  /* --- comunicacao: relatorio, proposta, capa ---------------------- */
  /* texto corrido de relatório e proposta */
  --m2i-comunicacao-corpo: 400 17px/1.65 var(--m2i-sans);
  --m2i-comunicacao-corpo-ls: +0.000em;
  /* parágrafo de abertura */
  --m2i-comunicacao-destaque: 400 20px/1.55 var(--m2i-sans);
  --m2i-comunicacao-destaque-ls: +0.000em;
  /* subtítulo */
  --m2i-comunicacao-h3: 500 24px/1.3 var(--m2i-sans);
  --m2i-comunicacao-h3-ls: -0.010em;
  /* título de seção */
  --m2i-comunicacao-h2: 500 34px/1.15 var(--m2i-sans);
  --m2i-comunicacao-h2-ls: -0.020em;
  /* título de documento */
  --m2i-comunicacao-h1: 500 42px/1.1 var(--m2i-sans);
  --m2i-comunicacao-h1-ls: -0.025em;
  /* capa */
  --m2i-comunicacao-display: 500 52px/1.05 var(--m2i-sans);
  --m2i-comunicacao-display-ls: -0.030em;
  /* capa de impacto — único uso do peso 700 */
  --m2i-comunicacao-display-grande: 700 64px/1.0 var(--m2i-sans);
  --m2i-comunicacao-display-grande-ls: -0.035em;

  /* --- medida ------------------------------------------------------ */
  --m2i-medida:       68ch;   /* texto corrido: 65-75 caracteres */
  --m2i-medida-curta: 46ch;   /* coluna estreita, legenda */
}

/* Numero em coluna SEMPRE alinha. Sem isso a tabela dança. */
.m2i-dado, .m2i-metrica, table td, table th { font-variant-numeric: tabular-nums; }