/* Native viewport scrollbar: no overlay, replacement thumb or scroll interception.
   Platform overlay scrollbars (including iOS) can ignore part or all of this skin.
   Stone joints and the small bevel highlight are static, never a moving shimmer.
   Load after global-enhancements-r3.css. The :is() specificity matches its
   html.aether-global-effects rules even if that class is not present yet. */
:is(html, html.aether-global-effects) {
  --planet-scroll-stone: rgb(106, 108, 112);
  --planet-scroll-edge: rgb(142.4, 142.32, 142.16);
  --planet-scroll-shadow: rgb(50.88, 51.84, 53.76);
  --planet-scroll-track: #0c0e10;
  scrollbar-color: var(--planet-scroll-stone) var(--planet-scroll-track);
  scrollbar-width: auto;
}
/* scrollbar-color inherits; keep this treatment on the viewport only. */
body { scrollbar-color: auto; }
@supports selector(::-webkit-scrollbar) {
  /* A non-auto standard color overrides WebKit's textured pseudo-elements. */
  :is(html, html.aether-global-effects) { scrollbar-color: auto; }
  :is(html, html.aether-global-effects)::-webkit-scrollbar { width: 16px; height: 16px; }
  :is(html, html.aether-global-effects)::-webkit-scrollbar-track {
    background: var(--planet-scroll-track);
    border-left: 1px solid #202326;
    box-shadow: inset 1px 0 #050607, inset -1px 0 #050607;
  }
  :is(html, html.aether-global-effects)::-webkit-scrollbar-thumb {
    min-height: 64px;
    min-width: 64px;
    border: 2px solid var(--planet-scroll-track);
    border-radius: 2px;
    background-color: var(--planet-scroll-stone);
    background-image:
      linear-gradient(90deg, transparent 0 1px, rgba(237,230,211,.15) 1px 2px, transparent 2px),
      repeating-linear-gradient(0deg, transparent 0 21px, #17191b 21px 23px, var(--planet-scroll-edge) 23px 24px, transparent 24px 46px),
      repeating-linear-gradient(135deg, rgba(0,0,0,.09) 0 1px, transparent 1px 7px, rgba(255,255,255,.035) 7px 8px, transparent 8px 15px),
      linear-gradient(90deg, var(--planet-scroll-edge) 0 1px, var(--planet-scroll-stone) 1px calc(100% - 2px), var(--planet-scroll-shadow) calc(100% - 2px));
    background-clip: padding-box;
    box-shadow: inset 0 1px var(--planet-scroll-edge), inset 0 -2px var(--planet-scroll-shadow);
  }
  :is(html, html.aether-global-effects)::-webkit-scrollbar-thumb:hover {
    box-shadow: inset 1px 1px var(--planet-scroll-edge), inset -1px -2px var(--planet-scroll-shadow);
  }
  :is(html, html.aether-global-effects)::-webkit-scrollbar-thumb:active {
    box-shadow: inset 1px 1px var(--planet-scroll-shadow), inset -1px -1px var(--planet-scroll-edge);
  }
  :is(html, html.aether-global-effects)::-webkit-scrollbar-track:horizontal { border-left: 0; border-top: 1px solid #202326; }
  :is(html, html.aether-global-effects)::-webkit-scrollbar-thumb:horizontal {
    background-image:
      repeating-linear-gradient(90deg, transparent 0 21px, #17191b 21px 23px, var(--planet-scroll-edge) 23px 24px, transparent 24px 46px),
      linear-gradient(0deg, var(--planet-scroll-shadow) 0 2px, var(--planet-scroll-stone) 2px calc(100% - 1px), var(--planet-scroll-edge) calc(100% - 1px));
  }
  :is(html, html.aether-global-effects)::-webkit-scrollbar-corner { background: var(--planet-scroll-track); }
  :is(html, html.aether-global-effects)::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
  @media (max-width: 600px) {
    :is(html, html.aether-global-effects)::-webkit-scrollbar { width: 12px; height: 12px; }
  }
}
/* The module changes color immediately under reduced motion. No CSS animations
   or transitions are used, so no decorative motion survives this preference. */
@media (forced-colors: active) {
  :is(html, html.aether-global-effects) { scrollbar-color: auto !important; scrollbar-width: auto !important; }
  :is(html, html.aether-global-effects)::-webkit-scrollbar,
  :is(html, html.aether-global-effects)::-webkit-scrollbar-track,
  :is(html, html.aether-global-effects)::-webkit-scrollbar-track:horizontal,
  :is(html, html.aether-global-effects)::-webkit-scrollbar-thumb,
  :is(html, html.aether-global-effects)::-webkit-scrollbar-thumb:hover,
  :is(html, html.aether-global-effects)::-webkit-scrollbar-thumb:active,
  :is(html, html.aether-global-effects)::-webkit-scrollbar-thumb:horizontal,
  :is(html, html.aether-global-effects)::-webkit-scrollbar-corner,
  :is(html, html.aether-global-effects)::-webkit-scrollbar-button { all: revert !important; }
}
