.blog-narration{align-items:center;background-color:var(--color-4);border-radius:10px;color:var(--color-white);display:flex;gap:var(--space-1);margin-bottom:var(--space-5);padding:var(--space-1) var(--space-2)}.blog-narration[hidden]{display:none}.blog-narration__stop,.blog-narration__toggle{align-items:center;background:transparent;border:0;color:var(--color-white);cursor:pointer;display:inline-flex;font-size:15px;font-weight:500;gap:10px;padding:8px 12px}.blog-narration__stop:focus-visible,.blog-narration__stop:hover,.blog-narration__toggle:focus-visible,.blog-narration__toggle:hover{color:var(--color-p)}.blog-narration.is-playing .blog-narration__icon--play,.blog-narration__icon--pause{display:none}.blog-narration.is-playing .blog-narration__icon--pause{display:inline-flex}.blog-narration__progress{background-color:hsla(0,0%,100%,.25);border-radius:2px;flex:1;height:4px;overflow:hidden}.blog-narration__progress span{background-color:var(--color-p);display:block;height:100%;transition:width .2s linear;width:0}.blog-post-content__featured-image+.blog-narration{margin-top:calc(var(--space-3) - var(--space-9))}