feat(ui): 11 Ekim gece işi — program ayrıntıda açılan gösterge kareleri, veri akışı sahnesi, haritada kenar eritme

- program-ayrinti: kontenjan türleri, netler ve mezun istihdamı kapalıyken
  gösterge karesi; dokununca kare panele dönüşüp bölümün tamamını açar.
  Kontenjan türü satırlarına "kime açık" alt satırı (KONTENJAN_TURU_KIME).
- veri-akisi: üstte öğrencinin üç seçimi, altta YÖK Atlas'ın üç verisi,
  ortada DanışmanlaKonuş çekirdeği; kayıtlar kıvrımlı yollardan çekirdeğe
  akar (kt-akis-* kuralları globals.css'te).
- tercih-haritasi: il'e yakınlaşınca kenarlar iki katlı mask'la erir; tam
  görünümde mask yok, ülke uçları solmaz.
- DESIGN.md: ilgili bölümler güncellendi (§4.19, §4.28).

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

docs/tasarim/DESIGN.md

@@ -668,8 +668,9 @@ sihirbaz modalı içindir; yeni bir ayrıntı için `Dialog` açılmaz.
   tek çekmece açar; veri `/api/program-ayrinti`. Sıra: başlık = program adı, bağlam =
   üniversite · il · fakülte; **künye hapları** (§4.12 ölçüsü, link değil: süre + tür, dil,
   öğretim türü (örgün değilse), burs/ücret, akreditasyon, baraj, öğretim üyesi sayısı,
-  yalnız kız/erkek koşulu, kampüs ilçesi — yalnız verisi olanlar); "Kontenjan türleri (yıl)" `dl` satırları
-  (yalnız >0 olanlar; özel kontenjanın ayrı taban sırasının elimizde olmadığı notu);
+  yalnız kız/erkek koşulu, kampüs ilçesi — yalnız verisi olanlar); "Kontenjan türleri (yıl)" satırları
+  (yalnız >0 olanlar; özel kontenjanın ayrı taban sırasının elimizde olmadığı notu; güncel
+  düzen aşağıda, 11 Eki 2026);
   "Son yerleşenin netleri" (eski tablo + OBP katsayısı satırı; 0,18 = meslek lisesi ek
   puanı notu); "Yerleşme koşulları (N)" yerel `details` ile kapalı başlar; "Mezun
   istihdamı" ve "Üniversite" tek paragraf; en altta kaynak satırı `border-t border-slate-100
@@ -693,6 +694,37 @@ sihirbaz modalı içindir; yeni bir ayrıntı için `Dialog` açılmaz.
   göstergeler çekmecesi (§4.9) aynı bileşenin kartlı modunu kullanır (her açılışta oynar).
   Gövde kaydırılınca içerik tutamaç ve çarpının altına maskesiz girmesin diye `AltSayfaGovde`
   üst kenarında 20 px saydam → dolu `mask-image` var (§4.10; tüm çekmeceler).
