/* Category pages use the same whole-page slide timing as Home/Pricing. */
@view-transition { navigation: auto; }
#designs .stepped-card.is-active { cursor: pointer; }
/* The old photograph curtain is retired; template artwork is unchanged. */
#category-curtain { display: none !important; }
html[data-dar-category-slide="left"]::view-transition-old(root) { animation: dar-category-old-left 280ms cubic-bezier(.22,.7,.2,1) both; }
html[data-dar-category-slide="left"]::view-transition-new(root) { animation: dar-category-new-left 280ms cubic-bezier(.22,.7,.2,1) both; }
html[data-dar-category-slide="right"]::view-transition-old(root) { animation: dar-category-old-right 280ms cubic-bezier(.22,.7,.2,1) both; }
html[data-dar-category-slide="right"]::view-transition-new(root) { animation: dar-category-new-right 280ms cubic-bezier(.22,.7,.2,1) both; }
@keyframes dar-category-old-left { to { transform: translateX(-100%); } }
@keyframes dar-category-new-left { from { transform: translateX(100%); } }
@keyframes dar-category-old-right { to { transform: translateX(100%); } }
@keyframes dar-category-new-right { from { transform: translateX(-100%); } }
@media (prefers-reduced-motion: no-preference) {
  html[data-dar-category-arrive] { overflow-x: clip; }
  html[data-dar-category-arrive="left"] body { animation: dar-category-arrive-left 280ms cubic-bezier(.22,.7,.2,1) both; }
  html[data-dar-category-arrive="right"] body { animation: dar-category-arrive-right 280ms cubic-bezier(.22,.7,.2,1) both; }
}
@keyframes dar-category-arrive-left { from { transform: translateX(100vw); } }
@keyframes dar-category-arrive-right { from { transform: translateX(-100vw); } }
/* Keep transition snapshots from intercepting taps on the live page. */
html[data-dar-category-slide]::view-transition,
html[data-dar-category-slide]::view-transition-group(*),
html[data-dar-category-slide]::view-transition-image-pair(*),
html[data-dar-category-slide]::view-transition-old(*),
html[data-dar-category-slide]::view-transition-new(*) { pointer-events: none; }

/* Hold the old and new live views at their starting positions until the chooser is ready. */
html[data-dar-category-wait][data-dar-category-slide]::view-transition-old(root),
html[data-dar-category-wait][data-dar-category-slide]::view-transition-new(root) { animation-play-state: paused; }

/* The incoming chooser is not actionable while the old Home view is displayed. */
html[data-dar-category-wait] body, html[data-dar-category-wait] body * { pointer-events: none !important; }

/* Keep the outgoing language view stable until the localized destination is ready. */
html[data-dar-category-slide="swap"]::view-transition-old(root) { animation: dar-language-old 280ms linear both; }
html[data-dar-category-slide="swap"]::view-transition-new(root) { animation: dar-language-new 280ms linear both; }
@keyframes dar-language-old { from, to { opacity: 1; } }
@keyframes dar-language-new { from, to { opacity: 0; } }