diff --git a/backend/app/api/projects.py b/backend/app/api/projects.py
index 5d86b51..65bb6c0 100644
--- a/backend/app/api/projects.py
+++ b/backend/app/api/projects.py
@@ -28,6 +28,14 @@
     return list(db.scalars(select(Project).order_by(Project.id)).all())
 
 
+@router.get("/{project_id}", response_model=ProjectOut)
+async def get_project(project_id: int, db: DbDep, user: UserDep) -> Project:
+    project = db.get(Project, project_id)
+    if project is None:
+        raise HTTPException(status_code=404, detail="Project not found")
+    return project
+
+
 @router.patch("/{project_id}", response_model=ProjectOut)
 async def update_project(
     project_id: int, schema: ProjectUpdate, db: DbDep, user: UserDep
diff --git a/backend/app/api/tasks.py b/backend/app/api/tasks.py
index ef24453..cb9163d 100644
--- a/backend/app/api/tasks.py
+++ b/backend/app/api/tasks.py
@@ -22,15 +22,36 @@
     return task
 
 
+def _validate_parent(db: Any, task: Task | None, parent_id: int | None) -> None:
+    """Родитель должен существовать; циклы в дереве запрещены."""
+    if parent_id is None:
+        return
+    if task is not None and parent_id == task.id:
+        raise HTTPException(status_code=400, detail="Task cannot be its own parent")
+    parent = cast(Task | None, db.get(Task, parent_id))
+    if parent is None:
+        raise HTTPException(status_code=400, detail="Unknown parent task")
+    if task is not None:
+        ancestor: Task | None = parent
+        while ancestor is not None:
+            if ancestor.id == task.id:
+                raise HTTPException(status_code=400, detail="Cycle in task tree")
+            ancestor = ancestor.parent
+
+
 @router.post("")
 async def create_task(
     schema: TaskCreate, db: DbDep, user: UserDep, background: BackgroundTasks
 ) -> dict[str, int]:
     """Быстрый захват: достаточно title — задача попадает в стек (raw, to_do).
 
-    Сразу в фоне запускается автодетализация (LLM-предложение метаданных).
+    С parent_task_id — создание подзадачи (M3). Сразу в фоне запускается
+    автодетализация (LLM-предложение метаданных).
     """
-    task = Task(title=schema.title, description=schema.description)
+    _validate_parent(db, None, schema.parent_task_id)
+    task = Task(
+        title=schema.title, description=schema.description, parent_task_id=schema.parent_task_id
+    )
     db.add(task)
     db.flush()
     # Коммитим до планирования фоновой работы: BackgroundTasks выполняются ДО
@@ -47,6 +68,8 @@
     detail_state: str | None = Query(None),
     status: str | None = Query(None),
     project_id: int | None = Query(None),
+    tag_id: int | None = Query(None),
+    parent_id: int | None = Query(None),
 ) -> list[Task]:
     stmt = select(Task).order_by(Task.created_at.desc())
     if detail_state:
@@ -55,6 +78,10 @@
         stmt = stmt.where(Task.status == status)
     if project_id:
         stmt = stmt.where(Task.project_id == project_id)
+    if parent_id is not None:
+        stmt = stmt.where(Task.parent_task_id == parent_id)
+    if tag_id:
+        stmt = stmt.where(Task.tags.any(Tag.id == tag_id))
     return list(db.scalars(stmt).all())
 
 
@@ -75,6 +102,8 @@
     if "project_id" in data and data["project_id"] is not None:
         if db.get(Project, data["project_id"]) is None:
             raise HTTPException(status_code=400, detail="Unknown project")
+    if "parent_task_id" in data:
+        _validate_parent(db, task, data["parent_task_id"])
     if "tag_ids" in data:
         tag_ids = data.pop("tag_ids") or []
         tags = db.scalars(select(Tag).where(Tag.id.in_(tag_ids))).all()
diff --git a/backend/app/models.py b/backend/app/models.py
index ae06ffe..68a398b 100644
--- a/backend/app/models.py
+++ b/backend/app/models.py
@@ -36,6 +36,10 @@
     parent_task_id: Mapped[int | None] = mapped_column(
         ForeignKey("tasks.id"), nullable=True, default=None
     )
