#typst-toolbar-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-inline-start: 0.75rem;
}

.typst-toolbar-icon svg {
  pointer-events: none;
  cursor: pointer;
  display: block;
  width: 100%;
  height: 100%;
}
.typst-toolbar-icon path {
  pointer-events: bounding-box;
  cursor: pointer;
}

.typst-toolbar-icon {
  --fill-color: var(--typst-preview-toolbar-fg-color);
}

#typst-toolbar-title,
.typst-page-button,
.typst-page-number-indicator,
#typst-page-selector,
.typst-page-selector-divider {
  font-size: 0.6rem;
  font-weight: 500;
  font-family: 'Segoe UI', Arial, 'Microsoft Yahei', sans-serif;
}

.typst-page-button {
  width: 1rem;
  height: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.typst-page-button:hover {
  background: rgba(0, 0, 0, 0.5);
  border: 0px solid #000;
  border-radius: 3px;
  cursor: pointer;
}

.typst-page-selector-content {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  height: 1rem;
}

#typst-page-selector {
  width: calc(max(2, var(--page-length-digits)) * 1ch + 1px);
  height: 0.8rem;
  background: rgba(0, 0, 0, 0.5);
  border: none;
  color: #fff;
  font-family: inherit;
  line-height: inherit;
  outline: 0;
  padding: 0 var(--page-selector-spacing);
  text-align: center;
}

.typst-page-number-indicator {
  text-align: center;
}
