/* ===== Exit Popup - Common ===== */
#exitpopup { position:fixed; inset:0; z-index:99999; visibility:hidden; opacity:0; transition:opacity 0.2s ease; }
#exitpopup.ep-show { visibility:visible; opacity:1; }
#exitpopup .ep-overlay { position:absolute; inset:0; background:rgba(15,23,42,0.55); }
#exitpopup .ep-box { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%) scale(0.96); width:92%; max-width:440px; background:#fff; border-radius:18px; overflow:hidden; box-shadow:0 24px 60px rgba(0,0,0,0.35); transition:transform 0.25s ease; max-height:90vh; overflow-y:auto; }
#exitpopup.ep-show .ep-box { transform:translate(-50%, -50%) scale(1); }
#exitpopup .ep-x { position:absolute; top:14px; right:14px; width:30px; height:30px; border:none; background:rgba(255,255,255,0.3); color:#fff; border-radius:50%; font-size:18px; line-height:1; cursor:pointer; z-index:3; padding:0; }
#exitpopup .ep-x:hover { background:rgba(255,255,255,0.45); }
#exitpopup .ep-head { padding:28px 28px 20px; position:relative; overflow:hidden; }
#exitpopup .ep-title { font-size:22px; font-weight:800; line-height:1.35; margin:0; position:relative; z-index:1; }
#exitpopup .ep-body { padding:22px 28px 26px; }
#exitpopup .ep-msg { font-size:14px; color:#475569; line-height:1.6; margin:0 0 14px; }
#exitpopup .ep-highlight { display:flex; align-items:center; gap:12px; border-radius:12px; padding:14px 16px; margin-bottom:20px; }
#exitpopup .ep-highlight .ep-icon { width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:20px; flex-shrink:0; }
#exitpopup .ep-highlight .ep-htext { font-size:14px; font-weight:700; line-height:1.5; }
#exitpopup .ep-btns { display:flex; gap:10px; }
#exitpopup .ep-btns .ep-reject, #exitpopup .ep-btns .ep-primary { flex:1; padding:14px 10px; border-radius:10px; border:none; font-size:14px; font-weight:700; cursor:pointer; transition:all 0.15s; text-align:center; text-decoration:none; box-sizing:border-box; }
#exitpopup .ep-btns .ep-reject { background:#f1f5f9; color:#64748b; }
#exitpopup .ep-btns .ep-reject:hover { background:#e2e8f0; }
#exitpopup .ep-btns .ep-primary { color:#fff; display:flex; align-items:center; justify-content:center; }

/* ===== Design A : 본사 (skinY + 종합스킨) ===== */
#exitpopup.ep-A .ep-head { background:linear-gradient(135deg, #1e293b 0%, #0f172a 100%); color:#fff; }
#exitpopup.ep-A .ep-highlight { background:#f1f5f9; border:1px solid #cbd5e1; }
#exitpopup.ep-A .ep-highlight .ep-icon { background:linear-gradient(135deg, #1e293b, #0f172a); }
#exitpopup.ep-A .ep-highlight .ep-htext { color:#0f172a; }
#exitpopup.ep-A .ep-btns .ep-primary { background:linear-gradient(135deg, #1e293b, #0f172a); box-shadow:0 6px 18px rgba(15,23,42,0.35); }
#exitpopup.ep-A .ep-btns .ep-primary:hover { transform:translateY(-1px); box-shadow:0 10px 22px rgba(15,23,42,0.45); }

