/* Novera Read Aloud v0.1.0 */

.nra-shell{
  position:fixed;
  z-index:9990;
  right:18px;
  bottom:18px;
  display:flex;
  align-items:center;
  gap:8px;
  max-width:min(720px,calc(100vw - 36px));
  padding:8px;
  border:1px solid rgba(115,130,150,.24);
  border-radius:16px;
  background:rgba(255,255,255,.94);
  box-shadow:0 14px 40px rgba(15,23,42,.14);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  color:#142033;
  font:inherit;
}

.nra-shell[hidden]{display:none!important}

.nra-main,
.nra-stop{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1px solid #d9e1eb;
  border-radius:10px;
  background:#fff;
  color:#172033;
  font:inherit;
  font-size:12px;
  font-weight:750;
  cursor:pointer;
}

.nra-main{
  padding:8px 13px;
  background:#347cff;
  border-color:#347cff;
  color:#fff;
}

.nra-stop{
  width:38px;
  padding:0;
}

.nra-main:hover{filter:brightness(.98)}
.nra-stop:hover{background:#f5f7fa}

.nra-icon{
  width:13px;
  display:inline-flex;
  justify-content:center;
  font-size:11px;
}

.nra-field{
  display:flex;
  flex-direction:column;
  gap:3px;
  color:#637083;
  font-size:8px;
  font-weight:750;
  letter-spacing:.02em;
}

.nra-field select{
  height:28px;
  max-width:190px;
  border:1px solid #d9e1eb;
  border-radius:8px;
  background:#fff;
  color:#1d2737;
  padding:0 25px 0 8px;
  font:inherit;
  font-size:10px;
}

.nra-status{
  max-width:170px;
  color:#637083;
  font-size:9px;
  line-height:1.25;
}

#chapter-content .nra-reading,
.chapter__content .nra-reading{
  position:relative;
  border-radius:6px;
  background:rgba(52,124,255,.08)!important;
  box-shadow:0 0 0 4px rgba(52,124,255,.08);
  transition:background-color .2s ease,box-shadow .2s ease;
}

/* Fictioneer dark mode */
:root[data-mode="dark"] .nra-shell,
:root:not([data-mode="light"]) .nra-shell{
  background:rgba(29,37,50,.95);
  border-color:#3a4658;
  color:#eef3fb;
  box-shadow:0 16px 44px rgba(0,0,0,.34);
}

:root[data-mode="dark"] .nra-stop,
:root:not([data-mode="light"]) .nra-stop,
:root[data-mode="dark"] .nra-field select,
:root:not([data-mode="light"]) .nra-field select{
  background:#222c3b;
  border-color:#3b485a;
  color:#edf2f8;
}

:root[data-mode="dark"] .nra-field,
:root:not([data-mode="light"]) .nra-field,
:root[data-mode="dark"] .nra-status,
:root:not([data-mode="light"]) .nra-status{
  color:#aeb9c9;
}

@media(max-width:720px){
  .nra-shell{
    left:10px;
    right:10px;
    bottom:10px;
    max-width:none;
    border-radius:14px;
    padding:7px;
    flex-wrap:wrap;
  }

  .nra-main{
    flex:1 1 auto;
  }

  .nra-field{
    flex:1 1 120px;
  }

  .nra-field select{
    width:100%;
    max-width:none;
  }

  .nra-status{
    flex-basis:100%;
    max-width:none;
    text-align:center;
  }
}

@media(max-width:430px){
  .nra-voice-wrap{
    flex-basis:100%;
  }

  .nra-speed-wrap{
    flex:1;
  }
}


/* ==========================================================
   Novera Read Aloud v0.1.1 — player compacto no mobile
   ========================================================== */

.nra-collapse{
  width:30px;
  height:30px;
  flex:0 0 30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid #d9e1eb;
  border-radius:9px;
  background:#fff;
  color:#556174;
  cursor:pointer;
  font:700 16px/1 inherit;
}

.nra-collapse[hidden]{display:none!important}

.nra-voice-wrap select{
  width:170px;
  max-width:170px;
  text-overflow:ellipsis;
}

:root[data-mode="dark"] .nra-collapse,
:root:not([data-mode="light"]) .nra-collapse{
  background:#222c3b;
  border-color:#3b485a;
  color:#edf2f8;
}

@media(max-width:720px){
  .nra-shell{
    transition:padding .18s ease,border-radius .18s ease;
  }

  .nra-shell:not(.nra-compact) .nra-collapse{
    display:inline-flex!important;
    margin-left:auto;
  }

  .nra-shell.nra-compact{
    left:auto;
    right:10px;
    bottom:10px;
    width:auto;
    max-width:calc(100vw - 20px);
    padding:6px;
    flex-wrap:nowrap;
    border-radius:13px;
  }

  .nra-shell.nra-compact .nra-main{
    min-width:116px;
    min-height:38px;
    flex:0 0 auto;
    padding:8px 15px;
  }

  .nra-shell.nra-compact .nra-stop,
  .nra-shell.nra-compact .nra-speed-wrap,
  .nra-shell.nra-compact .nra-voice-wrap,
  .nra-shell.nra-compact .nra-status,
  .nra-shell.nra-compact .nra-collapse{
    display:none!important;
  }

  .nra-shell:not(.nra-compact) .nra-main{
    flex:1 1 130px;
  }

  .nra-shell:not(.nra-compact) .nra-speed-wrap{
    flex:0 1 105px;
  }

  .nra-shell:not(.nra-compact) .nra-voice-wrap{
    flex:1 1 100%;
  }

  .nra-shell:not(.nra-compact) .nra-voice-wrap select{
    width:100%;
    max-width:none;
  }
}


/* ==========================================================
   Novera Read Aloud v0.1.2 — configurações compactas mobile
   ========================================================== */

.nra-settings{
  display:flex;
  align-items:center;
  gap:8px;
}

.nra-settings-toggle{
  width:38px;
  height:38px;
  flex:0 0 38px;
  align-items:center;
  justify-content:center;
  border:1px solid #d9e1eb;
  border-radius:10px;
  background:#fff;
  color:#556174;
  font:inherit;
  font-size:15px;
  cursor:pointer;
}

.nra-settings-toggle[hidden]{
  display:none!important;
}

:root[data-mode="dark"] .nra-settings-toggle,
:root:not([data-mode="light"]) .nra-settings-toggle{
  background:#222c3b;
  border-color:#3b485a;
  color:#edf2f8;
}

@media(max-width:720px){
  .nra-shell:not(.nra-compact){
    display:grid;
    grid-template-columns:minmax(0,1fr) 38px 38px 30px;
    align-items:center;
    gap:7px;
  }

  .nra-shell:not(.nra-compact) .nra-main{
    width:100%;
    min-width:0;
  }

  .nra-shell:not(.nra-compact) .nra-stop,
  .nra-shell:not(.nra-compact) .nra-settings-toggle,
  .nra-shell:not(.nra-compact) .nra-collapse{
    display:inline-flex!important;
    margin:0;
  }

  .nra-shell:not(.nra-compact) .nra-settings{
    display:none;
    grid-column:1 / -1;
    grid-template-columns:110px minmax(0,1fr);
    gap:8px;
    padding-top:2px;
  }

  .nra-shell:not(.nra-compact).nra-settings-open .nra-settings{
    display:grid;
  }

  .nra-shell:not(.nra-compact) .nra-speed-wrap,
  .nra-shell:not(.nra-compact) .nra-voice-wrap{
    min-width:0;
  }

  .nra-shell:not(.nra-compact) .nra-field select,
  .nra-shell:not(.nra-compact) .nra-voice-wrap select{
    width:100%;
    max-width:none;
  }

  .nra-shell:not(.nra-compact) .nra-status{
    grid-column:1 / -1;
  }

  .nra-shell.nra-compact .nra-settings,
  .nra-shell.nra-compact .nra-settings-toggle{
    display:none!important;
  }
}


/* ==========================================================
   Novera Read Aloud v0.1.3 — configurações acessíveis ao recolher
   ========================================================== */

@media(max-width:720px){
  /* Compacto agora mantém o botão de configurações acessível. */
  .nra-shell.nra-compact{
    display:grid;
    grid-template-columns:minmax(116px,1fr) 38px;
    align-items:center;
    gap:7px;
  }

  .nra-shell.nra-compact .nra-main{
    width:100%;
    min-width:0;
    margin:0;
  }

  .nra-shell.nra-compact .nra-settings-toggle{
    display:inline-flex!important;
    width:38px;
    height:38px;
    margin:0;
  }

  .nra-shell.nra-compact .nra-stop,
  .nra-shell.nra-compact .nra-speed-wrap,
  .nra-shell.nra-compact .nra-voice-wrap,
  .nra-shell.nra-compact .nra-status,
  .nra-shell.nra-compact .nra-collapse,
  .nra-shell.nra-compact .nra-settings{
    display:none!important;
  }

  /* Ao tocar na engrenagem estando compacto, JS expande o player
     e abre imediatamente Voz/Velocidade. */
}


/* ==========================================================
   Novera Read Aloud v0.1.4.2
   Correção visual do seletor de voz — claro/escuro
   ========================================================== */

/* Tema claro explícito */
:root[data-mode="light"] .novera-read-aloud select,
:root[data-mode="light"] .novera-read-aloud select option,
html[data-theme="light"] .novera-read-aloud select,
html[data-theme="light"] .novera-read-aloud select option,
body.light .novera-read-aloud select,
body.light .novera-read-aloud select option {
  color-scheme: light;
  background-color: #ffffff !important;
  color: #172033 !important;
}

/* Tema escuro explícito */
:root[data-mode="dark"] .novera-read-aloud select,
:root[data-mode="dark"] .novera-read-aloud select option,
html[data-theme="dark"] .novera-read-aloud select,
html[data-theme="dark"] .novera-read-aloud select option,
body.dark .novera-read-aloud select,
body.dark .novera-read-aloud select option {
  color-scheme: dark;
  background-color: #1b2635 !important;
  color: #eef3f8 !important;
}

/* Fictioneer pode usar classes/atributos diferentes conforme a configuração.
   Estes seletores cobrem os estados escuros mais comuns sem assumir que a
   ausência de "light" significa automaticamente "dark". */
html.dark-mode .novera-read-aloud select,
html.dark-mode .novera-read-aloud select option,
body.dark-mode .novera-read-aloud select,
body.dark-mode .novera-read-aloud select option,
html.is-dark .novera-read-aloud select,
html.is-dark .novera-read-aloud select option,
body.is-dark .novera-read-aloud select,
body.is-dark .novera-read-aloud select option {
  color-scheme: dark;
  background-color: #1b2635 !important;
  color: #eef3f8 !important;
}

/* Fallback do sistema apenas quando o tema do site não estiver marcado. */
@media (prefers-color-scheme: dark) {
  :root:not([data-mode="light"]):not([data-mode="dark"]) .novera-read-aloud select,
  :root:not([data-mode="light"]):not([data-mode="dark"]) .novera-read-aloud select option {
    color-scheme: dark;
    background-color: #1b2635 !important;
    color: #eef3f8 !important;
  }
}

/* Melhora contraste da opção selecionada/focada quando o navegador respeita
   estilos de option. Em alguns Android/Windows o sistema ainda controla parte
   do highlight nativo, mas o texto/fundo base permanecem coerentes. */
.novera-read-aloud select option:checked {
  font-weight: 700;
}


/* ==========================================================
   Novera Read Aloud v0.2.0 — posição persistente e início manual
   ========================================================== */

.nra-choose-start{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:7px 10px;
  border:1px solid #d9e1eb;
  border-radius:9px;
  background:#fff;
  color:#425166;
  font:inherit;
  font-size:9px;
  font-weight:750;
  cursor:pointer;
  white-space:nowrap;
}

.nra-resume-prompt{
  position:fixed;
  z-index:9989;
  right:18px;
  bottom:82px;
  width:min(410px,calc(100vw - 36px));
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:11px 12px;
  border:1px solid #d9e1eb;
  border-radius:13px;
  background:rgba(255,255,255,.97);
  color:#172033;
  box-shadow:0 14px 40px rgba(15,23,42,.14);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

.nra-resume-prompt[hidden],
.nra-pick-hint[hidden]{display:none!important}

.nra-resume-prompt__copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.nra-resume-prompt__copy strong{
  font-size:10px;
}

.nra-resume-prompt__copy span{
  color:#6e7b8e;
  font-size:8px;
}

.nra-resume-prompt__actions{
  display:flex;
  align-items:center;
  gap:5px;
}

.nra-resume-prompt__actions button{
  min-height:30px;
  border:1px solid #d9e1eb;
  border-radius:8px;
  background:#fff;
  color:#425166;
  padding:5px 8px;
  font:inherit;
  font-size:8px;
  font-weight:750;
  cursor:pointer;
}

#nra-resume-saved{
  border-color:#347cff;
  background:#347cff;
  color:#fff;
}

.nra-resume-prompt__actions .nra-resume-close{
  width:28px;
  padding:0;
  font-size:15px;
}

.nra-pick-hint{
  position:fixed;
  z-index:9992;
  left:50%;
  top:76px;
  transform:translateX(-50%);
  width:min(520px,calc(100vw - 24px));
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border:1px solid #a8c5ff;
  border-radius:12px;
  background:#eef5ff;
  color:#244a83;
  box-shadow:0 12px 30px rgba(15,23,42,.12);
  font-size:9px;
  font-weight:700;
}

.nra-pick-hint button{
  border:0;
  background:transparent;
  color:#2468d7;
  font:inherit;
  font-size:9px;
  font-weight:800;
  cursor:pointer;
}

.chapter__content.nra-picking-start .nra-pickable,
#chapter-content.nra-picking-start .nra-pickable{
  cursor:pointer;
  border-radius:6px;
  transition:background .14s ease, box-shadow .14s ease;
}

