/* Reversible motion experiment: scroll choreography and interaction feedback. */
.scroll-meter{position:fixed;inset:0 0 auto;height:3px;z-index:20;pointer-events:none;transform-origin:left;background:linear-gradient(90deg,#159fff,#58f7d1);box-shadow:0 0 15px #38dfff99;scale:0 1}
.motion-running .scroll-pop{opacity:0;transform:perspective(1000px) translateY(55px) rotateX(7deg) scale(.97);transition:opacity .75s ease var(--pop-delay,0ms),transform .95s cubic-bezier(.16,1,.3,1) var(--pop-delay,0ms)}
.motion-running .scroll-pop.is-inview{opacity:1;transform:perspective(1000px) translateY(0) rotateX(0) scale(1)}
.motion-running .book-card.scroll-pop:hover{transform:translateY(-9px) rotateX(2deg)}
.motion-running .hero-copy{translate:0 var(--hero-scroll,0px)}
.motion-running .cinema-art{translate:0 var(--art-scroll,0px)}
.motion-running .card-image{translate:0 var(--card-scroll,0px)}
.motion-running .founder-symbol{translate:0 var(--founder-scroll,0px);rotate:var(--founder-turn,0deg)}
button,a,input{transition:background-color .25s,color .25s,border-color .25s,box-shadow .3s,filter .3s}
.motion-running button:active,.motion-running .primary:active{scale:.96;transition:scale .15s}
.filters button.selected{box-shadow:0 0 22px #30e4c91a}
.search:focus-within{border-color:var(--teal);box-shadow:0 6px 18px -12px var(--teal)}
.click-ripple{position:fixed;width:46px;height:46px;margin:-23px;pointer-events:none;border:1px solid #66ecd8bb;border-radius:50%;background:radial-gradient(circle,#5de9e530,transparent 65%);box-shadow:0 0 18px #48d8fa44;z-index:1000}
.scroll-glass{position:absolute;pointer-events:none;border-radius:50%;border:1px solid #b4eaff3b;background:radial-gradient(circle at 28% 23%,#eaffff60,transparent 16%),radial-gradient(circle at 67% 75%,#159fff20,transparent 50%);box-shadow:inset -7px -10px 20px #00679c22,inset 2px 2px 8px #bcfaff2a,0 0 35px #1daddd11;z-index:-1;translate:0 var(--glass-scroll,0px)}
.library{position:relative;isolation:isolate}.glass-one{width:110px;height:110px;right:-30px;top:65px}.glass-two{width:54px;height:54px;left:-23px;bottom:65px}.motion-running .scroll-glass{animation:glass-drift 8s ease-in-out infinite alternate}.glass-two{animation-delay:-4s!important}
.motion-running .primary:hover{box-shadow:0 8px 35px #40d8c548,inset 0 1px 0 #ffffffa0}
.motion-running .add-button:hover{rotate:90deg;transition:rotate .4s ease,background .3s;box-shadow:0 0 20px #40d8c53a}
.motion-running .brand:hover img{rotate:-7deg;scale:1.08;transition:rotate .5s,scale .5s}
.motion-paused .scroll-pop{opacity:1;transform:none}.motion-paused .scroll-glass{translate:0 0}.motion-paused .scroll-meter{display:none}
@keyframes glass-drift{from{transform:translateX(-8px) rotate(-8deg)}to{transform:translateX(12px) rotate(8deg)}}
@media(max-width:760px){.motion-running .scroll-pop{transform:translateY(32px) scale(.98)}.motion-running .scroll-pop.is-inview{transform:translateY(0) scale(1)}.glass-one{right:0;width:70px;height:70px}.glass-two{left:-10px;width:36px;height:36px}}
@media(prefers-reduced-motion:reduce){body:not(.motion-running) .scroll-pop{opacity:1;transform:none}body:not(.motion-running) .scroll-glass{animation:none}}