/* Style tokens (set per style via the class the script adds to <html>) */
html.sc-panel-anims-none { --sc-pa-dur: 0ms; --sc-pa-ease: ease; --sc-pa-squeeze: none; }
html.sc-panel-anims-genie { --sc-pa-dur: var(--sc-pa-user-duration, 3000ms); --sc-pa-ease: cubic-bezier(.2, 1.25, .35, 1); --sc-pa-squeeze: scale(.55, .9); }
html.sc-panel-anims-glide { --sc-pa-dur: var(--sc-pa-user-duration, 1600ms); --sc-pa-ease: cubic-bezier(.22, .72, .25, 1); --sc-pa-squeeze: none; }
html.sc-panel-anims-fade  { --sc-pa-dur: var(--sc-pa-user-duration, 1000ms); --sc-pa-ease: ease; --sc-pa-squeeze: none; }

/* Docked sidebars: the slot slides (core supplies the translate), the handle
   lives inside the slot so it is never faded or squeezed. Only the inner
   content container is squeezed/faded. */
.sc-panel-anims-ready .sc-slot-left:not(.sc-sidebar-float-mode),
.sc-panel-anims-ready .sc-slot-right:not(.sc-sidebar-float-mode) {
  transition: transform var(--sc-pa-dur, 380ms) var(--sc-pa-ease, ease);
}

.sc-panel-anims-ready .sc-slot-left:not(.sc-sidebar-float-mode) .sc-sidebar-scroll-container,
.sc-panel-anims-ready .sc-slot-right:not(.sc-sidebar-float-mode) .sc-sidebar-scroll-container {
  transition: transform var(--sc-pa-dur, 380ms) var(--sc-pa-ease, ease),
              opacity calc(var(--sc-pa-dur, 380ms) * .8) ease,
              visibility var(--sc-pa-dur, 380ms) linear;
}
.sc-panel-anims-ready .sc-slot-left:not(.sc-sidebar-float-mode) .sc-sidebar-scroll-container { transform-origin: left center; }
.sc-panel-anims-ready .sc-slot-right:not(.sc-sidebar-float-mode) .sc-sidebar-scroll-container { transform-origin: right center; }

.sc-panel-anims-ready .sc-viewport-shell.sc-sidebar-left-collapsed .sc-slot-left:not(.sc-sidebar-float-mode) .sc-sidebar-scroll-container,
.sc-panel-anims-ready .sc-viewport-shell.sc-sidebar-right-collapsed .sc-slot-right:not(.sc-sidebar-float-mode) .sc-sidebar-scroll-container {
  opacity: 0;
  transform: var(--sc-pa-squeeze, none);
}

/* Floating panels: transform origin for the scale part of the animation */
.sc-panel-anims-ready .sc-slot-left.sc-sidebar-float-mode,
.sc-panel-anims-ready .sc-slot-right.sc-sidebar-float-mode,
.sc-panel-anims-ready #scTopHeader.sc-header-floating-mode,
.sc-panel-anims-ready .sc-content-floating-mode { transform-origin: top center; }

.sc-panel-anims-ready .sc-sidebar-float-mode > .sc-panel-anims-close {
  position: sticky;
  top: 6px;
  z-index: 2;
  justify-self: end;
  width: 30px;
  height: 30px;
  margin: 6px 6px 0 auto;
  padding: 0;
  border: 1px solid var(--border, #dbe3ed);
  border-radius: 6px;
  background: #fff;
  color: #343a40;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}

@media (prefers-reduced-motion: reduce) {
  html.sc-panel-anims-ready.sc-panel-anims-respect-reduced-motion { --sc-pa-dur: 1ms; }
}
