.hux-autonomy {
  color: var(--hermes-text, #e8edf7);
  display: grid;
  gap: 1rem;
}

.hux-autonomy > header {
  align-items: center;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
}

.hux-autonomy h2,
.hux-autonomy h3 {
  align-items: center;
  display: flex;
  gap: 0.45rem;
  margin: 0;
}

.hux-autonomy form {
  display: grid;
  gap: 1rem;
}

.hux-autonomy fieldset,
.hux-autonomy-approvals,
.hux-autonomy-receipt {
  border: 1px solid color-mix(in srgb, var(--hermes-accent, #32d6d2) 30%, transparent);
  border-radius: 0.8rem;
  padding: 1rem;
}

.hux-autonomy-levels {
  display: grid;
  gap: 0.65rem;
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
}

.hux-autonomy-levels label {
  align-items: start;
  background: color-mix(in srgb, var(--hermes-panel, #121a27) 90%, transparent);
  border-radius: 0.6rem;
  display: flex;
  gap: 0.55rem;
  padding: 0.75rem;
}

.hux-autonomy-levels small,
.hux-autonomy-approvals small {
  display: block;
  opacity: 0.76;
}

.hux-autonomy-matrix table {
  border-collapse: collapse;
  width: 100%;
}

.hux-autonomy-matrix th,
.hux-autonomy-matrix td {
  border-block-start: 1px solid rgb(255 255 255 / 8%);
  padding: 0.5rem;
  text-align: start;
}

.hux-autonomy-budgets > div {
  display: grid;
  gap: 0.7rem;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
}

.hux-autonomy-budgets label {
  display: grid;
  gap: 0.3rem;
}

.hux-autonomy input,
.hux-autonomy select,
.hux-autonomy button {
  font: inherit;
}

.hux-autonomy input,
.hux-autonomy select {
  background: var(--hermes-input, #0d1420);
  border: 1px solid rgb(255 255 255 / 18%);
  border-radius: 0.4rem;
  color: inherit;
  padding: 0.45rem;
}

.hux-autonomy button {
  border-radius: 0.5rem;
  cursor: pointer;
  padding: 0.55rem 0.8rem;
}

.hux-autonomy-stop {
  align-items: center;
  background: #9e2638;
  border: 2px solid #ff6c7d;
  color: white;
  display: inline-flex;
  font-weight: 700;
  gap: 0.4rem;
}

.hux-autonomy-save {
  justify-self: end;
}

.hux-autonomy-approvals ol {
  display: grid;
  gap: 0.75rem;
  list-style: none;
  padding: 0;
}

.hux-autonomy-approvals li {
  background: rgb(255 255 255 / 4%);
  border-inline-start: 3px solid var(--hermes-accent, #32d6d2);
  padding: 0.75rem;
}

.hux-autonomy-approvals li[data-risk="high"] {
  border-inline-start-color: #ff6c7d;
}

.hux-autonomy-approvals li > div {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-block-start: 0.65rem;
}

.hux-autonomy-warning {
  color: #ffd479;
}

.hux-autonomy :focus-visible {
  outline: 3px solid var(--hermes-focus, #71f7ef);
  outline-offset: 2px;
}

.hux-autonomy button:disabled,
.hux-autonomy input:disabled,
.hux-autonomy select:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

@media (max-width: 44rem) {
  .hux-autonomy > header {
    align-items: stretch;
    flex-direction: column;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hux-autonomy * {
    scroll-behavior: auto;
  }
}