/* Extracted from user/register.php during UI migration. */
.register-page {
    width: min(100%, 960px);
    margin: 0 auto;
    padding: 44px 20px 64px;
    box-sizing: border-box;
  }
  .register-card {
    width: 100%;
    max-width: 640px;
    margin: 0 auto;
    padding: 30px;
    color: #202731;
    background: #fff;
    border: 1px solid #dfe5ec;
    border-radius: 18px;
    box-sizing: border-box;
    box-shadow: 0 10px 30px rgba(40,83,124,.06);
  }
  .register-card h1 {
    margin: 0;
    text-align: center;
    font-size: 28px;
    line-height: 1.25;
  }
  .register-subtitle {
    margin: 8px 0 20px;
    text-align: center;
    color: #66717e;
    font-size: 14px;
  }
  .back-link {
    display: inline-flex;
    margin-bottom: 14px;
    color: #087cf0;
    text-decoration: none;
  }
  .register-card label {
    display: block;
    margin: 14px 0 6px;
    font-weight: 600;
    color: inherit;
  }
  .register-card input[type="text"],
  .register-card input[type="password"],
  .register-card input[type="email"] {
    width: 100%;
    min-height: 46px;
    padding: 10px 12px;
    color: #202731;
    background: #fff;
    border: 1px solid #b9c4d0;
    border-radius: 11px;
    outline: none;
    box-sizing: border-box;
  }
  .register-card input:focus {
    border-color: #1683ff;
    box-shadow: 0 0 0 3px rgba(22,131,255,.14);
  }
  .password-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  .password-wrap {
    position: relative;
  }
  .password-wrap input {
    padding-right: 64px !important;
  }
  .password-toggle {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    padding: 5px 7px;
    border: 0;
    border-radius: 6px;
    color: #526170;
    background: transparent;
    cursor: pointer;
    font-size: 12px;
  }
  .captcha-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 122px 150px;
    gap: 10px;
    align-items: stretch;
  }
  .captcha-img {
    width: 122px;
    height: 46px;
    object-fit: contain;
    background: #fff;
    border: 1px solid #dfe5ec;
    border-radius: 11px;
    cursor: pointer;
  }
  .send-code,
  .register-submit {
    min-height: 46px;
    border: 0;
    border-radius: 11px;
    color: #fff !important;
    background: #087cf0 !important;
    font-weight: 700;
    cursor: pointer;
  }
  .send-code:hover,
  .register-submit:hover { background: #0669cc !important; }
  .send-code:disabled,
  .register-submit:disabled {
    opacity: .58;
    cursor: not-allowed;
  }
  .register-submit {
    width: 100%;
    margin-top: 18px;
  }
  .field-help {
    margin-top: 7px;
    color: #66717e;
    font-size: 13px;
    line-height: 1.45;
  }
  .message {
    margin: 12px 0;
    padding: 11px 12px;
    border: 1px solid transparent;
    border-radius: 8px;
    line-height: 1.5;
  }
  .message.error {
    color: #b42318;
    background: #fff1f2;
    border-color: #fecdd3;
  }
  .message.success {
    color: #067647;
    background: #ecfdf3;
    border-color: #abefc6;
  }
  .password-error {
    display: none;
    margin-top: 6px;
    color: #c62828;
    font-size: 12px;
  }
  .policy {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 18px;
  }
  .policy input {
    width: 18px;
    height: 18px;
    margin: 2px 0 0;
    accent-color: #087cf0;
    flex: 0 0 auto;
  }
  .policy label {
    display: inline;
    margin: 0;
    font-weight: 400;
  }
  .login-note {
    margin: 12px 0 0;
    text-align: center;
    color: #66717e;
  }
  html[data-theme="dark"] .register-card {
    color: var(--qn-theme-text) !important;
    background: var(--qn-theme-surface) !important;
    border-color: var(--qn-theme-border) !important;
    box-shadow: none;
  }
  html[data-theme="dark"] .register-subtitle,
  html[data-theme="dark"] .field-help,
  html[data-theme="dark"] .login-note {
    color: var(--qn-theme-muted) !important;
  }
  html[data-theme="dark"] .register-card input[type="text"],
  html[data-theme="dark"] .register-card input[type="password"],
  html[data-theme="dark"] .register-card input[type="email"] {
    color: #eef4fb !important;
    background: #101721 !important;
    border-color: #465363 !important;
    caret-color: #fff;
  }
  html[data-theme="dark"] .register-card input::placeholder {
    color: #8290a0 !important;
    opacity: 1;
  }
  html[data-theme="dark"] .register-card input:-webkit-autofill,
  html[data-theme="dark"] .register-card input:-webkit-autofill:hover,
  html[data-theme="dark"] .register-card input:-webkit-autofill:focus {
    -webkit-text-fill-color: #eef4fb !important;
    box-shadow: 0 0 0 1000px #101721 inset !important;
    border-color: #465363 !important;
  }
  html[data-theme="dark"] .password-toggle {
    color: #b7c4d1 !important;
  }
  html[data-theme="dark"] .message.error {
    color: #ffb4ab;
    background: rgba(139, 35, 35, .22);
    border-color: rgba(255, 180, 171, .3);
  }
  html[data-theme="dark"] .message.success {
    color: #8fe0a4;
    background: rgba(21, 101, 52, .24);
    border-color: rgba(143, 224, 164, .28);
  }
  .register-card [hidden] { display: none !important; }
  .qn-step-badge {
    width: fit-content;
    margin: 0 auto 10px;
    padding: 5px 10px;
    color: #176dde;
    background: #eef4ff;
    border: 1px solid #d8e5ff;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
  }
  .qn-register-google {
    margin: 18px 0 12px;
    padding: 18px;
    text-align: center;
    background: #f7f9ff;
    border: 1px solid #dbe4ff;
    border-radius: 14px;
  }
  .qn-register-google-title {
    margin-bottom: 12px;
    color: #26364d;
    font-weight: 700;
  }
  .qn-register-google .g_id_signin {
    display: flex;
    justify-content: center;
    min-height: 44px;
  }
  .qn-auth-separator {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 16px 0 4px;
    color: #7b8798;
    font-size: 13px;
  }
  .qn-auth-separator::before,
  .qn-auth-separator::after {
    content: "";
    height: 1px;
    background: #e2e7ef;
    flex: 1;
  }
  .qn-step-next { margin-top: 14px !important; }
  .qn-existing-account-step {
    margin-top: 16px;
    padding-top: 4px;
  }
  .qn-account-summary {
    display: grid;
    gap: 4px;
    margin: 4px 0 12px;
    padding: 12px 14px;
    color: #445268;
    background: #f7f9fc;
    border: 1px solid #e0e6ef;
    border-radius: 11px;
    font-size: 13px;
  }
  .qn-step-actions {
    display: flex;
    gap: 10px;
    margin-top: 16px;
  }
  .qn-step-actions > * { flex: 1; margin-top: 0 !important; }
  .qn-secondary-action {
    min-height: 46px;
    border: 1px solid #c8d1de;
    border-radius: 11px;
    color: #36465a;
    background: #fff;
    font-weight: 650;
    cursor: pointer;
  }
  #company-step {
    margin: 14px 0 2px;
    padding: 16px;
    background: #f8faff;
    border: 1px solid #e1e7f5;
    border-radius: 13px;
  }
  #company-step > strong {
    display: block;
    margin-bottom: 6px;
    color: #26364d;
  }
  html[data-theme="dark"] .qn-step-badge {
    color: #9fc6ff;
    background: #15233a;
    border-color: #29466f;
  }
  html[data-theme="dark"] .qn-register-google,
  html[data-theme="dark"] #company-step,
  html[data-theme="dark"] .qn-account-summary {
    color: #cbd6e3;
    background: #121923;
    border-color: #303b48;
  }
  html[data-theme="dark"] .qn-register-google-title,
  html[data-theme="dark"] #company-step > strong { color: #eef4fb; }
  html[data-theme="dark"] .qn-auth-separator { color: #93a2b4; }
  html[data-theme="dark"] .qn-auth-separator::before,
  html[data-theme="dark"] .qn-auth-separator::after { background: #303b48; }
  html[data-theme="dark"] .qn-secondary-action {
    color: #dce6f2;
    background: #101721;
    border-color: #465363;
  }

  @media (max-width: 680px) {
    .register-page { padding: 18px 10px 36px; }
    .register-card { padding: 20px 15px; border-radius: 12px; }
    .register-card h1 { font-size: 27px; }
    .password-grid { grid-template-columns: 1fr; gap: 0; }
    .captcha-row { grid-template-columns: 1fr 118px; }
    .captcha-row .send-code { grid-column: 1 / -1; }
    .captcha-img { width: 118px; }
    .qn-register-google { padding: 14px 10px; }
    .qn-register-google .g_id_signin { max-width: 100%; overflow: hidden; }
    .qn-step-actions { flex-direction: column-reverse; }
  }