/* Saját üveges görgetősáv gépen. A böngésző szürke sávja helyett a tartalom fölött lebeg, így a film a teljes szélességet kitölti.
   Telefonon a rendszeré marad: az magától is a tartalom fölött van. */
@media (hover:hover) and (pointer:fine){
  html{ scrollbar-width:none; }
  html::-webkit-scrollbar{ display:none; }
  /* a belső görgethető részek (űrlap, táblázat) vékony, áttetsző sávot kapnak */
  *{ scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.32) transparent; }
}
.csuszka{ position:fixed; z-index:60; top:0; right:0; bottom:0; width:18px; touch-action:none; -webkit-user-select:none; user-select:none; }
.csuszka[hidden]{ display:none; }
.csuszka-fogo{
  position:absolute; top:0; right:4px; width:8px; box-sizing:border-box; border:1px solid rgba(255,255,255,.42); border-radius:999px; cursor:grab; will-change:transform; opacity:.82;
  background:linear-gradient(90deg,rgba(255,255,255,.42),rgba(255,255,255,.16) 55%,rgba(255,255,255,.28)),rgba(10,16,30,.18);
  -webkit-backdrop-filter:blur(10px) saturate(185%); backdrop-filter:blur(10px) saturate(185%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 6px 18px rgba(0,0,0,.4);
  transition:width .2s cubic-bezier(.16,1,.3,1),opacity .25s;
}
.csuszka.mozog .csuszka-fogo{ opacity:1; }
.csuszka:hover .csuszka-fogo,.csuszka.fog .csuszka-fogo{ width:12px; opacity:1; }
.csuszka.fog .csuszka-fogo{ cursor:grabbing; }
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .csuszka-fogo{ background:rgba(150,165,190,.6); }
}
@media (prefers-reduced-motion:reduce){
  .csuszka-fogo{ transition:none; }
}