:root {
  --lch-black: 0% 0 0;                        /* #000000 */
  --lch-white: 100% 0 0;                      /* #FFFFFF */

  --lch-gray-50:   97.84% 0.0011 197.14;  /* #F7F8F8 */
  --lch-gray-100:  94.92% 0.0042 271.37;  /* #EDEEF1 */
  --lch-gray-200:  89.03% 0.0064 255.48;  /* #D8DBDF */
  --lch-gray-300:  78.85% 0.0135 266.68;  /* #B6BAC3 */
  --lch-gray-400:  66.84% 0.0209 262.97;  /* #8E95A2 */
  --lch-gray-500:  55.10% 0.0234 264.36;  /* #6B7280 */
  --lch-gray-600:  49.21% 0.0221 265.82;  /* #5B616E */
  --lch-gray-700:  42.48% 0.0205 270.90;  /* #4A4E5A */
  --lch-gray-800:  38.60% 0.0146 264.39;  /* #40444C */
  --lch-gray-900:  34.96% 0.0141 274.50;  /* #383A42 */
  --lch-gray-950:  27.28% 0.0097 268.32;  /* #25272C */

  --lch-green-50:  98.19% 0.0181 155.83;  /* #F0FDF4 */
  --lch-green-100: 96.24% 0.0434 156.74;  /* #DCFCE7 */
  --lch-green-200: 92.35% 0.0783 155.85;  /* #BCF6D0 */
  --lch-green-300: 86.93% 0.1342 154.42;  /* #87EEAC */
  --lch-green-400: 79.57% 0.1796 151.51;  /* #4CDC7F */
  --lch-green-500: 71.76% 0.1900 149.46;  /* #24C35D */
  --lch-green-600: 63.02% 0.1699 149.24;  /* #18A44B */
  --lch-green-700: 52.46% 0.1355 150.13;  /* #167F3D */
  --lch-green-800: 44.52% 0.1065 151.40;  /* #176434 */
  --lch-green-900: 38.98% 0.0877 152.63;  /* #15522D */
  --lch-green-950: 26.64% 0.0628 152.93;  /* #052E16 */

  --lch-orange-50:  98.10% 0.0187 83.06;  /* #FFF8EB */
  --lch-orange-100: 94.43% 0.0506 81.66;  /* #FEEAC7 */
  --lch-orange-200: 88.52% 0.1020 79.74;  /* #FDD28A */
  --lch-orange-300: 83.29% 0.1441 77.34;  /* #FCBB4D */
  --lch-orange-400: 79.96% 0.1617 73.47;  /* #FBAB24 */
  --lch-orange-500: 76.86% 0.1647 70.08;  /* #F59E0B */
  --lch-orange-600: 70.06% 0.1507 69.95;  /* #D98B06 */
  --lch-orange-700: 61.23% 0.1298 70.68;  /* #B47409 */
  --lch-orange-800: 53.26% 0.1087 73.13;  /* #92610E */
  --lch-orange-900: 46.67% 0.0922 74.40;  /* #78510F */
  --lch-orange-950: 31.60% 0.0643 73.87;  /* #452C03 */

  --lch-red-50:     97.05% 0.0129 17.38;  /* #FEF2F2 */
  --lch-red-100:    93.56% 0.0309 17.72;  /* #FEE2E2 */
  --lch-red-200:    88.45% 0.0593 18.33;  /* #FECACA */
  --lch-red-300:    80.77% 0.1035 19.57;  /* #FCA5A5 */
  --lch-red-400:    71.06% 0.1661 22.22;  /* #F87171 */
  --lch-red-500:    63.68% 0.2078 25.33;  /* #EF4444 */
  --lch-red-600:    57.71% 0.2152 27.33;  /* #DC2626 */
  --lch-red-700:    50.54% 0.1905 27.52;  /* #B91C1C */
  --lch-red-800:    44.37% 0.1613 26.90;  /* #991B1B */
  --lch-red-900:    39.58% 0.1331 25.72;  /* #7F1D1D */
  --lch-red-950:    25.75% 0.0886 26.04;  /* #450A0A */

  /* Semantic colors */

  /* Surfaces */
  --color-canvas: oklch(var(--lch-gray-50));
  --color-surface: oklch(var(--lch-white));
  --color-shade: oklch(var(--lch-gray-50));

  /* Text */
  --color-ink: oklch(var(--lch-gray-950));
  --color-ink-inverted: oklch(var(--lch-white));
  --color-muted: oklch(var(--lch-gray-400));

  /* Borders */
  --color-border: oklch(var(--lch-gray-100));
  --color-separator: oklch(var(--lch-gray-200));

  /* Primary (brand) */
  --color-primary: oklch(var(--lch-green-600));
  --color-primary-hover: oklch(var(--lch-green-700));

  /* Intent */
  --color-positive: oklch(var(--lch-green-600));
  --color-positive-subtle: oklch(var(--lch-green-50));
  --color-negative: oklch(var(--lch-red-600));
  --color-negative-subtle: oklch(var(--lch-red-50));
  --color-warning: oklch(var(--lch-orange-500));

  /* Interactive */
  --color-link: oklch(var(--lch-green-600));

  /* Component-specific (avoid if possible, but pragmatic) */
  --color-tag: oklch(var(--lch-gray-500));
  --color-tag-bg: oklch(var(--lch-gray-100));
  --color-star: oklch(var(--lch-orange-500));
}