.chapter__content.nra-picking-start .nra-pickable:hover,
#chapter-content.nra-picking-start .nra-pickable:hover{
  background:rgba(52,124,255,.08)!important;
  box-shadow:0 0 0 4px rgba(52,124,255,.08);
}

/* Tema escuro */
:root[data-mode="dark"] .nra-choose-start,
html[data-theme="dark"] .nra-choose-start,
body.dark .nra-choose-start,
:root[data-mode="dark"] .nra-resume-prompt,
html[data-theme="dark"] .nra-resume-prompt,
body.dark .nra-resume-prompt{
  background:#1b2635;
  border-color:#3b485a;
  color:#edf2f8;
}

:root[data-mode="dark"] .nra-resume-prompt__copy span,
html[data-theme="dark"] .nra-resume-prompt__copy span,
body.dark .nra-resume-prompt__copy span{
  color:#aeb9c9;
}

:root[data-mode="dark"] .nra-resume-prompt__actions button,
html[data-theme="dark"] .nra-resume-prompt__actions button,
body.dark .nra-resume-prompt__actions button{
  background:#222c3b;
  border-color:#3b485a;
  color:#edf2f8;
}

:root[data-mode="dark"] #nra-resume-saved,
html[data-theme="dark"] #nra-resume-saved,
body.dark #nra-resume-saved{
  background:#347cff;
  border-color:#347cff;
  color:#fff;
}

:root[data-mode="dark"] .nra-pick-hint,
html[data-theme="dark"] .nra-pick-hint,
body.dark .nra-pick-hint{
  background:#15283d;
  border-color:#2d4f73;
  color:#b9d5ff;
}

@media(max-width:720px){
  .nra-shell:not(.nra-compact) .nra-settings{
    grid-template-columns:110px minmax(0,1fr);
  }

  .nra-shell:not(.nra-compact) .nra-choose-start{
    grid-column:1 / -1;
    width:100%;
  }

  .nra-resume-prompt{
    left:10px;
    right:10px;
    bottom:72px;
    width:auto;
    grid-template-columns:1fr;
    gap:8px;
  }

  .nra-resume-prompt__actions{
    display:grid;
    grid-template-columns:1fr 1fr 30px;
  }

  .nra-resume-prompt__actions button{
    width:100%;
  }

  .nra-pick-hint{
    top:64px;
  }
}
\n\n/* ==========================================================
   Novera Read Aloud v0.2.1 — player desktop compacto
   Desktop: somente ação principal + parar (quando ativo) + engrenagem.
   As opções ficam em um popover; mobile permanece inalterado.
   ========================================================== */
