#main-content {
  outline: none;
}

#main-content:focus-visible {
  outline: none;
}


/* Scrollbar Refinement */
::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--text-main) 18%, transparent);
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background: color-mix(in srgb, var(--text-main) 28%, transparent);
}

.page {
  max-width: 1000px;
  margin: 0 auto;
  padding: var(--space-page) var(--space-page-x);
  padding-top: calc(var(--space-page) + var(--safe-top, 0px));
  padding-bottom: calc(var(--space-page) + var(--safe-bottom));
}

@media (max-width: 560px) {
  .page {
    --space-page: 22px;
    --space-page-x: 14px;
  }
}