design: 우주 테마 배경 추가

- 반짝이는 별(twinkle 애니메이션)
- 유성(shooting star) 효과
- 관리자/로그인/공개 페이지 전체 적용
- 기존 글래스모피즘 유지 + 우주 배경 레이어 추가

src/services/crawler.js

@@ -317,8 +317,14 @@ ${adsenseScript}
 :root{--primary:#6c5ce7;--primary-light:#a29bfe;--bg:#080b16;--bg-card:#12122a;--bg-card-hover:#1a1a3e;--text:#e0e0ee;--text-muted:#7878aa;--accent:#00cec9;--gold:#ffd700;--silver:#c0c0c0;--bronze:#cd7f32;--danger:#ff6b6b;--border:#1e1e44;--star:#f9ca24}
 *{margin:0;padding:0;box-sizing:border-box}
 body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Noto Sans KR',sans-serif;background:var(--bg);color:var(--text);line-height:1.6;min-height:100vh;position:relative;overflow-x:hidden}
-body::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;background:radial-gradient(600px circle at 20% 20%,rgba(108,92,231,.12),transparent 50%),radial-gradient(500px circle at 80% 60%,rgba(0,206,201,.08),transparent 50%),radial-gradient(400px circle at 50% 80%,rgba(139,92,246,.06),transparent 50%);animation:bgShift 15s ease-in-out infinite alternate;pointer-events:none}
+body::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;background:radial-gradient(600px circle at 20% 20%,rgba(108,92,231,.1),transparent 50%),radial-gradient(500px circle at 80% 60%,rgba(0,206,201,.07),transparent 50%),radial-gradient(400px circle at 50% 80%,rgba(139,92,246,.05),transparent 50%);animation:bgShift 20s ease-in-out infinite alternate;pointer-events:none}
+body::after{content:'';position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none;background-image:radial-gradient(1px 1px at 10% 15%,rgba(255,255,255,.7),transparent),radial-gradient(1.5px 1.5px at 25% 60%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 40% 8%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 55% 42%,rgba(255,255,255,.4),transparent),radial-gradient(1.5px 1.5px at 72% 78%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 88% 25%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 15% 88%,rgba(255,255,255,.4),transparent),radial-gradient(1.5px 1.5px at 62% 12%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 92% 52%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 33% 38%,rgba(255,255,255,.3),transparent),radial-gradient(1.5px 1.5px at 5% 48%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 78% 22%,rgba(255,255,255,.4),transparent),radial-gradient(1px 1px at 48% 72%,rgba(255,255,255,.5),transparent),radial-gradient(1.5px 1.5px at 18% 92%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 58% 95%,rgba(255,255,255,.4),transparent),radial-gradient(1.5px 1.5px at 82% 88%,rgba(255,255,255,.5),transparent);animation:twinkle 4s ease-in-out infinite alternate}
 @keyframes bgShift{0%{transform:translate(0,0) scale(1)}50%{transform:translate(-20px,15px) scale(1.05)}100%{transform:translate(15px,-10px) scale(1)}}
