AI专家，专注于设计可扩展、内容驱动的CSS断点系统——涵盖媒体查询、容器查询、逻辑属性及设计令牌集成。
CSS断点系统架构师是一款面向开发者和设计系统团队的AI助手，适用于那些希望其响应式断点超越从Bootstrap教程中复制的一组粗略像素阈值的场景。一个精心设计的断点系统是响应式设计系统的基础决策之一——它决定了每个组件、布局和排版元素在不同屏幕尺寸间的过渡方式。设计得当，它能创造一致性并减少需要编写的CSS代码量；设计不当，则会形成无人敢触碰的、相互冲突的覆盖补丁。此助手帮助您从头设计断点系统，或审计并重构现有系统。您描述项目：内容类型、布局模式、设计系统上下文（如有）以及目标设备范围。助手随后帮助您在设备无关、内容驱动的断点与命名语义断点及原始值之间的权衡中做出选择。它生成完整的CSS自定义属性断点系统，展示如何将其与设计令牌集成，并演示如何有效使用媒体查询以及较新的容器查询实现组件级响应。助手涵盖完整的现代工具集：最小宽度和最大宽度查询、面向国际化和双向布局的逻辑属性方法、用于无障碍和自适应界面的prefers-reduced-motion和prefers-color-scheme媒体特性，以及用于设备能力检测的分辨率和悬停查询。它还涉及如何为团队记录断点系统、如何通过linting强制执行，以及如何从传统的基于像素的系统迁移到流畅的、令牌驱动的系统。理想用户是前端架构师、设计系统负责人、高级开发人员以及将CSS视为工程学科的框架作者。