/* Dedicated Sign in page — mirrors the approved like modal without becoming a dialog. */
.access-page {
  background:
    radial-gradient(720px 420px at 12% 0%,rgba(116,55,22,.16),transparent 68%),
    radial-gradient(640px 460px at 92% 3%,rgba(55,51,112,.14),transparent 70%),
    #101011 !important;
}

.access-page .account-main {
  min-height:100svh !important;
  padding:132px 20px 72px !important;
  display:grid !important;
  place-items:center !important;
  background:transparent !important;
}

.access-page .account-shell {
  width:min(100%,430px) !important;
  padding:0 !important;
  box-sizing:border-box !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:#f5f5f2 !important;
  box-shadow:none !important;
}

.access-page .account-shell[data-mode="signin"] {
  transform:none !important;
}

.access-page .account-shell[data-mode="signin"] .account-heading,
.access-page .account-shell[data-mode="forgot"] .account-heading,
.access-page .account-shell[data-mode="reset"] .account-heading,
.access-page .account-shell[data-mode="recovery"] .account-heading,
.access-page .account-shell[data-mode="verify"] .account-heading {
  display:block !important;
}

.access-page .account-heading {
  margin:0 0 22px !important;
  padding:0 !important;
  text-align:center !important;
}

.access-page .account-eyebrow {
  margin:0 0 9px !important;
  color:#777772 !important;
  font-size:9px !important;
  font-weight:700 !important;
  letter-spacing:.09em !important;
}

.access-page .account-heading h1 {
  max-width:340px !important;
  margin:0 auto !important;
  color:#f5f5f2 !important;
  font-size:29px !important;
  font-weight:650 !important;
  line-height:1.02 !important;
  letter-spacing:-.045em !important;
  text-wrap:balance !important;
}

.access-page .account-heading > p:last-child {
  max-width:310px !important;
  margin:10px auto 0 !important;
  color:#93938e !important;
  font-size:13px !important;
  line-height:1.4 !important;
}

.access-page .account-google {
  min-height:50px !important;
  border:1px solid #fff !important;
  border-radius:12px !important;
  background:#f7f7f3 !important;
  color:#151515 !important;
  font-size:14px !important;
  font-weight:680 !important;
  box-shadow:none !important;
}

.access-page .account-google:hover {
  border-color:#fff !important;
  background:#fff !important;
  color:#0b0b0b !important;
}

.access-page .account-divider {
  height:42px !important;
  color:#666662 !important;
  font-size:9px !important;
}

.access-page .account-divider::before,
.access-page .account-divider::after {
  background:rgba(255,255,255,.08) !important;
}

.access-page .account-field { margin-bottom:14px !important; }

.access-page .account-field label,
.access-page .account-verification label {
  color:#d9d9d4 !important;
  font-size:11px !important;
  font-weight:680 !important;
}

.access-page .account-field__label { min-height:20px !important; }

.access-page .account-field__label button,
.access-page .account-verification > button {
  color:#8d8d88 !important;
  font-size:10px !important;
  text-decoration:none !important;
}

.access-page .account-field input,
.access-page .account-field select,
.access-page .account-verification input {
  height:50px !important;
  min-height:50px !important;
  margin-top:7px !important;
  padding-inline:15px !important;
  border:1px solid rgba(255,255,255,.7) !important;
  border-radius:12px !important;
  background:#eeeee9 !important;
  color:#151515 !important;
  font-size:15px !important;
  font-weight:480 !important;
  box-shadow:inset 0 1px 0 #fff,0 7px 18px -15px rgba(0,0,0,.9) !important;
}

.access-page .account-field input::placeholder,
.access-page .account-verification input::placeholder {
  color:#777772 !important;
  opacity:1 !important;
}

.access-page .account-field input:focus,
.access-page .account-field select:focus,
.access-page .account-verification input:focus {
  outline:none !important;
  border-color:#fff !important;
  background:#f7f7f3 !important;
  box-shadow:inset 0 1px 0 #fff,0 0 0 4px rgba(255,255,255,.11) !important;
}

.access-page .account-password > button {
  top:12px !important;
  right:7px !important;
  width:38px !important;
  height:38px !important;
  color:#5f625f !important;
}

.access-page .account-submit {
  min-height:52px !important;
  margin-top:3px !important;
  border:1px solid var(--ds-primary) !important;
  border-radius:12px !important;
  background:var(--ds-primary) !important;
  color:#fff !important;
  font-size:14px !important;
  font-weight:760 !important;
  box-shadow:none !important;
  transform:none !important;
}

.access-page .account-submit:hover {
  border-color:var(--ds-primary-hover) !important;
  background:var(--ds-primary-hover) !important;
  color:#fff !important;
  transform:none !important;
}

.access-page .account-submit:active {
  border-color:var(--ds-primary-active) !important;
  background:var(--ds-primary-active) !important;
  color:#fff !important;
}

.access-page .account-secondary {
  min-height:38px !important;
  margin-top:5px !important;
  color:#aaa9a4 !important;
  font-size:11px !important;
  font-weight:620 !important;
  text-decoration:none !important;
}

.access-page .account-secondary:hover { color:#f5f5f2 !important; }

.access-page .account-message {
  min-height:12px !important;
  margin:5px 0 0 !important;
}

.access-page .account-legal {
  max-width:340px !important;
  margin:14px auto 0 !important;
  color:#6f6f6b !important;
  font-size:9px !important;
  line-height:1.45 !important;
}

.access-page .account-legal a {
  color:#9a9a95 !important;
  text-decoration:none !important;
}

.access-page .site-footer {
  margin-top:0 !important;
  background:transparent !important;
}

@media (max-width:680px) {
  .access-page .account-main {
    min-height:100svh !important;
    padding:106px 12px 36px !important;
    place-items:start center !important;
  }

  .access-page .account-shell {
    width:100% !important;
    padding:0 8px !important;
    border-radius:0 !important;
  }

  .access-page .account-heading { margin-bottom:19px !important; }
  .access-page .account-heading h1 { font-size:26px !important; }
  .access-page .account-heading > p:last-child { margin-top:8px !important;font-size:12px !important; }
  .access-page .account-divider { height:38px !important; }
  .access-page .account-field { margin-bottom:12px !important; }

  .access-page .account-field input,
  .access-page .account-field select,
  .access-page .account-verification input {
    font-size:16px !important;
    touch-action:manipulation !important;
    -webkit-appearance:none !important;
    appearance:none !important;
  }

  .access-page .account-field input:focus,
  .access-page .account-field input:focus-visible,
  .access-page .account-field select:focus,
  .access-page .account-field select:focus-visible,
  .access-page .account-verification input:focus,
  .access-page .account-verification input:focus-visible {
    outline:none !important;
    border-color:rgba(255,255,255,.7) !important;
    background:#eeeee9 !important;
    box-shadow:inset 0 1px 0 #fff,0 7px 18px -15px rgba(0,0,0,.9) !important;
  }

  .access-page .account-legal { margin-top:10px !important; }
}

@media (max-width:360px) {
  .access-page .account-main { padding-inline:8px !important; }
  .access-page .account-shell { padding-inline:6px !important; }
}

@media (prefers-reduced-motion:reduce) {
  .access-page .account-submit,
  .access-page .account-field input,
  .access-page .account-verification input { transition:none !important; }
}