+@keyframes twinkle{0%{opacity:.5}100%{opacity:1}}
+.shooting-star{position:fixed;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.8),transparent);z-index:0;pointer-events:none;opacity:0}
+.shooting-star:nth-child(1){top:18%;left:35%;width:90px;animation:shoot 4s ease-in-out infinite}
+.shooting-star:nth-child(2){top:55%;left:55%;width:70px;animation:shoot 4s ease-in-out 2.5s infinite}
+@keyframes shoot{0%{transform:translateX(0) translateY(0) rotate(-35deg);opacity:0}5%{opacity:1}25%{transform:translateX(350px) translateY(180px) rotate(-35deg);opacity:0}100%{opacity:0}}
 .header{background:rgba(10,10,30,.5);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);padding:2.5rem 1rem 2rem;text-align:center;border-bottom:1px solid rgba(255,255,255,.08);position:relative;z-index:1}
 .header h1{font-size:1.8rem;font-weight:800;color:#fff}
 .version-badge{display:inline-block;background:var(--accent);color:#000;font-size:.7rem;font-weight:700;padding:.2rem .6rem;border-radius:12px;margin-left:.5rem;vertical-align:middle}
@@ -357,6 +363,8 @@ body::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;z-ind
 </style>
 </head>
 <body>
+<div class="shooting-star"></div>
+<div class="shooting-star"></div>
 <header class="header">
   <h1>${escapeHtml(site.name)}<span class="version-badge">${escapeHtml(meta.title?.match(/ver\.?([\d.]+)/)?.[1] || now.split(' ')[0])}</span></h1>
   <p class="sub-info">업데이트: ${now}</p>
@@ -442,8 +450,14 @@ ${adsenseScript}
 :root{--primary:#6c5ce7;--primary-light:#a29bfe;--bg:#080b16;--bg-card:#1a1a2e;--text:#e0e0ee;--text-muted:#8888aa;--accent:#00cec9;--border:#2a2a4a}
 *{margin:0;padding:0;box-sizing:border-box}
 body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Noto Sans KR',sans-serif;background:var(--bg);color:var(--text);line-height:1.8;min-height:100vh;position:relative;overflow-x:hidden}
-body::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;background:radial-gradient(600px circle at 30% 25%,rgba(108,92,231,.12),transparent 50%),radial-gradient(500px circle at 70% 70%,rgba(0,206,201,.08),transparent 50%),radial-gradient(400px circle at 50% 50%,rgba(139,92,246,.06),transparent 50%);animation:bgShift 15s ease-in-out infinite alternate;pointer-events:none}
+body::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;background:radial-gradient(600px circle at 30% 25%,rgba(108,92,231,.1),transparent 50%),radial-gradient(500px circle at 70% 70%,rgba(0,206,201,.07),transparent 50%),radial-gradient(400px circle at 50% 50%,rgba(139,92,246,.05),transparent 50%);animation:bgShift 20s ease-in-out infinite alternate;pointer-events:none}
+body::after{content:'';position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none;background-image:radial-gradient(1px 1px at 10% 15%,rgba(255,255,255,.7),transparent),radial-gradient(1.5px 1.5px at 28% 62%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 42% 8%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 58% 42%,rgba(255,255,255,.4),transparent),radial-gradient(1.5px 1.5px at 75% 78%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 88% 28%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 15% 85%,rgba(255,255,255,.4),transparent),radial-gradient(1.5px 1.5px at 65% 12%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 92% 55%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 35% 38%,rgba(255,255,255,.3),transparent),radial-gradient(1.5px 1.5px at 5% 50%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 48% 72%,rgba(255,255,255,.5),transparent),radial-gradient(1.5px 1.5px at 82% 90%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 20% 95%,rgba(255,255,255,.4),transparent);animation:twinkle 4s ease-in-out infinite alternate}
 @keyframes bgShift{0%{transform:translate(0,0) scale(1)}50%{transform:translate(-20px,15px) scale(1.05)}100%{transform:translate(15px,-10px) scale(1)}}
+@keyframes twinkle{0%{opacity:.5}100%{opacity:1}}
+.shooting-star{position:fixed;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.8),transparent);z-index:0;pointer-events:none;opacity:0}
+.shooting-star:nth-child(1){top:22%;left:30%;width:90px;animation:shoot 4s ease-in-out infinite}
+.shooting-star:nth-child(2){top:60%;left:50%;width:65px;animation:shoot 4s ease-in-out 2.5s infinite}
+@keyframes shoot{0%{transform:translateX(0) translateY(0) rotate(-35deg);opacity:0}5%{opacity:1}25%{transform:translateX(350px) translateY(180px) rotate(-35deg);opacity:0}100%{opacity:0}}
 .lp-header{background:rgba(10,10,30,.5);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);padding:2.5rem 1rem 2rem;text-align:center;border-bottom:1px solid rgba(255,255,255,.08);position:relative;z-index:1}
 .lp-header h1{font-size:1.6rem;font-weight:800;color:#fff}
 .lp-header .sub{color:var(--text-muted);font-size:.8rem;margin-top:.5rem}
@@ -466,6 +480,8 @@ body::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;z-ind
 </style>
 </head>
 <body>
+<div class="shooting-star"></div>
+<div class="shooting-star"></div>
 <header class="lp-header">
   <h1>${seoTitle}</h1>
   <p class="sub">업데이트: ${now}</p>

views/admin/layout.ejs

@@ -8,8 +8,14 @@
 :root{--bg:#0a0e1a;--bg2:#1f2937;--bg3:#374151;--text:#f9fafb;--muted:#9ca3af;--primary:#6366f1;--primary-hover:#818cf8;--danger:#ef4444;--success:#22c55e;--warning:#f59e0b;--border:#374151;--radius:12px;--glass-bg:rgba(255,255,255,.05);--glass-bg-hover:rgba(255,255,255,.08);--glass-border:rgba(255,255,255,.1);--glass-border-hover:rgba(255,255,255,.18);--glass-blur:blur(12px);--glass-blur-heavy:blur(20px);--glass-shadow:0 8px 32px rgba(0,0,0,.3)}
 *{margin:0;padding:0;box-sizing:border-box}
 body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Noto Sans KR',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;display:flex;position:relative;overflow-x:hidden}
-body::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;background:radial-gradient(600px circle at 20% 30%,rgba(99,102,241,.12),transparent 50%),radial-gradient(500px circle at 80% 70%,rgba(6,182,212,.08),transparent 50%),radial-gradient(400px circle at 50% 50%,rgba(139,92,246,.06),transparent 50%);animation:bgShift 15s ease-in-out infinite alternate;pointer-events:none}
+body::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;background:radial-gradient(600px circle at 20% 30%,rgba(99,102,241,.1),transparent 50%),radial-gradient(500px circle at 80% 70%,rgba(6,182,212,.07),transparent 50%),radial-gradient(400px circle at 50% 50%,rgba(139,92,246,.05),transparent 50%);animation:bgShift 20s ease-in-out infinite alternate;pointer-events:none}
+body::after{content:'';position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none;background-image:radial-gradient(1px 1px at 10% 20%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 25% 65%,rgba(255,255,255,.5),transparent),radial-gradient(1.5px 1.5px at 40% 10%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 55% 45%,rgba(255,255,255,.4),transparent),radial-gradient(1.5px 1.5px at 70% 80%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 85% 30%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 15% 85%,rgba(255,255,255,.4),transparent),radial-gradient(1.5px 1.5px at 60% 15%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 90% 55%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 35% 40%,rgba(255,255,255,.3),transparent),radial-gradient(1.5px 1.5px at 5% 50%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 75% 25%,rgba(255,255,255,.4),transparent),radial-gradient(1px 1px at 45% 75%,rgba(255,255,255,.5),transparent),radial-gradient(1.5px 1.5px at 20% 95%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 95% 10%,rgba(255,255,255,.4),transparent),radial-gradient(1px 1px at 50% 90%,rgba(255,255,255,.3),transparent),radial-gradient(1.5px 1.5px at 30% 55%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 65% 35%,rgba(255,255,255,.4),transparent),radial-gradient(1px 1px at 80% 95%,rgba(255,255,255,.6),transparent),radial-gradient(1.5px 1.5px at 12% 40%,rgba(255,255,255,.5),transparent);animation:twinkle 4s ease-in-out infinite alternate}
 @keyframes bgShift{0%{transform:translate(0,0) scale(1)}50%{transform:translate(-30px,20px) scale(1.05)}100%{transform:translate(20px,-15px) scale(1)}}
