Loosing css changes in customizer after saving the page

Hi

I’m trying to add some extra custom CSS rules in some elements through customizer in order to change the colour of the block shape at some theme variations (dark/light) I got.

In customizer additional CSS I’m using for example

For light version of the theme :

.light #section-2347f2a8-5262-4cfa-887d-565121c89087 .gutentor-block-shape-top svg path, #section-2347f2a8-5262-4cfa-887d-565121c89087 .gutentor-block-shape-top svg polygon {
    fill: #f3f2f2;
}

for the dark version of the theme

.dark #section-2347f2a8-5262-4cfa-887d-565121c89087 .gutentor-block-shape-top svg path, #section-2347f2a8-5262-4cfa-887d-565121c89087 .gutentor-block-shape-top svg polygon {
    fill: #21222a;
}

This is working well but when I edit the page and save it, it’s losing all the custom CSS rules I got in the customizer cause it’s changing the section-2347f2a8-5262-4cfa-887d-565121c89087 id to something different.

Is there any way I can avoid changing elements id when I save the page? or a different workaround?

Thank you