/* Zack videos (1.9.3) */
.zv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 18px 14px; }
.zv-grid--strip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 700px) { .zv-grid--strip { grid-template-columns: repeat(2, minmax(0, 1fr)); } .zv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 10px; } }
.zv-card { margin: 0; display: flex; flex-direction: column; gap: 8px; }
.zv-card[hidden] { display: none; }
.zv-play { position: relative; display: block; aspect-ratio: 9 / 16; overflow: hidden; border: 2px solid var(--ink, #141311); background: var(--ink, #141311); box-shadow: 4px 4px 0 var(--ink, #141311); transition: transform .15s ease, box-shadow .15s ease; }
.zv-play:hover, .zv-play:focus-visible { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--red, #a3271f); }
.zv-play img { width: 100%; height: 100%; object-fit: cover; display: block; }
.zv-btn { position: absolute; left: 50%; top: 50%; width: 58px; height: 58px; margin: -29px 0 0 -29px; border-radius: 50%; background: rgba(20, 19, 17, .82); border: 3px solid #fff; }
.zv-btn::after { content: ""; position: absolute; left: 21px; top: 15px; border-left: 19px solid #fff; border-top: 11px solid transparent; border-bottom: 11px solid transparent; }
.zv-dur { position: absolute; right: 8px; bottom: 8px; background: rgba(20, 19, 17, .85); color: #fff; font: 400 .7rem/1 var(--f-type, monospace); padding: 4px 6px; letter-spacing: .06em; }
.zv-card figcaption { display: grid; gap: 3px; }
.zv-series { font: 400 .64rem/1.2 var(--f-type, monospace); letter-spacing: .1em; color: var(--red, #a3271f); }
.zv-title { font: 900 1rem/1.2 var(--f-head, Georgia, serif); color: var(--ink, #141311); }
.zv-card--big { max-width: 320px; }
.zv-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 22px; }
.zv-f { font: 400 .72rem/1 var(--f-type, monospace); letter-spacing: .08em; padding: 10px 12px 9px; border: 1.5px solid var(--ink, #141311); background: transparent; color: var(--ink, #141311); cursor: pointer; }
.zv-f.is-on { background: var(--ink, #141311); color: var(--paper, #efe9dc); }
.zv-more { margin-top: 26px; font: 400 .85rem var(--f-type, monospace); letter-spacing: .04em; }
.zv-strip__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 0 0 16px; flex-wrap: wrap; }
.zv-strip__h { font: 900 clamp(1.5rem, 4vw, 2.2rem)/1.1 var(--f-head, Georgia, serif); margin: 0; }
.zv-strip__all { font: 400 .78rem var(--f-type, monospace); letter-spacing: .08em; }
.zv-slang .zv-card { margin-top: 10px; }
.zv-modal { position: fixed; inset: 0; z-index: 300; background: rgba(10, 10, 9, .88); display: flex; align-items: center; justify-content: center; padding: 16px; }
.zv-modal[hidden] { display: none; }
.zv-modal__in { position: relative; height: min(86vh, 860px); aspect-ratio: 9 / 16; max-width: 100%; display: flex; flex-direction: column; }
.zv-frame { flex: 1; background: #000; border: 2px solid #fff; }
.zv-frame iframe { width: 100%; height: 100%; border: 0; display: block; }
.zv-x { position: absolute; top: -14px; right: -14px; width: 40px; height: 40px; border-radius: 50%; border: 2px solid #fff; background: var(--red, #a3271f); color: #fff; font: 700 1.5rem/1 sans-serif; cursor: pointer; z-index: 2; }
.zv-yt { margin-top: 10px; text-align: center; color: #fff !important; font: 400 .78rem var(--f-type, monospace); letter-spacing: .08em; }
.zv-lock, .zv-lock body { overflow: hidden; }
@media (max-width: 560px) { .zv-modal__in { height: auto; width: 100%; } .zv-frame { aspect-ratio: 9 / 16; flex: none; } .zv-x { top: -10px; right: -6px; } }
@media (prefers-reduced-motion: reduce) { .zv-play { transition: none; } }
