@layer theme {
  /* Color system
  /* ------------------------------------------------------------------------ */

  :root {
    --color-black: oklch(0% 0 0);
    --color-white: oklch(100% 0 0);

    --color-black-deerstalker:  oklch(11.711% 0.08115 264.05);
    --color-blue-colab:         oklch(53.27%  0.26142 274.12);
    --color-blue-deerstalker:   oklch(42.298% 0.18099 266.99);
    --color-green-colab:        oklch(80.011% 0.16367 154.98);
    --color-green-dark:         oklch(73.99%  0.117   145);
    --color-green-rizzoma:      oklch(51.897% 0.04341 139.19);
    --color-orange-rizzoma:     oklch(68.042% 0.10399 58.884);
    --color-orange-alert:       oklch(86%     0.176   97);
    --color-red-colab:          oklch(66.523% 0.22673 13.041);
    --color-red-dark:           oklch(56.95%  0.2     23.5);
    --color-white-rizzoma:      oklch(95.591% 0.0146  102.46);
    --color-yellow-deerstalker: oklch(89.55%  0.12757 95.6);

    /* --surface-normal:     #000; */
    /* --surface-light:      #111; */
    --color-canvas: var(--color-black-deerstalker);

    /* --color-text: #fff; */
    /* --color-text-subtle:   #eee; */
    --color-ink:          var(--color-white);
    --color-ink-inverted: var(--color-canvas);
    --color-ink-weak:    color-mix(in oklab, var(--color-ink) 40%, var(--color-canvas));
    --color-ink-weaker:  color-mix(in oklab, var(--color-ink) 20%, var(--color-canvas));
    --color-ink-weakest: color-mix(in oklab, var(--color-ink) 8%,  var(--color-canvas));

    /* --accent-normal-fg:   var(--colab-blue); */
    /* --accent-normal-bg:   var(--colab-blue); */
    --color-link:      var(--color-blue-colab);
    --color-highlight: var(--color-yellow-deerstalker);

    /* --accent-success-fg:  var(--color-text-normal); */
    /* --accent-success-bg:  oklch(79.2% 0.209 151.711); */
    --color-positive: var(--color-green-dark);

    /* --accent-warning-fg:  var(--color-text-normal); */
    /* --accent-warning-bg:  #ff9500; */
    --color-alert: var(--color-orange-alert);

    /* --accent-error-fg:    var(--color-text-normal); */
    /* --accent-error-bg:    #ff3b30; */
    --color-negative: var(--color-red-dark);

    --gradient-text:  linear-gradient(135deg, #fff 0%, #e5e7eb 100%);
    --gradient-colab: linear-gradient(
      135deg,
      var(--color-red-colab)   0%,
      var(--color-green-colab) 50%,
      var(--color-blue-colab)  100%
    );

    /* --surface: var(--color-background, #111); */
    /* --surface-highlight: color-mix( */
    /*   in oklab, */
    /*   var(--surface), */
    /*   var(--color-text) 20% */
    /* ); */
  }
}
