/* Kisholoy — colour tokens.
   THE PALETTE: 3 families (Grey, Green, Amber) × 6 shades, plus White and
   Black — 20 colours. Nothing else is used anywhere; any other colour is
   replaced by the closest of these 20. Transparency of a palette colour
   (scrim, shadow, overlay) is allowed; a new hue or shade is not.

   READABILITY RULE
   - Backgrounds: white, any 100, any 200. Nothing else sits behind content.
   - 900 and 700: text. Each reaches at least 4.5:1 on every background above.
   - 500: icons, text 24px and up, and borders that carry meaning — at least
     3:1 on every background above. Never small text.
   - 300: decoration, dividers, disabled states only — never readable text.
   - On 700/900 fills (buttons, dark bands): text is white or a 100–300.
   Weight never replaces colour for emphasis (Bangla sans is never bold). */
:root {
  /* Grey */
  --grey-900: #3b3432;
  --grey-700: #625b59;
  --grey-500: #7c7574;
  --grey-300: #b1abaa;
  --grey-200: #ded7d6;
  --grey-100: #ece7e6;
  /* Green */
  --green-900: #163e32;
  --green-700: #2b6653;
  --green-500: #508169;
  --green-300: #9bba96;
  --green-200: #cdddaf;
  --green-100: #edf4d6;
  /* Amber */
  --amber-900: #462f2a;
  --amber-700: #72564f;
  --amber-500: #8c7168;
  --amber-300: #ceb9a8;
  --amber-200: #e9d5c2;
  --amber-100: #fae9d4;
  /* White & Black */
  --white: #f1f1f1;
  --black: #101010;

  /* Not colours: shadows and the scrim, built from palette colours */
  --shadow-header: 0px 3px 4px 0px rgba(177, 171, 170, 0.25); /* grey-300 at 25% */
  --shadow-card: 0px 2px 2px 0px var(--grey-100);
  --scrim-dark: rgba(16, 16, 16, 0.35); /* black at 35% */
}