/* The site's video player (themes/default/js/nsplayer.js): box around Video.js 10's skin, and the quality pill. */
.nsplayer { position: relative; width: 100%; background: #000; }
.nsplayer--fill { position: absolute; inset: 0; height: 100%; }
.nsplayer video-player { display: block; width: 100%; height: 100%; }
.nsplayer video-skin { display: block; }
/* the site's own big play button on an inline video: the new player has its own */
.nsplayer ~ .i_inline_play_overlay, .i_inline_video_shell:has(.nsplayer) .i_inline_play_overlay { display: none !important; }
.nsplayer video { width: 100%; max-height: 100%; }

.nsq { position: absolute; z-index: 40; top: 10px; left: 10px; font: 600 12.5px/1 system-ui, sans-serif; }
.nsq__btn { appearance: none; border: 0; cursor: pointer; padding: 7px 11px; border-radius: 999px; color: #fff; background: rgba(11, 11, 20, .62); backdrop-filter: blur(8px); box-shadow: 0 0 0 1px rgba(255, 255, 255, .14) inset; font: inherit; }
.nsq__btn:hover { background: rgba(11, 11, 20, .8); }
.nsq__menu { position: absolute; left: 0; top: calc(100% + 6px); min-width: 150px; padding: 6px; border-radius: 14px; background: rgba(17, 17, 32, .96); box-shadow: 0 14px 40px rgba(0, 0, 0, .5), 0 0 0 1px rgba(255, 255, 255, .1) inset; display: flex; flex-direction: column; gap: 2px; }
.nsq__menu[hidden] { display: none; }
.nsq__item { appearance: none; border: 0; cursor: pointer; text-align: left; padding: 10px 12px; border-radius: 10px; color: #eef0f8; background: transparent; font: inherit; }
.nsq__item:hover { background: rgba(255, 255, 255, .08); }
.nsq__item.is-on { background: linear-gradient(120deg, rgba(166, 120, 255, .45), rgba(255, 106, 213, .35)); color: #fff; }

/* locked video posts: the 5-second preview and the "locked" card (js/lockPreview.js, requests/post_preview.php) */
.lockprev__go { position: absolute; z-index: 30; left: 50%; bottom: 16px; transform: translateX(-50%); appearance: none; border: 0; cursor: pointer; padding: 11px 18px; border-radius: 999px; color: #fff; background: linear-gradient(120deg, #a678ff, #ff6ad5); box-shadow: 0 8px 26px rgba(0, 0, 0, .45); font: 700 14px/1 system-ui, sans-serif; white-space: nowrap; }
.lockprev__box { position: absolute; z-index: 31; inset: 0; background: #000; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.lockprev__video { width: 100%; height: 100%; object-fit: contain; background: #000; }
.lockprev__tag { position: absolute; top: 12px; left: 12px; padding: 6px 11px; border-radius: 999px; background: rgba(11, 11, 20, .72); color: #fff; font: 700 12px/1 system-ui, sans-serif; letter-spacing: .03em; }
.lockprev__bar { position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: rgba(255, 255, 255, .18); }
.lockprev__bar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #a678ff, #ff6ad5); }
.lockprev__end { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 22px; text-align: center; color: #eef0f8; background: radial-gradient(500px 300px at 50% 0, rgba(166, 120, 255, .35), transparent 70%), rgba(11, 11, 20, .96); font-family: system-ui, sans-serif; }
.lockprev__end b { font-size: 20px; }
.lockprev__end span { color: #b9bdd3; font-size: 14px; max-width: 280px; line-height: 1.4; }
.lockprev__lock { font-size: 38px; line-height: 1; }
.lockprev__btn { margin-top: 10px; appearance: none; border: 0; cursor: pointer; padding: 12px 20px; border-radius: 14px; color: #fff; background: linear-gradient(120deg, #a678ff, #ff6ad5); font: 700 14px/1 system-ui, sans-serif; }