/* WO-UI1: manager route only. Existing routing, stream and component contracts remain intact.
   Loaded after responsive.css. Reuses theme.css tokens, with DESIGN.md surfaces scoped here. */
#cockpit-view {
  min-width: 0;
  min-height: 0;
  max-height: 100dvh;
}
#cockpit-view .founder-cockpit-container {
  --bg-canvas: #08090b;
  --bg-surface: #0d0f14;
  --bg-card: #13161f;
  --bg-card-hover: #191d28;
  --text-primary: #e2e8f0;
  --text-secondary: #b4bcd0;
  --text-muted: #b4bcd0;
  --text-dim: #b4bcd0;
  --border-subtle: rgba(255,255,255,.09);
  --border-muted: rgba(255,255,255,.18);
  --accent-primary: #b7aaff;
  --border-focus: #b7aaff;
  min-width: 0;
  min-height: 0;
  background: var(--bg-canvas);
  color: var(--text-primary);
  font-size: 14px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
#cockpit-view :is(button,input,select,textarea,summary,[role="button"],[role="option"]) {
  font-family: inherit;
  font-size: 13px;
}
#cockpit-view :is(button,select,summary,[role="button"],[role="option"]) {
  min-height: 44px;
  touch-action: manipulation;
}
#cockpit-view :is(button,[role="button"],summary):not(:disabled) { cursor: pointer; }
#cockpit-view :is(button,input,select,textarea,summary,[tabindex]):focus-visible {
  outline: 2px solid #c4b5fd !important;
  outline-offset: 3px;
}
#cockpit-view :is(button,[role="button"]):disabled {
  opacity: .6;
  cursor: not-allowed;
}
#cockpit-view :is(button,[role="button"],summary):hover:not(:disabled) { border-color: var(--border-muted); }
#cockpit-view :is(button,[role="button"]):active:not(:disabled) { transform: translateY(1px); }
#cockpit-view :is(input,textarea)::placeholder { color: #b4bcd0; opacity: 1; }
#cockpit-view :is(input,select,textarea) { color: #e2e8f0; }
#cockpit-view :is(.cockpit-main-stage,.conversation-scroll-wrapper,.sidebar-tree-container) { min-height: 0; min-width: 0; }
#cockpit-view .cockpit-main-stage { background: var(--bg-canvas); }
#cockpit-view #cockpit-sidebar {
  width: 280px;
  min-width: 280px;
  max-width: 280px;
  background: var(--bg-surface);
  border-right: 1px solid var(--border-subtle);
  backdrop-filter: none;
}
#cockpit-view #cockpit-sidebar.collapsed { margin-left: -280px; }
#cockpit-view :is(.sidebar-header-box,.sidebar-footer-box) { padding: 16px 12px; gap: 10px; }
#cockpit-view .sidebar-header-box { max-height: 66%; overflow-y: auto !important; overflow-x: clip !important; }
#cockpit-view .sidebar-header-box:has(.new-session-popover) { overflow: visible !important; }
#cockpit-view .sidebar-tree-container { padding: 8px 12px; }
#cockpit-view .session-workspace-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 16px; font-weight: 650; color: #f8fafc; }
#cockpit-view :is(.session-workspace-defaults,.session-workspace-filters) { min-width: 0; border: 1px solid var(--border-subtle); border-radius: 8px; padding: 0 10px; background: var(--bg-surface); }
#cockpit-view :is(.session-workspace-defaults,.session-workspace-filters) > summary { display: list-item; padding: 11px 0; color: var(--text-secondary); font-weight: 500; }
#cockpit-view :is(.session-workspace-defaults,.session-workspace-filters)[open] { padding-bottom: 10px; }
#cockpit-view :is(.session-workspace-defaults,.session-workspace-filters) > :not(summary) { margin-top: 8px; }
#cockpit-view :is(.session-workspace-hint,.header-popover-description,.header-channel-feedback) { color: #b4bcd0; font-size: 12px; line-height: 1.55; white-space: normal; overflow-wrap: anywhere; }
#cockpit-view .btn-new-chat { min-height: 44px; background: #b7aaff; color: #161122; border: 1px solid #b7aaff; border-radius: 8px; box-shadow: none; }
#cockpit-view .btn-new-chat:hover { background: #c7bdff; }
#cockpit-view .sidebar-search-input { min-height: 44px; background: var(--bg-canvas); font-size: 13px; }
#cockpit-view .session-item-row { min-height: 64px; padding: 10px; border-radius: 8px; margin-bottom: 4px; border: 1px solid transparent; }
#cockpit-view .session-item-row.active { background: rgba(183,170,255,.12); border-color: rgba(183,170,255,.28); box-shadow: inset 3px 0 #b7aaff; }
#cockpit-view .session-item-row:hover { background: var(--bg-card-hover); }
#cockpit-view :is(.session-item-title,.session-title) { font-size: 13px; font-weight: 500; color: #e2e8f0; }
#cockpit-view :is(.session-item-meta,.session-meta,.session-badge,.session-item-time,.sidebar-group-title,.tab-count-badge,.shortcut-kbd,.header-kbd,.engine-item-desc,.engine-popover-group-label,.engine-pill-text,.handoff-option-meta-line,.founder-role,.tool-pill-label,.tool-pill-status,.message-time,.message-timestamp,.popover-effort-pill,.session-workspace-hint) { font-size: 12px !important; line-height: 1.45; }
#cockpit-view :is(.session-item-meta,.session-meta,.session-item-time,.sidebar-group-title,.founder-role,.message-time,.message-timestamp) { color: #b4bcd0; }
#cockpit-view :is(.header-icon-btn,.capsule-icon-btn,.capsule-mic-btn,.capsule-send-btn,.session-action-btn,.header-popover-close,.header-title-btn-save,.header-title-btn-cancel) { min-width: 44px; min-height: 44px; flex-shrink: 0; }
#cockpit-view #cockpit-header { height: auto; min-height: 68px; max-height: none; padding: 10px 20px; gap: 10px; flex-wrap: wrap; background: var(--bg-surface) !important; box-shadow: none; border-bottom: 1px solid var(--border-subtle); }
#cockpit-view :is(.top-bar-left,.top-bar-right) { gap: 8px; min-width: 0; flex-wrap: wrap; }
#cockpit-view .header-title-text { color: #f8fafc; font-size: 16px; font-weight: 600; }
#cockpit-view :is(.header-action-btn,.cockpit-engine-pill) { min-height: 44px; border-radius: 8px; box-shadow: none; }
#cockpit-view :is(.header-dropdown-menu,.header-engine-popover,.header-handoff-popover,.header-channel-transfer-popover,.new-session-popover) { background: #13161f; color: #e2e8f0; border: 1px solid rgba(255,255,255,.18); border-radius: 12px; max-width: min(440px,calc(100vw - 24px)); max-height: min(640px,76dvh); overflow-y: auto; overscroll-behavior: contain; box-shadow: 0 16px 48px rgba(0,0,0,.45); }
#cockpit-view :is(.header-dropdown-item,.header-engine-item,.handoff-session-option-row) { min-height: 44px; white-space: normal; }
#cockpit-view :is(.header-popover-close,.header-task-label) { font-size: 12px; }
#cockpit-view .conversation-canvas { max-width: 880px; padding: 24px 24px 28px; gap: 28px; }
#cockpit-view .message-markdown-content { font-size: 15px; line-height: 1.7; color: #e2e8f0; overflow-wrap: anywhere; }
#cockpit-view .message-markdown-content :is(p,li) { max-width: 75ch; }
#cockpit-view .message-markdown-content pre { max-width: 100%; overflow-x: auto; }
#cockpit-view .floating-capsule-wrapper { position: relative; inset: auto; flex: 0 0 auto; min-height: 80px; padding: 0 24px max(16px,env(safe-area-inset-bottom)); }
#cockpit-view .conversation-scroll-wrapper { overflow-anchor: none; }
#cockpit-view .floating-capsule { max-width: 832px; background: #13161f; border: 1px solid rgba(255,255,255,.2); border-radius: 14px; box-shadow: 0 8px 28px rgba(0,0,0,.16); }
#cockpit-view .floating-capsule:focus-within { border-color: #b7aaff; box-shadow: 0 0 0 1px rgba(183,170,255,.3); }
#cockpit-view .cockpit-composer-hint { font-size: 12px; line-height: 1.5; color: #b4bcd0; text-align: center; }
#cockpit-view .cockpit-content-state { padding: 24px; font-size: 14px; line-height: 1.6; color: #e2e8f0; }
#cockpit-view .cockpit-content-state button { margin-top: 12px; padding: 8px 16px; color: #e2e8f0; background: #191d28; border: 1px solid rgba(255,255,255,.2); border-radius: 8px; }
#cockpit-view :is(.cockpit-text-window,.cockpit-pdf-window,.cockpit-search-window,.cockpit-confirm-card) { max-width: calc(100vw - 24px); max-height: 90dvh; background: #13161f; color: #e2e8f0; }
#cockpit-view :is(.cockpit-text-body,.cockpit-pdf-body,.cockpit-search-body) { min-width: 0; overflow: auto; overscroll-behavior: contain; }
#cockpit-view .cockpit-text-body :is(pre,code) { max-width: 100%; overflow-x: auto; font-size: 13px; }
#cockpit-view .founder-todo-drawer { max-width: min(440px,100%); background: #0d0f14; }
#cockpit-view :is(.header-icon-btn,.capsule-icon-btn,.session-action-btn):hover svg { filter: none; }
@media (min-width: 769px) and (max-width: 1100px) {
  #cockpit-view #cockpit-sidebar { width: 248px; min-width: 248px; max-width: 248px; }
  #cockpit-view #cockpit-sidebar.collapsed { margin-left: -248px; }
  #cockpit-view #cockpit-header { padding: 8px 12px; }
  #cockpit-view .top-bar-right { margin-left: auto; }
}
@media (max-width: 768px) {
  /* Existing app shell uses 44px top navigation, 64px bottom navigation and 20px main padding. */
  #cockpit-view { height: calc(100dvh - 128px) !important; max-height: calc(100dvh - 128px) !important; }
  #cockpit-view :is(.founder-cockpit-container,.cockpit-main-stage) { height: 100% !important; max-height: 100% !important; }
  #cockpit-view #cockpit-sidebar { width: min(300px,calc(100vw - 48px)); min-width: 0; max-width: calc(100vw - 48px); height: 100dvh; max-height: 100dvh; z-index: 1400; }
  #cockpit-view #cockpit-sidebar.collapsed { margin-left: 0; }
  #cockpit-view .mobile-drawer-backdrop { z-index: 1350; }
  #cockpit-view #cockpit-header { padding: 8px; gap: 4px; min-height: 60px; }
  #cockpit-view .top-bar-left { flex-basis: 100%; }
  #cockpit-view .top-bar-right { width: 100%; justify-content: flex-end; gap: 4px; }
  #cockpit-view .header-title-text { font-size: 14px; max-width: min(48vw,240px); }
  #cockpit-view .conversation-scroll-wrapper { height: auto !important; }
  #cockpit-view .conversation-canvas { padding: 16px 12px 20px; gap: 20px; }
  #cockpit-view .floating-capsule-wrapper { padding: 0 8px max(8px,env(safe-area-inset-bottom)); }
  #cockpit-view .floating-capsule { border-radius: 12px; }
  #cockpit-view .floating-capsule textarea { font-size: 16px; }
  #cockpit-view :is(.header-engine-popover,.header-handoff-popover,.header-channel-transfer-popover,.header-dropdown-menu) { position: fixed; top: 96px; left: 12px; right: 12px; width: auto; min-width: 0; max-width: calc(100vw - 24px); max-height: calc(100dvh - 180px); }
  #cockpit-view :is(.header-handoff-popover-footer,.cockpit-text-header,.cockpit-pdf-header) { flex-wrap: wrap; gap: 8px; }
  #cockpit-view :is(.btn-confirm-in-session-handoff,.btn-confirm-new-session-handoff) { width: 100%; }
  #cockpit-view :is(.cockpit-text-window,.cockpit-pdf-window,.cockpit-search-window,.cockpit-confirm-card) { width: calc(100vw - 16px); max-width: calc(100vw - 16px); max-height: 90dvh; }
}
@media (prefers-reduced-motion: reduce) {
  #cockpit-view *, #cockpit-view *::before, #cockpit-view *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
/* Engine remains available in the active-chat header and source picker. */
#cockpit-view .session-item-row .session-engine-badge { display: none; }
#cockpit-view :is(.btn-sidebar-deep-search,.header-popover-close) { background: #13161f; color: #e2e8f0; border: 1px solid rgba(255,255,255,.12); border-radius: 8px; padding: 8px 12px; }
#cockpit-view .session-workspace-filters .sidebar-filter-tabs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }
#cockpit-view .session-workspace-filters .sidebar-sort-bar { display: flex; flex-wrap: wrap; }
#cockpit-view .session-workspace-filters .sidebar-sort-select { min-width: 0; flex: 1 1 130px; }
#cockpit-view .session-workspace-filters .btn-sort-order { flex: 1 1 80px; }
#cockpit-view .session-workspace-title > span { color: #b4bcd0; font-size: 12px; }
#cockpit-view #session-active-filter { font-size: 12px; color: #c4b5fd; margin-left: 4px; }
#cockpit-view .founder-identity-card { text-align: left; width: 100%; color: #e2e8f0; }
#cockpit-view .session-workspace-close { display: none; }
#cockpit-view .sidebar-search-input { padding-inline: 12px; }
@media (max-width: 768px) {
  #cockpit-view .session-workspace-close { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; color: #e2e8f0; background: #13161f; border: 1px solid rgba(255,255,255,.12); border-radius: 8px; }
}

/* Audited legacy microcopy below the DESIGN.md 12px floor; scoped to this route. */
#cockpit-view .engine-segment-btn,
#cockpit-view .engine-segment-icon,
#cockpit-view .sidebar-model-select,
#cockpit-view .sidebar-model-select optgroup,
#cockpit-view .sidebar-model-select option,
#cockpit-view .new-session-option-desc,
#cockpit-view .btn-handoff-back,
#cockpit-view .new-session-popover-title,
#cockpit-view .handoff-session-search-input,
#cockpit-view .handoff-option-title,
#cockpit-view .header-handoff-description,
#cockpit-view .handoff-option-meta-line,
#cockpit-view .handoff-picker-empty,
#cockpit-view .btn-confirm-handoff-launch,
#cockpit-view .handoff-lounge-subtitle,
#cockpit-view .handoff-source-id-chip,
#cockpit-view .handoff-stage-indicator,
#cockpit-view .handoff-stage-title,
#cockpit-view .handoff-stage-desc,
#cockpit-view .handoff-lounge-live-bar,
#cockpit-view .btn-handoff-retry,
#cockpit-view .btn-handoff-cancel,
#cockpit-view .btn-handoff-collapse,
#cockpit-view .btn-handoff-expand-lounge,
#cockpit-view .cockpit-engine-pill,
#cockpit-view .engine-popover-title,
#cockpit-view .engine-popover-badge,
#cockpit-view .engine-popover-group-label,
#cockpit-view .header-engine-item,
#cockpit-view .engine-item-desc,
#cockpit-view .sidebar-tab-btn,
#cockpit-view .tab-label,
#cockpit-view .tab-icon,
#cockpit-view .tab-count-badge,
#cockpit-view .shortcut-kbd,
#cockpit-view .sidebar-search-input,
#cockpit-view .sidebar-search-input::placeholder,
#cockpit-view .sidebar-sort-select,
#cockpit-view .btn-sort-order,
#cockpit-view .btn-sort-order .sort-order-icon,
#cockpit-view .btn-sort-order .sort-order-label,
#cockpit-view .session-group-header,
#cockpit-view .native-cli-icon,
#cockpit-view .session-native-pill,
#cockpit-view .session-badge,
#cockpit-view .session-engine-badge,
#cockpit-view .header-wp-btn,
#cockpit-view .claude-icon,
#cockpit-view .session-item-meta-line,
#cockpit-view .session-meta-id,
#cockpit-view .session-time-meta,
#cockpit-view .session-status-chip,
#cockpit-view .session-pin-indicator,
#cockpit-view .sidebar-empty-state,
#cockpit-view .dropdown-item,
#cockpit-view .btn-purge-chats,
#cockpit-view .founder-avatar,
#cockpit-view .founder-name,
#cockpit-view .founder-role,
#cockpit-view .header-model-badge,
#cockpit-view .header-title-btn-save,
#cockpit-view .header-title-btn-cancel,
#cockpit-view .header-telemetry-badge,
#cockpit-view .telemetry-bolt,
#cockpit-view .header-status-indicator,
#cockpit-view .header-action-btn,
#cockpit-view .header-handoff-popover-sub,
#cockpit-view .btn-confirm-in-session-handoff,
#cockpit-view .btn-confirm-new-session-handoff,
#cockpit-view .artifacts-badge-count,
#cockpit-view .todo-badge-counter,
#cockpit-view .header-kbd,
#cockpit-view .header-live-status-toggle-btn .live-status-bolt,
#cockpit-view .header-dropdown-item.header-telemetry-item,
#cockpit-view .starter-card-desc,
#cockpit-view .agent-subagent-tag,
#cockpit-view .table-row-count-badge,
#cockpit-view .cockpit-bubble table th,
#cockpit-view .cockpit-bubble .markdown-data-table th,
#cockpit-view .message-bubble-body table th,
#cockpit-view .message-bubble-body .markdown-data-table th,
#cockpit-view .cockpit-bubble .status-badge,
#cockpit-view .cockpit-bubble .badge,
#cockpit-view .message-bubble-body .status-badge,
#cockpit-view .message-bubble-body .badge,
#cockpit-view .status-badge,
#cockpit-view .cockpit-bubble .task-list-item .native-task-checkbox:checked::after,
#cockpit-view .message-bubble-body .task-list-item .native-task-checkbox:checked::after,
#cockpit-view .code-block-header,
#cockpit-view .code-lang-label,
#cockpit-view .btn-code-copy,
#cockpit-view .tool-pill-left,
#cockpit-view .live-status-header,
#cockpit-view .tool-header-left,
#cockpit-view .tool-pill-dot,
#cockpit-view .tool-pill-label,
#cockpit-view .tool-header-cmd,
#cockpit-view .tool-pill-toggle-btn,
#cockpit-view .live-status-toggle-btn,
#cockpit-view .tool-toggle-text,
#cockpit-view .live-status-toolbar-title,
#cockpit-view .live-status-copy-btn,
#cockpit-view .btn-tool-copy,
#cockpit-view .live-status-pre,
#cockpit-view .tool-body-pre,
#cockpit-view .stepper-item-header,
#cockpit-view .stepper-step-num,
#cockpit-view .stepper-tool-tag,
#cockpit-view .stepper-cmd,
#cockpit-view .stepper-badge,
#cockpit-view .stepper-caret,
#cockpit-view .stepper-output-title,
#cockpit-view .stepper-pre,
#cockpit-view .subagent-report-header-left,
#cockpit-view .subagent-report-badge,
#cockpit-view .subagent-report-meta,
#cockpit-view .subagent-report-toggle-btn,
#cockpit-view .chat-dispatch-badge,
#cockpit-view .chat-handoff-badge,
#cockpit-view .chat-dispatch-badge .dispatch-badge-icon,
#cockpit-view .chat-handoff-badge .handoff-badge-icon,
#cockpit-view .chat-dispatch-badge .dispatch-badge-arrow,
#cockpit-view .subagent-report-toolbar-title,
#cockpit-view .subagent-report-copy-btn,
#cockpit-view .subagent-report-pre,
#cockpit-view .btn-load-older-messages,
#cockpit-view .msg-action-btn,
#cockpit-view .btn-dom-load-earlier,
#cockpit-view .capsule-attachment-badge,
#cockpit-view .slash-desc,
#cockpit-view .btn-scroll-bottom,
#cockpit-view .live-action-timer,
#cockpit-view .booting-step-status,
#cockpit-view .first-greeting-chips-title,
#cockpit-view .upload-indicator-text,
#cockpit-view .upload-percent-text,
#cockpit-view .pending-staging-header,
#cockpit-view .pending-clear-all-btn,
#cockpit-view .attachment-chip-tag,
#cockpit-view .attachment-chip-name,
#cockpit-view .pending-file-name,
#cockpit-view .attachment-chip-size,
#cockpit-view .pending-file-size,
#cockpit-view .chat-img-zoom-pill,
#cockpit-view .chat-img-filesize,
#cockpit-view .chat-attachment-btn-download,
#cockpit-view .pdf-tag-label,
#cockpit-view .chat-pdf-submeta,
#cockpit-view .chat-pdf-badge-tag,
#cockpit-view .chat-card-action-btn,
#cockpit-view .file-ext-pill,
#cockpit-view .chat-file-submeta,
#cockpit-view .chat-file-type-desc,
#cockpit-view .lightbox-file-size,
#cockpit-view .lightbox-zoom-label,
#cockpit-view .pdf-modal-badge,
#cockpit-view .pdf-modal-size,
#cockpit-view .text-modal-badge,
#cockpit-view .text-modal-size,
#cockpit-view .todo-drawer-meta-row,
#cockpit-view .todo-session-chip,
#cockpit-view .todo-update-chip,
#cockpit-view .todo-mode-chip,
#cockpit-view .todo-progress-ratio,
#cockpit-view .todo-progress-active-pill,
#cockpit-view .todo-filter-pill,
#cockpit-view .todo-filter-count,
#cockpit-view .todo-tab-btn,
#cockpit-view .todo-spotlight-title,
#cockpit-view .todo-spotlight-count,
#cockpit-view .todo-spotlight-step-chip,
#cockpit-view .todo-wo-code-badge,
#cockpit-view .todo-wo-step-pill,
#cockpit-view .todo-wo-status-badge,
#cockpit-view .todo-wo-chevron,
#cockpit-view .todo-step-code-badge,
#cockpit-view .todo-step-role-tag,
#cockpit-view .todo-module-chip,
#cockpit-view .todo-step-details-summary,
#cockpit-view .todo-step-details-list,
#cockpit-view .todo-step-details-list li code,
#cockpit-view .todo-wo-headline code,
#cockpit-view .todo-step-title code,
#cockpit-view .todo-badge-done,
#cockpit-view .todo-phase-badge,
#cockpit-view .todo-empty-hint,
#cockpit-view .todo-raw-code,
#cockpit-view .todo-drawer-footer,
#cockpit-view .todo-file-indicator,
#cockpit-view .todo-zero-mock-badge,
#cockpit-view .todo-zero-mock-badge .live-dot,
#cockpit-view .cockpit-search-kbd,
#cockpit-view .search-hint-tag,
#cockpit-view .search-results-meta,
#cockpit-view .search-cli-badge,
#cockpit-view .search-role-badge,
#cockpit-view .search-item-time,
#cockpit-view .thinking-headline-preview,
#cockpit-view .thinking-meta-badge,
#cockpit-view .subagents-deck-title,
#cockpit-view .subagents-deck-count,
#cockpit-view .subagents-deck-sla,
#cockpit-view .subagent-status-badge,
#cockpit-view .subagent-check-icon,
#cockpit-view .subagent-action-text,
#cockpit-view .session-project-chip,
#cockpit-view .session-todo-pill,
#cockpit-view .system-transition-pill,
#cockpit-view .system-transition-pill .transition-pill-icon,
#cockpit-view .system-transition-pill .transition-pill-time,
#cockpit-view .popover-tab-btn,
#cockpit-view .popover-search-input,
#cockpit-view .popover-search-input::placeholder,
#cockpit-view .popover-effort-pill,
#cockpit-view .sidebar-effort-btn,
#cockpit-view .subagents-deck-toggle-btn,
#cockpit-view .subagent-wo-todo-box,
#cockpit-view .subagent-wo-todo-title,
#cockpit-view .stepper-mini-tool-chip,
#cockpit-view .stepper-mini-tool-more,
#cockpit-view .subagent-verified-badge,
#cockpit-view .subagent-id-chip,
#cockpit-view .native-chip-icon,
#cockpit-view .native-chip-line,
#cockpit-view .header-artifacts-btn,
#cockpit-view .artifacts-badge-counter,
#cockpit-view .header-artifacts-count,
#cockpit-view .header-todo-badge,
#cockpit-view .file-preview-line-chip,
#cockpit-view .file-preview-path-sub,
#cockpit-view .file-preview-btn,
#cockpit-view .artifacts-bar-label,
#cockpit-view .artifact-tab-pill { font-size: 12px !important; }
/* Status pills must ellipsize inside the message column instead of overflowing on narrow viewports. */
#cockpit-view .tool-pill-label { min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#cockpit-view .thinking-headline-preview { display: inline-block; max-width: 100%; vertical-align: bottom; }
/* Compact stepper chip strip: shrink inside the fixed-height pill instead of overflowing the canvas. */
#cockpit-view .stepper-mini-chips-row { display: inline-flex; align-items: center; gap: 4px; flex: 0 1 auto; min-width: 0; max-width: 100%; overflow: hidden; white-space: nowrap; }
#cockpit-view .stepper-mini-tool-chip { flex: 0 1 auto; min-width: 0; max-width: 100%; overflow: hidden; }
/* Preview controls use their active component names, not older CSS aliases. */
#cockpit-view a[href]:focus-visible { outline: 2px solid #c4b5fd !important; outline-offset: 3px; }
#cockpit-view :is(.artifact-tab-chip,.file-preview-line-badge,.file-preview-fullpath) { font-size: 12px; line-height: 1.5; color: #b4bcd0; }
#cockpit-view .artifact-tab-chip { display: inline-flex; align-items: center; min-height: 44px; max-width: 100%; padding: 8px 12px; color: #e2e8f0; background: #13161f; border: 1px solid rgba(255,255,255,.12); border-radius: 8px; overflow-wrap: anywhere; }
#cockpit-view .artifact-tab-chip:hover { background: #191d28; }
#cockpit-view .file-preview-fullpath { min-width: 0; max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
@media (max-width: 768px) {
  /* Header injects ID-qualified styles after this sheet; two IDs keep viewport rules authoritative. */
  #cockpit-view #header-channel-transfer-popover,
  #cockpit-view #header-engine-popover,
  #cockpit-view #header-handoff-popover {
    position: fixed; top: 96px; left: 12px; right: 12px; width: auto; min-width: 0; max-width: calc(100vw - 24px); max-height: calc(100dvh - 180px); overflow-y: auto;
  }
}
#cockpit-view #header-channel-transfer-popover .channel-transfer-opt-sub,
#cockpit-view .channel-transfer-popover-hint { font-size: 12px !important; line-height: 1.5 !important; white-space: normal !important; overflow-wrap: anywhere; }
#cockpit-view .channel-transfer-popover-hint { color: #b4bcd0; }
#cockpit-view :is(.session-wp-badge,.session-tg-badge,.session-sms-badge) { font-size: 12px !important; }
#cockpit-view #header-engine-popover [style*="font-size: 11px"] { font-size: 12px !important; color: #b4bcd0 !important; }
#cockpit-view .session-workspace-locale { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #b4bcd0; font-size: 12px; }
#cockpit-view #cockpit-locale-select { min-height: 44px; padding: 8px 12px; background: #13161f; color: #e2e8f0; border: 1px solid rgba(255,255,255,.18); border-radius: 8px; }
#cockpit-view .popover-effort-row { display: flex; flex-wrap: wrap; gap: 6px; }
#cockpit-view .popover-effort-pill { min-height: 44px; padding: 8px 10px; font-family: inherit; color: #b4bcd0; }
#cockpit-view .popover-effort-pill.active { color: #fde68a; }
#cockpit-view .header-engine-select { display: flex; align-items: center; min-height: 44px; border-radius: 4px; }
#cockpit-view #header-model-search-empty { padding: 16px 8px; font-size: 13px; line-height: 1.5; color: #b4bcd0; }

