/* FAQ block, dated records and Technical Notes (scripts/lib/components/disclosure.mjs):
   native <details> rows on hairlines, a plus that turns to a minus, and 44px summaries. */

.wfg-faq { display: grid; min-width: 0; }
.wfg-faq > :is(h2, h3) { margin: 0 0 .75rem; }
.wfg-faq-item { border-top: 1px solid var(--hairline); }
.wfg-faq-item:last-child { border-bottom: 1px solid var(--hairline); }
.wfg-faq-item :is(h3, h4) { margin: 0; font: var(--heading-weight) 1.02rem/1.3 var(--font-heading); letter-spacing: 0; color: var(--ink); }
.wfg-faq-answer { max-width: 66ch; padding: 0 0 .9rem; color: var(--ink-2); }
.wfg-faq-answer > :first-child { margin-top: 0; }
.wfg-faq.is-plain .wfg-faq-item { padding-top: .75rem; }
.wfg-faq.is-plain .wfg-faq-item :is(h3, h4) { margin-bottom: .35rem; }

.wfg-faq summary, .wfg-record summary {
  display: flex;
  align-items: center;
  gap: .75rem;
  min-height: 2.75rem;
  padding: .45rem 0;
  cursor: pointer;
  list-style: none;
}
.wfg-faq summary::-webkit-details-marker, .wfg-record summary::-webkit-details-marker { display: none; }
.wfg-faq summary::after, .wfg-record summary::after {
  content: "+";
  flex: none;
  margin-left: auto;
  width: 1.25rem;
  font: 400 1.2rem/1 var(--font-ui);
  text-align: center;
  color: var(--accent-text);
}
.wfg-faq details[open] > summary::after, .wfg-record[open] > summary::after { content: "\2212"; }
.wfg-faq summary:hover :is(h3, h4), .wfg-record summary:hover .wfg-record-title { color: var(--accent-text); }

.wfg-record { min-width: 0; border: 1px solid var(--edge); box-shadow: var(--shadow-inner); background: var(--panel); padding: 0 14px; }
.wfg-record + .wfg-record { margin-top: .5rem; }
.wfg-record summary { flex-wrap: wrap; gap: .1rem .75rem; }
.wfg-record summary time { flex: 0 1 auto; min-width: 0; font: 400 .8rem/1.3 var(--font-ui); letter-spacing: .04em; color: var(--ink-3); }
/* .wfg-record .wfg-record-title outranks `.prose h2` when a record sits in prose. */
.wfg-record .wfg-record-title { margin: 0; }
.wfg-record-title { margin: 0; font: var(--heading-weight) 1.2rem/1.25 var(--font-heading); letter-spacing: 0; color: var(--ink); }
.wfg-record-summary { flex-basis: 100%; order: 3; font-size: .88rem; line-height: 1.45; color: var(--ink-2); }
.wfg-record[open] .wfg-record-summary { display: none; }
.wfg-record-body { max-width: 66ch; padding: .25rem 0 1rem; color: var(--ink-2); }
.wfg-record-body > :first-child { margin-top: 0; }

/* Technical Notes: a quiet drawer under a block; builds, formulas and exact source wording. */
.wfg-tech-notes { margin-block: .75rem 1.25rem; min-width: 0; }
.wfg-tech-notes > summary { display: inline-flex; align-items: center; gap: .45rem; min-height: 2.75rem; color: var(--ink-2); font: 400 .9rem/1.3 var(--font-ui); cursor: pointer; list-style: none; }
.wfg-tech-notes > summary::-webkit-details-marker { display: none; }
.wfg-tech-notes > summary::after { content: "+"; width: 1rem; font: 400 1.05rem/1 var(--font-ui); text-align: center; color: var(--accent-text); }
.wfg-tech-notes[open] > summary::after { content: "\2212"; }
.wfg-tech-notes > summary:hover { color: var(--ink); }
.wfg-tech-notes-body { padding: .75rem .9rem; border-left: 2px solid var(--line-strong, var(--edge)); background: var(--bg, transparent); color: var(--ink-2); font-size: .9rem; line-height: 1.55; }
.wfg-tech-notes-body > :first-child { margin-top: 0; }
.wfg-tech-notes-body > :last-child { margin-bottom: 0; }
.wfg-tech-notes-body :is(ul, ol) { padding-left: 1.1rem; }
.wfg-tech-notes-body code { overflow-wrap: anywhere; }
