feat(FN-1141): improve dashboard mobile adaptations

- Extend mobile CSS for SettingsModal, AgentsView, ExecutorStatusBar, ActiveAgentsPanel, toast placement, and background task popovers
- Rename BackgroundTasksIndicator list/item class hooks to align with the updated responsive styling contract
- Add focused component tests covering settings, agents, and utility mobile adaptations plus key CSS media-rule assertions
- Document mobile component adaptation behavior and testing guidance in the dashboard README

packages/dashboard/app/components/BackgroundTasksIndicator.tsx

@@ -68,7 +68,7 @@ export function BackgroundTasksIndicator({
           <div className="background-tasks-indicator__popover-header">
             Background Tasks
           </div>
-          <div className="background-tasks-indicator__sessions">
+          <div className="background-tasks-indicator__popover-list">
             {sessions.map((session) => {
               const Icon = TYPE_ICONS[session.type];
               const isGenerating = session.status === "generating";
@@ -77,7 +77,7 @@ export function BackgroundTasksIndicator({
               return (
                 <div
                   key={session.id}
-                  className="background-tasks-indicator__session"
+                  className="background-tasks-indicator__item"
                   onClick={() => {
                     onOpenSession(session);
                     setPopoverOpen(false);
@@ -112,7 +112,7 @@ export function BackgroundTasksIndicator({
                     />
                   )}
                   <button
-                    className="background-tasks-indicator__dismiss"
+                    className="background-tasks-indicator__item-dismiss"
                     onClick={(e) => {
                       e.stopPropagation();
                       onDismissSession(session.id);