feat: add Create Session button to empty state, move refresh to header

frontend/packages/web/index.html

@@ -396,6 +396,31 @@
         flex-shrink: 0;
       }
 
+      .sidebar-header-actions {
+        display: flex;
+        align-items: center;
+        gap: 4px;
+      }
+
+      .sidebar-icon-btn {
+        width: 24px;
+        height: 24px;
+        background: transparent;
+        border: 1px solid var(--border-2);
+        border-radius: 4px;
+        color: var(--muted);
+        cursor: pointer;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        transition: all var(--transition);
+      }
+
+      .sidebar-icon-btn:hover {
+        border-color: var(--accent);
+        color: var(--accent);
+      }
+
       .sidebar-title {
         font-size: 11px;
         font-weight: 600;
@@ -495,16 +520,6 @@
         font-size: 11px;
       }
 
-      .sidebar-refresh {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        gap: 4px;
-        padding: 8px;
-        border-top: 1px solid var(--border);
-        flex-shrink: 0;
-      }
-
       /* Chat Panel */
       .chat-panel {
         display: flex;

frontend/packages/web/src/App.tsx

@@ -809,20 +809,28 @@ export default function App() {
         <div className="session-sidebar">
           <div className="sidebar-header">
             <span className="sidebar-title">Sessions</span>
-            <button
-              className="sidebar-add-btn"
-              onClick={createNewSession}
-              title="New session"
-            >
-              <Plus size={14} />
-            </button>
+            <div className="sidebar-header-actions">
+              <button
+                className="sidebar-icon-btn"
+                onClick={fetchSessions}
+                title="Refresh sessions"
+              >
+                <RefreshCw size={14} />
+              </button>
+              <button
+                className="sidebar-add-btn"
+                onClick={createNewSession}
+                title="New session"
+              >
+                <Plus size={14} />
+              </button>
+            </div>
           </div>
 
           <div className="session-list">
             {sessions.length === 0 ? (
               <div className="sidebar-empty">
-                No sessions yet.<br />
-                Create one to get started.
+                No sessions yet.
               </div>
             ) : (
               sessions.map((session) => (
@@ -841,12 +849,6 @@ export default function App() {
               ))
             )}
           </div>
-
-          <div className="sidebar-refresh">
-            <button className="button ghost small" onClick={fetchSessions}>
-              <RefreshCw size={12} /> Refresh
-            </button>
-          </div>
         </div>
 
         {/* Chat Panel */}
@@ -868,8 +870,12 @@ export default function App() {
                 <MessageSquare className="empty-state-icon" />
                 <div className="empty-state-title">No Session Selected</div>
                 <p className="empty-state-text">
-                  Click + in the sidebar to create a new session, or select an existing one.
+                  Create a new session to start chatting with an agent.
                 </p>
+                <button className="button primary" onClick={createNewSession} style={{ marginTop: 16 }}>
+                  <Plus className="button-icon" />
+                  Create Session
+                </button>
               </div>
             ) : transcriptMessages.length === 0 && !sessionError ? (
               <div className="empty-state">