/* V3.3.68: native scrollbar colors shared by all five website entry points.
   Load after each page's styles. Do not change overflow, scroll positions,
   gutter policy, or the intentionally hidden main-navigation scrollbar. */
@media screen {
  html {
    --bolong-scrollbar-track: var(--surface-soft, var(--paper-soft, var(--surface, #171b24)));
    --bolong-scrollbar-thumb: var(--muted, #8b95a8);
    --bolong-scrollbar-thumb-hover: var(--ink, var(--text, #e8ecf2));
  }

  html:not([data-theme="light"]) { color-scheme: dark; }
  html[data-theme="light"] { color-scheme: light; }

  /* Board presets have their own palette; avoid color-mix-only faint tokens
     so the fallback also works in Chromium versions without color-mix(). */
  #cncDeviceBoard {
    --bolong-scrollbar-track: var(--monitor-surface-strong, var(--surface-solid, #1e2230));
    --bolong-scrollbar-thumb: var(--monitor-muted, var(--muted, #8b95a8));
    --bolong-scrollbar-thumb-hover: var(--monitor-ink, var(--ink, #e8ecf2));
  }

  html, html * {
    /* Override historical per-page hardcoded scrollbar colors only. */
    scrollbar-color: var(--bolong-scrollbar-thumb) var(--bolong-scrollbar-track) !important;
    scrollbar-width: thin;
  }

  /* Keep these outside @supports: older Chromium understands the pseudo
     elements but may not understand selector() feature queries. */
  html::-webkit-scrollbar, html *::-webkit-scrollbar {
    width: 10px;
    height: 10px;
  }

  html::-webkit-scrollbar-track, html *::-webkit-scrollbar-track,
  html::-webkit-scrollbar-corner, html *::-webkit-scrollbar-corner,
  html::-webkit-resizer, html *::-webkit-resizer {
    background: var(--bolong-scrollbar-track) !important;
  }

  html::-webkit-scrollbar-thumb, html *::-webkit-scrollbar-thumb {
    min-width: 28px;
    min-height: 28px;
    border: 2px solid var(--bolong-scrollbar-track) !important;
    border-radius: 8px;
    background: var(--bolong-scrollbar-thumb) !important;
    background-clip: padding-box !important;
  }

  html::-webkit-scrollbar-thumb:hover, html *::-webkit-scrollbar-thumb:hover,
  html::-webkit-scrollbar-thumb:active, html *::-webkit-scrollbar-thumb:active {
    background: var(--bolong-scrollbar-thumb-hover) !important;
  }

  html::-webkit-scrollbar-button, html *::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height: 0;
  }

  /* Chromium now supports both APIs. Non-auto standard values suppress its
     pseudo-element colors/hover, so use its native WebKit styling branch.
     Firefox keeps the standard rules above. Never unhide the main nav. */
  @supports selector(::-webkit-scrollbar) {
    html, html *:not(.main-nav) {
      scrollbar-color: auto !important;
      scrollbar-width: auto !important;
    }
  }
}

/* Respect Windows high contrast. Let the UA provide its native dimensions,
   colors and affordances instead of forcing either site palette. The main
   nav remains the existing wheel/touch-scrollable, hidden-scrollbar control. */
@media screen and (forced-colors: active) {
  html { color-scheme: light dark !important; }
  html, html *:not(.main-nav) {
    scrollbar-color: auto !important;
    scrollbar-width: auto !important;
  }
  html::-webkit-scrollbar, html *:not(.main-nav)::-webkit-scrollbar,
  html::-webkit-scrollbar-track, html *:not(.main-nav)::-webkit-scrollbar-track,
  html::-webkit-scrollbar-thumb, html *:not(.main-nav)::-webkit-scrollbar-thumb,
  html::-webkit-scrollbar-thumb:hover, html *:not(.main-nav)::-webkit-scrollbar-thumb:hover,
  html::-webkit-scrollbar-thumb:active, html *:not(.main-nav)::-webkit-scrollbar-thumb:active,
  html::-webkit-scrollbar-corner, html *:not(.main-nav)::-webkit-scrollbar-corner,
  html::-webkit-scrollbar-button, html *:not(.main-nav)::-webkit-scrollbar-button,
  html::-webkit-resizer, html *:not(.main-nav)::-webkit-resizer {
    all: revert !important;
  }
}