style conflicts in editor when duplicating or using block pattern

I have a block pattern using a Stackable container which has a background color. If I add the same block pattern to the same page, or if I duplicate the Container once it’s on the page, I am getting weird style conflicts on the back end.

In this first screenshot, I added the block pattern as the top block. Then I added a second instance of the same block pattern (second block). Then I used the block duplicate option on the second block to create the third block.

Then I changed the background color on the second block. But as you can see, although the Options panel registered the new background color, it’s still showing orange in the editor:

Then I changed the background color on the third block, the one that was duplicated from the second block. Doing that caused all three blocks to display as the new background color:

on the front end, each picks up its respective correct background color:

which is better than not picking up the right colors, but obviously, it’s now impossible to tell on the back end what color each block is supposed to be.

Looking at the source code, it appears that on the back end, all three blocks are being assigned the same ID (stk-aac488e). But on the front end, only the first instance keeps that ID, and the other two blocks get unique IDs. But even if I save the page and then go back and edit it later, the back end never picks up the new IDs, so the styles all conflict. This persists even if I do a Clear cache & hard reload.

Any idea what’s going on? Thank you.

The page I need help with: [log in to see the link]