/* ===== 로그인/회원가입/인증 공통 ===== */
.auth-error{
  background:rgba(244,114,182,.12);
  border:1px solid rgba(244,114,182,.4);
  color:#fbcfe8;
  font-size:13px;font-weight:500;
  padding:11px 14px;border-radius:10px;margin-bottom:18px;
}
.auth-notice{
  background:rgba(52,211,153,.12);
  border:1px solid rgba(52,211,153,.4);
  color:#a7f3d0;
  font-size:13px;font-weight:500;
  padding:11px 14px;border-radius:10px;margin-bottom:18px;
}
.code-input{
  text-align:center;letter-spacing:.5em;
  font-size:24px;font-weight:800;
  font-variant-numeric:tabular-nums;
}
.resend-form{margin:0}
.linklike{
  color:var(--accent);font-weight:700;font-size:14px;
  background:none;border:none;padding:0;cursor:pointer;
}
.linklike:hover{opacity:.85}

/* ===== 로그인 페이지 ===== */
.auth-wrap{
  min-height:100vh;
  display:grid;
  grid-template-columns:1.05fr .95fr;
}

/* 왼쪽 비주얼 패널 */
.auth-visual{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:clamp(28px,4vw,56px);
  background:
    radial-gradient(90% 80% at 20% 15%, #1e1b4b 0%, #13102a 45%, #09090b 100%);
}
.auth-visual::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(40% 40% at 82% 22%, rgba(129,140,248,.14), transparent 70%),
    radial-gradient(35% 35% at 15% 90%, rgba(244,114,182,.10), transparent 70%);
}
.auth-visual .brand{font-size:22px;position:relative;z-index:2}
.auth-copy{position:relative;z-index:2;max-width:420px}
.auth-copy .eyebrow{margin-bottom:18px}
.auth-copy h2{
  font-size:clamp(26px,3.4vw,40px);font-weight:900;line-height:1.18;
  letter-spacing:-.03em;margin-bottom:16px;
}
.auth-copy p{color:var(--fg-dim);font-size:15px;line-height:1.7}
.auth-visual .foot-copy{position:relative;z-index:2;color:var(--fg-faint)}

/* 오른쪽 폼 패널 */
.auth-panel{
  display:flex;align-items:center;justify-content:center;
  padding:clamp(28px,5vw,64px);
  background:var(--bg-900);
}
.auth-card{width:100%;max-width:400px}
.auth-card .to-home{
  display:inline-flex;align-items:center;gap:6px;
  font-size:13px;color:var(--fg-faint);margin-bottom:28px;transition:color .2s;
}
.auth-card .to-home:hover{color:var(--fg-dim)}
.auth-card .to-home svg{width:16px;height:16px}
.auth-card h1{font-size:26px;font-weight:900;letter-spacing:-.02em;margin-bottom:8px}
.auth-card .lead{color:var(--fg-dim);font-size:14px;margin-bottom:30px}

/* 소셜 로그인 */
.social-list{display:flex;flex-direction:column;gap:10px;margin-bottom:24px}
.social-btn{
  display:flex;align-items:center;justify-content:center;gap:10px;
  width:100%;padding:13px 18px;border-radius:10px;
  font-size:14px;font-weight:700;border:1px solid var(--line);
  background:var(--bg-800);color:var(--fg);transition:.2s var(--ease);
}
.social-btn:hover{background:var(--bg-700);transform:translateY(-1px)}
.social-btn svg,.social-btn img{width:18px;height:18px}
.social-btn.kakao{background:#FEE500;color:#191600;border-color:transparent}
.social-btn.kakao:hover{background:#ffe94d}
.social-btn.naver{background:#03C75A;color:#fff;border-color:transparent}
.social-btn.naver:hover{background:#04d763}

.divider-or{
  display:flex;align-items:center;gap:14px;
  color:var(--fg-faint);font-size:12px;margin:22px 0;
}
.divider-or::before,.divider-or::after{content:"";flex:1;height:1px;background:var(--line)}

/* 폼 필드 */
.field{margin-bottom:16px}
.field label{display:block;font-size:13px;font-weight:700;color:var(--fg-dim);margin-bottom:8px}
.field input{
  width:100%;padding:13px 14px;border-radius:10px;
  background:var(--bg-800);border:1px solid var(--line);
  color:var(--fg);font-size:14px;font-family:inherit;transition:.2s;
}
.field input::placeholder{color:var(--fg-faint)}
.field input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}

.field-row{display:flex;align-items:center;justify-content:space-between;margin:4px 0 22px}
.remember{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--fg-dim);cursor:pointer}
.remember input{width:16px;height:16px;accent-color:var(--accent)}
.forgot{font-size:13px;color:var(--accent);transition:opacity .2s}
.forgot:hover{opacity:.8}

.submit-btn{
  width:100%;padding:14px;border-radius:10px;
  background:var(--fg);color:var(--bg-900);
  font-size:15px;font-weight:800;transition:.2s var(--ease);
}
.submit-btn:hover{background:#fff;transform:translateY(-1px)}

.auth-switch{text-align:center;font-size:14px;color:var(--fg-dim);margin-top:26px}
.auth-switch a{color:var(--accent);font-weight:700}
.auth-switch a:hover{opacity:.85}

/* 약관 동의 (회원가입) */
.agree{display:flex;flex-direction:column;gap:11px;margin:4px 0 22px}
.agree label{display:flex;align-items:flex-start;gap:9px;font-size:13px;color:var(--fg-dim);cursor:pointer;line-height:1.5}
.agree input{width:16px;height:16px;margin-top:1px;flex-shrink:0;accent-color:var(--accent)}
.agree label.all{font-weight:700;color:var(--fg);padding-bottom:11px;border-bottom:1px solid var(--line)}
.agree a{color:var(--accent)}
.agree a:hover{opacity:.85}
.agree .opt{color:var(--fg-faint)}

@media (max-width:860px){
  .auth-wrap{grid-template-columns:1fr}
  .auth-visual{display:none}
  .auth-panel{min-height:100vh}
}