/* What is +P: compat article, one editorial column (.container-editorial in the page) on brand tokens. */
.compat-header { padding-block: var(--page-top) 0; }
.compat-body { padding-block: var(--space-8) var(--page-bottom); }
.compat-section { margin-bottom: var(--space-12); }
.compat-section .eyebrow { display: block; margin-bottom: var(--space-3); }
.compat-section h2 { margin-bottom: var(--space-4); }
.compat-section p:not(.eyebrow), .def-body {
  font-family: var(--font-serif);
  font-size: var(--text-prose);
  line-height: var(--lh-prose);
  color: var(--color-ink-2);
  margin-bottom: var(--space-4);
}
.compat-section p:last-child { margin-bottom: 0; }

.pp-tablewrap { overflow-x: auto; margin: var(--space-6) 0; }
.pp-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--text-data);
  line-height: var(--lh-data);
  font-variant-numeric: tabular-nums;
}
.pp-table th {
  text-align: left;
  padding: var(--space-3) var(--space-4);
  background: var(--color-surface);
  color: var(--color-ink-3);
  font-size: var(--text-label);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  border-bottom: 1px solid var(--color-border-strong);
}
.pp-table td {
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--color-border);
  color: var(--color-ink);
  vertical-align: top;
}
.pp-table tr:last-child td { border-bottom: 0; }
.spec-row-label { color: var(--color-ink-2); }
.spec-highlight { font-weight: 700; }
.spec-dim { color: var(--color-ink-3); }

.callout, .callout-warning {
  padding: var(--space-5);
  margin: var(--space-6) 0;
  font-size: var(--text-body);
  line-height: var(--lh-body);
  color: var(--color-ink);
  background: var(--color-surface);
  border: 1px solid var(--color-border-strong);
  border-left: 3px solid var(--color-accent);
}
.callout-warning {
  border-color: var(--color-warning);
  background: color-mix(in srgb, var(--color-warning) 6%, transparent);
}
.callout-warning strong { color: var(--color-warning); }

.def-block { margin: var(--space-6) 0; }
.def-term {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: var(--text-h3);
  font-weight: 700;
  color: var(--color-ink);
  margin-bottom: var(--space-2);
}

.bottom-line {
  background: var(--color-surface);
  border: 1px solid var(--color-border-strong);
  padding: var(--space-6);
  margin-top: var(--space-10);
}
.bottom-line .eyebrow { display: block; margin-bottom: var(--space-2); }
.bottom-line p:not(.eyebrow) { font-size: var(--text-body); line-height: var(--lh-body); color: var(--color-ink); margin: 0; }

.related-links { margin-top: var(--space-12); padding-top: var(--space-8); border-top: 1px solid var(--color-border); }
.related-links .eyebrow { display: block; margin-bottom: var(--space-4); }
.related-links-grid { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-6); }