/* StakeQuiz 1.1.106
   - smooth native scrolling on long mobile pages
   - visible StakeQuiz text in compact lobby header
   - explicit SQP label + points + stars
   - denser Shop and Deposit mobile UI
*/

.sq-mobile-lobby-brand-name{display:none}

@media (max-width:1200px) {
  /* Regular long pages must use normal browser/WebView vertical scrolling.
     Lobby/game remain managed by their dedicated fixed-height layouts. */
  body:not(.game-page):not(.lobby-page):not(.login-page){
    height:auto!important;
    min-height:100dvh!important;
    max-height:none!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior-y:auto!important;
    touch-action:pan-y!important;
    -webkit-overflow-scrolling:touch;
  }
  body:not(.game-page):not(.lobby-page):not(.login-page) .app-main{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
    touch-action:pan-y!important;
  }
  body:not(.game-page):not(.lobby-page):not(.login-page) .panel,
  body:not(.game-page):not(.lobby-page):not(.login-page) .glass,
  body:not(.game-page):not(.lobby-page):not(.login-page) form{
    touch-action:pan-y!important;
  }

  /* -------- Lobby compact header -------- */
  .lobby-page .pro-lobby-brandline>div:first-child{
    gap:5px!important;
    align-items:center!important;
  }
  .lobby-page .pro-lobby-brandline>div:first-child>span.sq-desktop-lobby-brand-copy{
    display:none!important;
  }
  .lobby-page .sq-mobile-lobby-brand-name{
    display:inline-block!important;
    font-size:10px!important;
    line-height:1!important;
    font-weight:950!important;
    color:var(--pro-text,#eef6fb)!important;
    white-space:nowrap!important;
    letter-spacing:-.02em!important;
  }
  .lobby-page .pro-lobby-brandline .sq-lobby-logo{
    width:28px!important;
    height:28px!important;
    flex:0 0 28px!important;
  }

  /* Make the third balance unambiguous: SQP + points + rating stars. */
  .lobby-page .pro-loyalty{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:2px!important;
    min-width:0!important;
    padding:2px 4px!important;
    overflow:visible!important;
  }
  .lobby-page .pro-loyalty>span{
    display:inline!important;
    font-size:6.5px!important;
    line-height:1!important;
    letter-spacing:.03em!important;
    color:var(--pro-muted,#8ca0ae)!important;
  }
  .lobby-page .pro-loyalty>strong{
    display:inline!important;
    font-size:8.5px!important;
    line-height:1!important;
  }
  .lobby-page .pro-loyalty .sqp-stars{
    display:inline-flex!important;
    align-items:center!important;
    gap:0!important;
    margin:0 0 0 1px!important;
    font-size:6px!important;
    line-height:1!important;
    letter-spacing:-.04em!important;
    white-space:nowrap!important;
  }
  .lobby-page .pro-loyalty .sqp-star{
    line-height:1!important;
  }

  /* -------- Compact topbar on regular mobile pages -------- */
  body.shop-page .topbar,
  body.deposit-page .topbar{
    min-height:44px!important;
    padding:4px 7px!important;
    gap:5px!important;
  }
  body.shop-page .topbar .sq-brand-logo,
  body.deposit-page .topbar .sq-brand-logo{
    width:27px!important;
    height:27px!important;
  }
  body.shop-page .topbar .sq-brand,
  body.deposit-page .topbar .sq-brand{
    gap:5px!important;
    font-size:11px!important;
  }
  body.shop-page .topbar .nav-links,
  body.deposit-page .topbar .nav-links{
    display:none!important;
  }
  body.shop-page .topbar .sq-build-badge,
  body.deposit-page .topbar .sq-build-badge{
    font-size:8px!important;
    padding:3px 5px!important;
  }
  body.shop-page .topbar .wallet-mini,
  body.deposit-page .topbar .wallet-mini{
    display:flex!important;
    gap:3px!important;
    margin-left:auto!important;
  }
  body.shop-page .topbar .pill,
  body.deposit-page .topbar .pill{
    padding:4px 6px!important;
    font-size:8px!important;
  }
  body.shop-page .topbar .sq-user-identity,
  body.deposit-page .topbar .sq-user-identity{
    gap:4px!important;
    padding:1px 4px!important;
  }
  body.shop-page .topbar .sq-user-avatar,
  body.deposit-page .topbar .sq-user-avatar{
    width:27px!important;
    height:27px!important;
  }
  body.shop-page .topbar .sq-user-identity strong,
  body.deposit-page .topbar .sq-user-identity strong{
    font-size:8px!important;
    max-width:72px!important;
  }
  body.shop-page .topbar .language-switch select,
  body.deposit-page .topbar .language-switch select{
    min-width:42px!important;
    width:42px!important;
    height:28px!important;
    padding:2px 4px!important;
    font-size:8px!important;
  }

  /* -------- Shop: denser content -------- */
  body.shop-page .shop-main{
    max-width:none!important;
    padding:8px!important;
    gap:8px!important;
    font-size:11px!important;
  }
  body.shop-page .shop-hero{
    padding:10px 12px!important;
    gap:10px!important;
  }
  body.shop-page .shop-hero .eyebrow{
    font-size:7px!important;
    margin-bottom:2px!important;
  }
  body.shop-page .shop-hero h1{
    font-size:21px!important;
    margin:1px 0 3px!important;
  }
  body.shop-page .shop-hero p{
    font-size:9px!important;
    line-height:1.25!important;
    margin:0!important;
  }
  body.shop-page .shop-wallets{
    gap:5px!important;
  }
  body.shop-page .shop-wallets>span{
    min-width:82px!important;
    padding:6px 9px!important;
    border-radius:9px!important;
  }
  body.shop-page .shop-wallets small{font-size:7px!important}
  body.shop-page .shop-wallets strong{font-size:13px!important}

  body.shop-page .shop-address-warning{
    padding:8px 10px!important;
    gap:8px!important;
    font-size:9px!important;
  }
  body.shop-page .shop-address-warning .btn{
    min-height:30px!important;
    padding:5px 8px!important;
    font-size:9px!important;
  }

  body.shop-page .shop-filter{
    padding:8px!important;
  }
  body.shop-page .shop-filter form{
    grid-template-columns:repeat(4,minmax(95px,1fr)) auto auto!important;
    gap:6px!important;
  }
  body.shop-page .shop-filter label{
    gap:3px!important;
  }
  body.shop-page .shop-filter label>span{
    font-size:8px!important;
  }
  body.shop-page input,
  body.shop-page select,
  body.shop-page textarea{
    min-height:32px!important;
    height:32px!important;
    padding:5px 7px!important;
    border-radius:8px!important;
    font-size:12px!important;
  }
  body.shop-page textarea{
    height:auto!important;
    min-height:64px!important;
  }
  body.shop-page .btn{
    min-height:31px!important;
    padding:5px 8px!important;
    border-radius:8px!important;
    font-size:9px!important;
  }
  body.shop-page .shop-check{
    min-height:32px!important;
    font-size:8px!important;
  }
  body.shop-page .shop-check input{
    width:auto!important;
    min-height:0!important;
    height:auto!important;
  }

  body.shop-page .shop-grid{
    grid-template-columns:repeat(auto-fill,minmax(190px,1fr))!important;
    gap:8px!important;
  }
  body.shop-page .shop-card{
    min-height:285px!important;
  }
  body.shop-page .shop-card-image{
    aspect-ratio:16/9!important;
    min-height:110px!important;
    max-height:145px!important;
  }
  body.shop-page .shop-card-image span{
    left:6px!important;
    bottom:6px!important;
    padding:3px 6px!important;
    font-size:7px!important;
  }
  body.shop-page .shop-card-body{
    padding:8px!important;
    gap:5px!important;
  }
  body.shop-page .shop-card-body h2{
    font-size:13px!important;
  }
  body.shop-page .shop-card-body p{
    font-size:9px!important;
    line-height:1.25!important;
  }
  body.shop-page .shop-card-footer{
    padding:0 8px 8px!important;
    gap:6px!important;
  }
  body.shop-page .shop-price{
    font-size:13px!important;
  }
  body.shop-page .shop-orders{
    padding:9px!important;
    font-size:9px!important;
  }
  body.shop-page .shop-order-list>div{
    padding:5px 0!important;
  }

  /* -------- Deposit: denser content -------- */
  body.deposit-page .app-main.narrow-main{
    max-width:980px!important;
    padding:8px!important;
  }
  body.deposit-page .panel{
    padding:12px!important;
    margin-bottom:9px!important;
    border-radius:11px!important;
  }
  body.deposit-page .panel .eyebrow{
    font-size:7px!important;
    margin-bottom:2px!important;
  }
  body.deposit-page .panel h1{
    font-size:22px!important;
    margin-bottom:7px!important;
  }
  body.deposit-page .panel h2{
    font-size:15px!important;
    margin-bottom:8px!important;
  }
  body.deposit-page .notice{
    padding:7px 9px!important;
    margin:7px 0 10px!important;
    border-radius:8px!important;
    font-size:9px!important;
    line-height:1.25!important;
  }
  body.deposit-page .notice small{
    font-size:8px!important;
  }
  body.deposit-page .form-grid{
    gap:7px!important;
  }
  body.deposit-page .form-grid label{
    gap:3px!important;
  }
  body.deposit-page .form-grid label>span{
    font-size:9px!important;
  }
  body.deposit-page input,
  body.deposit-page select,
  body.deposit-page textarea{
    min-height:33px!important;
    height:33px!important;
    padding:5px 8px!important;
    border-radius:8px!important;
    font-size:12px!important;
  }
  body.deposit-page .btn{
    min-height:32px!important;
    padding:5px 9px!important;
    border-radius:8px!important;
    font-size:10px!important;
  }
  body.deposit-page .responsive-table{
    overflow-x:auto!important;
    overflow-y:visible!important;
    -webkit-overflow-scrolling:touch;
  }
  body.deposit-page table{
    min-width:620px!important;
  }
  body.deposit-page th,
  body.deposit-page td{
    padding:7px 8px!important;
    font-size:9px!important;
  }
  body.deposit-page th{
    font-size:8px!important;
  }
}

@media (max-width:760px) {
  .lobby-page .sq-mobile-lobby-brand-name{font-size:9px!important}
  .lobby-page .pro-loyalty>span{font-size:6px!important}
  .lobby-page .pro-loyalty>strong{font-size:7.5px!important}
  .lobby-page .pro-loyalty .sqp-stars{font-size:5.5px!important}

  body.shop-page .shop-filter form{
    grid-template-columns:repeat(2,minmax(110px,1fr))!important;
  }
  body.shop-page .shop-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
