.generation-dialog {
  width: min(90rem, calc(100% - 2rem));
}

.generation-panel {
  display: grid;
  gap: 1rem;
  min-width: 0;
  max-height: calc(100vh - 2rem);
  overflow: auto;
}

.generation-disclaimer,
.generation-unavailable,
.generation-status,
.generation-summary,
.generation-coverage,
.generation-cases,
.generation-discarded {
  border: 1px solid var(--toolbox-border);
  border-radius: calc(var(--toolbox-radius) * 0.82);
  background: color-mix(
    in srgb,
    var(--toolbox-surface) 94%,
    var(--toolbox-accent) 6%
  );
}

.generation-disclaimer {
  margin: 0;
  padding: 0.8rem 0.95rem;
  color: var(--toolbox-muted);
}

.generation-unavailable {
  display: grid;
  gap: 0.35rem;
  padding: 1rem;
}

.generation-unavailable span {
  color: var(--toolbox-muted);
}

.generation-settings {
  display: grid;
  gap: 0.8rem;
  padding: 1rem;
  border: 1px solid var(--toolbox-border);
  border-radius: calc(var(--toolbox-radius) * 0.82);
  background: var(--toolbox-surface);
}

.generation-settings-primary,
.generation-settings-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.7rem;
}

.generation-settings label {
  display: grid;
  gap: 0.3rem;
  min-width: 0;
  color: var(--toolbox-muted);
  font-size: 0.82rem;
  font-weight: 700;
}

.generation-settings input {
  min-width: 0;
  width: 100%;
}

.generation-settings details {
  border-top: 1px solid var(--toolbox-border);
  padding-top: 0.65rem;
}

.generation-settings details summary,
.generation-discarded summary,
.generation-coverage details summary {
  cursor: pointer;
  font-weight: 750;
}

.generation-settings details[open] summary {
  margin-bottom: 0.65rem;
}

.generation-run-actions,
.generation-case-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem;
}

.generation-run-actions small {
  color: var(--toolbox-muted);
}

.generation-status {
  display: grid;
  gap: 0.4rem;
  padding: 0.75rem 0.9rem;
}

.generation-status.is-error {
  border-color: color-mix(
    in srgb,
    var(--toolbox-danger) 55%,
    var(--toolbox-border)
  );
}

.generation-status progress {
  width: 100%;
}

.generation-status span {
  color: var(--toolbox-muted);
  font-size: 0.82rem;
}

.generation-results {
  display: grid;
  gap: 1rem;
}

.generation-summary,
.generation-coverage,
.generation-cases,
.generation-discarded {
  padding: 1rem;
}

.generation-summary dl {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.55rem;
  margin: 0;
}

.generation-summary dl > div {
  min-width: 0;
  padding: 0.65rem;
  border-radius: calc(var(--toolbox-radius) * 0.68);
  background: var(--toolbox-surface-soft);
}

.generation-summary dt {
  color: var(--toolbox-muted);
  font-size: 0.75rem;
  font-weight: 750;
  text-transform: uppercase;
}

.generation-summary dd {
  overflow-wrap: anywhere;
  margin: 0.2rem 0 0;
}

.generation-warnings {
  margin: 0.75rem 0 0;
  color: var(--toolbox-muted);
}

.generation-coverage > header,
.generation-cases > header {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 1rem;
  margin-bottom: 0.75rem;
}

.generation-coverage h3,
.generation-cases h3 {
  margin: 0;
}

.generation-coverage > ul,
.unsupported-generation-list,
.generated-case-list,
.generation-discarded ul {
  display: grid;
  gap: 0.55rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.generation-coverage > ul > li {
  display: grid;
  grid-template-columns: 7.5rem minmax(9rem, 0.45fr) minmax(0, 1fr);
  align-items: start;
  gap: 0.55rem;
  padding: 0.6rem;
  border-radius: calc(var(--toolbox-radius) * 0.68);
  background: var(--toolbox-surface-soft);
}

.generation-coverage .status {
  justify-self: start;
}

.generation-coverage details {
  margin-top: 0.8rem;
}

.unsupported-generation-list {
  margin-top: 0.65rem;
}

.unsupported-generation-list li,
.generation-discarded li {
  display: grid;
  grid-template-columns: minmax(10rem, 0.35fr) minmax(8rem, 0.25fr) minmax(
      0,
      1fr
    );
  gap: 0.6rem;
  align-items: start;
  padding: 0.55rem;
  border-radius: calc(var(--toolbox-radius) * 0.68);
  background: var(--toolbox-surface-soft);
}

.unsupported-generation-list code,
.generation-discarded code {
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.generated-case-list li {
  display: grid;
  gap: 0.5rem;
  min-width: 0;
  padding: 0.7rem;
  border: 1px solid var(--toolbox-border);
  border-radius: calc(var(--toolbox-radius) * 0.68);
  background: var(--toolbox-surface-soft);
}

.generated-case-list label {
  display: flex;
  align-items: start;
  gap: 0.55rem;
}

.generated-case-list label span {
  display: grid;
  gap: 0.15rem;
}

.generated-case-list small {
  color: var(--toolbox-muted);
}

.generated-case-list > li > code {
  display: block;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.generation-feature-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.generation-feature-chips span {
  padding: 0.2rem 0.45rem;
  border: 1px solid var(--toolbox-border);
  border-radius: 999px;
  color: var(--toolbox-muted);
  font-size: 0.72rem;
}

.generation-discarded > p {
  color: var(--toolbox-muted);
}

.generation-discarded[open] summary {
  margin-bottom: 0.5rem;
}

@media (max-width: 900px) {
  .generation-settings-primary,
  .generation-settings-grid,
  .generation-summary dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .generation-coverage > ul > li,
  .unsupported-generation-list li,
  .generation-discarded li {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 620px) {
  .generation-settings-primary,
  .generation-settings-grid,
  .generation-summary dl {
    grid-template-columns: 1fr;
  }

  .generation-coverage > header,
  .generation-cases > header {
    display: grid;
  }
}
