/* Ailink: one subtle outer rail, transparent track, no native arrow buttons.
   Only scrollbar paint and its own width are changed; scroll containers keep
   their overflow, gutters, focus behavior and layout. Load after theme CSS. */
html[data-theme] {
  --ailink-scrollbar-thumb: rgba(171,177,149, .64);
  --ailink-scrollbar-thumb-hover: rgba(198,206,171, .86);
  --ailink-scrollbar-line: rgba(146,153,123, .27);
}
html[data-theme="light"] {
  --ailink-scrollbar-thumb: rgba(122,129,100, .60);
  --ailink-scrollbar-thumb-hover: rgba(113,123,78, .84);
  --ailink-scrollbar-line: rgba(128,137,98, .22);
}

@supports selector(::-webkit-scrollbar) {
  /* Non-auto standard properties take priority over WebKit parts in current
     Chrome/Edge. Reset them so the transparent track and arrow removal work. */
  html[data-theme], html[data-theme] * {
    scrollbar-color: auto !important;
    scrollbar-width: auto !important;
  }
  html[data-theme]::-webkit-scrollbar,
  html[data-theme] ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    background: transparent;
    border: 0;
    box-shadow: none;
  }
  html[data-theme]::-webkit-scrollbar-track,
  html[data-theme] ::-webkit-scrollbar-track {
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }
  html[data-theme]::-webkit-scrollbar-track:vertical,
  html[data-theme] ::-webkit-scrollbar-track:vertical {
    border-right: 1px solid var(--ailink-scrollbar-line);
  }
  html[data-theme]::-webkit-scrollbar-track:horizontal,
  html[data-theme] ::-webkit-scrollbar-track:horizontal {
    border-bottom: 1px solid var(--ailink-scrollbar-line);
  }
  html[data-theme]::-webkit-scrollbar-track-piece,
  html[data-theme] ::-webkit-scrollbar-track-piece {
    background: transparent;
    border: 0;
    box-shadow: none;
  }
  html[data-theme]::-webkit-scrollbar-thumb,
  html[data-theme] ::-webkit-scrollbar-thumb {
    min-height: 28px;
    min-width: 28px;
    background: var(--ailink-scrollbar-thumb);
    background-clip: content-box;
    border: 2px solid transparent;
    border-radius: 999px;
    box-shadow: none;
  }
  html[data-theme]::-webkit-scrollbar-thumb:hover,
  html[data-theme] ::-webkit-scrollbar-thumb:hover {
    background-color: var(--ailink-scrollbar-thumb-hover);
  }
  html[data-theme]::-webkit-scrollbar-button,
  html[data-theme] ::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height: 0;
    background: transparent;
    border: 0;
  }
  html[data-theme]::-webkit-scrollbar-corner,
  html[data-theme] ::-webkit-scrollbar-corner {
    background: transparent;
    border: 0;
  }
  /* Keep existing intentionally hidden timeline and compact tab scrollbars. */
  html[data-theme] :is(.video-edit-scroll, .studio-task-tabs, .preserved-template-tabs, .prompt-reference-controls > span) {
    scrollbar-width: none !important;
  }
  /* This existing reference strip uses a visible thin scrollbar. */
  html[data-theme] .free-creation-view .prompt-reference-controls > span {
    scrollbar-width: auto !important;
  }
  html[data-theme] .free-creation-view .prompt-reference-controls > span::-webkit-scrollbar {
    display: block;
  }
}

@supports not selector(::-webkit-scrollbar) {
  /* Native fallback for engines without custom scrollbar parts. */
  html[data-theme], html[data-theme] * {
    scrollbar-color: var(--ailink-scrollbar-thumb) transparent;
    scrollbar-width: thin;
  }
}