/* Two columns and two rows per horizontally swipeable feed page. */
#videoGrid {
  display: grid !important;
  width: 100%;
  grid-template-columns: none !important;
  grid-template-rows: repeat(2, auto);
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - 18px) / 2);
  gap: 24px 18px !important;
  overflow-x: auto !important;
  scroll-snap-type: none !important;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
}
#videoGrid::-webkit-scrollbar { display: none; }
#videoGrid > .video-page {
  display: contents !important;
  flex: 0 0 100% !important;
  width: 100%;
  min-width: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(2, auto);
  gap: 24px 18px;
  padding: 0 2px;
  scroll-snap-align: start;
}
#videoGrid .video-card { width: 100% !important; min-width: 0; max-width: none; }
#videoGrid .video-thumb { width: 100%; aspect-ratio: 16 / 9; }
.player video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #05060b;
}
.episode-buttons {
  max-height: 260px;
  overflow-y: auto;
}

@media (min-width: 761px) {
  #videoGrid { grid-auto-columns: calc((100% - 60px) / 4); gap: 26px 20px !important; }
  main .discover, main .home-block, .site-header {
    width: 100% !important;
    max-width: 1420px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 32px;
    padding-right: 32px;
  }
  .featured-rail {
    width: 100vw !important;
    max-width: none !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding: 28px 0 36px !important;
    gap: 24px !important;
    justify-content: center;
    overflow: hidden;
  }
  .featured-rail .rail-card {
    flex: 0 0 clamp(400px, 38vw, 700px) !important;
    width: auto !important;
    height: auto !important;
    aspect-ratio: 3 / 2;
  }
  #videoGrid .video-card h3 { font-size: 15px; }
  #videoGrid .card-meta { font-size: 12px; }
}