:root {
  --brand: #014601;

  --accent: hsl(120 97.1831% 54%);
  --accent-bright: var(--accent);
  --accent-light: color-mix(in srgb, var(--accent) 70%, var(--white));
  --accent-dark: color-mix(in srgb, var(--accent) 58%, var(--bg-deep));
  --accent-deeper: color-mix(in srgb, var(--accent) 45%, var(--bg-deep));
  --accent-ink: color-mix(in srgb, var(--accent) 35%, var(--black));
  --accent-black: color-mix(in srgb, var(--accent) 5%, var(--black));

  --on-accent: var(--accent-black);
  --on-accent-invert: 0;

  --secondary: #EE3F00;
  --secondary-light: color-mix(in srgb, var(--secondary) 72%, var(--white));
  --secondary-dark: color-mix(in srgb, var(--secondary) 60%, var(--bg-deep));

  --bg-deep: color-mix(in srgb, var(--brand) 25%, var(--black));
  --bg: color-mix(in srgb, var(--bg-deep) 89%, var(--muted));
  --panel: color-mix(in srgb, var(--bg-deep) 82%, var(--muted));
  --panel-2: color-mix(in srgb, var(--bg-deep) 77%, var(--muted));
  --chip: color-mix(in srgb, var(--bg-deep) 69%, var(--muted));
  --panel-3: color-mix(in srgb, var(--bg-deep) 62%, var(--muted));

  --white: #ffffff;
  --black: #000000;
  --muted: hsl(120 24% 47%);

  --muted-2: #647491;
  --muted-3: #6f8896;
  --muted-4: #9fb2bd;
  --muted-5: #a1bfd2;
  --muted-6: #b9cbd6;
  --silver: color-mix(in srgb, var(--white) 75%, var(--muted));

  --blue: #0081ff;
  --sky: #5ad1ff;
  --cyan: #2dc1ff;
  --purple: #b31aff;
  --violet-ink: #55158a;
  --orchid: #bd7bff;
  --orchid-deep: #7217f7;
  --magenta: #d45aff;
  --teal: #25e3cb;
  --spring: #2bff88;
  --mint: #7af0c8;
  --ice: #a9dbff;
  --gold: #ffc44d;
  --amber: #ffb02e;
  --bronze: #eda863;
  --red: #ff6b6b;
  --red-soft: color-mix(in srgb, var(--white) 10%, var(--red));
}