:root{
  /* --- Base palette, sampled from the pack and campaign titles --- */
  --teal-900:#0E3C43;
  --teal-800:#14505A;
  --teal-700:#1B636D;   /* primary brand teal, pack background */
  --teal-600:#2A7B85;
  --teal-400:#6FAFB5;
  --teal-200:#B9D8DB;
  --teal-100:#DDEBEC;

  --clay-700:#8E2C1F;
  --clay-600:#B23A2A;   /* wordmark red, accent only */
  --clay-300:#DDA096;

  --gold-600:#C79A12;
  --gold-500:#E8B820;   /* highlight gold */
  --gold-200:#F5E0A0;
  --gold-100:#FBF1D4;

  --cream-100:#FBF7F1;
  --cream-200:#F5EFE6;  /* label cream, default page ground */
  --cream-300:#EBE2D4;
  --cream-400:#DCD0BD;

  --white:#FFFFFF;
  --ink-900:#1D2321;
  --ink-700:#3C4744;
  --ink-500:#6B7775;
  --ink-300:#A7B0AE;

  --success-600:#3F7D4E;
  --warning-600:#C7871A;
  --danger-600:#B23A2A;

  /* --- Semantic aliases --- */
  --brand:var(--teal-700);
  --brand-strong:var(--teal-900);
  --brand-soft:var(--teal-100);
  --brand-accent:var(--clay-600);
  --brand-highlight:var(--gold-500);

  --text-heading:var(--teal-900);
  --text-body:var(--ink-700);
  --text-muted:var(--ink-500);
  --text-on-brand:var(--cream-100);
  --text-on-brand-muted:var(--teal-200);
  --text-link:var(--teal-700);
  --text-link-hover:var(--clay-600);

  --surface-page:var(--cream-200);
  --surface-card:var(--white);
  --surface-card-soft:var(--cream-100);
  --surface-brand:var(--teal-700);
  --surface-brand-deep:var(--teal-900);
  --surface-field:var(--white);

  --border-soft:var(--cream-400);
  --border-strong:var(--teal-200);
  --border-brand:var(--teal-700);
  --border-field:var(--cream-400);

  --focus-ring:var(--gold-500);

  /* --- Gradients: the brand never uses a hard edge between grounds --- */
  --grad-teal-to-cream:linear-gradient(180deg,var(--teal-700) 0%,var(--teal-600) 42%,var(--teal-200) 78%,var(--cream-200) 100%);
  --grad-cream-to-teal:linear-gradient(180deg,var(--cream-200) 0%,var(--teal-100) 30%,var(--teal-600) 70%,var(--teal-700) 100%);
  --grad-cream-lift:linear-gradient(180deg,var(--cream-100) 0%,var(--cream-200) 100%);
  --grad-button:linear-gradient(180deg,var(--teal-600) 0%,var(--teal-700) 100%);
  --grad-button-hover:linear-gradient(180deg,var(--teal-700) 0%,var(--teal-800) 100%);
  --grad-gold-tag:linear-gradient(180deg,var(--gold-500) 0%,var(--gold-600) 100%);
  --grad-card-brand:linear-gradient(160deg,var(--teal-700) 0%,var(--teal-900) 100%);
  --grad-veil:linear-gradient(180deg,rgba(14,60,67,0) 0%,rgba(14,60,67,.55) 100%); /* @kind color */
}