/* Approved human retail scene. All visual rules stay inside this component. */
.retail-story{color-scheme:dark;--bg:#060b14;--text:#e8f0fb;--muted:#8fa6c4;--cyan:#8ee5f5;--violet:#b4a1ee}
.retail-story *{box-sizing:border-box}
.retail-story{margin:0;background:radial-gradient(ellipse at 25% 30%,#14294466,transparent 65%),var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif}
.retail-story button{font:inherit;cursor:pointer}
.retail-story a{color:inherit}
.retail-story .wrap{width:min(1430px,92%);margin:auto}
.retail-story header{border-bottom:1px solid #20314977}
.retail-story .header-row{height:96px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.retail-story .brand{position:relative;width:177px;aspect-ratio:1500/560;overflow:hidden;flex-shrink:0}
.retail-story .brand img{position:absolute;width:213.333%;height:auto;left:-56.667%;top:-128.572%;mix-blend-mode:screen}
.retail-story .brand .word{filter:brightness(3.5);clip-path:inset(54% 0 38% 0)}
.retail-story .navigation{display:flex;gap:29px;align-items:center;color:#93a8c3;font-size:11px}
.retail-story .navigation span:first-child{color:#dbecff}
.retail-story .concept{display:flex;align-items:center;gap:8px;font:9px/1.5 monospace;color:#b0a7db;letter-spacing:.6px}
.retail-story .concept:before{content:'';width:5px;height:5px;border-radius:50%;background:#a695e8}
.retail-story .intro{display:flex;align-items:end;justify-content:space-between;gap:50px;padding:45px 0 32px}
.retail-story .eyebrow{font:9px/1.8 monospace;letter-spacing:1.7px;color:#94cbdf;margin:0 0 17px}
.retail-story h1{font-size:clamp(32px,3.5vw,51px);line-height:1.09;letter-spacing:-1.9px;font-weight:400;margin:0}
.retail-story h1 em{font-style:normal;color:#abaeea}
.retail-story .intro>p{font-size:12px;color:var(--muted);line-height:1.9;max-width:330px;margin:0 0 3px}
.retail-story .experience{border:1px solid #263a55;background:#0b1626;border-radius:10px;overflow:hidden;box-shadow:0 25px 100px #0003}
.retail-story .chapters{display:grid;grid-template-columns:repeat(3,1fr);background:#0a1423;border-bottom:1px solid #293c55}
.retail-story .chapters button{position:relative;display:flex;gap:13px;align-items:center;min-height:58px;background:transparent;border:0;border-right:1px solid #263951;color:#849dba;font-size:11px;text-align:left;padding:15px 25px}
.retail-story .chapters button:last-child{border:0}
.retail-story .chapters button>span{font:9px monospace;color:#6480a2}
.retail-story .chapters button[aria-selected="true"]{color:#d4f2ff;background:linear-gradient(0deg,#397c9c13,transparent)}
.retail-story .chapters button[aria-selected="true"]:after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:linear-gradient(90deg,#80d7eb,#a794e5)}
.retail-story .main-grid{display:grid;grid-template-columns:minmax(0,2.4fr) minmax(300px,1fr)}
.retail-story .film{background:#07121f;min-width:0;display:flex;flex-direction:column;justify-content:center}
.retail-story .film-head{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:14px 20px;font:8px/1.7 monospace;letter-spacing:.7px;color:#9cb4cc}
.retail-story .film-head span:first-child{display:flex;gap:7px;align-items:center}
.retail-story .film-head i{width:4px;height:4px;background:#8ee5f5;border-radius:50%}
.retail-story .film-head>span:last-child{color:#738ca9}
.retail-story .photo{position:relative;aspect-ratio:1672/941;overflow:hidden;isolation:isolate}
.retail-story .photo>img{display:block;width:100%;height:100%;object-fit:contain}
.retail-story .photo:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#05101c25,transparent 25%,transparent 76%,#05101c66);z-index:1}
.retail-story .measure-overlay{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.retail-story .zone{opacity:0;transition:opacity .7s}
.retail-story .photo[data-mode="flow"] .zone-flow,.retail-story .photo[data-mode="dwell"] .zone-dwell,.retail-story .photo[data-mode="capacity"] .zone-capacity{opacity:1}
.retail-story .route{fill:none;stroke:#98f0fc;stroke-width:3;stroke-dasharray:10 13;filter:drop-shadow(0 0 5px #70e4f0);animation:retail-signal 14s linear infinite}
.retail-story .route-under{fill:none;stroke:#73d9ed;stroke-width:32;opacity:.08;stroke-linecap:round}
.retail-story .area{stroke:#c1a8ff;stroke-width:2;fill:#ad8aff;fill-opacity:.12}
.retail-story .area-capacity{stroke:#a6e8fa;fill:#6fd6eb;fill-opacity:.09;stroke-width:2}
.retail-story .pin{position:absolute;z-index:3;display:flex;gap:7px;align-items:center;background:#071725d9;backdrop-filter:blur(14px);border:1px solid #9ad9ee66;border-radius:999px;color:#d6eaf9;font-size:10px;line-height:1.3;padding:6px 11px 6px 6px;box-shadow:0 5px 20px #0005;white-space:nowrap}
.retail-story .pin b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;border:1px solid #9bcedc55;font:9px monospace;font-weight:400;color:#b0cbdc}
.retail-story .pin[aria-pressed="true"]{border-color:#bcf2ff;box-shadow:0 0 22px #79e0f62b,0 5px 20px #0005;color:#f0faff}
.retail-story .pin[aria-pressed="true"] b{background:#9ce6f2;color:#071b2b;border-color:transparent}
.retail-story .pin-flow{left:77%;top:80%}
.retail-story .pin-dwell{left:35%;top:53%}
.retail-story .pin-capacity{left:65%;top:28%}
.retail-story .film-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:15px 20px;color:#9bb4ce;font-size:10px;line-height:1.6}
.retail-story .film-bottom>span:first-child{display:flex;gap:8px;align-items:center}
.retail-story .film-bottom i{width:4px;height:4px;border-radius:50%;background:#a99be4}
.retail-story .film-bottom>span:last-child{font:8px/1.6 monospace;letter-spacing:.5px;color:#7088a8}
.retail-story .panel{padding:25px 25px 22px;border-left:1px solid #293e58;background:linear-gradient(145deg,#11233a,#0c1729)}
.retail-story .panel-kicker{font:8px/1.7 monospace;letter-spacing:1px;color:#84cadf;margin:0 0 14px}
.retail-story .panel h3{font-size:clamp(23px,2vw,29px);font-weight:400;letter-spacing:-.6px;line-height:1.25;min-height:72px;margin:0 0 20px;white-space:pre-line}
.retail-story .metric{display:flex;gap:16px;align-items:center;border-bottom:1px solid #2a405a;padding-bottom:18px}
.retail-story .metric strong{font-weight:400;font-size:51px;letter-spacing:-2px;color:#9fe2f2;line-height:1;white-space:nowrap}
.retail-story .metric strong small{font-size:20px;letter-spacing:0;color:#9caff1;margin-left:3px}
.retail-story .metric p{font-size:10px;line-height:1.8;color:#adc0d9;margin:0;max-width:160px}
.retail-story .chart{padding:18px 0;border-bottom:1px solid #2a405a}
.retail-story .unit{display:block;font:7px/1.6 monospace;letter-spacing:1px;color:#7795b6;margin-bottom:13px}
.retail-story .bar-row{display:grid;grid-template-columns:100px 1fr 22px;gap:9px;align-items:center;font-size:9px;color:#9db5d1;margin:10px 0}
.retail-story .track{height:5px;background:#20384e;border-radius:2px;overflow:hidden}
.retail-story .track i{display:block;height:100%;background:linear-gradient(90deg,#55a2c4,#a2e3f1);transition:width .6s}
.retail-story .bar-row:nth-child(3) .track i{background:linear-gradient(90deg,#8072c2,#b9a3eb)}
.retail-story .bar-row strong{font-size:10px;text-align:right;color:#d4e5fa;font-weight:400}
.retail-story .note{font-size:8px;color:#7794b5;line-height:1.7;margin:12px 0 0}
.retail-story .decision{padding-left:12px;border-left:1px solid #a69be088;margin-top:19px}
.retail-story .decision>span{font:8px/1.7 monospace;letter-spacing:.7px;color:#b4a8e6;display:block;margin-bottom:7px}
.retail-story .decision p{font-size:11px;line-height:1.85;color:#c2d5ea;margin:0;min-height:61px}
.retail-story .measure{font-size:10px;line-height:1.8;color:#8faacb;margin:16px 0 0}
.retail-story .measure b{color:#afc6e0;font-weight:400}
.retail-story .concept-cta{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #2b405a;padding:15px 0 0;margin-top:20px;font-size:10px;color:#9cdced}
.retail-story .disclosure{display:flex;justify-content:space-between;gap:25px;padding:15px 20px;border-top:1px solid #25394f;font-size:9px;line-height:1.8;color:#839dbb}
.retail-story .disclosure>span:first-child{font:8px/1.8 monospace;letter-spacing:.5px;color:#a3b9d0;flex-shrink:0}
.retail-story .disclosure>span:last-child{max-width:770px}
.retail-story footer{padding:24px 0 30px;display:flex;justify-content:space-between;gap:25px;font:8px/1.8 monospace;color:#627b9d;letter-spacing:.3px}
.retail-story .footer-tag{color:#9a91bb}
.retail-story .pin:focus-visible,.retail-story .chapters button:focus-visible{outline:2px solid #b7efff;outline-offset:4px}
@keyframes retail-signal{to{stroke-dashoffset:-460}}
@media(max-width:1050px){.retail-story .main-grid{grid-template-columns:minmax(0,1.8fr) minmax(290px,1fr)}
.retail-story .panel{padding:22px 20px}
.retail-story .photo{aspect-ratio:1.5}
.retail-story .photo>img{object-fit:cover}
.retail-story .pin{font-size:8px}
.retail-story .pin-flow{left:73%}
.retail-story .pin-dwell{left:27%}
.retail-story .pin-capacity{left:60%}
.retail-story .navigation{gap:17px;font-size:10px}
.retail-story .intro{gap:30px}
.retail-story .intro>p{max-width:300px}
}
@media(max-width:800px){.retail-story .main-grid{grid-template-columns:1fr}
.retail-story .photo{aspect-ratio:1672/941}
.retail-story .photo>img{object-fit:contain}
.retail-story .panel{border-left:0;border-top:1px solid #2b405a;display:grid;grid-template-columns:1fr 1fr;gap:0 30px;padding:26px}
.retail-story .panel-kicker{grid-column:1/-1}
.retail-story .panel h3{grid-column:1;min-height:0}
.retail-story .metric{grid-column:2;grid-row:2}
.retail-story .chart{grid-column:2;grid-row:3/5}
.retail-story .decision{grid-column:1;grid-row:3}
.retail-story .measure{grid-column:1;grid-row:4}
.retail-story .concept-cta{grid-column:1/-1}
.retail-story .intro>p{display:none}
.retail-story .navigation{display:none}
.retail-story .header-row{height:82px}
.retail-story .intro{padding:32px 0 27px}
.retail-story .chapters button{padding:15px;font-size:11px}
.retail-story .pin{font-size:9px}
.retail-story .pin-flow{left:75%;top:79%}
.retail-story .pin-dwell{left:34%;top:54%}
.retail-story .pin-capacity{left:64%;top:28%}
.retail-story .disclosure{display:block}
.retail-story .disclosure>span{display:block}
.retail-story .disclosure>span+span{margin-top:7px}
}
@media(max-width:520px){.retail-story .wrap{width:92%}
.retail-story .header-row{height:75px;gap:12px}
.retail-story .brand{width:145px}
.retail-story .concept{font-size:7px;letter-spacing:0}
.retail-story .intro h1{font-size:34px;letter-spacing:-1.3px}
.retail-story .eyebrow{font-size:7px;letter-spacing:1px}
.retail-story .chapters button{display:block;padding:13px 11px;font-size:10px;min-height:76px;line-height:1.5}
.retail-story .chapters button span{display:block;margin-bottom:6px;font-size:8px}
.retail-story .film-head{padding:12px;font-size:6px;letter-spacing:.3px}
.retail-story .film-head>span:last-child{display:none}
.retail-story .pin{font-size:7px;gap:4px;padding:4px 7px 4px 4px}
.retail-story .pin b{width:18px;height:18px;font-size:7px}
.retail-story .pin-flow{left:69%;top:80%}
.retail-story .pin-dwell{left:26%;top:55%}
.retail-story .pin-capacity{left:61%;top:27%}
.retail-story .film-bottom{padding:12px;font-size:8px;gap:10px}
.retail-story .film-bottom>span:last-child{font-size:6px}
.retail-story .panel{display:block;padding:23px}
.retail-story .panel h3{font-size:28px;margin-bottom:22px}
.retail-story .metric strong{font-size:52px}
.retail-story .metric p{font-size:11px;max-width:200px}
.retail-story .bar-row{font-size:10px;grid-template-columns:110px 1fr 25px}
.retail-story .note{font-size:9px}
.retail-story .decision p{font-size:12px;min-height:0}
.retail-story .measure{font-size:11px}
.retail-story .concept-cta{font-size:11px}
.retail-story .disclosure{padding:14px;font-size:9px}
.retail-story footer{display:block;font-size:8px}
.retail-story footer>span{display:block;margin-bottom:8px}
}
@media(prefers-reduced-motion:reduce){.retail-story *,.retail-story *:before,.retail-story *:after{animation:none!important;transition:none!important}
}
.retail-story .photo{aspect-ratio:1672/941!important}
.retail-story .photo>video,.retail-story .photo.is-still>.film-still{display:block;width:100%;height:100%;object-fit:contain!important;background:#07121f}
.retail-story .photo>.film-still{display:none}
.retail-story .photo.is-still>video{display:none}
.retail-story .photo.is-still>.film-still{position:absolute;inset:0}
.retail-story .photo.is-still .flow-track,.retail-story .photo.is-still .tracking-route{display:none}
.retail-story .film-progress-track{height:2px;background:#1a2c42;overflow:hidden}
.retail-story #retail-film-progress{display:block;width:100%;height:100%;background:linear-gradient(90deg,#85d9ec,#baa4ed);transform:scaleX(0);transform-origin:left}
.retail-story .tracking-layer{position:absolute;inset:0;z-index:2;pointer-events:none}
.retail-story .person-track{--track:#91eafa;position:absolute;display:block;padding:0;border:1px solid #91eafa48;border-radius:2px;pointer-events:auto;color:var(--track);background:linear-gradient(var(--track),var(--track)) left top/12px 2px no-repeat,linear-gradient(var(--track),var(--track)) left top/2px 12px no-repeat,linear-gradient(var(--track),var(--track)) right top/12px 2px no-repeat,linear-gradient(var(--track),var(--track)) right top/2px 12px no-repeat,linear-gradient(var(--track),var(--track)) left bottom/12px 2px no-repeat,linear-gradient(var(--track),var(--track)) left bottom/2px 12px no-repeat,linear-gradient(var(--track),var(--track)) right bottom/12px 2px no-repeat,linear-gradient(var(--track),var(--track)) right bottom/2px 12px no-repeat;opacity:.54;transition:opacity .35s,box-shadow .35s;box-shadow:inset 0 0 22px #88d6ee06}
.retail-story .person-track[aria-pressed=true]{opacity:1;box-shadow:inset 0 0 25px #8bdbee0c,0 0 14px #89cce00b}
.retail-story .person-track:focus-visible{outline:2px solid white;outline-offset:4px}
.retail-story .browser-track{--track:#d5bbff;border-color:#d5bbff65}
.retail-story .staff-track{--track:#f5d9a4;border-color:#f5d9a466}
.retail-story .flow-track{opacity:calc(.63 * var(--tracking-opacity,1))}
.retail-story .flow-track[aria-pressed=true]{opacity:var(--tracking-opacity,1)}
.retail-story .track-label{position:absolute;top:-22px;left:-1px;background:#071725ec;border:1px solid color-mix(in srgb,var(--track),transparent 35%);border-radius:3px;padding:4px 5px;font:9px/1.1 monospace;letter-spacing:.2px;color:var(--track);white-space:nowrap;box-shadow:0 3px 8px #0004;text-align:left;pointer-events:none}
.retail-story .track-label small{display:block;font:6px/1.3 monospace;letter-spacing:.6px;color:#d5c8ee;margin-top:4px}
.retail-story .track-label time{padding-left:7px;color:#eee5ff;font-variant-numeric:tabular-nums}
.retail-story .browser-track .track-label{top:-34px}
.retail-story .service-track .track-label{top:auto;bottom:-19px;font-size:8px;padding:3px 4px;letter-spacing:0}
.retail-story .staff-track .track-label{top:-19px;font-size:8px;padding:3px 4px}
.retail-story .walk-trail,.retail-story .walk-trail-halo{fill:none;stroke:#a9eefa;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;opacity:.38;transition:opacity .4s}
.retail-story .walk-trail{stroke-dasharray:4 6;filter:drop-shadow(0 0 3px #70e4f0)}
.retail-story .walk-trail-halo{stroke-width:9;opacity:.035}
.retail-story .second-trail{stroke:#bdb3f4}
.retail-story .photo[data-mode=flow] .walk-trail{opacity:.83}
.retail-story .photo[data-mode=flow] .walk-trail-halo{opacity:.07}
.retail-story .entrance-threshold{fill:none;stroke:#b4edf5;stroke-width:2;opacity:.45}
.retail-story .pin-flow{left:auto!important;right:2.3%;top:3%!important}
.retail-story .pin-capacity{left:51%!important;top:3%!important}
.retail-story .pin{z-index:4}
.retail-story .pin small{display:block;font:6px/1.4 monospace;letter-spacing:.8px;color:#91acbf;margin-top:3px}
.retail-story .pin time{font:10px/1.3 monospace;font-variant-numeric:tabular-nums;color:#d9f7ff;margin-left:5px}
.retail-story .metric strong.duration-value{font-size:43px;letter-spacing:-1px;font-variant-numeric:tabular-nums}
.retail-story .metric strong.duration-value small,.retail-story .metric strong.people-value small{display:block;font:8px/1.8 monospace;letter-spacing:.6px;text-transform:uppercase;margin:5px 0 0;color:#8da9c9}
.retail-story .track-roster{min-height:174px}
.retail-story .roster-heading{font:7px/1.6 monospace;letter-spacing:.9px;color:#829ebd;margin:0 0 10px}
.retail-story .roster-row{display:flex;justify-content:space-between;gap:12px;align-items:center;border-top:1px solid #27405a77;padding:9px 0;font:9px/1.6 monospace;color:#a4bcd4}
.retail-story .roster-row strong{font:9px/1.5 monospace;color:#d2ecfa;font-weight:400;white-space:nowrap}
.retail-story .roster-row time{color:#d5c2fa;font-variant-numeric:tabular-nums}
.retail-story .roster-note{font:8px/1.7 Arial,Helvetica,sans-serif;color:#7e9ab9;margin:7px 0 0}
@media(min-width:801px){.retail-story .metric{min-height:103px}
.retail-story .decision p{min-height:82px}
.retail-story .measure{min-height:73px}
.retail-story .film-bottom{min-height:63px}
.retail-story .panel h3{min-height:78px}
}
@media(max-width:1050px) and (min-width:801px){.retail-story .main-grid{grid-template-columns:minmax(0,1.8fr) minmax(290px,1fr)}
.retail-story .pin-flow{right:1.5%;top:2%!important}
.retail-story .pin-capacity{left:44%!important;top:2%!important}
.retail-story .track-label{font-size:8px;padding:3px 4px;top:-19px}
.retail-story .browser-track .track-label{top:-31px}
.retail-story .service-track .track-label,.retail-story .staff-track .track-label{font-size:7px;padding:2px 3px}
.retail-story .service-track .track-label{bottom:-16px}
}
@media(max-width:800px){.retail-story .pin-capacity{left:51%!important}
.retail-story .track-roster{min-height:150px}
}
@media(max-width:520px){.retail-story .person-track{background-size:6px 1px,1px 6px,6px 1px,1px 6px,6px 1px,1px 6px,6px 1px,1px 6px}
.retail-story .track-label{font-size:7px;padding:2px 3px;top:-16px;letter-spacing:-.2px}
.retail-story .track-label small{display:none}
.retail-story .browser-track .track-label{top:-16px}
.retail-story .track-label time{padding-left:3px;font-size:7px}
.retail-story .service-track .track-label{font-size:6px;letter-spacing:-.4px;padding:2px 1px;bottom:-13px}
.retail-story .staff-track .track-label{font-size:6px;letter-spacing:-.3px;padding:2px 2px;top:-13px}
.retail-story .pin-flow{right:1.5%;top:1.5%!important}
.retail-story .pin-capacity{left:36%!important;top:1.5%!important}
.retail-story .pin small{font-size:5px;letter-spacing:.1px;margin-top:2px}
.retail-story .pin time{font-size:7px;margin-left:2px}
.retail-story .pin{padding:3px 6px 3px 3px;gap:3px;font-size:7px}
.retail-story .pin b{width:16px;height:16px;font-size:6px}
.retail-story .metric strong.duration-value{font-size:47px}
.retail-story .roster-heading{font-size:8px}
.retail-story .roster-row,.retail-story .roster-row strong{font-size:11px}
.retail-story .roster-note{font-size:10px}
.retail-story .track-roster{min-height:0}
}
@media(max-width:350px){.retail-story .pin-capacity{left:31%!important}
.retail-story .pin-flow{right:1%}
.retail-story .pin{font-size:6px}
.retail-story .pin small{font-size:4.5px}
.retail-story .pin time{font-size:6px}
.retail-story .browser-track .track-label{font-size:6px}
.retail-story .track-label time{font-size:6px}
}
@media(max-width:1050px) and (min-width:801px){.retail-story .main-grid{grid-template-columns:1fr}
.retail-story .panel{border-left:0;border-top:1px solid #2b405a;display:grid;grid-template-columns:1fr 1fr;gap:0 30px;padding:26px}
.retail-story .panel-kicker{grid-column:1/-1}
.retail-story .panel h3{grid-column:1;min-height:0}
.retail-story .metric{grid-column:2;grid-row:2;min-height:0}
.retail-story .track-roster{grid-column:2;grid-row:3/5;min-height:150px}
.retail-story .decision{grid-column:1;grid-row:3}
.retail-story .decision p,.retail-story .measure{min-height:0}
.retail-story .measure{grid-column:1;grid-row:4}
.retail-story .concept-cta{grid-column:1/-1}
.retail-story .pin-capacity{left:51%!important}
}



#visual-story.retail-story{scroll-margin-top:25px;background:transparent;min-width:0;line-height:1.4}
.retail-story .concept-cta{min-height:44px;gap:15px;text-decoration:none}.retail-story .concept-cta:hover{color:#d9f7ff}.retail-story .concept-cta:focus-visible{outline:2px solid #b7efff;outline-offset:4px}

.retail-story:not([data-ready="true"]) .person-track,.retail-story:not([data-ready="true"]) .tracking-route{display:none}

/* Browsing sits above the stationary laptop customer, away from service/entry. */
.retail-story .pin-dwell{left:2.3%!important;top:9%!important;border-color:#c9b1f077}
.retail-story .pin-dwell[aria-pressed="true"]{border-color:#dcc4ff;box-shadow:0 0 22px #b399ed26,0 5px 20px #0005}
.retail-story .pin-dwell[aria-pressed="true"] b{background:#d1b8f7;color:#1b1230}
@media(max-width:520px){.retail-story .pin-dwell{left:2%!important;top:9%!important}}

/* Smaller labels for the partially occluded shoppers at the rear displays. */
.retail-story .secondary-browser .track-label{top:-20px;font-size:8px;padding:3px 4px}
.retail-story #retail-track-204 .track-label{top:auto;bottom:-20px}
@media(max-width:520px){.retail-story .secondary-browser .track-label{top:-14px;font-size:6px;padding:2px}.retail-story #retail-track-204 .track-label{top:auto;bottom:-14px}}