/* ═══════════════════════════════════════════════════════
   ACCESIBILIDAD — Libreos.app
   Temas: Claro · Oscuro · Libreos (default)
   Cobertura global: index, listas, rutas, fichas,
   recommender, for-you, onboarding, paywall
   ══════════════════════════════════════════════════════= */


/* ═══════════════════════════════════════════════════════
   §1  PANEL UI (overlay, card, controls)
   ══════════════════════════════════════════════════════= */

.a11y-overlay {
  position: fixed; inset: 0; z-index: 9999;
  display: none; align-items: center; justify-content: center;
  background: rgba(0,0,0,.55); backdrop-filter: blur(6px);
}
.a11y-overlay.is-open { display: flex; animation: a11yFadeIn .2s ease }
@keyframes a11yFadeIn { from{opacity:0} to{opacity:1} }

.a11y-panel {
  position: relative; width: min(460px,92vw); max-height: 88vh; overflow-y: auto;
  border-radius: 18px; padding: 28px 24px 22px;
  background: linear-gradient(170deg,rgba(62,39,26,.97),rgba(94,63,41,.95));
  border: 1px solid rgba(212,183,110,.3);
  box-shadow: 0 20px 60px rgba(0,0,0,.45);
  color: #f0e5c4; font-family: 'Cormorant Garamond', serif;
}
.a11y-panel::-webkit-scrollbar { width: 6px }
.a11y-panel::-webkit-scrollbar-thumb { background: rgba(212,183,110,.3); border-radius: 3px }

.a11y-close {
  position: absolute; top: 12px; right: 14px;
  background: none; border: none; color: #f0e5c4;
  font-size: 22px; cursor: pointer; opacity: .7;
  transition: opacity .2s; line-height: 1;
}
.a11y-close:hover { opacity: 1 }

.a11y-title {
  font-size: 22px; font-weight: 700; margin: 0 0 20px;
  color: #ffe5a6; text-shadow: 0 1px 2px rgba(0,0,0,.3);
}

.a11y-section { margin-bottom: 22px }
.a11y-section-title {
  font-size: 15px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .06em; color: #d4b76e; margin: 0 0 10px;
}

