/* Assistant reading layer.
   These styles make long answers, study-guide sections, and structured content
   easier to read by controlling width, spacing, headings, and text rhythm. */
.bubble.assistant .bubble-text,
.response-card,
.response-content,
.response-body,
.assistant-structured {
  max-width: var(--reading-max-width);
}

.bubble.assistant .bubble-text,
.response-content,
.assistant-structured,
.section-body {
  font-size: var(--text-md);
  line-height: 1.72;
  letter-spacing: 0.005em;
  color: var(--text-primary);
  min-width: 0;
  overflow-wrap: anywhere;
}

.response-card {
  width: 100%;
}

.response-body,
.response-content,
.assistant-structured {
  display: grid;
  gap: var(--space-4);
}

.response-content > :last-child,
.assistant-structured > :last-child,
.section-body > :last-child {
  margin-bottom: 0;
}

.response-content p,
.assistant-structured p,
.section-body p,
.bubble.assistant .bubble-text p {
  margin: 0;
  color: var(--text-primary);
}

.response-content h2,
.assistant-structured h2,
.section-body h2 {
  font-size: clamp(1.15rem, 0.95rem + 0.45vw, 1.45rem);
  line-height: 1.36;
  letter-spacing: -0.01em;
  margin: var(--space-5) 0 var(--space-2);
  color: var(--text-heading);
}

.response-content h3,
.assistant-structured h3,
.section-body h3 {
  font-size: clamp(1.02rem, 0.94rem + 0.2vw, 1.2rem);
  line-height: 1.42;
  margin: var(--space-4) 0 var(--space-2);
  color: var(--text-heading);
}

.response-content ul,
.response-content ol,
.assistant-structured ul,
.assistant-structured ol,
.section-body ul,
.section-body ol,
.bubble.assistant .bubble-text ul,
.bubble.assistant .bubble-text ol {
  margin: 0;
  padding-left: 1.25rem;
  display: grid;
  gap: var(--space-2);
}

.response-content li,
.assistant-structured li,
.section-body li,
.bubble.assistant .bubble-text li {
  padding-left: var(--space-1);
}

.response-content blockquote,
.assistant-structured blockquote,
.section-body blockquote,
.response-summary,
.reference-panel,
.quiz-explanation {
  margin: 0;
  padding: var(--space-4) var(--space-5);
  border-radius: var(--radius-md);
  background: var(--surface-mint);
  border: 1px solid var(--border-mint);
  box-shadow: var(--shadow-inset);
  color: var(--text-heading);
}

.definition-block,
[data-block="definition"],
[data-role="definition"],
.response-content .callout,
.assistant-structured .callout {
  padding: var(--space-4) var(--space-5);
  border-radius: var(--radius-md);
  background: var(--surface-mint);
  border: 1px solid var(--border-mint);
  box-shadow: var(--shadow-inset), var(--shadow-sm);
}

.response-content code,
.assistant-structured code,
.section-body code,
.bubble.assistant .bubble-text code {
  font-family: var(--font-mono);
  font-size: 0.9em;
  border-radius: 6px;
  padding: 0.08rem 0.35rem;
  background: var(--color-accent-weak);
  color: var(--text-heading);
}

.response-content pre,
.assistant-structured pre,
.answer-pre,
.table-fallback {
  margin: 0;
  max-width: 100%;
  overflow: auto;
  border-radius: var(--radius-md);
  padding: var(--space-4) var(--space-5);
  background: var(--surface-pearl);
  border: 1px solid var(--border);
  color: var(--text-primary);
  line-height: 1.58;
  tab-size: 2;
  overscroll-behavior-x: contain;
}

.response-content pre code,
.assistant-structured pre code,
.answer-pre code {
  background: transparent;
  padding: 0;
  color: inherit;
}

.response-content table,
.assistant-structured table,
.AnswerTable,
.owen-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  border-radius: var(--radius-md);
  border: 1px solid var(--border);
  background: var(--surface-pearl);
  box-shadow: var(--shadow-inset), var(--shadow-sm);
  font-variant-numeric: tabular-nums;
}

.response-content thead th,
.assistant-structured thead th,
.AnswerTable thead th,
.owen-table thead th {
  background: var(--surface-mint);
  color: var(--text-heading);
  font-weight: 700;
  font-size: var(--text-sm);
}

.response-content th,
.response-content td,
.assistant-structured th,
.assistant-structured td,
.AnswerTable th,
.AnswerTable td,
.owen-table th,
.owen-table td {
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--border);
  border-right: 1px solid var(--border);
  vertical-align: top;
  text-align: left;
}

.response-content tr:last-child td,
.assistant-structured tr:last-child td,
.AnswerTable tr:last-child td,
.owen-table tr:last-child td {
  border-bottom: none;
}

.response-content th:last-child,
.response-content td:last-child,
.assistant-structured th:last-child,
.assistant-structured td:last-child,
.AnswerTable th:last-child,
.AnswerTable td:last-child,
.owen-table th:last-child,
.owen-table td:last-child {
  border-right: none;
}

.response-content .sources-list,
.sources-section .sources-list,
.sources-list {
  display: grid;
  gap: var(--space-2);
}

.citation-chip,
.cite,
.cite-badge,
.citation-sup .cite {
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 700;
  line-height: 1;
}

.section-heading,
.assistant-section-heading {
  font-family: var(--font-body);
  font-size: var(--text-lg);
  font-weight: 700;
  letter-spacing: -0.01em;
}

.response-toc {
  margin-bottom: var(--space-4);
}

.response-toc-items {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

@media (max-width: 720px) {
  .bubble.assistant .bubble-text,
  .response-card,
  .response-content,
  .response-body,
  .assistant-structured {
    max-width: 100%;
  }
}
