feat(mobile): swap reports header to PageHeader

Plain h1 + p replaced with the mobile-aware PageHeader primitive so
the reports landing matches dashboard/settings.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/components/reports/reports-page-client.tsx

@@ -3,6 +3,7 @@
 import { useRealtimeInvalidation } from '@/hooks/use-realtime-invalidation';
 import { GenerateReportForm } from '@/components/reports/generate-report-form';
 import { ReportsList } from '@/components/reports/reports-list';
+import { PageHeader } from '@/components/shared/page-header';
 
 export function ReportsPageClient() {
   useRealtimeInvalidation({
@@ -13,12 +14,10 @@ export function ReportsPageClient() {
 
   return (
     <div className="space-y-6">
-      <div>
-        <h1 className="text-2xl font-bold text-foreground">Reports</h1>
-        <p className="text-muted-foreground">
-          Generate and download port reports as PDF documents
-        </p>
-      </div>
+      <PageHeader
+        title="Reports"
+        description="Generate and download port reports as PDF documents"
+      />
 
       <GenerateReportForm />
       <ReportsList />