/* Recodet V78 — stable mobile header.
   Signed-in mobile screens always show: Back | Team | RECODET | RC.
   Desktop and onboarding retain their existing layouts. */

@media (max-width:760px){
  :root{--v78-mobile-topbar-h:60px}

  .topbar.topbarTwoRow.v78MobileShell{
    height:var(--v78-mobile-topbar-h)!important;
    min-height:var(--v78-mobile-topbar-h)!important;
    overflow:visible!important;
  }

  /* Mobile has one stable identity row, so contextual header actions stay out. */
  .topbar.topbarTwoRow.v78MobileShell .topicons,
  .topbar.topbarTwoRow.v78MobileShell .compactHomeBtn{
    display:none!important;
  }

  .topbar.topbarTwoRow.v78MobileShell .globalBackBtn{
    left:8px!important;
    right:auto!important;
    top:50%!important;
    display:grid!important;
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    min-height:40px!important;
    border-radius:13px!important;
    transform:translateY(-50%)!important;
  }

  .topbar.topbarTwoRow.v78MobileShell .globalBackBtn[aria-disabled="true"]{
    opacity:.42!important;
    filter:saturate(.55);
    cursor:default!important;
  }

  .topbar.topbarTwoRow.v78MobileShell .teamTopBadge{
    position:absolute!important;
    left:54px!important;
    right:auto!important;
    top:50%!important;
    display:grid!important;
    place-items:center!important;
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    max-width:40px!important;
    min-height:40px!important;
    padding:4px!important;
    border-radius:13px!important;
    transform:translateY(-50%)!important;
  }

  .topbar.topbarTwoRow.v78MobileShell .teamTopBadge::before,
  .topbar.topbarTwoRow.v78MobileShell .teamTopBadge::after{
    inset:3px!important;
    border-radius:10px!important;
  }

  .topbar.topbarTwoRow.v78MobileShell .teamBadgeMark{
    width:30px!important;
    height:30px!important;
    border-radius:9px!important;
  }

  .topbar.topbarTwoRow.v78MobileShell #pageTitle{
    left:50%!important;
    right:auto!important;
    top:50%!important;
    display:flex!important;
    width:102px!important;
    max-width:102px!important;
    height:40px!important;
    transform:translate(-50%,-50%)!important;
    overflow:visible!important;
  }

  .topbar.topbarTwoRow.v78MobileShell .v76BrandLetters{
    font-size:15px!important;
    letter-spacing:.065em!important;
  }

  .topbar.topbarTwoRow.v78MobileShell .v76BrandO{
    width:16px!important;
    height:16px!important;
  }

  .topbar.topbarTwoRow.v78MobileShell .premiumCoinButton{
    position:absolute!important;
    left:auto!important;
    right:8px!important;
    top:50%!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:5px!important;
    width:72px!important;
    height:40px!important;
    min-width:72px!important;
    max-width:72px!important;
    min-height:40px!important;
    padding:4px 6px 4px 4px!important;
    border-radius:13px!important;
    transform:translateY(-50%)!important;
  }

  .topbar.topbarTwoRow.v78MobileShell .premiumCoinButton .coinIcon{
    display:grid!important;
    flex:0 0 27px!important;
    width:27px!important;
    height:27px!important;
    border-radius:9px!important;
  }

  .topbar.topbarTwoRow.v78MobileShell .premiumCoinButton .coinIcon svg{
    width:17px!important;
    height:17px!important;
  }

  .topbar.topbarTwoRow.v78MobileShell .coinValueWrap{
    display:grid!important;
    min-width:0!important;
    gap:0!important;
    text-align:left!important;
    line-height:1!important;
  }

  .topbar.topbarTwoRow.v78MobileShell .coinAmt{
    max-width:31px;
    overflow:hidden;
    color:#fff3c8!important;
    font-size:12px!important;
    line-height:1!important;
    text-overflow:ellipsis;
  }

  .topbar.topbarTwoRow.v78MobileShell .coinValueWrap small{
    display:block!important;
    margin-top:2px!important;
    font-size:7px!important;
    line-height:1!important;
  }

  .topbar.topbarTwoRow.v78MobileShell .coinOpenArrow,
  .topbar.topbarTwoRow.v78MobileShell .teamBadgeName{
    display:none!important;
  }

  .topbar.topbarTwoRow.v78MobileShell + .shopContextBar,
  .shopContextBar{top:var(--v78-mobile-topbar-h)!important}
  .shopSearchDock{top:calc(var(--v78-mobile-topbar-h) + 58px)!important}
}

@media (max-width:340px){
  .topbar.topbarTwoRow.v78MobileShell .globalBackBtn{
    left:6px!important;
    width:37px!important;
    height:37px!important;
    min-width:37px!important;
    min-height:37px!important;
  }
  .topbar.topbarTwoRow.v78MobileShell .teamTopBadge{
    left:47px!important;
    width:37px!important;
    height:37px!important;
    min-width:37px!important;
    max-width:37px!important;
    min-height:37px!important;
  }
  .topbar.topbarTwoRow.v78MobileShell .teamBadgeMark{
    width:28px!important;
    height:28px!important;
  }
  .topbar.topbarTwoRow.v78MobileShell #pageTitle{
    width:86px!important;
    max-width:86px!important;
  }
  .topbar.topbarTwoRow.v78MobileShell .v76BrandLetters{
    font-size:13px!important;
    letter-spacing:.04em!important;
  }
  .topbar.topbarTwoRow.v78MobileShell .v76BrandO{
    width:14px!important;
    height:14px!important;
    border-width:1.6px!important;
  }
  .topbar.topbarTwoRow.v78MobileShell .premiumCoinButton{
    right:6px!important;
    width:68px!important;
    min-width:68px!important;
    max-width:68px!important;
  }
  .topbar.topbarTwoRow.v78MobileShell .premiumCoinButton .coinIcon{
    width:25px!important;
    height:25px!important;
    flex-basis:25px!important;
  }
}

@media (prefers-reduced-motion:reduce){
  .topbar.topbarTwoRow.v78MobileShell *{transition:none!important}
}
