/* ===========================================================================
   EXPERIMENTO — tipografia plana (05/08/2026; recalibrada em 16/08/2026)

   Um tamanho só. A hierarquia passa a ser carregada por tom de cinza, espaço,
   ritmo — e, desde 16/08, por UM degrau de peso nos títulos. É uma pergunta de
   craft ("o documento se sustenta sem escala tipográfica?"), não um estado
   estável do design system.

   Revisão de 16/08/2026 — calibração contra emilkowal.ski, medida em Chrome
   real (não a olho): Emil roda um tamanho só (16px) mas NÃO um peso só —
   corpo e títulos de item em 400, títulos de seção e nome em 500. O achatamento
   total de peso (460 em tudo, versão de 05/08) tirava um eixo que ele mantém,
   e o 1.08rem/460 sobre uma coluna de 560px lia mais cheio do que a página
   dele. Então: 1rem (16px), corpo 400, títulos 500 — os mesmos números dele.
   A coluna subiu junto pra 640px em main.css (medida ≈ 40em, a dele é 644).

   COMO REVERTER: apague a linha

       <link rel="stylesheet" href="/styles/experiments/flat-type.css">

   do <head> do index.html (e, se quiser, este arquivo). Nada em `main.css` nem
   em `tokens/` foi apagado ou reescrito por causa disto — este arquivo só
   redeclara tokens depois deles, então tirar o <link> devolve o site ao estado
   anterior sem nenhum outro passo.

   O <link> precisa vir DEPOIS de main.css. Não dá pra fazer isto com @import
   dentro de main.css: `@import` tem que preceder todas as regras do arquivo, e
   aí os tokens originais é que ganhariam por ordem de cascata.
   =========================================================================== */

:root {
  /* A escala inteira colapsa num degrau só. Os nomes ficam (`--fs-11` etc.)
     porque `main.css` os consome por toda parte — o experimento é achatar os
     valores, não reescrever os pontos de consumo. 1rem = 16px, o mesmo do
     Emil (era 1.08rem até 16/08/2026 — ver o cabeçalho). */
  --fs-11: 1rem;
  --fs-12: 1rem;
  --fs-13: 1rem;
  --fs-14: 1rem;
  --fs-15: 1rem;
  --fs-16: 1rem;

  /* Dois pesos, não um: 400 pro corpo e pra tudo que `main.css` marca como
     regular/medium (nome na linha, label, status — no Emil o título de um item
     é 400 preto contra a descrição 400 cinza, e é o bastante), e 500 só onde
     `main.css` pede semibold (h1, h2, h3 das fases, títulos de painel/modal,
     nome no perfil). É o par exato do site dele. Geist entra pelo Google Fonts
     como variável (`font-weight: 100 900`), então 500 é instância real. */
  --fw-regular: 400;
  --fw-medium: 400;
  --fw-semibold: 500;

  /* Sem tamanho, o cinza continua sendo o eixo principal — e a rampa
     original foi calibrada para dividir o trabalho com escala e peso. `--ink`
     fica onde estava (título/nome/link) e `--faint` também (meta: status,
     label, numeração, footer); o degrau do meio desce de 0.52 pra 0.48 para
     abrir a distância até `--faint` e deixar os três níveis lidos de relance
     (o cinza do Emil, rgb(99,99,94), fica em L≈0.49 — mesmo lugar). De quebra
     o texto corrido ganha contraste: ~5.3:1 contra o fundo, antes ~4.6:1. */
  --muted: oklch(0.48 0 0);
}

/* O peso de corpo nasce no `body`, de onde todo mundo herda; os tokens acima
   cuidam de quem redeclara. Hoje é 400 (= o `normal` do browser), então a
   regra parece redundante — fica porque é o ponto único de decisão: se o
   corpo voltar a subir, é aqui que muda, não em cem seletores. */
body {
  font-weight: var(--fw-regular);
}

/* Controles de formulário não herdam tipografia do documento — o UA stylesheet
   planta `font: 400 <tamanho> <família>` neles. `main.css` já reescreve família
   e tamanho um a um (`font-family: inherit`), mas nunca precisou tocar no peso.
   Herdar mantém o `.see-more` e o input do palette no mesmo peso do texto ao
   redor, hoje e se o corpo mudar de novo. */
button,
input,
textarea,
select {
  font-weight: inherit;
}

/* Num tamanho só, o nome de uma pessoa pode não caber na linha do palette e
   quebrar em duas, empurrando a altura do item. A peça desenhada pra ceder ali
   é o `.what` do lado (já tem `flex-shrink` e ellipsis) — só faltava dizer que
   o nome não cede. Mora aqui, e não em `main.css`, porque o aperto é do
   experimento: em 15px a linha cabia inteira. */
.cmd__item > span:first-child {
  flex-shrink: 0;
  white-space: nowrap;
}

/* EXCEÇÃO PROPOSITAL: a intro fica de fora.

   `.intro__word` é o único `font-size` literal de `main.css` (1.2rem), e
   continua sendo — este arquivo não o toca. A saudação não divide página com
   nada: é uma palavra sozinha num overlay de tela cheia, antes do conteúdo
   existir. Ela não participa da hierarquia que o experimento está testando, e
   por isso não tem por que encolher junto.

   Consequência prática de não haver regra aqui: mexer nos `--fs-*` acima não
   move a intro. É de propósito — se um dia o experimento virar o padrão, a
   decisão de alinhar (ou não) a intro é uma conversa separada. */