Popper.js Adds Unintended 24px Offset with position: fixed

I’m encountering an issue when using Popper.js in conjunction with a fixed-positioned element.

Situation:

• I have a <div> element with position: fixed and top: 24px:

  <div id="fixed-element" style="position: fixed; top: 24px;">
    <!-- Content -->
  </div>
  

• Below this element, I place another <div> that I want to position using Popper.js with strategy: 'fixed':

  const reference = document.querySelector('#fixed-element');
  const popper = document.createElement('div');
  document.body.appendChild(popper);
  
  Popper.createPopper(reference, popper, {
    strategy: 'fixed',
    modifiers: [
      {
        name: 'offset',
        options: {
          offset: [0, 10],
        },
      },
    ],
  });
  

Problem:
When I apply Popper.js, it automatically adds the existing 24px from the top property to the specified offset. This results in the popper element being positioned 24px lower than intended. I want Popper to account for the existing 24px and only apply the specified offset.

Question:
Is there a way to configure Popper.js to consider the 24px top position, or can I retrieve this value and adjust the offset manually? Alternatively, is there a better approach to handle this positioning with fixed elements?