赋予您的智能体使用容器查询、流体排版、CSS Grid 和移动优先断点策略实现现代响应式布局的能力。
当您构建必须适应任何屏幕尺寸的界面时
当您需要使用容器查询实现组件级响应式时
当您想要为设计系统创建流体排版和间距比例时
指定需要实现响应式的布局或组件
选择一种策略，如移动优先断点或基于容器的查询
应用 CSS Grid、Flexbox 或流体缩放单位（如 clamp() 和视口单位）
在不同的视口和设备上下文中测试实现效果
你
使这个产品卡片组件具有响应性，以便它能在侧边栏和主内容区域工作。
Agent
我已经为您的产品卡片实现了容器查询，允许它根据其容器的宽度从垂直布局切换到水平布局。我还通过 `clamp()` 使用了流体排版，以确保标题无论视口大小如何都能完美缩放。
赋予您的智能体分析来自 Stitch 项目的技术资产并将其综合为语义化的 DESIGN.md 文件的能力。
Gives your agent the ability to design high-quality RESTful and GraphQL APIs following industry best practices and OpenAPI standards.
赋予你的智能体通过专注于意图驱动的设计，为仪表板、管理面板和 SaaS 工具构建高水准、一致的界面的能力。
赋予你的智能体创建独特的、生产级前端界面的能力，这些界面具有极高的审美质量和创意、非通用的代码。
通过建立深厚的设计哲学并在画布上进行表达，赋予您的智能体创建博物馆级视觉艺术、海报和设计的能力。
