/* Games: Splide on every viewport — 3 at a time on desktop, 1 at a time on mobile. */
.gfs-game-splide{
  width:100%;
  margin:0 auto;
  visibility:visible!important;
}
.gfs-game-splide .splide__track{
  overflow:hidden!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
}
.gfs-game-splide .splide__list.gfs-game-cards{
  display:flex!important;
  flex-flow:row nowrap!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:0!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:visible!important;
  scroll-snap-type:none!important;
  scroll-behavior:auto!important;
  overscroll-behavior:auto!important;
  scrollbar-width:auto!important;
}
.gfs-game-splide .gfs-game-card{
  flex:0 0 auto!important;
  min-width:0!important;
  max-width:none!important;
  height:auto!important;
  min-height:0!important;
  margin:0!important;
  scroll-snap-align:none!important;
  scroll-snap-stop:normal!important;
  padding:10px;
}
.gfs-game-splide .gfs-game-card__link{
  height:auto!important;
  min-height:318px;
}
.gfs-game-splide-actions.splide__arrows{
  display:flex!important;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:14px 0 2px;
  direction:rtl;
}
.gfs-game-splide-actions[hidden],
.gfs-game-splide.is-static .gfs-game-splide-actions{
  display:none!important;
}
.gfs-game-splide-actions .splide__arrow{
  position:static;
  transform:none;
  width:36px;
  height:36px;
  min-width:36px;
  min-height:36px;
  margin:0;
  padding:0;
  border:1px solid rgba(255,255,255,.22);
  border-radius:9px;
  background:rgba(255,255,255,.08);
  color:#fff;
  font:800 16px/1 Arial,sans-serif;
  opacity:1;
  cursor:pointer;
}
.gfs-game-splide-actions .splide__arrow:disabled{
  opacity:.35;
  cursor:default;
}

/* Requested: remove the explanatory leaderboard sentence on the homepage. */
.gfs-home .gfs-leaderboard-card .gigen-leaderboard-meta{
  display:none!important;
}

@media (max-width:767px){
  .gfs-game-splide .gfs-game-card__link{
    min-height:226px;
  }
  .gfs-game-splide-actions.splide__arrows{
    margin-top:10px;
  }
  .gfs-game-splide-actions .splide__arrow{
    width:34px;
    height:34px;
    min-width:34px;
    min-height:34px;
  }
}

/* Homepage news: use the same lightweight Splide behavior as Academy/Games. */
.gfs-news-splide{
  width:100%;
  margin:0 auto;
  visibility:visible!important;
}
.gfs-news-splide .splide__track{
  overflow:hidden!important;
  height:auto!important;
  min-height:0!important;
}
.gfs-news-splide .splide__list.gfs-news-grid{
  display:flex!important;
  grid-template-columns:none!important;
  flex-flow:row nowrap!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:0!important;
  height:auto!important;
  min-height:0!important;
}
.gfs-news-splide .gfs-news-card{
  min-width:0!important;
  width:auto;
  margin:0!important;
  height:auto!important;
  padding:14px !important;
}
.gfs-news-splide-actions.splide__arrows{
  display:flex!important;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:18px 0 0;
  direction:rtl;
}
.gfs-news-splide-actions[hidden],
.gfs-news-splide.is-static .gfs-news-splide-actions{
  display:none!important;
}
.gfs-news-splide-actions .splide__arrow{
  position:static;
  transform:none;
  width:36px;
  height:36px;
  min-width:36px;
  min-height:36px;
  margin:0;
  padding:0;
  border:1px solid rgba(255,255,255,.22);
  border-radius:9px;
  background:rgba(255,255,255,.08);
  color:#fff;
  font:800 16px/1 Arial,sans-serif;
  opacity:1;
  cursor:pointer;
}
.gfs-news-splide-actions .splide__arrow:disabled{
  opacity:.35;
  cursor:default;
}

@media (max-width:600px){
  .gfs-news-splide-actions.splide__arrows{margin-top:12px}
  .gfs-news-splide-actions .splide__arrow{
    width:34px;
    height:34px;
    min-width:34px;
    min-height:34px;
  }
}


/* 2026-09-22: mobile peek carousels. Desktop layouts intentionally stay unchanged. */
.gfs-news-mobile-splide,
.gfs-news-mobile-track{
  width:100%;
}
.gfs-news-mobile-actions{
  display:none;
}

@media (max-width:767px){
  /* A centered card with a visible neighbor on each side, including at index 0. */
  .gfs-game-splide .splide__slide.gfs-game-card{
    width:60%!important;
    max-width:60%!important;
    flex:0 0 60%!important;
  }

  /* News becomes a Splide only on phones; desktop remains the existing grid. */
  .gfs-news-mobile-splide.is-mobile-splide{
    visibility:visible!important;
    overflow:visible;
  }
  .gfs-news-mobile-splide.is-mobile-splide .splide__track{
    overflow:hidden!important;
    height:auto!important;
    min-height:0!important;
  }
  .gfs-news-mobile-splide.is-mobile-splide .gfs-news-grid.splide__list{
    display:flex!important;
    grid-template-columns:none!important;
    flex-flow:row nowrap!important;
    align-items:flex-start!important;
    gap:0!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
  }
  .gfs-news-mobile-splide.is-mobile-splide .gfs-news-card.splide__slide{
    width:60%!important;
    max-width:60%!important;
    flex:0 0 60%!important;
    min-width:0!important;
    margin:0!important;
    padding:5px!important;
  }
  .gfs-news-mobile-splide.is-mobile-splide .gfs-news-card__image{
    width:100%;
  }
  .gfs-news-mobile-actions.splide__arrows{
    display:flex!important;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin-top:10px;
    direction:rtl;
  }
  .gfs-news-mobile-actions .splide__arrow{
    position:static;
    transform:none;
    width:34px;
    height:34px;
    min-width:34px;
    min-height:34px;
    margin:0;
    padding:0;
    border:1px solid rgba(255,255,255,.22);
    border-radius:9px;
    background:rgba(255,255,255,.08);
    color:#fff;
    font:800 16px/1 Arial,sans-serif;
    opacity:1;
    cursor:pointer;
  }

  body.gfs-home .gfs-academy-content .gfsa-splide .gfsa-course-card.splide__slide,
  body.home .gfs-academy-content .gfsa-splide .gfsa-course-card.splide__slide{
    width:60%!important;
    max-width:60%!important;
    flex:0 0 60%!important;
  }
}
