用途：Modal（模态框）出现在主应用界面之上，在关闭前阻止页面交互，用于以聚焦方式展示重要信息、请求用户输入或确认操作。
适用场景：需要打断用户流程以传达重要信息或获取必要输入时使用，例如确认对话框（如“确定要删除此项吗？”）、关键系统消息（会话过期警告、重要提醒）、需要用户输入的表单（登录、支付、注册流程）、媒体预览（灯箱中的图片或视频）、多步骤流程（结账步骤、引导流程）、条款与条件（继续前需用户同意）。
不适用场景：非必要信息无需立即关注；内容或交互可内联在页面中；同一信息需要频繁访问；内容过大需要大量滚动（专用页面在体验与无障碍上更好）；用户必须在模态框打开时与主页面交互。
实现流程：先确认该模式与问题及约束匹配，再复制示例；从 references/pattern.md 中的结构与示例入手，选择最小可行变体；在叠加视觉细节前先应用无障碍、性能与交互防护；使用测试指引验证键盘、屏幕阅读器、响应式与失败场景下的行为。
无障碍键盘交互：Escape 关闭模态框；Tab 将焦点移到模态框内下一个可聚焦元素，焦点应被限制在模态框内；Shift + Tab 移到上一个可聚焦元素；Enter/Space 激活当前聚焦的按钮或控件。模态框打开时，焦点应自动移到框内第一个可聚焦元素（通常是关闭按钮或第一个表单字段）；关闭时，焦点应返回触发它的元素。
常见错误：强制用户进入无关闭选项的模态框，应始终提供清晰的关闭按钮（X）并支持 Esc 键关闭；页面加载时自动触发模态框，应仅在用户主动发起时显示；干扰背景页面焦点，应加入焦点陷阱并在关闭前阻止背景交互。
相关模式：popover、tooltip、loading-indicator。完整实现细节、示例与测试说明见 references/pattern.md，模式页面为 https://uxpatterns.dev/patterns/content-management/modal。