/* V57.10.3 — restrained professional motion layer */
:root{
  --motion-fast:140ms;
  --motion-med:240ms;
  --motion-slow:360ms;
  --motion-ease:cubic-bezier(.2,.75,.25,1);
  --motion-ease-out:cubic-bezier(.16,1,.3,1);
}

@view-transition{navigation:auto}
::view-transition-old(root){animation:motionPageOld 150ms ease both}
::view-transition-new(root){animation:motionPageNew 260ms var(--motion-ease-out) both}
@keyframes motionPageOld{to{opacity:.72;transform:scale(.997)}}
@keyframes motionPageNew{from{opacity:0;transform:translateY(5px);filter:blur(1px)}to{opacity:1;transform:none;filter:none}}

html.motion-enabled body{animation:motionBodyIn 300ms var(--motion-ease-out) both}
@keyframes motionBodyIn{from{opacity:.01}to{opacity:1}}

/* Module canvas entry. Kept subtle so data-heavy pages do not feel theatrical. */
html.motion-enabled #main{animation:motionMainIn 360ms var(--motion-ease-out) both}
@keyframes motionMainIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

html.motion-enabled .motion-reveal{
  opacity:0;
  transform:translateY(8px) scale(.998);
  animation:motionReveal 360ms var(--motion-ease-out) forwards;
  animation-delay:var(--motion-delay,0ms);
}
@keyframes motionReveal{to{opacity:1;transform:none}}

/* Sidebar/nav micro-interactions */
#sidebar,#sidebarToggle{transition:width var(--motion-med) var(--motion-ease),transform var(--motion-med) var(--motion-ease),box-shadow var(--motion-med) ease!important}
#sidebar #navList .modItem,#sidebar #gsBtn,#sidebar .sbLogoutBtn{
  transition:background-color var(--motion-fast) ease,color var(--motion-fast) ease,transform var(--motion-fast) var(--motion-ease),box-shadow var(--motion-fast) ease!important;
}
#sidebar #navList .modItem:hover,#sidebar #gsBtn:hover{transform:translateX(2px)}
#sidebar #navList .modItem:active,#sidebar #gsBtn:active{transform:translateX(1px) scale(.992)}
#sidebar #navList .modItem svg,#sidebar #gsBtn svg{transition:transform var(--motion-med) var(--motion-ease)!important}
#sidebar #navList .modItem:hover svg,#sidebar #gsBtn:hover svg{transform:scale(1.06)}

/* Buttons: tactile without bouncing */
button,.btn,[role="button"],a.button,a.btn,input[type="button"],input[type="submit"]{
  transition:transform var(--motion-fast) var(--motion-ease),box-shadow var(--motion-med) ease,background-color var(--motion-fast) ease,border-color var(--motion-fast) ease,color var(--motion-fast) ease,opacity var(--motion-fast) ease!important;
}
button:not(:disabled):hover,.btn:not(.disabled):hover,[role="button"]:hover,a.button:hover,a.btn:hover{transform:translateY(-1px)}
button:not(:disabled):active,.btn:not(.disabled):active,[role="button"]:active,a.button:active,a.btn:active{transform:translateY(0) scale(.985)!important;transition-duration:70ms!important}

/* Cards/panels: only elements that already visually behave like surfaces */
:is(.card,.panel,.kpiCard,.metricCard,.statCard,.summaryCard,.moduleCard,.tn-card,.dc-card,.fl-card,.lib-card,.vm-card,.wj-card,.dcl-card,.adm-card,.st-card){
  transition:transform var(--motion-med) var(--motion-ease),box-shadow var(--motion-med) ease,border-color var(--motion-med) ease,background-color var(--motion-med) ease!important;
}
:is(.card,.panel,.kpiCard,.metricCard,.statCard,.summaryCard,.moduleCard,.tn-card,.dc-card,.fl-card,.lib-card,.vm-card,.wj-card,.dcl-card,.adm-card,.st-card):hover{
  transform:translateY(-2px);
}

/* Form focus feels deliberate instead of instantaneous */
input,textarea,select{
  transition:border-color var(--motion-fast) ease,box-shadow var(--motion-med) ease,background-color var(--motion-fast) ease,transform var(--motion-fast) ease!important;
}
input:focus,textarea:focus,select:focus{transition-duration:180ms!important}

/* Tables and list rows */
tbody tr,.listRow,.timelineItem,.activityItem{
  transition:background-color var(--motion-fast) ease,box-shadow var(--motion-fast) ease,opacity var(--motion-fast) ease!important;
}

/* Modal / overlay surfaces */
:is(dialog,[role="dialog"],.modal,.dialog,.drawer,.sheet,.popover,.dropdown,.menu,.suite-modal,.fl-confirm,.pdf-preview-card){
  transform-origin:50% 20%;
}
:is(dialog[open],.modal.open,.modal.show,.dialog.open,.drawer.open,.sheet.open,.popover.open,.dropdown.open,.menu.open,.suite-modal.open,.fl-confirm.open,.pdf-preview-card.open){
  animation:motionDialogIn 220ms var(--motion-ease-out) both;
}
@keyframes motionDialogIn{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}

/* Toasts / notices */
:is(.toast,.fl-toast,.notice,.snackbar){animation:motionToastIn 260ms var(--motion-ease-out) both}
@keyframes motionToastIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}

/* Tabs/chips */
:is(.tab,.tabs button,.dcl-tab,.tn-tab,.filterChip,.chip){transition:transform var(--motion-fast) var(--motion-ease),background-color var(--motion-fast) ease,color var(--motion-fast) ease,border-color var(--motion-fast) ease!important}
:is(.tab,.tabs button,.dcl-tab,.tn-tab,.filterChip,.chip):active{transform:scale(.975)}

/* Loading overlay becomes a softer hand-off into content */
#moduleBoot{transition:opacity 260ms ease,visibility 260ms ease!important}

@media (prefers-reduced-motion:reduce){
  @view-transition{navigation:none}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important;transition-delay:0ms!important}
  html.motion-enabled .motion-reveal{opacity:1!important;transform:none!important}
}
.motion-pressed{transform:scale(.988)!important}
