返回顶部按钮图标在特定页面不显示的问题求助

大家好，我自己搭建了一个网站，在站点里添加了返回顶部按钮，原本各个页面都正常显示，但最近发现其中的 /personal/ 页面里，按钮内部的图标完全看不到。我试着用浏览器开发者工具临时修改CSS时，图标能正常显示，可保存修改后问题依旧存在。

下面是当前使用的CSS代码：

scroll-btn i {
    display: inline-block;
    background-color: var(--theme-color);
    color: var(--white-color);
    text-align: center;
    font-size: 16px;
    width: var(--btn-size, 50px);
    height: var(--btn-size, 50px);
    line-height: var(--btn-size, 50px);
    z-index: 2;
    border-radius: inherit;
    position: relative;
    transition: all ease 0.8s;
}

有没有大佬能帮忙分析下可能的原因，以及对应的解决办法呀？

备注：内容来源于stack exchange，提问作者Pratheeshan V