/* Progressive enhancement: no native scrollbar is hidden until JS succeeds. */
html.jus-scroll-enhanced { scrollbar-width: none; }
html.jus-scroll-enhanced::-webkit-scrollbar { width: 0; height: 0; }
html.jus-scroll-dragging, html.jus-scroll-dragging * { cursor: grabbing !important; user-select: none !important; }

.jus-scroll-control {
  --jus-scroll-ready: 1;
  --jus-rail-track: #27362a22;
  --jus-rail-fill: #eb722f9e;
  --jus-rail-label: #fbf9f2;
  position: fixed;
  top: var(--jus-rail-top, 110px);
  right: 3px;
  bottom: max(98px, calc(env(safe-area-inset-bottom, 0px) + 92px));
  z-index: 44;
  width: 38px;
  min-height: 74px;
  touch-action: none;
  outline: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  contain: layout;
}
html[data-theme="dark"] .jus-scroll-control {
  --jus-rail-track: #ebf3de23;
  --jus-rail-fill: #ff965aa6;
  --jus-rail-label: #242c24;
}
.jus-scroll-track {
  position: absolute;
  top: 12px;
  bottom: 50px;
  left: 24px;
  width: 2px;
  overflow: hidden;
  border-radius: 3px;
  background: var(--jus-rail-track);
  transition: width .2s, background .2s;
  pointer-events: none;
}
.jus-scroll-fill {
  display: block;
  width: 100%;
  height: 100%;
  transform: scaleY(var(--jus-scroll-progress, 0));
  transform-origin: top;
  background: linear-gradient(to bottom, #ec783842, var(--jus-rail-fill));
}
.jus-scroll-thumb {
  position: absolute;
  left: 0;
  top: 0;
  width: 38px;
  height: 64px;
  padding: 0 0 4px;
  cursor: grab;
  transform: translate3d(0, var(--jus-thumb-y, 0px), 0);
  will-change: transform;
}
.jus-hook-drawing { width: 38px; height: 60px; overflow: visible; filter: drop-shadow(0 2px 3px #17271924); }
.jus-hook-glyph { transform-origin: 31px 13px; transform: rotate(var(--jus-hook-tilt, 0deg)); transition: transform .24s ease-out; }
.jus-hook-barb { transform-origin: 13px 43px; transform: rotate(var(--jus-barb-tilt, 0deg)) scaleY(var(--jus-barb-scale, 1)); transition: transform .3s ease-out; }
.jus-hook-glint { opacity: .22; transition: opacity .3s; }
.jus-scroll-control.is-scrolling .jus-hook-glint,
.jus-scroll-control:hover .jus-hook-glint,
.jus-scroll-control:focus-visible .jus-hook-glint { opacity: .94; }
.jus-scroll-control.is-dragging .jus-hook-glyph { transition-duration: .1s; }
.jus-scroll-control:hover .jus-scroll-track,
.jus-scroll-control:focus-visible .jus-scroll-track { width: 3px; background: var(--jus-rail-fill); }
.jus-scroll-control:focus-visible .jus-scroll-thumb:after {
  content: "";
  position: absolute;
  inset: -2px 0 0 -1px;
  border: 2px solid var(--accent, #f66524);
  border-radius: 15px;
}
.jus-scroll-tip {
  position: absolute;
  right: calc(100% + 6px);
  top: calc(var(--jus-thumb-y, 0px) + 23px);
  padding: 6px 9px;
  border: 1px solid var(--line, #29372924);
  border-radius: 7px;
  background: var(--jus-rail-label);
  color: var(--text, #242923);
  font-family: inherit;
  font-weight: 500;
  line-height: 1.1;
  font-size: 10px;
  letter-spacing: .01em;
  white-space: nowrap;
  opacity: 0;
  transform: translateX(4px);
  transition: opacity .18s, transform .18s;
  pointer-events: none;
}
.jus-scroll-control:hover .jus-scroll-tip,
.jus-scroll-control:focus-visible .jus-scroll-tip,
.jus-scroll-control.is-dragging .jus-scroll-tip { opacity: 1; transform: translateX(0); }
.jus-scroll-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

#back-top.jus-magnet-button {
  width: 52px;
  height: 52px;
  right: 24px;
  bottom: max(25px, calc(env(safe-area-inset-bottom, 0px) + 18px));
  overflow: visible;
  isolation: isolate;
  transition: background .25s, box-shadow .25s;
}
#back-top.jus-magnet-button > svg.jus-magnet-progress {
  inset: 3px;
  width: 46px;
  height: 46px;
  stroke-width: 1.55;
  opacity: .72;
  pointer-events: none;
}
#back-top.jus-magnet-button:before {
  content: "";
  position: absolute;
  inset: 7px;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 55%, #ff8b4930, transparent 72%);
  transform: scale(.8);
  opacity: 0;
  transition: opacity .25s, transform .3s;
  pointer-events: none;
}
#back-top.jus-magnet-button:hover:before { transform: scale(1.23); opacity: 1; }
#back-top.jus-magnet-button:focus-visible { outline: 2px solid var(--accent, #f66524); outline-offset: 4px; }
#back-top .jus-magnet-icon { display: block; width: 43px; height: 43px; pointer-events: none; }
#back-top .jus-magnet-drawing { width: 43px; height: 43px; overflow: visible; filter: drop-shadow(0 2px 1.5px #1c221d20); }
.jus-magnet-core { transform: translate(0, -1px) rotate(-18deg); transform-origin: 26px 29px; transition: transform .42s cubic-bezier(.2,.85,.25,1.4); }
.jus-magnet-particle { opacity: 0; transition: transform .45s cubic-bezier(.2,.8,.2,1), opacity .18s; }
.particle-one { transform: translate(-2px, -3px); }
.particle-two { transform: translate(3px, -4px); transition-delay: .045s; }
.particle-three { transform: translate(1px, -5px); transition-delay: .08s; }
.jus-magnet-waves { opacity: 0; transition: opacity .25s; }
#back-top.jus-magnet-button:hover .jus-magnet-core,
#back-top.jus-magnet-button:focus-visible .jus-magnet-core { transform: translate(0, -2px) rotate(-6deg); }
#back-top.jus-magnet-button:hover .jus-magnet-particle,
#back-top.jus-magnet-button:focus-visible .jus-magnet-particle { opacity: .8; transform: translate(0, 3px); }
#back-top.jus-magnet-button:hover .jus-magnet-waves,
#back-top.jus-magnet-button:focus-visible .jus-magnet-waves { opacity: .7; }
#back-top.is-attracting .jus-magnet-core { animation: jus-magnet-snap .5s cubic-bezier(.2,.8,.2,1); }
#back-top.is-attracting .jus-magnet-particles { animation: jus-particle-pull .5s ease-out; transform-origin: 26px 14px; }
@keyframes jus-magnet-snap { 0% { transform: translate(0,-2px) rotate(-6deg); } 28% { transform: translate(0,2px) rotate(4deg) scale(.9); } 65% { transform: translate(0,-4px) rotate(-10deg) scale(1.07); } 100% { transform: translate(0,-1px) rotate(-18deg); } }
@keyframes jus-particle-pull { 0% { opacity: 1; transform: translateY(0) scale(1); } 55%,100% { opacity: 0; transform: translateY(7px) scale(.3); } }

.jus-scroll-control.is-decorative {
  right: 0;
  width: 20px;
  bottom: max(88px, calc(env(safe-area-inset-bottom, 0px) + 80px));
  pointer-events: none;
  touch-action: auto;
  opacity: .7;
}
.jus-scroll-control.is-decorative .jus-scroll-track { width: 1px; left: 12px; top: 6px; bottom: 30px; }
.jus-scroll-control.is-decorative .jus-scroll-thumb { width: 20px; height: 38px; padding: 0; }
.jus-scroll-control.is-decorative .jus-hook-drawing { width: 20px; height: 36px; }
.jus-scroll-control.is-decorative .jus-scroll-tip { display: none; }
@media (max-width: 800px) {
  #back-top.jus-magnet-button { width: 48px; height: 48px; right: 16px; bottom: max(20px, calc(env(safe-area-inset-bottom, 0px) + 14px)); }
  #back-top.jus-magnet-button > svg.jus-magnet-progress { width: 42px; height: 42px; }
  #back-top .jus-magnet-icon, #back-top .jus-magnet-drawing { width: 40px; height: 40px; }
}
@media (prefers-reduced-motion: reduce) {
  .jus-scroll-control *, #back-top.jus-magnet-button *, #back-top.jus-magnet-button:before { animation: none !important; transition: none !important; }
  .jus-hook-glyph, .jus-hook-barb, #back-top .jus-magnet-core { transform: none !important; }
  .jus-hook-glint { opacity: .45 !important; }
  .jus-magnet-particles, .jus-magnet-waves, #back-top.jus-magnet-button:before { display: none; }
}
html[data-motion="off"] .jus-scroll-control *, html[data-motion="off"] #back-top.jus-magnet-button *, html[data-motion="off"] #back-top.jus-magnet-button:before { animation: none !important; transition: none !important; }
html[data-motion="off"] .jus-hook-glyph, html[data-motion="off"] .jus-hook-barb, html[data-motion="off"] #back-top .jus-magnet-core { transform: none !important; }
html[data-motion="off"] .jus-hook-glint { opacity: .45 !important; }
html[data-motion="off"] .jus-magnet-particles, html[data-motion="off"] .jus-magnet-waves, html[data-motion="off"] #back-top.jus-magnet-button:before { display: none; }
