.venue {
  font-family: 'Google Sans', sans-serif;
  font-size: 1.35rem;
  font-weight: 600;
  color: #363636;
  margin: -0.5rem 0 1rem;
}

.venue-tag {
  display: inline-block;
  margin-left: 0.35rem;
  padding: 0.05rem 0.65rem;
  border-radius: 999px;
  background: rgba(0, 180, 139, 0.12);
  color: #00765b;
  font-size: 1.05rem;
  vertical-align: 0.1rem;
}

.publication-links {
  margin-top: 1rem;
}

.figure-img {
  display: block;
  width: 100%;
  margin: 0 auto;
}

.figure-img.narrow {
  max-width: 820px;
}

.figure-caption {
  margin-top: 1rem;
  color: #4a4a4a;
  text-align: justify;
}

.figure-caption.caption-above {
  margin: 0 0 1rem;
}

.legend {
  padding: 0 0.3rem;
  border-radius: 3px;
}

.legend.best,
.results td.best {
  background: rgba(0, 180, 139, 0.12);
  color: #00765b;
}

.legend.second,
.results td.second {
  background: rgba(239, 99, 75, 0.12);
  color: #b5361f;
}

.results {
  width: 100%;
  font-size: 0.85rem;
  background: transparent;
}

.table.results th,
.table.results td {
  padding: 0.3rem 0.45rem;
  text-align: right;
  white-space: nowrap;
  vertical-align: middle;
}

.table.results th {
  text-align: center;
}

.table.results thead th:first-child {
  text-align: left;
}

.results td.method {
  text-align: left;
}

.results tr.ours td.method {
  font-weight: 700;
  color: #00765b;
}

.results tbody + tbody {
  border-top: 2px solid #dbdbdb;
}

/* One row per teacher names the pair of the panel below it; the row after it carries the student sizes. */
.results tr.panel th {
  text-align: left;
  font-weight: 600;
  padding-top: 0.6rem;
  border-bottom: none;
}

.results tr.sub th {
  font-weight: 600;
  color: #4a4a4a;
  border-bottom: 1px solid #dbdbdb;
}

.results tr.sub th.method {
  text-align: left;
}

.results tr.anchor td {
  color: #6a6a6a;
}

.results td[colspan] {
  text-align: center;
}

.results tr.anchor + tr:not(.anchor) td {
  border-top: 1px solid #dbdbdb;
}

.results .pm {
  color: #8a8a8a;
  font-size: 0.78em;
}

/* Released checkpoints: one row per cell of the main table, two Hugging Face links each. */
.checkpoints {
  width: 100%;
  font-size: 0.9rem;
  background: transparent;
}

.table.checkpoints th,
.table.checkpoints td {
  padding: 0.35rem 0.6rem;
  vertical-align: middle;
  white-space: nowrap;
}

.table.checkpoints th {
  text-align: left;
}

.table.checkpoints td.env {
  font-weight: 600;
}

.table.checkpoints tbody + tbody {
  border-top: 2px solid #dbdbdb;
}

.table.checkpoints code {
  background: transparent;
  color: inherit;
  padding: 0;
  font-size: 0.92em;
}

.resource {
  height: 100%;
}

.resource-title {
  font-family: 'Google Sans', sans-serif;
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: 0.5rem;
}

/* Title lines are sized to the title's width: the second line (about 30em) takes 94% of it at 3.2cqi, so it
   stays on one line; on phones it wraps into balanced rows and the first line stays whole. */
.publication-title {
  container-type: inline-size;
}

.publication-title .title-line {
  display: block;
  font-size: max(3.2cqi, min(7cqi, 1.75rem));
  text-wrap: balance;
}

.publication-title .title-line:first-child {
  font-size: max(4cqi, min(7cqi, 1.75rem));
}

/* Bulma centers .container with auto margins, which makes it shrink-to-fit inside a .hero (a flex
   column); a full width keeps wide content such as the results table inside the viewport. */
.hero > .container {
  width: 100%;
}

.nowrap {
  white-space: nowrap;
}

@media screen and (max-width: 768px) {
  .has-text-justified,
  .figure-caption {
    text-align: left !important;
  }

  .table.results td.method,
  .table.results tr.sub th.method {
    position: sticky;
    left: 0;
    z-index: 1;
    background: #f5f5f5;
    box-shadow: inset -1px 0 0 #dbdbdb;
  }
}

.icon-svg {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
}

@media print {
  .table-container {
    overflow: visible;
  }

  #BibTeX pre {
    white-space: pre-wrap;
  }
}
