/* ============ COVER FIT — Netflix-style blurred background ============
   Boşluk yerine aynı resmin bulanık versiyonu fill eder.
   ÖNEMLİ: Bu kurallar SADECE covers/covers-wide/classic view'larında geçerli.
   Titles view'ın kendi popup mantığı vardır (card.css'te) — ona dokunma. */

/* Container — overflow hidden zaten card.css'te, position:relative de orada */
.grid:not(.view-titles) .card .thumb{
  background:var(--bg-2);
}

/* Bulanık arka plan — aynı resim, blur + saturate, foreground'un arkasında */
.grid:not(.view-titles) .card .thumb-img-bg{
  position:absolute;
  inset:-12px;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  filter:blur(28px) saturate(1.3);
  opacity:.5;
  z-index:0;
  pointer-events:none;
  will-change:filter;
}
/* Titles view'da blur bg'i tamamen gizle (popup'ta gereksiz) */
.grid.view-titles .card .thumb-img-bg{display:none}

/* Foreground resim — base konum: top-aligned, doğal yükseklik */
.grid:not(.view-titles) .card .thumb-img{
  position:absolute !important;
  top:0;left:0;
  width:100%;height:auto;
  display:block;
  z-index:1;
  transform:translateY(0);
  transition:transform 3.5s ease-out;
  will-change:transform;
}

/* Kısa resim — dikey ortala, blur bg üst+alt boşluğu kapatır */
.grid:not(.view-titles) .card.is-short .thumb-img{
  top:50% !important;
  transform:translateY(-50%) !important;
  transition:none !important;
}

/* Uzun resim — pan-on-hover, top-aligned'den yukarı kayar */
.grid:not(.view-titles) .card.is-pannable:hover .thumb-img{
  transform:translateY(var(--pan-y, 0));
}

/* Eski is-short davranışını (img üzerinde object-fit:cover) iptal et */
.grid:not(.view-titles) .card .thumb-img.is-short{
  width:100% !important;
  height:auto !important;
  object-fit:initial !important;
}