Sync managed gateway routes on startup and fix layout initialization

frontend/src/components/ProtocolIcon.vue

@@ -75,6 +75,9 @@ const ICON_PATHS = {
 
 const pathData = computed(() => {
   const key = props.protocol.startsWith('custom:') ? 'custom' : props.protocol
+  // The imported WireGuard path was truncated in the original asset. Keep a
+  // valid compact tunnel symbol until the full vector is replaced.
+  if (key === 'wireguard') return 'M12 2 3 6v6c0 5.25 3.84 9.74 9 10 5.16-.26 9-4.75 9-10V6L12 2zm0 2.2 7 2.8v5c0 4.1-2.6 7.5-7 8.7-4.4-1.2-7-4.6-7-8.7V7l7-2.8zM7 11h10v2H7zm2-3h6v2H9zm0 6h6v2H9z'
   return ICON_PATHS[key] || ICON_PATHS.custom
 })
 </script>

frontend/src/views/Layout.vue

@@ -109,6 +109,9 @@ import { useI18n } from 'vue-i18n'
 import { DataAnalysis, Connection, Setting, Avatar, ArrowDown, UserFilled, Iphone, Lock, Monitor, Promotion, Document, Link, Expand, Fold, Close, Operation } from '@element-plus/icons-vue'
 import api, { auth } from '../api'
 
+const router = useRouter()
+const route = useRoute()
+const { t, locale } = useI18n()
 const collapsed = ref(localStorage.getItem('vpn_nav_collapsed') === '1')
 const mobileOpen = ref(false)
 function toggleCollapsed() {
@@ -119,10 +122,6 @@ watch(() => route.fullPath, () => { mobileOpen.value = false })
 function onEscape(event) { if (event.key === 'Escape') mobileOpen.value = false }
 onMounted(() => window.addEventListener('keydown', onEscape))
 onUnmounted(() => window.removeEventListener('keydown', onEscape))
-const router = useRouter()
-const route = useRoute()
-const { t, locale } = useI18n()
-
 const roleLabel = computed(() => ({ admin: t('users.roleAdmin'), operator: t('users.roleOperator'), viewer: t('users.roleViewer') }[auth.role] || auth.role))
 const roleTagType = computed(() => auth.role === 'admin' ? 'danger' : auth.role === 'operator' ? 'warning' : 'info')