请帮我创建一个“鱼戏莲叶间·认识东西南北”互动HTML教学网页，具备以下完整功能： 1. 视觉风格：水韵池塘背景，荷叶呈十字布局（上北下南左西右东），中央为纯CSS动态荷花。 2. 交互流程：初始四个方向显示带水珠和叶脉的荷叶。点击喇叭按钮，随机从未被正确点击的方向中选取一个，使用童声朗读“鱼戏莲叶X”（X为北/南/西/东），同时上方诗句区域显示对应诗句。 3. 反馈机制：用户需点击对应荷叶。正确时播放正确音效，荷叶消失，显示大字体的方向汉字（北/南/西/东各自不同颜色），同时在该方位周围出现绕圈红色锦鲤动画，并显示“鱼戏莲叶X”文字；错误时播放错误音效，荷叶抖动，喇叭再次重复朗读当前目标，帮助巩固。 4. 学习闭环：所有方位正确激活后自动播放祝贺语音“太棒了！所有方位都找到了！”。重置按钮清空所有状态，恢复荷叶并重置鱼儿动画。 5. 技术实现：响应式移动端适配，支持触摸，采用原生HTML/CSS/JS，无第三方依赖。语音调用Web Speech API，音效使用预置音频链接。动画细腻，荷叶带不规则边缘和光影，鱼儿摆动游动。