/* Hallmark · pre-emit critique: P5 H5 E4 S4 R4 V4
   Motion layer: preserve the photographic gallery and make state changes perceptible. */
.button, .icon-button, .favorite-button, .top-nav-item, .category-tab,
.text-button, .source-link {
  transition: transform var(--dur-short) var(--ease-out), opacity var(--dur-short) var(--ease-out);
}
.button svg, .text-button svg, .source-link svg,
.cover-link .typographic-cover {
  transition: transform var(--dur-long) var(--ease-out);
}
.cover-image { transition: transform var(--dur-long) var(--ease-out); }
.top-navigation, .category-tabs { position: relative; }
.motion-indicator {
  position: absolute; left: 0; bottom: 0; width: 1px; height: 2px;
  background: var(--color-accent); pointer-events: none;
  transform-origin: left center; opacity: 0;
}
.top-navigation .motion-indicator { bottom: 3px; }
body[data-view="library"] .top-navigation .motion-indicator { background: var(--color-nav-ink); }
.has-motion-indicator .category-tab.active::after,
.has-motion-indicator .top-nav-item.active::after { display: none; }
.category-tabs > .motion-indicator { display: block; padding: 0; margin: 0; }
.button:not(:disabled):active, .icon-button:active, .favorite-button:active { transform: translateY(1px) scale(.96); transition-duration: var(--dur-micro); }
.top-nav-item:active, .category-tab:active, .text-button:active { transform: translateY(1px); }
.button:disabled { transform: none; }
.header-actions .button { min-height: 44px; }
.filter-search:focus-within > [data-icon] { color: var(--color-accent); }
/* Native dialog keeps its focus trap through the exit animation. */
dialog[open] { animation: none; }
dialog[open]::backdrop { animation: backdrop-in var(--dur-long) var(--ease-out) both; }
dialog[data-closing]::backdrop { animation: backdrop-out var(--dur-short) var(--ease-in) both; }
#detailSave[aria-pressed="true"] svg { fill: currentColor; color: var(--color-accent); }
@keyframes backdrop-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes backdrop-out { from { opacity: 1; } to { opacity: 0; } }
@media (hover: hover) and (pointer: fine) {
  .button:not(:disabled):hover { transform: translateY(-2px); }
  .icon-button:hover, .favorite-button:hover { transform: translateY(-1px); }
  .cover-link:hover .cover-image, .cover-link:hover .typographic-cover { transform: scale(1.045); }
  .text-button:hover svg, .source-link:hover svg { transform: translateX(3px); }
  .button:not(:disabled):active, .icon-button:active, .favorite-button:active { transform: translateY(1px) scale(.96); }
}
@media (prefers-reduced-motion: reduce) {
  .button, .icon-button, .favorite-button, .top-nav-item, .category-tab,
  .text-button, .source-link,
  .button svg, .text-button svg, .source-link svg,
  .cover-link .typographic-cover, .cover-image {
    transition: none !important;
  }
  .button:not(:disabled):hover, .button:not(:disabled):active, .icon-button:hover, .icon-button:active,
  .favorite-button:hover, .favorite-button:active,
  .top-nav-item:active, .category-tab:active, .text-button:active,
  .text-button:hover svg, .source-link:hover svg,
  .cover-link:hover .cover-image, .cover-link:hover .typographic-cover { transform: none; }
  dialog[open]::backdrop, dialog[data-closing]::backdrop { animation: none; }
}
