.tabs {
  display: flex;
  gap: 38px;
  margin: 36px 0 18px;
  border-bottom: 1px solid var(--rule-2);
  padding-bottom: 0;
  flex-wrap: wrap;
}
.tab {
  background: none;
  border: none;
  padding: 6px 0 14px;
  cursor: pointer;
  font-family: "Fraunces", serif;
  font-variation-settings: "opsz" 36, "SOFT" 60;
  font-style: italic;
  font-weight: 400;
  font-size: 26px;
  color: var(--muted);
  position: relative;
  transition: color 0.25s;
  letter-spacing: -0.01em;
}
.tab:hover { color: var(--ink-2); }
.tab.active {
  color: var(--ink);
  font-variation-settings: "opsz" 36, "SOFT" 100;
}
.tab.active::after {
  content: "";
  position: absolute;
  left: 0; right: 0;
  bottom: -1px;
  height: 3px;
  background: var(--stamp);
}
.tab .count {
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  font-style: normal;
  color: var(--muted);
  margin-left: 6px;
  vertical-align: super;
  letter-spacing: 0;
}
.tab-fav .star {
  color: var(--stamp);
  font-style: normal;
  margin-right: 6px;
  display: inline-block;
  font-size: 18px;
  vertical-align: -1px;
}
.tab-fav.active .star { color: var(--stamp); }