别急着点：每日大赛的夜间模式先按5步排查
每日大赛的夜间模式看起来“不正常”时，往往不是功能本身出了大问题，而是环境或设置互相冲突。下面给出一份实用的5步排查清单，按顺序走一遍，绝大多数夜间模式显示异常都能被快速定位或临时解决。
一眼判断：先分清是哪个端
- 是网页端（桌面/移动浏览器）还是原生App？
- 问题是全部用户都有，还是只有你或少数用户出现？
区分清楚能迅速缩小排查范围。
5步排查清单（按顺序执行）
1) 检查“优先级设置”：系统 / 浏览器 / 应用的主题冲突
- 为什么查：多数夜间模式实现会遵循系统或浏览器的“prefers-color-scheme”，如果多个层级设置不同，最终效果会不一致。
- 怎么查：
- 桌面（Windows/macOS）：系统设置里看“外观/主题”。
- 手机（iOS/Android）：设置 → 显示 → 深色/浅色模式。
- 应用内：打开个人设置或主题开关，确认是否有独立的“夜间模式”开关并优先于系统。
- 浏览器：查看是否开启了强制暗色（例如 Chrome 的强制暗色实验功能）。
- 验证：逐个关闭/开启这些选项，观察页面是否切换到预期的夜间效果。
2) 清除缓存并强制刷新
- 为什么查：旧CSS、脚本或服务工作线程缓存会导致旧样式继续生效。
- 怎么做：
- 网页：按 Ctrl/Command + F5 强制刷新；或清除站点缓存（浏览器设置 → 隐私与安全 → 清除网站数据）。
- 移动App：强制停止 → 清除缓存（Android）或卸载重装（iOS/Android）。
- 验证：刷新或重启后再次打开比赛页面，看样式是否恢复正常。
3) 排查扩展、插件或辅助设置干扰
- 为什么查：广告屏蔽、样式覆盖、可访问性插件或阅读模式可能篡改页面样式。
- 怎么做：
- 先在无痕/隐身窗口打开网页（通常会禁用大部分扩展）。
- 或临时禁用可疑扩展（AdBlock、Stylus、Dark Reader 等）。
- 检查浏览器实验性设置（chrome://flags 中的“Force Dark Mode” 等）是否启用。
- 验证：无痕模式或禁用扩展后若正常，说明是扩展或实验功能的问题。
4) 检查版本兼容性与已知问题
- 为什么查：新版本的样式改动或兼容性问题会导致夜间模式异常；某些系统版本或浏览器渲染差异也会出现问题。
- 怎么做：
- 确认你使用的App/浏览器是最新版，或回看最近一次更新是否与问题时间点一致。
- 查看官方更新日志或社区反馈（论坛、Issue 列表、社群）是否有相同报错。
- 尝试在另一台设备或不同浏览器打开，判断是否为环境特定问题。
- 验证：在多个环境下测试，判断问题是否广泛存在。
5) 收集复现信息并提交给技术支持
- 为什么查：定位后端或前端代码级别问题需要工程师的日志与复现步骤。提供完整信息能大幅缩短修复时间。
- 提交内容模板（简洁高效）：
- 问题概述：简短一句话说明现象（例如“夜间模式下文字仍为深色，背景仍为白色”）。
- 出现时间与频率：首次出现时间，是否可复现。
- 平台信息：操作系统与版本、浏览器与版本或App版本、设备型号。
- 复现步骤：从打开页面到看到问题的逐步操作（尽量列出每一步）。
- 附件：截图/录屏（标注问题区域）、浏览器控制台（F12 → Console）和网络请求（Network）的错误日志。
- 临时解决建议：在提交时说明你尝试过的排查步骤（上面1-4），以免重复建议。
三个快速临时解决办法（可在用户反馈到修复上线前使用）
- 切换应用内主题开关或系统主题一次（触发重新渲染）。
- 尝试无痕/隐身窗口或不同浏览器。
- 对于技术熟悉者：在浏览器控制台试验 document.documentElement.classList.toggle('dark') 或使用 DevTools 中的 Emulate prefers-color-scheme 切换来临时查看效果。
常见原因速览（便于定位）
- 优先级冲突：系统 > 浏览器 > 应用，但实现不一致时混淆。
- 缓存未刷新：老CSS/JS仍在生效。
- 扩展或实验功能强制修改样式。
- 新发布的样式回归BUG或兼容性问题。
- 局部CSS选择器写死颜色、未考虑 prefers-color-scheme。