/* Shared Crew scrollbar skin.
   Keep only the document/outmost page rail untouched; all internal native and
   component-level scrollers inherit the gallery rail/thumb language. */
:not(#crewNativeScrollbarSpecificityBoost):not(html):not(body):not(.gallery__track):not(.inventory-groups):not(.scroll-rail):not(.scroll-rail *) {
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 159, 61, .68) rgba(255, 255, 255, .035);
}

:not(#crewNativeScrollbarSpecificityBoost):not(html):not(body):not(.gallery__track):not(.inventory-groups):not(.scroll-rail):not(.scroll-rail *)::-webkit-scrollbar {
  width: 10px;
  height: 10px;
  display: block;
}

:not(#crewNativeScrollbarSpecificityBoost):not(html):not(body):not(.gallery__track):not(.inventory-groups):not(.scroll-rail):not(.scroll-rail *)::-webkit-scrollbar-track {
  border-radius: 999px;
  background:
    linear-gradient(180deg, transparent, rgba(245, 241, 234, .12) 9%, rgba(245, 241, 234, .12) 91%, transparent),
    linear-gradient(90deg, transparent, rgba(255, 255, 255, .04) 12%, rgba(255, 255, 255, .04) 88%, transparent),
    rgba(0, 0, 0, .16);
}

:not(#crewNativeScrollbarSpecificityBoost):not(html):not(body):not(.gallery__track):not(.inventory-groups):not(.scroll-rail):not(.scroll-rail *)::-webkit-scrollbar-thumb {
  min-height: 48px;
  min-width: 48px;
  border: 2px solid transparent;
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(255, 238, 210, .22), rgba(255, 138, 61, .62), rgba(255, 238, 210, .18)) padding-box,
    linear-gradient(180deg, rgba(255, 198, 122, .44), rgba(255, 159, 61, .2)) border-box;
  box-shadow:
    0 6px 18px rgba(0, 0, 0, .28),
    inset 0 1px 0 rgba(255, 245, 226, .22);
}

:not(#crewNativeScrollbarSpecificityBoost):not(html):not(body):not(.gallery__track):not(.inventory-groups):not(.scroll-rail):not(.scroll-rail *)::-webkit-scrollbar-thumb:hover {
  background:
    linear-gradient(180deg, rgba(255, 238, 210, .28), rgba(255, 166, 72, .76), rgba(255, 238, 210, .24)) padding-box,
    linear-gradient(180deg, rgba(255, 214, 156, .62), rgba(255, 159, 61, .3)) border-box;
  box-shadow:
    0 9px 22px rgba(0, 0, 0, .34),
    0 0 16px rgba(255, 138, 61, .11),
    inset 0 1px 0 rgba(255, 245, 226, .28);
}

:not(#crewNativeScrollbarSpecificityBoost):not(html):not(body):not(.gallery__track):not(.inventory-groups):not(.scroll-rail):not(.scroll-rail *)::-webkit-scrollbar-corner {
  background: transparent;
}

.gallery__scrollbar,
.inventory-scrollbar {
  opacity: .92;
}

.gallery__scrollbar::before,
.inventory-scrollbar::before {
  background: linear-gradient(var(--crew-scroll-axis, 90deg), transparent, rgba(245, 241, 234, .22) 8%, rgba(245, 241, 234, .22) 92%, transparent);
}

.gallery__scrollbar {
  --crew-scroll-axis: 90deg;
}

.inventory-scrollbar {
  --crew-scroll-axis: 180deg;
}

.gallery__rail,
.inventory-scrollbar__rail {
  background:
    linear-gradient(var(--crew-scroll-axis), transparent, rgba(255, 255, 255, .065) 8%, rgba(255, 255, 255, .065) 92%, transparent),
    rgba(255, 255, 255, .025);
}

.gallery__rail::before,
.inventory-scrollbar__rail::before {
  background: linear-gradient(var(--crew-scroll-axis), transparent, rgba(255, 198, 122, .82) 12%, rgba(255, 138, 61, .72) 50%, rgba(255, 198, 122, .62) 88%, transparent);
  box-shadow: 0 0 14px rgba(255, 138, 61, .14);
}

.gallery__thumb,
.inventory-scrollbar__thumb {
  border-color: rgba(255, 198, 122, .42);
  background:
    linear-gradient(var(--crew-scroll-axis), rgba(255, 238, 210, .18), rgba(255, 138, 61, .46), rgba(255, 238, 210, .16)),
    rgba(15, 12, 10, .86);
  box-shadow:
    0 8px 18px rgba(0, 0, 0, .34),
    inset 0 1px 0 rgba(255, 245, 226, .22);
}

.gallery__thumb:hover,
.gallery__thumb:focus-visible,
.gallery__thumb.is-dragging,
.inventory-scrollbar__thumb:hover,
.inventory-scrollbar__thumb:focus-visible,
.inventory-scrollbar__thumb.is-dragging {
  border-color: rgba(255, 214, 156, .72);
  background:
    linear-gradient(var(--crew-scroll-axis), rgba(255, 238, 210, .24), rgba(255, 166, 72, .58), rgba(255, 238, 210, .22)),
    rgba(18, 13, 9, .9);
  box-shadow:
    0 10px 24px rgba(0, 0, 0, .38),
    0 0 18px rgba(255, 138, 61, .12),
    inset 0 1px 0 rgba(255, 245, 226, .28);
  outline: none;
}

.gallery__thumb:focus-visible,
.inventory-scrollbar__thumb:focus-visible {
  box-shadow:
    0 0 0 2px rgba(255, 138, 61, .55),
    0 10px 24px rgba(0, 0, 0, .38),
    inset 0 1px 0 rgba(255, 245, 226, .28);
}

@media (pointer: coarse) {
  :not(#crewNativeScrollbarSpecificityBoost):not(html):not(body):not(.gallery__track):not(.inventory-groups):not(.scroll-rail):not(.scroll-rail *)::-webkit-scrollbar {
    width: 6px;
    height: 6px;
  }
}