diff --git a/adminfront/src/features/auth/AuthPage.tsx b/adminfront/src/features/auth/AuthPage.tsx
index 8985b290..b68f6757 100644
--- a/adminfront/src/features/auth/AuthPage.tsx
+++ b/adminfront/src/features/auth/AuthPage.tsx
@@ -1,26 +1,20 @@
 import { ShieldHalf } from "lucide-react";
+import { PageHeader } from "../../../../common/core/components/page";
 import { t } from "../../lib/i18n";
 import PermissionChecker from "./components/PermissionChecker";
 
 function AuthPage() {
   return (
     <div className="space-y-6">
-      <div className="flex flex-wrap items-start justify-between gap-4">
-        <div className="space-y-2">
-          <h2 className="flex items-center gap-2 text-3xl font-semibold">
-            <span className="flex h-10 w-10 items-center justify-center rounded-xl border border-primary/15 bg-primary/10 text-primary">
-              <ShieldHalf size={20} />
-            </span>
-            <span>{t("ui.admin.auth_guard.title", "Auth Guard")}</span>
-          </h2>
-          <p className="text-sm text-muted-foreground">
-            {t(
-              "ui.admin.auth_guard.subtitle",
-              "Verify admin privileges and ReBAC relationships against the policy engine.",
-            )}
-          </p>
-        </div>
-      </div>
+      <PageHeader
+        titleAs="h2"
+        icon={<ShieldHalf size={20} />}
+        title={t("ui.admin.auth_guard.title", "Auth Guard")}
+        description={t(
+          "ui.admin.auth_guard.subtitle",
+          "Verify admin privileges and ReBAC relationships against the policy engine.",
+        )}
+      />
 
       <PermissionChecker />
     </div>