/* ============================================================
   La Verdad Histórica (LVDE) — Sistema visual en CSS puro.
   Paleta unificada con la pestaña Tienda (VERITAS):
   obsidiana / marfil / oro / grises cálidos.
   Playfair Display + Manrope, textura papel.
   ============================================================ */

:root {
  /* Paleta de marca (misma que la Tienda / VERITAS) */
  --obsidian: #0B0B0D;
  --charcoal: #151518;
  --charcoal-2: #1B1B1F;
  --ivory: #F2EDE1;
  --paper: #CDBB98;
  --gold-hex: #D4AF37;
  --gold-dark-hex: #9C7A24;

  /* Modo claro — marfil y blanco, negro obsidiana, acento dorado */
  --background: 42 33% 96%;
  --foreground: 240 8% 4%;
  --card: 0 0% 100%;
  --card-foreground: 240 8% 4%;
  --primary: 240 8% 4%;
  --primary-foreground: 42 39% 92%;
  --secondary: 42 25% 91%;
  --muted: 42 14% 90%;
  --muted-foreground: 40 6% 33%;
  --accent: 43 45% 88%;
  --border: 42 18% 82%;
  --ring: 43 62% 45%;
  --gold: 42 66% 34%;
  --gold-soft: 46 65% 52%;
  --radius: 0.75rem;

  --hero-top: hsla(42, 33%, 96%, 0.84);
  --hero-bottom: hsla(42, 33%, 96%, 0.96);
  --shadow-color: 0 0% 0%;

  --green-bg: linear-gradient(135deg, #dcfce7 0%, #bbf7d0 100%);
  --green-border: #86efac;
  --green-text: #166534;
  --red-bg: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
  --red-border: #fca5a5;
  --red-text: #991b1b;
  --amber-bg: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
  --amber-border: #fcd34d;
  --amber-text: #92400e;
}

[data-theme="dark"] {
  /* Modo oscuro — negro obsidiana, marfil, oro (idéntico a la Tienda) */
  --background: 240 8% 4%;
  --foreground: 42 39% 92%;
  --card: 240 7% 8%;
  --card-foreground: 42 39% 92%;
  --primary: 46 65% 52%;
  --primary-foreground: 240 8% 4%;
  --secondary: 240 7% 11%;
  --muted: 240 7% 11%;
  --muted-foreground: 40 8% 68%;
  --accent: 43 26% 15%;
  --border: 43 14% 20%;
  --ring: 46 65% 52%;
  --gold: 46 65% 52%;
  --gold-soft: 44 74% 65%;

  --hero-top: hsla(240, 8%, 4%, 0.80);
  --hero-bottom: hsla(240, 8%, 4%, 0.95);
  --shadow-color: 0 0% 0%;

  --green-bg: linear-gradient(135deg, #14331f 0%, #16432a 100%);
  --green-border: #2f6b45;
  --green-text: #bbf7d0;
  --red-bg: linear-gradient(135deg, #3a1414 0%, #4a1717 100%);
  --red-border: #7f2a2a;
  --red-text: #fecaca;
  --amber-bg: linear-gradient(135deg, #3a2c0d 0%, #4a3910 100%);
  --amber-border: #7a5e18;
  --amber-text: #fde68a;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

body {
  font-family: 'Manrope', -apple-system, sans-serif;
  background-color: hsl(var(--background));
  color: hsl(var(--foreground));
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
  transition: background-color 0.4s ease, color 0.4s ease;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.03'/%3E%3C/svg%3E");
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Playfair Display', Georgia, serif;
  color: hsl(var(--foreground));
  line-height: 1.15;
}

a { color: inherit; text-decoration: none; }
::selection { background: hsl(var(--primary) / 0.15); color: hsl(var(--primary)); }

/* Scrollbar */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: hsl(var(--muted)); }
::-webkit-scrollbar-thumb { background: hsl(var(--primary) / 0.4); border-radius: 5px; }
::-webkit-scrollbar-thumb:hover { background: hsl(var(--primary) / 0.6); }

/* ===================== HEADER / NAV ===================== */
.site-header {
  position: sticky;
  top: 0;
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 0.9rem 1.5rem;
  background: hsl(var(--background) / 0.85);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid hsl(var(--border));
}

.brand {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: 1.15rem;
  color: hsl(var(--primary));
  white-space: nowrap;
}
.brand i { font-size: 1.05rem; color: hsl(var(--gold)); }

.main-nav { display: flex; align-items: center; gap: 0.9rem; }
.nav-link {
  position: relative;
  padding: 0.5rem 0.9rem;
  border-radius: 999px;
  font-size: 0.9rem;
  font-weight: 500;
  color: hsl(var(--muted-foreground));
  transition: color 0.2s ease, background-color 0.2s ease;
}
.nav-link:hover { color: hsl(var(--primary)); background: hsl(var(--accent)); }
.nav-link.active { color: hsl(var(--primary-foreground)); background: hsl(var(--primary)); }

/* Navegación en iconos con tooltip al pasar el ratón o enfocar con teclado */
.main-nav .nav-link {
  display: inline-flex; align-items: center; justify-content: center;
  width: 2.5rem; height: 2.5rem; padding: 0; font-size: 1.05rem;
}
.main-nav .nav-link::after {
  content: attr(data-tooltip);
  position: absolute; top: calc(100% + 0.5rem); left: 50%;
  transform: translate(-50%, -4px);
  padding: 0.3rem 0.65rem; border-radius: 0.5rem;
  background: hsl(var(--foreground)); color: hsl(var(--background));
  font-size: 0.78rem; font-weight: 500; line-height: 1.2; white-space: nowrap;
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity 0.15s ease, transform 0.15s ease; z-index: 60;
}
.main-nav .nav-link:hover::after,
.main-nav .nav-link:focus-visible::after {
  opacity: 1; visibility: visible; transform: translate(-50%, 0);
}

.header-actions { display: flex; align-items: center; gap: 0.5rem; }

.icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px; height: 42px;
  border-radius: 999px;
  border: 1px solid hsl(var(--border));
  background: hsl(var(--card) / 0.8);
  color: hsl(var(--foreground));
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}
.icon-btn:hover { box-shadow: 0 4px 14px rgba(0,0,0,0.08); background: hsl(var(--accent)); }
.icon-btn:active { transform: scale(0.94); }

.mobile-menu-toggle { display: none; }

/* ===================== MOBILE NAV ===================== */
.mobile-overlay {
  position: fixed; inset: 0; z-index: 55;
  background: rgba(0,0,0,0.4);
  opacity: 0; visibility: hidden; transition: opacity 0.25s ease;
}
.mobile-overlay.open { opacity: 1; visibility: visible; }

.mobile-nav {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 56;
  width: 300px; max-width: 85vw;
  background: hsl(var(--background));
  border-left: 1px solid hsl(var(--border));
  transform: translateX(100%);
  transition: transform 0.3s cubic-bezier(0.4,0,0.2,1);
  padding: 1.25rem;
  display: flex; flex-direction: column; gap: 0.35rem;
  box-shadow: -20px 0 40px rgba(0,0,0,0.12);
}
.mobile-nav.open { transform: translateX(0); }
.mobile-nav-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 0.75rem; padding-bottom: 0.75rem;
  border-bottom: 1px solid hsl(var(--border));
}
.mobile-nav-link {
  display: flex; align-items: center; gap: 0.7rem;
  padding: 0.75rem 0.85rem; border-radius: var(--radius);
  font-weight: 500; color: hsl(var(--foreground));
  transition: background-color 0.2s ease, color 0.2s ease;
}
.mobile-nav-link:hover, .mobile-nav-link.active {
  background: hsl(var(--accent)); color: hsl(var(--primary));
}
.mobile-nav-link i { width: 20px; text-align: center; color: hsl(var(--gold)); }
.mobile-nav-divider { height: 1px; background: hsl(var(--border)); margin: 0.5rem 0; }

/* ===================== LAYOUT ===================== */
.page { display: none; animation: fadeIn 0.4s ease; }
.page.active { display: block; }

@keyframes fadeIn { from { opacity: 0; transform: translateY(8px);} to { opacity: 1; transform: translateY(0);} }

.container { max-width: 1100px; margin: 0 auto; padding: 0 1.5rem; }
.section-pad { padding: 3.5rem 0; }

/* ===================== FONDO ILUSTRADO — PÁGINAS CON EL ESTILO "MAPA ANTIGUO" ===================== */
/* Mapa antiguo + columnata clásica + libros: fondo fijo de toda la página
   (cabecera de la sección, banners de publicidad y contenido), no solo un
   recuadro. Ahora se aplica a todas las páginas del sitio (antes solo a
   Verificador/inicio, Comunidad, Planes y Aviso legal). */
body {
  background-image:
    linear-gradient(to bottom, hsla(42, 45%, 97%, 0.35) 0%, hsla(42, 45%, 97%, 0.55) 55%, hsl(var(--background)) 100%),
    url('assets/img/hero-bg.jpg');
  background-size: 100% auto, cover;
  background-position: top center, top center;
  background-repeat: no-repeat, no-repeat;
  background-attachment: scroll, fixed;
}
[data-theme="dark"] body {
  background-image:
    linear-gradient(to bottom, hsla(240, 8%, 4%, 0.55) 0%, hsla(240, 8%, 4%, 0.72) 55%, hsl(var(--background)) 100%),
    url('assets/img/hero-bg.jpg');
}

/* ===================== HERO / VERIFICADOR ===================== */
.hero {
  position: relative;
  min-height: 62vh;
  display: flex; align-items: center; justify-content: center;
  padding: 4rem 1.5rem;
  background: transparent;
}
.hero-inner { max-width: 720px; text-align: center; }

/* ---------- Tarjeta blanca del verificador (selección + análisis IA) ---------- */
.verifier-card {
  background: transparent;
  border: 1px solid hsl(var(--border));
  border-radius: 1.5rem;
  padding: 1.75rem 1.75rem 1.5rem;
}
.verifier-card .verifier-tabs { margin-top: 0; }
.verifier-card .search-wrap { max-width: 100%; }
.hero h1 {
  font-size: clamp(2.4rem, 6vw, 4rem);
  font-weight: 700; letter-spacing: -0.02em;
  margin-bottom: 1.25rem;
}
.hero p.lead {
  font-size: clamp(1rem, 2vw, 1.15rem);
  color: hsl(var(--muted-foreground));
  max-width: 560px; margin: 0 auto 2.25rem;
}

.search-wrap { position: relative; max-width: 640px; margin: 0 auto; }
textarea.query, input.query {
  width: 100%; min-height: 140px; resize: none;
  padding: 1rem 1.1rem;
  font-family: inherit; font-size: 1rem;
  background: hsl(var(--card) / 0.92); backdrop-filter: blur(6px);
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  box-shadow: 0 10px 30px rgba(0,0,0,0.06);
  color: hsl(var(--foreground));
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
input.query { min-height: unset; }
textarea.query:focus, input.query:focus { outline: none; border-color: hsl(var(--primary) / 0.4); box-shadow: 0 0 0 4px hsl(var(--primary) / 0.1); }

/* ---------- Pestañas Verificador (afirmaciones / personajes) ---------- */
.verifier-tabs { display: inline-flex; gap: 0.35rem; background: hsl(var(--card) / 0.85); border: 1px solid hsl(var(--border)); border-radius: 999px; padding: 0.3rem; margin: 0 auto 1.5rem; }
.verifier-tab { display: inline-flex; align-items: center; gap: 0.5rem; border: none; background: transparent; cursor: pointer; font-family: inherit; font-weight: 600; font-size: 0.9rem; padding: 0.55rem 1.1rem; border-radius: 999px; color: hsl(var(--muted-foreground)); transition: background-color 0.2s ease, color 0.2s ease; }
.verifier-tab.active { background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); }
.tab-panel { display: none; }
.tab-panel.active { display: block; }
.tab-panel-lead { color: hsl(var(--muted-foreground)); font-size: 0.95rem; max-width: 560px; margin: 0 auto 1.25rem; }

/* ---------- Franja de confianza (hero del verificador) ---------- */
.trust-strip {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 0.6rem 1.4rem;
  margin: 0 auto 1.75rem; font-size: 0.82rem; color: hsl(var(--muted-foreground)); font-weight: 500;
}
.trust-strip span { display: inline-flex; align-items: center; gap: 0.4rem; }
.trust-strip i { color: hsl(var(--gold)); }

/* ---------- Guía de 3 pasos ---------- */
.verifier-steps {
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
  gap: 0.5rem 0; max-width: 620px; margin: 0 auto 1.25rem;
  font-size: 0.82rem; color: hsl(var(--muted-foreground));
}
.v-step { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0 0.9rem; }
.v-step-num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 1.4rem; height: 1.4rem; border-radius: 50%; flex-shrink: 0;
  background: hsl(var(--primary) / 0.12); color: hsl(var(--primary));
  font-weight: 700; font-size: 0.75rem;
}
.v-step:not(:last-child)::after {
  content: "\f105"; font-family: "Font Awesome 6 Free"; font-weight: 900;
  margin-left: 0.9rem; color: hsl(var(--border));
}
@media (max-width: 640px) {
  .verifier-steps { flex-direction: column; align-items: flex-start; gap: 0.5rem; }
  .v-step:not(:last-child)::after { display: none; }
}

/* ---------- Chips de ejemplo ---------- */
.example-chips {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: 0.5rem; max-width: 640px; margin: 0 auto 1rem;
}
.example-chips-label { font-size: 0.8rem; color: hsl(var(--muted-foreground)); margin-right: 0.15rem; }
.example-chip {
  font-family: inherit; font-size: 0.8rem; font-weight: 500; cursor: pointer;
  padding: 0.4rem 0.85rem; border-radius: 999px;
  background: hsl(var(--card) / 0.85); border: 1px solid hsl(var(--border));
  color: hsl(var(--foreground)); transition: border-color 0.15s ease, transform 0.15s ease;
}
.example-chip:hover { border-color: hsl(var(--primary) / 0.5); transform: translateY(-1px); }

/* ---------- Contador de caracteres ---------- */
.query-counter {
  display: block; text-align: right; margin-top: 0.4rem;
  font-size: 0.75rem; color: hsl(var(--muted-foreground));
}
.query-counter.ok { color: hsl(var(--gold)); }

/* ---------- Estado vacío del verificador ---------- */
.verifier-empty-state {
  text-align: center; max-width: 420px; margin: 2rem auto; padding: 1.5rem 1rem;
  color: hsl(var(--muted-foreground));
}
.verifier-empty-state i { font-size: 1.8rem; color: hsl(var(--border)); margin-bottom: 0.75rem; display: block; }
.verifier-empty-state p { font-size: 0.9rem; line-height: 1.6; }

.verifier-auth-gate {
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 0.6rem 0.9rem;
  max-width: 640px; margin: 0 auto 1.5rem;
  padding: 0.75rem 1.1rem;
  background: hsl(var(--accent) / 0.6);
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  font-size: 0.88rem;
  color: hsl(var(--foreground));
}
.verifier-auth-gate i.fa-lock { color: hsl(var(--gold)); }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  border: none; cursor: pointer; font-family: inherit; font-weight: 600;
  border-radius: var(--radius);
  transition: transform 0.12s ease, background-color 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.btn:active { transform: scale(0.96); }
.btn-primary {
  background: hsl(var(--primary)); color: hsl(var(--primary-foreground));
  padding: 0.9rem 2rem; font-size: 1.05rem; margin-top: 1.25rem;
  box-shadow: 0 8px 22px hsl(var(--primary) / 0.25);
}
.btn-primary:hover { background: hsl(var(--primary) / 0.9); }
.btn-primary:disabled { opacity: 0.5; cursor: not-allowed; transform: none; }

/* ===================== RESULTS ===================== */
.results { max-width: 1000px; margin: 0 auto; padding: 2.5rem 1.5rem 4rem; }
.results > * + * { margin-top: 2.5rem; }

.verdict-card {
  border: 2px solid; border-radius: var(--radius);
  padding: 1.5rem; display: flex; gap: 1rem; align-items: flex-start;
}
.verdict-card i.big { font-size: 2rem; flex-shrink: 0; margin-top: 0.15rem; }
.verdict-desmentido { background: var(--green-bg); border-color: var(--green-border); color: var(--green-text); }
.verdict-confirmado { background: var(--red-bg); border-color: var(--red-border); color: var(--red-text); }
.verdict-parcialmente_cierto { background: var(--amber-bg); border-color: var(--amber-border); color: var(--amber-text); }

.badge {
  display: inline-block; padding: 0.2rem 0.7rem; border-radius: 999px;
  font-size: 0.75rem; font-weight: 600; border: 1px solid;
}
.badge-desmentido { background: #dcfce7; color: #166534; border-color: #86efac; }
.badge-confirmado { background: #fee2e2; color: #991b1b; border-color: #fca5a5; }
.badge-parcialmente_cierto { background: #fef3c7; color: #92400e; border-color: #fcd34d; }
.verdict-card p { margin-top: 0.75rem; font-size: 0.95rem; opacity: 0.92; }

.section-title { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.5rem; }
.section-title i { color: hsl(var(--gold)); font-size: 1.3rem; }
.section-title h2 { font-size: 1.6rem; font-weight: 600; }
.section-sub { color: hsl(var(--muted-foreground)); margin-bottom: 1.5rem; }

.sources-grid {
  display: grid; gap: 1rem;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}
.source-card {
  background: hsl(var(--card) / 0.75); backdrop-filter: blur(6px);
  border: 1px solid hsl(var(--border)); border-radius: var(--radius);
  padding: 1.1rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.source-card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(0,0,0,0.08); }
.source-card .meta { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; margin-bottom: 0.6rem; }
.source-type { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.72rem; padding: 0.15rem 0.55rem; border: 1px solid hsl(var(--border)); border-radius: 999px; color: hsl(var(--muted-foreground)); }
.source-type i { color: hsl(var(--gold)); }
.source-year { font-size: 0.75rem; color: hsl(var(--muted-foreground)); }
.source-card h4 { font-family: 'Playfair Display', serif; font-size: 1.05rem; margin-bottom: 0.2rem; }
.source-author { font-size: 0.85rem; font-weight: 600; color: hsl(var(--primary) / 0.85); margin-bottom: 0.5rem; }
.source-desc { font-size: 0.85rem; color: hsl(var(--muted-foreground)); }
.source-link { display: inline-flex; align-items: center; gap: 0.3rem; margin-top: 0.75rem; font-size: 0.75rem; color: hsl(var(--primary)); }
.source-link:hover { text-decoration: underline; }

.bento-grid { display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); }
.empire-card {
  background: hsl(var(--card) / 0.65); backdrop-filter: blur(6px);
  border: 1px solid hsl(var(--border)); border-radius: var(--radius);
  padding: 1.1rem;
}
.empire-card .head { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; }
.empire-card .head .flag { font-size: 1.5rem; }
.empire-card .head h3 { font-size: 1.2rem; }
.empire-source { padding: 0.75rem; border-radius: 0.5rem; background: hsl(var(--muted) / 0.6); border: 1px solid hsl(var(--border)); }
.empire-source + .empire-source { margin-top: 0.6rem; }
.empire-source h5 { font-family: 'Manrope', sans-serif; font-size: 0.9rem; font-weight: 600; }
.empire-source small { color: hsl(var(--muted-foreground)); }
.empire-source p { font-size: 0.8rem; color: hsl(var(--muted-foreground)); margin-top: 0.35rem; }

/* Loading */
.skeleton { border-radius: var(--radius); background: linear-gradient(90deg, hsl(var(--muted)) 0%, hsl(var(--background)) 50%, hsl(var(--muted)) 100%); background-size: 200% 100%; animation: shimmer 1.5s infinite; }
@keyframes shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } }

/* ===================== STATIC / PLACEHOLDER PAGES ===================== */
.page-hero { text-align: center; padding: 3.5rem 1.5rem 1.5rem; }
.page-hero .eyebrow, .hero .eyebrow { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.8rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: hsl(var(--gold)); background: hsl(var(--gold) / 0.12); border: 1px solid hsl(var(--gold) / 0.35); padding: 0.35rem 0.9rem; border-radius: 999px; margin-bottom: 1rem; }
.page-hero h1 { font-size: clamp(2rem, 5vw, 3rem); margin-bottom: 0.75rem; }
.page-hero p { color: hsl(var(--muted-foreground)); max-width: 600px; margin: 0 auto; }

.card {
  background: hsl(var(--card)); border: 1px solid hsl(var(--border));
  border-radius: var(--radius); padding: 1.75rem;
  box-shadow: 0 4px 20px rgba(0,0,0,0.03);
}
.card + .card { margin-top: 1.25rem; }
.card h2 { font-size: 1.2rem; margin-bottom: 0.6rem; color: hsl(var(--foreground)); }
.card p { color: hsl(var(--muted-foreground)); margin-bottom: 1rem; }
.card p:last-child { margin-bottom: 0; }
.narrow { max-width: 820px; }

.placeholder-note {
  display: flex; align-items: flex-start; gap: 0.75rem;
  background: hsl(var(--accent)); border: 1px dashed hsl(var(--primary) / 0.35);
  border-radius: var(--radius); padding: 1rem 1.15rem; margin-bottom: 1.5rem;
  color: hsl(var(--primary));
}
.placeholder-note i { margin-top: 0.15rem; }
.placeholder-note span { color: hsl(var(--foreground)); font-size: 0.9rem; }

.feature-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); margin-top: 1.5rem; }
.feature { background: hsl(var(--card)); border: 1px solid hsl(var(--border)); border-radius: var(--radius); padding: 1.25rem; }
.feature .ficon { width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: hsl(var(--accent)); color: hsl(var(--gold)); font-size: 1.15rem; margin-bottom: 0.75rem; }
.feature h3 { font-size: 1.05rem; margin-bottom: 0.35rem; }
.feature p { font-size: 0.87rem; color: hsl(var(--muted-foreground)); }