/* ==========================================================================
   WO-48A: Live Founder UX fixes (capsule, header/popovers, sidebar density)
   ========================================================================== */
/* 1. Composer hint stays in the DOM for accessibility and tests, but not in the input pill. */
#cockpit-view #cockpit-composer-hint { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; pointer-events: none !important; }
#cockpit-view .floating-capsule #capsule-main-textarea { flex: 1 1 auto !important; min-width: 0 !important; width: 100% !important; }

/* 2. Desktop header: one row, right-aligned controls, popovers anchored clear of the sidebar. */
/* Fixed popovers must anchor to the viewport; identity transforms on the header/pill otherwise
   become their containing block and collapse the engine panel to the pill width. */
#cockpit-view #cockpit-header,
#cockpit-view .cockpit-engine-pill { transform: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
@media (min-width: 769px) {
  #cockpit-view #cockpit-header { flex-wrap: nowrap !important; height: 56px !important; min-height: 56px !important; max-height: 56px !important; box-sizing: border-box !important; overflow: visible !important; padding: 0 16px !important; gap: 10px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; z-index: 1300 !important; }
  #cockpit-view .top-bar-left { flex: 1 1 auto !important; min-width: 0 !important; flex-wrap: nowrap !important; align-items: center !important; gap: 8px !important; }
  #cockpit-view .header-title-container { flex: 1 1 auto !important; min-width: 60px !important; max-width: 280px !important; overflow: hidden !important; }
  #cockpit-view .header-title-text { white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; font-size: 14px !important; display: block !important; }
  #cockpit-view .top-bar-center { display: none !important; }
  #cockpit-view .top-bar-right { flex: 0 0 auto !important; flex-wrap: nowrap !important; margin-left: auto !important; align-items: center !important; gap: 6px !important; }
  #cockpit-view #cockpit-header :is(.header-action-btn, .cockpit-engine-pill) { min-height: 36px !important; height: 36px !important; padding: 0 10px !important; font-size: 12px !important; white-space: nowrap !important; }
  #cockpit-view #cockpit-header .header-icon-btn { min-width: 36px !important; width: 36px !important; min-height: 36px !important; height: 36px !important; }
  /* The engine pill shrinks before the session title collapses. */
  #cockpit-view .cockpit-engine-pill { flex: 0 1 auto !important; min-width: 0 !important; max-width: 190px !important; }
  #cockpit-view .cockpit-engine-pill .engine-pill-text { flex: 1 1 auto !important; min-width: 0 !important; max-width: 150px !important; overflow: hidden !important; text-overflow: ellipsis !important; }
  #cockpit-view :is(.engine-pill-dot, .engine-pill-chevron) { flex: 0 0 auto !important; }
  #cockpit-view #header-engine-popover { left: 0 !important; right: auto !important; top: calc(100% + 8px) !important; z-index: 2500 !important; width: 360px !important; }
  #cockpit-view :is(#header-channel-transfer-popover, #header-handoff-popover, #header-more-dropdown) { right: 0 !important; left: auto !important; top: calc(100% + 8px) !important; z-index: 2500 !important; }
  #cockpit-view #header-channel-transfer-popover { width: 340px !important; }
}
/* The verbose task counter is the first thing to go when the desktop header is tight. */
@media (min-width: 769px) and (max-width: 1599px) {
  #cockpit-view #header-todo-badge { display: none !important; }
}
/* Compact secondary desktop actions to icons so the left header bar never collides. */
@media (min-width: 769px) and (max-width: 1250px) {
  #cockpit-view .header-handoff-btn > span,
  #cockpit-view .header-artifacts-btn .artifacts-btn-text,
  #cockpit-view #btn-toggle-todo .header-task-label,
  #cockpit-view #btn-header-new-chat .header-action-text { display: none !important; }
  #cockpit-view :is(.header-handoff-btn, .header-artifacts-btn, #btn-toggle-todo, #btn-header-new-chat) { min-width: 36px !important; padding: 0 8px !important; justify-content: center !important; }
}
@media (min-width: 769px) and (max-width: 1024px) {
  #cockpit-view .channel-transfer-btn-label { display: none !important; }
  #cockpit-view #btn-header-channel-transfer { min-width: 36px !important; padding: 0 8px !important; justify-content: center !important; }
}
@media (min-width: 769px) and (max-width: 820px) {
  #cockpit-view .header-title-container { display: none !important; }
}
@media (min-width: 769px) and (max-width: 1180px) {
  #cockpit-view :is(#header-channel-transfer-popover, #header-handoff-popover, #header-more-dropdown, #header-engine-popover) { position: fixed !important; top: 108px !important; right: 16px !important; left: auto !important; max-width: calc(100vw - 280px) !important; }
}

