/* Keep native scrolling and system high-contrast controls. */
@media (forced-colors: none) {
  :root {
    --scroll-track: #f1f4ec;
    --scroll-thumb: #9caf83;
    --scroll-thumb-hover: #819967;
    --scroll-thumb-active: #6d874f;
  }

  .sidebar {
    --scroll-track: #252924;
    --scroll-thumb: #667853;
    --scroll-thumb-hover: #8ba76d;
    --scroll-thumb-active: #b4d67e;
  }

  @supports selector(::-webkit-scrollbar) {
    ::-webkit-scrollbar {
      width: 12px;
      height: 12px;
    }
    ::-webkit-scrollbar-track {
      background: var(--scroll-track);
      border-radius: 999px;
    }
    ::-webkit-scrollbar-thumb {
      min-width: 40px;
      min-height: 40px;
      border: 3px solid var(--scroll-track);
      border-radius: 999px;
      background: var(--scroll-thumb);
    }
    ::-webkit-scrollbar-thumb:hover {
      background: var(--scroll-thumb-hover);
    }
    ::-webkit-scrollbar-thumb:active {
      background: var(--scroll-thumb-active);
    }
    ::-webkit-scrollbar-button {
      display: none;
      width: 0;
      height: 0;
    }
    ::-webkit-scrollbar-corner {
      background: var(--scroll-track);
    }
  }

  @supports not selector(::-webkit-scrollbar) {
    * {
      scrollbar-width: thin;
      scrollbar-color: var(--scroll-thumb) var(--scroll-track);
    }
  }
}
