/* ============================================================
   LITERATURARTE — Tokens de Cor
   ============================================================ */
:root {
  /* --- Primária: Coral --- */
  --la-primary:          #ED6D63;
  --la-primary-light:    #F5A59E;
  --la-primary-lighter:  #FDECEA;
  --la-primary-dark:     #D44F45;
  --la-primary-darker:   #B83830;
  --la-on-primary:       #FFFFFF;

  /* --- Secundária: Verde Sage --- */
  --la-secondary:         #9BCEA9;
  --la-secondary-light:   #C2E3CB;
  --la-secondary-lighter: #E8F5EC;
  --la-secondary-dark:    #6BAF7D;
  --la-secondary-darker:  #3E8A56;
  --la-on-secondary:      #FFFFFF;

  /* --- Terciária: Azul Céu --- */
  --la-blue:         #64ABDF;
  --la-blue-light:   #9BCBEE;
  --la-blue-lighter: #E3F2FC;
  --la-blue-dark:    #3A89C2;
  --la-blue-darker:  #1E6A9C;
  --la-on-blue:      #FFFFFF;

  /* --- Acento: Amarelo Lápis --- */
  --la-yellow:         #F8D060;
  --la-yellow-light:   #FBE49E;
  --la-yellow-lighter: #FEF8E0;
  --la-yellow-dark:    #E6B930;
  --la-yellow-darker:  #C49A10;
  --la-on-yellow:      #1A1C23;

  /* --- Neutros (warm-shifted) --- */
  --la-gray-50:  #FAFAFA;
  --la-gray-100: #F5F5F6;
  --la-gray-200: #EEEEEF;
  --la-gray-300: #E2E2E4;
  --la-gray-400: #C5C5CA;
  --la-gray-500: #9B9BA5;
  --la-gray-600: #72727A;
  --la-gray-700: #4E4E57;
  --la-gray-800: #313138;
  --la-gray-900: #1A1C23;
  --la-white:    #FFFFFF;
  --la-black:    #1A1C23;

  /* --- Semânticas --- */
  --la-success:        #9BCEA9;
  --la-success-bg:     #E8F5EC;
  --la-success-dark:   #3E8A56;
  --la-warning:        #F8D060;
  --la-warning-bg:     #FEF8E0;
  --la-warning-dark:   #C49A10;
  --la-error:          #ED6D63;
  --la-error-bg:       #FDECEA;
  --la-error-dark:     #B83830;
  --la-info:           #64ABDF;
  --la-info-bg:        #E3F2FC;
  --la-info-dark:      #1E6A9C;

  /* --- Superfícies --- */
  --la-bg:        #F8F9FA;
  --la-bg-warm:   #FDF9F8;
  --la-surface:   #FFFFFF;
  --la-surface-2: #F5F5F6;
  --la-overlay:   rgba(26,28,35,0.48);

  /* --- Texto --- */
  --la-text:          #1A1C23;
  --la-text-2:        #4E4E57;
  --la-text-muted:    #72727A;
  --la-text-disabled: #9B9BA5;
  --la-text-inverse:  #FFFFFF;

  /* --- Bordas --- */
  --la-border:       #E2E2E4;
  --la-border-2:     #C5C5CA;
  --la-border-focus: #ED6D63;
}
/* ============================================================
   LITERATURARTE — Tokens de Tipografia
   Fontes: Poppins (display/headings) + Nunito (body/UI)
   ============================================================ */
:root {
  /* --- Famílias --- */
  --la-font-display: 'Bebas Neue', 'Impact', system-ui, sans-serif;
  --la-font-body:    'Nunito', system-ui, -apple-system, sans-serif;
  --la-font-mono:    'Fira Code', 'Cascadia Code', 'Courier New', monospace;

  /* --- Escala (Mobile First) --- */
  --la-text-xs:   0.75rem;    /* 12px */
  --la-text-sm:   0.875rem;   /* 14px */
  --la-text-base: 1rem;       /* 16px */
  --la-text-md:   1.125rem;   /* 18px */
  --la-text-lg:   1.25rem;    /* 20px */
  --la-text-xl:   1.5rem;     /* 24px */
  --la-text-2xl:  1.875rem;   /* 30px */
  --la-text-3xl:  2.25rem;    /* 36px */
  --la-text-4xl:  3rem;       /* 48px */
  --la-text-5xl:  3.75rem;    /* 60px */

  /* --- Pesos --- */
  --la-weight-light:     300;
  --la-weight-regular:   400;
  --la-weight-medium:    500;
  --la-weight-semibold:  600;
  --la-weight-bold:      700;
  --la-weight-extrabold: 800;

  /* --- Alturas de linha --- */
  --la-leading-none:    1;
  --la-leading-tight:   1.25;
  --la-leading-snug:    1.375;
  --la-leading-normal:  1.5;
  --la-leading-relaxed: 1.625;
  --la-leading-loose:   2;

  /* --- Espaçamento de letras --- */
  --la-tracking-tight:   -0.025em;
  --la-tracking-normal:  0;
  --la-tracking-wide:    0.025em;
  --la-tracking-wider:   0.05em;
  --la-tracking-widest:  0.1em;
}
/* ============================================================
   LITERATURARTE — Tokens de Espaçamento
   Base: 4px (0.25rem)
   ============================================================ */
