/* Runway Night: the runway lights chase toward the front row, flashes pop, sparkles twinkle over the house.
   The classic opening ("runway", only if the film can't load): the house lights drop, the runway lights
   race on, the flashes pop and the name lands on the wall. Only transform and opacity animate; reduced
   motion shows the finished show, still. */
[data-theme="runway"] .hero-sky .hero-art { overflow: visible; }
[data-theme="runway"] .hero-art .rn-chase { animation: rn-chase 1.1s linear infinite; animation-delay: calc(var(--i) * -.37s); }
[data-theme="runway"] .hero-art .rn-fl { transform-box: fill-box; transform-origin: center; opacity: 0; animation: rn-pop 4.6s ease-out infinite; animation-delay: calc(var(--i) * -1.7s); }
[data-theme="runway"] .hero-art .twinkle { animation: rn-tw 3.2s ease-in-out infinite; animation-delay: calc(var(--i) * -.5s); }
[data-theme="runway"] .card { border-radius: 4px; box-shadow: var(--shadow), inset 0 3px 0 #ff3d8b; }
[data-theme="runway"] .btn { border-radius: 2px; letter-spacing: .14em; text-transform: uppercase; font-weight: 700; }
[data-theme="runway"] .title { font-weight: 900; letter-spacing: .01em; text-shadow: 0 0 24px rgba(255, 61, 139, .32), 0 2px 0 rgba(0, 0, 0, .4); }
[data-theme="runway"] .eyebrow { letter-spacing: .26em; text-transform: uppercase; font-size: .78rem; color: #f4c6cf; }
[data-theme="runway"] .card h2 { font-style: italic; }
[data-theme="runway"] .btn, [data-theme="runway"] .card h2, [data-theme="runway"] .title, [data-theme="runway"] .eyebrow { overflow-wrap: anywhere; }

/* the classic opening */
[data-theme="runway"] .op-art svg { overflow: visible; }
[data-theme="runway"] .op-card:not(.fm-cta) { background: rgba(12, 10, 13, .8); box-shadow: 0 0 0 1px rgba(230, 201, 143, .5), 0 22px 60px rgba(255, 61, 139, .22); }
[data-theme="runway"] .op-runway .op-line { color: var(--ink); text-shadow: 0 2px 16px rgba(0, 0, 0, .9); }
[data-theme="runway"] .op-runway.op-run .rn-chase { animation: rn-on .5s calc(.6s + var(--i) * .16s) linear both, rn-chase 1.1s calc(1.4s + var(--i) * -.37s) linear infinite; }
[data-theme="runway"] .op-runway.op-run .rn-fl { animation: rn-pop 2.4s calc(1.4s + var(--i) * .3s) ease-out both; }
[data-theme="runway"] .op-runway.op-run .rn-name { transform-box: fill-box; transform-origin: center; animation: rn-in .7s 2.4s cubic-bezier(.22, 1, .36, 1) both; }
[data-theme="runway"] .op-art { transform: scale(1.35); transform-origin: 50% 70%; transition: opacity 1s ease, transform 4s cubic-bezier(.33, .05, .2, 1); }
[data-theme="runway"] .op-run .op-art, [data-theme="runway"] .op-final .op-art { opacity: 1; transform: none; }
[data-theme="runway"] .op-final .op-art { transition: none; }
@media (max-aspect-ratio: 4/5) { [data-theme="runway"] .op-art svg { transform: scale(1.3); transform-origin: 50% 100%; } }

/* Party TV backdrop */
[data-theme="runway"].tv-bd .rn-chase { animation: rn-chase 1.4s linear infinite; animation-delay: calc(var(--i) * -.47s); }
[data-theme="runway"].tv-bd .rn-fl { transform-box: fill-box; transform-origin: center; opacity: 0; animation: rn-pop 5.4s ease-out infinite; animation-delay: calc(var(--i) * -1.8s); }

@keyframes rn-chase { 0%, 30% { opacity: 1; } 34%, 100% { opacity: .3; } }
@keyframes rn-on { 0% { opacity: 0; } 40% { opacity: 1; } 60% { opacity: .3; } 100% { opacity: 1; } }
@keyframes rn-in { from { opacity: 0; transform: scale(1.6); } to { opacity: 1; transform: none; } }
@keyframes rn-pop { 0%, 86% { opacity: 0; transform: scale(.3); } 88% { opacity: 1; transform: scale(1.15); } 100% { opacity: 0; transform: scale(1); } }
@keyframes rn-tw { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }
@media (prefers-reduced-motion: reduce) {
  [data-theme="runway"] .hero-art *, [data-theme="runway"] .op-art *, [data-theme="runway"].tv-bd * { animation: none !important; }
  [data-theme="runway"] .hero-art .rn-fl, [data-theme="runway"].tv-bd .rn-fl { opacity: 0; }
}