/* RNDBOX 로그인 · 회원가입 · 아이디/비밀번호 찾기 (리뉴얼) — 토큰은 rb.css */

.auth { display: flex; justify-content: center; padding: 6.4rem var(--rb-gutter) 8.8rem; background: var(--rb-bg-2); }
.auth-card {
    width: 100%; max-width: 46rem; padding: 4.8rem 4rem 4rem;
    border-radius: var(--rb-radius-xl); background: #fff; box-shadow: var(--rb-shadow-2);
}
.auth--wide .auth-card { max-width: 56rem; }
.auth-title { margin: 0; text-align: center; font: 800 2.8rem/1.25 var(--rb-font-display); letter-spacing: -.02em; color: var(--rb-ink); }
.auth-sub { margin: .8rem 0 0; text-align: center; font-size: 1.35rem; color: var(--rb-ink-3); }
.auth-req { margin-left: .2rem; color: var(--rb-hot-ink); }
.auth-form { margin-top: 3.2rem; }

/* 입력 */
.auth-field { display: grid; gap: .8rem; margin-top: 2rem; }
.auth-field:first-of-type { margin-top: 0; }
.auth-label { font-size: 1.4rem; font-weight: 600; color: var(--rb-ink-2); }
.auth-input {
    width: 100%; height: 4.8rem; padding: 0 1.6rem;
    border: 1px solid var(--rb-line-2); border-radius: var(--rb-radius-sm); background: #fff;
    font: 500 1.5rem/1.2 var(--rb-font); color: var(--rb-ink);
    transition: border-color .2s, box-shadow .2s;
}
.auth-input::placeholder { color: #8A8499; font-weight: 400; }
.auth-input:hover { border-color: var(--rb-ink-4); }
.auth-input:focus { outline: none; border-color: var(--rb-violet); box-shadow: 0 0 0 4px rgba(109, 58, 237, .14); }
.auth-input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; }
.auth-row { display: flex; gap: .8rem; }
.auth-row + .auth-row { margin-top: .2rem; }
.auth-row .auth-input { flex: 1 1 auto; min-width: 0; }
.check_btn {
    flex: none; min-width: 10.4rem; height: 4.8rem; padding: 0 1.4rem;
    border: 1px solid var(--rb-ink); border-radius: var(--rb-radius-sm); background: #fff;
    font: 600 1.35rem/1 var(--rb-font); color: var(--rb-ink); white-space: nowrap; cursor: pointer;
    transition: background-color .2s, color .2s;
}
.check_btn:hover { background: var(--rb-ink); color: #fff; }
.input_msg { min-height: 1.8rem; margin: 0; font-size: 1.3rem; }
.input_msg:empty { min-height: 0; }
.input_msg.ok, .find_result.ok { color: #12804A; }
.input_msg.bad, .find_result.bad { color: var(--rb-hot-ink); }
.auth-note { margin: .2rem 0 0; font-size: 1.25rem; line-height: 1.6; color: var(--rb-ink-3); }

.auth-check { display: inline-flex; align-items: center; gap: .8rem; min-height: 4.4rem; font-size: 1.4rem; color: var(--rb-ink-2); cursor: pointer; }
.auth-check input { width: 2rem; height: 2rem; margin: 0; accent-color: var(--rb-violet); cursor: pointer; }
.auth-error { margin: .4rem 0 0; padding: 1.2rem 1.4rem; border-radius: var(--rb-radius-sm); background: #FFF1F1; font-size: 1.35rem; color: var(--rb-hot-ink); }
.auth-submit { margin-top: 2rem; min-height: 5.2rem; font-size: 1.6rem; }
.find_result { margin: 1.6rem 0 0; text-align: center; font-size: 1.45rem; font-weight: 600; line-height: 1.6; }
.find_result:empty { margin: 0; }

/* 링크 · 소셜 */
.auth-links { display: flex; justify-content: center; flex-wrap: wrap; margin-top: 1.6rem; }
.auth-links a { position: relative; display: inline-flex; align-items: center; min-height: 4.4rem; padding: 0 1.4rem; font-size: 1.35rem; color: var(--rb-ink-3); }
.auth-links a:hover { color: var(--rb-ink); }
.auth-links a + a::before { content: ""; position: absolute; left: 0; top: 50%; width: 1px; height: 1.2rem; margin-top: -.6rem; background: var(--rb-line-2); }
.auth-divider { height: 1px; margin: 2rem 0; border: 0; background: var(--rb-line); }
.auth-social { display: grid; gap: .8rem; }
.auth-social__btn {
    position: relative; display: flex; align-items: center; justify-content: center;
    min-height: 4.8rem; padding: 0 5.2rem; border: 1px solid var(--rb-line-2); border-radius: var(--rb-radius-sm);
    background: #fff; font-size: 1.5rem; font-weight: 600; color: var(--rb-ink); transition: background-color .2s, border-color .2s;
}
.auth-social__btn img { position: absolute; left: 1.8rem; top: 50%; width: 2.2rem; height: 2.2rem; margin-top: -1.1rem; }
.auth-social__btn:hover { background: var(--rb-bg-2); color: var(--rb-ink); }
.auth-social__btn--kakao { border-color: #FEE500; background: #FEE500; color: rgba(0, 0, 0, .88); }
.auth-social__btn--kakao:hover { border-color: #F5DA00; background: #F5DA00; color: rgba(0, 0, 0, .88); }
.auth-social__btn--apple { border-color: #000; background: #000; color: #fff; }
.auth-social__btn--apple:hover { border-color: #1F1F1F; background: #1F1F1F; color: #fff; }
.auth-hint { margin: 2.4rem 0 0; padding: 1.4rem 1.6rem; border-radius: var(--rb-radius-sm); background: var(--rb-violet-50); text-align: center; font-size: 1.3rem; line-height: 1.7; color: var(--rb-ink-2); }
.auth-hint b { color: var(--rb-violet-ink); }

/* 약관 동의 */
.agree { margin-top: 3.2rem; border: 1px solid var(--rb-line); border-radius: var(--rb-radius); overflow: hidden; }
.agree-all { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; padding: .6rem 1.6rem; background: var(--rb-violet-50); }
.agree-all__label { font-size: 1.5rem; font-weight: 700; color: var(--rb-ink); }
.agree-all__doc { flex: none; display: inline-flex; align-items: center; min-height: 4.4rem; font-size: 1.3rem; font-weight: 600; color: var(--rb-violet); }
.agree-item { padding: .6rem 1.6rem 1.6rem; border-top: 1px solid var(--rb-line); }
.agree-item__head { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; }
.agree-item__title { font-size: 1.4rem; font-weight: 600; color: var(--rb-ink); }
.agree-item__head .auth-check { flex: none; font-size: 1.3rem; }
.agree-item__body { max-height: 14rem; overflow: auto; padding: 1.2rem 1.4rem; border-radius: var(--rb-radius-xs); background: var(--rb-bg-2); font-size: 1.25rem; line-height: 1.7; color: var(--rb-ink-3); }
.agree-item__body p { margin: 0 0 .8rem; }
.agree-item__body p:last-child { margin-bottom: 0; }
.agree-item__body:focus-visible { outline-offset: 0; }

/* 로그인 잠금 */
.login_lock_overlay { position: fixed; inset: 0; z-index: 10020; display: none; align-items: center; justify-content: center; padding: 2.4rem; background: rgba(14, 10, 24, .55); }
.login_lock_alert { width: min(36rem, 100%); padding: 3.2rem 2.4rem 2rem; border-radius: var(--rb-radius-lg); background: #fff; box-shadow: var(--rb-shadow-3); text-align: center; }
.login_lock_message { font-size: 1.6rem; font-weight: 700; line-height: 1.5; color: var(--rb-ink); }
.login_lock_timer { margin: 1rem 0 2.4rem; font: 700 1.5rem/1.4 var(--rb-font-display); font-variant-numeric: tabular-nums; color: var(--rb-hot-ink); }

@media (max-width: 767px) {
    .auth { padding: 2.4rem var(--rb-gutter) 4.8rem; background: #fff; }
    .auth-card, .auth--wide .auth-card { max-width: 48rem; padding: 0; border-radius: 0; box-shadow: none; }
    .auth-title { font-size: 2.4rem; }
    .auth-form { margin-top: 2.4rem; }
    .check_btn { min-width: 9.2rem; padding: 0 1.1rem; font-size: 1.3rem; }
    .agree-all, .agree-item { padding-inline: 1.2rem; }
}
@media (max-width: 359px) {
    .auth-row { flex-wrap: wrap; }
    .auth-row .check_btn { flex: 1 1 100%; }
}