.how-illustrated .how-heading-row{align-items:end;gap:20px}.how-replay{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:10px 15px;border:1px solid var(--store-line);border-radius:24px;background:transparent;color:var(--store-muted);font-family:var(--font-sans);font-size:11px;white-space:nowrap;flex-shrink:0}.how-replay:hover{background:#e9eee4;color:var(--teal-deep)}.how-illustrated-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;list-style:none;padding:0;margin:0}.how-illustrated-steps>li{min-width:0}.how-scene{overflow:hidden;border:1px solid #dedfd3;border-radius:18px;aspect-ratio:360 / 225}.how-scene-choose{background:#f1f0e9}.how-scene-download{background:#eaf0e5}.how-scene-follow{background:#ece3d6}.how-scene>svg{display:block;width:100%;height:100%;font-family:var(--font-sans)}.how-step-copy{padding:20px 4px 0}.how-step-copy h3{display:flex;align-items:center;gap:11px;font-family:var(--font-sans);font-size:18px;font-weight:500;letter-spacing:-.02em;line-height:1.3;margin:0 0 10px}.how-step-copy h3 span{display:inline-flex;justify-content:center;align-items:center;flex-shrink:0;height:27px;width:27px;border:1px solid #d7dace;border-radius:50%;font-size:10px;letter-spacing:0;color:var(--clay-deep)}.how-step-copy p{font-size:13px;line-height:1.65;color:var(--store-muted);margin:0;max-width:285px}.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:how-select-card 4s ease both}.how-scene.is-playing .how-choice-check{animation:how-select-check 4s ease both}.how-scene.is-playing .how-choice-cursor{animation:how-select-cursor 4s ease both}.how-scene.is-playing .how-download-paper{animation:how-save-paper 4s cubic-bezier(.2,.7,.2,1) both}.how-scene.is-playing .how-download-arrow{animation:how-save-arrow 4s ease both}.how-scene.is-playing .how-download-check{animation:how-save-check 4s ease both}.how-scene.is-playing .how-exercise-start{animation:how-follow-start 4s ease both}.how-scene.is-playing .how-exercise-finish{animation:how-follow-finish 4s ease both}.how-scene.is-playing .how-session-check{animation:how-log-session 4s ease both}@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:1}85%,to{stroke-dashoffset:0}}@media(max-width:1000px)and (min-width:701px){.how-illustrated-steps{gap:18px}.how-step-copy h3{font-size:15px;gap:7px}.how-step-copy p{font-size:12px}.how-step-copy h3 span{width:22px;height:22px}}@media(max-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;padding:0;font-size:0;margin-top:27px}.how-replay svg{width:17px;height:17px}.how-illustrated-steps{grid-template-columns:1fr;gap:28px}.how-illustrated-steps>li{max-width:430px;width:100%;margin:0 auto}.how-scene{aspect-ratio:360 / 205;border-radius:15px}.how-step-copy{padding-top:14px}.how-step-copy h3{font-size:18px;margin-bottom:8px}.how-step-copy p{max-width:none;font-size:13px}}@media(prefers-reduced-motion:reduce){.how-scene *,.how-scene *:before,.how-scene *:after{animation:none!important;transition:none!important}.how-replay{display:none}}.how-exercise-start,.how-exercise-finish{mix-blend-mode:multiply}
/*# sourceMappingURL=/cdn/shop/t/4/assets/tt-how.css.map */