+    parent: Mapped["Task | None"] = relationship(
+        "Task", back_populates="children", remote_side="Task.id"
+    )
+    children: Mapped[list["Task"]] = relationship("Task", back_populates="parent")
     project_id: Mapped[int | None] = mapped_column(
         ForeignKey("projects.id"), nullable=True, default=None
     )
diff --git a/backend/app/schemas.py b/backend/app/schemas.py
index ac930e1..c96f533 100644
--- a/backend/app/schemas.py
+++ b/backend/app/schemas.py
@@ -28,6 +28,7 @@
 class TaskCreate(BaseModel):
     title: str = Field(min_length=1, max_length=500)
     description: str = ""
+    parent_task_id: int | None = None  # подзадача (M3)
 
 
 class TaskUpdate(BaseModel):
@@ -36,6 +37,7 @@
     title: str | None = Field(None, max_length=500)
     description: str | None = None
     project_id: int | None = None
+    parent_task_id: int | None = None
     tag_ids: list[int] | None = None
     priority: int | None = None
     status: str | None = None
diff --git a/backend/tests/test_tree.py b/backend/tests/test_tree.py
new file mode 100644
index 0000000..e68c275
--- /dev/null
+++ b/backend/tests/test_tree.py
@@ -0,0 +1,69 @@
+"""Тесты M3: дерево подзадач (родитель, циклы) и карточка проекта."""
+
+from fastapi.testclient import TestClient
+
+
+def test_create_subtask(client: TestClient) -> None:
+    parent = client.post("/api/tasks", json={"title": "Ремонт балкона"}).json()["id"]
+    child = client.post(
+        "/api/tasks", json={"title": "Купить краску", "parent_task_id": parent}
+    ).json()["id"]
+
+    task = client.get(f"/api/tasks/{child}").json()
+    assert task["parent_task_id"] == parent
+
+    root = client.get(f"/api/tasks/{parent}").json()
+    assert root["parent_task_id"] is None
+
+
+def test_subtask_of_unknown_parent_rejected(client: TestClient) -> None:
+    resp = client.post("/api/tasks", json={"title": "x", "parent_task_id": 999})
+    assert resp.status_code == 400
+
+
+def test_task_cannot_be_own_parent(client: TestClient) -> None:
+    task_id = client.post("/api/tasks", json={"title": "x"}).json()["id"]
+    resp = client.patch(f"/api/tasks/{task_id}", json={"parent_task_id": task_id})
+    assert resp.status_code == 400
+
+
+def test_cycle_rejected_on_reparent(client: TestClient) -> None:
+    a = client.post("/api/tasks", json={"title": "A"}).json()["id"]
+    b = client.post("/api/tasks", json={"title": "B", "parent_task_id": a}).json()["id"]
+    c = client.post("/api/tasks", json={"title": "C", "parent_task_id": b}).json()["id"]
+
+    # c → a создало бы цикл a → b → c → a
+    assert client.patch(f"/api/tasks/{a}", json={"parent_task_id": c}).status_code == 400
+
+    # валидный перенос: c → a
+    moved = client.patch(f"/api/tasks/{c}", json={"parent_task_id": a}).json()
+    assert moved["parent_task_id"] == a
+
+
+def test_detach_from_parent(client: TestClient) -> None:
+    parent = client.post("/api/tasks", json={"title": "P"}).json()["id"]
+    child_id = client.post(
+        "/api/tasks", json={"title": "C", "parent_task_id": parent}
+    ).json()["id"]
+    detached = client.patch(f"/api/tasks/{child_id}", json={"parent_task_id": None}).json()
+    assert detached["parent_task_id"] is None
+
+
+def test_get_single_project(client: TestClient) -> None:
+    pid = client.post(
+        "/api/projects", json={"name": "Дача", "note": "Ссылки: [форум](https://example.com)"}
+    ).json()["id"]
+    project = client.get(f"/api/projects/{pid}").json()
+    assert project["name"] == "Дача"
+    assert "форум" in project["note"]
+    assert client.get("/api/projects/999").status_code == 404
+
+
+def test_project_note_update(client: TestClient) -> None:
+    pid = client.post("/api/projects", json={"name": "Проект"}).json()["id"]
+    updated = client.patch(
+        f"/api/projects/{pid}",
+        json={"note": "- задача 1\n- задача 2", "relevance_status": "paused"},
+    ).json()
+    assert updated["note"].startswith("- задача 1")
+    assert updated["relevance_status"] == "paused"
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 9713063..719ec08 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -9,6 +9,8 @@
 const navItems = [
   { id: 'stack', label: 'Стек входящих', icon: 'ph-inbox', to: '/stack' },
   { id: 'tree', label: 'Дерево задач', icon: 'ph-tree-structure', to: '/tree' },
+  { id: 'list', label: 'Список задач', icon: 'ph-list-bullets', to: '/list' },
+  { id: 'projects', label: 'Проекты', icon: 'ph-folders', to: '/projects' },
 ]
 
 const currentLabel = computed(() => {
diff --git a/frontend/src/api.ts b/frontend/src/api.ts
index 32b8a0b..8f24502 100644
--- a/frontend/src/api.ts
+++ b/frontend/src/api.ts
@@ -51,6 +51,7 @@
   title?: string
   description?: string
   project_id?: number | null
+  parent_task_id?: number | null
   tag_ids?: number[]
   priority?: number | null
   status?: string
@@ -82,15 +83,22 @@
 
 export const api = {
   // tasks
-  listTasks: (params: Record<string, string | number> = {}) =>
-    request<Task[]>('/api/tasks?' + new URLSearchParams(
-      Object.entries(params).map(([k, v]) => [k, String(v)]),
-    )),
+  listTasks: (params: Record<string, string | number | null | undefined> = {}) => {
+    const qs = new URLSearchParams()
+    Object.entries(params).forEach(([k, v]) => {
+      if (v !== undefined && v !== null && v !== '') qs.set(k, String(v))
+    })
+    return request<Task[]>('/api/tasks?' + qs)
+  },
   getTask: (id: number) => request<Task>(`/api/tasks/${id}`),
-  createTask: (title: string, description = '') =>
+  createTask: (title: string, description = '', parentTaskId?: number) =>
     request<{ id: number }>('/api/tasks', {
       method: 'POST',
-      body: JSON.stringify({ title, description }),
+      body: JSON.stringify({
+        title,
+        description,
+        ...(parentTaskId !== undefined ? { parent_task_id: parentTaskId } : {}),
+      }),
     }),
   updateTask: (id: number, patch: TaskUpdateInput) =>
     request<Task>(`/api/tasks/${id}`, { method: 'PATCH', body: JSON.stringify(patch) }),
@@ -119,8 +127,13 @@
   attachmentUrl: (id: number) => `/api/attachments/${id}/file`,
   // projects
   listProjects: () => request<Project[]>('/api/projects'),
+  getProject: (id: number) => request<Project>(`/api/projects/${id}`),
   createProject: (name: string) =>
     request<Project>('/api/projects', { method: 'POST', body: JSON.stringify({ name }) }),
+  updateProject: (id: number, patch: Partial<Omit<Project, 'id'>>) =>
+    request<Project>(`/api/projects/${id}`, { method: 'PATCH', body: JSON.stringify(patch) }),
+  deleteProject: (id: number) =>
+    request<{ ok: boolean }>(`/api/projects/${id}`, { method: 'DELETE' }),
   // tags
   listTags: () => request<Tag[]>('/api/tags'),
   createTag: (name: string) =>
diff --git a/frontend/src/main.ts b/frontend/src/main.ts
index 2b1d4e2..9a7b4bd 100644
--- a/frontend/src/main.ts
+++ b/frontend/src/main.ts
@@ -6,6 +6,8 @@
 import { GnexusUiVue } from 'gnexus-ui-kit/vue'
 
 import App from './App.vue'
+import ListView from './views/ListView.vue'
+import ProjectsView from './views/ProjectsView.vue'
 import StackView from './views/StackView.vue'
 import TreeView from './views/TreeView.vue'
 
@@ -15,6 +17,8 @@
     { path: '/', redirect: '/stack' },
     { path: '/stack', component: StackView },
     { path: '/tree', component: TreeView },
+    { path: '/list', component: ListView },
+    { path: '/projects', component: ProjectsView },
   ],
 })
 
