Unify page layouts, compact headers and shared UI styling

frontend/app/profile/invites/page.tsx

@@ -1,5 +1,7 @@
 'use client'
 
+import PageHeading from '../../ui/PageHeading'
+
 import { useRouter } from 'next/navigation'
 import { useEffect, useMemo, useState } from 'react'
 import { authFetch, clearToken, getApiBase, getToken } from '../../lib/auth'
@@ -225,14 +227,8 @@ export default function ProfileInvitesPage() {
   if (loading) return <main className="card">Loading invite workspace…</main>
 
   return (
-    <main className="card">
-      <div className="user-directory-panel-header profile-page-header">
-        <div>
-          <span className="section-kicker">04 · Invites</span>
-          <h1>Invite someone to Grizzlyflix</h1>
-          <p className="lede">Create a secure invitation one simple decision at a time.</p>
-        </div>
-      </div>
+    <main className="card invites-page">
+      <PageHeading title="Invites" description="Invite someone to Grizzlyflix and manage the links you share." />
       {error && <div className="error-banner">{error}</div>}
       {status && <div className="status-banner">{status}</div>}