Add network map UX and theme support.

Introduce network map view/components with filtering and positioning, expand contacts/map backend fields and migrations, and add a persistent light/dark theme toggle with graph label color updates for readability.

Co-authored-by: Cursor <cursoragent@cursor.com>

frontend/src/components/MapLegendPanel.vue

@@ -0,0 +1,87 @@
+<template>
+  <div class="network-map-legend card">
+    <div class="legend-row">
+      <span><strong class="legend-strong">━━</strong> интенсивные</span>
+      <span><strong class="legend-strong">╌╌</strong> редкие</span>
+      <span class="legend-hint">{{ hint }}</span>
+    </div>
+    <div class="legend-rings">
+      <span class="legend-ring-inner">внутреннее кольцо — поддержка</span>
+      <span class="legend-ring-mid">среднее — продуктивность</span>
+      <span class="legend-ring-outer">внешнее — развитие</span>
+    </div>
+  </div>
+</template>
+
+<script setup>
+defineProps({
+  hint: {
+    type: String,
+    default: 'Имя — в подсказке при наведении; клик — карточка. Масштаб и панорама — мышью; точки закреплены в секторах.',
+  },
+})
+</script>
+
+<style scoped>
+.network-map-legend {
+  margin: 0 28px 10px;
+  padding: 10px 14px;
+  font-size: 12px;
+  color: var(--text-muted);
+}
+.legend-row {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px 16px;
+}
+.legend-strong {
+  color: var(--text);
+}
+.legend-hint {
+  flex: 1 1 200px;
+  font-size: 11px;
+  opacity: 0.9;
+}
+.legend-rings {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px 18px;
+  margin-top: 10px;
+  padding-top: 10px;
+  border-top: 1px solid var(--border);
+}
+.legend-ring-inner::before {
+  content: '';
+  display: inline-block;
+  width: 10px;
+  height: 10px;
+  border: 1px solid var(--border);
+  border-radius: 50%;
+  margin-right: 6px;
+  vertical-align: -1px;
+  opacity: 0.85;
+}
+.legend-ring-mid::before {
+  content: '';
+  display: inline-block;
+  width: 14px;
+  height: 14px;
+  border: 1px solid var(--border);
+  border-radius: 50%;
+  margin-right: 6px;
+  vertical-align: -2px;
+  opacity: 0.85;
+}
+.legend-ring-outer::before {
+  content: '';
+  display: inline-block;
+  width: 18px;
+  height: 18px;
+  border: 1px solid var(--border);
+  border-radius: 50%;
+  margin-right: 6px;
+  vertical-align: -3px;
+  opacity: 0.85;
+}
+</style>