/*
Theme Name: Xhmaster Reels
Theme URI: http://localhost/
Author: Xhmaster
Description: Mobile-first reels homepage theme.
Version: 10.9
Text Domain: xhmaster
*/
:root{--bg:#0b0b0d;--panel:#151518;--text:#f5f5f5;--muted:#aaa;--line:#29292e;--accent:#ff2d55}
*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif}
a{color:inherit;text-decoration:none}.xh-wrap{width:min(1180px,100%);margin:auto;padding:0 16px}
.xh-header{position:sticky;top:0;z-index:50;background:rgba(11,11,13,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
.xh-top{height:70px;display:flex;align-items:center;gap:22px}.xh-logo{font-size:27px;font-weight:900;letter-spacing:-1px;white-space:nowrap}
.xh-logo span{color:var(--accent)}.xh-search{flex:1;max-width:590px;position:relative}.xh-search input{width:100%;height:42px;border:1px solid var(--line);border-radius:22px;background:#202024;color:#fff;padding:0 45px 0 18px;outline:none;font-size:15px}
.xh-search button{position:absolute;right:5px;top:5px;width:32px;height:32px;border:0;border-radius:50%;background:transparent;color:#ddd;font-size:18px;cursor:pointer}
.xh-menu{border-top:1px solid #18181b}.xh-menu-inner{display:flex;gap:9px;overflow-x:auto;padding:10px 16px;scrollbar-width:none}.xh-menu-inner::-webkit-scrollbar{display:none}
.xh-chip{white-space:nowrap;background:#1b1b1f;border:1px solid var(--line);border-radius:18px;padding:7px 13px;font-size:13px}.xh-chip:hover{background:#29292f}
.xh-main{padding-top:22px;padding-bottom:50px}.xh-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:15px}.xh-heading h1{font-size:22px;margin:0}.xh-heading small{color:var(--muted)}
.xh-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.xh-card{min-width:0}.xh-thumb{position:relative;aspect-ratio:9/14;background:#1a1a1e;border-radius:12px;overflow:hidden;border:1px solid #232329}
.xh-thumb img{width:100%;height:100%;object-fit:cover;display:block}.xh-placeholder{height:100%;display:grid;place-items:center;background:linear-gradient(145deg,#1a1a1f,#28282e);font-size:44px}
.xh-play{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(transparent 55%,rgba(0,0,0,.65))}
.xh-play span{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:rgba(0,0,0,.62);font-size:20px;padding-left:3px}
.xh-stats{position:absolute;left:10px;bottom:9px;font-size:12px;font-weight:700;text-shadow:0 1px 4px #000}.xh-title{font-size:14px;font-weight:700;line-height:1.35;margin:8px 3px 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.xh-meta{font-size:12px;color:var(--muted);margin:0 3px}
.xh-empty{grid-column:1/-1;border:1px dashed #34343a;border-radius:14px;padding:40px 18px;text-align:center;color:#bbb}.xh-empty strong{display:block;color:#fff;font-size:18px;margin-bottom:7px}
@media(min-width:760px){.xh-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.xh-thumb{aspect-ratio:9/13}.xh-title{font-size:15px}}
@media(max-width:620px){.xh-wrap{padding:0 10px}.xh-top{height:auto;min-height:62px;gap:10px;flex-wrap:wrap;padding:10px 0}.xh-logo{font-size:23px}.xh-search{order:2;flex-basis:100%;max-width:none}.xh-menu-inner{padding-left:10px;padding-right:10px}.xh-main{padding-top:17px}.xh-grid{gap:10px}.xh-thumb{border-radius:9px}}

/* v1.2 demo reels + bottom navigation */
body{padding-bottom:76px}
.xh-demo-video{width:100%;height:100%;object-fit:cover;display:block;background:#111}
.xh-thumb:hover .xh-demo-video{filter:brightness(.92)}
.xh-bottom-nav{position:fixed;z-index:100;left:50%;bottom:0;transform:translateX(-50%);width:min(620px,100%);height:64px;background:rgba(15,15,18,.97);border:1px solid #2b2b31;border-bottom:0;border-radius:18px 18px 0 0;display:grid;grid-template-columns:repeat(3,1fr);backdrop-filter:blur(14px);box-shadow:0 -8px 30px rgba(0,0,0,.25)}
.xh-bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:12px;font-weight:700;color:#aaa}
.xh-bottom-nav a:hover,.xh-bottom-nav a.is-active{color:#fff}
.xh-bottom-nav .ico{font-size:20px;line-height:1}
.xh-bottom-nav .live-dot{color:#ff2d55}
@media(min-width:900px){body{padding-bottom:84px}.xh-bottom-nav{bottom:14px;border-bottom:1px solid #2b2b31;border-radius:18px}}

/* v1.4 premium reels */
.xh-header{background:#0a0a0c}
.xh-top{justify-content:space-between}
.xh-logo{font-size:30px}
.xh-menu{background:#101013}
.xh-menu-inner{gap:10px;padding-top:11px;padding-bottom:11px}
.xh-chip{display:flex;align-items:center;gap:6px;background:#18181c;border-color:#303038;font-weight:700;padding:8px 14px}
.xh-chip:first-child{background:#fff;color:#111;border-color:#fff}
.xh-heading{margin-top:4px;margin-bottom:17px}
.xh-heading h1{font-size:24px}
.xh-grid{gap:14px 12px}
.xh-card{background:#141417;border:1px solid #26262c;border-radius:14px;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.18);transition:transform .18s ease,border-color .18s ease}
.xh-card:hover{transform:translateY(-2px);border-color:#3a3a43}
.xh-thumb{border:0;border-radius:0;aspect-ratio:9/13;background:#050506}
.xh-demo-video{background:linear-gradient(145deg,#18181d,#050506)}
.xh-play{background:linear-gradient(transparent 48%,rgba(0,0,0,.72))}
.xh-play span{width:52px;height:52px;background:rgba(255,255,255,.92);color:#111;box-shadow:0 5px 22px rgba(0,0,0,.35)}
.xh-stats{left:9px;bottom:9px;background:rgba(0,0,0,.66);padding:5px 8px;border-radius:12px}
.xh-card-info{padding:10px 10px 11px}
.xh-card-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.xh-title{margin:0;font-size:14px}
.xh-demo-badge{flex:none;font-size:10px;font-weight:800;letter-spacing:.4px;background:#25252b;color:#ddd;border:1px solid #383840;padding:4px 6px;border-radius:7px}
.xh-meta{margin:5px 0 0}
.xh-section-tabs{display:flex;gap:8px;overflow:auto;margin:0 0 16px;scrollbar-width:none}
.xh-section-tabs::-webkit-scrollbar{display:none}
.xh-section-tab{white-space:nowrap;padding:8px 13px;border-radius:9px;background:#17171b;border:1px solid #292930;color:#bbb;font-size:12px;font-weight:700}
.xh-section-tab.active{background:#ff2d55;color:#fff;border-color:#ff2d55}
@media(max-width:620px){
 .xh-logo{font-size:26px}
 .xh-card{border-radius:11px}
 .xh-grid{gap:10px 8px}
 .xh-card-info{padding:8px}
 .xh-title{font-size:13px}
 .xh-play span{width:44px;height:44px}
}

/* v1.5 compact mobile header */
.xh-header{position:sticky;top:0;z-index:110;background:#0b0b0e;border-bottom:1px solid #202027}
.xh-topbar{height:58px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.xh-logo{font-size:25px;line-height:1;font-weight:900;letter-spacing:-1px}
.xh-logo span{color:#ff2d55}
.xh-header-actions{margin-left:auto;display:flex;align-items:center;gap:7px}
.xh-icon-btn{width:38px;height:38px;border:1px solid #2e2e35;border-radius:10px;background:#18181c;color:#fff;display:grid;place-items:center;font-size:23px;cursor:pointer;padding:0}
.xh-icon-btn:active{transform:scale(.96)}
.xh-menu-btn{gap:4px;align-content:center}
.xh-menu-btn span{display:block;width:17px;height:2px;background:#fff;border-radius:5px}
.xh-search-drop{display:none;padding:0 0 10px}
.xh-search-drop.is-open{display:block}
.xh-search-drop form{display:flex;gap:7px;background:#151519;border:1px solid #2d2d34;padding:6px;border-radius:11px}
.xh-search-drop input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:#fff;padding:7px 8px;font-size:14px}
.xh-search-drop button{border:0;border-radius:8px;background:#ff2d55;color:#fff;font-weight:800;padding:0 14px;cursor:pointer}
.xh-mobile-menu{display:none;border-top:1px solid #202027;background:#101013}
.xh-mobile-menu.is-open{display:block}
.xh-mobile-menu-inner{padding-top:7px;padding-bottom:9px;display:grid;grid-template-columns:1fr 1fr;gap:7px}
.xh-mobile-menu a{padding:10px 12px;border-radius:9px;background:#18181c;border:1px solid #292930;color:#e7e7e9;font-size:13px;font-weight:700}
.xh-feature-nav{border-top:1px solid #202027;background:#111115}
.xh-feature-inner{height:52px;display:grid;grid-template-columns:.72fr 1.45fr 1.15fr;gap:7px;align-items:center}
.xh-feature-item{height:36px;min-width:0;border:1px solid #2b2b32;border-radius:9px;background:#18181d;color:#e9e9eb;display:flex;align-items:center;justify-content:center;gap:6px;font-size:12px;font-weight:800;white-space:nowrap;padding:0 8px}
.xh-feature-icon{font-size:14px}
.xh-live-item .xh-feature-icon{color:#ff2d55}
.xh-premium-item .xh-feature-icon{color:#ffd15c}
.xh-feature-item:hover{border-color:#484852;background:#202026}
@media(min-width:760px){
 .xh-topbar{height:66px}
 .xh-logo{font-size:29px}
 .xh-icon-btn{width:41px;height:41px}
 .xh-search-drop{max-width:1180px}
 .xh-mobile-menu-inner{grid-template-columns:repeat(5,1fr)}
 .xh-feature-inner{display:flex;height:56px}
 .xh-feature-item{padding:0 18px}
}
@media(max-width:390px){
 .xh-feature-inner{gap:5px}
 .xh-feature-item{font-size:11px;padding:0 5px}
 .xh-logo{font-size:23px}
}

/* v1.6 requested charcoal background */
html, body,
body,
.xh-main {
  background: #202020 !important;
}
.xh-header {
  background: #202020 !important;
}
.xh-feature-nav,
.xh-mobile-menu {
  background: #202020 !important;
}

.xh-reel-link{display:block;color:inherit;text-decoration:none}
.xh-reel-link:visited{color:inherit}
.xh-reel-link .xh-thumb{cursor:pointer}

/* v1.9 poster fallback */
.xh-demo-video{background:#2a2a2a}

.xh-reel-poster{width:100%;height:100%;object-fit:cover;display:block}.xhr-views{cursor:default}.xhr-sound .xhr-circle{font-size:20px}

/* v2.2 larger edge-to-edge homepage cards */
.xh-main{width:100%!important;max-width:none!important;padding-left:5px!important;padding-right:5px!important}
.xh-heading{margin:12px 3px 9px!important}
.xh-heading h1{font-size:20px!important;margin:0!important}
.xh-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:5px!important}
.xh-card{position:relative!important;border-radius:8px!important;border:0!important;background:#151515!important;overflow:hidden!important;box-shadow:none!important}
.xh-card:hover{transform:none!important}
.xh-thumb{position:relative!important;aspect-ratio:9/13!important;border-radius:8px!important;overflow:hidden!important}
.xh-reel-poster,.xh-demo-video{width:100%!important;height:100%!important;object-fit:cover!important}
.xh-card-overlay{position:absolute;z-index:5;left:0;right:0;bottom:0;padding:30px 7px 7px;background:linear-gradient(transparent,rgba(0,0,0,.84))}
.xh-card-overlay .xh-title{font-size:12px!important;font-weight:800!important;line-height:1.25!important;color:#fff!important;margin:0!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.xh-stats{font-size:10px!important;bottom:34px!important;left:6px!important;padding:3px 6px!important}
.xh-play span{width:42px!important;height:42px!important;font-size:17px!important}
.xh-category-toggle{font-family:inherit;cursor:pointer}
.xh-category-panel{display:none;background:#181818;border-top:1px solid #303030}
.xh-category-panel.is-open{display:block}
.xh-category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding-top:9px;padding-bottom:10px}
.xh-category-grid a{background:#252525;border:1px solid #343434;border-radius:8px;color:#eee;text-align:center;padding:9px 4px;font-size:11px;font-weight:700}
@media(min-width:700px){
 .xh-main{padding-left:8px!important;padding-right:8px!important}
 .xh-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:7px!important}
 .xh-thumb{aspect-ratio:9/12.5!important}
 .xh-card-overlay .xh-title{font-size:14px!important}
 .xh-category-grid{grid-template-columns:repeat(5,1fr)}
}

/* v2.3 homepage polish */
.xh-main{padding-top:2px!important}
.xh-heading{margin:4px 3px 7px!important;padding:0!important}
.xh-heading h1{font-size:19px!important;line-height:1.15!important}
.xh-play{background:linear-gradient(transparent 58%,rgba(0,0,0,.35))!important}
.xh-play span{width:40px!important;height:40px!important;border-radius:50%!important;background:rgba(0,0,0,.58)!important;color:#fff!important;border:1px solid rgba(255,255,255,.45)!important;box-shadow:0 4px 14px rgba(0,0,0,.28)!important;font-size:15px!important;padding-left:2px!important}

.xh-no-results{display:none;text-align:center;padding:35px 10px;color:#bbb;font-size:14px}

/* v2.5 premium feature navigation */
.xh-feature-nav{padding:7px 6px!important;gap:5px!important;background:#202020!important;border-top:1px solid #292929!important;border-bottom:1px solid #292929!important;display:grid!important;grid-template-columns:repeat(3,1fr)!important}
.xh-feature-item{min-width:0!important;width:100%!important;height:38px!important;padding:0 5px!important;border-radius:9px!important;background:#292929!important;border:1px solid #373737!important;color:#f3f3f3!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;font-size:11px!important;font-weight:750!important;box-shadow:inset 0 1px rgba(255,255,255,.025)!important}
.xh-feature-item:hover,.xh-feature-item:active{background:#333!important;border-color:#494949!important}
.xh-feature-icon{width:20px!important;height:20px!important;border-radius:6px!important;background:#3a3a3a!important;display:grid!important;place-items:center!important;font-size:11px!important;flex:none!important}
.xh-category-panel{position:relative!important;z-index:100!important}
.xh-category-panel.is-open{display:block!important}
.xh-mobile-menu{z-index:120!important}
.xh-mobile-menu.is-open{display:block!important}

/* v2.6: three separate premium chips */
.xh-feature-nav{display:flex!important;grid-template-columns:none!important;gap:7px!important;padding:8px 7px!important;overflow-x:auto!important;background:#202020!important;border-top:0!important}
.xh-feature-item{width:auto!important;min-width:max-content!important;height:36px!important;padding:0 13px!important;border-radius:18px!important;background:#292929!important;border:1px solid #3c3c3c!important;box-shadow:none!important;font-size:11px!important}
.xh-feature-item:nth-child(1){background:#321f22!important;border-color:#583138!important}
.xh-feature-item:nth-child(2){background:#292536!important;border-color:#48405f!important}
.xh-feature-item:nth-child(3){background:#222d29!important;border-color:#385047!important}
.xh-feature-icon{width:auto!important;height:auto!important;background:transparent!important;font-size:12px!important}

/* v2.8 desktop reel-grid polish — mobile stays 2 columns */
@media (min-width: 900px){
  .xh-main{
    max-width:1500px!important;
    width:calc(100% - 28px)!important;
    margin:0 auto!important;
    padding-left:0!important;
    padding-right:0!important;
  }
  .xh-heading{margin:8px 2px 9px!important}
  .xh-grid{
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    gap:8px!important;
    align-items:start!important;
  }
  .xh-card{
    width:100%!important;
    border-radius:10px!important;
    overflow:hidden!important;
  }
  .xh-thumb{
    aspect-ratio:9/13.2!important;
    min-height:0!important;
    max-height:none!important;
    border-radius:10px!important;
  }
  .xh-reel-poster,.xh-demo-video{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }
  .xh-card-overlay{padding:28px 8px 8px!important}
  .xh-card-overlay .xh-title{
    font-size:13px!important;
    line-height:1.2!important;
    -webkit-line-clamp:1!important;
  }
  .xh-stats{bottom:30px!important}
  .xh-bottom-nav{
    width:430px!important;
    max-width:calc(100vw - 32px)!important;
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    border-radius:16px 16px 0 0!important;
  }
}
@media (min-width: 1450px){
  .xh-main{max-width:1580px!important}
  .xh-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:9px!important}
}

/* v2.9 mobile sticky controls + random call */
@media(max-width:899px){
 .xh-header{position:sticky!important;top:0!important;z-index:500!important}
 .xh-category-panel,.xh-mobile-menu,.xh-search-drop{z-index:520!important}
}
.xh-call-open{overflow:hidden}
.xh-call-modal{display:none;position:fixed;z-index:99999;inset:0}
.xh-call-modal.open{display:block}
.xh-call-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(4px)}
.xh-call-box{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(92vw,390px);background:#151515;border:1px solid #343434;border-radius:20px;overflow:hidden;box-shadow:0 24px 70px rgba(0,0,0,.55)}
.xh-call-close{position:absolute;right:10px;top:9px;z-index:5;width:31px;height:31px;border:0;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;font-size:22px}
.xh-call-top{height:55px;padding:10px 48px 8px 14px;display:grid;grid-template-columns:10px 1fr;column-gap:7px;align-items:center;color:#fff}
.xh-call-top small{grid-column:2;color:#aaa;font-size:10px;margin-top:-8px}.xh-call-dot{width:8px;height:8px;border-radius:50%;background:#38d66b}
.xh-call-video{height:min(61vh,530px);position:relative;background:#080808}
.xh-call-video video{width:100%;height:100%;object-fit:cover}
.xh-call-name{position:absolute;left:12px;bottom:12px;color:#fff;font-weight:800;font-size:13px;text-shadow:0 2px 8px #000}
.xh-call-live{position:absolute;left:12px;top:12px;background:#e72b48;color:#fff;border-radius:5px;padding:4px 7px;font-size:9px;font-weight:900}
.xh-call-actions{display:flex;justify-content:center;gap:22px;padding:13px}
.xh-call-actions button{width:44px;height:44px;border:0;border-radius:50%;background:#292929;color:#fff;font-size:17px}
.xh-call-actions .xh-call-end{background:#e43146;transform:rotate(135deg)}
.xh-call-caption{text-align:center;color:#777;font-size:9px;padding:0 0 10px}

/* v3.0 WhatsApp-like demo video call */
.xh-call-modal{display:none;position:fixed;z-index:99999;inset:0;background:#0b0b0c}
.xh-call-modal.open{display:block}.xh-call-screen{position:absolute;inset:0;overflow:hidden;background:#111}
.xh-remote-video{width:100%;height:100%;object-fit:cover;transition:opacity .45s}
.xh-call-shade{position:absolute;inset:0;background:linear-gradient(rgba(0,0,0,.48),transparent 28%,transparent 62%,rgba(0,0,0,.62));pointer-events:none}
.xh-call-header{position:absolute;z-index:4;top:0;left:0;right:0;padding:max(15px,env(safe-area-inset-top)) 12px 8px;display:flex;align-items:center;gap:10px;color:#fff}
.xh-call-back,.xh-call-more{width:38px;height:38px;border:0;border-radius:50%;background:rgba(20,20,20,.38);color:#fff;font-size:28px}.xh-call-more{font-size:22px;margin-left:auto}
.xh-call-person{display:flex;align-items:center;gap:9px}.xh-call-person b{display:block;font-size:14px}.xh-call-person small{display:block;font-size:10px;color:#ddd;margin-top:2px}
.xh-call-avatar{width:37px;height:37px;border-radius:50%;display:grid;place-items:center;background:#495057;font-weight:900}
.xh-call-ringing{position:absolute;z-index:3;left:50%;top:43%;transform:translate(-50%,-50%);text-align:center;color:#fff}
.xh-ring-avatar{position:relative;margin:auto;width:88px;height:88px;border-radius:50%;display:grid;place-items:center;background:#3a3f44;font-size:32px;font-weight:900;box-shadow:0 0 0 10px rgba(255,255,255,.06)}
.xh-ring-avatar span{position:absolute;inset:-13px;border:1px solid rgba(255,255,255,.22);border-radius:50%;animation:xhRing 1.4s infinite}
@keyframes xhRing{0%{transform:scale(.85);opacity:1}100%{transform:scale(1.3);opacity:0}}
.xh-call-ringing h3{margin:18px 0 4px;font-size:20px}.xh-call-ringing p{margin:0;color:#ccc;font-size:12px}
.xh-self-video{position:absolute;z-index:5;right:12px;bottom:112px;width:96px;height:142px;border-radius:12px;overflow:hidden;background:#242424;border:1px solid rgba(255,255,255,.22);box-shadow:0 5px 20px rgba(0,0,0,.4)}
.xh-self-video video{width:100%;height:100%;object-fit:cover;display:none}.xh-self-video.camera-on video{display:block}.xh-self-video.camera-on .xh-self-fallback{display:none}
.xh-self-fallback{height:100%;display:grid;place-items:center;color:#aaa;font-size:12px}
.xh-call-controls{position:absolute;z-index:5;left:12px;right:12px;bottom:max(20px,env(safe-area-inset-bottom));display:flex;justify-content:space-around;align-items:center;padding:11px 7px;background:rgba(20,20,20,.64);backdrop-filter:blur(12px);border-radius:22px}
.xh-call-controls button{border:0;background:transparent;color:#fff;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:54px}.xh-call-controls button span{width:43px;height:43px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.15);font-size:17px}.xh-call-controls small{font-size:9px}
.xh-call-controls .xh-call-end span{background:#e53b43;transform:rotate(135deg)}.xh-call-controls button.off span{background:#fff;color:#111}
@media(min-width:700px){.xh-call-screen{left:50%;right:auto;width:410px;transform:translateX(-50%);box-shadow:0 0 70px #000}}

/* v3.1 professional random call */
.xh-call-feed,.xh-call-page{position:absolute;inset:0;overflow:hidden}
.xh-remote-label{position:absolute;z-index:5;left:14px;bottom:116px;background:rgba(0,0,0,.42);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(8px);border-radius:14px;padding:5px 8px;color:#fff;font-size:8px;font-weight:800;letter-spacing:.4px}
.xh-remote-label span{display:inline-block;width:6px;height:6px;border-radius:50%;background:#31d06c;margin-right:4px}
.xh-self-video{width:105px!important;height:154px!important;bottom:126px!important;border-radius:15px!important;border:2px solid rgba(255,255,255,.7)!important}
.xh-you-label{position:absolute;left:6px;bottom:6px;background:rgba(0,0,0,.55);color:#fff;border-radius:6px;padding:3px 5px;font-size:7px;font-weight:900}
.xh-call-controls{bottom:max(17px,env(safe-area-inset-bottom))!important;background:rgba(18,18,20,.72)!important;border:1px solid rgba(255,255,255,.12);padding:10px 5px!important;border-radius:24px!important;box-shadow:0 10px 30px rgba(0,0,0,.3)}
.xh-call-controls button{min-width:62px!important;gap:5px!important}
.xh-call-controls .xh-ctl-circle{width:46px!important;height:46px!important;background:#343438!important;border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px rgba(255,255,255,.06)}
.xh-call-controls .xh-call-end .xh-ctl-circle{background:#ef3d4f!important;border-color:#ff6473!important}
.xh-call-controls small{font-size:9px!important;color:#eee}
.xh-swipe-tip{position:absolute;z-index:6;left:50%;bottom:192px;transform:translateX(-50%);background:rgba(0,0,0,.42);color:#eee;padding:6px 10px;border-radius:15px;font-size:9px;white-space:nowrap;animation:xhTip 2.8s forwards}
@keyframes xhTip{0%,65%{opacity:1}100%{opacity:0}}
.xh-call-back{font-size:19px!important}

/* v3.2 video/audio call + tap self preview to swap */
.xh-self-video{cursor:pointer;transition:all .25s ease}
.xh-self-video.camera-off:after{content:"Camera off";position:absolute;inset:0;display:grid;place-items:center;background:#242424;color:#ddd;font-size:10px;z-index:4}
.xh-call-page.xh-swapped .xh-self-video{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;border:0!important;border-radius:0!important;z-index:1!important}
.xh-call-page.xh-swapped .xh-self-video video{width:100%!important;height:100%!important;object-fit:cover!important}
.xh-call-page.xh-swapped .xh-you-label{left:14px;bottom:116px;font-size:9px;padding:5px 8px;border-radius:14px}
.xh-call-page.xh-swapped .xh-remote-video{position:absolute;z-index:6;right:12px;bottom:126px;width:105px;height:154px;border-radius:15px;border:2px solid rgba(255,255,255,.7);object-fit:cover;box-shadow:0 5px 20px rgba(0,0,0,.4)}
.xh-call-page.xh-swapped .xh-remote-label{z-index:7;left:auto;right:18px;bottom:132px;font-size:6px;padding:3px 5px}
.xh-call-page.xh-swapped .xh-call-shade{z-index:2}
.xh-call-page.xh-swapped .xh-call-header,.xh-call-page.xh-swapped .xh-call-controls,.xh-call-page.xh-swapped .xh-swipe-tip{z-index:10}

/* v3.3 camera + professional call controls */
.xh-self-fallback{flex-direction:column!important;gap:5px!important;text-align:center}
.xh-self-fallback .xh-cam-icon{font-size:22px;opacity:.75}
.xh-self-fallback b{font-size:11px;color:#eee}.xh-self-fallback small{font-size:8px;color:#aaa;max-width:82px}
.xh-self-video.camera-error{border-color:rgba(255,255,255,.28)!important}
.xh-call-controls .xh-ctl-circle{font-family:Arial,sans-serif;font-weight:800}
.xh-speaker-icon{font-size:12px!important;letter-spacing:-2px}
.xh-mic-icon{position:relative;font-size:0!important}
.xh-mic-icon:before{content:"";width:10px;height:18px;border-radius:8px;background:#fff;display:block}
.xh-mic-icon:after{content:"";position:absolute;width:20px;height:12px;border:2px solid #fff;border-top:0;border-radius:0 0 12px 12px;top:18px}
.xh-call-controls button.off .xh-mic-icon:before{background:#111}
.xh-call-controls button.off .xh-mic-icon:after{border-color:#111}
.xh-end-icon{font-size:0!important;position:relative}
.xh-end-icon:before{content:"";width:23px;height:10px;background:#fff;border-radius:12px 12px 5px 5px;display:block;transform:rotate(0deg)}
.xh-call-controls .xh-call-end .xh-ctl-circle{transform:none!important;background:#e53945!important;border:0!important;width:48px!important;height:48px!important;box-shadow:0 4px 14px rgba(229,57,69,.35)}
.xh-call-controls button.off .xh-ctl-circle{background:#fff!important;color:#111!important}

/* v3.4 WhatsApp-inspired 2x3 call controls + reliable local preview */
.xh-call-controls{
 display:grid!important;
 grid-template-columns:repeat(3,1fr)!important;
 gap:18px 12px!important;
 padding:18px 18px 20px!important;
 border-radius:30px!important;
 background:rgba(18,24,27,.94)!important;
}
.xh-call-controls button{min-width:0!important}
.xh-call-controls .xh-ctl-circle{
 width:58px!important;height:58px!important;border-radius:50%!important;
 background:#273034!important;border:0!important;font-size:19px!important;
}
.xh-call-controls small{font-size:11px!important;margin-top:3px}
.xh-call-controls .xh-call-end .xh-ctl-circle{
 width:58px!important;height:58px!important;background:#f20b45!important;
 box-shadow:0 5px 18px rgba(242,11,69,.28)!important;
}
.xh-more-icon{font-size:20px!important;letter-spacing:2px}
.xh-share-icon{font-size:25px!important}
.xh-self-video.camera-on .xh-self-fallback{display:none!important}
.xh-self-video.camera-on video{display:block!important;visibility:visible!important;opacity:1!important}
.xh-self-video video{background:#111}
.xh-self-video{bottom:224px!important}
.xh-remote-label{bottom:214px!important}
.xh-swipe-tip{bottom:292px!important}
.xh-call-page.xh-swapped .xh-remote-video{bottom:224px!important}
.xh-call-page.xh-swapped .xh-remote-label{bottom:230px!important}
@media(max-height:720px){
 .xh-call-controls{gap:10px!important;padding:12px 16px!important}
 .xh-call-controls .xh-ctl-circle{width:50px!important;height:50px!important}
 .xh-call-controls .xh-call-end .xh-ctl-circle{width:50px!important;height:50px!important}
 .xh-self-video{bottom:190px!important;height:135px!important}
}

/* v3.5 simplified call controls: Video, Mute, End */
.xh-call-controls{
 display:flex!important;
 justify-content:center!important;
 align-items:flex-start!important;
 gap:34px!important;
 padding:17px 20px 20px!important;
 border-radius:28px!important;
 background:rgba(17,22,25,.94)!important;
}
.xh-call-controls button{width:70px!important;min-width:70px!important}
.xh-call-controls .xh-ctl-circle{
 width:56px!important;height:56px!important;
 margin:auto!important;
 background:#293236!important;
 border:1px solid rgba(255,255,255,.08)!important;
}
.xh-call-controls .xh-call-end .xh-ctl-circle{
 width:58px!important;height:58px!important;
 background:#f0283e!important;
 border:0!important;
 box-shadow:0 5px 16px rgba(240,40,62,.28)!important;
 position:relative!important;
}
.xh-end-icon:before{
 content:""!important;
 width:25px!important;height:9px!important;
 background:#fff!important;
 border-radius:12px 12px 5px 5px!important;
 display:block!important;
 transform:rotate(0deg)!important;
}
.xh-end-icon:after{
 content:""!important;
 position:absolute!important;
 width:7px!important;height:7px!important;
 border-radius:50%!important;
 background:#fff!important;
 left:10px!important;top:24px!important;
 box-shadow:20px 0 0 #fff!important;
}
.xh-self-video{bottom:145px!important}
.xh-remote-label{bottom:135px!important}
.xh-swipe-tip{bottom:205px!important}
.xh-call-page.xh-swapped .xh-remote-video{bottom:145px!important}
.xh-call-page.xh-swapped .xh-remote-label{bottom:151px!important}

/* v3.8 approved dark/red mobile UI */
:root{--xh-bg:#0d0f11;--xh-panel:#171b1e;--xh-soft:#24292d;--xh-red:#ff2348;--xh-text:#fff}
body{background:var(--xh-bg)!important;color:var(--xh-text)!important}
.xh-header{background:rgba(13,15,17,.98)!important;border-bottom:0!important}
.xh-topbar{min-height:72px!important;padding-top:10px!important;padding-bottom:8px!important}
.xh-logo-img{display:flex!important;align-items:center!important;width:auto!important}
.xh-logo-img img{display:block!important;width:auto!important;height:42px!important;max-width:220px!important;object-fit:contain!important}
.xh-header-actions{gap:8px!important}
.xh-icon-btn{width:44px!important;height:44px!important;border-radius:50%!important;background:transparent!important;border:0!important;color:#fff!important;font-size:30px!important}
.xh-menu-btn span{height:3px!important;border-radius:4px!important;background:#fff!important}
.xh-search-drop{background:#111518!important;padding:8px 12px 12px!important}
.xh-search-drop form{background:#22272b!important;border-radius:22px!important;padding:4px!important;border:1px solid #30363a!important}
.xh-search-drop input{background:transparent!important;border:0!important;color:#fff!important;padding:10px 12px!important}
.xh-search-drop button{border:0!important;border-radius:18px!important;background:var(--xh-red)!important;color:#fff!important;padding:9px 15px!important}
.xh-mobile-menu{background:#121619!important;border:0!important}
.xh-mobile-menu-inner a{border-radius:18px!important;background:#22272b!important;margin:5px!important;padding:11px 14px!important;color:#fff!important}
.xh-feature-nav{background:#0d0f11!important;border:0!important}
.xh-feature-inner{gap:9px!important;overflow-x:auto!important;padding:8px 12px 12px!important;scrollbar-width:none}
.xh-feature-item{flex:0 0 auto!important;border:0!important;background:#22272b!important;color:#fff!important;border-radius:22px!important;padding:11px 16px!important;font-weight:700!important}
.xh-live-item{background:var(--xh-red)!important}
.xh-feature-icon{display:none!important}
.xh-category-panel{background:#121619!important;border:0!important}
.xh-category-grid{gap:8px!important;padding:10px 12px 14px!important}
.xh-category-grid a{background:#23282c!important;border:0!important;border-radius:18px!important;color:#fff!important;padding:9px 12px!important}
.xh-main{padding-top:10px!important}
.xh-heading h1{font-size:17px!important;margin:0 0 10px!important}
.xh-grid{gap:7px!important}
.xh-card{border:0!important;border-radius:11px!important;background:#16191c!important;overflow:hidden!important}
.xh-thumb{border-radius:11px!important;overflow:hidden!important;background:#111!important}
.xh-demo-video{object-fit:cover!important}
.xh-play{width:52px!important;height:52px!important;border-radius:50%!important;background:rgba(0,0,0,.52)!important;backdrop-filter:blur(4px)}
.xh-play span{font-size:22px!important}
.xh-stats{left:8px!important;bottom:36px!important;background:rgba(0,0,0,.45)!important;border-radius:12px!important;padding:4px 7px!important;font-size:9px!important}
.xh-card-overlay{padding:28px 8px 8px!important;background:linear-gradient(transparent,rgba(0,0,0,.82))!important}
.xh-title{font-size:12px!important;font-weight:700!important;color:#fff!important}
.xh-bottom-nav{background:rgba(12,14,16,.97)!important;border-top:1px solid #25292c!important;box-shadow:0 -8px 30px rgba(0,0,0,.25)!important}
.xh-bottom-nav a{color:#aaa!important;font-weight:600!important}
.xh-bottom-nav a.is-active{color:#fff!important}
.xh-bottom-nav a.is-active:after{content:"";display:block;width:28px;height:3px;border-radius:3px;background:var(--xh-red);margin:5px auto 0}
.xh-bottom-nav .ico{font-size:24px!important}
@media(max-width:899px){
 .xh-header{position:sticky!important;top:0!important;z-index:9990!important;transform:none!important;overflow:visible!important}
 .xh-search-drop,.xh-mobile-menu,.xh-category-panel{z-index:9999!important}
 .xh-logo-img img{height:38px!important;max-width:190px!important}
 .xh-main{padding-left:7px!important;padding-right:7px!important}
 .xh-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .xh-thumb{aspect-ratio:9/13.5!important}
}

/* v4.0 screenshot-matched complete homepage */
body{margin:0!important;background:#090b0d!important;color:#fff!important;padding-bottom:84px!important;font-family:Arial,sans-serif!important}
.xh-header{position:sticky!important;top:0!important;z-index:9000!important;background:#090b0d!important;border:0!important}
.xh-topbar{height:78px!important;min-height:78px!important;padding:8px 13px!important;display:flex!important;align-items:center!important}
.xh-wrap{width:100%!important;max-width:none!important;display:flex!important;align-items:center!important}
.xh-menu-btn{order:-1!important;width:46px!important;height:46px!important;margin-right:10px!important;border:0!important;background:transparent!important}
.xh-menu-btn span{width:29px!important;height:4px!important;border-radius:4px!important;background:#fff!important}
.xh-logo-img{margin:0!important}.xh-logo-img img{height:48px!important;width:auto!important;max-width:230px!important}
.xh-header-actions{margin-left:auto!important}.xh-search-btn{width:48px!important;height:48px!important;background:transparent!important;border:0!important}
.xh-feature-nav{display:none!important}
.xh-search-drop,.xh-mobile-menu,.xh-category-panel{z-index:9999!important}
.mock-home{padding:0 10px 8px!important;max-width:100%!important}
.mock-chips{display:flex;gap:10px;overflow-x:auto;padding:10px 4px 18px;scrollbar-width:none}
.mock-chips::-webkit-scrollbar{display:none}
.mock-chips button{flex:0 0 auto;border:0;border-radius:25px;background:#202427;color:#fff;height:49px;padding:0 22px;font-size:14px;font-weight:700}
.mock-chips button.active{background:#ff1745}
.mock-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.mock-card{min-width:0;border-radius:11px;overflow:hidden;background:#17191b}
.mock-media{position:relative;display:block;width:100%;aspect-ratio:9/15.8;overflow:hidden;border-radius:11px;color:#fff;text-decoration:none;background:#17191b}
.mock-media video{width:100%;height:100%;object-fit:cover}
.mock-media:after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.78));pointer-events:none}
.mock-play{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;background:rgba(30,26,23,.62)}
.mock-play:after{content:"";position:absolute;left:22px;top:16px;border-left:17px solid #fff;border-top:11px solid transparent;border-bottom:11px solid transparent}
.mock-side{position:absolute;z-index:4;right:9px;bottom:52px;width:38px;display:flex;flex-direction:column;align-items:center;gap:3px;text-shadow:0 1px 4px #000}
.mock-side b{font-style:normal;font-size:26px;line-height:30px}.mock-side small{font-size:10px;font-weight:800;margin-bottom:7px}
.mock-avatar{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:#eee;color:#222;border:2px solid #fff;font-style:normal;font-weight:900}
.mock-plus{margin-top:-12px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:#ff1745;color:#fff;font-style:normal;font-weight:900}
.mock-side .comment{font-size:16px;width:31px;height:27px;border-radius:50%;background:#fff;color:#333;display:grid;place-items:center}
.mock-side .share{font-size:28px;transform:rotate(-20deg)}.mock-side .dots{font-size:29px}
.mock-caption{position:absolute;z-index:4;left:10px;right:48px;bottom:10px;display:flex;flex-direction:column;font-size:12px;line-height:1.28;text-shadow:0 1px 4px #000}
.mock-caption strong{font-size:13px}.mock-caption em{display:inline-grid;place-items:center;width:14px;height:14px;border-radius:50%;background:#22a8ef;font-size:9px;font-style:normal}
.mock-bottom{position:fixed;z-index:9500;left:0;right:0;bottom:0;height:79px;background:#090b0d;border-top:1px solid #292d30;display:flex;align-items:center;justify-content:space-around;padding:5px 4px 7px}
.mock-bottom a{position:relative;flex:1;text-decoration:none;color:#aeb0b2;text-align:center;font-size:10px}
.mock-bottom a b{display:block;height:31px;line-height:31px;font-size:25px;color:#bfc1c3}
.mock-bottom a span{display:block}.mock-bottom a.active{color:#fff}.mock-bottom a.active b{color:#fff}
.mock-bottom a.active:after{content:"";position:absolute;left:50%;bottom:-8px;transform:translateX(-50%);width:29px;height:4px;border-radius:3px;background:#ff1745}
.mock-bottom .random{width:32px;height:32px;margin:auto;border:3px solid #ff1745;border-radius:9px;color:#fff!important;background:#ff1745;line-height:25px}
.xh-bottom-nav{display:none!important}
@media(min-width:900px){
 .xh-topbar,.mock-home{max-width:1450px!important;margin:auto!important}
 .mock-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}
 .mock-media{aspect-ratio:9/14}
 .mock-bottom{left:50%;right:auto;width:500px;transform:translateX(-50%);border-radius:20px 20px 0 0}
}

/* v4.1 requested cleanup */
.xh-logo-img img{background:#090b0d!important}
.xh-inline-search{
 margin-left:auto!important;width:min(36vw,180px)!important;height:36px!important;
 display:flex!important;align-items:center!important;background:#1d2124!important;
 border:1px solid #303438!important;border-radius:19px!important;overflow:hidden!important;
}
.xh-inline-search input{
 width:100%!important;min-width:0!important;height:100%!important;padding:0 5px 0 12px!important;
 background:transparent!important;border:0!important;outline:0!important;color:#fff!important;font-size:12px!important;
}
.xh-inline-search input::placeholder{color:#8e9498!important}
.xh-inline-search button{
 flex:0 0 34px!important;width:34px!important;height:34px!important;border:0!important;
 background:transparent!important;color:#fff!important;font-size:22px!important;padding:0!important;
}
.xh-search-drop{display:none!important}

/* Smaller professional category pills */
.mock-chips{gap:6px!important;padding:7px 3px 11px!important}
.mock-chips button{
 height:34px!important;padding:0 13px!important;border-radius:17px!important;
 font-size:11px!important;font-weight:700!important;letter-spacing:0!important;
}
.mock-chips button.active{background:#ff1745!important}

/* Clean homepage cards: no like/comment/share/dots */
.mock-side{display:none!important}
.mock-caption{right:10px!important}

/* Bottom only Home / Trending / Random */
.mock-bottom{justify-content:center!important;gap:0!important}
.mock-bottom a{max-width:150px!important;flex:1 1 33.333%!important}

@media(max-width:520px){
 .xh-topbar{padding-left:8px!important;padding-right:8px!important}
 .xh-menu-btn{margin-right:4px!important;width:39px!important;height:42px!important}
 .xh-menu-btn span{width:25px!important;height:3px!important}
 .xh-logo-img img{height:38px!important;max-width:154px!important}
 .xh-inline-search{width:31vw!important;max-width:125px!important;height:34px!important}
 .xh-inline-search input{font-size:11px!important;padding-left:9px!important}
 .xh-inline-search button{width:30px!important;flex-basis:30px!important;font-size:19px!important}
}

/* v4.2 exact header order: Menu -> Logo -> compact Xhmaster-style Search */
.xh-topbar .xh-wrap{
 display:flex!important;
 flex-direction:row!important;
 align-items:center!important;
 flex-wrap:nowrap!important;
 gap:0!important;
}
.xh-menu-btn{
 order:1!important;
 flex:0 0 42px!important;
 margin:0 7px 0 0!important;
}
.xh-logo-img{
 order:2!important;
 flex:0 1 auto!important;
 margin:0!important;
}
.xh-header-actions{
 order:3!important;
 margin-left:auto!important;
 display:flex!important;
 align-items:center!important;
}
.xh-inline-search{
 width:132px!important;
 height:35px!important;
 margin:0!important;
 border-radius:18px!important;
 background:#202427!important;
 border:1px solid #34393d!important;
 box-shadow:none!important;
}
.xh-inline-search input{
 height:35px!important;
 padding:0 4px 0 12px!important;
 font-size:11px!important;
 color:#fff!important;
}
.xh-inline-search button{
 width:34px!important;
 height:34px!important;
 flex:0 0 34px!important;
 font-size:20px!important;
 color:#fff!important;
}
@media(max-width:420px){
 .xh-topbar{padding-left:7px!important;padding-right:7px!important}
 .xh-menu-btn{flex-basis:36px!important;width:36px!important;margin-right:4px!important}
 .xh-logo-img img{height:35px!important;max-width:142px!important}
 .xh-inline-search{width:108px!important;height:33px!important}
 .xh-inline-search input{font-size:10px!important;padding-left:9px!important}
 .xh-inline-search button{width:29px!important;flex-basis:29px!important;height:32px!important}
}

/* v4.3 left menu + round search that expands on click */
.xh-topbar .xh-wrap{position:relative!important}
.xh-menu-btn{order:1!important;margin-left:0!important;margin-right:7px!important}
.xh-logo-img{order:2!important}
.xh-header-actions{order:3!important;margin-left:auto!important}
.xh-inline-search{display:none!important}
.xh-round-search{
 width:42px!important;height:42px!important;min-width:42px!important;border-radius:50%!important;
 border:1px solid #34393d!important;background:#202427!important;position:relative!important;padding:0!important;
}
.xh-round-search span:before{content:"";position:absolute;width:15px;height:15px;border:2px solid #fff;border-radius:50%;left:11px;top:10px}
.xh-round-search span:after{content:"";position:absolute;width:9px;height:2px;background:#fff;transform:rotate(45deg);left:25px;top:26px;border-radius:2px}
.xh-expand-search{
 display:none;position:absolute;left:8px;right:8px;top:58px;z-index:10020;
 background:#15191c;border:1px solid #30363a;border-radius:22px;padding:5px;
 box-shadow:0 12px 35px rgba(0,0,0,.48)
}
.xh-expand-search.is-open{display:block!important}
.xh-expand-search form{display:flex;width:100%}
.xh-expand-search input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:#fff;padding:9px 12px;font-size:12px}
.xh-expand-search button{width:38px;height:34px;border:0;border-radius:18px;background:#ff1745;color:#fff;font-size:20px}
@media(max-width:420px){
 .xh-menu-btn{margin-left:0!important}
 .xh-round-search{width:38px!important;height:38px!important;min-width:38px!important}
 .xh-round-search span:before{left:9px;top:8px}
 .xh-round-search span:after{left:23px;top:24px}
}

/* v4.4 ONLY requested header/search fixes */
.xh-topbar .xh-wrap{
 display:flex!important;
 flex-direction:row!important;
 align-items:center!important;
 justify-content:flex-start!important;
 position:relative!important;
}
.xh-menu-btn{
 order:1!important;
 position:relative!important;
 left:auto!important;right:auto!important;
 margin-left:0!important;
 margin-right:7px!important;
 flex:0 0 42px!important;
}
.xh-logo-img{
 order:2!important;
 position:relative!important;
 left:auto!important;right:auto!important;
 margin:0!important;
 flex:0 1 auto!important;
}
.xh-header-actions{
 order:3!important;
 position:relative!important;
 left:auto!important;right:auto!important;
 margin-left:auto!important;
 margin-right:0!important;
}
.xh-round-search{
 position:relative!important;
 left:auto!important;right:auto!important;
}
.xh-expand-search{
 position:absolute!important;
 left:8px!important;
 right:8px!important;
 top:calc(100% + 6px)!important;
 z-index:10020!important;
}
.xh-expand-search.is-open{
 display:block!important;
}
/* reserve space only while search is open so For You/categories are never covered */
.xh-header:has(.xh-expand-search.is-open){
 padding-bottom:52px!important;
}
@media(max-width:420px){
 .xh-menu-btn{flex:0 0 36px!important;margin-left:0!important;margin-right:4px!important}
 .xh-logo-img{margin-left:0!important}
 .xh-header-actions{margin-left:auto!important;margin-right:0!important}
}

/* v4.5 FINAL HEADER ORDER — LEFT: Menu -> Logo -> Search :RIGHT */
.xh-topbar .xh-wrap{
 width:100%!important;
 display:grid!important;
 grid-template-columns:42px minmax(0,1fr) 42px!important;
 align-items:center!important;
 justify-content:stretch!important;
 gap:6px!important;
}
.xh-menu-btn{
 grid-column:1!important;
 justify-self:start!important;
 position:static!important;
 transform:none!important;
 margin:0!important;
 width:42px!important;
 min-width:42px!important;
}
.xh-logo-img{
 grid-column:2!important;
 justify-self:start!important;
 position:static!important;
 transform:none!important;
 margin:0!important;
 min-width:0!important;
}
.xh-header-actions{
 grid-column:3!important;
 justify-self:end!important;
 position:static!important;
 transform:none!important;
 margin:0!important;
 width:42px!important;
}
.xh-round-search{
 width:42px!important;
 min-width:42px!important;
 height:42px!important;
 margin:0!important;
 position:relative!important;
}
.xh-expand-search{
 grid-column:1 / -1!important;
 position:absolute!important;
 left:8px!important;
 right:8px!important;
 top:calc(100% + 6px)!important;
}
@media(max-width:420px){
 .xh-topbar .xh-wrap{grid-template-columns:38px minmax(0,1fr) 38px!important;gap:4px!important}
 .xh-menu-btn{width:38px!important;min-width:38px!important}
 .xh-header-actions{width:38px!important}
 .xh-round-search{width:38px!important;min-width:38px!important;height:38px!important}
 .xh-logo-img img{max-width:150px!important;height:35px!important}
}

/* v4.6 structural header fix — exact DOM order: MENU | LOGO | SEARCH */
.xh-topbar{
 display:grid!important;
 grid-template-columns:42px minmax(0,1fr) 42px!important;
 align-items:center!important;
 gap:6px!important;
}
.xh-topbar>.xh-menu-btn{
 grid-column:1!important;grid-row:1!important;
 display:flex!important;visibility:visible!important;opacity:1!important;
 position:relative!important;inset:auto!important;
 width:42px!important;height:42px!important;min-width:42px!important;
 margin:0!important;justify-self:start!important;
}
.xh-topbar>.xh-logo-img{
 grid-column:2!important;grid-row:1!important;
 justify-self:start!important;margin:0!important;
}
.xh-topbar>.xh-header-actions{
 grid-column:3!important;grid-row:1!important;
 justify-self:end!important;margin:0!important;width:42px!important;
}
.xh-topbar>.xh-menu-btn span{
 display:block!important;width:24px!important;height:2px!important;
 background:#fff!important;border-radius:2px!important;margin:3px auto!important;
}
@media(max-width:420px){
 .xh-topbar{grid-template-columns:38px minmax(0,1fr) 38px!important;gap:4px!important}
 .xh-topbar>.xh-menu-btn{width:38px!important;height:38px!important;min-width:38px!important}
 .xh-topbar>.xh-header-actions{width:38px!important}
}

/* v4.7 requested fixes only */

/* Correct normal hamburger: 3 horizontal bars, left side */
.xh-topbar>.xh-menu-btn{
 display:flex!important;
 flex-direction:column!important;
 align-items:center!important;
 justify-content:center!important;
 gap:5px!important;
 padding:0!important;
}
.xh-topbar>.xh-menu-btn span{
 display:block!important;
 width:23px!important;
 height:2px!important;
 margin:0!important;
 background:#fff!important;
 border-radius:4px!important;
 transform:none!important;
}

/* Xhmaster category menu */
.xh-mobile-menu{
 position:absolute!important;
 top:100%!important;
 left:0!important;
 right:0!important;
 max-height:65vh!important;
 overflow-y:auto!important;
 background:#101214!important;
 border-top:1px solid #24282b!important;
 box-shadow:0 14px 30px rgba(0,0,0,.45)!important;
 z-index:10030!important;
}
.xh-mobile-menu-inner{
 display:grid!important;
 grid-template-columns:repeat(2,minmax(0,1fr))!important;
 gap:7px!important;
 padding:10px!important;
}
.xh-mobile-menu-inner a{
 margin:0!important;
 padding:10px 12px!important;
 border-radius:9px!important;
 background:#1b1f22!important;
 border:1px solid #292e32!important;
 font-size:12px!important;
}

/* Search opens directly below top row, compact. It takes its own space,
   so For You/categories are pushed down, never covered/cut. */
.xh-expand-search{
 display:none!important;
 position:absolute!important;
 left:8px!important;
 right:8px!important;
 top:100%!important;
 margin-top:2px!important;
 z-index:10040!important;
 padding:4px!important;
 border-radius:19px!important;
 background:#15191c!important;
 border:1px solid #30363a!important;
 box-shadow:0 8px 20px rgba(0,0,0,.38)!important;
}
.xh-expand-search.is-open{display:block!important}
.xh-expand-search form{height:36px!important}
.xh-expand-search input{padding:7px 11px!important;font-size:12px!important}
.xh-expand-search button{height:32px!important;width:36px!important}

/* reserve only compact search height; bottom For You row remains fully visible */
body.xh-search-open .xh-header{padding-bottom:48px!important}
body:not(.xh-search-open) .xh-header{padding-bottom:0!important}

/* v4.8 requested refinements only */

/* Menu icon slightly lower so it visually aligns with logo */
.xh-topbar>.xh-menu-btn{
 transform:translateY(3px)!important;
}

/* Compact 5-item menu */
.xh-mobile-menu-inner{
 grid-template-columns:repeat(2,minmax(0,1fr))!important;
 gap:6px!important;
 padding:8px 10px 10px!important;
}
.xh-mobile-menu-inner a{
 padding:9px 11px!important;
 font-size:12px!important;
}

/* Search: remove excessive blank space above/below */
.xh-expand-search{
 top:calc(100% - 1px)!important;
 margin-top:0!important;
 padding:3px!important;
}
.xh-expand-search form{
 height:34px!important;
 margin:0!important;
}
.xh-expand-search input{
 height:34px!important;
 padding:5px 11px!important;
 margin:0!important;
}
.xh-expand-search button{
 height:30px!important;
 margin:2px!important;
}

/* Only enough room for the opened search bar */
body.xh-search-open .xh-header{
 padding-bottom:40px!important;
}

/* v4.9 SEARCH POSITION FIX
   Search opens immediately below Menu/Logo/Search row.
   No giant blank gap. Category chips stay below it and remain visible. */
.xh-header{
 position:sticky!important;
 top:0!important;
}
.xh-topbar{
 position:relative!important;
 min-height:54px!important;
}
.xh-expand-search{
 position:absolute!important;
 top:52px!important;
 left:8px!important;
 right:8px!important;
 margin:0!important;
 z-index:10050!important;
}
body.xh-search-open .xh-header{
 padding-bottom:42px!important;
}
body.xh-search-open .mock-chips,
body.xh-search-open .xh-category-row{
 position:relative!important;
 z-index:1!important;
}

/* v5.0 ONLY search spacing correction */

/* small clean gap between Logo/Header row and opened Search */
.xh-expand-search{
 top:calc(100% + 7px)!important;
 margin-top:0!important;
}

/* remove the oversized empty area below opened search */
body.xh-search-open .xh-header{
 padding-bottom:49px!important;
}

/* bring category chips closer to search while keeping a clean gap */
body.xh-search-open .mock-chips{
 margin-top:0!important;
 padding-top:7px!important;
}

/* v5.1 keyword search */
.mock-tags{display:none!important}

/* v5.2 hashtags removed */
.mock-tags,.hashtags,.mock-caption [class*="tag"]{display:none!important}

.xh-empty{grid-column:1/-1;text-align:center;color:#aaa;padding:50px 15px}

/* v5.7 video preview/play fixes */
.mock-media .xh-card-video{
 width:100%!important;height:100%!important;display:block!important;
 object-fit:cover!important;background:#17191b!important;
}

/* v5.9 */
.mock-media{background:#17191b!important}.xh-card-video{pointer-events:none!important}

/* v6.0 - 24 videos per page + pagination */
.xh-pagination{
 display:flex;justify-content:center;align-items:center;gap:7px;
 padding:18px 10px 82px;clear:both;
}
.xh-pagination .page-numbers{
 min-width:34px;height:34px;padding:0 10px;border-radius:9px;
 display:inline-flex;align-items:center;justify-content:center;
 background:#17191d;color:#fff;text-decoration:none;
 border:1px solid #2b2d31;font-size:13px;font-weight:700;
}
.xh-pagination .page-numbers.current{
 background:#e51b23;border-color:#e51b23;color:#fff;
}
.xh-pagination a.page-numbers:hover{background:#26292e}

/* v6.1 - do not show WordPress post author/admin on homepage cards */
.mock-home .post-author,
.mock-home .entry-author,
.mock-home .author-name,
.mock-home [class*="post-author"]{
  display:none!important;
}

/* v6.2 exact homepage author removal */
.mock-caption strong{display:none!important}
.mock-caption>span{margin-top:0!important}

/* v7.0 dynamic homepage categories */
.mock-chips{
 overflow-x:auto!important;
 overflow-y:hidden!important;
 flex-wrap:nowrap!important;
 scrollbar-width:none;
 -webkit-overflow-scrolling:touch;
}
.mock-chips::-webkit-scrollbar{display:none}
.mock-chips button{flex:0 0 auto!important;white-space:nowrap}

/* v7.1 WordPress Pages */
.xh-standard-page{max-width:1100px;margin:0 auto;padding:24px 16px 90px;color:#fff}
.xh-page-title{font-size:26px;line-height:1.2;margin:10px 0 20px}
.xh-page-content{font-size:15px;line-height:1.65}
.xh-page-content img{max-width:100%;height:auto}

/* v7.5 pagination + trailer polish */
.xh-pagination{display:flex!important;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;margin:18px auto 8px!important;padding:0 10px 6px!important}
.xh-pagination a{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 10px;border-radius:8px;text-decoration:none}
.xh-pagination .xh-page-num.active{font-weight:700}
.xh-pagination+.site-footer,.xh-pagination~footer{margin-top:0!important}
body.home{padding-bottom:64px!important}
.xh-card-trailer{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;z-index:5!important;background:#000;pointer-events:none!important;opacity:0;transition:opacity .15s ease}
.xh-card-trailer.playing{opacity:1}
.mock-card a,.video-card a{position:relative}
.trailer-playing .play-icon,.trailer-playing .mock-play,.trailer-playing .xh-play,.trailer-playing [class*="play-button"],.trailer-playing [class*="play-icon"]{opacity:0!important;visibility:hidden!important}

/* v7.6 pagination bottom cleanup */
.xh-pagination{
    margin-bottom:0!important;
    padding-bottom:0!important;
}
.xh-pagination::after,
.xh-pagination::before{
    content:none!important;
    display:none!important;
}
.xh-pagination + p,
.xh-pagination + .notice,
.xh-pagination + .warning,
.xh-pagination + .alert,
.xh-pagination + .pagination-info{
    display:none!important;
}
.home .site-main,
.home main{
    margin-bottom:0!important;
    padding-bottom:0!important;
}

/* v7.9 compact bottom nav + pagination visibility fix */
.mock-bottom,
.bottom-nav,
.xh-bottom-nav,
.mobile-bottom-nav{
    min-height:48px!important;
    height:48px!important;
    padding-top:2px!important;
    padding-bottom:2px!important;
}
.mock-bottom a,
.bottom-nav a,
.xh-bottom-nav a,
.mobile-bottom-nav a{
    min-height:42px!important;
    padding-top:3px!important;
    padding-bottom:3px!important;
}
body.home{
    padding-bottom:54px!important;
}
.xh-pagination{
    position:relative!important;
    z-index:20!important;
    margin-top:16px!important;
    margin-bottom:12px!important;
    padding-bottom:0!important;
}
.home .site-main,
.home main{
    padding-bottom:58px!important;
}

/* v8.0 balanced bottom nav + red compact pagination */
.mock-bottom,
.bottom-nav,
.xh-bottom-nav,
.mobile-bottom-nav{
    height:58px!important;
    min-height:58px!important;
    padding:5px 8px!important;
    box-sizing:border-box!important;
}
.mock-bottom a,
.bottom-nav a,
.xh-bottom-nav a,
.mobile-bottom-nav a{
    min-height:48px!important;
    padding:5px 8px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
}

/* Pagination close to last video */
.xh-pagination{
    margin:7px auto 8px!important;
    padding:0 8px!important;
    min-height:36px!important;
    gap:6px!important;
}
.xh-pagination a{
    min-width:34px!important;
    height:34px!important;
    padding:0 9px!important;
    border:1px solid #e50914!important;
    background:#171717!important;
    color:#fff!important;
    border-radius:8px!important;
    font-weight:700!important;
    box-sizing:border-box!important;
}
.xh-pagination a:hover,
.xh-pagination .xh-page-num.active{
    background:#e50914!important;
    border-color:#e50914!important;
    color:#fff!important;
}

/* Enough room for fixed bottom bar, without a large empty gap */
body.home{
    padding-bottom:62px!important;
}
.home .site-main,
.home main{
    padding-bottom:62px!important;
    margin-bottom:0!important;
}

/* v8.1 screenshot-matched bottom area */
.xh-pagination{
  display:flex!important;justify-content:center!important;align-items:center!important;
  flex-wrap:wrap!important;gap:7px!important;
  margin:4px auto 16px!important;padding:0 10px!important;
  transform:translateY(-8px);
}
.xh-pagination a{
  min-width:38px!important;height:38px!important;padding:0 10px!important;
  border:1px solid #ff1744!important;border-radius:9px!important;
  background:#111315!important;color:#fff!important;font-size:15px!important;font-weight:700!important;
}
.xh-pagination .active,.xh-pagination a:hover{
  background:#ff1744!important;border-color:#ff1744!important;color:#fff!important;
}
.xh-pagination .xh-page-next{min-width:auto!important;padding:0 15px!important}

/* Bigger, cleaner Home / Trending / Random dock */
.mock-bottom,.bottom-nav,.xh-bottom-nav,.mobile-bottom-nav{
  left:50%!important;right:auto!important;bottom:8px!important;
  transform:translateX(-50%)!important;
  width:min(94%,680px)!important;
  height:68px!important;min-height:68px!important;
  padding:7px 10px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:22px!important;
  background:rgba(12,14,16,.96)!important;
  box-shadow:0 10px 30px rgba(0,0,0,.35)!important;
  box-sizing:border-box!important;
}
.mock-bottom a,.bottom-nav a,.xh-bottom-nav a,.mobile-bottom-nav a{
  flex:1!important;min-height:52px!important;
  padding:6px 12px!important;border-radius:15px!important;
  font-size:14px!important;font-weight:600!important;
  gap:5px!important;
}
body.home{padding-bottom:84px!important}
.home .site-main,.home main{padding-bottom:84px!important}
@media(max-width:600px){
 .mock-bottom,.bottom-nav,.xh-bottom-nav,.mobile-bottom-nav{
   width:calc(100% - 18px)!important;height:64px!important;min-height:64px!important;border-radius:18px!important;
 }
 .xh-pagination{margin-bottom:12px!important;transform:translateY(-6px)}
 .xh-pagination a{min-width:34px!important;height:36px!important;padding:0 8px!important;font-size:14px!important}
}

/* v8.3 bottom dock lower + exact 24-post pagination */
.mock-bottom,.bottom-nav,.xh-bottom-nav,.mobile-bottom-nav{
  bottom:1px!important;
}
body.home{
  padding-bottom:76px!important;
}
.home .site-main,.home main{
  padding-bottom:76px!important;
}
.xh-pagination{
  margin-bottom:8px!important;
}
@media(max-width:600px){
  .mock-bottom,.bottom-nav,.xh-bottom-nav,.mobile-bottom-nav{
    bottom:1px!important;
  }
}

/* v8.4 premium bottom navigation */
.mock-bottom{
 position:fixed!important;
 left:50%!important;right:auto!important;bottom:8px!important;
 transform:translateX(-50%)!important;
 width:min(94%,620px)!important;
 height:72px!important;min-height:72px!important;
 display:grid!important;grid-template-columns:repeat(3,1fr)!important;
 align-items:center!important;
 padding:7px!important;
 border:1px solid rgba(255,255,255,.10)!important;
 border-radius:24px!important;
 background:rgba(17,18,20,.97)!important;
 box-shadow:0 8px 28px rgba(0,0,0,.42)!important;
 backdrop-filter:blur(14px)!important;
 z-index:999!important;
 box-sizing:border-box!important;
}
.mock-bottom a{
 height:58px!important;min-height:58px!important;
 display:flex!important;flex-direction:column!important;
 align-items:center!important;justify-content:center!important;
 gap:3px!important;padding:4px 8px!important;
 border-radius:18px!important;
 color:#a9a9ad!important;text-decoration:none!important;
 font-size:12px!important;font-weight:600!important;
 line-height:1.05!important;
 box-sizing:border-box!important;
}
.mock-bottom a b{
 width:29px!important;height:29px!important;
 display:flex!important;align-items:center!important;justify-content:center!important;
 font-size:22px!important;line-height:1!important;font-weight:500!important;
}
.mock-bottom a.active{background:#242529!important;color:#fff!important}
.mock-bottom a.active b{color:#ff1744!important}
.mock-bottom a b.random{
 width:34px!important;height:34px!important;border-radius:11px!important;
 background:#ff1744!important;color:#fff!important;font-size:27px!important;
}
.mock-bottom a:hover{color:#fff!important;background:#202125!important}
body.home{padding-bottom:90px!important}
.home .mock-home{padding-bottom:0!important;margin-bottom:0!important}
.xh-pagination{margin-top:8px!important;margin-bottom:8px!important}
@media(max-width:600px){
 .mock-bottom{width:calc(100% - 16px)!important;height:70px!important;min-height:70px!important;bottom:5px!important;border-radius:21px!important}
 .mock-bottom a{height:56px!important;min-height:56px!important}
 body.home{padding-bottom:84px!important}
}

/* v8.5 solid square-edge bottom nav + correct active tab */
.mock-bottom{
 bottom:0!important;
 width:min(100%,680px)!important;
 height:68px!important;
 min-height:68px!important;
 padding:5px 8px!important;
 border-radius:0!important;
 border-left:1px solid #24262a!important;
 border-right:1px solid #24262a!important;
 border-top:1px solid #2c2e32!important;
 border-bottom:0!important;
 background:#111315!important;
 backdrop-filter:none!important;
 -webkit-backdrop-filter:none!important;
 box-shadow:0 -5px 18px rgba(0,0,0,.28)!important;
}
.mock-bottom a{
 height:58px!important;
 min-height:58px!important;
 border-radius:0!important;
 background:transparent!important;
 color:#8f9298!important;
}
.mock-bottom a.active{
 background:transparent!important;
 color:#fff!important;
}
.mock-bottom a.active b{
 color:#ff1744!important;
}
.mock-bottom a:not(.active) b{
 color:#8f9298!important;
}
.mock-bottom a b.random{
 border-radius:9px!important;
}
.mock-bottom a.active b.random{
 background:#ff1744!important;
 color:#fff!important;
}
body.home{padding-bottom:70px!important}
@media(max-width:600px){
 .mock-bottom{
   bottom:0!important;
   width:100%!important;
   height:66px!important;
   min-height:66px!important;
   border-radius:0!important;
 }
 .mock-bottom a{height:56px!important;min-height:56px!important}
 body.home{padding-bottom:68px!important}
}

/* v8.6 responsive grid + softly rounded bottom navigation */

/* Mobile = exactly 2 video cards */
.mock-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}

/* Desktop = exactly 4 video cards */
@media (min-width:769px){
  .mock-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
}

/* Bottom nav: slight rounding, solid background, still sits low */
.mock-bottom{
  bottom:4px!important;
  width:min(calc(100% - 16px),680px)!important;
  border-radius:16px!important;
  border:1px solid #292b30!important;
  background:#111315!important;
  overflow:hidden!important;
  box-shadow:0 -4px 18px rgba(0,0,0,.30)!important;
}
.mock-bottom a{
  border-radius:11px!important;
}
.mock-bottom a.active{
  background:#202226!important;
}
.mock-bottom a.active b{
  color:#ff1744!important;
}
@media(max-width:600px){
  .mock-bottom{
    bottom:4px!important;
    width:calc(100% - 12px)!important;
    border-radius:15px!important;
  }
}

/* v8.7 - bottom navigation flush to screen bottom */
.mock-bottom{
  bottom:0!important;
}
@media(max-width:600px){
  .mock-bottom{
    bottom:0!important;
  }
}

/* v8.9 - ONLY pagination vertical alignment */
.xh-pagination{
  transform:translateY(0)!important;
}

/* v9.7 ONLY: remove black flash before homepage video first frame */
.xh-card-video.xh-instant-video{
  background:#202020!important;
}

/* v10.2 ONLY - professional category right arrow */
.mock-chips{
  position:relative!important;
}
.mock-chips .xh-cat-next{
  position:sticky!important;
  right:5px!important;
  flex:0 0 38px!important;
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  padding:0!important;
  margin-left:3px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:50%!important;
  background:#17191d!important;
  color:#fff!important;
  z-index:20!important;
  box-shadow:-12px 0 18px #090b0d,0 5px 16px rgba(0,0,0,.38)!important;
  cursor:pointer!important;
  transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease,opacity .18s ease!important;
}
.mock-chips .xh-cat-next svg{
  width:19px!important;
  height:19px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2.35!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.mock-chips .xh-cat-next:hover,
.mock-chips .xh-cat-next:active{
  background:#23252a!important;
  color:#ff1744!important;
  border-color:rgba(255,23,68,.55)!important;
  transform:translateX(2px)!important;
}
.mock-chips .xh-cat-next.is-end{
  opacity:.28!important;
  pointer-events:none!important;
}

/* v10.3 integrated category navigation */
.mock-chips{
  position:relative!important;
  align-items:center!important;
}
.mock-chips .xh-cat-prev,
.mock-chips .xh-cat-next{
  position:sticky!important;
  flex:0 0 32px!important;
  width:32px!important;height:32px!important;min-width:32px!important;
  padding:0!important;margin:0!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  border:1px solid rgba(255,255,255,.08)!important;
  border-radius:10px!important;
  background:#202226!important;
  color:#d8d9dc!important;
  box-shadow:none!important;
  z-index:30!important;
  cursor:pointer!important;
  opacity:1!important;
  transition:background .18s ease,color .18s ease,opacity .18s ease,border-color .18s ease!important;
}
.mock-chips .xh-cat-prev{left:3px!important;order:-1!important;margin-right:5px!important}
.mock-chips .xh-cat-next{right:3px!important;margin-left:5px!important}
.mock-chips .xh-cat-prev svg,
.mock-chips .xh-cat-next svg{
  width:16px!important;height:16px!important;
  fill:none!important;stroke:currentColor!important;
  stroke-width:2.1!important;stroke-linecap:round!important;stroke-linejoin:round!important;
}
.mock-chips .xh-cat-prev:hover,
.mock-chips .xh-cat-next:hover,
.mock-chips .xh-cat-prev:active,
.mock-chips .xh-cat-next:active{
  background:#292b30!important;
  border-color:rgba(255,255,255,.14)!important;
  color:#ff3156!important;
  transform:none!important;
}
.mock-chips .xh-cat-prev.is-hidden,
.mock-chips .xh-cat-next.is-hidden{
  opacity:0!important;
  pointer-events:none!important;
  width:0!important;min-width:0!important;
  flex-basis:0!important;
  margin-left:0!important;margin-right:0!important;
  border:0!important;
  overflow:hidden!important;
}

/* v10.4 ONLY - category arrows flush with both edges */
.mock-chips .xh-cat-prev{
  left:0!important;
  margin-left:0!important;
  margin-right:5px!important;
}
.mock-chips .xh-cat-next{
  right:0!important;
  margin-right:0!important;
  margin-left:5px!important;
}

/* v10.5 ONLY - arrows completely flush to category strip edges */
.mock-chips{
  padding-left:0!important;
  padding-right:0!important;
}
.mock-chips .xh-cat-prev{
  left:0!important;
  margin-left:0!important;
  border-left:0!important;
  border-top-left-radius:0!important;
  border-bottom-left-radius:0!important;
  box-shadow:8px 0 14px rgba(9,11,13,.72)!important;
}
.mock-chips .xh-cat-next{
  right:0!important;
  margin-right:0!important;
  border-right:0!important;
  border-top-right-radius:0!important;
  border-bottom-right-radius:0!important;
  box-shadow:-8px 0 14px rgba(9,11,13,.72)!important;
}

/* v10.6.2 ONLY: preserve thumbnail/poster while the first video frame loads */
.xh-card-video{background:#202020!important;object-fit:cover!important}

/* v10.7 ONLY: real Poster First -> Video transition */
.mock-card{position:relative!important}
.xh-card-poster{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
  z-index:2!important;
  opacity:1!important;
  visibility:visible!important;
  transition:opacity .16s ease!important;
  pointer-events:none!important;
}
.xh-card-video.xh-wait-frame{
  position:relative!important;
  z-index:1!important;
}
.xh-card-video.xh-wait-frame.xh-frame-ready{
  z-index:3!important;
}
.xh-card-poster.xh-poster-hide{
  opacity:0!important;
  visibility:hidden!important;
}
.mock-play,.mock-caption{
  position:absolute!important;
  z-index:5!important;
}

/* v10.8 ONLY: homepage cards are poster-only, full-bleed, no black video loading */
.mock-media{position:relative!important;overflow:hidden!important}
.xh-card-poster.xh-poster-only{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  display:block!important;
  object-fit:cover!important;
  object-position:center!important;
  opacity:1!important;
  visibility:visible!important;
  z-index:2!important;
  background:transparent!important;
}
.mock-play,.mock-caption{z-index:5!important}
