/* ============================================================================
   scroll-rail.css — mobildeki kaydırma göstergesi
   Sadece mobilde görünür; masaüstünde .app kaymadığı için gereksiz.
   ============================================================================ */

.scroll-rail { display: none; }

@media (max-width: 860px) {
  .scroll-rail {
    display: block;
    position: fixed;
    top: 0;
    right: 3px;
    width: 3px;
    height: 100dvh;
    padding-block: 8px;

    z-index: 20;
    pointer-events: none;   /* içeriğe dokunmayı engellemesin */

    /* Kaydırırken görünür, hareketsizlikte kaybolur (scrollRail.js -> HIDE_DELAY).
       Görünürken anında gelsin, kaybolurken yumuşasın. */
    opacity: 0;
    transition: opacity 0.5s ease;
  }

  .scroll-rail.is-active {
    opacity: 1;
    transition: opacity 0.12s ease;
  }

  .scroll-rail__thumb {
    width: 100%;
    border-radius: 2px;
    background: var(--scroll-accent, var(--line));

    /* Renk her panel geçişinde değişiyor; sert atlamak yerine yumuşasın */
    transition: background-color 0.45s ease;
  }
}

/* Not: hareket azaltma tercihinde geçişleri base.css genel olarak kısıyor,
   burada ayrıca bir kural gerekmiyor. */