.product-walkthrough{padding:clamp(40px,6vw,88px) 24px;background:var(--canvas-bg);color:var(--text-primary);border-block:1px solid var(--hairline)}.product-walkthrough-inner{width:min(100%,1120px);margin-inline:auto;display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:clamp(32px,6vw,96px);align-items:center}.walkthrough-story{min-width:0}.walkthrough-kicker{margin:0 0 16px;color:var(--primary);font:600 13px/1.5 var(--font-ui)}.walkthrough-story h2{max-width:650px;margin:0;font:400 clamp(2.4rem,4.6vw,4rem)/1.04 var(--font-display);letter-spacing:-.025em;text-wrap:balance}.walkthrough-lede{max-width:530px;margin:20px 0 28px;color:var(--text-secondary);font:400 16px/1.65 var(--font-ui)}.walkthrough-board{overflow:hidden;border:1px solid var(--hairline);border-radius:12px;background:var(--ink-panel);box-shadow:0 12px 36px -24px color-mix(in srgb,var(--primary) 30%,transparent)}.walkthrough-steps{display:flex;border-bottom:1px solid var(--hairline);padding-inline:10px}.walkthrough-steps button{flex:1;min-height:54px;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--text-secondary);font:600 13px/1.4 var(--font-ui);cursor:pointer}.walkthrough-steps button span{margin-right:9px;font:400 10px/1 var(--font-mono)}.walkthrough-steps button[aria-pressed=true]{color:var(--primary);border-bottom-color:var(--primary);background:color-mix(in srgb,var(--primary) 4%,transparent)}.walkthrough-steps button:hover{background:var(--canvas-bg)}.walkthrough-detail{padding:26px}.walkthrough-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.walkthrough-node{position:relative;display:flex;align-items:center;gap:9px;min-height:62px;padding:10px 12px;border:1px solid var(--hairline);border-radius:7px;font:600 13px/1.3 var(--font-ui)}.walkthrough-node:not(:last-child):after{content:"";position:absolute;left:100%;top:50%;width:29px;height:1px;background:var(--primary)}.walkthrough-node-mark{color:var(--primary);font:400 24px/1 var(--font-ui)}.walkthrough-node-1{border-color:color-mix(in srgb,var(--primary) 35%,var(--hairline));background:color-mix(in srgb,var(--primary) 5%,var(--ink-panel))}.walkthrough-node-2 .walkthrough-node-mark{color:var(--text-success)}.walkthrough-flow-note{margin:12px 0 24px;font:400 11px/1.5 var(--font-mono);color:var(--text-secondary)}.walkthrough-detail h3{margin:0 0 8px;font:600 16px/1.4 var(--font-ui)}.walkthrough-step-description{min-height:3.2em;margin:0;color:var(--text-secondary);font:400 14px/1.6 var(--font-ui)}.walkthrough-link{display:inline-flex;align-items:center;gap:24px;min-height:44px;margin-top:8px;color:var(--primary);font:600 13px/1.4 var(--font-ui);text-decoration:none}.walkthrough-link:hover{text-decoration:underline}.walkthrough-film{width:100%;max-width:280px;margin:0;justify-self:center}.walkthrough-screen{aspect-ratio:9/16;background:#2437e4;border-radius:14px;overflow:hidden;box-shadow:0 20px 50px -24px rgba(35,48,130,.45)}.walkthrough-play,.walkthrough-play img,.walkthrough-screen video{display:block;width:100%;height:100%;object-fit:contain}.walkthrough-play{position:relative;padding:0;border:0;cursor:pointer;background:#2437e4}.walkthrough-play-label{position:absolute;bottom:22px;left:18px;right:18px;display:flex;align-items:center;gap:12px;padding:13px;border-radius:9px;background:#fff;color:#111317;text-align:left;box-shadow:0 4px 20px #0003;font:600 13px/1.3 var(--font-ui)}.walkthrough-play-label small{display:block;margin-top:4px;color:#475467;font-size:10px;font-weight:400}.walkthrough-play-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;color:#fff;background:#4f46e5;font-size:13px}.walkthrough-play:hover .walkthrough-play-icon{background:#4338ca}.walkthrough-film figcaption{display:flex;flex-direction:column;gap:4px;margin-top:16px;font:400 12px/1.5 var(--font-ui);color:var(--text-secondary)}.walkthrough-film figcaption strong{color:var(--text-primary);font-size:14px;font-weight:600}.walkthrough-transcript{margin-top:8px;font:400 12px/1.6 var(--font-ui);color:var(--text-secondary)}.walkthrough-transcript summary{padding-block:8px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}.walkthrough-transcript p{margin:4px 0 0}.walkthrough-video-error{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%;gap:16px;color:#fff;padding:20px;text-align:center}.walkthrough-video-error a{color:#fff;text-decoration:underline}.walkthrough-video-error button{padding:12px 20px;color:#111317;background:#fff;border:0;border-radius:6px;cursor:pointer}.product-walkthrough :is(button,a,summary,video):focus-visible{outline:3px solid var(--primary);outline-offset:4px}.walkthrough-play:focus-visible{outline-offset:-6px;outline-color:#fff}.mystery-main>.product-walkthrough{margin-block:16px 32px;border-radius:16px;padding-inline:clamp(24px,4vw,52px)}.mystery-main .walkthrough-link{color:var(--primary)}@media (max-width:900px){.product-walkthrough-inner{grid-template-columns:minmax(0,1fr) 240px;gap:30px}.walkthrough-detail{padding:20px}.walkthrough-flow{gap:18px}.walkthrough-node{padding:9px;flex-direction:column;gap:4px;text-align:center}.walkthrough-node:not(:last-child):after{width:19px}}@media (max-width:680px){.product-walkthrough{padding:36px 20px}.product-walkthrough-inner{grid-template-columns:minmax(0,1fr);gap:32px}.walkthrough-story h2{font-size:clamp(2.3rem,9vw,3rem)}.walkthrough-lede{font-size:15px}.walkthrough-film{max-width:260px}.walkthrough-detail{padding:18px}.walkthrough-node{font-size:12px}.walkthrough-step-description{min-height:0}.mystery-main>.product-walkthrough{padding-inline:16px}}