/* Agent operations (Launchpad v9 P2, #/agentops). Builds on v9.css (.cc-* tokens and components); only what this page
   adds: the tile row, the small-multiple grids, the heat grids, the hold-reason bars. Theme tokens only. */
.ao-tiles { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--v9-2); }
.ao-tile { background: var(--v9-card); border: 1px solid var(--v9-line); box-shadow: var(--v9-shadow); border-radius: var(--v9-r); padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ao-tile b { font: 600 24px/1.1 'Instrument Sans', system-ui, sans-serif; letter-spacing: -.01em; }
.ao-tile b.nm { font: 600 15px/1.6 'Instrument Sans', system-ui, sans-serif; color: var(--v9-mute); }
.ao .v8-of { font: var(--v9-f-small); color: var(--v9-mute); font-weight: 500; letter-spacing: 0; }
.ao-why { font: var(--v9-f-small); color: var(--v9-mute); }
.ao-sum { display: flex; gap: var(--v9-5); flex-wrap: wrap; margin-bottom: var(--v9-3); }
.ao-sum > div b { display: block; font: 600 20px/1.15 'Instrument Sans', system-ui, sans-serif; }
.ao-sum > div span { color: var(--v9-mute); font: var(--v9-f-small); }
.ao-sm { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--v9-4) var(--v9-5); }
.ao-sm.ao-sm3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ao-sm h3 { margin: 0 0 4px; font: 600 12.5px/1.3 'Instrument Sans', system-ui, sans-serif; color: var(--v9-ink2); display: flex; justify-content: space-between; gap: 6px; }
.ao-sm h3 b { color: var(--v9-ink); }
.ao-heat { margin-top: 2px; }
.ao-bars { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.ao-bars li { display: grid; grid-template-columns: minmax(80px, 140px) minmax(0, 1fr) auto; gap: 10px; align-items: center; font: var(--v9-f-small); }
.ao-bars .l { color: var(--v9-ink2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ao-bars .t { height: 10px; border-radius: 4px; background: var(--v9-track); overflow: hidden; }
.ao-bars .t i { display: block; height: 100%; border-radius: 4px; }
.ao-bars b { font-variant-numeric: tabular-nums; text-align: right; }
.ao-rates { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: var(--v9-4); }
.ao-rates .cc-note { margin: 0; }
.ao-rates .cc-chip b { color: var(--v9-ink); font-weight: 650; }
.ao-lede { margin-top: 0; } .ao-lede b { color: var(--v9-ink); font-size: 15px; }
.ao-btn { background: none; border: 0; padding: 6px 0 0; cursor: pointer; }
.ao-mute { color: var(--v9-mute); font-size: 12px !important; font-weight: 500 !important; }
.ao-nm { font-style: normal; }
.ao .cc-head .cc-chip { white-space: normal; }
@media (max-width: 900px) { .ao-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ao .cc-span-6 { grid-column: span 6; }
@media (max-width: 1100px) { .ao .cc-span-6 { grid-column: span 12; } }
@media (max-width: 640px) {
  .ao-tile { padding: 10px 12px; } .ao-tile b { font-size: 20px; }
  .ao-sm, .ao-sm.ao-sm3 { grid-template-columns: minmax(0, 1fr); gap: var(--v9-3); }
  .ao-sum { gap: var(--v9-3); } .ao-sum > div b { font-size: 17px; }
}
/* The agent engine (A16): the agent rows (name, kit Bar, figure), the window toggle. */
.ao-engine-h { display: flex; align-items: center; gap: var(--v9-3); flex-wrap: wrap; margin-bottom: var(--v9-3); }
.ao-seg { display: inline-flex; gap: 4px; }
.ao-agents { list-style: none; margin: 0 0 var(--v9-3); padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px var(--v9-5); }
.ao-agents li { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(60px, 1fr) auto; gap: 10px; align-items: center; font: var(--v9-f-small); min-height: 24px; }
.ao-agents .n { display: flex; align-items: center; gap: 6px; min-width: 0; }
.ao-agents .n b { font-weight: 600; color: var(--v9-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ao-agents .v { font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.ao-kinds { grid-template-columns: minmax(0, 1fr); }
.ao [data-drill] { cursor: pointer; }
@media (max-width: 900px) { .ao-agents { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) { .ao-agents li { grid-template-columns: minmax(0, 1fr) 56px auto; gap: 8px; } .ao-agents:not(.ao-kinds) .v .v8-of { display: none; } }