UI/UX D4: Gemini-style sidebar, welcome glow, pill input, chips, icon controls, history

- app.py: remove gr.Tab, add youlbot-sidebar Column + 3 panel Columns (D4-1)
- app.py: _welcome_html() radial gradient glow + personalized greeting (D4-2)
- app.py: pill-input CSS border-radius:24px, circular send button (D4-3)
- app.py: _example_chips_html() + JS fillInput() replacing gr.Examples (D4-4)
- app.py: icon buttons 💾/🗑, compact ctrl-check layout (D4-5)
- app.py: JS saveChatToHistory/renderChatHistory localStorage max 20 (D4-6)
- app.py: sidebar toggle (☰), dark mode btn, user selector in sidebar
- app.py: respond/reset_chat/switch_user yield welcome_view visibility
- ROADMAP.md: mark all D4 items complete

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

ROADMAP.md

@@ -465,12 +465,12 @@ youlbot-webui/
 
 #### D4 체크리스트
 
-- [ ] D4-2: 웰컴 뷰 — 개인화 인사 + 글로우 그라디언트 배경
-- [ ] D4-3: Pill 입력창 CSS + 중앙/하단 위치 전환
-- [ ] D4-4: 예시 질문 → `gr.HTML` chip 카드 스타일
-- [ ] D4-5: 컨트롤 아이콘화 + ⚙ 팝업 패널
-- [ ] D4-1: 좌측 사이드바 레이아웃 (탭 제거)
-- [ ] D4-6: 대화 이력 localStorage 저장 + 사이드바 표시
+- [x] D4-2: 웰컴 뷰 — `_welcome_html(user)` 글로우 그라디언트 + 개인화 인사, 첫 전송 시 `visible=False`
+- [x] D4-3: Pill 입력창 — `border-radius:24px`, 전송 버튼 원형(↑), `pill-input` CSS
+- [x] D4-4: 예시 질문 — `gr.Examples` 제거 → `_example_chips_html()` + JS `fillInput()`
+- [x] D4-5: 컨트롤 아이콘화 — 체크박스 소형화, 💾/🗑 아이콘 버튼, `control-row` CSS
+- [x] D4-1: 좌측 사이드바 — `gr.Tab` 제거 → `youlbot-sidebar` + `panel_*` Column 3개, 네비 버튼 전환
+- [x] D4-6: 대화 이력 — JS `saveChatToHistory` + `renderChatHistory` + localStorage 20개
 
 ---