/* Panel 2, the book search: two search lanes, the fused list, the re-ranked top ten, the 1,024-token budget bar and the source card. */
.lanes { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; } /* the two searches side by side */
.lane { padding: 10px 12px; border-radius: 12px; background: rgb(255 255 255 / 0.06); } /* one search */
.lane-title { font: 600 13px/1.3 var(--mono); } /* search name */
.lane-title small { display: block; color: var(--world-tint); font: 500 12px var(--mono); } /* what it matches */
.lane-bars { display: grid; gap: 5px; margin-top: 10px; } /* ranked hits */
.lane-bars li, .fused-bars li, .rerank-list li { height: 9px; width: var(--w, 100%); border-radius: 5px; background: var(--world-tint); } /* one hit as a bar */
.lane-bars li { opacity: var(--r, 1); transform: translate3d(calc((1 - var(--r, 1)) * -24px), 0, 0); } /* hits slide in from the left */
.formula { margin-bottom: 10px; padding: 9px 12px; border-radius: 10px; background: rgb(255 255 255 / 0.08); font: 500 12.5px/1.45 var(--mono); } /* the fusion formula */
.fused-bars { display: grid; gap: 5px; } /* the fused list */
.fused-bars li { background: var(--amber); } /* fused hits in amber */
.rerank-list { display: grid; gap: 7px; } /* ten rows */
.rerank-list li { opacity: calc(0.4 + 0.6 * var(--r, 1)); transform: translate3d(0, calc((1 - var(--r, 1)) * var(--shift, 0px)), 0); } /* rows slide from the old order into the new one */
.rerank-list li.keeper { background: var(--amber); } /* the best three */
.budget { display: flex; height: 44px; border-radius: 10px; font: 500 12px/1.25 var(--mono); } /* the 1,024-token window as one bar */
.budget-part { display: grid; place-items: center; padding: 0 6px; text-align: center; min-width: 0; } /* a part of the window */
.budget-part.passages { background: var(--world-background); } /* retrieved passages */
.budget-part.template { background: rgb(255 255 255 / 0.12); } /* the question block */
.budget-part.reply { background: var(--amber); color: #1a1208; } /* room for the answer */
.source-card { display: grid; gap: 4px; padding: 12px 14px; border-radius: 12px; background: var(--world-background); font-size: 13.5px; } /* what the visitor sees under an answer */
.source-card span { font-weight: 600; } /* book and chapter line */
.source-card em { color: var(--world-tint); } /* the snippet line */
@media (max-width: 859px) { .lanes { grid-template-columns: 1fr; } .budget { height: 64px; font-size: 12px; } } /* narrow: lanes stack, bar text shrinks */