.how-illustrated .how-heading-row{align-items:end;gap:20px}.how-replay{border:1px solid var(--store-line);min-height:44px;color:var(--store-muted);font-family:var(--font-sans);white-space:nowrap;background:0 0;border-radius:24px;flex-shrink:0;justify-content:center;align-items:center;gap:7px;padding:10px 15px;font-size:11px;display:inline-flex}.how-replay:hover{color:var(--teal-deep);background:#e9eee4}.how-illustrated-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:0;padding:0;list-style:none;display:grid}.how-illustrated-steps>li{min-width:0}.how-scene{aspect-ratio:360/225;border:1px solid #dedfd3;border-radius:18px;overflow:hidden}.how-scene-choose{background:#f1f0e9}.how-scene-download{background:#eaf0e5}.how-scene-follow{background:#ece3d6}.how-scene>svg{width:100%;height:100%;font-family:var(--font-sans);display:block}.how-step-copy{padding:20px 4px 0}.how-step-copy h3{font-family:var(--font-sans);letter-spacing:-.02em;align-items:center;gap:11px;margin:0 0 10px;font-size:18px;font-weight:500;line-height:1.3;display:flex}.how-step-copy h3 span{letter-spacing:0;width:27px;height:27px;color:var(--clay-deep);border:1px solid #d7dace;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:10px;display:inline-flex}.how-step-copy p{color:var(--store-muted);max-width:285px;margin:0;font-size:13px;line-height:1.65}.how-choice-card{transform-origin:180px 105px}.how-choice-check{transform-origin:232px 36px}.how-choice-cursor{opacity:0}.how-download-paper{transform:translateY(13px)}.how-download-arrow{opacity:0}.how-download-check{opacity:1}.how-exercise-start{opacity:0}.how-exercise-finish{opacity:1}.how-session-check{stroke-dasharray:1;stroke-dashoffset:0}.how-scene.is-playing .how-choice-card{animation:4s both how-select-card}.how-scene.is-playing .how-choice-check{animation:4s both how-select-check}.how-scene.is-playing .how-choice-cursor{animation:4s both how-select-cursor}.how-scene.is-playing .how-download-paper{animation:4s cubic-bezier(.2,.7,.2,1) both how-save-paper}.how-scene.is-playing .how-download-arrow{animation:4s both how-save-arrow}.how-scene.is-playing .how-download-check{animation:4s both how-save-check}.how-scene.is-playing .how-exercise-start{animation:4s both how-follow-start}.how-scene.is-playing .how-exercise-finish{animation:4s both how-follow-finish}.how-scene.is-playing .how-session-check{animation:4s both how-log-session}@keyframes how-select-card{0%,35%{transform:translateY(5px)}55%{transform:translateY(-5px)}75%,to{transform:translateY(0)}}@keyframes how-select-check{0%,43%{opacity:0;transform:scale(.65)}60%{opacity:1;transform:scale(1.1)}75%,to{opacity:1;transform:scale(1)}}@keyframes how-select-cursor{0%,8%{opacity:0;transform:translate(28px,22px)}20%{opacity:1;transform:translate(28px,22px)}43%{opacity:1;transform:translate(-5px,-14px)}49%{opacity:1;transform:translate(-5px,-14px)scale(.9)}56%{opacity:1;transform:translate(-5px,-14px)}78%,to{opacity:0;transform:translate(5px,-4px)}}@keyframes how-save-paper{0%,15%{transform:translateY(-17px)}60%,to{transform:translateY(13px)}}@keyframes how-save-arrow{0%,18%{opacity:1;transform:translateY(-5px)}40%{opacity:1;transform:translateY(3px)}58%,to{opacity:0;transform:translateY(8px)}}@keyframes how-save-check{0%,53%{opacity:0}72%,to{opacity:1}}@keyframes how-follow-start{0%,28%{opacity:1}42%,to{opacity:0}}@keyframes how-follow-finish{0%,28%{opacity:0}42%,to{opacity:1}}@keyframes how-log-session{0%,64%{stroke-dashoffset:1px}85%,to{stroke-dashoffset:0}}@media (width<=1000px) and (width>=701px){.how-illustrated-steps{gap:18px}.how-step-copy h3{gap:7px;font-size:15px}.how-step-copy p{font-size:12px}.how-step-copy h3 span{width:22px;height:22px}}@media (width<=700px){.how-illustrated .how-heading-row{flex-direction:row;align-items:start;gap:10px}.how-heading-row h2{max-width:245px}.how-replay{width:44px;height:44px;margin-top:27px;padding:0;font-size:0}.how-replay svg{width:17px;height:17px}.how-illustrated-steps{grid-template-columns:1fr;gap:28px}.how-illustrated-steps>li{width:100%;max-width:430px;margin:0 auto}.how-scene{aspect-ratio:360/205;border-radius:15px}.how-step-copy{padding-top:14px}.how-step-copy h3{margin-bottom:8px;font-size:18px}.how-step-copy p{max-width:none;font-size:13px}}@media (prefers-reduced-motion:reduce){.how-scene *,.how-scene :before,.how-scene :after{transition:none!important;animation:none!important}.how-replay{display:none}}.how-exercise-start,.how-exercise-finish{mix-blend-mode:multiply}
