/* Dark rainbow (default): the dark, bold base of Bold dark, with each category
   in its own colour (the bright "-dark" shades, dark text on them). */
:root {
  color-scheme: dark;
  --bg: #0b0d12;
  --surface: #151922;
  --text: #f3f5f9;
  --muted: #a3abba;
  --line: #262b36;
  --accent: #7ee0b5;
  --on-accent: #08110d;
  --danger: #ff7b72;
  --on-danger: #1a0503;
  --warn: #ffc857;
  --ok: #5fd38d;
  --grey: #5c6475;
  --grey-ink: #ffffff;
  --track: #232836;
  --chart-bar: #2c3a40;
  --field-bg: #0b0d12;
  --field-border: #6b7385;
  --highlight: #1d2a2a;
  --total-bg: transparent;
  --total-pad: 0.25rem 0 0.75rem;
  --total-text: var(--accent);
  --header-bg: var(--bg);
  --radius: 16px;
  --radius-small: 12px;
  --rainbow-ink: #0b0d12;
  --red: var(--red-dark); --orange: var(--orange-dark); --amber: var(--amber-dark);
  --yellow: var(--yellow-dark); --lime: var(--lime-dark); --green: var(--green-dark);
  --teal: var(--teal-dark); --cyan: var(--cyan-dark); --blue: var(--blue-dark);
  --indigo: var(--indigo-dark); --violet: var(--violet-dark); --pink: var(--pink-dark);
  /* The second shades. */
  --red-2: var(--red-2-dark); --orange-2: var(--orange-2-dark); --amber-2: var(--amber-2-dark);
  --yellow-2: var(--yellow-2-dark); --lime-2: var(--lime-2-dark); --green-2: var(--green-2-dark);
  --teal-2: var(--teal-2-dark); --cyan-2: var(--cyan-2-dark); --blue-2: var(--blue-2-dark);
  --indigo-2: var(--indigo-2-dark); --violet-2: var(--violet-2-dark); --pink-2: var(--pink-2-dark);
  --header-stripe: linear-gradient(90deg, var(--red), var(--orange), var(--yellow), var(--green),
                                   var(--teal), var(--blue), var(--violet), var(--pink));
}