.autopilot-scene{grid-column:1/-1;position:relative;width:100%;max-width:930px;margin:12px auto 0;isolation:isolate}
.autopilot-scene>img{width:100%;height:auto;display:block}
.autopilot-stage{display:none}
.autopilot-ready>img{opacity:0}
.autopilot-ready .autopilot-stage{display:block;position:absolute;inset:0;overflow:hidden;background:linear-gradient(115deg,#c4e4eb,#f6fbfc 52%,#cfe8ed);border-radius:4px}
.autopilot-room{position:absolute;inset:0;border:1px solid rgb(43 20 3 / 10%);transform:translateX(calc((var(--autopilot-progress,0) - .5)*-22px))}
.autopilot-room--left{right:51%;background:repeating-linear-gradient(90deg,transparent 0 23%,rgb(43 20 3 / 7%) 23% 23.3%,transparent 23.3% 46%);clip-path:polygon(0 0,100% 0,100% 100%,0 92%)}
.autopilot-room--right{left:51%;inset-block:12% 0;right:6%;border-width:1px 1px 0;transform:perspective(800px) rotateY(-10deg) translateX(calc(var(--autopilot-progress,0)*20px))}
.autopilot-person{position:absolute;inset:4% 0 -4%;transform-origin:50% 85%}
.autopilot-person img{width:100%;height:100%;object-fit:contain}
.autopilot-person--left{clip-path:inset(0 50% 0 0);transform:translate3d(calc((var(--autopilot-progress,0) - .5)*26px),calc((1 - var(--autopilot-pause,0))*-6px),0) rotate(calc((1 - var(--autopilot-pause,0))*-1deg))}
.autopilot-person--right{clip-path:inset(0 0 0 50%);transform:translate3d(calc((var(--autopilot-progress,0) - .5)*-22px),calc((1 - var(--autopilot-pause,0))*5px),0) rotate(calc((1 - var(--autopilot-pause,0))*.8deg))}
.autopilot-clock{position:absolute;left:45%;top:7%;width:10%;aspect-ratio:1;border:1px solid rgb(43 20 3 / 38%);border-radius:50%;opacity:calc(.65 - var(--autopilot-pause,0)*.4)}
.autopilot-clock i,.autopilot-clock b{position:absolute;width:1px;height:34%;left:50%;bottom:50%;background:var(--brown);transform-origin:50% 100%;transform:rotate(calc(var(--autopilot-progress,0)*540deg))}
.autopilot-clock b{height:23%;transform:rotate(calc(70deg + var(--autopilot-progress,0)*110deg))}
.autopilot-trails{position:absolute;inset:24% 6% 20%;opacity:calc(1 - var(--autopilot-pause,0))}
.autopilot-trails i{position:absolute;left:0;top:30%;width:15%;height:1px;background:linear-gradient(90deg,transparent,rgb(43 20 3 / 35%),transparent)}
.autopilot-trails i:nth-child(2){left:80%;top:10%;width:18%}
.autopilot-trails i:nth-child(3){left:39%;top:70%;width:12%}
.autopilot-focus{position:absolute;left:46%;bottom:8%;width:8%;aspect-ratio:1;padding:1.4%;background:var(--brown);color:var(--blue);border-radius:50%;opacity:var(--autopilot-pause,0);transform:scale(calc(.65 + var(--autopilot-pause,0)*.35));box-shadow:0 0 0 12px rgb(255 255 255 / 30%)}
.autopilot-focus svg{width:100%;height:100%}
/* Brief activity on entry (4.2s total), then rest. No perpetual autoplay. */
.autopilot-running:not(.autopilot-settled) .autopilot-person--left img{animation:autopilot-hurry 1.4s ease-in-out 3}
.autopilot-running:not(.autopilot-settled) .autopilot-person--right img{animation:autopilot-search 1.4s ease-in-out 3}
.autopilot-running:not(.autopilot-settled) .autopilot-trails i{animation:autopilot-pass 1.4s ease-out 3}
@keyframes autopilot-hurry{0%,100%{transform:translateY(0) rotate(0)}45%{transform:translateY(-5px) rotate(-.5deg)}75%{transform:translateY(2px)}}
@keyframes autopilot-search{0%,100%{transform:translateY(0)}35%{transform:translateY(3px) rotate(.6deg)}70%{transform:translateY(-3px) rotate(-.3deg)}}
@keyframes autopilot-pass{0%{transform:translateX(12px);opacity:0}30%{opacity:1}100%{transform:translateX(-24px);opacity:0}}
@media(max-width:600px){.autopilot-scene{margin-top:0}.autopilot-focus{box-shadow:0 0 0 5px rgb(255 255 255 / 30%)}}
@media(prefers-reduced-motion:reduce){.autopilot-ready>img{opacity:1}.autopilot-ready .autopilot-stage{display:none}.autopilot-stage *{animation:none!important}}
