.active .bns,.bns{animation: .5s steps(16) infinite play;}
@font-face{font-display: swap;font-family: LakeshoreRegular;src: url('/fonts/Lakeshore-Regular.woff2') format('woff2'),url('/fonts/Lakeshore-Regular.woff') format('woff'),url('/fonts/Lakeshore-Regular.ttf') format('truetype');}
@font-face{font-display: swap;font-family: Poppins;font-style: normal;src: url('/fonts/pxiEyp8kv8JHgFVrJJnecmNE.woff2') format('woff2');}
body::-webkit-scrollbar{display: none;}
body{background: url('../images/backgrounds/home-style-bg.webp') center center/cover no-repeat fixed #1d242c;color: #fff;font-family: Poppins,sans-serif;line-height: 1.5;margin: 0;moz-user-select: none;ms-user-select: none;text-rendering: optimizeLegibility;user-select: none;webkit-user-select: none;}
.accordion-header,.card-title,.hero-subtitle,.hero-title,.modal-class-title,.modal-title,.section-title,.sprite-button,.sprite-button-smal,h1,h2,h3{font-family: 'Roboto', sans-serif;font-weight: 400;}
a,img{webkit-user-drag: none;}
.lazy-section{opacity: 0;transition: opacity .8s ease-in-out;will-change: opacity;}
.lazy-section.visible{opacity: 1;}
button{border: 0;cursor: pointer;font-size: 16px;outline: 0;}
.section-title{font-size: 2rem;font-weight: 100;margin-bottom: 2rem;text-align: center;}
.card{border: none;border-radius: 10px;box-shadow: 0 4px 8px rgba(0,0,0,.2);}
.card-body{padding: 2rem;}
.card-title{font-size: 1.9rem!important;}
.feature-card{background: url('../images/backgrounds/features-bg.webp') center center no-repeat rgba(255,255,255,.1);background-size: cover;box-shadow: 0 4px 8px rgba(0,0,0,.5);transition: transform .3s;}
.feature-card:hover{box-shadow: 0 8px 16px rgba(0,0,0,.5);transform: scale(1.05);}
.modal-content{background-color: #1d242c;border: none;border-radius: 10px;color: #fff;}
.modal-header{border-bottom: 1px solid #fff;}
.modal-title{font-size: 1.5rem;}
.btn-close{filter: invert(100%);}
.form-control{background-color: #333;border: 1px solid #fff;color: #fff;}
.form-control:focus{border-color: #fff;box-shadow: none;}
.accordion-button,.accordion-button:not(.collapsed){background-color: transparent;border: none;border-radius: 10px 10px 0 0;color: #fff;font-size: 1.5rem;outline: 0;padding: 1rem;position: relative;text-align: left;width: 100%;}
.accordion-button:hover{background-color: rgba(255,255,255,.2);border-radius: 10px 10px 0 0;}
.accordion-button:focus{border-radius: 10px 10px 0 0;box-shadow: none;}
#join-us-button,#join-us-button-mobile,.accordion-button::after,video{display: none;}
.accordion-button::before{color: #fc6b01;content: '\f078';font-family: FontAwesome;font-size: 1.2rem;position: absolute;right: 1rem;top: 50%;transform: translateY(-50%);transition: transform .3s;}
.accordion-button.collapsed::before{content: '\f077';transform: translateY(-50%) rotate(180deg);}
.accordion-item{background-color: rgba(32,37,43,.5);border: none;border-radius: 10px;box-shadow: 0 2px 10px rgba(0,0,0,.2);margin-bottom: 1rem;transition: box-shadow .3s;}
.accordion-item:hover{box-shadow: 0 0 8px #fc6b01!important;}
.accordion-header{background-color: rgba(32,37,43,.65);border: none!important;border-radius: 10px 10px 0 0;color: #fff!important;font-size: 1.25rem!important;font-weight: 700;transition: background .3s,box-shadow .3s;}
.accordion-header:hover{background: rgba(0,0,0,.7);box-shadow: 0 4px 8px rgba(0,0,0,.5);}
.accordion-body{background-color: rgba(32,37,43,.5);border-radius: 0 0 10px 10px;box-shadow: none;color: #fff!important;padding: 1rem;}
.carousel{position: relative;}
.carousel-item img{border-radius: 15px;}
.carousel-indicators{bottom: 0;display: flex;justify-content: center;left: 0;list-style: none;margin: 0;padding: 0;position: absolute;right: 0;z-index: 15;}
.carousel-indicators button{background-color: rgba(0,0,0,.5);border: none;cursor: pointer;height: 6px!important;margin: 0 4px;width: 40px!important;}
.carousel-indicators .active{background-color: rgba(253,113,13,.8);}
.mb-5{margin-bottom: 3rem;}
.lead{color: silver;font-size: 18px;font-style: italic;}
.logo-img{height: auto;vertical-align: middle;width: 300px;}
.sprite-button{background: url('../images/button/button_signup.webp') -2px -2px no-repeat;border: none;color: #fff;font-size: 30px;height: 92px;line-height: 40px;margin: 50px auto 0;text-align: center;width: 300px;}
.sprite-button:hover{background-position: -2px -106px;}
.sprite-button-smal{align-items: center;background: url('../images/button/button_signup_smal.webp') -16px -17px no-repeat;border: none;color: #fff;cursor: pointer;display: flex;font-size: 32px;height: 65px;justify-content: center;text-align: center;width: 237px;}
.stats-card {
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.stats-card .card-title {
    font-size: 1.2rem !important;
}

.stats-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.6);
}

.stats-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent);
    transition: left 0.5s;
}

.stats-card:hover::before {
    left: 100%;
}

.stats-icon {
    margin-bottom: 1rem;
    transition: transform 0.3s ease;
}

.stats-card:hover .stats-icon {
    transform: scale(1.1);
}

.stats-number {
    font-size: 1.5rem;
    font-weight: bold;
    background: linear-gradient(45deg, #fc6b01, #ff8c42);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

.online-indicator {
    animation: blink 2s infinite;
}

@keyframes blink {
    0%, 50% { opacity: 1; }
    51%, 100% { opacity: 0.5; }
}

.leaderboard-card {
    transition: all 0.3s ease;
}

.leaderboard-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.7);
}

.table-header {
    background: linear-gradient(45deg, #fc6b01, #ff8c42);
    color: white;
}

.rank-1 { color: #ffd700; font-weight: bold; }
.rank-2 { color: #c0c0c0; font-weight: bold; }
.rank-3 { color: #cd7f32; font-weight: bold; }

.player-name {
    font-weight: 600;
    color: #fff;
}

.player-level {
    color: #fc6b01;
    font-weight: bold;
}

.player-money {
    font-family: 'Courier New', monospace;
    color: #90EE90;
}
#playButton{background: url('../images/button/button-play-sprite.webp') -167px 0 no-repeat;height: 155px;left: 50%;outline: 0;position: absolute;top: 50%;transform: translate(-50%,-50%);width: 160px;z-index: 10;}
#playButton:hover{background-position: -4px 0;}
video::-webkit-media-controls{display: none!important;}
video::-webkit-media-controls-volume-slider{display: block!important;}
@media (max-width:768px){.video-container{height: 300px;}#playButton{height: 115px;width: 120px;}}
@media (min-width:769px) and (max-width:1200px){.video-container{height: 350px;}#playButton{height: 130px;width: 135px;}}
@media (min-width:1201px){.video-container{height: 400px;}#playButton{height: 155px;width: 160px;}}
.game-classes-nav{align-items: center;display: flex;flex-wrap: wrap;gap: 1px;justify-content: center;list-style-type: none;margin: 0;max-width: 100%;padding: 0;text-align: center;width: 100%;}
.game-classes-nav li{width: 100px;}
.game-classes-nav .game-classes-icon{background-position: 50% 0;background-repeat: no-repeat;background-size: 130px;cursor: pointer;display: block;height: 130px;margin: 0 auto 10px;position: relative;text-align: center;}
.game-classes-nav .game-classes-icon:hover{background-position-y: 100%!important;}
.game-classes-nav .game-classes-icon-title{bottom: -20px;color: silver;font-family: Poppins,sans-serif;font-size: 13px;font-style: italic;position: absolute;width: 100%;}
.game-classes-nav .game-classes-icon:hover .game-classes-icon-title{color: orange;}
.custom-modal{backdrop-filter: blur(5px);background-color: rgba(0,0,0,.8);display: none;height: 100%;left: 0;opacity: 0;position: fixed;top: 0;transition: opacity .5s;webkit-backdrop-filter: blur(5px);width: 100%;z-index: 1000;}
.custom-modal-content{align-items: center;background-color: transparent;display: flex;justify-content: center;margin: 5% auto;max-width: 1200px;min-height: 100px;opacity: 0;padding: 20px;transform: scale(.9);transition: opacity .5s,transform .5s;}
.modal-image,.modal-text{opacity: 0;transition: transform .5s,opacity .5s;}
.custom-modal-body{align-items: center;display: flex;scrollbar-width: none;}
.modal-image{flex-shrink: 0;transform: translateX(-100%);}
.modal-image img{height: auto;max-width: 500px;}
.modal-text{color: #fff;margin: 0 0 20px 20px;max-width: 100%;transform: translateX(100%);}
.modal-class-title{color: orange;font-size: 40px;margin-bottom: 10px;}
.modal-class-description{color: #e0e0e0;font-size: 14px;margin-bottom: 20px;}
.hero-content,.hero-content .hero-title,.hero-content-mobile .hero-title{font-size: 3rem;}
.close-button{background-image: url('../images/button/close-modal.webp');color: transparent;height: 64px;position: absolute;right: 10px;text-indent: -9999px;top: 10px;width: 64px;z-index: 1001;}
.custom-modal.show{display: block;opacity: 1;}
.custom-modal-content.show{opacity: 1;transform: scale(1);}
.modal-image.show,.modal-text.show{opacity: 1;transform: translateX(0);}
#modal-races-images{display: flex;flex-wrap: wrap;gap: 10px;}
.race-container{align-items: center;display: flex;flex-direction: column;}
.race-container img{height: auto;max-width: 30px;}
.race-container p{color: orange;font-size: 13px;font-style: italic;line-height: 1.2;margin-top: 5px;text-align: center;text-shadow: none;width: 100%;}
.info-row{align-items: flex-start;display: flex;justify-content: space-between;margin-top: 20px;}
.available-races{flex-grow: 1;margin-top: 17px;}
.difficulty{align-items: flex-start;display: flex;flex-direction: column;margin-top: 15px;}
.difficulty-stars{display: flex;gap: 5px;margin-top: 2px;}
.star{height: 30px;width: 30px;}
#preloader,.hero-overlay{display: flex;height: 100%;left: 0;top: 0;}
.star-filled{background-image: url('../images/star/star-filled.png');}
.star-empty{background-image: url('../images/star/star-empty.png');}
.custom-footer{background: rgba(0,0,0,.7);box-shadow: 0 -2px 8px rgba(0,0,0,.5);}
.hero-overlay{align-items: center;flex-direction: column;justify-content: center;pointer-events: none;position: absolute;width: 100%;z-index: 10;}
.hero-content,.hero-content-mobile{background: rgba(0,0,0,.1);color: #fff;padding: 2rem 0;pointer-events: auto;text-align: center;width: 100%;}
.hero-subtitle,.hero-title{line-height: 1.2;margin: 0;text-shadow: 2px 2px 5px rgba(0,0,0,.2);}
.hero-content{left: 50%;position: absolute;top: 50%;transform: translate(-50%,-50%);width: 100%;}
.hero-content .hero-subtitle{font-size: 2.5rem;margin-top: 1rem;}
.hero-content-mobile{font-size: 45rem;padding: 1.5rem 0;}
.hero-content-mobile .hero-subtitle{font-size: 1.8rem;margin-top: .5rem;}
.hero-logo-img{height: 155px;margin: 0 10px;object-fit: contain;width: 340px;}
@media (max-width:768px){.custom-modal-body{flex-direction: column;margin-top: 60px;max-height: 80vh;overflow-y: auto;}.custom-modal-body::-webkit-scrollbar{display: none;}.modal-image img{height: auto;max-width: 80%;}.close-button{margin-top: 10px;position: fixed;right: 20px;top: 10%;z-index: 1001;}.hero-content{display: none;}}
@media (min-width:769px){.hero-content-mobile{display: none;}}
@media (max-width:1024px){.hero-content{font-size: 6vw;}.hero-content .hero-title{font-size: 5vw;}.hero-content .hero-subtitle{font-size: 2rem;}}
#preloader{align-items: center;background-color: #000;justify-content: center;position: fixed;width: 100%;z-index: 9999;}
.bns{background: url("../images/button/devtracker_loading.png") left center;height: 42px;margin: 20px auto;opacity: 1;transition: opacity .5s;width: 100px;}
.bns.disabled{opacity: 0;}
@keyframes play{from{background-position: 0 0;}to{background-position: 0 -716px;}}