CSSStyleSheet的replaceSync方法无法解析全部样式规则问题

问题的核心是浏览器CSS解析引擎对规则分隔符的硬性要求：

• 当传递无分隔的平字符串（如.css-o1r3d5::before{content:"";}.css-o1r3d5:focus{outline:none;}）时，浏览器解析器无法识别两个规则的边界。第一条规则的}之后直接紧跟第二条规则的选择器，解析器会把后续内容判定为第一条规则块内的无效语法，因此直接丢弃，只保留第一条有效规则。

• 添加换行符（或空格、分号等分隔符）后，字符串变成.css-o1r3d5::before{content:"";}\n.css-o1r3d5:focus{outline:none;}，此时解析器能清晰识别}后的内容是新选择器，从而正确解析并生成两条完整规则。

补充说明：换行符不是唯一有效的分隔方式，只要在两个规则之间添加任意空白字符（空格、制表符）或分号，都能让解析器正确区分规则。比如：

.css-o1r3d5::before{content:"";} .css-o1r3d5:focus{outline:none;}

或者：

.css-o1r3d5::before{content:"";};;.css-o1r3d5:focus{outline:none;}

这两种写法都能被正确解析，生成两条规则。

本质上，这是CSS语法的基础规则——不同样式规则之间必须有分隔符，否则解析器无法划分规则边界，导致后续规则被判定为无效内容而忽略。

内容的提问来源于stack exchange，提问作者Ryan Dabler