[Next.js] No work the fast refresh when css saved

[HeppokoNeet]

My enviroment is here:

//package.json

{
  "name": "frontend",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "PORT=3001 next",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@emotion/react": "^11.13.3",
    "@emotion/styled": "^11.13.0",
    "@mui/material": "^6.1.6",
    "@pigment-css/nextjs-plugin": "^0.0.25",
    "@pigment-css/react": "^0.0.25",
    "destyle.css": "^4.0.1",
    "next": "15.0.2",
    "react": "19.0.0-rc-02c0e824-20241028",
    "react-dom": "19.0.0-rc-02c0e824-20241028"
  },
  "devDependencies": {
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "eslint": "^8",
    "eslint-config-next": "15.0.2",
    "postcss": "^8",
    "tailwindcss": "^3.4.1",
    "typescript": "^5"
  }
}

//next.config.ts

import type { NextConfig } from "next";
import { withPigment } from "@pigment-css/nextjs-plugin";

const nextConfig: NextConfig = {
  presets: [],
  /* config options here */
};

export default withPigment(nextConfig);

//AdminLayout.tsx

"use client";
import { css } from "@pigment-css/react";

export default function AdminLayout() {
  const visuallyHidden = css({
    color: "blue",
  });

  return <div className={visuallyHidden}>あ</div>;
}

//page.tsx

import AdminLayout from "@/src/components/admin/common/AdminLayout";
import { Metadata } from "next";

export const metadata: Metadata = {
  title: "",
};

export default function UsersPage() {
  return (
    <div>
      <AdminLayout></AdminLayout>
    </div>
  );
}

When I change color: "blue" to color: "red" then save it on the vs code editor, next fast refresh doesn't work.
If i refresh browser, it will be changed.
So how can i solve this problem?

[HeppokoNeet]

sorry...
i should have posted this discussion in issue.
i close