/* Isolated mobile/tablet presentation only. Desktop remains untouched. */
.bs-mobile-app{display:none!important}

@media only screen and (max-width:768px){
  html,body{margin:0!important;padding:0!important;width:100%!important;max-width:100%!important;overflow-x:hidden!important;background:#111!important;color:#fff!important}
  body.bs-mobile-mode>*:not(.bs-mobile-app):not(script){display:none!important}
  .bs-mobile-app{display:block!important;width:100%!important;min-height:100vh;background:#111;color:#fff;font-family:Arial,Helvetica,sans-serif}
  .bs-mobile-app *{box-sizing:border-box}
  .bs-mobile-app img{display:block;max-width:100%;height:auto}
  .bs-mobile-app a{color:inherit;text-decoration:none}

  .m-header{height:92px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 18px;background:linear-gradient(#050505,#121212 72%,#241d0f);border-bottom:2px solid #7a5e17}
  .m-register{justify-self:start}.m-register img{width:146px;max-width:24vw}
  .m-logo{justify-self:center}.m-logo img{width:220px;max-width:35vw}
  .m-menu{justify-self:end;width:44px;height:34px;display:flex;flex-direction:column;justify-content:space-between;padding:4px 0;border:0;background:transparent}
  .m-menu span{display:block;width:42px;height:3px;border-radius:3px;background:#d3a835}

  .m-wa{height:50px;display:flex;align-items:center;justify-content:center;gap:9px;background:linear-gradient(#4a4a4a,#161616);border-bottom:2px solid #b58b29}
  .m-wa img{width:38px}.m-wa strong{display:block;color:#ff0f0f;font-size:21px;line-height:1;font-weight:800}.m-wa small{display:block;color:#fff;font-size:15px;line-height:1.05;font-weight:700}

  .m-hero{position:relative;width:100%;aspect-ratio:768/442;background:#000;overflow:hidden}.m-hero-track{display:flex;width:100%;height:100%;transition:transform .45s ease}.m-hero-slide{flex:0 0 100%;width:100%;height:100%}.m-hero-slide img{width:100%;height:100%;object-fit:cover}.m-hero-dots{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);display:flex;gap:6px;z-index:2}.m-hero-dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.45)}.m-hero-dot.active{background:#fff}

  .m-ann{height:50px;display:flex;align-items:center;background:url("../images/mobile/announcement%20bar%20repeat-min.png") repeat-x center/auto 100%}
  .m-ann-icon{flex:0 0 55px;display:flex;justify-content:center}.m-ann-icon img{width:22px}
  .m-ann-box{flex:1;height:34px;margin-right:11px;display:flex;align-items:center;overflow:hidden;background:url("../images/mobile/announcement%20box.jpg") center/100% 100% no-repeat;border:1px solid rgba(255,255,255,.45)}
  .m-ann-text{padding-left:14px;white-space:nowrap;font-size:13px;color:#fff}

  .m-games{padding:28px 13px 27px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 12px}
  .m-game{position:relative;aspect-ratio:358/150;border-radius:5px;overflow:hidden;background-position:center;background-size:100% 100%;background-repeat:no-repeat}
  .m-game.sbobet{background-image:url("../images/mobile/game%20sbobet%20box-min.png")}
  .m-game.joker{background-image:url("../images/mobile/game%20jokergaming%20box-min.png")}
  .m-game.casino{background-image:url("../images/mobile/game%20sbobetcasino%20box-min.png")}
  .m-game.bsport{background-image:url("../images/mobile/game%20BSPORT77%20box-min.png")}
  .m-game.calibet{background-image:url("../images/mobile/game%20calibet%20box-min.png")}
  .m-game.all{background-image:url("../images/mobile/game%20semuagame%20box-min.png")}
  .m-game-icon{position:absolute;left:3%;top:6%;width:39%;height:88%;display:flex;align-items:center;justify-content:center}
  .m-game-icon img{max-width:94%;max-height:94%;object-fit:contain}
  .m-hot{position:absolute;left:-31px;top:10px;width:95px;padding:4px 0;background:#df1a1a;color:#fff;border-top:1px solid #ff7979;border-bottom:1px solid #8a0000;transform:rotate(-45deg);text-align:center;font-size:10px;font-weight:800;z-index:3}
  .m-game-name{position:absolute;right:4%;top:18%;width:51%;text-align:center;font-size:17px;line-height:1.12;font-weight:800}
  .m-game-btn{position:absolute;right:9%;bottom:13%;width:39%}.m-game-btn img{width:100%}
  .m-game.all .m-game-name{top:34%;right:4%;width:92%;font-size:17px}
  .m-divider{height:1px;margin:0 14px;background:#7b7b7b}

  .m-data{display:grid;grid-template-columns:minmax(0,64fr) minmax(0,36fr);gap:24px;padding:26px 17px 24px}
  .m-title{margin:0 0 12px;font-size:21px;line-height:1;font-weight:400}
  .m-deposit-head{height:52px;display:flex;align-items:center;padding:0 14px;background:linear-gradient(90deg,#c99a16 0%,#fff6d4 46%,#c79810 100%);color:#111;font-size:22px;line-height:1;font-weight:700;border:1px solid #777;border-bottom:0}
  .m-trans-viewport{height:336px;overflow:hidden;border:1px solid #777;border-top:0}.m-trans-table{margin-top:0;will-change:margin-top}
  .m-row{height:42px;display:grid;grid-template-columns:36% 22% 10% 32%;align-items:center;background:#181818;font-size:15px;font-weight:600}.m-row:nth-child(odd){background:#3b3b3b}.m-row:nth-child(even){background:#181818}
  .m-row span{white-space:nowrap;overflow:hidden;text-overflow:clip;padding:0 8px}.m-row .ok{color:#ded600;text-align:center;font-weight:400}.m-row .rp{color:#ddd;text-align:center;font-weight:400}.m-row .amt{text-align:right;padding-right:12px;font-weight:700}

  .m-bank-card{position:relative;aspect-ratio:252/77;height:auto;margin-bottom:6px;display:flex;align-items:center;padding:0 7px;background:url("../images/mobile/bank%20box-min.png") center/100% 100% no-repeat}
  .m-bank-card>img{max-width:54%;max-height:34px;object-fit:contain}
  .m-status{margin-left:auto;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:9px;font-weight:700;color:#000}
  .m-dot{width:16px;height:16px;border-radius:50%;background:#19f249;box-shadow:0 0 7px #19f249}.m-dot.off{background:#ff2848;box-shadow:0 0 7px #ff2848}
  .m-status b{padding:1px 4px;background:#111;color:#f7da46;border-radius:2px;font-size:9px}

  .m-security-title{margin:28px 0 17px 8px;font-size:18px;font-weight:400}.m-security{width:82%;margin-left:8px}
  .m-contact-title{margin:16px 0 10px;font-size:18px;font-weight:400}
  .m-contact{display:flex;align-items:center;gap:8px;margin:8px 0;font-size:12px;line-height:1.15}.m-contact img{width:28px;flex:0 0 28px}

  .m-qris{background:#222}.m-qris img{width:100%}
  .m-seo-wrap{padding:26px 18px 80px;background:#303030}
  .m-seo{padding:22px 16px 30px;background:#000;color:#158bd7;font-weight:700;font-size:14px;line-height:1.75}.m-seo div{margin-bottom:8px}

}

@media only screen and (max-width:480px){
  .m-header{height:72px;padding:0 10px}.m-register img{width:104px}.m-logo img{width:165px}.m-menu{width:34px;height:29px}.m-menu span{width:31px;height:2px}
  .m-wa{height:50px;gap:8px}.m-wa img{width:34px}.m-wa strong{font-size:18px}.m-wa small{font-size:13px}
  .m-ann{height:50px}.m-ann-icon{flex-basis:50px}.m-ann-icon img{width:20px}.m-ann-box{height:31px;margin-right:8px}.m-ann-text{font-size:12px;padding-left:10px}
  .m-games{padding:28px 10px 22px;gap:8px 10px}.m-game-name{font-size:14px}.m-game.all .m-game-name{font-size:14px}
  .m-data{grid-template-columns:minmax(0,63fr) minmax(0,37fr);gap:10px;padding:18px 10px}.m-title{font-size:20px}.m-deposit-head{height:40px;font-size:16px;padding:0 10px}.m-trans-viewport{height:288px}.m-row{height:36px;font-size:10px}.m-row span{padding:0 4px}.m-row .amt{padding-right:6px}
  .m-bank-card{margin-bottom:6px}.m-bank-card>img{max-width:52%;max-height:24px}.m-dot{width:11px;height:11px}.m-status b{font-size:7px}
  .m-security-title,.m-contact-title{font-size:16px}.m-contact{font-size:10px;gap:6px}.m-contact img{width:23px;flex-basis:23px}.m-seo{font-size:12px}
}

/* Restored original navigation/content. Sacred mobile blocks above are untouched. */
@media only screen and (max-width:768px){
  .m-menu[aria-expanded="true"] span:nth-child(1){transform:translateY(12px) rotate(45deg)}
  .m-menu[aria-expanded="true"] span:nth-child(2){opacity:0}
  .m-menu[aria-expanded="true"] span:nth-child(3){transform:translateY(-12px) rotate(-45deg)}
  .m-menu span{transition:transform .2s ease,opacity .2s ease}

  .m-menu-dropdown{display:none;grid-template-columns:1fr 1fr;width:100%;background:#c6a242;border-bottom:1px solid #f3db9f;position:relative;z-index:30}
  .m-menu-dropdown.open{display:grid}
  .m-menu-dropdown a{height:44px;display:flex;align-items:center;justify-content:center;border:1px solid #f3db9f;background:#c6a242}
  .m-menu-dropdown a img{display:block;max-height:29px;max-width:115px;width:auto;filter:brightness(0)}

  .m-ann-box{position:relative;overflow:hidden}
  .m-ann-text{display:inline-block;width:max-content;min-width:max-content;padding-left:100%;animation:mRunningText 22s linear infinite}
  @keyframes mRunningText{from{transform:translateX(0)}to{transform:translateX(-100%)}}

  .bs-mobile-app > .home-games-grid{margin-top:26px!important;margin-bottom:18px!important}
  .m-restored-footer{width:100%;background:#303030}
  .m-restored-footer .footer_about{margin:0 auto!important}
  .m-restored-copyright{width:100%;background:#111}
  .m-restored-copyright .footer_copyright{margin:0 auto!important}

}


/* Sacred header on every internal mobile/tablet page. Desktop is untouched. */
@media only screen and (max-width:768px){
  body.bs-mobile-internal > .row:first-child,
  body.bs-mobile-internal > .nav_header,
  body.bs-mobile-internal > .mobile-chat-bar{
    display:none!important;
  }

  .bs-sacred-top{
    display:block!important;
    width:100%!important;
    position:relative;
    z-index:1000;
    background:#111;
    color:#fff;
    font-family:Arial,Helvetica,sans-serif;
  }
  .bs-sacred-top *{box-sizing:border-box}
  .bs-sacred-top img{display:block;max-width:100%;height:auto}
  .bs-sacred-top a{color:inherit;text-decoration:none}
}


/* HARD LOCK: sacred header on internal mobile/tablet pages */
@media only screen and (max-width:768px){
  body.bs-mobile-internal .bs-original-header-hidden,
  body.bs-mobile-internal .nav_header,
  body.bs-mobile-internal .mobile-chat-bar{
    display:none!important;
  }

  body.bs-mobile-internal .bs-sacred-top{
    display:block!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    position:relative!important;
    z-index:1000!important;
    background:#111!important;
  }

  body.bs-mobile-internal .bs-sacred-top .m-header{
    height:92px!important;
    display:grid!important;
    grid-template-columns:1fr auto 1fr!important;
    align-items:center!important;
    padding:0 18px!important;
    margin:0!important;
    background:linear-gradient(#050505,#121212 72%,#241d0f)!important;
    border-bottom:2px solid #7a5e17!important;
  }

  body.bs-mobile-internal .bs-sacred-top .m-register{
    justify-self:start!important;
    display:block!important;
    margin:0!important;
    padding:0!important;
  }
  body.bs-mobile-internal .bs-sacred-top .m-register img{
    width:146px!important;
    max-width:24vw!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
  }

  body.bs-mobile-internal .bs-sacred-top .m-logo{
    justify-self:center!important;
    display:block!important;
    margin:0!important;
    padding:0!important;
  }
  body.bs-mobile-internal .bs-sacred-top .m-logo img{
    width:220px!important;
    max-width:35vw!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
  }

  body.bs-mobile-internal .bs-sacred-top .m-menu{
    justify-self:end!important;
    width:44px!important;
    height:34px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:space-between!important;
    padding:4px 0!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  body.bs-mobile-internal .bs-sacred-top .m-menu span{
    display:block!important;
    width:42px!important;
    height:3px!important;
    padding:0!important;
    margin:0!important;
    border-radius:3px!important;
    background:#d3a835!important;
  }

  body.bs-mobile-internal .bs-sacred-top .m-wa{
    height:50px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:9px!important;
    margin:0!important;
    padding:0!important;
    background:linear-gradient(#4a4a4a,#161616)!important;
    border-bottom:2px solid #b58b29!important;
  }
  body.bs-mobile-internal .bs-sacred-top .m-wa img{
    width:38px!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
  }
}

@media only screen and (max-width:480px){
  body.bs-mobile-internal .bs-sacred-top .m-header{
    height:72px!important;
    padding:0 10px!important;
  }
  body.bs-mobile-internal .bs-sacred-top .m-register img{
    width:104px!important;
    max-width:24vw!important;
  }
  body.bs-mobile-internal .bs-sacred-top .m-logo img{
    width:165px!important;
    max-width:35vw!important;
  }
  body.bs-mobile-internal .bs-sacred-top .m-menu{
    width:34px!important;
    height:29px!important;
  }
  body.bs-mobile-internal .bs-sacred-top .m-menu span{
    width:31px!important;
    height:2px!important;
  }
  body.bs-mobile-internal .bs-sacred-top .m-wa{
    height:50px!important;
    gap:8px!important;
  }
  body.bs-mobile-internal .bs-sacred-top .m-wa img{
    width:34px!important;
  }
}

@media only screen and (max-width:768px){
  body.bs-mobile-internal .bs-original-nav-hidden,
  body.bs-mobile-internal .bs-original-chat-hidden{
    display:none!important;
  }
}


/* MOBILE SEO TOC ONLY — lower SEO content keeps its original styling */
@media only screen and (max-width:768px){
  .bs-mobile-app .m-qris{display:none!important}

  .bs-mobile-app .m-restored-footer{
    width:100%!important;
    background:#303030!important;
    padding:28px 20px 30px!important;
    box-sizing:border-box!important;
  }

  .bs-mobile-app .m-restored-footer .footer_about{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    float:none!important;
    box-sizing:border-box!important;
  }

  .bs-mobile-app .m-restored-footer .footer_about > .row:first-child{
    width:100%!important;
    margin:0 0 26px!important;
    padding:24px 26px!important;
    box-sizing:border-box!important;
    background:#000!important;
    border:0!important;
    color:#3479b7!important;
    text-align:left!important;
    font-family:"Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif!important;
  }

  .bs-mobile-app .m-restored-footer .footer_about > .row:first-child p{
    margin:0 0 12px!important;
    padding:0!important;
    color:#3479b7!important;
    font-family:inherit!important;
    font-size:15px!important;
    line-height:1.6!important;
    text-align:left!important;
    white-space:normal!important;
  }

  .bs-mobile-app .m-restored-footer .footer_about > .row:first-child p:last-child{
    margin-bottom:0!important;
  }

  .bs-mobile-app .m-restored-footer .footer_about > .row:first-child a,
  .bs-mobile-app .m-restored-footer .footer_about > .row:first-child strong{
    color:#3479b7!important;
    font-family:inherit!important;
    font-weight:700!important;
    text-decoration:none!important;
  }

  .bs-mobile-app .m-restored-footer .footer_about > .row:first-child p.toc-l1{
    margin-left:0!important;
  }
  .bs-mobile-app .m-restored-footer .footer_about > .row:first-child p.toc-l2{
    margin-left:10px!important;
  }
  .bs-mobile-app .m-restored-footer .footer_about > .row:first-child p.toc-l3{
    margin-left:28px!important;
  }
}

@media only screen and (max-width:480px){
  .bs-mobile-app .m-restored-footer{
    padding:20px 16px 24px!important;
  }

  .bs-mobile-app .m-restored-footer .footer_about > .row:first-child{
    padding:20px 18px!important;
    margin-bottom:22px!important;
  }

  .bs-mobile-app .m-restored-footer .footer_about > .row:first-child p{
    font-size:14px!important;
    line-height:1.55!important;
    margin-bottom:10px!important;
  }

  .bs-mobile-app .m-restored-footer .footer_about > .row:first-child p.toc-l2{
    margin-left:8px!important;
  }
  .bs-mobile-app .m-restored-footer .footer_about > .row:first-child p.toc-l3{
    margin-left:22px!important;
  }
}


/* WA LIVECHAT text alignment + true yellow/red blink — mobile/tablet only */
@media only screen and (max-width:768px){
  .m-wa > span{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:center!important;
    text-align:left!important;
    line-height:1!important;
  }

  .m-wa > span > strong,
  .m-wa > span > small{
    display:block!important;
    margin:0!important;
    padding:0!important;
    text-align:left!important;
    align-self:flex-start!important;
    white-space:nowrap!important;
  }

  .m-wa > span > strong{
    /* No !important color here: an important color would override the animation. */
    color:#ffd928;
    transform:scaleX(1.04);
    transform-origin:left center;
    animation:bsWaBlink .8s steps(1,end) infinite!important;
  }

  .m-wa > span > small{
    color:#fff!important;
    margin-top:2px!important;
  }

  @keyframes bsWaBlink{
    0%,49.999%{color:#ffd928}
    50%,100%{color:#ff1f1f}
  }
}


/* Final responsive typography adjustments — requested scope only */
@media only screen and (max-width:768px){
  .m-title,
  .m-security-title,
  .m-contact-title{
    font-family:"Manrope",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif!important;
    font-size:18px!important;
    font-weight:600!important;
    line-height:1.2!important;
  }

  .bs-mobile-app .m-restored-footer,
  .bs-mobile-app .m-restored-footer .footer_about,
  .bs-mobile-app .m-restored-footer .footer_about *{
    font-family:"Manrope",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif!important;
  }
}

@media only screen and (max-width:480px){
  .m-title,
  .m-security-title,
  .m-contact-title{
    font-size:16px!important;
    font-weight:600!important;
  }

  .m-security{
    width:80%!important;
  }
}


/* Hamburger menu labels are real text — mobile/tablet only */
@media only screen and (max-width:768px){
  .m-menu-dropdown a{
    font-family:"Manrope",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif!important;
    font-size:13px!important;
    font-weight:800!important;
    line-height:1!important;
    color:#000!important;
    text-decoration:none!important;
    text-transform:uppercase!important;
  }

  /* Horizontal finger swipe on hero; vertical page scrolling remains native. */
  .m-hero{
    touch-action:pan-y!important;
  }
}


/* Desktop purity guard — preserve the original sacred desktop games composition. */
@media only screen and (min-width:769px){
  .mobile-only-home-game{
    display:none!important;
  }
}


/* Mobile/tablet tap polish: remove browser tap flash without hiding keyboard focus. */
@media only screen and (max-width:768px){
  a,
  button,
  input,
  select,
  textarea,
  [role="button"]{
    -webkit-tap-highlight-color:transparent!important;
  }

  a img,
  button img{
    -webkit-user-drag:none;
    user-select:none;
  }

  a:focus:not(:focus-visible),
  button:focus:not(:focus-visible),
  input:focus:not(:focus-visible),
  select:focus:not(:focus-visible),
  textarea:focus:not(:focus-visible),
  [role="button"]:focus:not(:focus-visible){
    outline:none!important;
    box-shadow:none!important;
  }
}


/* Mobile deposit/withdraw submit buttons */
@media only screen and (max-width:768px){
  .mobile-action-submit{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:140px!important;
    height:38px!important;
    padding:0 22px!important;
    border:0!important;
    border-radius:4px!important;
    background:linear-gradient(90deg,#c99a16 0%,#ffe89a 55%,#d4a21d 100%)!important;
    color:#111!important;
    font-family:"Manrope",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif!important;
    font-size:14px!important;
    font-weight:800!important;
    line-height:38px!important;
    text-align:center!important;
    text-transform:uppercase!important;
    cursor:pointer!important;
    box-shadow:none!important;
    -webkit-appearance:none!important;
    appearance:none!important;
  }

  .mobile-action-submit:active{
    transform:translateY(1px);
  }
}


/* Tablet/intermediate header containment: preserve perfect <=480px composition. */
@media only screen and (min-width:481px) and (max-width:768px){
  .m-header{
    align-items:center!important;
  }

  .m-register{
    align-self:center!important;
  }

  .m-register img{
    width:auto!important;
    max-width:24vw!important;
    max-height:46px!important;
    object-fit:contain!important;
  }

  .m-logo{
    align-self:center!important;
  }

  .m-logo img{
    width:auto!important;
    max-width:35vw!important;
    max-height:72px!important;
    object-fit:contain!important;
  }

  .m-menu{
    align-self:center!important;
  }
}
