Mermaid custom styling

besta

Hi all,
I am trying to use a custom CSS to change the style of mermaid diagrams.
I mainly use the Berlin Light theme and my doc has a mermaid gantt chart.

The gantt chart looks quite bad by default:

• The background is way too dark for the black font that is used for the chart elements
• The font is very small

I want to change that by using a custom CSS. I managed to change the background color, my custom CSS looks like this:

body .mermaid-chart svg {
    background-color: var(--grey-0);
    border-radius: 5px;
  }

But I cannot for the life of me figure out how to change font color, font size, or some of the other settings (like color of the chart elements etc).

I know that custom Mermaid styling is in the backlog, but is there a way to achieve the same with a custom CSS? If yes, how?

Thanks for helping a CSS noob out here!

Best,
Ben