body:has(.uni2-login-page) {
  margin: 0;
  background: #020b12;
}

.uni2-login-page,
.uni2-login-page * { box-sizing: border-box; }

.uni2-login-page {
  --login-blue: #009fe3;
  position: relative;
  min-height: 100svh;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 110px 24px 70px;
  background:
    radial-gradient(circle at 78% 15%, rgba(0, 159, 227, .24), transparent 31%),
    radial-gradient(circle at 12% 88%, rgba(0, 159, 227, .11), transparent 34%),
    linear-gradient(145deg, #020b12 0%, #071a27 55%, #031019 100%);
  color: #fff;
  font-family: "Uni2 Grotesk", Arial, sans-serif;
}

.uni2-login-page::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.026) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.026) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(circle at center, #000, transparent 76%);
  mask-image: radial-gradient(circle at center, #000, transparent 76%);
}

.uni2-login-home {
  position: absolute;
  z-index: 2;
  top: 34px;
  left: 50%;
  width: 150px;
  line-height: 0;
  transform: translateX(-50%);
}

.uni2-login-home img { width: 100%; height: auto; }

.uni2-login-card {
  position: relative;
  z-index: 2;
  width: min(100%, 540px);
  padding: clamp(34px, 5vw, 58px);
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 34px;
  background: linear-gradient(145deg, rgba(18,46,62,.72), rgba(4,17,26,.62));
  box-shadow: 0 42px 120px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.12);
  backdrop-filter: blur(26px) saturate(145%);
  -webkit-backdrop-filter: blur(26px) saturate(145%);
}

.uni2-login-kicker {
  color: var(--login-blue);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .24em;
  text-transform: uppercase;
}

.uni2-login-card h1 {
  margin: 21px 0 24px;
  font-family: "Uni2 Editorial", Georgia, serif;
  font-size: clamp(58px, 8vw, 88px);
  font-weight: 400;
  letter-spacing: -.055em;
  line-height: .78;
}

.uni2-login-card > p {
  max-width: 390px;
  margin: 0 0 32px;
  color: rgba(255,255,255,.56);
  font-size: 13px;
  line-height: 1.7;
}

.uni2-login-card form { display: grid; gap: 16px; }
.uni2-login-card form > label:not(.uni2-login-remember) { display: grid; gap: 9px; }
.uni2-login-card form label > span:first-child { color: rgba(255,255,255,.58); font-size: 8px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.uni2-login-card input[type="text"],
.uni2-login-card input[type="password"] {
  width: 100%;
  min-height: 56px;
  padding: 0 17px;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 14px;
  outline: 0;
  background: rgba(255,255,255,.045);
  color: #fff;
  font: 400 15px/1 "Uni2 Grotesk", Arial, sans-serif;
}
.uni2-login-card input:focus { border-color: rgba(0,159,227,.8); box-shadow: 0 0 0 3px rgba(0,159,227,.12); }
.uni2-password-field { position: relative; display: block; }
.uni2-password-field button { position: absolute; top: 50%; right: 12px; min-width: 54px; min-height: 36px; border: 0; border-radius: 999px; background: rgba(0,159,227,.12); color: #fff; font: 700 8px/1 "Uni2 Grotesk", Arial, sans-serif; text-transform: uppercase; transform: translateY(-50%); cursor: pointer; }
.uni2-password-field input { padding-right: 78px !important; }
.uni2-login-remember { display: flex; align-items: center; gap: 10px; margin: 2px 0 6px; color: rgba(255,255,255,.57); font-size: 10px; }
.uni2-login-remember input { accent-color: var(--login-blue); }
.uni2-login-submit { min-height: 60px; display: flex; align-items: center; justify-content: space-between; padding: 0 18px 0 23px; border: 0; border-radius: 999px; background: #fff; color: #061723; font: 700 9px/1 "Uni2 Grotesk", Arial, sans-serif; letter-spacing: .13em; text-transform: uppercase; cursor: pointer; box-shadow: 0 18px 45px rgba(0,0,0,.24); }
.uni2-login-submit i { color: var(--login-blue); font-style: normal; font-size: 19px; }
.uni2-login-help { display: block; margin-top: 23px; color: rgba(255,255,255,.45); font-size: 9px; text-align: center; text-decoration: none; }
.uni2-login-notice { margin: -8px 0 20px; padding: 13px 15px; border: 1px solid rgba(255,127,146,.28); border-radius: 12px; background: rgba(130,20,38,.16); color: #ffdce2; font-size: 11px; line-height: 1.5; }
.uni2-login-foot { position: absolute; z-index: 2; bottom: 24px; margin: 0; color: rgba(255,255,255,.28); font-size: 8px; letter-spacing: .14em; text-transform: uppercase; }

@media (max-width: 600px) {
  .uni2-login-page { padding: 94px 14px 58px; }
  .uni2-login-home { top: 25px; width: 124px; }
  .uni2-login-card { padding: 34px 22px 28px; border-radius: 25px; }
  .uni2-login-card h1 { font-size: 62px; }
}
