/* Full-screen video player (js/video.js). Minimal: black stage, one gold accent. */
html.vp-open{overflow:hidden}
.vp{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;
  background:#050608;color:#f3eee5;overflow:hidden;font:inherit}
.vp:not([open]){display:none}
.vp::backdrop{background:#050608}
.vp__stage{position:absolute;inset:0;display:grid;place-items:center}
.vp__video,.vp__frame{display:block;width:100%;height:100%;border:0;object-fit:contain;background:#000}
.vp__frame{position:absolute;inset:0}

/* entrance */
@media (prefers-reduced-motion:no-preference){
  .vp[open]{animation:vp-in .35s ease-out}
  .vp[open] .vp__stage>*{animation:vp-rise .55s cubic-bezier(.2,.8,.2,1)}
}
@keyframes vp-in{from{opacity:0}to{opacity:1}}
@keyframes vp-rise{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}

/* buttons */
.vp button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.vp svg{width:100%;height:100%;fill:currentColor}
.vp :focus-visible{outline:2px solid #f2cf7a;outline-offset:3px}
.vp__close{position:absolute;z-index:3;top:max(14px,env(safe-area-inset-top));right:max(14px,env(safe-area-inset-right));
  width:46px;height:46px;padding:12px;border-radius:50%;border:1px solid rgba(255,255,255,.18);
  background:rgba(12,13,16,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background .2s,border-color .2s,opacity .4s}
.vp__close:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.4)}

.vp__big{position:absolute;z-index:2;left:50%;top:50%;width:84px;height:84px;margin:-42px 0 0 -42px;padding:24px;border:0;border-radius:50%;
  background:rgba(217,171,74,.95);color:#17110a;box-shadow:0 0 0 10px rgba(217,171,74,.14),0 18px 50px -10px rgba(217,171,74,.6);
  transition:opacity .3s,transform .3s}
.vp__big:hover{transform:scale(1.06)}
.vp__big .i-play{transform:translateX(1.5px)}
.vp.is-playing .vp__big{opacity:0;transform:scale(.85);pointer-events:none}

/* icon switching */
.vp .i-pause,.vp .i-again,.vp .i-off{display:none}
.vp.is-playing .i-play{display:none}.vp.is-playing .i-pause{display:inline}
.vp.is-ended .i-play{display:none}.vp.is-ended .i-again{display:inline}
.vp.is-muted .i-on{display:none}.vp.is-muted .i-off{display:inline}

/* control bar */
.vp__bar{position:absolute;z-index:2;left:0;right:0;bottom:0;display:flex;align-items:center;gap:12px;
  padding:28px max(18px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));
  background:linear-gradient(to top,rgba(0,0,0,.72),rgba(0,0,0,0));transition:opacity .4s}
.vp__btn{flex:none;width:40px;height:40px;padding:9px;border:0;border-radius:50%;background:transparent;transition:background .2s}
.vp__btn:hover{background:rgba(255,255,255,.1)}
.vp__time{flex:none;min-width:2.6em;font-size:.82rem;font-variant-numeric:tabular-nums;color:rgba(243,238,229,.78)}
.vp__seek{flex:1;min-width:0;height:24px;margin:0;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer;--p:0%}
.vp__seek::-webkit-slider-runnable-track{height:3px;border-radius:3px;background:linear-gradient(to right,#d9ab4a var(--p),rgba(255,255,255,.22) var(--p))}
.vp__seek::-moz-range-track{height:3px;border-radius:3px;background:rgba(255,255,255,.22)}
.vp__seek::-moz-range-progress{height:3px;border-radius:3px;background:#d9ab4a}
.vp__seek::-webkit-slider-thumb{-webkit-appearance:none;width:13px;height:13px;margin-top:-5px;border-radius:50%;background:#f2cf7a;border:0;transition:transform .15s}
.vp__seek::-moz-range-thumb{width:13px;height:13px;border-radius:50%;background:#f2cf7a;border:0}
.vp__seek:hover::-webkit-slider-thumb{transform:scale(1.25)}

/* resting pointer while playing: only the picture stays */
.vp.is-idle .vp__bar,.vp.is-idle .vp__close{opacity:0}
.vp.is-idle{cursor:none}

/* loading ring */
.vp__spin{position:absolute;z-index:1;left:50%;top:50%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;
  border:2px solid rgba(255,255,255,.15);border-top-color:#d9ab4a;opacity:0;pointer-events:none;transition:opacity .2s}
.vp.is-loading .vp__spin{opacity:1;animation:vp-spin .9s linear infinite}
@keyframes vp-spin{to{transform:rotate(360deg)}}

/* coming soon / embedded player */
.vp__soon{display:none;max-width:22rem;padding:0 24px;text-align:center}
.vp__soon-icon{display:block;width:64px;height:64px;margin:0 auto 22px;padding:18px;border-radius:50%;
  border:1px solid rgba(217,171,74,.5);color:#d9ab4a;box-shadow:0 0 40px -8px rgba(217,171,74,.55)}
.vp__soon-icon svg{transform:translateX(1.5px)}
.vp__soon-title{margin:0 0 8px;font-family:"Fraunces",Georgia,serif;font-size:1.5rem;line-height:1.2}
.vp__soon-text{margin:0;color:rgba(243,238,229,.65);font-size:.95rem;line-height:1.5}
.vp[data-mode="soon"] .vp__soon{display:block}
.vp[data-mode="soon"] .vp__video,.vp[data-mode="soon"] .vp__big,.vp[data-mode="soon"] .vp__bar,
.vp[data-mode="frame"] .vp__video,.vp[data-mode="frame"] .vp__big,.vp[data-mode="frame"] .vp__bar{display:none}
.vp[data-mode="soon"] .vp__spin,.vp[data-mode="frame"] .vp__spin{display:none}

@media (max-width:479px){
  .vp__big{width:68px;height:68px;margin:-34px 0 0 -34px;padding:19px}
  .vp__bar{gap:6px}
  .vp__time{font-size:.74rem;min-width:2.3em}
}