/* Individual reveals also work in chapters taller than the viewport. */
@media(prefers-reduced-motion:no-preference){
html.anim .band .motion-item.rv,html.anim .band .motion-item{opacity:0;transform:translate3d(0,44px,0);transition:opacity .75s ease,transform .9s cubic-bezier(.16,1,.3,1),box-shadow .35s ease,background-color .35s ease;transition-delay:var(--motion-delay,0ms)}
html.anim .band .motion-item.motion-visible{opacity:1;transform:translate3d(0,0,0)}
html.anim .band .reel.motion-item{transform:translate3d(48px,55px,0) scale(.94)}
html.anim .band .reel.motion-visible{transform:translate3d(0,0,0) scale(1)}
.reel video{transition:scale .65s cubic-bezier(.2,.7,.2,1)}
.hero-round{animation:emblem-drift 12s ease-in-out 1.5s infinite alternate}
@keyframes emblem-drift{from{translate:0 0;rotate:0deg}to{translate:-12px 18px;rotate:10deg}}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
html.anim .band .reel.motion-visible:hover,html.anim .band .reel.motion-visible:focus-within{transform:perspective(1100px) translateY(-12px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) scale(1.035);box-shadow:0 24px 55px #0005;z-index:8;transition-delay:0ms}
.reel:hover video{scale:1.025}
.compact-list li:hover{translate:8px 0;background:#85786115;border-left-width:4px}
.discussion-grid article:hover,.result-row>div:hover,.winward-stat:hover{translate:0 -6px;background:#85786115}
.start-link:hover{gap:48px;color:var(--rust)}
}
.compact-list li,.discussion-grid article,.result-row>div,.winward-stat{transition:translate .3s ease,background-color .3s ease,border-width .3s ease}
.start-link{transition:gap .3s ease,color .3s ease}
.reel:fullscreen{transform:none!important;translate:none!important;scale:1!important;rotate:0deg!important;box-shadow:none!important}
@media(prefers-reduced-motion:reduce){.motion-item{opacity:1!important;transform:none!important}.hero-round{animation:none!important}}
