html,.group-list,.group-picker,.upload-results,dialog,.table-scroll{scrollbar-width:auto;scrollbar-color:#627f6d #e8eee9}
:root[data-theme="dark"] :is(html,.group-list,.group-picker,.upload-results,dialog,.table-scroll){scrollbar-color:#4f6e5b #16211b}
/* Every helper is one round button whose arrow points where there is more to see. Fixed colours
   rather than theme tokens: a deep green disc with a white arrow reads the same on the light and
   the dark theme, and over photos. */
button.quick-scroll{padding:0;border:0;border-radius:50%;display:grid;place-items:center;color:#fff;position:relative;
  background:radial-gradient(circle at 30% 25%,#3fa476 0%,#1f6e4c 55%,#134b33 100%);
  box-shadow:0 8px 22px rgba(10,50,34,.38),0 2px 6px rgba(10,50,34,.25),inset 0 1px 0 rgba(255,255,255,.28),inset 0 -2px 6px rgba(0,0,0,.18);
  transition:transform 180ms cubic-bezier(.2,.7,.2,1),box-shadow 180ms cubic-bezier(.2,.7,.2,1);animation:jump-in 260ms cubic-bezier(.2,.9,.3,1.3)}
button.quick-scroll[hidden]{display:none}
button.quick-scroll:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(10,50,34,.45),0 3px 8px rgba(10,50,34,.28),0 0 0 6px rgba(63,164,118,.18),inset 0 1px 0 rgba(255,255,255,.32),inset 0 -2px 6px rgba(0,0,0,.18)}
button.quick-scroll:active{transform:translateY(0) scale(.94)}
button.quick-scroll:focus-visible{outline:3px solid #9fe3bf;outline-offset:3px}
.quick-scroll-page{position:fixed;right:16px;bottom:16px;z-index:25}
button.quick-scroll-page{position:fixed;width:52px;height:52px;min-height:52px}
/* A list's button floats over the list's lower right corner, clear of its scrollbar: it follows
   the list and is pulled up over it, so it takes no room of its own in block, flex or grid. A list
   taller than the window would leave that corner below the fold, so the button is sticky and
   waits at the window's bottom edge until the corner comes into view. */
button.quick-scroll-list{position:sticky;bottom:12px;width:40px;height:40px;min-height:40px;z-index:2;margin:-52px 26px 12px auto;justify-self:end;align-self:flex-end;
  box-shadow:0 6px 16px rgba(10,50,34,.4),0 2px 5px rgba(10,50,34,.25),inset 0 1px 0 rgba(255,255,255,.28),inset 0 -2px 6px rgba(0,0,0,.18)}
button.quick-scroll-list .jump-arrow{width:19px;height:19px}
.jump-ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);pointer-events:none}
.jump-ring circle{fill:none;stroke-width:2.5}
.jump-track{stroke:rgba(255,255,255,.16)}
.jump-progress{stroke:#c9f5dd;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:var(--progress,100);transition:stroke-dashoffset 120ms linear;filter:drop-shadow(0 0 2px rgba(201,245,221,.6))}
.jump-progress{opacity:0}.jump-moved .jump-progress{opacity:1}
.jump-arrow{width:24px;height:24px;stroke-width:2.4;pointer-events:none;transition:transform 320ms cubic-bezier(.3,.9,.3,1.2)}
button.quick-scroll[data-direction=up] .jump-arrow{transform:rotate(180deg)}
button.quick-scroll:hover .jump-arrow{animation:jump-nudge 900ms ease-in-out infinite}
@keyframes jump-in{from{opacity:0;transform:translateY(12px) scale(.7)}to{opacity:1;transform:none}}
@keyframes jump-nudge{0%,100%{translate:0 0}50%{translate:0 3px}}
button.quick-scroll[data-direction=up]:hover .jump-arrow{animation-name:jump-nudge-up}
@keyframes jump-nudge-up{0%,100%{translate:0 0}50%{translate:0 -3px}}
/* Nothing sits under the floating helper: while it is shown the page keeps that much room
   free at the bottom, and on grids with a pinned pagination row the helper itself moves up so
   the two never overlap. */
body:has(.quick-scroll-page:not([hidden])) .workspace,body:has(.quick-scroll-page:not([hidden])) .visitor-main,body:has(.quick-scroll-page:not([hidden])) main.login{padding-bottom:84px}
body:has(.detail>.pagination,.content>.pagination) .quick-scroll-page{bottom:76px}
body:has(.quick-scroll-page:not([hidden])):has(.detail>.pagination,.content>.pagination) .workspace{padding-bottom:144px}

@media(max-width:820px){.quick-scroll-page{right:12px;bottom:12px}
  body:has(.detail>.pagination,.content>.pagination) .quick-scroll-page{bottom:72px}}
@media(prefers-reduced-motion:reduce){button.quick-scroll,.jump-arrow,.jump-progress{animation:none!important;transition:none}}