/* "Calibrated Decisions" series: the epistemic labels.
 *
 * Every statement about Jev carries one of four labels, so a reader can tell a
 * vendor claim from standard theory, from our inference, from speculation. The
 * labels read the site tokens (theme/light.scss, theme/dark.scss), so they follow
 * the reader's light/dark choice. The same file sits beside all three posts in
 * the series; change one, change all three.
 *
 * Matplotlib figures are drawn on white and stay on white in both schemes, the
 * treatment AGENTS.md prescribes for fixed-colour figures; the rule at the end
 * gives them a rounded card edge so the white reads as deliberate on dark.
 */

.tag-vendor,
.tag-theory,
.tag-inference,
.tag-spec {
  display: inline-block;
  font-size: 0.72em;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0.02em;
  padding: 0 0.45em;
  border: 1px solid currentColor;
  border-radius: 0.65em;
  vertical-align: 0.12em;
  white-space: nowrap;
}

.tag-vendor { color: var(--w-c4); }
.tag-theory { color: var(--w-c2); }
.tag-inference { color: var(--w-c5); }
.tag-spec { color: var(--w-c3); }

.cell-output-display img {
  border-radius: 6px;
}

/* The 5-95% interval under a median in the results tables. */
.rng {
  font-size: 0.82em;
  color: var(--w-muted);
  white-space: nowrap;
}

/* Phones. Display equations and wide tables scroll inside their own box
 * instead of widening the page (the treatment poor-persons-bayesian and
 * svd-rotate-stretch-rotate use). Widget SVGs keep a minimum drawing width,
 * so their labels stay legible, and scroll sideways inside the widget body. */
mjx-container[display="true"] {
  overflow-x: auto;
  overflow-y: hidden;
  max-width: 100%;
}

@media (max-width: 767.98px) {
  main table {
    display: block;
    overflow-x: auto;
    max-width: 100%;
  }

  .widget-body {
    overflow-x: auto;
  }

  .widget-body svg {
    min-width: 440px;
  }
}
