/* SmileDice Sport v18.39.19: nine approved banner assets and real Tipster list.
   This file is loaded after the original theme so its colors always match. */

#sport-screen .sp-hero.sp-hero-2026{
  aspect-ratio:3/1!important;
  height:auto!important;
  min-height:0!important;
  background:#06142a!important;
  background-image:none!important;
  border:1px solid #3c95df!important;
  border-radius:14px!important;
  overflow:hidden!important;
  box-shadow:0 0 0 1px #46c2ff25 inset,0 0 15px #236edb3d!important;
}
#sport-screen .sp-hero.sp-hero-2026 .sp-hero-art{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:fill!important;
  object-position:center!important;
  user-select:none!important;
  pointer-events:none!important;
}
#sport-screen .sp-hero.sp-hero-2026 .sp-hero-art.sp-hero-reveal{
  animation:sd-sport-hero-enter .48s ease-out both;
}
@keyframes sd-sport-hero-enter{
  from{opacity:.55;filter:brightness(.83)}
  to{opacity:1;filter:brightness(1)}
}
#sport-screen .sp-hero-image-action{
  position:absolute;
  z-index:2;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  background:transparent!important;
  border:0!important;
  padding:0;
  color:transparent;
  cursor:pointer;
}
#sport-screen .sp-hero-image-action:focus-visible{
  outline:3px solid #56e8fa;
  outline-offset:-5px;
  border-radius:12px;
}
/* Keep the EXISTING arrows functional, and cover the arrows baked into the
   preview bitmaps so visitors see only one set of controls. */
#sport-screen .sp-hero.sp-hero-2026 .sp-hero-arrow{
  width:36px!important;
  height:45px!important;
  z-index:4!important;
  border:1px solid #538bd3!important;
  background:#0b2347f2!important;
  color:#eefaff!important;
  box-shadow:0 0 12px #071832c7!important;
}
#sport-screen .sp-hero.sp-hero-2026 .sp-hero-arrow:hover{
  background:#1c4c88!important;
}
#sport-screen .sp-hero.sp-hero-2026 .sp-hero-indicators{
  z-index:4!important;
  bottom:7px!important;
  display:flex!important;
  gap:6px!important;
  padding:7px 12px!important;
  border:1px solid #2f5e9b5c!important;
  border-radius:24px!important;
  background:#07172eea!important;
  box-shadow:0 0 12px #031326b5!important;
}
#sport-screen .sp-hero.sp-hero-2026 .sp-hero-indicators button{
  width:8px!important;
  height:8px!important;
  min-width:8px!important;
  border-radius:50%!important;
  background:#708aaf!important;
  transition:background .2s,box-shadow .2s,transform .2s!important;
}
#sport-screen .sp-hero.sp-hero-2026 .sp-hero-indicators button.is-selected{
  width:15px!important;
  min-width:15px!important;
  border-radius:9px!important;
  background:#20e8f4!important;
  box-shadow:0 0 9px #2ed5ffbd!important;
}
#sport-screen .sp-hero.sp-hero-2026 .sp-hero-indicators button:focus-visible{
  outline:2px solid #fff!important;
  outline-offset:3px;
}
@media(max-width:570px){
  #sport-screen .sp-hero.sp-hero-2026{aspect-ratio:3/1!important;min-height:0!important}
  #sport-screen .sp-hero.sp-hero-2026 .sp-hero-arrow{
    width:25px!important;height:33px!important;font-size:17px!important
  }
  #sport-screen .sp-hero.sp-hero-2026 .sp-hero-indicators{
    padding:4px 8px!important;gap:4px!important;bottom:2px!important
  }
  #sport-screen .sp-hero.sp-hero-2026 .sp-hero-indicators button{
    width:6px!important;min-width:6px!important;height:6px!important
  }
  #sport-screen .sp-hero.sp-hero-2026 .sp-hero-indicators button.is-selected{
    width:11px!important;min-width:11px!important
  }
}
@media(prefers-reduced-motion:reduce){
  #sport-screen .sp-hero.sp-hero-2026 .sp-hero-art.sp-hero-reveal{animation:none!important}
}