/* ---------- Motor de Batallas (módulo embebido en iframe) ---------- */
.battle-engine-wrap {
  background: hsl(var(--card)); border: 1px solid hsl(var(--border));
  border-radius: var(--radius); overflow: hidden; margin-bottom: 1.75rem;
  box-shadow: 0 12px 30px rgba(20, 15, 5, 0.08);
}
.battle-engine-toolbar {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 0.75rem 1.1rem; border-bottom: 1px solid hsl(var(--border));
  font-family: 'Playfair Display', serif; font-size: 0.95rem; color: hsl(var(--foreground));
}
.battle-engine-toolbar i { color: hsl(var(--gold)); margin-right: 0.4rem; }
.battle-engine-frame { position: relative; width: 100%; height: 78vh; min-height: 560px; max-height: 820px; background: #0a0e17; }
.battle-engine-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
@media (max-width: 720px) {
  .battle-engine-frame { height: 68vh; min-height: 460px; }
  .battle-engine-toolbar { flex-direction: column; align-items: flex-start; gap: 0.6rem; }
}

/* ---------- Tienda: presentación de la marca "VERITAS" ---------- */
.veritas-teaser {
  background: var(--obsidian);
  color: var(--ivory);
  padding: 4.5rem 1.5rem;
  text-align: center;
}
.veritas-teaser-inner { max-width: 640px; margin: 0 auto; }
.veritas-eyebrow { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.75rem; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold-hex); background: rgba(212, 175, 55, 0.1); border: 1px solid rgba(212, 175, 55, 0.35); padding: 0.35rem 0.9rem; border-radius: 999px; margin-bottom: 1.25rem; }
.veritas-wordmark { font-family: "Playfair Display", serif; font-size: clamp(2.6rem, 7vw, 4.2rem); letter-spacing: 0.14em; margin: 0; color: var(--ivory); }
.veritas-tagline { font-family: "Playfair Display", serif; font-style: italic; color: var(--gold-hex); letter-spacing: 0.05em; margin: 0.25rem 0 1.75rem; font-size: 1.05rem; }
.veritas-desc { color: rgba(242, 237, 225, 0.75); line-height: 1.7; margin-bottom: 2rem; }
.veritas-pillars { display: flex; flex-wrap: wrap; justify-content: center; gap: 1.5rem 2rem; margin-bottom: 2.25rem; }
.veritas-pillars > div { display: flex; align-items: center; gap: 0.5rem; font-size: 0.82rem; color: rgba(242, 237, 225, 0.85); }
.veritas-pillars i { color: var(--gold-hex); }
.veritas-cta { background: var(--gold-hex); color: var(--obsidian); box-shadow: 0 8px 22px rgba(212, 175, 55, 0.25); }
.veritas-cta:hover { background: #c9a52f; }

/* ---------- Verificador de Personajes: cronología ---------- */
.char-timeline { position: relative; margin-top: 1.25rem; padding-left: 1.75rem; }
.char-timeline::before { content: ""; position: absolute; left: 6px; top: 4px; bottom: 4px; width: 2px; background: hsl(var(--border)); }
.char-event { position: relative; padding-bottom: 1.5rem; }
.char-event:last-child { padding-bottom: 0; }
.char-event::before { content: ""; position: absolute; left: -1.75rem; top: 3px; width: 13px; height: 13px; border-radius: 50%; background: hsl(var(--primary)); border: 3px solid hsl(var(--background)); box-shadow: 0 0 0 2px hsl(var(--border)); }
.char-event .cyear { font-weight: 700; color: hsl(var(--primary)); font-size: 0.85rem; margin-right: 0.5rem; }
.char-event .ctype { display: inline-block; font-size: 0.68rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; padding: 0.1rem 0.55rem; border-radius: 999px; background: hsl(var(--accent)); color: hsl(var(--primary)); }
.char-event h4 { margin: 0.3rem 0 0.3rem; font-size: 1.02rem; }
.char-event p { color: hsl(var(--muted-foreground)); font-size: 0.9rem; margin: 0; }

/* ===================== LIBROS (catálogo conectado a books.db) ===================== */
.books-toolbar { display: flex; gap: 0.75rem; flex-wrap: wrap; align-items: center; justify-content: space-between; margin-bottom: 1.5rem; }
.books-search { position: relative; flex: 1; min-width: 220px; }
.books-search i { position: absolute; left: 0.9rem; top: 50%; transform: translateY(-50%); color: hsl(var(--muted-foreground)); font-size: 0.85rem; }
.books-search input { width: 100%; padding: 0.65rem 1rem 0.65rem 2.35rem; border-radius: 999px; border: 1px solid hsl(var(--border)); background: hsl(var(--card)); color: hsl(var(--foreground)); font-family: inherit; font-size: 0.9rem; }
.books-search input:focus { outline: none; border-color: hsl(var(--primary) / 0.4); box-shadow: 0 0 0 4px hsl(var(--primary) / 0.1); }
#books-sort-select { padding: 0.6rem 1rem; border-radius: 999px; border: 1px solid hsl(var(--border)); background: hsl(var(--card)); color: hsl(var(--foreground)); font-family: inherit; font-size: 0.85rem; }

.books-grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); margin-bottom: 1rem; }
.book-card-skeleton { height: 320px; border-radius: var(--radius); }
.books-empty { text-align: center; color: hsl(var(--muted-foreground)); padding: 2.5rem 1rem; }

