.suite-toolbar {
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 9px;
}
.suite-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 330px), 1fr));
  gap: 20px;
}
.suite-grid > h2,
.suite-grid > .muted,
.suite-grid > .suite-summary,
.suite-grid > .empty {
  grid-column: 1/-1;
}
.suite-grid > h2 {
  padding-top: 22px;
  border-top: 1px solid var(--line);
  margin: 18px 0 0;
}
.suite-card {
  border-top: 2px solid var(--gold);
}
.suite-balance {
  font: 36px var(--serif);
  color: var(--gold);
}
.suite-summary {
  background: var(--panel) url("./assets/wolf-contour-corner-tr.png") right
    top/160px no-repeat;
  padding: 24px;
  border: 1px solid var(--line);
}
.suite-editor fieldset {
  background: var(--bg);
}
.suite-editor select[multiple] {
  min-height: 120px;
}
.suite-editor [hidden] {
  display: none;
}
.suite-editor .actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.suite-root input,
.suite-root textarea,
.suite-root select,
.suite-editor input,
.suite-editor textarea,
.suite-editor select {
  max-width: 100%;
}
@media (max-width: 650px) {
  .suite-toolbar {
    display: grid;
    grid-template-columns: 1fr;
  }
  .suite-grid {
    grid-template-columns: 1fr;
  }
  .suite-toolbar button {
    white-space: normal;
    text-align: left;
  }
}