/* Original, restrained motion inspired by transitions.dev's interaction patterns. */
:root {
  --motion-fast: 140ms;
  --motion-ui: 200ms;
  --motion-panel: 220ms;
  --motion-ease: cubic-bezier(.2, .7, .2, 1);
}

.primary, .secondary, .danger, .text-button, .nav, .toggle,
.conversation-link, .collab-doc-item, .collab-channel-item,
.portfolio-tabs button, .operations-tabs button, .workspace-search-result {
  transition: background-color var(--motion-fast) ease,
    border-color var(--motion-fast) ease, color var(--motion-fast) ease,
    box-shadow var(--motion-fast) ease, transform var(--motion-fast) var(--motion-ease);
}

.workspace-hub-card, .portfolio-card, .operations-deal-card {
  transition: transform var(--motion-ui) var(--motion-ease),
    box-shadow var(--motion-ui) ease, border-color var(--motion-ui) ease;
}

@media (hover: hover) and (pointer: fine) {
  .workspace-hub-card:hover, .portfolio-card:hover, .operations-deal-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px #11212D0A;
  }
  .primary:hover:not(:disabled), .secondary:hover:not(:disabled) {
    transform: translateY(-1px);
  }
}

.primary:active:not(:disabled), .secondary:active:not(:disabled),
.workspace-hub-card:active, .operations-deal-card:active {
  transform: translateY(0) scale(.985);
}

.studio-motion-tabs {
  position: relative;
  isolation: isolate;
}
.studio-motion-tabs > button { position: relative; z-index: 1; }
.studio-motion-tabs > button.selected,
.studio-motion-tabs > button[aria-pressed="true"] {
  background: transparent;
  box-shadow: none;
}
.studio-tab-indicator {
  position: absolute;
  z-index: 0;
  pointer-events: none;
  border-radius: 6px;
  background: white;
  box-shadow: 0 1px 4px #11212D0D;
  transform-origin: left center;
}

dialog.studio-dialog-enter::backdrop {
  animation: studio-backdrop-in var(--motion-ui) ease both;
}
dialog.studio-dialog-leave::backdrop {
  animation: studio-backdrop-out var(--motion-fast) ease both;
}
@keyframes studio-backdrop-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes studio-backdrop-out { from { opacity: 1; } to { opacity: 0; } }

/* Keep the live region mounted so both the text and visual exit remain stable. */
#toast {
  display: block;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px);
  transition: opacity var(--motion-fast) ease,
    transform var(--motion-fast) var(--motion-ease),
    visibility 0s linear var(--motion-fast);
}
#toast.show {
  display: block;
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0s;
}

@media (prefers-reduced-motion: reduce) {
  :root { --motion-fast: 0ms; --motion-ui: 0ms; --motion-panel: 0ms; }
  .primary, .secondary, .danger, .text-button, .nav, .toggle,
  .conversation-link, .collab-doc-item, .collab-channel-item,
  .portfolio-tabs button, .operations-tabs button, .workspace-search-result,
  .workspace-hub-card, .portfolio-card, .operations-deal-card, #toast {
    transition: none;
  }
  .primary:hover:not(:disabled), .secondary:hover:not(:disabled),
  .workspace-hub-card:hover, .portfolio-card:hover, .operations-deal-card:hover,
  .primary:active:not(:disabled), .secondary:active:not(:disabled),
  .workspace-hub-card:active, .operations-deal-card:active, #toast {
    transform: none;
  }
  dialog.studio-dialog-enter::backdrop, dialog.studio-dialog-leave::backdrop {
    animation: none;
  }
}