Set CSS colours from server side

Question

Background

We currently have large client site in Optimizely (ASP.NET MVC) which hosts many, smaller sites, for their regional markets and large, important customers.

Currently, there are various themes that are built by our front end guys (SASS -> CSS) and a dropdown per site in Optimizely that allows us to set the theme - it simply renders this value in the master layout and thus the page requests the corresponding style sheet.

Due to the time it takes to develop these themes for the whole site, the client has requested that for newer sites, we have the ability to set a few basic colours (primary, secondary and tertiary) that can be set, per site, in Optimizely.

So for their customers that want a completely branded site, they can pay and have a custom theme (colours and structure). The rest will use a generic theme (structure) with the colours taken from Optimizely.

The question

Is there a simple way of getting colours defined server side into the transpiled CSS. Adding the colours to the page is not a problem if required but I see no way to get CSS to pick this up. (I tried adding a colour variable defined in the SASS to the master layout but the CSS didn't pick it up as expected).

Possibilities

Obviously, I could render the specific CSS classes to the page with the colour property set and marked with !important to override colours set in SASS. But, we obviously use variables in SASS so colours do not have to be defined (or overriden) in a thousand places.

We could modify the CSS at runtime when colours change in the CMS (alas, CDN). Or use Javascript to change the colours after the page has loaded (meaning original colours would be visible until the JS kicks in). Both these methods I could do but they seem clunky.

This seems to be something that "should" be simple but I've not found anything online that helps.

Is this something anyone has had to deal with? Any clever solutions I've not thought of? Cheers