/* Platform prose and table objects — Layer 05. */

.plat-prose {
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  color: var(--text-primary);
  font-size: var(--font-size-16);
  line-height: 1.75;
}

.plat-prose > :first-child { margin-top: var(--spacing-0); }
.plat-prose > :last-child { margin-bottom: var(--spacing-0); }

.plat-prose p,
.plat-prose ul,
.plat-prose ol,
.plat-prose blockquote,
.plat-prose table { margin-block: 1.25em; }

.plat-prose h1,
.plat-prose h2,
.plat-prose h3,
.plat-prose h4 {
  margin-top: 1.5em;
  margin-bottom: 0.5em;
  font-weight: var(--font-weight-700);
  line-height: 1.25;
}

.plat-prose h1 { font-size: 2.25em; }
.plat-prose h2 { font-size: 1.5em; }
.plat-prose h3 { font-size: 1.25em; }
.plat-prose h4 { font-size: 1em; }

.plat-prose a {
  color: var(--border-brand);
  font-weight: var(--font-weight-500);
  text-decoration: underline;
}

.plat-prose a:hover { color: var(--text-primary); }
.plat-prose strong { font-weight: var(--font-weight-600); }

.plat-prose ul,
.plat-prose ol { padding-left: 1.625em; }

.plat-prose ul { list-style-type: disc; }
.plat-prose ol { list-style-type: decimal; }
.plat-prose li { margin-block: 0.5em; }
.plat-prose li::marker { color: var(--text-tertiary); }

.plat-prose code {
  padding: 0.125em 0.375em;
  border-radius: var(--corner-radius-sm);
  background-color: var(--background-surface-1);
  font-family: var(--font-family-mono);
  font-size: 0.875em;
}

.plat-prose pre {
  overflow-x: auto;
  padding: 1em;
  border-radius: var(--corner-radius-sm);
  background-color: var(--background-surface-2);
  color: var(--text-primary);
  font-size: 0.875em;
  line-height: 1.5;
}

.plat-prose pre code {
  padding: var(--spacing-0);
  background-color: inherit;
  color: inherit;
  font-size: inherit;
}

.plat-prose blockquote {
  padding-left: 1em;
  border-left: var(--stroke-weight-2) solid var(--border-brand);
  color: var(--text-secondary);
  font-style: italic;
}

.plat-prose hr {
  margin-block: 2em;
  border: 0;
  border-top: var(--stroke-weight-1) solid var(--border-subtle);
}

.plat-prose table {
  width: max-content;
  min-width: 100%;
  border-collapse: collapse;
  font-size: var(--font-size-14);
}

.plat-prose th,
.plat-prose td {
  padding: var(--spacing-8) var(--spacing-16);
  border-bottom: var(--stroke-weight-1) solid var(--border-subtle);
  text-align: left;
  vertical-align: top;
}

.plat-prose th { color: var(--text-primary); font-weight: var(--font-weight-600); }
.plat-prose td { color: var(--text-secondary); }

.plat-table-scroll {
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}

.plat-table-scroll > table {
  width: max-content;
  min-width: 100%;
}

.plat-table-scroll__wrap {
  min-width: 20rem;
  max-width: 36rem;
  white-space: normal;
}

.plat-prose .sidenote-ref {
  margin-left: 1px;
  color: var(--border-brand);
  font-size: var(--font-size-12);
  font-weight: var(--font-weight-600);
}

.plat-prose .sidenote { display: none; }

@media (min-width: 64rem) {
  .plat-prose.annotated-prose { padding-right: 10rem; }

  .plat-prose .sidenote {
    display: block;
    float: right;
    clear: right;
    width: 9rem;
    margin: var(--spacing-0) -10rem var(--spacing-12) var(--spacing-8);
    color: var(--text-secondary);
    font-size: var(--font-size-12);
    line-height: 1.4;
  }

  .plat-prose .sidenote sup,
  .plat-prose .sidenote a {
    color: var(--border-brand);
    font-weight: var(--font-weight-600);
  }

  .plat-prose .sidenote a { word-break: break-all; }
  .plat-prose .sidenote a:hover { color: var(--text-primary); }

  .plat-prose .sidenote-annotation {
    display: block;
    margin-top: var(--spacing-2);
    color: var(--text-secondary);
  }
}