/* Rainbow & Clouds: clouds drift, the last drops fall, the kite sways and the sun's rays turn slowly.
   The classic opening ("rainbow") is the fallback if the film can't load: the rain falls, the sun rises
   and the sky friends hop in. Only transform and opacity animate; reduced motion is still. */
[data-theme="rainbow"] { --rw-bow: linear-gradient(90deg, #d27a5c 0 20%, #eeac85 20% 40%, #f2cf7f 40% 60%, #a8c3a0 60% 80%, #93b4cc 80% 100%); }
[data-theme="rainbow"] .hero-art .rw-drift { animation: rw-drift 16s ease-in-out infinite alternate; }
[data-theme="rainbow"] .hero-art .rw-drop { animation: rw-fall 2.4s cubic-bezier(.5, 0, .75, 0) infinite; animation-delay: calc(var(--i) * -.4s); }
[data-theme="rainbow"] .hero-art .rw-kite { transform-box: fill-box; transform-origin: 50% 100%; animation: rw-sway 4.4s ease-in-out infinite alternate; }
[data-theme="rainbow"] .hero-art .rw-sun { animation: rw-spin 60s linear infinite; }
[data-theme="rainbow"] .card { border-radius: 28px; box-shadow: var(--shadow), inset 0 0 0 1.5px rgba(210, 122, 92, .16); }
[data-theme="rainbow"] .btn { border-radius: 999px; }
[data-theme="rainbow"] .title { letter-spacing: .01em; text-shadow: 0 2px 0 rgba(255, 255, 255, .8); }
[data-theme="rainbow"] .eyebrow { color: var(--ink); letter-spacing: .08em; }
[data-theme="rainbow"] .divider::before, [data-theme="rainbow"] .divider::after { background: var(--rw-bow); height: 3px; border-radius: 3px; }
[data-theme="rainbow"] .btn, [data-theme="rainbow"] .card h2, [data-theme="rainbow"] .title, [data-theme="rainbow"] .eyebrow { overflow-wrap: anywhere; }

/* the kid's photo: a sun with a soft butter ring */
[data-theme="rainbow"] .kp-circle .kp-win { box-shadow: 0 0 0 3px #fff8ee, 0 0 0 calc(var(--kp-w) * .05) #f2cf7f, 0 0 calc(var(--kp-w) * .24) calc(var(--kp-w) * .06) rgba(242, 207, 127, .55); }

/* the Sunshine ticket: cream paper, a rainbow edge and a scalloped cloud stub */
[data-theme="rainbow"] .ticket { background: var(--rw-bow) 0 100% / 100% 7px no-repeat, linear-gradient(180deg, #fff8ee, #fbeee0); color: #4a2f27; border-radius: 20px;
  box-shadow: 0 12px 26px rgba(74, 47, 39, .16), inset 0 0 0 1.5px rgba(210, 122, 92, .25); }
[data-theme="rainbow"] .ticket .t-main { border-right: 2px dashed rgba(210, 122, 92, .45); }
[data-theme="rainbow"] .ticket small { color: #a5583d; letter-spacing: .2em; font-weight: 800; }
[data-theme="rainbow"] .ticket b { font-family: "Baloo 2", ui-rounded, sans-serif; font-weight: 800; color: #4a2f27; }
[data-theme="rainbow"] .ticket .t-stub { background: radial-gradient(circle at 50% 0, #fff 0 9px, transparent 10px) 0 0 / 20px 14px, linear-gradient(180deg, #e6eff3, #fbeee0); }

/* the classic opening (only if the film can't load) */
[data-theme="rainbow"] .op-art svg { overflow: visible; }
[data-theme="rainbow"] .op-card { background: rgba(255, 253, 248, .92); color: var(--cardInk); box-shadow: 0 18px 50px rgba(74, 47, 39, .2); }
[data-theme="rainbow"] .op-rainbow .op-line { color: #4a2f27; text-shadow: 0 1px 10px rgba(255, 248, 238, .95); }
[data-theme="rainbow"] .op-rainbow.op-run .rw-drop { animation: rw-fall 1.2s cubic-bezier(.5, 0, .75, 0) 3 both; animation-delay: calc(var(--i) * .12s); }
[data-theme="rainbow"] .op-rainbow.op-run .rw-sun { animation: rw-up 1.4s 1.2s cubic-bezier(.22, 1, .36, 1) both, rw-spin 60s 2.6s linear infinite; }
[data-theme="rainbow"] .op-rainbow.op-run .rw-pal { transform-box: fill-box; transform-origin: 50% 100%; animation: rw-pop .7s 2.6s cubic-bezier(.34, 1.4, .64, 1) both; }
[data-theme="rainbow"] .op-art { transform: scale(1.3); transform-origin: 50% 70%; transition: opacity 1.2s ease, transform 5s cubic-bezier(.33, .05, .2, 1); }
[data-theme="rainbow"] .op-pal { transform: translateY(40vh) scale(.6); opacity: 0; transition-property: transform, opacity; transition-timing-function: cubic-bezier(.34, 1.4, .64, 1); }
[data-theme="rainbow"] .op-run .op-art, [data-theme="rainbow"] .op-run .op-pal { opacity: 1; transform: none; }
[data-theme="rainbow"] .op-final .op-art, [data-theme="rainbow"] .op-final .op-pal { opacity: 1; transform: none; transition: none; }
[data-theme="rainbow"] .critter .cr-eye { transform-box: fill-box; transform-origin: center; animation: rw-blink 5.2s ease-in-out infinite; animation-delay: calc(var(--i, 0) * -1.3s - .5s); }
@media (max-aspect-ratio: 4/5) { [data-theme="rainbow"] .op-art svg { transform: scale(1.3); transform-origin: 50% 100%; } }

/* Party TV */
[data-theme="rainbow"].tv-bd { opacity: .94; }
[data-theme="rainbow"].tv-bd .rw-drift { animation: rw-drift 18s ease-in-out infinite alternate; }
[data-theme="rainbow"].tv-bd .rw-drop { animation: rw-fall 3s cubic-bezier(.5, 0, .75, 0) infinite; animation-delay: calc(var(--i) * -.5s); }

@keyframes rw-drift { to { transform: translateX(10px); } }
@keyframes rw-fall { 0% { opacity: 0; transform: translateY(-6px); } 20% { opacity: 1; } 100% { opacity: 0; transform: translateY(26px); } }
@keyframes rw-sway { from { transform: rotate(-5deg); } to { transform: rotate(6deg); } }
@keyframes rw-spin { to { transform: rotate(360deg); } }
@keyframes rw-up { from { opacity: 0; transform: translateY(30px); } }
@keyframes rw-pop { from { opacity: 0; transform: scale(.2); } }
@keyframes rw-blink { 0%, 93%, 100% { transform: scaleY(1); } 95.5% { transform: scaleY(.08); } }
@media (prefers-reduced-motion: reduce) {
  [data-theme="rainbow"] .hero-art *, [data-theme="rainbow"] .critter .cr-eye, [data-theme="rainbow"] .op-art *, [data-theme="rainbow"].tv-bd * { animation: none !important; }
}