LWC: Override CSS of standard Lightning Web Components

Recently, I got a requirement where I had to override the CSS of lightning-card component, specifically to change the background colour of the header of the card component.

Shadow Dom have their own little kingdom and cannot be styled from outside, except if they would provide some options to do so. Currently, it's not possible to style standard Lightning Web Components;

I am providing a hacky workaround to get the desired results. I added the below code in my helloExpressions component:

renderedCallback() {
    const style = document.createElement('style');
    style.innerText = `c-hello-expressions .slds-card__header {
    background-color: #54C2B2;
    }`;
    this.template.querySelector('lightning-card').appendChild(style);
}

and this is how it looks:

UPDATE:
It seems there is a cleaner approach as suggested by pdebaty: loading CSS using loadStyle...lol. You can go through the StackExchange article to understand more in details.