/* Adapted from Clive95's classic Win95 scrollbar system. */
:root{
  --w95-face:#c0c0c0;
  --w95-face-light:#dfdfdf;
  --w95-highlight:#fff;
  --w95-shadow:#808080;
  --w95-dark:#000;
}

*{scrollbar-color:var(--w95-face) var(--w95-face-light)}
*::-webkit-scrollbar{-webkit-appearance:none;width:16px;height:16px;background:var(--w95-face-light)}
*::-webkit-scrollbar-track{background-color:var(--w95-face-light);background-image:linear-gradient(45deg,var(--w95-face) 25%,transparent 25%,transparent 75%,var(--w95-face) 75%),linear-gradient(45deg,var(--w95-face) 25%,transparent 25%,transparent 75%,var(--w95-face) 75%);background-position:0 0,1px 1px;background-size:2px 2px;border-left:1px solid var(--w95-shadow);border-right:1px solid var(--w95-highlight)}
*::-webkit-scrollbar-thumb{min-width:22px;min-height:22px;background:var(--w95-face);border:0;box-shadow:inset 1px 1px 0 var(--w95-highlight),inset -1px -1px 0 var(--w95-dark),inset 2px 2px 0 var(--w95-face-light),inset -2px -2px 0 var(--w95-shadow)}
*::-webkit-scrollbar-button:single-button{display:block;width:16px;height:16px;background-color:var(--w95-face);background-repeat:no-repeat;background-position:center;box-shadow:inset 1px 1px 0 var(--w95-highlight),inset -1px -1px 0 var(--w95-dark),inset 2px 2px 0 var(--w95-face-light),inset -2px -2px 0 var(--w95-shadow)}
*::-webkit-scrollbar-button:vertical:decrement:single-button{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' shape-rendering='crispEdges'%3E%3Cpath d='M8 4 4 10h8z'/%3E%3C/svg%3E")}
*::-webkit-scrollbar-button:vertical:increment:single-button{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' shape-rendering='crispEdges'%3E%3Cpath d='M4 6h8l-4 6z'/%3E%3C/svg%3E")}
*::-webkit-scrollbar-button:horizontal:decrement:single-button{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' shape-rendering='crispEdges'%3E%3Cpath d='M10 4v8L4 8z'/%3E%3C/svg%3E")}
*::-webkit-scrollbar-button:horizontal:increment:single-button{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' shape-rendering='crispEdges'%3E%3Cpath d='M6 4v8l6-4z'/%3E%3C/svg%3E")}
*::-webkit-scrollbar-corner{background:var(--w95-face)}

.win95-scroll.win95-custom-scrollbar{scrollbar-width:none!important}
.win95-scroll.win95-custom-scrollbar::-webkit-scrollbar{width:0;height:0}
.win95-scroll.win95-custom-scrollbar.has-win95-v-scroll{padding-right:calc(var(--w95-base-padding-right,0px) + 16px)!important}
.win95-scroll.win95-custom-scrollbar.has-win95-h-scroll{padding-bottom:calc(var(--w95-base-padding-bottom,0px) + 16px)!important}

.win95-scrollbar,.win95-scrollbar-corner{position:fixed;display:flex;background:var(--w95-face-light);color:#000;pointer-events:auto;user-select:none;touch-action:none}
.win95-scrollbar[hidden],.win95-scrollbar-corner[hidden]{display:none}
.win95-scrollbar-vertical{flex-direction:column}
.win95-scrollbar-horizontal{flex-direction:row}
.win95-scrollbar-button{width:16px;height:16px;flex:0 0 16px;padding:0;border:0;background-color:var(--w95-face);background-repeat:no-repeat;background-position:center;box-shadow:inset 1px 1px 0 var(--w95-highlight),inset -1px -1px 0 var(--w95-dark),inset 2px 2px 0 var(--w95-face-light),inset -2px -2px 0 var(--w95-shadow)}
.win95-scrollbar-button:active{box-shadow:inset 1px 1px 0 var(--w95-dark),inset -1px -1px 0 var(--w95-highlight),inset 2px 2px 0 var(--w95-shadow),inset -2px -2px 0 var(--w95-face-light)}
.win95-scrollbar-button:disabled{background-color:var(--w95-face);box-shadow:inset 1px 1px 0 var(--w95-highlight),inset -1px -1px 0 var(--w95-shadow);cursor:default}
.win95-scrollbar-vertical .win95-scrollbar-dec{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' shape-rendering='crispEdges'%3E%3Cpath d='M8 4 4 10h8z'/%3E%3C/svg%3E")}
.win95-scrollbar-vertical .win95-scrollbar-inc{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' shape-rendering='crispEdges'%3E%3Cpath d='M4 6h8l-4 6z'/%3E%3C/svg%3E")}
.win95-scrollbar-horizontal .win95-scrollbar-dec{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' shape-rendering='crispEdges'%3E%3Cpath d='M10 4v8L4 8z'/%3E%3C/svg%3E")}
.win95-scrollbar-horizontal .win95-scrollbar-inc{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' shape-rendering='crispEdges'%3E%3Cpath d='M6 4v8l6-4z'/%3E%3C/svg%3E")}
.win95-scrollbar-track{position:relative;flex:1 1 auto;min-width:0;min-height:0;overflow:hidden;background-color:var(--w95-face-light);background-image:linear-gradient(45deg,var(--w95-face) 25%,transparent 25%,transparent 75%,var(--w95-face) 75%),linear-gradient(45deg,var(--w95-face) 25%,transparent 25%,transparent 75%,var(--w95-face) 75%);background-position:0 0,1px 1px;background-size:2px 2px}
.win95-scrollbar-thumb{position:absolute;left:0;top:0;width:16px;height:16px;background:var(--w95-face);box-shadow:inset 1px 1px 0 var(--w95-highlight),inset -1px -1px 0 var(--w95-dark),inset 2px 2px 0 var(--w95-face-light),inset -2px -2px 0 var(--w95-shadow);cursor:default}
.win95-scrollbar-horizontal .win95-scrollbar-thumb{width:22px;height:16px}
.win95-scrollbar-vertical .win95-scrollbar-thumb{width:16px;height:22px}
.win95-scrollbar-corner{width:16px;height:16px;background:var(--w95-face);box-shadow:inset 1px 1px 0 var(--w95-highlight),inset -1px -1px 0 var(--w95-shadow)}