.book-card {
  position: relative; display: flex; flex-direction: column;
  background: hsl(var(--card)); border: 1px solid hsl(var(--border)); border-radius: var(--radius);
  overflow: hidden; text-decoration: none; color: inherit;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.book-card:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(0,0,0,0.08); border-color: hsl(var(--gold) / 0.4); }
.book-cover { aspect-ratio: 2 / 3; background: hsl(var(--muted)); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.book-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.book-cover-fallback { color: hsl(var(--muted-foreground)); font-size: 2rem; }
.book-card-body { padding: 0.85rem 0.9rem 1rem; display: flex; flex-direction: column; gap: 0.3rem; flex: 1; }
.book-title { font-size: 0.92rem; line-height: 1.3; font-weight: 600; color: hsl(var(--foreground)); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.book-author { font-size: 0.78rem; color: hsl(var(--muted-foreground)); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.book-price { margin-top: auto; padding-top: 0.4rem; font-family: 'Playfair Display', serif; }
.price-now { font-size: 1.05rem; color: hsl(var(--primary)); font-weight: 600; }
.price-old { font-size: 0.8rem; color: hsl(var(--muted-foreground)); text-decoration: line-through; margin-right: 0.4rem; font-family: 'Manrope', sans-serif; }
.book-badge { position: absolute; top: 0.6rem; left: 0.6rem; z-index: 1; font-size: 0.68rem; font-weight: 700; padding: 0.2rem 0.55rem; border-radius: 999px; text-transform: uppercase; letter-spacing: 0.03em; }
.book-badge-discount { background: hsl(var(--gold)); color: hsl(var(--primary-foreground)); }
.book-badge-out { background: hsl(0 0% 40%); color: #fff; }
.book-badge-order { background: hsl(210 15% 88%); color: hsl(210 15% 25%); }

/* Ficha de producto (detalle de libro) */
.back-link { display: inline-flex; align-items: center; gap: 0.5rem; color: hsl(var(--muted-foreground)); text-decoration: none; font-size: 0.88rem; font-weight: 500; }
.back-link:hover { color: hsl(var(--primary)); }
.book-detail { display: grid; grid-template-columns: minmax(180px, 260px) 1fr; gap: 2rem; margin: 1.5rem 0 2rem; }
.book-detail-cover { border-radius: var(--radius); overflow: hidden; background: hsl(var(--muted)); aspect-ratio: 2/3; box-shadow: 0 12px 30px rgba(0,0,0,0.1); }
.book-detail-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.book-detail-info h1 { font-size: 1.7rem; margin-bottom: 0.3rem; }
.book-detail-subtitle { color: hsl(var(--muted-foreground)); font-style: italic; margin-bottom: 0.5rem; }
.book-detail-author { color: hsl(var(--muted-foreground)); margin-bottom: 0.9rem; }
.book-detail-price { display: flex; align-items: baseline; gap: 0.6rem; font-family: 'Playfair Display', serif; font-size: 1.6rem; margin-bottom: 0.75rem; }
.book-detail-price .book-badge { position: static; }
.book-availability { font-size: 0.85rem; font-weight: 600; margin-bottom: 1.25rem; display: flex; align-items: center; gap: 0.4rem; }
.book-availability.is-in { color: #1f8b4c; }
.book-availability.is-out { color: hsl(0 60% 45%); }
.book-availability.is-external { color: hsl(var(--muted-foreground)); }
.book-synopsis, .book-meta { margin-top: 1.25rem; }
.book-meta-row { display: flex; justify-content: space-between; gap: 1rem; padding: 0.55rem 0; border-bottom: 1px solid hsl(var(--border)); font-size: 0.88rem; }
.book-meta-row:last-child { border-bottom: none; }
.book-meta-label { color: hsl(var(--muted-foreground)); }
.book-meta-value { font-weight: 600; text-align: right; }
@media (max-width: 640px) {
  .book-detail { grid-template-columns: 1fr; }
  .book-detail-cover { max-width: 220px; margin: 0 auto; }
}

/* Planes cards */
.plans-grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); margin-top: 2rem; }
.plan { position: relative; background: hsl(var(--card)); border: 1px solid hsl(var(--border)); border-radius: var(--radius); padding: 1.75rem; display: flex; flex-direction: column; }
.plan.featured { border-color: hsl(var(--gold)); box-shadow: 0 12px 30px hsl(var(--gold) / 0.18); }
.plan .tag { position: absolute; top: -0.7rem; left: 50%; transform: translateX(-50%); background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); font-size: 0.7rem; font-weight: 600; padding: 0.25rem 0.8rem; border-radius: 999px; }
.plan h3 { font-size: 1.3rem; margin-bottom: 0.35rem; }
.plan .price { font-family: 'Playfair Display', serif; font-size: 2.2rem; color: hsl(var(--primary)); margin: 0.5rem 0 0.25rem; }
.plan .price small { font-size: 0.85rem; color: hsl(var(--muted-foreground)); font-family: 'Manrope', sans-serif; }
.plan ul { list-style: none; margin: 1.25rem 0; display: flex; flex-direction: column; gap: 0.6rem; flex: 1; }
.plan li { display: flex; align-items: flex-start; gap: 0.5rem; font-size: 0.9rem; color: hsl(var(--foreground)); }
.plan li i { color: hsl(var(--gold)); margin-top: 0.2rem; }
.btn-outline { background: transparent; border: 1px solid hsl(var(--primary)); color: hsl(var(--primary)); padding: 0.7rem 1.25rem; }
.btn-outline:hover { background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); }
.btn-block { width: 100%; }

/* ===================== HISTORY PANEL ===================== */
.history-panel {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 60;
  width: 460px; max-width: 92vw;
  background: hsl(var(--background));
  border-left: 1px solid hsl(var(--border));
  transform: translateX(100%);
  transition: transform 0.3s cubic-bezier(0.4,0,0.2,1);
  display: flex; flex-direction: column;
  box-shadow: -20px 0 40px rgba(0,0,0,0.12);
}
.history-panel.open { transform: translateX(0); }
.history-head { padding: 1.5rem; border-bottom: 1px solid hsl(var(--border)); }
.history-head h2 { font-size: 1.35rem; }
.history-head p { color: hsl(var(--muted-foreground)); font-size: 0.9rem; margin-top: 0.25rem; }
.history-body { flex: 1; overflow-y: auto; padding: 1.25rem; }
.history-item { border: 1px solid hsl(var(--border)); border-radius: var(--radius); padding: 1rem; margin-bottom: 0.75rem; cursor: pointer; transition: background-color 0.2s ease; }
.history-item:hover { background: hsl(var(--accent)); }
.history-item .q { font-size: 0.9rem; font-weight: 500; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.history-item .row { display: flex; align-items: center; gap: 0.5rem; margin-top: 0.5rem; }
.history-item .date { font-size: 0.75rem; color: hsl(var(--muted-foreground)); }
.link-btn { background: none; border: none; cursor: pointer; font-family: inherit; font-size: 0.8rem; color: hsl(var(--muted-foreground)); display: inline-flex; align-items: center; gap: 0.3rem; }
.link-btn:hover { color: hsl(var(--primary)); }
.link-btn.danger:hover { color: #dc2626; }
.history-empty { text-align: center; padding: 3rem 1rem; color: hsl(var(--muted-foreground)); }
.history-empty i { font-size: 2.5rem; opacity: 0.4; margin-bottom: 0.75rem; display: block; }

/* ===================== FOOTER FLOATING BAR ===================== */
.footer-bar {
  position: fixed; left: 50%; bottom: 1rem; transform: translateX(-50%);
  z-index: 45;
  display: flex; align-items: center; gap: 0.5rem;
  background: hsl(var(--card) / 0.9); backdrop-filter: blur(14px);
  border: 1px solid hsl(var(--border)); border-radius: 999px;
  padding: 0.4rem 0.5rem;
  box-shadow: 0 10px 30px rgba(0,0,0,0.12);
  transition: transform 0.3s ease, opacity 0.3s ease;
}
.footer-bar.collapsed { transform: translateX(-50%) translateY(150%); }
.footer-chip {
  display: inline-flex; align-items: center; gap: 0.4rem;
  padding: 0.5rem 0.85rem; border-radius: 999px;
  font-size: 0.82rem; font-weight: 500;
  color: hsl(var(--foreground)); background: transparent;
  border: none; cursor: pointer; font-family: inherit;
  transition: background-color 0.2s ease, color 0.2s ease;
  white-space: nowrap;
}
.footer-chip:hover { background: hsl(var(--accent)); color: hsl(var(--primary)); }
.footer-chip i { color: hsl(var(--gold)); }
.footer-toggle {
  position: fixed; left: 50%; bottom: 1rem; transform: translateX(-50%);
  z-index: 44; opacity: 0; visibility: hidden;
  transition: opacity 0.3s ease;
}
.footer-toggle.show { opacity: 1; visibility: visible; }

/* ===================== COOKIE MODAL ===================== */
.modal-overlay {
  position: fixed; inset: 0; z-index: 70;
  background: rgba(0,0,0,0.5);
  display: none; align-items: center; justify-content: center;
  padding: 1.5rem;
}
.modal-overlay.open { display: flex; animation: fadeIn 0.2s ease; }
.modal {
  background: hsl(var(--card)); border-radius: var(--radius);
  max-width: 520px; width: 100%; max-height: 85vh; overflow-y: auto;
  padding: 1.75rem; box-shadow: 0 30px 60px rgba(0,0,0,0.25);
}
.modal-header h2 { display: flex; align-items: center; gap: 0.5rem; font-size: 1.3rem; }
.modal-header h2 i { color: hsl(var(--gold)); }
.modal-header p { color: hsl(var(--muted-foreground)); font-size: 0.9rem; margin: 0.5rem 0 1.25rem; }
.cookie-category { padding: 0.9rem 0; border-top: 1px solid hsl(var(--border)); }
.cookie-category .chead { display: flex; align-items: center; gap: 0.75rem; }
.cookie-category .cname { font-weight: 600; font-family: 'Manrope', sans-serif; }
.required-badge { font-size: 0.68rem; background: hsl(var(--muted)); color: hsl(var(--muted-foreground)); padding: 0.1rem 0.5rem; border-radius: 999px; margin-left: auto; }
.cookie-category .cdesc { font-size: 0.82rem; color: hsl(var(--muted-foreground)); margin-top: 0.35rem; }

/* toggle switch */
.switch { position: relative; display: inline-block; width: 42px; height: 24px; flex-shrink: 0; }
.switch input { opacity: 0; width: 0; height: 0; }
.slider { position: absolute; inset: 0; background: hsl(var(--border)); border-radius: 999px; transition: 0.2s; cursor: pointer; }
.slider::before { content: ''; position: absolute; height: 18px; width: 18px; left: 3px; top: 3px; background: #fff; border-radius: 50%; transition: 0.2s; }
.switch input:checked + .slider { background: hsl(var(--primary)); }
.switch input:checked + .slider::before { transform: translateX(18px); }
.switch input:disabled + .slider { opacity: 0.6; cursor: not-allowed; }
.modal-buttons { display: flex; gap: 0.6rem; margin-top: 1.5rem; flex-wrap: wrap; }
.modal-buttons .btn { flex: 1; padding: 0.7rem 1rem; font-size: 0.88rem; min-width: 120px; }
.btn-ghost { background: hsl(var(--muted)); color: hsl(var(--foreground)); }
.btn-ghost:hover { background: hsl(var(--border)); }

/* ===================== PROFILE (header) ===================== */
.profile-area { display: flex; align-items: center; }
.btn-enter {
  display: inline-flex; align-items: center; gap: 0.5rem;
  padding: 0.5rem 1rem; border-radius: 999px; cursor: pointer; font-family: inherit;
  font-weight: 600; font-size: 0.88rem; border: 1px solid hsl(var(--primary));
  background: hsl(var(--primary)); color: hsl(var(--primary-foreground));
  transition: background-color 0.2s ease, transform 0.12s ease;
}
.btn-enter:hover { background: hsl(var(--primary) / 0.9); }
.btn-enter:active { transform: scale(0.96); }
.profile-trigger {
  display: inline-flex; align-items: center; gap: 0.5rem;
  padding: 0.3rem 0.6rem 0.3rem 0.35rem; border-radius: 999px; cursor: pointer;
  border: 1px solid hsl(var(--border)); background: hsl(var(--card) / 0.8); font-family: inherit;
  transition: background-color 0.2s ease;
}
.profile-trigger:hover { background: hsl(var(--accent)); }
.avatar {
  width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: hsl(var(--primary)); color: hsl(var(--primary-foreground));
  font-weight: 700; font-size: 0.85rem; text-transform: uppercase;
}
.profile-name { font-size: 0.85rem; font-weight: 600; max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-wrap { position: relative; }
.profile-menu {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 50;
  min-width: 220px; background: hsl(var(--card)); border: 1px solid hsl(var(--border));
  border-radius: var(--radius); box-shadow: 0 16px 40px rgba(0,0,0,0.14);
  padding: 0.5rem; display: none;
}
.profile-menu.open { display: block; animation: fadeIn 0.15s ease; }
.profile-menu .pm-head { padding: 0.6rem 0.7rem; border-bottom: 1px solid hsl(var(--border)); margin-bottom: 0.35rem; }
.profile-menu .pm-head .nm { font-weight: 600; font-size: 0.9rem; }
.profile-menu .pm-head .em { font-size: 0.78rem; color: hsl(var(--muted-foreground)); }
.profile-menu .pm-item {
  display: flex; align-items: center; gap: 0.6rem; width: 100%;
  padding: 0.6rem 0.7rem; border-radius: 0.5rem; border: none; background: none;
  font-family: inherit; font-size: 0.88rem; color: hsl(var(--foreground)); cursor: pointer; text-align: left;
  transition: background-color 0.15s ease, color 0.15s ease;
}
.profile-menu .pm-item:hover { background: hsl(var(--accent)); color: hsl(var(--primary)); }
.profile-menu .pm-item i { width: 18px; text-align: center; color: hsl(var(--gold)); }
.profile-menu .pm-item.danger:hover { color: #dc2626; }
.profile-menu .pm-item.danger:hover i { color: #dc2626; }

/* Auth modal fields + tabs */
.auth-tabs { display: flex; gap: 0.25rem; background: hsl(var(--muted)); padding: 0.25rem; border-radius: 999px; margin-bottom: 1.25rem; }
.auth-tab { flex: 1; padding: 0.5rem; border: none; background: none; border-radius: 999px; cursor: pointer; font-family: inherit; font-weight: 600; font-size: 0.85rem; color: hsl(var(--muted-foreground)); transition: background-color 0.2s ease, color 0.2s ease; }
.auth-tab.active { background: hsl(var(--card)); color: hsl(var(--primary)); box-shadow: 0 2px 6px rgba(0,0,0,0.06); }
.field { margin-bottom: 1rem; }
.field label { display: block; font-size: 0.82rem; font-weight: 600; margin-bottom: 0.35rem; }
.field input { width: 100%; padding: 0.7rem 0.85rem; font-family: inherit; font-size: 0.95rem; border: 1px solid hsl(var(--border)); border-radius: 0.5rem; background: hsl(var(--background)); color: hsl(var(--foreground)); }
.field input:focus { outline: none; border-color: hsl(var(--primary) / 0.5); box-shadow: 0 0 0 3px hsl(var(--primary) / 0.1); }
.err-msg { color: #dc2626; font-size: 0.85rem; margin: 0 0 0.75rem; min-height: 1rem; }

/* ===================== TOAST ===================== */
.toast-wrap { position: fixed; top: 1rem; left: 50%; transform: translateX(-50%); z-index: 90; display: flex; flex-direction: column; gap: 0.5rem; align-items: center; }
.toast { padding: 0.75rem 1.25rem; border-radius: var(--radius); font-size: 0.9rem; font-weight: 500; box-shadow: 0 10px 30px rgba(0,0,0,0.15); animation: fadeIn 0.25s ease; background: hsl(var(--card)); border: 1px solid hsl(var(--border)); }
.toast.success { border-left: 4px solid #16a34a; }
.toast.error { border-left: 4px solid #dc2626; }

/* ===================== PAGE FOOTER ===================== */
.site-footer { border-top: 1px solid hsl(var(--border)); padding: 2.5rem 1.5rem 6rem; margin-top: 3rem; background: hsl(var(--secondary) / 0.5); }
.site-footer .fcols { max-width: 1100px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 2rem; justify-content: space-between; }
.site-footer .fbrand { max-width: 300px; }
.site-footer .fbrand p { color: hsl(var(--muted-foreground)); font-size: 0.88rem; margin-top: 0.5rem; }
.site-footer .fcol h4 { font-family: 'Manrope', sans-serif; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.1em; color: hsl(var(--gold)); margin-bottom: 0.75rem; }
.site-footer .fcol a, .site-footer .fcol button { display: block; font-size: 0.9rem; color: hsl(var(--foreground)); margin-bottom: 0.5rem; background: none; border: none; cursor: pointer; font-family: inherit; padding: 0; text-align: left; transition: color 0.2s ease; }
.site-footer .fcol a:hover, .site-footer .fcol button:hover { color: hsl(var(--primary)); }
.site-footer .copyright { max-width: 1100px; margin: 2rem auto 0; padding-top: 1.5rem; border-top: 1px solid hsl(var(--border)); font-size: 0.8rem; color: hsl(var(--muted-foreground)); }

/* ===================== PUBLICIDAD ===================== */
/* Espacios reservados con altura fija (sin saltos de layout).
   Banners:  728×90 (≥900px) → 468×60 (tablet) → 320×50 (móvil).
   Raíles laterales: 160×600 (≥1480px) / 120×600 (≥1400px); en pantallas
   más estrechas o bajas se ocultan para no restar espacio al contenido.
   No se muestran en Tienda, Planes ni Aviso legal. */
:root { --rail-w: 160px; --rail-gap: 24px; }

.ad-slot {
  display: flex; flex-direction: column; align-items: center; gap: 0.3rem;
  margin: 1.75rem auto; padding: 0 1rem; max-width: 100%;
}
.ad-label {
  font-size: 0.62rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase;
  color: hsl(var(--muted-foreground)); opacity: 0.8;
}
body[data-route="inicio"] .ad-label,
body[data-route="comunidad"] .ad-label {
  background: hsl(var(--card) / 0.85); padding: 0.15rem 0.6rem; border-radius: 999px;
}
.ad-box {
  display: flex; align-items: center; justify-content: center; text-align: center;
  max-width: 100%; overflow: hidden;
  border: 1px dashed hsl(var(--gold) / 0.5); border-radius: 0.5rem;
  background: hsl(var(--card) / 0.88);
  backdrop-filter: blur(4px);
  color: hsl(var(--muted-foreground)); font-size: 0.75rem; letter-spacing: 0.04em;
}
.ad-box:empty::after { content: "Espacio publicitario"; }
.ad-box.is-filled { border: 0; background: transparent; }
.ad-off { display: none !important; }
/* AdSense sin anuncio disponible: colapsar el espacio entero */
.ad-slot:has(ins.adsbygoogle[data-ad-status="unfilled"]) { display: none; }

.ad-banner .ad-box { width: 728px; height: 90px; }
.results > .ad-slot { margin: 2.5rem auto 0; padding: 0; }

/* Raíles laterales (fixed, alineados con el contenedor de 1100px) */
.ad-rail { display: none; position: fixed; top: 96px; z-index: 20; margin: 0; padding: 0; }
.ad-rail .ad-box { width: var(--rail-w); height: 600px; padding: 0.5rem; }
.ad-rail-left  { left: calc(50% - 550px - var(--rail-gap) - var(--rail-w)); }
.ad-rail-right { left: calc(50% + 550px + var(--rail-gap)); }
@media (min-width: 1400px) and (min-height: 720px) {
  :root { --rail-w: 120px; --rail-gap: 16px; }
  .ad-rail { display: flex; }
}
@media (min-width: 1480px) and (min-height: 720px) {
  :root { --rail-w: 160px; --rail-gap: 24px; }
}

/* Pantallas medianas: banner compacto */
@media (max-width: 899px) {
  .ad-banner .ad-box { width: 468px; height: 60px; }
  .ad-slot { margin: 1.25rem auto; }
  .results > .ad-slot { margin: 1.75rem auto 0; }
}
/* Pantallas pequeñas: banner mínimo */
@media (max-width: 520px) {
  .ad-banner .ad-box { width: 320px; height: 50px; }
  .ad-slot { margin: 1rem auto; padding: 0 0.75rem; }
  .ad-label { font-size: 0.56rem; }
  .results > .ad-slot { margin: 1.5rem auto 0; }
}


/* Publicidad dentro de la comunidad: discreta y sin romper el panel. */
.community-info .community-ad { margin: 0 0 1rem; padding: 0; }
.community-info .community-ad .ad-box { width: 100%; max-width: 100%; height: 90px; }
.community-info .community-ad .ad-label { align-self: center; }
@media (max-width: 1100px) {
  .community-info .community-ad { display: none; }
}

/* Sin publicidad en Tienda, Planes y Aviso legal (ni al imprimir) */
body[data-route="tienda"] .ad-slot,
body[data-route="planes"] .ad-slot,
body[data-route="aviso-legal"] .ad-slot { display: none; }
@media print { .ad-slot { display: none !important; } }

/* ===================== RESPONSIVE ===================== */
@media (max-width: 860px) {
  .main-nav { display: none; }
  .mobile-menu-toggle { display: inline-flex; }
  .bento-grid { grid-template-columns: 1fr; }
  .footer-chip span { display: none; }
  .footer-chip { padding: 0.5rem 0.7rem; }
}
@media (max-width: 520px) {
  .site-header { padding: 0.75rem 1rem; }
  .brand span { display: none; }
}

/* ===================== POTENCIAS ANTE LA AFIRMACIÓN ===================== */
.powers-box { border: 2px solid hsl(var(--border)); border-radius: var(--radius); padding: 1.5rem; background: hsl(var(--card) / 0.7); }
.powers-grid, .powers-loading { display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); }
.power-item { padding: 1rem; border-radius: 0.5rem; background: hsl(var(--muted) / 0.6); border: 1px solid hsl(var(--border)); }
.power-item .head { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem; }
.power-item .head .flag { font-size: 1.4rem; }
.power-item .head h3 { font-size: 1.1rem; }
.power-item p { font-size: 0.88rem; color: hsl(var(--foreground) / 0.85); }
.power-src { display: block; margin-top: 0.6rem; font-size: 0.75rem; color: hsl(var(--muted-foreground)); }
.power-src i { color: hsl(var(--gold)); margin-right: 0.3rem; }
.powers-error { color: hsl(var(--muted-foreground)); margin-bottom: 0.5rem; }
@media (max-width: 720px) { .powers-grid, .powers-loading { grid-template-columns: 1fr; } }

/* ===================== CURSOR PERSONALIZADO ===================== */
/* Cursor por defecto: pequeño rosetón/diana en dorado, acorde a la
   estética "mapa antiguo" del sitio. */
html, body {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='8.5' fill='none' stroke='%23c9a227' stroke-width='2'/%3E%3Ccircle cx='12' cy='12' r='2' fill='%23c9a227'/%3E%3Cpath d='M12 1v4M12 19v4M1 12h4M19 12h4' stroke='%23c9a227' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") 12 12, auto;
}

/* Cursor sobre elementos interactivos: lupa dorada, en línea con el
   icono del Verificador. */
a,
button,
.btn,
.nav-link,
.mobile-nav-link,
.icon-btn,
.verifier-tab,
.example-chip,
.auth-tab,
.history-item,
.link-btn,
.switch,
.slider,
.footer-chip,
label[for],
select,
input[type="checkbox"],
input[type="radio"],
input[type="submit"],
[role="button"],
[onclick],
[data-route] {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 26 26'%3E%3Ccircle cx='11' cy='11' r='7' fill='none' stroke='%23c9a227' stroke-width='2.5'/%3E%3Cline x1='16.2' y1='16.2' x2='23' y2='23' stroke='%23c9a227' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E") 11 11, pointer;
}

.btn-primary:disabled,
button:disabled,
input:disabled {
  cursor: not-allowed;
}

/* ===================== PÁGINA DE PAGO (Stripe) ===================== */
.payment-summary {
  padding: 1.25rem;
}
.payment-summary-row {
  display: flex;
  align-items: center;
  gap: 1.25rem;
}
.payment-summary-cover {
  flex: 0 0 84px;
  width: 84px;
  aspect-ratio: 2 / 3;
  border-radius: 0.5rem;
  overflow: hidden;
  background: hsl(var(--muted));
  box-shadow: 0 6px 16px rgba(20, 15, 5, 0.18);
}
.payment-summary-cover img,
.payment-summary-cover .book-cover-fallback {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: flex;
  align-items: center;
  justify-content: center;
}
.payment-summary-info h2 {
  font-size: 1.15rem;
  margin: 0 0 0.25rem;
  line-height: 1.3;
}
.payment-summary-info .book-author {
  margin: 0 0 0.5rem;
}
.payment-summary-price {
  font-family: var(--font-serif, Georgia, serif);
  font-size: 1.6rem;
  font-weight: 700;
  color: hsl(var(--gold));
}
.payment-card {
  background: hsl(var(--card));
  border: 1px solid hsl(var(--border));
  border-radius: 1.25rem;
  padding: 1.75rem;
  box-shadow: 0 20px 45px rgba(20, 15, 5, 0.14), 0 2px 8px rgba(20, 15, 5, 0.06);
}
.payment-card h2 {
  font-size: 1.15rem;
}
#payment-message {
  min-height: 1.25rem;
  margin: 0.85rem 0;
}
#payment-message.success {
  color: hsl(142 60% 32%);
}
#payment-submit-btn {
  margin-top: 0.25rem;
}
.payment-success-card {
  text-align: center;
  padding: 2.25rem 1.5rem;
}
.payment-success-card > i {
  font-size: 3rem;
  color: hsl(142 60% 38%);
  margin-bottom: 0.75rem;
}
.payment-success-card h2 {
  margin-bottom: 0.5rem;
}
.payment-success-card p {
  color: hsl(var(--muted-foreground));
  margin-bottom: 1.25rem;
}
@media (max-width: 520px) {
  .payment-summary-row { gap: 0.9rem; }
  .payment-summary-cover { flex-basis: 68px; width: 68px; }
  .payment-card { padding: 1.25rem; }
}

/* ---------- Biblioteca de ebooks ---------- */
.library-list { display: grid; gap: 0.9rem; }
.library-item { display: flex; align-items: center; gap: 1rem; padding: 1rem; }
.library-cover { flex: 0 0 56px; width: 56px; aspect-ratio: 2 / 3; border-radius: 0.4rem; overflow: hidden; background: hsl(var(--muted)); }
.library-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.library-cover .book-cover-fallback { width: 100%; height: 100%; }
.library-info { flex: 1; min-width: 0; }
.library-info h3 { margin: 0 0 0.15rem; font-size: 1.05rem; }
.library-info .book-author { margin: 0; }
.library-note { font-size: 0.85rem; color: hsl(var(--muted-foreground)); }
.library-empty { text-align: center; padding: 2.5rem 1.5rem; }
.library-empty > i { font-size: 2.2rem; color: hsl(var(--gold)); display: block; margin-bottom: 0.75rem; }
.library-empty p { color: hsl(var(--muted-foreground)); margin-bottom: 1.25rem; }
@media (max-width: 520px) {
  .library-item { flex-wrap: wrap; }
  .library-action { width: 100%; }
  .library-action .btn { width: 100%; }
}

/* Versión extensa del verificador */
.extended-actions { margin-top: 1rem; }
.extended-btn { font-size: 0.9rem; padding: 0.55rem 1rem; display: inline-flex; align-items: center; gap: 0.5rem; }
.extended-box { border: 2px solid hsl(var(--border)); border-radius: var(--radius); padding: 1.5rem; background: hsl(var(--card) / 0.7); margin-top: 1.5rem; }
.extended-section { margin-top: 1.25rem; }
.extended-section h3 { font-size: 1.15rem; margin-bottom: 0.5rem; }
.extended-section p { font-size: 0.95rem; line-height: 1.7; color: hsl(var(--foreground) / 0.88); margin-bottom: 0.75rem; }

/* ============================================================
   COMUNIDAD — experiencia tipo chat / Discord, integrada con VERITAS
   ============================================================ */
.community-page { padding: 0 !important; }
.community-app { height: calc(100vh - 82px); min-height: 620px; display:grid; grid-template-columns: 260px minmax(0,1fr) 270px; background: hsl(var(--card)); border-top:1px solid hsl(var(--border)); overflow:hidden; }
.community-sidebar { background: linear-gradient(180deg, hsl(var(--primary)) 0%, hsl(240 8% 9%) 100%); color:#f4eee1; display:flex; flex-direction:column; min-width:0; }
.community-server { height:72px; display:flex; align-items:center; gap:.75rem; padding:.8rem 1rem; border-bottom:1px solid rgba(255,255,255,.09); box-shadow:0 1px 8px rgba(0,0,0,.18); }
.community-server-mark { width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#d4af37,#9c7a24);color:#0b0b0d;flex:none; }
.community-server-copy { display:flex; flex-direction:column; min-width:0; }
.community-server-copy strong { font-family:'Playfair Display',serif; letter-spacing:.08em; font-size:.95rem; }
.community-server-copy span { font-size:.66rem; color:#bdb7ac; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.community-icon-btn { border:0; background:transparent; color:inherit; width:32px;height:32px;border-radius:8px;display:grid;place-items:center;cursor:pointer;transition:.2s; }
.community-icon-btn:hover { background:rgba(255,255,255,.1); }
.community-server .community-icon-btn { display:none; margin-left:auto; }
.community-sidebar-scroll { flex:1; overflow:auto; padding:.85rem .65rem; }
.community-sidebar-title { display:flex; justify-content:space-between; align-items:center; padding:.35rem .55rem .5rem; color:#8f8a81; font-size:.64rem; font-weight:800; letter-spacing:.1em; }
.community-sidebar-title i { font-size:.72rem; }
.community-online-title { margin-top:1.4rem; }
.community-channel-list { display:flex; flex-direction:column; gap:.15rem; }
.community-channel { width:100%; border:0; background:transparent; color:#bdb7ac; display:flex; align-items:center; gap:.6rem; text-align:left; padding:.62rem .55rem; border-radius:8px; cursor:pointer; transition:.18s; }
.community-channel:hover { background:rgba(255,255,255,.07); color:#f5f0e6; }
.community-channel.active { background:rgba(212,175,55,.14); color:#f7e9b6; }
.community-channel-icon { width:25px; text-align:center; color:#858078; font-size:.9rem; flex:none; }
.community-channel.active .community-channel-icon { color:#d4af37; }
.community-channel-text { min-width:0; display:flex; flex-direction:column; flex:1; }
.community-channel-text strong { font-size:.83rem; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.community-channel-text small { font-size:.63rem; color:#77736d; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:1px; }
.community-channel.active .community-channel-text small { color:#a99a70; }
.community-channel-arrow { font-size:.6rem; opacity:.7; }
.community-side-note { display:flex; gap:.55rem; color:#8e8980; font-size:.7rem; line-height:1.5; padding:.5rem .55rem; }
.community-side-note i { color:#b79a3e; margin-top:2px; }
.community-userbar { min-height:60px; padding:.65rem .7rem; display:flex; align-items:center; gap:.6rem; background:rgba(0,0,0,.18); border-top:1px solid rgba(255,255,255,.07); }
.community-avatar,.community-message-avatar { width:34px;height:34px;border-radius:50%;display:grid;place-items:center;position:relative;background:linear-gradient(135deg,#d4af37,#8e7024);color:#111;font-weight:800;font-size:.78rem;flex:none; }
.community-avatar.guest { background:#2a2a2e;color:#bdb7ac; }
.community-status-dot { position:absolute; right:-1px; bottom:0; width:9px;height:9px;border:2px solid #151518;border-radius:50%;background:#48b36a; }
.community-user-copy { min-width:0; flex:1; display:flex; flex-direction:column; }
.community-user-copy strong { font-size:.75rem; white-space:nowrap; overflow:hidden;text-overflow:ellipsis; }
.community-user-copy small { color:#77736d; font-size:.62rem; }
.community-login-mini { border:0;background:#d4af37;color:#111;border-radius:6px;padding:.35rem .55rem;font-size:.65rem;font-weight:800;cursor:pointer; }
.community-main { min-width:0; display:flex; flex-direction:column; background:hsl(var(--background)); }
.community-chat-header { min-height:72px; display:flex;align-items:center;gap:.8rem;padding:.75rem 1.1rem;border-bottom:1px solid hsl(var(--border));background:hsl(var(--card)); }
.community-mobile-channels { display:none; border:0;background:hsl(var(--muted));color:hsl(var(--foreground));width:36px;height:36px;border-radius:9px; }
.community-channel-heading { display:flex;align-items:center;gap:.7rem;min-width:0;flex:1; }
.community-channel-symbol { width:38px;height:38px;border-radius:10px;background:hsl(var(--accent));color:hsl(var(--gold));display:grid;place-items:center;flex:none; }
.community-channel-heading h2 { font-family:'Manrope',sans-serif;font-size:1rem;font-weight:800;margin:0; }
.community-channel-heading p { margin:2px 0 0;color:hsl(var(--muted-foreground));font-size:.7rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.community-chat-actions { display:flex;align-items:center;gap:.25rem; }
.community-live { color:hsl(var(--muted-foreground));font-size:.67rem;display:flex;align-items:center;gap:.35rem;padding:.35rem .55rem; }
.community-live i { font-size:.42rem;color:#45b36b; }
.community-messages { flex:1;overflow:auto;padding:1rem 1.25rem 1.4rem;scroll-behavior:smooth; }
.community-message { display:flex;gap:.75rem;padding:.5rem .65rem;border-radius:9px;margin-bottom:.15rem;transition:background .15s; }
.community-message:hover { background:hsl(var(--muted) / .55); }
.community-message.pinned { background:hsl(var(--accent) / .45); border-left:2px solid hsl(var(--gold)); }
.community-message-avatar { width:36px;height:36px; }
.community-message-body { min-width:0;flex:1; }
.community-message-meta { display:flex;align-items:center;gap:.55rem;min-height:18px; }
.community-message-meta strong { font-family:'Manrope',sans-serif;font-size:.8rem; }
.community-message-meta time { color:hsl(var(--muted-foreground));font-size:.61rem; }
.community-pin { font-size:.59rem;color:hsl(var(--gold));display:inline-flex;gap:.25rem;align-items:center; }
.community-message-text { color:hsl(var(--foreground));font-size:.82rem;line-height:1.6;word-break:break-word;margin-top:.08rem; }
.community-empty,.community-loading { height:100%;min-height:260px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:hsl(var(--muted-foreground)); }
.community-empty h3 { font-family:'Manrope',sans-serif;font-size:1rem;margin:.65rem 0 .2rem;color:hsl(var(--foreground)); }
.community-empty p { font-size:.75rem;max-width:360px; }
.community-empty > i { font-size:1.5rem;color:hsl(var(--gold)); }
.community-empty-icon { width:54px;height:54px;border-radius:16px;background:hsl(var(--accent));display:grid;place-items:center;color:hsl(var(--gold));font-size:1.15rem; }
.community-loading { flex-direction:row;gap:.6rem;font-size:.75rem; }
.community-composer-wrap { padding:.65rem 1.15rem .8rem;border-top:1px solid hsl(var(--border));background:hsl(var(--card)); }
.community-compose-box { display:flex;align-items:flex-end;gap:.5rem;background:hsl(var(--muted));border:1px solid hsl(var(--border));border-radius:12px;padding:.45rem .5rem .45rem .55rem;transition:border-color .2s,box-shadow .2s; }
.community-compose-box:focus-within { border-color:hsl(var(--gold) / .6);box-shadow:0 0 0 3px hsl(var(--gold) / .08); }
.community-compose-plus,.community-send { width:32px;height:32px;border:0;border-radius:8px;display:grid;place-items:center;cursor:pointer;flex:none; }
.community-compose-plus { background:hsl(var(--card));color:hsl(var(--muted-foreground)); }
.community-send { background:hsl(var(--primary));color:hsl(var(--primary-foreground)); }
[data-theme="dark"] .community-send { background:hsl(var(--gold));color:#111; }
.community-compose-box textarea { flex:1;resize:none;border:0;outline:0;background:transparent;color:hsl(var(--foreground));font:inherit;font-size:.78rem;line-height:1.5;padding:.38rem .15rem;max-height:140px; }
.community-compose-box textarea::placeholder { color:hsl(var(--muted-foreground)); }
.community-compose-box.locked { align-items:center;color:hsl(var(--muted-foreground));font-size:.72rem;padding:.7rem .8rem; }
.community-compose-box.locked i { color:hsl(var(--gold)); }
.community-compose-box.locked a { margin-left:auto;color:hsl(var(--gold));font-weight:800; }
.community-compose-hint { color:hsl(var(--muted-foreground));font-size:.58rem;padding:.3rem .25rem 0; }
kbd { border:1px solid hsl(var(--border));border-bottom-width:2px;border-radius:4px;padding:0 .22rem;font-size:.56rem; }
.community-info { border-left:1px solid hsl(var(--border));background:hsl(var(--card));padding:1.25rem 1rem;overflow:auto; }
.community-info-head { display:flex;align-items:center;gap:.45rem;font-size:.68rem;font-weight:800;color:hsl(var(--muted-foreground));text-transform:uppercase;letter-spacing:.08em;margin-bottom:1.3rem; }
.community-info-icon { width:54px;height:54px;border-radius:16px;background:hsl(var(--accent));display:grid;place-items:center;color:hsl(var(--gold));font-size:1.25rem;margin-bottom:.8rem; }
.community-info h3 { font-family:'Manrope',sans-serif;font-size:1rem;margin-bottom:.35rem; }
.community-info > p { color:hsl(var(--muted-foreground));font-size:.7rem;line-height:1.6; }
.community-info-divider { height:1px;background:hsl(var(--border));margin:1rem 0; }
.community-info-rule { display:flex;gap:.65rem;margin-bottom:.95rem; }
.community-info-rule > i { width:28px;height:28px;border-radius:8px;background:hsl(var(--accent));color:hsl(var(--gold));display:grid;place-items:center;font-size:.7rem;flex:none; }
.community-info-rule div { display:flex;flex-direction:column;gap:1px; }
.community-info-rule strong { font-size:.68rem; }
.community-info-rule span { color:hsl(var(--muted-foreground));font-size:.62rem;line-height:1.45; }
.community-auth-inline { display:none; }

@media (max-width: 1100px) {
  .community-app { grid-template-columns:230px minmax(0,1fr); }
  .community-info { display:none; }
}
@media (max-width: 760px) {
  .community-app { height:calc(100vh - 68px);min-height:560px;grid-template-columns:1fr;position:relative; }
  .community-sidebar { position:absolute;z-index:20;inset:0 auto 0 0;width:min(82vw,300px);transform:translateX(-102%);transition:transform .22s ease;box-shadow:10px 0 35px rgba(0,0,0,.25); }
  .community-app.sidebar-open .community-sidebar { transform:translateX(0); }
  .community-server .community-icon-btn { display:grid; }
  .community-mobile-channels { display:grid;place-items:center; }
  .community-messages { padding-left:.55rem;padding-right:.55rem; }
  .community-composer-wrap { padding-left:.65rem;padding-right:.65rem; }
}
@media (max-width: 480px) {
  .community-chat-header { padding:.6rem .65rem;min-height:64px; }
  .community-live { display:none; }
  .community-channel-symbol { width:34px;height:34px; }
  .community-channel-heading h2 { font-size:.9rem; }
  .community-message { gap:.55rem;padding:.45rem .35rem; }
  .community-message-avatar { width:32px;height:32px; }
  .community-message-text { font-size:.76rem; }
  .community-compose-hint { display:none; }
}

/* ============================================================
   ASISTENTE VERITAS — visita guiada adaptativa
   ============================================================ */
.veritas-guide { position:fixed; inset:0; z-index:120; display:none; pointer-events:none; }
.veritas-guide.open { display:block; }
.veritas-guide-backdrop { position:absolute; inset:0; background:rgba(5,5,7,.32); opacity:0; transition:opacity .2s ease; pointer-events:auto; }
.veritas-guide.open .veritas-guide-backdrop { opacity:1; }
.veritas-guide-card { position:fixed; width:min(390px,calc(100vw - 28px)); max-height:min(310px,calc(100vh - 28px)); overflow:auto; display:flex; gap:.8rem; padding:1rem; border:1px solid hsl(var(--border)); border-radius:18px; background:hsl(var(--card)); color:hsl(var(--foreground)); box-shadow:0 24px 70px rgba(0,0,0,.3); pointer-events:auto; opacity:0; transform:translateY(8px) scale(.98); transition:opacity .18s ease,transform .18s ease; }
.veritas-guide-card.visible { opacity:1; transform:translateY(0) scale(1); }
.veritas-guide-avatar { width:42px;height:42px;min-width:42px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(135deg,#d4af37,#9c7a24);color:#111;font-size:1rem;position:relative; }
.veritas-guide-avatar span { position:absolute; width:9px;height:9px;border:2px solid hsl(var(--card));background:#43b36b;border-radius:50%;right:-2px;bottom:-1px; }
.veritas-guide-content { min-width:0; flex:1; }
.veritas-guide-kicker { font-size:.57rem;font-weight:900;letter-spacing:.12em;color:hsl(var(--gold));margin-bottom:.18rem; }
.veritas-guide-card h3 { font-family:'Manrope',sans-serif;font-size:1rem;line-height:1.25;margin-bottom:.35rem; }
.veritas-guide-card p { color:hsl(var(--muted-foreground));font-size:.72rem;line-height:1.55;overflow-wrap:anywhere; }
.veritas-guide-progress { height:3px;background:hsl(var(--muted));border-radius:99px;overflow:hidden;margin:.8rem 0 .7rem; }
.veritas-guide-progress span { display:block;height:100%;width:0;background:hsl(var(--gold));transition:width .2s ease; }
.veritas-guide-actions { display:flex;align-items:center;justify-content:flex-end;gap:.35rem;flex-wrap:wrap; }
.veritas-guide-actions button { border:0;border-radius:8px;padding:.5rem .65rem;font:inherit;font-size:.66rem;font-weight:800;cursor:pointer;white-space:nowrap; }
.veritas-guide-skip,.veritas-guide-prev { background:transparent;color:hsl(var(--muted-foreground)); }
.veritas-guide-next { background:hsl(var(--primary));color:hsl(var(--primary-foreground)); }
[data-theme="dark"] .veritas-guide-next { background:hsl(var(--gold));color:#111; }
.veritas-guide-launcher { position:fixed; right:20px;bottom:22px;z-index:115;display:flex;align-items:center;gap:.55rem;border:1px solid hsl(var(--border));background:hsl(var(--card));color:hsl(var(--foreground));padding:.45rem .7rem .45rem .45rem;border-radius:999px;box-shadow:0 10px 30px rgba(0,0,0,.16);cursor:pointer;font:inherit;font-size:.68rem;font-weight:800;transition:transform .18s ease,box-shadow .18s ease; }
.veritas-guide-launcher:hover { transform:translateY(-2px);box-shadow:0 14px 35px rgba(0,0,0,.22); }
.veritas-guide-launcher-icon { width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:hsl(var(--accent));color:hsl(var(--gold)); }
.veritas-guide-pulse { width:7px;height:7px;border-radius:50%;background:#43b36b;box-shadow:0 0 0 4px rgba(67,179,107,.12); }
.veritas-tour-target { position:relative !important; z-index:121 !important; box-shadow:0 0 0 4px hsl(var(--gold) / .92),0 0 0 8px hsl(var(--gold) / .18),0 16px 45px rgba(0,0,0,.28) !important; border-radius:10px !important; transition:box-shadow .18s ease !important; }

/* Guardas globales para evitar desbordamientos en responsive. */
html,body { max-width:100%; overflow-x:hidden; }
img,svg,video,canvas,iframe { max-width:100%; }
input,textarea,select,button { max-width:100%; }
pre,code { max-width:100%; overflow-x:auto; }
.page { min-width:0; overflow-x:clip; }
.community-page { min-width:0; width:100%; }
.community-app,.community-sidebar,.community-main,.community-info { min-width:0; max-width:100%; }
.community-message-text,.community-info-rule span,.community-side-note,.community-channel-text { overflow-wrap:anywhere; word-break:break-word; }
.community-chat-header,.community-composer-wrap,.community-info { min-width:0; }
.community-compose-box { min-width:0; max-width:100%; }
.community-compose-box textarea { min-width:0; width:100%; }
.ad-slot,.ad-box { min-width:0; max-width:100%; overflow:hidden; }

@media (max-width: 760px) {
  .veritas-guide-launcher { right:12px;bottom:12px; }
  .veritas-guide-launcher-label { display:none; }
  .veritas-guide-card { padding:.85rem; border-radius:15px; }
  .veritas-guide-card h3 { font-size:.92rem; }
  .veritas-guide-card p { font-size:.69rem; }
  .veritas-guide-actions { justify-content:space-between; }
  .community-app { width:100%; max-width:100vw; }
  .community-main { width:100%; overflow:hidden; }
  .community-chat-header { max-width:100%; }
  .community-chat-actions { min-width:0; }
  .community-channel-heading { min-width:0; }
  .community-channel-heading > div:last-child { min-width:0; }
  .community-messages { min-width:0; max-width:100%; overflow-x:hidden; }
  .community-message-body { min-width:0; max-width:100%; }
}
@media (max-width: 420px) {
  .veritas-guide-card { width:calc(100vw - 20px); max-height:calc(100vh - 20px); }
  .veritas-guide-avatar { width:36px;height:36px;min-width:36px;font-size:.85rem; }
  .veritas-guide-actions button { padding:.45rem .55rem; }
  .community-chat-header { gap:.45rem;padding-left:.5rem;padding-right:.5rem; }
  .community-channel-symbol { flex:none; }
  .community-chat-actions .community-icon-btn { width:30px;height:30px; }
  .community-composer-wrap { padding-left:.45rem;padding-right:.45rem; }
  .community-compose-box { gap:.25rem;padding-left:.4rem;padding-right:.4rem; }
  .community-compose-plus,.community-send { width:30px;height:30px; }
}

/* ============================================================
   ACCESO RÁPIDO MÓVIL — VERIFICADOR
   ============================================================ */
.mobile-verifier-fab {
  display:none;
  position:fixed;
  left:max(12px, env(safe-area-inset-left));
  bottom:max(14px, env(safe-area-inset-bottom));
  z-index:114;
  align-items:center;
  gap:.42rem;
  min-height:42px;
  padding:.34rem .72rem .34rem .38rem;
  border:1px solid hsl(var(--border));
  border-radius:999px;
  background:hsl(var(--card) / .97);
  color:hsl(var(--foreground));
  box-shadow:0 9px 28px rgba(0,0,0,.18);
  text-decoration:none;
  font:inherit;
  font-size:.67rem;
  font-weight:900;
  white-space:nowrap;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  transition:transform .16s ease, box-shadow .16s ease;
  touch-action:manipulation;
}
.mobile-verifier-fab:active { transform:scale(.95); }
.mobile-verifier-fab-icon {
  width:32px; height:32px; flex:0 0 32px;
  display:grid; place-items:center;
  border-radius:50%;
  background:hsl(var(--primary));
  color:hsl(var(--primary-foreground));
}
[data-theme="dark"] .mobile-verifier-fab-icon {
  background:hsl(var(--gold)); color:#111;
}
@media (max-width:760px) {
  .mobile-verifier-fab { display:flex; }
  /* Deja espacio entre el botón del verificador y el asistente de visita. */
  .veritas-guide-launcher { right:12px; bottom:max(12px, env(safe-area-inset-bottom)); }
}
@media (max-width:420px) {
  .mobile-verifier-fab {
    left:max(9px, env(safe-area-inset-left));
    bottom:max(10px, env(safe-area-inset-bottom));
    min-height:38px; padding:.28rem .58rem .28rem .3rem; font-size:.61rem;
  }
  .mobile-verifier-fab-icon { width:29px; height:29px; flex-basis:29px; }
}
@media (max-width:340px) {
  .mobile-verifier-fab-label { display:none; }
  .mobile-verifier-fab { width:42px; height:42px; min-height:42px; padding:.28rem; justify-content:center; }
  .mobile-verifier-fab-icon { width:34px; height:34px; flex-basis:34px; }
}
@media (prefers-reduced-motion:reduce) {
  .mobile-verifier-fab { transition:none; }
}

/* AdSense safety: never allow ads to escape existing containers. */
.ad-slot,.ad-box{min-width:0;max-width:100%;overflow:hidden}.ad-box>ins.adsbygoogle{box-sizing:border-box;max-width:100%!important;width:100%!important}.ad-box iframe{max-width:100%!important}

/* Área de usuario */
.account-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:18px;margin-bottom:22px}.account-grid .card{min-width:0}.account-grid input{max-width:100%;padding:10px}.account-table{overflow-x:auto}.account-table table{width:100%;border-collapse:collapse;text-align:left}.account-table th,.account-table td{padding:12px;border-bottom:1px solid var(--border,#bbb)}#affiliate-url{width:100%;max-width:100%;padding:10px}

/* ================= NOTIFICACIONES ================= */
.notification-wrap{position:relative;display:flex;align-items:center}.notification-trigger{position:relative}.notification-badge{position:absolute;top:-3px;right:-3px;min-width:18px;height:18px;padding:0 4px;border-radius:999px;display:flex;align-items:center;justify-content:center;background:hsl(var(--gold));color:#111;font-size:10px;font-weight:800;border:2px solid hsl(var(--background));}.notification-dropdown{display:none;position:absolute;right:0;top:calc(100% + 10px);width:min(390px,calc(100vw - 24px));max-height:560px;overflow:auto;background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.18);z-index:1000}.notification-dropdown.open{display:block}.notification-head,.notification-foot{padding:12px 15px;border-bottom:1px solid hsl(var(--border));display:flex;justify-content:space-between;align-items:center;gap:12px}.notification-foot{border-top:1px solid hsl(var(--border));border-bottom:0}.notification-head a,.notification-foot button{background:none;border:0;color:hsl(var(--gold));cursor:pointer;font:inherit}.notification-item{display:flex;gap:11px;padding:13px 15px;border-bottom:1px solid hsl(var(--border));cursor:pointer;position:relative}.notification-item:hover{background:hsl(var(--muted)/.35)}.notification-item.unread{background:hsl(var(--gold)/.07)}.notification-icon{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:0 0 36px;background:hsl(var(--muted));}.notification-icon.success{color:#16834b}.notification-icon.error{color:#c93636}.notification-icon.warning{color:#b77900}.notification-body{min-width:0;flex:1}.notification-title{font-weight:700;font-size:.9rem}.notification-message{font-size:.82rem;color:hsl(var(--muted-foreground));margin-top:3px;line-height:1.4}.notification-date{font-size:.72rem;color:hsl(var(--muted-foreground));margin-top:5px}.notification-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:hsl(var(--gold));vertical-align:middle}.notification-delete{background:none;border:0;color:hsl(var(--muted-foreground));cursor:pointer}.notification-empty{text-align:center;padding:30px 18px;color:hsl(var(--muted-foreground))}.notification-empty i{font-size:2rem;margin-bottom:8px}.notification-toolbar{display:flex;justify-content:flex-end;margin-bottom:12px}.notification-dropdown .notification-item{padding:11px 13px}.notification-dropdown .notification-delete{display:none}


/* Notificaciones en móvil: el desplegable se ancla a la cabecera (no a la campana) para no salirse de la pantalla */
@media (max-width: 860px) {
  .notification-wrap { position: static; }
  .notification-dropdown { position: fixed; left: 12px; right: 12px; top: calc(100% + 8px); width: auto; max-height: min(70vh, 520px); }
}

[hidden] { display: none !important; }


/* ============================================================
   APP INSTALABLE (PWA) — EXPERIENCIA MÓVIL Y TABLET
   ============================================================ */
:root { --bottom-nav-h: 4rem; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { -webkit-tap-highlight-color: transparent; padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); }
a, button, [role="button"], input, select, textarea, label { touch-action: manipulation; }
.bottom-nav { display: none; }

/* Pantallas táctiles: objetivos de toque de al menos 44 px */
@media (pointer: coarse) {
  .icon-btn { min-width: 44px; min-height: 44px; }
  .main-nav .nav-link { width: 2.9rem; height: 2.9rem; }
  .btn, .mobile-nav-link { min-height: 44px; }
}
/* Tablet horizontal / táctil sin ratón: no existe "pasar el ratón", así que se muestra el nombre bajo el icono */
@media (hover: none) and (min-width: 861px) {
  .main-nav { gap: 1.1rem; }
  .main-nav .nav-link { width: auto; height: auto; min-width: 3.4rem; padding: 0.4rem 0.7rem; flex-direction: column; gap: 0.15rem; border-radius: 0.9rem; }
  .main-nav .nav-link::after {
    position: static; transform: none; opacity: 1; visibility: visible;
    background: none; color: inherit; padding: 0; font-size: 0.68rem; font-weight: 600;
  }
}

/* Móvil y tablet vertical: barra de pestañas inferior estilo app */
@media (max-width: 860px) {
  body { padding-bottom: calc(var(--bottom-nav-h) + env(safe-area-inset-bottom)); }
  .bottom-nav {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
    height: calc(var(--bottom-nav-h) + env(safe-area-inset-bottom));
    padding: 0 max(0.6rem, env(safe-area-inset-left)) env(safe-area-inset-bottom) max(0.6rem, env(safe-area-inset-right));
    gap: 0.6rem;
    background: hsl(var(--background) / 0.92);
    -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
    border-top: 1px solid hsl(var(--border));
  }
  .bottom-nav-link {
    flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.2rem;
    min-width: 0; color: hsl(var(--muted-foreground)); font-size: 0.68rem; font-weight: 600; text-decoration: none;
    border-top: 2px solid transparent; transition: color 0.15s ease;
  }
  .bottom-nav-link i { font-size: 1.2rem; }
  .bottom-nav-link span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .bottom-nav-link:active { background: hsl(var(--accent)); }
  .bottom-nav-link.active { color: hsl(var(--primary)); border-top-color: hsl(var(--gold)); }
  /* El Verificador ya es una pestaña: el botón flotante sobra */
  .mobile-verifier-fab { display: none !important; }
  /* Elementos flotantes por encima de la barra inferior */
  .footer-bar, .footer-toggle { bottom: calc(var(--bottom-nav-h) + env(safe-area-inset-bottom) + 0.75rem); }
  .veritas-guide-launcher { bottom: calc(var(--bottom-nav-h) + env(safe-area-inset-bottom) + 0.75rem) !important; }
  .site-footer { padding-bottom: 3rem; }
  /* 16 px evita el zoom automático de iOS al escribir */
  input, select, textarea { font-size: 16px; }
}

/* Ya instalada como app: sin rebote al hacer scroll y con el contenido a salvo de muescas */
@media (display-mode: standalone) {
  body { overscroll-behavior-y: none; }
  .site-header { padding-top: calc(0.9rem + env(safe-area-inset-top)); }
}

/* Hoja de ayuda para instalar en iPhone/iPad */
.pwa-sheet-backdrop { position: fixed; inset: 0; z-index: 100; display: flex; align-items: flex-end; justify-content: center; background: rgba(0,0,0,0.55); padding: 1rem; padding-bottom: max(1rem, env(safe-area-inset-bottom)); }
.pwa-sheet { width: 100%; max-width: 26rem; background: hsl(var(--card)); color: hsl(var(--foreground)); border: 1px solid hsl(var(--border)); border-radius: 1.25rem; padding: 1.4rem; box-shadow: 0 20px 60px rgba(0,0,0,0.35); }
.pwa-sheet h3 { margin: 0 0 0.75rem; font-size: 1.15rem; }
.pwa-sheet ol { margin: 0 0 1.1rem; padding-left: 1.2rem; line-height: 1.6; color: hsl(var(--muted-foreground)); }
.pwa-sheet li strong { color: hsl(var(--foreground)); }
@media (min-width: 700px) { .pwa-sheet-backdrop { align-items: center; } }