/**
 * Oyun girişi — çapraz belge View Transition.
 * Hub kartı seçilen oyunun sayfasına aynı isimle morph olur.
 * prefers-reduced-motion: native geçiş kapanır.
 */
@view-transition { navigation: auto; }
::view-transition { pointer-events: none; }

::view-transition-old(root) {
  animation: temsor-cikis .42s cubic-bezier(.22, 1, .36, 1) both;
}
::view-transition-new(root) {
  animation: temsor-giris .5s cubic-bezier(.22, 1, .36, 1) both;
}
@keyframes temsor-cikis {
  to { opacity: 0; filter: blur(6px); transform: scale(.985); }
}
@keyframes temsor-giris {
  from { opacity: 0; transform: scale(1.015); }
}

html[data-giris="kosu"]::view-transition-old(root) {
  animation-name: kosu-cikis;
}
html[data-giris="kosu"]::view-transition-new(root) {
  animation-name: kosu-acilis;
}
@keyframes kosu-cikis {
  to { opacity: 0; transform: translateY(-6%) scale(1.04); filter: blur(8px); }
}
@keyframes kosu-acilis {
  from { clip-path: inset(100% 0 0 0); }
  to { clip-path: inset(0 0 0 0); }
}

html[data-giris="pisti"]::view-transition-old(root),
html[data-giris="okey101"]::view-transition-old(root),
html[data-giris="batak"]::view-transition-old(root) {
  animation-name: kece-cikis;
}
html[data-giris="pisti"]::view-transition-new(root),
html[data-giris="okey101"]::view-transition-new(root),
html[data-giris="batak"]::view-transition-new(root) {
  animation-name: kece-acilis;
}
@keyframes kece-cikis {
  to { opacity: 0; transform: scale(.96); filter: blur(4px); }
}
@keyframes kece-acilis {
  from { clip-path: circle(0% at 50% 42%); }
  to { clip-path: circle(140% at 50% 42%); }
}

html[data-giris="pisti"] body { view-transition-name: kart-pisti; }
html[data-giris="okey101"] body { view-transition-name: kart-okey; }
html[data-giris="batak"] body { view-transition-name: kart-batak; }
html[data-giris="kosu"] body { view-transition-name: kart-kosu; }

@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
  ::view-transition-old(root),
  ::view-transition-new(root) { animation: none !important; }
}