+@keyframes twinkle{0%{opacity:.6}100%{opacity:1}}
+.shooting-star{position:fixed;width:80px;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.8),transparent);z-index:0;pointer-events:none;opacity:0;animation:shoot 3s ease-in-out infinite}
+.shooting-star:nth-child(2){top:15%;left:60%;animation-delay:2s;width:60px}
+.shooting-star:nth-child(3){top:70%;left:20%;animation-delay:5s;width:100px}
+@keyframes shoot{0%{transform:translateX(0) translateY(0) rotate(-35deg);opacity:0}5%{opacity:1}30%{transform:translateX(300px) translateY(150px) rotate(-35deg);opacity:0}100%{opacity:0}}
 
 /* 사이드바 */
 .sidebar{width:220px;background:rgba(15,20,35,.75);backdrop-filter:var(--glass-blur-heavy);-webkit-backdrop-filter:var(--glass-blur-heavy);border-right:1px solid var(--glass-border);padding:1.5rem 0;flex-shrink:0;position:fixed;top:0;left:0;height:100vh;overflow-y:auto;z-index:2}
@@ -97,6 +103,9 @@ tr:hover td{background:rgba(255,255,255,.04)}
 </style>
 </head>
 <body>
+<div class="shooting-star" style="top:25%;left:40%"></div>
+<div class="shooting-star" style="top:15%;left:60%"></div>
+<div class="shooting-star" style="top:70%;left:20%"></div>
 <aside class="sidebar">
   <div class="logo">Crawl Manager</div>
   <nav>

