sanjang 0.3.3 → 0.3.5

package/dashboard/index.html

@@ -19,38 +19,14 @@
   <div id="portal">
     <!-- 베이스캠프 씬 -->
     <div class="portal-section" id="basecamp-scene">
-      <div class="bc-scene">
-        <!-- Stars -->
-        <div class="bc-star twinkle" style="top:8%;left:12%"></div>
-        <div class="bc-star twinkle-slow" style="top:15%;left:30%"></div>
-        <div class="bc-star twinkle" style="top:5%;left:48%"></div>
-        <div class="bc-star twinkle-slow" style="top:20%;left:65%"></div>
-        <div class="bc-star twinkle" style="top:10%;left:80%"></div>
-        <div class="bc-star twinkle-slow" style="top:25%;left:92%"></div>
-        <div class="bc-star twinkle" style="top:18%;left:5%"></div>
-        <div class="bc-star twinkle-slow" style="top:6%;left:72%"></div>
-        <div class="bc-star twinkle" style="top:22%;left:42%"></div>
-        <div class="bc-star twinkle-slow" style="top:12%;left:55%"></div>
-
-        <!-- Mountains -->
-        <div class="bc-mountain bc-mountain-back"></div>
-        <div class="bc-mountain bc-mountain-front"></div>
-
-        <!-- Snow caps -->
-        <div class="bc-snow" style="bottom:64px;left:48%;width:12px"></div>
-        <div class="bc-snow" style="bottom:60px;left:50%;width:8px"></div>
-        <div class="bc-snow" style="bottom:56px;left:46%;width:4px"></div>
-
-        <!-- Campfire glow + campfire -->
-        <div class="bc-glow"></div>
-        <div class="bc-campfire"></div>
-
-        <!-- Sherpa -->
-        <div class="bc-sherpa"></div>
-
-        <!-- Speech bubble -->
+      <div class="bc-scene" id="bc-scene-container">
+        <!-- JS renders time-based SVG scene here -->
+      </div>
+      <!-- Speech bubble stays outside SVG for text rendering -->
+      <div class="bc-speech-wrap">
+        <div class="bc-sherpa-hitbox" onclick="toggleSherpaMode()" title="클릭해서 모드 변경"></div>
         <div class="bc-speech fade-in" id="sherpa-speech">
-          <span id="sherpa-quote">요구사항 또 바뀌었댜... 뭐 그러려니 하쥬</span>
+          <span id="sherpa-quote"></span>
         </div>
       </div>
     </div>
@@ -101,11 +77,17 @@
       </div>
       <div style="flex:1"></div>
       <button class="btn btn-sub btn-sm" id="ws-terminal-btn" onclick="wsOpenTerminal()">💻 터미널</button>
+      <button class="btn btn-sub btn-sm" id="ws-compare-btn" onclick="toggleCompare()" title="원본과 비교">🔀 비교</button>
       <button class="btn btn-sub btn-sm" onclick="togglePanel()">⛰ 패널</button>
     </div>
 
-    <!-- Preview — full screen -->
-    <div class="ws-preview-full" id="ws-preview"></div>
+    <!-- Preview — full screen with optional split -->
+    <div class="ws-preview-container" id="ws-preview-container">
+      <div class="ws-preview-full" id="ws-preview"></div>
+      <div class="ws-preview-main hidden" id="ws-preview-main">
+        <div class="ws-preview-label">🏔️ 원본 (main)</div>
+      </div>
+    </div>
 
     <!-- Slide panel — right side -->
     <div class="ws-panel" id="ws-panel">
@@ -124,6 +106,12 @@
             <div id="ws-changes"></div>
           </details>
         </div>
+        <div class="workspace-section ws-report-section" id="ws-report-section" style="display:none">
+          <h3>📋 변경 리포트</h3>
+          <div class="ws-report-summary" id="ws-report-summary"></div>
+          <div class="ws-report-warnings" id="ws-report-warnings"></div>
+          <div class="ws-report-categories" id="ws-report-categories"></div>
+        </div>
         <div class="workspace-section">
           <h3>📜 세이브 기록</h3>
           <div id="ws-actions"></div>
