/* Destiny Intense styles. Pair with destiny-intense.js. Everything animates transform/opacity/filter only. */



/* scroll-driven reveals: native timeline when supported (off main thread) */
@keyframes di-rise { from { opacity: 0; transform: translateY(60px) scale(0.96); } to { opacity: 1; transform: none; } }
@keyframes di-scale { from { transform: scale(0.82); border-radius: 48px; } to { transform: none; } }
@keyframes di-fade { from { opacity: 0; filter: blur(8px); } to { opacity: 1; filter: none; } }
@keyframes di-tilt { from { opacity: 0; transform: perspective(1000px) rotateX(24deg) translateY(40px); } to { opacity: 1; transform: none; } }
@keyframes di-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.di-native-scroll [data-scrub] { animation: di-rise linear both; animation-timeline: view(); animation-range: entry 0% cover 35%; }
.di-native-scroll [data-scrub="scale"] { animation-name: di-scale; animation-range: entry 0% cover 50%; }
.di-native-scroll [data-scrub="fade"] { animation-name: di-fade; }
.di-native-scroll [data-scrub="tilt"] { animation-name: di-tilt; }
.di-native-scroll [data-progress] { transform-origin: 0 50%; animation: di-progress linear both; animation-timeline: scroll(root); }
/* fallback: JS writes --p (0→1) for visible elements only */
html:not(.di-native-scroll) [data-scrub] { opacity: var(--p, 1); transform: translateY(calc((1 - var(--p, 1)) * 60px)) scale(calc(0.96 + var(--p, 1) * 0.04)); }
html:not(.di-native-scroll) [data-scrub="scale"] { opacity: 1; transform: scale(calc(0.82 + var(--p, 1) * 0.18)); }
html:not(.di-native-scroll) [data-progress] { transform-origin: 0 50%; transform: scaleX(var(--p, 0)); }


/* magnetic */
[data-magnetic] { transition: transform 600ms var(--ease-spring, cubic-bezier(0.34, 1.56, 0.64, 1)); }
[data-magnetic].di-mag-on { transition: transform 120ms linear; }
[data-magnetic-inner] { display: inline-block; transition: transform 600ms var(--ease-spring, cubic-bezier(0.34, 1.56, 0.64, 1)); }
[data-magnetic].di-mag-on [data-magnetic-inner] { transition: transform 120ms linear; }



/* view transitions: a quick cross-fade with a slight scale */
::view-transition-old(root) { animation: 260ms cubic-bezier(0.4, 0, 1, 1) both di-vt-out; }
::view-transition-new(root) { animation: 420ms cubic-bezier(0.16, 1, 0.3, 1) both di-vt-in; }
@keyframes di-vt-out { to { opacity: 0; transform: scale(0.985); } }
@keyframes di-vt-in { from { opacity: 0; transform: scale(1.015); } }

/* lower tiers trim cost; reduced motion stays calm */
@media (prefers-reduced-motion: reduce) {
  .di-native-scroll [data-scrub], .di-native-scroll [data-progress] { animation: none; opacity: 1; transform: none; filter: none; }
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}