/* Shared video popup (player.js). Uses the page's tokens when present. */
#vtp{border:0;padding:0;background:transparent;color:#fff;max-width:none;max-height:none;overflow:visible}
#vtp[open]{position:fixed;inset:0;width:100vw;height:100dvh;display:grid;place-items:center}
#vtp::backdrop{background:rgba(3,5,9,.92);backdrop-filter:blur(10px)}
.vtp-wrap{position:relative;width:min(94vw,1180px,calc((100dvh - 170px) * var(--ar,1.7778)));animation:vtpIn .35s cubic-bezier(.2,.8,.2,1)}
@keyframes vtpIn{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
.vtp-x{position:absolute;top:-56px;right:0}
.vtp-stage{position:relative;aspect-ratio:var(--ar,1.7778);border-radius:16px;overflow:hidden;background:#000;border:1px solid rgba(99,180,236,.22);box-shadow:0 32px 90px rgba(0,0,0,.65),0 0 90px rgba(6,150,221,.18)}
.vtp-stage:fullscreen{border-radius:0;border:0;aspect-ratio:auto}
.vtp-stage iframe{position:absolute;left:0;top:-100px;width:100%;height:calc(100% + 200px);border:0;pointer-events:none}
.vtp-stage.vert .vtp-ctl{padding-top:26px}
.vtp-shield{position:absolute;inset:0;z-index:2;background:transparent;border:0;cursor:pointer;padding:0}
.vtp-flash{position:absolute;left:50%;top:50%;z-index:3;width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:50%;background:rgba(6,150,221,.85);display:grid;place-items:center;opacity:0;transform:scale(.6);pointer-events:none;transition:opacity .25s,transform .25s}
.vtp-flash svg{width:34px;height:34px;fill:#fff}
.vtp-stage.paused .vtp-flash{opacity:1;transform:scale(1)}
.vtp-ctl{position:absolute;left:0;right:0;bottom:0;z-index:4;display:flex;align-items:center;gap:12px;padding:34px 16px 12px;background:linear-gradient(transparent,rgba(0,0,0,.8));opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s}
.vtp-stage:hover .vtp-ctl,.vtp-stage.show .vtp-ctl,.vtp-stage.paused .vtp-ctl,.vtp-ctl:focus-within{opacity:1;transform:none}
.vtp-ctl button{background:none;border:0;color:#fff;cursor:pointer;width:34px;height:34px;display:grid;place-items:center;border-radius:8px;flex:none;transition:background .2s}
.vtp-ctl button:hover{background:rgba(255,255,255,.15)}
.vtp-ctl svg{width:20px;height:20px;fill:#fff}
.vtp-ctl svg.st{fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.vtp-time{font:600 13px/1 "Source Sans 3",sans-serif;color:#e8eef6;white-space:nowrap;min-width:92px}
.vtp-seek{flex:1;height:4px;-webkit-appearance:none;appearance:none;border-radius:2px;background:linear-gradient(90deg,#2EE6D6 var(--p,0%),rgba(255,255,255,.28) var(--p,0%));cursor:pointer;outline-offset:6px}
.vtp-seek::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(46,230,214,.3)}
.vtp-seek::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:50%;background:#fff}
.vtp-info{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:16px}
.vtp-meta{min-width:0}
.vtp-t{display:block;font:600 18px/1.3 "Source Sans 3",sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vtp-c{display:block;margin-top:2px;color:#9AA9BC;font-size:14px}
.vtp-act{display:flex;align-items:center;gap:10px;flex:none}
.vtp-copy{white-space:nowrap}
.vtp-copy.ok{background:rgba(74,222,128,.18);border-color:rgba(74,222,128,.55);color:#4ade80}
@media(max-width:700px){.vtp-wrap{width:min(96vw,calc((100dvh - 190px) * var(--ar,1.7778)))}.vtp-time{min-width:0;font-size:12px}.vtp-info{flex-wrap:wrap}.vtp-copy{order:3}}

.vtp-wrap.vert{width:min(94vw,max(300px,calc((100dvh - 260px) * var(--ar,.5625))))}
.vtp-wrap.vert .vtp-info{flex-wrap:wrap;gap:10px}.vtp-wrap.vert .vtp-t{white-space:normal}
.vtp-wrap.vert .vtp-time{min-width:0;font-size:12px}
@media(max-width:700px){.vtp-wrap.vert{width:min(94vw,max(280px,calc((100dvh - 250px) * var(--ar,.5625))))}}
