/* Codex Sacra — on top of Pico */
.scripture { line-height: 1.9; font-size: 1.05rem; }
.scripture .verse sup { color: var(--pico-muted-color); font-weight: 600; margin-right: .15em; }
.scripture .verse:target { background: var(--pico-mark-background-color); }

.bookgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); gap: .25rem 1rem; margin-bottom: 1.5rem; }

.chapter-nav { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin: 1rem 0; }
.chapter-nav select { width: auto; display: inline-block; margin: 0; padding: .25rem 1.75rem .25rem .5rem; }

.navpick { display: flex; flex-wrap: wrap; gap: .3rem; margin: -.85rem 0 .5rem; }
.navgroup {
  display: inline-flex; align-items: stretch;
  border: 1px solid var(--pico-muted-border-color);
  border-radius: .45rem; overflow: hidden;
  background: var(--pico-card-background-color);
}
.navgroup .cell {
  display: flex; flex-direction: column;
  padding: .18rem .5rem .22rem;
  border-right: 1px solid var(--pico-muted-border-color);
}
.navgroup .cell:last-of-type { border-right: none; }
.navgroup small {
  font-size: .52rem; line-height: 1; margin-bottom: .12rem;
  text-transform: uppercase; letter-spacing: .07em; font-weight: 700;
  color: var(--pico-muted-color);
}
.navgroup select {
  border: none; box-shadow: none; background-color: transparent;
  width: auto; height: 1.15rem; margin: 0;
  padding: 0 .9rem 0 0; font-size: .78rem; line-height: 1.15rem;
  background-position: right center; background-size: .65em;
  border-radius: 0; color: var(--pico-color);
}
.navgroup select:focus { outline: none; box-shadow: none; }
.navgroup button {
  width: auto; margin: 0; padding: 0 .55rem; height: auto;
  border: none; border-left: 1px solid var(--pico-muted-border-color);
  border-radius: 0; background: transparent;
  color: var(--pico-primary); font-size: .85rem;
}
/* select widths are set by app.js: longest option + 3ch, fixed */

table.compare td { vertical-align: top; font-size: .92rem; line-height: 1.55; }
table.compare .absent { color: var(--pico-muted-color); font-style: italic; }
table.compare .nativeref { color: var(--pico-primary); font-weight: 600; }

#pick fieldset { display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; }
#pick label { white-space: nowrap; font-size: .9rem; }

ul.results li { margin-bottom: .75rem; }
mark { padding: 0 .1em; }