+- **11 Eki 2026 — kontenjan türleri (açık panelin içi): önce bütün, sonra parçalar:** Bilal: "daha anlaşılabilir
+  bir UI." Eski hâl (uzun açıklama paragrafı + iki sütunlu `dl`, "70 kontenjan · 72 yerleşen")
+  kimin hangi yere girebildiğini söylemiyordu. Yeni sıra: tek cümle toplam (`text-base
+  text-slate-600`, sayı `font-semibold text-slate-900`: "Toplam 81 kişilik yer açıldı: 70 herkese
+  açık, 11 yalnız şartı taşıyan adaylara") → oran çubuğu (`flex h-3 gap-0.5 rounded-full`,
+  dilim genişliği kontenjanla orantılı, `min-w-1.5`; genel `bg-primary`, özel `bg-slate-300`,
+  `aria-hidden`) → iki grup: "Herkese açık" ve "Yalnız şartı taşıyan adaylara" (grup etiketi
+  `text-sm font-semibold text-slate-500` + çubukla aynı renkte `size-2.5` nokta). Satır tek
+  sütun, `border-b border-slate-100 py-3`: solda ad (`text-base font-semibold`) ve altında
+  kimin girebildiği (`KONTENJAN_TURU_KIME`, `src/lib/ozel-durum.ts`); sağda sayı (`font-heading
+  text-xl font-bold` + `kişi` birimi) ve altında "N yerleşti · M boş kaldı". Renk yalnız
+  açık/şartlı ayrımını taşır, türün adı her satırda yazılıdır. Altta not: özel taban sırası
+  bizde yok; genelde yerleşen kontenjanı aşıyorsa aktarım cümlesi eklenir. Yalnız genel
+  kontenjan varsa çubuk ve grup yok, tek satır. Kart yok kuralı duruyor.
+- **11 Eki 2026 — üç bölüm dönüşen gösterge karesi:** Bilal: "Kontenjan türleri, son
+  yerleşenin netleri, mezun istihdamı akademik göstergelerdeki gibi kutu olsun; tıklanınca o
+  kutu morph olarak genişlesin ve içeriğin tam hâli gözüksün." Bu üç bölüm artık künye
+  haplarının altında §4.11 gösterge kareleridir (`BolumKutulari`; sınıflar §4.11 ile birebir,
+  masonry: sol sütun Kontenjan `bg-orange-500 min-h-40` + İstihdam `bg-indigo-500 min-h-28`,
+  sağ sütun `mt-12` Son yerleşen `bg-primary min-h-40`). Kare bir düğmedir: etiket + sayı +
+  vurgu satırı, sağ üstte `Maximize2 size-4 text-white/80`, `active:scale-[0.97]`. Dokununca
+  kare **tam genişlikte panele dönüşür** (`motion` `layoutId`, yay `YAY.donusum`; köşe 24 px
+  stilde ki ölçeklenirken bozulmasın): panel `rounded-3xl bg-slate-50 p-4 sm:p-5`, kenarlıksız;
+  karenin rengi panelin üstünde `SURE.standart`'ta söner, içerik 0,14 s gecikmeyle belirir.
+  Panel başlığı: karenin renginde `size-3 rounded-[4px]` kare + `font-heading text-base
+  font-bold` başlık + §4.3 çarpısı ("küçült"). Aynı anda tek panel açık; kalan iki kare panelin
+  altında yan yana durur, dokununca yer değiştirir. Odak dönüşen öğeyle gider (açılınca çarpı,
+  kapanınca kare). "Hareketi azalt"ta dönüşüm yok (`MotionConfig reducedMotion="user"`). Verisi
+  olmayan bölümün karesi çizilmez. 10 Ekim'deki "bu çekmecede kart yok" kuralı bu üç bölüm için
+  kalktı; koşullar, üniversite ve kaynak satırı kartsız kalır. Açılış sahnesi değişmedi (logo →
+  başlık); kareler tek `data-sonra` bloğu olarak netleşir.
 - **10 Eki 2026 — büyük logo, logo → başlık (morph):** Bilal: "logo küçücük kalmış; logolar
   küçülürken başlıktaki yazıya morph olsun." Logo kabı `size-44` (akademik göstergelerdeki
   logoyla aynı ölçek). Kareler sönmek yerine küçülerek (scale 0.2) başlık yazısının üç eşit
@@ -890,43 +922,58 @@ dilindedir, burada kullanılmaz). Kaynak Arc UI "Card stack".
   kullanacağız". Dosyalar duruyor; şu an hiçbir sayfada çizilmiyor.
 
 ### 4.28 Veri akışı — `VeriAkisi`, `src/features/pazarlama/components/veri-akisi.tsx`
