
/* PREMIUM KEEP STRUCTURE - tidak mengubah struktur asli */
:root{--premium-bg:#050b12;--premium-card:#071322;--premium-line:#1b3b70;--premium-blue:#1377ff;--premium-cyan:#33e6ff;--premium-gold:#ffe36a;--premium-text:#ffffff;}
html{scroll-behavior:smooth} body{background:radial-gradient(circle at 50% 0,rgba(19,119,255,.25),transparent 28%),linear-gradient(180deg,#07111f 0,#050b12 58%,#03070d 100%)!important;color:#fff!important;}
.navbar{background:linear-gradient(180deg,#0b1728,#050b12)!important;border-bottom:1px solid rgba(51,230,255,.22)!important;box-shadow:0 8px 24px rgba(0,0,0,.35)!important;}
.logo{filter:drop-shadow(0 0 18px rgba(51,230,255,.28))!important;max-width:220px;height:auto!important;}
.news{background:linear-gradient(90deg,#0536ff,#061b7a,#0536ff)!important;border:1px solid rgba(51,230,255,.22)!important;border-radius:12px!important;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.35)!important;}
.marquee-text p{color:#fff!important;font-weight:700!important;text-shadow:0 1px 0 #001!important;}
.carousel,.carousel-inner,.carousel-item img{border-radius:16px!important;overflow:hidden;}
.carousel{box-shadow:0 18px 46px rgba(0,0,0,.42),0 0 0 1px rgba(51,230,255,.2)!important;}
.head-title{background:linear-gradient(135deg,#073184,#0754d8 55%,#02d3ff)!important;border:1px solid rgba(51,230,255,.35)!important;border-radius:14px!important;color:#fff!important;text-shadow:0 1px 0 #001!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 10px 24px rgba(0,0,0,.35)!important;letter-spacing:.4px!important;}
.provider-pilihan{gap:14px!important;}
.provider-colum,.provider-canvas{border-radius:18px!important;background:linear-gradient(180deg,#0d1b31,#06101c)!important;border:1px solid rgba(51,230,255,.20)!important;box-shadow:0 10px 26px rgba(0,0,0,.38)!important;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease!important;}
.provider-colum:hover,.provider-canvas:hover{transform:translateY(-3px)!important;border-color:rgba(51,230,255,.55)!important;box-shadow:0 16px 36px rgba(0,0,0,.46),0 0 24px rgba(19,119,255,.22)!important;}
.provider-canvas img{filter:drop-shadow(0 0 10px rgba(51,230,255,.15))!important;}
.label-logo{color:#fff!important;font-weight:800!important;text-shadow:0 1px 0 #001!important;}
.search{background:#06101c!important;border:1px solid rgba(51,230,255,.35)!important;color:#fff!important;border-radius:12px!important;box-shadow:inset 0 1px 10px rgba(0,0,0,.35)!important;}
.search::placeholder{color:#9ec6ff!important}.search-icon{background:linear-gradient(180deg,#073184,#051c4e)!important;border-radius:12px 0 0 12px!important;}
.card.game-one-half-slot{background:linear-gradient(180deg,#0a1727,#050b12)!important;border:1px solid rgba(51,230,255,.16)!important;border-radius:16px!important;box-shadow:0 12px 28px rgba(0,0,0,.42)!important;overflow:hidden!important;transition:transform .16s ease,border-color .16s ease!important;}
.card.game-one-half-slot:hover{transform:translateY(-4px)!important;border-color:rgba(51,230,255,.5)!important;}
.card-content{background:transparent!important}.card-content img{border-radius:14px 14px 8px 8px!important;}
.card-content b,.m-hide{color:#fff!important;font-weight:800!important;text-shadow:0 2px 5px rgba(0,0,0,.8)!important;}
.hover-btn{background:rgba(0,0,0,.42)!important;backdrop-filter:none!important}.play-btn{background:linear-gradient(135deg,#33e6ff,#1377ff)!important;color:#001225!important;border-radius:999px!important;font-weight:900!important;border:1px solid rgba(255,255,255,.25)!important;box-shadow:0 8px 24px rgba(19,119,255,.35)!important;}
.percent{background:#03070d!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:10px!important;overflow:hidden!important}.percent p{color:#fff!important;font-weight:900!important;text-shadow:0 1px 0 #000!important}.percent-bar.green{background:linear-gradient(90deg,#0bcf61,#b7ff5a)!important}.percent-bar.yellow{background:linear-gradient(90deg,#ffb000,#ffe36a)!important}.percent-bar.red{background:linear-gradient(90deg,#ff234f,#ff7a7a)!important}
.popup-container{background:rgba(0,0,0,.72)!important}.popup-body{background:linear-gradient(180deg,#071322,#020812)!important;border:1px solid rgba(51,230,255,.28)!important;border-radius:18px!important;color:#fff!important;box-shadow:0 30px 80px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.06)!important;}
.popup-header,.popup-label{background:linear-gradient(135deg,#073184,#0b5fff)!important;color:#fff!important;border-radius:12px!important}.popup-content{background:rgba(255,255,255,.04)!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:12px!important;color:#eaf5ff!important;margin-top:8px!important}.popup-close{background:#ff234f!important;color:#fff!important;border-radius:999px!important;}
.popip-button{border-radius:12px!important;margin-top:8px!important;box-shadow:0 10px 24px rgba(0,0,0,.35)!important}.bg-blue-button{background:linear-gradient(135deg,#1377ff,#33e6ff)!important}.bg-black-button{background:linear-gradient(135deg,#111827,#020617)!important;border:1px solid rgba(255,255,255,.14)!important}
.fixed-footer{background:rgba(5,11,18,.94)!important;border-top:1px solid rgba(51,230,255,.20)!important;box-shadow:0 -10px 30px rgba(0,0,0,.45)!important}.footer-item{color:#dff7ff!important}.footer-icon{color:#33e6ff!important} footer{background:#03070d!important;color:#a9d8ff!important;border-top:1px solid rgba(51,230,255,.16)!important}.footertext{background:rgba(5,11,18,.72)!important;border:1px solid rgba(51,230,255,.14)!important;border-radius:16px!important;padding:18px!important;color:#d9eaff!important}.footertext h1{color:#fff!important}
.admin-float{position:fixed;right:14px;bottom:86px;z-index:9998;background:linear-gradient(135deg,#33e6ff,#1377ff);color:#001225!important;font-weight:900;padding:10px 14px;border-radius:999px;text-decoration:none!important;box-shadow:0 14px 30px rgba(19,119,255,.35)}
@media(max-width:640px){.logo{width:175px!important}.head-title{font-size:14px!important}.provider-canvas{min-height:90px!important}.admin-float{bottom:78px;right:10px;font-size:12px;padding:8px 10px}.popup-body{width:94%!important;max-height:88vh!important;overflow:auto!important}}
/* FIX PROVIDER BIAR TIDAK DOUBLE */
.provider-pilihan {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 14px !important;
    padding: 10px 18px 22px !important;
}

.provider-pilihan a {
    width: 116px !important;
    display: block !important;
}

.provider-colum {
    float: none !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

.provider-colum:hover {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

.provider-canvas {
    width: 100% !important;
    height: 145px !important;
    padding: 8px !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, #0b1f3d 0%, #06111f 100%) !important;
    border: 1px solid rgba(34, 211, 238, 0.35) !important;
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.04),
        0 8px 20px rgba(0,0,0,.35) !important;
    overflow: hidden !important;
}

.provider-canvas:hover {
    transform: translateY(-3px) !important;
    border-color: rgba(56, 189, 248, .75) !important;
    box-shadow:
        0 12px 25px rgba(0,0,0,.45),
        0 0 18px rgba(37,99,235,.35) !important;
}

.provider-canvas img {
    width: 100% !important;
    height: 105px !important;
    object-fit: contain !important;
    padding: 5px !important;
}

.provider-canvas p,
.label-logo {
    height: 24px !important;
    line-height: 24px !important;
    margin: 0 -8px -8px !important;
    border-radius: 0 0 12px 12px !important;
    background: linear-gradient(180deg, #1010c9, #05057a) !important;
    color: #ffffff !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    text-align: center !important;
    text-shadow: 0 2px 3px #000 !important;
}


/* FIX GAME CARD BIAR CENTER DAN ADA SPACE KIRI KANAN */
.site-description {
    max-width: 1080px !important;
    margin: 0 auto !important;
    padding: 0 16px !important;
}

.site-description .slot {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: stretch !important;
    gap: 10px !important;
    width: 100% !important;
}

.site-description .slot > .wrapper,
.site-description .slot > .container {
    flex: 0 0 100% !important;
    width: 100% !important;
}

.card.game-one-half-slot,
.card.game-one-half-slot.slots-games {
    float: none !important;
    width: auto !important;
    flex: 0 1 calc(20% - 10px) !important;
    max-width: 205px !important;
    min-width: 175px !important;
    margin: 0 !important;
}

.card-content {
    margin: 0 !important;
    border-radius: 14px !important;
}

.card-content img {
    width: 100% !important;
    height: 145px !important;
    object-fit: cover !important;
    border-radius: 12px 12px 8px 8px !important;
}

.search {
    max-width: 100% !important;
}

.head-title {
    max-width: 760px !important;
    margin: 8px auto 14px !important;
}


/* RESPONSIVE HP */
@media (max-width: 900px) {
    .card.game-one-half-slot,
    .card.game-one-half-slot.slots-games {
        flex: 0 1 calc(33.333% - 10px) !important;
        min-width: 150px !important;
    }
}

@media (max-width: 640px) {
    .provider-pilihan a {
        width: 96px !important;
    }

    .provider-canvas {
        height: 118px !important;
    }

    .provider-canvas img {
        height: 82px !important;
    }

    .provider-canvas p,
    .label-logo {
        font-size: 10px !important;
    }

    .site-description {
        padding: 0 10px !important;
    }

    .card.game-one-half-slot,
    .card.game-one-half-slot.slots-games {
        flex: 0 1 calc(50% - 8px) !important;
        min-width: 0 !important;
    }

    .card-content img {
        height: 125px !important;
    }
}
