/* Soft, responsive motion. No animation delays for chat actions or network work. */
:root {
  --motion-ease:cubic-bezier(.2,.8,.2,1);
  --motion-spring:cubic-bezier(.2,.9,.3,1.08);
  --motion-fast:140ms;
  --motion-enter:280ms;
}
@media(prefers-reduced-motion:no-preference){
  .midnight button,.midnight .navrail-btn,.midnight .conv-item {
    transition:background-color 160ms ease,color 160ms ease,border-color 160ms ease,box-shadow 180ms ease,transform var(--motion-fast) var(--motion-ease);
  }
  .midnight button:active:not(:disabled),.midnight .navrail-btn:active { transform:scale(.96); }
  .midnight .conv-item:active { transform:scale(.985); }
  .midnight .conversation-notes-panel[open] { animation:panel-arrive var(--motion-enter) var(--motion-ease) both; }
  .midnight .conversation-notes-panel::backdrop { animation:veil-arrive 180ms ease both; }
  .midnight .chat-head,.midnight .chat-composer,.midnight .chat-messages { animation:surface-arrive 220ms var(--motion-ease) both; }
  .midnight .midnight-welcome { animation:surface-arrive 320ms var(--motion-ease) both; }
  .midnight .composer-row { transition:border-color 180ms ease,box-shadow 180ms ease; }
  .midnight .composer-row:focus-within { box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 12%,transparent); }
  .midnight .msg-actions { transition:opacity 130ms ease; }
  #userMenu.open,.workspace-more[open] .workspace-more-menu { animation:surface-arrive 180ms var(--motion-ease) both; }
  .midnight .shared-item { transition:background-color 160ms ease,transform 160ms var(--motion-ease); }
  .midnight .shared-item:active { transform:scale(.985); }
  @media(hover:hover) and (pointer:fine){
    .midnight .btn-primary:hover { transform:translateY(-1px); }
    .midnight .btn-primary:active { transform:scale(.96); }
  }
}
@keyframes panel-arrive { from { opacity:0; transform:translateX(20px); } to { opacity:1; transform:translateX(0); } }
@keyframes surface-arrive { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
@keyframes veil-arrive { from { opacity:0; } to { opacity:1; } }
@media(prefers-reduced-motion:reduce){
  .midnight *,.midnight *::before,.midnight *::after,#userMenu {
    animation:none !important; transition:none !important; scroll-behavior:auto !important;
  }
  .midnight dialog::backdrop { animation:none !important; }
}