/* <StatusChips> layout. Colours all come from Badge/Dropdown's own CSS
   (@hive/shared) — nothing here overrides a base16 slot. */
.status-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5em;
}
.status-chip-anchor {
  position: relative;
  display: inline-block;
}
/* mara, live, on a screenshot of this row: "badges and interactive
   elements on same row have inconsistent size." Real cause: Badge.css's
   `.ui-badge-interactive` grows to a 2.75em WCAG touch-target floor
   (model/effort pickers, pause) while a plain display `<span>` badge
   (alive, state, ctx, cost — no `onClick`) stays compact, so the row
   reads as two different pill sizes even though every badge here is
   the same `<Badge>` component. Scoped to this row rather than
   Badge.css itself — display-only badges elsewhere (e.g. the dashboard)
   have no reason to grow, this is specifically about badges and
   buttons sitting side by side in one row needing to read as one
   family. */
.status-chips .ui-badge {
  min-height: 2.75em;
  padding-inline: 0.8em;
}
.status-chips-last-turn {
  font-size: 0.8em;
  color: var(--muted);
}