Cara, pelo que entendi você só quer utilizar uma folha de estilo separada para as váriaveis do css, dá pra fazer isso bem simples: primeiro você cria o arquivo com as váriaveis, ex:

root.css

:root {
    --varcor1: #fff;
    --varcor2: #ccc;
}

e lá na sua folha principal você importa isso mais ou menos assim:

style.css

@import url(./root.css);
body {
    background: --varcor1; //#fff
    color: --varcor2; //#ccc
}

espero que isso tenha te ajudado, e pedi pro chatBing me dar algumas vantagens de usar scss aqui estão:

*Aqui estão alguns recursos poderosos do SCSS e seus equivalentes no CSS nativo:

Variáveis: Anteriormente, a declaração de variáveis, um recurso-chave do SCSS, não estava presente no CSS. No entanto, agora também podemos definir variáveis no CSS de maneira semelhante1.

Aninhamento: Graças ao SCSS, podemos intervir com elementos dentro da classe principal usando-a apenas uma vez sem escrever repetidamente a classe principal. Agora, no CSS também, podemos aninhar usando a classe principal apenas uma vez1.

Partials — Módulos: No SCSS, arquivos SCSS separados podem ser criados e usados para áreas específicas. No CSS, podemos chamar e usar outro arquivo CSS no arquivo CSS desejado1.

Mixins: No SCSS, mixins são um recurso importante que ajuda a criar blocos reutilizáveis que podem receber parâmetros1.*

um abraço!