/* Bell's inequality: the page for one paradox of quantum mechanics. The institute's screen style: warm paper and ink, Inter
   at two sizes, small mono labels. Colour carries one meaning everywhere on the page and in its figures: cyan is an act that
   only reads (values written in advance) and the ceiling 2; magenta is an act that writes and the ceiling 2√2; grey is the
   ceiling 4; ink is a measured value. */
body.bi-body[data-rpi-page] {
  --bi-paper: #faf8f3; --bi-ink: #1d1d1b; --bi-body: #2a2926; --bi-soft: #3c3a36; --bi-hair: #8a8a8a;
  --bi-cyan: #009fe3; --bi-magenta: #e6007e; --bi-cyan-text: #0072b5; --bi-magenta-text: #c4006b;
  --bi-proved: #0b7a3e; --bi-rs: #ffc328; --bi-open: #c8401f;
  --bi-rule: color-mix(in srgb, var(--bi-ink) 16%, var(--bi-paper));
  --bi-tint: color-mix(in srgb, var(--bi-ink) 4%, var(--bi-paper));
  --bi-display: "Inter Display", "InterVariable", "Inter", -apple-system, "Helvetica Neue", Arial, sans-serif;
  --bi-text: "InterVariable", "Inter", -apple-system, "Helvetica Neue", Arial, sans-serif;
  --bi-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  background: var(--bi-paper); color: var(--bi-body);
}
@media screen and (prefers-color-scheme: dark) {
  body.bi-body[data-rpi-page] {
    --bi-paper: #141413; --bi-ink: #faf8f3; --bi-body: #e9e6df; --bi-soft: #c9c5bc;
    --bi-cyan: #2bb3f0; --bi-magenta: #ff3d9e; --bi-cyan-text: #2bb3f0; --bi-magenta-text: #ff5aae;
    --bi-proved: #3fb871; --bi-open: #ff6a3d;
  }
}

.bi-page { width: min(calc(100% - 4rem), 75rem); margin: 0 auto; padding: 0 0 5rem;
  font-family: var(--bi-text); font-weight: 420; line-height: 1.42; font-optical-sizing: auto; }
.bi-page a { color: var(--bi-ink); text-decoration-color: var(--bi-cyan); text-decoration-thickness: 2px; text-underline-offset: .18em; }
.bi-page a:hover { color: var(--bi-cyan-text); }
.bi-page i { font-style: italic; }
.bi-page sub, .bi-page sup { font-size: .72em; line-height: 0; }
.bi-page b { color: var(--bi-ink); font-weight: 650; }
.bi-label { margin: 0 0 1rem; font: 700 .75rem/1.3 var(--bi-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--bi-soft); }
.bi-nw { white-space: nowrap; }
.bi-page :focus-visible { outline: 3px solid var(--bi-cyan-text); outline-offset: 3px; }
.bi-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
html:has(> body.bi-body[data-rpi-page]) { scroll-padding-top: 6rem; }
.bi-read-c { color: var(--bi-cyan-text); font-weight: 650; }
.bi-write-c { color: var(--bi-magenta-text); font-weight: 650; }

/* Opening: the name, the one sentence, the one number, and the picture */
.bi-opening { padding: clamp(1rem, 2vw, 1.5rem) 0 clamp(1.25rem, 2.5vw, 2rem); }
.bi-opening > .bi-label { margin-bottom: .6rem; }
.bi-opening-top { max-width: 54rem; }
body.bi-body .bi-opening h1 { margin: 0 0 .9rem; font-family: var(--bi-display); font-weight: 820;
  font-size: clamp(2.6rem, 5.4vw, 4.9rem); line-height: .94; letter-spacing: -.042em; color: var(--bi-ink); text-wrap: balance;
  text-shadow: 0 0 .5px color-mix(in srgb, var(--bi-ink) 55%, transparent); }
.bi-lede { max-width: 50rem; margin: 0; font-size: clamp(1.1rem, 1.45vw, 1.3rem); font-weight: 450; line-height: 1.32;
  letter-spacing: -.008em; color: var(--bi-ink); }
.bi-number { margin: 0; padding: .9rem 0 0; border-top: 3px solid var(--bi-ink); }
.bi-number .bi-label { margin-bottom: .45rem; }
.bi-num { margin: 0; font-family: var(--bi-display); font-weight: 860; font-size: clamp(2.6rem, 4.6vw, 4.2rem); line-height: .86;
  letter-spacing: -.05em; color: var(--bi-magenta-text); font-variant-numeric: tabular-nums lining-nums; }
