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/app/globals.css

@@ -478,20 +478,21 @@
 }
 
 /* Tema geçişi (DESIGN.md §2.3, lib/tema-gecisi.ts): yeni tema header'daki
-   logodan başlar ve ekrana piksel piksel yayılır — sitenin piksel imzasının
-   hareketli hâli. Eski görüntü yerinde durur; yeni görüntü, JS'in kare kare
-   bastığı kare ızgarası maskesiyle (--kt-tema-maske, küçük bir tuvalden
-   üretilir; --kt-tema-en/boy ızgaranın ekrandaki ölçüsü) üstünde açılır.
-   `pixelated`: küçük maske büyütülürken kareler bulanmaz, keskin kalır.
-   Sürenin tek kaynağı --kt-tema-sure (JS buradan okur). kt-tema-omur değeri
-   değişmeyen ama gerçek bir animasyondur: view transition, üzerindeki
-   animasyon bitene kadar kalkmaz; maskeyi JS sürerken ömrü bu tutar.
+   logodan yumuşak bir halka gibi açılır. Eski görüntü yerinde durur; yeni
+   görüntü radyal degrade maskesiyle üstünde belirir. Maskenin kenarı keskin
+   değil: yarıçapın %55'ine kadar tam opak, oradan kenara doğru tüy gibi
+   söner (--kt-tema-cekirdek; JS'teki CEKIRDEK ile aynı olmalı) — ışık
+   yayılır gibi, sert çizgi yok. Yarıçap (--kt-tema-r) 0 → --kt-tema-son
+   yumuşak kalkıp yumuşak durur. Merkez ve son yarıçap JS'ten gelir.
    Hareket azaltılmışsa JS geçişi hiç başlatmaz, tema düz değişir. */
-:root {
-  --kt-tema-sure: 900ms;
+@property --kt-tema-r {
+  syntax: "<length>";
+  inherits: true;
+  initial-value: 0px;
 }
 .kt-tema-gecis {
   view-transition-name: root;
+  --kt-tema-cekirdek: 0.55;
 }
 .kt-tema-gecis::view-transition-old(root),
 .kt-tema-gecis::view-transition-new(root) {
@@ -503,18 +504,18 @@
 }
 .kt-tema-gecis::view-transition-new(root) {
   z-index: 2;
-  mask-image: var(--kt-tema-maske);
-  mask-repeat: no-repeat;
-  mask-position: 0 0;
-  mask-size: var(--kt-tema-en) var(--kt-tema-boy);
-  image-rendering: pixelated;
-  animation: kt-tema-omur calc(var(--kt-tema-sure) + 80ms) linear both;
+  mask-image: radial-gradient(
+    circle at var(--kt-tema-x) var(--kt-tema-y),
+    #000 calc(var(--kt-tema-r) * var(--kt-tema-cekirdek)),
+    transparent var(--kt-tema-r)
+  );
+  animation: kt-tema-halka 1100ms cubic-bezier(0.45, 0, 0.2, 1) both;
 }
-@keyframes kt-tema-omur {
+@keyframes kt-tema-halka {
   from {
-    opacity: 1;
+    --kt-tema-r: 0px;
   }
   to {
-    opacity: 1;
+    --kt-tema-r: var(--kt-tema-son);
   }
 }