@layer design {
  .article-opening .article-title-row,
  .article-section-heading {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    min-width: 0;
  }
  .article-opening .article-title-row h1,
  .article-section-heading h2 {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .article-copy-actions {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    flex: none;
    flex-wrap: wrap;
  }
  .article-copy-actions [data-copy-feedback].feedback {
    flex-basis: 100%;
    min-width: 0;
    max-width: 100%;
    padding: var(--space-2) var(--space-3);
    gap: var(--space-2);
    font: var(--text-dense);
  }
  .article-copy-actions .article-copy-retry {
    flex: none;
  }
  .article-section-heading {
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: var(--space-2);
  }
  .article-section-heading h2 {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
  }
  @media (max-width: 600px) {
    .article-opening .article-title-row {
      flex-wrap: wrap;
    }
    .article-opening .article-title-row .edit-action {
      margin-inline-start: auto;
    }
  }

  .article-opening .article-title-row {
    justify-content: flex-start;
  }
  .article-opening .article-title-row > .edit-action {
    margin-inline-start: auto;
  }
  .article-section > .article-section-heading > h2 {
    font: var(--text-title);
    letter-spacing: -0.01em;
    margin: 0;
  }
  @media (max-width: 700px) {
    .article-section > .article-section-heading > h2 {
      font-size: 20px;
      line-height: 28px;
    }
  }
}