#hvd{padding:26px 0 10px}
.hvd-head{display:flex;align-items:flex-end;gap:12px;margin-bottom:14px}
.hvd-ht{min-width:0}
.hvd-title{font-size:22px;font-weight:800;margin:0;text-transform:none;display:flex;align-items:center;gap:8px;color:#111}
.hvd-ball{font-size:20px}
.hvd-sub{margin:3px 0 0;font-size:13.5px;color:#666}
.hvd-nav{margin-left:auto;display:flex;gap:8px;flex:0 0 auto}
.hvd-nav button{width:36px;height:36px;border-radius:50%;border:1px solid #ddd;background:#fff;font-size:22px;line-height:1;color:#333;cursor:pointer;padding:0}
.hvd-nav button:hover{border-color:#e01a22;color:#e01a22}
.hvd-track{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding-bottom:6px;scrollbar-width:none}
.hvd-track::-webkit-scrollbar{display:none}
.hvd-card{flex:0 0 calc((100% - 60px)/6);min-width:150px;scroll-snap-align:start}
.hvd-thumb{position:relative;display:block;width:100%;aspect-ratio:9/16;border-radius:12px;overflow:hidden;background:linear-gradient(160deg,#1b5e20,#0d2b10);cursor:pointer;border:0;padding:0}
.hvd-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}
.hvd-thumb:hover img{transform:scale(1.04)}
.hvd-thumb:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.72))}
.hvd-noimg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:46px;opacity:.35}
.hvd-play{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);width:50px;height:50px;border-radius:50%;background:rgba(224,26,34,.92);display:flex;align-items:center;justify-content:center;z-index:2;box-shadow:0 4px 14px rgba(0,0,0,.35);transition:transform .2s}
.hvd-thumb:hover .hvd-play{transform:translate(-50%,-50%) scale(1.08)}
.hvd-play:before{content:"";margin-left:4px;border-left:15px solid #fff;border-top:9px solid transparent;border-bottom:9px solid transparent}
.hvd-src{position:absolute;top:8px;left:8px;z-index:2;background:rgba(0,0,0,.55);color:#fff;font-size:11px;font-weight:700;border-radius:20px;padding:2px 8px}
.hvd-ep{position:absolute;top:8px;right:8px;z-index:2;background:#e01a22;color:#fff;font-size:11px;font-weight:800;border-radius:20px;padding:2px 8px}
.hvd-cap{position:absolute;left:10px;right:10px;bottom:10px;z-index:2;color:#fff;font-size:13.5px;font-weight:700;line-height:1.35;text-align:left;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-shadow:0 1px 3px rgba(0,0,0,.6)}
@media (max-width:991px){.hvd-card{flex-basis:calc((100% - 36px)/4)}}
@media (max-width:767px){#hvd{padding:18px 0 4px}.hvd-title{font-size:18px}.hvd-sub{font-size:12.5px}.hvd-nav{display:none}.hvd-card{flex-basis:42%;min-width:0}.hvd-cap{font-size:12.5px}}
/* trình xem kiểu TikTok: cuộn dọc, mỗi video 1 màn hình */
.hvx{position:fixed;inset:0;z-index:100000;display:none;background:#000;--sh:min(92vh,860px);--sw:calc(var(--sh)*.5625)}
.hvx.on{display:block}
.hvx-feed{position:absolute;inset:0;overflow-y:scroll;scroll-snap-type:y mandatory;overscroll-behavior:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.hvx-feed::-webkit-scrollbar{display:none}
.hvx-slide{position:relative;height:100vh;height:100dvh;scroll-snap-align:start;scroll-snap-stop:always;display:flex;align-items:center;justify-content:center}
.hvx-stage{position:relative;height:var(--sh);width:var(--sw);border-radius:14px;overflow:hidden;background:#111 center/cover no-repeat}
.hvx-media{position:absolute;inset:0;z-index:1}
.hvx-media iframe,.hvx-media .fb-video,.hvx-media .fb-video span,.hvx-media .fb-video span iframe{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;border:0}
.hvx-tap{position:absolute;inset:0;z-index:2;cursor:pointer;-webkit-tap-highlight-color:transparent}
.hvx-pz{position:absolute;left:50%;top:50%;width:74px;height:74px;margin:-37px 0 0 -37px;border-radius:50%;background:rgba(0,0,0,.45);display:none;align-items:center;justify-content:center;z-index:3;pointer-events:none}
.hvx-pz:before{content:"";margin-left:6px;border-left:24px solid #fff;border-top:15px solid transparent;border-bottom:15px solid transparent}
.hvx-slide.paused .hvx-pz{display:flex}
.hvx-mute{position:absolute;top:14px;left:50%;transform:translateX(-50%);z-index:4;display:none;border:0;border-radius:20px;background:rgba(0,0,0,.65);color:#fff;font-size:13.5px;font-weight:700;padding:8px 14px;white-space:nowrap;cursor:pointer}
.hvx.muted .hvx-slide.act .hvx-mute{display:block}
.hvx-info{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:40px 14px 16px;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.6));color:#fff;pointer-events:none}
.hvx-name{font-size:15px}
.hvx-ep{display:inline-block;margin-left:6px;background:#e01a22;border-radius:10px;padding:1px 7px;font-size:11px;font-weight:800;vertical-align:1px}
.hvx-cap{font-size:14px;line-height:1.4;margin:5px 0 6px;color:#eee;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hvx-ext{pointer-events:auto;color:#ccc!important;font-size:12px;text-decoration:underline!important}
.hvx-ui{position:absolute;inset:0;pointer-events:none;z-index:5}
.hvx-ui button{pointer-events:auto}
.hvx-top{position:absolute;top:18px;left:calc(50% + var(--sw)/2 + 14px);display:flex;flex-direction:column;align-items:center;gap:8px}
.hvx-count{color:#ddd;font-size:13px;font-weight:700;white-space:nowrap;order:2}
.hvx-close{width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.16);color:#fff;font-size:18px;cursor:pointer}
.hvx-close:hover{background:#e01a22}
.hvx-side{position:absolute;bottom:calc(50vh - var(--sh)/2);left:calc(50% + var(--sw)/2 + 14px);display:flex;flex-direction:column;gap:10px;align-items:center}
.hvx-side button{width:50px;height:50px;border-radius:50%;border:0;background:rgba(255,255,255,.16);color:#fff;font-size:16px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0}
.hvx-side button:hover{background:#e01a22}
.hvx-side button:disabled{opacity:.3;cursor:default;background:rgba(255,255,255,.16)}
.hvx-side span{display:none}
.hvx.muted .hvx-snd{background:#e01a22}
.hvx-hint{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);color:#fff;background:rgba(0,0,0,.55);border-radius:20px;padding:7px 14px;font-size:13px;font-weight:600;opacity:0;transition:opacity .4s;white-space:nowrap}
.hvx-hint.on{opacity:1;animation:hvxb 1.2s ease-in-out 3}
@keyframes hvxb{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,-8px)}}
@media (max-width:767px){
  .hvx{--sh:100dvh;--sw:100vw}
  .hvx-stage{height:100%;width:100%;border-radius:0}
  .hvx-info{padding:50px 76px calc(18px + env(safe-area-inset-bottom)) 12px}
  .hvx-top{left:auto;right:10px;top:calc(10px + env(safe-area-inset-top));flex-direction:row}
  .hvx-count{order:0;background:rgba(0,0,0,.45);border-radius:20px;padding:4px 10px}
  .hvx-close{width:40px;height:40px;background:rgba(0,0,0,.5)}
  .hvx-side{left:auto;right:8px;bottom:auto;top:50%;transform:translateY(-50%)}
  .hvx-side button{width:48px;height:48px;background:rgba(0,0,0,.5)}
  .hvx-side span{display:block;font-size:9px;margin-top:2px}
  .hvx-down,.hvx-snd{height:60px!important;border-radius:26px!important}
  .hvx-up{display:none!important}
  .hvx-hint{bottom:calc(90px + env(safe-area-inset-bottom))}
}
.hvx-back{position:absolute;top:18px;right:calc(50% + var(--sw)/2 + 14px);display:flex;align-items:center;gap:4px;height:42px;padding:0 16px 0 12px;border:0;border-radius:21px;background:#fff;color:#111;font-size:15px;font-weight:800;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.35);white-space:nowrap}
.hvx-back:hover{background:#e01a22;color:#fff}
@media (max-width:767px){.hvx-back{right:10px;left:auto;top:auto;bottom:calc(14px + env(safe-area-inset-bottom));height:46px;padding:0 18px 0 14px;font-size:15px;background:rgba(255,255,255,.96)}.hvx-info{padding-bottom:calc(72px + env(safe-area-inset-bottom))!important}.hvx-hint{bottom:calc(130px + env(safe-area-inset-bottom))!important}.hvx-close{display:none!important}.hvx-top{right:auto!important;left:50%!important;transform:translateX(-50%)}}
body.hvx-lock{overflow:hidden}