/* 3. Compact popover close button and sticky engine popover header. */
#cockpit-view .header-popover-close { min-width: 32px !important; width: 32px !important; min-height: 32px !important; height: 32px !important; padding: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 32px !important; border-radius: 6px !important; font-size: 16px !important; line-height: 1 !important; margin-left: auto !important; }
#cockpit-view .engine-popover-header { display: flex !important; align-items: center !important; gap: 8px !important; background: #13161f !important; position: sticky !important; top: 0 !important; z-index: 5 !important; padding-bottom: 8px !important; }

/* 4. Channel popover: compact action labels instead of inflated multi-line cards. */
#cockpit-view #header-channel-transfer-popover .channel-transfer-action { min-height: 0 !important; font-size: 12px !important; color: #b7aaff !important; font-weight: 500 !important; line-height: 1.3 !important; display: block !important; margin-top: 2px !important; }

/* 5. Sidebar density: return vertical space to the session tree. */
#cockpit-view :is(.sidebar-header-box, .sidebar-footer-box) { padding: 10px 10px !important; gap: 6px !important; }
#cockpit-view #cockpit-sidebar :is(button, select, input, summary) { min-height: 34px !important; }
#cockpit-view :is(.session-workspace-defaults, .session-workspace-filters) > summary { padding: 6px 0 !important; min-height: 32px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; }
#cockpit-view .session-item-row { min-height: 52px !important; padding: 8px 10px !important; }
@media (max-width: 768px) {
  /* Exactly two compact rows: session/metrics, then icon-only actions (76px total). */
  #cockpit-view #cockpit-header { padding: 4px 8px !important; gap: 4px !important; height: 76px !important; min-height: 76px !important; max-height: 76px !important; box-sizing: border-box !important; overflow: visible !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: stretch !important; justify-content: center !important; }
  #cockpit-view .floating-capsule-wrapper { min-height: 84px; }
  #cockpit-view .top-bar-center { display: none !important; }
  #cockpit-view .top-bar-left { flex: 0 0 32px !important; width: 100% !important; max-width: 100% !important; flex-wrap: nowrap !important; align-items: center !important; gap: 4px !important; min-width: 0 !important; }
  #cockpit-view .top-bar-right { flex: 0 0 32px !important; width: 100% !important; max-width: 100% !important; flex-wrap: nowrap !important; justify-content: flex-end !important; align-items: center !important; gap: 4px !important; min-width: 0 !important; margin-left: 0 !important; }
  #cockpit-view .header-title-container { flex: 1 1 auto !important; min-width: 0 !important; max-width: none !important; overflow: hidden !important; }
  #cockpit-view .header-title-wrapper { min-height: 24px !important; height: 24px !important; align-items: center !important; }
  #cockpit-view .header-title-edit-btn { min-height: 24px !important; height: 24px !important; }
  #cockpit-view .cockpit-engine-pill { flex: 0 1 auto !important; min-width: 0 !important; max-width: 140px !important; }
  #cockpit-view .cockpit-engine-pill .engine-pill-text { max-width: 100px !important; }
  #cockpit-view .header-handoff-btn > span,
  #cockpit-view .header-artifacts-btn .artifacts-btn-text,
  #cockpit-view #btn-toggle-todo .header-task-label,
  #cockpit-view #btn-header-new-chat .header-action-text,
  #cockpit-view .channel-transfer-btn-label { display: none !important; }
  #cockpit-view :is(.header-handoff-btn, .header-artifacts-btn, #btn-toggle-todo, #btn-header-new-chat, #btn-header-channel-transfer) { min-width: 32px !important; padding: 0 6px !important; justify-content: center !important; }
  #cockpit-view #cockpit-header :is(.header-action-btn, .cockpit-engine-pill) { min-height: 32px !important; height: 32px !important; padding: 0 6px !important; font-size: 12px !important; }
  #cockpit-view #cockpit-header .header-icon-btn { min-width: 32px !important; width: 32px !important; min-height: 32px !important; height: 32px !important; }
  #cockpit-view #cockpit-header #header-todo-badge { display: none !important; }
  /* Full-width, viewport-anchored engine panel with readable height. */
  #cockpit-view #header-engine-popover { position: fixed !important; top: 88px !important; left: 12px !important; right: 12px !important; width: auto !important; min-width: 0 !important; max-width: calc(100vw - 24px) !important; max-height: calc(100dvh - 160px) !important; }
}

