.photo-process{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;overflow:hidden;transition:opacity .6s;background:#315b5228;mix-blend-mode:multiply}
.walkthrough[data-stage="2"] .photo-process{opacity:1}.photo-process>i{position:absolute;width:135%;height:110%;left:-20%;top:-5%;border-radius:40%;filter:blur(28px);background:radial-gradient(ellipse at 30% 40%,#66968b99,transparent 52%);animation:edit-current 7s ease-in-out infinite alternate}.photo-process>i:nth-child(2){background:radial-gradient(ellipse at 70% 65%,#ba805c88,transparent 50%);animation-delay:-3s;animation-duration:9s}.photo-process>i:nth-child(3){filter:blur(5px);background:linear-gradient(115deg,transparent 35%,#76a59770 48%,transparent 58%);animation:edit-sweep 4s ease-in-out infinite}
.particle-field{position:absolute;inset:-15%;background-image:radial-gradient(circle,#214f46d9 1px,transparent 1.9px);background-size:9px 9px;mask-image:radial-gradient(ellipse at 40% 45%,#000 12%,transparent 70%);animation:dot-drift 5s ease-in-out infinite alternate}.particle-field:after{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,#b06e47 1.2px,transparent 2px);background-size:16px 16px;mask-image:linear-gradient(120deg,transparent,#000,transparent);animation:dot-drift 3s ease-in-out -1s infinite alternate-reverse}
.three-dots{display:inline-flex;gap:4px}.three-dots i{width:4px;height:4px;background:currentColor;border-radius:50%;animation:dot-bounce 1.3s ease-in-out infinite}.three-dots i:nth-child(2){animation-delay:.15s}.three-dots i:nth-child(3){animation-delay:.3s}
.typing-indicator{display:inline-flex;gap:4px;padding:10px 14px;background:#e9ece5;border-radius:14px 14px 14px 4px;align-self:flex-start}.typing-indicator i{width:5px;height:5px;background:var(--muted);border-radius:50%;animation:dot-bounce 1.3s ease-in-out infinite}.typing-indicator i:nth-child(2){animation-delay:.15s}.typing-indicator i:nth-child(3){animation-delay:.3s}
.step-dot{transition:background .3s,border-color .3s}
@keyframes edit-current{from{transform:translate(-10%,-8%) rotate(-12deg) scale(.85)}to{transform:translate(10%,8%) rotate(15deg) scale(1.2)}}
@keyframes edit-sweep{0%{transform:translateX(-45%);opacity:0}35%,65%{opacity:1}100%{transform:translateX(45%);opacity:0}}
@keyframes dot-drift{from{transform:translate3d(-6px,-5px,0) scale(.98);opacity:.5}to{transform:translate3d(9px,8px,0) scale(1.06);opacity:1}}
@keyframes dot-bounce{0%,70%,100%{transform:translateY(0);opacity:.5}35%{transform:translateY(-4px);opacity:1}}
@keyframes message-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.photo-process{background:#315b5240}}
