.narration-panel[hidden]{display:none}
.narration-panel{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:12px;padding:14px 18px;margin:12px auto;max-width:1050px;box-sizing:border-box;background:#fff6f7;border:1px solid #e7bcc6;border-radius:18px;color:#553946}
.narration-play{font:inherit;font-weight:600;border:1px solid #c68f9d;border-radius:24px;background:#f8e0e6;color:#553946;padding:11px 18px;min-height:44px;cursor:pointer}
.narration-play:focus-visible,.narration-auto input:focus-visible{outline:3px solid #75465a;outline-offset:3px}
.narration-panel audio{width:290px;max-width:100%;height:44px}
.narration-auto{display:flex;align-items:center;gap:8px;font-size:.9rem;min-height:44px;cursor:pointer}
.narration-auto input{width:18px;height:18px;accent-color:#9b5a70}
.narration-status{width:100%;margin:0;text-align:center;font-size:.9rem}
.narration-status:empty{display:none}
@media(max-width:600px){.narration-panel{gap:8px;padding:12px}.narration-panel audio{width:100%}}
.reader-stage.is-expanded .narration-panel{flex-shrink:0;margin:5px auto;padding:6px 12px}

.readalong-word.is-speaking{background:#f6c5d3;color:#402331;border-radius:4px;box-shadow:0 0 0 2px #f6c5d3;box-decoration-break:clone;-webkit-box-decoration-break:clone}
@media print{.narration-panel{display:none}.readalong-word.is-speaking{background:transparent;box-shadow:none;color:inherit}}