/* Velox player — no library, no external assets. Loaded only on video pages. */

.vxp{
position:relative;width:100%;aspect-ratio:16/9;background:#000;
border:1px solid var(--vx-border);border-radius:var(--vx-radius);
overflow:hidden;user-select:none;
}
.vxp video{width:100%;height:100%;display:block;background:#000}

/* poster + play overlay */
.vxp-overlay{
position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
background:center/cover no-repeat;cursor:pointer;
}
.vxp.is-started .vxp-overlay{display:none}
.vxp-play{
width:74px;height:74px;border:0;border-radius:50%;
background:var(--vx-primary);color:#000;
display:flex;align-items:center;justify-content:center;
box-shadow:0 0 34px rgba(0,0,0,.6);transition:transform .2s;
}
.vxp-play:hover{transform:scale(1.08)}
.vxp-play svg{width:30px;height:30px;margin-left:4px}

/* spinner */
.vxp-spinner{
position:absolute;top:50%;left:50%;width:42px;height:42px;margin:-21px 0 0 -21px;
border:3px solid rgba(255,255,255,.2);border-top-color:var(--vx-primary);
border-radius:50%;animation:vxp-spin .8s linear infinite;display:none;
}
.vxp.is-loading .vxp-spinner{display:block}
@keyframes vxp-spin{to{transform:rotate(360deg)}}

/* controls */
.vxp-controls{
position:absolute;left:0;right:0;bottom:0;padding:0 10px 7px;
background:linear-gradient(transparent,rgba(0,0,0,.85));
opacity:0;transition:opacity .2s;pointer-events:none;
}
.vxp.is-started .vxp-controls{pointer-events:auto}
.vxp.is-started.is-active .vxp-controls,
.vxp.is-started.is-paused .vxp-controls{opacity:1}

/* seek bar */
.vxp-seek{position:relative;height:18px;display:flex;align-items:center;cursor:pointer}
.vxp-track{position:relative;width:100%;height:4px;border-radius:4px;background:rgba(255,255,255,.25)}
.vxp-buffered{position:absolute;inset:0 auto 0 0;width:0;border-radius:4px;background:rgba(255,255,255,.35)}
.vxp-played{position:absolute;inset:0 auto 0 0;width:0;border-radius:4px;background:var(--vx-primary)}
.vxp-knob{
position:absolute;top:50%;left:0;width:12px;height:12px;margin:-6px 0 0 -6px;
border-radius:50%;background:var(--vx-primary);opacity:0;transition:opacity .15s;
}
.vxp-seek:hover .vxp-knob{opacity:1}
.vxp-seek:hover .vxp-track{height:6px}
.vxp-tip{
position:absolute;bottom:22px;transform:translateX(-50%);padding:2px 7px;border-radius:3px;
background:rgba(0,0,0,.9);font-size:11px;font-variant-numeric:tabular-nums;
opacity:0;pointer-events:none;white-space:nowrap;
}
.vxp-seek:hover .vxp-tip{opacity:1}

/* button row */
.vxp-row{display:flex;align-items:center;gap:4px;height:38px}
.vxp-btn{
display:flex;align-items:center;justify-content:center;
width:36px;height:36px;border:0;background:none;color:#fff;border-radius:4px;
}
.vxp-btn:hover{background:rgba(255,255,255,.14)}
.vxp-btn svg{width:20px;height:20px;pointer-events:none}
.vxp-time{
margin-left:4px;font-size:12.5px;font-variant-numeric:tabular-nums;
color:#fff;white-space:nowrap;
}
.vxp-spacer{flex:1}

/* volume */
.vxp-vol{display:flex;align-items:center}
.vxp-vol-slider{
width:0;height:4px;margin:0;border-radius:4px;overflow:hidden;
background:rgba(255,255,255,.3);appearance:none;
transition:width .2s,margin .2s;cursor:pointer;
}
.vxp-vol:hover .vxp-vol-slider{width:66px;margin:0 8px 0 2px}
.vxp-vol-slider::-webkit-slider-thumb{
appearance:none;width:11px;height:11px;border-radius:50%;background:var(--vx-primary);
}
.vxp-vol-slider::-moz-range-thumb{
width:11px;height:11px;border:0;border-radius:50%;background:var(--vx-primary);
}

/* quality menu */
.vxp-quality{position:relative}
.vxp-quality-btn{
padding:0 9px;width:auto;min-width:36px;font-size:12px;font-weight:700;letter-spacing:.02em;
}
.vxp-menu{
position:absolute;right:0;bottom:42px;min-width:104px;padding:5px;
background:rgba(16,16,16,.97);border:1px solid var(--vx-border);border-radius:6px;
display:none;
}
.vxp-quality.is-open .vxp-menu{display:block}
.vxp-menu button{
display:block;width:100%;padding:7px 11px;border:0;background:none;
color:#fff;font-size:13px;text-align:left;border-radius:4px;
}
.vxp-menu button:hover{background:rgba(255,255,255,.12)}
.vxp-menu button[aria-checked="true"]{color:var(--vx-primary);font-weight:700}

/* icon visibility toggles */
.vxp .i-pause,.vxp .i-mute,.vxp .i-exit{display:none}
.vxp.is-playing .i-play{display:none}
.vxp.is-playing .i-pause{display:block}
.vxp.is-muted .i-volume{display:none}
.vxp.is-muted .i-mute{display:block}
.vxp.is-fullscreen .i-full{display:none}
.vxp.is-fullscreen .i-exit{display:block}

.vxp:fullscreen{border:0;border-radius:0;aspect-ratio:auto;height:100%}

@media(max-width:640px){
.vxp-play{width:60px;height:60px}
.vxp-play svg{width:24px;height:24px}
.vxp-row{height:34px;gap:0}
.vxp-btn{width:32px;height:32px}
.vxp-time{font-size:11.5px}
.vxp-vol:hover .vxp-vol-slider{width:0;margin:0}
}

/* Quality button holds "AUTO 720p" while adaptive switching is on. */
.vxp-quality[hidden]{display:none}
.vxp-quality-btn{white-space:nowrap}