
/* v40.31.38 — Full-art background correction
   Never zoom/crop the supplied Four Color background scenes. */

/* APP TAB BACKGROUNDS
   v40.31.37 used `cover`, which cropped/zoomed the supplied 16:9 scene
   whenever the browser viewport was a different aspect ratio.
   Stretch the scene to the viewport instead so the complete composition
   remains visible edge-to-edge behind the application. */
.app::before{
  inset:0!important;
  width:auto!important;
  height:auto!important;
  max-width:none!important;
  background-size:100% 100%!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
  opacity:.98!important;
}

/* The supplied scenes already have a deliberately dark center for the app.
   Reduce the extra veil so the side artwork remains visible. */
.app::after{
  inset:0!important;
  width:auto!important;
  height:auto!important;
  max-width:none!important;
  background:
    linear-gradient(90deg,
      rgba(2,5,8,.01) 0%,
      rgba(2,5,8,.035) 11%,
      rgba(3,6,9,.26) 24%,
      rgba(3,6,9,.70) 36%,
      rgba(3,6,9,.78) 50%,
      rgba(3,6,9,.70) 64%,
      rgba(3,6,9,.26) 76%,
      rgba(2,5,8,.035) 89%,
      rgba(2,5,8,.01) 100%)!important;
}

/* The actual content panel stays readable without burying the artwork. */
.main{
  background:rgba(3,6,9,.69)!important;
}

/* LOGIN
   Show the complete attached login composition too.
   No `cover`, therefore no zooming/cropping. */
#authGate.auth-gate{
  background-size:100% 100%!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
}
@media(min-width:1500px){
  #authGate.auth-gate{
    background-size:100% 100%!important;
    background-position:center center!important;
  }
}

/* At laptop widths keep the whole scene visible instead of hiding it.
   The art can scale down behind the existing dark login card. */
@media(max-width:1100px){
  .app::before{
    display:block!important;
    opacity:.82!important;
    background-size:100% 100%!important;
  }
  .app::after{
    background:
      linear-gradient(90deg,
        rgba(3,6,9,.12),
        rgba(3,6,9,.64) 28%,
        rgba(3,6,9,.84) 50%,
        rgba(3,6,9,.64) 72%,
        rgba(3,6,9,.12))!important;
  }
}

/* Phone layout remains performance/readability first. */
@media(max-width:760px){
  .app::before{
    display:none!important;
  }
  .app::after{
    background:#030609!important;
  }
  #authGate.auth-gate{
    background-size:auto 100%!important;
    background-position:center top!important;
  }
}

/* Preserve v40.31.37 profile menu and Gold button hierarchy. */
.topbar{z-index:50000!important;overflow:visible!important}
.v36-user-dropdown{z-index:99999!important}
.v403137-user-stack{z-index:50020!important}
