/* Mobile workspace pass for the SPA views: keep every action reachable and
   give messages room beside the timeline rail. */
@media (max-width: 820px) {
  /* Timeline rail gutter */
  #chatMessages.has-chat-timeline,
  #messages.has-chat-timeline { padding-right: 46px !important; }

  /* Orchestration */
  #tasksPage .tasks-board-header { gap: 8px !important; }
  #tasksPage .tasks-board-desc { display: none !important; }
  #tasksPage .tasks-tab-bar {
    width: 100%;
    overflow: visible !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
  }
  #tasksPage .tasks-tab {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    padding: 8px 6px !important;
    font-size: 11.5px !important;
    white-space: nowrap;
    text-align: center;
  }
  #tasksPage #tabTeams,
  #tasksPage #tabAutonomous { min-width: 0 !important; }
  #tasksPage #boardTabActions { justify-content: flex-start !important; }
  #tasksPage .tasks-board-wrap {
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  #tasksPage .tasks-board-wrap::-webkit-scrollbar { display: none; }
  #tasksPage .tasks-board-column { scroll-snap-align: start; }

  /* Workflows: actions wrap into reachable rows instead of an off-screen strip */
  #workflowsPage .workflows-top-actions {
    flex-wrap: wrap !important;
    overflow: visible !important;
    row-gap: 8px !important;
  }
  #workflowsPage .workflow-select { flex: 1 1 190px; min-width: 0; width: auto; }
  #workflowsPage .workflow-name-input { flex: 1 1 150px; width: auto !important; min-width: 0; }
  #workflowsPage .btn-workflow { flex: 1 1 auto; min-height: 42px; }
  #workflowsPage .workflows-top-tabs { width: auto !important; overflow: visible !important; }
  #workflowsPage .workflows-editor-panel { min-height: 0 !important; }
  #workflowsPage .workflows-canvas-wrap { min-height: 52dvh !important; }

  /* MCP */
  #mcpMarketplacePage .mcp-marketplace-content { padding: 16px 14px !important; }
  #mcpMarketplacePage .mcp-marketplace-cards { grid-template-columns: 1fr !important; }
}
