/* Motion follows selection and direct interaction, without continuous effects. */
.agent-hero,.all-library-header{--parallax-x:0px;--parallax-y:0px}
.motion-toggle{position:absolute;left:32px;bottom:14px;display:flex;align-items:center;gap:7px;background:transparent;color:#47658c;font:10px/1.5 var(--sans);padding:5px 0;min-height:28px;z-index:8}.all-library-header .motion-toggle{left:auto;right:14px;top:10px;bottom:auto;color:white;background:#18386b6e;padding:4px 7px;border-radius:4px;font-size:9px}.motion-indicator{width:5px;height:5px;background:#8496b2;border-radius:50%}.motion-toggle[aria-pressed="true"] .motion-indicator{background:#245ddb}.all-library-header .motion-toggle[aria-pressed="true"] .motion-indicator{background:#d1efe5}.motion-toggle:disabled{opacity:.65}
html:not([data-motion="off"]) .toast{transition:opacity .18s,transform .18s}html:not([data-motion="off"]) .agent-tile,html:not([data-motion="off"]) .all-agents{transition:background .14s,color .14s}html:not([data-motion="off"]) .save-button{transition:background .18s,color .18s,scale .18s}html:not([data-motion="off"]) .save-button:active{scale:.88}html:not([data-motion="off"]) .play-disc{transition:opacity .16s}
.motion-active .hero-portrait{transform:translate(var(--parallax-x),var(--parallax-y));transition:transform .5s cubic-bezier(.2,.7,.2,1)}.motion-active .library-art .cast{translate:calc(var(--parallax-x) * .6) calc(var(--parallax-y) * .6);transition:translate .5s ease-out}.motion-active.motion-enter .hero-portrait{animation:portrait-select .4s cubic-bezier(.2,.7,.2,1) both}.motion-active.motion-enter .library-art{animation:reel-open .45s cubic-bezier(.2,.7,.2,1) both}.motion-active.motion-enter .hero-copy{animation:copy-select .3s ease-out both}
@keyframes portrait-select{from{opacity:.35;transform:translateX(17px)}to{opacity:1;transform:translateX(0)}}@keyframes copy-select{from{opacity:.5}to{opacity:1}}@keyframes reel-open{from{clip-path:inset(0 0 0 20%)}to{clip-path:inset(0)}}
@media(max-width:650px){.motion-toggle{left:20px;bottom:10px}.all-library-header .motion-toggle{font-size:8px;right:5px;top:8px}.motion-active .hero-portrait,.motion-active .library-art .cast{transform:none;translate:none}}
@media(prefers-reduced-motion:reduce){.motion-active .hero-portrait,.motion-active .library-art .cast{transform:none;translate:none}.motion-active.motion-enter *{animation:none!important}}
