/* preroll-ad.css — 连播前贴片视频广告（sq_ad 广告位 15）的展示层样式。
*
* 配套 web/static/web/js/modules/preroll-ad.js：用户连续进入下一个视频满 N 次后，
* 在进入下一个视频之前铺一层广告在播放器上，播完自动放行。DOM 由那个模块动态建，
* 不进模板 —— 它只在少数时刻出现，常驻模板里等于给每次渲染白背一段死 DOM。
*
* 【为什么单独一个文件、不写进 common.css】common.css 与 hg.css 是前端出包产物，
* 改了下次出包会被整份覆盖（两个 layout 的注释都反复强调过）。本文件由
* layouts/cyber-video.tpl 与 layouts/hg-play.tpl 各引一条 。
*
* 【挂载位置】广告层是**播放器挂载点 #cyberPlayer 的兄弟节点**，挂在它的父容器上：
* 桌面 .hg-web-play__viewport[data-web-play-viewport]、H5 .hg-play__media。
* 两者都是 position:relative 且尺寸恰好等于播放画面区，所以 inset:0 天然铺满播放器。
* 不能挂进 #cyberPlayer 内部：xgplayer 换源时会清空自己的容器，塞在里面会被一起清掉。
*/
/* z-index 30：要压过 H5 的中心播放钮(z-index 3)、水印与底部控制条，
同时留出 30 以上给全站弹层/抽屉，避免广告盖住登录框这类真正的模态。 */
.hg-preroll {
position: absolute;
inset: 0;
z-index: 30;
display: block;
overflow: hidden;
background: #000;
}
/* 加载态：DOM 已经就位但还没起播，此时必须完全不可见、也不可点 ——
* 用户看到的应该是正片继续放着，而不是一层等素材的黑屏。
* 起播（video 的 playing 事件）后由 JS 摘掉本类，广告才真正露面。
*
* 用 opacity 而不是 display:none / visibility:hidden：后两者会让元素脱离渲染，
* 部分浏览器（尤其 iOS Safari）对不渲染的