/* Read together, or not. Every class is prefixed cx3-. The figure takes the page's tokens (--cx-paper, --cx-ink, ...)
   when the page defines them, and the design stack's values when it does not.
   Paper: "The Five Postulates of Quantum Mechanics on the Record: Theorems, Premises, and What Is Owed" (preprint, posted 14 November 2026, not peer reviewed). */
.cx3 {
  --f-paper: var(--cx-paper, #faf8f3); --f-ink: var(--cx-ink, #1d1d1b); --f-body: var(--cx-body, #2a2926);
  --f-soft: var(--cx-soft, #3c3a36); --f-hair: var(--cx-hair, #8a8a8a);
  --f-rule: color-mix(in srgb, var(--f-ink) 16%, var(--f-paper));
  --f-faint: color-mix(in srgb, var(--f-ink) 7%, var(--f-paper));
  --f-ok: var(--cx-ok, #0b7a3e); --f-no: var(--cx-no, #c8401f);
  --f-c: var(--cx-cyan, #009fe3); --f-m: var(--cx-magenta, #e6007e);
  --f-c-text: var(--cx-cyan-text, #0072b5); --f-m-text: var(--cx-magenta-text, #c4006b);
  --f-text: var(--cx-text, "InterVariable", "Inter", -apple-system, "Helvetica Neue", Arial, sans-serif);
  --f-display: var(--cx-display, "Inter Display", "InterVariable", "Inter", -apple-system, "Helvetica Neue", Arial, sans-serif);
  --f-mono: var(--cx-mono, "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace);
  margin: 0; color: var(--f-body); font-family: var(--f-text); font-weight: 420; line-height: 1.42; font-optical-sizing: auto;
  box-sizing: border-box; position: relative; container: cx3 / inline-size;
}
@media screen and (prefers-color-scheme: dark) {
  .cx3 { --f-paper: var(--cx-paper, #141413); --f-ink: var(--cx-ink, #faf8f3); --f-body: var(--cx-body, #e9e6df);
    --f-soft: var(--cx-soft, #c9c5bc); --f-ok: var(--cx-ok, #45c27a); --f-no: var(--cx-no, #ff6a3d);
    --f-c: var(--cx-cyan, #2bb3f0); --f-m: var(--cx-magenta, #ff3d9e); --f-c-text: var(--cx-cyan-text, #2bb3f0); --f-m-text: var(--cx-magenta-text, #ff6fb6); }
}
.cx3 *, .cx3 *::before, .cx3 *::after { box-sizing: border-box; }
.cx3-label { margin: 0; font: 700 .72rem/1.3 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--f-soft); }
.cx3-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .4rem 1rem; align-items: baseline;
  padding-bottom: .6rem; margin-bottom: .9rem; border-bottom: 1px solid var(--f-rule); }
.cx3-sub { color: var(--f-ink); }
.cx3-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.2rem; align-items: start; }
@container cx3 (min-width: 820px) { .cx3-grid { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(1rem, 2.6vw, 2.2rem); } }
.cx3-ctl { min-width: 0; display: flex; flex-direction: column; gap: 1rem; }
.cx3-picks { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; }
.cx3-pick { min-width: 0; }
.cx3-pg { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; margin-top: .35rem; }
.cx3-pb { appearance: none; border: 1px solid var(--f-ink); border-radius: 0; background: var(--f-paper); color: var(--f-ink); cursor: pointer;
  font: 700 .7rem/1 var(--f-mono); min-height: 38px; padding: 0 .1rem; white-space: nowrap; }
.cx3-pb:hover { background: var(--f-faint); }
.cx3-pb[aria-checked="true"] { background: var(--f-ink); color: var(--f-paper); }
.cx3-pb:focus-visible { outline: 3px solid var(--f-ink); outline-offset: 2px; position: relative; z-index: 1; }
.cx3-state { display: flex; flex-direction: column; gap: .45rem; border-top: 1px solid var(--f-rule); padding-top: .8rem; }
.cx3-sl { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .05rem .5rem; align-items: center;
  font: 700 .66rem/1.3 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--f-soft); }
.cx3-sl output { font-weight: 400; letter-spacing: .02em; color: var(--f-ink); font-variant-numeric: tabular-nums; }
.cx3-sl input { grid-column: 1 / -1; width: 100%; margin: .1rem 0 0; accent-color: var(--f-ink); min-height: 28px; }
.cx3-small { margin: 0; font-size: .8rem; color: var(--f-soft); }
.cx3-presets { display: flex; flex-wrap: wrap; gap: .4rem; }
.cx3-presets button { appearance: none; border: 1px solid var(--f-ink); border-radius: 0; background: transparent; color: var(--f-ink); cursor: pointer;
  font: 700 .62rem/1.2 var(--f-mono); letter-spacing: .08em; text-transform: uppercase; padding: .5rem .6rem; min-height: 36px; }
.cx3-presets button:hover { background: var(--f-faint); }
.cx3-presets button:focus-visible { outline: 2px solid var(--f-ink); outline-offset: 2px; }

.cx3-out { min-width: 0; display: flex; flex-direction: column; gap: .9rem; container-type: inline-size; }
.cx3-lead { display: flex; flex-direction: column; gap: .9rem; min-width: 0; }   /* the verdict, its sentence and the parts: one block in print */
.cx3-verdict { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem 1rem; }
.cx3-vbig { font: 820 clamp(1.6rem, 3.4vw, 2.3rem)/1 var(--f-display); letter-spacing: -.035em; color: var(--f-ink); }
.cx3[data-commute="1"] .cx3-vbig { color: var(--f-ok); }
.cx3-vrel { font: 400 .86rem/1.3 var(--f-mono); color: var(--f-ink); white-space: nowrap; }
.cx3-parts { display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr) auto; gap: .3rem .6rem; align-items: center; }
.cx3-ph { font: 700 .6rem/1.25 var(--f-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--f-soft); text-align: center; }
.cx3-rh { font: 700 .62rem/1.25 var(--f-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--f-soft); max-width: 6.5em; }
.cx3-part { border: 1px solid var(--f-rule); padding: .25rem .3rem .2rem; display: flex; flex-direction: column; align-items: center; min-width: 0; }
.cx3-bars { width: 100%; max-width: 150px; height: auto; display: block; }
.cx3-bars .base { stroke: var(--f-hair); stroke-width: 1; }
.cx3-bars rect.p, .cx3-bars rect.m { fill: var(--f-ink); }   /* a part's values: up for plus, down for minus (colour is kept for the outcomes) */
.cx3-pk { grid-column: 1 / -1; margin: 0 0 .2rem; font-size: .8rem; line-height: 1.35; color: var(--f-soft); }
.cx3-bars text { font: 400 8px var(--f-mono); fill: var(--f-soft); }
.cx3-pw { font: 400 .7rem/1.2 var(--f-mono); color: var(--f-ink); font-variant-numeric: tabular-nums; }
.cx3-ov { display: flex; flex-direction: column; align-items: center; min-width: 4.8em; padding: .3rem .2rem; border: 1.5px solid var(--f-ink); }
.cx3-ov[data-zero="1"] { border: 1px dashed var(--f-hair); }
.cx3-ov[data-zero="1"] .cx3-ovv { color: var(--f-soft); }
.cx3-ovv { font: 820 1.1rem/1 var(--f-display); letter-spacing: -.02em; color: var(--f-ink); font-variant-numeric: tabular-nums; }
.cx3-ovk { font: 700 .56rem/1.2 var(--f-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--f-soft); margin-top: .15rem; text-align: center; }
.cx3-pn { grid-column: 1 / -1; margin: .1rem 0 0; font-size: .8rem; color: var(--f-soft); }
.cx3-weights { display: flex; flex-direction: column; gap: .35rem; border-top: 1px solid var(--f-rule); padding-top: .7rem; }
.cx3-wrow { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; }
.cx3-wcol { display: flex; flex-direction: column; gap: .25rem; min-width: 0; }
.cx3-wk { font: 700 .62rem/1.25 var(--f-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--f-soft); }
.cx3-wbar { display: flex; height: 14px; border: 1px solid var(--f-ink); }
.cx3-wbar i { display: block; height: 100%; }
.cx3-wbar i.p { background: var(--f-c); } .cx3-wbar i.m { background: var(--f-m); }
.cx3-wv { font: 400 .74rem/1.2 var(--f-mono); color: var(--f-ink); font-variant-numeric: tabular-nums; }
.cx3-words { margin: 0; font-size: 1rem; line-height: 1.38; color: var(--f-ink); min-height: 2.8em; padding-bottom: .7rem; border-bottom: 1px solid var(--f-rule); }   /* the take-away first; the parts and weights below are its evidence */
.cx3-caption { margin: 1rem 0 0; padding-top: .8rem; border-top: 1px solid var(--f-rule); font-size: .95rem; color: var(--f-body); max-width: 50rem; }
.cx3-caption b { color: var(--f-ink); font-weight: 650; }
.cx3-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
@container cx3 (max-width: 420px) {
  .cx3-parts { gap: .25rem .3rem; }
  .cx3-rh { max-width: 5em; font-size: .56rem; }
  .cx3-ov { min-width: 3.6em; }
  .cx3-ovv { font-size: .95rem; }
}
@media (forced-colors: active) {
  .cx3-pb[aria-checked="true"] { background: Highlight; color: HighlightText; forced-color-adjust: none; }
  .cx3-bars, .cx3-wbar { forced-color-adjust: none; }
}
@media print {
  /* a printed page breaks between a figure's blocks, never inside one (the whole figure can be taller than a page) */
  .cx3-pick, .cx3-state, .cx3-lead, .cx3-weights { break-inside: avoid; }
  .cx3 { --f-paper: #ffffff; --f-ink: #1d1d1b; --f-body: #2a2926; --f-soft: #3c3a36; --f-c: #009fe3; --f-m: #e6007e; }
  .cx3, .cx3 * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}