@layer components {
  .turn-failure {
    display: flex;
    align-items: center;
    gap: var(--space-5);
    max-inline-size: var(--measure);
    margin-inline: auto;
    margin-block-end: var(--space-3);
    padding-block: var(--space-3);
    padding-inline: var(--space-6) var(--space-3);
    border: var(--border-width) solid var(--color-border);
    border-radius: var(--radius-md);
    background-color: var(--color-surface);
  }

  .turn-failure__text {
    flex: auto;
    font: var(--type-body-sm);
    color: var(--color-ink);
    text-wrap: pretty;
  }

  .turn-failure__action {
    flex: none;
  }
}