@media(min-width:721px){
  .nra-shell{
    overflow:visible;
  }

  .nra-shell .nra-settings-toggle{
    display:inline-flex!important;
    order:30;
  }

  .nra-shell .nra-settings{
    display:none;
    position:absolute;
    right:0;
    bottom:calc(100% + 10px);
    width:360px;
    max-width:calc(100vw - 36px);
    padding:10px;
    grid-template-columns:100px minmax(0,1fr);
    align-items:end;
    gap:9px;
    border:1px solid #d9e1eb;
    border-radius:13px;
    background:rgba(255,255,255,.98);
    box-shadow:0 14px 40px rgba(15,23,42,.16);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    z-index:2;
  }

  .nra-shell.nra-settings-open .nra-settings{
    display:grid;
  }

  .nra-shell .nra-settings::after{
    content:"";
    position:absolute;
    right:12px;
    bottom:-6px;
    width:10px;
    height:10px;
    background:inherit;
    border-right:1px solid #d9e1eb;
    border-bottom:1px solid #d9e1eb;
    transform:rotate(45deg);
  }

  .nra-shell .nra-settings .nra-field,
  .nra-shell .nra-settings .nra-field select{
    min-width:0;
    width:100%;
    max-width:none;
  }

  .nra-shell .nra-settings .nra-choose-start{
    grid-column:1 / -1;
    width:100%;
  }

  .nra-shell .nra-status:empty{
    display:none;
  }

  :root[data-mode="dark"] .nra-shell .nra-settings,
  :root:not([data-mode="light"]) .nra-shell .nra-settings,
  html[data-theme="dark"] .nra-shell .nra-settings,
  body.dark .nra-shell .nra-settings{
    background:rgba(29,37,50,.98);
    border-color:#3b485a;
    color:#edf2f8;
    box-shadow:0 16px 44px rgba(0,0,0,.34);
  }

  :root[data-mode="dark"] .nra-shell .nra-settings::after,
  :root:not([data-mode="light"]) .nra-shell .nra-settings::after,
  html[data-theme="dark"] .nra-shell .nra-settings::after,
  body.dark .nra-shell .nra-settings::after{
    border-color:#3b485a;
  }
}


/* ==========================================================
   Novera Read Aloud v0.2.2 — desktop compact settings fix
   ========================================================== */

@media (min-width: 721px){

  /* Fechado: deixa só Ouvir/Pausar + Stop + engrenagem. */
  .nra-shell:not(.nra-settings-open) .nra-settings{
    display:none!important;
  }

  /* Aberto pela engrenagem: mostra as opções em um painel flutuante. */
  .nra-shell.nra-settings-open .nra-settings{
    display:grid!important;
    position:absolute!important;
    right:0!important;
    bottom:calc(100% + 8px)!important;
    z-index:10020!important;
    width:420px!important;
    max-width:calc(100vw - 32px)!important;
    grid-template-columns:90px minmax(0,1fr)!important;
    gap:10px!important;
    padding:12px!important;
    border:1px solid #d9e1eb!important;
    border-radius:12px!important;
    background:#fff!important;
    box-shadow:0 16px 40px rgba(15,23,42,.16)!important;
  }

  .nra-shell.nra-settings-open .nra-settings .nra-field{
    min-width:0!important;
  }

  .nra-shell.nra-settings-open .nra-settings .nra-choose-start{
    grid-column:1 / -1!important;
    width:100%!important;
  }

  /* A barra desktop em si fica compacta. */
  .nra-shell{
    width:auto!important;
    max-width:min(460px, calc(100vw - 28px))!important;
  }

  .nra-shell .nra-main{
    display:flex!important;
    align-items:center!important;
    gap:6px!important;
  }

  /* Tema escuro do painel flutuante. */
  :root[data-mode="dark"] .nra-shell.nra-settings-open .nra-settings,
  html[data-theme="dark"] .nra-shell.nra-settings-open .nra-settings,
  body.dark .nra-shell.nra-settings-open .nra-settings,
  html.dark-mode .nra-shell.nra-settings-open .nra-settings,
  body.dark-mode .nra-shell.nra-settings-open .nra-settings{
    background:#1b2635!important;
    border-color:#3b485a!important;
    color:#edf2f8!important;
  }
}

/* Mobile/tablet: mantém o layout aprovado da v0.2.0. */
@media (max-width: 720px){
  .nra-settings{
    display:grid;
  }
}


/* ==========================================================
   Novera Read Aloud v0.2.3 — centralização da engrenagem
   ========================================================== */

@media (min-width: 721px){
  #nra-settings-toggle{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
    padding:0!important;
  }

  #nra-settings-toggle > *{
    margin:0!important;
    padding:0!important;
    line-height:1!important;
    transform:none!important;
  }
}

/* ==========================================================
   Novera Read Aloud v0.3.0 — nova interface desktop/mobile
   ========================================================== */

.nra-desktop-rail{
  position:fixed;
  z-index:9992;
  right:clamp(18px,3vw,56px);
  top:50%;
  transform:translateY(-50%);
  width:76px;
  padding:14px 10px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  border:1px solid rgba(115,130,150,.28);
  border-radius:24px;
  background:rgba(255,255,255,.9);
  box-shadow:0 20px 54px rgba(15,23,42,.15);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  color:#243146;
}

.nra-desktop-rail[hidden]{display:none!important}

.nra-rail-btn{
  position:relative;
  width:54px;
  height:54px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(115,130,150,.24);
  border-radius:15px;
  background:rgba(247,249,252,.94);
  color:inherit;
  cursor:pointer;
  font:700 16px/1 inherit;
  transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease;
}

.nra-rail-btn:hover{
  transform:translateY(-1px);
  border-color:rgba(52,124,255,.45);
  background:#fff;
  box-shadow:0 8px 20px rgba(15,23,42,.1);
}

.nra-rail-btn:focus-visible{
  outline:2px solid #347cff;
  outline-offset:2px;
}

.nra-rail-play{
  width:58px;
  height:58px;
  border-radius:50%;
  background:#347cff;
  border-color:#347cff;
  color:#fff;
  box-shadow:0 10px 24px rgba(52,124,255,.34);
}