views/admin/login.ejs

@@ -7,14 +7,18 @@
 <style>
 :root{--bg:#0a0e1a;--card:#1e293b;--border:#334155;--primary:#6366f1;--primary-hover:#818cf8;--text:#f1f5f9;--muted:#94a3b8;--danger:#ef4444;--radius:12px}
 *{margin:0;padding:0;box-sizing:border-box}
-body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Noto Sans KR',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden}
+body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Noto Sans KR',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}
 
-/* 배경 애니메이션 */
+/* 우주 배경 */
 .bg-glow{position:fixed;top:-50%;left:-50%;width:200%;height:200%;z-index:0}
-.bg-glow::before,.bg-glow::after{content:'';position:absolute;border-radius:50%;filter:blur(100px);opacity:.2}
+.bg-glow::before,.bg-glow::after{content:'';position:absolute;border-radius:50%;filter:blur(100px);opacity:.18}
-.bg-glow::before{top:20%;left:25%;width:500px;height:500px;background:#6366f1;animation:float 10s ease-in-out infinite}
+.bg-glow::before{top:20%;left:25%;width:500px;height:500px;background:#6366f1;animation:float 12s ease-in-out infinite}
-.bg-glow::after{bottom:15%;right:25%;width:450px;height:450px;background:#06b6d4;animation:float 10s ease-in-out infinite reverse}
+.bg-glow::after{bottom:15%;right:25%;width:450px;height:450px;background:#06b6d4;animation:float 12s ease-in-out infinite reverse}
 @keyframes float{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(30px,-30px) scale(1.1)}}
+.stars{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none;background-image:radial-gradient(1px 1px at 10% 20%,rgba(255,255,255,.7),transparent),radial-gradient(1.5px 1.5px at 25% 65%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 40% 10%,rgba(255,255,255,.8),transparent),radial-gradient(1.5px 1.5px at 55% 45%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 70% 80%,rgba(255,255,255,.7),transparent),radial-gradient(1.5px 1.5px at 85% 30%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 15% 85%,rgba(255,255,255,.5),transparent),radial-gradient(1.5px 1.5px at 60% 15%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 90% 55%,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 35% 40%,rgba(255,255,255,.4),transparent),radial-gradient(1.5px 1.5px at 5% 50%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 75% 25%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 45% 75%,rgba(255,255,255,.6),transparent),radial-gradient(1.5px 1.5px at 20% 95%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 95% 10%,rgba(255,255,255,.5),transparent),radial-gradient(1.5px 1.5px at 50% 90%,rgba(255,255,255,.4),transparent),radial-gradient(1px 1px at 30% 55%,rgba(255,255,255,.6),transparent),radial-gradient(1.5px 1.5px at 65% 35%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 80% 95%,rgba(255,255,255,.7),transparent),radial-gradient(1px 1px at 12% 40%,rgba(255,255,255,.6),transparent);animation:twinkle 4s ease-in-out infinite alternate}
+@keyframes twinkle{0%{opacity:.5}100%{opacity:1}}
+.shooting-star{position:fixed;width:100px;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.9),transparent);z-index:0;pointer-events:none;opacity:0;animation:shoot 4s ease-in-out infinite}
+@keyframes shoot{0%{transform:translateX(0) translateY(0) rotate(-35deg);opacity:0}5%{opacity:1}25%{transform:translateX(400px) translateY(200px) rotate(-35deg);opacity:0}100%{opacity:0}}
 
 .login-container{position:relative;z-index:1;width:100%;max-width:420px;padding:1rem}
 
@@ -43,6 +47,9 @@ body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Noto Sans KR',sans
 <body>
 
 <div class="bg-glow"></div>
+<div class="stars"></div>
+<div class="shooting-star" style="top:20%;left:30%"></div>
+<div class="shooting-star" style="top:60%;left:50%;animation-delay:2s;width:70px"></div>
 
 <div class="login-container">
   <div class="login-card">