/* BankMovie V69 — approved footer nav Design #5.
   VISUAL ONLY. V66 remains the fixed/static behavior owner. */
@media (max-width:991px){
  html body{padding-bottom:calc(94px + env(safe-area-inset-bottom,0px))!important}

  html body .bottom-nav[data-mobile-bottom-nav],
  html body .bottom-nav,
  html body .actor-bottom-nav,
  html body [data-mobile-bottom-nav]{
    position:fixed!important;
    inset:auto 0 0 0!important;
    left:0!important;right:0!important;top:auto!important;bottom:0!important;
    transform:none!important;translate:none!important;
    width:100%!important;max-width:none!important;
    height:calc(72px + env(safe-area-inset-bottom,0px))!important;
    min-height:72px!important;
    margin:0!important;
    padding:7px 8px calc(7px + env(safe-area-inset-bottom,0px))!important;
    gap:0!important;
    overflow:visible!important;
    border:0!important;
    border-top:1px solid rgba(255,255,255,.13)!important;
    border-radius:28px 28px 0 0!important;
    background:linear-gradient(180deg,rgba(28,29,35,.995),rgba(14,15,20,.998))!important;
    box-shadow:0 -7px 18px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.035)!important;
    backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
    filter:none!important;transition:none!important;animation:none!important;
  }

  /* Sculpted center rise behind the Categories button. */
  html body .bottom-nav[data-mobile-bottom-nav]::before,
  html body .bottom-nav::before,
  html body .actor-bottom-nav::before,
  html body [data-mobile-bottom-nav]::before{
    content:""!important;display:block!important;
    position:absolute!important;left:50%!important;top:-23px!important;
    width:116px!important;height:52px!important;
    transform:translateX(-50%)!important;
    border-radius:58px 58px 0 0!important;
    background:linear-gradient(180deg,rgba(28,29,35,.998),rgba(20,21,27,.998))!important;
    border-top:1px solid rgba(255,255,255,.13)!important;
    pointer-events:none!important;z-index:0!important;box-shadow:none!important;
  }
  html body .bottom-nav[data-mobile-bottom-nav]::after,
  html body .bottom-nav::after,
  html body .actor-bottom-nav::after,
  html body [data-mobile-bottom-nav]::after{content:none!important;display:none!important}

  html body .bottom-nav>.nav-item,
  html body .actor-bottom-nav>.nav-item,
  html body [data-mobile-bottom-nav]>.nav-item{
    position:relative!important;z-index:2!important;
    flex:1 1 0!important;min-width:0!important;max-width:none!important;
    height:58px!important;min-height:58px!important;
    margin:0!important;padding:7px 3px 5px!important;
    display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:3px!important;
    border:0!important;border-radius:18px!important;
    background:transparent!important;box-shadow:none!important;
    color:rgba(246,247,251,.82)!important;text-decoration:none!important;
    transform:none!important;translate:none!important;transition:none!important;animation:none!important;filter:none!important;
  }
  html body .bottom-nav>.nav-item::before,
  html body .bottom-nav>.nav-item::after,
  html body .actor-bottom-nav>.nav-item::before,
  html body .actor-bottom-nav>.nav-item::after,
  html body [data-mobile-bottom-nav]>.nav-item::before,
  html body [data-mobile-bottom-nav]>.nav-item::after{content:none!important;display:none!important}

  html body .bottom-nav>.nav-item svg,
  html body .actor-bottom-nav>.nav-item svg,
  html body [data-mobile-bottom-nav]>.nav-item svg{
    width:24px!important;height:24px!important;flex:0 0 24px!important;margin:0!important;
    stroke:currentColor!important;fill:none!important;opacity:1!important
  }
  html body .bottom-nav>.nav-item .nav-label,
  html body .actor-bottom-nav>.nav-item .nav-label,
  html body [data-mobile-bottom-nav]>.nav-item .nav-label{
    display:block!important;max-width:100%!important;margin:0!important;color:inherit!important;
    font-size:10.5px!important;font-weight:850!important;line-height:1.05!important;
    white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important
  }

  /* Normal active page = accent icon/text only, like the approved reference. */
  html body .bottom-nav>.nav-item.active:not([data-bm-nav-kind="categories"]),
  html body .actor-bottom-nav>.nav-item.active:not([data-bm-nav-kind="categories"]),
  html body [data-mobile-bottom-nav]>.nav-item.active:not([data-bm-nav-kind="categories"]){
    color:var(--accent,#2f7cff)!important;background:transparent!important;box-shadow:none!important;transform:none!important
  }

  /* Approved center Categories circle. Always user-accent colored. NO glow/halo. */
  html body .bottom-nav>[data-bm-nav-kind="categories"],
  html body .actor-bottom-nav>[data-bm-nav-kind="categories"],
  html body [data-mobile-bottom-nav]>[data-bm-nav-kind="categories"]{
    order:3!important;position:relative!important;z-index:5!important;
    flex:0 0 84px!important;width:84px!important;min-width:84px!important;max-width:84px!important;
    height:84px!important;min-height:84px!important;
    margin:-29px 4px 0!important;padding:11px 4px 8px!important;
    border-radius:50%!important;border:1px solid rgba(255,255,255,.22)!important;
    color:#fff!important;
    background:linear-gradient(160deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,.035) 30%,transparent 31%),var(--accent,#2f7cff)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.26),inset 0 -1px 0 rgba(0,0,0,.18)!important;
    transform:none!important;translate:none!important;filter:none!important
  }
  html body .bottom-nav>[data-bm-nav-kind="categories"] svg,
  html body .actor-bottom-nav>[data-bm-nav-kind="categories"] svg,
  html body [data-mobile-bottom-nav]>[data-bm-nav-kind="categories"] svg{
    width:27px!important;height:27px!important;flex-basis:27px!important;color:#fff!important;stroke:#fff!important
  }
  html body .bottom-nav>[data-bm-nav-kind="categories"] .nav-label,
  html body .actor-bottom-nav>[data-bm-nav-kind="categories"] .nav-label,
  html body [data-mobile-bottom-nav]>[data-bm-nav-kind="categories"] .nav-label{
    color:#fff!important;font-size:10px!important;font-weight:950!important
  }
  html body .bottom-nav>[data-bm-nav-kind="categories"].active,
  html body .actor-bottom-nav>[data-bm-nav-kind="categories"].active,
  html body [data-mobile-bottom-nav]>[data-bm-nav-kind="categories"].active{
    color:#fff!important;
    background:linear-gradient(160deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,.035) 30%,transparent 31%),var(--accent,#2f7cff)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.26),inset 0 -1px 0 rgba(0,0,0,.18)!important
  }

  /* Never float/hide/compact. */
  html body .bottom-nav.nav-hidden,
  html body .bottom-nav.nav-compact,
  html body .actor-bottom-nav.nav-hidden,
  html body .actor-bottom-nav.nav-compact,
  html body [data-mobile-bottom-nav].nav-hidden,
  html body [data-mobile-bottom-nav].nav-compact{
    position:fixed!important;inset:auto 0 0 0!important;left:0!important;right:0!important;bottom:0!important;
    transform:none!important;width:100%!important;max-width:none!important;
    height:calc(72px + env(safe-area-inset-bottom,0px))!important;min-height:72px!important;
    margin:0!important;border-radius:28px 28px 0 0!important;
    opacity:1!important;visibility:visible!important;pointer-events:auto!important
  }

  html body.watch-party-page.wp-room-tools-open .bottom-nav{opacity:0!important;visibility:hidden!important;pointer-events:none!important}
}

@media (max-width:390px){
  html body .bottom-nav>[data-bm-nav-kind="categories"],
  html body .actor-bottom-nav>[data-bm-nav-kind="categories"],
  html body [data-mobile-bottom-nav]>[data-bm-nav-kind="categories"]{
    flex-basis:78px!important;width:78px!important;min-width:78px!important;max-width:78px!important;
    height:78px!important;min-height:78px!important;margin-top:-25px!important
  }
  html body .bottom-nav>.nav-item .nav-label,
  html body .actor-bottom-nav>.nav-item .nav-label,
  html body [data-mobile-bottom-nav]>.nav-item .nav-label{font-size:9.5px!important}
}