.access-scene {
  position: relative;
  isolation: isolate;
  max-width: 1100px;
  min-height: 680px;
  margin: 0 auto;
  padding: 48px;
}

.access-art {
  position: absolute;
  z-index: -1;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.access-art img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.access-art::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, #101010, transparent 12%, transparent 40%, rgba(16, 16, 16, 0.78) 70%, #101010),
    linear-gradient(180deg, #101010, transparent 17%, transparent 76%, #101010);
}

.auth.access-form {
  width: 350px;
  max-width: 46%;
  margin: 0 0 0 auto;
  position: relative;
  text-shadow: 0 2px 6px #000;
}

.access-form .seal {
  width: 68px;
  height: 68px;
  margin-bottom: 22px;
}

.access-form h1 {
  font-size: 30px;
}

.access-form > p {
  color: #d3cdcd;
}

.access-form input {
  background: rgba(10, 10, 10, 0.9);
}

@media (max-width: 760px) {
  .access-scene {
    min-height: 0;
    max-width: 560px;
    padding: 44px 20px 30px;
  }

  .access-art {
    inset: 0 -16px;
  }

  .access-art img {
    object-position: 44% center;
  }

  .access-art::after {
    background:
      linear-gradient(180deg, #101010, rgba(16, 16, 16, 0.6) 20%, rgba(16, 16, 16, 0.6) 78%, #101010),
      linear-gradient(90deg, #101010, transparent 15%, transparent 85%, #101010);
  }

  .auth.access-form {
    width: 350px;
    max-width: 100%;
    margin: 0 auto;
  }

  .access-form .seal {
    display: block;
  }
}