feat: добавил svg иконки

frontend/src/components/layout/AppTopbar.vue

@@ -5,6 +5,7 @@ import { useAuthStore } from '@/stores/auth'
 import { useUserStore } from '@/stores/user'
 import CoinChip from '@/components/ui/CoinChip.vue'
 import SearchInput from '@/components/ui/SearchInput.vue'
+import AppIcon from '@/components/ui/AppIcon.vue'
 import { formatUserName } from '@/utils/formatUserName'
 
 const auth = useAuthStore()
@@ -35,7 +36,7 @@ function openProfile() {
 <template>
   <header class="topbar">
     <div class="topbar-brand">
-      <span class="brand-icon">🌍</span>
+      <AppIcon class="brand-icon" icon="world" :size="24" />
       <span class="brand-name">UniVerse</span>
     </div>
 
@@ -51,7 +52,7 @@ function openProfile() {
       </button>
 
       <button class="notif-btn" @click="$router.push('/notifications')">
-        🔔
+        <AppIcon icon="bell" :size="18" />
         <span class="notif-dot" v-if="auth.user && unreadCount > 0">
           {{ unreadCount }}
         </span>
@@ -65,7 +66,7 @@ function openProfile() {
         @keydown.enter.prevent="openProfile"
         @keydown.space.prevent="openProfile"
       >
-        <span class="avatar-icon">👤</span>
+        <AppIcon class="avatar-icon" icon="user" :size="18" />
         <span class="avatar-name" v-if="auth.user">{{ formatUserName(auth.user.name) }}</span>
       </div>
     </div>
@@ -98,7 +99,7 @@ function openProfile() {
   flex-shrink: 0;
   cursor: pointer;
 }
-.brand-icon { font-size: 24px; }
+.brand-icon { color: var(--color-text); }
 .brand-name {
   font-size: 20px;
   font-weight: 800;
@@ -165,7 +166,7 @@ function openProfile() {
   transition: all 0.2s;
 }
 .avatar:hover { background: rgba(255,255,255,0.8); }
-.avatar-icon { font-size: 18px; }
+.avatar-icon { color: var(--color-text-secondary); }
 .avatar-name { font-size: 13px; font-weight: 600; color: var(--color-text); }
 
 @media (max-width: 640px) {