feat(app): settings modal — terminal, appearance, shell

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

app/src/TopBar.tsx

@@ -29,7 +29,7 @@ function IconBtn({ icon, onClick, active, title }: { icon: React.ReactNode; onCl
 }
 
 export function TopBar({
-  active, eventsOpen, onToggleEvents, onShowEvents, sidebarOpen, onToggleSidebar, unread,
+  active, eventsOpen, onToggleEvents, onShowEvents, sidebarOpen, onToggleSidebar, unread, onOpenSettings,
 }: {
   active: WorkspaceView | null;
   eventsOpen: boolean;
@@ -38,6 +38,7 @@ export function TopBar({
   sidebarOpen: boolean;
   onToggleSidebar: () => void;
   unread: number;
+  onOpenSettings: () => void;
 }) {
   return (
     <div
@@ -85,7 +86,7 @@ export function TopBar({
           )}
         </div>
         <IconBtn icon={<PanelRight size={15} />} onClick={onToggleEvents} active={eventsOpen} title="Toggle Event Center" />
-        <IconBtn icon={<Settings size={16} />} title="Settings (mock)" />
+        <IconBtn icon={<Settings size={16} />} onClick={onOpenSettings} title="Settings" />
         <span style={{ width: 1, height: 18, background: COLORS.borderStrong, margin: "0 2px" }} />
         <button
           title="Account (mock)"