/* The two highlight marks, gold for AUTHENTIC and grey for FLAGGED.
   A VERBATIM COPY of the block in /styles.css (search "highlight-authentic"),
   for pages that do not load styles.css: the sign-in page's worked sample
   (#447) and, from #448, the share page, which had drifted to its own gold.
   scripts/test-highlights-copy.js fails the push if the two ever differ, the
   same convention as extension/tokens.css. Edit styles.css, then re-copy. */
.highlight-authentic {
  background: linear-gradient(135deg, #fef3c7 60%, #fde68a);
  border-bottom: 2px solid #9A5B08;
  color: #78350f;
  border-radius: 2px;
  padding: 1px 3px;
  cursor: help;
}
.highlight-suspect {
  background: #e7e3da;
  border-bottom: 2px solid #78716c;
  color: #44403c;
  border-radius: 2px;
  padding: 1px 3px;
  cursor: help;
}

/* Dark mode. The light values above are pale washes carrying dark text; on an
   indigo-ink ground they would be two bright slabs, so the relationship is
   inverted rather than the hues being reused: a dim ground with the gold and
   the grey carried by the border and the text. */
html.dark .highlight-authentic {
  background: rgba(217, 119, 6, 0.16);
  border-bottom-color: #f0b849;
  color: #fbe3ad;
}
html.dark .highlight-suspect {
  background: rgba(168, 162, 158, 0.14);
  border-bottom-color: #a8a29e;
  color: #ddd8d2;
}