/* Novera Reader — apresentação do painel original do Fictioneer.
   Somente CSS: preserva IDs, ações Stimulus e armazenamento do tema. */
#formatting-modal.reader-settings .modal__wrapper {
  box-sizing:border-box; width:min(420px, calc(100vw - 24px)); max-width:420px;
  max-height:min(82dvh, 760px); overflow-y:auto; overscroll-behavior:contain;
  padding:20px 18px 18px; border:1px solid #354964; border-radius:18px;
  background:#172235; color:#e8eef9; box-shadow:0 20px 55px rgba(0,0,0,.42);
  scrollbar-width:thin; scrollbar-color:#405773 transparent;
}
#formatting-modal .modal__header {font-size:15px; font-weight:750; letter-spacing:.015em; margin:0 32px 17px 0; color:#f0f4ff;}
#formatting-modal .modal__wrapper>.close {top:15px;right:15px; border-radius:9px; color:#c2cee0;}
#formatting-modal .reader-settings__row {min-height:40px; margin:0 0 9px; gap:9px; align-items:center;}
#formatting-modal .reader-settings__row>i,
#formatting-modal .reader-settings__row>.icon {opacity:.92;}
#formatting-modal .reader-settings__row input[type=range] {min-width:0; height:8px; accent-color:#367cf6; cursor:pointer;}
#formatting-modal .reader-settings__row input[type=number] {min-height:36px; width:55px; border:1px solid #34455d; border-radius:8px; background:#101a2a; color:#e9f0fb; font-variant-numeric:tabular-nums; text-align:center;}
#formatting-modal .reader-settings__row select {min-height:38px; border:1px solid #34455d; border-radius:8px; background-color:#101a2a; color:#e9f0fb;}
#formatting-modal .reader-settings__row button {min-height:36px; border-radius:8px;}
#formatting-modal .reader-settings__toggles {gap:7px; flex-wrap:wrap;}
#formatting-modal :is(button,select,input):focus-visible,
#formatting-modal .reader-settings__toggle:focus-visible {outline:2px solid #78aaff;outline-offset:2px;}
@media (max-width:640px) {
  #formatting-modal.reader-settings .modal__wrapper {width:min(390px, calc(100vw - 20px)); max-height:min(76dvh, 660px); padding:17px 14px 16px; border-radius:16px;}
  #formatting-modal .reader-settings__row {min-height:42px; margin-bottom:10px; gap:7px;}
  #formatting-modal .reader-settings__row input[type=number] {width:52px;}
}
@media (prefers-reduced-motion:reduce) {#formatting-modal * {scroll-behavior:auto!important;transition:none!important;}}