/* Tokens do sistema visual. Nenhum seletor além de `:root` mora aqui.
 *
 * A REGRA QUE GOVERNA A PALETA: matiz carrega significado, e só três
 * significados competem por ele — ação (âncora), oração feita (recebido) e
 * pedido vencido (atenção). Nada mais ganha cor: nem pessoa, nem categoria,
 * nem decoração.
 *
 * E existe uma proibição que é a mais importante do arquivo: VERMELHO NÃO
 * APARECE EM TELA DE ROTINA. `--destrutivo` só existe dentro da confirmação de
 * "Remover pessoa". "Há 11 dias" em --tinta-2 é informação; a mesma frase em
 * vermelho é acusação, e um app de oração que acusa deixa de ser aberto — que
 * é a forma real como este projeto morre, muito antes de qualquer bug.
 *
 * Inversão consciente frente ao `agenda-presidencial`: lá o raio é 2px e o
 * canto é vivo, porque aquilo é um instrumento de medição. Aqui o raio é 14px,
 * porque isto é um objeto de mão, segurado às seis da manhã.
 *
 * Claro é o padrão (uso ao amanhecer). Escuro é automático (uso noturno).
 * Contrastes medidos contra --papel-1.
 */

:root {
  color-scheme: light dark;

  /* ------------------------------------------------------------- planos */
  --papel-0: #FBF8F3;   /* a página, papel morno */
  --papel-1: #FFFFFF;   /* cartão */
  --papel-2: #F3EEE5;   /* pressionado, seção recolhida, campo */
  --linha-1: #E7E0D4;   /* divisória, borda de cartão */
  --linha-2: #D3C9B8;   /* borda ativa, trilho */

  /* -------------------------------------------------------------- tinta */
  --tinta-1: #23201C;   /* 15.9:1 — texto primário, nomes */
  --tinta-2: #5A544C;   /*  7.3:1 — secundário, "há 2 dias" */
  --tinta-3: #857D73;   /*  4.6:1 — NÃO É CORPO. Rótulo e metadado só. */

  /* ------------------------------------- as três cores com significado */
  --ancora:       #3E4E8B;  /* 7.6:1 — ação, foco, cronômetro rodando */
  --ancora-alto:  #2E3C70;  /* pressionado */
  --ancora-tenue: #E8EAF4;  /* preenchimento de selecionado */

  --recebido:       #4E7A5E;  /* 5.4:1 — orei hoje. Sálvia, não neon. */
  --recebido-tenue: #E6EFE8;

  --atencao:       #A5722A;  /* 5.1:1 — pedido vencido. Âmbar, nunca vermelho */
  --atencao-tenue: #F6EEDF;

  /* Existe UM vermelho e ele só aparece na confirmação de remoção. */
  --destrutivo: #A33B34;

  /* --------------------------------------------------------- tipografia
   * Divisão SEMÂNTICA, não decorativa:
   *   serif = a pessoa (honrada)
   *   sans  = a interface (argumentada)
   *   mono  = o número (medido)
   */
  --fonte-serif: "IBM Plex Serif", Georgia, "Times New Roman", serif;
  --fonte-sans:  "IBM Plex Sans", system-ui, -apple-system, "Segoe UI",
                 Roboto, sans-serif;
  --fonte-mono:  "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo,
                 Consolas, monospace;

  --t-100: 0.875rem;    /* 14px — rótulo, metadado. NUNCA corpo. */
  --t-200: 1rem;        /* 16px — mínimo absoluto: abaixo disso o iOS dá zoom
                         *        ao focar um campo, e a tela salta. */
  --t-300: 1.1875rem;   /* 19px — CORPO PADRÃO */
  --t-400: 1.375rem;    /* 22px — texto de botão, subtítulo */
  --t-500: 1.625rem;    /* 26px — nome no cartão (serif) */
  --t-600: 2rem;        /* 32px — título de tela */
  --t-700: 2.75rem;     /* 44px — número do resumo (mono) */
  --t-800: 4rem;        /* 64px — cronômetro rodando (mono) */

  --lh-apertada: 1.05;
  --lh-titulo:   1.25;
  --lh-corpo:    1.6;
  --tr-numero:  -0.03em;

  /* ------------------------------------------------------------- espaço */
  --esp-1: 2px;  --esp-2: 4px;  --esp-3: 8px;   --esp-4: 12px;
  --esp-5: 16px; --esp-6: 24px; --esp-7: 32px;  --esp-8: 48px;

  --raio-1: 10px;    /* botão, campo */
  --raio-2: 14px;    /* cartão */
  --raio-cheio: 999px;

  /* --------------------------------------------------------------- toque
   * 56px está acima dos 44 do iOS e dos 48 do Material, de propósito: o app
   * é para ser usado por quem não tem intimidade com telefone.
   */
  --toque-min: 56px;
  --botao-alto: 64px;
  --check: 64px;

  /* ------------------------------------------------------------ movimento
   * Lento e assentado. Nada quica. Foco NUNCA é animado: quem navega por
   * teclado precisa saber onde está sem esperar por um quadro.
   */
  --dur-1: 120ms;
  --dur-2: 200ms;
  --dur-3: 320ms;
  --saida: cubic-bezier(0.22, 0.61, 0.36, 1);
}

@media (prefers-color-scheme: dark) {
  :root {
    --papel-0: #14161A;
    --papel-1: #1B1E23;
    --papel-2: #22262C;
    --linha-1: #2C3138;
    --linha-2: #3B424B;

    --tinta-1: #EDE8E0;
    --tinta-2: #A9A198;
    --tinta-3: #7D766E;

    --ancora:       #8FA4DC;
    --ancora-alto:  #A8B9E8;
    --ancora-tenue: #232A3C;

    --recebido:       #7FB394;
    --recebido-tenue: #1E2A23;

    --atencao:       #D6A45A;
    --atencao-tenue: #2C2519;

    --destrutivo: #E08078;
  }
}