/* Timings and curves from Rocontec's app-motion/mobile-navigation. */
:root { --rs-motion-ease: cubic-bezier(.22, 1, .36, 1); }
[data-rs-reveal] { animation: rs-motion-content var(--rs-reveal-duration, 360ms) var(--rs-motion-ease) var(--rs-reveal-delay, 0ms) backwards; }
@keyframes rs-motion-content { from { opacity: 0; translate: 0 12px; } to { opacity: 1; translate: 0 0; } }

#app[data-shell-enter] > .rs-sidebar { animation: rs-motion-sidebar 460ms var(--rs-motion-ease) backwards; }
#app[data-shell-enter] > .rs-topbar { animation: rs-motion-header 420ms var(--rs-motion-ease) backwards; }
#app[data-access-header-pending] > .rs-topbar,
#app[data-access-header-pending] > .rs-topbar * { animation-play-state: paused !important; }
#app[data-shell-enter] :is(.rs-brand, .rs-mobile-brand) { animation: rs-motion-fade 360ms ease-out 100ms backwards; }
#app[data-shell-enter] .rs-sidebar .sidebar-label { animation: rs-motion-fade 300ms ease-out 180ms backwards; }
#app[data-shell-enter] .rs-sidebar .sidebar-link { animation: rs-motion-navigation 340ms var(--rs-motion-ease) var(--rs-nav-delay, 200ms) backwards; }
/* Animate the triggers only: menus keep their own independent motion. */
#app[data-shell-enter] .rs-notifications-trigger { animation: rs-motion-navigation 340ms var(--rs-motion-ease) 220ms backwards; }
#app[data-shell-enter] .rs-account-trigger { animation: rs-motion-navigation 340ms var(--rs-motion-ease) 300ms backwards; }
@media (max-width: 1023px) {
  #app[data-shell-enter] :is(.rs-menu-button, .rs-notifications-trigger, .rs-account-trigger) { animation-name: rs-motion-content; }
  #app[data-shell-enter] .rs-menu-button { animation: rs-motion-content 340ms var(--rs-motion-ease) 220ms backwards; }
}
@keyframes rs-motion-sidebar { from { opacity: 0; transform: translateX(-100%); } to { opacity: 1; transform: translateX(0); } }
@keyframes rs-motion-header { from { opacity: 0; transform: translateY(-100%); } to { opacity: 1; transform: translateY(0); } }
@keyframes rs-motion-navigation { from { opacity: 0; translate: -8px 0; } to { opacity: 1; translate: 0 0; } }
@keyframes rs-motion-fade { from { opacity: 0; } to { opacity: 1; } }

/* Work links join/leave the existing menu without moving Administration abruptly. */
.sidebar-link + .rs-work-navigation { margin-top: 4px; }
.rs-work-navigation[data-nav-transition="enter"] { overflow: hidden; animation: rs-work-nav-open 340ms var(--rs-motion-ease) both; }
.rs-work-navigation[data-nav-transition="enter"] .sidebar-link { animation: rs-motion-navigation 340ms var(--rs-motion-ease) var(--rs-nav-delay) backwards; }
.rs-work-navigation[data-nav-retiring] { overflow: hidden; pointer-events: none; animation: rs-work-nav-close 240ms var(--rs-motion-ease) 160ms both; }
.rs-work-navigation[data-nav-retiring] .sidebar-link { animation: rs-work-nav-item-close 140ms ease var(--rs-nav-delay) both; }
@keyframes rs-work-nav-open { from { height: 0; margin-top: 0; } to { height: var(--rs-nav-height); margin-top: 4px; } }
@keyframes rs-work-nav-close { from { height: var(--rs-nav-height); margin-top: 4px; } to { height: 0; margin-top: 0; } }
@keyframes rs-work-nav-item-close { to { opacity: 0; translate: -8px 0; } }

/* The legacy order-only entrance must not replay on a balance refresh. */
#app[data-motion-ready] [data-order-enter] { animation: none; }
#app[data-motion-ready] [data-order-enter][data-rs-reveal] { animation: rs-motion-content var(--rs-reveal-duration, 360ms) var(--rs-motion-ease) var(--rs-reveal-delay, 0ms) backwards; }
.rs-stock-group-body { transition: grid-template-rows 280ms var(--rs-motion-ease), opacity 180ms ease; }

html[data-mobile-menu] { overflow: hidden; }
#mobile-menu {
  position: fixed; inset: 0 auto 0 0;
  overflow-y: auto; overscroll-behavior: contain;
  padding-top: max(22px, env(safe-area-inset-top));
  padding-bottom: max(22px, env(safe-area-inset-bottom));
  opacity: 1; transform: none;
}
#mobile-menu[data-menu-state="open"] { animation: rs-menu-open 260ms var(--rs-motion-ease) both; }
#mobile-menu[data-menu-state="closing"] { animation: rs-menu-close 140ms cubic-bezier(.4, 0, 1, 1) both; pointer-events: none; }
#mobile-menu::backdrop { background: rgb(0 0 0 / 10%); backdrop-filter: blur(var(--blur-xs, 4px)); }
#mobile-menu[data-menu-state="open"]::backdrop { animation: rs-motion-fade 180ms ease both; }
#mobile-menu[data-menu-state="closing"]::backdrop { animation: rs-menu-overlay-close 140ms ease both; }
#mobile-menu[data-menu-state="open"] .rs-dialog-heading { animation: rs-motion-fade 200ms ease-out 140ms backwards; }
#mobile-menu[data-menu-state="open"] .sidebar-label { animation: rs-motion-fade 180ms ease-out 170ms backwards; }
#mobile-menu[data-menu-state="open"] .rs-admin-navigation .sidebar-label { animation-delay: 320ms; }
#mobile-menu[data-menu-state="open"] .sidebar-link { animation: rs-menu-item 220ms var(--rs-motion-ease) var(--rs-nav-delay, 200ms) backwards; }
#mobile-menu[data-menu-state="closing"] :is(.rs-dialog-heading, .sidebar-label, .sidebar-link) { animation: none; }
@keyframes rs-menu-open { from { translate: -100% 0; } to { translate: 0 0; } }
@keyframes rs-menu-close { from { translate: 0 0; } to { translate: -100% 0; } }
@keyframes rs-menu-item { from { opacity: 0; translate: -10px 0; } to { opacity: 1; translate: 0 0; } }
@keyframes rs-menu-overlay-close { to { opacity: 0; } }

/* Closing a popup never runs a second entrance on its children. */
#info-dialog:not([open]) [data-rs-reveal] { animation: none; }
@media (prefers-reduced-motion: reduce) {
  .rs-work-navigation[data-nav-retiring] { display: none; }
  .rs-work-navigation[data-nav-transition], .rs-work-navigation[data-nav-transition] .sidebar-link { animation: none !important; }
  [data-rs-reveal], #app[data-shell-enter] *, #mobile-menu, #mobile-menu::backdrop,
  #mobile-menu :is(.rs-dialog-heading, .sidebar-label, .sidebar-link),
  #app[data-motion-ready] [data-order-enter][data-rs-reveal] { animation: none !important; }
  .rs-stock-group-body { transition: none; }
}