responsive-design 是帮助 AI 编写适应不同空间的网页布局的 Skill。给它页面或组件代码，它会围绕容器查询、流动字号、网格和移动端布局处理适配问题。
一个卡片放在整页中央和狭窄侧栏里，即使浏览器宽度没变，可用空间也不同。容器查询让组件能根据自身所在区域调整，而不只依赖整个窗口的尺寸。
它也建议按内容开始挤压的地方设置断点，减少只按某几款手机宽度硬套规则。字体、间距、图片比例与触摸区域都要一起看，不能仅让外框缩小。
适合组件会被重复放到不同布局中的项目。交付是能够适配的代码和验证结果；模拟器看着没问题后，仍应在真实设备检查滚动、触控和内容溢出。