/* Review TOC */
.rrtoc{
  --rrtoc-ink:#0b1e2d;
  --rrtoc-muted:#52606d;
  --rrtoc-chip:#ffffff;
  --rrtoc-chip-border:#c7d6e2;
  --rrtoc-star:#a16207;
  margin:14px 0 18px;
}

.rrtoc[data-variant="chips"] .rrtoc-chips{
  display:flex;
  flex-wrap:nowrap;
  gap:10px;
  margin:0;
  padding:0;
  overflow:auto;
  list-style:none;
  scroll-snap-type:x mandatory;
}

.rrtoc[data-variant="panel"] .rrtoc-chips{
  display:block;
  margin:0;
  padding:0;
  list-style:none;
}

.rrtoc[data-variant="panel"] .rrtoc-chips li{
  margin:6px 0;
}

.rrtoc .rrtoc-chips li{
  list-style:none;
}

.rrtoc .rrtoc-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  max-width:100%;
  padding:8px 12px;
  border:1px solid var(--rrtoc-chip-border);
  border-radius:999px;
  background:var(--rrtoc-chip);
  color:var(--rrtoc-ink);
  text-decoration:none;
  white-space:nowrap;
  scroll-snap-align:start;
}

.rrtoc[data-variant="panel"] .rrtoc-chip{
  display:block;
  width:100%;
}

.rrtoc a.rrtoc-chip:hover{
  opacity:.92;
}

.rrtoc .rrtoc-num{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:20px;
  height:20px;
  padding:0 6px;
  border-radius:6px;
  background:#0e5aa7;
  color:#fff;
  font-size:12px;
  font-weight:700;
}

.rrtoc .rrtoc-text{
  font-weight:600;
}

.rrtoc .rrtoc-rate{
  margin-left:6px;
  color:var(--rrtoc-star);
  font-weight:700;
  font-variant-numeric:tabular-nums;
}

.rrtoc .rrtoc-empty{
  color:var(--rrtoc-muted);
}

@media (min-width:1024px){
  .rrtoc[data-sticky="1"]{
    position:sticky;
    top:82px;
    z-index:2;
  }
}

@media (max-width:1100px){
  .rrtoc[data-variant="chips"] .rrtoc-chips{
    flex-wrap:wrap;
    justify-content:center;
    gap:10px 12px;
    overflow:visible;
    scroll-snap-type:none;
  }

  .rrtoc .rrtoc-chip{
    white-space:normal;
    text-align:center;
    justify-content:center;
  }

  .rrtoc[data-sticky="1"]{
    position:static;
    top:auto;
  }
}

@media (max-width:768px){
  .rrtoc .rrtoc-chip{
    max-width:100%;
    text-overflow:ellipsis;
  }
}
