/* VelloxPlay Web App 1.23 — modal de configurações totalmente acessível */
#settingsModal{
  box-sizing:border-box!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:center!important;
  width:100vw!important;
  height:100dvh!important;
  max-height:100dvh!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
  padding:clamp(14px,3vh,28px) 16px max(28px,calc(20px + env(safe-area-inset-bottom)))!important;
}
#settingsModal.hidden{display:none!important}
#settingsModal .settings-card.client-settings{
  flex:0 0 auto!important;
  width:min(520px,calc(100vw - 32px))!important;
  max-width:520px!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:visible!important;
  margin:0 auto!important;
  box-sizing:border-box!important;
}
#settingsModal .settings-head{
  position:sticky!important;
  top:0!important;
  z-index:5!important;
  background:linear-gradient(180deg,#0e0e12 75%,rgba(14,14,18,.94) 100%)!important;
  padding-bottom:8px!important;
}
@media(max-width:620px){
  #settingsModal{
    padding:max(10px,env(safe-area-inset-top)) 10px max(20px,calc(16px + env(safe-area-inset-bottom)))!important;
  }
  #settingsModal .settings-card.client-settings{
    width:100%!important;
    max-width:100%!important;
    border-radius:18px!important;
  }
}