-Ana sayfa "Nasıl çalışır" bölümünde, üç adımın (§4.32) altında: ortada KolayTercih işareti,
-çevresinde altı girdi; her girdiden merkeze **düz çizgi** iner, üzerinde piksel kare akar. **Solda
-öğrencinin üç seçimi** (turuncu ikon ve kare), **sağda YÖK Atlas'ın üç verisi** (mavi ikon ve
-kare); ayrımı etiket ve yan taşır, renk eşlik eder (§2.2). Akış CSS'tir (`kt-akis`, globals.css),
-yalnız ekrandayken oynar; hareketi azalt'ta kareler durur. Esin React Bits "Center Flow"; kod
-bizim — parlama ve bulanıklık yok, akış içeri doğru. Yeni bir girdi eklenirse sihirbaz/havuz
-kurallarıyla aynı olmalı (`/meraklisina` şemasıyla çelişmez).
-- **Çizgi düz, karolar beyaz** (Bilal, 7 Eki 2026: "aradaki yerler solid çizgi olsun, etrafındaki
-  kartların bg'si ve görünümü daha iyi olabilir"). Çizgi `var(--color-slate-300)`, 1,5 px
-  (`vectorEffect="non-scaling-stroke"`), karonun merkezinden işaretin merkezine çekilir ve
-  karoların **altında** kalır; kesik/noktalı çizgi yazılmaz. Girdi karosu
-  `size-14 rounded-2xl border border-slate-200 bg-card` + `size-6` ikon; ortadaki karo
-  `size-24 rounded-3xl border border-slate-200 bg-card`. Renkli soluk zemin (`bg-orange-50/60`,
-  `bg-primary/10`) kaldırıldı: karo dolu olmalı ki çizgi içinden görünmesin. Gölge yok (§6).
+Ana sayfa "Nasıl çalışır" bölümünde, üç adımın (§4.32) altında. **Üstte öğrencinin üç seçimi**
+(turuncu ikon ve kayıt), **altta YÖK Atlas'ın üç verisi** (mavi ikon ve kayıt), **ortada
+danışman**: "DanışmanlaKonuş" çekirdeği. Her kutudan çekirdeğe kıvrımlı bir yol iner, üzerinde
+kayıt akar; ayrımı etiket ve sıra taşır, renk eşlik eder (§2.2). Akış CSS'tir (`kt-akis-*`,
+globals.css), yalnız ekrandayken oynar; hareketi azalt'ta her yolda bir ham kayıt durağan durur.
+Yerleşim ve kaydın yaşam döngüsü Arc UI "Data flow"dan (Bilal, 11 Eki 2026: önce "logoya kareler
+gelen kısım bunun gibi gözükmeli", sonra "ortadaki kısmı dikdörtgen formuna sokup DanışmanlaKonuş
+yazsak, kutular attığım örnekteki gibi"). Arc'ın bileşeni Pro'dur, kaynağı alınmadı (§11.3
+md. 7); önizlemedeki davranış DOM kaydıyla ölçülüp bizim dille yeniden yazıldı — parlama ve
+bulanıklık yok. Yeni bir girdi eklenirse sihirbaz/havuz kurallarıyla aynı olmalı
+(`/meraklisina` şemasıyla çelişmez). Eski altıgen yerleşim (ortada kare logo karosu, çevresinde
+altı karo, düz çizgiler) kaldırıldı.
+- **Kutu:** `h-20 w-[30%] rounded-2xl border border-slate-200 bg-card`, ikon üstte (`size-5`,
+  yanın renginde), etiket altta (`text-xs font-semibold leading-tight text-balance
+  text-slate-700`, en çok iki satır). Etiket kutunun **içindedir**; dışarıda yüzen etiket yok.
+  Üç kutu sütunları kabın %16,7 / %50 / %83,3'ünde. Gölge yok (§6).
+- **Çekirdek:** `h-16 rounded-2xl border border-slate-200 bg-card`, içinde danışman panelinin
+  başlığı (`DanismanBaslik` deseni, `sohbet-client.tsx`): turuncu `AnimasyonluMark`
+  (`varyant="nabiz" renk="turuncu"`, `size-7`) + `font-bricolage text-xl tracking-tighter`
+  "Danışmanla" (`font-light`) "Konuş" (`font-semibold`), boşluksuz. İşaret ≈3 sn nabız atar,
+  sonra girdilerden çıkana dönüşür (liste → trend → sohbet, `bicimler`, §4.34) ve toplanır.
+- **Yol:** `var(--color-slate-300)`, 1,5 px, kesiksiz; iki ucu dikey çıkan S kıvrımı
+  (`C x0 ym, x1 ym`). Yollar çekirdeğin kenarına ortadan 4'er birim açılarak varır. Kutudan
+  çıktığı yerde 7 px'lik **port** halkası durur.
+- **Kayıt ham çıkar, işlenmiş varır.** Ömrü 1,4 sn: porttan küçük ve soluk doğar (ölçek
+  0,6 → 1), arkasında iki küçük noktadan bir **iz** taşır; yol boyunca **içi boş nokta**dır (ham
+  girdi: `bg-card` dolgu, 1,5 px renkli çerçeve). Çekirdeğe yaklaşınca hafifçe şişer (1,2),
+  **dolar ve piksel kareye döner** (işlenmiş), kenarda sönerek içeri alınır. O an **çekirdeğin
+  çerçevesi** kaydın renginde yanar, genişleyip söner; kalkışta da kutunun çerçevesi ve portu
+  kısa bir an yanar (tepe %50). Ham ile işlenmiş yalnız renkle değil **biçimle** ayrılır.
+- **Ritim:** 6 sn'lik döngüde altı kayıt, 1 sn arayla, bir üstten bir alttan kalkar; yol 1,2 sn
+  sürdüğü için biri varırken sıradaki yola çıkmıştır, akış hiç durmaz.
+- **Kayıt eğriyi JS'siz izler.** Bu S kıvrımında parametre zamanla doğrusal ilerlerken x tam
+  olarak `cubic-bezier(1/3, 0, 2/3, 1)`, y tam olarak `cubic-bezier(1/3, .5, 2/3, .5)` izler;
+  kayıt iç içe iki öğedir (dıştaki yatay, içteki dikey kayar) ve çizginin tam üstünde yürür. Bu
+  iki eğri hareket zevki değil yolun geometrisidir (`--akis-x`, `--akis-y`); `hareket.ts`'e
+  girmez, yol değişirse onlar da değişir. İz noktaları aynı iki kaymayı 70 ve 140 ms gecikmeyle
+  yapar. Yatay eksen kabın yüzdesidir (kap `@container`, x'ler `cqw`), dikey eksen rem; ölçüm
+  ya da `ResizeObserver` yok. Eğri öğenin `animation` kısayolundadır: tarayıcı `@keyframes`
+  içindeki `animation-timing-function: var(--…)` değerini çözmez, doğrusala düşer.
 - **Kartsız, zeminsiz; bilgiler iki yanında, onlar da kartsız** (Bilal, 7 Eki 2026: "kartın
   dışında, arka plansız, sağında solunda da alttaki bilgiler olacak şekilde"; aynı gün: "hero'daki
   gibi ferah"). Geniş ekranda (lg+) üç sütun (`lg:grid-cols-[minmax(0,1fr)_22rem_minmax(0,1fr)]`,
   xl'de orta 24rem, dikeyde ortalı): **solda dürüstlük notu** — `SectionEyebrow` + `h3`
   (`font-heading text-2xl font-bold text-balance`, ikinci yarısı hero başlığındaki vurgu:
   `font-bricolage font-bold tracking-tighter text-primary italic`) + `text-base` paragraf, sola
-  yaslı, `max-w-xs`; **ortada animasyon**; **sağda üç sayı** alt alta, sağa yaslı (YÖK Atlas
-  girdilerinin yanında — sayılar o verinin sayılarıdır). Sayı §1.1: `font-heading text-4xl
+  yaslı, `max-w-xs`; **ortada animasyon**; **sağda üç sayı** alt alta, sağa yaslı (sayılar
+  alt sıradaki YÖK Atlas verisinin sayılarıdır). Sayı §1.1: `font-heading text-4xl
   font-bold leading-none tracking-tight text-primary sm:text-5xl`, birim ("yıl") §3'teki gibi
   `font-sans text-base font-semibold text-slate-400`, etiket `text-sm font-semibold
   text-slate-500`. Çerçeve, zemin, ayırıcı çizgi ve sayının yanında piksel süs **yok**.
   lg altında tek sütun, her şey ortalı: animasyon → sayılar (sm'de üçü yan yana) → dürüstlük notu.
-- **Ortadaki işaret danışmandır: nabız atar, sonra çıktıya dönüşür** (Bilal, 11 Eki 2026:
-  "logo morph ile ikonlara dönüşsün; belirli süre DanışmanlaKonuş'un animasyonu oynayıp morph
-  olsun, şu ankini kaldır"). İşaret ≈3 sn DanışmanlaKonuş başlığındaki gibi yerinde nabız atar
-  (`varyant="nabiz"`: danışman düşünüyor), sonra üç kare girdilerden çıkan şeye dönüşür, ≈1,3 sn
-  durur ve logoya toplanır (toplam 2,5 sn); nabız yerinden sürer, sıra bir sonraki biçime
-  geçer. Sıra paketin verdiğidir: **liste** (deste) → **trend** (yükselen üç çubuk) → **sohbet**
-  (iki balon). Biçimler §4.34'tekilerle aynı dilde, üç kareden ve logonun üç renginden
-  (`AnimasyonluMark` `bicimler`). Yalnız ekrandayken oynar; ekrandan çıkınca kareler yerine
-  oturur. Hareketi azalt'ta durağan logo. Eski "rota" (kareler birbirinin yerine süzülür) bu
-  karodan kaldırıldı; ondan önceki nabız + tüm karoyu döndüren hâl (`kt-akis-donus`) de yanlıştı
-  (Bilal, 7 Eki 2026).
 
 ### 4.29 Program duvarı — `ProgramDuvari`, `src/features/pazarlama/components/program-duvari.tsx`
 **Şu an sayfada kullanılmıyor:** ana sayfa "Sorun" bölümünden 7 Eki 2026'da çıkarıldı (Bilal: