Как пример.
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><style>
body { --my-var: #FF0000;}
.ss { background-color: var(--my-var);}
</style><script>
function fu (color) { document.styleSheets[0].rules[0].style.cssText = '--my-var: '+ color + ';';} // OR .setProperty
</script></head><body>
<div class="ss">какой то случайный текст</div>
<input type="button" value="Button 1" onclick="fu ('#00FF00')" />
<input type="button" value="Button 2" onclick="fu ('#0000FF')" />
</body></html>
>> Можно ли как то получить к ней доступ из js?
Да можно CSS это такая же часть документа как и все остальное в документе.
Главное понимать принципы работы браузера по построению страницы они в целом довольно простые
В ответ на запросы браузера приходят потоки байтов которые разбивается на 4ре отдельных парсера HTML CSS JS и отдельные объекты (картинки ифреймы музыка и т.д.)
В данном случае парсер CSS создает каскадные таблицы стилей которые доступны через объектную модель документа как свойство самого документа "document.styleSheets" где их можно найти и изменить
getComputedStyle только делает запрос к уже сформированным таблицам стилей не изменяя их а только возвращая новый объект.
