CSS Modules、层叠层和自定义属性怎样帮助维护样式？

CSS Modules 在构建时为局部类名生成映射，减少类名冲突；层叠层用 @layer 明确不同来源样式的覆盖次序；CSS 自定义属性则让主题变量通过原生层叠和继承传播。

这些机制解决不同问题：局部类名不能隔离所有继承和全局选择器，层叠层也不是命名空间。自定义属性的值在使用位置参与计算，回退值与无效值处理需要结合 var 的规则理解。

设计系统可把颜色、间距等语义 token 与具体组件样式分离。避免把所有属性都抽象为变量，或使用大量 !important 对抗层次。选择一种团队容易遵守的约定，并让第三方样式有明确的接入边界。