:root {
  --accent: #2563eb;
  --ink: #0f172a;
}

body {
  color: var(--ink);
}

div.document {
  width: min(1120px, 94vw);
}

div.body {
  max-width: 900px;
}

table.rag-results {
  border-collapse: collapse;
  display: block;
  max-width: 100%;
  overflow-x: auto;
  width: 100%;
  margin: 1rem 0 1.5rem;
}

table.rag-results caption {
  font-weight: 700;
  margin-bottom: 0.6rem;
}

table.rag-results th,
table.rag-results td {
  border: 1px solid #cbd5e1;
  padding: 0.55rem;
  text-align: center;
}

table.rag-results th {
  background: #eff6ff;
}

.plotly-frame {
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  width: 100%;
  height: 560px;
}

.experiment-note {
  border-left: 4px solid var(--accent);
  background: #eff6ff;
  padding: 0.8rem 1rem;
  margin: 1rem 0;
}

@media (max-width: 680px) {
  div.document,
  div.body {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    margin: 0 auto;
  }

  div.body {
    padding: 0 1rem;
  }

  h1,
  h2,
  h3 {
    overflow-wrap: anywhere;
  }

  div.math {
    max-width: 100%;
    overflow-x: auto;
  }

  div.sphinxsidebar {
    display: none;
  }

  table.rag-results {
    font-size: 0.78rem;
  }

  table.rag-results th,
  table.rag-results td {
    padding: 0.35rem;
  }

  .plotly-frame {
    height: 430px;
  }
}