.automation {
  margin: 0 0 22px;
  padding: 17px;
  border: 1px solid #a9dbe4;
  border-radius: 12px;
  background: linear-gradient(145deg, #effbfc, #f8fcfd);
}
.automation-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}
.automation-head .eyebrow { margin: 0 0 5px; color: #087d92; }
.automation-head h3 { margin: 0; }
.automation-state {
  display: inline-flex;
  padding: 5px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 750;
  white-space: nowrap;
}
.automation-state.current { background: #dff4eb; color: #1c7453; }
.automation-state.missing { background: #fee9df; color: #a44b31; }
.automation-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
  margin: 15px 0;
}
.automation-facts > div {
  padding: 10px;
  border: 1px solid #d7e9ed;
  border-radius: 8px;
  background: #fff;
}
.automation-facts span { display: block; color: #698493; font-size: 10px; }
.automation-facts strong { display: block; margin-top: 4px; font-size: 12px; overflow-wrap: anywhere; }
.automation-lines { max-height: 230px; overflow: auto; }
.automation-lines table { margin: 0; }
@media (max-width: 720px) {
  .automation-head { display: block; }
  .automation-state { margin-top: 9px; }
  .automation-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}