/* 爆款素材预览弹层 —— 配套 static/viral_preview.js */

.edvp-mask{
  position:fixed; inset:0; z-index:9000; display:none;
  align-items:center; justify-content:center;
  background:rgba(10,10,12,.82); backdrop-filter:blur(6px);
  padding:24px;
}
.edvp-mask.on{ display:flex; }

.edvp-box{
  position:relative; width:min(420px, 92vw);
  background:#101014; border-radius:16px; overflow:hidden;
  box-shadow:0 24px 64px rgba(0,0,0,.5);
}
/* 竖屏为主(TikTok/抖音/Shorts),9:16 能让绝大多数片子不留黑边 */
.edvp-stage{
  position:relative; aspect-ratio:9/16; max-height:78vh;
  background:#000; display:flex; align-items:center; justify-content:center;
}
.edvp-v, .edvp-f{
  width:100%; height:100%; display:block; border:0; background:#000;
}
.edvp-tip{
  position:absolute; left:0; right:0; bottom:50%; transform:translateY(50%);
  padding:0 28px; text-align:center; color:#D8D6CE;
  font-size:13.5px; line-height:1.7;
}
.edvp-tip.warn{ color:#F3B562; }

.edvp-x{
  position:absolute; right:10px; top:10px; z-index:3;
  width:32px; height:32px; border:none; border-radius:50%;
  background:rgba(24,23,19,.62); color:#fff; font-size:19px; line-height:1;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.edvp-x:hover{ background:rgba(24,23,19,.85); }

.edvp-bar{
  display:flex; align-items:center; gap:12px; padding:12px 14px;
  background:#17171B;
}
.edvp-t{
  flex:1; min-width:0; color:#E8E6E0; font-size:13px; line-height:1.5;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden;
}
.edvp-link{
  flex:none; color:#9DB4FF; font-size:12.5px; text-decoration:none;
  white-space:nowrap;
}
.edvp-link:hover{ text-decoration:underline; }

/* 卡片封面上的"可点"热区。默认只露一个淡淡的播放键,
   hover 才压暗 —— 别把封面本身盖住,用户是靠封面挑片的。 */
.edvp-hot{
  position:absolute; inset:0; z-index:2; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  background:transparent; transition:background .15s;
}
.edvp-hot:hover{ background:rgba(10,10,12,.28); }
.edvp-play{
  width:46px; height:46px; border-radius:50%;
  background:rgba(16,16,20,.55); color:#fff; font-size:16px;
  display:flex; align-items:center; justify-content:center;
  padding-left:3px; opacity:.82; transition:opacity .15s, transform .15s;
}
.edvp-hot:hover .edvp-play{ opacity:1; transform:scale(1.08); }
