::selection {
  color: var(--color-primary-foreground);
  background-color: var(--color-primary);
}

:where([tabindex]) {
  outline: 0;
}

:where(button),
:where([type="checkbox"]),
:where([type="radio"]),
:where([role="button"]),
:where(summary) {
  touch-action: manipulation;
  user-select: none;
}

:where(button:enabled),
:where([type="checkbox"]:enabled),
:where([type="radio"]:enabled),
:where([role="button"]:not([aria-disabled="true"])),
:where(summary) {
  cursor: var(--cursor-pointer, pointer);
}

:where(svg:not([width])) {
  width: 1.25rem;
}

:where(svg:not([height])) {
  height: 1.25rem;
}

:where(hr) {
  background-color: color-mix(in var(--default-color-space), currentcolor 100%, transparent);
  block-size: 1px;
  inline-size: 100%;
}

:where(code) {
  padding: calc(var(--spacing) * 1) calc(var(--spacing) * 2);
  background-color: var(--color-body-secondary);
  border-radius: var(--radius-sm);
  color: var(--color-accent);
}

:where(kbd) {
  padding: calc(var(--spacing) * 1) calc(var(--spacing) * 2);
  background: var(--color-body-secondary);
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-body-tertiary);
}

:where(html) {
  color-scheme: var(--default-color-scheme);
  font-family: var(--font-primary);
  font-weight: var(--font-weight-normal);
  block-size: 100%;
  line-height: 1.5;
  text-size-adjust: 100%;

  @media (prefers-reduced-motion: no-preference) {
    scroll-behavior: smooth;
  }
}

:where(body) {
  background-color: var(--color-body);
  color: var(--color-main);
  accent-color: var(--color-accent);
  min-block-size: 100%;
  display: flex;
  flex-direction: column;
  overflow-x: clip;
}

[hidden] {
  display: none !important;
}