.bi-num small { font-size: .5em; font-weight: 780; letter-spacing: -.03em; color: var(--bi-ink); }
.bi-num-cap { margin: .6rem 0 0; font-size: .95rem; line-height: 1.38; color: var(--bi-body); }
.bi-num-cap b { font-variant-numeric: tabular-nums; }

.bi-hero { margin: clamp(1.1rem, 2.2vw, 1.6rem) 0 0; }
.bi-hero figcaption { max-width: 52rem; margin-top: .6rem; font-size: .9rem; line-height: 1.4; color: var(--bi-soft); }

/* The three ceilings, drawn to scale (the still figure under the live one) */
.bi-ceil { display: block; width: 100%; height: auto; overflow: visible; color: var(--bi-ink); font-family: var(--bi-text); }
.bi-ceil--phone { display: none; }
.bi-ceil .band-read { fill: var(--bi-cyan); opacity: .09; }
.bi-ceil .band-write { fill: var(--bi-magenta); opacity: .10; }
.bi-ceil .band-ns { fill: url(#bi-hatch); }
.bi-ceil .band-ns-p { fill: url(#bi-hatch-p); }
.bi-ceil .hatch { stroke: var(--bi-hair); stroke-width: 1; opacity: .45; }
.bi-ceil .axis { stroke: var(--bi-ink); stroke-width: 1.5; }
.bi-ceil .tick { stroke: var(--bi-ink); stroke-width: 1; }
.bi-ceil .tick-l { font: 500 13px/1 var(--bi-mono); fill: var(--bi-soft); }
.bi-ceil .c-read { stroke: var(--bi-cyan); stroke-width: 3.5; }
.bi-ceil .c-write { stroke: var(--bi-magenta); stroke-width: 3.5; }
.bi-ceil .c-ns { stroke: var(--bi-hair); stroke-width: 2.5; stroke-dasharray: 6 5; }
.bi-ceil .big { font-family: var(--bi-display); font-weight: 860; letter-spacing: -.04em; }
.bi-ceil .big-read { fill: var(--bi-cyan-text); }
.bi-ceil .big-write { fill: var(--bi-magenta-text); }
.bi-ceil .big-ns { fill: var(--bi-soft); }
.bi-ceil .lab { font: 700 12px/1 var(--bi-mono); letter-spacing: .12em; fill: var(--bi-soft); }
.bi-ceil .lab-ink { fill: var(--bi-ink); }
.bi-ceil .lab-write { fill: var(--bi-magenta-text); }
.bi-ceil .pt { fill: var(--bi-ink); stroke: var(--bi-ink); stroke-width: 1.5; }
.bi-ceil .pt-open { fill: var(--bi-paper); stroke: var(--bi-ink); stroke-width: 2; }
.bi-ceil .err { stroke: var(--bi-ink); stroke-width: 2; }
.bi-ceil .lead { stroke: var(--bi-hair); stroke-width: 1; stroke-dasharray: 2 3; }
.bi-ceil .m-l { font: 500 13.5px/1 var(--bi-text); fill: var(--bi-ink); }
.bi-ceil .m-l tspan.m-v { font-family: var(--bi-mono); font-weight: 500; font-size: 13px; }
.bi-ceil .m-s { font: 450 12px/1 var(--bi-text); fill: var(--bi-soft); }

/* The paradox in three lines */
.bi-three { margin: 0; padding: clamp(1.75rem, 3.5vw, 2.5rem) 0 clamp(2rem, 4vw, 3rem); border-bottom: 1px solid var(--bi-rule); }
.bi-three-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .5rem 2rem; margin-bottom: 1.1rem; }
body.bi-body .bi-three-head h2 { margin: 0; font-family: var(--bi-display); font-weight: 780; font-size: clamp(1.45rem, 2.2vw, 1.9rem); line-height: 1.05;
  letter-spacing: -.02em; color: var(--bi-ink); }
.bi-three ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 clamp(1.25rem, 3vw, 2.5rem); }
.bi-three li { margin: 0; padding: .9rem 0 0; border-top: 3px solid var(--bi-ink); }
.bi-three li:nth-child(2) { border-top-color: var(--bi-magenta); }
.bi-three li p { margin: 0 0 .7rem; font-size: 1.04rem; line-height: 1.42; }
.bi-three li p:last-child { margin-bottom: 0; }
.bi-three li .bi-label { margin-bottom: .55rem; font-size: .78rem; color: var(--bi-ink); }
.bi-three .bi-owed { color: var(--bi-body); }
.bi-toc { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin: 1.6rem 0 0; padding: 0; }
.bi-toc a { font: 700 .72rem/1.3 var(--bi-mono); letter-spacing: .12em; text-transform: uppercase; text-decoration: none !important;
  color: var(--bi-ink); border-bottom: 2px solid var(--bi-cyan); padding-bottom: .15rem; }
.bi-toc a span { color: var(--bi-soft); margin-right: .45em; }

/* Text sections: heading left, copy right */
.bi-section { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(1.5rem, 4vw, 4rem);
  padding: clamp(2.25rem, 4.5vw, 3.75rem) 0; border-bottom: 1px solid var(--bi-rule); }
.bi-section--part { border-top: 2px solid var(--bi-ink); margin-top: -1px; }
.bi-head { align-self: start; }
body.bi-body .bi-section h2 { margin: 0; max-width: 17ch; text-wrap: balance; font-family: var(--bi-display); font-weight: 780;
  font-size: clamp(1.7rem, 2.8vw, 2.5rem); line-height: 1.05; letter-spacing: -.02em; color: var(--bi-ink); }
.bi-copy > p, .bi-copy > ul, .bi-copy > ol { max-width: 38rem; margin: 0 0 1rem; font-size: 1.1rem; }
.bi-copy > p:last-child { margin-bottom: 0; }
.bi-copy h3 { max-width: 38rem; margin: 1.8rem 0 .6rem; font-family: var(--bi-display); font-weight: 760; font-size: 1.3rem; line-height: 1.15;
  letter-spacing: -.014em; color: var(--bi-ink); }
.bi-eq { max-width: 38rem; margin: 1.2rem 0 1.3rem !important; padding: .1rem 0 .15rem 1.1rem; border-left: 3px solid var(--bi-cyan);
  font-size: clamp(1.1rem, 1.8vw, 1.32rem) !important; font-weight: 460; line-height: 1.45; color: var(--bi-ink);
  font-variant-numeric: lining-nums; overflow-x: auto; overflow-y: hidden; }
.bi-eq--write { border-left-color: var(--bi-magenta); }
.bi-eq span { white-space: nowrap; }
.bi-eq small { display: block; margin-top: .3rem; font-size: .78rem; line-height: 1.35; color: var(--bi-soft); white-space: normal; }
.bi-ref { font-size: .86em; color: var(--bi-soft); }
.bi-cards { max-width: 38rem; margin: 1rem 0 1.25rem; border-collapse: collapse; font-variant-numeric: tabular-nums; font-size: 1rem; }
.bi-cards caption { caption-side: top; text-align: left; margin-bottom: .5rem; font: 700 .72rem/1.3 var(--bi-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--bi-soft); }
.bi-cards th, .bi-cards td { padding: .4rem .9rem .4rem 0; border-bottom: 1px solid var(--bi-rule); text-align: left; }
.bi-cards thead th { border-bottom: 2px solid var(--bi-ink); font: 700 .72rem/1.3 var(--bi-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--bi-ink); }
.bi-cards td.n { font-family: var(--bi-mono); font-size: .95rem; }

/* Live figures under their section, each with the page's own heading */
.bi-figure { margin: 0; padding: clamp(2rem, 4vw, 3rem) 0; border-bottom: 1px solid var(--bi-rule); }
.bi-figure-head { max-width: 46rem; margin-bottom: 1.1rem; }
.bi-figure-head h3 { margin: 0; text-wrap: balance; font-family: var(--bi-display); font-weight: 780; font-size: clamp(1.4rem, 2.2vw, 1.9rem);
  line-height: 1.08; letter-spacing: -.02em; color: var(--bi-ink); }
.bi-figure-note { max-width: 46rem; margin: .6rem 0 0; font-size: .95rem; color: var(--bi-soft); }

/* The road to the test */
.bi-tl { list-style: none; margin: 0; padding: clamp(1.5rem, 3vw, 2.25rem) 0 clamp(2rem, 4vw, 3rem); display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 clamp(1rem, 2.5vw, 2rem); border-bottom: 1px solid var(--bi-rule); }
.bi-tl li { margin: 0; padding: .9rem 0 1.2rem; border-top: 2px solid var(--bi-ink); }
.bi-tl p { margin: 0; }
.bi-tl-year { font-family: var(--bi-display); font-weight: 860; font-size: clamp(1.6rem, 2.4vw, 2.1rem); letter-spacing: -.04em;
  line-height: .95; color: var(--bi-ink); font-variant-numeric: tabular-nums lining-nums; }
.bi-tl-who { margin-top: .45rem !important; font: 700 .7rem/1.35 var(--bi-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--bi-soft); }
.bi-tl-what { margin-top: .35rem !important; font-size: 1rem; line-height: 1.38; color: var(--bi-ink); }
.bi-tl-cite { margin-top: .45rem !important; font-size: .8rem; line-height: 1.35; color: var(--bi-soft); }
.bi-tl-test { border-top-color: var(--bi-magenta) !important; }
.bi-tl-head { grid-column: 1 / -1; padding: 0 0 .6rem !important; border-top: 0 !important; }
body.bi-body .bi-tl-head h2 { margin: 0; font-family: var(--bi-display); font-weight: 780; font-size: clamp(1.45rem, 2.2vw, 1.9rem); line-height: 1.05;
  letter-spacing: -.02em; color: var(--bi-ink); }

/* What it means */
.bi-meaning { padding: clamp(3rem, 6vw, 5rem) 0; border-top: 3px solid var(--bi-ink); border-bottom: 1px solid var(--bi-rule); }
.bi-meaning-head { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); column-gap: clamp(1.5rem, 4vw, 4rem); align-items: start;
  margin-bottom: clamp(2rem, 4vw, 3rem); }
body.bi-body .bi-meaning h2 { margin: 0; font-family: var(--bi-display); font-weight: 820; font-size: clamp(2.2rem, 3.9vw, 3.6rem);
  line-height: .96; letter-spacing: -.038em; color: var(--bi-ink); max-width: 14ch; text-wrap: balance;
  text-shadow: 0 0 .5px color-mix(in srgb, var(--bi-ink) 55%, transparent); }
.bi-meaning-lede { margin: 0 0 1rem; max-width: 40rem; font-size: clamp(1.1rem, 1.45vw, 1.26rem); font-weight: 450; line-height: 1.38; color: var(--bi-ink); }
.bi-meaning-sub { margin: 0; max-width: 40rem; font-size: 1rem; color: var(--bi-soft); }
.bi-truths { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.75rem, 3.5vw, 3rem) clamp(1.5rem, 4vw, 4rem); }
.bi-truth { margin: 0; padding-top: 1rem; border-top: 2px solid var(--bi-ink); }
.bi-truth .bi-truth-num { margin: 0 0 .55rem; font: 700 .72rem/1.4 var(--bi-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--bi-soft); }
.bi-tag { display: inline-flex; align-items: center; gap: .45em; margin-left: .6em; color: var(--bi-ink); }
.bi-tag::before { content: ""; width: .7em; height: .7em; background: var(--bi-proved); }
.bi-tag--owed::before { background: transparent; box-shadow: inset 0 0 0 2px var(--bi-open); }
.bi-tag--rs::before { background: var(--bi-rs); }
.bi-truth h3 { margin: 0 0 .7rem; font-family: var(--bi-display); font-weight: 780; font-size: clamp(1.35rem, 2vw, 1.7rem); line-height: 1.08;
  letter-spacing: -.02em; color: var(--bi-ink); text-wrap: balance; }
