/* Motion stays behind the portrait and copy; extra image bleed prevents edge gaps. */
.bay-layer{inset:-8%;animation:bay-active 16s ease-in-out infinite alternate;translate:var(--bay-x,0px) var(--bay-y,0px);transition:translate 1.2s cubic-bezier(.2,.65,.3,1);pointer-events:none}
.bay-shade::after{content:"";position:absolute;inset:-10%;pointer-events:none;background:radial-gradient(ellipse at 72% 40%,#b5e5f02b,transparent 52%),linear-gradient(115deg,transparent 42%,#e4f5ff12 55%,transparent 70%);animation:bay-light 12s ease-in-out infinite alternate;will-change:transform,opacity}
@keyframes bay-active{0%{transform:scale(1.02) translate(-1.4%,.7%)}50%{transform:scale(1.075) translate(.3%,-.6%)}100%{transform:scale(1.12) translate(1.6%,-1.1%)}}
@keyframes bay-light{from{transform:translate(-3%,1%);opacity:.35}to{transform:translate(3%,-1%);opacity:.85}}
.motion-paused .bay-layer,.motion-paused .bay-shade::after,.motion-suspended .bay-layer,.motion-suspended .bay-shade::after{animation-play-state:paused}
.motion-paused .bay-layer,.motion-suspended .bay-layer{transition:none}
#motion-toggle:disabled{opacity:.75;cursor:default}
@media(max-width:760px){.bay-layer{animation-name:bay-mobile;animation-duration:18s;translate:none}.bay-shade::after{animation-duration:15s}}
@keyframes bay-mobile{from{transform:scale(1.025) translate(-1%,.5%)}to{transform:scale(1.095) translate(1%,-.8%)}}
@media(prefers-reduced-motion:reduce){.bay-layer{animation:none!important;transform:none;translate:none;transition:none}.bay-shade::after{animation:none!important;opacity:.35;will-change:auto}}
