/* Design tokens — single source of truth for colors, sizes and positions.
   Values taken directly from the Figma frame "fanfar" (402 x 874). */
:root {
  /* Palette (Figma variables) */
  --green: #1baa3f;
  --purple: #521baa;
  --yellow: #e8b200;
  --red: #dd2f2f;
  --blue: #1b63aa;
  --orange: #e07128;
  --gray: #a7a69c;
  --beige: #d3d2cc;

  --icon-clover: var(--yellow);
  --icon-heart: #2b2e33;

  /* Stage dimensions (design canvas) */
  --stage-w: 402px;
  --stage-h: 874px;

  /* Button sizes */
  --big-size: 280px;
  --slot-size: 90px;
  --save-w: 90px;
  --save-h: 110px;

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --t-fast: 140ms;
  --t-med: 320ms;
  --t-slow: 560ms;

  /* The live color shown on the big button (updated by JS) */
  --big-color: var(--orange);
}
