/* ============================================================
   answer.css -- ANSWER-ERA A-3, webapp/templates/public/answer.html only.
   MARKER: A75-ANSWERPAGE-20260731-MARKER

   Consumes ONLY --nk-* tokens from nika-tokens.css + the shared primitives
   already in shell.css (.nk-card, .nk-btn, .nk-btn-outline, .nk-btn-cerise,
   .nk-chip, .nk-chip-muted, .nk-soon, .nk-note) -- this file adds ONLY the
   rules answer.html needs that shell.css does not already define. Stock
   Tailwind is BANNED on this platform (Tracy's simplified-Tailwind).
   ============================================================ */

/* ---- grounding badge (C4) ----------------------------------------- */
.nk-badge {
  display: inline-block;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .02em;
  padding: 5px 12px;
  border-radius: 999px;
  border: 1px solid var(--nk-border);
  margin: 0 0 14px;
}
.nk-badge-grounded {
  color: var(--nk-azure-deep);
  border-color: var(--nk-azure);
  background: var(--nk-azure-soft);
}
.nk-badge-model {
  color: var(--nk-muted);
  border-color: var(--nk-border);
  background: var(--nk-cream-2);
}

/* ---- eyebrow (the question, as asked) ------------------------------ */
.nk-eyebrow {
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--nk-muted-soft);
  margin: 0 0 6px;
}

/* ---- the answer card ------------------------------------------------ */
.nk-answer-card { padding: 26px 28px; }
.nk-answer-body {
  font-family: var(--nk-serif);
  font-size: 17px;
  line-height: 1.65;
  color: var(--nk-ink);
}
.nk-answer-body h1, .nk-answer-body h2, .nk-answer-body h3 { font-family: var(--nk-serif); margin: 20px 0 8px; }
.nk-answer-body p { color: var(--nk-ink); margin: 0 0 14px; }
.nk-answer-body ul, .nk-answer-body ol { margin: 0 0 14px; padding-left: 22px; }
.nk-answer-body a { color: var(--nk-azure-deep); }
.nk-answer-note { font-size: 12.5px; color: var(--nk-muted); margin-top: 10px; }

/* ---- sources (C5) ---------------------------------------------------- */
.nk-sources summary, .nk-structured summary, .nk-model-answers summary {
  cursor: pointer;
  font-weight: 600;
  font-size: 14.5px;
  color: var(--nk-ink);
  padding: 2px 0;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.nk-sources[open] summary, .nk-structured[open] summary, .nk-model-answers[open] summary { margin-bottom: 14px; }
.nk-source-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.nk-source-row { border-top: 1px solid var(--nk-border-soft); padding-top: 12px; }
.nk-source-row:first-child { border-top: none; padding-top: 0; }
.nk-source-main { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.nk-source-n { font-weight: 700; color: var(--nk-azure-deep); font-size: 13px; }
.nk-source-domain { font-size: 12px; color: var(--nk-muted-soft); }
.nk-source-meta { margin-top: 6px; }
.nk-source-excerpt { font-size: 13.5px; color: var(--nk-muted); margin: 6px 0 0; }

.nk-source-badge {
  display: inline-block;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .02em;
  padding: 3px 10px;
  border-radius: 999px;
  border: 1px solid var(--nk-border);
}
.nk-source-badge-verified { color: var(--nk-ok); border-color: var(--nk-ok); background: #eaf3ec; }
.nk-source-badge-known { color: var(--nk-azure-deep); border-color: var(--nk-azure); background: var(--nk-azure-soft); }
.nk-source-badge-not-checked { color: var(--nk-muted); border-color: var(--nk-border); background: var(--nk-cream-2); }

/* ---- structured blocks (secondary) ----------------------------------- */
.nk-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
@media (max-width: 640px) { .nk-grid-2 { grid-template-columns: 1fr; } }

/* ---- model-answers placeholder --------------------------------------- */
.nk-muted-note { font-size: 13.5px; color: var(--nk-muted-soft); margin: 0; }

/* ---- interpretation buttons (C7) -------------------------------------- */
.nk-actions-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.nk-inline-form { display: inline-block; margin: 0; }

/* ---- engines-used chip row (parity with report.html) ------------------ */
.nk-chip-row { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 18px 0 8px; }
.nk-chip-label { font-size: 12.5px; color: var(--nk-muted); }