@@ -133,6 +121,7 @@
           <div class="ws-browser-error-panel" id="ws-browser-errors">
             <span style="color:var(--text-muted);font-size:12px">에러 없음</span>
           </div>
+          <button class="btn btn-fix" id="ws-fix-btn" onclick="copyFixPrompt()" style="display:none">🩹 고쳐줘 — 클립보드 복사</button>
         </details>
         <details class="workspace-section ws-log-details">
           <summary>📜 로그</summary>
@@ -243,6 +232,7 @@
       <p id="ship-file-count" style="font-size:13px;color:var(--text-muted);margin-bottom:12px"></p>
 
       <div class="form-group">
+          <div id="ship-report-preview" class="ship-report-preview" style="display:none"></div>
         <label class="form-label" for="ship-message">뭘 바꿨나요? (한 줄로)</label>
         <input
           class="form-input"

package/dashboard/style.css

@@ -1090,6 +1090,23 @@ header h1::before {
   word-break: break-all;
 }
 
+.btn-fix {
+  display: block;
+  width: 100%;
+  margin-top: 8px;
+  padding: 8px 12px;
+  background: linear-gradient(135deg, #ef4444 0%, #f97316 100%);
+  color: #fff;
+  border: none;
+  border-radius: 6px;
+  font-size: 13px;
+  font-weight: 600;
+  cursor: pointer;
+  transition: opacity 0.15s, transform 0.1s;
+}
+.btn-fix:hover { opacity: 0.9; transform: translateY(-1px); }
+.btn-fix:active { transform: translateY(0); }
+
 .ws-error-badge {
   background: #ef4444;
   color: white;
@@ -1707,11 +1724,8 @@ header.hidden {
   margin-top: 8px;
 }
 .ws-commit-item {
-  display: flex;
-  justify-content: space-between;
-  align-items: baseline;
-  gap: 8px;
-  padding: 4px 0;
+  display: block;
+  padding: 0;
   font-size: 13px;
   border-bottom: 1px solid var(--border);
 }
@@ -1720,6 +1734,10 @@ header.hidden {
 }
 .ws-commit-msg {
   color: var(--text-primary);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  min-width: 0;
 }
 .ws-commit-date {
   color: var(--text-muted);
@@ -2046,331 +2064,73 @@ header.hidden {
    Onboarding Tutorial
    ============================================================ */
 
-.onboarding-overlay {
-  position: fixed;
-  top: 0; left: 0; right: 0; bottom: 0;
-  background: rgba(0, 0, 0, 0.6);
-  z-index: 10000;
-}
-
-.onboarding-highlight {
-  position: fixed;
-  border: 2px solid var(--accent, #6366f1);
-  border-radius: 8px;
-  box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.5), 0 0 20px rgba(99, 102, 241, 0.4);
-  z-index: 10001;
-  pointer-events: none;
-  animation: onboard-pulse 1.5s ease-in-out infinite;
-}
-
-@keyframes onboard-pulse {
-  0%, 100% { box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.5), 0 0 20px rgba(99, 102, 241, 0.3); }
-  50% { box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.5), 0 0 30px rgba(99, 102, 241, 0.6); }
-}
-
-.onboarding-tooltip {
-  position: fixed;
-  background: var(--bg-elevated, #1e1e2e);
-  border: 1px solid var(--border, #333);
-  border-radius: 12px;
-  padding: 16px 20px;
-  max-width: 320px;
-  z-index: 10002;
-  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
-  animation: onboard-fade-in 0.3s ease-out;
-}
-
-@keyframes onboard-fade-in {
-  from { opacity: 0; transform: translateY(8px); }
-  to { opacity: 1; transform: translateY(0); }
-}
-
-.onboarding-title {
-  font-size: 15px;
-  font-weight: 700;
-  color: var(--text-primary, #fff);
-  margin-bottom: 6px;
-}
-
-.onboarding-text {
-  font-size: 13px;
-  color: var(--text-secondary, #aaa);
-  line-height: 1.5;
-  margin-bottom: 12px;
-}
-
-.onboarding-actions {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.onboarding-step {
-  font-size: 11px;
-  color: var(--text-muted, #666);
-  flex: 1;
-}
 
 /* ============================================================
-   Basecamp Scene
+   Basecamp Scene — Himalaya
    ============================================================ */
 
 .bc-scene {
   position: relative;
-  height: 200px;
-  background: linear-gradient(180deg, #080a10 0%, #0c0e14 60%, #12151e 100%);
+  height: 220px;
   border-radius: 12px;
   overflow: hidden;
   border: 1px solid #1c2030;
 }
 
-/* Stars */
-.bc-star {
-  position: absolute;
-  width: 4px;
-  height: 4px;
-  background: #fff;
-  image-rendering: pixelated;
-}
-
-.bc-star.twinkle {
-  animation: twinkle 2s steps(2) infinite;
-}
-
-.bc-star.twinkle-slow {
-  animation: twinkle 3.5s steps(2) infinite 0.8s;
-}
-
-@keyframes twinkle {
-  0%, 100% { opacity: 0.6; }
-  50% { opacity: 0.1; }
-}
-
-/* Mountains */
-.bc-mountain {
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  image-rendering: pixelated;
-}
-
-.bc-mountain-back {
-  height: 100px;
-  background: #1a1d2a;
-  clip-path: polygon(
-    0% 100%, 0% 70%, 5% 70%, 5% 60%, 10% 60%, 10% 50%, 15% 50%, 15% 40%,
-    20% 40%, 20% 35%, 25% 35%, 25% 45%, 30% 45%, 30% 55%, 35% 55%, 35% 50%,
-    40% 50%, 40% 35%, 45% 35%, 45% 25%, 50% 25%, 50% 20%, 55% 20%, 55% 30%,
-    60% 30%, 60% 40%, 65% 40%, 65% 50%, 70% 50%, 70% 40%, 75% 40%, 75% 50%,
-    80% 50%, 80% 60%, 85% 60%, 85% 70%, 90% 70%, 90% 80%, 95% 80%, 100% 80%,
-    100% 100%
-  );
-}
-
-.bc-mountain-front {
-  height: 80px;
-  background: #12151e;
-  clip-path: polygon(
-    0% 100%, 0% 80%, 5% 80%, 5% 70%, 10% 70%, 10% 55%, 15% 55%, 15% 45%,
-    20% 45%, 20% 40%, 25% 40%, 25% 50%, 30% 50%, 30% 60%, 35% 60%, 35% 55%,
-    40% 55%, 40% 40%, 45% 40%, 45% 30%, 48% 30%, 48% 25%, 52% 25%, 52% 20%,
-    55% 20%, 55% 30%, 58% 30%, 58% 40%, 62% 40%, 62% 50%, 65% 50%, 65% 45%,
-    70% 45%, 70% 35%, 75% 35%, 75% 45%, 80% 45%, 80% 55%, 85% 55%, 85% 65%,
-    90% 65%, 90% 75%, 95% 75%, 95% 85%, 100% 85%, 100% 100%
-  );
-}
-
-/* Snow caps */
-.bc-snow {
-  position: absolute;
-  height: 4px;
-  background: rgba(255, 255, 255, 0.25);
-  image-rendering: pixelated;
+.bc-scene svg {
+  display: block;
+  width: 100%;
+  height: 100%;
 }
 
-/* Campfire glow */
-.bc-glow {
+/* Speech bubble positioning */
+.bc-speech-wrap {
   position: absolute;
-  bottom: 0;
-  left: 50%;
-  transform: translateX(-50%);
-  width: 80px;
-  height: 40px;
-  background: radial-gradient(ellipse at center bottom, rgba(255, 140, 50, 0.15) 0%, transparent 70%);
-  animation: glow-pulse 2s ease infinite;
-}
-
-@keyframes glow-pulse {
-  0%, 100% { opacity: 1; }
-  50% { opacity: 0.6; }
+  bottom: 56px;
+  left: calc(50% + 16px);
+  z-index: 5;
 }
 
-/* Campfire pixel */
-.bc-campfire {
+.bc-sherpa-hitbox {
   position: absolute;
-  bottom: 12px;
-  left: 50%;
-  transform: translateX(-50%);
-  width: 4px;
-  height: 4px;
-  background: #8b4513;
-  image-rendering: pixelated;
-  box-shadow:
-    -4px 0 0 #8b4513,
-     4px 0 0 #8b4513,
-     0 -4px 0 #ff6600,
-    -4px -4px 0 #ff8800,
-     4px -4px 0 #ff8800,
-     0 -8px 0 #ffaa00,
-    -4px -8px 0 #ff6600,
-     4px -8px 0 #ff6600,
-     0 -12px 0 #ffcc00;
-  animation: bc-fire 0.4s steps(1) infinite;
-}
-
-@keyframes bc-fire {
-  0% {
-    box-shadow:
-      -4px 0 0 #8b4513,
-       4px 0 0 #8b4513,
-       0 -4px 0 #ff6600,
-      -4px -4px 0 #ff8800,
-       4px -4px 0 #ff8800,
-       0 -8px 0 #ffaa00,
-      -4px -8px 0 #ff6600,
-       4px -8px 0 #ff6600,
-       0 -12px 0 #ffcc00;
-  }
-  50% {
-    box-shadow:
-      -4px 0 0 #8b4513,
-       4px 0 0 #8b4513,
-       0 -4px 0 #ff8800,
-      -4px -4px 0 #ff6600,
-       4px -4px 0 #ffaa00,
-       0 -8px 0 #ff6600,
-      -4px -8px 0 #ffcc00,
-       4px -8px 0 #ff8800,
-       0 -12px 0 #ff6600;
-  }
+  bottom: -44px;
+  left: -8px;
+  width: 44px;
+  height: 44px;
+  cursor: pointer;
+  z-index: 6;
 }
 
-/* Sherpa pixel character (idle pose) */
-.bc-sherpa {
-  position: absolute;
-  bottom: 16px;
-  left: calc(50% + 24px);
-  width: 4px;
-  height: 4px;
-  background: transparent;
-  image-rendering: pixelated;
-  box-shadow:
-    /* Hat */
-     0 -20px 0 #e74c3c,
-    -4px -20px 0 #e74c3c,
-     4px -20px 0 #e74c3c,
-    -4px -24px 0 #e74c3c,
-     0 -24px 0 #e74c3c,
-     4px -24px 0 #e74c3c,
-    /* Face */
-    -4px -16px 0 #f5c6a0,
-     0 -16px 0 #f5c6a0,
-     4px -16px 0 #f5c6a0,
-    /* Body */
-    -4px -12px 0 #3498db,
-     0 -12px 0 #3498db,
-     4px -12px 0 #3498db,
-    -4px -8px 0 #3498db,
-     0 -8px 0 #3498db,
-     4px -8px 0 #3498db,
-    /* Backpack */
-     8px -12px 0 #8b6914,
-     8px -8px 0 #8b6914,
-    /* Legs */
-    -4px -4px 0 #2c3e50,
-     0 -4px 0 #2c3e50,
-    -4px 0 0 #2c3e50,
-     4px 0 0 #2c3e50;
-  animation: sherpa-idle 1s steps(1) infinite;
-}
-
-@keyframes sherpa-idle {
-  0%, 100% {
-    box-shadow:
-       0 -20px 0 #e74c3c,
-      -4px -20px 0 #e74c3c,
-       4px -20px 0 #e74c3c,
-      -4px -24px 0 #e74c3c,
-       0 -24px 0 #e74c3c,
-       4px -24px 0 #e74c3c,
-      -4px -16px 0 #f5c6a0,
-       0 -16px 0 #f5c6a0,
-       4px -16px 0 #f5c6a0,
-      -4px -12px 0 #3498db,
-       0 -12px 0 #3498db,
-       4px -12px 0 #3498db,
-      -4px -8px 0 #3498db,
-       0 -8px 0 #3498db,
-       4px -8px 0 #3498db,
-       8px -12px 0 #8b6914,
-       8px -8px 0 #8b6914,
-      -4px -4px 0 #2c3e50,
-       0 -4px 0 #2c3e50,
-      -4px 0 0 #2c3e50,
-       4px 0 0 #2c3e50;
-  }
-  50% {
-    box-shadow:
-       0 -20px 0 #e74c3c,
-      -4px -20px 0 #e74c3c,
-       4px -20px 0 #e74c3c,
-      -4px -24px 0 #e74c3c,
-       0 -24px 0 #e74c3c,
-       4px -24px 0 #e74c3c,
-      -4px -16px 0 #f5c6a0,
-       0 -16px 0 #f5c6a0,
-       4px -16px 0 #f5c6a0,
-      -4px -12px 0 #3498db,
-       0 -12px 0 #3498db,
-       4px -12px 0 #3498db,
-      -4px -8px 0 #3498db,
-       0 -8px 0 #3498db,
-       4px -8px 0 #3498db,
-       8px -12px 0 #8b6914,
-       8px -8px 0 #8b6914,
-      -4px -4px 0 #2c3e50,
-       4px -4px 0 #2c3e50,
-      -4px 0 0 #2c3e50,
-       0 0 0 #2c3e50;
-  }
+#basecamp-scene {
+  position: relative;
 }
 
-/* Speech bubble */
 .bc-speech {
-  position: absolute;
-  bottom: 52px;
-  left: calc(50% + 8px);
+  position: relative;
   background: #1c2030;
   border: 1px solid #2a2f42;
   border-radius: 8px;
   padding: 6px 10px;
   font-size: 11px;
+  color: #e4e8f0;
   white-space: nowrap;
-  color: var(--text-secondary);
+  max-width: min(320px, calc(100vw - 120px));
+  overflow: hidden;
+  text-overflow: ellipsis;
   animation: bubble-float 3s ease-in-out infinite;
 }
 
 .bc-speech::after {
   content: '';
   position: absolute;
-  bottom: -6px;
+  bottom: -5px;
   left: 20px;
-  width: 0;
-  height: 0;
-  border-left: 6px solid transparent;
-  border-right: 6px solid transparent;
-  border-top: 6px solid #1c2030;
+  width: 8px;
+  height: 8px;
+  background: #1c2030;
+  border-right: 1px solid #2a2f42;
+  border-bottom: 1px solid #2a2f42;
+  transform: rotate(45deg);
 }
 
 @keyframes bubble-float {
@@ -2388,6 +2148,20 @@ header.hidden {
   transition: opacity 0.5s;
 }
 
+.bc-speech.guide-mode {
+  border-color: rgba(99, 102, 241, 0.4);
+  background: #1a1d2e;
+}
+
+.bc-speech.guide-mode::after {
+  background: #1a1d2e;
+  border-color: rgba(99, 102, 241, 0.4);
+}
+
+#sherpa-quote {
+  transition: opacity 0.5s;
+}
+
 /* ============================================================
    Activity Trail
    ============================================================ */
@@ -2416,3 +2190,60 @@ header.hidden {
   font-size: 11px;
   color: var(--text-muted);
 }
+
+/* Change Report */
+.ws-report-section { border-top: 1px solid var(--border); padding-top: 12px; }
+.ws-report-desc { font-size: 14px; line-height: 1.6; color: var(--text); margin-bottom: 8px; white-space: pre-line; }
+.ws-report-warning { display: flex; align-items: center; gap: 6px; padding: 6px 8px; margin-bottom: 4px; background: rgba(255, 180, 0, 0.08); border-radius: 6px; font-size: 13px; color: var(--text-muted); }
+.ws-report-warning-icon { font-size: 14px; flex-shrink: 0; }
+.ws-report-categories { display: flex; flex-direction: column; gap: 10px; margin-top: 8px; }
+.ws-report-cat-group { }
+.ws-report-cat-header { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
+.ws-report-cat-label { font-size: 13px; font-weight: 600; color: var(--text); }
+.ws-report-cat-count { font-size: 11px; color: var(--text-muted); background: var(--surface); padding: 1px 6px; border-radius: 8px; }
+.ws-report-cat-items { list-style: none; margin: 0; padding: 0; }
+.ws-report-cat-items li { font-size: 13px; color: var(--text-muted); padding: 2px 0 2px 16px; position: relative; line-height: 1.5; }
+.ws-report-cat-items li::before { content: '•'; position: absolute; left: 4px; color: var(--text-muted); }
+.ws-report-nav-item { cursor: pointer; transition: color 0.15s, background 0.15s; border-radius: 4px; }
+.ws-report-nav-item:hover { color: var(--accent) !important; background: color-mix(in srgb, var(--accent) 10%, transparent); }
+.ws-report-nav-hint { font-size: 11px; color: var(--accent); opacity: 0; transition: opacity 0.15s; margin-left: 4px; }
+.ws-report-nav-item:hover .ws-report-nav-hint { opacity: 1; }
+.ws-report-saved { opacity: 0.7; }
+.ws-report-saved-desc { font-size: 13px; color: var(--text-muted); }
+
+/* Commit report (details/summary dropdown) */
+details.ws-commit-item { border-radius: 6px; margin-bottom: 4px; }
+details.ws-commit-item > summary.ws-commit-summary { display: flex; align-items: center; gap: 6px; cursor: pointer; list-style: none; padding: 6px 8px; border-radius: 6px; flex-wrap: nowrap; }
+details.ws-commit-item > summary.ws-commit-summary::-webkit-details-marker { display: none; }
+details.ws-commit-item > summary.ws-commit-summary:hover { background: var(--surface); }
+.ws-commit-arrow { font-size: 10px; color: var(--text-muted); flex-shrink: 0; transition: transform 0.15s; display: inline-block; }
+details.ws-commit-item[open] .ws-commit-arrow { transform: rotate(90deg); }
+.ws-commit-report { margin: 4px 8px 8px 8px; padding: 10px 12px; background: var(--surface); border-radius: 6px; font-size: 12px; width: auto; }
+.ws-commit-report-loading, .ws-commit-report-empty { color: var(--text-muted); }
+.ws-commit-cat { margin-bottom: 6px; }
+.ws-commit-cat:last-child { margin-bottom: 0; }
+.ws-commit-cat-label { font-size: 11px; font-weight: 600; color: var(--text-muted); display: block; margin-bottom: 2px; }
+.ws-commit-cat-item { color: var(--text-muted); padding-left: 12px; position: relative; line-height: 1.5; }
+.ws-commit-cat-item::before { content: '•'; position: absolute; left: 3px; color: var(--text-muted); }
+
+/* Split-view compare */
+.ws-preview-container { position: relative; flex: 1; display: flex; }
+.ws-preview-container .ws-preview-full { flex: 1; }
+.ws-preview-main { display: none; flex: 1; flex-direction: column; border-left: 2px solid var(--accent); position: relative; }
+.ws-preview-main.hidden { display: none !important; }
+.ws-split-view .ws-preview-full,
+.ws-split-view .ws-preview-main { flex: 1; display: flex; flex-direction: column; }
+.ws-preview-label { position: absolute; top: 8px; left: 8px; z-index: 10; background: var(--surface); padding: 2px 8px; border-radius: 4px; font-size: 11px; color: var(--text-muted); pointer-events: none; }
+.ws-preview-loading { display: flex; align-items: center; justify-content: center; flex: 1; color: var(--text-muted); font-size: 14px; }
+.btn-active { background: var(--accent) !important; color: white !important; }
+.ws-split-view .ws-preview-full { position: relative; }
+.ws-split-view .ws-preview-full::before {
+  content: '⛺ 내 캠프';
+  position: absolute; top: 8px; left: 8px; z-index: 10;
+  background: var(--surface); padding: 2px 8px; border-radius: 4px;
+  font-size: 11px; color: var(--text-muted); pointer-events: none;
+}
+
+/* Ship report preview */
+.ship-report-preview { margin-bottom: 12px; padding: 10px; background: var(--surface); border-radius: 6px; font-size: 13px; line-height: 1.5; }
+.ship-report-desc { margin-bottom: 8px; }

package/dist/bin/sanjang.js

@@ -14,7 +14,7 @@ for (let i = 0; i < args.length; i++) {
         i++;
     }
     if (args[i] === "--port" && args[i + 1]) {
-        port = parseInt(args[i + 1]);
+        port = parseInt(args[i + 1], 10);
         i++;
     }
     if (args[i] === "--force") {
@@ -53,8 +53,8 @@ if (command === "init") {
             rl.question("  어떤 앱을 띄울까요? [번호]: ", resolve);
         });
         rl.close();
-        const idx = parseInt(answer) - 1;
-        if (idx < 0 || idx >= apps.length || isNaN(idx)) {
+        const idx = parseInt(answer, 10) - 1;
+        if (idx < 0 || idx >= apps.length || Number.isNaN(idx)) {
             console.error("⛰ 잘못된 선택입니다.");
             process.exit(1);
         }
@@ -132,7 +132,51 @@ else if (command === "help" || command === "--help" || command === "-h") {
 `);
 }
 else {
-    // Default: start server
+    // Default: start server — auto-init if no config exists
+    const configPath = resolve(projectRoot, "sanjang.config.js");
+    if (!existsSync(configPath)) {
+        console.log("⛰ 설정 파일이 없습니다. 프로젝트를 분석합니다...\n");
+        const { generateConfig, detectApps } = await import("../lib/config.js");
+        const apps = detectApps(projectRoot);
+        let appDir;
+        if (apps.length >= 2) {
+            console.log("⛰ 여러 앱이 감지되었습니다:");
+            for (let i = 0; i < apps.length; i++) {
+                console.log(`  ${i + 1}) ${apps[i].dir}/\t(${apps[i].framework})`);
+            }
+            console.log("");
+            const { createInterface } = await import("node:readline");
+            const rl = createInterface({ input: process.stdin, output: process.stdout });
+            const answer = await new Promise((r) => {
+                rl.question("  어떤 앱을 띄울까요? [번호]: ", r);
+            });
+            rl.close();
+            const idx = parseInt(answer, 10) - 1;
+            if (idx < 0 || idx >= apps.length || Number.isNaN(idx)) {
+                console.error("⛰ 잘못된 선택입니다.");
+                process.exit(1);
+            }
+            appDir = apps[idx].dir;
+            console.log(`  → ${appDir}/ (${apps[idx].framework}) 선택됨\n`);
+        }
+        else if (apps.length === 1) {
+            appDir = apps[0].dir;
+        }
+        const result = generateConfig(projectRoot, { appDir, force });
+        if (result.created) {
+            console.log(`⛰ ${result.message}`);
+            console.log(`  프레임워크: ${result.framework}\n`);
+        }
+        // Add .sanjang to .gitignore
+        const gitignorePath = resolve(projectRoot, ".gitignore");
+        if (existsSync(gitignorePath)) {
+            const { readFileSync, appendFileSync } = await import("node:fs");
+            const content = readFileSync(gitignorePath, "utf8");
+            if (!content.includes(".sanjang")) {
+                appendFileSync(gitignorePath, "\n# Sanjang local dev camps\n.sanjang/\n");
+            }
+        }
+    }
     const { startServer } = await import("../lib/server.js");
     await startServer(projectRoot, { port });
 }

package/dist/lib/config.js

@@ -230,13 +230,11 @@ function detectTurboMainApp(root) {
                 const port = portMatch?.[1] ? parseInt(portMatch[1], 10) : 3000;
                 candidates.push({ name: entry.name, port });
             }
-            catch {
-                continue;
-            }
+            catch { }
         }
     }
     // Prefer app with explicit port, then first candidate
-    return candidates.find(c => c.port !== 3000) ?? candidates[0] ?? null;
+    return candidates.find((c) => c.port !== 3000) ?? candidates[0] ?? null;
 }
 function detectPackageManager(root) {
     if (existsSync(join(root, "bun.lockb")) || existsSync(join(root, "bun.lock")))
@@ -272,7 +270,7 @@ export function generateConfig(projectRoot, options = {}) {
     // Exclude .env.example, .env.test, .env.template
     (f) => !f.includes("example") && !f.includes("template") && !f.includes(".test"));
     // Detect potential issues
-    const issues = detectSetupIssues(detectRoot);
+    const _issues = detectSetupIssues(detectRoot);
     const lines = [
         "export default {",
         `  // ${detected.framework} detected`,