/* ===== Design B : basic + skin2 ===== */
#exitpopup.ep-B .ep-box { border-top:4px solid #2563eb; border-radius:12px; }
#exitpopup.ep-B .ep-head { background:#fff; padding:32px 28px 10px; text-align:center; color:#1e293b; }
#exitpopup.ep-B .ep-head::before { content:""; display:block; width:68px; height:68px; border-radius:50%; background:#eff6ff; margin:0 auto 14px; background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%232563eb'><path d='M20 7h-3V5c0-1.1-.9-2-2-2H9c-1.1 0-2 .9-2 2v2H4c-1.1 0-2 .9-2 2v11c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V9c0-1.1-.9-2-2-2zM9 5h6v2H9V5zm11 15H4V9h16v11z'/><path d='M11 12h2v5h-2zM8 14h8v1H8z'/></svg>"); background-size:36px; background-repeat:no-repeat; background-position:center; }
#exitpopup.ep-B .ep-title { font-size:20px; }
#exitpopup.ep-B .ep-body { text-align:center; padding:14px 28px 24px; }
#exitpopup.ep-B .ep-msg { font-size:13px; color:#64748b; margin-bottom:18px; }
#exitpopup.ep-B .ep-highlight { background:#f8fafc; border:1px dashed #cbd5e1; flex-direction:column; gap:6px; padding:16px; text-align:center; }
#exitpopup.ep-B .ep-highlight .ep-icon { display:none; }
#exitpopup.ep-B .ep-highlight .ep-htext { font-size:15px; color:#1e293b; font-weight:800; }
#exitpopup.ep-B .ep-x { background:transparent; color:#cbd5e1; font-size:26px; }
#exitpopup.ep-B .ep-x:hover { color:#64748b; background:transparent; }
#exitpopup.ep-B .ep-btns .ep-primary { background:#2563eb; }
#exitpopup.ep-B .ep-btns .ep-primary:hover { background:#1d4ed8; }

/* ===== Design C : skinJ ===== */
#exitpopup.ep-C .ep-box { background:#0f172a; color:#fff; border-radius:20px; }
#exitpopup.ep-C .ep-head { padding:40px 28px 8px; text-align:center; }
#exitpopup.ep-C .ep-head::before { content:""; position:absolute; top:-120px; left:50%; transform:translateX(-50%); width:260px; height:260px; background:radial-gradient(circle, rgba(252,211,77,0.22) 0%, transparent 60%); pointer-events:none; }
#exitpopup.ep-C .ep-emoji { font-size:44px; margin-bottom:6px; position:relative; }
#exitpopup.ep-C .ep-title { font-size:22px; color:#fff; }
#exitpopup.ep-C .ep-body { padding:10px 28px 0; text-align:center; }
#exitpopup.ep-C .ep-msg { font-size:14px; color:#cbd5e1; margin-bottom:0; line-height:1.7; }
#exitpopup.ep-C .ep-highlight { background:none; padding:14px 0 22px; justify-content:center; flex-direction:column; gap:4px; text-align:center; border:none; margin-bottom:0; }
#exitpopup.ep-C .ep-highlight .ep-icon { display:none; }
#exitpopup.ep-C .ep-highlight .ep-htext { font-size:18px; color:#fcd34d; font-weight:900; }
#exitpopup.ep-C .ep-btns { gap:0; border-top:1px solid rgba(255,255,255,0.08); }
#exitpopup.ep-C .ep-btns .ep-reject { background:transparent; color:#94a3b8; border-radius:0; padding:16px; }
#exitpopup.ep-C .ep-btns .ep-reject:hover { background:rgba(255,255,255,0.05); color:#fff; }
#exitpopup.ep-C .ep-btns .ep-primary { background:#eab308; color:#0f172a; border-radius:0; padding:16px; }
#exitpopup.ep-C .ep-btns .ep-primary:hover { background:#fcd34d; transform:none; box-shadow:none; }
#exitpopup.ep-C .ep-x { background:rgba(255,255,255,0.1); color:#fff; }
#exitpopup.ep-C .ep-x:hover { background:rgba(255,255,255,0.25); }

/* ===== 모바일 반응형 ===== */
@media (max-width: 480px){
	#exitpopup .ep-box { max-width:340px; }
	#exitpopup .ep-head { padding:22px 20px 16px; }
	#exitpopup .ep-title { font-size:18px; }
	#exitpopup .ep-body { padding:18px 20px 22px; }
	#exitpopup .ep-msg { font-size:13px; }
	#exitpopup .ep-highlight { padding:12px; }
	#exitpopup .ep-highlight .ep-htext { font-size:13px; }
	#exitpopup .ep-btns .ep-reject, #exitpopup .ep-btns .ep-primary { padding:12px 8px; font-size:13px; }
	#exitpopup.ep-C .ep-head { padding:34px 22px 6px; }
	#exitpopup.ep-C .ep-emoji { font-size:36px; }
	#exitpopup.ep-C .ep-highlight .ep-htext { font-size:15px; }
	#exitpopup.ep-B .ep-head { padding:28px 22px 8px; }
	#exitpopup.ep-B .ep-head::before { width:56px; height:56px; background-size:28px; }
}