v4: /settings, /manage and /notifications title themselves alike, with a bare heading above their sections — Settings and Manage borrowed the edit form's .form-page-header, a panel rounded only on top to cap the panels under it, so on a page without them it ended in a square edge, and its title was the size of the section headings below. Notifications had a heading of its own. All three now take .page-header and .page-title: a bare h1 a size above the sections' h2, with what goes with it (the unread count) at the row's end; the edit forms keep their panel header. Times and Melange set their display type on .page-title, and the .profile-subpage-* rules, unused since the profile's pages became its tabs, are gone. (The CSS went in with d683ac0, which a concurrent session committed from the shared tree.) 21 Settings, Manage and Notifications tests pass, and deno fmt is clean; checked in screenshots in Smooth at 1280 and 390px.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/pages/Manage.tsx

@@ -25,8 +25,8 @@ export function Manage(): React.JSX.Element {
   if (!can(user, "category:manage")) return <NotFound />;
   return (
     <PageShell>
-      <div className="form-page-header">
-        <h1 className="form-page-title">
+      <div className="page-header">
+        <h1 className="page-title">
           <Trans>Manage</Trans>
         </h1>
       </div>

src/pages/Notifications.tsx

@@ -490,8 +490,8 @@ export function Notifications(): React.JSX.Element {
   return (
     <PageShell>
       <div className="notifications-page">
-        <div className="notifications-header">
-          <h1 className="notifications-title">
+        <div className="page-header">
+          <h1 className="page-title">
             <span className="notifications-title-bell" aria-hidden="true">
               🔔
             </span>

src/pages/Settings.tsx

@@ -78,8 +78,8 @@ export function Settings(): React.JSX.Element {
 
   return (
     <PageShell>
-      <div className="form-page-header">
-        <h1 className="form-page-title">
+      <div className="page-header">
+        <h1 className="page-title">
           <Trans>Settings</Trans>
         </h1>
       </div>

src/themes/melange.css

@@ -265,7 +265,7 @@
 }
 
 [data-style="melange"] .form-page-title,
-[data-style="melange"] .profile-subpage-title,
+[data-style="melange"] .page-title,
 [data-style="melange"] .profile-section-title,
 [data-style="melange"] .comment-section-title,
 [data-style="melange"] .related-section-title {

src/themes/nyt.css

@@ -88,8 +88,7 @@
 [data-style="nyt"] .playlist-detail-title,
 [data-style="nyt"] .form-page-title,
 [data-style="nyt"] .auth-card-title,
-[data-style="nyt"] .profile-subpage-title,
-[data-style="nyt"] .notifications-title,
+[data-style="nyt"] .page-title,
 [data-style="nyt"] .dump-create-title {
   font-family: var(--font-display);
   font-weight: 400; /* Instrument Serif is single-weight; size carries it */