.demo-capture-scene{position:absolute;inset:18px;opacity:0;transform:scale(1);transition:opacity .8s,transform 1.9s cubic-bezier(.2,.7,.2,1);pointer-events:none;z-index:0}.demo-capture-scene img{width:100%;height:100%;object-fit:contain;border-radius:12px;filter:drop-shadow(0 14px 25px #0008)}.demo-phone-space{z-index:1;transition:transform 1.6s cubic-bezier(.2,.75,.2,1),opacity 1.3s}.demo-camera-preview{position:absolute;inset:0;z-index:12;background:#09131c;display:grid;place-items:center;opacity:0;visibility:hidden;pointer-events:none;overflow:hidden}.demo-camera-preview>img{width:90%;height:100%;object-fit:contain;transform:scale(1.17);transition:transform 1.9s ease-out}.demo-camera-focus{position:absolute;inset:16% 6%;border:2px solid #55e7a9;border-radius:8px;box-shadow:0 0 0 1px #082b1f55}.demo-camera-hud{position:absolute;top:5%;left:7%;font:12px ui-monospace,monospace;color:#69f1ba;letter-spacing:1px}.demo-camera-shutter{position:absolute;bottom:4%;left:50%;transform:translateX(-50%);width:58px;height:58px;border:4px solid #dcebe8;border-radius:50%;background:#ffffff25;box-shadow:0 0 0 4px #ffffff18}.demo-camera-preview:after{content:'';position:absolute;inset:0;background:white;opacity:0}
[data-capture-phase=photo] .demo-capture-scene,[data-capture-phase=phone] .demo-capture-scene{opacity:1}[data-capture-phase=photo] .demo-phone-space{transform:translateX(calc(100% + 110px));opacity:0}[data-capture-phase=phone] .demo-phone-space,[data-capture-phase=focus] .demo-phone-space,[data-capture-phase=capture] .demo-phone-space{transform:translateX(0);opacity:1}[data-capture-phase=focus] .demo-capture-scene{opacity:.35;transform:scale(var(--capture-scale,.5))}[data-capture-phase=capture] .demo-capture-scene{opacity:0;transform:scale(var(--capture-scale,.5))}[data-capture-phase=phone] .demo-camera-preview,[data-capture-phase=focus] .demo-camera-preview,[data-capture-phase=capture] .demo-camera-preview{visibility:visible;opacity:1}[data-capture-phase=focus] .demo-camera-preview>img,[data-capture-phase=capture] .demo-camera-preview>img{transform:scale(1)}[data-capture-phase=capture] .demo-camera-preview:after{animation:demoCameraFlash .8s ease-out both}
@keyframes demoCameraFlash{0%{opacity:0}12%{opacity:.96}100%{opacity:0}}@keyframes demoPhonePulse{0%,100%{border-color:#b0753a;box-shadow:0 0 8px #ef923b33,0 8px 30px #0007}50%{border-color:#ffb35d;box-shadow:0 0 27px #ff9a4b88,0 8px 30px #0007}}
[data-tour-state=playing] .demo-phone{animation:demoPhonePulse 3.8s ease-in-out infinite}.demo-phone{transition:border-color .6s,box-shadow .6s}
@media(prefers-reduced-motion:reduce){.demo-capture-scene,.demo-phone-space,.demo-camera-preview>img{transition:none}[data-tour-state=playing] .demo-phone{animation:none;border-color:#ffb35d;box-shadow:0 0 15px #ff9a4b55}[data-capture-phase=capture] .demo-camera-preview:after{animation:none}}

.demo-try-callout{display:none;position:absolute;left:12px;top:44%;z-index:8;width:min(27%,152px);padding:0;border:0;background:transparent;color:#ffb35d;cursor:pointer;text-align:center;filter:drop-shadow(0 3px 10px #0008)}.demo-callout-arrow{display:flex;align-items:center;justify-content:center;gap:7px;min-height:76px;padding:12px 25px 12px 8px;background:#f6a24d;color:#291908;clip-path:polygon(0 14%,74% 14%,74% 0,100% 50%,74% 100%,74% 86%,0 86%);font-size:13px;font-weight:750;line-height:1.25}.demo-callout-arrow>[data-callout]{max-width:100%;overflow-wrap:anywhere}.demo-callout-glyph{display:none}.demo-callout-hint{display:block;margin-top:5px;font-size:9px;line-height:1.5;color:#ffc17d}.demo-callout-mobile{display:none!important}.demo-try-callout:hover{filter:drop-shadow(0 0 14px #ffae5c88)}.demo-try-callout:focus-visible{outline:2px solid #ffd39f;outline-offset:4px;border-radius:8px}[data-tour-state=playing]:not([data-capture-phase=photo]):not([data-capture-phase=phone]) .demo-try-callout:not(.demo-callout-mobile){display:block;animation:demoCalloutPulse 3.2s ease-in-out infinite}@keyframes demoCalloutPulse{0%,100%{opacity:.64}50%{opacity:1}}
@media(max-width:600px){.demo-try-callout:not(.demo-callout-mobile){display:none!important}[data-tour-state=playing]:not([data-capture-phase=photo]):not([data-capture-phase=phone]) .demo-callout-mobile{position:static;display:flex!important;width:100%;min-height:43px;flex-shrink:0;align-items:center;justify-content:center;gap:12px;border-bottom:1px solid #98622e66;background:#33231640;filter:none;animation:demoCalloutPulse 3.2s ease-in-out infinite}.demo-callout-mobile .demo-callout-arrow{min-height:0;background:none;clip-path:none;color:#ffba6c;padding:6px 0;font-size:12px}.demo-callout-mobile .demo-callout-glyph{display:inline;font-size:21px}.demo-callout-mobile .demo-callout-hint{margin:0;font-size:9px;max-width:46%}}
@media(prefers-reduced-motion:reduce){[data-tour-state=playing] .demo-try-callout{animation:none!important;opacity:1;transform:none}}