Vite React子组件TailwindCSS失效及index.html修改不生效求助

我是技术新手，此前正常运行的代码突然出现问题，代码仓库：github.com/SetroZ/plshelp

具体问题 #

1. Grid.tsx文件中应用的TailwindCSS类均不生效，代码如下：

export const Grid = ({ type, label }: GridProps) => {
  return (
    <button
      className={`rounded-full text-center  ${Style[type]}    box-border h-16 aspect-square `}
      key={label}
    >
      {label}
    </button>
  );
};

2. App.tsx中<div className="grid mt-5 gap-x-5 gap-y-4 grid-cols-4 grid-rows-5 h-full ">的样式失效，但其他行的TailwindCSS类可正常工作
3. 手动修改index.html后，浏览器未显示更改

效果对比 #

• 期望效果：按钮为圆角正方形，页面呈现4列5行的规整网格布局，元素间有均匀间距
• 当前效果：按钮为默认矩形，网格布局错乱，元素无合理间距

已尝试方案 #

重启Vite、重装TailwindCSS，问题仍未解决

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