#mpLoginBannersBox{
  width:100%;
  margin:14px 0 12px;
  display:flex;
  gap:12px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  padding:2px 2px 8px;
}
#mpLoginBannersBox::-webkit-scrollbar{display:none}

.mp-login-banner-card{
  flex:0 0 78%;
  height:142px;
  border-radius:20px;
  overflow:hidden;
  background:#fff7c4;
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 8px 22px rgba(0,0,0,.14);
  scroll-snap-align:start;
  position:relative;
}
.mp-login-banner-card img,
.mp-login-banner-card video{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  background:#000;
  pointer-events:none;
}
.mp-login-banner-card video::-webkit-media-controls,
.mp-login-banner-card video::-webkit-media-controls-panel,
.mp-login-banner-card video::-webkit-media-controls-play-button,
.mp-login-banner-card video::-webkit-media-controls-start-playback-button{
  display:none!important;
  opacity:0!important;
  visibility:hidden!important;
}
.mp-login-banner-title{
  position:absolute;
  left:0;right:0;bottom:0;
  padding:9px 11px;
  color:#fff;
  font-size:14px;
  font-weight:900;
  background:linear-gradient(transparent,rgba(0,0,0,.72));
}

#mpBannerPreviewOverlay{
  position:fixed;
  inset:0;
  z-index:99995;
  background:rgba(0,0,0,.76);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:10px;
  backdrop-filter:blur(6px);
}
#mpBannerPreviewCard{
  position:relative;
  width:96vw;
  max-width:760px;
  max-height:90vh;
  background:#fff;
  border-radius:26px;
  overflow:hidden;
  box-shadow:0 22px 80px rgba(0,0,0,.45);
}
#mpBannerPreviewCard img,
#mpBannerPreviewCard video{
  width:100%;
  max-height:82vh;
  object-fit:contain;
  display:block;
  background:#000;
  pointer-events:none;
}
#mpBannerPreviewCard video::-webkit-media-controls,
#mpBannerPreviewCard video::-webkit-media-controls-panel,
#mpBannerPreviewCard video::-webkit-media-controls-play-button,
#mpBannerPreviewCard video::-webkit-media-controls-start-playback-button{
  display:none!important;
  opacity:0!important;
  visibility:hidden!important;
}
#mpBannerPreviewClose{
  position:absolute;
  top:10px;
  right:10px;
  z-index:3;
  width:42px;
  height:42px;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.9);
  color:#111;
  font-size:26px;
  font-weight:900;
}
#mpBannerPreviewTitle{
  padding:12px 16px 16px;
  text-align:center;
  font-size:18px;
  font-weight:900;
  color:#0b3470;
}

#mpBannerPreviewCard video.mpVideoLoading{
  opacity:0 !important;
}
#mpBannerPreviewCard video.mpVideoReady{
  opacity:1 !important;
  transition:opacity .18s ease;
}

/* ===== MP animated login banners + swipe buttons ===== */

#mpLoginBannersBox{
  width:100% !important;
  overflow:hidden !important;
  margin:14px 0 10px !important;
}

#mpLoginBannersBox .mp-login-banners-track,
#mpLoginBannersBox .mp-login-banners-row,
#mpLoginBannersBox .mpLoginBannersRow{
  display:flex !important;
  gap:12px !important;
  overflow-x:auto !important;
  scroll-snap-type:x mandatory !important;
  -webkit-overflow-scrolling:touch !important;
  padding:4px 4px 10px !important;
}

#mpLoginBannersBox .mp-login-banner-card{
  flex:0 0 78% !important;
  max-width:78% !important;
  scroll-snap-align:center !important;
  border-radius:18px !important;
  overflow:hidden !important;
  box-shadow:0 8px 20px rgba(0,0,0,.18) !important;
}

#mpLoginBannersBox img,
#mpLoginBannersBox video{
  width:100% !important;
  height:auto !important;
  display:block !important;
  object-fit:cover !important;
}

/* bottom buttons swipe */
#mpLoginButtonsUnderBanners{
  display:flex !important;
  flex-wrap:nowrap !important;
  overflow-x:auto !important;
  scroll-snap-type:x mandatory !important;
  -webkit-overflow-scrolling:touch !important;
  gap:10px !important;
  padding:8px 4px 14px !important;
  margin-top:10px !important;
}

#mpLoginButtonsUnderBanners::-webkit-scrollbar,
#mpLoginBannersBox *::-webkit-scrollbar{
  display:none !important;
}

#mpLoginButtonsUnderBanners .btn,
#mpLoginButtonsUnderBanners button{
  flex:0 0 auto !important;
  min-width:145px !important;
  height:46px !important;
  border-radius:999px !important;
  scroll-snap-align:center !important;
  background:#fffdf4 !important;
  border:1.5px solid #111 !important;
  color:#111 !important;
  font-size:14px !important;
  font-weight:900 !important;
  box-shadow:0 5px 12px rgba(0,0,0,.10) !important;
}

#mpLoginButtonsUnderBanners #mpTermsBottomBtn,
#mpLoginButtonsUnderBanners button[onclick*="showPrivacyPolicy"]{
  min-width:170px !important;
}


/* MP FORCE swipe layout v2 */
#mpLoginBannersBox{
  display:flex !important;
  flex-wrap:nowrap !important;
  overflow-x:auto !important;
  gap:12px !important;
  scroll-snap-type:x mandatory !important;
  -webkit-overflow-scrolling:touch !important;
  padding:6px 6px 12px !important;
  margin:12px 0 !important;
}

#mpLoginBannersBox .mp-login-banner-card{
  flex:0 0 82% !important;
  max-width:82% !important;
  min-width:82% !important;
  scroll-snap-align:center !important;
  border-radius:18px !important;
  overflow:hidden !important;
}

#mpLoginButtonsUnderBanners{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  overflow-x:auto !important;
  gap:10px !important;
  scroll-snap-type:x mandatory !important;
  -webkit-overflow-scrolling:touch !important;
  padding:8px 6px 14px !important;
  width:100% !important;
}

#mpLoginButtonsUnderBanners .btn,
#mpLoginButtonsUnderBanners button{
  flex:0 0 auto !important;
  width:auto !important;
  min-width:150px !important;
  max-width:none !important;
  grid-column:auto !important;
  scroll-snap-align:center !important;
}

/* MP bottom action buttons final */
#mpLoginButtonsUnderBanners{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  overflow-x:auto !important;
  gap:10px !important;
  padding:10px 8px 16px !important;
  margin:8px auto 4px !important;
  max-width:100% !important;
  scroll-snap-type:x mandatory !important;
  -webkit-overflow-scrolling:touch !important;
}

#mpLoginButtonsUnderBanners::-webkit-scrollbar{
  display:none !important;
}

#mpLoginButtonsUnderBanners .btn,
#mpLoginButtonsUnderBanners button{
  flex:0 0 auto !important;
  min-width:152px !important;
  height:44px !important;
  padding:0 14px !important;
  margin:0 !important;
  border-radius:999px !important;
  border:1.5px solid #111 !important;
  background:#fffdf4 !important;
  color:#111 !important;
  font-size:14px !important;
  font-weight:900 !important;
  white-space:nowrap !important;
  box-shadow:0 5px 12px rgba(0,0,0,.10) !important;
  scroll-snap-align:center !important;
}

#mpLoginButtonsUnderBanners .mp-small-action{
  min-width:132px !important;
}

#mpLoginButtonsUnderBanners .mp-wide-action{
  min-width:190px !important;
}