twin.macro预飞样式与Tailwind预飞样式差异致样式失效问题咨询

• 对Next.js相关的twin.examples仓库调研后确认，twin.macro官方推荐引入名为<GlobalStyles />的预飞组件，这类组件在实际使用中常被别名为<BaseStyles />。
• 按照官方说明，该组件会导出一套预飞样式，作用是把各浏览器的默认样式重置为统一的合理默认值；组件内样式和tailwind/base.css（即CSS文件里写@tailwind base;指令注入的样式）完全一致，还额外内置了twin自带动画所需的关键帧定义。

• 当前运行环境为TailwindCSS 3.2，使用的是兼容TailwindCSS 3的最新twin.macro v3候选发布版本（旧版本因不兼容TailwindCSS 3未采用）。
• 用<GlobalStyles />替换Tailwind自带的预飞样式后，出现两类异常：
  • 所有通过className声明的样式全部不生效
  • styled-components运行逻辑异常

• 希望有相关实践经验的开发者说明该问题的成因，提供对应的学习参考路径，或者给出可落地的解决方案。

目前已在项目官方仓库提交了附带完整上下文、问题截图的公开讨论帖，暂未收到回复。

内容的提问来源于stack exchange，提问作者Francisco Barros