/* Scrollia · Sistema "Papel y Tinta"
   Proyección CSS de docs/DESIGN.md — no editar valores aquí,
   la fuente de verdad es el YAML de DESIGN.md. */

:root {
  color-scheme: light;

  /* color */
  --paper: #FAF7F0;
  --paper-raised: #FFFFFF;
  --ink: #1A1A18;
  --ink-soft: #5C5A52;
  --library: #2D5A3D;
  --library-deep: #1E3D29;
  --on-library: #FFFFFF;
  --gold: #B08D3E;
  --parchment: #EAD9B8;
  --border: #E5E0D5;

  /* font */
  --font-display: 'Fraunces', 'Georgia', 'Noto Serif', 'Noto Serif CJK SC', 'Noto Serif SC', 'Noto Serif Devanagari', 'Noto Naskh Arabic', serif;
  --font-body: 'Literata', 'Georgia', 'Noto Serif', 'Noto Serif CJK SC', 'Noto Serif SC', 'Noto Serif Devanagari', 'Noto Naskh Arabic', serif;
  --font-ui: 'Inter', system-ui, 'Noto Sans', 'Noto Sans CJK SC', 'Noto Sans SC', 'Noto Sans Devanagari', 'Noto Sans Arabic', sans-serif;

  /* type scale */
  --text-display: clamp(2.5rem, 6vw, 4.5rem);
  --text-h1: 2.5rem;
  --text-h2: 2rem;
  --text-h3: 1.5rem;
  --text-body-lg: 1.25rem;
  --text-body: 1rem;
  --text-small: 0.875rem;
  --text-caption: 0.75rem;
  --text-reader: 1.125rem;

  /* space */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 2rem;
  --space-xl: 4rem;
  --space-xxl: 8rem;

  /* radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-full: 9999px;

  /* shadow */
  --shadow-card: 0 1px 2px rgba(26, 26, 24, 0.06), 0 4px 12px rgba(26, 26, 24, 0.08);

  /* motion */
  --motion-duration: 200ms;
  --motion-easing: ease-out;
}

[data-theme="dark"] {
  color-scheme: dark;

  --paper: #161815;
  --paper-raised: #23251F;
  --ink: #EDEAE0;
  --ink-soft: #A8A598;
  --library: #8FB89B;
  --library-deep: color-mix(in srgb, #8FB89B 88%, #EDEAE0);
  --on-library: #161815;
  --gold: #D4AF5E;
  --border: #35382E;
  --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.3), 0 4px 12px rgba(0, 0, 0, 0.35);
}

/* Temas de lectura: independientes del tema del sitio (DESIGN.md §3.6) */
[data-reader-theme="paper"] {
  --reader-bg: #FAF7F0;
  --reader-ink: #1A1A18;
}

[data-reader-theme="sepia"] {
  --reader-bg: #F4ECD8;
  --reader-ink: #433422;
}

[data-reader-theme="night"] {
  --reader-bg: #161815;
  --reader-ink: #EDEAE0;
}