macOS下设置cursor-pointer后光标未在元素内部正常生效的问题求助

各位好，我最近碰到个特别奇怪的光标问题，折腾半天没解决，来请教下大家！

我用Tailwind写了个按钮组件，给它加了cursor-pointer类，代码是这样的：

<button className="border-8 cursor-pointer bg-primary w-max flex gap-2 text-white py-4 px-6 text-2xl font-semibold">
  See Music Plans
  <ArrowUpRight className="w-8 h-8" />
</button>

结果发现只有鼠标悬停在按钮的绝对边缘时，光标才会变成指针样式；移到按钮内部区域的话，光标直接变回默认箭头了，完全不生效。

我先是怀疑Tailwind的问题，去查了官方文档，还在官方 playground 里复现了一遍，结果还是一样。后来换成原生CSS写cursor: pointer，居然还是没效果！

这时候我就觉得不是Tailwind的锅了，大概率是浏览器或者系统的问题。我现在用的是macOS Sequoia 15.6，测试了Chrome 138.0.7204.184和Safari 18.6两个浏览器，情况都一样。

后来我还发现个更诡异的现象：如果先把光标放在按钮区域里，不移动光标直接滚动页面，这时候光标会保持指针样式；但只要我稍微动一下光标，哪怕只动一丢丢，它就立刻变回默认箭头了。

有没有朋友在macOS上碰到过这种离谱的问题？求支招怎么解决呀！

内容来源于stack exchange