:root {
  --brand-color: hsl(149, 97%, 27%);
  --brand-h: 149;
  --brand-s: 97%;
  --brand-l: 27%;
  --primary-h: var(--brand-h);
  --primary-s: var(--brand-s);
  --primary-l: var(--brand-l);
  --primary-50:  calc(var(--primary-h) - 30), calc(var(--primary-s) - 25%), calc(var(--primary-l) + 65%);
  --primary-100: calc(var(--primary-h) - 24), calc(var(--primary-s) - 20%), calc(var(--primary-l) + 52%);
  --primary-200: calc(var(--primary-h) - 18), calc(var(--primary-s) - 15%), calc(var(--primary-l) + 39%);
  --primary-300: calc(var(--primary-h) - 12), calc(var(--primary-s) - 10%), calc(var(--primary-l) + 26%);
  --primary-400: calc(var(--primary-h) - 6), calc(var(--primary-s) - 5%), calc(var(--primary-l) + 13%);
  --primary-500: var(--primary-h), var(--primary-s), var(--primary-l);
  --primary-600: calc(var(--primary-h) + 0), calc(var(--primary-s) + 0%), calc(var(--primary-l) - 5%);
  --primary-700: calc(var(--primary-h) + 0), calc(var(--primary-s) + 0%), calc(var(--primary-l) - 10%);
  --primary-800: calc(var(--primary-h) + 0), calc(var(--primary-s) + 0%), calc(var(--primary-l) - 15%);
  --primary-900: calc(var(--primary-h) + 0), calc(var(--primary-s) + 0%), calc(var(--primary-l) - 20%);
  --secondary-color: hsl(34, 97%, 48%);
  --secondary-h: 34;
  --secondary-s: 97%;
  --secondary-l: 48%;
  --in-play-h: var(--secondary-h);
  --in-play-s: var(--secondary-s);
  --in-play-l: var(--secondary-l);
}
