feat(tema): sayfa geçişi kısa ve hafif (600 ms), logo dönüşümü geçiş bitince oynar; DESIGN §4.22 logo morph

- Sıra: önce sayfa geçişi biter, kısa nefes (80 ms), sonra logo güneşe/aya
  dönüşür; üst üste binmez. Geçiş iptal olsa da logo doğru biçime dönüşür.
- View Transitions olmayan tarayıcıda da logo dönüşür.
- DESIGN.md §4.22: logo biçim dönüşümü tasarım diline eklendi (biçim tablosu,
  koreografi, kurallar); §6 hareket ve §7 Yap/Yapma satırları.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/lib/tema-gecisi.ts

@@ -1,8 +1,9 @@
 // Tema geçişi (DESIGN.md §2.3): açık ↔ koyu değişimi ekranı bir anda
 // çevirmez; yeni tema header'daki KolayTercih işaretinden yumuşak bir halka
 // gibi açılır — kenarı keskin değil, geniş ve tüylü; ışık yayılır gibi.
-// Aynı anda logonun kareleri yeni temanın biçimine dönüşür (koyuya: ay ve
-// yıldızlar; açığa: güneş), kısa bir an durur ve yeniden logoya toplanır.
+// Geçiş kısa ve hafiftir; BİTİNCE logonun kareleri yeni temanın biçimine
+// dönüşür (koyuya: ay ve yıldız; açığa: güneş), kısa bir an durur ve
+// yeniden logoya toplanır.
 // Markanın yumuşak, oyunsu diline uysun diye sert kenar, piksel ya da ikinci
 // bir şekil yok (9 Eki 2026).
 //
@@ -14,7 +15,7 @@
 /** Geçiş sırasında <html>'de duran sınıf (globals.css). */
 const GECIS_SINIFI = "kt-tema-gecis";
 
-/** Geçiş başlarken pencereye atılan olay; header'daki logo bunu dinleyip
+/** Geçiş bitince pencereye atılan olay; header'daki logo bunu dinleyip
  *  karelerini güneşe ya da aya dönüştürür (animasyonlu-mark.tsx). */
 export const TEMA_GECIS_OLAYI = "kt-tema-gecis";
 
@@ -23,6 +24,9 @@ export const TEMA_GECIS_OLAYI = "kt-tema-gecis";
 // en uzak köşeyi de örtecek kadar büyük seçilir.
 const CEKIRDEK = 0.55;
 
+/** Sayfa geçişi ile logo dönüşümü arasındaki kısa nefes (ms). */
+const LOGO_NEFESI = 80;
+
 let suruyor = false;
 
 /**
@@ -36,10 +40,20 @@ export function temayiGecisle(uygula: () => void) {
     return;
   }
   const azHareket = window.matchMedia("(prefers-reduced-motion: reduce)").matches;
-  if (!document.startViewTransition || azHareket) {
+  if (azHareket) {
     uygula();
     return;
   }
+  if (!document.startViewTransition) {
+    // Sayfa geçişi yok ama logo yine dönüşür; temanın sınıfı <html>'e
+    // yazılsın diye kısa bir an beklenir.
+    uygula();
+    window.setTimeout(
+      () => window.dispatchEvent(new Event(TEMA_GECIS_OLAYI)),
+      LOGO_NEFESI,
+    );
+    return;
+  }
   if (suruyor) return;
 
   const kok = document.documentElement;
@@ -64,9 +78,7 @@ export function temayiGecisle(uygula: () => void) {
   const gecis = document.startViewTransition(uygula);
   // Sekme gizliyken / yeniden boyutlanırken tarayıcı geçişi iptal eder:
   // `ready` reddedilir, tema yine uygulanmıştır; konsola hata düşmesin.
-  gecis.ready
-    .then(() => window.dispatchEvent(new Event(TEMA_GECIS_OLAYI)))
-    .catch(() => {});
+  gecis.ready.catch(() => {});
   gecis.finished
     .catch(() => {})
     .finally(() => {
@@ -75,5 +87,14 @@ export function temayiGecisle(uygula: () => void) {
       kok.style.removeProperty("--kt-tema-y");
       kok.style.removeProperty("--kt-tema-son");
       suruyor = false;
+      // Sıra: önce sayfa geçişi biter, sonra logo dönüşür — ikisi üst üste
+      // binmez, göz önce temaya sonra logoya gider. Kısa nefes (LOGO_NEFESI):
+      // geçiş iptal olduysa (sekme gizli vb.) `finished` hemen döner ve
+      // temanın sınıfı <html>'e henüz yazılmamış olabilir; logo yanlış
+      // biçime dönüşmesin.
+      window.setTimeout(
+        () => window.dispatchEvent(new Event(TEMA_GECIS_OLAYI)),
+        LOGO_NEFESI,
+      );
     });
 }