.nra-rail-play:hover{background:#347cff;box-shadow:0 12px 28px rgba(52,124,255,.4)}
.nra-desktop-icon{display:inline-flex;align-items:center;justify-content:center;min-width:20px;font-size:17px;letter-spacing:-2px}
.nra-rail-nav{font-size:25px;line-height:1}
.nra-rail-speed{font-size:15px;font-weight:750}
.nra-rail-type{font-family:inherit;font-size:18px;font-weight:650}
.nra-rail-full{font-size:22px}
.nra-rail-separator{display:block;width:42px;height:1px;margin:1px 0;background:rgba(115,130,150,.28)}

.nra-rail-btn::after{
  content:attr(data-nra-tip);
  position:absolute;
  right:calc(100% + 16px);
  left:auto;
  top:50%;
  transform:translateY(-50%) translateX(4px);
  padding:7px 10px;
  border:1px solid rgba(115,130,150,.28);
  border-radius:8px;
  background:rgba(255,255,255,.98);
  color:#344156;
  box-shadow:0 8px 24px rgba(15,23,42,.12);
  white-space:nowrap;
  font:600 11px/1.2 inherit;
  opacity:0;
  pointer-events:none;
  transition:opacity .14s ease,transform .14s ease;
}

.nra-rail-btn:hover::after,
.nra-rail-btn:focus-visible::after{opacity:1;transform:translateY(-50%) translateX(0)}

.nra-mobile-nav,
.nra-mobile-speed{display:none}

.nra-auto-next{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  color:#637083;
  font-size:10px;
  font-weight:650;
  cursor:pointer;
}

.nra-auto-next input{position:absolute;opacity:0;pointer-events:none}
.nra-switch{position:relative;width:34px;height:19px;flex:0 0 34px;border-radius:999px;background:#c8d0dc;transition:background .16s ease}
.nra-switch::after{content:"";position:absolute;top:3px;left:3px;width:13px;height:13px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(15,23,42,.25);transition:transform .16s ease}
.nra-auto-next input:checked + .nra-switch{background:#347cff}
.nra-auto-next input:checked + .nra-switch::after{transform:translateX(15px)}

#chapter-content .nra-reading,
.chapter__content .nra-reading{
  position:relative;
  padding:.58em .8em!important;
  margin-left:-.8em!important;
  margin-right:-.8em!important;
  border-left:4px solid #347cff;
  border-radius:7px;
  background:linear-gradient(90deg,rgba(52,124,255,.13),rgba(52,124,255,.055))!important;
  box-shadow:none!important;
}

:root[data-mode="dark"] .nra-desktop-rail,
:root:not([data-mode="light"]) .nra-desktop-rail,
html[data-theme="dark"] .nra-desktop-rail,
html.dark-mode .nra-desktop-rail,
body.dark .nra-desktop-rail{
  background:rgba(20,31,47,.9);
  border-color:rgba(113,137,169,.3);
  color:#dfe8f5;
  box-shadow:0 24px 64px rgba(0,0,0,.36);
}

:root[data-mode="dark"] .nra-rail-btn,
:root:not([data-mode="light"]) .nra-rail-btn,
html[data-theme="dark"] .nra-rail-btn,
html.dark-mode .nra-rail-btn,
body.dark .nra-rail-btn{
  background:rgba(31,45,64,.9);
  border-color:rgba(117,140,171,.23);
  color:#dfe8f5;
}

:root[data-mode="dark"] .nra-rail-play,
:root:not([data-mode="light"]) .nra-rail-play,
html[data-theme="dark"] .nra-rail-play,
html.dark-mode .nra-rail-play,
body.dark .nra-rail-play{background:#347cff;border-color:#347cff;color:#fff}

:root[data-mode="dark"] .nra-rail-btn::after,
:root:not([data-mode="light"]) .nra-rail-btn::after,
html[data-theme="dark"] .nra-rail-btn::after,
html.dark-mode .nra-rail-btn::after,
body.dark .nra-rail-btn::after{
  background:rgba(19,29,44,.98);
  border-color:rgba(117,140,171,.28);
  color:#dfe8f5;
  box-shadow:0 10px 28px rgba(0,0,0,.35);
}

:root[data-mode="dark"] .nra-auto-next,
:root:not([data-mode="light"]) .nra-auto-next{color:#aeb9c9}

html.nra-immersive .header,
html.nra-immersive #header,
html.nra-immersive .site-header,
html.nra-immersive .footer,
html.nra-immersive #footer,
html.nra-immersive .site-footer{display:none!important}

@media(min-width:721px){
  .nra-shell{display:none!important}

  /* Ao tocar em Aa na barra lateral, reaproveita o painel de opções existente. */
  .nra-shell.nra-settings-open{
    display:block!important;
    position:fixed!important;
    right:calc(clamp(18px,3vw,56px) + 88px)!important;
    top:50%!important;
    bottom:auto!important;
    transform:translateY(-50%)!important;
    width:360px!important;
    max-width:calc(100vw - 180px)!important;
    height:auto!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    overflow:visible!important;
  }

  .nra-shell.nra-settings-open > .nra-main,
  .nra-shell.nra-settings-open > .nra-stop,
  .nra-shell.nra-settings-open > .nra-mobile-nav,
  .nra-shell.nra-settings-open > .nra-mobile-speed,
  .nra-shell.nra-settings-open > .nra-settings-toggle,
  .nra-shell.nra-settings-open > .nra-status,
  .nra-shell.nra-settings-open > .nra-collapse{display:none!important}

  .nra-shell.nra-settings-open > .nra-settings{
    display:grid!important;
    position:static!important;
    width:100%!important;
    max-width:none!important;
    grid-template-columns:90px minmax(0,1fr)!important;
    gap:8px!important;
    padding:10px!important;
    border:1px solid #d9e1eb!important;
    border-radius:14px!important;
    background:rgba(255,255,255,.98)!important;
    box-shadow:0 18px 48px rgba(15,23,42,.18)!important;
  }

  .nra-shell.nra-settings-open > .nra-auto-next{display:none!important}

  :root[data-mode="dark"] .nra-shell.nra-settings-open > .nra-settings,
  :root:not([data-mode="light"]) .nra-shell.nra-settings-open > .nra-settings{
    background:rgba(27,38,53,.98)!important;
    border-color:#3b485a!important;
    color:#edf2f8!important;
  }
}

@media(max-width:720px){
  .nra-desktop-rail{display:none!important}

  .nra-mobile-nav,
  .nra-mobile-speed{display:inline-flex}

  .nra-shell{
    left:50%!important;
    right:auto!important;
    bottom:max(10px,env(safe-area-inset-bottom))!important;
    transform:translateX(-50%);
    width:min(414px,calc(100vw - 24px))!important;
    max-width:none!important;
    padding:10px 12px!important;
    border-radius:18px!important;
    gap:8px!important;
  }

  .nra-shell.nra-compact{
    left:50%!important;
    right:auto!important;
    width:auto!important;
    min-width:140px;
    transform:translateX(-50%);
    display:flex!important;
    padding:7px!important;
  }

  .nra-shell.nra-compact .nra-mobile-nav,
  .nra-shell.nra-compact .nra-mobile-speed,
  .nra-shell.nra-compact .nra-auto-next{display:none!important}

  .nra-shell:not(.nra-compact){
    display:grid!important;
    grid-template-columns:56px minmax(0,1fr) 56px 62px!important;
    align-items:center!important;
  }

  .nra-shell:not(.nra-compact) .nra-mobile-prev{grid-column:1}
  .nra-shell:not(.nra-compact) .nra-main{grid-column:2;width:100%!important;min-height:44px!important;font-size:13px!important}
  .nra-shell:not(.nra-compact) .nra-mobile-next{grid-column:3}
  .nra-shell:not(.nra-compact) .nra-mobile-speed{grid-column:4}

  .nra-mobile-nav,
  .nra-mobile-speed{
    height:44px;
    align-items:center;
    justify-content:center;
    border:1px solid #d9e1eb;
    border-radius:12px;
    background:#fff;
    color:#445166;
    font:700 13px/1 inherit;
    cursor:pointer;
  }

  .nra-shell:not(.nra-compact) .nra-stop,
  .nra-shell:not(.nra-compact) .nra-collapse{display:none!important}

  .nra-shell:not(.nra-compact) .nra-settings-toggle{
    display:inline-flex!important;
    grid-column:1 / 2;
    grid-row:2;
    width:44px!important;
    height:32px!important;
    justify-self:center;
    border-radius:10px!important;
    font-size:13px!important;
  }

  .nra-shell:not(.nra-compact) > .nra-auto-next{
    display:flex!important;
    grid-column:2 / 5;
    grid-row:2;
    min-height:32px;
    padding:5px 9px;
    border:1px solid #d9e1eb;
    border-radius:10px;
    background:rgba(255,255,255,.72);
    font-size:9px;
  }

  .nra-shell:not(.nra-compact) .nra-settings{
    grid-column:1 / -1!important;
    grid-row:3!important;
    display:none!important;
    grid-template-columns:105px minmax(0,1fr)!important;
    gap:8px!important;
    padding-top:3px!important;
  }

  .nra-shell:not(.nra-compact).nra-settings-open .nra-settings{display:grid!important}
  .nra-shell:not(.nra-compact) .nra-settings .nra-choose-start{grid-column:1 / -1!important}
  .nra-shell:not(.nra-compact) .nra-status{grid-column:1 / -1!important;grid-row:4!important}

  :root[data-mode="dark"] .nra-mobile-nav,
  :root:not([data-mode="light"]) .nra-mobile-nav,
  :root[data-mode="dark"] .nra-mobile-speed,
  :root:not([data-mode="light"]) .nra-mobile-speed{
    background:#222c3b;
    border-color:#3b485a;
    color:#edf2f8;
  }

  :root[data-mode="dark"] .nra-shell:not(.nra-compact) > .nra-auto-next,
  :root:not([data-mode="light"]) .nra-shell:not(.nra-compact) > .nra-auto-next{
    background:rgba(34,44,59,.72);
    border-color:#3b485a;
  }

  #chapter-content .nra-reading,
  .chapter__content .nra-reading{
    padding:.55em .7em!important;
    margin-left:-.7em!important;
    margin-right:-.7em!important;
  }
}
.nra-mobile-nav[hidden],
.nra-mobile-speed[hidden],
.nra-rail-btn[hidden]{display:none!important}

/* v0.3.1 — painel desktop compacto */
@media(min-width:721px){
  .nra-shell.nra-settings-open > .nra-settings .nra-field{min-width:0!important}
  .nra-shell.nra-settings-open > .nra-settings .nra-field label{font-size:9px!important;margin-bottom:4px!important}
  .nra-shell.nra-settings-open > .nra-settings select{width:100%!important;min-width:0!important;height:34px!important;padding:0 9px!important;font-size:11px!important;text-overflow:ellipsis!important;white-space:nowrap!important;overflow:hidden!important}
  .nra-shell.nra-settings-open > .nra-settings .nra-choose-start{grid-column:1/-1!important;width:100%!important;min-height:36px!important;margin:2px 0 0!important;padding:8px 10px!important;font-size:10px!important}
}

/* v0.3.4 — refinamento visual final alinhado à identidade Novera */
@media(min-width:721px){
  .nra-desktop-rail{
    width:74px;
    padding:12px 9px;
    gap:9px;
    border-radius:18px;
    box-shadow:0 14px 36px rgba(15,23,42,.13);
  }
  .nra-rail-btn{
    width:52px;
    height:52px;
    border-radius:12px;
  }
  .nra-rail-play{
    width:56px;
    height:56px;
    border-radius:50%;
  }
  .nra-rail-separator{width:40px}
  .nra-shell.nra-settings-open > .nra-settings{
    border-radius:12px!important;
    box-shadow:0 14px 36px rgba(15,23,42,.15)!important;
  }
}

/* Novera Reader v0.1.8 — acabamento exclusivo do desktop */
@media (min-width:721px){
  /* Painel ancorado junto à barra vertical. */
  .nra-shell.nra-settings-open > .nra-settings{
    position:fixed!important;
    right:96px!important;
    bottom:92px!important;
    width:350px!important;
    max-width:calc(100vw - 190px)!important;
    grid-template-columns:96px minmax(0,1fr)!important;
    gap:8px!important;
    padding:34px 10px 10px!important;
  }
  .nra-shell.nra-settings-open > .nra-settings::after{display:none!important}

  /* Próximo capítulo automático dentro do painel no desktop. */
  .nra-shell.nra-settings-open > .nra-settings > .nra-auto-next-desktop{
    grid-column:1 / -1!important;
  }
  .nra-shell.nra-settings-open > .nra-auto-next{
    position:fixed!important;
    right:106px!important;
    bottom:142px!important;
    width:330px!important;
    min-height:34px!important;
    z-index:10022!important;
    display:flex!important;
  }

  /* O botão original não fica solto; funciona como X do painel. */
  .nra-shell.nra-settings-open > #nra-settings-toggle{
    position:fixed!important;
    right:106px!important;
    bottom:238px!important;
    width:30px!important;
    height:30px!important;
    z-index:10023!important;
    border-radius:9px!important;
    font-size:17px!important;
  }

  /* A barra vertical permanece com engrenagem; o fechamento é pelo X do painel. */
  .nra-desktop-rail #nra-desktop-type[data-nra-tip=""]::after,
  .nra-desktop-rail #nra-desktop-type[data-nra-tip=""]::before{display:none!important}
}

/* Novera Reader v0.1.9 — painel desktop integrado */
@media (min-width:721px){
  .nra-shell.nra-settings-open > .nra-settings{
    position:fixed!important;
    right:94px!important;
    bottom:92px!important;
    width:390px!important;
    max-width:calc(100vw - 190px)!important;
    display:grid!important;
    grid-template-columns:100px minmax(0,1fr)!important;
    gap:8px!important;
    padding:12px!important;
    border-radius:12px!important;
  }
  .nra-desktop-settings-head{
    grid-column:1/-1;
    display:flex!important;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    min-height:30px;
    margin-bottom:2px;
  }
  .nra-desktop-settings-head strong{font-size:12px;font-weight:800;color:#dbe5f2}
  .nra-desktop-settings-close{
    display:inline-flex!important;
    align-items:center;
    justify-content:center;
    width:30px;
    height:30px;
    padding:0;
    border:1px solid rgba(135,155,185,.28);
    border-radius:8px;
    background:#1b293b;
    color:#dbe5f2;
    font-size:20px;
    line-height:1;
    cursor:pointer;
  }
  .nra-desktop-settings-close:hover{background:#223249}

  .nra-auto-next-desktop{
    grid-column:1/-1;
    min-height:36px;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:10px;
    padding:0 10px;
    border:1px solid rgba(135,155,185,.24);
    border-radius:8px;
    background:#1b293b;
    color:#c0cada;
    font-size:10px;
    font-weight:700;
  }
  .nra-auto-next-desktop input{position:absolute;opacity:0;pointer-events:none}
  .nra-auto-next-desktop .nra-switch{position:relative;width:34px;height:20px;border-radius:999px;background:#708099;transition:.18s}
  .nra-auto-next-desktop .nra-switch::after{content:"";position:absolute;width:16px;height:16px;top:2px;left:2px;border-radius:50%;background:#fff;transition:.18s}
  .nra-auto-next-desktop input:checked + .nra-switch{background:#347cff}
  .nra-auto-next-desktop input:checked + .nra-switch::after{transform:translateX(14px)}

  /* original mobile-only auto-next stays out of the desktop panel */
  .nra-shell > .nra-auto-next{display:none!important}

  /* no floating X/button from the shell on desktop */
  .nra-shell.nra-settings-open > #nra-settings-toggle{display:none!important}

  /* hide any tooltip on settings while open */
  .nra-desktop-rail #nra-desktop-type[data-nra-tip=""]::after,
  .nra-desktop-rail #nra-desktop-type[data-nra-tip=""]::before{display:none!important}
}

@media (max-width:720px){
  .nra-desktop-settings-head,.nra-auto-next-desktop{display:none!important}
}


/* ==========================================================
   Novera Reader v0.1.10 — painel desktop reconstruído
   Mobile permanece intocado.
   ========================================================== */
@media (min-width:721px){
  /* O desktop usa somente a engrenagem da barra lateral. */
  body #novera-read-aloud > #nra-settings-toggle,
  body #novera-read-aloud.nra-settings-open > #nra-settings-toggle{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
  }

  body #novera-read-aloud > #nra-auto-next{
    display:none!important;
  }

  /* Reset completo do popover para evitar herança das versões antigas. */
  body #novera-read-aloud.nra-settings-open > #nra-settings{
    position:fixed!important;
    left:auto!important;
    bottom:auto!important;
    transform:none!important;
    width:430px!important;
    max-width:calc(100vw - 130px)!important;
    height:auto!important;
    min-height:0!important;
    display:grid!important;
    grid-template-columns:110px minmax(0,1fr)!important;
    grid-template-areas:
      "head head"
      "speed voice"
      "auto auto"
      "choose choose"!important;
    align-items:end!important;
    gap:10px!important;
    padding:12px!important;
    margin:0!important;
    overflow:visible!important;
    border:1px solid #3b485a!important;
    border-radius:12px!important;
    background:#182536!important;
    color:#edf2f8!important;
    box-shadow:0 16px 42px rgba(0,0,0,.30)!important;
    z-index:10030!important;
  }

  body #novera-read-aloud.nra-settings-open > #nra-settings::before,
  body #novera-read-aloud.nra-settings-open > #nra-settings::after{
    display:none!important;
    content:none!important;
  }

  body #nra-settings .nra-desktop-settings-head{
    grid-area:head!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    width:100%!important;
    min-width:0!important;
    min-height:34px!important;
    margin:0!important;
    padding:0!important;
    gap:12px!important;
  }

  body #nra-settings .nra-desktop-settings-head strong{
    display:block!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    color:#edf2f8!important;
    font-family:inherit!important;
    font-size:13px!important;
    line-height:1.2!important;
    font-weight:800!important;
    white-space:nowrap!important;
  }

  body #nra-settings #nra-desktop-settings-close{
    position:static!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex:0 0 30px!important;
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    min-height:30px!important;
    margin:0!important;
    padding:0!important;
    border:1px solid #3b4b61!important;
    border-radius:8px!important;
    background:#1d2b3d!important;
    color:#dbe5f2!important;
    box-shadow:none!important;
    font:500 20px/1 inherit!important;
    cursor:pointer!important;
  }
  body #nra-settings #nra-desktop-settings-close:hover{background:#24354a!important}

  body #nra-settings > .nra-speed-wrap{grid-area:speed!important}
  body #nra-settings > .nra-voice-wrap{grid-area:voice!important}

  body #nra-settings > .nra-field{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    min-width:0!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    color:#aeb9c9!important;
  }
  body #nra-settings > .nra-field > span{
    display:block!important;
    margin:0 0 5px!important;
    padding:0!important;
    color:#aeb9c9!important;
    font-size:9px!important;
    line-height:1.2!important;
    font-weight:700!important;
  }
  body #nra-settings > .nra-field select{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:36px!important;
    margin:0!important;
    padding:0 10px!important;
    border:1px solid #3b4b61!important;
    border-radius:8px!important;
    background:#1d2b3d!important;
    color:#edf2f8!important;
    font-size:11px!important;
    line-height:34px!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    overflow:hidden!important;
  }

  body #nra-settings > .nra-auto-next-desktop{
    grid-area:auto!important;
    position:relative!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    width:100%!important;
    min-width:0!important;
    min-height:38px!important;
    margin:0!important;
    padding:0 10px!important;
    border:1px solid #3b4b61!important;
    border-radius:8px!important;
    background:#1d2b3d!important;
    color:#c4cfdd!important;
    font-size:10px!important;
    line-height:1.25!important;
    font-weight:700!important;
  }
  body #nra-settings > .nra-auto-next-desktop > span:first-child{
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  body #nra-settings > .nra-auto-next-desktop input{
    position:absolute!important;
    opacity:0!important;
    pointer-events:none!important;
  }
  body #nra-settings > .nra-auto-next-desktop .nra-switch{
    display:block!important;
    position:relative!important;
    width:34px!important;
    height:20px!important;
    border-radius:999px!important;
    background:#697991!important;
    transition:.18s!important;
  }
  body #nra-settings > .nra-auto-next-desktop .nra-switch::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    width:16px!important;
    height:16px!important;
    top:2px!important;
    left:2px!important;
    border-radius:50%!important;
    background:#fff!important;
    transform:none!important;
    transition:.18s!important;
  }
  body #nra-settings > .nra-auto-next-desktop input:checked + .nra-switch{background:#347cff!important}
  body #nra-settings > .nra-auto-next-desktop input:checked + .nra-switch::after{transform:translateX(14px)!important}

  body #nra-settings > #nra-choose-start{
    grid-area:choose!important;
    position:static!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    width:100%!important;
    min-width:0!important;
    min-height:38px!important;
    margin:0!important;
    padding:8px 12px!important;
    border:1px solid #3b4b61!important;
    border-radius:8px!important;
    background:#1d2b3d!important;
    color:#edf2f8!important;
    font-size:10px!important;
    line-height:1.2!important;
    font-weight:800!important;
  }

  /* Enquanto o painel está aberto, nenhum tooltip da engrenagem/X flutua. */
  body .nra-desktop-rail #nra-desktop-type[data-nra-tip=""]::after,
  body .nra-desktop-rail #nra-desktop-type[data-nra-tip=""]::before{
    display:none!important;
    opacity:0!important;
    content:none!important;
  }
}

