玻璃球光标：跟着鼠标走的肥皂泡玻璃球
做一个首屏：一个会晃动的肥皂泡玻璃球像弹簧一样跟着鼠标，折射身后亮着的地面，边缘有一圈彩虹，按住时变大，还会在地面留下波纹。一个 WebGL 片元着色器，纯代码，不调用模型，没有媒体文件；页面文字和一张磨砂卡片在它上面。首屏之后是一个完整的落地页：章节大标题、简介、用 HTML 画的产品控制台、功能卡片、要点、数据、引言、行动按钮和页脚，背景光晕随章节变化，底部有悬浮的章节胶囊。
准备好品牌、标题、一句文案、一个按钮、链接、最多四条卡片内容、配色和语言。Skill 会交付一个完整的落地页（index.html）、一段可以粘进现有网站的区块和一个 React 组件，附带开源字体。
使用方法
构建脚本写出页面：真实文字和一张磨砂卡片放在全屏画布上面，同时生成可粘贴的区块和 React 组件。
在浏览器里，一个片元着色器每帧画出地面和玻璃球：柔和晃动的轮廓、透过曲面再采样一次的地面、边缘一圈彩虹和高光。
玻璃球用阻尼弹簧跟着鼠标，沿运动方向拉长，按住时变大，点击或快速移动时在地面加一圈波纹。
常见问题
页面会调用模型吗？
不会。它是纯代码：HTML、一个脚本和两种字体。做一个页面不花钱。
玻璃球会折射页面文字吗？
不会。它折射的是画出来的地面和背景；文字和卡片在画布上面。
没有 WebGL 会怎样？
会换成一个柔和的 CSS 泡泡跟着鼠标。开启减少动态效果时，玻璃球停在中间。
为什么这里点链接没反应？
示例运行在沙盒框架里，链接被禁用了。在你自己的页面里，链接会指向你在 site.json 里填的地址。
手机上能用吗？
能。用手指拖动就能移动玻璃球。已在 390 像素宽的手机视口里检查过。
为什么没有在线生成？
生成新场景需要在沙盒里注入模型 Key，后端暂时还不支持。目前请用你自己的 Agent 运行这个 Skill。