CSS 类毫无预兆地消失了，它去哪儿了？

我有这个示例表，取自https://element-plus.org/en-US/component/table.html#table-with-status

我想为某些行添加一些颜色。

这是一个最小的工作示例：

<script setup lang="ts">
type TableRec = {
    code: string
    from_title: string | null
    to_title: string | null
    from_title_short: string | null
    to_title_short: string | null
}

const tableData : TableRec[] = [
  {code:"code01", from_title: "value1", from_title_short: "value1", to_title:null, to_title_short:null},
  {code:"code02", from_title: "value2", from_title_short: "value2", to_title:"not null", to_title_short:"not null"},
  {code:"code03", from_title: "value3", from_title_short: "value3", to_title:null, to_title_short:null},  
]

const rowClassName = ({
  row,
  rowIndex
}: {
  row: TableRec
  rowIndex: number
})  => {
  if (!row.to_title) {
    return "warning-row"
  } else {
    return "success"
  }
}

</script>

<template>
    <el-table :data="tableData" :row-class-name="rowClassName">
        <el-table-column prop="code" label="Code" width="200" />
        <el-table-column prop="from_title_short" label="From" />
        <el-table-column prop="to_title_short" label="To" />
    </el-table>
</template>

<style>
.el-table .warning-row {
  --el-table-tr-bg-color: var(--el-color-warning-light-9);
}
.el-table .success-row {
  --el-table-tr-bg-color: var(--el-color-success-light-9);
}
</style>

当我更改 CSS 并保存 vue 文件时，我可以看到热重载发生了。请求如下所示：

import {createHotContext as __vite__createHotContext} from "/@vite/client";
import.meta.hot = __vite__createHotContext("/src/components/TranslateCategoryView.vue?vue&type=style&index=0&lang.css");
/* unplugin-vue-components disabled */
import {updateStyle as __vite__updateStyle, removeStyle as __vite__removeStyle} from "/@vite/client"
const __vite__id = "/home/user/projects/test/frontend-admin3/src/components/TranslateCategoryView.vue?vue&type=style&index=0&lang.css"
const __vite__css = "\n.el-table .warning-row {\n  --el-table-tr-bg-color: var(--el-color-warning-light-9);\n}\n.el-table .success-row {\n  --el-table-tr-bg-color: var(--el-color-success-light-9);\n}\n"
__vite__updateStyle(__vite__id, __vite__css)
import.meta.hot.accept()
import.meta.hot.prune(()=>__vite__removeStyle(__vite__id))

没有发出任何错误消息或警告。我还可以看到warning-row类已添加到<tr>

但这些行没有警告颜色。事实上，“warning-row”类不适用，因为它不存在：

所以它是热加载的，但它不存在？我不明白，这里发生了什么？

我也尝试在 element plus 游乐场（https://element-plus.run/）中发布此示例。但不幸的是，它在那里完美运行：

我猜问题出在我这边，但是没有错误消息，也没有警告，我无法找出根本原因。