/* Full-width Top Tipsters, made ONLY from actual SQL 52 ranking rows. */
#sport-screen .sd-top-list-panel{
  margin:0 0 16px;
  padding:13px;
  min-width:0;
  container-type:inline-size;
  border:1px solid #315e95;
  border-radius:16px;
  background:linear-gradient(145deg,#0b223c,#07182b 77%);
  box-shadow:0 8px 23px #0005,inset 0 1px #72c9ff1c;
}
#sport-screen .sd-top-list-heading{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin-bottom:11px;padding:2px 6px 12px;border-bottom:1px solid #2a527a;
}
#sport-screen .sd-top-list-heading h3{
  margin:0;font-size:19px;font-weight:950;color:#f1f7ff;
}
#sport-screen .sd-top-list-heading span{
  font-size:10px;color:#8aafd1;font-weight:800;white-space:nowrap;
}
#sport-screen .sd-top-list{display:grid;gap:10px}
#sport-screen .sd-top-list-row{
  display:grid;
  grid-template-columns:48px minmax(138px,1.6fr) minmax(64px,.8fr) minmax(64px,.75fr) minmax(76px,.9fr) minmax(122px,1.4fr);
  gap:10px;
  align-items:center;
  min-height:85px;
  min-width:0;
  padding:10px 15px;
  border:1px solid #244a78;
  border-radius:18px;
  background:linear-gradient(105deg,#102c4f 0%,#0b1d38 55%,#08162b 100%);
  transition:border-color .18s,background .18s,transform .18s;
}
#sport-screen .sd-top-list-row:hover{
  border-color:#4389c7;
  background:linear-gradient(105deg,#123458,#102641 60%,#0b1d34);
}
#sport-screen .sd-top-list-medal{
  display:grid;place-items:center;
  width:43px;height:43px;border-radius:50%;
  font-size:23px;font-weight:1000;
  color:#d3e5f1;background:linear-gradient(130deg,#435f75,#243348);
}
#sport-screen .sd-top-list-medal.is-1{background:linear-gradient(140deg,#ffe28a,#ffbd31);color:#483000}
#sport-screen .sd-top-list-medal.is-2{background:linear-gradient(140deg,#f5f8ff,#9eacc8);color:#2e4260}
#sport-screen .sd-top-list-medal.is-3{background:linear-gradient(140deg,#ffd6af,#d18a50);color:#532b11}
#sport-screen .sd-top-list-user{
  display:flex;flex-direction:row;align-items:center;gap:12px;
  min-width:0;cursor:pointer;
}
#sport-screen .sd-top-list-user .sd-rank-avatar.is-large{width:53px;height:53px;flex:0 0 53px}
#sport-screen .sd-top-list-user strong{
  display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;
  color:#f7fbff;white-space:nowrap;font-size:14px;font-weight:950;
}
#sport-screen .sd-top-list-crown{color:#e7d06c;font-size:15px}
#sport-screen .sd-top-list-stat{min-width:0;display:grid;gap:4px;text-align:center}
#sport-screen .sd-top-list-stat small,
#sport-screen .sd-top-list-profit small{
  font-size:10px;color:#a4bdd6;font-weight:750;
}
#sport-screen .sd-top-list-stat strong{
  font-size:15px;color:#48dffc;font-weight:1000;white-space:nowrap;
}
#sport-screen .sd-top-list-stat strong.is-positive,
#sport-screen .sd-top-list-profit strong.is-positive{color:#26efb6}
#sport-screen .sd-top-list-stat strong.is-negative,
#sport-screen .sd-top-list-profit strong.is-negative{color:#ff819f}
#sport-screen .sd-top-list-record{font-variant-numeric:tabular-nums}
#sport-screen .sd-top-list-record em{font-style:normal;color:#30f1b7}
#sport-screen .sd-top-list-record span{color:#ff789e}
#sport-screen .sd-top-list-profit{
  display:grid;gap:4px;min-width:0;text-align:right;justify-items:end;
}
#sport-screen .sd-top-list-profit strong{
  font-size:18px;font-weight:1000;color:#30f1b7;
  white-space:nowrap;font-variant-numeric:tabular-nums;
}
#sport-screen .sd-top-list-empty{
  margin:0;padding:20px;color:#a7c4df;font-size:12px;text-align:center;
}
/* The Sport center column may be narrow even on a wide desktop when the
   sidebar and chat are visible. Container queries protect that layout too. */
