타이틀 크기 및 상단 패딩 밀림 제거

adminfront/src/features/auth/AuthPage.tsx

@@ -4,9 +4,9 @@ import PermissionChecker from "./components/PermissionChecker";
 function AuthPage() {
   return (
     <div className="space-y-6">
-      <div className="flex flex-wrap items-end justify-between gap-4">
+      <div className="flex flex-wrap items-start justify-between gap-4">
-        <div className="space-y-1">
+        <div className="space-y-2">
-          <h2 className="text-2xl font-semibold tracking-tight">
+          <h2 className="text-3xl font-semibold">
             {t("ui.admin.auth_guard.title", "Auth Guard")}
           </h2>
           <p className="text-sm text-muted-foreground">

adminfront/src/features/integrity/DataIntegrityPage.tsx

@@ -325,13 +325,13 @@ function DataIntegrityContent() {
   const recheckMessage = recheckStatusText(recheckStatus);
 
   return (
-    <main className="space-y-6 p-6 md:p-8">
+    <main className="space-y-6">
-      <div className="flex flex-wrap items-center justify-between gap-3">
+      <header className="flex flex-shrink-0 flex-wrap items-start justify-between gap-4 sticky top-[-2.5rem] z-20 -mt-4 bg-background/95 pb-2 pt-4 backdrop-blur">
-        <div>
+        <div className="space-y-2">
-          <h2 className="text-2xl font-semibold tracking-tight">
+          <h2 className="text-3xl font-semibold">
             {t("ui.admin.integrity.title", "데이터 정합성 검증")}
           </h2>
-          <p className="mt-1 text-sm text-muted-foreground">
+          <p className="text-sm text-muted-foreground">
             {t(
               "msg.admin.integrity.subtitle",
               "Review integrity status and inspect checks across the admin data model.",
@@ -359,8 +359,9 @@ function DataIntegrityContent() {
             </output>
           ) : null}
         </div>
-      </div>
+      </header>
 
+      <div className="space-y-4 pb-6">
         {isError ? (
           <section className="rounded-lg border border-destructive/30 bg-destructive/10 p-4 text-sm text-destructive">
             {(error as Error)?.message ||
@@ -375,7 +376,10 @@ function DataIntegrityContent() {
           <div className="flex flex-wrap items-center justify-between gap-3 border-b border-border pb-4">
             <div>
               <h3 className="text-base font-semibold">
-              {t("ui.admin.integrity.read_model.title", "Read model integrity")}
+                {t(
+                  "ui.admin.integrity.read_model.title",
+                  "Read model integrity",
+                )}
               </h3>
               <p className="text-sm text-muted-foreground">
                 {t(
@@ -460,7 +464,10 @@ function DataIntegrityContent() {
                           {integrityCheckLabel(check.key, check.label)}
                         </div>
                         <p className="mt-1 text-sm text-muted-foreground">
-                        {integrityCheckDescription(check.key, check.description)}
+                          {integrityCheckDescription(
+                            check.key,
+                            check.description,
+                          )}
                         </p>
                       </div>
                     </div>
@@ -529,6 +536,7 @@ function DataIntegrityContent() {
             onToggle={toggleOrphanID}
           />
         </section>
+      </div>
     </main>
   );
 }

adminfront/src/features/overview/GlobalOverviewPage.tsx

@@ -194,7 +194,7 @@ function IntegrityOverviewSummary() {
 
   return (
     <section className="border-t border-border/60 pt-4">
-      <div className="flex flex-wrap items-center justify-between gap-3">
+      <div className="flex flex-wrap items-start justify-between gap-3">
         <div className="flex items-center gap-2">
           {data.status === "pass" ? (
             <CheckCircle2 size={18} className="text-emerald-600" />
@@ -287,7 +287,7 @@ function RPUsageMixedChart({
 
   return (
     <section className="space-y-3">
-      <div className="flex flex-wrap items-center justify-between gap-3">
+      <div className="flex flex-wrap items-start justify-between gap-3">
         <div className="space-y-1">
           <h3 className="text-base font-semibold">
             {t("ui.admin.overview.chart.title", "회사별 앱별 로그인 요청 현황")}
@@ -507,9 +507,9 @@ function GlobalOverviewPage() {
 
   return (
     <div className="space-y-4 animate-in fade-in duration-500">
-      <div className="flex flex-wrap items-end justify-between gap-4">
+      <div className="flex flex-wrap items-start justify-between gap-4">
         <div className="space-y-1">
-          <h2 className="text-2xl font-semibold tracking-tight">
+          <h2 className="text-3xl font-semibold">
             {t("ui.common.overview.title", "운영 현황")}
           </h2>
           <p className="text-sm text-muted-foreground">
@@ -562,7 +562,7 @@ function GlobalOverviewPage() {
 
       {usageQuery.isError ? (
         <section className="space-y-2">
-          <div className="flex flex-wrap items-center justify-between gap-3">
+          <div className="flex flex-wrap items-start justify-between gap-3">
             <div className="space-y-1">
               <h3 className="text-base font-semibold">
                 {t(

adminfront/src/features/projections/UserProjectionPage.tsx

@@ -95,16 +95,16 @@ function UserProjectionContent() {
   const actionError = reconcileMutation.error ?? resetMutation.error;
 
   return (
-    <main className="space-y-6 p-6 md:p-8">
+    <main className="space-y-6 flex flex-col h-[calc(100vh-theme(spacing.32))]">
-      <div className="flex flex-wrap items-center justify-between gap-3">
+      <header className="flex flex-shrink-0 flex-wrap items-start justify-between gap-4 sticky top-[-2.5rem] z-20 -mt-4 bg-background/95 pb-2 pt-4 backdrop-blur">
-        <div>
+        <div className="space-y-2">
-          <h2 className="text-2xl font-semibold tracking-tight">
+          <h2 className="text-3xl font-semibold">
             {t(
               "ui.admin.user_projection.title",
               "User Projection Management",
             )}
           </h2>
-          <p className="mt-1 text-sm text-muted-foreground">
+          <p className="text-sm text-muted-foreground">
             {t(
               "msg.admin.user_projection.subtitle",
               "Review and sync the Kratos user read model.",
@@ -134,7 +134,7 @@ function UserProjectionContent() {
             )}
           </Button>
         </div>
-      </div>
+      </header>
 
       {isError ? (
         <section className="rounded-lg border border-destructive/30 bg-destructive/10 p-4 text-sm text-destructive">