/* Four Color Comic v40.31.40 — login artwork aspect-ratio correction */

/* Previous builds prevented cropping by stretching the login image to 100% x 100%.
   This keeps the actual artwork layer proportional while the gradient fills the screen. */
@media(min-width:761px){
  #authGate.auth-gate{
    background-color:#010306!important;
    background-size:100% 100%, contain!important;
    background-position:center center, center center!important;
    background-repeat:no-repeat, no-repeat!important;
  }
}

@media(min-width:1500px){
  #authGate.auth-gate{
    background-size:100% 100%, contain!important;
    background-position:center center, center center!important;
    background-repeat:no-repeat, no-repeat!important;
  }
}

/* Ultra-wide/tall monitors keep the entire artwork visible.
   Empty space blends naturally into the black site background. */
@media(min-aspect-ratio:21/9) and (min-width:1200px){
  #authGate.auth-gate{
    background-color:#010306!important;
    background-size:100% 100%, contain!important;
  }
}

@media(max-aspect-ratio:4/3) and (min-width:761px){
  #authGate.auth-gate{
    background-color:#010306!important;
    background-size:100% 100%, contain!important;
  }
}

/* Mobile already uses proportion-preserving sizing. */
@media(max-width:760px){
  #authGate.auth-gate{
    background-size:auto, auto 100%!important;
    background-position:center center, center top!important;
    background-repeat:no-repeat, no-repeat!important;
    background-color:#010306!important;
  }
}