.ce-narration{--ce-narration-ink:#0b1728;--ce-narration-muted:#52637a;--ce-narration-line:#d9e2ef;--ce-narration-panel:#f7f9fc;margin:1.5rem 0 2rem;padding:clamp(1rem,3vw,1.5rem);border:1px solid var(--ce-narration-line);border-radius:20px;background:#fff;color:var(--ce-narration-ink);box-shadow:0 14px 40px rgba(10,31,61,.08)}
.ce-narration,.ce-narration *{box-sizing:border-box}.ce-narration h3,.ce-narration p,.ce-narration label,.ce-narration summary,.ce-narration span{color:var(--ce-narration-ink)}
.ce-narration__head{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start}.ce-narration__head h3{margin:.15rem 0 .3rem;font-size:clamp(1.15rem,2vw,1.45rem)}.ce-narration__head p{margin:0;color:var(--ce-narration-muted)}
.ce-narration__controls{display:grid;grid-template-columns:repeat(5,auto) minmax(120px,.55fr) minmax(120px,.55fr) minmax(150px,.75fr) minmax(170px,1fr);gap:.65rem;align-items:end;margin-top:1rem}.ce-narration__controls button,.ce-narration__resume{min-height:48px;min-width:48px;border:1px solid #aebdd0;border-radius:12px;padding:.7rem .9rem;background:#fff;color:#0b1728;font:inherit;font-weight:750;cursor:pointer}.ce-narration__controls [data-ce-narration-play]{background:#123d74;color:#fff;border-color:#123d74}.ce-narration__controls button:focus-visible,.ce-narration select:focus-visible,.ce-narration__resume:focus-visible{outline:3px solid rgba(29,96,184,.32);outline-offset:2px}.ce-narration__field{display:grid;gap:.3rem;font-size:.82rem;font-weight:700}.ce-narration__field select{min-height:48px;width:100%;border:1px solid #aebdd0;border-radius:12px;padding:.6rem .7rem;background:#fff;color:#0b1728;font:inherit}
.ce-narration__progress{width:100%;height:.55rem;margin-top:1rem;accent-color:#123d74}.ce-narration__status{display:flex;justify-content:space-between;gap:1rem;margin:.5rem 0 0;font-size:.86rem;color:var(--ce-narration-muted)}.ce-narration__now{margin-top:1rem;padding:1rem;border-radius:14px;background:var(--ce-narration-panel);font-size:1.02rem;line-height:1.65;color:#0b1728}.ce-narration__resume{display:inline-flex;margin-top:.75rem}
.ce-narration details{margin-top:1rem;border-top:1px solid var(--ce-narration-line);padding-top:.9rem}.ce-narration summary{cursor:pointer;font-weight:800}.ce-narration__transcript{max-height:18rem;overflow:auto;margin-top:.75rem;padding-right:.25rem}.ce-narration__transcript-line{margin:.35rem 0;padding:.55rem .7rem;border-left:3px solid transparent;border-radius:8px;line-height:1.55}.ce-narration__transcript-line.is-current{border-left-color:#123d74;background:#edf4fc;font-weight:650}
.ce-narration__note{margin-top:.9rem;font-size:.82rem;color:var(--ce-narration-muted)}
@media(max-width:1180px){.ce-narration__controls{grid-template-columns:repeat(3,minmax(0,1fr))}.ce-narration__field{grid-column:span 3}.ce-narration__head{display:block}}
@media(max-width:460px){.ce-narration{border-radius:16px;padding:1rem}.ce-narration__controls{grid-template-columns:repeat(3,1fr)}.ce-narration__controls button{padding:.65rem .45rem}.ce-narration__field{grid-column:1/-1}.ce-narration__status{display:block}.ce-narration__now{font-size:.96rem}}
@media(prefers-reduced-motion:reduce){.ce-narration *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media(prefers-contrast:more){.ce-narration{border-width:2px}.ce-narration__controls button,.ce-narration__field select{border-width:2px}}
.ce-narration__quality{display:inline-flex;align-items:center;min-height:32px;padding:.35rem .65rem;border:1px solid #c8d5e5;border-radius:999px;background:#f4f8fd;color:#20334d!important;font-size:.78rem;font-weight:800;white-space:nowrap}
.ce-narration__utility{display:flex;align-items:center;flex-wrap:wrap;gap:.65rem;margin-top:.8rem;color:var(--ce-narration-muted);font-size:.82rem}
.ce-narration__utility-button{min-height:48px;border:1px solid #b7c6d8;border-radius:10px;padding:.55rem .8rem;background:#fff;color:#0b1728;font:inherit;font-weight:750;cursor:pointer}
.ce-narration__utility-button:hover{background:#f2f6fb}.ce-narration__utility-button:disabled{cursor:progress;opacity:.65}.ce-narration__utility-button:focus-visible{outline:3px solid rgba(29,96,184,.32);outline-offset:2px}
.ce-narration__disclosure{margin:.9rem 0 0;padding:.75rem .85rem;border-radius:12px;background:#f6f8fb;color:#3c4e65!important;font-size:.78rem;line-height:1.55}
@media(max-width:1180px){.ce-narration__quality{margin-top:.7rem}.ce-narration__controls{grid-template-columns:repeat(3,minmax(0,1fr))}.ce-narration__field{grid-column:span 3}.ce-narration__utility{align-items:flex-start}}
@media(max-width:460px){.ce-narration__quality{white-space:normal}.ce-narration__utility{display:grid;grid-template-columns:1fr}.ce-narration__utility-button{width:100%}}
.ce-narration__utility-link{display:inline-flex;align-items:center;min-height:48px;padding:.55rem .15rem;color:#174d91!important;font-weight:800;text-decoration:underline;text-underline-offset:3px}.ce-narration__utility-link:focus-visible{outline:3px solid rgba(29,96,184,.32);outline-offset:3px;border-radius:6px}

/* Sentence-synchronised Read With Me highlighting for locally mastered Certifiedge Voice audio. */
.ce-narration__sentence{border-radius:.28rem;transition:background-color .16s ease,color .16s ease,box-shadow .16s ease}.ce-narration__sentence.is-current-sentence{background:#fff1a8;color:#172033!important;box-shadow:0 0 0 2px rgba(104,75,0,.14)}
@media(prefers-reduced-motion:reduce){.ce-narration__sentence{transition:none}}
@media(forced-colors:active){.ce-narration__sentence.is-current-sentence{outline:2px solid CanvasText;background:Canvas;color:CanvasText!important}}

/* Alignment 2.0 exact word-following. Bright highlight surfaces always retain dark text. */
.ce-narration__word{border-radius:.2rem;padding:0 .04em}.ce-narration__word.is-current-word{background:#123d74;color:#fff!important;box-shadow:0 0 0 2px rgba(18,61,116,.16)}
.ce-narration__sentence.is-current-sentence .ce-narration__word:not(.is-current-word){color:#172033!important}
@media(forced-colors:active){.ce-narration__word.is-current-word{outline:2px solid Highlight;background:Highlight;color:HighlightText!important}}

/* Stage 3 Semantic STEM Speech */
.ce-narration__context{display:inline-flex;align-items:center;min-height:28px;margin-right:.55rem;padding:.28rem .55rem;border-radius:999px;background:#e7f0fb;color:#163a68!important;font-size:.76rem;font-weight:800}.ce-narration__context[hidden]{display:none!important}@media(forced-colors:active){.ce-narration__context{border:1px solid CanvasText;background:Canvas;color:CanvasText!important}}

/* Stage 4 · language-aware code speech */
.ce-narration__transcript-line[data-code-mode="off"]{opacity:.72}.ce-narration__code-note{font-size:.8rem;color:#34465f}

/* Stage 5 · governed visual-description context */
.ce-narration__context[data-kind="visual"]{letter-spacing:.01em}

/* Stage 6 multilingual narration: preserve authored script direction without changing global theme direction. */
.ce-narration__transcript-line[dir="rtl"],
.ce-narration__now[dir="rtl"]{direction:rtl;text-align:right;unicode-bidi:plaintext}
.ce-narration__transcript-line[dir="ltr"],
.ce-narration__now[dir="ltr"]{direction:ltr;text-align:left;unicode-bidi:plaintext}

/* Stage 8 — governed offline package state. */
.ce-narration__utility{align-items:flex-start;flex-wrap:wrap}
.ce-narration__offline-state,.ce-narration__offline-detail{display:block;flex-basis:100%;font-size:.82rem;line-height:1.45}
.ce-narration__offline-state{font-weight:700;color:#17324f}
.ce-narration__offline-detail{color:#40556d}
@media(max-width:460px){.ce-narration__utility-button,.ce-narration__utility-link{width:100%;text-align:center;justify-content:center}}
@media(forced-colors:active){.ce-narration__offline-state,.ce-narration__offline-detail{color:CanvasText}}


/* Stage 9 — physical accessibility and device-certification hardening. */
.ce-narration [aria-disabled="true"]{opacity:.55;cursor:not-allowed}
.ce-narration__controls button,.ce-narration__utility-button,.ce-narration__utility-link,.ce-narration__field select{touch-action:manipulation}
@media(max-width:380px){
  .ce-narration__controls{grid-template-columns:1fr}
  .ce-narration__controls button,.ce-narration__field{grid-column:1/-1;width:100%}
  .ce-narration__status{display:block}
  .ce-narration__transcript{max-height:none;overflow:visible;padding-right:0}
}
@media(forced-colors:active){
  .ce-narration{border:2px solid CanvasText;background:Canvas;color:CanvasText;box-shadow:none}
  .ce-narration__controls button,.ce-narration__utility-button,.ce-narration__utility-link,.ce-narration__field select,.ce-narration__resume{border:2px solid ButtonText;background:ButtonFace;color:ButtonText!important;forced-color-adjust:auto}
  .ce-narration__controls [data-ce-narration-play]{background:Highlight;color:HighlightText!important;border-color:Highlight}
  .ce-narration :where(button,a,select,summary):focus-visible{outline:3px solid Highlight!important;outline-offset:3px}
  .ce-narration [aria-disabled="true"]{opacity:1;color:GrayText!important;border-color:GrayText}
  .ce-narration__now,.ce-narration__disclosure{background:Canvas;color:CanvasText!important;border:1px solid CanvasText}
  .ce-narration__transcript-line.is-current{outline:2px solid Highlight;border-left-color:Highlight;background:Canvas}
}