:root {
  --la-space-0:  0;
  --la-space-1:  0.25rem;   /* 4px  */
  --la-space-2:  0.5rem;    /* 8px  */
  --la-space-3:  0.75rem;   /* 12px */
  --la-space-4:  1rem;      /* 16px */
  --la-space-5:  1.25rem;   /* 20px */
  --la-space-6:  1.5rem;    /* 24px */
  --la-space-8:  2rem;      /* 32px */
  --la-space-10: 2.5rem;    /* 40px */
  --la-space-12: 3rem;      /* 48px */
  --la-space-16: 4rem;      /* 64px */
  --la-space-20: 5rem;      /* 80px */
  --la-space-24: 6rem;      /* 96px */
  --la-space-32: 8rem;      /* 128px */

  /* --- Containers --- */
  --la-container-sm:  640px;
  --la-container-md:  768px;
  --la-container-lg:  1024px;
  --la-container-xl:  1280px;
  --la-container-2xl: 1536px;

  /* --- Grid --- */
  --la-gutter:    1.5rem;   /* 24px */
  --la-gutter-sm: 1rem;     /* 16px */

  /* --- Breakpoints (referência) --- */
  /* xs:  0px      — mobile portrait  */
  /* sm:  576px    — mobile landscape */
  /* md:  768px    — tablet           */
  /* lg:  992px    — desktop          */
  /* xl:  1200px   — large desktop    */
  /* xxl: 1400px   — extra large      */
}
/* ============================================================
   LITERATURARTE — Tokens de Sombra / Elevação
   Sistema de 6 níveis (MD3-inspired)
   ============================================================ */
:root {
  --la-shadow-none: none;
  --la-shadow-xs:   0 1px 2px rgba(26,28,35,0.05);
  --la-shadow-sm:   0 1px 3px rgba(26,28,35,0.08), 0 1px 2px rgba(26,28,35,0.04);
  --la-shadow-md:   0 4px 6px rgba(26,28,35,0.07), 0 2px 4px rgba(26,28,35,0.04);
  --la-shadow-lg:   0 10px 15px rgba(26,28,35,0.08), 0 4px 6px rgba(26,28,35,0.04);
  --la-shadow-xl:   0 20px 25px rgba(26,28,35,0.10), 0 8px 10px rgba(26,28,35,0.04);
  --la-shadow-2xl:  0 25px 50px rgba(26,28,35,0.15);
  --la-shadow-inner: inset 0 2px 4px rgba(26,28,35,0.06);

  /* --- Sombras com cor --- */
  --la-shadow-primary: 0 4px 14px rgba(237,109,99,0.30);
  --la-shadow-green:   0 4px 14px rgba(155,206,169,0.35);
  --la-shadow-blue:    0 4px 14px rgba(100,171,223,0.30);

  /* --- Focus ring --- */
  --la-ring-primary: 0 0 0 3px rgba(237,109,99,0.22);
  --la-ring-green:   0 0 0 3px rgba(155,206,169,0.28);
  --la-ring-blue:    0 0 0 3px rgba(100,171,223,0.28);
}
/* ============================================================
   LITERATURARTE — Tokens de Borda e Raio
   ============================================================ */
:root {
  /* --- Raios de borda --- */
  --la-radius-none: 0;
  --la-radius-xs:   0.125rem;   /* 2px  */
  --la-radius-sm:   0.25rem;    /* 4px  */
  --la-radius-md:   0.5rem;     /* 8px  */
  --la-radius-lg:   0.75rem;    /* 12px */
  --la-radius-xl:   1rem;       /* 16px */
  --la-radius-2xl:  1.5rem;     /* 24px */
  --la-radius-3xl:  2rem;       /* 32px */
  --la-radius-full: 9999px;

  /* --- Espessuras de borda --- */
  --la-border-width:   1px;
  --la-border-width-2: 2px;
  --la-border-width-4: 4px;

  /* --- Borda composta (atalhos) --- */
  --la-border-default: 1px solid var(--la-border);
  --la-border-strong:  1px solid var(--la-border-2);
  --la-border-focus:   2px solid var(--la-primary);
}
/* ============================================================
   LITERATURARTE — Tokens de Animação
   ============================================================ */
:root {
  /* --- Durações --- */
  --la-duration-instant: 50ms;
  --la-duration-fast:    100ms;
  --la-duration-normal:  200ms;
  --la-duration-slow:    300ms;
  --la-duration-slower:  400ms;
  --la-duration-lazy:    600ms;

  /* --- Easings --- */
  --la-ease:         cubic-bezier(0.4, 0, 0.2, 1);
  --la-ease-in:      cubic-bezier(0.4, 0, 1, 1);
  --la-ease-out:     cubic-bezier(0, 0, 0.2, 1);
  --la-ease-spring:  cubic-bezier(0.34, 1.56, 0.64, 1);
  --la-ease-bounce:  cubic-bezier(0.68, -0.55, 0.265, 1.55);

  /* --- Transições compostas --- */
  --la-transition:          all 200ms cubic-bezier(0.4, 0, 0.2, 1);
  --la-transition-fast:     all 100ms cubic-bezier(0.4, 0, 0.2, 1);
  --la-transition-slow:     all 300ms cubic-bezier(0.4, 0, 0.2, 1);
  --la-transition-color:    color 200ms cubic-bezier(0.4, 0, 0.2, 1), background-color 200ms cubic-bezier(0.4, 0, 0.2, 1), border-color 200ms cubic-bezier(0.4, 0, 0.2, 1);
  --la-transition-transform: transform 200ms cubic-bezier(0.4, 0, 0.2, 1);
  --la-transition-shadow:   box-shadow 200ms cubic-bezier(0.4, 0, 0.2, 1);
  --la-transition-opacity:  opacity 200ms cubic-bezier(0.4, 0, 0.2, 1);
}