/* Visual's colours, Phosphor on graphite: written by scripts/write-palette-css.ts from
   src/brand/palette.ts; never edit it by hand. Each signal colour has -dark, -pastel and -dim
   versions derived as Design system 1 derives its palette; the graphite is the case. */

:root {
  /* Phosphor: The accent: the glow of the box's frames, the playhead and what is selected. */
  --visual-phosphor: #9890ff;
  --visual-phosphor-dark: #3d369d;
  --visual-phosphor-pastel: #d0ccff;
  --visual-phosphor-dim: #1e1a4c;
  /* Scope: Waveforms, audio and the speed graph. */
  --visual-scope: #4fdcff;
  --visual-scope-dark: #36899d;
  --visual-scope-pastel: #ccf5ff;
  --visual-scope-dim: #1a424c;
  /* Chroma: Ready, rendered and live. */
  --visual-chroma: #5cff9d;
  --visual-chroma-dark: #369d5f;
  --visual-chroma-pastel: #ccffe0;
  --visual-chroma-dim: #1a4c2e;
  /* Amber: Keyframes, and what asks for care. */
  --visual-amber: #ffb84d;
  --visual-amber-dark: #9d7436;
  --visual-amber-pastel: #ffebcc;
  --visual-amber-dim: #4c381a;
  /* Tally: Recording, failures and the render in flight. */
  --visual-tally: #ff5a4e;
  --visual-tally-dark: #9d3d36;
  --visual-tally-pastel: #ffcfcc;
  --visual-tally-dim: #4c1d1a;
  /* Matte: Masks, mattes and the camera. */
  --visual-matte: #ff6fd8;
  --visual-matte-dark: #9d3681;
  --visual-matte-pastel: #ffccf1;
  --visual-matte-dim: #4c1a3e;
  /* Halo: The frames' halo: quiet lines and the grid. */
  --visual-halo: #ccc7df;
  --visual-halo-dark: #615b78;
  --visual-halo-pastel: #e1dfec;
  --visual-halo-dim: #2f2c3a;
  /* Leader: Film leader: the storyboard's paper. */
  --visual-leader: #f1ece2;
  --visual-leader-dark: #7c7058;
  --visual-leader-pastel: #eee8dd;
  --visual-leader-dim: #3c362a;
  --visual-console: #0e0e10; /* Around the stage, and the darkest panels. */
  --visual-casing: #161618; /* The studio's paper. */
  --visual-panel: #1e1e21; /* Panels and the timeline. */
  --visual-fader: #2a2a2e; /* Controls on the graphite. */
  --visual-rail: #3a3a3f; /* Strong lines, the box’s edge. */
  --visual-label: #8a8a93; /* Muted words. */
  --visual-legend: #ecebf2; /* Words. */
  --visual-glow: 0 0 calc(var(--ds-unit, 20px) / 2) color-mix(in srgb, var(--visual-phosphor) 55%, transparent);
}
