/* ============================================================
   Prime Cinema — Motion Layer (additive, design-preserving)
   Reuses the app's own timing tokens (--dur-*, --ease-*) so the
   additions feel native. Adds ONLY restrained micro-interactions:
   button feedback, card hover, nav transition, focus ring,
   scrollbar, header scroll shadow. No scroll-reveal, no decorative
   glow, no pinning. Gated by `html.pa-ready`.
   ============================================================ */


/* ---- Hide the scrollbar entirely (scrolling still works) ---- */
html.pa-ready {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
html.pa-ready::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

/* ---- Buttons: subtle lift on hover, press feedback on tap/click ----
   Transition intentionally mirrors the app's existing .btn transition
   (transform/box-shadow/filter) so nothing regresses. ---- */
html.pa-ready .pa-btn {
  transition:
    transform var(--dur-fast) var(--ease-out),
    box-shadow 0.3s,
    filter var(--dur-fast) var(--ease-out),
    background-color var(--dur-fast) var(--ease-out),
    border-color var(--dur-fast) var(--ease-out),
    opacity var(--dur-fast) var(--ease-out);
  will-change: transform;
}
@media (hover: hover) and (pointer: fine) {
  html.pa-ready .pa-btn:hover {
    transform: translateY(-2px);
    filter: brightness(1.05);
  }
}
html.pa-ready .pa-btn:active {
  transform: translateY(0) scale(0.96);
}



/* ---- Nav links: smooth color transition ---- */
html.pa-ready header a,
html.pa-ready nav a {
  transition:
    color var(--dur-fast) var(--ease-out),
    opacity var(--dur-fast) var(--ease-out);
}

/* ---- Neutralize input/textarea/select focus highlights ---- */
html.pa-ready input:focus,
html.pa-ready textarea:focus,
html.pa-ready select:focus,
html.pa-ready [contenteditable]:focus {
  outline: none !important;
  box-shadow: none !important;
  border-color: rgb(226 232 240) !important;
  animation: none !important;
}

/* ---- Header: subtle depth on scroll ---- */
html.pa-ready .pa-scrolled {
  box-shadow: 0 8px 30px -18px rgba(0, 0, 0, 0.7);
}

/* ---- Gift logo: guarantee the app's own animation on every device ---- */
html.pa-ready [class*="gift-motion"] {
  animation: giftFloat 3s ease-in-out infinite, giftGlow 2s ease-in-out infinite;
}