/* 창홍쌤영어 — 로그인 / 설정 / 관리 공통 디자인
 * 메인 사이트의 색·질감과 통일 (배경 #F5F3EC, 강조 #C96442, 다크 카드 헤더) */

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  min-height:100vh;
  font-family:'Pretendard',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:#1F1E1D;
  -webkit-font-smoothing:antialiased;
  background:
    radial-gradient(900px 500px at 50% -8%, rgba(201,100,66,0.10), rgba(201,100,66,0) 60%),
    radial-gradient(700px 480px at 108% 110%, rgba(201,100,66,0.07), rgba(201,100,66,0) 55%),
    #F5F3EC;
}

@keyframes chpop{from{opacity:0;transform:translateY(10px) scale(.985);}to{opacity:1;transform:none;}}
@keyframes chfade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}

/* ---------- 로그인/설정 : 중앙 카드 ---------- */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;}
.auth-card{
  width:100%;max-width:410px;background:#fff;
  border:1px solid #ECE7DB;border-radius:22px;overflow:hidden;
  box-shadow:0 24px 60px rgba(31,30,29,0.13), 0 2px 6px rgba(31,30,29,0.05);
  animation:chpop .34s cubic-bezier(.2,.7,.3,1);
}

/* 카드 상단 다크 배너 (메일 리프카드 헤더와 동일한 느낌) */
.auth-banner{
  position:relative;overflow:hidden;
  padding:26px 28px 24px;
  background:linear-gradient(152deg,#2D2A25 0%,#201D19 100%);
}
.auth-banner::after{
  content:"";position:absolute;top:-46px;right:-38px;width:150px;height:150px;border-radius:50%;
  background:radial-gradient(circle at 30% 30%, rgba(201,100,66,0.42), rgba(201,100,66,0) 70%);
  pointer-events:none;
}
.auth-brand{position:relative;display:flex;align-items:center;gap:14px;z-index:1;}
.auth-logo{
  width:50px;height:50px;flex:none;border-radius:15px;
  background:linear-gradient(150deg,#D26B47,#BE5836);
  display:flex;align-items:center;justify-content:center;color:#fff;font-size:25px;font-weight:800;letter-spacing:-.02em;
  box-shadow:0 6px 16px rgba(201,100,66,0.45), inset 0 1px 0 rgba(255,255,255,0.2);
}
.auth-brand .t1{font-size:20px;font-weight:800;letter-spacing:-.03em;color:#fff;line-height:1.15;}
.auth-brand .t2{font-size:11.5px;font-weight:600;letter-spacing:.02em;color:rgba(255,255,255,0.62);margin-top:3px;}

/* 카드 본문 */
.auth-body{padding:26px 28px 28px;}
.auth-title{font-size:16px;font-weight:800;letter-spacing:-.01em;margin:0 0 3px;}
.auth-desc{font-size:12.5px;color:#857F76;line-height:1.55;margin:0 0 6px;}

/* ---------- 폼 요소 ---------- */
.fld{margin-top:15px;}
.fld > label{display:block;font-size:12px;font-weight:700;color:#56524B;margin:0 0 6px;}
.inp{
  width:100%;height:48px;padding:0 15px;border:1px solid #E2DDD0;border-radius:12px;
  font-size:15px;font-family:inherit;background:#FBFAF5;color:#1F1E1D;outline:none;
  transition:border-color .14s, background .14s, box-shadow .14s;
}
.inp:focus{border-color:#C96442;background:#fff;box-shadow:0 0 0 3px rgba(201,100,66,0.12);}
.inp::placeholder{color:#BBB6AB;}

/* 비밀번호 보기 토글 */
.pw-wrap{position:relative;}
.pw-wrap .inp{padding-right:52px;}
.pw-toggle{
  position:absolute;top:0;right:0;height:48px;width:48px;border:none;background:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;color:#A39E95;font-family:inherit;
}
.pw-toggle:hover{color:#C96442;}

.btn-primary{
  width:100%;height:50px;margin-top:24px;border:none;border-radius:13px;cursor:pointer;
  background:linear-gradient(180deg,#D06A47,#C25C39);color:#fff;font-size:15.5px;font-weight:700;font-family:inherit;
  box-shadow:0 4px 12px rgba(201,100,66,0.32);transition:filter .14s, box-shadow .14s, transform .08s;
}
.btn-primary:hover{filter:brightness(1.05);box-shadow:0 6px 18px rgba(201,100,66,0.42);}
.btn-primary:active{transform:translateY(1px);}

/* 알림 배너 */
.note{margin-top:16px;padding:11px 14px;border-radius:11px;font-size:13px;line-height:1.5;}
.note.err{background:#FCEBE6;border:1px solid #F3C9BC;color:#B23A1B;}
.note.ok{background:#EAF5EC;border:1px solid #BFE3C6;color:#2C7A3D;}
.note.warn{background:#FBF3E6;border:1px solid #ECD9B4;color:#8A6416;}

.auth-foot{margin-top:22px;text-align:center;font-size:12px;color:#B4AFA4;}
.auth-foot a{color:#9A3F22;text-decoration:none;font-weight:700;}