@charset "UTF-8";

.sp-predictions-page{
  display:grid;
  width:100%;
  min-width:0;
  max-width:100%;
  gap:clamp(28px,4vw,48px);
  padding-bottom:44px;
}

.sp-predictions-page > *{
  min-width:0;
  max-width:100%;
}

.sp-predictions-page__breadcrumbs{
  margin-bottom:-6px;
}

.sp-predictions-hero{
  padding:0;
  margin:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  overflow:visible;
}

.sp-predictions-hero h1{
  margin:0;
  max-width:900px;
  color:var(--sp-text);
  font-size:clamp(34px,5vw,62px);
  font-weight:var(--sp-fw-medium);
  line-height:1.02;
  letter-spacing:-.055em;
}

/* ---------------------------------------------------------
   Sticky league capsules
   --------------------------------------------------------- */

.sp-predictions-league-nav{
  position:sticky;
  top:calc(var(--sp-header-height) + 12px);
  z-index:20;
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:var(--sp-filter-capsule-gap);
  width:100%;
  max-width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  padding:0;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  scrollbar-width:none;
  -ms-overflow-style:none;
  -webkit-overflow-scrolling:touch;
  scroll-behavior:smooth;
  transition:
    background-color var(--sp-filter-capsule-sticky-transition-duration) var(--sp-filter-capsule-sticky-transition-ease),
    box-shadow var(--sp-filter-capsule-sticky-transition-duration) var(--sp-filter-capsule-sticky-transition-ease);
}

.sp-predictions-league-nav::-webkit-scrollbar{
  display:none;
}

.sp-predictions-league-nav__button{
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  justify-content:center;
  min-height:var(--sp-filter-capsule-min-height);
  padding:var(--sp-filter-capsule-padding);
  border:1px solid var(--sp-filter-capsule-border);
  border-radius:var(--sp-radius-pill);
  background:var(--sp-filter-capsule-bg);
  color:var(--sp-filter-capsule-text);
  box-shadow:var(--sp-filter-capsule-shadow);
  font-size:var(--sp-filter-capsule-font-size);
  font-weight:var(--sp-filter-capsule-font-weight);
  line-height:1;
  text-decoration:none;
  white-space:nowrap;
  transition:
    background var(--sp-transition-fast),
    border-color var(--sp-transition-fast),
    color var(--sp-transition-fast),
    box-shadow var(--sp-transition-fast);
}

.sp-predictions-league-nav__button:hover,
.sp-predictions-league-nav__button:focus-visible{
  background:var(--sp-filter-capsule-hover-bg);
  border-color:var(--sp-filter-capsule-hover-border);
  color:var(--sp-filter-capsule-hover-text);
  box-shadow:var(--sp-filter-capsule-hover-shadow);
}

.sp-predictions-league-nav__button.is-active,
.sp-predictions-league-nav__button[aria-current="true"]{
  background:var(--sp-filter-capsule-active-bg);
  border-color:var(--sp-filter-capsule-active-border);
  color:var(--sp-filter-capsule-active-text);
  box-shadow:var(--sp-filter-capsule-active-shadow);
}

.sp-predictions-league-nav.is-stuck{
  top:var(--sp-filter-capsule-sticky-top) !important;
  padding-top:var(--sp-filter-capsule-sticky-padding-y) !important;
  padding-bottom:var(--sp-filter-capsule-sticky-padding-y) !important;
  padding-left:var(--sp-filter-capsule-sticky-padding-x) !important;
  padding-right:var(--sp-filter-capsule-sticky-padding-x) !important;
  background:transparent !important;
  box-shadow:none !important;
}

body.admin-bar .sp-predictions-league-nav.is-stuck{
  top:calc(var(--sp-filter-capsule-sticky-top) + 32px) !important;
}

