@media screen and (min-width: 768px) and (forced-colors: none) {
  :is(html, .page-scroll) {
    --scroll-thumb: color-mix(in srgb, var(--frame-bg, #1e2532) 76%, white);
    --scroll-track: color-mix(in srgb, var(--frame-bg, #1e2532) 10%, #f1f5f9);
  }

  :is(html, .page-scroll)::-webkit-scrollbar {
    width: 10px;
  }

  :is(html, .page-scroll)::-webkit-scrollbar-track:vertical,
  :is(html, .page-scroll)::-webkit-scrollbar-thumb:vertical {
    box-shadow: inset 0 0 6px rgb(0 0 0 / 20%);
  }

  :is(html, .page-scroll)::-webkit-scrollbar-track:vertical {
    background-color: var(--scroll-track);
  }

  :is(html, .page-scroll)::-webkit-scrollbar-thumb:vertical {
    background-color: var(--scroll-thumb);
  }

  @supports not selector(::-webkit-scrollbar) {
    :is(html, .page-scroll) {
      scrollbar-width: thin;
      scrollbar-color: var(--scroll-thumb) var(--scroll-track);
    }
  }
}