v3.0.3: 아두이노 업로더 통합 — 팝업 제거, 코드 에디터 하단 패널로 이전

- arduino-upload.html 삭제, 모든 로직을 code.js로 이식
- ⚡ 업로드 버튼 → 인라인 패널 오픈 (팝업·sessionStorage 릴레이 제거)
- OUTPUT / 옵션 / 시리얼 탭, 드래그 리사이즈, ESP32·AVR·STM32 업로드
- server-v2.ts 중복 /api/settings/paths 라우트 제거 (설정 저장 오류 수정)
- 업로드 패널 색상·폰트 개선 (배경 밝게, 12~13px)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

web-ui/code.html

@@ -282,6 +282,7 @@
               <button id="code-emu-btn" class="csb-term-btn" onclick="openArduinoEmulator()" title="Arduino 에뮬레이터 열기">아두이노</button>
               <button id="code-compile-btn" class="csb-term-btn" onclick="csbCompileOnly()" title="실제 보드용 컴파일 (오류 시 AI 채팅으로 전송)">🔨 컴파일</button>
               <button id="code-upload-btn" class="csb-term-btn" onclick="csbUploadToBoard()" title="보드에 업로드 (USB 연결 필요)" style="background:var(--brand);color:#fff;border-color:var(--brand)">⚡ 업로드</button>
+
             </div>
           </div>
         </div>
@@ -301,11 +302,17 @@
             <button class="code-sb-tab active" id="csb-libtab-installed" onclick="csbLibTab('installed')" style="flex:1;font-size:10px;padding:5px 0">설치됨</button>
             <button class="code-sb-tab"        id="csb-libtab-search"    onclick="csbLibTab('search')"    style="flex:1;font-size:10px;padding:5px 0">검색/설치</button>
           </div>
-          <div id="csb-lib-filter-row" style="display:flex;padding:4px 6px;gap:4px;border-bottom:1px solid var(--line);flex-shrink:0;flex-wrap:wrap;align-items:center">
-            <span style="font-size:9px;color:var(--muted);margin-right:2px">필터:</span>
-            <button id="csb-libf-all"   onclick="csbLibFilter('all')"   class="csb-libf-btn active" style="font-size:9px;padding:2px 7px;border-radius:3px;border:1px solid var(--line);background:var(--brand);color:#fff;cursor:pointer;font-family:inherit">전체</button>
-            <button id="csb-libf-compat" onclick="csbLibFilter('compat')" class="csb-libf-btn"        style="font-size:9px;padding:2px 7px;border-radius:3px;border:1px solid var(--line);background:var(--panel-2);color:var(--muted);cursor:pointer;font-family:inherit">이 보드만</button>
-            <button id="csb-libf-incompat" onclick="csbLibFilter('incompat')" class="csb-libf-btn"    style="font-size:9px;padding:2px 7px;border-radius:3px;border:1px solid var(--line);background:var(--panel-2);color:var(--muted);cursor:pointer;font-family:inherit">비호환</button>
+          <div id="csb-lib-filter-row" style="display:flex;flex-direction:column;padding:4px 6px;gap:3px;border-bottom:1px solid var(--line);flex-shrink:0">
+            <div style="display:flex;align-items:center;gap:4px;flex-wrap:wrap">
+              <span style="font-size:9px;color:var(--muted)">보기:</span>
+              <button id="csb-libv-flat"     onclick="csbLibView('flat')"     style="font-size:9px;padding:2px 7px;border-radius:3px;border:1px solid var(--brand);background:var(--brand);color:#fff;cursor:pointer;font-family:inherit">목록</button>
+              <button id="csb-libv-category" onclick="csbLibView('category')" style="font-size:9px;padding:2px 7px;border-radius:3px;border:1px solid var(--line);background:var(--panel-2);color:var(--muted);cursor:pointer;font-family:inherit">종류별</button>
+              <span style="font-size:9px;color:var(--muted);margin-left:4px">보드:</span>
+              <button id="csb-libf-all"      onclick="csbLibFilter('all')"      style="font-size:9px;padding:2px 7px;border-radius:3px;border:1px solid var(--brand);background:var(--brand);color:#fff;cursor:pointer;font-family:inherit">전체</button>
+              <button id="csb-libf-compat"   onclick="csbLibFilter('compat')"   style="font-size:9px;padding:2px 7px;border-radius:3px;border:1px solid var(--line);background:var(--panel-2);color:var(--muted);cursor:pointer;font-family:inherit">이 보드만</button>
+              <button id="csb-libf-incompat" onclick="csbLibFilter('incompat')" style="font-size:9px;padding:2px 7px;border-radius:3px;border:1px solid var(--line);background:var(--panel-2);color:var(--muted);cursor:pointer;font-family:inherit">비호환</button>
+            </div>
+            <div id="csb-lib-arch-row" style="display:none;flex-wrap:wrap;gap:3px"></div>
           </div>
           <div id="csb-lib-search-row" style="display:none;padding:6px 8px;border-bottom:1px solid var(--line);gap:5px;flex-shrink:0;align-items:center">
             <input id="csb-lib-q" placeholder="키워드 또는 라이브러리명..." onkeydown="if(event.key==='Enter')csbLibSearch()"
