/* [생성 파일 — 직접 수정 금지]
 * auth.css 를 ".pp-pub" 스코프로 한정한 파생본.
 * 원본이 갱신되면 scripts/scope-css.js 를 재실행해 다시 생성할 것.
 */
@charset "UTF-8";
/**
 * pages/auth — 로그인 서브(ID찾기·비밀번호 재설정) 공통 레이아웃.
 * 공통 컴포넌트 재사용, 이 화면군 고유 배치만. head { "css": "auth" }.
 */
/**
 * SCSS 변수 (연산/믹스인용) — CSS 출력 없음(어디서 @use 해도 중복 없음).
 * :root 토큰은 _tokens.scss 에서 출력.
 */
/* 레이아웃 폭 (PC 전용) */
/**
 * 타이포 스케일 (단일 소스) — @Guide_Typography 기준. key = font-size(px).
 * 여기만 고치면 font() 믹스인과 --fs-* / --lh-* 토큰이 함께 갱신됨.
 */
/**
 * pages/auth — 로그인 서브(ID찾기·비밀번호 재설정) 공통 레이아웃.
 * 공통 컴포넌트 재사용, 이 화면군 고유 배치만. head { "css": "auth" }.
 */
/**
 * 공용 믹스인 — `@use '../common/mixins' as *;`
 */
/**
 * 타이포 스케일 적용(size+line-height 한 쌍). `@include font(20);` → 20px/30px.
 * 허용 키는 $font-scale. weight는 별도(--fw-* 토큰).
 */
/* 중앙 카드형 → 전역 최소폭(#wrap 1200) 해제(축소 시 좌우 여백 균등). auth 로드 페이지 한정 */.pp-pub #wrap{
  min-width: 0;
}

/* 이 화면군 한정 — 푸터 .inner 도 축소 시 좌우 패딩만 줄여 가로 오버플로 방지 */.pp-pub .inner{
  width: 100%;
  max-width: calc(var(--content-width) + 48px);
  padding: 0 24px;
}.pp-pub .find-page{
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: calc(100vh - 140px);
  padding: 40px 0 60px;
  background: var(--n-50);
}

/* 카드 (520 = 440 + 좌우 40, 높이 632 고정 — 상태 전환 시 리사이즈 방지) */.pp-pub .find-card{
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 520px;
  height: 632px;
  padding: 40px;
  background: #fff;
  border-radius: 14px;
}.pp-pub .find-head{
  display: flex;
  flex-direction: column;
  gap: 20px;
}.pp-pub .find-title{
  font-size: 24px;
  line-height: 36px;
  font-weight: var(--fw-bold);
  color: var(--n-900);
  text-align: center;
}.pp-pub .tab-item{
  text-decoration: none;
}.pp-pub .find-form{
  display: flex;
  flex-direction: column;
  gap: 24px;
}.pp-pub .find-fields{
  display: flex;
  flex-direction: column;
  gap: 16px;
}.pp-pub .find-form-title{
  font-size: 18px;
  line-height: 28px;
  font-weight: var(--fw-bold);
  color: var(--n-900);
}.pp-pub .find-inputs{
  display: flex;
  flex-direction: column;
  gap: 10px;
}.pp-pub .find-otp{
  display: flex;
  gap: 8px;
}.pp-pub .find-otp .input{
  flex: 1 1 auto;
  min-width: 0;
}.pp-pub .find-otp-btn{
  flex: 0 0 100px;
}.pp-pub .login-pw{
  position: relative;
}.pp-pub .login-pw .input{
  padding-right: 44px;
}.pp-pub .login-pw-toggle{
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  display: inline-flex;
  padding: 0;
  border: 0;
  background: none;
  color: var(--n-500);
  cursor: pointer;
}

/* 새 비밀번호 폼 — 기본 숨김(비번 재설정 3단계에서 노출) */.pp-pub .find-newpw{
  display: none;
  flex-direction: column;
  gap: 10px;
}

/* 인증코드 — 기본 숨김, OTP 전송 후 노출 */.pp-pub .login-code{
  display: none;
}.pp-pub .find-error{
  display: none;
}

/* 완료: 결과 박스 + 안내 (기본 숨김) */.pp-pub .find-result{
  display: none;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 32px 20px;
  background: var(--n-40);
  border-radius: 10px;
}.pp-pub .find-result-id{
  font-size: 18px;
  line-height: 28px;
  font-weight: var(--fw-semibold);
  color: var(--color-point);
}.pp-pub .find-result-title{
  font-size: 16px;
  line-height: 24px;
  font-weight: var(--fw-bold);
  color: var(--n-900);
}.pp-pub .find-result-desc{
  font-size: 15px;
  line-height: 22px;
  color: var(--n-600);
  text-align: center;
}.pp-pub .find-done-btns{
  display: none;
  gap: 16px;
}.pp-pub .find-done-btns .btn{
  flex: 1 1 0;
}

/* OTP 전송 후 (.btn-otp → .is-otp-sent) */.pp-pub .login-form.is-otp-sent .login-code{
  display: block;
}.pp-pub .login-form.is-otp-sent .btn-otp{
  background: var(--n-50);
  border-color: transparent;
  color: var(--n-900);
}.pp-pub .login-form.is-otp-sent .btn-otp:hover{
  background: var(--n-100);
}

/* (ID찾기) 확인 1회 → 오류 */.pp-pub .login-form.is-error .find-error{
  display: flex;
}

/* (비번재설정) 확인 → 새 비밀번호 단계 전환 */.pp-pub .login-form.is-newpw .find-inputs, .pp-pub .login-form.is-newpw .find-error{
  display: none;
}.pp-pub .login-form.is-newpw .find-newpw{
  display: flex;
}

/* 완료: 결과·완료버튼 노출, 나머지 숨김 */.pp-pub .login-form.is-done .find-inputs, .pp-pub .login-form.is-done .find-newpw, .pp-pub .login-form.is-done .find-error, .pp-pub .login-form.is-done .find-submit, .pp-pub .login-form.is-done .reset-submit{
  display: none;
}.pp-pub .login-form.is-done .find-result{
  display: flex;
}.pp-pub .login-form.is-done .find-done-btns{
  display: flex;
}