feat(tema): tema geçişi logodan yumuşak, tüylü kenarlı halka olarak açılır; logo bir etap oynar

Piksel ızgarası sert bulundu (Bilal, 9 Eki 2026). Yeni tema radyal degrade
maskesiyle açılır: yarıçapın %55'i opak, kalanı tüy; 1100 ms yumuşak eğri.
Geçiş başlarken header'daki logonun kareleri bir etap yürüyüp yerine oturur
(kt-tema-gecis olayı). Tuval/maske karesi kodu kaldırıldı. DESIGN §2.3 güncel.

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

src/components/animasyonlu-mark.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { useEffect, useRef } from "react";
+import { TEMA_GECIS_OLAYI } from "@/lib/tema-gecisi";
 import { cn } from "@/lib/utils";
 
 // public/kolay-tercih-mark.svg'nin inline, animasyonlu karşılığı.
@@ -276,9 +277,24 @@ export function AnimasyonluMark({
     const cik = () => kontrolRef.current?.ayarla(null, true);
     hoverHedefi.addEventListener("mouseenter", gir);
     hoverHedefi.addEventListener("mouseleave", cik);
+    // Tema geçişi başlarken (lib/tema-gecisi.ts) kareler bir etap yürür ve
+    // yerine oturur: geçiş logodan yayıldığı için onu logo başlatmış olur.
+    // İmleç zaten üzerindeyse hover döngüsü sürer, dokunulmaz.
+    let temaZamanlayici: number | undefined;
+    const temaGecti = () => {
+      if (hoverHedefi.matches(":hover")) return;
+      gir();
+      window.clearTimeout(temaZamanlayici);
+      temaZamanlayici = window.setTimeout(() => {
+        if (!hoverHedefi.matches(":hover")) cik();
+      }, 1000);
+    };
+    window.addEventListener(TEMA_GECIS_OLAYI, temaGecti);
     return () => {
       hoverHedefi.removeEventListener("mouseenter", gir);
       hoverHedefi.removeEventListener("mouseleave", cik);
+      window.removeEventListener(TEMA_GECIS_OLAYI, temaGecti);
+      window.clearTimeout(temaZamanlayici);
     };
   }, [oynat, sadeceHover, varyant]);