/* SouPrimeiroAC 22.3.97 / build 2420 — Modo Cinema, menu fixo no viewport mobile.
   A barra ja e portaled para o body no desktop. No mobile, usar a mesma ancora
   impede que o scroll / transform do conteudo arraste o menu flutuante.
   Nenhum outro componente ou tela recebe estas regras. */
@media (max-width:760px){
  body > .so-tabs.so-tabs-viewport.so-tabs-mobile-viewport{
    position:fixed!important;
    top:auto!important;
    bottom:max(8px,env(safe-area-inset-bottom))!important;
    left:max(6px,env(safe-area-inset-left))!important;
    right:max(6px,env(safe-area-inset-right))!important;
    width:auto!important;
    max-width:none!important;
    height:auto!important;
    margin:0!important;
    padding:5px 4px!important;
    z-index:90!important;
    transform:none!important;
    display:grid!important;
    grid-template-columns:repeat(7,minmax(0,1fr))!important;
    grid-auto-columns:auto!important;
    grid-auto-flow:row!important;
    gap:2px!important;
    align-items:stretch!important;
    box-sizing:border-box!important;
    overflow:visible!important;
    border:1px solid #363b46!important;
    border-radius:18px!important;
    background:rgba(9,10,12,.95)!important;
    color:#d0d4dc!important;
    box-shadow:0 15px 50px rgba(0,0,0,.46)!important;
    -webkit-backdrop-filter:blur(18px);
    backdrop-filter:blur(18px);
  }
  body > .so-tabs.so-tabs-viewport.so-tabs-mobile-viewport button{
    display:grid!important;
    grid-template-rows:auto auto!important;
    align-content:center!important;
    justify-items:center!important;
    gap:2px!important;
    min-width:0!important;
    width:100%!important;
    min-height:52px!important;
    padding:5px 1px!important;
    margin:0!important;
    overflow:hidden!important;
    border:0!important;
    border-radius:11px!important;
    background:transparent!important;
    color:#c5c9d2!important;
    font-size:12px!important;
    font-weight:750!important;
    touch-action:manipulation;
  }
  body > .so-tabs.so-tabs-viewport.so-tabs-mobile-viewport button>span{
    font-size:16px!important;
    line-height:1!important;
  }
  body > .so-tabs.so-tabs-viewport.so-tabs-mobile-viewport button>b{
    display:block!important;
    max-width:100%!important;
    margin:0!important;
    font-size:clamp(6px,1.9vw,8px)!important;
    line-height:1.12!important;
    letter-spacing:-.02em!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
    overflow:hidden!important;
    text-align:center!important;
  }
  body > .so-tabs.so-tabs-viewport.so-tabs-mobile-viewport button[aria-current="page"]{
    background:#ffd400!important;
    color:#111!important;
  }
  body:has(#mainView.hidden) > .so-tabs.so-tabs-mobile-viewport,
  body:has(#setmodeView:not(.active-view)) > .so-tabs.so-tabs-mobile-viewport,
  body:has(#setmodeView[hidden]) > .so-tabs.so-tabs-mobile-viewport,
  body:has(#setmodeView.hidden) > .so-tabs.so-tabs-mobile-viewport{
    display:none!important;
  }
}
@media (max-width:360px){
  body > .so-tabs.so-tabs-viewport.so-tabs-mobile-viewport{
    left:max(3px,env(safe-area-inset-left))!important;
    right:max(3px,env(safe-area-inset-right))!important;
    padding-inline:3px!important;
  }
  body > .so-tabs.so-tabs-viewport.so-tabs-mobile-viewport button>b{
    font-size:6px!important;
  }
}