/* Novera Reader — player imersivo v0.3.30 teste 9 (visual nativo Novera) */
.nvr-immersive-toggle{position:fixed;right:18px;bottom:92px;z-index:10035;display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 14px;border:1px solid rgba(130,150,180,.28);border-radius:999px;background:rgba(20,29,42,.94);color:#eef4ff;box-shadow:0 10px 26px rgba(0,0,0,.2);font:inherit;font-size:12px;font-weight:750;cursor:pointer;backdrop-filter:blur(12px)}
.nvr-immersive-hero[hidden]{display:none!important}

/* O modo imersivo vira uma camada real de player. Nada da página empurra o layout. */
html.nvr-immersive-active,html.nvr-immersive-active body{width:100%!important;height:100%!important;overflow:hidden!important;background:#090a10!important}
html.nvr-immersive-active body.novera-chapter{margin:0!important;padding:0!important;overscroll-behavior:none!important}
html.nvr-immersive-active .nvr-immersive-toggle{display:none!important}
html.nvr-immersive-active #nra-desktop-rail,
html.nvr-immersive-active #novera-read-aloud,
html.nvr-immersive-active .tts-interface,
html.nvr-immersive-active .nra-resume-prompt,
html.nvr-immersive-active .progress,
html.nvr-immersive-active .micro-menu{display:none!important}

.nvr-immersive-hero{
  box-sizing:border-box!important;
  position:fixed!important;
  inset:0!important;
  z-index:10050!important;
  width:100vw!important;
  height:100dvh!important;
  min-height:0!important;
  margin:0!important;
  padding:max(14px,env(safe-area-inset-top,0px)) max(22px,env(safe-area-inset-right,0px)) max(18px,env(safe-area-inset-bottom,0px)) max(22px,env(safe-area-inset-left,0px))!important;
  display:grid!important;
  grid-template-rows:38px auto auto minmax(90px,1fr) auto auto auto!important;
  align-items:center!important;
  justify-items:center!important;
  row-gap:8px!important;
  overflow:hidden!important;
  color:#fff!important;
  text-align:center!important;
  isolation:isolate!important;
  background:#171824!important;
}
.nvr-immersive-hero:before{content:"";position:absolute;inset:-56px;z-index:-2;background-image:var(--nvr-immersive-bg,none);background-size:cover;background-position:center 26%;filter:blur(54px) saturate(1.05);opacity:.42;transform:scale(1.16)}
.nvr-immersive-hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(115,105,165,.66) 0%,rgba(48,46,70,.88) 43%,rgba(17,18,28,.97) 76%,rgba(7,8,13,.995) 100%)}

.nvr-immersive-top{width:min(100%,680px)!important;height:38px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;margin:0!important;align-self:start!important}
.nvr-immersive-exit{width:40px!important;height:36px!important;border:0!important;background:transparent!important;color:rgba(255,255,255,.94)!important;font-size:29px!important;line-height:1!important;cursor:pointer!important;padding:0!important}
.nvr-immersive-status{font-size:12px!important;font-weight:700!important;color:rgba(255,255,255,.78)!important;padding:6px 10px!important;border-radius:10px!important;background:rgba(255,255,255,.085)!important;backdrop-filter:blur(10px)!important}

.nvr-immersive-cover{display:block!important;width:auto!important;height:clamp(150px,25dvh,230px)!important;aspect-ratio:2/3!important;object-fit:cover!important;border-radius:10px!important;box-shadow:0 18px 48px rgba(0,0,0,.38)!important;margin:0 auto!important;align-self:center!important}
.nvr-immersive-meta{width:min(100%,520px)!important;margin:0!important;display:flex!important;flex-direction:column!important;gap:4px!important;align-items:center!important}.nvr-immersive-meta strong{font-size:16px!important;line-height:1.3!important;font-weight:500!important;color:rgba(255,255,255,.82)!important}.nvr-immersive-meta>span{font-size:11px!important;color:rgba(255,255,255,.48)!important}

