/* ANGA MASTERY — colour. Values transcribed verbatim from ANGA Mastery LMS.fig. */
:root{
  /* ---- Brand: the orange→red "MASTERY" ramp ---- */
  --anga-orange:#ff5300;      /* rgb(255,83,0)  — ramp start, top brand hue */
  --anga-orange-2:#fe4c06;    /* rgb(254,76,6) */
  --anga-vermilion:#fa3916;   /* rgb(250,57,22) */
  --anga-red-2:#f31a31;       /* rgb(243,26,49) */
  --anga-red:#f21436;         /* rgb(242,20,54) — ramp end */
  --anga-red-alt:#f5222a;     /* rgb(245,34,42) — secondary ramp end seen on mobile */
  --anga-orange-alt:#fe4d05;  /* rgb(254,77,5) */

  /* The ramp itself. Angle varies per element in the source (107°–157°);
     these are the three canonical angles actually used. */
  --anga-ramp-107:linear-gradient(107.373deg,#ff5300 24.48%,#fe4c06 33.95%,#fa3916 47.63%,#f31a31 63.80%,#f21436 66.38%); /* @kind color */
  --anga-ramp-127:linear-gradient(127.091deg,#ff5300 23.32%,#fe4c06 34.66%,#fa3916 51.05%,#f31a31 70.41%,#f21436 73.50%); /* @kind color */
  --anga-ramp-157:linear-gradient(156.719deg,#ff5300 19.63%,#fe4c06 36.95%,#fa3916 61.96%,#f31a31 91.53%,#f21436 96.24%); /* @kind color */
  --anga-ramp:var(--anga-ramp-127); /* @kind color */

  /* ---- Neutral: near-black through white ---- */
  --black:#000000;
  --ink-950:#141414;   /* rgb(20,20,20)   — full-bleed panel */
  --ink-900:#151515;   /* rgb(21,21,21)   — the standard card surface */
  --ink-800:#202020;   /* rgb(32,32,32) */
  --ink-700:#2c2c2c;   /* rgb(44,44,44) */
  --ink-600:#222222;   /* rgb(34,34,34) */
  --grey-700:#5d5d5d;  /* rgb(93,93,93)   — pressed neutral button */
  --grey-600:#626262;  /* rgb(98,98,98) */
  --grey-550:#6f6f6f;  /* rgb(111,111,111)— hover fill on outline button */
  --grey-400:#a4a4a4;  /* rgb(164,164,164) */
  --grey-300:#c1c1c1;  /* rgb(193,193,193)— inverted chip */
  --grey-200:#d9d9d9;  /* rgb(217,217,217)— image placeholder / divider */
  --grey-100:#ededed;  /* rgb(237,237,237)— card media placeholder */
  --off-white:#f7f5f5; /* rgb(247,245,245)— the one light page surface */
  --white:#ffffff;
  --slate:#373f45;     /* rgb(55,63,69) — legacy Figma variable, rarely used */

  /* ---- White veils: the whole UI's secondary surfaces ---- */
  --veil-11:rgba(255,255,255,.11);
  --veil-15:rgba(255,255,255,.15);
  --veil-16:rgba(255,255,255,.16);
  --veil-32:rgba(255,255,255,.32);

  /* ---- Protection gradients (photos → black, so type stays legible) ---- */
  --scrim-bottom:linear-gradient(180deg,rgba(0,0,0,0) 0%,#000 100%); /* @kind color */
  --scrim-top:linear-gradient(180deg,#000 0%,rgba(0,0,0,0) 100%); /* @kind color */
  --scrim-left:linear-gradient(90deg,#000 0%,rgba(0,0,0,0) 100%); /* @kind color */
}