.ai-status-card {
  border-color: color-mix(in srgb, #3d5afe 28%, var(--line));
  background: linear-gradient(135deg, rgba(61, 90, 254, 0.12), var(--surface) 58%);
}

.ops-grid {
  grid-template-columns: 1.1fr repeat(4, minmax(0, 1fr));
}

.ai-status-card strong {
  color: #1f3fb5;
}

.ai-chipline {
  grid-column: 2 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid var(--line);
  background: #f8faf5;
  font-family: var(--mono);
  font-size: 0.74rem;
}

.ai-chipline strong {
  color: var(--accent);
}

.ai-chipline span {
  color: var(--muted);
}

.ai-chipline.buy {
  border-color: color-mix(in srgb, var(--accent) 40%, var(--line));
}

.ai-chipline.wait {
  border-color: color-mix(in srgb, var(--warn) 42%, var(--line));
}

.ai-chipline.skip {
  border-color: color-mix(in srgb, var(--danger) 38%, var(--line));
}

.ai-decision-stack {
  display: grid;
  gap: 8px;
}

.ai-card {
  padding: 12px;
  border: 1px solid var(--line);
  background: var(--surface-2);
}

.ai-card.buy {
  border-color: color-mix(in srgb, var(--accent) 44%, var(--line));
  background: #f7faed;
}

.ai-card.wait {
  border-color: color-mix(in srgb, var(--warn) 42%, var(--line));
}

.ai-card.skip {
  border-color: color-mix(in srgb, var(--danger) 38%, var(--line));
}

.ai-card > div {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: start;
}

.ai-card > div span {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 0.76rem;
  font-weight: 800;
  white-space: nowrap;
}

.ai-card dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 6px 10px;
  margin: 10px 0 0;
}

.ai-card p {
  margin: 9px 0 0;
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.45;
}

@media (max-width: 720px) {
  .ai-chipline {
    grid-column: auto;
  }
}