.narrated-heading{display:flex;align-items:center;gap:16px;min-width:0;flex-wrap:wrap}
.narrated-heading>h1,.narrated-heading>h2{min-width:0;flex:0 1 auto}
.narration{display:inline-flex;align-items:center;flex:0 0 auto;min-height:44px;vertical-align:middle;position:relative}
.narration-toggle{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:0;width:auto;min-width:76px;min-height:44px;padding:0;border:0;background:transparent;color:#d5ae91;cursor:pointer;border-radius:24px;transition:color .15s;font:400 10px/1.2 var(--sans,sans-serif);white-space:nowrap}
.narration-toggle:before{content:"";position:absolute;left:5px;top:5px;width:34px;height:34px;box-sizing:border-box;border:1px solid #dba77f80;border-radius:50%;background:#dba77f04;pointer-events:none;transition:background .15s,border-color .15s}
.narration-toggle svg{display:block;width:12px;height:12px;margin:0 16px;flex-shrink:0;fill:currentColor;stroke:none}
.narration-label{display:block;padding-right:6px;font-size:9px;line-height:1;letter-spacing:.035em;color:#c9b7a8}
.narration-toggle:after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 5px);left:0;width:max-content;padding:6px 8px;background:#242123;border:1px solid #68564a;color:#eee3db;font-size:10px;line-height:1.3;opacity:0;visibility:hidden;transform:translateY(3px);transition:opacity .15s,transform .15s;pointer-events:none;z-index:5}
.narration-toggle:hover:after,.narration-toggle:focus-visible:after{opacity:1;visibility:visible;transform:translateY(0)}
.narration-guide{margin:0;padding:14px max(25px,6vw);color:#c5b7ac;background:#211e20;border-bottom:1px solid #68564a55;font:11px/1.6 var(--sans,sans-serif);letter-spacing:.02em}
@media(prefers-reduced-motion:reduce){.narration-toggle,.narration-toggle:before,.narration-toggle:after{transition:none}}
.narration-toggle:hover,.narration-toggle[aria-pressed=true]{color:#f5d5bb}
.narration-toggle:hover:before,.narration-toggle[aria-pressed=true]:before{background:#dba77f12;border-color:#dba77f77}
.narration-toggle:focus-visible{outline:2px solid #f5d5bb;outline-offset:2px}
.narration audio{display:none}
.narration-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.narration-welcome{padding:18px max(25px,6vw);display:flex;gap:16px;flex-wrap:wrap;align-items:center;background:#211e20;border-bottom:1px solid #68564a;color:#d6c4b6;font:13px/1.6 var(--sans,sans-serif)}
.narration-welcome small{font-size:11px;color:#edbd9c}
.axis-list>details>.narration,.sensei-stories>details>.narration{display:flex;width:max-content;margin:0 0 12px;float:none}
.axis-list>details::after,.sensei-stories>details::after{content:"";display:block;clear:both}
.narration-disclosure{padding:18px 25px;text-align:center;color:#b9aaa0;background:#1b191b;font:11px/1.6 var(--sans,sans-serif)}
.audio-complete{border-top:1px solid #68564a;background:#211e20}.audio-complete p{max-width:660px}.audio-complete h2{font-size:clamp(28px,4vw,45px)}.audio-complete .underline{font-size:14px;margin-top:16px}
@media(max-width:600px){.narrated-heading{gap:12px}.narrated-heading>.narration{margin-bottom:4px}.narrated-heading>h1,.narrated-heading>h2{flex-basis:100%}}
@media(max-width:480px){.narrated-heading h1{font-size:clamp(36px,11vw,48px)}}
