body.auth-page.register-page {
  --register-ink: #1d2830;
  --register-field: #f7f5f1;
  --register-background: #f1e2d8;
  --register-accent: #a85732;
  background: var(--register-background);
  color: var(--register-ink);
}

.register-page .auth-panel {
  width: min(100%, 31rem);
  padding: clamp(1.5rem, 4vw, 2.5rem);
  border-radius: 1.75rem;
  background: var(--register-accent);
  box-shadow: 0 24px 60px rgb(29 40 48 / 16%);
  color: var(--register-field);
}

.register-page h1 {
  margin-bottom: 1.6rem;
}

.register-page .form-field {
  margin-bottom: 1rem;
}

.register-page input {
  border-color: var(--register-ink);
  background: var(--register-field);
  color: var(--register-ink);
}

.register-page input:hover {
  border-color: var(--register-ink);
}

.register-page input:focus-visible {
  border-color: var(--register-ink);
  outline: 2px solid var(--register-field);
  outline-offset: 3px;
}

.register-page .auth-form button[type="submit"] {
  border-color: var(--register-ink);
  background: var(--register-ink);
  color: var(--register-field);
}

.register-page .auth-switch a {
  text-decoration: underline;
  text-underline-offset: 0.25em;
}

@media (max-width: 600px) {
  .register-page .auth-panel {
    border-radius: 1.25rem;
  }
}