/* The belaying plan: filters and the list of lines beside the pinned drawing. */
.belay-side { padding: 14px 0 30vh; }
#belay-filters .chip-row h3 { min-width: 7em; }
#belay-list h3 { margin: 2rem 0 0.4rem; padding-top: 0.5rem; border-top: 1px solid var(--ink); font-weight: 400; font-size: 1.35rem; }
#belay-list .count { margin: 1rem 0 0; font: 400 0.82rem/1.5 var(--sans); color: var(--soft); }
.belay-row { border-bottom: 1px solid var(--rule); border-left: 2px solid transparent; margin-left: -14px; padding-left: 12px; }
.belay-row.active { border-left-color: var(--red); }
.belay-row > button { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 16px; width: 100%; padding: 7px 0; background: none; border: 0; text-align: left; color: var(--ink); font: 400 0.9rem/1.4 var(--serif); cursor: pointer; }
.belay-row > button b { font-weight: 700; }
.belay-row.active > button b { color: var(--red); }
.belay-row > button span { color: var(--green); font: 500 0.8rem/1.6 var(--sans); }
.belay-detail { padding: 2px 0 12px; font-size: 0.93rem; line-height: 1.55; }
.belay-detail h5 { margin: 0.6rem 0 0.2rem; font: 600 0.76rem/1.3 var(--sans); color: var(--soft); }
.belay-detail p { margin: 0 0 0.4rem; }
.closing h3 { margin: 1.5rem 0 0.2rem; font-weight: 700; font-size: 1.02rem; }
@media (max-width: 900px) { .belay-row { margin-left: 0; } }
.pinned svg.quiet .rope:not(.sel) { opacity: 0.16; }