.sp-shell::before{
  content:"";
  position:fixed;
  top:var(--sp-teams-filter-stuck-top,var(--sp-filter-capsule-sticky-top));
  left:var(--sp-filter-capsule-sticky-bg-left);
  width:var(--sp-filter-capsule-sticky-bg-width);
  height:var(--sp-teams-filter-stuck-height,0px);
  z-index:var(--sp-filter-capsule-sticky-bg-z-index);
  background:transparent;
  opacity:0;
  pointer-events:none;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  box-shadow:none;
  transition:
    opacity var(--sp-filter-capsule-sticky-transition-duration) var(--sp-filter-capsule-sticky-transition-ease),
    background-color var(--sp-filter-capsule-sticky-transition-duration) var(--sp-filter-capsule-sticky-transition-ease),
    box-shadow var(--sp-filter-capsule-sticky-transition-duration) var(--sp-filter-capsule-sticky-transition-ease);
}

body.has-sp-teams-filter-stuck .sp-shell::before{
  opacity:1;
  background:var(--sp-filter-capsule-sticky-bg);
  -webkit-backdrop-filter:blur(var(--sp-filter-capsule-sticky-backdrop-blur));
  backdrop-filter:blur(var(--sp-filter-capsule-sticky-backdrop-blur));
  border-bottom:var(--sp-filter-capsule-sticky-border-width) solid var(--sp-filter-capsule-sticky-border-color);
  box-shadow:var(--sp-filter-capsule-sticky-shadow);
}

/* ---------------------------------------------------------
   Current league sections
   --------------------------------------------------------- */

.sp-predictions-current{
  display:grid;
  gap:clamp(34px,5vw,58px);
  min-width:0;
}

.sp-predictions-section{
  display:grid;
  gap:18px;
  min-width:0;
  scroll-margin-top:calc(var(--sp-header-height) + 92px);
}

.sp-predictions-section__head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:16px;
  padding-bottom:14px;
  border-bottom:1px solid var(--sp-card-border);
}

.sp-predictions-section__head > div{
  display:grid;
  gap:6px;
  min-width:0;
}

.sp-predictions-section__head span{
  color:var(--sp-accent);
  font-size:var(--sp-fs-xs);
  font-weight:var(--sp-fw-black);
  letter-spacing:.08em;
  text-transform:uppercase;
}

.sp-predictions-section__head h2{
  margin:0;
  color:var(--sp-text);
  font-size:clamp(26px,3vw,42px);
  font-weight:var(--sp-fw-medium);
  line-height:1.05;
  letter-spacing:-.045em;
}

.sp-predictions-section__head > strong{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:42px;
  min-height:34px;
  padding:6px 10px;
  border:1px solid var(--sp-card-border);
  border-radius:var(--sp-radius-pill);
  background:var(--sp-white-04);
  color:var(--sp-muted);
  font-size:var(--sp-fs-sm);
  font-weight:var(--sp-fw-black);
}

.sp-predictions-section__empty,
.sp-predictions-archive__empty{
  margin:0;
  padding:18px 20px;
  border:1px dashed var(--sp-card-border);
  border-radius:var(--sp-radius-md);
  color:var(--sp-text-soft);
  line-height:1.55;
}

.sp-match-chunk{
  content-visibility:auto;
  contain-intrinsic-size:900px;
}

/* ---------------------------------------------------------
   Completed archive filters
   --------------------------------------------------------- */

.sp-predictions-archive{
  padding-top:4px;
}

.sp-predictions-archive__filters{
  display:grid;
  gap:14px;
  padding:16px;
  border:1px solid var(--sp-card-border);
  border-radius:var(--sp-radius-lg);
  background:var(--sp-white-025);
}

.sp-predictions-archive__league-filter{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:8px;
  max-width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
  -ms-overflow-style:none;
  -webkit-overflow-scrolling:touch;
}

.sp-predictions-archive__league-filter::-webkit-scrollbar{
  display:none;
}

