[data-theme="dark"] {
  --brown-1: #12110f;
  --brown-2: #1c1816;
  --brown-3: #28211d;
  --brown-4: #322922;
  --brown-5: #3e3128;
  --brown-6: #4d3c2f;
  --brown-7: #614a39;
  --brown-8: #7c5f46;
  --brown-9: #ad7f58;
  --brown-10: #b88c67;
  --brown-11: #dbb594;
  --brown-12: #f2e1ca;
}

@supports (color: color(display-p3 1 1 1)) {
  @media (color-gamut: p3) {
    [data-theme="dark"] {
      --brown-1: color(display-p3 0.071 0.067 0.059);
      --brown-2: color(display-p3 0.107 0.095 0.087);
      --brown-3: color(display-p3 0.151 0.13 0.115);
      --brown-4: color(display-p3 0.191 0.161 0.138);
      --brown-5: color(display-p3 0.235 0.194 0.162);
      --brown-6: color(display-p3 0.291 0.237 0.192);
      --brown-7: color(display-p3 0.365 0.295 0.232);
      --brown-8: color(display-p3 0.469 0.377 0.287);
      --brown-9: color(display-p3 0.651 0.505 0.368);
      --brown-10: color(display-p3 0.697 0.557 0.423);
      --brown-11: color(display-p3 0.835 0.715 0.597);
      --brown-12: color(display-p3 0.938 0.885 0.802);
    }
  }
}

@media only screen and (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --brown-1: #12110f;
    --brown-2: #1c1816;
    --brown-3: #28211d;
    --brown-4: #322922;
    --brown-5: #3e3128;
    --brown-6: #4d3c2f;
    --brown-7: #614a39;
    --brown-8: #7c5f46;
    --brown-9: #ad7f58;
    --brown-10: #b88c67;
    --brown-11: #dbb594;
    --brown-12: #f2e1ca;
  }
  
  @supports (color: color(display-p3 1 1 1)) {
    @media (color-gamut: p3) {
      :root:not([data-theme="light"]) {
        --brown-1: color(display-p3 0.071 0.067 0.059);
        --brown-2: color(display-p3 0.107 0.095 0.087);
        --brown-3: color(display-p3 0.151 0.13 0.115);
        --brown-4: color(display-p3 0.191 0.161 0.138);
        --brown-5: color(display-p3 0.235 0.194 0.162);
        --brown-6: color(display-p3 0.291 0.237 0.192);
        --brown-7: color(display-p3 0.365 0.295 0.232);
        --brown-8: color(display-p3 0.469 0.377 0.287);
        --brown-9: color(display-p3 0.651 0.505 0.368);
        --brown-10: color(display-p3 0.697 0.557 0.423);
        --brown-11: color(display-p3 0.835 0.715 0.597);
        --brown-12: color(display-p3 0.938 0.885 0.802);
      }
    }
  }
}