:root{--card-radius:16px}
.adbox{border:1px dashed #aaa;padding:10px;border-radius:12px;background:#fafafa;overflow:auto}
.card{border-radius:var(--card-radius);overflow:hidden}
.card img{aspect-ratio:16/9;object-fit:cover}
.video-frame{aspect-ratio:16/9;width:100%;border:0;border-radius:16px;overflow:hidden}
.badge-tag{margin-right:.25rem}

.adbox{min-height:90px}
img{display:block}
.video-frame{background:#000}

/* V2.8.2 video page tweaks */
#descCollapse{max-height:420px;overflow:auto}

/* V2.9 UX */
body{padding-bottom:72px}
.mobile-bottom-nav{
  position:fixed;left:0;right:0;bottom:0;
  background:#fff;border-top:1px solid #e5e5e5;
  display:flex;justify-content:space-around;gap:6px;
  padding:8px 6px;z-index:1030
}
.mobile-bottom-nav .mob-item{
  text-decoration:none;color:#222;font-size:12px;
  display:flex;flex-direction:column;align-items:center;gap:2px;
  min-width:56px
}
.mobile-bottom-nav .mob-item span{font-size:11px;color:#666}
.card{transition:transform .12s ease, box-shadow .12s ease}
.card:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(0,0,0,.08)}
/* clamp titles */
.card .fw-semibold{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* theater mode */
body.theater-mode .container .row.g-3 > .col-lg-3{display:none}
body.theater-mode #playerWrap{max-width:1200px !important}

.mobile-bottom-nav .mob-item.active{color:#0d6efd}
.mobile-bottom-nav .mob-item.active span{color:#0d6efd}

.player-wrap{width:100%}
@media (max-width: 991px){ body.theater-mode .container .row.g-3 > .col-lg-3{display:block} }