/* Chat coding — reuses palette/legend classes from template coding; only the
   chat legend container and the highlight base rule are new. Per-code
   ::highlight rules are injected at runtime by chat-coding.js. */
#chatCodeLegend { display: none; gap: 14px; flex-wrap: wrap; align-items: center; padding: 9px 14px;
  background: #fbfbfd; border-radius: 10px; margin: 8px 0; font-size: 12.5px; }
body.chat-coding-on #chatCodeLegend { display: flex; }
.chat-code-purpose { flex-basis: 100%; color: var(--muted, #6b7280); }
body.dark-mode #chatCodeLegend { background: #1f1f1f; }
#chatCodeLegend .leg { display: inline-flex; align-items: center; gap: 6px; }
#chatCodeLegend .leg .prov-dot { width: 11px; height: 11px; border-radius: 3px; display: inline-block; }
body.chat-coding-on #output { cursor: text; }