关于这个模板
Cyber Ronin 是面向3D、游戏或娱乐品牌的一份可用参考：这套落地页已经排好、量好，可以直接照着复刻。页面自己的标题是“Cyber Ronin // Neural Edges”，整个构图就是围绕这串字搭的。颜色只用了橙色 #C45A18 打底、奶油色 #FBDBAF 给文字，正文排的是 Inter。这一条会把生成页面的技术栈（一个自包含的 HTML 文件）写出来，而不是藏起来。动效只限于0.25s 的过渡、cubic-bezier(0.25,0.46,0.45,0.94)、一段循环视频打底。如果你要给别人提一版3D落地页的需求，就从这个构图起步，把题材换掉。
适合谁
- 先把 1920x1420 的画幅和 100vh 高的板块、28px 间距从这版落地页里拿走，再考虑别的。
- 这个页面服务的是正用一个自包含的 HTML 文件重建3D、游戏或娱乐品牌落地页、想找外观背后那组数字的前端开发者。
- 正在复刻竞品3D落地页的团队，想在有人选定框架之前先把一个自包含的 HTML 文件点明。
包含哪些内容
- 每个尺寸都写下来了. 字体和间距在这里共用同一份清单：100vh 高的板块、28px 间距、0.25s 的过渡、cubic-bezier(0.25,0.46,0.45,0.94) 缓动曲线。每个值对应一件事：一个字号档位、一段间距、一个圆角或一次过渡。
- 循环就是背景板. 首屏就是一段 1920x1420 的视频，其余一切都排在它上面。按 1920x1420 或更宽的尺寸导出，cover 裁切就继续成立。
- 靠展示字号说话. 由 Inter 一个字体挑大梁：从标题到支撑句字号断得很干脆，字号越大字距收得越紧，层级因此由字体承担，而不是靠颜色。注释档位小到能待在数字下面，又不改动页面的节奏。
- 数字坐在基线上. 一条紧凑的数据带承担了本来要一整段才能说清的主张，落地页因此不会变成功能清单。数字和周围文案坐在同一条基线上，这一行因此读成一个整体。数字控制在一行。这份参考在 1920x1420 下收录。
动效与交互
环境动效交给循环
背景片段在 1920x1420 下以 6s 循环播放，静音、行内，所以读者的注意力在文案上时，页面依然在动。不需要滚动库，因为唯一的环境动效就是这段素材本身。片段短到能循环而不露接缝，这比它的分辨率更重要。拍摄或导出按 1920x1420 或更宽的尺寸。
入场就是签名动作
第一帧是刻意不完整的：标题逐词出现，而构图的其他部分已经就位。入场在读者的视线落到支撑文案之前就已经结束。只留一个元素，再多页面就开始表演了。这份参考在 1920x1420 下收录。
这个落地页背后的数字
两个人在同时复刻时，靠眼睛是定不住构图的。需求简报消掉了这场争论：100vh 高的板块、28px 间距、0.25s 的过渡、cubic-bezier(0.25,0.46,0.45,0.94) 缓动曲线、360px 断点，只说一次。这个落地页里没有任何一处依赖默认值。
这个落地页怎么重排
宽屏下构图是密的，窄屏下字阶是流体的，而不是阶梯式的、版式在 360px 处切换、板块高度锁在 100vh。两种状态需求简报都写了。扛过重排的是层级。
Cyber Ronin 怎么安排第一次阅读的顺序
“Cyber Ronin // Neural Edges”从第一帧起就在做这件事。注意力是被引导的，而不是散开的：视线先落在主标题那一行，然后是支撑文案，最后是行动。需要社会证明时，它是一条长条或一行，而不是一整面客户评价墙。这个顺序就是设计本身。3D读者先看到主张，再看到选项。
常见问题
Cyber Ronin 背后的提示词到底有多长？
简报是从页面上收录下来的，共 10,993 个字符，覆盖画幅、字阶、色板和过渡。复制拿到的就是这段文本，发给 Studio 则会用同一份描述把请求预先填好。
为什么这条条目还要标注一个自包含的 HTML 文件？
Cyber Ronin 是用一个自包含的 HTML 文件构建的，条目标注只是说明出处。简报写的是位置、尺寸和时长，所以任何能设字体、能摆元素的前端框架都能重建。
拿到 Cyber Ronin 的简报之后，我能用它做什么？
页面上引用的内容全部出自收录的 10,993 字符简报，而不是事后补写的说明。数字和文字能对得上，原因就在这里。
