
.wgg-home-title{margin-bottom:24px}
.wgg-home-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:26px;align-items:start}
.wgg-home-feed,.wgg-home-native{min-width:0}
.wgg-home-native{padding-top:8px}
.wgg-home-native ins{display:block;max-width:100%}
.wgg-shelf{margin-bottom:38px}
.wgg-row-heading{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:18px}
.wgg-row-heading h2{font-size:22px;margin:0}
.wgg-view-all{font-size:12px;border:1px solid var(--line);border-radius:20px;padding:6px 12px;white-space:nowrap}
.video-content .wgg-home-feed .grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.wgg-rail-shell{display:flex;align-items:center;gap:8px}
.wgg-rail{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;min-width:0;flex:1;padding-bottom:12px}
.wgg-rail .card{flex:0 0 calc((100% - 32px)/3);min-width:0;scroll-snap-align:start}
.wgg-rail-shell>button{border:1px solid var(--line);background:var(--panel);color:white;border-radius:4px;padding:9px;font-size:25px}
.thumb .wgg-preview{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;pointer-events:none}
.thumb.wgg-previewing .wgg-preview{opacity:1}
.thumb .duration{z-index:2}
@media(max-width:1050px){
 .wgg-home-layout{grid-template-columns:200px minmax(0,1fr);gap:18px}
 .video-content .wgg-home-feed .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .wgg-rail .card{flex-basis:calc((100% - 16px)/2)}
}
@media(max-width:760px){
 .wgg-home-layout{display:flex;flex-direction:column}
 .wgg-home-feed{order:0;width:100%}
 .wgg-home-native{order:1;width:100%;max-width:320px;margin:0 auto 24px}
 .wgg-row-heading h2{font-size:19px}
 .wgg-rail .card{flex-basis:78%}
 .wgg-rail-shell>button{padding:5px}
}

/* WGG equal native and video widths v1 */
@media(min-width:1051px){
 .wgg-home-layout{
  grid-template-columns:minmax(0,1fr) minmax(0,3fr);
  gap:18px;
 }
 .wgg-home-feed .grid{
  column-gap:18px;
 }
 .wgg-home-native{
  width:100%;
  padding-top:0;
 }
}
.wgg-home-native [class*="item-title"],
.wgg-home-native [class*="item-title"] a{
 color:#eee!important;
}
.wgg-home-native [class*="item-brand"]{
 color:#a3a6b0!important;
}

@media(min-width:1051px){
 .wgg-home-layout{
  grid-template-columns:calc((100% - 54px)/4) minmax(0,1fr);
 }
}

/* WGG native image alignment v2 */
@media(min-width:1051px){
 .wgg-home-native>.ad-label{
  display:flex;
  align-items:center;
  height:34px;
  margin:0 0 18px;
 }
 .wgg-home-feed>.wgg-shelf:first-child>.wgg-row-heading{
  height:34px;
  margin-bottom:18px;
 }
 .wgg-home-native [id^="msg-native-widget-6071934-"]{
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
 }
 .wgg-home-native .msg-native-widget-outer-container{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:28px!important;
  margin:0!important;
  padding:0!important;
 }
 .wgg-home-native .msg-native-widget-item-container{
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
 }
 .wgg-home-native .msg-native-widget-item-image-wrapper{
  width:100%!important;
  height:auto!important;
  aspect-ratio:16/9!important;
  overflow:hidden;
  border-radius:5px;
 }
 .wgg-home-native .msg-native-widget-item-image-wrapper img{
  display:block;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
 }
}


/* WGG native alignment using actual widget markup */
@media (min-width:1051px){
  .wgg-home-native{
    padding-top:0!important;
  }
  .wgg-home-native > .ad-label{
    height:34px!important;
    display:flex!important;
    align-items:center!important;
    margin:0 0 18px!important;
    padding:0!important;
  }
  .wgg-home-feed > .wgg-shelf:first-child .wgg-row-heading{
    height:34px!important;
    margin:0 0 18px!important;
  }
  .wgg-home-native [id^="msg-native-widget-6071934"]{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
  }
  .wgg-home-native .msg-native-widget-header{
    height:0!important;
    margin:0!important;
    padding:0!important;
  }
  .wgg-home-native .msg-native-widget-outer-container{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:28px!important;
    height:auto!important;
    width:100%!important;
    margin:0!important;
  }
  .wgg-home-native .msg-native-widget-item-container{
    width:100%!important;
    margin:0!important;
    padding:0!important;
  }
  .wgg-home-native .msg-native-widget-item-image-wrapper{
    aspect-ratio:16/9!important;
    height:auto!important;
    border-radius:5px;
  }
  .wgg-home-native .msg-native-widget-item-image-ratio{
    padding:0!important;
  }
  .wgg-home-native .msg-native-widget-item-content{
    box-sizing:border-box!important;
    height:76px!important;
    max-height:76px!important;
    padding:9px 0 0!important;
  }
  .wgg-home-native .msg-native-widget-item-title{
    font-size:15px!important;
    line-height:22px!important;
    height:44px!important;
    margin:0 0 4px!important;
    color:#eee!important;
    overflow:hidden!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
  }
  .wgg-home-native .msg-native-widget-item-brand{
    font-size:12px!important;
    line-height:19px!important;
    color:#a3a6b0!important;
  }
  .video-content .wgg-home-feed .grid{
    row-gap:28px!important;
  }
  .wgg-home-feed .grid .card h2{
    box-sizing:border-box!important;
    height:44px!important;
    line-height:22px!important;
    margin:9px 0 4px!important;
    overflow:hidden!important;
  }
  .wgg-home-feed .grid .card .meta{
    height:19px!important;
    line-height:19px!important;
    margin:0!important;
  }
}


/* WGG category rail four cards */
@media (min-width:1051px) {
  .wgg-rail .card {
    flex: 0 0 calc((100% - 48px) / 4) !important;
  }
}


/* WGG show complete covers */
.card .thumb {
    background: #000 !important;
}
.card .thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
}

/* WGG cover ratio and zoom fix */
body .card .thumb {
    aspect-ratio: 16 / 10 !important;
    height: auto !important;
    background: #000 !important;
}
body .card .thumb img,
body .card:hover .thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    transform: none !important;
}