.bi-truth p { margin: 0 0 .8rem; max-width: 36rem; font-size: 1.05rem; }
.bi-truth p:last-child { margin-bottom: 0; }

/* Hard questions; not claimed */
.bi-qa { max-width: 40rem; margin: 0; }
.bi-qa dt { margin: 0; padding-top: 1rem; border-top: 2px solid var(--bi-ink); font-family: var(--bi-display); font-weight: 760;
  font-size: 1.3rem; line-height: 1.2; letter-spacing: -.012em; color: var(--bi-ink); }
.bi-qa dd { margin: .5rem 0 1.6rem; font-size: 1.08rem; }
.bi-qa dd:last-child { margin-bottom: 0; }
.bi-not { max-width: 38rem; margin: 0; padding: 0; list-style: none; }
.bi-not li { margin: 0; padding: .7rem 0 .7rem 1.6rem; border-top: 1px solid var(--bi-rule); position: relative; font-size: 1.05rem; }
.bi-not li::before { content: "–"; position: absolute; left: 0; top: .72rem; font: 700 .85rem/1.4 var(--bi-mono); color: var(--bi-open); }

/* Read it */
.bi-sources { max-width: 40rem; margin: 0; padding: 0; list-style: none; }
.bi-sources li { margin: 0; padding: .55rem 0; border-top: 1px solid var(--bi-rule); font-size: .98rem; line-height: 1.4; }
.bi-paper { margin: 0 0 1.5rem; padding: 1rem 0 0; border-top: 3px solid var(--bi-ink); max-width: 40rem; }
.bi-paper-title cite { font-style: normal; }
.bi-paper-title { margin: 0 0 .35rem; font-family: var(--bi-display); font-weight: 780; font-size: 1.35rem; line-height: 1.15; letter-spacing: -.018em; color: var(--bi-ink); }
.bi-paper p { margin: 0 0 .5rem; }
.bi-vor { margin-top: .8rem !important; padding: .7rem .9rem; border: 1px dashed var(--bi-hair); font-size: .98rem; }