/* ==========================================================
   Novera Reader v0.1.11 — correção definitiva do painel desktop
   ========================================================== */
@media (min-width:721px){
  /* Nunca mostrar o botão legado flutuante de configurações no desktop. */
  html body #novera-read-aloud #nra-settings-toggle,
  html body #novera-read-aloud.nra-settings-open #nra-settings-toggle{
    display:none!important; visibility:hidden!important; opacity:0!important;
    width:0!important; height:0!important; min-width:0!important; min-height:0!important;
    padding:0!important; margin:0!important; border:0!important; pointer-events:none!important;
  }

  html body #novera-read-aloud.nra-settings-open > #nra-settings{
    box-sizing:border-box!important;
    width:460px!important;
    max-width:calc(100vw - 150px)!important;
    min-width:420px!important;
    display:grid!important;
    grid-template-columns:112px minmax(0,1fr)!important;
    grid-template-rows:auto auto auto auto!important;
    grid-template-areas:
      "head head"
      "speed voice"
      "auto auto"
      "choose choose"!important;
    align-items:stretch!important;
    gap:10px!important;
    padding:12px!important;
    overflow:hidden!important;
  }

  html body #nra-settings .nra-desktop-settings-head{
    grid-area:head!important;
    position:relative!important;
    box-sizing:border-box!important;
    display:block!important;
    width:100%!important;
    min-width:0!important;
    height:32px!important;
    min-height:32px!important;
    margin:0!important;
    padding:6px 42px 0 0!important;
    overflow:visible!important;
  }
  html body #nra-settings .nra-desktop-settings-head strong{
    display:block!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    font-size:13px!important;
    line-height:20px!important;
    white-space:nowrap!important;
    overflow:visible!important;
  }
  html body #nra-settings #nra-desktop-settings-close{
    position:absolute!important;
    top:0!important;
    right:0!important;
    left:auto!important;
    bottom:auto!important;
    transform:none!important;
    display:flex!important;
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    min-height:30px!important;
    margin:0!important;
    padding:0!important;
    z-index:2!important;
  }

  html body #nra-settings > #nra-speed-wrap{grid-area:speed!important}
  html body #nra-settings > #nra-voice-wrap{grid-area:voice!important}
  html body #nra-settings > #nra-speed-wrap,
  html body #nra-settings > #nra-voice-wrap{
    position:static!important;
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:14px 36px!important;
    gap:4px!important;
    width:100%!important;
    min-width:0!important;
    height:54px!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
  }
  html body #nra-settings > #nra-speed-wrap > span,
  html body #nra-settings > #nra-voice-wrap > span{
    position:static!important;
    display:block!important;
    height:14px!important;
    margin:0!important;
    padding:0!important;
    font-size:9px!important;
    line-height:14px!important;
    white-space:nowrap!important;
  }
  html body #nra-settings > #nra-speed-wrap select,
  html body #nra-settings > #nra-voice-wrap select{
    position:static!important;
    box-sizing:border-box!important;
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:36px!important;
    margin:0!important;
  }

  html body #nra-settings > #nra-auto-next-desktop{
    grid-area:auto!important;
    box-sizing:border-box!important;
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:16px!important;
    width:100%!important;
    min-width:0!important;
    height:40px!important;
    min-height:40px!important;
    margin:0!important;
    padding:0 11px!important;
    overflow:hidden!important;
  }
  html body #nra-settings > #nra-auto-next-desktop > span:first-child{
    display:block!important;
    flex:1 1 auto!important;
    min-width:0!important;
    margin:0!important;
    font-size:10px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  html body #nra-settings > #nra-auto-next-desktop .nra-switch{
    flex:0 0 34px!important;
  }

  html body #nra-settings > #nra-choose-start{
    grid-area:choose!important;
    box-sizing:border-box!important;
    width:100%!important;
    min-width:0!important;
    height:38px!important;
    min-height:38px!important;
    margin:0!important;
  }

  /* Engrenagem da barra continua sendo apenas o acionador, sem tooltip ao abrir. */
  html body #nra-desktop-type[data-nra-tip=""]::before,
  html body #nra-desktop-type[data-nra-tip=""]::after{display:none!important;content:none!important}
}


