:root {
  --r-bg: #041333;
  --r-panel: #f9fbff;
  --r-ink: #0f2550;
  --r-muted: #5f7192;
  --r-line: #d8e0ed;
  --r-blue: #1f6fff;
}

body:has(.register-page) {
  background: #eff2f6;
  padding: 20px;
}

.register-page {
  width: min(1310px, calc(100vw - 40px));
  margin: 0 auto;
}

.register-shell {
  display: grid;
  grid-template-columns: 53.2% 46.8%;
  min-height: min(960px, calc(100vh - 40px));
  border-radius: 20px;
  overflow: hidden;
  background: var(--r-panel);
  box-shadow: 0 22px 46px rgba(5, 18, 44, 0.44);
  align-items: stretch;
}

.register-left {
  padding: clamp(24px, 2.4vw, 42px) clamp(24px, 2.3vw, 52px) clamp(22px, 2.2vw, 36px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.register-brand {
  display: inline-flex;
  align-items: center;
  gap: 0;
  text-decoration: none;
  transform: translateY(-2cm);
}

.register-brand-lockup {
  display: block;
  width: 206px;
  height: auto;
}

.register-title {
  margin: 18px 0 10px;
  color: #122a54;
  font-size: 48px;
  line-height: 1;
  letter-spacing: -0.03em;
}

.register-subtitle {
  margin: 0 0 18px;
  max-width: 380px;
  color: #65799e;
  font-size: 21px;
  line-height: 1.28;
  font-weight: 500;
}

.register-subtitle strong {
  color: #1f6fff;
  font-weight: 700;
}

.register-page .field-label {
  color: #5f7292;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.register-page .auth-form {
  gap: 12px;
}

.register-page .field-group {
  gap: 8px;
}

.register-pass-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

#register-name.auth-input,
#register-email.auth-input,
#register-password.auth-input,
#register-password-confirm.auth-input {
  height: 62px;
  border-radius: 12px;
  border-color: var(--r-line);
  padding-left: 54px;
  padding-right: 86px;
  font-size: 1.75rem;
}

.register-page .input-icon {
  color: #4f76b7;
  font-size: 1.2rem;
}

.register-page .auth-toggle-text {
  right: 16px;
  color: #7488ab;
  font-size: 1.05rem;
}

.register-page .auth-toggle-text::before {
  display: none;
}

.register-terms {
  margin: 0;
  font-size: 0.95rem;
}

.register-terms span { color: #687c9f; }
.register-terms a { color: #1d6fff; text-decoration: none; font-weight: 700; }

.register-submit {
  height: 62px;
  border-radius: 12px;
  font-size: 1.5rem;
  box-shadow: 0 10px 20px rgba(24, 104, 242, 0.28);
}

.register-divider {
  margin: 10px 0 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.register-divider::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  border-top: 1px solid #d9e2ef;
  transform: translateY(-50%);
}

.register-divider span {
  position: relative;
  z-index: 1;
  display: inline-block;
  background: transparent;
  padding: 0 16px;
  font-size: 0.78rem;
  line-height: 1.2;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: #7c8ead;
}

.register-social button {
  height: 54px;
  border-radius: 12px;
  border-color: var(--r-line);
  font-size: 1rem;
}

.register-alt {
  margin-top: 12px;
  font-size: 1rem;
}

.register-foot-links {
  margin-top: 8px;
  display: flex;
  justify-content: center;
  gap: 18px;
}

.register-foot-links a {
  color: #6e82a5;
  text-decoration: none;
  font-size: 0.78rem;
}

.register-right {
  position: relative;
  overflow: hidden;
  min-height: 100%;
  height: 100%;
  background-color: #06122b !important;
  background-image: none !important;
  background-size: auto !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  line-height: 0;
}

.register-right::before {
  content: none;
}

.register-right-image {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  min-width: 100%;
  min-height: 100%;
  transform: none;
  object-fit: cover !important;
  object-position: center center !important;
  display: block;
  z-index: 1;
}


@media (max-width: 1200px) {
  .register-shell { grid-template-columns: 56% 44%; }
}

@media (max-width: 980px) {
  .register-shell { grid-template-columns: 1fr; min-height: auto; }
  .register-right { min-height: 360px; order: -1; }
  .register-left { padding: 20px 16px 22px; }
  .register-title { margin-top: 16px; font-size: 2.45rem; }
  .register-subtitle { font-size: 1rem; max-width: none; }
  .register-pass-grid { grid-template-columns: 1fr; }
  .register-submit { font-size: 1.55rem; }
  .register-social button { font-size: 1.08rem; }
  .register-alt { font-size: 1.08rem; }
  .register-foot-links { flex-wrap: wrap; gap: 10px 16px; }
}

@media (max-width: 760px) {
  body:has(.register-page) {
    padding: 8px;
  }

  .register-page {
    width: calc(100vw - 16px);
  }

  .register-shell {
    border-radius: 14px;
  }

  .register-right {
    min-height: 280px;
  }

  .register-left {
    padding: 16px 12px 16px;
  }

  .register-brand {
    transform: none;
  }

  .register-brand-lockup {
    width: 170px;
  }

  .register-title {
    font-size: clamp(1.8rem, 8.2vw, 2.3rem);
    margin: 10px 0 8px;
  }

  .register-subtitle {
    font-size: 0.92rem;
    line-height: 1.35;
    margin-bottom: 12px;
  }

  #register-name.auth-input,
  #register-email.auth-input,
  #register-password.auth-input,
  #register-password-confirm.auth-input {
    height: 54px;
    padding-left: 48px;
    padding-right: 72px;
    font-size: 1rem;
  }

  .register-submit {
    height: 56px;
    font-size: 1.08rem;
  }

  .register-social {
    grid-template-columns: 1fr;
  }

  .register-social button {
    height: 52px;
    font-size: 0.95rem;
  }

  .register-alt {
    margin-top: 10px;
    font-size: 0.9rem;
  }

  .register-foot-links {
    margin-top: 8px;
  }
}

@media (max-width: 520px) {
  .register-right {
    min-height: 235px;
  }

  .register-brand-lockup {
    width: 152px;
  }

  .register-page .field-label {
    font-size: 12px;
  }

  .register-terms {
    font-size: 0.82rem;
  }

  .register-divider {
    margin: 8px 0;
  }

  .register-divider span {
    font-size: 0.68rem;
    letter-spacing: 0.1em;
  }

  .register-foot-links a {
    font-size: 0.72rem;
  }
}