/* Folha separada de proposito: a CSP mantem style-src 'self', entao <style>
   inline seria bloqueado. O tapume nao abre mao do cabecalho.

   Valores copiados de lp/styles.css para o tapume nao virar uma terceira casa
   da paleta. Tabela de tokens e razoes de contraste em lp/AGENTS.md. */
:root {
  color-scheme: light dark;
  --fundo: #FAF6F4;        /* --neutro-quente */
  --texto: #151312;        /* --bruno-preto-quente */
  --texto-suave: #6B625E;  /* --cinza-quente, 5,94:1 sobre branco */
  --borda: #E4DCD8;
  --acento: #FF5A36;       /* --bruno-coral */
}
@media (prefers-color-scheme: dark) {
  :root {
    --fundo: #151312;
    --texto: #F6F2F0;
    --texto-suave: #BCB0AB;
    --borda: #332C29;
  }
}
/* Load-bearing: body soma min-height 100vh e padding, que em content-box
   passariam da viewport e criariam rolagem. */
* { box-sizing: border-box; }
body {
  margin: 0;
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 2rem 1rem;
  background: var(--fundo);
  color: var(--texto);
  font: 1rem/1.6 system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}
main { max-width: 32rem; }
/* Nome proprio: .marca e classe compartilhada entre LP e blog, com outras
   regras (lp/styles.css). O ponto coral e a assinatura da marca. */
.tapume__marca {
  margin: 0 0 1.75rem;
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: -0.03em;
}
.tapume__ponto { color: var(--acento); }
h1 {
  margin: 0 0 1rem;
  font-size: 1.5rem;
  line-height: 1.25;
  letter-spacing: -0.01em;
}
p { margin: 0 0 1rem; }
.fraco {
  margin: 1.5rem 0 0;
  padding-top: 1.25rem;
  border-top: 1px solid var(--borda);
  color: var(--texto-suave);
  font-size: 0.875rem;
}