/* Preferencias de UX globales */
html[data-ui-density="compact"] .main-content { --section-gap: 0.75rem; }
html[data-ui-density="spacious"] .main-content { --section-gap: 1.75rem; }
html.font-dyslexic body {
  font-family: "OpenDyslexic", "Comic Sans MS", Verdana, sans-serif;
}
html.reduce-motion *,
html.reduce-motion *::before,
html.reduce-motion *::after {
  animation-duration: 0.01ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: 0.01ms !important;
}
html.high-contrast {
  --neo-border: rgba(255, 255, 255, 0.35);
  --neo-muted: #d0d8e8;
}
html.enhanced-focus :focus-visible {
  outline: 3px solid var(--neo-accent, #22d3ee);
  outline-offset: 2px;
}

html.explorer-layout-list .characters-grid {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
html.explorer-layout-list .character-card {
  flex-direction: row;
  max-width: 100%;
}

.sidebar-redai-services-secret.is-unlocked {
  animation: sidebarSecretFade 0.35s ease;
}
@keyframes sidebarSecretFade {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}