body.auth-page{
  margin:0;
  min-height:100vh;
  background:#111;
  color:#f5f5f5;
}

.auth-page *,
.auth-page *::before,
.auth-page *::after{
  box-sizing:border-box;
}

.auth-page .auth-shell{
  min-height:100svh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
}

.auth-page .auth-card{
  width:100%;
  max-width:440px;
  padding:20px;
  background:#1b1b1b;
  border:1px solid #2a2a2a;
  border-radius:16px;
}

.auth-page .auth-card h1{
  margin:0 0 8px;
}

.auth-page .auth-card h2{
  margin:0 0 14px;
  font-size:1.15rem;
  line-height:1.2;
}

.auth-page .auth-card form{
  margin:0;
  width:100%;
}

.auth-page .auth-card label{
  display:block;
  margin:0 0 10px;
}

.auth-page .auth-card input,
.auth-page .auth-card select,
.auth-page .auth-card textarea,
.auth-page .auth-card button,
.auth-page .auth-card .btn{
  width:100%;
  max-width:100%;
}

.auth-page .auth-card p{
  margin:10px 0 0;
}

.auth-page .flash{
  margin:0 0 12px;
}

@media (max-width: 768px){
  body.auth-page{
    overflow-x:hidden;
  }

  .auth-page .auth-shell{
    min-height:0;
    display:block;
    padding:8px 10px 10px;
  }

  .auth-page .auth-card{
    max-width:312px;
    margin:0 auto;
    padding:12px;
    border-radius:14px;
  }

  .auth-page .auth-card h1{
    margin:0 0 6px;
    font-size:1.25rem;
    line-height:1.1;
  }

  .auth-page .auth-card h2{
    margin:0 0 10px;
    font-size:1rem;
    line-height:1.15;
  }

  .auth-page .auth-card label{
    margin:0 0 8px;
    line-height:1.2;
  }

  .auth-page .auth-card input,
  .auth-page .auth-card select,
  .auth-page .auth-card textarea{
    margin-top:4px;
    margin-bottom:0;
  }

  .auth-page .auth-card button,
  .auth-page .auth-card .btn{
    margin-top:2px;
    margin-bottom:0;
  }

  .auth-page .auth-card p{
    margin:8px 0 0;
  }

  .auth-page .flash{
    margin:0 0 10px;
  }
}


.auth-brand{
  display:flex;
  justify-content:center;
  margin:0 0 16px;
}
.auth-brand-logo{
  display:block;
  width:auto;
  height:auto;
  max-width:min(100%, 300px);
  max-height:96px;
  object-fit:contain;
}


.auth-page .auth-shell{
  overflow-x:hidden;
}

.auth-page .auth-brand{
  width:100%;
  overflow:hidden;
}

.auth-page .auth-brand-logo{
  width:min(100%, 220px);
  max-width:220px;
  max-height:72px;
}

@media (max-width: 768px){
  .auth-page .auth-card{
    max-width:340px;
  }

  .auth-page .auth-brand{
    margin:0 0 12px;
  }

  .auth-page .auth-brand-logo{
    width:min(100%, 150px);
    max-width:150px;
    max-height:48px;
  }
}