/* TEVEL minimal video player (Vimeo-style). Markup: <figure class="vp" data-vp> <video> … </figure>, controls built by vplayer.js.
   The control bar is always LTR so the progress runs left to right on Hebrew pages too. */
.vp{position:relative;overflow:hidden;background:#0E1F43;-webkit-tap-highlight-color:transparent}
.vp video{display:block;width:100%;height:100%;object-fit:cover;cursor:pointer}
.vp.vp-idle.vp-playing,.vp.vp-idle.vp-playing video{cursor:none}
.vp:fullscreen,.vp:-webkit-full-screen{background:#000;border-radius:0}
.vp:fullscreen video,.vp:-webkit-full-screen video{object-fit:contain}

.vp-bar{position:absolute;left:0;right:0;bottom:0;direction:ltr;display:flex;align-items:center;gap:4px;padding:0 8px;height:46px;
  background:rgba(8,22,49,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;
  font:500 14px/1 Heebo,system-ui,sans-serif;transition:opacity .35s ease,transform .35s ease}
.vp.vp-idle.vp-playing .vp-bar{opacity:0;transform:translateY(8px);pointer-events:none}
.vp-btn{flex:0 0 auto;width:40px;height:40px;display:grid;place-items:center;border:0;background:none;color:#fff;border-radius:8px;cursor:pointer;padding:0}
.vp-btn:hover{background:rgba(255,255,255,.12)}
.vp-btn:focus-visible,.vp-track:focus-visible,.vp-vol input:focus-visible{outline:2px solid #fff;outline-offset:1px}
.vp-btn svg{width:20px;height:20px;display:block}
.vp-time{flex:0 0 auto;min-width:86px;text-align:center;font-variant-numeric:tabular-nums;letter-spacing:.02em;opacity:.95;white-space:nowrap}

.vp-track{position:relative;flex:1 1 auto;height:28px;display:flex;align-items:center;cursor:pointer;touch-action:none;margin:0 6px}
.vp-rail{position:relative;width:100%;height:4px;border-radius:2px;background:rgba(255,255,255,.25);overflow:hidden;transition:height .15s}
.vp-track:hover .vp-rail,.vp-track.vp-drag .vp-rail{height:6px}
.vp-buf,.vp-fill{position:absolute;left:0;top:0;bottom:0;width:0}
.vp-buf{background:rgba(255,255,255,.3)}
.vp-fill{background:#fff}

.vp-vol{display:flex;align-items:center}
.vp-vol input{width:0;opacity:0;transition:width .2s,opacity .2s;accent-color:#fff;height:4px;margin:0;cursor:pointer}
.vp-vol:hover input,.vp-vol:focus-within input{width:72px;opacity:1;margin:0 6px 0 2px}

@media (hover:none),(max-width:600px){
  .vp-bar{height:52px;padding:0 6px;gap:2px}
  .vp-btn{width:44px;height:44px}
  .vp-time{min-width:0;font-size:13px;padding:0 2px}
  .vp-vol input{display:none}
}
@media (prefers-reduced-motion:reduce){.vp-bar,.vp-rail,.vp-vol input{transition:none}}