:root {
  --primary: #D83BF7;
  --secondary: #E8D030;
  --background: #292929;
  --foreground: #D6D6D6;

  --best-friends: 0.75rem;
  --friends: 1.5rem;
  --acquaintances: 3.5rem;
  --strangers: 6rem;
  --rounded-small: 0.5rem;
  --rounded-medium: 1rem;
  --rounded-large: 2rem;
  --rounded-full: 50%;

  --font-family: Lexend;
  --font-zoom-multiplier: 0.85;
}

@media (min-width: 768px) {
  :root {
    --best-friends-md: 1rem;
    --best-friends: var(--best-friends-md);
  }
}

@media (min-width: 1024px) {
  :root {
    --strangers-lg: 8rem;
    --strangers: var(--strangers-lg);
  }
}