v4: the dump title editor's Cancel is a button, beside Save — it was the grey text link of the full forms' action rows, next to a filled Save, where every other inline editor pairs Save with a bordered Cancel; it now takes btn-secondary, the same height as btn-primary. Save and Cancel sit in .dump-title-actions and wrap together, so on a phone they go under the input as a pair instead of Cancel dropping to a line of its own. 30 Dump page tests pass, and tsc, eslint and deno fmt are clean; checked in screenshots in Smooth, Kanagawa, Brutalist and GeoCities at 1200 and 360px.

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

src/App.css

@@ -314,6 +314,12 @@
   font-weight: 700;
 }
 
+/* Save and Cancel wrap together, under the input on a phone. */
+.dump-title-actions {
+  display: flex;
+  gap: 0.5rem;
+}
+
 .dump-title-error {
   width: 100%;
   margin: 0;
@@ -2618,33 +2624,6 @@ body.has-player .chat-fab {
   color: var(--color-success);
 }
 
-/* ── Profile sub-pages (dumps / upvoted / playlists) ── */
-.profile-subpage-back {
-  display: inline-block;
-  font-size: var(--text-sm);
-  color: var(--color-text-muted);
-  text-decoration: none;
-  margin-bottom: 0.75rem;
-}
-
-.profile-subpage-back:hover {
-  color: var(--color-text);
-}
-
-.profile-subpage-title-row {
-  display: flex;
-  align-items: center;
-  gap: 0.75rem;
-  flex-wrap: wrap;
-}
-
-.profile-subpage-title {
-  margin: 0;
-  font-size: var(--text-2xl);
-  font-weight: 700;
-  flex: 1;
-}
-
 /* ── Profile "View all" link ── */
 .profile-view-all {
   display: inline-block;
@@ -2785,6 +2764,30 @@ body.has-player .chat-fab {
   gap: 2.5rem;
 }
 
+/* ── Page header ──
+   A page that edits nothing (settings, manage, notifications) names itself
+   with a bare h1, a size above its sections' h2, and keeps whatever goes
+   with it (a count) at the row's end. The edit forms cap their panels with
+   .form-page-header instead. */
+.page-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  gap: 0.5rem 1rem;
+}
+
+.page-title {
+  margin: 0;
+  font-size: var(--text-3xl);
+  font-weight: 700;
+  line-height: 1.15;
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  overflow-wrap: anywhere;
+}
+
 .page-content--centered {
   align-items: center;
   padding-top: 2.5rem;
@@ -6579,21 +6582,9 @@ body.has-player .chat-fab {
   margin: 0 auto;
   padding: 1.5rem 1rem 3rem;
 }
-.notifications-header {
+.notifications-page > .page-header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 1rem;
   margin-bottom: 1.75rem;
 }
-.notifications-title {
-  font-size: var(--text-2xl);
-  font-weight: 700;
-  margin: 0;
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-}
 .notifications-title-bell {
   font-size: var(--text-lg);
 }

src/pages/Dump.tsx

@@ -425,6 +425,7 @@ export function Dump(): React.JSX.Element {
                       disabled={titleSaving}
                       autoFocus
                     />
+                    <div className="dump-title-actions">
                       <button
                         type="button"
                         className="btn-primary"
@@ -437,12 +438,13 @@ export function Dump(): React.JSX.Element {
                       </button>
                       <button
                         type="button"
-                      className="form-cancel"
+                        className="btn-secondary"
                         onClick={() => setTitleEditing(false)}
                         disabled={titleSaving}
                       >
                         <Trans>Cancel</Trans>
                       </button>
+                    </div>
                     {titleError && (
                       <p className="dump-title-error">{titleError}</p>
                     )}