/* ==========================================================
   Novera Reader v0.1.12 — painel desktop igual ao mobile
   ========================================================== */
@media (min-width:721px){
  html body #novera-read-aloud.nra-settings-open > #nra-settings{
    width:430px!important;
    min-width:390px!important;
    max-width:calc(100vw - 150px)!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:auto auto auto auto!important;
    grid-template-areas:
      "head"
      "voice"
      "auto"
      "choose"!important;
    gap:8px!important;
    padding:12px!important;
    overflow:visible!important;
  }
  html body #nra-settings > #nra-speed-wrap{
    display:none!important;
  }
  html body #nra-settings .nra-desktop-settings-head{
    grid-area:head!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    width:100%!important;
    height:30px!important;
    min-height:30px!important;
    margin:0!important;
    padding:0!important;
  }
  html body #nra-settings .nra-desktop-settings-head strong{
    margin:0!important;
    padding:0!important;
    font-size:12px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
  }
  html body #nra-settings #nra-desktop-settings-close{
    position:static!important;
    transform:none!important;
    width:28px!important;
    height:28px!important;
    min-width:28px!important;
    min-height:28px!important;
    margin:0!important;
    padding:0!important;
    flex:0 0 28px!important;
  }
  html body #nra-settings > #nra-voice-wrap{
    grid-area:voice!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:auto 36px!important;
    gap:5px!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
  }
  html body #nra-settings > #nra-voice-wrap > span{
    height:auto!important;
    margin:0!important;
    padding:0!important;
    font-size:9px!important;
    line-height:1.2!important;
  }
  html body #nra-settings > #nra-voice-wrap select{
    width:100%!important;
    height:36px!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    padding:0 10px!important;
    font-size:10px!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    overflow:hidden!important;
  }
  html body #nra-settings > #nra-auto-next-desktop{
    grid-area:auto!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:10px!important;
    width:100%!important;
    min-width:0!important;
    height:38px!important;
    min-height:38px!important;
    margin:0!important;
    padding:0 10px!important;
    overflow:hidden!important;
  }
  html body #nra-settings > #nra-auto-next-desktop > span:first-child{
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    font-size:9px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  html body #nra-settings > #nra-choose-start{
    grid-area:choose!important;
    width:100%!important;
    height:36px!important;
    min-height:36px!important;
    margin:0!important;
    padding:0 10px!important;
    font-size:9px!important;
  }
}

