/* ═══════════════════════════════════════════════════════════════════════
   Search results — two kinds in one list

   Questions come from memory and appear on the keystroke. Answers come from a
   sharded index over the network and land a moment later. They share one list
   deliberately: two panels, or a list that is empty and then jumps, both read
   as the search being broken.
   ══════════════════════════════════════════════════════════════════════ */

/* Section headers inside the list. Not selectable, not counted. */
.idx-head {
  display: block;
  padding: 1.1em .8em .5em;
  font-family: var(--mono);
  font-size: .78rem;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--gold-dim);
  border-bottom: 1px solid rgba(224, 183, 101, .12);
  cursor: default;
}
.idx-head:first-child { padding-top: .2em; }
.idx-head b {
  font-family: var(--serif);
  font-weight: 400;
  font-size: 1.15em;
  letter-spacing: 0;
  color: var(--bone-dim);
  margin-left: .6em;
}

/* An answer result. The speaker's name leads, because in a list of things
   people said, who said it is the first thing you want. */
#index-list li.idx-said .q { line-height: 1.4; }
#index-list li.idx-said .q b {
  font-family: var(--mono);
  font-size: .84rem;
  font-weight: 400;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--accent);
  margin-right: .7em;
  white-space: nowrap;
}
#index-list li.idx-said .said {
  color: var(--bone-dim);
  font-style: italic;
}

/* The matched words. Marked rather than merely coloured, so it survives a
   high-contrast mode and reads for anyone who cannot separate gold from bone. */
#index-list li.idx-said em {
  font-style: italic;
  color: var(--bone);
  background: rgba(224, 183, 101, .16);
  border-bottom: 1px solid rgba(224, 183, 101, .5);
  padding: 0 .12em;
}

#index-list li.idx-said .t {
  font-family: var(--mono);
  font-size: .74rem;
  letter-spacing: .1em;
  color: var(--gold-dim);
  text-transform: none;
}

@media (max-width: 860px) {
  .idx-head { font-size: .8rem; letter-spacing: .16em; }
  #index-list li.idx-said .q b { display: block; margin-bottom: .25em; }
  #index-list li.idx-said .said { font-size: .95rem; }
}