/* ==========================================================================
   WO-49A: WCAG AA contrast for muted live-cockpit text.
   Muted slate (#64748b / #71717a) sits at 2.78–4.03:1 on the obsidian canvas;
   #b4bcd0 reaches >= 9:1 on both #08090b and elevated #12161f/#1a1e3e surfaces.
   ========================================================================== */
#cockpit-view .session-group-header,
#cockpit-view .session-group-header *,
#cockpit-view .session-meta-id,
#cockpit-view .session-meta-id *,
#cockpit-view .session-time-meta,
#cockpit-view .session-status-chip.is-idle,
#cockpit-view .handoff-option-short-id,
#cockpit-view .engine-popover-group-label,
#cockpit-view .btn-purge-chats,
#cockpit-view .msg-action-btn:not(.copied),
#cockpit-view .msg-action-btn:not(.copied) span { color: #b4bcd0 !important; }
/* WhatsApp brand green on the #27272a tag chip was 3.26:1; #4ade80 reaches 8.5:1. */
#cockpit-view .msg-channel-tag.tag-whatsapp { color: #4ade80 !important; }
/* The WhatsApp chip inherits a 0.65-opacity timestamp line (0.85 x 0.65 = 3.6:1).
   Lift only meta lines that carry a channel tag; other timestamps stay subdued. */
#cockpit-view .user-msg-time-meta.msg-time-meta:has(.msg-channel-tag.tag-whatsapp) { opacity: 1 !important; }
/* 13.5px/12px welcome copy: #71717a sat at 3.93–4.12:1; #b4bcd0 clears 4.5:1. */
#cockpit-view .welcome-subtitle,
#cockpit-view .starter-card-desc { color: #b4bcd0 !important; }