/* =====================================================================
   Vimmo — Design Tokens
   Source of truth: Vimmo iOS app design system (mint-forward, Apple-clean,
   young/Gen-Z, minimal-playful). Light-first; pure-white surface.
   ===================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");

:root {
  /* ---- Brand ---- */
  --vimmo-mint:        #20C997;
  --vimmo-mint-light:  #E6FAF3;
  --vimmo-mint-dark:   #1BAE82;
  --vimmo-mint-12:     rgba(32, 201, 151, 0.12);
  --vimmo-mint-30:     rgba(32, 201, 151, 0.30);

  /* ---- Surfaces ---- */
  --vimmo-bg:          #FFFFFF;
  --vimmo-surface-2:   #F7F7F9;

  /* ---- Text ---- */
  --vimmo-fg-1:        #111113;
  --vimmo-fg-2:        #66666B;
  --vimmo-fg-3:        #99999E;

  /* ---- Semantic ---- */
  --vimmo-warning:     #FFC107;
  --vimmo-danger:      #EF4444;
  --vimmo-success:     #32C66F;
  --vimmo-orange:      #FF9500;

  /* ---- Type ---- */
  --vimmo-font-display: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Display", system-ui, sans-serif;
  --vimmo-font-text:    "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, sans-serif;
  --vimmo-font-rounded: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Rounded", system-ui, sans-serif;

  /* ---- Radii ---- */
  --vimmo-radius-sm:   12px;
  --vimmo-radius-md:   14px;
  --vimmo-radius-lg:   20px;
  --vimmo-radius-xl:   22px;
  --vimmo-radius-2xl:  24px;
  --vimmo-radius-3xl:  28px;
  --vimmo-radius-pill: 9999px;

  /* ---- Shadows ---- */
  --vimmo-shadow-xs:   0 1px 2px rgba(0,0,0,0.04);
  --vimmo-shadow-card: 0 4px 12px rgba(0,0,0,0.08);

  /* ---- Motion ---- */
  --vimmo-ease-spring: cubic-bezier(0.22, 1, 0.36, 1);
  --vimmo-ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --vimmo-ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
  --vimmo-dur-fast:    180ms;
  --vimmo-dur-base:    300ms;
}