/* /pdf-to-markdown/: the report the page IS. Three pieces the shared sheets
   have no shape for: the reading-order wireframe, the per-page rows, and the
   block list where each block says what produced it. Kit tokens only. */

.md-report { margin: 1.1rem 0 0; }
.md-report .md-h { font-size: 1rem; margin: 1.2rem 0 0.35rem; }
.md-report .md-h:first-child { margin-top: 0; }

/* The wireframe: the page's line boxes at the page's own proportions, each
   numbered, with a thin path through them in the order they come out. */
.wire {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel);
  padding: 0.5rem;
  overflow-x: auto;
}
.wire svg { display: block; width: 100%; height: auto; max-width: 24rem; margin: 0 auto; }
.wire .wl { fill: var(--accent-soft); stroke: var(--line-strong); stroke-width: 1; }
/* Sized in the page's own units (the viewBox is the page box, 612 wide for
   Letter), so a number stays about 8 px tall on a phone. */
.wire .wn { fill: var(--ink); font-size: 16px; font-family: var(--mono); }
.wire .wp { fill: none; stroke: var(--accent); stroke-width: 1.5; opacity: 0.55; }

/* One row per page, so a 126-page booklet cannot average its way to a green
   light. The rows are buttons: pressing one draws that page's wireframe and
   lists that page's blocks. */
.pagerows { list-style: none; padding: 0; margin: 0.4rem 0 0; max-height: 22rem; overflow-y: auto; }
.pagerows li { margin: 0 0 0.35rem; }
.pagerows button {
  display: block;
  width: 100%;
  text-align: left;
  font: inherit;
  color: inherit;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel);
  padding: 0.45rem 0.7rem;
  cursor: pointer;
}
.pagerows button[aria-current="true"] { border-color: var(--accent); background: var(--accent-soft); }
.pagerows .p-n { font-weight: 700; margin-right: 0.5rem; }
.pagerows .p-meta { font-family: var(--mono); font-size: 0.78rem; color: var(--ink-soft); overflow-wrap: anywhere; }
.pagerows li.warn button { border-left: 3px solid var(--fail); }

/* The blocks, with the evidence beside each one. */
.blocks { margin: 0.4rem 0 0; padding: 0 0 0 1.4rem; }
.blocks li { margin: 0 0 0.6rem; }
.blocks .b-text { display: block; overflow-wrap: anywhere; white-space: pre-wrap; }
.blocks .b-why { display: block; font-family: var(--mono); font-size: 0.75rem; color: var(--ink-soft); margin: 0.15rem 0 0.25rem; }
.blocks .b-btns { display: flex; flex-wrap: wrap; gap: 0.4rem; }
/* 16px on anything a phone can focus, so the browser does not zoom. */
.blocks .b-btns .btn { font-size: 1rem; padding: 0.25rem 0.6rem; }