@@ -503,6 +510,55 @@
       </div>
       <iframe id="code-preview-iframe" src="" style="flex:1;border:none;background:#fff;min-height:0" sandbox="allow-scripts allow-same-origin allow-forms allow-modals allow-popups"></iframe>
     </div>
+    <!-- ⚡ Upload panel -->
+    <div id="code-upload-panel" style="display:none;flex-direction:column;flex-shrink:0;height:300px;min-height:100px;border-top:2px solid #7a4e20;background:#1e1810;position:relative">
+      <div id="code-upload-drag" style="position:absolute;top:0;left:0;right:0;height:5px;cursor:ns-resize;z-index:2;transition:background .15s"></div>
+      <div style="display:flex;align-items:center;height:32px;background:#2a1e10;border-bottom:1px solid #5a3820;flex-shrink:0;padding:0 8px;gap:6px;overflow-x:auto">
+        <span id="cup-status" style="padding:2px 8px;border-radius:4px;font-size:11px;font-weight:700;background:#3a2810;color:#e09040;flex-shrink:0;white-space:nowrap">대기 중</span>
+        <span id="cup-port-name" style="font-size:12px;color:#c8a060;font-family:'IBM Plex Mono',monospace;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1">포트 없음</span>
+        <button id="cup-tbtn-log"  onclick="cupTab('log')"  style="background:none;border:none;color:#e89040;cursor:pointer;font-size:12px;font-family:'IBM Plex Mono',monospace;padding:0 8px;height:100%;border-bottom:2px solid #e89040;white-space:nowrap;flex-shrink:0">OUTPUT</button>
+        <button id="cup-tbtn-opts" onclick="cupTab('opts')" style="background:none;border:none;color:#8a7050;cursor:pointer;font-size:12px;font-family:'IBM Plex Mono',monospace;padding:0 8px;height:100%;border-bottom:2px solid transparent;white-space:nowrap;flex-shrink:0">옵션</button>
+        <button id="cup-tbtn-mon"  onclick="cupTab('mon')"  style="background:none;border:none;color:#8a7050;cursor:pointer;font-size:12px;font-family:'IBM Plex Mono',monospace;padding:0 8px;height:100%;border-bottom:2px solid transparent;white-space:nowrap;flex-shrink:0">시리얼</button>
+        <button onclick="cupSelectPort()" style="background:#3a2818;border:1px solid #6a4820;color:#e89040;border-radius:5px;padding:3px 10px;font-size:12px;cursor:pointer;font-family:'IBM Plex Mono',monospace;flex-shrink:0;white-space:nowrap">🔌 포트</button>
+        <button id="cup-btn-download" onclick="cupDoDownload()" disabled style="background:#3a2818;border:1px solid #4a3820;color:#907050;border-radius:5px;padding:3px 9px;font-size:12px;cursor:pointer;font-family:'IBM Plex Mono',monospace;flex-shrink:0">⬇</button>
+        <button id="cup-btn-upload" onclick="cupDoUpload()" disabled style="background:color-mix(in srgb,#e89040 20%,#2a1e10);border:1px solid #e89040;color:#e89040;border-radius:5px;padding:3px 10px;font-size:12px;cursor:pointer;font-family:'IBM Plex Mono',monospace;font-weight:700;flex-shrink:0;white-space:nowrap">⚡ 업로드</button>
+        <button onclick="toggleUploadPanel()" style="background:none;border:none;color:#8a6840;cursor:pointer;font-size:16px;padding:0 6px;line-height:1;flex-shrink:0">&times;</button>
+      </div>
+      <progress id="cup-progress" value="0" max="100" style="display:none;width:100%;height:4px;border:none;border-radius:0;flex-shrink:0;accent-color:#e89040"></progress>
+      <!-- OUTPUT tab -->
+      <div id="cup-tab-log" style="flex:1;overflow-y:auto;padding:10px 14px;font-size:13px;line-height:1.8;white-space:pre-wrap;word-break:break-all;font-family:'IBM Plex Mono',monospace"></div>
+      <!-- 옵션 tab -->
+      <div id="cup-tab-opts" style="display:none;flex:1;overflow-y:auto;padding:12px 14px;font-size:13px;font-family:'IBM Plex Mono',monospace">
+        <div id="cup-info-rows" style="display:flex;flex-direction:column;gap:5px;margin-bottom:12px"></div>
+        <div id="cup-board-opts-list"></div>
+        <div id="cup-stm32-hint" style="display:none;margin-top:10px;padding:10px 12px;background:#2a1e10;border:1px solid #5a3820;border-radius:6px;color:#c8a060;font-size:13px;line-height:1.7">STM32 부트로더:<br>① BOOT0=3.3V ② RESET → ⚡ 업로드<br>업로드 후 BOOT0=GND → RESET</div>
+        <div id="cup-uf2-hint" style="display:none;margin-top:10px;padding:10px 12px;background:#2a1e10;border:1px solid #5a3820;border-radius:6px;color:#c8a060;font-size:13px;line-height:1.7">UF2 업로드:<br>① BOOTSEL 누른채 USB 연결<br>② BOOT 드라이브 나타남<br>③ ⬇ 다운로드 후 드라이브에 복사</div>
+      </div>
+      <!-- 시리얼 tab -->
+      <div id="cup-tab-mon" style="display:none;flex-direction:column;flex:1;min-height:0">
+        <div style="display:flex;align-items:center;padding:5px 10px;border-bottom:1px solid #5a3820;flex-shrink:0;gap:7px;flex-wrap:wrap;background:#241a0e">
+          <select id="cup-mon-baud" style="background:#3a2818;border:1px solid #5a3820;color:#c8a060;border-radius:4px;padding:3px 6px;font-size:12px;font-family:'IBM Plex Mono',monospace">
+            <option value="9600">9600</option><option value="19200">19200</option><option value="38400">38400</option>
+            <option value="57600">57600</option><option value="115200" selected>115200</option>
+            <option value="230400">230400</option><option value="921600">921600</option>
+          </select>
+          <select id="cup-mon-line-end" style="background:#3a2818;border:1px solid #5a3820;color:#c8a060;border-radius:4px;padding:3px 6px;font-size:12px;font-family:'IBM Plex Mono',monospace">
+            <option value="none">줄끝없음</option><option value="nl">LF</option><option value="cr">CR</option><option value="crnl" selected>CR+LF</option>
+          </select>
+          <button id="cup-mon-btn" onclick="cupMonToggle()" style="background:color-mix(in srgb,#22c55e 15%,#241a0e);border:1px solid color-mix(in srgb,#22c55e 35%,#241a0e);color:#4ade80;border-radius:4px;padding:3px 10px;font-size:12px;cursor:pointer;font-family:'IBM Plex Mono',monospace">▶ 연결</button>
+          <label style="display:flex;align-items:center;gap:4px;font-size:12px;color:#907050;cursor:pointer"><input type="checkbox" id="cup-mon-ts"> 시각</label>
+          <label style="display:flex;align-items:center;gap:4px;font-size:12px;color:#907050;cursor:pointer"><input type="checkbox" id="cup-mon-auto" checked> 자동스크롤</label>
+          <button onclick="cupMonClear()" style="background:none;border:none;color:#907050;cursor:pointer;font-size:12px;font-family:'IBM Plex Mono',monospace">지우기</button>
+        </div>
+        <div id="cup-mon-output" style="flex:1;overflow-y:auto;padding:8px 14px;font-size:13px;line-height:1.7;font-family:'IBM Plex Mono',monospace"></div>
+        <div style="display:flex;gap:7px;padding:7px 10px;border-top:1px solid #3a2818;background:#1e1408;flex-shrink:0">
+          <input type="text" id="cup-mon-input" placeholder="전송할 데이터..." disabled
+            onkeydown="if(event.key==='Enter')cupMonSend()"
+            style="flex:1;background:#2a1e10;border:1px solid #5a3820;color:#e8d0a0;border-radius:5px;padding:6px 10px;font-size:13px;font-family:'IBM Plex Mono',monospace;outline:none">
+          <button onclick="cupMonSend()" style="background:color-mix(in srgb,#c8a060 20%,#1e1408);border:1px solid #8a6840;color:#c8a060;border-radius:5px;padding:5px 14px;font-size:13px;cursor:pointer;font-family:'IBM Plex Mono',monospace">전송</button>
+        </div>
+      </div>
+    </div>
     </div>
   </div>