/* The circular aperture exposes the real next page; it adds no WebGL scene. */
@property --survey-hole { syntax: '<length>'; inherits: false; initial-value: 0px; }
html { background: #f7f5ed; }
.survey-transition { position:fixed;inset:0;z-index:2147483646;overflow:hidden;pointer-events:auto;contain:strict; }
.survey-transition__destination { position:absolute;inset:0;background:#f7f5ed;clip-path:circle(0px at var(--x) var(--y)); }
.survey-transition.is-animating .survey-transition__destination {animation:survey-reveal var(--duration) cubic-bezier(.65,0,.18,1) forwards;}
.survey-transition__destination iframe { width:100%;height:100%;border:0;background:#f7f5ed;pointer-events:none; }
.survey-transition__outgoing {position:absolute;inset:0;overflow:hidden;background:#f7f5ed;--survey-hole:0px;mask-image:radial-gradient(circle at var(--x) var(--y),transparent calc(var(--survey-hole) - 1px),#000 var(--survey-hole));}
.survey-transition__outgoing > div {position:absolute;left:0;width:100%;min-height:100vh;pointer-events:none;}
.survey-transition.is-animating .survey-transition__outgoing {animation:survey-aperture var(--duration) cubic-bezier(.65,0,.18,1) forwards;}
.survey-transition__ring {position:absolute;left:var(--x);top:var(--y);width:42px;height:42px;transform:translate(-50%,-50%) scale(.45);border:1.5px solid #c9b17f;border-radius:50%;box-shadow:0 0 0 1px #244b3e66;opacity:0;}
.survey-transition__ring:after {content:"";position:absolute;inset:7px;border:1px solid #f7f5ed;border-radius:50%;}
.survey-transition.is-animating .survey-transition__ring {animation:survey-ring var(--duration) cubic-bezier(.65,0,.18,1) forwards;}
@keyframes survey-aperture {0%,12%{--survey-hole:0px}100%{--survey-hole:var(--radius)}}
@keyframes survey-reveal {0%,12%{clip-path:circle(0px at var(--x) var(--y))}100%{clip-path:circle(var(--radius) at var(--x) var(--y))}}
@keyframes survey-ring {0%{opacity:0;transform:translate(-50%,-50%) scale(.45)}12%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:.85;transform:translate(-50%,-50%) scale(var(--scale))}}
@media (prefers-reduced-motion:reduce){.survey-transition{display:none!important}}
.survey-transition--departure .survey-transition__ring {animation:survey-departure 180ms ease-out forwards;}
@keyframes survey-departure {from{opacity:0;transform:translate(-50%,-50%) scale(.5)}to{opacity:1;transform:translate(-50%,-50%) scale(1.7)}}
body.survey-enter {animation:survey-entry 580ms cubic-bezier(.3,0,.16,1) both;}
@keyframes survey-entry {from{clip-path:circle(0 at var(--entry-x) var(--entry-y))}to{clip-path:circle(150vmax at var(--entry-x) var(--entry-y))}}
@media (prefers-reduced-motion:reduce){body.survey-enter{animation:none}}

/* Show the observation target immediately while the next page is prepared. */
.survey-transition--pending.is-waiting .survey-transition__ring {animation:survey-acquire 180ms ease-out forwards;}
.survey-transition--pending.is-animating .survey-transition__ring {animation-name:survey-ring-acquired;}
@keyframes survey-acquire {from{opacity:0;transform:translate(-50%,-50%) scale(.45)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes survey-ring-acquired {0%,12%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:.85;transform:translate(-50%,-50%) scale(var(--scale))}}