Move project renaming from the project view to configuration

- ProjectView: title is now a plain <h1>, no longer inline-editable
  (dropped titleDraft/saveTitle/patchProject and the input markup --
  nothing else used patchProject).
- ProjectConfigureView: new 'Project name' section above 'Statuses',
  a small PATCH /api/projects/:id form. On success it also calls the
  projects store's fetchProjects(), since the dashboard grid and the
  sidebar's project dropdown read from that store and otherwise
  wouldn't pick up the new name (or the project's new alphabetical
  position) until some unrelated reload.
- style.css: dropped the now-dead .project-head__title input rules
  (both views render a plain heading now); .project-head__title gains
  word-break so a long static title still wraps instead of overflowing.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

web/src/style.css

@@ -575,27 +575,7 @@ h1 {
   flex: 1;
   min-width: 0;
   margin: 0 0 0.5rem;
-}
-
-.project-head__title input {
-  width: 100%;
-  font: inherit;
-  font-size: 1.4rem;
-  font-weight: 600;
-  color: var(--text);
-  background: transparent;
-  border: 1px solid transparent;
-  border-radius: 6px;
-  padding: 0.25rem 0.4rem;
-}
-
-.project-head__title input:hover {
-  border-color: var(--border);
-}
-
-.project-head__title input:focus {
-  color: var(--text);
-  background: var(--bg);
+  word-break: break-word;
 }
 
 .project-head__actions {

web/src/views/ProjectConfigureView.vue

@@ -4,10 +4,12 @@ import { useRoute } from 'vue-router'
 import draggable from 'vuedraggable'
 import ProjectManageMenu from '../components/ProjectManageMenu.vue'
 import { ApiError, apiRequest } from '../lib/api'
+import { useProjectsStore } from '../stores/projects'
 import type { CardStatus, Project } from '../types'
 
 const route = useRoute()
 const projectId = Number(route.params.id)
+const projects = useProjectsStore()
 
 const project = ref<Project | null>(null)
 const statuses = ref<CardStatus[]>([])
@@ -25,6 +27,7 @@ async function load() {
     ])
     project.value = fetched
     statuses.value = fetchedStatuses
+    nameDraft.value = fetched.title
   } catch (e) {
     if (e instanceof ApiError && e.status === 404) {
       loadError.value = 'That project does not exist.'
@@ -34,6 +37,37 @@ async function load() {
   }
 }
 
+// --- Project name ---------------------------------------------------------
+const nameDraft = ref('')
+const renaming = ref(false)
+const renameError = ref<ApiError | null>(null)
+
+async function onRenameProject() {
+  if (!project.value) return
+  const next = nameDraft.value.trim()
+  if (next === project.value.title) return
+
+  renaming.value = true
+  renameError.value = null
+  try {
+    const { project: updated } = await apiRequest<{ project: Project }>(`/projects/${projectId}`, {
+      method: 'PATCH',
+      auth: true,
+      body: { title: next },
+    })
+    project.value = updated
+    nameDraft.value = updated.title
+    // The dashboard grid and the sidebar's project dropdown both read from
+    // this store -- re-fetch so the new name (and alphabetical position)
+    // show up there too, not just in this view's own header.
+    await projects.fetchProjects()
+  } catch (e) {
+    renameError.value = e instanceof ApiError ? e : new ApiError('Could not save the name.', 0)
+  } finally {
+    renaming.value = false
+  }
+}
+
 // --- Reorder (drag-and-drop) ----------------------------------------------
 // vuedraggable mutates `statuses` in place as the user drags; @change fires
 // once the drop lands, and we persist the whole new order.
@@ -161,6 +195,28 @@ onBeforeUnmount(() => window.removeEventListener('keydown', onKeydown))
         </div>
       </div>
 
+      <section class="config-section">
+        <h2>Project name</h2>
+
+        <form class="form" @submit.prevent="onRenameProject">
+          <label>
+            <span>Name</span>
+            <input v-model="nameDraft" type="text" maxlength="255" required />
+            <small v-if="renameError?.fieldError('title')" class="field-error">
+              {{ renameError.fieldError('title') }}
+            </small>
+          </label>
+
+          <p v-if="renameError && Object.keys(renameError.details).length === 0" class="form-error">
+            {{ renameError.message }}
+          </p>
+
+          <button type="submit" :disabled="renaming || nameDraft.trim() === project.title">
+            {{ renaming ? 'Saving…' : 'Save name' }}
+          </button>
+        </form>
+      </section>
+
       <section class="config-section">
         <h2>Statuses</h2>
         <p class="muted">

web/src/views/ProjectView.vue

@@ -28,8 +28,6 @@ const tabs = [
 ] as const
 const activeTab = ref<(typeof tabs)[number]['key']>('kanban')
 
-const titleDraft = ref('')
-
 const newText = ref('')
 const submitting = ref(false)
 
@@ -96,10 +94,6 @@ async function onColumnChange(change: ColumnChange, column: Column) {
   }
 }
 
-watch(project, (value) => {
-  if (value) titleDraft.value = value.title
-})
-
 onMounted(() => void load())
 
 async function load() {
@@ -122,31 +116,6 @@ async function load() {
   }
 }
 
-async function patchProject(fields: { title?: string }) {
-  actionError.value = null
-  try {
-    const { project: updated } = await apiRequest<{ project: Project }>(`/projects/${projectId}`, {
-      method: 'PATCH',
-      auth: true,
-      body: fields,
-    })
-    project.value = updated
-  } catch (e) {
-    actionError.value = e instanceof ApiError ? e.message : 'Could not save the change.'
-    if (project.value) titleDraft.value = project.value.title
-  }
-}
-
-function saveTitle() {
-  if (!project.value) return
-  const next = titleDraft.value.trim()
-  if (next === '') {
-    titleDraft.value = project.value.title // title is required
-    return
-  }
-  if (next !== project.value.title) void patchProject({ title: next })
-}
-
 /** Run a store mutation, surfacing failures and resyncing from the server. */
 async function run(op: Promise<unknown>) {
   actionError.value = null
@@ -178,16 +147,7 @@ async function onCreate() {
 
     <template v-else-if="project">
       <div class="project-head">
-        <h1 class="project-head__title">
-          <input
-            v-model="titleDraft"
-            type="text"
-            maxlength="255"
-            aria-label="Project title"
-            @blur="saveTitle"
-            @keyup.enter="($event.target as HTMLInputElement).blur()"
-          />
-        </h1>
+        <h1 class="project-head__title">{{ project.title }}</h1>
 
         <ProjectManageMenu
           :project-id="projectId"