.status.online,
.status.ready,
.status.approved,
.status.provisioned,
.status.published { border-color: #617046; background: rgba(97, 112, 70, .2); color: #bacb91; }

.status.offline,
.status.stopped,
.status.denied,
.status.failed { border-color: #75463e; background: rgba(117, 70, 62, .2); color: #dda095; }

.status.starting,
.status.submitted,
.status.under_review,
.status.provisioning,
.status.restarting,
.status.stopping,
.status.configuring,
.status.updating { border-color: #7d682f; background: rgba(176, 144, 61, .16); color: #d2bb78; }

.status.stale,
.status.unknown,
.status.expired,
.status.draft { border-color: var(--line); background: rgba(137, 137, 137, .1); color: var(--steel); }

.instance-admin-list { display: grid; gap: 18px; }
.instance-editor { padding-top: 24px; border-top: 1px solid var(--line); }
.instance-editor-heading,
.instance-actions,
.instance-toggles,
.instance-readout { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.instance-editor-heading h3 { margin: 8px 0 0; font-size: 24px; }
.instance-editor-heading small,
.instance-readout span { color: var(--steel); font: 10px DM Mono, monospace; text-transform: uppercase; }
.instance-readout b { font-size: 22px; }
.instance-fields { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 22px 0; }
.instance-fields .wide-field { grid-column: 1 / -1; }
.instance-toggles { flex-wrap: wrap; justify-content: flex-start; }
.instance-buttons { display: flex; gap: 10px; }
.danger-button { border-color: var(--red); color: var(--red); }
.danger-button:hover { background: rgba(192, 106, 92, .08); }

@media (max-width: 760px) {
  .instance-fields { grid-template-columns: 1fr; }
  .instance-editor-heading,
  .instance-actions { align-items: flex-start; flex-direction: column; }
}