:root {
  --bg: #0b1016;
  --panel: #131a24;
  --panel-2: #0f1520;
  --accent: #31d0ff;
  --text: #e6eef7;
  --muted: #9aa6b2;
  --border: rgba(255,255,255,0.06);
}
* { box-sizing: border-box; }
body { margin:0; font-family: "Segoe UI", Arial, sans-serif; background: var(--bg); color: var(--text); }
.app { min-height:100vh; }
.topbar { display:flex; justify-content:space-between; align-items:center; padding:12px 20px; background: #0e141d; border-bottom:1px solid var(--border);} 
.brand { font-weight:600; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.badge { background: var(--panel); padding:2px 6px; border-radius:8px; font-size:12px; margin-left:8px; }
.pilot-badge { margin-left:8px; padding:2px 7px; border-radius:999px; border:1px solid rgba(76, 201, 114, 0.45); background:rgba(76, 201, 114, 0.12); color:#b8ffca; font-size:11px; font-weight:500; }
.mission-title-pill { max-width: 260px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding:2px 8px; border-radius:999px; border:1px solid var(--border); color:var(--muted); background:rgba(255,255,255,0.025); font-size:11px; font-weight:500; }
.top-actions { display:flex; gap:8px; }
.cockpit { display:grid; grid-template-columns: minmax(270px, 0.92fr) minmax(500px, 2.3fr) minmax(280px, 0.92fr); gap:14px; padding:14px; }
.panel { background: var(--panel); border:1px solid var(--border); border-radius:14px; padding:14px; min-height: 200px; }
.panel.left h2 { margin-bottom:6px; letter-spacing:0; }
.mission-builder-intro { color:#d8edf6; font-size:12px; line-height:1.45; border:1px solid rgba(49,208,255,0.18); background:rgba(49,208,255,0.045); border-radius:10px; padding:9px 10px; margin-bottom:10px; }
.mission-builder-input { width:100%; box-sizing:border-box; }
.left .textarea { width:100%; background: var(--panel-2); border:1px solid var(--border); color: var(--text); border-radius:10px; padding:10px; }
.label { margin-top:12px; display:block; font-size:12px; color: var(--muted); }
.select { width:100%; background: var(--panel-2); border:1px solid var(--border); color: var(--text); border-radius:10px; padding:8px; }
.toggles { margin-top:10px; display:flex; flex-direction:column; gap:6px; font-size:13px; color: var(--muted); }
.actions { display:flex; gap:8px; margin-top:12px; }
.row { display:flex; align-items:center; }
.gap { gap:8px; flex-wrap:wrap; }
.btn { background: var(--panel-2); color: var(--text); border:1px solid var(--border); padding:8px 12px; border-radius:10px; cursor:pointer; }
.btn:disabled, .text-input:disabled, .textarea:disabled, .select:disabled, input:disabled { opacity: .52; cursor:not-allowed; }
.btn.primary { background: var(--accent); color:#03121c; border: none; font-weight:600; }
.btn.ghost { background: transparent; }
.wide-action { width:100%; justify-content:center; }
.chips { margin-top:12px; display:flex; flex-wrap:wrap; gap:8px; }
.chip { background: #0e1725; border:1px solid var(--border); color: var(--text); border-radius:999px; padding:6px 10px; cursor:pointer; font-size:12px; }
.inline-toggle { font-size: 12px; color: var(--muted); display:flex; align-items:center; gap:6px; }
.select.compact { width:auto; min-width: 140px; }
.text-input { flex:1; min-width: 200px; background: var(--panel-2); border:1px solid var(--border); color: var(--text); border-radius:8px; padding:8px; }
.kpi { display:grid; grid-template-columns: repeat(4, 1fr); gap:10px; }
.kpi-label { font-size:11px; color: var(--muted); }
.kpi-value { font-size:18px; font-weight:600; }
.state { margin-top:12px; padding:12px; background: var(--panel-2); border-radius:12px; border:1px solid var(--border); }
.state-title { font-weight:600; }
.state-body { color: var(--muted); margin-top:4px; }
.demo-badge {
  display: inline-block;
  margin-top: 6px;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid rgba(49, 208, 255, 0.35);
  background: rgba(49, 208, 255, 0.12);
  color: #bfefff;
  font-size: 12px;
}
.progress { margin:8px 0 0; padding-left:18px; color: var(--muted); }
.tabs { margin-top:12px; display:flex; gap:8px; }
.tab { background: var(--panel-2); border:1px solid var(--border); color: var(--text); padding:6px 10px; border-radius:8px; cursor:pointer; }
.tab.active { background: var(--accent); color:#03121c; border:none; }
.mode-tabs { margin-top: 12px; display:flex; gap:8px; flex-wrap:wrap; }
.mode-tab { background: #0f1722; border:1px solid var(--border); color: var(--text); padding:8px 12px; border-radius:10px; cursor:pointer; font-weight:600; }
.mode-tab.active { background: rgba(49, 208, 255, 0.14); border-color: rgba(49, 208, 255, 0.45); color: #c8f4ff; }
.mode-more { position:relative; }
.mode-more > summary { list-style:none; cursor:pointer; background:#0f1722; border:1px solid var(--border); color:var(--muted); padding:8px 12px; border-radius:10px; font-weight:600; }
.mode-more > summary::-webkit-details-marker { display:none; }
.mode-more-menu { display:flex; gap:8px; flex-wrap:wrap; margin-top:8px; padding:8px; border:1px solid var(--border); border-radius:10px; background:rgba(255,255,255,0.025); }
.panel-body { margin-top:12px; }
.panel-body.hidden { display:none; }
.list { display:flex; flex-direction:column; gap:10px; }
.card { background: var(--panel-2); border:1px solid var(--border); border-radius:12px; padding:12px; }
.mono { white-space: pre-wrap; font-family: Consolas, monospace; font-size:12px; }
.candidate-pipe { margin-top: 8px; display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.candidate-note { width:100%; margin-top:6px; background: #0b1420; border:1px solid var(--border); color: var(--text); border-radius:8px; padding:7px 8px; font-size:12px; }
.candidate-add-card .state-body { color:var(--muted); margin-bottom:8px; line-height:1.4; }
.muted { color: var(--muted); font-size: 12px; }
.role-empty { color: var(--muted); }
.role-custom-profile { border:1px solid rgba(49,208,255,0.20); background:rgba(49,208,255,0.045); border-radius:12px; padding:10px; color:#d8edf6; display:flex; flex-direction:column; gap:8px; }
.role-custom-profile.compact { gap:6px; padding:9px 10px; }
.role-custom-profile.compact .role-prep-details { padding:8px; margin-top:2px; }
.role-custom-profile.compact .role-closest-list { margin-top:8px; }
.role-custom-profile strong { color:#f1fbff; }
.role-custom-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap:7px; }
.role-custom-grid div { border:1px solid rgba(255,255,255,0.07); background:rgba(255,255,255,0.018); border-radius:9px; padding:7px 8px; }
.role-custom-grid span { display:block; color:var(--muted); font-size:11px; margin-bottom:2px; }
.role-custom-grid b { font-size:12px; overflow-wrap:anywhere; }
.role-technical-note { margin:0; }
.product-hero { border:1px solid rgba(49, 208, 255, 0.16); background:linear-gradient(135deg, rgba(49,208,255,0.065), rgba(124,92,255,0.035)); border-radius:12px; padding:12px 13px; margin-bottom:10px; display:flex; flex-direction:column; gap:9px; }
.product-hero-eyebrow { color:#bfefff; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:0; margin-bottom:4px; }
.product-hero-title { color:var(--text); font-size:17px; font-weight:800; line-height:1.28; max-width:760px; }
.product-hero-subtitle { display:none; }
.hero-flow-visual { display:flex; gap:6px; align-items:center; justify-content:flex-start; flex-wrap:wrap; }
.hero-flow-card { min-width:0; border:1px solid rgba(255,255,255,0.075); border-radius:999px; background:rgba(255,255,255,0.02); padding:5px 8px 5px 5px; display:inline-flex; flex-direction:row; gap:6px; align-items:center; }
.hero-flow-card.status-ready { border-color:rgba(76, 201, 114, 0.34); background:rgba(76, 201, 114, 0.06); }
.hero-flow-card.status-need { border-color:rgba(49, 208, 255, 0.42); background:rgba(49, 208, 255, 0.075); }
.hero-flow-card.status-waiting { opacity:0.72; }
.hero-flow-icon { width:20px; height:20px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; border:1px solid rgba(49, 208, 255, 0.28); color:#c8f4ff; background:rgba(49, 208, 255, 0.09); font-size:9px; font-weight:800; }
.hero-flow-icon.ai { border-color:rgba(124, 92, 255, 0.36); background:rgba(124, 92, 255, 0.13); color:#ddd4ff; }
.hero-flow-icon.safe { border-color:rgba(76, 201, 114, 0.40); background:rgba(76, 201, 114, 0.14); color:#b8ffca; }
.hero-flow-card strong { font-size:11.5px; line-height:1.2; white-space:nowrap; }
.hero-flow-card small { display:none; }
.hero-flow-card small.ready { color:#b8ffca; }
.hero-flow-card small.need { color:#bfefff; }
.hero-flow-arrow { color:rgba(191,239,255,0.28); font-weight:700; }
.value-story-title { color:#eaf7ff; font-weight:800; margin:2px 0 8px; }
.value-story-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)); gap:10px; margin-bottom:12px; }
.value-story-card { border:1px solid rgba(255,255,255,0.09); border-radius:12px; background:rgba(255,255,255,0.018); padding:10px; min-height:102px; display:flex; flex-direction:column; gap:6px; }
.value-story-card strong { font-size:13px; line-height:1.25; }
.value-story-card small { color:var(--muted); line-height:1.32; }
.value-story-panel .value-story-grid { margin:0 10px 10px; }
.mission-status-card { border-color:rgba(49, 208, 255, 0.34); background:linear-gradient(135deg, rgba(49,208,255,0.09), rgba(255,255,255,0.018)); display:grid; grid-template-columns: 1fr auto; gap:12px; align-items:center; margin-bottom:10px; box-shadow:0 10px 28px rgba(0,0,0,0.14); }
.mission-status-eyebrow { color:#bfefff; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.mission-status-title { color:#f1fbff; font-size:18px; font-weight:800; line-height:1.25; margin-top:3px; }
.mission-status-body { color:var(--muted); line-height:1.45; margin-top:4px; }
.mission-primary { min-width:170px; }
.ai-manager-center { grid-template-columns: minmax(0, 1fr) minmax(210px, 250px); align-items:start; border-color:rgba(124,92,255,0.30); background:linear-gradient(135deg, rgba(124,92,255,0.09), rgba(49,208,255,0.055), rgba(255,255,255,0.012)); }
.ai-manager-main { min-width:0; }
.ai-manager-side { display:flex; flex-direction:column; gap:10px; align-items:stretch; }
.ai-manager-side .mission-primary { width:100%; }
.ai-manager-next { margin-top:8px; padding:10px; border:1px solid rgba(49,208,255,0.22); border-radius:12px; background:rgba(49,208,255,0.045); display:flex; flex-direction:column; gap:3px; }
.ai-manager-next span { color:var(--muted); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.ai-manager-next strong { color:#f1fbff; font-size:15px; line-height:1.25; }
.ai-manager-next small { color:var(--muted); line-height:1.35; }
.ai-manager-snapshot { display:grid; grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)); gap:8px; margin-top:10px; }
.ai-manager-stat { border:1px solid rgba(255,255,255,0.08); border-radius:12px; background:rgba(255,255,255,0.018); padding:9px; min-width:0; }
.ai-manager-stat span { display:block; color:var(--muted); font-size:11px; margin-bottom:4px; }
.ai-manager-stat strong { display:block; color:#eaf7ff; font-size:12px; line-height:1.35; overflow-wrap:anywhere; }
.ai-manager-stat.ready { border-color:rgba(76,201,114,0.24); background:rgba(76,201,114,0.045); }
.ai-manager-stat.missing { border-color:rgba(255,202,58,0.24); background:rgba(255,202,58,0.035); }
.ai-manager-stat.pct { border-color:rgba(49,208,255,0.26); background:rgba(49,208,255,0.045); }
.ai-manager-stat.mission { border-color:rgba(124,92,255,0.24); background:rgba(124,92,255,0.045); }
.ai-manager-stat.action { border-color:rgba(255,202,58,0.24); background:rgba(255,202,58,0.035); }
.ai-manager-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.ai-manager-actions .btn { padding:8px 10px; }
.candidate-nudge .btn { align-self:flex-start; margin-top:4px; }
.ai-manager-human { border:1px solid rgba(255,255,255,0.08); border-radius:12px; background:rgba(255,255,255,0.018); padding:10px; color:var(--muted); font-size:12px; line-height:1.35; }
.ai-manager-human strong { display:block; color:#eaf7ff; margin-bottom:5px; }
.ai-manager-human p { margin:0; }
.ai-manager-human ul { margin:0 0 8px 16px; padding:0; }
.routine-checklist-panel { grid-column:1 / -1; border-top:1px solid rgba(255,255,255,0.07); padding-top:10px; margin-top:2px; }
.routine-checklist-head { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; margin-bottom:8px; }
.routine-compact-summary { display:flex; flex-wrap:wrap; gap:7px; margin:8px 0; }
.routine-compact-summary span { border:1px solid rgba(255,255,255,0.08); background:rgba(255,255,255,0.018); border-radius:999px; padding:4px 8px; color:var(--muted); font-size:11px; }
.routine-next-step { border:1px solid rgba(49,208,255,0.20); border-radius:12px; background:rgba(49,208,255,0.04); padding:9px; display:flex; flex-direction:column; gap:4px; margin-bottom:8px; }
.routine-next-step span { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.04em; font-weight:800; }
.routine-next-step strong { color:#f1fbff; font-size:13px; line-height:1.25; }
.routine-next-step small { color:var(--muted); line-height:1.35; }
.routine-next-step .btn { align-self:flex-start; padding:6px 8px; font-size:12px; }
.routine-checklist-all { border:1px solid rgba(255,255,255,0.07); border-radius:10px; background:rgba(255,255,255,0.012); padding:8px; }
.routine-checklist-all > summary { cursor:pointer; color:#c8f4ff; font-size:12px; font-weight:800; }
.routine-checklist-all .routine-checklist-grid { margin-top:8px; }
.routine-checklist-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(178px, 1fr)); gap:8px; }
.routine-check-item { border:1px solid rgba(255,255,255,0.08); border-radius:12px; background:rgba(255,255,255,0.016); padding:9px; min-height:126px; display:flex; flex-direction:column; gap:7px; }
.routine-check-item.ready { border-color:rgba(76,201,114,0.26); background:rgba(76,201,114,0.045); }
.routine-check-item.needs_review { border-color:rgba(255,202,58,0.30); background:rgba(255,202,58,0.035); }
.routine-check-item.blocked { opacity:.72; }
.routine-check-top { display:flex; justify-content:space-between; gap:8px; align-items:flex-start; }
.routine-check-top strong { color:#eaf7ff; font-size:12px; line-height:1.25; }
.routine-check-top span { flex:0 0 auto; border:1px solid rgba(255,255,255,0.10); border-radius:999px; padding:2px 6px; color:#bfefff; font-size:10px; font-weight:800; text-transform:uppercase; }
.routine-check-item.ready .routine-check-top span { color:#b8ffca; border-color:rgba(76,201,114,0.42); }
.routine-check-item.needs_review .routine-check-top span { color:#ffe5a9; border-color:rgba(255,202,58,0.42); }
.routine-check-item p { margin:0; color:var(--muted); font-size:11px; line-height:1.35; flex:1 1 auto; }
.routine-check-item .btn { align-self:flex-start; padding:6px 8px; font-size:12px; }
.routine-drafts-panel { grid-column:1 / -1; border-top:1px solid rgba(255,255,255,0.07); padding-top:10px; margin-top:2px; }
.routine-drafts-head { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; margin-bottom:8px; }
.routine-draft-mode { flex:0 0 auto; border:1px solid rgba(124,92,255,0.30); background:rgba(124,92,255,0.08); color:#d7ccff; border-radius:999px; padding:4px 8px; font-size:11px; font-weight:700; }
.routine-drafts-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap:8px; }
.routine-drafts-more { margin-top:8px; border:1px solid rgba(124,92,255,0.14); border-radius:10px; background:rgba(124,92,255,0.025); padding:8px; }
.routine-drafts-more > summary { cursor:pointer; color:#d7ccff; font-size:12px; font-weight:800; }
.routine-drafts-more .routine-drafts-grid { margin-top:8px; }
.routine-draft-card { border:1px solid rgba(124,92,255,0.18); border-radius:12px; background:linear-gradient(135deg, rgba(124,92,255,0.045), rgba(255,255,255,0.012)); padding:10px; display:flex; flex-direction:column; gap:8px; min-height:166px; }
.routine-draft-head span { display:block; color:#d7ccff; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.routine-draft-head strong { display:block; color:#f1fbff; font-size:13px; line-height:1.25; margin-top:3px; }
.routine-draft-preview { color:var(--muted); font-size:12px; line-height:1.35; min-height:34px; }
.routine-draft-details { border:1px solid rgba(255,255,255,0.07); border-radius:10px; background:rgba(255,255,255,0.014); padding:8px; }
.routine-draft-details > summary { cursor:pointer; color:#c8f4ff; font-weight:700; font-size:12px; }
.routine-draft-details pre { white-space:pre-wrap; font-family:Consolas, monospace; font-size:11px; line-height:1.35; color:#dbeaf4; margin:8px 0 0; max-height:220px; overflow:auto; }
.routine-draft-actions { display:flex; flex-wrap:wrap; gap:6px; margin-top:auto; }
.routine-draft-actions .btn { padding:6px 8px; font-size:12px; }
.routine-draft-staged { color:#b8ffca; border:1px solid rgba(76,201,114,0.22); background:rgba(76,201,114,0.055); border-radius:9px; padding:6px 8px; font-size:11px; line-height:1.3; }
.action-center-panel { grid-column:1 / -1; margin-top:10px; }
.action-center { border:1px solid rgba(49,208,255,0.18); border-radius:12px; background:rgba(49,208,255,0.025); overflow:hidden; }
.action-center > summary { cursor:pointer; list-style:none; display:flex; justify-content:space-between; gap:12px; align-items:flex-start; padding:10px 12px; }
.action-center > summary::-webkit-details-marker { display:none; }
.action-center > summary::before { content:"+"; width:20px; height:20px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; border:1px solid rgba(49,208,255,0.30); color:#bfefff; flex:0 0 auto; }
.action-center[open] > summary::before { content:"-"; }
.action-center > summary span { font-weight:800; color:#eaf9ff; }
.action-center > summary small { color:var(--muted); text-align:right; line-height:1.35; }
.action-center-stats { display:flex; flex-wrap:wrap; gap:7px; padding:0 12px 8px; }
.action-center-stats span { border:1px solid rgba(255,255,255,0.08); background:rgba(255,255,255,0.018); border-radius:999px; padding:4px 8px; color:var(--muted); font-size:11px; }
.action-center-note { margin:0 12px 10px; color:#cdeaf3; border:1px solid rgba(49,208,255,0.18); border-radius:9px; background:rgba(49,208,255,0.045); padding:7px 9px; font-size:12px; line-height:1.35; }
.action-list { display:flex; flex-direction:column; gap:8px; padding:0 12px 12px; }
.action-list.compact { gap:7px; }
.action-row { display:flex; justify-content:space-between; gap:10px; border:1px solid rgba(255,255,255,0.08); border-radius:10px; padding:9px; background:rgba(255,255,255,0.018); }
.action-row.status-pending_review { border-color:rgba(255,202,58,0.22); background:rgba(255,202,58,0.035); }
.action-row.status-approved { border-color:rgba(49,208,255,0.22); background:rgba(49,208,255,0.035); }
.action-row.status-completed { border-color:rgba(76,201,114,0.24); background:rgba(76,201,114,0.04); }
.action-main { min-width:0; display:flex; flex-direction:column; gap:6px; }
.action-title { color:#f1fbff; font-weight:800; line-height:1.3; }
.action-meta { display:flex; flex-wrap:wrap; gap:6px; align-items:center; color:var(--muted); font-size:11px; }
.action-type,
.action-status { border:1px solid rgba(255,255,255,0.10); border-radius:999px; padding:2px 7px; }
.action-status.pending_review { color:#ffe5a9; border-color:rgba(255,202,58,0.42); background:rgba(255,202,58,0.10); }
.action-status.approved { color:#bfefff; border-color:rgba(49,208,255,0.42); background:rgba(49,208,255,0.10); }
.action-status.completed { color:#b8ffca; border-color:rgba(76,201,114,0.45); background:rgba(76,201,114,0.10); }
.action-status.skipped,
.action-status.blocked { color:#d8dce2; border-color:rgba(255,255,255,0.12); background:rgba(255,255,255,0.035); }
.action-preview { color:var(--muted); font-size:12px; line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.action-more { border:1px solid rgba(255,255,255,0.07); border-radius:10px; background:rgba(255,255,255,0.012); padding:8px; }
.action-more > summary { cursor:pointer; color:#c8f4ff; font-weight:800; font-size:12px; }
.action-more .action-row { margin-top:8px; }
.action-date { color:rgba(216,220,226,0.72); font-size:11px; overflow-wrap:anywhere; }
.action-actions { display:flex; flex-wrap:wrap; gap:6px; justify-content:flex-end; align-content:flex-start; min-width:160px; }
.action-actions .btn { padding:6px 8px; font-size:12px; }
.side-advanced-panel { margin-top:12px; }
.side-advanced-panel > summary { padding-left:0; padding-right:0; }
.side-advanced-panel > summary::before { margin-left:0; }
.secondary-tabs-panel { margin-top:10px; }
.secondary-tabs-panel .tabs { margin:0 10px 10px; }
.mission-technical-panel .kpi { margin:0 10px 10px; }
.mission-technical-panel .state { margin:0 10px 10px; }
.value-story-panel,
.mission-technical-panel,
.secondary-tabs-panel,
.guide-status-advanced { display:none; }
.value-icon { width:28px; height:28px; border-radius:10px; display:inline-flex; align-items:center; justify-content:center; border:1px solid rgba(49, 208, 255, 0.30); color:#c8f4ff; background:rgba(49, 208, 255, 0.09); font-size:11px; font-weight:800; }
.value-icon.ai { border-color:rgba(124, 92, 255, 0.40); background:rgba(124, 92, 255, 0.13); color:#ddd4ff; }
.value-icon.safe { border-color:rgba(76, 201, 114, 0.42); background:rgba(76, 201, 114, 0.13); color:#b8ffca; }
.value-icon.warn { border-color:rgba(255, 202, 58, 0.42); background:rgba(255, 202, 58, 0.12); color:#ffe5a9; }
.role-card { display: flex; flex-direction: column; gap: 10px; }
.role-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.role-head-right { display: flex; align-items: center; gap: 8px; }
.role-title { font-size: 15px; font-weight: 600; }
.role-score { font-size: 12px; color: var(--muted); }
.role-badge { padding: 3px 9px; border-radius: 999px; font-size: 11px; border: 1px solid var(--border); text-transform: uppercase; letter-spacing: .2px; }
.role-badge.recommend { color: #b8ffca; border-color: rgba(76, 201, 114, 0.55); background: rgba(76, 201, 114, 0.15); }
.role-badge.review { color: #ffe5a9; border-color: rgba(255, 202, 58, 0.55); background: rgba(255, 202, 58, 0.13); }
.role-badge.reject { color: #ffc0c0; border-color: rgba(255, 90, 90, 0.55); background: rgba(255, 90, 90, 0.13); }
.role-section { border: 1px solid var(--border); border-radius: 10px; padding: 8px 10px; background: rgba(255,255,255,0.01); }
.role-section-title { font-size: 12px; color: var(--muted); margin-bottom: 6px; font-weight: 600; }
.role-list { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 4px; }
.role-list li { font-size: 13px; line-height: 1.35; }
.role-evidence-list { display: flex; flex-direction: column; gap: 8px; }
.role-evidence-row { border: 1px solid var(--border); border-radius: 8px; padding: 7px 8px; background: rgba(255,255,255,0.02); }
.role-evidence-meta { font-size: 12px; margin-bottom: 4px; }
.role-evidence-skill { color: #d2ebff; font-weight: 600; }
.role-evidence-source { color: var(--muted); font-size: 11px; }
.role-evidence-text { font-size: 12px; line-height: 1.35; color: #d9e2ee; }
.role-picker-toolbar { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-top:6px; margin-bottom:6px; }
.role-picker-toolbar .text-input { flex:1; min-width: 220px; }
.role-picker-toolbar .select { min-width: 180px; width:auto; flex:0 0 auto; }
.role-prep-card { display:flex; flex-direction:column; gap:10px; }
.role-prep-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap:10px; margin-top:10px; }
.role-prep-grid .label { margin-top:0; }
.role-prep-hero { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; padding-bottom:8px; border-bottom:1px solid var(--border); }
.role-prep-meta { flex:0 0 auto; color:#bfefff; border:1px solid rgba(49, 208, 255, 0.35); background:rgba(49, 208, 255, 0.08); border-radius:999px; padding:5px 9px; font-size:12px; }
.role-prep-explainer { color:#d8edf6; line-height:1.45; border:1px solid rgba(49, 208, 255, 0.16); background:rgba(49, 208, 255, 0.045); border-radius:10px; padding:9px 10px; }
.role-prep-package-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap:10px; }
.role-prep-package-grid.compact { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.role-search-warning { border:1px solid rgba(245, 158, 11, 0.32); background:rgba(245, 158, 11, 0.07); color:#fde7b1; text-align:left; }
.role-search-warning strong { display:block; margin-bottom:6px; color:#fff3d2; }
.role-closest-list { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.role-closest-btn { font-size:12px; padding:6px 9px; }
.role-prep-llm-state { color:#d7ccff; border:1px solid rgba(124, 92, 255, 0.24); background:rgba(124, 92, 255, 0.08); border-radius:10px; padding:8px 10px; font-size:12px; }
.role-prep-section { min-height: 118px; background: rgba(255,255,255,0.015); }
.role-prep-package-grid.compact .role-prep-section { min-height:0; }
.role-rubric-list.compact .role-rubric-row { grid-template-columns:46px 1fr; padding:7px; }
.role-prep-check,
.role-prep-questions,
.role-prep-practical,
.role-prep-brief,
.role-prep-clarify { border-color: rgba(49, 208, 255, 0.22); }
.role-prep-rubric,
.role-prep-decision,
.role-prep-missing { border-color: rgba(124, 92, 255, 0.22); }
.role-prep-risks { border-color: rgba(255, 202, 58, 0.28); background: rgba(255, 202, 58, 0.035); }
.role-prep-details { border:1px solid var(--border); border-radius:12px; background:rgba(255,255,255,0.012); padding:10px; }
.role-prep-details > summary { cursor:pointer; color:#c8f4ff; font-weight:700; }
.role-prep-details > .role-prep-tab-body { margin-top:10px; }
.role-prep-note { margin:0; white-space:pre-wrap; font-family:Consolas, monospace; font-size:12px; color:#dbeaf4; }
.role-prep-tabs { display:flex; flex-wrap:wrap; gap:8px; }
.role-prep-tab.active { border-color:rgba(49, 208, 255, 0.45); background:rgba(49, 208, 255, 0.12); color:#c8f4ff; }
.role-prep-tab-body { display:flex; flex-direction:column; gap:10px; }
.role-prep-question-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap:10px; }
.role-answer-card { border:1px solid var(--border); border-radius:10px; padding:10px; background:rgba(255,255,255,0.018); display:flex; flex-direction:column; gap:8px; }
.role-answer-question { font-weight:700; color:#eaf7ff; line-height:1.35; }
.role-answer-columns { display:grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap:10px; }
.role-answer-columns strong { display:block; margin-bottom:6px; font-size:12px; color:#bfefff; }
.role-rubric-list { display:flex; flex-direction:column; gap:8px; }
.role-rubric-row { display:grid; grid-template-columns:54px 1fr; gap:10px; align-items:start; border:1px solid var(--border); border-radius:10px; padding:9px; background:rgba(255,255,255,0.018); }
.role-rubric-weight { min-width:44px; border:1px solid rgba(49, 208, 255, 0.35); background:rgba(49, 208, 255, 0.08); color:#c8f4ff; border-radius:10px; padding:5px 6px; text-align:center; font-weight:700; font-size:12px; }
.role-brief-line { display:grid; grid-template-columns: minmax(120px, 0.35fr) 1fr; gap:10px; padding:8px 0; border-bottom:1px solid var(--border); }
.role-brief-line:last-child { border-bottom:none; }
.role-brief-line span { color:var(--muted); font-size:12px; }
.role-brief-line strong { font-size:13px; line-height:1.35; }
.role-advanced-panel { margin-top:10px; }
.candidate-extra-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap:10px; margin-top:8px; }
.candidate-extra-grid .label { margin-top:0; }
.guide-header { font-weight:700; display:flex; align-items:center; justify-content:space-between; gap:8px; }
.guide-mini-status { border:1px solid rgba(124, 92, 255, 0.38); background:rgba(124,92,255,0.12); color:#ddd4ff; border-radius:999px; padding:3px 7px; font-size:11px; font-weight:700; }
.guide-status { color: var(--muted); font-size:12px; margin-bottom:8px; }
.guide-activity-status { color: var(--muted); font-size:11px; margin-bottom:8px; padding:6px 8px; border:1px solid var(--border); border-radius:8px; background: rgba(255,255,255,0.02); text-transform: lowercase; }
.guide-activity-status.running { color: #bfefff; border-color: rgba(49, 208, 255, 0.35); background: rgba(49, 208, 255, 0.08); }
.guide-notice { background: rgba(255, 202, 58, 0.12); border: 1px solid rgba(255, 202, 58, 0.35); color: #ffe1a3; padding: 8px; border-radius: 10px; font-size: 12px; margin-bottom: 8px; }
.guide-error { background: rgba(255, 90, 90, 0.12); border: 1px solid rgba(255, 90, 90, 0.35); color: #ffb3b3; padding: 8px; border-radius: 10px; font-size: 12px; margin-bottom: 8px; }
.notice { background: rgba(255, 202, 58, 0.10); border: 1px solid rgba(255, 202, 58, 0.30); color: #ffe1a3; padding: 8px; border-radius: 10px; font-size: 12px; margin-top: 8px; }
.notice.error { background: rgba(255, 90, 90, 0.10); border-color: rgba(255, 90, 90, 0.30); color: #ffb3b3; }
.guide-messages { min-height:120px; max-height:300px; overflow:auto; border:1px solid var(--border); background: var(--panel-2); border-radius:10px; padding:8px; }
.guide-plan { margin-top:8px; font-size:12px; color: var(--muted); }
.guide-plan ul { margin:6px 0 0 16px; padding:0; }
.guide-input { display:flex; gap:6px; margin-top:8px; }
.guide-input input { flex:1; background: var(--panel-2); border:1px solid var(--border); color: var(--text); border-radius:8px; padding:8px; }
.guide-quick-prompts { margin-top: 8px; display:flex; flex-wrap:wrap; gap:8px; }
.guide-context { position: relative; }
.guide-next-step-card { border:1px solid rgba(49, 208, 255, 0.32); background:rgba(49, 208, 255, 0.07); color:#d8f6ff; border-radius:10px; padding:10px; margin-top:8px; line-height:1.35; }
.guide-next-step-card span { display:block; color:var(--muted); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; margin-bottom:3px; }
.guide-next-step-card strong { display:block; color:#f1fbff; font-size:15px; line-height:1.25; }
.guide-operator-block { margin-top:8px; padding:9px; border:1px solid var(--border); border-radius:10px; background:rgba(255,255,255,0.015); }
.guide-operator-block strong { display:block; margin-bottom:4px; color:#eaf7ff; font-size:12px; }
.guide-operator-block p { margin:0; color:var(--muted); font-size:12px; line-height:1.4; }
.guide-primary-action { width:100%; margin-top:10px; justify-content:center; }
.guide-prep-applied { color:#d8edf6; font-size:12px; line-height:1.4; margin-top:8px; }
.guide-debug-panel { display:none; }
.guide-next-actions .actions { display:grid; grid-template-columns: 1fr; gap:8px; margin-top:8px; }
.guide-next-actions .actions .btn { width:100%; }
.guide-role-prep-hint { font-size:12px; line-height:1.4; color:#d8edf6; border-color: rgba(49, 208, 255, 0.22); background: rgba(49, 208, 255, 0.055); }
.ai-operator-panel { border-color: rgba(124, 92, 255, 0.20); background: linear-gradient(135deg, rgba(124,92,255,0.06), rgba(49,208,255,0.025)); }
.ai-operator-grid { display:grid; grid-template-columns: 1fr; gap:7px; margin-top:10px; }
.operator-card { text-align:left; border:1px solid rgba(255,255,255,0.08); border-radius:10px; background:rgba(255,255,255,0.014); color:var(--text); padding:8px 9px; cursor:pointer; }
.operator-card:hover { border-color:rgba(49, 208, 255, 0.35); background:rgba(49, 208, 255, 0.055); }
.operator-card span { display:block; font-weight:700; }
.operator-card small { display:block; color:var(--muted); margin-top:3px; line-height:1.3; }
.routine-operator-summary { margin-top:10px; border:1px solid rgba(49,208,255,0.18); border-radius:12px; background:rgba(49,208,255,0.035); padding:10px; }
.routine-operator-title { color:#eaf9ff; font-weight:800; margin-bottom:8px; }
.routine-operator-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap:8px; }
.routine-operator-grid > div,
.routine-outdated { border:1px solid rgba(255,255,255,0.07); background:rgba(255,255,255,0.018); border-radius:10px; padding:8px; }
.routine-operator-grid strong,
.routine-outdated strong { display:block; color:#dff7ff; font-size:12px; margin-bottom:5px; }
.routine-operator-grid ul,
.routine-outdated ul { margin:0; padding-left:16px; color:var(--muted); font-size:12px; line-height:1.35; }
.routine-outdated { margin-top:8px; border-color:rgba(255,202,58,0.24); background:rgba(255,202,58,0.035); }
.routine-human-note { margin-top:8px; color:var(--muted); font-size:12px; }
.routine-human-note > summary { cursor:pointer; color:#c8f4ff; font-weight:700; }
.error-text { color: #ff8a8a; margin-top:6px; font-size:12px; }
.guided-start { display:none; }
.demo-scenario { margin-top: 12px; border-color: rgba(49, 208, 255, 0.38); background: linear-gradient(135deg, rgba(49,208,255,0.11), rgba(111,91,255,0.07)); box-shadow: inset 0 1px 0 rgba(255,255,255,0.05); }
.demo-scenario-copy { display:flex; flex-direction:column; gap:4px; }
.demo-scenario .actions { margin-top:10px; }
.guided-steps { display:grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap:8px; margin-top:10px; }
.guided-step { width:100%; min-height:96px; text-align:left; display:flex; align-items:flex-start; gap:9px; background: rgba(255,255,255,0.02); border:1px solid var(--border); color: var(--text); border-radius:10px; padding:9px; cursor:pointer; }
.guided-step:hover { border-color: rgba(49, 208, 255, 0.35); background: rgba(49, 208, 255, 0.06); }
.guided-step.status-ready { border-color: rgba(76, 201, 114, 0.38); background: rgba(76, 201, 114, 0.055); }
.guided-step.status-need { border-color: rgba(49, 208, 255, 0.42); background: rgba(49, 208, 255, 0.07); }
.guided-step.status-waiting { opacity:0.82; }
.guided-num { width:24px; height:24px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; background: rgba(49, 208, 255, 0.15); border:1px solid rgba(49, 208, 255, 0.35); color:#bfefff; font-weight:700; font-size:12px; flex:0 0 auto; }
.guided-copy { display:flex; flex-direction:column; gap:2px; min-width:0; }
.guided-title { font-weight:600; }
.guided-sub { color: var(--muted); font-size:12px; line-height:1.35; }
.mission-status { align-self:flex-start; border:1px solid var(--border); border-radius:999px; padding:2px 7px; color:var(--muted); font-size:11px; font-weight:700; margin-bottom:5px; }
.mission-status.ready { color:#b8ffca; border-color:rgba(76, 201, 114, 0.45); background:rgba(76, 201, 114, 0.12); }
.mission-status.need { color:#bfefff; border-color:rgba(49, 208, 255, 0.45); background:rgba(49, 208, 255, 0.12); }
.mission-status.waiting { color:#d8dce2; background:rgba(255,255,255,0.035); }
.pipeline-hero { margin-bottom: 10px; }
.pipeline-hero-head { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; flex-wrap:wrap; }
.pipeline-top-cards { margin-top:10px; display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap:10px; }
.pipeline-mini-card { border:1px solid var(--border); border-radius:10px; padding:10px; background: rgba(255,255,255,0.02); display:flex; flex-direction:column; gap:8px; }
.pipeline-mini-head { font-weight:600; line-height:1.3; }
.pipeline-empty { border:1px dashed rgba(255,255,255,0.14); border-radius:10px; padding:12px; background: rgba(255,255,255,0.01); }
.visual-empty { display:flex; align-items:flex-start; gap:11px; border-radius:12px; }
.visual-empty.compact-share { align-items:center; margin-top:8px; }
.visual-empty-icon { width:36px; height:36px; border-radius:12px; flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; border:1px solid rgba(49, 208, 255, 0.32); background:rgba(49,208,255,0.10); color:#c8f4ff; font-weight:800; font-size:12px; }
.auth-card { display:flex; flex-direction:column; gap:10px; }
.auth-row { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.auth-row .text-input { min-width: 240px; }
.auth-row .compact-number { min-width: 120px; width: 140px; flex:0 0 auto; }
.advanced-panel { margin: 10px 0; border:1px solid rgba(255,255,255,0.045); border-radius:12px; background: rgba(255,255,255,0.008); }
.advanced-panel > summary { list-style:none; cursor:pointer; padding:11px 12px; display:flex; justify-content:space-between; gap:10px; align-items:flex-start; color:var(--text); }
.advanced-panel > summary::-webkit-details-marker { display:none; }
.advanced-panel > summary span { font-weight:700; }
.advanced-panel > summary small { color:var(--muted); font-size:12px; text-align:right; line-height:1.35; }
.advanced-panel > summary::before { content:"+"; width:20px; height:20px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--border); color:var(--muted); flex:0 0 auto; }
.advanced-panel[open] > summary::before { content:"-"; color:#bfefff; border-color: rgba(49, 208, 255, 0.38); }
.advanced-panel > .card { margin: 0 10px 10px; }
.auth-pill { padding:4px 8px; border:1px solid var(--border); border-radius:999px; color: var(--muted); font-size:11px; text-transform:uppercase; }
.auth-pill.admin { color:#b8ffca; border-color: rgba(76, 201, 114, 0.45); background: rgba(76, 201, 114, 0.12); }
.auth-pill.hr { color:#bfefff; border-color: rgba(49, 208, 255, 0.42); background: rgba(49, 208, 255, 0.10); }
.auth-pill.manager, .auth-pill.viewer { color:#ffe5a9; border-color: rgba(255, 202, 58, 0.45); background: rgba(255, 202, 58, 0.10); }
.org-members-card { display:flex; flex-direction:column; gap:10px; }
.org-member-form .select { flex:0 0 auto; }
.workspace-members-card { display:flex; flex-direction:column; gap:10px; }
.workspace-member-form .select { flex:0 0 auto; }
.workspace-members-list { margin-top:10px; display:flex; flex-direction:column; gap:8px; }
.member-row { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; border:1px solid var(--border); border-radius:10px; padding:10px; background: rgba(255,255,255,0.02); }
.member-main { min-width:0; display:flex; flex-direction:column; gap:5px; }
.member-actor { font-family:Consolas, monospace; font-size:13px; color:#eaf7ff; overflow-wrap:anywhere; }
.member-role { border:1px solid var(--border); border-radius:999px; padding:2px 7px; text-transform:uppercase; letter-spacing:.2px; font-size:10px; }
.member-role.owner, .member-role.admin { color:#b8ffca; border-color:rgba(76, 201, 114, 0.55); background:rgba(76, 201, 114, 0.13); }
.member-role.hr { color:#bfefff; border-color:rgba(49, 208, 255, 0.45); background:rgba(49, 208, 255, 0.10); }
.member-role.manager, .member-role.viewer { color:#ffe5a9; border-color:rgba(255, 202, 58, 0.55); background:rgba(255, 202, 58, 0.12); }
.members-audit-head { margin-top:14px; padding-top:12px; border-top:1px solid var(--border); display:flex; align-items:flex-start; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.workspace-members-audit-list { margin-top:10px; display:flex; flex-direction:column; gap:8px; }
.org-usage-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap:8px; }
.usage-tile { border:1px solid var(--border); border-radius:10px; padding:9px 10px; background: rgba(255,255,255,0.02); display:flex; flex-direction:column; gap:4px; }
.usage-tile strong { font-size:15px; }
.usage-tile span { color:var(--muted); font-size:11px; }
.usage-badges { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.workspace-mini-list { margin-top:8px; display:flex; flex-direction:column; gap:5px; }
.workspace-mini-list div { display:grid; grid-template-columns: 1fr auto auto; gap:8px; border:1px solid var(--border); border-radius:8px; padding:6px 8px; color:var(--muted); font-size:11px; }
.member-audit-row { border:1px solid var(--border); border-radius:10px; padding:9px 10px; background: rgba(255,255,255,0.015); }
.member-audit-main { display:flex; flex-direction:column; gap:5px; min-width:0; }
.share-management-head { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.share-management-tools { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.share-management-list { margin-top:10px; display:flex; flex-direction:column; gap:8px; }
.share-row { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; border:1px solid var(--border); border-radius:10px; padding:10px; background: rgba(255,255,255,0.02); }
.share-main { min-width:0; display:flex; flex-direction:column; gap:5px; }
.share-token { font-family:Consolas, monospace; font-size:13px; color:#eaf7ff; }
.share-meta { display:flex; flex-wrap:wrap; gap:6px; align-items:center; color:var(--muted); font-size:12px; }
.share-dates { color:var(--muted); font-size:11px; overflow-wrap:anywhere; }
.share-actions { flex:0 0 auto; }
.share-status { border:1px solid var(--border); border-radius:999px; padding:2px 7px; text-transform:uppercase; letter-spacing:.2px; font-size:10px; }
.share-status.active { color:#b8ffca; border-color:rgba(76, 201, 114, 0.55); background:rgba(76, 201, 114, 0.13); }
.share-status.expired { color:#ffe5a9; border-color:rgba(255, 202, 58, 0.55); background:rgba(255, 202, 58, 0.12); }
.share-status.revoked { color:#ffc0c0; border-color:rgba(255, 90, 90, 0.55); background:rgba(255, 90, 90, 0.12); }
.share-audit-head { margin-top:14px; padding-top:12px; border-top:1px solid var(--border); display:flex; align-items:flex-start; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.share-audit-list { margin-top:10px; display:flex; flex-direction:column; gap:8px; }
.share-audit-row { border:1px solid var(--border); border-radius:10px; padding:9px 10px; background: rgba(255,255,255,0.015); }
.share-audit-main { display:flex; flex-direction:column; gap:5px; min-width:0; }
.share-audit-action { font-weight:600; text-transform:capitalize; }
.empty-state.compact { padding:10px; font-size:12px; color:var(--muted); }
.decision-pack { display:flex; flex-direction:column; gap:10px; }
.decision-hero { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; padding-bottom:8px; border-bottom:1px solid var(--border); }
.decision-eyebrow { color: var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
.decision-title { font-weight:700; font-size:16px; margin-top:3px; }
.decision-score { min-width:54px; height:54px; border-radius:14px; display:flex; align-items:center; justify-content:center; background: rgba(49,208,255,0.12); border:1px solid rgba(49,208,255,0.36); color:#c8f4ff; font-weight:700; }
.decision-overview-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap:8px; }
.decision-overview-grid div { border:1px solid rgba(49,208,255,0.16); border-radius:10px; background:rgba(49,208,255,0.035); padding:8px; }
.decision-overview-grid span { display:block; color:var(--muted); font-size:11px; margin-bottom:4px; }
.decision-overview-grid strong { display:block; color:#eaf7ff; font-size:13px; }
.decision-section { border:1px solid var(--border); border-radius:10px; padding:10px; background: rgba(255,255,255,0.015); }
.decision-section.empty-state { border-style:dashed; }
.decision-section-title { font-size:12px; color: var(--muted); font-weight:700; margin-bottom:6px; text-transform:uppercase; letter-spacing:.04em; }
.decision-section p { margin:0; line-height:1.45; }
.decision-list { margin:0; padding-left:18px; display:flex; flex-direction:column; gap:5px; }
.decision-actions { display:flex; flex-wrap:wrap; gap:8px; }
.guide-context-grid { display:grid; grid-template-columns: 1fr; gap:6px; margin-top:8px; }
.guide-context-row { display:flex; justify-content:space-between; gap:8px; padding:6px 8px; border:1px solid var(--border); border-radius:8px; background: rgba(255,255,255,0.01); font-size:12px; }
.guide-context-row span:last-child { text-align:right; }
.guide-next-actions { display:grid; grid-template-columns: 1fr; gap:8px; margin-top:8px; }
.guide-next-actions .btn { width:100%; justify-content:flex-start; }
.tabs#subTabs { flex-wrap:wrap; }
.tabs#subTabs .tab.hidden { display:none; }
.text-input.compact { min-width: 110px; width: 140px; flex: 0 0 auto; }
.select.compact { min-width: 120px; }
.card .actions .btn { white-space: nowrap; }
.panel.center .card + .card { margin-top: 10px; }
.hidden { display:none; }
@media (max-width: 1200px) { .cockpit { grid-template-columns: 1fr; } }
@media (max-width: 900px) {
  .product-hero { grid-template-columns: 1fr; }
  .hero-flow-visual { justify-content:flex-start; }
  .hero-flow-arrow { display:none; }
  .hero-flow-card { min-width:0; }
  .mission-status-card,
  .ai-manager-center { grid-template-columns:1fr; }
  .ai-manager-snapshot { grid-template-columns:1fr; }
  .mission-primary { width:100%; }
  .pipeline-top-cards { grid-template-columns: 1fr; }
  .mode-tabs { overflow-x:auto; padding-bottom:2px; }
  .mode-tab { flex: 0 0 auto; }
  .guide-context-row { flex-direction:column; align-items:flex-start; }
  .role-picker-toolbar { flex-direction:column; align-items:stretch; }
  .role-picker-toolbar .select { width:100%; min-width: 0; }
}