/* ==========================================================
   Novera Reader v0.1.13 — desktop Read Aloud reconstruído
   O mobile (<=720px) permanece sob o dock unificado.
   ========================================================== */
@media (min-width:721px){
  /* O shell legado vira apenas um host invisível para o painel. */
  html body #novera-read-aloud.nra-shell{
    position:fixed!important;
    inset:0!important;
    width:0!important;
    height:0!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    overflow:visible!important;
    pointer-events:none!important;
  }
  html body #novera-read-aloud > *:not(#nra-settings){display:none!important}

  /* Barra desktop permanece como controle principal. */
  html body #nra-desktop-rail.nra-desktop-rail{
    display:flex!important;
    flex-direction:column!important;
    pointer-events:auto!important;
  }
  html body #nra-desktop-rail[hidden]{display:none!important}

  /* Painel novo: uma coluna, mesma hierarquia visual do mobile. */
  html body #novera-read-aloud:not(.nra-settings-open) > #nra-settings{display:none!important}
  html body #novera-read-aloud.nra-settings-open > #nra-settings{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:8px!important;
    position:fixed!important;
    width:min(420px,calc(100vw - 110px))!important;
    min-width:340px!important;
    max-width:420px!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:12px!important;
    border:1px solid rgba(135,155,185,.26)!important;
    border-radius:12px!important;
    background:#182334!important;
    color:#dce5f3!important;
    box-shadow:0 14px 34px rgba(0,0,0,.25)!important;
    overflow:visible!important;
    pointer-events:auto!important;
    z-index:10020!important;
    align-items:stretch!important;
  }
  html body #nra-settings::before,
  html body #nra-settings::after{display:none!important;content:none!important}

  html body #nra-settings .nra-desktop-settings-head{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:14px!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    grid-column:1!important;
  }
  html body #nra-settings .nra-desktop-settings-head strong{
    display:block!important;
    margin:0!important;
    padding:0!important;
    color:#eef4ff!important;
    font:800 12px/1.25 inherit!important;
    white-space:nowrap!important;
  }
  html body #nra-settings #nra-desktop-settings-close{
    display:inline-flex!important;
    position:static!important;
    flex:0 0 30px!important;
    width:30px!important;
    height:30px!important;
    margin:0!important;
    padding:0!important;
    align-items:center!important;
    justify-content:center!important;
    border:1px solid rgba(135,155,185,.28)!important;
    border-radius:8px!important;
    background:#1d2a3c!important;
    color:#dce5f3!important;
    font:400 20px/1 inherit!important;
    cursor:pointer!important;
  }

  /* Velocidade continua existindo para a lógica, mas no desktop é controlada pela barra 1x/2x. */
  html body #nra-settings > #nra-speed-wrap{display:none!important}

  html body #nra-settings > #nra-voice-wrap{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:5px!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    grid-column:1!important;
  }
  html body #nra-settings > #nra-voice-wrap > span{
    color:#aebbd0!important;
    font:750 9px/1.2 inherit!important;
  }
  html body #nra-settings > #nra-voice-wrap > select{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:38px!important;
    margin:0!important;
    padding:0 10px!important;
    border:1px solid rgba(135,155,185,.28)!important;
    border-radius:8px!important;
    background:#1b293b!important;
    color:#eef4ff!important;
    font:650 10px/1 inherit!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    overflow:hidden!important;
  }

  html body #nra-settings > #nra-auto-next-desktop.nra-auto-next-desktop{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:10px!important;
    width:100%!important;
    min-width:0!important;
    min-height:40px!important;
    margin:0!important;
    padding:0 10px!important;
    border:1px solid rgba(135,155,185,.24)!important;
    border-radius:8px!important;
    background:#1b293b!important;
    grid-column:1!important;
  }
  html body #nra-settings > #nra-auto-next-desktop > span:first-child{
    min-width:0!important;
    color:#c0cada!important;
    font:700 9px/1.2 inherit!important;
    white-space:normal!important;
  }
  html body #nra-settings > #nra-auto-next-desktop input{
    position:absolute!important;
    opacity:0!important;
    pointer-events:none!important;
  }
  html body #nra-settings > #nra-auto-next-desktop .nra-switch{
    display:block!important;
    position:relative!important;
    width:34px!important;
    height:20px!important;
    margin:0!important;
    border-radius:999px!important;
    background:#718096!important;
    flex:0 0 34px!important;
  }
  html body #nra-settings > #nra-auto-next-desktop .nra-switch::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    width:16px!important;
    height:16px!important;
    left:2px!important;
    top:2px!important;
    border-radius:50%!important;
    background:#fff!important;
    transition:transform .18s ease!important;
  }
  html body #nra-settings > #nra-auto-next-desktop input:checked + .nra-switch{background:#347cff!important}
  html body #nra-settings > #nra-auto-next-desktop input:checked + .nra-switch::after{transform:translateX(14px)!important}

  html body #nra-settings > #nra-choose-start.nra-choose-start{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    width:100%!important;
    min-width:0!important;
    min-height:38px!important;
    margin:0!important;
    padding:8px 10px!important;
    border:1px solid rgba(135,155,185,.28)!important;
    border-radius:8px!important;
    background:#1b293b!important;
    color:#eef4ff!important;
    font:750 9px/1.2 inherit!important;
    grid-column:1!important;
    cursor:pointer!important;
  }

  /* Nunca transformar a engrenagem da rail em X; o X pertence ao painel. */
  html body #nra-desktop-type{font-family:inherit!important}

  :root[data-mode="light"] body #novera-read-aloud.nra-settings-open > #nra-settings,
  html[data-theme="light"] body #novera-read-aloud.nra-settings-open > #nra-settings,
  body.light #novera-read-aloud.nra-settings-open > #nra-settings{
    background:#fff!important;color:#1f2b3d!important;border-color:#d5deea!important;box-shadow:0 14px 34px rgba(24,39,75,.15)!important
  }
  :root[data-mode="light"] body #nra-settings > #nra-voice-wrap > select,
  :root[data-mode="light"] body #nra-settings > #nra-auto-next-desktop,
  :root[data-mode="light"] body #nra-settings > #nra-choose-start,
  :root[data-mode="light"] body #nra-settings #nra-desktop-settings-close{
    background:#f5f8fc!important;color:#1f2b3d!important;border-color:#d5deea!important
  }
  :root[data-mode="light"] body #nra-settings .nra-desktop-settings-head strong{color:#1f2b3d!important}
}


/* ==========================================================
   Novera Reader v0.1.17 — painel desktop desacoplado funcional
   ========================================================== */
