.narration-control{display:flex;grid-column:1/-1;min-width:0;align-items:center;gap:8px 11px;flex-wrap:wrap;max-width:100%;margin:0 0 15px;color:#dddbd0;font:12px/1.5 var(--sans,system-ui);isolation:isolate}.narration-play,.narration-stop{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border:1px solid #b6d9d45c;border-radius:24px;background:linear-gradient(120deg,#30404b75,#372a4673);color:#f3e5c6;padding:8px 15px;font:500 13px/1.4 var(--sans,system-ui);cursor:pointer;box-shadow:inset 0 1px #e7ddc712;transition:border-color .18s,background .18s}.narration-play:hover,.narration-stop:hover{border-color:#e8d5a8a6;background:#4c3a606e}.narration-play[aria-pressed=true]{border-color:#e8d5a899;box-shadow:0 0 18px #dac5a21c,inset 0 1px #e7ddc720}.narration-play:disabled{cursor:wait;opacity:.7}.narration-stop{padding:7px;min-width:44px;font-size:15px}.narration-voice{color:#c5d7d0;font:italic 14px/1.4 var(--serif,Georgia,serif)}.narration-time{color:#b7b2c1;font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap}.narration-progress{flex:1 1 140px;min-width:90px;max-width:290px;height:32px;accent-color:#d7c99f;cursor:pointer}.narration-status{flex-basis:100%;color:#d7cbc6;font-size:12px;line-height:1.6}.narration-status:empty{display:none}.narration-control[hidden],.narration-control [hidden]{display:none!important}.narration-control button:focus-visible,.narration-control input:focus-visible{outline:2px solid #f6dfa4;outline-offset:4px}.narration-current{background:linear-gradient(90deg,#b6d8cb17,transparent);box-shadow:-3px 0 #cfdecf88;border-radius:0 5px 5px 0;transition:background-color .2s}.narration-control+.story-timeline{margin-top:0}.narration-timeline{max-width:850px;margin:2.5rem auto 15px}@media(max-width:600px){.narration-control{margin-bottom:13px;gap:5px 9px}.narration-play{font-size:12px;padding-inline:12px}.narration-voice{font-size:13px}.narration-progress{flex-basis:100%;max-width:none}.narration-time{font-size:11px}}@media(prefers-reduced-motion:reduce){.narration-control *,.narration-current{transition:none!important}}@media print{.narration-control{display:none!important}.narration-current{background:none;box-shadow:none}}.narration-follow{display:inline-flex;align-items:center;justify-content:center;min-height:44px;max-width:100%;border:1px solid #d9bf8052;border-radius:24px;background:linear-gradient(120deg,#8f70541a,#b28ac118);color:#e8d8b3;padding:8px 13px;font:500 12px/1.4 var(--sans,system-ui);cursor:pointer;transition:background .2s,border-color .2s,box-shadow .2s}.narration-follow:hover{border-color:#e6d097a8;background:#ab8b6230}.narration-follow[aria-pressed=true]{border-color:#ead39799;background:linear-gradient(125deg,#b3904c24,#78619f30);box-shadow:inset 0 1px #ffe7b525,0 0 20px #e3c37c12;color:#fff0c9}.storybook-help{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.storybook-reading-target{scroll-margin-top:var(--storybook-reading-top,100px);scroll-margin-bottom:40px}.storybook-reader-active{position:sticky;top:var(--storybook-toolbar-top,100px);z-index:8;background:linear-gradient(125deg,#1c2e3bf5,#252238f5);border-radius:15px;outline:1px solid #d7c99f4d;box-shadow:0 6px 20px #05071133;padding:7px 9px;margin-inline:0}.storybook-reader-active .narration-play{order:0}.storybook-reader-active .narration-follow{order:1}.storybook-reader-active .narration-stop{order:2}.storybook-reader-active .narration-voice{order:3}.storybook-reader-active .narration-time{order:4}.storybook-reader-active .narration-progress{order:5}.storybook-reader-active .narration-status{order:6}@media(max-width:600px){.narration-follow{padding-inline:11px;font-size:12px}}@media(max-height:500px){.storybook-reader-active .narration-voice{display:none}.storybook-reader-active{gap:4px 8px;padding-block:5px}}
