.cockpit-page { --cp-border:#dedfdc; --cp-muted:#626765; --cp-surface:#fffefa; --cp-soft:#f2f4f2; --cp-green:#286c53; --cp-red:#ad403b; --cp-amber:#896516; --cp-summary-number-size:24px; --font-body:var(--font-display); --font-prose:'Spectral',Charter,Georgia,serif; }
.cockpit { --cp-agent-columns:30px minmax(0,1fr) 104px 42px; --cp-agent-gap:10px; display:grid; grid-template-rows:60px minmax(0,1fr) 34px; height:min(768px,calc(100svh - 48px)); min-height:min(620px,calc(100svh - 48px)); background:var(--cp-surface); border:1px solid #c7cac6; border-radius:8px; box-shadow:0 10px 40px #15181c08; overflow:hidden; font:400 13px var(--font-display); color:var(--ink); }
.cockpit [hidden] { display:none !important; }
.cockpit :where(button,input,select) { font:inherit; font-family:var(--font-display); letter-spacing:0; }
.cp-product-name,.cp-metrics dd,.cp-nav-label,.cp-sidebar-bottom strong { font-family:var(--font-display); }
.cockpit svg,.cp-detail-dialog svg { width:17px; height:17px; flex-shrink:0; stroke-width:1.65; }
.cockpit-page :focus-visible { outline:2px solid var(--blue); outline-offset:3px; }
.cockpit :is(button,input,select) { scroll-margin-block:12px; }
.cp-titlebar { position:relative; z-index:6; padding:0 22px; display:flex; align-items:center; gap:22px; border-bottom:1px solid var(--cp-border); background:var(--paper); }
.cp-titlebar > img { width:116px; height:auto; flex:none; }
.cp-product-name { padding-left:22px; border-left:1px solid #ccc8be; font-size:15px; font-weight:500; }
.cp-demo { margin-left:auto; display:flex; align-items:center; gap:7px; font-size:12px; color:var(--cp-muted); }
.cp-demo::before { content:''; width:6px; height:6px; background:#a88437; border-radius:50%; }
.cockpit .cp-avatar { display:grid; place-items:center; width:34px; height:34px; flex-shrink:0; padding:0; border:1px solid #c2c9d0; background:#e5edf7; border-radius:50%; font-size:13px; color:var(--blue); font-weight:500; }
.cp-avatar:hover,.cp-avatar[aria-expanded='true'] { background:#d8e6f7; }
.cp-profile { position:absolute; z-index:5; top:56px; right:20px; width:min(296px,calc(100% - 28px)); padding:20px; border:1px solid var(--cp-border); border-radius:6px; background:var(--cp-surface); box-shadow:0 12px 36px #15181c18; scroll-margin-block:16px; }
.cp-profile:focus-visible { outline:2px solid var(--blue); outline-offset:2px; }
.cp-profile-heading { display:flex; align-items:center; gap:12px; }
.cp-profile-who { flex:1; min-width:0; }
.cp-profile-who h4 { overflow-wrap:anywhere; }
.cp-profile-heading .cp-icon-button { align-self:flex-start; }
.cp-profile-photo { display:grid; place-items:center; width:48px; height:48px; flex-shrink:0; overflow:hidden; border:1px solid #c2c9d0; border-radius:50%; background:#e5edf7; color:var(--blue); font:500 16px/1 var(--font-display); }
.cp-avatar-photo { width:100%; height:100%; object-fit:cover; border-radius:50%; display:block; }
.cockpit .cp-avatar[data-photo='true'] { overflow:hidden; padding:0; }
.cp-profile-facts { display:grid; gap:10px; margin:16px 0 0; padding:14px 0 0; border-top:1px solid var(--cp-border); }
.cp-profile-facts div { display:grid; grid-template-columns:18px 1fr; column-gap:10px; align-items:center; }
.cp-profile-facts svg { grid-row:span 2; width:16px; height:16px; color:var(--cp-muted); }
.cp-profile-facts dt { color:var(--cp-muted); font-size:11px; line-height:1.3; }
.cp-profile-facts dd { margin:0; font-size:13px; line-height:1.4; overflow-wrap:anywhere; }
.cp-profile #identity-panel { margin-top:16px; padding-top:14px; border-top:1px solid var(--cp-border); }
.cp-profile #identity-panel .cp-action-button { width:100%; justify-content:center; }
.cp-profile #identity-status:empty { display:none; }
.cp-profile h4 { margin:3px 0 6px; font-size:15px; font-weight:500; line-height:1.35; }
.cp-profile-heading p { margin:0; font-size:13px; color:var(--cp-muted); }
.cp-profile-since { display:flex; align-items:center; gap:8px; margin:17px 0 0; padding-top:14px; border-top:1px solid var(--cp-border); font-size:12px; color:var(--cp-muted); }
.cp-layout { display:grid; grid-template-columns:164px minmax(0,1fr); grid-template-rows:minmax(0,1fr); min-height:0; }
.cp-sidebar { background:var(--cp-soft); border-right:1px solid var(--cp-border); padding:22px 10px 16px; display:flex; flex-direction:column; gap:8px; min-height:0; overflow-y:auto; }
.cp-nav-label { font:500 12px/1.4 var(--font-display); color:var(--cp-muted); padding-left:12px; }
.cp-nav { display:flex; flex-direction:column; gap:4px; }
.cp-nav button { display:flex; align-items:center; text-align:left; gap:10px; min-height:41px; padding:10px; border:0; border-radius:4px; background:none; color:#4f5552; font-size:13px; line-height:1.3; }
.cp-nav button:hover { background:#e6ebe7; }
.cp-nav button[aria-selected='true'] { background:#e2ebf7; color:#094fae; font-weight:500; }
.cp-nav-count { margin-left:auto; font-size:12px; font-variant-numeric:tabular-nums; color:var(--cp-muted); }
.cp-sidebar-footer { display:flex; flex-direction:column; gap:12px; margin-top:auto; }
.cockpit .cp-support-button { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:36px; padding:8px 10px; border:1px solid #123b72; border-radius:4px; background:#123b72; color:#fff; font:450 13px/1.3 var(--font-display); }
.cockpit .cp-support-button:hover { background:#0b2c58; border-color:#0b2c58; }
.cp-sidebar-bottom { display:flex; align-items:center; gap:11px; padding:14px 13px 0; border-top:1px solid var(--cp-border); }
.cp-sidebar-bottom > div { min-width:0; overflow-wrap:anywhere; }
.cp-sidebar-bottom > svg { color:var(--cp-muted); }
.cp-sidebar-bottom strong,.cp-sidebar-bottom span { display:block; font:400 13px/1.6 var(--font-display); }
.cp-sidebar-bottom span { font-size:12px; color:var(--cp-muted); }
.cp-main { display:grid; grid-template-rows:auto auto minmax(0,1fr); padding:0 24px 18px; min-width:0; min-height:0; }
.cp-toolbar { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 0 14px; border-bottom:1px solid var(--cp-border); }
.cp-toolbar h3 { font-size:22px; line-height:1.2; font-weight:500; margin:0; }
.cp-tools { display:flex; gap:8px; align-items:center; }
.cockpit select { max-width:220px; min-height:36px; padding:7px 28px 7px 9px; border:1px solid #cbd0c8; border-radius:4px; color:var(--ink); background:var(--cp-surface); font-size:13px; cursor:pointer; }
.cp-icon-button { display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; width:32px; height:32px; padding:7px; border:1px solid var(--cp-border); border-radius:4px; background:transparent; color:#4f5552; }
.cp-icon-button:hover { background:#edf1ed; color:var(--blue); }
.cp-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin:0 0 16px; border-bottom:1px solid var(--cp-border); padding:10px 0; }
.cp-metrics > div { container-type:inline-size; display:flex; flex-direction:column; padding:6px 10px; border:1px solid var(--cp-border); border-radius:4px; min-width:0; background:var(--cp-surface); }
.cp-metrics > div:nth-child(-n+3) { border-color:#c5d1dc; background:#f8fafc; }
.cp-metrics dt { display:flex; align-items:center; min-height:2.6em; margin-bottom:4px; font:500 13px/1.3 var(--font-display); color:var(--cp-muted); }
.cp-metrics dd { display:flex; align-items:baseline; gap:7px; min-width:0; margin:0; font:450 var(--cp-summary-number-size)/1.15 var(--font-display); font-variant-numeric:tabular-nums; }
.cp-metrics dd > strong { font:inherit; white-space:nowrap; }
.cp-metric-change { min-width:0; font:400 12px/1.35 var(--font-display); color:var(--cp-muted); }
.cp-metric-change[data-tone='positive'] { color:var(--cp-green); }
.cp-metric-change[data-tone='negative'] { color:var(--cp-red); }
.cp-metrics dd small { font-size:13px; font-weight:400; color:var(--cp-muted); }
#metric-credits { color:var(--ink); }
#metric-credits[data-budget-status='under'] { color:var(--cp-green); }
#metric-credits[data-budget-status='over'] { color:var(--cp-red); }
.cp-cost-metric .cp-budget { font:inherit; color:var(--ink); }
.cp-metric-note { display:block; margin-top:4px; font:400 12px/1.35 var(--font-display); color:var(--cp-muted); }
.cp-cost-heading { justify-content:space-between; gap:8px; }
.cp-inline { display:inline-flex; gap:6px; align-items:center; align-self:flex-start; border:0; background:none; padding:4px 0; color:var(--blue); font:450 13px var(--font-display); }
.cp-inline:hover { text-decoration:underline; }
.cp-inline svg { width:14px; height:14px; }
@container (max-width:190px) {
  .cp-metrics dd { gap:4px; }
  .cp-metrics dd > strong { font-size:22px; }
}
@container (max-width:150px) {
  .cp-metrics dd > strong { font-size:20px; }
}
.cp-panel { min-height:0; overflow:auto; scrollbar-width:thin; scrollbar-color:#c7cac6 transparent; scrollbar-gutter:stable; padding-right:8px; overscroll-behavior:contain; }
.cp-panel:focus-visible,#overview-agents:focus-visible,#overview-activity:focus-visible,#activity-log:focus-visible,#approval-queue:focus-visible { outline:2px solid var(--blue); outline-offset:-2px; }
.cp-overview-grid { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); grid-template-rows:minmax(0,1fr); gap:20px; height:100%; min-height:0; }
.cp-registry { display:flex; flex-direction:column; min-width:0; min-height:0; }
#overview-agents { flex:1; min-height:0; overflow:auto; scrollbar-width:thin; scrollbar-color:#c7cac6 transparent; padding-right:6px; }
.cp-registry .cp-section-heading,.cp-registry-foot { flex-shrink:0; }
.cp-section-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:28px; margin-bottom:12px; flex-wrap:wrap; }
.cp-section-heading h4 { font:500 15px/1.25 var(--font-display); margin:0; display:flex; align-items:center; gap:8px; }
.cp-section-heading h4 > span:not(.cp-live-dot) { font-size:12px; font-weight:400; color:var(--cp-muted); }
.cp-period { color:var(--cp-muted); font-size:12px; }
.cp-table-head { position:sticky; top:0; z-index:1; background:var(--cp-surface); display:grid; grid-template-columns:var(--cp-agent-columns); gap:var(--cp-agent-gap); padding:9px 10px; border-top:1px solid var(--cp-border); border-bottom:1px solid var(--cp-border); color:var(--cp-muted); font:450 12px var(--font-display); }
.cp-table-head span:first-child { grid-column:1 / span 2; }
.cp-table-head span:nth-child(2) { text-align:right; }
.cp-table-head span:last-child { text-align:center; }
.cp-agent { display:grid; grid-template-columns:var(--cp-agent-columns); align-items:center; gap:var(--cp-agent-gap); min-height:68px; padding:10px; border-bottom:1px solid #e9ebe6; }
.cp-agent:hover { background:#f3f6f2; }
.cp-agent-icon { width:30px; height:30px; display:grid; place-items:center; border:1px solid #d6ddd6; background:#f0f3ed; color:#47715e; border-radius:5px; }
.cp-agent[data-enabled='false'] .cp-agent-icon { background:#eeefec; color:#7f8780; }
.cp-agent-info { min-width:0; }
.cp-agent-name { border:0; background:none; color:var(--ink); padding:0; text-align:left; font:450 13px/1.4 var(--font-display); }
.cp-agent-name:hover { color:var(--blue); text-decoration:underline; text-underline-offset:3px; }
.cp-agent-meta { display:flex; align-items:center; gap:4px; font-size:12px; color:var(--cp-muted); margin-top:3px; line-height:1.4; }
.cp-agent-meta svg { width:13px; height:13px; }
.cp-agent-credits { text-align:right; font:400 13px/1.4 var(--font-display); font-variant-numeric:tabular-nums; }
.cp-agent-credits strong { font-size:15px; font-weight:450; color:var(--ink); }
.cp-agent-credits > span { font-size:12px; color:var(--cp-muted); }
.cp-credit-cost { display:block; margin-top:3px; font-size:12px; font-weight:400; color:var(--cp-muted,#626765); white-space:nowrap; }
.cp-switch { flex-shrink:0; width:42px; height:32px; position:relative; display:block; background:none; border:0; padding:0; }
.cp-switch::before { content:''; position:absolute; left:2px; top:5px; width:36px; height:22px; border:1px solid #b0b9ad; border-radius:20px; background:#c2c9c0; transition:background .18s; }
.cp-switch::after { content:''; position:absolute; left:6px; top:9px; width:14px; height:14px; border-radius:50%; background:var(--cp-surface); box-shadow:0 1px 2px #15181c14; transition:transform .18s; }
.cp-switch[aria-checked='true']::before { background:var(--blue); }
.cp-switch[aria-checked='true']::after { transform:translateX(14px); }
.cp-switch[aria-disabled='true'] { cursor:not-allowed; }
.cp-switch[aria-disabled='true']::before { background:#8aaad8; }
.cp-registry-foot { display:flex; align-items:flex-start; gap:7px; font-size:12px; line-height:1.5; color:var(--cp-muted); padding:10px 0 0; }
.cp-registry-foot svg { width:14px; height:14px; margin-top:2px; }
.cp-insights { border-left:1px solid var(--cp-border); padding-left:20px; min-width:0; min-height:0; overflow-y:auto; scrollbar-width:thin; scrollbar-color:#c7cac6 transparent; }
.cp-chart-controls { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; }
.cp-chart-legend { display:flex; align-items:center; flex-wrap:wrap; gap:18px; }
.cp-chart-key { display:inline-flex; align-items:center; gap:7px; font-size:13px; color:var(--cp-muted); }
.cp-chart-key::before { content:''; width:15px; height:2px; background:#0D5BC9; }
.cp-chart-key.hours::before { width:9px; height:9px; border-radius:1px; background:#35765f; }
.cp-projection-key { font-size:12px; color:var(--cp-muted); }
.cp-chart-wrap { position:relative; height:190px; width:100%; margin:12px 0 0; }
.cp-chart-wrap canvas { display:block; max-width:100%; }
.cp-feed { border-top:1px solid var(--cp-border); padding-top:16px; margin-top:14px; }
.cp-feed .cp-section-heading { margin-bottom:8px; }
#overview-activity { position:relative; height:252px; overflow:auto; scrollbar-width:thin; scrollbar-color:#c7cac6 transparent; }
#overview-activity .cp-event { min-height:76px; padding:10px 0; align-items:center; }
.cp-live-dot { display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--cp-green); }
.cp-event { display:grid; grid-template-columns:24px minmax(0,1fr) auto; align-items:start; gap:10px; padding:12px 0; border-bottom:1px solid #e9ebe6; }
.cp-event:last-child { border-bottom:0; }
.cp-event > .cp-event-icon { display:grid; place-items:center; width:24px; height:24px; background:#e7f0e9; color:var(--cp-green); border-radius:50%; }
.cp-event[data-state='approval'] > .cp-event-icon { color:var(--cp-amber); background:#f5eedc; }
.cp-event[data-state='paused'] > .cp-event-icon,.cp-event[data-state='dismissed'] > .cp-event-icon { color:var(--cp-muted); background:#eeefec; }
.cp-event-icon svg { width:12px; height:12px; }
.cp-event strong { display:block; font:400 13px/1.5 var(--font-display); }
.cp-event p { font-size:12px; color:var(--cp-muted); margin:3px 0 0; }
.cp-event time { font-size:12px; color:var(--cp-muted); padding-top:3px; white-space:nowrap; }
.cp-statusbar { border-top:1px solid var(--cp-border); background:var(--cp-soft); display:flex; justify-content:space-between; align-items:center; gap:14px; padding:0 22px; color:var(--cp-muted); font:400 12px/1.4 var(--font-display); }
.cp-statusbar > span:first-child { display:flex; align-items:center; gap:6px; }
.cp-statusbar svg { width:14px; height:14px; }
#cockpit-notice { text-align:right; }
.cp-directory-tools { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin-bottom:19px; }
#panel-agents { display:flex; flex-direction:column; overflow:hidden; }
#panel-agents .cp-directory-tools { flex-shrink:0; }
.cp-search { display:flex; align-items:center; gap:8px; border:1px solid #cbd0c8; padding:0 10px; border-radius:4px; flex:1 1 230px; min-width:0; max-width:440px; color:var(--cp-muted); background:var(--cp-surface); }
.cp-search input { margin:0; padding:8px 0; min-height:34px; background:none; border:0; min-width:0; font-size:13px; }
.cp-directory-tools > span { color:var(--cp-muted); font-size:12px; margin-left:auto; }
.cp-full-registry { --cp-agent-columns:30px minmax(0,1fr) 112px 104px 104px 42px; display:grid; grid-template-columns:minmax(0,1fr); align-content:start; flex:1; min-height:0; overflow-y:auto; padding-right:8px; scrollbar-color:#c7cac6 transparent; scrollbar-width:thin; }
.cp-full-registry .cp-agent { min-height:72px; }
.cp-full-registry .cp-table-head span:nth-child(2) { text-align:left; }
.cp-full-registry .cp-table-head span:nth-child(3) { text-align:left; }
.cp-full-registry .cp-table-head span:nth-child(4) { text-align:right; }
.cp-agent-trigger { display:flex; flex-direction:column; align-items:flex-start; gap:3px; min-width:0; }
.cp-llm-label { display:inline-flex; align-items:center; gap:7px; color:var(--ink); font:450 12px/1.4 var(--font-display); }
.cp-llm-label svg { width:13px; height:13px; color:var(--cp-muted); }
.cp-agent-department { min-width:0; overflow-wrap:anywhere; }
.cp-trigger-label { display:inline-flex; align-items:center; gap:7px; color:var(--cp-muted); font:400 13px/1.4 var(--font-display); }
.cp-trigger-label svg { width:14px; height:14px; }
.cp-empty { padding:36px 18px; text-align:center; color:var(--cp-muted); font-size:13px; grid-column:1/-1; }
.cp-action-button { display:inline-flex; gap:7px; align-items:center; justify-content:center; min-height:36px; padding:8px 12px; border:1px solid #cbd0c8; border-radius:4px; color:var(--ink); background:var(--cp-surface); font:450 13px/1.3 var(--font-display); }
.cp-action-button:hover { background:#edf1eb; }
.cp-activity-log { position:relative; flex:1; min-height:0; overflow-y:auto; overflow-anchor:none; padding-right:8px; scrollbar-width:thin; scrollbar-color:#c7cac6 transparent; }
.cp-activity-log .cp-event { padding:18px 0; grid-template-columns:30px 1fr auto; }
.cp-event-badge { display:inline-flex; margin-left:8px; padding:3px 6px; background:#eeefec; border-radius:3px; font-size:12px; color:var(--cp-muted); font-weight:400; }
#panel-activity { display:flex; flex-direction:column; overflow:hidden; }
#panel-activity > .cp-section-heading { flex-shrink:0; }
.cp-activity-layout { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:26px; flex:1; min-height:0; }
.cp-activity-column { display:flex; flex-direction:column; min-width:0; min-height:0; }
.cp-activity-column > .cp-section-heading { flex-shrink:0; }
.cp-review-column { border-left:1px solid var(--cp-border); padding-left:26px; }
#approval-queue { flex:1; min-height:0; overflow-y:auto; padding-right:6px; scrollbar-width:thin; scrollbar-color:#c7cac6 transparent; }
#review-title:focus-visible { outline:2px solid var(--blue); outline-offset:2px; }
.cp-approval { border-top:1px solid var(--cp-border); padding:18px 0; }
.cp-approval strong { display:block; font-size:13px; font-weight:450; }
.cp-approval p { color:var(--cp-muted); font-size:12px; line-height:1.55; margin:7px 0 12px; }
.cp-approval-actions { display:flex; gap:8px; }
.cp-approval-actions .approve { color:#fff; border-color:var(--blue); background:var(--blue); }
.cp-approval-actions .approve:hover { background:#094ead; }
.cp-detail-dialog { width:min(680px,calc(100vw - 40px)); max-height:calc(100svh - 64px); padding:0; border:1px solid #cbd0c8; border-radius:7px; background:var(--cp-surface); font:400 13px var(--font-display); box-shadow:0 22px 90px #15181c26; }
.cp-detail-dialog::backdrop { background:#15181c4d; backdrop-filter:blur(2px); }
.cp-detail-dialog .dialog-top { position:sticky; top:0; z-index:2; align-items:flex-start; margin:0; padding:25px 28px 20px; border-bottom:1px solid var(--cp-border); background:var(--cp-surface); }
.cp-detail-dialog h2 { font:500 20px/1.2 var(--font-display); overflow-wrap:anywhere; }
#agent-detail-content { padding:24px 28px; }
.cp-detail-description { margin:0; font:400 13px/1.65 var(--font-prose); }
.cp-detail-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:17px 25px; padding:20px 0; border-block:1px solid var(--cp-border); margin:20px 0; }
.cp-detail-grid dt { color:var(--cp-muted); font-size:12px; }
.cp-detail-grid dd { margin:4px 0 0; font-size:13px; line-height:1.5; overflow-wrap:anywhere; }
.cp-detail-grid dd strong { font-size:16px; font-weight:450; }
.cp-detail-systems { display:flex; align-items:center; flex-wrap:wrap; gap:9px 15px; margin-top:14px; }
.cp-system { font-size:13px; display:flex; gap:6px; align-items:center; }
.cp-system svg { width:13px; height:13px; color:var(--cp-muted); }
.cp-detail-footnote { font:400 12px/1.65 var(--font-display); color:var(--cp-muted); margin-top:22px; }
.cp-agent-detail { width:min(820px,calc(100vw - 40px)); }
.cp-agent-context { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; margin-bottom:18px; }
.cp-detail-account { display:flex; align-items:center; gap:7px; margin:0; color:var(--cp-muted); font-size:13px; }
.cp-agent-state { padding:3px 7px; background:#eeefec; border-radius:3px; color:var(--cp-muted); font:400 12px/1.5 var(--font-display); }
.cp-agent-state[data-active='true'] { background:#e7f0e9; color:var(--cp-green); }
.cp-detail-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin:22px 0 0; padding:18px 0; border-block:1px solid var(--cp-border); }
.cp-detail-metrics > div { min-width:0; }
.cp-detail-metrics dt,.cp-detail-metrics > div > span { display:block; color:var(--cp-muted); font:400 12px/1.4 var(--font-display); }
.cp-detail-metrics dd { margin:7px 0 4px; font:450 22px/1.25 var(--font-display); font-variant-numeric:tabular-nums; }
.cp-detail-metrics dd strong { font:inherit; }
.cp-detail-metrics dd small { font-size:13px; color:var(--cp-muted); }
.cp-paused-estimate { margin:10px 0 0; color:var(--cp-muted); font:400 12px/1.5 var(--font-display); }
.cp-agent-detail h3 { margin:0 0 12px; font:500 15px/1.4 var(--font-display); }
.cp-agent-detail-columns { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; padding:24px 0; border-bottom:1px solid var(--cp-border); margin-bottom:24px; }
.cp-agent-detail-columns > section { min-width:0; }
.cp-agent-detail-columns h3:not(:first-child) { margin-top:24px; }
.cp-agent-detail-columns p { margin:0; font:400 13px/1.65 var(--font-prose); }
.cp-workflow-list { margin:0; padding-left:21px; font:400 13px/1.55 var(--font-display); }
.cp-workflow-list li { padding-left:4px; margin:0 0 10px; }
.cp-workflow-list li::marker { color:var(--cp-muted); }
.cp-agent-detail .cp-detail-systems { margin-top:0; align-items:flex-start; }
.cp-detail-policy { display:flex; align-items:flex-start; gap:8px; margin-top:14px; color:var(--cp-green); font:400 12px/1.5 var(--font-display); }
.cp-detail-policy svg { margin-top:1px; }
.cp-agent-configuration .cp-detail-grid { border-top:0; padding-top:0; margin-top:0; }
.cp-agent-context-side { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
.cp-agent-policy { display:inline-flex; align-items:center; gap:5px; color:var(--cp-green); font:400 12px/1.5 var(--font-display); }
.cp-agent-policy svg { width:14px; height:14px; }
.cp-config-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:12px; margin:12px 0 20px; padding:0; }
.cp-config-cards div { display:grid; grid-template-columns:auto 1fr; column-gap:10px; align-items:center; padding:13px 14px; border:1px solid var(--cp-border); border-radius:6px; background:var(--cp-soft); }
.cp-config-cards svg { grid-row:span 2; width:18px; height:18px; color:var(--cp-muted); }
.cp-config-cards dt { color:var(--cp-muted); font-size:12px; }
.cp-config-cards dd { margin:2px 0 0; font-size:13px; line-height:1.45; overflow-wrap:anywhere; }
.cp-detail-secondary { display:block; margin-top:5px; font-size:12px; color:var(--cp-muted); }
.cp-agent-history .cp-event { grid-template-columns:20px minmax(0,1fr) auto; align-items:center; gap:8px; padding:7px 0; }
.cp-agent-history .cp-event > .cp-event-icon { width:20px; height:20px; }
.cp-agent-history .cp-event > div { min-width:0; }
.cp-agent-history .cp-event strong { display:flex; align-items:center; flex-wrap:wrap; gap:3px 10px; line-height:1.4; }
.cp-agent-history .cp-event p { display:none; }
.cp-agent-history .cp-event-badge { display:inline-flex; flex:none; width:auto; margin:0; padding:2px 6px; }
.cp-agent-history .cp-event time { padding-top:0; }
.cp-detail-empty { font:400 13px/1.6 var(--font-display); color:var(--cp-muted); }
.cp-agent-detail-actions { display:flex; justify-content:flex-end; border-top:1px solid var(--cp-border); margin-top:18px; padding-top:16px; }
.cp-support-dialog [hidden] { display:none !important; }
.cp-support-titlebar { display:flex; align-items:center; gap:10px; min-width:0; }
.cp-support-body { padding:24px 28px; }
.cp-support-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.cp-support-option { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; min-height:100px; padding:16px; border:1px solid #c5d1dc; border-radius:4px; color:var(--ink); background:#f8fafc; font:450 14px var(--font-display); }
.cp-support-option > svg { width:24px; height:24px; color:var(--blue); }
.cp-support-option:hover { background:#e8eff9; border-color:var(--blue); }
.cp-support-requester { margin:0 0 18px; font:400 13px/1.5 var(--font-display); color:var(--cp-muted); }
.cp-support-requester strong { color:var(--ink); font-weight:450; }
.cp-support-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:17px 20px; }
.cp-support-field { display:flex; flex-direction:column; gap:7px; min-width:0; font:400 13px var(--font-display); }
.cp-support-field.full { grid-column:1/-1; }
.cp-support-field :is(input,select,textarea),.cp-chat-composer textarea { width:100%; min-width:0; min-height:36px; padding:8px 10px; border:1px solid #cbd0c8; border-radius:4px; background:var(--cp-surface); color:var(--ink); font:400 13px/1.5 var(--font-display); }
.cp-support-field textarea { resize:vertical; min-height:120px; }
.cp-support-note { color:var(--cp-muted); font:400 12px/1.6 var(--font-display); }
.cp-support-error { color:var(--cp-red); font:400 13px/1.5 var(--font-display); }
.cp-support-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:8px; margin-top:18px; padding-top:16px; border-top:1px solid var(--cp-border); }
.cp-support-primary { background:var(--blue); border-color:var(--blue); color:#fff; }
.cp-support-primary:hover { background:#094ead; }
.cp-chat-status { display:flex; align-items:center; gap:7px; margin:0 0 12px; font:400 12px var(--font-display); color:var(--cp-amber); }
.cp-chat-status > span { width:6px; height:6px; border-radius:50%; background:var(--cp-amber); }
.cp-chat-log { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:220px; padding:24px; border-block:1px solid var(--cp-border); text-align:center; }
.cp-chat-log > svg { width:30px; height:30px; color:var(--cp-muted); }
.cp-chat-log p { margin:12px 0 0; }
.cp-chat-composer { display:flex; align-items:flex-end; gap:10px; margin-top:16px; }
.cp-chat-composer textarea { resize:none; flex:1; }
.cp-support-dialog :disabled { cursor:not-allowed; opacity:.6; }
.cp-ticket-created { display:flex; align-items:center; gap:8px; margin:0 0 14px; color:var(--cp-green); font:450 13px var(--font-display); }
#cp-ticket-subject { margin:0; font:500 16px/1.4 var(--font-display); overflow-wrap:anywhere; }
#cp-ticket-description { white-space:pre-wrap; overflow-wrap:anywhere; font:400 13px/1.6 var(--font-prose); }
@media(max-width:1280px) {
  .cp-layout { grid-template-columns:148px minmax(0,1fr); }
  .cp-main { padding:0 20px 18px; }
}
@media(max-width:1080px) {
  .cockpit-page { padding:16px; }
  .cockpit { height:min(768px,calc(100svh - 32px)); min-height:min(620px,calc(100svh - 32px)); }
  .cp-layout { grid-template-columns:65px minmax(0,1fr); }
  .cp-sidebar { padding:22px 9px; }
  .cp-nav button { justify-content:center; padding:12px; min-height:46px; position:relative; }
  .cp-nav button > span,.cp-nav-label,.cp-sidebar-bottom { display:none; }
  .cp-nav button svg { width:19px; height:19px; }
  .cockpit .cp-support-button { min-height:42px; padding:10px; }
  .cp-support-button > span { display:none; }
}
@media(min-width:761px) and (max-width:1000px) {
  .cp-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cp-overview-grid { grid-template-columns:1fr; grid-template-rows:auto auto; height:auto; }
  .cp-registry { max-height:380px; }
  .cp-insights { border-left:0; border-top:1px solid var(--cp-border); padding:18px 0 0; overflow:visible; }
}
@media(max-width:760px) {
  .cockpit-page { padding:12px; }
  .cockpit { --cp-agent-columns:32px minmax(0,1fr) 44px; --cp-agent-gap:10px; height:auto; min-height:calc(100svh - 24px); grid-template-rows:60px auto auto; overflow:visible; }
  .cp-titlebar { padding:0 16px; gap:16px; border-radius:8px 8px 0 0; }
  .cp-titlebar > img { width:106px; }
  .cp-product-name { font-size:14px; padding-left:16px; white-space:nowrap; }
  .cockpit .cp-avatar { width:40px; height:40px; margin-left:auto; }
  .cp-layout { display:flex; flex-direction:column; }
  .cp-sidebar { padding:10px; gap:5px; border-right:0; border-bottom:1px solid var(--cp-border); overflow:visible; }
  .cp-nav-label { display:block; padding-left:10px; }
  .cp-nav { flex-direction:row; overflow-x:auto; scrollbar-width:none; }
  .cp-nav button { min-width:max-content; min-height:43px; flex:1; padding:8px 10px; gap:7px; }
  .cp-nav button > span:not(.cp-nav-count) { display:inline; }
  .cp-nav button svg { width:15px; height:15px; }
  .cp-sidebar-footer { flex-direction:row; align-items:center; margin-top:8px; }
  .cockpit .cp-support-button { width:auto; flex:none; padding:8px 12px; }
  .cp-support-button > span { display:inline; }
  .cp-sidebar-footer .cp-sidebar-bottom { display:flex; min-width:0; padding:0; border:0; }
  .cp-main { display:block; padding:0 20px 20px; }
  .cp-toolbar { padding:22px 0 18px; align-items:flex-start; gap:12px; }
  .cp-toolbar > div:first-child { min-width:0; }
  .cp-toolbar h3 { font-size:22px; }
  .cp-icon-button { width:40px; height:40px; }
  .cp-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cp-panel { overflow:visible; padding-right:0; }
  .cp-overview-grid { grid-template-columns:1fr; grid-template-rows:auto auto; height:auto; gap:24px; }
  .cp-registry { max-height:none; }
  #overview-agents { flex:none; max-height:440px; padding-right:0; }
  .cp-insights { border-left:0; border-top:1px solid var(--cp-border); padding:18px 0 0; overflow:visible; }
  .cp-table-head { padding-inline:9px; }
  .cp-table-head span:nth-child(2) { display:none; }
  .cp-agent { min-height:100px; row-gap:0; padding:14px 9px; }
  .cp-agent-name { min-height:30px; display:flex; align-items:center; }
  .cp-agent-credits { grid-column:2; grid-row:2; text-align:left; margin-top:6px; }
  .cp-agent .cp-switch { grid-column:3; grid-row:1 / span 2; }
  .cp-switch { width:44px; height:44px; }
  .cp-switch::before { top:11px; left:4px; }
  .cp-switch::after { top:15px; left:8px; }
  .cp-chart-wrap { height:225px; }
  .cp-statusbar { flex-wrap:wrap; justify-content:flex-start; gap:6px 14px; padding:10px 15px; min-height:38px; border-radius:0 0 8px 8px; }
  #cockpit-notice { text-align:left; }
  .cp-search { max-width:none; flex-basis:100%; }
  .cockpit select { max-width:none; min-width:0; }
  .cp-directory-tools select { flex:1 1 200px; }
  #panel-agents,#panel-activity { display:block; overflow:visible; }
  .cp-full-registry .cp-table-head { position:static; }
  .cp-full-registry .cp-table-head span:nth-child(n+2):not(:last-child) { display:none; }
  .cp-full-registry { --cp-agent-columns:32px minmax(0,1fr) 44px; overflow:visible; padding-right:0; }
  .cp-full-registry .cp-agent { row-gap:6px; }
  .cp-full-registry .cp-agent-solution { grid-column:2; grid-row:2; }
  .cp-agent-trigger { grid-column:2; grid-row:3; }
  .cp-full-registry .cp-agent-credits { grid-row:4; margin-top:0; }
  .cp-full-registry .cp-agent-department { grid-column:2; grid-row:5; }
  .cp-full-registry .cp-agent .cp-switch { grid-row:1 / span 5; }
  .cp-event-badge { display:block; width:max-content; margin:5px 0 0; }
  .cp-activity-layout { grid-template-columns:1fr; gap:22px; }
  .cp-activity-log { flex:none; max-height:420px; }
  .cp-review-column { border-left:0; border-top:1px solid var(--cp-border); padding:18px 0 0; }
  #approval-queue { flex:none; max-height:380px; }
  .cp-action-button { min-height:42px; }
  .cp-detail-dialog { width:calc(100vw - 24px); max-height:calc(100svh - 24px); }
  .cp-detail-dialog .dialog-top { padding:20px; }
  .cp-detail-dialog h2 { font-size:20px; }
  #agent-detail-content,.cp-support-body { padding:20px; }
}
@media(max-width:600px) {
  .cp-agent-detail-columns { grid-template-columns:1fr; gap:24px; }
  .cp-detail-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cp-detail-metrics > div:last-child { grid-column:1/-1; }
}
@media(max-width:440px) {
  .cp-demo { display:none; }
  .cp-titlebar { padding:0 14px; gap:12px; }
  .cp-product-name { padding-left:12px; }
  .cp-main { padding:0 16px 18px; }
  .cp-toolbar { flex-wrap:wrap; padding:20px 0 16px; }
  .cp-toolbar > div:first-child { flex-basis:100%; }
  .cp-profile { right:8px; width:min(290px,calc(100vw - 42px)); }
  .cp-metrics > .cp-cost-metric,.cp-metrics > div:last-child { grid-column:1/-1; }
  .cp-detail-grid { grid-template-columns:1fr; }
  .cp-support-form-grid { grid-template-columns:1fr; }
  .cp-support-options { grid-template-columns:1fr; }
}
@media(max-width:360px) {
  .cp-metrics { grid-template-columns:minmax(0,1fr); }
}
@media(pointer:coarse) {
  .cp-icon-button { width:44px; height:44px; }
  .cp-action-button,.cp-inline { min-height:44px; }
  .cp-switch { min-height:44px; }
  .cockpit select,.cockpit input { min-height:44px; font-size:16px; }
  .cp-support-field :is(input,select,textarea) { min-height:44px; font-size:16px; }
}
@media(prefers-reduced-motion:reduce) {
  .cockpit-page *, .cockpit-page *::before,.cockpit-page *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}/* Agent directory: the filters sit on the same grid as the table, each above its own column.
   Toolbar padding = row padding (10px) + scrollbar gutter of the list (8px) on the right. */
@media(min-width:761px) {
  #panel-agents { --cp-directory-columns:32px minmax(220px,2.2fr) minmax(100px,1fr) minmax(110px,1fr) minmax(100px,1fr) minmax(120px,1fr) 72px; --cp-agent-gap:16px; }
  .cp-full-registry { --cp-agent-columns:var(--cp-directory-columns); }
  .cp-full-registry .cp-agent .cp-switch { justify-self:center; }
  .cp-full-registry .cp-table-head span:last-child { text-align:center; }
}
/* Language model logos (Copilot, Claude) */
.cp-llm-logo { width:14px; height:14px; object-fit:contain; flex-shrink:0; }
.cp-name-llm { display:inline-flex; margin-left:6px; vertical-align:-2px; }
.cp-llm-stack { display:inline-flex; gap:4px; margin-top:1px; }
.cp-llm-chip { display:grid; place-items:center; width:20px; height:20px; border:1px solid var(--cp-border); border-radius:50%; background:var(--cp-surface); opacity:.45; filter:grayscale(1); transition:opacity .18s,filter .18s,box-shadow .18s; }
.cp-llm-chip[data-active='true'] { opacity:1; filter:none; box-shadow:0 0 0 2px #0d5bc926; }
/* An agent with more than one version folds open; the versions sit indented under it */
.cp-family-toggle { display:inline-flex; align-items:center; gap:5px; cursor:pointer; }
.cp-family-toggle svg { width:14px; height:14px; color:var(--cp-muted); transition:transform .2s ease; }
.cp-family-toggle[aria-expanded='true'] svg { transform:rotate(90deg); }
.cp-family-variants { display:grid; grid-template-rows:0fr; transition:grid-template-rows .22s ease; }
.cp-family-variants > div { min-height:0; overflow:hidden; visibility:hidden; transition:visibility 0s .22s; }
.cp-agent-group[data-expanded='true'] .cp-family-variants { grid-template-rows:1fr; }
.cp-agent-group[data-expanded='true'] .cp-family-variants > div { visibility:visible; transition:visibility 0s; }
.cp-agent-group[data-expanded='true'] > .cp-agent-family { border-bottom-color:transparent; }
.cp-agent-variant { min-height:56px; padding-left:24px; background:var(--cp-soft); box-shadow:inset 3px 0 0 var(--agent-tint); }
.cp-agent-variant .cp-agent-icon { width:24px; height:24px; background:var(--cp-surface); }
.cp-agent-variant .cp-agent-name { font-weight:500; }
/* Some versions on, some off */
.cp-switch[aria-checked='mixed']::before { background:linear-gradient(90deg,var(--blue) 50%,#c2c9c0 50%); }
.cp-switch[aria-checked='mixed']::after { transform:translateX(7px); }
@media(prefers-reduced-motion:reduce) {
  .cp-family-variants,.cp-family-variants > div,.cp-family-toggle svg,.cp-llm-chip { transition:none; }
}
.cp-family-summary { display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.cp-family-summary .cp-llm-chip { width:18px; height:18px; }
@media(max-width:760px) { .cp-agent-family .cp-agent-trigger:empty,.cp-agent-family .cp-agent-credits:empty,.cp-agent-family .cp-agent-department:empty { display:none; } }
/* Covered by a licence: compact badge instead of a price (from Peicheng's 1.1.0) */
.cp-covered { display:inline-flex; align-items:center; gap:5px; padding:3px 9px 3px 7px; border:1px solid var(--cp-border); border-radius:999px; background:var(--cp-soft); color:var(--cp-green); cursor:help; white-space:nowrap; }
.cp-covered:focus-visible { outline:2px solid var(--cp-green); outline-offset:2px; }
.cp-covered strong { font-size:13px; font-weight:450; color:var(--ink); }
.cp-covered .cp-covered-logo { width:16px; height:16px; }
.cp-covered [data-lucide], .cp-covered svg { width:15px; height:15px; }
.cp-agent-solution { min-width:0; display:flex; align-items:center; }
.cp-agent-solution .cp-llm-label { font-weight:450; }

/* Icons respond to the pointer: a small lift and grow when the row or tile is hovered or focused. */
.cp-agent-icon, .cp-agent-icon svg, .cp-llm-logo, .cp-covered-logo { transition:transform .18s ease, box-shadow .18s ease; }
.cp-agent:hover .cp-agent-icon, .cp-agent:focus-within .cp-agent-icon { transform:translateY(-1px) scale(1.08); box-shadow:0 2px 6px rgba(28,44,36,.12); }
.cp-agent:hover .cp-agent-icon svg, .cp-agent:focus-within .cp-agent-icon svg { transform:scale(1.06); }
.cp-agent:hover .cp-llm-logo, .cp-agent:hover .cp-covered-logo { transform:scale(1.1); }
@media(prefers-reduced-motion:reduce) {
  .cp-agent-icon, .cp-agent-icon svg, .cp-llm-logo, .cp-covered-logo { transition:none; }
  .cp-agent:hover .cp-agent-icon, .cp-agent:focus-within .cp-agent-icon, .cp-agent:hover .cp-agent-icon svg, .cp-agent:focus-within .cp-agent-icon svg, .cp-agent:hover .cp-llm-logo, .cp-agent:hover .cp-covered-logo { transform:none; }
}


/* Agent details: the on/off switch sits right under the agent's name. */
.cp-detail-toggle-row { display:flex; align-items:center; gap:10px; margin:-6px 0 14px; }

/* Navigation: a soft "bubble" on hover for the whole item, and a small move per icon. */
.cp-nav button { transition:transform .28s cubic-bezier(.34,1.56,.64,1), background-color .2s ease, box-shadow .2s ease; }
.cp-nav button:hover { transform:scale(1.03); box-shadow:0 2px 8px rgba(9,79,174,.10); }
.cp-nav button[aria-selected='false']:hover { background:#eef3fa; }
.cp-nav button[aria-selected='true']:hover { background:#d8e5f6; }
.cp-nav button:active { transform:scale(.98); }
.cp-nav svg, .cp-nav svg * { transform-box:fill-box; transform-origin:center; }
/* Overview: the icon turns a quarter to the right while the four tiles shuffle a little. */
.cp-nav .lucide-layout-dashboard { transition:transform .45s cubic-bezier(.34,1.56,.64,1); }
.cp-nav button:hover .lucide-layout-dashboard { transform:rotate(90deg); }
.cp-nav button:hover .lucide-layout-dashboard rect:nth-child(1) { animation:cp-tile-a .55s ease; }
.cp-nav button:hover .lucide-layout-dashboard rect:nth-child(2) { animation:cp-tile-b .55s ease; }
.cp-nav button:hover .lucide-layout-dashboard rect:nth-child(3) { animation:cp-tile-c .55s ease; }
.cp-nav button:hover .lucide-layout-dashboard rect:nth-child(4) { animation:cp-tile-d .55s ease; }
@keyframes cp-tile-a { 50% { transform:translate(1.5px,1.5px) scale(.9); } }
@keyframes cp-tile-b { 50% { transform:translate(-1.5px,1.5px) scale(.9); } }
@keyframes cp-tile-c { 50% { transform:translate(-1.5px,-1.5px) scale(.9); } }
@keyframes cp-tile-d { 50% { transform:translate(1.5px,-1.5px) scale(.9); } }
/* Agents: the robot grows a little, opens its eyes and blinks, the antenna wiggles. */
.cp-nav .lucide-bot { transition:transform .28s cubic-bezier(.34,1.56,.64,1); }
.cp-nav button:hover .lucide-bot { transform:scale(1.15); }
.cp-nav .lucide-bot path:nth-child(5), .cp-nav .lucide-bot path:nth-child(6) { transition:stroke-width .2s ease; }
.cp-nav button:hover .lucide-bot path:nth-child(5), .cp-nav button:hover .lucide-bot path:nth-child(6) { stroke-width:3.2; animation:cp-blink .6s ease .25s; }
.cp-nav button:hover .lucide-bot path:nth-child(1) { animation:cp-wiggle .5s ease; }
@keyframes cp-blink { 0%, 100% { transform:scaleY(1); } 50% { transform:scaleY(.15); } }
@keyframes cp-wiggle { 25% { transform:rotate(-12deg); } 75% { transform:rotate(12deg); } }
/* Activity: the heartbeat line is drawn again from left to right, like a pulse (the path itself starts on the right). */
.cp-nav button:hover .lucide-activity path { stroke-dasharray:100; animation:cp-pulse .8s ease-out; }
@keyframes cp-pulse { from { stroke-dashoffset:-100; } to { stroke-dashoffset:0; } }
/* Agent setup: the two linked boxes turn once by 90 degrees. */
.cp-nav .lucide-workflow { transition:transform .45s cubic-bezier(.34,1.56,.64,1); }
.cp-nav button:hover .lucide-workflow { transform:rotate(90deg); }
/* Blue primary buttons get the same bubble. */
.runtime-primary { transition:transform .28s cubic-bezier(.34,1.56,.64,1), box-shadow .2s ease; }
.runtime-primary:not(:disabled):hover { transform:scale(1.03); box-shadow:0 2px 8px rgba(9,79,174,.18); }
.runtime-primary:not(:disabled):active { transform:scale(.98); }
@media(prefers-reduced-motion:reduce) {
  .cp-nav button, .cp-nav .lucide-bot, .cp-nav .lucide-workflow, .cp-nav .lucide-layout-dashboard, .runtime-primary { transition:none; }
  .cp-nav button:hover, .cp-nav button:hover .lucide-bot, .cp-nav button:hover .lucide-workflow, .cp-nav button:hover .lucide-layout-dashboard, .runtime-primary:hover { transform:none; }
  .cp-nav button:hover svg * { animation:none; }
}
/* Agent directory: background agents (one row per task) and chat assistants */
#panel-agents { display:flex; flex-direction:column; }
.cp-directory-head { display:flex; align-items:center; gap:12px 16px; margin-bottom:14px; flex-wrap:wrap; }
.cp-directory-head .cp-kind-tabs { margin-left:auto; }
.cp-directory-head h4 { margin:0; font:500 16px var(--font-display); }
.cp-kind-tabs { display:inline-flex; border:1px solid #d3d8d1; border-radius:6px; overflow:hidden; }
.cockpit .cp-kind-tabs button { border:0; background:transparent; padding:6px 13px; font-size:12.5px; color:#5f6662; cursor:pointer; }
.cockpit .cp-kind-tabs button + button { border-left:1px solid #d3d8d1; }
.cockpit .cp-kind-tabs button[aria-pressed='true'] { background:#e2ebf7; color:#094fae; font-weight:500; }
.cp-kind-tabs span { color:inherit; opacity:.75; margin-left:2px; }
#directory-background { display:flex; flex-direction:column; min-height:0; flex:1; }
.cp-chips { display:flex; flex-wrap:wrap; gap:6px; flex:0 1 auto; }
.cockpit .cp-chip { display:inline-flex; align-items:center; gap:6px; min-height:30px; padding:4px 11px; border:1px solid #d3d8d1; border-radius:20px; background:var(--cp-surface); color:#4f5552; font-size:12px; cursor:pointer; }
.cockpit .cp-chip:hover { border-color:#a9b8cc; }
.cockpit .cp-chip[aria-pressed='true'] { border-color:var(--blue); background:#f2f6fc; color:#094fae; }
.cp-chip span { color:#8b928c; }
.cp-chip .cp-llm-logo, .cp-chip svg { width:14px; height:14px; }
.cp-assistants { display:grid; grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); gap:14px; align-content:start; overflow-y:auto; min-height:0; }
.cp-assistant { display:flex; flex-direction:column; border:1px solid var(--cp-border); border-radius:8px; background:var(--cp-surface); }
.cp-assistant-top { display:flex; gap:13px; padding:16px 16px 10px; }
.cp-assistant-icon { display:grid; place-items:center; width:42px; height:42px; flex-shrink:0; border-radius:10px; background:#eaf1fb; color:var(--blue); }
.cp-assistant:nth-child(2n) .cp-assistant-icon { background:#edf4ef; color:#46715b; }
.cp-assistant-icon svg { width:21px; height:21px; }
.cp-assistant h5 { display:flex; align-items:center; gap:8px; margin:0; font:500 15px var(--font-display); }
.cp-assistant-top p { margin:3px 0 0; color:#4f5552; line-height:1.4; }
.cp-assistant-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:auto; padding:10px 16px 14px; }
.cp-teams-button, .cp-copilot-button { display:inline-flex; align-items:center; gap:7px; min-height:34px; padding:7px 13px; border-radius:5px; font:500 12.5px var(--font-display); text-decoration:none; }
.cp-teams-button { background:#4b53bc; color:#fff; border:1px solid #4b53bc; }
.cp-teams-button:hover { background:#3d449e; }
.cp-teams-button svg { width:15px; height:15px; }
.cp-copilot-button { border:1px solid #cbd0c8; color:#2b3030; background:var(--cp-surface); }
.cp-copilot-button:hover { border-color:#a9b8cc; }
/* Directory filters: search on the left, the three selects on the right, all 36px high. */
#panel-agents .cp-directory-tools { display:flex; align-items:center; gap:12px; margin:0 0 12px; }
#panel-agents .cp-search { flex:0 1 280px; max-width:280px; }
#panel-agents .cp-directory-tools select { flex:0 0 160px; width:160px; max-width:none; height:36px; min-height:36px; }
#panel-agents #directory-count { display:none; }
.cp-full-registry .cp-agent { min-height:64px; }
.cp-full-registry .cp-table-head { padding-top:8px; padding-bottom:8px; }
@media(max-width:760px) { #panel-agents .cp-directory-tools { flex-wrap:wrap; } #panel-agents .cp-search { flex:1 1 100%; max-width:none; } #panel-agents .cp-directory-tools select { flex:1 1 140px; } }
.cp-titlebar .cp-avatar { margin-left:auto; }
.cp-titlebar .cp-demo:not([hidden]) ~ .cp-avatar { margin-left:0; }
#directory-chat { flex:1; min-height:0; overflow-y:auto; padding-right:8px; }
.cp-assistants { overflow:visible; }
.cp-assistant-top { padding:18px 18px 14px; }
.cp-assistant-actions { padding:4px 18px 18px; margin-top:auto; }
.cp-assistant-auto { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 18px 14px; padding:8px 4px 8px 12px; border-top:1px solid #eef0ec; border-bottom:1px solid #eef0ec; font-size:12.5px; color:#3e4441; }
.cockpit .cp-sort { display:inline-flex; align-items:center; gap:5px; padding:0; border:0; background:none; color:inherit; font:inherit; cursor:pointer; }
.cockpit .cp-sort:hover { color:var(--blue); }
.cp-sort svg { width:14px; height:14px; }
.cp-sort[data-active='true'] { color:var(--ink); font-weight:500; }
.cp-sort[data-active='false'] svg { opacity:.45; }
.cp-full-registry .cp-table-head span:nth-child(4) .cp-sort { flex-direction:row; }
.cp-full-registry .cp-table-head span:last-child .cp-sort { justify-content:center; }
#panel-agents #agent-trigger-filter { margin-left:auto; margin-right:18px; }
@media(max-width:760px) { #panel-agents #agent-trigger-filter { margin-left:0; margin-right:0; } }
/* Overview: the same columns as the Agents tab, packed tighter. */
#overview-agents { --cp-agent-columns:26px minmax(0,1.7fr) minmax(64px,.8fr) minmax(76px,.9fr) minmax(62px,.75fr) minmax(70px,.85fr) 44px; --cp-agent-gap:8px; }
#overview-agents .cp-table-head { font-size:11.5px; padding:7px 8px; }
#overview-agents .cp-table-head span:nth-child(2), #overview-agents .cp-table-head span:nth-child(3), #overview-agents .cp-table-head span:nth-child(5) { text-align:left; }
#overview-agents .cp-table-head span:nth-child(4) { text-align:right; }
#overview-agents .cp-table-head span:last-child { text-align:center; }
#overview-agents .cp-agent { min-height:56px; padding:7px 8px; font-size:12px; }
#overview-agents .cp-agent-icon { width:26px; height:26px; }
#overview-agents .cp-agent-icon svg { width:15px; height:15px; }
#overview-agents .cp-agent-name { font-size:12.5px; }
#overview-agents .cp-agent-summary { font-size:11.5px; -webkit-line-clamp:1; }
#overview-agents .cp-llm-label, #overview-agents .cp-trigger-label { font-size:11.5px; gap:4px; }
#overview-agents .cp-llm-label svg, #overview-agents .cp-trigger-label svg, #overview-agents .cp-llm-logo { width:12px; height:12px; }
#overview-agents .cp-agent-credits strong { font-size:13px; }
#overview-agents .cp-agent-credits > span { font-size:11px; }
#overview-agents .cp-agent .cp-switch { justify-self:center; transform:scale(.85); }
@media(max-width:760px) { #overview-agents .cp-table-head span:nth-child(n+2):not(:last-child) { display:none; } }
#overview-agents .cp-agent-name { display:block; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-align:left; }
#overview-agents .cp-agent-department .cp-trigger-label { display:flex; min-width:0; }
#overview-agents .cp-agent-department .cp-trigger-label, #overview-agents .cp-agent-department { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#overview-agents .cp-agent-credits > span { display:none; }