/* UMWE unified motion system — fade-first, subtle and professional */
:root{
  --umwe-fast:120ms;
  --umwe-motion:200ms;
  --umwe-slow:240ms;
  --umwe-ease:cubic-bezier(.22,.8,.22,1);
}

/* Views: fade instead of visibly sliding/repositioning content. */
main.umwe-view-enter > .page,
main.umwe-view-enter > .dashboard-page{
  animation:umweViewFade var(--umwe-motion) ease-out both;
  backface-visibility:hidden;
}
@keyframes umweViewFade{
  from{opacity:0}
  to{opacity:1}
}

/* Drawer keeps a controlled physical slide because its direction is meaningful. */
.sidebar{
  transition:transform var(--umwe-slow) var(--umwe-ease),box-shadow var(--umwe-motion) ease !important;
  will-change:transform;
}
.scrim{animation:umweScrimIn 180ms ease-out both}
@keyframes umweScrimIn{from{opacity:0}to{opacity:1}}

/* Notifications/profile: fade with only 2px of movement — avoids the pop/glitch effect. */
.popover{
  transform-origin:top right;
  animation:umwePopoverFade 160ms ease-out both;
  backface-visibility:hidden;
}
@keyframes umwePopoverFade{
  from{opacity:0;transform:translateY(-2px)}
  to{opacity:1;transform:translateY(0)}
}

/* Click feedback: opacity/background rather than scaling the whole layout. */
button,.task-card,.summary-card2,.compact-list button,.list-row,.user-row.clickable,.quick button{
  transition:background-color var(--umwe-fast) ease,border-color var(--umwe-fast) ease,box-shadow var(--umwe-fast) ease,opacity var(--umwe-fast) ease;
}
button:active:not(:disabled),
.task-card:active:not(:disabled),
.summary-card2:active,
.compact-list button:active:not(:disabled),
.list-row:active,
.user-row.clickable:active,
.quick button:active:not(:disabled){opacity:.82}

/* Notification rows: clickable feel without moving their geometry. */
.popover .notification-item,
.popover [data-notification-id],
.notification-item{
  cursor:pointer;
  transition:background-color 130ms ease,opacity 160ms ease;
}
.popover .notification-item:hover,
.popover [data-notification-id]:hover,
.notification-item:hover{background-color:rgba(127,127,127,.08)}

/* State changes settle softly. */
.pill,.badge,.closed-card,.feedback,.progress-ring,.donut{
  transition:opacity var(--umwe-motion) ease,background-color var(--umwe-motion) ease,color var(--umwe-motion) ease;
}

/* Dialogs: simple fade; no scale that can make text look blurry for a frame. */
[role="dialog"],.modal,.modal-card,.dialog,.dialog-card{
  animation:umweModalFade 180ms ease-out both;
  backface-visibility:hidden;
}
@keyframes umweModalFade{from{opacity:0}to{opacity:1}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
}