/* Prose: long-form text (legal pages, docs). Spacing for headings, paragraphs and lists inside
   one container; nothing outside .prose changes. Contract: docs/ui/CONVENTIONS.md. */
@layer components {
  .prose {
    color: var(--color-text);
    font-size: var(--text-base);
    line-height: var(--line-base);

    > * + * { margin-top: var(--space-4); }
    > * + h2 { margin-top: var(--space-10); }
    > * + h3 { margin-top: var(--space-6); }
    > :is(h1, h2, h3) + * { margin-top: var(--space-3); }
    h1 { font-size: var(--text-4xl); line-height: var(--line-4xl); font-weight: var(--weight-bold); letter-spacing: var(--tracking-tight); }
    h2 { font-size: var(--text-xl); line-height: var(--line-xl); }
    h3 { font-size: var(--text-md); line-height: var(--line-md); }
    ul, ol { margin-bottom: 0; padding-inline-start: var(--space-6); }
    ul { list-style: disc; }
    ol { list-style: decimal; }
    li + li { margin-top: var(--space-2); }
    li::marker { color: var(--color-text-muted); }
    a:not([class]) { text-decoration: underline; }
  }
}