/* Revize 7 · madde 86 — püf detayındaki eski video, Video Mutfağı'nın kartı ve oynatıcı penceresiyle.
   Kurallar `/varliklar/reference/video-mutfagi/video-mutfagi.css`ten BİREBİR alındı (kart: satır 6–10,
   pencere: satır 31–40). O dosya püf detayında yüklenmiyor ve tamamı yüklenemez: aynı adlı genel
   seçicileri (`.chip`, `.row-track`, mobil `.vid-card{width:80vw}` …) püf sayfasına taşırdı.
   Belirteçler (`--radius-lg`, `--tomato`, `--sh-*`, `--ease`) ve `fadeUp` iki sayfanın da yüklediği
   `tokens-*.css` / `portal-*.css`ten gelir. */

/* ── Kart (video-mutfagi.css 6–10) ─────────────────────────────── */
.vid-card{cursor:pointer}
.vid-thumb{position:relative;height:230px;border-radius:var(--radius-lg);overflow:hidden;background-size:cover;background-position:center;box-shadow:var(--sh-sm)}
.vid-thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(33,30,22,0) 50%,rgba(20,18,12,.72))}
.vid-thumb .play{position:absolute;inset:0;margin:auto;width:60px;height:60px;border-radius:var(--radius-circle);background:rgba(255,255,255,.92);color:var(--tomato);display:grid;place-items:center;font-size:19px;z-index:2;transition:.25s var(--ease);box-shadow:var(--sh-md)}
.vid-card:hover .play{transform:scale(1.12);background:var(--tomato);color:#fff}

/* ── Pencere (video-mutfagi.css 31–40) ─────────────────────────── */
.video-modal{
  position:fixed;inset:0;z-index:101;background:rgba(20,18,12,.92);
  display:grid;place-items:center;padding:30px;
  opacity:0;visibility:hidden;transition:opacity .25s var(--ease),visibility .25s;
}
.video-modal.open{opacity:1;visibility:visible}
.vm-frame{width:min(960px,94vw);aspect-ratio:16/9;background:#000;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--sh-lg);animation:fadeUp .25s var(--ease)}
.vm-frame video{width:100%;height:100%;object-fit:contain;display:block}
.vm-title{position:absolute;top:26px;left:30px;font-size:13px;font-weight:700;color:rgba(255,255,255,.85)}
@media (max-width:640px){.video-modal{padding:14px}.vm-title{display:none}}

/* ── Püf detayına özgü (eklendi) ───────────────────────────────── */
/* Sağlayıcı çerçevesi: Video Mutfağı bunu satır içi `style` ile veriyor; burada kural olarak. */
.vm-frame iframe{width:100%;height:100%;border:0;display:block}
/* `hidden` gerçekten gizlesin. `.vm-frame video{display:block}` (0,1,1) `[hidden]{display:none}`i (0,1,0)
   eziyor: YouTube/Vimeo açılınca boş <video> çerçeveyi dolduruyor ve sağlayıcı çerçevesi kırpılan alanın
   ALTINA itiliyordu (ölçüldü: /video-mutfagi'de de aynı — çerçeve üstü 773, kap altı 773). */
.vm-frame video[hidden],.vm-frame iframe[hidden]{display:none}
/* Kart, yerini aldığı gömülü videonun (`.icerik-video`, f6/icerik-bloklari.css) kutusunu korur:
   tam genişlik, 16:9, üst/alt 24px. Video Mutfağı ızgarasındaki sabit 230px yükseklik makale
   sütununda şerit gibi kalırdı. */
.puf-video{margin:24px 0}
.puf-video .vid-thumb{height:auto;aspect-ratio:16/9;background-color:var(--slate)}
/* Kapak satır içi `background-image` yerine gerçek görsel: yasak satır içi stil yok. */
.puf-video .vid-thumb > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.puf-video:focus-visible{outline:2px solid var(--tomato);outline-offset:3px;border-radius:var(--radius-lg)}
.puf-video:focus-visible .play{transform:scale(1.12);background:var(--tomato);color:#fff}