diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 94918f1..d2b6de1 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -13,18 +13,28 @@
 // подсветку активного пункта навигации.
 import { computed, onUnmounted, ref, watch } from "vue";
 import { useRoute, useRouter } from "vue-router";
-import { GnIdentity, GnIconButton, GnNavigationShell } from "gnexus-ui-kit/vue";
+import { GnIdentity, GnIconButton, GnNavigationShell, GnToastProvider } from "gnexus-ui-kit/vue";
 import { adminMe, clearToken, logout } from "./api.js";
 
 const route = useRoute();
 const router = useRouter();
 
-// Пока в Synapse одна секция — «Обзор»; новые секции добавляются сюда и в router.js.
+// Секции админки; иконки — только Phosphor (правила кита).
 const items = [
   { to: "/dashboard", label: "Обзор", icon: "ph-pulse" },
+  { to: "/sources", label: "Источники", icon: "ph-broadcast" },
+  { to: "/types", label: "Типы", icon: "ph-shapes" },
+  { to: "/targets", label: "Цели", icon: "ph-target" },
+  { to: "/rules", label: "Правила", icon: "ph-funnel" },
+  { to: "/deliveries", label: "Доставки", icon: "ph-paper-plane-tilt" },
 ];
 const currents = {
   "/dashboard": "Обзор",
+  "/sources": "Источники",
+  "/types": "Типы",
+  "/targets": "Цели",
+  "/rules": "Правила",
+  "/deliveries": "Доставки",
 };
 const current = computed(() => currents[route.path] || "");
 const bare = computed(() => Boolean(route.meta.bare));
@@ -150,7 +160,10 @@
       <GnIconButton icon="ph-sign-out" label="Выйти" @click="signOut" />
     </template>
     <template #content>
-      <RouterView />
+      <!-- Тост-провайдер у корня каркаса: useToast() в разделах админки. -->
+      <GnToastProvider>
+        <RouterView />
+      </GnToastProvider>
     </template>
   </GnNavigationShell>
   <RouterView v-else />
diff --git a/frontend/src/api.js b/frontend/src/api.js
index 19d90dc..f9b67d7 100644
--- a/frontend/src/api.js
+++ b/frontend/src/api.js
@@ -109,6 +109,40 @@
   return apiFetch("/api/v1/admin/me");
 }
 
+// --- Admin API (app/api/admin_routes.py). Все эндпоинты под require_admin. ---
+
+export const api = {
+  // Источники и ключи
+  listSources: () => apiFetch("/api/v1/admin/sources"),
+  createSource: (data) => apiFetch("/api/v1/admin/sources", { method: "POST", body: JSON.stringify(data) }),
+  deleteSource: (id) => apiFetch(`/api/v1/admin/sources/${id}`, { method: "DELETE" }),
+  listKeys: (sourceId) => apiFetch(`/api/v1/admin/sources/${sourceId}/keys`),
+  createKey: (sourceId, data) =>
+    apiFetch(`/api/v1/admin/sources/${sourceId}/keys`, { method: "POST", body: JSON.stringify(data) }),
+  revokeKey: (sourceId, keyId) =>
+    apiFetch(`/api/v1/admin/sources/${sourceId}/keys/${keyId}/revoke`, { method: "POST" }),
+
+  // Типы
+  listTypes: () => apiFetch("/api/v1/admin/types"),
+  createType: (data) => apiFetch("/api/v1/admin/types", { method: "POST", body: JSON.stringify(data) }),
+  deleteType: (id) => apiFetch(`/api/v1/admin/types/${id}`, { method: "DELETE" }),
+
+  // Цели каналов
+  listTargets: () => apiFetch("/api/v1/admin/targets"),
+  createTarget: (data) => apiFetch("/api/v1/admin/targets", { method: "POST", body: JSON.stringify(data) }),
+  deleteTarget: (id) => apiFetch(`/api/v1/admin/targets/${id}`, { method: "DELETE" }),
+
+  // Правила
+  listRules: () => apiFetch("/api/v1/admin/rules"),
+  createRule: (data) => apiFetch("/api/v1/admin/rules", { method: "POST", body: JSON.stringify(data) }),
+  patchRule: (id, data) => apiFetch(`/api/v1/admin/rules/${id}`, { method: "PATCH", body: JSON.stringify(data) }),
+  deleteRule: (id) => apiFetch(`/api/v1/admin/rules/${id}`, { method: "DELETE" }),
+
+  // Поток (только чтение)
+  listEvents: (query = {}) => apiFetch(`/api/v1/admin/events?${new URLSearchParams(query)}`),
+  listDeliveries: (query = {}) => apiFetch(`/api/v1/admin/deliveries?${new URLSearchParams(query)}`),
+};
+
 /** Логаут: revoke всех входов пользователя (наш + на gnexus-auth). */
 export async function logout() {
   try {
diff --git a/frontend/src/router.js b/frontend/src/router.js
index b2d2732..ee5ccba 100644
--- a/frontend/src/router.js
+++ b/frontend/src/router.js
@@ -4,6 +4,11 @@
 import DashboardView from "./views/DashboardView.vue";
 import DeniedView from "./views/DeniedView.vue";
 import OauthCallbackView from "./views/OauthCallbackView.vue";
+import SourcesView from "./views/SourcesView.vue";
+import TypesView from "./views/TypesView.vue";
+import TargetsView from "./views/TargetsView.vue";
+import RulesView from "./views/RulesView.vue";
+import DeliveriesView from "./views/DeliveriesView.vue";
 
 // Гейт ролей: /dashboard и далее — только system_role admin и выше.
 // Проверка роли происходит на сервере (require_admin), фронт лишь заранее
@@ -21,6 +26,11 @@
       component: DashboardView,
       meta: { requiresAuth: true },
     },
+    { path: "/sources", component: SourcesView, meta: { requiresAuth: true } },
+    { path: "/types", component: TypesView, meta: { requiresAuth: true } },
+    { path: "/targets", component: TargetsView, meta: { requiresAuth: true } },
+    { path: "/rules", component: RulesView, meta: { requiresAuth: true } },
+    { path: "/deliveries", component: DeliveriesView, meta: { requiresAuth: true } },
   ],
 });
 