diff --git a/frontend/src/taskui.ts b/frontend/src/taskui.ts
new file mode 100644
index 0000000..62f1c7d
--- /dev/null
+++ b/frontend/src/taskui.ts
@@ -0,0 +1,42 @@
+// Общие помощники UI задач: подписи статусов, приоритеты, Markdown.
+
+import DOMPurify from 'dompurify'
+import { marked } from 'marked'
+
+export const STATUS_LABELS: Record<string, string> = {
+  to_do: 'К выполнению',
+  in_progress: 'В работе',
+  done: 'Завершено',
+  cancelled: 'Отменено',
+  deferred: 'Отложено',
+}
+
+export const STATUS_VARIANTS: Record<string, string> = {
+  to_do: 'info',
+  in_progress: 'accent',
+  done: 'success',
+  cancelled: 'error',
+  deferred: 'warning',
+}
+
+export const RELEVANCE_LABELS: Record<string, string> = {
+  active: 'Активен',
+  paused: 'Приостановлен',
+  archived: 'Закрыт',
+}
+
+export function statusLabel(status: string): string {
+  return STATUS_LABELS[status] ?? status
+}
+
+export function statusVariant(status: string): string {
+  return STATUS_VARIANTS[status] ?? 'neutral'
+}
+
+export function relevanceLabel(status: string): string {
+  return RELEVANCE_LABELS[status] ?? status
+}
+
+export function renderMarkdown(text: string): string {
+  return DOMPurify.sanitize(marked.parse(text, { async: false }))
+}
\ No newline at end of file
diff --git a/frontend/src/views/ListView.vue b/frontend/src/views/ListView.vue
new file mode 100644
index 0000000..f187fe1
--- /dev/null
+++ b/frontend/src/views/ListView.vue
@@ -0,0 +1,156 @@
+<script setup lang="ts">
+import { onMounted, ref } from 'vue'
+import { api, type Project, type Tag, type Task } from '../api'
+import { STATUS_LABELS, statusLabel, statusVariant } from '../taskui'
+
+// Классический вид (ТЗ 3.6): список с фильтрами — проект, тег, статус.
+
+const tasks = ref<Task[]>([])
+const projects = ref<Project[]>([])
+const tags = ref<Tag[]>([])
+const error = ref('')
+const loading = ref(false)
+
+const filters = ref({
+  status: '',
+  project_id: '',
+  tag_id: '',
+})
+
+async function load() {
+  loading.value = true
+  error.value = ''
+  try {
+    tasks.value = await api.listTasks({
+      detail_state: 'approved',
+      status: filters.value.status,
+      project_id: filters.value.project_id,
+      tag_id: filters.value.tag_id,
+    })
+  } catch (e) {
+    error.value = String(e)
+  } finally {
+    loading.value = false
+  }
+}
+
+onMounted(async () => {
+  await load()
+  projects.value = await api.listProjects()
+  tags.value = await api.listTags()
+})
+
+async function setStatus(task: Task, status: string) {
+  error.value = ''
+  try {
+    await api.updateTask(task.id, { status })
+    await load()
+  } catch (e) {
+    error.value = String(e)
+  }
+}
+
+async function remove(task: Task) {
+  error.value = ''
+  try {
+    await api.deleteTask(task.id)
+    await load()
+  } catch (e) {
+    error.value = String(e)
+  }
+}
+
+const statusOptions = [
+  { value: '', label: '— любой статус —' },
+  ...Object.entries(STATUS_LABELS).map(([value, label]) => ({ value, label })),
+]
+</script>
+
+<template>
+  <section>
+    <GnPageHeader kicker="gntodo" title="Список задач">
+      <template #meta>Найдено: {{ tasks.length }}</template>
+    </GnPageHeader>
+
+    <form class="filters" @submit.prevent>
+      <GnSelect v-model="filters.status" label="Статус" icon="ph-funnel" :options="statusOptions" />
+      <GnSelect
+        v-model="filters.project_id"
+        label="Проект"
+        icon="ph-folder"
+        :options="[
+          { value: '', label: '— любой —' },
+          ...projects.map((p) => ({ value: String(p.id), label: p.name })),
+        ]"
+      />
+      <GnSelect
+        v-model="filters.tag_id"
+        label="Тег"
+        icon="ph-tag"
+        :options="[
+          { value: '', label: '— любой —' },
+          ...tags.map((t) => ({ value: String(t.id), label: t.name })),
+        ]"
+      />
+      <GnButton variant="secondary" icon="ph-funnel" @click="load">Применить</GnButton>
+    </form>
+
+    <GnAlert v-if="error" variant="error">{{ error }}</GnAlert>
+
+    <GnEmptyState
+      v-if="!loading && tasks.length === 0"
+      icon="ph-list-magnifying-glass"
+      title="Ничего не найдено"
+      text="Попробуйте ослабить фильтры или закиньте новую задачу в стек."
+    />
+
+    <div class="task-list">
+      <GnCard v-for="task in tasks" :key="task.id" class="task-card">
+        <template #title>{{ task.title }}</template>
+        <div class="task-row">
+          <GnBadge :variant="statusVariant(task.status)">{{ statusLabel(task.status) }}</GnBadge>
+          <GnBadge v-if="task.project" variant="neutral" icon="ph-folder">
+            {{ task.project.name }}
+          </GnBadge>
+          <GnBadge v-if="task.priority !== null" variant="warning">P{{ task.priority }}</GnBadge>
+          <GnBadge v-for="tag in task.tags" :key="tag.id" variant="neutral">{{ tag.name }}</GnBadge>
+          <span class="spacer" />
+          <GnSelect
+            class="status-select"
+            :model-value="task.status"
+            :options="statusOptions"
+            @update:model-value="(s: string) => setStatus(task, s)"
+          />
+          <GnIconButton icon="ph-trash" label="Удалить задачу" @click="remove(task)" />
+        </div>
+      </GnCard>
+    </div>
+  </section>
+</template>
+
+<style scoped>
+.filters {
+  display: flex;
+  gap: 0.75rem;
+  align-items: end;
+  margin-bottom: 1.5rem;
+  flex-wrap: wrap;
+}
+.task-list {
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+}
+.task-row {
+  display: flex;
+  gap: 0.4rem;
+  align-items: center;
+  flex-wrap: wrap;
+}
+.spacer {
+  flex: 1;
+}
+.status-select {
+  min-width: 9rem;
+}
+</style>
\ No newline at end of file
diff --git a/frontend/src/views/ProjectsView.vue b/frontend/src/views/ProjectsView.vue
new file mode 100644
index 0000000..9c02523
--- /dev/null
+++ b/frontend/src/views/ProjectsView.vue
@@ -0,0 +1,182 @@
+<script setup lang="ts">
+import { computed, onMounted, ref } from 'vue'
+import { api, type Project } from '../api'
+import { RELEVANCE_LABELS, relevanceLabel, renderMarkdown } from '../taskui'
+
+// Проекты (ТЗ 3.7): актуальность, приоритет, Markdown-заметка с ресурсами.
+
+const projects = ref<Project[]>([])
+const error = ref('')
+const loading = ref(false)
+const showPreview = ref(false)
+
+const editing = ref<Project | null>(null)
+const editForm = ref({
+  name: '',
+  relevance_status: 'active',
+  priority: null as number | null,
+  note: '',
+})
+
+async function load() {
+  loading.value = true
+  error.value = ''
+  try {
+    projects.value = await api.listProjects()
+  } catch (e) {
+    error.value = String(e)
+  } finally {
+    loading.value = false
+  }
+}
+
+onMounted(load)
+
+const notePreview = computed(() => renderMarkdown(editForm.value.note))
+
+function startEdit(project: Project) {
+  editing.value = project
+  showPreview.value = false
+  editForm.value = {
+    name: project.name,
+    relevance_status: project.relevance_status,
+    priority: project.priority,
+    note: project.note,
+  }
+}
+
+async function saveEdit() {
+  if (!editing.value) return
+  error.value = ''
+  try {
+    await api.updateProject(editing.value.id, {
+      name: editForm.value.name,
+      relevance_status: editForm.value.relevance_status,
+      priority: editForm.value.priority,
+      note: editForm.value.note,
+    })
+    editing.value = null
+    await load()
+  } catch (e) {
+    error.value = String(e)
+  }
+}
+
+async function createProject() {
+  const name = window.prompt('Название нового проекта:')
+  if (!name) return
+  error.value = ''
+  try {
+    await api.createProject(name.trim())
+    await load()
+  } catch (e) {
+    error.value = String(e)
+  }
+}
+
+async function remove(project: Project) {
+  error.value = ''
+  try {
+    await api.deleteProject(project.id)
+    await load()
+  } catch (e) {
+    error.value = String(e)
+  }
+}
+
+const relevanceOptions = Object.entries(RELEVANCE_LABELS).map(([value, label]) => ({ value, label }))
+</script>
+
+<template>
+  <section>
+    <GnPageHeader kicker="gntodo" title="Проекты">
+      <template #meta>Проектов: {{ projects.length }}</template>
+      <template #actions>
+        <GnButton variant="primary" icon="ph-plus" @click="createProject">Новый проект</GnButton>
+      </template>
+    </GnPageHeader>
+
+    <GnAlert v-if="error" variant="error">{{ error }}</GnAlert>
+
+    <GnEmptyState
+      v-if="!loading && projects.length === 0"
+      icon="ph-folders"
+      title="Проектов нет"
+      text="Создайте проект — задачи можно будет группировать и добавлять заметки с ресурсами."
+    />
+
+    <div class="project-list">
+      <GnCard v-for="project in projects" :key="project.id" class="project-card">
+        <template #title>
+          <template v-if="editing?.id !== project.id">{{ project.name }}</template>
+        </template>
+
+        <form v-if="editing?.id === project.id" class="edit-form" @submit.prevent="saveEdit">
+          <GnInput v-model="editForm.name" label="Название" required />
+          <GnSelect
+            v-model="editForm.relevance_status"
+            label="Актуальность"
+            icon="ph-activity"
+            :options="relevanceOptions"
+          />
+          <GnInput v-model.number="editForm.priority" label="Приоритет (0–10)" type="number" />
+          <GnTextarea v-model="editForm.note" label="Заметка (Markdown: ссылки, контекст)" :rows="6" />
+          <GnCheckbox v-model="showPreview" label="Предпросмотр" />
+          <div v-if="showPreview" class="md-preview" v-html="notePreview" />
+          <div class="form-actions">
+            <GnButton type="submit" variant="accent" icon="ph-check">Сохранить</GnButton>
+            <GnButton type="button" variant="secondary" @click="editing = null">Отмена</GnButton>
+          </div>
+        </form>
+
+        <template v-else>
+          <div class="project-meta">
+            <GnBadge variant="info">{{ relevanceLabel(project.relevance_status) }}</GnBadge>
+            <GnBadge v-if="project.priority !== null" variant="warning">
+              P{{ project.priority }}
+            </GnBadge>
+          </div>
+          <div v-if="project.note" class="md-preview note" v-html="renderMarkdown(project.note)" />
+          <div class="form-actions">
+            <GnButton variant="secondary" size="sm" icon="ph-pencil-simple" @click="startEdit(project)">
+              Редактировать
+            </GnButton>
+            <GnIconButton icon="ph-trash" label="Удалить проект" @click="remove(project)" />
+          </div>
+        </template>
+      </GnCard>
+    </div>
+  </section>
+</template>
+
+<style scoped>
+.project-list {
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+}
+.project-meta {
+  display: flex;
+  gap: 0.5rem;
+  margin-bottom: 0.75rem;
+}
+.edit-form {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+.form-actions {
+  display: flex;
+  gap: 0.75rem;
+  align-items: center;
+}
+.md-preview {
+  border: 1px solid var(--border, #333);
+  border-radius: 6px;
+  padding: 0.75rem;
+  overflow-x: auto;
+}
+.note {
+  margin-bottom: 0.75rem;
+}
+</style>
\ No newline at end of file
diff --git a/frontend/src/views/StackView.vue b/frontend/src/views/StackView.vue
index ab6db55..6b6d153 100644
--- a/frontend/src/views/StackView.vue
+++ b/frontend/src/views/StackView.vue
@@ -230,7 +230,9 @@
 
 <template>
   <section>
-    <GnPageHeader kicker="gntodo" title="Стек входящих" :meta="`Задач в стеке: ${stack.length}`" />
+    <GnPageHeader kicker="gntodo" title="Стек входящих">
+      <template #meta>Задач в стеке: {{ stack.length }}</template>
+    </GnPageHeader>
 
     <!-- Быстрый ввод: одна строка, без метаданных -->
     <form class="quick-add" @submit.prevent="quickAdd">
diff --git a/frontend/src/views/TreeView.vue b/frontend/src/views/TreeView.vue
index 329a33e..73f9c68 100644
--- a/frontend/src/views/TreeView.vue
+++ b/frontend/src/views/TreeView.vue
@@ -1,12 +1,192 @@
 <script setup lang="ts">
-// M3: дерево задач — основной вид.
+import { computed, onMounted, ref } from 'vue'
+import { api, type Project, type Task } from '../api'
+import { statusLabel, statusVariant } from '../taskui'
+
+defineOptions({ name: 'TreeView' })
+
+// Дерево задач (основной вид, ТЗ 3.6): подзадачи — ветви произвольной вложенности.
+// Сырые задачи живут в стеке; дерево показывает утверждённые.
+
+interface FlatNode {
+  task: Task
+  depth: number
+  hasChildren: boolean
+}
+
+const tasks = ref<Task[]>([])
+const projects = ref<Project[]>([])
+const error = ref('')
+const loading = ref(false)
+const expanded = ref<Record<number, boolean>>({})
+
+async function load() {
+  loading.value = true
+  error.value = ''
+  try {
+    tasks.value = await api.listTasks({ detail_state: 'approved' })
+  } catch (e) {
+    error.value = String(e)
+  } finally {
+    loading.value = false
+  }
+}
+
+onMounted(async () => {
+  await load()
+  projects.value = await api.listProjects()
+})
+
+// Плоское представление дерева с отступами (проще, чем рекурсивный компонент)
+const rows = computed<FlatNode[]>(() => {
+  const byId = new Map<number, Task[]>([])
+  tasks.value.forEach((t) => {
+    const key = t.parent_task_id ?? 0
+    const list = byId.get(key) ?? []
+    list.push(t)
+    byId.set(key, list)
+  })
+  const out: FlatNode[] = []
+  const visit = (parentId: number, depth: number) => {
+    const children = byId.get(parentId) ?? []
+    children.forEach((t) => {
+      const kids = byId.get(t.id) ?? []
+      out.push({ task: t, depth, hasChildren: kids.length > 0 })
+      if (kids.length > 0 && (expanded.value[t.id] ?? true)) visit(t.id, depth + 1)
+    })
+  }
+  visit(0, 0)
+  return out
+})
+
+function toggle(task: Task) {
+  expanded.value[task.id] = !(expanded.value[task.id] ?? true)
+}
+
+async function setStatus(task: Task, status: string) {
+  error.value = ''
+  try {
+    await api.updateTask(task.id, { status })
+    await load()
+  } catch (e) {
+    error.value = String(e)
+  }
+}
+
+async function addSubtask(task: Task) {
+  const title = window.prompt('Подзадача:')
+  if (!title) return
+  error.value = ''
+  try {
+    await api.createTask(title.trim(), '', task.id)
+    // подзадача попадёт в стек; в дереве появится после утверждения
+    expanded.value[task.id] = true
+    await load()
+  } catch (e) {
+    error.value = String(e)
+  }
+}
+
+async function remove(task: Task) {
+  error.value = ''
+  try {
+    await api.deleteTask(task.id)
+    await load()
+  } catch (e) {
+    error.value = String(e)
+  }
+}
 </script>
 
 <template>
-  <GnPageHeader kicker="gntodo" title="Дерево задач" meta="Основной вид: подзадачи — ветви" />
-  <GnEmptyState
-    icon="ph-tree-structure"
-    title="Дерево появится в M3"
-    text="Здесь будут задачи в виде ветвящегося дерева: проекты → задачи → подзадачи."
-  />
-</template>
\ No newline at end of file
+  <section>
+    <GnPageHeader kicker="gntodo" title="Дерево задач">
+      <template #meta>Задач: {{ tasks.length }}</template>
+    </GnPageHeader>
+
+    <GnAlert v-if="error" variant="error">{{ error }}</GnAlert>
+
+    <GnEmptyState
+      v-if="!loading && rows.length === 0"
+      icon="ph-tree-structure"
+      title="Задач пока нет"
+      text="Утвердите задачи в стеке — здесь вырастет дерево."
+    />
+
+    <div class="tree">
+      <div v-for="row in rows" :key="row.task.id" class="node" :style="{ marginLeft: row.depth * 24 + 'px' }">
+        <div class="node-row">
+          <GnIconButton
+            v-if="row.hasChildren"
+            :icon="expanded[row.task.id] ?? true ? 'ph-caret-down' : 'ph-caret-right'"
+            :label="expanded[row.task.id] ?? true ? 'Свернуть' : 'Развернуть'"
+            @click="toggle(row.task)"
+          />
+          <span v-else class="leaf-space" />
+          <span class="title" :class="{ done: row.task.status === 'done' }">{{ row.task.title }}</span>
+          <GnBadge :variant="statusVariant(row.task.status)">{{ statusLabel(row.task.status) }}</GnBadge>
+          <GnBadge v-if="row.task.project" variant="neutral" icon="ph-folder">
+            {{ row.task.project.name }}
+          </GnBadge>
+          <GnBadge v-if="row.task.priority !== null" variant="warning">
+            P{{ row.task.priority }}
+          </GnBadge>
+          <GnBadge v-for="tag in row.task.tags" :key="tag.id" variant="neutral">{{ tag.name }}</GnBadge>
+
+          <span class="spacer" />
+          <GnSelect
+            class="status-select"
+            :model-value="row.task.status"
+            :options="[
+              { value: 'to_do', label: 'К выполнению' },
+              { value: 'in_progress', label: 'В работе' },
+              { value: 'done', label: 'Завершено' },
+              { value: 'cancelled', label: 'Отменено' },
+              { value: 'deferred', label: 'Отложено' },
+            ]"
+            @update:model-value="(s: string) => setStatus(row.task, s)"
+          />
+          <GnIconButton icon="ph-plus" label="Добавить подзадачу" @click="addSubtask(row.task)" />
+          <GnIconButton icon="ph-trash" label="Удалить задачу" @click="remove(row.task)" />
+        </div>
+      </div>
+    </div>
+  </section>
+</template>
+
+<style scoped>
+.tree {
+  display: flex;
+  flex-direction: column;
+  gap: 0.4rem;
+}
+.node-row {
+  display: flex;
+  gap: 0.4rem;
+  align-items: center;
+  border: 1px solid var(--border, #333);
+  border-radius: 8px;
+  padding: 0.4rem 0.6rem;
+  background: var(--surface, transparent);
+}
+.leaf-space {
+  width: 2rem;
+  flex: none;
+}
+.node-row .title {
+  font-weight: 500;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.node-row .title.done {
+  text-decoration: line-through;
+  color: var(--text-muted, #888);
+}
+.spacer {
+  flex: 1;
+}
+.status-select {
+  min-width: 9rem;
+}
+</style>
\ No newline at end of file