sheet.cssRules throws error on inner pages but works fine on homepage

I am using this function in my Wordpress site's custom javascript.

var addRule = (function (sheet) {
    if(!sheet) return;
    return function (selector, styles) {
        console.log(sheet.cssRules)
        if (sheet.insertRule) return sheet.insertRule(selector + " {" + styles + "}", sheet.cssRules.length);
        if (sheet.addRule) return sheet.addRule(selector, styles);
    }
}(document.styleSheets[document.styleSheets.length - 1]));

The problem here is the above function works fine on homepage but,

Throws Uncaught DOMException: Failed to read the 'cssRules' property from 'CSSStyleSheet': Cannot access rules on inner pages.

Here is the link to my site,

Homepage//here you will see no error in console

Inner Page//here you will see an error in console

as per my research, this error is caused by Cross-Origin Resource Sharing (CORS), but why it is working on Homepage?