Where to add custom CSS

Hello,

first of all, I want to say thank you.
I have searched all day for a comment system that can be integrated with Gatsby, that is not as bloated as something like Disqus, looks decent, has nested comment functionality, and does not start at 10€+ per month (I am willing to pay that much if I need to scale but I like having a cheap starting tier). From all of the solutions I looked at, I liked Talkyard the most, by far. I just tried adding the demo (I really like the fact that you have a demo because alternative options did not) to my Gatsby-site and it worked like a charm; I just can't stress enough how much I appreciate this.

Now I have one little question; I have browsed this forum and tried to look for an option to change the colors of the TalkYard-section. Particularly, I found this post:

The question I want to ask is where do I actually put this CSS?
I have set up the TalkYard-demo according to the instructions here:

(Note: I am using Gatsby v2 and it worked fine).

Currently I add this piece of code to my post.tsx - template:

<TalkyardCommentsIframe discussionId={post.frontmatter.uniquePostId}/>

I tried passing some variables inside this element with style = {{...}} but so far I did not notice a change (I am not extremely familiar with TypeScript so maybe I just made a mistake here).
I want to display TalkYard in a dark mode (I saw your comment on the "changing colors" post), so my question would be where (in the code) can I add custom CSS in a Gatsby-project for TalkYard? (Note: I am still experimenting with the demo (I don't know if that is an obstacle for changing the CSS))

Best regards
Boris