/* v7.11.179
   - Banner nativo dentro de dock sólido/opaço.
   - Ajustes segue o mesmo modelo de página longa da Mina/Conquistas.
*/
#settings{
  align-items:flex-start!important;
  justify-content:center!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-y:contain;
  touch-action:pan-y!important;
  padding:0!important;
  background-color:#bceeff!important;
  background-image:url("../../backgrounds/classica.webp")!important;
  background-position:center top!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
#settings:not(.hidden){display:block!important}

#settings .settingsPage,
#settings .settingsModal{
  position:relative!important;
  box-sizing:border-box!important;
  width:min(94vw,560px)!important;
  min-height:100dvh!important;
  height:auto!important;
  max-height:none!important;
  margin:0 auto!important;
  padding-top:max(
    42px,
    calc(env(safe-area-inset-top,0px) + 18px),
    calc(var(--safe-area-inset-top,0px) + 18px)
  )!important;
  padding-left:0!important;
  padding-right:0!important;
  padding-bottom:max(
    22px,
    calc(env(safe-area-inset-bottom,0px) + 18px),
    calc(var(--safe-area-inset-bottom,0px) + 18px)
  )!important;
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}

/* Cabeçalho igual às páginas secundárias (Mina / Ranking / Desafio). */
#settings .settingsHeadMain{
  position:relative!important;
  display:block!important;
  min-height:140px!important;
  margin:0 0 8px!important;
  padding:4px 92px 14px 58px!important;
  text-align:left!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
#settings .settingsTitleBlock{
  display:block!important;
  padding:0!important;
  margin:0!important;
  min-height:0!important;
  text-align:left!important;
}
#settings .settingsHeadMain h2{
  margin:7px 0 4px!important;
  font-size:32px!important;
  line-height:1!important;
  color:#17466e!important;
  text-align:left!important;
}
#settings .settingsMascotEgg{
  position:absolute!important;
  right:8px!important;
  top:0!important;
  width:76px!important;
  height:76px!important;
  object-fit:contain!important;
  margin:0!important;
  filter:drop-shadow(0 6px 9px rgba(31,105,137,.12));
}
#settings #closeSettings{
  position:absolute!important;
  left:0!important;
  right:auto!important;
  top:3px!important;
  width:48px!important;
  height:48px!important;
  min-width:48px!important;
  padding:0!important;
  background:transparent url("../../botoes/bt-voltar.webp") center/contain no-repeat!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  color:transparent!important;
  font-size:0!important;
  z-index:5!important;
}

/* A reserva fica na página rolável — nunca sobre os últimos controles. */
html.nine-native-banner-active #settings{
  padding-bottom:0!important;
}
html.nine-native-banner-active #settings .settingsPage,
html.nine-native-banner-active #settings .settingsModal{
  padding-bottom:calc(
    var(--nine-native-banner-height,0px) +
    max(
      24px,
      calc(env(safe-area-inset-bottom,0px) + 18px),
      calc(var(--safe-area-inset-bottom,0px) + 18px)
    )
  )!important;
}

@media(max-width:430px){
  #settings .settingsHeadMain{padding-right:82px!important}
  #settings .settingsMascotEgg{right:4px!important;width:68px!important;height:68px!important}
}