/* ── Android 사전등록 모달 (소셜 로그인 + waitlist) ── */

.wl-overlay{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;padding:24px;background:rgba(10,7,5,0.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);}
.wl-overlay.open{display:flex;}
.wl-modal{position:relative;width:100%;max-width:380px;background:#221a15;border:1px solid rgba(255,255,255,0.10);border-radius:22px;padding:32px 26px 26px;text-align:center;box-shadow:0 24px 70px rgba(0,0,0,0.55);animation:wl-pop .22s ease;}
@keyframes wl-pop{from{opacity:0;transform:translateY(14px) scale(.97);}to{opacity:1;transform:none;}}
.wl-close{position:absolute;top:14px;right:16px;background:none;border:none;color:rgba(255,255,255,0.32);font-size:24px;line-height:1;cursor:pointer;padding:4px;}
.wl-close:hover{color:rgba(255,255,255,0.92);}
.wl-logo{width:92px;height:auto;margin:0 auto 18px;display:block;animation:wl-logo-glow 2.8s ease-in-out infinite;}
@keyframes wl-logo-glow{0%,100%{filter:drop-shadow(0 0 16px rgba(255,107,74,0.40)) drop-shadow(0 4px 14px rgba(255,107,74,0.22));}50%{filter:drop-shadow(0 0 34px rgba(255,107,74,0.80)) drop-shadow(0 4px 22px rgba(255,107,74,0.42));};}
.wl-modal h3{font-size:19px;font-weight:800;line-height:1.4;color:rgba(255,255,255,0.92);margin-bottom:10px;}
.wl-sub{font-size:13.5px;color:rgba(255,255,255,0.55);line-height:1.7;margin-bottom:20px;}
.wl-modal [hidden]{display:none !important;}

/* Step transitions */
.wl-step{display:none;}
.wl-step.active{display:block;animation:wl-pop .22s ease;}

/* ── Step 1: 소셜 로그인 버튼 ── */
.wl-social{display:flex;flex-direction:column;gap:10px;margin-bottom:16px;}

.wl-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:14px 16px;font-size:15px;font-weight:600;border:none;border-radius:12px;cursor:pointer;font-family:inherit;transition:transform .1s,box-shadow .2s;-webkit-appearance:none;}
.wl-btn:hover{transform:translateY(-1px);}
.wl-btn:active{transform:translateY(0);}
.wl-btn svg,.wl-btn img{width:20px;height:20px;flex-shrink:0;}

.wl-btn-kakao{background:#FEE500;color:#191919;}
.wl-btn-kakao:hover{box-shadow:0 4px 16px rgba(254,229,0,0.3);}

.wl-btn-google{background:#fff;color:#333;border:1px solid rgba(255,255,255,0.15);}
.wl-btn-google:hover{box-shadow:0 4px 16px rgba(255,255,255,0.15);}

.wl-skip{display:inline-block;margin-top:4px;font-size:13px;color:rgba(255,255,255,0.40);text-decoration:none;cursor:pointer;background:none;border:none;font-family:inherit;transition:color .2s;}
.wl-skip:hover{color:#FF6B4A;}

/* ── Step 2: 이메일 입력 + 등록 ── */
.wl-modal input[type=email]{width:100%;padding:14px 16px;font-size:15px;color:rgba(255,255,255,0.92);background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.10);border-radius:12px;outline:none;transition:border-color .2s;-webkit-appearance:none;}
.wl-modal input[type=email]:focus{border-color:#FF6B4A;}
.wl-modal input[type=email]::placeholder{color:rgba(255,255,255,0.32);}

.wl-submit{width:100%;padding:14px;font-size:15px;font-weight:700;color:#fff;background:#FF6B4A;border:none;border-radius:12px;cursor:pointer;font-family:inherit;transition:background .2s;margin-top:10px;}
.wl-submit:hover{background:#E8573A;}
.wl-submit:disabled{opacity:.6;cursor:default;}

.wl-consent{margin-top:14px;font-size:11.5px;color:rgba(255,255,255,0.32);line-height:1.6;}
.wl-consent a{color:rgba(255,107,74,0.85);text-decoration:underline;}

/* ── Step 3: 완료 ── */
.wl-success{padding:8px 0 4px;}
.wl-check{width:56px;height:56px;margin:0 auto 14px;border-radius:16px;background:rgba(255,107,74,0.12);border:1px solid rgba(255,107,74,0.30);display:flex;align-items:center;justify-content:center;animation:wl-pop .26s ease;}
.wl-check svg{width:30px;height:30px;}
.wl-success p{font-size:15px;color:rgba(255,255,255,0.92);line-height:1.7;font-weight:600;}

/* ── 인앱 브라우저 분기 ── */
html.is-inapp .wl-btn-google{display:none !important;}