.sp-predictions-filter-capsule{
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:8px 13px;
  border:1px solid var(--sp-filter-capsule-border);
  border-radius:var(--sp-radius-pill);
  background:var(--sp-filter-capsule-bg);
  color:var(--sp-filter-capsule-text);
  font:inherit;
  font-size:var(--sp-fs-xs);
  font-weight:var(--sp-fw-bold);
  line-height:1;
  cursor:pointer;
}

.sp-predictions-filter-capsule:hover,
.sp-predictions-filter-capsule:focus-visible{
  background:var(--sp-filter-capsule-hover-bg);
  border-color:var(--sp-filter-capsule-hover-border);
  color:var(--sp-filter-capsule-hover-text);
}

.sp-predictions-filter-capsule.is-active{
  background:var(--sp-filter-capsule-active-bg);
  border-color:var(--sp-filter-capsule-active-border);
  color:var(--sp-filter-capsule-active-text);
  box-shadow:var(--sp-filter-capsule-active-shadow);
}

.sp-predictions-archive__selects{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(180px,.45fr);
  gap:12px;
}

.sp-predictions-select{
  display:grid;
  gap:6px;
  min-width:0;
}

.sp-predictions-select > span{
  color:var(--sp-muted);
  font-size:var(--sp-fs-xs);
  font-weight:var(--sp-fw-bold);
}

.sp-predictions-select select{
  width:100%;
  min-width:0;
  min-height:44px;
  padding:0 38px 0 13px;
  border:1px solid var(--sp-card-border);
  border-radius:var(--sp-radius-md);
  background-color:var(--sp-surface);
  color:var(--sp-text);
  font:inherit;
  font-size:var(--sp-fs-sm);
}

.sp-predictions-select select:focus{
  outline:2px solid var(--sp-accent-alpha-35);
  outline-offset:1px;
  border-color:var(--sp-accent);
}

.sp-predictions-archive__stream{
  display:grid;
  gap:20px;
  min-width:0;
}

.sp-predictions-archive__status{
  min-height:20px;
  color:var(--sp-muted);
  font-size:var(--sp-fs-sm);
  text-align:center;
}

.sp-predictions-archive__sentinel{
  width:100%;
  height:1px;
}

.sp-predictions-pagination{
  display:flex;
  justify-content:center;
}

.sp-predictions-pagination[hidden]{
  display:none !important;
}

.sp-predictions-pagination a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:9px 15px;
  border:1px solid var(--sp-card-border);
  border-radius:var(--sp-radius-pill);
  background:var(--sp-white-04);
  color:var(--sp-text);
  font-weight:var(--sp-fw-bold);
  text-decoration:none;
}

.sp-predictions-page.has-infinite-scroll .sp-predictions-pagination{
  display:none;
}

.sp-predictions-page.has-infinite-scroll.is-archive-fetch-error .sp-predictions-pagination:not([hidden]){
  display:flex;
}

.sp-predictions-archive.is-loading{
  opacity:.72;
}

.sp-predictions-archive.is-loading .sp-predictions-archive__filters{
  pointer-events:none;
}

@media(max-width:900px){
  body.admin-bar .sp-predictions-league-nav.is-stuck{
    top:calc(var(--sp-filter-capsule-sticky-top) + 46px) !important;
  }

  .sp-predictions-archive__selects{
    grid-template-columns:1fr;
  }
}

@media(max-width:767px){
  .sp-predictions-page{
    gap:28px;
    padding-bottom:32px;
  }

  .sp-predictions-league-nav{
    top:calc(var(--sp-header-height) + 8px);
    margin-inline:-4px;
  }

  .sp-predictions-section__head{
    align-items:flex-start;
  }

  .sp-predictions-section__head h2{
    font-size:clamp(25px,8vw,34px);
  }

  .sp-predictions-archive__filters{
    padding:13px;
    border-radius:var(--sp-radius-mobile);
  }

  .sp-predictions-filter-capsule{
    min-height:36px;
    padding:8px 12px;
  }
}