:root {
  /* base */
  --bf-ink:        #16181D;   /* text, mark, dark surface */
  --bf-paper:      #FBFCF7;   /* reading ground, slightly warm */
  --bf-card:       #FFFFFF;   /* feed card, pure white on the paper */
  --bf-paper-2:    #F1F2F4;   /* tinted surface, source card */
  --bf-mute-strong:#53575E;   /* linha de apoio — 7:1, where --bf-mute sits at 4.8 */
  --bf-rule:       #E3E5E9;   /* dividers, borders */
  --bf-graphite:   #33373F;   /* long-form body text */
  --bf-mute:       #6B7079;   /* labels, meta */

  --bf-quote-tint: rgba(124, 92, 214, 0.10);  /* realce da citação; 18% no escuro */
  --bf-sector:      #A04CAE;  /* chapéu, por setor — #6062AC Tecnologia; paleta em aberto */
  --bf-sector-dark: #C85FDA;  /* o par escuro; o claro cai a 3,44:1 sobre a superfície escura */

  /* dark mode — own warm surface, never the inverted ink */
  --bf-paper-dark:       #1A1A15;
  --bf-card-dark:        #1F1F1A;
  --bf-paper-2-dark:     #24241F;
  --bf-rule-dark:        #363630;
  --bf-ink-dark:         #EEEEE6;   /* 15,0:1 */
  --bf-graphite-dark:    #CECEC7;   /* 11,0:1 */
  --bf-mute-strong-dark: #A5A59F;   /* 7,1:1 */
  --bf-mute-dark:        #8A8A84;   /* 5,0:1 */
  --bf-violet-dark:      #8F6AF6;   /* 4,6:1 */

  /* signal — accent only, never a page background */
  --bf-violet:     #7C5CD6;   /* ativo, link, seleção, progresso */
  /* rótulo de 10 px sobre Papel 2 usa o par escuro: o Violeta cai de 4,67 para 4,30 ali */
  --bf-violet-700: #5B43A6;   /* hover, signal surface */
  --bf-magenta:    #B945C9;   /* alerta editorial, raro — SÓ em área grande */
  --bf-magenta-strong: #A83FB7;  /* corpo pequeno: o Magenta claro fica em 3,94:1 no Papel 2 e 4,41 no branco */

  /* type */
  --bf-font-ui:    'Manrope', system-ui, sans-serif;
  --bf-font-read:  'Bitter', Georgia, serif;

  /* reading scale — entrelinha cresce com a medida, diminui com o corpo */
  --bf-lh-titulo:        1.15;
  --bf-lh-apoio:         1.5;
  --bf-lh-pontos:        1.45;
  --bf-lh-corpo-mobile:  1.55;
  --bf-lh-corpo-desktop: 1.65;
  --bf-lh-citacao:       1.55;
  --bf-lh-legenda:       1.6;
  --bf-lh-inter:         1.3;

  /* vãos verticais — múltiplos do corpo base de 18 px, nunca px fixo.
     Em CSS cada um vira em dividido pelo corpo do próprio elemento:
     a legenda em 14 px leva 0.714em para render os mesmos 10 px. */
  --bf-gap-paragrafo:    1.444em;  /* 26 px no base */
  --bf-gap-pontos:       1em;      /* 18 px */
  --bf-gap-inter-antes:  1.889em;  /* 34 px, no intertítulo de 18 px */
  --bf-gap-inter-regua:  0.889em;  /* 16 px, idem */
  --bf-gap-inter-depois: 0.667em;  /* 12 px, idem */

  /* coluna de leitura */
  --bf-col-padding:      1.222em; /* 22 px no base — a coluna de 345 px em 390 sai daqui */
  --bf-col-max:          34em;   /* desktop: ~68 caracteres */

  /* mark geometry, in viewBox units */
  --bf-mark-w:     113.50;
  --bf-mark-h:     90.50;
  --bf-mark-bar:   6.60;
  --bf-mark-unit:  11.99;
}