/* Theme pills */
.a11y-themes { display: flex; gap: 8px; flex-wrap: wrap }
.a11y-theme-btn {
  flex: 1 1 0; min-width: 100px; padding: 10px 8px; border-radius: 12px;
  border: 2px solid rgba(212,183,110,.25); background: rgba(255,255,255,.06);
  color: #f0e5c4; font-family: inherit; font-size: 14px; font-weight: 600;
  cursor: pointer; text-align: center; transition: all .2s ease;
  display: flex; flex-direction: column; align-items: center; gap: 6px;
}
.a11y-theme-btn:hover { background: rgba(212,183,110,.12); border-color: rgba(212,183,110,.45) }
.a11y-theme-btn.active { background: rgba(212,183,110,.18); border-color: #d4b76e; box-shadow: 0 0 12px rgba(212,183,110,.25) }

.a11y-theme-swatch { width: 36px; height: 36px; border-radius: 50%; border: 2px solid rgba(255,255,255,.2) }
.a11y-theme-swatch--claro   { background: linear-gradient(135deg,#faf4ed,#f3e9dd) }
.a11y-theme-swatch--oscuro  { background: linear-gradient(135deg,#1a1a2e,#16213e) }
.a11y-theme-swatch--libreos { background: linear-gradient(135deg,#7b5234,#caa27a) }

/* Sliders */
.a11y-font-control { display: flex; align-items: center; gap: 12px; margin-bottom: 14px }
.a11y-font-label   { flex: 0 0 110px; font-size: 14px; color: #e8d9c5 }
.a11y-slider-wrap   { flex: 1; display: flex; align-items: center; gap: 10px }

.a11y-slider {
  -webkit-appearance: none; appearance: none; flex: 1; height: 6px;
  border-radius: 3px; background: rgba(212,183,110,.2); outline: none;
}
.a11y-slider::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none; width: 20px; height: 20px;
  border-radius: 50%; background: linear-gradient(145deg,#d4b76e,#b58963);
  border: 2px solid rgba(255,255,255,.3); cursor: pointer;
  box-shadow: 0 2px 6px rgba(0,0,0,.3);
}
.a11y-slider::-moz-range-thumb {
  width: 20px; height: 20px; border-radius: 50%;
  background: linear-gradient(145deg,#d4b76e,#b58963);
  border: 2px solid rgba(255,255,255,.3); cursor: pointer;
  box-shadow: 0 2px 6px rgba(0,0,0,.3);
}
.a11y-slider-value {
  min-width: 38px; text-align: center; font-size: 13px; font-weight: 600;
  color: #d4b76e; background: rgba(0,0,0,.2); padding: 3px 6px; border-radius: 6px;
}

/* Color picker */
.a11y-color-options { display: flex; flex-wrap: wrap; gap: 8px; flex: 1 }
.a11y-color-btn {
  width: 32px; height: 32px; border-radius: 50%;
  border: 2px solid rgba(212,183,110,.2); background: none;
  cursor: pointer; padding: 0; display: flex; align-items: center;
  justify-content: center; transition: all .2s ease; position: relative;
}
.a11y-color-btn:hover { border-color: rgba(212,183,110,.6); transform: scale(1.1) }
.a11y-color-btn.active { border-color: #d4b76e; box-shadow: 0 0 8px rgba(212,183,110,.4) }
.a11y-color-dot { width: 22px; height: 22px; border-radius: 50% }
.a11y-color-dot--default {
  background: conic-gradient(#1c140f 0deg 60deg,#f0e5c4 60deg 120deg,#b58963 120deg 180deg,
    #3e271a 180deg 240deg,#ffe5a6 240deg 300deg,#7b5234 300deg 360deg);
}
.a11y-color-btn--custom { overflow: hidden; color: #d4b76e }
.a11y-color-picker {
  position: absolute; inset: 0; width: 100%; height: 100%;
  opacity: 0; cursor: pointer; border: none; padding: 0;
}

/* Preview */
.a11y-preview {
  padding: 14px 16px; border-radius: 12px;
  background: rgba(0,0,0,.15); border: 1px solid rgba(212,183,110,.15); margin-top: 6px;
}
.a11y-preview-text { margin: 0; line-height: 1.5; color: #f0e5c4 }

/* Reset */
.a11y-reset {
  display: inline-flex; align-items: center; gap: 6px; margin-top: 8px;
  padding: 8px 16px; border-radius: 10px;
  border: 1px solid rgba(212,183,110,.3); background: rgba(255,255,255,.06);
  color: #f0e5c4; font-family: inherit; font-size: 13px;
  cursor: pointer; transition: all .2s ease;
}
.a11y-reset:hover { background: rgba(212,183,110,.12); border-color: rgba(212,183,110,.45) }

/* FAB for listas/libro pages */
.a11y-fab {
  position: fixed; bottom: 20px; left: 20px; z-index: 9990;
  width: 44px; height: 44px; border-radius: 50%;
  border: 1px solid rgba(212,183,110,.35);
  background: linear-gradient(145deg,rgba(62,39,26,.92),rgba(94,63,41,.9));
  backdrop-filter: blur(8px); color: #f0e5c4; cursor: pointer;
  box-shadow: 0 4px 14px rgba(0,0,0,.3);
  display: flex; align-items: center; justify-content: center;
  transition: all .2s ease;
}
.a11y-fab:hover { transform: scale(1.08); box-shadow: 0 6px 20px rgba(0,0,0,.4) }
.a11y-fab svg  { width: 22px; height: 22px }


/* ═══════════════════════════════════════════════════════
   §2  FONT COLOR OVERRIDE
   ══════════════════════════════════════════════════════= */

html.a11y-color-active { --_a11y-color: var(--a11y-font-color, inherit) }

html.a11y-color-active body,
html.a11y-color-active body p,
html.a11y-color-active body span,
html.a11y-color-active body a,
html.a11y-color-active body button,
html.a11y-color-active body li,
html.a11y-color-active body input,
html.a11y-color-active body label,
html.a11y-color-active body h1,
html.a11y-color-active body h2,
html.a11y-color-active body h3,
html.a11y-color-active body h4,
html.a11y-color-active body td,
html.a11y-color-active body th,
html.a11y-color-active body div { color: var(--_a11y-color) !important }

html.a11y-color-active .book-title,
html.a11y-color-active .lista-title,
html.a11y-color-active .lista-libro-titulo,
html.a11y-color-active .ruta-paso-titulo,
html.a11y-color-active .related-card .book-section-title,
html.a11y-color-active .book-extra.highlight-block .book-section-title,
html.a11y-color-active .ft-minimal .credit a {
  background: none !important; -webkit-background-clip: unset !important;
  background-clip: unset !important; -webkit-text-fill-color: var(--_a11y-color) !important;
  color: var(--_a11y-color) !important;
}


/* ═══════════════════════════════════════════════════════
   §3  FONT SIZE / WEIGHT OVERRIDES
   ══════════════════════════════════════════════════════= */

html.a11y-font-active  { --_a11y-size: var(--a11y-font-size, 16px) }
html.a11y-weight-active { --_a11y-weight: var(--a11y-font-weight, 400) }

html.a11y-font-active body { font-size: var(--_a11y-size) }

/* Headings */
html.a11y-font-active h1 { font-size: calc(var(--_a11y-size)*2.2) !important }
html.a11y-font-active h2 { font-size: calc(var(--_a11y-size)*1.8) !important }
html.a11y-font-active h3 { font-size: calc(var(--_a11y-size)*1.4) !important }
html.a11y-font-active h4 { font-size: calc(var(--_a11y-size)*1.2) !important }

/* Index */
html.a11y-font-active .brand { font-size: calc(var(--_a11y-size)*1.75) !important }
html.a11y-font-active .modal-title { font-size: calc(var(--_a11y-size)*1.4) !important }
html.a11y-font-active .book-card .title { font-size: calc(var(--_a11y-size)*1.05) !important }
html.a11y-font-active .book-card .author { font-size: calc(var(--_a11y-size)*0.88) !important }
html.a11y-font-active .tabs button { font-size: calc(var(--_a11y-size)*0.88) !important }

/* Listas */
html.a11y-font-active .lista-title { font-size: calc(var(--_a11y-size)*2.4) !important }
html.a11y-font-active .lista-subtitle { font-size: calc(var(--_a11y-size)*1.15) !important }
html.a11y-font-active .lista-intro { font-size: calc(var(--_a11y-size)*1.1) !important }
html.a11y-font-active .lista-libro-titulo { font-size: calc(var(--_a11y-size)*1.5) !important }
html.a11y-font-active .lista-libro-autor { font-size: var(--_a11y-size) !important }
html.a11y-font-active .lista-desc { font-size: calc(var(--_a11y-size)*1.1) !important }
html.a11y-font-active .lista-meta span { font-size: calc(var(--_a11y-size)*0.92) !important }
html.a11y-font-active .lista-btn { font-size: calc(var(--_a11y-size)*0.92) !important }

/* Rutas */
html.a11y-font-active .ruta-paso-titulo { font-size: calc(var(--_a11y-size)*1.5) !important }
html.a11y-font-active .ruta-paso-autor { font-size: var(--_a11y-size) !important }
html.a11y-font-active .ruta-paso-desc { font-size: calc(var(--_a11y-size)*1.1) !important }
html.a11y-font-active .ruta-porqué-texto { font-size: calc(var(--_a11y-size)*0.95) !important }

/* Libro */
html.a11y-font-active .book-title { font-size: calc(var(--_a11y-size)*2) !important }
html.a11y-font-active .book-author { font-size: calc(var(--_a11y-size)*1.1) !important }
html.a11y-font-active .book-info { font-size: var(--_a11y-size) !important }
html.a11y-font-active .book-section-title { font-size: calc(var(--_a11y-size)*1.3) !important }
html.a11y-font-active .long-explain { font-size: var(--_a11y-size) !important }
html.a11y-font-active .meta-pill { font-size: calc(var(--_a11y-size)*0.88) !important }

/* Recommender */
html.a11y-font-active .rec-title { font-size: calc(var(--_a11y-size)*1.6) !important }
html.a11y-font-active .rec-subtitle { font-size: var(--_a11y-size) !important }
html.a11y-font-active .rec-chip { font-size: calc(var(--_a11y-size)*0.92) !important }
html.a11y-font-active .rec-card-title { font-size: calc(var(--_a11y-size)*0.92) !important }
html.a11y-font-active .rec-card-author { font-size: calc(var(--_a11y-size)*0.82) !important }

/* For-you */
html.a11y-font-active .fy-section-title { font-size: calc(var(--_a11y-size)*1.5) !important }
html.a11y-font-active .fy-book-title { font-size: calc(var(--_a11y-size)*0.92) !important }
html.a11y-font-active .fy-book-author { font-size: calc(var(--_a11y-size)*0.82) !important }
html.a11y-font-active .fy-lista-title { font-size: var(--_a11y-size) !important }

/* Generic */
html.a11y-font-active p,
html.a11y-font-active span:not(.a11y-slider-value):not(.a11y-color-dot):not(.a11y-theme-swatch),
html.a11y-font-active a,
html.a11y-font-active button:not(.a11y-theme-btn):not(.a11y-color-btn):not(.a11y-close):not(.a11y-reset),
html.a11y-font-active input, html.a11y-font-active label,
html.a11y-font-active li { font-size: var(--_a11y-size) !important }

/* Weight */
html.a11y-weight-active body,
html.a11y-weight-active body p, html.a11y-weight-active body span,
html.a11y-weight-active body a, html.a11y-weight-active body button,
html.a11y-weight-active body li, html.a11y-weight-active body input,
html.a11y-weight-active body label, html.a11y-weight-active body h1,
html.a11y-weight-active body h2, html.a11y-weight-active body h3,
html.a11y-weight-active body h4, html.a11y-weight-active body div {
  font-weight: var(--_a11y-weight) !important;
}


/* ═══════════════════════════════════════════════════════
   §4  MODO CLARO
   Paleta: cremas cálidos, marrones suaves, fondo luminoso
   Brand: conserva los dorados y marrones Libreos
   ══════════════════════════════════════════════════════= */

/* ── 4.1 Body / background ── */
html[data-theme="claro"] body,
html[data-theme="claro"] .libro-body {
  background:
    radial-gradient(1200px 600px at 10% -10%, rgba(255,255,255,.3), transparent 60%),
    radial-gradient(1000px 500px at 100% 10%, rgba(255,255,255,.18), transparent 65%),
    linear-gradient(135deg, #faf4ed 0%, #f3e9dd 30%, #ede0cd 55%, #f3e9dd 80%, #faf4ed 100%) !important;
  background-attachment: fixed !important;
  color: #3e271a !important;
}

/* ── 4.2 Header (index) ── */
html[data-theme="claro"] header {
  background: rgba(250,244,237,.88) !important;
  backdrop-filter: blur(10px) saturate(120%) !important;
  border-bottom: 1px solid rgba(181,137,99,.2) !important;
}
html[data-theme="claro"] .brand { color: #5e3f29 !important; text-shadow: none !important }
html[data-theme="claro"] .backdrop { background: rgba(255,255,255,.08) !important }

/* ── 4.3 Header lite (listas / libro / rutas) ── */
html[data-theme="claro"] .header-lite {
  background: rgba(250,244,237,.92) !important;
  border-bottom: 1px solid rgba(181,137,99,.15) !important;
}
html[data-theme="claro"] .hl-menu {
  background: rgba(255,252,248,.97) !important;
  border-color: rgba(181,137,99,.18) !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.1) !important;
}
html[data-theme="claro"] .hl-menu-item { color: #3e271a !important }
html[data-theme="claro"] .hl-menu-item:hover { background: rgba(181,137,99,.1) !important }
html[data-theme="claro"] .hl-login-btn {
  background: #fff !important; border-color: rgba(181,137,99,.25) !important; color: #5e3f29 !important;
}

/* ── 4.4 Tabs ── */
html[data-theme="claro"] .tabs button {
  border-color: rgba(181,137,99,.22); background: rgba(255,255,255,.55); color: #5e3f29;
}
html[data-theme="claro"] .tabs button:hover { background: rgba(255,255,255,.75) }
html[data-theme="claro"] .tabs button.active { background: #7b5234; color: #fff; border-color: #7b5234 }

/* ── 4.5 Search input ── */
html[data-theme="claro"] .input input {
  background: rgba(255,255,255,.7) !important; color: #3e271a !important;
  border-color: rgba(181,137,99,.25) !important;
}

/* ── 4.6 User menu ── */
html[data-theme="claro"] .user-card,
html[data-theme="claro"] .user-card-inner {
  background: linear-gradient(145deg,#d9c2a6,#e8d9c5) !important; color: #3e271a !important;
}
html[data-theme="claro"] .user-menu {
  background: rgba(255,252,248,.97) !important; border-color: rgba(181,137,99,.2) !important;
}
html[data-theme="claro"] .user-menu-item { color: #3e271a !important }
html[data-theme="claro"] .user-menu-item:hover { background: rgba(181,137,99,.1) !important; color: #1c140f !important }
html[data-theme="claro"] .user-menu-item.logout { color: #b91c1c !important }
html[data-theme="claro"] #userName { color: #3e271a !important }

/* ── 4.7 Book cards (index grid) ── */
html[data-theme="claro"] .book-card { background: rgba(255,255,255,.65) !important; border-color: rgba(181,137,99,.15) !important }
html[data-theme="claro"] .book-card .title { color: #3e271a !important }
html[data-theme="claro"] .book-card .author { color: #7b5234 !important }

/* ── 4.8 Classic frame ── */
html[data-theme="claro"] .classic-frame {
  background: linear-gradient(180deg,rgba(255,255,255,.55),rgba(250,244,237,.4)) !important;
  border-color: rgba(181,137,99,.2) !important;
}

/* ── 4.9 Result cards ── */
html[data-theme="claro"] .result-card {
  background: linear-gradient(180deg,#fff,#faf4ed) !important;
  border-color: rgba(181,137,99,.15) !important;
}

/* ── 4.10 Modals (generic) ── */
html[data-theme="claro"] .modal-overlay { background: rgba(0,0,0,.35) !important }
html[data-theme="claro"] .modal {
  background: #fff !important; border-color: rgba(181,137,99,.2) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.15) !important;
}
html[data-theme="claro"] .modal-close {
  background: rgba(0,0,0,.04) !important; border-color: rgba(181,137,99,.2) !important;
}
html[data-theme="claro"] .modal input[type="number"],
html[data-theme="claro"] .modal select {
  background: #fff !important; border-color: rgba(181,137,99,.2) !important; color: #3e271a !important;
}
html[data-theme="claro"] .modal-overlay .modal-content,
html[data-theme="claro"] .lib-modal {
  background: linear-gradient(180deg,rgba(255,255,255,.98),rgba(250,244,237,.95)) !important;
  color: #3e271a !important;
}
html[data-theme="claro"] .modal-title { color: #3e271a !important }

/* ── 4.11 Listas page ── */
html[data-theme="claro"] .lista-title {
  background: linear-gradient(180deg,#5e3f29,#996b47,#5e3f29) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  color: transparent !important;
}
html[data-theme="claro"] .lista-subtitle { color: #7b5234 !important }
html[data-theme="claro"] .lista-intro { color: #5e3f29 !important }
html[data-theme="claro"] .lista-meta-total { color: #7b5234 !important }
html[data-theme="claro"] .lista-libro-inner {
  background: rgba(255,255,255,.78) !important;
  border-color: rgba(181,137,99,.15) !important;
  border-left-color: rgba(181,137,99,.5) !important;
}
html[data-theme="claro"] .lista-libro-titulo {
  background: linear-gradient(180deg,#5e3f29,#996b47,#5e3f29) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  color: transparent !important;
}
html[data-theme="claro"] .lista-libro-autor { color: #996b47 !important }
html[data-theme="claro"] .lista-desc { color: #5e3f29 !important }
html[data-theme="claro"] .lista-meta span {
  background: rgba(255,255,255,.7) !important; border-color: rgba(181,137,99,.18) !important;
  color: #7b5234 !important;
}
html[data-theme="claro"] .lista-tipo-badge {
  background: linear-gradient(135deg,#d9c2a6,#c9a983) !important;
  color: #3e271a !important; border-color: rgba(181,137,99,.3) !important;
}
html[data-theme="claro"] .lista-btn {
  background: linear-gradient(135deg,#d9c2a6,#c9a983) !important;
  color: #3e271a !important; border-color: rgba(181,137,99,.3) !important;
}
html[data-theme="claro"] .lista-libro::before {
  background: linear-gradient(135deg,#d9c2a6,#c9a983) !important; color: #3e271a !important;
}
html[data-theme="claro"] .lista-divider { color: rgba(181,137,99,.5) !important }
html[data-theme="claro"] .lista-divider::before,
html[data-theme="claro"] .lista-divider::after { background: linear-gradient(90deg,transparent,rgba(181,137,99,.4),transparent) !important }
html[data-theme="claro"] .lista-meta-item {
  background: rgba(255,255,255,.7) !important; border-color: rgba(181,137,99,.18) !important;
}

/* ── 4.12 Rutas page ── */
html[data-theme="claro"] .ruta-paso-card {
  background: linear-gradient(145deg,#fff8f0,#f5ead8,#eee0cc) !important;
  border-color: rgba(181,137,99,.18) !important;
}
html[data-theme="claro"] .ruta-paso-card::after { border-right-color: #fff8f0 !important }
html[data-theme="claro"] .ruta-paso-titulo {
  background: linear-gradient(180deg,#5e3f29,#996b47,#5e3f29) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  color: transparent !important;
}
html[data-theme="claro"] .ruta-paso-autor { color: #996b47 !important }
html[data-theme="claro"] .ruta-paso-desc { color: #5e3f29 !important }
html[data-theme="claro"] .ruta-porqué {
  background: linear-gradient(135deg,rgba(201,168,100,.1),rgba(201,168,100,.05)) !important;
  border-color: rgba(181,137,99,.18) !important; border-left-color: rgba(181,137,99,.45) !important;
}
html[data-theme="claro"] .ruta-porqué-texto { color: #5e3f29 !important }
html[data-theme="claro"] .ruta-porqué-label { color: #996b47 !important }
html[data-theme="claro"] .ruta-etiqueta {
  background: rgba(255,255,255,.7) !important; border-color: rgba(181,137,99,.22) !important;
  color: #7b5234 !important;
}
html[data-theme="claro"] .ruta-paso-meta span {
  background: rgba(255,255,255,.7) !important; border-color: rgba(181,137,99,.18) !important;
  color: #7b5234 !important;
}
html[data-theme="claro"] .ruta-meta-total { color: #7b5234 !important }
html[data-theme="claro"] .ruta-tipo-badge {
  background: linear-gradient(135deg,#d9c2a6,#c9a983) !important; color: #3e271a !important;
}
html[data-theme="claro"] .ruta-paso-numero {
  background: linear-gradient(135deg,#d9c2a6,#c9a983) !important; color: #3e271a !important;
}
html[data-theme="claro"] .ruta-paso:last-child .ruta-paso-card {
  background: linear-gradient(145deg,#fff4e0,#f0debb,#e8d2a5) !important;
}
html[data-theme="claro"] .ruta-paso:last-child .ruta-paso-card::after { border-right-color: #fff4e0 !important }
html[data-theme="claro"] .ruta-paso:last-child .ruta-paso-numero {
  background: linear-gradient(135deg,#c9a864,#a07830) !important;
}
html[data-theme="claro"] .ruta-timeline::before {
  background: linear-gradient(180deg,rgba(181,137,99,.6),rgba(181,137,99,.1)) !important;
}
html[data-theme="claro"] .ruta-paso-card .lista-btn {
  background: linear-gradient(135deg,#c9a983,#b58963) !important; color: #fff !important;
}
html[data-theme="claro"] .ruta-arc-dot {
  background: linear-gradient(135deg,#d9c2a6,#c9a983) !important;
}
html[data-theme="claro"] .ruta-arc-line { background: linear-gradient(90deg,rgba(181,137,99,.4),rgba(181,137,99,.15)) !important }

/* ── 4.13 Libro / ficha page ── */
html[data-theme="claro"] .book-shell {
  background: #fff8f0 !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.1),0 0 0 1px rgba(181,137,99,.15) !important;
}
html[data-theme="claro"] .book-title {
  background: linear-gradient(180deg,#5e3f29,#996b47 40%,#5e3f29) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  color: transparent !important;
}
html[data-theme="claro"] .book-author { color: #7b5234 !important }
html[data-theme="claro"] .book-tagline { color: rgba(94,63,41,.6) !important }
html[data-theme="claro"] .book-info { color: #5e3f29 !important }
html[data-theme="claro"] .book-section-title { color: #3e271a !important }
html[data-theme="claro"] .long-explain { color: #5e3f29 !important }
html[data-theme="claro"] .meta-pill {
  background: rgba(255,255,255,.65) !important; border-color: rgba(181,137,99,.3) !important;
  color: #7b5234 !important;
}
html[data-theme="claro"] .book-btn-primary {
  background: linear-gradient(135deg,#c9a983,#b58963) !important; color: #fff !important;
}
html[data-theme="claro"] .book-btn-ghost {
  border-color: rgba(181,137,99,.4) !important; color: #5e3f29 !important; background: rgba(255,255,255,.5) !important;
}
html[data-theme="claro"] .book-btn-ghost:hover { background: rgba(255,255,255,.8) !important }
html[data-theme="claro"] .related-card {
  background: linear-gradient(180deg,#fff8f0,#f0e5d5) !important;
  border-color: rgba(181,137,99,.18) !important;
}
html[data-theme="claro"] .related-card .book-section-title {
  background: linear-gradient(180deg,#5e3f29,#996b47) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  color: transparent !important;
}
html[data-theme="claro"] .related-pill {
  background: rgba(255,255,255,.7) !important; border-color: rgba(181,137,99,.25) !important; color: #5e3f29 !important;
}
html[data-theme="claro"] .book-extra { border-top-color: rgba(181,137,99,.18) !important }
html[data-theme="claro"] .book-extra.highlight-block .book-section-title {
  background: linear-gradient(180deg,#5e3f29,#b58963) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  color: transparent !important;
}
html[data-theme="claro"] .book-cover {
  background: radial-gradient(circle at top,#fff 0,#f3e9dd 80%) !important;
}
html[data-theme="claro"] .book-bullets li::marker { color: #b58963 !important }

/* ── 4.14 Recommender ── */
html[data-theme="claro"] .rec-section::before { background: rgba(0,0,0,.02) !important }
html[data-theme="claro"] .rec-title { color: #3e271a !important }
html[data-theme="claro"] .rec-subtitle { color: #7b5234 !important }
html[data-theme="claro"] .rec-ornament { color: #b58963 !important }
html[data-theme="claro"] .rec-chip {
  color: #5e3f29 !important; background: rgba(255,255,255,.5) !important;
  border-color: rgba(181,137,99,.22) !important;
}
html[data-theme="claro"] .rec-chip:hover { background: rgba(255,255,255,.7) !important; color: #3e271a !important }
html[data-theme="claro"] .rec-chip.active {
  background: linear-gradient(145deg,#c9a983,#b58963) !important; color: #fff !important;
  border-color: transparent !important;
}
html[data-theme="claro"] .rec-card {
  background: rgba(255,255,255,.8) !important; border-color: rgba(181,137,99,.15) !important;
  backdrop-filter: blur(6px) !important;
}
html[data-theme="claro"] .rec-card-title { color: #3e271a !important }
html[data-theme="claro"] .rec-card-author { color: #7b5234 !important }
html[data-theme="claro"] .rec-card-why { color: #996b47 !important }
html[data-theme="claro"] .rec-card-cover { background: linear-gradient(145deg,#f3e9dd,#e8d9c5) !important }
html[data-theme="claro"] .rec-cover-fake-title { color: #3e271a !important }
html[data-theme="claro"] .rec-cover-fake-author { color: #7b5234 !important }
html[data-theme="claro"] .rec-card-icon-wrap { background: linear-gradient(145deg,#7b5234,#5e3f29) !important }
html[data-theme="claro"] .rec-card-icon-title { color: #faf4ed !important }
html[data-theme="claro"] .rec-card-icon-subtitle { color: #d9c2a6 !important }
html[data-theme="claro"] .rec-more-btn {
  color: #7b5234 !important; border-color: rgba(181,137,99,.25) !important;
}
html[data-theme="claro"] .rec-more-btn:hover { background: rgba(181,137,99,.08) !important }
html[data-theme="claro"] .rec-refine-input {
  color: #3e271a !important; background: rgba(255,255,255,.7) !important;
  border-color: rgba(181,137,99,.22) !important;
}
html[data-theme="claro"] .rec-refine-input::placeholder { color: rgba(123,82,52,.4) !important }
html[data-theme="claro"] .rec-results-label { color: #b58963 !important }
html[data-theme="claro"] .rec-loading-text { color: #996b47 !important }
html[data-theme="claro"] .rec-empty { color: #996b47 !important }
html[data-theme="claro"] .rec-results-header::before,
html[data-theme="claro"] .rec-results-header::after { background: rgba(181,137,99,.2) !important }

/* ── 4.15 For-you ── */
html[data-theme="claro"] .fy-section-title { color: #3e271a !important }
html[data-theme="claro"] .fy-section-subtitle { color: #7b5234 !important }
html[data-theme="claro"] .fy-block-title { color: #5e3f29 !important }
html[data-theme="claro"] .fy-book-title { color: #3e271a !important }
html[data-theme="claro"] .fy-book-author { color: #7b5234 !important }
html[data-theme="claro"] .fy-cover-wrap { background: rgba(181,137,99,.06) !important }
html[data-theme="claro"] .fy-lista-link {
  background: rgba(255,255,255,.88) !important; border-color: rgba(181,137,99,.12) !important;
}
html[data-theme="claro"] .fy-lista-link:hover { border-color: #b58963 !important }
html[data-theme="claro"] .fy-lista-title { color: #3e271a !important }
html[data-theme="claro"] .fy-lista-subtitle { color: #7b5234 !important }
html[data-theme="claro"] .fy-lista-meta { color: #996b47 !important }
html[data-theme="claro"] .fy-lista-arrow { color: #b58963 !important }

/* ── 4.16 Paywall ── */
html[data-theme="claro"] .paywall-cta {
  background: linear-gradient(160deg,#fff8f0,#f5ead8,#ede0cc) !important;
  border-color: rgba(181,137,99,.35) !important;
  box-shadow: 0 12px 44px rgba(0,0,0,.08),0 3px 10px rgba(0,0,0,.05),inset 0 1px 0 rgba(255,255,255,.8) !important;
}
html[data-theme="claro"] .paywall-cta::before { color: #b58963 !important }
html[data-theme="claro"] .paywall-cta-title { color: #3e271a !important }
html[data-theme="claro"] .paywall-cta-body { color: #5e3f29 !important }
html[data-theme="claro"] .paywall-cta-body strong { color: #7b5234 !important }
html[data-theme="claro"] .paywall-login-link { color: #7b5234 !important }
html[data-theme="claro"] .step-locked-gradient {
  background: linear-gradient(to bottom,transparent,rgba(250,244,237,.65),rgba(250,244,237,.95),#faf4ed) !important;
}
html[data-theme="claro"] .step-locked-pill {
  background: linear-gradient(145deg,#fff,#faf4ed) !important;
  border-color: #b58963 !important; color: #7b5234 !important;
}
html[data-theme="claro"] .lpm-backdrop { background: rgba(0,0,0,.35) !important }
html[data-theme="claro"] .lpm-dialog {
  background: linear-gradient(160deg,#fff8f0,#f5ead8,#ede0cc) !important;
  border-color: rgba(181,137,99,.3) !important;
}
html[data-theme="claro"] .lpm-close { color: #996b47 !important }
html[data-theme="claro"] .lpm-ornament { color: #b58963 !important }
html[data-theme="claro"] .lpm-title { color: #3e271a !important }
html[data-theme="claro"] .lpm-body { color: #5e3f29 !important }
html[data-theme="claro"] .lpm-body strong { color: #7b5234 !important }
html[data-theme="claro"] .gp-billing-title { color: #3e271a !important }
html[data-theme="claro"] .gp-billing-subtitle { color: #7b5234 !important }
html[data-theme="claro"] .gp-plan-btn {
  background: linear-gradient(145deg,#fff,#faf4ed) !important;
  border-color: rgba(181,137,99,.3) !important;
}
html[data-theme="claro"] .gp-plan-label { color: #3e271a !important }
html[data-theme="claro"] .gp-plan-price { color: #b58963 !important }
html[data-theme="claro"] .gp-plan-badge { color: #b58963 !important }
html[data-theme="claro"] .gp-plan-saving { color: #996b47 !important }
html[data-theme="claro"] .gp-plan-btn--featured {
  background: linear-gradient(145deg,#5e3f29,#7b5234) !important;
}
html[data-theme="claro"] .gp-plan-btn--featured .gp-plan-label { color: #faf4ed !important }
html[data-theme="claro"] .gp-plan-btn--featured .gp-plan-price { color: #d9c2a6 !important }
html[data-theme="claro"] .gp-restore-btn { color: #996b47 !important }
html[data-theme="claro"] .gp-legal { color: #996b47 !important }
html[data-theme="claro"] .gp-legal a { color: #b58963 !important }

/* ── 4.17 Onboarding ── */
html[data-theme="claro"] .ob-overlay {
  background: linear-gradient(120deg,#f3e9dd 0%,#ede0cd 40%,#faf4ed 100%) !important;
}
html[data-theme="claro"] .ob-hedera { color: #b58963 !important }
html[data-theme="claro"] .ob-logo-wordmark { color: #5e3f29 !important }
html[data-theme="claro"] .ob-ornament-line::before,
html[data-theme="claro"] .ob-ornament-line::after { background: #c9a983 !important }
html[data-theme="claro"] .ob-ornament-diamond { background: #c9a983 !important }
html[data-theme="claro"] .ob-splash-headline { color: #3e271a !important }
html[data-theme="claro"] .ob-splash-lead { color: #7b5234 !important }
html[data-theme="claro"] .ob-modal-inner {
  background: linear-gradient(180deg,rgba(255,255,255,.92),rgba(250,244,237,.88)) !important;
  border-color: rgba(181,137,99,.15) !important;
}
html[data-theme="claro"] .ob-step-title { color: #3e271a !important }
html[data-theme="claro"] .ob-step-subtitle { color: #7b5234 !important }
html[data-theme="claro"] .ob-progress-roman { color: #c9a983 !important }
html[data-theme="claro"] .ob-progress-roman .ob-step-num.active { color: #3e271a !important }
html[data-theme="claro"] .ob-back-btn { color: #7b5234 !important }
html[data-theme="claro"] .ob-chip-mood,
html[data-theme="claro"] .ob-chip-genre {
  color: #5e3f29 !important; background: rgba(255,255,255,.6) !important;
  border-color: rgba(181,137,99,.2) !important;
}
html[data-theme="claro"] .ob-chip-mood.selected,
html[data-theme="claro"] .ob-chip-genre.selected {
  background: linear-gradient(145deg,#c9a983,#b58963) !important; color: #fff !important;
  border-color: transparent !important;
}
html[data-theme="claro"] .ob-micro-feedback { color: #996b47 !important }
html[data-theme="claro"] .ob-chip-interest {
  color: #7b5234 !important; border-color: rgba(181,137,99,.25) !important;
}
html[data-theme="claro"] .ob-chip-interest.selected {
  background: rgba(181,137,99,.15) !important; border-style: solid !important;
  color: #3e271a !important; border-color: #b58963 !important;
}
html[data-theme="claro"] .ob-interests-label { color: #b58963 !important }
html[data-theme="claro"] .ob-rec-title { color: #3e271a !important }
html[data-theme="claro"] .ob-rec-author { color: #7b5234 !important }
html[data-theme="claro"] .ob-rec-why-label { color: #996b47 !important }
html[data-theme="claro"] .ob-rec-reason { color: #5e3f29 !important }
html[data-theme="claro"] .ob-rec-chip { color: #7b5234 !important }

/* ── 4.18 Footer ── */
html[data-theme="claro"] .ft-minimal {
  background: rgba(250,244,237,.85) !important; color: #7b5234 !important;
  border-top: 1px solid rgba(181,137,99,.15) !important;
}
html[data-theme="claro"] .ft-minimal a { color: #996b47 !important }
html[data-theme="claro"] .ft-minimal .credit a {
  background: linear-gradient(180deg,#7b5234,#b58963) !important;
  -webkit-background-clip: text !important; color: transparent !important;
}

/* ── 4.19 CTA premium button ── */
html[data-theme="claro"] .cta-premium {
  background: linear-gradient(135deg,#c9a983,#b58963) !important; color: #fff !important;
}


/* ═══════════════════════════════════════════════════════
   §5  MODO OSCURO
   Paleta: azules profundos, dorados cálidos sobre fondo nocturno
   Brand: dorados Libreos como acentos luminosos
   ══════════════════════════════════════════════════════= */

/* ── 5.1 Body / background ── */
html[data-theme="oscuro"] body,
html[data-theme="oscuro"] .libro-body {
  background:
    radial-gradient(1200px 600px at 10% -10%, rgba(30,30,60,.25), transparent 60%),
    radial-gradient(1000px 500px at 100% 10%, rgba(20,20,50,.15), transparent 65%),
    linear-gradient(135deg, #0f0f1a 0%, #181830 30%, #1c2240 55%, #181830 80%, #0f0f1a 100%) !important;
  background-attachment: fixed !important;
  color: #e0ddd5 !important;
}

/* ── 5.2 Header (index) ── */
html[data-theme="oscuro"] header {
  background: rgba(15,15,26,.88) !important;
  backdrop-filter: blur(10px) saturate(120%) !important;
  border-bottom: 1px solid rgba(100,100,140,.18) !important;
}
html[data-theme="oscuro"] .brand { color: #ffe5a6 !important; text-shadow: 0 1px 0 rgba(0,0,0,.5) !important }
html[data-theme="oscuro"] .backdrop { background: rgba(0,0,0,.08) !important }

/* ── 5.3 Header lite ── */
html[data-theme="oscuro"] .header-lite {
  background: rgba(15,15,26,.92) !important;
  border-bottom: 1px solid rgba(100,100,140,.15) !important;
}
html[data-theme="oscuro"] .hl-menu {
  background: rgba(20,20,36,.97) !important; border-color: rgba(100,100,140,.22) !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.3) !important;
}
html[data-theme="oscuro"] .hl-menu-item { color: #e0ddd5 !important }
html[data-theme="oscuro"] .hl-menu-item:hover { background: rgba(100,100,140,.12) !important }
html[data-theme="oscuro"] .hl-login-btn {
  background: rgba(100,100,140,.12) !important; border-color: rgba(100,100,140,.25) !important;
  color: #e0ddd5 !important;
}

/* ── 5.4 Tabs ── */
html[data-theme="oscuro"] .tabs button {
  border-color: rgba(100,100,140,.22); background: rgba(255,255,255,.04); color: #c5c2ba;
}
html[data-theme="oscuro"] .tabs button:hover { background: rgba(255,255,255,.08) }
html[data-theme="oscuro"] .tabs button.active {
  background: rgba(100,100,140,.25); color: #ffe5a6; border-color: rgba(100,100,140,.4);
}

/* ── 5.5 Search input ── */
html[data-theme="oscuro"] .input input {
  background: rgba(255,255,255,.06) !important; color: #e0ddd5 !important;
  border-color: rgba(100,100,140,.22) !important;
}

/* ── 5.6 User menu ── */
html[data-theme="oscuro"] .user-card,
html[data-theme="oscuro"] .user-card-inner {
  background: linear-gradient(145deg,#2a2a4a,#1e1e38) !important;
  border-color: rgba(100,100,140,.3) !important; color: #e0ddd5 !important;
}
html[data-theme="oscuro"] .user-menu {
  background: rgba(18,18,32,.97) !important; border-color: rgba(100,100,140,.22) !important;
}
html[data-theme="oscuro"] .user-menu-item { color: #e0ddd5 !important }
html[data-theme="oscuro"] .user-menu-item:hover { background: rgba(100,100,140,.12) !important; color: #fff !important }
html[data-theme="oscuro"] #userName { color: #e0ddd5 !important }

/* ── 5.7 Book cards (index grid) ── */
html[data-theme="oscuro"] .book-card {
  background: rgba(26,26,46,.55) !important; border-color: rgba(100,100,140,.15) !important;
}
html[data-theme="oscuro"] .book-card .title { color: #e0ddd5 !important }
html[data-theme="oscuro"] .book-card .author { color: #ffe5a6 !important }

/* ── 5.8 Classic frame ── */
html[data-theme="oscuro"] .classic-frame {
  background: linear-gradient(180deg,rgba(26,26,46,.5),rgba(26,26,46,.3)) !important;
  border-color: rgba(100,100,140,.2) !important;
}

/* ── 5.9 Result cards ── */
html[data-theme="oscuro"] .result-card {
  background: linear-gradient(180deg,rgba(26,26,46,.7),rgba(22,22,42,.5)) !important;
  border-color: rgba(100,100,140,.15) !important;
}

/* ── 5.10 Modals (generic) ── */
html[data-theme="oscuro"] .modal-overlay { background: rgba(0,0,0,.55) !important }
html[data-theme="oscuro"] .modal {
  background: linear-gradient(180deg,rgba(26,26,46,.98),rgba(18,18,32,.95)) !important;
  border-color: rgba(100,100,140,.22) !important; color: #e0ddd5 !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.4) !important;
}
html[data-theme="oscuro"] .modal-close {
  background: rgba(100,100,140,.1) !important; border-color: rgba(100,100,140,.2) !important;
  color: #c5c2ba !important;
}
html[data-theme="oscuro"] .modal input[type="number"],
html[data-theme="oscuro"] .modal select {
  background: rgba(100,100,140,.1) !important; border-color: rgba(100,100,140,.2) !important;
  color: #e0ddd5 !important;
}
html[data-theme="oscuro"] .modal-overlay .modal-content,
html[data-theme="oscuro"] .lib-modal {
  background: linear-gradient(180deg,rgba(26,26,46,.98),rgba(18,18,32,.95)) !important;
  color: #e0ddd5 !important; border-color: rgba(100,100,140,.22) !important;
}
html[data-theme="oscuro"] .modal-title { color: #ffe5a6 !important }

/* ── 5.11 Listas page ── */
html[data-theme="oscuro"] .lista-title {
  background: linear-gradient(180deg,#ffe5a6,#d9c2a6,#ffe5a6) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  color: transparent !important;
}
html[data-theme="oscuro"] .lista-subtitle { color: #c5c2ba !important }
html[data-theme="oscuro"] .lista-intro { color: #b8b5ad !important }
html[data-theme="oscuro"] .lista-meta-total { color: #c5c2ba !important }
html[data-theme="oscuro"] .lista-libro-inner {
  background: rgba(26,26,46,.65) !important;
  border-color: rgba(100,100,140,.15) !important;
  border-left-color: rgba(100,100,140,.4) !important;
  backdrop-filter: blur(8px) !important;
}
html[data-theme="oscuro"] .lista-libro-titulo {
  background: linear-gradient(180deg,#ffe5a6,#d9c2a6,#ffe5a6) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  color: transparent !important;
}
html[data-theme="oscuro"] .lista-libro-autor { color: #c9a983 !important }
html[data-theme="oscuro"] .lista-desc { color: #c5c2ba !important }
html[data-theme="oscuro"] .lista-meta span {
  background: rgba(100,100,140,.1) !important; border-color: rgba(100,100,140,.2) !important;
  color: #c5c2ba !important;
}
html[data-theme="oscuro"] .lista-tipo-badge {
  background: linear-gradient(135deg,rgba(100,100,140,.25),rgba(100,100,140,.15)) !important;
  color: #ffe5a6 !important; border-color: rgba(100,100,140,.3) !important;
}
html[data-theme="oscuro"] .lista-btn {
  background: linear-gradient(135deg,rgba(100,100,140,.2),rgba(100,100,140,.12)) !important;
  color: #ffe5a6 !important; border-color: rgba(100,100,140,.3) !important;
}
html[data-theme="oscuro"] .lista-libro::before {
  background: linear-gradient(135deg,rgba(100,100,140,.35),rgba(100,100,140,.2)) !important;
  color: #ffe5a6 !important; border-color: rgba(255,255,255,.2) !important;
}
html[data-theme="oscuro"] .lista-divider { color: rgba(100,100,140,.4) !important }
html[data-theme="oscuro"] .lista-divider::before,
html[data-theme="oscuro"] .lista-divider::after { background: linear-gradient(90deg,transparent,rgba(100,100,140,.3),transparent) !important }
html[data-theme="oscuro"] .lista-meta-item {
  background: rgba(100,100,140,.1) !important; border-color: rgba(100,100,140,.2) !important;
}
html[data-theme="oscuro"] .lista-libro + .lista-libro::after {
  background: linear-gradient(180deg,rgba(100,100,140,.5),rgba(100,100,140,.15)) !important;
}

/* ── 5.12 Rutas page ── */
html[data-theme="oscuro"] .ruta-paso-card {
  background: linear-gradient(145deg,rgba(26,26,46,.8),rgba(30,30,55,.7),rgba(22,22,42,.8)) !important;
  border-color: rgba(100,100,140,.18) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.03) !important;
}
html[data-theme="oscuro"] .ruta-paso-card::before { border-right-color: rgba(100,100,140,.18) !important }
html[data-theme="oscuro"] .ruta-paso-card::after { border-right-color: rgba(26,26,46,.8) !important }
html[data-theme="oscuro"] .ruta-paso-titulo {
  background: linear-gradient(180deg,#ffe5a6,#d9c2a6,#ffe5a6) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  color: transparent !important;
}
html[data-theme="oscuro"] .ruta-paso-autor { color: #c9a983 !important }
html[data-theme="oscuro"] .ruta-paso-desc { color: #c5c2ba !important }
html[data-theme="oscuro"] .ruta-porqué {
  background: linear-gradient(135deg,rgba(100,100,140,.1),rgba(100,100,140,.05)) !important;
  border-color: rgba(100,100,140,.15) !important; border-left-color: rgba(100,100,140,.4) !important;
}
html[data-theme="oscuro"] .ruta-porqué-texto { color: #b8b5ad !important }
html[data-theme="oscuro"] .ruta-porqué-label { color: #ffe5a6 !important }
html[data-theme="oscuro"] .ruta-etiqueta {
  background: rgba(100,100,140,.12) !important; border-color: rgba(100,100,140,.22) !important;
  color: #c9a983 !important;
}
html[data-theme="oscuro"] .ruta-paso-meta span {
  background: rgba(100,100,140,.1) !important; border-color: rgba(100,100,140,.18) !important;
  color: #c5c2ba !important;
}
html[data-theme="oscuro"] .ruta-meta-total { color: #c5c2ba !important }
html[data-theme="oscuro"] .ruta-tipo-badge {
  background: linear-gradient(135deg,rgba(100,100,140,.25),rgba(100,100,140,.15)) !important;
  color: #ffe5a6 !important; border-color: rgba(100,100,140,.3) !important;
}
html[data-theme="oscuro"] .ruta-paso-numero {
  background: linear-gradient(135deg,rgba(100,100,140,.35),rgba(100,100,140,.2)) !important;
  color: #ffe5a6 !important; border-color: rgba(255,255,255,.15) !important;
}
html[data-theme="oscuro"] .ruta-paso:last-child .ruta-paso-card {
  background: linear-gradient(145deg,rgba(36,36,62,.85),rgba(28,28,50,.75)) !important;
  border-color: rgba(100,100,140,.25) !important;
}
html[data-theme="oscuro"] .ruta-paso:last-child .ruta-paso-card::after { border-right-color: rgba(36,36,62,.85) !important }
html[data-theme="oscuro"] .ruta-paso:last-child .ruta-paso-numero {
  background: linear-gradient(135deg,#c9a864,#a07830) !important; color: #fff !important;
}
html[data-theme="oscuro"] .ruta-paso:last-child .ruta-etiqueta {
  background: rgba(201,168,100,.15) !important; border-color: rgba(201,168,100,.25) !important;
}
html[data-theme="oscuro"] .ruta-timeline::before {
  background: linear-gradient(180deg,rgba(100,100,140,.5),rgba(100,100,140,.08)) !important;
}
html[data-theme="oscuro"] .ruta-paso-card .lista-btn {
  background: linear-gradient(135deg,rgba(100,100,140,.25),rgba(100,100,140,.15)) !important;
  color: #ffe5a6 !important; border-color: rgba(100,100,140,.3) !important;
}
html[data-theme="oscuro"] .ruta-arc-dot {
  background: linear-gradient(135deg,rgba(100,100,140,.4),rgba(100,100,140,.25)) !important;
  border-color: rgba(255,255,255,.15) !important;
}
html[data-theme="oscuro"] .ruta-arc-line { background: linear-gradient(90deg,rgba(100,100,140,.35),rgba(100,100,140,.1)) !important }

/* ── 5.13 Libro / ficha page ── */
html[data-theme="oscuro"] .book-shell {
  background: linear-gradient(145deg,rgba(26,26,46,.95),rgba(22,22,42,.9)) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.35),0 0 0 1px rgba(100,100,140,.15) !important;
}
html[data-theme="oscuro"] .book-title {
  background: linear-gradient(180deg,#ffe5a6,#d9c2a6 40%,#ffe5a6) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  color: transparent !important; text-shadow: none !important;
}
html[data-theme="oscuro"] .book-author { color: #c9a983 !important }
html[data-theme="oscuro"] .book-tagline { color: rgba(200,195,185,.5) !important }
html[data-theme="oscuro"] .book-info { color: #c5c2ba !important }
html[data-theme="oscuro"] .book-section-title { color: #ffe5a6 !important }
html[data-theme="oscuro"] .long-explain { color: #c5c2ba !important }
html[data-theme="oscuro"] .meta-pill {
  background: rgba(100,100,140,.1) !important; border-color: rgba(100,100,140,.22) !important;
  color: #c5c2ba !important;
}
html[data-theme="oscuro"] .book-btn-primary {
  background: linear-gradient(180deg,#c9a77c,#8f6a47) !important; color: #fff !important;
}
html[data-theme="oscuro"] .book-btn-ghost {
  border-color: rgba(100,100,140,.3) !important; color: #c5c2ba !important; background: transparent !important;
}
html[data-theme="oscuro"] .book-btn-ghost:hover { background: rgba(100,100,140,.1) !important }
html[data-theme="oscuro"] .related-card {
  background: linear-gradient(180deg,rgba(26,26,46,.88),rgba(20,20,38,.82)) !important;
  border-color: rgba(100,100,140,.18) !important;
}
html[data-theme="oscuro"] .related-card .book-section-title {
  background: linear-gradient(180deg,#ffe5a6,#c9a983) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  color: transparent !important;
}
html[data-theme="oscuro"] .related-pill {
  background: rgba(100,100,140,.1) !important; border-color: rgba(100,100,140,.22) !important;
  color: #c5c2ba !important;
}
html[data-theme="oscuro"] .related-pill:hover { background: rgba(100,100,140,.18) !important }
html[data-theme="oscuro"] .book-extra { border-top-color: rgba(100,100,140,.15) !important }
html[data-theme="oscuro"] .book-extra.highlight-block::before {
  background: linear-gradient(90deg,#c9a983,#ffe5a6) !important;
}
html[data-theme="oscuro"] .book-extra.highlight-block .book-section-title {
  background: linear-gradient(180deg,#ffe5a6,#c9a983) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  color: transparent !important;
}
html[data-theme="oscuro"] .book-bullets li::marker { color: #c9a983 !important }
html[data-theme="oscuro"] .book-cover {
  background: radial-gradient(circle at top,rgba(26,26,46,.6),rgba(15,15,26,.4) 80%) !important;
}
html[data-theme="oscuro"] .book-cover img {
  box-shadow: 0 6px 22px rgba(0,0,0,.35),0 0 0 3px rgba(100,100,140,.2) !important;
}

/* ── 5.14 Recommender ── */
html[data-theme="oscuro"] .rec-section::before { background: rgba(0,0,0,.1) !important }
html[data-theme="oscuro"] .rec-title { color: #ffe5a6 !important }
html[data-theme="oscuro"] .rec-subtitle { color: #c9a983 !important }
html[data-theme="oscuro"] .rec-ornament { color: #c9a983 !important }
html[data-theme="oscuro"] .rec-chip {
  color: #c5c2ba !important; background: rgba(100,100,140,.08) !important;
  border-color: rgba(100,100,140,.2) !important;
}
html[data-theme="oscuro"] .rec-chip:hover { background: rgba(100,100,140,.15) !important; color: #fff !important }
html[data-theme="oscuro"] .rec-chip.active {
  background: linear-gradient(145deg,rgba(100,100,140,.3),rgba(100,100,140,.18)) !important;
  color: #ffe5a6 !important; border-color: transparent !important;
}
html[data-theme="oscuro"] .rec-card {
  background: linear-gradient(160deg,rgba(26,26,46,.75),rgba(22,22,42,.6)) !important;
  border-color: rgba(100,100,140,.15) !important;
  box-shadow: 0 4px 14px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.04) !important;
}
html[data-theme="oscuro"] .rec-card-title { color: #e0ddd5 !important }
html[data-theme="oscuro"] .rec-card-author { color: #c9a983 !important }
html[data-theme="oscuro"] .rec-card-why { color: #b8b5ad !important }
html[data-theme="oscuro"] .rec-card-cover { background: linear-gradient(145deg,rgba(40,40,65,.8),rgba(30,30,50,.6)) !important }
html[data-theme="oscuro"] .rec-cover-fake-title { color: #e0ddd5 !important }
html[data-theme="oscuro"] .rec-cover-fake-author { color: #c9a983 !important }
html[data-theme="oscuro"] .rec-card-icon-wrap { background: linear-gradient(145deg,#2a2a4a,#1e1e38) !important }
html[data-theme="oscuro"] .rec-card-icon-wrap-tematica { background: linear-gradient(145deg,#2a2a4a,#1e1e38) !important }
html[data-theme="oscuro"] .rec-card-icon-wrap-autor { background: linear-gradient(145deg,#1e1e38,#151528) !important }
html[data-theme="oscuro"] .rec-card-icon-title { color: #ffe5a6 !important }
html[data-theme="oscuro"] .rec-card-icon-subtitle { color: #c9a983 !important }
html[data-theme="oscuro"] .rec-type-badge--libro { background: rgba(100,100,140,.5) !important; color: #d9c2a6 !important }
html[data-theme="oscuro"] .rec-type-badge--ruta { background: rgba(201,168,100,.5) !important; color: #fff !important }
html[data-theme="oscuro"] .rec-type-badge--lista { background: rgba(100,100,140,.4) !important; color: #d9c2a6 !important }
html[data-theme="oscuro"] .rec-more-btn {
  color: #c9a983 !important; border-color: rgba(100,100,140,.25) !important;
}
html[data-theme="oscuro"] .rec-more-btn:hover { background: rgba(100,100,140,.1) !important; color: #ffe5a6 !important }
html[data-theme="oscuro"] .rec-refine-input {
  color: #e0ddd5 !important; background: rgba(100,100,140,.08) !important;
  border-color: rgba(100,100,140,.2) !important;
}
html[data-theme="oscuro"] .rec-refine-input::placeholder { color: rgba(200,195,185,.35) !important }
html[data-theme="oscuro"] .rec-refine-input:focus { border-color: rgba(100,100,140,.4) !important; background: rgba(100,100,140,.12) !important }
html[data-theme="oscuro"] .rec-results-label { color: #c9a983 !important }
html[data-theme="oscuro"] .rec-results-header::before,
html[data-theme="oscuro"] .rec-results-header::after { background: rgba(100,100,140,.18) !important }
html[data-theme="oscuro"] .rec-loading-text { color: #c9a983 !important }
html[data-theme="oscuro"] .rec-empty { color: #c9a983 !important }

/* ── 5.15 For-you ── */
html[data-theme="oscuro"] .fy-section-title { color: #ffe5a6 !important }
html[data-theme="oscuro"] .fy-section-subtitle { color: #c9a983 !important }
html[data-theme="oscuro"] .fy-block-title { color: #c5c2ba !important }
html[data-theme="oscuro"] .fy-book-title { color: #e0ddd5 !important }
html[data-theme="oscuro"] .fy-book-author { color: #c9a983 !important }
html[data-theme="oscuro"] .fy-cover-wrap { background: rgba(100,100,140,.06) !important }
html[data-theme="oscuro"] .fy-lista-link {
  background: rgba(26,26,46,.65) !important; border-color: rgba(100,100,140,.15) !important;
}
html[data-theme="oscuro"] .fy-lista-link:hover { border-color: rgba(100,100,140,.35) !important }
html[data-theme="oscuro"] .fy-lista-title { color: #e0ddd5 !important }
html[data-theme="oscuro"] .fy-lista-subtitle { color: #c9a983 !important }
html[data-theme="oscuro"] .fy-lista-meta { color: #b8b5ad !important }
html[data-theme="oscuro"] .fy-lista-arrow { color: #c9a983 !important }

/* ── 5.16 Paywall ── */
html[data-theme="oscuro"] .paywall-cta {
  background: linear-gradient(160deg,rgba(26,26,46,.95),rgba(30,30,55,.9),rgba(22,22,42,.95)) !important;
  border-color: rgba(100,100,140,.3) !important;
  box-shadow: 0 12px 44px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.05) !important;
}
html[data-theme="oscuro"] .paywall-cta::before { color: #c9a983 !important }
html[data-theme="oscuro"] .paywall-cta-title { color: #ffe5a6 !important }
html[data-theme="oscuro"] .paywall-cta-body { color: #c5c2ba !important }
html[data-theme="oscuro"] .paywall-cta-body strong { color: #d9c2a6 !important }
html[data-theme="oscuro"] .btn-premium {
  background: linear-gradient(135deg,#c9a864,#a07830,#7a5a20) !important; color: #fff !important;
}
html[data-theme="oscuro"] .paywall-login-link { color: #c9a983 !important }
html[data-theme="oscuro"] .step-locked-gradient {
  background: linear-gradient(to bottom,transparent,rgba(15,15,26,.55),rgba(15,15,26,.9),#0f0f1a) !important;
}
html[data-theme="oscuro"] .step-locked-pill {
  background: linear-gradient(145deg,rgba(26,26,46,.95),rgba(30,30,55,.9)) !important;
  border-color: #c9a864 !important; color: #ffe5a6 !important;
}
html[data-theme="oscuro"] .lpm-backdrop { background: rgba(0,0,0,.6) !important }
html[data-theme="oscuro"] .lpm-dialog {
  background: linear-gradient(160deg,rgba(26,26,46,.98),rgba(30,30,55,.95),rgba(22,22,42,.98)) !important;
  border-color: rgba(100,100,140,.25) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.4) !important;
}
html[data-theme="oscuro"] .lpm-close { color: #c5c2ba !important }
html[data-theme="oscuro"] .lpm-ornament { color: #c9a983 !important }
html[data-theme="oscuro"] .lpm-title { color: #ffe5a6 !important }
html[data-theme="oscuro"] .lpm-body { color: #c5c2ba !important }
html[data-theme="oscuro"] .lpm-body strong { color: #d9c2a6 !important }
html[data-theme="oscuro"] .gp-billing-title { color: #ffe5a6 !important }
html[data-theme="oscuro"] .gp-billing-subtitle { color: #c5c2ba !important }
html[data-theme="oscuro"] .gp-plan-btn {
  background: linear-gradient(145deg,rgba(26,26,46,.9),rgba(30,30,55,.85)) !important;
  border-color: rgba(100,100,140,.25) !important;
}
html[data-theme="oscuro"] .gp-plan-btn:hover:not(:disabled) { border-color: rgba(100,100,140,.4) !important }
html[data-theme="oscuro"] .gp-plan-label { color: #e0ddd5 !important }
html[data-theme="oscuro"] .gp-plan-price { color: #c9a983 !important }
html[data-theme="oscuro"] .gp-plan-badge { color: #c9a983 !important }
html[data-theme="oscuro"] .gp-plan-saving { color: #b8b5ad !important }
html[data-theme="oscuro"] .gp-plan-btn--featured {
  background: linear-gradient(145deg,rgba(100,100,140,.3),rgba(100,100,140,.18)) !important;
  border-color: #c9a864 !important;
}
html[data-theme="oscuro"] .gp-plan-btn--featured .gp-plan-label { color: #fff !important }
html[data-theme="oscuro"] .gp-plan-btn--featured .gp-plan-price { color: #ffe5a6 !important }
html[data-theme="oscuro"] .gp-plan-btn--featured .gp-plan-badge { color: #ffe5a6 !important }
html[data-theme="oscuro"] .gp-plan-btn--featured .gp-plan-saving { color: #c9a983 !important }
html[data-theme="oscuro"] .gp-restore-btn { color: #c9a983 !important }
html[data-theme="oscuro"] .gp-restore-btn:hover { color: #ffe5a6 !important }
html[data-theme="oscuro"] .gp-legal { color: #b8b5ad !important }
html[data-theme="oscuro"] .gp-legal a { color: #c9a983 !important }

/* ── 5.17 Onboarding ── */
html[data-theme="oscuro"] .ob-overlay {
  background: linear-gradient(120deg,#0f0f1a 0%,#181830 40%,#1c2240 100%) !important;
}
html[data-theme="oscuro"] .ob-hedera { color: #c9a983 !important }
html[data-theme="oscuro"] .ob-logo-wordmark { color: #ffe5a6 !important }
html[data-theme="oscuro"] .ob-ornament-line::before,
html[data-theme="oscuro"] .ob-ornament-line::after { background: rgba(100,100,140,.4) !important }
html[data-theme="oscuro"] .ob-ornament-diamond { background: #c9a983 !important }
html[data-theme="oscuro"] .ob-splash-headline { color: #e0ddd5 !important }
html[data-theme="oscuro"] .ob-splash-lead { color: #c9a983 !important }
html[data-theme="oscuro"] .ob-btn-primary {
  background: linear-gradient(135deg,#c9a864,#a07830,#7a5a20) !important; color: #fff !important;
}
html[data-theme="oscuro"] .ob-modal-inner {
  background: linear-gradient(180deg,rgba(26,26,46,.92),rgba(22,22,42,.88)) !important;
  border-color: rgba(100,100,140,.18) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.35) !important;
}
html[data-theme="oscuro"] .ob-step-title { color: #ffe5a6 !important }
html[data-theme="oscuro"] .ob-step-subtitle { color: #c9a983 !important }
html[data-theme="oscuro"] .ob-progress-roman { color: rgba(100,100,140,.5) !important }
html[data-theme="oscuro"] .ob-progress-roman .ob-step-num.active { color: #ffe5a6 !important }
html[data-theme="oscuro"] .ob-back-btn { color: #c9a983 !important }
html[data-theme="oscuro"] .ob-chip-mood,
html[data-theme="oscuro"] .ob-chip-genre {
  color: #c5c2ba !important; background: rgba(100,100,140,.08) !important;
  border-color: rgba(100,100,140,.2) !important;
}
html[data-theme="oscuro"] .ob-chip-mood:hover,
html[data-theme="oscuro"] .ob-chip-genre:hover {
  background: rgba(100,100,140,.15) !important; border-color: rgba(100,100,140,.3) !important;
}
html[data-theme="oscuro"] .ob-chip-mood.selected,
html[data-theme="oscuro"] .ob-chip-genre.selected {
  background: linear-gradient(145deg,rgba(100,100,140,.3),rgba(100,100,140,.18)) !important;
  color: #ffe5a6 !important; border-color: rgba(100,100,140,.4) !important;
}
html[data-theme="oscuro"] .ob-micro-feedback { color: #c9a983 !important }
html[data-theme="oscuro"] .ob-chip-interest {
  color: #c5c2ba !important; border-color: rgba(100,100,140,.2) !important;
}
html[data-theme="oscuro"] .ob-chip-interest.selected {
  background: rgba(100,100,140,.12) !important; border-style: solid !important;
  color: #ffe5a6 !important; border-color: rgba(100,100,140,.4) !important;
}
html[data-theme="oscuro"] .ob-interests-label { color: #c9a983 !important }
html[data-theme="oscuro"] .ob-btn-next {
  background: linear-gradient(135deg,rgba(100,100,140,.3),rgba(100,100,140,.18)) !important;
  color: #ffe5a6 !important;
}
html[data-theme="oscuro"] .ob-btn-final {
  background: linear-gradient(135deg,#c9a864,#a07830,#7a5a20) !important; color: #fff !important;
}
html[data-theme="oscuro"] .ob-rec-title { color: #e0ddd5 !important }
html[data-theme="oscuro"] .ob-rec-author { color: #c9a983 !important }
html[data-theme="oscuro"] .ob-rec-why-label { color: #c9a983 !important }
html[data-theme="oscuro"] .ob-rec-reason { color: #c5c2ba !important }
html[data-theme="oscuro"] .ob-rec-chip { color: #c9a983 !important }

/* ── 5.18 Footer ── */
html[data-theme="oscuro"] .ft-minimal {
  background: rgba(15,15,26,.88) !important; color: #c5c2ba !important;
  border-top: 1px solid rgba(100,100,140,.12) !important;
}
html[data-theme="oscuro"] .ft-minimal a { color: #c9a983 !important }
html[data-theme="oscuro"] .ft-minimal .credit a {
  background: linear-gradient(180deg,#c9a983,#ffe5a6) !important;
  -webkit-background-clip: text !important; color: transparent !important;
}

/* ── 5.19 CTA premium ── */
html[data-theme="oscuro"] .cta-premium {
  background: linear-gradient(135deg,#c9a864,#a07830) !important; color: #fff !important;
}

/* ── 5.20 Logout modal ── */
html[data-theme="oscuro"] .wood-modal {
  background: linear-gradient(180deg,rgba(26,26,46,.98),rgba(18,18,32,.95)) !important;
  border-color: rgba(100,100,140,.22) !important; color: #e0ddd5 !important;
}


/* ═══════════════════════════════════════════════════════
   §6  RESPONSIVE
   ══════════════════════════════════════════════════════= */

@media (max-width: 480px) {
  .a11y-panel { padding: 22px 16px 18px; border-radius: 14px }
  .a11y-themes { flex-direction: column }
  .a11y-theme-btn { flex-direction: row; min-width: unset }
  .a11y-font-control { flex-direction: column; align-items: flex-start; gap: 6px }
  .a11y-font-label { flex: unset }
  .a11y-slider-wrap { width: 100% }
}