Sprint 11: Freunde & Chat + Phosphor-Icon-Vollmigration

- Freundschaften (pending/accepted), Nutzersuche, Anfragen per Push
- Direktnachrichten mit Polling, iMessage-Stil, Deep-Links aus Push
- Alle Seiten (map, places, diary, health, dog-profile, sitting, knigge,
  forum, wiki, walks) vollständig auf Phosphor-Icons migriert
- Wikidata-Rassen-Scraper (~833 neue Rassen, lokal gespiegelte Fotos)
- TheDogAPI lokal gespiegelt (169 Rassen + Fotos)
- Quiz-Result-Cards horizontal (korrekte Bildproportionen)
- SW by-v89

backend/static/js/pages/diary.js

@@ -16,12 +16,12 @@ window.Page_diary = (() => {
   const LIMIT     = 20;
 
   const TYPEN = {
-    eintrag:    { label: 'Eintrag',    icon: '📖' },
-    foto:       { label: 'Foto',       icon: '📷' },
-    meilenstein:{ label: 'Meilenstein',icon: '🏆' },
-    training:   { label: 'Training',   icon: '🎯' },
-    gesundheit: { label: 'Gesundheit', icon: '💉' },
-    ausflug:    { label: 'Ausflug',    icon: '🚗' },
+    eintrag:    { label: 'Eintrag',    icon: '<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#book-open"></use></svg>' },
+    foto:       { label: 'Foto',       icon: '<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#camera"></use></svg>' },
+    meilenstein:{ label: 'Meilenstein',icon: '<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#trophy"></use></svg>' },
+    training:   { label: 'Training',   icon: '<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#target"></use></svg>' },
+    gesundheit: { label: 'Gesundheit', icon: '<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#syringe"></use></svg>' },
+    ausflug:    { label: 'Ausflug',    icon: '<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#car"></use></svg>' },
   };
 
   // ----------------------------------------------------------
@@ -72,7 +72,7 @@ window.Page_diary = (() => {
   async function _render() {
     if (!_appState.activeDog) {
       _container.innerHTML = UI.emptyState({
-        icon:   '🐕',
+        icon:   '<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#dog"></use></svg>',
         title:  'Noch kein Hund angelegt',
         text:   'Erstelle zuerst ein Hundeprofil, um das Tagebuch zu nutzen.',
         action: `<button class="btn btn-primary" id="diary-goto-profile">Profil erstellen</button>`,
@@ -99,7 +99,7 @@ window.Page_diary = (() => {
       const isActive = dog.id === activeDogId;
       const av = dog.foto_url
         ? `<img src="${_escape(dog.foto_url)}" alt="${_escape(dog.name)}">`
-        : `<span style="font-size:2.5rem">🐕</span>`;
+        : `<span>${UI.icon('dog')}</span>`;
       return `
         <div class="diary-picker-card${isActive ? ' diary-picker-card--active' : ''}"
              data-dog-id="${dog.id}">
@@ -186,7 +186,7 @@ window.Page_diary = (() => {
 
     if (_entries.length === 0) {
       listEl.innerHTML = UI.emptyState({
-        icon:   '📖',
+        icon:   '<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#book-open"></use></svg>',
         title:  'Noch keine Einträge',
         text:   'Halte besondere Momente mit deinem Hund fest.',
         action: `<button class="btn btn-primary" id="diary-first-entry">Ersten Eintrag erstellen</button>`,
@@ -243,6 +243,11 @@ window.Page_diary = (() => {
       ? `<p class="diary-card-text">${_escape(e.text.slice(0, 140))}${e.text.length > 140 ? '…' : ''}</p>`
       : '';
 
+    // Meilenstein-Badge (nur bei is_milestone=1, nicht bei manuell gewähltem Typ 'meilenstein')
+    const milestoneBadge = e.is_milestone
+      ? `<div class="diary-card-milestone-badge">${UI.icon('calendar-dots')} Meilenstein</div>`
+      : '';
+
     // Mehrere Hunde: kleine Avatare in der Karte
     const dogAvatars = _dogAvatarRow(e.dog_ids || []);
 
@@ -250,6 +255,7 @@ window.Page_diary = (() => {
       <div class="diary-card${isMile ? ' diary-card--milestone' : ''}" data-entry-id="${e.id}">
         ${photo}
         <div class="diary-card-body">
+          ${milestoneBadge}
           <div class="diary-card-meta">
             <span class="diary-card-type">${typ.icon} ${typ.label}</span>
             <span class="diary-card-date">${dateStr}</span>
@@ -269,7 +275,7 @@ window.Page_diary = (() => {
       const dog = _appState.dogs.find(d => d.id === did);
       if (!dog) return '';
       return `<div class="diary-dog-av" title="${_escape(dog.name)}">
-        ${dog.foto_url ? `<img src="${_escape(dog.foto_url)}" alt="">` : '<span>🐕</span>'}
+        ${dog.foto_url ? `<img src="${_escape(dog.foto_url)}" alt="">` : `<span>${UI.icon('dog')}</span>`}
       </div>`;
     }).join('');
     return `<div class="diary-dog-row">${avatars}</div>`;
@@ -299,7 +305,7 @@ window.Page_diary = (() => {
              const dog = _appState.dogs.find(d => d.id === did);
              return dog ? `<div class="diary-dog-chip">
                <div class="diary-dog-av">
-                 ${dog.foto_url ? `<img src="${_escape(dog.foto_url)}" alt="">` : '<span>🐕</span>'}
+                 ${dog.foto_url ? `<img src="${_escape(dog.foto_url)}" alt="">` : `<span>${UI.icon('dog')}</span>`}
                </div>
                <span>${_escape(dog.name)}</span>
              </div>` : '';
@@ -308,7 +314,7 @@ window.Page_diary = (() => {
       : '';
 
     const body = `
-      ${isMile ? '<div class="diary-detail-milestone-badge">🏆 Meilenstein</div>' : ''}
+      ${isMile ? `<div class="diary-detail-milestone-badge">${UI.icon('trophy')} Meilenstein</div>` : ''}
       ${photo}
       <div style="display:flex;gap:var(--space-2);align-items:center;margin-bottom:var(--space-3)">
         <span class="badge badge-primary">${typ.icon} ${typ.label}</span>
@@ -374,7 +380,7 @@ window.Page_diary = (() => {
               <input type="checkbox" name="extra_dog" value="${d.id}"
                      ${entryDogIds.includes(d.id) ? 'checked' : ''}>
               <div class="diary-dog-av">
-                ${d.foto_url ? `<img src="${_escape(d.foto_url)}" alt="">` : '<span>🐕</span>'}
+                ${d.foto_url ? `<img src="${_escape(d.foto_url)}" alt="">` : `<span>${UI.icon('dog')}</span>`}
               </div>
               <span>${_escape(d.name)}</span>
             </label>`).join('')}