/* =========================================================================
   TocaFiesta · variables.css
   Tokens de marca extraídos SIN CAMBIOS de la portada original.
   No modificar los valores por preferencias personales.
   ========================================================================= */
:root {
  /* Marca */
  --brand: #E84A6F;
  --brand-strong: #D43560;
  --ink: #2A2230;
  --ink-soft: #6B6473;
  --bg-1: #FFF7F2;
  --bg-2: #FFEFF5;
  --card: #FFFFFF;
  --line: rgba(42, 34, 48, 0.08);
  --ring: rgba(232, 74, 111, 0.35);

  /* Radios */
  --radius-card: 20px;
  --radius-field: 14px;
  --radius-pill: 999px;

  /* Sombras */
  --shadow-card: 0 1px 2px rgba(42,34,48,.04), 0 8px 24px rgba(42,34,48,.06);
  --shadow-card-hover: 0 4px 10px rgba(42,34,48,.08), 0 16px 36px rgba(42,34,48,.12);
  --shadow-cta: 0 8px 30px rgba(212, 53, 96, .35);

  /* Tipografías */
  --font-display: 'Fredoka', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  /* Estados semánticos (sin romper la paleta) */
  --error: #C0392B;
  --error-bg: #FDECEA;
  --ok: #1FA97A;
  --warn-bg: #FFF4E0;
  --warn-ink: #9A6700;

  /* Espaciados base */
  --space-1: 6px;
  --space-2: 10px;
  --space-3: 14px;
  --space-4: 18px;
  --space-5: 24px;
  --space-6: 34px;

  /* Anchos */
  --app-max: 980px;
}