#modal-admin-login {
  --admin-access-cyan: #62e9ff;
  --admin-access-blue: #287dff;
  --admin-access-panel: rgba(3, 16, 38, .92);
  inset: max(72px, var(--unipay-topbar-measured, var(--fut-menu-height, 72px))) 8px
    max(92px, var(--unipay-content-bottom-reserve, calc(var(--unipay-bottombar-measured, 72px) + 12px))) 8px;
  padding: 8px;
  background: rgba(0, 5, 16, .38);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  overflow: hidden;
}

#modal-admin-login .admin-access-modal-content {
  width: min(980px, 100%);
  max-width: 980px;
  height: 100%;
  max-height: 100%;
  box-sizing: border-box;
  padding: 34px clamp(14px, 3vw, 34px) 28px;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  border: 1px solid rgba(98, 233, 255, .62);
  border-radius: 22px;
  background: linear-gradient(155deg, rgba(5, 20, 48, .98), rgba(1, 8, 24, .99));
  box-shadow:
    0 0 0 5px rgba(30, 107, 255, .09),
    0 0 34px rgba(50, 157, 255, .40),
    0 0 78px rgba(29, 112, 255, .25);
}

#modal-admin-login .admin-access-modal-content::before {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  pointer-events: none;
  box-shadow: inset 0 0 22px rgba(68, 202, 255, .12);
}

#modal-admin-login h2 { margin: 0 46px 16px; }

.admin-access-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-bottom: 12px;
}

.admin-access-steps span {
  min-width: 0;
  padding: 9px 8px;
  border: 1px solid rgba(98, 233, 255, .22);
  border-radius: 999px;
  color: rgba(224, 247, 255, .72);
  background: rgba(13, 56, 101, .35);
  text-align: center;
  font-size: 11px;
  line-height: 1.2;
}

.admin-access-steps span.is-active,
.admin-access-steps span.is-complete {
  border-color: rgba(98, 233, 255, .78);
  color: #fff;
  box-shadow: 0 0 16px rgba(40, 125, 255, .30);
}

.admin-access-status,
.admin-login-lock-state {
  margin: 10px 0 14px;
  padding: 11px 13px;
  border: 1px solid rgba(98, 233, 255, .24);
  border-radius: 12px;
  background: rgba(22, 83, 145, .16);
  color: #d8f7ff;
  font: 600 12px/1.5 system-ui, sans-serif;
}

.admin-access-status[data-tone="success"] { border-color: rgba(77, 255, 178, .58); color: #a9ffd8; }
.admin-access-status[data-tone="warning"] { border-color: rgba(255, 198, 82, .58); color: #ffe0a3; }
.admin-access-status[data-tone="error"] { border-color: rgba(255, 92, 126, .62); color: #ffb5c5; }

.admin-access-panel {
  margin: 0 0 14px;
  padding: clamp(14px, 2vw, 20px);
  border: 1px solid rgba(85, 208, 255, .25);
  border-radius: 18px;
  background: var(--admin-access-panel);
  box-shadow: inset 0 0 24px rgba(37, 122, 255, .08);
}

.admin-access-panel[hidden] { display: none !important; }

.admin-access-panel-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.admin-access-panel h3 { margin: 0; color: #eafaff; font-size: 16px; }
.admin-access-kicker { margin: 0 0 4px; color: var(--admin-access-cyan); font: 700 10px/1.2 system-ui, sans-serif; letter-spacing: .16em; text-transform: uppercase; }
.admin-access-badge { padding: 7px 9px; border: 1px solid rgba(98, 233, 255, .30); border-radius: 999px; color: var(--admin-access-cyan); font: 700 10px/1.2 system-ui, sans-serif; white-space: nowrap; }
.admin-access-copy, .admin-access-warning { margin: 0 0 14px; color: rgba(225, 245, 255, .76); font: 400 12px/1.55 system-ui, sans-serif; }
.admin-access-warning { margin: 10px 0 0; color: #ffdca0; }

#admin-candidacy-form,
#admin-login-form { display: grid; gap: 12px; }

#admin-candidacy-form label,
#admin-login-form label {
  display: grid;
  gap: 6px;
  color: #a9eaff;
  font: 600 11px/1.4 system-ui, sans-serif;
}

.admin-access-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }

#admin-candidacy-form input,
#admin-candidacy-form select,
#admin-candidacy-form textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid rgba(98, 233, 255, .28);
  border-radius: 11px;
  padding: 11px 12px;
  background: rgba(3, 26, 57, .76);
  color: #effcff;
  font: 500 13px/1.4 system-ui, sans-serif;
  outline: none;
}

#admin-candidacy-form textarea { min-height: 74px; resize: vertical; }
#admin-candidacy-form input:focus,
#admin-candidacy-form select:focus,
#admin-candidacy-form textarea:focus { border-color: var(--admin-access-cyan); box-shadow: 0 0 0 3px rgba(40, 125, 255, .16); }

.admin-access-consent,
.admin-access-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.admin-access-consent span { color: rgba(224, 247, 255, .76); font: 500 11px/1.4 system-ui, sans-serif; }
.admin-access-check { grid-template-columns: auto 1fr !important; align-items: flex-start; }
.admin-access-check input { width: 18px !important; height: 18px; margin-top: 1px; accent-color: var(--admin-access-blue); }

#modal-admin-login button:disabled,
#modal-admin-login input:disabled { opacity: .46; cursor: not-allowed; filter: saturate(.35); }

#admin-login-form {
  margin-top: 14px;
  padding: clamp(14px, 2vw, 20px);
  border: 1px solid rgba(98, 233, 255, .25);
  border-radius: 18px;
  background: rgba(1, 12, 30, .92);
}

#admin-login-form.is-unlocked { border-color: rgba(77, 255, 178, .48); box-shadow: 0 0 24px rgba(37, 218, 164, .10); }
#admin-login-form.is-unlocked .admin-login-lock-state { border-color: rgba(77, 255, 178, .48); color: #a9ffd8; }

@media (max-width: 700px) {
  #modal-admin-login {
    inset: max(64px, var(--unipay-topbar-measured, var(--unipay-topbar-height, 64px))) 4px
      max(80px, var(--unipay-content-bottom-reserve, calc(var(--unipay-bottombar-measured, 68px) + 8px))) 4px !important;
    padding: 4px !important;
    align-items: stretch !important;
  }

  #modal-admin-login .admin-access-modal-content {
    width: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    padding: 30px 10px 18px;
    border-radius: 16px;
    scrollbar-gutter: auto;
  }

  #modal-admin-login h2 { margin: 0 36px 12px; font-size: 16px; }
  .admin-access-grid { grid-template-columns: 1fr; }
  .admin-access-steps { gap: 4px; }
  .admin-access-steps span { padding: 7px 3px; font-size: 9px; }
  .admin-access-panel-heading { display: grid; }
  .admin-access-badge { justify-self: start; white-space: normal; }
  .admin-access-actions > button,
  .admin-access-consent > button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  #modal-admin-login,
  #modal-admin-login .admin-access-modal-content { animation: none !important; transition: none !important; }
}
