原本是打算测试 MiMo 最新模型的，看论坛有人说会有特调，所以没有使用鹈鹕测试，让 Codex 出了一个测试题

为啥后来没有测试 MiMo ，反而测试了 DeepSeek 呢，主要还是没有订阅😂😂

你是一名高级前端工程师。请实现一个可直接运行的单文件 index.html，模拟苹果官网风格的可拖拽折叠手机展示效果。

要求：

1. 只能使用原生 HTML 、CSS 、JavaScript ，不能使用 React 、Vue 、Three.js 、Canvas 、WebGL 、视频或外部依赖。
2. 手机由左右两个屏幕面板和中间转轴组成，使用 CSS 3D 实现：
   • 展开角度为 180°；
   • 半折角度为 90°；
   • 闭合角度为 0°；
   • 右侧面板必须围绕转轴旋转，而不是简单缩放或切换图片。
3. 页面包含：
   • 一个可拖拽的 range 滑块；
   • “横屏”“竖屏”“闭合”“坐立”“站立”五个预设按钮；
   • 当前折叠角度的数值显示；
   • 手机屏幕中的渐变壁纸、文字和几个简单图标。
4. 支持鼠标、触摸和键盘操作：
   • 拖动滑块实时更新 3D 角度；
   • 键盘左右方向键调整角度；
   • Home 设置为 0°，End 设置为 180°；
   • 角度必须限制在 0° 到 180°。
5. 正确处理 CSS 3D 的 perspective、transform-origin、transform-style、backface-visibility 和阴影，使折叠时具有真实的空间感。
6. 支持 prefers-reduced-motion，用户开启减少动态效果后，不应使用明显的缓动动画。
7. 页面需要响应式适配桌面和移动端，不能出现横向滚动条。
8. 不要使用假的逐帧图片切换来伪造动画。
9. 请先列出不超过 5 条实现假设，然后给出完整代码，最后给出至少 5 个边界测试用例，并说明每个用例的预期结果。
10. 代码必须复制到本地后直接打开即可运行。

测试结果 双方都实现了折叠交互功能 ChatGPT 5.6 Luna 最高 5.6Luna 效果
优点：耗时 7 分钟，页面 UI 强 缺点：它将折叠方向给整反了，把屏幕往后扳 DeepSeek V4 pro （额度花费 4.47 ） DeepSeek V4 pro 效果
优点：折叠方向正确 缺点：耗时长 12 分钟，UI 没有那么好看