refactor(admin): tokenize remaining admin pages for dark mode

- 8 个 admin 页面(users/roles/zones/media/notifications/page/content×2)全部 gray→token
- 深色面板 bg-gray-900/800 → bg-dark-bg / bg-dark-bg-secondary(两模式保持深色)
- 深色面板上的文字保留 text-white(固定亮色,两模式可读)
- 遮罩 bg-black/50 → bg-overlay/50(独立 token,不随反色)
- border-t-gray-900 → border-t-border-dark 单独处理
- 验证: type-check 0 / lint 0 / Tailwind 生成确认 token 类产出 / 无 gray- 残留

src/app/admin/notifications/page.tsx

@@ -41,14 +41,14 @@ const NOTIFICATION_TYPE_ICONS: Record<string, React.ReactNode> = {
   review_pending: <AlertCircle className="w-4 h-4 text-amber-500" />,
   review_approved: <CheckCircle className="w-4 h-4 text-green-500" />,
   review_rejected: <XCircle className="w-4 h-4 text-red-500" />,
-  item_archived: <Archive className="w-4 h-4 text-gray-500" />,
+  item_archived: <Archive className="w-4 h-4 text-text-muted" />,
 };
 
 const NOTIFICATION_TYPE_COLORS: Record<string, string> = {
   review_pending: 'bg-amber-50 border-amber-200',
   review_approved: 'bg-green-50 border-green-200',
   review_rejected: 'bg-red-50 border-red-200',
-  item_archived: 'bg-gray-50 border-gray-200',
+  item_archived: 'bg-bg-secondary border-border-primary',
 };
 
 export default function NotificationsPage() {
@@ -143,7 +143,7 @@ export default function NotificationsPage() {
   if (authLoading || (!user && typeof window !== 'undefined')) {
     return (
       <div className="flex items-center justify-center h-64">
-        <div className="animate-spin w-8 h-8 border-2 border-gray-900 border-t-transparent rounded-full" />
+        <div className="animate-spin w-8 h-8 border-2 border-border-dark border-t-transparent rounded-full" />
       </div>
     );
   }
@@ -152,8 +152,8 @@ export default function NotificationsPage() {
     <div className="space-y-6">
       <div className="flex items-center justify-between">
         <div>
-          <h1 className="text-xl font-bold text-gray-900">通知中心</h1>
-          <p className="text-sm text-gray-500 mt-1">
+          <h1 className="text-xl font-bold text-text-primary">通知中心</h1>
+          <p className="text-sm text-text-muted mt-1">
             共 {total} 条通知
             {unreadCount > 0 && (
               <span className="ml-2 inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-red-100 text-red-700">
@@ -167,8 +167,8 @@ export default function NotificationsPage() {
             onClick={() => { setUnreadOnly(!unreadOnly); setPage(1); }}
             className={`flex items-center gap-2 px-3 py-2 rounded-lg text-sm font-medium border transition-colors ${
               unreadOnly
-                ? 'bg-gray-900 text-white border-gray-900'
-                : 'bg-white text-gray-600 border-gray-200 hover:border-gray-400'
+                ? 'bg-dark-bg text-white border-border-dark'
+                : 'bg-bg-primary text-text-tertiary border-border-primary hover:border-border-secondary'
             }`}
           >
             <Mail className="w-4 h-4" />
@@ -177,7 +177,7 @@ export default function NotificationsPage() {
           {unreadCount > 0 && (
             <button
               onClick={handleMarkAllAsRead}
-              className="flex items-center gap-2 px-3 py-2 bg-white text-gray-600 rounded-lg text-sm font-medium border border-gray-200 hover:border-gray-400 transition-colors"
+              className="flex items-center gap-2 px-3 py-2 bg-bg-primary text-text-tertiary rounded-lg text-sm font-medium border border-border-primary hover:border-border-secondary transition-colors"
             >
               <CheckCheck className="w-4 h-4" />
               全部已读
@@ -185,7 +185,7 @@ export default function NotificationsPage() {
           )}
           <button
             onClick={() => { fetchNotifications(); fetchUnreadCount(); }}
-            className="flex items-center gap-2 px-3 py-2 bg-white text-gray-600 rounded-lg text-sm font-medium border border-gray-200 hover:border-gray-400 transition-colors"
+            className="flex items-center gap-2 px-3 py-2 bg-bg-primary text-text-tertiary rounded-lg text-sm font-medium border border-border-primary hover:border-border-secondary transition-colors"
           >
             <RefreshCw className="w-4 h-4" />
             刷新
@@ -202,18 +202,18 @@ export default function NotificationsPage() {
       {/* Notifications list */}
       <div className="space-y-2">
         {loading ? (
-          <div className="flex items-center justify-center py-12 text-gray-400">
+          <div className="flex items-center justify-center py-12 text-text-muted">
             <div className="flex items-center gap-2">
-              <div className="animate-spin w-4 h-4 border-2 border-gray-400 border-t-transparent rounded-full" />
+              <div className="animate-spin w-4 h-4 border-2 border-border-secondary border-t-transparent rounded-full" />
               加载中...
             </div>
           </div>
         ) : notifications.length === 0 ? (
-          <div className="flex flex-col items-center justify-center py-16 text-gray-400">
-            <Bell className="w-12 h-12 mb-3 text-gray-200" />
+          <div className="flex flex-col items-center justify-center py-16 text-text-muted">
+            <Bell className="w-12 h-12 mb-3 text-text-muted" />
             <p className="text-sm">暂无通知</p>
             {unreadOnly && (
-              <p className="text-xs text-gray-300 mt-1">没有未读通知，试试查看全部</p>
+              <p className="text-xs text-text-muted mt-1">没有未读通知，试试查看全部</p>
             )}
           </div>
         ) : (
@@ -222,7 +222,7 @@ export default function NotificationsPage() {
               key={item.id}
               className={`relative flex items-start gap-4 p-4 rounded-lg border transition-colors ${
                 item.read
-                  ? 'bg-white border-gray-100'
+                  ? 'bg-bg-primary border-border-light'
                   : NOTIFICATION_TYPE_COLORS[item.type] || 'bg-blue-50 border-blue-200'
               }`}
             >
@@ -233,20 +233,20 @@ export default function NotificationsPage() {
 
               {/* Type icon */}
               <div className={`flex-shrink-0 w-8 h-8 rounded-full flex items-center justify-center ${
-                item.read ? 'bg-gray-100' : 'bg-white'
+                item.read ? 'bg-bg-hover' : 'bg-bg-primary'
               }`}>
-                {NOTIFICATION_TYPE_ICONS[item.type] || <Bell className="w-4 h-4 text-gray-400" />}
+                {NOTIFICATION_TYPE_ICONS[item.type] || <Bell className="w-4 h-4 text-text-muted" />}
               </div>
 
               {/* Content */}
               <div className="flex-1 min-w-0">
                 <div className="flex items-center gap-2 mb-1">
                   <span className={`text-xs font-medium px-1.5 py-0.5 rounded ${
-                    item.read ? 'text-gray-500' : ''
+                    item.read ? 'text-text-muted' : ''
                   }`}>
                     {NOTIFICATION_TYPE_LABELS[item.type] || item.type}
                   </span>
-                  <span className="text-xs text-gray-400 flex items-center gap-1">
+                  <span className="text-xs text-text-muted flex items-center gap-1">
                     <Clock className="w-3 h-3" />
                     {new Date(item.createdAt).toLocaleString('zh-CN', {
                       year: 'numeric',
@@ -257,10 +257,10 @@ export default function NotificationsPage() {
                     })}
                   </span>
                 </div>
-                <h3 className={`text-sm font-medium ${item.read ? 'text-gray-600' : 'text-gray-900'}`}>
+                <h3 className={`text-sm font-medium ${item.read ? 'text-text-tertiary' : 'text-text-primary'}`}>
                   {item.title}
                 </h3>
-                <p className={`text-xs mt-0.5 ${item.read ? 'text-gray-400' : 'text-gray-500'}`}>
+                <p className={`text-xs mt-0.5 ${item.read ? 'text-text-muted' : 'text-text-muted'}`}>
                   {item.message}
                 </p>
 
@@ -269,7 +269,7 @@ export default function NotificationsPage() {
                   {!item.read && (
                     <button
                       onClick={() => handleMarkAsRead(item.id)}
-                      className="text-xs text-gray-500 hover:text-gray-700 flex items-center gap-1"
+                      className="text-xs text-text-muted hover:text-text-secondary flex items-center gap-1"
                     >
                       <MailOpen className="w-3 h-3" />
                       标记已读
@@ -293,22 +293,22 @@ export default function NotificationsPage() {
 
       {/* Pagination */}
       {totalPages > 1 && (
-        <div className="flex items-center justify-between px-4 py-3 bg-white rounded-lg border border-gray-200">
-          <span className="text-sm text-gray-500">
+        <div className="flex items-center justify-between px-4 py-3 bg-bg-primary rounded-lg border border-border-primary">
+          <span className="text-sm text-text-muted">
             共 {total} 条，第 {page}/{totalPages} 页
           </span>
           <div className="flex items-center gap-2">
             <button
               onClick={() => setPage((p) => Math.max(1, p - 1))}
               disabled={page <= 1}
-              className="px-3 py-1.5 text-sm rounded border border-gray-200 hover:bg-gray-100 disabled:opacity-50 disabled:cursor-not-allowed"
+              className="px-3 py-1.5 text-sm rounded border border-border-primary hover:bg-bg-hover disabled:opacity-50 disabled:cursor-not-allowed"
             >
               上一页
             </button>
             <button
               onClick={() => setPage((p) => Math.min(totalPages, p + 1))}
               disabled={page >= totalPages}
-              className="px-3 py-1.5 text-sm rounded border border-gray-200 hover:bg-gray-100 disabled:opacity-50 disabled:cursor-not-allowed"
+              className="px-3 py-1.5 text-sm rounded border border-border-primary hover:bg-bg-hover disabled:opacity-50 disabled:cursor-not-allowed"
             >
               下一页
             </button>