How to use custom color schemes

Question

In the past i used to add two new items for "themes" to the index.hbs

...
<ul id="theme-list" class="theme-popup" aria-label="Themes" role="menu">
    <li role="none"><button role="menuitem" class="theme" id="my-new-style">{{ theme_option "My Light Theme" }}</button></li>
...

Then i added custom css via book.toml to create the "style":

.my-new-style {
  --bg: hsl(210, 1.9%, 78.8%);
  ...
}

This seemed to work, but with newer versions it breaks like this issue: #2131
Is there an easy way to add custom styles? I still can use those changes, but they make it impossible to set new "styles" as default styles. Thanks for your help!

Version

Used to work:
mdbook v0.4.34

Current:
mdbook v0.4.36

Start by comparing the custom theme markup in index.hbs and the CSS supplied through book.toml between mdBook v0.4.34 and v0.4.36, then read issue #2131 for the related breakage. Define how custom styles should be added and selected as defaults; the issue is done when that workflow works without the existing theme changes breaking.