:root {
  /* ===== Brand colors (Survey/Reward app — flat soft red theme) ===== */
  --primary: #E4574F;          /* Flat Soft Red */
  --primary-dark: #B23B36;     /* Deep Red */
  --primary-light: #F08D87;    /* Light Red */
  --secondary: #FF8A3D;        /* Warm Orange (promo cards) */
  --secondary-dark: #E96A1C;   /* Deep Orange */
  --accent: #FFC839;           /* Coin / Gold Yellow */
  --accent-light: #FFE18C;     /* Light Gold */

  /* ===== Neutrals ===== */
  --background: #FCF4F3;
  --surface: #FFFFFF;
  --text-primary: #362524;
  --text-secondary: #9C8481;
  --text-on-dark: #FFFFFF;
  --text-on-dark-muted: #FBD9D6;
  --border: #F6E4E2;

  /* ===== Feedback ===== */
  --success: #1F9D55;
  --success-bg: #E8F8EE;
  --error: #E1483F;
  --error-bg: #FCEAE9;

  /* ===== Elevation (red-tinted) ===== */
  --shadow-sm: 0 2px 6px rgba(228, 87, 79, 0.08);
  --shadow-md: 0 10px 24px rgba(228, 87, 79, 0.14);
  --shadow-lg: 0 20px 44px rgba(228, 87, 79, 0.20);
  --shadow-gold: 0 10px 24px rgba(255, 200, 57, 0.35);

  /* ===== Radius (soft, generous — matches reference) ===== */
  --radius-sm: 12px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --radius-pill: 999px;

  /* ===== Spacing scale ===== */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;
  --space-9: 56px;

  /* ===== Typography ===== */
  --font-display: 'Poppins', 'Inter', -apple-system, sans-serif;
  --font-body: 'Inter', -apple-system, sans-serif;
  --font-logo: 'Baloo 2', 'Poppins', -apple-system, sans-serif; /* fun, rounded — for the SURE PLAY logo only */

  --fs-caption: 12px;
  --fs-small: 13px;
  --fs-body: 15px;
  --fs-body-lg: 16px;
  --fs-h3: 19px;
  --fs-h2: 23px;
  --fs-h1: 28px;
  --fs-display: 34px;

  /* ===== Layout ===== */
  --shell-max-width: 460px;
  --tap-min: 48px;
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-base: 220ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 320ms cubic-bezier(0.4, 0, 0.2, 1);

  /* z-index */
  --z-nav: 40;
  --z-sticky-cta: 30;
  --z-toast: 60;
}