/* 로그인 · 회원가입 · 비밀번호 찾기 — 왼쪽 브랜드 패널 + 오른쪽 입력 카드 */
body { font-family: var(--font-sans); background: var(--bg); color: var(--t1); }
.auth { display: grid; grid-template-columns: 1.1fr 0.9fr; min-height: 100vh; }

/* 좌측 브랜드 패널 */
.auth-brand {
	position: relative; padding: 56px 60px; display: flex; flex-direction: column; justify-content: space-between;
	background:
		radial-gradient(1200px 600px at 20% 10%, rgba(45,212,191,0.16), transparent 60%),
		radial-gradient(900px 500px at 90% 90%, rgba(88,166,255,0.10), transparent 55%),
		var(--bg2);
	border-right: 1px solid var(--bd);
}
.auth-logo { display: flex; align-items: center; gap: 12px; }
.auth-logo .ic {
	width: 40px; height: 40px; border-radius: 9px; display: flex; align-items: center; justify-content: center;
	background: linear-gradient(135deg, var(--brand), #0e9384);
}
.auth-logo .nm { font-size: 2rem; font-weight: 800; letter-spacing: -0.4px; }
.auth-logo .sb { font-size: 1.1rem; color: var(--t3); margin-top: 1px; }
.auth-hero h1 { font-size: 3.4rem; font-weight: 800; line-height: 1.28; letter-spacing: -0.6px; margin: 0; }
.auth-hero h1 em { font-style: normal; color: var(--brand); }
.auth-hero p { color: var(--t2); font-size: 1.4rem; margin-top: 14px; max-width: 380px; line-height: 1.6; }
.auth-stats { display: flex; gap: 26px; }
.auth-stats .s .v { font-size: 2.2rem; font-weight: 700; font-family: var(--font-mono); }
.auth-stats .s .l { font-size: 1.1rem; color: var(--t3); margin-top: 3px; }

/* 우측 폼 */
.auth-form { display: flex; align-items: center; justify-content: center; padding: 40px; position: relative; }
.auth-form.tall { align-items: flex-start; padding-top: 56px; padding-bottom: 56px; }   /* 칸이 많으면 위에서부터 */
.auth-form .theme-tg { position: absolute; top: 22px; right: 22px; }
.auth-card { width: 360px; max-width: 100%; }
.auth-card.wide { width: 400px; }
.auth-card[hidden] { display: none; }
.auth-card h2 { font-size: 2.2rem; font-weight: 700; letter-spacing: -0.3px; margin: 0 0 4px; }
.auth-card .desc { font-size: 1.3rem; color: var(--t3); margin-bottom: 24px; line-height: 1.5; }
.auth-card .fhelp.ok { color: var(--green); }
.auth-card .fhelp.bad { color: var(--red); }
.auth-submit {
	display: block; width: 100%; margin-top: 22px; padding: 11px; border-radius: var(--r); cursor: pointer;
	background: var(--brand); border: 1px solid var(--brand); color: var(--on-accent);
	font-weight: 700; font-size: 1.4rem; text-align: center; text-decoration: none; transition: filter .13s;
}
.auth-submit:hover { filter: brightness(1.08); }
.auth-submit:disabled { background: var(--suf2); border-color: var(--bd2); color: var(--t3); cursor: default; filter: none; }
.auth-msg { margin-top: 14px; min-height: 18px; font-size: 1.3rem; color: var(--red); white-space: pre-line; }
.auth-links { margin-top: 18px; font-size: 1.2rem; color: var(--t3); text-align: center; }
.auth-links a { color: var(--t2); text-decoration: none; }
.auth-policy { margin-top: 10px; font-size: 1.15rem; color: var(--t3); text-align: center; display: flex; justify-content: center; gap: 8px; }
.auth-policy a { color: var(--t3); text-decoration: none; }
.auth-policy a:hover { color: var(--t1); }

/* 신청·요청을 마친 뒤 안내 */
.auth-done { text-align: center; }
.auth-done h2 { margin-bottom: 10px; }
.auth-done p { font-size: 1.4rem; color: var(--t2); line-height: 1.6; word-break: keep-all; }
.auth-done .auth-submit { margin-top: 26px; }

@media (max-width: 860px) { .auth { grid-template-columns: minmax(0, 1fr); } .auth-brand { display: none; } }
/* 폰 — 카드 + 여백이 화면보다 넓어 옆으로 밀렸다(반응형 설계 §3.4) */
@media (max-width: 767.98px) { .auth-form, .auth-form.tall { padding: 64px 16px 32px; } .auth-form .theme-tg { top: 14px; right: 14px; } }