/* The walkthrough mirrors the app flow; sample artwork is explicitly labelled. */
.scan-feature{grid-template-columns:minmax(0,1fr) minmax(0,.95fr);align-items:start;gap:26px 44px;padding:44px;background:#eee4ed}
.scan-feature .scan-intro{grid-column:1;padding:0}
.scan-demo-invitation{display:inline-flex;gap:12px;margin-top:20px;font-size:.85rem;font-weight:650;color:#755778}
.scan-step-list{grid-column:1;display:flex;flex-direction:column;gap:9px}
.scan-step{display:flex;align-items:flex-start;gap:16px;width:100%;padding:15px;text-align:left;border:1px solid transparent;border-radius:17px;background:transparent;color:#27473f;transition:background-color 160ms,border-color 160ms}
.scan-step:hover{background:#ffffff55}
.scan-step[aria-selected=true]{background:#fffaf5;border-color:#ccb8ca;box-shadow:0 5px 16px #65435e07}
.scan-step-number{display:flex;align-items:center;justify-content:center;flex:none;width:32px;height:32px;border-radius:50%;background:#dacbdb;color:#6f5273;font-size:.75rem;font-weight:650}
.scan-step[aria-selected=true] .scan-step-number{background:#755778;color:#fffaf5}
.scan-step strong{display:block;font-size:1rem;line-height:1.5}
.scan-step-detail{display:block;margin-top:4px;font-size:.875rem;line-height:1.55;color:#626b64}
.scan-step-detail b{font-weight:600}
.scan-demo{grid-column:2;grid-row:1/span 3;min-width:0;margin:0;align-self:center;text-align:center}
.scan-phone{position:relative;container-type:inline-size;width:min(100%,310px);margin:0 auto;border:7px solid #233332;border-radius:43px;background:#f9f5e9;box-shadow:0 24px 42px #63496721,0 0 0 1px #ffffffa6;overflow:hidden;color:#20373e;text-align:left}
.scan-phone::before{content:"";display:block;aspect-ratio:1320/2868}
.scan-screen{position:absolute;inset:0;overflow:hidden}
.scan-screen[hidden]{display:none}
.scan-screen:not([hidden]){animation:scan-step-appear 280ms ease-out}
@keyframes scan-step-appear{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.scan-screen:not([hidden]){animation:none}}
.scan-app-capture{display:block;width:100%;height:100%;object-fit:cover}
/* Button bounds in the 1320 × 2868 capture: x 66–642, y 950–1112. */
.scan-photo-hotspot{position:absolute;top:35.9484%;left:5%;width:43.6364%;height:5.6485%;min-height:44px;transform:translateY(-50%);padding:0;border:0;border-radius:4.7cqw;background:transparent;cursor:pointer}
.scan-photo-hotspot::before{content:"";position:absolute;box-sizing:border-box;top:50%;left:-2px;right:-2px;height:calc(12.2727cqw + 4px);transform:translateY(-50%);border:2px solid #f0cb82;border-radius:calc(4.7cqw + 2px);box-shadow:0 0 0 4px #f0cb8233;pointer-events:none}
.scan-photo-hotspot:focus-visible{outline-offset:2px}
.scan-tap-ring{position:absolute;right:7%;top:calc(50% + 6.1364cqw - 10.5px);width:21px;height:21px;border:5px solid #fff7e6;border-radius:50%;background:#d2a24e;box-shadow:0 2px 6px #152f3540}
.scan-statusbar{height:11cqw;display:flex;align-items:center;justify-content:space-between;padding:0 8cqw;font-size:3.8cqw;font-weight:700;color:#172e34}
.scan-statusbar i{position:absolute;top:3cqw;left:35%;width:30%;height:6cqw;border-radius:20px;background:#172321}
.scan-app-nav{display:flex;align-items:center;justify-content:space-between;padding:4cqw 6cqw;border-bottom:1px solid #203c3510;font-size:4cqw;line-height:1.2;color:#346358}
.scan-app-nav strong{font-weight:650;color:#213b3f}
.scan-app-nav>span:first-child{font-size:8cqw;line-height:.6}
.scan-app-body{padding:6cqw}
.scan-app-body h4{margin:0;font:500 8.6cqw/1.15 Story,Georgia,serif;letter-spacing:-.03em;color:#20373e}
.scan-feature .scan-app-body p{margin:3cqw 0 0;font-size:4cqw;line-height:1.5;color:#65736d}
.scan-photo-placeholder{height:47cqw;margin-top:6cqw;display:grid;place-items:center;border-radius:6cqw;background:#e4eadd;color:#346358}
.scan-photo-placeholder svg{width:21cqw;height:21cqw}
.scan-photo-actions{display:flex;gap:3cqw;margin-top:4cqw}
.scan-photo-actions button{flex:1;min-width:0;border:1px solid #34635833;border-radius:3cqw;padding:4cqw 1cqw;font-size:3.8cqw;font-weight:600;line-height:1.1;background:#e6eadf;color:#346358}
.scan-photo-actions button:first-child{background:#346358;color:#fffbed}
.scan-name-label{display:block;margin-top:6cqw;font:500 6cqw/1.3 Story,Georgia,serif;color:#20373e}
.scan-name-placeholder,.scan-name-input{display:block;width:100%;margin-top:3cqw;padding:4.5cqw;border:1px solid #e5e6da;border-radius:4cqw;background:#fffdf7;color:#243f39;font:4.3cqw/1.2 -apple-system,BlinkMacSystemFont,sans-serif}
.scan-name-placeholder{font-size:3.8cqw;color:#7c8378}
.scan-app-cta{display:block;width:100%;min-height:44px;margin-top:6cqw;padding:4.5cqw 2cqw;border:0;border-radius:30px;background:#346358;color:#fffbed;font-size:4.5cqw;font-weight:600;line-height:1.2;text-align:center}
.scan-app-cta.is-disabled{opacity:.45}
.scan-toy-image{position:relative;overflow:hidden;border-radius:5cqw;aspect-ratio:3/4}
.scan-toy-image{width:66%;margin:4cqw auto 0}
.scan-toy-image img{position:absolute;top:0;width:200%;max-width:none;height:100%}
.scan-toy-image img{left:0}
.scan-selected-photo{display:block;margin-top:2cqw;text-align:center;font-size:3.5cqw;color:#346358}
.scan-feature .scan-phone-hint{font-size:3.5cqw;text-align:center}
.scan-complete{display:block;margin-bottom:3cqw;font-size:3.6cqw;font-weight:600;color:#346358}
.scan-imported-assets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3cqw;margin-top:5cqw}
.scan-asset-card{min-width:0;overflow:hidden;border:1px solid #d9d5cc;border-radius:4cqw;background:#fffdf7}
.scan-asset-type{display:block;padding:3cqw 2.5cqw;font-size:3cqw;font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:#346358}
.scan-asset-preview{position:relative;display:grid;place-items:center;overflow:hidden;aspect-ratio:5/6;background:#e3e9da}
.scan-asset-accessory{background:#f1e7d1}
.scan-asset-preview img,.scan-asset-preview video{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
.scan-asset-preview video{position:absolute;inset:0;opacity:0;pointer-events:none}
.scan-asset-preview video.is-playing{opacity:1}
@media(prefers-reduced-motion:reduce){.scan-asset-preview video.is-playing{opacity:0}}
.scan-asset-label{padding:3cqw 2.5cqw;font-size:3.1cqw;line-height:1.45;color:#65736d}
.scan-asset-label strong{display:block;margin-bottom:1cqw;font-size:3.8cqw;color:#294b40}
.scan-asset-label span{display:block}
.scan-story-screen{background:#faf5e9}
.scan-story-world{position:relative;isolation:isolate;overflow:hidden;aspect-ratio:15/16;background:#b5c8c3}
.scan-story-world img,.scan-story-world video{display:block;width:100%;height:100%;object-fit:cover}
.scan-story-world video{position:absolute;inset:0;opacity:0;pointer-events:none}
.scan-story-world video.is-playing{opacity:1}
.scan-story-world-label{position:absolute;top:5cqw;left:0;right:0;text-align:center;font-size:3.2cqw;font-weight:600;letter-spacing:.06em;color:#324e49}
.scan-story-page{position:relative;padding:6cqw 7cqw 5cqw}
.scan-story-chapter{font-size:2.8cqw;font-weight:650;letter-spacing:.16em;color:#7c795e}
.scan-story-page h4{margin:2cqw 0 0;font:500 7.6cqw/1.2 Story,Georgia,serif;letter-spacing:-.025em;color:#27473f}
.scan-feature .scan-story-page p{margin:3cqw 0 0;font:4.5cqw/1.65 Story,Georgia,serif;color:#4e6258}
.scan-story-page-end{display:flex;align-items:center;gap:2cqw;margin-top:5cqw;padding-top:4cqw;border-top:1px solid #d9dfce;color:#60796b;font-size:3.1cqw}
.scan-story-page-end>span:first-child{color:#b58e46;font-size:4cqw}
@media(prefers-reduced-motion:reduce){.scan-story-world video.is-playing{opacity:0}}
.scan-demo-controls{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:12px;max-width:260px;margin:22px auto 0}
.scan-demo-controls[hidden]{display:none}
.scan-demo-controls button{width:44px;height:44px;border:1px solid #b6a2b6;border-radius:50%;background:#ffffff77;color:#563f59;font-size:1.1rem;line-height:1}
.scan-demo-controls button:hover:not(:disabled){background:#fffaf5}
.scan-demo-controls button:disabled{opacity:.35;cursor:default}
.scan-demo-controls .scan-autoplay-toggle{grid-column:1/-1;justify-self:center;width:auto;min-width:110px;padding:10px 16px;border-radius:24px;font-size:.8rem}
.scan-demo-position{font-size:.8rem;min-width:82px;color:#6d586e}
.scan-demo figcaption{position:static;margin-top:13px;text-align:center;line-height:1.5;color:#53645d}
.scan-current-caption{display:block;font-size:.875rem;max-width:330px;margin:auto}
.scan-demo-disclosure{display:block;margin-top:11px;font-size:.7rem;color:#7a6c7a}
.scan-feature .scan-footnote{grid-column:1;align-self:end;margin:0;padding-top:20px;border-top:1px solid #b3a6b34d;font-size:.875rem;line-height:1.65}
@media(max-width:1000px) and (min-width:801px){.scan-feature{padding:32px;gap:24px}.scan-step{padding:12px;gap:11px}.scan-step-detail{font-size:.8rem}}
@media(max-width:800px){
  .scan-feature{display:flex;padding:30px;gap:24px}
  .scan-intro{order:1}.scan-step-list{order:2;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.scan-demo{order:3;align-self:stretch}.scan-footnote{order:4}
  .scan-step{display:flex;flex-direction:column;align-items:center;gap:8px;padding:10px 5px;text-align:center;border-color:#c9b9c955}
  .scan-step strong{font-size:.75rem;line-height:1.4}.scan-step-detail{display:none}.scan-step-number{width:27px;height:27px;font-size:.7rem}
  .scan-demo-invitation{margin-top:15px}
}
@media(max-width:480px){.scan-feature{padding:26px 20px;gap:22px}.scan-feature .scan-intro{padding:0}.scan-step-list{gap:4px}.scan-step{padding:10px 3px;border-radius:12px}.scan-step strong{font-size:.67rem}.scan-phone{border-width:6px;border-radius:36px}.scan-demo-disclosure{font-size:.65rem}.scan-demo-controls{margin-top:18px}}