
:root{
  --bs-body-bg:#00091f;
  --bs-body-bg-rgb:0,9,31;
  --bs-secondary-bg:#001542;
  --bs-primary:#174fd4;
  --bs-primary-rgb:23,79,212;
  --bs-link-color:#ffd22e;
  --bs-link-color-rgb:255,210,46;
  --bs-link-hover-color-rgb:255,176,0;
  --bs-border-color:#164cbf;
  --bs-border-color-rgb:22,76,191;
  --bs-border-color-translucent:rgba(57,113,255,.65);
  --card-bg:#061b5b;
  --card-bg-rgb:6,27,91;
}
html{scroll-behavior:smooth} body{min-height:100vh;background:
 radial-gradient(circle at 12% 8%,rgba(25,79,220,.28),transparent 27%),
 radial-gradient(circle at 90% 12%,rgba(255,190,0,.10),transparent 23%),
 linear-gradient(145deg,#000617 0%,#000b27 48%,#00113a 100%);background-attachment:fixed}
header.navbar,header .navbar{background:linear-gradient(180deg,rgba(1,18,66,.96),rgba(0,9,31,.92));box-shadow:0 8px 28px rgba(0,0,0,.34)}
.navbar-brand img{width:220px;height:auto;filter:drop-shadow(0 4px 8px rgba(0,0,0,.45))}
.card{border:1px solid rgba(57,113,255,.45);box-shadow:0 12px 35px rgba(0,0,0,.18)}
.provider-container{min-height:58px;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#00113c,#061b5b)}
.provider-container img{object-fit:contain}
.game-container{background:linear-gradient(150deg,rgba(8,36,116,.98),rgba(0,14,52,.98));box-shadow:0 8px 22px rgba(0,0,0,.25)}
.game-container:hover{box-shadow:0 12px 30px rgba(0,0,0,.42),0 4px 0 #ffd22e}
.game-image>img{width:100%;height:100%;object-fit:cover}
.progress{height:18px;background:#00091f;border:1px solid rgba(57,113,255,.45)}
.progress-bar{font-size:11px}
.btn-primary{box-shadow:0 3px 0 #9a6500,0 7px 15px rgba(0,0,0,.22)}
.btn-primary:hover{transform:translateY(-1px)}
.divider-text{font-weight:700;letter-spacing:.08em}
.search-container .form-control{background:#00091f;color:#fff;border-color:#164cbf;border-radius:1rem}
.search-container .form-control::placeholder{color:#9ba8c7}
.modal-content,.dropdown-menu{background:linear-gradient(145deg,#001542,#00091f)!important;color:#d9d9da}
#livechat-button{position:fixed;left:18px;bottom:18px;z-index:1080;display:flex;align-items:center;gap:8px;padding:11px 15px;border-radius:999px;background:linear-gradient(180deg,#ffd943,#e7a900);color:#00103a;border:2px solid #fff4a7;box-shadow:0 8px 25px rgba(0,0,0,.4);font-weight:800;text-decoration:none}
#livechat-button i{font-size:24px} #livechat-button:hover{transform:translateY(-2px);color:#00103a}
#backToTop{bottom:25px!important;right:22px!important;border-radius:50%;width:45px;height:45px;padding:0}
.footer-logo{width:180px;max-width:55vw;height:auto;margin-bottom:8px}
.seo-intro{background:linear-gradient(145deg,rgba(6,27,91,.92),rgba(0,9,31,.96));border:1px solid rgba(57,113,255,.42);border-radius:1rem;padding:1.2rem;margin-top:1.2rem;box-shadow:0 10px 30px rgba(0,0,0,.2)}
.seo-intro h1{font-size:1.25rem;color:#ffd22e;margin-bottom:.7rem}.seo-intro p{margin:0;color:#cbd3e7;line-height:1.7}
.data-note{font-size:12px;color:#9ba8c7;text-align:center;margin:.85rem 0 0}
.loading-placeholder{grid-column:1/-1;padding:2.5rem;text-align:center;color:#ffd22e}
@media(max-width:576px){#livechat-button{bottom:72px;left:12px;padding:9px 12px}#livechat-button span{display:none}.navbar-brand img{width:150px}.game-container{min-width:0!important}.row-cols-2>*{padding-left:4px;padding-right:4px}.game-container .game-pola{font-size:10px}}

/* =========================================================
   MOBILE STABILITY & PERFORMANCE OPTIMIZATION
   Prevent horizontal page movement, touch-hover jumps and CLS.
   ========================================================= */
html,
body{
  width:100%;
  max-width:100%;
  overflow-x:clip;
  overscroll-behavior-x:none;
  -webkit-text-size-adjust:100%;
}
body{
  position:relative;
  touch-action:pan-y;
}
*,*::before,*::after{
  box-sizing:border-box;
}
img,svg,video,canvas,iframe{
  max-width:100%;
}
header,main,footer,
.splide,.splide__track{
  max-width:100%;
}
.splide,
.splide__track{
  overflow:hidden;
}
.splide__list{
  touch-action:pan-y;
  will-change:transform;
}
#providerList .splide__slide{
  min-width:0;
}
#mainContainerGames{
  width:auto;
  min-width:0;
}
#mainContainerGames > *{
  min-width:0;
}
.game-container,
.game-container .ratio,
.game-container .game-image{
  min-width:0;
  max-width:100%;
}
.game-container .game-image > img{
  display:block;
}
.game-container .game-pola-hidden{
  max-width:100%;
}

/* Restore Bootstrap container widths on tablet/desktop.
   Mobile width restrictions are scoped only inside the mobile media query. */
@media (min-width:576px){
  .container{max-width:540px!important}
}
@media (min-width:768px){
  .container{max-width:720px!important}
}
@media (min-width:992px){
  .container{max-width:960px!important}
}
@media (min-width:1200px){
  .container{max-width:1140px!important}
}
@media (min-width:1400px){
  .container{max-width:1320px!important}
}

/* Desktop cards are designed around the original 215x145 thumbnails. */
@media (min-width:768px){
  main.container{
    margin-left:auto;
    margin-right:auto;
  }
  #mainContainerGames{
    width:auto;
  }
  .game-container .game-image > img{
    width:100%!important;
    height:100%!important;
    max-height:none!important;
    object-fit:cover;
  }
  .provider-container{
    margin-left:.5rem;
    margin-right:.5rem;
  }
}

/* Touch screens must not inherit desktop hover movement. */
@media (hover:none), (pointer:coarse){
  .game-container:hover,
  .game-container:active,
  .game-container:target,
  .tournament-items:hover,
  .tournament-items:active,
  .tournament-items:target{
    margin-top:0;
    transform:none;
    box-shadow:0 8px 22px rgba(0,0,0,.25);
  }
  .provider-container:hover,
  .provider-container:active,
  .provider-container:target{
    transform:none;
  }
  .btn-primary:hover,
  #livechat-button:hover{
    transform:none;
  }
}

@media (max-width:767.98px){
  body{
    background-attachment:scroll;
  }
  header .navbar{
    min-height:64px;
    padding:.35rem 0;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
  header .navbar .container{
    width:100%;
    max-width:100%;
    padding-left:10px;
    padding-right:10px;
    flex-wrap:nowrap;
    gap:6px;
  }
  .navbar-brand{
    flex:1 1 auto;
    min-width:0;
    margin-right:4px;
    overflow:hidden;
  }
  .navbar-brand img{
    display:block;
    width:auto;
    max-width:min(150px,39vw);
    max-height:44px!important;
  }
  header .btnNav{
    flex:0 0 auto;
    min-width:0;
  }
  header .btnNav .row{
    flex-wrap:nowrap;
  }
  header .btnNav .btn{
    min-width:58px;
    padding:.34rem .48rem;
    font-size:12px;
    white-space:nowrap;
  }
  .navbar-toggler{
    flex:0 0 auto;
    margin-left:2px!important;
  }
  header .navbar-collapse{
    position:absolute;
    top:calc(100% + 4px);
    left:10px;
    right:10px;
    width:auto;
    max-height:calc(100vh - 86px);
    overflow-y:auto;
    overscroll-behavior:contain;
    box-shadow:0 14px 35px rgba(0,0,0,.45);
  }
  header .navbar .dropdown-menu.split-list.show{
    width:100%;
    max-width:100%;
  }
  main.container{
    width:100%;
    max-width:100%;
    padding-left:10px;
    padding-right:10px;
  }
  .card{
    max-width:100%;
  }
  #providerList{
    width:100%;
    max-width:100%;
    overflow:hidden;
  }
  .provider-container{
    min-width:0;
    margin-left:3px;
    margin-right:3px;
    padding:.4rem;
  }
  #providerList img{
    max-width:100%;
    height:34px;
    object-fit:contain;
  }
  .search-container{
    width:100%;
    max-width:100%;
  }
  #mainContainerGames{
    --bs-gutter-x:8px;
    margin-left:-4px;
    margin-right:-4px;
  }
  #mainContainerGames > .col,
  #mainContainerGames > [class*="col-"]{
    padding-left:4px;
    padding-right:4px;
  }
  .game-container{
    width:100%;
    min-width:0!important;
    max-width:100%;
    margin-top:0!important;
    transform:none!important;
    transition:border-color .2s ease,box-shadow .2s ease;
    contain:layout paint;
  }
  .game-container .game-pola-hidden{
    left:0;
    width:100%;
    max-width:100%;
    bottom:calc(38px + .5rem);
    max-height:min(58vh,430px);
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
  }
  .game-container .game-detail{
    max-width:100%;
    overflow:hidden;
  }
  .game-detail .game-name,
  .game-detail .game-provider-name{
    max-width:100%;
  }
  .game-container .game-provider-icon{
    max-width:44px;
  }
  .game-badge-container{
    margin-left:-8px;
  }
  .userOnline{
    max-width:58%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-right:.2rem;
    padding:.25rem .4rem;
  }
  .seo-intro{
    overflow-wrap:anywhere;
  }
  #livechat-button{
    left:max(12px,env(safe-area-inset-left));
    bottom:max(72px,calc(env(safe-area-inset-bottom) + 64px));
  }
  #backToTop{
    right:max(12px,env(safe-area-inset-right))!important;
    bottom:max(16px,env(safe-area-inset-bottom))!important;
  }
  footer{
    overflow:hidden;
  }
  /* Expensive translucent filters can cause mobile scroll jitter. */
  .game-container .game-detail,
  .game-container .game-pola-hidden,
  .userOnline,
  .modal-content,
  .dropdown-menu{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
}

@media (max-width:389.98px){
  .navbar-brand img{
    max-width:124px;
  }
  header .btnNav .btn{
    min-width:51px;
    padding:.32rem .35rem;
    font-size:11px;
  }
  .navbar-toggler{
    --bs-navbar-toggler-padding-x:.4rem;
  }
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}


/* =========================================================
   MEGAPETIR THEME v3.0 — BLACK / WHITE / LIGHTNING GOLD
   ========================================================= */
:root{
  --bs-body-bg:#050505;
  --bs-body-bg-rgb:5,5,5;
  --bs-secondary-bg:#111111;
  --bs-primary:#ffd21a;
  --bs-primary-rgb:255,210,26;
  --bs-success:#f4f4f4;
  --bs-success-rgb:244,244,244;
  --bs-secondary:#d8d8d8;
  --bs-secondary-rgb:216,216,216;
  --bs-warning:#ffbf00;
  --bs-warning-rgb:255,191,0;
  --bs-info:#ffffff;
  --bs-info-rgb:255,255,255;
  --bs-light:#f5f5f5;
  --bs-dark:#050505;
  --bs-link-color:#ffd21a;
  --bs-link-color-rgb:255,210,26;
  --bs-link-hover-color-rgb:255,244,183;
  --bs-border-color:#c99b00;
  --bs-border-color-rgb:201,155,0;
  --bs-border-color-translucent:rgba(255,210,26,.38);
  --card-bg:linear-gradient(145deg,rgba(26,26,26,.98),rgba(5,5,5,.98));
  --card-bg-rgb:18,18,18;
}
html,body{background-color:#050505!important}
body{
  color:#f5f5f5;
  background:
    radial-gradient(circle at 12% 8%,rgba(255,210,26,.16),transparent 25%),
    radial-gradient(circle at 90% 14%,rgba(255,255,255,.09),transparent 22%),
    linear-gradient(145deg,#000 0%,#080808 48%,#111 100%)!important;
  background-attachment:fixed!important;
}
header.navbar,header .navbar{
  background:linear-gradient(180deg,rgba(12,12,12,.98),rgba(0,0,0,.96))!important;
  border-bottom:1px solid rgba(255,210,26,.68)!important;
  box-shadow:0 8px 30px rgba(0,0,0,.62),0 0 18px rgba(255,210,26,.12)!important;
}
.navbar-brand img,.footer-logo{filter:drop-shadow(0 0 9px rgba(255,210,26,.34)) drop-shadow(0 5px 10px rgba(0,0,0,.7))!important}
.navbar .nav-link{color:#f5f5f5!important}
.navbar .nav-link:hover,.navbar .nav-link:focus{color:#ffd21a!important}
.navbar-toggler{border-color:rgba(255,210,26,.72)!important;background:#f2f2f2!important}
.card,.seo-intro{
  background:linear-gradient(145deg,rgba(24,24,24,.98),rgba(3,3,3,.98))!important;
  border:1px solid rgba(255,210,26,.48)!important;
  box-shadow:0 12px 38px rgba(0,0,0,.45),inset 0 0 22px rgba(255,255,255,.025)!important;
}
.provider-container{
  background:linear-gradient(145deg,#1b1b1b,#050505)!important;
  border:1px solid rgba(255,210,26,.22);
  border-radius:.55rem;
}
.game-container{
  background:linear-gradient(150deg,rgba(25,25,25,.99),rgba(2,2,2,.99))!important;
  border-color:rgba(255,210,26,.48)!important;
  box-shadow:0 8px 24px rgba(0,0,0,.5)!important;
}
.game-container:hover{box-shadow:0 12px 30px rgba(0,0,0,.62),0 4px 0 #ffd21a!important}
.game-container.game-pola,.game-container.game-detail{background:linear-gradient(145deg,#161616,#050505)!important}
.progress{background:#050505!important;border-color:rgba(255,210,26,.55)!important}
.progress-bar{background:linear-gradient(90deg,#fff3a0,#ffd21a 55%,#b97c00)!important;color:#050505!important}
.btn-primary{
  color:#050505!important;
  background:linear-gradient(180deg,#fff6bd 0%,#ffd21a 50%,#b97c00 100%)!important;
  border-color:#ffd21a!important;
  box-shadow:0 3px 0 #7d5400,0 7px 18px rgba(0,0,0,.38),0 0 13px rgba(255,210,26,.2)!important;
}
.btn-primary:hover,.btn-primary:focus{color:#000!important;background:linear-gradient(180deg,#fffbdc,#ffd21a)!important;border-color:#fff2a3!important}
.btn-outline-primary{
  color:#fff!important;
  background:linear-gradient(180deg,#303030,#111)!important;
  border-color:#e9e9e9!important;
  box-shadow:inset 0 0 0 1px rgba(255,210,26,.23)!important;
}
.btn-outline-primary:hover,.btn-outline-primary:focus{color:#050505!important;background:linear-gradient(180deg,#fff,#d9d9d9)!important;border-color:#ffd21a!important}
.btn-secondary{color:#111!important;background:linear-gradient(180deg,#fff,#cfcfcf)!important;border-color:#fff!important}
.divider-text,.seo-intro h1,.loading-placeholder{color:#ffd21a!important;text-shadow:0 0 12px rgba(255,210,26,.24)}
.divider.divider-text:before,.divider.divider-text:after{border-top-color:rgba(255,210,26,.38)!important}
.search-container .form-control,.form-control,.select2-container--default .select2-selection--single{
  background:#080808!important;
  color:#fff!important;
  border-color:rgba(255,210,26,.55)!important;
}
.search-container .form-control::placeholder,.form-control::placeholder{color:#aaa!important}
.modal-content,.dropdown-menu,.select2-dropdown,.select2-results{
  background:linear-gradient(145deg,#181818,#030303)!important;
  color:#f5f5f5!important;
  border-color:rgba(255,210,26,.55)!important;
}
.dropdown-item,.dropdown-item a,.select2-results__option{color:#f4f4f4!important}
.dropdown-item:hover,.dropdown-item:focus,.select2-results__option--highlighted{background:#2b2200!important;color:#ffd21a!important}
#livechat-button{
  background:linear-gradient(180deg,#fff7c7,#ffd21a 52%,#b97c00)!important;
  color:#050505!important;
  border-color:#fff0a0!important;
  box-shadow:0 8px 25px rgba(0,0,0,.55),0 0 16px rgba(255,210,26,.28)!important;
}
footer{border-top:1px solid rgba(255,210,26,.25);background:linear-gradient(180deg,transparent,rgba(0,0,0,.72))}
.text-muted,.data-note,.seo-intro p{color:#cfcfcf!important}
@media(max-width:767.98px){body{background-attachment:scroll!important}}
