请帮我从零写一个《海贼王角色性格测试与海贼船建造》的完整 Web 应用。必须输出为纯单文件 index.html（包含所有 CSS/JS），不要给 Vite 项目或压缩包！ 我准备直接复制运行。 【核心玩法更新：自定义题量】 在首页增加一个选择器：让用户自由选择本次测试的题量（15题 / 20题 / 25题）。 请基于这 25 道题库（你来设计题目），根据用户的选择，随机或按顺序抽取对应数量的题目进行测试。最终生成五维雷达图并匹配角色。 【媒体素材处理】 1. 音频：请先内置一个《宾克斯的美酒》的公开网络音乐链接，并加上播放/暂停、音量调节滑块。 2. 图片：请先在代码里预留好角色图片和背景图的 <img> 标签和变量路径（例如 img/路飞.jpg）。等我框架搭好后，我会自己上传图片并替换路径。 【后续大模块：海贼船建造（放在测试结果之后）】 1. 导语：恭喜新任船长，准备造船。 2. 第一步（外观）：选船身颜色、船帆纹样、船首雕像。必须有实时预览框，点击后立刻在当前页面显示效果，取消就消失，不能卡顿。 3. 第二步（船舱家具）：分厨房、船长室、客厅、瞭望台。多选家具，家具图片尺寸要正常，选完后要在预览框或点击房间时看到实际摆放效果。 4. 第三步（DIY海贼旗）：选底色、图案、配件、输入口号（限12字），带实时预览。 5. 第四步（抓娃娃招募船员）：抓娃娃机动画，随机抓取航海士、船医、战斗员、厨师各一名。遇到香克斯、白胡子等稀有角色弹出专属提示。 【最终档案页】 汇总：船长（测出的角色）+ 船体图鉴 + 船舱清单 + 海贼旗 + 船员名单。自动生成一段“船队特质”和“航行隐患”文案。 隐藏彩蛋：如果选了留声机且船员羁绊高，解锁“船精灵”。 最后提供“一键生成我的悬赏海报”按钮，并将所有内容排版好。 整体风格：海贼王动漫风，配色清爽，排版不要幼态，要有高级感和流畅的过渡动画。
查看作者 @logto-70y12lnn