🎉魔法体验：点击感受声光电
一个枯燥的按钮，如果加上了“声音”和“视觉特效”，体验会发生翻天覆地的变化。请务必打开电脑声音，用力点击下面这个按钮：
（听见那种清脆的“叮~”声，和满屏的彩纸了吗？）
黑科技揭秘：刚才的声音没有用到任何 MP3 文件，彩纸也没有用到任何图片。它们都是由 纯 JavaScript 代码 实时运算生成的！这意味着我们的机房不需要网络去下载素材，也不需要优盘，代码走到哪里，特效就跟到哪里！
🎆第一重魔法：代码生成视觉特效
把你的代码发给豆包，让它为你加上纯代码生成的粒子特效。
你是一位资深前端特效工程师。
这是我的网页代码：
[在这里粘贴你的完整代码]
现在，我需要你帮我给这个应用增加【全屏撒花特效】。
要求：
1. 当我点击页面上的主要按钮时，屏幕上要喷射出五颜六色的彩纸礼花（Confetti）。
2. 必须使用原生 JavaScript 和 HTML5 Canvas 实现，绝对不允许引入任何外部的图片文件或第三方 JS 库链接（例如不能用 canvas-confetti 库）。
3. 【铁律】：保持现有的核心交互逻辑和 CSS 样式不变。
请直接输出修改后的完整单文件代码。
💡 创意变异：你可以把【全屏撒花特效】换成：金币掉落特效、屏幕震动特效、或者是满屏飘雪特效！
🎵第二重魔法：代码合成电子音效
这一步非常神奇，我们让浏览器变成一台“电子合成器”，用数字波形直接发出声音！
太酷了！现在特效有了，我们还需要声音。
请在现在的代码基础上，增加【纯代码音效】功能。
要求：
1. 必须使用浏览器的 Web Audio API 来合成声音。绝对不允许使用任何外部的 MP3、WAV 文件链接，也不要使用 base64 编码的长文本，只要纯逻辑合成。
2. 当我点击主要按钮时，播放一个好听的【类似超级马里奥吃金币的清脆“叮”声】。
3. 确保在第一次点击按钮时再初始化音频上下文（AudioContext），以符合浏览器的自动播放策略。
请直接输出包含视觉特效和音效的终极版完整代码！
💡 创意变异：你可以把【类似马里奥吃金币的清脆“叮”声】换成：答错时的低沉“嘟嘟”声、或者是升级时的连续音阶！