@media (max-width: 60em) {
  .bi-opening-top { grid-template-columns: minmax(0, 1fr); row-gap: 1.25rem; }
  .bi-three ol { grid-template-columns: minmax(0, 1fr); gap: 1.4rem; }
  .bi-section { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
  .bi-tl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bi-meaning-head { grid-template-columns: minmax(0, 1fr); row-gap: 1.25rem; }
  .bi-truths { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 40em) {
  .bi-page { width: calc(100% - 2.5rem); }
  body.bi-body .bi-opening h1 { font-size: 2.65rem; margin-bottom: .7rem; }
  .bi-lede { font-size: 1.08rem; }
  .bi-number { padding-top: .7rem; }
  .bi-num { font-size: 2.7rem; }
  .bi-num-cap { font-size: .9rem; }
  .bi-ceil--desk { display: none; }
  .bi-ceil--phone { display: block; }
  .bi-tl { grid-template-columns: minmax(0, 1fr); }
  .bi-copy > p, .bi-copy > ul, .bi-copy > ol { font-size: 1.04rem; }
}
@media (forced-colors: active) {
  .bi-ceil .c-read, .bi-ceil .c-write, .bi-ceil .c-ns, .bi-ceil .axis, .bi-ceil .tick, .bi-ceil .err, .bi-ceil .pt { stroke: CanvasText; }
  .bi-ceil .pt { fill: CanvasText; }
  .bi-ceil text, .bi-ceil .big, .bi-ceil .lab-write { fill: CanvasText; }
  .bi-num { color: CanvasText; }
  .bi-ceil .band-read, .bi-ceil .band-write { fill: transparent; }
  .bi-tag::before { forced-color-adjust: none; background: CanvasText; }
}
@media print {
  .bi-page { width: auto; }
  .bi-toc { display: none; }
}
body.bi-body[data-rpi-page] > .skip { position: absolute; left: -9999px; }
body.bi-body[data-rpi-page] > .skip:focus { position: fixed; left: 1rem; top: 1rem; z-index: 100; padding: .5rem .8rem; background: var(--bi-ink); color: var(--bi-paper); }

/* The rhombus behind 2√2 (section 04), drawn to scale */
.bi-rh { max-width: 38rem; margin: .4rem 0 1.4rem; }
.bi-rh-row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 0 1rem; }
.bi-rh-svg { display: block; flex: 1 1 15rem; max-width: 19rem; height: auto; font-family: var(--bi-text); }
.bi-rh .rh-fill { fill: var(--bi-magenta); opacity: .07; }
.bi-rh .rh-side { stroke: var(--bi-hair); stroke-width: 1; }
.bi-rh .rh-arrow { stroke: var(--bi-ink); stroke-width: 2; }
.bi-rh .rh-headp { fill: var(--bi-ink); }
.bi-rh .rh-sum { stroke: var(--bi-magenta); stroke-width: 3; }
.bi-rh .rh-dif { stroke: var(--bi-magenta); stroke-width: 3; stroke-dasharray: 7 5; }
.bi-rh .rh-l { font: 500 15px/1 var(--bi-text); fill: var(--bi-ink); }
.bi-rh .rh-t { font: 700 10.5px/1 var(--bi-mono); letter-spacing: .1em; fill: var(--bi-soft); }
.bi-rh .rh-n { font: 500 15px/1 var(--bi-mono); fill: var(--bi-ink); }
.bi-rh figcaption { margin-top: .4rem; font-size: .88rem; line-height: 1.38; color: var(--bi-soft); }
@media (forced-colors: active) {
  .bi-rh .rh-arrow, .bi-rh .rh-sum, .bi-rh .rh-dif, .bi-rh .rh-side { stroke: CanvasText; }
  .bi-rh .rh-headp, .bi-rh text { fill: CanvasText; }
  .bi-rh .rh-fill { fill: transparent; }
}

.bi-fignum { display: block; margin-bottom: .35rem; font: 700 .72rem/1.3 var(--bi-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--bi-soft); }

.bi-status { max-width: 50rem; margin: .75rem 0 0; padding-left: .8rem; border-left: 3px solid var(--bi-magenta); font-size: .92rem; line-height: 1.42; color: var(--bi-soft); }
.bi-toc { margin: 0; padding: 1.5rem 0 2rem; border-bottom: 1px solid var(--bi-rule); }
/* The set of twelve, at the foot */
.bi-set { margin: clamp(2.5rem, 5vw, 4rem) 0 0; padding-top: 1rem; border-top: 3px solid var(--bi-ink); }
.bi-set .bi-label a { color: var(--bi-ink); text-decoration: underline; text-decoration-color: var(--bi-cyan); text-decoration-thickness: 2px; text-underline-offset: .2em; }
.bi-set ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 clamp(1rem, 2.5vw, 2rem); counter-reset: set; }
.bi-set li { counter-increment: set; margin: 0; padding: .6rem 0 .7rem; border-top: 1px solid var(--bi-rule); font-size: .98rem; line-height: 1.3; color: var(--bi-soft); }
.bi-set li::before { content: counter(set, decimal-leading-zero); display: block; margin-bottom: .25rem; font: 700 .7rem/1 var(--bi-mono); letter-spacing: .12em; color: var(--bi-soft); }
.bi-set li a { color: var(--bi-ink); font-weight: 560; }
.bi-set li[aria-current="page"] { border-top: 3px solid var(--bi-magenta); color: var(--bi-ink); font-weight: 650; }
.bi-set-here { display: block; margin-top: .2rem; font: 700 .68rem/1 var(--bi-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--bi-magenta-text); }
@media (max-width: 60em) { .bi-set ol { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.bi-tl-intro { max-width: 46rem; margin: .5rem 0 0 !important; font-size: 1rem; color: var(--bi-soft); }

/* Specialist detail, folded under the plain account */
.bi-math { max-width: 38rem; margin: 1.2rem 0 0; border-top: 1px solid var(--bi-rule); border-bottom: 1px solid var(--bi-rule); }
.bi-math > summary { cursor: pointer; padding: .7rem 0; font: 700 .75rem/1.4 var(--bi-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--bi-ink); }
.bi-math > summary:hover { color: var(--bi-cyan-text); }
.bi-math > p { margin: 0 0 1rem; font-size: 1.02rem; }
.bi-math > p.bi-eq { font-size: clamp(1.05rem, 1.6vw, 1.22rem) !important; }
@media print { .bi-math > summary { display: none; } }
@media (max-width: 40em) {
  .bi-lede { font-size: 1.02rem; }
  .bi-status { font-size: .84rem; line-height: 1.38; margin-top: .55rem; }
  .bi-hero { margin-top: .9rem; }
}
/* Very large reader text on a narrow screen: long words and DOIs wrap instead of widening the page */
body.bi-body .bi-opening h1, .bi-sources li, .bi-paper, .bi-tl-cite, .bi-set li { overflow-wrap: anywhere; }
/* The film under the running experiment */
.bi-film { margin: clamp(1.6rem, 3vw, 2.4rem) 0 0; max-width: 960px; }
.bi-film .bi-film-label { margin-bottom: .55rem; }
.bi-film .pp-film { margin-top: 0; }
.bi-film-note { max-width: 52rem; margin: .6rem 0 0; font-size: .9rem; line-height: 1.4; color: var(--bi-soft); }
@media print { .bi-film { display: none; } }