/* Approved interaction motion. Content and initial hero remain visible. */
:root { --surya-motion-ease: cubic-bezier(.2,.8,.2,1); }
.surya-gallery-hero > img[data-motion-layer], .surya-gallery-frame > img[data-motion-layer] { position: absolute; inset: 0; }
.surya-gallery-frame > img[data-motion-layer] { background: var(--ground); }
.surya-gallery-feedback { z-index: 1; }
.surya-gallery-feedback p:not([hidden]) { padding: 8px 12px; border: 1px solid var(--steel); background: var(--paper); }
.surya-gallery-main-status:not([hidden]) { z-index: 1; pointer-events: none; padding: 12px; place-content: end start; color: var(--paper); background: linear-gradient(transparent 70%,rgb(23 54 59 / 80%)); }
.surya-gallery-dialog { opacity: 1; transform: translateY(0); transition: opacity 220ms var(--surya-motion-ease), transform 220ms var(--surya-motion-ease); }
.surya-gallery-dialog::backdrop { opacity: 1; transition: opacity 220ms var(--surya-motion-ease); }
.surya-gallery-dialog[data-motion-closing]::backdrop { opacity: 0; }
@starting-style { .surya-gallery-dialog[open]::backdrop { opacity: 0; } }
.surya-action, .surya-gallery-button, .surya-back, .surya-stepper button { transition: transform 120ms var(--surya-motion-ease); }
html:not([data-motion-off]):not([data-motion-keyboard]) :is(.surya-action,.surya-gallery-button,.surya-back,.surya-stepper button):active:not(:disabled) { transform: translateY(1px); }
html[data-motion-off] .surya-gallery-dialog, html[data-motion-off] .surya-gallery-dialog::backdrop, html[data-motion-off] button,
html[data-motion-keyboard] .surya-gallery-dialog, html[data-motion-keyboard] .surya-gallery-dialog::backdrop, html[data-motion-keyboard] button { transition: none; }
@media (prefers-reduced-motion: reduce) {
  .surya-gallery-dialog, .surya-gallery-dialog::backdrop, .surya-page button, .surya-page a { transition: none; }
  .surya-page button:active { transform: none !important; }
}