用途：整理 Svelte 中的 CSS 样式写法，覆盖作用域样式、CSS 自定义属性、style: 指令、:global 以及子组件样式。
主要能力：通过 style: 指令把 JavaScript 变量写入 CSS 自定义属性；向子组件传递 CSS 自定义属性作为组件 props；在无法使用自定义属性时（例如第三方库组件）用 :global 作为回退方案。
必要用法：JS 变量入 CSS 可用 <div style:--columns={columns}>；子组件样式优先用 <Child --color="red" --spacing="1rem" />，子组件内通过 var(--color, blue) 读取并提供回退值；无法传自定义属性时，在父组件 <style> 中用 div :global 选择器覆盖库组件内部元素。
限制与注意：Svelte 的 <style> 块默认作用域限定于当前组件；动态值应使用 style: 指令，而不是内联 style 字符串；子组件样式优先使用 CSS 自定义属性而非 :global。参考文件为 styling-patterns.md。资料最后核验时间为 2026-03-12。