/* live: in-tab verification results, the facts line of a Live statement, and the figures drawn from the Live runs
   (#lv-co on Platform A · M4, #lv-bd on Platform C · M7, #lv-gn on Platform E · M10). The films' grammar: warm-grey data
   with fine ink outlines, ink for what is proven, hairlines, one orange mark per proof. */

/* ---------- Figures: sheets in the module flow ---------- */
figure.lv-co, figure.lv-bd, figure.lv-gn { margin: 32px 0 0; }

/* ---------- Verify in this tab ---------- */
.lv-acts { margin-top: 16px; }
.lv-out { color: var(--muted); min-height: 1.4em; }
.lv-out.ok { color: var(--ink); }
.lv-out.ok::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 8px; background: var(--blue-900); vertical-align: 0; }
.lv-out.bad { color: var(--signal-ink); }
.lv-f { display: block; margin-top: 4px; color: var(--muted); font: 12px/1.4 var(--mono); }

/* ---------- One cohort, proved end to end ---------- */
.lv-co-fig { display: grid; gap: 28px; margin-bottom: 24px; }
.lv-co-row { display: grid; gap: 12px; }
.lv-co-row > .k { margin: 0; }
.lv-ps { list-style: none; display: flex; flex-wrap: wrap; gap: 16px 14px; margin: 0; padding: 0; }
.lv-p { display: grid; justify-items: center; gap: 6px; }
.lv-p .data { font-size: 11px; color: var(--muted); }
.lv-sq { position: relative; display: block; width: 28px; height: 28px; background: var(--g3); box-shadow: inset 0 0 0 1px rgba(17, 17, 17, .5); }
.lv-seal { position: absolute; right: -5px; top: -5px; width: 10px; height: 10px; background: var(--signal); box-shadow: inset 0 0 0 1px rgba(17, 17, 17, .5); }
.lv-dup .lv-sq { background: var(--white); box-shadow: inset 0 0 0 2px var(--signal); }
.lv-dupnote { margin: 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.lv-rule { height: 1px; background: var(--line-2); }
.lv-rule i { display: block; height: 100%; background: var(--ink); transform-origin: 0 50%; }
.lv-lh { margin: 0; }
.lv-bk { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.lv-bk li { display: grid; grid-template-columns: minmax(150px, 220px) minmax(0, 1fr) 36px; gap: 14px; align-items: center; font-size: 15px; }
.lv-bt { position: relative; height: 12px; background: var(--soft); box-shadow: inset 0 0 0 1px var(--line); }
.lv-bt i { position: absolute; inset: 0; background: var(--blue-900); transform: scaleX(var(--f)); transform-origin: 0 50%; }
.lv-bv { text-align: right; font-weight: 400; }
.lv-sup .lv-bn, .lv-sup .lv-bv { color: var(--muted); }
.lv-sup .lv-bt { background: var(--white); box-shadow: inset 0 0 0 1px var(--line-2); }

/* ---------- Scores proven over hidden test sets ---------- */
.lv-bd-rows { display: grid; gap: 22px; margin-bottom: 20px; }
.lv-ax, .lv-e { display: grid; grid-template-columns: minmax(150px, 220px) minmax(0, 1fr) 64px minmax(132px, 168px); gap: 14px; align-items: center; }
.lv-ax div { position: relative; height: 16px; border-bottom: 1px solid var(--line); }
.lv-ax i { position: absolute; bottom: 4px; transform: translateX(-50%); font: 10.5px/1 var(--mono); font-style: normal; color: var(--muted); }
.lv-ax i:first-child { transform: none; }
.lv-ax i:last-child { transform: translateX(-100%); }
.lv-set { display: grid; gap: 10px; }
.lv-sh { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.lv-sh .h4, .lv-sh .data { margin: 0; }
.lv-sh .data { color: var(--muted); font-size: 12px; }
.lv-en { font-size: 15px; }
.lv-et { position: relative; height: 12px; background: var(--soft); box-shadow: inset 0 0 0 1px var(--line); }
.lv-et i { position: absolute; inset: 0; background: var(--blue-900); transform: scaleX(var(--f)); transform-origin: 0 50%; }
.lv-e.base .lv-et i { background: var(--blue-300); }
.lv-ev { text-align: right; font-weight: 400; }
.lv-es { position: relative; display: inline-flex; align-items: center; gap: 8px; font-size: 11px; color: var(--muted); white-space: nowrap; }
.lv-es .lv-seal { position: static; flex: none; }

/* ---------- Seven genes from one genome ---------- */
.lv-gn-rd { row-gap: 20px; margin-bottom: 16px; }
.lv-pre .lv-gn-rd > * { opacity: 0; }

/* Before a build starts, the parts it brings in are hidden (the build ends on each element's own style). */
.lv-pre .lv-p, .lv-pre .lv-dupnote, .lv-pre .lv-lh, .lv-pre .lv-bk .lv-bn, .lv-pre .lv-bv, .lv-pre .lv-ax, .lv-pre .lv-sh, .lv-pre .lv-en, .lv-pre .lv-ev, .lv-pre .lv-es { opacity: 0; }
.lv-pre .lv-rule i, .lv-pre .lv-bt i, .lv-pre .lv-et i { transform: scaleX(0); }

@media (max-width: 760px) {
  .lv-bk li { grid-template-columns: minmax(0, 8.5em) minmax(0, 1fr) 28px; gap: 10px; font-size: 14px; }
  .lv-ax { display: none; }
  .lv-ax + .lv-set .lv-sh { border-top: 0; padding-top: 0; }
  .lv-e { grid-template-columns: minmax(0, 1fr) 64px; gap: 6px 12px; }
  .lv-e .lv-en { grid-column: 1 / -1; }
  .lv-e .lv-et { grid-column: 1; }
  .lv-e .lv-es { grid-column: 1 / -1; }
  .lv-ps { gap: 14px 12px; }
}