/* Route-scoped delivery: one document scroller and readable mobile columns. */
body.page-exr {
  overflow-x: clip;
  overflow-y: visible;
}

/* History chart: route scoped, no CDN runtime or nested vertical scroller. */
.exr-chart { min-width: 0; padding: 1.4rem 0; }
.exr-chart-ranges, .exr-chart-pairs, .exr-chart-options, .exr-chart-legend { display: flex; flex-wrap: wrap; gap: .65rem; }
.exr-chart-ranges button, .exr-chart-pairs label, .exr-chart-options select {
  min-height: 44px; padding: .6rem .8rem; border: 1px solid #40525e; background: #0d1b26; color: #eaf0f4; font: inherit; font-size: .9rem;
}
.exr-chart-ranges button { cursor: pointer; }
.exr-chart-ranges button[aria-pressed="true"] { background: #244052; border-color: #7fcaff; }
.exr-chart-pairs { margin: 1.2rem 0; padding: 0; border: 0; }
.exr-chart-pairs legend { margin-bottom: .75rem; color: #bdcbd4; font-size: .9rem; }
.exr-chart-pairs label { display: inline-flex; align-items: center; gap: .5rem; cursor: pointer; }
.exr-chart-pairs input { width: 18px; height: 18px; accent-color: #7fcaff; }
.exr-chart-pairs label:has(input:checked) { border-color: #7fcaff; }
.exr-chart-options { gap: 1rem; }
.exr-chart-options label { display: grid; gap: .4rem; flex: 1 1 200px; min-width: 0; color: #bdcbd4; font-size: .9rem; }
.exr-chart-options select { width: 100%; }
.exr-chart-status, .exr-chart-note { color: #b5c5cf; font-size: .88rem; line-height: 1.6; margin: 1rem 0; }
.exr-chart-legend { font-size: .88rem; gap: .8rem 1.4rem; }
.exr-chart-legend > span { display: inline-flex; align-items: center; gap: .35rem; }
.exr-chart-plot { width: 100%; min-width: 0; margin-top: .75rem; touch-action: pan-y; }
.exr-chart-plot > svg { width: 100%; height: auto; display: block; overflow: visible; }
.exr-chart-plot text { fill: #bdcbd4; font: 12px Arial, sans-serif; }
.exr-chart-grid { stroke: #2b3d48; stroke-width: 1; }
.exr-chart-zero { stroke: #82939d; stroke-width: 1; }
.exr-chart-guide { stroke: #a5b8c5; stroke-dasharray: 3 4; pointer-events: none; }
.exr-chart-readout { min-height: 6rem; padding: .75rem 0; color: #dce7ee; font-size: .9rem; line-height: 1.7; overflow-wrap: anywhere; }
.exr-chart-readout span { white-space: nowrap; display: inline-block; }
.exr-chart-scrub { display: grid; color: #bdcbd4; font-size: .9rem; }
.exr-chart-scrub input { width: 100%; min-width: 0; min-height: 44px; accent-color: #7fcaff; }
.exr-chart-details summary { min-height: 44px; padding: .7rem 0; cursor: pointer; }
.exr-chart-details caption { text-align: left; padding: .75rem; color: #bdcbd4; }
.exr-chart :is(button,input,select,summary):focus-visible { outline: 2px solid #7fcaff; outline-offset: 3px; }
@media(max-width:600px) {
  .exr-chart-ranges { gap: .5rem; }
  .exr-chart-ranges button { flex: 1 1 80px; }
  .exr-chart-pairs label { flex: 1 1 115px; }
  .exr-chart-readout span { white-space: normal; }
}

/* Keep the existing channel card usable before the next shared-CSS release. */
.page-exr .exr-channel-promo {
  min-width: 0;
  margin-top: 1.25rem;
  padding: 1.25rem;
  background: #111e27;
  border-left: 2px solid #ff6963;
  overflow-wrap: anywhere;
}
.page-exr .exr-channel-promo h3 {
  margin: .65rem 0;
  color: #f4f5f2;
  font-size: 1.35rem;
  line-height: 1.2;
}
.page-exr .exr-channel-promo > p:not(.exr-section-kicker) {
  margin: 0 0 1rem;
  color: #aeb9bd;
  font-size: .9rem;
  line-height: 1.55;
}
.page-exr .exr-channel-promo__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  min-height: 44px;
  padding: .7rem .9rem;
  background: #bd2f2b;
  color: #fff;
  font-size: .9rem;
  font-weight: 700;
  text-decoration: none;
}
.page-exr .exr-channel-promo__link:hover { background: #a82623; color: #fff; }
.page-exr .exr-channel-promo__link:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }

@media (max-width: 860px) {
  .page-exr .exr-table-heading,
  .page-exr .exr-compare-head,
  .page-exr .exr-trust,
  .page-exr .exr-trust-copy {
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
  }
  .page-exr .exr-change-meta,
  .page-exr .exr-vs-label { text-align: left; }
  .page-exr .exr-change-help { margin-left: 0; }
  .page-exr .exr-reading-key { flex-wrap: wrap; gap: .65rem; }
  .page-exr .exr-reading-key p:last-child { width: 100%; margin-left: 0; }
}
@media (max-width: 600px) {
  .page-exr .exr-summary { grid-template-columns: minmax(0, 1fr); }
  .page-exr .exr-summary-item,
  .page-exr .exr-summary-item:first-child,
  .page-exr .exr-summary-item:last-child {
    padding: 1rem;
    border-right: 0;
    border-bottom: 1px solid #33404a;
  }
  .page-exr .exr-summary-head { flex-wrap: wrap; }
  .page-exr .exr-summary dd { font-size: 1.4rem; white-space: nowrap; }
  .page-exr .exr-table-heading h2,
  .page-exr .exr-compare-head h2,
  .page-exr .exr-trust h2 { font-size: 2rem; }
}