diff --git a/frontend/src/ui.js b/frontend/src/ui.js
new file mode 100644
index 0000000..21cee9c
--- /dev/null
+++ b/frontend/src/ui.js
@@ -0,0 +1,45 @@
+/** Общие мелочи для админ-разделов: бейджи статусов, формат времени, сокращение. */
+
+/** Разрешённые варианты кита: primary, secondary, accent, success, warning, danger, error, info. */
+export const statusVariant = {
+  // delivery
+  delivered: "success",
+  pending: "info",
+  failed: "danger",
+  skipped: "warning",
+  // event
+  queued: "info",
+  processing: "info",
+  done: "success",
+};
+
+export function badgeFor(status) {
+  return { label: status, variant: statusVariant[status] || "secondary" };
+}
+
+export function fmtTime(iso) {
+  if (!iso) return "—";
+  return new Date(iso).toLocaleString("ru-RU", {
+    day: "2-digit", month: "2-digit", hour: "2-digit", minute: "2-digit", second: "2-digit",
+  });
+}
+
+export function truncate(text, n = 80) {
+  if (!text) return "";
+  return text.length > n ? `${text.slice(0, n - 1)}…` : text;
+}
+
+/** JSON в одну строку для ячейки таблицы. */
+export function shortJson(value, n = 60) {
+  if (!value || (typeof value === "object" && !Object.keys(value).length)) return "—";
+  const text = JSON.stringify(value);
+  return truncate(text, n);
+}
+
+/** Разбор строки с запятыми/пробелами в массив непустых токенов. */
+export function parseList(text) {
+  return (text || "")
+    .split(/[,\n]+/)
+    .map((s) => s.trim())
+    .filter(Boolean);
+}
\ No newline at end of file
diff --git a/frontend/src/views/DeliveriesView.vue b/frontend/src/views/DeliveriesView.vue
new file mode 100644
index 0000000..e46df4f
--- /dev/null
+++ b/frontend/src/views/DeliveriesView.vue
@@ -0,0 +1,121 @@
+<script setup>
+// Лог доставок: последние N с фильтрами по каналу и статусу.
+import { onMounted, ref } from "vue";
+import {
+  GnBadge,
+  GnButton,
+  GnIconButton,
+  GnLoader,
+  GnPageHeader,
+  GnSelect,
+  GnStatusCard,
+  GnTable,
+} from "gnexus-ui-kit/vue";
+import { useToast } from "gnexus-ui-kit/vue";
+import { api } from "../api.js";
+import { badgeFor, fmtTime, truncate } from "../ui.js";
+
+const toast = useToast();
+
+const rows = ref([]);
+const loading = ref(true);
+const error = ref("");
+
+const CHANNELS = [
+  { value: "", label: "все" },
+  { value: "telegram", label: "telegram" },
+  { value: "email", label: "email" },
+  { value: "s2s", label: "s2s" },
+  { value: "internal_log", label: "internal_log" },
+];
+const STATUSES = [
+  { value: "", label: "все" },
+  { value: "pending", label: "pending" },
+  { value: "delivered", label: "delivered" },
+  { value: "failed", label: "failed" },
+  { value: "skipped", label: "skipped" },
+];
+
+const channel = ref("");
+const status = ref("");
+
+async function load() {
+  loading.value = true;
+  error.value = "";
+  try {
+    const query = { limit: 100 };
+    if (channel.value) query.channel = channel.value;
+    if (status.value) query.status = status.value;
+    rows.value = await api.listDeliveries(query);
+  } catch (ex) {
+    error.value = ex.message;
+    toast.error(ex.message);
+  } finally {
+    loading.value = false;
+  }
+}
+
+onMounted(load);
+</script>
+
+<template>
+  <main class="container page">
+    <GnPageHeader
+      kicker="Synapse"
+      title="Доставки"
+      subtitle="Лог попыток: канал, цель, статус, ретраи и текст, реально ушедший в канал"
+    >
+      <template #actions>
+        <GnSelect v-model="status" label="" :options="STATUSES" @update:model-value="load" />
+        <GnSelect v-model="channel" label="" :options="CHANNELS" @update:model-value="load" />
+        <GnIconButton icon="ph-arrow-counter-clockwise" label="Обновить" @click="load" />
+      </template>
+    </GnPageHeader>
+
+    <GnLoader v-if="loading" />
+    <GnStatusCard v-else-if="error" variant="error" icon="ph-warning-circle" :text="error" />
+    <template v-else>
+      <GnTable
+        :rows="rows"
+        empty-text="Доставок ещё не было"
+        :columns="[
+          { key: 'created_at', label: 'Время' },
+          { key: 'event', label: 'Событие' },
+          { key: 'channel', label: 'Канал' },
+          { key: 'target_name', label: 'Цель' },
+          { key: 'status', label: 'Статус' },
+          { key: 'attempts', label: 'Попытки' },
+          { key: 'last_error', label: 'Ошибка' },
+          { key: 'rendered_message', label: 'Сообщение' },
+        ]"
+      >
+        <template #cell-created_at="{ value }">{{ fmtTime(value) }}</template>
+        <template #cell-event="{ row }">
+          <code class="event-id">{{ truncate(row.event_id, 13) }}</code>
+        </template>
+        <template #cell-status="{ value }">
+          <GnBadge :variant="badgeFor(value).variant" outline>{{ value }}</GnBadge>
+        </template>
+        <template #cell-attempts="{ value }">{{ value ?? 0 }}</template>
+        <template #cell-last_error="{ value }">{{ truncate(value, 60) || "—" }}</template>
+        <template #cell-rendered_message="{ value }">
+          <span :title="value || ''">{{ truncate(value, 60) || "—" }}</span>
+        </template>
+      </GnTable>
+    </template>
+  </main>
+</template>
+
+<style scoped>
+.page {
+  max-width: 1440px;
+  margin-inline: auto;
+  padding-block: var(--gn-space-6);
+  display: flex;
+  flex-direction: column;
+  gap: var(--gn-space-4);
+}
+.event-id {
+  font-size: 0.78em;
+}
+</style>
\ No newline at end of file
diff --git a/frontend/src/views/RulesView.vue b/frontend/src/views/RulesView.vue
new file mode 100644
index 0000000..8fe364b
--- /dev/null
+++ b/frontend/src/views/RulesView.vue
@@ -0,0 +1,333 @@
+<script setup>
+// Правила маршрутизации: условия → действия (каналы/цели/шаблоны), шумодав.
+// Switch в таблице мгновенно включает/выключает правило (PATCH).
+import { onMounted, ref } from "vue";
+import {
+  GnBadge,
+  GnButton,
+  GnChip,
+  GnConfirmDialog,
+  GnIconButton,
+  GnInput,
+  GnLoader,
+  GnModal,
+  GnPageHeader,
+  GnSelect,
+  GnStatusCard,
+  GnSwitch,
+  GnTable,
+  GnTextarea,
+} from "gnexus-ui-kit/vue";
+import { useToast } from "gnexus-ui-kit/vue";
+import { api } from "../api.js";
+import { parseList, shortJson, truncate } from "../ui.js";
+
+const toast = useToast();
+
+const rows = ref([]);
+const sources = ref([]);
+const targets = ref([]);
+const loading = ref(true);
+const error = ref("");
+
+const PRIORITIES = [
+  { value: "", label: "— любая —" },
+  { value: "low", label: "low" },
+  { value: "normal", label: "normal" },
+  { value: "high", label: "high" },
+  { value: "critical", label: "critical" },
+];
+const SOURCE_CHANNEL_OPTIONS = ["telegram", "email", "s2s", "internal_log"].map((c) => ({
+  value: c,
+  label: c,
+}));
+
+async function load() {
+  loading.value = true;
+  error.value = "";
+  try {
+    const [rules, src, tg] = await Promise.all([api.listRules(), api.listSources(), api.listTargets()]);
+    rows.value = rules;
+    sources.value = src;
+    targets.value = tg;
+  } catch (ex) {
+    error.value = ex.message;
+  } finally {
+    loading.value = false;
+  }
+}
+
+const showCreate = ref(false);
+const busy = ref(false);
+const emptyRule = () => ({
+  name: "",
+  weight: 0,
+  throttle_seconds: "",
+  source: "",
+  subjects: "",
+  actions: "",
+  priority: "",
+  payload: "",
+  template: "",
+  actionRows: [{ channel: "internal_log", target_id: "", template: "" }],
+});
+const form = ref(emptyRule());
+const formError = ref("");
+
+const sourceOptions = [{ value: "", label: "— любой источник —" }];
+
+const actionsSummary = (rule) =>
+  rule.actions.map((a) => `${a.channel}${a.target_name ? ":" + a.target_name : ""}`).join(", ");
+
+function addActionRow() {
+  form.value.actionRows.push({ channel: "internal_log", target_id: "", template: "" });
+}
+function removeActionRow(i) {
+  form.value.actionRows.splice(i, 1);
+}
+
+async function createRule() {
+  formError.value = "";
+  let payload_condition = {};
+  try {
+    payload_condition = form.value.payload.trim() ? JSON.parse(form.value.payload) : null;
+  } catch {
+    formError.value = "Требования payload — не корректный JSON";
+    return;
+  }
+  const actions = form.value.actionRows
+    .filter((a) => a.channel)
+    .map((a) => ({
+      channel: a.channel,
+      ...(a.target_id ? { target_id: Number(a.target_id) } : {}),
+      ...(a.template ? { template: a.template } : {}),
+    }));
+  if (!actions.length) {
+    formError.value = "Добавьте хотя бы одно действие";
+    return;
+  }
+  busy.value = true;
+  try {
+    await api.createRule({
+      name: form.value.name.trim(),
+      weight: Number(form.value.weight) || 0,
+      ...(form.value.throttle_seconds ? { throttle_seconds: Number(form.value.throttle_seconds) } : {}),
+      conditions: {
+        ...(form.value.source ? { source: form.value.source } : {}),
+        ...(parseList(form.value.subjects).length ? { subjects: parseList(form.value.subjects) } : {}),
+        ...(parseList(form.value.actions).length ? { actions: parseList(form.value.actions) } : {}),
+        ...(form.value.priority ? { priority_min: form.value.priority } : {}),
+        ...(payload_condition ? { payload: payload_condition } : {}),
+      },
+      ...(form.value.template ? { template: form.value.template } : {}),
+      actions,
+    });
+    showCreate.value = false;
+    form.value = emptyRule();
+    toast.success("Правило создано");
+    await load();
+  } catch (ex) {
+    toast.error(ex.message);
+  } finally {
+    busy.value = false;
+  }
+}
+
+async function toggleRule(rule, enabled) {
+  try {
+    await api.patchRule(rule.id, { enabled });
+    toast.info(`Правило ${enabled ? "включено" : "выключено"}`);
+  } catch (ex) {
+    toast.error(ex.message);
+    await load();
+  }
+}
+
+const confirmDelete = ref(null);
+async function doDelete() {
+  try {
+    await api.deleteRule(confirmDelete.value.id);
+    toast.success("Правило удалено");
+    await load();
+  } catch (ex) {
+    toast.error(ex.message);
+  } finally {
+    confirmDelete.value = null;
+  }
+}
+
+onMounted(load);
+</script>
+
+<template>
+  <main class="container page">
+    <GnPageHeader
+      kicker="Synapse"
+      title="Правила"
+      subtitle="Условия → действия. Все подошедшие правила применяются; шумодав режет повторные доставки, critical проходит всегда"
+    >
+      <template #actions>
+        <GnButton variant="primary" icon="ph-plus" @click="showCreate = true">Правило</GnButton>
+      </template>
+    </GnPageHeader>
+
+    <GnLoader v-if="loading" />
+    <GnStatusCard v-else-if="error" variant="error" icon="ph-warning-circle" :text="error" />
+    <template v-else>
+      <GnTable
+        :rows="rows"
+        empty-text="Правил нет — событие, не попавшее ни в одно правило, только логируется историей"
+        :columns="[
+          { key: 'name', label: 'Правило' },
+          { key: 'weight', label: 'W' },
+          { key: 'conditions', label: 'Условия' },
+          { key: 'throttle_seconds', label: 'Шумодав' },
+          { key: 'actionsList', label: 'Действия' },
+          { key: 'enabled', label: 'Вкл./выкл.' },
+          { key: 'actions', label: '' },
+        ]"
+      >
+        <template #cell-conditions="{ row }">
+          <code class="cond">{{ shortJson(row.conditions, 100) }}</code>
+        </template>
+        <template #cell-throttle_seconds="{ row }">
+          <GnBadge v-if="row.throttle_seconds" :variant="'warning'" outline>{{ row.throttle_seconds }} с</GnBadge>
+          <span v-else>—</span>
+        </template>
+        <template #cell-actionsList="{ row }">
+          <div class="chips">
+            <GnChip v-for="(a, i) in row.actions" :key="i" variant="accent">
+              {{ a.channel }}{{ a.target_name ? ":" + a.target_name : "" }}
+            </GnChip>
+          </div>
+        </template>
+        <template #cell-enabled="{ row }">
+          <GnSwitch :model-value="row.enabled" @update:model-value="(v) => toggleRule(row, v)" />
+        </template>
+        <template #cell-actions="{ row }">
+          <GnButton variant="danger" size="sm" icon="ph-trash" @click="confirmDelete = row" />
+        </template>
+      </GnTable>
+    </template>
+
+    <GnModal v-model:open="showCreate" title="Новое правило" class="rules-modal">
+      <div class="form">
+        <GnInput v-model="form.name" label="Название" icon="ph-funnel" />
+        <div class="row">
+          <GnInput v-model="form.weight" label="Weight" icon="ph-sort-desc" help="Меньше = раньше (важно в режиме first)" />
+          <GnInput v-model="form.throttle_seconds" label="Шумодав, сек" icon="ph-timer" help="Не чаще одной доставки в цель; пусто = без ограничения" />
+        </div>
+
+        <div class="conditions-title">Условия</div>
+        <div class="row">
+          <GnSelect
+            v-model="form.source"
+            label="Источник"
+            :options="sourceOptions.concat(sources.map((s) => ({ value: s.name, label: s.name })))"
+          />
+          <GnSelect v-model="form.priority" label="Priority ≥" :options="PRIORITIES" />
+        </div>
+        <GnInput v-model="form.subjects" label="Subjects" icon="ph-shapes" help="Через запятую; пусто = любые" />
+        <GnInput v-model="form.actions" label="Actions" icon="ph-lightning" help="Через запятую; пусто = любые" />
+        <GnTextarea v-model="form.payload" label="Требования к payload (JSON)" help='Например {"host": ["melody","pilar"]}; пусто = без требования' />
+
+        <div class="conditions-title">Действия</div>
+        <div class="row">
+          <GnInput v-model="form.template" label="Шаблон по умолчанию (Jinja2)" icon="ph-file-text" help='Например: Контейнер {{ payload.container }} упал на {{ payload.host }}' />
+        </div>
+        <div v-for="(a, i) in form.actionRows" :key="i" class="action-row">
+          <GnSelect v-model="a.channel" label="Канал" :options="SOURCE_CHANNEL_OPTIONS" />
+          <GnSelect
+            v-model="a.target_id"
+            label="Цель"
+            :options="[
+              { value: '', label: '— без цели —' },
+              ...targets.filter((t) => t.channel === a.channel).map((t) => ({ value: t.id, label: t.name })),
+            ]"
+          />
+          <GnIconButton icon="ph-x" label="Убрать действие" @click="removeActionRow(i)" />
+        </div>
+        <GnButton variant="secondary" size="sm" icon="ph-plus" @click="addActionRow">Действие</GnButton>
+
+        <GnStatusCard
+          v-if="formError"
+          variant="error"
+          icon="ph-warning-circle"
+          title="Ошибка формы"
+          :text="formError"
+        />
+      </div>
+      <template #actions>
+        <GnButton variant="secondary" @click="showCreate = false">Отмена</GnButton>
+        <GnButton variant="primary" :loading="busy" :disabled="!form.name.trim()" @click="createRule">
+          Создать
+        </GnButton>
+      </template>
+    </GnModal>
+
+    <GnConfirmDialog
+      :open="confirmDelete !== null" @update:open="(v) => (v ? null : (confirmDelete = null))"
+      :key="confirmDelete?.id"
+      title="Удалить правило?"
+      :message="confirmDelete ? truncate(`Правило «${confirmDelete.name}» будет удалено вместе с действиями. История доставок останется.`, 200) : ''"
+      confirm-variant="danger"
+      confirm-text="Удалить"
+      cancel-text="Отмена"
+      @confirm="doDelete"
+    />
+  </main>
+</template>
+
+<style scoped>
+.page {
+  max-width: 1440px;
+  margin-inline: auto;
+  padding-block: var(--gn-space-6);
+  display: flex;
+  flex-direction: column;
+  gap: var(--gn-space-4);
+}
+.form {
+  display: flex;
+  flex-direction: column;
+  gap: var(--gn-space-4);
+  min-width: min(640px, 80vw);
+}
+.row {
+  display: flex;
+  flex-direction: row;
+  gap: var(--gn-space-4);
+}
+.row > :first-child {
+  flex: 1;
+}
+.row > :not(:first-child) {
+  flex: 1;
+}
+.conditions-title {
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.04em;
+  font-size: 0.8em;
+}
+.action-row {
+  display: flex;
+  gap: var(--gn-space-3);
+  align-items: flex-end;
+}
+.action-row > :first-child {
+  min-width: 140px;
+}
+.action-row > :nth-child(2) {
+  flex: 1;
+}
+.cond {
+  font-size: 0.78em;
+  word-break: break-all;
+}
+.chips {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--gn-space-1);
+}
+</style>
\ No newline at end of file
diff --git a/frontend/src/views/SourcesView.vue b/frontend/src/views/SourcesView.vue
new file mode 100644
index 0000000..64b6787
--- /dev/null
+++ b/frontend/src/views/SourcesView.vue
@@ -0,0 +1,278 @@
+<script setup>
+// Источники событий и их API-ключи. Токен нового ключа показывается ровно
+// один раз (модаль с GnCopyButton) — в БД лежит только sha256.
+import { onMounted, ref } from "vue";
+import {
+  GnBadge,
+  GnButton,
+  GnConfirmDialog,
+  GnCopyButton,
+  GnInput,
+  GnLoader,
+  GnModal,
+  GnPageHeader,
+  GnStatusCard,
+  GnTable,
+  GnTextarea,
+} from "gnexus-ui-kit/vue";
+import { useToast } from "gnexus-ui-kit/vue";
+import { api } from "../api.js";
+import { fmtTime } from "../ui.js";
+
+const toast = useToast();
+
+const sources = ref([]);
+const loading = ref(true);
+const error = ref("");
+
+async function load() {
+  loading.value = true;
+  error.value = "";
+  try {
+    sources.value = await api.listSources();
+  } catch (ex) {
+    error.value = ex.message;
+  } finally {
+    loading.value = false;
+  }
+}
+
+// --- создание источника ---
+const showCreate = ref(false);
+const form = ref({ name: "", label: "", description: "" });
+const busy = ref(false);
+
+async function createSource() {
+  if (!form.value.name) return;
+  busy.value = true;
+  try {
+    await api.createSource({ ...form.value, name: form.value.name.trim() });
+    showCreate.value = false;
+    form.value = { name: "", label: "", description: "" };
+    toast.success("Источник создан");
+    await load();
+  } catch (ex) {
+    toast.error(ex.message);
+  } finally {
+    busy.value = false;
+  }
+}
+
+// --- удаление источника ---
+const confirmDelete = ref(null); // источник
+async function doDelete() {
+  try {
+    await api.deleteSource(confirmDelete.value.id);
+    toast.success("Источник удалён");
+    await load();
+  } catch (ex) {
+    toast.error(ex.message);
+  } finally {
+    confirmDelete.value = null;
+  }
+}
+
+// --- ключи ---
+const keysSource = ref(null); // источник, чьи ключи в модали
+const keys = ref([]);
+const keysLoading = ref(false);
+
+async function openKeys(source) {
+  keysSource.value = source;
+  keysLoading.value = true;
+  try {
+    keys.value = await api.listKeys(source.id);
+  } catch (ex) {
+    toast.error(ex.message);
+  } finally {
+    keysLoading.value = false;
+  }
+}
+
+async function createKey() {
+  try {
+    const created = await api.createKey(keysSource.value.id, { name: keysSource.value.name });
+    tokenModal.value = { key: created, source: keysSource.value };
+    keys.value = await api.listKeys(keysSource.value.id);
+  } catch (ex) {
+    toast.error(ex.message);
+  }
+}
+
+// Токен показывается один раз
+const tokenModal = ref(null);
+
+async function revokeKey(key) {
+  try {
+    await api.revokeKey(keysSource.value.id, key.id);
+    keys.value = await api.listKeys(keysSource.value.id);
+    toast.success("Ключ отозван");
+  } catch (ex) {
+    toast.error(ex.message);
+  }
+}
+
+onMounted(load);
+</script>
+
+<template>
+  <main class="container page">
+    <GnPageHeader
+      kicker="Synapse"
+      title="Источники"
+      subtitle="Сервисы, которые шлют события в хаб. К каждому — API-ключи syn_*"
+    >
+      <template #actions>
+        <GnButton variant="primary" icon="ph-plus" @click="showCreate = true">Источник</GnButton>
+      </template>
+    </GnPageHeader>
+
+    <GnLoader v-if="loading" />
+    <GnStatusCard v-else-if="error" variant="error" icon="ph-warning-circle" :text="error" />
+    <template v-else>
+      <GnTable
+        :rows="sources"
+        empty-text="Источников ещё нет — создайте первый"
+        :columns="[
+          { key: 'name', label: 'Slug' },
+          { key: 'label', label: 'Название' },
+          { key: 'description', label: 'Описание' },
+          { key: 'keys_count', label: 'Ключи' },
+          { key: 'types_count', label: 'Типы' },
+          { key: 'created_at', label: 'Создан' },
+          { key: 'actions', label: '' },
+        ]"
+      >
+        <template #cell-keys_count="{ value }">{{ value ?? 0 }}</template>
+        <template #cell-created_at="{ value }">{{ fmtTime(value) }}</template>
+        <template #cell-actions="{ row }">
+          <span class="row-actions">
+            <GnButton variant="secondary" size="sm" icon="ph-key" @click="openKeys(row)">Ключи</GnButton>
+            <GnButton variant="danger" size="sm" icon="ph-trash" @click="confirmDelete = row" />
+          </span>
+        </template>
+      </GnTable>
+    </template>
+
+    <!-- Создание источника -->
+    <GnModal v-model:open="showCreate" title="Новый источник">
+      <div class="form">
+        <GnInput v-model="form.name" label="Slug (name)" icon="ph-hash" help="Например monitoring; только a-z 0-9 . _ -" />
+        <GnInput v-model="form.label" label="Название" icon="ph-tag" help="Человекочитаемое имя" />
+        <GnTextarea
+          v-model="form.description"
+          label="Описание"
+          help="Что это за сервис — это увидят человек и ИИ-агент в админке"
+        />
+      </div>
+      <template #actions>
+        <GnButton variant="secondary" @click="showCreate = false">Отмена</GnButton>
+        <GnButton variant="primary" :loading="busy" :disabled="!form.name.trim()" @click="createSource">
+          Создать
+        </GnButton>
+      </template>
+    </GnModal>
+
+    <!-- Ключи источника -->
+    <GnModal :open="keysSource !== null" @update:open="(v) => (v ? null : (keysSource = null))" :title="keysSource ? `Ключи — ${keysSource.name}` : 'Ключи'">
+      <GnLoader v-if="keysLoading" />
+      <template v-else>
+        <GnButton variant="primary" icon="ph-plus" @click="createKey">Выпустить ключ</GnButton>
+        <GnTable
+          class="keys-table"
+          :rows="keys"
+          empty-text="Ключей нет — выпустите"
+          :columns="[
+            { key: 'name', label: 'Ключ' },
+            { key: 'token_hint', label: 'Хвост' },
+            { key: 'created_at', label: 'Создан' },
+            { key: 'last_used_at', label: 'Использован' },
+            { key: 'revoked_at', label: 'Статус' },
+            { key: 'actions', label: '' },
+          ]"
+        >
+          <template #cell-created_at="{ value }">{{ fmtTime(value) }}</template>
+          <template #cell-last_used_at="{ value }">{{ fmtTime(value) }}</template>
+          <template #cell-revoked_at="{ value }">
+            <GnBadge :variant="value ? 'danger' : 'success'" outline>
+              {{ value ? "отозван" : "активен" }}
+            </GnBadge>
+          </template>
+          <template #cell-actions="{ row }">
+            <GnButton
+              v-if="!row.revoked_at"
+              variant="danger"
+              size="sm"
+              icon="ph-x-circle"
+              @click="revokeKey(row)"
+            >
+              Отозвать
+            </GnButton>
+          </template>
+        </GnTable>
+      </template>
+      <template #actions="{ close }">
+        <GnButton variant="secondary" @click="close">Закрыть</GnButton>
+      </template>
+    </GnModal>
+
+    <!-- Токен показывается один раз -->
+    <GnModal v-if="tokenModal" :open="tokenModal !== null" @update:open="(v) => (v ? null : (tokenModal = null))" title="Токен — показывается один раз" :close-on-backdrop="false">
+      <GnAlert variant="warning">
+        <i class="ph ph-warning"></i>
+        Токен больше не будет показан: в Synapse хранится только sha256-хэш.
+        Скопируйте сейчас и отдайте владельцу источника.
+      </GnAlert>
+      <p class="token-wrap"><code>{{ tokenModal.key.token }}</code></p>
+      <template #actions>
+        <GnCopyButton class="token-copy" :text="tokenModal.key.token" label="Скопировать" icon="ph-copy" />
+        <GnButton variant="primary" @click="tokenModal = null">Готово</GnButton>
+      </template>
+    </GnModal>
+
+    <!-- Удаление источника -->
+    <GnConfirmDialog
+      :open="confirmDelete !== null" @update:open="(v) => (v ? null : (confirmDelete = null))"
+      :key="confirmDelete?.id"
+      title="Удалить источник?"
+      :message="confirmDelete ? `Источник «${confirmDelete.name}» будет удалён вместе с типами и ключами. Если у источника есть события, удаление будет отклонено.` : ''"
+      confirm-variant="danger"
+      confirm-text="Удалить"
+      cancel-text="Отмена"
+      @confirm="doDelete"
+    />
+  </main>
+</template>
+
+<style scoped>
+.page {
+  max-width: 1440px;
+  margin-inline: auto;
+  padding-block: var(--gn-space-6);
+  display: flex;
+  flex-direction: column;
+  gap: var(--gn-space-4);
+}
+.row-actions {
+  display: flex;
+  gap: var(--gn-space-2);
+}
+.form {
+  display: flex;
+  flex-direction: column;
+  gap: var(--gn-space-4);
+}
+.keys-table {
+  margin-top: var(--gn-space-4);
+}
+.token-wrap {
+  word-break: break-all;
+  background: var(--gn-surface-elevated);
+  padding: var(--gn-space-3);
+  border-radius: var(--gn-radius-sm);
+  overflow-wrap: anywhere;
+}
+.token-copy {
+  margin-right: auto;
+}
+</style>
\ No newline at end of file
diff --git a/frontend/src/views/TargetsView.vue b/frontend/src/views/TargetsView.vue
new file mode 100644
index 0000000..18daab5
--- /dev/null
+++ b/frontend/src/views/TargetsView.vue
@@ -0,0 +1,178 @@
+<script setup>
+// Цели каналов: куда доставлять (TG-чат, SMTP, s2s-endpoint). Секреты — в .env,
+// в config только идентификаторы целей.
+import { onMounted, ref } from "vue";
+import {
+  GnBadge,
+  GnButton,
+  GnConfirmDialog,
+  GnInput,
+  GnLoader,
+  GnModal,
+  GnPageHeader,
+  GnSelect,
+  GnStatusCard,
+  GnTable,
+  GnTextarea,
+} from "gnexus-ui-kit/vue";
+import { useToast } from "gnexus-ui-kit/vue";
+import { api } from "../api.js";
+import { fmtTime, shortJson } from "../ui.js";
+
+const toast = useToast();
+
+const rows = ref([]);
+const loading = ref(true);
+const error = ref("");
+
+const CHANNELS = ["telegram", "email", "s2s", "internal_log"];
+
+async function load() {
+  loading.value = true;
+  error.value = "";
+  try {
+    rows.value = await api.listTargets();
+  } catch (ex) {
+    error.value = ex.message;
+  } finally {
+    loading.value = false;
+  }
+}
+
+const showCreate = ref(false);
+const form = ref({ channel: "telegram", name: "", description: "", config_text: "{}" });
+const busy = ref(false);
+const formError = ref("");
+
+async function createTarget() {
+  formError.value = "";
+  let config = {};
+  try {
+    config = JSON.parse(form.value.config_text || "{}");
+  } catch {
+    formError.value = "Config — не корректный JSON";
+    return;
+  }
+  busy.value = true;
+  try {
+    await api.createTarget({
+      channel: form.value.channel,
+      name: form.value.name.trim(),
+      description: form.value.description,
+      config,
+    });
+    showCreate.value = false;
+    form.value = { channel: "telegram", name: "", description: "", config_text: "{}" };
+    toast.success("Цель создана");
+    await load();
+  } catch (ex) {
+    toast.error(ex.message);
+  } finally {
+    busy.value = false;
+  }
+}
+
+const confirmDelete = ref(null);
+async function doDelete() {
+  try {
+    await api.deleteTarget(confirmDelete.value.id);
+    toast.success("Цель удалена");
+    await load();
+  } catch (ex) {
+    toast.error(ex.message);
+  } finally {
+    confirmDelete.value = null;
+  }
+}
+
+onMounted(load);
+</script>
+
+<template>
+  <main class="container page">
+    <GnPageHeader
+      kicker="Synapse"
+      title="Цели"
+      subtitle="Куда доставлять: TG-чаты, SMTP, s2s-точки. Креды каналов только в .env (gnexus-creds)"
+    >
+      <template #actions>
+        <GnButton variant="primary" icon="ph-plus" @click="showCreate = true">Цель</GnButton>
+      </template>
+    </GnPageHeader>
+
+    <GnLoader v-if="loading" />
+    <GnStatusCard v-else-if="error" variant="error" icon="ph-warning-circle" :text="error" />
+    <template v-else>
+      <GnTable
+        :rows="rows"
+        empty-text="Целей нет — например, создайте цель для internal_log"
+        :columns="[
+          { key: 'channel', label: 'Канал' },
+          { key: 'name', label: 'Название' },
+          { key: 'description', label: 'Описание' },
+          { key: 'config', label: 'Config' },
+          { key: 'created_at', label: 'Создана' },
+          { key: 'actions', label: '' },
+        ]"
+      >
+        <template #cell-channel="{ value }">
+          <GnBadge :variant="value === 'internal_log' ? 'secondary' : 'accent'" outline>{{ value }}</GnBadge>
+        </template>
+        <template #cell-config="{ row }">{{ shortJson(row.config) }}</template>
+        <template #cell-created_at="{ value }">{{ fmtTime(value) }}</template>
+        <template #cell-actions="{ row }">
+          <GnButton variant="danger" size="sm" icon="ph-trash" @click="confirmDelete = row" />
+        </template>
+      </GnTable>
+    </template>
+
+    <GnModal v-model:open="showCreate" title="Новая цель">
+      <div class="form">
+        <GnSelect v-model="form.channel" label="Канал" :options="CHANNELS.map((c) => ({ value: c, label: c }))" />
+        <GnInput v-model="form.name" label="Название" icon="ph-tag" help="Например infra-alerts" />
+        <GnTextarea v-model="form.description" label="Описание" help="Что это за клиент-сервис (для ИИ-агента и человека)" />
+        <GnInput
+          v-model="form.config_text"
+          label="Config (JSON)"
+          icon="ph-braces"
+          help='Для s2s: {"endpoint":"http://…","token_ref":"navi-rei"}; для TG: {"chat_id":"@…"}'
+          state="error"
+          :help="formError || undefined"
+        />
+      </div>
+      <template #actions>
+        <GnButton variant="secondary" @click="showCreate = false">Отмена</GnButton>
+        <GnButton variant="primary" :loading="busy" :disabled="!form.name.trim()" @click="createTarget">
+          Создать
+        </GnButton>
+      </template>
+    </GnModal>
+
+    <GnConfirmDialog
+      :open="confirmDelete !== null" @update:open="(v) => (v ? null : (confirmDelete = null))"
+      :key="confirmDelete?.id"
+      title="Удалить цель?"
+      :message="confirmDelete ? `Цель «${confirmDelete.name}» (${confirmDelete.channel}) будет удалена. Ссылки из правил и доставок обнулятся, история останется.` : ''"
+      confirm-variant="danger"
+      confirm-text="Удалить"
+      cancel-text="Отмена"
+      @confirm="doDelete"
+    />
+  </main>
+</template>
+
+<style scoped>
+.page {
+  max-width: 1440px;
+  margin-inline: auto;
+  padding-block: var(--gn-space-6);
+  display: flex;
+  flex-direction: column;
+  gap: var(--gn-space-4);
+}
+.form {
+  display: flex;
+  flex-direction: column;
+  gap: var(--gn-space-4);
+}
+</style>
\ No newline at end of file
diff --git a/frontend/src/views/TypesView.vue b/frontend/src/views/TypesView.vue
new file mode 100644
index 0000000..37fd3aa
--- /dev/null
+++ b/frontend/src/views/TypesView.vue
@@ -0,0 +1,165 @@
+<script setup>
+// Реестр типов: (source, subject, action) — что источники могут присылать.
+import { onMounted, ref } from "vue";
+import {
+  GnButton,
+  GnConfirmDialog,
+  GnInput,
+  GnLoader,
+  GnModal,
+  GnPageHeader,
+  GnSelect,
+  GnStatusCard,
+  GnTable,
+} from "gnexus-ui-kit/vue";
+import { useToast } from "gnexus-ui-kit/vue";
+import { api } from "../api.js";
+import { fmtTime } from "../ui.js";
+
+const toast = useToast();
+
+const rows = ref([]);
+const sources = ref([]);
+const loading = ref(true);
+const error = ref("");
+
+async function load() {
+  loading.value = true;
+  error.value = "";
+  try {
+    const [types, src] = await Promise.all([api.listTypes(), api.listSources()]);
+    rows.value = types;
+    sources.value = src;
+  } catch (ex) {
+    error.value = ex.message;
+  } finally {
+    loading.value = false;
+  }
+}
+
+const showCreate = ref(false);
+const form = ref({ source_id: "", subject: "", action: "" });
+const busy = ref(false);
+
+const sourceOptions = [{ value: "", label: "— выберите источник —" }];
+
+async function createType() {
+  if (!form.value.source_id || !form.value.subject || !form.value.action) return;
+  busy.value = true;
+  try {
+    await api.createType({
+      source_id: Number(form.value.source_id),
+      subject: form.value.subject.trim(),
+      action: form.value.action.trim(),
+    });
+    showCreate.value = false;
+    form.value = { source_id: "", subject: "", action: "" };
+    toast.success("Тип создан");
+    await load();
+  } catch (ex) {
+    toast.error(ex.message);
+  } finally {
+    busy.value = false;
+  }
+}
+
+const confirmDelete = ref(null);
+async function doDelete() {
+  try {
+    await api.deleteType(confirmDelete.value.id);
+    toast.success("Тип удалён");
+    await load();
+  } catch (ex) {
+    toast.error(ex.message);
+  } finally {
+    confirmDelete.value = null;
+  }
+}
+
+onMounted(load);
+</script>
+
+<template>
+  <main class="container page">
+    <GnPageHeader
+      kicker="Synapse"
+      title="Типы"
+      subtitle="Реестр (source, subject, action). Событие с незарегистрированной тройкой отклоняется с 422"
+    >
+      <template #actions>
+        <GnButton variant="primary" icon="ph-plus" @click="showCreate = true">Тип</GnButton>
+      </template>
+    </GnPageHeader>
+
+    <GnLoader v-if="loading" />
+    <GnStatusCard v-else-if="error" variant="error" icon="ph-warning-circle" :text="error" />
+    <template v-else>
+      <GnTable
+        :rows="rows"
+        empty-text="Типов нет — создайте первый"
+        :columns="[
+          { key: 'source_name', label: 'Source' },
+          { key: 'subject', label: 'Subject' },
+          { key: 'action', label: 'Action' },
+          { key: 'created_at', label: 'Создан' },
+          { key: 'actions', label: '' },
+        ]"
+      >
+        <template #cell-created_at="{ value }">{{ fmtTime(value) }}</template>
+        <template #cell-actions="{ row }">
+          <GnButton variant="danger" size="sm" icon="ph-trash" @click="confirmDelete = row" />
+        </template>
+      </GnTable>
+    </template>
+
+    <GnModal v-model:open="showCreate" title="Новый тип">
+      <div class="form">
+        <GnSelect
+          v-model="form.source_id"
+          label="Источник"
+          :options="sourceOptions.concat(sources.map((s) => ({ value: s.id, label: s.name })))"
+        />
+        <GnInput v-model="form.subject" label="Subject" icon="ph-shapes" help="Сущность: container, issue, build…" />
+        <GnInput v-model="form.action" label="Action" icon="ph-lightning" help="Что случилось: down, created, resolved…" />
+      </div>
+      <template #actions>
+        <GnButton variant="secondary" @click="showCreate = false">Отмена</GnButton>
+        <GnButton
+          variant="primary"
+          :loading="busy"
+          :disabled="!form.source_id || !form.subject.trim() || !form.action.trim()"
+          @click="createType"
+        >
+          Создать
+        </GnButton>
+      </template>
+    </GnModal>
+
+    <GnConfirmDialog
+      :open="confirmDelete !== null" @update:open="(v) => (v ? null : (confirmDelete = null))"
+      :key="confirmDelete?.id"
+      title="Удалить тип?"
+      :message="confirmDelete ? `Тип (${confirmDelete.source_name}, ${confirmDelete.subject}, ${confirmDelete.action}) будет удалён — события такой тройки отклонятся с 422.` : ''"
+      confirm-variant="danger"
+      confirm-text="Удалить"
+      cancel-text="Отмена"
+      @confirm="doDelete"
+    />
+  </main>
+</template>
+
+<style scoped>
+.page {
+  max-width: 1440px;
+  margin-inline: auto;
+  padding-block: var(--gn-space-6);
+  display: flex;
+  flex-direction: column;
+  gap: var(--gn-space-4);
+}
+.form {
+  display: flex;
+  flex-direction: column;
+  gap: var(--gn-space-4);
+}
+</style>
\ No newline at end of file