@container (max-width:680px){
  #sport-screen .sd-top-list-row{
    grid-template-columns:44px minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);
    grid-template-areas:'medal user user profit' 'medal yield picks record';
    column-gap:7px;row-gap:8px;
  }
  #sport-screen .sd-top-list-medal{grid-area:medal}
  #sport-screen .sd-top-list-user{grid-area:user}
  #sport-screen .sd-top-list-stat:nth-of-type(1){grid-area:yield}
  #sport-screen .sd-top-list-stat:nth-of-type(2){grid-area:picks}
  #sport-screen .sd-top-list-stat:nth-of-type(3){grid-area:record}
  #sport-screen .sd-top-list-profit{grid-area:profit}
  #sport-screen .sd-top-list-profit strong{font-size:14px}
}
@container (max-width:425px){
  #sport-screen .sd-top-list-row{
    grid-template-columns:39px repeat(3,minmax(0,1fr));
    grid-template-areas:'medal user user user' 'yield picks record record' 'profit profit profit profit';
  }
  #sport-screen .sd-top-list-profit{padding-top:5px;border-top:1px solid #284970}
}
@media(max-width:780px){
  #sport-screen .sd-top-list-row{
    grid-template-columns:44px minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);
    grid-template-areas:'medal user user profit' 'medal yield picks record';
    column-gap:7px;row-gap:8px;
  }
  #sport-screen .sd-top-list-medal{grid-area:medal}
  #sport-screen .sd-top-list-user{grid-area:user}
  #sport-screen .sd-top-list-stat:nth-of-type(1){grid-area:yield}
  #sport-screen .sd-top-list-stat:nth-of-type(2){grid-area:picks}
  #sport-screen .sd-top-list-stat:nth-of-type(3){grid-area:record}
  #sport-screen .sd-top-list-profit{grid-area:profit}
  #sport-screen .sd-top-list-profit strong{font-size:14px}
}
@media(max-width:510px){
  #sport-screen .sd-top-list-panel{padding:9px}
  #sport-screen .sd-top-list-row{
    padding:9px 7px;
    grid-template-columns:39px repeat(3,minmax(0,1fr));
    grid-template-areas:'medal user user user' 'yield picks record record' 'profit profit profit profit';
  }
  #sport-screen .sd-top-list-medal{width:36px;height:36px;font-size:19px}
  #sport-screen .sd-top-list-user strong{font-size:12px}
  #sport-screen .sd-top-list-user .sd-rank-avatar.is-large{width:40px;height:40px;flex-basis:40px}
  #sport-screen .sd-top-list-stat strong{font-size:12px}
  #sport-screen .sd-top-list-profit{padding-top:5px;border-top:1px solid #284970}
  #sport-screen .sd-top-list-profit small{font-size:9px}
  #sport-screen .sd-top-list-profit strong{font-size:15px}
}

/* Follow / Following = the existing Add Pick royal-blue CTA. */
#sport-screen article.sp-pick .sp-pick-bottom button.sp-social-follow{
  color:#f7faff!important;
  background:linear-gradient(115deg,#2456a6,#163774)!important;
  border:1px solid #63acfa!important;
  box-shadow:0 0 11px #3f83fa8b!important;
}
#sport-screen article.sp-pick .sp-pick-bottom button.sp-social-follow:hover{
  filter:brightness(1.12)!important;
}
/* FREE (real coupons only) = the same mint gradient as Deposit. */
#sport-screen article.sp-pick:not(.sp-pick-demo) .sp-pick-bottom .sp-free-badge:not(.sp-premium-badge){
  color:#061e20!important;
  border:1px solid #b1ffe6!important;
  background:linear-gradient(108deg,#66ffe0 0%,#28f4b3 48%,#11eab6 100%)!important;
  box-shadow:0 0 18px #28f4b351,0 6px 18px #11eab625!important;
}