/* A área do trecho cresce/encolhe, mas nunca empurra os controles para fora da tela. */
.nvr-immersive-now{box-sizing:border-box!important;width:min(100%,560px)!important;height:100%!important;min-height:90px!important;margin:0!important;padding:4px 4px!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important}
.nvr-immersive-now p{margin:0!important;width:100%!important;max-width:540px!important;max-height:100%!important;overflow:hidden!important;font-size:clamp(18px,2.1vw,22px)!important;line-height:1.5!important;font-weight:500!important;color:#fff!important;text-align:left!important;text-shadow:0 1px 2px rgba(0,0,0,.22)!important;transition:opacity .18s ease,transform .18s ease,font-size .18s ease!important}
.nvr-immersive-now.is-long p{font-size:clamp(16px,1.8vw,19px)!important;line-height:1.45!important}
.nvr-immersive-now.is-very-long p{font-size:clamp(14px,1.55vw,17px)!important;line-height:1.4!important}
.nvr-immersive-now.is-changing p{opacity:.18!important;transform:translateY(5px)!important}

.nvr-immersive-player{display:flex!important;align-items:center!important;justify-content:center!important;gap:30px!important;margin:0!important;padding:0!important;align-self:end!important}
.nvr-immersive-player button{border:0!important;background:transparent!important;color:#fff!important;cursor:pointer!important}.nvr-immersive-skip{width:48px!important;height:48px!important;font-size:28px!important;opacity:.78!important}.nvr-immersive-play{width:68px!important;height:68px!important;border-radius:50%!important;background:rgba(255,255,255,.96)!important;color:#11131a!important;font-size:27px!important;font-weight:800!important;box-shadow:0 12px 34px rgba(0,0,0,.3)!important}
.nvr-immersive-tools{width:min(100%,390px)!important;display:flex!important;justify-content:space-between!important;align-items:center!important;margin:0!important;padding:0 18px!important}.nvr-immersive-tools button{border:0!important;background:transparent!important;color:rgba(255,255,255,.78)!important;display:flex!important;flex-direction:column!important;gap:4px!important;align-items:center!important;font:inherit!important;cursor:pointer!important}.nvr-immersive-tools span{font-size:21px!important}.nvr-immersive-tools small{font-size:11px!important}
.nvr-immersive-voice{box-sizing:border-box!important;width:min(100%,430px)!important;min-height:64px!important;margin:0!important;padding:10px 16px!important;border:1px solid rgba(255,255,255,.11)!important;border-radius:17px!important;background:rgba(255,255,255,.085)!important;color:#fff!important;display:flex!important;align-items:center!important;justify-content:space-between!important;text-align:left!important;cursor:pointer!important;backdrop-filter:blur(14px)!important}.nvr-immersive-voice span{display:flex!important;flex-direction:column!important;gap:3px!important}.nvr-immersive-voice small{font-size:12px!important;color:rgba(255,255,255,.64)!important}.nvr-immersive-voice strong{font-size:14px!important;font-weight:650!important;max-width:310px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.nvr-immersive-voice b{font-size:25px!important;font-weight:400!important;color:rgba(255,255,255,.58)!important}

/* O capítulo segue disponível ao TTS, porém invisível ao usuário. */
html.nvr-immersive-active body.novera-chapter #chapter-content{position:fixed!important;left:-10000px!important;top:0!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important;margin:0!important;padding:0!important}

/* Configurações mobile precisam aparecer sobre o player quando chamadas por ele. */
html.nvr-immersive-active #nvr-mobile-reader{z-index:10070!important;pointer-events:none!important}
html.nvr-immersive-active #nvr-mobile-reader>.nvr-mobile-dock{display:none!important}
html.nvr-immersive-active #nvr-mobile-reader>.nvr-mobile-settings:not([hidden]){display:block!important;position:fixed!important;left:16px!important;right:16px!important;bottom:max(16px,env(safe-area-inset-bottom,0px))!important;top:auto!important;z-index:10071!important;max-width:520px!important;margin-inline:auto!important;pointer-events:auto!important}

@media(min-width:721px){
  .nvr-immersive-hero{padding-left:max(34px,env(safe-area-inset-left,0px))!important;padding-right:max(34px,env(safe-area-inset-right,0px))!important;grid-template-rows:40px auto auto minmax(100px,1fr) 72px 50px 66px!important;row-gap:10px!important}
  .nvr-immersive-cover{height:clamp(170px,24dvh,230px)!important}
  .nvr-immersive-now{max-height:220px!important}
}

@media(max-width:720px){
  .nvr-immersive-toggle{display:none!important}
  .nvr-immersive-hero{padding:calc(6px + env(safe-area-inset-top,0px)) 20px calc(10px + env(safe-area-inset-bottom,0px))!important;grid-template-rows:34px auto auto minmax(104px,1fr) 66px 48px 64px!important;row-gap:6px!important}
  .nvr-immersive-top{height:34px!important}.nvr-immersive-exit{height:32px!important;width:34px!important;font-size:27px!important}.nvr-immersive-status{font-size:11px!important;padding:5px 9px!important}
  .nvr-immersive-cover{height:clamp(132px,23dvh,190px)!important;border-radius:9px!important}
  .nvr-immersive-meta strong{font-size:15px!important}.nvr-immersive-meta>span{font-size:10px!important}
  .nvr-immersive-now{width:100%!important;min-height:104px!important;padding:2px 0!important}.nvr-immersive-now p{font-size:clamp(17px,4.7vw,20px)!important;line-height:1.48!important}.nvr-immersive-now.is-long p{font-size:clamp(15px,4.1vw,18px)!important;line-height:1.42!important}.nvr-immersive-now.is-very-long p{font-size:clamp(13.5px,3.65vw,16px)!important;line-height:1.36!important}
  .nvr-immersive-player{gap:22px!important}.nvr-immersive-play{width:62px!important;height:62px!important;font-size:25px!important}.nvr-immersive-skip{width:44px!important;height:44px!important;font-size:25px!important}
  .nvr-immersive-tools{width:100%!important;padding:0 24px!important}.nvr-immersive-tools span{font-size:20px!important}.nvr-immersive-tools small{font-size:10px!important}
  .nvr-immersive-voice{width:100%!important;min-height:60px!important;border-radius:16px!important}.nvr-immersive-voice strong{font-size:13px!important;max-width:250px!important}
}

@media(max-width:390px), (max-height:720px){
  .nvr-immersive-hero{grid-template-rows:30px auto auto minmax(82px,1fr) 58px 42px 56px!important;row-gap:4px!important;padding-left:16px!important;padding-right:16px!important}
  .nvr-immersive-cover{height:clamp(112px,20dvh,150px)!important}
  .nvr-immersive-meta strong{font-size:14px!important}.nvr-immersive-meta>span{font-size:9px!important}
  .nvr-immersive-now{min-height:82px!important}.nvr-immersive-now p{font-size:16px!important;line-height:1.42!important}.nvr-immersive-now.is-long p{font-size:14.5px!important;line-height:1.36!important}.nvr-immersive-now.is-very-long p{font-size:12.8px!important;line-height:1.3!important}
  .nvr-immersive-play{width:56px!important;height:56px!important;font-size:23px!important}.nvr-immersive-skip{height:40px!important;width:40px!important;font-size:23px!important}.nvr-immersive-player{gap:15px!important}
  .nvr-immersive-tools span{font-size:18px!important}.nvr-immersive-tools small{font-size:9px!important}
  .nvr-immersive-voice{min-height:54px!important;padding:8px 13px!important}.nvr-immersive-voice small{font-size:10px!important}.nvr-immersive-voice strong{font-size:12px!important}
}


/* v0.3.27 — áreas de toque maiores e botão de velocidade no lugar de Configurações */
.nvr-immersive-exit{
  min-width:52px!important;
  min-height:48px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent!important;
}
.nvr-immersive-player{gap:22px!important}
.nvr-immersive-player button{
  position:relative!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent!important;
}
.nvr-immersive-skip{
  width:64px!important;
  height:64px!important;
  min-width:64px!important;
  min-height:64px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.035)!important;
}
.nvr-immersive-play{
  width:74px!important;
  height:74px!important;
  min-width:74px!important;
  min-height:74px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.nvr-immersive-tools button{
  min-width:112px!important;
  min-height:58px!important;
  padding:7px 12px!important;
  border-radius:15px!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent!important;
}
.nvr-immersive-tools button:active,
.nvr-immersive-skip:active,
.nvr-immersive-play:active,
.nvr-immersive-exit:active{transform:scale(.96)!important}
.nvr-immersive-speed>span{
  min-width:48px!important;
  height:32px!important;
  padding:0 9px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(255,255,255,.16)!important;
  border-radius:10px!important;
  background:rgba(255,255,255,.08)!important;
  font-size:15px!important;
  line-height:1!important;
  font-weight:800!important;
}
.nvr-immersive-speed small{margin-top:1px!important}

@media(max-width:720px){
  .nvr-immersive-player{gap:16px!important}
  .nvr-immersive-skip{width:66px!important;height:66px!important;min-width:66px!important;min-height:66px!important;font-size:28px!important}
  .nvr-immersive-play{width:76px!important;height:76px!important;min-width:76px!important;min-height:76px!important;font-size:28px!important}
  .nvr-immersive-tools{padding:0 6px!important}
  .nvr-immersive-tools button{min-width:128px!important;min-height:60px!important;padding:6px 10px!important}
  .nvr-immersive-exit{margin-left:-8px!important}
}

@media(max-width:390px), (max-height:720px){
  .nvr-immersive-skip{width:58px!important;height:58px!important;min-width:58px!important;min-height:58px!important}
  .nvr-immersive-play{width:66px!important;height:66px!important;min-width:66px!important;min-height:66px!important}
  .nvr-immersive-tools button{min-width:116px!important;min-height:52px!important}
}

/* v0.3.28 — configurações no player + correção de clique desktop */
.nvr-immersive-hero,
.nvr-immersive-hero *{pointer-events:auto}
.nvr-immersive-tools .nvr-immersive-settings-btn>span{font-size:22px!important;line-height:1!important}
.nvr-immersive-settings-panel{
  box-sizing:border-box!important;
  position:fixed!important;
  left:50%!important;
  bottom:max(18px,env(safe-area-inset-bottom,0px))!important;
  transform:translateX(-50%)!important;
  z-index:10080!important;
  width:min(calc(100vw - 32px),430px)!important;
  padding:16px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:18px!important;
  background:rgba(20,21,31,.96)!important;
  color:#fff!important;
  box-shadow:0 24px 70px rgba(0,0,0,.48)!important;
  backdrop-filter:blur(24px)!important;
  text-align:left!important;
}
.nvr-immersive-settings-panel[hidden]{display:none!important}
.nvr-immersive-settings-head{display:flex!important;align-items:center!important;justify-content:space-between!important;margin-bottom:16px!important}
.nvr-immersive-settings-head strong{font-size:15px!important}
.nvr-immersive-settings-head button{width:44px!important;height:44px!important;border:0!important;border-radius:12px!important;background:rgba(255,255,255,.08)!important;color:#fff!important;font-size:25px!important;cursor:pointer!important}
.nvr-immersive-rate-group>span{display:block!important;margin-bottom:9px!important;font-size:12px!important;color:rgba(255,255,255,.66)!important}
.nvr-immersive-rate-options{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:8px!important}
.nvr-immersive-rate-options button{min-height:44px!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:11px!important;background:rgba(255,255,255,.06)!important;color:#fff!important;font-weight:750!important;cursor:pointer!important;touch-action:manipulation!important}
.nvr-immersive-rate-options button.is-active{background:#347cff!important;border-color:#347cff!important}
.nvr-immersive-auto{margin-top:15px!important;min-height:56px!important;padding:0 2px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:14px!important;font-size:14px!important;cursor:pointer!important}
.nvr-immersive-auto input{position:absolute!important;opacity:0!important;pointer-events:none!important}
.nvr-immersive-switch{position:relative!important;flex:0 0 auto!important;width:46px!important;height:26px!important;border-radius:999px!important;background:rgba(255,255,255,.15)!important;transition:.18s ease!important}
.nvr-immersive-switch:after{content:""!important;position:absolute!important;top:3px!important;left:3px!important;width:20px!important;height:20px!important;border-radius:50%!important;background:#fff!important;transition:.18s ease!important}
.nvr-immersive-auto input:checked + .nvr-immersive-switch{background:#347cff!important}
.nvr-immersive-auto input:checked + .nvr-immersive-switch:after{transform:translateX(20px)!important}

/* Os botões precisam ter uma caixa real clicável também no desktop. */
@media(min-width:721px){
  .nvr-immersive-player button,
  .nvr-immersive-tools button,
  .nvr-immersive-exit,
  .nvr-immersive-voice{position:relative!important;z-index:2!important;pointer-events:auto!important}
  .nvr-immersive-player{position:relative!important;z-index:2!important}
  .nvr-immersive-tools{position:relative!important;z-index:2!important}
}

/* v0.3.29 — desktop realmente responsivo + seletor de voz próprio do modo leitor */
.nvr-immersive-voice-panel{
  box-sizing:border-box!important;
  position:fixed!important;
  left:50%!important;
  bottom:max(18px,env(safe-area-inset-bottom,0px))!important;
  transform:translateX(-50%)!important;
  z-index:10082!important;
  width:min(calc(100vw - 32px),520px)!important;
  max-height:min(68dvh,620px)!important;
  padding:16px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:18px!important;
  background:rgba(20,21,31,.97)!important;
  color:#fff!important;
  box-shadow:0 24px 70px rgba(0,0,0,.5)!important;
  backdrop-filter:blur(24px)!important;
  overflow:hidden!important;
}
.nvr-immersive-voice-panel[hidden]{display:none!important}
.nvr-immersive-voice-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin-bottom:12px!important}
.nvr-immersive-voice-head strong{font-size:16px!important}
.nvr-immersive-voice-head button{width:44px!important;height:44px!important;border:0!important;border-radius:12px!important;background:rgba(255,255,255,.08)!important;color:#fff!important;font-size:25px!important;cursor:pointer!important}
.nvr-immersive-voice-options{display:flex!important;flex-direction:column!important;gap:7px!important;max-height:min(52dvh,470px)!important;overflow:auto!important;padding-right:3px!important}
.nvr-immersive-voice-options button{min-height:48px!important;padding:10px 12px!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:11px!important;background:rgba(255,255,255,.055)!important;color:#fff!important;text-align:left!important;font:inherit!important;font-size:13px!important;font-weight:650!important;cursor:pointer!important}
.nvr-immersive-voice-options button.is-active{background:#347cff!important;border-color:#347cff!important}

@media(min-width:721px){
  .nvr-immersive-hero{
    padding:max(18px,env(safe-area-inset-top,0px)) max(36px,env(safe-area-inset-right,0px)) max(22px,env(safe-area-inset-bottom,0px)) max(36px,env(safe-area-inset-left,0px))!important;
    grid-template-rows:42px 196px 48px minmax(150px,210px) 82px 62px 72px!important;
    row-gap:12px!important;
    align-content:center!important;
  }
  .nvr-immersive-top{width:min(100%,980px)!important;position:absolute!important;top:max(18px,env(safe-area-inset-top,0px))!important;left:50%!important;transform:translateX(-50%)!important;padding:0 8px!important}
  .nvr-immersive-cover{height:196px!important;max-height:24dvh!important}
  .nvr-immersive-meta{width:min(100%,680px)!important}
  .nvr-immersive-meta strong{font-size:18px!important}
  .nvr-immersive-meta>span{font-size:12px!important}
  .nvr-immersive-now{width:min(100%,720px)!important;max-height:none!important;min-height:150px!important;padding:8px 16px!important}
  .nvr-immersive-now p{max-width:700px!important;font-size:clamp(20px,1.55vw,25px)!important;line-height:1.46!important}
  .nvr-immersive-now.is-long p{font-size:clamp(18px,1.3vw,22px)!important;line-height:1.42!important}
  .nvr-immersive-now.is-very-long p{font-size:clamp(16px,1.12vw,20px)!important;line-height:1.38!important}
  .nvr-immersive-player{gap:34px!important}
  .nvr-immersive-skip{width:68px!important;height:68px!important;min-width:68px!important;min-height:68px!important;font-size:30px!important}
  .nvr-immersive-play{width:78px!important;height:78px!important;min-width:78px!important;min-height:78px!important;font-size:29px!important}
  .nvr-immersive-tools{width:min(100%,520px)!important;padding:0 30px!important}
  .nvr-immersive-tools button{min-width:150px!important;min-height:58px!important}
  .nvr-immersive-voice{width:min(100%,520px)!important;min-height:66px!important}
}

@media(min-width:1200px) and (min-height:800px){
  .nvr-immersive-hero{grid-template-rows:42px 210px 52px 210px 86px 64px 72px!important;row-gap:14px!important}
  .nvr-immersive-cover{height:210px!important}
}

/* ================================================================
   v0.3.30 teste 9 — acabamento visual nativo Novera
   Mantém a lógica da v0.3.29 e redesenha apenas a apresentação.
   ================================================================ */
:root{
  --nvr-ui-accent:#2f7cf6;
  --nvr-ui-accent-2:#4a90ff;
  --nvr-ui-surface:#0e1b28;
  --nvr-ui-surface-2:#132235;
  --nvr-ui-surface-3:#18283b;
  --nvr-ui-border:rgba(103,143,184,.26);
  --nvr-ui-border-soft:rgba(133,163,197,.16);
  --nvr-ui-text:#f3f6fb;
  --nvr-ui-muted:#9facbd;
}

.nvr-immersive-hero{
  font-family:inherit!important;
  background:#0b111b!important;
}
.nvr-immersive-hero:before{
  filter:blur(70px) saturate(.9)!important;
  opacity:.28!important;
}
.nvr-immersive-hero:after{
  background:
    radial-gradient(circle at 50% 12%,rgba(77,112,164,.20),transparent 34%),
    linear-gradient(180deg,rgba(38,46,70,.68) 0%,rgba(17,28,43,.92) 54%,rgba(8,13,21,.995) 100%)!important;
}

.nvr-immersive-top{z-index:4!important}
.nvr-immersive-exit{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  width:42px!important;height:42px!important;border-radius:12px!important;
  border:1px solid transparent!important;
  color:#dbe6f3!important;font-size:25px!important;
  transition:background .18s ease,border-color .18s ease,transform .12s ease!important;
}
.nvr-immersive-exit:hover{background:rgba(12,27,42,.72)!important;border-color:var(--nvr-ui-border)!important}
.nvr-immersive-status{
  border:1px solid var(--nvr-ui-border-soft)!important;
  border-radius:999px!important;
  background:rgba(17,35,53,.78)!important;
  color:#c5d1df!important;
  box-shadow:0 8px 24px rgba(0,0,0,.12)!important;
}

.nvr-immersive-cover{
  border-radius:12px!important;
  outline:1px solid rgba(140,170,205,.18)!important;
  box-shadow:0 18px 42px rgba(0,0,0,.34)!important;
}
.nvr-immersive-meta strong{color:#f0f4f9!important;font-weight:650!important;letter-spacing:-.01em!important}
.nvr-immersive-meta>span{color:#8fa1b5!important}

.nvr-immersive-now p{
  color:#f5f7fb!important;
  font-weight:500!important;
  text-shadow:none!important;
}

.nvr-immersive-player button{
  transition:transform .12s ease,background .18s ease,border-color .18s ease,opacity .18s ease!important;
}
.nvr-immersive-skip{
  border:1px solid var(--nvr-ui-border-soft)!important;
  border-radius:16px!important;
  background:rgba(18,35,53,.56)!important;
  color:#d7e0ea!important;
  opacity:1!important;
}
.nvr-immersive-skip:hover{background:rgba(25,48,72,.88)!important;border-color:var(--nvr-ui-border)!important}
.nvr-immersive-play{
  border:1px solid rgba(74,144,255,.42)!important;
  background:linear-gradient(180deg,var(--nvr-ui-accent-2),var(--nvr-ui-accent))!important;
  color:#fff!important;
  box-shadow:0 12px 34px rgba(23,90,190,.28)!important;
}
.nvr-immersive-play:hover{filter:brightness(1.06)!important}

.nvr-immersive-tools{
  gap:12px!important;
}
.nvr-immersive-tools button{
  flex:1 1 0!important;
  flex-direction:row!important;
  justify-content:center!important;
  gap:9px!important;
  border:1px solid var(--nvr-ui-border-soft)!important;
  background:rgba(15,31,47,.62)!important;
  color:#cbd7e4!important;
  transition:background .18s ease,border-color .18s ease,transform .12s ease!important;
}
.nvr-immersive-tools button:hover{background:rgba(20,43,65,.9)!important;border-color:var(--nvr-ui-border)!important}
.nvr-immersive-tools span{font-size:17px!important;line-height:1!important}
.nvr-immersive-tools small{font-size:12px!important;font-weight:650!important;color:inherit!important}

.nvr-immersive-voice{
  border:1px solid var(--nvr-ui-border)!important;
  border-radius:14px!important;
  background:linear-gradient(180deg,rgba(18,37,56,.95),rgba(13,28,43,.96))!important;
  box-shadow:0 10px 28px rgba(0,0,0,.15)!important;
  backdrop-filter:blur(14px)!important;
  transition:border-color .18s ease,background .18s ease,transform .12s ease!important;
}
.nvr-immersive-voice:hover{border-color:rgba(69,132,207,.48)!important;background:linear-gradient(180deg,rgba(21,43,65,.98),rgba(15,32,48,.98))!important}
.nvr-immersive-voice small{color:#7f93aa!important;text-transform:uppercase!important;letter-spacing:.08em!important;font-size:10px!important;font-weight:750!important}
.nvr-immersive-voice strong{color:#f2f5f9!important}
.nvr-immersive-voice b{color:#8296ac!important}

/* Modal nativo: mesmo vocabulário visual dos cards, filtros e botões do site. */
.nvr-immersive-settings-panel,
.nvr-immersive-voice-panel{
  border:1px solid var(--nvr-ui-border)!important;
  border-radius:16px!important;
  background:linear-gradient(180deg,rgba(16,32,48,.99),rgba(10,23,35,.995))!important;
  box-shadow:0 28px 90px rgba(0,0,0,.48),0 0 0 100vmax rgba(4,9,15,.50)!important;
  backdrop-filter:blur(22px)!important;
}
.nvr-immersive-settings-head,
.nvr-immersive-voice-head{
  min-height:44px!important;
  margin-bottom:14px!important;
  padding-bottom:12px!important;
  border-bottom:1px solid var(--nvr-ui-border-soft)!important;
}
.nvr-immersive-settings-head strong,
.nvr-immersive-voice-head strong{
  font-size:16px!important;
  font-weight:750!important;
  color:#f3f6fb!important;
  letter-spacing:-.01em!important;
}
.nvr-immersive-settings-head button,
.nvr-immersive-voice-head button{
  width:40px!important;height:40px!important;
  border:1px solid var(--nvr-ui-border-soft)!important;
  border-radius:10px!important;
  background:#142438!important;
  color:#c8d4e0!important;
  font-size:22px!important;
}
.nvr-immersive-settings-head button:hover,
.nvr-immersive-voice-head button:hover{background:#1a3048!important;border-color:var(--nvr-ui-border)!important}

.nvr-immersive-rate-group>span{
  color:#89a0b8!important;
  text-transform:uppercase!important;
  letter-spacing:.09em!important;
  font-size:10px!important;
  font-weight:800!important;
}
.nvr-immersive-rate-options{gap:8px!important}
.nvr-immersive-rate-options button{
  min-height:42px!important;
  border:1px solid var(--nvr-ui-border-soft)!important;
  border-radius:9px!important;
  background:#142337!important;
  color:#dce5ee!important;
  font-size:13px!important;
  font-weight:700!important;
  transition:background .16s ease,border-color .16s ease,transform .12s ease!important;
}
.nvr-immersive-rate-options button:hover{background:#1a3049!important;border-color:var(--nvr-ui-border)!important}
.nvr-immersive-rate-options button.is-active{
  background:var(--nvr-ui-accent)!important;
  border-color:var(--nvr-ui-accent)!important;
  color:#fff!important;
  box-shadow:0 6px 16px rgba(47,124,246,.22)!important;
}
.nvr-immersive-auto{
  margin-top:16px!important;
  padding:12px 2px 0!important;
  border-top:1px solid var(--nvr-ui-border-soft)!important;
  color:#dce5ee!important;
  font-weight:600!important;
}
.nvr-immersive-switch{background:#26384b!important;border:1px solid rgba(139,166,195,.2)!important}
.nvr-immersive-auto input:checked + .nvr-immersive-switch{background:var(--nvr-ui-accent)!important;border-color:var(--nvr-ui-accent)!important}

.nvr-immersive-voice-options{
  gap:6px!important;
  scrollbar-width:thin!important;
  scrollbar-color:#35506c transparent!important;
}
.nvr-immersive-voice-options button{
  position:relative!important;
  min-height:46px!important;
  padding:11px 44px 11px 13px!important;
  border:1px solid var(--nvr-ui-border-soft)!important;
  border-radius:9px!important;
  background:#132237!important;
  color:#dce5ee!important;
  font-size:13px!important;
  font-weight:650!important;
  transition:background .16s ease,border-color .16s ease!important;
}
.nvr-immersive-voice-options button:hover{background:#192e46!important;border-color:var(--nvr-ui-border)!important}
.nvr-immersive-voice-options button.is-active{
  background:rgba(47,124,246,.16)!important;
  border-color:rgba(47,124,246,.78)!important;
  color:#fff!important;
}
.nvr-immersive-voice-options button.is-active:after{
  content:"✓"!important;
  position:absolute!important;right:14px!important;top:50%!important;transform:translateY(-50%)!important;
  width:22px!important;height:22px!important;border-radius:50%!important;
  display:grid!important;place-items:center!important;
  background:var(--nvr-ui-accent)!important;color:#fff!important;font-size:12px!important;font-weight:900!important;
}

@media(min-width:721px){
  /* Desktop deixa de ser uma versão mobile ampliada: composição em duas colunas. */
  .nvr-immersive-hero{
    grid-template-columns:280px minmax(520px,720px)!important;
    grid-template-rows:46px 226px 64px 92px 64px!important;
    grid-template-areas:
      "top top"
      "cover now"
      "meta now"
      "voice player"
      "voice tools"!important;
    column-gap:52px!important;
    row-gap:12px!important;
    justify-content:center!important;
    align-content:center!important;
    padding:30px 46px!important;
  }
  .nvr-immersive-top{
    grid-area:top!important;
    position:static!important;
    width:100%!important;
    max-width:none!important;
    transform:none!important;
    padding:0!important;
    align-self:center!important;
  }
  .nvr-immersive-cover{grid-area:cover!important;height:226px!important;max-height:none!important;align-self:end!important}
  .nvr-immersive-meta{grid-area:meta!important;width:100%!important;align-self:start!important}
  .nvr-immersive-meta strong{font-size:18px!important}
  .nvr-immersive-now{
    grid-area:now!important;
    width:100%!important;
    min-height:0!important;
    height:100%!important;
    max-height:none!important;
    padding:18px 22px!important;
    align-items:center!important;
    border:1px solid var(--nvr-ui-border-soft)!important;
    border-radius:16px!important;
    background:rgba(10,24,38,.34)!important;
  }
  .nvr-immersive-now p{max-width:660px!important;font-size:clamp(19px,1.2vw,23px)!important;line-height:1.48!important}
  .nvr-immersive-now.is-long p{font-size:clamp(17px,1.05vw,20px)!important}
  .nvr-immersive-now.is-very-long p{font-size:clamp(15px,.95vw,18px)!important}
  .nvr-immersive-player{grid-area:player!important;align-self:center!important;gap:18px!important}
  .nvr-immersive-skip{width:58px!important;height:58px!important;min-width:58px!important;min-height:58px!important;font-size:22px!important}
  .nvr-immersive-play{width:72px!important;height:72px!important;min-width:72px!important;min-height:72px!important;font-size:26px!important}
  .nvr-immersive-tools{grid-area:tools!important;width:100%!important;max-width:430px!important;justify-self:center!important;padding:0!important}
  .nvr-immersive-tools button{min-width:0!important;min-height:48px!important;border-radius:12px!important}
  .nvr-immersive-voice{grid-area:voice!important;width:100%!important;min-height:64px!important;align-self:center!important}

  .nvr-immersive-settings-panel,
  .nvr-immersive-voice-panel{
    left:50%!important;top:50%!important;bottom:auto!important;
    transform:translate(-50%,-50%)!important;
  }
  .nvr-immersive-settings-panel{width:min(calc(100vw - 48px),480px)!important;padding:20px!important}
  .nvr-immersive-voice-panel{width:min(calc(100vw - 48px),560px)!important;max-height:min(72dvh,650px)!important;padding:20px!important}
  .nvr-immersive-voice-options{max-height:min(52dvh,480px)!important}
}

@media(min-width:1200px) and (min-height:760px){
  .nvr-immersive-hero{
    grid-template-columns:300px minmax(560px,760px)!important;
    grid-template-rows:48px 244px 66px 96px 66px!important;
    column-gap:58px!important;
  }
  .nvr-immersive-cover{height:244px!important}
}

@media(max-width:720px){
  .nvr-immersive-hero{
    background:#0b111b!important;
    padding:calc(8px + env(safe-area-inset-top,0px)) 18px calc(10px + env(safe-area-inset-bottom,0px))!important;
  }
  .nvr-immersive-top{width:100%!important}
  .nvr-immersive-cover{box-shadow:0 14px 34px rgba(0,0,0,.28)!important}
  .nvr-immersive-now{padding-inline:2px!important}
  .nvr-immersive-player{gap:12px!important}
  .nvr-immersive-skip{width:58px!important;height:58px!important;min-width:58px!important;min-height:58px!important;border-radius:14px!important;font-size:22px!important}
  .nvr-immersive-play{width:70px!important;height:70px!important;min-width:70px!important;min-height:70px!important;font-size:25px!important}
  .nvr-immersive-tools{gap:8px!important;padding:0!important}
  .nvr-immersive-tools button{min-width:0!important;min-height:48px!important;border-radius:12px!important;padding:7px 10px!important}
  .nvr-immersive-tools span{font-size:16px!important}
  .nvr-immersive-tools small{font-size:11px!important}
  .nvr-immersive-voice{min-height:60px!important;border-radius:13px!important;padding:9px 14px!important}

  /* Bottom sheet no mobile, com hierarquia mais próxima de app nativo. */
  .nvr-immersive-settings-panel,
  .nvr-immersive-voice-panel{
    left:10px!important;right:10px!important;bottom:max(10px,env(safe-area-inset-bottom,0px))!important;
    width:auto!important;
    transform:none!important;
    border-radius:18px!important;
    padding:15px!important;
  }
  .nvr-immersive-settings-panel:before,
  .nvr-immersive-voice-panel:before{
    content:""!important;display:block!important;width:38px!important;height:4px!important;margin:-4px auto 10px!important;
    border-radius:999px!important;background:#526a83!important;opacity:.55!important;
  }
  .nvr-immersive-rate-options{grid-template-columns:repeat(4,1fr)!important}
  .nvr-immersive-rate-options button{min-height:43px!important;font-size:13px!important}
  .nvr-immersive-voice-options{max-height:min(56dvh,470px)!important}
}

/* ==========================================================
   v0.3.31-teste10 — polimento fino da UI imersiva
   ========================================================== */

/* Fechar: centralização geométrica real do ícone. */
.nvr-immersive-settings-head button,
.nvr-immersive-voice-head button{
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  line-height:1!important;
  flex:0 0 40px!important;
  overflow:hidden!important;
}
.nvr-immersive-settings-head button svg,
.nvr-immersive-voice-head button svg,
.nvr-immersive-settings-head button i,
.nvr-immersive-voice-head button i{
  display:block!important;
  width:17px!important;
  height:17px!important;
  line-height:1!important;
  margin:0!important;
  transform:none!important;
}

/* Voz: texto nunca invade a seta, e a seta permanece dentro do card. */
.nvr-immersive-voice{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 28px!important;
  align-items:center!important;
  column-gap:10px!important;
  padding-left:16px!important;
  padding-right:12px!important;
  overflow:hidden!important;
}
.nvr-immersive-voice>span{
  min-width:0!important;
  width:100%!important;
  overflow:hidden!important;
}
.nvr-immersive-voice strong{
  display:block!important;
  min-width:0!important;
  width:100%!important;
  max-width:none!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.nvr-immersive-voice>b{
  width:28px!important;
  min-width:28px!important;
  height:32px!important;
  margin:0!important;
  display:grid!important;
  place-items:center!important;
  justify-self:end!important;
  line-height:1!important;
  overflow:hidden!important;
}

/* Velocidade: padding e grade consistentes. */
.nvr-immersive-rate-options{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:8px!important;
}
.nvr-immersive-rate-options button{
  width:100%!important;
  min-width:0!important;
  padding:0 14px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  line-height:1!important;
  white-space:nowrap!important;
}

/* Índice do capítulo do Fictioneer integrado ao visual da Novera. */
html.nvr-immersive-active #fictioneer-chapter-index-dialog{
  width:min(calc(100vw - 32px),620px)!important;
  max-width:620px!important;
  max-height:min(78dvh,720px)!important;
  padding:0!important;
  border:1px solid var(--nvr-ui-border)!important;
  border-radius:16px!important;
  background:linear-gradient(180deg,rgba(16,32,48,.995),rgba(10,23,35,.998))!important;
  color:#eef4fb!important;
  box-shadow:0 28px 90px rgba(0,0,0,.55)!important;
  overflow:hidden!important;
}
html.nvr-immersive-active #fictioneer-chapter-index-dialog::backdrop{
  background:rgba(4,9,15,.72)!important;
  /* Sem blur no backdrop: evita atraso de composição ao abrir o índice. */
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
html.nvr-immersive-active #fictioneer-chapter-index-dialog .dialog-modal__wrapper{
  width:100%!important;
  max-height:min(78dvh,720px)!important;
  padding:20px!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
html.nvr-immersive-active #fictioneer-chapter-index-dialog .dialog-modal__header{
  min-height:44px!important;
  margin:0 0 14px!important;
  padding:0 52px 12px 0!important;
  border-bottom:1px solid var(--nvr-ui-border-soft)!important;
  color:#f3f6fb!important;
  font-size:16px!important;
  font-weight:750!important;
  letter-spacing:-.01em!important;
  text-transform:none!important;
}
html.nvr-immersive-active #fictioneer-chapter-index-dialog .dialog-modal__close{
  position:absolute!important;
  top:14px!important;
  right:14px!important;
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  padding:0!important;
  border:1px solid var(--nvr-ui-border-soft)!important;
  border-radius:10px!important;
  background:#142438!important;
  color:#c8d4e0!important;
  display:grid!important;
  place-items:center!important;
  line-height:1!important;
}
html.nvr-immersive-active #fictioneer-chapter-index-dialog .dialog-modal__close:hover{
  background:#1a3048!important;
  border-color:var(--nvr-ui-border)!important;
}
html.nvr-immersive-active #fictioneer-chapter-index-dialog .dialog-modal__close svg,
html.nvr-immersive-active #fictioneer-chapter-index-dialog .dialog-modal__close i{
  width:17px!important;
  height:17px!important;
  margin:0!important;
  line-height:1!important;
}
html.nvr-immersive-active #fictioneer-chapter-index-dialog .dialog-modal__row._chapter-index{
  margin:0!important;
  padding:0!important;
  background:transparent!important;
}
html.nvr-immersive-active #fictioneer-chapter-index-dialog .chapter-index{
  display:flex!important;
  flex-direction:column!important;
  min-height:0!important;
  color:#dce5ee!important;
}
html.nvr-immersive-active #fictioneer-chapter-index-dialog .chapter-index__control{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin:0 0 12px!important;
}
html.nvr-immersive-active #fictioneer-chapter-index-dialog .chapter-index__back-link,
html.nvr-immersive-active #fictioneer-chapter-index-dialog .chapter-index__order{
  min-height:40px!important;
  padding:0 13px!important;
  border:1px solid var(--nvr-ui-border-soft)!important;
  border-radius:10px!important;
  background:#132237!important;
  color:#cbd8e5!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  text-decoration:none!important;
  box-shadow:none!important;
}
html.nvr-immersive-active #fictioneer-chapter-index-dialog .chapter-index__back-link:hover,
html.nvr-immersive-active #fictioneer-chapter-index-dialog .chapter-index__order:hover{
  background:#192e46!important;
  border-color:var(--nvr-ui-border)!important;
  color:#fff!important;
}
html.nvr-immersive-active #fictioneer-chapter-index-dialog .chapter-index__list{
  max-height:min(58dvh,520px)!important;
  margin:0!important;
  padding:0 3px 0 0!important;
  overflow:auto!important;
  scrollbar-width:thin!important;
  scrollbar-color:#35506c transparent!important;
}
html.nvr-immersive-active #fictioneer-chapter-index-dialog .chapter-index__list li{
  margin:0 0 6px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  list-style:none!important;
}
html.nvr-immersive-active #fictioneer-chapter-index-dialog .chapter-index__list a{
  min-height:44px!important;
  padding:10px 12px!important;
  border:1px solid var(--nvr-ui-border-soft)!important;
  border-radius:9px!important;
  background:#132237!important;
  color:#dce5ee!important;
  display:flex!important;
  align-items:center!important;
  text-decoration:none!important;
  line-height:1.35!important;
}
html.nvr-immersive-active #fictioneer-chapter-index-dialog .chapter-index__list a:hover{
  background:#192e46!important;
  border-color:var(--nvr-ui-border)!important;
  color:#fff!important;
}
html.nvr-immersive-active #fictioneer-chapter-index-dialog .chapter-index__list .current a,
html.nvr-immersive-active #fictioneer-chapter-index-dialog .chapter-index__list [data-id].current a{
  background:rgba(47,124,246,.16)!important;
  border-color:rgba(47,124,246,.78)!important;
  color:#fff!important;
}

@media(max-width:720px){
  .nvr-immersive-voice{padding-left:14px!important;padding-right:10px!important;grid-template-columns:minmax(0,1fr) 26px!important}
  .nvr-immersive-voice>b{width:26px!important;min-width:26px!important}
  .nvr-immersive-rate-options{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .nvr-immersive-rate-options button{padding:0 10px!important}

  html.nvr-immersive-active #fictioneer-chapter-index-dialog{
    width:calc(100vw - 20px)!important;
    max-width:none!important;
    max-height:82dvh!important;
    margin:auto 10px max(10px,env(safe-area-inset-bottom,0px))!important;
    border-radius:18px!important;
  }
  html.nvr-immersive-active #fictioneer-chapter-index-dialog .dialog-modal__wrapper{
    max-height:82dvh!important;
    padding:15px!important;
  }
  html.nvr-immersive-active #fictioneer-chapter-index-dialog .dialog-modal__wrapper:before{
    content:""!important;
    display:block!important;
    width:38px!important;
    height:4px!important;
    margin:-4px auto 10px!important;
    border-radius:999px!important;
    background:#526a83!important;
    opacity:.55!important;
  }
  html.nvr-immersive-active #fictioneer-chapter-index-dialog .dialog-modal__close{top:15px!important;right:15px!important}
  html.nvr-immersive-active #fictioneer-chapter-index-dialog .chapter-index__list{max-height:58dvh!important}
}

/* v0.3.32: integra o Modo leitor à barra lateral nativa no desktop */
@media (min-width:721px){
  .nvr-immersive-toggle{display:none!important}
  #nra-desktop-rail #nvr-immersive-toggle-rail{
    display:flex!important;align-items:center!important;justify-content:center!important;
    font-size:17px!important;line-height:1!important;
  }
  #nra-desktop-rail #nvr-immersive-toggle-rail[aria-pressed="true"]{
    background:#2f7df6!important;color:#fff!important;border-color:#4a8cff!important;
  }
}

/* v0.3.32 produção — centralização óptica do botão de saída */
.nvr-immersive-exit{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  text-align:center!important;
}
.nvr-immersive-exit-icon{
  display:block!important;
  width:1em!important;
  height:1em!important;
  line-height:1em!important;
  text-align:center!important;
  flex:0 0 auto!important;
  transform:translateY(-2px)!important;
  pointer-events:none!important;
}