.auth-shell {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
}

.auth-shell::before,
.auth-shell::after {
  content: '';
  position: absolute;
  border-radius: 9999px;
  z-index: 0;
  pointer-events: none;
}

.auth-shell::before {
  width: 420px;
  height: 420px;
  top: -160px;
  right: -120px;
  background: radial-gradient(circle at center, rgba(74, 145, 7, 0.2), rgba(74, 145, 7, 0));
}

.auth-shell::after {
  width: 340px;
  height: 340px;
  bottom: -120px;
  left: -100px;
  background: radial-gradient(circle at center, rgba(86, 94, 116, 0.14), rgba(86, 94, 116, 0));
}

.auth-content {
  position: relative;
  z-index: 1;
}

.auth-panel {
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
}

.auth-input:focus {
  box-shadow: 0 0 0 2px rgba(74, 145, 7, 0.25);
}

.auth-decor {
  position: relative;
  overflow: hidden;
  min-height: 520px;
  isolation: isolate;
}

.auth-decor::before,
.auth-decor::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.auth-decor::before {
  background:
    linear-gradient(145deg, #0a1603 0%, #1a3303 42%, #2d5c05 70%, #3d7a06 100%);
  z-index: -2;
}

.auth-decor::after {
  background-color: #e8f2d9;
  background-image:
    repeating-radial-gradient(circle at 0 0, transparent 0, #e8f2d9 10px),
    repeating-linear-gradient(#4a910755, #4a9107);
  mix-blend-mode: soft-light;
  opacity: 0.16;
  z-index: -1;
}

.auth-decor-left {
  border-right: 1px solid rgba(255, 255, 255, 0.12);
}

.auth-decor-right {
  border-left: 1px solid rgba(255, 255, 255, 0.12);
}

.auth-split-login,
.auth-split-register {
  display: grid;
}

.auth-split-login {
  grid-template-columns: minmax(260px, 0.95fr) minmax(420px, 1.25fr);
}

.auth-split-register {
  grid-template-columns: minmax(420px, 1.25fr) minmax(260px, 0.95fr);
}

@media (max-width: 900px) {
  .auth-split-login,
  .auth-split-register {
    grid-template-columns: 1fr;
  }

  .auth-decor {
    display: none;
  }
}