/* Shared motion system. Article, device positioning and exports stay untouched. */
:root{--motion-fast:160ms;--motion-panel:280ms;--motion-ease:cubic-bezier(.22,1,.36,1)}
.library .library-panel:not(.hidden),#guideModal .guide-page{animation:none!important}
@keyframes workbench-dialog{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@keyframes workbench-overlay{from{background-color:rgba(28,38,55,0)}to{background-color:rgba(28,38,55,.32)}}
.modal.open{animation:workbench-overlay 220ms ease-out!important}
.modal.open>.modal-box{animation:workbench-dialog var(--motion-panel) var(--motion-ease)!important;translate:0 0!important}
.top button,.toolbar button,.toolbar select,.small-button,.preview-controls button,.modal-close,.modal-action,.modal .button,.guide-jumps button,.recipe-preview-switch button,.vault-category-tabs button,.dock-action,.dock-collapse{transition:background-color var(--motion-fast) ease-out,border-color var(--motion-fast) ease-out,color var(--motion-fast) ease-out,box-shadow var(--motion-fast) ease-out!important}
.library :is(.recipe-row,.component-card,.image-item){transition:box-shadow 200ms ease-out,border-color 200ms ease-out,background-color 200ms ease-out,transform 200ms var(--motion-ease)!important}
.library .tabs>.tab{transition:color 200ms ease-out!important}
.library .tabs>.tab:before{transition:opacity var(--motion-panel) var(--motion-ease),background-color var(--motion-panel) ease-out!important}
.library :is(.component-subtabs,.recipe-family-tabs):after{transition:left var(--motion-panel) var(--motion-ease),background-color 200ms ease-out!important}
.dock-collapse svg{transition:transform var(--motion-panel) var(--motion-ease)!important}
.image-dock .image-item button{transition:opacity 200ms ease-out,background-color var(--motion-fast) ease-out!important}
@keyframes workbench-menu{from{opacity:0;translate:0 -4px}to{opacity:1;translate:0 0}}
.recipe-more[open]>.recipe-more-menu,.tool-popover.open{animation:workbench-menu 180ms var(--motion-ease)}
.dock-action:active,.dock-collapse:active,.recipe-preview-switch button:active{box-shadow:inset 0 1px 3px #27344316!important}
.top .button:active,.toolbar .button:active,.modal .button:active,.small-button:active{transform:none!important;box-shadow:inset 0 1px 3px #27344316}
@media(prefers-reduced-motion:reduce){
  .modal.open,.modal.open>.modal-box,.library .library-panel:not(.hidden),.recipe-more[open]>.recipe-more-menu,.tool-popover.open{animation:none!important}
  .top button,.toolbar button,.toolbar select,.small-button,.preview-controls button,.modal-close,.modal-action,.modal .button,.guide-jumps button,.recipe-preview-switch button,.vault-category-tabs button,.dock-action,.dock-collapse,.dock-collapse svg,.image-dock .image-item button,.library :is(.recipe-row,.component-card,.image-item),.library .tabs>.tab,.library .tabs>.tab:before,.library :is(.component-subtabs,.recipe-family-tabs):after{transition:none!important}
}

