/* v7.11.180 — refinamento visual Jogador/Ajustes + dock do Banner WEB preparado */

/* Excluir Conta volta a usar exatamente o mesmo preenchimento do card Reiniciar progresso. */
#settings .accountDeleteZone{
  background:rgba(255,255,255,.56)!important;
}

/* JOGADOR: página sólida/rolável como Mina, Conquistas, Ranking e Desafio. */
#profile{
  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;
}
#profile:not(.hidden){display:block!important}
#profile .playerPage{
  box-sizing:border-box!important;
  width:min(94vw,560px)!important;
  min-height:100dvh!important;
  height:auto!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-bottom:max(
    26px,
    calc(env(safe-area-inset-bottom,0px) + 18px),
    calc(var(--safe-area-inset-bottom,0px) + 18px)
  )!important;
  color:#17466e!important;
}
#profile .playerHero{
  position:relative!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 76px!important;
  align-items:center!important;
  gap:12px!important;
  min-height:118px!important;
  margin:0 0 12px!important;
  padding:4px 0 14px 58px!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  overflow:visible!important;
}
#profile .playerHero::after{display:none!important}
#profile .playerHero .roundBack{
  position:absolute!important;
  left:0!important;
  top:3px!important;
  width:48px!important;
  height:48px!important;
  z-index:10!important;
}
#profile .playerHeroIdentity{
  min-width:0!important;
  width:100%!important;
  padding:0!important;
}
#profile .profileNameEditTrigger{
  display:flex!important;
  width:100%!important;
  min-width:0!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:6px!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
#profile .profileNameEditTrigger #profileHeaderName{
  display:block!important;
  min-width:0!important;
  max-width:100%!important;
  font-size:clamp(22px,5.7vw,29px)!important;
  font-weight:1000!important;
  line-height:1.05!important;
  letter-spacing:-.015em!important;
  word-spacing:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  color:#17466e!important;
}
#profile .profilePencil{
  width:23px!important;
  height:23px!important;
  flex:0 0 23px!important;
  border-radius:50%!important;
  font-size:11px!important;
  background:rgba(255,255,255,.92)!important;
  border:1px solid rgba(39,132,167,.15)!important;
}
#profile #profileUsername{
  display:block!important;
  max-width:100%!important;
  margin-top:5px!important;
  color:#1597a3!important;
  font-size:11px!important;
  font-weight:900!important;
  line-height:1.15!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
#profile .playerHeroPhoto,
#profile .playerHeroPhoto .profilePhoto{
  width:72px!important;
  height:72px!important;
}
#profile .playerSection,
#profile .profileNameEditor{
  background:rgba(255,255,255,.80)!important;
}
#profile .playerTabs{
  background:rgba(222,245,250,.92)!important;
}
html.nine-native-banner-active #profile .playerPage,
html.nine-web-banner-active #profile .playerPage{
  padding-bottom:calc(
    var(--nine-active-banner-height, var(--nine-native-banner-height,0px)) +
    max(
      26px,
      calc(env(safe-area-inset-bottom,0px) + 18px),
      calc(var(--safe-area-inset-bottom,0px) + 18px)
    )
  )!important;
}

/* Banner WEB: mesmo conceito visual do dock Android. Invisível enquanto o GAM não estiver configurado. */
#nineWebBannerDock{
  display:none;
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:100500;
  min-height:58px;
  box-sizing:border-box;
  align-items:center;
  justify-content:center;
  padding:4px 0;
  background:#f4fcff;
  box-shadow:0 -6px 18px rgba(24,86,116,.12);
}
#nineWebBannerSlot{
  width:320px;
  height:50px;
  max-width:100%;
  overflow:hidden;
}
html.nine-web-banner-active #nineWebBannerDock{display:flex}
html.nine-web-banner-active body.nine-playing .gamePage{
  padding-bottom:calc(var(--nine-web-banner-height,58px) + max(14px,env(safe-area-inset-bottom,0px),var(--safe-area-inset-bottom,0px)))!important;
}
html.nine-web-banner-active #achievements,
html.nine-web-banner-active #tutorial,
html.nine-web-banner-active #trajectory,
html.nine-web-banner-active #ranking,
html.nine-web-banner-active #friendChallenge,
html.nine-web-banner-active #settings,
html.nine-web-banner-active #shop{
  box-sizing:border-box!important;
  padding-bottom:calc(var(--nine-web-banner-height,58px) + max(10px,env(safe-area-inset-bottom,0px),var(--safe-area-inset-bottom,0px)))!important;
}
html.nine-web-banner-active #settings .settingsPage,
html.nine-web-banner-active #settings .settingsModal{
  padding-bottom:calc(
    var(--nine-web-banner-height,58px) +
    max(
      24px,
      calc(env(safe-area-inset-bottom,0px) + 18px),
      calc(var(--safe-area-inset-bottom,0px) + 18px)
    )
  )!important;
}
:root{
  --nine-web-banner-height:58px;
  --nine-active-banner-height:58px;
}
@media(max-width:390px){
  #profile .playerHero{grid-template-columns:minmax(0,1fr) 66px!important;padding-left:54px!important}
  #profile .playerHeroPhoto,#profile .playerHeroPhoto .profilePhoto{width:64px!important;height:64px!important}
  #profile .profileNameEditTrigger #profileHeaderName{font-size:clamp(20px,5.4vw,25px)!important}
}