@media (prefers-reduced-motion:no-preference){
/* 1 · card tilt and shine (wrapper only, never the exported .card) */
#livecard{transform:perspective(900px) rotateX(var(--tx,0deg)) rotateY(var(--ty,0deg));transition:transform .35s cubic-bezier(.2,.7,.2,1);will-change:transform;position:relative;border-radius:22px}
#livecard.tilting{transition:transform .08s linear}
#livecard.tilt-reset{transition:none}
#livecard::after{content:'';position:absolute;inset:0;border-radius:22px;pointer-events:none;z-index:6;opacity:0;transition:opacity .3s;background:radial-gradient(circle at var(--mx,50%) var(--my,30%),#ffffff59,#ffffff00 55%);mix-blend-mode:soft-light}
#livecard.tilting::after{opacity:1}

/* 2 · card swap when the sport changes */
#livecard.card-swap{animation:card-swap .55s cubic-bezier(.2,.8,.2,1)}
@keyframes card-swap{0%{opacity:.2;transform:perspective(900px) translateY(18px) rotateY(-28deg) scale(.94)}100%{opacity:1;transform:perspective(900px)}}

/* 3 · step and view transitions */
.wizard-step.step-enter{animation:step-in .28s ease-out}
@keyframes step-in{from{opacity:0;transform:translateX(calc(var(--dir,1)*18px))}to{opacity:1;transform:none}}
main>section.view-enter{animation:view-in .3s ease-out}
@keyframes view-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* 4 · progress feedback for the AI cut-out */
button.ai-busy{background-image:linear-gradient(110deg,#ffffff00 30%,#ffffff40 50%,#ffffff00 70%);background-size:220% 100%;animation:ai-sheen 1.4s linear infinite}
@keyframes ai-sheen{from{background-position:120% 0}to{background-position:-120% 0}}
}
.feedback.ai-progress{position:relative;padding-bottom:12px}
.feedback.ai-progress::after{content:'';position:absolute;left:0;bottom:0;height:4px;width:var(--ai-progress,0%);max-width:100%;border-radius:4px;background:var(--gradient);transition:width .3s}

/* 5 · whole home boxes are clickable and shine; gradient headline words shimmer */
.ol-choice{cursor:pointer}
.ol-choice::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(105deg,#fff0 38%,#ffffff2e 50%,#fff0 62%) 160% 0/250% 100% no-repeat}
.ol-choice:hover{border-color:#8a6aa8;box-shadow:0 22px 60px #0006}
main h1 em{background:linear-gradient(105deg,#fff0 40%,#fffd 50%,#fff0 60%) 150% 0/250% 100% no-repeat,var(--gradient);-webkit-background-clip:text;background-clip:text;color:transparent}
@media(prefers-reduced-motion:no-preference){
 .ol-choice{transition:border-color .2s,box-shadow .2s,transform .25s}
 .ol-choice:hover{transform:translateY(-3px)}
 .ol-choice::after{animation:box-shine 5s ease-in-out infinite}
 .ol-choice.ol-cards::after{animation-delay:1.4s}
 main h1 em{animation:welcome-shine 3.6s ease-in-out 1s infinite}
 @keyframes box-shine{0%{background-position:160% 0}30%,100%{background-position:-70% 0}}
 @keyframes welcome-shine{0%{background-position:150% 0,0 0}45%,100%{background-position:-60% 0,0 0}}
}

/* 6 · premium sheen on the home showcase cards */
.model-card{overflow:hidden}
.model-card::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:8;background:linear-gradient(105deg,transparent 35%,#ffffff8c 50%,transparent 65%) 160% 0/250% 100% no-repeat;mix-blend-mode:soft-light;animation:model-sheen 6s ease-in-out infinite}
.model-card:nth-child(2)::after{animation-delay:.9s}
.model-card:nth-child(3)::after{animation-delay:1.8s}
@keyframes model-sheen{0%,55%{background-position:160% 0}100%{background-position:-60% 0}}
@media (prefers-reduced-motion:reduce){.model-card::after{animation:none;opacity:0}}