:root{
  /* base */
  --petroleo: #0F2A38;
  --petroleo-escuro: #0A1D27;
  --off-white: #F7F5F0;
  --areia: #E7E4DD;
  --latao: #B08A4A;
  --latao-escuro: #8E6E38;

  /* alfas derivados (unicos tons de apoio permitidos) */
  --regua-clara: rgba(15,42,56,0.08);
  --regua-clara-forte: rgba(15,42,56,0.14);
  --regua-escura: rgba(247,245,240,0.10);
  --regua-escura-forte: rgba(247,245,240,0.22);

  /* semanticos */
  --color-primary: var(--petroleo);
  --color-primary-dark: var(--petroleo-escuro);
  --color-background: var(--off-white);
  --color-background-muted: var(--areia);
  --color-surface-dark: var(--petroleo);
  --color-accent: var(--latao);
  --color-accent-hover: var(--latao-escuro);

  --color-text: var(--petroleo);
  --color-text-muted: rgba(15,42,56,0.65);
  --color-text-faint: rgba(15,42,56,0.50);
  --color-text-on-dark: var(--off-white);
  --color-text-on-dark-muted: rgba(247,245,240,0.72);
  --color-text-on-dark-faint: rgba(247,245,240,0.50);

  --color-rule: var(--regua-clara);
  --color-rule-on-dark: var(--regua-escura);
  --color-focus: var(--latao);
}