/* Wild West Rodeo: a tumbleweed rolls back and forth, the bunting sways, the roadrunner hops on the
   poster and (from 8) the fence lights twinkle. The classic opening ("saddle") is the fallback if the
   film can't load: the ranch slides in, the tumbleweed rolls through and the buddies pop up.
   Only transform and opacity animate; reduced motion is still. */
[data-theme="rodeo"] { --ro-rope: repeating-linear-gradient(115deg, #c99a5c 0 5px, #e2b779 5px 9px); }
[data-theme="rodeo"] .hero-art .ro-tw { animation: ro-roll 7s ease-in-out infinite alternate; }
[data-theme="rodeo"] .hero-art .ro-twr { animation: ro-spin 7s ease-in-out infinite alternate; }
[data-theme="rodeo"] .hero-art .ro-flags { transform-box: fill-box; transform-origin: 50% 0; animation: ro-sway 3.6s ease-in-out infinite alternate; }
[data-theme="rodeo"] .hero-art .ro-hop { animation: ro-hop 2.4s ease-in-out infinite; }
[data-theme="rodeo"] .hero-art .ro-bulb { animation: ro-bulb 2.2s ease-in-out infinite alternate; animation-delay: calc(var(--i) * -.55s); }
[data-theme="rodeo"] .card { border-radius: 18px; box-shadow: var(--shadow), inset 0 0 0 1.5px rgba(201, 154, 92, .32); }
[data-theme="rodeo"] .btn { border-radius: 14px; }
[data-theme="rodeo"] .title { letter-spacing: .01em; text-shadow: 0 2px 0 rgba(255, 255, 255, .7), 0 0 18px rgba(255, 201, 77, .4); }
[data-theme="rodeo"] .eyebrow { color: var(--ink); letter-spacing: .1em; }
[data-theme="rodeo"] .divider::before, [data-theme="rodeo"] .divider::after { background: var(--ro-rope); height: 4px; border-radius: 4px; }
[data-theme="rodeo"] .btn, [data-theme="rodeo"] .card h2, [data-theme="rodeo"] .title, [data-theme="rodeo"] .eyebrow { overflow-wrap: anywhere; }

/* the kid's photo: a WANTED poster frame (cream paper, a rope edge) */
[data-theme="rodeo"] .kp-stamp .kp-win { box-shadow: 0 0 0 3px #fff4dc, 0 0 0 calc(var(--kp-w) * .05) #c99a5c, 0 0 0 calc(var(--kp-w) * .07) #fff4dc, 0 8px 22px rgba(90, 50, 20, .3); }

/* the Rodeo ticket: sun-faded paper, a corral-fence stub, a rope perforation */
[data-theme="rodeo"] .ticket { background: linear-gradient(115deg, #fffaf2 0%, #ffe9cf 55%, #ffd9b0 100%); color: #3a2418; border-radius: 14px;
  box-shadow: 0 12px 26px rgba(90, 50, 20, .18), inset 0 0 0 1.5px rgba(201, 154, 92, .55); }
[data-theme="rodeo"] .ticket .t-main { border-right: 3px dashed rgba(176, 122, 82, .6); }
[data-theme="rodeo"] .ticket small { color: #8a3f22; letter-spacing: .2em; font-weight: 800; }
[data-theme="rodeo"] .ticket b { font-family: "Rye", Georgia, serif; font-weight: 400; color: #3a2418; }
[data-theme="rodeo"] .ticket .t-stub { background: linear-gradient(180deg, transparent 0 34%, #b97a45 34% 40%, transparent 40% 62%, #b97a45 62% 68%, transparent 68%), linear-gradient(180deg, #ffd9aa, #f2b880); }

/* the classic opening (only if the film can't load) */
[data-theme="rodeo"] .op-art svg { overflow: visible; }
[data-theme="rodeo"] .op-card { background: rgba(255, 250, 242, .94); color: var(--cardInk); box-shadow: 0 18px 50px rgba(90, 50, 20, .24); }
[data-theme="rodeo"] .op-saddle .op-line { color: #3a2418; text-shadow: 0 1px 0 #fff, 0 0 14px rgba(255, 255, 255, .9); }
[data-theme="rodeo"] .op-saddle.op-run .ro-tw { animation: ro-in 1.4s .5s cubic-bezier(.22, 1, .36, 1) both, ro-roll 7s 2s ease-in-out infinite alternate; }
[data-theme="rodeo"] .op-art { transform: scale(1.3); transform-origin: 50% 60%; transition: opacity 1.2s ease, transform 5s cubic-bezier(.33, .05, .2, 1); }
[data-theme="rodeo"] .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="rodeo"] .op-run .op-art, [data-theme="rodeo"] .op-run .op-pal { opacity: 1; transform: none; }
[data-theme="rodeo"] .op-final .op-art, [data-theme="rodeo"] .op-final .op-pal { opacity: 1; transform: none; transition: none; }
[data-theme="rodeo"] .critter .cr-eye { transform-box: fill-box; transform-origin: center; animation: ro-blink 5.4s ease-in-out infinite; animation-delay: calc(var(--i, 0) * -1.2s - .7s); }
@media (max-aspect-ratio: 4/5) { [data-theme="rodeo"] .op-art svg { transform: scale(1.35); transform-origin: 50% 100%; } }

/* Party TV */
[data-theme="rodeo"].tv-bd { opacity: .95; }
[data-theme="rodeo"].tv-bd .ro-tvf { transform-box: fill-box; transform-origin: 50% 0; animation: ro-sway 4.4s ease-in-out infinite alternate; }
[data-theme="rodeo"].tv-bd .ro-tvtw { animation: ro-roll 9s ease-in-out infinite alternate; }

@keyframes ro-roll { from { transform: translateX(-22px); } to { transform: translateX(14px); } }
@keyframes ro-spin { from { transform: rotate(-200deg); } to { transform: rotate(130deg); } }
@keyframes ro-sway { from { transform: rotate(-1.4deg); } to { transform: rotate(1.4deg); } }
@keyframes ro-hop { 0%, 60%, 100% { transform: translateY(0); } 70% { transform: translateY(-5px); } 80% { transform: translateY(0); } 88% { transform: translateY(-2px); } }
@keyframes ro-bulb { from { opacity: .55; } to { opacity: 1; } }
@keyframes ro-in { from { opacity: 0; transform: translateX(-160px); } }
@keyframes ro-blink { 0%, 93%, 100% { transform: scaleY(1); } 95.5% { transform: scaleY(.08); } }
@media (prefers-reduced-motion: reduce) {
  [data-theme="rodeo"] .hero-art *, [data-theme="rodeo"] .critter .cr-eye, [data-theme="rodeo"] .op-art *, [data-theme="rodeo"].tv-bd * { animation: none !important; }
}