/* Loaded only by /signup/. Every rule targets its form or confirmation screen. */
body .login-screen > #signup-panel,
body .login-screen > .login-panel[data-email-confirmation] {
  box-sizing: border-box;
  max-width: calc(100vw - 24px);
  overflow: visible;
  font-size: 16px;
  line-height: 1.55;
}

#signup-panel .signup-plan-caption,
#signup-panel .signup-trial-summary,
#signup-panel .signup-field-label,
#signup-panel .signup-pricing-link,
#signup-panel .auth-switch,
#signup-panel a,
#signup-panel .auth-switch .link,
[data-email-confirmation] .email-confirmation-copy,
[data-email-confirmation] .email-confirmation-steps,
[data-email-confirmation] .email-confirmation-footnote,
[data-email-confirmation] .signup-next-steps {
  font-size: 16px;
  line-height: 1.55;
}

#signup-panel .signup-field-help {
  color: #526b70;
  font-size: 16px;
  line-height: 1.5;
}

#signup-panel .signup-field-error {
  color: #a31b24;
  font-size: 16px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

#signup-panel .signup-field > input[aria-invalid="true"] {
  border-color: #a31b24 !important;
}

#signup-panel .signup-pricing-link a,
#signup-panel .auth-switch .link,
[data-email-confirmation] .signup-next-steps summary {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  box-sizing: border-box;
}

#signup-panel .signup-pricing-link a { justify-content: center; }

#signup-panel .auth-message,
[data-email-confirmation] .auth-message {
  margin: 12px 0;
  font-size: 16px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

[data-email-confirmation] .email-confirmation-footnote { color: #526b70; }

[data-email-confirmation] .email-confirmation-brand .brand-logo {
  width: 32px;
  height: 36px;
}

[data-email-confirmation] .email-confirmation-brand .brand-name { font-size: 24px; }

[data-email-confirmation] .email-confirmation-actions button {
  min-width: 0;
  min-height: 48px;
  height: auto;
  padding: 12px 16px;
  font-size: 16px;
  line-height: 1.5;
  white-space: normal;
  overflow-wrap: anywhere;
}

[data-email-confirmation] .email-confirmation-actions .primary-btn {
  border-color: #087f7b !important;
  background: #087f7b !important;
  color: #fff !important;
}

[data-email-confirmation] .email-confirmation-actions .primary-btn:disabled {
  border-color: #547674 !important;
  background: #547674 !important;
  cursor: wait;
}

[data-email-confirmation] :is(button, summary, a):focus-visible {
  outline: 3px solid #087f7b;
  outline-offset: 3px;
}

@media (max-width: 520px) {
  body .login-screen > .login-panel[data-email-confirmation] {
    width: calc(100vw - 24px);
    padding: 24px 20px;
    border-radius: 16px;
  }

  [data-email-confirmation] .email-confirmation-steps { padding: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  #signup-panel *,
  [data-email-confirmation] * {
    animation: none !important;
    transition: none !important;
  }
}

/* Preserve the v448 standalone signup shell and its password/retry controls. */
.signup-screen .signup-panel{max-width:calc(100vw - 24px);font-size:16px}
.signup-screen .signup-field input,.signup-screen .signup-submit,.signup-screen .secondary-action,.signup-screen .signup-password-toggle{min-height:48px;font-size:16px}
.signup-screen .signup-field-hint,.signup-screen .email-confirmation-footnote,.signup-screen .signup-next-steps p{font-size:16px}
.signup-screen :is(a,button,input,summary):focus-visible{outline:3px solid #087f7b;outline-offset:3px}