@media (min-width:721px){
  html body #nra-settings.nra-desktop-detached-settings{
    display:none!important;
    position:fixed!important;
    box-sizing:border-box!important;
    width:410px!important;
    min-width:0!important;
    max-width:calc(100vw - 24px)!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:12px!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:8px!important;
    border:1px solid rgba(135,155,185,.26)!important;
    border-radius:12px!important;
    background:#182334!important;
    color:#dce5f3!important;
    box-shadow:0 14px 34px rgba(0,0,0,.28)!important;
    overflow:visible!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
    z-index:100200!important;
  }

  html body #nra-settings.nra-desktop-detached-settings.nra-desktop-open{
    display:grid!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
  }

  html body #nra-settings.nra-desktop-detached-settings::before,
  html body #nra-settings.nra-desktop-detached-settings::after{
    display:none!important;
    content:none!important;
  }

  html body #nra-settings.nra-desktop-detached-settings > #nra-speed-wrap{
    display:none!important;
  }

  html body #nra-settings.nra-desktop-detached-settings .nra-desktop-settings-head{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
  }

  html body #nra-settings.nra-desktop-detached-settings .nra-desktop-settings-head strong{
    display:block!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    color:#eef4ff!important;
    font:800 12px/1.25 inherit!important;
    white-space:nowrap!important;
  }

  html body #nra-settings.nra-desktop-detached-settings #nra-desktop-settings-close{
    display:inline-flex!important;
    position:static!important;
    align-items:center!important;
    justify-content:center!important;
    flex:0 0 30px!important;
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    min-height:30px!important;
    margin:0!important;
    padding:0!important;
    border:1px solid rgba(135,155,185,.28)!important;
    border-radius:8px!important;
    background:#1d2a3c!important;
    color:#dce5f3!important;
    box-shadow:none!important;
    font:400 20px/1 inherit!important;
    cursor:pointer!important;
  }

  html body #nra-settings.nra-desktop-detached-settings > #nra-voice-wrap{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:5px!important;
    width:100%!important;
    min-width:0!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
  }

  html body #nra-settings.nra-desktop-detached-settings > #nra-voice-wrap > span{
    display:block!important;
    margin:0!important;
    padding:0!important;
    color:#aebbd0!important;
    font:750 9px/1.2 inherit!important;
  }

  html body #nra-settings.nra-desktop-detached-settings > #nra-voice-wrap > select{
    display:block!important;
    box-sizing:border-box!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:38px!important;
    margin:0!important;
    padding:0 10px!important;
    border:1px solid rgba(135,155,185,.28)!important;
    border-radius:8px!important;
    background:#1b293b!important;
    color:#eef4ff!important;
    font:650 10px/1 inherit!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    overflow:hidden!important;
  }

  html body #nra-settings.nra-desktop-detached-settings > #nra-auto-next-desktop{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:10px!important;
    box-sizing:border-box!important;
    width:100%!important;
    min-width:0!important;
    min-height:40px!important;
    margin:0!important;
    padding:0 10px!important;
    border:1px solid rgba(135,155,185,.24)!important;
    border-radius:8px!important;
    background:#1b293b!important;
    color:#c0cada!important;
    font:700 9px/1.2 inherit!important;
  }

  html body #nra-settings.nra-desktop-detached-settings > #nra-auto-next-desktop > span:first-child{
    min-width:0!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body #nra-settings.nra-desktop-detached-settings > #nra-auto-next-desktop input{
    position:absolute!important;
    opacity:0!important;
    pointer-events:none!important;
  }

  html body #nra-settings.nra-desktop-detached-settings > #nra-auto-next-desktop .nra-switch{
    display:block!important;
    position:relative!important;
    width:34px!important;
    height:20px!important;
    flex:0 0 34px!important;
    border-radius:999px!important;
    background:#718096!important;
  }

  html body #nra-settings.nra-desktop-detached-settings > #nra-auto-next-desktop .nra-switch::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    width:16px!important;
    height:16px!important;
    top:2px!important;
    left:2px!important;
    border-radius:50%!important;
    background:#fff!important;
    transform:none!important;
    transition:transform .18s ease!important;
  }

  html body #nra-settings.nra-desktop-detached-settings > #nra-auto-next-desktop input:checked + .nra-switch{
    background:#347cff!important;
  }
  html body #nra-settings.nra-desktop-detached-settings > #nra-auto-next-desktop input:checked + .nra-switch::after{
    transform:translateX(14px)!important;
  }

  html body #nra-settings.nra-desktop-detached-settings > #nra-choose-start{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    box-sizing:border-box!important;
    width:100%!important;
    min-width:0!important;
    min-height:38px!important;
    margin:0!important;
    padding:8px 10px!important;
    border:1px solid rgba(135,155,185,.28)!important;
    border-radius:8px!important;
    background:#1b293b!important;
    color:#eef4ff!important;
    font:750 9px/1.2 inherit!important;
    cursor:pointer!important;
  }

  html body #nra-desktop-type[data-nra-tip=""]::before,
  html body #nra-desktop-type[data-nra-tip=""]::after{
    display:none!important;
    content:none!important;
  }

  :root[data-mode="light"] body #nra-settings.nra-desktop-detached-settings,
  html[data-theme="light"] body #nra-settings.nra-desktop-detached-settings,
  body.light #nra-settings.nra-desktop-detached-settings{
    background:#fff!important;
    color:#1f2b3d!important;
    border-color:#d5deea!important;
    box-shadow:0 14px 34px rgba(24,39,75,.15)!important;
  }
}

/* ==========================================================
   Novera Reader v0.1.18 — painel desktop final em coluna
   Neutraliza definitivamente os grids/posicionamentos legados.
   ========================================================== */
@media (min-width:721px){
  html body #nra-settings.nra-desktop-detached-settings.nra-desktop-open{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:9px!important;
    width:410px!important;
    min-width:0!important;
    max-width:calc(100vw - 24px)!important;
    height:auto!important;
    min-height:0!important;
    padding:12px!important;
    overflow:visible!important;
  }

  /* Remove qualquer área/posição herdada das tentativas anteriores. */
  html body #nra-settings.nra-desktop-detached-settings > *{
    grid-area:auto!important;
    grid-column:auto!important;
    grid-row:auto!important;
    position:static!important;
    inset:auto!important;
    transform:none!important;
    float:none!important;
    clear:none!important;
    margin:0!important;
    box-sizing:border-box!important;
  }

  html body #nra-settings.nra-desktop-detached-settings > #nra-speed-wrap{
    display:none!important;
    order:1!important;
  }

  html body #nra-settings.nra-desktop-detached-settings .nra-desktop-settings-head{
    order:0!important;
    display:flex!important;
    flex:0 0 auto!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    width:100%!important;
    height:30px!important;
    min-height:30px!important;
    padding:0!important;
    overflow:visible!important;
  }
  html body #nra-settings.nra-desktop-detached-settings .nra-desktop-settings-head strong{
    flex:1 1 auto!important;
    min-width:0!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    font-size:12px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  html body #nra-settings.nra-desktop-detached-settings #nra-desktop-settings-close{
    position:static!important;
    order:2!important;
    flex:0 0 30px!important;
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    min-height:30px!important;
    margin:0!important;
    padding:0!important;
  }

  html body #nra-settings.nra-desktop-detached-settings > #nra-voice-wrap{
    order:2!important;
    display:flex!important;
    flex-direction:column!important;
    flex:0 0 auto!important;
    gap:5px!important;
    width:100%!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    overflow:visible!important;
  }
  html body #nra-settings.nra-desktop-detached-settings > #nra-voice-wrap > span{
    display:block!important;
    flex:0 0 auto!important;
    width:100%!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;
    font-size:9px!important;
    line-height:1.2!important;
  }
  html body #nra-settings.nra-desktop-detached-settings > #nra-voice-wrap > select{
    display:block!important;
    position:static!important;
    flex:0 0 38px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:38px!important;
    margin:0!important;
    padding:0 10px!important;
  }

  html body #nra-settings.nra-desktop-detached-settings > #nra-auto-next-desktop{
    order:3!important;
    position:relative!important;
    display:flex!important;
    flex:0 0 40px!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    width:100%!important;
    min-width:0!important;
    height:40px!important;
    min-height:40px!important;
    padding:0 10px!important;
    overflow:hidden!important;
  }
  html body #nra-settings.nra-desktop-detached-settings > #nra-auto-next-desktop > span:first-child{
    display:block!important;
    flex:1 1 auto!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    font-size:9px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  html body #nra-settings.nra-desktop-detached-settings > #nra-auto-next-desktop .nra-switch{
    position:relative!important;
    flex:0 0 34px!important;
    width:34px!important;
    height:20px!important;
    margin:0!important;
  }

  html body #nra-settings.nra-desktop-detached-settings > #nra-choose-start{
    order:4!important;
    display:flex!important;
    flex:0 0 38px!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    min-width:0!important;
    height:38px!important;
    min-height:38px!important;
    margin:0!important;
    padding:8px 10px!important;
    overflow:hidden!important;
  }
}