/* A calmer rhythm for provider/operator panels only. Game presentation is separate. */
.panel-motion{--dur-fast:160ms;--dur-base:400ms;--dur-slow:520ms;--panel-dialog-exit:320ms;--panel-drawer-exit:380ms}
.panel-motion :is(.login-form,.op-login-form){animation:uiDialogEnter var(--dur-slow) var(--ease-out) both}
.panel-motion dialog[open]::backdrop{animation:panelBackdropIn var(--dur-slow) var(--ease-out) both}
.panel-motion dialog.panel-dialog-closing[open]{animation:panelExitModal var(--panel-dialog-exit) var(--ease-in-out) both;pointer-events:none}
.panel-motion .editor-dialog.panel-dialog-closing[open]{animation:panelExitDrawer var(--panel-drawer-exit) var(--ease-in-out) both}
.panel-motion dialog.panel-dialog-closing[open]::backdrop{animation:panelBackdropOut var(--panel-dialog-exit) var(--ease-in-out) both}
@keyframes panelExitModal{from{opacity:1;translate:0 0;scale:1}to{opacity:0;translate:0 var(--s-4);scale:.98}}
@keyframes panelExitDrawer{from{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(var(--s-10))}}
@keyframes panelExitSheet{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100%)}}
@keyframes panelBackdropIn{from{opacity:0}to{opacity:1}}
@keyframes panelBackdropOut{from{opacity:1}to{opacity:0}}
@media(max-width:600px){
  .panel-motion :is(.editor-dialog,.op-dialog).panel-dialog-closing[open]{animation-name:panelExitSheet;animation-duration:var(--panel-drawer-exit)}
  .panel-motion .op-dialog[open]:not(.panel-dialog-closing){animation:ssSheetIn var(--dur-slow) var(--ease-out)}
}
.panel-motion.motion-paused :is(dialog[open],.login-form,.op-login-form),.panel-motion.motion-paused dialog[open]::backdrop{animation:none!important}
@media(prefers-reduced-motion:reduce){
  .panel-motion :is(dialog[open],.login-form,.op-login-form),.panel-motion dialog[open]::backdrop{animation:none!important}
}