/* Standar storefront mobile global untuk semua template/downline. */
.global-mobile-header,.global-mobile-ticker,.global-mobile-menu,
.global-mobile-fallback-banner,.global-mobile-game-menu,.global-mobile-inline-login,.global-mobile-inline-register{display:none}
.reference-popular-title-mobile{display:none}
.reference-mobile-game-rail{display:none}

@media(max-width:900px){
  body:not(.member-authenticated){padding-bottom:60px}
  body:not(.member-authenticated)>.preview-toolbar,
  body:not(.member-authenticated)>.notice,
  body:not(.member-authenticated)>.topbar{display:none!important}

  .global-mobile-header{
    position:relative;z-index:80;height:60px;display:flex;align-items:center;
    justify-content:space-between;box-sizing:border-box;padding:6px 14px;
    border-bottom:1px solid color-mix(in srgb,var(--gold) 28%,transparent);
    background:linear-gradient(180deg,var(--navy2),var(--navy));color:#fff;
  }
  .global-mobile-brand{
    min-width:0;height:48px;display:flex;align-items:center;gap:9px;color:#fff;text-decoration:none;
  }
  .global-mobile-brand img{width:auto;max-width:190px;max-height:48px;object-fit:contain}
  .global-mobile-brand span{
    width:40px;height:40px;display:grid;place-items:center;border-radius:11px 4px 11px 4px;
    background:linear-gradient(145deg,var(--gold2),var(--gold));color:var(--navy);
    font:800 23px "Cormorant Garamond",serif;
  }
  .global-mobile-brand b{max-width:150px;overflow:hidden;font-size:16px;text-overflow:ellipsis;white-space:nowrap}
  .global-mobile-menu-button{
    width:42px;height:42px;display:grid;flex:0 0 auto;place-content:center;gap:5px;
    border:1px solid #ffffff20;border-radius:11px;background:#ffffff0a;cursor:pointer;
  }
  .global-mobile-menu-button i{width:21px;height:2px;display:block;border-radius:2px;background:#fff;transition:.2s}
  .global-mobile-menu-button.is-open i:first-child{transform:translateY(7px) rotate(45deg)}
  .global-mobile-menu-button.is-open i:nth-child(2){opacity:0}
  .global-mobile-menu-button.is-open i:last-child{transform:translateY(-7px) rotate(-45deg)}

  .global-mobile-ticker{
    position:relative;z-index:79;height:34px;display:grid;grid-template-columns:38px 1fr;
    align-items:center;overflow:hidden;border-bottom:1px solid #ffffff12;
    background:color-mix(in srgb,var(--navy) 93%,#000);color:#fff;
  }
  .global-mobile-ticker>i{
    position:relative;z-index:2;height:34px;display:grid;place-items:center;
    background:linear-gradient(135deg,var(--gold2),var(--gold));color:var(--navy);
    font-size:17px;font-style:normal;
  }
  .global-mobile-ticker>div{overflow:hidden}
  .global-mobile-ticker span{
    width:max-content;display:block;padding-left:100%;color:#fff;font-size:10px;
    font-weight:650;white-space:nowrap;animation:global-mobile-ticker 18s linear infinite;
  }
  @keyframes global-mobile-ticker{to{transform:translateX(-100%)}}

  .global-mobile-menu{
    position:absolute;z-index:78;top:94px;right:8px;left:8px;display:grid;
    grid-template-columns:repeat(2,1fr);gap:1px;max-height:0;overflow:hidden;
    border-radius:0 0 14px 14px;background:color-mix(in srgb,var(--navy2) 94%,#000);
    box-shadow:0 18px 35px #0009;opacity:0;transform:translateY(-8px);
    pointer-events:none;transition:.22s;
  }
  .global-mobile-menu.is-open{max-height:230px;padding:7px;opacity:1;transform:none;pointer-events:auto}
  .global-mobile-menu a{
    padding:12px;border-radius:8px;background:#ffffff09;color:#fff;
    font-size:10px;font-weight:800;text-align:center;text-decoration:none;
  }

  .public-home-banner{position:relative;left:50%;width:100vw!important;max-width:none!important;margin:0!important;transform:translateX(-50%)}
  .public-home-banner .banner-slider{
    width:100%;margin:0!important;border-radius:0!important;box-shadow:none!important;
  }
  .public-home-banner .banner-slider:before{border-radius:0!important}
  .public-home-banner .banner-track{
    display:flex!important;aspect-ratio:13/6!important;transform:translateX(calc(var(--banner-index,0) * -100%));
    transition:transform .55s cubic-bezier(.22,.75,.25,1)!important;animation:none!important;
  }
  .public-home-banner .banner-slide{
    position:relative!important;inset:auto!important;width:100%!important;min-width:100%!important;flex:0 0 100%!important;
    opacity:1!important;visibility:visible!important;transform:none!important;transition:none!important;
  }
  .global-mobile-fallback-banner{
    position:relative;width:100%;aspect-ratio:13/6;display:block;overflow:hidden;
    background:radial-gradient(circle at 77% 44%,color-mix(in srgb,var(--gold) 30%,transparent),transparent 33%),
      linear-gradient(120deg,var(--navy) 10%,var(--navy2) 62%,color-mix(in srgb,var(--blue) 75%,#000));
  }
  .global-mobile-fallback-banner:after{
    position:absolute;inset:0;content:"";background:linear-gradient(90deg,var(--navy) 0,color-mix(in srgb,var(--navy) 72%,transparent) 47%,transparent 82%);
  }
  .global-mobile-fallback-banner>div{position:absolute;z-index:3;top:50%;left:19px;transform:translateY(-50%)}
  .global-mobile-fallback-banner small{color:var(--gold);font-size:8px;font-weight:900;letter-spacing:.24em}
  .global-mobile-fallback-banner h1{
    max-width:205px;margin:5px 0;color:#fff;font-size:25px;line-height:1;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  }
  .global-mobile-fallback-banner p{margin:8px 0 0;color:#d0d7e1;font-size:7px;font-weight:800;letter-spacing:.13em}
  .global-mobile-fallback-banner>aside{position:absolute;inset:0 0 0 42%;display:flex;align-items:center;justify-content:center}
  .global-mobile-fallback-banner>aside img{
    position:absolute;width:104px;height:104px;border:2px solid #ffffff20;border-radius:20px;
    object-fit:cover;box-shadow:0 14px 28px #0008;
  }
  .global-mobile-fallback-banner>aside img:first-child{z-index:3;right:27px;transform:rotate(5deg)}
  .global-mobile-fallback-banner>aside img:nth-child(2){z-index:2;right:91px;transform:scale(.84) rotate(-9deg);opacity:.72}
  .global-mobile-fallback-banner>aside img:nth-child(3){right:-25px;transform:scale(.8) rotate(14deg);opacity:.58}

  .global-mobile-game-menu{
    position:relative;left:50%;width:100vw;display:flex;box-sizing:border-box;gap:0;margin:0;
    overflow-x:auto;transform:translateX(-50%);background:color-mix(in srgb,var(--navy2) 96%,#000);
    border-top:1px solid #ffffff0d;border-bottom:1px solid #ffffff16;scrollbar-width:none;-webkit-overflow-scrolling:touch;
  }
  .global-mobile-game-menu::-webkit-scrollbar{display:none}
  .global-mobile-game-menu a{
    min-width:82px;height:62px;display:flex;flex:1 0 82px;flex-direction:column;align-items:center;justify-content:center;
    gap:5px;box-sizing:border-box;border-right:1px solid #ffffff0c;color:#fff;text-decoration:none;
    font-size:8px;font-weight:900;letter-spacing:.025em;white-space:nowrap;
  }
  .global-mobile-game-menu a:first-child{color:var(--gold)}
  .global-mobile-game-menu a:active{background:#ffffff0b;color:var(--gold)}
  .global-mobile-game-menu i{height:20px;display:grid;place-items:center;color:inherit;font-size:18px;font-style:normal;line-height:1}
  .global-mobile-game-menu i img{width:22px;height:22px;display:block;object-fit:contain;filter:none;opacity:1}

  .global-mobile-inline-login{
    display:flex;align-items:center;flex-direction:column;gap:8px;padding:14px 14px 16px;
    border-bottom:1px solid color-mix(in srgb,var(--gold) 17%,transparent);
    background:color-mix(in srgb,var(--navy) 96%,#000);scroll-margin-top:105px;
  }
  .global-mobile-inline-login form{width:min(100%,440px);display:grid;grid-template-columns:1fr;gap:8px;min-width:0}
  .global-mobile-inline-login label{
    min-width:0;height:44px;display:grid;grid-template-columns:38px 1fr;align-items:center;
    overflow:hidden;border:1px solid #d8dce5;border-radius:10px;background:#fff;
    transition:border-color .18s,box-shadow .18s;
  }
  .global-mobile-inline-login label:focus-within{border-color:var(--gold);box-shadow:0 0 0 3px color-mix(in srgb,var(--gold) 14%,transparent)}
  .global-mobile-inline-login label span{height:100%;display:grid;place-items:center;border-right:1px solid #ffffff18;background:color-mix(in srgb,var(--navy2) 92%,#000);color:#fff;font-size:12px;text-align:center}
  .global-mobile-inline-login input{
    width:100%;min-width:0;height:100%;box-sizing:border-box;padding:0 12px;border:0;
    outline:0;background:#fff;color:#202535;font-size:12px;
  }
  .global-mobile-inline-login input::placeholder{color:#9297a4;opacity:1}
  .global-mobile-inline-login button,.global-mobile-inline-login>a{
    width:min(100%,440px);height:44px;display:grid;place-items:center;box-sizing:border-box;padding:0 12px;border:0;
    border-radius:10px;font-size:10px;font-weight:900;letter-spacing:.06em;text-decoration:none;cursor:pointer;
  }
  .global-mobile-inline-login button{width:100%;background:#d7192d;color:#fff;box-shadow:0 7px 18px #d7192d35}
  .global-mobile-inline-login button:active{background:#b90f22;transform:translateY(1px)}
  .global-mobile-inline-login>a{background:#1677e8;color:#fff;box-shadow:0 7px 18px #1677e835}
  .global-mobile-inline-login>a:active{background:#0d61c4;transform:translateY(1px)}
  .global-mobile-inline-login .classic-login-feedback{
    width:min(100%,440px);display:none;margin:0;padding:2px 4px;box-sizing:border-box;font-size:9px;line-height:1.5;
  }
  .global-mobile-inline-login .classic-login-feedback.is-loading,
  .global-mobile-inline-login .classic-login-feedback.is-error,
  .global-mobile-inline-login .classic-login-feedback.is-success{display:block}

  .global-mobile-inline-register{
    width:100%;display:block;box-sizing:border-box;padding:14px;background:color-mix(in srgb,var(--navy) 96%,#000);
    border-bottom:1px solid color-mix(in srgb,var(--gold) 17%,transparent);scroll-margin-top:98px;
  }
  .global-mobile-inline-register[hidden]{display:none!important}
  .global-mobile-inline-register .register-page{width:min(100%,520px);margin:0 auto;border-radius:13px;box-shadow:none}
  .global-mobile-inline-register .register-brand-banner{min-height:58px;padding:9px 13px}
  .global-mobile-inline-register .register-brand-identity img{max-width:130px;max-height:42px}
  .global-mobile-inline-register .register-brand-note{display:none}
  .global-mobile-inline-register .register-form{padding:16px 13px 18px}
  .global-mobile-inline-register .register-section-heading{margin-bottom:11px}
  .global-mobile-inline-register .register-section-heading h2{font-size:14px}
  .global-mobile-inline-register .register-grid{grid-template-columns:1fr;gap:10px}
  .global-mobile-inline-register .register-wide{grid-column:auto}
  .global-mobile-inline-register .register-grid input,
  .global-mobile-inline-register .register-grid select{min-height:43px;background:#fff;color:#202535}
  .global-mobile-inline-register .register-section{margin-top:15px;padding-top:15px}
  .global-mobile-inline-register .register-submit{background:#1677e8;color:#fff}
  .global-mobile-inline-register .register-login{margin:0;padding:12px;background:var(--surface-bg);border-top:1px solid var(--surface-line)}
  .global-mobile-register-loading{height:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#fff;font-size:10px}
  .global-mobile-register-loading i{width:24px;height:24px;border:2px solid #ffffff30;border-top-color:var(--gold);border-radius:50%;animation:auth-spin .8s linear infinite}
  .global-mobile-register-error{margin:0 auto;padding:18px;border-radius:10px;background:#fff0f0;color:#a52f2f;text-align:center;font-size:11px}
  .register-wizard-progress{position:relative;display:grid;grid-template-columns:repeat(3,1fr);margin:0 0 20px;padding:0}
  .register-wizard-progress:before{position:absolute;top:14px;right:16%;left:16%;height:2px;content:"";background:var(--surface-line)}
  .register-wizard-progress i{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:5px;color:var(--surface-muted);font-style:normal;font-size:8px;font-weight:700}
  .register-wizard-progress b{width:28px;height:28px;display:grid;place-items:center;border:2px solid var(--surface-line);border-radius:50%;background:var(--surface-bg);font-size:10px}
  .register-wizard-progress i.active,.register-wizard-progress i.done{color:var(--gold)}
  .register-wizard-progress i.active b,.register-wizard-progress i.done b{border-color:var(--gold);background:var(--gold);color:var(--navy)}
  .register-wizard-step[hidden]{display:none!important}
  .register-wizard-step.active{animation:register-step-in .22s ease-out}
  @keyframes register-step-in{from{opacity:0;transform:translateX(10px)}to{opacity:1;transform:none}}
  .register-wizard-actions{display:grid;grid-template-columns:1fr 1.55fr;gap:8px;margin-top:17px}
  .register-wizard-actions.single{grid-template-columns:1fr}
  .register-wizard-actions button{min-height:45px;border:0;border-radius:9px;font-size:9px;font-weight:900;letter-spacing:.04em;cursor:pointer}
  .register-wizard-actions .register-next,.register-wizard-actions .register-submit{width:100%;background:#1677e8;color:#fff;box-shadow:none}
  .register-wizard-actions .register-back{background:var(--surface-soft);color:var(--surface-fg);border:1px solid var(--surface-line)}
  .register-step-error{margin:10px 0 0;padding:9px 10px;border-radius:7px;background:#fff0f0;color:#a52f2f;font-size:9px;line-height:1.45}

  .public-support-float{
    right:10px!important;bottom:66px!important;display:flex!important;gap:8px!important;
    opacity:0!important;visibility:hidden!important;transform:translateX(18px) scale(.94)!important;
    transform-origin:bottom right;pointer-events:none!important;transition:opacity .2s,transform .2s,visibility .2s!important;
  }
  .public-support-float.is-open{
    opacity:1!important;visibility:visible!important;transform:none!important;pointer-events:auto!important;
  }
  .public-mobile-dock [data-mobile-services-toggle].services-active{color:var(--gold)!important}

  /* Hindari banner khusus tema tampil dua kali setelah banner global. */
  .arena-classic>.classic-banner{display:none!important}
  .reference-feature{display:none!important}
  .reference-service{display:none!important}
  .public-footer .footer-about{align-items:center!important;padding-bottom:20px;border-bottom:1px solid #ffffff0d;text-align:center!important}
  .public-footer .footer-brand{display:flex;min-height:50px;align-items:center;justify-content:center}
  .public-footer .footer-brand img{max-width:160px;max-height:58px}
  .public-footer .footer-about p{max-width:330px!important;margin:5px auto!important;text-align:center!important}
  .public-footer .footer-grid{display:block!important}
  .public-footer .footer-grid>section:not(.footer-about){display:none!important}
  .reference-popular-title-default{display:none!important}
  .reference-popular-title-mobile{display:flex!important;align-items:center;gap:7px}
  .reference-popular-title-mobile img{width:17px;height:17px;object-fit:contain}
  .reference-popular-title-mobile h2{margin:0!important;font-size:13px!important;font-style:normal!important;letter-spacing:.02em}
  .reference-popular-title-mobile h2 span{color:#fff!important}
  .reference-popular-title-mobile h2 em{color:var(--gold)!important;font-style:normal!important}
  .reference-popular>header>a{padding:6px 9px!important;border-radius:999px!important;background:color-mix(in srgb,var(--gold) 16%,transparent)!important;font-size:0!important;white-space:nowrap}
  .reference-popular>header>a:after{content:"LIHAT SEMUA GAME";color:var(--gold);font-size:7px;font-weight:900;letter-spacing:.04em}
  .reference-popular>header>a b{display:none!important}
  .reference-popular .reference-game-grid{display:none!important}
  .reference-mobile-game-rail{
    display:flex!important;gap:9px;overflow-x:auto;padding:2px 1px 9px;
    scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch;
  }
  .reference-mobile-game-rail::-webkit-scrollbar{display:none}
  .reference-mobile-game-rail article{width:116px;min-width:116px;scroll-snap-align:start}
  .reference-mobile-game-rail article>div{position:relative;width:116px;aspect-ratio:1;overflow:hidden;border-radius:10px;background:var(--navy)}
  .reference-mobile-game-rail img{width:100%;height:100%;display:block;object-fit:cover}
  .reference-mobile-game-rail article>div>a{position:absolute;inset:0;padding:0;border-radius:0;background:transparent;color:transparent;font-size:0;text-decoration:none}
  .reference-mobile-game-rail h3{margin:7px 2px 2px;overflow:hidden;color:var(--ink);font-size:8px;white-space:nowrap;text-overflow:ellipsis}
  .reference-mobile-game-rail p{margin:0 2px;color:var(--muted);font-size:6px}
  .reference-providers>div{
    display:flex!important;gap:8px!important;overflow-x:auto!important;padding:2px 1px 8px!important;
    scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch;
  }
  #provider-slot{scroll-margin-top:12px}

  /* Katalog SLOT khusus: isi beranda disembunyikan dan hanya daftar provider
     yang ditampilkan. Header tetap ada sebagai akses kembali ke beranda. */
  body.slot-provider-only .public-home-banner,
  body.slot-provider-only .global-mobile-inline-login,
  body.slot-provider-only .global-mobile-inline-register,
  body.slot-provider-only .reference-home>*:not(.reference-providers){display:none!important}
  body.slot-provider-only .global-mobile-game-menu{display:flex!important}
  body.slot-provider-only .reference-home{width:100%;margin:0!important;padding:12px;box-sizing:border-box}
  body.slot-provider-only .reference-providers{min-height:calc(100dvh - 118px);margin:0!important;padding:16px 12px 18px!important;border-radius:13px}
  body.slot-provider-only .reference-providers>header{margin-bottom:16px}
  body.slot-provider-only .reference-providers>header span{font-size:0}
  body.slot-provider-only .reference-providers>header span:after{content:"KATALOG SLOT";font-size:8px}
  body.slot-provider-only .reference-providers h2{font-size:18px}
  body.slot-provider-only .reference-providers>div{
    display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:9px!important;
    overflow:visible!important;padding:0!important;scroll-snap-type:none!important;
  }
  body.slot-provider-only .reference-providers>div>a{
    width:auto!important;min-width:0!important;min-height:86px!important;padding:9px 5px!important;
  }
  body.slot-provider-only .reference-providers img{width:82px!important;height:42px!important;object-fit:contain!important}
  body.slot-provider-only .public-footer{display:none!important}
  .reference-providers>div::-webkit-scrollbar{display:none}
  .reference-providers>div>a{width:104px!important;min-width:104px!important;min-height:66px!important;scroll-snap-align:start}

  /* Jackpot seluruh tema dipadatkan sekitar 38%. */
  .jp{margin:10px 10px 0!important}
  .jp-frame{
    position:relative!important;height:104px!important;min-height:104px!important;padding:0!important;
    overflow:hidden!important;border:0!important;border-radius:10px!important;
    background:#070709 url("https://mantra88hp.com/assets/img/progressive-jackpot.webp") center/100% 100% no-repeat!important;
    box-shadow:inset 0 0 0 1px #6b1d654f!important;
  }
  .jp-label,.jp-note{display:none!important}
  .jp-amount{
    position:absolute!important;left:42%!important;right:8%!important;top:36%!important;height:32%!important;
    display:flex!important;align-items:center!important;justify-content:center!important;gap:2px!important;
    margin:0!important;font-family:Quantico,Roboto,sans-serif!important;font-size:14px!important;
    font-weight:700!important;line-height:1!important;letter-spacing:0!important;color:#fff!important;
  }
  .jp-cur{color:#c234af!important;font-size:7px!important;font-style:normal!important}
  .jp-digits{color:#fff!important;text-shadow:none!important}
  .jp-digits b{color:#fff!important;font-size:14px!important;letter-spacing:0!important}
  .classic-jackpot{
    width:calc(100% - 20px)!important;height:104px!important;min-height:104px!important;margin:10px!important;
    padding:13px 16px!important;box-sizing:border-box!important;background-size:100% 100%!important;
  }
  .classic-jackpot>span{font-size:10px!important}
  .classic-jackpot>div{
    left:35%!important;right:7%!important;top:28%!important;height:46%!important;
    gap:4px!important;padding:0!important;
  }
  .classic-jackpot>div i{font-size:7px!important}
  .classic-jackpot>div strong{font-size:18px!important;letter-spacing:.03em!important}
}

@media(prefers-reduced-motion:reduce){
  .global-mobile-ticker span{padding-left:12px;animation:none}
}

@media(max-width:900px){
  .public-footer .footer-bottom{align-items:center!important;justify-content:center!important;flex-direction:row!important;margin-top:13px!important;padding-top:14px!important;font-size:10px!important;text-align:center!important}
}