思念留言板

解决什么问题

做纪念页、表白墙、思念墙这类小站点时，最难的不是功能多复杂，而是「氛围」与「内容」的平衡：一屏之内要塞进背景音乐、提交表单和留言流，又不能吵、不能乱、不能挡操作。常见实现要么上来就大声自动播放，要么把留言做成密集卡片墙，要么所有访客永远看到同一批内容，「每日感」形同虚设。

技能如何工作

页面由五个部分组成：氛围底（柔和渐变或夜空/纸感纹理）、大标题加一句短旁白、角落的音乐开关、提交表单（思念谁 / 留言 / 署名），以及漂浮层与只读列表入口。

核心机制：

• 每日池：按本地时区自然日取 todayKey，从全部留言中抽样或按 createdAt 过滤，避免同一屏永远是同一批
• 多轨跑马灯：多行不同 y 轴、不同速度的横向漂浮层，pointer-events: none 不挡操作，点详情走独立列表
• 存储三模式：localStorage 演示模式（内置 8～15 条示例）、轻后端 GET/POST /api/miss-wishes、混合模式（本地即时显示 + 定时拉公共流）

Agent 落地按步骤来：搭骨架 → 实现 MissWish 存取与每日池抽样 → 多轨 CSS 跑马灯并尊重 prefers-reduced-motion → BGM 等用户手势后再 play() → 自测提交、关音乐、换日期三条链路。

边界与注意点

• 不自动播放：浏览器本身会拦截自动播放，音乐必须等用户点击，默认音量 0.25
• 内容安全：前端限长 8～120 字、敏感词基础过滤，不收集身份证/住址等真实信息，昵称可匿名
• 不做垃圾墙：留言对象限定「思念的人」，主题约束是产品的一部分
• 曲库免版权：Skill 不附带侵权音乐，需自备或选免版权循环音频
• 演示模式免登录：浏览公共流不需要登录，写留言才提交