/* Product demonstrations keep the shared 390 × 844 app canvas. */
.chapter-visual.app-walkthrough{padding:0;border:0;background:none;box-shadow:none;max-width:580px;margin-inline:auto;min-width:0}
.walkthrough-stage{height:700px;position:relative;display:flex;align-items:center;justify-content:center;perspective:1200px;isolation:isolate}
.walkthrough-stage:before{content:"";position:absolute;width:88%;height:76%;border-radius:50%;background:radial-gradient(ellipse,var(--chapter-tint),transparent 70%);z-index:-1}
.walkthrough-device{flex:none;max-width:100%;position:relative;z-index:2;width:min(300px,70vw);transform:translate3d(0,0,0) rotateY(0);transition:transform 1.35s cubic-bezier(.22,.68,.15,1);transform-style:preserve-3d}
.walkthrough-phone.phone{width:100%;--phone-scale:.738916256}
.walkthrough-point{position:absolute;width:170px;left:0;top:37%;z-index:1;transform:translate3d(0,0,-100px) rotateY(15deg) rotateZ(-6deg);transition:transform 1.35s,opacity .8s;filter:drop-shadow(0 20px 18px #18102d1f)}
.walkthrough-point img{width:100%;height:auto}
.app-walkthrough[data-tour-pose="scan"] .walkthrough-device{transform:translate3d(55px,12px,-30px) rotateY(-14deg) rotateZ(5deg) scale(.93)}
.app-walkthrough:not([data-tour-pose="scan"]) .walkthrough-point{transform:translate3d(-30px,35px,-180px) rotateY(25deg) scale(.8);opacity:0;pointer-events:none}
.walkthrough-ui .ui-heading{margin-bottom:22px}
.walkthrough-ui .ui-heading>p{font-size:15px;line-height:1.5}
.walkthrough-ui .ui-button{margin-top:18px}
.walkthrough-ui .ui-button+.ui-button{margin-top:10px}
.walkthrough-ui .tour-action-tap{outline:3px solid var(--ui-accent);outline-offset:4px;animation:tour-tap .7s ease-in-out}
@keyframes tour-tap{50%{transform:scale(.97);filter:brightness(.91)}}
.walkthrough-ui .ui-note{font-size:12px;line-height:1.6}
.walkthrough-ui .ui-fields{margin-block:20px}
.walkthrough-ui .ui-fields>div{padding-block:13px}
.walkthrough-ui .ui-fields dt,.walkthrough-ui .ui-fields dd{font-size:14px;line-height:1.45}
.walkthrough-ui .ui-question{font-size:23px;line-height:1.3;margin:24px 0 14px;font-weight:500}
.walkthrough-player{max-width:420px;margin:0 auto;padding:0 14px}
.walkthrough-progress{display:flex;gap:5px}
.walkthrough-progress i{height:3px;flex:1;background:#d9d8e3;border-radius:5px;transition:background .3s}
.walkthrough-progress i.is-complete{background:var(--chapter-accent)}
.walkthrough-toolbar{display:flex;gap:8px;align-items:center;justify-content:space-between;margin-top:10px}
.walkthrough-caption{font-size:12px;line-height:1.55;color:#595970;flex:1}
.walkthrough-toolbar>div{display:flex;gap:0;flex:none}
.walkthrough-toolbar button{width:36px;height:44px;display:grid;place-items:center;border-radius:9px;font-size:20px;color:var(--navy);cursor:pointer}
.walkthrough-toolbar button:hover{background:#ffffffa6}
.walkthrough-toolbar button:disabled{opacity:.35;cursor:default}
.walkthrough-toolbar .icon{width:17px;height:17px}
.walkthrough-note{font-size:10px;color:#7c7c90;margin-top:4px;text-align:center}
.tour-camera{background:linear-gradient(140deg,#d7d9e5,#b5bacb);border-radius:19px;height:245px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;margin-bottom:4px}
.tour-camera-target{width:187px;position:relative;padding:13px;border:2px solid #fff;border-radius:17px;box-shadow:0 0 0 100px #0d0d3018}
.tour-camera-target img{width:100%;height:auto;filter:drop-shadow(0 10px 7px #0d0d3024)}
.tour-camera-label{position:absolute;bottom:14px;font-size:11px;color:#282844;background:#ffffffb8;padding:5px 11px;border-radius:20px}
.tour-scan-line{position:absolute;left:8%;right:8%;height:2px;top:22%;background:#6a44ff;box-shadow:0 0 10px 3px #9a82ff80;animation:tour-scan 2.4s ease-in-out infinite alternate}
@keyframes tour-scan{to{top:78%}}
.tour-point-mini{width:108px;margin:0 auto 22px}
.tour-point-mini img{width:100%;height:auto}
.tour-signal{display:flex;gap:12px;align-items:center;padding:16px 12px;border:1px solid #dce2e9;border-radius:12px;margin:12px 0;background:white}
.tour-signal>span{color:#6543e7}.tour-signal .icon{width:23px;height:23px;flex:none}
.tour-signal>div{flex:1}.tour-signal strong{font-size:15px;display:block}.tour-signal small{font-size:11px;color:#777b8f;display:block;margin-top:4px}
.tour-signal>.icon{width:21px;height:21px;padding:3px;background:#d4f4e6;border-radius:50%;color:#1f8062}
.tour-success{display:grid;place-items:center;width:64px;height:64px;margin:18px auto;border-radius:50%;color:#198660;background:#d6f4e9}
.tour-success .icon{width:38px;height:38px}
.tour-recording{padding:18px;background:#fff0f2;border:1px solid #f5d5db;border-radius:17px}
.tour-recording-status{display:flex;align-items:center;gap:7px;font-size:12px;color:#ae354d}.tour-recording-status>i{width:7px;height:7px;border-radius:50%;background:#ee536d}
.tour-wave{display:flex;gap:4px;height:42px;align-items:center;justify-content:center;margin:14px 0}
.tour-wave i{width:5px;height:calc(var(--bar)*4px);border-radius:5px;background:#e26a80;animation:tour-wave .65s ease-in-out infinite alternate;animation-delay:var(--delay)}
@keyframes tour-wave{to{transform:scaleY(.2)}}
.tour-transcript{font-size:19px;line-height:1.45;letter-spacing:-.25px;min-height:0;color:#442f43}
.tour-transcript>span{animation:tour-word .3s both;animation-delay:var(--word-delay)}
@keyframes tour-word{from{opacity:0}to{opacity:1}}
.tour-recording>small{display:block;font-size:11px;color:#9b6170;margin-top:17px}
.tour-processing{width:64px;height:64px;display:grid;place-items:center;position:relative;margin:35px auto}
.tour-processing>.icon{width:30px;height:30px;color:var(--chapter-accent)}
.tour-processing-ring{position:absolute;inset:0;border:3px solid #e4e0ef;border-top-color:var(--chapter-accent);border-radius:50%;animation:tour-spin 1s linear infinite}
@keyframes tour-spin{to{transform:rotate(360deg)}}
.tour-processing-steps{display:grid;gap:16px;font-size:15px}.tour-processing-steps p{display:flex;gap:11px;align-items:center}.tour-processing-steps .icon{width:18px;height:18px;color:var(--chapter-accent)}
.tour-account{font-size:15px;line-height:1.6;padding:15px;background:#f1f0f6;border-radius:13px;margin:18px 0}
.tour-ask{padding:20px;border:1px solid #ccc3ea;border-radius:15px;background:#fff;margin-bottom:20px}
.tour-ask>span{font-size:11px;color:#7c6c99}.tour-ask .tour-transcript{font-size:23px;min-height:75px;color:#3b2b66;margin-top:14px}
.tour-sop-library{margin-top:32px}.tour-sop-library>p{font-size:13px;line-height:1.65;color:#7b7990;margin-top:16px}
.tour-source{display:flex;align-items:center;gap:12px;padding:17px 14px;background:#eeebfc;border-radius:12px;color:#6341b8;margin:18px 0}
.tour-source>.icon{width:24px;height:24px;flex:none}.tour-source strong{display:block;font-size:14px;font-weight:500}.tour-source small{display:block;font-size:11px;margin-top:5px;color:#80739f}
.tour-chat-question{padding:18px 20px;background:#e4ddff;border-radius:18px 18px 4px 18px;font-size:16px;line-height:1.5;color:#4d357e;margin:20px 0 22px 20px}
.tour-chat-answer{padding:20px;background:white;border:1px solid #e0dcea;border-radius:4px 18px 18px 18px}.tour-chat-answer>strong{font-size:23px;font-weight:500;letter-spacing:-.5px;line-height:1.3;display:block}.tour-chat-answer>p{font-size:15px;line-height:1.7;margin-top:13px;color:#6f6781}
.tour-working{font-size:15px;line-height:1.6;text-align:center;color:#7c7191;margin-bottom:25px}
.tour-procedure{padding:23px;background:#fff;border:1px solid #ded9eb;border-radius:14px}.tour-procedure strong{font-size:23px;line-height:1.3;font-weight:500}.tour-procedure p{font-size:16px;line-height:1.8;color:#6d6880;margin-top:20px}
.tour-handover-card{display:block;text-align:left;width:100%;margin-top:24px;background:#e3f3ec;border:1px solid #cfe5d9;border-radius:16px;padding:24px;cursor:pointer}.tour-handover-card>small{font-size:10px;letter-spacing:.5px;color:#52816a}.tour-handover-card>strong{display:block;font-size:26px;font-weight:500;line-height:1.18;letter-spacing:-.6px;margin-top:20px}.tour-handover-card>p{font-size:15px;line-height:1.6;color:#5f7b6c;margin-top:15px}.tour-handover-card>span{display:flex;align-items:center;gap:7px;font-size:11px;color:#537360;margin-top:23px}.tour-handover-card .icon{width:15px;height:15px;flex:none;margin-left:auto}
.tour-history{list-style:none;padding:0;margin:28px 0}.tour-history li{position:relative;border-left:2px solid #cde3d7;margin-left:6px;padding:0 0 25px 22px}.tour-history li:last-child{padding-bottom:0;border-color:transparent}.tour-history li:before{content:"";position:absolute;width:9px;height:9px;border-radius:50%;background:#33a278;left:-5.5px;top:3px}.tour-history small{font-size:10px;letter-spacing:.5px;color:#6b8c7c}.tour-history strong{font-size:18px;line-height:1.5;font-weight:500;display:block;margin-top:6px}.tour-history p{font-size:13px;line-height:1.7;color:#76887e;margin-top:5px}
.app-walkthrough:not(.is-playing) .tour-scan-line,.app-walkthrough:not(.is-playing) .tour-wave i,.app-walkthrough:not(.is-playing) .tour-processing-ring{animation-play-state:paused}
.app-walkthrough:not(.is-playing) .tour-transcript>span{animation:none;opacity:1}
/* Continuous horizontal motion uses fractional offsets, without snap interruptions. */
#industry-track{scroll-snap-type:none;scroll-behavior:auto}
body.motion-paused .walkthrough-device,body.motion-paused .walkthrough-point{transition:none}
@media(max-width:1100px){.walkthrough-stage{height:650px}.walkthrough-device{width:280px}.walkthrough-point{width:135px;left:-6px}.app-walkthrough[data-tour-pose="scan"] .walkthrough-device{transform:translate3d(35px,10px,-20px) rotateY(-12deg) rotateZ(4deg) scale(.93)}}
@media(max-width:900px){.walkthrough-stage{height:685px}.walkthrough-device{width:300px}.walkthrough-point{left:calc(50% - 235px);width:165px}}
@media(max-width:560px){.walkthrough-stage{height:auto;min-height:0;padding:24px 12px;display:flex;align-items:center;justify-content:center}.walkthrough-device{width:100%;max-width:280px;max-width:clamp(220px,calc((100svh - 210px)*.4720930233),280px);margin-inline:auto}.walkthrough-point{left:0;width:115px;top:38%}.app-walkthrough[data-tour-pose="scan"] .walkthrough-device{transform:translate3d(18px,8px,-20px) rotateY(-12deg) rotateZ(3deg) scale(.93)}.walkthrough-player{display:none}}
@media(prefers-reduced-motion:reduce){.walkthrough-device,.walkthrough-point,.walkthrough-progress i{transition:none}.app-walkthrough[data-tour-pose="scan"] .walkthrough-device{transform:none}.walkthrough-point{display:none}.tour-scan-line,.tour-wave i,.tour-processing-ring,.tour-transcript>span{animation:none!important;opacity:1}}

/* A stable 2D layer avoids nested preserve-3d/overflow clipping on small screens. */
@media(max-width:760px){
 .walkthrough-stage{perspective:none}
 .walkthrough-device{transform:none;transform-style:flat}
 .app-walkthrough[data-tour-pose="scan"] .walkthrough-device{transform:none}
 .walkthrough-point{display:none}
}
